:root{
  --purple:#401A4B; --purple-deep:#270e30; --purple2:#5d2d6d;
  --green:#126F43; --green-d:#0d5532; --green-l:#e9f2ed;
  --cream:#F4ECE0; --cream-d:#ece0cf; --sandline:#e3d8c6; --amber:#e7c9a0;
  --ink:#1d1a22; --ink2:#5b5560; --muted:#968f9c;
  --line:#ece8ef; --line2:#e2dde6; --bg:#ffffff; --soft:#f7f5f9;
  --maxw:1200px;
  --serif:'Fraunces',Georgia,serif; --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--ink2);background:var(--bg);line-height:1.7;font-size:16px;-webkit-font-smoothing:antialiased}
img{max-width:100%}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
h1,h2,h3{font-family:var(--serif);color:var(--ink);font-weight:500;letter-spacing:-.01em;margin:0}
.eyebrow{font-family:var(--sans);text-transform:uppercase;letter-spacing:.22em;font-size:11.5px;font-weight:600;color:var(--green)}
a{color:inherit;text-decoration:none;cursor:pointer}
.skip{position:absolute;left:-9999px}
.skip:focus{position:fixed;left:12px;top:12px;background:#fff;color:var(--purple);padding:10px 16px;z-index:99;border-radius:8px}

/* header */
header.site{position:sticky;top:0;left:0;right:0;z-index:40;padding:12px 0;background:rgba(39,14,48,.94);backdrop-filter:blur(10px);box-shadow:0 6px 24px rgba(0,0,0,.18)}
header.site .wrap{display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{height:44px;width:auto;display:block}
.brand .wm{font-family:var(--serif);color:#fff;font-weight:600;font-size:19px;line-height:1.02;white-space:nowrap}
.brand .wm small{display:block;font-family:var(--sans);font-size:9px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--amber);margin-top:4px}
nav.main{margin-left:auto;display:flex;align-items:center;gap:4px}
nav.main>div{position:relative}
nav.main a.top{display:block;color:rgba(255,255,255,.86);font-size:13.5px;font-weight:500;padding:8px 12px;border-radius:8px;transition:.15s}
nav.main a.top:hover,nav.main a.top.active{color:#fff;background:rgba(255,255,255,.13)}
.dropdown{position:absolute;top:100%;left:0;background:#fff;min-width:265px;border-radius:14px;box-shadow:0 16px 44px rgba(29,26,34,.22);padding:10px;display:none;border:1px solid var(--sandline)}
nav.main>div:hover .dropdown,nav.main>div:focus-within .dropdown{display:block}
.dropdown a{display:block;padding:9px 13px;border-radius:9px;font-size:13.5px;color:var(--ink);font-weight:500}
.dropdown a:hover{background:var(--green-l);color:var(--green-d)}
.dropdown a small{display:block;color:var(--muted);font-size:11.5px;line-height:1.35;font-weight:400}
.cta-head{margin-left:6px}
.hamb{display:none;margin-left:auto;background:none;border:0;cursor:pointer;padding:8px}
.hamb span{display:block;width:24px;height:2px;background:#fff;margin:5px 0;border-radius:2px}

/* buttons */
.btn{display:inline-block;font-family:var(--sans);font-weight:600;font-size:14px;padding:12px 24px;border-radius:30px;border:none;cursor:pointer;transition:.18s;text-align:center}
.btn-green{background:var(--green);color:#fff}.btn-green:hover{background:var(--green-d)}
.btn-cream{background:var(--cream);color:var(--purple)}.btn-cream:hover{background:#fff}
.btn-ghost{background:transparent;border:1.5px solid rgba(255,255,255,.5);color:#fff}.btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.1)}
.btn-outline{background:transparent;border:1.5px solid var(--sandline);color:var(--purple)}.btn-outline:hover{border-color:var(--purple);background:var(--soft)}

/* hero (home) */
.hero{position:relative;min-height:88vh;display:flex;align-items:center;color:#fff;overflow:hidden}
.hero .bg{position:absolute;inset:0;background-size:cover;background-position:center}
.hero .veil{position:absolute;inset:0;background:linear-gradient(105deg,rgba(39,14,48,.93),rgba(64,26,75,.8) 42%,rgba(39,14,48,.35))}
.hero .wrap{position:relative;z-index:2;padding-top:96px;padding-bottom:110px}
.hero .eyebrow{color:var(--amber)}
.hero h1{color:#fff;font-size:clamp(38px,6vw,72px);line-height:1.02;margin:20px 0 22px;max-width:15ch}
.hero h1 em{font-style:italic;color:var(--amber)}
.hero p{font-size:clamp(16px,1.6vw,19px);color:rgba(255,255,255,.9);max-width:54ch;margin:0 0 32px}
.hero .actions{display:flex;gap:14px;flex-wrap:wrap}
.trust{position:absolute;left:0;right:0;bottom:0;z-index:2;border-top:1px solid rgba(255,255,255,.16);background:rgba(39,14,48,.5);backdrop-filter:blur(4px)}
.trust .wrap{display:flex;flex-wrap:wrap;gap:10px 28px;padding-top:15px;padding-bottom:15px}
.trust span{font-size:12.5px;color:rgba(255,255,255,.9);font-weight:500;display:inline-flex;gap:8px;align-items:center}
.trust span::before{content:"✦";color:var(--amber)}

/* sub-hero (inner pages) */
.subhero{padding:56px 0 8px}
.subhero.cream{background:var(--cream)}
.breadcrumb{font-size:12.5px;color:var(--muted);margin-bottom:14px}
.breadcrumb a:hover{color:var(--green)}
.subhero h1{font-size:clamp(30px,4.4vw,52px);line-height:1.05;margin:10px 0 14px}
.subhero .lede{font-size:18px;color:var(--ink2);max-width:60ch;margin:0 0 10px}
.subhero{padding-bottom:44px}
.sci{font-style:italic;color:var(--purple2);font-size:16px}

section.band{padding:84px 0}
.band.cream{background:var(--cream)} .band.soft{background:var(--soft)}
.band.deep{background:var(--purple-deep);color:rgba(255,255,255,.82)}
.band.deep h2,.band.deep h3{color:#fff}
.lead-row{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:42px}
h2{font-size:clamp(26px,3.4vw,40px);line-height:1.12}
.lead-row p{max-width:46ch;margin:0}
.band.deep .lead-row p{color:rgba(255,255,255,.74)}

/* quick answer (AEO) */
.qa{background:var(--green-l);border-left:3px solid var(--green);padding:18px 22px;border-radius:0 10px 10px 0;margin:24px 0;font-size:15.5px;color:var(--ink2)}
.qa strong{color:var(--green-d);font-weight:700}

/* badges */
.badges{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}
.cert{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line2);border-radius:8px;padding:8px 13px;font-size:12.5px;font-weight:600;color:var(--ink)}
.cert::before{content:"✓";color:var(--green);font-weight:800}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--sandline)}
.stats .s{padding:32px 24px 0 0}
.stats .s .n{font-family:var(--serif);font-size:clamp(38px,5vw,56px);font-weight:500;color:var(--purple);line-height:1}
.stats .s .l{font-size:13px;color:var(--ink2);margin-top:10px;max-width:22ch}

/* product tiles (home range) */
.range{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.tile{position:relative;border-radius:18px;overflow:hidden;min-height:330px;display:flex;align-items:flex-end;color:#fff;box-shadow:0 10px 30px rgba(29,26,34,.1);transition:.25s;background:var(--purple)}
.tile:hover{transform:translateY(-5px);box-shadow:0 20px 44px rgba(29,26,34,.2)}
.tile img.img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:.4s}
.tile:hover img.img{transform:scale(1.06)}
.tile .grad{position:absolute;inset:0;background:linear-gradient(to top,rgba(29,14,35,.9) 6%,rgba(29,14,35,.25) 55%,rgba(29,14,35,.05))}
.tile .c{position:relative;z-index:2;padding:24px;width:100%}
.tile .idx{font-family:var(--serif);font-size:14px;color:var(--amber)}
.tile h3{color:#fff;font-size:22px;margin:6px 0}
.tile p{font-size:13.5px;color:rgba(255,255,255,.85);margin:0}
.tile .go{margin-top:12px;font-size:12.5px;letter-spacing:.04em;color:#fff;font-weight:600}
.tile .ill{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-top:8px}

/* split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.split .media{border-radius:20px;min-height:440px;background-size:cover;background-position:center;box-shadow:0 18px 44px rgba(29,26,34,.16)}
.point{display:flex;gap:14px;margin:18px 0;align-items:flex-start}
.point .dot{flex:none;width:34px;height:34px;border-radius:50%;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;margin-top:2px}
.point h3{font-family:var(--sans);font-weight:600;font-size:16px;color:var(--ink);margin:0 0 3px}
.point p{margin:0;font-size:14.5px}

/* deep quality */
.qgrid{display:grid;grid-template-columns:1.1fr .9fr;gap:54px;align-items:center}
.qstats{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.qcard{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:24px}
.qcard .n{font-family:var(--serif);font-size:32px;color:#fff;line-height:1}
.qcard .l{font-size:13px;color:rgba(255,255,255,.72);margin-top:8px}
.pills{display:flex;flex-wrap:wrap;gap:9px;margin-top:8px}
.pill-w{font-size:12.5px;border:1px solid rgba(255,255,255,.28);color:#fff;padding:7px 14px;border-radius:30px}

/* catalog */
.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:8px 0 30px}
.chip{font-family:var(--sans);font-size:13px;font-weight:600;padding:9px 16px;border-radius:30px;border:1.5px solid var(--line2);background:#fff;color:var(--ink2);cursor:pointer;transition:.15s}
.chip:hover{border-color:var(--green)}
.chip.active{background:var(--purple);border-color:var(--purple);color:#fff}
.search{margin-left:auto;position:relative}
.search input{font-family:var(--sans);font-size:14px;padding:10px 16px 10px 38px;border:1.5px solid var(--line2);border-radius:30px;width:240px;outline:none;transition:.15s}
.search input:focus{border-color:var(--green)}
.search::before{content:"⌕";position:absolute;left:14px;top:8px;font-size:18px;color:var(--muted)}
.catalog{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pcard{background:#fff;border:1px solid var(--line2);border-radius:16px;overflow:hidden;cursor:pointer;transition:.2s;display:flex;flex-direction:column}
.pcard:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(29,26,34,.13);border-color:var(--sandline)}
.pcard img.img{height:160px;width:100%;object-fit:cover;background:var(--soft)}
.pcard .b{padding:18px 20px;flex:1;display:flex;flex-direction:column}
.pcard .type{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--green)}
.pcard h3{font-size:19px;margin:6px 0 4px}
.pcard .sci{font-size:12.5px;margin-bottom:8px}
.pcard .tag{margin-top:auto;font-size:12.5px;color:var(--ink2);background:var(--soft);border-radius:8px;padding:7px 10px}
.count-note{font-size:13px;color:var(--muted);margin:-16px 0 22px}

/* product detail */
.pdlayout{display:grid;grid-template-columns:1.35fr .65fr;gap:42px;align-items:start}
table.spec{width:100%;border-collapse:collapse;font-size:14px;background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden;margin:12px 0}
table.spec th{font-family:var(--sans);background:var(--cream);color:var(--purple);text-align:left;padding:11px 14px;font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--sandline)}
table.spec td{padding:11px 14px;border-bottom:1px solid var(--line);color:var(--ink2)}
table.spec td:first-child{color:var(--ink);font-weight:500}
table.spec tr:last-child td{border-bottom:none}
table.spec tbody tr:nth-child(even){background:#fbfaf7}
table.spec.facts td:first-child{width:32%}
.tbc{color:#8a6320;background:#f6ebd9;border-radius:6px;padding:1px 8px;font-size:12.5px;white-space:nowrap}
.pd h2{font-size:23px;margin:30px 0 6px}
.sticky{position:sticky;top:96px;background:var(--cream);border:1px solid var(--sandline);border-radius:16px;padding:24px}
.sticky h3{font-size:20px;margin:0 0 6px}
.sticky .btn{width:100%;margin:5px 0}
.sticky ul{margin:14px 0 0;padding-left:18px;font-size:13.5px}
.sticky li{margin-bottom:6px}
.banner{border-radius:16px;width:100%;aspect-ratio:10/4.6;object-fit:cover;margin:18px 0 0;box-shadow:0 14px 36px rgba(29,26,34,.14);background:var(--soft)}
.note{font-size:12.5px;color:var(--muted);font-style:italic}

/* cards generic */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.card{background:#fff;border:1px solid var(--line2);border-radius:14px;padding:24px;transition:.2s}
a.card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(29,26,34,.12);border-color:var(--sandline)}
.card h3{font-size:18px;margin:0 0 6px}.card p{margin:0;font-size:14.5px}
.card .go{display:inline-block;margin-top:12px;font-size:12.5px;font-weight:600;color:var(--green)}
.timeline{border-left:2px solid var(--sandline);margin:18px 0;padding-left:24px}
.timeline .t{position:relative;margin:0 0 22px}
.timeline .t::before{content:"";position:absolute;left:-31px;top:5px;width:12px;height:12px;border-radius:50%;background:var(--green);border:2px solid #fff;box-shadow:0 0 0 1px var(--sandline)}
.timeline .yr{font-family:var(--serif);font-weight:600;color:var(--purple);font-size:18px}
.logotext{display:flex;flex-wrap:wrap;gap:10px 34px;align-items:center;justify-content:center;font-family:var(--serif);font-size:17px;color:var(--muted)}

/* faq */
details.faq{background:#fff;border:1px solid var(--line2);border-radius:14px;margin-bottom:12px;padding:0 22px}
details.faq summary{font-family:var(--serif);font-weight:500;color:var(--ink);font-size:17px;padding:17px 0;cursor:pointer;list-style:none;position:relative;padding-right:34px}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary:after{content:"+";position:absolute;right:2px;top:12px;font-size:22px;color:var(--green);font-weight:400}
details.faq[open] summary:after{content:"–"}
details.faq .a{padding:0 0 18px;font-size:14.5px}

/* cta */
.ctaband{background:var(--green);color:#fff;border-radius:24px;padding:56px;text-align:center}
.ctaband h2{color:#fff;max-width:22ch;margin:0 auto 12px}
.ctaband p{color:rgba(255,255,255,.9);max-width:48ch;margin:0 auto 26px}

/* form */
form.contact{display:grid;grid-template-columns:1fr 1fr;gap:16px}
form.contact .full{grid-column:1/-1}
label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:6px}
input,select,textarea{font-family:var(--sans);font-size:14px;width:100%;padding:12px 14px;border:1.5px solid var(--line2);border-radius:10px;outline:none;background:#fff;transition:.15s}
input:focus,select:focus,textarea:focus{border-color:var(--green)}
textarea{min-height:130px;resize:vertical}

/* blog */
article.post{max-width:760px;margin:0 auto}
article.post h1{font-size:clamp(28px,4vw,44px);line-height:1.08}
article.post h2{font-size:26px;margin:34px 0 10px}
article.post p{margin:0 0 16px}
article.post ul{margin:0 0 18px}
article.post li{margin-bottom:7px}
.post-meta{font-size:13px;color:var(--muted);margin:14px 0 26px}

/* footer */
footer.site{background:var(--purple-deep);color:rgba(255,255,255,.66);padding:62px 0 32px;font-size:14px}
footer.site .brand{margin-bottom:16px}
footer.site .brand img{height:48px}
footer.site .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:40px}
footer.site strong{display:block;color:#fff;font-size:13px;letter-spacing:.04em;text-transform:uppercase;margin-bottom:14px;font-weight:600}
footer.site a{display:block;color:rgba(255,255,255,.78);margin:8px 0}footer.site a:hover{color:#fff}
footer.site p{margin:0 0 12px}
footer.site .certline{color:rgba(255,255,255,.45);font-size:12px;line-height:1.6}
footer.site .base{border-top:1px solid rgba(255,255,255,.14);margin-top:42px;padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12.5px}

@media(max-width:900px){
  .brand .wm{display:none}
  nav.main{display:none;position:fixed;inset:68px 0 auto 0;background:var(--purple-deep);flex-direction:column;align-items:stretch;padding:16px 20px 26px;gap:2px;max-height:calc(100vh - 68px);overflow:auto;box-shadow:0 24px 40px rgba(0,0,0,.4);z-index:50}
  nav.main.open{display:flex}
  .dropdown{display:block;position:static;background:transparent;border:0;box-shadow:none;padding:0 0 6px 16px;min-width:0}
  .dropdown a{color:rgba(255,255,255,.85)}
  .dropdown a small{color:rgba(255,255,255,.45)}
  .dropdown a:hover{background:rgba(255,255,255,.07);color:#fff}
  .hamb{display:block}
  .cta-head{display:none}
  .hero{min-height:72vh}
  .stats{grid-template-columns:1fr 1fr;gap:22px 0}
  .range,.catalog,.grid3{grid-template-columns:1fr 1fr}
  .split,.qgrid,.pdlayout,.grid2,.grid4{grid-template-columns:1fr;gap:30px}
  .split .media{min-height:280px}
  .qstats{grid-template-columns:1fr 1fr}
  footer.site .cols{grid-template-columns:1fr 1fr}
  section.band{padding:56px 0}.ctaband{padding:38px 22px}
  .search{margin-left:0;width:100%}.search input{width:100%}
  .sticky{position:static}
}
@media(max-width:620px){
  .range,.catalog,.grid3{grid-template-columns:1fr}
  form.contact{grid-template-columns:1fr}
  footer.site .cols{grid-template-columns:1fr}
  .subhero{padding-top:40px}
}