/* Wild Radius — Pine #1D3A2F · Yarrow gold #E2A51B · Fern #44714F · Warm white #FCFAF3 (Cream #F8F3E3 as a tint) */
@font-face{font-family:'Jost';font-weight:400;font-style:normal;font-display:swap;src:url(fonts/Jost-400.woff2) format('woff2')}
@font-face{font-family:'Jost';font-weight:500;font-style:normal;font-display:swap;src:url(fonts/Jost-500.woff2) format('woff2')}
@font-face{font-family:'Jost';font-weight:600;font-style:normal;font-display:swap;src:url(fonts/Jost-600.woff2) format('woff2')}
@font-face{font-family:'Fraunces';font-weight:500;font-style:italic;font-display:swap;src:url(fonts/WildRadius-Fraunces-Italic.woff2) format('woff2')}
:root{
  --paper:#fcfaf3; --sheet:#ffffff; --ink:#1d3a2f; --muted:#5d6f66; --rule:#e4dfcf;
  --accent:#44714f; --moss:#44714f; --gold:#e2a51b; --pine:#1d3a2f; --cream:#f8f3e3; --wr-gold:#e2a51b;
  --shadow:0 1px 2px rgba(29,58,47,.06),0 8px 24px rgba(29,58,47,.08);
  --serif:'Jost','Avenir Next','Century Gothic',system-ui,sans-serif; --ui:var(--serif);
  --wild:'Fraunces',Georgia,serif; --body:'Newsreader',Georgia,serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--paper:#12271f; --sheet:#193428; --ink:#f6f2e6; --muted:#a9b8ae; --rule:#2b473a; --accent:#e2a51b; --moss:#8fc09b; --cream:#1d3a2f; --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35); color-scheme:dark;}}
:root[data-theme="dark"]{--paper:#12271f; --sheet:#193428; --ink:#f6f2e6; --muted:#a9b8ae; --rule:#2b473a; --accent:#e2a51b; --moss:#8fc09b; --cream:#1d3a2f; --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35); color-scheme:dark;}

*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 19px/1.55 var(--body);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--accent);text-underline-offset:3px}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.12;letter-spacing:-.01em;margin:.2em 0 .4em;text-wrap:balance}
h1{font-size:clamp(2.2rem,5.5vw,3.9rem)} h2{font-size:clamp(1.7rem,3.6vw,2.5rem)} h3{font-size:1.25rem}
h1 em,h2 em{font-style:italic;color:var(--accent);font-family:var(--wild);font-weight:500;letter-spacing:0}
.wrap{max-width:1160px;margin-left:auto;margin-right:auto;padding-left:20px;padding-right:20px}
section{margin:4.5rem auto}
.eyebrow{font:500 .74rem/1 var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 .6rem}
.lead{font-size:1.2rem;color:var(--muted);max-width:40em} .lead.small{font-size:1.05rem}
.meta{font:400 .8rem/1.4 var(--ui);color:var(--muted)} .center{text-align:center}
.note{background:var(--sheet);border:1px dashed var(--rule);padding:.7rem 1rem;border-radius:10px;display:inline-block;font-size:1rem}

.proto{background:var(--ink);color:var(--paper);font:400 .78rem/1.3 var(--ui);text-align:center;padding:.55rem 1rem}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:1.1rem;padding-bottom:1.1rem;flex-wrap:wrap}
.brand{color:var(--ink);text-decoration:none;display:block;line-height:0}
.brand svg{height:52px;width:auto;display:block}
.nav nav{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
.nav nav a:not(.btn){color:var(--muted);text-decoration:none;font-size:1rem} .nav nav a:not(.btn):hover{color:var(--ink)}

.btn{display:inline-block;background:var(--gold);color:var(--pine);text-decoration:none;font:500 1rem/1 var(--ui);
  letter-spacing:.02em;padding:.9rem 1.25rem;border-radius:999px;border:1.5px solid var(--gold);transition:transform .15s,filter .15s}
.btn:hover{transform:translateY(-1px);filter:brightness(1.05)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--rule)} .btn.ghost:hover{border-color:var(--ink)}
.btn.small{padding:.6rem .95rem;font-size:.9rem}


.hero{display:grid;grid-template-columns:1.15fr 1fr;gap:3rem;align-items:center;margin-top:2.5rem;padding-bottom:2rem}
.cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.6rem}
.hero-art{display:grid;grid-template-columns:1fr 1fr;gap:12px;transform:rotate(1.5deg)}
.hero-art img{aspect-ratio:1;object-fit:cover;border-radius:14px;box-shadow:var(--shadow);border:6px solid var(--sheet)}
.hero-art img:nth-child(2){transform:translateY(24px)} .hero-art img:nth-child(4){transform:translateY(24px)}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding-top:2rem;padding-bottom:2rem}
.steps p{margin:0;color:var(--muted);font-size:1rem}
.num{font:500 .85rem/1 var(--ui);color:var(--pine);background:var(--gold);border:1px solid var(--gold);border-radius:999px;padding:.35rem .6rem;display:inline-block}

.group{margin:2.4rem 0} .group-h{font:500 .8rem/1 var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--rule);padding-bottom:.6rem;margin-bottom:1.2rem}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tile{background:var(--sheet);border-radius:14px;overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);display:flex;flex-direction:column;transition:transform .2s}
.tile:hover{transform:translateY(-3px)}
.tile img{aspect-ratio:4/3;object-fit:cover;width:100%}
.tile-t{font-family:var(--serif);font-size:1.08rem;padding:.8rem .9rem .2rem}
.tile-d{font-size:.92rem;color:var(--muted);padding:0 .9rem 1rem;line-height:1.4}

.pkgs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:1.5rem 0}
.pkg{background:var(--sheet);border:1px solid var(--rule);border-radius:18px;padding:1.6rem;display:flex;flex-direction:column}
.pkg .btn{margin-top:auto;align-self:flex-start} .pkg p{margin:.3rem 0 1rem}
.pkg.featured{border:2px solid var(--gold);box-shadow:var(--shadow)}
.price{font-family:var(--serif);font-weight:500;font-size:2.4rem;line-height:1;color:var(--ink)}

.band{background:var(--cream);border-radius:22px;padding:2.6rem 2rem;text-align:center;box-shadow:var(--shadow)}
.band p{max-width:36em;margin:0 auto 1.4rem;color:var(--muted)}

.faq details{border-bottom:1px solid var(--rule);padding:1rem 0}
.faq summary{cursor:pointer;font-family:var(--serif);font-size:1.15rem;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::after{content:"+";color:var(--accent);font-family:var(--ui)} .faq details[open] summary::after{content:"–"}
.faq p{color:var(--muted);margin:.6rem 0 0;max-width:42em}

.coll-hero{margin-top:2.5rem;margin-bottom:2rem}
.facts{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:1.5rem}
.facts li{background:var(--sheet);border-radius:12px;padding:.9rem 1rem;font-size:1rem;color:var(--muted);border:1px solid var(--rule)}
.facts strong{color:var(--ink);font-weight:500}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.card{background:var(--sheet);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.card .cover img{aspect-ratio:16/10;object-fit:cover;width:100%;transition:transform .4s} .card .cover{overflow:hidden}
.card:hover .cover img{transform:scale(1.03)}
.card-body{padding:1rem 1.15rem 1.2rem;display:flex;flex-direction:column;flex:1}
.card-body h3{margin:0 0 .15rem} .card-body h3 a{color:var(--ink);text-decoration:none}
.card-body p{font-size:.97rem;color:var(--muted);margin:.35rem 0 .9rem}
.actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:auto}

.foot{border-top:1px solid var(--rule);padding-top:1.5rem;padding-bottom:2.5rem;margin-top:4rem;font-size:.95rem;color:var(--muted)}
.foot-row{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:space-between}
.credits{margin-bottom:1.2rem} .credits summary{cursor:pointer;font:500 .78rem/1 var(--ui);text-transform:uppercase;letter-spacing:.1em}
.credits ul{columns:2;font-size:.82rem;padding-left:1.1rem} .credits li{break-inside:avoid;margin-bottom:.3rem}
.credits span{color:var(--ink)}

@media (max-width:860px){
  .hero{grid-template-columns:1fr;gap:2rem} .hero-art{max-width:420px}
  .steps{grid-template-columns:1fr 1fr} .tiles{grid-template-columns:1fr 1fr} .pkgs{grid-template-columns:1fr} .credits ul{columns:1}
}
@media (max-width:520px){
  body{font-size:18px} .wrap{padding-left:16px;padding-right:16px} section{margin:3.2rem auto} .hero-art{max-width:300px;margin:0 auto} .tiles{gap:12px} .tile-d{display:none} .tile-t{font-size:.98rem;padding-bottom:.9rem} .nav nav a:not(.btn){display:none}
  .steps{grid-template-columns:1fr} .grid{grid-template-columns:1fr} .band{padding:2rem 1.2rem}
}

/* centre point: the place a radius is drawn from */
.center-line{display:flex;align-items:center;gap:11px;font:400 1.05rem/1.3 var(--ui);letter-spacing:.02em;color:var(--muted);margin:.2rem 0 1rem}
.center-line b{font-weight:500;color:var(--ink)}
.pin{flex:none;width:10px;height:10px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(226,165,27,.25)}
.tagline{font:italic 400 1.05rem/1.2 var(--body);color:var(--accent)}
::selection{background:#f3dc9c;color:#1d3a2f}
.tile-t,.faq summary{font-weight:500}
