:root{--ink:#07100a;--deep:#0b1b11;--deep2:#102619;--green:#9cff38;--paper:#f1f3e9;--muted:#a8b3ab;--line:rgba(255,255,255,.13);--max:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:#fff;font-family:Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}.wrap{width:min(var(--max),calc(100% - 40px));margin:auto}.nav{position:sticky;top:0;z-index:50;background:rgba(7,16,10,.93);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.navin{height:76px;display:flex;align-items:center;justify-content:space-between}.brand{font-weight:950;letter-spacing:-1.8px;font-size:25px}.brand b{color:var(--green)}.links{display:flex;align-items:center;gap:26px;font-size:14px}.links a:hover{color:var(--green)}.pill{border:1px solid var(--green);padding:11px 17px;border-radius:999px;color:var(--green);font-weight:800}.langs{display:flex;gap:8px;font-size:11px}.langs a{padding:7px;border:1px solid var(--line);border-radius:4px}.menu{display:none;background:none;border:0;color:#fff;font-size:26px}.hero{min-height:680px;display:flex;align-items:center;position:relative;overflow:hidden;background:radial-gradient(circle at 78% 42%,#285127 0,#102818 24%,#07100a 55%)}.hero:before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:60px 60px}.hero-copy{position:relative;z-index:2;width:62%}.eyebrow,.kicker{font-size:12px;font-weight:900;letter-spacing:2.2px;text-transform:uppercase;color:var(--green)}h1{font-size:clamp(58px,8vw,112px);line-height:.82;letter-spacing:-6px;margin:18px 0 28px;text-transform:uppercase}h1 span{color:var(--green)}.hero p,.lead{font-size:19px;line-height:1.6;color:#c7d0ca;max-width:620px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.btn{display:inline-flex;padding:15px 22px;background:var(--green);color:#07100a;font-weight:900;border-radius:4px}.btn.alt{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.3)}.product-visual{position:absolute;right:5%;bottom:7%;width:31%;max-width:440px;aspect-ratio:.7;border-radius:24px;background:linear-gradient(145deg,#17281b,#07100a);border:1px solid var(--line);box-shadow:0 35px 80px #0008;display:flex;align-items:center;justify-content:center;transform:rotate(3deg)}.bottle-css{width:48%;height:70%;background:linear-gradient(90deg,#f5f5ef,#d7dbd3 45%,#fafaf6);border-radius:12px 12px 22px 22px;position:relative;box-shadow:0 20px 40px #0007}.bottle-css:before{content:'';position:absolute;width:58%;height:13%;left:21%;top:-10%;background:#111;border-radius:6px 6px 2px 2px}.label{position:absolute;left:8%;right:8%;top:25%;bottom:13%;background:#d9ff35;color:#07100a;padding:14px 8px;text-align:center;font-weight:950;font-size:clamp(13px,1.5vw,22px);display:flex;flex-direction:column;justify-content:center}.label small{font-size:9px;letter-spacing:1px;margin-top:8px}.bar{background:#0b1710;border-block:1px solid var(--line)}.bar .wrap{display:grid;grid-template-columns:repeat(4,1fr)}.bar .wrap > div{text-align:center;padding:22px 10px;border-right:1px solid var(--line);font-size:12px;text-transform:uppercase;letter-spacing:1.3px;font-weight:800}.section{padding:100px 0}.light{background:var(--paper);color:var(--ink)}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}h2{font-size:clamp(40px,5vw,70px);line-height:.96;letter-spacing:-3px;margin:14px 0 24px}.light .lead{color:#455249}.copy{line-height:1.75;color:#aeb9b2}.light .copy{color:#5d685f}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:44px}.card{border:1px solid var(--line);padding:30px;border-radius:8px;background:linear-gradient(160deg,rgba(156,255,56,.055),transparent 60%);min-height:235px}.light .card{border-color:#cad0c7;background:#fff}.card .num{color:var(--green);font-weight:900;font-size:12px}.light .card .num{color:#568c22}.card h3{font-size:23px;margin:45px 0 10px}.card p{line-height:1.6;color:#aeb9b2}.light .card p{color:#5f6a62}.callout{padding:28px;border-left:4px solid var(--green);background:#102116;line-height:1.65}.light .callout{background:#e3ead8}.split{display:grid;grid-template-columns:1.2fr .8fr;gap:60px}.facts{border-top:1px solid var(--line)}.fact{display:grid;grid-template-columns:150px 1fr;gap:20px;padding:20px 0;border-bottom:1px solid var(--line)}.fact strong{color:var(--green)}.stock{background:var(--green);color:#07100a}.stock .copy{color:#284015}.distributor{padding:24px 0;border-top:1px solid #07100a44}.distributor h3{font-size:23px;margin:0 0 7px}.footer{padding:65px 0 28px;background:#040806}.footergrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:50px}.footer p,.footer a{color:#98a39c;line-height:1.8}.fine{margin-top:50px;padding-top:22px;border-top:1px solid var(--line);color:#727e76;font-size:12px}.pagehero{padding:105px 0 85px;background:radial-gradient(circle at 80% 30%,#1f4722,#0a1b10 35%,#07100a 68%)}.pagehero h1{font-size:clamp(52px,7vw,92px);max-width:850px}.crumb{font-size:12px;color:#9ba69e;margin-bottom:22px}.notice{font-size:13px;padding:16px 18px;background:#14241a;border:1px solid var(--line);border-radius:5px;color:#bec8c1}.faq details{border-top:1px solid #cad0c7;padding:20px 0}.faq summary{font-weight:800;cursor:pointer}.faq p{color:#5d685f;line-height:1.65}.contactbox{padding:35px;background:#102116;border:1px solid var(--line)}
@media(max-width:850px){.menu{display:block}.links{display:none;position:absolute;top:76px;left:0;right:0;background:#07100a;padding:22px 20px;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line)}.links.open{display:flex}.langs{margin-top:6px}.hero{min-height:760px;align-items:flex-start;padding-top:100px}.hero-copy{width:100%}.product-visual{opacity:.25;width:60%;right:-13%;bottom:4%}.bar .wrap{grid-template-columns:1fr 1fr}.grid2,.split{grid-template-columns:1fr;gap:42px}.cards{grid-template-columns:1fr 1fr}.footergrid{grid-template-columns:1fr 1fr}.section{padding:75px 0}}@media(max-width:540px){.wrap{width:min(var(--max),calc(100% - 28px))}h1{letter-spacing:-3px}.cards{grid-template-columns:1fr}.bar .wrap{grid-template-columns:1fr}.bar .wrap > div{border-right:0;border-bottom:1px solid var(--line)}.footergrid{grid-template-columns:1fr}.fact{grid-template-columns:1fr;gap:4px}.pagehero{padding:75px 0 60px}}
.real-product{background:transparent;border:0;box-shadow:none;transform:none;overflow:visible}.real-product img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 35px 45px rgba(0,0,0,.55))}.product-gallery{background:#090e0b}.green{color:var(--green)}.packshots{display:flex;align-items:flex-end;justify-content:center;gap:28px;min-height:430px}.packshots img{max-width:46%;max-height:420px;object-fit:contain;filter:drop-shadow(0 25px 35px rgba(0,0,0,.45))}@media(max-width:850px){.real-product{opacity:.48;width:55%;right:-7%}.packshots{min-height:320px}.packshots img{max-height:310px}}@media(max-width:540px){.packshots{gap:8px;min-height:250px}.packshots img{max-width:49%;max-height:240px}}

/* V3 — packaging-led SuperBoost identity */
:root{--ink:#000;--deep:#050505;--deep2:#0a0a0a;--green:#48c8ee;--blue:#48c8ee;--paper:#f5f7f8;--muted:#aeb7bc;--line:rgba(72,200,238,.22)}
body{background:#000}.nav{background:rgba(0,0,0,.94);border-bottom:1px solid rgba(72,200,238,.28)}
.navin{height:84px}.brand{font-size:23px;letter-spacing:-1.2px;display:flex;align-items:center;gap:10px}.brand b{color:#fff}.brand:before{content:'S';display:grid;place-items:center;width:34px;height:34px;border:3px solid #fff;transform:rotate(45deg);font-size:17px;line-height:1;font-weight:950;color:#fff}.brand:before{font-family:Arial,sans-serif}.brand{color:#fff}.brand:hover:before{border-color:var(--blue);color:var(--blue)}
.links a:hover{color:var(--blue)}.pill{border:0;background:var(--blue);color:#000;border-radius:2px;text-transform:uppercase;letter-spacing:.7px}.pill:hover{background:#fff!important;color:#000!important}.langs a{border-color:rgba(72,200,238,.28)}
.hero{min-height:720px;background:radial-gradient(circle at 76% 48%,#122a33 0,#071014 22%,#000 58%)}.hero:before{background-image:linear-gradient(rgba(72,200,238,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(72,200,238,.045) 1px,transparent 1px);background-size:64px 64px}.hero:after{content:'S';position:absolute;right:8%;top:17%;width:370px;height:370px;border:18px solid rgba(255,255,255,.045);transform:rotate(45deg);display:grid;place-items:center;font-size:190px;font-weight:950;color:rgba(72,200,238,.045);line-height:1}.hero-copy{width:58%}.eyebrow,.kicker{color:var(--blue)}h1{color:#fff}.hero h1 span{color:var(--blue)}.hero p,.lead{color:#d2d7da}.btn{background:var(--blue);color:#000;border-radius:2px;text-transform:uppercase;letter-spacing:.65px}.btn:hover{background:#fff}.btn.alt{border-color:var(--blue);color:#fff}.btn.alt:hover{color:#000}.product-visual{z-index:2}.bar{background:#050505;border-color:rgba(72,200,238,.2)}.bar .wrap > div{border-color:rgba(72,200,238,.18)}.bar .wrap > div:before{content:'◆';color:var(--blue);font-size:8px;margin-right:9px}.light{background:#f4f6f7}.card{background:linear-gradient(160deg,rgba(72,200,238,.06),transparent 60%)}.card .num,.light .card .num{color:var(--blue)}.light .callout{background:#e5f7fc;border-left-color:var(--blue)}.callout{border-left-color:var(--blue)}.fact strong{color:var(--blue)}
.stock{background:var(--blue);color:#000}.stock .kicker{color:#000!important}.stock .copy{color:#10242b}.stock .distributor{border-color:rgba(0,0,0,.28)}
.footer{background:#000;border-top:1px solid rgba(72,200,238,.2)}.footer .brand b{color:#fff}.fine{border-color:rgba(72,200,238,.16)}
.pagehero{background:radial-gradient(circle at 82% 30%,#12313d,#061014 36%,#000 70%);position:relative;overflow:hidden}.pagehero:after{content:'S';position:absolute;right:9%;top:15%;width:240px;height:240px;border:12px solid rgba(72,200,238,.07);transform:rotate(45deg);display:grid;place-items:center;font-size:120px;font-weight:950;color:rgba(255,255,255,.04)}.pagehero h1{position:relative;z-index:2}.notice{background:#071319;border-color:rgba(72,200,238,.25)}.contactbox{background:#071319;border-color:rgba(72,200,238,.25)}.green{color:var(--blue)}.product-gallery{background:#030607}.packshots{position:relative}.packshots:before{content:'S';position:absolute;width:250px;height:250px;border:12px solid rgba(72,200,238,.08);transform:rotate(45deg);display:grid;place-items:center;font-size:120px;font-weight:950;color:rgba(255,255,255,.04)}
@media(max-width:850px){.links{background:#000;border-color:rgba(72,200,238,.25)}.hero:after{width:260px;height:260px;right:-10%;top:34%;font-size:130px}.hero-copy{width:100%}.pagehero:after{right:-80px}.brand{font-size:20px}.brand:before{width:30px;height:30px}}


/* Four aligned feature blocks */
.bar .wrap {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 0;
}
.bar .wrap > div {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  text-align: center;
}
@media (max-width: 850px) {
  .bar .wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 540px) {
  .bar .wrap { grid-template-columns: 1fr; }
}

/* Extra logo spacing on Spanish homepage */
@media (min-width: 851px) {
  .es-nav .brand { margin-right: 28px; }
}

/* Homepage 1L and 5L bottles side by side */
.hero .product-visual.real-product { display: flex; align-items: center; justify-content: center; gap: 16px; }
.hero .product-visual.real-product img { width: 46%; max-width: 260px; height: auto; object-fit: contain; }

/* Larger homepage bottles in all languages */
.hero .product-visual.real-product img { width: 49%; max-width: 360px; }

/* Larger paired bottles on all three homepages */
@media (min-width: 851px) {
  .hero .product-visual.real-product { width: 48%; max-width: 700px; right: 1%; bottom: 5%; gap: 12px; }
  .hero .product-visual.real-product img { width: 49%; max-width: none; height: auto; }
}

/* Lower the paired bottles on desktop */
@media (min-width: 851px) {
  .hero .product-visual.real-product { bottom: -8%; }
}

/* Keep both homepage bottles visible */
@media (min-width: 851px) {
.hero .product-visual.real-product { aspect-ratio: auto; height: 500px; bottom: -8%; }
.hero .product-visual.real-product img { max-height: 480px; object-fit: contain; }
}

/* Ensure both German homepage bottles are visible */
.hero .product-visual.real-product img { flex-shrink: 0; }

/* Official SuperBoost logo */
.brand-logo { display: block; width: 58px; height: 58px; object-fit: contain; }
.footer .brand-logo { width: 90px; height: 90px; }

/* Larger official logo and remove old S emblem */
.nav .brand-logo { width: 116px; height: 116px; }
.nav .brand:before { display: none; }

/* Move the SuperBoost header logo lower */
.nav .brand-logo { transform: translateY(15px); }

/* Fine-tune header logo position */
.nav .brand-logo { transform: translateY(23px); }

/* Hide old S symbol in all footers */
.footer .brand:before { display: none; }

/* Remove decorative S behind bottle images */
.packshots::before { display: none !important; }

/* Hide decorative S graphics */
.hero::after, .packshots::before { display: none !important; }

/* SuperBoost photo gallery */
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin-top: 36px;
}

.gallery-grid a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #101820;
  border: 1px solid rgba(72, 200, 238, .3);
  border-radius: 8px;
  transition: transform .2s, border-color .2s;
}

.gallery-grid a:hover {
  transform: translateY(-4px);
  border-color: #48c8ee;
}

.gallery-grid img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (max-width: 850px) {
  .gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
}

@media (max-width: 540px) {
  .gallery-grid {
    grid-template-columns: 1fr;
  }
}


/* Match the four foliar nutrition boxes to the callout */
.light .cards .card {
  background: #e5f7fc;
}

/* Additional customer review screenshots */
.review-screenshots {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 40px;
}
.review-screenshots a {
  display: block;
  background: #fff;
  border: 1px solid #d5e2e7;
  border-radius: 8px;
  overflow: hidden;
}
.review-screenshots img {
  display: block;
  width: 100%;
  height: auto;
}
@media (max-width: 700px) {
  .review-screenshots {
    grid-template-columns: 1fr;
  }
}
