:root{--paper:#f7f1e8;--wine:#522432;--gold:#a17b48;--ink:#352d2c}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.8 Arial,sans-serif}body.closed{overflow:hidden}h1,h2,.serif{font-family:Georgia,serif;font-weight:400}h1,h2,p{margin-top:0}h2{font-size:clamp(38px,4.5vw,62px);line-height:1.13;letter-spacing:-2px}a{color:inherit}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:6px}.wrap{width:min(1080px,calc(100% - 48px));margin:auto}.eyebrow{font-size:10px;letter-spacing:3px;color:var(--gold);font-weight:600}.intro{position:fixed;inset:0;z-index:10;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:radial-gradient(ellipse at top,#fffaf1,#e7dbca);padding:24px;transition:opacity .8s,visibility .8s}.intro h1{font-size:clamp(30px,4vw,48px);line-height:1.2}.envelope{display:block;width:min(400px,85vw);height:250px;position:relative;border:1px solid #d2bfa1;background:#e4d1b3;box-shadow:0 24px 50px #462b2925;margin:45px 0 35px;perspective:1000px}.letter{position:absolute;inset:15px 18px;background:#fffaf2;border:1px solid #d9c29e;padding:40px 0;font:italic 48px Georgia;color:var(--wine);transition:transform 1s .5s;z-index:1}.letter small{display:block;font:9px Arial;letter-spacing:4px;margin-top:20px}.pocket{position:absolute;inset:0;z-index:3;background:linear-gradient(145deg,#f4e7d2,#e6d2b4);clip-path:polygon(0 0,50% 53%,100% 0,100% 100%,0 100%)}.flap{position:absolute;inset:0;z-index:4;clip-path:polygon(0 0,100% 0,50% 55%);background:#f8ead3;transform-origin:top;transition:transform .9s,z-index .1s .4s}.seal{position:absolute;z-index:5;top:43%;left:calc(50% - 28px);width:56px;height:56px;display:grid;place-items:center;border-radius:50%;background:var(--wine);color:#e5c69b;border:4px double #996d71;box-shadow:0 5px 10px #311c2940;font:italic 28px Georgia;transition:opacity .3s}.opening .flap{transform:rotateX(180deg);z-index:0}.opening .letter{transform:translateY(-100px)}.opening .seal{opacity:0}.gone{opacity:0;visibility:hidden;pointer-events:none}.hint{font-size:9px;letter-spacing:2px}.intro-date{font-size:10px;letter-spacing:4px;margin-top:16px}.music{position:fixed;right:20px;bottom:20px;z-index:20;background:var(--wine);color:#fff;border:1px solid #c8a580;border-radius:50%;width:46px;height:46px;font-size:22px}nav{max-width:1200px;margin:auto;padding:20px 28px;border-bottom:1px solid #d9cebe;display:flex;justify-content:space-between;align-items:center}nav a{text-decoration:none;font:30px Georgia}nav a span{font-size:13px}nav a:last-child{font:9px Arial;letter-spacing:2px}.hero{display:grid;grid-template-columns:1fr 330px;align-items:center;gap:75px;padding-block:65px 90px}.hero h1{font-size:clamp(90px,12vw,160px);line-height:1;letter-spacing:-7px;color:var(--wine);margin:30px 0}.hero h1 span{display:block;font:20px Georgia;letter-spacing:3px;margin:20px 0}.lead{font-size:25px;line-height:1.5}.date{font-size:10px;letter-spacing:2px;margin:28px 0}.date i{margin:0 10px}.text-link{font-size:12px;text-underline-offset:7px}.film{padding:12px;background:#fffaf3;border:1px solid #d9c6a8;box-shadow:15px 18px 0 #e9dfd1;border-radius:170px 170px 3px 3px;overflow:hidden}.film-label{display:block;text-align:center;font-size:8px;letter-spacing:1px;padding:22px 20px 14px}.film video{display:block;width:100%;height:auto;aspect-ratio:9/16;max-height:520px;object-fit:contain;background:#201b1d;border-radius:140px 140px 0 0}.film-bottom{display:flex;justify-content:space-between;font:italic 22px Georgia;padding:14px 6px 4px}.film-bottom i{font-size:14px}.count-section{text-align:center;background:var(--wine);color:var(--paper);padding:70px 24px}.count-section .eyebrow{color:#d9bd8e}.count-section>p:last-child{font-size:12px}.count{display:flex;justify-content:center;gap:42px;margin:35px 0}.count strong{display:block;font:46px Georgia}.count span{font-size:9px;letter-spacing:2px}.letter-section{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center;padding-block:100px}.letter-section p{color:#6b5b57}.letter-section .closing{font-size:24px;color:var(--wine);line-height:1.5}.photo-pair{position:relative;min-height:390px}.photo-pair img{position:absolute;width:55%;height:280px;object-fit:contain;background:#eee2d2;padding:7px;box-shadow:0 15px 25px #30201c18}.photo-pair img:first-child{top:0;left:0;transform:rotate(-7deg)}.photo-pair img:nth-child(2){right:0;top:70px;transform:rotate(6deg)}.photo-pair span{position:absolute;bottom:0;width:100%;text-align:center;font:italic 17px Georgia;color:var(--gold)}.album{background:#ede4d8;padding:80px 0}.album-head{display:flex;justify-content:space-between;align-items:end;gap:40px}.album-head>p{font-size:13px;color:#74635b}.track{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:30px max(24px,calc((100vw - 1080px)/2));scrollbar-width:thin;scrollbar-color:#a17b48 transparent}.track figure{flex:0 0 250px;margin:0;scroll-snap-align:center;padding:9px;background:#fffaf3;border:1px solid #ddd0bb}.track img{display:block;width:100%;height:320px;object-fit:contain;background:#f0e8dd}.track figcaption{display:flex;gap:15px;align-items:center;padding:16px 5px;font:italic 16px Georgia}.track b{font:9px Arial;color:var(--gold)}.carousel-controls{display:flex;align-items:center;justify-content:center;gap:30px;margin-top:25px}.carousel-controls button{width:42px;height:42px;border:1px solid #bda88d;border-radius:50%;background:transparent}.carousel-controls span{font-size:10px;letter-spacing:2px}.location{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center;padding-block:100px}address{font-style:normal;margin:25px 0 30px;color:#75635c}.button{display:inline-block;padding:16px 24px;background:var(--wine);color:white;text-decoration:none;font-size:12px;border:1px solid var(--wine)}.date-art{text-align:center;border:1px solid #bfa17b;padding:40px 24px;outline:1px solid #d4c0a3;outline-offset:-12px;border-radius:200px 200px 0 0;color:var(--wine);background:#efe2d0}.date-art>span{font-size:10px;letter-spacing:3px}.date-art strong{display:block;font:150px Georgia;line-height:1.2;margin-top:20px}.date-art p{font:italic 38px Georgia;margin:0 0 20px}.date-art div{border-top:1px solid #c7ae8c;margin:25px 30px 0;padding-top:15px;font:35px Georgia}.date-art i{font-size:16px}.rsvp{text-align:center;background:#e5d4c2;padding:90px 24px}.rsvp>p{max-width:550px;margin-inline:auto}.signature{font:italic 30px Georgia;margin:40px 0 0;color:var(--wine)}footer{display:flex;justify-content:space-between;padding:25px 8%;font:12px Georgia;color:var(--gold)}@media(max-width:700px){.hero{grid-template-columns:1fr;gap:40px;text-align:center;padding-top:50px}.hero h1{font-size:105px}.hero h1 span{font-size:17px;letter-spacing:1px}.film{width:280px;max-width:90%;margin:auto}.film video{max-height:430px}.eyebrow{letter-spacing:2px;font-size:9px}.letter-section,.location{grid-template-columns:1fr;gap:50px;padding-block:70px}.photo-pair{width:300px;max-width:100%;margin:auto;min-height:350px}.photo-pair img{height:250px}.count{gap:23px}.count strong{font-size:36px}.count span{font-size:8px}.album-head{display:block}.track figure{flex-basis:225px}.track img{height:300px}.date-art{max-width:330px;width:100%;margin:auto}.rsvp{padding-block:70px}.envelope{height:220px}.intro h1{font-size:32px}.hint{font-size:8px;letter-spacing:1px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
.gift{text-align:center;padding-block:80px 100px;border-top:1px solid #d9cebe}.gift>p{max-width:550px;margin-inline:auto}.secret{max-width:580px;margin:35px auto 0;border:1px solid #cbb18d;background:#fffaf2;box-shadow:0 18px 45px #5224320b}.secret summary{list-style:none;cursor:pointer;padding:32px 24px;color:var(--wine);font:italic 24px Georgia}.secret summary::-webkit-details-marker{display:none}.secret summary small{display:block;font:8px Arial;letter-spacing:2px;margin-top:18px;color:var(--gold)}.mini-envelope{display:grid;place-items:center;width:100px;height:65px;margin:0 auto 24px;background:linear-gradient(150deg,#e5cfad 49%,#f2e4cc 50%);border:1px solid #c3a275;font:32px Georgia;color:var(--wine);transition:transform .5s}.secret[open] .mini-envelope{transform:rotate(-6deg) translateY(-5px)}.secret-note{margin:0 25px;padding:25px 8px 35px;border-top:1px solid #dbc8ac}.secret-note>.serif{font-size:26px;line-height:1.4;color:var(--wine)}.secret-note .signature{display:block;font-size:22px}
/* Sapphire, periwinkle and champagne, inspired by Aline's portrait. */
:root{--paper:#eaf1ff;--wine:#193b94;--gold:#81601e;--ink:#182c50}body{background:linear-gradient(125deg,#eaf3ff,#e6e7ff 50%,#d9eaff)}.intro{background:radial-gradient(ellipse at 25% 20%,#668cdb55,transparent 60%),radial-gradient(ellipse at bottom right,#a0a1ee88,transparent 65%),linear-gradient(145deg,#e1efff,#ccdafa);color:#183775}.envelope{background:#8ea9df;border-color:#91a7cd;box-shadow:0 25px 65px #193b9433}.letter{background:#edf4ff;border-color:#9eb5df}.pocket{background:linear-gradient(145deg,#dce9ff,#94b5ec)}.flap{background:#bed3f5}.seal{background:#20449c;color:#ffdfa0;border-color:#c7ac72}.intro-date{color:#234783}.hero{grid-template-columns:1fr 410px;gap:55px}.hero h1{color:#2448a6}.hero-date{display:flex;gap:20px;align-items:center;margin:30px 0;border-block:1px solid #a5b9e0;padding:20px 0}.hero-date>span{flex:1;font-size:9px;letter-spacing:1.5px;color:#314a7d}.hero-date>span+span{border-left:1px solid #a5b9e0;padding-left:20px}.hero-date strong{display:block;font:42px Georgia;color:#2448a6;letter-spacing:-1px}.hero-date small{font-size:18px}.video-feature{text-align:center;min-width:0}.video-feature h2{font-size:31px;letter-spacing:-1px;margin-bottom:12px}.video-invite{font-size:12px;color:#465d88;margin-bottom:22px}.film{width:100%;border-radius:9px;padding:12px;background:linear-gradient(135deg,#fdf7df,#acc6f5 40%,#f5e2ad);border:1px solid #98b0d8;box-shadow:0 20px 50px #17398825}.film video{width:100%;height:auto;aspect-ratio:9/16;max-height:600px;object-fit:contain;border-radius:3px;background:#102653}.watch-button{margin-top:20px;border:1px solid #345bb3;background:#2348a2;color:white;border-radius:30px;padding:12px 22px;font-size:12px}.count-section{background:radial-gradient(ellipse at top right,#5359ba,transparent 70%),linear-gradient(125deg,#10295d,#214aa0);color:#f3f6ff}.count-section .eyebrow{color:#f0d395}.count>div{background:#ffffff0c;border:1px solid #a6c2ff55;border-radius:12px;padding:18px 20px;min-width:100px}.count{gap:18px}.count strong{color:#f5d99c}.portrait{margin:0 auto;width:min(100%,305px);padding:8px;background:linear-gradient(140deg,#f2d392,#b0c9f1);box-shadow:0 20px 40px #2348a226;border-radius:6px}.portrait img{display:block;width:100%;height:auto;max-height:510px;object-fit:contain}.portrait figcaption{text-align:center;font:italic 17px Georgia;color:#173674;padding:16px 3px 8px}.photo-pair[hidden]{display:none}.letter-section p{color:#40577f}.album{background:linear-gradient(135deg,#b9d3fa,#d5ccf5)}.album-head>p{color:#40577f}.track figure{background:#f1f6ff;border-color:#9db5dc;border-radius:6px}.track img{background:#e2ebfb}.carousel-controls button{border-color:#476cb7;color:#173674}.secret{background:#eaf2ff;border-color:#92acda;box-shadow:0 20px 50px #284da622}.mini-envelope{background:linear-gradient(150deg,#92b2eb 49%,#d3e3ff 50%);border-color:#8ca7d2}.secret-note{border-color:#a7bde1}.gift{border-color:#a7bde1}.date-art{background:radial-gradient(ellipse at top,#536fba,#1c3e85);color:#fff4d8;border-color:#c2a874;outline-color:#dac48e}.date-art div{border-color:#b6c5e666}.rsvp{background:radial-gradient(ellipse at top left,#667ac0,transparent 75%),linear-gradient(120deg,#173775,#343c8c);color:#fff}.rsvp .eyebrow,.rsvp .signature{color:#f3d89e}.rsvp .button{background:#efdaa8;color:#1d3571;border-color:#efdaa8}.button{border-radius:5px}.location address{color:#40577f}footer{background:#102750;color:#d8e5ff}.music{background:#2448a6;border-color:#d9bc7e}@media(max-width:700px){.hero{grid-template-columns:1fr;gap:50px}.video-feature{width:100%;max-width:360px;margin:auto}.film{max-width:100%;width:100%;margin:auto}.film video{max-height:540px}.hero-date{text-align:left}.hero-date strong{font-size:37px}.count{gap:8px}.count>div{padding:14px 8px;min-width:0;flex:1;max-width:90px}.count strong{font-size:32px}.count span{letter-spacing:1px}.portrait{width:265px;max-width:100%}.portrait img{max-height:450px}.envelope{margin-block:45px 35px}}