@charset "UTF-8";
@font-face{font-family:"Peaches and Cream Regular W00";src:url("../fonts/Peaches-and-Cream-Regular.woff2") format("woff2"),url("../fonts/Peaches-and-Cream-Regular.woff") format("woff");font-style:normal;font-weight:400;font-display:swap}
:root{--paper:#f7f2e8;--paper-deep:#eee3d2;--cacao:#321b0d;--cacao-soft:#4c2c1b;--ink:#302319;--muted:#796b5d;--peach:#c9824c;--leaf:#66844a;--cta-leaf:#4c7e34;--cta-leaf-hover:#3b6529;--line:rgba(65,42,24,.2);--max:1340px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.65}
a{color:inherit}
.site-header{position:fixed;z-index:20;top:0;left:0;width:100%;padding-top:20px;background:transparent;transition:padding-top .42s cubic-bezier(.2,.75,.25,1),background-color .42s ease,backdrop-filter .42s ease,border-color .42s ease}

.nav-wrap{width:min(70%,1340px);min-height:70px;margin:0 auto;padding:10px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px;border:1px solid rgba(65,42,24,.14);border-radius:999px;background:rgba(247,242,232,.68);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:min-height .42s cubic-bezier(.2,.75,.25,1),padding .42s cubic-bezier(.2,.75,.25,1),border-radius .42s ease,border-color .42s ease,background-color .42s ease,box-shadow .42s ease}
.site-header.is-sticky{padding-top:0;background:rgba(247,242,232,.94);border-bottom:1px solid rgba(65,42,24,.13);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.site-header.is-sticky .nav-wrap{min-height:54px;padding-top:3px;padding-bottom:3px;border-color:transparent;border-radius:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
/* Scroll-linked compact state: works under the site's self-only CSP without inline JS. */
@supports (animation-timeline: scroll()){
  .site-header{animation:header-compact linear both;animation-timeline:scroll(root);animation-range:0px 80px}
  .nav-wrap{animation:nav-compact linear both;animation-timeline:scroll(root);animation-range:0px 80px}
  @keyframes header-compact{0%{padding-top:20px;background-color:transparent;border-bottom-color:transparent}100%{padding-top:0;background-color:rgba(247,242,232,.94);border-bottom-color:rgba(65,42,24,.13)}}
  @keyframes nav-compact{0%{min-height:70px;padding-top:10px;padding-bottom:10px;border-color:rgba(65,42,24,.14);border-radius:999px;background-color:rgba(247,242,232,.68)}100%{min-height:54px;padding-top:3px;padding-bottom:3px;border-color:transparent;border-radius:0;background-color:transparent}}
  .site-header .wordmark{animation:wordmark-compact linear both;animation-timeline:scroll(root);animation-range:0px 80px}
  @keyframes wordmark-compact{0%{font-size:54px;line-height:1.4}100%{font-size:40px;line-height:1}}
  @media(max-width:720px){@keyframes header-compact{0%{padding-top:14px;background-color:transparent;border-bottom-color:transparent}100%{padding-top:0;background-color:rgba(247,242,232,.94);border-bottom-color:rgba(65,42,24,.13)}}@keyframes nav-compact{0%{min-height:62px;padding-top:8px;padding-bottom:8px;border-color:rgba(65,42,24,.14);border-radius:999px;background-color:rgba(247,242,232,.68)}100%{min-height:50px;padding-top:3px;padding-bottom:3px;border-color:transparent;border-radius:0;background-color:transparent}}@keyframes wordmark-compact{0%{font-size:34px;line-height:1.4}100%{font-size:30px;line-height:1}}}
}
.wordmark{color:var(--cacao);font:normal normal normal 54px/1.4em "Peaches and Cream Regular W00",cursive;text-decoration:none;white-space:nowrap;letter-spacing:0}
.wordmark span{font-weight:400}
.brand-name,.brand-name *{font-family:"Peaches and Cream Regular W00",cursive!important;font-style:normal;font-weight:400}
.nav-wrap nav a .brand-name,.mobile-nav nav a .brand-name{font-family:Arial,Helvetica,sans-serif!important;font-style:normal;font-weight:400}
.nav-wrap nav{display:flex;align-items:center;justify-content:flex-end;gap:clamp(14px,2vw,34px)}
.nav-wrap nav a,.footer-nav a{font-size:13px;text-decoration:none;color:var(--cacao-soft);white-space:nowrap}
.nav-wrap nav a{padding:12px 0;position:relative}
.nav-wrap nav a:not(.nav-home):not([href*="why-coco-paste"]),.mobile-nav nav a:not([href*="why-coco-paste"]){font-weight:700}
.nav-wrap nav a[href*="why-coco-paste"],.mobile-nav nav a[href*="why-coco-paste"]{font-weight:400}
.nav-wrap nav a.active:after{content:"";height:3px;position:absolute;left:0;right:0;bottom:3px;background:var(--peach)}
.nav-wrap nav a:hover,.footer-nav a:hover{color:var(--leaf)}
.mobile-nav{display:none}
.impact-hero{min-height:min(660px,calc(100vh - 116px));position:relative;display:grid;grid-template-columns:minmax(300px,.82fr) minmax(0,1.18fr);align-items:center;overflow:hidden;background:var(--paper);padding:38px clamp(24px,6vw,100px)}
.hero-copy{position:relative;z-index:1;max-width:530px;padding:30px 0}
.eyebrow{margin:0 0 18px;color:var(--peach);font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:11px}
.hero-copy h1{margin:0;color:var(--cacao);font-family:Georgia,'Times New Roman',serif;font-size:clamp(64px,8.1vw,118px);font-weight:500;line-height:.84;letter-spacing:-.06em;text-transform:uppercase}
.hero-copy h1 em,.section-heading h2 em,.social-inner h2 em{font-weight:400;color:var(--leaf)}
.hero-note{max-width:370px;margin:28px 0 22px;color:#695a4c;font-size:18px;line-height:1.5}
.text-link{display:inline-flex;gap:20px;align-items:center;color:var(--cta-leaf);font-weight:700;text-decoration:none;text-transform:uppercase;font-size:12px;letter-spacing:.1em;border-bottom:1px solid var(--cta-leaf);padding:0 0 8px;transition:color .22s ease,border-color .22s ease,transform .22s ease}
.text-link span{color:var(--cta-leaf);font-size:19px;transition:transform .22s ease}
.text-link:hover,.text-link:focus-visible{color:var(--cta-leaf-hover);border-color:var(--cta-leaf-hover);transform:translateY(-2px)}
.text-link:hover span,.text-link:focus-visible span{transform:translate(3px,-2px)}
.hero-photo{height:clamp(390px,48vw,610px);width:calc(100% + 10vw);margin-right:-10vw;background:url("../images/impact-hero.png") 72% center/cover no-repeat;mix-blend-mode:multiply;mask-image:linear-gradient(90deg,transparent 0,#000 20%);}
.hero-index{position:absolute;bottom:28px;left:clamp(24px,6vw,100px);color:#887762;font-size:10px;letter-spacing:.19em}
.section-pad{padding:clamp(62px,8vw,120px) max(24px,calc((100vw - var(--max))/2));}
.sustainability{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);gap:48px;background:var(--paper-deep);overflow:hidden;min-height:640px}
.section-heading,.sustainability-copy{position:relative;z-index:1}
.section-heading h2{max-width:480px;margin:0;color:var(--cacao);font-family:Georgia,'Times New Roman',serif;font-weight:500;font-size:clamp(36px,4.1vw,58px);line-height:1.04;letter-spacing:-.035em;text-transform:uppercase}
.section-heading h2 em{color:var(--leaf)}
.sustainability-copy{columns:2;column-gap:34px;padding-top:28px}
.sustainability-copy p{break-inside:avoid;margin:0 0 20px;color:#45382d;font-size:15px;line-height:1.68}
.forest-wash{position:absolute;inset:auto 0 0;height:42%;z-index:0;background:linear-gradient(0deg,rgba(247,242,232,.08),var(--paper-deep) 100%),url("../images/forest.jpg") center 54%/cover no-repeat;opacity:.23;mix-blend-mode:multiply;mask-image:linear-gradient(0deg,#000 0,transparent 100%)}
.leaf-mark{position:absolute;width:170px;height:280px;z-index:0;opacity:.11;pointer-events:none;background:radial-gradient(ellipse at 50% 12%,#6e8e51 0 11%,transparent 12%),radial-gradient(ellipse at 27% 28%,#6e8e51 0 12%,transparent 13%),radial-gradient(ellipse at 70% 42%,#6e8e51 0 12%,transparent 13%),radial-gradient(ellipse at 27% 57%,#6e8e51 0 12%,transparent 13%),radial-gradient(ellipse at 70% 71%,#6e8e51 0 12%,transparent 13%),linear-gradient(78deg,transparent 49%,#6e8e51 49% 51%,transparent 51%)}
.leaf-mark-one{right:-32px;top:0;transform:rotate(15deg)}.leaf-mark-two{left:-70px;bottom:22px;transform:rotate(-18deg) scale(.8)}
.social-impact{position:relative;isolation:isolate;overflow:hidden;background:var(--cacao);color:#f8f1e6;padding:clamp(62px,7vw,100px) max(24px,calc((100vw - var(--max))/2)) clamp(66px,8vw,110px)}
.social-forest{position:absolute;z-index:-1;inset:0 0 0 auto;width:46%;background:linear-gradient(90deg,var(--cacao) 0%,rgba(50,27,13,.72) 30%,rgba(50,27,13,.2) 100%),url("../images/forest.jpg") center/cover no-repeat;opacity:.62}
.social-inner{max-width:var(--max);margin:0 auto;position:relative}
.social-inner .eyebrow{color:#d2a568}
.social-inner h2{font-family:Georgia,'Times New Roman',serif;font-weight:500;font-size:clamp(46px,6vw,78px);letter-spacing:-.05em;text-transform:uppercase;line-height:.95;margin:0 0 42px;color:#f8f1e6}
.social-inner h2 em{color:#b4c58e}
.social-content{display:grid;grid-template-columns:1fr 1fr;gap:18px 54px;max-width:1000px}
.social-intro p,.social-close{font-size:15px;line-height:1.7;color:#f1e7d8;margin:0 0 18px}
.impact-points{padding:0;margin:0;list-style:none}
.impact-points li{position:relative;border-top:1px solid rgba(244,225,199,.26);padding:17px 0 17px 27px;color:#f6eee4;font-size:15px;line-height:1.55}
.impact-points li:before{content:"";position:absolute;left:1px;top:24px;width:9px;height:9px;border-radius:50%;background:#b4c58e}
.social-close{grid-column:1/-1;max-width:800px;margin:8px 0 0;padding-top:18px;border-top:1px solid rgba(244,225,199,.26)}
.order-link{display:inline-flex;gap:24px;align-items:center;margin-top:26px;background:var(--cta-leaf);color:#fff;text-decoration:none;padding:14px 23px;border-radius:2px;font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;transition:background-color .22s ease,transform .22s ease,box-shadow .22s ease}
.order-link:hover,.order-link:focus-visible{background:var(--cta-leaf-hover);color:#fff;transform:translateY(-2px);box-shadow:0 8px 18px rgba(35,63,23,.22)}
.site-footer{background:var(--paper);padding:42px clamp(22px,5vw,80px) 0;color:var(--cacao)}
.footer-main{max-width:var(--max);margin:0 auto 34px;display:grid;grid-template-columns:1fr 2fr .7fr;align-items:start;gap:40px}
.footer-brand .wordmark{font-size:34px}.footer-brand p{font-size:12px;color:var(--muted);margin:16px 0 0}
.footer-nav{display:flex;flex-wrap:wrap;gap:12px 24px;padding-top:9px}
.social-links{display:flex;flex-direction:column;gap:7px;font-size:12px}.social-links span{font-size:10px;letter-spacing:.18em;font-weight:700;margin-bottom:4px}.social-links a{text-decoration:none;color:var(--cacao-soft)}
.copyright{max-width:var(--max);margin:auto;border-top:1px solid var(--line);min-height:54px;display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:11px}
.copyright a{text-decoration:none;color:var(--cacao)}
@media(max-width:1100px){.nav-wrap{width:92%;gap:18px}.nav-wrap nav{gap:13px}.nav-wrap nav a{font-size:11px}.wordmark{font-size:32px}.impact-hero{grid-template-columns:.8fr 1.2fr}.sustainability{gap:30px}.sustainability-copy{columns:1}.footer-main{grid-template-columns:1fr 1.6fr}.social-links{grid-column:1/-1;flex-direction:row;align-items:center;gap:16px}}
@media(max-width:720px){.site-header{padding-top:14px}.nav-wrap{width:calc(100% - 32px);min-height:62px;padding:8px 14px;position:relative;gap:12px}.wordmark{font-size:34px}.nav-wrap>nav{display:none}.mobile-nav{display:block;position:relative}.mobile-nav summary{display:flex;width:42px;height:42px;border:1px solid var(--line);list-style:none;align-items:center;justify-content:center;flex-direction:column;gap:5px;cursor:pointer}.mobile-nav summary::-webkit-details-marker{display:none}.mobile-nav summary span{width:18px;height:1px;background:var(--cacao)}.mobile-nav nav{position:absolute;right:0;top:calc(100% + 12px);min-width:220px;display:flex;flex-direction:column;gap:0;background:var(--paper);padding:8px 18px;box-shadow:0 14px 30px rgba(50,27,13,.12);border:1px solid var(--line)}.mobile-nav nav a{font-size:14px;padding:10px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--cacao)}.mobile-nav nav a:last-child{border-bottom:0}.impact-hero{display:flex;min-height:700px;padding:110px 22px 22px;align-items:flex-start;flex-direction:column}.hero-copy{padding:4px 0 0}.hero-copy h1{font-size:clamp(64px,19vw,100px)}.hero-photo{width:calc(100% + 44px);height:390px;margin:0 -22px 0 auto;mask-image:linear-gradient(180deg,transparent 0,#000 10%);background-position:58% center}.hero-index{bottom:14px;left:22px}.section-pad{padding:60px 22px}.sustainability{grid-template-columns:1fr;gap:18px;min-height:auto}.section-heading h2{font-size:39px}.sustainability-copy{padding-top:0;columns:1}.sustainability-copy p{font-size:14px}.leaf-mark-one{right:-50px;top:130px;transform:scale(.75)}.social-impact{padding:58px 22px 68px}.social-inner h2{font-size:55px;margin-bottom:28px}.social-content{grid-template-columns:1fr;gap:8px}.social-intro p,.impact-points li,.social-close{font-size:14px}.social-close{grid-column:auto}.social-forest{width:100%;opacity:.22;background-image:linear-gradient(90deg,rgba(50,27,13,.68),rgba(50,27,13,.45)),url("../images/forest.jpg")}.footer-main{grid-template-columns:1fr;gap:24px}.footer-nav{gap:12px 20px}.social-links{grid-column:auto}.copyright{min-height:60px}}
@media(prefers-reduced-motion:no-preference){.impact-hero .hero-copy,.section-heading,.social-inner{animation:rise-in .7s ease-out both}.sustainability-copy{animation:rise-in .8s .12s ease-out both}@keyframes rise-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}}

/* Selected Home concept: product benefits */
.product-benefits{position:relative;isolation:isolate;background:var(--paper);color:var(--cacao);overflow:hidden}
.product-benefits::before{content:"";position:absolute;z-index:-1;inset:0;background:url("../images/forest.jpg") left center/cover no-repeat;opacity:.04;mix-blend-mode:multiply;filter:blur(3px);mask-image:radial-gradient(ellipse at 16% 22%,#000 0%,rgba(0,0,0,.45) 43%,transparent 76%)}
.benefits-main{width:min(1600px,calc(100% - 64px));min-height:690px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);align-items:center;gap:clamp(36px,4.5vw,80px);padding:54px 0 50px}
.benefits-product{margin:0;min-width:0;display:flex;align-items:center;justify-content:center}
.benefits-product img{display:block;width:min(100%,780px);max-height:600px;object-fit:contain;object-position:center;filter:drop-shadow(0 18px 20px rgba(71,43,24,.10))}
.benefits-content h2{margin:0 0 34px;color:var(--cacao);font-family:Georgia,'Times New Roman',serif;font-size:clamp(54px,4.4vw,78px);font-weight:500;line-height:1.02;letter-spacing:-.035em}
.benefit-columns{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(20px,3.2vw,52px)}
.benefits-list{display:flex;flex-direction:column;gap:20px;list-style:none;margin:0;padding:0}
.benefits-list li{display:grid;grid-template-columns:40px minmax(0,1fr);align-items:start;gap:16px;color:#45382d;font-size:clamp(18px,1.25vw,22px);line-height:1.3}
.benefit-check{display:flex;width:40px;height:40px;align-items:center;justify-content:center;border-radius:5px;background:#e3c18e;color:var(--cacao);font-size:26px;font-weight:700;line-height:1}
.benefits-highlights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;min-height:192px;background:#b78358;color:#fff9f0;padding:24px max(32px,calc((100vw - 1600px)/2))}
.benefits-highlights p{display:flex;align-items:center;justify-content:center;min-height:144px;margin:0;padding:10px clamp(18px,3vw,46px);text-align:center;font-size:clamp(20px,1.55vw,28px);font-weight:600;line-height:1.25}
.benefits-highlights p+p{border-left:1px solid rgba(255,249,240,.72)}
@media(max-width:900px){.benefits-main{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px;min-height:580px}.benefits-product img{max-height:430px}.benefits-content h2{font-size:clamp(46px,5vw,62px);margin-bottom:26px}.benefit-columns{grid-template-columns:1fr;gap:12px}.benefits-list{gap:14px}.benefits-list li{font-size:18px}.benefit-check{width:32px;height:32px;font-size:21px}.benefits-list li{grid-template-columns:32px minmax(0,1fr);gap:13px}}
@media(max-width:720px){.benefits-main{width:calc(100% - 40px);grid-template-columns:1fr;gap:8px;min-height:auto;padding:38px 0 34px}.benefits-product img{width:min(100%,560px);max-height:340px}.benefits-content h2{font-size:42px;margin-bottom:22px}.benefit-columns{grid-template-columns:1fr;gap:13px}.benefits-list{gap:13px}.benefits-list li{grid-template-columns:30px minmax(0,1fr);gap:12px;font-size:17px}.benefit-check{width:30px;height:30px;font-size:20px}.benefits-highlights{grid-template-columns:1fr;padding:8px 22px}.benefits-highlights p{min-height:76px;padding:14px 10px;font-size:19px}.benefits-highlights p+p{border-left:0;border-top:1px solid rgba(255,249,240,.55)}}

/* Final proportions matched to selected benefits mockup */
@media(min-width:901px){.benefits-main{padding-top:0;padding-bottom:0}.benefits-product{transform:translateX(-110px)}.benefits-product img{width:min(calc(100% + 150px),930px);max-height:690px}.benefits-content{transform:translate(-45px,-18px)}.benefits-content h2{font-size:clamp(48px,3.85vw,68px);margin-bottom:30px}.benefits-list{gap:19px}.benefits-list li{grid-template-columns:34px minmax(0,1fr);gap:16px;font-size:clamp(17px,1.15vw,20px)}.benefit-check{width:34px;height:34px;font-size:21px}.benefits-highlights p{font-size:clamp(19px,1.4vw,25px)}}
@media(max-width:900px){.benefits-product,.benefits-content{transform:none}.benefits-product img{width:min(100%,430px);max-height:430px}}
@media(max-width:720px){.benefits-product img{width:min(100%,560px);max-height:340px}}
@media(min-width:901px){.benefits-product{transform:translate(-50px,80px)}.benefits-product img{transform:scaleX(1.08)}.benefits-content{transform:translate(-45px,-41px)}.benefit-check{width:30px;height:30px;font-size:19px}.benefits-list li{grid-template-columns:30px minmax(0,1fr)}.benefits-highlights p{font-size:clamp(18px,1.3vw,23px)}}
@media(min-width:901px){.benefits-content h2{font-family:Arial,Helvetica,sans-serif;font-weight:700;letter-spacing:-.035em}.benefits-list{gap:26px}}

/* Refined type scale and checkmarks to match the selected mockup */
@media(min-width:901px){
  .benefits-content h2{font-size:clamp(44px,3.4vw,60px);margin-bottom:26px}
  .benefits-list{gap:20px}
  .benefits-list li{grid-template-columns:26px minmax(0,1fr);gap:14px;font-size:clamp(16px,1vw,18px);line-height:1.28}
  .benefit-check{width:26px;height:26px;font-size:16px;border-radius:4px}
  .benefits-highlights p{font-size:clamp(17px,1.15vw,20px)}
}
@media(min-width:721px) and (max-width:900px){
  .benefits-list li{font-size:16px;line-height:1.28}
  .benefit-check{width:27px;height:27px;font-size:17px}
  .benefits-list li{grid-template-columns:27px minmax(0,1fr)}
  .benefits-highlights p{font-size:18px}
}

/* Cocoa foliage details from the approved mockup */
.product-benefits::before{content:none}
.benefits-main{position:relative;isolation:isolate}
.benefits-main::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:url("/assets/images/cocoa-leaf-shadow-overlay.png") center/100% 100% no-repeat;mix-blend-mode:multiply}
.benefits-product{position:relative;z-index:1}
.benefits-product img.benefits-leaf{position:absolute;left:-30px;bottom:20px;z-index:3;width:min(15vw,230px);height:auto;max-height:none;object-fit:contain;filter:drop-shadow(0 5px 5px rgba(54,39,20,.15));transform:rotate(-15deg)}
.benefits-content{position:relative;z-index:2}
@media(max-width:900px){.benefits-product img.benefits-leaf{left:-12px;bottom:8px;width:min(20vw,165px)}}
@media(max-width:720px){.benefits-product img.benefits-leaf{left:-4px;bottom:0;width:min(25vw,120px)}}

/* Keep only the soft cocoa-branch shadow in the backdrop; position the single leaf beside the tube */
.benefits-main::before{clip-path:inset(0 0 35% 0)}
@media(min-width:901px){.benefits-product img.benefits-leaf{left:-120px;bottom:195px;width:min(13vw,200px)}}

/* Match the foreground cacao leaf angle and scale from the selected mockup */
@media(min-width:901px){.benefits-product img.benefits-leaf{left:-120px;bottom:195px;width:min(16vw,300px);transform:rotate(55deg)}}
@media(min-width:901px){.benefits-product img.benefits-leaf{left:-95px;bottom:158px;width:min(14vw,260px)}}

/* Full-bleed composition alignment to the approved mockup */
.product-benefits::before{content:"";position:absolute;z-index:0;inset:0 0 auto;height:690px;pointer-events:none;background:url("/assets/images/cocoa-leaf-shadow-overlay.png") left top/100% 100% no-repeat;mix-blend-mode:multiply;clip-path:inset(0 0 35% 0)}
.benefits-main::before{content:none}
@media(min-width:901px){.benefits-product{transform:translate(-50px,104px)}.benefits-content{transform:translate(-45px,-76px)}.benefits-product img.benefits-leaf{bottom:98px;transform:rotate(35deg)}}
@media(max-width:900px){.product-benefits::before{height:580px;background-size:auto 100%;background-position:left top}.benefits-product img.benefits-leaf{transform:rotate(35deg)}}
.product-benefits::before{z-index:1;mix-blend-mode:normal}
.benefits-main,.benefits-highlights{position:relative;z-index:2}
.product-benefits::before{content:none}
.benefits-main{position:relative;isolation:isolate}
.benefits-main::before{content:"";position:absolute;z-index:-1;top:0;left:50%;width:100vw;height:690px;transform:translateX(-50%);pointer-events:none;background:url("/assets/images/cocoa-leaf-shadow-overlay.png") center top/100% 100% no-repeat;clip-path:inset(0 0 35% 0)}
.benefits-main::before{height:520px;background-size:100% 100%;opacity:.34;mask-image:radial-gradient(ellipse 45% 62% at 9% 7%,#000 0%,rgba(0,0,0,.72) 55%,transparent 100%)}

/* Three featured benefit icons, sourced from Font Awesome Free 6.7.2 */
.benefits-highlights{min-height:220px;padding-top:12px;padding-bottom:12px}
.benefits-highlight{display:flex;min-width:0;min-height:196px;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:8px clamp(16px,2vw,30px);text-align:center}
.benefits-highlight+.benefits-highlight{border-left:1px solid rgba(255,249,240,.55)}
.benefits-highlight-icon{display:grid;width:112px;height:112px;flex:0 0 auto;place-items:center;border-radius:50%;background:#e6c18e}
.benefits-icon{display:block;width:52px;height:52px;background:#573311;mask-position:center;mask-repeat:no-repeat;mask-size:contain;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat;-webkit-mask-size:contain}
.benefits-icon--calendar{mask-image:url("/assets/icons/calendar-days.svg");-webkit-mask-image:url("/assets/icons/calendar-days.svg")}
.benefits-icon--tooth{mask-image:url("/assets/icons/tooth.svg");-webkit-mask-image:url("/assets/icons/tooth.svg")}
.benefits-icon--chart{mask-image:url("/assets/icons/chart-line.svg");-webkit-mask-image:url("/assets/icons/chart-line.svg")}
.benefits-highlight p{min-height:0;margin:0;padding:0;color:#fff9f0;font-size:clamp(16px,1.05vw,20px);line-height:1.2;font-weight:700}
@media(max-width:720px){.benefits-highlights{min-height:0;padding:12px 22px}.benefits-highlight{min-height:0;padding:18px 10px;gap:10px}.benefits-highlight+.benefits-highlight{border-left:0;border-top:1px solid rgba(255,249,240,.55)}.benefits-highlight-icon{width:80px;height:80px}.benefits-icon{width:40px;height:40px}.benefits-highlight p{font-size:17px}}

/* Page-wide sans-serif typography */
html,body,body *{font-family:Arial,Helvetica,sans-serif!important}
/* Keep the branded wordmark in its supplied display font. */
.wordmark,.wordmark *{font-family:"Peaches and Cream Regular W00",cursive!important}

@media(prefers-reduced-motion:reduce){.site-header,.nav-wrap{transition:none!important}}

/* Coco Paste footer redesign */
.site-footer{position:relative;isolation:isolate;overflow:hidden;background:#321b0d;color:#f8f1e6;padding:58px clamp(22px,5vw,80px) 0}
.footer-leaf{position:absolute;z-index:0;height:auto;pointer-events:none;user-select:none;opacity:.56}
.footer-leaf--top{width:clamp(210px,20vw,340px);left:-110px;top:-45px;transform:rotate(-28deg)}
.footer-leaf--bottom{width:clamp(190px,18vw,310px);right:-105px;bottom:-42px;transform:rotate(28deg)}
.footer-main{position:relative;z-index:1;max-width:var(--max);margin:0 auto 42px;display:grid;grid-template-columns:minmax(210px,.85fr) minmax(250px,1.25fr) minmax(220px,.9fr);align-items:center;gap:clamp(24px,3.2vw,48px)}
.footer-brand .wordmark{color:#f8f1e6;font-size:38px;line-height:1.15}
.footer-newsletter{justify-self:center;max-width:360px;text-align:center}
.footer-newsletter h2{margin:0 0 9px;color:#f8f1e6;font-size:19px;font-weight:600;letter-spacing:.02em}
.footer-newsletter p{margin:0;color:rgba(248,241,230,.76);font-size:13px;line-height:1.6}
.footer-contact{justify-self:end;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.footer-address{margin:0;color:rgba(248,241,230,.82);font-size:12px;line-height:1.5}
.footer-nav{display:flex;flex-wrap:wrap;align-content:center;gap:15px clamp(15px,2vw,28px);padding:0}
.footer-nav a{color:#f8f1e6;font-size:13px;text-decoration:none;transition:color .2s ease}
.footer-nav a:hover,.footer-nav a:focus-visible{color:#a9cc79}
.footer-nav a .brand-name{font-family:"Peaches and Cream Regular W00",cursive!important}
.social-links{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding-left:24px;border-left:1px solid rgba(169,204,121,.5);font-size:13px}
.social-links a{color:#f8f1e6;text-decoration:none;transition:color .2s ease,transform .2s ease}
.social-links a:hover,.social-links a:focus-visible{color:#a9cc79;transform:translateX(3px)}
.copyright{position:relative;z-index:1;max-width:var(--max);margin:0 auto;border-top:1px solid rgba(169,204,121,.42);min-height:78px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;color:rgba(248,241,230,.78);font-size:12px}
.site-credit{justify-self:end;color:#f8f1e6;white-space:nowrap}
.site-credit a{color:#a9cc79;font-weight:700;text-decoration:none;transition:color .2s ease}
.site-credit a:hover,.site-credit a:focus-visible{color:#c2e69a;text-decoration:underline}
.copyright .back-to-top{display:inline-flex;align-items:center;gap:9px;padding:8px 13px;border:1px solid rgba(169,204,121,.65);border-radius:999px;color:#f8f1e6;text-decoration:none;white-space:nowrap;transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease}
.back-to-top span{color:#a9cc79;font-size:17px;line-height:1;transition:transform .2s ease}
.copyright .back-to-top:hover,.copyright .back-to-top:focus-visible{background:var(--cta-leaf);border-color:var(--cta-leaf);color:#fff;transform:translateY(-2px);box-shadow:0 7px 18px rgba(0,0,0,.2)}
.back-to-top:hover span,.back-to-top:focus-visible span{color:#fff;transform:translateY(-2px)}
@media(max-width:980px){.footer-main{grid-template-columns:minmax(170px,.8fr) minmax(220px,1fr);gap:28px}.footer-newsletter{grid-column:1/-1;grid-row:2;justify-self:center}.footer-contact{grid-column:2;grid-row:1;justify-self:end}.social-links{flex-direction:row;padding:0;border:0;gap:20px}}
@media(max-width:720px){.site-footer{padding:42px 22px 0}.footer-leaf--top{left:-118px;top:-35px;width:220px;opacity:.35}.footer-leaf--bottom{right:-115px;bottom:-32px;width:205px;opacity:.38}.footer-main{grid-template-columns:1fr;gap:26px;margin-bottom:30px}.footer-brand .wordmark{font-size:34px}.footer-newsletter{grid-column:auto;grid-row:auto;justify-self:start;text-align:left}.footer-contact{grid-column:auto;grid-row:auto;justify-self:start;gap:10px}.social-links{grid-column:auto;flex-direction:row;gap:20px}.copyright{min-height:0;padding:18px 0 20px;grid-template-columns:1fr 1fr;row-gap:14px}.copyright>span:first-child{justify-self:start}.copyright .back-to-top{grid-column:1/-1;grid-row:2;justify-self:center}.site-credit{justify-self:end;white-space:normal;text-align:right;font-size:11px}.back-to-top{padding:7px 10px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.footer-nav a,.social-links a,.site-credit a,.back-to-top,.back-to-top span{transition:none!important}}

/* Compact the shared navigation without shifting its horizontal alignment. */
.site-header{padding-top:14px}
.nav-wrap{min-height:62px;padding:6px 24px}
.wordmark{font-size:46px;line-height:1.12}
.site-header.is-sticky .nav-wrap{min-height:48px;padding-top:2px;padding-bottom:2px}
@supports (animation-timeline:scroll()){
  .site-header{animation:header-compact-v2 linear both;animation-timeline:scroll(root);animation-range:0px 80px}
  .nav-wrap{animation:nav-compact-v2 linear both;animation-timeline:scroll(root);animation-range:0px 80px}
  .site-header .wordmark{animation:wordmark-compact-v2 linear both;animation-timeline:scroll(root);animation-range:0px 80px}
  @keyframes header-compact-v2{0%{padding-top:14px;background-color:transparent;border-bottom-color:transparent}100%{padding-top:0;background-color:rgba(247,242,232,.94);border-bottom-color:rgba(65,42,24,.13)}}
  @keyframes nav-compact-v2{0%{min-height:62px;padding-top:6px;padding-bottom:6px;border-color:rgba(65,42,24,.14);border-radius:999px;background-color:rgba(247,242,232,.68)}100%{min-height:48px;padding-top:2px;padding-bottom:2px;border-color:transparent;border-radius:0;background-color:transparent}}
  @keyframes wordmark-compact-v2{0%{font-size:46px;line-height:1.12}100%{font-size:38px;line-height:1}}
  @media(max-width:720px){
    @keyframes nav-compact-v2{0%{min-height:56px;padding-top:5px;padding-bottom:5px;border-color:rgba(65,42,24,.14);border-radius:999px;background-color:rgba(247,242,232,.68)}100%{min-height:46px;padding-top:2px;padding-bottom:2px;border-color:transparent;border-radius:0;background-color:transparent}}
    @keyframes wordmark-compact-v2{0%{font-size:32px;line-height:1.12}100%{font-size:28px;line-height:1}}
  }
}
@media(max-width:720px){.site-header{padding-top:12px}.nav-wrap{min-height:56px;padding:5px 14px}.wordmark{font-size:32px;line-height:1.12}.site-header.is-sticky .nav-wrap{min-height:46px;padding-top:2px;padding-bottom:2px}}


/* Subtle scroll reveals and responsive interaction motion across the home page. */
@media(prefers-reduced-motion:no-preference){
 .motion-ready .reveal-on-scroll{opacity:0;transform:translate3d(0,24px,0);transition:opacity .72s cubic-bezier(.2,.75,.25,1),transform .72s cubic-bezier(.2,.75,.25,1);transition-delay:var(--reveal-delay,0ms);will-change:opacity,transform}
 .motion-ready .reveal-on-scroll.is-visible{opacity:1;transform:translate3d(0,0,0)}
 .motion-ready .impact-hero .hero-copy{animation:home-copy-enter .85s .12s cubic-bezier(.2,.75,.25,1) both}
 .motion-ready .impact-hero .hero-photo{animation:home-photo-enter 1.15s cubic-bezier(.2,.75,.25,1) both}
 .section-heading h2,.benefits-content h2,.social-inner h2{transition:letter-spacing .45s ease}
 .section-heading:hover h2,.benefits-content:hover h2,.social-inner:hover h2{letter-spacing:-.025em}
 .benefits-highlight-icon{transition:transform .5s cubic-bezier(.2,.75,.25,1),box-shadow .5s ease}
 .benefits-highlight:hover .benefits-highlight-icon{transform:translateY(-5px) rotate(-4deg);box-shadow:0 14px 24px rgba(25,16,8,.2)}
 .site-header .nav-wrap nav a{transition:color .25s ease,transform .3s cubic-bezier(.2,.75,.25,1)}
 .site-header .nav-wrap nav a:hover{transform:translateY(-2px)}
 .footer-leaf{animation:leaf-drift 8s ease-in-out infinite alternate}
 .footer-leaf--bottom{animation-delay:-3s}
}
@keyframes home-copy-enter{from{opacity:0;transform:translate3d(0,22px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes home-photo-enter{from{opacity:.75;transform:scale(1.035)}to{opacity:1;transform:scale(1)}}
@keyframes leaf-drift{from{translate:0 0}to{translate:0 -11px}}
@media(prefers-reduced-motion:reduce){.motion-ready .reveal-on-scroll{opacity:1;transform:none;transition:none}.footer-leaf{animation:none!important}}

/* Native, script-independent motion for every public page. */
@media(prefers-reduced-motion:no-preference){
 :is(.impact-hero,.product-benefits,.social-impact,.editorial-section,.team-strip,.post-card,.article-body>*,.related-posts,.contact-form,.footer-main>.footer-column,.newsletter,.copyright){animation:content-arrive .72s cubic-bezier(.2,.75,.25,1) both}
 .impact-hero{animation-duration:1s}
 .impact-hero .hero-copy{animation:home-copy-enter .86s .08s cubic-bezier(.2,.75,.25,1) both}
 .impact-hero .hero-photo{animation:home-photo-enter 1.1s cubic-bezier(.2,.75,.25,1) both}
 .product-benefits,.social-impact{animation-delay:.12s}
 .editorial-section:nth-child(2),.post-card:nth-child(2){animation-delay:.08s}
 .editorial-section:nth-child(3),.post-card:nth-child(3){animation-delay:.16s}
 .editorial-section:nth-child(4),.post-card:nth-child(4){animation-delay:.24s}
 .editorial-section:nth-child(5),.post-card:nth-child(5){animation-delay:.32s}
 .editorial-section:nth-child(6),.post-card:nth-child(6){animation-delay:.4s}
 .editorial-section:nth-child(7),.post-card:nth-child(7){animation-delay:.48s}
 .inner-hero-copy>*{animation:content-arrive .65s cubic-bezier(.2,.75,.25,1) both}
 .inner-hero-copy>*:nth-child(2){animation-delay:.1s}.inner-hero-copy>*:nth-child(3){animation-delay:.18s}
 .leaf-button,.newsletter-form button,.site-header .nav-wrap nav a,.footer-social a{transition:transform .32s cubic-bezier(.2,.75,.25,1),background-color .3s ease,color .3s ease,box-shadow .35s ease}
 .leaf-button:hover,.newsletter-form button:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(50,27,13,.18)}
 .footer-social a:hover{transform:translateY(-3px) scale(1.06)}
 .editorial-media img{transition:transform .85s cubic-bezier(.2,.75,.25,1),filter .65s ease}
 .editorial-media:hover img{transform:scale(1.035)}
 @supports(animation-timeline:view()){
  :is(.editorial-section,.team-strip,.post-card,.article-body>*,.related-posts,.contact-form){animation-name:scroll-arrive!important;animation-duration:auto!important;animation-timing-function:linear!important;animation-fill-mode:both!important;animation-timeline:view()!important;animation-range:entry 0% entry 38%!important}
 }
}
@keyframes content-arrive{from{opacity:.65;transform:translate3d(0,18px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes scroll-arrive{from{opacity:0;transform:translate3d(0,30px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@media(prefers-reduced-motion:reduce){:is(.impact-hero,.product-benefits,.social-impact,.editorial-section,.team-strip,.post-card,.article-body>*,.related-posts,.contact-form,.footer-main>.footer-column,.newsletter,.copyright,.inner-hero-copy>*){animation:none!important}}
