/* ============================================================
   Paraná Consórcios — Estilos de páginas internas
   ============================================================ */

/* hero da página de segmento */
.seg-hero { padding-top: calc(var(--header-h) + clamp(40px, 6vw, 72px)); padding-bottom: clamp(40px, 5vw, 64px); position: relative; overflow: hidden; background: linear-gradient(180deg, var(--cream-50), var(--paper)); border-bottom: 1px solid var(--line); }
.seg-hero-grid { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(32px, 5vw, 64px); align-items: center; }
.seg-hero .lead { margin-top: var(--sp-4); max-width: 50ch; }
.seg-hero-cta { margin-top: var(--sp-6); display: flex; gap: var(--sp-3); flex-wrap: wrap; }
.seg-hero-photo { aspect-ratio: 5/4; border-radius: var(--r-2xl); box-shadow: var(--shadow-lg); }
@media (max-width: 880px) { .seg-hero-grid { grid-template-columns: 1fr; } .seg-hero-visual { order: -1; max-width: 480px; } }

.seg-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); margin-top: var(--sp-7); }
.seg-stat { border-left: 2px solid var(--green-300); padding-left: var(--sp-4); }
.seg-stat b { font-family: var(--font-display); font-size: 1.9rem; color: var(--ink-900); display: block; line-height: 1; }
.seg-stat span { font-size: var(--fs-xs); color: var(--ink-500); margin-top: 6px; display: block; }

/* usos / para que serve */
.uses { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-4); }
.use-card { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--sp-5); transition: box-shadow var(--dur-base), transform var(--dur-base); }
.use-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.use-card .use-ic { width: 46px; height: 46px; border-radius: var(--r-md); background: var(--green-50); display: flex; align-items: center; justify-content: center; }
.use-card .use-ic svg { width: 24px; height: 24px; stroke: var(--brand); }
.use-card h3 { font-size: var(--fs-base); margin-top: var(--sp-4); }
.use-card p { font-size: var(--fs-sm); color: var(--ink-500); margin-top: 6px; }
@media (max-width: 860px) { .uses { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .uses { grid-template-columns: 1fr; } }

/* planos / parcelas */
.planos { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); }
.plano { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-xl); padding: var(--sp-6); position: relative; transition: transform var(--dur-base), box-shadow var(--dur-base); }
.plano.featured { border-color: var(--brand); box-shadow: var(--shadow-lg); }
.plano.featured .badge { position: absolute; top: -13px; left: var(--sp-6); }
.plano:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.plano .plano-credito { font-size: var(--fs-xs); color: var(--ink-400); text-transform: uppercase; letter-spacing: 0.08em; }
.plano .plano-val { font-family: var(--font-display); font-size: 2rem; font-weight: 700; color: var(--ink-900); margin: 4px 0 var(--sp-4); }
.plano .plano-parcela { display: flex; align-items: baseline; gap: 6px; padding: var(--sp-4); background: var(--green-50); border-radius: var(--r-md); }
.plano .plano-parcela .pp-from { font-size: var(--fs-xs); color: var(--ink-500); }
.plano .plano-parcela .pp-val { font-family: var(--font-display); font-size: 1.6rem; font-weight: 700; color: var(--brand); }
.plano .plano-parcela .pp-mes { font-size: var(--fs-xs); color: var(--ink-500); }
.plano ul { margin: var(--sp-5) 0; display: flex; flex-direction: column; gap: 11px; }
.plano li { display: flex; gap: 10px; font-size: var(--fs-sm); color: var(--ink-600); }
.plano li svg { width: 18px; height: 18px; stroke: var(--brand); flex-shrink: 0; margin-top: 2px; }
@media (max-width: 820px) { .planos { grid-template-columns: 1fr; max-width: 460px; margin-inline: auto; } }

/* callout simulador */
.sim-callout { background: var(--green-900); color: #fff; border-radius: var(--r-2xl); padding: clamp(32px, 5vw, 56px); display: flex; align-items: center; justify-content: space-between; gap: var(--sp-6); flex-wrap: wrap; position: relative; overflow: hidden; }
.sim-callout::before { content: ""; position: absolute; inset: 0; background: radial-gradient(70% 120% at 100% 0%, rgba(196,154,69,0.18), transparent 55%); }
.sim-callout > * { position: relative; }
.sim-callout h2 { color: #fff; max-width: 18ch; }
.sim-callout p { color: var(--green-100); margin-top: var(--sp-3); max-width: 42ch; }

/* split / texto + imagem */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 64px); align-items: center; }
.split.reverse .split-visual { order: 2; }
.split-photo { aspect-ratio: 4/3; border-radius: var(--r-xl); box-shadow: var(--shadow-md); }
.split-copy h2 { margin-bottom: var(--sp-4); }
.split-copy p + p { margin-top: var(--sp-3); }
.split-list { margin-top: var(--sp-5); display: flex; flex-direction: column; gap: 14px; }
.split-list li { display: flex; gap: 12px; font-size: var(--fs-base); }
.split-list li svg { width: 22px; height: 22px; stroke: var(--brand); flex-shrink: 0; margin-top: 2px; }
.split-list li b { color: var(--ink-900); }
@media (max-width: 820px) { .split { grid-template-columns: 1fr; } .split.reverse .split-visual { order: -1; } }

/* contato */
.contato-grid { display: grid; grid-template-columns: 0.95fr 1.05fr; gap: clamp(32px, 5vw, 64px); align-items: start; }
.contato-methods { display: flex; flex-direction: column; gap: var(--sp-3); }
.contato-method { display: flex; align-items: center; gap: var(--sp-4); padding: var(--sp-5); border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--paper); transition: box-shadow var(--dur-base), border-color var(--dur-base); }
.contato-method:hover { box-shadow: var(--shadow-sm); border-color: var(--line-strong); }
.contato-method .cm-ic { width: 50px; height: 50px; border-radius: var(--r-md); background: var(--green-50); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.contato-method .cm-ic svg { width: 24px; height: 24px; stroke: var(--brand); }
.contato-method .cm-ic.is-whats { background: #E7F7EE; }
.contato-method .cm-ic.is-whats svg { stroke: #1FA855; fill: none; }
.contato-method b { font-size: var(--fs-base); color: var(--ink-900); display: block; }
.contato-method span { font-size: var(--fs-sm); color: var(--ink-500); }
.contato-form { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-xl); padding: clamp(24px,3vw,40px); box-shadow: var(--shadow-sm); }
.contato-form h2 { font-size: var(--fs-xl); }
.contato-form .field label { color: var(--ink-600); }
.contato-form .field input, .contato-form .field select, .contato-form .field textarea { background: var(--cream-50); border: 1.5px solid var(--line); color: var(--ink-900); width:100%; padding:14px 16px; border-radius:var(--r-md); font:inherit; font-size:var(--fs-sm); transition: border-color var(--dur-base); }
.contato-form .field textarea { min-height: 110px; resize: vertical; }
.contato-form .field input::placeholder, .contato-form .field textarea::placeholder { color: var(--ink-400); }
.contato-form .field input:focus, .contato-form .field select:focus, .contato-form .field textarea:focus { outline: none; border-color: var(--brand); }
@media (max-width: 820px) { .contato-grid { grid-template-columns: 1fr; } }
