
:root{--ink:#080808;--paper:#fffdf7;--grey:#ecebe6;--line:4px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Roboto Condensed",Arial,sans-serif;overflow-x:hidden}
a{color:inherit}
.nav{position:absolute;z-index:20;left:0;right:0;top:0;display:flex;align-items:center;justify-content:space-between;padding:22px clamp(18px,5vw,72px)}
.nav.static{position:relative;border-bottom:4px solid var(--ink);background:#fff}
.logo{text-decoration:none;font-family:"Bangers";font-size:2.1rem}.logo span{font-family:"Permanent Marker"}
.nav-links{display:flex;align-items:center;gap:24px;font-weight:900}.nav-links a{text-decoration:none}
.nav-cta{background:#fff;border:3px solid #000;padding:8px 14px;box-shadow:4px 4px 0 #000}
.menu-btn{display:none;border:0;background:transparent;font-size:1.8rem}.back{text-decoration:none;font-weight:900}

.hero{min-height:100vh;padding:95px clamp(18px,4vw,55px) 45px;background:radial-gradient(circle,#111 1px,transparent 1.2px) 0 0/11px 11px,var(--paper);position:relative}
.hero-date{max-width:1450px;margin:auto;font-family:"Permanent Marker";font-size:clamp(2rem,5vw,5.5rem);transform:rotate(-2deg);padding-bottom:14px;border-bottom:10px solid #000}
.hero-comic-grid{max-width:1450px;margin:30px auto 0;display:grid;grid-template-columns:.78fr 1.22fr;gap:28px;position:relative;align-items:center}
.hero-title-panel{background:#fff;border:4px solid #000;padding:clamp(28px,5vw,65px);box-shadow:10px 10px 0 #000;transform:rotate(-.8deg)}
.kicker,.eyebrow{font-weight:900;letter-spacing:.16em;font-size:.9rem}
.hero h1,.section h2,.rsvp-heading h2,.sleep-hero h1,.hotel-copy h2,.thanks-box h1{font-family:"Bangers";font-weight:400;line-height:.87;letter-spacing:.015em}
.hero h1{font-size:clamp(5rem,10vw,9rem);margin:18px 0 26px}.hero h1 span{font-family:"Permanent Marker"}
.hero-sub{font-family:"Permanent Marker";font-size:clamp(1rem,2vw,1.35rem);line-height:1.35;margin:0 0 28px}
.art-panel{margin:0;border:4px solid #000;background:#fff;padding:10px;box-shadow:10px 10px 0 #000;transform:rotate(1deg)}
.art-panel img{width:100%;display:block}
.balloon{position:absolute;z-index:5;background:#fff;border:3px solid #000;border-radius:50%;font-family:"Bangers";font-size:clamp(1rem,1.6vw,1.55rem);line-height:1;text-align:center;padding:18px 26px}
.balloon-a{left:29%;top:3%;transform:rotate(-4deg)}.balloon-b{right:1%;bottom:2%;transform:rotate(3deg)}
.comic-button{display:inline-block;border:4px solid #000;background:#fff;box-shadow:7px 7px 0 #000;padding:13px 20px;text-decoration:none;font:1.35rem "Bangers";letter-spacing:.04em;cursor:pointer;transition:.12s;color:#000}
.comic-button:hover{transform:translate(3px,3px);box-shadow:4px 4px 0 #000}

.ticker{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:14px clamp(18px,5vw,72px);background:#000;color:#fff;font-family:"Permanent Marker";font-size:clamp(.75rem,1.4vw,1.05rem)}

.section{max-width:1400px;margin:auto;padding:105px clamp(18px,5vw,72px);position:relative}
.issue-no{position:absolute;right:5vw;top:25px;font:9rem "Bangers";opacity:.06}
.story-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:7vw;align-items:end}
.section h2{font-size:clamp(4rem,8vw,7.3rem);margin:14px 0 15px}
.story-copy{border-left:5px solid #000;padding-left:28px;font-size:1.3rem;line-height:1.55}.marker{font-family:"Permanent Marker";font-size:1.35rem}

.black-strip{background:#000;color:#fff}.wide{max-width:1500px}.light-text{color:#fff}
.comic-panels{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:45px}
.event-panel{min-height:470px;padding:25px;border:4px solid #fff;position:relative;overflow:hidden}.event-panel.white{background:#fff;color:#000;box-shadow:8px 8px 0 #bbb}
.caption{display:inline-block;padding:5px 8px;background:#000;color:#fff;font-weight:900;letter-spacing:.06em}.inverse-caption{background:#fff;color:#000}
.event-panel h3{font:4rem "Bangers";margin:55px 0 8px}.event-panel .place{font:2rem "Bangers";line-height:1.05}.event-panel p{font-size:1.12rem;line-height:1.45}.ink-link{font-weight:900}
.sound{position:absolute;right:17px;top:55px;font:2.2rem "Permanent Marker";transform:rotate(9deg)}.sound.alt{transform:rotate(-8deg)}.sound.big{font-size:4.5rem;color:#fff}
.halftone-panel{background:radial-gradient(circle,#fff 1.2px,transparent 1.5px) 0 0/8px 8px,#111;color:#fff}

.info-section h2{max-width:900px}.info-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:45px}
.info-card{border:4px solid #000;padding:32px;min-height:260px;position:relative;text-decoration:none;background:#fff;box-shadow:8px 8px 0 #000}
.info-card h3{font:3rem "Bangers";margin:22px 0 10px}.info-card p{font-size:1.15rem;line-height:1.45}.card-no{font-family:"Permanent Marker";font-size:1rem}.sleep-card{background:radial-gradient(circle,#111 1px,transparent 1.3px) 0 0/9px 9px,#fff}.sleep-card strong{font-family:"Bangers";font-size:1.3rem}

.rsvp-section{background:var(--grey);border-top:5px solid #000;border-bottom:5px solid #000;padding:100px clamp(18px,5vw,72px)}
.rsvp-wrap{max-width:1200px;margin:auto;display:grid;grid-template-columns:.7fr 1.3fr;gap:6vw;align-items:start}.rsvp-heading{position:sticky;top:25px}
.rsvp-heading h2{font-size:clamp(5rem,9vw,8rem);margin:15px 0 20px}.rsvp-heading>p:last-child{font-size:1.2rem;line-height:1.5}
.burst{display:inline-block;background:#000;color:#fff;font:2rem "Permanent Marker";padding:24px;clip-path:polygon(50% 0,60% 28%,82% 8%,79% 34%,100% 38%,81% 54%,97% 72%,72% 69%,77% 96%,56% 79%,44% 100%,38% 76%,15% 91%,22% 66%,0 57%,24% 44%,7% 25%,33% 28%)}

.comic-form{display:grid;gap:22px;background:#fff;border:4px solid #000;padding:clamp(24px,4vw,48px);box-shadow:10px 10px 0 #000}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.comic-form label>span,.comic-form legend{display:block;font:1.55rem "Bangers";margin-bottom:7px}
.comic-form input[type=text],.comic-form input[type=email],.comic-form input[type=number],.comic-form textarea{width:100%;padding:13px;border:3px solid #000;background:#fff;font:1rem "Roboto Condensed"}
.comic-form textarea{resize:vertical}.comic-form fieldset{border:3px solid #000;padding:18px}.comic-form legend{padding:0 8px}
.choice{display:flex;gap:10px;align-items:center;padding:9px 0;cursor:pointer}.choice input{width:21px;height:21px}.choice span{margin:0!important;font-size:1.25rem!important}
.submit-button{justify-self:start}
.final-panel{text-align:center;background:#000;color:#fff;padding:80px 20px}.final-panel h2{font:clamp(4rem,10vw,9rem) "Bangers";margin:12px 0}.final-panel p{font-family:"Permanent Marker"}

/* dormire */
.sleep-hero{text-align:center;padding:80px 20px 90px;background:radial-gradient(circle,#111 1px,transparent 1.3px) 0 0/10px 10px,var(--paper)}
.sleep-hero h1{font-size:clamp(5rem,12vw,10rem);margin:16px 0 40px}.big-balloon{max-width:930px;margin:auto;background:#fff;border:4px solid #000;border-radius:45%;padding:35px 50px;box-shadow:10px 10px 0 #000;font:clamp(1.6rem,3.6vw,3rem) "Bangers";line-height:1.05}
.big-balloon small{display:block;font-family:"Permanent Marker";font-size:.52em;margin-top:18px}
.hotel-comic{display:grid;grid-template-columns:1fr .8fr;gap:6vw;align-items:center}.hotel-copy h2{font-size:clamp(5rem,9vw,8rem);margin:15px 0 20px}.address{font:1.4rem "Permanent Marker";line-height:1.5}.hotel-copy>p:not(.address){font-size:1.15rem}
.hotel-graphic{min-height:430px;border:4px solid #000;background:radial-gradient(circle,#111 1.2px,transparent 1.5px) 0 0/8px 8px,#fff;box-shadow:10px 10px 0 #000;display:grid;place-items:center;position:relative;transform:rotate(2deg)}
.hotel-sign{font:clamp(3.5rem,7vw,6rem) "Bangers";text-align:center;background:#fff;border:4px solid #000;padding:25px;transform:rotate(-3deg)}.zzz{position:absolute;right:30px;top:20px;font:2.2rem "Permanent Marker"}
.sleep-form-section{background:#000;color:#fff}.narrow{max-width:1050px}.dark-form{color:#000}.privacy-note{font-size:.9rem;opacity:.75}
.simple-footer{text-align:center;padding:55px 20px;background:#fff;border-top:4px solid #000}.simple-footer strong{font:3rem "Bangers"}

/* thanks */
.thanks-page{min-height:100vh;display:grid;place-items:center;padding:25px;background:radial-gradient(circle,#111 1px,transparent 1.2px) 0 0/10px 10px,var(--paper)}
.thanks-box{max-width:780px;background:#fff;border:4px solid #000;box-shadow:12px 12px 0 #000;padding:55px 30px;text-align:center}.thanks-box h1{font-size:clamp(5rem,12vw,9rem);margin:15px 0}.thanks-box p:not(.eyebrow){font-size:1.25rem;margin-bottom:30px}

@media(max-width:920px){
  .nav-links{display:none;position:absolute;right:18px;top:65px;background:#fff;border:3px solid #000;box-shadow:5px 5px 0 #000;padding:18px;flex-direction:column;align-items:flex-start}.nav-links.open{display:flex}.menu-btn{display:block}
  .hero-comic-grid,.story-grid,.rsvp-wrap,.hotel-comic{grid-template-columns:1fr}.balloon{display:none}.hero-title-panel{order:1}.art-panel{order:2}
  .comic-panels{grid-template-columns:1fr}.info-cards{grid-template-columns:1fr}.rsvp-heading{position:relative;top:auto}.field-row{grid-template-columns:1fr}.ticker span{display:none}.ticker{justify-content:center}.event-panel{min-height:390px}
  .big-balloon{border-radius:38px;padding:28px 20px}.hotel-graphic{min-height:300px}
}


/* V4 — THIS IS NOT A WEDDING SITE */
body.splash-open{overflow:hidden}
.splash{
  position:fixed; inset:0; z-index:999;
  display:grid; place-items:center;
  padding:24px;
  background:
    radial-gradient(circle,#111 1.15px,transparent 1.5px) 0 0/9px 9px,
    #fffdf7;
  transition:opacity .45s ease, visibility .45s ease;
}
.splash.hidden{opacity:0;visibility:hidden;pointer-events:none}
.splash-inner{
  width:min(1040px,94vw);
  min-height:min(720px,88vh);
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  text-align:center; position:relative;
  background:#fff;
  border:5px solid #000;
  box-shadow:14px 14px 0 #000;
  padding:clamp(28px,6vw,75px);
  transform:rotate(-.4deg);
}
.splash-inner:before{
  content:"ISSUE 24.04.27";
  position:absolute; left:18px; top:16px;
  font:900 .8rem "Roboto Condensed"; letter-spacing:.16em;
  border:2px solid #000; padding:5px 7px;
}
.splash-kicker{font-weight:900;letter-spacing:.18em;margin:0 0 18px}
.splash h1{
  font:clamp(5rem,13vw,11rem)/.78 "Bangers";
  letter-spacing:.01em; margin:10px 0 24px;
}
.splash-note{
  font:clamp(1.4rem,3vw,2.5rem) "Permanent Marker";
  transform:rotate(-3deg); margin:0 0 22px;
}
.splash-date{font:clamp(1.1rem,2vw,1.6rem) "Permanent Marker";margin:0 0 30px}
.splash-button{font-size:clamp(1.25rem,2.5vw,1.7rem)}
.site-signature{opacity:.55;font-size:.75rem!important;letter-spacing:.16em}
@media(max-width:700px){
  .splash-inner{min-height:80vh}
  .splash h1{font-size:clamp(4.4rem,21vw,7rem)}
}

/* V5 — accessibility, privacy & forms */
.hidden-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.privacy-consent{display:flex!important;align-items:flex-start;gap:10px;font-weight:700;line-height:1.3}
.privacy-consent input{width:22px;height:22px;flex:0 0 auto;margin-top:2px}
.privacy-consent span{font:700 .95rem "Roboto Condensed",Arial,sans-serif!important;margin:0!important}
.privacy-consent a,.privacy-note a,.simple-footer a,.site-signature a{text-decoration:underline}
.comic-form input:focus-visible,.comic-form textarea:focus-visible,.comic-button:focus-visible,a:focus-visible,button:focus-visible{outline:4px solid #000;outline-offset:4px}
.privacy-page{min-height:100vh;background:var(--paper)}
.privacy-content{max-width:900px;margin:auto;padding:80px clamp(20px,5vw,70px) 110px}
.privacy-content h1{font:clamp(4rem,10vw,8rem)/.85 "Bangers";margin:15px 0 35px}
.privacy-content h2{font:2.3rem "Bangers";margin:42px 0 8px}
.privacy-content p,.privacy-content li{font-size:1.08rem;line-height:1.6}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.splash{transition:none}.comic-button{transition:none}}
