:root{--navy:#00394c;--green:#00ad1f}*{box-sizing:border-box}body{margin:0;background:#001c27;color:white;font-family:Arial,Helvetica,sans-serif;overflow:hidden}.scene{height:100svh;position:relative;display:grid;place-items:center;isolation:isolate;background:radial-gradient(circle at 62% 48%,#0b5260 0%,#00394c 39%,#001c27 80%)}.product{position:absolute;width:min(62vw,660px);max-height:75vh;object-fit:contain;right:7%;filter:drop-shadow(0 30px 55px #001015);animation:product 9s ease-in-out forwards}.logo{position:absolute;left:6%;top:5%;width:clamp(170px,22vw,300px);padding:8px;background:#fff;border-radius:3px}.eyebrow{text-transform:uppercase;font-weight:700;letter-spacing:.22em;font-size:.8rem;color:#69e07e}h1{font-size:clamp(3.6rem,10vw,10rem);line-height:.91;letter-spacing:-.075em;max-width:860px;margin:1.2rem 0}.message{opacity:0;position:absolute;top:50%;left:6%;transform:translateY(-40%);max-width:900px;animation:line1 9s forwards}.message.two{animation:line2 9s forwards}.message.two h1{font-size:clamp(3rem,7vw,7rem)}.enter{position:absolute;right:6%;top:6%;z-index:10;color:white;text-decoration:none;text-transform:uppercase;font-size:.82rem;letter-spacing:.14em;border-bottom:1px solid #69e07e;padding-bottom:7px}.progress{position:absolute;bottom:0;left:0;height:4px;background:var(--green);animation:progress 9s linear forwards}.darken{position:absolute;inset:0;background:#001017;opacity:0;pointer-events:none;animation:dark 9s forwards}@keyframes line1{0%,7%{opacity:0;transform:translateY(-35%)}12%,28%{opacity:1;transform:translateY(-50%)}37%,100%{opacity:0;transform:translateY(-60%)}}@keyframes line2{0%,38%{opacity:0;transform:translateY(-35%)}44%,67%{opacity:1;transform:translateY(-50%)}74%,100%{opacity:0;transform:translateY(-60%)}}@keyframes product{0%,40%{transform:scale(.8)}54%,73%{transform:scale(.84) rotate(-2deg)}77%{transform:scale(.85) rotate(2deg)}83%,100%{transform:scale(5);opacity:0}}@keyframes dark{0%,81%{opacity:0}94%,100%{opacity:1}}@keyframes progress{to{width:100%}}@media(max-width:640px){.product{width:110vw;right:-35%;opacity:.65}.message{left:6%;right:6%}h1{font-size:clamp(3.5rem,15vw,6rem)}.message.two h1{font-size:clamp(3rem,12vw,5rem)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important}.message.one{opacity:1}.product{transform:scale(.8)}.progress{display:none}}
:root{--header-height:80px;--motion-ease:cubic-bezier(.22,1,.36,1)}
img{height:auto}
html{scroll-padding-top:calc(var(--header-height) + 24px)}
[id]{scroll-margin-top:calc(var(--header-height) + 24px)}
.site-header{position:sticky;top:0;z-index:1000;background:#fff;border-bottom:1px solid rgba(0,57,76,.1)}
.site-header .brand{display:flex;align-items:center;min-height:44px}
.mobile-trigger{display:none}
a:focus-visible,button:focus-visible{outline:3px solid #00ad1f;outline-offset:5px}
.button{min-height:48px;background:#008a19;transition:background .2s,transform .3s var(--motion-ease)}
.main-nav a{display:inline-flex;align-items:center;min-height:44px}
.nav-dialog{position:fixed;inset:0 0 0 auto;margin:0;width:min(440px,100%);height:100dvh;max-height:none;max-width:100%;border:0;padding:calc(env(safe-area-inset-top) + 18px) 24px calc(env(safe-area-inset-bottom) + 28px);background:#00394c;color:white}
.nav-dialog::backdrop{background:rgba(0,26,36,.55)}
.nav-dialog-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.nav-dialog-top img{width:195px;max-width:65%;background:#fff;padding:7px;border-radius:3px}
.nav-close{min-width:48px;min-height:48px;background:none;color:white;border:1px solid #ffffff70;border-radius:50%;font-size:24px;cursor:pointer}
.nav-dialog nav{display:flex;flex-direction:column;margin-top:12vh}
.nav-dialog nav a{padding:20px 0;border-bottom:1px solid #ffffff35;font-size:clamp(28px,7vw,40px);text-decoration:none;color:#fff;letter-spacing:-.04em}
.nav-dialog nav a:hover{color:#69e07e}
.nav-dialog p{margin-top:40px;color:#bbd3d9;font-size:14px}
.slide-dot,.slide-dot[aria-current=true]{width:28px;height:44px;border:0;background:transparent;border-radius:0;position:relative;flex:0 0 28px}
.slide-dot:after{content:'';position:absolute;left:10px;top:18px;width:8px;height:8px;border-radius:50%;border:1px solid white}
.slide-dot[aria-current=true]:after{background:#00ad1f;border-color:#00ad1f;box-shadow:0 0 0 4px #00ad1f25}
.slide-dots{gap:0}.slide-arrows button{min-width:44px;min-height:44px}
[data-reveal]{transition-timing-function:var(--motion-ease)!important}
.footer-legal a,.footer-legal button{min-height:44px;display:inline-flex;align-items:center}
.intro-page .site-header{height:80px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;color:#00394c;font-family:Arial,sans-serif}
.intro-page .brand img{width:215px;display:block}.intro-page .main-nav{display:flex;gap:28px}.intro-page .main-nav a{color:#00394c;text-decoration:none;font-size:14px}
.intro-page .scene{height:calc(100svh - 80px)}
.intro-page .enter{min-height:44px;display:flex;align-items:center}
@media(max-width:760px){
 :root{--header-height:calc(68px + env(safe-area-inset-top))}
 body{padding-top:var(--header-height);overflow-x:clip}
 .site-header,.intro-page .site-header{position:fixed;inset:0 0 auto;height:var(--header-height);padding:env(safe-area-inset-top) max(18px,env(safe-area-inset-right)) 0 max(18px,env(safe-area-inset-left));z-index:1000}
 .site-header .brand img,.intro-page .brand img{width:min(205px,57vw);height:auto}
 .site-header .main-nav,.intro-page .site-header .main-nav{display:none!important}
 .mobile-trigger{display:grid;place-items:center;min-width:48px;min-height:48px;border:1px solid #00394c24;border-radius:50%;background:#f2f7f4;color:#00394c;font-size:24px;cursor:pointer}
 .banner-heading{padding:22px 20px 20px;display:block}.banner-heading h1{font-size:clamp(32px,9vw,52px);line-height:1.05;margin:0}.banner-heading p{display:none}
 .hero{margin:0 12px;border-radius:6px;min-height:650px;height:calc(100svh - var(--header-height) - 110px);max-height:850px}
 .slide{display:block}.slide-media{height:53%;object-fit:contain;object-position:center;background:#00394c}
 .slide:before{background:linear-gradient(0deg,#002a39 0%,#002a39 46%,transparent 65%)}
 .slide-inner{position:absolute;inset:auto 22px 84px;width:auto;max-width:none;margin:0;padding:0}
 .slide-category{position:static;clip-path:none;background:none;color:#8bec9d;padding:0;border-radius:0;font-size:11px;letter-spacing:.08em;max-width:100%}
 .slide-title{font-size:clamp(30px,8.5vw,43px);line-height:1.04;margin:12px 0 18px;max-width:none}
 .slide-desc{display:none}.slide-inner .button{font-size:12px;padding:12px 18px}
 .hero-controls{left:20px;right:20px;bottom:16px;gap:8px}.slide-count{font-size:10px}.slide-arrows{display:none}
 .section{padding:64px 22px}.section-title{font-size:clamp(32px,9vw,46px)}
 .line-grid{grid-template-columns:1fr 1fr;gap:10px;border:0;background:none}.line-card{min-height:245px;padding:18px 14px;border:1px solid #00394c20;border-radius:6px}.line-card h3{font-size:21px;overflow-wrap:anywhere}.line-card .number{font-size:10px}
 .c-hero{display:block;min-height:0;padding-top:75vw}.c-hero img{height:75vw;object-fit:contain;object-position:center}.c-hero:after{background:linear-gradient(0deg,#00394c 10%,transparent 55%)}
 .c-hero-content{padding:24px 0 42px;width:calc(100% - 44px)}.c-hero h1{font-size:64px}.c-hero p{font-size:18px;max-width:30ch}
 .intro-page{overflow:auto}.intro-page .scene{height:calc(100svh - var(--header-height));min-height:590px}
 .intro-page .product{width:88%;height:48%;max-height:none;right:6%;top:6%;opacity:1;animation:mobile-product 9s ease-in-out forwards}
 .intro-page .message,.intro-page .message.two{top:61%;left:7%;right:7%;max-width:none}
 .intro-page h1,.intro-page .message.two h1{font-size:clamp(36px,10vw,52px);line-height:1.02;margin:12px 0}.intro-page .eyebrow{display:none}
 .intro-page .enter{top:auto;bottom:66px;left:7%;right:auto;padding:12px 18px;background:#008a19;border:0;border-radius:30px;font-size:12px;letter-spacing:.06em}
 .intro-page .scene>a:last-child{left:7%!important;bottom:20px!important}
 .footer-legal{gap:8px 20px}.legal-main{overflow-wrap:anywhere}
 @keyframes mobile-product{0%,40%{transform:scale(.92)}65%,80%{transform:scale(1)}100%{transform:scale(1.08);opacity:0}}
}
@media(max-width:359px){.line-grid{grid-template-columns:1fr}.hero-controls{left:12px;right:12px}.slide-dot,.slide-dot[aria-current=true]{width:25px;flex-basis:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{animation:none!important;transition:none!important}.intro-page .message.one{opacity:1}.intro-page .message.two{display:none}.intro-page .product{opacity:1;transform:none}.reveal-ready [data-reveal]{opacity:1!important;transform:none!important}}
/* One viewport, one visual: heading and carousel share their available height. */
html.section-scroll{scroll-snap-type:y mandatory;scroll-padding-top:var(--header-height)}
.section-scroll main>*,.section-scroll .footer{scroll-snap-align:start;scroll-snap-stop:always;scroll-margin-top:0}
.section-scroll .banner-scene{height:calc(100svh - var(--header-height));display:flex;flex-direction:column;position:relative;background:#fff;padding-bottom:14px}
.section-scroll .banner-heading{flex:0 0 auto;position:sticky;top:var(--header-height);z-index:6;padding:clamp(12px,2vh,24px) 5%;background:#fff}
.section-scroll .banner-heading h1{font-size:clamp(32px,4.3vw,64px)}
.section-scroll .hero{flex:1;min-height:0;height:auto;max-height:none;margin:0 2%;}
.section-scroll main>.section{min-height:calc(100svh - var(--header-height));display:flex;align-items:center}
.section-scroll main>.section>.section-inner{width:100%}
.section-scroll .slide-inner{padding:70px 0 84px}
.section-scroll .slide-title{font-size:clamp(28px,min(4.1vw,6.5svh),64px)}
.section-scroll .slide-category{padding-top:14px;padding-bottom:14px}
.section-scroll .hero-controls{bottom:14px}
@media(max-width:760px){
 .section-scroll .banner-scene{padding-bottom:10px}
 .section-scroll .banner-heading{padding:14px 20px}
 .section-scroll .banner-heading span{display:none}
 .section-scroll .banner-heading h1{font-size:clamp(30px,8vw,42px)}
 .section-scroll .hero{margin:0 12px}
 .section-scroll .slide-inner{inset:auto 20px 65px;padding:0;align-items:flex-start;display:flex}
 .section-scroll .slide-title{width:100%;font-size:clamp(24px,min(7.5vw,4.8svh),40px);margin:9px 0 14px}
 .section-scroll .slide-category{padding:0;font-size:10px;min-width:0}
 .section-scroll .slide-media{height:50%}
 .section-scroll .slide-inner .button{min-height:44px}
 .section-scroll .hero-controls{bottom:8px}
 .section-scroll main>.contact-strip{display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
 .section-scroll .contact-strip .button{margin-top:0}
}
@media(max-height:500px){
 .section-scroll .banner-heading{padding:8px 5%}.section-scroll .banner-heading h1{font-size:28px}
 .section-scroll .slide-desc{display:none}.section-scroll .slide-inner{padding:40px 0 60px}
 .section-scroll .slide-title{font-size:26px}.section-scroll .slide-category{font-size:10px;padding:8px 22px}
}
@media(prefers-reduced-motion:reduce){html.section-scroll{scroll-snap-type:y proximity}}

/* A narrow preview of the following section retains the visual rhythm of the earlier design. */
.section-scroll .banner-scene,.section-scroll main>.section,.c-scroll .c-hero{position:relative}
.section-scroll .banner-scene:after,.section-scroll main>.section:after,.c-scroll .c-hero:before{content:'';position:absolute;z-index:7;left:0;right:0;bottom:0;height:10px;pointer-events:none;background:var(--next-section,#e2f3e5)}
.section-scroll .banner-scene{--next-section:#f1f8f3}
.section-scroll #explore{--next-section:#dff2e2}
.section-scroll #about{--next-section:#fff}
.section-scroll #looking-for{--next-section:#00394c}
.section-scroll main>section#contact{--next-section:#002a39}
.c-scroll .c-hero{--next-section:#fff}
.c-scroll #why{--next-section:#e2f3e5}
.c-scroll #how,.c-scroll .c-feature{--next-section:#002a39}

/* Contact: four short fields, one clear route into a conversation. */
.section-scroll main>section#contact{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(30px,6vw,100px);align-items:center;padding:clamp(90px,11svh,130px) 5%;min-height:100svh}
.contact-intro{align-self:center}.contact-intro h2{font-size:clamp(40px,5.5vw,78px);line-height:1.03;letter-spacing:-.06em;margin:.75rem 0 1.5rem}
.contact-intro p{font-size:clamp(17px,1.5vw,22px);line-height:1.5;max-width:24em;color:#cce2e3}
.contact-email{display:inline-block;color:#bbefc4;text-underline-offset:5px;margin-top:14px}
.inquiry-form{width:100%;background:#f7faf8;color:#00394c;border-radius:5px;padding:clamp(24px,3.5vw,48px);display:grid;gap:18px;box-shadow:0 24px 70px #00192335}
.inquiry-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.inquiry-form label{display:grid;gap:8px;font-size:15px;font-weight:600;line-height:1.35}
.inquiry-form input,.inquiry-form select,.inquiry-form textarea{box-sizing:border-box;width:100%;min-height:48px;border:1px solid #afc8c3;border-radius:3px;background:#fff;color:#00394c;padding:12px 14px;font:inherit;font-size:16px}
.inquiry-form textarea{resize:vertical;min-height:115px;line-height:1.5}
.inquiry-form :is(input,select,textarea):focus-visible{outline:2px solid #00ad1f;outline-offset:2px;border-color:#008a25}
.inquiry-form input[name=line]{display:none}
.inquiry-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px}
.inquiry-bottom p{max-width:30ch;margin:0;color:#4d6768;font-size:13px;line-height:1.45}
.inquiry-bottom a{color:#005f23;text-underline-offset:3px}
.section-scroll main>section#contact .inquiry-form .button{min-height:58px;flex:none;padding:15px 25px;font-size:16px;background:#008a25;color:white;border:0;box-shadow:none;cursor:pointer}
.section-scroll main>section#contact .inquiry-form .button:hover,.section-scroll main>section#contact .inquiry-form .button:focus-visible{background:#006a21;color:white;box-shadow:none}
.inquiry-note{margin:-4px 0 0;color:#4d6768;font-size:13px}
@media(max-width:900px){.section-scroll main>section#contact{grid-template-columns:1fr;padding:100px 5% 65px;gap:30px}.contact-intro h2{font-size:clamp(38px,7vw,65px);margin-bottom:12px}.contact-intro p{margin:0}.contact-email{margin-top:8px}}
@media(max-width:600px){.section-scroll .banner-scene:after,.section-scroll main>.section:after,.c-scroll .c-hero:before{height:7px}.section-scroll main>section#contact{padding:calc(var(--header-height) + 30px) 20px 60px}.inquiry-fields{grid-template-columns:1fr}.inquiry-form{padding:22px;gap:16px}.inquiry-bottom{align-items:stretch;flex-direction:column}.section-scroll main>section#contact .inquiry-form .button{width:100%}}
/* Full-bleed imagery: crop to the scene, never letterbox a banner. */
.section-scroll .hero .slide-media{inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--image-focus,50% 45%);background:transparent}
.section-scroll .slide:first-child{--image-focus:35% 45%}
.section-scroll .slide:nth-child(2){--image-focus:50% 43%}
.section-scroll .slide:nth-child(3){--image-focus:50% 40%}
.section-scroll .banner-heading{padding:clamp(16px,3svh,32px) 5%;gap:24px;background:linear-gradient(110deg,#f1f8f3,#fff 65%);border-top:1px solid #00394c0a}
.section-scroll .banner-heading h1{display:flex;align-items:baseline;gap:.22em;font-size:clamp(32px,4.8vw,70px);font-weight:600;letter-spacing:-.065em;white-space:nowrap}
.section-scroll .banner-heading h1 em{font-style:normal;color:#008a25;position:relative}
.section-scroll .banner-heading h1 em:after{content:'';height:3px;position:absolute;left:0;right:0;bottom:-6px;background:linear-gradient(90deg,#00ad1f,#00ad1f20);border-radius:3px}
.section-scroll .banner-heading h1 i{font-size:.62em;font-style:normal;font-weight:400;color:#008a25;margin-left:.15em}
.section-scroll .banner-heading>span{max-width:150px;font-size:13px;line-height:1.5;color:#48646b}
html.section-scroll{scroll-snap-type:y proximity}
.section-scroll main>.section{min-height:calc(100svh - var(--header-height));padding-block:clamp(72px,12svh,140px)}
@media(max-width:760px){
 .section-scroll .banner-heading{padding:19px 20px 22px}
 .section-scroll .banner-heading h1{font-size:clamp(29px,7.5vw,48px)}
 .section-scroll .hero .slide:before{background:linear-gradient(0deg,rgba(0,27,37,.96) 0%,rgba(0,27,37,.82) 20%,rgba(0,27,37,.3) 48%,rgba(0,27,37,.04) 72%)}
 .section-scroll .hero .slide-media{object-position:var(--image-focus,50% 45%)}
 .section-scroll .slide-inner{bottom:72px;left:22px;right:22px}
 .section-scroll main>.section{padding-block:72px}
}
@media(max-height:500px){.section-scroll .banner-heading{padding:10px 5% 14px}.section-scroll .banner-heading h1{font-size:28px}}
/* Refined B and C composition */
.site-header{transition:transform .38s ease,box-shadow .38s ease;will-change:transform}
.site-header.is-hidden{transform:translateY(-110%)}
.site-header:focus-within,.site-header:hover{transform:translateY(0)!important}
.section-scroll .banner-heading{justify-content:center;min-height:96px;background:#fff;border:0}
.section-scroll .banner-heading h1{font-weight:500;color:#00394c;font-size:clamp(34px,4.4vw,66px);letter-spacing:-.05em;white-space:normal;text-align:center}
.section-scroll .banner-heading h1 em,.section-scroll .banner-heading h1 i,.section-scroll .banner-heading>span{display:none}
.section-scroll .hero{margin:0 2%;border-radius:4px}
.section-scroll .slide:before{background:linear-gradient(90deg,rgba(0,34,46,.1),rgba(0,34,46,.12));pointer-events:none}
.section-scroll .slide.no-image{background:radial-gradient(circle at 72% 38%,#0e7563 0%,#00394c 55%,#002634 100%)}
.section-scroll .slide.no-image:after{display:none}
.section-scroll .slide-inner{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-end;padding:clamp(26px,5vw,70px);width:auto;margin:0}
.section-scroll .slide-story{display:block;position:relative;width:min(540px,48%);padding:clamp(24px,3vw,42px);background:rgba(0,39,51,.74);color:#fff;border:1px solid #ffffff40;border-radius:3px;backdrop-filter:blur(12px);transition:background .25s,transform .25s;cursor:pointer}
.section-scroll .slide-story:hover,.section-scroll .slide-story:focus-visible{background:rgba(0,52,66,.9);transform:translateY(-4px)}
.section-scroll .slide-story:hover h2,.section-scroll .slide-story:focus-visible h2{text-decoration:underline;text-decoration-color:#3dda62;text-underline-offset:6px}
.section-scroll .slide-story:after{content:'↗';position:absolute;right:26px;top:18px;color:#80e99a;font-size:24px;opacity:0;transition:opacity .2s}
.section-scroll .slide-story:hover:after,.section-scroll .slide-story:focus-visible:after{opacity:1}
.section-scroll .slide-title{font-size:clamp(27px,3.1vw,49px);line-height:1.03;width:auto;max-width:none;margin:0 0 16px;letter-spacing:-.045em}
.section-scroll .slide-desc{width:auto;max-width:none;font-size:clamp(16px,1.25vw,20px);line-height:1.48;margin:0}
.section-scroll .hero-controls{left:4%;right:4%;bottom:25px;justify-content:center}
.section-scroll .slide-dots{gap:8px}
.section-scroll .line-card .number{font-size:12px}
.section-scroll .line-card .arrow{font-size:21px}
.explore-more{display:flex;justify-content:flex-end;gap:24px;margin-top:32px;flex-wrap:wrap}
.explore-more a{font-weight:700;text-decoration:underline;text-decoration-color:#00ad1f;text-underline-offset:6px}
.c-hero:after{background:linear-gradient(0deg,rgba(0,36,48,.78),transparent 48%);pointer-events:none}
.c-hero-content{padding:5rem 0 3rem}
.c-hero h1{font-size:clamp(50px,7vw,110px)}
.c-hero p{font-size:clamp(18px,1.7vw,24px)}
.c-feature .button{margin-top:12px}
@media(max-width:760px){
 .site-header .brand{display:none}
 .site-header{justify-content:flex-end!important;background:rgba(255,255,255,.96);border-bottom:0}
 .section-scroll .site-header{background:#fff}
 .section-scroll .site-header:after{content:'Select your line';position:absolute;left:70px;right:70px;text-align:center;color:#00394c;font-size:clamp(20px,5vw,28px);font-weight:600;letter-spacing:-.04em;pointer-events:none}
 .section-scroll .banner-heading{display:none}
 .section-scroll .slide-inner{padding:22px;align-items:flex-end;justify-content:center;bottom:58px}
 .section-scroll .slide-story{width:100%;padding:20px 22px;background:rgba(0,39,51,.76)}
 .section-scroll .slide-title{font-size:clamp(24px,7vw,38px);line-height:1.08;margin:0}
 .section-scroll .slide-desc{display:none}
 .section-scroll .slide-story:after{display:none}
 .section-scroll .hero{margin:0 10px}
 .section-scroll .hero-controls{bottom:10px}
 .section-scroll .banner-scene{padding-bottom:10px}
 .section-scroll .line-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .section-scroll .line-card{min-height:200px}
 .explore-more{justify-content:flex-start;gap:18px}
 .c-hero:after{background:linear-gradient(0deg,rgba(0,36,48,.84),transparent 56%)}
}
@media(max-width:390px){.section-scroll .line-grid{grid-template-columns:1fr 1fr}.section-scroll .line-card{min-height:190px}.section-scroll .line-card h3{font-size:18px}}
@media(prefers-reduced-motion:reduce){.site-header,.section-scroll .slide-story{transition:none}}
/* Section boundaries remain flush when the navigation hides. */
html.section-scroll{scroll-padding-top:0;scroll-snap-type:y proximity}
.section-scroll main>*,.section-scroll .footer{scroll-margin-top:0;scroll-snap-align:start}
.section-scroll .banner-heading{position:relative;top:auto;z-index:1}
.section-scroll .banner-scene{overflow:visible}
.section-scroll .line-card{padding:0;overflow:hidden;min-height:310px;display:flex;flex-direction:column;justify-content:flex-start;position:relative}
.section-scroll .line-thumb{display:block;width:100%;height:148px;background:linear-gradient(145deg,#dcefe7,#00394c);overflow:hidden}
.section-scroll .line-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.section-scroll .line-card:hover .line-thumb img,.section-scroll .line-card:focus-visible .line-thumb img{transform:scale(1.055)}
.section-scroll .line-thumb-empty{background:radial-gradient(circle at 78% 35%,#218068,#00394c 70%)}
.section-scroll .line-card .number{padding:19px 21px 0;color:#008a25}
.section-scroll .line-card h3{margin:0;padding:18px 21px 24px;line-height:1.15}
.section-scroll .slide-story:after{display:none}
.carousel-edge{position:absolute;z-index:5;top:8%;bottom:18%;width:10%;min-width:54px;border:0;color:#fff;background:linear-gradient(90deg,rgba(0,33,44,.1),transparent);cursor:pointer;display:grid;place-items:center;opacity:0;transition:opacity .2s,background .2s}
.carousel-edge-prev{left:0}.carousel-edge-next{right:0;background:linear-gradient(270deg,rgba(0,33,44,.1),transparent)}
.hero:hover .carousel-edge,.carousel-edge:focus-visible{opacity:.65}
.carousel-edge:hover,.carousel-edge:focus-visible{opacity:1!important;background:rgba(0,33,44,.33)}
.carousel-edge span{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;border:1px solid #ffffffa0;background:rgba(0,42,55,.55);font-size:34px;line-height:1}
#why{scroll-margin-top:0}
@media(max-width:760px){.carousel-edge{display:none}.section-scroll .line-card{min-height:230px}.section-scroll .line-thumb{height:92px}.section-scroll .line-card .number{padding:12px 14px 0}.section-scroll .line-card h3{padding:10px 14px 18px;font-size:18px}}
@media(prefers-reduced-motion:reduce){.section-scroll .line-thumb img{transition:none}}
html:not(.section-scroll){scroll-padding-top:0}
/* Keep the real heading in the document, independent of the moving navigation. */
@media(max-width:760px){
 .section-scroll .banner-heading{display:flex;position:relative;min-height:66px;padding:14px 18px}
 .section-scroll .banner-heading h1{font-size:clamp(27px,7vw,38px);margin:0}
 .section-scroll .site-header:after{content:none}
}
/* Two complete desktop rows; smaller screens retain normal reading flow. */
@media(min-width:761px){
 .section-scroll #explore{min-height:100svh;padding:clamp(22px,4svh,44px) 5%;align-items:center}
 #explore .section-head{margin-bottom:clamp(14px,2.5svh,28px)}
 #explore .section-title{font-size:clamp(30px,3.4vw,50px);max-width:none;margin-top:8px}
 #explore .line-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.6svh,18px)}
 .section-scroll #explore .line-card{min-height:0}
 .section-scroll #explore .line-thumb{height:clamp(60px,14svh,140px)}
 .section-scroll #explore .line-card .number{padding:10px 16px 0;font-size:12px}
 .section-scroll #explore .line-card h3{padding:8px 16px 16px;font-size:clamp(16px,1.5vw,22px);margin:0}
 #explore .explore-more{margin-top:clamp(14px,2.5svh,26px);font-size:14px}
}
.section-scroll main>section#contact .button{font-size:clamp(17px,1.8vw,24px);text-transform:none;letter-spacing:-.015em;min-height:76px;padding:20px 48px;background:#fff;color:#00394c;border:1px solid #ffffffc0;box-shadow:0 14px 40px #001b2635}
.section-scroll main>section#contact .button:hover,.section-scroll main>section#contact .button:focus-visible{background:#e8f8eb;transform:translateY(-3px);box-shadow:0 18px 44px #001b2650}
.carousel-edge{top:0;bottom:0;width:6%;min-width:54px;padding:0}
.carousel-edge span{display:flex;align-items:center;justify-content:center;font-size:initial}
.carousel-edge svg{width:25px;height:25px;display:block}
.section-scroll .slide[data-mark="03"]{--image-focus:48% 60%}
.section-scroll .slide[data-mark="05"]{--image-focus:50% 50%}
.section-scroll .slide[data-mark="06"]{--image-focus:40% 48%}
.section-scroll .slide[data-mark="08"]{--image-focus:35% 45%}
/* Direction-aware text animation is owned by the shared script. */
.reveal-ready [data-reveal]{opacity:1!important;transform:none!important;transition:none!important}
@media(max-width:760px){.section-scroll main>section#contact .button{min-height:68px;padding:18px 36px;font-size:22px}}
/* Keep the complete first scene in view when arriving from the introduction or snapping upward. */
html.section-scroll{scroll-padding-top:0}
.section-scroll body{padding-top:0}
.section-scroll .site-header{position:fixed;inset:0 0 auto;z-index:1000}
.section-scroll .banner-scene{height:100svh;min-height:100svh;padding-bottom:clamp(10px,1.5svh,18px);overflow:hidden;scroll-snap-align:start}
.section-scroll .banner-heading{position:relative;top:auto;min-height:calc(var(--header-height) + clamp(76px,12svh,124px));padding:calc(var(--header-height) + 12px) 5% 14px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.section-scroll .hero{min-height:0;flex:1;max-height:none}
.section-scroll main>.section{min-height:100svh}
/* C pages use the same full-frame boundaries, while long copy remains scrollable. */
.c-scroll .c-hero{height:100svh;min-height:100svh;scroll-snap-align:start}
.c-scroll .c-hero-content{box-sizing:border-box;padding-top:calc(var(--header-height) + 24px)}
.c-scroll main>.section{min-height:100svh;scroll-snap-align:start;scroll-margin-top:0}
.section-scroll .slide[data-mark="04"]{--image-focus:50% 50%}
@media(max-width:760px){
 .section-scroll .banner-heading{min-height:calc(var(--header-height) + clamp(68px,12svh,100px));padding:calc(var(--header-height) + 8px) 18px 10px;display:flex}
 .section-scroll .banner-heading h1{font-size:clamp(27px,7vw,38px)}
 .section-scroll .banner-scene{padding-bottom:10px}
 .c-scroll .c-hero{display:flex;align-items:flex-end;padding-top:0}
 .c-scroll .c-hero img{inset:0;width:100%;height:100%;object-fit:cover;object-position:60% center}
 .c-scroll .c-hero-content{width:calc(100% - 44px);padding:calc(var(--header-height) + 20px) 0 max(40px,env(safe-area-inset-bottom));margin:auto auto 0}
 .c-scroll .c-hero h1{font-size:clamp(36px,10vw,64px);overflow-wrap:anywhere}
 .c-scroll main>.section{padding-block:clamp(72px,10svh,110px)}
}
@media(prefers-reduced-motion:reduce){html.section-scroll{scroll-snap-type:y proximity}}
/* Let the next chapter occupy a deliberate slice of the viewport without covering controls. */
html.section-scroll{--section-peek:clamp(96px,12svh,114px)}
.section-scroll .banner-scene:after,.section-scroll main>.section:after,.c-scroll .c-hero:before{height:var(--section-peek);border-top:3px solid rgba(0,57,76,.3);box-shadow:0 -8px 24px rgba(0,39,51,.12)}
.section-scroll .banner-scene{padding-bottom:calc(var(--section-peek) + 10px);--next-section:#dff2e2}
.section-scroll main>.section{padding-bottom:max(72px,calc(var(--section-peek) + 18px))}
.c-scroll .c-hero-content{padding-bottom:calc(var(--section-peek) + 28px)}
/* Text-column actions keep their own width as more C-level copy is added. */
.c-scroll .c-split .button{display:inline-flex;width:max-content;max-width:100%;align-self:flex-start;white-space:normal}
@media(max-width:760px){
 html.section-scroll{--section-peek:clamp(30px,5svh,44px)}
 .section-scroll .banner-scene{padding-bottom:calc(var(--section-peek) + 8px)}
 .section-scroll main>.section{padding-bottom:max(64px,calc(var(--section-peek) + 16px))}
 .c-scroll .c-hero-content{padding-bottom:calc(var(--section-peek) + 28px)}
}
/* Scroll assistance applies only while moving down. The banner remains a complete, unobstructed viewport. */
html.section-scroll{scroll-snap-type:none}
.section-scroll .banner-scene{height:100svh;min-height:100svh;padding-bottom:10px}
.section-scroll .banner-scene:after{display:none}
.section-scroll #explore{--next-section:#fff}
.section-scroll #about{--next-section:#f3f8f5}
.section-scroll #looking-for{--next-section:#00394c}
.section-scroll main>section#contact{--next-section:#002a39}
.c-scroll .c-hero{--next-section:#fff}
.c-scroll #why{--next-section:#e2f3e5}
.c-scroll #how,.c-scroll .c-feature{--next-section:#002a39}

/* B carousel: retain full-bleed imagery and controls as desktop windows narrow. */
@media(max-width:760px){
 .section-scroll .hero .slide-media{inset:0;width:100%;height:100%;object-fit:cover;background:transparent}
}
@media(min-width:600px) and (max-width:900px){
 .section-scroll .slide-inner{justify-content:flex-end;align-items:flex-end;bottom:50px;padding:clamp(18px,3vw,28px)}
 .section-scroll .slide-story{width:min(390px,56%);padding:clamp(16px,2.5vw,24px)}
 .section-scroll .slide-title{font-size:clamp(23px,3.2vw,32px);line-height:1.08}
 .carousel-edge{display:grid}
}
@media(max-width:900px) and (hover:hover) and (pointer:fine){
 .section-scroll .carousel-edge{display:grid;opacity:.72}
}
@media(max-width:599px) and (hover:hover) and (pointer:fine){
 .section-scroll .slide-inner{justify-content:flex-end;align-items:flex-end;bottom:50px;padding:16px}
 .section-scroll .slide-story{width:min(340px,70%);padding:16px}
 .section-scroll .slide-title{font-size:clamp(20px,5vw,26px);line-height:1.08}
}
@media(hover:none){.section-scroll .carousel-edge:not(:focus-visible){opacity:.65}}
@media(max-height:600px){
 .section-scroll .banner-heading{min-height:calc(var(--header-height) + 54px);padding:calc(var(--header-height) + 5px) 5% 8px}
 .section-scroll .banner-heading h1{font-size:clamp(25px,4vw,38px)}
 .section-scroll .slide-inner{bottom:35px;padding:12px}
 .section-scroll .slide-story{padding:14px 18px}
 .section-scroll .slide-title{font-size:clamp(21px,3vw,28px);margin:0}
}

/* A: a quiet, optional way to bypass the timed introduction. */
.intro-page .enter{background:transparent;border:0;border-bottom:1px solid rgba(205,233,237,.55);border-radius:0;box-shadow:none;color:#d5e8eb;font-size:12px;font-weight:500;letter-spacing:.08em;padding:8px 0;opacity:.68;text-decoration:none;text-transform:uppercase;transition:opacity .2s,border-color .2s}
.intro-page .enter:hover,.intro-page .enter:focus-visible{opacity:1;border-color:#d5e8eb}

/* Page B content update: values and language-specific contact actions. */
.section-scroll:not(.c-scroll) #about .about-detail p{margin:0 0 1.25rem}
.section-scroll:not(.c-scroll) #about .company-values{list-style:none;padding:0;margin:0 0 1.5rem;display:grid;gap:12px}
.section-scroll:not(.c-scroll) #about .company-values strong{color:#008a25}
.section-scroll:not(.c-scroll) .contact-phones{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin:24px 0}
.section-scroll:not(.c-scroll) .contact-phones a{display:inline-flex;align-items:center;min-height:44px;padding:9px 18px;border:1px solid #ffffff70;border-radius:30px;color:#fff;text-decoration:none}
.section-scroll:not(.c-scroll) .contact-phones a:hover{background:#ffffff18}
.section-scroll:not(.c-scroll) .banner-benefit{display:flex;align-items:flex-start;gap:12px}
.section-scroll:not(.c-scroll) .banner-benefit+.banner-benefit{margin-top:12px}
.section-scroll:not(.c-scroll) .benefit-direction{width:25px;height:25px;flex:0 0 25px;color:#80e99a;margin-top:2px}
.section-scroll:not(.c-scroll) #about{--next-section:#00394c}

/* B: reserve space for the next-section strip below the entire contact form. */
.section-scroll:not(.c-scroll) main>section#contact{height:auto;overflow:visible;padding-bottom:calc(var(--section-peek) + 48px)}
.section-scroll:not(.c-scroll) #contact .inquiry-form{min-width:0;height:auto;overflow:visible}
.section-scroll:not(.c-scroll) #contact .inquiry-note{overflow-wrap:anywhere}
/* Contact refinements: scoped to B. */
.section-scroll:not(.c-scroll) .contact-phones .phone-reveal{display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;min-height:44px;padding:9px 18px;border:1px solid #ffffff70;border-radius:24px;color:#fff;background:transparent;font:inherit;cursor:pointer;text-align:left}
.section-scroll:not(.c-scroll) .contact-phones .phone-reveal:hover{background:#ffffff18}
.phone-reveal:focus-visible{outline:2px solid #fff;outline-offset:4px}
.phone-number{font-variant-numeric:tabular-nums;font-size:.9em;letter-spacing:.03em}
.phone-number[hidden]{display:none}
#inquiry-form{position:relative}
#inquiry-form .inquiry-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
#inquiry-form button:disabled{opacity:.65;cursor:wait}
/* Only the completed A → B entrance uses this overlay. */
html.logo-arrival{background:#000}
/* Keep the native scrollbar and page geometry unchanged during arrival. */
.arrival-veil{position:fixed;inset:0;z-index:2147483645;display:grid;place-items:center;overflow:hidden;pointer-events:auto;touch-action:none;background:#000;isolation:isolate}
html.logo-arrival .site-header{z-index:2147483646;background:transparent;border-color:transparent}
html.logo-arrival .site-header .brand{position:relative;visibility:visible}
html.logo-arrival .site-header .brand img{opacity:0;will-change:opacity,filter}
html.logo-arrival .site-header :is(nav,.mobile-trigger){visibility:hidden}
html.logo-arrival .site-header:after{visibility:hidden}
.arrival-wave{position:absolute;inset:0;opacity:0;pointer-events:none}
@media(prefers-reduced-motion:reduce){.arrival-veil{display:none!important}}
html.intro-departure::after{content:'';position:fixed;inset:0;z-index:20000;background:#000;pointer-events:none;animation:intro-to-black .2s linear both}
@keyframes intro-to-black{from{opacity:0}to{opacity:1}}
/* Supplied Page A film: styles and timing are isolated from B/C. */
.video-intro .scene{overflow:hidden;background:#000;min-height:0}
.video-intro .intro-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;transform-origin:54% 53%;will-change:transform}
.video-intro .intro-film-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,12,16,.5),rgba(0,12,16,.12) 55%,transparent);pointer-events:none}
.video-intro .message{z-index:2;text-shadow:0 2px 24px #00101780}
.video-intro .message,.video-intro .progress{animation-play-state:paused!important}
.video-intro .darken{display:none}
.intro-film-black{position:fixed;inset:0;z-index:20000;background:#000;opacity:0;pointer-events:none}
.video-intro .intro-play{position:absolute;bottom:100px;left:6%;z-index:12;min-height:44px;padding:10px 18px;border:1px solid #ffffff80;border-radius:24px;background:#00101799;color:#fff;font:inherit;cursor:pointer}
.video-intro .intro-play[hidden]{display:none}
.video-intro .intro-still .message.one{animation:none;opacity:1;transform:translateY(-50%)}
.video-intro .intro-still .message.two,.video-intro .intro-still .progress{display:none}
@media(max-width:760px){.video-intro .scene{height:calc(100svh - var(--header-height));min-height:0}.video-intro .intro-film-shade{background:linear-gradient(0deg,rgba(0,12,16,.6),transparent 75%)}.video-intro .message,.video-intro .message.two{top:57%}.video-intro .intro-play{left:7%;bottom:125px}}
@media(prefers-reduced-motion:reduce){.video-intro .intro-film{transform:none!important}.intro-film-black{display:none}}

/* Page A is a full-viewport film, without a reserved navigation strip. */
body.video-intro{padding-top:0;overflow:hidden;background:#000}
.video-intro .site-header{display:none!important}
.video-intro .scene{height:100svh;min-height:0}

/* Product pages remain drafts until their content is approved. */
.c-hero>.construction-badge{position:absolute;top:calc(var(--header-height) + 18px);left:5%;z-index:3;display:inline-flex;align-items:center;min-height:32px;padding:7px 13px;border:1px solid #8bec9d80;border-radius:20px;background:rgba(0,35,45,.88);color:#c6f4cf;font-size:12px;font-weight:600;letter-spacing:.05em;line-height:1.3;max-width:min(90%,560px);text-wrap:pretty}

/* Contact acceptance state only. */
.inquiry-success{display:grid;justify-items:center;align-content:center;text-align:center;min-height:320px;gap:18px;animation:inquiry-arrive .45s ease-out both}
.inquiry-success svg{width:90px;height:90px;fill:#e0f3e6;stroke:#008a25;stroke-width:3}
.inquiry-success svg path{fill:none;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:65;stroke-dashoffset:65;animation:inquiry-check .5s .12s ease-out forwards}
.inquiry-success h3{margin:0;color:#008a25;font-size:clamp(25px,3vw,36px)}
.inquiry-success p{max-width:390px;margin:0;line-height:1.6;color:#365e60}
@keyframes inquiry-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes inquiry-check{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.inquiry-success,.inquiry-success svg path{animation:none}.inquiry-success svg path{stroke-dashoffset:0}}

/* Welcome revision 28: upper-left copy leaves the BioClip unobscured. */
.video-intro .message,.video-intro .message.two{top:max(42px,calc(env(safe-area-inset-top) + 30px));left:6%;right:auto;width:min(32vw,430px);max-width:430px;animation-name:welcome-one;transform:none}
.video-intro .message.two{animation-name:welcome-two}
.video-intro .message h1,.video-intro .message.two h1{font-size:clamp(26px,3.2vw,48px);line-height:1.12;letter-spacing:-.035em;margin:0;text-wrap:balance}
.video-intro .intro-still .message.one{transform:none}
@keyframes welcome-one{0%,7%{opacity:0;transform:translateY(6px)}12%,28%{opacity:1;transform:none}37%,100%{opacity:0;transform:translateY(-6px)}}
@keyframes welcome-two{0%,38%{opacity:0;transform:translateY(6px)}44%,67%{opacity:1;transform:none}74%,100%{opacity:0;transform:translateY(-6px)}}
@media(max-width:760px){
 .video-intro .message,.video-intro .message.two{top:max(28px,calc(env(safe-area-inset-top) + 20px));left:7%;width:min(68vw,310px);right:auto}
 .video-intro .message h1,.video-intro .message.two h1{font-size:clamp(24px,6vw,32px)}
 .section-scroll:not(.c-scroll) .site-header .brand{display:flex}
 .section-scroll:not(.c-scroll) .site-header .brand img{width:110px;height:auto}
 .section-scroll:not(.c-scroll) .site-header{justify-content:space-between!important}
 .section-scroll:not(.c-scroll) .site-header:after{left:138px;right:64px;font-size:clamp(14px,3.5vw,18px)}
}

.inquiry-note:empty{display:none}

.ai-video-label{position:absolute!important;inset:auto max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) auto!important;width:40px!important;height:40px!important;object-fit:contain!important;z-index:4;opacity:.8;pointer-events:none}.intro-page .ai-video-label{z-index:2}.intro-page .darken{z-index:3}