/* SATC shared frontend refinement layer — intentionally loaded after page styles. */
:root{
  --site-content-width:1380px;
  --site-gutter:clamp(18px,5vw,72px);
  --site-section-gap:clamp(64px,7vw,96px);
  --site-focus:0 0 0 3px rgb(192 174 136 / 25%);
}

/* Mega menu ownership lives at the header level, not the narrow nav item.
   This late override intentionally wins over legacy home-v2 dropdown rules. */
@media (min-width:801px){
  .home-v2.shared-layout .shared-site-header .satc-dropdown.satc-mega,
  .shared-layout .shared-site-header .satc-dropdown.satc-mega{
    position:static!important;
  }
  .home-v2.shared-layout .shared-site-header .satc-mega>.dropdown-menu.mega-menu,
  .shared-layout .shared-site-header .satc-mega>.dropdown-menu.mega-menu{
    position:absolute!important;
    top:100%!important;
    right:auto!important;
    left:50%!important;
    width:100vw!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    padding:var(--pc-space-4xl) var(--pc-space-5xl)!important;
    overflow:hidden;
    grid-template-columns:minmax(330px,.72fr) minmax(480px,1.28fr)!important;
    gap:var(--pc-space-6xl)!important;
    min-height:0;
    align-content:center;
    border:0!important;
    border-top:1px solid rgb(192 174 136 / 55%)!important;
    border-radius:0!important;
    background:rgba(57 39 30 / .82)!important;
    box-shadow:0 30px 70px rgb(10 7 5 / 42%)!important;
    backdrop-filter:blur(60px) saturate(90%) brightness(68%)!important;
    -webkit-backdrop-filter:blur(60px) saturate(90%) brightness(68%)!important;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translate(-50%,12px)!important;
  }
  /* Transparent hover bridge across the visual gap below the floating header. */
  .shared-layout .shared-site-header .satc-mega>.dropdown-menu.mega-menu:after{
    content:"";
    position:absolute;
    right:0;
    bottom:100%;
    left:0;
    height:14px;
    pointer-events:auto;
  }
  .shared-layout .shared-site-header .satc-mega>.dropdown-menu.mega-menu:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,rgb(255 255 255 / 7%),rgb(255 255 255 / 2%));}
  .home-v2.shared-layout .shared-site-header .satc-mega.desktop-open>.dropdown-menu.mega-menu,
  .shared-layout .shared-site-header .satc-mega.desktop-open>.dropdown-menu.mega-menu{
    display:grid!important;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translate(-50%,0)!important;
  }
  .shared-layout .shared-site-header .mega-menu-intro{position:relative;z-index:1;align-self:center;padding-block:0;padding-inline:0 var(--pc-space-5xl);border-inline-end:1px solid rgb(255 255 255 / 42%);background:transparent;color:#fff}
  .shared-layout .shared-site-header .mega-menu-intro>span{margin-bottom:18px;color:#fff;font-size:13px}
  .shared-layout .shared-site-header .mega-menu-intro p{max-width:420px;margin-bottom:var(--pc-space-3xl);color:#fff;font-size:16px;line-height:1.6}
  .shared-layout .shared-site-header .mega-menu-intro>a{min-width:145px;min-height:var(--btn-h);justify-content:center;padding:12px 24px;border:1px solid rgb(255 255 255 / 72%);border-radius:4px;color:#fff;font-size:13px;transition:background-color .2s,color .2s,border-color .2s}
  .shared-layout .shared-site-header .mega-menu-intro>a:hover,.shared-layout .shared-site-header .mega-menu-intro>a:focus-visible{border-color:#fff;background:#fff;color:var(--satc-burgundy)}
  .shared-layout .shared-site-header .mega-menu-links{position:relative;z-index:1;display:grid;grid-template-columns:1fr;align-content:center;gap:0;margin:0;padding:0;background:transparent;list-style:none}
  .shared-layout .shared-site-header .satc-mega .mega-menu-links .dropdown-item{min-height:0;display:flex;align-items:center;justify-content:flex-start;gap:var(--pc-space-lg);padding:var(--pc-space-md) 0;border:0;background:transparent;color:rgb(255 255 255 / 82%);font-size:clamp(17px,1.4vw,21px);font-weight:500;transition:color .2s,padding .2s}
  .shared-layout .shared-site-header .satc-mega .mega-menu-links li:last-child .dropdown-item{border-bottom:0}
  .shared-layout .shared-site-header .satc-mega .mega-menu-links .dropdown-item:hover,.shared-layout .shared-site-header .satc-mega .mega-menu-links .dropdown-item:focus-visible{padding:var(--pc-space-md) 0;color:#fff;background:transparent}
  .shared-layout .shared-site-header .mega-menu-links .dropdown-item>i{display:none}
  [dir=ltr] .shared-layout .shared-site-header .mega-menu-links .dropdown-item{direction:ltr;text-align:left}
  [dir=ltr] .shared-layout .shared-site-header .mega-menu-links .dropdown-item>span{order:0;flex:1;text-align:left}
  [dir=ltr] .shared-layout .shared-site-header .mega-menu-links .dropdown-item>i{order:2}
}

.shared-layout .shared-site-header button.nav-link.has-menu{border:0;background:transparent;font-family:inherit;cursor:pointer}

html{scroll-padding-top:24px}body{overflow-x:clip}.shared-layout main{min-height:45vh}
html.mega-menu-open:has(body.home-v2){overflow-x:clip!important;overflow-y:hidden!important;overscroll-behavior:none}
body.home-v2.mega-menu-open{overflow-x:clip!important;overflow-y:visible!important;overscroll-behavior:none}
html.mega-menu-open body.home-v2 .shared-site-header{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.shared-layout :is(a,button,input,select,textarea,summary):focus-visible{outline:2px solid var(--satc-gold);outline-offset:3px}
.shared-layout :is(img,video,svg){max-width:100%}

/* Header rhythm, readable targets and a calmer active state. */
.shared-layout .shared-site-header{height:96px;gap:clamp(20px,2vw,34px)}
.shared-layout .shared-site-header .main-nav{gap:clamp(20px,2vw,36px)}
.shared-layout .shared-site-header .nav-link{min-height:44px;font-size:15px;line-height:1.2;transition:color .18s ease}
.shared-layout .shared-site-header .nav-link:after{transition:width .2s ease,background-color .2s ease}
.shared-layout .shared-site-header .main-nav>.nav-link:not(.active):after,.shared-layout .shared-site-header .satc-dropdown>.nav-link:not(.active):after{content:"";position:absolute;inset-inline-start:50%;bottom:17px;width:0;height:2px;background:var(--satc-gold);transform:translateX(50%)}
[dir=ltr] .shared-layout .shared-site-header .main-nav>.nav-link:not(.active):after,[dir=ltr] .shared-layout .shared-site-header .satc-dropdown>.nav-link:not(.active):after{transform:translateX(-50%)}
.shared-layout .shared-site-header .main-nav>.nav-link:hover:after,.shared-layout .shared-site-header .satc-dropdown:hover>.nav-link:after,.shared-layout .shared-site-header .satc-dropdown:focus-within>.nav-link:after{width:30px}
.shared-layout .satc-dropdown .dropdown-menu{min-width:215px;padding:10px;border-top-color:var(--satc-gold);box-shadow:var(--shadow-dropdown)}
.shared-layout .satc-dropdown .dropdown-item{min-height:46px;padding-inline:15px;font-size:14px}
.shared-layout .satc-dropdown .has-menu i{transition:transform .18s ease}
.shared-layout .shared-site-header .satc-dropdown>.has-menu:after{content:none!important;display:none!important}
.shared-layout .satc-dropdown.desktop-open>.has-menu i,
.shared-layout .satc-dropdown.mobile-open>.has-menu i{transform:rotate(180deg)}
.shared-layout .shared-site-header .outline{min-height:var(--btn-h);display:inline-flex;align-items:center;justify-content:center;transition:background-color .2s,color .2s,border-color .2s,transform .2s}
/* Header button hover follows the button system (white fill, brown text on the dark bar); the old brown fill hid its brown text. */
.shared-layout .shared-site-header .outline:is(:hover,:focus-visible){border-color:var(--legacy-btn-line);background:var(--legacy-btn-bg);color:var(--legacy-btn-fg);-webkit-text-fill-color:var(--legacy-btn-fg);transform:translateY(-1px)}

/* Floating SATC navigation: a quiet architectural frame above the hero. */
@media(min-width:801px){
  body.home-v2 .hero-slider,
  body.home-v2 .hero-slider .carousel,
  body.home-v2 .hero-slider .carousel-inner,
  body.home-v2 .hero-slider .carousel-item,
  body.home-v2 .hero-slide{
    height:clamp(720px,100svh,960px);
    min-height:720px;
    max-height:960px;
  }
  body.home-v2 .shared-site-header.header.navbar{
    position:fixed!important;
    top:18px!important;
    right:0!important;
    left:0!important;
    z-index:1200!important;
    width:min(1760px,calc(100% - clamp(40px,7vw,136px)))!important;
    max-width:none!important;
    height:90px!important;
    padding-inline:clamp(24px,2.6vw,48px)!important;
    border:1px solid rgb(255 255 255 / 14%)!important;
    border-radius:4px!important;
    /* Frosted glass: a grey-to-white 20% sweep with a 5% shade on top,
       over a 12px blur of whatever sits behind the bar. */
    background:linear-gradient(rgb(0 0 0 / 5%),rgb(0 0 0 / 5%)),linear-gradient(90deg,rgb(123 118 118 / 20%),rgb(255 255 255 / 20%))!important;
    box-shadow:0 16px 48px rgb(12 10 9 / 20%)!important;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    transition:top .25s ease,width .25s ease,height .25s ease,background-color .25s ease,box-shadow .25s ease!important;
  }
  body.home-v2 .shared-site-header.header.navbar:before{content:none!important}
  body.home-v2 .shared-site-header.header.navbar.is-scrolled{
    top:14px!important;
    width:min(1600px,calc(100% - clamp(32px,5vw,96px)))!important;
    height:74px!important;
    /* Stays glass once fixed: a translucent Root Brew tint keeps white links
       legible over light sections while the page still shows through. */
    background:rgb(57 39 30 / 65%)!important;
    box-shadow:0 14px 38px rgb(12 10 9 / 18%)!important;
    backdrop-filter:blur(22px) saturate(120%);
    -webkit-backdrop-filter:blur(22px) saturate(120%);
  }
  body.home-v2 .shared-site-header :is(.nav-link,.nav-link.active,.site-language-switch){color:#fff!important}
  body.home-v2 .shared-site-header .logo{height:58px}
  body.home-v2 .shared-site-header.is-scrolled .logo{height:52px}
  body.home-v2.shared-layout .shared-site-header .satc-mega>.dropdown-menu.mega-menu{
    top:calc(100% + 12px)!important;
    width:100%!important;
    min-height:0;
    border:1px solid rgb(192 174 136 / 28%)!important;
    border-radius:4px!important;
  }
  body.home-v2.about-page .about-hero{min-height:100dvh}
  body.home-v2.single-project-page .project-detail-hero{height:min(88vh,880px);min-height:700px}
  body.home-v2.contact-page .contact-hero{min-height:700px}
  body.home-v2.investor-relations-page .contact-hero{min-height:760px}
  body.home-v2 :is(.info-hero:not(.contact-hero),.faq-hero,.post-hero,.article-hero,.opportunity-hero){
    padding-top:clamp(150px,14vh,180px)!important;
    padding-bottom:clamp(72px,8vh,100px)!important;
  }
  body.home-v2 :is(
    .hero-slider,
    .hero-slider .carousel,
    .hero-slider .carousel-inner,
    .hero-slider .carousel-item,
    .hero-slide,
    .about-hero,
    .partners-page-hero,
    .archive-hero,
    .projects-hero,
    .project-detail-hero,
    .contact-hero,
    .info-hero,
    .faq-hero,
    .post-hero,
    .article-hero,
    .opportunity-hero,
    .interest-hero
  ){
    box-sizing:border-box;
    height:var(--site-hero-desktop-height)!important;
    min-height:var(--site-hero-desktop-height)!important;
    max-height:var(--site-hero-desktop-height);
  }
}

/* Keep every public page hero on the same vertical axis. Page styles may own
   imagery, but the shell and copy position stay consistent across routes. */
@media(min-width:801px){
  body.home-v2 :is(
    .about-hero,
    .contact-hero,
    .partners-page-hero,
    .archive-hero,
    .projects-hero,
    .post-hero,
    .interest-hero
  ){
    position:relative;
    display:flex;
    align-items:center;
    padding-block:0;
  }
  body.home-v2 :is(
    .about-hero-copy,
    .contact-hero-content,
    .partners-hero-content,
    .archive-hero-content,
    .projects-hero-content,
    .post-hero>.articles-wrap,
    .interest-hero>.interest-wrap
  ){
    position:absolute;
    /* Centre within the visible hero area below the floating 108px header. */
    top:calc(50% + 54px);
    right:0;
    left:0;
    z-index:2;
    margin-block:0;
    padding-block:0;
    transform:translateY(-50%);
  }
}

/* Shared image hero system: same geometry, readable measure, locale-aware contrast. */
.shared-layout :is(.partners-hero-content,.archive-hero-content,.projects-hero-content){width:min(90%,var(--site-content-width));margin-inline:auto}
.shared-layout :is(.partners-page-hero,.archive-hero,.projects-hero) h1{max-width:850px;text-wrap:balance}
.shared-layout :is(.partners-page-hero,.archive-hero,.projects-hero) p{max-width:700px;text-wrap:pretty}
[dir=ltr] .shared-layout :is(.partners-hero-shade,.archive-hero-shade){background:var(--inner-hero-overlay-ltr)}

/* Consistent content rhythm and quieter card interaction. */
.shared-layout :is(.partners-list,.articles-main,.projects-catalog,.legal-main,.contact-main,.faq-main){padding-block:var(--site-section-gap)}
.shared-layout :is(.partner-logos-grid article,.archive-project-card,.article-card,.payment-card){transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease}
.shared-layout :is(.partner-logos-grid article,.archive-project-card,.article-card,.payment-card):hover{border-color:color-mix(in srgb,var(--satc-gold) 55%,var(--satc-stone));box-shadow:0 18px 45px rgb(35 31 32 / 9%)}
.shared-layout :is(.projects-primary-btn,.contact-form button[type=submit],.faq-layout aside a,.btn){min-height:var(--btn-h);transition:background-color .2s,color .2s,border-color .2s,transform .2s,box-shadow .2s}
.shared-layout :is(.projects-primary-btn,.contact-form button[type=submit],.faq-layout aside a,.btn):hover{box-shadow:0 5px 14px rgb(57 39 30 / 8%)}
.shared-layout :is(input,select,textarea){transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}
.shared-layout :is(input,select,textarea):focus{border-color:var(--satc-gold)!important;box-shadow:var(--site-focus);background:#fff}

/* Project and editorial cards share a stable media ratio and aligned actions. */
.shared-layout :is(.archive-project-card,.article-card,.project-card,.news-card){height:100%;display:flex;flex-direction:column;overflow:hidden}
.shared-layout :is(.archive-project-card,.article-card,.project-card,.news-card) :is(.card-media,.article-card-media,.project-media,.news-media){position:relative;overflow:hidden;background:var(--satc-paper)}
.shared-layout :is(.archive-project-card,.article-card,.project-card,.news-card) :is(.card-media,.article-card-media,.project-media,.news-media)>img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .55s cubic-bezier(.2,.65,.3,1)}
.shared-layout :is(.archive-project-card,.article-card,.project-card,.news-card):hover :is(.card-media,.article-card-media,.project-media,.news-media)>img{transform:scale(1.035)}
.shared-layout :is(.archive-project-card,.article-card,.project-card,.news-card):focus-within{border-color:var(--satc-gold);box-shadow:var(--shadow-card-hover)}
.shared-layout :is(.archive-project-card .card-copy,.article-card-content,.news-content){display:flex;flex:1;flex-direction:column;height:auto}
.shared-layout :is(.archive-project-card .card-copy,.article-card-content,.news-content)>p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}

/* Action arrows follow the reading direction without affecting breadcrumbs. */
.shared-layout :is(.card-link,.read-more,.news-read,.projects-primary-btn,.faq-layout aside a) .fa-arrow-left{transition:transform .2s ease}
.shared-layout :is(.card-link,.read-more,.news-read,.projects-primary-btn,.faq-layout aside a):hover .fa-arrow-left{transform:translateX(-4px)}
[dir=ltr] .shared-layout :is(.card-link,.read-more,.news-read,.projects-primary-btn,.faq-layout aside a):hover .fa-arrow-left{transform:rotate(180deg) translateX(-4px)}

/* Forms and feedback remain visible and readable in both locales. */
.shared-layout .alert{border:0;border-inline-start:3px solid currentColor;border-radius:0;padding:15px 18px;font-size:13px;line-height:1.8}
.shared-layout .alert-danger{background:#fff2f2;color:#831d26}.shared-layout .alert-success{background:#eff9f2;color:#176b36}
.shared-layout .alert ul{padding-inline-start:20px}
.shared-layout :is(input,select,textarea)::placeholder{color:#9a918b;opacity:1}
.shared-layout select{cursor:pointer}

/* Footer and horizontally scrollable controls remain usable on narrow screens. */
.shared-layout :is(.article-tabs,.projects-tabs,.faq-tabs)::-webkit-scrollbar{height:4px}.shared-layout :is(.article-tabs,.projects-tabs,.faq-tabs)::-webkit-scrollbar-thumb{background:var(--satc-gold);border-radius:4px}
.shared-layout .site-whatsapp,.shared-layout .site-back-to-top{width:56px;height:56px;min-width:56px;box-shadow:0 6px 18px rgb(17 20 24 / 14%)}
.shared-layout .mobile-nav-close{border-radius:50%;transition:background-color .2s,color .2s,transform .2s}.shared-layout .mobile-nav-close:hover{background:var(--satc-burgundy);color:#fff;transform:rotate(4deg)}
.shared-layout .mobile-nav-account{align-self:center;flex:0 0 auto;display:inline-flex;align-items:center;height:44px;gap:8px;min-width:150px;max-width:210px;padding:0 16px;border:1px solid rgb(192 174 136 / 45%);border-radius:4px;background:#f8f5f1;color:var(--satc-charcoal);font-size:13px;font-weight:800;text-decoration:none;overflow:hidden}
.shared-layout .mobile-nav-account .fa-circle-user{flex:0 0 auto;font-size:18px}
.shared-layout .mobile-nav-account span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shared-layout .mobile-nav-account .fa-arrow-left{flex:0 0 auto;color:var(--satc-gold);font-size:11px}
.shared-layout .mobile-nav-login{display:none}

@media(min-width:801px) and (max-width:1240px){
  .shared-layout .shared-site-header{width:96%;gap:14px}
  .shared-layout .shared-site-header .main-nav{gap:clamp(12px,1.25vw,20px)}
  .shared-layout .shared-site-header .nav-link,[dir=ltr] .shared-layout .shared-site-header .nav-link{font-size:13px}
  .shared-layout .shared-site-header .outline{padding-inline:14px;min-width:120px}
}

@media(max-width:800px){
  .shared-layout .shared-site-header{height:76px}
  .shared-layout .shared-site-header>.main-nav{padding-top:88px!important}
  .shared-layout .shared-site-header .main-nav .nav-link{min-height:54px!important;padding-block:11px!important}
  .shared-layout .shared-site-header .main-nav>.nav-link,
  .shared-layout .shared-site-header .main-nav>.satc-dropdown>.nav-link,
  .shared-layout .shared-site-header .main-nav>.site-language-switch{width:100%!important;border-bottom:1px solid #e4ded9!important}
  .shared-layout .shared-site-header .main-nav>.site-language-switch{align-self:stretch!important;min-height:54px!important;height:54px!important;max-height:none!important;justify-content:flex-end!important;margin:0!important;padding:11px 3px!important;border-radius:0!important}
  [dir=ltr] .shared-layout .shared-site-header .main-nav>.site-language-switch{direction:ltr!important;flex-direction:row-reverse!important;justify-content:flex-end!important}
  .shared-layout :is(.partners-page-hero,.archive-hero,.projects-hero){height:var(--inner-hero-mobile-height);min-height:520px;align-items:flex-end}
  .shared-layout :is(.partners-hero-shade,.archive-hero-shade){background:var(--inner-hero-overlay-mobile)!important}
  .shared-layout :is(.partners-hero-content,.archive-hero-content,.projects-hero-content){padding-bottom:clamp(48px,10vw,72px)}
  .shared-layout :is(.partners-list,.articles-main,.projects-catalog,.legal-main,.contact-main,.faq-main){padding-block:clamp(52px,10vw,72px)}
  .shared-layout :is(.card-link,.read-more,.news-read,.projects-primary-btn){min-height:46px}
  .shared-layout :is(.article-tabs,.projects-tabs){width:100%;padding-bottom:8px;overflow-x:auto;scroll-snap-type:x proximity}
  .shared-layout :is(.article-tab,.projects-tabs button){scroll-snap-align:start}
  .shared-layout .site-whatsapp,.shared-layout .site-back-to-top{width:52px;height:52px;min-width:52px;bottom:max(16px,env(safe-area-inset-bottom))}
  .shared-layout .mobile-nav-account{align-self:stretch;flex:none;height:auto;min-height:58px;width:auto;min-width:0;max-width:none;display:grid;grid-template-columns:36px minmax(0,1fr) 18px;align-items:center;gap:11px;margin-top:22px;padding:10px 14px;border:1px solid rgb(192 174 136 / 45%);background:#f8f5f1;color:var(--satc-charcoal);font-size:14px;font-weight:800;text-decoration:none}
  .shared-layout .mobile-nav-account .fa-circle-user{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:var(--satc-burgundy);color:#fff;font-size:18px}
  .shared-layout .mobile-nav-account span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .shared-layout .mobile-nav-account .fa-arrow-left{color:var(--satc-gold);font-size:11px}
  [dir=ltr] .shared-layout .mobile-nav-account .fa-arrow-left{transform:rotate(180deg)}
  .shared-layout .mobile-nav-login{align-self:stretch;flex:none;min-height:58px;display:grid;grid-template-columns:36px minmax(0,1fr) 18px;align-items:center;gap:11px;margin-top:22px;padding:10px 14px;border:1px solid rgb(192 174 136 / 45%);background:var(--satc-charcoal);color:#fff;text-decoration:none;font-size:14px;font-weight:800}
  .shared-layout .mobile-nav-login .fa-circle-user{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:rgb(255 255 255 / 10%);color:#fff;font-size:18px}
  .shared-layout .mobile-nav-login span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .shared-layout .mobile-nav-login .fa-arrow-left{color:#fff;font-size:11px}
  [dir=ltr] .shared-layout .mobile-nav-login .fa-arrow-left{transform:rotate(180deg)}
}

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

/* Site-wide focus treatment: no external browser outline or halo. */
.shared-layout :is(a,button,input,select,textarea,summary,[tabindex]):focus{outline:none}
.shared-layout :is(input,select,textarea):focus,
.shared-layout :is(input,select,textarea):focus-visible{border-color:var(--satc-gold)!important;box-shadow:var(--focus-ring)!important}
.shared-layout :is(a,button,summary,[tabindex]):focus-visible{outline:2px solid var(--satc-gold)!important;outline-offset:3px!important;box-shadow:none!important}

/* Unified spacing, reading rhythm and bilingual alignment. */
.shared-layout :is(.wrap,.projects-page-wrap,.partners-page-wrap,.article-wrap,.post-wrap,.info-wrap){max-width:var(--site-content-width);padding-inline:0}
.shared-layout main :is(p,li){text-wrap:pretty}
.shared-layout main :is(h1,h2,h3){text-wrap:balance}
.shared-layout :is(.breadcrumb,.project-breadcrumb,.opportunity-breadcrumb,.info-breadcrumb){min-width:0;flex-wrap:wrap;row-gap:7px;align-items:center}
.shared-layout :is(.breadcrumb,.project-breadcrumb,.opportunity-breadcrumb,.info-breadcrumb) a{transition:color var(--motion-fast) ease}
.shared-layout :is(.breadcrumb,.project-breadcrumb,.opportunity-breadcrumb,.info-breadcrumb) a:hover{color:var(--satc-gold)}

/* Shared controls keep the existing squared SATC character with clearer states. */
.shared-layout :is(.btn,.projects-primary-btn,.text-link,.card-link,.read-more,.news-read,.contact-form button[type=submit]){font-weight:var(--btn-weight);letter-spacing:.005em}
.shared-layout :is(.btn,.projects-primary-btn,.contact-form button[type=submit],button[type=submit]):not(:disabled){cursor:pointer}
.shared-layout :is(.btn,.projects-primary-btn,.contact-form button[type=submit]):active{transform:translateY(0) scale(.985)!important}
.shared-layout :is(button,input,select,textarea):disabled,.shared-layout [aria-disabled=true]{cursor:not-allowed!important;opacity:.58;transform:none!important;box-shadow:none!important}

/* One card language across project, editorial and partner surfaces. */
.shared-layout :is(.archive-project-card,.article-card,.news-card,.related-card,.model-card,.partner-logos-grid article,.payment-card){border-color:rgb(222 214 201 / 78%);box-shadow:0 1px 0 rgb(35 31 32 / 2%)}
.shared-layout :is(.archive-project-card,.article-card,.news-card,.related-card,.model-card,.partner-logos-grid article,.payment-card):focus-within{border-color:var(--satc-gold);box-shadow:var(--shadow-card)}
.shared-layout :is(.archive-project-card,.article-card,.news-card,.related-card,.model-card,.partner-logos-grid article,.payment-card) h3{font-weight:800}

/* Image stability without a global reveal animation. */
.shared-layout img{font-style:italic;color:#746d67}
.shared-layout :is(.hero-slide-media,.about-media,.card-media,.article-card-media,.news-media,.related-media,.featured-media,.model-card-media,.article-cover,.project-gallery,.investor-governance-visual) img{width:100%;height:100%;display:block;object-fit:cover}

/* Visible, stable scrollbars for every owned scroll surface. */
html{scrollbar-width:thin;scrollbar-color:var(--satc-gold) var(--satc-paper);scrollbar-gutter:stable}
*{scrollbar-width:thin;scrollbar-color:rgb(192 174 136 / 80%) rgb(247 244 239 / 70%)}
*::-webkit-scrollbar{width:10px;height:8px}
*::-webkit-scrollbar-track{background:var(--satc-paper)}
*::-webkit-scrollbar-thumb{border:2px solid var(--satc-paper);border-radius:4px;background:var(--satc-gold)}
*::-webkit-scrollbar-thumb:hover{background:var(--satc-burgundy)}

@media(hover:hover) and (pointer:fine){
  .shared-layout :is(.archive-project-card,.article-card,.news-card,.related-card,.model-card,.partner-logos-grid article,.payment-card):hover{transform:translateY(-4px);box-shadow:var(--shadow-card-hover)}
}

@media(max-width:600px){
  :root{--site-gutter:18px;--site-section-gap:clamp(50px,12vw,68px)}
  .shared-layout :is(.btn,.projects-primary-btn,.contact-form button[type=submit],button[type=submit]){min-height:var(--btn-h)}
  .shared-layout :is(.archive-project-card,.article-card,.news-card,.related-card,.model-card){transform:none!important}
  .shared-layout :is(.card-copy,.article-card-content,.news-content){padding:22px 20px}
}

@media(forced-colors:active){
  *{scrollbar-color:auto}
  .shared-layout :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:2px solid CanvasText!important}
}
.site-confirm-dialog{width:min(440px,calc(100% - 32px));padding:0;border:0;border-radius:4px;background:#fff;color:var(--satc-charcoal);box-shadow:0 24px 80px rgb(25 8 13 / 28%)}
.site-confirm-dialog::backdrop{background:rgb(25 8 13 / 58%);backdrop-filter:blur(3px)}
.site-confirm-dialog form{display:grid;justify-items:center;gap:14px;padding:30px;text-align:center}.site-confirm-dialog .site-confirm-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:#fff3f1;color:#9f1f20;font-size:20px}.site-confirm-dialog h2{margin:0;font-size:21px}.site-confirm-dialog p{margin:0;color:#625956;line-height:1.8}.site-confirm-actions{width:100%;display:flex;justify-content:center;gap:10px;margin-top:8px}.site-confirm-actions .btn{min-width:120px}

/* Mobile drawer must use the viewport, not the floating header's glass box. */
@media(max-width:800px){
  html.nav-drawer-open,
  html.nav-drawer-open body{
    height:100%;
    overflow:hidden!important;
    overscroll-behavior:none;
  }
  body.home-v2 .shared-site-header{
    transform:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  /* Glass bar floating over the hero, like the desktop header. The glass lives
     on ::before: a backdrop-filter on the header itself would become the
     containing block of the fixed menu drawer and trap it inside the bar. */
  /* A floating frame inset from the screen edges, as on desktop. */
  body.home-v2 .shared-site-header.header.navbar{
    position:fixed!important;
    top:12px!important;
    right:0!important;
    left:0!important;
    z-index:1100!important;
    width:calc(100% - 32px)!important;
    margin:0 auto!important;
    padding-inline:16px!important;
    border:1px solid rgb(255 255 255 / 14%)!important;
    border-radius:4px!important;
    background:transparent!important;
    box-shadow:0 12px 32px rgb(12 10 9 / 20%)!important;
  }
  body.home-v2 .shared-site-header.header.navbar::before{
    content:""!important;
    position:absolute;
    inset:0;
    /* Clear the old full-bleed white strip from home-v2.css, whose
       translateX(-50%) shifted this layer half off the bar. */
    width:auto;
    border:0;
    border-radius:inherit;
    transform:none;
    z-index:-1;
    pointer-events:none;
    background:linear-gradient(rgb(0 0 0 / 5%),rgb(0 0 0 / 5%)),linear-gradient(90deg,rgb(123 118 118 / 20%),rgb(255 255 255 / 20%));
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }
  body.home-v2 .shared-site-header.header.navbar.is-scrolled::before{
    background:rgb(57 39 30 / 65%);
    backdrop-filter:blur(22px) saturate(120%);
    -webkit-backdrop-filter:blur(22px) saturate(120%);
  }
  body.home-v2 .shared-site-header>.menu{
    border-color:rgb(255 255 255 / 70%)!important;
    background:transparent!important;
    color:#fff!important;
  }
  /* Hero copy lines up with the logo inside the floating bar (16px inset + 16px padding). */
  body.home-v2 .hero-slider .hero-slide-copy>.copy-block{inset-inline:32px!important}
  /* Compact heroes start under the 70px bar: keep their copy where it was. */
  body.home-v2 .post-hero{padding-top:132px}
  body.home-v2 :is(.info-hero:not(.contact-hero),.faq-hero){padding-top:142px}
  body.home-v2 .error-stage{padding-top:150px}
  body.home-v2 .shared-site-header>.outline{
    display:none!important;
  }
  body.home-v2 .shared-site-header .satc-mega .mega-menu-intro{
    display:none!important;
  }
  body.home-v2 .shared-site-header .satc-mega .mega-menu-links{
    display:grid!important;
    padding-block:6px!important;
  }
  body.home-v2 .shared-site-header>.main-nav,
  body.home-v2 .shared-site-header>.main-nav.open{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    max-width:none!important;
    height:100vh!important;
    height:100dvh!important;
    margin:0!important;
    border-radius:0!important;
  }
}
@media(max-width:650px){
  body.home-v2 .post-hero{padding-top:126px}
}
@media(max-width:640px){
  body.home-v2 .error-stage{padding-top:124px}
}
@media(max-width:600px){
  body.home-v2 :is(.info-hero:not(.contact-hero),.faq-hero){padding-top:122px}
}

/* Hide-on-scroll header (main.js toggles .is-hidden): it slides away while
   scrolling down and returns on scroll up. It moves with `top`, not a
   transform, which would trap the fixed mobile menu drawer inside the bar. */
body.home-v2 .shared-site-header.header.navbar.is-hidden{top:-130px!important}
@media(max-width:800px){
  body.home-v2 .shared-site-header.header.navbar{transition:top .3s ease!important}
}

/* Desktop mega menu as on roshn.sa: a full-width veil from the top of the
   screen (black 50% over a 10px blur, no panel, border or corners), the
   glass bar staying on top of it, and the content starting below the bar,
   lined up with the logo. Sizes match roshn: 30px title, 16px text, 24px
   links, a 30% white rule between the columns and a pill "more" button. */
@media (min-width:801px){
  body.home-v2.shared-layout .shared-site-header .satc-mega>.dropdown-menu.mega-menu{
    position:fixed!important;
    z-index:-2;
    inset:0 0 auto!important;
    width:100%!important;
    min-height:36rem;
    padding:176px calc((100% - min(1760px,100% - clamp(40px,7vw,136px))) / 2 + clamp(24px,2.6vw,48px)) 64px!important;
    grid-template-columns:25rem minmax(0,1fr)!important;
    align-content:start;
    gap:0!important;
    border:0!important;
    border-radius:0!important;
    background:rgb(0 0 0 / 50%)!important;
    backdrop-filter:blur(10px)!important;
    -webkit-backdrop-filter:blur(10px)!important;
    transform:none!important;
    transition:opacity .35s ease,visibility .35s ease;
  }
  body.home-v2.shared-layout .shared-site-header .satc-mega>.dropdown-menu.mega-menu:is(::before,::after){content:none}
  body.home-v2.shared-layout .shared-site-header .satc-mega.desktop-open>.dropdown-menu.mega-menu{transform:none!important}
  /* The bar's glass moves to a layer above the veil while a menu is open. */
  html.mega-menu-open body.home-v2 .shared-site-header.header.navbar::before{
    content:""!important;
    position:absolute;
    z-index:-1;
    inset:0;
    /* Clear home-v2.css's old full-bleed strip (fixed width, shifted by -50%). */
    width:auto;
    height:auto;
    margin:0;
    border:0;
    transform:none;
    border-radius:inherit;
    background:linear-gradient(rgb(0 0 0 / 5%),rgb(0 0 0 / 5%)),linear-gradient(90deg,rgb(123 118 118 / 20%),rgb(255 255 255 / 20%));
    pointer-events:none;
  }
  html.mega-menu-open body.home-v2 .shared-site-header.header.navbar.is-scrolled::before{background:rgb(57 39 30 / 65%)}
  body.home-v2.shared-layout .shared-site-header .mega-menu-intro{align-self:start;padding-inline:0 64px;border-inline-end:1px solid rgb(255 255 255 / 30%)}
  body.home-v2.shared-layout .shared-site-header .mega-menu-intro>span{display:block;margin-bottom:24px;color:#fff;font-size:30px;font-weight:500;line-height:36px}
  body.home-v2.shared-layout .shared-site-header .mega-menu-intro p{margin-bottom:40px;color:#fff;font-size:16px;font-weight:300;line-height:32px}
  body.home-v2.shared-layout .shared-site-header .mega-menu-intro>a{min-width:145px;min-height:56px;padding:12px 32px;border:1px solid #fff;border-radius:999px;font-size:16px}
  body.home-v2.shared-layout .shared-site-header .mega-menu-links{align-content:start;padding-inline-start:40px}
  body.home-v2.shared-layout .shared-site-header .satc-mega .mega-menu-links .dropdown-item,
  body.home-v2.shared-layout .shared-site-header .satc-mega .mega-menu-links .dropdown-item:is(:hover,:focus-visible){padding:12px 0;color:#fff;font-size:24px;font-weight:400;line-height:40px}
  body.home-v2.shared-layout .shared-site-header .satc-mega .mega-menu-links .dropdown-item:not(:hover,:focus-visible){color:rgb(255 255 255 / 82%)}
}

/* Mobile menu as on roshn.sa: a full-screen veil (black 40% over a 10px blur)
   instead of a white sheet, white text, 69px rows split by 20% white rules,
   20px from the edges, and the sign-in button as a light pill at the bottom. */
@media (max-width:800px){
  body.home-v2.shared-layout .shared-site-header>.main-nav{
    padding:112px 20px max(20px,env(safe-area-inset-bottom))!important;
    background:rgb(0 0 0 / 40%)!important;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    color:#fff;
  }
  /* As on roshn.sa the bar stays on top of the veil: the drawer sits below the
     bar's glass layer, the bar's button closes it, and the drawer's own logo
     and close button step aside. */
  body.home-v2.shared-layout .shared-site-header>.main-nav{z-index:-2!important;padding-top:112px!important}
  body.home-v2.shared-layout .shared-site-header .main-nav>:is(.mobile-nav-brand,.mobile-nav-close){display:none!important}
  html.nav-drawer-open body.home-v2 :is(.site-whatsapp,.site-back-to-top){visibility:hidden}
  body.home-v2.shared-layout .shared-site-header .mobile-nav-brand .brand-logo-dark{display:none!important}
  body.home-v2.shared-layout .shared-site-header .mobile-nav-brand .brand-logo-light{display:block!important}
  body.home-v2.shared-layout .shared-site-header .mobile-nav-close{border-color:rgb(255 255 255 / 40%)!important;background:transparent!important;color:#fff!important}
  body.home-v2.shared-layout .shared-site-header .main-nav>:is(.nav-link,.site-language-switch),
  body.home-v2.shared-layout .shared-site-header .main-nav>.satc-dropdown>.nav-link{
    min-height:69px!important;
    padding-block:0!important;
    border-bottom:1px solid rgb(255 255 255 / 20%)!important;
    background:transparent!important;
    color:#fff!important;
    font-weight:400!important;
  }
  body.home-v2.shared-layout .shared-site-header .main-nav>.nav-link.active,
  body.home-v2.shared-layout .shared-site-header .main-nav>.satc-dropdown.active>.nav-link{font-weight:700!important}
  body.home-v2.shared-layout .shared-site-header .main-nav .nav-link::after{content:none!important}
  body.home-v2.shared-layout .shared-site-header .main-nav .has-menu i{color:#fff!important}
  /* An opened group lists its links in a softer white on the same veil. */
  body.home-v2.shared-layout .shared-site-header .main-nav .satc-dropdown .dropdown-menu{border:0!important;background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  body.home-v2.shared-layout .shared-site-header .main-nav .satc-dropdown .dropdown-item>i{display:none!important}
  body.home-v2.shared-layout .shared-site-header .main-nav .satc-dropdown .dropdown-item{border:0!important;background:transparent!important;color:rgb(255 255 255 / 78%)!important;font-weight:400!important}
  body.home-v2.shared-layout .shared-site-header .main-nav .satc-dropdown .dropdown-item:is(:hover,:focus-visible){color:#fff!important}
  body.home-v2.shared-layout .shared-site-header .main-nav>:is(.mobile-nav-login,.mobile-nav-account){
    min-height:50px;
    margin-top:auto;
    padding:6px 8px 6px 16px;
    border:0;
    border-radius:999px;
    background:#fff;
    color:var(--satc-root-brew);
  }
  [dir=ltr] body.home-v2.shared-layout .shared-site-header .main-nav>:is(.mobile-nav-login,.mobile-nav-account){padding:6px 16px 6px 8px}
  body.home-v2.shared-layout .shared-site-header .main-nav>:is(.mobile-nav-login,.mobile-nav-account) .fa-circle-user{background:var(--satc-root-brew);color:#fff}
  body.home-v2.shared-layout .shared-site-header .main-nav>:is(.mobile-nav-login,.mobile-nav-account) .fa-arrow-left{color:var(--satc-root-brew)}
}

/* Fixed header as on roshn.sa: the bar keeps its size when the page scrolls,
   its glass darkens (black 5% at the top, 20% once scrolled, over a 12px
   blur), it sits 44px down at the top and 20px once scrolled on desktop,
   and it slides away on scroll down and back on scroll up, over a second. */
@media (min-width:801px){
  body.home-v2 .shared-site-header.header.navbar{top:44px!important;transition:top 1s ease,background 1s ease!important}
  body.home-v2 .shared-site-header.header.navbar.is-scrolled{
    top:20px!important;
    width:min(1760px,calc(100% - clamp(40px,7vw,136px)))!important;
    height:90px!important;
    background:linear-gradient(rgb(0 0 0 / 20%),rgb(0 0 0 / 20%)),linear-gradient(90deg,rgb(123 118 118 / 20%),rgb(255 255 255 / 20%))!important;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }
  body.home-v2 .shared-site-header.is-scrolled .logo{height:58px}
  html.mega-menu-open body.home-v2 .shared-site-header.header.navbar.is-scrolled::before{background:linear-gradient(rgb(0 0 0 / 20%),rgb(0 0 0 / 20%)),linear-gradient(90deg,rgb(123 118 118 / 20%),rgb(255 255 255 / 20%))}
}
@media (max-width:800px){
  body.home-v2 .shared-site-header.header.navbar{transition:top 1s ease!important}
  body.home-v2 .shared-site-header.header.navbar.is-scrolled::before{
    background:linear-gradient(rgb(0 0 0 / 20%),rgb(0 0 0 / 20%)),linear-gradient(90deg,rgb(123 118 118 / 20%),rgb(255 255 255 / 20%));
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }
}
body.home-v2 .shared-site-header.header.navbar.is-hidden{top:-130px!important}

/* Header layout as on roshn.sa. Desktop: the logo alone on the start side and
   everything else grouped at the far end: the links, a thin rule, search,
   the language switch, another rule, then the sign-in button. Phones: the
   logo and the menu button; while the menu is open the language pill and
   search join the bar, a thin rule before the close button. */
body.home-v2.shared-layout .shared-site-header .main-nav>.site-language-switch{display:none!important}
body.home-v2.shared-layout .shared-site-header>:is(.header-search,.header-language){
  position:relative;
  display:inline-flex;
  flex:none;
  align-items:center;
  justify-content:center;
  min-width:44px;
  height:44px;
  padding:0;
  border:0;
  background:transparent;
  color:#fff!important;
  font-size:15px;
  font-weight:600;
  text-decoration:none;
  cursor:pointer;
}
body.home-v2.shared-layout .shared-site-header>.header-search{font-size:16px}
body.home-v2.shared-layout .shared-site-header>.header-search:hover,
body.home-v2.shared-layout .shared-site-header>.header-language:hover{opacity:.8}
@media (min-width:801px){
  body.home-v2.shared-layout .shared-site-header{justify-content:flex-start!important}
  body.home-v2.shared-layout .shared-site-header>.main-nav{flex:0 1 auto!important;justify-content:flex-end!important;margin-inline-start:auto!important;gap:clamp(16px,1.6vw,28px)!important}
  body.home-v2.shared-layout .shared-site-header>.header-search{margin-inline-start:clamp(20px,1.8vw,32px);padding-inline-start:clamp(16px,1.4vw,22px)}
  body.home-v2.shared-layout .shared-site-header>.header-language{margin-inline-end:clamp(20px,1.8vw,32px);padding-inline-end:clamp(16px,1.4vw,22px)}
  body.home-v2.shared-layout .shared-site-header>.header-search::before,
  body.home-v2.shared-layout .shared-site-header>.header-language::after{content:"";position:absolute;top:50%;width:1px;height:19px;background:rgb(255 255 255 / 50%);translate:0 -50%}
  body.home-v2.shared-layout .shared-site-header>.header-search::before{inset-inline-start:0}
  body.home-v2.shared-layout .shared-site-header>.header-language::after{inset-inline-end:0}
  body.home-v2.shared-layout .shared-site-header>.outline{margin-inline-start:0!important}
  /* The logo, links and sign-in carry order 1, 2 and 3 from older rules. */
  body.home-v2.shared-layout .shared-site-header>:is(.header-search,.header-language){order:2}
}
@media (max-width:800px){
  body.home-v2.shared-layout .shared-site-header>:is(.header-search,.header-language){display:none!important}
  /* Logo plus three controls must fit the 343px bar: tighter gaps while open. */
  html.nav-drawer-open body.home-v2.shared-layout .shared-site-header.header.navbar{column-gap:6px!important;justify-content:flex-start!important}
  /* The language link carries dir=ltr, so the gap that groups the controls
     sits after the logo rather than on the link. */
  html.nav-drawer-open body.home-v2.shared-layout .shared-site-header>.logo{margin-inline-end:auto!important}
  /* As on roshn.sa the menu button is a bare icon (no frame), and the
     language switch a small outlined pill. */
  body.home-v2.shared-layout .shared-site-header>.menu{order:3;width:40px!important;height:40px!important;margin-inline-start:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:#fff!important;font-size:22px!important}
  html.nav-drawer-open body.home-v2.shared-layout .shared-site-header>.header-language{
    order:1;
    display:inline-flex!important;
    min-width:40px;
    height:30px!important;
    margin-inline:0!important;
    padding:0 12px;
    border:1px solid rgb(255 255 255 / 60%)!important;
    border-radius:999px!important;
    font-size:14px;
  }
  html.nav-drawer-open body.home-v2.shared-layout .shared-site-header.header>.header-language.site-language-switch{height:28px!important;min-height:0!important;padding:0 14px!important;line-height:1!important}
  html.nav-drawer-open body.home-v2.shared-layout .shared-site-header>.header-search{order:2;display:inline-flex!important;min-width:36px;margin-inline:0 13px}
  html.nav-drawer-open body.home-v2.shared-layout .shared-site-header>.header-search::after{content:"";position:absolute;top:50%;inset-inline-end:-10px;width:1px;height:19px;background:rgb(255 255 255 / 50%);translate:0 -50%}
}

/* Search layer as on roshn.sa: the page blurs away behind a large white pill field
   lined up with the header bar, with a round close button beside it. */
.site-search{
  position:fixed;
  inset:0;
  z-index:1400;
  padding:44px calc((100% - min(1760px,100% - clamp(40px,7vw,136px))) / 2) 0;
  background:rgb(0 0 0 / 40%);
  backdrop-filter:blur(32px);
  -webkit-backdrop-filter:blur(32px);
}
.site-search[hidden]{display:none}
.site-search-form{display:flex;align-items:center;gap:16px}
.site-search-field{flex:1;min-width:0;display:flex;align-items:center;gap:16px;height:80px;padding-inline:32px;border-radius:999px;background:#fff;color:var(--satc-root-brew)}
.site-search-field i{font-size:20px;opacity:.7}
.site-search-field input{flex:1;min-width:0;height:100%;border:0;background:transparent;color:var(--satc-root-brew);font:inherit;font-size:20px}
.site-search-field input:focus,.site-search-field input:focus-visible{outline:none!important}
/* No browser clear button inside the pill; the round close button sits beside it. */
:is(.site-search-field,.site-search-page-form) input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.site-search-close{flex:none;width:56px;height:56px;display:grid;place-items:center;border:1px solid rgb(255 255 255 / 60%);border-radius:50%;background:transparent;color:#fff;font-size:18px;cursor:pointer}
.site-search-close:hover{background:#fff;color:var(--satc-root-brew)}
html.site-search-open,html.site-search-open body{overflow:hidden}
@media (max-width:800px){
  .site-search{padding:12px 16px 0}
  .site-search-form{gap:10px}
  .site-search-field{height:56px;padding-inline:18px;gap:12px}
  .site-search-field input{font-size:16px}
  .site-search-close{width:46px;height:46px}
}

/* Signed in: the account button takes the sign-in button's place at the far
   end of the bar (after search and the language switch); the menu's own
   account row is for phones only. */
@media (min-width:801px){
  body.home-v2.shared-layout .shared-site-header .main-nav>.mobile-nav-account{display:none!important}
  body.home-v2.shared-layout .shared-site-header>.header-account{gap:8px;max-width:220px}
  body.home-v2.shared-layout .shared-site-header>.header-account span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* Project and unit heroes on phones: the copy sits at the bottom and the
   white facts strip is pinned there too, so they overlapped. Keep the
   strip's height (plus a gap) clear below the copy. */
@media (max-width:700px){
  /* The copy is centred in the space between the floating bar (82px) and the
     strip, as on the other heroes; project and unit pages alike. */
  .shared-layout .project-detail-hero:has(.project-hero-facts){align-items:center!important;padding-top:82px!important;padding-bottom:var(--hero-facts-h,92px)!important}
  .shared-layout .project-detail-hero:has(.project-hero-facts) .project-hero-copy{padding-block:24px!important}
  /* Facts share the strip evenly: the unit page kept three fixed 180px columns, hiding the price. */
  .shared-layout .project-detail-hero .project-hero-facts{inset-inline:16px!important;width:auto!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .shared-layout .project-detail-hero .project-hero-facts>div{min-width:0;padding:14px 10px!important}
}

/* Project and unit overview on medium screens: the 330-410px booking panel
   left the description a narrow column beside it (353px at 930px), so below
   1100px they stack: description first, then the panel, full width. */
@media (max-width:1100px){
  .shared-layout.single-project-page .project-overview-grid{grid-template-columns:minmax(0,1fr)!important;gap:var(--pc-space-5xl)!important}
  .shared-layout.single-project-page .project-overview-grid>.project-inquiry{position:static!important}
}

/* Error pages open on a light background with no photo, so the white bar
   content vanished on the clear glass; the bar takes the brown tint there. */
body.home-v2.error-page .shared-site-header.header.navbar{background:rgb(57 39 30 / 88%)!important}
@media (max-width:800px){body.home-v2.error-page .shared-site-header.header.navbar::before{background:rgb(57 39 30 / 88%)!important}}