:root{
  --navy: #0b3a5c;
  --navy-dark: #082941;
  --orange: #f5a326;
  --orange-dark: #e08c0f;
  --black: #1a1a1a;
  --paper: #fbf9f5;
  --white: #ffffff;
  --gray: #6b7280;
  --line: #e8e3da;
  --radius: 16px;
  --shadow: 0 10px 30px rgba(11,58,92,0.10);
  --shadow-lg: 0 20px 50px rgba(11,58,92,0.18);
  --pastel-1: #ece9fb;
  --pastel-1-ic: #6355c7;
  --pastel-2: #e3eefb;
  --pastel-2-ic: #0b3a5c;
  --pastel-3: #e6f5ec;
  --pastel-3-ic: #218a5a;
  --pastel-4: #fde9e2;
  --pastel-4-ic: #e08c0f;
  --font-head: 'Baloo 2', 'Poppins', sans-serif;
  --font-body: 'Poppins', sans-serif;
}

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

html{scroll-behavior:smooth;}

html, body{
  overflow-x:hidden;
  width:100%;
}

body{
  font-family:var(--font-body);
  color:var(--black);
  line-height:1.6;
  background:var(--paper);
}

img{max-width:100%;display:block;}

.container{
  width:100%;
  max-width:1180px;
  margin:0 auto;
  padding:0 24px;
}

h1,h2,h3{font-family:var(--font-head);line-height:1.15;}

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

ul{list-style:none;}

/* Page shell: always full-bleed, no framing/gradient border at any size. */
.page-bg{
  background:var(--paper);
}
.shell{
  width:100%;
  background:var(--paper);
  overflow:hidden;
}

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 28px;
  border-radius:100px;
  font-weight:600;
  font-size:15px;
  cursor:pointer;
  border:2px solid transparent;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{
  background:var(--orange);
  color:var(--navy-dark);
  box-shadow:0 10px 24px rgba(245,163,38,0.35);
}
.btn-primary:hover{background:var(--orange-dark);}
.btn-outline-dark{
  border-color:var(--navy);
  color:var(--navy-dark);
  background:transparent;
}
.btn-outline-dark:hover{background:var(--navy);color:var(--white);}
.btn-white{
  background:var(--white);
  color:var(--navy-dark);
  box-shadow:0 10px 24px rgba(0,0,0,0.15);
}
.btn-white:hover{background:#f1eee6;}

/* Header */
.header{
  background:var(--white);
  border-bottom:1px solid var(--line);
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 32px;
  gap:20px;
}
.brand{display:flex;align-items:center;flex-shrink:0;}
.brand-logo{height:52px;width:auto;object-fit:contain;}

.nav{
  display:flex;
  gap:28px;
  flex:1;
  justify-content:center;
}
.nav a{
  font-weight:600;
  font-size:15px;
  color:var(--navy-dark);
  position:relative;
  padding:6px 2px;
}
.nav a::after{
  content:"";
  position:absolute;
  left:0;bottom:0;
  width:0;height:2px;
  background:var(--orange);
  transition:width .2s ease;
}
.nav a:hover::after{width:100%;}

.header-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-shrink:0;
}
.icon-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;height:40px;
  border-radius:50%;
  background:var(--paper);
  border:1px solid var(--line);
  color:var(--navy-dark);
  cursor:pointer;
  transition:background .2s ease, color .2s ease;
}
.icon-btn:hover{background:var(--navy);color:var(--white);}

.menu-toggle{
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:40px;height:40px;
  background:none;
  border:none;
  cursor:pointer;
  flex-shrink:0;
}
.menu-toggle span{
  display:block;
  height:2px;
  background:var(--navy-dark);
  border-radius:2px;
}

/* Search bar */
.search-bar{
  max-height:0;
  overflow:hidden;
  background:var(--paper);
  border-bottom:0 solid var(--line);
  transition:max-height .25s ease, padding .25s ease;
}
.search-bar.active{
  max-height:80px;
  border-bottom-width:1px;
}
.search-bar .container{
  display:flex;
  align-items:center;
  gap:10px;
  padding-top:14px;
  padding-bottom:14px;
  color:var(--gray);
}
.search-bar input{
  flex:1;
  border:none;
  background:none;
  outline:none;
  font-family:var(--font-body);
  font-size:15px;
  color:var(--black);
}

/* Hero */
.hero-wrap{padding:32px 0 8px;}
.hero-card{
  position:relative;
  background-image:
    repeating-linear-gradient(180deg, rgba(11,58,92,0.06) 0px, rgba(11,58,92,0.06) 1px, transparent 1px, transparent 32px),
    linear-gradient(135deg, #fdf1e2 0%, #fbe0c4 100%);
  border-radius:28px;
  padding:56px;
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:40px;
  align-items:center;
}
.hero-left h1{
  font-size:42px;
  color:var(--navy-dark);
  margin-bottom:18px;
}
.hero-left h1 .accent{color:var(--orange-dark);}
.hero-left p{
  color:#4b5a66;
  font-size:16px;
  max-width:480px;
  margin-bottom:28px;
}
.hero-actions{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:36px;
}
.hero-features{
  display:flex;
  gap:26px;
  flex-wrap:wrap;
}
.hero-feature{
  display:flex;
  align-items:center;
  gap:10px;
}
.hf-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:36px;height:36px;
  border-radius:50%;
  background:var(--white);
  color:var(--navy);
  box-shadow:var(--shadow);
  flex-shrink:0;
}
.hero-feature strong{
  display:block;
  font-size:13px;
  color:var(--navy-dark);
  font-weight:700;
}
.hero-feature span{
  font-size:12px;
  color:var(--gray);
}

.hero-right{
  position:relative;
  height:400px;
}
.hero-circle{
  position:absolute;
  top:50%;left:50%;
  width:340px;height:340px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(circle, rgba(11,58,92,0.10), rgba(11,58,92,0) 70%);
}
.hero-img{
  position:absolute;
  border-radius:18px;
  object-fit:cover;
  box-shadow:var(--shadow-lg);
  border:4px solid var(--white);
}
.hero-img-1{
  width:210px;height:270px;
  top:0;right:30px;
  transform:rotate(4deg);
  z-index:2;
}
.hero-img-2{
  width:165px;height:210px;
  top:140px;right:250px;
  transform:rotate(-6deg);
  z-index:1;
}
.hero-img-3{
  width:175px;height:200px;
  bottom:0;right:10px;
  transform:rotate(-3deg);
  z-index:3;
}
.hero-badge{
  position:absolute;
  bottom:6px;left:10px;
  width:104px;height:104px;
  border-radius:50%;
  background:var(--orange);
  color:var(--navy-dark);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  box-shadow:0 14px 30px rgba(224,140,15,0.45);
  border:4px solid var(--white);
  z-index:4;
}
.hero-badge strong{font-size:20px;font-family:var(--font-head);line-height:1;}
.hero-badge span{font-size:12px;font-weight:600;}

/* Sections */
.section{padding:64px 0;}
.section-alt{
  background-color:#f3eee3;
  background-image:radial-gradient(rgba(11,58,92,0.14) 1px, transparent 1.4px);
  background-size:20px 20px;
}

/* Spiral notebook divider: reads as the metal coil binding of a caderno */
.spiral-divider{
  height:26px;
  background-color:var(--paper);
  background-image:
    radial-gradient(circle 5px at 15px 13px, var(--paper) 100%, transparent 0),
    radial-gradient(circle 8px at 15px 13px, var(--navy) 100%, transparent 0);
  background-repeat:repeat-x;
  background-size:30px 26px;
}
.spiral-divider--orange{
  background-color:var(--navy-dark);
  background-image:
    radial-gradient(circle 5px at 15px 13px, var(--navy-dark) 100%, transparent 0),
    radial-gradient(circle 8px at 15px 13px, var(--orange) 100%, transparent 0);
}

.section-head-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:32px;
  flex-wrap:wrap;
}
.section-head-row h2{font-size:28px;color:var(--navy-dark);}
.section-link{
  font-size:14px;
  font-weight:700;
  color:var(--navy);
  white-space:nowrap;
}
.section-link:hover{color:var(--orange-dark);}

.section-head{
  max-width:640px;
  margin:0 auto 44px;
  text-align:center;
}
/* Washi-tape style section tag: a strip of decorative tape, not a plain pill */
.section-tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 18px;
  font-size:12px;
  font-weight:700;
  letter-spacing:0.06em;
  text-transform:uppercase;
  margin-bottom:16px;
  transform:rotate(-2deg);
  box-shadow:0 3px 6px rgba(0,0,0,0.10);
  border-radius:2px;
}
.tag-icon{flex-shrink:0;}
.tag-orange{
  color:var(--orange-dark);
  background-color:rgba(245,163,38,0.22);
  background-image:repeating-linear-gradient(45deg, rgba(245,163,38,0.35) 0 7px, rgba(245,163,38,0.18) 7px 14px);
}
.tag-blue{
  color:var(--navy);
  background-color:rgba(11,58,92,0.14);
  background-image:repeating-linear-gradient(45deg, rgba(11,58,92,0.20) 0 7px, rgba(11,58,92,0.08) 7px 14px);
}
/* For use on dark backgrounds (e.g. the navy Contato section) — tag-blue's
   navy-on-navy is unreadable there, so this swaps to a light washi tape. */
.tag-cream{
  color:var(--navy-dark);
  background-color:rgba(255,255,255,0.85);
  background-image:repeating-linear-gradient(45deg, rgba(255,255,255,0.55) 0 7px, rgba(255,255,255,0.9) 7px 14px);
}
.section-head h2{font-size:32px;color:var(--navy-dark);margin-bottom:12px;}
.section-head p{color:var(--gray);font-size:16px;}

/* Featured products (reference-style cards) */
.featured-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:26px;
}
.pcard{
  position:relative;
  background:var(--white);
  border-radius:20px;
  box-shadow:var(--shadow);
  transition:transform .25s ease, box-shadow .25s ease;
}
.pcard-clip{
  position:absolute;
  top:-13px;
  right:26px;
  color:var(--navy);
  transform:rotate(18deg);
  filter:drop-shadow(0 3px 4px rgba(0,0,0,0.25));
  z-index:2;
  pointer-events:none;
}
.pcard-clip--alt{
  right:auto;
  left:26px;
  color:var(--orange-dark);
  transform:rotate(-16deg);
}
.pcard:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);}
.pcard-media{
  position:relative;
  aspect-ratio:1/1;
  background:var(--paper);
  border-radius:20px 20px 0 0;
  overflow:hidden;
}
.pcard-media img{
    object-fit: contain;
    background: #fff;
}
.pcard-badge{
  position:absolute;
  top:14px;left:14px;
  font-size:11px;
  font-weight:700;
  padding:5px 12px;
  border-radius:100px;
  text-transform:uppercase;
  letter-spacing:0.03em;
  color:var(--white);
}
.badge-new{background:var(--navy);}
.badge-best{background:#d63b6c;}
.badge-sale{background:var(--orange-dark);}
.pcard-body{padding:18px 20px 20px;}
.pcard-cat{
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.05em;
  color:var(--gray);
}
.pcard-body h3{
  font-size:17px;
  color:var(--navy-dark);
  font-family:var(--font-body);
  font-weight:600;
  margin:6px 0 8px;
}
.pcard-tags{font-size:13px;color:var(--orange-dark);font-weight:600;margin-bottom:16px;}
.pcard-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.pcard-price{font-size:13px;color:var(--gray);font-weight:500;}
.pcard-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;height:40px;
  border-radius:50%;
  background:var(--pastel-1);
  color:var(--pastel-1-ic);
  border:none;
  cursor:pointer;
  transition:background .2s ease, color .2s ease, transform .2s ease;
}
.pcard-btn:hover{background:var(--navy);color:var(--white);transform:scale(1.06);}

/* Shop by category */
.cat-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
  gap:22px;
}
.cat-card{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:26px 24px;
  border-radius:20px;
  transition:transform .2s ease, box-shadow .2s ease;
}
.cat-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);}
.cat-1{background:var(--pastel-1);}
.cat-2{background:var(--pastel-2);}
.cat-3{background:var(--pastel-3);}
.cat-4{background:var(--pastel-4);}
.cat-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:48px;height:48px;
  border-radius:14px;
  background:rgba(255,255,255,0.7);
  margin-bottom:16px;
}
.cat-1 .cat-icon{color:var(--pastel-1-ic);}
.cat-2 .cat-icon{color:var(--pastel-2-ic);}
.cat-3 .cat-icon{color:var(--pastel-3-ic);}
.cat-4 .cat-icon{color:var(--pastel-4-ic);}
.cat-card h3{font-size:17px;color:var(--navy-dark);margin-bottom:6px;}
.cat-card p{font-size:13px;color:#5a6570;margin-bottom:18px;}
.cat-link{font-size:13px;font-weight:700;color:var(--navy-dark);}

/* Price formats (Agenda: 1 dia x 2 dias por página) */
.price-formats{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:20px;
  margin-bottom:40px;
}
.price-format-card{
  background:var(--white);
  border:1.5px solid var(--line);
  border-radius:16px;
  padding:20px 22px;
}
.price-format-tag{
  display:inline-block;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.05em;
  color:var(--orange-dark);
  background:rgba(245,163,38,0.14);
  padding:4px 12px;
  border-radius:100px;
  margin-bottom:10px;
}
.price-format-card h4{font-size:18px;color:var(--navy-dark);margin-bottom:6px;}
.price-format-card p{font-size:13px;color:var(--gray);margin-bottom:16px;}
.price-format-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.price-format-value{font-size:20px;font-weight:700;color:var(--navy-dark);font-family:var(--font-head);}

/* Price grid (Chaveiros & Botons: tabela de preços por quantidade) */
.price-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
  gap:24px;
}
.price-card{
  background:var(--white);
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.price-card-top{
  display:flex;
  gap:14px;
  align-items:flex-start;
}
.price-card-img{
  width:60px;height:60px;
  border-radius:12px;
  object-fit:cover;
  flex-shrink:0;
}
.price-card h3{font-size:16px;color:var(--navy-dark);font-family:var(--font-body);font-weight:600;margin-bottom:4px;}
.price-card-desc{font-size:12.5px;color:var(--gray);}

.price-table{width:100%;border-collapse:collapse;}
.price-table th{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:0.03em;
  color:var(--gray);
  text-align:left;
  padding:0 8px 8px 0;
  border-bottom:1.5px solid var(--line);
  font-weight:700;
}
.price-table th:not(:first-child),
.price-table td:not(:first-child){text-align:right;}
.price-table td{
  font-size:13px;
  color:var(--black);
  padding:7px 8px 7px 0;
  border-bottom:1px solid var(--line);
}
.price-table tr:last-child td{border-bottom:none;}
.price-table td.price-val{font-weight:700;color:var(--orange-dark);}
.price-card-btn{width:100%;}

/* Promo banner */
.promo-section{padding-top:0;}
.promo-banner{
  position:relative;
  display:flex;
  align-items:center;
  gap:28px;
  background:linear-gradient(135deg, var(--navy) 0%, var(--navy-dark) 100%);
  border-radius:26px;
  padding:40px 48px;
  overflow:hidden;
  flex-wrap:wrap;
}
.promo-badge{
  flex-shrink:0;
  width:84px;height:84px;
  border-radius:50%;
  background:var(--white);
  color:var(--navy-dark);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-size:13px;
  font-weight:700;
  line-height:1.2;
}
.promo-text{flex:1;min-width:240px;}
.promo-text h2{color:var(--white);font-size:26px;margin-bottom:8px;}
.promo-text p{color:#c3d3e0;font-size:14px;max-width:480px;}
.promo-banner .btn-white{flex-shrink:0;}

/* Features row */
.features-row{padding-top:56px;}
.features-row-inner{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
}
.feature-item{
  display:flex;
  align-items:center;
  gap:14px;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:16px;
  padding:20px;
}
.feature-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;height:44px;
  border-radius:50%;
  flex-shrink:0;
}
.fi-1{background:var(--pastel-2);color:var(--pastel-2-ic);}
.fi-2{background:var(--pastel-4);color:var(--pastel-4-ic);}
.fi-3{background:var(--pastel-3);color:var(--pastel-3-ic);}
.feature-item h4{font-size:14px;color:var(--navy-dark);margin-bottom:2px;}
.feature-item p{font-size:12px;color:var(--gray);}

/* Grid / cards (full catalog) */
.grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));
  gap:26px;
}
.grid-gallery{margin-top:40px;}
.card{
  background:var(--white);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
  transition:transform .25s ease, box-shadow .25s ease;
  display:flex;
  flex-direction:column;
}
.card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-lg);
}
.card-media{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
  background:#eee;
  cursor:zoom-in;
}
.card-media img{
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .4s ease;
}
.card:hover .card-media img{transform:scale(1.06);}
.card-badge{
  position:absolute;
  top:12px;left:12px;
  background:var(--orange);
  color:var(--navy-dark);
  font-size:11px;
  font-weight:700;
  padding:5px 12px;
  border-radius:100px;
  text-transform:uppercase;
  letter-spacing:0.04em;
}
/* Catalog-style caption overlaid on the photo — just a name, no blurb */
.card-caption{
  position:absolute;
  left:0;right:0;bottom:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:14px 14px 12px;
  background:linear-gradient(to top, rgba(8,41,65,0.88) 0%, rgba(8,41,65,0.45) 55%, transparent 100%);
}
.card-caption h3{
  color:var(--white);
  font-family:var(--font-head);
  font-size:16px;
  font-weight:700;
  text-shadow:0 2px 8px rgba(0,0,0,0.35);
}
.card-order-btn{
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  width:32px;height:32px;
  border-radius:50%;
  background:rgba(255,255,255,0.92);
  color:var(--navy-dark);
  border:none;
  cursor:pointer;
  transition:background .2s ease, color .2s ease, transform .2s ease;
}
.card-order-btn:hover{
  background:var(--orange);
  transform:scale(1.08);
}

/* About */
.about-inner{
  display:grid;
  grid-template-columns:0.8fr 1.2fr;
  gap:56px;
  align-items:center;
}
.about-media{
  position:relative;
  border-radius:24px;
  overflow:hidden;
  box-shadow:var(--shadow-lg);
  aspect-ratio:3/4;
  background:var(--paper);
  transform:rotate(-1.5deg);
}
.about-photo{width:100%;height:100%;object-fit:cover;}
.about-photo-clip{
  position:absolute;
  top:-14px;left:50%;
  transform:translateX(-50%) rotate(-6deg);
  color:var(--orange);
  filter:drop-shadow(0 3px 4px rgba(0,0,0,0.3));
  z-index:2;
}
.about-photo-caption{
  position:absolute;
  left:0;right:0;bottom:0;
  padding:18px 22px;
  background:linear-gradient(to top, rgba(8,41,65,0.88), transparent);
  color:var(--white);
  font-weight:600;
  font-size:13.5px;
}
.about-text h2{font-size:30px;color:var(--navy-dark);margin-bottom:16px;}
.about-text p{color:var(--gray);margin-bottom:20px;}
.about-list{margin-bottom:26px;display:flex;flex-direction:column;gap:10px;}
.about-list li{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:500;
  color:var(--navy-dark);
  font-size:15px;
}
.about-list li::before{
  content:"✓";
  display:flex;
  align-items:center;
  justify-content:center;
  width:22px;height:22px;
  border-radius:50%;
  background:var(--orange);
  color:var(--navy-dark);
  font-size:12px;
  font-weight:800;
  flex-shrink:0;
}

/* Contact */
.contact{background:linear-gradient(135deg, var(--navy) 0%, var(--navy-dark) 100%);color:var(--white);}
.contact-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:32px;
  flex-wrap:wrap;
}
.contact-text{max-width:480px;}
.contact-text h2{font-size:30px;margin-bottom:12px;}
.contact-text p{color:#d7e3ec;}
.contact-cards{
  display:flex;
  flex-direction:column;
  gap:14px;
  min-width:280px;
}
.contact-card{
  display:flex;
  align-items:center;
  gap:16px;
  background:var(--white);
  color:var(--navy-dark);
  padding:16px 20px;
  border-radius:16px;
  box-shadow:var(--shadow-lg);
  transition:transform .2s ease, box-shadow .2s ease;
}
.contact-card:hover{
  transform:translateY(-3px) scale(1.01);
  box-shadow:0 26px 55px rgba(0,0,0,0.28);
}
.contact-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:48px;height:48px;
  border-radius:14px;
  flex-shrink:0;
  color:var(--white);
}
.contact-icon-wa{background:#25D366;}
.contact-icon-ig{
  background:radial-gradient(circle at 30% 110%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}
.contact-info{display:flex;flex-direction:column;flex:1;min-width:0;}
.contact-info strong{font-size:15px;}
.contact-info span{color:var(--gray);font-size:13.5px;}
.contact-arrow{
  display:flex;
  align-items:center;
  justify-content:center;
  width:32px;height:32px;
  border-radius:50%;
  background:var(--paper);
  color:var(--navy);
  flex-shrink:0;
  transition:background .2s ease, color .2s ease, transform .2s ease;
}
.contact-card:hover .contact-arrow{
  background:var(--orange);
  color:var(--navy-dark);
  transform:translateX(3px);
}

/* Footer */
.footer{
  background:var(--navy-dark);
  color:#c3d3e0;
  padding:40px 0;
  text-align:center;
}
.footer-logo{height:50px;margin:0 auto 12px;filter:brightness(1.1);}
.footer-social{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:20px;
  margin-top:14px;
}
.footer-social-link{
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:13px;
  font-weight:600;
  color:#c3d3e0;
  transition:color .2s ease;
}
.footer-social-link:hover{color:var(--orange);}
.footer-small{font-size:12px;opacity:0.7;margin-top:16px;}

/* WhatsApp float */
.whatsapp-float{
  position:fixed;
  bottom:24px;right:24px;
  width:58px;height:58px;
  background:#25D366;
  color:var(--white);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 10px 24px rgba(0,0,0,0.25);
  z-index:200;
  transition:transform .2s ease;
}
.whatsapp-float:hover{transform:scale(1.08);}

/* Lightbox */
.lightbox{
  position:fixed;
  inset:0;
  background:rgba(8,41,65,0.92);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:300;
  padding:40px 20px;
}
.lightbox.active{display:flex;}
.lightbox-content{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:18px;
  max-width:min(90vw, 520px);
}
.lightbox img{
  max-width:100%;
  max-height:72vh;
  border-radius:14px;
  box-shadow:0 20px 60px rgba(0,0,0,0.5);
}
.lightbox-close{
  position:absolute;
  top:24px;right:28px;
  width:44px;height:44px;
  border-radius:50%;
  background:rgba(255,255,255,0.12);
  color:var(--white);
  border:none;
  font-size:22px;
  cursor:pointer;
}
.lightbox-close:hover{background:rgba(255,255,255,0.25);}

/* Order modal */
.modal-overlay{
  position:fixed;
  inset:0;
  background:rgba(8,41,65,0.55);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:400;
  padding:20px;
}
.modal-overlay.active{display:flex;}
.modal{
  background:var(--white);
  border-radius:22px;
  max-width:460px;
  width:100%;
  max-height:90vh;
  overflow-y:auto;
  padding:30px;
  position:relative;
  box-shadow:var(--shadow-lg);
  animation:modalIn .22s ease;
}
@keyframes modalIn{
  from{transform:translateY(14px);opacity:0;}
  to{transform:translateY(0);opacity:1;}
}
.modal-close{
  position:absolute;
  top:16px;right:16px;
  width:36px;height:36px;
  border-radius:50%;
  border:none;
  background:var(--paper);
  color:var(--navy-dark);
  font-size:15px;
  cursor:pointer;
  transition:background .2s ease;
}
.modal-close:hover{background:var(--line);}
.modal-product{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:22px;
  padding-right:34px;
}
.modal-product img{
  width:60px;height:76px;
  object-fit:cover;
  border-radius:10px;
  flex-shrink:0;
  box-shadow:var(--shadow);
}
.modal-tag{
  display:block;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.06em;
  color:var(--orange-dark);
  margin-bottom:4px;
}
.modal-product h3{
  font-size:17px;
  color:var(--navy-dark);
  font-family:var(--font-body);
  font-weight:600;
}
.order-form{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.order-form label{
  font-size:13px;
  font-weight:600;
  color:var(--navy-dark);
  margin-top:12px;
}
.order-form label:first-of-type{margin-top:0;}
.order-form input,
.order-form textarea{
  font-family:var(--font-body);
  border:1.5px solid var(--line);
  border-radius:10px;
  padding:11px 14px;
  font-size:14px;
  color:var(--black);
  resize:vertical;
  transition:border-color .2s ease;
  width:100%;
}
.order-form input:focus,
.order-form textarea:focus{
  outline:none;
  border-color:var(--orange);
}
.modal-qty{max-width:110px;}
.modal-submit{
  width:100%;
  margin-top:20px;
}
.modal-hint{
  font-size:12px;
  color:var(--gray);
  text-align:center;
  margin-top:12px;
}

/* Format picker inside the order modal (Agendas: 1 dia x 2 dias por página) */
.modal-formats{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-bottom:16px;
}
.modal-formats[hidden]{display:none;}
.modal-formats-label{
  font-size:13px;
  font-weight:600;
  color:var(--navy-dark);
}
.format-option{display:block;cursor:pointer;}
.format-option input{
  position:absolute;
  width:1px;height:1px;
  opacity:0;
  pointer-events:none;
}
.format-option-card{
  display:flex;
  flex-direction:column;
  gap:4px;
  border:1.5px solid var(--line);
  border-radius:12px;
  padding:10px 14px;
  transition:border-color .2s ease, background .2s ease;
}
.format-option-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.format-option-top strong{font-size:14px;color:var(--navy-dark);}
.format-option-top b{font-size:14px;color:var(--orange-dark);font-family:var(--font-head);}
.format-option-meta{font-size:11.5px;color:var(--gray);line-height:1.4;}
.format-option input:checked + .format-option-card{
  border-color:var(--orange);
  background:rgba(245,163,38,0.08);
}
.format-option input:focus-visible + .format-option-card{
  outline:2px solid var(--orange);
  outline-offset:2px;
}

/* Responsive */
@media (max-width:960px){
  .hero-card{grid-template-columns:1fr;padding:40px 28px;}
  .hero-right{height:320px;margin-top:10px;}
  .about-inner{grid-template-columns:1fr;}
  .about-media{order:-1;}
  .features-row-inner{grid-template-columns:1fr;}
}

@media (max-width:800px){
  .nav{
    position:fixed;
    top:0;right:0;
    height:100vh;
    width:min(78vw, 320px);
    background:var(--white);
    flex-direction:column;
    align-items:flex-start;
    padding:100px 32px 32px;
    gap:22px;
    transform:translateX(100%);
    transition:transform .3s ease;
    box-shadow:-10px 0 40px rgba(0,0,0,0.15);
    z-index:150;
  }
  .nav.open{transform:translateX(0);}
  .menu-toggle{display:flex;z-index:160;}
  .header-cta{display:none;}
  .hero-left h1{font-size:32px;}
  .contact-inner{flex-direction:column;align-items:flex-start;}
  .promo-banner{padding:32px;}
}

@media (max-width:520px){
  .brand-logo{height:40px;}
  .header-inner{padding:12px 20px;}
  .hero-wrap{padding:20px 0 0;}
  .hero-card{padding:28px 20px;border-radius:20px;}
  .hero-right{height:260px;}
  .hero-img-1{width:160px;height:200px;right:0;}
  .hero-img-2{width:120px;height:160px;right:150px;top:100px;}
  .hero-img-3{width:140px;height:160px;right:0;}
  .hero-badge{width:84px;height:84px;}
  .section{padding:48px 0;}
  .section-head h2{font-size:26px;}
  .section-head-row h2{font-size:22px;}
  .promo-banner{flex-direction:column;text-align:center;}
  .promo-banner .btn-white{width:100%;}

  /* Produtos em Destaque: sempre 3 numa linha só */
  .featured-grid{
    grid-template-columns:repeat(3, 1fr);
    gap:8px;
  }
  .pcard-clip{display:none;}
  .pcard-badge{font-size:8px;padding:3px 6px;top:6px;left:6px;}
  .pcard-body{padding:8px 8px 10px;}
  .pcard-cat{font-size:8px;}
  .pcard-body h3{font-size:12px;line-height:1.2;margin:3px 0 4px;}
  .pcard-tags{display:none;}
  .pcard-footer{justify-content:center;}
  .pcard-price{display:none;}
  .pcard-btn{width:26px;height:26px;}
  .pcard-btn svg{width:13px;height:13px;}

  /* Vitrines (Agendas/Cadernetas/Bíblias/Chaveiros): 2 em 2 */
  .grid{
    grid-template-columns:repeat(2, 1fr);
    gap:12px;
  }
  .card-badge{font-size:9px;padding:4px 9px;top:8px;left:8px;}
  .card-caption{padding:8px 8px 8px;}
  .card-caption h3{font-size:13px;}
  .card-order-btn{width:26px;height:26px;}
  .card-order-btn svg{width:12px;height:12px;}
}