/* ============================================================
   AmberNord Marketing — main.css
   Dark-first. Amber as light source. Vivid, fast, converts.
   ============================================================ */

/* ─── TOKENS ─── */
:root {
  --bg:          #0D0A04;
  --bg-2:        #140F06;
  --bg-3:        #1A1209;
  --surface:     #1F1608;
  --surface-2:   #261C0A;
  --amber:       #F5A11E;
  --amber-hot:   #FF7A00;
  --amber-pale:  rgba(245,161,30,.10);
  --amber-border:rgba(245,161,30,.22);
  --gold:        #E8921A;
  --nordic:      #0E2233;
  --text:        #FAF0DC;
  --text-2:      #C8AA78;
  --text-3:      #7A6040;
  --white:       #FFFFFF;
  --border:      rgba(255,255,255,.07);
  --border-2:    rgba(255,255,255,.12);
  --r-sm:        8px;
  --r-md:        16px;
  --r-lg:        24px;
  --r-xl:        40px;
  --r-full:      9999px;
  --pad:         clamp(20px,5vw,80px);
  --max:         1320px;
  --nav-h:       68px;
  --ff-display:  'Cormorant Garamond', Georgia, serif;
  --ff-body:     'DM Sans', system-ui, sans-serif;
  --ease:        cubic-bezier(.25,.46,.45,.94);
  --ease-out:    cubic-bezier(.16,1,.3,1);
}

/* ─── RESET ─── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--ff-body);
  line-height:1.6;
  overflow-x:hidden;
}
body.menu-open{overflow:hidden}
img,video{display:block;max-width:100%;height:auto}
a{text-decoration:none;color:inherit}
button{font-family:inherit;border:none;background:none;cursor:pointer}
ul,ol{list-style:none}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:4px}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    transition-duration:.01ms!important;
  }
}

/* ─── NAV ─── */
.nav{
  position:fixed;top:0;left:0;right:0;
  z-index:200;
  height:var(--nav-h);
  transition:background .3s var(--ease), box-shadow .3s var(--ease);
}
.nav.scrolled{
  background:rgba(13,10,4,.92);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  box-shadow:0 1px 0 var(--border);
}
.nav-inner{
  max-width:var(--max);
  margin:0 auto;
  padding:0 var(--pad);
  height:100%;
  display:flex;
  align-items:center;
  gap:20px;
}
.nav-logo{
  display:flex;align-items:center;gap:10px;
  flex-shrink:0;margin-right:auto;
}
.nav-mark{
  width:34px;height:34px;
  background:var(--amber);
  color:#fff;
  border-radius:8px;
  display:grid;place-items:center;
  font-family:var(--ff-display);
  font-weight:700;font-size:.8rem;
  letter-spacing:.05em;flex-shrink:0;
}
.nav-name{
  font-family:var(--ff-display);
  font-size:1.2rem;font-weight:600;
  letter-spacing:-.01em;color:var(--text);
}
.footer-logo-name{font-size:1.25rem}

.nav-right{display:flex;align-items:center;gap:12px}

.lang-switcher{
  display:flex;gap:2px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--border);
  border-radius:var(--r-full);
  padding:3px;
}
.lang-btn{
  font-size:.65rem;font-weight:600;
  letter-spacing:.08em;
  color:var(--text-3);
  padding:4px 8px;
  border-radius:var(--r-full);
  transition:background .15s,color .15s;
}
.lang-btn.active{background:var(--amber);color:#fff}
.lang-btn:hover:not(.active){color:var(--text)}

.nav-link-ext{
  font-size:.75rem;font-weight:500;
  color:var(--text-2);
  transition:color .2s;
  white-space:nowrap;
}
.nav-link-ext:hover{color:var(--amber)}

.nav-cta{
  display:inline-flex;align-items:center;gap:6px;
  padding:9px 20px;
  background:var(--amber);
  color:#fff;
  font-size:.75rem;font-weight:600;
  letter-spacing:.07em;text-transform:uppercase;
  border-radius:var(--r-full);
  transition:background .2s,transform .2s;
  white-space:nowrap;
}
.nav-cta:hover{background:var(--amber-hot);transform:translateY(-1px)}

.hamburger{
  display:none;
  flex-direction:column;gap:6px;
  width:26px;height:26px;
  align-items:flex-end;justify-content:center;
}
.hamburger span{
  display:block;height:1.5px;
  background:var(--text);border-radius:2px;
  transition:all .3s;
}
.hamburger span:nth-child(1){width:100%}
.hamburger span:nth-child(2){width:65%}
.hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(7.5px) rotate(45deg);width:100%}
.hamburger[aria-expanded="true"] span:nth-child(2){transform:translateY(-6px) rotate(-45deg);width:100%}

.mobile-menu{
  position:fixed;inset:0;z-index:190;
  background:var(--bg-2);
  display:flex;flex-direction:column;justify-content:center;
  padding:var(--nav-h) var(--pad) 40px;
  transform:translateX(100%);
  transition:transform .4s var(--ease);
}
.mobile-menu:not([hidden]){transform:translateX(0);display:flex}
.mobile-links a{
  display:block;
  font-family:var(--ff-display);
  font-size:clamp(2rem,8vw,3rem);
  font-weight:600;color:var(--text);
  padding:12px 0;
  border-bottom:1px solid var(--border);
  transition:color .2s;
}
.mobile-links a:hover{color:var(--amber)}
.mobile-bottom{
  display:flex;align-items:center;
  gap:20px;margin-top:32px;flex-wrap:wrap;
}

/* ─── HERO ─── */
.hero{
  position:relative;
  min-height:100svh;
  display:flex;align-items:center;
  padding:calc(var(--nav-h) + 40px) var(--pad) 80px;
  overflow:hidden;
}

/* Ambient glow — pure CSS, zero JS */
.hero-glow{
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  filter:blur(80px);
}
.g1{
  width:clamp(400px,50vw,700px);
  height:clamp(400px,50vw,700px);
  background:radial-gradient(circle,rgba(245,161,30,.28) 0%,transparent 70%);
  right:-5%;top:20%;
  animation:glowPulse 6s ease-in-out infinite;
}
.g2{
  width:clamp(200px,30vw,420px);
  height:clamp(200px,30vw,420px);
  background:radial-gradient(circle,rgba(255,122,0,.18) 0%,transparent 70%);
  right:20%;bottom:10%;
  animation:glowPulse 8s ease-in-out 1s infinite;
}
.g3{
  width:clamp(150px,20vw,300px);
  height:clamp(150px,20vw,300px);
  background:radial-gradient(circle,rgba(245,161,30,.12) 0%,transparent 70%);
  left:0;top:30%;
  animation:glowPulse 10s ease-in-out 2s infinite;
}

.hero-inner{
  position:relative;z-index:1;
  width:100%;max-width:var(--max);
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:clamp(40px,6vw,100px);
}
.hero-text{display:flex;flex-direction:column;gap:0}

/* Eyebrow */
.eyebrow{
  font-family:var(--ff-body);
  font-size:.65rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;
  color:var(--amber);
  margin-bottom:20px;
}
.eyebrow.amber{color:var(--amber)}
.eyebrow.light{color:var(--amber)}

/* H1 */
.hero-h1{
  font-family:var(--ff-display);
  font-size:clamp(2.4rem,5.5vw,5rem);
  font-weight:700;line-height:1.08;
  letter-spacing:-.02em;
  color:var(--text);
  margin-bottom:24px;
}
.hero-h1 em{
  display:block;
  font-style:italic;color:var(--amber);
}
.h1-line{display:block}

.hero-sub{
  font-size:clamp(.9375rem,1.5vw,1.0625rem);
  line-height:1.7;color:var(--text-2);
  max-width:440px;
  margin-bottom:32px;
}

/* Price block — DAILY PRICE IS THE HERO */
.price-hero{
  display:flex;flex-direction:column;gap:6px;
  margin-bottom:32px;
  padding:20px 24px;
  background:rgba(245,161,30,.07);
  border:1px solid var(--amber-border);
  border-radius:var(--r-md);
  width:fit-content;
}
.price-daily{display:flex;align-items:baseline;gap:8px}
.price-daily-num{
  font-family:var(--ff-display);
  font-size:clamp(2.5rem,5vw,3.75rem);
  font-weight:700;line-height:1;
  color:var(--amber);
}
.price-daily-unit{
  font-size:1rem;font-weight:500;
  color:var(--text-2);
  letter-spacing:.04em;
}
.price-full{
  font-size:.8125rem;color:var(--text-3);
  letter-spacing:.04em;
}

/* Actions */
.hero-actions{
  display:flex;align-items:center;gap:14px;
  flex-wrap:wrap;margin-bottom:20px;
}
.voucher-tag{
  font-size:.75rem;font-weight:500;
  color:var(--amber);
  letter-spacing:.04em;
  opacity:.8;
}

/* Buttons */
.btn-primary{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 28px;
  background:var(--amber);
  color:#fff;
  font-size:.8125rem;font-weight:600;
  letter-spacing:.07em;text-transform:uppercase;
  border-radius:var(--r-full);
  transition:background .2s,transform .2s;
  white-space:nowrap;position:relative;overflow:hidden;
}
.btn-primary:hover{background:var(--amber-hot);transform:translateY(-2px)}
.btn-primary:active{transform:translateY(0)}

.btn-ghost{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 24px;
  border:1px solid var(--border-2);
  color:var(--text-2);
  font-size:.8125rem;font-weight:500;
  border-radius:var(--r-full);
  transition:border-color .2s,color .2s,background .2s;
  white-space:nowrap;
}
.btn-ghost:hover{border-color:var(--amber);color:var(--amber);background:var(--amber-pale)}

.btn-primary-light{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 28px;
  background:var(--text);
  color:var(--bg);
  font-size:.8125rem;font-weight:600;
  letter-spacing:.07em;text-transform:uppercase;
  border-radius:var(--r-full);
  transition:background .2s,transform .2s;
  white-space:nowrap;
}
.btn-primary-light:hover{background:var(--amber);color:#fff;transform:translateY(-2px)}

.btn-ghost-light{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 24px;
  border:1px solid rgba(255,255,255,.25);
  color:rgba(255,255,255,.7);
  font-size:.8125rem;font-weight:500;
  border-radius:var(--r-full);
  transition:border-color .2s,color .2s;
  white-space:nowrap;
}
.btn-ghost-light:hover{border-color:var(--amber);color:var(--amber)}

/* Hero visual */
.hero-visual{
  position:relative;
  display:flex;justify-content:center;
}
.bottle-stage{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  width:100%;max-width:500px;
}
.bottle-img{
  position:relative;z-index:2;
  width:72%;height:auto;
  object-fit:contain;
  filter:drop-shadow(0 40px 80px rgba(245,161,30,.25))
         drop-shadow(0 0 60px rgba(245,161,30,.12));
  animation:bottleFloat 7s ease-in-out infinite;
}
.bottle-pill{
  position:absolute;z-index:3;
  background:rgba(245,161,30,.12);
  border:1px solid var(--amber-border);
  backdrop-filter:blur(12px);
  border-radius:var(--r-md);
  padding:10px 14px;
  display:flex;flex-direction:column;align-items:center;
  gap:2px;
}
.bottle-pill.p1{top:12%;right:0}
.bottle-pill.p2{top:46%;left:0}
.bottle-pill.p3{bottom:12%;right:8%}
.pill-big{
  font-family:var(--ff-display);
  font-size:1.375rem;font-weight:700;
  color:var(--amber);line-height:1;
}
.pill-small{
  font-size:.625rem;font-weight:600;
  letter-spacing:.08em;color:var(--text-2);
  text-transform:uppercase;
}

/* Scroll cue */
.scroll-cue{
  position:absolute;bottom:28px;left:50%;
  transform:translateX(-50%);z-index:2;
}
.scroll-line{
  width:1px;height:52px;
  background:linear-gradient(to bottom,var(--amber),transparent);
  animation:scrollFade 2.4s ease-in-out infinite;
}

/* ─── STATS STRIP ─── */
.stats-strip{
  background:var(--nordic);
  border-top:1px solid rgba(255,255,255,.04);
  border-bottom:1px solid rgba(255,255,255,.04);
  padding:clamp(32px,5vw,56px) var(--pad);
}
.stats-inner{
  max-width:var(--max);margin:0 auto;
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;
  align-items:center;
  gap:0;
}
.stat{
  display:flex;flex-direction:column;align-items:center;
  padding:0 clamp(16px,3vw,40px);
  text-align:center;
  gap:8px;
}
.stat-num{
  font-family:var(--ff-display);
  font-size:clamp(2.5rem,5vw,4rem);
  font-weight:700;line-height:1;
  color:var(--amber);
}
.stat-num small{font-size:.55em;color:rgba(245,161,30,.7)}
.stat-label{
  font-size:.75rem;font-weight:500;
  letter-spacing:.08em;text-transform:uppercase;
  color:rgba(250,240,220,.5);
}
.stat-sep{
  width:1px;height:56px;
  background:rgba(255,255,255,.08);
  flex-shrink:0;
}

/* ─── PRODUCTS ─── */
.products{
  background:var(--bg-2);
  padding:clamp(72px,10vw,140px) var(--pad);
}
.products-inner{
  max-width:var(--max);margin:0 auto;
}
.products-header{
  text-align:center;
  margin-bottom:clamp(40px,6vw,72px);
}
.section-h2{
  font-family:var(--ff-display);
  font-size:clamp(1.875rem,4vw,3.5rem);
  font-weight:700;line-height:1.1;
  color:var(--text);
}
.section-h2 em{color:var(--amber);font-style:italic}
.section-sub{
  font-size:.875rem;color:var(--text-3);
  margin-top:8px;
}

/* Cards */
.cards-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-bottom:40px;
}
.card{
  position:relative;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--r-lg);
  padding:32px 28px 28px;
  display:flex;flex-direction:column;
  transition:transform .35s var(--ease),
             border-color .35s,
             box-shadow .35s;
  text-decoration:none;color:inherit;
}
.card:hover{
  transform:translateY(-8px);
  border-color:var(--amber-border);
  box-shadow:0 24px 60px rgba(245,161,30,.12),
             0 0 0 1px var(--amber-border);
}
.card.featured{
  background:linear-gradient(145deg,#1A2F3F 0%,#0E1E2B 100%);
  border-color:rgba(245,161,30,.4);
  box-shadow:0 0 0 1px rgba(245,161,30,.25),
             0 20px 60px rgba(0,0,0,.4);
}
.card.featured:hover{
  border-color:var(--amber);
  box-shadow:0 24px 60px rgba(245,161,30,.2),
             0 0 0 1px var(--amber);
}

.card-badge{
  position:absolute;top:-1px;right:20px;
  background:var(--amber);
  color:#fff;
  font-size:.6rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;
  padding:5px 12px;
  border-radius:0 0 var(--r-sm) var(--r-sm);
  line-height:1.3;text-align:center;
}
.card-num{
  font-family:var(--ff-display);
  font-size:4.5rem;font-weight:700;line-height:1;
  color:rgba(255,255,255,.04);
  margin-bottom:-16px;
  user-select:none;
}
.card-img-wrap{
  height:180px;display:flex;
  align-items:center;justify-content:center;
  margin-bottom:20px;
}
.card-img-wrap img{
  height:160px;width:auto;
  object-fit:contain;
  transition:transform .4s var(--ease);
  filter:drop-shadow(0 12px 24px rgba(0,0,0,.3));
}
.card:hover .card-img-wrap img{transform:translateY(-6px) scale(1.04)}

.card-name{
  font-family:var(--ff-display);
  font-size:1.625rem;font-weight:700;
  color:var(--text);margin-bottom:2px;
}
.card-tagline{
  font-size:.8125rem;color:var(--text-3);
  margin-bottom:16px;
}

/* ★ DAILY PRICE — the conversion engine ★ */
.card-daily{
  display:flex;align-items:baseline;gap:6px;
  margin-bottom:4px;
}
.card-daily-num{
  font-family:var(--ff-display);
  font-size:clamp(2rem,3.5vw,2.75rem);
  font-weight:700;line-height:1;
  color:var(--amber);
}
.card-daily-unit{
  font-size:.875rem;font-weight:400;
  color:var(--text-2);
}
.card-units{
  font-size:.75rem;color:var(--text-3);
  margin-bottom:6px;
}
.card-full-price{
  font-size:.8125rem;
  color:var(--text-2);
  padding:6px 12px;
  background:rgba(255,255,255,.04);
  border-radius:var(--r-sm);
  display:inline-block;
  margin-bottom:20px;
}

.card-benefits{
  display:flex;flex-direction:column;
  gap:8px;margin-bottom:24px;flex:1;
}
.card-benefits li{
  display:flex;align-items:flex-start;gap:8px;
  font-size:.8125rem;color:var(--text-2);line-height:1.4;
}
.card-benefits li::before{
  content:'✓';
  color:var(--amber);font-weight:700;
  flex-shrink:0;margin-top:1px;
}
.card.featured .card-benefits li{color:rgba(250,240,220,.7)}

.card-cta{
  display:flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 20px;
  background:var(--amber);
  color:#fff;
  font-size:.775rem;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  border-radius:var(--r-full);
  transition:background .2s,transform .15s;
}
.card-cta:hover{background:var(--amber-hot)}

/* Voucher note */
.voucher-note{
  text-align:center;
  font-size:.8125rem;color:var(--text-3);
  margin-bottom:32px;
}
.voucher-note strong{color:var(--amber)}

/* Payment row */
.payment-row{
  display:flex;flex-direction:column;
  align-items:center;gap:16px;
  padding-top:32px;
  border-top:1px solid var(--border);
}
.payment-label{
  font-size:.65rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--text-3);
}
.payment-logos{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center;
}
.payment-logos img{
  height:22px;width:auto;
  opacity:.4;filter:grayscale(.5) brightness(1.5);
  transition:opacity .2s,filter .2s;
}
.payment-logos img:hover{opacity:.9;filter:none}

/* ─── ORIGIN ─── */
.origin{
  background:var(--bg-3);
  padding:clamp(72px,10vw,140px) var(--pad);
  border-top:1px solid var(--border);
}
.origin-inner{
  max-width:var(--max);margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(40px,6vw,100px);
  align-items:center;
}
.origin-text{display:flex;flex-direction:column}
.origin-body{
  font-size:clamp(.9375rem,1.5vw,1.0625rem);
  line-height:1.75;color:var(--text-2);
  margin:20px 0 28px;
  max-width:480px;
}
.origin-facts{
  display:flex;flex-direction:column;gap:12px;
}
.origin-facts li{
  display:flex;align-items:center;gap:12px;
  font-size:.875rem;color:var(--text-2);
}
.fact-dot{
  width:6px;height:6px;
  background:var(--amber);border-radius:50%;
  flex-shrink:0;
}

/* YouTube */
.origin-video{}
.yt-facade{
  position:relative;
  border-radius:var(--r-xl);
  overflow:hidden;
  cursor:pointer;
  aspect-ratio:16/9;
  display:block;
}
.yt-thumb{
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .5s var(--ease);
}
.yt-facade:hover .yt-thumb{transform:scale(1.04)}
.yt-overlay{
  position:absolute;inset:0;
  background:rgba(0,0,0,.3);
  transition:background .3s;
}
.yt-facade:hover .yt-overlay{background:rgba(0,0,0,.15)}
.yt-play-btn{
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  transition:transform .3s var(--ease);
  filter:drop-shadow(0 4px 20px rgba(0,0,0,.5));
}
.yt-facade:hover .yt-play-btn{transform:translate(-50%,-50%) scale(1.1)}

/* ─── FINAL CTA ─── */
.final-cta{
  position:relative;
  background:var(--bg);
  padding:clamp(80px,12vw,160px) var(--pad);
  overflow:hidden;
  border-top:1px solid var(--border);
}
.final-glow{
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  filter:blur(100px);
}
.final-glow.g1{
  width:600px;height:600px;
  background:radial-gradient(circle,rgba(245,161,30,.2) 0%,transparent 70%);
  left:-100px;top:-100px;
  animation:glowPulse 7s ease-in-out infinite;
}
.final-glow.g2{
  width:400px;height:400px;
  background:radial-gradient(circle,rgba(255,122,0,.15) 0%,transparent 70%);
  right:10%;bottom:0;
  animation:glowPulse 9s ease-in-out 1.5s infinite;
}
.final-inner{
  position:relative;z-index:1;
  max-width:var(--max);margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:clamp(40px,6vw,100px);
}
.final-text{display:flex;flex-direction:column;gap:0}
.final-h2{
  font-family:var(--ff-display);
  font-size:clamp(2.5rem,6vw,5.5rem);
  font-weight:700;line-height:1.05;
  color:var(--text);
  margin-bottom:20px;
}
.final-h2 em{color:var(--amber);font-style:normal}
.final-sub{
  font-size:clamp(.9375rem,1.5vw,1.125rem);
  color:var(--text-2);margin-bottom:36px;
}
.final-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.final-bottle{
  display:flex;justify-content:flex-end;
  padding-right:clamp(0px,4vw,60px);
}
.final-bottle img{
  width:clamp(220px,35vw,400px);
  height:auto;object-fit:contain;
  filter:drop-shadow(0 40px 80px rgba(245,161,30,.2));
}
.light{color:var(--text)}

/* ─── FOOTER ─── */
.footer{
  background:var(--nordic);
  padding:clamp(48px,6vw,80px) var(--pad) 32px;
  border-top:1px solid rgba(255,255,255,.04);
}
.footer-inner{
  max-width:var(--max);margin:0 auto;
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:clamp(24px,4vw,80px);
  align-items:start;
}
.footer-brand{display:flex;flex-direction:column;gap:10px}
.footer-tag{
  font-size:.8125rem;color:rgba(250,240,220,.4);
  line-height:1.5;
}
.footer-links{
  display:flex;flex-direction:column;gap:10px;
  padding-top:2px;
}
.footer-links a{
  font-size:.8125rem;color:rgba(250,240,220,.5);
  transition:color .2s;
}
.footer-links a:hover{color:var(--amber)}
.footer-legal-wrap{
  display:flex;flex-direction:column;gap:8px;
  padding-top:2px;
}
.footer-legal{font-size:.75rem;color:rgba(250,240,220,.3)}
.footer-agency{font-size:.75rem;color:rgba(250,240,220,.25);font-style:italic}