:root { box-sizing: border-box; padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); }
:root{
  --navy:#16213E; --gold:#16213E; --gold-tint:#F4F5F8; --cream:#FFFFFF; --cream-2:#F6F7FA;
  --terracotta:#16213E; --border:#E4E6EC; --muted:#767B8A;
}
*{box-sizing:border-box;}
body{margin:0;font-family:'Poppins',sans-serif;background:#FFFFFF;color:#101522;}
a{color:var(--navy);}
a:hover{color:#000;}
input:focus, button:focus{outline:2px solid var(--navy);outline-offset:2px;}
button{font-family:'Poppins',sans-serif;cursor:pointer;}

.page-root{width:100%;min-height:100vh;}

.announce-bar{width:100%;background:var(--navy);color:#FFFFFF;text-align:center;padding:14px 20px;font-size:16px;font-weight:300;letter-spacing:.015em;}

.hero{padding:72px 64px 48px;max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:56px;justify-content:space-between;position:relative;background:#FFFFFF;}
.hero-text{flex-shrink:0;max-width:600px;}
.hero-img{width:340px;flex-shrink:0;position:relative;}
.hero-img .splash{position:absolute;pointer-events:none;z-index:0;}
.hero-illustration{width:100%;height:auto;display:block;filter:drop-shadow(0 18px 30px rgba(16,21,34,.16));}
.badge{display:block;color:var(--muted);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;margin-bottom:20px;}
.signature{position:absolute;top:34px;right:330px;transform:rotate(-4deg);z-index:3;}
.signature img{display:block;width:190px;height:auto;}
.hero h1{margin:0 0 20px;font-family:'Cormorant Garamond',serif;font-weight:400;font-size:60px;line-height:0.92;letter-spacing:-0.005em;color:#0E1420;}
.gold-rule{width:64px;height:1px;background:var(--navy);margin-bottom:22px;}
.hero p{margin:0;font-size:16px;line-height:1.7;color:var(--muted);max-width:460px;}

.it-flag{display:flex;width:120px;height:8px;overflow:hidden;box-shadow:0 0 0 1px rgba(0,0,0,.06);flex-shrink:0;}
.it-flag span{flex:1;}
.it-flag span:nth-child(1){background:#009246;}
.it-flag span:nth-child(2){background:#F1F2F1;}
.it-flag span:nth-child(3){background:#CE2B37;}
.it-caption{display:inline-flex;flex-direction:column;align-items:center;gap:8px;}
.it-caption em{font-style:normal;font-family:'Poppins',sans-serif;font-weight:500;font-size:11px;color:var(--muted);letter-spacing:.14em;text-transform:uppercase;text-align:center;}

.why-section{background:#FBFBFC;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:64px 64px 56px;}
.why-inner{max-width:1180px;margin:0 auto;text-align:center;}
.why-eyebrow{margin-bottom:14px;}
.why-title{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:44px;letter-spacing:-0.005em;text-transform:none;color:#0E1420;margin:0 0 44px;line-height:1.15;}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:36px;text-align:left;}
.why-num{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:17px;color:var(--muted);margin-bottom:10px;}
.why-item h3{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:21px;letter-spacing:0;text-transform:none;color:#0E1420;margin:0 0 12px;line-height:1.25;}
.why-item p{font-size:13.5px;line-height:1.7;color:var(--muted);margin:0;}

.main-wrap{padding:0 64px 64px;max-width:1180px;margin:0 auto;}
.main-layout{display:flex;gap:48px;align-items:flex-start;}
.content-col{flex-grow:1;display:flex;flex-direction:column;gap:52px;min-width:0;}
.summary-col{width:340px;flex-shrink:0;position:sticky;top:96px;}

.step-head{display:flex;align-items:center;gap:12px;margin-bottom:6px;}
.step-num{width:28px;height:28px;border-radius:999px;background:var(--navy);color:var(--cream);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0;}
.step-title{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:26px;}
.step-label{margin-left:40px;}
.step-label.muted{font-size:14px;color:var(--muted);margin-top:4px;margin-bottom:20px;}

.howto-section{background:#FFFFFF;padding:56px 64px 60px;}
.howto-inner{max-width:1080px;margin:0 auto;}
.howto-eyebrow{text-align:center;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:10px;}
.howto-title{text-align:center;font-family:'Cormorant Garamond',serif;font-weight:500;font-size:32px;color:#0E1420;margin:0 0 44px;}
.howto-row{display:flex;align-items:flex-start;justify-content:space-between;position:relative;}
.howto-row::before{content:'';position:absolute;top:23px;left:60px;right:60px;height:1px;background:var(--border);z-index:0;}
.howto-step{position:relative;z-index:1;flex:1;text-align:center;padding:0 10px;}
.howto-circle{width:46px;height:46px;border-radius:50%;background:#FFFFFF;border:1.5px solid var(--navy);color:var(--navy);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:600;margin:0 auto 16px;}
.howto-step h4{font-family:'Poppins',sans-serif;font-weight:600;font-size:13.5px;letter-spacing:.02em;color:#0E1420;margin:0 0 8px;}
.howto-step p{font-size:12.5px;line-height:1.6;color:var(--muted);margin:0;max-width:190px;margin-left:auto;margin-right:auto;}
.small-note{margin-top:16px;font-size:13px;display:flex;gap:8px;align-items:flex-start;}

.sabores-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
.sabor-card{background:#FFFFFF;border:1px solid var(--border);border-radius:4px;overflow:hidden;display:flex;flex-direction:column;}
.sabor-img{width:100%;height:110px;background:#FAFAFB;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--border);}
.sabor-body{padding:20px;display:flex;flex-direction:column;gap:14px;}
.sabor-nome{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:21px;color:#0E1420;}
.sabor-preco{font-size:14px;color:var(--navy);font-weight:500;margin-top:4px;}
.sabor-info{display:flex;flex-direction:column;gap:5px;font-size:11.5px;color:var(--muted);border-top:1px solid var(--border);padding-top:12px;}
.sabor-info span{display:flex;justify-content:space-between;text-transform:uppercase;letter-spacing:.03em;}
.sabor-info span strong{color:#333;font-weight:600;letter-spacing:normal;text-transform:none;}
.qty-control{display:flex;align-items:center;justify-content:space-between;background:var(--cream-2);border-radius:999px;padding:6px;}
.qty-btn{width:32px;height:32px;border-radius:999px;border:none;font-size:16px;line-height:1;box-shadow:0 1px 3px rgba(0,0,0,.12);}
.qty-dec{background:#FFFFFF;}
.qty-inc-primary{background:var(--terracotta);color:#FFFFFF;}
.qty-value{min-width:20px;text-align:center;font-weight:700;}

.toggle-row{display:flex;gap:12px;margin-bottom:20px;flex-wrap:wrap;}
.pill-btn{padding:14px 22px;border-radius:2px;font-size:14px;font-weight:500;border:1px solid var(--border);background:#FFF;color:var(--navy);display:flex;align-items:center;gap:8px;}
.pill-btn.active{background:var(--terracotta);border-color:var(--terracotta);color:#FFF;}

.info-box{background:#FFFFFF;border:1px solid var(--border);border-radius:4px;padding:18px 20px;font-size:14px;line-height:1.6;}
.info-box-title{font-weight:700;margin-bottom:4px;}

.zonas-row{display:flex;gap:10px;flex-wrap:wrap;}
.zone-btn{padding:12px 16px;border-radius:2px;font-size:14px;text-align:left;border:1px solid var(--border);background:#FFF;color:var(--navy);}
.zone-btn.active{border-color:var(--navy);background:var(--cream-2);}
.zone-fee{font-weight:700;}

.calendar-box{background:#FFFFFF;border:1px solid var(--border);border-radius:4px;padding:20px;max-width:420px;}
.cal-month{font-size:13px;font-weight:700;color:#1B2438;margin-bottom:10px;}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:8px;}
.cal-weekday{text-align:center;font-size:11px;color:#9AA3BB;font-weight:700;}
.cal-day{height:32px;border-radius:8px;font-size:12.5px;border:1px solid var(--border);background:#FFF;color:#1B2438;}
.cal-day.disabled{color:#D6D9E0;background:transparent;border:none;cursor:default;}
.cal-day.selected{color:#FFF;background:var(--terracotta);border-color:var(--terracotta);font-weight:700;}
.cal-day.blank{visibility:hidden;}
.cal-selected{margin-top:16px;padding-top:14px;border-top:1px solid var(--border);font-size:13px;}

.cliente-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:560px;}
.field{display:flex;flex-direction:column;gap:6px;}
.field label{font-size:13px;font-weight:600;color:#4A5568;}
.field input{padding:13px 14px;border-radius:2px;border:1px solid var(--border);font-size:14px;font-family:'Poppins',sans-serif;}

.summary-card{background:var(--navy);border-radius:4px;overflow:hidden;padding:32px 28px;display:flex;flex-direction:column;gap:16px;}
.summary-eyebrow{font-size:11px;font-weight:600;color:#9AA3BB;letter-spacing:.14em;text-transform:uppercase;margin-bottom:6px;}
.summary-title{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:23px;color:var(--cream);}
.summary-lines{display:flex;flex-direction:column;gap:8px;font-size:14px;border-top:1px solid rgba(255,255,255,.14);padding-top:14px;}
.summary-line{display:flex;justify-content:space-between;color:#B7BECC;}
.summary-total{display:flex;justify-content:space-between;font-size:20px;font-weight:700;border-top:1px solid rgba(255,255,255,.14);padding-top:14px;color:var(--cream);}
.summary-total span:last-child{color:#FFFFFF;}
.btn-pagar{margin-top:4px;padding:14px 16px;border-radius:4px;border:1px solid #FFE600;background:#FFE600;color:#00263A;font-size:14px;font-weight:700;letter-spacing:.02em;width:100%;display:flex;align-items:center;justify-content:center;gap:12px;}
.btn-pagar svg{flex-shrink:0;}
.mp-logo-chip{display:flex;align-items:center;line-height:0;}
.mp-logo-chip-sm{}
.btn-pagar-label{display:flex;flex-direction:column;align-items:flex-start;line-height:1.25;}
.btn-pagar-label small{font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;opacity:.75;}
.btn-pagar-label span{font-size:14px;font-weight:700;}
.btn-whatsapp{padding:14px;border-radius:4px;border:1px solid #25D366;background:#25D366;color:#FFFFFF;font-size:14px;font-weight:600;letter-spacing:.02em;width:100%;display:flex;align-items:center;justify-content:center;gap:8px;}
.btn-whatsapp svg{flex-shrink:0;}
.summary-foot{font-size:12px;color:#8891A3;text-align:center;}
.summary-error{font-size:13px;color:#FF9E85;text-align:center;min-height:16px;}

.mobile-bar{display:none;}

.snowfall{position:fixed;inset:0;pointer-events:none;z-index:2;overflow:hidden;}
.flake{position:absolute;top:-24px;color:#D9B45C;text-shadow:0 0 5px rgba(212,175,90,.6);line-height:1;animation-name:flake-fall;animation-timing-function:linear;animation-iteration-count:infinite;}
@keyframes flake-fall{
  0%{transform:translateY(-24px) translateX(0) rotate(0deg);}
  100%{transform:translateY(108vh) translateX(var(--drift,20px)) rotate(160deg);}
}
@media (prefers-reduced-motion: reduce){
  .snowfall{display:none;}
}

@media (max-width:900px){
  .announce-bar{font-size:13px;padding:11px 16px;}
  .hero{padding:36px 20px 24px;flex-direction:column;gap:24px;}
  .hero-img{width:220px;order:-1;}
  .signature{position:static;margin:0 0 6px 4px;}
  .signature img{width:150px;}
  .why-section{padding:44px 20px 40px;}
  .why-title{font-size:26px;margin-bottom:32px;}
  .why-grid{grid-template-columns:1fr 1fr;gap:28px;}
  .howto-section{padding:40px 20px 44px;}
  .howto-title{font-size:24px;margin-bottom:32px;}
  .howto-row{flex-direction:column;gap:28px;}
  .howto-row::before{display:none;}
  .howto-step p{max-width:none;}
  .main-wrap{padding:0 20px 110px;}
  .main-layout{flex-direction:column;gap:36px;}
  .summary-col{width:100%;position:static;}
  .mobile-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--navy);padding:14px 20px;align-items:center;justify-content:space-between;box-shadow:0 -6px 24px rgba(0,0,0,.18);}
  .mobile-bar-label{font-size:11px;color:#9AA3BB;}
  .mobile-bar-value{font-size:18px;font-weight:700;color:var(--cream);}
  .btn-pagar-mobile{padding:12px 18px;border-radius:4px;border:none;background:#FFE600;color:#00263A;font-size:13px;font-weight:700;letter-spacing:.02em;display:flex;align-items:center;gap:8px;}
}
@media (max-width:640px){
  .sabores-grid{grid-template-columns:1fr;}
  .cliente-grid{grid-template-columns:1fr;}
  .step-label, .cliente-grid{margin-left:0 !important;}
  .why-grid{grid-template-columns:1fr;}
}


.mp-logo{height:37px;width:auto;display:block;}
.mp-logo-sm{height:28px;}

.btn-pagar.is-loading, .btn-pagar-mobile.is-loading{opacity:.6;pointer-events:none;}
