/*
 * Orena Design System — fundação do SITE PÚBLICO (Fase 2).
 * Documentação: docs/orena/design-system/04-spacing-layout.md §Site público
 *
 * Usado SÓ pelo site público (templates/marketing/_base_site.html — SITE-RC1).
 * Nenhuma tela do app carrega este arquivo. Direção visual: dark mode
 * profissional, pouco ruído, sem glow — e sem estética gamer/cyberpunk
 * (nada de neon piscante, glitch ou WebGL).
 *
 * SITE-VIS-01F: o site NÃO tem identidade visual própria. Cor, marca, foco,
 * tipografia e cantos vêm dos tokens do Design System (orena.tokens.css),
 * os mesmos do app/login: acento = --orena-primary, foco = --orena-focus-ring,
 * cantos = escala --orena-radius-*. Nenhuma paleta paralela.
 *
 * Classes com prefixo `.o-site-`. Os únicos valores locais (`--site-*`) são
 * transparências derivadas de --orena-primary (o DS não tem token de fundo
 * suave do primário), escopadas em `.o-site` (SITE-01A, R4).
 * Sem transições/animações aqui: o site não depende de motion.
 */

.o-site {
    --site-primary-soft: rgba(0, 242, 255, 0.08);   /* --orena-primary a 8% */
    --site-primary-line: rgba(0, 242, 255, 0.35);   /* --orena-primary a 35% */
    margin: 0;
    min-height: 100vh;
    overflow-x: hidden;
    background: var(--orena-background);
    color: var(--orena-text-primary);
    font-family: var(--orena-font-family);
    line-height: var(--orena-line-height-normal);
}

/* Fundo com gradiente sutil (azul profundo → transparente), sem imagem. */
.o-site-gradient {
    background:
        radial-gradient(60% 50% at 20% 0%, rgba(0, 114, 255, 0.16) 0%, transparent 70%),
        radial-gradient(40% 40% at 90% 10%, rgba(0, 242, 255, 0.08) 0%, transparent 70%),
        var(--orena-background);
}

.o-site-container {
    width: 100%;
    max-width: var(--orena-container-max);
    margin: 0 auto;
    padding: 0 var(--orena-gutter);
}

.o-site-section { padding: var(--orena-section-spacing) 0; }
.o-site-section--tight { padding: calc(var(--orena-section-spacing) / 2) 0; }

/* Navbar flutuante: fixa no topo, destacada do conteúdo, com fundo
   translúcido. Mantém contraste mesmo sem suporte a backdrop-filter. */
.o-site-nav {
    position: sticky;
    top: var(--orena-space-3);
    z-index: var(--orena-z-sticky);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--orena-space-4);
    width: min(var(--orena-container-max), calc(100% - 2 * var(--orena-gutter)));
    margin: var(--orena-space-3) auto 0;
    padding: var(--orena-space-2) var(--orena-space-4);
    min-height: 56px;
    border: 1px solid var(--orena-border);
    border-radius: var(--orena-radius-lg);
    background: rgba(17, 19, 24, 0.92);
    box-shadow: var(--orena-shadow-md);
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .o-site-nav {
        background: rgba(17, 19, 24, 0.72);
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
    }
}
.o-site-nav__links {
    display: flex;
    gap: var(--orena-space-1);
    list-style: none;
    margin: 0;
    padding: 0;
}
.o-site-nav__link {
    display: inline-flex;
    align-items: center;
    min-height: var(--orena-hit-target);
    padding: 0 var(--orena-space-3);
    color: var(--orena-text-secondary);
    text-decoration: none;
    font-weight: var(--orena-font-weight-medium);
}
.o-site-nav__link:hover { color: var(--orena-text-primary); }
.o-site-nav__link:focus-visible { outline: var(--orena-focus-ring-width) solid var(--orena-focus-ring); outline-offset: 2px; }
@media (max-width: 767px) {
    .o-site-nav__links { display: none; }
}

/* Card glass/surface */
.o-site-glass {
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--orena-radius-lg);
    background: rgba(22, 25, 34, 0.9);
    padding: var(--orena-space-6);
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .o-site-glass {
        background: rgba(22, 25, 34, 0.6);
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
    }
}

/* Tipografia do hero */
.o-site-eyebrow {
    margin: 0 0 var(--orena-space-3);
    font-size: var(--orena-font-size-sm);
    font-weight: var(--orena-font-weight-semibold);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--orena-primary);
}
.o-site-hero-title {
    margin: 0;
    font-size: var(--orena-font-size-display);
    font-weight: var(--orena-font-weight-extrabold);
    line-height: 1.05;
    letter-spacing: -0.02em;
    color: var(--orena-text-primary);
    text-wrap: balance;
}
.o-site-hero-title__accent { color: var(--orena-primary); }
.o-site-hero-lead {
    margin: var(--orena-space-4) 0 0;
    max-width: 60ch;
    font-size: var(--orena-font-size-lg);
    line-height: var(--orena-line-height-relaxed);
    color: var(--orena-text-secondary);
}
@media (min-width: 1024px) {
    .o-site-hero-lead { font-size: var(--orena-font-size-xl); }
}
.o-site-highlight { color: var(--orena-success); }

/* ============================================================
 * SITE-RC1 — componentes do site público
 * ============================================================ */

.o-site *,
.o-site *::before,
.o-site *::after { box-sizing: border-box; }

.o-site-skip {
    position: absolute;
    left: var(--orena-space-4);
    top: -100px;
    z-index: calc(var(--orena-z-sticky) + 1);
    padding: var(--orena-space-2) var(--orena-space-4);
    background: var(--orena-primary);
    border-radius: var(--orena-radius-sm);
    color: var(--orena-on-primary);
    font-weight: var(--orena-font-weight-bold);
}
.o-site-skip:focus { top: var(--orena-space-2); }

.o-site-container--narrow { max-width: 760px; }

/* ---------- Navegação ---------- */
.o-site-brand {
    display: inline-flex;
    align-items: center;
    gap: var(--orena-space-3);
    min-height: var(--orena-hit-target-touch);
    color: var(--orena-text-primary);
    text-decoration: none;
}
.o-site-brand__mark { width: 32px; height: 32px; flex: none; }
.o-site-brand__mark svg { width: 100%; height: 100%; overflow: visible; }
/* Marca idêntica à do app (Auth Shell / sidebar): traço com o gradiente
   oficial do símbolo; o id do gradiente é o passado a logo_mark(). */
.o-site-nav .o-site-brand__mark path,
.o-site-nav .o-site-brand__mark circle { stroke: url(#gradSite); }
.o-site-footer .o-site-brand__mark path,
.o-site-footer .o-site-brand__mark circle { stroke: url(#gradSiteFooter); }
.o-site-brand__name {
    font-size: var(--orena-font-size-lg);
    font-weight: var(--orena-font-weight-extrabold);
    letter-spacing: 0.08em;
    white-space: nowrap;
}
.o-site-brand__name .orena-wordmark__primary { color: var(--orena-primary); }
.o-site-brand__name .orena-wordmark__secondary { color: var(--orena-text-primary); }
.o-site-nav__actions {
    display: flex;
    align-items: center;
    gap: var(--orena-space-2);
}
.o-site-nav__link[aria-current="page"] { color: var(--orena-text-primary); }

.o-site-menu { position: relative; display: block; }
/* Links inline só no desktop; abaixo disso ficam no menu compacto. */
.o-site-nav .o-site-nav__links { display: none; }
@media (min-width: 1024px) {
    .o-site-nav .o-site-nav__links { display: flex; }
    .o-site-menu { display: none; }
}
.o-site-menu > summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--orena-hit-target-touch);
    height: var(--orena-hit-target-touch);
    border: 1px solid var(--orena-border-strong);
    border-radius: var(--orena-radius-sm);
    color: var(--orena-text-primary);
    cursor: pointer;
    list-style: none;
}
.o-site-menu > summary::-webkit-details-marker { display: none; }
.o-site-menu > summary:focus-visible { outline: var(--orena-focus-ring-width) solid var(--orena-focus-ring); outline-offset: 2px; }
.o-site-menu__panel {
    position: absolute;
    right: 0;
    top: calc(100% + var(--orena-space-2));
    width: min(280px, calc(100vw - 2 * var(--orena-gutter)));
    /* Menu aberto em tela baixa (paisagem / 320x568): rola dentro do painel. */
    max-height: calc(100vh - 96px);
    overflow-y: auto;
    padding: var(--orena-space-2);
    border: 1px solid var(--orena-border-strong);
    border-radius: var(--orena-radius-md);
    background: var(--orena-surface);
    box-shadow: var(--orena-shadow-lg);
}
.o-site-menu__panel .o-site-nav__link { display: flex; width: 100%; min-height: var(--orena-hit-target-touch); }

/* Mobile: links, "Entrar" e o CTA da nav vão para o menu; o CTA principal
   continua no hero, logo abaixo. */
@media (max-width: 767px) {
    .o-site-nav__actions .o-site-btn { display: none; }
    .o-site-brand__name { font-size: var(--orena-font-size-md); }
}

/* ---------- Botões ---------- */
.o-site-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--orena-space-2);
    min-height: var(--orena-hit-target-touch);
    padding: 0 var(--orena-space-6);
    border: 1px solid transparent;
    border-radius: var(--orena-radius-sm);   /* mesmo canto do .o-btn do app */
    font-family: inherit;
    font-size: var(--orena-font-size-md);
    font-weight: var(--orena-font-weight-bold);
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}
.o-site-btn:focus-visible { outline: var(--orena-focus-ring-width) solid var(--orena-focus-ring); outline-offset: 2px; }
.o-site-btn--primary { background: var(--orena-primary); color: var(--orena-on-primary); }
.o-site-btn--primary:hover { background: var(--orena-primary-hover); }
.o-site-btn--secondary { border-color: var(--orena-border-control); color: var(--orena-text-primary); background: transparent; }
.o-site-btn--secondary:hover { border-color: var(--orena-primary); color: var(--orena-primary-hover); }
.o-site-btn--ghost { color: var(--orena-text-secondary); background: transparent; padding: 0 var(--orena-space-3); }
.o-site-btn--ghost:hover { color: var(--orena-text-primary); }
.o-site-btn--block { width: 100%; }
.o-site-btn[disabled] { opacity: 0.6; cursor: progress; }

/* ---------- Hero ---------- */
.o-site-hero { padding: var(--orena-space-16) 0 var(--orena-space-12); }
.o-site-hero__grid { display: grid; gap: var(--orena-space-10); align-items: center; }
@media (min-width: 1024px) {
    .o-site-hero { padding: var(--orena-space-24) 0 var(--orena-space-16); }
    .o-site-hero__grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--orena-space-16); }
}
.o-site-hero__actions { display: flex; flex-wrap: wrap; gap: var(--orena-space-3); margin-top: var(--orena-space-8); }
.o-site-hero__note { margin: var(--orena-space-4) 0 0; font-size: var(--orena-font-size-sm); color: var(--orena-text-muted); }
.o-site-hero__note a { color: var(--orena-text-secondary); text-underline-offset: 3px; }
@media (max-width: 767px) {
    .o-site-hero__actions .o-site-btn { width: 100%; }
}

/* Painel "um dia na operação" (fluxo real, sem dado inventado) */
.o-site-flow {
    margin: 0;
    padding: var(--orena-space-6);
    list-style: none;
    border: 1px solid var(--orena-border-strong);
    border-top: 3px solid var(--orena-primary);
    border-radius: var(--orena-radius-md);
    background: var(--orena-surface);
    counter-reset: o-site-flow;
}
.o-site-flow__title {
    margin: 0 0 var(--orena-space-4);
    font-size: var(--orena-font-size-sm);
    font-weight: var(--orena-font-weight-semibold);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--orena-text-secondary);
}
.o-site-flow__item {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: var(--orena-space-3);
    padding: var(--orena-space-3) 0;
    border-top: 1px solid var(--orena-border);
}
.o-site-flow__item:first-of-type { border-top: 0; }
.o-site-flow__icon { color: var(--orena-primary); font-size: 22px; }
.o-site-flow__item strong { display: block; color: var(--orena-text-primary); font-size: var(--orena-font-size-md); }
.o-site-flow__item span.o-site-flow__desc { display: block; color: var(--orena-text-secondary); font-size: var(--orena-font-size-sm); }

/* ---------- Seções ---------- */
.o-site-section--alt { background: var(--orena-surface-sunken); border-top: 1px solid var(--orena-border); border-bottom: 1px solid var(--orena-border); }
.o-site-section-head { max-width: 720px; margin-bottom: var(--orena-space-10); }
.o-site-section-title {
    margin: 0;
    font-size: clamp(24px, 2vw + 16px, 36px);
    font-weight: var(--orena-font-weight-extrabold);
    line-height: var(--orena-line-height-tight);
    letter-spacing: -0.01em;
    color: var(--orena-text-primary);
    text-wrap: balance;
}
.o-site-section-lead {
    margin: var(--orena-space-3) 0 0;
    font-size: var(--orena-font-size-lg);
    line-height: var(--orena-line-height-relaxed);
    color: var(--orena-text-secondary);
}

.o-site-grid { display: grid; gap: var(--orena-space-4); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .o-site-grid--2, .o-site-grid--3, .o-site-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) {
    .o-site-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .o-site-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.o-site-card {
    display: flex;
    flex-direction: column;
    gap: var(--orena-space-2);
    padding: var(--orena-space-6);
    border: 1px solid var(--orena-border);
    border-radius: var(--orena-radius-md);
    background: var(--orena-surface);
}
.o-site-card--plain { background: transparent; border-color: transparent; border-left: 2px solid var(--site-primary-line); border-radius: 0; padding: var(--orena-space-2) var(--orena-space-6); }
.o-site-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-bottom: var(--orena-space-2);
    border: 1px solid var(--site-primary-line);
    border-radius: var(--orena-radius-md);
    background: var(--site-primary-soft);
    color: var(--orena-primary);
}
.o-site-card__title { margin: 0; font-size: var(--orena-font-size-lg); font-weight: var(--orena-font-weight-bold); color: var(--orena-text-primary); }
.o-site-card__text { margin: 0; font-size: var(--orena-font-size-md); line-height: var(--orena-line-height-relaxed); color: var(--orena-text-secondary); }
.o-site-card__tags { display: flex; flex-wrap: wrap; gap: var(--orena-space-1) var(--orena-space-2); margin: var(--orena-space-2) 0 0; padding: 0; list-style: none; }
.o-site-card__tags li { font-size: var(--orena-font-size-xs); color: var(--orena-text-muted); }
.o-site-card__tags li + li::before { content: "·"; margin-right: var(--orena-space-2); color: var(--orena-border-control); }

.o-site-badge {
    align-self: flex-start;
    padding: 2px var(--orena-space-2);
    border: 1px solid var(--orena-border-strong);
    border-radius: var(--orena-radius-full);   /* badge: pill semântico do DS */
    font-size: var(--orena-font-size-xs);
    font-weight: var(--orena-font-weight-semibold);
    color: var(--orena-text-secondary);
}

.o-site-note {
    margin: var(--orena-space-8) 0 0;
    padding: var(--orena-space-4) var(--orena-space-5);
    border-left: 2px solid var(--orena-border-control);
    font-size: var(--orena-font-size-sm);
    line-height: var(--orena-line-height-relaxed);
    color: var(--orena-text-secondary);
}
.o-site-note strong { color: var(--orena-text-primary); }

/* Passos "como funciona" */
.o-site-steps { display: grid; gap: var(--orena-space-6); margin: 0; padding: 0; list-style: none; counter-reset: o-site-step; }
@media (min-width: 768px) { .o-site-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .o-site-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.o-site-step { counter-increment: o-site-step; padding-top: var(--orena-space-4); border-top: 1px solid var(--orena-border-strong); }
.o-site-step::before {
    content: counter(o-site-step, decimal-leading-zero);
    display: block;
    margin-bottom: var(--orena-space-2);
    font-size: var(--orena-font-size-sm);
    font-weight: var(--orena-font-weight-bold);
    font-variant-numeric: tabular-nums;
    color: var(--orena-primary);
}

/* ---------- Contato ---------- */
.o-site-contact { display: grid; gap: var(--orena-space-10); }
@media (min-width: 1024px) { .o-site-contact { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: var(--orena-space-16); } }
.o-site-contact__list { margin: var(--orena-space-6) 0 0; padding: 0; list-style: none; display: grid; gap: var(--orena-space-3); }
.o-site-contact__list li { display: flex; gap: var(--orena-space-3); color: var(--orena-text-secondary); }
.o-site-contact__list .material-symbols-outlined { color: var(--orena-primary); font-size: 20px; }

.o-site-form {
    display: grid;
    gap: var(--orena-space-4);
    padding: var(--orena-space-6);
    border: 1px solid var(--orena-border-strong);
    border-radius: var(--orena-radius-md);
    background: var(--orena-surface);
}
.o-site-field { display: grid; gap: var(--orena-space-1); }
.o-site-label { font-size: var(--orena-font-size-sm); font-weight: var(--orena-font-weight-semibold); color: var(--orena-text-primary); }
.o-site-label small { font-weight: var(--orena-font-weight-regular); color: var(--orena-text-muted); }
.o-site-input {
    width: 100%;
    min-height: var(--orena-hit-target-touch);
    padding: var(--orena-space-2) var(--orena-space-3);
    border: 1px solid var(--orena-border-control);
    border-radius: var(--orena-radius-sm);   /* mesmo canto do .o-input do app */
    background: var(--orena-surface-sunken);
    color: var(--orena-text-primary);
    font-family: inherit;
    font-size: var(--orena-font-size-lg);
}
.o-site-input:focus { outline: var(--orena-focus-ring-width) solid var(--orena-focus-ring); outline-offset: 0; border-color: var(--orena-primary); }
.o-site-input::placeholder { color: var(--orena-text-muted); }
.o-site-form__privacy { margin: 0; font-size: var(--orena-font-size-xs); line-height: var(--orena-line-height-normal); color: var(--orena-text-muted); }
.o-site-form__status { margin: 0; min-height: 1.5em; font-size: var(--orena-font-size-md); color: var(--orena-text-secondary); }
.o-site-form__status.is-ok { color: var(--orena-success); }
.o-site-form__status.is-erro { color: var(--orena-danger); }

a.o-site-link { color: var(--orena-primary); text-decoration: underline; text-underline-offset: 3px; }
a.o-site-link:hover { color: var(--orena-primary-hover); }
a.o-site-link:focus-visible { outline: var(--orena-focus-ring-width) solid var(--orena-focus-ring); outline-offset: 2px; }

/* WhatsApp: discreto, sem pulso (SITE-01A §8). SITE-VIS-01F: respeita a
   safe-area (iPhone com barra de gesto), fica ABAIXO da nav/menu aberto
   (z-index menor) e o rodapé reserva espaço para ele no fim da página. */
.o-site {
    --site-fab-size: 48px;
    --site-fab-gap: var(--orena-space-4);
}
.o-site-whatsapp {
    position: fixed;
    right: calc(var(--site-fab-gap) + env(safe-area-inset-right, 0px));
    bottom: calc(var(--site-fab-gap) + env(safe-area-inset-bottom, 0px));
    z-index: calc(var(--orena-z-sticky) - 1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--site-fab-size);
    height: var(--site-fab-size);
    border: 1px solid var(--orena-border-strong);
    border-radius: var(--orena-radius-md);
    background: var(--orena-surface-raised);
    color: var(--orena-text-primary);
    box-shadow: var(--orena-shadow-md);
    text-decoration: none;
}
.o-site-whatsapp:hover { border-color: var(--orena-primary); color: var(--orena-primary); }
.o-site-whatsapp:focus-visible { outline: var(--orena-focus-ring-width) solid var(--orena-focus-ring); outline-offset: 2px; }

/* ---------- Rodapé ---------- */
.o-site-footer { padding: var(--orena-space-12) 0 calc(var(--site-fab-size) + 2 * var(--site-fab-gap) + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--orena-border); background: var(--orena-surface-sunken); }
/* SITE-VIS-01F4: no mobile (breakpoint canônico 767px do DS) o botão não é overlay fixo — ele cobria
   conteúdo (ex.: "Um dia de operação"). O contato segue nos CTAs e no WhatsApp do rodapé. */
@media (max-width: 767px) {
    .o-site-whatsapp { display: none; }
    .o-site-footer { padding-bottom: calc(var(--orena-space-12) + env(safe-area-inset-bottom, 0px)); }
}
.o-site-footer__grid { display: grid; gap: var(--orena-space-8); }
@media (min-width: 768px) { .o-site-footer__grid { grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)); } }
.o-site-footer__tagline { margin: var(--orena-space-3) 0 0; color: var(--orena-text-secondary); }
.o-site-footer__by { margin: var(--orena-space-2) 0 0; font-size: var(--orena-font-size-sm); color: var(--orena-text-muted); }
.o-site-footer__by-mark { font-weight: var(--orena-font-weight-semibold); color: var(--orena-text-secondary); }
.o-site-footer__title { margin: 0 0 var(--orena-space-3); font-size: var(--orena-font-size-sm); font-weight: var(--orena-font-weight-semibold); letter-spacing: 0.08em; text-transform: uppercase; color: var(--orena-text-muted); }
.o-site-footer__links { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--orena-space-1); }
.o-site-footer__links a { display: inline-flex; align-items: center; min-height: 32px; color: var(--orena-text-secondary); text-decoration: none; }
.o-site-footer__links a:hover { color: var(--orena-text-primary); }
.o-site-footer__links a:focus-visible { outline: var(--orena-focus-ring-width) solid var(--orena-focus-ring); outline-offset: 2px; }
.o-site-footer__legal { margin: var(--orena-space-10) 0 0; padding-top: var(--orena-space-6); border-top: 1px solid var(--orena-border); font-size: var(--orena-font-size-sm); color: var(--orena-text-muted); }

/* ---------- Planos: Essencial / Gestão / Pro (SITE-VIS-01F) ----------
   Sem preço (SITE-01B P1). Plano = profundidade de gestão; segmento vem
   completo em qualquer plano. */
.o-site-plan { position: relative; }
.o-site-plan__head { display: grid; gap: var(--orena-space-1); }
.o-site-plan__name { margin: 0; font-size: var(--orena-font-size-sm); font-weight: var(--orena-font-weight-semibold); letter-spacing: 0.08em; text-transform: uppercase; color: var(--orena-text-secondary); }
.o-site-plan__name strong { color: var(--orena-primary); font-weight: var(--orena-font-weight-extrabold); }
.o-site-plan__lead { margin: 0; font-size: var(--orena-font-size-md); line-height: var(--orena-line-height-relaxed); color: var(--orena-text-secondary); }
.o-site-plan__includes { margin: var(--orena-space-3) 0 0; font-size: var(--orena-font-size-sm); font-weight: var(--orena-font-weight-semibold); color: var(--orena-text-primary); }
.o-site-plan__features { flex: 1; margin: var(--orena-space-2) 0 var(--orena-space-4); padding: 0; list-style: none; display: grid; gap: var(--orena-space-2); }
.o-site-plan__features li { display: flex; gap: var(--orena-space-2); font-size: var(--orena-font-size-md); color: var(--orena-text-secondary); }
.o-site-plan__features .material-symbols-outlined { flex: none; font-size: 18px; color: var(--orena-primary); }

/* Entrada do recomendador: hoje leva à conversa (formulário de contato);
   não existe rota pública de questionário (PLAN-03 é módulo sem tela). */
.o-site-finder {
    display: grid;
    gap: var(--orena-space-4);
    align-items: center;
    margin-top: var(--orena-space-10);
    padding: var(--orena-space-6);
    border: 1px solid var(--site-primary-line);
    border-radius: var(--orena-radius-md);
    background: var(--site-primary-soft);
}
@media (min-width: 768px) { .o-site-finder { grid-template-columns: minmax(0, 1fr) auto; } }
.o-site-finder__title { margin: 0; font-size: var(--orena-font-size-xl); font-weight: var(--orena-font-weight-bold); color: var(--orena-text-primary); }
.o-site-finder__text { margin: var(--orena-space-1) 0 0; color: var(--orena-text-secondary); line-height: var(--orena-line-height-relaxed); }
@media (max-width: 767px) { .o-site-finder .o-site-btn { width: 100%; } }