/* =========================================================
   SOFINATTI · Tema CLARO
   Carregado depois de style.css apenas na versão clara.
   ========================================================= */
:root{
  --bg:#f5f1ea; --bg-2:#ece6dc; --card:#fffdf9; --card-2:#f7f2ea; --glass:rgba(255,253,249,.72);
  --line:rgba(40,30,20,.10); --line-2:rgba(40,30,20,.20);
  --text:#1c1814; --muted:#776d61; --soft:#463e35; --accent:#9a7b55; --white:#14110e;
  --ink:#1c1814; --paper:#f7f2ea;
}
body{background:var(--bg);color:var(--text)}

/* Áreas sobre foto continuam com texto claro */
.tile--shade,.cat,.banner,.phd--img .frame,.mega .feat{
  --text:#f2ece3; --soft:#e6ddcf; --muted:#cfc4b4; --white:#f7f2ea; --line:rgba(240,230,215,.14); --line-2:rgba(240,230,215,.28);
  color:var(--text);
}
.banner .btn,.phd--img .btn{background:var(--paper);color:var(--ink)}
.banner .btn--ghost{background:transparent;color:var(--paper)}

/* Botões, pílulas e chips: invertidos (fundo escuro) */
.btn{background:var(--ink);color:var(--paper)}
.btn:hover{background:#000}
.btn--ghost{background:transparent;color:var(--text);border:1px solid var(--line-2)}
.btn--ghost:hover{background:rgba(28,24,20,.05)}
.pill:hover,.pill.is-on,.tabs .pill.is-on,.chip.is-on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.chip:hover{border-color:var(--soft)}
.nav>li>a:hover,.nav>li>button:hover,.nav>li>a[aria-current=page],.mega ul a:hover,.tabs .pill:hover{background:rgba(28,24,20,.06)}
.prod:hover .arrow{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.prod .ph .tag{background:rgba(255,253,249,.8)}

/* Header, menus */
.hd .bar{background:rgba(255,253,249,.62);border-color:rgba(40,30,20,.08)}
.hd.is-scrolled .bar{background:rgba(250,247,242,.92);box-shadow:0 8px 30px rgba(40,30,20,.08)}
.hd .logo img,.ft img,.ph-empty img{filter:invert(1)}
.mega{background:rgba(255,253,249,.98);box-shadow:0 24px 60px rgba(40,30,20,.14)}
.tabs .scroller{background:rgba(255,253,249,.82)}
.burger{background:rgba(28,24,20,.06)}
.mnav{background:var(--bg)}

/* Hero (primeira dobra): mantém o véu escuro da versão original, texto claro */
.hero-frame{
  --text:#f2ece3; --soft:#d7cebf; --muted:#a69b8c; --white:#f7f2ea; --line-2:rgba(240,230,215,.28);
  color:var(--text);
}
.hero-frame::after{background:
  linear-gradient(90deg,rgba(12,10,8,.8) 0%,rgba(12,10,8,.4) 45%,rgba(12,10,8,0) 75%),
  linear-gradient(0deg,rgba(12,10,8,.55) 0%,rgba(12,10,8,.2) 30%,transparent 55%),
  linear-gradient(180deg,rgba(12,10,8,.55),transparent 22%)}
.hero-frame .btn{background:var(--paper);color:var(--ink)}
.hero-frame .btn:hover{background:#fff}
.hero-frame .btn--ghost{background:transparent;color:var(--paper);border-color:rgba(240,230,215,.28)}
.hero-frame .btn--ghost:hover{background:rgba(255,255,255,.08)}
.hero-frame .eyebrow{color:#c4a47e}

/* Espaço reservado de imagem */
.ph-empty{background:radial-gradient(120% 90% at 50% 20%,#fffdf9 0%,#f1ebe1 55%,#e9e2d6 100%);color:rgba(40,30,20,.42)}
.ph-empty img{opacity:.22}
.ph-empty::before{border-color:rgba(40,30,20,.14)}

/* Cards com leve sombra para destacar do fundo */
.prod,.step,.unit,.test,.tile--feat,.plan{box-shadow:0 1px 0 rgba(40,30,20,.03),0 12px 32px -18px rgba(40,30,20,.18)}
.ft{background:var(--bg-2)}

@media (max-width:760px){
  .hero-frame::after{background:linear-gradient(0deg,rgba(12,10,8,.92) 0%,rgba(12,10,8,.8) 30%,rgba(12,10,8,.3) 65%,rgba(12,10,8,.5))}
}