

:root {
  /* ── Color ── */
  --ink:            #0D1B2A;
  --ink-800:        #13233A;
  --ink-mid:        #1A2F4A;
  --ink-600:        #2C4F7C;
  --crimson:        #C8102E;
  --crimson-600:    #A00D28;
  --crimson-lt:     #E63946;
  --gold:           #C9963A;
  --gold-lt:        #E8A87C;
  --teal:           #2A9D8F;
  --teal-600:       #1D5F58;
  --warm:           #FDF6F0;
  --cream:          #F8F5F0;
  --surface:        #FAFAF8;
  --white:          #FFFFFF;
  --text:           #1A1A2E;
  --muted:          #667085;
  --muted-lt:       #8A93A6;
  --border:         rgba(26,47,74,.09);
  --border-strong:  rgba(26,47,74,.16);

  /* ── Elevation ── */
  --shadow-xs:  0 1px 2px rgba(13,27,42,.05);
  --shadow-sm:  0 2px 8px rgba(13,27,42,.06);
  --shadow-md:  0 8px 28px rgba(13,27,42,.08);
  --shadow-lg:  0 16px 48px rgba(13,27,42,.12);
  --shadow-xl:  0 28px 80px rgba(13,27,42,.18);
  --shadow-glow-crimson: 0 10px 32px rgba(200,16,46,.24);

  /* ── Radius scale ── */
  --r-sm:  10px;
  --r:     18px;
  --r-lg:  28px;
  --r-pill: 999px;

  /* ── Spacing scale ── */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 20px;  --sp-6: 24px;  --sp-8: 32px;  --sp-10: 40px;
  --sp-12: 48px; --sp-16: 64px; --sp-20: 80px; --sp-24: 96px;

  /* ── Motion ── */
  --ease:      cubic-bezier(.16,1,.3,1);
  --ease-out:  cubic-bezier(.22,1,.36,1);
  --dur-fast:  .2s;
  --dur:       .35s;
  --dur-slow:  .6s;

  /* ── Type ── */
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'DM Sans', system-ui, -apple-system, sans-serif;
  --font-mono:    'Space Mono', 'SF Mono', monospace;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

body {
  font-family: var(--font-body);
  color: var(--text);
  background: var(--surface);
  overflow-x: hidden;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a { color: inherit; }
img { max-width:100%; display:block; }

::selection { background: rgba(200,16,46,.16); color: var(--ink); }

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

/* ── Layout ── */
.container { max-width:1240px; margin:0 auto; padding:0 20px; }
.section    { padding: var(--sp-24) 0; }

/* ── Typography ── */
.label {
  display:inline-flex; align-items:center; gap:6px;
  font-family: var(--font-mono);
  font-size:.68rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--crimson);
  background:rgba(200,16,46,.07);
  border: 1px solid rgba(200,16,46,.12);
  padding:6px 14px; border-radius:var(--r-pill);
  margin-bottom: var(--sp-4);
}
.label--light { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.14); color:var(--gold); }
.label--teal  { background:rgba(42,157,143,.1); border-color:rgba(42,157,143,.2); color:var(--teal); }

.h2 {
  font-family: var(--font-display);
  font-size: clamp(2.1rem, 4.2vw, 3.25rem);
  font-weight:700; line-height:1.14; letter-spacing:-.01em;
  color:var(--ink-mid);
  margin-bottom: var(--sp-4);
}
.h2 em { font-style:italic; color:var(--crimson); }
.h2--white { color:#fff; }

.desc {
  font-size:1.05rem; color:var(--muted);
  max-width:620px; line-height:1.85;
}
.desc--white { color:rgba(255,255,255,.66); }
.desc--center { margin:0 auto; text-align:center; }

.section-header { text-align:center; margin-bottom: var(--sp-4); }

/* ── Buttons ── */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 28px; font-size:.9375rem; font-weight:600;
  font-family: var(--font-body);
  border-radius: var(--r-sm); text-decoration:none; cursor:pointer;
  border:none; transition: transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease), background var(--dur-fast) ease, color var(--dur-fast) ease;
  position:relative; overflow:hidden; white-space:nowrap;
}
.btn-primary {
  background: linear-gradient(135deg, var(--ink-mid), var(--crimson-lt));
  color:#fff;
  box-shadow: var(--shadow-glow-crimson);
}
.btn-primary:hover { transform:translateY(-2px); box-shadow: 0 14px 40px rgba(200,16,46,.34); }
.btn-ghost {
  background:transparent; color:var(--ink-mid);
  border:1.5px solid var(--border-strong);
}
.btn-ghost:hover { border-color: var(--ink-mid); background:var(--ink-mid); color:#fff; transform:translateY(-2px); }
.btn-white { background:#fff; color:var(--ink-mid); box-shadow:var(--shadow-md); }
.btn-white:hover { transform:translateY(-2px); box-shadow:var(--shadow-lg); color:var(--crimson); }
.btn-glass {
  background:rgba(255,255,255,.07); backdrop-filter:blur(10px);
  color:rgba(255,255,255,.9); border:1px solid rgba(255,255,255,.14);
}
.btn-glass:hover { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.24); transform:translateY(-2px); }
.btn-lg { padding:10px 25px; font-size:1rem; border-radius:var(--r-sm); }

/* ── Scroll reveal ── */
.reveal {
  opacity:0; transform:translateY(24px);
  transition: opacity var(--dur-slow) var(--ease), transform var(--dur-slow) var(--ease);
}
.reveal.visible { opacity:1; transform:none; }

/* ═══════════════════════════════════════════
   HERO
═══════════════════════════════════════════ */
.hero {
  min-height:90vh;
  display:grid;
  grid-template-columns:1.08fr 1fr;
  align-items:center;
  gap: var(--sp-16);
  padding: 116px 0 var(--sp-16);
  position: relative;
}
.hero::before {
  content:'';
  position:absolute; top:-10%; right:-10%;
  width:520px; height:520px; border-radius:50%;
  background: radial-gradient(circle, rgba(200,16,46,.06) 0%, transparent 70%);
  pointer-events:none; z-index:-1;
}

.hero-content { padding-left:4px; }

.hero-eyebrow {
  display:inline-flex; align-items:center; gap:10px;
  font-family: var(--font-mono);
  font-size:.72rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase;
  color:var(--gold);
  margin-bottom: var(--sp-5);
  animation: fadeUp .8s var(--ease) .1s both;
}
.hero-eyebrow::before {
  content:''; display:inline-block;
  width:26px; height:2px;
  background:var(--gold); border-radius:2px;
}

.hero h1 {
  font-family: var(--font-display);
  font-size: clamp(2.7rem, 5.2vw, 4.2rem);
  font-weight:700; line-height:1.08; letter-spacing:-.015em;
  color:var(--ink-mid);
  margin-bottom: var(--sp-5);
  animation: fadeUp .9s var(--ease) .2s both;
}
.hero h1 em { font-style:italic; color:var(--crimson); }

/* ── Live typing demo strip ── */
.hero-demo {
  background: var(--warm);
  border:1px solid rgba(200,16,46,.14);
  border-radius: var(--r-sm);
  padding: 20px 24px;
  margin-bottom: var(--sp-6);
  animation: fadeUp .9s var(--ease) .3s both;
  min-height:76px;
}
.hero-demo-label {
  font-size:.68rem; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase;
  color:var(--teal); margin-bottom: var(--sp-2);
}
.hero-demo-text {
  font-family: var(--font-display);
  font-size:1.1rem; color:var(--ink-mid);
  line-height:1.6; font-style:italic;
}
.cursor { display:inline-block; width:2px; height:1.1em; background:var(--crimson); vertical-align:text-bottom; animation:blink 1s step-end infinite; margin-left:1px; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0} }

.hero-desc {
  font-size:1.05rem; color:var(--muted);
  line-height:1.85; margin-bottom: var(--sp-8);
  max-width:500px;
  animation: fadeUp .9s var(--ease) .4s both;
}

.hero-actions {
  display:flex; gap: var(--sp-3); flex-wrap:wrap;
  animation: fadeUp .9s var(--ease) .52s both;
}

.hero-trust {
  display:flex; align-items:center; flex-wrap:wrap;
  margin-top: var(--sp-6);
  font-size:.83rem; color:var(--muted);
  animation: fadeUp .9s var(--ease) .65s both;
}
.hero-trust-item { display:flex; align-items:center; gap:6px; padding:0 var(--sp-4); }
.hero-trust-item:first-child { padding-left:0; }
.hero-trust-item + .hero-trust-item { border-left:1px solid var(--border); }
.trust-dot { width:7px; height:7px; border-radius:50%; background:var(--teal); flex-shrink:0; }

/* ── Hero visual grid ── */
.hero-visual {
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:auto auto;
  gap: var(--sp-3);
  animation: fadeIn 1.1s var(--ease) .3s both;
}

.card-preview {
  border-radius: var(--r);
  padding: 26px 24px;
  display:flex; flex-direction:column; gap:8px;
  text-decoration:none;
  position:relative; overflow:hidden;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) ease;
  will-change:transform;
}
.card-preview::after {
  content:''; position:absolute; inset:0;
  background: linear-gradient(160deg, rgba(255,255,255,.1), transparent 55%);
  pointer-events:none;
}
.card-preview:hover { transform:translateY(-6px) scale(1.01); box-shadow:var(--shadow-xl); }
.card-preview:focus-visible { outline:3px solid var(--gold); outline-offset:3px; }

.card-preview.birthday    { background: linear-gradient(135deg,var(--ink-mid),var(--ink-600)); }
.card-preview.anniversary { background: linear-gradient(135deg,var(--crimson),#9B0E24); }
.card-preview.holi        { background: linear-gradient(135deg,var(--teal),#1A7A6E); }
.card-preview.valentine   { background: linear-gradient(135deg,#B5622A,var(--gold-lt)); }

.card-badge {
  position:absolute; top:14px; right:14px;
  background:rgba(255,255,255,.16); backdrop-filter:blur(8px);
  border-radius: var(--r-pill); padding:3px 11px;
  font-size:.66rem; font-weight:600; letter-spacing:.02em; color:rgba(255,255,255,.92);
}
.card-emoji { font-size:1.9rem; }
.card-lbl { font-size:.66rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.5); }
.card-ttl { font-family: var(--font-display); font-size:1.22rem; font-weight:700; color:#fff; line-height:1.22; }
.card-hint { margin-top:auto; font-size:.74rem; color:rgba(255,255,255,.55); }
.card-hint::before { content:'→ '; }

/* ═══════════════════════════════════════════
   AEO ANSWER BLOCK
═══════════════════════════════════════════ */
.aeo-block {
  background: linear-gradient(135deg, rgba(42,157,143,.05), rgba(200,16,46,.04));
  border:1px solid rgba(42,157,143,.16);
  border-radius: var(--r);
  padding: var(--sp-10) 44px;
  max-width:880px; margin:0 auto;
}
.aeo-block h2 {
  font-family: var(--font-display);
  font-size: clamp(1.35rem, 2.6vw, 1.7rem);
  font-weight:700; color:var(--ink-mid);
  margin-bottom: var(--sp-3); line-height:1.32;
}
.aeo-block p { font-size:.97rem; color:var(--muted); line-height:1.85; margin-bottom: var(--sp-3); }
.aeo-block p:last-child { margin-bottom:0; }
.aeo-block a { color:var(--crimson); text-decoration:underline; text-underline-offset:2px; }

/* ═══════════════════════════════════════════
   MARQUEE BAND
═══════════════════════════════════════════ */
.occasions-band { background:var(--ink); padding: var(--sp-5) 0; overflow:hidden; }
.occasions-track { display:flex; animation: marquee 32s linear infinite; white-space:nowrap; }
@media (prefers-reduced-motion:reduce) { .occasions-track { animation:none; } }
.occasions-track:hover { animation-play-state:paused; }
.occ-item {
  display:inline-flex; align-items:center; gap:9px;
  padding:0 var(--sp-8);
  font-family: var(--font-mono); font-size:.75rem;
  font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(255,255,255,.48);
  border-right:1px solid rgba(255,255,255,.08);
  text-decoration:none; transition: color var(--dur-fast) ease;
}
.occ-item:hover { color:var(--gold); }
.occ-item span { font-size:1.1rem; }
@keyframes marquee { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ═══════════════════════════════════════════
   FEATURES
═══════════════════════════════════════════ */
.features-bg { background:var(--warm); }

.features-grid { display:grid; grid-template-columns:repeat(3,1fr); gap: var(--sp-5); margin-top: var(--sp-12); }
.feature-card {
  background:var(--white);
  border-radius: var(--r); padding: var(--sp-8) var(--sp-6);
  border:1px solid var(--border);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) ease, border-color var(--dur-fast) ease;
  position:relative; overflow:hidden;
}
.feature-card::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:3px;
  background: linear-gradient(90deg, var(--crimson), var(--gold));
  transform:scaleX(0); transform-origin:left;
  transition: transform .45s var(--ease);
}
.feature-card:hover::after { transform:scaleX(1); }
.feature-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:transparent; }
.feature-icon {
  width:52px; height:52px; border-radius: var(--r-sm);
  background: linear-gradient(135deg, rgba(200,16,46,.08), rgba(232,168,124,.14));
  display:flex; align-items:center; justify-content:center; font-size:1.55rem; margin-bottom: var(--sp-5);
}
.feature-card h3 { font-family: var(--font-display); font-size:1.3rem; font-weight:700; color:var(--ink-mid); margin-bottom: var(--sp-2); }
.feature-card p { font-size:.9375rem; color:var(--muted); line-height:1.75; }
.feature-card a { color:var(--crimson); font-weight:600; }

/* ═══════════════════════════════════════════
   HOW IT WORKS
═══════════════════════════════════════════ */
.how-grid { display:grid; grid-template-columns:repeat(3,1fr); gap: var(--sp-10); margin-top: var(--sp-12); position:relative; }
.how-grid::before {
  content:''; position:absolute; top:35px;
  left:calc(16.6% + 20px); right:calc(16.6% + 20px); height:1px;
  background: linear-gradient(90deg, transparent, rgba(200,16,46,.25), transparent);
}
.step-card { text-align:center; }
.step-num {
  width:68px; height:68px; border-radius:50%;
  background: var(--ink-mid); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-family: var(--font-display); font-size:1.7rem; font-weight:700;
  margin:0 auto var(--sp-5);
  box-shadow: 0 10px 26px rgba(26,47,74,.28);
  position:relative; z-index:1;
}
.step-card h3 { font-family: var(--font-display); font-size:1.32rem; font-weight:700; color:var(--ink-mid); margin-bottom: var(--sp-2); }
.step-card p  { font-size:.9375rem; color:var(--muted); line-height:1.75; }
.step-card a  { color:var(--crimson); font-weight:600; }
.step-tag { display:inline-block; margin-top: var(--sp-3); font-size:.72rem; font-weight:600; padding:5px 13px; border-radius:var(--r-pill); background:rgba(42,157,143,.1); color:var(--teal); }

/* ═══════════════════════════════════════════
   OCCASIONS SHOWCASE
═══════════════════════════════════════════ */
.occasions-grid { display:grid; grid-template-columns:repeat(2,1fr); gap: var(--sp-5); margin-top: var(--sp-12); }
.occ-card {
  border-radius: var(--r-lg); padding: var(--sp-10) var(--sp-8);
  display:flex; justify-content:space-between; align-items:flex-end;
  min-height:212px; position:relative; overflow:hidden;
  text-decoration:none;
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) ease;
}
.occ-card:hover { transform:translateY(-6px) scale(1.008); box-shadow:var(--shadow-xl); }
.occ-card:focus-visible { outline:3px solid var(--gold); outline-offset:3px; }
.occ-card.birthday    { background: linear-gradient(135deg,var(--ink-mid),var(--ink-600)); }
.occ-card.anniversary { background: linear-gradient(135deg,#7B1632,var(--crimson)); }
.occ-card.holi        { background: linear-gradient(135deg,var(--teal-600),var(--teal)); }
.occ-card.valentine   { background: linear-gradient(135deg,#B5622A,var(--gold-lt)); }

.occ-card-content { position:relative; z-index:1; }
.occ-card-sublbl { font-family: var(--font-mono); font-size:.68rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.5); margin-bottom: var(--sp-2); }
.occ-card h3 { font-family: var(--font-display); font-size: clamp(1.5rem,2.6vw,2.05rem); font-weight:700; color:#fff; line-height:1.15; margin-bottom: var(--sp-3); }
.occ-card-desc { font-size:.88rem; color:rgba(255,255,255,.66); max-width:270px; line-height:1.65; }
.occ-card-cta {
  display:inline-flex; align-items:center; gap:7px; margin-top: var(--sp-4);
  padding:8px 15px; background:rgba(255,255,255,.12); backdrop-filter:blur(8px);
  border-radius: var(--r-sm); font-size:.85rem; font-weight:600; color:#fff;
  transition: background var(--dur-fast) ease; border:1px solid rgba(255,255,255,.18);
}
.occ-card:hover .occ-card-cta { background:rgba(255,255,255,.22); }
.occ-card-emoji { font-size: clamp(3.4rem,6.6vw,5.6rem); position:absolute; right:28px; top:20px; opacity:.85; filter: drop-shadow(0 8px 16px rgba(0,0,0,.2)); transition: transform var(--dur) var(--ease); z-index:1; }
.occ-card:hover .occ-card-emoji { transform:scale(1.08) rotate(-4deg); }

/* ── Festival pills ── */
.festivals-grid { display:grid; grid-template-columns:repeat(4,1fr); gap: var(--sp-3); margin-top: var(--sp-8); }
.f-pill { background:var(--white); border:1px solid var(--border); border-radius: var(--r-sm); padding: var(--sp-4) var(--sp-3); text-align:center; transition: transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) ease, border-color var(--dur-fast) ease; text-decoration:none; display:block; }
.f-pill:hover { transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:transparent; }
.f-pill .emoji { font-size:1.8rem; display:block; margin-bottom: var(--sp-2); }
.f-pill .name  { font-size:.84rem; font-weight:600; color:var(--crimson); }

/* ═══════════════════════════════════════════
   WHY BELOVEDTEXT
═══════════════════════════════════════════ */
.why-bg { background: var(--ink); }
.why-inner { display:grid; grid-template-columns:1.1fr 1fr; gap: var(--sp-20); align-items:center; }
.why-cards { display:flex; flex-direction:column; gap: var(--sp-3); }
.why-card {
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.09);
  border-radius: var(--r-sm); padding: var(--sp-5);
  display:flex; gap: var(--sp-4); align-items:flex-start;
  transition: background var(--dur-fast) ease, transform var(--dur-fast) var(--ease), border-color var(--dur-fast) ease;
}
.why-card:hover { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.16); transform:translateX(4px); }
.why-card-icon { font-size:1.35rem; flex-shrink:0; margin-top:2px; }
.why-card h4 { font-family: var(--font-display); font-size:1.1rem; font-weight:700; color:#fff; margin-bottom:4px; }
.why-card p  { font-size:.87rem; color:rgba(255,255,255,.6); line-height:1.7; }
.why-card a  { color:var(--gold); font-weight:600; }

/* ═══════════════════════════════════════════
   GEO STRIP
═══════════════════════════════════════════ */
.geo-strip { background:var(--warm); padding: var(--sp-16) 0; }
.geo-grid { display:grid; grid-template-columns:repeat(4,1fr); gap: var(--sp-4); margin-top: var(--sp-8); }
.geo-card {
  background:var(--white); border:1px solid var(--border);
  border-radius: var(--r-sm); padding: var(--sp-5);
  transition: transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) ease, border-color var(--dur-fast) ease;
}
.geo-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:transparent; }
.geo-flag { display:block; margin-bottom: var(--sp-3); line-height:0; }
.geo-country { font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:4px; }
.geo-card h4 { font-size:.95rem; font-weight:600; color:var(--ink-mid); margin-bottom:6px; line-height:1.4; }
.geo-card p { font-size:.82rem; color:var(--muted); line-height:1.65; }
.geo-card p a { color:var(--crimson); text-decoration:none; font-weight:600; }
.geo-card p a:hover { text-decoration:underline; }

/* ═══════════════════════════════════════════
   TIPS
═══════════════════════════════════════════ */
.tips-grid { display:grid; grid-template-columns:repeat(2,1fr); gap: var(--sp-4); margin-top: var(--sp-12); }
.tip-card {
  background:var(--white); border-radius: var(--r-sm); padding: var(--sp-6) var(--sp-5);
  border:1px solid var(--border); display:flex; gap: var(--sp-4); align-items:flex-start;
  transition: transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) ease;
}
.tip-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-md); }
.tip-num {
  width:34px; height:34px; border-radius:9px;
  background: linear-gradient(135deg, var(--crimson), var(--crimson-lt));
  color:#fff; font-family: var(--font-mono); font-weight:700; font-size:.75rem;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.tip-card h4 { font-size:.96rem; font-weight:600; color:var(--ink-mid); margin-bottom:5px; }
.tip-card p  { font-size:.875rem; color:var(--muted); line-height:1.7; }

/* ═══════════════════════════════════════════
   TESTIMONIALS
═══════════════════════════════════════════ */
.testimonials-bg { background:var(--warm); }
.testimonials-note {
  text-align:center; font-size:.82rem; color:var(--muted-lt);
  max-width:560px; margin: 10px auto 0;
}
.testimonials-grid { display:grid; grid-template-columns:repeat(3,1fr); gap: var(--sp-5); margin-top: var(--sp-12); }
.t-card {
  background:var(--white); border-radius: var(--r); padding: var(--sp-8) var(--sp-6);
  border:1px solid var(--border);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) ease;
}
.t-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.t-stars { font-size:.95rem; color:var(--gold); margin-bottom: var(--sp-3); letter-spacing:2px; }
.t-text {
  font-family: var(--font-display); font-size:1.14rem;
  font-style:italic; color:var(--ink-mid); line-height:1.65; margin-bottom: var(--sp-5);
}
.t-author { display:flex; align-items:center; gap:11px; }
.t-avatar {
  width:38px; height:38px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:.85rem; color:#fff; flex-shrink:0;
}
.av1 { background: linear-gradient(135deg,var(--crimson),var(--gold-lt)); }
.av2 { background: linear-gradient(135deg,var(--ink-mid),var(--teal)); }
.av3 { background: linear-gradient(135deg,var(--teal),var(--gold)); }
.av4 { background: linear-gradient(135deg,var(--gold),var(--crimson)); }
.av5 { background: linear-gradient(135deg,#7B1632,var(--crimson)); }
.av6 { background: linear-gradient(135deg,var(--ink-mid),var(--muted)); }
.t-name     { font-size:.88rem; font-weight:600; color:var(--ink-mid); }
.t-location { font-size:.78rem; color:var(--muted); }

/* ═══════════════════════════════════════════
   CREDITS / PRICING
═══════════════════════════════════════════ */
.credits-bg { background: var(--cream); padding: var(--sp-20) 0; }
.credits-grid { display:grid; grid-template-columns:repeat(3,1fr); gap: var(--sp-6); margin-top: var(--sp-10); }
.credit-card {
  background:var(--white); border-radius: var(--r); padding: var(--sp-8) var(--sp-6);
  text-align:center; border:1px solid var(--border);
  transition: transform var(--dur-fast) ease, box-shadow var(--dur-fast) ease;
}
.credit-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.credit-icon  { font-size:2.6rem; display:block; margin-bottom: var(--sp-3); }
.credit-card h4 { font-size:1.1rem; font-weight:700; color:var(--ink-mid); margin-bottom: var(--sp-2); }
.credit-amount { font-size:2.15rem; font-weight:800; color:var(--crimson); margin: var(--sp-2) 0; line-height:1; }
.credit-amount span { font-size:.95rem; font-weight:500; color:var(--muted); }
.credit-card p { font-size:.9rem; color:var(--muted); line-height:1.7; }

.pay-row { display:flex; justify-content:center; gap: var(--sp-8); margin-top: var(--sp-10); flex-wrap:wrap; }
.pay-item { display:flex; align-items:center; gap: 10px; background:var(--white); border-radius: var(--r-sm); padding: var(--sp-2) var(--sp-4); border:1px solid var(--border); font-size:.9rem; color:var(--text); }
.pay-item strong { color:var(--crimson); }

.credits-cta { display:inline-block; margin-top: var(--sp-10); padding:12px 25px; background:var(--crimson); color:#fff; border-radius: var(--r-pill); font-weight:600; font-size:.98rem; text-decoration:none; transition: background var(--dur-fast) ease, transform var(--dur-fast) ease, box-shadow var(--dur-fast) ease; box-shadow: var(--shadow-glow-crimson); }
.credits-cta:hover { background: var(--crimson-600); transform:translateY(-2px); }

/* ═══════════════════════════════════════════
   FAQ
═══════════════════════════════════════════ */
.faq-grid { display:grid; grid-template-columns:repeat(2,1fr); gap: var(--sp-3); margin-top: var(--sp-12); }
.faq-item { background:var(--white); border:1px solid var(--border); border-radius: var(--r-sm); overflow:hidden; transition: box-shadow var(--dur-fast) ease, border-color var(--dur-fast) ease; }
.faq-item:hover { box-shadow:var(--shadow-md); }
.faq-item.active { border-color:rgba(200,16,46,.28); }
.faq-toggle {
  width:100%; padding: 19px 22px;
  background:none; border:none; cursor:pointer;
  display:flex; justify-content:space-between; align-items:center; gap: var(--sp-4);
  text-align:left; font-family: var(--font-body); font-size:.96rem;
  font-weight:600; color:var(--ink-mid); transition: background var(--dur-fast) ease;
}
.faq-toggle:hover { background:var(--warm); }
.faq-icon {
  width:26px; height:26px; border-radius:50%;
  background:rgba(200,16,46,.08); color:var(--crimson);
  display:flex; align-items:center; justify-content:center;
  font-size:1rem; font-weight:700; flex-shrink:0;
  transition: transform var(--dur-fast) ease, background var(--dur-fast) ease, color var(--dur-fast) ease;
}
.faq-item.active .faq-icon { transform:rotate(45deg); background:var(--crimson); color:#fff; }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .4s ease; }
.faq-answer-inner { padding:0 22px var(--sp-5); font-size:.9375rem; color:var(--muted); line-height:1.78; }
.faq-answer-inner a { color:var(--crimson); font-weight:600; }

/* ═══════════════════════════════════════════
   FINAL CTA
═══════════════════════════════════════════ */
.cta-wrap {
  background: linear-gradient(135deg, var(--ink) 0%, var(--ink-800) 100%);
  border-radius: var(--r-lg);
  padding: var(--sp-20) var(--sp-12);
  text-align: center;
  position: relative;
  overflow: hidden;
  margin: var(--sp-20) 0 var(--sp-24);
  border: 1px solid rgba(255,255,255,.06);
}
.cta-wrap::before {
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(ellipse at 20% 80%, rgba(200,16,46,.16) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 20%, rgba(42,157,143,.1) 0%, transparent 40%);
  pointer-events:none;
}
.cta-inner { position:relative; z-index:1; max-width:680px; margin:0 auto; }
.cta-badge {
  display:inline-block; font-size:.75rem; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase;
  color:var(--teal); background:rgba(42,157,143,.1);
  border:1px solid rgba(42,157,143,.24);
  padding:6px 16px; border-radius: var(--r-pill); margin-bottom: var(--sp-6);
}
.cta-wrap h2 {
  font-family: var(--font-display);
  font-size: clamp(2.2rem,4.6vw,3.3rem);
  font-weight:700; color:#fff; line-height:1.15;
  margin-bottom: var(--sp-4); letter-spacing:-.01em;
}
.cta-wrap p {
  font-size:1.05rem; color:rgba(255,255,255,.62);
  margin-bottom: var(--sp-10); line-height:1.7;
  max-width:520px; margin-left:auto; margin-right:auto;
}
.cta-actions {
  display:grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-3);
  max-width:480px; margin: 0 auto var(--sp-6);
}
.cta-actions .btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-size:.95rem; padding: var(--sp-2) var(--sp-4);
}
.cta-actions .btn svg { opacity:.85; flex-shrink:0; }
.cta-actions .btn-white { background:#fff; color:var(--ink); box-shadow:0 4px 20px rgba(255,255,255,.14); }
.cta-actions .btn-white:hover { transform:translateY(-2px); box-shadow:0 10px 32px rgba(255,255,255,.24); color:var(--crimson); }
.cta-actions .btn-glass { background:rgba(255,255,255,.05); color:rgba(255,255,255,.85); border:1px solid rgba(255,255,255,.1); }
.cta-actions .btn-glass:hover { background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.2); transform:translateY(-2px); }
.cta-footnote { margin-top: var(--sp-2); font-size:.82rem; color:rgba(255,255,255,.35); line-height:1.6; }
.cta-footnote a { color:rgba(255,255,255,.6); text-decoration:none; border-bottom:1px solid rgba(255,255,255,.15); transition: color var(--dur-fast) ease, border-color var(--dur-fast) ease; }
.cta-footnote a:hover { color:#fff; border-bottom-color:#fff; }
.cta-footnote-cta { display:inline-flex; align-items:center; gap:4px; margin-left:8px; color:var(--teal) !important; border-bottom-color:rgba(42,157,143,.3) !important; font-weight:500; }
.cta-footnote-cta:hover { color:#fff !important; border-bottom-color:#fff !important; }

/* ═══════════════════════════════════════════
   ANIMATIONS
═══════════════════════════════════════════ */
@keyframes fadeUp { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width:1024px) {
  .hero { grid-template-columns:1fr; gap: var(--sp-10); padding-top:96px; text-align:center; }
  .hero-content { padding-left:0; }
  .hero-desc { margin-inline:auto; }
  .hero-actions { justify-content:center; }
  .hero-trust  { justify-content:center; }
  .features-grid { grid-template-columns:repeat(2,1fr); }
  .why-inner  { grid-template-columns:1fr; gap: var(--sp-10); }
  .testimonials-grid { grid-template-columns:repeat(2,1fr); }
  .festivals-grid { grid-template-columns:repeat(3,1fr); }
  .geo-grid   { grid-template-columns:repeat(2,1fr); }
}

@media (max-width:768px) {
  .section { padding: var(--sp-16) 0; }
  .hero-visual { grid-template-columns:1fr 1fr; }
  .features-grid, .how-grid, .occasions-grid, .tips-grid, .faq-grid, .credits-grid {
    grid-template-columns:1fr;
  }
  .how-grid::before { display:none; }
  .festivals-grid { grid-template-columns:repeat(2,1fr); }
  .testimonials-grid { grid-template-columns:1fr; }
  .pay-row { flex-direction:column; align-items:center; gap: var(--sp-3); }
  .geo-grid { grid-template-columns:repeat(2,1fr); }
  .cta-wrap { padding: var(--sp-12) var(--sp-5); margin-bottom: var(--sp-16); }
  .aeo-block { padding: var(--sp-6) var(--sp-5); }
}

@media (max-width:480px) {
  .hero h1 { font-size:2.5rem; }
  .hero-visual { gap: var(--sp-2);  grid-template-columns:1fr; }
  .card-preview { padding:18px 16px; }
  .card-emoji { font-size:1.7rem; }
  .card-ttl   { font-size:1.05rem; }
  .festivals-grid { grid-template-columns:repeat(2,1fr); }
  .geo-grid { grid-template-columns:1fr; }
  .hero-trust { flex-direction:column; gap: var(--sp-2); }
  .hero-trust-item + .hero-trust-item { border-left:none; border-top:1px solid var(--border); padding-top: var(--sp-2); }
  .cta-actions { grid-template-columns:1fr; max-width:100%; }
}

@media (prefers-reduced-motion:reduce) {
  .reveal, .card-preview, .occ-card, .feature-card,
  .why-card, .t-card, .credit-card, .faq-item {
    transition:none;
  }
  .hero-content > *, .hero-visual { animation:none; opacity:1; transform:none; }
}