/* Replace these five image paths with the couple's final photographs when ready. */
.section-photo img { width:100%; height:100%; object-fit:cover; }
.section-photo::after { position:absolute; inset:0; content:""; background:linear-gradient(135deg,rgba(31,17,10,.34),rgba(66,32,18,.62)); }
.photo-placeholder { position:absolute; inset:0; display:grid; place-items:center; color:#f6ddb0; background:linear-gradient(135deg,#4d2a21,#ba8755); font-family:Italiana,Georgia,serif; font-size:clamp(2rem,6vw,4rem); text-align:center; }
.couple { display:grid; grid-template-columns:1fr; align-items:center; justify-items:center; gap:clamp(38px,8vw,110px); min-height:100svh; text-align:center; }
/* The couple photograph fills the existing #couple section space itself — no separate photo box. */
.couple { background:radial-gradient(circle at 18% 20%,rgba(92,56,40,.5) 0,transparent 35%),linear-gradient(180deg,rgba(29,19,15,.38),rgba(29,19,15,.58)),url("images/couple-photo.jpg") center/cover no-repeat,var(--ink); }
.couple-photo { grid-row:auto; width:min(100%,430px); margin:0 auto; overflow:hidden; border-radius:26px; background:#2e1a12; animation:none; aspect-ratio:auto; border:none; box-shadow:none; }
.card-photo-frame { position:relative; isolation:isolate; min-height:clamp(250px,32vw,360px); margin:11px 11px 0; overflow:hidden; border:1px solid rgba(242,210,143,.72); border-radius:17px; background:linear-gradient(145deg,#4d3024,#b28b5e); box-shadow:inset 0 0 28px rgba(255,237,191,.16); }
.card-photo-frame img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.card-photo-frame .photo-fallback { position:absolute; inset:0; display:grid; place-content:center; padding:22px; text-align:center; }
.card-photo-frame input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.photo-upload-prompt { position:absolute; z-index:3; right:18px; bottom:18px; left:18px; display:flex; align-items:center; justify-content:center; min-height:44px; padding:12px; color:#fff1ce; appearance:none; opacity:1; visibility:visible; pointer-events:auto; background:rgba(48,26,16,.76); border:1px solid rgba(244,210,139,.75); border-radius:10px; cursor:pointer; font:inherit; font-size:.67rem; font-weight:600; letter-spacing:.13em; line-height:normal; text-align:center; text-transform:uppercase; }
.photo-upload-prompt:focus-visible { outline:2px solid #fff1ce; outline-offset:3px; }
.photo-upload-prompt small { color:#e7c987; font-size:.57rem; font-weight:500; letter-spacing:.09em; }
.couple-photo.has-photo .photo-fallback { display:none; }
.couple-copy { max-width:550px; }
.couple-copy h1 { margin:0; font-size:clamp(3.7rem,8vw,7rem); line-height:.83; }
.couple-copy .handwritten { margin:13px 0 0; font-size:clamp(1.45rem,4vw,2rem); }
.couple-photo figcaption { position:relative; right:auto; bottom:auto; left:auto; display:grid; gap:3px; padding:17px 14px 18px; background:linear-gradient(135deg,#25150f,#51301f); text-align:center; }
.couple-photo figcaption strong { color:#fff8e9; font-family:Italiana,Georgia,serif; font-size:2rem; font-weight:400; line-height:1; }
.couple-photo figcaption span { color:#efd39c; font-family:"Cormorant Garamond",serif; font-size:1.3rem; font-style:italic; }
.date-details,.blessing { isolation:isolate; color:#fff8e9; background:#382118; }
/* The couple's dark-toned wedding photograph fills the existing .section-photo layer itself — the Save the Date background. */
.date-details .section-photo { background:url("images/save-the-date.jpg") center 32%/cover no-repeat,#21130e; }
.date-details .section-photo .photo-placeholder { display:none; }
.date-details .section-photo::after { background:linear-gradient(180deg,rgba(12,7,4,.68),rgba(12,7,4,.44) 42%,rgba(12,7,4,.82)); }
.date-details { display:grid; align-content:center; gap:20px; }
.date-details .section-title { position:relative; z-index:1; margin:0 auto; padding:20px 28px; text-align:center; text-shadow:0 2px 16px rgba(17,7,3,.85); }
.date-details .section-title h2 { color:#fff9e9; }
.date-details .section-title .eyebrow { color:#f2cf83; }
.date-details .scratch-grid { position:relative; z-index:1; grid-template-columns:repeat(3,minmax(0,1fr)); width:min(100%,600px); gap:clamp(8px,2.4vw,22px); }
/* Luxury gold medallion restyle — Date / Month / Year scratch cards (CSS only; scratch logic untouched). */
.date-details .scratch-card { min-height:0; aspect-ratio:1; border-radius:50%; border:1px solid rgba(110,72,26,.85);
  background:radial-gradient(circle at 50% -14%, rgba(255,251,235,.5) 6%, rgba(255,251,235,0) 42%),repeating-conic-gradient(from 8deg, rgba(255,243,209,.12) 0deg 5deg, rgba(120,79,28,.1) 7deg 12deg),conic-gradient(from 205deg, #f0cb80, #cf9c50 18%, #a3712e 42%, #8a5a20 56%, #caa04e 74%, #ecc776 92%, #f0cb80); }
/* The scratch canvas sits inset so the engraved gold rim stays visible around it; its bitmap and JS behaviour are unchanged. */
.date-details .scratch-card canvas { inset:4.5%; width:91%; height:91%; border-radius:50%;
  box-shadow:0 0 0 1px rgba(96,58,17,.55),0 0 0 2.5px rgba(255,247,222,.32),0 7px 16px rgba(12,6,2,.4); }
.date-details .scratch-reveal { inset:4.5%; gap:5px; padding:clamp(8px,7.5%,15px) clamp(9px,8%,17px); border-radius:50%;
  background:radial-gradient(circle at 50% 30%, #fffefa 4%, rgba(255,254,250,0) 58%),linear-gradient(168deg, #fbf5e6 12%, #f1e5c9 58%, #e6d4ad 100%);
  box-shadow:inset 0 0 0 1px rgba(168,124,58,.3),inset 0 0 16px rgba(172,129,64,.16); }
.date-details .scratch-reveal::before { content:""; position:absolute; inset:5.5%; border-radius:50%; border:1px dashed rgba(170,123,54,.5); pointer-events:none; }
.date-details .scratch-reveal small { position:relative; justify-self:stretch; margin:0 7%; padding-bottom:6px; color:#8a5a20; font-family:"Cormorant Garamond",Georgia,serif; font-size:clamp(.78rem,3vw,1.3rem); font-style:italic; font-weight:600; letter-spacing:.06em; text-transform:none; line-height:1; background:linear-gradient(90deg, rgba(170,123,54,0), rgba(170,123,54,.7) 24%, rgba(170,123,54,.7) 76%, rgba(170,123,54,0)) left bottom/100% 1px no-repeat; }
.date-details .scratch-reveal small::after { content:""; position:absolute; left:50%; bottom:-2px; width:5px; height:5px; transform:translateX(-50%) rotate(45deg); background:#b98a3e; box-shadow:0 0 0 1px rgba(255,250,232,.65); }
.date-details .scratch-reveal strong { color:#4f3417; font-family:Italiana,Georgia,serif; font-size:clamp(.72rem,2.4vw,1.2rem); font-weight:400; letter-spacing:.03em; line-height:1.1; }
.date-details .scratch-reveal p { color:#7b5b33; font-style:italic; font-size:clamp(.52rem,1.6vw,.74rem); line-height:1.3; }
.date-details .scratch-instruction { position:relative; z-index:1; max-width:420px; margin:2px auto 0; color:#fff1d3; font-family:"Cormorant Garamond",serif; font-size:1.2rem; font-style:italic; line-height:1.45; text-align:center; text-shadow:0 2px 12px rgba(17,7,3,.8); }
.date-details .scratch-instruction p { margin:0; }
.date-details .scratch-instruction strong { display:block; margin-top:6px; color:#f4ce80; font-family:Italiana,Georgia,serif; font-size:clamp(1.45rem,4vw,2rem); font-style:normal; font-weight:400; letter-spacing:.04em; }
/* Venue line — one quiet gold-accented row between the scratch cards and the closing instruction, in the section's existing invitation typography. */
.date-details .venue-line { margin:0 auto; text-align:center; text-shadow:0 2px 14px rgba(17,7,3,.85); }
.date-details .venue-line .eyebrow { margin:0 0 6px; color:#f2cf83; }
.date-details .venue-line strong { display:block; margin-top:0; color:#fff8e9; font-family:Italiana,Georgia,serif; font-size:clamp(1.3rem,3.4vw,1.9rem); font-weight:400; letter-spacing:.06em; line-height:1.15; }
.section-photo { position:absolute; z-index:0; inset:0; overflow:hidden; background:#4c2b20; }
.section-photo img { position:absolute; inset:0; }
.date-details > :not(.section-photo),.blessing > :not(.section-photo) { position:relative; z-index:1; }
.date-details .section-title>p:last-child { color:#f4e4c8; }
.date-details .scratch-card { box-shadow:inset 0 0 0 1px rgba(255,248,224,.5),inset 0 0 0 2.5px rgba(126,85,31,.35),inset 0 2px 5px rgba(255,249,230,.28),0 3px 9px rgba(15,7,3,.4),0 26px 50px rgba(8,4,2,.62); }
/* Keep the revealed medallion text comfortably inside the smaller coins on narrow phones. */
@media (max-width:480px) { .date-details .scratch-reveal { gap:2px; padding:8px 9%; } .date-details .scratch-reveal::before { display:none; } .date-details .scratch-reveal small { font-size:.68rem; padding-bottom:4px; } .date-details .scratch-reveal strong { font-size:.62rem; } .date-details .scratch-reveal p { font-size:.47rem; line-height:1.25; } }
.blessing-box,.welcome-box { background:linear-gradient(135deg,rgba(26,14,10,.72),rgba(63,33,21,.63)); backdrop-filter:blur(3px); }
.blessing-background input,.upload-photo-card input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
/* The couple's courtyard photograph is the background of the entire blessing section itself — behind the A Day to Remember and Welcome boxes, which stay layered above it. */
.blessing-background { background:url("images/blessing-background.jpg") center 32%/cover no-repeat,#382118; }
.blessing-background .photo-placeholder { display:none; }

.background-upload-prompt { position:absolute; z-index:2; right:20px; bottom:20px; padding:10px 13px; color:#fff0cf; background:rgba(35,18,10,.75); border:1px solid rgba(242,207,135,.78); border-radius:99px; cursor:pointer; font-size:.59rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.upload-photo-card { position:relative; isolation:isolate; overflow:hidden; border-radius:18px; background:transparent; }
.upload-photo-card > img,.upload-photo-card::after { position:absolute; z-index:0; inset:0; width:100%; height:100%; object-fit:cover; }
.upload-photo-card::after { content:""; background:linear-gradient(135deg,rgba(24,12,8,.64),rgba(59,30,20,.58)); }
.card-image-placeholder { position:absolute; z-index:0; inset:0; display:grid; place-items:center; color:rgba(255,230,180,.68); background:linear-gradient(135deg,#5f3927,#2b1710); font-family:Italiana,Georgia,serif; font-size:1.6rem; }
.card-copy { position:relative; z-index:1; }
.card-upload-prompt { position:absolute; z-index:2; right:16px; bottom:16px; padding:9px 11px; color:#fff0cf; background:rgba(35,18,10,.76); border:1px solid rgba(242,207,135,.78); border-radius:99px; cursor:pointer; font-size:.57rem; font-weight:600; letter-spacing:.11em; text-transform:uppercase; }
.upload-photo-card.has-photo .card-image-placeholder { display:none; }
.blessing.has-photo .blessing-background .photo-placeholder { display:none; }
.final-background input,.final-card input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.final-background .photo-placeholder { z-index:1; display:grid; color:#f7ddb2; background:linear-gradient(135deg,#4d2a21,#ba8755); }
.final-background .final-background-shade { z-index:0; background:linear-gradient(180deg,rgba(22,13,10,.42),rgba(23,14,11,.78)); }
.final-background .background-upload-prompt { position:absolute; z-index:2; inset:auto 20px 20px auto; }
.finale.has-photo .final-background .photo-placeholder { display:none; }
.final-card { max-width:670px; padding:0; background:transparent; border:1px solid rgba(226,186,113,.6); border-radius:20px; box-shadow:0 20px 60px rgba(0,0,0,.58); }
.final-card > img { filter:blur(6px) scale(1.08); }
.final-card::after { background:linear-gradient(135deg,rgba(20,11,8,.72),rgba(65,35,22,.58)); }
.final-card .card-upload-prompt { top:16px; bottom:auto; }
.final-card .card-copy { padding:clamp(35px,7vw,70px); text-align:center; }
.final-card .final-quote { max-width:510px; margin:18px auto 0; color:#f3dfc1; font-family:"Cormorant Garamond",serif; font-size:clamp(1.3rem,3vw,1.75rem); font-style:italic; line-height:1.55; }
.final-card .signature { margin:32px 0 0; color:#f4cf82; font-family:Italiana,Georgia,serif; font-size:clamp(2.3rem,6vw,4rem); line-height:.95; text-shadow:0 2px 16px rgba(0,0,0,.48); }
.closing-message { position:absolute; z-index:1; right:24px; bottom:24px; left:24px; margin:0; color:#f5d996; font-family:"Cormorant Garamond",Georgia,serif; font-size:clamp(1rem,2.5vw,1.35rem); font-style:italic; letter-spacing:.03em; text-align:center; text-shadow:0 2px 12px rgba(0,0,0,.82); }
@media (max-width:720px) { .final-background .background-upload-prompt { inset:auto 12px 12px auto; } .final-card .card-copy { padding:35px 25px 48px; } }
@media (max-width:720px) { .background-upload-prompt { right:12px; bottom:12px; } }
.final-photo .photo-placeholder { z-index:1; display:grid; color:#f7ddb2; background:linear-gradient(135deg,#4d2a21,#ba8755); }
.final-photo > div:last-child { z-index:0; }
.final-photo img[hidden],.section-photo img[hidden] { display:none; }
/* The couple's hazy portrait photograph is the background of the entire finale section itself — behind the With Love & Blessings card, which stays layered above it. */
.final-background { background:url("images/final-background.jpg") center 30%/cover no-repeat,#21130e; }
.final-background .photo-placeholder { display:none; }

@media (max-width:720px) { .couple { grid-template-columns:1fr; justify-items:center; text-align:center; } .couple-copy { max-width:550px; } .couple-photo { width:min(100%,330px); } .couple .invite-line { margin-right:auto; margin-left:auto; } }