:root{--forest:#12251b;--forest-2:#1d3d2b;--leaf:#79bd3a;--sage:#b8cba9;--cream:#f4f1e7;--ink:#183126;--mist:#e5ebdf}
body{background:var(--cream);color:var(--ink)}
.canapa-hero{position:relative;min-height:100svh;padding:100px 24px 52px;color:#fff;background:radial-gradient(circle at 82% 16%,#315b3d 0,var(--forest-2) 32%,#0b1711 78%)}
.hero-grid{max-width:1120px;margin:auto;display:grid;gap:40px;align-items:center}
.hero-copy h1{font-size:clamp(3.15rem,10vw,6.5rem);line-height:.94;margin:10px 0 26px}.hero-copy h1 em{display:inline-block;margin-top:18px;color:#cbdabb;font-weight:400;font-size:.48em;line-height:1.1}.hero-copy>p:not(.eyebrow){max-width:610px;color:#e3ebdf;font-size:1.08rem}.canapa-button{display:inline-flex;align-items:center;min-height:54px;margin-top:24px;padding:14px 24px;background:var(--leaf);color:#0c1d13;text-decoration:none;text-transform:uppercase;letter-spacing:.12em;font-size:.73rem;font-weight:800}.hero-grid figure{margin:0;justify-self:center;max-width:600px}.hero-grid figure img{display:block;width:100%;aspect-ratio:1.18/1;object-fit:cover;border:1px solid rgba(203,218,187,.45);box-shadow:0 28px 75px rgba(0,0,0,.38)}.hero-grid figcaption{margin-top:12px;text-align:right;color:#bcd0b2;text-transform:uppercase;letter-spacing:.16em;font-size:.65rem}
.intro{max-width:1060px;margin:auto;padding:105px 24px;display:grid;gap:28px}.intro p:last-child{max-width:650px;color:#566a5e;font-size:1.08rem}
.products{padding:96px 24px;background:var(--forest);color:#fff}.section-heading{max-width:1060px;margin:0 auto 48px}.section-heading h2{color:#fff}.product-grid{max-width:1060px;margin:auto;display:grid;gap:22px}.product-grid article{position:relative;background:#172c21;border:1px solid #42604f;overflow:hidden;box-shadow:0 22px 52px rgba(0,0,0,.18)}.product-image{background:#f1ecdc;aspect-ratio:4/5;overflow:hidden}.product-image img{display:block;width:100%;height:100%;object-fit:cover}.product-content{padding:32px 28px 38px}.product-grid span{display:block;color:var(--leaf);font-size:.7rem;letter-spacing:.17em;font-weight:800}.product-grid .role{margin:28px 0 8px;color:#a9c29f;text-transform:uppercase;letter-spacing:.15em;font-size:.7rem;font-weight:700}.product-grid h3{margin:0 0 8px;color:#fff;font-size:clamp(2.4rem,7vw,3.6rem)}.product-type{margin:0 0 20px;color:#cfe0c5;font-family:Georgia,serif;font-style:italic;font-size:1.05rem}.product-content>p:not(.role):not(.product-type):not(.actives){margin:0;color:#cad7ce}.actives{margin:24px 0 0;color:#8fc95d;text-transform:uppercase;letter-spacing:.09em;font-size:.73rem;font-weight:800}
.botanicals{padding:104px 24px;background:var(--mist)}.botanical-copy{max-width:900px;margin:0 auto 52px}.botanical-copy>p:not(.kicker):not(.free-from){max-width:700px;color:#52665a}.free-from{margin-top:26px;color:#447326;text-transform:uppercase;letter-spacing:.13em;font-size:.72rem;font-weight:800}.ingredient-grid{max-width:1060px;margin:auto;display:grid;gap:22px}.ingredient-grid article{background:#f8f6ef;border:1px solid #cbd7c5;overflow:hidden}.ingredient-grid img{display:block;width:100%;height:220px;object-fit:cover}.ingredient-grid article div{padding:26px}.ingredient-grid h3{margin:0 0 10px;color:var(--forest);font-size:1.7rem}.ingredient-grid p{margin:0;color:#5b6c62;font-size:.96rem}
.consultation{display:grid;background:#d1ddc7}.consultation>img{display:block;width:100%;height:100%;min-height:420px;object-fit:cover}.consultation>div{align-self:center;padding:70px 24px}.consultation h2{max-width:680px}.consultation>div>p:not(.kicker){max-width:620px;color:#4a6153}.canapa-button.light{background:#fff;color:var(--forest)}
footer{padding:34px 24px;background:#0b1711;color:#a7b9ae;text-align:center;font-size:.8rem}footer p{margin:0}
@media(min-width:800px){.canapa-hero{padding:122px 38px 72px}.hero-grid{grid-template-columns:.95fr 1.05fr}.intro{grid-template-columns:1fr 1fr;align-items:center;padding-top:128px;padding-bottom:128px}.product-grid{grid-template-columns:repeat(3,1fr)}.ingredient-grid{grid-template-columns:repeat(3,1fr)}.ingredient-grid article{display:flex;flex-direction:column}.ingredient-grid article div{flex:1}.consultation{grid-template-columns:1fr 1fr}.consultation>div{padding:90px max(30px,calc((100vw - 1060px)/2)) 90px 64px}.consultation>img{min-height:620px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}