/* =========================================================
   Narek & Nina — wedding invitation
   Parchment · burgundy · pomegranate · Ararat
   ========================================================= */
:root {
  --parchment: #f1e6d6;
  --parchment-2: #e9dac4;
  --card: #f8f1e6;
  --burgundy: #6e1a22;
  --burgundy-deep: #561319;
  --wine: #8c2430;
  --brown: #4a3226;
  --brown-soft: #7a5c48;
  --gold: #b88a52;
  --leaf: #5f6a35;
  --line: rgba(110, 26, 34, .22);

  --caps: "Cinzel", "Cormorant Garamond", Georgia, serif;
  --display: "Cormorant Garamond", Georgia, serif;
  --body: "EB Garamond", "Cormorant Garamond", Georgia, serif;
  --arm: "Noto Serif Armenian", Georgia, serif;
  --ease: cubic-bezier(.2, .65, .25, 1);

  --carpet-wide: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='52'%3E%3Crect width='96' height='52' fill='%237a1a20'/%3E%3Crect width='96' height='3' fill='%232a1512'/%3E%3Crect y='3' width='96' height='2' fill='%23e9d7bf'/%3E%3Crect y='49' width='96' height='3' fill='%232a1512'/%3E%3Crect y='47' width='96' height='2' fill='%23e9d7bf'/%3E%3Cpath d='M6 6.8L8.2 9L6 11.2L3.8 9Z' fill='%23e9d7bf'/%3E%3Cpath d='M6 40.8L8.2 43L6 45.2L3.8 43Z' fill='%23e9d7bf'/%3E%3Cpath d='M18 6.8L20.2 9L18 11.2L15.8 9Z' fill='%23e9d7bf'/%3E%3Cpath d='M18 40.8L20.2 43L18 45.2L15.8 43Z' fill='%23e9d7bf'/%3E%3Cpath d='M30 6.8L32.2 9L30 11.2L27.8 9Z' fill='%23e9d7bf'/%3E%3Cpath d='M30 40.8L32.2 43L30 45.2L27.8 43Z' fill='%23e9d7bf'/%3E%3Cpath d='M42 6.8L44.2 9L42 11.2L39.8 9Z' fill='%23e9d7bf'/%3E%3Cpath d='M42 40.8L44.2 43L42 45.2L39.8 43Z' fill='%23e9d7bf'/%3E%3Cpath d='M54 6.8L56.2 9L54 11.2L51.8 9Z' fill='%23e9d7bf'/%3E%3Cpath d='M54 40.8L56.2 43L54 45.2L51.8 43Z' fill='%23e9d7bf'/%3E%3Cpath d='M66 6.8L68.2 9L66 11.2L63.8 9Z' fill='%23e9d7bf'/%3E%3Cpath d='M66 40.8L68.2 43L66 45.2L63.8 43Z' fill='%23e9d7bf'/%3E%3Cpath d='M78 6.8L80.2 9L78 11.2L75.8 9Z' fill='%23e9d7bf'/%3E%3Cpath d='M78 40.8L80.2 43L78 45.2L75.8 43Z' fill='%23e9d7bf'/%3E%3Cpath d='M90 6.8L92.2 9L90 11.2L87.8 9Z' fill='%23e9d7bf'/%3E%3Cpath d='M90 40.8L92.2 43L90 45.2L87.8 43Z' fill='%23e9d7bf'/%3E%3Cpath d='M48 10L64 26L48 42L32 26Z' fill='%232a1512'/%3E%3Cpath d='M48 13L61 26L48 39L35 26Z' fill='%23e9d7bf'/%3E%3Cpath d='M48 16L58 26L48 36L38 26Z' fill='%23a3252c'/%3E%3Crect x='43' y='21' width='10' height='10' fill='%232a1512'/%3E%3Crect x='43' y='21' width='10' height='10' fill='%232a1512' transform='rotate(45 48 26)'/%3E%3Cpath d='M48 23L51 26L48 29L45 26Z' fill='%23e9d7bf'/%3E%3Cpath d='M0 15L11 26L0 37L-11 26Z' fill='%23c79a5c'/%3E%3Cpath d='M96 15L107 26L96 37L85 26Z' fill='%23c79a5c'/%3E%3Cpath d='M0 20L6 26L0 32L-6 26Z' fill='%232a1512'/%3E%3Cpath d='M96 20L102 26L96 32L90 26Z' fill='%232a1512'/%3E%3Cpath d='M0 23.6L2.4 26L0 28.4L-2.4 26Z' fill='%23e9d7bf'/%3E%3Cpath d='M96 23.6L98.4 26L96 28.4L93.6 26Z' fill='%23e9d7bf'/%3E%3Cpath d='M23 23L26 26L23 29L20 26Z' fill='%23e9d7bf'/%3E%3Cpath d='M73 23L76 26L73 29L70 26Z' fill='%23e9d7bf'/%3E%3Cpath d='M17 26h12M67 26h12' stroke='%232a1512' stroke-width='1.2'/%3E%3C/svg%3E");
  --carpet-thin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='12'%3E%3Crect width='24' height='12' fill='%237a1a20'/%3E%3Cpath d='M12 2L16 6L12 10L8 6Z' fill='%23e9d7bf'/%3E%3Cpath d='M12 4.4L13.6 6L12 7.6L10.4 6Z' fill='%237a1a20'/%3E%3Cpath d='M0 4L2 6L0 8L-2 6Z' fill='%23c79a5c'/%3E%3Cpath d='M24 4L26 6L24 8L22 6Z' fill='%23c79a5c'/%3E%3C/svg%3E");
  --paper-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45  0 0 0 0 .32  0 0 0 0 .2  0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
html, body { overflow-x: clip; }
body {
  margin: 0;
  color: var(--brown);
  background: var(--parchment) var(--paper-noise);
  font: 400 1.14rem/1.7 var(--body);
  -webkit-font-smoothing: antialiased;
  font-variant-numeric: lining-nums;
}
html[lang="hy"] body { font-family: var(--arm); font-size: 1rem; font-weight: 300; line-height: 1.85; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button, input { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 2px solid var(--wine); outline-offset: 3px; }
[hidden] { display: none !important; }

.shell { width: min(1100px, calc(100% - 48px)); margin-inline: auto; }
.paper { background: var(--parchment) var(--paper-noise); }

.title {
  margin: 0 0 18px;
  color: var(--burgundy);
  font: italic 500 clamp(2.1rem, 4.4vw, 3.1rem)/1.15 var(--display);
}
.title--center { text-align: center; }
html[lang="hy"] .title { font: 400 clamp(1.55rem, 3.4vw, 2.3rem)/1.35 var(--arm); }

/* Icons & ornaments */
.line-icon { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }
.ornament { display: block; width: 160px; height: 20px; margin: 0 auto; color: var(--wine); fill: none; stroke: currentColor; stroke-width: 1; }
.ornament .fill { fill: currentColor; stroke: none; }
.ornament--sm { width: 130px; margin-top: 26px; }
.pg-icon { display: block; width: 26px; height: 30px; margin: 0 auto 14px; color: var(--wine); }
.pg-icon--lg { width: 40px; height: 46px; }
.pg-crown { fill: var(--burgundy-deep); }
.pg-body { fill: currentColor; }
.pg-light { fill: #fff; opacity: .3; }
.pg-icon--light { color: #e9c6b0; margin-top: 22px; }
.pg-icon--light .pg-crown { fill: #e9c6b0; }

.carpet-thin { height: 12px; background: var(--carpet-thin) left center / 24px 12px repeat-x; }
.carpet-wide { height: 52px; background: var(--carpet-wide) center / 96px 52px repeat-x; box-shadow: 0 1px 0 rgba(0,0,0,.08), 0 -1px 0 rgba(0,0,0,.08); }

.reveal { opacity: 0; transform: translateY(20px); transition: opacity .9s ease, transform .9s var(--ease); }
.reveal.is-visible { opacity: 1; transform: none; }

/* ---------------- LANGUAGE SWITCH ---------------- */
.lang-switch {
  position: fixed; top: 14px; right: 14px; z-index: 60;
  display: flex; gap: 2px; padding: 4px;
  border: 1px solid rgba(248, 239, 226, .7); border-radius: 8px;
  background: rgba(86, 19, 25, .55);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: 0 8px 22px rgba(60, 20, 20, .18);
}
.lang-switch button {
  min-width: 42px; height: 30px; padding: 0 8px; border: 0; border-radius: 5px;
  background: transparent; color: #f6ead9; font: 500 .72rem/1 "Noto Serif Armenian", var(--body); letter-spacing: .1em;
  transition: background .2s ease, color .2s ease;
}
.lang-switch button:hover { background: rgba(255, 255, 255, .14); }
.lang-switch button[aria-pressed="true"] { background: var(--card); color: var(--burgundy); }
main { transition: opacity .18s ease; }
body.is-switching main { opacity: 0; }

/* ---------------- HERO: couple photo ---------------- */
.hero {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: 100svh; display: grid; place-items: start center;
  background: #9b8f84; color: #fbf3e7;
}
.hero__bg {
  position: absolute; inset: -2%; z-index: -2;
  background: url("assets/couple-hero.jpg") center 74% / cover no-repeat;
  filter: sepia(.22) saturate(.9) contrast(.97);
  animation: hero-zoom 18s ease-out both; will-change: transform;
}
@keyframes hero-zoom { from { transform: scale(1.1); } to { transform: scale(1); } }
.hero__veil {
  position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(86, 19, 25, .5) 0%, rgba(110, 40, 34, .22) 38%, rgba(60, 30, 20, 0) 60%, rgba(60, 30, 20, .12) 100%);
}
.hero__frame { position: absolute; inset: 18px 18px 74px; border: 1px solid rgba(251, 243, 231, .45); pointer-events: none; }
.hero__text { position: relative; z-index: 2; width: min(820px, calc(100% - 40px)); padding-top: clamp(84px, 12vh, 130px); text-align: center; }
.hero__text > * { opacity: 0; animation: rise-in 1.1s var(--ease) forwards; }
.hero__text > :nth-child(2) { animation-delay: .25s; }
.hero__text > :nth-child(3) { animation-delay: .55s; }
.hero__text > :nth-child(4) { animation-delay: .75s; }
@keyframes rise-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.hero__eyebrow { margin: 0 0 14px; font: italic 500 clamp(1.1rem, 2vw, 1.4rem)/1.3 var(--display); letter-spacing: .04em; }
html[lang="hy"] .hero__eyebrow { font: 400 .86rem/1.5 var(--arm); letter-spacing: .12em; }
.hero__names {
  margin: 0; font: 400 clamp(2.3rem, 6vw, 4.6rem)/1.1 var(--caps);
  letter-spacing: .06em; text-transform: uppercase;
  text-shadow: 0 2px 22px rgba(60, 20, 18, .35);
}
.hero__names .amp { font-family: var(--display); font-style: italic; color: #f0c9b6; }
html[lang="hy"] .hero__names { font: 400 clamp(2rem, 5.2vw, 4rem)/1.2 var(--arm); letter-spacing: .08em; }
.hero__date { margin: 12px 0 14px; font: 400 clamp(.86rem, 1.4vw, 1.12rem)/1.4 var(--caps); letter-spacing: .2em; text-transform: uppercase; text-shadow: 0 1px 12px rgba(60, 20, 18, .35); }
html[lang="hy"] .hero__date { font: 400 clamp(.74rem, 1.2vw, .95rem)/1.5 var(--arm); letter-spacing: .14em; }
.hero__date .dot { margin: 0 .3em; color: #f0c9b6; }
.ornament--light { color: #f3dccb; }
.hero__branch {
  position: absolute; z-index: 1; top: -24px; left: -14px;
  width: clamp(170px, 26vw, 420px);
  filter: drop-shadow(0 10px 16px rgba(40, 15, 10, .3));
  animation: sway 9s ease-in-out infinite alternate; transform-origin: 0 0;
}
@keyframes sway { from { transform: rotate(-1deg); } to { transform: rotate(1.2deg); } }
.hero__scroll { position: absolute; left: 50%; bottom: 96px; z-index: 3; transform: translateX(-50%); width: 24px; height: 40px; border: 1.5px solid rgba(251, 243, 231, .8); border-radius: 14px; }
.hero__scroll span { position: absolute; left: 50%; top: 8px; width: 3px; height: 8px; margin-left: -1.5px; border-radius: 2px; background: #fbf3e7; animation: scroll-dot 1.8s ease-in-out infinite; }
@keyframes scroll-dot { 0% { opacity: 0; transform: translateY(0); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(13px); } }
.hero__ridge { position: absolute; left: 0; bottom: -1px; z-index: 2; width: 100%; height: clamp(48px, 7vw, 100px); fill: var(--parchment); filter: drop-shadow(0 -3px 5px rgba(40, 15, 10, .1)); }

/* ---------------- INTRO ---------------- */
.intro { padding: clamp(40px, 6vw, 80px) 0 clamp(40px, 5vw, 70px); }
.intro__grid { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(24px, 5vw, 70px); }
.intro__copy { text-align: center; max-width: 560px; margin: 0 auto; }
.intro__copy p { margin: 0 0 14px; }
.intro__art { width: 100%; max-width: 520px; justify-self: center; }
.countdown { display: flex; justify-content: center; gap: clamp(20px, 4vw, 40px); margin-top: 22px; color: var(--burgundy); }
.countdown div { display: grid; justify-items: center; min-width: 58px; }
.countdown b { font: 400 1.9rem/1.1 var(--caps); }
.countdown small { margin-top: 4px; font: 500 .62rem/1 var(--body); letter-spacing: .22em; text-transform: uppercase; color: var(--brown-soft); }
html[lang="hy"] .countdown small { font-family: var(--arm); letter-spacing: .12em; }

/* ---------------- OUR STORY ---------------- */
.story { overflow: hidden; padding: clamp(50px, 6vw, 80px) 0 clamp(70px, 8vw, 110px); border-top: 1px solid var(--line); text-align: center; }
.story__intro { max-width: 760px; margin: 0 auto; }
.script-label { margin: 0 0 4px; color: var(--wine); font: 2.4rem/1.1 "Great Vibes", cursive; opacity: .85; }
.story .title { margin-bottom: 10px; }
.story__text { margin: 0 auto; max-width: 600px; color: var(--brown-soft); }
.photo-stack { position: relative; width: min(690px, 100%); height: 590px; margin: 46px auto 0; }
.photo-stack.reveal { transform: none; }
.photo-stack__back {
  position: absolute; left: 8%; top: 8%; width: 48%; height: 76%;
  background: #e2cbb2; box-shadow: 0 16px 38px rgba(74, 50, 38, .10);
  transform: rotate(-8deg); transition: transform 1.2s var(--ease);
}
.photo-stack:not(.is-visible) .photo-stack__back { transform: rotate(0); }
.polaroid {
  position: absolute; margin: 0; width: 47%; padding: 12px 12px 46px;
  background: #fcf8f1; box-shadow: 0 22px 55px rgba(74, 40, 30, .2);
  opacity: 0; transition: transform 1.1s var(--ease), opacity 1s ease;
}
.polaroid img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; filter: sepia(.1); }
.polaroid figcaption { position: absolute; left: 10px; right: 10px; bottom: 10px; color: var(--burgundy); font: 400 1.25rem/1.2 var(--arm); opacity: .85; }
html:not([lang="hy"]) .polaroid figcaption { font: 1.65rem/1 "Great Vibes", cursive; bottom: 12px; }
.polaroid--one { left: 10%; top: 20px; transform: rotate(-16deg) translateY(60px); z-index: 1; }
.polaroid--two { right: 9%; top: 115px; transform: rotate(18deg) translateY(80px); z-index: 2; transition-delay: .2s; }
.photo-stack.is-visible .polaroid { opacity: 1; }
.photo-stack.is-visible .polaroid--one { transform: rotate(-5deg); }
.photo-stack.is-visible .polaroid--two { transform: rotate(6deg); }
.photo-stack__pg { position: absolute; z-index: 3; right: 6%; bottom: 9%; width: 34px; height: 40px; color: var(--wine); transform: rotate(12deg); }

/* ---------------- SCHEDULE ---------------- */
.schedule { padding: clamp(40px, 5vw, 70px) 0 clamp(50px, 6vw, 80px); border-top: 1px solid var(--line); }
.steps { list-style: none; margin: 28px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); }
.step { padding: 6px 22px; text-align: center; }
.step + .step { border-left: 1px solid var(--line); }
.step__icon { display: block; width: 64px; height: 56px; margin: 0 auto 14px; color: var(--burgundy); stroke-width: 1.6; }
.step h3 { margin: 0 0 4px; font: 600 1.25rem/1.35 var(--body); color: var(--brown); }
html[lang="hy"] .step h3 { font: 500 1rem/1.5 var(--arm); }
.step p { margin: 0; font-size: 1.02rem; color: var(--brown-soft); }
html[lang="hy"] .step p { font-size: .9rem; }
.step:nth-child(2).reveal { transition-delay: .12s; }
.step:nth-child(3).reveal { transition-delay: .24s; }

/* ---------------- VENUES ---------------- */
.venues { padding: clamp(56px, 7vw, 90px) 0 clamp(30px, 4vw, 50px); border-top: 1px solid var(--line); }
.venues__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(20px, 3vw, 36px); margin-top: 30px; }
.venue { display: flex; flex-direction: column; overflow: hidden; background: var(--card); border: 1px solid rgba(184, 138, 82, .35); border-radius: 10px; box-shadow: 0 18px 40px rgba(74, 50, 38, .10); }
.venue__photo { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; filter: sepia(.12) saturate(.95); }
.venue__body { flex: 1; display: flex; flex-direction: column; align-items: center; padding: 22px 22px 26px; text-align: center; }
.venue__kicker { margin: 0; color: var(--wine); font: 600 .78rem/1.3 var(--body); letter-spacing: .18em; text-transform: uppercase; }
html[lang="hy"] .venue__kicker { font: 500 .74rem/1.4 var(--arm); letter-spacing: .1em; }
.venue__name { margin: 8px 0 4px; color: var(--burgundy); font: italic 500 1.75rem/1.2 var(--display); }
html[lang="hy"] .venue__name { font: 400 1.25rem/1.4 var(--arm); }
.venue__address { margin: 0 0 18px; color: var(--brown-soft); font-size: 1.02rem; }
html[lang="hy"] .venue__address { font-size: .9rem; }
.venue__note { font-style: italic; }
html[lang="hy"] .venue__note { font-style: normal; }
.venue .btn { margin-top: auto; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 46px; padding: 10px 26px; border-radius: 6px; text-decoration: none;
  font: 500 .86rem/1 "Cinzel", var(--body); letter-spacing: .14em; text-transform: uppercase;
  transition: background .25s ease, color .25s ease, transform .25s ease;
}
html[lang="hy"] .btn { font: 500 .84rem/1.2 var(--arm); letter-spacing: .06em; text-transform: none; }
.btn svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.btn--outline { border: 1px solid rgba(110, 26, 34, .45); color: var(--burgundy); background: transparent; }
.btn--outline:hover:not(.is-disabled) { background: var(--burgundy); color: var(--parchment); }
.btn--outline::after { content: "↗"; font-family: var(--body); }
.btn--solid { border: 0; background: var(--burgundy); color: #f6ead9; box-shadow: 0 8px 18px rgba(86, 19, 25, .2); }
.btn--solid:hover:not([disabled]) { background: var(--burgundy-deep); transform: translateY(-1px); }
.btn--solid::after { content: "→"; font-family: var(--body); font-size: 1.1rem; letter-spacing: 0; }
.btn--solid[disabled] { opacity: .7; cursor: progress; }
.btn--block { width: 100%; }
.btn.is-disabled { opacity: .55; cursor: default; }

/* ---------------- GALLERY: our moments ---------------- */
.gallery { padding: clamp(50px, 6vw, 80px) 0 clamp(70px, 8vw, 110px); border-top: 1px solid var(--line); text-align: center; }
.gallery__intro { margin-bottom: 40px; }
.gallery__row { display: flex; justify-content: center; gap: clamp(18px, 3vw, 34px); }
.gallery__item { position: relative; flex: 0 1 300px; margin: 0; padding: 10px 10px 44px; background: #fcf8f1; box-shadow: 0 18px 46px rgba(74, 40, 30, .16); }
.gallery__item img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; filter: sepia(.1); }
.gallery__item figcaption { position: absolute; left: 0; right: 0; bottom: 10px; color: var(--burgundy); font: 400 1.1rem/1.2 var(--arm); opacity: .85; }
html:not([lang="hy"]) .gallery__item figcaption { font: 1.6rem/1 "Great Vibes", cursive; bottom: 11px; }
.gallery__item.reveal { transform: translateY(40px); }
.gallery__item:nth-child(1).is-visible { transform: rotate(-4deg); }
.gallery__item:nth-child(2).is-visible { transform: translateY(26px) rotate(2deg); transition-delay: .12s; }
.gallery__item:nth-child(3).is-visible { transform: rotate(-2deg); transition-delay: .24s; }

/* photos are decorative here: no browser image toolbars / drag */
.polaroid img, .gallery__item img, .venue__photo, .intro__art { pointer-events: none; -webkit-user-drag: none; user-select: none; }

/* ---------------- RSVP ---------------- */
.rsvp { position: relative; overflow: hidden; padding: clamp(56px, 7vw, 90px) 0 clamp(40px, 5vw, 60px); border-top: 1px solid var(--line); }
.rsvp__mtn { position: absolute; bottom: 26px; width: clamp(180px, 26vw, 340px); height: clamp(54px, 7.8vw, 102px); color: var(--wine); opacity: .4; stroke-width: 1.4; }
.rsvp__mtn--l { left: 2%; }
.rsvp__mtn--r { right: 2%; }
.rsvp__shell { position: relative; z-index: 1; max-width: 660px; }
.rsvp__head { text-align: center; margin-bottom: 30px; }
.rsvp__head .title { margin-bottom: 8px; }
.rsvp__deadline { margin: 0; color: var(--brown); }
.rsvp__head .ornament--sm { margin-top: 18px; }

.card {
  position: relative; padding: clamp(24px, 5vw, 44px);
  background: var(--card); border-radius: 4px;
  box-shadow: 0 2px 0 rgba(255, 255, 255, .6) inset, 0 26px 60px rgba(74, 50, 38, .14);
}
.card::before { content: ""; position: absolute; inset: 9px; border: 1px solid rgba(184, 138, 82, .45); pointer-events: none; }
.card { overflow: hidden; }
.card::before { z-index: 2; }
.card { padding-bottom: calc(clamp(24px, 5vw, 44px) + 96px); }
.rsvp-form, .rsvp__done, .rsvp__closed { position: relative; z-index: 3; }
.card__ararat { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; width: 100%; height: 130px; pointer-events: none; }
.ar-shape { fill: url(#ar-fill); }
.ar-line { fill: none; stroke: var(--wine); stroke-opacity: .32; stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.ar-snow { fill: none; stroke: var(--wine); stroke-opacity: .2; stroke-width: 1; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.card__church { position: absolute; right: 18px; bottom: 0; z-index: 3; width: 170px; height: 145px; pointer-events: none; filter: drop-shadow(0 4px 6px rgba(74, 40, 30, .08)); }
.ch-ground { fill: #ead9c3; }
.ch-wall { fill: #faf3e8; stroke: #7a2a2c; stroke-width: 1.3; stroke-linejoin: round; }
.ch-shade { fill: #ecdac4; }
.ch-roof { fill: #e7cfb6; stroke: #7a2a2c; stroke-width: 1.3; stroke-linejoin: round; }
.ch-line { fill: none; stroke: #7a2a2c; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.ch-hatch { fill: none; stroke: #7a2a2c; stroke-width: .8; stroke-opacity: .55; stroke-linecap: round; }
.ch-tree { fill: #7d7c45; opacity: .75; }
.rsvp__done, .rsvp__closed { padding-bottom: 6px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.field { position: relative; margin: 0 0 24px; padding: 0; border: 0; min-width: 0; }
.field__label { display: block; margin: 0 0 8px; padding: 0; color: var(--burgundy); font: 600 1.06rem/1.3 var(--body); }
html[lang="hy"] .field__label { font: 500 .9rem/1.5 var(--arm); }
.field__hint { margin: -2px 0 12px; color: var(--brown-soft); font-size: .98rem; line-height: 1.5; }
html[lang="hy"] .field__hint { font-size: .84rem; }
.input {
  width: 100%; min-height: 48px; padding: 10px 14px;
  border: 1px solid rgba(122, 92, 72, .35); border-radius: 6px;
  background: #fffaf2; color: var(--brown); font-size: 1.05rem;
  transition: border-color .2s ease, box-shadow .2s ease;
}
html[lang="hy"] .input { font-size: .95rem; }
.input::placeholder { color: #b09c88; }
.input:focus { outline: none; border-color: var(--wine); box-shadow: 0 0 0 3px rgba(140, 36, 48, .12); }
.input.is-invalid { border-color: #b3261e; background: #fff4f1; }

.choice { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.choice__opt { position: relative; display: block; cursor: pointer; }
.choice__opt input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.choice__opt span {
  display: flex; align-items: center; justify-content: center; min-height: 50px; height: 100%;
  padding: 10px 14px; text-align: center; line-height: 1.3;
  border: 1px solid rgba(110, 26, 34, .32); border-radius: 6px; color: var(--burgundy);
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}
html[lang="hy"] .choice__opt span { font-size: .9rem; }
.choice__opt:hover span { border-color: var(--burgundy); }
.choice__opt input:checked + span { background: var(--burgundy); border-color: var(--burgundy); color: #f6ead9; }
.choice__opt input:focus-visible + span { outline: 2px solid var(--wine); outline-offset: 3px; }
.choice.is-invalid .choice__opt span { border-color: #b3261e; }

.guests__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.guest { display: grid; grid-template-columns: 28px 1fr 1fr 40px; gap: 8px; align-items: center; animation: guest-in .35s ease both; }
@keyframes guest-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.guest__num { color: var(--wine); font: 400 1.15rem/1 var(--caps); text-align: center; }
.guest__remove { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid transparent; border-radius: 50%; background: transparent; color: var(--brown-soft); font-size: 1.4rem; line-height: 1; }
.guest__remove:hover { border-color: var(--line); color: var(--wine); }
.guest__remove[disabled] { visibility: hidden; }
.guests__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: 14px; }
.add-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 8px 18px; border: 1px dashed rgba(110, 26, 34, .45); border-radius: 6px; background: transparent; color: var(--burgundy); font-size: 1rem; transition: background .2s ease; }
html[lang="hy"] .add-btn { font-size: .86rem; }
.add-btn span:first-child { font-size: 1.2rem; line-height: 1; }
.add-btn:hover { background: rgba(255, 255, 255, .5); }
.add-btn[disabled] { opacity: .45; cursor: not-allowed; }
.guests__total { margin: 0; color: var(--brown-soft); font-size: .96rem; }
html[lang="hy"] .guests__total { font-size: .84rem; }
.form-msg { margin: 0 0 16px; padding: 10px 14px; border-radius: 6px; background: #f8e6e2; color: #8c1d18; font-size: .98rem; line-height: 1.5; }
html[lang="hy"] .form-msg { font-size: .86rem; }
.rsvp__done { text-align: center; padding: 8px 0; }
.rsvp__done-text { margin: 0 0 12px; color: var(--burgundy); font: italic 500 1.6rem/1.35 var(--display); }
html[lang="hy"] .rsvp__done-text { font: 400 1.1rem/1.6 var(--arm); }
.link-btn { border: 0; background: none; color: var(--brown-soft); text-decoration: underline; text-underline-offset: 4px; }
.rsvp__closed { margin: 0; text-align: center; color: var(--burgundy); }

/* ---------------- FOOTER ---------------- */
.footer { background: var(--burgundy-deep); color: #f3e3d0; text-align: center; }
.footer__inner { padding: 54px 24px 46px; max-width: 700px; margin: 0 auto; }
.footer__mtn { display: block; width: 150px; height: 46px; margin: 0 auto 16px; color: #e9c6b0; stroke-width: 1.8; opacity: .85; }
.footer__names { margin: 0; font: 400 clamp(1.9rem, 5vw, 2.7rem)/1.2 var(--caps); letter-spacing: .06em; text-transform: uppercase; }
.footer__names .amp { font-family: var(--display); }
html[lang="hy"] .footer__names { font: 400 clamp(1.6rem, 4.4vw, 2.2rem)/1.3 var(--arm); letter-spacing: .08em; }
.footer__date { margin: 6px 0 0; font: 400 .86rem/1.5 var(--caps); letter-spacing: .2em; text-transform: uppercase; color: #e9c6b0; }
html[lang="hy"] .footer__date { font: 400 .76rem/1.6 var(--arm); letter-spacing: .14em; }
.footer__wait { margin: 0; font: italic 500 1.5rem/1.3 var(--display); }
html[lang="hy"] .footer__wait { font: 400 1.05rem/1.5 var(--arm); }
.footer__fullnames { margin: 22px 0 0; font: 500 .78rem/1.5 var(--body); letter-spacing: .18em; text-transform: uppercase; color: rgba(243, 227, 208, .72); }
html[lang="hy"] .footer__fullnames { font: 400 .72rem/1.6 var(--arm); letter-spacing: .1em; }
html[lang="hy"] 
/* ---------------- MUSIC ---------------- */
.music-toggle {
  position: fixed; right: 18px; bottom: 18px; z-index: 50;
  width: 48px; height: 48px; display: grid; place-items: center;
  border: 1px solid rgba(246, 234, 217, .7); border-radius: 50%;
  background: var(--burgundy); color: #f6ead9;
  box-shadow: 0 10px 26px rgba(86, 19, 25, .3);
}
.music-toggle svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.music-toggle.is-playing { animation: pulse-ring 2s ease-out infinite; }
.music-toggle.is-playing svg { animation: spin 6s linear infinite; }
@keyframes pulse-ring { 0% { box-shadow: 0 0 0 0 rgba(110, 26, 34, .45); } 100% { box-shadow: 0 0 0 16px rgba(110, 26, 34, 0); } }
@keyframes spin { to { transform: rotate(360deg); } }
.music-hint {
  position: fixed; right: 76px; bottom: 28px; z-index: 50;
  padding: 7px 14px; border-radius: 6px;
  background: var(--card); color: var(--burgundy); border: 1px solid var(--line);
  font-size: .9rem; white-space: nowrap; box-shadow: 0 8px 22px rgba(74, 50, 38, .16);
  animation: hint-in .6s ease 1.6s both;
}
html[lang="hy"] .music-hint { font-size: .76rem; }
@keyframes hint-in { from { opacity: 0; transform: translateX(10px); } to { opacity: 1; transform: none; } }

/* ---------------- TABLET ---------------- */
@media (max-width: 900px) {
  .intro__grid { grid-template-columns: 1fr; }
  .intro__art { max-width: 340px; order: -1; margin-bottom: -10px; }
  .venues__grid { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; }
}

/* ---------------- PHONE ---------------- */
@media (max-width: 640px) {
  body { font-size: 1.08rem; }
  .shell { width: calc(100% - 32px); }
  .lang-switch { top: 10px; right: 50%; transform: translateX(50%); }
  .lang-switch button { min-width: 40px; height: 28px; font-size: .66rem; }
  .hero__bg { background-position: center 82%; }
  .hero__frame { inset: 10px 10px 50px; }
  .hero__text { padding-top: 72px; }
  .hero__names { font-size: clamp(1.9rem, 9.4vw, 2.7rem); }
  html[lang="hy"] .hero__names { font-size: clamp(1.7rem, 8.4vw, 2.4rem); }
  .hero__date { font-size: .78rem; letter-spacing: .12em; }
  html[lang="hy"] .hero__date { font-size: .68rem; letter-spacing: .08em; }
  .hero__branch { width: 150px; top: 30px; left: -40px; }
  .hero__scroll { bottom: 64px; }

  .script-label { font-size: 2rem; }
  .photo-stack { height: 410px; margin-top: 30px; }
  .polaroid { width: 56%; padding: 7px 7px 32px; }
  .polaroid--one { left: 0; top: 12px; }
  .polaroid--two { right: -1%; top: 82px; }
  .polaroid figcaption { font-size: .95rem; bottom: 7px; }
  html:not([lang="hy"]) .polaroid figcaption { font-size: 1.2rem; bottom: 8px; }
  .photo-stack__back { width: 56%; height: 74%; left: 3%; top: 7%; }
  .photo-stack__pg { right: 1%; bottom: 6%; width: 26px; height: 30px; }
  .steps { grid-template-columns: 1fr; margin-top: 18px; }
  .step { padding: 22px 8px; }
  .step + .step { border-left: 0; border-top: 1px solid var(--line); }
  .carpet-wide { height: 40px; background-size: 74px 40px; }

  .gallery__row { justify-content: flex-start; overflow-x: auto; scroll-snap-type: x mandatory; padding: 14px 16px 44px; margin: 0 -16px; scrollbar-width: none; }
  .gallery__row::-webkit-scrollbar { display: none; }
  .gallery__item { flex: 0 0 74%; scroll-snap-align: center; }
  .gallery__item:nth-child(2).is-visible { transform: rotate(2deg); }

  .card { padding: 26px 18px 104px; }
  .card__ararat { height: 96px; }
  .card__church { width: 124px; height: 106px; right: 10px; }
  .choice { grid-template-columns: 1fr; }
  .guest { grid-template-columns: 22px 1fr 34px; grid-template-areas: "num first rm" ". last ."; row-gap: 6px; }
  .guest__num { grid-area: num; }
  .guest .input:nth-of-type(1) { grid-area: first; }
  .guest .input:nth-of-type(2) { grid-area: last; }
  .guest__remove { grid-area: rm; width: 34px; height: 34px; }
  .guests__list { gap: 16px; }
  .guests__foot { flex-direction: column; align-items: stretch; text-align: center; }
  .add-btn { justify-content: center; }
  .rsvp__mtn { bottom: 18px; width: 150px; height: 45px; }

  .music-toggle { right: 14px; bottom: 14px; width: 44px; height: 44px; }
  .music-hint { right: 66px; bottom: 23px; }
}

@media (prefers-reduced-motion: reduce) {
  .polaroid { opacity: 1; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal, .hero__text > * { opacity: 1; transform: none; }
}

/* Wide screens: the portrait photo is shown whole in the centre, a soft blurred copy fills the sides */
@media (min-width: 900px) {
  .hero::before {
    content: ""; position: absolute; inset: -40px; z-index: -3;
    background: url("assets/couple-hero.jpg") center 30% / cover no-repeat;
    filter: blur(28px) sepia(.3) saturate(.85); opacity: .9;
  }
  .hero__bg {
    background-size: auto 100%; background-position: center bottom;
    -webkit-mask-image: linear-gradient(90deg, transparent calc(50% - 22vh), #000 calc(50% - 12vh), #000 calc(50% + 12vh), transparent calc(50% + 22vh));
    mask-image: linear-gradient(90deg, transparent calc(50% - 22vh), #000 calc(50% - 12vh), #000 calc(50% + 12vh), transparent calc(50% + 22vh));
  }
  .hero__text { padding-top: 9vh; }
}