/* =========================================================================
   Vivi Moraes Semijoias — VERSÃO CLARA (página /claro)
   Carrega DEPOIS de style.css e só sobrescreve cores. O layout, os textos e o
   comportamento são os mesmos da versão escura, que não é alterada.
   Base: marfim #F4EFE7 e branco quente #FAF9F5, com texto em azul-marinho
   #102D48 e dourado mais fechado para dar contraste sobre fundo claro.
   ========================================================================= */

:root {
  color-scheme: light;

  /* texto: o que era marfim vira marinho */
  --ivory: #102D48;
  --warm-white: #0B1F33;
  --mist: rgba(16, 45, 72, .76);
  --mist-2: rgba(16, 45, 72, .56);

  /* dourado mais fechado (o #C9A46A puro some sobre fundo claro) */
  --gold: #9C7737;
  --gold-hi: #C9A46A;
  --gold-deep: #7A5C24;
  --gold-glow: rgba(156, 119, 55, .3);

  --line: rgba(156, 119, 55, .3);
  --line-soft: rgba(16, 45, 72, .12);
  --glass: rgba(255, 255, 255, .55);
  --glass-2: rgba(255, 255, 255, .78);
}

/* ---------- fundo ---------- */
body { background: #F4EFE7; color: var(--ivory); font-weight: 400; }
body::before {
  background:
    radial-gradient(80rem 46rem at 80% -6%, rgba(201, 164, 106, .22), transparent 62%),
    radial-gradient(60rem 40rem at 2% 30%, rgba(255, 255, 255, .75), transparent 60%),
    radial-gradient(70rem 46rem at 94% 84%, rgba(128, 106, 167, .10), transparent 62%),
    linear-gradient(178deg, #FAF9F5, #F4EFE7 55%, #EDE5D8);
}
body::after { opacity: .10; mix-blend-mode: multiply; }
::-webkit-scrollbar-track { background: #F4EFE7; }
::-webkit-scrollbar-thumb { background: var(--gold-hi); border-color: #F4EFE7; }
::selection { background: var(--gold-hi); color: #0B1F33; }
strong { color: #0B1F33; font-weight: 600; }

/* ---------- vidro claro ---------- */
.glass {
  background:
    radial-gradient(260px circle at var(--mx, 50%) var(--my, -30%), rgba(201, 164, 106, var(--spot, .18)), transparent 62%),
    linear-gradient(145deg, rgba(255, 255, 255, .86), rgba(255, 255, 255, .58) 46%, rgba(244, 239, 231, .7));
  border: 1px solid rgba(156, 119, 55, .3);
  box-shadow:
    0 24px 54px -30px rgba(16, 45, 72, .32),
    0 2px 0 rgba(255, 255, 255, .9) inset,
    inset 0 -30px 50px -40px rgba(201, 164, 106, .3);
}
.glass::before { background: linear-gradient(90deg, transparent, rgba(201, 164, 106, .7) 22%, rgba(156, 119, 55, .95) 50%, rgba(201, 164, 106, .7) 78%, transparent); opacity: 1; }
.glass:hover {
  --spot: .3;
  border-color: rgba(156, 119, 55, .6);
  box-shadow: 0 28px 60px -28px rgba(16, 45, 72, .38), 0 0 40px -12px rgba(201, 164, 106, .6), inset 0 2px 0 rgba(255, 255, 255, .95), inset 0 -30px 50px -36px rgba(201, 164, 106, .4);
}
.live__panel, .sort__panel, .cta__panel {
  box-shadow: 0 28px 60px -30px rgba(16, 45, 72, .35), 0 0 0 1px rgba(156, 119, 55, .22), 0 0 60px -22px rgba(201, 164, 106, .7), inset 0 2px 0 rgba(255, 255, 255, .95);
}
.vip__panel {
  box-shadow: 0 28px 60px -30px rgba(16, 45, 72, .35), 0 0 0 1px rgba(37, 211, 102, .25), 0 0 60px -22px rgba(37, 211, 102, .5), inset 0 2px 0 rgba(255, 255, 255, .95);
}

/* ---------- botões: escuros sobre fundo claro ---------- */
.btn--gold {
  color: #FAF9F5;
  background: linear-gradient(135deg, #1D4A70, #102D48 45%, #0B1F33 70%, #1B4468);
  background-size: 180% 180%;
  border: 1px solid rgba(201, 164, 106, .75);
  box-shadow: 0 14px 30px -14px rgba(16, 45, 72, .7), inset 0 1px 0 rgba(255, 255, 255, .22), 0 0 0 1px rgba(201, 164, 106, .25);
}
.btn--gold:hover { box-shadow: 0 20px 42px -14px rgba(16, 45, 72, .8), 0 0 30px -6px rgba(201, 164, 106, .7), inset 0 1px 0 rgba(255, 255, 255, .3); }
.btn--glass {
  color: #102D48;
  background: linear-gradient(140deg, rgba(255, 255, 255, .85), rgba(255, 255, 255, .5));
  border: 1px solid rgba(16, 45, 72, .28);
  box-shadow: 0 10px 26px -16px rgba(16, 45, 72, .4), inset 0 1px 0 #fff;
}
.btn--glass:hover { border-color: var(--gold); color: #7A5C24; }
.btn--ghost { color: #7A5C24; border-color: rgba(122, 92, 36, .55); }
.btn--ghost:hover { background: rgba(201, 164, 106, .18); border-color: var(--gold); }
.btn--wa { color: #04351A; box-shadow: 0 14px 30px -16px rgba(20, 169, 76, .7), inset 0 1px 0 rgba(255, 255, 255, .5); }

/* ---------- cabeçalho ---------- */
.header.is-stuck {
  background: rgba(250, 249, 245, .84);
  border-bottom-color: rgba(156, 119, 55, .3);
  box-shadow: 0 10px 30px -22px rgba(16, 45, 72, .4);
}
.nav a { font-weight: 500; }
.burger span { background: #102D48; }
.mmenu { background: rgba(250, 249, 245, .98); }
.mmenu nav a { color: #102D48; }

/* ---------- hero ---------- */
.hero__glow {
  background:
    radial-gradient(38rem 30rem at 72% 42%, rgba(201, 164, 106, .3), transparent 68%),
    radial-gradient(30rem 26rem at 12% 76%, rgba(128, 106, 167, .14), transparent 70%);
}
.hero__frame { border-color: rgba(156, 119, 55, .5); box-shadow: 0 36px 70px -34px rgba(16, 45, 72, .55), 0 0 44px -14px rgba(201, 164, 106, .6); }
.hero__ring { border-color: rgba(156, 119, 55, .3); }
.sparkles i { background: #C9A46A; box-shadow: 0 0 8px 1px rgba(201, 164, 106, .7); }
.scrollhint { background: linear-gradient(180deg, transparent, rgba(156, 119, 55, .6)); }
.scrollhint span { background: var(--gold); }

/* ---------- faixa de categorias ---------- */
.ticker {
  background: linear-gradient(90deg, rgba(201, 164, 106, .14), rgba(201, 164, 106, .28), rgba(201, 164, 106, .14));
  border-block-color: rgba(156, 119, 55, .35);
}
.ticker__set i { background: rgba(156, 119, 55, .6); }

/* ---------- seções ---------- */
.live__when, .cta__ways { background: rgba(255, 255, 255, .55); border-color: rgba(156, 119, 55, .3); }
.live__when-item, .way { background: rgba(255, 255, 255, .5); }
.way:not(.way--static):hover { background: rgba(201, 164, 106, .2); }
.step__n { -webkit-text-stroke: 1px rgba(156, 119, 55, .75); filter: none; }
.stat__n { filter: drop-shadow(0 2px 8px rgba(201, 164, 106, .35)); }
.tick { border-color: rgba(156, 119, 55, .55); background: rgba(201, 164, 106, .18); }
.perk__ico { background: rgba(255, 255, 255, .75); border-color: rgba(156, 119, 55, .3); }
.pcard__ico, .why__ico { color: #7A5C24; background: linear-gradient(140deg, rgba(201, 164, 106, .35), rgba(201, 164, 106, .12)); border-color: rgba(156, 119, 55, .45); box-shadow: 0 8px 20px -10px rgba(156, 119, 55, .6), inset 0 1px 0 rgba(255, 255, 255, .8); }
.pcard--wa .pcard__ico { color: #0E7A3B; background: linear-gradient(140deg, rgba(37, 211, 102, .25), rgba(37, 211, 102, .08)); border-color: rgba(20, 169, 76, .5); }
.pcard--wa .pcard__link { color: #0E7A3B; }
.pcard__link { color: #7A5C24; }
.pcard__link:hover { color: #0B1F33; }
.step--cta, .quote--cta { background: linear-gradient(150deg, rgba(201, 164, 106, .3), rgba(201, 164, 106, .1) 55%, rgba(255, 255, 255, .6)); border-color: rgba(156, 119, 55, .4); }
.eyebrow--gold { color: #8A6A2C; }
.quote__mark { color: rgba(156, 119, 55, .3); }
.quote figcaption { color: #7A5C24; }
.care__n, .ent__note a, .qa__a a { color: #7A5C24; }
.ent li::before { background: #9C7737; }

/* filtros da galeria */
.chip { color: #102D48; background: rgba(255, 255, 255, .6); border-color: rgba(16, 45, 72, .2); font-weight: 600; }
.chip:hover { color: #7A5C24; border-color: var(--gold); }
.chip.is-on { color: #0B1F33; background: linear-gradient(135deg, #E2C591, #C9A46A); border-color: transparent; }

/* fotos: bordas e sombras suaves */
.gitem, .insta__it { border-color: rgba(156, 119, 55, .3); background: #E9E1D3; }
.gitem:hover, .insta__it:hover { border-color: var(--gold); box-shadow: 0 30px 50px -28px rgba(16, 45, 72, .55), 0 0 36px -10px rgba(201, 164, 106, .7); }
.live__photo, .sobre__photo, .vip__art img, .sort__art img { box-shadow: 0 34px 60px -34px rgba(16, 45, 72, .55); }
.live__photo { border-color: rgba(156, 119, 55, .5); box-shadow: 0 34px 60px -34px rgba(16, 45, 72, .55), 0 0 60px -22px rgba(255, 59, 78, .3); }

/* cartões que ficam SOBRE fotos continuam em vidro escuro, com texto claro */
.colcard, .gitem, .live__chip, .live__badge {
  --ivory: #F4EFE7; --warm-white: #FAF9F5; --mist: rgba(244, 239, 231, .82); --gold: #E2C591; --gold-hi: #EBD2A0;
}
.colcard { border-color: rgba(156, 119, 55, .35); }

/* ---------- FAQ / depoimentos ---------- */
.qa summary i::before, .qa summary i::after { background: #9C7737; }

/* ---------- flutuantes ---------- */
.totop { background: rgba(250, 249, 245, .92); color: #7A5C24; border-color: rgba(156, 119, 55, .4); }

/* ---------- rodapé escuro (ilha escura com texto claro) ---------- */
.footer {
  --ivory: #F4EFE7; --warm-white: #FAF9F5; --mist: rgba(244, 239, 231, .74); --mist-2: rgba(244, 239, 231, .52);
  --gold: #C9A46A; --gold-hi: #EBD2A0; --line: rgba(201, 164, 106, .22); --line-soft: rgba(244, 239, 231, .12);
  color: var(--ivory);
  background: linear-gradient(180deg, #0E2740, #081A2B);
  border-top: 1px solid rgba(201, 164, 106, .5);
}

/* lightbox continua escuro */
.lightbox { --ivory: #F4EFE7; --mist: rgba(244, 239, 231, .8); --gold-hi: #EBD2A0; --line-soft: rgba(244, 239, 231, .14); }

/* ---------- celular ---------- */
@media (max-width: 700px) {
  .glass { background: linear-gradient(145deg, rgba(255, 255, 255, .95), rgba(250, 246, 238, .9)); }
  .colcard__body { background: rgba(8, 26, 43, .82); }
}

/* ---------- impressão ---------- */
@media print { .footer { background: #fff; color: #17130F; } }
