:root{--ink:#2a1a12;--cream:#fff7ed;--sand:#ffedd5;--rust:#c2410c;--deep:#431407;--teal:#0f766e;--r:18px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:1.05rem/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--cream)}
a{color:inherit}
:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
.skip{position:absolute;left:-999px;background:#fff;padding:.5rem 1rem;z-index:10}.skip:focus{left:0}
.nav{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:.5rem;flex-wrap:wrap;padding:.6rem 1rem;background:rgba(255,247,237,.92);backdrop-filter:blur(8px);border-bottom:1px solid #fed7aa}
.brand{font-weight:800;text-decoration:none;color:var(--rust)}
.nav nav{display:flex;gap:.9rem;overflow-x:auto;font-size:.95rem}
.nav nav a{text-decoration:none;padding:.3rem 0;white-space:nowrap}
.hero{position:relative;overflow:hidden;color:#fff;text-align:center;background:linear-gradient(180deg,#f59e0b 0%,#ea580c 45%,#9a3412 100%);padding:3rem 1rem 9rem}
.sun{position:absolute;width:260px;height:260px;border-radius:50%;left:50%;top:38%;transform:translateX(-50%);background:radial-gradient(circle,#fde68a,#fbbf2400 70%);opacity:.8}
.mtn{position:absolute;bottom:-1px;left:0;width:100%;height:150px}
.hero-in{position:relative;max-width:640px;margin:auto}
.avatar,.about-photo{background:linear-gradient(135deg,#fde68a,#f97316 55%,#0f766e);background-size:cover;background-position:center}
.avatar{width:264px;height:264px;max-width:70vw;max-height:70vw;overflow:hidden;border-radius:50%;margin:0 auto 1rem;border:4px solid #fff;display:grid;place-items:center;font-weight:800;font-size:2.4rem;box-shadow:0 8px 24px #0004}
.avatar.has-photo span{display:none}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;font-weight:700;margin:0}
h1{font-size:clamp(2.6rem,10vw,4.5rem);line-height:1.05;margin:.2rem 0 .5rem}
.tag{font-size:1.2rem;margin:0 0 1.2rem}
.btn{display:inline-block;background:#fff;color:var(--deep);font-weight:700;padding:.8rem 1.4rem;border-radius:99px;text-decoration:none;min-height:44px}
.btn:hover{transform:translateY(-2px)}
.btn.disabled{opacity:.6;pointer-events:none}
.wrap{padding:3rem 1rem;max-width:960px;margin:auto}
.alt{max-width:none;background:var(--sand)}.alt>*{max-width:960px;margin-left:auto;margin-right:auto}
h2{font-size:1.9rem;margin:0 0 1.2rem;color:var(--deep)}
.grid{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.social{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.cards{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.tile,.card{display:block;position:relative;height:100%;background:#fff;border-radius:var(--r);padding:1.1rem 1.2rem;text-decoration:none;border:1px solid #fed7aa;box-shadow:0 2px 8px #7c2d1210;transition:transform .15s,box-shadow .15s}
a.tile:hover,a.card:hover{transform:translateY(-3px);box-shadow:0 8px 20px #7c2d1225}
.tile{min-height:84px;border-left:8px solid var(--rust)}
.tile strong{display:block;font-size:1.2rem}.tile span:not(.badge){opacity:.75;font-size:.95rem}
.s-tiktok{border-left-color:#111}.s-youtube{border-left-color:#dc2626}.s-facebook{border-left-color:#2563eb}.s-instagram{border-left-color:#c026d3}
.card h3{margin:.4rem 0}.card p{margin:.2rem 0 .8rem;opacity:.85}
.tagchip{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--teal)}
.code{font-weight:700}.go{color:var(--rust);font-weight:700}
.is-placeholder{border-style:dashed;background:#fffaf3}
.badge{position:absolute;top:.7rem;right:.7rem;font-size:.7rem;font-weight:700;background:#fde68a;color:#78350f;padding:.15rem .55rem;border-radius:99px}
.card .badge{position:static;display:inline-block}
.disc{font-size:.92rem;background:#fff;border-left:4px solid var(--teal);padding:.7rem 1rem;border-radius:8px}
.yt{display:grid;gap:1.2rem;align-items:center}
.yt-media{aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:linear-gradient(135deg,#1c1917,#7c2d12);display:grid;place-items:center;position:relative}
.yt-media iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.play{width:72px;height:72px;border-radius:50%;background:#dc2626;position:relative}
.play::after{content:"";position:absolute;left:29px;top:21px;border:15px solid transparent;border-left:25px solid #fff}
.yt-load{font:inherit;font-weight:700;background:#dc2626;color:#fff;border:0;border-radius:99px;padding:.9rem 1.5rem;cursor:pointer}
.about{display:grid;gap:1.2rem;align-items:center}
.about-photo{aspect-ratio:9/12;max-height:520px;width:100%;max-width:340px;margin:auto;border-radius:var(--r);box-shadow:0 8px 24px #7c2d1230}
footer{background:var(--deep);color:#fed7aa;text-align:center;padding:3rem 1rem}
.big{font-size:1.6rem;font-weight:800;color:#fff;margin:.2rem 0}
.foot-links a{margin:0 .6rem}.small{font-size:.85rem;opacity:.7}
@media(min-width:720px){.yt,.about{grid-template-columns:1.2fr 1fr}.nav nav{gap:1.4rem}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.ctas{display:flex;gap:.7rem;justify-content:center;flex-wrap:wrap}
.btn.ghost{background:transparent;color:#fff;border:2px solid #fff}
.btn.dark{background:var(--deep);color:#fff}
.note{font-size:.95rem;opacity:.8}
.card .badge{margin-top:0}
.card .tagchip{display:block}

/* card images */
.cards{grid-template-columns:repeat(auto-fill,minmax(min(100%,160px),1fr))}
.card{padding:0;overflow:hidden;display:flex;flex-direction:column}
.card-body{padding:.8rem 1rem 1rem;display:flex;flex-direction:column;flex:1}
.card-body .go,.card-body .badge{margin-top:auto}
.card h3{font-size:1.05rem;line-height:1.3}
.card p{font-size:.92rem}
.card-media{aspect-ratio:4/3;background:#f5e6d3;overflow:hidden}
.card-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
a.card:hover .card-media img{transform:scale(1.04)}
.card-media.fallback{display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#f59e0b,#c2410c)}
.icon-drop{background:linear-gradient(135deg,#5eead4,#0f766e)!important}
.icon-star{background:linear-gradient(135deg,#fcd34d,#d97706)!important}
.icon-hair{background:linear-gradient(135deg,#f9a8d4,#be185d)!important}
.icon-ribbon{background:linear-gradient(135deg,#fdba74,#9a3412)!important}
.icon-spark{background:linear-gradient(135deg,#a5b4fc,#4338ca)!important}
.icon-car{background:linear-gradient(135deg,#9ca3af,#1f2937)!important}
@media(min-width:720px){.cards{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}}
.alt>.grid{margin-left:auto;margin-right:auto}
.card-media.logo{background:#fff;padding:12% 0;border-bottom:1px solid #fde7cf}
.card-media.logo img{object-fit:contain}
.card-media.square{aspect-ratio:1/1;background:#fff}

/* awareness & press */
.aware{max-width:none;background:#ecfdf5}.aware>*{max-width:960px;margin-left:auto;margin-right:auto}
.aware>.grid{margin-left:auto;margin-right:auto}
h3.sub{font-size:1.15rem;color:var(--teal);margin:1.6rem auto .8rem;text-transform:uppercase;letter-spacing:.06em}
h2+h3.sub{margin-top:0}
.store{display:grid;grid-template-columns:1fr;margin-top:1.2rem;background:#fff;border-radius:var(--r);overflow:hidden;text-decoration:none;border:2px solid var(--teal);box-shadow:0 6px 18px #0f766e22}
.store img{width:100%;aspect-ratio:1199/630;object-fit:cover;display:block}
.store-body{padding:1rem 1.2rem}.store-body strong{display:block;font-size:1.25rem;margin:.2rem 0}.store-body p{margin:.2rem 0 .7rem;opacity:.85}
a.store:hover{transform:translateY(-2px)}
.res{list-style:none;padding:0;display:grid;gap:.6rem}
.res a{display:flex;align-items:center;gap:.8rem;background:#fff;border-radius:12px;padding:.5rem .8rem .5rem .5rem;text-decoration:none;border:1px solid #a7f3d0;min-height:64px}
.res img{width:72px;height:54px;object-fit:cover;border-radius:8px;flex:none}
.res-t{flex:1;display:flex;flex-direction:column;line-height:1.3}.res-t span{font-size:.85rem;opacity:.7}
.res .go{color:var(--teal);font-weight:700}
.shopmy{margin:0 0 1.2rem}.ctas.left{justify-content:flex-start}
.btn.outline{background:#fff;color:var(--deep);border:2px solid var(--deep)}
@media(min-width:720px){.store{grid-template-columns:1.1fr 1fr;align-items:center}.res{grid-template-columns:1fr 1fr}}

/* ---- UX pass ---- */
section[id]{scroll-margin-top:64px}
.nav{flex-wrap:nowrap;min-height:56px}
.brand{font-size:1.05rem;padding:.5rem 0}
.menu-btn{display:inline-flex;align-items:center;gap:.5rem;font:inherit;font-weight:700;color:var(--deep);background:#fff;border:1px solid #fed7aa;border-radius:99px;padding:.55rem 1rem;min-height:44px;cursor:pointer}
.bars,.bars::before,.bars::after{display:block;width:18px;height:2px;background:currentColor;border-radius:2px;position:relative}
.bars::before,.bars::after{content:"";position:absolute;left:0}.bars::before{top:-6px}.bars::after{top:6px}
.nav nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:var(--cream);border-bottom:1px solid #fed7aa;box-shadow:0 10px 20px #7c2d1220;padding:.3rem 0}
.nav nav.open{display:flex}
.nav nav a{padding:.85rem 1.2rem;font-size:1.05rem;font-weight:600;border-top:1px solid #fde7cf}
.nav nav a:hover{color:var(--rust)}
@media(min-width:820px){
  .menu-btn{display:none}
  .nav nav{display:flex;position:static;flex-direction:row;background:none;border:0;box-shadow:none;padding:0;gap:.3rem}
  .nav nav a{border:0;padding:.6rem .7rem;font-size:.98rem;border-radius:99px}
  .nav nav a:hover{background:#ffedd5}
}
.hero{padding:2.2rem 1rem 7.5rem}
@media(min-width:720px){.hero{padding:3rem 1rem 9rem}}
.ctas .btn{min-width:120px;text-align:center}
.wrap{padding:2.6rem 1.1rem}
@media(min-width:720px){.wrap{padding:3.5rem 1.5rem}}
h2{font-size:clamp(1.6rem,6vw,2rem);line-height:1.2}
.note{margin:-.6rem 0 1rem}
.btn{display:inline-flex;align-items:center;justify-content:center}
.cards.wide{grid-template-columns:1fr}
@media(min-width:600px){.cards.wide{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.cards.wide{grid-template-columns:repeat(3,1fr)}}
.card-body .go{padding-top:.3rem}
.card h3{overflow-wrap:anywhere}
/* footer links: pills that wrap neatly */
.foot-links{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;max-width:560px;margin:1rem auto}
.foot-links a{margin:0;padding:.55rem 1rem;min-height:44px;display:inline-flex;align-items:center;border:1px solid #fed7aa66;border-radius:99px;text-decoration:none;color:#fff;white-space:nowrap}
.foot-links a:hover{background:#ffffff1a}
#contact a{display:inline-block;padding:.6rem 0;color:#fff;font-weight:700}

/* ---- simplicity pass ---- */
.shopmy{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.2rem;margin:0 0 1.4rem}
.textlink{color:var(--deep);font-weight:700;padding:.7rem 0;min-height:44px;display:inline-flex;align-items:center}
.disc{background:none;border:0;padding:0;margin:1.4rem 0 0;font-size:.85rem;opacity:.7;text-align:center}
.card .tagchip{font-size:.7rem;letter-spacing:.06em}
.card-body p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.store{border:1px solid #fed7aa;box-shadow:0 2px 8px #7c2d1210}
.store .tagchip{color:var(--rust)}
.res a{border-color:#fed7aa}.res .go{color:var(--rust)}
h3.sub{color:var(--deep);font-size:1rem;letter-spacing:.08em;opacity:.8}
.hero .ctas .btn{min-width:180px}
@media(max-width:599px){
  .cards.wide .card{flex-direction:row;align-items:stretch}
  .cards.wide .card-media{flex:0 0 112px;aspect-ratio:auto;min-height:112px}
  .cards.wide .card-body{padding:.7rem .9rem}
  .cards.wide .card-body p{-webkit-line-clamp:2}
}
.store img{height:auto;aspect-ratio:16/9}
@media(min-width:720px){.store img{height:100%;min-height:240px}}
.social{grid-template-columns:repeat(2,1fr)}
@media(min-width:720px){.social{grid-template-columns:repeat(4,1fr)}}
.tile{padding:.9rem 1rem;min-height:76px}.tile strong{font-size:1.1rem}.tile span:not(.badge){font-size:.85rem;overflow-wrap:anywhere}
.card h3{overflow-wrap:normal;word-break:normal;hyphens:manual;font-size:clamp(.92rem,3.7vw,1.05rem)}
@media(min-width:720px){.about{grid-template-columns:340px 1fr;gap:2.5rem;max-width:860px}.about-photo{margin:0}}
.alt>.shopmy,.wrap>.shopmy{margin:0 auto 1.4rem}
.alt>.disc{margin:1.4rem auto 0}
.alt>.note{margin:-.6rem auto 1rem}
.card-media.logo{padding:12% 16%}

/* ---- legal pass ---- */
.card-media.fallback{background:#fdf2e6!important;color:var(--rust)}
.card-media.logo{background:#fff}
.store .card-media{aspect-ratio:16/9}
@media(min-width:720px){.store .card-media{aspect-ratio:auto;height:100%;min-height:200px}}
.res-i{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#fdf2e6;color:var(--rust)}
.disc-top{font-size:.9rem;color:#5b4636;background:#fff;border:1px solid #fed7aa;border-radius:12px;padding:.65rem .9rem;margin:-.4rem auto 1.1rem}
.alt>.disc-top{margin:-.4rem auto 1.1rem}
#healthNote{font-size:.9rem;color:#5b4636}
.legal{font-size:.78rem;opacity:.65;max-width:520px;margin:1.2rem auto .3rem;line-height:1.5}
.legal a{color:#fff;text-decoration:underline;white-space:nowrap}
.legal a{display:inline-block;padding:.75rem .4rem;margin:-.5rem 0}
@media(min-width:600px){.cards.wide .card-media.fallback{aspect-ratio:16/6}}
@media(min-width:720px){.store{grid-template-columns:200px 1fr}.store .card-media{min-height:160px}}
@media(min-width:600px){.cards.wide .card-media.fallback{aspect-ratio:4/3}}
@media(max-width:719px){.store .card-media{aspect-ratio:16/5}}

/* hero photo (wide) */
.hero-photo{display:block;width:min(100%,780px,calc(46vh * 1.512));height:auto;aspect-ratio:1600/1058;margin:0 auto 1.1rem;border-radius:18px;border:3px solid #fff;box-shadow:0 10px 30px #0005;background:#f5e6d3}
@media(max-width:719px){.hero{padding-top:1.2rem}.hero-photo{border-radius:14px;margin-bottom:.9rem}}

/* featured video */
.video-sec{padding:1.6rem 1rem .4rem;max-width:none}
.vid{position:relative;width:min(100%,780px);margin:0 auto;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#1c1917;box-shadow:0 8px 24px #7c2d1226}
.vid iframe,.vid-btn{position:absolute;inset:0;width:100%;height:100%;border:0}
.vid-btn{padding:0;cursor:pointer;background:none;display:block}
.vid-btn img{width:100%;height:100%;object-fit:cover;display:block}
.vid-btn::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,#0009)}
.vid-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;transition:transform .15s}
.vid-btn:hover .vid-play,.vid-btn:focus-visible .vid-play{transform:translate(-50%,-50%) scale(1.08)}
.vid-title{position:absolute;left:1rem;right:1rem;bottom:.8rem;z-index:1;color:#fff;font-weight:700;font-size:clamp(.9rem,3.6vw,1.05rem);text-align:left;line-height:1.3;text-shadow:0 1px 3px #0008}
.vid-more{width:min(100%,780px);margin:.6rem auto 0;text-align:right;font-size:.92rem}
.vid-more a{color:var(--rust);font-weight:700;text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
@media(min-width:720px){.video-sec{padding:2.4rem 1.5rem .6rem}}
.vid,.vid-more{width:min(100%,780px,calc(46vh * 1.512))}
@media(max-width:719px){.tile span:not(.badge){font-size:.74rem;overflow-wrap:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}}
.hero-in{max-width:800px}
