/* Lodowy Świat — Garden Party style sheet */

:root{
  --ivory:#fffaf2;
  --cream:#fdf0de;
  --blue:#cfe9f0;
  --blue-deep:#9bcedd;
  --pink:#f8d9e3;
  --pink-deep:#f1b8cb;
  --aubergine:#4a1f45;
  --aubergine-2:#6b2f63;
  --lime:#b8d94a;
  --lime-deep:#93b52e;
  --ink:#2c1628;
  --paper:#fffdf9;

  --font-display: ui-serif, Georgia, "Iowan Old Style", "Times New Roman", serif;
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --radius: 26px;
  --shadow-soft: 0 18px 40px -20px rgba(74,31,69,.35);
  --shadow-card: 0 14px 30px -16px rgba(74,31,69,.28);
  --ease: cubic-bezier(.22,.68,0,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html,body{ overflow-x:clip; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--ivory);
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:var(--font-display); margin:0 0 .5em; line-height:1.08; color:var(--aubergine); }
p{ margin:0 0 1em; line-height:1.6; }
button{ font-family:inherit; }
svg{ display:block; }

:focus-visible{
  outline:3px solid var(--aubergine);
  outline-offset:3px;
  border-radius:4px;
}

.visually-hidden{
  position:absolute !important;
  width:1px; height:1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
}

.icon-sprite{ display:none; }

.icon{ width:22px; height:22px; stroke:currentColor; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }

.container{ max-width:1180px; margin:0 auto; padding:0 24px; }

/* ---------- Buttons ---------- */
.btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5em;
  padding:.85em 1.7em;
  border-radius:999px;
  font-size:.98rem;
  font-weight:600;
  border:2px solid var(--aubergine);
  background:transparent;
  color:var(--aubergine);
  cursor:pointer;
  overflow:hidden;
  isolation:isolate;
  min-height:44px;
  transition:color .35s var(--ease), border-color .35s var(--ease);
}
.btn::before{
  content:"";
  position:absolute;
  inset:0;
  width:100%;
  left:-100%;
  background:var(--aubergine);
  z-index:-1;
  transition:left .4s var(--ease);
}
.btn:hover::before,.btn:focus-visible::before{ left:0; }
.btn:hover,.btn:focus-visible{ color:var(--ivory); }
.btn-solid{ background:var(--aubergine); color:var(--ivory); }
.btn-solid::before{ background:var(--lime-deep); }
.btn-solid:hover,.btn-solid:focus-visible{ color:var(--aubergine); }
.btn-lime{ border-color:var(--lime-deep); background:var(--lime); color:var(--aubergine); }
.btn-lime::before{ background:var(--aubergine); }
.btn-lime:hover,.btn-lime:focus-visible{ color:var(--lime); }
.btn-ghost-dark{ border-color:var(--ivory); color:var(--ivory); }
.btn-ghost-dark::before{ background:var(--ivory); }
.btn-ghost-dark:hover,.btn-ghost-dark:focus-visible{ color:var(--aubergine); }
.btn-sm{ padding:.6em 1.2em; font-size:.88rem; }
.btn-block{ width:100%; }
.btn[disabled]{ opacity:.55; cursor:not-allowed; }

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:60;
  background:rgba(255,250,242,.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(74,31,69,.1);
}
.header-inner{
  max-width:1180px; margin:0 auto; padding:14px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
}
.logo{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.logo-mark{ width:42px; height:42px; flex-shrink:0; }
.logo-word{ font-family:var(--font-display); font-size:1.18rem; line-height:1.05; color:var(--aubergine); }
.logo-word em{ font-style:normal; color:var(--pink-deep); display:block; font-size:1.02em; }

.main-nav ul{ display:flex; gap:28px; }
.main-nav a{
  font-weight:600; font-size:.96rem; color:var(--aubergine); position:relative; padding:4px 2px;
}
.main-nav a::after{
  content:""; position:absolute; left:0; bottom:-2px; height:2px; width:100%;
  background:var(--pink-deep); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease);
}
.main-nav a:hover::after,.main-nav a:focus-visible::after{ transform:scaleX(1); }

.header-actions{ display:flex; align-items:center; gap:14px; }
.cart-link{ position:relative; display:flex; align-items:center; justify-content:center; width:44px; height:44px; }
.cart-count{
  position:absolute; top:2px; right:2px;
  background:var(--pink-deep); color:var(--aubergine);
  font-size:.68rem; font-weight:700; min-width:17px; height:17px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; line-height:1;
}
.cart-count.bump{ animation:bump .4s var(--ease); }
@keyframes bump{ 0%{ transform:scale(1); } 40%{ transform:scale(1.5); } 100%{ transform:scale(1); } }

.menu-toggle{
  display:none; width:44px; height:44px; border:none; background:none; cursor:pointer;
  align-items:center; justify-content:center; color:var(--aubergine);
}

@media (max-width:860px){
  .menu-toggle{ display:flex; }
  .main-nav{
    position:fixed; top:0; right:0; height:100%; width:min(78vw,320px);
    background:var(--aubergine); padding:100px 28px 40px;
    transform:translateX(100%); visibility:hidden;
    transition:transform .4s var(--ease), visibility .4s;
    z-index:65;
  }
  .main-nav.is-open{ transform:translateX(0); visibility:visible; }
  .main-nav ul{ flex-direction:column; gap:22px; }
  .main-nav a{ color:var(--ivory); font-size:1.1rem; }
  .main-nav a::after{ background:var(--lime); }
  body.nav-open::after{
    content:""; position:fixed; inset:0; background:rgba(44,22,40,.4); z-index:62;
  }
}

/* ---------- Grain overlay ---------- */
.grain-overlay{
  position:fixed; inset:0; width:100vw; height:100vh;
  pointer-events:none; z-index:999; opacity:.05; mix-blend-mode:multiply;
}

/* ---------- Scalloped divider ---------- */
.scallop{
  height:26px; width:100%;
  background-repeat:repeat-x; background-position:top center; background-size:26px 26px;
}
.scallop-up{ background-image:radial-gradient(circle at 13px 26px, var(--c,var(--ivory)) 13px, transparent 13.5px); }
.scallop-down{ background-image:radial-gradient(circle at 13px 0, var(--c,var(--ivory)) 13px, transparent 13.5px); }

/* ---------- Gingham pattern ---------- */
.gingham{
  background-color:var(--g-base,var(--ivory));
  background-image:
    repeating-linear-gradient(0deg, rgba(74,31,69,.09) 0 7px, transparent 7px 16px),
    repeating-linear-gradient(90deg, rgba(74,31,69,.09) 0 7px, transparent 7px 16px);
}

/* ---------- Decorative sprigs ---------- */
.sprig{ position:absolute; opacity:.85; pointer-events:none; }

/* ---------- Reveal animation ---------- */
.reveal{ opacity:1; }
.js-ready .reveal{ opacity:0; transform:translateY(26px); clip-path:inset(0 0 12% 0); }
.js-ready .reveal.in-view{
  opacity:1; transform:translateY(0); clip-path:inset(0 0 0 0);
  transition:opacity .7s var(--ease), transform .7s var(--ease), clip-path .7s var(--ease);
}
.js-ready .reveal.stagger.in-view{ transition-delay:var(--d,0ms); }

@media (prefers-reduced-motion:reduce){
  .js-ready .reveal{ opacity:1; transform:none; clip-path:none; }
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* ---------- Hero ---------- */
.hero{
  position:relative; padding:56px 0 90px; overflow:hidden;
  background:linear-gradient(180deg, var(--cream), var(--ivory) 70%);
}
.hero-grid{
  display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center;
  max-width:1180px; margin:0 auto; padding:0 24px; position:relative;
}
.hero-copy{ position:relative; }
.hero-eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:.82rem;
  letter-spacing:.08em; text-transform:uppercase; color:var(--pink-deep); margin-bottom:14px;
}
.bg-pink .hero-eyebrow{ color:var(--aubergine); }
.hero h1{
  font-size:clamp(2.4rem, 5.4vw, 4.2rem);
  margin-bottom:.4em;
}
.hero h1 em{ font-style:normal; color:var(--pink-deep); }
.hero-lede{ font-size:1.12rem; max-width:480px; }
.hero-ctas{ display:flex; gap:16px; flex-wrap:wrap; margin-top:10px; }

.hero-visual{ position:relative; aspect-ratio:1/1; max-width:520px; margin:0 auto; }
.hero-circle{
  position:absolute; inset:6%;
  border-radius:50%; overflow:hidden;
  box-shadow:var(--shadow-soft);
  border:6px solid var(--paper);
}
.hero-circle img{ width:100%; height:100%; object-fit:cover; }
.hero-ring{
  position:absolute; inset:0; width:100%; height:100%;
}
.hero-route{
  stroke-dasharray:6 10;
  stroke-dashoffset:400;
  animation:draw-route 2.6s var(--ease) .3s forwards;
}
.hero-pin{
  transform-origin:50% 100%;
  animation:pin-drop 1s var(--ease) 2.1s forwards;
  opacity:0;
}
@keyframes draw-route{ to{ stroke-dashoffset:0; } }
@keyframes pin-drop{
  0%{ opacity:0; transform:translateY(-60px) scale(.6); }
  60%{ opacity:1; transform:translateY(6px) scale(1.05); }
  80%{ transform:translateY(-4px) scale(.98); }
  100%{ opacity:1; transform:translateY(0) scale(1); }
}
@media (prefers-reduced-motion:reduce){
  .hero-route{ stroke-dashoffset:0; animation:none; }
  .hero-pin{ opacity:1; animation:none; transform:none; }
}
.hero-badge{
  position:absolute; top:-14px; right:-14px; width:92px; height:92px;
}
.hero-badge .spin{ animation:spin 22s linear infinite; transform-origin:50% 50%; }
@media (prefers-reduced-motion:reduce){ .hero-badge .spin{ animation:none; } }
@keyframes spin{ to{ transform:rotate(360deg); } }

/* ---------- Category strip ---------- */
.cat-strip{ padding:70px 0 40px; }
.section-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:30px; flex-wrap:wrap; }
.section-head h2{ font-size:clamp(1.8rem,3.4vw,2.6rem); max-width:620px; }
.section-head p{ max-width:420px; color:var(--aubergine-2); }

.cat-scroll{
  display:grid; grid-auto-flow:column; grid-auto-columns:220px; gap:18px;
  overflow-x:auto; padding:6px 6px 20px;
  scroll-snap-type:x mandatory;
}
.cat-scroll::-webkit-scrollbar{ height:6px; }
.cat-card{
  scroll-snap-align:start;
  background:var(--paper); border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow-card); text-align:center; padding-bottom:16px;
  transition:transform .35s var(--ease);
}
.cat-card:hover{ transform:translateY(-6px); }
.cat-card .cat-img{ aspect-ratio:4/3; overflow:hidden; }
.cat-card .cat-img img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.cat-card:hover .cat-img img{ transform:scale(1.08); }
.cat-card h3{ font-size:1rem; margin:14px 10px 0; }

@media (min-width:860px){
  .cat-scroll{ grid-auto-flow:row; grid-template-columns:repeat(6,1fr); overflow-x:visible; }
}

/* ---------- Signature feature: Kreator Pucharka ---------- */
.creator{
  position:relative; padding:90px 0; color:var(--ivory);
  background:var(--aubergine);
  overflow:hidden;
}
.creator::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 85% 10%, rgba(184,217,74,.25), transparent 60%);
}
.creator-inner{ position:relative; display:grid; grid-template-columns:.9fr 1.1fr; gap:48px; align-items:start; }
.creator h2{ color:var(--ivory); font-size:clamp(1.9rem,3.6vw,2.7rem); }
.creator-lede{ color:var(--blue); max-width:420px; }

.creator-box{
  background:var(--paper); border-radius:var(--radius); padding:28px; color:var(--ink);
  box-shadow:var(--shadow-soft);
}
.creator-step{ margin-bottom:22px; }
.creator-step h3{ font-size:1rem; margin-bottom:10px; display:flex; align-items:center; gap:8px; }
.step-num{
  display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px;
  border-radius:50%; background:var(--lime); color:var(--aubergine); font-size:.78rem; font-weight:700;
}
.option-grid{ display:flex; flex-wrap:wrap; gap:10px; }
.scoop-option{
  position:relative;
}
.scoop-option input{ position:absolute; opacity:0; width:100%; height:100%; cursor:pointer; margin:0; }
.scoop-option span{
  display:inline-flex; align-items:center; gap:8px; padding:.55em 1em; border-radius:999px;
  border:2px solid var(--blue-deep); font-size:.88rem; font-weight:600; transition:all .25s var(--ease);
}
.scoop-option:has(input:checked) span{ background:var(--aubergine); color:var(--ivory); border-color:var(--aubergine); }
.scoop-option:has(input:focus-visible) span{ outline:3px solid var(--pink-deep); outline-offset:2px; }

.creator-summary{
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  border-top:1px dashed var(--blue-deep); padding-top:20px; margin-top:6px;
}
.creator-total{ font-family:var(--font-display); font-size:1.5rem; color:var(--aubergine); }
.creator-note{ font-size:.85rem; color:var(--aubergine-2); min-height:1.2em; }

/* ---------- Featured products / product grid ---------- */
.products-section{ padding:80px 0; }
.product-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:24px; }
.product-card{
  background:var(--paper); border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow-card); display:flex; flex-direction:column;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.product-card:hover{ transform:translateY(-8px); box-shadow:0 26px 46px -18px rgba(74,31,69,.4); }
.product-media{ aspect-ratio:4/3; overflow:hidden; position:relative; }
.product-media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.product-card:hover .product-media img{ transform:scale(1.09); }
.product-tag{
  position:absolute; top:10px; left:10px; background:var(--lime); color:var(--aubergine);
  font-size:.7rem; font-weight:700; padding:.3em .7em; border-radius:999px; text-transform:uppercase; letter-spacing:.04em;
}
.product-body{ padding:18px 18px 22px; display:flex; flex-direction:column; gap:8px; flex:1; }
.product-body h3{ font-size:1.08rem; margin-bottom:0; }
.product-body p{ font-size:.9rem; color:var(--aubergine-2); margin-bottom:0; flex:1; }
.product-price-row{ display:flex; align-items:center; justify-content:space-between; margin-top:8px; }
.price{ font-family:var(--font-display); font-size:1.25rem; color:var(--aubergine); }
.unit{ font-size:.75rem; color:var(--aubergine-2); }

/* ---------- Catalog filters ---------- */
.catalog-head{ padding:70px 0 20px; text-align:center; }
.filter-bar{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin:26px 0 44px; }
.filter-chip{
  padding:.5em 1.1em; border-radius:999px; border:2px solid var(--blue-deep); background:var(--paper);
  font-weight:600; font-size:.85rem; cursor:pointer; min-height:40px; transition:all .25s var(--ease);
}
.filter-chip.is-active{ background:var(--aubergine); border-color:var(--aubergine); color:var(--ivory); }

/* ---------- About teaser / sections with image ---------- */
.split-section{ padding:80px 0; }
.split-grid{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.split-grid img{ border-radius:var(--radius); box-shadow:var(--shadow-card); aspect-ratio:4/3; object-fit:cover; width:100%; height:100%; }
.split-grid.reverse{ direction:rtl; }
.split-grid.reverse > *{ direction:ltr; }

/* ---------- Newsletter / footer ---------- */
.newsletter{ padding:50px 0; }
.newsletter-box{
  border-radius:var(--radius); padding:40px; display:flex; flex-wrap:wrap; gap:24px;
  align-items:center; justify-content:space-between;
}
.newsletter-box h2{ font-size:1.5rem; margin-bottom:.2em; }
.newsletter-form{ display:flex; gap:10px; flex-wrap:wrap; }
.newsletter-form input[type=email]{
  padding:.8em 1.1em; border-radius:999px; border:2px solid var(--blue-deep); min-width:230px; font-size:.95rem;
}

.site-footer{ background:var(--aubergine); color:var(--blue); padding:60px 0 28px; }
.footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:32px; margin-bottom:40px; }
.footer-brand .logo-word{ color:var(--ivory); }
.footer-brand .logo-word em{ color:var(--lime); }
.footer-brand p{ color:var(--blue); font-size:.9rem; max-width:280px; margin-top:12px; }
.footer-col h4{ color:var(--ivory); font-size:.9rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:14px; }
.footer-col ul{ display:flex; flex-direction:column; gap:10px; }
.footer-col a{ color:var(--blue); font-size:.92rem; transition:color .25s; }
.footer-col a:hover{ color:var(--lime); }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.15); padding-top:22px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:.82rem; color:var(--blue);
}
.footer-bottom a{ color:var(--lime); }

/* ---------- Forms (generic) ---------- */
.form-grid{ display:grid; gap:18px; }
.field{ display:flex; flex-direction:column; gap:6px; }
.field label{ font-weight:600; font-size:.88rem; }
.field input,.field select,.field textarea{
  padding:.75em .95em; border-radius:14px; border:2px solid var(--blue-deep);
  background:var(--paper); font-size:.96rem; accent-color:var(--aubergine); font-family:inherit;
}
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--aubergine); }
.field-check{ display:flex; align-items:flex-start; gap:10px; flex-direction:row; }
.field-check input{ width:20px; height:20px; margin-top:2px; accent-color:var(--aubergine); flex-shrink:0; }
.field-error{ color:#9b2c40; font-size:.82rem; min-height:1.1em; }
.form-status{ padding:14px 18px; border-radius:14px; font-size:.92rem; margin-top:10px; display:none; }
.form-status.show{ display:block; }
.form-status.ok{ background:var(--lime); color:var(--aubergine); }
.form-status.error{ background:#f6d3d9; color:#7a1f31; }
.honey{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }

/* ---------- Page header (sub pages) ---------- */
.page-head{ padding:64px 0 36px; text-align:center; }
.page-head p{ max-width:560px; margin:0 auto; color:var(--aubergine-2); }

/* ---------- Content pages (legal etc) ---------- */
.prose{ max-width:760px; margin:0 auto; padding:0 0 90px; }
.prose h2{ margin-top:1.6em; font-size:1.4rem; }
.prose ul{ list-style:disc; padding-left:1.3em; margin-bottom:1em; }
.prose li{ margin-bottom:.4em; line-height:1.6; }

/* ---------- FAQ ---------- */
.faq-list{ max-width:760px; margin:0 auto; padding-bottom:90px; display:flex; flex-direction:column; gap:14px; }
.faq-item{ background:var(--paper); border-radius:18px; box-shadow:var(--shadow-card); overflow:hidden; }
.faq-item summary{
  cursor:pointer; padding:18px 22px; font-weight:700; list-style:none; display:flex; justify-content:space-between; gap:10px;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:"+"; font-size:1.3rem; color:var(--pink-deep); }
.faq-item[open] summary::after{ content:"–"; }
.faq-item p{ padding:0 22px 20px; color:var(--aubergine-2); }

/* ---------- Product detail page ---------- */
.product-detail{ padding:50px 0 90px; }
.detail-grid{ display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:flex-start; }
.detail-media{ border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-soft); aspect-ratio:1/1; }
.detail-media img{ width:100%; height:100%; object-fit:cover; }
.detail-info .category-pill{
  display:inline-block; background:var(--pink); color:var(--aubergine); font-size:.78rem; font-weight:700;
  padding:.3em .9em; border-radius:999px; margin-bottom:14px; text-transform:uppercase; letter-spacing:.04em;
}
.detail-info h1{ font-size:clamp(1.8rem,3.4vw,2.6rem); }
.detail-price{ font-family:var(--font-display); font-size:2rem; color:var(--aubergine); margin-bottom:18px; }
.qty-row{ display:flex; align-items:center; gap:14px; margin:20px 0; }
.qty-control{ display:flex; align-items:center; border:2px solid var(--blue-deep); border-radius:999px; overflow:hidden; }
.qty-control button{ width:44px; height:44px; border:none; background:none; font-size:1.1rem; cursor:pointer; color:var(--aubergine); }
.qty-control input{ width:44px; text-align:center; border:none; font-size:1rem; font-family:inherit; background:none; }
.detail-meta{ margin-top:28px; display:flex; gap:22px; flex-wrap:wrap; }
.detail-meta div{ display:flex; align-items:center; gap:8px; font-size:.86rem; color:var(--aubergine-2); }

/* ---------- Cart / Checkout ---------- */
.cart-section{ padding:60px 0 100px; }
.cart-layout{ display:grid; grid-template-columns:1.6fr 1fr; gap:40px; align-items:flex-start; }
.cart-table{ width:100%; border-collapse:collapse; }
.cart-table th{ text-align:left; font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; color:var(--aubergine-2); padding-bottom:12px; }
.cart-row td{ padding:14px 0; border-top:1px solid rgba(74,31,69,.12); vertical-align:middle; }
.cart-item{ display:flex; gap:14px; align-items:center; }
.cart-item img{ width:64px; height:64px; border-radius:14px; object-fit:cover; flex-shrink:0; }
.cart-item-name{ font-weight:700; }
.cart-remove{ background:none; border:none; color:#9b2c40; font-size:.82rem; font-weight:600; cursor:pointer; padding:6px; }
.cart-empty{ text-align:center; padding:60px 20px; }
.summary-box{ background:var(--paper); border-radius:var(--radius); padding:28px; box-shadow:var(--shadow-card); position:sticky; top:100px; }
.summary-row{ display:flex; justify-content:space-between; margin-bottom:12px; font-size:.95rem; }
.summary-total{ font-family:var(--font-display); font-size:1.4rem; color:var(--aubergine); border-top:1px dashed var(--blue-deep); padding-top:14px; margin-top:4px; }
.checkout-panel{ margin-top:50px; }

/* ---------- Cookie banner ---------- */
.cookie-banner{
  position:fixed; bottom:16px; left:16px; right:16px; max-width:640px; margin:0 auto;
  background:var(--aubergine); color:var(--ivory); border-radius:20px; padding:22px 24px;
  box-shadow:var(--shadow-soft); z-index:90; display:none; gap:14px; flex-wrap:wrap; align-items:center; justify-content:space-between;
}
.cookie-banner.show{ display:flex; }
.cookie-banner p{ margin:0; font-size:.88rem; flex:1 1 260px; color:var(--blue); }
.cookie-banner a{ color:var(--lime); text-decoration:underline; }
.cookie-actions{ display:flex; gap:10px; flex-wrap:wrap; }

/* ---------- Utility sections ---------- */
.bg-blue{ background:var(--blue); }
.bg-pink{ background:var(--pink); }
.bg-cream{ background:var(--cream); }

@media (max-width:900px){
  .hero-grid{ grid-template-columns:1fr; text-align:center; }
  .hero-lede{ margin-inline:auto; }
  .hero-ctas{ justify-content:center; }
  .creator-inner{ grid-template-columns:1fr; }
  .split-grid{ grid-template-columns:1fr; }
  .split-grid.reverse{ direction:ltr; }
  .detail-grid{ grid-template-columns:1fr; }
  .cart-layout{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .footer-grid{ grid-template-columns:1fr; }
  .newsletter-box{ flex-direction:column; align-items:flex-start; }
}