:root {
  --paper:#f5eee3; --card:#fffaf1; --ink:#352d2a; --wine:#4d1d2e;
  --wine-dark:#361522; --rose:#e2b0a4; --copper:#ad8266; --muted:#71655b;
  --rule:#d9c7b5; --serif:Georgia,'Times New Roman',serif; --sans:'Segoe UI',Arial,sans-serif;
}
* { box-sizing:border-box }
html { scroll-behavior:smooth; scroll-padding-top:30px }
body { margin:0; color:var(--ink); background:var(--paper); font:15px/1.7 var(--sans) }
button,input,textarea { font:inherit }
a { color:inherit }
button,a,summary { touch-action:manipulation; -webkit-tap-highlight-color:transparent }
button { cursor:pointer }
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible { outline:2px solid var(--copper); outline-offset:5px }
::selection { color:var(--wine-dark); background:#e2b0a4 }
[hidden] { display:none!important }
p,h1,h2,h3 { margin-top:0 }
h1,h2,h3 { font-family:var(--serif); font-weight:400 }
em { color:var(--wine); font-weight:400 }
.page-shell { margin:auto; overflow:hidden }
.demo-bar { text-align:center; background:#30202a; color:#dfcfc3; padding:7px 20px; font-size:9px; letter-spacing:.13em }
.demo-bar span { margin-left:16px; letter-spacing:.02em }
.site-header { display:flex; align-items:center; justify-content:space-between; min-height:106px; padding:0 max(6%,calc((100vw - 1240px)/2)); color:#f6eee1; background:var(--wine); position:relative }
.site-header:after { content:''; position:absolute; bottom:0; left:6%; right:6%; height:1px; background:#bf917644 }
.wordmark { display:flex; align-items:center; gap:14px; text-decoration:none; font:31px var(--serif); letter-spacing:-1px }
.wordmark img { filter:brightness(0) invert(.86) sepia(.15) }
.wordmark-dot { color:var(--rose) }
.site-header nav { display:flex; align-items:center; gap:42px; font-size:11px }
.site-header nav a { text-decoration:none }
.site-header nav a:hover { color:var(--rose) }
.nav-invitation { padding:7px 0; border-bottom:1px solid #cda78b }
.nav-invitation span { margin-left:22px; font-size:18px }
.hero { position:relative; isolation:isolate; display:grid; grid-template-columns:1.14fr 1fr; align-items:center; gap:7%; padding:75px max(6%,calc((100vw - 1240px)/2)) 88px; color:var(--paper); background:var(--wine) }
.hero:before { content:''; z-index:-1; position:absolute; inset:0; background:radial-gradient(ellipse at 95% 48%,#92684c42,transparent 52%),linear-gradient(120deg,#36152444,transparent 65%); pointer-events:none }
.hero:after { content:''; position:absolute; width:570px; height:690px; right:-80px; top:28px; border:1px solid #a17d5d2a; border-radius:50%; transform:rotate(-19deg); z-index:-1 }
.eyebrow { margin:0; font-size:9px; font-weight:500; letter-spacing:.18em; line-height:1.85; text-transform:uppercase }
.hero .eyebrow { display:flex; align-items:center; gap:12px; color:#dec3af; font-size:8px; letter-spacing:.18em }
.tiny-star { color:var(--rose); font-size:22px }
h1 { font-size:clamp(59px,6.1vw,92px); line-height:1.06; letter-spacing:-3px; margin:31px 0 29px }
.hero h1 { text-shadow:0 8px 40px #1c0e1718 }
.hero h1 em { color:var(--rose) }
.hero-description { color:#ddcbbf; font-size:14px; line-height:1.85; max-width:355px; margin-bottom:31px }
.button { display:inline-flex; align-items:center; justify-content:space-between; gap:30px; min-height:54px; padding:15px 23px; border:1px solid var(--wine); font-size:12px; text-decoration:none; letter-spacing:.015em; transition:background .2s,transform .2s,box-shadow .2s }
.primary { color:#fff8eb; background:var(--wine) }
.primary:hover { background:var(--wine-dark); transform:translateY(-2px); box-shadow:0 6px 18px #37162218 }
.button span:last-child { font-size:20px; line-height:1 }
.hero .primary { color:var(--wine-dark); background:#eedbc6; border-color:#eedbc6; box-shadow:0 8px 30px #1e0c131a }
.hero .primary:hover { background:#fff2dc }
.hero-signature { display:flex; align-items:center; gap:13px; margin-top:25px; font-size:10px; color:#d4b5a6 }
.hero-signature strong { font-weight:500; color:#f8e9da }
.signature-line { display:block; width:28px; height:1px; background:#c6957d }
.hero-art { position:relative; width:100%; max-width:480px; margin:0; padding:9px 0 0; transform:rotate(3deg) }
.photo-frame { position:relative; aspect-ratio:.88; border-radius:230px 230px 3px 3px; overflow:hidden; border:8px solid #eedfcb; background:#e9e0d3; box-shadow:16px 25px 55px #210f1a55,0 0 0 1px #e5b99055 }
.photo-frame img { display:block; width:100%; height:100%; object-fit:cover; filter:saturate(.84) contrast(1.025) }
.photo-corner { position:absolute; bottom:24px; left:23px; padding:10px 13px; color:var(--wine); font:italic 19px/1.3 var(--serif); background:#faf2e6ed; box-shadow:3px 4px 12px #2c152013 }
.round-seal { position:absolute; right:-28px; top:48px; display:flex; align-items:center; justify-content:center; flex-direction:column; width:108px; height:108px; border-radius:50%; border:1px solid #ca9f82; outline:5px solid var(--wine); color:#f1d8c2; background:var(--wine); transform:rotate(-15deg); box-shadow:0 6px 15px #180a1522 }
.round-seal span { font-size:6px; letter-spacing:.1em }
.round-seal i { font:italic 27px/1.55 var(--serif) }
.hero-art figcaption { display:flex; justify-content:space-between; align-items:center; margin:18px 0 0; color:#d9b99f; font-size:8px; letter-spacing:.16em }
.caption-flower { font-size:20px }
.interlude { display:flex; align-items:center; justify-content:center; gap:28px; padding:25px 25px 27px; color:#70584a; background:#e8d9c6; border-bottom:1px solid #d5bfa7; font:italic 18px var(--serif) }
.interlude .line { width:85px; height:1px; background:#b28c70 }
.letter-section { display:grid; grid-template-columns:1fr 2.3fr; align-items:start; gap:55px; max-width:1220px; margin:0 auto; padding:87px 35px 93px }
.section-aside { padding-top:12px }
.section-number { display:inline-block; color:#8b6a55; font:49px/1 var(--serif) }
.section-aside .eyebrow { margin:18px 0; color:var(--wine) }
.section-aside>p:last-child { color:#786454; font:italic 23px/1.5 var(--serif) }
.letter { position:relative; background:var(--card); border:1px solid #d6bda2; box-shadow:8px 9px 0 #e9dccb,0 24px 55px #4c2d2110; scroll-margin-top:45px }
.letter summary { display:grid; grid-template-columns:1fr auto; align-items:center; gap:25px; padding:45px 42px; position:relative; list-style:none; cursor:pointer }
.letter summary::-webkit-details-marker { display:none }
.letter summary>span:nth-child(2) { grid-column:1 }
.letter-stamp { position:absolute; right:27px; top:28px; width:47px; height:47px; display:grid; place-items:center; color:#ebcab5; font:italic 22px var(--serif); background:var(--wine); border:4px double #d4a27e; border-radius:50%; transform:rotate(-12deg); box-shadow:1px 3px 4px #45203020 }
.letter-summary { display:block; font:35px/1.3 var(--serif); letter-spacing:-.7px; margin-top:18px; max-width:385px }
.open-letter-label { grid-column:1; justify-self:start; font-size:10px; margin-top:2px; border-bottom:1px solid #b39273; padding-bottom:6px; color:var(--wine) }
.open-letter-label>span { margin-left:22px; font-size:17px }
.letter[open] summary { border-bottom:1px solid var(--rule) }
.letter[open] .open-letter-label { display:none }
.letter-content { padding:39px 47px 46px }
.letter-content h2 { font-size:36px; letter-spacing:-.8px; line-height:1.27; margin-bottom:28px }
.letter-content p { font-size:14px; color:#685a4e; line-height:1.95; margin-bottom:19px }
.letter-signature span { display:inline-block; color:var(--wine); font:italic 34px var(--serif); margin-top:9px }
.text-link { display:inline-flex; align-items:center; gap:24px; padding:7px 0; border:0; border-bottom:1px solid #8c5b55; background:none; color:var(--wine); font-size:12px; text-decoration:none }
.invitation-section { display:grid; grid-template-columns:1fr 1.05fr; align-items:start; gap:10%; max-width:1220px; margin:auto; padding:67px 35px 90px; border-top:1px solid var(--rule) }
.invitation-copy { padding-top:21px }
.invitation-copy .eyebrow { color:var(--wine) }
.invitation-copy h2 { font-size:clamp(43px,4.3vw,61px); line-height:1.13; letter-spacing:-2px; margin:27px 0 }
.invitation-copy>p:not(.eyebrow) { max-width:335px; font-size:14px; line-height:1.9; color:var(--muted) }
.handwritten { color:var(--wine); font:italic 24px var(--serif); transform:rotate(-3deg); margin:35px 0 45px }
.privacy-note { display:flex; gap:12px; max-width:315px; border-top:1px solid var(--rule); padding-top:23px; color:var(--muted) }
.privacy-note svg { width:18px; height:21px; flex-shrink:0; stroke:#927760; stroke-width:1.2; margin-top:4px }
.privacy-note p { font-size:10px; line-height:1.8 }
.form-paper { background:var(--card); padding:33px; border:1px solid #d6c2ac; box-shadow:0 20px 60px #56332209 }
.form-topline { display:flex; justify-content:space-between; align-items:center; padding-bottom:19px; margin-bottom:23px; border-bottom:1px solid var(--rule); color:var(--wine) }
.form-topline>span:last-child { font-size:23px }
.adult-note { color:#786554; font-size:10px; letter-spacing:.03em; margin:0 0 23px }
label,legend { font-size:12px; font-weight:500 }
input:not([type=radio]):not([type=checkbox]),textarea { display:block; width:100%; border:1px solid #cdbca7; border-radius:0; background:#fffdf7; color:var(--ink); padding:12px 13px; font-size:13px; line-height:1.5; transition:border-color .2s }
input::placeholder,textarea::placeholder { color:#807467; opacity:1 }
input:focus,textarea:focus { border-color:var(--wine) }
textarea { resize:vertical; min-height:79px }
.form-field { margin-bottom:22px }
.form-field>label { display:flex; justify-content:space-between; gap:10px; margin-bottom:8px }
.optional { color:#796a5b; font-size:9px; font-weight:400 }
fieldset { min-width:0; padding:0; margin:0 0 22px; border:0 }
legend { padding:0; margin-bottom:10px }
.idea-options { display:grid; grid-template-columns:repeat(3,1fr); gap:7px }
.idea-option { position:relative }
.idea-option input,.contact-tabs input { position:absolute; opacity:0; width:1px; height:1px }
.idea-option>span { display:flex; align-items:center; justify-content:center; flex-direction:column; gap:8px; min-height:83px; padding:12px 5px; border:1px solid #d9c9b4; color:#756252; font-size:10px; cursor:pointer; transition:background .2s,border-color .2s }
.idea-option svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.1; stroke-linecap:round; stroke-linejoin:round }
.idea-option input:checked+span { color:var(--wine); background:#eeded6; border-color:var(--wine) }
.idea-option input:focus-visible+span,.contact-tabs input:focus-visible+span { outline:2px solid var(--wine); outline-offset:3px }
.contact-tabs { display:flex; gap:23px; margin-bottom:12px }
.contact-tabs label { position:relative; cursor:pointer }
.contact-tabs span { display:block; padding-bottom:4px; color:#746051; font-size:11px; border-bottom:1px solid transparent }
.contact-tabs input:checked+span { color:var(--wine); border-color:var(--wine) }
.field-hint { margin:7px 0 0; color:var(--muted); font-size:9px }
.check-label { display:flex; align-items:flex-start; gap:10px; margin:18px 0; color:#6a594a; font-size:10px; line-height:1.8; font-weight:400 }
.check-label input { margin:3px 0 0; flex-shrink:0; accent-color:var(--wine); min-width:15px; min-height:15px }
.check-label a { text-underline-offset:3px }
.submit-button { width:100%; margin-top:11px; font-size:11px; gap:12px }
.submit-button #submit-label { font-size:12px; line-height:1.5 }
.submit-button:disabled { opacity:.6; cursor:wait; transform:none }
.form-footnote { margin:12px 0 0; color:#796351; text-align:center; font-size:9px }
.form-error { color:#8f263e; padding:11px 12px; margin:16px 0; font-size:12px; background:#f8e5e4; border-left:2px solid #8f263e }
.success-state { text-align:center; padding:35px 0; outline:none }
.success-flower { color:var(--wine); font-size:50px }
.success-state .eyebrow { margin:20px 0 }
.success-state h3 { font-size:41px; line-height:1.2 }
.success-state p:not(.eyebrow):not(.handwritten) { font-size:13px; line-height:1.8; color:var(--muted) }
.success-state .handwritten { margin-bottom:16px }
.copy-link { display:block; margin:14px auto; background:none; border:1px solid var(--rule); color:var(--wine); padding:9px 13px; font-size:11px }
.closing-note { position:relative; text-align:center; padding:66px 25px 70px; background:#eaddcc; border-top:1px solid #d9c3aa }
.closing-note:before { content:''; position:absolute; top:12px; left:12px; right:12px; bottom:12px; border:1px solid #c5a98c77; pointer-events:none }
.closing-note>p { font:39px/1.4 var(--serif); letter-spacing:-.7px; margin:22px 0 }
.closing-note>span { font-size:9px; letter-spacing:.18em; text-transform:uppercase; color:#6e5545 }
.site-footer { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:26px 6%; color:#dcc5b1; background:var(--wine); font-size:9px }
.site-footer a { text-decoration:none }
.footer-separator { margin:0 12px; color:#b58d73 }
.visually-hidden,.honey,.skip-link:not(:focus) { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }
.skip-link:focus { position:fixed; z-index:99; top:10px; left:10px; padding:10px 20px; background:var(--card); color:var(--wine) }
.simple-page { max-width:760px; margin:auto; padding:60px 25px 85px }
.simple-page h1 { font-size:54px; letter-spacing:-1.8px; margin:28px 0 }
.simple-page h2 { font-size:27px; margin:35px 0 12px }
.simple-page p,.simple-page li { font-size:14px; line-height:1.9; color:#6a5c50 }
.simple-page .back-link { color:var(--wine); font-size:12px; text-decoration:none }
.simple-page .eyebrow { margin-top:40px }
.simple-page .button { margin:20px 0 }
.simple-paper { padding:30px; background:var(--card); border:1px solid var(--rule) }
.withdraw-form input[type=hidden] { display:none }
.withdraw-form button { font-size:12px }
.card-page { max-width:1050px }
.card-preview-grid { display:grid; grid-template-columns:1fr 1fr; gap:25px; margin:35px 0 }
.business-card-art { display:block; width:100%; height:auto; border:1px solid #d5c3b1; box-shadow:3px 7px 20px #4b2d2010 }
.card-links { display:flex; flex-wrap:wrap; gap:16px; margin-bottom:28px }
@media(min-width:1500px) {
  .hero { gap:100px } .hero-art { max-width:500px }
}
@media(max-width:1050px) {
  .hero { gap:7%; padding-top:60px; padding-bottom:64px }
  h1 { font-size:6.8vw; letter-spacing:-2.5px }
  .hero .eyebrow { font-size:7px; letter-spacing:.11em }
  .hero-copy .button { padding:14px 17px; gap:18px; font-size:11px }
  .round-seal { width:88px; height:88px; right:-18px; top:35px }
  .round-seal i { font-size:23px } .round-seal span { font-size:5px }
  .letter-section { gap:35px; grid-template-columns:1fr 2.4fr }
  .letter-summary { font-size:30px; max-width:325px }
  .letter summary { padding:37px 32px }
  .letter-content { padding:32px }
  .invitation-section { gap:6% }
  .invitation-copy h2 { font-size:46px }
  .form-paper { padding:26px }
}
@media(max-width:700px) {
  .demo-bar { padding:6px 15px; font-size:8px; letter-spacing:.1em }
  .demo-bar span { display:block; margin:1px 0 0; font-size:8px }
  .site-header { min-height:82px; padding:0 23px }
  .site-header:after { left:23px; right:23px }
  .wordmark { font-size:26px; gap:10px }
  .wordmark img { width:20px; height:32px }
  .site-header nav { font-size:10px }
  .site-header nav>a:first-child { display:none }
  .nav-invitation span { margin-left:12px; font-size:17px }
  .hero { display:flex; flex-direction:column; align-items:stretch; gap:42px; padding:38px 25px 37px }
  .hero .eyebrow { font-size:7px; letter-spacing:.13em; gap:10px; max-width:310px }
  h1 { font-size:clamp(35px,11.2vw,65px); line-height:1.1; letter-spacing:-1.8px; margin:24px 0 }
  .hero-description { font-size:13px; line-height:1.85; margin-bottom:25px; max-width:320px }
  .hero-description br { display:none }
  .hero-copy .button { min-height:52px; padding:14px 21px; font-size:11px; gap:29px }
  .hero-signature { margin-top:21px; font-size:9px }
  .hero-art { width:calc(100% - 27px); max-width:425px; margin:0 auto; padding:0; transform:rotate(2deg) }
  .photo-frame { aspect-ratio:1.04; border-width:6px; border-radius:180px 180px 2px 2px }
  .photo-frame img { object-position:50% 56% }
  .photo-corner { left:15px; bottom:16px; padding:8px 10px; font-size:16px }
  .round-seal { top:22px; right:-21px; width:83px; height:83px; outline-width:4px }
  .round-seal i { font-size:22px }
  .hero-art figcaption { font-size:7px; margin-top:16px }
  .hero:after { top:300px; right:-100px; width:440px; height:550px }
  .interlude { padding:19px 20px; gap:15px; font-size:13px }
  .interlude .line { width:32px }
  .letter-section { display:block; padding:39px 25px 49px }
  .section-aside { display:flex; align-items:center; gap:15px; margin-bottom:25px; padding:0 }
  .section-number { font-size:29px }
  .section-aside .eyebrow { font-size:8px; margin:0 }
  .section-aside>p:last-child { display:none }
  .letter summary { padding:29px 25px; gap:20px }
  .letter summary .eyebrow { font-size:7px }
  .letter-stamp { right:18px; top:22px; width:40px; height:40px; font-size:19px }
  .letter-summary { font-size:27px; margin-top:15px; letter-spacing:-.4px; max-width:240px }
  .open-letter-label { font-size:9px }
  .letter-content { padding:28px 25px 33px }
  .letter-content h2 { font-size:28px }
  .letter-content p { font-size:13px; line-height:1.85 }
  .invitation-section { display:block; padding:42px 25px 49px; margin:0 0 }
  .invitation-copy { padding:0 }
  .invitation-copy h2 { font-size:44px; line-height:1.16; margin:22px 0; letter-spacing:-1.6px }
  .invitation-copy>p:not(.eyebrow) { max-width:100%; font-size:13px }
  .handwritten { font-size:21px; margin:27px 0 32px }
  .privacy-note { display:none }
  .form-paper { margin-top:33px; padding:25px 20px }
  .form-topline { padding-bottom:17px; margin-bottom:19px }
  .form-topline .eyebrow { font-size:8px }
  input:not([type=radio]):not([type=checkbox]),textarea { font-size:16px; padding:12px }
  .idea-option>span { min-height:82px; font-size:10px }
  .contact-tabs { gap:26px }
  .contact-tabs span { font-size:12px }
  .check-label { font-size:10px; margin:19px 0; gap:9px }
  .check-label input { min-width:16px; min-height:16px }
  .submit-button { min-height:55px }
  .submit-button #submit-label { font-size:12px }
  .closing-note { padding:47px 24px 51px }
  .closing-note>p { font-size:29px; margin:19px 0 }
  .closing-note>span { font-size:8px }
  .site-footer { display:block; padding:23px; text-align:center; font-size:8px; line-height:1.9 }
  .site-footer>a { display:block; margin-top:8px }
  .simple-page { padding:40px 23px 65px }
  .simple-page h1 { font-size:43px }
  .simple-page h2 { font-size:25px }
  .card-preview-grid { grid-template-columns:1fr }
  .success-state h3 { font-size:36px }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto }
  *,*:before,*:after { animation:none!important; transition:none!important; transform:none!important }
}