@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@500;600;700&display=swap');

:root{
  --blue:#67b0cb;
  --blue-dark:#2b7896;
  --blue-deep:#1d5d75;
  --pink:#f3b7bb;
  --pink-dark:#d9858e;
  --pink-soft:#fdebed;
  --cream:#fffaf7;
  --white:#fff;
  --ink:#292322;
  --muted:#705e56;
  --line:#e4eef1;
  --shadow:0 18px 50px rgba(43,120,150,.12);
  --shadow-strong:0 25px 70px rgba(0,0,0,.16);
  --radius:22px;
  --max:1180px;
}

*{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

html{
  scroll-behavior:smooth;
  scroll-padding-top:82px;
}

body{
  min-height:100vh;
  background:var(--cream);
  color:var(--ink);
  font-family:"DM Sans",sans-serif;
  overflow-x:hidden;
}

body,
button,
input,
textarea,
select{
  font-family:"DM Sans",sans-serif;
}

button,
a{
  -webkit-tap-highlight-color:transparent;
}

button{
  cursor:pointer;
}

img,
video,
iframe{
  max-width:100%;
}

img{
  display:block;
}

a{
  color:inherit;
  text-decoration:none;
}

.hidden{
  display:none!important;
}


/* =========================================================
   GERAL
========================================================= */

.section{
  position:relative;
  padding:88px 20px;
  overflow:hidden;
}

.section-inner{
  width:min(100%,var(--max));
  margin:0 auto;
}

.reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s ease,transform .7s ease;
}

.reveal.visible{
  opacity:1;
  transform:translateY(0);
}


/* =========================================================
   HEADER
========================================================= */

.top{
  position:fixed;
  z-index:1000;
  top:0;
  left:0;
  width:100%;
  height:76px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  padding:9px 28px;

  background:rgba(255,250,247,.94);

  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);

  border-bottom:1px solid rgba(103,176,203,.18);

  box-shadow:0 8px 30px rgba(43,120,150,.07);
}

.brand{
  width:58px;
  height:58px;

  display:flex;
  align-items:center;
  justify-content:center;

  flex-shrink:0;
}

.brand img{
  width:100%;
  height:100%;
  object-fit:contain;

  background:transparent!important;
  mix-blend-mode:normal;
}

.brand span{
  display:none;
}

.top nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:24px;
}

.top nav a{
  position:relative;

  font-size:.88rem;
  font-weight:700;

  color:var(--ink);

  transition:
    color .2s ease,
    transform .2s ease;
}

.top nav a::after{
  content:"";

  position:absolute;

  left:0;
  bottom:-6px;

  width:0;
  height:2px;

  background:var(--blue);

  border-radius:20px;

  transition:width .2s ease;
}

.top nav a:hover{
  color:var(--blue-dark);
  transform:translateY(-1px);
}

.top nav a:hover::after{
  width:100%;
}


/* =========================================================
   BOTÕES
========================================================= */

.cart-btn{
  position:relative;

  width:46px;
  height:46px;

  display:flex;
  align-items:center;
  justify-content:center;

  border:0;
  border-radius:50%;

  background:var(--blue);
  color:white;

  font-size:1.15rem;

  box-shadow:0 10px 25px rgba(43,120,150,.22);

  transition:
    transform .2s ease,
    background .2s ease;
}

.cart-btn:hover{
  background:var(--blue-dark);
  transform:translateY(-2px);
}

.cart-btn span{
  position:absolute;

  top:-4px;
  right:-4px;

  min-width:19px;
  height:19px;

  display:flex;
  align-items:center;
  justify-content:center;

  padding:0 4px;

  border-radius:50%;

  background:var(--pink-dark);
  color:white;

  font-size:.65rem;
  font-weight:800;

  border:2px solid var(--cream);
}

.btn{
  min-height:46px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  gap:7px;

  padding:11px 22px;

  border:2px solid transparent;
  border-radius:999px;

  font-size:.88rem;
  font-weight:700;

  transition:
    transform .2s ease,
    box-shadow .2s ease,
    background .2s ease,
    color .2s ease;
}

.btn:hover{
  transform:translateY(-2px);
}

.btn.primary{
  background:var(--blue);
  color:white;

  box-shadow:0 10px 25px rgba(43,120,150,.22);
}

.btn.primary:hover{
  background:var(--blue-dark);
}

.btn.ghost{
  background:rgba(255,255,255,.9);
  color:var(--blue-dark);

  border-color:rgba(103,176,203,.4);
}

.btn.ghost:hover{
  background:white;
}

.btn.full{
  width:100%;
}


/* =========================================================
   HERO
========================================================= */

.hero{
  position:relative;

  min-height:100svh;

  display:flex;
  align-items:center;
  justify-content:center;

  padding:115px 20px 70px;

  overflow:hidden;

  background:var(--blue-deep);
}

.hero-video{
  position:absolute;
  inset:0;

  width:100%;
  height:100%;

  object-fit:cover;

  z-index:0;
}

.hero-overlay{
  position:absolute;
  inset:0;

  z-index:1;

  background:rgba(15,45,57,.62);
}

.hero-content{
  position:relative;
  z-index:2;

  width:min(760px,100%);

  display:flex;
  flex-direction:column;
  align-items:center;

  text-align:center;

  color:white;
}

.hero-logo{
  width:155px;
  height:155px;

  display:flex;
  align-items:center;
  justify-content:center;

  margin-bottom:15px;

  animation:logoFloat 4s ease-in-out infinite;
}

.hero-logo-image{
  width:100%;
  height:100%;

  object-fit:contain;

  background:transparent!important;
  mix-blend-mode:normal;

  filter:drop-shadow(0 12px 22px rgba(0,0,0,.16));
}

.hero-kicker{
  margin-bottom:8px;

  font-size:.72rem;
  font-weight:700;

  letter-spacing:.14em;
  text-transform:uppercase;

  color:rgba(255,255,255,.86);
}

.hero h1{
  max-width:650px;

  font-family:"Playfair Display",serif;

  font-size:clamp(2.25rem,5vw,4rem);

  font-weight:600;
  line-height:1.08;

  margin-bottom:15px;

  text-shadow:0 6px 20px rgba(0,0,0,.2);
}

.hero-description{
  max-width:560px;

  margin-bottom:25px;

  font-size:.93rem;
  line-height:1.65;

  color:rgba(255,255,255,.9);
}

.hero-actions{
  display:flex;
  justify-content:center;
}

.hero-actions .btn{
  min-width:215px;
}


/* =========================================================
   TÍTULOS
========================================================= */

.section-head{
  max-width:760px;

  margin:0 auto 42px;

  text-align:center;
}

.eyebrow{
  display:inline-block;

  margin-bottom:8px;

  color:var(--blue-dark);

  font-size:.7rem;
  font-weight:700;

  letter-spacing:.13em;
  text-transform:uppercase;
}

.section-head h2,
.about .section-head h2,
.cake-copy h2,
.drawer-head h2,
.dialog-head h2{
  font-family:"Playfair Display",serif;
  font-weight:600;
}

.section-head h2{
  color:var(--ink);

  font-size:clamp(2rem,4vw,3.25rem);

  line-height:1.12;

  margin-bottom:12px;
}

.section-head p{
  color:var(--muted);

  font-size:.92rem;
  line-height:1.7;
}


/* =========================================================
   HISTÓRIA
========================================================= */

.about{
  background:
    radial-gradient(
      circle at 10% 20%,
      rgba(103,176,203,.1),
      transparent 30%
    ),
    var(--cream);
}

.about .section-head{
  margin-bottom:30px;
}

.about .section-head h2{
  color:var(--blue-deep);

  max-width:820px;

  margin-inline:auto;

  font-size:clamp(1.9rem,4vw,3rem);
}

.about-content{
  width:min(900px,100%);
  margin:0 auto;
}

.about-copy{
  padding:38px;

  background:rgba(255,255,255,.9);

  border:1px solid rgba(103,176,203,.16);

  border-radius:var(--radius);

  box-shadow:var(--shadow);
}

.quote{
  margin-bottom:25px;

  text-align:center;

  font-family:"Playfair Display",serif;

  font-size:clamp(1.35rem,3vw,2rem);

  font-weight:600;

  color:var(--blue-dark);
}

#aboutText{
  color:var(--muted);

  font-size:.92rem;
  line-height:1.85;
}

#aboutText p{
  margin-bottom:17px;
}

.about-signature{
  margin-top:30px;

  padding-top:23px;

  display:flex;
  flex-direction:column;
  align-items:center;

  text-align:center;

  border-top:1px solid var(--line);

  gap:5px;
}

.about-signature span{
  color:var(--blue-dark);

  font-size:.84rem;
  font-weight:600;
}

.about-signature strong{
  font-family:"Playfair Display",serif;

  color:var(--pink-dark);

  font-size:1.45rem;
  font-weight:600;

  animation:signatureFloat 3s ease-in-out infinite;
}

.about-signature small{
  color:var(--muted);
  font-size:.76rem;
}


/* =========================================================
   PRONTA ENTREGA
========================================================= */

.ready-section{
  background:linear-gradient(
    135deg,
    #fffaf7,
    #f4fbfd
  );
}

.ready-section .section-action{
  display:flex;
  justify-content:center;

  margin-top:35px;
}


/* =========================================================
   PRODUTOS
========================================================= */

.products-grid{
  display:grid;

  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:22px;
}

.product{
  overflow:hidden;

  display:flex;
  flex-direction:column;

  background:white;

  border:1px solid var(--line);

  border-radius:var(--radius);

  box-shadow:var(--shadow);

  transition:
    transform .25s ease,
    box-shadow .25s ease;
}

.product:hover{
  transform:translateY(-6px);

  box-shadow:
    0 22px 50px
    rgba(43,120,150,.14);
}

.product-img{
  position:relative;

  width:100%;
  height:220px;

  display:flex;
  align-items:center;
  justify-content:center;

  overflow:hidden;

  background:
    linear-gradient(
      135deg,
      #e9f6fa,
      #fdebed
    );
}

.product-img img{
  width:100%;
  height:100%;

  object-fit:cover;

  transition:transform .45s ease;
}

.product:hover .product-img img{
  transform:scale(1.04);
}

.product-img span{
  color:var(--blue-dark);

  font-family:"Playfair Display",serif;

  font-size:1.55rem;
  font-weight:600;
}

.product-body{
  flex:1;

  display:flex;
  flex-direction:column;

  padding:20px;
}

.tag{
  width:fit-content;

  padding:4px 9px;

  margin-bottom:8px;

  border-radius:999px;

  background:var(--pink-soft);
  color:var(--pink-dark);

  font-size:.65rem;
  font-weight:700;

  text-transform:uppercase;
}

.product-body h3{
  margin-bottom:7px;

  color:var(--ink);

  font-size:1rem;
  font-weight:700;
}

.product-body p{
  min-height:42px;

  margin-bottom:15px;

  color:var(--muted);

  font-size:.82rem;
  line-height:1.55;
}

.product-row{
  margin-top:auto;

  display:flex;

  align-items:center;
  justify-content:space-between;

  gap:10px;
}

.product-row strong{
  color:var(--blue-dark);

  font-size:1rem;
  font-weight:800;
}

.add,
.add-ready{
  border:0;

  padding:8px 13px;

  border-radius:999px;

  background:var(--blue);

  color:white;

  font-size:.72rem;
  font-weight:700;
}

.add:hover,
.add-ready:hover{
  background:var(--blue-dark);
}

.unavailable{
  color:var(--pink-dark);

  font-size:.7rem;
  font-weight:700;
}


/* =========================================================
   ENCOMENDA / BOLOS
========================================================= */

.cake-section{
  position:relative;

  min-height:650px;

  display:flex;
  align-items:stretch;
  justify-content:center;

  padding:0!important;

  overflow:hidden;

  background:var(--blue-deep);
}

.cake-section .section-inner{
  width:100%;
  max-width:none;

  margin:0;
}

.cake-feature{
  position:relative;

  width:100%;
  min-height:650px;

  display:flex;

  align-items:center;
  justify-content:center;

  overflow:hidden;

  border-radius:0;

  background:var(--blue-deep);

  box-shadow:none;
}

.cake-video{
  position:absolute;

  inset:0;

  width:100%;
  height:100%;

  overflow:hidden;
}

.cake-video video{
  width:100%;
  height:100%;

  object-fit:cover;
}

.cake-video-overlay{
  position:absolute;

  inset:0;

  background:rgba(18,54,69,.45);
}

.cake-copy{
  position:relative;

  z-index:2;

  width:min(700px,90%);

  padding:0;

  text-align:center;

  background:transparent!important;

  border:0!important;
  border-radius:0!important;

  backdrop-filter:none!important;

  -webkit-backdrop-filter:none!important;

  box-shadow:none!important;
}

.cake-copy .eyebrow{
  color:rgba(255,255,255,.85);
}

.cake-copy h2{
  margin-bottom:14px;

  color:white;

  font-size:clamp(2rem,5vw,3.4rem);

  line-height:1.1;
}

.cake-copy p{
  max-width:580px;

  margin:0 auto 25px;

  color:rgba(255,255,255,.94);

  font-size:.92rem;

  line-height:1.7;
}

.cake-actions{
  display:flex;
  justify-content:center;
}

.cake-actions .btn{
  min-width:220px;
}


/* =========================================================
   CARDÁPIO
========================================================= */

.menu-section{
  background:var(--cream);
}

.tabs{
  display:flex;

  align-items:center;
  justify-content:center;

  flex-wrap:wrap;

  gap:9px;

  margin-bottom:32px;
}

.tab{
  padding:9px 15px;

  border:1px solid rgba(103,176,203,.35);

  border-radius:999px;

  background:white;

  color:var(--blue-dark);

  font-size:.76rem;
  font-weight:700;
}

.tab:hover{
  transform:translateY(-1px);
}

.tab.active{
  background:var(--blue);

  color:white;

  border-color:var(--blue);

  box-shadow:
    0 7px 18px
    rgba(43,120,150,.18);
}

.empty{
  width:100%;

  padding:30px;

  text-align:center;

  border-radius:var(--radius);

  background:white;

  border:1px dashed var(--line);

  color:var(--muted);
}


/* =========================================================
   CONTATO
========================================================= */

.contact-section{
  background:
    linear-gradient(
      180deg,
      #f4fbfd,
      #fffaf7
    );
}

.contact-grid{
  display:grid;

  grid-template-columns:
    minmax(0,.85fr)
    minmax(0,1.15fr);

  gap:22px;
}

.contact-card,
.map-card{
  background:white;

  border:1px solid var(--line);

  border-radius:var(--radius);

  box-shadow:var(--shadow);
}

.contact-card{
  padding:28px;
}

.contact-card h3,
.map-card h3{
  color:var(--ink);

  font-size:1.15rem;
  font-weight:700;
}

.contact-info{
  display:flex;

  flex-direction:column;

  gap:21px;

  margin:24px 0;
}

.contact-item{
  display:flex;

  align-items:flex-start;

  gap:12px;
}

.contact-item>span{
  width:36px;
  height:36px;

  flex-shrink:0;

  display:flex;

  align-items:center;
  justify-content:center;

  border-radius:50%;

  background:var(--pink-soft);

  font-size:.95rem;
}

.contact-item p{
  color:var(--muted);

  font-size:.84rem;

  line-height:1.65;
}

.open-state{
  margin-bottom:9px;

  font-size:.78rem;

  font-weight:700;

  color:var(--pink-dark);
}

.open-state.is-open{
  color:#32916a;
}

#hours{
  display:flex;

  flex-direction:column;

  gap:6px;
}

.hour{
  display:flex;

  align-items:center;
  justify-content:space-between;

  gap:15px;

  padding-bottom:6px;

  border-bottom:1px solid #f0f0f0;

  font-size:.74rem;
}

.hour span{
  color:var(--muted);
}

.hour b{
  color:var(--ink);
}

.contact-actions{
  display:flex;

  flex-wrap:wrap;

  gap:9px;
}

.map-card{
  overflow:hidden;
}

.map-head{
  padding:23px;

  display:flex;

  align-items:center;
  justify-content:space-between;

  gap:15px;
}

.map-head .eyebrow{
  margin-bottom:2px;
}

.map-head a{
  color:var(--blue-dark);

  font-size:.74rem;
  font-weight:700;
}

.map-frame{
  width:100%;
  height:370px;

  overflow:hidden;
}

.map-frame iframe{
  width:100%;
  height:100%;

  display:block;

  border:0;
}


/* =========================================================
   AVALIAÇÃO
========================================================= */

.review-card{
  margin-top:22px;

  padding:26px 30px;

  display:flex;

  align-items:center;
  justify-content:space-between;

  gap:25px;

  background:
    linear-gradient(
      135deg,
      #e9f8fc,
      #fdebed
    );

  border:1px solid rgba(103,176,203,.2);

  border-radius:var(--radius);

  box-shadow:var(--shadow);
}

.review-content h3{
  margin:3px 0 7px;

  color:var(--ink);

  font-size:1.15rem;
  font-weight:700;
}

.review-content p{
  color:var(--muted);

  font-size:.82rem;

  line-height:1.6;
}


/* =========================================================
   FOOTER
========================================================= */

.footer{
  padding:50px 20px 18px;

  background:#173e4e;

  color:white;
}

.footer-inner{
  width:min(100%,var(--max));

  margin:0 auto;

  display:flex;

  align-items:center;
  justify-content:space-between;

  gap:35px;
}

.footer-brand{
  display:flex;

  align-items:center;

  gap:14px;
}

.footer-brand img{
  width:62px;
  height:62px;

  object-fit:contain;

  background:transparent!important;
}

.footer-brand p{
  color:rgba(255,255,255,.78);

  font-size:.78rem;
}

.footer-links{
  display:flex;

  flex-wrap:wrap;

  justify-content:flex-end;

  gap:13px 20px;
}

.footer-links a{
  color:rgba(255,255,255,.82);

  font-size:.75rem;

  font-weight:600;
}

.footer-bottom{
  width:min(100%,var(--max));

  margin:30px auto 0;

  padding-top:17px;

  display:flex;

  justify-content:space-between;

  gap:20px;

  border-top:1px solid rgba(255,255,255,.12);

  color:rgba(255,255,255,.55);

  font-size:.68rem;
}


/* =========================================================
   CARRINHO
========================================================= */

.shade{
  position:fixed;

  z-index:1090;

  inset:0;

  background:rgba(15,35,43,.48);

  opacity:0;

  visibility:hidden;

  pointer-events:none;

  transition:
    opacity .3s ease,
    visibility .3s ease;
}

.shade.show{
  opacity:1;

  visibility:visible;

  pointer-events:auto;
}

.drawer{
  position:fixed;

  z-index:1100;

  top:0;
  right:0;

  width:min(430px,94vw);

  height:100vh;

  display:flex;

  flex-direction:column;

  background:white;

  box-shadow:
    -20px 0 60px
    rgba(0,0,0,.16);

  transform:translateX(105%);

  transition:
    transform .35s
    cubic-bezier(.22,.61,.36,1);
}

.drawer.show{
  transform:translateX(0);
}

.drawer-head{
  padding:25px 22px 18px;

  display:flex;

  align-items:flex-start;
  justify-content:space-between;

  border-bottom:1px solid var(--line);
}

.drawer-head h2{
  font-size:1.8rem;

  color:var(--blue-dark);
}

.icon-btn{
  width:38px;
  height:38px;

  display:flex;

  align-items:center;
  justify-content:center;

  border:0;

  border-radius:50%;

  background:var(--pink-soft);

  color:var(--pink-dark);

  font-size:1.3rem;
}

.cart-items{
  flex:1;

  overflow-y:auto;

  padding:18px;
}

.cart-item{
  padding:14px 0;

  display:flex;

  align-items:center;
  justify-content:space-between;

  gap:13px;

  border-bottom:1px solid var(--line);
}

.cart-item>div:first-child{
  min-width:0;

  display:flex;

  flex-direction:column;

  gap:3px;
}

.cart-item b{
  color:var(--ink);
}

.cart-item small{
  color:var(--muted);
}

.qty{
  display:flex;

  align-items:center;

  gap:8px;
}

.qty button{
  width:29px;
  height:29px;

  border:0;

  border-radius:50%;

  background:var(--blue);

  color:white;

  font-weight:800;
}

.drawer-footer{
  padding:18px;

  display:flex;

  flex-direction:column;

  gap:9px;

  border-top:1px solid var(--line);

  background:white;
}

.cart-total-row{
  display:flex;

  align-items:center;
  justify-content:space-between;

  font-size:.9rem;
}

.cart-total-row strong{
  color:var(--blue-dark);

  font-size:1.1rem;
}


/* =========================================================
   CHECKOUT
========================================================= */

.checkout-dialog{
  width:min(600px,calc(100% - 30px));

  max-height:90vh;

  padding:0;

  border:0;

  border-radius:23px;

  box-shadow:var(--shadow-strong);

  background:white;
}

.checkout-dialog::backdrop{
  background:rgba(15,35,43,.55);

  backdrop-filter:blur(4px);
}

.checkout-form{
  max-height:90vh;

  overflow-y:auto;

  padding:28px;
}

.dialog-head{
  margin-bottom:22px;

  display:flex;

  align-items:flex-start;
  justify-content:space-between;

  gap:18px;
}

.dialog-head h2{
  color:var(--blue-dark);

  font-size:1.9rem;
}

.checkout-form label{
  display:flex;

  flex-direction:column;

  gap:6px;

  margin-bottom:15px;

  color:var(--ink);

  font-size:.78rem;

  font-weight:700;
}

.checkout-form input,
.checkout-form select,
.checkout-form textarea{
  width:100%;

  padding:12px 14px;

  border:1px solid #dbe8eb;

  border-radius:13px;

  background:#fbfdfe;

  color:var(--ink);

  font-size:.88rem;

  outline:none;
}

.checkout-form input:focus,
.checkout-form select:focus,
.checkout-form textarea:focus{
  border-color:var(--blue);

  box-shadow:
    0 0 0 4px
    rgba(103,176,203,.11);
}

.dialog-actions{
  display:flex;

  justify-content:flex-end;

  gap:9px;

  margin-top:22px;
}


/* =========================================================
   PÁGINA DE ENCOMENDAS
========================================================= */

.custom-page{
  width:min(100%,1000px);

  max-width:100%;

  margin:0 auto;

  padding:125px 20px 80px;
}

.custom-page>.section-head{
  margin-bottom:35px;
}

.custom-page>.section-head h1{
  font-family:"Playfair Display",serif;

  color:var(--blue-deep);

  font-size:clamp(2rem,4.5vw,3.1rem);

  font-weight:600;

  line-height:1.15;

  margin-bottom:12px;
}

.custom-page>.section-head p{
  max-width:650px;

  margin:0 auto;
}

.cake-builder{
  display:flex;

  flex-direction:column;

  gap:20px;
}

.custom-builder{
  width:100%;

  max-width:850px;

  margin-left:auto;
  margin-right:auto;
}

.extras{
  width:100%;

  padding:25px;

  background:white;

  border:1px solid var(--line);

  border-radius:var(--radius);

  box-shadow:var(--shadow);

  min-width:0;
}

.extras legend{
  padding:0 8px;

  color:var(--blue-dark);

  font-family:"Playfair Display",serif;

  font-size:1.15rem;

  font-weight:600;
}

.cake-kind{
  margin-top:17px;
}

.cake-kind h3{
  margin-bottom:9px;

  color:var(--ink);

  font-size:.92rem;

  font-weight:700;
}

.extra-option{
  min-height:52px;

  display:flex;

  align-items:center;

  gap:12px;

  padding:11px 14px;

  margin-top:8px;

  border:1px solid var(--line);

  border-radius:14px;

  background:#fff;

  color:var(--ink);

  cursor:pointer;

  transition:
    border-color .2s ease,
    background .2s ease,
    transform .2s ease,
    box-shadow .2s ease;

  min-width:0;
}

.extra-option:hover{
  border-color:rgba(103,176,203,.55);

  background:#fafdfe;

  transform:translateY(-1px);
}

.extra-option:has(input:checked){
  border-color:var(--blue);

  background:#f2fbfd;

  box-shadow:
    0 6px 18px
    rgba(43,120,150,.08);
}

.extra-option input{
  width:17px;
  height:17px;

  flex-shrink:0;

  accent-color:var(--blue-dark);
}

.extra-option span{
  flex:1;

  min-width:0;

  font-size:.84rem;

  line-height:1.4;

  overflow-wrap:anywhere;
}

.extra-option strong{
  flex-shrink:0;

  color:var(--blue-dark);

  font-size:.82rem;

  font-weight:700;
}


/* =========================================================
   AVISO DE AGENDAMENTO
========================================================= */

.order-required-note{
  display:flex;

  flex-direction:column;

  gap:4px;

  padding:14px 16px;

  border:1px solid rgba(43,120,150,.18);

  border-radius:16px;

  background:#f2fbfd;

  color:var(--ink);
}

.order-required-note strong{
  color:var(--blue-dark);

  font-size:.86rem;
}

.order-required-note span{
  color:var(--muted);

  font-size:.76rem;
}


/* =========================================================
   BOLOS
========================================================= */

.cake-type-list{
  display:grid;

  gap:18px;

  width:100%;

  min-width:0;
}

.cake-type-card{
  padding:18px;

  border:1px solid var(--line);

  border-radius:18px;

  background:#fbfdfe;

  min-width:0;
}

.cake-type-card h3{
  margin:0 0 12px;

  color:var(--blue-dark);

  font-family:"Playfair Display",serif;

  font-size:1.15rem;
}

.cake-size-grid{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:8px;

  width:100%;

  min-width:0;
}

.cake-size-option{
  min-width:0;
}

.cake-size-option span{
  display:flex;

  flex-direction:column;

  gap:3px;

  min-width:0;
}

.cake-size-option small{
  font-size:.68rem;

  color:var(--muted);
}

.cake-size-option strong{
  flex-shrink:0;
}

.product-note{
  margin:10px 0 0;

  color:var(--muted);

  font-size:.7rem;
}


/* =========================================================
   KIT
========================================================= */

.kit-fixed-cake{
  padding:20px 22px;

  background:
    linear-gradient(
      135deg,
      #e9f8fc,
      #fdebed
    );

  border:1px solid rgba(103,176,203,.25);

  border-radius:var(--radius);

  color:var(--blue-dark);

  text-align:center;

  width:100%;
}

.kit-fixed-cake div{
  margin-bottom:5px;

  font-size:.75rem;

  font-weight:700;

  text-transform:uppercase;

  letter-spacing:.08em;
}

.kit-fixed-cake strong{
  font-family:"Playfair Display",serif;

  font-size:1.15rem;
}

.kit-mode-note{
  margin-top:14px;

  padding:12px 14px;

  border-radius:13px;

  background:var(--pink-soft);

  color:var(--muted);

  font-size:.8rem;

  line-height:1.55;
}

.cake-total{
  width:100%;

  padding:20px 24px;

  display:flex;

  align-items:center;
  justify-content:space-between;

  gap:15px;

  background:var(--blue-deep);

  color:white;

  border-radius:var(--radius);

  box-shadow:var(--shadow);

  min-width:0;
}

.cake-total span{
  font-size:.9rem;
}

.cake-total strong{
  font-size:1.35rem;

  flex-shrink:0;
}

.kit-section{
  margin-top:5px;
}

.kit-section .section-head,
.party-title,
.brigadeiro-section .section-head,
.other-orders-section .section-head{
  margin-bottom:22px;
}

.kit-section .section-head h2,
.party-title h2,
.brigadeiro-section .section-head h2,
.other-orders-section .section-head h2{
  font-size:clamp(1.65rem,4vw,2.35rem);
}

.kit-options{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:10px;

  width:100%;

  min-width:0;
}

.kit-option{
  align-items:flex-start;
}

.kit-option>span{
  display:flex;

  flex-direction:column;

  gap:4px;

  min-width:0;
}

.kit-option b{
  font-size:.86rem;
}

.kit-option small{
  color:var(--muted);

  font-size:.7rem;

  line-height:1.5;

  overflow-wrap:anywhere;
}

.kit-remove{
  width:100%;

  margin-top:12px;
}

.kit-included{
  margin-top:15px;

  padding:18px;

  background:#f7fcfd;

  border:1px solid rgba(103,176,203,.25);

  border-radius:17px;

  width:100%;
}

.kit-included-grid{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:8px;

  width:100%;
}

.kit-included-option{
  padding:11px;

  display:flex;

  flex-direction:column;

  gap:3px;

  border-radius:11px;

  background:white;

  border:1px solid var(--line);

  min-width:0;
}

.kit-included-option span{
  font-size:.78rem;

  font-weight:700;
}

.kit-included-option small{
  color:var(--blue-dark);

  font-size:.68rem;
}

.kit-choice-help{
  margin-top:13px;

  color:var(--muted);

  font-size:.78rem;

  line-height:1.6;
}


/* =========================================================
   BRIGADEIROS
========================================================= */

.party-title{
  padding-top:15px;
}

.brigadeiro-list,
.other-order-list{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:16px;

  width:100%;

  min-width:0;
}

.brigadeiro-box{
  padding:20px;

  background:white;

  border:1px solid var(--line);

  border-radius:18px;

  box-shadow:
    0 10px 30px
    rgba(43,120,150,.07);

  min-width:0;
}

.brigadeiro-box h3{
  margin-bottom:8px;

  color:var(--blue-dark);

  font-family:"Playfair Display",serif;

  font-size:1.1rem;

  font-weight:600;
}

.brigadeiro-box>p{
  margin-bottom:12px;

  color:var(--muted);

  font-size:.76rem;

  line-height:1.6;
}

.brigadeiro-quantities{
  display:flex;

  flex-direction:column;

  gap:7px;
}

.brigadeiro-quantities .extra-option{
  margin-top:0;
}

.brig-help{
  margin:9px 0!important;

  font-size:.7rem!important;
}

.flavor-choice{
  margin-top:14px;

  padding:14px;

  border-radius:14px;

  background:#f7fcfd;

  border:1px solid rgba(103,176,203,.25);
}

.flavor-choice>strong{
  display:block;

  color:var(--blue-dark);

  font-size:.76rem;

  line-height:1.5;

  margin-bottom:10px;
}

.flavor-grid{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:7px;

  width:100%;

  min-width:0;
}

.flavor-grid label{
  display:flex;

  align-items:center;

  gap:8px;

  padding:8px 9px;

  border:1px solid var(--line);

  border-radius:10px;

  background:#fff;

  font-size:.72rem;

  font-weight:500;

  min-width:0;
}

.flavor-grid label span{
  min-width:0;

  overflow-wrap:anywhere;
}

.flavor-grid input{
  accent-color:var(--blue-dark);

  flex-shrink:0;
}


/* =========================================================
   OUTROS ITENS
========================================================= */

.other-order-list label{
  display:flex;

  flex-direction:column;

  gap:6px;

  margin-top:12px;

  color:var(--ink);

  font-size:.76rem;

  font-weight:700;
}

.other-order-list select,
.other-order-list input{
  width:100%;

  padding:11px 12px;

  border:1px solid #dbe8eb;

  border-radius:12px;

  background:#fbfdfe;

  color:var(--ink);

  outline:none;
}

.other-item-box .text-field{
  margin-top:4px;
}

.other-price{
  margin-top:10px!important;

  color:var(--muted)!important;

  font-size:.7rem!important;

  font-weight:500;
}


/* =========================================================
   CAMPOS
========================================================= */

.text-field{
  display:flex;

  flex-direction:column;

  gap:6px;

  margin-top:12px;

  color:var(--ink);

  font-size:.78rem;

  font-weight:700;
}

.text-field input,
.text-field textarea{
  width:100%;

  padding:12px;

  border:1px solid #dbe8eb;

  border-radius:12px;

  background:#fbfdfe;

  color:var(--ink);

  outline:none;

  font:inherit;

  font-weight:400;

  resize:vertical;

  min-width:0;
}

.text-field input:focus,
.text-field textarea:focus{
  border-color:var(--blue);

  box-shadow:
    0 0 0 4px
    rgba(103,176,203,.11);
}


/* =========================================================
   ENVIO
========================================================= */

.submit-order{
  margin-top:5px;

  min-height:54px;
}


/* =========================================================
   ANIMAÇÕES
========================================================= */

@keyframes logoFloat{

  0%,100%{
    transform:translateY(0);
  }

  50%{
    transform:translateY(-6px);
  }

}

@keyframes signatureFloat{

  0%,100%{
    transform:translateY(0);
  }

  50%{
    transform:translateY(-3px);
  }

}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:950px){

  .top{
    padding-inline:18px;
  }

  .top nav{
    gap:13px;
  }

  .top nav a{
    font-size:.75rem;
  }

  .products-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .contact-grid{
    grid-template-columns:1fr;
  }

  .footer-inner{
    align-items:flex-start;
  }

  .kit-options,
  .brigadeiro-list,
  .other-order-list{
    grid-template-columns:1fr;
  }

}


/* =========================================================
   CELULAR
========================================================= */

@media(max-width:700px){

  html{
    scroll-padding-top:70px;
  }


  /* HEADER MOBILE */

  .top{

    height:auto!important;

    min-height:68px;

    padding:8px 12px 6px!important;

    display:flex!important;

    flex-wrap:wrap!important;

    align-items:center!important;

    justify-content:space-between!important;

    gap:4px 8px!important;

  }


  .brand{

    width:44px!important;

    height:44px!important;

    flex:0 0 44px!important;

  }


  .cart-btn{

    width:40px!important;

    height:40px!important;

    min-height:40px!important;

    flex:0 0 40px!important;

    padding:0!important;

  }


  .top nav{

    order:3!important;

    flex:0 0 100%!important;

    width:100%!important;

    max-width:none!important;

    min-width:0!important;

    display:flex!important;

    justify-content:flex-start!important;

    align-items:center!important;

    gap:16px!important;

    overflow-x:auto!important;

    overflow-y:hidden!important;

    padding:4px 2px 7px!important;

    scrollbar-width:none!important;

    -webkit-overflow-scrolling:touch;

  }


  .top nav::-webkit-scrollbar{
    display:none;
  }


  .top nav a{

    flex:0 0 auto!important;

    white-space:nowrap!important;

    font-size:.72rem!important;

    line-height:1!important;

  }


  /* GERAL */

  .section{
    padding:70px 15px;
  }


  .hero{
    padding-top:95px;
  }


  .hero-logo{
    width:125px;
    height:125px;
  }


  .hero h1{
    font-size:clamp(2rem,10vw,3rem);
  }


  .hero-description{
    font-size:.82rem;
  }


  .section-head h2{
    font-size:clamp(1.9rem,9vw,2.8rem);
  }


  .about-copy{
    padding:25px 18px;
  }


  .products-grid{
    grid-template-columns:1fr;
  }


  .cake-feature{
    min-height:560px;
  }


  .cake-copy{
    width:88%;
  }


  .cake-copy h2{
    font-size:clamp(1.9rem,10vw,3rem);
  }


  .cake-copy p{
    font-size:.82rem;
  }


  .tabs{
    justify-content:flex-start;

    flex-wrap:nowrap;

    overflow-x:auto;

    scrollbar-width:none;
  }


  .tabs::-webkit-scrollbar{
    display:none;
  }


  .tab{
    flex-shrink:0;
  }


  .contact-card{
    padding:23px 18px;
  }


  .map-head{
    align-items:flex-start;

    flex-direction:column;

    padding:20px 18px;
  }


  .map-frame{
    height:285px;
  }


  .review-card{
    padding:22px 18px;

    flex-direction:column;

    align-items:flex-start;
  }


  .review-card .btn{
    width:100%;
  }


  .footer-inner{
    flex-direction:column;
  }


  .footer-links{
    justify-content:flex-start;
  }


  .footer-bottom{
    flex-direction:column;
  }


  /* PÁGINA DE ENCOMENDA */

  .custom-page{

    width:100%!important;

    padding:
      125px
      12px
      55px!important;

  }


  .custom-page>.section-head{

    padding-inline:4px;

    margin-bottom:22px!important;

  }


  .custom-page>.section-head h1{

    font-size:
      clamp(
        1.8rem,
        9vw,
        2.45rem
      )!important;

    line-height:1.1!important;

  }


  .custom-page>.section-head p{

    font-size:.82rem!important;

    line-height:1.55!important;

  }


  .cake-builder{

    gap:14px!important;

    padding:0!important;

    background:transparent!important;

    box-shadow:none!important;

  }


  .extras{

    width:100%!important;

    padding:16px 13px!important;

    border-radius:17px!important;

  }


  .extras legend{
    font-size:1rem!important;
  }


  .cake-size-grid,
  .flavor-grid,
  .kit-options,
  .brigadeiro-list,
  .other-order-list{

    grid-template-columns:1fr!important;

  }


  .cake-type-card{
    padding:13px!important;
  }


  .cake-size-option,
  .extra-option{

    width:100%!important;

    padding:10px!important;

    min-height:46px!important;

  }


  .cake-size-option span,
  .extra-option span{

    font-size:.76rem!important;

    line-height:1.35!important;

  }


  .cake-size-option strong,
  .extra-option strong{

    font-size:.72rem!important;

  }


  .order-required-note{

    padding:12px 13px!important;

  }


  .order-required-note strong{
    font-size:.8rem!important;
  }


  .order-required-note span{
    font-size:.7rem!important;
  }


  .kit-fixed-cake,
  .kit-included{
    width:100%!important;
  }


  .kit-option>span{
    gap:3px!important;
  }


  .kit-option small{
    font-size:.67rem!important;
  }


  .flavor-grid label{

    width:100%!important;

    padding:8px!important;

    font-size:.72rem!important;

  }


  .text-field input,
  .text-field textarea,
  .other-order-list input{

    max-width:100%!important;

    font-size:.82rem!important;

  }


  .cake-total{

    flex-wrap:wrap;

    padding:15px!important;

  }


  .cake-total strong{
    font-size:1.05rem!important;
  }


  .submit-order{

    width:100%!important;

    min-height:50px!important;

  }

}


/* =========================================================
   CELULAR PEQUENO
========================================================= */

@media(max-width:450px){

  .top nav{

    max-width:calc(100vw - 112px);

    gap:5px;

  }


  .top nav a{
    font-size:.55rem;
  }


  .brand{
    width:40px!important;
    height:40px!important;
  }


  .cart-btn{
    width:38px!important;
    height:38px!important;
  }


  .hero-logo{
    width:110px;
    height:110px;
  }


  .hero-kicker{
    font-size:.65rem;
  }


  .hero-description{
    max-width:300px;
  }


  .btn{
    width:100%;
  }


  .hero-actions,
  .cake-actions{
    width:100%;
  }


  .hero-actions .btn,
  .cake-actions .btn{
    width:100%;
  }


  .contact-actions{
    flex-direction:column;
  }


  .contact-actions .btn{
    width:100%;
  }


  .dialog-actions{
    flex-direction:column-reverse;
  }


  .dialog-actions .btn{
    width:100%;
  }


  .extra-option{
    padding:10px 11px;
  }


  .extra-option span{
    font-size:.78rem;
  }


  .custom-page{
    padding-left:9px!important;
    padding-right:9px!important;
  }


  .custom-page>.section-head h1{
    font-size:1.8rem;
  }


  .extras{
    padding-left:11px!important;
    padding-right:11px!important;
  }

}


/* =========================================================
   AJUSTES FINAIS DE TIPOGRAFIA
========================================================= */

body{
  font-size:14px;
}

p,
li,
.contact-item,
.hour,
.product-body,
.menu-section,
.contact-section{
  font-size:12px;
}

.btn{
  font-size:13px;
}

.product-body h3{
  font-size:15px;
}

.product-body p{
  font-size:12px;
}

.quote{
  font-size:16px;
}

.about-signature{
  font-size:14px;
}


/* =========================================================
   PROTEÇÃO CONTRA ESTOURO NO CELULAR
========================================================= */

html{
  overflow-x:hidden;
}

body{
  overflow-x:hidden;
}

.custom-page{
  max-width:100%;
}

.custom-builder fieldset,
.custom-builder section,
.custom-builder .cake-total,
.custom-builder .order-required-note{
  min-width:0;
  max-width:100%;
}

.cake-size-grid,
.kit-options,
.brigadeiro-list,
.other-order-list,
.flavor-grid{
  width:100%;
  min-width:0;
}

.cake-size-option,
.kit-option,
.flavor-grid label,
.extra-option{
  min-width:0;
}

.cake-size-option span,
.kit-option>span,
.flavor-grid label span{
  min-width:0;
  overflow-wrap:anywhere;
}

.cake-size-option strong,
.kit-option>strong,
.extra-option>strong{
  flex-shrink:0;
}


/* =========================================================
   CELULAR MUITO PEQUENO
========================================================= */

@media(max-width:380px){

  .top nav{
    gap:13px!important;
  }

  .top nav a{
    font-size:.68rem!important;
  }

  .custom-page{
    padding-left:9px!important;
    padding-right:9px!important;
  }

  .extras{
    padding-left:11px!important;
    padding-right:11px!important;
  }

}