@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Open+Sans:wght@400;600;700&display=swap');
:root {
    --green:#00A19B;
    --green2:#00A19B;
    --orange:#ff6c0e;
    --ink:#243b3a;
    --muted:#687776;
    --bg:#fff;
    --soft:#f3f7f6;
    --line:#dce7e5;
    --shadow:0 14px 40px rgba(30,70,68,.10)
}
* {
    box-sizing:border-box
}
html,body {
    max-width:100%;
    overflow-x:hidden
}
html {
    scroll-behavior:smooth
}
body {
    margin:0;
    color:#222;
    font-family:'Open Sans',Arial,sans-serif;
    background:#fff
}
a {
    color:inherit;
    text-decoration:none
}
img {
    max-width:100%;
    display:block
}
.wrap {
    width:min(1160px,calc(100% - 40px));
    margin:auto
}
.topbar {
    background:var(--green);
    color:#fff;
    font-size:12px;
    padding:8px 0
}
.topbar .wrap {
    display:flex;
    justify-content:space-between;
    gap:20px
}
.topbar span {
    opacity:.98
}
.header {
    background:#fff;
    position:sticky;
    top:0;
    z-index:50;
    border-bottom:1px solid #edf2f1
}
.navwrap {
    height:84px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px
}
.brand {
    display:flex;
    align-items:center;
    gap:10px
}
.brandMark {
    font-family:Montserrat,sans-serif;
    font-size:43px;
    letter-spacing:-4px;
    font-weight:500;
    color:var(--green);
    line-height:.8
}
.brandMark i {
    font-style:normal;
    color:var(--orange)
}
.brand small {
    font-size:9px;
    line-height:1.05;
    letter-spacing:1px;
    color:#777
}
.nav {
    display:flex;
    align-items:center;
    gap:28px;
    font-size:13px;
    font-weight:600
}
.nav a {
    padding:32px 0;
    position:relative
}
.nav a {
    color:#111
}
.nav a:hover {
    color:var(--orange)
}
.nav a.active {
    color:#111
}
.nav a.active:after {
    content:'';
    position:absolute;
    left:0;
    right:0;
    bottom:22px;
    height:2px;
    background:var(--green)
}
.nav a.login {
    color:#111
}
.nav a.login:hover {
    color:var(--orange)
}
.langToggle {
    border:1px solid var(--line);
    background:white;
    padding:8px 10px;
    border-radius:3px;
    font-weight:700;
    color:#111;
    cursor:pointer;
    font:inherit
}
.langToggle:hover {
    color:var(--orange);
    border-color:var(--orange)
}
.menuBtn {
    display:none;
    border:0;
    background:none;
    font-size:28px;
    color:var(--green)
}
.hero {
    height:calc(100vh - 132px);
    min-height:590px;
    position:relative;
    overflow:hidden;
    background:var(--soft)
}
.slides,.slide {
    height:100%
}
.slide {
    position:absolute;
    inset:0;
    opacity:0;
    transition:opacity .7s ease;
    background-size:cover;
    background-position:center
}
.slide.active {
    opacity:1
}
.slide:after {
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,rgba(15,45,44,.70) 0%,rgba(15,45,44,.35) 48%,rgba(15,45,44,.05) 100%)
}
.heroCopy {
    position:absolute;
    z-index:2;
    left:max(20px,calc((100% - 1160px)/2));
    bottom:18%;
    max-width:610px;
    color:#fff
}
.heroCopy .eyebrow {
    font-size:12px;
    letter-spacing:2px;
    font-weight:700;
    color:#d9eeec
}
.heroCopy h1 {
    font:700 clamp(36px,5vw,68px)/1.03 Montserrat,sans-serif;
    margin:14px 0
}
.heroCopy p {
    font-size:18px;
    line-height:1.65;
    max-width:590px;
    margin:0 0 26px
}
.btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:0 20px;
    border-radius:2px;
    font-weight:700;
    font-size:13px;
    border:1px solid transparent;
    cursor:pointer
}
.primary {
    background:var(--green);
    color:#fff
}
.secondary {
    background:#fff;
    color:var(--green)
}
.hero .primary {
    background:var(--green)
}
.dots {
    position:absolute;
    z-index:4;
    bottom:30px;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    gap:8px
}
.dots button {
    width:10px;
    height:10px;
    border-radius:50%;
    border:1px solid white;
    background:transparent;
    cursor:pointer
}
.dots button.active {
    background:#fff
}
.section {
    padding:90px 0
}
.section.alt {
    background:var(--soft)
}
.kicker {
    color:var(--orange);
    font-weight:700;
    font-size:12px;
    letter-spacing:1.7px;
    text-transform:uppercase
}
.section h2 {
    font:700 40px/1.1 Montserrat,sans-serif;
    margin:10px 0 18px;
    color:#222
}
.lead {
    color:var(--muted);
    font-size:17px;
    line-height:1.75
}
.two {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center
}
.cardGrid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px
}
.card {
    border:1px solid var(--line);
    background:#fff;
    padding:26px;
    box-shadow:0 6px 20px rgba(30,70,68,.05)
}
.card h3 {
    font:700 21px Montserrat,sans-serif;
    color:#222;
    margin:10px 0
}
.card p {
    color:var(--muted);
    line-height:1.7
}
.noteGrid {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:24px
}
.noteCard {
    border:1px solid var(--line);
    background:#fff;
    display:grid;
    grid-template-columns:150px 1fr;
    min-height:180px;
    overflow:hidden;
    transition:.25s
}
.noteCard:hover {
    transform:translateY(-3px);
    box-shadow:var(--shadow)
}
.noteCard img {
    width:150px;
    height:100%;
    object-fit:cover
}
.noteCard .noteBody {
    padding:20px
}
.date {
    font-size:12px;
    color:#666;
    font-weight:700
}
.noteCard h3 {
    font:700 20px/1.25 Montserrat;
    margin:9px 0
}
.noteCard p {
    font-size:13px;
    line-height:1.6;
    color:var(--muted);
    margin:0
}
.contactGrid {
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:35px
}
.locations {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px
}
.location {
    border:1px solid var(--line);
    padding:22px;
    background:#fff
}
.location strong {
    font:700 18px Montserrat;
    color:#222
}
.location small {
    display:block;
    color:var(--orange);
    margin:5px 0 10px;
    font-weight:700
}
.location p {
    color:var(--muted);
    font-size:14px;
    line-height:1.6
}
.footer {
    background:var(--green);
    color:#e9f5f4;
    padding:55px 0 20px
}
.footerGrid {
    display:grid;
    grid-template-columns:1.3fr 1fr 1fr 1fr;
    gap:35px
}
.footer .footerMark {
    color:#fff
}
.footer .footerMark i {
    color:var(--orange)
}
.footer h4 {
    font-size:12px;
    letter-spacing:1px;
    color:#fff
}
.footer a {
    display:block;
    font-size:13px;
    margin:11px 0;
    color:#e2f1f0
}
.footer .brandMark {
    color:#fff
}
.footer .brand small {
    color:#d9eeec
}
.copyright {
    border-top:1px solid rgba(255,255,255,.15);
    margin-top:40px;
    padding-top:18px;
    font-size:12px;
    display:flex;
    justify-content:space-between
}
.whatsapp {
    position:fixed;
    right:20px;
    bottom:20px;
    background:#25d366;
    color:#fff;
    border-radius:50%;
    width:55px;
    height:55px;
    display:grid;
    place-items:center;
    font-weight:700;
    z-index:60;
    box-shadow:0 10px 25px rgba(0,0,0,.18)
}
.cookie {
    position:fixed;
    left:20px;
    right:20px;
    bottom:20px;
    max-width:650px;
    background:#fff;
    border:1px solid var(--line);
    box-shadow:var(--shadow);
    padding:20px;
    z-index:70;
    display:none
}
.cookie.show {
    display:block
}
.cookie h4 {
    margin:0 0 7px;
    font-family:Montserrat
}
.cookie p {
    font-size:13px;
    color:var(--muted);
    line-height:1.5
}
.pageHero {
    background:#fff;
    padding:38px 0 28px;
    border-bottom:1px solid var(--line)
}
.pageHero .wrap {
    position:relative
}
.pageHero .wrap:before {
    content:'';
    display:block;
    width:42px;
    height:3px;
    background:var(--orange);
    margin-bottom:14px
}
.pageHero h1 {
    font:700 clamp(32px,4vw,46px)/1.08 Montserrat,sans-serif;
    margin:0 0 9px;
    color:#222;
    letter-spacing:-.4px
}
.pageHero p {
    max-width:720px;
    line-height:1.7;
    margin:0;
    color:var(--muted);
    font-size:16px
}
.article {
    padding:58px 0 75px;
    background:#fff
}
.articleHead {
    max-width:900px;
    margin:auto
}
.articleHead h1 {
    font:700 clamp(34px,5vw,50px)/1.08 Montserrat,sans-serif;
    color:#222;
    margin:14px 0 12px;
    letter-spacing:-.5px
}
.articleMeta {
    color:#666;
    font-size:13px;
    font-weight:600
}
.articleImage {
    width:100%;
    max-height:520px;
    object-fit:cover;
    margin:30px 0
}
.articleBody {
    max-width:850px;
    margin:auto;
    font-size:17px;
    line-height:1.9;
    color:#435452
}
.articleBody h2 {
    font:700 28px Montserrat,sans-serif;
    color:#222;
    margin-top:38px;
    margin-bottom:12px
}
.articleBody ul {
    padding-left:25px
}
.searchBox {
    display:flex;
    gap:8px;
    margin:35px 0
}
.searchBox input {
    flex:1;
    padding:13px;
    border:1px solid var(--line)
}
@media(max-width:850px) {
    .topbar {
        display:none
    }
    .navwrap {
        height:72px
    }
    .menuBtn {
        display:block
    }
    .nav {
        position:absolute;
        top:72px;
        left:0;
        right:0;
        background:#fff;
        display:none;
        flex-direction:column;
        align-items:stretch;
        padding:10px 20px;
        border-bottom:1px solid var(--line);
        gap:0
    }
    .nav.open {
        display:flex
    }
    .nav a {
        padding:15px 0
    }
    .nav a.active:after {
        bottom:8px
    }
    .langToggle {
        margin:10px 0;
        text-align:left
    }
    .hero {
        height:calc(100vh - 72px);
        min-height:570px
    }
    .heroCopy {
        left:25px;
        right:25px;
        bottom:13%
    }
    .heroCopy h1 {
        font-size:42px
    }
    .heroCopy p {
        font-size:15px
    }
    .two,.contactGrid {
        grid-template-columns:1fr;
        gap:35px
    }
    .cardGrid {
        grid-template-columns:1fr
    }
    .noteGrid {
        grid-template-columns:1fr
    }
    .noteCard {
        grid-template-columns:120px 1fr
    }
    .noteCard img {
        width:120px
    }
    .locations {
        grid-template-columns:1fr
    }
    .footerGrid {
        grid-template-columns:1fr 1fr
    }
    .pageHero {
        padding:30px 0 24px
    }
    .pageHero h1 {
        font-size:36px
    }
    .articleHead h1 {
        font-size:36px
    }
    .section {
        padding:65px 0
    }
}
@media(max-width:500px) {
    .wrap {
        width:min(100% - 28px,1160px)
    }
    .brandMark {
        font-size:36px
    }
    .heroCopy h1 {
        font-size:34px
    }
    .heroCopy p {
        font-size:14px
    }
    .noteCard {
        grid-template-columns:1fr
    }
    .noteCard img {
        width:100%;
        height:180px
    }
    .footerGrid {
        grid-template-columns:1fr
    }
    .copyright {
        display:block
    }
    .copyright>* {
        display:block;
        margin:7px 0
    }
    .article {
        padding:45px 0
    }
    .articleBody {
        font-size:16px
    }
}
.quoteNav {
    font-weight:600
}
.quoteSection {
    background:#f3f7f6
}
.quoteLayout {
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(320px,.85fr);
    gap:26px;
    align-items:start
}
.quoteCatalog,.quoteSummary {
    background:#fff;
    border:1px solid var(--line);
    box-shadow:var(--shadow)
}
.quoteCatalog {
    padding:22px
}
.quoteSummary {
    padding:24px;
    position:sticky;
    top:105px
}
.searchBox {
    margin:0 0 18px
}
.searchBox input {
    font:inherit;
    border-radius:2px
}
.examResults {
    max-height:560px;
    overflow:auto;
    border-top:1px solid var(--line)
}
.examRow,.selectedRow {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;
    padding:13px 4px;
    border-bottom:1px solid var(--line)
}
.examRow>div,.selectedRow>div {
    min-width:0
}
.examRow strong,.selectedRow strong {
    display:block;
    font-size:14px;
    line-height:1.35
}
.examRow span,.selectedRow span {
    display:block;
    color:var(--muted);
    font-weight:800;
    margin-top:4px;
    font-size:13px
}
.smallBtn {
    min-height:36px;
    padding:0 12px;
    background:#fff;
    border:1px solid var(--green);
    color:var(--green)
}
.smallBtn:disabled {
    opacity:.45;
    cursor:not-allowed
}
.summaryHead {
    display:flex;
    justify-content:space-between;
    gap:10px;
    align-items:center
}
.summaryHead h3,.quoteForm h3 {
    font:700 20px Montserrat;
    margin:0;
    color:#222
}
.summaryHead span {
    font-size:12px;
    color:var(--muted)
}
.selectedExams {
    margin:16px 0;
    max-height:300px;
    overflow:auto
}
.removeExam {
    border:0;
    background:none;
    color:var(--muted);
    font-size:12px;
    font-weight:700;
    cursor:pointer
}
.summaryTotal {
    display:flex;
    justify-content:space-between;
    align-items:center;
    border-top:2px solid var(--green);
    padding-top:14px;
    margin-top:10px
}
.summaryTotal span {
    font-weight:800;
    color:var(--green2)
}
.summaryTotal strong {
    font:800 28px Montserrat;
    color:var(--green)
}
.quoteForm {
    margin-top:22px;
    padding-top:20px;
    border-top:1px solid var(--line)
}
.quoteForm label {
    display:block;
    font-size:12px;
    font-weight:700;
    color:#333;
    margin-top:12px
}
.quoteForm input {
    display:block;
    width:100%;
    margin-top:5px;
    padding:12px;
    border:1px solid var(--line);
    font:inherit
}
.pdfBtn {
    width:100%;
    margin-top:18px;
    background:var(--green)
}
.pdfNote,.quoteMsg {
    font-size:12px;
    line-height:1.5;
    color:var(--muted)
}
.quoteMsg {
    color:#333;
    font-weight:700
}
.emptyState {
    padding:18px;
    color:var(--muted);
    font-size:14px
}
.selectedRow {
    padding:10px 0
}
@media(max-width:850px) {
    .quoteLayout {
        grid-template-columns:1fr
    }
    .quoteSummary {
        position:static
    }
    .examResults {
        max-height:450px
    }
    .nav .quoteNav {
        color:#111!important
    }
    .nav .quoteNav:hover {
        color:var(--green)!important
    }
    .nav .quoteNav.active {
        color:#111!important
    }
}
@media(max-width:500px) {
    .quoteLayout {
        gap:15px
    }
    .quoteCatalog,.quoteSummary {
        padding:16px
    }
    .examRow {
        align-items:flex-start
    }
    .examRow .smallBtn {
        flex:0 0 auto
    }
    .summaryTotal strong {
        font-size:24px
    }
}
.locationTop {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap
}
.principalBadge {
    display:inline-flex;
    align-items:center;
    padding:4px 9px;
    border:1px solid var(--green);
    color:var(--green);
    font-size:10px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.6px;
    border-radius:20px
}
.location.principal {
    border:2px solid var(--green);
    box-shadow:0 8px 24px rgba(0,161,155,.10)
}
.location.principal strong {
    color:var(--green)
}
.location p {
    margin-bottom:8px
}
.emptyState {
    padding:18px;
    color:var(--muted);
    font-size:14px
}
.quoteSection {
    background:var(--soft)
}
.quoteCatalog,.quoteSummary {
    box-shadow:0 8px 24px rgba(30,70,68,.06)
}
@media(max-width:850px) {
    .nav .active:after {
        bottom:8px
    }
    .nav .langToggle {
        width:100%;
        border:0;
        border-top:1px solid var(--line);
        border-radius:0
    }
    .topbar {
        display:none
    }
}
@media(max-width:500px) {
    .wrap {
        width:min(100% - 28px,1160px)
    }
    .quoteLayout {
        width:100%
    }
    .quoteCatalog,.quoteSummary {
        min-width:0
    }
    .searchBox {
        flex-wrap:wrap
    }
    .searchBox input {
        min-width:0
    }
    .searchBox .btn {
        flex:0 0 auto
    }
    .locationTop {
        align-items:flex-start
    }
    .principalBadge {
        margin-left:0
    }
}
/* Logotipo oficial PNG, compartido en cabecera y pie de página. */ .brandLogo {
    height:46px;
    width:auto;
    display:block
}
.footerLogo {
    height:46px
}
@media(max-width:850px) {
    .brandLogo {
        height:40px
    }
}
@media(max-width:500px) {
    .brandLogo {
        height:36px
    }
    .footerLogo {
        height:40px
    }
}
/* Valores monetarios del cotizador en el gris existente (--muted) */ .examRow .price,.selectedRow .price,.summaryTotal strong.price,.price {
    color:var(--muted)
}
/* Artículos completos: elementos adicionales (autor, subtítulos, figuras, citas) */ .articleAuthor {
    color:#666;
    font-size:13px;
    font-weight:600;
    margin-top:4px
}
.articleBody h3 {
    font:700 22px Montserrat,sans-serif;
    color:#222;
    margin:30px 0 10px
}
.articleBody ol {
    padding-left:25px
}
.articleBody figure {
    margin:28px 0
}
.articleBody figure img {
    width:100%;
    max-height:480px;
    object-fit:cover
}
.articleBody figcaption {
    font-size:13px;
    color:var(--muted);
    margin-top:8px
}
.articleBody blockquote {
    margin:26px 0;
    padding:6px 0 6px 20px;
    border-left:3px solid var(--green);
    color:#2c3f3e
}
/* Inicio en móvil: la foto se ve completa arriba y el texto va debajo, sin tapar a las personas */ @media(max-width:700px) {
    .hero {
        --band:clamp(280px,62vw,420px);
        height:calc(var(--band) + 385px);
        min-height:0
    }
    .slide {
        background-repeat:no-repeat;
        background-color:#0f2d2c;
        background-size:max(100%,calc(var(--band)*1.4988)) auto;
        background-position:var(--px,50%) 0
    }
    .slide:after {
        inset:var(--band) 0 0 0;
        background:#0f2d2c
    }
    .heroCopy {
        top:calc(var(--band) + 22px);
        bottom:auto;
        left:22px;
        right:22px
    }
    .heroCopy h1 {
        font-size:28px;
        line-height:1.1;
        margin:10px 0
    }
    .heroCopy p {
        font-size:14px;
        line-height:1.55;
        margin:0 0 20px
    }
    .dots {
        bottom:16px
    }
}
/* Ajustes puntuales solicitados: barra superior, redes, pie de página y WhatsApp */ .topbar {
    padding:9px 0
}
.topbar .wrap {
    display:grid;
    grid-template-columns:1fr auto auto;
    align-items:center;
    gap:26px
}
.topbar .topBrand {
    font-weight:700;
    letter-spacing:.35px
}
.topbar .topContact {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    white-space:nowrap
}
.topbar .topSocial {
    display:flex;
    align-items:center;
    gap:12px
}
.topSocial a {
    width:20px;
    height:20px;
    display:grid;
    place-items:center;
    color:#fff;
    opacity:.94;
    transition:opacity .2s ease,transform .2s ease
}
.topSocial a:hover {
    opacity:1;
    transform:translateY(-2px)
}
.topSocial svg {
    width:18px;
    height:18px;
    fill:currentColor;
    display:block
}
.footer {
    background:#3c4548;
    color:#f2f4f4
}
.footer h4 {
    font-size:13px;
    font-weight:800;
    letter-spacing:1px;
    color:#fff;
    margin:0 0 18px
}
.footer a {
    color:#d5dddd;
    transition:color .18s ease
}
.footer a:hover {
    color:#fff
}
.footer .footerLogo {
    object-fit:contain;
    object-position:left center
}
.copyright {
    border-top-color:rgba(255,255,255,.18)
}
.whatsapp {
    width:58px;
    height:58px;
    padding:13px;
    animation:waFloat 3.5s ease-in-out infinite;
    transition:transform .2s ease,box-shadow .2s ease
}
.whatsapp svg {
    width:100%;
    height:100%;
    display:block
}
.whatsapp:hover {
    transform:translateY(-3px) scale(1.035);
    box-shadow:0 12px 28px rgba(0,0,0,.24)
}
.waTooltip {
    position:absolute;
    right:68px;
    bottom:8px;
    width:max-content;
    max-width:min(300px,calc(100vw - 120px));
    background:#263331;
    color:#fff;
    padding:10px 13px;
    border-radius:7px;
    font-size:12px;
    line-height:1.45;
    font-weight:600;
    box-shadow:0 6px 20px rgba(0,0,0,.18);
    opacity:0;
    visibility:hidden;
    transform:translateX(5px);
    transition:opacity .2s ease,transform .2s ease,visibility .2s
}
.whatsapp:hover .waTooltip,.whatsapp:focus-visible .waTooltip {
    opacity:1;
    visibility:visible;
    transform:translateX(0)
}
@keyframes waFloat {
    0%,100% {
        transform:translateY(0)
    }
    50% {
        transform:translateY(-3px)
    }
}
@media(max-width:850px) {
    .topbar .wrap {
        grid-template-columns:1fr auto;
        gap:10px 18px
    }
    .topbar .topBrand {
        grid-column:1/-1;
        text-align:center
    }
    .topbar .topContact {
        justify-content:flex-start
    }
    .topbar .topSocial {
        justify-content:flex-end
    }
}
@media(max-width:500px) {
    .topbar {
        font-size:11px
    }
    .topbar .wrap {
        width:calc(100% - 24px);
        grid-template-columns:1fr;
        justify-items:center;
        gap:8px
    }
    .topbar .topBrand {
        grid-column:auto;
        font-size:10px
    }
    .topbar .topContact {
        flex-wrap:wrap;
        justify-content:center;
        gap:6px
    }
    .topbar .topSocial {
        justify-content:center;
        gap:18px
    }
    .topSocial a {
        width:22px;
        height:22px
    }
    .topSocial svg {
        width:19px;
        height:19px
    }
    .footer {
        padding-top:42px
    }
    .footerGrid {
        gap:24px
    }
    .footer h4 {
        margin-bottom:12px
    }
    .whatsapp {
        right:14px;
        bottom:14px;
        width:54px;
        height:54px
    }
    .waTooltip {
        right:62px;
        max-width:calc(100vw - 100px)
    }
}
@media(prefers-reduced-motion:reduce) {
    .whatsapp,.topSocial a {
        animation:none;
        transition:none
    }
    .whatsapp:hover {
        transform:none
    }
}
/* Correcciones puntuales de Contacto: botones de mapa y formulario de consulta */ .locationMapBtn {
    min-height:34px;
    padding:0 12px;
    margin-top:5px;
    font-size:12px;
    border-color:var(--line);
    width:max-content;
    max-width:100%
}
.contactForm {
    margin-top:16px;
    padding-top:14px;
    border-top:1px solid var(--line)
}
.contactForm label {
    display:block;
    margin-top:12px;
    font-size:12px;
    font-weight:700;
    color:#333
}
.contactForm input,.contactForm textarea {
    display:block;
    width:100%;
    margin-top:5px;
    padding:11px;
    border:1px solid var(--line);
    border-radius:2px;
    font:inherit;
    font-size:14px;
    color:#222;
    background:#fff
}
.contactForm textarea {
    resize:vertical;
    min-height:96px
}
.contactSubmit {
    margin-top:14px;
    min-height:40px;
    padding:0 16px;
    border-color:var(--line);
    font-size:12px
}
.contactFormNote,.contactFormMsg {
    font-size:12px;
    line-height:1.5;
    color:var(--muted)
}
.contactFormMsg {
    font-weight:700
}
/* Vista Login: estilos locales para integrarse con los componentes existentes */ .loginSection {
    padding:64px 0 76px;
    background:#fff
}
.loginCard {
    width:min(100%,480px);
    margin:0 auto;
    padding:30px;
    border:1px solid var(--line);
    background:#fff;
    box-shadow:var(--shadow)
}
.loginCard .kicker {
    margin:0 0 10px
}
.loginCard h1 {
    font:700 clamp(30px,4vw,38px)/1.12 Montserrat,sans-serif;
    margin:0 0 12px;
    color:#222
}
.loginLead {
    color:var(--muted);
    font-size:14px;
    line-height:1.65;
    margin:0 0 22px
}
.loginForm label {
    display:block;
    margin:14px 0 6px;
    font-size:12px;
    font-weight:700;
    color:#333
}
.loginForm input {
    display:block;
    width:100%;
    min-height:44px;
    padding:11px 12px;
    border:1px solid var(--line);
    border-radius:2px;
    font:inherit;
    color:#222;
    background:#fff
}
.loginForm input:focus {
    outline:2px solid rgba(0,161,155,.28);
    border-color:var(--green)
}
.loginSubmit {
    width:100%;
    margin-top:20px
}
.loginLinks {
    display:flex;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
    margin-top:18px;
    font-size:12px
}
.loginLinks a {
    color:var(--green);
    text-decoration:underline;
    text-underline-offset:3px
}
.loginLinks a:hover {
    color:var(--orange)
}
.loginNotice {
    margin-top:18px;
    padding:13px;
    border-left:3px solid var(--orange);
    background:#f2f4f4;
    color:#333;
    font-size:13px;
    line-height:1.6
}
.loginNotice[hidden] {
    display:none
}
.loginPortal {
    margin-top:12px
}
@media(max-width:500px) {
    .loginSection {
        padding:38px 0 48px
    }
    .loginCard {
        padding:22px
    }
    .loginLinks {
        flex-direction:column;
        gap:12px
    }
}


/* Ajustes puntuales de legibilidad del encabezado LABS. */
.topbar {
    padding: 10px 0;
    font-size: 12.5px;
}
.topbar .wrap {
    align-items: center;
}
.navwrap {
    height: 92px;
    gap: 32px;
}
.brandLogo {
    height: 50px;
    width: auto;
    object-fit: contain;
}
@media (max-width: 850px) {
    .navwrap {
        height: 82px;
    }
    .brandLogo {
        height: 43px;
    }
    .topbar {
        padding: 9px 0;
    }
}
@media (max-width: 500px) {
    .navwrap {
        height: 74px;
        gap: 14px;
    }
    .brandLogo {
        height: 38px;
        max-width: min(58vw, 210px);
    }
    .topbar {
        font-size: 11px;
    }
}