:root{
  --bg:#0b0b0c;
  --bg-alt:#151513;
  --panel:#1b1a17;
  --gold:#c9a463;
  --gold-light:#e4c98a;
  --text:#f3ede1;
  --text-muted:#a79d8c;
  --border:rgba(201,164,99,.25);
  --topbar-bg:#050505;
  --header-bg:rgba(11,11,12,.92);
  --drawer-bg:#0b0b0c;
  --search-panel-bg:rgba(21,21,19,.82);
  --input-bg:#0f0f0e;
  --card-photo-grad:linear-gradient(135deg,#232019,#141210);
  --feature-bg:rgba(255,255,255,.03);
  --feature-bg-hover:rgba(255,255,255,.05);
  --footer-bg:#050505;
  --overlay-strong:rgba(0,0,0,.65);
  --shadow:rgba(0,0,0,.5);
  --shadow-soft:rgba(0,0,0,.4);
  --transition-theme:background-color .3s ease, color .3s ease, border-color .3s ease;
}
body.light-mode{
  --bg:#FAFAFA;
  --bg-alt:#FFFFFF;
  --panel:#FFFFFF;
  --text:#18181B;
  --text-muted:#5c5c62;
  --border:rgba(24,24,27,.14);
  --topbar-bg:#FFFFFF;
  --header-bg:rgba(255,255,255,.94);
  --drawer-bg:#FFFFFF;
  --search-panel-bg:rgba(255,255,255,.92);
  --input-bg:#FFFFFF;
  --card-photo-grad:linear-gradient(135deg,#f1efe9,#e6e2d8);
  --feature-bg:rgba(24,24,27,.03);
  --feature-bg-hover:rgba(24,24,27,.05);
  --footer-bg:#F2F1ED;
  --overlay-strong:rgba(0,0,0,.45);
  --shadow:rgba(24,24,27,.14);
  --shadow-soft:rgba(24,24,27,.1);
}
*{margin:0;padding:0;box-sizing:border-box;}
body{
  font-family:'Poppins',sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.6;
  transition:var(--transition-theme);
}
h1,h2,h3,.serif{font-family:'Cormorant Garamond',serif;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}
.container{max-width:1200px;margin:0 auto;padding:0 24px;}
ul{list-style:none;}

/* Top bar */
.topbar{
  background:var(--topbar-bg);
  transition:var(--transition-theme);
  border-bottom:1px solid var(--border);
  font-size:.8rem;
  color:var(--text-muted);
}
.topbar .container{display:flex;justify-content:space-between;align-items:center;height:42px;flex-wrap:wrap;}
.topbar .left{display:flex;gap:24px;}
.topbar .left span{display:flex;align-items:center;gap:6px;}
.topbar .right{display:flex;gap:20px;align-items:center;}
.topbar .right a:hover{color:var(--gold-light);}

/* Botão de alternância de tema (sol / lua) */
.theme-toggle{
  display:flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:50%;
  background:transparent;border:1px solid var(--border);
  color:var(--gold-light);cursor:pointer;font-size:.85rem;line-height:1;padding:0;
  transition:var(--transition-theme), transform .2s ease, border-color .2s ease;
}
.theme-toggle:hover{border-color:var(--gold);transform:rotate(20deg) scale(1.06);}
.theme-toggle .theme-icon{pointer-events:none;}

/* Header / nav */
header.main{
  background:var(--header-bg);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:50;
  transition:var(--transition-theme);
}
header.main .container{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  height:88px;
  column-gap:16px;
}
.logo{font-family:'Cormorant Garamond',serif;font-size:1.9rem;letter-spacing:2px;font-weight:600;color:var(--text);}
.logo span{color:var(--gold);}
.logo small{display:block;font-family:'Poppins',sans-serif;font-size:.6rem;letter-spacing:3px;color:var(--text-muted);font-weight:400;}
.logo-img{grid-column:2;justify-self:center;height:50px;width:auto;}
nav.primary{grid-column:3;justify-self:end;min-width:0;}
.menu-toggle{grid-column:1;justify-self:start;}
nav.primary ul{display:flex;gap:clamp(16px,2.2vw,38px);flex-wrap:nowrap;white-space:nowrap;}
nav.primary a{font-size:.85rem;letter-spacing:1px;text-transform:uppercase;color:var(--text-muted);transition:color .2s;white-space:nowrap;}
nav.primary a:hover, nav.primary a.active{color:var(--gold-light);}
.menu-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:6px;}
.menu-toggle span{width:26px;height:2px;background:var(--gold);}


/* Drawer de menu mobile — abre da esquerda para a direita */
.drawer-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:150;
  opacity:0;pointer-events:none;transition:opacity .3s ease;
}
.drawer-overlay.open{opacity:1;pointer-events:auto;}
.mobile-drawer{
  position:fixed;top:0;left:0;bottom:0;width:82%;max-width:340px;
  background:var(--drawer-bg);border-right:1px solid var(--border);
  z-index:200;
  transform:translateX(-100%);
  transition:transform .35s ease, var(--transition-theme);
  padding:70px 32px 40px;
  overflow-y:auto;
}
.mobile-drawer.open{transform:translateX(0);}
.drawer-close{
  position:absolute;top:22px;left:24px;background:none;border:none;color:var(--gold-light);
  font-size:1.8rem;line-height:1;cursor:pointer;padding:4px;
}
.drawer-nav{display:flex;flex-direction:column;gap:28px;}
.drawer-nav a{font-family:'Cormorant Garamond',serif;font-size:1.9rem;font-weight:500;color:var(--text);}
.drawer-nav a:hover, .drawer-nav a.active{color:var(--gold-light);}

/* Hero — conteúdo centralizado e distribuído harmonicamente sobre a imagem */
.hero{
  position:relative;
  min-height:calc(100vh - 80px);
  display:flex;
  align-items:center;
  /* Overlay bem mais leve (teto de .4 de opacidade) — a foto de fundo fica
     em destaque, com só o contraste necessário para o texto continuar
     legível. */
  background:linear-gradient(180deg, rgba(6,6,6,.22) 0%, rgba(6,6,6,.12) 35%, rgba(6,6,6,.4) 100%), url('hero-living-room.jpg') center/cover no-repeat;
}
.hero .container{
  width:100%;padding-top:40px;padding-bottom:60px;
  display:flex;flex-direction:column;align-items:center;text-align:center;
}

/* Marca "MCJ Capital Invest" em Bodoni Moda, sobre a imagem do hero — entra
   com uma animação de desfoque (blur) que foca suavemente ao carregar a
   página, como uma assinatura editorial de alta costura. */
.mcj-wordmark{
  position:absolute;top:40px;left:0;right:0;
  width:100%;text-align:center;
  font-family:'Bodoni Moda', serif;
  font-weight:400;font-style:normal;
  font-size:clamp(3.2rem, 9vw, 8.5rem);
  letter-spacing:-2px;line-height:.95;
  color:#fff;
  text-shadow:0 4px 30px rgba(0,0,0,.5);
  white-space:nowrap;
  filter:blur(16px);opacity:0;
  animation:mcjBlurIn 1.9s cubic-bezier(.2,.7,.3,1) forwards;
  animation-delay:.15s;
}
@keyframes mcjBlurIn{
  0%{filter:blur(20px);opacity:0;transform:scale(1.05);}
  100%{filter:blur(0);opacity:1;transform:scale(1);}
}
.hero-intro{display:flex;flex-direction:column;align-items:center;}
.hero-eyebrow{color:var(--gold-light);letter-spacing:4px;font-size:.75rem;text-transform:uppercase;margin-bottom:18px;display:block;}
.hero h1{font-size:clamp(1.9rem, 2.85vw, 3.4rem);font-weight:600;max-width:720px;color:var(--text);margin-bottom:16px;margin-left:auto;margin-right:auto;text-shadow:0 2px 16px rgba(0,0,0,.4);}
.hero h1 em{font-style:italic;color:var(--gold);}
.hero p.lead{max-width:520px;color:var(--text-muted);font-size:clamp(.95rem, 1.15vw, 1.05rem);margin-bottom:40px;margin-left:auto;margin-right:auto;text-shadow:0 2px 12px rgba(0,0,0,.5);}

/* Bloco do filtro de busca — seção própria, puxada para cima no desktop para
   sobrepor a base da imagem do hero (efeito harmonioso já ajustado), mas
   sem carregar a imagem de fundo: o painel permanece opaco/translúcido. */
.search-section{position:relative;margin-top:-50px;z-index:5;padding-bottom:70px;}
/* Versão da caixa de busca que fica sobreposta à foto da Hero: mais
   compacta, mais baixa (menos "puxada para cima" que antes) e com um fundo
   translúcido mais leve — discreta, sem parecer um bloco pesado sobre a
   imagem. As páginas de listagem (comprar.html/alugar.html), que usam
   .search-panel sem estar dentro de .search-section, não são afetadas. */
.search-section .search-panel{
  width:100%;
  padding:16px 24px;
  background:rgba(18,18,18,.85);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.search-section .field select, .search-section .field input{height:38px;font-size:.78rem;}
.search-section .field label{font-size:.62rem;margin-bottom:6px;}
.search-section .btn-gold, .search-section .btn-whatsapp{padding:10px 22px;font-size:.75rem;}

/* Page header (property / inner pages) */
.page-header{
  padding:160px 0 40px;
  background:linear-gradient(180deg, rgba(6,6,6,.7), rgba(11,11,12,1)), url('hero-living-room.jpg') center 30% / cover no-repeat;
}
.breadcrumb{font-size:.75rem;letter-spacing:1px;text-transform:uppercase;color:var(--gold-light);margin-bottom:10px;}
.breadcrumb a{color:var(--text-muted);}
.breadcrumb a:hover{color:var(--gold-light);}

/* Search panel */
.search-panel{
  max-width:1100px;margin:0 auto;
  background:var(--search-panel-bg);
  border:1px solid var(--border);
  border-radius:6px;
  padding:clamp(18px, 2.2vw, 28px);
  backdrop-filter:blur(8px);
  box-shadow:0 20px 60px var(--shadow);
  transition:var(--transition-theme);
}
.search-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:clamp(12px, 1.6vw, 20px) clamp(14px, 2vw, 24px);
  margin-bottom:22px;
}
.field label{display:block;font-size:clamp(.62rem, .8vw, .7rem);letter-spacing:1.5px;text-transform:uppercase;color:var(--gold-light);margin-bottom:8px;}
.search-panel .field label{text-align:center;}
.field select, .field input, .field textarea{
  width:100%;height:42px;background:var(--input-bg);border:1px solid var(--border);color:var(--text);
  padding:0 12px;border-radius:4px;font-family:'Poppins',sans-serif;font-size:clamp(.78rem, 1vw, .85rem);
  transition:var(--transition-theme);
}
.field select:focus, .field input:focus, .field textarea:focus{outline:none;border-color:var(--gold);}
.field textarea{resize:vertical;min-height:90px;}
.price-range{grid-column:span 2;}
.price-values{display:flex;justify-content:space-between;font-size:.75rem;color:var(--text-muted);margin-top:8px;}
.search-footer{display:flex;justify-content:flex-end;}
.btn-gold{
  background:linear-gradient(135deg,var(--gold-light),var(--gold));
  color:#141210;border:none;padding:13px 34px;border-radius:4px;
  font-weight:600;letter-spacing:1px;font-size:.8rem;text-transform:uppercase;cursor:pointer;
  transition:transform .2s, box-shadow .2s;
  width:100%;
}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(201,164,99,.35);}
.btn-outline{
  background:transparent;border:1px solid var(--gold);color:var(--gold-light);
  padding:12px 30px;border-radius:4px;font-size:.8rem;letter-spacing:1px;text-transform:uppercase;cursor:pointer;
}
.btn-whatsapp{
  display:flex;align-items:center;justify-content:center;gap:10px;
  background:#25D366;color:#0b0b0c;border:none;padding:13px 20px;border-radius:4px;
  font-weight:600;letter-spacing:.5px;font-size:.82rem;text-transform:uppercase;cursor:pointer;width:100%;
  transition:filter .2s;
}
.btn-whatsapp:hover{filter:brightness(1.08);}

/* Section titles */
.section{padding:clamp(50px, 7vw, 100px) 0;}
.section.tight{padding:clamp(36px, 4.5vw, 60px) 0;}
.section-title{text-align:center;margin-bottom:12px;font-size:clamp(1.7rem, 2.6vw, 2.4rem);font-weight:600;}
.section-title.left{text-align:left;}
.section-sub{text-align:center;color:var(--text-muted);max-width:560px;margin:0 auto 50px;font-size:clamp(.85rem, 1.1vw, .95rem);}
.gold-rule{width:60px;height:1px;background:var(--gold);margin:0 auto 24px;}
.gold-rule.left{margin:0 0 20px;}

/* Tabs */
.tabs{display:flex;justify-content:center;gap:14px;margin-bottom:50px;}
.tab-btn{
  background:transparent;border:1px solid var(--border);color:var(--text-muted);
  padding:10px 28px;border-radius:30px;font-size:.8rem;letter-spacing:1px;text-transform:uppercase;cursor:pointer;
  transition:all .2s;
}
.tab-btn.active{background:var(--gold);border-color:var(--gold);color:#141210;font-weight:600;}

/* Property grid */
.property-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px, 2vw, 28px);}
.property-grid .property-card{max-width:420px;width:100%;margin:0 auto;}
.property-card{
  background:var(--panel);border:1px solid rgba(212,175,55,.2);border-radius:12px;overflow:hidden;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease, background-color .3s ease;
}
.property-card:hover{
  transform:translateY(-6px);
  border-color:rgba(212,175,55,.5);
  box-shadow:0 20px 45px rgba(0,0,0,.5), 0 0 26px rgba(212,175,55,.1);
}
.property-card > a{display:block;color:inherit;}
.property-photo{
  position:relative;height:clamp(200px, 16vw, 240px);overflow:hidden;
  background:var(--card-photo-grad);
  display:flex;align-items:center;justify-content:center;
  color:var(--text-muted);font-size:.75rem;letter-spacing:1px;text-transform:uppercase;
  transition:var(--transition-theme);
}
.property-photo svg{width:34px;height:34px;opacity:.35;margin-bottom:8px;}
.property-photo .ph-wrap{text-align:center;}
.property-photo img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  display:block;
}
.badge-row{position:absolute;top:14px;left:14px;z-index:3;display:flex;gap:6px;flex-wrap:wrap;}
.badge{
  background:linear-gradient(135deg,#f0d9a8,#c9a463);color:#141210;
  font-size:.65rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  padding:6px 14px;border-radius:20px;
  box-shadow:0 6px 16px rgba(0,0,0,.35);
}
.badge.op{
  position:absolute;top:14px;right:14px;z-index:3;
  background:rgba(8,8,8,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  color:#E6C687;border:1px solid rgba(212,175,55,.4);
}
.property-body{padding:clamp(16px, 1.8vw, 22px);}
.property-body h3{font-size:clamp(1.05rem, 1.3vw, 1.25rem);font-weight:600;margin-bottom:4px;}
.property-body .loc{font-size:.78rem;color:var(--gold-light);margin-bottom:14px;letter-spacing:.5px;}
.property-meta{
  display:flex;gap:14px;font-size:.78rem;color:var(--text-muted);
  margin-bottom:16px;flex-wrap:wrap;
  padding-top:12px;border-top:1px solid rgba(255,255,255,.07);
}
.property-price{
  font-size:clamp(1.05rem, 1.3vw, 1.2rem);font-weight:700;color:#E6C687;font-family:'Cormorant Garamond',serif;
  letter-spacing:.3px;margin-top:6px;display:block;
}
.property-price .price-suffix{font-size:.75rem;font-weight:400;color:var(--text-muted);margin-left:3px;}
.property-price-rent{font-size:.82rem;color:var(--text-muted);margin-top:2px;}
.hidden{display:none !important;}

.center-btn{text-align:center;margin-top:50px;}

/* Feature cards — glassmorphism sutil, elevação e brilho no hover */
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px, 2vw, 24px);}
.feature-card{
  background:var(--feature-bg);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(212,175,55,.16);padding:clamp(28px, 3.4vw, 44px) clamp(20px, 2.5vw, 32px);border-radius:14px;text-align:center;
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease, background .35s ease;
}
.feature-card:hover{
  transform:translateY(-8px);
  border-color:rgba(212,175,55,.45);
  background:var(--feature-bg-hover);
  box-shadow:0 24px 48px var(--shadow-soft), 0 0 30px rgba(212,175,55,.08);
}
.feature-card.accent{background:linear-gradient(160deg, rgba(201,164,99,.14), rgba(255,255,255,.03));border-color:rgba(212,175,55,.3);}
.feature-icon{
  width:56px;height:56px;margin:0 auto 22px;color:#E6C687;
  filter:drop-shadow(0 0 10px rgba(230,198,135,.3));
  transition:filter .35s ease, transform .35s ease;
}
.feature-card:hover .feature-icon{filter:drop-shadow(0 0 18px rgba(230,198,135,.55));transform:translateY(-3px) scale(1.06);}
.feature-card h3{font-size:clamp(1.15rem, 1.6vw, 1.4rem);margin-bottom:12px;font-weight:600;}
.feature-card p{color:var(--text-muted);font-size:clamp(.85rem, 1vw, .9rem);}

/* Carousels — setas de navegação flutuantes, sobrepostas nas laterais do carrossel
   (usado nos 3 carrosséis coverflow: Conheça Nossos Imóveis, Imóveis em Destaque
   e Imóveis Similares). */
.destaques-wrap{position:relative;}
.carousel-track{display:flex;gap:28px;overflow-x:auto;scroll-behavior:smooth;padding-bottom:8px;scrollbar-width:none;}
.carousel-track::-webkit-scrollbar{display:none;}
.carousel-track .property-card{min-width:340px;}
.carousel-nav{
  position:absolute;top:50%;left:0;right:0;
  transform:translateY(-50%);
  display:flex;justify-content:space-between;
  padding:0 6px;
  pointer-events:none;
  z-index:10;
}
.car-btn{
  pointer-events:auto;
  width:48px;height:48px;border-radius:50%;
  border:1px solid rgba(212,175,55,.4);
  background:rgba(10,9,8,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  color:#E6C687;cursor:pointer;font-size:1.15rem;
  display:flex;align-items:center;justify-content:center;
  transition:transform .25s ease, background .25s ease, color .25s ease, box-shadow .25s ease;
  box-shadow:0 10px 26px rgba(0,0,0,.4);
}
.car-btn:hover{background:#E6C687;color:#141210;border-color:#E6C687;transform:scale(1.08);}

/* Carrossel "Imóveis em Destaque" da home — grade com slidesPerView fixo por
   breakpoint (sem centeredSlides), pra evitar o loop travar com poucos itens. */
.destaques-swiper{width:100%;padding:20px 0 50px;}
.destaques-swiper .swiper-wrapper{max-width:none;}
.destaques-swiper .swiper-slide{
  height:auto;
  box-sizing:border-box;
  opacity:1;
  filter:none;
}
.destaques-swiper .property-card{height:100%;}

/* Carrossel "Conheça Nossos Imóveis" — mesmo tratamento 3D/coverflow: 1 card em
   destaque no centro, prévia recuada/translúcida dos vizinhos, autoplay contínuo
   com pausa ao passar o mouse (configurado via Swiper no JS). */
.imoveis-swiper{width:100%;padding:20px 0 50px;}
.imoveis-swiper .swiper-slide{
  width:min(78vw, 360px);
  max-width:360px;
  opacity:.4;
  filter:blur(1px) saturate(.75);
  transition:opacity .4s ease, filter .4s ease;
}
.imoveis-swiper .swiper-slide-active{opacity:1;filter:none;}
.imoveis-swiper .property-card{height:100%;}

/* Carrossel "Imóveis Similares" da página de detalhe do imóvel — grade com
   slidesPerView fixo por breakpoint (sem centeredSlides), mesmo tratamento
   do carrossel de Destaques. */
.similares-swiper{width:100%;padding:20px 0 50px;}
.similares-swiper .swiper-wrapper{max-width:none;}
.similares-swiper .swiper-slide{
  height:auto;
  box-sizing:border-box;
  opacity:1;
  filter:none;
}
.similares-swiper .property-card{height:100%;}

/* Showcase bands — "Espaços refinados" / "Qualidade Superior": banners de
   imagem cheia com overlay escuro à esquerda, título serifado e um botão
   pill, um de cada lado da faixa de citação (.quote-band). */
.showcase-band{
  position:relative;
  min-height:520px;
  display:flex;
  align-items:flex-start;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  overflow:hidden;
}
.showcase-band::before{
  content:'';
  position:absolute;inset:0;
  background:linear-gradient(100deg, rgba(6,6,6,.78) 0%, rgba(6,6,6,.4) 42%, rgba(6,6,6,.05) 72%);
  z-index:1;
}
.showcase-band .container{position:relative;z-index:2;width:100%;padding-top:64px;}
.showcase-content{max-width:420px;}
.showcase-content h2{
  font-family:'Cormorant Garamond',serif;font-weight:500;
  font-size:clamp(2rem, 4vw, 3.6rem);line-height:1.05;
  color:#fff;margin-bottom:14px;
}
.showcase-content p{
  color:rgba(255,255,255,.85);font-size:clamp(.85rem, 1.1vw, .95rem);
  line-height:1.65;max-width:340px;margin-bottom:26px;
}
.showcase-espacos{background-image:url('showcase-espacos-refinados.jpg');}
.showcase-qualidade{background-image:url('showcase-qualidade-superior.jpg');}
.btn-pill{
  display:inline-block;
  background:#f3ede1;color:#141210;
  padding:13px 30px;border-radius:30px;
  font-size:.8rem;font-weight:600;letter-spacing:.3px;
  transition:transform .2s ease, box-shadow .2s ease;
}
.btn-pill:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.35);}

@media (max-width:1400px){
  .showcase-band{min-height:420px;}
  .showcase-band .container{padding-top:44px;}
}
@media (max-width:768px){
  .showcase-band{min-height:340px;}
  .showcase-band .container{padding-top:32px;}
  .showcase-content h2{font-size:1.9rem;}
  .showcase-content p{font-size:.85rem;margin-bottom:18px;}
  .btn-pill{padding:11px 24px;font-size:.75rem;}
}

/* Sofisticação band */
.quote-band{
  padding:clamp(60px, 9vw, 120px) 0;text-align:center;
  background:linear-gradient(180deg, rgba(11,11,12,.75), rgba(11,11,12,.95)), url('hero-living-room.jpg') center 20% / cover no-repeat;
}
.quote-band p{font-family:'Cormorant Garamond',serif;font-size:clamp(1.4rem, 2.6vw, 2.1rem);font-weight:500;max-width:780px;margin:0 auto 26px;}
.quote-band a{color:var(--gold-light);border-bottom:1px solid var(--gold);padding-bottom:4px;font-size:.85rem;letter-spacing:1px;text-transform:uppercase;}

/* Property gallery — versão estável (sem bibliotecas pesadas): foto principal
   + fileira de miniaturas + lightbox em tela cheia. Evita o crash que o
   Swiper/coverflow causava em navegadores mobile. */
.pgallery{margin-bottom:48px;}
.pgallery-main{
  position:relative;
  width:100%;
  aspect-ratio:4/3;
  /* Trava a altura a no máximo 52% da altura da tela (e nunca mais que
     450px) para que foto principal + miniaturas caibam inteiras na
     primeira dobra, sem precisar rolar — inclusive em notebooks 1366x768. */
  max-height:min(52vh, 450px) !important;
  border-radius:8px;overflow:hidden;
  border:none;outline:none;box-shadow:none;
  background:var(--bg);
  cursor:zoom-in;
}
/* object-fit:contain — a foto principal aparece inteira, respeitando a
   proporção original de cada imagem enviada (sem cortar o topo/base de
   fachadas, por exemplo). Em fotos verticais, a sobra nas laterais fica
   100% transparente — mesmo fundo da página, sem nenhuma "caixa" visível
   em volta (sem borda, sem contorno, sem fundo cinza). */
.pgallery-main img{width:100%;height:100%;object-fit:contain !important;display:block;background:transparent;border:none;outline:none;box-shadow:none;}

/* Setas de navegação — sobrepostas nas laterais da FOTO PRINCIPAL (não mais
   na fileira de miniaturas), estilo discreto com fundo semi-transparente e
   ícone dourado, igual à linguagem visual dos carrosséis do site. */
.pgallery-main-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  z-index:5;
  width:44px;height:44px;border-radius:50%;
  border:1px solid rgba(212,175,55,.4);
  background:rgba(10,9,8,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  color:#E6C687;cursor:pointer;font-size:1.1rem;
  display:flex;align-items:center;justify-content:center;
  transition:transform .2s ease, background .2s ease, color .2s ease, opacity .2s ease;
}
.pgallery-main-nav.prev{left:14px;}
.pgallery-main-nav.next{right:14px;}
.pgallery-main-nav:hover{background:#E6C687;color:#141210;border-color:#E6C687;transform:translateY(-50%) scale(1.08);}

.pgallery-thumbs{
  display:flex;gap:10px;margin-top:14px;
  overflow-x:auto;scroll-behavior:smooth;padding-bottom:4px;scrollbar-width:none;
}
.pgallery-thumbs::-webkit-scrollbar{display:none;}
.pgallery-thumbs img{
  width:88px;height:88px;flex:0 0 auto;object-fit:cover;
  border-radius:6px;cursor:pointer;opacity:.55;
  border:2px solid transparent;transition:opacity .2s, border-color .2s;
}
.pgallery-thumbs img.active{opacity:1;border-color:var(--gold);}
.pgallery-thumbs img:hover{opacity:1;}

/* Lightbox / zoom em tela cheia */
.lightbox{
  position:fixed;inset:0;background:#000;z-index:300;
  display:none;flex-direction:column;
}
.lightbox.open{display:flex;}
.lightbox-close{
  position:absolute;top:18px;right:18px;z-index:2;
  background:none;border:none;color:#fff;font-size:2.4rem;line-height:1;
  cursor:pointer;padding:8px;
}
.lightbox-main{
  flex:1;display:flex;align-items:center;justify-content:center;
  overflow:hidden;padding:16px;
}
.lightbox-main img{max-width:100%;max-height:100%;object-fit:contain;}
.lightbox-thumbs{
  display:flex;gap:10px;padding:14px 16px;background:#0b0b0c;
  overflow-x:auto;scrollbar-width:none;
}
.lightbox-thumbs::-webkit-scrollbar{display:none;}
.lightbox-thumbs img{
  width:64px;height:64px;flex:0 0 auto;object-fit:cover;border-radius:4px;
  cursor:pointer;opacity:.5;border:2px solid transparent;transition:.2s;
}
.lightbox-thumbs img.active{opacity:1;border-color:var(--gold);}

@media (max-width:800px){
  /* No mobile a foto principal é retrato (3:4) e a tela já é naturalmente
     mais alta que larga — a trava de 52vh/450px é coisa de desktop/notebook
     (onde o problema de "primeira dobra" acontece); aqui volta ao limite
     generoso de antes para não cortar a foto por engano. */
  .pgallery-main{aspect-ratio:3/4;max-height:640px !important;}
  .pgallery-thumbs img{width:72px;height:72px;}
}

/* Property detail layout */
.detail-grid{display:grid;grid-template-columns:2fr 1fr;gap:48px;align-items:start;}
.detail-code{color:var(--gold-light);font-size:.78rem;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:8px;}
.detail-purpose{color:var(--text-muted);font-size:.85rem;margin-bottom:6px;}
.detail-title{font-size:clamp(1.6rem, 2.6vw, 2.2rem);font-weight:600;margin-bottom:6px;}
.detail-location{color:var(--text-muted);font-size:.95rem;margin-bottom:24px;}
.detail-meta{display:flex;gap:28px;flex-wrap:wrap;margin-bottom:32px;padding-bottom:28px;border-bottom:1px solid var(--border);}
.detail-meta .item{display:flex;align-items:center;gap:8px;font-size:.88rem;color:var(--text-muted);}
.detail-meta svg{width:20px;height:20px;color:var(--gold);}
.detail-section-title{font-size:.78rem;letter-spacing:2px;text-transform:uppercase;color:var(--gold-light);margin-bottom:16px;margin-top:40px;}
.detail-section-title:first-of-type{margin-top:0;}
.detail-description{margin-bottom:36px;}

/* Tipografia da descrição rica do imóvel — compartilhada entre o editor
   do admin.html e a exibição pública em imovel.html, para ficar
   "o que você vê é o que vai aparecer no site". */
.descricao-imovel{
  color:var(--text-muted);
  font-size:.98rem;
  line-height:1.8;
  max-width:70ch;
}
.descricao-imovel p{
  margin-bottom:20px;
}
.descricao-imovel p:last-child{margin-bottom:0;}
.descricao-imovel h2, .descricao-imovel h3, .descricao-imovel h4{
  font-family:'Cormorant Garamond',serif;
  color:var(--gold-light);
  font-weight:600;
  line-height:1.3;
  margin-top:36px;
  margin-bottom:14px;
}
.descricao-imovel h2:first-child, .descricao-imovel h3:first-child{margin-top:0;}
.descricao-imovel h2{font-size:1.9rem;}
.descricao-imovel h3{font-size:1.5rem;}
.descricao-imovel h4{font-size:1.15rem;color:var(--text);}
.descricao-imovel strong, .descricao-imovel b{color:var(--text);font-weight:600;}
.descricao-imovel em{font-style:italic;}
.descricao-imovel ul, .descricao-imovel ol{
  margin:0 0 24px;
  padding-left:22px;
}
.descricao-imovel ul{list-style:disc;}
.descricao-imovel ol{list-style:decimal;}
.descricao-imovel li{
  margin-bottom:10px;
  padding-left:4px;
}
.descricao-imovel li::marker{color:var(--gold);}
.descricao-imovel hr{
  border:none;
  border-top:1px solid rgba(255,255,255,.15);
  margin:32px 0;
}
/* Divisória elegante gerada a partir do "---" no Markdown da IA — linha curta
   e dourada, centralizada, com respiro generoso entre as seções. */
.descricao-imovel hr.divider{
  border-top:1px solid rgba(201,164,99,.4);
  width:70px;
  margin:40px auto;
}
.descricao-imovel a{color:var(--gold-light);text-decoration:underline;text-underline-offset:3px;}
.price-block{display:flex;gap:60px;margin-bottom:44px;flex-wrap:wrap;}
.price-block .item h4{font-size:.78rem;letter-spacing:1px;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px;font-weight:400;}
.price-block .item .value{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:600;color:var(--gold-light);}

/* Video */
.video-box{
  aspect-ratio:16/9;border-radius:6px;overflow:hidden;border:1px solid var(--border);
  background:var(--card-photo-grad);
  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;
  color:var(--text-muted);font-size:.85rem;margin-bottom:44px;
}
.video-box iframe{width:100%;height:100%;border:0;}
.play-circle{width:64px;height:64px;border-radius:50%;border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;}
.play-circle svg{width:22px;height:22px;color:var(--gold);}

/* Map */
.map-box{
  border-radius:6px;overflow:hidden;border:1px solid var(--border);margin-bottom:20px;
}
.map-box iframe{width:100%;height:360px;border:0;filter:grayscale(.15) contrast(1.05);}

/* Contact card */
.contact-card{
  background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:28px;
  position:sticky;top:110px;
  transition:var(--transition-theme);
}
.contact-card h4{font-size:.78rem;letter-spacing:2px;text-transform:uppercase;color:var(--gold-light);margin-bottom:4px;text-align:center;}
.contact-card .sub{text-align:center;color:var(--text-muted);font-size:.75rem;margin-bottom:22px;}
.form-group{margin-bottom:16px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.contact-card .btn-gold{margin-bottom:12px;}

/* Footer — mais enxuto, colunas alinhadas, com ícones de redes sociais */
footer{background:var(--footer-bg);border-top:1px solid var(--border);padding:clamp(32px, 5vw, 56px) 0 24px;transition:var(--transition-theme);}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:clamp(20px, 3vw, 36px);margin-bottom:36px;}
.footer-grid h4{font-size:.78rem;letter-spacing:2px;text-transform:uppercase;color:var(--gold-light);margin-bottom:18px;}
.footer-grid ul li{margin-bottom:11px;}
.footer-grid ul a{color:var(--text-muted);font-size:.86rem;transition:color .2s;}
.footer-grid ul a:hover{color:var(--gold-light);}
.footer-about .logo{margin-bottom:14px;}
.footer-logo-slot{
  height:56px;margin-bottom:16px;display:flex;align-items:center;justify-content:center;width:100%;
}
.footer-logo-slot img{max-height:100%;width:auto;}
.footer-about p{color:var(--text-muted);font-size:.86rem;max-width:280px;margin-bottom:18px;}
.newsletter{display:flex;border:1px solid var(--border);border-radius:4px;overflow:hidden;max-width:280px;}
.newsletter input{flex:1;background:transparent;border:none;padding:11px 14px;color:var(--text);font-size:.82rem;}
.newsletter input:focus{outline:none;}
.newsletter button{background:var(--gold);border:none;color:#141210;padding:0 18px;cursor:pointer;font-weight:700;}
.footer-social{display:flex;gap:10px;margin-top:16px;}
.footer-social a{
  width:36px;height:36px;border-radius:50%;
  border:1px solid rgba(212,175,55,.3);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold-light);transition:.25s;
}
.footer-social a:hover{background:var(--gold);color:#141210;border-color:var(--gold);transform:translateY(-3px);}
.footer-bottom{
  border-top:1px solid var(--border);padding-top:22px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
  font-size:.78rem;color:var(--text-muted);
}
.footer-bottom a{color:var(--text-muted);}
.footer-bottom a:hover{color:var(--gold-light);}

.whatsapp-float{
  position:fixed;bottom:26px;right:26px;z-index:60;
  width:56px;height:56px;border-radius:50%;
  background:#25D366;display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 24px rgba(0,0,0,.4);
  transition:transform .2s;
}
.whatsapp-float:hover{transform:scale(1.08);}

/* Notebooks HD (ex: 1366x768, 1440x900) — breakpoint dedicado a laptops
   menores. Mesmo com clamp() em quase tudo, aqui reduzimos ainda mais os
   tetos e os paddings internos das seções para que, proporcionalmente ao
   tamanho da tela, os blocos (hero, busca, cards, footer) fiquem tão
   compactos e elegantes quanto ficam em Full HD — em vez de simplesmente
   "encolher para caber" mantendo espaçamentos de tela grande. Fica
   posicionado depois de todas as regras-base (mesma especificidade — quem
   vem depois no arquivo vence) e antes dos breakpoints de mobile abaixo,
   que continuam podendo refinar ainda mais para telas pequenas. */
/* Redução de escala base — a correção definitiva para notebooks HD (1366x768)
   combinados com o Zoom de Escala do Windows (normalmente 125%), que faz a
   área útil real da página ficar ainda menor do que os 768px de altura
   sugerem. Encolher o font-size do <html> encolhe junto, de forma
   proporcional, TODOS os valores em rem do site (tipografia, paddings,
   gaps) — inclusive dentro dos clamp() acima, que passam a partir de um
   teto 15% menor. */
@media (min-width:992px) and (max-width:1400px), (min-width:992px) and (max-height:800px){
  html{font-size:80% !important;}
}

@media (max-width:1400px){
  /* Container mais estreito nessa faixa — mesmo em 1366/1440px de largura de
     tela, o conteúdo fica recuado das bordas com margens laterais generosas,
     igual ao visual compacto e centralizado que já existe em Full HD (onde
     o container de 1200px "sobra" bastante espaço nas laterais). Vale para
     todas as seções e para o footer, que reaproveitam a mesma .container. */
  .container{max-width:960px !important;margin:0 auto !important;}

  .hero{padding:40px 20px;}
  .hero .container{padding-top:24px;padding-bottom:44px;}
  .mcj-wordmark{font-size:clamp(2.6rem, 7.5vw, 5.6rem);top:32px;}
  .hero h1{font-size:clamp(1.6rem, 3vw, 2.4rem);margin-bottom:14px;}
  .hero p.lead{font-size:clamp(.88rem, 1.5vw, 1rem);margin-bottom:32px;}

  /* Seções em geral — respiro vertical reduzido */
  .section{padding:clamp(40px, 6vw, 64px) 0;}
  .section.tight{padding:clamp(30px, 4vw, 44px) 0;}
  .page-header{padding:130px 0 32px;}

  /* Caixa de busca — módulo compacto, não ocupando a tela toda */
  .search-panel{padding:18px;max-width:960px;}
  .search-grid{gap:12px 16px;margin-bottom:16px;}
  .field select, .field input{height:40px;font-size:.8rem;}
  .field label{font-size:.64rem;margin-bottom:6px;}
  .btn-gold, .btn-whatsapp{padding:11px 24px;}
  .search-section{margin-top:-30px;padding-bottom:50px;}

  /* Cards de imóveis — mais enxutos, sem a foto sozinha ocupando a tela */
  .property-photo{height:190px !important;}
  .property-photo img{object-fit:cover;}
  .property-body{padding:16px;}
  .feature-card{padding:26px 20px;}

  /* Footer drasticamente mais compacto — replica a proporção fina e
     centralizada que já aparece naturalmente em telas Full HD. */
  footer{padding:25px 0 15px 0 !important;}
  .footer-grid{gap:20px !important;margin-bottom:16px;}
  .footer-grid h4{font-size:.8rem !important;margin-bottom:10px;}
  .footer-grid ul a{font-size:.75rem !important;}
  .footer-grid ul li{font-size:.75rem;line-height:1.25 !important;margin-bottom:4px !important;}
  .footer-about p{font-size:.75rem;line-height:1.25;margin-bottom:10px;}
  .topbar .left span{line-height:1.3;}
  .footer-logo-slot{height:auto;margin-bottom:8px;}
  .footer-logo-slot img{max-width:100px;max-height:none;width:100%;height:auto;}
  .newsletter{max-width:220px;}
  .newsletter input{height:32px;padding:0 10px;font-size:.75rem;}
  .newsletter button{padding:0 12px;font-size:.75rem;}
  .footer-social{margin-top:10px;}
  .footer-social a{width:30px;height:30px;}
  .footer-bottom{padding-top:14px;font-size:.72rem;}

  /* Detalhe do imóvel */
  .detail-grid{gap:32px;}
  .contact-card{padding:20px;}
}

/* Telas com pouca altura (notebooks 1366x768 e similares, sobretudo com
   Zoom do Windows ativo) — mesmo em largura maior, a altura curta faz a
   Hero e a caixa de busca comprimirem o resto da página. Comprime pelo
   eixo vertical especificamente nesses casos. */
@media (max-height:768px) and (min-width:992px){
  .page-header{padding-top:40px !important;padding-bottom:30px !important;}
  .hero .container{padding-top:24px !important;padding-bottom:30px !important;}
  .search-panel{padding:16px !important;margin-top:15px !important;}
  .field select, .field input{height:36px !important;font-size:.85rem !important;}
}

@media (max-width:960px){
  .search-grid{grid-template-columns:repeat(2,1fr);}
  .property-grid, .features{grid-template-columns:1fr 1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  nav.primary{display:none;}
  .menu-toggle{display:flex;}
  .detail-grid{grid-template-columns:1fr;}
  .contact-card{position:static;}
  .gallery{grid-template-columns:1fr;}
}
@media (max-width:768px){
  /* Cabeçalho mobile: hambúrguer à esquerda, logo em imagem centralizada e maior */
  .topbar{display:none;}
  .logo-img{height:50px;}
  .mcj-wordmark{font-size:clamp(2.5rem,12vw,3.6rem);letter-spacing:-1px;top:90px;}

  /* Setas dos carrosséis um pouco menores e mais próximas da borda no mobile */
  .car-btn{width:38px;height:38px;font-size:1rem;}
  .carousel-nav{padding:0 2px;}

  /* Hero mobile: 1ª dobra = capa imersiva (imagem + logo/menu + mensagem de
     marca, ocupando toda a tela); 2ª dobra = filtro de busca, em bloco à
     parte, revelado ao rolar — sem a imagem atrás. */
  .hero{
    min-height:calc(100dvh - 72px); /* 72px ≈ altura do header sticky no mobile */
    height:calc(100dvh - 72px);
    overflow:hidden;
    padding-top:0;
    align-items:center;
  }
  .hero .container{
    padding-top:0;
    padding-bottom:0;
    height:100%;
    justify-content:center;
  }
  .hero-intro{
    justify-content:center;
  }
  .hero h1, .hero p.lead{text-align:center;margin-left:auto;margin-right:auto;}
  .hero-eyebrow{text-align:center;margin-bottom:12px;font-size:.68rem;}
  .hero h1{font-size:1.8rem;margin-bottom:14px;line-height:1.3;}
  .hero p.lead{font-size:.9rem;margin-bottom:0;line-height:1.6;}

  /* Filtro de busca: bloco separado, com fundo sólido próprio (sem imagem
     atrás), imediatamente abaixo da capa imersiva. */
  .search-section{
    margin-top:0;
    padding:28px 0 40px;
    background-color:var(--bg);
    background-image:none;
    border-top:none;
  }
  .search-panel{
    padding:16px;
    background:var(--search-panel-bg);
    background-image:none;
    backdrop-filter:none;
    box-shadow:none;
    border:1px solid var(--border);
  }
  .search-grid{grid-template-columns:1fr !important;gap:10px;margin-bottom:12px;}
  .price-range{grid-column:span 1 !important;}
  .field label{font-size:.62rem;margin-bottom:4px;}
  .field select, .field input{padding:8px 10px;font-size:.8rem;}
  .btn-gold{padding:12px 34px;}
  .search-footer{padding-bottom:4px;}

  /* Cards de imóvel maiores e com valor mais destacado */
  .property-photo{height:230px;}
  .property-price{font-size:1.3rem;}
  .property-body h3{font-size:1.35rem;}
}
@media (max-width:640px){
  .hero h1{font-size:2.3rem;}
  .detail-title{font-size:1.6rem;}
  .search-grid{grid-template-columns:1fr;}
  .property-grid, .features{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .topbar .left{gap:12px;font-size:.7rem;}
  .price-block{gap:30px;}
  .form-row{grid-template-columns:1fr;}
  .footer-logo-slot{margin:0 auto 16px;}

  /* Card "Gostou desse imóvel?" mais compacto no mobile */
  .contact-card{padding:18px;}
  .contact-card h4{margin-bottom:2px;font-size:.72rem;}
  .contact-card .sub{margin-bottom:14px;font-size:.7rem;}
  .contact-card .form-group{margin-bottom:10px;}
  .contact-card .field label{margin-bottom:4px;font-size:.62rem;}
  .contact-card .field input, .contact-card .field select, .contact-card .field textarea{padding:8px 10px;font-size:.8rem;}
  .contact-card .field textarea{min-height:56px;}
  .contact-card .btn-gold, .contact-card .btn-whatsapp{padding:10px 20px;margin-bottom:8px;}
}

/* =====================================================================
   Corretor Atendente — widget de chat com Gemini (assets/chatbot.js)
   ===================================================================== */
.mcj-chat-fab{
  position:fixed;right:26px;bottom:96px;z-index:400;
  width:60px;height:60px;border-radius:50%;
  background:linear-gradient(150deg,#232019,#0f0f0e);
  border:2px solid var(--gold);color:var(--gold-light);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.55), 0 0 0 4px rgba(201,164,99,.08);
  transition:transform .2s ease, box-shadow .2s ease;
}
.mcj-chat-fab:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 14px 34px rgba(0,0,0,.6), 0 0 0 6px rgba(201,164,99,.12);}
.mcj-chat-fab svg{width:26px;height:26px;}
.mcj-chat-fab img{width:100%;height:100%;border-radius:50%;object-fit:cover;}
.mcj-chat-fab .mcj-chat-fab-dot{
  position:absolute;top:2px;right:2px;width:14px;height:14px;border-radius:50%;
  background:#3ba55d;border:2px solid #0f0f0e;
}
.mcj-chat-fab.hidden-while-open{transform:scale(0);opacity:0;pointer-events:none;}

.mcj-chat-window{
  position:fixed;right:24px;bottom:24px;z-index:401;
  width:360px;max-width:calc(100vw - 32px);
  height:520px;max-height:calc(100vh - 100px);
  background:var(--panel);border:1px solid var(--border);border-radius:14px;
  display:flex;flex-direction:column;overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.6);
  transform:translateY(16px) scale(.97);opacity:0;pointer-events:none;
  transition:transform .22s ease, opacity .22s ease;
  font-family:'Poppins',sans-serif;
}
.mcj-chat-window.open{transform:translateY(0) scale(1);opacity:1;pointer-events:auto;}

.mcj-chat-header{
  display:flex;align-items:center;gap:12px;padding:16px 16px;
  background:linear-gradient(135deg,#232019,#0f0f0e);
  border-bottom:1px solid var(--border);
  flex:0 0 auto;
}
.mcj-chat-avatar{
  width:38px;height:38px;border-radius:50%;flex:0 0 auto;
  background:rgba(201,164,99,.12);border:1px solid var(--gold);
  display:flex;align-items:center;justify-content:center;color:var(--gold-light);
}
.mcj-chat-avatar svg{width:20px;height:20px;}
.mcj-chat-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;}
.mcj-chat-header-info{flex:1;min-width:0;}
.mcj-chat-header-info strong{display:block;font-family:'Cormorant Garamond',serif;font-size:.95rem;letter-spacing:.2px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mcj-chat-status{display:flex;align-items:center;gap:6px;font-size:.7rem;color:#8fbf8f;margin-top:2px;}
.mcj-chat-status .dot{width:7px;height:7px;border-radius:50%;background:#3ba55d;box-shadow:0 0 0 0 rgba(59,165,93,.6);animation:mcjChatPulse 1.8s infinite;}
@keyframes mcjChatPulse{0%{box-shadow:0 0 0 0 rgba(59,165,93,.55);}70%{box-shadow:0 0 0 6px rgba(59,165,93,0);}100%{box-shadow:0 0 0 0 rgba(59,165,93,0);}}
.mcj-chat-close{background:none;border:none;color:var(--text-muted);font-size:1.4rem;line-height:1;cursor:pointer;padding:4px 8px;flex:0 0 auto;}
.mcj-chat-close:hover{color:var(--gold-light);}

.mcj-chat-messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;}
.mcj-chat-msg{
  max-width:85%;padding:10px 14px;border-radius:14px;font-size:.85rem;line-height:1.45;
  word-wrap:break-word;
}
.mcj-chat-msg.bot{align-self:flex-start;background:rgba(255,255,255,.04);border:1px solid var(--border);color:var(--text);border-bottom-left-radius:4px;}
.mcj-chat-msg.user{align-self:flex-end;background:linear-gradient(135deg,var(--gold-light),var(--gold));color:#141210;border-bottom-right-radius:4px;font-weight:500;}
.mcj-chat-msg.error{align-self:flex-start;background:rgba(165,50,42,.12);border:1px solid rgba(165,50,42,.35);color:#e5a39d;border-bottom-left-radius:4px;}
.mcj-chat-msg a{color:inherit;text-decoration:underline;}
.mcj-chat-msg a.mcj-chat-link-btn{
  display:inline-block;margin-top:6px;text-decoration:none;
  background:linear-gradient(135deg,var(--gold-light),var(--gold));
  color:#141210;font-weight:600;font-size:.78rem;
  padding:6px 14px;border-radius:20px;
}
.mcj-chat-msg.user a.mcj-chat-link-btn{background:#141210;color:var(--gold-light);}
.mcj-chat-msg a.mcj-chat-link-btn:hover{filter:brightness(1.08);}

.mcj-chat-typing{align-self:flex-start;display:flex;gap:4px;padding:12px 14px;background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:14px;border-bottom-left-radius:4px;}
.mcj-chat-typing span{width:6px;height:6px;border-radius:50%;background:var(--gold-light);opacity:.5;animation:mcjChatTyping 1.1s infinite;}
.mcj-chat-typing span:nth-child(2){animation-delay:.15s;}
.mcj-chat-typing span:nth-child(3){animation-delay:.3s;}
@keyframes mcjChatTyping{0%,60%,100%{opacity:.35;transform:translateY(0);}30%{opacity:1;transform:translateY(-3px);}}

.mcj-chat-input-row{display:flex;align-items:center;gap:8px;padding:12px;border-top:1px solid var(--border);flex:0 0 auto;background:var(--bg);}
.mcj-chat-input-row input{
  flex:1;background:var(--input-bg);border:1px solid var(--border);border-radius:20px;
  color:var(--text);padding:10px 16px;font-size:.85rem;font-family:'Poppins',sans-serif;
}
.mcj-chat-input-row input:focus{outline:none;border-color:var(--gold);}
.mcj-chat-send{
  width:38px;height:38px;border-radius:50%;flex:0 0 auto;
  background:linear-gradient(135deg,var(--gold-light),var(--gold));border:none;color:#141210;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s ease;
}
.mcj-chat-send:hover{transform:scale(1.06);}
.mcj-chat-send:disabled{opacity:.5;cursor:not-allowed;}
.mcj-chat-send svg{width:16px;height:16px;}

@media (max-width:640px){
  .mcj-chat-fab{right:18px;bottom:88px;width:52px;height:52px;}
  .mcj-chat-window{right:12px;bottom:12px;width:calc(100vw - 24px);height:calc(100vh - 140px);}
}
