/* LEVLI — componentes exclusivos da página "Diagnóstico, Otimização e Criação de Perfil no Instagram".
   Carregar DEPOIS de styles.css e servico.css. Tudo prefixado com .ig- */
.ig-sym { position: absolute; width: 0; height: 0; overflow: hidden; }
.svc__intro a { color: var(--cereja); font-weight: 600; text-underline-offset: 3px; }
.svc--dark .svc__intro a { color: var(--rosa); }
.ig-stack { display: grid; gap: 1rem; max-width: 46rem; }
.ig-sub { font-size: .72rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--cereja); margin-bottom: .7rem; }
.svc--dark .ig-sub { color: var(--rosa); }
.svc--dark .front__list li::before { background: var(--rosa); }
.ig-note { font-size: .9rem; color: var(--texto-suave); border-left: 3px solid var(--rosa); padding-left: .9rem; }
.plan--full .ig-note { color: var(--offwhite); opacity: .9; }

/* Cards: ajustes locais sobre .plan */
.ig-for { font-size: .92rem; color: var(--texto-suave); }
.plan--full .ig-for { color: var(--offwhite); opacity: .88; }
.ig-badge12 { border: 1.5px solid currentColor; border-radius: 6px; padding: 1rem 1.1rem; display: grid; gap: .6rem; }
.ig-badge12 strong { font-family: var(--font-display); font-size: 1.35rem; font-weight: 500; line-height: 1.15; }
.ig-badge12 p { font-size: .92rem; }
.ig-grid12 { display: grid; grid-template-columns: repeat(6, 1fr); gap: .3rem; }
.ig-grid12 i { aspect-ratio: 1; border-radius: 3px; border: 1.5px solid currentColor; opacity: .55; }
.ig-grid12 i.is-pin { background: var(--rosa); border-color: var(--rosa); opacity: 1; }
.plan--ig .ig-grid12 i.is-pin { background: var(--cereja); border-color: var(--cereja); }
.ig-legend { display: flex; flex-wrap: wrap; gap: .4rem 1rem; font-size: .82rem; }
.ig-legend span::before { content: ""; display: inline-block; width: .7rem; height: .7rem; border-radius: 2px; margin-right: .4rem; vertical-align: -.05em; border: 1.5px solid currentColor; }
.ig-legend span.p::before { background: var(--cereja); border-color: var(--cereja); }
.plan--full .ig-legend span.p::before { background: var(--rosa); border-color: var(--rosa); }
.plan--ec .ig-legend span.p::before { background: var(--cereja); border-color: var(--cereja); }
.ig-more { border-top: 1px solid var(--linha); padding-top: .9rem; }
.plan--full .ig-more { border-color: var(--linha-escura); }
.ig-more summary { cursor: pointer; font-weight: 600; font-size: .95rem; display: flex; justify-content: space-between; gap: 1rem; list-style: none; }
.ig-more summary::-webkit-details-marker { display: none; }
.ig-more summary::after { content: "+"; font-size: 1.3rem; line-height: 1; }
.ig-more[open] summary::after { content: "−"; }
.ig-more .front__list { margin-top: .9rem; font-size: .92rem; gap: .4rem; }
.ig-more summary:focus-visible { outline: 3px solid var(--cereja); outline-offset: 3px; }
.plan--full .ig-more summary:focus-visible { outline-color: var(--rosa); }

/* Comparativo */
.ig-cmp { width: 100%; border-collapse: collapse; background: var(--offwhite); border: 1.5px solid var(--grafite); }
.ig-cmp caption { text-align: left; padding: 0 0 1rem; color: var(--texto-suave); font-size: .92rem; caption-side: top; }
.ig-cmp th, .ig-cmp td { text-align: left; vertical-align: top; padding: 1rem 1.1rem; border-bottom: 1px solid var(--linha); font-size: .95rem; }
.ig-cmp thead th { background: var(--vinho); color: var(--offwhite); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; }
.ig-cmp tbody th { font-family: var(--font-display); font-size: 1.1rem; font-weight: 500; }
.ig-cmp td strong { font-size: 1.15rem; }
@media (max-width: 799px) {
  .ig-cmp, .ig-cmp tbody, .ig-cmp tr, .ig-cmp th, .ig-cmp td, .ig-cmp caption { display: block; }
  .ig-cmp thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .ig-cmp { border: 0; background: none; }
  .ig-cmp tr { border: 1.5px solid var(--grafite); border-radius: 6px; background: var(--offwhite); margin-bottom: 1rem; overflow: hidden; }
  .ig-cmp tbody th { background: var(--vinho); color: var(--offwhite); padding: .9rem 1.1rem; }
  .ig-cmp td { border-bottom: 1px solid var(--linha); }
  .ig-cmp td:last-child { border-bottom: 0; }
  .ig-cmp td::before { content: attr(data-label); display: block; font-size: .7rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--cereja); margin-bottom: .25rem; }
}

/* Processo e condições */
.ig-tag { display: inline-block; font-size: .72rem; font-weight: 600; color: var(--cereja); border: 1px solid var(--cereja); border-radius: 999px; padding: .05rem .7rem; margin-top: .5rem; }
.ig-cond { display: grid; gap: .9rem; grid-template-columns: 1fr; margin-top: 2rem; }
.ig-cond li { border-top: 1px solid var(--grafite); padding-top: .8rem; font-size: .96rem; }
.ig-two { display: grid; gap: clamp(2rem, 5vw, 3.5rem); align-items: start; }
.ig-two > * { min-width: 0; }
.ig-cta { margin-top: 1.75rem; }
@media (min-width: 700px) { .ig-cond { grid-template-columns: repeat(2, 1fr); gap: 1rem 3rem; } }
@media (min-width: 900px) { .ig-two { grid-template-columns: 1fr 1fr; } }
