/* ============================================================
   Sandra Valeria — Página de links
   Identidade: manual de marca (Cinnamon/Petal/Dark Coffee/Light Bronze)
   Estático — Cloudflare Pages
   ============================================================ */

/* ---- Fontes de marca (self-hosted) ---- */
@font-face { font-family:'Remark'; src:url('assets/fonts/Remark-Regular.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Remark'; src:url('assets/fonts/Remark-Italic.woff2') format('woff2'); font-weight:400; font-style:italic; font-display:swap; }
@font-face { font-family:'Remark'; src:url('assets/fonts/Remark-Bold.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Source Sans 3'; src:url('assets/fonts/SourceSans3-Variable.woff2') format('woff2'); font-weight:200 900; font-style:normal; font-display:swap; }
@font-face { font-family:'Source Sans 3'; src:url('assets/fonts/SourceSans3-Italic-Variable.woff2') format('woff2'); font-weight:200 900; font-style:italic; font-display:swap; }

:root {
  color-scheme: light only;
  --cinnamon:#B25C35; --cinnamon-dark:#8F4526;
  --light-bronze:#CD976D;
  --petal:#E8D7CD; --petal-soft:#F3E9E3;
  --dark-coffee:#341B16; --coffee-soft:#4E332A;
  --cream:#FAF5F2;
  --font-display:'Remark',Georgia,serif;
  --font-text:'Source Sans 3',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --maxw:480px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

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

html { -webkit-text-size-adjust:100%; }

body {
  font-family:var(--font-text);
  font-weight:300;
  color:var(--dark-coffee);
  background:var(--cream);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
  position:relative;
  overflow-x:hidden;
}

/* Fundo decorativo — brilho quente + grafismo suave */
body::before {
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(120% 60% at 50% -10%, rgba(178,92,53,.14), transparent 60%),
    radial-gradient(90% 50% at 50% 108%, rgba(205,151,109,.12), transparent 60%);
}

.page { position:relative; z-index:1; max-width:var(--maxw); margin:0 auto; padding:56px 22px 40px; }

/* ---------- Header ---------- */
.header { text-align:center; }
.header__logo { width:min(232px, 64vw); height:auto; margin:0 auto 26px; display:block; }
.crp {
  font-family:var(--font-display); font-weight:700; font-size:11px;
  letter-spacing:1.6px; text-transform:uppercase; color:var(--cinnamon);
  margin-bottom:16px;
}
.tagline {
  font-family:var(--font-display); font-style:italic; font-weight:400;
  font-size:21px; line-height:1.3; color:var(--dark-coffee);
  max-width:340px; margin:0 auto 18px;
}
.modalidade {
  display:inline-flex; align-items:center; gap:8px;
  font-size:14px; font-weight:500; color:var(--coffee-soft);
  background:var(--petal); padding:7px 16px; border-radius:999px;
}
.modalidade .dot { width:7px; height:7px; border-radius:999px; background:var(--cinnamon); display:inline-block; }

/* ---------- Botões / cards ---------- */
.stack { margin-top:32px; display:flex; flex-direction:column; gap:14px; }

.btn {
  display:flex; align-items:center; justify-content:center; gap:10px;
  text-decoration:none; cursor:pointer; border:none;
  font-family:var(--font-display); font-weight:700; font-size:17px;
  padding:18px 22px; border-radius:18px;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
}
.btn--primary {
  background:var(--cinnamon); color:#fff;
  box-shadow:0 6px 22px rgba(178,92,53,.32);
}
.btn--primary:hover { background:var(--cinnamon-dark); transform:translateY(-3px); box-shadow:0 12px 30px rgba(178,92,53,.40); }
.btn--primary:active { transform:translateY(-1px); }
.btn__icon { width:22px; height:22px; flex:none; }

/* ---------- Seções info ---------- */
.section { margin-top:34px; }
.section__title {
  font-family:var(--font-display); font-weight:700; font-size:13px;
  letter-spacing:1.6px; text-transform:uppercase; color:var(--cinnamon);
  text-align:center; margin-bottom:16px;
}

.card {
  background:#fff; border:1px solid var(--petal);
  border-radius:18px; padding:20px 22px;
  box-shadow:0 4px 16px rgba(52,27,22,.05);
}
.card__label { display:flex; align-items:center; gap:8px; font-family:var(--font-display); font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:1px; color:var(--coffee-soft); margin-bottom:8px; }
.card__label svg { width:16px; height:16px; color:var(--cinnamon); }
.card p { font-size:15px; color:var(--coffee-soft); }

/* Card clicável (endereço → mapa) */
.card--link { display:block; text-decoration:none; color:inherit; cursor:pointer;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease); }
.card--link:hover { transform:translateY(-3px); border-color:var(--light-bronze); box-shadow:0 12px 28px rgba(52,27,22,.10); }
.card__cta { display:inline-flex; align-items:center; gap:6px; margin-top:12px;
  font-family:var(--font-display); font-weight:700; font-size:13px; color:var(--cinnamon); }
.card__cta svg { width:15px; height:15px; }
.card--link:hover .card__cta { color:var(--cinnamon-dark); }

/* ---------- Grade de planos ---------- */
.planos { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.plano {
  background:var(--dark-coffee); border:1px solid transparent; border-radius:14px;
  min-height:118px; padding:18px 14px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; text-align:center;
  transition:transform .2s var(--ease), box-shadow .2s var(--ease);
}
.plano:hover { transform:translateY(-3px); box-shadow:0 10px 24px rgba(52,27,22,.20); }
/* logo: largura livre, altura definida por classe (normalização por área óptica) */
.plano__logo { width:auto; max-width:80%; object-fit:contain; display:block; }
.plano__name { font-family:var(--font-text); font-weight:400; font-size:12px; letter-spacing:.4px; color:var(--light-bronze); line-height:1.2; }
/* tile largo (7º item ímpar) ocupa a linha inteira */
.plano--wide { grid-column:1 / -1; }

/* Alturas normalizadas por ÁREA óptica — pesos visuais equivalentes entre formatos diferentes */
.lg-amil    { height:33px; }
.lg-assefaz { height:54px; }
.lg-cassi   { height:40px; }
.lg-campe   { height:37px; }
.lg-geap    { height:40px; }
.lg-luminar { height:28px; }
.lg-exmed   { height:30px; }

/* ---------- Rodapé ---------- */
.footer { margin-top:44px; text-align:center; color:var(--light-bronze); font-size:13px; }
.footer img { width:34px; opacity:.7; margin-bottom:12px; }
.footer a { color:var(--cinnamon); text-decoration:none; }

/* ---------- Reveal on scroll ---------- */
.js .reveal { opacity:0; transform:translateY(18px); }
.reveal.in { opacity:1; transform:none; transition:opacity .6s var(--ease), transform .6s var(--ease); }

@media (prefers-reduced-motion:reduce) {
  .js .reveal { opacity:1; transform:none; }
  .reveal.in { transition:none; }
  .btn, .plano { transition:none; }
}

@media (max-width:360px) { .tagline { font-size:19px; } }