@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Public+Sans:wght@400;500;600;700&display=swap');

:root{
  --teal:#1B3A4B; --teal-deep:#122834; --amber:#E8A33D; --amber-soft:#F3C578;
  --paper:#F7F4EC; --paper-2:#EFEADC; --ink:#2B2A28; --ink-soft:#5B5852;
  --clay:#C4735A; --line:#E1DACB; --white:#FFFDF8;
  --serif:'Fraunces',Georgia,serif; --sans:'Public Sans',system-ui,sans-serif;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--sans); color:var(--ink); background:var(--paper);
  font-size:18px; line-height:1.65; -webkit-font-smoothing:antialiased;
}
img,svg{display:block; max-width:100%;}
a{color:inherit;}
h1,h2,h3{font-family:var(--serif); font-weight:600; line-height:1.15; color:var(--teal-deep);}
h1{font-size:clamp(2.4rem,5vw,3.6rem); font-weight:500;}
h2{font-size:clamp(1.7rem,3vw,2.3rem);}
h3{font-size:1.25rem; font-weight:600;}
p{max-width:38em;}
.container{max-width:1120px; margin:0 auto; padding:0 28px;}
.narrow{max-width:640px;}

/* Nav */
.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 0; border-bottom:1px solid var(--line);
}
.nav .container{display:flex; align-items:center; justify-content:space-between; width:100%;}
.logo{font-family:var(--serif); font-size:1.5rem; font-weight:600; color:var(--teal-deep); text-decoration:none; letter-spacing:0.01em; display:inline-flex; align-items:center; gap:9px;}
.logo em{color:var(--amber); font-style:italic; font-weight:500;}
.logo-mark{width:28px; height:28px; border-radius:5px; flex:0 0 auto; overflow:hidden; display:inline-block; vertical-align:middle;}
.logo-mark svg{width:100%; height:100%; display:block;}
footer .logo-mark{width:26px; height:26px;}
footer .logo{display:inline-flex !important;}
.navlinks{display:flex; gap:32px; align-items:center; list-style:none;}
.navlinks li > a:not(.btn){text-decoration:none; font-weight:500; font-size:0.98rem; color:var(--ink-soft); transition:color .15s;}
.navlinks li > a:not(.btn):hover, .navlinks li > a.active:not(.btn){color:var(--teal);}
.navlinks a:focus-visible, a:focus-visible, button:focus-visible{outline:3px solid var(--amber); outline-offset:3px;}
.btn{
  display:inline-flex; align-items:center; gap:8px; padding:13px 26px; border-radius:8px;
  font-weight:600; font-size:1rem; text-decoration:none; border:none; cursor:pointer;
  font-family:var(--sans); transition:transform .15s, box-shadow .15s;
}
.btn-primary{background:var(--teal); color:var(--white);}
.btn-primary:hover{background:var(--teal-deep); transform:translateY(-1px);}
.btn-amber{background:var(--amber); color:var(--teal-deep);}
.btn-amber:hover{background:#DD9526; transform:translateY(-1px);}
.btn-ghost{background:transparent; color:var(--teal); border:1.5px solid var(--teal);}
.btn-ghost:hover{background:var(--teal); color:var(--white);}
.menu-toggle{display:none; background:none; border:none; font-size:1.6rem; color:var(--teal-deep); cursor:pointer;}

/* Hero (lighthouse scene) */
.hero{
  position:relative; overflow:hidden; padding:88px 0 96px;
  background:linear-gradient(180deg, var(--teal-deep) 0%, var(--teal) 55%, #6C8A6E 78%, var(--amber-soft) 100%);
}
.hero-stars{position:absolute; inset:0; opacity:0.5;}
.hero .container{position:relative; z-index:2;}
.hero-inner{display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:center;}
.hero h1{color:var(--white); max-width:11.5ch;}
.hero p.lede{color:#E7EEE7; font-size:1.2rem; max-width:34ch; margin-top:18px;}
.hero-ctas{display:flex; gap:14px; margin-top:34px; flex-wrap:wrap;}
.beam{
  position:absolute; top:0; left:50%; width:900px; height:900px;
  background:conic-gradient(from 200deg at 50% 0%, transparent 0deg, rgba(232,163,61,0.35) 18deg, transparent 40deg);
  transform:translateX(-50%); pointer-events:none;
}
.lighthouse-wrap{position:relative; display:flex; justify-content:center;}
.lighthouse{width:220px; height:auto;}

/* Sections */
section{padding:76px 0;}
.section-tight{padding:56px 0;}
.eyebrow{font-family:var(--sans); font-weight:700; font-size:0.85rem; color:var(--clay); margin-bottom:10px;}
.lead-para{font-size:1.2rem; color:var(--ink-soft); max-width:36em; margin-top:14px;}

.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:44px;}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:48px; margin-top:44px; align-items:start;}
.card{background:var(--white); border:1px solid var(--line); border-radius:12px; padding:30px;}
.card h3{margin-bottom:10px;}
.card p{color:var(--ink-soft); font-size:1rem;}
.icon-circle{
  width:52px; height:52px; border-radius:50%; background:var(--paper-2);
  display:flex; align-items:center; justify-content:center; font-size:1.5rem; margin-bottom:16px;
}

.band{background:var(--white); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.band-teal{background:var(--teal-deep); color:var(--white);}
.band-teal h2, .band-teal h3{color:var(--white);}
.band-teal .lead-para{color:#D9E2DC;}

.steps{display:flex; flex-direction:column; gap:0; margin-top:44px;}
.step{display:flex; gap:26px; padding:28px 0; border-bottom:1px solid var(--line);}
.step:last-child{border-bottom:none;}
.step-num{
  flex:0 0 auto; width:44px; height:44px; border-radius:50%; background:var(--teal); color:var(--white);
  display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-weight:600; font-size:1.1rem;
}
.step h3{margin-bottom:6px;}
.step p{color:var(--ink-soft);}

.quote{font-family:var(--serif); font-size:1.4rem; font-weight:500; color:var(--teal-deep); font-style:italic; max-width:30em; line-height:1.4;}

/* FAQ accordion */
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%; text-align:left; background:none; border:none; padding:22px 0;
  display:flex; justify-content:space-between; align-items:center; cursor:pointer;
  font-family:var(--sans); font-weight:600; font-size:1.08rem; color:var(--teal-deep);
}
.faq-q .plus{font-size:1.4rem; color:var(--clay); transition:transform .2s; flex:0 0 auto; margin-left:20px;}
.faq-item.open .plus{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .25s ease;}
.faq-a p{padding-bottom:22px; color:var(--ink-soft); max-width:42em;}

/* Footer */
footer{background:var(--teal-deep); color:#C9D3CC; padding:56px 0 32px;}
footer .logo{color:var(--white);}
.foot-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:40px; padding-bottom:36px; border-bottom:1px solid rgba(255,255,255,0.12);}
.foot-col h4{font-size:0.95rem; font-weight:700; color:var(--white); margin-bottom:14px;}
.foot-col a{display:block; color:#B7C2BA; text-decoration:none; font-size:0.95rem; margin-bottom:10px;}
.foot-col a:hover{color:var(--amber);}
.foot-bottom{padding-top:24px; font-size:0.85rem; color:#8FA098; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}

.badge-row{display:flex; gap:28px; flex-wrap:wrap; margin-top:36px;}
.badge{display:flex; align-items:center; gap:10px; font-weight:600; color:var(--teal); font-size:0.95rem;}

@media (max-width:860px){
  .hero-inner{grid-template-columns:1fr; text-align:center;}
  .hero-ctas{justify-content:center;}
  .lighthouse-wrap{order:-1;}
  .grid-3{grid-template-columns:1fr;}
  .grid-2{grid-template-columns:1fr;}
  .navlinks{position:fixed; top:0; right:0; height:100vh; width:78%; max-width:320px; background:var(--white);
    flex-direction:column; align-items:flex-start; padding:100px 32px 32px; box-shadow:-8px 0 30px rgba(0,0,0,0.15);
    transform:translateX(100%); transition:transform .25s; z-index:50;}
  .navlinks.open{transform:translateX(0);}
  .menu-toggle{display:block;}
  .foot-grid{grid-template-columns:1fr;}
}
@media (prefers-reduced-motion:reduce){ *{transition:none !important; animation:none !important;} }
