/* PEREGRINANS motion policy: keep cinematic scroll reveals, transitions and typography
   active on every device even when iOS/OS Reduce Motion is enabled, per brand direction.
   The audio controls, device-specific layout and image assets are unchanged. */
/* PEREGRINANS enhancements: bottom navigator, refined footer, cinematic reveals. */
.menu-item .menu-n{display:none}
.menu-item .menu-arrow{font-family:Arial,Helvetica,sans-serif;font-size:23px;font-weight:400;line-height:1;transition:transform .3s ease}
.menu-item:hover .menu-arrow{transform:translateX(7px)}
.menu-item{opacity:0;transform:translateY(14px);transition:padding .3s,color .25s,opacity .52s var(--ease),transform .52s var(--ease)}
.site-menu.open .menu-item{opacity:1;transform:none;transition-delay:calc(var(--menu-order,0)*24ms)}
.chapter-rail{position:fixed!important;z-index:65!important;left:50%!important;right:auto!important;top:auto!important;bottom:24px!important;transform:translateX(-50%)!important;width:min(880px,calc(100% - 48px))!important;filter:drop-shadow(0 12px 28px rgba(0,18,11,.27))}
.rail-trigger{width:100%!important;min-height:70px;display:grid!important;grid-template-columns:minmax(0,1fr) clamp(72px,18vw,146px) minmax(0,1fr);align-items:center!important;column-gap:16px;flex-direction:row!important;justify-content:initial!important;padding:13px 23px!important;text-align:left;border-radius:8px;background:rgba(3,57,31,.88)}
.rail-index{grid-column:1;justify-self:start;font-size:26px;white-space:nowrap}
.rail-track{grid-column:2;justify-self:center;display:block!important;width:100%!important;height:3px!important;min-height:3px;max-height:3px;position:relative!important;background:rgba(237,247,230,.3)}
.rail-fill{height:3px!important;top:0!important;left:0!important;transition:width .3s linear!important}
.rail-current{grid-column:3;justify-self:end;display:block!important;min-width:0;max-width:100%!important;max-height:none!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;writing-mode:horizontal-tb!important;text-orientation:mixed!important;text-align:right;font-size:13px;letter-spacing:.05em}
.rail-drawer{position:absolute!important;top:auto!important;left:0!important;right:0!important;bottom:calc(100% + 9px)!important;width:100%!important;height:auto!important;max-height:min(65vh,560px)!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 26px;overflow-y:auto;border-radius:9px;border:1px solid rgba(255,255,255,.18);background:rgba(3,53,28,.97);backdrop-filter:blur(22px);box-shadow:0 -15px 60px rgba(0,21,10,.25);padding:20px 25px}
.chapter-rail.is-open .rail-drawer{display:grid!important}
.rail-drawer a{justify-content:flex-start;align-items:baseline;text-align:left}
.rail-drawer a span{flex:1}
.footer-wordmark{display:inline-flex!important;align-items:center;width:clamp(158px,19vw,240px)!important;max-width:270px;font-size:initial!important;letter-spacing:normal!important;line-height:normal!important;white-space:normal!important;overflow:visible!important}
.footer-wordmark img{display:block;width:100%;height:auto;object-fit:contain}
.footer{padding-top:55px}.footer-bottom{margin-top:44px}
@media(max-width:620px){
.chapter-rail{bottom:14px!important;width:calc(100% - 28px)!important}
.rail-trigger{min-height:60px;padding:11px 13px!important;grid-template-columns:minmax(0,1fr) clamp(64px,19vw,94px) minmax(0,1fr);column-gap:11px}
.rail-index{font-size:24px}.rail-current{font-size:11px;letter-spacing:0}
.rail-drawer{grid-template-columns:1fr;gap:0;padding:10px 16px;max-height:62vh!important}
.footer-wordmark{width:clamp(160px,50vw,210px)!important}.footer-bottom{margin-top:34px}
}
@media(min-width:621px) and (max-width:900px){.chapter-rail{bottom:19px!important}.rail-trigger{min-height:66px}}
@media screen{
@view-transition{navigation:auto}
::view-transition-old(root){animation:page-depart .28s ease-in both}
::view-transition-new(root){animation:page-arrive .55s var(--ease) both}
@keyframes page-depart{to{opacity:.3;filter:blur(4px)}}
@keyframes page-arrive{from{opacity:.5;transform:translateY(12px);filter:blur(5px)}to{opacity:1;transform:none;filter:none}}
.story-section .chapter-image{opacity:.83;clip-path:inset(0 5% 0 0);transition:clip-path 1.3s var(--ease),opacity 1.3s var(--ease)}
.story-section:nth-of-type(even) .chapter-image{clip-path:inset(0 0 0 5%)}
.story-section.section-in .chapter-image{opacity:1;clip-path:inset(0)}
.story-section .chapter-image img{transform:scale(1.08);filter:saturate(.84);transition:transform 2.2s var(--ease),filter 2s var(--ease)}
.story-section.section-in .chapter-image img{transform:scale(1);filter:saturate(1)}
.story-section.section-in:hover .chapter-image img{transform:scale(1.035)}
.story-section .section-topline,.story-section .section-bottomline{transform:translateY(11px);opacity:.32;transition:transform 1s var(--ease),opacity 1s var(--ease)}
.story-section.section-in .section-topline,.story-section.section-in .section-bottomline{transform:none;opacity:.8}
.story-section .chapter-copy h2,.story-section .chapter-copy p,.story-section .chapter-copy .text-link{transform:translateY(20px);opacity:.5;transition:transform 1.1s var(--ease),opacity 1.1s var(--ease)}
.story-section.section-in .chapter-copy h2,.story-section.section-in .chapter-copy p,.story-section.section-in .chapter-copy .text-link{transform:none;opacity:1}
.story-section.section-in .chapter-copy p{transition-delay:.14s}
.story-section.section-in .chapter-copy .text-link{transition-delay:.24s}
.story-section .text-link span{display:inline-block;transition:transform .35s var(--ease)}.story-section .text-link:hover span{transform:translateX(7px)}
.hero-img{translate:0 var(--hero-shift,0px)}
}


/* Varied editorial page reveals, used without sticky scenes. */
@media screen{
.motion-ready .interlude-main>p:nth-child(2){opacity:.45;transform:translateY(38px);transition:opacity 1.4s var(--ease),transform 1.4s var(--ease)}
.motion-ready .interlude.section-in .interlude-main>p:nth-child(2){opacity:1;transform:none}
.motion-ready .detail-text h2{opacity:.25;transform:translateY(46px);transition:opacity 1.25s var(--ease),transform 1.25s var(--ease)}
.motion-ready .detail-text p{opacity:.4;transform:translateY(28px);transition:opacity 1.2s var(--ease),transform 1.2s var(--ease)}
.motion-ready .detail-text.section-in h2,.motion-ready .detail-text.section-in p{opacity:1;transform:none}
.motion-ready .detail-text.section-in p{transition-delay:.15s}
.motion-ready .detail-text.section-in p+p{transition-delay:.27s}
.motion-ready .detail-memo{clip-path:inset(0 8% 0 0);opacity:.5;transition:clip-path 1.2s var(--ease),opacity 1.2s var(--ease)}
.motion-ready .detail-memo.section-in{clip-path:inset(0);opacity:1}
.motion-ready .next-chapter strong{transform:translateY(35px);opacity:.42;transition:transform 1.1s var(--ease),opacity 1.1s var(--ease),letter-spacing .8s var(--ease)}
.motion-ready .next-chapter.section-in strong{transform:none;opacity:1}
.next-chapter:hover strong{letter-spacing:-.065em}
.detail-hero>img{animation:hero-arrive 2.7s var(--ease) both}
.detail-hero .detail-kicker,.detail-hero h1,.detail-hero p{animation:detail-text-in 1.2s var(--ease) both}
.detail-hero h1{animation-delay:.13s}.detail-hero p{animation-delay:.27s}
@keyframes detail-text-in{from{opacity:.3;transform:translateY(24px)}to{opacity:1;transform:none}}
}


/* 2026 editorial navigation and cinematic chapters */
.season-marquee{display:none!important}
.sound-button{min-width:48px;min-height:48px;justify-content:center;touch-action:manipulation;position:relative;z-index:3}
.sound-bars{width:26px;height:22px;align-items:center;justify-content:center;gap:4px}
.sound-bars i{width:3px!important;height:6px!important;border-radius:4px}
.sound-button.is-on .sound-bars i{background:#d4e7a5}
.back-home{display:inline-flex;align-items:center;gap:12px}
.back-home::before,.back-home::after,.menu-arrow::before,.pill-link>span::before,.text-link>span::before,.primary-button>span:last-child::before,.next-chapter strong i::before{content:"";display:inline-block;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:10px solid currentColor;vertical-align:middle;transition:transform .3s var(--ease)}
.back-home::before{border:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:10px solid currentColor}
.back-home::after{display:none}
.back-home:hover::before{transform:translateX(-4px)}
.menu-arrow,.pill-link>span,.text-link>span,.primary-button>span:last-child,.next-chapter strong i{font-size:0!important;line-height:1!important;flex-shrink:0}
.menu-arrow::before,.pill-link>span::before,.text-link>span::before,.primary-button>span:last-child::before,.next-chapter strong i::before{font-size:12px}
.menu-item:hover .menu-arrow::before,.text-link:hover>span::before,.pill-link:hover>span::before{transform:translateX(4px)}
.chapter-rail{z-index:66}
.detail-story{background:var(--paper);color:var(--pine-dark);overflow:hidden}
.detail-story.chapter-split{display:grid;grid-template-columns:1fr 1fr;min-height:74vh}
.detail-story.chapter-split:nth-of-type(even){direction:rtl}
.detail-story.chapter-split>*{direction:ltr}
.detail-story .story-photo{min-height:54vh;overflow:hidden;position:relative}
.detail-story .story-photo img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transform:scale(1.09);transition:transform 1.6s var(--ease)}
.detail-story.is-visible .story-photo img{transform:scale(1)}
.detail-story .story-copy{padding:clamp(54px,8vw,148px) clamp(35px,6vw,120px);display:flex;flex-direction:column;justify-content:center}
.detail-story .story-label{font-size:11px;letter-spacing:.22em;color:#608169;text-transform:uppercase;margin-bottom:35px}
.detail-story h2{font-weight:450;font-size:clamp(43px,5vw,92px);line-height:1.01;letter-spacing:-.07em;margin:0 0 35px}
.detail-story p{font-size:clamp(17px,1.5vw,23px);line-height:1.65;max-width:620px;margin:0 0 23px}
.detail-story.chapter-deep{background:#07371f;color:#f0f1e8}
.detail-story.chapter-deep .story-label{color:#c1d2b4}
.detail-story.chapter-wide{padding:clamp(50px,9vw,135px) 6%;background:#e6e5db}
.detail-story.chapter-wide .story-photo{height:min(65vw,680px);min-height:290px;border-radius:3px 75px 3px 3px}
.detail-story.chapter-wide .story-copy{padding:40px 2% 5px;max-width:970px}
.chapter-quote{background:#103e2a;color:#e8eadb;text-align:center;padding:clamp(95px,12vw,180px) 10%;overflow:hidden}
.chapter-quote blockquote{font-family:Georgia,serif;font-size:clamp(39px,6.3vw,112px);line-height:1.14;letter-spacing:-.05em;font-weight:400;margin:0 auto;max-width:1120px}
.chapter-quote span{display:block;font-size:11px;letter-spacing:.27em;margin:0 0 34px;color:#cbd8bc}
.chapter-gallery{background:#e5e6d9;padding:clamp(65px,9vw,120px) 5%;overflow:hidden}
.chapter-gallery>header{display:flex;justify-content:space-between;gap:30px;align-items:flex-end;margin-bottom:45px}
.chapter-gallery h2{font-size:clamp(44px,5.5vw,94px);line-height:1;letter-spacing:-.075em;font-weight:450;margin:0}
.chapter-gallery .gallery-grid{display:grid;grid-template-columns:1.3fr .9fr;gap:20px}
.chapter-gallery figure{margin:0;overflow:hidden;position:relative;min-height:310px}
.chapter-gallery figure:last-child{margin-top:90px}
.chapter-gallery img{width:100%;height:100%;min-height:310px;object-fit:cover;aspect-ratio:1.38;transition:transform 1.4s var(--ease)}
.chapter-gallery figure:hover img{transform:scale(1.05)}
.chapter-gallery figcaption{margin-top:12px;font-size:11px;letter-spacing:.13em;color:#3d6b4e}
@media screen{
.detail-story .story-copy>*{opacity:.25;transform:translateY(34px);transition:transform 1.1s var(--ease),opacity 1.1s var(--ease)}
.detail-story.is-visible .story-copy>*{opacity:1;transform:none}
.detail-story.is-visible .story-copy>*:nth-child(2){transition-delay:.15s}
.detail-story.is-visible .story-copy>*:nth-child(3){transition-delay:.28s}
.detail-story.is-visible .story-copy>*:nth-child(4){transition-delay:.38s}
.chapter-quote blockquote{opacity:.35;transform:translateY(38px);transition:opacity 1.6s var(--ease),transform 1.6s var(--ease)}
.chapter-quote.is-visible blockquote{opacity:1;transform:none}
.chapter-gallery figure{opacity:.5;clip-path:inset(5% 0 5% 0);transition:clip-path 1.3s var(--ease),opacity 1.3s var(--ease)}
.chapter-gallery.is-visible figure{opacity:1;clip-path:inset(0)}
}
@media(max-width:800px){
.detail-story.chapter-split{grid-template-columns:1fr;min-height:unset}
.detail-story.chapter-split:nth-of-type(even){direction:ltr}
.detail-story .story-photo{min-height:47vh}
.detail-story .story-photo img{position:absolute}
.detail-story .story-copy{padding:65px 7% 75px}
.detail-story.chapter-wide{padding:60px 5%}
.detail-story.chapter-wide .story-photo{height:53vh}
.chapter-gallery .gallery-grid{grid-template-columns:1fr}
.chapter-gallery figure:last-child{margin-top:12px}
.chapter-gallery>header{flex-direction:column;align-items:start}
.chapter-quote{padding:105px 7%}
}


/* Remove platform emoji arrows without sacrificing accessible button labels. */
.back-home{font-size:0!important}
.back-home span{font-size:10px!important;line-height:1.5}
@media(max-width:620px){.back-home span{font-size:9px!important}}
.menu-arrow,.pill-link>span,.text-link>span,.primary-button>span:last-child,.next-chapter strong i{font-size:0!important}
.subtle-link{font-size:0!important}
.subtle-link::before{content:"LET'S JOIN FORCES";font-size:13px;letter-spacing:.12em}
.subtle-link::after{content:"";display:inline-block;width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid currentColor;margin-left:13px;vertical-align:middle}


/* Responsive soundtrack switch: centered bars + legible state on mobile. */
.sound-button{min-height:52px;min-width:62px;gap:6px;position:relative;z-index:4;flex-direction:column;justify-content:center;align-items:center;padding:6px 5px!important;line-height:1}
.sound-bars{width:35px;height:23px!important;gap:4px!important;align-items:center;justify-content:center}
.sound-bars i{display:block;width:3px!important;height:4px;min-height:3px;border-radius:20px;background:#f1f5ed;transform-origin:center center;will-change:height}
.sound-button.is-on .sound-bars i:nth-child(1){animation:wavebar-a .58s ease-in-out infinite alternate!important}
.sound-button.is-on .sound-bars i:nth-child(2){animation:wavebar-b .72s ease-in-out infinite alternate!important}
.sound-button.is-on .sound-bars i:nth-child(3){animation:wavebar-c .49s ease-in-out infinite alternate!important}
.sound-button.is-on .sound-bars i:nth-child(4){animation:wavebar-d .64s ease-in-out infinite alternate!important}
@keyframes wavebar-a{from{height:5px}to{height:19px}}
@keyframes wavebar-b{from{height:15px}to{height:4px}}
@keyframes wavebar-c{from{height:6px}to{height:22px}}
@keyframes wavebar-d{from{height:19px}to{height:5px}}
.sound-label{display:block!important;font-size:9px!important;font-weight:700;letter-spacing:.085em;line-height:1.15;white-space:nowrap;color:#edf6e9;opacity:.85}
.sound-button.is-on .sound-label{color:#d7eeba;opacity:1}
@media(max-width:900px){.sound-button{min-width:57px;min-height:58px;gap:5px;padding:4px!important}.sound-label{font-size:8px!important;letter-spacing:.035em}}
@media(max-width:620px){.sound-button{min-width:47px;min-height:58px;gap:4px;padding:4px 1px!important}.sound-bars{width:24px;height:18px!important;gap:3px!important}.sound-bars i{width:2px!important}.sound-label{font-size:7px!important;letter-spacing:.015em;max-width:51px;text-align:center}.header-actions{gap:8px!important}.menu-button{padding-left:12px!important}}



/* Peregrinans chapter-specific visual direction. Each of the 19 chapters
   receives a different combination of entrance angle, pacing and palette. */
.is-detail{--scene-x:28px;--scene-y:18px;--scene-rotate:0deg;--scene-duration:1.45s;--scene-delay:.1s;--scene-radius:0px}
.chapter-variant-01{--scene-x:-72px;--scene-y:13px;--scene-rotate:-1.2deg;--scene-duration:1.65s;--scene-radius:56px}
.chapter-variant-02{--scene-x:58px;--scene-y:40px;--scene-rotate:1.3deg;--scene-duration:1.3s;--scene-radius:110px}
.chapter-variant-03{--scene-x:-40px;--scene-y:-48px;--scene-rotate:-.9deg;--scene-duration:1.8s;--scene-radius:70px}
.chapter-variant-04{--scene-x:94px;--scene-y:10px;--scene-rotate:1deg;--scene-duration:1.5s;--scene-radius:3px}
.chapter-variant-05{--scene-x:-16px;--scene-y:58px;--scene-rotate:-.8deg;--scene-duration:1.9s;--scene-radius:150px}
.chapter-variant-06{--scene-x:72px;--scene-y:-19px;--scene-rotate:1.6deg;--scene-duration:1.45s;--scene-radius:70px}
.chapter-variant-07{--scene-x:-90px;--scene-y:35px;--scene-rotate:-1.4deg;--scene-duration:1.7s;--scene-radius:100px}
.chapter-variant-08{--scene-x:28px;--scene-y:65px;--scene-rotate:1.2deg;--scene-duration:1.55s;--scene-radius:30px}
.chapter-variant-09{--scene-x:-54px;--scene-y:-25px;--scene-rotate:-1deg;--scene-duration:1.85s;--scene-radius:100px}
.chapter-variant-10{--scene-x:75px;--scene-y:34px;--scene-rotate:.6deg;--scene-duration:1.3s;--scene-radius:200px}
.chapter-variant-11{--scene-x:-70px;--scene-y:48px;--scene-rotate:-1.7deg;--scene-duration:1.8s;--scene-radius:50px}
.chapter-variant-12{--scene-x:35px;--scene-y:-72px;--scene-rotate:1.3deg;--scene-duration:1.65s;--scene-radius:40px}
.chapter-variant-13{--scene-x:-95px;--scene-y:2px;--scene-rotate:-.7deg;--scene-duration:1.5s;--scene-radius:95px}
.chapter-variant-14{--scene-x:82px;--scene-y:-20px;--scene-rotate:1.7deg;--scene-duration:1.75s;--scene-radius:140px}
.chapter-variant-15{--scene-x:-35px;--scene-y:60px;--scene-rotate:-1.4deg;--scene-duration:1.6s;--scene-radius:55px}
.chapter-variant-16{--scene-x:108px;--scene-y:22px;--scene-rotate:1deg;--scene-duration:1.4s;--scene-radius:125px}
.chapter-variant-17{--scene-x:-65px;--scene-y:-38px;--scene-rotate:-1.6deg;--scene-duration:1.95s;--scene-radius:45px}
.chapter-variant-18{--scene-x:55px;--scene-y:52px;--scene-rotate:.8deg;--scene-duration:1.55s;--scene-radius:95px}
.chapter-variant-19{--scene-x:-85px;--scene-y:18px;--scene-rotate:-1.1deg;--scene-duration:1.8s;--scene-radius:85px}
.is-detail .detail-story .story-photo{background:linear-gradient(140deg,#426b54,#e5dcc5 64%,#0f4835);isolation:isolate}
.is-detail .detail-story .story-photo img{object-position:center}
.is-detail .detail-story.chapter-wide .story-photo{border-top-right-radius:var(--scene-radius)}
.chapter-variant-03 .chapter-split:nth-of-type(even),
.chapter-variant-07 .chapter-split:nth-of-type(even),
.chapter-variant-11 .chapter-split:nth-of-type(even),
.chapter-variant-15 .chapter-split:nth-of-type(even),
.chapter-variant-19 .chapter-split:nth-of-type(even){background:#e7e4db}
.chapter-variant-02 .chapter-deep,.chapter-variant-10 .chapter-deep,.chapter-variant-18 .chapter-deep{background:#123d43}
.chapter-variant-04 .chapter-deep,.chapter-variant-12 .chapter-deep{background:#3c3f2b}
.chapter-variant-06 .chapter-deep,.chapter-variant-14 .chapter-deep{background:#2b473a}
.chapter-variant-08 .chapter-deep,.chapter-variant-16 .chapter-deep{background:#0d4a31}
.chapter-variant-05 .chapter-wide,.chapter-variant-13 .chapter-wide{background:#eae3d5}
.chapter-variant-09 .chapter-wide,.chapter-variant-17 .chapter-wide{background:#e0e6de}
.chapter-variant-11 .chapter-wide,.chapter-variant-19 .chapter-wide{background:#e2e7dd}
.chapter-variant-01 .chapter-quote,.chapter-variant-08 .chapter-quote,.chapter-variant-15 .chapter-quote{background:#203e37}
.chapter-variant-03 .chapter-quote,.chapter-variant-10 .chapter-quote,.chapter-variant-17 .chapter-quote{background:#1e403b}
.chapter-variant-05 .chapter-quote,.chapter-variant-12 .chapter-quote,.chapter-variant-19 .chapter-quote{background:#243e32}
@media screen{
.is-detail .detail-story .story-photo{overflow:hidden}
.is-detail .detail-story .story-copy>*{
transition-duration:var(--scene-duration)!important;
transform:translate(var(--scene-x),var(--scene-y)) rotate(var(--scene-rotate));
}
.is-detail .detail-story.is-visible .story-copy>*{transform:translate(0,0) rotate(0)}
.is-detail .detail-story .story-photo img{
filter:saturate(.76) brightness(.93);transform:scale(1.14) rotate(var(--scene-rotate));
transition:clip-path var(--scene-duration) var(--ease),transform calc(var(--scene-duration) + .6s) var(--ease),filter var(--scene-duration) var(--ease),border-radius var(--scene-duration) var(--ease);
}
.is-detail .detail-story.is-visible .story-photo img{filter:saturate(1) brightness(1);transform:scale(1) rotate(0)}
/* Image one: gradual mask entering from the content edge */
.chapter-variant-01 .chapter-split .story-photo img,
.chapter-variant-05 .chapter-split .story-photo img,
.chapter-variant-09 .chapter-split .story-photo img,
.chapter-variant-13 .chapter-split .story-photo img,
.chapter-variant-17 .chapter-split .story-photo img{
clip-path:polygon(0 0,74% 0,90% 100%,0 100%);
}
:is(.chapter-variant-01,.chapter-variant-05,.chapter-variant-09,.chapter-variant-13,.chapter-variant-17) .chapter-split.is-visible .story-photo img{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
/* Image two: an expanding iris */
:is(.chapter-variant-02,.chapter-variant-06,.chapter-variant-10,.chapter-variant-14,.chapter-variant-18) .chapter-split .story-photo img{clip-path:circle(32% at 65% 54%)}
:is(.chapter-variant-02,.chapter-variant-06,.chapter-variant-10,.chapter-variant-14,.chapter-variant-18) .chapter-split.is-visible .story-photo img{clip-path:circle(95% at 50% 50%)}
/* Image three: vertical botanical wipe */
:is(.chapter-variant-03,.chapter-variant-07,.chapter-variant-11,.chapter-variant-15,.chapter-variant-19) .chapter-split .story-photo img{clip-path:inset(15% 0 15% 0 round 45% 4% 45% 4%)}
:is(.chapter-variant-03,.chapter-variant-07,.chapter-variant-11,.chapter-variant-15,.chapter-variant-19) .chapter-split.is-visible .story-photo img{clip-path:inset(0 0 0 0 round 0)}
/* Image four: fold-out panels */
:is(.chapter-variant-04,.chapter-variant-08,.chapter-variant-12,.chapter-variant-16) .chapter-split .story-photo img{clip-path:polygon(8% 8%,100% 0,90% 88%,0 100%)}
:is(.chapter-variant-04,.chapter-variant-08,.chapter-variant-12,.chapter-variant-16) .chapter-split.is-visible .story-photo img{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
/* Each full-width chapter has a drifting cinematic image and independently arriving text */
.is-detail .chapter-wide .story-photo img{transform:scale(1.12) translateX(-3%)}
.is-detail .chapter-wide.is-visible .story-photo img{transform:scale(1) translateX(0)}
.is-detail .chapter-quote blockquote{filter:blur(3px);transition:opacity 1.3s var(--ease),transform 1.3s var(--ease),filter 1.3s var(--ease);transform:translateY(40px) skewY(-2deg)}
.is-detail .chapter-quote.is-visible blockquote{filter:blur(0);transform:none}
}



/* Release: clear overflow, intentional contact invitation, legible loader, mobile sound */
.site-menu{overflow-x:clip!important;overscroll-behavior-x:none}
.site-menu .menu-scroll{overflow-x:hidden!important;overflow-y:auto!important;width:100%;min-width:0;max-width:100%;scrollbar-gutter:stable}
.site-menu .menu-intro,.site-menu .menu-links{min-width:0;max-width:100%;box-sizing:border-box}
.site-menu .menu-links{overflow-x:clip;contain:layout style}
.site-menu .menu-item{max-width:100%;min-width:0;box-sizing:border-box;overflow:hidden;word-break:normal;transition:background-color .35s,color .35s,border-color .35s,opacity .5s,transform .5s!important}
.site-menu .menu-item:hover{padding-left:3px!important}
.site-menu .menu-item .menu-label{min-width:0;overflow-wrap:break-word}
.site-menu .menu-item:not(.menu-contact-cta):hover .menu-label{transform:translateX(7px)}
.site-menu .menu-item:not(.menu-contact-cta) .menu-label{transition:transform .35s var(--ease)}
.site-menu .menu-contact-cta{position:relative;display:flex;margin:23px 0 30px;padding:27px 26px 25px!important;min-height:126px;align-items:center;gap:18px;border:1px solid #e3edca!important;border-radius:9px;background:linear-gradient(125deg,#dfead2 0%,#f0ecd6 90%);color:#07351e!important;box-shadow:0 12px 36px rgba(0,17,6,.15);overflow:hidden}
.site-menu .menu-contact-cta::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 10%,rgba(255,255,255,.35) 45%,transparent 65%);transform:translateX(-130%);transition:transform .85s var(--ease);pointer-events:none}
.site-menu .menu-contact-cta:hover{padding-left:26px!important;background:#f5f3df;color:#032b19!important;border-color:#fff!important}
.site-menu .menu-contact-cta:hover::after{transform:translateX(130%)}
.site-menu .menu-contact-cta .menu-label{display:flex;flex-direction:column;gap:8px;font-size:clamp(23px,2.25vw,34px);letter-spacing:-.045em;font-weight:550;line-height:1.09}
.site-menu .menu-contact-cta .menu-label::before{content:"A CONVERSATION CAN CHANGE EVERYTHING";display:block;font-size:10px;letter-spacing:.135em;font-weight:700;line-height:1.45;color:#38684c}
.site-menu .menu-contact-cta .menu-arrow{display:grid;place-items:center;flex:0 0 45px;width:45px;height:45px;border-radius:50%;background:#073c23;color:#eaf1d8!important;opacity:1}
.site-menu .menu-contact-cta .menu-arrow::before{border-top-width:6px;border-bottom-width:6px;border-left-width:10px}
.site-menu .menu-contact-cta:hover .menu-arrow::before{transform:translateX(3px)}
#loading-number{font-size:clamp(52px,5.8vw,80px)!important;letter-spacing:-.08em!important;font-weight:500!important;line-height:1!important}
.preloader-bottom{z-index:3;min-width:0}
.preloader-numbers{align-items:flex-end;gap:20px}
.preloader-numbers span:last-child{white-space:nowrap;text-align:right}
.contact-form>label{display:block;margin-bottom:28px}
.contact-form input[type=tel]{appearance:none}
.contact-form .form-action .primary-button{border-radius:80px}
@media(min-width:901px){
.site-menu .menu-scroll{grid-template-columns:minmax(0,.93fr) minmax(0,1.07fr)}
}
@media(max-width:900px){
.site-menu .menu-scroll{display:block;overflow-x:hidden!important}
.site-menu .menu-links{width:100%;max-width:100%}
.site-menu .menu-contact-cta{margin-top:23px;min-height:105px;padding:20px!important}
.site-menu .menu-contact-cta:hover{padding-left:20px!important}
}
@media(max-width:620px){
.site-menu{max-width:100vw;overflow-x:hidden!important}
.site-menu .menu-scroll,.site-menu .menu-links{max-width:100%;min-width:0;overflow-x:hidden!important}
.site-menu .menu-contact-cta{margin:20px 0 24px;padding:19px 15px!important}
.site-menu .menu-contact-cta:hover{padding-left:15px!important}
.site-menu .menu-contact-cta .menu-label{font-size:24px}
.site-menu .menu-contact-cta .menu-label::before{font-size:8px;letter-spacing:.09em}
.site-menu .menu-contact-cta .menu-arrow{width:36px;height:36px;flex-basis:36px}
#loading-number{font-size:52px!important}
.preloader-numbers span:first-child{max-width:46%;line-height:1.5}
.site-header .sound-button{display:flex!important;flex-direction:column!important;justify-content:center!important;gap:5px!important;min-height:56px!important;min-width:50px!important;padding:3px 0!important}
.site-header .sound-button .sound-bars{display:flex!important;width:27px!important;height:20px!important;gap:3px!important}
.site-header .sound-button .sound-label{display:block!important;visibility:visible!important;opacity:1!important;position:static!important;white-space:nowrap;font-size:8px!important;line-height:1.15!important;letter-spacing:.01em!important}
}



/* Layout correction for short browser windows: preserve the entire hero eyebrow. */
@media (min-width:621px) and (max-height:850px){
 .hero{height:auto!important;min-height:100svh!important}
 .hero-inner{height:auto;min-height:100svh;justify-content:flex-start!important;padding-top:calc(var(--header-h) + clamp(22px,4.2vh,56px))!important;padding-bottom:110px!important}
 .hero-kicker{display:flex!important;flex-shrink:0;position:relative;z-index:3;font-size:clamp(9px,1vw,12px);letter-spacing:.13em}
 .hero h1{font-size:clamp(43px,min(8.25vw,11vh),130px)!important;margin:clamp(16px,3vh,26px) 0 clamp(12px,3vh,27px)!important;line-height:.84}
 .hero-bottom{gap:clamp(10px,1.7vw,28px)}
 .hero-bottom p{font-size:clamp(14px,1.2vw,19px)!important}
 .hero-ctas{gap:14px}
}
@media (max-width:620px){
 .hero-inner{height:auto;min-height:100svh;padding-top:calc(var(--header-h) + 34px)!important;padding-bottom:105px!important;justify-content:flex-start!important}
 .hero-kicker{display:flex!important;flex-shrink:0;font-size:clamp(8px,1.9vw,10px)!important;letter-spacing:.105em!important;line-height:1.5}
 .hero h1{font-size:clamp(43px,11.8vw,75px)!important;line-height:.88!important;margin:clamp(26px,4vh,44px) 0 clamp(20px,4vh,40px)!important}
}
@media (max-width:620px) and (max-height:700px){
 .hero-inner{min-height:650px}
 .hero h1{font-size:clamp(40px,10vw,58px)!important}
 .hero-bottom{gap:15px}
}
@media(max-height:540px) and (min-width:621px){
 .hero-inner{min-height:650px!important;padding-top:calc(var(--header-h) + 16px)!important}
 .hero h1{font-size:clamp(40px,min(7vw,9vh),85px)!important}
}


/* Dropdown menu polish: vertical scrolling without a visible track;
   pin navigation triangles within the available row width. */
.site-menu .menu-scroll{
 overflow-y:auto!important;
 overflow-x:hidden!important;
 scrollbar-width:none!important;        /* Firefox */
 -ms-overflow-style:none!important;   /* older Microsoft browsers */
 scrollbar-gutter:auto!important;
 overscroll-behavior-x:none;
}
.site-menu .menu-scroll::-webkit-scrollbar,
.site-menu .menu-scroll::-webkit-scrollbar-track,
.site-menu .menu-scroll::-webkit-scrollbar-thumb{
 width:0!important;
 height:0!important;
 display:none!important;               /* Chrome / Safari / iOS */
 background:transparent!important;
}
.site-menu .menu-links{width:100%;min-width:0;max-width:100%;box-sizing:border-box}
.site-menu .menu-item{
 display:flex!important;
 width:100%;
 max-width:100%!important;
 min-width:0!important;
 box-sizing:border-box;
 padding-right:clamp(12px,2.5vw,28px)!important;
 overflow:hidden!important;
}
.site-menu .menu-item .menu-label{
 flex:1 1 0!important;
 min-width:0!important;
 max-width:100%;
 overflow-wrap:anywhere;
}
.site-menu .menu-item .menu-arrow{
 position:relative;
 flex:0 0 26px;
 width:26px;
 min-width:26px;
 max-width:26px;
 margin-left:auto;
 margin-right:1px;
 display:flex;
 align-items:center;
 justify-content:center;
 transform:none!important;
 box-sizing:border-box;
}
.site-menu .menu-item:hover .menu-arrow{transform:none!important}
.site-menu .menu-item:not(.menu-contact-cta):hover .menu-arrow::before{transform:translateX(2px)!important}
.site-menu .menu-contact-cta{
 padding-right:clamp(18px,3vw,32px)!important;
}
.site-menu .menu-contact-cta .menu-arrow{
 flex:0 0 45px!important;
 min-width:45px!important;
 max-width:45px!important;
 width:45px!important;
 margin-right:0;
}
@media(max-width:620px){
 .site-menu .menu-item{padding-right:12px!important}
 .site-menu .menu-contact-cta{padding-right:17px!important}
 .site-menu .menu-contact-cta .menu-arrow{
  flex-basis:36px!important;
  min-width:36px!important;
  max-width:36px!important;
  width:36px!important;
 }
}


/* 22 October layout release — unified hero hierarchy at all viewport heights.
   The eyebrow, large typographic slogan, explanatory text and CTAs stay in one
   readable left-aligned composition, without clipping on short desktop windows. */
.preloader{
 transition:opacity .42s ease,transform .54s cubic-bezier(.22,.8,.28,1)!important;
}
.preloader.is-gone{opacity:0!important;transform:translateY(-14px)!important}
.hero-inner{box-sizing:border-box}
@media(min-width:901px){
 .hero{height:auto!important;min-height:max(100svh,700px)!important}
 .hero-inner{
  height:auto!important;
  min-height:max(100svh,700px)!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-end!important;
  align-items:flex-start;
  padding:calc(var(--header-h) + clamp(28px,5vh,64px)) 6.8% clamp(116px,13vh,156px)!important;
 }
 .hero-kicker{font-size:clamp(11px,.93vw,14px)!important;line-height:1.45;letter-spacing:.15em!important;flex-shrink:0}
 .hero h1{
  font-size:clamp(74px,min(8.8vw,15.3vh),150px)!important;
  line-height:.80!important;
  max-width:1040px;
  margin:clamp(18px,2.5vh,31px) 0 clamp(15px,2.6vh,28px)!important;
  letter-spacing:-.083em!important;
  flex-shrink:0;
 }
 .hero-bottom{display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;gap:clamp(17px,2.4vh,28px)!important;width:100%}
 .hero-bottom p{max-width:560px!important;font-size:clamp(16px,1.28vw,20px)!important;line-height:1.43}
 .hero-ctas{display:flex!important;align-items:center!important;justify-content:flex-start!important;flex-wrap:wrap;gap:clamp(16px,2vw,27px)!important}
 .hero .pill-link{padding:17px 23px}
 .hero .subtle-link{display:inline-flex;align-items:center;min-height:48px}
}
@media(min-width:621px) and (max-width:900px){
 .hero{height:auto!important;min-height:max(100svh,720px)!important}
 .hero-inner{
  height:auto!important;min-height:max(100svh,720px)!important;
  padding:calc(var(--header-h) + 48px) 7% 120px!important;
  justify-content:flex-end!important;align-items:flex-start!important;
 }
 .hero-kicker{font-size:11px!important;line-height:1.45}
 .hero h1{font-size:clamp(67px,min(10vw,13vh),115px)!important;line-height:.83!important;margin:25px 0 25px!important}
 .hero-bottom{display:flex!important;align-items:flex-start!important;flex-direction:column!important;gap:22px!important}
 .hero-bottom p{max-width:600px!important;font-size:17px!important}
 .hero-ctas{flex-direction:row!important;align-items:center!important;flex-wrap:wrap!important;gap:20px!important}
}
@media(max-width:620px){
 .hero{height:auto!important;min-height:max(100svh,675px)!important}
 .hero-inner{
  height:auto!important;min-height:max(100svh,675px)!important;
  justify-content:flex-start!important;align-items:flex-start!important;
  padding:calc(var(--header-h) + clamp(35px,7svh,60px)) 6% 118px!important;
 }
 .hero-kicker{font-size:clamp(9px,2vw,11px)!important;letter-spacing:.085em!important;max-width:100%;line-height:1.5;flex-shrink:0}
 .hero h1{
  font-size:clamp(45px,11.9vw,77px)!important;line-height:.86!important;
  max-width:100%;margin:clamp(30px,4vh,45px) 0 clamp(24px,3.7vh,37px)!important;
  flex-shrink:0;
 }
 .hero-bottom{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:23px!important}
 .hero-bottom p{font-size:clamp(15px,3.55vw,18px)!important;line-height:1.55;max-width:100%}
 .hero-ctas{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:20px!important}
}
@media(min-width:621px) and (max-height:630px){
 .hero,.hero-inner{min-height:700px!important}
 .hero h1{font-size:clamp(74px,8.2vw,119px)!important}
}
/* Keep the preloader's 100% number inside the frame even on narrow displays. */
.preloader-bottom,.preloader-numbers{width:100%;box-sizing:border-box}
#loading-number{display:inline-block;flex:0 0 auto}


/* Audio meter release: keep animation alive in the fixed header after SPA chapter swaps.
   Use transforms instead of animating heights, avoiding WebKit's retained dot heights. */
.site-header .sound-button .sound-bars{
 display:flex!important;align-items:center!important;justify-content:center!important;
 height:25px!important;gap:4px!important;overflow:visible!important;
}
.site-header .sound-button .sound-bars i{
 display:block!important;
 width:3px!important;
 flex:0 0 3px!important;
 height:22px!important;
 min-height:22px!important;
 border-radius:3px!important;
 transform:scaleY(.18);
 transform-origin:50% 50%!important;
 transition:none!important;
 will-change:transform;
 animation:none!important;
}
.site-header .sound-button[data-playing="true"] .sound-bars i:nth-child(1){
 animation:peregrinans-meter-one .66s ease-in-out infinite alternate!important;
}
.site-header .sound-button[data-playing="true"] .sound-bars i:nth-child(2){
 animation:peregrinans-meter-two .47s ease-in-out infinite alternate!important;
}
.site-header .sound-button[data-playing="true"] .sound-bars i:nth-child(3){
 animation:peregrinans-meter-three .59s ease-in-out infinite alternate!important;
}
.site-header .sound-button[data-playing="true"] .sound-bars i:nth-child(4){
 animation:peregrinans-meter-four .74s ease-in-out infinite alternate!important;
}
@keyframes peregrinans-meter-one{from{transform:scaleY(.17)}to{transform:scaleY(.93)}}
@keyframes peregrinans-meter-two{from{transform:scaleY(.85)}to{transform:scaleY(.21)}}
@keyframes peregrinans-meter-three{from{transform:scaleY(.28)}to{transform:scaleY(1)}}
@keyframes peregrinans-meter-four{from{transform:scaleY(.97)}to{transform:scaleY(.16)}}
@media(max-width:620px){
 .site-header .sound-button .sound-bars{height:20px!important;width:27px!important;gap:3px!important}
 .site-header .sound-button .sound-bars i{height:18px!important;min-height:18px!important;width:2px!important;flex-basis:2px!important}
}



/* Copyright line: visually anchor the legally required text at the footer's lower left.
   Keep the existing brand promise, policy links and Virtagon credit unchanged. */
.footer-bottom > .footer-legal{
 display:flex;
 flex-direction:column;
 align-items:flex-start;
 justify-content:center;
 gap:8px;
 min-width:0;
}
.footer-bottom .footer-copyright{
 display:block;
 color:#f0f5ed;
 font-size:clamp(11px,.83vw,13px);
 font-weight:500;
 letter-spacing:.01em;
 line-height:1.5;
}
.footer-bottom .footer-legal > span:last-child{
 color:#bcd1c1;
 font-size:11px;
 line-height:1.6;
}
@media(max-width:620px){
 .footer-bottom > .footer-legal{
  width:100%;
  gap:5px;
 }
 .footer-bottom .footer-copyright{
  font-size:12px;
 }
}

/* 2026-10-22 — Mobile sound meter first-tap reliability.
   JS Web Animations animate bar transforms from the first successful play event.
   Disable competing CSS keyframes only when that engine is active. */
.site-header .sound-button[data-meter-engine="waapi"] .sound-bars i{
 animation:none!important;
}

/* Direct iOS sound-meter controller, release v6.
   Only JS updates transforms; stale keyframes never compete with first playback. */
.site-header .sound-button[data-meter-engine="manual"] .sound-bars i {
  animation: none !important;
  transition: none !important;
}
