/* Radhanagari Dudh — static multi-page site (blue theme) */

:root{
  --bg: #f6f9ff;
  --surface: rgba(255,255,255,.86);
  --surface-2: rgba(255,255,255,.70);
  --text: #0b1220;
  --muted: #4b5563;
  --border: rgba(15, 23, 42, .12);
  --shadow: 0 24px 60px rgba(2, 6, 23, .12);

  --blue-950:#061a44;
  --blue-900:#0b2a6f;
  --blue-800:#0e3a93;
  --blue-700:#114bb9;
  --blue-600:#1e66ff;
  --blue-500:#2b7bff;
  --blue-200:#cfe3ff;
  --blue-100:#e8f1ff;

  --radius: 18px;
  --radius-sm: 14px;
  /* Full-width layout (requested) */
  --container: 100%;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(900px 380px at 70% -10%, rgba(30,102,255,.25), transparent 70%),
    radial-gradient(800px 420px at 5% 10%, rgba(17,75,185,.18), transparent 60%),
    var(--bg);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Noto Sans", "Liberation Sans", sans-serif;
  line-height:1.55;
  /* Prevent accidental horizontal overflow gaps */
  overflow-x:hidden;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

a{color:inherit}
img, video{max-width:100%; height:auto}
.skip-link{
  position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;
}
.skip-link:focus{
  left:16px; top:16px; width:auto; height:auto;
  background:#fff; border:1px solid var(--border); padding:10px 12px; border-radius:12px;
  z-index:1000;
}

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

.container{
  max-width:var(--container);
  margin:0 auto;
  padding:0;
  padding-left:max(clamp(16px, 4vw, 72px), env(safe-area-inset-left, 0px));
  padding-right:max(clamp(16px, 4vw, 72px), env(safe-area-inset-right, 0px));
}

.header{
  position:sticky; top:0; z-index:50;
  -webkit-backdrop-filter:saturate(160%) blur(12px);
  backdrop-filter:saturate(160%) blur(12px);
  background:rgba(246, 249, 255, .72);
  border-bottom:1px solid rgba(11,18,32,.08);
  padding-top:env(safe-area-inset-top, 0px);
}

.header .container{
  max-width:min(100%, 1200px);
}
.header__inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:clamp(20px, 3vw, 32px);
  padding:12px 0;
}

.brand{
  display:flex; align-items:center; gap:12px; text-decoration:none;
  flex-shrink:0;
}
.brand__logo{
  width:44px; height:44px; object-fit:contain;
  border-radius:12px;
  background:rgba(255,255,255,.7);
  border:1px solid rgba(11,18,32,.10);
  flex-shrink:0;
}
.brand__name{
  display:flex; flex-direction:column;
  line-height:1.1;
  min-width:0;
}
.brand__name strong{font-size:16px; letter-spacing:.2px; color:var(--blue-950)}
.brand__name span{font-size:12px; color:var(--muted); font-weight:600}

.nav{
  display:flex; align-items:center;
  gap:clamp(16px, 2vw, 24px);
  min-width:0;
  flex:1;
  justify-content:flex-end;
}
.nav__links{
  display:flex; align-items:center;
  gap:clamp(6px, 1.2vw, 16px);
  flex-wrap:nowrap;
}
.nav__links a{
  text-decoration:none;
  padding:8px 12px;
  border-radius:12px;
  color:rgba(11,18,32,.88);
  white-space:nowrap;
  font-size:14px;
}
.nav__links a[aria-current="page"]{
  background:rgba(30,102,255,.10);
  color:var(--blue-900);
  border:1px solid rgba(30,102,255,.18);
}
.nav__links a:hover{
  background:rgba(11,18,32,.05);
}
.nav__cta{
  display:flex; align-items:center;
  gap:12px;
  flex-shrink:0;
}

.lang{
  display:flex; align-items:center; gap:8px;
  padding:8px 10px;
  background:rgba(255,255,255,.7);
  border:1px solid rgba(11,18,32,.10);
  border-radius:12px;
}
.lang.lang--single{
  position:relative;
  gap:0;
  padding:0;
  background:transparent;
  border:0;
}
.lang__select-native{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0, 0, 0, 0);
  white-space:nowrap;
  border:0;
}
.lang__toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  padding:0;
  margin:0;
  border:0;
  background:transparent;
  color:var(--blue-950);
  cursor:pointer;
  border-radius:12px;
  transition:color .15s ease, transform .12s ease;
}
.lang__toggle:hover{color:var(--blue-700)}
.lang__toggle:active{transform:scale(.96)}
.lang__toggle[aria-expanded="true"]{color:var(--blue-600)}
.lang__globe{
  display:block;
  width:24px;
  height:24px;
}
.lang__menu{
  position:absolute;
  z-index:120;
  top:calc(100% + 6px);
  right:0;
  min-width:10.5rem;
  padding:6px;
  margin:0;
  list-style:none;
  background:rgba(255,255,255,.98);
  border:1px solid rgba(11,18,32,.12);
  border-radius:14px;
  box-shadow:0 14px 40px rgba(2,6,23,.14);
}
.lang__menu[hidden]{display:none !important}
.lang__menu-item{
  display:flex;
  width:100%;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  margin:0;
  border:0;
  border-radius:10px;
  background:transparent;
  font:inherit;
  font-weight:700;
  font-size:14px;
  color:var(--blue-950);
  text-align:left;
  cursor:pointer;
  transition:background .12s ease;
}
.lang__menu-item:hover{background:rgba(30,102,255,.1)}
.lang__menu-item.is-current{
  background:rgba(30,102,255,.12);
  color:var(--blue-800);
}

.menu-btn{
  display:none;
  width:44px; height:44px;
  border-radius:12px;
  border:0;
  background:transparent;
  cursor:pointer;
  color:var(--blue-950);
  flex-shrink:0;
  transition:color .15s ease, transform .12s ease;
}
.menu-btn:hover{color:var(--blue-700)}
.menu-btn:active{transform:scale(.96)}
.menu-btn svg{
  width:22px;
  height:22px;
}
.menu-btn svg path{
  stroke-width:2.25;
}

/* Tablet header — keep tagline visible (compact, max 2 lines) */
@media (max-width: 1024px){
  .brand__name strong{font-size:15px}
  .brand__name span{
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    font-size:clamp(10px, 2.7vw, 12px);
    line-height:1.25;
    max-width:min(52vw, 260px);
  }
  .nav{gap:10px}
  .nav__links{gap:8px}
  .nav__links a{padding:8px 10px}
  .btn{padding:10px 12px}
}

/* Tablet+Mobile: switch to hamburger earlier — language control before menu */
@media (max-width: 900px){
  .header__inner{
    gap:8px;
    padding:10px 0;
    align-items:center;
  }
  .brand{gap:10px; min-width:0; flex:1}
  .brand__logo{
    width:54px;
    height:54px;
    border-radius:14px;
  }
  .brand__name{min-width:0}
  .brand__name span{max-width:min(46vw, 200px)}
  .nav{gap:8px; flex:0 0 auto}
  .nav__cta{order:1; gap:6px}
  .menu-btn{order:2}
  .nav__links{order:3}
  .lang__toggle{
    width:46px;
    height:46px;
  }
  .lang__globe{width:22px; height:22px}
  .menu-btn{
    width:46px;
    height:46px;
    border-radius:13px;
  }
  .nav__links{display:none}
  .menu-btn{display:inline-flex; align-items:center; justify-content:center}
  /* keep top bar compact */
  .nav__cta .btn--blue{display:none}
  body{
    padding-bottom:env(safe-area-inset-bottom, 0px);
  }
  body.nav-open .nav__links{
    display:flex;
    position:fixed;
    z-index:100;
    top:calc(env(safe-area-inset-top, 0px) + 5.5rem);
    left:max(12px, env(safe-area-inset-left, 0px));
    right:max(12px, env(safe-area-inset-right, 0px));
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    padding:12px;
    max-height:calc(100vh - env(safe-area-inset-top, 0px) - 5.5rem - 12px);
    max-height:calc(100dvh - env(safe-area-inset-top, 0px) - 5.5rem - 12px); /* dynamic viewport on mobile */
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    background:rgba(246, 249, 255, .96);
    border:1px solid rgba(11,18,32,.10);
    border-radius:18px;
    box-shadow: 0 18px 50px rgba(2,6,23,.12);
  }
  body.nav-open .nav__links a{
    padding:14px 14px;
    min-height:44px;
    display:flex;
    align-items:center;
  }
}

/* Homepage lead capture modal */
.home-lead-modal{
  position:fixed;
  inset:0;
  z-index:2000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:max(16px, env(safe-area-inset-top, 0px) + 12px) max(16px, env(safe-area-inset-right, 0px))
    max(16px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .32s ease, visibility 0s linear .32s;
}
.home-lead-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:opacity .32s ease, visibility 0s linear 0s;
}
.home-lead-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(6, 26, 68, .52);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  cursor:pointer;
}
.home-lead-modal__dialog{
  position:relative;
  z-index:1;
  width:min(100%, 420px);
  max-height:min(92vh, 640px);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:calc(var(--radius) + 8px);
  background:linear-gradient(165deg, rgba(255,255,255,.98) 0%, rgba(232,241,255,.94) 55%, rgba(255,255,255,.99) 100%);
  border:1px solid rgba(30,102,255,.28);
  box-shadow:
    0 28px 80px rgba(6, 26, 68, .28),
    0 0 0 1px rgba(255,255,255,.75) inset;
  transform:translateY(12px) scale(.97);
  transition:transform .34s cubic-bezier(.22, 1, .36, 1);
}
.home-lead-modal.is-open .home-lead-modal__dialog{
  transform:translateY(0) scale(1);
}
.home-lead-modal__glow{
  position:absolute;
  top:-30%;
  right:-25%;
  width:min(280px, 70vw);
  height:min(280px, 70vw);
  background:radial-gradient(circle, rgba(30,102,255,.22) 0%, transparent 68%);
  pointer-events:none;
  border-radius:50%;
}
.home-lead-modal__close{
  position:absolute;
  top:12px;
  right:12px;
  z-index:3;
  width:40px;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:none;
  border-radius:12px;
  background:rgba(255,255,255,.85);
  color:var(--blue-950);
  font-size:26px;
  line-height:1;
  font-weight:300;
  cursor:pointer;
  box-shadow:0 4px 16px rgba(30,102,255,.12);
  border:1px solid rgba(30,102,255,.18);
  transition:background .2s ease, transform .2s ease;
}
.home-lead-modal__close:hover{
  background:#fff;
  transform:scale(1.05);
}
.home-lead-modal__close:focus-visible{
  outline:2px solid var(--blue-600);
  outline-offset:2px;
}
.home-lead-modal__inner{
  position:relative;
  z-index:2;
  padding:clamp(22px, 4vw, 28px) clamp(18px, 4vw, 26px) clamp(20px, 3vw, 24px);
  padding-top:clamp(28px, 5vw, 36px);
}
.home-lead-modal__brand{
  margin:0 0 8px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--blue-700);
}
.home-lead-modal__title{
  margin:0;
  font-size:clamp(1.35rem, 4.2vw, 1.65rem);
  letter-spacing:-.03em;
  line-height:1.2;
  color:var(--blue-950);
}
.home-lead-modal__desc{
  margin:10px 0 0;
  font-size:14px;
  line-height:1.6;
  color:rgba(11,18,32,.78);
}
.home-lead-modal__timer{
  margin-top:16px;
}
.home-lead-modal__timer-label{
  display:block;
  font-size:11px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(11,18,32,.5);
  margin-bottom:8px;
}
.home-lead-modal__timer-track{
  height:4px;
  border-radius:999px;
  background:rgba(30,102,255,.12);
  overflow:hidden;
}
.home-lead-modal__timer-bar{
  height:100%;
  width:100%;
  border-radius:inherit;
  background:linear-gradient(90deg, var(--blue-600), #14b8a6);
  transform-origin:left center;
  transform:scaleX(1);
}
.home-lead-modal.is-open .home-lead-modal__timer-bar{
  animation:home-lead-progress 15s linear forwards;
}
@keyframes home-lead-progress{
  from{ transform:scaleX(1); }
  to{ transform:scaleX(0); }
}
@media (prefers-reduced-motion: reduce){
  .home-lead-modal__dialog{ transition:none; }
  .home-lead-modal.is-open .home-lead-modal__timer-bar{
    animation:none;
    transform:scaleX(.35);
    opacity:.7;
  }
}
.home-lead-modal__form{
  margin-top:18px;
  display:grid;
  gap:14px;
}
.home-lead-modal__form .form__field{
  margin:0;
}
.home-lead-modal__hint{
  margin:0;
  font-size:12px;
  line-height:1.5;
  color:var(--muted);
}
.home-lead-modal__actions{
  margin-top:4px;
}
.home-lead-modal__actions .btn{
  width:100%;
  min-height:48px;
  justify-content:center;
  font-size:15px;
}

/* Wear our brand — homepage merch */
.section--merch{
  position:relative;
  padding:clamp(40px, 6vw, 72px) 0;
  overflow:hidden;
  background:
    radial-gradient(ellipse 100% 80% at 10% 20%, rgba(30,102,255,.14), transparent 50%),
    radial-gradient(ellipse 70% 60% at 92% 75%, rgba(234,179,8,.12), transparent 45%),
    linear-gradient(180deg, rgba(255,255,255,.97) 0%, rgba(240,247,255,.65) 42%, rgba(255,252,245,.9) 100%);
  border-block:1px solid rgba(30,102,255,.1);
}
@media (max-width: 699px){
  .section--merch{
    overflow:visible;
  }
}
.section--merch::before{
  content:'';
  position:absolute;
  inset:auto 0 0 0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(212,175,55,.35), rgba(30,102,255,.2), transparent);
  pointer-events:none;
}
.merch-layout{
  display:grid;
  gap:clamp(28px, 5vw, 48px);
  align-items:start;
  min-width:0;
}
@media (min-width: 900px){
  .merch-layout{
    grid-template-columns:minmax(0, 1fr) minmax(0, 1.12fr);
    gap:clamp(32px, 4vw, 56px);
    align-items:center;
  }
}
.merch-intro{
  position:relative;
  text-align:center;
  min-width:0;
}
/* Phones: match pre-reflow centered column; prevent grid min-content blowout from carousel track */
@media (max-width: 699px){
  .merch-layout{
    gap:clamp(18px, 4vw, 28px);
  }
  .merch-intro{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    max-width:min(36rem, 100%);
    margin-inline:auto;
    width:100%;
    box-sizing:border-box;
  }
  .merch-intro .merch-section__eyebrow{
    justify-content:center;
    align-self:center;
    max-width:100%;
  }
  .merch-intro .merch-section__eyebrow::before{
    display:none;
  }
  .merch-intro .merch-section__eyebrow::after{
    content:'';
    width:28px;
    height:3px;
    border-radius:999px;
    margin-left:8px;
    background:linear-gradient(90deg, var(--blue-600), #eab308, #ca8a04);
  }
  .merch-showcase{
    min-width:0;
    max-width:100%;
    margin-inline:0;
  }
  .merch-highlights{
    justify-content:center;
    margin:clamp(12px, 3vw, 18px) auto clamp(16px, 3vw, 24px);
    width:100%;
    max-width:min(52rem, 100%);
  }
}
@media (min-width: 900px){
  .merch-intro{
    text-align:left;
    padding-left:clamp(18px, 2vw, 26px);
  }
  .merch-intro::before{
    content:'';
    position:absolute;
    left:0;
    top:0.25em;
    bottom:0.25em;
    width:4px;
    border-radius:999px;
    background:linear-gradient(180deg, #ca8a04, #eab308, var(--blue-600));
    box-shadow:0 0 20px rgba(234,179,8,.25);
  }
}
/* Tablet + below desktop column: centered eyebrow (700–899px); phones use rules above */
@media (min-width: 700px) and (max-width: 899px){
  .merch-intro .merch-section__eyebrow{
    justify-content:center;
    width:100%;
  }
  .merch-intro .merch-section__eyebrow::before{
    display:none;
  }
  .merch-intro .merch-section__eyebrow::after{
    content:'';
    width:28px;
    height:3px;
    border-radius:999px;
    margin-left:8px;
    background:linear-gradient(90deg, var(--blue-600), #eab308, #ca8a04);
  }
}
@media (min-width: 900px){
  .merch-intro .merch-section__eyebrow::after{
    display:none;
  }
}
.merch-intro__title{
  margin:0;
  font-size:clamp(1.35rem, 3.8vw, 2rem);
  letter-spacing:-.035em;
  color:var(--blue-950);
}
.merch-intro__lead{
  margin:10px 0 0;
  font-size:clamp(14px, 1.35vw, 16px);
  line-height:1.65;
  color:rgba(11,18,32,.78);
  max-width:46ch;
}
@media (max-width: 899px){
  .merch-intro__lead{
    margin-left:auto;
    margin-right:auto;
  }
}
.merch-section__eyebrow{
  margin:0 0 10px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--blue-700);
}
.merch-section__eyebrow::before{
  content:'';
  width:28px;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg, #ca8a04, #eab308, var(--blue-600));
}
.merch-showcase{
  width:100%;
  max-width:min(1040px, 100%);
  margin:0 auto;
  position:relative;
  min-width:0;
}
@media (min-width: 700px){
  .merch-showcase{
    padding:clamp(20px, 3vw, 32px);
    border-radius:calc(var(--radius) + 14px);
    background:
      linear-gradient(165deg, rgba(255,255,255,.92) 0%, rgba(240,247,255,.55) 45%, rgba(255,252,245,.75) 100%);
    border:1px solid rgba(30,102,255,.14);
    box-shadow:
      0 20px 56px rgba(30,102,255,.09),
      0 0 0 1px rgba(255,255,255,.65) inset;
  }
  .merch-showcase::after{
    content:'';
    position:absolute;
    inset:0;
    border-radius:inherit;
    pointer-events:none;
    background:radial-gradient(ellipse 55% 45% at 100% 0%, rgba(234,179,8,.12), transparent 58%);
  }
}
.merch-highlights{
  list-style:none;
  margin:clamp(16px, 3vw, 22px) 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-start;
  gap:10px;
  max-width:100%;
}
@media (min-width: 700px) and (max-width: 899px){
  .merch-highlights{
    justify-content:center;
  }
}
@media (min-width: 900px){
  .merch-layout .merch-showcase{
    margin-inline:0;
    max-width:none;
  }
}
.merch-highlights__item{
  font-size:clamp(12px, 2.8vw, 13px);
  font-weight:800;
  padding:8px 14px;
  border-radius:999px;
  color:var(--blue-950);
  background:linear-gradient(135deg, rgba(255,255,255,.98), rgba(254,243,199,.45));
  border:1px solid rgba(234,179,8,.4);
  box-shadow:0 6px 18px rgba(30,102,255,.07);
}
.merch-carousel--mobile{
  display:none;
  overflow-x:scroll;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x mandatory;
  scroll-behavior:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
  padding-bottom:6px;
  min-width:0;
}
.merch-carousel--mobile::-webkit-scrollbar{
  display:none;
}
.merch-carousel__track{
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  gap:14px;
  width:max-content;
  padding:4px 0 10px;
}
@media (max-width: 699px){
  .merch-grid--web{
    display:none !important;
  }
  .merch-carousel--mobile{
    display:block;
    margin-left:calc(-1 * clamp(16px, 4vw, 72px));
    margin-right:calc(-1 * clamp(16px, 4vw, 72px));
    width:calc(100% + 2 * clamp(16px, 4vw, 72px));
    padding-left:clamp(16px, 4vw, 72px);
    padding-right:clamp(16px, 4vw, 72px);
    box-sizing:border-box;
    scroll-snap-type:none;
  }
  .merch-carousel__track{
    gap:12px;
    padding-left:0;
    padding-right:0;
  }
  .merch-carousel--mobile .merch-card--carousel{
    flex:0 0 min(86vw, 320px);
    max-width:320px;
  }
}
@media (min-width: 700px){
  .merch-carousel--mobile{
    display:none !important;
  }
}
.merch-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:clamp(14px, 2.5vw, 28px);
  align-items:stretch;
}
@media (max-width: 699px){
  .merch-grid:not(.merch-grid--web){
    grid-template-columns:1fr;
    gap:clamp(18px, 4vw, 22px);
  }
}
@media (min-width: 700px) and (max-width: 899px){
  .merch-grid--web{
    gap:clamp(16px, 2.2vw, 22px);
  }
}
@media (min-width: 900px){
  .merch-grid--web{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:clamp(20px, 2.8vw, 32px);
    align-items:end;
  }
  .merch-card--featured{
    transform:scale(1.02);
    z-index:1;
    box-shadow:
      0 16px 48px rgba(30,102,255,.12),
      0 0 0 1px rgba(234,179,8,.2),
      0 1px 0 rgba(255,255,255,.95) inset;
  }
  .merch-card--accent{
    transform:translateY(12px);
  }
}
@media (min-width: 900px) and (prefers-reduced-motion: reduce){
  .merch-card--featured,
  .merch-card--accent{
    transform:none;
  }
}
.merch-card{
  position:relative;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:calc(var(--radius) + 10px);
  border:1px solid rgba(30,102,255,.18);
  background:
    linear-gradient(155deg, rgba(255,255,255,.99) 0%, rgba(248,250,255,.95) 40%, rgba(255,252,240,.88) 100%);
  box-shadow:
    0 12px 40px rgba(30,102,255,.08),
    0 1px 0 rgba(255,255,255,.9) inset;
  padding:0;
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
@media (hover:hover) and (pointer:fine){
  .merch-card:hover{
    transform:translateY(-4px);
    border-color:rgba(212,175,55,.45);
    box-shadow:
      0 22px 56px rgba(30,102,255,.12),
      0 0 0 1px rgba(234,179,8,.15),
      0 1px 0 rgba(255,255,255,.95) inset;
  }
  @media (min-width: 900px){
    .merch-card--featured:hover{
      transform:scale(1.02) translateY(-4px);
    }
    .merch-card--accent:hover{
      transform:translateY(8px);
    }
  }
}
@media (prefers-reduced-motion: reduce){
  .merch-card{ transition:none; }
  .merch-card:hover{ transform:none; }
}
.merch-card__media{
  position:relative;
  aspect-ratio:4/3;
  background:linear-gradient(145deg, rgba(225,236,255,.55), rgba(254,243,199,.25), rgba(200,220,255,.3));
  overflow:hidden;
}
@media (max-width: 699px){
  .merch-card__media{
    aspect-ratio:16/11;
    min-height:min(220px, 52vw);
  }
}
.merch-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .45s ease;
}
@media (hover:hover) and (pointer:fine){
  .merch-card:hover .merch-card__media img{
    transform:scale(1.04);
  }
}
@media (prefers-reduced-motion: reduce){
  .merch-card__media img{ transition:none; }
  .merch-card:hover .merch-card__media img{ transform:none; }
}
/* Golden discount badge + shimmer */
.merch-card__badge{
  position:absolute;
  top:clamp(10px, 2.2vw, 16px);
  right:clamp(10px, 2.2vw, 16px);
  z-index:2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 15px;
  min-height:34px;
  font-size:clamp(10px, 2.1vw, 12px);
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:#3a2314;
  border-radius:999px;
  border:1px solid rgba(146,64,14,.65);
  background:linear-gradient(
    135deg,
    #713f12 0%,
    #a16207 14%,
    #b45309 28%,
    #ca8a04 38%,
    #eab308 48%,
    #fde047 52%,
    #facc15 58%,
    #ca8a04 72%,
    #92400e 88%,
    #451a03 100%
  );
  background-size:200% 200%;
  box-shadow:
    0 6px 22px rgba(120,53,15,.55),
    0 2px 8px rgba(234,179,8,.35),
    0 0 0 1px rgba(255,255,255,.42) inset,
    inset 0 1px 0 rgba(255,255,255,.58),
    inset 0 -1px 0 rgba(69,26,3,.2);
  overflow:hidden;
  isolation:isolate;
  animation:merch-badge-glow 4s ease-in-out infinite;
}
.merch-card__badge-text{
  position:relative;
  z-index:2;
  text-shadow:
    0 1px 0 rgba(255,255,255,.65),
    0 0 12px rgba(255,255,255,.35),
    0 1px 2px rgba(58,35,20,.45);
}
.merch-card__badge::after{
  content:'';
  position:absolute;
  inset:-40% -60%;
  width:55%;
  background:linear-gradient(
    100deg,
    transparent 0%,
    rgba(255,255,255,.12) 38%,
    rgba(255,255,255,.95) 50%,
    rgba(255,255,255,.12) 62%,
    transparent 100%
  );
  transform:translateX(-180%) skewX(-18deg);
  animation:merch-badge-shimmer 2.2s ease-in-out infinite;
  pointer-events:none;
}
@keyframes merch-badge-shimmer{
  0%, 6%{ transform:translateX(-180%) skewX(-18deg); }
  42%{ transform:translateX(220%) skewX(-18deg); }
  100%{ transform:translateX(220%) skewX(-18deg); }
}
@keyframes merch-badge-glow{
  0%, 100%{ background-position:0% 50%; }
  50%{ background-position:100% 50%; }
}
@media (prefers-reduced-motion: reduce){
  .merch-card__badge{ animation:none; }
  .merch-card__badge::after{ animation:none; opacity:0; }
}
.merch-card__body{
  position:relative;
  padding:clamp(16px, 3vw, 22px) clamp(16px, 3vw, 22px) clamp(18px, 3vw, 24px);
  display:flex;
  flex-direction:column;
  gap:clamp(8px, 1.5vw, 12px);
  flex:1;
}
.merch-card__body::before{
  content:'';
  position:absolute;
  top:0;
  left:clamp(16px, 3vw, 22px);
  right:clamp(16px, 3vw, 22px);
  height:1px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(202,138,4,.85), rgba(234,179,8,.75), rgba(30,102,255,.45));
  pointer-events:none;
}
.merch-card__body h3{
  margin:0;
  font-size:clamp(1.08rem, 2.6vw, 1.28rem);
  line-height:1.25;
  color:var(--blue-950);
  letter-spacing:-.02em;
}
.merch-card__price{
  margin:0;
  font-size:clamp(1.25rem, 3.2vw, 1.45rem);
  font-weight:900;
  color:var(--blue-700);
  letter-spacing:-.02em;
}
.merch-card__body .btn{
  margin-top:auto;
  align-self:flex-start;
  min-height:46px;
  padding-left:clamp(16px, 3vw, 22px);
  padding-right:clamp(16px, 3vw, 22px);
}
@media (max-width: 699px){
  .merch-card__body .btn{
    width:100%;
    align-self:stretch;
    justify-content:center;
  }
}

.merch-modal{
  position:fixed;
  inset:0;
  z-index:2100;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:max(12px, env(safe-area-inset-top, 0px) + 8px) max(12px, env(safe-area-inset-right, 0px))
    max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .28s ease, visibility 0s linear .28s;
}
.merch-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:opacity .28s ease, visibility 0s linear 0s;
}
.merch-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(6, 26, 68, .5);
  -webkit-backdrop-filter:blur(5px);
  backdrop-filter:blur(5px);
  cursor:pointer;
}
.merch-modal__dialog{
  position:relative;
  z-index:1;
  width:min(100%, 440px);
  max-height:min(92dvh, 720px);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:calc(var(--radius) + 6px);
  background:linear-gradient(180deg, rgba(255,255,255,.99) 0%, rgba(232,241,255,.95) 100%);
  border:1px solid rgba(30,102,255,.25);
  box-shadow:0 24px 70px rgba(6, 26, 68, .25);
  transform:translateY(10px) scale(.98);
  transition:transform .3s cubic-bezier(.22, 1, .36, 1);
}
.merch-modal.is-open .merch-modal__dialog{
  transform:translateY(0) scale(1);
}
.merch-modal__close{
  position:absolute;
  top:10px;
  right:10px;
  z-index:3;
  width:40px;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:none;
  border-radius:12px;
  background:rgba(255,255,255,.9);
  color:var(--blue-950);
  font-size:24px;
  line-height:1;
  font-weight:300;
  cursor:pointer;
  border:1px solid rgba(30,102,255,.18);
  box-shadow:0 4px 14px rgba(30,102,255,.1);
}
.merch-modal__close:hover{ background:#fff; }
.merch-modal__close:focus-visible{
  outline:2px solid var(--blue-600);
  outline-offset:2px;
}
.merch-modal__inner{
  padding:clamp(20px, 4vw, 26px) clamp(16px, 4vw, 22px) 20px;
  padding-top:clamp(26px, 5vw, 34px);
}
.merch-modal__title{
  margin:0 0 6px;
  font-size:1.15rem;
  font-weight:900;
  color:var(--blue-950);
}
.merch-modal__summary{
  margin:0 0 16px;
  padding:10px 12px;
  font-size:13px;
  font-weight:700;
  color:var(--blue-800);
  background:rgba(30,102,255,.1);
  border-radius:12px;
  border:1px solid rgba(30,102,255,.18);
}
.merch-modal__form{
  display:grid;
  gap:12px;
}
.merch-modal__form .form__field{ margin:0; }
.merch-modal__form textarea{
  min-height:88px;
  resize:vertical;
}
.merch-modal__form select{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(11,18,32,.14);
  background:rgba(255,255,255,.9);
  font:inherit;
  cursor:pointer;
}
.form__field.is-invalid select{
  border-color:#d32f2f;
  background:rgba(211,47,47,.06);
}
.merch-modal__submit{
  width:100%;
  min-height:48px;
  justify-content:center;
  margin-top:4px;
}
@media (prefers-reduced-motion: reduce){
  .merch-modal__dialog{ transition:none; }
}

/* Shop page — hero + homepage merch teaser */
.shop-hero{
  position:relative;
  padding:clamp(36px, 7vw, 72px) 0 clamp(36px, 8vw, 64px);
  overflow:visible;
  background:
    radial-gradient(ellipse 90% 70% at 0% 0%, rgba(234,179,8,.22), transparent 55%),
    radial-gradient(ellipse 70% 60% at 100% 30%, rgba(30,102,255,.18), transparent 50%),
    linear-gradient(165deg, rgba(255,255,255,.98) 0%, rgba(240,247,255,.88) 45%, rgba(255,252,245,.95) 100%);
  border-bottom:1px solid rgba(30,102,255,.1);
}
.shop-hero::before{
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 85% 75%, rgba(212,175,55,.12), transparent 42%);
  pointer-events:none;
}
.shop-hero__grid{
  position:relative;
  z-index:1;
  display:grid;
  gap:clamp(24px, 5vw, 40px);
  align-items:center;
}
@media (min-width: 768px){
  .shop-hero__grid{
    grid-template-columns:minmax(0, 1fr) minmax(0, 1.12fr);
    align-items:center;
  }
}
.shop-hero__eyebrow{
  margin:0 0 10px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--blue-700);
}
.shop-hero__grid h1{
  margin:0 0 12px;
  font-size:clamp(1.6rem, 4.5vw, 2.35rem);
  letter-spacing:-.04em;
  line-height:1.12;
  color:var(--blue-950);
}
.shop-hero__lead{
  margin:0 0 18px;
  max-width:40rem;
  font-size:clamp(15px, 1.5vw, 17px);
  line-height:1.65;
  color:rgba(11,18,32,.78);
}
.shop-hero__perks{
  list-style:none;
  margin:0 0 22px;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.shop-hero__perks li{
  font-size:12px;
  font-weight:800;
  padding:8px 14px;
  border-radius:999px;
  color:var(--blue-950);
  background:linear-gradient(135deg, rgba(255,255,255,.95), rgba(254,243,199,.5));
  border:1px solid rgba(234,179,8,.45);
  box-shadow:0 4px 14px rgba(30,102,255,.08);
}
.shop-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}
.shop-hero__actions .btn--ghost.btn--shimmer{
  background:linear-gradient(
    90deg,
    rgba(240,247,255,.88) 0%,
    rgba(240,247,255,.88) 30%,
    rgba(219,234,254,.98) 50%,
    rgba(240,247,255,.88) 70%,
    rgba(240,247,255,.88) 100%
  );
  background-size:200% 100%;
  animation:btn-shimmer 2.5s ease-in-out infinite;
  color:var(--blue-800);
  border:2px solid var(--blue-600);
  box-shadow:0 2px 16px rgba(30,102,255,.14);
  text-shadow:none;
}
.shop-hero__actions .btn--ghost.btn--shimmer:hover{
  color:var(--blue-950);
  border-color:var(--blue-700);
  background-size:200% 100%;
  animation:btn-shimmer 2.5s ease-in-out infinite;
  box-shadow:0 4px 22px rgba(30,102,255,.2);
}
@media (prefers-reduced-motion: reduce){
  .shop-hero__actions .btn--ghost.btn--shimmer,
  .shop-hero__actions .btn--ghost.btn--shimmer:hover{
    animation:none;
    background:rgba(240,247,255,.75);
    background-size:auto;
  }
}
.shop-hero__visual{
  position:relative;
  min-height:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
}
/* Shop hero — crossfading tee/cap + ribbon promo (responsive) */
.shop-hero__grid{
  align-items:center;
}
@media (max-width: 767px){
  .shop-hero__grid{
    display:flex;
    flex-direction:column;
    gap:clamp(18px, 5vw, 26px);
  }
  .shop-hero__visual.shop-hero__showcase{
    order:-1;
    width:100%;
    max-width:none;
    margin:0;
    padding-top:clamp(12px, 4vw, 20px);
  }
}
.shop-hero__visual.shop-hero__showcase{
  --shop-hero-diameter:min(88vw, 420px);
  width:100%;
  max-width:min(560px, 100%);
  margin-inline:auto;
  isolation:isolate;
}
@media (min-width: 480px){
  .shop-hero__visual.shop-hero__showcase{
    --shop-hero-diameter:min(82vw, 480px);
  }
}
@media (min-width: 768px){
  .shop-hero__visual.shop-hero__showcase{
    --shop-hero-diameter:min(100%, min(52vw, 520px));
    margin-inline:0 0;
    margin-left:auto;
    max-width:100%;
  }
}
@media (min-width: 1100px){
  .shop-hero__visual.shop-hero__showcase{
    --shop-hero-diameter:min(100%, 520px);
  }
}
.shop-hero__showcase-bg{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  width:calc(min(var(--shop-hero-diameter), 100%) + clamp(20px, 5vw, 40px));
  height:calc(min(var(--shop-hero-diameter), 100%) + clamp(20px, 5vw, 40px));
  max-width:min(96vw, 100%);
  max-height:min(96vw, 100%);
  z-index:0;
  border-radius:50%;
  background:
    radial-gradient(ellipse 75% 70% at 40% 35%, rgba(30,102,255,.18), transparent 58%),
    radial-gradient(ellipse 65% 60% at 72% 68%, rgba(234,179,8,.26), transparent 55%);
  opacity:.95;
  animation:shop-showcase-glow 12s ease-in-out infinite;
}
@keyframes shop-showcase-glow{
  0%, 100%{ transform:translate(-50%, -50%) scale(1); opacity:.95; }
  50%{ transform:translate(-50%, -50%) scale(1.05); opacity:1; }
}
.shop-hero__rotator{
  position:relative;
  z-index:1;
  width:min(var(--shop-hero-diameter), 100%);
  aspect-ratio:1;
  height:auto;
  margin-inline:auto;
  overflow:visible;
  background:transparent;
}
.shop-hero__rotator-clip{
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:50%;
  overflow:hidden;
  background:rgba(255,255,255,.96);
  box-shadow:
    0 22px 56px rgba(11, 18, 32, .16),
    0 0 0 1px rgba(255,255,255,.98) inset,
    0 0 0 3px rgba(30,102,255,.14);
}
.shop-hero__rotator-slide{
  position:absolute;
  inset:0;
  margin:0;
  padding:0;
  opacity:0;
}
.shop-hero__rotator-slide--a{
  animation:shop-hero-crossfade-a 5.5s ease-in-out infinite;
}
.shop-hero__rotator-slide--b{
  animation:shop-hero-crossfade-b 5.5s ease-in-out infinite;
}
.shop-hero__rotator-slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  transform:scale(1.03);
}
@keyframes shop-hero-crossfade-a{
  0%, 40%{ opacity:1; }
  48%, 92%{ opacity:0; }
  100%{ opacity:1; }
}
@keyframes shop-hero-crossfade-b{
  0%, 40%{ opacity:0; }
  48%, 92%{ opacity:1; }
  100%{ opacity:0; }
}
.shop-hero__promo-tag{
  position:absolute;
  top:0;
  right:0;
  z-index:5;
  padding:8px 12px 8px 14px;
  max-width:calc(100% - 16px);
  background:linear-gradient(135deg, var(--blue-800) 0%, var(--blue-600) 55%, #2563eb 100%);
  color:#fff;
  border-radius:999px;
  border:2px solid rgba(255,255,255,.5);
  box-shadow:
    0 6px 20px rgba(30,102,255,.45),
    inset 0 1px 0 rgba(255,255,255,.25),
    0 0 0 2px #eab308;
  transform:translate(6px, -6px);
}
.shop-hero__promo-tag-text{
  display:block;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  line-height:1.25;
  text-shadow:0 1px 2px rgba(0,0,0,.35);
  white-space:nowrap;
}
.shop-hero__rotator-hint{
  position:relative;
  z-index:1;
  margin:0;
  font-size:11px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(11,18,32,.45);
  text-align:center;
}
@media (max-width: 767px){
  .shop-hero__visual.shop-hero__showcase{
    --shop-hero-diameter:min(86vw, 400px);
  }
  .shop-hero__promo-tag{
    top:0;
    right:0;
    padding:7px 11px 7px 13px;
    transform:translate(4px, -8px);
    max-width:min(calc(100% - 8px), 11rem);
    box-shadow:
      0 4px 16px rgba(30,102,255,.5),
      0 0 0 1px rgba(255,255,255,.2),
      inset 0 1px 0 rgba(255,255,255,.25),
      0 0 0 2px #eab308;
  }
  .shop-hero__promo-tag-text{
    font-size:11px;
    letter-spacing:.06em;
  }
}
@media (hover: hover){
  .shop-hero__rotator:hover .shop-hero__rotator-slide img{
    transform:scale(1.06);
    transition:transform .6s ease;
  }
}
@media (prefers-reduced-motion: reduce){
  .shop-hero__showcase-bg{ animation:none; transform:translate(-50%, -50%); }
  .shop-hero__rotator{
    width:100%;
    max-width:min(560px, 100%);
    height:auto;
    aspect-ratio:auto;
    overflow:visible;
    background:transparent;
  }
  .shop-hero__rotator-clip{
    position:relative;
    inset:auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    padding:10px;
    border-radius:clamp(20px, 4vw, 28px);
    overflow:visible;
    background:rgba(255,255,255,.96);
    box-shadow:0 12px 36px rgba(11,18,32,.12), 0 0 0 1px rgba(255,255,255,.98) inset;
  }
  .shop-hero__rotator-slide{
    position:relative;
    inset:auto;
    opacity:1;
    animation:none;
    aspect-ratio:1;
    border-radius:50%;
    overflow:hidden;
    box-shadow:0 8px 24px rgba(11,18,32,.1);
  }
  .shop-hero__promo-tag{
    top:8px;
    right:8px;
    transform:none;
    padding:6px 10px;
    max-width:none;
  }
}
.section--merch-page{
  padding-top:clamp(28px, 5vw, 48px);
}
.section--merch-page .merch-intro__title{
  font-size:clamp(1.25rem, 3.2vw, 1.75rem);
}
.merch-teaser{
  padding:clamp(28px, 5vw, 44px) 0;
  background:linear-gradient(180deg, rgba(255,255,255,.5) 0%, rgba(240,247,255,.35) 100%);
}
.merch-teaser__card{
  display:flex;
  flex-direction:column;
  gap:clamp(18px, 3.5vw, 26px);
  align-items:stretch;
  padding:clamp(20px, 4vw, 28px);
  border-radius:calc(var(--radius) + 10px);
  background:linear-gradient(155deg, rgba(255,255,255,.96) 0%, rgba(254,243,199,.22) 100%);
  border:1px solid rgba(30,102,255,.14);
  box-shadow:0 16px 44px rgba(30,102,255,.1);
}
.merch-teaser__top{
  max-width:40rem;
}
.merch-teaser__top h2,
.merch-teaser__card h2{
  margin:6px 0 8px;
  font-size:clamp(1.2rem, 3vw, 1.5rem);
  color:var(--blue-950);
}
.merch-teaser__top p,
.merch-teaser__card > p{
  margin:0;
  max-width:36rem;
  color:rgba(11,18,32,.76);
  line-height:1.55;
}
.merch-teaser__showcase{
  width:100%;
  min-width:0;
}
.merch-teaser__actions{
  display:none;
}
@media (min-width: 700px){
  .merch-teaser__actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    align-items:center;
    justify-content:center;
    width:100%;
    padding-top:clamp(4px, 1.2vw, 10px);
  }
  .merch-teaser__actions .btn{
    flex-shrink:0;
    width:auto;
  }
}

/* Scrolling ticker tape — FREE HOME DELIVERY (between header and hero) */
.ticker{
  overflow:hidden;
  background:linear-gradient(90deg, var(--blue-700), var(--blue-600));
  color:#fff;
  padding:12px 0;
  white-space:nowrap;
  border-bottom:3px solid rgba(255,255,255,.35);
  box-shadow:0 4px 20px rgba(30,102,255,.4);
  flex-shrink:0;
}
.ticker__track{
  display:inline-flex;
  align-items:center;
  gap:32px;
  animation:ticker-scroll 18s linear infinite;
}
.ticker__text{
  font-weight:900;
  font-size:16px;
  letter-spacing:.2em;
  text-transform:uppercase;
  text-shadow:0 1px 3px rgba(0,0,0,.25);
}
.ticker__sep{
  opacity:.8;
  font-size:14px;
}
@keyframes ticker-scroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}

.menu-btn:focus-visible,
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:3px solid rgba(30,102,255,.35);
  outline-offset:2px;
}

.hero{
  padding: 0 0 26px;
}
/* Hero copy: full text on desktop/web; short line only ≤1024px (mobile + tablet) */
.hero__lead--mobile{
  display: none !important;
}
@media (max-width: 1024px){
  .hero__lead--desktop{
    display: none !important;
  }
  .hero__lead--mobile{
    display: block !important;
  }
}
/* Home hero: title/CTAs overlaid on video (gradient scrim for contrast) */
.hero--home .hero__panel{
  display: block;
  position: relative;
  overflow: hidden;
  min-height: unset;
  background: none;
  background-image: none;
  color: #fff;
  border: none;
  box-shadow: none;
}
.hero--home .hero__media--home{
  position: relative;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: min(100dvh, 100vh, 960px);
  background-color: #0b1220;
  line-height: 0;
  box-sizing: border-box;
}
/* Home: single video on mobile/tablet; image slider on desktop */
.hero--home .hero__video--home-mobile{
  display: none;
}
@media (max-width: 1024px){
  .hero--home .hero__video--home-mobile{
    display: block;
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    min-width: 0;
    object-fit: cover;
    object-position: center top;
    background-color: #0b1220;
  }
  .hero--home .hero__media--home .hero-slider{
    display: none;
  }
}
.hero--home .hero-slider{
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
.hero--home .hero-slider__track{
  position: relative;
  width: 100%;
  height: 100%;
  min-height: inherit;
}
.hero--home .hero-slider__slide{
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.85s ease;
  pointer-events: none;
}
.hero--home .hero-slider__slide.is-active{
  opacity: 1;
  z-index: 0;
}
.hero--home .hero-slider__slide img{
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  object-fit: cover;
  object-position: center top;
  background-color: #0b1220;
}
.hero--home .hero-slider__dots{
  position: absolute;
  left: 50%;
  bottom: max(18px, env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%);
  display: flex;
  gap: 10px;
  z-index: 2;
  pointer-events: auto;
}
.hero--home .hero-slider__dot{
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.8);
  background: rgba(255, 255, 255, 0.35);
  padding: 0;
  cursor: pointer;
  box-sizing: border-box;
}
.hero--home .hero-slider__dot.is-active{
  background: #fff;
  transform: scale(1.12);
}
.hero--home .hero__panel::before{
  display: none;
}
.hero--home .hero__inner{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  pointer-events: none;
  display: grid;
  grid-template-columns: 1fr;
  max-width: none;
  width: 100%;
  margin: 0;
  box-sizing: border-box;
  padding: clamp(16px, 4vw, 28px) max(clamp(16px, 4vw, 72px), env(safe-area-inset-left, 0px)) max(20px, env(safe-area-inset-bottom, 0px)) max(clamp(16px, 4vw, 72px), env(safe-area-inset-right, 0px));
  background: none;
  border: none;
  border-radius: 0;
  box-shadow: none;
  align-items: flex-start;
  justify-items: start;
  color: #fff;
}
.hero--home .hero__content{
  text-align: left;
  width: 100%;
  pointer-events: auto;
}
.hero--home .hero__content h1,
.hero--home .hero__content p,
.hero--home .hero__content .hero__actions{
  text-align: left;
}
.hero--home .hero__actions{
  justify-content: flex-start;
}
.hero--home h1{
  color: #fff;
  text-shadow: none;
}
.hero.hero--home .hero__content p,
.hero.hero--home p{
  color: rgba(255, 255, 255, 0.92);
  text-shadow: none;
}
.hero--home .btn--primary{
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
  color: var(--blue-900);
  background: #fff;
}
.hero--home .btn--ghost{
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.35);
}
.hero--home .btn--ghost:hover{
  background: rgba(255, 255, 255, 0.22);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.5);
}
.hero--home .btn--ghost.btn--shimmer{
  background: linear-gradient(
    90deg,
    rgba(30, 102, 255, 0.14) 0%,
    rgba(30, 102, 255, 0.14) 35%,
    rgba(30, 102, 255, 0.42) 50%,
    rgba(30, 102, 255, 0.14) 65%,
    rgba(30, 102, 255, 0.14) 100%
  );
  background-size: 200% 100%;
  animation: btn-shimmer 2.5s ease-in-out infinite;
  color: var(--blue-950);
  border: 2px solid var(--blue-600);
  text-shadow: 0 0 12px rgba(255, 255, 255, 0.9), 0 1px 0 rgba(255, 255, 255, 0.5);
}
.hero--home .btn--ghost.btn--shimmer:hover{
  background-size: 200% 100%;
  animation: btn-shimmer 2.5s ease-in-out infinite;
  color: var(--blue-950);
  border-color: var(--blue-700);
}
@media (min-width: 1025px){
  .hero--home .hero__media--home{
    min-height: min(110vh, 980px);
  }
  /* Web: copy vertically centered, aligned to start */
  .hero--home .hero__inner{
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: clamp(24px, 4vw, 48px) max(clamp(16px, 4vw, 72px), env(safe-area-inset-left, 0px)) clamp(24px, 4vw, 48px) max(clamp(16px, 4vw, 72px), env(safe-area-inset-right, 0px));
  }
  /* Web: larger subtitle (desktop lead line) */
  .hero--home .hero__lead.hero__lead--desktop{
    font-size: clamp(18px, 1.15vw + 0.75rem, 24px);
    line-height: 1.55;
    max-width: min(58ch, 100%);
    font-weight: 500;
  }
  /* Web: slide 0 (hero_web_1) — white title + subtitle */
  .hero--home[data-hero-active-slide="0"] h1{
    color: #fff;
    text-shadow: none;
    background: none;
    background-size: auto;
    -webkit-background-clip: unset;
    background-clip: unset;
    -webkit-text-fill-color: #fff;
    animation: none;
  }
  .hero--home[data-hero-active-slide="0"] .hero__content .hero__lead.hero__lead--desktop,
  .hero--home[data-hero-active-slide="0"] .hero__lead.hero__lead--desktop{
    color: rgba(255, 255, 255, 0.95);
    text-shadow: none;
    background: none !important;
    background-size: auto;
    -webkit-background-clip: unset;
    background-clip: unset;
    -webkit-text-fill-color: unset;
    animation: none;
  }
  /* Web: slide 1 (hero_web_2) — blue title + subtitle */
  .hero--home[data-hero-active-slide="1"] h1{
    color: var(--blue-950);
    text-shadow: none;
    background: none;
    background-size: auto;
    -webkit-background-clip: unset;
    background-clip: unset;
    -webkit-text-fill-color: var(--blue-950);
    animation: none;
  }
  .hero--home[data-hero-active-slide="1"] .hero__content .hero__lead.hero__lead--desktop,
  .hero--home[data-hero-active-slide="1"] .hero__lead.hero__lead--desktop{
    color: var(--blue-900);
    text-shadow: none;
    background: none !important;
    background-size: auto;
    -webkit-background-clip: unset;
    background-clip: unset;
    -webkit-text-fill-color: unset;
    animation: none;
  }
  /* Web: blue-bordered shimmer CTA → white text */
  .hero--home .btn--ghost.btn--shimmer,
  .hero--home .btn--ghost.btn--shimmer:hover{
    color: #fff;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
  }
}
@keyframes btn-shimmer{
  0%{ background-position: 200% 0; }
  100%{ background-position: -200% 0; }
}
/* About hero: video wrapper shown only ≤1024px (see mobile rules below) */
.hero--about .hero__media--about{
  display: none;
}
@media (max-width: 1024px){
  /* Products/About: full-height image; Home: video — no panel tint, copy via text-shadow only */
  .hero--products .hero__panel,
  .hero--about .hero__panel{
    display: block;
    position: relative;
    overflow: hidden;
    min-height: min(100dvh, 100vh, 960px);
    background-image: none;
    align-items: stretch;
    justify-content: flex-start;
  }

  .hero--products .hero__panel::before{
    content: '';
    position: absolute;
    inset: 0;
    display: block;
    background-color: #0b1220;
    background-image: url('assets/Product%20Page%20mobile.jpeg');
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    z-index: 0;
  }

  /* About mobile: looping video (same pattern as home) replaces static mobile JPG */
  .hero--about .hero__panel::before{
    display: none;
  }
  .hero--about .hero__media--about{
    display: block;
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: min(100dvh, 100vh, 960px);
    background-color: #0b1220;
    line-height: 0;
    box-sizing: border-box;
  }
  .hero--about .hero__video--about-mobile{
    display: block;
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    min-width: 0;
    object-fit: cover;
    object-position: center top;
    background-color: #0b1220;
  }

  /* Vertical middle, horizontal start — no background on copy block */
  .hero--home .hero__inner,
  .hero--products .hero__inner,
  .hero--about .hero__inner{
    position: absolute;
    inset: 0;
    z-index: 2;
    margin: 0;
    max-width: none;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: max(12px, env(safe-area-inset-top, 0px)) max(clamp(16px, 4vw, 28px), env(safe-area-inset-right, 0px)) max(16px, env(safe-area-inset-bottom, 0px)) max(clamp(16px, 4vw, 28px), env(safe-area-inset-left, 0px));
    background: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
    color: #fff;
  }
  .hero--home .hero__inner{
    z-index: 3;
  }

  .hero--home .hero__content,
  .hero--products .hero__content,
  .hero--about .hero__content{
    width: 100%;
    max-width: min(22rem, 100%);
    margin: 0;
    padding: 0;
    text-align: left;
    background: none;
    border: none;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .hero--home .hero__content h1,
  .hero--home .hero__content p,
  .hero--home .hero__content .hero__actions,
  .hero--products .hero__content h1,
  .hero--products .hero__content p,
  .hero--products .hero__content .hero__actions,
  .hero--about .hero__content h1,
  .hero--about .hero__content p,
  .hero--about .hero__content .hero__actions{
    text-align: left;
  }

  .hero--products .hero__actions,
  .hero--about .hero__actions,
  .hero--home .hero__actions{
    margin-top: 14px;
    gap: 10px;
    justify-content: flex-start;
  }

  .hero.hero--products .hero__inner h1,
  .hero.hero--about .hero__inner h1,
  .hero.hero--home .hero__content h1,
  .hero.hero--home h1{
    margin: 10px 0 6px;
    font-size: clamp(19px, 5vw + 0.15rem, 28px);
    line-height: 1.1;
  }

  /* Home mobile hero: light text on hero imagery (no text shadow / glow) */
  .hero.hero--home .hero__content h1,
  .hero.hero--home h1{
    color: #fff;
    text-shadow: none;
  }

  /* Products / About mobile: brand-toned dark copy + light halo for photo legibility */
  .hero.hero--products .hero__inner h1,
  .hero.hero--about .hero__inner h1{
    color: var(--blue-950);
    text-shadow:
      0 0 1px rgba(255, 255, 255, 0.95),
      0 0 14px rgba(255, 255, 255, 0.88),
      0 1px 3px rgba(255, 255, 255, 0.75);
  }

  .hero.hero--products .hero__inner .hero__content p,
  .hero.hero--products .hero__inner p,
  .hero.hero--about .hero__inner .hero__content p,
  .hero.hero--about .hero__inner p,
  .hero.hero--home .hero__content p,
  .hero.hero--home p{
    font-size: 13px;
    line-height: 1.45;
    max-width: 40ch;
    margin-left: 0;
    margin-right: 0;
  }

  .hero.hero--home .hero__content p,
  .hero.hero--home p{
    color: rgba(255, 255, 255, 0.96);
    text-shadow: none;
  }

  .hero.hero--products .hero__inner .hero__content p,
  .hero.hero--products .hero__inner p,
  .hero.hero--about .hero__inner .hero__content p,
  .hero.hero--about .hero__inner p{
    color: var(--blue-900);
    text-shadow:
      0 0 1px rgba(255, 255, 255, 0.9),
      0 0 12px rgba(255, 255, 255, 0.82),
      0 1px 2px rgba(255, 255, 255, 0.7);
  }

  /* Filled primary: white label on blue (readable on busy photo/video; desktop keeps white pill + dark text) */
  .hero.hero--products .hero__inner .btn--primary,
  .hero.hero--about .hero__inner .btn--primary,
  .hero--home .hero__inner .btn--primary{
    background: linear-gradient(135deg, var(--blue-700), var(--blue-500));
    color: #fff;
    border: 2px solid var(--blue-800);
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  }
  .hero.hero--products .hero__inner .btn--primary:hover,
  .hero.hero--about .hero__inner .btn--primary:hover,
  .hero--home .hero__inner .btn--primary:hover{
    color: #fff;
    border-color: var(--blue-950);
    filter: brightness(1.06);
  }

  .hero.hero--products .hero__inner .btn--ghost,
  .hero.hero--about .hero__inner .btn--ghost,
  .hero--home .hero__inner .btn--ghost{
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    border: 2px solid var(--blue-600);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  }

  .hero.hero--products .hero__inner .btn--ghost:hover,
  .hero.hero--about .hero__inner .btn--ghost:hover,
  .hero--home .hero__inner .btn--ghost:hover{
    background: rgba(255, 255, 255, 0.32);
    color: #fff;
    border-color: var(--blue-700);
  }

  .hero.hero--products .hero__inner .btn--ghost.btn--shimmer,
  .hero.hero--about .hero__inner .btn--ghost.btn--shimmer,
  .hero--home .hero__inner .btn--ghost.btn--shimmer{
    background: linear-gradient(
      90deg,
      rgba(30, 102, 255, 0.16) 0%,
      rgba(30, 102, 255, 0.16) 35%,
      rgba(30, 102, 255, 0.45) 50%,
      rgba(30, 102, 255, 0.16) 65%,
      rgba(30, 102, 255, 0.16) 100%
    );
    background-size: 200% 100%;
    animation: btn-shimmer 2.5s ease-in-out infinite;
    color: var(--blue-950);
    text-shadow: 0 0 12px rgba(255, 255, 255, 0.92), 0 1px 0 rgba(255, 255, 255, 0.55);
    border: 2px solid var(--blue-600);
  }

  .hero.hero--products .hero__inner .btn--ghost.btn--shimmer:hover,
  .hero.hero--about .hero__inner .btn--ghost.btn--shimmer:hover,
  .hero--home .hero__inner .btn--ghost.btn--shimmer:hover{
    color: var(--blue-950);
    text-shadow: 0 0 14px rgba(255, 255, 255, 0.95), 0 1px 0 rgba(255, 255, 255, 0.65);
    border-color: var(--blue-700);
  }

  .hero.hero--products .hero__inner .hero__actions .btn,
  .hero.hero--about .hero__inner .hero__actions .btn,
  .hero--home .hero__actions .btn{
    padding: 6px 10px;
    min-height: 32px;
    font-size: 11px;
    font-weight: 700;
    border-radius: 9px;
    max-width: min(100%, 168px);
  }

  .hero--home .hero__media--home{
    min-height: min(100dvh, 100vh, 960px);
  }

  /* Products hero — mobile only: blue title, subtitle & button text */
  .hero.hero--products .hero__inner h1{
    color: var(--blue-950);
    text-shadow: none;
  }
  .hero.hero--products .hero__inner .hero__content p,
  .hero.hero--products .hero__inner p{
    color: var(--blue-900);
    text-shadow: none;
  }
  .hero.hero--products .hero__inner .btn--primary{
    background: rgba(255, 255, 255, 0.96);
    color: var(--blue-900);
    border: 2px solid var(--blue-700);
    text-shadow: none;
    box-shadow: 0 4px 14px rgba(11, 18, 32, 0.14);
  }
  .hero.hero--products .hero__inner .btn--primary:hover{
    color: var(--blue-950);
    border-color: var(--blue-800);
    filter: none;
  }
  .hero.hero--products .hero__inner .btn--ghost{
    background: rgba(255, 255, 255, 0.9);
    color: var(--blue-900);
    border: 2px solid var(--blue-600);
    text-shadow: none;
  }
  .hero.hero--products .hero__inner .btn--ghost:hover{
    color: var(--blue-950);
    background: #fff;
    border-color: var(--blue-700);
  }
  .hero.hero--products .hero__inner .btn--ghost.btn--shimmer,
  .hero.hero--products .hero__inner .btn--ghost.btn--shimmer:hover{
    color: var(--blue-950);
    text-shadow: none;
  }

  /* About hero — mobile: flat blue title/subtitle, larger lead, Contact blue border */
  .hero.hero--about .hero__inner h1{
    color: var(--blue-950);
    text-shadow: none;
  }
  .hero.hero--about .hero__inner .hero__content p,
  .hero.hero--about .hero__inner p{
    color: var(--blue-900);
    text-shadow: none;
  }
  .hero.hero--about .hero__inner .hero__lead.hero__lead--desktop{
    font-size: clamp(14px, 3.8vw + 0.45rem, 18px);
    line-height: 1.55;
    max-width: min(50ch, 100%);
    font-weight: 500;
  }
  .hero.hero--about .hero__inner .hero__lead.hero__lead--mobile{
    font-size: clamp(14px, 3.8vw + 0.45rem, 17px);
    line-height: 1.55;
    max-width: min(42ch, 100%);
    font-weight: 500;
  }
  .hero.hero--about .hero__inner .btn--ghost{
    border: 2px solid var(--blue-600);
  }
  .hero.hero--about .hero__inner .btn--ghost:hover{
    border-color: var(--blue-700);
  }
}

/* Products / About hero: desktop/web ≥1025px */
@media (min-width: 1025px){
.hero--products .hero__panel{
  min-height: 92vh;
  display: block;
  position: relative;
  overflow: hidden;
  background-color: #0b1220;
  background-image: url('assets/products_page.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: #fff;
  border: none;
  box-shadow: none;
}
.hero--products .hero__inner{
  position: absolute;
  inset: 0;
  z-index: 1;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: clamp(24px, 4vw, 48px) max(clamp(16px, 4vw, 72px), env(safe-area-inset-left, 0px)) clamp(24px, 4vw, 48px) max(clamp(16px, 4vw, 72px), env(safe-area-inset-right, 0px));
}
.hero--products .hero__content{
  text-align: left;
  width: 100%;
  max-width: 40rem;
}
.hero--products .hero__content h1,
.hero--products .hero__content p,
.hero--products .hero__content .hero__actions{
  text-align: left;
}
.hero--products .hero__actions{
  justify-content: flex-start;
}
.hero--products h1{
  color: var(--blue-950);
  text-shadow: none;
}
/* Web: larger desktop subtitle */
.hero--products .hero__lead.hero__lead--desktop,
.hero.hero--products .hero__content .hero__lead--desktop{
  font-size: clamp(18px, 1.15vw + 0.75rem, 24px);
  line-height: 1.55;
  max-width: min(58ch, 100%);
  font-weight: 500;
  color: var(--blue-900);
  text-shadow: none;
}
.hero.hero--products .hero__content p,
.hero.hero--products p{
  color: var(--blue-900);
  text-shadow: none;
}
.hero--products .btn--primary{
  box-shadow: 0 4px 16px rgba(0,0,0,.25);
}
.hero--products .btn--ghost{
  background: rgba(255,255,255,.15);
  color: #fff;
  border: 2px solid var(--blue-500);
}
.hero--products .btn--ghost:hover{
  background: rgba(255,255,255,.25);
  color: #fff;
  border-color: var(--blue-600);
}
.hero--products .btn--ghost.btn--shimmer{
  background: linear-gradient(
    90deg,
    rgba(255,255,255,.82) 0%,
    rgba(255,255,255,.82) 35%,
    rgba(255,255,255,.98) 50%,
    rgba(255,255,255,.82) 65%,
    rgba(255,255,255,.82) 100%
  );
  background-size: 200% 100%;
  animation: btn-shimmer 2.5s ease-in-out infinite;
  color: var(--blue-950);
  border: 2px solid var(--blue-600);
  text-shadow: none;
}
.hero--products .btn--ghost.btn--shimmer:hover{
  background-size: 200% 100%;
  animation: btn-shimmer 2.5s ease-in-out infinite;
  color: var(--blue-950);
  border-color: var(--blue-700);
}

/* About page hero: full-bleed background image; mobile video in hero__media ≤1024px */
.hero--about .hero__panel{
  min-height: 110vh;
  display: flex;
  align-items: center;
  background-color: #0b1220;
  background-image: url('assets/About%20us.jpg');
  background-size: 100% auto;
  background-position: center center;
  background-repeat: no-repeat;
  color: #fff;
  border: none;
  box-shadow: none;
  position: relative;
  overflow: hidden;
}
.hero--about .hero__panel::before{
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(11,18,32,.55) 0%, rgba(11,18,32,.28) 50%, transparent 100%);
  pointer-events: none;
  z-index: 0;
}
.hero--about .hero__inner{
  position: relative;
  z-index: 1;
  grid-template-columns: 1fr;
  max-width: 640px;
  padding: 48px clamp(16px, 4vw, 72px) 56px;
  align-items: flex-start;
  justify-items: start;
  margin-left: 0;
  margin-right: auto;
}
.hero--about .hero__content{
  text-align: left;
  width: 100%;
}
.hero--about .hero__content h1,
.hero--about .hero__content p,
.hero--about .hero__content .hero__actions{
  text-align: left;
}
.hero--about .hero__actions{
  justify-content: flex-start;
}
.hero--about h1{
  color: var(--blue-950);
  text-shadow: none;
}
.hero--about .hero__lead.hero__lead--desktop,
.hero.hero--about .hero__content .hero__lead--desktop{
  font-size: clamp(18px, 1.15vw + 0.75rem, 24px);
  line-height: 1.55;
  max-width: min(58ch, 100%);
  font-weight: 500;
  color: var(--blue-900);
  text-shadow: none;
}
.hero.hero--about .hero__content p,
.hero.hero--about p{
  color: var(--blue-900);
  text-shadow: none;
}
.hero--about .btn--primary{
  box-shadow: 0 4px 16px rgba(0,0,0,.25);
}
.hero--about .btn--ghost{
  background: rgba(255,255,255,.15);
  color: #fff;
  border: 2px solid var(--blue-600);
}
.hero--about .btn--ghost:hover{
  background: rgba(255,255,255,.25);
  border-color: var(--blue-700);
}
}

.hero__panel{
  /* Full-bleed hero on desktop (spans entire viewport width) */
  min-height: 92vh;
  display: flex;
  align-items: center;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  border-radius: 0;
  background:
    linear-gradient(135deg, rgba(11,42,111,.92), rgba(30,102,255,.92)),
    radial-gradient(700px 360px at 70% 10%, rgba(255,255,255,.22), transparent 60%);
  color:#fff;
  overflow:hidden;
  box-shadow:var(--shadow);
  border:1px solid rgba(255,255,255,.18);
  border-left: 0;
  border-right: 0;
}
.hero__inner{
  display:grid;
  grid-template-columns: 1.2fr .9fr;
  gap:28px;
  padding:44px clamp(16px, 4vw, 72px);
  align-items:center;
  max-width: var(--container);
  margin: 0 auto;
}
.hero__kicker{
  display:inline-flex; gap:8px; align-items:center;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  padding:8px 12px;
  font-weight:700;
  font-size:12px;
  letter-spacing:.2px;
}
.hero h1{
  margin:14px 0 10px;
  font-size: clamp(22px, 5vw + 0.25rem, 44px);
  line-height:1.08;
  letter-spacing:-.3px;
  overflow-wrap:anywhere;
}
.hero p{
  margin:0;
  color:rgba(255,255,255,.9);
  font-size:14px;
  line-height:1.45;
  max-width:42ch;
}
.hero__actions{
  margin-top:14px;
  display:flex; flex-wrap:wrap; gap:8px;
}
.hero .hero__actions .btn{
  padding:7px 12px;
  border-radius:10px;
  font-size:12px;
  font-weight:700;
  min-height:34px;
  width:auto;
  max-width:min(100%, 200px);
  box-sizing:border-box;
}
.hero__media{
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero__media picture,
.hero__media > img{
  width:min(760px, 100%);
  height:auto;
  display:block;
}
.hero__media picture img{
  width:100%;
  height:auto;
  display:block;
}
.hero__media > img{
  border-radius:20px;
  border:1px solid rgba(255,255,255,.18);
  box-shadow: 0 18px 50px rgba(2,6,23,.35);
  background:transparent;
}
/* Inline hero (e.g. refer): two-image fade slider */
.hero:not(.hero--home) .hero__media .hero-slider{
  position:relative;
  width:min(760px, 100%);
  max-width:100%;
}
.hero:not(.hero--home) .hero__media .hero-slider__track{
  position:relative;
  width:100%;
  aspect-ratio:4/3;
  border-radius:20px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.18);
  box-shadow: 0 18px 50px rgba(2,6,23,.35);
  background:#0b1220;
}
.hero:not(.hero--home) .hero__media .hero-slider__slide{
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity 0.85s ease;
  pointer-events:none;
}
.hero:not(.hero--home) .hero__media .hero-slider__slide.is-active{
  opacity:1;
  z-index:0;
}
.hero:not(.hero--home) .hero__media .hero-slider__slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  border-radius:0;
  border:none;
  box-shadow:none;
  display:block;
}
.hero:not(.hero--home) .hero__media .hero-slider__dots{
  position:absolute;
  bottom:12px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:8px;
  z-index:2;
}
.hero:not(.hero--home) .hero__media .hero-slider__dot{
  width:9px;
  height:9px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.88);
  background:rgba(11,18,32,.4);
  padding:0;
  cursor:pointer;
  box-sizing:border-box;
}
.hero:not(.hero--home) .hero__media .hero-slider__dot.is-active{
  background:#fff;
  transform:scale(1.1);
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.20);
  text-decoration:none;
  font-weight:800;
  letter-spacing:.2px;
  cursor:pointer;
}
.btn--primary{
  background:#fff;
  color:var(--blue-900);
  border-color:rgba(255,255,255,.6);
}
.btn--primary:hover{transform:translateY(-1px)}
.btn--ghost{
  background:rgba(255,255,255,.10);
  color:#fff;
}
.btn--ghost:hover{background:rgba(255,255,255,.16)}
.btn--blue{
  background:linear-gradient(135deg, var(--blue-700), var(--blue-500));
  color:#fff;
  border-color:rgba(30,102,255,.35);
}
.btn--blue:hover{transform:translateY(-1px)}

.section{
  padding:32px 0;
}
.section__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.section__head h2{
  margin:0;
  font-size: clamp(20px, 2.4vw, 28px);
  letter-spacing:-.2px;
}
.section__head p{
  margin:0;
  color:var(--muted);
  max-width:64ch;
}
@media (max-width: 720px){
  .section__head{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }
}

.grid{
  display:grid;
  gap:14px;
}
.grid--3{grid-template-columns:repeat(3, minmax(0, 1fr))}
.grid--2{grid-template-columns:repeat(2, minmax(0, 1fr))}

.card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow: 0 16px 44px rgba(2, 6, 23, .07);
  padding:16px;
}

/* About Us page — same visual language as home (Why / Concept sections) */
.section--about{
  margin-top: clamp(16px, 3vw, 28px);
  padding: clamp(32px, 5vw, 48px) 0 clamp(40px, 5vw, 52px);
  background:
    radial-gradient(ellipse 100% 70% at 50% 0%, rgba(30,102,255,.18), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.78) 0%, rgba(232,241,255,.52) 100%);
  border-radius: calc(var(--radius) + 10px);
  border: 1px solid rgba(30,102,255,.2);
  box-shadow: 0 24px 64px rgba(30,102,255,.1), inset 0 1px 0 rgba(255,255,255,.85);
}
.section--about > .container{
  max-width: min(1400px, 100%);
  margin-left: auto;
  margin-right: auto;
}
.section__head--about{
  margin-bottom: clamp(20px, 3vw, 28px);
  padding-left: 20px;
  border-left: 4px solid var(--blue-600);
}
.section__head--about .about-lead-pill{
  margin-bottom: 12px;
}
.section__head--about h2{
  margin: 0 0 8px;
  font-size: clamp(22px, 2.8vw, 32px);
  letter-spacing: -.3px;
  color: var(--blue-950);
}
.section__head--about .about-lead-text{
  margin: 0;
  max-width: min(88ch, 100%);
  font-size: clamp(14px, 1.2vw, 17px);
  line-height: 1.65;
  color: rgba(11,18,32,.82);
}
.section__head--about--sub{
  margin-top: clamp(28px, 4vw, 40px);
  margin-bottom: 18px;
}
.section__head--about--sub h2{
  font-size: clamp(20px, 2.4vw, 26px);
}
.section__head--about--sub p{
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 15px;
  max-width: min(72ch, 100%);
}
.about-quote{
  margin: 0 0 clamp(22px, 3vw, 32px);
  padding: clamp(20px, 3vw, 28px) clamp(20px, 3vw, 32px);
  background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(232,241,255,.72));
  border: 1px solid rgba(30,102,255,.22);
  border-radius: calc(var(--radius) + 6px);
  box-shadow: 0 16px 44px rgba(30,102,255,.1), inset 0 1px 0 rgba(255,255,255,.9);
  position: relative;
  overflow: hidden;
}
.about-quote::before{
  content: '';
  position: absolute;
  left: 0;
  top: 14px;
  bottom: 14px;
  width: 5px;
  border-radius: 0 4px 4px 0;
  background: linear-gradient(180deg, var(--blue-500), var(--blue-700));
}
.about-quote__text{
  margin: 0;
  padding-left: 18px;
  font-size: clamp(16px, 1.35vw, 19px);
  line-height: 1.65;
  color: var(--blue-900);
  font-weight: 650;
}
.about-split{
  gap: clamp(16px, 2.5vw, 22px);
  margin-bottom: clamp(8px, 2vw, 12px);
}
.about-split .card--why{
  min-height: 0;
}
.about-pillars{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 18px);
  margin-bottom: clamp(20px, 3vw, 28px);
}
.card--about-pillar{
  padding: clamp(16px, 2.2vw, 22px);
  background: linear-gradient(160deg, rgba(255,255,255,.96), rgba(240,247,255,.72));
  border: 1px solid rgba(30,102,255,.2);
  border-radius: var(--radius);
  box-shadow: 0 12px 36px rgba(30,102,255,.1);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  overflow-wrap: break-word;
}
.card--about-pillar:hover{
  transform: translateY(-3px);
  box-shadow: 0 20px 48px rgba(30,102,255,.14);
  border-color: rgba(30,102,255,.32);
}
.card--about-pillar .pill{
  margin-bottom: 8px;
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  background: linear-gradient(135deg, rgba(30,102,255,.14), rgba(17,75,185,.08));
  border-color: rgba(30,102,255,.28);
}
.card--about-pillar h4{
  margin: 0 0 6px;
  font-size: clamp(15px, 1.2vw, 17px);
  color: var(--blue-900);
  line-height: 1.3;
}
.card--about-pillar p{
  margin: 0;
  font-size: 13px;
  line-height: 1.58;
  color: rgba(11,18,32,.76);
}
.about-outcomes{
  margin: 0 0 clamp(22px, 3vw, 30px);
  padding: clamp(18px, 2.5vw, 24px) clamp(18px, 2.5vw, 26px);
  border-radius: calc(var(--radius) + 6px);
  background: linear-gradient(135deg, rgba(30,102,255,.1), rgba(17,75,185,.06));
  border: 1px solid rgba(30,102,255,.22);
  box-shadow: 0 8px 28px rgba(30,102,255,.08);
}
.about-outcomes__title{
  margin: 0 0 14px;
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--blue-800);
  font-weight: 800;
}
.about-outcomes__list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.about-outcomes__list li{
  padding: 10px 18px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(30,102,255,.22);
  font-size: 14px;
  font-weight: 700;
  color: var(--blue-900);
  box-shadow: 0 2px 10px rgba(30,102,255,.08);
}
.about-closing{
  text-align: center;
  padding: clamp(22px, 3vw, 32px) clamp(18px, 3vw, 28px);
  margin-bottom: clamp(16px, 2.5vw, 22px);
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(228,238,255,.62));
  border: 1px solid rgba(30,102,255,.2);
  border-radius: calc(var(--radius) + 6px);
  box-shadow: 0 18px 48px rgba(30,102,255,.11);
  overflow-wrap: break-word;
}
.about-closing__lead{
  margin: 0 auto 16px;
  max-width: min(76ch, 100%);
  text-align: center;
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.65;
  color: rgba(11,18,32,.85);
}
.about-tagline{
  font-size: clamp(1.1rem, 2vw, 1.4rem);
  margin: 8px 0 12px !important;
  line-height: 1.4;
  color: var(--blue-950);
}
.about-promise{
  margin: 0 0 16px !important;
  font-size: 15px;
  color: var(--muted);
}
.about-team{
  margin: 0 !important;
  font-size: 15px;
  line-height: 1.6;
  color: rgba(11,18,32,.88);
}
.about-team a{
  color: var(--blue-700);
  font-weight: 700;
}
.section--about .cta-bar--why{
  margin-top: 0;
}

/* About — at-a-glance stats, featured visual, journey, fact cards */
.about-stats{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(12px, 2vw, 20px);
  margin: 0 0 clamp(24px, 3.5vw, 40px);
}
.about-stat{
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: clamp(16px, 2vw, 24px);
  background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(232,241,255,.58));
  border: 1px solid rgba(30,102,255,.2);
  border-left: 4px solid rgba(30,102,255,.42);
  border-radius: calc(var(--radius) + 4px);
  box-shadow: 0 12px 32px rgba(30,102,255,.1);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.about-stat:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(30,102,255,.14);
  border-color: rgba(30,102,255,.3);
}
.about-stat__title{
  display: block;
  font-size: clamp(14px, 1.1vw, 16px);
  color: var(--blue-950);
  margin-bottom: 4px;
}
.about-stat__meta{
  display: block;
  font-size: 12px;
  line-height: 1.5;
  color: var(--muted);
}
.about-featured{
  margin: clamp(26px, 4vw, 42px) 0;
  gap: clamp(18px, 2.8vw, 28px);
  align-items: stretch;
}
.about-featured__media{
  padding: 0;
  overflow: hidden;
  border-radius: calc(var(--radius) + 10px);
  border: 1px solid rgba(30,102,255,.24);
  box-shadow: 0 20px 52px rgba(30,102,255,.14);
  min-height: 0;
}
.about-featured__media img{
  display: block;
  width: 100%;
  height: 100%;
  min-height: min(320px, 42vw);
  object-fit: cover;
  object-position: center;
}
.about-featured__copy{
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.about-featured__copy h3{
  margin: 0 0 14px;
  font-size: clamp(18px, 2vw, 24px);
  color: var(--blue-900);
  line-height: 1.3;
}
.about-bullets{
  margin: 0 0 16px;
  padding-inline-start: 1.25em;
  line-height: 1.72;
  color: rgba(11,18,32,.86);
  font-size: clamp(14px, 1.08vw, 16px);
}
.about-bullets li{ margin-bottom: 10px; }
.about-bullets li:last-child{ margin-bottom: 0; }
.about-featured__copy .btn{
  align-self: flex-start;
  margin-top: auto;
}
.about-founder.about-featured{
  margin-top: clamp(34px, 5vw, 52px);
}
.about-founder .about-featured__media img{
  object-position: center 18%;
  aspect-ratio: 4 / 5;
  min-height: min(280px, 48vw);
}
.about-founder .about-featured__copy > p{
  margin: 0 0 14px;
  line-height: 1.72;
  color: rgba(11,18,32,.86);
  font-size: clamp(14px, 1.08vw, 16px);
}
.about-founder .about-featured__copy > p:last-child{
  margin-bottom: 0;
}
.about-founder .about-featured__copy .about-bullets{
  margin-bottom: 18px;
}
.about-journey{
  margin: clamp(26px, 4vw, 40px) 0;
  padding: clamp(24px, 3.5vw, 36px) clamp(22px, 3vw, 36px);
  background:
    radial-gradient(ellipse 80% 60% at 100% 0%, rgba(30,102,255,.12), transparent 55%),
    linear-gradient(165deg, rgba(255,255,255,.97), rgba(225,236,255,.52));
  border: 1px solid rgba(30,102,255,.22);
  border-radius: calc(var(--radius) + 10px);
  box-shadow: 0 22px 56px rgba(30,102,255,.11);
}
.about-journey__kicker{ margin: 0 0 10px; }
.about-journey__title{
  margin: 0 0 8px;
  font-size: clamp(20px, 2.3vw, 28px);
  color: var(--blue-950);
  line-height: 1.25;
  letter-spacing: -.02em;
}
.about-journey__sub{
  margin: 0 0 clamp(20px, 3vw, 28px);
  color: var(--muted);
  font-size: clamp(14px, 1.1vw, 16px);
  line-height: 1.6;
  max-width: min(78ch, 100%);
}
.about-steps{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2.2vw, 24px);
}
.about-step{
  padding: 20px 18px 22px;
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(30,102,255,.2);
  border-radius: calc(var(--radius) + 4px);
  box-shadow: 0 10px 28px rgba(30,102,255,.1);
  text-align: center;
  transition: transform .2s ease, box-shadow .2s ease;
}
.about-step:hover{
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(30,102,255,.14);
}
.about-step__num{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: 0 auto 14px;
  border-radius: 50%;
  font-size: 17px;
  font-weight: 800;
  color: #fff;
  background: linear-gradient(135deg, var(--blue-500), var(--blue-800));
  box-shadow: 0 6px 16px rgba(30,102,255,.35);
}
.about-step h4{
  margin: 0 0 10px;
  font-size: 16px;
  color: var(--blue-900);
}
.about-step p{
  margin: 0;
  font-size: 13px;
  line-height: 1.58;
  color: rgba(11,18,32,.78);
}
.about-facts{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2.2vw, 22px);
  margin: clamp(26px, 4vw, 38px) 0 clamp(22px, 3.5vw, 30px);
}
.about-fact-card{
  padding: 22px 20px 24px;
  background: linear-gradient(160deg, rgba(255,255,255,.98), rgba(236,244,255,.68));
  border: 1px solid rgba(30,102,255,.2);
  border-radius: calc(var(--radius) + 4px);
  box-shadow: 0 14px 36px rgba(30,102,255,.1);
  transition: transform .2s ease, box-shadow .2s ease;
}
.about-fact-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 20px 48px rgba(30,102,255,.14);
}
.about-fact-card h4{
  margin: 0 0 10px;
  font-size: 17px;
  color: var(--blue-900);
}
.about-fact-card p{
  margin: 0;
  font-size: 14px;
  line-height: 1.62;
  color: rgba(11,18,32,.82);
}

@media (max-width: 1024px){
  .about-stats{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .about-steps{
    grid-template-columns: 1fr;
  }
  .about-facts{
    grid-template-columns: 1fr;
  }
}
@media (max-width: 900px){
  .about-pillars{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .about-featured.grid--2{
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px){
  .section--about{
    margin-top: 12px;
    padding: 28px 0 36px;
    border-radius: calc(var(--radius) + 6px);
  }
  .section__head--about{
    padding-left: 16px;
    margin-bottom: 18px;
  }
  .about-quote{ padding: 18px 16px; }
  .about-quote__text{ padding-left: 14px; font-size: 15px; }
  .about-stats{
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .about-stat{ padding: 14px 16px; }
  .about-featured__media img{ min-height: 220px; }
  .about-founder .about-featured__media img{
    min-height: min(260px, 58vw);
    aspect-ratio: 3 / 4;
  }
  .about-journey{ padding: 20px 16px 22px; }
  .about-step{ text-align: left; display: grid; grid-template-columns: auto 1fr; gap: 12px 16px; align-items: start; }
  .about-step__num{ margin: 0; grid-row: span 2; align-self: start; }
  .about-step h4{ margin: 0 0 4px; }
  .about-pillars{
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .about-outcomes__list{ flex-direction: column; }
  .about-outcomes__list li{ width: 100%; text-align: center; box-sizing: border-box; }
}
@media (max-width: 520px){
  .section--about{ padding: 22px 0 30px; }
  .section__head--about h2{ font-size: 1.35rem; }
  .about-outcomes{ padding: 16px 14px; }
}

/* Why Radhanagari Dudh — distinctive section styling */
.section--why{
  background:
    radial-gradient(ellipse 100% 70% at 50% 0%, rgba(30,102,255,.18), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.75) 0%, rgba(232,241,255,.5) 100%);
  border-radius: calc(var(--radius) + 10px);
  border: 1px solid rgba(30,102,255,.2);
  box-shadow: 0 24px 64px rgba(30,102,255,.1), inset 0 1px 0 rgba(255,255,255,.85);
  padding: 40px 0 44px;
  margin-top: 24px;
}
.section__head--why{
  margin-bottom: 24px;
  padding-left: 20px;
  border-left: 4px solid var(--blue-600);
}
.section__head--why h2{
  font-size: clamp(22px, 2.8vw, 30px);
  letter-spacing: -.3px;
  color: var(--blue-950);
}
.section__head--why p{
  margin-top: 8px;
  font-size: 15px;
  line-height: 1.6;
}
.question-highlight{
  display: inline-block;
  white-space: nowrap;
  animation: question-color 12s ease-in-out infinite;
}
@keyframes question-color{
  0%, 100%{ color: var(--blue-900); }
  25%{ color: #1e66ff; }
  50%{ color: #0d9488; }
  75%{ color: #b91c1c; }
}
.why-cards{ gap: 20px; }
.card--why{
  position: relative;
  padding: 22px 22px 22px 28px;
  background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(232,241,255,.6));
  border: 1px solid rgba(30,102,255,.22);
  box-shadow: 0 20px 48px rgba(30,102,255,.12), 0 0 0 1px rgba(255,255,255,.6) inset;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.card--why::before{
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 5px;
  background: linear-gradient(180deg, var(--blue-500), var(--blue-700));
  border-radius: 4px 0 0 4px;
}
.card--why-2::before{
  background: linear-gradient(180deg, var(--blue-600), var(--blue-800));
}
.card--why:hover{
  transform: translateY(-4px);
  box-shadow: 0 28px 56px rgba(30,102,255,.18), 0 0 0 1px rgba(255,255,255,.8) inset;
  border-color: rgba(30,102,255,.35);
}
.card--why .pill{
  margin-bottom: 10px;
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
  background: linear-gradient(135deg, rgba(30,102,255,.14), rgba(17,75,185,.08));
  border-color: rgba(30,102,255,.3);
}
.card--why h3{
  font-size: 18px;
  color: var(--blue-900);
  margin-bottom: 10px;
}
.card--why p{
  font-size: 14px;
  line-height: 1.65;
  color: rgba(11,18,32,.75);
}
.cta-bar--why{
  margin-top: 24px;
  padding: 20px 24px;
  background: linear-gradient(135deg, rgba(30,102,255,.14), rgba(17,75,185,.08));
  border: 1px solid rgba(30,102,255,.25);
  box-shadow: 0 8px 24px rgba(30,102,255,.08);
}

/* Kolhapur delivery map — homepage */
.section--service-map{
  position: relative;
  padding: clamp(32px, 5vw, 52px) 0 clamp(40px, 6vw, 56px);
  background:
    radial-gradient(ellipse 90% 60% at 15% 20%, rgba(30,102,255,.16), transparent 55%),
    radial-gradient(ellipse 70% 50% at 95% 80%, rgba(13,148,136,.1), transparent 50%),
    linear-gradient(180deg, rgba(240,247,255,.98) 0%, rgba(255,255,255,.94) 45%, rgba(225,236,255,.55) 100%);
  border-block: 1px solid rgba(30,102,255,.14);
  overflow: hidden;
}
.section--service-map::before{
  content: '';
  position: absolute;
  inset: -40% -20% auto auto;
  width: min(520px, 90vw);
  height: min(520px, 90vw);
  background: radial-gradient(circle, rgba(30,102,255,.12) 0%, transparent 68%);
  pointer-events: none;
}
.service-map__intro{
  position: relative;
  z-index: 1;
  margin-bottom: clamp(22px, 3.2vw, 32px);
  width: 100%;
  max-width: 100%;
}
.service-map__header{
  width: 100%;
  max-width: 100%;
  padding-bottom: clamp(16px, 2.5vw, 22px);
  border-bottom: 1px solid rgba(30,102,255,.18);
  background: linear-gradient(180deg, rgba(255,255,255,.45) 0%, transparent 100%);
  border-radius: 0 0 var(--radius-sm) var(--radius-sm);
  margin: 0 0 2px;
  padding-left: clamp(4px, 1vw, 8px);
  border-left: 4px solid var(--blue-600);
  padding-top: 4px;
}
.service-map__eyebrow{
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--blue-700);
}
.service-map__header h2{
  margin: 0;
  font-size: clamp(1.45rem, 3.2vw, 2rem);
  letter-spacing: -.035em;
  line-height: 1.18;
  color: var(--blue-950);
  max-width: 100%;
}
.service-map__lead{
  margin: clamp(10px, 1.8vw, 14px) 0 0;
  font-size: clamp(14px, 1.2vw, 17px);
  line-height: 1.68;
  color: rgba(11,18,32,.84);
  max-width: 100%;
}
@media (min-width: 900px){
  .service-map__lead{
    max-width: min(88ch, 100%);
  }
}
.btn--call{
  background: linear-gradient(135deg, #0d9488, #14b8a6);
  color: #fff;
  border-color: rgba(13,148,136,.45);
  box-shadow: 0 8px 22px rgba(13,148,136,.22);
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 4px;
  padding: 12px 16px;
  min-height: 48px;
}
.btn--call:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 26px rgba(13,148,136,.28);
}
.btn--call .btn__call-sub{
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  line-height: 1.25;
  opacity: .95;
}
.btn--call .btn__call-num{
  font-size: clamp(15px, 2.8vw, 17px);
  font-weight: 800;
  letter-spacing: .08em;
  font-variant-numeric: tabular-nums;
}
.service-map__actions .btn--ghost{
  background: rgba(255,255,255,.92);
  color: var(--blue-900);
  border: 1px solid rgba(30,102,255,.22);
  box-shadow: 0 4px 14px rgba(30,102,255,.06);
}
.service-map__actions .btn--ghost:hover{
  background: #fff;
  border-color: rgba(30,102,255,.35);
  transform: translateY(-1px);
}
.service-map__actions{
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: stretch;
}
.service-map__actions-row{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: stretch;
}
.service-map__actions-row .btn--blue,
.service-map__actions-row .btn--call{
  flex: 1 1 calc(50% - 5px);
  min-width: min(100%, 148px);
}
@media (max-width: 360px){
  .service-map__actions-row .btn--blue,
  .service-map__actions-row .btn--call{
    flex: 1 1 100%;
  }
}
.service-map__layout{
  position: relative;
  z-index: 1;
  display: grid;
  gap: clamp(22px, 3.5vw, 36px);
  align-items: stretch;
}
.service-map__panel--map{
  min-width: 0;
}
.service-map__map-shell{
  position: relative;
  border-radius: calc(var(--radius) + 14px);
  overflow: hidden;
  border: 1px solid rgba(30,102,255,.28);
  box-shadow:
    0 20px 50px rgba(30,102,255,.18),
    0 0 0 1px rgba(255,255,255,.6) inset;
  background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(225,236,255,.5));
}
.service-map__map-frame{
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 3px rgba(30,102,255,.12);
  pointer-events: none;
  z-index: 2;
}
.service-map__map{
  position: relative;
  z-index: 1;
  width: 100%;
  height: clamp(260px, 42vw, 440px);
  min-height: 260px;
  background: linear-gradient(160deg, rgba(225,236,255,.9), rgba(200,220,255,.5));
  font-family: inherit;
}
.service-map__map .leaflet-container{
  font-family: inherit;
  background: #dfe8f5;
}
.service-map__map .leaflet-control-attribution{
  font-size: 10px;
  max-width: 65%;
  line-height: 1.35;
  background: rgba(255,255,255,.88) !important;
}
.service-map__corner-badge{
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 500;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px 8px 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--blue-950);
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(30,102,255,.25);
  border-radius: 999px;
  box-shadow: 0 8px 22px rgba(30,102,255,.15);
  pointer-events: none;
}
.service-map__dot{
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--blue-500);
  box-shadow: 0 0 0 3px rgba(30,102,255,.25);
  animation: service-map-pulse 2.2s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce){
  .service-map__dot{ animation: none; }
}
@keyframes service-map-pulse{
  0%, 100%{ transform: scale(1); opacity: 1; }
  50%{ transform: scale(1.15); opacity: .75; }
}
.service-map__disclaimer{
  margin: 12px 0 0;
  font-size: 12px;
  line-height: 1.55;
  color: var(--muted);
  max-width: 56ch;
}
.service-map__ext-link{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--blue-700);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color .2s ease, border-color .2s ease;
}
.service-map__ext-link:hover{
  color: var(--blue-900);
  border-bottom-color: rgba(30,102,255,.35);
}
.service-map__chips-caption{
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(11,18,32,.55);
}
.service-map__chips{
  list-style: none;
  margin: 0 0 18px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.service-map__chip{
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  color: var(--blue-950);
  background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(232,241,255,.85));
  border: 1px solid rgba(30,102,255,.22);
  border-radius: 999px;
  box-shadow: 0 4px 14px rgba(30,102,255,.08);
}
.service-map__chip::before{
  content: '';
  width: 6px;
  height: 6px;
  margin-right: 8px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--blue-500), var(--blue-800));
  flex-shrink: 0;
}
.service-map__detail{
  margin-bottom: 16px;
}
.service-map__detail p{
  margin: 0;
  line-height: 1.72;
  font-size: clamp(14px, 1.08vw, 15px);
  color: rgba(11,18,32,.84);
}
@media (min-width: 900px){
  .service-map__layout{
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.85fr);
    align-items: start;
  }
  .service-map__map{
    height: clamp(320px, 36vw, 460px);
  }
}
@media (max-width: 520px){
  .service-map__map{
    height: min(300px, 58vw);
    min-height: 240px;
  }
  .service-map__corner-badge{
    font-size: 10px;
    padding: 6px 10px 6px 8px;
  }
}

/* Our Unique Concept — box fit (same container padding as other sections), same section height as refer form */
.section--concept{
  padding-bottom: 40px;
}
.section__head--concept{
  margin-bottom: 12px;
  padding-bottom: 0;
  border-bottom: none;
}
.section__head--concept h2{
  font-size: clamp(18px, 2.2vw, 24px);
  letter-spacing: -.3px;
  color: var(--blue-950);
}
.section__head--concept p{
  margin-top: 2px;
  font-size: 13px;
  line-height: 1.4;
  color: rgba(11,18,32,.78);
}
/* Panel: full container width, same height feel as refer form section */
.concept-layout{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: stretch;
  min-height: 0;
  max-height: 640px;
  border-radius: calc(var(--radius) + 12px);
  overflow: hidden;
  border: 1px solid rgba(30,102,255,.22);
  background:
    radial-gradient(ellipse 120% 80% at 0% 0%, rgba(30,102,255,.2), transparent 50%),
    radial-gradient(ellipse 100% 70% at 100% 100%, rgba(17,75,185,.12), transparent 50%),
    linear-gradient(165deg, rgba(255,255,255,.9) 0%, rgba(232,241,255,.6) 50%, rgba(207,230,255,.4) 100%);
  box-shadow: 0 24px 64px rgba(30,102,255,.14), inset 0 1px 0 rgba(255,255,255,.9);
}
.concept-image{
  position: relative;
  overflow: hidden;
  min-width: 0;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 12px 16px 20px;
  background: rgba(255,255,255,.6);
}
.concept-image img{
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: contain;
  object-position: center center;
  border-radius: var(--radius);
  border: 1px solid rgba(30,102,255,.18);
  box-shadow: 0 8px 24px rgba(30,102,255,.08);
  transition: transform .35s ease;
}
.concept-image::before{
  display: none;
}
.concept-image::after{
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 35%, rgba(11,18,32,.05) 100%);
  pointer-events: none;
}
.concept-image:hover img{
  transform: scale(1.02);
}
.concept-cards-wrap{
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 16px 20px 20px 16px;
  max-width: 100%;
  min-width: 0;
  min-height: 0;
  overflow-y: auto;
  background: linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.88) 100%);
  border-left: 1px solid rgba(30,102,255,.2);
  justify-content: center;
  border-radius: 0 calc(var(--radius) + 4px) calc(var(--radius) + 4px) 0;
}
.section--concept .concept-cards{
  grid-template-columns: 1fr;
  gap: 4px;
  max-width: 100%;
}
.concept-cards{ gap: 4px; }
.concept-cards + .concept-cards{ margin-top: 0; }
.card--concept{
  position: relative;
  padding: 6px 8px 6px 10px;
  padding-right: 24px;
  max-width: 100%;
  flex-shrink: 0;
  background: linear-gradient(165deg, rgba(255,255,255,.98), rgba(240,248,255,.6));
  border: 1px solid rgba(30,102,255,.18);
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(30,102,255,.06);
  overflow: visible;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  text-align: left;
}
.card--concept:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(30,102,255,.1);
  border-color: rgba(30,102,255,.28);
}
.card--concept .card__num{
  position: absolute;
  top: 6px; right: 6px;
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .05em;
  color: #fff;
  background: linear-gradient(135deg, var(--blue-500), var(--blue-700));
  border-radius: 50%;
  line-height: 1;
  box-shadow: 0 2px 6px rgba(30,102,255,.3);
}
.card--concept .pill{
  margin-bottom: 2px;
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
  background: linear-gradient(135deg, rgba(30,102,255,.12), rgba(17,75,185,.08));
  border: 1px solid rgba(30,102,255,.22);
  border-radius: 4px;
  padding: 2px 5px;
  display: inline-block;
}
.card--concept h3{
  font-size: 12px;
  color: var(--blue-900);
  margin-bottom: 2px;
  line-height: 1.25;
}
.card--concept p{
  font-size: 11px;
  line-height: 1.35;
  color: rgba(11,18,32,.78);
  margin: 0;
}

/* Book your delivery slot — distinctive section styling */
.section--slot{ padding-bottom: 40px; }
.section__head--slot{
  margin-bottom: 24px;
}
.section__head--slot h2{
  font-size: clamp(22px, 2.8vw, 30px);
  letter-spacing: -.3px;
  color: var(--blue-950);
}
.section--slot .slot-panel{
  border-radius: calc(var(--radius) + 12px);
  border: 1px solid rgba(30,102,255,.22);
  background:
    radial-gradient(ellipse 120% 80% at 0% 0%, rgba(30,102,255,.2), transparent 50%),
    radial-gradient(ellipse 100% 70% at 100% 100%, rgba(17,75,185,.12), transparent 50%),
    linear-gradient(165deg, rgba(255,255,255,.9) 0%, rgba(232,241,255,.6) 50%, rgba(207,230,255,.4) 100%);
  box-shadow: 0 24px 64px rgba(30,102,255,.14), inset 0 1px 0 rgba(255,255,255,.9);
  overflow: hidden;
  width:100%;
  max-width:100%;
  min-width:0;
}
.section--slot .slot-offer{
  margin: 0;
  padding: clamp(16px, 3.5vw, 24px) clamp(14px, 4vw, 32px);
  text-align: center;
  background:
    linear-gradient(125deg, rgba(30, 102, 255, 0.16) 0%, rgba(255, 255, 255, 0.75) 42%, rgba(255, 205, 112, 0.14) 100%);
  border-bottom: 2px solid rgba(30, 102, 255, 0.22);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92);
}
.section--slot .slot-offer__line{
  margin: 0 auto 10px;
  max-width: 42rem;
  font-size: clamp(15px, 3.8vw, 18px);
  line-height: 1.45;
  font-weight: 700;
  color: var(--blue-950);
}
.section--slot .slot-offer__line--accent{
  font-size: clamp(14px, 3.4vw, 17px);
  font-weight: 700;
  color: var(--blue-900);
}
.section--slot .slot-offer__rupee{
  display: inline-block;
  margin: 0 0.12em;
  padding: 0.1em 0.32em 0.12em;
  font-size: clamp(26px, 7.5vw, 40px);
  font-weight: 900;
  letter-spacing: -0.03em;
  line-height: 1;
  color: #fff;
  background: linear-gradient(135deg, var(--blue-700) 0%, var(--blue-500) 55%, #2563d4 100%);
  border-radius: 12px;
  box-shadow: 0 4px 18px rgba(30, 102, 255, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.28);
  vertical-align: middle;
}
.section--slot .slot-offer__count-line{
  margin: clamp(14px, 3vw, 20px) auto 0;
  max-width: min(100%, 30rem);
  padding: clamp(12px, 2.8vw, 16px) clamp(12px, 3vw, 20px);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px 16px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(30, 102, 255, 0.22);
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(30, 102, 255, 0.08);
}
.section--slot .slot-offer__count-label{
  font-size: clamp(11px, 2.9vw, 13px);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--blue-800);
  line-height: 1.35;
  text-wrap: balance;
}
.section--slot .slot-offer__count-wrap{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.2ch;
}
.section--slot .slot-offer__count-num{
  font-variant-numeric: tabular-nums;
  font-size: clamp(28px, 8.5vw, 44px);
  font-weight: 900;
  line-height: 1;
  color: var(--blue-700);
}
.section--slot .slot-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  padding: 0;
  align-items: stretch;
  min-height: 0;
}
.section--slot .slot-image{
  display: flex;
  align-items: stretch;
  justify-content: center;
  min-width: 0;
  min-height: 200px;
  overflow: hidden;
  padding: 20px 16px 20px 24px;
}
.section--slot .slot-image img{
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: cover;
  object-position: center center;
  border-radius: var(--radius);
  border: 1px solid rgba(30,102,255,.18);
  box-shadow: 0 8px 24px rgba(30,102,255,.08);
}

/* Social media presence — home (after book slot) */
.section--social-presence{
  position:relative;
  padding:clamp(36px, 7vw, 64px) 0 clamp(40px, 8vw, 72px);
  overflow:hidden;
  background:
    radial-gradient(ellipse 90% 60% at 10% 20%, rgba(225,48,108,.08), transparent 55%),
    radial-gradient(ellipse 70% 50% at 90% 80%, rgba(30,102,255,.12), transparent 50%),
    linear-gradient(180deg, rgba(255,255,255,.97) 0%, rgba(240,247,255,.92) 50%, rgba(255,252,245,.95) 100%);
  border-top:1px solid rgba(30,102,255,.1);
  border-bottom:1px solid rgba(30,102,255,.08);
}
.section--social-presence::before{
  content:'';
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% 0%, rgba(234,179,8,.1), transparent 45%);
  pointer-events:none;
}
.section--social-presence .container{
  position:relative;
  z-index:1;
}
.social-presence__intro{
  text-align:center;
  max-width:40rem;
  margin:0 auto clamp(22px, 5vw, 36px);
}
.social-presence__eyebrow{
  margin:0 0 8px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--blue-600);
}
.social-presence__intro h2{
  margin:0 0 12px;
  font-size:clamp(1.45rem, 4.2vw, 2rem);
  letter-spacing:-.03em;
  color:var(--blue-950);
}
.social-presence__lead{
  margin:0;
  font-size:clamp(15px, 2.8vw, 17px);
  line-height:1.6;
  color:rgba(11,18,32,.78);
}
.social-presence__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(18px, 4vw, 26px);
  align-items:stretch;
}
@media (min-width: 640px){
  .social-presence__grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 1100px){
  .social-presence__grid{
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:clamp(16px, 2.2vw, 22px);
  }
}
.social-spotlight{
  display:flex;
  flex-direction:column;
  min-height:0;
  border-radius:calc(var(--radius) + 12px);
  overflow:hidden;
  background:linear-gradient(165deg, rgba(255,255,255,.99) 0%, rgba(248,251,255,.96) 100%);
  border:1px solid rgba(11,18,32,.1);
  box-shadow:
    0 16px 40px rgba(11,18,32,.08),
    0 0 0 1px rgba(255,255,255,.8) inset;
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
@media (hover:hover) and (pointer:fine){
  .social-spotlight:hover{
    transform:translateY(-6px);
    box-shadow:
      0 24px 52px rgba(30,102,255,.14),
      0 0 0 1px rgba(255,255,255,.9) inset;
    border-color:rgba(30,102,255,.22);
  }
}
.social-spotlight--instagram{
  border-color:rgba(225,48,108,.2);
}
.social-spotlight--facebook{
  border-color:rgba(24,119,242,.25);
}
.social-spotlight--youtube{
  border-color:rgba(255,0,0,.22);
}
.social-spotlight--linkedin{
  border-color:rgba(10,102,194,.28);
}
.social-spotlight__visual{
  position:relative;
  aspect-ratio:16/10;
  min-height:min(140px, 42vw);
  overflow:hidden;
  background:linear-gradient(145deg, rgba(225,236,255,.5), rgba(254,243,199,.2));
}
.social-spotlight__visual img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.social-spotlight__visual video.social-spotlight__media{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  background:#0b1220;
}
.social-spotlight__visual--brand{
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(145deg, #0a66c2 0%, #004182 55%, #0a2540 100%);
}
.social-spotlight__visual--linkedin-photo::after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(165deg, rgba(10,102,194,.12) 0%, transparent 45%, rgba(10,37,64,.42) 100%);
}
.social-spotlight__brand-mark{
  width:min(88px, 28vw);
  height:min(88px, 28vw);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:clamp(1.5rem, 5vw, 2rem);
  font-weight:900;
  letter-spacing:-.04em;
  color:#fff;
  background:rgba(255,255,255,.15);
  border:3px solid rgba(255,255,255,.45);
  border-radius:20px;
  box-shadow:0 12px 32px rgba(0,0,0,.2);
}
.social-spotlight__play{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  width:clamp(48px, 14vw, 64px);
  height:clamp(48px, 14vw, 64px);
  border-radius:50%;
  background:rgba(0,0,0,.42);
  border:3px solid rgba(255,255,255,.85);
  box-shadow:0 8px 24px rgba(0,0,0,.35);
  pointer-events:none;
}
.social-spotlight__play::after{
  content:'';
  position:absolute;
  left:54%;
  top:50%;
  transform:translate(-50%, -50%);
  border-style:solid;
  border-width:10px 0 10px 16px;
  border-color:transparent transparent transparent #fff;
}
.social-spotlight__play--yt{
  background:rgba(255,0,0,.75);
  border-color:rgba(255,255,255,.95);
}
.social-spotlight__play--linkedin{
  background:rgba(10,102,194,.58);
  border-color:rgba(255,255,255,.9);
}
.social-spotlight__body{
  display:flex;
  flex-direction:column;
  flex:1;
  gap:8px;
  padding:clamp(14px, 3.2vw, 18px) clamp(14px, 3vw, 18px) clamp(16px, 3.5vw, 20px);
  min-height:0;
}
.social-spotlight__platform{
  margin:0;
  font-size:13px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--blue-800);
}
.social-spotlight--instagram .social-spotlight__platform{
  color:#c13584;
}
.social-spotlight--facebook .social-spotlight__platform{
  color:#1877f2;
}
.social-spotlight--youtube .social-spotlight__platform{
  color:#c00;
}
.social-spotlight--linkedin .social-spotlight__platform{
  color:#0a66c2;
}
.social-spotlight__label{
  margin:0;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:rgba(11,18,32,.5);
}
.social-spotlight__hook{
  margin:0 0 4px;
  font-size:clamp(14px, 3.2vw, 15px);
  font-weight:800;
  line-height:1.35;
  color:var(--blue-950);
}
.social-spotlight__stats{
  list-style:none;
  margin:0;
  padding:10px 0 0;
  display:flex;
  flex-wrap:wrap;
  gap:8px 14px;
  border-top:1px dashed rgba(30,102,255,.2);
}
.social-spotlight__stats li{
  font-size:12px;
  color:rgba(11,18,32,.72);
  line-height:1.3;
}
.social-spotlight__stat-val{
  font-weight:900;
  font-variant-numeric:tabular-nums;
  color:var(--blue-950);
}
.social-spotlight__stat-key{
  font-weight:600;
}
.social-spotlight__quote{
  margin:6px 0 0;
  padding:10px 12px;
  font-size:12px;
  font-style:italic;
  line-height:1.45;
  color:rgba(11,18,32,.82);
  background:linear-gradient(135deg, rgba(254,243,199,.35), rgba(240,247,255,.5));
  border-radius:12px;
  border-left:3px solid #eab308;
}
.social-spotlight__stars{
  display:block;
  font-style:normal;
  font-size:11px;
  letter-spacing:.15em;
  color:#ca8a04;
  margin-bottom:6px;
}
.social-spotlight__cta{
  margin-top:auto;
  padding:11px 16px;
  border-radius:12px;
  font-size:13px;
  font-weight:900;
  text-align:center;
  text-decoration:none;
  color:#fff;
  border:2px solid transparent;
  box-shadow:0 6px 20px rgba(0,0,0,.12);
  transition:transform .2s ease, filter .2s ease;
}
.social-spotlight__cta:hover{
  filter:brightness(1.06);
  transform:translateY(-1px);
}
.social-spotlight__cta--instagram{
  background:linear-gradient(135deg, #f58529, #dd2a7b, #8134af);
  box-shadow:0 8px 24px rgba(221,42,123,.28);
}
.social-spotlight__cta--facebook{
  background:linear-gradient(135deg, #1877f2, #0d5dbf);
  box-shadow:0 8px 24px rgba(24,119,242,.28);
}
.social-spotlight__cta--youtube{
  background:linear-gradient(135deg, #ff0000, #c00);
  box-shadow:0 8px 24px rgba(255,0,0,.22);
}
.social-spotlight__cta--linkedin{
  background:linear-gradient(135deg, #0a66c2, #004182);
  box-shadow:0 8px 24px rgba(10,102,194,.28);
}
.social-presence__fineprint{
  margin:clamp(20px, 4vw, 28px) auto 0;
  max-width:44rem;
  text-align:center;
  font-size:11px;
  line-height:1.5;
  color:rgba(11,18,32,.55);
}
.social-presence__ribbon{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px 12px;
  margin-top:clamp(18px, 4vw, 26px);
  padding-top:clamp(18px, 4vw, 24px);
  border-top:1px solid rgba(30,102,255,.12);
}
.social-presence__chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:10px 20px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  text-decoration:none;
  color:#fff;
  border:2px solid rgba(255,255,255,.25);
  box-shadow:0 4px 16px rgba(11,18,32,.1);
  transition:transform .2s ease, box-shadow .2s ease;
}
.social-presence__chip:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(11,18,32,.14);
}
.social-presence__chip--instagram{
  background:linear-gradient(135deg, #f58529, #dd2a7b, #8134af);
}
.social-presence__chip--facebook{
  background:linear-gradient(135deg, #1877f2, #0d5dbf);
}
.social-presence__chip--youtube{
  background:linear-gradient(135deg, #ff0000, #a00);
}
.social-presence__chip--linkedin{
  background:linear-gradient(135deg, #0a66c2, #004182);
}
@media (prefers-reduced-motion: reduce){
  .social-spotlight,
  .social-spotlight__cta,
  .social-presence__chip{
    transition:none;
  }
  .social-spotlight:hover{
    transform:none;
  }
}

.contact-left{
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.contact-image{
  display: flex;
  align-items: center;
  justify-content: center;
}
.contact-image img{
  width: 100%;
  height: auto;
  border-radius: var(--radius);
  border: 1px solid rgba(30,102,255,.15);
  box-shadow: 0 12px 32px rgba(2,6,23,.08);
}

/* Contact Us & Refer: same section width/height as Our Unique Concept — one panel, image matches form */
.section--contact,
.section--refer{
  padding-bottom: 40px;
}
.section--contact .contact-layout,
.section--refer .contact-layout{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: stretch;
  min-height: 0;
  border-radius: calc(var(--radius) + 12px);
  overflow: hidden;
  border: 1px solid rgba(30,102,255,.22);
  background:
    radial-gradient(ellipse 120% 80% at 0% 0%, rgba(30,102,255,.2), transparent 50%),
    radial-gradient(ellipse 100% 70% at 100% 100%, rgba(17,75,185,.12), transparent 50%),
    linear-gradient(165deg, rgba(255,255,255,.9) 0%, rgba(232,241,255,.6) 50%, rgba(207,230,255,.4) 100%);
  box-shadow: 0 24px 64px rgba(30,102,255,.14), inset 0 1px 0 rgba(255,255,255,.9);
}
.section--contact .contact-left,
.section--refer .contact-left{
  min-width: 0;
  padding: clamp(18px, 3.5vw, 24px) clamp(16px, 3.2vw, 28px) clamp(20px, 4vw, 28px);
  background: linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.88) 100%);
  border-right: 1px solid rgba(30,102,255,.2);
  border-radius: calc(var(--radius) + 4px) 0 0 calc(var(--radius) + 4px);
  gap: 0;
}
.section--contact .contact-image,
.section--refer .contact-image{
  align-items: stretch;
  justify-content: center;
  min-width: 0;
  min-height: 200px;
  overflow: hidden;
  padding: 20px 24px 20px 16px;
}
.section--contact .contact-image img,
.section--refer .contact-image img{
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: cover;
  object-position: center center;
  border-radius: var(--radius);
  border: 1px solid rgba(30,102,255,.18);
  box-shadow: 0 8px 24px rgba(30,102,255,.08);
}

/* Contact & Refer panels — full-width safe, no grid blowout */
.section--contact .contact-layout,
.section--refer .contact-layout{
  width:100%;
  max-width:100%;
  min-width:0;
}
.section--contact .contact-left .card,
.section--refer .contact-left .card{
  min-width:0;
  max-width:100%;
}
.section--contact .form,
.section--refer .form{
  min-width:0;
  width:100%;
  max-width:100%;
}
.section--contact .form__field,
.section--refer .form__field{
  min-width:0;
}
/* Contact page: Google Map embed (refer page still uses photo) */
.section--contact .contact-image.contact-map{
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 16px;
  height: 100%;
  min-height: 0;
  align-self: stretch;
}
.section--contact .contact-map__head{
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  border-radius: calc(var(--radius) + 2px);
  background:
    linear-gradient(135deg, rgba(255,255,255,.98) 0%, rgba(232,241,255,.88) 55%, rgba(207,230,255,.55) 100%);
  border: 1px solid rgba(30,102,255,.22);
  box-shadow:
    0 6px 20px rgba(30,102,255,.12),
    inset 0 1px 0 rgba(255,255,255,.9);
}
.section--contact .contact-map__head::before{
  content: '';
  width: 5px;
  align-self: stretch;
  min-height: 40px;
  border-radius: 6px;
  background: linear-gradient(180deg, var(--blue-500), var(--blue-800));
  box-shadow: 0 2px 8px rgba(30,102,255,.35);
  flex-shrink: 0;
}
.section--contact .contact-map__head-inner{
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.section--contact .contact-map__title{
  margin: 0;
  font-size: clamp(15px, 1.35vw, 17px);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--blue-950);
  line-height: 1.25;
}
.section--contact .contact-map__meta{
  margin: 0;
  font-size: 13px;
  color: var(--muted);
  line-height: 1.35;
}
.section--contact .contact-map__frame{
  position: relative;
  width: 100%;
  flex: 1 1 auto;
  min-height: clamp(380px, 52vh, 640px);
  border-radius: calc(var(--radius) + 6px);
  overflow: hidden;
  border: 1px solid rgba(30,102,255,.28);
  box-shadow:
    0 4px 0 rgba(255,255,255,.65) inset,
    0 0 0 1px rgba(255,255,255,.5) inset,
    0 20px 48px rgba(17,75,185,.18),
    0 8px 24px rgba(30,102,255,.12);
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(255,255,255,.5), transparent 55%),
    linear-gradient(165deg, rgba(255,255,255,.95), rgba(225, 236, 255, .5));
}
.section--contact .contact-map__frame::before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 5px;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(90deg, var(--blue-600), var(--blue-500), var(--blue-700));
  opacity: .92;
}
.section--contact .contact-map__frame::after{
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  border-radius: inherit;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.25),
    inset 0 48px 80px -32px rgba(6,26,68,.12);
}
.section--contact .contact-map__frame iframe{
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.section--contact .contact-map__open{
  width: 100%;
  justify-content: center;
  text-align: center;
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  border-radius: 14px;
  text-decoration: none;
  flex-shrink: 0;
  font-weight: 800;
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(30,102,255,.28);
  color: var(--blue-900);
  box-shadow: 0 4px 14px rgba(30,102,255,.1);
  transition: background .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.section--contact .contact-map__open:hover{
  background: #fff;
  border-color: rgba(30,102,255,.45);
  box-shadow: 0 8px 22px rgba(30,102,255,.16);
}
.section--slot .pill--slot{
  align-self: flex-start;
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
  background: linear-gradient(135deg, rgba(30,102,255,.18), rgba(17,75,185,.1));
  border-color: rgba(30,102,255,.3);
}
.section--slot .slot-title{
  margin: 4px 0 0;
  font-size: clamp(22px, 2.8vw, 32px);
  letter-spacing: -.3px;
  color: var(--blue-950);
  line-height: 1.25;
}
.section--slot .slot-note{
  font-size: 15px;
  line-height: 1.65;
  color: rgba(11,18,32,.78);
}
.section--slot .slot-note--highlight{
  margin-top: 4px;
  padding: 12px 14px;
  background: rgba(255,255,255,.6);
  border-radius: 14px;
  border: 1px solid rgba(30,102,255,.15);
  color: var(--blue-900);
}
.slot-kv{
  margin-top: 16px !important;
  gap: 12px;
}
.section--slot .slot-kv div{
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid rgba(30,102,255,.18);
  background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(232,241,255,.5));
  box-shadow: 0 4px 12px rgba(30,102,255,.06);
  transition: transform .2s ease, box-shadow .2s ease;
}
.section--slot .slot-kv div:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(30,102,255,.1);
}
.section--slot .slot-kv strong{
  font-size: 11px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--blue-800);
}
.section--slot .slot-kv span{
  font-size: 15px;
  color: var(--blue-900);
}
.section--slot .slot-form{
  margin:0;
  background: linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.88) 100%);
  border: 1px solid rgba(30,102,255,.2);
  border-left: 1px solid rgba(30,102,255,.25);
  box-shadow: 0 16px 48px rgba(30,102,255,.12), 0 0 0 1px rgba(255,255,255,.8) inset;
  padding: clamp(18px, 3.5vw, 24px) clamp(16px, 3.2vw, 28px) clamp(20px, 4vw, 28px);
  border-radius: 0 calc(var(--radius) + 4px) calc(var(--radius) + 4px) 0;
  min-width:0;
  max-width:100%;
}
.section--slot .form{
  min-width:0;
  width:100%;
  max-width:100%;
}
.section--slot .form__field{
  min-width:0;
}
.section--slot .form__slot-status{
  margin: 10px 0 0;
  padding: 10px 12px;
  font-size: 13px;
  line-height: 1.45;
  border-radius: 12px;
}
.section--slot .form__slot-status--ok{
  background: rgba(34, 197, 94, 0.12);
  color: #166534;
  border: 1px solid rgba(34, 197, 94, 0.35);
}
.section--slot .form__slot-status--error{
  background: rgba(239, 68, 68, 0.1);
  color: #991b1b;
  border: 1px solid rgba(239, 68, 68, 0.35);
}
.section--slot .segmented{
  border-radius: 12px;
  padding: 6px;
  background: rgba(232,241,255,.5);
  border: 1px solid rgba(30,102,255,.2);
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.section--slot .segmented__btn{
  flex:1 1 calc(50% - 3px);
  min-width:min(100%, 8rem);
  min-height:44px;
  padding: 10px 12px;
  font-size: 14px;
}
.section--slot .segmented__btn.is-active{
  background: linear-gradient(135deg, var(--blue-500), var(--blue-700));
  border-color: rgba(255,255,255,.3);
  color: #fff;
  box-shadow: 0 4px 12px rgba(30,102,255,.3);
}
.section--slot .segmented__btn:hover:not(.is-active){
  background: rgba(30,102,255,.08);
}

.card h3{margin:6px 0 6px; font-size:16px}
.card p{margin:0; color:var(--muted)}
.pill{
  display:inline-flex; align-items:center; gap:8px;
  font-weight:800;
  font-size:12px;
  color:var(--blue-900);
  background:rgba(30,102,255,.10);
  border:1px solid rgba(30,102,255,.18);
  border-radius:999px;
  padding:7px 10px;
}

.badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:11px;
  letter-spacing:.2px;
  border:1px solid rgba(11,18,32,.10);
  background:rgba(255,255,255,.70);
  color:rgba(11,18,32,.88);
}
.badge--soon,
.badge--upcoming{
  border-color: rgba(30,102,255,.25);
  background: linear-gradient(135deg, rgba(30,102,255,.16), rgba(17,75,185,.10));
  color: var(--blue-900);
}

/* Product carousel — scroll physics, special UI */
.carousel-section{
  background:
    radial-gradient(ellipse 120% 80% at 50% 0%, rgba(30,102,255,.12), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.5) 0%, rgba(232,241,255,.4) 100%);
  border-radius: calc(var(--radius) + 8px);
  border: 1px solid rgba(30,102,255,.18);
  box-shadow: 0 20px 60px rgba(2,6,23,.08), inset 0 1px 0 rgba(255,255,255,.8);
  padding: 24px 0 28px;
  margin-top: 20px;
}
.carousel-section#coming-soon{
  background:
    radial-gradient(ellipse 100% 60% at 50% 0%, rgba(30,102,255,.2), transparent 50%),
    linear-gradient(180deg, rgba(255,255,255,.6) 0%, rgba(207,230,255,.5) 100%);
  border-color: rgba(30,102,255,.25);
  box-shadow: 0 24px 64px rgba(30,102,255,.12), inset 0 1px 0 rgba(255,255,255,.9);
}
.carousel{
  display: flex;
  gap: 18px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(30,102,255,.4) transparent;
  padding: 8px 0 16px;
  margin-left: max(clamp(16px, 4vw, 72px), env(safe-area-inset-left, 0px));
  margin-right: max(clamp(16px, 4vw, 72px), env(safe-area-inset-right, 0px));
}
.carousel::-webkit-scrollbar{ height: 8px }
.carousel::-webkit-scrollbar-track{ background: rgba(11,18,32,.06); border-radius: 4px }
.carousel::-webkit-scrollbar-thumb{ background: rgba(30,102,255,.35); border-radius: 4px }
.carousel::-webkit-scrollbar-thumb:hover{ background: rgba(30,102,255,.5) }
/* Product carousels: no scrollbar, but scrollable (auto + manual touch/drag) */
.carousel-section .carousel{
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.carousel-section .carousel::-webkit-scrollbar{
  display: none;
}
.carousel-section .carousel .card{
  flex: 0 0 min(300px, calc(100vw - max(48px, env(safe-area-inset-left, 0px) + env(safe-area-inset-right, 0px))));
  scroll-snap-align: start;
  scroll-snap-stop: always;
}
.carousel-section .carousel .media-card{
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-height: 0;
  height: 100%;
}
/* Product photo: fixed square frame; cover fills the box edge-to-edge */
.carousel-section .carousel .media-card > img{
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  flex-shrink: 0;
  object-fit: cover;
  object-position: center;
  padding: 0;
  box-sizing: border-box;
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(248,251,255,.95), rgba(225, 236, 255, .65));
  border: 1px solid rgba(11,18,32,.08);
}
.carousel-section .carousel .media-card > div{
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 14px 16px 16px;
  gap: 6px;
  min-height: 0;
}
.carousel-section .carousel .media-card .note{
  margin-top: 0;
  flex: 1;
  line-height: 1.45;
}
.carousel-section .carousel .media-card h3{
  margin-top: 0;
}
/* Coming Soon: disable scroll-snap so JS auto-scroll works smoothly */
#coming-soon .carousel{
  scroll-snap-type: none;
}
#coming-soon .carousel .card{
  scroll-snap-align: none;
  scroll-snap-stop: normal;
}
/* Upcoming product cards — more interesting, highlighted */
#coming-soon .carousel .media-card{
  position: relative;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(232,241,255,.9));
  border: 2px solid rgba(30,102,255,.22);
  border-radius: 20px;
  box-shadow: 0 12px 32px rgba(30,102,255,.15), 0 0 0 1px rgba(255,255,255,.6) inset;
  transition: transform .2s, box-shadow .2s;
}
#coming-soon .carousel .media-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(30,102,255,.2), 0 0 0 1px rgba(255,255,255,.8) inset;
}
#coming-soon .carousel .media-card > img{
  border-radius: 18px 18px 0 0;
  border: none;
  border-bottom: 1px solid rgba(30,102,255,.14);
  padding: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.5), rgba(230, 240, 255, .35));
}
#popular-products .carousel .media-card > img{
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
}
#popular-products .carousel .media-card{
  --popular-flip-duration:7s;
  --popular-flip-ease:cubic-bezier(0.52, 0.02, 0.2, 1);
}
/* Popular products — 3D “page turn” + glow; opacity timing matches .popular-product__pane */
#popular-products .carousel .media-card .popular-product__flip{
  position:relative;
  width:100%;
  aspect-ratio:1/1;
  min-height:min(200px, 58vw);
  max-height:min(360px, 85vw);
  height:auto;
  flex-shrink:0;
  border-radius:clamp(12px, 2.8vw, 16px);
  overflow:hidden;
  background:linear-gradient(145deg, rgba(248,251,255,.95), rgba(225,236,255,.65));
  border:1px solid rgba(11,18,32,.1);
  transform:translateZ(0);
  perspective:1100px;
  perspective-origin:50% 50%;
  animation:popular-product-frame-glow var(--popular-flip-duration) var(--popular-flip-ease) infinite;
}
@keyframes popular-product-frame-glow{
  0%, 42%, 100%{
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.4),
      0 6px 20px rgba(11,18,32,.07),
      0 0 0 1px rgba(30,102,255,.06);
  }
  50%, 92%{
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.55),
      0 14px 40px rgba(30,102,255,.16),
      0 0 28px rgba(234,179,8,.12);
  }
}
@media (min-width: 721px){
  #popular-products .carousel .media-card .popular-product__flip{
    min-height:min(220px, 32vw);
    max-height:min(320px, 40vw);
  }
}
@media (min-width: 1024px){
  #popular-products .carousel .media-card .popular-product__flip{
    min-height:240px;
    max-height:340px;
  }
}
#popular-products .carousel .media-card .popular-product__flip img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  will-change:transform, opacity, filter;
  backface-visibility:hidden;
  transform-style:preserve-3d;
  transform-origin:50% 50%;
}
#popular-products .carousel .media-card .popular-product__flip img:first-of-type{
  animation:popular-product-media-a var(--popular-flip-duration) var(--popular-flip-ease) infinite;
}
#popular-products .carousel .media-card .popular-product__flip img:last-of-type{
  animation:popular-product-media-b var(--popular-flip-duration) var(--popular-flip-ease) infinite;
}
@keyframes popular-product-media-a{
  0%, 42%{
    opacity:1;
    transform:rotateY(0deg) scale(1);
    filter:brightness(1) saturate(1);
  }
  46%{
    opacity:0.45;
    transform:rotateY(-58deg) scale(0.94);
    filter:brightness(1.12) saturate(1.08);
  }
  50%, 92%{
    opacity:0;
    transform:rotateY(-92deg) scale(0.9);
    filter:brightness(1) saturate(1);
  }
  96%{
    opacity:0.45;
    transform:rotateY(-32deg) scale(0.96);
    filter:brightness(1.08) saturate(1.05);
  }
  100%{
    opacity:1;
    transform:rotateY(0deg) scale(1);
    filter:brightness(1) saturate(1);
  }
}
@keyframes popular-product-media-b{
  0%, 42%{
    opacity:0;
    transform:rotateY(92deg) scale(0.9);
    filter:brightness(1) saturate(1);
  }
  46%{
    opacity:0.45;
    transform:rotateY(32deg) scale(0.96);
    filter:brightness(1.08) saturate(1.05);
  }
  50%, 92%{
    opacity:1;
    transform:rotateY(0deg) scale(1);
    filter:brightness(1) saturate(1);
  }
  96%{
    opacity:0.45;
    transform:rotateY(58deg) scale(0.94);
    filter:brightness(1.12) saturate(1.08);
  }
  100%{
    opacity:0;
    transform:rotateY(92deg) scale(0.9);
    filter:brightness(1) saturate(1);
  }
}
.popular-product__panes{
  position:relative;
  width:100%;
  min-height:clamp(5.5rem, 17vw, 7.25rem);
  margin-top:2px;
}
.popular-product__pane{
  position:absolute;
  left:0;
  right:0;
  top:0;
  margin:0;
  padding:0;
  animation:popular-product-flip-a var(--popular-flip-duration, 7s) var(--popular-flip-ease) infinite;
}
.popular-product__pane--b{
  animation-name:popular-product-flip-b;
}
@keyframes popular-product-flip-a{
  0%, 42%{ opacity:1; }
  50%, 92%{ opacity:0; }
  100%{ opacity:1; }
}
@keyframes popular-product-flip-b{
  0%, 42%{ opacity:0; }
  50%, 92%{ opacity:1; }
  100%{ opacity:0; }
}
.popular-product__pack{
  margin:0 0 4px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--blue-700);
}
.popular-product__amount{
  margin:0;
  font-size:clamp(13px, 3.2vw, 15px);
  font-weight:800;
  color:var(--blue-950);
  line-height:1.35;
}
.popular-product__amount .price{
  font-variant-numeric:tabular-nums;
}
.popular-product__sub{
  margin:6px 0 0;
  font-size:11px;
  line-height:1.4;
  color:rgba(11,18,32,.68);
}
.popular-product__rates-note{
  margin:10px 0 0;
  font-size:11px;
  line-height:1.45;
  color:rgba(11,18,32,.62);
}
.popular-product__rates-note a{
  font-weight:700;
  color:var(--blue-700);
  text-decoration:underline;
  text-underline-offset:2px;
}
@media (prefers-reduced-motion: reduce){
  #popular-products .carousel .media-card .popular-product__flip{
    animation:none !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.35), 0 6px 20px rgba(11,18,32,.07);
    perspective:none;
  }
  #popular-products .carousel .media-card .popular-product__flip img{
    animation:none !important;
    will-change:auto;
    transform:none !important;
    filter:none !important;
  }
  #popular-products .carousel .media-card .popular-product__flip img:last-of-type{
    opacity:0;
  }
  .popular-product__pane,
  .popular-product__pane--b{
    animation:none !important;
    position:relative;
    opacity:1 !important;
  }
  .popular-product__pane--b{
    margin-top:12px;
    padding-top:12px;
    border-top:1px dashed rgba(30,102,255,.2);
  }
  .popular-product__panes{
    min-height:0;
  }
}
#coming-soon .carousel .media-card .badge--upcoming{
  background: linear-gradient(135deg, var(--blue-600), var(--blue-700));
  color: #fff;
  border-color: rgba(255,255,255,.4);
  font-weight: 900;
  font-size: 11px;
  letter-spacing: .25em;
  text-transform: uppercase;
  padding: 8px 12px;
  animation: badge-pulse 2s ease-in-out infinite;
}
@keyframes badge-pulse{
  0%, 100%{ box-shadow: 0 0 0 0 rgba(30,102,255,.4); }
  50%{ box-shadow: 0 0 0 6px rgba(30,102,255,.1); }
}
/* Book this product button — good width/height for UI */
.btn--book-product{
  width: 100%;
  min-height: 44px;
  padding: 12px 20px;
  margin-top: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  border-radius: 12px;
  text-align: center;
}

.media-card{
  display:grid;
  grid-template-columns: 180px 1fr;
  gap:14px;
  align-items:center;
}
/* Products grid: direct child image only (not carousel) */
.card.media-card > img{
  width: 180px;
  height: 180px;
  min-width: 180px;
  min-height: 180px;
  border-radius: 18px;
  object-fit: cover;
  object-position: center;
  border: 1px solid rgba(11,18,32,.10);
  box-sizing: border-box;
  padding: 0;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(248,251,255,.95), rgba(225, 236, 255, .55));
}
.kv{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:10px;
  margin-top:10px;
}
.kv div{
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(11,18,32,.08);
  background:rgba(255,255,255,.65);
}
.kv strong{display:block; font-size:12px; color:var(--muted)}
.kv span{display:block; font-weight:900}

.table-wrap{
  overflow:auto;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:var(--radius);
  border:1px solid var(--border);
  background:var(--surface);
  max-width:100%;
}
.table-wrap--trial-plans table{
  min-width:1040px;
}
.table-wrap--trial-plans th{
  background:#fff3bf;
  color:rgba(11,18,32,.88);
}
table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width:920px;
}
th, td{
  padding:12px 12px;
  border-bottom:1px solid rgba(11,18,32,.08);
  vertical-align:top;
  text-align:left;
}
th{
  position:sticky; top:0;
  background:rgba(232, 241, 255, .85);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.5px;
  color:rgba(11,18,32,.82);
}
tbody tr:hover td{background:rgba(11,18,32,.03)}
.price{
  font-weight:1000;
  color:var(--blue-900);
}
.note{
  color:var(--muted);
  font-size:13px;
}

.form{
  display:grid;
  gap:12px;
}
.form__row{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}
label{
  display:block;
  font-weight:800;
  font-size:12px;
  color:rgba(11,18,32,.80);
  margin-bottom:6px;
}
input, textarea{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(11,18,32,.14);
  background:rgba(255,255,255,.78);
  font:inherit;
}
textarea{min-height:110px; resize:vertical}
.form__field.is-invalid input,
.form__field.is-invalid textarea{
  border-color:#d32f2f;
  background:rgba(211,47,47,.06);
}
.form__field.is-invalid input:focus,
.form__field.is-invalid textarea:focus{
  outline:2px solid rgba(211,47,47,.4);
  outline-offset:2px;
}
.form__error{
  display:block;
  font-size:12px;
  color:#d32f2f;
  margin-top:6px;
  font-weight:600;
}
.form__actions{display:flex; gap:10px; flex-wrap:wrap; align-items:stretch}
.section--contact .form__actions .btn,
.section--refer .form__actions .btn,
.section--slot .form__actions .btn,
.section--contact .form__actions a.btn,
.section--refer .form__actions a.btn,
.section--slot .form__actions a.btn{
  min-height:44px;
  box-sizing:border-box;
}

.cta-bar{
  margin-top:14px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 14px;
  border-radius:var(--radius);
  border:1px solid rgba(30,102,255,.20);
  background:linear-gradient(135deg, rgba(30,102,255,.10), rgba(17,75,185,.06));
}

.slot-panel{
  border-radius: calc(var(--radius) + 6px);
  border: 1px solid rgba(30,102,255,.18);
  background:
    radial-gradient(800px 320px at 10% 0%, rgba(30,102,255,.18), transparent 65%),
    radial-gradient(700px 360px at 90% 30%, rgba(17,75,185,.12), transparent 60%),
    rgba(255,255,255,.70);
  box-shadow: 0 20px 60px rgba(2,6,23,.10);
  overflow:hidden;
}
.slot-grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 14px;
  padding: 18px;
  align-items: start;
}
.slot-title{
  margin: 10px 0 8px;
  font-size: clamp(20px, 2.6vw, 30px);
  letter-spacing: -.2px;
}
.slot-note{
  margin:0;
  color: var(--muted);
}
.slot-form{
  background: rgba(255,255,255,.86);
}

.segmented{
  display:flex;
  gap:4px;
  padding:4px;
  border-radius: 12px;
  border:1px solid rgba(11,18,32,.10);
  background: rgba(255,255,255,.65);
  margin-top:8px;
}
.segmented__btn{
  flex:1;
  padding:6px 10px;
  border-radius: 10px;
  border:1px solid transparent;
  background: transparent;
  font-weight:900;
  font-size:14px;
  cursor:pointer;
}
.segmented__btn.is-active{
  background: linear-gradient(135deg, rgba(30,102,255,.18), rgba(17,75,185,.12));
  border-color: rgba(30,102,255,.25);
  color: var(--blue-900);
}
.segmented__btn:hover{
  background: rgba(11,18,32,.04);
}

.footer{
  margin-top:22px;
  padding:24px 0 30px;
  border-top:1px solid rgba(11,18,32,.08);
}
.footer__grid{
  display:grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  gap:14px;
  align-items:start;
}
.footer p{margin:8px 0 0; color:var(--muted)}
.footer a{text-decoration:none}
.social{
  display:flex; flex-wrap:wrap; gap:10px; margin-top:12px;
}
.social a{
  width:42px; height:42px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:14px;
  border:1px solid rgba(11,18,32,.12);
  background:rgba(255,255,255,.70);
}
.social a:hover{transform:translateY(-1px)}
.social svg{width:18px; height:18px}

.small{
  font-size:12px;
  color:var(--muted);
}

/* Responsive */
@media (max-width: 1100px){
  .grid--3{grid-template-columns:repeat(2, minmax(0, 1fr))}
}

/* Contact / Refer / Slot forms — stack field pairs before panel goes single-column */
@media (max-width: 900px){
  .section--contact .form__row,
  .section--refer .form__row,
  .section--slot .form__row{
    grid-template-columns:1fr;
  }
}

@media (max-width: 940px){
  /* Hero panels lose 100vw breakout here — remove side padding so image/video is full-bleed */
  .hero .container{
    padding-left: 0;
    padding-right: 0;
    max-width: 100%;
  }
  .hero--home .hero__panel,
  .hero--products .hero__panel,
  .hero--about .hero__panel{
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    border-radius: 0;
  }
  .hero--about .hero__panel{
    background-size: cover;
    background-position: center center;
  }
  .hero__inner{
    grid-template-columns:1fr;
    padding-top:26px;
    padding-bottom:26px;
    padding-left:max(clamp(16px, 4vw, 72px), env(safe-area-inset-left, 0px));
    padding-right:max(clamp(16px, 4vw, 72px), env(safe-area-inset-right, 0px));
  }
  .hero__media{order:-1}
  .footer__grid{grid-template-columns:1fr; gap:18px}
  /* Must match .section--slot .slot-grid specificity — base rule uses 1fr 1fr */
  .section--slot .slot-grid{
    grid-template-columns:1fr;
    gap:0;
    padding:0;
  }
  .section--slot .slot-image{min-height: 220px; padding: 20px 24px 0}
  .section--slot .slot-image img{height: 100%; min-height: 100%; object-fit: cover; border-radius: calc(var(--radius) + 8px) calc(var(--radius) + 8px) 0 0}
  .section--slot .slot-form{
    border-left: none;
    border-radius: 0 0 calc(var(--radius) + 4px) calc(var(--radius) + 4px);
    padding: clamp(18px, 4vw, 28px) clamp(16px, 3.5vw, 28px) clamp(20px, 4.5vw, 28px);
  }
  .concept-layout{
    grid-template-columns:1fr;
    gap:0;
    max-height:none;
    min-height:0;
    border-radius: calc(var(--radius) + 12px);
  }
  .concept-image{
    min-height: min(200px, 38vw);
    max-height:min(52vh, 420px);
    padding: 16px 20px 0;
    border-radius: calc(var(--radius) + 12px) calc(var(--radius) + 12px) 0 0;
  }
  .concept-image img{
    max-height:min(48vh, 400px);
    height:auto;
    min-height:0;
    object-fit: contain;
    border-radius: calc(var(--radius) + 8px) calc(var(--radius) + 8px) 0 0;
  }
  .concept-cards-wrap{
    padding: 16px 20px 20px;
    border-left: none;
    border-radius: 0 0 calc(var(--radius) + 12px) calc(var(--radius) + 12px);
    overflow-y:visible;
    max-height:none;
  }
  .section--contact .contact-layout,
  .section--refer .contact-layout{grid-template-columns:1fr}
  .section--contact .contact-left,
  .section--refer .contact-left{
    padding: clamp(18px, 4vw, 28px) clamp(16px, 3.5vw, 28px) clamp(20px, 4.5vw, 28px);
    border-right: none;
    border-radius: calc(var(--radius) + 12px) calc(var(--radius) + 12px) 0 0;
  }
  .section--contact .contact-image,
  .section--refer .contact-image{min-height: 220px; padding: 20px 24px; border-radius: 0 0 calc(var(--radius) + 12px) calc(var(--radius) + 12px)}
  .section--contact .contact-image img,
  .section--refer .contact-image img{height: 100%; min-height: 100%; object-fit: cover; border-radius: 0 0 calc(var(--radius) + 8px) calc(var(--radius) + 8px)}
  .section--contact .contact-image.contact-map{
    min-height: auto;
    height: auto;
  }
  .section--contact .contact-map__frame{
    flex: 0 1 auto;
    min-height: 360px;
    max-height: none;
    aspect-ratio: 16 / 11;
  }
  .hero__panel{
    width: auto;
    margin-left: 0;
    margin-right: 0;
    border-radius: calc(var(--radius) + 6px);
    border-left: 1px solid rgba(255,255,255,.18);
    border-right: 1px solid rgba(255,255,255,.18);
  }
  .hero--home .hero__panel,
  .hero--products .hero__panel,
  .hero--about .hero__panel{
    border: none;
    border-radius: 0;
  }
}
@media (max-width: 940px) and (min-width: 1025px){
  .hero--products .hero__inner,
  .hero--about .hero__inner{
    padding-top:36px;
    padding-bottom:44px;
    padding-left:max(clamp(16px, 4vw, 72px), env(safe-area-inset-left, 0px));
    padding-right:max(clamp(16px, 4vw, 72px), env(safe-area-inset-right, 0px));
  }
  .hero--products .hero__panel,
  .hero--about .hero__panel{
    min-height:min(92dvh, 92vh);
  }
}

@media (max-width: 720px){
  .grid--2{grid-template-columns:1fr}
  .carousel-section .carousel .card{
    flex: 0 0 min(280px, calc(100vw - max(40px, env(safe-area-inset-left, 0px) + env(safe-area-inset-right, 0px))));
  }
  #coming-soon .carousel .media-card > img{ padding: 0 }
  .form__row{grid-template-columns:1fr}
  .section--contact .form input,
  .section--contact .form textarea,
  .section--refer .form input,
  .section--refer .form textarea,
  .section--slot .form input,
  .section--slot .form textarea{
    font-size:16px;
  }
  .media-card{grid-template-columns:1fr}
  .card.media-card > img{
    width: 100%;
    min-width: 0;
    max-width: none;
    height: auto;
    min-height: 0;
    aspect-ratio: 1 / 1;
    max-height: none;
    margin: 0 auto;
    object-fit: cover;
    object-position: center;
    align-self: center;
  }
}

@media (max-width: 520px){
  .section--why{padding: 28px 0 36px}
  .section__head--why{padding-left: 16px; margin-bottom: 18px}
  .card--why{padding: 18px 18px 18px 24px}
  .question-highlight{ white-space: normal }
  .section--concept{padding-bottom: 40px}
  .section__head--concept{margin-bottom: 10px}
  .concept-layout{max-height:none}
  .card--concept{padding: 6px 8px 6px 10px; padding-right: 24px}
  .card--concept .card__num{top: 6px; right: 6px; width: 18px; height: 18px; font-size: 9px}
  .section--slot .slot-grid{padding: 0; gap: 0}
  .section--slot .slot-image{min-height: 200px; padding: 16px 16px 0}
  .section--slot .slot-image img{object-position: center center}
  .section--slot .slot-form{
    padding: clamp(16px, 4vw, 22px) clamp(14px, 3.5vw, 20px) clamp(18px, 4vw, 24px);
    border-radius: 0 0 calc(var(--radius) + 4px) calc(var(--radius) + 4px);
  }
  .concept-image{min-height: 120px; padding: 14px 14px 0}
  .concept-image img{object-position: center center}
  .concept-cards-wrap{padding: 16px}
  .concept-layout{gap: 0}
  .contact-image img{max-height: 320px}
  .section--contact .contact-image,
  .section--refer .contact-image{min-height: 200px; padding: 16px}
  .section--contact .contact-image img,
  .section--refer .contact-image img{object-position: center center}
  .section--contact .contact-map__frame{min-height: 300px; aspect-ratio: 4 / 3}
  .section--contact .contact-map__head{padding: 12px 14px; gap: 10px}
  .section--contact .contact-map__open{
    width:100%;
    box-sizing:border-box;
    justify-content:center;
  }
  .section--slot .segmented__btn{
    flex:1 1 100%;
    min-width:0;
  }
  .grid--3{grid-template-columns:1fr}
  .brand__logo{
    width:58px;
    height:58px;
    border-radius:15px;
  }
  .brand__name span{max-width:min(54vw, 188px)}
  body.nav-open .nav__links{
    top:calc(env(safe-area-inset-top, 0px) + 6rem);
    max-height:calc(100vh - env(safe-area-inset-top, 0px) - 6rem - 12px);
    max-height:calc(100dvh - env(safe-area-inset-top, 0px) - 6rem - 12px);
  }
  .hero{padding:0 0 18px}
  .hero__inner{
    padding-top:18px;
    padding-bottom:18px;
    padding-left:max(clamp(16px, 4vw, 72px), env(safe-area-inset-left, 0px));
    padding-right:max(clamp(16px, 4vw, 72px), env(safe-area-inset-right, 0px));
  }
  .hero--products .hero__inner,
  .hero--about .hero__inner{
    padding-top:12px;
    padding-bottom:max(14px, env(safe-area-inset-bottom, 0px));
  }
  .hero--home .hero__inner{
    padding-top:18px;
    padding-bottom:28px;
  }
  .hero__media img{border-radius:16px}
  .hero .hero__actions{
    flex-direction:row;
    flex-wrap:wrap;
    align-items:center;
    justify-content:flex-start;
  }
  .hero .hero__actions .btn{
    width:auto;
    max-width:min(100%, 190px);
    flex:0 1 auto;
  }
  .hero--home .hero__actions .btn,
  .hero--products .hero__inner .hero__actions .btn,
  .hero--about .hero__inner .hero__actions .btn{
    max-width:min(100%, 158px);
    min-height:30px;
    padding:5px 9px;
    font-size:10.5px;
  }
  .cta-bar{flex-direction:column; align-items:stretch}
  .cta-bar .btn{width:100%}
  .form__actions{flex-direction:column; align-items:stretch}
  .form__actions .btn{width:100%}
}

/* Home: panel height comes from in-flow media; don’t force a tall empty panel */
@media (max-width: 1024px){
  .hero--home .hero__panel{
    min-height: unset;
  }
}

@media (max-width: 400px){
  .kv{grid-template-columns:1fr}
}

@media (prefers-reduced-motion: reduce){
  .ticker__track{animation:none}
  .hero--home .btn--ghost.btn--shimmer{animation:none}
  .hero-slider__slide{transition:none}
  #coming-soon .carousel .media-card .badge--upcoming{animation:none}
}