/* Adeo Marketing Webb 2.0 – final visual polish */

/* Interaction quality */
a,button,input,select,textarea,summary{touch-action:manipulation}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:2px solid rgba(255,146,82,.95);
  outline-offset:3px;
}
[id]{scroll-margin-top:calc(var(--header) + 22px)}

/* Keep the overall rhythm calm and intentional. */
.section-heading>p:last-child,.page-lead,.hero__lead{line-height:1.68}
.service-panel,.price-card,.form-card,.contact-card,.value-card,.process-card,.faq-list details{box-shadow:0 18px 60px rgba(0,0,0,.08)}

/* Media crops should feel editorial rather than accidental. */
.service-feature__visual,.editorial-media,.case-card__visual{isolation:isolate}
.service-feature__visual img,.editorial-media img,.case-card__visual img{backface-visibility:hidden}
.service-feature__visual img{transition:scale .7s var(--ease),filter .5s ease}

/* FAQ gets clearer touch affordance without adding noise. */
.faq-list details{transition:border-color .25s ease,background .25s ease}
.faq-list summary{position:relative;padding-right:36px;min-height:32px;display:flex;align-items:center;list-style:none}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:after{content:'+';position:absolute;right:0;top:50%;translate:0 -50%;font-size:1.3rem;font-weight:400;color:var(--champ)}
.faq-list details[open] summary:after{content:'–'}
.faq-list details[open]{border-color:rgba(201,183,156,.24);background:rgba(255,255,255,.035)}

/* Keep forms visually consistent. */
.form-card .ff-el-group{margin-bottom:17px!important}
.form-card .ff-el-form-control{transition:border-color .2s ease,background .2s ease!important}
.form-card .ff-el-form-control:focus{border-color:rgba(255,92,0,.6)!important;background:rgba(255,255,255,.06)!important}
.form-card .ff-btn-submit{cursor:pointer;transition:transform .2s var(--ease),box-shadow .2s ease!important}

/* Desktop polish */
@media(min-width:860px){
  .site-header__inner{transition:min-height .3s ease,padding .3s ease}
  .site-header.is-scrolled .site-header__inner{min-height:74px}
  .service-grid{gap:16px}
  .service-panel{min-height:300px;padding:28px}
  .service-panel__number{margin-bottom:54px}
  .client-logo-grid{gap:12px!important}
  .client-logo{min-height:116px}
  .case-stack{gap:18px}
  .case-card__content{padding:30px 34px 34px!important}
  .built-grid{gap:70px}
  .product-card{width:min(38vw,460px)}
  .cta-panel--split{min-height:360px}
  .site-footer__grid{gap:60px}
}

@media(hover:hover) and (pointer:fine){
  .service-feature__visual:hover img{scale:1.085!important;filter:saturate(1.04)}
  .price-card:hover{border-color:rgba(255,255,255,.16);transform:translateY(-2px)}
  .faq-list details:hover{border-color:rgba(255,255,255,.16)}
  .form-card .ff-btn-submit:hover{transform:translateY(-1px);box-shadow:0 10px 30px rgba(255,92,0,.2)}
}

/* Mobile-first refinement */
@media(max-width:859px){
  :root{--header:72px}
  .site-header{padding-top:env(safe-area-inset-top)}
  .site-header__inner{min-height:72px!important}
  /* Do not hard-code a dark scroll state here. Theme-specific layers loaded
   * later must be able to control the mobile header background. */
  .site-header.is-scrolled{background:rgba(10,10,11,.94)}
  .brand img{width:118px!important}

  .section{padding-top:70px!important;padding-bottom:70px!important}
  .section--compact{padding-top:18px!important}
  .page-hero{padding-top:calc(var(--header) + 46px)!important;padding-bottom:52px!important}
  .page-hero h1,.hero h1{line-height:1.075!important;letter-spacing:-.002em!important}
  .section-heading h2{line-height:1.04!important}
  .page-lead,.hero__lead{font-size:1rem!important;line-height:1.65}

  .primary-nav{top:calc(var(--header) + env(safe-area-inset-top) + 8px)!important;max-height:calc(100svh - var(--header) - env(safe-area-inset-top) - 26px)!important}
  .primary-nav__list a{justify-content:flex-start}
  .primary-nav>.button{width:100%!important;min-height:54px!important}

  .service-grid{gap:11px}
  .service-panel{min-height:260px;padding:22px!important;border-radius:22px}
  .service-panel__number{margin-bottom:38px}
  .service-panel h3{font-size:clamp(2rem,10vw,2.9rem)!important}
  .service-panel p{line-height:1.55}

  .client-logos__head{margin-bottom:20px!important}
  .client-logo-grid{gap:8px!important}
  .client-logo{min-height:88px!important;padding:13px!important;border-radius:16px!important}
  .client-logo img{max-height:50px!important}

  .section--work{padding-bottom:88px!important}
  .case-stack{gap:14px}
  .case-card{top:calc(var(--header) + 12px)!important;border-radius:24px!important}
  .case-card__visual{height:51svh!important;min-height:300px!important}
  .case-card__content{padding:22px 20px 25px!important;min-height:0!important}
  .case-card__content h3{margin-top:9px!important;margin-bottom:8px!important}

  .section--statement{padding-block:82px!important}
  .statement p{line-height:1!important}

  .built-grid{gap:28px!important}
  .product-object{min-height:300px!important;padding-block:10px}
  .product-card{width:min(82vw,390px)!important;padding:22px!important;border-radius:26px!important}

  .cta-panel--split{padding:28px 22px!important;border-radius:24px!important;gap:26px!important}
  .cta-panel--split .cta-panel__copy h2{font-size:clamp(2.35rem,10.5vw,4rem)!important;line-height:1.04!important}
  .cta-panel__action .button{width:100%!important}

  .service-feature{padding-block:60px}
  .service-feature__grid{gap:24px!important}
  .service-feature__visual{aspect-ratio:4/3!important;min-height:0!important;border-radius:22px!important;overflow:hidden!important}
  .service-feature__visual img{width:100%;height:100%;object-fit:cover!important}
  .service-feature__copy h2{line-height:1.04!important}
  .service-list article{padding:17px 0!important}

  .pricing-grid{gap:12px!important}
  .price-card{padding:24px 22px!important;border-radius:23px!important}
  .price-card__intro{min-height:0!important}
  .package-list{margin:22px 0 28px!important;gap:10px!important}

  .form-layout,.contact-layout--v2,.faq-grid{gap:28px!important}
  .form-card,.contact-card{padding:22px!important;border-radius:23px!important}
  .form-card .ff-el-form-control{min-height:52px!important}
  .form-card .ff-btn-submit{width:100%!important;min-height:52px!important}
  .faq-list details{padding:17px 18px!important;border-radius:16px!important}
  .faq-list summary{min-height:42px}

  .newsletter-band{padding:32px 0 42px!important;gap:24px!important}
  .site-footer__grid{padding-top:38px!important;gap:28px!important}
  .site-footer__statement{margin-top:18px!important}
  .site-footer__bottom{margin-top:34px!important}

  .mobile-sticky-contact{left:10px!important;right:10px!important;bottom:max(10px,env(safe-area-inset-bottom))!important}
}

@media(max-width:520px){
  .shell{width:min(calc(100% - 22px),var(--shell))!important}
  .section{padding-top:62px!important;padding-bottom:62px!important}
  .hero{min-height:80svh!important;padding-top:calc(var(--header) + 24px)!important}
  .hero__actions{margin-top:24px!important}
  .hero__actions .button{width:100%!important}
  .hero__actions .text-link{width:auto!important}
  .signal--hero{margin-top:20px!important}

  .primary-nav{left:8px!important;right:8px!important;border-radius:20px!important}
  .primary-nav__list{grid-template-columns:1fr 1fr!important}
  .primary-nav__list li a,.primary-nav__list li.is-mobile-secondary a{min-height:52px!important;font-size:.82rem!important}

  .case-card__visual{height:48svh!important;min-height:285px!important}
  .product-card{width:min(84vw,360px)!important}
  .service-feature__visual{aspect-ratio:1/1!important}
  .client-logo{min-height:82px!important}
  .newsletter-popup__panel{max-height:calc(100svh - 20px);overflow:auto}
}

@media(prefers-reduced-motion:reduce){
  .service-feature__visual img,.price-card,.faq-list details,.form-card .ff-btn-submit{transition:none!important}
}
