/* ============================================================
   TEMPLATE 19 — "Órbita" (fiel ao modelo 68 dos sites)
   Tokens do custom.css real (--orb-*): deep space, painéis de
   vidro, estrela #ecebf7, ouro champagne #e7b871, serifa Bodoni
   weight 400, mono nos rótulos. Botão dourado = TEXTO PRETO.
   A cor do cliente entra como acento (--orb-acento).
   ============================================================ */

:root {
    --orb-void: #04050c;
    --orb-space: #080b18;
    --orb-panel: #0d1226;
    --orb-panel2: #161d40;
    --orb-star: #ecebf7;
    --orb-muted: #9aa2c4;
    --orb-faint: #626a95;
    --orb-gold: #e7b871;
    --orb-gold-b: #f7dca4;
    --orb-gold-d: #d9a659;
    --orb-gold-soft: rgba(231, 184, 113, .14);
    --orb-line: rgba(231, 184, 113, .18);
    --orb-cool: rgba(154, 162, 196, .12);
    --orb-acento: var(--color-primary, #e7b871);
    --orb-serif: 'Bodoni Moda', 'Bodoni MT', 'Didot', Garamond, 'Times New Roman', serif;
    --orb-sans: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --orb-mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
    --orb-max: 1240px;
}

html {
    overflow-x: clip;
}

/* céu estrelado de verdade: tile SVG denso (estrelas brancas + douradas,
   algumas com brilho) repetindo sobre nebulosas e o void */
body {
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='520'%3E%3Cg fill='%23ecebf7'%3E%3Ccircle cx='24' cy='38' r='1.1' opacity='.7'/%3E%3Ccircle cx='88' cy='112' r='.8' opacity='.4'/%3E%3Ccircle cx='150' cy='52' r='1.4' opacity='.85'/%3E%3Ccircle cx='210' cy='150' r='.9' opacity='.45'/%3E%3Ccircle cx='268' cy='84' r='1.1' opacity='.6'/%3E%3Ccircle cx='330' cy='30' r='.8' opacity='.5'/%3E%3Ccircle cx='396' cy='96' r='1.5' opacity='.9'/%3E%3Ccircle cx='462' cy='58' r='.9' opacity='.4'/%3E%3Ccircle cx='40' cy='210' r='.9' opacity='.55'/%3E%3Ccircle cx='118' cy='262' r='1.3' opacity='.75'/%3E%3Ccircle cx='196' cy='226' r='.8' opacity='.35'/%3E%3Ccircle cx='300' cy='198' r='1' opacity='.65'/%3E%3Ccircle cx='372' cy='260' r='.8' opacity='.4'/%3E%3Ccircle cx='448' cy='204' r='1.2' opacity='.7'/%3E%3Ccircle cx='64' cy='330' r='1.4' opacity='.8'/%3E%3Ccircle cx='142' cy='388' r='.8' opacity='.45'/%3E%3Ccircle cx='232' cy='344' r='1' opacity='.6'/%3E%3Ccircle cx='314' cy='420' r='.9' opacity='.5'/%3E%3Ccircle cx='402' cy='356' r='1.3' opacity='.8'/%3E%3Ccircle cx='484' cy='318' r='.8' opacity='.4'/%3E%3Ccircle cx='30' cy='462' r='1' opacity='.6'/%3E%3Ccircle cx='176' cy='488' r='1.2' opacity='.7'/%3E%3Ccircle cx='356' cy='484' r='.8' opacity='.45'/%3E%3Ccircle cx='498' cy='448' r='1.1' opacity='.6'/%3E%3C/g%3E%3Cg fill='%23e7b871'%3E%3Ccircle cx='250' cy='20' r='1.3' opacity='.8'/%3E%3Ccircle cx='58' cy='140' r='1' opacity='.55'/%3E%3Ccircle cx='340' cy='132' r='1.2' opacity='.7'/%3E%3Ccircle cx='168' cy='170' r='.8' opacity='.5'/%3E%3Ccircle cx='430' cy='150' r='.9' opacity='.5'/%3E%3Ccircle cx='96' cy='300' r='1.1' opacity='.65'/%3E%3Ccircle cx='262' cy='282' r='1.4' opacity='.85'/%3E%3Ccircle cx='352' cy='312' r='.8' opacity='.45'/%3E%3Ccircle cx='210' cy='430' r='1' opacity='.6'/%3E%3Ccircle cx='452' cy='420' r='1.2' opacity='.75'/%3E%3C/g%3E%3Cg stroke='%23ecebf7' stroke-width='.6' opacity='.5'%3E%3Cpath d='M396 90 l0 12 M390 96 l12 0'/%3E%3Cpath d='M262 276 l0 12 M256 282 l12 0'/%3E%3C/g%3E%3C/svg%3E"),
        radial-gradient(900px 600px at 82% -5%, rgba(22, 29, 64, .55), transparent 70%),
        radial-gradient(700px 520px at 8% 40%, rgba(22, 29, 64, .35), transparent 70%),
        radial-gradient(800px 600px at 60% 100%, rgba(231, 184, 113, .06), transparent 70%),
        linear-gradient(180deg, var(--orb-space), var(--orb-void) 420px);
    background-attachment: fixed;
    color: var(--orb-star);
    font-family: var(--orb-sans);
    -webkit-font-smoothing: antialiased;
}

.orb-wrap {
    max-width: var(--orb-max);
    margin-inline: auto;
    padding-inline: clamp(20px, 5vw, 52px);
}

/* ---------- masthead (constelação) ---------- */
.orb-masthead {
    position: relative;
    border-bottom: 1px solid var(--orb-line);
    overflow: hidden;
}

.orb-estrelas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.orb-masthead__bar {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    padding-block: 24px;
}

.orb-marca {
    font-family: var(--orb-serif);
    font-weight: 400;
    font-size: clamp(1.25rem, 2.2vw, 1.6rem);
    letter-spacing: .02em;
    color: var(--orb-star);
}

.orb-tel {
    font-family: var(--orb-mono);
    font-size: .74rem;
    letter-spacing: .12em;
    color: var(--orb-gold);
    border: 1px solid var(--orb-line);
    border-radius: 100px;
    padding: 8px 16px;
    background: var(--orb-gold-soft);
}

/* ---------- kicker (eyebrow com traço, como no 68) ---------- */
.orb-kicker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin: 0 0 clamp(24px, 3.5vw, 44px);
    font-family: var(--orb-mono);
    font-size: .72rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--orb-gold);
}

.orb-kicker__dash {
    color: var(--orb-gold);
}

.orb-kicker__sep {
    color: var(--orb-faint);
}

/* ---------- página do imóvel ---------- */
.orb-imovel {
    padding: clamp(28px, 4.5vw, 56px) 0 clamp(30px, 4vw, 48px);
}

.orb-abertura {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: clamp(28px, 5vw, 64px);
    align-items: center;
    margin-bottom: clamp(30px, 4vw, 48px);
}

/* console de instrumentos: preços + leituras num painel de vidro */
.orb-console {
    background: rgba(13, 18, 38, .7);
    border: 1px solid var(--orb-cool);
    border-radius: 16px;
    padding: clamp(20px, 3vw, 30px);
    backdrop-filter: blur(6px);
}

.orb-console .orb-precos {
    padding-bottom: 16px;
    margin-bottom: 4px;
}

.orb-console .orb-stats {
    display: block;
    margin-top: 0;
}

.orb-console .orb-stat {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 14px;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--orb-cool);
    border-radius: 0;
    padding: 12px 2px;
    min-width: 0;
}

.orb-console .orb-stat:last-child {
    border-bottom: 0;
    padding-bottom: 2px;
}

.orb-console .orb-stat__n {
    font-size: 1.45rem;
}

.orb-console .orb-stat__l {
    margin-top: 0;
}

.orb-titulo {
    font-family: var(--orb-serif);
    font-weight: 400;
    font-size: clamp(2.1rem, 4.8vw, 3.8rem);
    line-height: 1.06;
    letter-spacing: .01em;
    margin: 0 0 clamp(18px, 2.6vw, 30px);
    color: var(--orb-star);
    text-wrap: balance;
}

.orb-precos {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 34px;
    padding-bottom: clamp(18px, 2.6vw, 26px);
    border-bottom: 1px solid var(--orb-line);
}

.orb-preco {
    font-family: var(--orb-serif);
    font-weight: 400;
    font-size: clamp(1.7rem, 3.6vw, 2.7rem);
    line-height: 1.05;
    margin: 0;
    color: var(--orb-gold);
}

.orb-preco--sec {
    font-size: clamp(1.2rem, 2.2vw, 1.7rem);
    color: var(--orb-muted);
}

.orb-preco em {
    display: block;
    font-style: normal;
    font-family: var(--orb-mono);
    font-size: .6rem;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--orb-faint);
    margin-top: 7px;
}

/* stats: painéis de vidro */
.orb-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 20px;
}

.orb-stat {
    background: rgba(13, 18, 38, .7);
    border: 1px solid var(--orb-cool);
    border-radius: 14px;
    padding: 14px 20px;
    min-width: 96px;
}

.orb-stat__n {
    display: block;
    font-family: var(--orb-serif);
    font-weight: 400;
    font-size: 1.7rem;
    color: var(--orb-star);
    line-height: 1.1;
}

.orb-stat__l {
    display: block;
    font-family: var(--orb-mono);
    font-size: .6rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--orb-muted);
    margin-top: 4px;
}

/* CTA dourado: SEMPRE texto preto (regra do 68) */
.orb-btn {
    display: inline-block;
    margin-top: clamp(22px, 3vw, 32px);
    padding: 15px 32px;
    font-size: .76rem;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: #0b0a12;
    background: linear-gradient(180deg, var(--orb-gold-b), var(--orb-gold));
    border-radius: 12px;
    box-shadow: 0 14px 34px -16px rgba(231, 184, 113, .55);
    text-decoration: none;
    transition: transform .18s, box-shadow .18s;
}

.orb-btn:hover {
    color: #0b0a12;
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 18px 40px -16px rgba(231, 184, 113, .65);
}

/* ---------- molduras de foto (scrim no rodapé, como o card do 68) ---------- */
.orb-moldura {
    position: relative;
    margin: 0;
    border: 1px solid var(--orb-cool);
    border-radius: 14px;
    overflow: hidden;
    background: var(--orb-panel);
    transition: border-color .2s, transform .2s;
}

.orb-moldura::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 62%, rgba(4, 5, 12, .62));
    pointer-events: none;
}

.orb-moldura:hover {
    border-color: var(--orb-line);
    transform: translateY(-3px);
}

.orb-moldura a {
    display: block;
}

.orb-moldura img {
    width: 100%;
    display: block;
    object-fit: cover;
    background: var(--orb-panel2);
}

.orb-moldura figcaption {
    position: absolute;
    left: 14px;
    bottom: 10px;
    z-index: 1;
    font-family: var(--orb-mono);
    font-size: .64rem;
    letter-spacing: .2em;
    color: var(--orb-gold-b);
}

/* capa panorâmica full-width, cinema espacial */
.orb-capa {
    margin-bottom: clamp(36px, 5vw, 60px);
}

.orb-capa img {
    aspect-ratio: 21 / 9;
    max-height: 560px;
}

/* ---------- texto ---------- */
.orb-texto {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: clamp(24px, 5vw, 60px);
    padding-block: clamp(28px, 4.5vw, 52px);
    border-top: 1px solid var(--orb-cool);
}

.orb-olho {
    align-self: start;
    font-family: var(--orb-serif);
    font-weight: 400;
    font-style: italic;
    font-size: clamp(1.2rem, 2.1vw, 1.6rem);
    line-height: 1.4;
    color: var(--orb-gold-b);
    margin: 0;
    padding-left: 18px;
    border-left: 1px solid var(--orb-gold);
}

.orb-corpo {
    font-size: .98rem;
    line-height: 1.8;
    color: var(--orb-muted);
    max-width: 62ch;
}

.orb-corpo p {
    margin: 0 0 14px;
}

/* lição do 68: o editor do CRM injeta <strong style="color:rgb(16,24,40)">
   (quase preto) — no fundo escuro o negrito sumia. Força claro. */
.orb-corpo strong,
.orb-corpo b {
    color: var(--orb-star) !important;
}

.orb-corpo span,
.orb-corpo font,
.orb-corpo em,
.orb-corpo li {
    color: inherit !important;
}

/* ---------- cabeçalho de seção ---------- */
.orb-sec-head {
    display: flex;
    align-items: baseline;
    gap: 16px;
    margin-bottom: clamp(22px, 3.2vw, 38px);
}

.orb-sec-title {
    font-family: var(--orb-serif);
    font-weight: 400;
    font-size: clamp(1.6rem, 3.2vw, 2.5rem);
    line-height: 1.1;
    margin: 0;
    color: var(--orb-star);
}

.orb-sec-rule {
    flex: 1 1 auto;
    height: 1px;
    background: var(--orb-line);
}

.orb-sec-count {
    font-family: var(--orb-mono);
    font-size: .66rem;
    letter-spacing: .2em;
    color: var(--orb-gold);
    white-space: nowrap;
}

/* ---------- ensaio ---------- */
.orb-ensaio {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: clamp(16px, 2.2vw, 28px);
    margin-bottom: clamp(36px, 5vw, 60px);
}

.orb-ensaio__item {
    grid-column: span 3;
}

.orb-ensaio__item.is-lg { grid-column: span 6; }
.orb-ensaio__item.is-md { grid-column: span 3; }
.orb-ensaio__item.is-sm { grid-column: span 2; }

.orb-ensaio__item img { aspect-ratio: 3 / 2; }
.orb-ensaio__item.is-lg img { aspect-ratio: 21 / 9; }
.orb-ensaio__item.is-sm img { aspect-ratio: 4 / 5; }

/* ---------- vídeo / instagram ---------- */
.orb-video {
    margin-bottom: clamp(36px, 5vw, 60px);
    background: transparent;
}

.orb-video iframe {
    max-width: 100%;
    border-radius: 14px;
}

/* ---------- características ---------- */
.orb-cattit {
    font-family: var(--orb-mono);
    font-size: .64rem;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--orb-faint);
    margin: 20px 0 10px;
}

.orb-tags {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 clamp(24px, 3.5vw, 40px);
    padding: 0;
}

.orb-tags li {
    background: rgba(13, 18, 38, .7);
    border: 1px solid var(--orb-cool);
    border-radius: 100px;
    padding: 8px 16px;
    font-size: .84rem;
    color: var(--orb-muted);
}

/* ---------- detalhes (componente compartilhado) no traje Órbita ---------- */
.orb .lp-det__wrap {
    max-width: none;
    padding-inline: 0;
}

.orb .lp-det__titulo {
    font-family: var(--orb-serif);
    font-weight: 400;
    font-size: clamp(1.6rem, 3.2vw, 2.5rem);
    color: var(--orb-star);
}

.orb .lp-det__item {
    border-bottom: 1px solid var(--orb-cool);
}

.orb .lp-det__item dt {
    font-family: var(--orb-mono);
    font-size: .64rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--orb-muted);
    opacity: 1;
}

.orb .lp-det__item dd {
    font-family: var(--orb-serif);
    font-weight: 400;
    font-size: 1.1rem;
    color: var(--orb-star);
}

.orb .lp-det__pin {
    color: var(--orb-gold);
    opacity: 1;
}

/* ---------- contato (console de vidro, form escuro do 68) ---------- */
.orb-contato {
    padding: clamp(40px, 6vw, 76px) 0;
    border-top: 1px solid var(--orb-line);
    background: linear-gradient(180deg, rgba(13, 18, 38, .4), transparent);
}

.orb-form-card {
    max-width: 640px;
    margin-inline: auto;
    background: rgba(13, 18, 38, .75);
    border: 1px solid var(--orb-cool);
    border-radius: 16px;
    padding: clamp(24px, 4vw, 44px);
    backdrop-filter: blur(6px);
}

.orb-form-titulo {
    font-family: var(--orb-serif);
    font-weight: 400;
    font-size: clamp(1.5rem, 2.8vw, 2rem);
    text-align: center;
    margin: 0 0 20px;
    color: var(--orb-star);
}

.orb-contato .form-control,
.orb-contato input,
.orb-contato textarea,
.orb-contato select {
    background: rgba(4, 6, 16, .6);
    border: 1px solid var(--orb-cool);
    border-radius: 10px;
    padding: 10px 14px;
    color: var(--orb-star);
    box-shadow: none;
}

.orb-contato .form-control:focus,
.orb-contato input:focus,
.orb-contato textarea:focus {
    outline: none;
    border-color: var(--orb-gold);
    background: rgba(4, 6, 16, .6);
    color: var(--orb-star);
    box-shadow: none;
}

.orb-contato ::placeholder {
    color: var(--orb-faint);
}

.orb-contato label {
    font-family: var(--orb-mono);
    font-size: .62rem;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--orb-muted);
}

.orb-contato button,
.orb-contato .btn,
.orb-contato input[type=submit] {
    display: inline-block;
    margin-top: 16px;
    padding: 14px 30px;
    font-size: .76rem;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: #0b0a12;
    background: linear-gradient(180deg, var(--orb-gold-b), var(--orb-gold));
    border: 0;
    border-radius: 12px;
    box-shadow: 0 14px 34px -16px rgba(231, 184, 113, .55);
    transition: transform .18s;
}

.orb-contato button:hover,
.orb-contato .btn:hover,
.orb-contato input[type=submit]:hover {
    color: #0b0a12;
    transform: translateY(-2px);
}

/* ---------- fecho ---------- */
.orb-fecho {
    margin-top: clamp(36px, 5vw, 56px);
    border-top: 1px solid var(--orb-line);
    padding: 24px 0 32px;
}

.orb-fecho .orb-wrap {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    font-family: var(--orb-mono);
    font-size: .7rem;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--orb-muted);
}

.orb-fecho__ref {
    color: var(--orb-faint);
}

.orb-fecho__estrela {
    margin-left: auto;
    color: var(--orb-gold);
    font-size: 1rem;
}

/* ---------- colofão ---------- */
.orb-colofao {
    background: var(--orb-panel);
    border-top: 1px solid var(--orb-cool);
    color: var(--orb-muted);
    text-align: center;
    padding: 30px 15px 44px;
}

.orb-colofao__logo {
    max-height: 52px;
    max-width: 190px;
    object-fit: contain;
    background: #fff;
    border-radius: 10px;
    padding: 7px 12px;
    margin-bottom: 12px;
}

.orb-colofao__marca {
    font-family: var(--orb-serif);
    font-weight: 400;
    font-size: 1.3rem;
    color: var(--orb-star);
    margin-bottom: 10px;
}

.orb-colofao__linha {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px 24px;
    font-family: var(--orb-mono);
    font-size: .66rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.orb-colofao__end {
    font-style: normal;
    font-size: .85rem;
    margin-bottom: 12px;
}

.orb-colofao__privacy {
    font-family: var(--orb-mono);
    font-size: .64rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--orb-gold);
    text-decoration: underline;
}

.orb-colofao__privacy:hover {
    color: var(--orb-gold-b);
}

/* ---------- whatsapp flutuante ---------- */
.orb-wpp {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 50;
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(180deg, var(--orb-gold-b), var(--orb-gold));
    color: #0b0a12;
    font-size: 26px;
    box-shadow: 0 14px 34px -16px rgba(231, 184, 113, .55);
    transition: transform .18s;
}

.orb-wpp:hover {
    color: #0b0a12;
    transform: translateY(-3px);
}

/* ---------- responsivo (899 / 559) ---------- */
@media (max-width: 899px) {
    .orb-abertura,
    .orb-texto {
        grid-template-columns: 1fr;
    }

    .orb-capa img {
        aspect-ratio: 16 / 10;
    }

    .orb-ensaio__item.is-sm {
        grid-column: span 3;
    }
}

@media (max-width: 559px) {
    .orb-ensaio {
        grid-template-columns: 1fr;
    }

    .orb-ensaio__item,
    .orb-ensaio__item.is-lg,
    .orb-ensaio__item.is-md,
    .orb-ensaio__item.is-sm {
        grid-column: span 1;
    }

    .orb-ensaio__item img,
    .orb-ensaio__item.is-lg img,
    .orb-ensaio__item.is-sm img {
        aspect-ratio: 4 / 3;
    }

    .orb-sec-head {
        flex-wrap: wrap;
        gap: 10px;
    }

    .orb-sec-rule {
        display: none;
    }
}

/* ---------- movimento reduzido ---------- */
@media (prefers-reduced-motion: reduce) {
    .orb-moldura,
    .orb-btn {
        transition: none;
    }
}

/* ---------- impressão ---------- */
@media print {
    .orb-wpp,
    .orb-btn,
    .orb-contato,
    .orb-estrelas {
        display: none !important;
    }

    body {
        background: #fff;
        color: #111;
    }
}
