:root{
  --font-sans:"Geist",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  --paper:#EDEAE1;
  --paper-2:#F7F4EC;
  --ink:#11130F;
  --night:#0D0F0C;
  --text:#252823;
  --muted:#70746B;
  --line:rgba(17,19,15,.14);
  --line-dark:rgba(237,234,225,.14);
  --accent:#C9714D;
  --accent-2:#A9B29A;
  --accent-3:#6F8388;
  --radius:14px;
  --max:1120px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font-sans);
  color:var(--text);
  background:
    linear-gradient(180deg,var(--paper),var(--paper-2) 38%,var(--paper)),
    repeating-linear-gradient(90deg,rgba(17,19,15,.035) 0,rgba(17,19,15,.035) 1px,transparent 1px,transparent 96px);
  line-height:1.6;
  letter-spacing:0;
  -webkit-font-smoothing:antialiased;
}

a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.container{width:min(100% - 48px,var(--max));margin-inline:auto}
.container.nav,
.drawer .container{width:min(100% - 48px,1200px)}

header{
  position:sticky;
  top:0;
  z-index:50;
  border-bottom:1px solid rgba(237,234,225,.12);
  background:rgba(13,15,12,.86);
  backdrop-filter:blur(16px) saturate(160%);
}

.nav{
  min-height:74px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  color:#F7F4EC;
  font-weight:800;
  white-space:nowrap;
}

.brand img{width:40px;height:40px;object-fit:contain}
.brand span{font-size:.98rem}

.navLinks{
  display:flex;
  align-items:center;
  gap:24px;
  color:rgba(247,244,236,.68);
  font-size:.92rem;
  font-weight:700;
}

.navLinks a{padding:12px 0}
.navLinks a:hover{color:#fff}
.navActions{display:flex;align-items:center;gap:10px}

.btn{
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(17,19,15,.18);
  border-radius:var(--radius);
  padding:12px 18px;
  background:#fff;
  color:var(--ink);
  font-weight:760;
}

.btn.primary{
  border-color:#F3EFE5;
  background:#F3EFE5;
  color:#11130F;
}

.btn.dark{
  border-color:rgba(237,234,225,.16);
  background:rgba(237,234,225,.06);
  color:#F7F4EC;
}

.btn.subtle{
  border-color:rgba(237,234,225,.16);
  background:rgba(237,234,225,.06);
  color:#F7F4EC;
}

.iconBtn{
  width:46px;
  height:46px;
  display:none;
  place-items:center;
  border:1px solid rgba(237,234,225,.16);
  border-radius:999px;
  background:rgba(237,234,225,.06);
  color:#F7F4EC;
  cursor:pointer;
}

.iconBtn span,
.iconBtn span::before,
.iconBtn span::after{
  display:block;
  width:18px;
  height:2px;
  background:currentColor;
  border-radius:999px;
  content:"";
}

.iconBtn span::before{transform:translateY(-6px)}
.iconBtn span::after{transform:translateY(4px)}

.drawer{
  display:none;
  border-bottom:1px solid rgba(237,234,225,.12);
  background:var(--night);
}

.drawerInner{
  display:grid;
  gap:10px;
  padding:14px 0 22px;
}

.drawer a{
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-top:1px solid rgba(237,234,225,.1);
  color:#F7F4EC;
  font-weight:750;
}

.hero{
  padding:92px 0 78px;
  color:#F7F4EC;
  background:
    linear-gradient(180deg,rgba(13,15,12,.96),rgba(13,15,12,.98)),
    repeating-linear-gradient(90deg,rgba(237,234,225,.055) 0,rgba(237,234,225,.055) 1px,transparent 1px,transparent 86px);
}

.breadcrumb{
  display:flex;
  gap:8px;
  margin:0 0 30px;
  color:rgba(247,244,236,.58);
  font-size:.9rem;
  font-weight:650;
}

.breadcrumb a{color:#F7F4EC}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:0 0 18px;
  color:var(--accent-2);
  font-size:.82rem;
  font-weight:800;
  text-transform:uppercase;
}

.eyebrow::before{content:"";width:34px;height:1px;background:var(--accent-2)}
h1,h2,h3,p{margin-top:0}
h1{
  max-width:880px;
  margin-bottom:22px;
  font-size:clamp(2.45rem,6vw,4.65rem);
  line-height:1.02;
  font-weight:540;
  color:#F7F4EC;
}

.lead{
  max-width:720px;
  margin-bottom:32px;
  color:rgba(247,244,236,.76);
  font-size:1.15rem;
}

.heroActions{display:flex;flex-wrap:wrap;gap:12px}
main section{padding:82px 0}
.sectionHead{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,.62fr);
  gap:54px;
  align-items:end;
  margin-bottom:34px;
}

h2{
  max-width:760px;
  margin-bottom:0;
  color:var(--ink);
  font-size:clamp(2rem,4vw,3rem);
  line-height:1.08;
  font-weight:560;
}

.sectionHead p{margin:0;color:var(--muted)}
.grid3{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.card{
  border:1px solid var(--line);
  border-radius:18px;
  padding:24px;
  background:rgba(255,255,255,.72);
}

.card h3{color:var(--ink);font-size:1.1rem}
.card p{margin-bottom:0;color:var(--muted)}
.split{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:54px;
  align-items:start;
}

.list{
  display:grid;
  gap:1px;
  border:1px solid var(--line);
  background:var(--line);
}

.listItem{
  display:grid;
  grid-template-columns:72px 1fr;
  gap:24px;
  padding:24px;
  background:#FDFBF5;
}

.num{
  color:var(--accent-3);
  font-family:var(--font-mono);
  font-size:1.6rem;
  font-weight:600;
}

.listItem p{margin:0;color:var(--muted)}
.faq{
  display:grid;
  gap:10px;
}

details{
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px 20px;
  background:rgba(255,255,255,.72);
}

summary{
  cursor:pointer;
  color:var(--ink);
  font-weight:780;
}

details p{margin:12px 0 0;color:var(--muted)}
.cta{
  border:1px solid var(--line-dark);
  border-radius:24px;
  padding:34px;
  background:#11130F;
  color:#F7F4EC;
}

.cta h2{color:#F7F4EC}
.cta p{max-width:680px;color:rgba(247,244,236,.72)}
.related{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:22px;
}

footer{
  padding:42px 0;
  border-top:1px solid rgba(237,234,225,.12);
  background:#0D0F0C;
  color:#F6F3EA;
}

footer .container{
  width:min(100% - 48px,1200px);
}

.footGrid{
  display:grid;
  grid-template-columns:1.2fr .8fr .8fr .8fr;
  gap:34px;
  margin-bottom:36px;
}

.footBrand{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
  font-weight:800;
}

.footBrand img{
  width:38px;
  height:38px;
  object-fit:contain;
}

.footGrid p{
  max-width:360px;
  margin:0;
  color:rgba(246,243,234,.68);
}

.footCol{
  display:grid;
  align-content:start;
  gap:10px;
}

.footCol h4{
  margin:0 0 8px;
  color:#fff;
  font-size:.88rem;
  text-transform:uppercase;
}

.footCol a{
  color:rgba(246,243,234,.68);
  font-size:.94rem;
}

.footCol a:hover{color:#fff}

.footBottom{
  display:flex;
  justify-content:space-between;
  gap:18px;
  padding-top:22px;
  border-top:1px solid rgba(246,243,234,.14);
  color:rgba(246,243,234,.6);
  font-size:.9rem;
}

.foot{
  display:flex;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
}

.foot a:hover{color:#fff}

@media (max-width:1020px){
  .navLinks,
  .navActions .btn{display:none}
  .iconBtn{display:grid}
  .drawer.isOpen{display:block}
}

@media (max-width:860px){
  .container{width:min(100% - 32px,var(--max))}
  .container.nav,
  .drawer .container,
  footer .container{width:min(100% - 32px,1200px)}
  .navLinks,
  .navActions .btn{display:none}
  .iconBtn{display:grid}
  .drawer.isOpen{display:block}
  .sectionHead,.split{grid-template-columns:1fr;gap:26px}
  .grid3{grid-template-columns:1fr}
  .footGrid{grid-template-columns:1fr}
  .footBottom{flex-direction:column}
  .listItem{grid-template-columns:1fr;gap:10px}
}

@media (max-width:460px){
  .brand span{font-size:.9rem}
  .heroActions,
  .related{display:grid}
  .heroActions .btn,
  .related .btn{width:100%}
}