/* GS Support · V4
   Brand navigation / enhanced full-width hero / scroll-based editorial chapters.
   Editable layer: values here override compiled Tailwind and legacy effects.
 */
:root{--v4-header:78px;--v4-red:#8E2025;--v4-red-dark:#771B1D}
html{scroll-padding-top:calc(var(--v4-header) + 18px)}
/* NAV: a single solid red plane with the same hue as the supplied logo background */
.site-header,.site-header.scrolled{position:fixed;top:0;left:0;right:0;background:#8E2025;background:linear-gradient(105deg,#8E2025 0%,#8E2025 57%,#811B20 100%);backdrop-filter:none;border-bottom:1px solid rgba(255,255,255,.20);box-shadow:0 7px 36px rgba(30,3,8,.22)}
.site-header:not(.scrolled){height:84px}.site-header.scrolled{height:78px}
.site-header .brand-link{background:#8E2025;box-shadow:none}
.site-header .desktop-nav a{color:rgba(255,247,247,.84)}
.site-header .desktop-nav a:is(:hover,.active){color:#fff}
.site-header .desktop-nav a.active:after{background:#fff;width:14px;height:2px;border-radius:2px;left:calc(50% - 7px)}
.site-header .nav-cta{background:rgba(24,4,8,.24);border-color:rgba(255,255,255,.42)}
.site-header .nav-cta:hover{background:#fff;color:#771B1D;border-color:#fff}
.site-header .menu-trigger{border-color:rgba(255,255,255,.5)}
.site-header .mobile-nav{background:linear-gradient(145deg,#8E2025,#69151b 85%);border-color:rgba(255,255,255,.25)}
.site-header .mobile-nav a{border-color:rgba(255,255,255,.22)}
.site-header .mobile-nav a span{color:#edb4b5}
.reading-progress{z-index:130;background:#f3c0ba}
/* HERO: canvas is drawn across the ENTIRE viewport; color contrast remains usable. */
.hero{background:radial-gradient(ellipse at 50% 65%,#201017 0%,#100b0d 67%,#0c080b 100%)}
.hero-grid{opacity:.42;mask-image:linear-gradient(90deg,#000 0%,#000 82%,rgba(0,0,0,.68));background-size:72px 72px}
.hero-canvas{z-index:3;opacity:.86;mix-blend-mode:screen}
.hero:before{z-index:1;background:linear-gradient(90deg,rgba(12,8,12,.97) 0%,rgba(13,8,13,.91) 22%,rgba(18,10,15,.54) 47%,rgba(35,9,15,.04) 78%),radial-gradient(ellipse at 36% 51%,rgba(138,29,38,.22),transparent 70%)}
.hero-noise{z-index:4;opacity:.12}
.hero-red-field{width:54%;opacity:.95}
.hero-red-glow{z-index:2;right:auto;left:8%;top:12%;width:84vw;height:70vw;max-height:850px;filter:blur(120px);background:radial-gradient(circle,rgba(198,44,62,.21),transparent 68%);pointer-events:none}
.hero-scan-ribbon{position:absolute;inset:-40% -35%;z-index:3;pointer-events:none;opacity:.58;background:linear-gradient(105deg,transparent 35%,rgba(241,78,91,.04) 44%,rgba(255,150,150,.21) 49.4%,rgba(255,184,174,.30) 50%,rgba(241,78,91,.05) 51.5%,transparent 62%);transform:translateX(-56%) rotate(-7deg);animation:hero-scan-wide 12s ease-in-out infinite}
.hero-depth-line{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.35;background:repeating-linear-gradient(164deg,transparent 0,transparent 151px,rgba(238,87,102,.065) 152px,transparent 154px);mask-image:radial-gradient(ellipse,#000,transparent 84%)}
@keyframes hero-scan-wide{0%,13%{transform:translateX(-57%) rotate(-7deg)}53%,74%{transform:translateX(47%) rotate(-7deg)}100%{transform:translateX(-57%) rotate(-7deg)}}
.hero-layout{z-index:6}.hero-copy{z-index:7}.hero-art{z-index:6}
.hero .hero-title em{color:#f49898;text-shadow:0 0 28px rgba(198,46,57,.24)}
.hero .hero-description{color:#d3c0c7}
.hero .hero-grid,.hero .hero-canvas{pointer-events:none}
/* scroll narrative: section heading stays in document flow; pin only chapters */
.solutions{overflow:visible;position:relative;isolation:isolate;padding-bottom:0}
.solutions .section-heading-row{margin-bottom:26px}
.scroll-track{position:relative}
.solutions-scroll-track{height:342svh}
.scroll-pin{position:sticky;top:var(--v4-header)}
.solutions-pin{display:flex;flex-direction:column;justify-content:center;gap:12px;height:calc(100svh - var(--v4-header));max-height:1050px}
.scroll-stage-meta{display:flex;justify-content:space-between;align-items:center;color:#cf8990;font-size:10px;letter-spacing:.16em;min-height:20px;font-weight:700}
.solutions-pin .pillars-layout{min-height:0;gap:22px;grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr)}
.solutions-pin .pillar-tab{min-height:clamp(82px,12.6svh,119px)}
.solutions-pin .pillar-feature{min-height:clamp(350px,53svh,540px)}
.solutions-pin .pillar-photo{min-height:0}
.solutions-pin .pillar-content{padding:clamp(20px,3vh,48px) 31px}
.solutions-pin .pillar-content h3{font-size:clamp(23px,2vw,33px)}
.solutions-pin .pillars-footer{margin-top:2px}
.scroll-chapters{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:3px}
.scroll-chapters span{height:3px;background:rgba(255,255,255,.11);position:relative;overflow:hidden;border-radius:100px}
.scroll-chapters span:after{content:"";position:absolute;inset:0;transform:scaleX(0);transform-origin:left;background:#e8797e;transition:transform .35s}
.scroll-chapters span.is-done:after{transform:scaleX(1)}
.solutions-pin .pillar-photo{background-size:cover;background-position:center;will-change:background-position}
.solutions-pin .pillar-feature{box-shadow:0 30px 70px rgba(0,0,0,.12)}
/* connected vision: selected node cycles through the four axes as visitor scrolls */
.ecosystem{padding:0;overflow:visible}
.ecosystem-scroll-track{height:338svh;position:relative}
.ecosystem-pin{height:calc(100svh - var(--v4-header));top:var(--v4-header);position:sticky;min-height:0;max-height:1050px}
.ecosystem .eco-stage{width:min(100%,min(67vh,585px));transform:translateY(calc((.5 - var(--eco-motion, .5))*26px));transition:transform .3s ease-out}
.ecosystem .eco-copy,.ecosystem .eco-stage{min-width:0}
.ecosystem .eco-choice{padding-top:clamp(9px,1.6svh,15px);padding-bottom:clamp(9px,1.6svh,15px)}
.ecosystem .eco-detail{min-height:70px;padding-top:15px}
.ecosystem .eco-intro{margin-bottom:clamp(16px,3vh,36px)}
.ecosystem .display-heading{margin:20px 0 19px}
.eco-scroll-status{position:sticky;top:calc(100svh - 23px);width:max-content;max-width:90%;margin-left:auto;margin-right:5%;height:0;transform:translateY(-31px);font-size:9px;color:#b96c77;letter-spacing:.18em;font-weight:700;pointer-events:none}
.eco-scroll-status i{display:inline-block;height:1px;width:33px;background:#b96c77;vertical-align:middle;margin:0 10px}
.eco-scroll-status span:first-child{color:#fff}
.ecosystem .eco-node.is-selected{box-shadow:0 0 0 8px rgba(190,65,76,.09),0 18px 47px rgba(178,53,70,.34)}
/* process is already tied to scroll in V2. V4 makes it explicit and navigable. */
.process .section-heading-row{margin-bottom:56px}
.method-story-grid{display:grid;grid-template-columns:minmax(235px,.38fr) minmax(0,1fr);gap:clamp(32px,5vw,90px);align-items:start}
.method-side{height:100%;position:relative}
.method-side-sticky{position:sticky;top:calc(var(--v4-header) + 45px);padding:17px 25px 27px 0}
.method-side-label{font-size:10px;letter-spacing:.19em;font-weight:800;color:#8e2025;margin:0 0 12px}
.method-side-number{display:block;font-family:Manrope,system-ui,sans-serif;font-size:clamp(68px,7vw,117px);font-weight:800;line-height:1.16;letter-spacing:-.10em;color:#842127;font-variant-numeric:tabular-nums}
.method-side-number span{font-size:18px;font-weight:600;letter-spacing:-.04em;color:#a38e8d}
.method-side-track{height:3px;width:85%;background:#e7d9d8;overflow:hidden;margin:25px 0}
.method-side-track span{display:block;height:100%;width:0;background:#8e2025;transition:width .23s ease}
.method-nav{display:flex;flex-direction:column;gap:15px}
.method-nav a{font-size:12px;font-weight:700;color:#9a8787;transition:color .3s,transform .3s;max-width:max-content}
.method-nav a.is-active,.method-nav a:hover{color:#7e2227;transform:translateX(5px)}
.method-side-foot{display:block;font-size:9px;letter-spacing:.15em;color:#ab9291;margin-top:38px}
.method-story-grid .process-list{border-top:0}
.method-story-grid .process-step{min-height:clamp(360px,73svh,670px);padding:clamp(24px,5vw,56px);grid-template-columns:48px 77px 1fr;grid-template-rows:1fr 1fr;align-content:center;align-items:end;column-gap:18px;position:relative;border:1px solid #ded1cf;border-radius:12px;margin-bottom:22px;background:#fffdfa;scroll-margin-top:calc(var(--v4-header) + 12vh);box-shadow:0 17px 40px rgba(64,19,24,.04)}
.method-story-grid .process-step.is-current{background:linear-gradient(128deg,#fffdfa 30%,#f3e1de 100%);border-color:#c78386;box-shadow:0 24px 62px rgba(104,27,38,.08)}
.method-story-grid .step-index{font-size:14px;align-self:center}
.method-story-grid .step-icon{align-self:center}
.method-story-grid .process-step>div:nth-of-type(2){grid-column:1/4;grid-row:2;align-self:start;padding-top:24px}
.method-story-grid .process-step h3{font-size:clamp(27px,3.2vw,42px);max-width:520px;line-height:1.23;margin-bottom:17px}
.method-story-grid .process-step p{font-size:clamp(13px,1.2vw,16px);line-height:1.8;max-width:490px}
.method-story-grid .step-end{display:block;grid-column:3;grid-row:1;text-align:right;align-self:center;font-size:10px}
.method-story-grid .process-step:after,.method-story-grid .process-list:before,.method-story-grid .process-list:after{display:none}
/* responsive: avoid trapping touch users in a too-tall sticky scene */
@media(max-width:1100px), (max-height:730px){
  .solutions{padding-bottom:70px}
  .solutions-scroll-track,.ecosystem-scroll-track{height:auto}
  .solutions-pin,.ecosystem-pin{position:relative;top:auto;height:auto;max-height:none;display:block}
  .solutions-pin .pillars-layout{display:grid;grid-template-columns:1fr;gap:20px}
  .solutions-pin .pillars-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .solutions-pin .pillar-tab{min-height:90px}
  .solutions-pin .pillar-feature{min-height:450px}
  .solutions-pin .pillar-photo{min-height:390px}
  .ecosystem{padding:85px 0}
  .ecosystem .eco-stage{width:min(100%,520px);transform:none}
  .eco-scroll-status,.scroll-stage-meta{display:none}
  .method-story-grid .process-step{min-height:400px}
}
@media(max-width:820px){
  .method-story-grid{grid-template-columns:1fr;gap:18px}
  .method-side-sticky{top:74px;background:rgba(249,245,243,.98);z-index:4;padding:12px 0 14px;border-bottom:1px solid #e0ccca}
  .method-side-number{font-size:45px;display:inline-block;vertical-align:middle;margin-right:18px}
  .method-side-number span{font-size:13px}
  .method-side-label{margin:0;display:inline-block}
  .method-side-track{width:100%;margin:9px 0}
  .method-nav{display:flex;flex-direction:row;flex-wrap:wrap;gap:9px 16px}
  .method-nav a{font-size:11px}
  .method-side-foot{display:none}
  .method-story-grid .process-step{min-height:370px;scroll-margin-top:165px}
}
@media(max-width:767px){
  :root{--v4-header:74px}
  .site-header:not(.scrolled),.site-header.scrolled{height:74px}
  .site-header .brand-link img{width:175px}
  .hero-canvas{opacity:.77}
  .hero-scan-ribbon{opacity:.28}
  .solutions-pin .pillars-menu{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;border:0}
  .solutions-pin .pillar-tab{display:grid;grid-template-columns:1fr;place-items:center;min-height:68px;padding:9px 2px!important;border:1px solid #51333b;border-radius:7px}
  .solutions-pin .pillar-tab.active{border-color:#bd7379}
  .solutions-pin .pillar-tab .pillar-name,.solutions-pin .pillar-tab .tab-arrow{display:none}
  .solutions-pin .pillar-tab .pillar-n{flex-direction:column;gap:4px}
  .solutions-pin .pillar-tab .pillar-n>span{font-size:11px}
  .solutions-pin .pillar-tab .pillar-n .ico{width:23px;height:23px}
  .solutions-pin .pillar-feature{display:flex;flex-direction:column;min-height:0}
  .solutions-pin .pillar-photo{min-height:205px}
  .solutions-pin .pillar-content{padding:28px 22px;min-height:290px}
  .scroll-chapters{margin-top:20px}
  .method-story-grid .process-step{min-height:330px;grid-template-columns:35px 55px 1fr;padding:24px 20px}
  .method-story-grid .step-icon{width:52px;height:52px}
  .method-story-grid .process-step h3{font-size:27px}
  .method-nav a{font-size:10px}
}
@media(max-width:390px){.solutions-pin .pillar-photo{min-height:155px}.solutions-pin .pillar-content{min-height:300px}.method-nav{gap:7px 10px}.method-story-grid .process-step{min-height:330px}}
@media(prefers-reduced-motion:reduce){
  .hero-scan-ribbon,.hero-depth-line{display:none!important}
  .hero-canvas{opacity:.45!important}
  .scroll-pin,.method-side-sticky{position:relative;top:auto}
  .solutions-scroll-track,.ecosystem-scroll-track{height:auto}
  .solutions-pin{height:auto;max-height:none}
  .ecosystem-pin{height:auto;max-height:none}
  .scroll-chapters span:after,.method-side-track span{transition:none!important}
}
/* Keep the atmospheric glow inside its own section instead of growing page width.
   Unlike overflow:hidden on the section, clipping only this layer preserves sticky. */
.ecosystem .eco-atmosphere{inset:0}
.ecosystem{overflow-x:clip}
/* Shell-sized backgrounds and orbit ornamentation must not grow horizontal scroll. */
html,body{max-width:100%;overflow-x:clip}
/* Taller phone screens can use a compact pinned storytelling layout; on smaller
   displays the ordinary accessible tabs remain in the document flow. */
@media(max-width:767px) and (min-height:780px) and (prefers-reduced-motion:no-preference){
 .solutions{padding-bottom:0}
 .solutions-scroll-track{height:322svh}
 .ecosystem-scroll-track{height:325svh}
 .solutions-pin,.ecosystem-pin{position:sticky;top:74px;height:calc(100svh - 74px);max-height:none;display:flex;flex-direction:column;justify-content:center}
 .solutions-pin .pillars-layout{display:flex;flex-direction:column;gap:12px}
 .solutions-pin .pillars-menu{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
 .solutions-pin .pillar-tab{min-height:60px}
 .solutions-pin .pillar-feature{min-height:0}
 .solutions-pin .pillar-photo{min-height:175px}
 .solutions-pin .pillar-content{min-height:0;padding:20px 18px 22px}
 .solutions-pin .pillar-content h3{font-size:22px;margin:9px 0}
 .solutions-pin .pillar-content p{font-size:11px;line-height:1.55}
 .solutions-pin .pillar-content .feature-tags{margin-top:11px;gap:5px}
 .solutions-pin .pillar-content .feature-tags span{font-size:9px;padding:5px 7px}
 .solutions-pin .pillar-content .feature-link{margin-top:13px;font-size:10px}
 .solutions-pin .pillars-footer{margin-top:0}
 .scroll-stage-meta{display:flex;font-size:8px}
 .ecosystem{padding:0}
 .ecosystem-pin{gap:0;display:flex;align-items:center;justify-content:center;flex-direction:column}
 .ecosystem-layout{gap:2px}
 .ecosystem-copy{width:100%}
 .ecosystem .eco-kicker{font-size:9px}
 .ecosystem .display-heading{font-size:39px;line-height:1.08;margin:10px 0 12px}
 .ecosystem .eco-intro{font-size:12px;line-height:1.5;margin:0 0 8px}
 .ecosystem .eco-selector{gap:0 12px}
 .ecosystem .eco-choice{font-size:11px;padding:8px 4px;grid-template-columns:19px 1fr 12px;gap:5px}
 .ecosystem .eco-choice-index{font-size:8px}
 .ecosystem .eco-detail{min-height:63px;padding-top:10px}
 .ecosystem .eco-detail-kicker{font-size:8px}
 .ecosystem .eco-detail p{font-size:11px;line-height:1.5;margin-top:5px}
 .ecosystem .eco-stage{width:min(73vw,250px);max-width:250px;margin:auto}
 .ecosystem .eco-node{height:45px;width:50px;border-radius:11px}
 .ecosystem .eco-node .ico{height:18px;width:18px}
 .ecosystem .eco-node small{font-size:4.9px}
 .ecosystem .eco-real-isotipo{width:20px;height:38px}
 .eco-scroll-status{display:block}
}
.pillars-footer #pillar-footer-current{display:inline!important;color:inherit}