/* ─── TOKENS ─────────────────────────────────────────────── */
:root {
  --ice:       #F5F2EE;
  --ice-2:     #EDEAE5;
  --ice-3:     #E5E1DB;
  --white:     #FFFFFF;
  --dark:      #2C2C2A;
  --dark-mid:  #4A4845;
  --mid:       #7A7673;
  --light:     #ABA8A3;
  --orange:    #E8651A;
  --orange-h:  #CF5714;
  --gold:      #C9A96E;
  --gold-light:#DFC28E;
  --border:    #DDD9D3;
  --border-l:  #E8E4DE;
  --serif:     'Cormorant Garamond', Georgia, serif;
  --sans:      'DM Sans', -apple-system, sans-serif;
  --ease:      cubic-bezier(.25,.46,.45,.94);
  --speed:     .3s;
}

/* ─── RESET ──────────────────────────────────────────────── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100% }
body { font-family:var(--sans); background:var(--ice); color:var(--dark); -webkit-font-smoothing:antialiased; line-height:1.5 }
a { text-decoration:none; color:inherit }
img { display:block; max-width:100% }
button { font-family:inherit; cursor:pointer; border:none; background:none }
ul { list-style:none }

/* ─── LAYOUT ─────────────────────────────────────────────── */
.w { max-width:1360px; margin:0 auto; padding:0 48px }
@media(max-width:768px){ .w { padding:0 20px } }


/* Logo image */
.logo { display:flex; align-items:center; flex-shrink:0 }
.logo-img { height:52px; width:auto; display:block }
.logo-img-ft { 
  height:32px; width:auto; display:block; 
  margin-bottom:16px;
  filter: brightness(0) invert(1);
  opacity:.85;
}

/* ─── TOPBAR ─────────────────────────────────────────────── */
.tb {
  background:var(--ice);
  color:var(--mid);
  font-size:11px;
  letter-spacing:.05em;
  border-bottom:1px solid var(--border-l);
}
.tb-i {
  display:flex;
  justify-content:space-between;
  align-items:center;
  height:32px;
  gap:16px;
}
.tb a {
  color:var(--mid);
  display:inline-flex;
  align-items:center;
  gap:5px;
  transition:color .2s;
}
.tb a:hover { color:var(--gold) }
.tb-l { display:flex; align-items:center; gap:20px }
.tb-r { display:flex; align-items:center; gap:18px }
.tb-r span { color:var(--light) }

/* ─── HEADER ─────────────────────────────────────────────── */
.hd {
  background:var(--ice);
  border-bottom:none;
  position:sticky;
  top:0;
  z-index:200;
  transition:box-shadow var(--speed) var(--ease), background var(--speed);
}
.hd.sc { box-shadow:0 1px 24px rgba(0,0,0,.06) }
.hd-i {
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:72px;
  gap:32px;
}



/* Search */
.hd-sr {
  flex:0 1 380px;
  position:relative;
}
.hd-sr input {
  width:100%;
  height:40px;
  background:var(--ice-2);
  border:1px solid transparent;
  padding:0 44px 0 16px;
  font-family:var(--sans);
  font-size:13px;
  color:var(--dark);
  outline:none;
  transition:all .2s;
  border-radius:0;
}
.hd-sr input::placeholder { color:var(--light) }
.hd-sr input:focus { border-color:var(--gold); background:var(--white) }
.hd-sr button {
  position:absolute; right:0; top:0;
  width:40px; height:40px;
  color:var(--mid);
  display:flex; align-items:center; justify-content:center;
  transition:color .2s;
}
.hd-sr button:hover { color:var(--orange) }

/* Actions */
.hd-a { display:flex; align-items:center; gap:12px; flex-shrink:0 }
.hd-cta {
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 22px;
  background:var(--orange);
  color:#fff;
  font-size:13px;
  font-weight:500;
  letter-spacing:.02em;
  transition:background var(--speed) var(--ease);
  white-space:nowrap;
}
.hd-cta:hover { background:var(--orange-h) }
.hd-menu-btn {
  display:none;
  padding:8px;
  color:var(--dark);
}

/* ─── NAVBAR ─────────────────────────────────────────────── */
.nb {
  background:var(--ice);
  border-top:1px solid var(--gold);
  border-bottom:1px solid var(--border-l);
}
.nb-i {
  display:flex;
  align-items:center;
  height:42px;
  gap:0;
  position:relative;
}
.nb > .w { position:relative }
.nb-link {
  color:var(--dark-mid);
  font-size:11px;
  font-weight:400;
  letter-spacing:.1em;
  text-transform:uppercase;
  padding:0 18px;
  height:42px;
  display:inline-flex;
  align-items:center;
  transition:all .2s;
  position:relative;
  white-space:nowrap;
}
.nb-link:hover { color:var(--dark); background:rgba(0,0,0,.02) }
.nb-link::after {
  content:'';
  position:absolute;
  bottom:0; left:18px; right:18px;
  height:1px;
  background:var(--gold);
  transform:scaleX(0);
  transition:transform .25s var(--ease);
}
.nb-link:hover::after { transform:scaleX(1) }
.nb-link.promo { color:var(--orange) }
.nb-link.promo:hover { color:var(--orange-h); background:rgba(232,101,26,.04) }
.nb-link.promo::after { background:var(--orange) }
.nb-link svg { margin-left:5px; transition:transform .2s; color:var(--light) }

/* Dropdown */
.nb-drop {
  position:absolute;
  top:42px;
  left:0;
  background:var(--white);
  border:1px solid var(--border);
  border-top:2px solid var(--gold);
  min-width:220px;
  padding:8px 0;
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  transition:all .2s var(--ease);
  z-index:300;
  box-shadow:0 8px 32px rgba(0,0,0,.1);
}
.nb-has-drop:hover .nb-drop,
.nb-has-drop:focus-within .nb-drop {
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.nb-has-drop:hover .nb-link svg { transform:rotate(180deg) }
.nb-drop a {
  display:block;
  padding:9px 20px;
  font-size:13px;
  color:var(--dark-mid);
  transition:all .15s;
  letter-spacing:.01em;
}
.nb-drop a:hover { color:var(--orange); background:var(--ice); padding-left:24px }

/* Mega dropdown — ambientes */
.nb-mega {
  position:absolute;
  top:42px;
  left:0;
  background:var(--white);
  border:1px solid var(--border);
  border-top:2px solid var(--gold);
  padding:28px 32px;
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  transition:all .2s var(--ease);
  z-index:300;
  box-shadow:0 8px 32px rgba(0,0,0,.1);
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
  width:640px;
}
.nb-has-mega:hover .nb-mega,
.nb-has-mega:focus-within .nb-mega {
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.nb-has-mega:hover .nb-link svg { transform:rotate(180deg) }
.nb-mega-col h4 {
  font-family:var(--serif);
  font-size:13px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--dark);
  margin-bottom:10px;
  padding-bottom:8px;
  border-bottom:1px solid var(--border-l);
}
.nb-mega-col a {
  display:block;
  font-size:12px;
  color:var(--mid);
  padding:5px 0;
  transition:color .15s;
  letter-spacing:.01em;
}
.nb-mega-col a:hover { color:var(--orange) }

/* ─── HERO ───────────────────────────────────────────────── */
.hero {
  position:relative;
  background:var(--ice-2);
  overflow:hidden;
}
.hero-sl {
  display:flex;
  transition:transform .7s var(--ease);
  will-change:transform;
}
.hero-s {
  min-width:100%;
  height:min(72vh, 600px);
  display:flex;
  align-items:flex-start;
  justify-content:center;
  position:relative;
  overflow:hidden;
}
.hero-s:nth-child(1) { background:linear-gradient(120deg,#E8E2DA 0%,#D8D0C5 60%,#CEC5B8 100%) }
.hero-s:nth-child(2) { background:linear-gradient(120deg,#DDD7CE 0%,#CECA C0 60%,#C4BDB1 100%) }
.hero-s:nth-child(3) { background:linear-gradient(120deg,#E2DAD1 0%,#D4C8BC 60%,#C8BEB2 100%) }

/* Hero with real image */
.hero-s img {
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}

.hero-content {
  position:relative;
  z-index:2;
  text-align:center;
  padding:0 24px;
  margin-top:clamp(24px, 4vh, 48px);
}
.hero-tag {
  display:none;
}
.hero-title {
  font-family:var(--serif);
  font-size:clamp(28px, 4vw, 52px);
  font-weight:300;
  color:var(--dark);
  line-height:1.15;
  margin-bottom:6px;
  max-width:700px;
  margin-left:auto;
  margin-right:auto;
}
.hero-title em { font-style:italic; color:var(--dark-mid) }
.hero-sub {
  font-family:var(--serif);
  font-size:clamp(14px, 1.6vw, 19px);
  font-weight:300;
  font-style:italic;
  color:var(--mid);
  margin-bottom:0;
  max-width:500px;
  margin-left:auto;
  margin-right:auto;
  line-height:1.4;
}
/* Light text variant for dark background images */
.hero-s.light-text .hero-title { color:var(--white) }
.hero-s.light-text .hero-title em { color:rgba(255,255,255,.8) }
.hero-s.light-text .hero-sub { color:rgba(255,255,255,.65) }
.hero-cta {
  display:none;
}

/* Hero placeholder when no image */
.hero-placeholder {
  font-size:12px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--light);
}

/* Controls */
.hero-dots {
  position:absolute;
  bottom:24px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:8px;
  z-index:10;
}
.hero-dot {
  width:6px; height:6px;
  border-radius:50%;
  background:rgba(0,0,0,.2);
  transition:all .3s;
  cursor:pointer;
  padding:0;
}
.hero-dot.ac {
  background:var(--orange);
  width:24px;
  border-radius:3px;
}
.hero-arr {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:44px; height:44px;
  background:rgba(255,255,255,.8);
  backdrop-filter:blur(8px);
  border:1px solid var(--border);
  color:var(--dark);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  z-index:10;
  transition:all .2s;
}
.hero-arr:hover { background:#fff; color:var(--orange) }
.hero-al { left:24px }
.hero-ar { right:24px }

/* ─── SECTION HEADERS ────────────────────────────────────── */
.sh {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  margin-bottom:32px;
  gap:16px;
}
.sh-title {
  font-family:var(--serif);
  font-size:clamp(22px, 2.5vw, 30px);
  font-weight:400;
  color:var(--dark);
  line-height:1.2;
}
.sh-link {
  font-size:12px;
  font-weight:400;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--gold);
  display:inline-flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
  transition:color .2s;
}
.sh-link:hover { color:var(--orange) }
.sh-eyebrow {
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:8px;
  display:block;
}

/* ─── DIVIDER ─────────────────────────────────────────────── */
.divider {
  width:48px; height:1px;
  background:var(--gold);
  margin:0 auto;
}
.divider-l { margin:0 }

/* ─── CATEGORIAS NAV ─────────────────────────────────────── */
.cat-nav { padding:72px 0 64px }
.cat-grid {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:10px;
}
.cat-link {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 24px;
  background:var(--white);
  border:1px solid var(--border-l);
  cursor:pointer;
  transition:all .25s var(--ease);
  position:relative;
  overflow:hidden;
}
.cat-link::before {
  content:'';
  position:absolute;
  left:0; top:0; bottom:0;
  width:0;
  background:var(--gold);
  transition:width .25s var(--ease);
}
.cat-link:hover {
  border-color:var(--gold);
  box-shadow:0 2px 16px rgba(0,0,0,.05);
}
.cat-link:hover::before { width:3px }
.cat-link:hover .cat-arrow { opacity:1; transform:translateX(0) }
.cat-link:hover .cat-name { color:var(--dark) }
.cat-name {
  font-family:var(--serif);
  font-size:17px;
  font-weight:400;
  color:var(--dark-mid);
  transition:color .2s;
  letter-spacing:.01em;
}
.cat-count {
  font-size:10px;
  color:var(--light);
  letter-spacing:.06em;
  margin-left:auto;
  margin-right:12px;
}
.cat-arrow {
  color:var(--gold);
  opacity:0;
  transform:translateX(-4px);
  transition:all .25s var(--ease);
  flex-shrink:0;
}

/* ─── BANNER ─────────────────────────────────────────────── */
.bnr { padding:0 0 72px }
.bnr-i {
  background:var(--dark);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:52px 64px;
  gap:40px;
  position:relative;
  overflow:hidden;
  transition:background .3s;
}
.bnr-i::before {
  content:'';
  position:absolute;
  left:0; top:0; bottom:0;
  width:3px;
  background:var(--gold);
}
.bnr-i:hover { background:#252523 }
.bnr-tx { flex:1 }
.bnr-tag {
  font-size:10px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:12px;
  display:block;
}
.bnr-title {
  font-family:var(--serif);
  font-size:clamp(24px, 2.5vw, 34px);
  font-weight:300;
  color:#fff;
  line-height:1.25;
  margin-bottom:10px;
}
.bnr-desc {
  font-size:14px;
  font-weight:300;
  color:rgba(255,255,255,.5);
  max-width:360px;
  line-height:1.6;
}
.bnr-cta {
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:13px 32px;
  border:1px solid rgba(255,255,255,.2);
  color:#fff;
  font-size:12px;
  font-weight:400;
  letter-spacing:.1em;
  text-transform:uppercase;
  transition:all .25s;
  white-space:nowrap;
  flex-shrink:0;
}
.bnr-cta:hover { background:var(--orange); border-color:var(--orange) }

/* ─── PRODUTOS ───────────────────────────────────────────── */
.prod { padding:0 0 80px }
.prod-filters {
  display:flex;
  gap:8px;
  margin-bottom:32px;
  flex-wrap:wrap;
}
.pf-btn {
  padding:7px 20px;
  font-size:12px;
  font-weight:400;
  letter-spacing:.06em;
  text-transform:uppercase;
  border:1px solid var(--border);
  color:var(--mid);
  background:transparent;
  transition:all .2s;
}
.pf-btn:hover { border-color:var(--dark); color:var(--dark) }
.pf-btn.ac { background:var(--dark); color:#fff; border-color:var(--dark) }

.prod-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}

/* Product card */
.pc {
  background:var(--white);
  border:1px solid var(--border-l);
  display:block;
  position:relative;
  transition:all var(--speed) var(--ease);
}
.pc:hover {
  border-color:var(--border);
  box-shadow:0 8px 40px rgba(0,0,0,.07);
  transform:translateY(-2px);
}
.pc-img {
  aspect-ratio:1;
  background:var(--ice);
  overflow:hidden;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}
.pc-img img {
  width:100%; height:100%;
  object-fit:cover;
  transition:transform .5s var(--ease);
}
.pc:hover .pc-img img { transform:scale(1.04) }
.pc-img-ph {
  font-size:11px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--light);
}

/* Badge */
.pc-badge {
  position:absolute;
  top:12px; left:12px;
  padding:4px 10px;
  font-size:10px;
  font-weight:500;
  letter-spacing:.06em;
  text-transform:uppercase;
  z-index:2;
}
.pc-badge-promo { background:var(--orange); color:#fff }
.pc-badge-new { background:var(--dark); color:#fff }

/* Quick action — floating WA circle on hover (desktop) */
.pc-actions {
  position:absolute;
  bottom:12px; right:12px;
  padding:0;
  opacity:0;
  transform:scale(.85);
  transition:all .25s var(--ease);
  z-index:3;
}
.pc:hover .pc-actions { opacity:1; transform:scale(1) }
.pc-wa-circle {
  display:flex;
  width:42px; height:42px;
  border-radius:50%;
  background:var(--ice);
  align-items:center;
  justify-content:center;
  border:1px solid var(--border-l);
  transition:all .2s var(--ease);
  cursor:pointer;
  box-shadow:0 2px 12px rgba(0,0,0,.08);
}
.pc-wa-circle:hover {
  background:var(--white);
  border-color:var(--gold);
  box-shadow:0 4px 20px rgba(0,0,0,.12);
}
.pc-wa-circle svg {
  width:20px; height:20px;
  color:#25D366;
  flex-shrink:0;
}
/* Tooltip on desktop */
.pc-wa-circle::before {
  content:'Consultar preço';
  position:absolute;
  right:calc(100% + 8px);
  top:50%;
  transform:translateY(-50%);
  padding:6px 12px;
  background:var(--dark);
  color:rgba(255,255,255,.85);
  font-size:11px;
  font-family:var(--sans);
  letter-spacing:.04em;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s;
}
.pc-wa-circle:hover::before { opacity:1 }

/* Info */
.pc-info { padding:16px 18px 20px }
.pc-cat {
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:5px;
}
.pc-name {
  font-family:var(--serif);
  font-size:17px;
  font-weight:400;
  color:var(--dark);
  line-height:1.3;
  margin-bottom:10px;
}
.pc-price { font-size:16px; font-weight:400; color:var(--orange) }
.pc-price-from {
  font-size:12px;
  color:var(--light);
  text-decoration:line-through;
  margin-right:8px;
}
.pc-consult {
  font-size:12px;
  color:var(--mid);
  display:inline-flex;
  align-items:center;
  gap:5px;
  letter-spacing:.02em;
}
.pc-consult::after {
  content:'→';
  font-size:14px;
  color:var(--gold);
}
.pc-installments {
  font-size:11px;
  color:var(--light);
  margin-top:3px;
}

/* Mobile CTA — floating WA circle, always visible */
.pc-cta-mobile {
  display:none;
  position:absolute;
  bottom:10px; right:10px;
  width:36px; height:36px;
  border-radius:50%;
  background:var(--ice);
  color:#25D366;
  align-items:center;
  justify-content:center;
  border:1px solid var(--border-l);
  box-shadow:0 2px 10px rgba(0,0,0,.08);
  transition:transform .2s var(--ease), box-shadow .2s;
  z-index:4;
}
.pc-cta-mobile:active {
  transform:scale(.9);
  background:var(--white);
}
.pc-cta-mobile svg { width:18px; height:18px; flex-shrink:0 }

/* View more */
.vm { text-align:center; padding:16px 0 0 }
.vm-btn {
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 48px;
  border:1px solid var(--border);
  background:transparent;
  font-size:12px;
  font-weight:400;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--dark-mid);
  transition:all .25s;
}
.vm-btn:hover { border-color:var(--dark); background:var(--dark); color:#fff }

/* ─── DIFERENCIAIS ───────────────────────────────────────── */
.dif {
  background:var(--ice-2);
  padding:80px 0;
  border-top:1px solid var(--border-l);
  border-bottom:1px solid var(--border-l);
}
.dif-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:48px;
}
.dif-item { text-align:center }
.dif-icon {
  width:48px; height:48px;
  margin:0 auto 20px;
  color:var(--gold);
}
.dif-title {
  font-family:var(--serif);
  font-size:19px;
  font-weight:400;
  color:var(--dark);
  margin-bottom:10px;
  line-height:1.2;
}
.dif-desc {
  font-size:13px;
  font-weight:300;
  color:var(--mid);
  line-height:1.7;
  max-width:200px;
  margin:0 auto;
}

/* ─── SOBRE ──────────────────────────────────────────────── */
.sobre {
  padding:96px 0;
}
.sobre-i {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:center;
}
.sobre-img {
  aspect-ratio:4/3;
  background:var(--ice-2);
  border:1px solid var(--border-l);
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  overflow:hidden;
}
.sobre-img img { width:100%; height:100%; object-fit:cover }
.sobre-img-ph {
  font-size:11px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--light);
}
.sobre-yr {
  position:absolute;
  bottom:24px; left:24px;
  background:var(--dark);
  color:var(--gold);
  font-family:var(--serif);
  font-size:13px;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:10px 18px;
}
.sobre-tx {}
.sobre-eyebrow {
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:16px;
  display:block;
}
.sobre-title {
  font-family:var(--serif);
  font-size:clamp(28px, 3vw, 40px);
  font-weight:300;
  color:var(--dark);
  line-height:1.2;
  margin-bottom:24px;
}
.sobre-title em { font-style:italic }
.sobre-body {
  font-size:15px;
  font-weight:300;
  color:var(--mid);
  line-height:1.8;
  margin-bottom:16px;
}
.sobre-nums {
  display:flex;
  gap:40px;
  margin-top:40px;
  padding-top:32px;
  border-top:1px solid var(--border-l);
}
.sobre-num-item {}
.sobre-num {
  font-family:var(--serif);
  font-size:40px;
  font-weight:300;
  color:var(--orange);
  line-height:1;
  margin-bottom:4px;
}
.sobre-num-label {
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--mid);
}

/* ─── FOOTER ─────────────────────────────────────────────── */
footer {
  background:var(--dark);
  color:rgba(255,255,255,.55);
  padding:64px 0 32px;
}
.ft-grid {
  display:grid;
  grid-template-columns:1.8fr 1fr 1fr 1.4fr;
  gap:48px;
  margin-bottom:48px;
}
.ft-logo-name {
  font-family:var(--serif);
  font-size:22px;
  font-weight:400;
  letter-spacing:.28em;
  color:rgba(255,255,255,.85);
  text-transform:uppercase;
  margin-bottom:2px;
}
.ft-logo-sub {
  font-size:9px;
  letter-spacing:.35em;
  color:var(--gold);
  text-transform:uppercase;
  margin-bottom:20px;
}
.ft-desc {
  font-size:13px;
  font-weight:300;
  line-height:1.7;
  margin-bottom:24px;
  max-width:260px;
  color:rgba(255,255,255,.4);
}
.ft-social { display:flex; gap:10px }
.ft-social a {
  width:36px; height:36px;
  border:1px solid rgba(255,255,255,.1);
  display:flex; align-items:center; justify-content:center;
  font-size:12px;
  color:rgba(255,255,255,.4);
  transition:all .2s;
  letter-spacing:0;
}
.ft-social a:hover { border-color:var(--gold); color:var(--gold) }
.ft-col h4 {
  font-size:10px;
  font-weight:500;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:rgba(255,255,255,.85);
  margin-bottom:20px;
}
.ft-col ul li { margin-bottom:10px }
.ft-col a {
  font-size:13px;
  font-weight:300;
  color:rgba(255,255,255,.4);
  transition:color .2s;
}
.ft-col a:hover { color:var(--gold) }
.ft-contact-item {
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin-bottom:14px;
  font-size:13px;
  font-weight:300;
  line-height:1.5;
  color:rgba(255,255,255,.4);
}
.ft-contact-item svg { flex-shrink:0; margin-top:2px; color:var(--gold); opacity:.7 }
.ft-bottom {
  border-top:1px solid rgba(255,255,255,.07);
  padding-top:24px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:11px;
  color:rgba(255,255,255,.25);
  letter-spacing:.03em;
}
.ft-bottom a { color:rgba(255,255,255,.25); transition:color .2s }
.ft-bottom a:hover { color:var(--gold) }

/* ─── WHATSAPP FLOAT ─────────────────────────────────────── */
.wf {
  position:fixed;
  bottom:28px; right:28px;
  z-index:999;
  display:flex;
  align-items:center;
  gap:12px;
}
.wf-label {
  background:var(--white);
  padding:9px 16px;
  font-size:13px;
  font-weight:400;
  color:var(--dark);
  border:1px solid var(--border-l);
  box-shadow:0 2px 12px rgba(0,0,0,.08);
  white-space:nowrap;
  animation:fadeIn .4s ease 2s both;
}
@keyframes fadeIn {
  from { opacity:0; transform:translateX(8px) }
  to { opacity:1; transform:translateX(0) }
}
.wf-btn {
  width:56px; height:56px;
  background:#25D366;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:#fff;
  box-shadow:0 4px 20px rgba(37,211,102,.35);
  transition:all .25s;
}
.wf-btn:hover { transform:scale(1.08); box-shadow:0 6px 28px rgba(37,211,102,.45) }

/* ─── MOBILE NAV ─────────────────────────────────────────── */
.mob-nav {
  display:none;
  position:fixed; inset:0;
  background:#fff;
  z-index:1000;
  flex-direction:column;
  overflow-y:auto;
}
.mob-nav.open { display:flex }
.mob-nav-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:20px 24px;
  border-bottom:1px solid var(--border-l);
}
.mob-nav-body { padding:16px 0; flex:1 }
.mob-nav-body a {
  display:block;
  padding:13px 24px;
  font-size:15px;
  font-weight:400;
  color:var(--dark);
  border-bottom:1px solid var(--border-l);
  transition:color .2s;
}
.mob-nav-body a:hover { color:var(--orange) }
.mob-nav-body a.promo { color:var(--orange) }
.mob-nav-foot {
  padding:24px;
  border-top:1px solid var(--border-l);
}
.mob-close {
  background:none; border:none;
  font-size:22px; color:var(--dark);
  cursor:pointer; padding:4px;
}

/* ─── RESPONSIVE ─────────────────────────────────────────── */
/* Mobile WA button - hidden on desktop */
.pc-wa-mobile { display:none }

/* ─── MOBILE BASE (até 767px) ────────────────────────────── */
@media(max-width:767px) {

  /* Layout */
  .w { padding:0 16px }

  /* Topbar — esconder */
  .tb { display:none }

  /* Header — logo centralizado, hamburguer flutuando à direita */
  .hd-i { height:60px; position:relative; justify-content:center; gap:0 }
  .hd-sr { display:none }
  .hd-cta { display:none }
  .logo { margin:0 auto }
  .logo-img { height:40px }
  .hd-a { position:absolute; right:0; top:50%; transform:translateY(-50%); gap:0 }
  .hd-menu-btn { display:flex; align-items:center; justify-content:center }

  /* Navbar — esconder, mobile usa overlay */
  .nb { display:none }

  /* Hero */
  .hero-s { height:72vw; min-height:260px }
  .hero-content { margin-top:16px; padding:0 16px }
  .hero-title { font-size:24px; margin-bottom:4px }
  .hero-sub { font-size:13px }
  .hero-al { left:10px }
  .hero-ar { right:10px }
  .hero-arr { width:36px; height:36px }


  /* Categorias (genérica) */
  .cat-grid { grid-template-columns:1fr; gap:6px }
  .cat-link { padding:14px 16px }
  .cat-name { font-size:15px }
  .cat-arrow { opacity:1; transform:translateX(0) }
  .sh-title { font-size:20px }
  .sh { margin-bottom:20px }

  /* Banner */
  .bnr { padding:0 0 40px }
  .bnr-i { flex-direction:column; padding:28px 20px; gap:20px; text-align:center; align-items:flex-start }
  .bnr-i::before { width:100%; height:3px; top:0; bottom:auto }
  .bnr-title { font-size:20px }
  .bnr-desc { font-size:13px; max-width:100% }
  .bnr-cta { width:100%; justify-content:center; padding:12px 20px }

  /* Produtos — listagem (home, catálogo, ambiente, busca) */
  .prod { padding:0 0 48px }
  .prod-filters { gap:6px; overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch; padding-bottom:4px }
  .pf-btn { padding:6px 14px; font-size:11px; flex-shrink:0 }




  /* Botão "ver mais" */
  .vm-btn { padding:12px 32px; font-size:11px }

  /* Diferenciais */
  .dif { padding:48px 0 }
  .dif-grid { grid-template-columns:1fr 1fr; gap:32px 20px }
  .dif-title { font-size:16px }
  .dif-desc { font-size:12px; max-width:100% }
  .dif-icon { width:36px; height:36px; margin-bottom:12px }

  /* Sobre */
  .sobre { padding:48px 0 }
  .sobre-i { grid-template-columns:1fr; gap:32px }
  .sobre-title { font-size:26px }
  .sobre-body { font-size:14px }
  .sobre-nums { gap:16px; flex-wrap:wrap }
  .sobre-num { font-size:32px }
  .sobre-num-label { font-size:11px }

  /* Depoimentos */
  .dep { padding:48px 0 }
  .dep-quote { font-size:17px }
  .dep-quote::before { font-size:48px; top:-16px }
  .dep-arr { width:34px; height:34px }

  /* Instagram */
  .insta { padding:40px 0 48px }
  .insta-grid { grid-template-columns:repeat(3,1fr); gap:4px }

  /* Localização */
  .loc { padding:48px 0 }
  .loc-i { grid-template-columns:1fr; gap:28px }
  .loc-map { aspect-ratio:16/10 }
  .loc-title { font-size:22px }
  .loc-cta { width:100%; justify-content:center }

  /* Página de produto */
  .prod-layout { grid-template-columns:1fr; gap:24px }
  .gallery-thumbs { gap:6px }
  .gallery-thumb { width:56px; height:56px }
  .prod-name { font-size:26px }
  .measures-grid { gap:8px }
  .measure { padding:10px 14px; min-width:64px }
  .prod-cta { flex-direction:column }
  .prod-wa { padding:14px }

  /* Paginação */
  .pag { gap:4px }
  .pag a, .pag span { padding:6px 10px; font-size:11px }

  /* Footer */
  footer { padding:48px 0 24px }
  .ft-grid { grid-template-columns:1fr 1fr; gap:32px }
  .ft-bottom { flex-direction:column; gap:12px; text-align:center }
  .ft-logo-name { font-size:18px }

  /* WhatsApp float */
  .wf-label { display:none }
  .wf { bottom:16px; right:16px }
  .wf-btn { width:50px; height:50px }
}


/* ─── MOBILE NAV (sempre fixo, começa fora da tela) ──────── */
.mob-nav {
  position:fixed;
  top:0; right:0; bottom:0;
  width:min(320px, 85vw);
  background:var(--white);
  z-index:500;
  transform:translateX(100%);
  transition:transform .3s var(--ease);
  display:flex;
  flex-direction:column;
  box-shadow:-4px 0 24px rgba(0,0,0,.12);
}
.mob-nav.open { transform:translateX(0) }
.mob-nav-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 20px;
  border-bottom:1px solid var(--border-l);
  flex-shrink:0;
}
.mob-close { font-size:20px; color:var(--mid); padding:4px }
.mob-nav-body { flex:1; overflow-y:auto; padding:8px 0 }
.mob-nav-body a {
  display:block;
  padding:13px 20px;
  font-size:14px;
  color:var(--dark);
  border-bottom:1px solid var(--border-l);
  transition:background .15s;
}
.mob-nav-body a:hover { background:var(--ice) }
.mob-nav-body a.promo { color:var(--orange) }
.mob-nav-foot { padding:16px 20px; border-top:1px solid var(--border-l); flex-shrink:0 }


/* ─── TABLET (768px–1023px) ──────────────────────────────── */
@media(min-width:768px) and (max-width:1023px) {
  .w { padding:0 32px }
  .hd-sr { flex:0 1 260px }
  .cat-grid { grid-template-columns:repeat(2,1fr) }
  .prod-grid { grid-template-columns:repeat(2,1fr) }
  .dif-grid { grid-template-columns:repeat(2,1fr); gap:36px }
  .ft-grid { grid-template-columns:1fr 1fr; gap:32px }
  .sobre-i { grid-template-columns:1fr; gap:40px }
  .nb-mega { width:560px; grid-template-columns:repeat(2,1fr) }
  .bnr-i { padding:36px 40px }
  .insta-grid { grid-template-columns:repeat(3,1fr) }
  .loc-i { grid-template-columns:1fr; gap:32px }
  .pg { grid-template-columns:repeat(3,1fr); gap:16px }
  .prod-layout { gap:32px }
}

/* ─── DESKTOP MÉDIO (1024px–1199px) ─────────────────────── */
@media(min-width:1024px) and (max-width:1199px) {
  .cat-grid { grid-template-columns:repeat(2,1fr) }
  .prod-grid { grid-template-columns:repeat(3,1fr) }
  .dif-grid { grid-template-columns:repeat(4,1fr) }
  .ft-grid { grid-template-columns:1.4fr 1fr 1fr 1.2fr }
}

/* ─── DEPOIMENTOS ────────────────────────────────────────── */
.dep {
  padding:80px 0;
  background:var(--white);
  border-top:1px solid var(--border-l);
}
.dep-slider {
  position:relative;
  overflow:hidden;
}
.dep-track {
  display:flex;
  transition:transform .6s var(--ease);
  will-change:transform;
}
.dep-slide {
  min-width:100%;
  padding:0 20px;
}
.dep-card {
  max-width:680px;
  margin:0 auto;
  text-align:center;
}
.dep-stars {
  display:flex;
  justify-content:center;
  gap:4px;
  margin-bottom:20px;
}
.dep-star {
  width:18px; height:18px;
  color:var(--gold);
}
.dep-quote {
  font-family:var(--serif);
  font-size:clamp(18px, 2.2vw, 24px);
  font-weight:300;
  font-style:italic;
  color:var(--dark);
  line-height:1.6;
  margin-bottom:24px;
  position:relative;
}
.dep-quote::before {
  content:'"';
  font-family:var(--serif);
  font-size:64px;
  color:var(--gold);
  opacity:.3;
  position:absolute;
  top:-24px; left:50%;
  transform:translateX(-50%);
  line-height:1;
}
.dep-author {
  font-size:14px;
  font-weight:500;
  color:var(--dark);
  margin-bottom:2px;
}
.dep-source {
  font-size:12px;
  color:var(--light);
  letter-spacing:.06em;
}
.dep-nav {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:16px;
  margin-top:32px;
}
.dep-arr {
  width:40px; height:40px;
  border:1px solid var(--border);
  background:transparent;
  display:flex; align-items:center; justify-content:center;
  color:var(--dark-mid);
  cursor:pointer;
  transition:all .2s;
}
.dep-arr:hover { border-color:var(--dark); color:var(--dark) }
.dep-dots {
  display:flex; gap:6px;
}
.dep-dot {
  width:6px; height:6px;
  border-radius:50%;
  background:var(--border);
  border:none; padding:0;
  cursor:pointer;
  transition:all .3s;
}
.dep-dot.ac {
  background:var(--gold);
  width:20px;
  border-radius:3px;
}
.dep-google {
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:28px;
  font-size:12px;
  color:var(--mid);
  letter-spacing:.04em;
  transition:color .2s;
}
.dep-google:hover { color:var(--gold) }
.dep-google svg { flex-shrink:0 }

/* ─── INSTAGRAM ──────────────────────────────────────────── */
.insta {
  padding:72px 0 80px;
  background:var(--ice);
}
.insta-grid {
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:8px;
}
.insta-item {
  aspect-ratio:1;
  background:var(--ice-2);
  border:1px solid var(--border-l);
  overflow:hidden;
  position:relative;
  display:flex; align-items:center; justify-content:center;
}
.insta-item img {
  width:100%; height:100%;
  object-fit:cover;
  transition:transform .5s var(--ease), filter .5s;
}
.insta-item:hover img { transform:scale(1.06); filter:brightness(.92) }
.insta-overlay {
  position:absolute; inset:0;
  background:rgba(44,44,42,.45);
  opacity:0;
  display:flex; align-items:center; justify-content:center;
  transition:opacity .3s;
}
.insta-item:hover .insta-overlay { opacity:1 }
.insta-overlay svg { color:#fff; width:24px; height:24px }
.insta-ph {
  font-size:10px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--light);
}
.insta-cta {
  text-align:center;
  margin-top:32px;
}
.insta-btn {
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:13px 36px;
  border:1px solid var(--border);
  background:transparent;
  font-size:12px;
  font-weight:400;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--dark-mid);
  transition:all .25s;
}
.insta-btn:hover { border-color:var(--dark); background:var(--dark); color:#fff }

/* ─── LOCALIZAÇÃO / MAPA ─────────────────────────────────── */
.loc {
  padding:80px 0;
  background:var(--white);
  border-top:1px solid var(--border-l);
}
.loc-i {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  align-items:start;
}
.loc-map {
  aspect-ratio:4/3;
  background:var(--ice-2);
  border:1px solid var(--border-l);
  overflow:hidden;
  position:relative;
}
.loc-map iframe {
  width:100%; height:100%;
  border:none;
}
.loc-info {}
.loc-eyebrow {
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:12px;
  display:block;
}
.loc-title {
  font-family:var(--serif);
  font-size:clamp(24px, 2.5vw, 32px);
  font-weight:300;
  color:var(--dark);
  line-height:1.25;
  margin-bottom:28px;
}
.loc-detail {
  display:flex;
  gap:14px;
  margin-bottom:20px;
  align-items:flex-start;
}
.loc-detail-icon {
  width:20px; height:20px;
  color:var(--gold);
  flex-shrink:0;
  margin-top:2px;
}
.loc-detail-text {
  font-size:14px;
  font-weight:300;
  color:var(--dark-mid);
  line-height:1.6;
}
.loc-detail-text strong {
  font-weight:500;
  color:var(--dark);
  display:block;
  margin-bottom:2px;
  font-size:13px;
  letter-spacing:.02em;
}
.loc-cta {
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:13px 32px;
  background:var(--orange);
  color:#fff;
  font-size:13px;
  font-weight:500;
  letter-spacing:.04em;
  margin-top:12px;
  transition:background var(--speed) var(--ease);
}
.loc-cta:hover { background:var(--orange-h) }
.loc-cta svg { flex-shrink:0 }

/* ─── RESPONSIVE: New sections ───────────────────────────── */
/* ─── ADMIN BUTTON ────────────────────────────────────────── */
.admin-float {
  position:fixed;
  bottom:28px; left:28px;
  z-index:998;
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 18px;
  background:var(--dark);
  color:rgba(255,255,255,.7);
  font-size:12px;
  font-weight:400;
  letter-spacing:.04em;
  border:1px solid rgba(255,255,255,.1);
  cursor:pointer;
  transition:all .25s;
  text-decoration:none;
  font-family:var(--sans);
}
.admin-float:hover { background:#1a1a18; color:var(--gold) }
@media(max-width:767px) {
  .admin-float { bottom:76px; left:16px; padding:8px 14px; font-size:11px }
}

/* placeholder for missing images */
.img-placeholder {
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
  font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--light); background:var(--ice-2);
}



/* ─── PÁGINAS ESPECÍFICAS ──────────────────────────────── */
/* ─── BREADCRUMB ─── */
.bc{padding:20px 0 0;font-size:12px;color:var(--light);letter-spacing:.02em}
.bc a{color:var(--mid)}
.bc a:hover{color:var(--gold)}
.bc span{color:var(--dark-mid)}

/* ─── CATEGORY HEADER ─── */
.cat-head{padding:28px 0 36px;text-align:center}
.cat-head h1{font-family:var(--serif);font-size:clamp(28px,4vw,42px);font-weight:300;color:var(--dark);margin-bottom:8px}
.cat-head p{font-size:14px;color:var(--mid);max-width:480px;margin:0 auto;font-weight:300}
.cat-count{font-size:12px;color:var(--light);letter-spacing:.06em;margin-top:4px}

/* ─── PRODUCT GRID (catalog) ─── */

/* ─── PRODUCT PAGE ─── */
.prod-page{padding:32px 0 60px}
.prod-layout{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.gallery-main{aspect-ratio:1;background:var(--white);border:1px solid var(--border-l);overflow:hidden;margin-bottom:12px;display:flex;align-items:center;justify-content:center;cursor:zoom-in}
.gallery-main img{width:100%;height:100%;object-fit:contain;transition:transform .4s var(--ease)}
.gallery-main:hover img{transform:scale(1.08)}
.gallery-thumbs{display:flex;gap:8px}
.gallery-thumb{width:72px;height:72px;background:var(--white);border:1px solid var(--border-l);cursor:pointer;overflow:hidden;transition:border-color .2s;display:flex;align-items:center;justify-content:center}
.gallery-thumb:hover,.gallery-thumb.active{border-color:var(--gold)}
.gallery-thumb img{width:100%;height:100%;object-fit:contain}
.prod-cat-label{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.prod-name{font-family:var(--serif);font-size:clamp(28px,3.5vw,40px);font-weight:300;color:var(--dark);line-height:1.2;margin-bottom:16px}
.prod-desc{font-size:14px;font-weight:300;color:var(--mid);line-height:1.8;margin-bottom:28px;max-width:440px}
.prod-price-box{padding:24px 0;border-top:1px solid var(--border-l);border-bottom:1px solid var(--border-l);margin-bottom:28px}
.prod-consult{font-family:var(--serif);font-size:22px;font-weight:400;color:var(--gold);font-style:italic}
.prod-measures{margin-bottom:28px}
.prod-measures h3{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--light);margin-bottom:10px}
.measures-grid{display:flex;gap:16px}
.measure{padding:12px 20px;background:var(--white);border:1px solid var(--border-l);text-align:center;min-width:80px}
.measure-label{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--light);margin-bottom:4px}
.measure-val{font-family:var(--serif);font-size:22px;font-weight:400;color:var(--dark)}
.measure-unit{font-size:12px;color:var(--mid);font-weight:300}
.prod-cta{display:flex;gap:12px;margin-bottom:32px}
.prod-wa{display:inline-flex;align-items:center;gap:10px;padding:14px 32px;background:#25D366;color:#fff;font-size:14px;font-weight:500;transition:all .2s;flex:1;justify-content:center}
.prod-wa:hover{background:#1da851;color:#fff}
.prod-wa svg{width:20px;height:20px;flex-shrink:0}
.prod-tel{display:inline-flex;align-items:center;gap:8px;padding:14px 24px;border:1px solid var(--border);color:var(--dark-mid);font-size:13px;transition:all .2s}
.prod-tel:hover{border-color:var(--dark);color:var(--dark)}
.prod-details{padding-top:24px;border-top:1px solid var(--border-l)}
.prod-details h3{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--light);margin-bottom:12px}
.detail-tags{display:flex;flex-wrap:wrap;gap:8px}
.detail-tag{padding:6px 14px;background:var(--white);border:1px solid var(--border-l);font-size:12px;color:var(--mid)}
/* ─── ADMIN ──────────────────────────────────────────────── */
body.admin-body { background:#f0ede9 }
.adm-hd { background:var(--dark); color:#fff; padding:14px 24px; display:flex; align-items:center; justify-content:space-between }
.adm-hd h1 { font-family:var(--serif); font-size:22px; font-weight:400 }
.adm-nav { background:var(--dark); border-top:1px solid rgba(255,255,255,.08); display:flex; gap:0; padding:0 24px }
.adm-nav a { color:rgba(255,255,255,.6); font-size:11px; padding:10px 14px; letter-spacing:.06em; text-transform:uppercase; transition:color .2s }
.adm-nav a:hover, .adm-nav a.ac { color:var(--gold) }
.adm-wrap { padding:32px 24px; max-width:1200px; margin:0 auto }
.adm-card { background:#fff; border-radius:2px; padding:24px; margin-bottom:24px; box-shadow:0 1px 4px rgba(0,0,0,.05) }
.adm-card h2 { font-family:var(--serif); font-size:22px; font-weight:400; margin-bottom:20px; padding-bottom:12px; border-bottom:1px solid var(--border-l) }
.adm-stats { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:16px; margin-bottom:32px }
.adm-stat { background:#fff; padding:20px; text-align:center; border-radius:2px; box-shadow:0 1px 4px rgba(0,0,0,.05) }
.adm-stat-n { font-family:var(--serif); font-size:36px; font-weight:300; line-height:1 }
.adm-stat-l { font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--mid); margin-top:6px }
.fg { margin-bottom:16px }
.fg label { display:block; font-size:11px; font-weight:500; letter-spacing:.08em; text-transform:uppercase; color:var(--mid); margin-bottom:6px }
.fc { width:100%; padding:9px 12px; border:1px solid var(--border-l); font-family:var(--sans); font-size:14px; color:var(--dark); background:#fff; outline:none; transition:border-color .2s; border-radius:0 }
.fc:focus { border-color:var(--gold) }
textarea.fc { min-height:90px; resize:vertical }
select.fc { cursor:pointer }
.btn { display:inline-flex; align-items:center; gap:6px; padding:9px 20px; font-family:var(--sans); font-size:12px; font-weight:500; letter-spacing:.04em; border:none; cursor:pointer; transition:all .2s; text-decoration:none; white-space:nowrap }
.btn-dark { background:var(--dark); color:#fff }
.btn-dark:hover { background:#1a1a18 }
.btn-gold { background:var(--gold); color:#fff }
.btn-gold:hover { background:#b8925a }
.btn-danger { background:#c0392b; color:#fff }
.btn-danger:hover { background:#a93226 }
.btn-sm { padding:5px 12px; font-size:11px }
.btn-ghost { background:transparent; border:1px solid var(--border); color:var(--dark-mid) }
.btn-ghost:hover { border-color:var(--dark); background:var(--dark); color:#fff }
.tbl { width:100%; border-collapse:collapse; font-size:13px }
.tbl th { background:var(--ice); padding:9px 12px; text-align:left; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--mid); border-bottom:1px solid var(--border-l) }
.tbl td { padding:10px 12px; border-bottom:1px solid var(--border-l); vertical-align:middle }
.tbl tr:hover td { background:var(--ice) }
.tbl td img { width:44px; height:44px; object-fit:cover }
.badge { display:inline-block; padding:3px 8px; font-size:10px; font-weight:500; letter-spacing:.04em }
.badge-on { background:#e8f5e9; color:#2e7d32 }
.badge-off { background:var(--ice-2); color:var(--mid) }
.badge-promo { background:#fff3e0; color:var(--orange) }
.alert { padding:12px 16px; margin-bottom:20px; font-size:13px }
.alert-ok { background:#e8f5e9; color:#2e7d32; border-left:3px solid #2e7d32 }
.alert-err { background:#fdecea; color:#c62828; border-left:3px solid #c62828 }
.foto-grid { display:flex; flex-wrap:wrap; gap:10px; margin-top:12px }
.foto-item { position:relative; width:96px; height:96px; cursor:grab; user-select:none; transition:opacity .2s, transform .2s }
.foto-item:active { cursor:grabbing }
.foto-item img { width:100%; height:100%; object-fit:cover; pointer-events:none }
.foto-capa-badge { display:none; position:absolute; bottom:4px; left:4px; background:var(--gold,#C9A96E); color:#fff; font-size:9px; font-weight:600; letter-spacing:.5px; text-transform:uppercase; padding:2px 6px; border-radius:2px; pointer-events:none; z-index:2 }
.foto-item:first-child .foto-capa-badge { display:block }
.foto-ghost { opacity:.4 }
.foto-chosen { transform:scale(1.05); box-shadow:0 4px 12px rgba(0,0,0,.2) }
.foto-check-wrap { position:absolute; top:4px; right:4px; width:22px; height:22px; background:rgba(255,255,255,.92); border-radius:3px; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:3; box-shadow:0 1px 3px rgba(0,0,0,.2) }
.foto-check { width:14px; height:14px; cursor:pointer; accent-color:#c0392b; margin:0 }
.foto-item.foto-removida { display:none }
.foto-del { position:absolute; top:4px; left:4px; width:22px; height:22px; border:none; border-radius:3px; background:rgba(192,57,43,.92); color:#fff; font-size:16px; font-weight:600; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; z-index:3; box-shadow:0 1px 3px rgba(0,0,0,.2); transition:background .15s }

/* Preview de fotos novas no upload */
.foto-preview-grid { display:flex; flex-wrap:wrap; gap:10px; margin-top:12px }
.foto-preview-grid:empty { margin:0 }
.foto-preview-item { position:relative; width:96px; height:96px; border:2px dashed #c9a96e; background:#fff }
.foto-preview-item img { width:100%; height:100%; object-fit:cover; display:block }
.foto-preview-tag { position:absolute; bottom:4px; left:4px; background:#2d7a3e; color:#fff; font-size:9px; font-weight:600; letter-spacing:.5px; text-transform:uppercase; padding:2px 6px; border-radius:2px; pointer-events:none; z-index:2 }
.foto-preview-del { position:absolute; top:4px; right:4px; width:22px; height:22px; border:none; border-radius:3px; background:rgba(192,57,43,.92); color:#fff; font-size:16px; font-weight:600; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; z-index:3; box-shadow:0 1px 3px rgba(0,0,0,.2) }
.foto-preview-del:hover { background:#a93226 }
.foto-del:hover { background:#a93226 }
.foto-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 14px; background:#fdecea; border:1px solid #f5c6c2; border-radius:4px; margin-bottom:12px; font-size:13px; color:#7a1f17 }

/* Tela de ordenação por categoria */
.ord-grid { display:flex; flex-direction:column; gap:8px }
.ord-item { display:flex; align-items:center; gap:14px; padding:10px 14px; background:#fff; border:1px solid var(--border-l,#e5e1da); border-radius:4px; cursor:grab; user-select:none; transition:box-shadow .15s }
.ord-item:hover { box-shadow:0 2px 6px rgba(0,0,0,.06) }
.ord-item:active { cursor:grabbing }
.ord-item-static { cursor:default }
.ord-item-static:hover { box-shadow:none }
.ord-pos { width:28px; height:28px; display:flex; align-items:center; justify-content:center; background:var(--gold,#C9A96E); color:#fff; font-weight:600; font-size:13px; border-radius:50%; flex-shrink:0 }
.ord-item img { width:48px; height:48px; object-fit:cover; flex-shrink:0; pointer-events:none }
.ord-item-static img { pointer-events:auto }
.ord-info { flex:1; min-width:0; display:flex; align-items:center; gap:10px }
.ord-nome { font-size:14px; color:var(--dark); overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.ord-action { flex-shrink:0 }
.pag { display:flex; justify-content:center; gap:6px; margin-top:32px }
.pag a, .pag span { padding:7px 13px; border:1px solid var(--border-l); font-size:12px; color:var(--dark) }
.pag a:hover { background:var(--ice) }
.pag .cur { background:var(--dark); color:#fff; border-color:var(--dark) }

/* ─── BANNER HOME ─────────────────────────────────────────── */
.bnr { margin:32px 0 0 }
.bnr-i {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:40px 48px;
  background:var(--dark);
  gap:32px;
  text-decoration:none;
  transition:opacity .2s;
}
.bnr-i:hover { opacity:.92 }
.bnr-tx { flex:1 }
.bnr-tag {
  font-size:10px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:10px;
  display:block;
}
.bnr-title {
  font-family:var(--serif);
  font-size:clamp(22px,3vw,36px);
  font-weight:300;
  color:#fff;
  line-height:1.2;
  margin-bottom:10px;
  white-space:pre-line;
}
.bnr-desc {
  font-size:13px;
  font-weight:300;
  color:rgba(255,255,255,.5);
  line-height:1.6;
  max-width:420px;
}
.bnr-cta {
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 28px;
  border:1px solid rgba(255,255,255,.2);
  color:#fff;
  font-size:11px;
  font-weight:500;
  letter-spacing:.1em;
  text-transform:uppercase;
  white-space:nowrap;
  flex-shrink:0;
  transition:border-color .2s, background .2s;
}
.bnr-cta:hover { border-color:var(--gold); background:rgba(201,169,110,.1) }

/* ─── MOBILE: CORREÇÕES GERAIS ───────────────────────────── */


/* ─── MOBILE NAV (sempre fixo, começa fora da tela) ──────── */
.mob-nav {
  position:fixed;
  top:0; right:0; bottom:0;
  width:min(320px, 85vw);
  background:var(--white);
  z-index:500;
  transform:translateX(100%);
  transition:transform .3s var(--ease);
  display:flex;
  flex-direction:column;
  box-shadow:-4px 0 24px rgba(0,0,0,.12);
}
.mob-nav.open { transform:translateX(0) }
.mob-nav-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 20px;
  border-bottom:1px solid var(--border-l);
  flex-shrink:0;
}
.mob-close { font-size:20px; color:var(--mid); padding:4px }
.mob-nav-body { flex:1; overflow-y:auto; padding:8px 0 }
.mob-nav-body a {
  display:block;
  padding:13px 20px;
  font-size:14px;
  color:var(--dark);
  border-bottom:1px solid var(--border-l);
  transition:background .15s;
}
.mob-nav-body a:hover { background:var(--ice) }
.mob-nav-body a.promo { color:var(--orange) }
.mob-nav-foot { padding:16px 20px; border-top:1px solid var(--border-l); flex-shrink:0 }


/* ════════════════════════════════════════════════════════════
   ─── PRODUTOS, CATEGORIAS HOME, CATÁLOGO ─── 
   Reconstrução mobile-first. Esta é a ÚNICA fonte de verdade
   para .cat-grid-home, .cat-link-home, .pg, .prod-grid, .pc.
   ════════════════════════════════════════════════════════════ */

/* ─── BASE (mobile) ──────────────────────────────────────── */

/* Navegue por tipo — 2 colunas no mobile */
.cat-grid-home {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.cat-link-home {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 16px;
  background: var(--white);
  border: 1px solid var(--border-l);
  transition: all .25s var(--ease);
  font-family: var(--serif);
  font-weight: 300;
}
.cat-link-home .cat-name {
  font-family: var(--serif);
  font-size: 14px;
  font-weight: 300;
  color: var(--dark-mid);
}
.cat-link-home .cat-arrow {
  color: var(--gold);
  opacity: 1;
  transform: none;
  flex-shrink: 0;
}
.cat-link-home:hover {
  border-color: var(--gold);
  box-shadow: 0 2px 16px rgba(0,0,0,.05);
}

/* Grids de produto — 1 COLUNA mobile */
.pg,
.prod-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  padding-bottom: 40px;
}

/* Card de produto — vertical, foto 1:1 mobile */
.pc {
  background: var(--white);
  border: 1px solid var(--border-l);
  display: block;
  position: relative;
  transition: all var(--speed) var(--ease);
}
.pc:hover {
  border-color: var(--border);
  box-shadow: 0 8px 40px rgba(0,0,0,.07);
}
.pc-img {
  aspect-ratio: 1 / 1;
  background: var(--ice);
  overflow: hidden;
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pc-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform .5s var(--ease);
}
.pc:hover .pc-img img { transform: scale(1.04) }

.pc-info { padding: 18px 18px 22px }
.pc-cat {
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 8px;
}
.pc-name {
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 300;
  color: var(--dark);
  line-height: 1.25;
  margin-bottom: 10px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pc-price { font-size: 16px; font-weight: 500; color: var(--orange) }
.pc-price-from {
  font-size: 11px;
  color: var(--light);
  text-decoration: line-through;
  margin-right: 8px;
}
.pc-installments { font-size: 11px; color: var(--light); margin-top: 3px }
.pc-consult {
  font-family: var(--serif);
  font-style: italic;
  font-size: 15px;
  color: var(--gold);
  font-weight: 400;
}
.pc-consult::after { content: none }

/* Badge */
.pc-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  padding: 4px 10px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .06em;
  text-transform: uppercase;
  z-index: 2;
}

/* WhatsApp circle no mobile (sempre visível) */
.pc-cta-mobile {
  display: flex;
  position: absolute;
  bottom: 14px;
  right: 14px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--white);
  color: #25D366;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border-l);
  box-shadow: 0 2px 10px rgba(0,0,0,.08);
  z-index: 4;
}
.pc-cta-mobile svg { width: 22px; height: 22px; flex-shrink: 0 }

/* Esconde overlays de desktop no mobile */
.pc-actions { display: none }
.pc-wa-mobile { display: none }


/* ─── TABLET (≥ 768px) ───────────────────────────────────── */
@media (min-width: 768px) {
  .cat-grid-home { grid-template-columns: repeat(2, 1fr); gap: 12px }
  .cat-link-home { padding: 18px 20px }
  .cat-link-home .cat-name { font-size: 16px }

  .pg,
  .prod-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .pc-cta-mobile { display: none }
  .pc-actions { display: block }
  .pc-actions {
    position: absolute;
    bottom: 12px;
    right: 12px;
    opacity: 0;
    transform: scale(.85);
    transition: all .25s var(--ease);
    z-index: 3;
  }
  .pc:hover .pc-actions { opacity: 1; transform: scale(1) }
}


/* ─── DESKTOP (≥ 1024px) ─────────────────────────────────── */
@media (min-width: 1024px) {
  .cat-grid-home { grid-template-columns: repeat(3, 1fr); gap: 12px }
  .cat-link-home { padding: 20px 24px }
  .cat-link-home .cat-name { font-size: 17px }

  .pg { grid-template-columns: repeat(4, 1fr); gap: 20px; padding-bottom: 60px }
  .prod-grid { grid-template-columns: repeat(4, 1fr); gap: 20px }
}


/* ─── DESKTOP MÉDIO (1024px–1199px) ─────────────────────── */
@media (min-width: 1024px) and (max-width: 1199px) {
  .pg,
  .prod-grid { grid-template-columns: repeat(3, 1fr) }
}


/* ════════════════════════════════════════════════════════════
   ─── ADMIN IDENTIDADE ───
   Logo do site no header do admin, em vez de "Versátile Admin"
   ════════════════════════════════════════════════════════════ */

.adm-hd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 24px;
}
.adm-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}
.adm-brand img {
  height: 32px;
  width: auto;
  display: block;
  filter: brightness(0) invert(1);
  opacity: .9;
}
.adm-brand-label {
  font-family: var(--serif);
  font-size: 13px;
  font-weight: 300;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--gold);
  padding-left: 12px;
  border-left: 1px solid rgba(255,255,255,.15);
}
.adm-hd-right {
  display: flex;
  gap: 20px;
  align-items: center;
  font-size: 12px;
}
.adm-hd-link {
  color: rgba(255,255,255,.5);
  transition: color .2s;
  letter-spacing: .04em;
}
.adm-hd-link:hover { color: #fff }
.adm-hd-link-gold { color: var(--gold) }
.adm-hd-link-gold:hover { color: var(--gold-light) }


/* ════════════════════════════════════════════════════════════
   ─── DEPOIMENTOS (HOME) ───
   Substitui o antigo bloco .dif (Diferenciais)
   4 cards no desktop, 1 coluna no mobile
   ════════════════════════════════════════════════════════════ */

.dep-section {
  background: var(--ice-2);
  padding: 80px 0;
  border-top: 1px solid var(--border-l);
  border-bottom: 1px solid var(--border-l);
}
.dep-section .sh {
  text-align: center;
  flex-direction: column;
  align-items: center;
  margin-bottom: 48px;
}
.dep-section .sh-eyebrow {
  margin-bottom: 8px;
}
.dep-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  margin-bottom: 36px;
}
.dep-item {
  background: var(--white);
  padding: 32px 28px;
  border: 1px solid var(--border-l);
  display: flex;
  flex-direction: column;
  position: relative;
}
.dep-item::before {
  content: '"';
  position: absolute;
  top: 8px;
  left: 18px;
  font-family: var(--serif);
  font-size: 60px;
  color: var(--gold);
  opacity: .25;
  line-height: 1;
}
.dep-item-stars {
  display: flex;
  gap: 2px;
  color: var(--gold);
  font-size: 14px;
  letter-spacing: 1px;
  margin-bottom: 16px;
  position: relative;
  z-index: 1;
}
.dep-item-text {
  font-family: var(--serif);
  font-size: 16px;
  font-weight: 300;
  font-style: italic;
  color: var(--dark);
  line-height: 1.6;
  margin-bottom: 20px;
  flex: 1;
  position: relative;
  z-index: 1;
}
.dep-item-author {
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--dark-mid);
  padding-top: 16px;
  border-top: 1px solid var(--border-l);
}
.dep-google-cta {
  text-align: center;
}
.dep-google-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 13px 28px;
  border: 1px solid var(--border);
  background: var(--white);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--dark-mid);
  transition: all .25s;
}
.dep-google-btn:hover {
  border-color: var(--dark);
  background: var(--dark);
  color: #fff;
}
.dep-google-btn svg { flex-shrink: 0 }

/* Tablet: 2 colunas */
@media (min-width: 768px) {
  .dep-grid { grid-template-columns: repeat(2, 1fr); gap: 20px }
}

/* Desktop: 4 colunas */
@media (min-width: 1024px) {
  .dep-grid { grid-template-columns: repeat(4, 1fr); gap: 20px }
  .dep-item-text { font-size: 15px }
}


/* ════════════════════════════════════════════════════════════
   ─── DROPDOWN 2 COLUNAS (Todos os Móveis) ───
   Para dropdowns com muitos itens — cabe melhor em telas menores
   ════════════════════════════════════════════════════════════ */

.nb-drop-2col {
  min-width: 440px;
  padding: 12px 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}
.nb-drop-2col a {
  padding: 8px 22px;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Tablet: mantém 2 colunas mas mais compacto */
@media (max-width: 1199px) {
  .nb-drop-2col {
    min-width: 380px;
  }
  .nb-drop-2col a {
    padding: 7px 18px;
    font-size: 12px;
  }
}
/* ============================================
   QUEM SOMOS - Versátile Móveis
   Adicionar ao style.css ou incluir separado
   ============================================ */

/* Breadcrumb */
.breadcrumb {
  background: #F5F2EE;
  padding: 16px 0;
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  color: #2C2C2A;
}

.breadcrumb a {
  color: #2C2C2A;
  text-decoration: none;
  opacity: 0.7;
  transition: opacity .2s;
}

.breadcrumb a:hover {
  opacity: 1;
  color: #C9A96E;
}

.breadcrumb .sep {
  margin: 0 8px;
  opacity: 0.4;
}

/* Hero da página */
.qs-hero {
  background: #F5F2EE;
  padding: 60px 0 40px;
  text-align: center;
  border-bottom: 1px solid rgba(201, 169, 110, 0.2);
}

.qs-hero h1 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(36px, 5vw, 56px);
  color: #2C2C2A;
  margin: 0 0 16px;
  letter-spacing: -0.5px;
}

.qs-subtitle {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: clamp(18px, 2.2vw, 22px);
  color: #C9A96E;
  margin: 0;
  font-weight: 400;
}

/* Conteúdo */
.qs-conteudo {
  padding: 64px 0;
  background: #fff;
}

.qs-texto {
  max-width: 720px;
  margin: 0 auto;
}

.qs-texto p {
  font-family: 'DM Sans', sans-serif;
  font-size: 17px;
  line-height: 1.75;
  color: #2C2C2A;
  margin: 0 0 24px;
}

.qs-texto h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: 32px;
  color: #2C2C2A;
  margin: 48px 0 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid #C9A96E;
}

.qs-cta-corporativo {
  margin-top: 32px;
}

.qs-cta-corporativo a {
  display: inline-block;
  font-family: 'DM Sans', sans-serif;
  font-size: 16px;
  color: #C9A96E;
  text-decoration: none;
  border-bottom: 1px solid #C9A96E;
  padding-bottom: 2px;
  transition: color .2s, border-color .2s;
}

.qs-cta-corporativo a:hover {
  color: #E8651A;
  border-color: #E8651A;
}

/* Bloco de informações */
.qs-info {
  background: #F5F2EE;
  padding: 56px 0;
  border-top: 1px solid rgba(201, 169, 110, 0.2);
}

.qs-info-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  max-width: 960px;
  margin: 0 auto;
}

.qs-info-bloco h3 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: 22px;
  color: #C9A96E;
  margin: 0 0 12px;
  letter-spacing: 0.5px;
}

.qs-info-bloco p {
  font-family: 'DM Sans', sans-serif;
  font-size: 15px;
  line-height: 1.7;
  color: #2C2C2A;
  margin: 0;
}

.qs-info-bloco a {
  color: #2C2C2A;
  text-decoration: none;
  border-bottom: 1px solid rgba(44, 44, 42, 0.3);
  transition: color .2s, border-color .2s;
}

.qs-info-bloco a:hover {
  color: #C9A96E;
  border-color: #C9A96E;
}

/* Mobile */
@media (max-width: 767px) {
  .qs-hero {
    padding: 40px 0 28px;
  }

  .qs-conteudo {
    padding: 40px 0;
  }

  .qs-texto p {
    font-size: 16px;
    line-height: 1.7;
  }

  .qs-texto h2 {
    font-size: 26px;
    margin: 36px 0 16px;
  }

  .qs-info {
    padding: 40px 0;
  }

  .qs-info-grid {
    grid-template-columns: 1fr;
    gap: 28px;
    text-align: center;
  }
}

/* --- Alias .container = .w (compat com Quem Somos e futuras pgs) --- */
.container { max-width: 1360px; margin: 0 auto; padding: 0 48px; }
@media (max-width: 768px) { .container { padding: 0 20px; } }