:root{
  --ink:#10212b;
  --deep:#0f2c3d;
  --deep-2:#173f50;
  --teal:#3f8f8b;
  --mint:#9fd6c8;
  --mist:#eef5f2;
  --sand:#f4efe7;
  --paper:#fbfcfa;
  --line:rgba(16,33,43,.12);
  --soft-shadow:0 24px 70px rgba(12,41,55,.10);
  --radius-xl:34px;
  --radius-lg:24px;
  --radius-md:18px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:
    radial-gradient(circle at 12% 6%, rgba(159,214,200,.32), transparent 24%),
    radial-gradient(circle at 88% 14%, rgba(231,212,182,.32), transparent 20%),
    linear-gradient(180deg,#f8fbf9 0%,#fbfcfa 45%,#f4f8f7 100%);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow-x:hidden;
}

a{color:inherit}
img{display:block;max-width:100%}
button{font:inherit}
::selection{background:#b7ddd3;color:#10212b}

.page-noise{
  pointer-events:none;
  position:fixed;
  inset:0;
  opacity:.18;
  z-index:-1;
  background-image:
    linear-gradient(rgba(14,44,61,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(14,44,61,.025) 1px, transparent 1px);
  background-size:32px 32px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 88%);
}

.site-header{
  position:sticky;
  top:0;
  z-index:50;
  padding:14px 0;
  transition:.25s ease;
}

.site-header.scrolled{
  background:rgba(248,251,249,.86);
  backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line);
}

.header-shell{
  min-height:70px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  border:1px solid rgba(15,44,61,.10);
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(18px);
  padding:10px 12px 10px 16px;
  border-radius:22px;
  box-shadow:0 14px 38px rgba(15,44,61,.06);
}

.brand{
  display:inline-flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  min-width:max-content;
}

.brand-mark{
  width:44px;
  height:44px;
  border-radius:15px;
  display:grid;
  place-items:center;
  color:white;
  font-weight:800;
  letter-spacing:-.04em;
  background:
    linear-gradient(135deg,var(--deep),var(--teal));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
}

.brand strong{
  display:block;
  font-size:15px;
  line-height:1.15;
}

.brand small{
  display:block;
  margin-top:3px;
  color:#5c6e77;
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.topnav ul{
  list-style:none;
  display:flex;
  align-items:center;
  gap:7px;
  margin:0;
  padding:0;
}

.topnav li{margin:0;padding:0}
.topnav a{
  display:block;
  text-decoration:none;
  font-size:14px;
  font-weight:700;
  color:#34515f;
  padding:11px 13px;
  border-radius:12px;
  transition:.2s ease;
}

.topnav a:hover{
  color:var(--deep);
  background:#eef6f3;
}

.menu-toggle{
  display:none;
  width:44px;
  height:44px;
  border:0;
  border-radius:13px;
  background:#eef5f2;
  padding:11px;
}
.menu-toggle span{
  display:block;
  height:2px;
  background:var(--deep);
  margin:5px 0;
  transition:.2s ease;
}

.hero{
  padding:56px 0 54px;
}

.hero-grid{
  min-height:640px;
  display:grid;
  grid-template-columns:1.12fr .88fr;
  align-items:center;
  gap:56px;
}

.eyebrow,.kicker,.feature-label{
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:800;
  color:var(--teal);
}

.eyebrow:before,.kicker:before,.feature-label:before{
  content:"";
  width:30px;
  height:1px;
  background:currentColor;
}

.hero h1{
  max-width:850px;
  margin:22px 0 24px;
  font-size:clamp(48px,7vw,92px);
  line-height:.95;
  letter-spacing:-.055em;
  font-weight:760;
}

.hero .lead{
  max-width:760px;
  font-size:20px;
  line-height:1.7;
  color:#536a76;
  margin:0;
}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:22px;
  margin-top:34px;
}

.primary-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:0 22px;
  border-radius:15px;
  color:white;
  text-decoration:none;
  font-weight:800;
  background:linear-gradient(135deg,var(--deep),#255569);
  box-shadow:0 14px 30px rgba(15,44,61,.17);
  transition:.2s ease;
}
.primary-action:hover{
  color:white;
  transform:translateY(-2px);
  box-shadow:0 18px 34px rgba(15,44,61,.22);
}
.primary-action.dark{background:#122d3b}

.text-action{
  text-decoration:none;
  font-weight:800;
  color:var(--deep);
}
.text-action span{display:inline-block;transition:.2s ease}
.text-action:hover span{transform:translateX(4px)}

.hero-note{
  margin-top:34px;
  max-width:690px;
  padding:17px 18px;
  border-left:3px solid var(--teal);
  color:#62747d;
  background:rgba(255,255,255,.58);
  border-radius:0 14px 14px 0;
  line-height:1.55;
  font-size:14px;
}

.hero-note strong{
  color:var(--ink);
  margin-right:4px;
}

.hero-visual{
  display:flex;
  justify-content:center;
}

.orbit-card{
  position:relative;
  width:min(100%,520px);
  aspect-ratio:1/1;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%,rgba(255,255,255,.95) 0 22%,rgba(220,238,232,.8) 23% 41%,rgba(146,201,190,.32) 42% 56%,rgba(22,63,80,.10) 57% 65%,transparent 66%),
    linear-gradient(145deg,#eaf6f2,#f5efe7);
  box-shadow:var(--soft-shadow), inset 0 0 0 1px rgba(15,44,61,.08);
}

.orbit-card:before,
.orbit-card:after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px dashed rgba(15,44,61,.16);
}
.orbit-card:before{inset:10%}
.orbit-card:after{inset:23%}

.orbit-line{
  position:absolute;
  inset:14%;
  border-radius:50%;
  border-top:1px solid rgba(63,143,139,.55);
  transform:rotate(28deg);
  animation:spin 18s linear infinite;
}
.orbit-line.two{
  inset:31%;
  animation-direction:reverse;
  animation-duration:12s;
}
@keyframes spin{to{transform:rotate(388deg)}}

.pulse-core{
  position:absolute;
  inset:35%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  border-radius:50%;
  background:rgba(255,255,255,.84);
  box-shadow:0 18px 50px rgba(15,44,61,.11);
  z-index:3;
}

.pulse-core span{
  width:12px;
  height:12px;
  margin-bottom:10px;
  border-radius:50%;
  background:var(--teal);
  box-shadow:0 0 0 0 rgba(63,143,139,.45);
  animation:pulse 2s infinite;
}
@keyframes pulse{
  70%{box-shadow:0 0 0 18px rgba(63,143,139,0)}
  100%{box-shadow:0 0 0 0 rgba(63,143,139,0)}
}

.pulse-core strong{font-size:18px}
.pulse-core small{
  margin-top:5px;
  width:120px;
  color:#6b7a82;
  font-size:11px;
  line-height:1.35;
}

.float-tag{
  position:absolute;
  z-index:4;
  padding:10px 14px;
  border:1px solid rgba(15,44,61,.10);
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(10px);
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  box-shadow:0 12px 26px rgba(15,44,61,.08);
}
.tag-one{top:12%;left:15%}
.tag-two{right:4%;top:35%}
.tag-three{left:-2%;bottom:28%}
.tag-four{right:16%;bottom:8%}

.quick-index{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.quick-index a{
  display:flex;
  gap:13px;
  align-items:center;
  padding:21px 18px;
  text-decoration:none;
  color:#46606d;
  font-weight:700;
  border-right:1px solid var(--line);
}
.quick-index a:last-child{border-right:0}
.quick-index span{
  font-size:11px;
  color:var(--teal);
  letter-spacing:.12em;
}
.quick-index a:hover{background:rgba(255,255,255,.62);color:var(--deep)}

.section{padding:110px 0}
.muted-section{
  background:rgba(234,243,239,.68);
  border-top:1px solid rgba(15,44,61,.06);
  border-bottom:1px solid rgba(15,44,61,.06);
}

.section-heading{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:80px;
  align-items:end;
  margin-bottom:54px;
}
.section-heading h2,
.feature-intro h2,
.dark-copy h2,
.questions-intro h2,
.story-copy h2,
.journal-header h2{
  margin:14px 0 0;
  font-size:clamp(38px,5vw,66px);
  line-height:1.03;
  letter-spacing:-.045em;
}
.section-heading p,
.feature-intro p,
.dark-copy p,
.questions-intro p,
.story-copy p{
  margin:0;
  color:#5c707a;
  font-size:18px;
  line-height:1.75;
}

.content-split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:46px;
  align-items:stretch;
}

.image-frame{
  position:relative;
  min-height:620px;
  overflow:hidden;
  border-radius:var(--radius-xl);
  background:#dceae5;
  box-shadow:var(--soft-shadow);
}
.image-frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  position:absolute;
  inset:0;
}
.image-frame:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(15,44,61,.72),transparent 42%);
}
.image-caption{
  position:absolute;
  left:24px;
  right:24px;
  bottom:24px;
  z-index:2;
  color:white;
  line-height:1.5;
  font-weight:700;
}

.stacked-cards{
  display:grid;
  gap:18px;
}
.info-card{
  position:relative;
  padding:30px 28px 30px 72px;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:rgba(255,255,255,.76);
  box-shadow:0 18px 45px rgba(15,44,61,.06);
}
.card-number{
  position:absolute;
  left:24px;
  top:31px;
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:50%;
  font-size:11px;
  font-weight:900;
  background:#e5f2ee;
  color:var(--teal);
}
.info-card h3{
  font-size:22px;
  margin:0 0 10px;
}
.info-card p{
  margin:0;
  color:#61737c;
  line-height:1.7;
}

.feature-intro{
  max-width:910px;
  margin-bottom:52px;
}
.feature-intro p{
  max-width:810px;
  margin-top:20px;
}

.feature-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:20px;
}
.feature-card{
  min-height:320px;
  padding:34px;
  display:flex;
  flex-direction:column;
  border-radius:var(--radius-lg);
  border:1px solid var(--line);
  background:white;
  box-shadow:0 15px 44px rgba(15,44,61,.055);
}
.feature-card.wide{
  grid-column:span 2;
  min-height:280px;
  background:
    radial-gradient(circle at 88% 20%,rgba(159,214,200,.35),transparent 28%),
    white;
}
.feature-icon{
  width:50px;
  height:50px;
  border-radius:16px;
  display:grid;
  place-items:center;
  background:#edf6f3;
  color:var(--teal);
  font-weight:900;
}
.feature-card h3{
  margin:36px 0 12px;
  font-size:28px;
  letter-spacing:-.025em;
}
.feature-card p{
  margin:0;
  color:#5f727c;
  line-height:1.75;
}
.feature-card.image-card{
  grid-column:span 2;
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:30px;
  padding:0;
  overflow:hidden;
}
.feature-card.image-card img{
  width:100%;
  height:100%;
  min-height:330px;
  object-fit:cover;
}
.feature-card.image-card div{
  align-self:center;
  padding:34px 42px 34px 6px;
}
.feature-card.image-card h3{margin-top:0}

.dark-section{
  background:
    radial-gradient(circle at 82% 18%,rgba(89,152,147,.18),transparent 23%),
    linear-gradient(135deg,#0d2836,#102f40 60%,#173f50);
  color:white;
}
.dark-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:72px;
  align-items:start;
}
.dark-copy .kicker{color:#8dcfc0}
.dark-copy p{color:#c5d4d9;margin-top:24px}
.safety-panel{
  padding:34px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius-xl);
  background:rgba(255,255,255,.07);
  backdrop-filter:blur(10px);
}
.safety-panel h3{
  margin:0 0 20px;
  font-size:24px;
}
.check-list{
  list-style:none;
  padding:0;
  margin:0;
}
.check-list li{
  position:relative;
  padding:14px 0 14px 30px;
  border-bottom:1px solid rgba(255,255,255,.10);
  color:#d8e3e6;
  line-height:1.55;
}
.check-list li:before{
  content:"•";
  position:absolute;
  left:2px;
  color:#9fd6c8;
  font-size:26px;
  top:7px;
}
.urgent-note{
  margin-top:22px;
  padding:18px;
  border-radius:16px;
  background:rgba(159,214,200,.11);
  color:#dbe9e9;
  line-height:1.55;
}
.urgent-note strong{
  display:block;
  color:white;
  margin-bottom:5px;
}

.signal-section{
  padding:32px 0;
  background:#e7f0ec;
  border-bottom:1px solid rgba(15,44,61,.06);
}
.signal-strip{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
}
.signal-strip div{
  padding:20px 24px;
  border-right:1px solid var(--line);
}
.signal-strip div:last-child{border-right:0}
.signal-strip span{
  display:block;
  margin-bottom:6px;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:#6d858d;
  font-weight:800;
}
.signal-strip strong{
  font-size:17px;
}

.mosaic{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  grid-template-rows:auto auto auto;
  gap:20px;
}
.mosaic-card{
  padding:28px;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:white;
  box-shadow:0 14px 38px rgba(15,44,61,.05);
}
.mosaic-card.tall{
  grid-row:span 2;
  padding:0;
  overflow:hidden;
}
.mosaic-card.tall img{
  width:100%;
  height:310px;
  object-fit:cover;
}
.mosaic-card.tall div{padding:30px}
.mosaic-card.wide{
  grid-column:span 2;
  background:linear-gradient(130deg,#edf6f3,#f7f3eb);
}
.mosaic-card span{
  color:var(--teal);
  font-size:11px;
  letter-spacing:.13em;
  text-transform:uppercase;
  font-weight:900;
}
.mosaic-card h3{
  font-size:25px;
  margin:11px 0 10px;
}
.mosaic-card p{
  color:#60727b;
  line-height:1.72;
  margin:0;
}
.mini-quote{
  font-size:clamp(24px,3vw,40px);
  line-height:1.25;
  letter-spacing:-.03em;
  font-weight:680;
  color:#173a49;
}

.questions-layout{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:70px;
}
.questions-intro{
  position:sticky;
  top:120px;
  align-self:start;
}
.questions-intro p{margin:22px 0 28px}
.accordion-list{
  border-top:1px solid var(--line);
}
.question-item{border-bottom:1px solid var(--line)}
.question-item button{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  text-align:left;
  padding:24px 0;
  border:0;
  background:transparent;
  color:var(--ink);
  font-size:20px;
  font-weight:800;
}
.question-item button b{
  font-size:24px;
  font-weight:400;
  transition:.2s ease;
}
.question-item .answer{
  display:none;
  padding:0 48px 24px 0;
  color:#60737c;
  line-height:1.7;
}
.question-item.active .answer{display:block}
.question-item.active button b{transform:rotate(45deg)}

.story-section{background:#fff}
.story-grid{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:66px;
  align-items:center;
}
.story-image{
  overflow:hidden;
  border-radius:var(--radius-xl);
  box-shadow:var(--soft-shadow);
  transform:rotate(-1.1deg);
}
.story-image img{
  width:100%;
  min-height:590px;
  object-fit:cover;
}
.story-copy p{margin-top:22px}
.story-links{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  margin-top:28px;
}
.story-links a{
  text-decoration:none;
  color:var(--deep);
  font-weight:800;
  border-bottom:1px solid rgba(15,44,61,.22);
  padding-bottom:3px;
}

.journal-section{padding-top:90px}
.journal-header{
  display:flex;
  justify-content:space-between;
  gap:30px;
  align-items:end;
  margin-bottom:34px;
}
.journal-header h2{max-width:800px}
.journal-header>a{
  text-decoration:none;
  font-weight:800;
  color:var(--deep);
  min-width:max-content;
}
.journal-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.journal-card{
  min-height:310px;
  padding:28px;
  border-radius:var(--radius-lg);
  border:1px solid var(--line);
  background:rgba(255,255,255,.76);
  display:flex;
  flex-direction:column;
}
.journal-meta{
  color:var(--teal);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:900;
}
.journal-card h3{
  font-size:24px;
  line-height:1.25;
  margin:40px 0 14px;
}
.journal-card h3 a{text-decoration:none}
.journal-card h3 a:hover{text-decoration:underline}
.journal-card p{
  margin:0;
  color:#60727b;
  line-height:1.68;
}

.closing-panel{
  padding:30px 0 80px;
}
.closing-shell{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
  align-items:center;
  padding:44px;
  border-radius:var(--radius-xl);
  background:linear-gradient(135deg,#dcece6,#f1ece3);
}
.closing-shell span{
  display:block;
  color:#5b7c79;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:900;
  margin-bottom:8px;
}
.closing-shell h2{
  margin:0;
  font-size:38px;
  line-height:1.12;
  letter-spacing:-.035em;
}
.closing-shell p{
  margin:0;
  line-height:1.72;
  color:#5d7078;
}

.site-footer{
  padding:70px 0 26px;
  background:#0c2532;
  color:white;
}
.footer-top{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:70px;
  padding-bottom:52px;
}
.footer-brand .brand small{color:#9cb4bd}
.footer-brand p{
  max-width:520px;
  margin:22px 0 0;
  color:#a9bdc4;
  line-height:1.7;
}
.footer-links{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
}
.footer-links strong{
  display:block;
  margin-bottom:14px;
  color:white;
}
.footer-links a{
  display:block;
  margin:8px 0;
  text-decoration:none;
  color:#9fb6bf;
  font-size:14px;
}
.footer-links a:hover{color:white}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.10);
  color:#8ea6af;
  font-size:13px;
}

.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s ease,transform .7s ease;
}
.reveal.visible{
  opacity:1;
  transform:none;
}

@media(max-width:991px){
  .header-shell{position:relative}
  .menu-toggle{display:block}
  .topnav{
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:78px;
    padding:12px;
    border-radius:18px;
    background:rgba(255,255,255,.98);
    box-shadow:0 22px 50px rgba(15,44,61,.14);
    border:1px solid var(--line);
  }
  .topnav.open{display:block}
  .topnav ul{display:block}
  .topnav a{padding:12px 14px}
  .hero{padding-top:24px}
  .hero-grid{grid-template-columns:1fr;min-height:auto}
  .hero h1{font-size:clamp(50px,11vw,80px)}
  .hero-visual{padding-top:10px}
  .quick-index{grid-template-columns:repeat(2,1fr)}
  .quick-index a:nth-child(2){border-right:0}
  .quick-index a:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .section-heading,
  .content-split,
  .dark-grid,
  .questions-layout,
  .story-grid,
  .closing-shell,
  .footer-top{grid-template-columns:1fr}
  .section-heading{gap:28px}
  .image-frame{min-height:520px}
  .questions-intro{position:static}
  .signal-strip{grid-template-columns:repeat(2,1fr)}
  .signal-strip div:nth-child(2){border-right:0}
  .signal-strip div:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .journal-grid{grid-template-columns:1fr}
  .footer-top{gap:42px}
}

@media(max-width:700px){
  .container{padding-left:18px;padding-right:18px}
  .section{padding:78px 0}
  .hero h1{font-size:48px}
  .hero .lead{font-size:17px}
  .orbit-card{width:92vw;max-width:450px}
  .quick-index{grid-template-columns:1fr}
  .quick-index a{border-right:0;border-bottom:1px solid var(--line)!important}
  .quick-index a:last-child{border-bottom:0!important}
  .feature-grid{grid-template-columns:1fr}
  .feature-card.wide,
  .feature-card.image-card{grid-column:auto}
  .feature-card.image-card{grid-template-columns:1fr}
  .feature-card.image-card div{padding:28px}
  .mosaic{grid-template-columns:1fr}
  .mosaic-card.tall,
  .mosaic-card.wide{grid-row:auto;grid-column:auto}
  .signal-strip{grid-template-columns:1fr}
  .signal-strip div{
    border-right:0;
    border-bottom:1px solid var(--line)!important
  }
  .signal-strip div:last-child{border-bottom:0!important}
  .journal-header{display:block}
  .journal-header>a{display:inline-block;margin-top:18px}
  .footer-links{grid-template-columns:1fr 1fr}
  .footer-bottom{display:block}
  .footer-bottom span{display:block;margin-top:8px}
  .closing-shell{padding:30px 24px}
  .float-tag{font-size:10px}
  .tag-one{left:6%}
  .tag-two{right:-2%}
  .tag-three{left:-1%}
  .tag-four{right:8%}
}