/*
 * The Hemp Collection — Niek's product-template stylesheet.
 *
 * GENERATED by scripts/port-hemp-collection.mjs from "Hemptex Product
 * Template.html". Do not edit by hand: change the template (or the script) and
 * re-run it.
 *
 * Every selector is scoped under `.hemp-collection` so this second, self-contained
 * design system cannot reach the Webflow-styled rest of the site — the template
 * styles `body`, `a`, `img`, `h1`-`h3` and `*` globally, and those
 * would otherwise repaint every page. `:root`, `html` and `body` rules
 * (custom properties included) land on the wrapper itself.
 *
 * The template's own loader, announcement bar, nav, footer and logo band are cut
 * out: this app's header and footer stay in charge of the page.
 */
/* ============================================================
   Hemptex® — Product page template · The Hemp Collection
   Tokens are canonical Brand Guide V2 values. Single-theme:
   the brand's oat-and-forest world, painted explicitly.
   ============================================================ */
.hemp-collection{
  --ht-shadow:0 10px 26px rgba(41,50,12,.10), 0 2px 6px rgba(41,50,12,.06);
  --ht-shadow-lift:0 16px 34px rgba(41,50,12,.14), 0 3px 8px rgba(41,50,12,.08);
  --ht-oat:#F4E9DC; --ht-paper:#FBF5EC; --ht-card:#FFFDF9;
  --ht-forest:#29320C; --ht-forest-soft:#3B4413;
  --ht-olive:#75742C; --ht-sage:#8C9A7E;
  --ht-apricot:#FEBC71; --ht-apricot-deep:#E89D4C;
  --ht-terra:#C66339;
  --ht-ink:#29320C; --ht-body:#41451F; --ht-muted:#7A7756;
  --ht-line:rgba(41,50,12,.16); --ht-line-strong:rgba(41,50,12,.85);
  --font-display:"Tilt Warp",system-ui,sans-serif;
  --font-body:"Manrope",system-ui,-apple-system,sans-serif;
  --pill:999px; --rad:16px; --rad-lg:24px;
  --ease:cubic-bezier(.22,1,.36,1);
}
.hemp-collection *,.hemp-collection *::before,.hemp-collection *::after{box-sizing:border-box}
.hemp-collection [hidden]{display:none!important}

.hemp-collection{margin:0;background:var(--ht-oat);color:var(--ht-body);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
.hemp-collection img{max-width:100%;display:block}
.hemp-collection a{color:var(--ht-terra);text-decoration:none}
.hemp-collection a:hover{text-decoration:underline}
.hemp-collection button{font-family:var(--font-body)}
.hemp-collection :focus-visible{outline:3px solid var(--ht-terra);outline-offset:2px}
.hemp-collection h1,.hemp-collection h2,.hemp-collection h3{font-family:var(--font-display);font-weight:400;color:var(--ht-ink);margin:0;line-height:1.08;text-wrap:balance}
.hemp-collection .eyebrow{font-family:var(--font-body);font-weight:800;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ht-terra)}
.hemp-collection .wrap{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.hemp-collection .pillbtn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:2px solid var(--ht-forest);border-radius:var(--pill);background:var(--ht-apricot);color:var(--ht-forest);font-family:var(--font-display);font-size:1rem;padding:16px 30px;cursor:pointer;transition:transform .15s var(--ease),background .15s var(--ease)}
.hemp-collection .pillbtn:hover{transform:translateY(-2px);background:var(--ht-apricot-deep);text-decoration:none}
.hemp-collection .pillbtn.ghost{background:transparent;color:var(--ht-forest)}
.hemp-collection .pillbtn.ghost:hover{background:rgba(41,50,12,.06)}
@media (prefers-reduced-motion:reduce){.hemp-collection *{animation:none!important;transition:none!important}.hemp-collection{scroll-behavior:auto}}

/* ---------- chrome ---------- */

























.hemp-collection .crumb{font-size:.85rem;font-weight:600;color:var(--ht-muted);margin:10px 0 26px}
.hemp-collection .crumb b{color:var(--ht-ink);font-weight:700}

/* ---------- hero grid ---------- */
.hemp-collection .pdp-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(28px,4vw,60px);align-items:start}
@media(max-width:900px){.hemp-collection .pdp-grid{grid-template-columns:1fr}}

/* gallery */
.hemp-collection .gal{position:sticky;top:20px;display:grid;grid-template-columns:78px minmax(0,1fr);gap:12px 14px;align-items:start}
.hemp-collection .gal>p{grid-column:1/-1}
.hemp-collection .trustrow{grid-column:1/-1}
@media(max-width:900px){.hemp-collection .gal{position:static;display:block}}
.hemp-collection .gal-main{position:relative;grid-column:2;grid-row:1;border-radius:var(--rad-lg);overflow:hidden;aspect-ratio:4/5;max-height:calc(100vh - 190px);width:100%;background:var(--ht-paper);border:2px solid var(--ht-forest);box-shadow:var(--ht-shadow)}
@media(max-width:900px){.hemp-collection .gal-main{max-height:none}}
.hemp-collection .gal-main .pane{position:absolute;inset:0;opacity:0;transition:opacity .35s var(--ease)}
.hemp-collection .gal-main .pane.on{opacity:1}
.hemp-collection .gal-main .pane img{width:100%;height:100%;object-fit:cover}
.hemp-collection .gal-main .pane.art{display:flex;align-items:center;justify-content:center;background:
  radial-gradient(120% 90% at 50% 110%, rgba(254,188,113,.35), transparent 60%), var(--ht-paper)}
.hemp-collection .gal-main .pane.art svg{width:72%;height:auto;max-height:78%}
.hemp-collection .gal-badge{position:absolute;top:16px;left:16px;z-index:3;display:inline-flex;align-items:center;gap:7px;background:var(--ht-forest);color:var(--ht-oat);border-radius:var(--pill);padding:7px 14px;font-weight:700;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase}
.hemp-collection .gal-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:34px 22px 18px;background:linear-gradient(to top,rgba(41,50,12,.82),rgba(41,50,12,0));color:var(--ht-oat)}
.hemp-collection .gal-cap .s{font-weight:800;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ht-apricot);margin-bottom:5px}
.hemp-collection .gal-cap .t{font-family:var(--font-display);font-size:clamp(1.2rem,2.2vw,1.6rem);line-height:1.1}
.hemp-collection .gal-main .pane.photo img{width:100%;height:100%;object-fit:cover}
.hemp-collection .gal-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:44px;height:44px;border-radius:50%;border:2px solid var(--ht-forest);background:rgba(244,233,220,.92);color:var(--ht-forest);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--ht-shadow);transition:background .15s var(--ease)}
.hemp-collection .gal-nav:hover{background:var(--ht-apricot)}
.hemp-collection .gal-nav.prev{left:12px}
.hemp-collection .gal-nav.next{right:12px}
.hemp-collection .gal-thumbs{grid-column:1;grid-row:1;display:flex;flex-direction:column;gap:10px;overflow-y:auto;max-height:calc(100vh - 190px);scrollbar-width:thin}
.hemp-collection .gal-thumbs button{flex:0 0 auto;width:100%;aspect-ratio:4/5;padding:0;border:2px solid var(--ht-line);border-radius:12px;overflow:hidden;background:var(--ht-paper);cursor:pointer;position:relative}
@media(max-width:900px){.hemp-collection .gal-thumbs{flex-direction:row;overflow-x:auto;overflow-y:hidden;max-height:none;margin-top:12px;padding-bottom:4px}.hemp-collection .gal-thumbs button{flex:0 0 72px;width:auto}}
.hemp-collection .gal-thumbs button[aria-pressed="true"]{border-color:var(--ht-terra)}
.hemp-collection .gal-thumbs img{width:100%;height:100%;object-fit:cover}
.hemp-collection .gal-thumbs .artthumb{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.hemp-collection .gal-thumbs .artthumb svg{width:70%;height:auto}
.hemp-collection .gal-thumbs .slot-empty{display:flex;align-items:center;justify-content:center;width:100%;height:100%;border:2px dashed var(--ht-line);border-radius:10px;margin:-2px;font-weight:700;font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ht-muted);text-align:center;padding:8px}
.hemp-collection .gal-thumbs .k{position:absolute;left:5px;bottom:5px;right:5px;font-weight:800;font-size:.55rem;letter-spacing:.08em;text-transform:uppercase;text-align:center;border-radius:var(--pill);padding:3px 4px;pointer-events:none}
.hemp-collection .k-art{background:var(--ht-forest);color:var(--ht-oat)}
.hemp-collection .k-ai{background:var(--ht-terra);color:var(--ht-oat)}
.hemp-collection .k-real{background:var(--ht-olive);color:var(--ht-oat)}
.hemp-collection .trustrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.hemp-collection .trustrow span{display:inline-flex;align-items:center;gap:7px;border:2px solid var(--ht-line);border-radius:var(--pill);background:var(--ht-card);padding:7px 13px;font-weight:600;font-size:.78rem;color:var(--ht-body)}
.hemp-collection .trustrow span i{width:8px;height:8px;border-radius:50%;background:var(--ht-sage);flex:none}

/* buy box */
.hemp-collection .buy h1{font-size:clamp(2rem,4vw,2.9rem);margin:10px 0 14px}
.hemp-collection .buy .story{font-size:1.05rem;max-width:48ch;margin:0 0 22px}
.hemp-collection .pricebox{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.hemp-collection .pricebox .p{font-family:var(--font-display);font-size:2.3rem;color:var(--ht-ink)}
.hemp-collection .pricebox .vat{font-size:.85rem;color:var(--ht-muted)}
.hemp-collection .pricebox .was{font-size:.95rem;color:var(--ht-muted);text-decoration:line-through}
.hemp-collection .pledge-note{font-size:.85rem;color:var(--ht-olive);font-weight:700;margin:0 0 20px}

/* pre-order ring module */
.hemp-collection .ring-mod{display:flex;gap:20px;align-items:center;border:2px solid var(--ht-forest);border-radius:var(--rad-lg);background:var(--ht-card);padding:18px 20px;margin-bottom:24px;box-shadow:var(--ht-shadow)}
.hemp-collection .ring-mod svg{flex:none;width:112px;height:112px}
.hemp-collection .ring-mod .num{font-family:var(--font-display);font-size:1.5rem;fill:var(--ht-forest)}
.hemp-collection .ring-mod .den{font-weight:700;font-size:.7rem;letter-spacing:.04em;fill:var(--ht-muted)}
.hemp-collection .ring-mod h3{font-size:1.15rem;margin-bottom:6px}
.hemp-collection .ring-mod p{margin:0;font-size:.88rem;line-height:1.5}
.hemp-collection .ring-mod .honest{color:var(--ht-terra);font-weight:700}

/* volume pricing + savings */
.hemp-collection .savechip{display:inline-flex;align-items:center;border-radius:var(--pill);background:var(--ht-olive);color:var(--ht-oat);font-weight:800;font-size:.78rem;padding:6px 13px}
.hemp-collection .b2c-note{font-size:.82rem;color:var(--ht-muted);margin:-12px 0 20px}
.hemp-collection .stock-mod{display:flex;gap:16px;align-items:center;border:2px solid var(--ht-olive);border-radius:var(--rad-lg);background:var(--ht-card);padding:18px 20px;margin-bottom:24px;box-shadow:var(--ht-shadow)}
.hemp-collection .stock-mod .dot{flex:none;width:14px;height:14px;border-radius:50%;background:var(--ht-olive);box-shadow:0 0 0 5px rgba(117,116,44,.18)}
.hemp-collection .stock-mod h3{font-size:1.1rem;margin-bottom:4px}
.hemp-collection .stock-mod p{margin:0;font-size:.88rem;line-height:1.5}
.hemp-collection .sizes button .pre{display:block;font-weight:800;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ht-terra);margin-top:2px}
.hemp-collection .sizes button[aria-pressed="true"] .pre{color:var(--ht-apricot)}
.hemp-collection .sizes button .pl{display:block;font-weight:800;font-size:.72rem;margin-top:2px;opacity:.75}
.hemp-collection .tiers{border:2px solid var(--ht-forest);border-radius:var(--rad);overflow:hidden;background:var(--ht-card);margin-bottom:24px;box-shadow:var(--ht-shadow)}
.hemp-collection .tiers table{width:100%;border-collapse:collapse;font-size:.92rem}
.hemp-collection .tiers th,.hemp-collection .tiers td{text-align:left;padding:10px 16px;border-bottom:1px solid var(--ht-line)}
.hemp-collection .tiers thead th{font-weight:800;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ht-muted);background:var(--ht-paper)}
.hemp-collection .tiers tbody tr{cursor:pointer;transition:background .15s var(--ease)}
.hemp-collection .tiers tbody tr:hover{background:var(--ht-paper)}
.hemp-collection .tiers tbody tr.on{background:var(--ht-apricot)}
.hemp-collection .tiers tbody tr.on td{color:var(--ht-forest);font-weight:700}
.hemp-collection .tiers tbody tr:last-child td{border-bottom:none}
.hemp-collection .tiers td.pc{font-family:var(--font-display)}
.hemp-collection .tiers td.sv{color:var(--ht-olive);font-weight:800}
.hemp-collection .tiers tr.mailrow td{font-size:.88rem}
.hemp-collection .tiers tr.mailrow a{font-weight:800}
.hemp-collection .embcard{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;border:2px solid var(--ht-forest);border-radius:var(--rad);background:var(--ht-olive);color:var(--ht-oat);padding:16px 20px;margin:0 0 26px;box-shadow:var(--ht-shadow)}
.hemp-collection .embcard h3{color:var(--ht-oat);font-size:1.05rem;margin:0 0 5px}
.hemp-collection .embcard p{margin:0;font-size:.88rem;color:rgba(244,233,220,.85);max-width:44ch}
.hemp-collection .embcard .pillbtn{background:var(--ht-oat);flex:none}

/* options */
.hemp-collection .optlabel{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 10px}
.hemp-collection .optlabel .k{font-weight:800;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ht-ink)}
.hemp-collection .optlabel .hint{font-size:.82rem;color:var(--ht-muted)}
.hemp-collection .optlabel .hint.warn{color:var(--ht-terra);font-weight:700}
.hemp-collection .sizes{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}
.hemp-collection .sizes button{padding:10px 18px;border-radius:var(--pill);border:2px solid var(--ht-forest);background:transparent;color:var(--ht-forest);font-weight:700;font-size:.88rem;cursor:pointer;transition:all .12s var(--ease)}
.hemp-collection .sizes button[aria-pressed="true"]{background:var(--ht-forest);color:var(--ht-oat)}
.hemp-collection .buyrow{display:flex;gap:14px;align-items:stretch;flex-wrap:wrap;margin-bottom:12px}
.hemp-collection .qty{display:inline-flex;align-items:center;border:2px solid var(--ht-forest);border-radius:var(--pill);height:58px;overflow:hidden}
.hemp-collection .qty button{width:46px;height:100%;border:none;background:transparent;font-size:1.4rem;font-weight:700;color:var(--ht-forest);cursor:pointer}
.hemp-collection .qty output{min-width:34px;text-align:center;font-family:var(--font-display);font-size:1.1rem;color:var(--ht-ink)}
.hemp-collection .buyrow .pillbtn{flex:1;min-width:230px;min-height:58px}
.hemp-collection .shipnote{font-size:.82rem;color:var(--ht-muted);margin:0 0 26px}

/* features + accordions */
.hemp-collection .featcard{border:2px solid var(--ht-forest);border-radius:var(--rad);background:var(--ht-card);padding:6px 20px 8px;margin-bottom:26px;box-shadow:var(--ht-shadow)}
.hemp-collection .featcard div{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--ht-line);font-weight:600;font-size:.93rem;color:var(--ht-ink)}
.hemp-collection .featcard div:last-child{border-bottom:none}
.hemp-collection .featcard svg{flex:none;color:var(--ht-olive);width:20px;height:20px}
.hemp-collection .accs{border-top:2px solid var(--ht-line)}
.hemp-collection .acc{border-bottom:2px solid var(--ht-line)}
.hemp-collection .acc>button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 2px;border:none;background:transparent;cursor:pointer;font-family:var(--font-display);font-size:1rem;color:var(--ht-ink);text-align:left}
.hemp-collection .acc>button em{font-style:normal;font-size:1.4rem;line-height:1;color:var(--ht-terra);transition:transform .15s var(--ease)}
.hemp-collection .acc.open>button em{transform:rotate(45deg)}
.hemp-collection .acc .bd{max-height:0;overflow:hidden;opacity:0;transition:max-height .3s var(--ease),opacity .3s var(--ease)}
.hemp-collection .acc.open .bd{max-height:480px;opacity:1}
.hemp-collection .acc .bd>div{padding:0 2px 18px;font-size:.93rem}
.hemp-collection .acc .bd ul{margin:0;padding-left:19px;display:grid;gap:7px}
.hemp-collection .acc .bd p{margin:0 0 9px}

/* ---------- wave dividers ---------- */
.hemp-collection .wave{display:block;width:100%;height:64px}
.hemp-collection .wave.flip{transform:scaleY(-1)}

/* ---------- why hemp (forest band) ---------- */
.hemp-collection .band{background:var(--ht-forest);color:var(--ht-oat);padding:clamp(40px,6vw,80px) 0}
.hemp-collection .band .eyebrow{color:var(--ht-apricot)}
.hemp-collection .band h2{color:var(--ht-oat);font-size:clamp(1.8rem,3.4vw,2.6rem);margin:10px 0 12px}
.hemp-collection .band .lede{max-width:62ch;color:rgba(244,233,220,.85);margin:0 0 40px;font-size:1.02rem}
.hemp-collection .stats{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.5vw,44px) clamp(24px,4vw,56px);margin-bottom:52px}
@media(max-width:860px){.hemp-collection .stats{grid-template-columns:1fr}}
.hemp-collection .scene{display:flex;align-items:center;gap:clamp(18px,2.5vw,30px);opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.hemp-collection .scene.in{opacity:1;transform:none}
.hemp-collection .scene .viz{position:relative;flex:none}
.hemp-collection .scene .viz>img{width:clamp(150px,15vw,210px);aspect-ratio:1;border-radius:50%;object-fit:cover;display:block;border:3px solid rgba(244,233,220,.22)}
.hemp-collection .scene .ringbadge{position:absolute;right:-20px;bottom:-16px;width:clamp(86px,8vw,108px);height:clamp(86px,8vw,108px);border-radius:50%;background:var(--ht-forest);display:flex;align-items:center;justify-content:center}
.hemp-collection .scene .ringbadge svg{width:88%;height:88%}
.hemp-collection .scene .v{font-family:var(--font-display);font-size:1.5rem;fill:var(--ht-oat)}
.hemp-collection .scene svg line{stroke:rgba(244,233,220,.16);transition:stroke .32s var(--ease)}
.hemp-collection .scene.in svg line.lit{stroke:var(--ht-apricot)}
.hemp-collection .scene h3{font-family:var(--font-display);font-size:clamp(1.15rem,1.8vw,1.5rem);color:var(--ht-apricot);margin:0 0 8px}
.hemp-collection .scene p{font-size:.95rem;line-height:1.55;color:rgba(244,233,220,.82);margin:0;max-width:34ch}
@media (prefers-reduced-motion:reduce){.hemp-collection .scene{opacity:1;transform:none;transition:none}.hemp-collection .scene svg line{transition:none}.hemp-collection .scene svg line.lit{stroke:var(--ht-apricot)}}
@media(max-width:560px){.hemp-collection .scene{flex-direction:column;text-align:center}.hemp-collection .scene p{max-width:44ch}}
.hemp-collection .stat .k{font-family:var(--font-display);font-size:.98rem;color:var(--ht-apricot);margin-bottom:4px}
.hemp-collection .stat p{font-size:.82rem;line-height:1.45;color:rgba(244,233,220,.78);margin:0 auto;max-width:24ch}
.hemp-collection .cmp{overflow-x:auto;border:2px solid rgba(244,233,220,.35);border-radius:var(--rad)}
.hemp-collection .cmp table{width:100%;border-collapse:collapse;min-width:620px;font-size:.92rem}
.hemp-collection .cmp th,.hemp-collection .cmp td{text-align:left;padding:13px 18px;border-bottom:1px solid rgba(244,233,220,.18);vertical-align:top}
.hemp-collection .cmp thead th{font-family:var(--font-display);font-weight:400;font-size:1rem;color:rgba(244,233,220,.92);border-bottom:2px solid rgba(244,233,220,.35)}
.hemp-collection .cmp thead .hemp{color:var(--ht-apricot)}
.hemp-collection .cmp tbody th{font-weight:700;color:rgba(244,233,220,.92);width:26%}
.hemp-collection .cmp td{color:rgba(244,233,220,.8)}
.hemp-collection .cmp td.hemp{color:var(--ht-oat);font-weight:600}
.hemp-collection .cmp tbody tr:last-child th,.hemp-collection .cmp tbody tr:last-child td{border-bottom:none}
.hemp-collection .cmp-src{font-size:.75rem;color:rgba(244,233,220,.5);margin:12px 2px 0}

/* ---------- mission ---------- */
.hemp-collection .mission{padding:clamp(40px,6vw,80px) 0}
.hemp-collection .mission .grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:center}
@media(max-width:900px){.hemp-collection .mission .grid{grid-template-columns:1fr}}
.hemp-collection .mission figure{margin:0;border-radius:var(--rad-lg);overflow:hidden;border:2px solid var(--ht-forest)}
.hemp-collection .mission figure img{aspect-ratio:4/3;object-fit:cover;width:100%}
.hemp-collection .mission figcaption{font-size:.78rem;color:var(--ht-muted);padding:10px 14px;background:var(--ht-card)}
.hemp-collection .mission h2{font-size:clamp(1.8rem,3.4vw,2.6rem);margin:10px 0 16px}
.hemp-collection .mission p{max-width:54ch}
.hemp-collection .opfp-dark{display:block;width:172px;aspect-ratio:480/200;margin-top:20px;background:var(--ht-forest);-webkit-mask:url("/images/one-percent-for-the-planet.png") no-repeat left center/contain;mask:url("/images/one-percent-for-the-planet.png") no-repeat left center/contain}
.hemp-collection .pledge100{border-left:4px solid var(--ht-apricot);background:var(--ht-paper);border-radius:0 12px 12px 0;padding:12px 16px;font-weight:700;color:var(--ht-forest);max-width:54ch}
.hemp-collection .pledge100 em{font-style:normal;color:var(--ht-terra)}
.hemp-collection .blendnote{font-size:.8rem;color:var(--ht-muted);margin:8px 2px 0}

/* ---------- scroll reveals ---------- */
.hemp-collection .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.hemp-collection .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.hemp-collection .reveal{opacity:1;transform:none;transition:none}}

/* ---------- THIS IS — scroll word loop ---------- */
.hemp-collection .thisis{position:relative;height:260vh;background:var(--ht-oat)}
.hemp-collection .thisis .stick{position:sticky;top:0;height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hemp-collection .thisis .line{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.08em;font-family:var(--font-display);font-size:clamp(2.4rem,7.5vw,6.8rem);line-height:1.05;color:var(--ht-forest);padding:0 4vw;max-width:100%;text-align:center}
.hemp-collection .thisis .fixedpart{white-space:nowrap}
.hemp-collection .thisis .wordbox{position:relative;display:block;height:1.15em;min-width:1em;transition:width .5s var(--ease)}
.hemp-collection .thisis .w{position:absolute;left:50%;top:0;white-space:nowrap;color:var(--ht-terra);opacity:0;transform:translate(-50%,.45em);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.hemp-collection .thisis .w.on{opacity:1;transform:translate(-50%,0)}
.hemp-collection .thisis .w.out{opacity:0;transform:translate(-50%,-.45em)}
.hemp-collection .thisis .dot-end{color:var(--ht-forest)}
.hemp-collection .thisis .dots{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);display:flex;gap:8px}
.hemp-collection .thisis .dots i{width:9px;height:9px;border-radius:50%;background:var(--ht-line);transition:background .3s}
.hemp-collection .thisis .dots i.on{background:var(--ht-terra)}
@media (prefers-reduced-motion:reduce){.hemp-collection .thisis{height:auto}.hemp-collection .thisis .stick{position:static;height:auto;padding:70px 0}.hemp-collection .thisis .w{transition:none}.hemp-collection .thisis .wordbox{transition:none}.hemp-collection .thisis .dots{display:none}}

/* ---------- photo band: image runs into the waves ---------- */
.hemp-collection .photo-band{position:relative;line-height:0}
.hemp-collection .photo-band img{width:100%;height:clamp(340px,52vw,560px);object-fit:cover}
.hemp-collection .photo-band .pb-wave{position:absolute;left:0;right:0;height:64px;z-index:2}
.hemp-collection .photo-band .pb-top{top:-1px}
.hemp-collection .photo-band .pb-bot{bottom:-1px}
.hemp-collection .photo-band .cap{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.2}
.hemp-collection .photo-band .cap span{font-family:var(--font-display);font-size:clamp(1.6rem,4vw,3rem);color:#fff;text-shadow:0 2px 24px rgba(41,50,12,.55)}

/* ---------- loading screen: the big logo switches dark → light ---------- */













/* ---------- read more ---------- */
.hemp-collection .readmore{padding:0 0 clamp(44px,6vw,72px)}
.hemp-collection .readmore h2{font-size:clamp(1.5rem,2.8vw,2rem);margin:8px 0 18px}
.hemp-collection .rm-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.hemp-collection .rm-links a{display:flex;align-items:stretch;gap:0;border:2px solid var(--ht-forest);border-radius:var(--rad);background:var(--ht-card);box-shadow:var(--ht-shadow);overflow:hidden;font-weight:700;font-size:.88rem;line-height:1.35;color:var(--ht-forest);text-decoration:none;transition:transform .15s var(--ease),box-shadow .15s var(--ease)}
.hemp-collection .rm-links a:hover{transform:translateY(-3px);box-shadow:var(--ht-shadow-lift);text-decoration:none}
.hemp-collection .rm-links .rm-img{flex:0 0 96px;min-height:88px;display:block;overflow:hidden}
.hemp-collection .rm-links .rm-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s var(--ease)}
.hemp-collection .rm-links a:hover .rm-img img{transform:scale(1.08)}
.hemp-collection .rm-links .rm-tx{padding:12px 16px;align-self:center}
.hemp-collection .rm-links svg{color:var(--ht-terra);vertical-align:-2px}

/* ---------- small logo band: starts dark, flips light when the footer goes dark ---------- */











/* ---------- b2b + idea ---------- */
.hemp-collection .duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.5vw,28px);padding-bottom:clamp(40px,6vw,72px)}
@media(max-width:900px){.hemp-collection .duo{grid-template-columns:1fr}}
.hemp-collection .callout{border:2px solid var(--ht-forest);border-radius:var(--rad-lg);padding:clamp(24px,3vw,40px);box-shadow:var(--ht-shadow)}
.hemp-collection .callout.b2b{background:var(--ht-olive);color:var(--ht-oat)}
.hemp-collection .callout.b2b h3{color:var(--ht-oat)}
.hemp-collection .callout.b2b p{color:rgba(244,233,220,.88)}
.hemp-collection .callout.idea{background:var(--ht-apricot)}
.hemp-collection .callout.idea p{color:var(--ht-forest-soft)}
.hemp-collection .callout .eyebrow{color:inherit;opacity:.75}
.hemp-collection .callout h3{font-size:clamp(1.4rem,2.4vw,1.9rem);margin:8px 0 12px}
.hemp-collection .callout p{margin:0 0 20px;max-width:46ch}
.hemp-collection .callout .pillbtn{background:var(--ht-oat)}
.hemp-collection .callout.idea .pillbtn{background:var(--ht-forest);color:var(--ht-oat)}
.hemp-collection .callout.idea .pillbtn:hover{background:var(--ht-forest-soft)}

/* ---------- more products ---------- */
.hemp-collection .more{padding:clamp(24px,4vw,44px) 0 clamp(40px,6vw,72px)}
.hemp-collection .more h2{font-size:clamp(1.6rem,3vw,2.2rem);margin:8px 0 6px}
.hemp-collection .more .sub{color:var(--ht-muted);margin:0 0 24px}
.hemp-collection .cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.hemp-collection .pcard{border:2px solid var(--ht-forest);border-radius:var(--rad);background:var(--ht-card);overflow:hidden;text-align:left;cursor:pointer;padding:0;box-shadow:var(--ht-shadow);transition:transform .15s var(--ease),box-shadow .15s var(--ease)}
.hemp-collection .pcard:hover{transform:translateY(-4px);box-shadow:var(--ht-shadow-lift)}
.hemp-collection .pcard .art{aspect-ratio:4/3;display:block;position:relative;overflow:hidden;background:var(--ht-paper);border-bottom:2px solid var(--ht-line)}
.hemp-collection .pcard .art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:opacity .35s var(--ease),transform .5s var(--ease)}
.hemp-collection .pcard .art img.b{opacity:0}
.hemp-collection .pcard:hover .art img{transform:scale(1.05)}
.hemp-collection .pcard:hover .art img.b{opacity:1}
@media (prefers-reduced-motion:reduce){.hemp-collection .pcard .art img{transition:none}}
.hemp-collection .pcard .tx{display:block;padding:15px 16px 17px}
.hemp-collection .pcard .n{display:block;font-family:var(--font-display);font-size:1.02rem;color:var(--ht-ink)}
.hemp-collection .pcard .m{display:block;font-size:.8rem;color:var(--ht-muted);margin-top:3px}
.hemp-collection .pcard .g{display:block;margin-top:10px;font-weight:700;font-size:.78rem;color:var(--ht-terra)}
.hemp-collection .pcard .viewbtn{display:inline-flex;width:max-content;align-items:center;justify-content:center;margin-top:12px;padding:10px 20px;border:2px solid var(--ht-forest);border-radius:var(--pill);background:var(--ht-apricot);color:var(--ht-forest);font-family:var(--font-display);font-size:.85rem}
.hemp-collection .pcard:hover .viewbtn{background:var(--ht-apricot-deep)}

/* ---------- faq ---------- */
.hemp-collection .ht-faq{padding-bottom:clamp(48px,6vw,80px)}
.hemp-collection .ht-faq h2{font-size:clamp(1.6rem,3vw,2.2rem);margin-bottom:22px}
.hemp-collection .ht-faq .acc>button{font-size:1.05rem;padding:18px 6px}
.hemp-collection .ht-faq .acc .bd>div{max-width:75ch;padding:0 6px 20px}

/* ---------- quote popup ---------- */
.hemp-collection .qmodal{position:fixed;inset:0;z-index:900;display:flex;align-items:center;justify-content:center;padding:20px}
.hemp-collection .qm-back{position:absolute;inset:0;background:rgba(41,50,12,.45)}
.hemp-collection .qm-card{position:relative;width:min(520px,100%);max-height:90vh;overflow-y:auto;background:var(--ht-card);border:2px solid var(--ht-forest);border-radius:var(--rad-lg);box-shadow:var(--ht-shadow-lift);padding:clamp(22px,4vw,34px)}
.hemp-collection .qm-card h3{font-size:1.5rem;margin:8px 0 6px}
.hemp-collection .qm-sub{font-size:.92rem;color:var(--ht-muted);margin:0 0 18px}
.hemp-collection .qm-x{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:50%;border:2px solid var(--ht-forest);background:transparent;color:var(--ht-forest);font-size:1.3rem;line-height:1;cursor:pointer}
.hemp-collection #qForm{display:grid;gap:14px}
.hemp-collection #qForm label{display:grid;gap:6px;font-weight:700;font-size:.82rem;color:var(--ht-ink)}
.hemp-collection #qForm label i{font-style:normal;font-weight:600;color:var(--ht-muted)}
.hemp-collection #qForm input,.hemp-collection #qForm textarea{border:2px solid var(--ht-line);border-radius:12px;background:var(--ht-paper);padding:11px 14px;font-family:var(--font-body);font-size:.95rem;color:var(--ht-ink)}
.hemp-collection #qForm input:focus,.hemp-collection #qForm textarea:focus{outline:none;border-color:var(--ht-terra)}
.hemp-collection .qm-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:520px){.hemp-collection .qm-row{grid-template-columns:1fr}}
.hemp-collection .qm-note{margin:0;font-size:.78rem;color:var(--ht-muted)}

/* ---------- footer: the lights go off when it's fully in view ---------- */

/* ---------- seam with this app's fixed header ---------- */
.hemp-collection .gal{top:calc(var(--hc-nav-offset,152px) + 20px)}
.hemp-collection .gal-main,.hemp-collection .gal-thumbs{max-height:calc(100vh - var(--hc-nav-offset,152px) - 124px)}
@media(max-width:900px){.hemp-collection .gal-main,.hemp-collection .gal-thumbs{max-height:none}}
/* so the header's Pre-Order button (href="#preorder") does not land under the header */
.hemp-collection [id]{scroll-margin-top:calc(var(--hc-nav-offset,152px) + 12px)}

/* ---------- undo Webflow's base sheet on the elements the template leaves alone ----------
   webflow.css restyles bare elements site-wide (p margin 0 0 10px, label
   margin-bottom 5px) and the template was written against browser defaults, so
   those two would quietly reflow its copy. Restored at low specificity: every
   rule the template does write still wins. */
.hemp-collection p{margin:1em 0}
.hemp-collection label{margin-bottom:0}