:root{
    --navy:#07111f;
    --navy-2:#0b1b2f;
    --navy-3:#0d2744;
    --blue:#2494ff;
    --blue-2:#38bdf8;
    --blue-3:#2563eb;
    --text:#d9e6f2;
    --muted:#98aac0;
    --white:#ffffff;
    --light:#f6f8fb;
    --ink:#0d1320;
    --line:rgba(255,255,255,.10);
    --line-light:#dfe6ee;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    background:var(--navy);
    color:var(--text);
    line-height:1.6;
}
img{display:block;max-width:100%}
a{color:inherit}
.container{width:min(1220px,calc(100% - 2rem));margin-inline:auto}

.site-header{
    position:sticky;top:0;z-index:100;
    background:rgba(6,17,30,.94);
    backdrop-filter:blur(16px);
    border-bottom:1px solid var(--line);
}
.header-inner{
    min-height:86px;
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:2rem;
}
.brand img{width:270px}
.main-nav{
    display:flex;
    justify-content:center;
    gap:1.55rem;
    align-items:center;
}
.main-nav a{
    position:relative;
    text-decoration:none;
    color:#d8e4ef;
    font-size:.94rem;
}
.main-nav a:hover,.main-nav a.active{color:#fff}
.main-nav a.active::after{
    content:"";
    position:absolute;
    left:0;right:0;bottom:-14px;
    height:2px;background:var(--blue);
}
.header-cta{
    min-height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:.65rem 1rem;
    border:1px solid var(--blue);
    border-radius:9px;
    text-decoration:none;
    color:#fff;
}
.nav-toggle{display:none}

.hero{
    position:relative;
    overflow:hidden;
    padding:4.5rem 0 2rem;
    background:
        radial-gradient(circle at 80% 22%,rgba(36,148,255,.16),transparent 28rem),
        linear-gradient(180deg,#07111f 0%,#071523 60%,#08111d 100%);
}
.hero-grid-bg{
    position:absolute;inset:0;
    opacity:.15;
    background-image:
        linear-gradient(rgba(36,148,255,.08) 1px,transparent 1px),
        linear-gradient(90deg,rgba(36,148,255,.08) 1px,transparent 1px);
    background-size:42px 42px;
    mask-image:linear-gradient(to bottom,transparent,black 20%,black 80%,transparent);
}
.hero-layout{
    position:relative;
    display:grid;
    grid-template-columns:1.02fr .98fr;
    gap:2.5rem;
    align-items:center;
}
.pill{
    display:inline-flex;
    border:1px solid rgba(36,148,255,.65);
    border-radius:999px;
    padding:.38rem .82rem;
    color:var(--blue-2);
    font-size:.74rem;
    font-weight:800;
    letter-spacing:.13em;
}
.hero h1{
    margin:1rem 0 1.15rem;
    color:#fff;
    font-size:clamp(3.4rem,6.6vw,6.1rem);
    line-height:.96;
    letter-spacing:-.055em;
}
.hero h1 span{color:var(--blue)}
.hero-lead{
    max-width:690px;
    color:#bdc9d7;
    font-size:1.14rem;
}
.hero-points{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1.5rem;
    margin:2rem 0;
}
.hero-point{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:.9rem;
}
.point-icon{
    width:52px;height:52px;
    display:grid;place-items:center;
    border:1px solid var(--blue);
    border-radius:50%;
    color:var(--blue-2);
    font-weight:800;
}
.hero-point h2{
    margin:0 0 .2rem;
    color:var(--blue-2);
    font-size:1rem;
}
.hero-point p{margin:0;color:var(--muted);font-size:.91rem}
.hero-actions{display:flex;gap:.8rem;flex-wrap:wrap}
.btn{
    min-height:48px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:.75rem 1.25rem;
    border-radius:8px;
    text-decoration:none;
    font-weight:700;
}
.btn-primary{background:linear-gradient(90deg,#1687ff,#38bdf8);color:#fff}
.btn-outline{border:1px solid #55708b;color:#fff}

.hero-visual{
    position:relative;
    min-height:560px;
    display:flex;
    align-items:center;
    justify-content:center;
}
.hero-visual>img{
    width:min(100%,560px);
    filter:drop-shadow(0 0 30px rgba(36,148,255,.18));
}
.ai-card{
    position:absolute;
    right:0;
    bottom:38px;
    width:min(290px,54%);
    padding:1.35rem;
    border:1px solid rgba(36,148,255,.28);
    border-radius:16px;
    background:rgba(7,29,50,.88);
    box-shadow:0 24px 60px rgba(0,0,0,.28);
    backdrop-filter:blur(12px);
}
.ai-card-kicker{color:var(--blue-2)}
.ai-card h2{margin:.45rem 0 .7rem;color:#fff;font-size:1.15rem;line-height:1.25}
.ai-card h2 strong{color:var(--blue-2);font-size:1.45rem}
.ai-card p{margin:0;color:#a9bacb;font-size:.9rem}
.ai-card a{display:inline-block;margin-top:1rem;color:var(--blue-2);text-decoration:none;font-weight:700;font-size:.9rem}

.process-strip{
    position:relative;
    margin-top:2rem;
    padding:1.4rem 1.2rem 1.1rem;
    border:1px solid rgba(36,148,255,.22);
    border-radius:18px;
    background:linear-gradient(180deg,rgba(8,43,72,.82),rgba(6,29,49,.76));
}
.process-title{
    margin:0 0 1.1rem;
    text-align:center;
    color:var(--blue);
    font-size:.76rem;
    font-weight:800;
    letter-spacing:.08em;
}
.process-strip ol{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:1rem;
    padding:0;
    margin:0;
    list-style:none;
}
.process-strip li{
    text-align:center;
    position:relative;
    padding:.4rem .55rem;
}
.process-strip li:not(:last-child)::after{
    content:"→";
    position:absolute;
    right:-.8rem;
    top:1.45rem;
    color:#71869b;
    font-size:1.45rem;
}
.process-strip li>span{
    width:34px;height:34px;
    margin:0 auto .55rem;
    display:grid;place-items:center;
    border-radius:50%;
    background:linear-gradient(180deg,#3da9ff,#1481e8);
    color:#fff;
    font-weight:800;
}
.process-strip strong{display:block;color:#fff}
.process-strip p{margin:.25rem auto 0;max-width:190px;color:#a7b7c8;font-size:.78rem;line-height:1.45}

.trust-strip{padding:2.2rem 0;background:#07111f}
.trust-strip>div>p{
    text-align:center;
    color:var(--blue);
    font-size:.73rem;
    font-weight:800;
    letter-spacing:.12em;
}
.trust-grid{
    margin-top:1.3rem;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:1rem;
    align-items:center;
}
.trust-grid span{
    text-align:center;
    color:#d2deea;
    font-size:.88rem;
    font-weight:700;
    opacity:.8;
}

.section{padding:6rem 0;background:#fff;color:var(--ink)}
.section-light{background:var(--light)}
.section-dark{background:#081626;color:#fff}
.section-kicker{
    margin:0 0 .7rem;
    color:var(--blue-3);
    font-size:.76rem;
    font-weight:800;
    letter-spacing:.12em;
}
.section h2{
    max-width:800px;
    margin:0 0 2.4rem;
    font-size:clamp(2.2rem,4.7vw,4.3rem);
    line-height:1.02;
    letter-spacing:-.04em;
}
.cards{display:grid;gap:1rem}
.cards.three{grid-template-columns:repeat(3,1fr)}
.card{
    border:1px solid var(--line-light);
    border-radius:16px;
    padding:1.5rem;
    background:#fff;
}
.product-card .status{
    display:inline-flex;
    color:var(--blue-3);
    font-size:.7rem;
    font-weight:800;
    letter-spacing:.11em;
}
.product-card h3{margin:.55rem 0;color:var(--ink);font-size:1.35rem}
.product-card p{margin:0;color:#64748b}
.product-card strong{display:block;margin-top:1rem;color:var(--ink)}

.project-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1rem;
}
.project-grid article{
    padding:1.6rem;
    border:1px solid var(--line-light);
    border-radius:14px;
}
.project-grid h3{margin:0 0 .4rem}
.project-grid p{margin:0;color:#64748b}

.ai-section{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:3rem;
}
.section-dark .section-kicker{color:var(--blue-2)}
.section-dark h2{color:#fff}
.ai-section p{color:#c0cfdd;font-size:1.08rem}
.ai-section .emphasis{color:#fff;font-weight:800}

.tech-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:1rem;
}
.tech-grid article{
    padding:1.4rem;
    border:1px solid var(--line-light);
    border-radius:14px;
    background:#fff;
}
.tech-grid strong{color:var(--ink)}
.tech-grid p{margin:.35rem 0 0;color:#64748b}

.contact-section{background:#f8fafc}
.contact-wrap{max-width:900px}
.contact-wrap>p:not(.section-kicker){font-size:1.08rem;color:#64748b}
.contact-pending{
    display:block;
    margin-top:1.5rem;
    padding:1rem;
    border-left:4px solid var(--blue);
    background:#fff;
    color:#64748b;
}

.site-footer{
    padding:2rem 0;
    background:#050b13;
    color:#8ea0b2;
}
.footer-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:2rem;
}
.footer-inner img{width:220px}
.footer-inner p{margin:0;font-size:.84rem}

@media(max-width:1050px){
    .header-inner{grid-template-columns:auto auto}
    .main-nav{
        display:none;
        grid-column:1/-1;
        flex-direction:column;
        align-items:stretch;
        padding-bottom:1rem;
    }
    .main-nav.is-open{display:flex}
    .header-cta{display:none}
    .nav-toggle{
        display:inline-flex;
        justify-self:end;
        border:1px solid rgba(255,255,255,.25);
        background:transparent;
        color:#fff;
        padding:.55rem .75rem;
        border-radius:8px;
    }
    .hero-layout{grid-template-columns:1fr}
    .hero-visual{min-height:500px}
    .process-strip ol{grid-template-columns:repeat(3,1fr)}
    .process-strip li::after{display:none}
    .trust-grid{grid-template-columns:repeat(3,1fr)}
    .cards.three{grid-template-columns:1fr}
    .tech-grid{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:720px){
    .container{width:min(100% - 1.25rem,1220px)}
    .header-inner{min-height:70px}
    .brand img{width:210px}
    .hero{padding-top:3rem}
    .hero h1{font-size:clamp(3rem,15vw,4.7rem)}
    .hero-points{grid-template-columns:1fr}
    .hero-visual{min-height:420px}
    .hero-visual>img{width:100%}
    .ai-card{
        position:relative;
        right:auto;bottom:auto;
        width:100%;
        margin-top:-1rem;
    }
    .process-strip ol{grid-template-columns:1fr}
    .trust-grid{grid-template-columns:1fr 1fr}
    .project-grid{grid-template-columns:1fr}
    .ai-section{grid-template-columns:1fr}
    .tech-grid{grid-template-columns:1fr}
    .footer-inner{align-items:flex-start;flex-direction:column}
}

/* V2.1 — Corrección responsive del Hero y enlaces de proyectos */
.project-card {
    display: flex;
    min-height: 190px;
    flex-direction: column;
}

.project-card a {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    width: fit-content;
    margin-top: auto;
    padding-top: 1.1rem;
    color: var(--blue-3);
    font-weight: 800;
    text-decoration: none;
}

.project-card a:hover,
.project-card a:focus-visible {
    text-decoration: underline;
}

.project-soon {
    display: inline-flex;
    width: fit-content;
    margin-top: auto;
    padding-top: 1.1rem;
    color: #64748b;
    font-size: .86rem;
    font-weight: 700;
}

@media (max-width: 720px) {
    body {
        overflow-x: hidden;
    }

    .hero {
        padding-top: 2.25rem;
    }

    .hero-layout {
        display: flex;
        flex-direction: column;
        gap: 2rem;
    }

    .hero-copy,
    .hero-visual {
        width: 100%;
        min-width: 0;
    }

    .hero h1 {
        overflow-wrap: anywhere;
    }

    .hero-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    .hero-actions .btn {
        width: 100%;
    }

    .hero-visual {
        min-height: 0;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        overflow: visible;
    }

    .hero-visual > img {
        order: 2;
        width: min(100%, 520px);
        margin: 1.2rem auto 0;
    }

    .ai-card {
        order: 1;
        position: static;
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 1.25rem;
    }

    .hero-points {
        margin-top: 1.4rem;
    }

    .process-strip {
        margin-top: 1.4rem;
        padding: 1.15rem .85rem;
    }

    .process-strip ol {
        grid-template-columns: 1fr;
    }

    .process-strip li {
        display: grid;
        grid-template-columns: 42px 1fr;
        column-gap: .8rem;
        text-align: left;
        align-items: start;
        padding: .65rem 0;
    }

    .process-strip li > span {
        grid-row: 1 / span 2;
        margin: 0;
    }

    .process-strip strong {
        align-self: end;
    }

    .process-strip p {
        max-width: none;
        margin: .15rem 0 0;
    }

    .trust-grid {
        grid-template-columns: 1fr;
        gap: .75rem;
    }

    .trust-grid span {
        padding: .6rem .4rem;
        border-bottom: 1px solid rgba(255,255,255,.08);
    }

    .project-grid {
        grid-template-columns: 1fr;
    }

    .project-card {
        min-height: 0;
    }
}

/* V3 — Portfolio / Proyectos */
.projects-section {
    background:
        linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.projects-heading {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(280px, .65fr);
    gap: 3rem;
    align-items: end;
    margin-bottom: 2.5rem;
}

.projects-heading h2 {
    margin-bottom: 0;
}

.projects-intro {
    margin: 0 0 .35rem;
    color: #64748b;
    font-size: 1.03rem;
}

.portfolio-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}

.portfolio-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #dfe6ee;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(15, 23, 42, .055);
    transition: transform .2s ease, box-shadow .2s ease;
}

.portfolio-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 42px rgba(15, 23, 42, .09);
}

.portfolio-wide {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(260px, .68fr) 1.32fr;
}

.portfolio-visual {
    position: relative;
    min-height: 230px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1.5rem;
    overflow: hidden;
    isolation: isolate;
    color: #fff;
    background: #0b1b2f;
}

.portfolio-visual::before,
.portfolio-visual::after {
    content: "";
    position: absolute;
    z-index: -1;
    border-radius: 999px;
    filter: blur(4px);
}

.portfolio-visual::before {
    width: 290px;
    height: 290px;
    right: -80px;
    top: -90px;
    background: rgba(37, 99, 235, .42);
}

.portfolio-visual::after {
    width: 220px;
    height: 220px;
    left: -70px;
    bottom: -105px;
    background: rgba(56, 189, 248, .18);
}

.portfolio-serrana .portfolio-visual {
    background: linear-gradient(135deg, #121212, #342718);
}

.portfolio-terraza .portfolio-visual {
    background: linear-gradient(135deg, #203127, #6a6344);
}

.portfolio-sea .portfolio-visual {
    background: linear-gradient(135deg, #071a2e, #07679b);
}

.portfolio-magistrati .portfolio-visual {
    background: linear-gradient(135deg, #161c27, #455468);
}

.portfolio-metodo .portfolio-visual {
    min-height: 100%;
    background: linear-gradient(135deg, #081626, #233c72);
}

.portfolio-code {
    font-size: clamp(4rem, 8vw, 7.5rem);
    line-height: .8;
    letter-spacing: -.08em;
    font-weight: 900;
    opacity: .92;
}

.portfolio-visual-label {
    width: fit-content;
    padding: .35rem .65rem;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .12em;
}

.portfolio-content {
    display: flex;
    min-height: 300px;
    flex-direction: column;
    padding: 1.55rem;
}

.portfolio-wide .portfolio-content {
    min-height: 270px;
    justify-content: center;
}

.portfolio-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin-bottom: .75rem;
}

.portfolio-meta span {
    padding: .28rem .55rem;
    border-radius: 999px;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: .69rem;
    font-weight: 800;
}

.portfolio-content h3 {
    margin: 0 0 .55rem;
    color: #0d1320;
    font-size: 1.55rem;
    line-height: 1.15;
}

.portfolio-content > p {
    margin: 0;
    color: #64748b;
}

.portfolio-work {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem .8rem;
    margin-top: 1.2rem;
    color: #334155;
    font-size: .82rem;
    font-weight: 700;
}

.portfolio-work span {
    position: relative;
}

.portfolio-work span:not(:last-child)::after {
    content: "·";
    position: absolute;
    right: -.55rem;
    color: #94a3b8;
}

.portfolio-link,
.portfolio-coming {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    width: fit-content;
    margin-top: auto;
    padding-top: 1.35rem;
    font-weight: 850;
}

.portfolio-link {
    color: #2563eb;
    text-decoration: none;
}

.portfolio-link:hover,
.portfolio-link:focus-visible {
    text-decoration: underline;
}

.portfolio-coming {
    color: #64748b;
    font-size: .88rem;
}

@media (max-width: 900px) {
    .projects-heading {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .portfolio-wide {
        grid-template-columns: 1fr;
    }

    .portfolio-metodo .portfolio-visual {
        min-height: 230px;
    }
}

@media (max-width: 720px) {
    .portfolio-grid {
        grid-template-columns: 1fr;
    }

    .portfolio-wide {
        grid-column: auto;
        display: block;
    }

    .portfolio-visual {
        min-height: 185px;
    }

    .portfolio-code {
        font-size: 5rem;
    }

    .portfolio-content {
        min-height: 0;
    }

    .portfolio-link,
    .portfolio-coming {
        margin-top: 1.2rem;
        padding-top: 0;
    }
}

/* V4 — Productos propios */
.products-section {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 86% 12%, rgba(37, 99, 235, .08), transparent 24rem),
        linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
}

.products-heading {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(280px, .68fr);
    gap: 3rem;
    align-items: end;
    margin-bottom: 2.6rem;
}

.products-heading h2 {
    margin-bottom: 0;
}

.products-intro {
    margin: 0 0 .35rem;
    color: #64748b;
    font-size: 1.03rem;
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.2rem;
}

.product-feature {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 560px;
    flex-direction: column;
    overflow: hidden;
    padding: 1.45rem;
    border: 1px solid #dfe6ee;
    border-radius: 22px;
    background: #ffffff;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .06);
    transition: transform .2s ease, box-shadow .2s ease;
}

.product-feature::before {
    content: "";
    position: absolute;
    width: 220px;
    height: 220px;
    right: -100px;
    top: -100px;
    border-radius: 50%;
    background: rgba(37, 99, 235, .08);
}

.product-feature:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 50px rgba(15, 23, 42, .09);
}

.product-top {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.product-symbol {
    width: 76px;
    height: 76px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: linear-gradient(145deg, #07111f, #17365a);
    color: #fff;
    font-size: 1.25rem;
    font-weight: 900;
    letter-spacing: -.03em;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08);
}

.product-portal .product-symbol {
    background: linear-gradient(145deg, #0d2744, #2563eb);
}

.product-finanzas .product-symbol {
    background: linear-gradient(145deg, #0f5132, #14b8a6);
    font-size: 2rem;
}

.product-state {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .36rem .65rem;
    border-radius: 999px;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.product-state-private {
    background: #eef2f7;
    color: #475569;
}

.state-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .08);
}

.product-copy {
    position: relative;
    z-index: 1;
    margin-top: 2rem;
}

.product-eyebrow {
    margin: 0 0 .55rem;
    color: #2563eb;
    font-size: .69rem;
    font-weight: 850;
    letter-spacing: .11em;
}

.product-copy h3 {
    margin: 0 0 .75rem;
    color: #0d1320;
    font-size: 1.72rem;
    line-height: 1.08;
}

.product-copy > p:last-child {
    margin: 0;
    color: #64748b;
}

.product-pillars {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin-top: 1.4rem;
}

.product-pillars span {
    padding: .32rem .6rem;
    border: 1px solid #dbe5f0;
    border-radius: 999px;
    background: #f8fafc;
    color: #334155;
    font-size: .72rem;
    font-weight: 750;
}

.product-footer {
    display: grid;
    gap: .45rem;
    margin-top: auto;
    padding-top: 1.4rem;
    border-top: 1px solid #e5eaf0;
}

.product-footer strong {
    color: #0d1320;
    font-size: .9rem;
}

.product-coming {
    color: #64748b;
    font-size: .78rem;
}

.products-note {
    display: grid;
    grid-template-columns: .8fr 1.2fr;
    gap: 2.4rem;
    align-items: center;
    margin-top: 1.35rem;
    padding: 1.5rem 1.7rem;
    border: 1px solid #cfe0f2;
    border-radius: 18px;
    background:
        linear-gradient(135deg, rgba(37, 99, 235, .06), rgba(56, 189, 248, .03)),
        #ffffff;
}

.products-note > div {
    display: grid;
    gap: .35rem;
}

.products-note-label {
    color: #2563eb;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .11em;
}

.products-note strong {
    color: #0d1320;
    font-size: 1.25rem;
}

.products-note p {
    margin: 0;
    color: #64748b;
}

@media (max-width: 1000px) {
    .products-heading {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .products-grid {
        grid-template-columns: 1fr;
    }

    .product-feature {
        min-height: 0;
    }

    .products-note {
        grid-template-columns: 1fr;
        gap: .75rem;
    }
}

@media (max-width: 720px) {
    .product-feature {
        padding: 1.2rem;
        border-radius: 18px;
    }

    .product-symbol {
        width: 66px;
        height: 66px;
    }

    .product-state {
        max-width: 48%;
        justify-content: center;
        text-align: center;
        line-height: 1.25;
    }

    .product-copy {
        margin-top: 1.5rem;
    }

    .product-copy h3 {
        font-size: 1.5rem;
    }

    .products-note {
        padding: 1.2rem;
    }
}

/* V5 — Inteligencia Artificial + Tecnologías */
.ai-deep-section {
    position: relative;
    overflow: hidden;
    padding: 6rem 0;
    background:
        radial-gradient(circle at 15% 15%, rgba(37,99,235,.20), transparent 25rem),
        radial-gradient(circle at 88% 82%, rgba(56,189,248,.10), transparent 28rem),
        #07111f;
    color: #fff;
}

.ai-deep-section::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .12;
    background-image:
        linear-gradient(rgba(56,189,248,.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(56,189,248,.12) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent);
}

.ai-deep-section > .container {
    position: relative;
    z-index: 1;
}

.ai-deep-section .section-kicker {
    color: #38bdf8;
}

.ai-deep-heading {
    display: grid;
    grid-template-columns: 1fr .8fr;
    gap: 3.5rem;
    align-items: end;
    margin-bottom: 2.5rem;
}

.ai-deep-heading h2 {
    margin-bottom: 0;
    color: #fff;
}

.ai-deep-heading > p {
    margin: 0 0 .35rem;
    color: #b7c7d6;
    font-size: 1.05rem;
}

.ai-method-grid {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: 1.25rem;
}

.ai-method-main {
    min-height: 540px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 2rem;
    border: 1px solid rgba(56,189,248,.26);
    border-radius: 22px;
    background:
        radial-gradient(circle at 50% 25%, rgba(37,99,235,.26), transparent 15rem),
        rgba(8,28,48,.72);
    box-shadow: inset 0 0 70px rgba(37,99,235,.08);
}

.ai-orbit {
    width: 180px;
    height: 180px;
    display: grid;
    place-items: center;
    margin-inline: auto;
    border: 1px solid rgba(56,189,248,.45);
    border-radius: 50%;
    color: #fff;
    font-size: 4.7rem;
    font-weight: 900;
    box-shadow:
        0 0 0 28px rgba(37,99,235,.05),
        0 0 70px rgba(56,189,248,.20);
}

.ai-method-label {
    color: #38bdf8;
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .12em;
}

.ai-method-main h3 {
    margin: .5rem 0 .7rem;
    font-size: 2rem;
    line-height: 1.08;
}

.ai-method-main p {
    margin: 0;
    color: #b8c8d8;
}

.ai-stages {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.ai-stages article {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .9rem;
    align-items: start;
    padding: 1.2rem;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 16px;
    background: rgba(255,255,255,.035);
}

.ai-stages article > span {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(37,99,235,.20);
    color: #38bdf8;
    font-size: .72rem;
    font-weight: 900;
}

.ai-stages strong {
    display: block;
    margin-bottom: .25rem;
    color: #fff;
}

.ai-stages p {
    margin: 0;
    color: #9fb0c1;
    font-size: .86rem;
    line-height: 1.5;
}

.ai-principle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem 1.4rem;
    flex-wrap: wrap;
    margin-top: 1.25rem;
    padding: 1.15rem 1.4rem;
    border: 1px solid rgba(56,189,248,.22);
    border-radius: 14px;
    background: rgba(37,99,235,.08);
}

.ai-principle span {
    color: #38bdf8;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .12em;
}

.ai-principle strong {
    color: #fff;
    font-size: .96rem;
}

.technologies-section {
    padding: 6rem 0;
    background:
        radial-gradient(circle at 92% 0%, rgba(37,99,235,.06), transparent 26rem),
        linear-gradient(180deg,#f8fafc,#ffffff);
    color: #0d1320;
}

.technologies-heading {
    display: grid;
    grid-template-columns: 1fr .75fr;
    gap: 3rem;
    align-items: end;
    margin-bottom: 2.5rem;
}

.technologies-heading h2 {
    margin-bottom: 0;
}

.technologies-heading > p {
    margin: 0 0 .35rem;
    color: #64748b;
    font-size: 1.02rem;
}

.technology-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 1rem;
}

.technology-card {
    min-width: 0;
    min-height: 330px;
    display: flex;
    flex-direction: column;
    padding: 1.45rem;
    border: 1px solid #dfe6ee;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(15,23,42,.045);
}

.technology-card-ai {
    border-color: #bfdbfe;
    background: linear-gradient(145deg,#ffffff,#f0f7ff);
}

.technology-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    margin-bottom: 1.3rem;
    border-radius: 15px;
    background: #0d1320;
    color: #38bdf8;
    font-size: .9rem;
    font-weight: 900;
}

.technology-card-ai .technology-icon {
    background: linear-gradient(145deg,#0d2744,#2563eb);
    color: #fff;
}

.technology-eyebrow {
    margin: 0 0 .4rem;
    color: #2563eb;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .12em;
}

.technology-card h3 {
    margin: 0 0 .6rem;
    color: #0d1320;
    font-size: 1.25rem;
    line-height: 1.18;
}

.technology-card > p:not(.technology-eyebrow) {
    margin: 0;
    color: #64748b;
    font-size: .93rem;
}

.technology-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-top: auto;
    padding-top: 1.25rem;
}

.technology-tags span {
    padding: .28rem .5rem;
    border-radius: 999px;
    background: #f1f5f9;
    color: #334155;
    font-size: .7rem;
    font-weight: 750;
}

.technology-card-ai .technology-tags span {
    background: #dbeafe;
    color: #1e40af;
}

.technology-philosophy {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 2.4rem;
    align-items: center;
    margin-top: 1.25rem;
    padding: 1.5rem 1.7rem;
    border: 1px solid #cfe0f2;
    border-radius: 18px;
    background: linear-gradient(135deg,rgba(37,99,235,.05),rgba(56,189,248,.025));
}

.technology-philosophy > div {
    display: grid;
    gap: .35rem;
}

.technology-philosophy span {
    color: #2563eb;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .12em;
}

.technology-philosophy strong {
    font-size: 1.15rem;
    line-height: 1.3;
}

.technology-philosophy p {
    margin: 0;
    color: #64748b;
}

@media (max-width: 980px) {
    .ai-deep-heading,
    .technologies-heading {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .ai-method-grid {
        grid-template-columns: 1fr;
    }

    .ai-method-main {
        min-height: 440px;
    }

    .technology-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .technology-philosophy {
        grid-template-columns: 1fr;
        gap: .8rem;
    }
}

@media (max-width: 720px) {
    .ai-deep-section,
    .technologies-section {
        padding: 4.3rem 0;
    }

    .ai-method-main {
        min-height: 0;
        padding: 1.4rem;
    }

    .ai-orbit {
        width: 135px;
        height: 135px;
        margin-bottom: 2rem;
        font-size: 3.5rem;
    }

    .ai-method-main h3 {
        font-size: 1.6rem;
    }

    .ai-stages {
        grid-template-columns: 1fr;
    }

    .ai-principle {
        align-items: flex-start;
        flex-direction: column;
    }

    .technology-grid {
        grid-template-columns: 1fr;
    }

    .technology-card {
        min-height: 0;
    }

    .technology-philosophy {
        padding: 1.2rem;
    }
}

/* V6 — Sobre De Amescua + Contacto + Footer legal */
.about-section {
    background: #ffffff;
    color: #0d1320;
}

.about-grid {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: 3.4rem;
    align-items: start;
}

.about-grid h2 {
    margin-bottom: 0;
}

.about-copy p {
    margin: 0 0 1rem;
    color: #64748b;
    font-size: 1.02rem;
}

.about-values {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 2.6rem;
}

.about-values article {
    padding: 1.3rem;
    border: 1px solid #dfe6ee;
    border-radius: 16px;
    background: #f8fafc;
}

.about-values span {
    color: #2563eb;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
}

.about-values h3 {
    margin: .5rem 0 .45rem;
    color: #0d1320;
    font-size: 1.05rem;
}

.about-values p {
    margin: 0;
    color: #64748b;
    font-size: .9rem;
}

.contact-section {
    background:
        radial-gradient(circle at 85% 20%, rgba(37,99,235,.12), transparent 22rem),
        #f8fafc;
    color: #0d1320;
}

.contact-layout {
    display: grid;
    grid-template-columns: 1fr .72fr;
    gap: 2rem;
    align-items: stretch;
}

.contact-main {
    padding: 2rem 0;
}

.contact-main h2 {
    max-width: 760px;
}

.contact-main > p:not(.section-kicker) {
    max-width: 760px;
    color: #64748b;
    font-size: 1.06rem;
}

.contact-actions {
    margin-top: 1.5rem;
}

.contact-card {
    align-self: stretch;
    padding: 1.6rem;
    border: 1px solid #cfe0f2;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 14px 36px rgba(15,23,42,.05);
}

.contact-card-label {
    display: block;
    margin-bottom: 1rem;
    color: #2563eb;
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .11em;
}

.contact-card ol {
    display: grid;
    gap: .85rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.contact-card li {
    color: #475569;
}

.contact-card strong {
    color: #0d1320;
}

.site-footer {
    padding: 0;
    background: #050b13;
    color: #93a4b7;
}

.footer-top {
    display: grid;
    grid-template-columns: 1fr .9fr;
    gap: 3rem;
    padding: 2.6rem 0 2rem;
}

.footer-brand-block img {
    width: 240px;
}

.footer-brand-block p {
    margin: .8rem 0 .2rem;
    color: #d8e4ef;
    font-weight: 700;
}

.footer-brand-block span {
    color: #6f8398;
    font-size: .84rem;
}

.footer-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}

.footer-links > div {
    display: grid;
    align-content: start;
    gap: .5rem;
}

.footer-links strong {
    margin-bottom: .25rem;
    color: #fff;
    font-size: .9rem;
}

.footer-links a {
    width: fit-content;
    color: #a8b8c8;
    text-decoration: none;
    font-size: .86rem;
}

.footer-links a:hover,
.footer-links a:focus-visible {
    color: #fff;
}

.footer-links span {
    color: #617489;
    font-size: .82rem;
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 0 1.25rem;
    border-top: 1px solid rgba(255,255,255,.08);
}

.footer-bottom p {
    margin: 0;
    color: #617489;
    font-size: .8rem;
}

@media (max-width: 980px) {
    .about-grid,
    .contact-layout,
    .footer-top {
        grid-template-columns: 1fr;
    }

    .about-values {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .about-values {
        grid-template-columns: 1fr;
    }

    .contact-main {
        padding-bottom: 0;
    }

    .contact-actions .btn {
        width: 100%;
    }

    .footer-links {
        grid-template-columns: 1fr;
    }

    .footer-bottom {
        flex-direction: column;
    }
}
