/* ================= GLOBAL ================= */
:root {
  --bg:#f5f5f5;
  --white:#fff;
  --border:#dddddd;
  --black:#000;
}

*{margin:0;padding:0;box-sizing:border-box;}
body{
  font-family:system-ui,sans-serif;
  background:var(--bg);
  color:#222;
  line-height:1.6;
}
a{text-decoration:none;color:inherit;}
img{display:block;max-width:100%;}
.container{
  width:100%;max-width:1100px;margin:auto;padding:1.5rem;
}

/* ================= HEADER ================= */
header{
  background:#fff;border-bottom:1px solid #ddd;
  position:sticky;top:0;z-index:50;
}
.nav{
  display:flex;align-items:center;justify-content:space-between;
}
.logo{font-weight:700;text-transform:uppercase;font-size:.95rem;color:inherit;text-decoration:none;}
.logo:hover{opacity:.8; }
.logo span{opacity:.6; font-size: 70%;}
.nav-links{display:flex;align-items:center;gap:1rem;}
.nav-links a{padding:.4rem .8rem;border-radius:30px;font-size:.9rem;}
.nav-links a:hover{background:#eee;}
.nav-links a.active{background:#000;color:#fff;}
.nav-links a.active:hover{background:#222;}
.cart-icon{display:flex;align-items:center;gap:.35rem;}
.cart-count{background:#000;color:#fff;border-radius:999px;padding:3px 7px;font-size:.7rem;}
.nav-toggle{display:none;border:none;background:none;cursor:pointer;}
.nav-toggle span{width:22px;height:2px;background:#000;margin:5px 0;display:block;}

/* ================= HERO ================= */
.hero{
  margin-top:2rem;display:grid;
  grid-template-columns:2fr 1.3fr;gap:2rem;align-items:center;
}
.hero h1{font-size:2.5rem;margin-bottom:.8rem;}
.hero p{opacity:.75;margin-bottom:1.2rem;font-size:1rem;}
.hero .badge{padding:.3rem .7rem;border-radius:30px;font-size:.75rem;border:1px solid #ccc;margin-right:.4rem;}
.hero-box{background:#fff;border:1px solid #ddd;border-radius:14px;padding:1.5rem;}
.hero-box h3{opacity:.6;font-size:.8rem;margin-bottom:.6rem;}
.hero-box p{font-size:.9rem;margin-bottom:.8rem;}

/* ================= BUTTONS ================= */
.btn{display:inline-flex;align-items:center;justify-content:center;
 padding:.6rem 1.2rem;border-radius:40px;font-size:.9rem;font-weight:600;
 transition:.25s;border:1px solid transparent;cursor:pointer;}
.btn-primary{background:#000;color:#fff;}
.btn-primary:hover{background:#333;}
.btn-outline{background:#fff;border:1px solid #bbb;color:#000;}
.btn-outline:hover{background:#f3f3f3;border-color:#999;}
.btn-icon-add{
  background:#fff;border:1px solid #ccc;color:#444;border-radius:50%;
  width:40px;height:40px;display:flex;align-items:center;justify-content:center;
  font-size:1rem;transition:.28s;
}
.btn-icon-add:hover{background:#f3f3f3;transform:scale(1.15);}

/* ================= SECTIONS ================= */
.section{margin-top:3rem;}
.section-header{
  display:flex;justify-content:space-between;align-items:flex-end;
  margin-bottom:1.4rem;flex-wrap:wrap;
}
.section-header div:nth-child(1){display:flex;flex-direction:column;}
.section-title{font-weight:700;font-size:1.25rem;margin:0;}
.section-subtitle{font-size:.85rem;opacity:.65;margin-top:.15rem;}

/* ================= BOOK CARDS (VARIAÇÃO A) ================= */
.book-grid{
  display:grid;gap:1.6rem;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}
.book-card{
  background:#fff;border:1px solid #e8e8e8;border-radius:18px;padding:1.2rem;
  transition:.28s cubic-bezier(.25,.46,.45,.94);
}
.book-card:hover{transform:translateY(-6px);box-shadow:0 16px 28px rgba(0,0,0,.08);}
.book-card img{width:100%;border-radius:14px;margin-bottom:1rem;}
.book-card h3{font-size:1rem;font-weight:700;margin-bottom:.35rem;line-height:1.38;}
.book-card p{opacity:.65;font-size:.85rem;margin-bottom:.8rem;line-height:1.45;}
.book-price{font-weight:700;font-size:1rem;margin-bottom:.9rem;}
.old-price{text-decoration:line-through;opacity:.45;margin-right:.4rem;}
.book-actions{display:flex;justify-content:space-between;align-items:center;}
.book-actions .btn-outline{font-size:.78rem;padding:.45rem 1rem;border-radius:50px;}

/* ================= ABOUT BOX ================= */
.about-box{
  background:#fff;border:1px solid #e8e8e8;border-radius:18px;padding:2rem;
  margin-top:3rem;margin-bottom:3rem;text-align:center;max-width:850px;
  margin-left:auto;margin-right:auto;box-shadow:0 8px 22px rgba(0,0,0,.04);
}
.about-box h2{font-size:1.3rem;font-weight:700;margin-bottom:1rem;}
.about-box p{opacity:.80;max-width:680px;margin:auto;margin-bottom:.8rem;line-height:1.65;font-size:.92rem;}
.about-box .btn-outline{font-size:.85rem;padding:.55rem 1.2rem;}

/* ================= FOOTER ================= */
footer{text-align:center;margin-top:3rem;padding:2rem 1rem;opacity:.75;font-size:.85rem;}
.footer-links{display:flex;justify-content:center;gap:1.5rem;margin-bottom:1rem;}
.footer-links a{color:#333;opacity:.8;transition:.25s;}
.footer-links a:hover{opacity:1;}
.footer-copy{font-size:.8rem;opacity:.55;}

/* ================= CART ================= */
.cart-table{
  width:100%;border-collapse:collapse;margin-top:2rem;
  background:#fff;border:1px solid #ddd;border-radius:10px;overflow:hidden;
}
.cart-table th{
  background:#f3f3f3;padding:.9rem;font-weight:700;text-align:left;border-bottom:1px solid #ddd;
}
.cart-table td{padding:.8rem;border-bottom:1px solid #eee;vertical-align:middle;}
.cart-cover{width:55px;height:75px;border-radius:6px;object-fit:cover;}
.btn-small{padding:.25rem .5rem;border:1px solid #ccc;background:#fff;border-radius:4px;font-size:.85rem;cursor:pointer;}
.btn-small:hover{background:#eee;}
.delete-icon i{color:#b00;font-size:1.1rem;margin-left:.5rem;}
.delete-icon i:hover{color:#e00;}
.swipe-delete-overlay{display:none;opacity:0;visibility:hidden;pointer-events:none;}

/* MOBILE CART */
@media(max-width:700px){
 .cart-table, .cart-table thead,.cart-table tbody,.cart-table tr,.cart-table td,.cart-table th{
   display:block;width:100%;
 }
 .cart-table thead{display:none;}
 .cart-table tr{
   background:#fff;border-radius:10px;margin-bottom:1rem;padding:1rem;
   position:relative;overflow:hidden;transition:.25s;border:1px solid #ddd;
 }
 .cart-table td{border:none!important;padding:.45rem 0;font-size:.95rem;text-align:right;}
 .cart-table td::before{
   content:attr(data-label);float:left;font-weight:600;opacity:.65;
 }
 .cart-cover{width:50px;height:70px;}
 .cart-row.row-swiped .swipe-delete-overlay{
   display:flex!important;align-items:center;justify-content:center;
   position:absolute;top:0;right:0;width:90px;height:100%;
   background:#d00;color:#fff;font-size:1.2rem;pointer-events:auto;opacity:1;
 }
 .delete-icon{display:none!important;}
}

/* ================= CHECKOUT TABLE ================= */
.checkout-table{
  width:100%;border-collapse:collapse;margin-top:2.5rem;
  background:#fff;border:1px solid #ddd;border-radius:10px;overflow:hidden;
}
.checkout-table th{
  background:#f3f3f3;padding:.9rem;font-weight:700;text-align:left;border-bottom:1px solid #ddd;
}
.checkout-table td{padding:.8rem;border-bottom:1px solid #eee;}

/* MOBILE CHECKOUT TABLE */
@media(max-width:700px){
 .checkout-table, .checkout-table thead,.checkout-table tbody,.checkout-table tr,
 .checkout-table td,.checkout-table th{display:block;width:100%;}
 .checkout-table thead{display:none;}
 .checkout-table tr{
   background:#fff;border-radius:10px;margin-bottom:1rem;padding:1rem;border:1px solid #ddd;
 }
 .checkout-table td{border:none!important;padding:.45rem 0;font-size:.95rem;text-align:right;}
 .checkout-table td::before{
   content:attr(data-label);float:left;font-weight:600;opacity:.65;
 }
}

/* ================= CHECKOUT — BOX LEFT + FORM RIGHT ================= */
.checkout-layout{
  display:flex;gap:2rem;margin-top:2.5rem;align-items:flex-start;
}
.checkout-caixa{
  background:#fff;border:1px solid #ddd;padding:1.5rem;border-radius:10px;width:40%;
}
.checkout-form{
  background:#fff;border:1px solid #ddd;padding:1.5rem;border-radius:10px;width:60%;
}
.checkout-form input{
  width:100%;margin:.4rem 0 1rem;padding:.8rem;border-radius:6px;border:1px solid #ccc;
}

/* MOBILE STACK */
@media(max-width:800px){
 .checkout-layout{flex-direction:column;}
 .checkout-caixa,.checkout-form{width:100%;}
}

/* ================= NAV MOBILE ================= */
@media(max-width:820px){
 .nav-toggle{display:block;}
 .nav-links{
   position:fixed;top:60px;left:0;right:0;background:white;
   flex-direction:column;align-items:flex-start;padding:1rem 1.5rem;gap:.7rem;
   border-bottom:1px solid #ddd;max-height:0;opacity:0;pointer-events:none;transition:.35s;
 }
 body.menu-open .nav-links{max-height:280px;opacity:1;pointer-events:auto;}
 header .container.nav{padding-left:1.3rem;padding-right:1.3rem;}
 .hero{grid-template-columns:1fr;}
 
  .nav-links{
    align-items:flex-start; /* já deves ter algo assim */
  }

  .lang-pill{
    margin: .4rem 0;   /* igual aos outros items */
    margin-left: 0;    /* <-- ESTE É O FATOR IMPORTANTE */
    padding:3px;
    gap:3px;
  }

  .lang-pill a{
    font-size:.85rem;
    padding:5px 10px;
  }

}

.share-box{
  margin-top:1.2rem;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:.7rem;
  font-size:.9rem;
  width:100%;
}

.share-box span{
  opacity:.6;
  margin-right:.5rem;
}

.share-box a{
  width:32px;height:32px;
  border-radius:50%;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid #ccc;
  transition:.25s;
}

.share-box a:hover{
  background:#000;color:#fff;
  transform:scale(1.1);
}

/* ================= LANGUAGE PILL ================= */

.lang-pill{
  display:flex;
  align-items:center;
  background:#f1f1f1;
  border-radius:30px;
  padding:4px;
  gap:4px;
  margin-left:1rem;
  border:1px solid #ddd;
}

.lang-pill a{
  text-decoration:none;
  color:#555;
  font-size:.85rem;
  padding:6px 12px;
  border-radius:30px;
  transition:.25s ease;
  font-weight:500;
}

.lang-pill a:hover{
  background:#fff;
  color:#000;
}

.lang-pill a.active{
  background:#000;
  color:#fff;
}

/*
.cta-pulse{animation:cartPulse 3s ease-in-out infinite;box-shadow:0 0 0 0 rgba(0,0,0,.08);transform-origin:center;}
@keyframes cartPulse{
	0%{transform:scale(1);box-shadow:0 0 0 0 rgba(0,0,0,.08);}
	50%{transform:scale(1.04);box-shadow:0 0 0 12px rgba(0,0,0,0);}
	100%{transform:scale(1);box-shadow:0 0 0 0 rgba(0,0,0,0);}
}
*/

.cta-pulse {
  animation: cartPulse 2s ease-out infinite;
  transform-origin: center;
}

@keyframes cartPulse {
  0%   { transform: scale(1); }
  10%  { transform: scale(1.08); }
  20%  { transform: scale(1); }
  30%  { transform: scale(1.08); }
  40%  { transform: scale(1); }

  /* pausa */
  100% { transform: scale(1); }
}

.pulse-target {
    animation: cartPulse 1.2s ease-in-out infinite;
    box-shadow: 0 0 0 0 rgba(0,0,0,.08);
    transform-origin:center;
}