/* Refinamento de ritmo e alinhamento. */
.site-header{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:28px;
  min-height:96px;
  padding:16px 5%;
}
.site-header .brand{justify-self:start}
.site-header>p{
  position:static;
  transform:none;
  display:contents;
  text-align:center;
}
.site-header>p strong{
  grid-column:2;
  justify-self:center;
  white-space:nowrap;
}
.site-header>p span{
  grid-column:3;
  justify-self:end;
  position:static;
  margin:0;
  padding:8px 16px;
  border:1px solid var(--line);
  border-radius:999px;
  white-space:nowrap;
}
.welcome{
  min-height:calc(100vh - 96px);
  padding:44px 5% 30px;
  gap:28px 6%;
  align-items:center;
}
.welcome-copy{padding:8px 0 22px}
.welcome .eyebrow{margin:0 0 24px}
.welcome h1{
  margin:0 0 34px;
  font-size:clamp(4rem,5.8vw,6.5rem);
  line-height:.84;
}
.welcome .intro{margin:0 0 20px;max-width:490px}
.welcome .primary{margin-top:0}
.collection-note{
  margin:14px 0 0;
  font-size:.78rem;
  line-height:1.4;
  color:rgba(23,62,44,.76);
}
.gift-visual{width:min(92%,500px)}
.welcome-foot{padding:24px 0 4px;gap:30px}
.welcome-foot p:first-child{margin-top:-86px}
.collection{padding-top:46px;padding-bottom:24px}
.collection-head{margin-bottom:44px;column-gap:8vw}
.collection h2{font-size:clamp(3.8rem,5.8vw,6.2rem);margin-bottom:24px}
.gift-grid{gap:18px}
.gift-card{padding:26px;min-height:300px}
.collection-head>p:not(.eyebrow){font-size:.88rem;line-height:1.5}
.gift-card>small{
  font-size:.64rem;
  letter-spacing:.13em;
  color:rgba(23,62,44,.68);
}
.gift-card .envelope{
  flex:0 0 auto;
  align-self:center;
  margin:18px auto 0;
}
.gift-card h3{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:3.18em;
  margin:12px 0 0;
  line-height:1.06;
  font-size:1.62rem;
  text-align:center;
}
.gift-card>span{
  align-self:center;
  width:auto;
  margin:18px auto 0;
  text-align:center;
  font-size:.68rem;
  color:rgba(23,62,44,.64);
}
/* O mesmo elemento decorativo agora representa um presente, não uma carta. */
.gift-card .envelope{
  width:82px;
  height:58px;
  border-radius:4px;
  background:
    linear-gradient(90deg,transparent 0 42%,#eed25f 42% 58%,transparent 58%),
    linear-gradient(0deg,transparent 0 43%,#eed25f 43% 57%,transparent 57%),
    var(--envelope,#dcc568);
  filter:drop-shadow(0 8px 8px #173e2c18);
  transform:none!important;
}
.gift-card .envelope:before{
  content:'';
  position:absolute;
  inset:-10px -5px auto;
  height:14px;
  border-radius:4px 4px 2px 2px;
  background:
    linear-gradient(90deg,transparent 0 42%,#eed25f 42% 58%,transparent 58%),
    var(--envelope,#dcc568);
  clip-path:none;
  transform-origin:50% 100%;
  transition:transform .35s ease,filter .35s ease;
}
.gift-card.is-open .envelope:before{
  transform:translate(-7px,-7px) rotate(-10deg);
  filter:brightness(.96);
}
.gift-card .envelope:after{
  content:'✦';
  left:29px;
  top:15px;
  width:24px;
  height:24px;
  background:rgba(23,62,44,.72);
  font-size:.75rem;
  line-height:24px;
  opacity:.78;
}
.gift-card.is-open .envelope:after{content:'✓';opacity:1}
.return-row{
  margin:30px 0 0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
}
.return-row .return-note{margin:0;text-align:center;font-size:.82rem;color:rgba(23,62,44,.7)}
.return-row .outline{margin:0;flex:0 0 auto}
@media(min-width:1001px){
  .gift-grid{grid-template-columns:repeat(6,1fr)}
  .gift-card{grid-column:span 2}
  .gift-card:nth-child(4){grid-column:2 / span 2}
  .gift-card:nth-child(5){grid-column:4 / span 2}
}
.notice{margin-top:46px}

/* Evita o vazio entre a faixa final da abertura e o aviso dos materiais. */
.welcome{padding-bottom:0}
.welcome-foot{padding-bottom:20px}
.notice{
  margin:0 5% 18px;
  padding:18px 0;
  border-top:0;
  border-bottom:1px solid var(--line);
  align-items:center;
}
.notice p{line-height:1.45}
footer{padding-top:18px;padding-bottom:26px}

/* Ação secundária do modal: pequena, central e separada do fechamento “×”. */
#gift-dialog{padding-top:72px}
#gift-dialog>.dialog-close[aria-label="fechar"]{
  right:18px;
  top:14px;
}
#gift-dialog .dialog-close.outline{
  position:absolute;
  top:20px;
  left:50%;
  right:auto;
  transform:translateX(-50%);
  margin:0;
  padding:6px 12px;
  border:1px solid rgba(23,62,44,.22);
  border-radius:999px;
  background:transparent;
  color:rgba(23,62,44,.68);
  font-size:.72rem;
  font-weight:600;
  line-height:1;
  text-decoration:none;
  white-space:nowrap;
}
#gift-dialog .dialog-close.outline:hover{
  border-color:var(--ink);
  color:var(--ink);
  background:#f8efec;
}

/* Modal dos cinco presentes: ações leves, compactas e em uma única linha. */
#gift-dialog{
  width:min(780px,calc(100% - 32px));
  padding-right:42px;
  padding-bottom:36px;
  padding-left:42px;
}
#gift-dialog .gift-kicker{
  margin:0 0 28px;
  color:rgba(23,62,44,.66);
  font-size:.64rem;
  font-weight:500;
  letter-spacing:.14em;
  text-align:center;
}
#gift-dialog-content>.gift-kicker+div{
  color:#8ea071;
  font-size:2.9rem;
  font-weight:300;
  line-height:1;
  text-align:center;
}
#gift-dialog h2{
  max-width:660px;
  margin:26px auto 16px;
  font-size:3rem;
  line-height:.94;
  text-align:center;
}
#gift-dialog-content>h2+p{
  max-width:620px;
  margin:0 auto;
  color:rgba(23,62,44,.68);
  font-size:.86rem;
  line-height:1.65;
  text-align:center;
}
#gift-dialog .what{
  margin:30px 0 0;
  padding:18px 22px;
  border:1px solid rgba(23,62,44,.1);
  text-align:center;
}
#gift-dialog .what small{
  display:block;
  color:var(--ink);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.15em;
}
#gift-dialog .what p{margin:.45rem 0 0;line-height:1.45}
#gift-dialog .modal-actions{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:8px;
  margin-top:18px;
  justify-content:center;
}
#gift-dialog .modal-actions a,
#gift-dialog .modal-actions button{
  flex:0 0 auto;
  padding:8px 12px;
  border-color:rgba(23,62,44,.48);
  font-size:.72rem;
  font-weight:500;
  line-height:1.15;
  white-space:nowrap;
}
#gift-dialog .modal-actions .primary{font-weight:600}
#gift-dialog-content>.modal-actions+p{margin:14px 0 0;color:rgba(23,62,44,.62);line-height:1.35}

/* Retoma as divisórias e corrige a nota que estava atravessando a linha. */
.welcome{padding-bottom:24px}
.welcome-foot{padding-bottom:8px}
.welcome-foot{grid-template-columns:auto 1fr 1fr}
.welcome-foot p:first-child{position:static;margin:0}
.notice{
  margin:24px 5% 30px;
  padding:13px 18px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  gap:24px;
  color:rgba(23,62,44,.64);
  font-size:.68rem;
  letter-spacing:.005em;
}
.notice p{line-height:1.38}
@media(max-width:1000px){
  .site-header{grid-template-columns:1fr auto}
  .site-header>p strong{grid-column:2}
  .site-header>p span{display:none}
  .welcome{padding-top:36px;gap:24px 4%}
  .welcome h1{font-size:clamp(3.7rem,6.2vw,5.4rem)}
  .gift-visual{width:min(100%,440px)}
}
@media(max-width:700px){
  .site-header{min-height:76px;padding:12px 20px;grid-template-columns:1fr}
  .site-header>p strong{display:none}
  .welcome{min-height:auto;padding:38px 22px 26px;gap:40px}
  .welcome-copy{padding:0}
  .welcome .eyebrow{margin-bottom:20px}
  .welcome h1{font-size:clamp(3.55rem,16vw,4.55rem);margin-bottom:28px}
  .welcome .intro{margin-bottom:22px}
  .gift-visual{width:min(88vw,390px)}
  .welcome-foot{gap:18px;padding-top:22px}
  .welcome-foot p:first-child{margin:0}
  .collection{padding-top:38px}
  .collection-head{margin-bottom:32px}
  .collection h2{font-size:clamp(3.45rem,15vw,4.2rem);margin-bottom:22px}
  .progress{margin:22px 0 0}
  .gift-grid{gap:14px}
  .gift-card{padding:24px;min-height:270px}
  .gift-card h3{font-size:1.5rem;min-height:auto}
  .gift-card>span{margin-top:16px}
  .return-row{margin-top:26px;align-items:center;gap:12px}
  .welcome{padding-bottom:0}
  .notice{margin:0 22px 16px;padding:11px 4px;gap:10px;font-size:.66rem}
  .welcome-foot p:first-child{margin:0}
  .notice{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  #gift-dialog{padding-top:66px}
  #gift-dialog .dialog-close.outline{top:18px;font-size:.68rem;padding:6px 10px}
  #gift-dialog{padding-right:20px;padding-bottom:28px;padding-left:20px}
  #gift-dialog h2{font-size:2.45rem}
  #gift-dialog .gift-kicker{margin-bottom:22px}
  #gift-dialog-content>.gift-kicker+div{font-size:2.45rem}
  #gift-dialog-content>h2+p{font-size:.8rem}
  #gift-dialog .modal-actions{gap:6px;overflow-x:auto;padding-bottom:4px}
  #gift-dialog .modal-actions a,
  #gift-dialog .modal-actions button{padding:7px 9px;font-size:.65rem}
}
