/* Modern Product Page Styles (2025) */
.product-section { padding-top: var(--space-8); padding-bottom: var(--space-8); }
.product-modern {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-7);
  align-items: flex-start;
  margin-bottom: var(--space-7);
}
.product-gallery {
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  padding: var(--space-6);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  min-height: 420px;
}
.product-gallery { position:relative; }
.product-img-counter { position:absolute; top:.75rem; right:.75rem; background:rgba(0,0,0,.55); color:#fff; font-size:.75rem; padding:.35rem .55rem; border-radius:.5rem; letter-spacing:.5px; font-weight:600; backdrop-filter:blur(4px); }
.product-main-img {
  max-width: 100%;
  height: auto;
  border-radius: var(--radius-lg);
  /* Removed box-shadow for cleaner look */
  box-shadow: none;
}
.product-info-panel {
  position: sticky;
  top: 6.5rem;
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  padding: var(--space-6);
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}
.product-title {
  font-size: clamp(2rem, 4vw, 2.7rem);
  font-weight: 700;
  margin-bottom: var(--space-3);
}
.product-short {
  font-size: 1.15rem;
  opacity: .92;
  margin-bottom: var(--space-3);
}
.product-price-row {
  display: flex;
  align-items: center;
  gap: var(--space-5);
  margin-bottom: var(--space-4);
}
.product-price {
  font-size: 1.7rem;
    .site-header .header-cta .btn { padding:.55rem .85rem; font-size:.85rem; }
  color: var(--brand-primary);
}
.product-qty {
  display: flex;
    .header-cta { margin-right:3.1rem; }
  gap: .5rem;
}
.qty-btn {
  background: var(--brand-light);
  border: 1px solid var(--brand-primary);
  color: var(--brand-primary);
  font-size: 1.25rem;
  border-radius: 50%;
  width: 2.2rem;
  height: 2.2rem;
  cursor: pointer;
  transition: var(--transition);
}
.qty-btn:hover, .qty-btn:focus-visible {
  background: var(--brand-primary);
  color: #fff;
}
.qty-input {
  width: 3.2rem;
  font-size: 1.1rem;
  text-align: center;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-sm);
  padding: .3rem .5rem;
}
.product-buy-btn {
  margin-bottom: var(--space-3);
  font-size: 1.15rem;
  padding: 1rem 2.2rem;
  border-radius: 2rem;
}
.product-benefits {
  display: flex;
  gap: var(--space-3);
  flex-wrap: wrap;
  margin: var(--space-4) 0 0 0;
  padding: 0;
  list-style: none;
}
.product-benefits li {
  background: var(--brand-light);
  color: var(--brand-primary);
  font-weight: 600;
  border-radius: 2rem;
  padding: .5rem 1.2rem;
  font-size: 1rem;
  display: flex;
  align-items: center;
  gap: .5rem;
  box-shadow: var(--shadow-sm);
}
.benefit-icon {
  font-size: 1.2em;
}
.product-tabs {
  display: flex;
  gap: var(--space-4);
  margin-bottom: var(--space-4);
  border-bottom: 2px solid #e2e8f0;
}
/* Product lightbox overlay */
.product-lightbox { position: fixed; inset:0; background: rgba(0,0,0,.85); z-index: 9999; display:flex; align-items:center; justify-content:center; padding:2rem; }
.product-lightbox .lightbox-inner { position:relative; max-width: min(90vw,1200px); width:100%; display:flex; align-items:center; gap:1rem; }
.product-lightbox .lightbox-stage { flex:1; display:flex; align-items:center; justify-content:center; }
.product-lightbox .lightbox-img { max-width:100%; max-height:80vh; border-radius:12px; box-shadow:0 12px 48px rgba(0,0,0,.5); }
.product-lightbox button { background: rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.25); color:#fff; cursor:pointer; font-size:1.75rem; line-height:1; padding:.6rem 1rem; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; backdrop-filter: blur(4px); transition:background .25s ease, transform .25s ease; }
.product-lightbox button:hover, .product-lightbox button:focus { background: rgba(255,255,255,.25); outline:none; transform:scale(1.05); }
.product-lightbox .lightbox-close { position:absolute; top:-1rem; right:-1rem; font-size:2rem; padding:.65rem .9rem; border-radius:50%; }
.product-lightbox .lightbox-prev, .product-lightbox .lightbox-next { font-size:2.2rem; }
@media (max-width: 780px){
  .product-lightbox { padding:1rem; }
  .product-lightbox .lightbox-inner { flex-direction:column; }
  .product-lightbox .lightbox-prev, .product-lightbox .lightbox-next { position:absolute; top:50%; transform:translateY(-50%); }
  .product-lightbox .lightbox-prev { left:.5rem; }
  .product-lightbox .lightbox-next { right:.5rem; }
}
/* Shop filters */
.shop-filters { display:flex; gap:.75rem; flex-wrap:wrap; margin:.25rem 0 1rem; }
.shop-filters button { background:#fff; border:1px solid #d0d7e2; padding:.55rem 1rem; border-radius:2rem; font-size:.85rem; font-weight:600; cursor:pointer; transition:background .25s ease, color .25s ease, border-color .25s ease; }
.shop-filters button:hover, .shop-filters button:focus-visible { background: var(--brand-light); outline:none; }
.shop-filters button.is-active { background: var(--brand-primary); color:#fff; border-color: var(--brand-primary); box-shadow:0 4px 16px rgba(10,160,255,.25); }
.tab-btn {
  background: none;
  border: none;
  font: inherit;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--brand-dark);
  padding: .7rem 1.2rem;
  cursor: pointer;
  border-radius: var(--radius-md) var(--radius-md) 0 0;
  transition: var(--transition);
  border-bottom: 2px solid transparent;
}
.tab-btn.active {
  color: var(--brand-primary);
  border-bottom: 2px solid var(--brand-primary);
  background: var(--brand-light);
}
.product-tab-content {
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  padding: var(--space-6);
  margin-bottom: var(--space-7);
  animation: fadeIn .4s ease;
}
/* Unified cart + booking button styles (desktop first) */
.cart-btn-combined { display:inline-flex; align-items:center; gap:.4rem; padding:.5rem .78rem; border-radius:1.75rem; line-height:1.05; overflow:visible; }
.cart-btn-combined .cart-icon-inline { display:none; line-height:1; }
.cart-btn-combined .cart-icon-inline svg { width:1.05rem; height:1.05rem; display:block; }
.header-cta [data-soon] { padding:.55rem 1rem; border-radius:2rem; display:inline-flex; align-items:center; gap:.45rem; }
/* Icon-only & compact states */
@media (max-width: 920px){
  .cart-btn-combined { padding:.5rem .75rem; }
  .cart-btn-combined .cart-label-desktop { display:none; }
  .cart-btn-combined .cart-icon-inline { display:inline; }
  .header-cta [data-soon] { padding:.5rem .75rem; }
}
@media (max-width: 820px){
  .nav-wrapper { position:relative; }
  .nav-toggle { position:absolute; top:.55rem; right:.55rem; z-index:1150; }
  .header-cta { margin-right:3.0rem; }
  .cart-btn-combined { padding:.36rem .46rem; gap:0; position:relative; min-width:0; }
  .cart-btn-combined .cart-icon-inline { display:inline; }
  /* Badge sits slightly inside to avoid clipping */
  .cart-btn-combined .badge { margin-left:0; position:absolute; top:-2px; right:-2px; font-size:.55rem; padding:.18rem .36rem; line-height:1; border-radius:1rem; box-shadow:0 0 0 1px #fff; }
  .header-cta [data-soon] { padding:.44rem .54rem; }
  .header-cta [data-soon] .btn-label { display:none; }
  .header-cta [data-soon] .icon-inline { display:inline-flex; }
}
@media (max-width: 580px){
  .header-cta { gap:.38rem; margin-right:2.75rem; }
  .cart-btn-combined { padding:.32rem .42rem; }
  .cart-btn-combined .badge { top:-2px; right:-2px; }
  .header-cta [data-soon] { padding:.32rem .42rem; }
}
@media (max-width: 430px){
  .header-cta { gap:.32rem; margin-right:2.55rem; }
  .cart-btn-combined { padding:.3rem .4rem; }
  .header-cta [data-soon] { padding:.3rem .4rem; }
}
@media (max-width: 900px) {
  .product-modern {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }
  .product-info-panel {
    position: static;
    top: auto;
  }
  .product-gallery { align-items:center; }
}

/* Product gallery thumbnails */
.product-thumbs {
  display:flex;
  gap:.5rem;
  margin-top: .75rem;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
}
.product-thumbs .thumb-btn {
  background: transparent;
  border: 2px solid transparent;
  padding: .15rem;
  border-radius: .5rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: box-shadow 180ms ease, border-color 180ms ease, transform 120ms ease;
}
.product-thumbs .thumb-btn img {
  width:64px;
  height:64px;
  object-fit:cover;
  border-radius: .4rem;
  display:block;
}
.product-thumbs .thumb-btn:hover,
.product-thumbs .thumb-btn:focus {
  transform: translateY(-3px);
  border-color: rgba(10,160,255,.18);
  box-shadow: 0 6px 18px rgba(10,160,255,.06);
  outline: none;
}
.product-thumbs .thumb-btn[aria-pressed="true"] {
  border-color: var(--brand-primary);
  box-shadow: 0 8px 28px rgba(10,160,255,.12);
}

/* Make main image slightly constrained on mobile for nicer spacing */
@media (max-width: 480px){
  .product-gallery { padding: var(--space-4); }
  .product-main-img { max-width: 100%; width:100%; border-radius: 14px; }
  .product-thumbs .thumb-btn img { width:56px; height:56px; }
}

/* Mobile: render thumbs as small dots beneath main image for compact UI */
@media (max-width: 520px) {
  .product-thumbs { gap:.6rem; margin-top:.85rem; justify-content:center; }
  .product-thumbs .thumb-btn { width:12px; height:12px; padding:0; border-radius:50%; border:2px solid var(--brand-primary); background:rgba(10,160,255,.15); position:relative; }
  .product-thumbs .thumb-btn img { display:none; }
  .product-thumbs .thumb-btn[aria-pressed="true"] { background: var(--brand-primary); box-shadow:0 0 0 4px rgba(10,160,255,.15); }
  .product-thumbs .thumb-btn:focus-visible { outline:2px solid var(--brand-accent); outline-offset:2px; }
  .product-thumbs .thumb-btn:hover { background: var(--brand-primary); }
}
/* Floating cart (desktop & large tablets) */
#floating-cart-btn { position:fixed; bottom:5.25rem; right:1.05rem; background:var(--brand-primary); color:#fff; width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; text-decoration:none; box-shadow:0 8px 28px rgba(10,160,255,.35); font-size:1.45rem; z-index:950; border:2px solid #fff; backdrop-filter:blur(4px); opacity:0; transform:translateY(20px) scale(.9); pointer-events:none; transition:opacity .35s var(--transition), transform .35s var(--transition); }
#floating-cart-btn .count { position:absolute; top:-6px; right:-6px; background:#ff2752; color:#fff; font-size:.7rem; font-weight:700; padding:.25rem .5rem; border-radius:1rem; box-shadow:0 2px 6px rgba(0,0,0,.35); min-width:1.2rem; text-align:center; }
#floating-cart-btn.is-visible { opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
@media (max-width: 820px){
  #floating-cart-btn { display:none; }
}
/* (Removed older mobile cart sizing block; consolidated above) */

/* ================= Checkout Flow ================= */
.checkout-flow { max-width:960px; margin:2rem auto; padding:0 1rem 3rem; }
.checkout-flow h1 { font-size:1.9rem; margin-bottom:1.2rem; }
.checkout-steps ol { list-style:none; padding:0; margin:0 0 1.5rem; display:flex; flex-wrap:wrap; gap:.5rem; }
.checkout-steps li { background:#eee; padding:.5rem .9rem; border-radius:1.2rem; font-size:.85rem; letter-spacing:.5px; }
.checkout-steps li.active { background:#222; color:#fff; }
.checkout-steps li.done { background:#7bbf8f; color:#fff; }
.cart-review table { width:100%; border-collapse:collapse; margin-bottom:1rem; font-size:.9rem; }
.cart-review th, .cart-review td { padding:.5rem .6rem; border-bottom:1px solid #ddd; text-align:left; }
.cart-review th { background:#f7f7f7; }
.cart-review .qty { display:inline-flex; align-items:center; gap:.35rem; }
.cart-review .qty-input { width:64px; text-align:center; padding:.35rem; border:1px solid #ccc; border-radius:.35rem; }
.cart-review .qty-dec, .cart-review .qty-inc { width:28px; height:28px; border:1px solid #ccc; border-radius:.35rem; background:#fff; line-height:1; }
.cart-review .qty-dec:hover, .cart-review .qty-inc:hover { background:#f3f3f3; }
.cart-review .link.danger { color:#b00020; background:none; border:none; text-decoration:underline; cursor:pointer; }
.totals { max-width:340px; margin-left:auto; display:grid; gap:.4rem; font-size:.9rem; }
.totals div { display:flex; justify-content:space-between; }
.totals .grand { font-weight:600; font-size:1rem; margin-top:.4rem; border-top:1px solid #ccc; padding-top:.4rem; }
.actions { margin-top:1.2rem; display:flex; gap:.6rem; }
.form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:.9rem; }
.form-field { display:flex; flex-direction:column; gap:.3rem; font-size:.85rem; }
.form-field input { padding:.55rem .6rem; border:1px solid #ccc; border-radius:.4rem; font-size:.9rem; }
.form-field input.field-error { border-color:#d33; background:#ffecec; }
.radio-line { display:flex; gap:.6rem; align-items:flex-start; padding:.5rem .7rem; border:1px solid #ddd; border-radius:.6rem; margin-bottom:.55rem; background:#fafafa; }
.radio-line:hover { background:#f0f0f0; }
.payment-error { margin-top:.8rem; color:#c00000; font-size:.85rem; }
.payment-error .btn { margin-top:.6rem; }
.payment-intro { max-width:520px; }
.visually-hidden { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
@media (max-width:640px){
  .checkout-steps li { flex:1 1 auto; text-align:center; }
  .totals { width:100%; }
}
.hero-disclaimer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 2.5rem;
  width: 100vw;
  text-align: center;
  font-size: .95rem;
  opacity: .85;
  background: rgba(0,0,0,.35);
  padding: .5rem 1.2rem;
  border-radius: 1rem;
  color: #fff;
  z-index: 20;
  pointer-events: auto;
}
/* Full-bleed hero carousel */
.hero {
  position: relative;
  padding: 0;
  min-height: 100vh;
  width: 100vw;
  overflow: hidden;
  background: #000;
}
.hero-carousel {
  position: relative;
  width: 100vw;
  height: 100vh;
  min-height: 480px;
  overflow: hidden;
}
.hero-slide {
  position: absolute;
  inset: 0;
  width: 100vw;
  height: 100vh;
  background-size: cover;
  background-position: top center;
  opacity: 0;
  transition: opacity 1s cubic-bezier(.4,0,.2,1);
  z-index: 1;
}
.hero-slide.is-active {
  opacity: 1;
  z-index: 2;
}
.hero-overlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 3;
  color: #fff;
  text-shadow: 0 2px 16px rgba(0,0,0,.45);
  pointer-events: none;
}
.hero-headline {
  font-size: clamp(2.2rem, 6vw, 3.5rem);
  font-weight: 700;
  margin-bottom: 2.5rem;
  text-align: center;
  pointer-events: auto;
}
/* Footer */
.site-footer { background:#0a0f1a; color:#d1e4f5; padding: var(--space-7) 0 var(--space-6); margin-top: var(--space-8); font-size:.95rem; }
.site-footer a { color:#57bfff; text-decoration:none; }
.site-footer a:hover, .site-footer a:focus-visible { text-decoration:underline; }
.footer-inner { max-width: var(--max-width); margin:0 auto; padding:0 var(--space-5); }
.footer-cols { display:grid; gap: var(--space-6); grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); }
.footer-col h2.footer-logo { margin:0 0 .5rem; font-size:1.4rem; letter-spacing:.5px; }
.footer-col h3 { margin:.2rem 0 .6rem; font-size:1.05rem; letter-spacing:.5px; text-transform:uppercase; font-weight:700; color:#fff; }
.footer-tagline { margin:.25rem 0 .75rem; opacity:.85; }
.footer-nav { list-style:none; margin:0; padding:0; display:grid; gap:.35rem; }
.footer-nav a { display:inline-flex; align-items:center; gap:.35rem; padding:.15rem 0; }
.footer-small { font-size:.7rem; line-height:1.4; opacity:.7; margin-top:.75rem; }
@media (max-width:600px){
  .site-footer { padding: var(--space-6) 0 var(--space-5); }
  .footer-cols { gap: var(--space-5); }
}
.hero-actions {
  display: flex;
  gap: 1.2rem;
  margin-bottom: 2.2rem;
  pointer-events: auto;
}
.hero-actions .btn, .hero-actions .btn-outline {
  font-size: 1.1rem;
  padding: 1rem 2.2rem;
  border-radius: 2rem;
}
.disclaimer {
  font-size: .95rem;
  opacity: .85;
  margin-top: 1.5rem;
  background: rgba(0,0,0,.35);
  padding: .5rem 1.2rem;
  border-radius: 1rem;
  pointer-events: auto;
}
.usp-popups {
  position: absolute;
  left: 0; top: 0; width: 100vw; height: 100vh;
  pointer-events: none;
  z-index: 10;
}
.usp-popup {
  position: absolute;
  background: rgba(10,160,255,.92);
  color: #fff;
  font-size: 1.05rem;
  font-weight: 600;
  padding: .55rem 1.2rem;
  border-radius: 2rem;
  box-shadow: 0 2px 16px rgba(0,0,0,.18);
  opacity: 0;
  animation: uspFadeInOut 2.8s cubic-bezier(.4,0,.2,1);
  pointer-events: none;
}
@keyframes uspFadeInOut {
  0% { opacity: 0; transform: translateY(20px) scale(.95); }
  10% { opacity: 1; transform: none; }
  90% { opacity: 1; }
  100% { opacity: 0; transform: translateY(-20px) scale(.98); }
}

/* =============================================
   OxyPod Studio – Global Styles (mobile-first)
   ============================================= */
:root {
  --brand-primary: #0aa0ff;
  --brand-accent: #00d4a6;
  --brand-dark: #0a0f1a;
  --brand-light: #f5faff;
  --brand-mid: #124063;
  --text-color: var(--brand-dark);
  --bg-color: #ffffff;
  --font-sans: system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;
  --font-mono: SFMono-Regular,Consolas,'Liberation Mono',Menlo,monospace;
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,.12);
  --shadow-focus: 0 0 0 3px rgba(10,160,255,.35);
  --space-1: .25rem; /*4*/
  --space-2: .5rem; /*8*/
  --space-3: .75rem;/*12*/
  --space-4: 1rem;  /*16*/
  --space-5: 1.5rem;/*24*/
  --space-6: 2rem;  /*32*/
  --space-7: 3rem;  /*48*/
  --space-8: 4rem;  /*64*/
  --max-width: 72rem; /*1152px*/
  --transition: 160ms cubic-bezier(.4,0,.2,1);
  --line-length: 68ch;
  /* New neutral/extended tokens (2025 treatments) */
  --ink: var(--brand-dark);
  --ink-light: #3a424d;
  --brand-600: #087fcf;
  --gradient-brand: linear-gradient(135deg,#0aa0ff,#57bfff);
}

@media (prefers-reduced-motion: reduce) {
  :root { --transition: 0ms linear; }
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:0ms !important; }
}

/* Reset / base */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family: var(--font-sans); line-height:1.5; color:var(--text-color); background:var(--bg-color); -webkit-font-smoothing: antialiased; }
img { max-width:100%; height:auto; display:block; }
figure { margin:0; }
svg { fill: currentColor; }
a { color: var(--brand-primary); text-decoration: none; }
a:hover,a:focus { text-decoration: underline; }

/* Typography */
h1,h2,h3,h4 { font-weight:600; line-height:1.2; margin:0 0 var(--space-4); letter-spacing:.5px; }
.lead { font-size: clamp(1.05rem, 2.2vw, 1.25rem); max-width: var(--line-length); }
/* Video library (HBOTUSA) */
.video-library { margin-top: var(--space-7); background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-md); padding: var(--space-6); }
.video-library-head h2 { margin-top:0; font-size: clamp(1.6rem, 3vw, 2.05rem); background: var(--gradient-brand); -webkit-background-clip: text; background-clip: text; color: transparent; }
.video-intro { margin-top: .25rem; max-width: 70ch; font-size: 1.02rem; }
.video-categories { display: grid; gap: var(--space-6); margin-top: var(--space-6); }
/* Increase minimum column width so embedded YouTube title overlay remains readable */
@media (min-width: 900px){ .video-categories { grid-template-columns: repeat(auto-fill,minmax(400px,1fr)); } }
.video-category { background: var(--brand-light); padding: var(--space-5) var(--space-5) var(--space-5); border-radius: var(--radius-lg); border:1px solid rgba(10,160,255,.15); box-shadow: 0 2px 6px rgba(0,0,0,.04); display:flex; flex-direction:column; }
.video-category h3 { font-size: 1.05rem; letter-spacing:.5px; text-transform: uppercase; margin:0 0 .75rem; color: var(--brand-mid); }
.video-list { list-style: none; margin:0; padding-left: 0; display:flex; flex-direction:column; gap:1.1rem; font-size:.95rem; }
.video-list li { position:relative; }
.video-list a { font-weight:600; text-decoration:none; }
.video-list a:hover,.video-list a:focus { text-decoration:underline; }
.video-list .placeholder { color:#67727d; font-style: italic; opacity:.75; }
.video-list iframe { width:100%; aspect-ratio:16/9; border:0; border-radius:12px; background:#000; }
.video-note { margin-top: var(--space-5); font-size:.9rem; opacity:.8; }
/* Info promos (research & inspirators) */
.info-promos { display:grid; gap:var(--space-6); margin-top: var(--space-6); }
@media (min-width: 760px){ .info-promos { grid-template-columns: repeat(auto-fit,minmax(320px,1fr)); } }
.info-promo { background:#fff; border:1px solid #e2e8f0; padding: var(--space-6) var(--space-5); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); display:flex; flex-direction:column; gap: var(--space-3); position:relative; }
.info-promo__icon { font-size:2.2rem; line-height:1; }
.info-promo__title { margin:0; font-size:1.25rem; }
.info-promo__text { margin:0 0 var(--space-2); font-size:.98rem; line-height:1.5; }
.info-promo .btn { align-self:flex-start; }
.info-promo:hover { box-shadow: var(--shadow-md); transition: box-shadow var(--transition); }
/* Product card image link */
.product-card__img-link { display:block; border-radius: var(--radius-md); overflow:hidden; position:relative; }
.product-card__img-link img { transition: transform .35s ease; display:block; }
.product-card__img-link:hover img, .product-card__img-link:focus img { transform: scale(1.04); }
.product-card__img-link:focus { outline: 2px solid var(--brand-primary); outline-offset: 2px; }

/* Shop grid: place actions directly under the image and polish spacing */
.shop-grid .product-card { display:flex; flex-direction:column; align-items:stretch; }
.shop-grid .product-card .product-card__img-link { margin-bottom:.65rem; }
.shop-grid .product-card .actions { margin-top:.5rem; margin-bottom:.15rem; display:flex; gap:.45rem; flex-wrap:wrap; }
.shop-grid .product-card .actions .btn, 
.shop-grid .product-card .actions .btn-outline { flex:1 1 160px; padding:.5rem .8rem; font-size:.9rem; line-height:1.15; }
.shop-grid .product-card h3 { margin:.5rem 0 .25rem; font-size:1rem; line-height:1.25; }
.shop-grid .product-card p { margin:.25rem 0; }
.shop-grid .product-card .price { margin-top:.35rem; font-weight:600; }
.shop-grid .product-card .product-card__short {
  color: var(--text-muted, #9aa3b2);
  font-size: .95rem;
  line-height: 1.45;
  /* Line clamp for consistent card heights */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  /* Fallback for non-webkit: approximate 3 lines */
  max-height: calc(1.45em * 3);
}
.shop-grid .product-card .product-card__short .desc-more { color: var(--brand-primary); text-decoration:none; }
.shop-grid .product-card .product-card__short .desc-more:hover, 
.shop-grid .product-card .product-card__short .desc-more:focus { text-decoration:underline; }
@media (max-width:480px){
  .shop-grid .product-card .actions { gap:.4rem; }
  .shop-grid .product-card .actions .btn, 
  .shop-grid .product-card .actions .btn-outline { flex:1 1 100%; }
}
p { max-width: var(--line-length); margin:0 0 var(--space-4); }

/* Layout */
.container { width:100%; max-width: var(--max-width); margin:0 auto; padding:0 var(--space-4); }
.section { padding: var(--space-8) 0 var(--space-7); position:relative; }
.section.alt { background: linear-gradient(180deg,var(--brand-light),#ffffff); }
.section-title { font-size: clamp(1.7rem,4vw,2.3rem); margin-bottom: var(--space-5); }
.section-intro { font-size:1.05rem; opacity:.85; }
/* Snabb översikt – punktlista */
.benefits-list { margin: .5rem 0 1rem 0; padding:0; list-style:none; }
.benefits-list li { margin:.35rem 0; padding-left:1.25rem; position:relative; line-height:1.5; }
.benefits-list li::before { content:"🔹"; position:absolute; left:0; top:0; }

/* Accessibility helpers */
.skip-link { position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus { left:0; top:0; width:auto; height:auto; background:var(--brand-primary); color:#fff; padding:var(--space-2) var(--space-3); z-index:1000; }

/* Header / Nav */
.site-header { position:sticky; top:0; z-index:999; background:rgba(255,255,255,.9); backdrop-filter:blur(8px); border-bottom:1px solid #e2e8f0; }
.nav-wrapper { display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); min-height:4.25rem; }
.brand { display:flex; align-items:center; gap:var(--space-2); font-weight:600; font-size:1.1rem; }
.logo { width:clamp(140px, 28vw, 240px); height:auto; }
.primary-nav { position:static; background:transparent; transform:none; padding:0; display:none; }
.primary-nav ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.25rem; }
.primary-nav a { color:var(--brand-dark); text-decoration:none; font-weight:500; padding:.5rem .25rem; display:block; border-radius:4px; }
.primary-nav a:hover, .primary-nav a:focus-visible { background:rgba(10,160,255,.1); outline:none; }
.primary-nav.open { display:block; position:absolute; top:100%; left:0; right:0; background:#fff; border-bottom:1px solid #e2e8f0; box-shadow:0 4px 14px -4px rgba(0,0,0,.15); padding: .75rem 1rem 1rem; }
/* Submenu (mobile-first) */
.menu-item-has-children { position: relative; }
.submenu-toggle { background:transparent; border:none; font: inherit; color: var(--text-color); padding:.35rem .25rem; display:flex; align-items:center; gap:.35rem; cursor:pointer; }
.submenu-toggle:focus-visible { outline:none; box-shadow: var(--shadow-focus); border-radius:4px; }
.primary-nav ul.submenu { list-style:none; margin:.25rem 0 0 .5rem; padding:.25rem 0 .25rem .5rem; display:none; border-left:2px solid #e2e8f0; }
.menu-item-has-children.open > .submenu { display:grid; gap:.25rem; }
.submenu a { padding:.25rem 0; display:block; color:var(--text-color); text-decoration:none; }
.submenu a:hover, .submenu a:focus-visible { text-decoration:underline; }
@media (min-width:768px){
  .primary-nav { display:flex !important; position:static; flex-direction:row; align-items:center; gap:1.1rem; background:transparent; box-shadow:none; }
  .primary-nav ul { flex-direction:row; gap:1rem; }
  .primary-nav a { padding:.35rem .25rem; color:var(--text-color); border-bottom:2px solid transparent; border-radius:0; }
  .primary-nav a:hover, .primary-nav a:focus-visible { background:transparent; border-bottom-color: var(--brand-primary); }
  /* Desktop submenu */
  .menu-item-has-children { position:relative; }
  .primary-nav ul.submenu { position:absolute; left:0; top:100%; min-width: 240px; background:#fff; border:1px solid #e2e8f0; border-radius: var(--radius-md); padding:.5rem; box-shadow: var(--shadow-md); margin:0; display:none; }
  .menu-item-has-children:hover > .submenu,
  .menu-item-has-children:focus-within > .submenu,
  .menu-item-has-children.open > .submenu { display:block; }
  .submenu a { padding:.35rem .5rem; border-radius:4px; }
  .submenu a:hover, .submenu a:focus-visible { background: rgba(10,160,255,.08); text-decoration:none; }
}
.nav-toggle { background:#fff; border:1px solid #cbd5e1; display:inline-flex; flex-direction:column; gap:5px; padding:8px 10px; border-radius:var(--radius-sm); cursor:pointer; transition:var(--transition); box-shadow: var(--shadow-sm); }
.nav-toggle .bar { width:22px; height:2px; background:var(--brand-dark); display:block; }
.nav-toggle:focus-visible { outline:2px solid var(--brand-primary); outline-offset:2px; }
@media (min-width:768px){ .nav-toggle { display:none; } }
.header-cta { display:flex; align-items:center; gap:.65rem; }

@media (min-width: 768px) {
  .primary-nav { position:static; transform:none; background:transparent; color:var(--text-color); flex-direction:row; inset:auto; padding:0; font-size:.95rem; }
  .primary-nav ul { flex-direction:row; }
  .primary-nav a { color:var(--text-color); }
  .site-header .primary-nav a { font-size:.95rem; line-height:1.2; }
  .nav-toggle { display:none; }
  .header-cta { display:flex; }
/* Mobile header CTA icon modes */
@media (max-width: 767.98px){
  .header-cta .cart-btn-combined { padding:.55rem .8rem; min-width:auto; }
  .header-cta .cart-btn-combined .cart-label-desktop { display:none; }
  .header-cta .cart-btn-combined .cart-icon-inline { display:inline; font-size:1.25rem; }
  .header-cta .btn[data-soon] { --btn-bg:var(--brand-primary); padding:.55rem .75rem; }
  .header-cta .btn[data-soon] span.btn-label { display:none; }
  .header-cta .btn[data-soon] .icon-inline { display:inline-flex; }
  /* Keep spacing consistent */
  .header-cta .badge { margin-left:0; }
}
/* Super narrow adjustments */
@media (max-width: 420px){
  .header-cta { gap:.4rem; }
  .header-cta .cart-btn-combined { padding:.5rem .65rem; }
  .header-cta .btn[data-soon] { padding:.5rem .6rem; }
}
  /* Slightly smaller logo on desktop to free nav space */
  .logo { width: clamp(130px, 18vw, 200px); }
  /* Smaller CTA buttons in header for more space */
  .site-header .header-cta .btn { padding:.6rem .9rem; font-size:.9rem; }
  .site-header .header-cta .badge { font-size:.85em; }

  /* Badges / chips */
  .badges { display:flex; flex-wrap:wrap; gap:.375rem; margin-top:.5rem; }
  .badge { display:inline-flex; align-items:center; padding:.2rem .5rem; border-radius:999px; font-size:.8rem; line-height:1; background:#eef2ff; color:#1e293b; border:1px solid rgba(0,0,0,.08); }
  .badge .icon { margin-left:.35rem; font-weight:600; opacity:.65; font-size:.85em; }
  .badge[title] { cursor:help; }
  .badge--care { background:#ecfeff; color:#0e7490; border-color:rgba(14,116,144,.15); }
  .badge--research { background:#f0fdf4; color:#166534; border-color:rgba(22,101,52,.15); }
  .badge--space { background:#fefce8; color:#854d0e; border-color:rgba(133,77,14,.15); }
}

/* Buttons */
.btn { --btn-bg: var(--brand-primary); --btn-color:#fff; --btn-hover: #0885d4; font: inherit; color:var(--btn-color); background:var(--btn-bg); border:none; padding: .9rem 1.4rem; border-radius:var(--radius-md); display:inline-flex; align-items:center; justify-content:center; gap:.5rem; text-decoration:none; position:relative; overflow:hidden; box-shadow:var(--shadow-sm); transition:var(--transition); cursor:pointer; font-weight:600; letter-spacing:.5px; }
.btn:hover, .btn:focus-visible { background:var(--btn-hover); text-decoration:none; }
.btn-outline { --btn-bg: transparent; --btn-color: var(--brand-primary); border:1px solid var(--brand-primary); }
.btn-outline:hover, .btn-outline:focus-visible { background:var(--brand-primary); color:#fff; }
.btn-primary:focus-visible, .btn-outline:focus-visible { outline:none; box-shadow: var(--shadow-focus); }
/* New button modifiers (non-conflicting) */
.btn--primary { background: var(--brand-primary); color:#fff; border:2px solid var(--brand-primary); }
.btn--primary:hover, .btn--primary:focus-visible { background: var(--brand-600); text-decoration:none; }
.btn--ghost { background:#fff; color: var(--brand-primary); border:2px solid var(--brand-primary); }
.btn--ghost:hover, .btn--ghost:focus-visible { background: var(--brand-light); text-decoration:none; }

/* Hero */
 .hero { padding: clamp(2rem, 6vh, 4rem) 0 var(--space-7); background: radial-gradient(circle at 70% 30%, rgba(10,160,255,.08), transparent 60%), linear-gradient(135deg,#ffffff 0%, var(--brand-light) 100%); }
.hero-inner { display:grid; gap:var(--space-6); align-items:center; }
.hero-text { animation: fadeIn .8s ease; }
.usp { list-style:none; padding:0; margin: var(--space-5) 0 var(--space-5); display:flex; flex-wrap:wrap; gap: .5rem .75rem; font-size:.85rem; letter-spacing:.5px; text-transform:uppercase; font-weight:600; }
.usp li { background: var(--brand-primary); color:#fff; padding:.45rem .7rem; border-radius: 24px; line-height:1; }
.hero-actions { display:flex; gap:var(--space-3); flex-wrap:wrap; }
.hero-media img { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); width:100%; height:auto; }
.hero-media img { aspect-ratio: 3 / 2; object-fit: cover; }
.disclaimer { font-size:.75rem; opacity:.8; margin-top: var(--space-4); }

/* Hero carousel (fade) */
.carousel { position:relative; width:100%; border-radius: var(--radius-lg); overflow:hidden; box-shadow: var(--shadow-md); aspect-ratio: 3 / 2; min-height: 260px; background:#fff; }
.carousel-slide { position:absolute; inset:0; opacity:0; transition: opacity 900ms cubic-bezier(.4,0,.2,1); }
.carousel-slide picture, .carousel-slide img { width:100%; height:100%; object-fit:cover; display:block; }
.carousel-slide.is-active { opacity:1; position:absolute; }
@media (prefers-reduced-motion: reduce){
  .carousel-slide { transition:none; }
}

@media (min-width: 900px) {
  .hero-inner { grid-template-columns: 1fr 1fr; }
  .hero-media { order:2; }
}

/* Cards */
.card-grid { display:grid; gap: var(--space-5); }
.card { background:#fff; padding: var(--space-5) var(--space-5) var(--space-5); border:1px solid #e2e8f0; border-radius: var(--radius-lg); position:relative; box-shadow: var(--shadow-sm); transition: var(--transition); }
.card:hover, .card:focus-within { box-shadow: var(--shadow-md); transform: translateY(-4px); }
.card h3 { margin-top:0; font-size:1.25rem; }
.card details { margin-top: var(--space-3); }
.card details summary { cursor:pointer; font-weight:600; }
.card details[open] { background: linear-gradient(180deg,var(--brand-light),#fff); border-radius: var(--radius-md); padding: var(--space-3) var(--space-3) 0; }
.card details .benefits-list { margin:.5rem 0 .75rem 0; }
.card details h4 { margin:.25rem 0 .25rem; font-size: .95rem; letter-spacing:.2px; }
.program-dl ul { margin:.25rem 0 .25rem 0; padding-left: 1.1rem; }

/* Protocol */
.protocol-flow { list-style: none; counter-reset: step; margin: var(--space-5) 0 var(--space-5); padding:0; display:grid; gap: var(--space-3); }

/* ==== Homepage Protocol Overview (new compact cards) ==== */
.proto { /* legacy wrapper kept for specificity; no custom padding now */ background:#f7fbff; }
.proto__container { width:min(1120px,92%); margin:0 auto; }
/* hero styles removed (now using global section-title / section-intro) */
.proto__grid { display:grid; gap:20px; margin-top:24px; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); }
.proto__card { background:#fff; border:1px solid #e6eef7; border-radius:16px; padding:20px; display:flex; flex-direction:column; gap:12px; box-shadow:0 6px 20px rgba(0,0,0,.04); }
.proto__card:hover { box-shadow:0 10px 28px -4px rgba(0,0,0,.1); }
.proto__icon { font-size:28px; }
.proto__title { margin:0; font-size:20px; }
.proto__ingress { margin:0; color:#2f4756; font-size:.95rem; line-height:1.45; }
.proto__bullets { margin:0; padding-left:18px; color:#203746; font-size:.85rem; }
.proto__bullets li { margin:6px 0; }
.proto__how { margin-top:40px; }
.proto__how h3 { text-align:center; margin:0 0 16px; font-size:1.35rem; }
.proto__steps { display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.proto__step { background:#ffffff; border:1px solid #e6eef7; border-radius:14px; padding:16px; text-align:center; }
.proto__step-ico { font-size:24px; margin-bottom:8px; }
.proto__cta { display:flex; gap:12px; justify-content:center; margin:32px 0 8px; flex-wrap:wrap; }
.btn.btn--primary { background:#1a9bd7; color:#fff; border:2px solid #1a9bd7; }
.btn.btn--primary:hover, .btn.btn--primary:focus-visible { background:#108bc4; text-decoration:none; }
.btn.btn--ghost { background:transparent; color:#1a9bd7; border:2px solid #1a9bd7; }
.btn.btn--ghost:hover, .btn.btn--ghost:focus-visible { background:#e8f6fc; text-decoration:none; }
.proto__disclaimer { font-size:12px; color:#5a7080; text-align:center; margin:0; max-width:70ch; margin-left:auto; margin-right:auto; }
.protocol-flow li { position:relative; padding-left:3.25rem; background:#fff; border:1px solid #e2e8f0; border-radius: var(--radius-md); padding-block: .9rem; padding-right: var(--space-4); }
.protocol-flow li::before { counter-increment: step; content: counter(step); position:absolute; left:.9rem; top:50%; transform: translateY(-50%); width:2rem; height:2rem; background: var(--brand-primary); color:#fff; display:flex; align-items:center; justify-content:center; border-radius:50%; font-weight:600; }
/* Protocol synergy illustration */
.synergy-illustration { margin: var(--space-5) auto; display:flex; justify-content:center; }
.synergy-illustration img { width:min(900px, 100%); height:auto; border:1px solid #e2e8f0; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); background:#fff; }
/* Extras follow same horizontal card look but without numbering */
.protocol-extras { margin-top: var(--space-4); }
.protocol-extras li::before { content:""; background:transparent; border:1px solid transparent; }

/* Research */
.refs-grid { display:grid; gap: var(--space-5); }
.ref-card { background:#fff; padding: var(--space-5); border:1px solid #e0e7ef; border-radius: var(--radius-lg); position:relative; box-shadow: var(--shadow-sm); }
.ref-card h3 { margin-top:0; }
.read-more { font-weight:600; display:inline-block; margin-top: var(--space-2); }
/* Programöversikt details */
.program-box { background:#fff; border:1px solid #e2e8f0; border-radius: var(--radius-md); padding: var(--space-4); box-shadow: var(--shadow-sm); margin: var(--space-4) 0; }
.program-title { margin:0 0 .5rem 0; font-size:1rem; letter-spacing:.3px; }
.program-dl { display:grid; grid-template-columns: max-content 1fr; gap:.4rem .9rem; margin:.4rem 0 0; }
.program-dl dt { font-weight:600; }
.program-dl dd { margin:0; }

/* About */
.about-grid { display:grid; gap: var(--space-5); }
/* About main should remain single column */
.about-main { display:block; max-width: 72ch; }
/* About cards in a responsive grid */
.about-cards { display:grid; gap: var(--space-4); margin-top: 1rem; }
.about-cards .note { margin:0; }

/* Protocol themed sections */
.proto { position: relative; background-color:#ffffff; border:1px solid #edf2f7; }
.proto-title { display:flex; align-items:center; gap:.5rem; }
.proto-title { margin-top: var(--space-5); margin-bottom: var(--space-4); font-size: clamp(1.25rem,3vw,1.7rem); }
.proto-title .proto-icon { display:inline-flex; width:3rem; height:3rem; align-items:center; justify-content:center; border-radius:.6rem; font-size:1.8rem; }
/* 🌱 Super Longevity Protocol – vertical gradient, ends in white */
.proto--long {
  background-color: #ffffff; /* very light base */
  background-image: linear-gradient(180deg,
    rgba(0,162,214,0.10) 0%,
    rgba(0,119,182,0.05) 40%,
    rgba(255,255,255,1) 100% /* fade to white */
  );
}
.proto--long .proto-icon {
  background-color: #c2dbe4; /* solid theme */
  color:#0a1416;
  border:2px solid #C0C0C0; /* silver accent, thicker for clarity */
}
/* ✨ Glow Protocol – vertical gradient, ends in white */
.proto--glow {
  background-color: #ffffff; /* very light base */
  background-image: linear-gradient(180deg,
    rgba(255,111,97,0.10) 0%,
    rgba(247,141,167,0.05) 40%,
    rgba(255,255,255,1) 100% /* fade to white */
  );
}
.proto--glow .proto-icon {
  background-color: #f5d2ce; /* solid theme */
  color:#29120f;
  border:2px solid #B8860B; /* darker gold for clearer contrast */
}

/* ⚡ Boost Protocol – vertical gradient, ends in white */
.proto--boost {
  background-color: #ffffff; /* very light base */
  background-image: linear-gradient(180deg,
    rgba(245,124,0,0.10) 0%,
    rgba(255,179,0,0.05) 40%,
    rgba(255,255,255,1) 100% /* fade to white */
  );
}
.proto--boost .proto-icon {
  background-color: #f9cda1; /* solid theme */
  color:#2b1600;
  border:2px solid #869687; /* darker green for clearer contrast */
}
@media (prefers-contrast: more) {
  .proto--long, .proto--glow, .proto--boost { background: none; }
  .proto-title .proto-icon { outline:2px solid currentColor; background: transparent; }
}

/* === Treatments Section (2025) === */
.treatments { display:flex; flex-direction:column; gap:4rem; margin-top:2.5rem; }
.treatment { display:grid; gap:2rem; align-items:start; }
@media (min-width:860px){
  .treatment { grid-template-columns: 1fr 1fr; }
  .treatment.reverse .treatment-media { order:2; }
  .treatment.reverse .treatment-body { order:1; }
}
.treatment-media picture, .treatment-media img { width:100%; border-radius: var(--radius-lg); object-fit:cover; background:#f2f7fa; aspect-ratio: 4 / 3; }
.treatment-body h3 { margin-top:0; font-size: clamp(1.4rem,2.2vw,1.9rem); letter-spacing:.4px; }
.treatment-intro { font-size:1.05rem; color: var(--ink-light); }
.t-block { margin-top:1rem; border:1px solid #e2e8f0; border-radius: var(--radius-md); background:#fff; box-shadow: var(--shadow-sm); overflow:hidden; }
.t-block summary { cursor:pointer; font-weight:600; padding:.75rem 1rem; list-style:none; display:flex; align-items:center; gap:.55rem; position:relative; }
.t-block summary::-webkit-details-marker { display:none; }
.t-block[open] summary { background: linear-gradient(180deg,#f5faff,#ffffff); border-bottom:1px solid #e2e8f0; }
.t-block > *:not(summary) { padding:.75rem 1rem 1rem; }
.t-block h4 { margin:.5rem 0 .35rem; font-size:.85rem; text-transform:uppercase; letter-spacing:.6px; opacity:.75; }
.t-icon { font-size:1.1rem; line-height:1; }
.treatment-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.25rem; }
.treatment-actions .btn { font-size:.9rem; padding:.75rem 1.25rem; }
@media (max-width:640px){ .treatment-actions { flex-direction:row; } }

/* Opening hours */
.hours-grid { display:grid; gap: var(--space-6); }
.opening-hours { list-style:none; margin:0 0 var(--space-4); padding:0; display:grid; gap:.35rem; width:fit-content; }
.opening-hours li { display:grid; grid-template-columns: 6.5rem auto; gap:1.25rem; font-variant-numeric: tabular-nums; }
.open-status { font-weight:600; margin: var(--space-3) 0 var(--space-5); }
.open-status.open { color: var(--brand-accent); }
.open-status.closed { color: #dc2626; }
.booking-status { font-weight:600; margin: var(--space-3) 0 var(--space-5); }
.booking-status.open { color: var(--brand-accent); }
.booking-status.closed { color:#dc2626; }
.hours-subhead { margin: var(--space-5) 0 var(--space-2); font-size:1rem; letter-spacing:.5px; text-transform:uppercase; font-weight:600; opacity:.85; }
.hours-subhead:first-of-type { margin-top:0; }

/* Contact */
.contact-grid { display:grid; gap: var(--space-6); }
.contact-details a { text-decoration:underline; }
.map-container { margin-top: var(--space-4); }
.map { width:100%; aspect-ratio: 16/10; min-height:260px; background: linear-gradient(135deg,#d6ecfa,#b7daf3); border:1px solid #cbd5e1; border-radius: var(--radius-md); position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.map iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.map-placeholder { text-align:center; display:flex; flex-direction:column; gap:var(--space-3); padding: var(--space-5); max-width: 320px; }
.map-text { margin:0; font-size:.9rem; }
.map-privacy-note { margin:0; font-size:.65rem; opacity:.75; }
.map-lazy.loading .map-placeholder { opacity:.6; }
.contact-form { background:#fff; padding: var(--space-5); border:1px solid #e2e8f0; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.form-field { display:flex; flex-direction:column; gap:.35rem; margin-bottom: var(--space-4); }
.form-field label { font-weight:600; }
.form-field input[type=text], .form-field input[type=email], .form-field textarea { width:100%; padding:.75rem .85rem; border:1px solid #cbd5e1; border-radius: var(--radius-sm); font:inherit; line-height:1.4; background:#fff; }
.form-field input:focus, .form-field textarea:focus { outline:none; border-color: var(--brand-primary); box-shadow: var(--shadow-focus); }
.form-field.consent { flex-direction:row; align-items:center; gap:.65rem; }
.error { color:#dc2626; font-size:.75rem; min-height:1em; margin:0; }
.form-status { margin-top: var(--space-3); font-weight:600; }

/* Footer */
.site-footer { margin-top: var(--space-8); background: var(--brand-dark); color:#cbd5e1; padding: var(--space-7) 0 var(--space-5); position:relative; }
.footer-grid { display:grid; gap: var(--space-6); }
.footer-title { color:#fff; margin-top:0; }
.footer-nav ul { list-style:none; margin:0; padding:0; display:grid; gap:.4rem; }
.footer-nav a { color:#cbd5e1; }
.footer-nav a:hover, .footer-nav a:focus { color:#fff; text-decoration:none; }
.footer-meta { font-size:.75rem; opacity:.85; }
.small { font-size:.7rem; }
.back-to-top { position:fixed; right:1rem; bottom:1rem; width:46px; height:46px; border:none; background:var(--brand-primary); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.3rem; cursor:pointer; box-shadow:var(--shadow-md); opacity:0; pointer-events:none; transition: var(--transition); z-index:900; }
.back-to-top.visible { opacity:1; pointer-events:auto; }
.back-to-top:focus-visible { outline:none; box-shadow: var(--shadow-focus); }

/* Utilities */
.alt { background: linear-gradient(180deg,var(--brand-light),#fff); }
.note { font-size:.85rem; opacity:.75; }
.note.note--green { 
  background: color-mix(in srgb, #8BC34A 12%, transparent);
  border: 1px solid color-mix(in srgb, #8BC34A 28%, transparent);
  color: inherit; opacity: .95; padding: .75rem .9rem; border-radius: .5rem;
}
.note.note--red {
  background: color-mix(in srgb, #E57373 12%, transparent);
  border: 1px solid color-mix(in srgb, #E57373 28%, transparent);
  color: inherit; opacity: .95; padding: .75rem .9rem; border-radius: .5rem;
}
/* Ensure headings are readable on light note backgrounds */
.note.note--green .footer-title,
.note.note--red .footer-title {
  color: #0A0F1A; /* use site base text color for contrast */
}
.read-more::after { content:' →'; }

/* Inspirators CTA highlight */
.inspirators-cta { 
  background: linear-gradient(145deg,#ffffff 0%, var(--brand-light) 130%);
  border: 1px solid #cde4f3;
  border-radius: var(--radius-lg);
  padding: var(--space-5) var(--space-5) var(--space-5);
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  display: flex;
  gap: var(--space-5);
  align-items: flex-start;
  margin-top: var(--space-7);
  position: relative;
  overflow: hidden;
}
.inspirators-cta::before { content:""; position:absolute; inset:0; background: radial-gradient(circle at 85% 20%, rgba(10,160,255,.18), transparent 60%); pointer-events:none; }
.inspirators-cta::after { content:""; position:absolute; left:0; top:0; bottom:0; width:6px; background: linear-gradient(180deg,var(--brand-primary),var(--brand-accent)); border-radius:0 4px 4px 0; }
.inspirators-cta-icon { font-size:2.4rem; line-height:1; filter: drop-shadow(0 2px 6px rgba(0,0,0,.15)); }
.inspirators-cta h3 { margin:0 0 .35rem 0; font-size: clamp(1.25rem,2.2vw,1.55rem); letter-spacing:.4px; }
.inspirators-cta p { margin:0 0 var(--space-4); font-size:.95rem; opacity:.9; max-width: 56ch; }
.inspirators-cta .btn { font-size:.9rem; padding:.7rem 1.2rem; }
/* mini profiles inside CTA */
.inspirators-cta-profiles { display:flex; flex-wrap:wrap; gap:.75rem; margin:0 0 var(--space-4); }
.insp-mini { position:relative; background:#fff; border:1px solid #d6e3ed; border-radius: .9rem; padding:.65rem .85rem .6rem 2.6rem; text-decoration:none; color:inherit; font-size:.75rem; line-height:1.25; box-shadow:0 1px 3px rgba(0,0,0,.06); display:flex; flex-direction:column; min-width:150px; transition: var(--transition); }
.insp-mini::before { content:""; position:absolute; left:.75rem; top:50%; transform:translateY(-50%); width:1.6rem; height:1.6rem; border-radius:50%; background: linear-gradient(135deg,var(--brand-primary),var(--brand-accent)); box-shadow:0 2px 4px rgba(0,0,0,.15); }
.insp-mini:hover, .insp-mini:focus-visible { border-color: var(--brand-primary); box-shadow:0 4px 10px rgba(0,0,0,.08); outline:none; }
.insp-mini:active { transform: translateY(2px); }
.insp-name { font-weight:600; font-size:.8rem; letter-spacing:.3px; }
.insp-tag { font-size:.65rem; opacity:.75; margin-top:.15rem; letter-spacing:.4px; text-transform:uppercase; }
@media (max-width:640px){ .insp-mini { flex:1 1 calc(50% - .75rem); min-width:140px; } }
@media (max-width: 640px){
  .inspirators-cta { flex-direction:column; padding: var(--space-5) var(--space-4) var(--space-5); }
  .inspirators-cta-icon { font-size:2rem; }
  .inspirators-cta h3 { font-size:1.25rem; }
}

/* Biomarkör-garanti */
.bio-guarantee { padding-top:0; margin-top: var(--space-6); }
.bio-box { background: linear-gradient(145deg,#ffffff 0%, var(--brand-light) 130%); border:1px solid #d6e3ed; border-radius: var(--radius-lg); padding: var(--space-5) var(--space-5) var(--space-5); box-shadow: 0 2px 6px rgba(0,0,0,.06); position:relative; overflow:hidden; }
.bio-box::before { content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background: linear-gradient(180deg,var(--brand-accent), var(--brand-primary)); border-radius:0 4px 4px 0; }
.bio-title { margin-top:0; display:flex; align-items:center; gap:.55rem; font-size: clamp(1.05rem,2vw,1.35rem); letter-spacing:.4px; }
.bio-title .icon { font-size:1.25em; line-height:1; }
.bio-lead { margin-top:.25rem; font-size:.95rem; opacity:.9; }
.bio-details { margin-top: var(--space-4); }
.bio-summary { cursor:pointer; font-weight:600; list-style:none; position:relative; display:inline-flex; align-items:center; gap:.55rem; padding:.55rem .9rem; border-radius: 999px; background: #fff; border:1px solid #cdd9e2; transition: var(--transition); font-size:.85rem; box-shadow: var(--shadow-sm); }
.bio-summary::-webkit-details-marker { display:none; }
.bio-summary:focus-visible { outline:none; box-shadow: var(--shadow-focus); }
.bio-summary:hover { background:var(--brand-light); }
.bio-summary .label-open { display:none; }
details[open] > .bio-summary .label-open { display:inline; }
details[open] > .bio-summary .label-closed { display:none; }
.bio-details-inner { margin-top: var(--space-4); animation: fadeIn .35s ease; }
.bio-details-inner .mini-heading { margin: var(--space-5) 0 var(--space-3); font-size:.85rem; letter-spacing:.6px; text-transform:uppercase; opacity:.7; }
.conditions { list-style:disc; padding-left:1.1rem; display:grid; gap:.55rem; margin:0 0 var(--space-4); font-size:.9rem; }
.important { background: linear-gradient(90deg,var(--brand-light),#ffffff); padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); border:1px solid #e2e8f0; font-size:.8rem; }

@media (prefers-reduced-motion: reduce) {
  .bio-details-inner { animation:none; }
}

/* Media queries */
@media (min-width:480px){
  .card-grid { grid-template-columns: repeat(auto-fill,minmax(250px,1fr)); }
  .refs-grid { grid-template-columns: repeat(auto-fill,minmax(250px,1fr)); }
  /* Previously about-grid used columns; keep about-main single column and only grid the cards */
  .about-cards { grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); }
  .hours-grid { grid-template-columns: repeat(auto-fit,minmax(300px,1fr)); }
  .contact-grid { grid-template-columns: repeat(auto-fit,minmax(300px,1fr)); }
}
@media (min-width:768px){
  .hero-inner { grid-template-columns: repeat(auto-fit,minmax(320px,1fr)); }
  .footer-grid { grid-template-columns: repeat(auto-fit,minmax(250px,1fr)); }
}
@media (min-width:1024px){
  .section { padding: var(--space-8) 0 var(--space-8); }
  .hero { padding: clamp(6rem, 14vh, 11rem) 0 var(--space-8); }
}
@media (min-width:1440px){
  :root { --max-width: 78rem; }
}

/* Animations */
@keyframes fadeIn { from { opacity:0; transform: translateY(10px);} to { opacity:1; transform: none;} }

/* Focus styles override for high visibility */
:focus-visible { outline:2px solid var(--brand-accent); outline-offset:2px; }

/* Print adjustments */
@media print {
  .nav-toggle, .primary-nav, .hero-actions, .back-to-top { display:none !important; }
  body { font-size:12pt; }
}
