/* v1.0.68 — final visual, interaction and responsive QA layer for inner pages. */
.onon-inner{overflow-x:clip;color-scheme:light;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.onon-inner section[id],.onon-inner [id]:where(section,article){scroll-margin-top:calc(var(--onon-header,90px) + 24px)}
.onon-inner :where(a,button,summary,input,select,textarea):focus-visible{outline:2px solid #c52a61;outline-offset:4px}

/* Font Awesome declares icons as inline/block depending on its build. Normalise every
   framed action glyph so both the glyph and its pseudo element share the same centre. */
.onon-inner :where(.onon-services-card__icon,.onon-services-card__arrow,.onon-web-process li>i,.onon-service-process li>i,.onon-inner-cta__button>i,.onon-web-final a>i,.onon-reference-method__steps article>i){display:grid!important;place-items:center!important;text-align:center!important;line-height:1!important}
.onon-inner :where(.onon-services-card__icon,.onon-services-card__arrow,.onon-web-process li>i,.onon-service-process li>i,.onon-inner-cta__button>i,.onon-web-final a>i,.onon-reference-method__steps article>i)::before{display:block!important;margin:auto!important;line-height:1!important;text-align:center!important}

/* WordPress admin toolbar must never cover the fixed ONON header while editing. */
.admin-bar #onon-site-header{top:32px}
.admin-bar .onon-inner{padding-top:32px}

/* Shared surface language: precise radii, calmer shadows and predictable copy colour. */
.onon-inner :where(.onon-services-card,.onon-web-bento__grid article,.onon-service-scope__grid article,.onon-commerce-scope__card,.onon-commerce-fit__card,.onon-social-scope__card,.onon-social-format,.onon-seo-scope__grid article,.onon-production-scope__grid article,.onon-graphic-services__grid article,.onon-reference-method__steps article,.onon-reference-wall__grid article,.onon-blog-card){backface-visibility:hidden;transform:translateZ(0)}
.onon-inner :where(.onon-inner-kicker,.onon-inner-section-head,.onon-web-marquee span){font-weight:650}
.onon-inner :where(p,li){text-wrap:pretty}

@media (hover:hover) and (pointer:fine){
  .onon-inner :where(.onon-web-process li,.onon-service-process li,.onon-commerce-scope__card,.onon-social-scope__card,.onon-seo-scope__grid article,.onon-production-scope__grid article,.onon-graphic-services__grid article,.onon-reference-method__steps article,.onon-blog-card):hover{background:linear-gradient(145deg,rgba(177,31,85,.3),rgba(92,13,43,.22))!important;border-color:rgba(237,185,201,.3)!important;color:#fff!important;box-shadow:0 20px 48px rgba(72,12,36,.16)}
  .onon-inner :where(.onon-commerce-scope__card,.onon-social-scope__card,.onon-seo-scope__grid article,.onon-production-scope__grid article,.onon-graphic-services__grid article,.onon-reference-method__steps article,.onon-blog-card):hover :where(h2,h3,h4,strong){color:#fff!important}
  .onon-inner :where(.onon-commerce-scope__card,.onon-social-scope__card,.onon-seo-scope__grid article,.onon-production-scope__grid article,.onon-graphic-services__grid article,.onon-reference-method__steps article,.onon-blog-card):hover :where(p,li,small,span){color:#f0c9d6!important}
  .onon-inner :where(.onon-web-bento__grid article,.onon-commerce-fit__card,.onon-social-format,.onon-services-card,.onon-inner-principles__grid article,.onon-reference-wall__grid article):hover{border-color:rgba(177,31,85,.28)!important;box-shadow:0 22px 52px rgba(89,24,48,.11)}
  .onon-inner :where(.onon-inner-cta__button,.onon-service-detail__primary,.onon-reference-final a,.onon-blog-newsletter a):hover{background-color:#68102f!important;border-color:#68102f!important;color:#fff!important}
}

@media (min-width:768px){
  .onon-web-manifesto{padding:112px 0 96px}
  .onon-web-manifesto__layout{grid-template-columns:minmax(280px,.72fr) minmax(560px,1.28fr);gap:clamp(54px,7vw,110px)}
  .onon-web-lab__frame{top:calc(var(--onon-header,90px) + 28px);height:min(58vh,560px);min-height:440px}
  .onon-web-lab__steps{padding:34vh 0 4vh}
  .onon-web-lab__steps li{min-height:34vh;padding-inline:18px;border-bottom:1px solid rgba(255,255,255,.1)}
  .onon-web-lab__steps li:last-child{border-bottom:0}
}

.onon-inner :where(.onon-web-bento,.onon-web-process,.onon-service-process,.onon-service-faq,.onon-commerce-scope,.onon-commerce-fit,.onon-social-scope,.onon-social-formats,.onon-seo-scope,.onon-seo-local,.onon-production-scope,.onon-production-showcase,.onon-graphic-services,.onon-graphic-system,.onon-reference-wall,.onon-reference-method,.onon-blog-index,.onon-contact-main){padding-block:clamp(88px,7.4vw,116px)}
.onon-inner :where(.onon-web-final,.onon-reference-final,.onon-blog-newsletter){padding-block:clamp(88px,7vw,108px)}

@media (max-width:1100px){
  .onon-web-manifesto__layout{grid-template-columns:1fr;gap:50px}
  .onon-web-manifesto header{position:static;max-width:760px}
  .onon-web-lab{width:100%;max-width:820px;margin-left:auto}
}

@media (max-width:767px){
  .onon-inner{--onon-header:88px}
  .admin-bar #onon-site-header{top:46px}
  .admin-bar .onon-inner{padding-top:46px}
  .onon-inner-shell{width:min(100% - 34px,1280px)}
  .onon-inner :where(.onon-inner-hero,.onon-services-hero){min-height:auto;padding-top:calc(var(--onon-header) + 34px);padding-bottom:62px}
  .onon-inner :where(.onon-inner-hero h1,.onon-services-hero h1){font-size:clamp(42px,11.8vw,52px);line-height:.92;letter-spacing:-.057em}
  .onon-web-hero,.onon-service-detail-hero{min-height:auto;padding-top:calc(var(--onon-header) + 28px)}
  .onon-web-hero__layout{gap:38px;padding-bottom:58px}
  .onon-web-hero__copy h1,.onon-service-detail-hero__copy h1{font-size:clamp(42px,11.8vw,52px);line-height:.92;letter-spacing:-.057em}
  .onon-web-stage__tag{backdrop-filter:none}
  .onon-web-manifesto{padding:68px 0 64px}
  .onon-web-manifesto__layout{gap:36px}
  .onon-web-manifesto header h2{font-size:40px;line-height:.96}
  .onon-web-lab__frame{position:relative;top:auto;height:400px;min-height:0;border-radius:23px}
  .onon-web-lab__steps{padding:12px 0 0;display:grid;gap:8px}
  .onon-web-lab__steps li{min-height:108px;padding:17px;grid-template-columns:30px 1fr;align-content:center;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(255,255,255,.025)}
  .onon-web-lab__steps h3{font-size:23px}
  .onon-inner :where(.onon-web-bento,.onon-web-process,.onon-service-overview,.onon-service-scope,.onon-service-process,.onon-service-faq,.onon-commerce-scope,.onon-commerce-fit,.onon-social-scope,.onon-social-formats,.onon-seo-scope,.onon-seo-local,.onon-production-scope,.onon-production-showcase,.onon-graphic-services,.onon-graphic-system,.onon-reference-wall,.onon-reference-method,.onon-blog-index,.onon-contact-main,.onon-contact-services){padding-block:68px}
  .onon-inner :where(.onon-web-final,.onon-reference-final,.onon-blog-newsletter){padding-block:70px}
  .onon-inner :where(.onon-references-hero,.onon-blog-hero,.onon-contact-hero,.onon-legal-hero){min-height:auto;padding-top:calc(var(--onon-header) + 34px);padding-bottom:64px}
  .onon-inner :where(.onon-references-hero h1,.onon-blog-hero h1,.onon-contact-hero h1,.onon-legal-hero h1){font-size:clamp(42px,11.8vw,52px);line-height:.92;letter-spacing:-.057em}
  .onon-inner .onon-inner-hero__copy h1,
  .onon-inner .onon-services-hero__copy h1,
  .onon-inner .onon-web-hero__copy h1,
  .onon-inner .onon-service-detail-hero__copy h1,
  .onon-inner .onon-references-hero h1,
  .onon-inner .onon-blog-hero h1,
  .onon-inner .onon-contact-hero h1,
  .onon-inner .onon-legal-hero h1{font-size:clamp(42px,11.8vw,52px);line-height:.92;letter-spacing:-.057em}
  .onon-inner :where(.onon-service-scope__grid article,.onon-commerce-scope__card,.onon-social-scope__card,.onon-seo-scope__grid article,.onon-production-scope__grid article,.onon-graphic-services__grid article){min-height:210px}
  .onon-inner :where(.onon-inner-section-head,.onon-references-hero__foot){gap:14px}
  .onon-inner :where(.onon-services-card,.onon-web-bento__grid article,.onon-web-process li,.onon-service-process li,.onon-commerce-scope__card,.onon-commerce-fit__card,.onon-social-scope__card,.onon-social-format,.onon-seo-scope__grid article,.onon-production-scope__grid article,.onon-graphic-services__grid article,.onon-reference-method__steps article,.onon-reference-wall__grid article,.onon-blog-card):hover{transform:none!important}
}

@media (max-width:782px) and (min-width:768px){
  .admin-bar #onon-site-header{top:46px}
  .admin-bar .onon-inner{padding-top:46px}
}

@media (prefers-reduced-motion:reduce){
  .onon-inner *,.onon-inner *::before,.onon-inner *::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}