/* Ivory & Gold */
:root {
  --ivory: #fbf7ef;
  --paper: #fffdf8;
  --ink: #1f1b16;
  --muted: #6f655a;
  --gold: #9e7330;
  --oxblood: #8a1c2b;
  --bg: var(--ivory);
  --accent: var(--gold);
  --accent-ink: #fffdf8;
  --card: var(--paper);
  --line: rgba(184, 137, 59, .35);
  --font-display: "Bodoni Moda", Didot, Georgia, serif;
  --font-body: "Bodoni Moda", Georgia, serif;
  --font-script: "Pinyon Script", cursive;
  --font-label: "Jost", system-ui, sans-serif;
  --font-ta: "Noto Serif Tamil", serif;
  --radius: 2px;
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .55 0 0 0 0 .45 0 0 0 0 .3 0 0 0 .06 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}
body { font-size: 17px; background: var(--grain), var(--ivory); }
.sec h2 { font-weight: 400; font-style: italic; letter-spacing: -.01em; }
.sec h2 [lang="ta"] { font-style: normal; font-size: .72em; }
.eyebrow { color: var(--gold); font-weight: 400; letter-spacing: .34em; font-size: 11.5px; }

/* ---------- intro: envelope ---------- */
.ig-intro {
  background: radial-gradient(ellipse at 50% 40%, #fffdf8, #efe6d4 80%);
  display: grid; place-items: center; overflow: hidden;
  transition: opacity .9s ease 1.4s, visibility 0s linear 2.3s;
}
.ig-intro-inner { display: grid; justify-items: center; gap: 26px; padding: 24px; perspective: 1400px; }
.ig-intro-kicker { font-family: var(--font-script); font-size: clamp(40px, 8vw, 64px); color: var(--ink); line-height: 1; }
.ig-intro-kicker [lang="ta"] { font-family: var(--font-ta); font-size: .5em; }
.ig-intro-hint { font-family: var(--font-label); font-size: 12px; letter-spacing: .26em; text-transform: uppercase; color: var(--muted); }
.ig-intro-hint [lang="ta"] { font-size: 14px; letter-spacing: 0; }
.ig-lang { background: none; border: 1px solid var(--line); border-radius: 999px; padding: 8px 16px; font-size: 14px; color: var(--muted); }

.ig-envelope { position: relative; width: min(84vw, 460px); aspect-ratio: 1.45; transform-style: preserve-3d; filter: drop-shadow(0 30px 40px rgba(60, 40, 10, .25)); }
.ig-env-back, .ig-env-pocket, .ig-env-flap { position: absolute; inset: 0; }
.ig-env-back { background: #e9dcc2; border-radius: 4px; }
.ig-env-pocket {
  background: linear-gradient(160deg, #f4ead6, #e8dabd);
  clip-path: polygon(0 0, 50% 56%, 100% 0, 100% 100%, 0 100%);
  border-radius: 4px; z-index: 3;
}
.ig-env-flap {
  background: linear-gradient(180deg, #efe2c8, #e2d0ad);
  clip-path: polygon(0 0, 100% 0, 50% 60%);
  transform-origin: top center; z-index: 4;
  transition: transform .9s cubic-bezier(.6, 0, .3, 1) .2s, z-index 0s linear .65s;
}
.ig-letter {
  position: absolute; left: 6%; right: 6%; top: 6%; height: 88%; z-index: 2;
  background: var(--grain), var(--paper); border: 1px solid var(--line); outline: 1px solid var(--line); outline-offset: -8px;
  display: grid; place-content: center; text-align: center; gap: 6px;
  transition: transform 1s cubic-bezier(.3, .7, .2, 1) .8s;
}
.ig-letter-mono { font-family: var(--font-display); font-size: clamp(40px, 9vw, 58px); letter-spacing: .06em; }
.ig-letter-mono i { font-family: var(--font-script); color: var(--gold); font-style: normal; margin: 0 .12em; }
.ig-letter-line { font-family: var(--font-label); font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--muted); }
.ig-seal {
  position: absolute; left: 50%; top: 58%; z-index: 5; width: 92px; height: 92px; margin: -46px 0 0 -46px;
  border: 0; border-radius: 50%; padding: 0;
  background: radial-gradient(circle at 35% 30%, #b8323f, var(--oxblood) 55%, #5a0f19);
  box-shadow: 0 0 0 5px rgba(138, 28, 43, .55), inset 0 -6px 12px rgba(0, 0, 0, .35), inset 0 6px 10px rgba(255, 255, 255, .18), 0 10px 18px -6px rgba(90, 15, 25, .6);
  color: #f6d8b8; transition: transform .5s cubic-bezier(.5, 0, .3, 1), opacity .5s ease;
  animation: sealBreath 2.6s ease-in-out infinite;
}
.ig-seal::before { content: ""; position: absolute; inset: 9px; border-radius: 50%; border: 1.5px dashed rgba(246, 216, 184, .45); }
.ig-seal-mono { font-family: var(--font-display); font-size: 26px; letter-spacing: .04em; }
.ig-seal-mono i { font-style: normal; margin: 0 2px; opacity: .7; }
@keyframes sealBreath { 50% { transform: scale(1.05); } }

html.intro-opening .ig-seal { transform: scale(.4) rotate(-30deg); opacity: 0; animation: none; }
html.intro-opening .ig-env-flap { transform: rotateX(180deg); z-index: 1; }
html.intro-opening .ig-letter { transform: translateY(-58%); }
html.intro-opening .ig-intro-hint, html.intro-opening .ig-lang { opacity: 0; transition: opacity .3s; }
html.intro-opening .ig-intro { opacity: 0; visibility: hidden; }

/* ---------- hero ---------- */
.ig-hero { padding: clamp(18px, 4vw, 40px); min-height: 100svh; display: grid; }
.ig-frame {
  border: 1px solid var(--line); outline: 1px solid var(--line); outline-offset: -10px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  padding: clamp(56px, 10vw, 110px) clamp(18px, 5vw, 60px);
}
.ig-mono-wrap { position: relative; width: 156px; height: 156px; color: var(--gold); margin-bottom: 30px; }
.ig-laurel { position: absolute; inset: 0; width: 100%; height: 100%; }
.ig-mono { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 10px; font-family: var(--font-display); font-size: 44px; color: var(--ink); }
.ig-mono i { width: 1px; height: 46px; background: var(--gold); transform: rotate(20deg); }
.ig-lead { font-style: italic; color: var(--muted); max-width: 520px; margin: 16px auto 40px; font-size: clamp(17px, 2.2vw, 20px); }
.ig-hero .couple { gap: 4px; }
.ig-hero .name { font-size: clamp(56px, 13vw, 120px); font-weight: 400; letter-spacing: -.02em; }
.ig-hero .name [lang="ta"] { font-size: .55em; line-height: 1.6; display: inline-block; letter-spacing: 0; }
.ig-hero .parents { font-family: var(--font-label); font-style: normal; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.ig-hero .parents [lang="ta"] { font-size: 15px; letter-spacing: 0; }
.ig-hero .weds { font-size: clamp(40px, 7vw, 60px); color: var(--gold); line-height: 1.2; margin: 10px 0; }
.ig-hero .weds [lang="ta"] { font-size: .45em; }
.ig-hero-date { font-family: var(--font-label); letter-spacing: .32em; text-transform: uppercase; font-size: clamp(13px, 1.8vw, 16px); }
.ig-hero-date [lang="ta"] { letter-spacing: .02em; }
.ig-hero-venue { margin-top: 8px; font-style: italic; color: var(--muted); }

.ig-rule { display: flex; align-items: center; justify-content: center; gap: 14px; color: var(--gold); margin: 34px auto; max-width: 340px; padding: 0 var(--gutter); }
.ig-rule span { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--gold)); }
.ig-rule span:last-child { transform: scaleX(-1); }
.ig-rule svg { width: 14px; height: 14px; flex: none; }

/* ---------- date ---------- */
.scratch { --foil-1: #a07a3a; --foil-2: #efd9a4; --foil-3: #8f6a2c; --burst: #b8893b, #efd9a4, #8a1c2b, #1f1b16; background: var(--paper); border: 1px solid var(--line); box-shadow: 0 30px 60px -40px rgba(60, 40, 10, .5); }
.dcell b { font-size: clamp(46px, 11vw, 72px); }
.dcell + .dcell { border-left: 1px solid var(--line); }

/* ---------- events: programme card ---------- */
.events { gap: 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.event { padding: clamp(22px, 4vw, 34px) 0; }
.event + .event { border-top: 1px solid var(--line); }
.event-date b { font-style: italic; }
.event-date span { color: var(--gold); }
.event h3 { font-style: italic; font-weight: 400; }
.event.is-main h3::after { content: " ✦"; color: var(--gold); font-style: normal; font-size: .6em; vertical-align: middle; }
.cal-menu a { border-radius: 2px; }

/* ---------- countdown: ink panel ---------- */
.ig-ink { background: #1f1b16; color: #f5ecdc; --ink: #f5ecdc; --muted: rgba(245, 236, 220, .65); --line: rgba(184, 137, 59, .4); }
.ig-ink .sec h2 { color: #f5ecdc; }
.cd-grid { gap: 0; }
.cd-cell { border-radius: 0; }
.cd-cell + .cd-cell { border-left: 1px solid var(--line); }
.cd-cell b { font-size: clamp(42px, 10vw, 84px); color: #f1dcae; }
.ig-ink .amp { color: var(--gold); }

/* ---------- venue ---------- */
.venue { padding: 0 0 10px; }
.venue h3 { font-style: italic; }
.map { border-radius: 0; filter: grayscale(.9) sepia(.25) contrast(.95); border: 1px solid var(--line); }
.btn { border-radius: 0; }
.btn:not(.btn-wa):not(.btn-ghost) { background: var(--ink); border-color: var(--ink); color: var(--paper); }

/* ---------- note: letter ---------- */
.note { background: var(--grain), var(--paper); border: 1px solid var(--line); padding: clamp(36px, 6vw, 64px) clamp(22px, 5vw, 60px); box-shadow: 0 30px 60px -45px rgba(60, 40, 10, .55); }
.note blockquote { font-weight: 400; }
.signature { color: var(--oxblood); }
.signature [lang="ta"] { font-family: var(--font-ta); font-size: .6em; }

.foot { border-top: 1px solid var(--line); margin: 0 var(--gutter); }
.foot-names { font-style: italic; }
.foot-names .amp { color: var(--gold); }

@media (max-width: 560px) {
  .event { grid-template-columns: 1fr; text-align: center; }
  .event-date { display: flex; gap: 10px; justify-content: center; align-items: baseline; }
  .event-date b { font-size: 34px; }
}