:root{--ink:#101713;--moss:#1e3528;--fern:#80a66f;--lime:#d1e79f;--cream:#f1efe5;--paper:#d8d3c4;--plum:#533247;--gold:#d0a95f;--line:rgba(241,239,229,.18)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--cream);font-family:Montserrat,Arial,sans-serif;font-size:16px;line-height:1.65}
a{color:inherit;text-decoration:none}
.site-header{height:86px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 4vw;border-bottom:1px solid var(--line);position:absolute;z-index:10;width:100%;text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;font-weight:600}
.brand{font-family:Italiana,serif;text-transform:none;letter-spacing:.04em;font-size:1.35rem;display:flex;align-items:center;gap:.7rem}
.brand-mark{color:var(--gold)}
nav{display:flex;gap:2.4rem}nav a,.header-link{transition:color .2s}nav a:hover,.header-link:hover{color:var(--lime)}
.header-link{justify-self:end;border-bottom:1px solid currentColor;padding-bottom:.25rem}
.hero{height:min(920px,100vh);min-height:680px;position:relative;display:flex;align-items:center;overflow:hidden}
.hero-image{position:absolute;inset:0;background:#0c110e url('wildcraft-hero.png') center/cover no-repeat}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,12,9,.93) 0%,rgba(7,12,9,.64) 44%,rgba(7,12,9,.07) 78%),linear-gradient(0deg,rgba(7,12,9,.72),transparent 35%)}
.hero-content{position:relative;z-index:2;width:min(740px,83vw);margin-left:9vw;padding-top:70px}
.eyebrow,.section-number,.blend-kicker{text-transform:uppercase;letter-spacing:.22em;font-size:.7rem;font-weight:600;color:var(--lime)}
h1,h2,h3{font-family:Italiana,serif;font-weight:400;margin:0;line-height:.98}
h1{font-size:clamp(4.3rem,8vw,8rem);letter-spacing:-.035em}h1 em,h2 em{color:var(--lime);font-weight:400}
.hero-copy{font-size:1.05rem;max-width:590px;color:rgba(241,239,229,.78);margin:2rem 0 2.5rem}
.button{display:inline-flex;align-items:center;gap:2rem;border:1px solid rgba(241,239,229,.42);padding:1rem 1.35rem;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:600;transition:.25s}
.button:hover{background:var(--lime);border-color:var(--lime);color:var(--ink);transform:translateY(-2px)}
.vertical-note{position:absolute;z-index:2;right:2.8vw;bottom:7vh;writing-mode:vertical-rl;font-size:.64rem;letter-spacing:.25em;color:rgba(241,239,229,.65)}
.manifesto{padding:9rem 9vw;display:grid;grid-template-columns:.7fr 1.4fr 1fr;gap:4vw;background:var(--cream);color:var(--ink)}
.manifesto .section-number{color:#58724e}.manifesto h2,.section-heading h2,.ritual h2,.connect h2{font-size:clamp(3.2rem,5.5vw,6rem)}
.manifesto h2 em{color:#58724e}.manifesto-copy{padding-top:.4rem;color:#4c514c}.manifesto-copy p:first-child{margin-top:0}
.portfolio{padding:8rem 6vw 9rem}.section-heading{display:flex;justify-content:space-between;gap:4rem;align-items:end;margin-bottom:4rem}.section-heading>p{max-width:420px;color:rgba(241,239,229,.65)}
.portfolio-tools{position:sticky;top:0;z-index:5;background:rgba(16,23,19,.94);backdrop-filter:blur(14px);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1.2rem 0;display:grid;grid-template-columns:minmax(220px,340px) 1fr;gap:2rem;align-items:end}
.search-wrap{display:block}.search-wrap span{display:block;text-transform:uppercase;letter-spacing:.18em;font-size:.65rem;color:var(--lime);margin-bottom:.45rem}.search-wrap input{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(241,239,229,.4);color:var(--cream);font:inherit;font-size:1rem;padding:.5rem 0;outline:0}.search-wrap input:focus{border-color:var(--lime)}.search-wrap input::placeholder{color:rgba(241,239,229,.38)}
.filters{display:flex;gap:.55rem;flex-wrap:wrap;justify-content:flex-end}.filter{border:1px solid var(--line);border-radius:99px;background:transparent;color:rgba(241,239,229,.72);font:inherit;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;padding:.55rem .78rem;cursor:pointer;transition:.2s}.filter:hover,.filter:focus-visible,.filter.active{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.result-line{text-transform:uppercase;letter-spacing:.18em;font-size:.68rem;color:rgba(241,239,229,.55);margin:2rem 0 1.1rem}.result-line span{color:var(--lime)}
.potion-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.potion-card{background:var(--ink);padding:2rem;min-height:465px;display:flex;flex-direction:column;animation:rise .45s ease both;animation-delay:var(--delay)}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.potion-top{display:flex;justify-content:space-between;align-items:start}.potion-sigil{font-family:Italiana,serif;font-size:2.5rem;line-height:1;color:var(--gold)}.potion-number{font-size:.63rem;letter-spacing:.17em;color:rgba(241,239,229,.35);text-transform:uppercase}
.potion-category{color:var(--lime);text-transform:uppercase;letter-spacing:.18em;font-size:.62rem;font-weight:600;margin:2rem 0 .6rem}.potion-card h3{font-size:clamp(2.2rem,3.2vw,3.5rem);line-height:.96;margin-bottom:1rem}.potion-name{appearance:none;border:0;background:transparent;color:inherit;font:inherit;line-height:inherit;text-align:left;padding:0;cursor:pointer;border-bottom:1px solid transparent}.potion-name:hover,.potion-name:focus-visible{color:var(--lime);border-color:currentColor;outline:0}.potion-purpose{font-size:.9rem;font-weight:600;color:var(--paper);margin:.2rem 0}.potion-benefits{font-size:.85rem;color:rgba(241,239,229,.58);margin:.6rem 0 1.6rem}
.prices{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:auto}.prices span{padding:.75rem .4rem}.prices span+span{border-left:1px solid var(--line)}.prices b,.prices small{display:block}.prices b{font-family:Montserrat,Arial,sans-serif;font-size:1.05rem;font-weight:600;letter-spacing:.03em;color:var(--lime)}.prices small{font-size:.58rem;text-transform:uppercase;letter-spacing:.08em;color:rgba(241,239,229,.45)}
.potion-card details{font-size:.75rem;color:rgba(241,239,229,.57);padding-top:1rem}.potion-card summary{cursor:pointer;text-transform:uppercase;letter-spacing:.1em;font-size:.62rem;color:rgba(241,239,229,.65)}.potion-card details p{margin:.65rem 0 0;color:#ddbfa4}
.card-order{display:flex;gap:.55rem;margin-top:1.2rem}.card-order a{flex:1;text-align:center;border:1px solid rgba(209,231,159,.42);color:var(--lime);padding:.65rem .5rem;text-transform:uppercase;letter-spacing:.08em;font-size:.62rem;font-weight:600;transition:.2s}.card-order a:hover,.card-order a:focus-visible{background:var(--lime);color:var(--ink);border-color:var(--lime)}
.empty-state{text-align:center;border:1px solid var(--line);padding:5rem 2rem}.empty-state span{font-size:4rem;color:var(--gold)}.empty-state h3{font-size:2.3rem;margin:1rem}.empty-state p{color:rgba(241,239,229,.6)}
.blend-card{min-height:450px;margin-top:1.5rem;border:1px solid var(--line);display:grid;grid-template-columns:90px minmax(150px,.55fr) 1fr;align-items:stretch;position:relative;overflow:hidden}
.blend-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 35% 50%,rgba(118,151,94,.24),transparent 30%);pointer-events:none}
.blend-card.lightning:before{background:radial-gradient(circle at 35% 50%,rgba(208,169,95,.20),transparent 30%)}
.blend-index{border-right:1px solid var(--line);writing-mode:vertical-rl;text-transform:uppercase;letter-spacing:.2em;font-size:.7rem;padding:2rem;text-align:center}
.blend-icon{display:grid;place-items:center;font-family:Italiana;font-size:clamp(7rem,14vw,13rem);color:var(--lime);opacity:.85}.lightning .blend-icon{color:var(--gold)}
.blend-content{padding:5rem 6vw 4rem;border-left:1px solid var(--line);position:relative}.blend-content h3{font-size:clamp(4.2rem,7vw,7.5rem);margin:.5rem 0 1.5rem}.blend-content>p:not(.blend-kicker){max-width:650px;color:rgba(241,239,229,.72)}
.blend-notes{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:2rem}.blend-notes span{border:1px solid var(--line);border-radius:99px;padding:.35rem .8rem;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}
.ritual{background:var(--moss);padding:8rem 9vw;display:grid;grid-template-columns:1fr 1.1fr;gap:8vw}.steps{list-style:none;margin:0;padding:0}.steps li{display:grid;grid-template-columns:55px 1fr;gap:1rem;border-top:1px solid var(--line);padding:1.5rem 0}.steps li:last-child{border-bottom:1px solid var(--line)}.steps span{font-size:.7rem;color:var(--lime);letter-spacing:.12em}.steps h3{font-size:2rem;margin-bottom:.25rem}.steps p{margin:0;color:rgba(241,239,229,.68)}
.connect{text-align:center;padding:10rem 7vw;background:var(--plum);position:relative}.connect>p:not(.section-number){max-width:680px;margin:2rem auto 2.5rem;color:rgba(241,239,229,.76)}.button-light{background:var(--cream);color:var(--ink);border-color:var(--cream)}.order-actions{display:flex;justify-content:center;align-items:stretch;gap:.8rem;flex-wrap:wrap}.order-actions .button{justify-content:center;min-width:190px}.button-soon{opacity:.48;cursor:not-allowed}.button-soon:hover{background:transparent;color:var(--cream);border-color:rgba(241,239,229,.42);transform:none}.order-contact{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin-top:2rem;color:rgba(241,239,229,.7);font-size:.82rem}.order-contact a{border-bottom:1px solid transparent}.order-contact a:hover{color:var(--lime);border-color:currentColor}.order-contact span{color:var(--gold)}
footer{padding:3rem 5vw;display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:start;color:rgba(241,239,229,.62);font-size:.75rem}.footer-brand{font-family:Italiana;font-size:1.4rem;color:var(--cream)}.fine-print{grid-column:2;max-width:650px;margin:0}
.potion-dialog{width:min(1120px,96vw);max-height:94vh;padding:0;border:1px solid rgba(209,231,159,.35);background:#131c17;color:var(--cream);box-shadow:0 30px 90px rgba(0,0,0,.65);overflow:auto}.potion-dialog::backdrop{background:rgba(2,7,4,.82);backdrop-filter:blur(7px)}.dialog-close{position:sticky;top:1rem;float:right;z-index:3;margin:1rem 1rem 0 0;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:rgba(16,23,19,.88);color:var(--cream);font-size:1.6rem;line-height:1;cursor:pointer}.dialog-close:hover,.dialog-close:focus-visible{background:var(--lime);color:var(--ink);outline:0}.detail-hero{display:grid;grid-template-columns:minmax(360px,1.05fr) 1fr;gap:2.5rem;align-items:center;padding:3rem}.detail-image{width:100%;aspect-ratio:1;object-fit:cover;border:1px solid rgba(209,231,159,.26);box-shadow:0 18px 45px rgba(0,0,0,.3)}.detail-sigil{font-family:Italiana,serif;color:var(--gold);font-size:11rem;text-align:center}.detail-hero .potion-category{margin-top:0}.detail-hero h2{font-size:clamp(3.5rem,7vw,6.5rem);margin-bottom:1rem}.detail-purpose{color:var(--lime);font-weight:600}.detail-hero div>p:last-child{color:rgba(241,239,229,.72)}.detail-section,.detail-blessing{padding:2.5rem 4rem;border-top:1px solid var(--line)}.detail-label{text-transform:uppercase;letter-spacing:.2em;color:var(--lime);font-size:.67rem;font-weight:600;margin:0 0 1rem}.ingredient-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}.ingredient-list li{background:#131c17;padding:1rem}.ingredient-list li:last-child:nth-child(odd){grid-column:1/-1}.ingredient-list strong,.ingredient-list span{display:block}.ingredient-list strong{color:var(--gold)}.ingredient-list span{font-size:.8rem;color:rgba(241,239,229,.62);margin-top:.25rem}.safety{background:#301f24;border-top-color:rgba(221,191,164,.35)}.safety .detail-label{color:#f0caaa}.safety small{display:block;color:rgba(241,239,229,.6);margin-top:1rem}.detail-blessing{background:var(--cream);color:var(--ink);text-align:center;padding-top:3.5rem;padding-bottom:3.5rem}.detail-blessing .detail-label{color:#58724e}.detail-blessing>p:last-child{font-family:Italiana,serif;font-size:1.35rem;line-height:1.65;max-width:680px;margin:0 auto}.detail-order{padding:2.5rem 4rem;display:flex;justify-content:space-between;gap:2rem;align-items:end}.detail-prices{display:flex;gap:1.2rem;flex-wrap:wrap}.detail-prices span{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}.detail-prices b{font-size:1rem;color:var(--lime)}.detail-order-links{display:flex;gap:.6rem}.detail-order-links a{border:1px solid var(--lime);color:var(--lime);padding:.8rem 1rem;text-transform:uppercase;letter-spacing:.08em;font-size:.65rem;font-weight:600}.detail-order-links a:hover{background:var(--lime);color:var(--ink)}
@media(max-width:1050px){.potion-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.portfolio-tools{grid-template-columns:1fr}.filters{justify-content:flex-start}}
@media(max-width:850px){.site-header{grid-template-columns:1fr auto;height:74px}.site-header nav{display:none}.manifesto{grid-template-columns:1fr;padding:6rem 7vw}.manifesto h2{margin-bottom:1rem}.section-heading{display:block}.section-heading>p{margin-top:1.5rem}.portfolio-tools{position:static}.blend-card{grid-template-columns:54px 1fr;min-height:0}.blend-index{grid-row:1/3}.blend-icon{min-height:260px}.blend-content{grid-column:2;padding:2.8rem 7vw;border-left:0;border-top:1px solid var(--line)}.ritual{grid-template-columns:1fr;padding:6rem 7vw}.steps{margin-top:1rem}footer{grid-template-columns:1fr}.fine-print{grid-column:1}}
@media(max-width:620px){.potion-grid{grid-template-columns:1fr}.potion-card{min-height:430px}.filters{gap:.4rem}.filter{font-size:.61rem;padding:.5rem .65rem}}
@media(max-width:700px){.detail-hero{grid-template-columns:1fr;padding:2rem}.detail-image{max-width:360px;margin:0 auto}.detail-section,.detail-blessing,.detail-order{padding:2rem}.ingredient-list{grid-template-columns:1fr}.detail-order{display:block}.detail-order-links{margin-top:1.5rem;flex-wrap:wrap}.detail-order-links a{flex:1;text-align:center}.dialog-close{top:.5rem;margin:.5rem .5rem 0 0}}
@media(max-width:520px){.header-link{display:none}.site-header{grid-template-columns:1fr}.hero-content{margin-left:7vw}.hero{min-height:730px}.hero-copy{font-size:.95rem}.vertical-note{display:none}h1{font-size:3.9rem}.section-heading h2,.manifesto h2,.ritual h2,.connect h2{font-size:3rem}.portfolio{padding-left:5vw;padding-right:5vw}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}}
.potion-card h3{font-family:Montserrat,Arial,sans-serif;font-size:clamp(1.7rem,2.35vw,2.5rem);font-weight:600;letter-spacing:-.035em;line-height:1.08}
.detail-hero h2{font-family:Montserrat,Arial,sans-serif;font-size:clamp(2.5rem,5vw,4.5rem);font-weight:600;letter-spacing:-.045em;line-height:1.02}
.detail-blessing>p:last-child{font-family:Gabriela,Georgia,serif;line-height:1.75}
