/* North77 / Immersive ocean journey. See DESIGN.md for intentional reference adaptations. */
@keyframes title-arrival{from{clip-path:inset(100% 0 0);transform:translateY(35px)}to{clip-path:inset(0);transform:translateY(0)}}
@keyframes sea-drift{from{background-position:48% 35%}to{background-position:52% 39%}}
.hero-copy .title-line{animation:title-arrival 1.25s cubic-bezier(.2,.7,.2,1) both}.hero-copy .title-line:nth-child(2){animation-delay:.12s}.hero-image{animation:sea-drift 24s ease-in-out infinite alternate}
body{overflow-x:clip}.header{position:absolute;left:0;right:0;padding:0 4%;height:104px;border:0;display:grid;grid-template-columns:1fr auto 1fr;z-index:40}.header .brand{grid-column:2;grid-row:1;text-align:center;letter-spacing:.035em;font-size:2.3rem}.header-enquire{grid-column:3;grid-row:1;justify-self:end;font-size:.875rem;padding:12px 0;border-bottom:1px solid #ffffff70}.header-enquire span{margin-left:35px}.menu-toggle{display:grid;grid-column:1;grid-row:1;grid-template-columns:24px auto;grid-template-rows:8px 8px;align-content:center;gap:0 12px;background:none;border:0;width:110px;height:48px;padding:8px 0;z-index:42}.menu-toggle b{font-weight:500;font-size:.875rem;grid-column:2;grid-row:1/3;align-self:center}.menu-toggle span{height:1px;width:23px;background:white;grid-column:1}.menu-toggle span:nth-of-type(1){grid-row:1}.menu-toggle span:nth-of-type(2){grid-row:2}.menu-toggle[aria-expanded=true] span:nth-of-type(1){transform:translateY(4px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:nth-of-type(2){transform:translateY(-4px) rotate(-45deg)}
.header nav{display:flex;position:fixed;inset:0;flex-direction:column;align-items:flex-start;justify-content:center;gap:25px;padding:120px 14%;background:#081626;visibility:hidden;opacity:0;transform:translateY(-18px);transition:opacity .35s,transform .35s,visibility .35s;z-index:-1}.header nav.open{visibility:visible;opacity:1;transform:none;z-index:0}.header.menu-open .brand,.header.menu-open .header-enquire{position:relative;z-index:2}.header.menu-open{position:fixed}.header nav a{font-family:'Barlow Condensed',sans-serif;font-size:clamp(2.8rem,7vw,6rem);font-weight:500;padding:0;line-height:1.2}.header nav .nav-contact{margin:0}.header nav a:hover{box-shadow:none;color:#b8c8db}.header nav:after{content:'NORTH77 / FACILITY TECHNOLOGY INTEGRATOR';position:absolute;bottom:55px;left:14%;font-size:.75rem;letter-spacing:.13em;color:#b8c8db}.menu-opened{overflow:hidden}.motion-dock{position:fixed;bottom:18px;right:25px;z-index:30}.motion-dock button{padding:10px 14px;font-size:.75rem;background:#081626e8;border:1px solid #ffffff30}.motion-dock button:hover{border-color:#fff}
.hero-journey{position:relative;background:#081626}.hero-journey .hero{height:100svh;min-height:740px;max-height:none;position:relative;isolation:isolate}.scroll-scenes .hero-journey{height:200svh}.scroll-scenes .hero-journey .hero{position:sticky;top:0}.hero-image{background-position:center 35%;transform:scale(calc(1.03 + var(--dive,0)*.2));opacity:calc(1 - var(--dive,0));filter:brightness(.84);will-change:transform,opacity}.hero-underwater{position:absolute;inset:0;background:url('/assets/water3.jpeg') center 30%/cover;opacity:var(--dive,0);transform:scale(calc(1.15 - var(--dive,0)*.15));will-change:transform,opacity}.hero-shade{background:linear-gradient(180deg,#081626c0,transparent 35%,#08162666 70%,#081626);z-index:1}.hero-topline{top:130px;left:4%;right:4%;z-index:3;opacity:calc(1 - var(--dive,0)*2);font-size:.75rem;letter-spacing:.14em}.hero-copy{position:absolute;inset:0;padding:0;z-index:3;opacity:calc(1 - var(--dive,0)*2.2);transform:translateY(calc(var(--dive,0)*-100px));will-change:transform,opacity}.hero-copy h1{position:absolute;bottom:15%;left:4%;right:4%;font-size:clamp(5rem,12.1vw,13.5rem);line-height:.82;letter-spacing:-.025em;margin:0;font-weight:500;transform:scale(calc(1 + var(--dive,0)*.08));transform-origin:center}.hero-copy h1 .title-line{display:block;margin:0;text-align:center}.hero-copy h1 .title-line:first-child{font-size:.64em;letter-spacing:.02em;margin-bottom:.17em}.hero-description{position:absolute;left:5%;top:32%;font-family:'Newsreader',serif;font-size:1.2rem;line-height:1.3;margin:0;max-width:260px}.hero-copy .hero-explore{position:absolute;right:5%;top:32%;margin:0;min-width:180px;font-size:.875rem}.hero .instrument{width:180px;right:calc(50% - 90px);bottom:auto;top:22%;opacity:calc(.45 - var(--dive,0)*.6);z-index:2}.hero .dial-caption,.hero .dial-degree{display:none}.hero-bottom{bottom:35px;left:5%;right:5%;opacity:calc(1 - var(--dive,0)*2);z-index:5}.hero-bottom .journey-hint{display:block;font-size:.75rem;letter-spacing:.1em;margin-right:130px}.dive-statement{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;opacity:0;visibility:hidden;padding:40px;transform:translateY(calc((1 - var(--dive,0))*70px));pointer-events:none}.diving .dive-statement{visibility:visible;opacity:clamp(0,calc((var(--dive,0) - .45)*2.4),1);pointer-events:auto}.diving .hero-copy,.diving .hero-bottom,.diving .instrument{pointer-events:none;visibility:hidden}.dive-statement>.mono{color:#b8c8db;letter-spacing:.18em}.dive-statement>p:nth-child(2){font-family:'Barlow Condensed',sans-serif;font-size:clamp(3.5rem,6vw,6.5rem);line-height:1.03;font-weight:500;text-transform:uppercase;margin:25px 0 35px}.dive-statement>a{font-size:.875rem;border-bottom:1px solid #ffffff77;padding-bottom:12px}.dive-statement>a span{margin-left:45px}.partner-strip{position:relative;padding-top:45px;padding-bottom:45px;background:#081626}
.section{padding-top:140px;padding-bottom:140px}.approach{position:relative}.approach-grid{grid-template-columns:1.5fr .8fr;gap:10%;align-items:center}.approach-grid h2{font-size:clamp(3.7rem,6.2vw,6.8rem);line-height:.99;font-weight:500}.approach-copy{padding-top:0}.field-notes{margin-top:110px;gap:15%;grid-template-columns:1fr .95fr}.ocean-study{max-width:none;overflow:hidden}.ocean-study img{height:620px;object-position:center;transform:scale(calc(1.04 + var(--photo-progress,0)*.07));transition:transform .15s linear}.ocean-study figcaption{position:relative;background:#081626;padding-top:10px;margin:0}.principles{padding-top:190px}.principles article{grid-template-columns:1fr;padding:27px 0 32px}.principles .mono{margin-bottom:16px}.ecosystem{background:#081626;padding-left:0;padding-right:0;padding-bottom:0}.ecosystem>.section-label,.ecosystem-heading{margin-left:7%;margin-right:7%}.ecosystem-heading{margin-bottom:90px}.ecosystem-heading h2{font-size:clamp(3.3rem,5.8vw,6rem);font-weight:500}.flagship{position:relative;isolation:isolate;min-height:920px;padding:110px 7%;border:0;gap:12%;grid-template-columns:1.1fr .7fr;align-items:center;overflow:hidden}.chapter-photo{position:absolute;inset:-8% 0;z-index:-2;background:url('/assets/water3.jpeg') center 32%/cover;transform:translateY(var(--chapter-y,0px));will-change:transform}.flagship:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#081626d9,#08162640),linear-gradient(180deg,#081626,transparent 18%,transparent 80%,#081626);z-index:-1}.flagship h3{font-size:4rem;font-weight:500}.flagship-content .infra-word{font-size:4.3rem}.flagship-content p:not(.eyebrow){color:#e0e7f0}.operations-index{padding-top:0}.index-number{font-size:14rem;color:#ffffff40;font-weight:500;margin-bottom:50px}.operations-index small{color:#e0e7f0}.venture-grid{padding:80px 7% 140px;background:#081626}.venture,.venture:last-child{position:relative;width:78%;margin:0;padding:70px 0 80px 22%;border-top:1px solid #ffffff30}.venture:last-child{margin:60px 0 0 22%;padding-left:17%;width:78%}.venture-number{position:absolute;top:65px;left:0;font:500 clamp(5rem,11vw,11rem)/1 'Barlow Condensed',sans-serif;color:#7496b8}.venture-top{justify-content:flex-start;flex-wrap:wrap}.venture h3{font-size:3rem;font-weight:500}.venture p{max-width:490px}.depth-section{min-height:100svh}.depth-image{background-position:center 35%;inset:-18% 0}.depth-overlay{background:linear-gradient(180deg,#081626,transparent 30%,#08162633 65%,#081626)}.depth-content{width:100%;text-align:center;padding:130px 7%}.depth-content h2{font-size:clamp(4rem,7.8vw,8.5rem);font-weight:500;line-height:.95}.depth-content h2 em{margin:0}.depth-content p{font-family:'Newsreader',serif;max-width:550px;margin:45px auto 30px}.depth-ruler{display:none}.contact-grid h2{font-weight:500}.contact{padding-top:130px}.js-motion .reveal{transform:translateY(45px);transition:opacity 1s ease,transform 1.2s cubic-bezier(.2,.7,.2,1)}.js-motion .reveal.visible{transform:none}.reading-progress{background:#b8c8db}
@media(min-width:701px) and (max-height:800px){.hero-journey .hero{min-height:650px}.hero-copy h1{bottom:12%;font-size:10vw}.hero-description,.hero-copy .hero-explore{top:29%}.hero .instrument{top:22%;width:125px;right:calc(50% - 62px)}.hero-topline{top:110px}}
@media(max-width:1000px){.hero-copy h1{font-size:12vw}.hero .instrument{width:140px;right:calc(50% - 70px)}.approach-grid{gap:6%;grid-template-columns:1.1fr 1fr}.field-notes{gap:9%}.flagship{gap:8%;padding:90px 6%}.flagship h3{font-size:3.2rem}.operations-index li{flex-direction:column}.venture,.venture:last-child{width:90%;padding-left:24%}.venture:last-child{margin-left:10%;width:90%}}
@media(max-width:700px){.header{height:88px;padding:0 6%;left:0;right:0;grid-template-columns:1fr auto 1fr}.header .brand{font-size:1.8rem}.header-enquire{font-size:.8rem}.header-enquire span{display:none}.menu-toggle{width:65px;grid-template-columns:23px;gap:0;padding:0}.menu-toggle b{display:none}.header nav{inset:0;padding:110px 9%;gap:30px}.header nav a{font-size:3.6rem}.header nav:after{left:9%;bottom:75px;font-size:.75rem}.motion-dock{bottom:12px;right:12px}.motion-dock button{font-size:.75rem;padding:8px 10px}.hero-journey .hero{min-height:760px;height:100svh}.scroll-scenes .hero-journey{height:165svh}.hero-topline{top:111px;left:6%;right:6%;justify-content:center;font-size:.65rem}.hero-topline>span:first-child{font-size:.75rem;text-align:center}.hero-description{top:25%;left:7%;font-size:1.25rem;max-width:245px;line-height:1.4}.hero-copy .hero-explore{top:43%;left:7%;right:auto;min-width:200px;font-size:.875rem}.hero-copy h1{font-size:12.2vw;bottom:22%;left:5%;right:5%;line-height:.95}.hero-copy h1 .title-line:first-child{font-size:1.4em;letter-spacing:.005em;margin-bottom:0}.hero .instrument{top:auto;bottom:9%;right:calc(50% - 46px);width:92px}.hero-bottom{bottom:32px;left:7%;right:7%;align-items:center}.hero-bottom .journey-hint{display:none}.hero-bottom>a{font-size:.75rem}.dive-statement{padding:35px 6%}.dive-statement>p:nth-child(2){font-size:3.1rem}.dive-statement>.mono{font-size:.75rem}.partner-strip{padding:35px 6%}.section{padding-top:80px;padding-bottom:80px}.approach-grid{display:block}.approach-grid h2{font-size:3.3rem;line-height:1}.approach-copy{padding-top:25px}.field-notes{margin-top:65px;display:block}.ocean-study{width:86%}.ocean-study img{height:430px}.principles{padding-top:70px;width:88%;margin-left:12%}.ecosystem{padding-left:0;padding-right:0;padding-bottom:0}.ecosystem>.section-label,.ecosystem-heading{margin-left:6%;margin-right:6%}.ecosystem-heading{margin-bottom:55px}.ecosystem-heading h2{font-size:3rem}.flagship{display:block;padding:80px 6%;min-height:0}.flagship-content .infra-word{font-size:3.2rem}.flagship h3{font-size:3rem}.operations-index{padding-left:12%;padding-top:50px;margin-top:20px}.operations-index .index-number{font-size:8rem;margin-bottom:30px}.operations-index li{flex-direction:row}.operations-index li>span{font-size:1rem}.operations-index small{font-size:.875rem}.venture-grid{padding:20px 6% 80px}.venture,.venture:last-child{width:100%;margin:0;padding:70px 0 55px}.venture:last-child{margin-top:20px;padding-left:8%}.venture-number{position:static;display:block;font-size:6rem;margin-bottom:35px;color:#7496b8}.venture h3{font-size:2.7rem}.venture-top{font-size:.75rem}.depth-section{min-height:780px}.depth-content{padding:110px 6%}.depth-content h2{font-size:3.25rem;line-height:1}.depth-content p{font-size:1.35rem;margin-top:35px}.contact h2{font-size:3.8rem}.contact{padding-bottom:110px}footer{padding-bottom:80px}.paused .hero-journey{height:auto}.paused .hero-journey .hero{position:relative}}
.paused .hero-journey{height:auto}.paused .hero-journey .hero{position:relative}.paused .hero-copy,.paused .hero-topline,.paused .hero-bottom{opacity:1;transform:none;visibility:visible}.paused .hero-image{opacity:1;transform:scale(1.03)}.paused .hero-underwater,.paused .dive-statement{display:none}.paused .hero .instrument{opacity:.45;visibility:visible}.paused .chapter-photo,.paused .ocean-study img{transform:none}.paused .reveal{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.scroll-scenes .hero-journey{height:auto}.scroll-scenes .hero-journey .hero{position:relative}.hero-copy,.hero-topline,.hero-bottom{opacity:1;transform:none;visibility:visible}.hero-underwater,.dive-statement{display:none}.hero-image{opacity:1}.chapter-photo,.ocean-study img{transform:none!important}}
.paused .hero-copy .title-line{animation:none;clip-path:none;transform:none}