/* =========================================================
   VARIABLES
========================================================= */

:root {
    --ink: #0B1F44;
    --ink-2: #152F63;
    --ink-3: #1C3E7A;

    --gold: #D5AE63;
    --gold-dark: #B88D41;
    --gold-soft: #F8EEDB;

    --aqua: #11B9B1;

    --paper: #FFFFFF;
    --mist: #F6F8FC;
    --mist-2: #EEF3F9;

    --line: #E3E9F2;

    --text: #28344B;
    --muted: #68738A;

    --success: #25D366;

    --radius: 24px;
    --radius-lg: 34px;

    --shadow:
        0 18px 45px rgba(11, 31, 68, .09);

    --shadow-soft:
        0 10px 30px rgba(11, 31, 68, .055);

    --shadow-hover:
        0 22px 55px rgba(11, 31, 68, .12);

    --max: 1180px;
}


/* =========================================================
   RESET
========================================================= */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 100px;
}

body {
    margin: 0;

    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    color: var(--text);

    background: var(--paper);

    line-height: 1.65;

    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

img {
    display: block;

    max-width: 100%;

    height: auto;
}

a {
    color: inherit;
}

button,
input,
select,
textarea {
    font-family: inherit;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

.container,
.adt-container {
    width: min(
        var(--max),
        calc(100% - 36px)
    );

    margin-left: auto;
    margin-right: auto;
}


/* =========================================================
   TIPOGRAFÍA
========================================================= */

h1,
h2,
h3 {
    margin:
        0 0
        16px;

    color: var(--ink);

    line-height: 1.08;

    letter-spacing: -.025em;
}

h1 {
    max-width: 900px;

    font-size: clamp(
        2.7rem,
        5.5vw,
        5rem
    );
}

h2 {
    font-size: clamp(
        2rem,
        3.8vw,
        3.35rem
    );
}

h3 {
    font-size: 1.24rem;
}

p {
    margin-top: 0;
}

.eyebrow {
    display: inline-flex;
    align-items: center;

    gap: 9px;

    margin-bottom: 15px;

    color: var(--ink);

    font-size: .78rem;
    font-weight: 800;

    letter-spacing: .09em;

    text-transform: uppercase;
}

.eyebrow::before {
    content: "";

    width: 27px;
    height: 2px;

    flex: 0 0 auto;

    border-radius: 10px;

    background: var(--gold);
}


/* =========================================================
   BOTONES GENERALES
========================================================= */

.btn {
    min-height: 50px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 9px;

    padding:
        13px
        19px;

    border:
        1px solid
        transparent;

    border-radius: 14px;

    text-decoration: none;

    font-size: inherit;
    font-weight: 800;

    cursor: pointer;

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        background-color .22s ease,
        border-color .22s ease,
        color .22s ease;
}

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

.btn-primary {
    color: #FFFFFF;

    background: var(--ink);

    box-shadow:
        0 10px 24px
        rgba(11, 31, 68, .16);
}

.btn-primary:hover {
    color: #FFFFFF;

    background: #071631;

    box-shadow:
        0 14px 30px
        rgba(11, 31, 68, .21);
}

.btn-gold {
    color: #16223A;

    background: var(--gold);

    box-shadow:
        0 10px 24px
        rgba(213, 174, 99, .22);
}

.btn-gold:hover {
    color: #16223A;

    background: #CBA054;

    box-shadow:
        0 14px 30px
        rgba(213, 174, 99, .29);
}

.btn-ghost {
    color: var(--ink);

    background:
        rgba(255, 255, 255, .94);

    border-color:
        var(--line);
}

.btn-ghost:hover {
    color: var(--ink);

    background: #FFFFFF;

    border-color:
        #CBD5E5;
}


/* =========================================================
   TOPBAR NUEVO
========================================================= */

.adt-topbar {
    position: relative;

    z-index: 10010;

    width: 100%;

    color: #FFFFFF;

    background: var(--ink);

    font-size: .82rem;
}

.adt-topbar .adt-container {
    min-height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 6px;

    padding:
        7px 0;

    text-align: center;
}

.adt-topbar strong {
    color: #F1D28F;
}


/* =========================================================
   HEADER NUEVO AISLADO
========================================================= */

.adt-header {
    position: sticky;

    top: 0;

    z-index: 10000;

    width: 100%;

    overflow: visible !important;

    background:
        rgba(255, 255, 255, .98);

    border-bottom:
        1px solid var(--line);

    backdrop-filter:
        blur(14px);

    -webkit-backdrop-filter:
        blur(14px);
}

.adt-header-inner {
    position: relative;

    min-height: 78px;

    display: flex;
    align-items: center;

    gap: 24px;
}


/* =========================================================
   LOGO HEADER
========================================================= */

.adt-logo {
    display: flex;
    align-items: center;

    flex: 0 0 auto;

    text-decoration: none;
}

.adt-logo img {
    width: 110px;
    max-width: 110px;

    height: auto;
}


/* =========================================================
   MENÚ DESKTOP
========================================================= */

.adt-main-menu {
    display: flex;
    align-items: center;

    gap: 22px;

    margin-left: auto;
}

.adt-main-menu a {
    position: relative;

    display: inline-flex;
    align-items: center;

    padding:
        8px 0;

    color: #33405A;

    font-size: .88rem;
    font-weight: 700;

    line-height: 1.3;

    text-decoration: none;

    white-space: nowrap;

    transition:
        color .2s ease;
}

.adt-main-menu a:hover,
.adt-main-menu a[aria-current="page"] {
    color: var(--ink);
}

.adt-main-menu a::after {
    content: "";

    position: absolute;

    left: 0;
    right: 100%;
    bottom: 0;

    height: 2px;

    border-radius: 10px;

    background: var(--gold);

    transition:
        right .2s ease;
}

.adt-main-menu a:hover::after,
.adt-main-menu a[aria-current="page"]::after {
    right: 0;
}


/* =========================================================
   BOTONES HEADER
========================================================= */

.adt-header-actions {
    display: flex;
    align-items: center;

    gap: 9px;

    flex: 0 0 auto;
}

.adt-header-btn {
    min-height: 44px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding:
        10px
        15px;

    border:
        1px solid
        transparent;

    border-radius: 12px;

    font-size: .8rem;
    font-weight: 800;

    line-height: 1.2;

    text-decoration: none;

    transition:
        transform .2s ease,
        background-color .2s ease,
        border-color .2s ease;
}

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

.adt-header-btn-light {
    color: var(--ink);

    border-color:
        var(--line);

    background: #FFFFFF;
}

.adt-header-btn-light:hover {
    color: var(--ink);

    background:
        var(--mist);
}

.adt-header-btn-primary {
    color: #FFFFFF;

    border-color:
        var(--ink);

    background:
        var(--ink);
}

.adt-header-btn-primary:hover {
    color: #FFFFFF;

    background: #071631;
}


/* =========================================================
   BOTÓN HAMBURGUESA
========================================================= */

.adt-menu-button {
    width: 46px;
    height: 46px;

    display: none;

    flex: 0 0 46px;

    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 5px;

    padding: 0;
    margin: 0;

    border: 0;

    border-radius: 13px;

    background:
        #F3F6FA;

    cursor: pointer;

    position: relative;

    z-index: 10003;

    -webkit-appearance: none;
    appearance: none;
}

.adt-menu-button span {
    width: 22px;
    height: 2px;

    display: block;

    margin: 0;
    padding: 0;

    border-radius: 100px;

    background:
        var(--ink);

    transition:
        transform .25s ease,
        opacity .2s ease;
}


/* X AL ABRIR */

.adt-menu-button.is-active span:nth-child(1) {
    transform:
        translateY(7px)
        rotate(45deg);
}

.adt-menu-button.is-active span:nth-child(2) {
    opacity: 0;
}

.adt-menu-button.is-active span:nth-child(3) {
    transform:
        translateY(-7px)
        rotate(-45deg);
}


/* =========================================================
   HERO
========================================================= */

.hero {
    position: relative;

    overflow: hidden;

    padding:
        76px 0
        54px;

    background:
        radial-gradient(
            circle at 7% 5%,
            rgba(213, 174, 99, .19),
            transparent 27%
        ),
        radial-gradient(
            circle at 92% 8%,
            rgba(17, 185, 177, .08),
            transparent 24%
        ),
        linear-gradient(
            180deg,
            #FFFFFF 0%,
            #FBFCFE 100%
        );
}

.hero::after {
    content: "";

    position: absolute;

    width: 420px;
    height: 420px;

    right: -230px;
    bottom: -280px;

    border-radius: 50%;

    border:
        70px solid
        rgba(213, 174, 99, .055);

    pointer-events: none;
}

.hero-grid {
    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(0, 1.07fr)
        minmax(390px, .93fr);

    align-items: center;

    gap: 66px;
}

.hero-content {
    min-width: 0;
}

.hero h1 {
    margin-bottom: 18px;
}

.hero-highlight {
    margin:
        -2px 0
        12px;

    color:
        var(--gold-dark) !important;

    font-size: clamp(
        1.25rem,
        2vw,
        1.55rem
    ) !important;

    font-weight: 800;

    line-height: 1.35;
}

.hero-description {
    max-width: 720px;

    margin-bottom: 0;

    color: #4E5B72;

    font-size: 1.1rem;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;

    gap: 12px;

    margin:
        29px 0
        24px;
}

.proof-row {
    display: flex;
    flex-wrap: wrap;

    gap:
        12px
        18px;
}

.proof {
    display: flex;
    align-items: center;

    gap: 8px;

    color: #4B5870;

    font-size: .9rem;
    font-weight: 650;
}

.proof i {
    width: 25px;
    height: 25px;

    display: grid;
    place-items: center;

    flex: 0 0 auto;

    border-radius: 50%;

    background: #EAF8F4;

    color: #087D67;

    font-style: normal;
    font-weight: 900;

    line-height: 1;
}

.hero-card {
    position: relative;

    isolation: isolate;
}

.hero-card::before {
    content: "";

    position: absolute;

    inset:
        40px
        -20px
        -22px
        38px;

    z-index: -1;

    border-radius: 36px;

    background:
        linear-gradient(
            145deg,
            rgba(213, 174, 99, .2),
            rgba(17, 185, 177, .08)
        );
}

.hero-card > img {
    width: 100%;
    height: auto;

    aspect-ratio:
        900 / 760;

    object-fit: cover;

    border:
        1px solid
        var(--line);

    border-radius: 34px;

    box-shadow:
        var(--shadow);
}

.float-card {
    position: absolute;

    left: -30px;
    bottom: 32px;

    max-width: 285px;

    padding:
        17px
        19px;

    border:
        1px solid
        rgba(227, 233, 242, .95);

    border-radius: 20px;

    background:
        rgba(255, 255, 255, .97);

    box-shadow:
        0 20px 45px
        rgba(11, 31, 68, .12);

    backdrop-filter:
        blur(8px);
}

.float-card strong {
    display: block;

    margin-bottom: 3px;

    color: var(--ink);

    font-size: 1rem;

    line-height: 1.35;
}

.float-card span {
    display: block;

    color: var(--muted);

    font-size: .86rem;

    line-height: 1.5;
}


/* =========================================================
   TRUST BAR
========================================================= */

.trustbar {
    padding:
        22px 0
        48px;

    background: #FFFFFF;
}

.trust-grid {
    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 13px;
}

.trust-item {
    min-height: 132px;

    padding:
        22px
        21px;

    border:
        1px solid
        var(--line);

    border-radius: 19px;

    background: #FFFFFF;

    box-shadow:
        0 7px 24px
        rgba(11, 31, 68, .035);

    transition:
        transform .23s ease,
        box-shadow .23s ease,
        border-color .23s ease;
}

.trust-item:hover {
    transform:
        translateY(-3px);

    border-color:
        #D3DBE8;

    box-shadow:
        var(--shadow-soft);
}

.trust-item strong {
    display: block;

    margin-bottom: 7px;

    color: var(--ink);

    font-size: 1.08rem;

    line-height: 1.25;
}

.trust-item span {
    display: block;

    color: var(--muted);

    font-size: .88rem;

    line-height: 1.55;
}


/* =========================================================
   SECCIONES
========================================================= */

.section {
    position: relative;

    padding:
        94px 0;
}

.section-soft {
    background:
        linear-gradient(
            180deg,
            #F7F9FC 0%,
            #F4F7FB 100%
        );
}

.section-dark {
    position: relative;

    overflow: hidden;

    color: #FFFFFF;

    background:
        radial-gradient(
            circle at 92% 10%,
            rgba(213, 174, 99, .11),
            transparent 28%
        ),
        linear-gradient(
            135deg,
            #081A3A,
            #0B1F44 52%,
            #123268
        );
}

.section-dark::before {
    content: "";

    position: absolute;

    width: 360px;
    height: 360px;

    left: -200px;
    bottom: -230px;

    border-radius: 50%;

    border:
        55px solid
        rgba(255, 255, 255, .035);

    pointer-events: none;
}

.section-dark .container {
    position: relative;

    z-index: 2;
}

.section-dark h2,
.section-dark h3 {
    color: #FFFFFF;
}

.section-dark p {
    color: #D5DDEC;
}

.section-dark .eyebrow {
    color: #F1D28F;
}

.section-dark .eyebrow::before {
    background: #F1D28F;
}

.section-heading {
    max-width: 780px;

    margin-bottom: 44px;
}

.section-heading.center {
    margin-left: auto;
    margin-right: auto;

    text-align: center;
}

.section-heading.center .eyebrow {
    justify-content: center;
}

.section-heading p {
    margin-bottom: 0;

    color: var(--muted);

    font-size: 1.035rem;
}

.section-dark .section-heading p {
    color: #CBD6E9;
}


/* =========================================================
   GRIDS
========================================================= */

.grid-3 {
    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 20px;
}

.grid-4 {
    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 18px;
}


/* =========================================================
   CARDS
========================================================= */

.card {
    position: relative;

    padding: 28px;

    border:
        1px solid
        var(--line);

    border-radius:
        var(--radius);

    background: #FFFFFF;

    box-shadow:
        0 9px 28px
        rgba(11, 31, 68, .04);

    transition:
        transform .24s ease,
        box-shadow .24s ease,
        border-color .24s ease;
}

.card:hover {
    transform:
        translateY(-4px);

    border-color:
        #D2DBE8;

    box-shadow:
        var(--shadow-hover);
}

.card h3 {
    margin-bottom: 12px;
}

.card p {
    margin:
        0 0
        18px;

    color: var(--muted);
}

.card a.more {
    display: inline-flex;
    align-items: center;

    margin-top: auto;

    color: var(--ink);

    font-size: .93rem;
    font-weight: 800;

    text-decoration: none;

    transition:
        color .2s ease,
        transform .2s ease;
}

.card a.more:hover {
    color:
        var(--gold-dark);

    transform:
        translateX(3px);
}


/* =========================================================
   ICONOS
========================================================= */

.icon {
    width: 52px;
    height: 52px;

    display: grid;
    place-items: center;

    flex: 0 0 auto;

    margin-bottom: 20px;

    border-radius: 15px;

    background:
        var(--gold-soft);

    color: var(--ink);

    font-size: 1.3rem;
    font-weight: 800;

    line-height: 1;
}

.icon img {
    width: 27px;
    height: 27px;

    object-fit: contain;
}


/* =========================================================
   PROBLEMAS
========================================================= */

.problem-card {
    overflow: hidden;
}

.problem-card::after {
    content: "";

    position: absolute;

    width: 110px;
    height: 110px;

    right: -55px;
    top: -55px;

    border-radius: 50%;

    background:
        rgba(213, 174, 99, .07);

    pointer-events: none;
}

.problem-card .icon {
    background:
        #EDF4FF;

    color:
        var(--ink-2);
}

.section-message {
    max-width: 820px;

    margin:
        30px auto
        0;

    padding:
        23px
        26px;

    border:
        1px solid
        #E4D2AC;

    border-radius: 19px;

    background:
        linear-gradient(
            135deg,
            #FFF9ED,
            #FFFCF7
        );

    text-align: center;

    box-shadow:
        0 10px 25px
        rgba(213, 174, 99, .06);
}

.section-message strong {
    display: block;

    margin-bottom: 4px;

    color: var(--ink);

    font-size: 1.14rem;
}

.section-message p {
    margin: 0;

    color: #59657B;
}


/* =========================================================
   INTENT CARDS
========================================================= */

.intent-card {
    min-height: 100%;

    display: flex;

    flex-direction: column;
}

.intent-card .tag {
    width: max-content;

    display: inline-block;

    margin-bottom: 16px;

    padding:
        6px
        10px;

    border-radius: 999px;

    color: #0E8278;

    background: #EAF9F7;

    font-size: .74rem;
    font-weight: 800;

    letter-spacing: .01em;
}


/* =========================================================
   FEATURE CARDS
========================================================= */

.feature-card {
    height: 100%;

    padding:
        27px
        24px;

    border:
        1px solid
        rgba(255, 255, 255, .12);

    border-radius: 22px;

    background:
        rgba(255, 255, 255, .055);

    box-shadow:
        inset
        0 1px 0
        rgba(255, 255, 255, .05);

    backdrop-filter:
        blur(3px);

    transition:
        transform .24s ease,
        background-color .24s ease,
        border-color .24s ease;
}

.feature-card:hover {
    transform:
        translateY(-4px);

    border-color:
        rgba(213, 174, 99, .36);

    background:
        rgba(255, 255, 255, .075);
}

.feature-card .icon {
    background:
        rgba(213, 174, 99, .15);
    border:
        1px solid
        rgba(213, 174, 99, .18);
    color: #fff;
}

.feature-card .icon img {
    filter:
        brightness(0)
        invert(1);

    opacity: .9;
}

.feature-card h3 {
    margin-bottom: 10px;

    color: #FFFFFF;

    font-size: 1.18rem;
}

.feature-card p {
    margin: 0;

    color: #D7E0EF;

    font-size: .94rem;
}


/* =========================================================
   SERVICIOS
========================================================= */

.service-card {
    min-height: 100%;

    display: flex;

    flex-direction: column;
}

.service-card .icon {
    color: #A67C31;

    background:
        linear-gradient(
            145deg,
            #FFF7E7,
            #F3E0B9
        );
}


/* =========================================================
   PASOS / PROCESO
========================================================= */

.steps {
    counter-reset: step;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 18px;
}

.step {
    position: relative;

    min-height: 235px;

    padding:
        30px
        25px;

    border:
        1px solid
        var(--line);

    border-radius: 22px;

    background: #FFFFFF;

    box-shadow:
        0 10px 28px
        rgba(11, 31, 68, .04);

    transition:
        transform .22s ease,
        box-shadow .22s ease;
}

.step:hover {
    transform:
        translateY(-3px);

    box-shadow:
        var(--shadow-soft);
}

.step::before {
    counter-increment: step;

    content:
        "0"
        counter(step);

    display: block;

    margin-bottom: 20px;

    color:
        var(--gold-dark);

    font-size: 1.85rem;
    font-weight: 900;

    line-height: 1;
}

.step h3 {
    margin-bottom: 10px;
}

.step p {
    margin-bottom: 0;

    color: var(--muted);

    font-size: .94rem;
}


/* =========================================================
   PERFIL
========================================================= */

.profile {
    display: grid;

    grid-template-columns:
        minmax(320px, .82fr)
        minmax(0, 1.18fr);

    align-items: center;

    gap: 58px;
}

.profile-visual {
    position: relative;

    overflow: hidden;

    min-height: 510px;

    border:
        1px solid
        var(--line);

    border-radius: 30px;

    background:
        var(--mist);

    box-shadow:
        var(--shadow-soft);
}

.profile-visual::after {
    content: "";

    position: absolute;

    inset:
        auto 0 0;

    height: 120px;

    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(11, 31, 68, .11)
        );

    pointer-events: none;
}

.profile-visual img {
    width: 100%;
    height: 100%;

    min-height: 510px;

    object-fit: cover;

    border-radius: inherit;
}

.profile-content {
    min-width: 0;
}

.profile-content > p {
    max-width: 690px;

    color: var(--muted);
}

.checks {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 11px;

    margin:
        26px 0
        30px;
}

.check {
    padding:
        13px
        15px;

    border:
        1px solid
        var(--line);

    border-radius: 13px;

    background: #FFFFFF;

    color: #33405A;

    font-size: .91rem;
    font-weight: 700;

    box-shadow:
        0 4px 15px
        rgba(11, 31, 68, .025);
}

.check::before {
    content: "✓";

    margin-right: 8px;

    color: #05806C;

    font-weight: 900;
}


/* =========================================================
   CONFIDENCIALIDAD
========================================================= */

.confidentiality-section {
    padding-top: 18px;

    padding-bottom: 94px;
}

.confidentiality-box {
    position: relative;

    overflow: hidden;

    padding:
        48px
        54px;

    border:
        1px solid
        #E6D5B2;

    border-radius: 30px;

    background:
        radial-gradient(
            circle at 96% 5%,
            rgba(213, 174, 99, .17),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #FFFDF9,
            #FFF8EB
        );

    box-shadow:
        0 18px 45px
        rgba(213, 174, 99, .08);
}

.confidentiality-box::after {
    content: "✓";

    position: absolute;

    right: 42px;
    top: 50%;

    transform:
        translateY(-50%);

    width: 88px;
    height: 88px;

    display: grid;
    place-items: center;

    border:
        1px solid
        rgba(213, 174, 99, .25);

    border-radius: 50%;

    color:
        var(--gold-dark);

    background:
        rgba(255, 255, 255, .58);

    font-size: 2.25rem;
    font-weight: 900;
}

.confidentiality-content {
    max-width: 830px;

    padding-right: 110px;
}

.confidentiality-content h2 {
    max-width: 760px;
}

.confidentiality-content p {
    max-width: 780px;

    color: #59657B;
}

.confidentiality-content p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   CIUDADES
========================================================= */

.city-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;

    gap: 16px;
}

.city-card {
    width: min(
        100%,
        340px
    );

    min-height: 145px;

    display: flex !important;

    flex-direction: column;

    align-items: flex-start;
    justify-content: center;

    gap: 7px;

    padding:
        24px
        26px !important;

    border:
        1px solid
        var(--line) !important;

    border-radius:
        20px !important;

    background:
        #FFFFFF !important;

    text-decoration:
        none !important;

    box-shadow:
        0 10px 26px
        rgba(11, 31, 68, .04);

    transition:
        transform .23s ease,
        border-color .23s ease,
        box-shadow .23s ease;
}

.city-card:hover {
    transform:
        translateY(-4px);

    border-color:
        #D4BC88 !important;

    box-shadow:
        var(--shadow-soft);
}

.city-card > span {
    font-size: 1.3rem;
}

.city-card strong {
    display: block;

    color: var(--ink);

    font-size: 1.08rem;

    line-height: 1.3;
}

.city-card small {
    color:
        var(--gold-dark);

    font-size: .84rem;
    font-weight: 800;
}


/* =========================================================
   VALUE CARDS
========================================================= */

.value-card {
    height: 100%;
}

.value-card .icon {
    background:
        #EEF4FC;
}

.value-card p {
    margin-bottom: 0;
}


/* =========================================================
   TESTIMONIOS
========================================================= */

.quote {
    position: relative;

    padding:
        36px
        32px;
}

.quote::before {
    content: "“";

    position: absolute;

    top: 22px;
    left: 25px;

    color:
        var(--gold);

    font-size: 4.5rem;

    line-height: .8;
}

.quote p {
    padding-top: 34px;

    color: #46536C;

    font-size: 1.02rem;
}

.quote small {
    color:
        var(--muted);
}


/* =========================================================
   FAQ
========================================================= */

.faq-container {
    max-width: 980px;
}

.faq {
    max-width: 900px;

    margin-left: auto;
    margin-right: auto;
}

.faq-item {
    overflow: hidden;

    margin-bottom: 11px;

    border:
        1px solid
        var(--line);

    border-radius: 16px;

    background: #FFFFFF;

    box-shadow:
        0 7px 20px
        rgba(11, 31, 68, .025);

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.faq-item:hover {
    border-color:
        #D4DCE8;
}

.faq-item[open] {
    border-color:
        #D8C08E;

    box-shadow:
        0 12px 30px
        rgba(11, 31, 68, .055);
}

.faq-item summary {
    position: relative;

    min-height: 68px;

    display: flex;
    align-items: center;

    padding:
        19px
        58px
        19px
        21px;

    color: var(--ink);

    font-size: .98rem;
    font-weight: 800;

    line-height: 1.45;

    cursor: pointer;

    list-style: none;
}

.faq-item summary::-webkit-details-marker {
    display: none;
}

.faq-item summary::after {
    content: "+";

    position: absolute;

    right: 21px;
    top: 50%;

    transform:
        translateY(-50%);

    width: 30px;
    height: 30px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    color: var(--ink);

    background:
        var(--gold-soft);

    font-size: 1.25rem;
    font-weight: 600;

    line-height: 1;
}

.faq-item[open] summary::after {
    content: "−";

    background:
        var(--gold);
}

.faq-answer {
    padding:
        0
        21px
        21px;

    color: var(--muted);
}

.faq-answer p {
    max-width: 800px;

    margin: 0;

    font-size: .95rem;
}


/* FAQ ANTIGUA */

.faq-q {
    width: 100%;

    padding:
        22px 0;

    border: 0;

    background:
        transparent;

    color: var(--ink);

    text-align: left;

    font: inherit;
    font-weight: 800;

    cursor: pointer;
}

.faq-a {
    display: none;

    padding:
        0 0
        22px;

    color:
        var(--muted);
}

.faq-item.open .faq-a {
    display: block;
}


/* =========================================================
   CTA
========================================================= */

.cta-panel {
    position: relative;

    overflow: hidden;

    display: grid;

    grid-template-columns:
        minmax(0, 1.02fr)
        minmax(380px, .98fr);

    align-items: center;

    gap: 42px;

    padding: 48px;

    border-radius: 32px;

    color: #FFFFFF;

    background:
        radial-gradient(
            circle at 5% 0%,
            rgba(213, 174, 99, .18),
            transparent 27%
        ),
        linear-gradient(
            135deg,
            #071832,
            #0B1F44 50%,
            #163B7B
        );

    box-shadow:
        0 24px 60px
        rgba(11, 31, 68, .15);
}

.cta-panel::after {
    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    left: -180px;
    bottom: -210px;

    border:
        45px solid
        rgba(255, 255, 255, .035);

    border-radius: 50%;

    pointer-events: none;
}

.cta-content {
    position: relative;

    z-index: 2;
}

.cta-panel h2 {
    color: #FFFFFF;
}

.cta-panel .eyebrow {
    color: #F1D28F;
}

.cta-panel .eyebrow::before {
    background:
        #F1D28F;
}

.cta-panel p {
    color: #D6E0F3;
}

.cta-panel .proof {
    color: #E2EAF8;
}

.cta-panel .proof i {
    background:
        rgba(255, 255, 255, .12);

    color: #F1D28F;
}


/* =========================================================
   FORMULARIO
========================================================= */
/* =========================================================
   FORMULARIO CMS - ASESOR DE TESIS
========================================================= */

.cms-form {
    position: relative;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 20px;

    width: 100%;

    padding: 34px;

    border: 1px solid #E3E9F2;
    border-radius: 26px;

    background:
        linear-gradient(
            180deg,
            #FFFFFF 0%,
            #FBFCFE 100%
        );

    box-shadow:
        0 18px 45px
        rgba(11, 31, 68, .08);
}


/* =========================================================
   CAMPOS
========================================================= */

.cms-form__group {
    position: relative;

    display: flex;
    flex-direction: column;

    gap: 8px;

    margin: 0;
}


/* TEXTAREA OCUPA TODO EL ANCHO */

.cms-form__group:has(textarea) {
    grid-column: 1 / -1;
}


/* =========================================================
   LABELS
========================================================= */

.cms-form__label {
    display: block;

    margin: 0;

    color: #0B1F44;

    font-size: .88rem;
    font-weight: 750;

    line-height: 1.35;
}


/* =========================================================
   INPUTS
========================================================= */

.cms-form__control {
    width: 100%;

    min-height: 52px;

    padding:
        13px
        15px;

    margin: 0;

    outline: none;

    border:
        1px solid
        #DCE4EF;

    border-radius: 13px;

    color: #28344B;

    background: #FFFFFF;

    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    font-size: .95rem;

    line-height: 1.45;

    box-shadow:
        0 2px 7px
        rgba(11, 31, 68, .02);

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background-color .2s ease;
}


/* =========================================================
   PLACEHOLDER
========================================================= */

.cms-form__control::placeholder {
    color: #9AA5B7;

    opacity: 1;
}


/* =========================================================
   HOVER
========================================================= */

.cms-form__control:hover {
    border-color: #C5D0E0;
}


/* =========================================================
   FOCUS
========================================================= */

.cms-form__control:focus {
    border-color: #D5AE63;

    background: #FFFFFF;

    box-shadow:
        0 0 0 4px
        rgba(213, 174, 99, .15);
}


/* =========================================================
   TEXTAREA
========================================================= */

textarea.cms-form__control {
    min-height: 145px;

    resize: vertical;

    padding-top: 15px;
}


/* =========================================================
   AUTOFILL CHROME
========================================================= */

.cms-form__control:-webkit-autofill,
.cms-form__control:-webkit-autofill:hover,
.cms-form__control:-webkit-autofill:focus {
    -webkit-text-fill-color: #28344B;

    -webkit-box-shadow:
        0 0 0 1000px
        #FFFFFF
        inset;

    transition:
        background-color
        5000s ease-in-out 0s;
}


/* =========================================================
   CAMPOS REQUERIDOS INVÁLIDOS
========================================================= */

.cms-form__control:invalid:not(:placeholder-shown) {
    border-color: #DB7D7D;
}


/* =========================================================
   ACCIONES
========================================================= */

.cms-form__actions {
    grid-column: 1 / -1;

    display: flex;

    align-items: center;

    margin-top: 2px;
}


/* =========================================================
   BOTÓN
========================================================= */

.cms-form__btn {
    width: 100%;

    min-height: 54px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 9px;

    padding:
        14px
        24px;

    margin: 0;

    border: 1px solid #D5AE63;
    border-radius: 14px;

    color: #17233B;

    background:
        linear-gradient(
            135deg,
            #E2BF79,
            #D5AE63
        );

    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        sans-serif;

    font-size: .95rem;
    font-weight: 800;

    line-height: 1.2;

    cursor: pointer;

    box-shadow:
        0 10px 24px
        rgba(213, 174, 99, .24);

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background-color .2s ease;
}


.cms-form__btn::after {
    content: "→";

    font-size: 1.15rem;

    transition:
        transform .2s ease;
}


.cms-form__btn:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 15px 30px
        rgba(213, 174, 99, .32);
}


.cms-form__btn:hover::after {
    transform:
        translateX(4px);
}


.cms-form__btn:active {
    transform:
        translateY(0);
}


/* =========================================================
   BOTÓN DESACTIVADO
========================================================= */

.cms-form__btn:disabled {
    opacity: .6;

    cursor: not-allowed;

    transform: none;

    box-shadow: none;
}


/* =========================================================
   RESPUESTA DEL FORMULARIO
========================================================= */

.cms-form__response {
    grid-column: 1 / -1;

    display: none;

    margin: 0;

    padding:
        13px
        15px;

    border-radius: 12px;

    font-size: .88rem;
    font-weight: 700;

    line-height: 1.5;
}


/* SI EL SISTEMA INSERTA TEXTO */

.cms-form__response:not(:empty) {
    display: block;

    border:
        1px solid
        #B9E6D8;

    color:
        #12634F;

    background:
        #ECFAF5;
}


/* =========================================================
   CLASES OPCIONALES DE ÉXITO / ERROR
========================================================= */

.cms-form__response.is-success,
.cms-form__response.success {
    display: block;

    border:
        1px solid
        #B9E6D8;

    color:
        #12634F;

    background:
        #ECFAF5;
}


.cms-form__response.is-error,
.cms-form__response.error {
    display: block;

    border:
        1px solid
        #F0C5C5;

    color:
        #9D3535;

    background:
        #FFF2F2;
}


/* =========================================================
   HONEYPOT
========================================================= */

.cms-form__trap {
    position: absolute !important;

    left: -9999px !important;

    width: 1px !important;
    height: 1px !important;

    overflow: hidden !important;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .cms-form {
        grid-template-columns: 1fr;

        gap: 17px;

        padding: 27px;

        border-radius: 22px;
    }


    .cms-form__group,
    .cms-form__group:has(textarea),
    .cms-form__actions,
    .cms-form__response {
        grid-column: 1;
    }

}


/* =========================================================
   MÓVIL
========================================================= */

@media (max-width: 520px) {

    .cms-form {
        gap: 16px;

        padding:
            22px
            17px;

        border-radius: 18px;
    }


    .cms-form__control {
        min-height: 50px;

        padding:
            12px
            13px;

        border-radius: 11px;

        font-size: 16px;
    }


    textarea.cms-form__control {
        min-height: 135px;
    }


    .cms-form__btn {
        min-height: 52px;

        padding:
            13px
            18px;

        border-radius: 12px;
    }

}




.lead-form {
    position: relative;

    z-index: 2;

    padding: 27px;

    border:
        1px solid
        rgba(255, 255, 255, .15);

    border-radius: 22px;

    color: var(--text);

    background: #FFFFFF;

    box-shadow:
        0 17px 42px
        rgba(0, 0, 0, .12);
}

.form-grid {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 13px;
}

.field {
    display: flex;

    flex-direction: column;

    gap: 6px;
}

.field.full {
    grid-column:
        1 / -1;
}

.field label {
    color: #44516A;

    font-size: .81rem;
    font-weight: 800;
}

input,
select,
textarea {
    width: 100%;

    outline: none;

    border:
        1px solid
        #DDE4EF;

    border-radius: 11px;

    padding:
        12px
        13px;

    color: var(--text);

    background: #FFFFFF;

    font: inherit;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

input:focus,
select:focus,
textarea:focus {
    border-color:
        #8BA2C5;

    box-shadow:
        0 0 0
        3px
        rgba(21, 47, 99, .08);
}

textarea {
    min-height: 120px;

    resize: vertical;
}

.lead-form .btn {
    width: 100%;

    margin-top: 3px;
}

.form-note {
    margin:
        10px 0
        0 !important;

    color:
        var(--muted) !important;

    font-size:
        .76rem !important;

    line-height: 1.5;
}


/* =========================================================
   FOOTER
========================================================= */

.footer {
    padding:
        58px 0
        22px;

    color: #D7DFF0;

    background:
        #071631;
}

.footer-grid {
    display: grid;

    grid-template-columns:
        1.4fr
        1fr
        1fr
        1fr;

    gap: 36px;
}

.footer h3 {
    color: #FFFFFF;

    font-size: 1rem;
}

.footer p {
    color: #C2CCE0;
}

.footer a {
    display: block;

    margin:
        8px 0;

    color: #C2CCE0;

    text-decoration: none;

    transition:
        color .2s ease;
}

.footer a:hover {
    color: #FFFFFF;
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;

    gap: 20px;

    margin-top: 34px;

    padding-top: 18px;

    border-top:
        1px solid
        rgba(255, 255, 255, .12);

    color: #93A0B9;

    font-size: .82rem;
}


/* =========================================================
   WHATSAPP
========================================================= */

.whatsapp-contact {
    position: fixed;

    right: 22px;
    bottom: 22px;

    z-index: 9998;

    display: flex;
    align-items: center;

    gap: 12px;
}

.whatsapp-message {
    position: relative;

    width: 245px;

    padding:
        13px
        16px;

    border:
        1px solid
        var(--line);

    border-radius: 16px;

    background: #FFFFFF;

    box-shadow:
        0 14px 35px
        rgba(11, 31, 68, .14);
}

.whatsapp-message::after {
    content: "";

    position: absolute;

    right: -7px;
    bottom: 19px;

    width: 14px;
    height: 14px;

    background: #FFFFFF;

    border-top:
        1px solid
        var(--line);

    border-right:
        1px solid
        var(--line);

    transform:
        rotate(45deg);
}

.whatsapp-message strong {
    display: block;

    margin-bottom: 2px;

    color: var(--ink);

    font-size: .9rem;
}

.whatsapp-message span {
    display: block;

    color: var(--muted);

    font-size: .8rem;

    line-height: 1.45;
}

.whatsapp-float {
    position: relative;

    width: 60px;
    height: 60px;

    flex: 0 0 60px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background:
        #25D366;

    text-decoration: none;

    box-shadow:
        0 12px 30px
        rgba(37, 211, 102, .38);

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}

.whatsapp-float:hover {
    transform:
        translateY(-3px);

    box-shadow:
        0 16px 34px
        rgba(37, 211, 102, .48);
}

.whatsapp-float img {
    width: 32px;
    height: 32px;

    object-fit: contain;
}


/* =========================================================
   PÁGINAS INTERNAS
========================================================= */

.breadcrumbs {
    margin-bottom: 18px;

    color:
        var(--muted);

    font-size: .86rem;
}

.page-hero {
    padding:
        64px 0;

    background:
        linear-gradient(
            180deg,
            #F8FAFD,
            #FFFFFF
        );
}

.page-hero p {
    max-width: 760px;

    color:
        var(--muted);

    font-size: 1.08rem;
}

.content-wrap {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        310px;

    align-items: start;

    gap: 40px;
}

.sticky-box {
    position: sticky;

    top: 105px;
}

.article h2 {
    margin-top: 36px;

    font-size: 2rem;
}

.article h3 {
    margin-top: 26px;
}

.article p,
.article li {
    color: #56637A;
}

.notice {
    padding:
        16px
        18px;

    border-left:
        4px solid
        var(--gold);

    border-radius:
        0 14px 14px 0;

    background:
        #FFF9ED;
}


/* =========================================================
   DESKTOP INTERMEDIO
========================================================= */

@media (max-width: 1120px) {

    .adt-header-inner {
        gap: 15px;
    }

    .adt-main-menu {
        gap: 14px;
    }

    .adt-main-menu a {
        font-size: .8rem;
    }

    .adt-header-btn {
        padding-left: 11px;
        padding-right: 11px;

        font-size: .74rem;
    }

    .hero-grid {
        gap: 45px;

        grid-template-columns:
            1.05fr
            .95fr;
    }

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

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

}


/* =========================================================
   TABLET + MENÚ MÓVIL
========================================================= */

@media (max-width: 980px) {

    .adt-header {
        overflow: visible !important;
    }


    /* HEADER */

    .adt-header-inner {
        min-height: 72px;

        gap: 12px;
    }

    .adt-logo {
        margin-right: auto;
    }

    .adt-menu-button {
        display: flex !important;

        margin-left: auto;
    }

    .adt-header-actions {
        display: none !important;
    }


    /* MENÚ CERRADO */

    .adt-main-menu {
        position: absolute !important;

        top:
            calc(100% + 1px) !important;

        left: 0 !important;
        right: 0 !important;

        z-index: 10002 !important;

        width: 100% !important;

        display: none !important;

        flex-direction: column !important;

        align-items: stretch !important;

        gap: 3px !important;

        margin: 0 !important;

        padding:
            12px !important;

        border:
            1px solid
            var(--line) !important;

        border-top:
            0 !important;

        border-radius:
            0 0
            18px 18px !important;

        background:
            #FFFFFF !important;

        box-shadow:
            0 22px 45px
            rgba(11, 31, 68, .16) !important;

        max-height:
            calc(100vh - 115px);

        overflow-y: auto;

        opacity: 1 !important;

        visibility: visible !important;

        transform:
            none !important;
    }


    /* MENÚ ABIERTO */

    .adt-main-menu.is-open {
        display: flex !important;
    }


    /* LINKS */

    .adt-main-menu a {
        display: flex !important;

        width: 100% !important;

        min-height: 46px;

        align-items: center;

        padding:
            12px
            14px !important;

        margin: 0 !important;

        border-radius: 10px;

        color:
            #28344B !important;

        background:
            transparent !important;

        font-size:
            .9rem !important;

        font-weight:
            700 !important;

        line-height: 1.35;

        text-decoration:
            none !important;

        white-space: normal;
    }

    .adt-main-menu a:hover,
    .adt-main-menu a[aria-current="page"] {
        color:
            var(--ink) !important;

        background:
            var(--mist) !important;
    }

    .adt-main-menu a::after {
        display:
            none !important;
    }


    /* WEB */

    .hero-grid,
    .profile,
    .cta-panel,
    .content-wrap {
        grid-template-columns:
            1fr;
    }

    .hero {
        padding-top: 52px;
    }

    .hero-card {
        max-width: 720px;

        margin-left: auto;
        margin-right: auto;
    }

    .hero-card::before {
        inset:
            42px
            -12px
            -18px
            28px;
    }

    .float-card {
        left: 18px;
    }

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

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

    .profile {
        gap: 38px;
    }

    .profile-visual {
        max-width: 620px;

        min-height: 430px;
    }

    .profile-visual img {
        min-height: 430px;
    }

    .cta-panel {
        gap: 34px;
    }

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

    .sticky-box {
        position: static;
    }

}


/* =========================================================
   MÓVIL
========================================================= */

@media (max-width: 640px) {

    html {
        scroll-padding-top: 80px;
    }

    .container,
    .adt-container {
        width: min(
            calc(100% - 24px),
            var(--max)
        );
    }


    /* TOPBAR */

    .adt-topbar {
        font-size: .73rem;
    }

    .adt-topbar .adt-container {
        min-height: 34px;

        display: block;

        padding:
            6px 0;

        line-height: 1.4;
    }


    /* HEADER */

    .adt-header-inner {
        min-height: 68px;
    }

    .adt-logo img {
        width: 95px;
        max-width: 95px;
    }

    .adt-menu-button {
        width: 44px;
        height: 44px;

        flex-basis: 44px;
    }

    .adt-main-menu {
        max-height:
            calc(100vh - 104px);

        padding:
            10px !important;
    }

    .adt-main-menu a {
        min-height: 47px;

        padding:
            13px !important;
    }


    /* HERO */

    .hero {
        padding:
            38px 0;
    }

    .hero-grid {
        gap: 38px;
    }

    h1 {
        font-size: clamp(
            2.25rem,
            11vw,
            3.1rem
        );
    }

    h2 {
        font-size: clamp(
            1.85rem,
            8vw,
            2.5rem
        );
    }

    .hero-highlight {
        font-size:
            1.18rem !important;
    }

    .hero-description {
        font-size: 1rem;
    }

    .hero-actions {
        margin-top: 24px;
    }

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

    .proof-row {
        display: grid;

        grid-template-columns:
            1fr;

        gap: 10px;
    }

    .hero-card::before {
        display: none;
    }

    .hero-card > img {
        border-radius: 25px;
    }

    .float-card {
        position: relative;

        left: auto;
        bottom: auto;

        max-width: none;

        margin:
            -23px
            13px
            0;

        border-radius: 16px;
    }


    /* GRIDS */

    .trust-grid,
    .grid-4,
    .grid-3,
    .steps,
    .form-grid,
    .checks,
    .footer-grid {
        grid-template-columns:
            1fr;
    }


    /* SECCIONES */

    .section {
        padding:
            68px 0;
    }

    .section-heading {
        margin-bottom: 32px;
    }

    .section-heading.center {
        text-align: left;
    }

    .section-heading.center .eyebrow {
        justify-content: flex-start;
    }

    .card {
        padding: 23px;
    }

    .section-message {
        padding:
            20px
            18px;

        text-align: left;
    }

    .feature-card {
        padding:
            24px
            22px;
    }

    .step {
        min-height: auto;

        padding:
            25px
            22px;
    }


    /* PERFIL */

    .profile-visual,
    .profile-visual img {
        min-height: 360px;
    }

    .profile-visual {
        border-radius: 23px;
    }


    /* CONFIDENCIALIDAD */

    .confidentiality-section {
        padding-top: 0;

        padding-bottom: 68px;
    }

    .confidentiality-box {
        padding:
            31px
            23px;

        border-radius: 23px;
    }

    .confidentiality-content {
        padding-right: 0;
    }

    .confidentiality-box::after {
        display: none;
    }


    /* CIUDADES */

    .city-links {
        display: grid;

        grid-template-columns:
            1fr;

        width: 100%;
    }

    .city-card {
        width: 100%;

        min-height: 125px;
    }


    /* FAQ */

    .faq-item summary {
        padding:
            18px
            54px
            18px
            17px;

        font-size: .94rem;
    }

    .faq-item summary::after {
        right: 16px;
    }

    .faq-answer {
        padding:
            0
            17px
            19px;
    }


    /* CTA */

    .cta-panel {
        padding:
            27px
            20px;

        border-radius: 24px;
    }

    .lead-form {
        padding:
            21px
            17px;

        border-radius: 17px;
    }

    .field.full {
        grid-column: auto;
    }


    /* WHATSAPP */

    .whatsapp-contact {
        right: 12px;
        bottom: 12px;
    }

    .whatsapp-message {
        width: 180px;

        padding:
            10px
            12px;
    }

    .whatsapp-message strong {
        font-size: .8rem;
    }

    .whatsapp-message span {
        font-size: .72rem;
    }

    .whatsapp-float {
        width: 55px;
        height: 55px;

        flex-basis: 55px;
    }

}


/* =========================================================
   MÓVIL PEQUEÑO
========================================================= */

@media (max-width: 400px) {

    .container,
    .adt-container {
        width:
            calc(100% - 20px);
    }

    .adt-logo img {
        width: 88px;

        max-width: 88px;
    }

    h1 {
        font-size: 2.15rem;
    }

    h2 {
        font-size: 1.9rem;
    }

    .card {
        padding: 21px;
    }

    .cta-panel {
        padding:
            24px
            16px;
    }

    .whatsapp-message {
        display: none;
    }

}


/* =========================================================
   ACCESIBILIDAD
========================================================= */

@media (
    prefers-reduced-motion:
    reduce
) {

    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior:
            auto !important;

        transition-duration:
            .01ms !important;

        animation-duration:
            .01ms !important;

        animation-iteration-count:
            1 !important;
    }

}