:root {
    /* Paleta editorial cálida — bone / tinta / terracota */
    --bg: #f6f1e9;          /* fondo bone/crema */
    --bg-band: #efe7d8;     /* banda cálida más profunda */
    --surface: #fffdf9;     /* tarjetas */
    --ink: #1c1714;         /* negro cálido: titulares y texto */
    --muted: #6b5e4f;       /* taupe secundario */
    --line: #e4d9c7;        /* hairline beige */
    --accent: #b5451f;      /* terracota: único acento */
    --accent-deep: #97380f; /* terracota oscuro (hover/activo) */
    --accent-soft: #f3e3d8; /* tinte terracota (badges/fondos) */
    --espresso: #241c17;    /* bloques oscuros: portada, footer, CTA */
    --espresso-2: #33271f;
    --forest: #3c5141;      /* verde sobrio: señales positivas */

    /* Alias de compatibilidad con el CSS existente */
    --navy: #241c17;
    --navy-2: #33271f;
    --turquoise: #b5451f;
    --soft: #efe7d8;
    --white: #fffdf9;
    --shadow: 0 20px 48px rgba(40, 28, 18, .10);

    /* Tipografía editorial */
    --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
    --font-sans: 'Public Sans', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
    --font-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: var(--font-sans);
    font-size: 17px;
    line-height: 1.65;
    color: var(--ink);
    background: var(--bg);
    font-feature-settings: 'tnum' 1, 'lnum' 1, 'ss01' 1;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

a {
    color: inherit;
    text-decoration: none;
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px clamp(20px, 4vw, 54px);
    background: rgba(255, 255, 255, .92);
    border-bottom: 1px solid rgba(228, 217, 199, .8);
    backdrop-filter: blur(16px);
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    font-weight: 800;
    color: var(--navy);
}

.brand-word {
    letter-spacing: -0.015em;
}

.brand-o {
    color: var(--accent);
}

.brand-tld {
    color: var(--muted);
    font-weight: 700;
}

.brand-mark {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    background: var(--espresso);
    border-radius: 10px;
    box-shadow: inset 0 0 0 1px rgba(243, 227, 216, .08);
}

.brand-mark svg {
    display: block;
}

.topnav {
    display: flex;
    align-items: center;
    gap: 22px;
    color: var(--muted);
    font-size: 14px;
}

.nav-cta {
    color: var(--navy);
    font-weight: 700;
}

.hero {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(340px, .72fr);
    gap: clamp(28px, 5vw, 64px);
    align-items: center;
    min-height: calc(100vh - 76px);
    padding: clamp(48px, 7vw, 96px) clamp(20px, 5vw, 72px);
    background:
        radial-gradient(120% 95% at 100% 0%, var(--bg-band) 0%, transparent 58%),
        var(--bg);
    color: var(--ink);
    border-bottom: 1px solid var(--line);
}

.hero h1 {
    max-width: 820px;
    margin: 14px 0 20px;
    font-size: clamp(46px, 6.6vw, 88px);
    font-weight: 500;
    line-height: .98;
    letter-spacing: -0.02em;
}

.hero p {
    max-width: 640px;
    color: var(--muted);
    font-size: 19px;
    line-height: 1.6;
}

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--turquoise);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

/* Informe: la etiqueta de sección deja de ser el kicker terracota repetido y
   pasa a una regla editorial (label + hairline). Tratamiento de documento. */
.report .eyebrow {
    display: flex;
    width: 100%;
    gap: 14px;
    margin-bottom: 16px;
    color: var(--muted);
    font-family: var(--font-mono);
    font-weight: 600;
    letter-spacing: .14em;
}
.report .eyebrow::after {
    content: "";
    flex: 1;
    align-self: center;
    height: 1px;
    background: var(--line);
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 20px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-weight: 800;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.btn:hover {
    transform: translateY(-1px);
}

.btn-primary {
    color: #fff;
    background: var(--accent);
    box-shadow: 0 10px 26px rgba(181, 69, 31, .22);
}

.btn-primary:hover {
    background: var(--accent-deep);
}

.btn-ghost {
    color: var(--navy);
    background: var(--white);
    border-color: var(--line);
}

.hero .btn-ghost {
    color: var(--ink);
    background: var(--surface);
    border-color: var(--line);
}

.hero-actions,
.wizard-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-top: 30px;
}
.wizard-actions .btn-primary {
    margin-left: auto;
}

.hero-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
}

.hero-trust li {
    padding: 8px 14px;
    color: var(--ink);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
}

.hero-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    max-width: 620px;
    margin-top: 42px;
}

.hero-panel,
.metric-card,
.chart-card,
.notice-card,
.form-shell,
.cover-card,
.report-section {
    background: var(--white);
    border: 1px solid rgba(228, 217, 199, .9);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.hero-metrics div {
    padding: 14px 0 0;
    color: var(--ink);
    background: none;
    border-top: 2px solid var(--line);
}

.hero-metrics span {
    color: var(--muted);
}

.hero-metrics strong {
    display: block;
    font-size: 28px;
}

.hero-metrics span {
    color: var(--muted);
    font-size: 13px;
}

.hero-panel {
    padding: 24px;
    color: var(--ink);
}

.valuation-card {
    align-self: stretch;
}

.mini-report-header {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    color: var(--muted);
    font-size: 13px;
}

.price-card {
    margin: 22px 0;
    padding: 22px;
    background: var(--soft);
    border-radius: 8px;
}

.price-card span,
.metric-card span,
.cover-card span,
.demo-grid span {
    display: block;
    color: var(--muted);
    font-size: 13px;
}

.price-card strong,
.metric-card strong,
.cover-card strong {
    display: block;
    margin: 6px 0;
    color: var(--navy);
    font-size: 32px;
    line-height: 1.05;
}

.signal-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.signal-grid span {
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--muted);
    font-size: 13px;
}

.signal-grid b {
    display: block;
    color: var(--navy);
    margin-top: 3px;
}

.sparkline {
    height: 92px;
    margin-top: 20px;
}

.valuation-flow {
    display: grid;
    gap: 14px;
    margin-top: 22px;
}

.valuation-flow div {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 4px 12px;
    align-items: start;
    padding: 16px;
    background: var(--soft);
    border: 1px solid var(--line);
    border-radius: 8px;
}

.valuation-flow span {
    grid-row: span 2;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    color: var(--navy);
    background: rgba(181, 69, 31,.18);
    border-radius: 50%;
    font-weight: 900;
}

.valuation-flow strong {
    color: var(--navy);
}

.valuation-flow small {
    color: var(--muted);
    line-height: 1.4;
}

.panel-link {
    display: flex;
    justify-content: center;
    margin-top: 18px;
    padding: 14px;
    color: var(--navy);
    background: var(--turquoise);
    border-radius: 8px;
    font-weight: 900;
}

.section-band,
.form-section {
    padding: clamp(54px, 7vw, 88px) clamp(20px, 5vw, 72px);
    background: var(--white);
}

.section-band.soft {
    background: var(--soft);
}

.section-heading {
    max-width: 760px;
    margin-bottom: 28px;
}

.section-heading h2 {
    margin: 10px 0 0;
    color: var(--navy);
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1.04;
}

.section-heading.compact h2 {
    font-size: 28px;
}

.feature-grid,
.process-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.feature-grid article,
.process-grid article {
    padding: 24px 0 0;
    border: none;
    border-top: 1px solid var(--line);
    border-radius: 0;
    background: none;
}

/* Feature card: icono a la izquierda, al lado del título (no encima) */
.feature-grid article {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 16px;
    row-gap: 0;
    align-items: start;
}

.feature-grid .icon {
    grid-column: 1;
    grid-row: 1 / 3;
    align-self: start;
    width: auto;
    height: auto;
    margin-bottom: 0;
    background: none;
    border-radius: 0;
}

.feature-grid .icon svg {
    width: 28px;
    height: 28px;
}

.feature-grid h3 {
    grid-column: 2;
    grid-row: 1;
    margin: 0 0 6px;
    align-self: center;
}

.feature-grid p {
    grid-column: 2;
    grid-row: 2;
    margin: 0;
}

.icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    margin-bottom: 16px;
    color: var(--accent);
    background: rgba(181, 69, 31, .12);
    border-radius: 10px;
}

.icon svg {
    width: 23px;
    height: 23px;
}

.feature-grid h3,
.process-grid h3 {
    margin: 0 0 10px;
    color: var(--navy);
}

.feature-grid p,
.process-grid p,
.workflow p,
.form-intro p,
.market-position p,
.disclaimer p {
    color: var(--muted);
    line-height: 1.6;
}

.process-grid {
    grid-template-columns: repeat(4, 1fr);
}

.process-grid article {
    background: none;
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 14px;
    row-gap: 0;
    align-items: start;
}

.process-grid article > span {
    grid-column: 1;
    grid-row: 1 / 3;
    align-self: start;
    display: inline-flex;
    margin-bottom: 0;
    color: var(--accent);
    font-family: var(--font-display);
    font-size: 44px;
    font-weight: 600;
    line-height: .85;
}

.process-grid h3 {
    grid-column: 2;
    grid-row: 1;
    margin: 0 0 6px;
    align-self: start;
}

.process-grid p {
    grid-column: 2;
    grid-row: 2;
    margin: 0;
}

.decision-section {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, .7fr);
    gap: 30px;
    align-items: center;
    padding: clamp(54px, 7vw, 88px) clamp(20px, 5vw, 72px);
    color: var(--white);
    background: var(--navy);
}

.decision-section h2 {
    max-width: 760px;
    margin: 10px 0 0;
    font-size: clamp(32px, 4vw, 54px);
    line-height: 1.02;
    color: var(--white);
}

.decision-section .eyebrow {
    color: #e7a983;
}

.decision-list {
    display: grid;
    gap: 20px;
}

.decision-list p {
    margin: 0;
    color: rgba(255,255,255,.76);
    font-size: 18px;
    line-height: 1.55;
}

.workflow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.steps-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.steps-preview span,
.badge,
.cover-badges span {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 11px;
    color: var(--navy);
    background: rgba(181, 69, 31, .14);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.form-section {
    background: linear-gradient(180deg, var(--white), var(--soft));
}

.form-shell {
    display: grid;
    grid-template-columns: .72fr 1.28fr;
    gap: 32px;
    max-width: 1160px;
    margin: 0 auto;
    padding: clamp(24px, 4vw, 42px);
}

.form-intro h2 {
    margin: 10px 0;
    color: var(--navy);
    font-size: 38px;
    line-height: 1.05;
}

.form-benefits {
    display: grid;
    gap: 8px;
    margin-top: 18px;
}

.form-benefits span {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--navy);
    font-size: 13px;
    font-weight: 800;
}

.form-benefits span::before {
    content: "";
    width: 9px;
    height: 9px;
    background: var(--turquoise);
    border-radius: 50%;
}

.lead-summary {
    display: grid;
    gap: 11px;
    margin-top: 26px;
}

.lead-summary div {
    padding: 14px;
    background: var(--soft);
    border: 1px solid var(--line);
    border-radius: 8px;
}

.lead-summary span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.lead-summary strong {
    display: block;
    margin-top: 4px;
    color: var(--navy);
    font-size: 15px;
    line-height: 1.25;
}

.wizard fieldset {
    display: none;
    min-height: 150px;
    margin: 0;
    padding: 0;
    border: 0;
}

.wizard fieldset.active {
    display: block;
    animation: fadeIn .22s ease;
}

.wizard legend {
    margin-bottom: 18px;
    color: var(--navy);
    font-size: 22px;
    font-weight: 800;
}

.wizard-progress {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    margin-bottom: 22px;
}

.wizard-progress span {
    position: relative;
    height: 6px;
    background: #e4d9c7;
    border-radius: 999px;
}

.wizard-progress span.active {
    background: var(--turquoise);
}

.wizard-progress b {
    position: absolute;
    top: 12px;
    left: 0;
    color: var(--muted);
    font-size: 11px;
    white-space: nowrap;
}

.field-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    padding-top: 16px;
}

.compact-grid {
    padding-top: 0;
    margin-bottom: 18px;
}

.conditional-field {
    display: none;
}

.conditional-field.active {
    display: grid;
}

label {
    display: grid;
    gap: 7px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

label small {
    color: var(--muted);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.35;
}

.wide {
    grid-column: 1 / -1;
}

input,
select {
    width: 100%;
    min-height: 48px;
    padding: 0 13px;
    border: 1px solid #e4d9c7;
    border-radius: 8px;
    color: var(--ink);
    background: var(--white);
    font: inherit;
    font-weight: 500;
    outline: none;
}

input:focus,
select:focus {
    border-color: var(--turquoise);
    box-shadow: 0 0 0 4px rgba(181, 69, 31, .12);
}

.invalid {
    border-color: #d94747;
}

.address-field {
    position: relative;
}

.address-suggestions {
    position: absolute;
    z-index: 12;
    top: 76px;
    left: 0;
    right: 0;
    display: none;
    overflow: hidden;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.address-suggestions.active {
    display: block;
}

.address-suggestions button {
    display: block;
    width: 100%;
    padding: 12px 14px;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: var(--white);
    color: var(--ink);
    text-align: left;
    cursor: pointer;
}

.address-suggestions button:hover {
    background: var(--soft);
}

.address-suggestions strong,
.address-suggestions span {
    display: block;
}

.address-suggestions span {
    margin-top: 3px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
}

.address-inline-status {
    min-height: 20px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
}

.address-inline-status.checking {
    color: var(--muted);
}

.address-inline-status.ok {
    color: #3c5141;
}

.address-inline-status.warn {
    color: #9a6500;
}

.toggle-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 22px;
}

.toggle-grid label,
.legal-check {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--soft);
}

.toggle-grid input,
.legal-check input {
    width: 18px;
    min-height: 18px;
    accent-color: var(--turquoise);
}

.hidden {
    display: none !important;
}

.analysis-overlay {
    position: fixed;
    inset: 0;
    z-index: 50;
    display: none;
    place-items: center;
    padding: 22px;
    background: rgba(6, 31, 48, .78);
    backdrop-filter: blur(14px);
}

.analysis-overlay.active {
    display: grid;
}

.analysis-overlay > div {
    width: min(520px, 100%);
    padding: 32px;
    color: var(--white);
    background: linear-gradient(135deg, var(--navy), var(--navy-2));
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 8px;
    box-shadow: 0 28px 80px rgba(0,0,0,.28);
}

.analysis-overlay strong {
    display: block;
    margin-top: 18px;
    font-size: 26px;
    line-height: 1.1;
}

.analysis-overlay p,
.analysis-overlay li {
    color: rgba(255,255,255,.76);
}

.analysis-overlay ol {
    display: grid;
    gap: 8px;
    margin: 18px 0 0;
    padding-left: 20px;
}

.loader-ring {
    display: block;
    width: 46px;
    height: 46px;
    border: 4px solid rgba(255,255,255,.2);
    border-top-color: var(--turquoise);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

.site-footer {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 28px clamp(20px, 5vw, 72px);
    color: var(--muted);
    background: #241c17;
    font-size: 13px;
}

.site-footer strong {
    display: block;
    color: var(--white);
    margin-bottom: 4px;
}

.report {
    max-width: 1240px;
    margin: 0 auto;
    padding: 26px 20px 70px;
}

.report-toolbar {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 18px;
}

.report-toolbar form {
    margin: 0;
}

.report-cover {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, .58fr);
    gap: 26px;
    align-items: stretch;
    padding: clamp(30px, 5vw, 54px);
    color: var(--white);
    background: var(--espresso);
    border-radius: 8px;
}
.report-cover .report-cover-bg img {
    object-position: center 46%;
}
.report-cover::before {        /* velo espresso para legibilidad sobre la foto */
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(102deg, rgba(28, 20, 14, .93) 0%, rgba(28, 20, 14, .80) 42%, rgba(28, 20, 14, .56) 100%),
        linear-gradient(to bottom, rgba(28, 20, 14, .18), rgba(28, 20, 14, .5));
}
.report-cover::after {         /* grano de película */
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background-image: var(--grain);
    background-size: 200px 200px;
    opacity: .08;
    mix-blend-mode: soft-light;
}
.report-cover > .cover-copy,
.report-cover > .cover-card {
    position: relative;
    z-index: 2;
}
.report-cover .cover-badges span {
    color: rgba(255, 252, 247, .92);
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .2);
}

.report-cover h1 {
    max-width: 760px;
    margin: 10px 0 16px;
    color: var(--white);
    font-size: clamp(38px, 5vw, 62px);
    line-height: 1;
}

.report-cover p {
    color: rgba(255,255,255,.76);
    font-size: 18px;
}

.cover-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 28px;
}

.badge-ok {
    background: rgba(181, 69, 31, .22) !important;
}

.badge-warn {
    color: #7a4b00 !important;
    background: #fff0c2 !important;
}

.address-check {
    max-width: 760px;
    margin-top: 18px;
    padding: 15px 16px;
    color: rgba(255,255,255,.78);
    background: rgba(255,255,255,.09);
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 8px;
}

.address-check strong,
.address-check span {
    display: block;
}

.address-check strong {
    color: var(--white);
    margin-bottom: 5px;
}

.cover-features {
    margin-top: -8px;
    color: rgba(255,255,255,.68) !important;
    font-size: 14px !important;
}

.cover-card {
    padding: 24px;
    align-self: stretch;
}

.cover-card hr {
    border: 0;
    border-top: 1px solid var(--line);
    margin: 20px 0;
}

.report-section {
    margin-top: 22px;
    padding: clamp(22px, 4vw, 34px);
}

.executive-section {
    background: linear-gradient(135deg, #ffffff, #f3e3d8);
}

.executive-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.executive-grid article {
    padding: 20px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 8px;
}

.executive-grid span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.executive-grid strong {
    display: block;
    margin: 8px 0;
    color: var(--navy);
    font-size: 28px;
}

.executive-grid p {
    margin: 0;
    color: var(--muted);
    line-height: 1.5;
}

.valuation-grid,
.demo-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.metric-card {
    padding: 22px;
    box-shadow: none;
}

.metric-card.turquoise {
    background: var(--accent-soft);
    border-color: #e7cdbd;
}

.bar {
    height: 10px;
    overflow: hidden;
    background: #ece2d2;
    border-radius: 999px;
}

.bar i,
.bar-grid em {
    display: block;
    height: 100%;
    background: var(--turquoise);
    border-radius: 999px;
}

.market-position {
    display: grid;
    grid-template-columns: .7fr 1.3fr;
    gap: 24px;
    align-items: center;
    margin: 24px 0;
    padding: 22px;
    background: var(--soft);
    border-radius: 8px;
}

.range-bar {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    min-height: 48px;
    border-radius: 999px;
    background: linear-gradient(90deg, #4fbf8d, #f1c85b, #df655f);
}

.range-bar span {
    display: grid;
    place-items: center;
    color: rgba(255,255,255,.92);
    font-size: 12px;
    font-weight: 800;
}

.range-bar i {
    position: absolute;
    top: -7px;
    width: 4px;
    height: 62px;
    background: var(--navy);
    border-radius: 999px;
}

.factor-table {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.factor-table div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 13px;
    background: #fffdf9;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--muted);
}

.factor-table strong {
    color: var(--navy);
}

.two-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.chart-card {
    padding: 10px;
    box-shadow: none;
}

.chart-card canvas {
    width: 100%;
    height: auto;
}

.table-block {
    margin-top: 18px;
}

.table-block h3 {
    color: var(--navy);
}

.table-wrap {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: 8px;
}

table {
    width: 100%;
    border-collapse: collapse;
    min-width: 780px;
    background: var(--white);
}

th,
td {
    padding: 13px 14px;
    text-align: left;
    border-bottom: 1px solid var(--line);
    font-size: 14px;
}

th {
    color: var(--muted);
    background: var(--soft);
    font-size: 12px;
    text-transform: uppercase;
}

.badge {
    min-height: 24px;
}

.map-sim {
    position: relative;
    min-height: 430px;
    overflow: hidden;
    background:
        linear-gradient(90deg, transparent 48%, rgba(36, 28, 23, .09) 49% 51%, transparent 52%),
        linear-gradient(0deg, transparent 48%, rgba(36, 28, 23, .09) 49% 51%, transparent 52%),
        repeating-linear-gradient(35deg, #efe7d8 0 18px, #e4d9c7 18px 21px, #f6f1e9 21px 42px);
    border: 1px solid var(--line);
    border-radius: 8px;
}

.map-pin,
.home-pin {
    position: absolute;
    transform: translate(-50%, -50%);
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    color: var(--white);
    background: var(--navy);
    border: 2px solid var(--white);
    border-radius: 50%;
    box-shadow: 0 8px 18px rgba(36, 28, 23, .25);
    font-size: 11px;
    font-weight: 800;
}

.home-pin {
    width: 34px;
    height: 34px;
    background: var(--turquoise);
    color: var(--navy);
    font-size: 18px;
}

.service-list {
    display: grid;
    gap: 11px;
}

.service-list article {
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
}

.service-list span,
.service-list small {
    display: block;
    color: var(--muted);
}

.service-list strong {
    display: block;
    margin: 5px 0;
    color: var(--navy);
}

.demo-grid {
    grid-template-columns: repeat(4, 1fr);
}

.demo-grid article {
    padding: 18px;
    background: var(--soft);
    border-radius: 8px;
}

.demo-grid strong {
    display: block;
    margin-top: 8px;
    color: var(--navy);
    font-size: 24px;
}

.bar-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    margin-top: 20px;
}

.bar-grid div {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px 12px;
    color: var(--muted);
}

.bar-grid i {
    grid-column: 1 / -1;
    height: 10px;
    background: #ece2d2;
    border-radius: 999px;
}

.recommendation {
    background: #f3e3d8;
}

.recommendation-list {
    display: grid;
    gap: 12px;
}

.recommendation-list p {
    margin: 0;
    padding: 16px 18px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 8px;
    line-height: 1.55;
}

.disclaimer {
    box-shadow: none;
    background: transparent;
}

.error-page {
    display: grid;
    place-items: center;
    min-height: 72vh;
    padding: 30px;
}

.notice-card {
    max-width: 620px;
    padding: 34px;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

@media (max-width: 900px) {
    .hero,
    .form-shell,
    .decision-section,
    .report-cover,
    .two-columns,
    .market-position {
        grid-template-columns: 1fr;
    }

    .feature-grid,
    .process-grid,
    .valuation-grid,
    .demo-grid,
    .executive-grid,
    .factor-table {
        grid-template-columns: repeat(2, 1fr);
    }

    .topnav {
        display: none;
    }
}

@media (max-width: 620px) {
    .hero {
        padding-top: 42px;
    }

    .hero-metrics,
    .field-grid,
    .toggle-grid,
    .feature-grid,
    .process-grid,
    .valuation-grid,
    .demo-grid,
    .executive-grid,
    .bar-grid,
    .factor-table {
        grid-template-columns: 1fr;
    }

    .form-shell {
        padding: 20px;
    }

    .wizard fieldset {
        min-height: 0;
    }

    .wizard-progress b {
        display: none;
    }

    .site-footer,
    .workflow {
        display: block;
    }

    .report-toolbar {
        justify-content: stretch;
    }

    .report-toolbar .btn {
        flex: 1;
    }
}

@media print {
    @page {
        margin: 12mm;
    }

    body {
        background: #ffffff;
        color: #111827;
    }

    .no-print,
    .topbar,
    .site-footer {
        display: none !important;
    }

    .report {
        max-width: none;
        padding: 0;
    }

    .report-cover,
    .report-section {
        break-inside: avoid;
        box-shadow: none;
        margin: 0 0 10mm;
    }

    .report-section,
    .cover-card,
    .metric-card,
    .chart-card {
        box-shadow: none;
    }

    .table-wrap {
        overflow: visible;
    }

    table {
        min-width: 0;
        font-size: 11px;
    }

    th,
    td {
        padding: 7px;
        font-size: 10px;
    }
}

/* ============================================================
   Captación de leads: honeypot, intención de contacto, CTA
   ============================================================ */
.hp-field {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.contact-check {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 14px;
    margin-bottom: 14px;
    border: 1px solid var(--turquoise);
    border-radius: 8px;
    background: rgba(181, 69, 31, .08);
    font-weight: 700;
}

.contact-check input {
    width: 18px;
    min-height: 18px;
    accent-color: var(--turquoise);
}

.report-confirm {
    margin-bottom: 16px;
    padding: 14px 18px;
    color: var(--navy);
    background: rgba(181, 69, 31, .14);
    border: 1px solid var(--turquoise);
    border-radius: 8px;
    font-weight: 700;
}

.cta-section {
    padding: clamp(24px, 4vw, 40px);
    color: var(--white);
    background: linear-gradient(135deg, var(--navy), var(--navy-2));
    border: none;
}

.cta-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
}

.cta-copy {
    flex: 1 1 380px;
}

.cta-copy h2 {
    margin: 6px 0 10px;
    color: var(--white);
}

.cta-copy p {
    margin: 0;
    max-width: 60ch;
    color: rgba(255, 255, 255, .82);
}

.cta-section .eyebrow {
    color: var(--turquoise);
}

.cta-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

/* ============================================================
   Panel de administración de leads
   ============================================================ */
.admin {
    max-width: 1240px;
    margin: 0 auto;
    padding: 26px 20px 70px;
}

.admin-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 22px;
}

.admin-head h1 {
    margin: 6px 0 10px;
}

.admin-counts {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
}

.admin-actions {
    display: flex;
    gap: 10px;
}

.admin-login form {
    display: grid;
    gap: 14px;
    max-width: 360px;
    margin-top: 14px;
}

.admin-login label {
    display: grid;
    gap: 6px;
    font-weight: 700;
}

.admin-login input {
    min-height: 46px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
}

.admin-login label.admin-remember {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
    font-size: 0.95rem;
    cursor: pointer;
}

.admin-login label.admin-remember input {
    width: 16px;
    height: 16px;
    min-height: 0;
    flex: 0 0 auto;
    padding: 0;
    margin: 0;
    accent-color: var(--accent);
}

.form-error {
    color: #c0392b;
    font-weight: 700;
}

.temp-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.temp-hot { color: #8a1c1c; background: #fde2e1; }
.temp-warm { color: #8a5a00; background: #fdedcf; }
.temp-cold { color: #1f5066; background: #e2eef4; }

.admin-table-wrap {
    overflow-x: auto;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.admin-table {
    width: 100%;
    min-width: 880px;
    border-collapse: collapse;
    font-size: 13px;
}

.admin-table th,
.admin-table td {
    padding: 12px 14px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid var(--line);
}

.admin-table th {
    background: var(--soft);
    color: var(--muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.admin-table tbody tr:hover {
    background: rgba(181, 69, 31, .05);
}

.admin-table .yes {
    color: var(--navy);
}

/* ============================================================
   Páginas legales
   ============================================================ */
.legal {
    max-width: 820px;
    margin: 0 auto;
    padding: 40px 20px 70px;
}

.legal-doc {
    padding: clamp(24px, 4vw, 44px);
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 8px;
    box-shadow: var(--shadow);
}

.legal-doc h1 {
    margin: 8px 0 6px;
}

.legal-doc h2 {
    margin: 26px 0 8px;
    font-size: 18px;
}

.legal-doc p,
.legal-doc li {
    line-height: 1.6;
}

.legal-doc a {
    color: var(--navy);
    text-decoration: underline;
}

.legal-updated {
    color: var(--muted);
    font-size: 14px;
}

.legal-note {
    margin-top: 26px;
    padding: 14px 16px;
    background: var(--soft);
    border: 1px dashed var(--line);
    border-radius: 8px;
    color: var(--muted);
    font-size: 14px;
}

.legal-doc .btn {
    margin-top: 22px;
}

.footer-legal {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
}

.footer-legal a {
    color: rgba(255, 255, 255, .7);
    font-weight: 700;
}

.footer-legal a:hover {
    color: var(--white);
}

@media (max-width: 620px) {
    .cta-inner {
        flex-direction: column;
        align-items: flex-start;
    }

    .cta-actions {
        width: 100%;
    }

    .cta-actions .btn {
        flex: 1;
    }

    .admin-head {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ============================================================
   Tipografía editorial (capa global)
   ============================================================ */
h1, h2, h3, h4 {
    font-family: var(--font-display);
    font-weight: 600;
    letter-spacing: -0.015em;
    line-height: 1.1;
    color: var(--ink);
}

.eyebrow {
    font-family: var(--font-mono);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--accent);
}

/* Cifras clave: mono tabular para un look editorial-técnico */
.cover-card strong,
.metric-card strong,
.hero-metrics strong,
.valuation-grid strong,
.executive-grid strong,
.mini-report-header strong {
    font-family: var(--font-mono);
    font-feature-settings: 'tnum' 1, 'lnum' 1;
    letter-spacing: -0.02em;
}

/* ============================================================
   Pulido editorial
   ============================================================ */
.topbar {
    background: rgba(246, 241, 233, .82);
    border-bottom: 1px solid var(--line);
}

.nav-cta { color: var(--accent); }

.btn {
    font-weight: 700;
    letter-spacing: .005em;
}

/* Tarjetas de informe (datos): hairline cálido, sombra mínima */
.metric-card,
.chart-card,
.report-section {
    box-shadow: none;
    border: 1px solid var(--line);
    background: var(--surface);
    transition: border-color .2s ease;
}

/* feature/process son filas editoriales (sin caja ni hover-lift) */

/* Numeración de proceso en mono/terracota (editorial) */
.process-grid article span,
.feature-grid .icon {
    font-family: var(--font-mono);
    color: var(--accent);
    font-weight: 500;
}

/* Encabezados de sección: serif grande */
.section-heading h2 {
    font-size: clamp(28px, 3.4vw, 46px);
    font-weight: 500;
    letter-spacing: -0.02em;
}

.section-band { background: var(--bg); }
.section-band.soft { background: var(--bg-band); }

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
}

/* ============================================================
   Legal: bloques de actividad de tratamiento y tablas
   ============================================================ */
.legal-doc h3 {
    font-family: var(--font-display);
    font-size: 18px;
    margin: 24px 0 6px;
}

.legal-activity {
    margin: 14px 0;
    padding: 16px 18px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 8px;
}

.legal-activity h3 { margin: 0 0 10px; }

.legal-activity dl {
    display: grid;
    grid-template-columns: 184px 1fr;
    gap: 6px 16px;
    margin: 0;
}

.legal-activity dt {
    font-family: var(--font-mono);
    font-size: 11px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--accent);
    padding-top: 3px;
}

.legal-activity dd {
    margin: 0;
    color: var(--ink);
}

.legal-table-wrap {
    overflow-x: auto;
    margin: 12px 0 18px;
}

.legal-table {
    width: 100%;
    min-width: 560px;
    border-collapse: collapse;
    font-size: 14px;
}

.legal-table th,
.legal-table td {
    padding: 10px 12px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid var(--line);
}

.legal-table th {
    background: var(--bg-band);
    font-family: var(--font-mono);
    font-size: 11px;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--muted);
}

.legal-table code {
    font-family: var(--font-mono);
    font-size: 13px;
    color: var(--accent);
}

.footer-cc {
    color: rgba(255, 255, 255, .7);
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.footer-cc:hover { color: #fff; }

/* CookieConsent v3 — tema cálido editorial */
#cc-main {
    --cc-font-family: var(--font-sans);
    --cc-btn-primary-bg: var(--accent);
    --cc-btn-primary-hover-bg: var(--accent-deep);
    --cc-btn-primary-color: #fff;
    --cc-btn-primary-hover-color: #fff;
    --cc-btn-secondary-bg: #efe7d8;
    --cc-btn-secondary-hover-bg: #e4d9c7;
    --cc-btn-secondary-color: var(--ink);
    --cc-toggle-on-bg: var(--accent);
    --cc-link-color: var(--accent);
    --cc-modal-border-radius: 12px;
    --cc-btn-border-radius: 8px;
}

#cc-main .pm__badge { color: var(--accent); }

@media (max-width: 620px) {
    .legal-activity dl {
        grid-template-columns: 1fr;
        gap: 1px 0;
    }
    .legal-activity dt { padding-top: 10px; }
}

/* ============================================================
   Home: vista de informe en el hero, confianza, CTA móvil, reveal
   ============================================================ */
.report-preview {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.rp-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.rp-badge {
    font-family: var(--font-mono);
    font-size: 11px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--forest);
    background: rgba(60, 81, 65, .12);
    padding: 5px 11px;
    border-radius: 999px;
}

.rp-address strong {
    display: block;
    font-family: var(--font-display);
    font-size: 19px;
    letter-spacing: -.01em;
}

.rp-address span {
    color: var(--muted);
    font-size: 14px;
}

.rp-metrics {
    display: grid;
    gap: 12px;
}

.rp-metrics > div {
    padding: 15px 16px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--bg);
}

.rp-metrics span {
    display: block;
    color: var(--muted);
    font-size: 13px;
    margin-bottom: 3px;
}

.rp-metrics strong {
    font-family: var(--font-mono);
    font-size: 19px;
    letter-spacing: -.02em;
    color: var(--ink);
}

.rp-rent {
    background: var(--accent-soft) !important;
    border-color: #e7cdbd !important;
}

.rp-trend-head {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    color: var(--muted);
    margin-bottom: 4px;
}

.rp-up {
    font-family: var(--font-mono);
    color: var(--forest);
}

.rp-sparkline {
    width: 100%;
    height: 56px;
    display: block;
}

.rp-cta {
    width: 100%;
}

.rp-note {
    margin: 0;
    text-align: center;
    font-size: 12px;
    color: var(--muted);
}

.trust-band {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    max-width: 1240px;
    margin: 0 auto;
    padding: 26px clamp(20px, 5vw, 72px);
    border-bottom: 1px solid var(--line);
}

.trust-band > div {
    display: flex;
    align-items: center;
    gap: 12px;
}

.trust-band svg {
    width: 26px;
    height: 26px;
    color: var(--accent);
    flex: none;
}

.trust-band p {
    margin: 0;
    font-size: 14px;
    color: var(--muted);
    line-height: 1.3;
}

.trust-band strong { color: var(--ink); }

.mobile-cta { display: none; }

/* Animación de entrada (solo con JS y sin reduced-motion) */
.reveal-ready .reveal,
.reveal-ready .feature-grid article,
.reveal-ready .process-grid article,
.reveal-ready .section-heading {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .55s ease, transform .55s ease;
}

.reveal-ready .reveal.in,
.reveal-ready .feature-grid article.in,
.reveal-ready .process-grid article.in,
.reveal-ready .section-heading.in {
    opacity: 1;
    transform: none;
}

@media (max-width: 760px) {
    .mobile-cta {
        position: fixed;
        left: 12px;
        right: 12px;
        bottom: 12px;
        z-index: 40;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 54px;
        padding: 0 20px;
        color: #fff;
        font-weight: 700;
        background: var(--accent);
        border-radius: 14px;
        box-shadow: 0 12px 30px rgba(40, 28, 18, .28);
        transition: transform .25s ease, opacity .25s ease;
    }
    .mobile-cta.hidden-cta,
    body.cc-open .mobile-cta {
        transform: translateY(120%);
        opacity: 0;
        pointer-events: none;
    }
    body.landing-page { padding-bottom: 80px; }
    .trust-band { grid-template-columns: 1fr 1fr; gap: 16px 14px; }
}

@media (max-width: 460px) {
    .trust-band { grid-template-columns: 1fr; }
}

@media print {
    .reveal-ready .reveal,
    .reveal-ready .feature-grid article,
    .reveal-ready .process-grid article,
    .reveal-ready .section-heading {
        opacity: 1 !important;
        transform: none !important;
    }
    .mobile-cta { display: none !important; }
}

/* ============================================================
   Capa fotográfica editorial — duotono terracota
   Toda la fotografía del sitio comparte un mismo tratamiento
   (escala de grises + luces bone + sombras espresso) para que
   parezca de marca y nunca de banco de imágenes genérico.
   ============================================================ */
:root {
    --duo-light: #f1e6d6;   /* luces  -> bone cálido (multiply) */
    --duo-dark:  #3a1d0d;   /* sombras -> espresso terracota (lighten) */
    --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.duo {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
}
.duo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(1) sepia(.24) contrast(1.1) brightness(1.02);
}
.duo::before,
.duo::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.duo::before {           /* luces cálidas */
    background: var(--duo-light);
    mix-blend-mode: multiply;
}
.duo::after {            /* sombras espresso */
    background: var(--duo-dark);
    mix-blend-mode: lighten;
}

/* ---- Hero con fotografía de fondo tratada ---- */
.hero {
    position: relative;
    isolation: isolate;
    background: var(--bg);
    min-height: min(calc(100vh - 76px), 780px);
}
.hero-bg img {
    object-position: 50% 56%;
    transform: scaleX(-1);   /* espejo: ventana/planta/suelo soleado a la derecha (zona visible) */
}
/* velo crema: casi opaco a la izquierda (texto legible) y se abre
   hacia la derecha para revelar la foto con la tarjeta flotando */
.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(104deg,
            var(--bg) 0%,
            rgba(246, 241, 233, .95) 24%,
            rgba(246, 241, 233, .58) 41%,
            rgba(246, 241, 233, .16) 60%,
            rgba(246, 241, 233, 0) 88%),
        linear-gradient(to bottom,
            rgba(246, 241, 233, .28) 0%,
            transparent 18%,
            transparent 82%,
            rgba(246, 241, 233, .34) 100%);
}
.hero::after {           /* grano de película sutil */
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background-image: var(--grain);
    background-size: 200px 200px;
    opacity: .09;
    mix-blend-mode: soft-light;
}
.hero-copy,
.hero > .hero-panel {
    position: relative;
    z-index: 2;
}
.hero .report-preview {
    box-shadow: 0 34px 80px -30px rgba(36, 22, 12, .58), 0 6px 18px rgba(36, 22, 12, .12);
}

/* ---- Banda fotográfica divisoria ---- */
.photo-band {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    align-items: center;
    min-height: clamp(280px, 36vw, 430px);
    padding: clamp(40px, 6vw, 76px) clamp(20px, 5vw, 72px);
    color: #fff;
    border-block: 1px solid var(--line);
}
.photo-band .duo img {
    object-position: center 44%;
}
.photo-band::before {    /* oscurece la izquierda para el texto blanco */
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(95deg,
        rgba(26, 15, 8, .84) 0%,
        rgba(26, 15, 8, .60) 42%,
        rgba(26, 15, 8, .18) 78%,
        rgba(26, 15, 8, .05) 100%);
}
.photo-band::after {     /* grano */
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background-image: var(--grain);
    background-size: 200px 200px;
    opacity: .10;
    mix-blend-mode: soft-light;
}
.photo-band-inner {
    position: relative;
    z-index: 2;
    max-width: 600px;
}
.photo-band-inner .eyebrow {
    color: #f1c6a6;
}
.photo-band-inner h2 {
    margin: 12px 0 12px;
    color: #fff;
    font-size: clamp(26px, 3.4vw, 42px);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.06;
}
.photo-band-inner p {
    margin: 0;
    max-width: 540px;
    color: rgba(255, 252, 247, .85);
    font-size: 18px;
    line-height: 1.55;
}

/* ---- Fotografía en responsive ---- */
@media (max-width: 900px) {
    /* en columna única el velo pasa a vertical para proteger el texto */
    .hero::before {
        background: linear-gradient(to bottom,
            rgba(246, 241, 233, .97) 0%,
            rgba(246, 241, 233, .88) 44%,
            rgba(246, 241, 233, .80) 100%);
    }
    .hero-bg img {
        object-position: 60% 28%;
    }
    .photo-band::before {
        background: linear-gradient(to right,
            rgba(26, 15, 8, .86) 0%,
            rgba(26, 15, 8, .62) 70%,
            rgba(26, 15, 8, .40) 100%);
    }
    .report-cover::before {
        background: linear-gradient(to bottom,
            rgba(28, 20, 14, .90) 0%,
            rgba(28, 20, 14, .82) 100%);
    }
}

/* ============================================================
   Landing comercial: valora-tu-vivienda.php (.lp-valora)
   ============================================================ */

/* Cabecera enfocada: sin navegación que distraiga */
.lp-valora .topnav { display: none; }

/* ---- HERO ---- */
.lp-hero {
    background: radial-gradient(120% 100% at 82% -10%, var(--accent-soft) 0, var(--bg) 58%);
    padding: 46px 24px 58px;
    border-bottom: 1px solid var(--line);
}
.lp-hero-inner {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.02fr 0.98fr;
    gap: 48px;
    align-items: start;
}
.lp-hero-copy h1 {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 40px;
    line-height: 1.08;
    letter-spacing: -0.01em;
    color: var(--ink);
    margin: 14px 0 0;
}
.lp-hero-copy h1 em { font-style: italic; color: var(--accent); }
.lp-lead {
    font-size: 17px;
    line-height: 1.6;
    color: var(--muted);
    margin: 18px 0 0;
    max-width: 48ch;
}
.lp-hero-bullets {
    list-style: none;
    padding: 0;
    margin: 22px 0 0;
    display: grid;
    gap: 11px;
}
.lp-hero-bullets li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 15px;
    color: var(--ink);
}
.lp-hero-bullets svg { width: 20px; height: 20px; color: var(--accent); flex: 0 0 auto; margin-top: 1px; }
.lp-trust { display: flex; flex-wrap: wrap; gap: 10px 16px; margin-top: 24px; }
.lp-trust-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-family: var(--font-mono);
    font-size: 12px;
    letter-spacing: 0.02em;
    color: var(--muted);
}
.lp-trust-chip svg { width: 18px; height: 18px; color: var(--accent); }

/* ---- TARJETA LEAD ---- */
.lp-hero-form { position: relative; }
.lp-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: none;
    padding: 26px;
}
.lp-card-title { font-family: var(--font-display); font-size: 21px; margin: 0 0 4px; color: var(--ink); }
.lp-card-sub { font-size: 14px; color: var(--muted); margin: 0 0 18px; }

/* Estados de la tarjeta: gate -> formulario / filtrado */
.lp-card .wizard,
.lp-card .lp-filtered { display: none; }
.lp-card.show-form .lp-gate,
.lp-card.show-form .lp-filtered { display: none; }
.lp-card.show-form .wizard { display: block; }
.lp-card.show-filtered .lp-gate,
.lp-card.show-filtered .wizard { display: none; }
.lp-card.show-filtered .lp-filtered { display: block; }

/* Gate de intención */
.lp-gate-options { display: grid; gap: 10px; }
.lp-gate-opt {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    text-align: left;
    padding: 13px 15px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: var(--bg);
    cursor: pointer;
    transition: border-color 0.15s, transform 0.15s, box-shadow 0.15s;
}
.lp-gate-opt:hover {
    border-color: var(--accent);
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(40, 26, 18, 0.07);
}
.lp-gate-ic {
    flex: 0 0 auto;
    width: 30px;
    height: 44px;
    display: grid;
    place-items: center;
    color: var(--accent);
    background: none;
    border-radius: 0;
}
.lp-gate-ic svg { width: 24px; height: 24px; }
.lp-gate-tx { display: flex; flex-direction: column; gap: 2px; }
.lp-gate-tx strong { font-size: 15px; color: var(--ink); }
.lp-gate-tx em { font-style: normal; font-size: 13px; color: var(--muted); }
.lp-gate-opt--out { background: transparent; border-style: dashed; }
.lp-gate-opt--out .lp-gate-ic { background: #ece2d3; color: var(--muted); }
.lp-gate-opt--out .lp-gate-tx strong { color: var(--muted); }
.lp-gate-foot { font-size: 12px; color: var(--muted); margin: 16px 0 0; text-align: center; }

/* Pantalla de filtrado (no-lead) */
.lp-filtered { text-align: center; padding: 6px 4px 4px; }
.lp-filtered-ic {
    display: inline-grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--accent-soft);
    color: var(--accent);
}
.lp-filtered-ic svg { width: 28px; height: 28px; }
.lp-filtered h2 { margin: 12px 0 8px; }
.lp-filtered p { color: var(--muted); font-size: 15px; line-height: 1.6; margin: 0 auto 18px; max-width: 38ch; }

/* Wizard en la tarjeta */
.wizard-progress.lp-progress-3 { grid-template-columns: repeat(3, 1fr); gap: 14px; }
/* En la LP el span lleva número (<b>) + etiqueta como texto: paso editorial
   con regleta inferior, no barra con label colgado como en index. */
.wizard-progress.lp-progress-3 span {
    height: auto;
    background: none;
    border-radius: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--line);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.01em;
    color: var(--muted);
    white-space: nowrap;
    overflow: visible;
}
.wizard-progress.lp-progress-3 span.active {
    background: none;
    border-bottom-color: var(--accent);
    color: var(--ink);
}
.wizard-progress.lp-progress-3 b {
    position: static;
    transform: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex: none;
    border: 1px solid var(--line);
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 600;
    color: var(--muted);
}
.wizard-progress.lp-progress-3 span.active b {
    border-color: var(--accent);
    background: var(--accent);
    color: #fffdf8;
}
.field-note { font-size: 13px; color: var(--muted); margin: 18px 0 9px; font-weight: 600; }
.lp-form-foot { font-size: 12px; color: var(--muted); text-align: center; margin: 14px 0 0; }

/* ---- SECCIONES ---- */
.lp-section { padding: 64px 24px; }
.lp-section--alt { background: var(--bg-band); }
.lp-section > .section-heading {
    max-width: 1080px;
    margin: 0 auto 34px;
    text-align: center;
}
.lp-section > .feature-grid,
.lp-section > .process-grid {
    max-width: 1080px;
    margin: 0 auto;
}

/* Para quién sí / no */
.lp-fit {
    max-width: 980px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
.lp-fit-col {
    border: none;
    border-top: 2px solid var(--line);
    border-radius: 0;
    padding: 22px 0 0;
    background: none;
}
.lp-fit-yes { border-top-color: var(--accent); }
.lp-fit-no { background: transparent; }
.lp-fit-col h3 {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: var(--font-display);
    font-size: 19px;
    margin: 0 0 14px;
    color: var(--ink);
}
.lp-fit-col h3 svg { width: 22px; height: 22px; flex: 0 0 auto; }
.lp-fit-yes h3 svg { color: var(--accent); }
.lp-fit-no h3 svg { color: var(--muted); }
.lp-fit-col ul { margin: 0; padding-left: 18px; display: grid; gap: 9px; color: var(--ink); font-size: 15px; line-height: 1.5; }
.lp-fit-no ul { color: var(--muted); }
.lp-fit-note { margin: 14px 0 0; font-size: 13px; color: var(--muted); }

/* CTA final */
.lp-cta-final { background: var(--espresso); padding: 66px 24px; text-align: center; }
.lp-cta-inner { max-width: 640px; margin: 0 auto; }
.lp-cta-final h2 { font-family: var(--font-display); font-size: 30px; color: #fdf6ee; margin: 0 0 10px; }
.lp-cta-final p { color: #d8c6b4; font-size: 16px; margin: 0; }
.lp-cta-final .btn { margin-top: 22px; }
.btn-lg { font-size: 16px; padding: 15px 32px; }
.lp-cta-disc { font-size: 12px; color: #b49c86; margin-top: 16px; }

/* ---- Responsive ---- */
@media (max-width: 960px) {
    .lp-hero-inner { grid-template-columns: 1fr; gap: 30px; }
    .lp-hero-copy h1 { font-size: 32px; }
    .lp-fit { grid-template-columns: 1fr; }
    .lp-section { padding: 48px 20px; }
}

/* ============================================================
   Accesibilidad + pulido móvil  (audit → adapt / harden / typeset)
   ============================================================ */

/* Foco de teclado visible en TODOS los interactivos (WCAG 2.4.7) */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.lp-gate-opt:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
    border-radius: 4px;
}
/* Con ratón no molesta; con teclado siempre visible */
:focus:not(:focus-visible) { outline: none; }

/* Targets táctiles ≥44px en enlaces legales del footer */
.footer-legal a,
.footer-legal button {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 4px 2px;
}

/* Tipografía: titulares equilibrados, cuerpo sin huérfanas (typeset) */
h1, h2, h3,
.lp-card-title,
.section-heading h2 { text-wrap: balance; }
.lp-lead, .lead, p { text-wrap: pretty; }

/* ─────────────────────────────────────────────
   Paso intermedio: verificación de contacto + SMS
   (templates/verify_gate.php, body.gate-page)
   ───────────────────────────────────────────── */
.gate {
    max-width: 720px;
    margin: 0 auto;
    padding: 56px 20px 96px;
}
.gate-card {
    background: var(--surface);
    border: 1px solid var(--line);
    padding: 40px 44px 36px;
}
.gate-card h1 {
    font-family: var(--font-display);
    font-size: clamp(1.9rem, 4vw, 2.6rem);
    line-height: 1.1;
    margin: 8px 0 18px;
}
.gate-property {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    padding: 12px 0 18px;
    border-bottom: 1px solid var(--line);
    margin-bottom: 22px;
}
.gate-property-item {
    font-family: var(--font-mono);
    font-size: 0.78rem;
    letter-spacing: 0.02em;
    color: var(--muted);
}
.gate-notice {
    border: 1px solid var(--line);
    background: rgba(181, 69, 31, 0.04);
    padding: 18px 22px;
    margin-bottom: 26px;
}
.gate-notice h2 {
    font-size: 1rem;
    margin: 0 0 8px;
}
.gate-notice p {
    margin: 0;
    font-size: 0.92rem;
    line-height: 1.55;
}
.gate-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 20px;
    margin-bottom: 18px;
}
.gate-fields label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 0.85rem;
    font-weight: 600;
}
.gate-fields label:last-child {
    grid-column: 1 / -1;
}
.gate-fields input {
    border: 1px solid var(--line);
    background: #fff;
    padding: 12px 14px;
    font-size: 1rem;
    font-family: inherit;
}
.gate-fields input:focus {
    outline: 2px solid var(--accent);
    outline-offset: -1px;
}
.gate-hint {
    font-weight: 400;
    color: var(--muted);
    font-size: 0.78rem;
}
.gate-form .consent-block {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 6px 0 20px;
}
.consent-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.8rem;
    line-height: 1.5;
    color: var(--muted);
}
.consent-item input {
    margin-top: 3px;
    accent-color: var(--accent);
    flex: none;
    width: 18px;
    height: 18px;
    min-height: 18px;
}
.gate-error {
    color: #a02b12;
    font-size: 0.85rem;
    margin: 0 0 14px;
}
.gate-form .btn-lg,
.gate-otp .btn {
    width: 100%;
}
.gate-otp h2 {
    font-size: 1.15rem;
    margin: 4px 0 6px;
}
.gate-otp-sub {
    font-size: 0.88rem;
    color: var(--muted);
    margin: 0 0 16px;
}
.gate-otp-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 12px;
    margin-bottom: 12px;
}
.gate-otp-row input {
    border: 1px solid var(--line);
    background: #fff;
    padding: 12px 14px;
    font-size: 1.35rem;
    letter-spacing: 0.35em;
    font-family: var(--font-mono);
    text-align: center;
}
.gate-otp-row .btn {
    width: auto;
    padding-left: 26px;
    padding-right: 26px;
}
.gate-otp-actions {
    font-size: 0.82rem;
    color: var(--muted);
}
.btn-link {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    font-size: 0.82rem;
    color: var(--accent);
    text-decoration: underline;
    cursor: pointer;
}
.btn-link:disabled {
    color: var(--muted);
    text-decoration: none;
    cursor: default;
}
.gate-disclaimer {
    margin: 26px 0 0;
    padding-top: 18px;
    border-top: 1px solid var(--line);
    font-size: 0.75rem;
    line-height: 1.5;
    color: var(--muted);
}
.step-note {
    margin: 14px 0 0;
    font-size: 0.82rem;
    line-height: 1.5;
    color: var(--muted);
}
@media (max-width: 640px) {
    .gate {
        padding: 24px 14px 72px;
    }
    .gate-card {
        padding: 26px 20px 24px;
    }
    .gate-fields {
        grid-template-columns: 1fr;
    }
    .gate-otp-row {
        grid-template-columns: 1fr;
    }
}

/* Hero LP: capa fotográfica con personas (duotono) + veladura editorial */
.lp-hero { position: relative; overflow: hidden; isolation: isolate; }
.lp-hero-photo {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}
.lp-hero-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 62% 24%;
}
.lp-hero-veil {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(246, 241, 233, 0.30) 0%, rgba(246, 241, 233, 0.62) 58%, var(--surface, #f6f1e9) 96%),
        linear-gradient(90deg, rgba(246, 241, 233, 0.92) 0%, rgba(246, 241, 233, 0.72) 44%, rgba(246, 241, 233, 0.34) 100%);
}
.lp-hero-inner { position: relative; z-index: 2; }
@media (max-width: 900px) {
    /* En móvil la foto es solo un susurro: el rostro asoma arriba a la
       derecha y el texto manda. */
    .lp-hero-photo img { object-position: 82% 12%; }
    .lp-hero-veil {
        background:
            linear-gradient(180deg, rgba(246, 241, 233, 0.72) 0%, rgba(246, 241, 233, 0.90) 46%, var(--surface, #f6f1e9) 88%);
    }
}

/* Wizard de la LP: altura al contenido (sin hueco muerto en pasos cortos)
   y acción principal protagonista. */
.lp-hero-form .wizard fieldset {
    min-height: 150px;
}
.lp-hero-form .wizard-actions .btn-primary {
    flex: 1 1 auto;
    max-width: 100%;
}
.lp-hero-form .wizard-actions .btn-ghost {
    flex: 0 0 auto;
}

/* Admin: sección de seguimiento y píxeles */
.admin-tracking {
    background: var(--surface);
    border: 1px solid var(--line);
    padding: 18px 22px;
    margin-bottom: 24px;
}
.admin-tracking summary {
    cursor: pointer;
    font-weight: 700;
    font-size: 14px;
}
.admin-tracking-form {
    margin-top: 18px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.admin-tracking-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px 16px;
}
.admin-tracking-pixels textarea {
    width: 100%;
    font-family: var(--font-mono);
    font-size: 12px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    background: #fff;
}
.admin-tracking-note {
    font-size: 12px;
    color: var(--muted);
    margin: 0;
}
.admin-tracking .btn {
    align-self: flex-start;
}

/* Admin: alerta de almacenamiento no escribible */
.admin-storage-alert {
    border: 1px solid #a02b12;
    background: rgba(160, 43, 18, 0.06);
}
.admin-storage-alert code {
    font-family: var(--font-mono);
    font-size: 12px;
    background: #fff;
    padding: 2px 6px;
    border: 1px solid var(--line);
    display: inline-block;
    margin-top: 4px;
}

/* Informe: mapa real de la zona (Leaflet) y estados sin datos */
.zone-map {
    height: 320px;
    border: 1px solid var(--line);
    background: var(--surface);
}
.zone-map-note {
    margin: 8px 0 0;
    font-size: 11px;
    color: var(--muted);
}
.zone-map-note a { color: var(--muted); text-decoration: underline; }
.zone-map-empty {
    border: 1px solid var(--line);
    background: var(--surface);
    padding: 18px 20px;
    font-size: 13px;
    color: var(--muted);
    line-height: 1.5;
}
.zone-map-empty p { margin: 0; }
.service-list-note {
    margin: 10px 0 0;
    font-size: 11px;
    color: var(--muted);
}
@media print {
    .zone-map, .zone-map-note { display: none; }
}