/* Site-wide vertical rhythm. Adjacent section half-spaces add up to one gap. */
:root{--layout-gap:104px;--layout-half:52px;--layout-small:24px}
@media(max-width:760px){:root{--layout-gap:72px;--layout-half:36px;--layout-small:20px}}
body main>.section,
body .home-opening>.about-preview,
body footer>.contact-banner.titan-cta{
 padding-top:var(--layout-half)!important;
 padding-bottom:var(--layout-half)!important;
 margin-top:0!important;margin-bottom:0!important;
}
body main>.page-intro,
body main>.listing-hero.listing-hero,
body main>.service-detail-hero>.page-intro,
body main>.work-hero{padding-bottom:var(--layout-half)!important;margin-bottom:0!important;min-height:0}
body main>.service-detail-hero{margin-bottom:0!important}
body main>.work-hero::before{height:var(--layout-half)}
/* Remove trailing content margins that otherwise add another invisible gap. */
body main>.section>:last-child,
body .home-opening>.about-preview>:last-child,
body main>.page-intro>:last-child,
body main>.service-detail-hero>.page-intro>:last-child,
body main>.work-hero>:last-child{margin-bottom:0!important}
body main>.section>.section-heading,
body .home-opening>.about-preview>.section-heading{margin-bottom:var(--layout-half)!important}
body :is(.service-index,.work-index,.faq-index)>.service-filters.category-hierarchy{margin:0 0 var(--layout-gap)!important}
body .category-hierarchy .category-children{margin-top:var(--layout-half)!important}
body .category-hierarchy .category-label{margin-bottom:var(--layout-small)!important}
body .faq-index .faq-groups{margin-top:0!important;row-gap:var(--layout-gap)}
body .faq-index>.faq-contact{margin-top:var(--layout-gap)!important}
body .faq-home{row-gap:var(--layout-gap)!important}
body .faq-home>.faq-contact{margin-top:0!important}
body .faq-home>.faq-list{margin-top:0!important}
/* Framed closing panels are separated from the previous content by the same gap. */
body main>.service-complete-card{margin-top:var(--layout-half)!important;margin-bottom:var(--layout-half)!important}
body .detail-layout .steps li:last-child{padding-bottom:0}
@media(max-width:760px){
 /* The mobile photograph remains a content area; its external gap follows the shared spacing. */
 body main>.listing-hero.listing-hero{padding-bottom:240px!important}
 body main>.listing-hero.listing-hero .listing-hero-image{height:310px}
 body .faq-home{display:grid!important;grid-template-columns:minmax(0,1fr)}
 body .faq-home>.faq-contact{grid-column:auto}
}

/* Shared footer spacing; sticky reveal is controlled in luxury.css. */
body footer>.footer-body{padding-top:var(--layout-half);padding-bottom:var(--layout-half)}
body footer .footer-bottom{margin-top:var(--layout-half);padding-top:var(--layout-half)}
body footer .footer-top>:first-child>p:last-child{margin-bottom:0}

/* Fixed header ink, independent of photographs and scroll position. */
body header :is(#navigation>a:not(.btn),.nav-toggle,.mobile-toggle){color:var(--action-bg)!important;text-shadow:none!important;mix-blend-mode:normal!important}
/* More room within content groups as well as between sections. */
body main :is(.section-heading,.page-intro)>.eyebrow{margin-bottom:var(--layout-half)!important}
body main :is(.section-heading,.page-intro)>h1,
body main :is(.section-heading,.page-intro)>h2{margin-bottom:var(--layout-half)!important}
body main :is(.editorial-grid,.work-grid,.product-grid,.about-strengths,.partner-layout){gap:var(--layout-half)!important}
body main :is(.cta-card,.finance-panel,.visit-box){padding:var(--layout-half)!important}
body main .category-options{gap:var(--layout-small)!important}
body .faq-list details{padding-top:var(--layout-small)!important;padding-bottom:var(--layout-small)!important}
body :is(.faq-home,.faq-index)>.faq-contact{padding-top:var(--layout-half)!important;padding-bottom:var(--layout-half)!important;grid-template-columns:minmax(0,1fr) max-content}
/* Equal left inset and text-to-arrow distance; no space-between expansion. */
body .btn{--button-inset:22px;padding-left:var(--button-inset)!important;padding-right:var(--button-inset)!important;gap:var(--button-inset)!important;justify-content:center!important}
body .btn>.arrow-right{margin-left:0!important;margin-right:0!important;flex-shrink:0}
body header :is(.header-contact,.mega-footer .btn),
body :is(.faq-home,.faq-index)>.faq-contact>.btn{width:max-content!important;max-width:100%;flex:none}
@media(max-width:760px){
 body .btn{--button-inset:20px}
 body :is(.faq-home,.faq-index)>.faq-contact{display:block}
}

/* Internal hero typography follows the Realizzazioni reference spacing. */
body main .page-intro .eyebrow{margin-top:0!important;margin-bottom:25px!important}
body main .page-intro h1{margin-top:0!important;margin-bottom:30px!important}
body main .page-intro .lead{margin-top:0!important;margin-bottom:0!important}
body.page-chi-siamo main>.about-section{background:var(--beige)!important}

/* One readable filter row: complete collection first, then individual types. */
body :is(.service-index,.work-index,.faq-index)>.service-filters.category-hierarchy{
 flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:flex-start;
 gap:20px;width:100%;max-width:100%;overflow-x:auto;padding:5px 4px 12px;
 box-sizing:border-box;scrollbar-width:thin;scrollbar-color:#b5a18b transparent;
}
body .category-hierarchy .category-children{
 display:flex;align-items:center;flex:0 0 auto;width:auto;max-width:none;
 margin:0!important;padding:0 0 0 20px;border-left:1px solid #b5a18b;
}
body .category-hierarchy .category-label{display:none}
body .category-hierarchy .category-options{display:flex;flex-wrap:nowrap;gap:12px!important}
body .category-hierarchy.category-hierarchy.category-hierarchy button{
 flex:0 0 auto;min-height:48px;padding:13px 20px;white-space:nowrap;text-align:center;
}
@media(max-width:760px){
 body :is(.service-index,.work-index,.faq-index)>.service-filters.category-hierarchy{gap:12px}
 body .category-hierarchy .category-children{padding-left:12px}
 body .category-hierarchy .category-options{gap:10px!important}
 body .category-hierarchy.category-hierarchy.category-hierarchy button{padding:13px 16px}
}

/* A clear inline prompt links the type options to the complete collection. */
body .category-hierarchy .category-children{gap:18px}
body .category-hierarchy .category-label{
 display:block;flex:none;margin:0!important;white-space:nowrap;
 font-size:11px;line-height:20px;color:var(--muted);
}
/* Restore the lighter FAQ rhythm without changing the other sections. */
body :is(.faq-index,.faq-home){--layout-gap:64px;--layout-half:32px;--layout-small:16px}
body :is(.faq-index,.faq-home) .faq-list details{padding-top:0!important;padding-bottom:0!important}
@media(max-width:760px){
 body .category-hierarchy .category-children{gap:12px}
 body :is(.faq-index,.faq-home){--layout-gap:40px;--layout-half:20px;--layout-small:12px}
}

/* External section spacing is independent of the compact FAQ content rhythm. */
:root{--section-inset:52px}
@media(max-width:760px){:root{--section-inset:36px}}
body main>.section,
body .home-opening>.about-preview,
body footer>.contact-banner.titan-cta{
 padding-top:var(--section-inset)!important;padding-bottom:var(--section-inset)!important;
}
/* An unpaired visible FAQ category uses the whole row, including filtered views. */
body .faq-index .faq-group:nth-child(odd of .faq-group:not([hidden])):not(:has(~.faq-group:not([hidden]))){grid-column:1/-1}

/* A full reference-sized inset on each side of a section boundary, including
   background changes. Do not split this space between neighbouring sections. */
:root{--section-inset:88px}
@media(max-width:760px){:root{--section-inset:60px}}
body main>.section,
body .home-opening>.about-preview,
body footer>.contact-banner.titan-cta,
body footer>.footer-body{
 padding-top:var(--section-inset)!important;padding-bottom:var(--section-inset)!important;
 margin-top:0!important;margin-bottom:0!important;
}
/* The introductory photograph already supplies the space above its filter row. */
body main>.page-intro,
body main>.service-detail-hero>.page-intro,
body main>.work-hero{padding-bottom:0!important}
body main>.service-detail-hero{margin-bottom:0!important}
body main>.section>:first-child{margin-top:0!important}
body main>.section>:last-child{margin-bottom:0!important}
body :is(.service-index,.work-index,.faq-index)>.service-filters.category-hierarchy{
 margin-bottom:calc(var(--section-inset) - 12px)!important;
}
/* Keep generous separation between major blocks, with compact FAQ rows inside. */
body .faq-index>.faq-contact{margin-top:var(--section-inset)!important}
body .faq-home{row-gap:var(--section-inset)!important}
@media(max-width:760px){
 body main>.listing-hero.listing-hero{padding-bottom:240px!important}
}
@media(min-width:761px){body main>.listing-hero.listing-hero{padding-bottom:0!important}}

/* Plain hero sections need their own breathing room before the background changes. */
body:is(.page-contatti,.page-chi-siamo) main>.page-intro{
 padding-bottom:var(--section-inset)!important;
}

/* Let the photograph continue below the copy while preserving the filter gap. */
@media(min-width:761px){
 body main>.listing-hero.listing-hero{padding-bottom:calc(var(--section-inset)/2)!important}
 body main>.listing-hero.listing-hero+.section{padding-top:calc(var(--section-inset)/2)!important}
 body main>.listing-hero.listing-hero .listing-hero-image{object-position:center 40%}
 body.page-faq main>.listing-hero.listing-hero .listing-hero-image{object-position:65% 40%}
}
@media(max-width:760px){
 body main>.listing-hero.listing-hero .listing-hero-image{object-position:center 35%}
 body.page-faq main>.listing-hero.listing-hero .listing-hero-image{object-position:right 35%}
}

/* Service detail heroes must retain space below their final title. */
body main>.service-detail-hero>.page-intro{padding-bottom:var(--section-inset)!important}
/* The service index invitation is a compact panel, not a full-height section. */
body main>.section.service-complete-card{
 padding-top:calc(var(--section-inset)/2)!important;
 padding-bottom:calc(var(--section-inset)/2)!important;
 min-height:0!important;
}
body main>.service-complete-card>.section-heading{
 display:flex;align-items:center;justify-content:space-between;gap:32px;
 margin:0!important;min-height:0;
}
body main>.service-complete-card>.section-heading>h2{margin:0!important}
body main>.service-complete-card>.section-heading>.btn{margin:0!important;flex-shrink:0;align-self:center}
@media(max-width:760px){
 body main>.service-complete-card>.section-heading{align-items:flex-start;flex-direction:column;gap:24px}
 body main>.service-complete-card>.section-heading>.btn{align-self:flex-start}
}

/* Three projects per row, with tighter gutters and responsive fallbacks. */
body .work-index .work-grid{gap:32px!important}
@media(min-width:1101px){
 body .work-index .work-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 body .work-index .work-grid .editorial-card{min-height:300px;padding:26px}
}
@media(min-width:761px) and (max-width:1100px){
 body .work-index .work-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px!important}
}
@media(max-width:760px){body .work-index .work-grid{grid-template-columns:1fr;gap:20px!important}}
/* Light navigation only while the transparent header overlays a dark hero. */
body header.at-page-top.over-dark-hero:not(:has([aria-expanded="true"])) :is(#navigation>a:not(.btn),.nav-toggle,.mobile-toggle){color:var(--cream)!important;text-shadow:0 1px 3px #211a1540!important}

/* Services share the same three-column rhythm as Projects. */
body .service-index .service-work-grid{gap:32px!important}
@media(min-width:1101px){
 body .service-index .service-work-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 body .service-index .service-entry .service-card{min-height:300px;padding:26px}
}
@media(min-width:761px) and (max-width:1100px){
 body .service-index .service-work-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px!important}
}
@media(max-width:760px){body .service-index .service-work-grid{grid-template-columns:1fr;gap:20px!important}}

/* Photo-led Contact and About heroes use the same geometry as the other indexes. */
@media(min-width:761px){
 body:is(.page-contatti,.page-chi-siamo) main>.page-intro.listing-hero{padding-bottom:calc(var(--section-inset)/2)!important}
 body:is(.page-contatti,.page-chi-siamo) main>.listing-hero+.section{padding-top:calc(var(--section-inset)/2)!important}
 body:is(.page-contatti,.page-chi-siamo) main>.listing-hero .listing-hero-copy{max-width:58%}
 body:is(.page-contatti,.page-chi-siamo) main>.listing-hero .listing-hero-image{object-position:70% 40%}
}
@media(max-width:760px){
 body:is(.page-contatti,.page-chi-siamo) main>.page-intro.listing-hero{padding-bottom:240px!important}
 body:is(.page-contatti,.page-chi-siamo) main>.listing-hero .listing-hero-image{object-position:right center}
}
/* The final main section already supplies the gap before the closing CTA. */
body footer>.contact-banner.titan-cta{padding-top:0!important}
/* Framed service invitations have no external bottom inset of their own. */
body:has(main>.service-complete-card:last-child) footer>.contact-banner.titan-cta{padding-top:var(--section-inset)!important}
@media(min-width:761px){body.page-contatti main>.listing-hero .listing-hero-image{object-position:70% top}}

/* Keep the complete phone in view instead of enlarging it to the full hero width. */
@media(min-width:761px){
 body.page-contatti main>.listing-hero.listing-hero .listing-hero-image{
  width:72%;height:100%;inset:0 0 0 auto;object-fit:contain;object-position:right center;
  mask-image:linear-gradient(90deg,transparent 0%,#000 32%);
 }
 body.page-contatti main>.listing-hero.listing-hero::after{height:80px}
}
@media(max-width:760px){
 body.page-contatti main>.listing-hero.listing-hero .listing-hero-image{
  object-fit:contain;object-position:right bottom;
  mask-image:linear-gradient(180deg,transparent 0%,#000 24%);
 }
 body.page-contatti main>.listing-hero.listing-hero::after{height:55px}
}
body.page-contatti main>.contact-form-section,
body.page-chi-siamo main>.about-section{background:var(--cream)!important}
@media(min-width:761px){
 body.page-contatti main>.listing-hero.listing-hero .listing-hero-image{
  width:auto;max-width:75%;height:calc(100% - 65px);inset:65px 0 0 auto;
  mask-image:linear-gradient(90deg,transparent 0%,#00000035 15%,#000000a0 30%,#000 46%);
 }
}
@media(min-width:761px){
 body.page-contatti main>.listing-hero.listing-hero .listing-hero-image{
  mask-image:linear-gradient(90deg,transparent 0%,#00000035 15%,#000000a0 30%,#000 46%),linear-gradient(180deg,transparent,#000 35px);
  mask-composite:intersect;
 }
}

/* Split the closing gap evenly around the background boundary. */
body main>.section:last-child:not(.service-complete-card){padding-bottom:calc(var(--section-inset)/2)!important}
body footer>.contact-banner.titan-cta{padding-top:calc(var(--section-inset)/2)!important}
body:has(main>.service-complete-card:last-child) footer>.contact-banner.titan-cta{padding-top:var(--section-inset)!important}
/* Larger phone composition, with its complete screen below the header. */
@media(min-width:761px){
 body.page-contatti main>.listing-hero.listing-hero .listing-hero-image{
  height:calc(100% + 32px);width:auto;max-width:85%;inset:0 0 auto auto;
  object-fit:contain;object-position:right top;
 }
}
body.page-contatti .contact-form-section>.contact-form{background:var(--beige)!important}

/* Soft tonal form surface with clearly separated cream fields. */
body.page-contatti .contact-form-section>.contact-form{
 background:linear-gradient(135deg,#f2e9dd 0%,#f4ede3 45%,#f8f3eb 100%)!important;
}
body.page-contatti .contact-form :is(input,select,textarea){background:var(--cream)!important}
/* A larger, gently blended contact photograph. */
@media(min-width:761px){
 body.page-contatti main>.listing-hero.listing-hero .listing-hero-image{
  height:calc(100% + 140px);width:auto;max-width:none;inset:0 -20px auto auto;
  mask-image:linear-gradient(90deg,transparent 0%,#00000008 10%,#00000028 20%,#00000066 32%,#000000ae 44%,#000000e0 56%,#000 70%),linear-gradient(180deg,transparent 0%,#00000060 8%,#000000cd 17%,#000 26%);
  mask-composite:intersect;
 }
 body.page-contatti main>.listing-hero.listing-hero::after{
  height:130px;background:linear-gradient(180deg,#FAF6EF00 0%,#FAF6EF0a 15%,#FAF6EF2b 35%,#FAF6EF70 58%,#FAF6EFc7 80%,#FAF6EF 100%);
 }
}
@media(max-width:760px){
 body.page-contatti main>.listing-hero.listing-hero .listing-hero-image{
  object-fit:cover;object-position:75% center;
  mask-image:linear-gradient(180deg,transparent 0%,#00000020 15%,#00000075 32%,#000000c9 50%,#000 70%);
 }
 body.page-contatti main>.listing-hero.listing-hero::after{height:85px}
}

/* One full inset at every section edge, including all internal-page heroes.
   This is the same 88px as the reference CTA-to-footer space (60px on mobile). */
body main>.section:last-child:not(.service-complete-card),
body footer>.contact-banner.titan-cta,
body main>.page-intro,
body main>.work-hero{padding-bottom:var(--section-inset)!important}
body footer>.contact-banner.titan-cta,
body main>.listing-hero.listing-hero+.section{padding-top:var(--section-inset)!important}
@media(min-width:761px){
 body main>.listing-hero.listing-hero,
 body:is(.page-contatti,.page-chi-siamo) main>.page-intro.listing-hero{padding-bottom:var(--section-inset)!important}
 body:is(.page-contatti,.page-chi-siamo) main>.listing-hero+.section{padding-top:var(--section-inset)!important}
}
/* The work details remain fully above the fade, even when metadata wraps. */
body main>.work-hero::before{height:var(--section-inset);pointer-events:none}
body main>.work-hero .work-overview>:last-child>:last-child{margin-bottom:0}
/* Centre the phone in the open right-hand header area, with its screen intact. */
@media(min-width:761px){
 body.page-contatti main>.listing-hero.listing-hero .listing-hero-image{
  width:min(1100px,78vw);height:auto;max-width:none;
  inset:0 calc(28% - min(368.5px,26.13vw)) auto auto;
  mask-image:linear-gradient(90deg,transparent 0%,#00000008 10%,#00000028 20%,#00000066 32%,#000000ae 44%,#000000e0 56%,#000 66%);
  mask-composite:add;
 }
}

/* Only one section inset before the closing panel, not two stacked insets. */
body footer>.contact-banner.titan-cta{padding-top:0!important}
body:has(main>.service-complete-card:last-child) footer>.contact-banner.titan-cta{padding-top:var(--section-inset)!important}
/* Extend the contact photo to the viewport edge without an exposed right strip. */
@media(min-width:761px){
 body.page-contatti main>.listing-hero.listing-hero .listing-hero-image{
  width:min(1250px,85vw);height:auto;inset:0 0 auto auto;
 }
}
/* Project heroes follow service heroes: title on the image, details below. */
body main>.work-hero{padding-top:150px}
body main>.work-hero::before{display:none}
body main>.work-hero::after{background:#211a1266}
body main>.work-hero .work-backdrop{filter:blur(3px) brightness(.85)!important}
body main>.work-hero .work-back{margin-bottom:25px}
body main>.work-hero .eyebrow{margin-bottom:25px}
body main>.work-hero h1{margin-bottom:30px}
body main>.work-hero .work-subtitle{margin:0}
body main>.work-description{padding-bottom:0!important}
body .work-description .work-overview{color:var(--ink)}
body .work-description .work-overview>p{color:var(--muted)}
body .work-description .work-overview .metadata-label{color:var(--muted)}
@media(max-width:760px){body main>.work-hero{padding-top:130px}}

/* Metadata now sits on cream: remove the old dark-hero ink and trailing space. */
body .work-description .work-overview>div>p:not(.metadata-label){color:var(--ink)!important}
body .work-description .work-overview>div>:last-child{margin-bottom:0!important}
/* Keep the visible card-to-CTA gap equal to the CTA-to-footer gap. */
body main>.service-index:last-child{padding-bottom:var(--section-inset)!important}
body .service-index .service-work-grid{margin-bottom:0!important;padding-bottom:0!important}
body .service-index .service-entry{margin-bottom:0!important;padding-bottom:0!important}

/* Optical centring between the header links and the next section's content.
   Move only the copy, preserving the photograph and established section edges. */
body.inner-page{--hero-copy-offset:40px}
body.inner-page main>.listing-hero .listing-hero-copy,
body.inner-page main>.page-intro:not(.listing-hero)>*,
body.inner-page main>.service-detail-hero>.page-intro>*,
body.inner-page main>.work-hero>.work-heading{position:relative;top:var(--hero-copy-offset)}
@media(max-width:760px){body.inner-page{--hero-copy-offset:20px}}
/* The home ends on a beige surface, so the closing CTA needs a cream inset. */
body.home-page footer>.contact-banner.titan-cta{padding-top:var(--section-inset)!important}

/* Separate the beige partnership surface from the closing CTA on the project index. */
body.page-realizzazioni:has(main>.partnership-section:last-child) footer>.contact-banner.titan-cta{padding-top:var(--section-inset)!important}

/* Mobile refinements only. Desktop rules above remain unchanged. */
@media(max-width:760px){
 /* Keep the lead on a pale field; let the photograph finish without a bottom fade. */
 body main>.listing-hero.listing-hero .listing-hero-image,
 body.page-contatti main>.listing-hero.listing-hero .listing-hero-image{
  mask-image:linear-gradient(180deg,transparent 0%,#00000000 22%,#00000012 36%,#00000050 52%,#000000ad 69%,#000000e8 84%,#000 100%);
  mask-composite:add;
 }
 body main>.listing-hero.listing-hero::after,
 body.page-contatti main>.listing-hero.listing-hero::after{display:none}
 /* Keep all category choices visible, without horizontal scrolling. */
 body :is(.service-index,.work-index,.faq-index)>.service-filters.category-hierarchy{
  flex-direction:column;align-items:stretch;gap:24px;overflow:visible;padding:0;
  margin-bottom:var(--section-inset)!important;
 }
 body .category-hierarchy .category-children{
  flex-direction:column;align-items:stretch;width:100%;max-width:100%;
  padding:0;border:0;gap:16px;
 }
 body .category-hierarchy .category-options{flex-direction:column;width:100%;gap:12px!important}
 body .category-hierarchy.category-hierarchy.category-hierarchy button{width:100%;box-sizing:border-box}
 body .category-hierarchy .category-label{text-align:left}
 /* FAQ invitation is aligned with its copy. */
 body .faq-home>.faq-contact>.btn{margin-left:0!important;margin-right:auto!important;justify-self:start!important}
 /* Both navigation actions occupy the menu's available width. */
 body header .mega-footer{width:100%;padding-left:0;padding-right:0;box-sizing:border-box}
 body header .mega-footer .btn{width:100%!important;min-height:50px;box-sizing:border-box}
 body main>.service-complete-card>.section-heading>.btn{width:100%!important;box-sizing:border-box}
 /* The preceding cream section already supplies the full mobile CTA gap. */
 body.page-chi-siamo footer>.contact-banner.titan-cta,
 body.page-servizi:has(main>.service-index) footer>.contact-banner.titan-cta{padding-top:0!important}
 /* Account for the lowered hero copy: equal visible space on both sides of the boundary. */
 body main>.service-detail-hero>.page-intro,
 body main>.work-hero{padding-bottom:calc(var(--section-inset) + var(--hero-copy-offset))!important}
 /* The arrow uses a fixed right column regardless of label length. */
 body .contact-form-actions>.btn{display:flex;justify-content:space-between!important;text-align:left;width:100%;box-sizing:border-box}
 body .contact-form-actions>.btn>span{flex:0 0 24px;margin-left:auto}
}

/* Balanced mobile index heroes: compact copy and a proportionate photo area. */
@media(max-width:760px){
 body main>.page-intro.listing-hero.listing-hero,
 body:is(.page-contatti,.page-chi-siamo) main>.page-intro.listing-hero{
  padding-top:112px!important;padding-bottom:190px!important;
 }
 body.inner-page main>.listing-hero .listing-hero-copy{top:0;max-width:100%}
 body main>.listing-hero.listing-hero .eyebrow{margin-bottom:18px!important}
 body main>.listing-hero.listing-hero h1{
  font-size:clamp(28px,8.5vw,42px)!important;line-height:1.08!important;
  margin-bottom:22px!important;letter-spacing:-.045em;
 }
 body main>.listing-hero.listing-hero .lead{font-size:16px!important;line-height:1.55!important}
 body main>.listing-hero.listing-hero .listing-hero-image{height:230px;inset:auto 0 0;width:100%}
}

.mobile-filter-toggle,.mobile-gallery-link{display:none!important}
@media(max-width:760px){
 body .category-hierarchy .category-label{display:none}
 body .category-hierarchy .mobile-filter-toggle{display:flex!important;align-items:center;justify-content:space-between;text-align:left;padding:14px 18px;min-height:48px}
 body .mobile-filter-toggle svg{transition:transform .3s ease}
 body .mobile-filter-toggle[aria-expanded="true"] svg{transform:rotate(-90deg)}
 body .category-hierarchy .category-options[hidden]{display:none!important}
 body .category-hierarchy .category-options:not([hidden]){animation:mobile-filter-fade .35s ease both}
 @keyframes mobile-filter-fade{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
 body :is(.faq-home,.faq-index)>.faq-contact>.btn{margin-left:0!important;margin-right:auto!important;justify-self:start!important;float:none!important}
 body .home-page .marquee-viewport{mask-image:none!important;-webkit-mask-image:none!important}
 body.home-page .marquee-viewport{mask-image:none!important;-webkit-mask-image:none!important}
 body.home-page .marquee-window>.marquee-end,body.home-page .marquee-edge,body.home-page .gallery-controls .motion-toggle{display:none!important}
 body.home-page .gallery-controls .mobile-gallery-link{display:flex!important;min-height:50px;font-size:11px;white-space:normal;max-width:100%;text-align:left}
 /* Safari-safe monochrome silhouette; no external SVG filter dependency. */
 body header .brand{position:relative}
 body header .brand img{visibility:hidden!important}
 body header .brand::before{content:"";position:absolute;inset:0;background:var(--action-bg);-webkit-mask:url('/assets/logo-original.png') center/contain no-repeat;mask:url('/assets/logo-original.png') center/contain no-repeat}
 body header.at-page-top.over-dark-hero:not(:has([aria-expanded="true"])) .brand::before{background:var(--cream)}
 /* A bounded menu with compact service links and one clear action per row. */
 body header #navigation{max-height:calc(100dvh - 110px);overflow-y:auto;overscroll-behavior:contain;padding:14px 18px}
 body header #navigation>a:not(.btn),body header #navigation .nav-toggle{padding-top:12px;padding-bottom:12px;font-size:15px;min-height:44px}
 body header #navigation .mega{padding:0;margin:0}
 body header #navigation .mega-links{display:grid;grid-template-columns:1fr;gap:0}
 body header #navigation .mega-links>a{padding:10px 0;min-height:44px;grid-template-columns:24px minmax(0,1fr) 20px;gap:10px;border-radius:0}
 body header #navigation .mega-links h3{font-size:13px!important;line-height:1.25!important;margin:0}
 body header #navigation .mega-links p{display:none}
 body header #navigation .mega-links small{font-size:10px}
 body header #navigation .mega-links .arrow-right{width:18px;height:18px}
 body header #navigation .mega-footer{padding-top:10px;margin-top:0;margin-bottom:8px}
 body header #navigation .mobile-form-trigger{margin-top:12px;min-height:48px}
}
@media(prefers-reduced-motion:reduce){.category-options{animation:none!important}}

/* Mobile gallery spans both screen edges; filter labels follow the left inset. */
@media(max-width:760px){
 body.home-page .marquee-viewport{width:100%!important}
 body.home-page .gallery-controls .mobile-gallery-link{width:auto;justify-content:space-between}
 body .category-hierarchy button{justify-content:flex-start!important;text-align:left!important}
 body .category-hierarchy .mobile-filter-toggle{justify-content:space-between!important}
}

/* Desktop categories sit on their own row beneath the complete collection. */
@media(min-width:761px){
 body :is(.service-index,.work-index,.faq-index)>.service-filters.category-hierarchy{flex-direction:column;align-items:flex-start;gap:20px;overflow:visible}
 body .category-hierarchy .category-children{padding:0 0 0 20px;border-left:1px solid #b5a18b;max-width:100%;flex-wrap:wrap}
 body .category-hierarchy .category-options{flex-wrap:wrap}
}

/* Dedicated mobile navigation page. Desktop navigation remains unchanged. */
.mobile-menu-link{display:none!important}
.mobile-menu-page{max-width:920px;margin:auto;padding:140px 6% 60px}
.mobile-menu-page h1{font-size:clamp(30px,6vw,52px);line-height:1.1;margin:0 0 32px}
.mobile-menu-page .eyebrow{margin-bottom:16px}
.mobile-menu-page .menu-page-links{display:grid;position:static;grid-template-columns:1fr 1fr;gap:0 24px;background:none;border:0;padding:0;max-height:none;overflow:visible}
.mobile-menu-page .menu-page-links>a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0;margin:0;border-bottom:1px solid var(--line);font-size:19px;color:var(--ink)}
.mobile-menu-page svg{flex-shrink:0}
.mobile-menu-page .menu-page-services{margin-top:32px}
.mobile-menu-page .menu-page-services h2{font-size:17px;line-height:1.3;margin-bottom:12px}
.mobile-menu-page .menu-page-services>div{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.mobile-menu-page .menu-page-services a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 0;min-height:52px;border-bottom:1px solid var(--line);font-size:13px;line-height:1.35}
.mobile-menu-page .menu-page-services svg{width:16px;height:16px}
.mobile-menu-page .menu-page-contact{margin-top:32px;display:flex;justify-content:space-between}
@media(max-width:760px){
 body header>.mobile-toggle,body header>#navigation{display:none!important}
 body header>.mobile-menu-link{display:block!important;margin-left:auto;padding:10px 0;font-size:13px;font-weight:400;white-space:nowrap;color:var(--action-bg)}
 body header.at-page-top.over-dark-hero>.mobile-menu-link{color:var(--cream)}
 body.page-menu header{transform:translateX(-50%)!important}
 body.page-menu .mobile-menu-page{padding-top:124px}
}

/* Mobile navigation opens above the current page. */
body .mobile-menu-dialog{box-sizing:border-box;width:calc(100% - 32px);max-width:520px;max-height:calc(100dvh - 40px);margin:auto;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--cream);color:var(--ink);overflow:auto;overscroll-behavior:contain;box-shadow:0 24px 80px #211a1240}
body .mobile-menu-dialog::backdrop{background:#211a1270;backdrop-filter:blur(5px)}
body .mobile-menu-dialog[open]{animation:none}
body .mobile-menu-dialog[open]::backdrop{animation:mobile-menu-backdrop-in .56s ease both}
body .mobile-menu-dialog.is-closing::backdrop{animation:mobile-menu-backdrop-out .46s ease both}
.mobile-menu-dialog-head{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;padding:18px 22px;background:var(--cream);border-bottom:1px solid var(--line)}
.mobile-menu-dialog-head h2{font-size:14px!important;letter-spacing:.12em;margin:0!important}
body .mobile-menu-close{border:0;background:transparent;color:var(--ink);font:inherit;font-size:14px;min-height:44px;padding:8px 0 8px 16px}
body .mobile-menu-dialog .mobile-menu-page{padding:0 22px 24px;max-width:none}
body .mobile-menu-dialog .menu-page-links{gap:0 18px}
body .mobile-menu-dialog .menu-page-links>a{font-size:16px;padding:15px 0}
body .mobile-menu-dialog .menu-page-services{margin-top:24px}
body .mobile-menu-dialog .menu-page-services h2{font-size:15px!important}
body .mobile-menu-dialog .menu-page-contact{margin-top:24px}
@media(max-width:760px){body header>.mobile-menu-link{border:0;background:transparent;font-family:inherit;cursor:pointer}}
@keyframes mobile-menu-backdrop-in{from{opacity:0}to{opacity:1}}
@keyframes mobile-menu-backdrop-out{from{opacity:1}to{opacity:0}}
@media(prefers-reduced-motion:reduce){body .mobile-menu-dialog[open]::backdrop{animation:none}}

/* Compact service disclosure keeps the contact action visible on mobile. */
body .mobile-menu-close:focus{outline:none!important;box-shadow:none!important}
body .mobile-menu-close:focus-visible{text-decoration:underline;text-underline-offset:4px}
body .mobile-menu-dialog .menu-services-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:44px;padding:10px 0;border:0;background:transparent;color:var(--ink);font:inherit;font-size:15px;font-weight:600;text-transform:uppercase;text-align:left;cursor:pointer}
body .mobile-menu-dialog .menu-services-toggle svg{transition:transform .42s cubic-bezier(.22,1,.36,1)}
body .mobile-menu-dialog .menu-services-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}
body .mobile-menu-dialog #popup-services[hidden]{display:none!important}
body .mobile-menu-dialog #popup-services{overflow:hidden;animation:none!important}


/* Desktop filter disclosure: keep the original left rule and inline categories. */
.desktop-filter-toggle{display:none!important}
body .category-hierarchy .category-options[hidden]{display:none!important}
@media(min-width:761px){
 body .category-hierarchy .has-filter-disclosure .category-label{display:none}
 body .category-hierarchy.category-hierarchy.category-hierarchy .desktop-filter-toggle{
  --action-hover:transparent;--action-hover-text:var(--muted);
  display:inline-flex!important;align-items:center;justify-content:flex-start;gap:10px;
  padding:13px 0;min-height:48px;background:transparent!important;color:var(--muted)!important;
  border:0!important;outline:none!important;border-radius:0;box-shadow:none!important;font-size:13px;font-weight:400;
  text-transform:none!important;letter-spacing:normal;line-height:1.5;
 }
 body .desktop-filter-toggle svg{width:1em;height:1em;flex:0 0 1em;transform:rotate(90deg);transition:transform .3s ease}
 body .desktop-filter-toggle[aria-expanded="true"] svg{transform:rotate(0deg)}
 body .category-hierarchy.category-hierarchy.category-hierarchy .desktop-filter-toggle:is(:hover,:focus,:focus-visible):not(:disabled){background:transparent!important;color:var(--muted)!important}
 body .desktop-filter-toggle:focus-visible{text-decoration:underline;text-underline-offset:4px}
 body .has-filter-disclosure .category-options{animation:none!important}
}
@media(prefers-reduced-motion:reduce){
 body .desktop-filter-toggle svg{transition:none}
 body .has-filter-disclosure .category-options{animation:none!important}
}

/* Preserve the supplied header artwork and its original colors. */
body header .brand::before{content:none!important;display:none!important}
body header .brand img.header-original-logo.header-original-logo.header-original-logo{visibility:visible!important;filter:none!important;opacity:1!important;height:44px;object-fit:contain;object-position:left center}

/* Slightly enlarge only the desktop header logo without moving navigation. */
@media(min-width:761px){body header .brand img.header-original-logo{transform:scale(1.18);transform-origin:left center}}

/* Closing CTA: photograph at 70% brightness, with the existing watermark. */
body .titan-cta .cta-card::before{
 content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:linear-gradient(90deg,rgba(25,21,17,.58),rgba(25,21,17,.15) 65%,transparent),url('/assets/hero-lavoro-finito.jpg') center 58% / cover no-repeat;
 filter:brightness(.7);
}
body .titan-cta .cta-watermark{color:rgba(255,255,255,.22)}
@media(max-width:760px){
 body .mobile-menu-dialog{margin:max(16px,env(safe-area-inset-top)) auto auto;max-height:calc(100dvh - 32px - env(safe-area-inset-top))}
}