:root {
  --cream: #faf6f0;
  --paper: #fffdf8;
  --ivory: #f3e9e1;
  --pink: #efd8d6;
  --blush: #f8e8e6;
  --wine: #6c374b;
  --wine-deep: #4c2534;
  --berry: #996076;
  --rose: #b47d89;
  --ink: #4c3439;
  --muted: #86767a;
  --serif: 'Playfair Display', Georgia, serif;
  --sans: 'DM Sans', Arial, sans-serif;
  --script: 'Great Vibes', cursive;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:86px; }
body { margin:0; background:var(--cream); color:var(--ink); font:400 15px/1.8 var(--sans); overflow-x:hidden; }
body.lightbox-open { overflow:hidden; }
::selection { background:#e6b9c0; color:#4c2534; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
button, a { -webkit-tap-highlight-color:transparent; }
button:focus-visible, a:focus-visible { outline:3px solid #e6aeba; outline-offset:5px; }
img,video { max-width:100%; }
.wrap { width:min(100% - 96px,1190px); margin-inline:auto; }
.grain { pointer-events:none; position:fixed; z-index:90; inset:0; opacity:.13; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.68' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.21' filter='url(%23n)'/%3E%3C/svg%3E"); mix-blend-mode:multiply; }
.skip-link { position:fixed; left:12px; top:-70px; z-index:200; background:white; padding:12px; }
.skip-link:focus { top:12px; }
.site-header { position:relative; z-index:10; border-bottom:1px solid rgba(108,55,75,.1); background:rgba(250,246,240,.95); }
.header-inner { height:90px; display:flex; align-items:center; justify-content:space-between; gap:25px; }
.brand { display:inline-flex; align-items:center; gap:7px; line-height:1; font:600 35px var(--serif); letter-spacing:-2px; color:var(--wine); white-space:nowrap; }
.brand-heart { font:normal 39px/1 var(--serif); transform:translateY(-1px); }
.brand-dot { color:var(--rose); }
.main-nav { display:flex; align-items:center; gap:38px; margin-left:35px; }
.main-nav a { font-size:12px; font-weight:600; letter-spacing:.035em; color:#705e61; transition:color .2s; }
.main-nav a:hover { color:var(--wine); }
.header-love { padding:12px 20px; border:1px solid #ba9aa4; border-radius:40px; color:var(--wine); font-size:11px; font-weight:700; white-space:nowrap; letter-spacing:.025em; transition:background .2s,color .2s,transform .2s; }
.header-love:hover { background:var(--wine); color:#fff; transform:translateY(-2px); }
.header-love span { margin-left:15px; font-size:15px; }
.hero { min-height:755px; position:relative; background:radial-gradient(ellipse 57% 75% at 87% 31%,#f1dad9 0%,rgba(242,223,219,.48) 40%,transparent 81%),radial-gradient(ellipse 39% 49% at 0% 90%,#f5e4dc 0%,transparent 89%),var(--cream); isolation:isolate; overflow:hidden; }
.hero-glow { position:absolute; pointer-events:none; border:1px solid rgba(159,111,126,.16); border-radius:50%; z-index:-1; }
.hero-glow-one { width:700px; height:700px; right:-330px; top:-310px; }
.hero-glow-two { width:570px; height:570px; right:-330px; top:-245px; }
.hero-inner { min-height:700px; padding-block:52px 32px; display:grid; grid-template-columns:1.02fr .98fr; gap:30px; align-items:center; }
.hero-copy { padding:0 0 35px 4px; position:relative; z-index:2; }
.eyebrow,.section-overline,.letter-overline { font-size:10px; font-weight:700; letter-spacing:.26em; color:var(--berry); margin:0 0 25px; text-transform:uppercase; }
.eyebrow { display:flex; align-items:center; gap:12px; }
.eyebrow-line { width:29px; height:1px; background:var(--rose); }
.hero h1 { color:var(--wine-deep); font:500 clamp(68px,6.7vw,104px)/1.23 var(--serif); letter-spacing:-.063em; margin:0 0 23px; }
.hero-line { display:block; white-space:nowrap; }
.hero h1 em { color:var(--berry); font-weight:400; }
.love-vow { display:inline-flex; align-items:center; gap:10px; font-size:16px; letter-spacing:-.03em; color:var(--wine); padding-bottom:16px; border-bottom:1px solid #d6bec1; }
.love-vow strong { font-weight:700; }
.love-vow-icon { font:normal 27px/1 var(--serif); }
.hero-intro { color:#706368; line-height:2; font-size:15px; margin:24px 0 32px; max-width:420px; }
.hero-actions { display:flex; align-items:center; gap:30px; flex-wrap:wrap; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:25px; padding:16px 23px; border-radius:50px; font:700 12px var(--sans); letter-spacing:.01em; transition:transform .25s, box-shadow .25s, background .25s; }
.btn:hover { transform:translateY(-3px); box-shadow:0 13px 27px rgba(107,54,74,.18); }
.btn-primary { background:var(--wine); color:#fff9f7; }
.btn span { font-size:18px; font-weight:400; }
.text-link { color:var(--wine); font-size:12px; font-weight:700; border-bottom:1px solid #c8a6ae; padding-bottom:5px; }
.text-link span { font-size:19px; vertical-align:-2px; margin-left:6px; }
.hero-signature { font:normal 27px var(--script); color:#aa7a87; margin:41px 0 0 6px; transform:rotate(-3deg); }
.signature-doodle { font:normal 32px var(--script); margin-right:5px; }
.hero-visual { position:relative; min-height:650px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.hero-video-decoration { position:absolute; width:415px; height:635px; left:calc(50% - 178px); top:18px; border:1px solid rgba(126,76,91,.2); border-radius:205px 205px 22px 22px; transform:rotate(7deg); pointer-events:none; }
.hero-video-frame { width:min(355px,83%); aspect-ratio:9/16; max-height:622px; position:relative; padding:7px; border-radius:170px 170px 20px 20px; background:#fff9f5; box-shadow:0 17px 65px rgba(78,43,52,.19), 0 0 0 1px #d9c1bc; transform:rotate(-2.3deg); overflow:hidden; }
.hero-video { width:100%; height:100%; display:block; object-fit:cover; border-radius:164px 164px 15px 15px; background:#4c3440; }
.hero-video-shine { position:absolute; inset:7px; pointer-events:none; border-radius:164px 164px 15px 15px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.27); }
.sound-btn { position:absolute; bottom:18px; left:50%; transform:translateX(-50%); display:flex; align-items:center; justify-content:center; gap:8px; padding:11px 16px; white-space:nowrap; border:1px solid rgba(255,255,255,.3); border-radius:45px; background:rgba(41,24,30,.7); backdrop-filter:blur(15px); -webkit-backdrop-filter:blur(15px); color:#fff; font-size:11px; font-weight:700; cursor:pointer; transition:background .2s; }
.sound-btn:hover { background:rgba(65,31,45,.93); }
.hero-stamp { position:absolute; z-index:2; right:1%; top:76px; width:118px; height:118px; border:1px solid #b6919b; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; transform:rotate(13deg); color:var(--wine); font:400 17px/1.1 var(--script); background:rgba(250,246,240,.85); }
.hero-stamp b { font:500 13px var(--serif); }
.hero-video-caption { width:410px; max-width:100%; margin:18px 0 0 0; display:flex; flex-direction:column; gap:0; align-items:center; text-align:center; font-size:12px; color:#715b63; }
.caption-mini { font:700 10px var(--sans); color:var(--wine); letter-spacing:.23em; }
.hero-decoration-heart { position:absolute; left:6%; top:71%; font-size:87px; line-height:1; color:#c69ba3; font-family:Georgia,serif; transform:rotate(-16deg); }
.hero-bottom { position:absolute; bottom:18px; left:50%; transform:translateX(-50%); display:flex; width:min(93%,1190px); justify-content:space-between; align-items:center; font:700 9px var(--sans); letter-spacing:.23em; color:#b19fa1; }
.scroll-mouse { font-size:21px; color:var(--wine); animation:bounce 2s infinite; }
@keyframes bounce { 0%,100% { transform:translateY(-3px) } 50% { transform:translateY(3px) } }
.section-pad { padding-block:125px; }
.story-section { background:#fffdf9; }
.story-grid { display:grid; grid-template-columns:1fr .87fr; align-items:center; gap:110px; }
.story-images { height:590px; position:relative; padding:8px 80px 60px 0; }
.story-image-primary { position:relative; height:100%; border-radius:195px 195px 8px 8px; overflow:hidden; box-shadow:0 17px 35px rgba(80,49,59,.13); }
.story-image-primary img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 50%; }
.story-image-secondary { position:absolute; width:185px; height:248px; right:-10px; bottom:0; border:9px solid #fffdf9; background:white; box-shadow:0 12px 28px rgba(71,44,53,.17); transform:rotate(8deg); }
.story-image-secondary img { display:block; width:100%; height:100%; object-fit:cover; }
.story-tape { position:absolute; top:-17px; left:30%; width:72px; height:25px; transform:rotate(-4deg); background:rgba(232,198,185,.65); }
.story-photo-note { position:absolute; top:5%; right:8px; color:#966e77; font:normal 28px var(--script); transform:rotate(8deg); }
.section-overline { margin-bottom:22px; }
.little-sparkle { font-size:17px; vertical-align:-2px; margin-right:6px; }
h2 { color:var(--wine-deep); font:500 clamp(36px,4vw,56px)/1.3 var(--serif); letter-spacing:-.055em; margin:0; }
h2 em { color:var(--berry); font-weight:400; }
.story-copy > p:not(.section-overline) { font-size:14px; line-height:2.12; color:#76696c; margin:23px 0; }
.story-copy > p strong { color:var(--wine); }
.story-divider { display:flex; align-items:center; gap:14px; margin:26px 0; color:var(--rose); }
.story-divider:before,.story-divider:after { content:''; height:1px; width:53px; background:#d8c6c8; }
.story-divider span { font-size:26px; line-height:1; }
.handwritten-end { display:block; font:normal 33px var(--script); color:var(--berry); margin-top:27px; }
.handwritten-end span { font:normal 27px var(--serif); }
.quote-band { background:#f3e7e3; padding:56px 0 60px; border-top:1px solid #f3e0dd; border-bottom:1px solid #eadbd9; }
.quote-inner { display:flex; align-items:center; justify-content:center; gap:34px; }
.quote-inner p { font:400 clamp(19px,2.1vw,27px)/1.7 var(--serif); color:#6a4452; text-align:center; max-width:795px; margin:0; }
.quote-inner em { color:var(--berry); }
.quote-star { font-size:40px; font-weight:300; color:#b88792; }
.album-section { background:#faf6f0; }
.section-heading { text-align:center; max-width:720px; margin:0 auto 61px; }
.section-heading h2 { font-size:clamp(39px,4.25vw,56px); }
.section-heading > p:not(.section-overline) { max-width:545px; margin:22px auto 0; font-size:14px; color:#857578; line-height:1.95; }
.album-hint { display:inline-flex; align-items:center; gap:8px; margin-top:24px; color:#9d717e; font:600 11px var(--sans); }
.album-hint span { font-size:17px; }
.album-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-auto-rows:95px; grid-auto-flow:dense; gap:15px; }
.album-photo { width:100%; padding:0; margin:0; position:relative; cursor:zoom-in; border:0; border-radius:5px; overflow:hidden; background:#e6d2cb; min-width:0; color:white; text-align:left; isolation:isolate; }
.album-photo.tall { grid-row:span 4; }
.album-photo.medium { grid-row:span 3; }
.album-photo.short { grid-row:span 2; }
.album-photo img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .65s cubic-bezier(.21,.61,.35,1), filter .4s; }
.album-photo:hover img { transform:scale(1.08); filter:saturate(1.03); }
.album-photo:nth-child(1) img { object-position:50% 58%; }
.album-photo:nth-child(2) img { object-position:50% 42%; }
.album-photo:nth-child(3) img,.album-photo:nth-child(7) img { object-position:50% 74%; }
.album-photo:nth-child(9) img { object-position:50% 41%; }
.album-photo:nth-child(10) img { object-position:50% 48%; }
.album-photo:after { content:''; position:absolute; inset:38% 0 0; background:linear-gradient(transparent,rgba(39,18,24,.74)); opacity:.9; transition:opacity .3s; z-index:0; }
.album-photo:hover:after { opacity:1; }
.photo-overlay { display:flex; flex-direction:column; position:absolute; bottom:17px; left:18px; right:13px; z-index:1; line-height:1.3; gap:5px; }
.photo-overlay small { font:700 8px var(--sans); letter-spacing:.19em; color:rgba(255,255,255,.86); }
.photo-overlay strong { font:500 18px/1.35 var(--serif); text-shadow:0 1px 15px rgba(0,0,0,.16); }
.album-footer-note { font:400 26px var(--script); color:#a37580; text-align:center; margin:45px 0 0; }
.album-footer-note span { font-family:var(--serif); }
.films-section { position:relative; background:linear-gradient(155deg,#f5e4e1,#fdf7f2 46%,#f5eae4); overflow:hidden; }
.film-background-orb { position:absolute; width:500px; height:500px; border:1px solid rgba(151,93,107,.13); border-radius:50%; top:-210px; left:-220px; pointer-events:none; }
.film-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:34px; max-width:845px; margin:0 auto; }
.film-card { min-width:0; border:1px solid rgba(133,82,98,.11); padding:15px; border-radius:10px; background:rgba(255,253,250,.82); box-shadow:0 14px 45px rgba(113,72,84,.08); }
.film-screen { height:450px; overflow:hidden; background:#382b33; border-radius:5px; }
.film-screen video { width:100%; height:100%; object-fit:contain; display:block; background:#302831; }
.film-card-bottom { padding:20px 10px 14px; }
.film-index { font-size:9px; font-weight:700; color:#aa7886; letter-spacing:.19em; }
.film-card h3 { font:500 24px var(--serif); color:var(--wine-deep); margin:7px 0 0; letter-spacing:-.025em; }
.film-card p { color:#8c757b; font-size:12px; margin:5px 0 0; }
.letter-section { position:relative; background:radial-gradient(circle at 9% 84%,#8b5066 0%,transparent 28%),radial-gradient(circle at 93% 10%,#824b60 0%,transparent 36%),#633448; padding:145px 0; overflow:hidden; }
.letter-section:before { content:''; width:400px; height:400px; border-radius:50%; border:1px solid rgba(255,233,229,.09); position:absolute; top:-170px; left:-200px; }
.letter-section:after { content:''; width:520px; height:520px; border-radius:50%; border:1px solid rgba(255,233,229,.09); position:absolute; bottom:-320px; right:-130px; }
.letter-stars { display:flex; justify-content:space-around; position:absolute; top:35px; left:0; width:100%; font-size:23px; color:#c999a7; opacity:.35; user-select:none; pointer-events:none; }
.letter-stars span { font-size:34px; }
.letter-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.letter-overline { color:#e9bfc9; }
.letter-copy h2 { color:#fff9f4; font-size:clamp(47px,4.8vw,70px); line-height:1.28; }
.letter-copy h2 em { color:#e7b6c2; }
.letter-copy > p:not(.letter-overline) { color:#ead1d7; line-height:2.1; font-size:14px; max-width:395px; margin:24px 0; }
.letter-handwriting { margin-top:38px; color:#f6d9df; font:normal 37px var(--script); transform:rotate(-3deg); }
.letter-interaction { display:flex; flex-direction:column; justify-content:center; align-items:center; min-height:410px; }
.envelope { width:365px; max-width:100%; aspect-ratio:1.52; border:0; position:relative; padding:0; background:transparent; cursor:pointer; filter:drop-shadow(0 20px 28px rgba(32,10,23,.23)); transition:transform .4s; }
.envelope:hover { transform:translateY(-8px) rotate(-2deg); }
.envelope-back { position:absolute; z-index:1; inset:0; background:#e2c5bc; border-radius:4px; }
.envelope-top { position:absolute; z-index:3; top:0; left:0; width:100%; height:61%; background:#efdfd7; clip-path:polygon(0 0,100% 0,50% 100%); transform-origin:top center; transition:transform .65s; }
.envelope-note { position:absolute; left:17%; right:17%; top:24%; height:60%; z-index:2; background:#fff9f0; display:flex; justify-content:center; align-items:flex-start; padding-top:22px; color:#996879; font:normal 27px var(--script); border-radius:3px; transform:translateY(0); transition:transform .6s .05s; }
.envelope-front { position:absolute; z-index:4; inset:0; background:#f0d9d0; clip-path:polygon(0 0,50% 54%,100% 0,100% 100%,0 100%); }
.wax-seal { position:absolute; z-index:5; width:67px; height:67px; border-radius:50%; left:50%; top:52%; transform:translate(-50%,-50%); display:flex; justify-content:center; align-items:center; background:#9a5f70; border:5px solid rgba(255,242,234,.22); box-shadow:0 4px 9px rgba(59,27,38,.3); font:39px Georgia,serif; color:#fcebf0; }
.envelope-instruction { color:#f0d4dc; font-size:12px; letter-spacing:.04em; margin:24px 0 0; text-align:center; }
.envelope-instruction span { font-size:19px; margin-right:7px; }
.letter-interaction.is-open .envelope { transform:scale(.84); height:0; opacity:0; overflow:hidden; pointer-events:none; margin:0; }
.letter-interaction.is-open .envelope-instruction { display:none; }
.letter-paper { width:100%; background:#fffdf8; padding:47px 44px 38px; border-radius:3px; box-shadow:0 25px 65px rgba(24,13,21,.24); position:relative; }
.letter-paper:before { content:''; position:absolute; inset:10px; border:1px solid rgba(144,94,105,.18); pointer-events:none; }
.letter-paper-top { font:700 9px var(--sans); color:#b17f8c; letter-spacing:.25em; }
.letter-paper h3 { color:var(--wine); font:400 34px var(--serif); margin:16px 0 19px; }
.letter-paper p { color:#69565c; font-size:13px; line-height:1.94; margin:13px 0; }
.letter-paper strong { color:var(--wine); }
.letter-paper .letter-ending { margin-top:23px; color:var(--wine); font:italic 18px/1.65 var(--serif); }
.letter-autograph { display:block; margin-top:15px; color:#9d6479; font:normal 30px var(--script); }
.letter-paper[hidden] { display:none; }
.closing-section { background:var(--cream); padding:105px 0 88px; }
.closing-inner { text-align:center; }
.closing-heart { font:normal 79px/1 var(--serif); color:#bd8897; margin-bottom:15px; }
.closing-inner > p { font:700 10px var(--sans); letter-spacing:.22em; color:#ab7c88; margin:10px 0 22px; }
.closing-inner h2 { font-size:clamp(38px,4.5vw,65px); }
.closing-infinity { display:block; font:normal 65px Georgia,serif; line-height:1; color:#b78394; margin:27px 0 26px; }
.back-to-top { font-size:12px; color:#855266; padding-bottom:7px; border-bottom:1px solid #af8e98; }
.back-to-top span { margin-left:13px; font-size:18px; }
.site-footer { border-top:1px solid #eadfdc; background:#f7f0ea; padding:24px 0; }
.footer-inner { display:flex; align-items:center; justify-content:space-between; font-size:11px; color:#917e80; }
/* Photo lightbox */
.lightbox[hidden] { display:none; }
.lightbox { position:fixed; z-index:100; inset:0; display:flex; justify-content:center; align-items:center; padding:52px 100px; background:rgba(30,17,25,.96); backdrop-filter:blur(13px); -webkit-backdrop-filter:blur(13px); }
.lightbox-figure { display:flex; flex-direction:column; align-items:center; justify-content:center; max-width:min(95%,850px); height:100%; margin:0; }
.lightbox-figure img { display:block; object-fit:contain; max-height:calc(100% - 97px); width:auto; max-width:100%; min-height:0; border-radius:3px; box-shadow:0 20px 60px rgba(0,0,0,.3); }
.lightbox-figure figcaption { text-align:center; display:flex; flex-direction:column; padding-top:16px; gap:3px; color:#fffaf7; }
.lightbox-figure figcaption span { color:#bc9ca6; font-size:9px; font-weight:700; letter-spacing:.2em; }
.lightbox-figure figcaption strong { font:400 22px var(--serif); }
.lightbox-figure figcaption small { color:#cfbac0; font-size:11px; }
.lightbox-close { position:absolute; right:32px; top:15px; font:300 40px var(--sans); color:white; background:transparent; border:0; cursor:pointer; }
.lightbox-arrow { position:absolute; top:50%; transform:translateY(-50%); border:1px solid rgba(255,255,255,.27); background:rgba(255,255,255,.05); color:#fff; border-radius:50%; width:47px; height:47px; cursor:pointer; font:normal 23px var(--sans); transition:background .25s; }
.lightbox-arrow:hover { background:rgba(255,255,255,.2); }
.lightbox-prev { left:35px; }.lightbox-next { right:35px; }
/* Reveal elements never disappear if JS is unavailable */
.js-enabled .reveal { opacity:0; transform:translateY(27px); transition:opacity .8s ease,transform .8s cubic-bezier(.16,1,.3,1); }
.js-enabled .reveal.is-visible { opacity:1; transform:translateY(0); }
/* Adjustments for smaller laptops */
@media (max-width:1090px) {
  .wrap { width:min(100% - 72px,1190px); }
  .main-nav { gap:22px; margin-left:0; }
  .hero h1 { font-size:clamp(63px,7vw,80px); }
  .hero-video-frame { width:330px; }
  .hero-video-decoration { width:385px; height:590px; left:calc(50% - 170px); top:28px; }
  .hero-stamp { right:-3%; }
  .hero-actions { gap:22px; }
  .story-grid { gap:60px; }
  .story-images { height:550px; padding-right:55px; }
  .story-image-secondary { right:-9px; }
}
@media (max-width:800px) {
  html { scroll-padding-top:65px; }
  .wrap { width:min(100% - 44px,640px); }
  .header-inner { height:72px; }
  .brand { font-size:30px; }
  .brand-heart { font-size:32px; }
  .main-nav { display:none; }
  .header-love { padding:8px 12px; font-size:10px; }
  .header-love span { margin-left:5px; }
  .hero { min-height:auto; }
  .hero-inner { grid-template-columns:1fr; gap:5px; padding-block:72px 70px; min-height:0; }
  .hero-copy { text-align:center; padding:0; }
  .hero h1 { font-size:clamp(58px,11vw,91px); line-height:1.22; margin:0 0 20px; }
  .eyebrow { justify-content:center; font-size:9px; letter-spacing:.17em; margin-bottom:18px; }
  .love-vow { font-size:14px; }
  .hero-intro { margin:22px auto 24px; max-width:430px; font-size:14px; }
  .hero-actions { justify-content:center; gap:20px; }
  .hero-signature { font-size:27px; margin:17px auto 0; }
  .hero-visual { min-height:660px; margin-top:26px; }
  .hero-video-frame { width:350px; max-width:77%; }
  .hero-video-decoration { left:calc(50% - 175px); height:613px; }
  .hero-stamp { right:3%; top:20px; }
  .hero-decoration-heart { left:3%; top:78%; }
  .hero-bottom { display:none; }
  .section-pad { padding-block:88px; }
  .story-grid { grid-template-columns:1fr; gap:65px; }
  .story-images { height:540px; max-width:510px; width:100%; margin:0 auto; }
  .story-copy { max-width:560px; }
  .story-copy h2 { font-size:clamp(38px,7vw,54px); }
  .quote-band { padding:48px 0; }
  .quote-inner { gap:10px; }
  .quote-star { font-size:25px; }
  .quote-inner p { font-size:20px; }
  .album-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:11px; grid-auto-rows:80px; }
  .photo-overlay { left:11px; bottom:12px; }
  .photo-overlay small { font-size:7px; }
  .photo-overlay strong { font-size:15px; }
  .letter-section { padding:98px 0; }
  .letter-grid { grid-template-columns:1fr; gap:50px; }
  .letter-copy { text-align:center; }
  .letter-copy h2 { font-size:clamp(50px,9vw,65px); }
  .letter-copy p:not(.letter-overline) { margin-inline:auto; }
  .letter-handwriting { margin-top:15px; }
  .letter-interaction { min-height:270px; }
  .letter-paper { max-width:570px; }
}
@media (max-width:540px) {
  .wrap { width:calc(100% - 38px); }
  .header-inner { height:67px; }
  .brand { font-size:28px; }
  .brand-heart { font-size:30px; }
  .header-love { font-size:9px; padding:8px 10px; }
  .hero-inner { padding-top:53px; padding-bottom:55px; }
  .eyebrow { font-size:8px; letter-spacing:.14em; }
  .hero h1 { font-size:clamp(52px,12.7vw,78px); }
  .love-vow { font-size:13px; gap:7px; }
  .love-vow-icon { font-size:23px; }
  .hero-intro { line-height:1.9; font-size:13px; max-width:350px; }
  .hero-actions { gap:14px; flex-direction:column; }
  .btn { padding:14px 19px; font-size:12px; }
  .hero-signature { font-size:26px; margin-top:18px; }
  .hero-visual { min-height:575px; margin-top:27px; }
  .hero-video-frame { width:min(285px,76%); border-radius:135px 135px 18px 18px; transform:rotate(-1.5deg); }
  .hero-video,.hero-video-shine { border-radius:133px 133px 13px 13px; }
  .hero-video-decoration { width:315px; height:530px; left:calc(50% - 142px); top:8px; }
  .hero-stamp { font-size:14px; width:86px; height:86px; top:28px; right:0; }
  .hero-stamp b { font-size:11px; }
  .hero-video-caption { margin-top:18px; font-size:10px; }
  .caption-mini { font-size:9px; }
  .hero-decoration-heart { left:-5px; top:80%; font-size:61px; }
  .sound-btn { padding:9px 13px; bottom:15px; font-size:10px; }
  .section-pad { padding-block:77px; }
  .story-grid { gap:38px; }
  .story-images { height:450px; padding:0 56px 35px 0; }
  .story-image-secondary { height:177px; width:131px; right:0; border:6px solid white; }
  .story-photo-note { top:7%; right:-2px; font-size:21px; }
  .story-copy { text-align:left; }
  .story-copy h2 { font-size:36px; }
  .story-copy > p:not(.section-overline) { font-size:13px; line-height:2; margin:18px 0; }
  .handwritten-end { font-size:29px; }
  .section-overline { font-size:9px; letter-spacing:.17em; }
  .quote-band { padding:45px 0; }
  .quote-inner { gap:8px; }
  .quote-inner p { font-size:18px; line-height:1.7; }
  .quote-star { font-size:16px; }
  .section-heading { margin-bottom:39px; }
  .section-heading h2 { font-size:38px; }
  .section-heading > p:not(.section-overline) { font-size:13px; }
  .album-grid { grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:77px; gap:9px; }
  .album-photo.tall { grid-row:span 4; }
  .album-photo.medium { grid-row:span 3; }
  .album-photo.short { grid-row:span 2; }
  .album-photo:nth-child(1) { grid-row:span 4; }
  .photo-overlay { left:10px; right:6px; bottom:10px; }
  .photo-overlay small { font-size:6.5px; letter-spacing:.08em; }
  .photo-overlay strong { font-size:15px; }
  .album-footer-note { font-size:25px; }
  .film-grid { grid-template-columns:1fr; gap:26px; max-width:360px; }
  .film-screen { height:435px; }
  .film-card-bottom { padding:13px 9px 11px; }
  .film-card h3 { font-size:22px; }
  .letter-section { padding:85px 0 100px; }
  .letter-copy h2 { font-size:49px; }
  .letter-copy > p:not(.letter-overline) { font-size:13px; }
  .letter-handwriting { font-size:33px; }
  .envelope { width:min(335px,92%); }
  .letter-paper { padding:37px 30px 33px; }
  .letter-paper h3 { font-size:28px; }
  .letter-paper p { font-size:12px; }
  .closing-section { padding:83px 0 68px; }
  .closing-heart { font-size:65px; }
  .closing-inner > p { font-size:8px; letter-spacing:.15em; }
  .closing-inner h2 { font-size:37px; }
  .footer-inner { flex-direction:column; gap:3px; text-align:center; }
  .lightbox { padding:65px 10px 115px; }
  .lightbox-figure { max-width:100%; }
  .lightbox-figure img { max-height:calc(100% - 95px); }
  .lightbox-arrow { top:auto; bottom:29px; width:46px; height:46px; }
  .lightbox-prev { left:calc(50% - 65px); }.lightbox-next { right:calc(50% - 65px); }
  .lightbox-close { right:20px; top:13px; }
}
@media (max-width:360px) {
  .header-love { font-size:8px; }
  .hero h1 { font-size:48px; }
  .hero-visual { min-height:525px; }
  .hero-video-decoration { width:280px; height:480px; left:calc(50% - 125px); }
  .hero-stamp { right:-4px; }
  .story-images { height:370px; }
  .story-copy h2 { font-size:33px; }
  .album-grid { grid-auto-rows:65px; }
}
@media (prefers-reduced-motion:reduce) { *, *:before, *:after { scroll-behavior:auto!important; animation-duration:.01ms!important; transition-duration:.01ms!important; } }
/* Prevent intrinsic video/caption widths from stretching the mobile grid. */
.hero-inner { grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr); }
.hero-copy,.hero-visual { min-width:0; }
@media (max-width:800px) {
  .hero-inner { grid-template-columns:minmax(0,1fr); }
  .hero-video-caption { width:100%; }
}
@media (max-width:540px) {
  .hero-signature { font-size:clamp(20px,5.5vw,24px); max-width:100%; }
}