:root{
  --c-bg:#FAF8F3; --c-surface:#FFFFFF; --c-text:#1B2420; --c-muted:#4C5852;
  --c-accent:#14322B; --c-accent-ink:#FFFFFF; --c-gold:#B7832A; --c-gold-ink:#7E5612; --c-border:#E3DED2; --c-band:#14322B; --c-band-text:#F3EFE6; --c-cream:#FBF7EC; --c-band-2:#1C4238;
  --f-display:Georgia,"Iowan Old Style","Palatino Linotype",serif;
  --f-text:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --t1:14px; --t2:16px; --t3:20px; --t4:25px; --t5:31px; --t6:39px; --t7:49px;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s6:24px; --s8:32px; --s12:48px; --s16:64px; --s24:96px;
  --r:10px; --w:1080px;
}
@media (prefers-color-scheme: dark){
  :root{
    --c-bg:#0F1613; --c-surface:#17211D; --c-text:#ECE8DF; --c-muted:#A9B3AD;
    --c-accent:#E8B75A; --c-accent-ink:#14201B; --c-gold:#E8B75A; --c-gold-ink:#E8B75A; --c-border:#2A3832; --c-band:#0A100D; --c-band-text:#ECE8DF; --c-cream:#17211D; --c-band-2:#13201B;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--c-bg);color:var(--c-text);font:400 var(--t2)/1.6 var(--f-text)}
a{color:inherit}
.wrap{max-width:var(--w);margin:0 auto;padding:0 var(--s6)}
header.top{background:var(--c-band);color:var(--c-band-text)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);padding-top:var(--s4);padding-bottom:var(--s4)}
.brand{display:flex;align-items:center;gap:var(--s3);font:700 var(--t3)/1 var(--f-display);text-decoration:none;color:var(--c-band-text)}
.brand svg{width:32px;height:32px;flex:none}
nav a{font-size:var(--t1);text-decoration:none;margin-left:var(--s6);opacity:.9}
nav a:hover{text-decoration:underline}
.hero{background:var(--c-band);color:var(--c-band-text);padding:var(--s16) 0 var(--s24)}
.hero h1{font:700 var(--t7)/1.12 var(--f-display);margin:0 0 var(--s6);max-width:18ch;letter-spacing:-.01em}
.hero p.lede{font-size:var(--t3);max-width:52ch;margin:0 0 var(--s8);opacity:.92}
.hero .rule{width:64px;height:4px;background:var(--c-gold);border-radius:2px;margin-bottom:var(--s6)}
.btns{display:flex;flex-wrap:wrap;gap:var(--s4)}
.btn{display:inline-block;padding:var(--s3) var(--s6);border-radius:var(--r);font-weight:600;text-decoration:none;border:2px solid var(--c-gold)}
.btn.primary{background:var(--c-gold);color:#14201B}
.btn.ghost{color:var(--c-band-text)}
.notice{margin-top:calc(-1 * var(--s12));position:relative}
.notice .card{background:var(--c-surface);border:1px solid var(--c-border);border-left:4px solid var(--c-gold);border-radius:var(--r);padding:var(--s6) var(--s8);box-shadow:0 8px 24px rgba(0,0,0,.08)}
.notice strong{display:block;font-size:var(--t3);font-family:var(--f-display);margin-bottom:var(--s2)}
.notice p{margin:0;color:var(--c-muted)}
section{padding:var(--s16) 0}
section h2{font:700 var(--t6)/1.2 var(--f-display);margin:0 0 var(--s4)}
section h2::after{content:"";display:block;width:48px;height:3px;background:var(--c-gold);margin-top:var(--s3);border-radius:2px}
section p.intro{color:var(--c-muted);max-width:62ch;margin:0 0 var(--s8);font-size:var(--t3)}
.grid{display:grid;gap:var(--s6);grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r);padding:var(--s6)}
.card h3{font:700 var(--t3)/1.3 var(--f-display);margin:0 0 var(--s2)}
.card p{margin:0;color:var(--c-muted)}
.step{font:700 var(--t1)/1 var(--f-text);letter-spacing:.08em;text-transform:uppercase;color:var(--c-gold-ink);margin-bottom:var(--s3)}
.free{background:var(--c-surface);border-top:1px solid var(--c-border);border-bottom:1px solid var(--c-border)}
.two{display:grid;gap:var(--s8);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));align-items:start}
.fee{font:700 var(--t7)/1 var(--f-display);color:var(--c-accent);margin:0 0 var(--s2)}
ul.ticks{list-style:none;padding:0;margin:0}
ul.ticks li{padding:var(--s2) 0 var(--s2) var(--s8);position:relative;border-bottom:1px solid var(--c-border)}
ul.ticks li::before{content:"";position:absolute;left:var(--s2);top:18px;width:12px;height:6px;border-left:2px solid var(--c-gold);border-bottom:2px solid var(--c-gold);transform:rotate(-45deg)}
details{border-bottom:1px solid var(--c-border);padding:var(--s4) 0}
summary{cursor:pointer;font:700 var(--t3)/1.4 var(--f-display);list-style:none}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";float:right;color:var(--c-gold)}
details[open] summary::after{content:"–"}
details p{color:var(--c-muted);margin:var(--s3) 0 0;max-width:70ch}
footer{background:var(--c-band);color:var(--c-band-text);padding:var(--s12) 0;font-size:var(--t1)}
footer p{margin:0 0 var(--s3);max-width:80ch;opacity:.9}
@media (max-width:600px){
  nav{display:none}
  .hero{padding:var(--s12) 0 var(--s16)}
  .hero h1{font-size:var(--t5)}
  .hero p.lede{font-size:var(--t2)}
  section h2{font-size:var(--t5)}
  section p.intro{font-size:var(--t2)}
  .notice .card{padding:var(--s6)}
  .wrap{padding:0 var(--s4)}
}
/* v2: assisted-web-design pass (ref-1): dark bands, cream cards, hero gradient, framed FAQ */
.hero{background-color:var(--c-band);background-image:radial-gradient(120% 90% at 85% 0%,var(--c-band-2) 0%,var(--c-band) 60%)}
.notice .card{background:var(--c-cream)}
section.dark{background:var(--c-band);color:var(--c-band-text)}
section.dark p.intro{color:var(--c-band-text);opacity:.88}
section.dark .card{background:var(--c-cream);border-color:transparent;box-shadow:0 6px 20px rgba(0,0,0,.18)}
section.dark .card h3{color:var(--c-text)}
section.dark .fee{color:var(--c-gold)}
section.dark ul.ticks li{border-bottom-color:rgba(255,255,255,.14)}
section.dark ul.ticks li::before{border-color:var(--c-gold)}
details{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r);padding:var(--s4) var(--s6);margin-bottom:var(--s3)}
details[open]{border-left:4px solid var(--c-gold)}
.notice{z-index:1}
/* v3: photography (curator / Pexels) */
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--s12);align-items:center}
.photo{margin:var(--s8) 0 0;position:relative}
.photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r);box-shadow:0 10px 30px rgba(0,0,0,.18)}
.hero-photo{margin:0}
.hero-photo::before{content:"";position:absolute;inset:var(--s4) calc(-1 * var(--s4)) calc(-1 * var(--s4)) var(--s4);border:2px solid var(--c-gold);border-radius:var(--r);z-index:0}
.hero-photo img{position:relative;z-index:1;aspect-ratio:4/5}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr}.hero-photo img{aspect-ratio:3/2}.hero-photo::before{inset:var(--s3) calc(-1 * var(--s3)) calc(-1 * var(--s3)) var(--s3)}}
/* guides */
.crumbs{font-size:var(--t1);opacity:.85;margin-bottom:var(--s4)}
.crumbs a{color:var(--c-band-text)}
.hero.guide{padding:var(--s12) 0 var(--s16)}
.hero.guide h1{font-size:var(--t6);max-width:24ch}
.prose{max-width:70ch}
.prose h2{font:700 var(--t5)/1.25 var(--f-display);margin:var(--s12) 0 var(--s4)}
.prose h2::after{content:"";display:block;width:48px;height:3px;background:var(--c-gold);margin-top:var(--s3);border-radius:2px}
.prose ol,.prose ul{padding-left:var(--s6)}
.prose li{margin-bottom:var(--s2)}
.prose .src{font-size:var(--t1);color:var(--c-muted);margin:0 0 var(--s4)}
.prose .card{margin:var(--s6) 0}
section.guide-body{padding-top:var(--s8)}
.prose .card{border-left:4px solid var(--c-gold);background:var(--c-cream)}
.prose .card strong{display:block;font:700 var(--t3)/1.3 var(--f-display);margin-bottom:var(--s2)}
