/* ============================================================
   Camada "streamline" — Norman Bel Geddes, discreto.
   Forma, friso e movimento horizontal. Paleta e fontes intactas.
   ============================================================ */

:root {
  /* Friso cromado: brilho creme que some para a direita */
  --chrome: linear-gradient(90deg, rgba(240, 229, 228, 0) 0%, rgba(240, 229, 228, 0.42) 18%, rgba(240, 229, 228, 0.1) 62%, rgba(240, 229, 228, 0) 100%);
  /* Raio "gota": proa larga à esquerda, popa mais seca */
  --r-drop: 40px 14px 14px 40px;
  --ease-stream: cubic-bezier(0.16, 1, 0.3, 1);
}

/* Fundo: fluxo horizontal no lugar dos halos radiais */
body {
  background:
    linear-gradient(180deg, rgba(215, 42, 44, 0.07) 0%, transparent 38%),
    var(--paper);
}

/* Cabeçalho: friso cromado no lugar da linha vinho */
.site-header::after {
  background: var(--chrome);
}

/* ─── Hero ─── */
.hero--split::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: var(--chrome);
}
.hero--split .wrap { position: relative; z-index: 1; }

/* Print do hero: casco arredondado e friso no topo */
.shot,
.dc-shot {
  border-radius: 22px;
  border-color: rgba(240, 229, 228, 0.14);
  box-shadow:
    0 1px 0 rgba(240, 229, 228, 0.06) inset,
    -40px 30px 80px -30px rgba(0, 0, 0, 0.7);
}
.shot .chrome,
.dc-shot .chrome {
  position: relative;
  background: linear-gradient(180deg, #1c0c0e, var(--ink-dk-2));
}
.shot .chrome::after,
.dc-shot .chrome::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: var(--chrome);
}

/* ─── Títulos de seção: horizontais ─── */
.sec-head {
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
}
.sec-head h2 {
  max-width: 24ch;
  hyphens: manual;
}

/* Divisões entre seções: friso, não borda chapada */
.section + .section {
  border-top: 0;
  position: relative;
}
.section + .section::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: var(--chrome);
}

/* ─── Cartões: forma de gota e friso cromado ─── */
.ramo-card,
.tool-card,
.plano-card {
  border-radius: var(--r-drop);
  position: relative;
  overflow: hidden;
  border-color: rgba(240, 229, 228, 0.09);
  background: linear-gradient(100deg, var(--paper-3) -30%, var(--paper-2) 45%);
  transition:
    border-color 0.3s ease,
    transform 0.5s var(--ease-stream);
}
.ramo-card { padding-left: 30px; }
.ramo-card::before,
.tool-card::before,
.plano-card::before {
  content: '';
  position: absolute;
  left: 28px;
  right: 0;
  top: 0;
  height: 1px;
  background: var(--chrome);
}
.ramo-card:hover,
.tool-card:hover,
.plano-card:hover {
  transform: translateX(4px);
  border-color: rgba(240, 229, 228, 0.2);
}
.plano-card.is-featured {
  border-color: rgba(215, 42, 44, 0.55);
  background: linear-gradient(100deg, rgba(215, 42, 44, 0.16) -20%, var(--paper-2) 55%);
}
.plano-card { overflow: visible; }

/* Botão principal: esmalte com brilho de topo, seta "acelera" */
.btn--primary {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 10px 24px -12px rgba(215, 42, 44, 0.8);
}
.btn .arr { transition: transform 0.35s var(--ease-stream); }
.btn:hover .arr { transform: translateX(6px); }

@media (max-width: 880px) {
  .sec-head { grid-template-columns: 1fr; }
  :root { --r-drop: 28px 12px 12px 28px; }
}

/* ─── Primeira tela: céu noturno, torre e feixe (SVG .hero-sky no index) ─── */
.hero--ceu { background: #070203; padding-bottom: clamp(120px, 12vw, 180px); }
.hero-sky { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
@media (prefers-reduced-motion: no-preference) {
  .hero-sky rect { transform-origin: 50% 100%; transform-box: fill-box; animation: beam-up 1.6s var(--ease-stream) .2s both; }
  @keyframes beam-up { from { transform: scaleY(0); } to { transform: scaleY(1); } }
}
@media (max-width: 980px) { .hero-sky { display: none; } .hero--ceu { padding-bottom: clamp(40px, 5vw, 72px); } }