:root{
  --blush:#EFE2DA;
  --blush-light:#FBF3EC;
  --cream:#FDF7F1;
  --burgundy:#7C1D33;
  --burgundy-soft:#A33A50;
  --sage:#8C9A7E;
  --gold:#B08D57;
  --ink:#4A3B36;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);
  font-family:'Jost',sans-serif;font-weight:300;font-size:17px;line-height:1.75}
h1,h2,h3{font-family:'Cormorant Garamond',serif;font-weight:400;margin:0}
.script{font-family:'Parisienne',cursive;color:var(--burgundy)}
.eyebrow{font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--burgundy-soft);margin:0}
.wrap{max-width:960px;margin:0 auto;padding:0 24px}

/* NAV */
nav{position:sticky;top:0;z-index:30;background:rgba(251,243,236,.94);
  backdrop-filter:blur(8px);border-bottom:1px solid rgba(176,141,87,.3)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 24px}
.monogram{display:block;line-height:0;padding:8px 0}
.monogram img{height:66px;width:auto;display:block}
nav ul{display:flex;gap:34px;list-style:none;margin:0;padding:20px 0;flex-wrap:wrap;justify-content:center}
nav a{text-decoration:none;color:var(--ink);font-size:.86rem;letter-spacing:.2em;
  text-transform:uppercase;padding-bottom:4px;border-bottom:1px solid transparent;transition:.25s}
nav a:hover,nav a:focus-visible{color:var(--burgundy);border-color:var(--gold)}

/* HERO */
header{position:relative;text-align:center;background:transparent}
.hero-band{position:relative;overflow:hidden;
  background:radial-gradient(ellipse at 50% 42%, var(--blush-light) 0%, var(--blush) 82%)}
.coluna{position:absolute;top:0;bottom:0;width:clamp(28px,5.5vw,66px);
  background:#7C1D33;z-index:5}
.coluna.esq{left:0}
.coluna.dir{right:0}
.hero-inner{position:relative;display:grid;place-items:center;padding:96px 20px 76px}
.hero-text{position:relative;width:min(86vw,620px)}
.hero-text .names{font-size:clamp(2.6rem,9vw,5rem);line-height:1.12}
.hero-text .amp{font-family:'Cormorant Garamond',serif;color:var(--gold);
  font-size:clamp(1.1rem,2.6vw,1.7rem);display:block;margin:6px 0}
.hero-date{font-family:'Cormorant Garamond',serif;letter-spacing:.24em;
  font-size:clamp(.95rem,2vw,1.3rem);color:var(--burgundy-soft);margin:20px 0 30px}
.hero-cta{display:inline-block;background:var(--burgundy);color:var(--cream);
  font-family:'Jost',sans-serif;font-size:clamp(.7rem,1.3vw,.82rem);letter-spacing:.22em;
  text-transform:uppercase;text-decoration:none;padding:16px 34px;transition:.25s;
  box-shadow:0 6px 22px rgba(124,29,51,.22)}
.hero-cta:hover,.hero-cta:focus-visible{background:var(--burgundy-soft)}

/* CONTAGEM */
.countdown{position:relative;display:flex;justify-content:center;gap:38px;flex-wrap:wrap;
  padding:8px 0 60px;background:transparent}
.countdown b{display:block;font-family:'Cormorant Garamond',serif;font-size:2.2rem;
  font-weight:400;color:var(--burgundy);line-height:1.1}
.countdown small{font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--sage)}

/* SEÇÕES */
section{padding:82px 0}
.section-head{text-align:center;margin-bottom:48px}
.section-head h2{font-size:clamp(2rem,5vw,2.9rem);color:var(--burgundy);margin-top:8px}
.rule{width:70px;height:1px;background:var(--gold);margin:20px auto 0;position:relative}
.rule::after{content:"";position:absolute;left:50%;top:-3px;width:7px;height:7px;
  transform:translateX(-50%) rotate(45deg);background:var(--burgundy-soft)}

.historia{max-width:680px;margin:0 auto;text-align:center}
.historia p{margin:0 0 22px}
.data-significado{max-width:680px;margin:56px auto 0;text-align:center}
.data-significado h3{font-size:1.9rem;color:var(--burgundy);margin-bottom:26px}
.gravura{margin:0 0 28px}
.gravura img{width:min(100%,340px);height:auto;display:block;margin:0 auto;
  border:1px solid rgba(176,141,87,.5);padding:8px;background:var(--cream)}
.gravura figcaption{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--sage);margin-top:14px}
.data-significado p{margin:0 0 22px}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.card{background:var(--cream);border:1px solid rgba(176,141,87,.35);padding:40px 30px;text-align:center}
.card h3{font-size:1.8rem;color:var(--burgundy);margin:6px 0}
.card .hour{font-family:'Cormorant Garamond',serif;font-size:1.5rem;letter-spacing:.14em;color:var(--sage);margin:12px 0}
.card address{font-style:normal;font-size:.95rem}
.link{display:inline-block;margin-top:20px;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--burgundy);text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:3px}
.link:hover{color:var(--burgundy-soft)}

/* TRAJE */
.dress{display:grid;grid-template-columns:1fr 1fr;gap:28px;max-width:760px;margin:0 auto}
.dress div{text-align:center;padding:34px 24px;border:1px solid rgba(176,141,87,.35)}
.dress h3{font-size:1.6rem;color:var(--burgundy)}
.dress p{margin:8px 0 0}

/* PRESENTES */
.gift-box{max-width:620px;margin:0 auto;text-align:center}
.gift-box p{margin:0 0 28px}
.btn{display:inline-block;background:var(--burgundy);color:var(--cream);border:none;cursor:pointer;
  font-family:'Jost',sans-serif;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;
  padding:15px 34px;text-decoration:none;transition:.25s}
.btn:hover,.btn:focus-visible{background:var(--burgundy-soft)}
.aviso{font-size:.85rem;color:rgba(74,59,54,.7);margin-top:18px}

/* RSVP */
form{max-width:560px;margin:0 auto}
label{display:block;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--burgundy-soft);margin-bottom:8px}
input,select{width:100%;padding:14px;margin-bottom:22px;background:var(--cream);
  border:1px solid rgba(176,141,87,.5);border-radius:0;font-family:'Jost',sans-serif;
  font-size:1rem;color:var(--ink)}
input:focus,select:focus{outline:2px solid var(--burgundy-soft);outline-offset:2px}
.hint{font-size:.85rem;margin:-14px 0 24px;color:rgba(74,59,54,.7)}
.form-actions{text-align:center}
.alerta{display:none;text-align:center;margin-top:22px;font-size:.9rem;color:var(--burgundy);
  border:1px solid rgba(124,29,51,.35);padding:14px 18px}
.convidado{text-align:center;font-family:'Cormorant Garamond',serif;font-size:1.5rem;
  color:var(--burgundy);margin:0 0 28px}
.msg{display:none;text-align:center;font-family:'Cormorant Garamond',serif;
  font-size:1.5rem;color:var(--burgundy)}


/* GUIRLANDAS LATERAIS */
.floral{position:relative;overflow:hidden}
.floral::before,.floral::after{content:"";position:absolute;top:0;bottom:0;
  width:clamp(76px,12vw,180px);background-repeat:repeat-y;background-size:100% auto;
  pointer-events:none;z-index:0;opacity:.95}
.floral::before{left:0;background-image:url(../images/guirlanda-esquerda.webp);background-position:left top}
.floral::after{right:0;background-image:url(../images/guirlanda-direita.webp);background-position:right top}
.floral > section,.floral > footer{position:relative;z-index:1;background:transparent}
.floral .wrap{padding-left:clamp(90px,13vw,200px);padding-right:clamp(90px,13vw,200px)}

/* BUQUES DOS CANTOS */
.canto{position:absolute;width:clamp(110px,14vw,230px);height:auto;
  pointer-events:none;user-select:none;z-index:2}
.canto.tl{top:-14px;left:clamp(24px,5vw,62px);transform:scaleX(-1) rotate(-90deg)}
.canto.tr{top:-14px;right:clamp(24px,5vw,62px);transform:rotate(-90deg)}
.canto.bl{bottom:-14px;left:clamp(24px,5vw,62px);transform:scale(-1,-1) rotate(-90deg)}
.canto.br{bottom:-14px;right:clamp(24px,5vw,62px);transform:scaleY(-1) rotate(-90deg)}
.hero-text{z-index:4}
footer{text-align:center;padding:64px 0;background:var(--blush);
  border-top:1px solid rgba(176,141,87,.35)}
.mono-footer{width:150px;height:auto;display:block;margin:0 auto 20px}
footer p{font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--sage);margin:0}

@media (max-width:820px){
  nav .wrap{flex-direction:column;gap:6px;padding-bottom:8px}
  nav ul{gap:22px;padding:10px 0}
  .monogram img{height:52px}
  nav a{font-size:.76rem}
  .duo,.dress{grid-template-columns:1fr}
  section{padding:60px 0}
  .hero-inner{padding:64px 16px 48px}
  .countdown{gap:24px}
  .canto{width:92px;opacity:.8}
  .floral::before,.floral::after{width:52px;opacity:.55}
  .floral .wrap{padding-left:60px;padding-right:60px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
