/*
  Shared, namespaced styles for the 4 niche landing pages:
  litigios_inmobiliarios, amparo_defensa_constitucional, defensa_ajustes_cfe, impugnacion_cedulas_imss.
  Palette reuses the site's own navy/gold/hueso tokens already live on index.html
  (#16233c / #cc8809 / #faf8f4) instead of introducing a new design system.
  Root wrapper carries both ".fa-landing" (shared) and a page modifier
  (".fa-landing-inmobiliario" / ".fa-landing-amparo" / ".fa-landing-cfe" / ".fa-landing-imss")
  so each page can be restyled independently without touching global CSS.
*/
.fa-landing{
    --fa-navy:#16233c; --fa-gold:#cc8809; --fa-hueso:#faf8f4;
    --fa-mono:'SFMono-Regular', Consolas, 'Courier New', monospace;
    /* "Carpeta que se levanta del escritorio" — mismos tokens que la ficha del home (index.html, .areas-practica-grid) */
    --card-radius:12px;
    --card-shadow-rest:0 1px 2px rgba(22,35,60,0.08), 0 6px 16px -4px rgba(22,35,60,0.10);
    --card-shadow-hover:0 2px 4px rgba(22,35,60,0.12), 0 16px 32px -8px rgba(22,35,60,0.18);
    --card-lift-hover:-5px;
    --card-transition:220ms cubic-bezier(0.4,0,0.2,1);
    color:#2c2c2c;
}

.fa-landing-hero{ background-color:var(--fa-navy); color:var(--fa-hueso); padding:80px 0 60px; }
.fa-landing-hero .fa-landing-eyebrow{ font-family:var(--fa-mono); font-size:12px; letter-spacing:2px; text-transform:uppercase; color:var(--fa-gold); margin-bottom:18px; }
.fa-landing-hero h1{ font-size:40px; line-height:1.2; color:#ffffff; margin-bottom:20px; max-width:820px; }
.fa-landing-hero .fa-landing-lede{ font-size:18px; line-height:1.7; color:#d8d4ca; max-width:720px; margin-bottom:16px; }
.fa-landing-hero .fa-landing-btn-row{ display:flex; flex-wrap:wrap; gap:16px; margin-top:28px; }
.fa-landing-hero .fa-landing-urgent{ margin-top:26px; padding:16px 20px; border:1px dashed var(--fa-gold); background:rgba(204,136,9,0.08); color:#f3ead6; font-size:14px; max-width:720px; }

.fa-landing-trust-strip{ background-color:var(--fa-hueso); border-bottom:1px solid #e6e0d4; padding:16px 0; text-align:center; font-family:var(--fa-mono); font-size:13px; letter-spacing:0.5px; color:var(--fa-navy); }

.fa-landing-trust-chips{ background-color:var(--fa-hueso); border-bottom:1px solid #e6e0d4; padding:20px 0; display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.fa-landing-trust-chips .fa-landing-chip{
    font-family:var(--fa-mono); font-size:12px; letter-spacing:0.5px; color:var(--fa-navy);
    background:#ffffff; border:1px solid var(--fa-navy); padding:7px 14px;
}

.fa-landing-section{ padding:64px 0; }
.fa-landing-section--alt{ background-color:var(--fa-hueso); }
.fa-landing-section--dark{ background-color:var(--fa-navy); color:var(--fa-hueso); }
.fa-landing-section h2{ font-size:30px; color:var(--fa-navy); margin-bottom:30px; }
.fa-landing-section--dark h2{ color:#ffffff; }

.fa-landing-mosaic__item{
    position:relative; border:1px solid rgba(22,35,60,0.16); border-radius:var(--card-radius);
    padding:28px 26px; height:100%; margin-bottom:26px; background:#ffffff;
    box-shadow:var(--card-shadow-rest);
    transition:box-shadow var(--card-transition), transform var(--card-transition), border-color var(--card-transition);
}
/* Pestaña Latón — mismo elemento firma que la ficha del home; sube ligeramente sobre el borde superior, por eso el item no lleva overflow:hidden. */
.fa-landing-mosaic__item::before{
    content:""; position:absolute; top:-4px; left:26px;
    width:36px; height:8px; background-color:var(--fa-gold); border-radius:4px 4px 0 0;
    z-index:1;
}
@media (hover:hover){
    .fa-landing-mosaic__item:hover{
        transform:translateY(var(--card-lift-hover));
        box-shadow:var(--card-shadow-hover);
        border-color:rgba(22,35,60,0.24);
    }
}
@media (prefers-reduced-motion: reduce){
    .fa-landing-mosaic__item{ transition:box-shadow var(--card-transition), border-color var(--card-transition); }
    .fa-landing-mosaic__item:hover{ transform:none; }
}
.fa-landing-mosaic__head{ display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:18px; }
.fa-landing-mosaic__icon{ font-size:28px; line-height:1; color:var(--fa-gold); }
.fa-landing-mosaic__folio{ font-family:var(--fa-mono); font-size:11px; letter-spacing:1px; color:#888888; align-self:flex-start; }
.fa-landing-mosaic__item h3{ font-size:18px; color:var(--fa-navy); margin-bottom:10px; }
.fa-landing-mosaic__item p{ font-size:14px; line-height:1.65; color:#555555; margin:0; }

.fa-landing-checklist ul{ list-style:none; padding:0; margin:0; }
.fa-landing-checklist li{ position:relative; padding-left:26px; margin-bottom:14px; line-height:1.65; }
.fa-landing-checklist li:before{ content:"✓"; position:absolute; left:0; color:var(--fa-gold); font-weight:700; }

.fa-landing-steps ol{ list-style:none; padding:0; margin:0; counter-reset:fa-step; position:relative; }
.fa-landing-steps ol:before{ content:""; position:absolute; top:17px; bottom:17px; left:17px; width:2px; background:#d8d4ca; }
.fa-landing-steps li{ counter-increment:fa-step; position:relative; padding-left:52px; margin-bottom:26px; }
.fa-landing-steps li:before{ content:counter(fa-step); position:absolute; left:0; top:0; width:34px; height:34px; border-radius:50%; background:var(--fa-gold); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-family:var(--fa-mono); }
.fa-landing-steps h4{ margin:0 0 4px; font-size:16px; color:var(--fa-navy); }
.fa-landing-section--dark .fa-landing-steps h4{ color:#fff; }

.fa-landing-results ul{ list-style:none; padding:0; margin:0; columns:1; }
.fa-landing-results li{ position:relative; padding-left:26px; margin-bottom:14px; line-height:1.6; }
.fa-landing-results li:before{ content:"✓"; position:absolute; left:0; color:var(--fa-gold); font-weight:700; }

.fa-landing-disclaimer{ background-color:#fffaf0; border:1px dashed var(--fa-gold); padding:16px 20px; font-size:13px; line-height:1.6; color:#555555; margin:0 0 34px; }
.fa-landing-section--dark .fa-landing-disclaimer{ background-color:rgba(255,255,255,0.06); color:#e4e1d8; }

.fa-landing-faq .accordion-box{ margin-top:10px; }

.fa-landing-form-section{ padding:64px 0; background-color:var(--fa-hueso); }
.fa-landing-form-section .fa-landing-form-intro{ margin-bottom:30px; }
.fa-landing-form-section form{ background:#ffffff; border:1px solid #e6e0d4; padding:34px; }
.fa-landing-form-section .form-group{ margin-bottom:18px; }
.fa-landing-form-section label{ display:block; font-weight:600; font-size:13px; color:var(--fa-navy); margin-bottom:6px; }
.fa-landing-form-section .fa-landing-form-block-title{
    font-family:var(--fa-mono); font-size:12px; letter-spacing:1.5px; text-transform:uppercase;
    color:var(--fa-navy); border-top:1px solid #e6e0d4; margin:0 0 18px; padding-top:22px;
}
.fa-landing-form-section .row > .col-md-12:first-child .fa-landing-form-block-title,
.fa-landing-form-section .fa-landing-form-block-title--first{ border-top:none; padding-top:0; }
.fa-landing-form-section .fa-landing-checkbox-group label{
    font-weight:400; display:inline-flex; align-items:center; gap:8px;
    border:1px solid #d8d4ca; background:var(--fa-hueso); padding:8px 12px; margin:0;
}
.fa-landing-form-section .fa-landing-checkbox-group input{ width:auto; }
.fa-landing-form-section .fa-landing-checkbox-group > div{ display:flex; flex-wrap:wrap; gap:10px; }
.fa-landing-form-section input[type="text"],
.fa-landing-form-section input[type="tel"],
.fa-landing-form-section input[type="email"],
.fa-landing-form-section input[type="date"],
.fa-landing-form-section select,
.fa-landing-form-section textarea{
    width:100%; padding:11px 14px; border:1px solid #d8d4ca; background:#fff; font-size:14px; color:#2c2c2c;
}
.fa-landing-form-section textarea{ min-height:110px; }
.fa-landing-form-section .fa-landing-consent{ font-size:13px; line-height:1.5; }
.fa-landing-form-section .errorlist{ color:#b3261e; font-size:12px; margin:4px 0 0; padding:0; list-style:none; }

.fa-landing-whatsapp-cta{
    background-color:#25D366; color:#ffffff; border-radius:50px;
    padding:14px 22px; display:inline-flex; align-items:center; gap:8px;
    text-decoration:none; font-weight:700; font-size:14px;
}
.fa-landing-whatsapp-cta:hover{ color:#ffffff; opacity:0.9; }

/* Persistent WhatsApp button: fixed on mobile only, hidden on desktop (the hero already offers a WhatsApp CTA there) */
.fa-landing-whatsapp-float{
    display:none;
}
@media only screen and (max-width:991px){
    .fa-landing{ padding-bottom:76px; }
    .fa-landing-whatsapp-float{
        display:inline-flex; position:fixed; right:16px; bottom:16px; z-index:999;
        background-color:#25D366; color:#ffffff; border-radius:50px;
        padding:14px 18px; align-items:center; gap:8px;
        box-shadow:0 6px 16px rgba(0,0,0,0.25); text-decoration:none; font-weight:700; font-size:14px;
    }
    .fa-landing-whatsapp-float:hover{ color:#ffffff; }
}

@media only screen and (max-width:767px){
    .fa-landing-hero{ padding:56px 0 40px; }
    .fa-landing-hero h1{ font-size:28px; }
    .fa-landing-section{ padding:44px 0; }
    .fa-landing-section h2{ font-size:24px; }
    .fa-landing-form-section form{ padding:24px 20px; }
}
