/* Templomi kapu · fehér kő, arany, mély bordó. Ünnepélyes, szimmetrikus. */

@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/eb-garamond-normal.woff2) format('woff2')}
@font-face{font-family:'EB Garamond';font-style:italic;font-weight:400 600;font-display:swap;src:url(fonts/eb-garamond-italic.woff2) format('woff2')}
@font-face{font-family:'Cinzel';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/cinzel.woff2) format('woff2')}

:root{
  --stone:#f3ede1;
  --stone-2:#e8dfcd;
  --stone-ink:#6b5a43;
  --ink:#2a1c16;
  --ink-soft:#57463a;
  --wine:#5b1624;
  --wine-2:#741f30;
  --gold:#b08a3e;
  --gold-hi:#e1c27a;
  --gold-ink:#7d5f22;
  --serif:'EB Garamond',Garamond,Georgia,serif;
  --caps:'Cinzel','Trajan Pro',Georgia,serif;
  --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--stone);color:var(--ink);font:400 19px/1.62 var(--serif);font-feature-settings:'kern' 1;font-variant-numeric:lining-nums;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.locked{overflow:hidden;height:100svh}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--gold-ink);outline-offset:3px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{width:min(100% - 40px,1080px);margin-inline:auto}
.wrap.narrow{max-width:720px;text-align:center}
.h2{margin:0 0 .45em;font:400 clamp(2rem,6vw,3.1rem)/1.1 var(--serif);color:var(--wine);letter-spacing:.005em}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 30px;border:0;border-radius:2px;background:var(--wine);color:#fbf5ea;font:500 18px/1.2 var(--serif);letter-spacing:.02em;text-decoration:none;cursor:pointer;transition:background .2s ease}
.btn:hover{background:var(--wine-2)}
.btn.ghost{background:transparent;color:var(--wine);box-shadow:inset 0 0 0 1.5px currentColor}
.btn.ghost:hover{background:rgba(91,22,36,.06)}
.btn.gold{background:var(--gold-hi);color:#3a0c16}
.btn.gold:hover{background:#ecd293}
.js .rv{opacity:0;transform:translateY(16px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.js .rv.in{opacity:1;transform:none}

/* ───────────── Fejléc: a kapu ───────────── */
.hero{--k:1;position:relative;height:100svh;min-height:540px;overflow:hidden;background:#e9e1d1}
.cam{position:absolute;inset:0;transform-origin:50% calc(100% - 72px);will-change:transform}
.hero.is-wide .cam{transform-origin:50% 100%}
.wall{position:absolute;inset:0;background:
  radial-gradient(70% 55% at 50% 24%,rgba(255,252,244,.45),rgba(255,252,244,0) 70%),
  radial-gradient(120% 80% at 50% 115%,rgba(70,50,28,.32),rgba(70,50,28,0) 60%),
  linear-gradient(90deg,rgba(70,50,28,.18),rgba(70,50,28,0) 22%,rgba(70,50,28,0) 78%,rgba(70,50,28,.18)),
  url(kepek/mesko.webp) 50% 0/380px}
.hero:not(.is-wide) .wall::after{content:"";position:absolute;left:0;right:0;bottom:0;height:88px;background:linear-gradient(rgba(214,203,182,.0),rgba(205,192,168,.9) 18%,#d3c6ab),url(kepek/mesko.webp) 0 0/200px;box-shadow:0 -1px 0 rgba(90,70,40,.25)}
.portal{position:absolute;left:50%;bottom:0;transform:translateX(-50%)}
.hero:not(.is-wide) .portal{bottom:72px}
.frame-slot,.frame{position:absolute;left:0;top:0;display:block;overflow:visible}
.frame .gold{fill:none;stroke:var(--gold);stroke-width:1.6}
.frame .gold.thin{stroke-width:1;opacity:.8}
.frame .edge{fill:none;stroke:rgba(80,60,35,.35);stroke-width:1}
.frame .ins{font-family:var(--caps);font-weight:600;letter-spacing:.14em;fill:#8a6a2a;paint-order:stroke;stroke:rgba(255,248,226,.55);stroke-width:.6px}
.portal::before{content:"";position:absolute;left:50%;top:calc(var(--f) * -.86);width:calc(var(--f) * .42);height:calc(var(--f) * .7);transform:translateX(-50%);background:linear-gradient(90deg,#a9822f,#ead08a 45%,#9b7428) 50% 0/22% 100% no-repeat,linear-gradient(#ead08a,#a9822f) 50% 28%/100% 15% no-repeat;filter:drop-shadow(0 1px 1px rgba(60,40,10,.35))}
.opening{position:absolute;left:calc(var(--p) + var(--f));top:var(--f);width:var(--W);height:var(--H);border-radius:calc(var(--W) / 2) calc(var(--W) / 2) 0 0;overflow:hidden;perspective:calc(var(--W) * 3.2);perspective-origin:50% 56%;background:#2a120f;box-shadow:inset 0 0 0 1px rgba(60,40,20,.4)}
.nave,.nave-svg{position:absolute;inset:0;width:100%;height:100%}
.nave-svg .tile{fill:rgba(116,31,48,.16)}
.nave-svg .runner{fill:#6d1b2b;opacity:.9}
.nave-svg .pier{fill:url(#pierG)}
.nave-svg .pew{fill:#5a2a20}
.nave-svg .pew-top{fill:#8a5240}
.nave-svg .cornice{fill:none;stroke:rgba(176,138,62,.6);stroke-width:1.5}
.nave-svg .rib{fill:none;stroke:#e3d3b2;stroke-width:4}
.nave-svg .win{fill:url(#ablak)}
.nave-svg .mullion{fill:none;stroke:rgba(176,138,62,.55);stroke-width:1.4}
.opening::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(60% 45% at 50% 38%,rgba(255,250,232,.85),rgba(255,240,205,.25) 55%,rgba(255,240,205,0) 80%);opacity:calc(var(--k) * .55 + var(--flash,0) * .45);mix-blend-mode:screen}
.rays{position:absolute;inset:-10% -20%;z-index:2;pointer-events:none;background:
  linear-gradient(104deg,transparent 30%,rgba(255,244,214,.38) 38%,transparent 46%),
  linear-gradient(97deg,transparent 47%,rgba(255,244,214,.3) 53%,transparent 60%),
  linear-gradient(110deg,transparent 58%,rgba(255,244,214,.22) 63%,transparent 69%);
  filter:blur(6px);mix-blend-mode:screen;opacity:calc(var(--k) * .95);transform-origin:50% 0;animation:rays 9s ease-in-out infinite alternate}
@keyframes rays{from{transform:translateX(-3%) skewX(-2deg)}to{transform:translateX(3%) skewX(2deg)}}
.motes{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;mix-blend-mode:screen}
.nave-text{position:absolute;z-index:4;left:50%;top:42%;transform:translate(-50%,-50%);width:70%;text-align:center;opacity:0;transition:opacity 1.1s ease,filter 1.1s ease;filter:blur(4px)}
.nave-text::before{content:"";position:absolute;inset:-14% -16%;z-index:-1;background:radial-gradient(closest-side,rgba(255,250,236,.9),rgba(255,250,236,.6) 55%,rgba(255,250,236,0))}
.is-lit .nave-text,.is-open .nave-text{opacity:1;filter:none}
.nt-kicker{margin:0 0 .6em;font:italic 400 max(14px,calc(var(--W) * .052))/1.25 var(--serif);color:var(--ink-soft)}
.nt-names{margin:0;font:italic 500 calc(var(--W) * var(--ns,18) / 100)/.98 var(--serif);color:var(--wine);display:flex;flex-direction:column;align-items:center}
.nt-names span{display:block;overflow-wrap:anywhere}
.nt-names i{font:italic 400 .42em/1.3 var(--serif);color:var(--gold-ink)}
.nt-date{margin:.7em 0 0;font:600 max(15px,calc(var(--W) * .056))/1.2 var(--caps);letter-spacing:.08em;color:var(--gold-ink)}
.nt-place{margin:.35em 0 0;font:italic 400 max(15px,calc(var(--W) * .05))/1.3 var(--serif);color:var(--ink-soft)}

/* a két szárny */
.leaf{position:absolute;top:0;bottom:0;width:50%;z-index:6;background:#4a1a1c url(kepek/dio.webp) 0 0/calc(var(--W) * .5) auto;backface-visibility:hidden;will-change:transform}
.leaf.l{left:0;transform-origin:0 50%;box-shadow:inset -1px 0 0 rgba(0,0,0,.5)}
.leaf.r{right:0;transform-origin:100% 50%;box-shadow:inset 1px 0 0 rgba(255,210,180,.1)}
.pan{position:absolute;left:16%;right:14%;border:1px solid rgba(214,174,96,.55);border-radius:2px;background:url(kepek/dio.webp) 30% 20%/calc(var(--W) * .5) auto;box-shadow:inset 0 0 0 calc(var(--W) * .012) rgba(24,6,8,.3),inset calc(var(--W) * .02) calc(var(--W) * .02) calc(var(--W) * .03) rgba(255,205,175,.09),inset calc(var(--W) * -.02) calc(var(--W) * -.025) calc(var(--W) * .035) rgba(0,0,0,.42),0 0 0 calc(var(--W) * .008) rgba(30,8,10,.35)}
.leaf.r .pan{left:14%;right:16%}
.pan.top{top:calc(var(--W) * .2);height:calc(var(--W) * .3)}
.leaf.l .pan.top{border-top-left-radius:100% 80%}
.leaf.r .pan.top{border-top-right-radius:100% 80%}
.pan.mid{top:calc(var(--W) * .58);bottom:calc(var(--H) * .27 + var(--W) * .06)}
.pan.bot{bottom:calc(var(--W) * .1);height:calc(var(--H) * .27 - var(--W) * .04)}
.astragal{position:absolute;left:-2px;top:0;bottom:0;width:calc(var(--W) * .03);background:linear-gradient(90deg,#3b1214,#6e3030 40%,#3b1214);box-shadow:inset -1px 0 0 rgba(214,174,96,.45),inset 1px 0 0 rgba(214,174,96,.3)}
.ring{position:absolute;left:4%;top:52%;width:calc(var(--W) * .09);height:auto;overflow:visible;filter:drop-shadow(0 2px 2px rgba(0,0,0,.5))}
.ring circle{fill:#d5b05e;stroke:#f1d892;stroke-width:3}
.ring circle[fill=none]{fill:none;stroke:#caa04c;stroke-width:4.5}
.leaf .shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(255,236,210,.1),rgba(0,0,0,0) 40%,rgba(0,0,0,.25));opacity:1}
.leaf .shade::after{content:"";position:absolute;inset:0;background:#0d0405;opacity:calc(var(--k) * .55)}
.seam{position:absolute;z-index:7;left:50%;top:calc(var(--W) * .02);bottom:0;width:2px;margin-left:-1px;background:linear-gradient(#fff7e0,#ffd98e);box-shadow:0 0 10px 3px rgba(255,216,140,.55),0 0 34px 10px rgba(255,216,140,.22);opacity:calc((1 - var(--k)) * .9);animation:seam 3.2s ease-in-out infinite}
.opening::after{content:"";position:absolute;z-index:7;left:8%;right:8%;bottom:0;height:3px;background:#ffe2a6;box-shadow:0 0 14px 5px rgba(255,214,140,.5);opacity:calc((1 - var(--k)) * .8)}
@keyframes seam{0%,100%{filter:brightness(1)}50%{filter:brightness(1.35)}}
.is-opening .seam{animation:none}
.step{position:absolute;left:calc(var(--p) * .5);right:calc(var(--p) * .5);bottom:0;height:var(--step);display:grid;place-items:center;background:linear-gradient(rgba(255,252,244,.55),rgba(255,252,244,0) 30%,rgba(70,50,28,.18)),url(kepek/mesko.webp) 0 0/300px;box-shadow:0 -1px 0 rgba(90,70,40,.35),inset 0 1px 0 rgba(255,255,255,.6);z-index:1}
.step span{font:600 max(14px,calc(var(--step) * .36))/1 var(--caps);letter-spacing:.16em;color:#7d5f22;text-shadow:0 1px 0 rgba(255,250,236,.8),0 -1px 0 rgba(70,50,20,.35)}
.spill{position:absolute;left:0;right:0;bottom:0;height:80%;pointer-events:none;background:radial-gradient(34% 62% at 50% 100%,rgba(255,226,160,.55),rgba(255,226,160,0) 72%);mix-blend-mode:screen;opacity:calc(var(--k) * .7 + var(--flash,0) * .5)}
.hero:not(.is-wide) .spill{bottom:40px}
.hero-cue{position:absolute;z-index:8;left:50%;bottom:16px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--ink);font:italic 400 17px/1.2 var(--serif);text-decoration:none;transition:opacity .6s ease}
.hero-cue::after{content:"";width:1px;height:22px;background:linear-gradient(var(--wine),rgba(91,22,36,0))}
.hero.is-wide .hero-cue{left:auto;right:0;width:calc((100% - var(--tw)) / 2);transform:none;bottom:40px}
.hero.is-closed .hero-cue,.hero.is-opening .hero-cue{opacity:0;pointer-events:none;transition:none}

/* nyitás rétege */
.op{position:absolute;inset:0;z-index:20;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .6s ease}
.op:focus{outline:none}
.op.is-fading{opacity:0;pointer-events:none}
.op-bottom{position:absolute;left:0;right:0;top:max(18px,env(safe-area-inset-top));padding:0 20px;text-align:center}
.hero.is-wide .op-bottom{top:50%;transform:translateY(-50%);width:calc((100% - var(--tw)) / 2)}
.op-hint{margin:0 0 4px;font:italic 400 22px/1.3 var(--serif);color:var(--ink)}
.op-skip{background:none;border:0;padding:10px 14px;color:var(--wine);font:400 17px/1.2 var(--serif);text-decoration:underline;text-underline-offset:4px;cursor:pointer}

/* ───────────── Meghívás, igeidézet ───────────── */
.call{padding:clamp(70px,12vw,140px) 0;background:var(--stone)}
.ige{margin:0 auto clamp(40px,6vw,64px);max-width:30em}
.ige blockquote{margin:0;font:italic 400 clamp(1.45rem,3.8vw,2rem)/1.42 var(--serif);color:var(--wine)}
.ige figcaption{margin-top:14px;font:italic 400 18px/1.3 var(--serif);color:var(--gold-ink)}
.ige::before,.ige::after{content:"";display:block;width:90px;height:1px;margin:0 auto 26px;background:var(--gold)}
.ige::after{margin:26px auto 0}
.call-text{margin:0 auto 40px;max-width:28em;font-size:clamp(1.15rem,2.6vw,1.35rem)}
.facts{margin:0 auto 40px;display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.facts dt{font:italic 400 18px/1.3 var(--serif);color:var(--gold-ink);margin-bottom:4px}
.facts dd{margin:0;font-size:20px;line-height:1.4}

/* ───────────── A nap rendje ───────────── */
.rend{padding:clamp(70px,11vw,130px) 0;background:linear-gradient(rgba(255,252,246,.55),rgba(255,252,246,.55)),url(kepek/mesko.webp) 0 0/420px}
.rend-sub{margin:0 0 34px;color:var(--ink-soft);font-style:italic}
.rend-list{list-style:none;margin:0 auto;padding:0;max-width:560px}
.rend-list li{position:relative;padding:28px 0;border-top:1px solid rgba(176,138,62,.45)}
.rend-list li:last-child{border-bottom:1px solid rgba(176,138,62,.45)}
.rend-n{display:block;font:italic 400 17px/1 var(--serif);color:var(--gold-ink);margin-bottom:8px}
.rend-time{display:block;font:600 18px/1.2 var(--caps);letter-spacing:.06em;color:var(--wine);font-variant-numeric:lining-nums}
.rend-list h3{margin:6px 0 2px;font:400 clamp(1.45rem,3.6vw,1.8rem)/1.2 var(--serif)}
.rend-list p{margin:0;font-style:italic;color:var(--ink-soft)}

/* ───────────── Történet ───────────── */
.story{padding:clamp(70px,11vw,130px) 0;background:var(--stone)}
.story-in{display:grid;gap:clamp(36px,6vw,80px);align-items:center}
@media (min-width:860px){.story-in{grid-template-columns:.9fr 1fr}}
.gilt{margin:0 auto;max-width:440px;padding:clamp(14px,2.4vw,22px);background:var(--wine);box-shadow:inset 0 0 0 2px var(--gold),inset 0 0 0 6px var(--wine),inset 0 0 0 7px rgba(225,194,122,.6),0 24px 40px -26px rgba(40,10,15,.6)}
.gilt img{width:100%;aspect-ratio:4/5;object-fit:cover;box-shadow:0 0 0 1px rgba(225,194,122,.7)}
.story-text{max-width:32em}
.story-text p{margin:0 0 1em}
.story-text>p:first-of-type::first-letter{float:left;margin:.06em .1em 0 0;font:500 3.6em/.8 var(--serif);color:var(--wine)}
.story-text h3{margin:1.2em 0 .3em;font:italic 500 22px/1.3 var(--serif);color:var(--wine)}

/* ───────────── Helyszín ───────────── */
.venue{position:relative;padding-bottom:clamp(60px,9vw,110px);background:var(--stone)}
.venue-ph{margin:0;height:clamp(300px,58vw,620px);overflow:hidden}
.venue-ph img{width:100%;height:100%;object-fit:cover}
.venue-card{position:relative;margin:-90px auto 0;max-width:620px;padding:clamp(28px,5vw,48px);text-align:center;background:#fbf7ef;box-shadow:0 0 0 1px rgba(176,138,62,.5),0 0 0 7px #fbf7ef,0 0 0 8px rgba(176,138,62,.35),0 30px 50px -30px rgba(40,25,10,.5)}
.venue-card p{margin:0 0 24px;color:var(--ink-soft)}
.venue-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}

/* ───────────── Tudnivalók ───────────── */
.good{padding:clamp(60px,10vw,120px) 0;background:linear-gradient(rgba(255,252,246,.6),rgba(255,252,246,.6)),url(kepek/mesko.webp) 0 0/420px;text-align:center}
.good-list{display:grid;gap:34px 60px;max-width:900px;margin:0 auto}
@media (min-width:760px){.good-list{grid-template-columns:1fr 1fr}}
.good-list h3{margin:0 0 6px;font:italic 500 23px/1.3 var(--serif);color:var(--wine)}
.good-list .txt p{margin:0 0 .5em}
.good-list ul{margin:0;padding:0;list-style:none}
.good-list li{margin:0 0 .35em}

/* ───────────── Visszajelzés ───────────── */
.rsvp{padding:clamp(70px,11vw,130px) 0;background:radial-gradient(90% 70% at 50% 0,#74202f,var(--wine) 70%);color:#f6ecdc}
.rsvp-in{max-width:660px}
.rsvp .h2{color:#fbf2e2;text-align:center}
.rsvp-intro{margin:0 0 34px;text-align:center;color:#ead9c4}
.field{display:block;margin:0 0 22px;border:0;padding:0}
.field label,.field legend{display:block;margin-bottom:8px;font:500 18px/1.35 var(--serif);color:#fbf2e2}
.field small{display:block;margin-top:6px;font-size:16px;color:#e2cdb4}
.input{width:100%;min-height:52px;padding:12px 14px;border:1px solid rgba(225,194,122,.5);border-radius:2px;background:#fbf7ef;color:var(--ink);font:400 18px/1.4 var(--serif)}
textarea.input{min-height:120px;resize:vertical}
.choice{display:grid;gap:10px}
@media (min-width:560px){.choice{grid-template-columns:1fr 1fr}}
.choice label{display:flex;gap:10px;align-items:center;margin:0;padding:13px 14px;border:1px solid rgba(225,194,122,.55);border-radius:2px;cursor:pointer}
.choice label:has(input:checked){background:rgba(225,194,122,.14);border-color:var(--gold-hi)}
.choice input{width:20px;height:20px;accent-color:var(--gold-hi);margin:0;flex:none}
.cond{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
.cond>div{overflow:hidden}
.cond.show{grid-template-rows:1fr}
.form-error{min-height:1.2em;margin:0 0 10px;color:#ffd7c4;font-weight:600}
.rsvp-submit{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 20px;text-align:center}
.demo-note{margin:0;font-size:15px;color:#e2cdb4}
.thanks{outline:none;text-align:center}
.thanks-big{font:italic 500 34px/1.2 var(--serif);color:#fbf2e2;margin:0 0 8px}

/* ───────────── Zárás ───────────── */
.closing{padding:clamp(64px,10vw,110px) 20px;text-align:center;background:var(--stone)}
.closing-names{margin:0 0 6px;font:italic 500 clamp(2.2rem,8vw,3.4rem)/1.1 var(--serif);color:var(--wine)}
.closing p{margin:0}
.replay{margin-top:24px;background:none;border:0;padding:10px;color:var(--wine);font:400 17px var(--serif);text-decoration:underline;text-underline-offset:4px;cursor:pointer}

/* ───────────── Belépőkód ───────────── */
.gate{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:20px;background:linear-gradient(rgba(243,237,225,.6),rgba(243,237,225,.8)),url(kepek/mesko.webp) 0 0/380px}
.gate form{width:min(100%,420px);padding:36px 28px;text-align:center;background:#fbf7ef;box-shadow:0 0 0 1px rgba(176,138,62,.5),0 0 0 7px #fbf7ef,0 0 0 8px rgba(176,138,62,.35),0 30px 60px -30px rgba(40,25,10,.5)}
.gate-ins{margin:0 0 14px;font:600 20px/1.3 var(--caps);letter-spacing:.12em;color:var(--gold-ink)}
.gate p{margin:0 0 18px;color:var(--ink-soft)}
.gate .input{text-align:center;letter-spacing:.2em}
.gate .form-error{color:#9b2b1f}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .rv{opacity:1;transform:none;transition:none}
  .rays,.seam{animation:none}
}