/* Crazy-Bunny light concept. Product photography remains the supplied original artwork. */
:root{
  --paper:#fffaf7;
  --paper-white:#fff;
  --paper-soft:#f5f1ee;
  --paper-blue:#eafaff;
  --ink:#12151b;
  --muted:#5b626d;
  --line:#12151b24;
  color-scheme:light;
}

html{background:var(--paper)}
body{
  color:var(--ink);
  background:
    radial-gradient(circle at 7% 14%,#ff079412 0 2px,transparent 3px),
    radial-gradient(circle at 92% 28%,#00d5ec13 0 2px,transparent 3px),
    linear-gradient(120deg,#fff 0%,#fffaf7 54%,#f5fbfd 100%);
  background-size:54px 54px,68px 68px,auto;
}
body:before{
  background:
    radial-gradient(ellipse at 3% 25%,#ff07940f,transparent 24%),
    radial-gradient(ellipse at 96% 62%,#00d5ec12,transparent 28%);
}
p{color:#454b54}
.eyebrow{color:#4f5660}
#result-count,.footer-bottom,.newsletter-help{color:var(--muted)}

.site-header{
  color:var(--ink);
  background:#fffdf9e8;
  border-bottom:1px solid #15181e1c;
  box-shadow:0 8px 28px #1118270d;
  backdrop-filter:blur(18px) saturate(1.25);
}
.site-header.is-compact{
  background:#fffdf9f2;
  box-shadow:0 12px 34px #11182712,0 2px 0 #ff079424;
}
.has-scene-hero .site-header{
  background:#fffdf9e8;
  border-bottom-color:#15181e1c;
  backdrop-filter:blur(18px) saturate(1.25);
  -webkit-backdrop-filter:blur(18px) saturate(1.25);
}
.language{border-color:#1118271f}
.icon-button:hover{background:#ff07940b}

.button.secondary{
  color:var(--ink);
  background:#ffffffd9;
  border-color:#16191f78;
  box-shadow:4px 4px 0 #00d5ec22;
}
.button.secondary:hover{color:var(--ink);background:#fff;border-color:var(--pink)}
.button.primary,.button:not(.secondary){box-shadow:5px 6px 0 #10151c,0 10px 24px #ff079425}
.button.primary:hover,.button:not(.secondary):hover{box-shadow:2px 3px 0 #10151c,0 10px 28px #ff079436}

/* Full-width heroes fade into paper instead of ending as dark rectangles. */
.hero,.small-hero,.product-hero{
  color:var(--ink);
  background:linear-gradient(90deg,#fffaf7 0%,#fffaf7eb 36%,#fffaf756 62%,#fffaf706 100%);
}
.has-scene-hero .hero{background:var(--paper)}
.hero:after{
  background:linear-gradient(90deg,#fffaf7 0%,#fffaf7e8 35%,transparent 68%),linear-gradient(0deg,#fffaf7 0%,transparent 18%);
}
.has-scene-hero .hero:after{
  background:linear-gradient(90deg,#fffaf7f8 0%,#fffaf7e8 30%,#fffaf74a 58%,transparent 77%),linear-gradient(0deg,#fffaf7d9 0%,transparent 22%);
}
.hero-art{filter:saturate(1.06) contrast(1.03);mask-image:linear-gradient(90deg,transparent,#000 20%)}
.has-scene-hero .hero .hero-art{filter:saturate(1.05) contrast(1.02)}
.hero-copy h1{color:var(--ink);text-shadow:2px 3px 0 #fff,0 7px 20px #fff}
.hero-description{color:#2c3139;text-shadow:0 2px 10px #fff}
.hero .eyebrow{color:#4a505a}
.wall-note{color:#22283399;text-shadow:2px 2px 0 #fff}
.paint-divider{mix-blend-mode:multiply;filter:saturate(1.1)}
.torn{border-color:#11151b16}
.torn:before{background:var(--paper)}

.home-hero{
  background:#fffaf7;
}
.home-hero .hero-art{
  mask-image:linear-gradient(90deg,transparent 0,#000 25%,#000 100%);
}

.essentials,.catalogue-section,.faq-section,.related-section{
  background:linear-gradient(180deg,#fff 0%,#fffaf7 68%,#f6fbfd 100%);
}
.section-heading h2,.section-intro h2{color:var(--ink)}

.category-card,.product-card,.channel,.faq-item,.collab-card,.product-summary{
  color:var(--ink);
  background:linear-gradient(145deg,#fff 0%,#fbf8f5 100%);
  border-color:#15181f22;
  box-shadow:0 14px 34px #19202c0d,5px 6px 0 #15181f0c;
}
.category-card:nth-child(odd),.product-card:nth-child(3n+2){box-shadow:0 14px 34px #19202c0d,5px 6px 0 #00d5ec24}
.category-card:nth-child(even),.product-card:nth-child(3n){box-shadow:0 14px 34px #19202c0d,5px 6px 0 #ff079420}
.category-card:hover,.product-card:hover,.channel:hover,.faq-item[open]{border-color:var(--pink);box-shadow:0 18px 38px #ff07941a,5px 6px 0 #ff07943d}
.category-card span,.channel span,.text-link{color:#d90079}
.card-art{
  background:
    radial-gradient(ellipse at 70% 35%,#ff07941b,transparent 52%),
    radial-gradient(ellipse at 20% 80%,#00d5ec1b,transparent 44%),
    linear-gradient(145deg,#fff,#f2f0ee);
}
.product-card:nth-child(2n) .card-art{
  background-image:radial-gradient(ellipse at 25% 35%,#00d5ec20,transparent 54%),radial-gradient(ellipse at 85% 78%,#ff079415,transparent 42%),linear-gradient(145deg,#fff,#f1f5f6);
}
.card-art img{filter:drop-shadow(0 18px 14px #20263228)}
.card-copy p,.faq-item p,.channel p,.collab-card p{color:#555c66}
.card-plus{border-color:#14182055;background:#fff}

.story-banner,.values,.instructions-section,.community{
  color:var(--ink);
  background-color:transparent;
}
.story-banner:after,.values:after,.instructions-section:after,.community:after{
  background:
    linear-gradient(90deg,#fffaf7ee,#fff8f2c9 48%,#effbffdb),
    url('/assets/concrete-960.webp') center/cover no-repeat;
  background-blend-mode:screen;
  mask-image:linear-gradient(0deg,transparent,#000 14%,#000 86%,transparent);
  opacity:.92;
}
.values:after,.instructions-section:after{
  background:linear-gradient(110deg,#eafaff,#fff4fa 52%,#fffaf7);
}
.community:after{
  background:linear-gradient(100deg,#fff1f8,#fffaf7 45%,#eafaff);
}
.story-banner p,.values p,.community p,.instructions-section p{color:#444a53}
.banner-note{color:#db007a;text-shadow:2px 2px 0 #fff}

.editorial-photo,.contact-collage{
  border-color:#fff;
  box-shadow:12px 14px 0 #11151b,20px 24px 0 #00d5ec2b;
}
.gallery-item{background:#f7f4f1;border-color:#161a2026;box-shadow:7px 7px 0 #00d5ec22}
.gallery-item>span{color:#fff;background:linear-gradient(transparent,#0c111bd9)}

.small-hero{background:#fffaf7}
.page-faq .small-hero:after,.page-privacy .small-hero:after,.page-terms .small-hero:after{
  background-image:linear-gradient(90deg,#fffaf7fa 0%,#fffaf7d9 35%,#fffaf72a 70%),linear-gradient(0deg,#fffaf7 0%,transparent 33%),var(--small-hero-image,url('/assets/hero-faq.webp'));
}
.page-faq .small-hero{--small-hero-image:url('/assets/hero-faq.webp')}
.page-privacy .small-hero,.page-terms .small-hero{--small-hero-image:url('/assets/hero-privacy.webp')}
.small-hero h1{color:var(--ink);text-shadow:2px 3px 0 #fff}

.product-hero{background:#fffaf7}
.product-hero:before{
  background:
    linear-gradient(90deg,#fffaf7d1,#ffffff7d 50%,#eefbffe0),
    url('/assets/alley-960.webp') center/cover no-repeat;
  background-blend-mode:screen;
}
.product-stage:before{background:radial-gradient(circle,#ff079423,transparent 67%)}
.product-stage:after{border-color:#00d5ec55}
.product-intro h1,.product-intro h2,.product-intro h3{color:var(--ink)}
.product-tagline{color:#d90079!important}
.product-meta,.product-meta p{color:#444b55}
.product-facts strong{color:var(--ink)}
.product-facts span{color:#5d6570}
.breadcrumbs,.breadcrumbs a{color:#505863}
.product-image-button img{filter:drop-shadow(0 24px 18px #1118272e)}
.product-thumb{background:#fff;border-color:#15181f2e}

.detail-nav{border-color:#15181f20;background:#fffaf7e6}
.detail-nav a{color:#323842}
.detail-nav a:hover{color:#d90079}
.nutrition-table,.nutrition-table th,.nutrition-table td{border-color:#15181f24}
.nutrition-table th{background:#f2f7f8;color:var(--ink)}
.nutrition-table tr:nth-child(even) td{background:#fff7fb}
.ingredients-card,.declaration-card,.info-card{
  background:#fff;
  border-color:#15181f20;
  color:var(--ink);
  box-shadow:5px 6px 0 #00d5ec1d;
}
.product-description{background:linear-gradient(180deg,#fffaf7,#f7fcfd)}
.product-description article p{color:#454c56}
.product-summary{background:linear-gradient(140deg,#eafaff,#fff5fa)}
.product-summary dl>div{border-color:#15181f1f}
.product-summary dt{color:#5a626d}
.description-divider{filter:saturate(1.05);mix-blend-mode:multiply}

.chip,.search-box{
  color:var(--ink);
  background:#fff;
  border-color:#15181f35;
}
.search-box input{color:var(--ink)}
.chip.active,.chip:hover{color:white}

#contact-form input:not([type=checkbox]),#contact-form select,#contact-form textarea,.newsletter-entry input{
  color:var(--ink);
  background:#fff;
  border-color:#15181f32;
  box-shadow:inset 0 1px 0 #fff,4px 4px 0 #00d5ec14;
}
#contact-form input::placeholder,#contact-form textarea::placeholder,.newsletter-entry input::placeholder{color:#767d86}
#contact-form label.checkbox,.newsletter-check{color:#565e69}
.newsletter-section{background:radial-gradient(ellipse at center,#ff07940e,transparent 70%)}
.newsletter-layout{
  padding:44px;
  border:1px solid #12151b1f;
  border-radius:20px;
  background:linear-gradient(120deg,#fff,#fff6fa 55%,#effcff);
  box-shadow:10px 12px 0 #15181f,18px 21px 0 #00d5ec35;
}

.prose{color:var(--ink)}
.prose p,.prose li{color:#454c56}
.lightbox{background:#fff;color:var(--ink);border-color:#14182033}
.lightbox::backdrop{background:#111827db}

.energy-ribbon{filter:drop-shadow(0 7px 0 #11151b26)}
.energy-ribbon--ink{--ribbon:#121821;--ribbon-ink:#ff36aa}
.marquee-section{background:#fffaf7}
.marquee-band{box-shadow:0 8px 0 #12151b1d}

.site-footer{
  color:var(--ink);
  background:linear-gradient(180deg,transparent 0,#eefaff 130px,#fffaf7 100%);
}
.footer-bottom{border-color:#15181f24}
.footer-main nav a:hover,.footer-bottom a:hover{color:#d90079}

/* Mobile keeps the strong reveal animation while changing the panel itself to paper. */
.mobile-menu{color:var(--ink);box-shadow:0 28px 70px #0005}
.mobile-menu::backdrop{background:#05070bc9}
.mobile-menu-shell{
  background:
    radial-gradient(circle at 92% 12%,#ff079416,transparent 27%),
    radial-gradient(circle at 8% 78%,#00d5ec16,transparent 30%),
    linear-gradient(150deg,#fff 0%,#fffaf7 58%,#effbff 100%);
}
.mobile-menu-shell:before{opacity:.06;mix-blend-mode:multiply}
.mobile-menu-top{border-color:#15181f1c}
.mobile-menu-close{border-color:#15181f2c;background:#fff}
.mobile-menu-close span{background:var(--ink)}
.mobile-menu-link,.mobile-menu-trigger{color:var(--ink);border-color:#15181f18}
.mobile-menu-subtle{color:#5a626d}
.mobile-submenu a{color:#4e5661;border-color:#15181f14}
.mobile-language{color:#626a75}
.mobile-language strong,.mobile-language button{background:#fff;border-color:#15181f22;color:#747c86}
.mobile-menu-signoff span{color:#20252d}

@media(max-width:900px){
  .hero:after{background:linear-gradient(0deg,#fffaf7 0%,#fffaf7ef 25%,transparent 63%,#fffaf7b8 100%)}
  .has-scene-hero .hero:after{background:linear-gradient(90deg,#fffaf7f5,#fffaf7c9 42%,#fffaf729 72%,transparent),linear-gradient(0deg,#fffaf7d1,transparent 24%)}
  .hero-copy{background:linear-gradient(90deg,#fffaf7e8,transparent);border-radius:18px;padding:20px}
}
@media(max-width:600px){
  body{background-attachment:scroll}
  .hero-art{mask-image:linear-gradient(180deg,transparent,#000 20%,#000 73%,transparent 100%)}
  .has-scene-hero .hero:after{background:linear-gradient(180deg,#fffaf7b0 0%,#fffaf72b 34%,#fffaf71f 62%,#fffaf7f5 100%),linear-gradient(90deg,#fffaf7a8,transparent 88%)}
  .hero-copy{width:100%;padding:18px 8px;background:linear-gradient(180deg,#fffaf72e,#fffaf7f3 45%,#fffaf7)}
  .newsletter-layout{padding:28px 20px;box-shadow:6px 7px 0 #15181f,11px 13px 0 #00d5ec35}
  .category-card,.product-card,.channel,.faq-item{box-shadow:0 12px 25px #1118270d,4px 5px 0 #00d5ec1f}
}

/* The same portal, with the Light Side visibly selected. */
.theme-switch{
 --switch-step:86px;
 color:#17202a;
 background:linear-gradient(118deg,#fff7fb 0 48%,#e7fbff 52% 100%);
 border-color:#00bcd4b8;
 box-shadow:3px 4px 0 #ff07942b,0 0 18px #00cfe52b;
}
.theme-switch:before{background:linear-gradient(135deg,#20e4f1,#00bfd8)}
.theme-switch span:first-child{color:#28313b}.theme-switch span:last-child{color:#071016}
.theme-switch i{color:#ff0794;text-shadow:0 0 8px #ff0794a8}
.theme-switch:hover{border-color:#00bfd8;box-shadow:5px 6px 0 #ff07942e,0 0 24px #00cfe53d}
.theme-switch:focus-visible{outline-color:#ff0794}
@media(max-width:1100px) and (min-width:901px){.theme-switch{--switch-step:75px}}
@media(max-width:900px){.mobile-theme-switch{--switch-step:calc(100% + 28px)}}

@media(prefers-reduced-motion:reduce){
  .product-image-button,.product-stage:after{animation:none!important;transform:none!important}
}

/* Light art direction v2: dedicated daylight scenes and tactile section surfaces. */
body{
  background-color:#f6f0e9;
  background-image:
    linear-gradient(120deg,#fffaf7e8,#edfaffdf 54%,#fff0f7d9),
    url('/assets/light-street-texture.webp');
  background-size:auto,1904px auto;
  background-attachment:fixed;
}

.page-home .hero .hero-art{background-image:url('/assets/hero-panorama-light.webp')}
.page-products .hero .hero-art{background-image:url('/assets/hero-products-light.webp')}
.page-our-story .hero .hero-art{background-image:url('/assets/hero-about-light.webp')}
.page-lookbook .hero .hero-art{background-image:url('/assets/hero-lookbook-light.webp')}
.page-contact .hero .hero-art{background-image:url('/assets/hero-contact-light.webp')}
.page-videos .hero .hero-art{background-image:url('/assets/hero-videos-light.webp')}

.has-scene-hero .hero .hero-art{
  filter:saturate(1.03) contrast(1.01);
  mask-image:linear-gradient(90deg,transparent 0,#000 17%,#000 100%);
}
.has-scene-hero .hero:after{
  background:
    linear-gradient(90deg,#fffaf7f7 0%,#fffaf7d9 27%,#fffaf73b 55%,transparent 72%),
    linear-gradient(0deg,#fffaf7d6 0%,transparent 20%);
}
.home-hero .hero-art{mask-image:linear-gradient(90deg,transparent 0,#000 17%,#000 100%)}

.page-faq .small-hero{--small-hero-image:url('/assets/hero-faq-light.webp')}
.page-privacy .small-hero,.page-terms .small-hero{--small-hero-image:url('/assets/hero-privacy-light.webp')}
.page-faq .small-hero:after,.page-privacy .small-hero:after,.page-terms .small-hero:after{
  background-image:
    linear-gradient(90deg,#fffaf7fa 0%,#fffaf7d8 31%,#fffaf70f 61%),
    linear-gradient(0deg,#fffaf7 0%,transparent 28%),
    var(--small-hero-image);
  background-position:center;
  background-size:cover;
}

.story-banner:after,.values:after,.instructions-section:after,.community:after{
  background-image:
    linear-gradient(105deg,#e9faffd9,#fff9f4c9 48%,#fff0f7d9),
    url('/assets/light-street-texture.webp');
  background-position:center;
  background-size:cover;
  background-blend-mode:normal;
  opacity:1;
}
.story-banner:after{background-image:linear-gradient(95deg,#eefbffe8,#fff9f4d0 48%,#fff0f7cf),url('/assets/light-street-texture.webp')}
.values:after{background-image:linear-gradient(105deg,#dff8ffec,#fffaf7d6 50%,#ffe6f2df),url('/assets/light-street-texture.webp')}
.instructions-section:after{background-image:linear-gradient(105deg,#dff7ffed,#fff8f1dc 46%,#ffeaf4e8),url('/assets/light-street-texture.webp')}
.community:after{background-image:linear-gradient(100deg,#ffe6f2e8,#fffaf7d6 48%,#dff8ffe8),url('/assets/light-street-texture.webp')}

.essentials{
  background:
    linear-gradient(110deg,#dff8ffed,#fffaf7df 45%,#ffe8f3e8),
    url('/assets/light-street-texture.webp') center/cover;
}
/* Home: the band runs from the hero's torn pink edge down to the ribbon, no paper gaps. */
.page-home .essentials{padding-top:56px;padding-bottom:90px;margin-bottom:-30px}
.page-home .essentials+.energy-ribbon{margin-top:0}
/* Home hero: soften the image towards the torn edge (the band overlaps the bottom 66px, so the fade starts higher). */
.page-home .hero:after{
  background:
    linear-gradient(90deg,#fffaf7f7 0%,#fffaf7d9 27%,#fffaf73b 55%,transparent 72%),
    linear-gradient(0deg,#fffaf7f2 62px,#fffaf7b8 120px,#fffaf74d 190px,transparent 270px);
}
.hero-cut .hero-cut-fill{fill:transparent}
@media(max-width:600px){.page-home .essentials{padding-top:48px;padding-bottom:56px;margin-bottom:0}}
.catalogue-section{
  background:
    radial-gradient(circle at 7% 14%,#00cfe51f 0 4px,transparent 5px),
    linear-gradient(180deg,#f0fbff 0%,#fff8f2 42%,#ffeef6 100%);
}
.faq-section{
  background:
    linear-gradient(110deg,#fff2f7e8,#edfaffed),
    url('/assets/light-street-texture.webp') center/cover;
}
.related-section{
  background:
    radial-gradient(circle at 94% 18%,#ff079421 0 5px,transparent 6px),
    linear-gradient(125deg,#dff8ff 0%,#fffaf7 48%,#ffe6f1 100%);
}

/* Product pages keep the supplied pack shots and replace only their environment. */
.product-hero:before{
  background:
    linear-gradient(90deg,#e9faffed,#fffaf7bd 48%,#ffeaf3dc),
    url('/assets/light-street-texture.webp') center/cover no-repeat;
  background-blend-mode:normal;
}
.product-stage:before{
  background:radial-gradient(circle at center,#00d5ec2b 0,#ff079419 38%,transparent 68%);
}
.product-stage:after{border-color:#00bcd45e;box-shadow:0 0 0 18px #ff07940a}
.product-image-button img{filter:drop-shadow(0 25px 18px #18212b2f)}

.detail-nav{
  background:#fffaf7e8;
  border:1px solid #15181f1c;
  border-radius:16px;
  box-shadow:0 12px 28px #18212b0c;
}
.nutrition-layout{
  position:relative;
  margin-block:54px;
  padding:54px;
  border:1px solid #10151c20;
  border-radius:22px;
  background:linear-gradient(128deg,#e3f9ff 0%,#fffaf7 48%,#ffe9f3 100%);
  box-shadow:10px 12px 0 #10151c,18px 20px 0 #00cfe535;
  overflow:hidden;
}
.nutrition-layout:before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:url('/assets/light-street-texture.webp') center/cover;
  opacity:.1;
  mix-blend-mode:multiply;
}
.nutrition-layout> *{position:relative;z-index:1}
.table-scroll{border-radius:14px;border:1px solid #15181f24;overflow:auto;box-shadow:5px 6px 0 #ff079421}
.nutrition-table{
  width:100%;
  background:#fff!important;
  color:var(--ink)!important;
}
.nutrition-table th,.nutrition-table td{
  color:var(--ink)!important;
  border-color:#15181f1d!important;
}
.nutrition-table thead th{background:#c8f4fb!important}
.nutrition-table tbody tr:nth-child(odd) th,.nutrition-table tbody tr:nth-child(odd) td{background:#f2fcff!important}
.nutrition-table tbody tr:nth-child(even) th,.nutrition-table tbody tr:nth-child(even) td{background:#fff3f8!important}
.nutrition-table caption{color:#4c5560;background:#fffaf7}

.ingredients-panel{
  background:
    linear-gradient(145deg,#ffffffed,#e8faffed 52%,#fff0f7ed),
    url('/assets/light-street-texture.webp') center/cover!important;
  color:var(--ink)!important;
  border:1px solid #00bcd447!important;
  border-radius:18px;
  box-shadow:7px 8px 0 #15181f,13px 14px 0 #ff07942e;
}
.ingredients-panel h3,.ingredients-panel p{color:var(--ink)!important}
.ingredients-panel .caffeine-note{
  color:#72204f!important;
  background:#ffe4f1!important;
  border:1px solid #ff079443!important;
  border-radius:11px;
}

.instructions-section{
  background:linear-gradient(110deg,#dff8ff,#fff8f2 48%,#ffe8f3);
}
.instruction-grid{
  position:relative;
  padding:28px 0;
}
.info-panel{
  color:var(--ink);
  border-color:#12151b22;
  background:#fffaf7b8;
  border-radius:14px;
  padding:28px;
  box-shadow:5px 6px 0 #00cfe52b;
}
.info-panel h3,.info-panel p{color:var(--ink)}

.declaration{
  margin-block:58px;
  padding:46px 52px;
  border:1px solid #15181f20;
  border-radius:18px;
  background:
    linear-gradient(110deg,#fffaf7e8,#e8faffdf 56%,#ffeaf3e3),
    url('/assets/light-street-texture.webp') center/cover;
  box-shadow:8px 9px 0 #15181f,15px 16px 0 #ff07942e;
}
.product-description{
  background:
    linear-gradient(115deg,#fff5efeb,#e7f9ffdf 55%,#ffeaf4e6),
    url('/assets/light-street-texture.webp') center/cover;
}
.product-summary{background:linear-gradient(140deg,#d9f8ff,#fffaf7 52%,#ffe5f1)}
.product-faq-section{
  width:min(1240px,calc(100% - 80px));
  margin-block:58px;
  padding:52px;
  border-radius:20px;
  background:linear-gradient(120deg,#fff0f7,#fffaf7 50%,#e4f9ff);
  border:1px solid #15181f1c;
  box-shadow:8px 9px 0 #00cfe52d;
}

.site-footer{
  background:
    linear-gradient(180deg,transparent 0,#dff8ffdc 110px,#fff2f7 48%,#fffaf7 100%),
    url('/assets/light-street-texture.webp') center bottom/cover no-repeat;
}
.mobile-menu-shell{
  background:
    linear-gradient(150deg,#fffaf7ed,#e7f9ffed 58%,#ffe8f3ed),
    url('/assets/light-street-texture.webp') center/cover;
}

@media(max-width:900px){
  .has-scene-hero .hero:after{
    background:linear-gradient(90deg,#fffaf7f2,#fffaf7b8 44%,transparent 78%),linear-gradient(0deg,#fffaf7c9,transparent 22%);
  }
  .nutrition-layout{padding:38px;margin-block:42px}
}
@media(max-width:600px){
  body{background-attachment:scroll;background-size:auto,1200px auto}
  .has-scene-hero .hero .hero-art{mask-image:linear-gradient(180deg,transparent 0,#000 13%,#000 79%,transparent 100%)}
  .has-scene-hero .hero:after{
    background:linear-gradient(180deg,#fffaf7c9 0%,#fffaf723 34%,#fffaf71a 63%,#fffaf7f2 100%),linear-gradient(90deg,#fffaf7ba,transparent 88%);
  }
  .nutrition-layout{
    width:calc(100% - 28px);
    padding:28px 18px;
    border-radius:16px;
    box-shadow:6px 7px 0 #10151c,10px 12px 0 #00cfe535;
  }
  .declaration{
    width:calc(100% - 36px);
    padding:32px 24px;
    margin-block:42px;
  }
  .product-faq-section{width:calc(100% - 36px);padding:32px 18px;margin-block:42px}
  .info-panel{padding:22px}
}

/* Light art direction v3: seamless painted edges and stronger daylight contrast. */
.paint-divider,
.description-divider,
.contact-divider{
  overflow:visible;
  isolation:isolate;
  filter:none;
  mix-blend-mode:normal;
}

/* Every painted line sits inside a transparent wash so the surface changes gradually. */
.paint-divider{
  height:120px;
  bottom:-60px;
  background-position:center,center;
  background-size:100% 64px,100% 100%;
  background-repeat:no-repeat;
}
.paint-divider,
.values>.paint-divider,
.small-hero>.paint-divider{
  background-image:
    url('/assets/divider-ink.svg?v=3'),
    linear-gradient(180deg,transparent 0%,#fffaf754 24%,#f6fbfddd 50%,#eefaff66 76%,transparent 100%);
}
.story-banner>.paint-divider{
  background-image:
    url('/assets/divider-story.svg?v=3'),
    linear-gradient(180deg,transparent 0%,#fff4f85c 26%,#f4fbfcdb 50%,#eaf9ff61 76%,transparent 100%);
}
.product-hero>.paint-divider{
  background-image:
    url('/assets/divider-product.svg?v=3'),
    linear-gradient(180deg,transparent 0%,#fff6fa5c 24%,#f4fbfcdd 50%,#eafaff61 78%,transparent 100%);
}
.instructions-section>.paint-divider,
.product-story>.paint-divider{
  background-image:
    url('/assets/divider-catalogue.svg?v=3'),
    linear-gradient(180deg,transparent 0%,#edfaff59 22%,#fff8f2dc 50%,#ffeef66b 78%,transparent 100%);
}
.community>.paint-divider{
  height:132px;
  bottom:-66px;
  background-image:
    url('/assets/divider-footer.svg?v=4'),
    linear-gradient(180deg,transparent 0%,#e9faff59 22%,#eefaffeb 52%,#fff2f76b 80%,transparent 100%);
  background-size:100% 72px,100% 100%;
}
.description-divider,
.contact-divider{
  height:120px;
  background-image:
    url('/assets/divider-contact.svg?v=3'),
    linear-gradient(180deg,transparent 0%,#e9fbff61 24%,#f3fbfcdf 50%,#fff1f76b 78%,transparent 100%);
  background-position:center,center;
  background-size:100% 64px,100% 100%;
  background-repeat:no-repeat;
}
.description-divider{bottom:-60px}
.contact-divider{margin:-38px 0 -28px}

/* Let scene art and section colour overlap the divider instead of ending on a straight edge. */
.story-banner:after,
.values:after,
.instructions-section:after,
.community:after{
  inset:-48px 0;
  mask-image:linear-gradient(180deg,transparent 0%,#000 15%,#000 85%,transparent 100%);
}
.product-hero:before{
  inset:0 0 -105px;
  mask-image:linear-gradient(180deg,#000 0%,#000 72%,#000b 84%,transparent 100%);
}
.page-faq .small-hero:after,
.page-privacy .small-hero:after,.page-terms .small-hero:after{
  inset:0 0 -90px;
  mask-image:linear-gradient(180deg,#000 0%,#000 68%,#000c 82%,transparent 100%);
}
.product-description,
.instructions-section,
.faq-section,
.related-section{
  background-color:transparent;
  background-repeat:no-repeat;
  background-size:100% 100%;
}
.product-description{
  background-image:linear-gradient(180deg,transparent 0%,#fff5efbd 9%,#e7f9ffcf 55%,#ffeaf4be 91%,transparent 100%);
}
.instructions-section{
  background-image:linear-gradient(180deg,transparent 0%,#dff8ffdb 12%,#fff8f2ed 48%,#ffe8f3d9 88%,transparent 100%);
}
.faq-section{
  background-image:linear-gradient(180deg,transparent 0%,#fff2f7d6 12%,#edfaffea 50%,#fff8f2d6 88%,transparent 100%);
}
.related-section{
  background-image:
    radial-gradient(circle at 94% 18%,#ff079421 0 5px,transparent 6px),
    linear-gradient(180deg,transparent 0%,#dff8ffdf 12%,#fffaf7ef 50%,#ffe6f1dd 88%,transparent 100%);
}
.marquee-section{
  margin-block:0;
  padding-block:54px 58px;
  background:linear-gradient(180deg,transparent 0%,#fffaf7d9 30%,#fff2f7dc 70%,transparent 100%);
}

/* Product controls and warnings must read as light-theme elements. */
.zoom-hint{
  color:#151a22;
  background:#ffffffd9;
  border:1px solid #15181f35;
  box-shadow:4px 5px 0 #00cfe52b;
  font-weight:600;
}
.product-thumbnails>button,
.product-thumb{
  color:var(--ink);
  background:linear-gradient(145deg,#fff,#e9faff)!important;
  border-color:#15181f35!important;
  box-shadow:3px 4px 0 #15181f14;
}
.product-thumbnails>button[aria-pressed=true]{
  background:linear-gradient(145deg,#fff,#fff0f7)!important;
  box-shadow:0 0 0 2px #ff079422,4px 5px 0 #00cfe52b;
}
.nutrition-subtitle,
.nutrition-subtitle span{
  color:#007f93!important;
  font-weight:600;
}
.caffeine-note{
  color:#77204f!important;
  background:#ffe2f0!important;
  border-color:#d90079!important;
  font-weight:500;
}
.caffeine-note strong{color:#5e123d!important}
.fineprint{color:#555e69}

/* One uninterrupted textured footer surface, including the air around its painted edge. */
.site-footer{
  margin-top:-2px;
  padding-top:96px;
  background-color:#eefaff;
  background-image:
    linear-gradient(180deg,#eefaff00 0%,#eefaffd9 82px,#eefaffd9 58%,#fff2f7e8 88%,#fffaf7f2 100%),
    url('/assets/light-street-texture.webp');
  background-position:center top,center top;
  background-size:100% 100%,1904px auto;
  background-repeat:no-repeat,repeat-y;
}
.site-footer:before{
  content:'';
  position:absolute;
  z-index:-1;
  left:0;
  right:0;
  top:-86px;
  bottom:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,transparent 0,#e9faff73 68px,#eefaffe8 130px,#eefaff 180px,#eefaff 100%),
    url('/assets/light-street-texture.webp') center top/1904px auto;
  mask-image:linear-gradient(180deg,transparent,#000 32%,#000 100%);
}
.footer-main,.footer-bottom{position:relative;z-index:1}

@media(max-width:600px){
  .paint-divider{height:88px;bottom:-44px;background-size:100% 48px,100% 100%}
  .community>.paint-divider{height:100px;bottom:-50px;background-size:100% 58px,100% 100%}
  .description-divider,.contact-divider{height:88px;background-size:100% 48px,100% 100%}
  .description-divider{bottom:-44px}
  .contact-divider{margin:-27px 0 -19px}
  .marquee-section{padding-block:42px 46px}
  .site-footer{padding-top:76px;background-size:100% 100%,1200px auto}
}

/* Catalogue copy sits directly on the art throughout the mobile/tablet header. */
@media(max-width:900px){
  .catalogue-hero .hero-copy{
    background:none;
    border:0;
    border-radius:0;
    padding:20px 0;
    box-shadow:none;
    backdrop-filter:none;
  }
  .catalogue-hero .hero-copy h1{
    text-shadow:1px 2px 0 #fff,0 3px 12px #fff,0 0 22px #fff;
  }
  .catalogue-hero .hero-description{
    color:#29313b;
    text-shadow:0 1px 10px #fff,0 0 18px #fff;
  }
  .catalogue-hero .button.secondary{
    color:#151a22;
    background:#ffffffd9;
    border-color:#15181f70;
    box-shadow:4px 4px 0 #00cfe52f;
  }
  .catalogue-hero .button.secondary .icon{color:#151a22}
}

/* Home copy also sits directly on the scene, matching the dark mobile hero. */
@media(max-width:900px){
  .page-home .home-hero .hero-copy{
    width:100%;
    background:none;
    border:0;
    border-radius:0;
    padding:20px 0;
    box-shadow:none;
    backdrop-filter:none;
  }
  .page-home .home-hero .hero-copy h1{
    text-shadow:1px 2px 0 #fff,0 3px 12px #fff,0 0 22px #fff;
  }
  .page-home .home-hero .hero-description{
    color:#29313b;
    text-shadow:0 1px 10px #fff,0 0 18px #fff;
  }
  .page-home .home-hero .button.secondary{
    color:#151a22;
    background:#ffffffd9;
    border-color:#15181f70;
    box-shadow:4px 4px 0 #00cfe52f;
  }
  .page-home .home-hero .button.secondary .icon{color:#151a22}
}

@media(max-width:600px){
  .page-home .home-hero .hero-copy{
    padding:18px 0;
  }
  .page-home .home-hero .hero-description{
    text-shadow:0 1px 8px #fff,0 0 16px #fff;
  }
  .page-home .home-hero .button.secondary{
    background:#ffffffed;
  }
}

/* Mobile catalogue in daylight: keep the copy compact and the artwork visible. */
@media(max-width:600px){
  .catalogue-hero .hero-copy{
    width:min(100%,340px);
    max-width:340px;
    padding:17px 0 19px;
    background:none;
    border:0;
    border-radius:0;
    box-shadow:none;
    backdrop-filter:none;
  }
  .catalogue-hero .hero-copy h1{
    text-shadow:1px 2px 0 #fff,0 3px 12px #fff,0 0 22px #fff;
  }
  .catalogue-hero .hero-description{
    color:#29313b;
    text-shadow:none;
  }
  .catalogue-hero .hero-art{
    opacity:.7;
    mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 100%);
  }
  .catalogue-hero:after{
    background:linear-gradient(90deg,#fffaf7ad 0%,#fffaf75c 48%,#fffaf710 82%),linear-gradient(0deg,#eefaff 0%,transparent 23%);
  }
  .catalogue-hero .button.secondary{
    color:#151a22;
    background:#ffffffed;
    border-color:#15181f70;
    box-shadow:4px 4px 0 #00cfe52f;
  }
  .catalogue-hero .button.secondary .icon{color:#151a22}
}

/* Torn edge on every hero (light): pink glow above the line, hero clipped exactly along it. */
@media(max-width:600px){
  }
/* Our story: the values band runs from the cyan ribbon down to the pink marquee band, no paper gaps. */
.page-our-story .energy-ribbon+.values{margin-top:-24px;padding-top:98px}
.page-our-story .values{margin-bottom:-96px;padding-bottom:170px}
.page-our-story .marquee-section{background:linear-gradient(180deg,transparent 0,transparent 96px,#fffaf7 96px)}
@media(max-width:600px){
  .page-our-story .values{margin-bottom:-70px;padding-bottom:144px}
  .page-our-story .marquee-section{background:linear-gradient(180deg,transparent 0,transparent 70px,#fffaf7 70px)}
}
/* Mobile menu languages + header controls in the light theme. */
.mobile-language button{border-color:#ff078e80;background:#ff078e10;color:#d90079}
.mobile-language strong{border-color:#00b4c8;background:#00d5ec;color:#07101a;box-shadow:0 0 14px #00d5ec66,0 6px 0 #0096a8}
.mobile-language button:disabled{color:#8b929c;background:transparent}
.site-header .language{color:#0093a8;border-color:#00b4c866}
.menu-toggle{color:#d90079;border-color:#ff078e66;background:#ff078e0f}
.menu-toggle:hover{background:var(--pink);color:#fff}
.mobile-submenu a{color:#4e5661}

/* Mobile polish (light) */
@media(max-width:600px){
  .eyebrow,.hero .eyebrow,.hero-description,.story-banner p,.community p,.small-hero p,.small-hero .eyebrow,.section-intro p{text-shadow:0 1px 0 #fff,0 0 14px #fff}
  .catalogue-hero .hero-description,.page-home .home-hero .hero-description{text-shadow:0 1px 0 #fff,0 0 14px #fff}
  .footer-bottom,.fineprint,.newsletter-help,.newsletter-check,#contact-form label.checkbox,.spec-list dd,.product-summary dt,.breadcrumbs,#result-count,.card-copy p,.faq-item p,.channel p,.collab-card p{color:#555d68}
  .eyebrow,.hero .eyebrow{color:#454c56}
  .hero .button.secondary{color:#151a22;background:#ffffffd9;border-color:#15181f70;box-shadow:4px 4px 0 #00cfe52f}
  .hero .button.secondary .icon{color:#151a22}
}
/* No rounded panel behind hero copy on tablet/phone; text shadows carry readability. */
@media(max-width:900px){.hero-copy,.catalogue-hero .hero-copy,.page-home .home-hero .hero-copy{background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;padding:20px 0}}
@media(max-width:600px){.hero-copy{background:none;padding:18px 0}}
/* Catalogue: solid bridge colours (its gradient would not line up), and no paper strip above the ribbon below the list. */
.catalogue-section::after{content:'';position:absolute;left:0;right:0;bottom:-84px;height:84px;background:#ffeef6;pointer-events:none}
/* Every section after a hero grows upward under the torn line: a transparent top border carries the section's own background (border-box), clipped along the same torn polygon as the hero. */
.hero+*,.small-hero+*{position:relative;z-index:3;margin-top:-66px;border-top:66px solid transparent;background-origin:border-box;background-clip:border-box;clip-path:polygon(0.00% 30px,2.12% 25px,4.25% 24px,6.38% 24px,9.31% 23px,9.81% 20px,11.12% 19px,13.25% 18px,14.00% 19px,14.19% 22px,16.31% 23px,16.81% 24px,18.94% 25px,21.88% 25px,22.62% 25px,23.38% 22px,25.50% 21px,28.44% 18px,28.94% 18px,31.06% 18px,31.56% 18px,32.31% 19px,35.25% 18px,35.56% 24px,38.50% 21px,39.25% 20px,39.44% 19px,39.94% 18px,40.12% 18px,40.88% 18px,43.81% 19px,44.12% 20px,44.44% 19px,45.75% 18px,46.06% 24px,46.56% 29px,47.31% 27px,48.06% 29px,51.00% 27px,53.12% 32px,53.62% 33px,53.94% 39px,54.44% 38px,55.75% 43px,55.94% 38px,58.06% 40px,60.19% 41px,62.31% 36px,64.44% 35px,64.94% 29px,65.12% 32px,65.88% 27px,68.00% 27px,68.31% 27px,69.06% 24px,69.38% 18px,69.56% 18px,70.06% 18px,70.81% 18px,72.94% 18px,74.25% 21px,75.56% 20px,77.69% 26px,79.00% 23px,79.19% 18px,79.69% 19px,80.00% 25px,80.19% 25px,82.31% 19px,82.81% 22px,84.12% 19px,84.88% 18px,85.62% 19px,85.81% 25px,88.75% 24px,90.88% 18px,91.38% 18px,92.12% 19px,93.44% 18px,93.94% 18px,96.88% 18px,99.00% 19px,99.31% 18px,99.62% 18px,100.00% 18px,100% 100%,0 100%)}
@media(max-width:600px){.hero+*,.small-hero+*{margin-top:-43px;border-top-width:43px;clip-path:polygon(0.00% 20px,2.12% 17px,4.25% 16px,6.38% 16px,9.31% 15px,9.81% 14px,11.12% 13px,13.25% 12px,14.00% 13px,14.19% 15px,16.31% 15px,16.81% 16px,18.94% 17px,21.88% 17px,22.62% 17px,23.38% 15px,25.50% 14px,28.44% 12px,28.94% 12px,31.06% 12px,31.56% 12px,32.31% 13px,35.25% 12px,35.56% 16px,38.50% 14px,39.25% 14px,39.44% 13px,39.94% 12px,40.12% 12px,40.88% 12px,43.81% 13px,44.12% 14px,44.44% 13px,45.75% 12px,46.06% 16px,46.56% 20px,47.31% 18px,48.06% 20px,51.00% 18px,53.12% 21px,53.62% 22px,53.94% 25px,54.44% 25px,55.75% 28px,55.94% 25px,58.06% 27px,60.19% 27px,62.31% 24px,64.44% 23px,64.94% 20px,65.12% 21px,65.88% 18px,68.00% 18px,68.31% 18px,69.06% 16px,69.38% 12px,69.56% 12px,70.06% 12px,70.81% 12px,72.94% 12px,74.25% 14px,75.56% 14px,77.69% 17px,79.00% 15px,79.19% 12px,79.69% 13px,80.00% 17px,80.19% 17px,82.31% 13px,82.81% 15px,84.12% 13px,84.88% 12px,85.62% 13px,85.81% 17px,88.75% 16px,90.88% 12px,91.38% 12px,92.12% 13px,93.44% 12px,93.94% 12px,96.88% 12px,99.00% 13px,99.31% 12px,99.62% 12px,100.00% 12px,100% 100%,0 100%)}}

/* Polish pass: stronger paper halo behind the phone hero copy over the busy artwork. */
@media(max-width:600px){
  .page-home .home-hero .hero-description{text-shadow:0 0 3px #fff,0 1px 10px #fff,0 0 18px #fff,0 0 28px #fffb}
  .detail-nav{padding-inline:16px}
}

@media(min-width:601px) and (max-width:1150px){.product-faq-section{width:calc(100% - 48px)}}

.declaration-text{border-top-color:#15181f1f}
.declaration-text strong{color:#d90079}

.spec-list dt{color:var(--ink);font-weight:700}
.spec-list dd{color:#555d68}

.collection-note{background:#ffffffd9;border-color:#15181f1f;box-shadow:5px 6px 0 #00d5ec1d}
.collection-note strong{color:var(--ink)}
.collection-note p{color:#555d68}

.product-intro .eyebrow{color:#007d8c}

.product-description article ul li strong{color:#d90079}
.product-description article ul li{color:#3a414b}

.feature-card{background:#ffffffe6;border-color:#15181f1a;color:var(--ink)}
.feature-card span{color:var(--ink)}
.feature-card:nth-child(3n+2) b{color:#00a6b8}
.serving-mode{background:#ffffffe6;border-color:#15181f1f;color:var(--ink)}
.serving-mode strong{color:#007d8c}
.serving-mode small{color:#555d68}
.serving-mode.is-loud{color:#fff;box-shadow:6px 6px 0 #10151c}
.flavour-tagline{color:#d90079}

.product-description article p:has(>strong:only-child){color:#d90079}
.feature-card span strong{color:#d90079}
.feature-card:nth-child(3n+2) span strong{color:#00a6b8}
.detail-nav a:hover,.detail-nav a:focus-visible{color:#fff}
.product-intro p.product-tagline{text-shadow:3px 3px 0 #00d5ec4d}
.instruction-grid p:has(>strong:only-child){color:#d90079}
.product-intro .product-facts>div{background:#ffffffe6;border-color:#15181f1c}
.product-intro .product-facts strong{color:#d90079}
.product-intro .product-facts>div:nth-child(2) strong{color:#00a6b8}
.product-intro .product-facts span{color:#454c56}
.story-banner p.banner-shout{color:#d90079;text-shadow:none}
[data-theme=light] .standard-card{background:#fff;border-color:#161a2026}
[data-theme=light] .standard-card p,[data-theme=light] .about-head p:not(.eyebrow){color:#4f5660}
[data-theme=light] .standard-card:nth-child(even) b{color:#00a3b5}
[data-theme=light] .lineup-row a{background:#fff;border-color:#161a2026}
[data-theme=light] .lineup-hero img{filter:drop-shadow(0 16px 18px #10151c33)}
[data-theme=light] .lineup-row img{filter:drop-shadow(0 8px 10px #10151c26)}
[data-theme=light] .story-shout,[data-theme=light] .lineup-hero span{color:#d90079}
[data-theme=light] .lineup-merch{border-color:#161a2033}
[data-theme=light] .editorial-photo:has(.is-cutout){background:radial-gradient(circle at 50% 55%,#ff079426,transparent 62%),#fff}
[data-theme=light] .editorial-photo img.is-cutout{filter:drop-shadow(0 16px 18px #10151c33)}
[data-theme=light] .about-cta{background:radial-gradient(circle at 50% 0,#ff079418,transparent 65%),#fff;border-color:#ff079455}
[data-theme=light] .nutrition-table tbody tr:has(td:empty) th{color:#00818f}
[data-theme=light] .colour-chip .swatch{box-shadow:0 0 0 2px #161a2033}
[data-theme=light] .footer-main nav a:nth-child(even):hover{color:#00818f}
@media(max-width:600px){
  [data-theme=light] .hero .hero-description,[data-theme=light] .contact-hero .hero-description,[data-theme=light] .catalogue-hero .hero-description,[data-theme=light] .page-home .home-hero .hero-description{background:#ffffffeb;color:#10151c;box-shadow:5px 5px 0 #ff079466;text-shadow:none}
}
[data-theme=light] .category-badge{box-shadow:3px 3px 0 #10151c55}

/* Phones see only a slice of the panorama: serve that crop instead of the full 2172px image. */
@media(max-width:600px){
  .page-home .hero .hero-art{background-image:url('/assets/hero-panorama-light-m.webp');background-position:50% 50%}
  .page-products .hero .hero-art{background-image:url('/assets/hero-products-light-m.webp');background-position:50% 50%}
  .page-our-story .hero .hero-art{background-image:url('/assets/hero-about-light-m.webp');background-position:50% 50%}
  .page-lookbook .hero .hero-art{background-image:url('/assets/hero-lookbook-light-m.webp');background-position:50% 50%}
  .page-contact .hero .hero-art{background-image:url('/assets/hero-contact-light-m.webp');background-position:50% 50%}
  .page-videos .hero .hero-art{background-image:url('/assets/hero-videos-light-m.webp');background-position:50% 50%}
}
@media(max-width:600px){
  .page-faq .small-hero:after{background-image:linear-gradient(90deg,#fffaf7fa 0%,#fffaf7d8 31%,#fffaf70f 61%),linear-gradient(0deg,#fffaf7 0%,transparent 28%),url('/assets/hero-faq-light-m.webp')}
  .page-privacy .small-hero,.page-terms .small-hero{background-image:linear-gradient(90deg,#07101af2 0%,#07101ac7 54%,#07101a5c 100%),linear-gradient(0deg,#101925cf 0%,transparent 34%),url('/assets/hero-privacy-light-m.webp');background-position:50% 50%}
}
