:root{
  --forest:#0F3B2E;
  --leaf:#1E7A57;
  --mint:#E4F1EA;
  --gold:#E3B04B;
  --ink:#10231C;
  --white:#FFFFFF;
  --line:#CFE0D6;
  --muted:#3F5A4E;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font-family:Manrope,system-ui,sans-serif;color:var(--ink);background:var(--white);line-height:1.65;font-size:17px}
h1,h2,h3{font-family:Fraunces,Georgia,serif;font-weight:700;line-height:1.08;letter-spacing:-.01em;color:var(--forest)}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.wrap{max-width:1080px;margin:0 auto;padding:0 22px}

/* header and hero */
.hero{background:var(--forest);color:#fff;text-align:center;overflow:hidden}
nav{display:flex;align-items:center;justify-content:space-between;padding:20px 0}
.logo{font-family:Fraunces,serif;font-weight:700;font-size:24px;text-decoration:none;color:#fff}
.links{display:flex;gap:22px;align-items:center;font-size:15px;font-weight:600}
.links a{text-decoration:none;color:#fff}
.btn{display:inline-block;padding:13px 24px;border-radius:10px;font-weight:700;text-decoration:none;font-size:16px;border:2px solid var(--gold);background:var(--gold);color:var(--ink)}
.btn.line{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.hero h1{color:#fff;font-size:clamp(46px,9vw,92px);max-width:11ch;margin:44px auto 20px}
.sub{color:#CFE5DA;font-size:19px;max-width:42ch;margin:0 auto 28px}
.cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.soon{font-size:14px;color:#A9CBBB;margin:8px 0 44px}

/* phone */
.phone{width:290px;margin:0 auto;background:#0A1F18;border-radius:38px 38px 0 0;padding:12px 12px 0;box-shadow:0 -6px 0 rgba(255,255,255,.07)}
.screen{background:#fff;color:var(--ink);border-radius:28px 28px 0 0;padding:20px 18px 26px;text-align:left;font-size:14px;min-height:300px}
.eta{font-family:Fraunces,serif;font-size:26px;font-weight:700;color:var(--forest);line-height:1.1;margin-bottom:4px}
.bar{height:8px;border-radius:99px;background:var(--mint);margin:16px 0 18px;overflow:hidden}
.bar i{display:block;height:100%;width:66%;background:var(--leaf);border-radius:99px}
.screen ol{list-style:none;padding:0}
.screen li{display:flex;gap:10px;align-items:center;padding:7px 0;color:#5B6E65}
.screen li.done{color:var(--ink);font-weight:600}
.screen li span{width:12px;height:12px;border-radius:50%;border:2px solid var(--line);flex:none}
.screen li.done span{background:var(--leaf);border-color:var(--leaf)}
.tip{margin-top:16px;border:2px solid var(--gold);border-radius:10px;padding:10px 12px;font-weight:600}


/* sections */
section{padding:84px 0}
h2{font-size:clamp(30px,4.6vw,46px);margin-bottom:14px}
.lead{color:var(--muted);max-width:52ch;margin-bottom:40px}
.how{background:var(--mint)}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.three h3{font-size:23px;margin:8px 0}
.three p{color:var(--muted)}
.n{font-family:Fraunces,serif;font-size:44px;color:var(--leaf);font-weight:700;line-height:1}
@media(max-width:780px){.three{grid-template-columns:1fr}}


/* audience rows */
.btn.dark{background:var(--forest);color:#fff;border-color:var(--forest)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;padding:34px 0;border-top:1px solid var(--line)}
.row:first-of-type{border-top:0}
.row.flip .text{order:2}
.row h3{font-size:30px;margin-bottom:10px}
.row p{color:var(--muted);max-width:44ch;margin-bottom:22px}
.actions{display:flex;gap:10px;flex-wrap:wrap}
.panel{background:var(--mint);border-radius:18px;padding:30px;min-height:190px;display:flex;flex-direction:column;justify-content:center;gap:10px;font-weight:600}
.panel div{background:#fff;border-radius:10px;padding:12px 14px;display:flex;justify-content:space-between;gap:12px;border:1px solid var(--line)}
.panel div span:last-child{color:var(--leaf)}
@media(max-width:800px){.row{grid-template-columns:1fr;gap:22px}.row.flip .text{order:0}}


/* final band, questions and footer */
.join{background:var(--forest);color:#fff;text-align:center}
.join h2{color:#fff}
.join p{color:#CFE5DA;max-width:46ch;margin:0 auto 26px}
details{border-top:1px solid var(--line);padding:18px 0}
details:last-of-type{border-bottom:1px solid var(--line)}
summary{cursor:pointer;font-weight:700;font-size:18px}
details p{margin-top:8px;color:var(--muted);max-width:60ch}
footer{padding:36px 0;font-size:15px;color:var(--muted);border-top:1px solid var(--line)}
footer .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.flinks{display:flex;gap:18px;flex-wrap:wrap}
footer a{text-decoration:none}
footer a:hover{text-decoration:underline}


/* phones and tablets */
nav{position:relative}
.menu-btn{display:none;background:transparent;color:#fff;border:2px solid rgba(255,255,255,.55);border-radius:10px;padding:8px 14px;font:inherit;font-weight:600;cursor:pointer}
@media(max-width:860px){
  .menu-btn{display:block}
  .links{display:none;position:absolute;top:70px;left:0;right:0;flex-direction:column;align-items:stretch;gap:4px;background:#0A2A20;border-radius:14px;padding:14px;text-align:left;z-index:10}
  .links.open{display:flex}
  .links a{padding:10px 8px}
  .links .btn{text-align:center}
}
html{scroll-padding-top:72px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}


/* why section */
.why{background:var(--mint)}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.card{background:#fff;border-radius:16px;padding:26px;border-left:6px solid var(--gold)}
.card h3{font-size:22px;margin-bottom:8px}
.card p{color:var(--muted)}
@media(max-width:700px){.cards{grid-template-columns:1fr}}


/* sign-up form */
.narrow{max-width:620px}
.signup .lead{margin-bottom:28px}
.field{margin-bottom:16px}
.field label{display:block;font-weight:700;margin-bottom:6px}
.field input,.field select{width:100%;padding:13px 14px;border:2px solid var(--line);border-radius:10px;font:inherit;background:#fff;color:var(--ink)}
.field input:focus,.field select:focus{border-color:var(--leaf);outline:none}
button.btn{font-family:inherit;font-size:16px;cursor:pointer}
.note{font-size:14px;color:var(--muted);margin-top:14px}
.hp{position:absolute;left:-9999px}


/* about us */
.about{background:#FBF3E0}
.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:start}
.story p{margin-bottom:16px;max-width:52ch;color:var(--muted)}
.story .big{font-family:Fraunces,Georgia,serif;font-size:clamp(22px,3vw,28px);line-height:1.25;color:var(--forest);font-weight:700;max-width:30ch}
.story .pull{border-left:6px solid var(--gold);padding-left:16px;color:var(--forest);font-weight:700}
.for{display:grid;gap:16px}
.forcard{background:#fff;border-radius:16px;padding:22px 24px;border:1px solid var(--line)}
.forcard h3{font-size:21px;margin-bottom:6px}
.forcard p{color:var(--muted)}
.closing{text-align:center;margin-top:56px}
.sign{font-weight:700}
.motto{font-family:Fraunces,Georgia,serif;font-size:clamp(28px,5vw,44px);font-weight:700;color:var(--forest);margin:6px 0 20px}
@media(max-width:820px){.about-grid{grid-template-columns:1fr;gap:32px}}