/* ==========================================================
   TM9
   MODA JUVENIL / RETAIL MODERNO
   CSS CANONICO
   ========================================================== */

:root{
    --tm9-bg:#ffffff;
    --tm9-soft:#f7f9fc;
    --tm9-soft-2:#eef6ff;

    --tm9-text:#101828;
    --tm9-muted:#667085;
    --tm9-line:#e5eaf0;

    --tm9-blue:#1497f5;
    --tm9-blue-dark:#0879ca;

    --tm9-coral:#ff5f61;
    --tm9-coral-dark:#ec4c50;

    --tm9-black:#101214;
    --tm9-white:#ffffff;

    --tm9-radius:14px;
    --tm9-shadow:0 8px 28px rgba(16,24,40,.08);
}


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

body.mtg-template-tm9{
    margin:0;
    background:#fff;
    color:var(--tm9-text);
    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}

body.mtg-template-tm9 *,
body.mtg-template-tm9 *::before,
body.mtg-template-tm9 *::after{
    box-sizing:border-box;
}

body.mtg-template-tm9 img{
    max-width:100%;
}

body.mtg-template-tm9 a{
    text-decoration:none;
}

body.mtg-template-tm9 .tm9-home{
    background:#fff;
    overflow:hidden;
}

body.mtg-template-tm9 .tm9-container{
    width:min(1180px, calc(100% - 48px));
    margin-left:auto;
    margin-right:auto;
}


/* ==========================================================
   HEADER PUBLICO
   ========================================================== */

body.mtg-template-tm9 .site-header,
body.mtg-template-tm9 header.site-header,
body.mtg-template-tm9 .mtg-public-header,
body.mtg-template-tm9 .mdg-header{
    background:#fff !important;
    color:#101828 !important;
    border-bottom:1px solid #e8edf3 !important;
    box-shadow:none !important;
}

body.mtg-template-tm9 .site-header a,
body.mtg-template-tm9 header.site-header a,
body.mtg-template-tm9 .mtg-public-header a,
body.mtg-template-tm9 .mdg-header a{
    color:#111827 !important;
}

body.mtg-template-tm9 .site-header nav a:hover,
body.mtg-template-tm9 .mtg-public-header nav a:hover,
body.mtg-template-tm9 .mdg-header nav a:hover{
    color:var(--tm9-coral) !important;
}


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

body.mtg-template-tm9 .mtg-core-section--hero{
    margin:0 !important;
    padding:0 !important;
}

body.mtg-template-tm9 .tm9-hero-slider{
    background:#dff1ff;
}

body.mtg-template-tm9 .tm9-hero-slide,
body.mtg-template-tm9 .tm9-hero{
    min-height:510px !important;
}

body.mtg-template-tm9 .tm9-hero-slide--full-bg{
    position:relative;
    background-image:var(--tm9-slide-image) !important;
    background-size:cover !important;
    background-position:center !important;
    background-repeat:no-repeat !important;
}

body.mtg-template-tm9 .tm9-hero-slide--full-bg::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(235,246,255,.96) 0%,
            rgba(235,246,255,.86) 28%,
            rgba(235,246,255,.28) 52%,
            rgba(235,246,255,0) 72%
        );
    pointer-events:none;
}

body.mtg-template-tm9 .tm9-hero-grid{
    position:relative;
    z-index:2;

    min-height:510px;

    display:grid;
    grid-template-columns:minmax(0,480px) 1fr;
    align-items:center;
}

body.mtg-template-tm9 .tm9-hero-content{
    padding:54px 0;
}

body.mtg-template-tm9 .tm9-kicker{
    display:block;
    margin-bottom:13px;

    font-size:14px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.06em;

    color:#667085 !important;
}

body.mtg-template-tm9 .tm9-hero-content h1,
body.mtg-template-tm9 .tm9-hero-content h2{
    margin:0 0 17px !important;

    max-width:470px;

    color:#111827 !important;

    font-size:clamp(48px,5vw,72px) !important;
    line-height:.95 !important;
    font-weight:800 !important;
    letter-spacing:-.055em !important;
}

body.mtg-template-tm9 .tm9-hero-content h1 em,
body.mtg-template-tm9 .tm9-hero-content h1 strong,
body.mtg-template-tm9 .tm9-hero-content h2 em,
body.mtg-template-tm9 .tm9-hero-content h2 strong{
    color:var(--tm9-coral) !important;
    font-style:normal !important;
}

body.mtg-template-tm9 .tm9-hero-content p{
    max-width:410px;
    margin:0 0 22px;

    color:#475467 !important;
    font-size:15px !important;
    line-height:1.55;
}

body.mtg-template-tm9 .tm9-hero-actions{
    display:flex;
    gap:10px;
    align-items:center;
}

body.mtg-template-tm9 .tm9-primary-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:44px;
    padding:0 22px !important;

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

    background:var(--tm9-coral) !important;
    color:#fff !important;

    font-size:14px !important;
    font-weight:700 !important;

    box-shadow:0 10px 24px rgba(255,95,97,.20);
}

body.mtg-template-tm9 .tm9-primary-button:hover{
    background:var(--tm9-coral-dark) !important;
}

body.mtg-template-tm9 .tm9-secondary-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:44px;
    padding:0 22px !important;

    border:1px solid #cfd7e3 !important;
    border-radius:9px !important;

    background:#fff !important;
    color:#111827 !important;

    font-weight:700 !important;
}

body.mtg-template-tm9 .tm9-hero-features{
    display:none !important;
}

body.mtg-template-tm9 .tm9-hero-visual{
    min-width:0;
}


/* ==========================================================
   TITULOS GENERALES
   ========================================================== */

body.mtg-template-tm9 .tm9-section-head,
body.mtg-template-tm9 .tm9-categories-heading{
    margin-bottom:20px;
}

body.mtg-template-tm9 .tm9-section-head h2,
body.mtg-template-tm9 .tm9-categories-heading h2,
body.mtg-template-tm9 .tm9-brands-section h2,
body.mtg-template-tm9 .tm9-testimonials-summary h2{
    margin:0 0 5px;

    color:#101828 !important;

    font-size:30px !important;
    line-height:1.05;
    font-weight:800 !important;
    letter-spacing:-.04em;
}

body.mtg-template-tm9 .tm9-section-head p,
body.mtg-template-tm9 .tm9-categories-heading p{
    margin:0;
    color:#667085 !important;
    font-size:14px;
}

body.mtg-template-tm9 .tm9-section-head > a{
    color:#344054 !important;
    font-size:13px;
    font-weight:700;
}


/* ==========================================================
   CATEGORIAS
   ========================================================== */

body.mtg-template-tm9 .tm9-categories{
    padding:36px 0 40px !important;
    background:#fff !important;
}

body.mtg-template-tm9 .tm9-category-grid{
    display:grid !important;
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    gap:15px !important;
}

body.mtg-template-tm9 .tm9-category-card{
    display:block;
    overflow:hidden;

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

    background:#fff !important;

    box-shadow:0 5px 18px rgba(16,24,40,.055) !important;

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

body.mtg-template-tm9 .tm9-category-card:hover{
    transform:translateY(-3px);
    box-shadow:0 12px 26px rgba(16,24,40,.10) !important;
}

body.mtg-template-tm9 .tm9-category-image{
    display:block !important;
    height:225px !important;
    overflow:hidden;
    background:#f1f3f5 !important;
}

body.mtg-template-tm9 .tm9-category-image img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;

    transition:transform .3s ease;
}

body.mtg-template-tm9 .tm9-category-card:hover .tm9-category-image img{
    transform:scale(1.035);
}

body.mtg-template-tm9 .tm9-category-card > strong{
    display:block;

    margin:0 !important;
    padding:13px 14px 2px !important;

    color:#111827 !important;

    font-size:15px !important;
    font-weight:800 !important;
}

body.mtg-template-tm9 .tm9-category-card > small{
    display:block;

    min-height:42px;

    padding:0 14px 13px !important;

    color:#667085 !important;

    font-size:12px !important;
    line-height:1.35;
}


/* ==========================================================
   PRODUCTOS
   ========================================================== */

body.mtg-template-tm9 .tm9-section{
    padding:38px 0 44px !important;
    background:#fff !important;
}

body.mtg-template-tm9
section[data-core-section="featured"]{
    background:#f8fafc !important;
}

body.mtg-template-tm9
section[data-core-section="new_products"]{
    background:#fff !important;
}

body.mtg-template-tm9 .tm9-product-grid{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:18px !important;
}

body.mtg-template-tm9 .tm9-product-card{
    position:relative;

    display:flex !important;
    flex-direction:column !important;

    overflow:hidden;

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

    background:#fff !important;

    box-shadow:0 5px 18px rgba(16,24,40,.055) !important;

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

body.mtg-template-tm9 .tm9-product-card:hover{
    transform:translateY(-3px);

    box-shadow:
        0 14px 30px
        rgba(16,24,40,.10) !important;
}

body.mtg-template-tm9 .tm9-product-badge{
    position:absolute;
    top:10px;
    left:10px;
    z-index:2;

    padding:5px 8px !important;

    border-radius:999px !important;

    background:#fff !important;
    color:#111827 !important;

    font-size:9px !important;
    line-height:1 !important;
    font-weight:800 !important;

    box-shadow:0 3px 10px rgba(0,0,0,.08);
}

body.mtg-template-tm9 .tm9-product-image{
    display:block !important;
    height:315px !important;
    overflow:hidden;

    background:#f5f5f5 !important;
}

body.mtg-template-tm9 .tm9-product-image img{
    width:100% !important;
    height:100% !important;

    display:block !important;

    object-fit:cover !important;

    transition:transform .35s ease;
}

body.mtg-template-tm9 .tm9-product-card:hover .tm9-product-image img{
    transform:scale(1.025);
}

body.mtg-template-tm9 .tm9-product-content{
    flex:1;

    display:flex !important;
    flex-direction:column !important;

    padding:13px 14px 14px !important;

    background:#fff !important;
}

body.mtg-template-tm9 .tm9-product-content h3{
    margin:0 0 5px !important;

    color:#101828 !important;

    font-size:14px !important;
    line-height:1.25 !important;
    font-weight:700 !important;
}

body.mtg-template-tm9 .tm9-product-content h3 a{
    color:#101828 !important;
}

body.mtg-template-tm9 .tm9-product-prices{
    display:flex;
    align-items:center;
    gap:7px;

    margin-bottom:3px;
}

body.mtg-template-tm9 .tm9-product-price{
    color:var(--tm9-blue-dark) !important;

    font-size:16px !important;
    font-weight:800 !important;
}

body.mtg-template-tm9 .tm9-product-prices del{
    color:#98a2b3 !important;
    font-size:12px !important;
}

body.mtg-template-tm9 .tm9-product-stars{
    margin:4px 0 9px !important;

    color:#ffb000 !important;

    font-size:12px !important;
    letter-spacing:.7px;
}

body.mtg-template-tm9 .tm9-product-button{
    display:flex !important;
    align-items:center;
    justify-content:center;

    width:100%;
    min-height:38px;

    margin-top:auto !important;

    padding:0 12px !important;

    border:1px solid #bfd8eb !important;
    border-radius:8px !important;

    background:#fff !important;
    color:#1d2939 !important;

    font-size:12px !important;
    font-weight:700 !important;

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

body.mtg-template-tm9 .tm9-product-button:hover{
    background:var(--tm9-blue) !important;
    border-color:var(--tm9-blue) !important;
    color:#fff !important;
}


/* ==========================================================
   BANNER CENTRAL
   ========================================================== */

body.mtg-template-tm9 .tm9-banner-section{
    padding:16px 0 26px !important;
    background:#fff !important;
}

body.mtg-template-tm9 .tm9-banner{
    min-height:260px;

    display:grid !important;
    grid-template-columns:1fr 1.15fr !important;
    align-items:center;

    overflow:hidden;

    border-radius:14px !important;

    background:
        linear-gradient(
            110deg,
            #1597f5 0%,
            #4eb6f8 100%
        ) !important;
}

body.mtg-template-tm9 .tm9-banner-content{
    padding:36px 44px !important;
}

body.mtg-template-tm9 .tm9-banner-content > span{
    color:#e5f5ff !important;
}

body.mtg-template-tm9 .tm9-banner-content h2{
    margin:0 0 8px;

    color:#fff !important;

    font-size:38px !important;
    line-height:.98 !important;
    font-weight:800 !important;
    letter-spacing:-.04em;
}

body.mtg-template-tm9 .tm9-banner-content p{
    color:rgba(255,255,255,.88) !important;
}

body.mtg-template-tm9 .tm9-banner-content > a{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:42px;

    margin-top:12px;

    padding:0 18px !important;

    border-radius:8px !important;

    background:var(--tm9-coral) !important;
    color:#fff !important;

    font-weight:700 !important;
}

body.mtg-template-tm9 .tm9-banner-visual{
    height:260px !important;
}

body.mtg-template-tm9 .tm9-banner-visual img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
}


/* ==========================================================
   BENEFICIOS
   ========================================================== */

body.mtg-template-tm9 .tm9-benefits-section{
    padding:22px 0 !important;

    background:#fff !important;

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

body.mtg-template-tm9 .tm9-benefits-grid{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:18px !important;
}

body.mtg-template-tm9 .tm9-benefit{
    display:grid !important;
    grid-template-columns:44px 1fr;
    align-items:center;
    gap:11px;

    padding:8px 10px !important;

    border:0 !important;
    background:transparent !important;
}

body.mtg-template-tm9 .tm9-benefit-icon{
    width:42px !important;
    height:42px !important;

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

    border-radius:12px !important;

    background:#e9f5ff !important;
    color:var(--tm9-blue) !important;
}

body.mtg-template-tm9 .tm9-benefit-icon svg{
    width:23px;
    height:23px;
}

body.mtg-template-tm9 .tm9-benefit strong{
    display:block;

    color:#101828 !important;

    font-size:13px !important;
    font-weight:800 !important;
}

body.mtg-template-tm9 .tm9-benefit p{
    margin:2px 0 0;

    color:#667085 !important;

    font-size:11px !important;
}


/* ==========================================================
   MARCAS
   ========================================================== */

body.mtg-template-tm9 .tm9-brands-section{
    padding:36px 0 42px !important;
    background:#f8fafc !important;
}

body.mtg-template-tm9 .tm9-brands-grid{
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;
    gap:14px !important;

    margin-top:18px;
}

body.mtg-template-tm9 .tm9-brand-card{
    min-height:78px;

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

    padding:14px !important;

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

    background:#fff !important;

    box-shadow:0 4px 14px rgba(16,24,40,.04);
}

body.mtg-template-tm9 .tm9-brand-card img{
    max-width:110px !important;
    max-height:38px !important;
    object-fit:contain !important;
}

body.mtg-template-tm9 .tm9-brand-card strong{
    color:#344054 !important;
    font-size:15px;
    letter-spacing:.04em;
}


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

body.mtg-template-tm9 .tm9-testimonials-section{
    padding:38px 0 44px !important;
    background:#fff !important;
}

body.mtg-template-tm9 .tm9-testimonials-layout{
    display:block !important;
}

body.mtg-template-tm9 .tm9-testimonials-summary{
    margin-bottom:18px;
}

body.mtg-template-tm9 .tm9-testimonials-summary > div{
    color:#ffb000 !important;
}

body.mtg-template-tm9 .tm9-testimonials-grid{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:15px !important;
}

body.mtg-template-tm9 .tm9-testimonial-card{
    padding:17px !important;

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

    background:#fff !important;

    box-shadow:0 4px 14px rgba(16,24,40,.04);
}

body.mtg-template-tm9 .tm9-quote{
    color:var(--tm9-coral) !important;
}

body.mtg-template-tm9 .tm9-testimonial-card p{
    color:#475467 !important;
    font-size:12px !important;
    line-height:1.45;
}

body.mtg-template-tm9 .tm9-testimonial-card footer{
    background:transparent !important;
    color:#101828 !important;
}


/* ==========================================================
   OFERTAS / GALERIA
   ========================================================== */

body.mtg-template-tm9 .tm9-gallery-section{
    padding:36px 0 40px !important;
    background:#fff !important;
}

body.mtg-template-tm9 .tm9-gallery-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:15px !important;
}

body.mtg-template-tm9 .tm9-gallery-item{
    display:block;
    overflow:hidden;

    border-radius:12px !important;

    background:#f1f3f5 !important;
}

body.mtg-template-tm9 .tm9-gallery-item img{
    width:100% !important;
    aspect-ratio:1.58 / 1 !important;

    display:block !important;

    object-fit:cover !important;

    transition:transform .3s ease;
}

body.mtg-template-tm9 .tm9-gallery-item:hover img{
    transform:scale(1.025);
}


/* ==========================================================
   NEWSLETTER
   ========================================================== */

body.mtg-template-tm9 .tm9-newsletter{
    padding:19px 0 !important;

    background:#f6f9fc !important;

    border-top:1px solid #e8edf3 !important;
    border-bottom:1px solid #e8edf3 !important;
}

body.mtg-template-tm9 .tm9-newsletter-inner{
    display:grid !important;
    grid-template-columns:1fr minmax(360px,520px);
    align-items:center;
    gap:30px;
}

body.mtg-template-tm9 .tm9-newsletter-copy h2{
    margin:0 0 3px;

    color:#101828 !important;

    font-size:18px !important;
    font-weight:800 !important;
}

body.mtg-template-tm9 .tm9-newsletter-copy p{
    margin:0;

    color:#667085 !important;

    font-size:11px !important;
}

body.mtg-template-tm9 .tm9-newsletter form{
    display:grid !important;
    grid-template-columns:1fr auto;
    gap:8px;
}

body.mtg-template-tm9 .tm9-newsletter input{
    height:42px !important;

    padding:0 14px !important;

    border:1px solid #d7e0ea !important;
    border-radius:8px !important;

    background:#fff !important;
    color:#101828 !important;
}

body.mtg-template-tm9 .tm9-newsletter button{
    height:42px !important;

    padding:0 22px !important;

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

    background:var(--tm9-coral) !important;
    color:#fff !important;

    font-weight:700 !important;
}


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

body.mtg-template-tm9
section[data-core-section="cta"]{
    padding:0 !important;
    background:#fff !important;
}

body.mtg-template-tm9 .tm9-cta-section{
    padding:0 !important;
    background:#fff !important;
}

body.mtg-template-tm9 .tm9-cta{
    min-height:245px;

    display:flex !important;
    flex-direction:column;
    justify-content:center;

    padding:42px 48px !important;

    border-radius:0 !important;

    background:
        linear-gradient(
            90deg,
            #101214 0%,
            #1b1e21 100%
        ) !important;

    color:#fff !important;
}

body.mtg-template-tm9 .tm9-cta h2{
    max-width:520px;

    margin:0 0 8px !important;

    color:#fff !important;

    font-size:34px !important;
    line-height:1.05 !important;
    font-weight:800 !important;
}

body.mtg-template-tm9 .tm9-cta p{
    max-width:560px;

    color:rgba(255,255,255,.72) !important;
}

body.mtg-template-tm9 .tm9-cta-actions{
    display:flex !important;
    gap:10px;

    margin-top:14px;
}

body.mtg-template-tm9 .tm9-cta-actions a{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:42px;

    padding:0 18px !important;

    border-radius:8px !important;

    font-size:13px;
    font-weight:700;
}

body.mtg-template-tm9 .tm9-cta-actions a:first-child{
    background:var(--tm9-coral) !important;
    color:#fff !important;
}

body.mtg-template-tm9 .tm9-cta-actions a:last-child{
    border:1px solid rgba(255,255,255,.26) !important;
    background:transparent !important;
    color:#fff !important;
}


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

body.mtg-template-tm9 .tm9-footer{
    padding:38px 0 0 !important;

    background:#101214 !important;
    color:rgba(255,255,255,.72) !important;
}

body.mtg-template-tm9 .tm9-footer-core-grid{
    display:grid !important;
    grid-template-columns:1.4fr repeat(3,1fr);
    gap:38px !important;
}

body.mtg-template-tm9 .tm9-footer h2,
body.mtg-template-tm9 .tm9-footer h3,
body.mtg-template-tm9 .tm9-footer strong{
    color:#fff !important;
}

body.mtg-template-tm9 .tm9-footer p,
body.mtg-template-tm9 .tm9-footer a{
    color:rgba(255,255,255,.65) !important;
}

body.mtg-template-tm9 .tm9-footer a:hover{
    color:#fff !important;
}

body.mtg-template-tm9 .tm9-footer-bottom{
    margin-top:32px;

    padding:15px 0 !important;

    border-top:1px solid rgba(255,255,255,.10) !important;

    background:#101214 !important;

    color:rgba(255,255,255,.50) !important;

    font-size:11px;
}


/* ==========================================================
   SHARE / EXTRAS DE PRODUCTO
   ========================================================== */

body.mtg-template-tm9 .mtg-share-clean{
    margin-top:10px !important;
    padding-top:9px !important;

    border-top:1px solid #eef2f6 !important;
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width:1100px){

    body.mtg-template-tm9 .tm9-category-grid{
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    }

    body.mtg-template-tm9 .tm9-product-grid{
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    }

    body.mtg-template-tm9 .tm9-brands-grid{
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    }

    body.mtg-template-tm9 .tm9-testimonials-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }

}


@media (max-width:767px){

    body.mtg-template-tm9 .tm9-container{
        width:calc(100% - 28px);
    }

    body.mtg-template-tm9 .tm9-hero-slide,
    body.mtg-template-tm9 .tm9-hero{
        min-height:430px !important;
    }

    body.mtg-template-tm9 .tm9-hero-slide--full-bg::before{
        background:
            linear-gradient(
                90deg,
                rgba(235,246,255,.97) 0%,
                rgba(235,246,255,.90) 58%,
                rgba(235,246,255,.36) 100%
            );
    }

    body.mtg-template-tm9 .tm9-hero-grid{
        min-height:430px;

        grid-template-columns:1fr;
    }

    body.mtg-template-tm9 .tm9-hero-content{
        padding:42px 0;
    }

    body.mtg-template-tm9 .tm9-hero-content h1,
    body.mtg-template-tm9 .tm9-hero-content h2{
        max-width:310px;

        font-size:42px !important;
    }

    body.mtg-template-tm9 .tm9-hero-content p{
        max-width:300px;
    }

    body.mtg-template-tm9 .tm9-category-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:11px !important;
    }

    body.mtg-template-tm9 .tm9-category-image{
        height:180px !important;
    }

    body.mtg-template-tm9 .tm9-product-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:11px !important;
    }

    body.mtg-template-tm9 .tm9-product-image{
        height:220px !important;
    }

    body.mtg-template-tm9 .tm9-product-content{
        padding:10px !important;
    }

    body.mtg-template-tm9 .tm9-banner{
        grid-template-columns:1fr !important;
    }

    body.mtg-template-tm9 .tm9-banner-content{
        padding:28px !important;
    }

    body.mtg-template-tm9 .tm9-banner-visual{
        height:210px !important;
    }

    body.mtg-template-tm9 .tm9-benefits-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }

    body.mtg-template-tm9 .tm9-brands-grid{
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    }

    body.mtg-template-tm9 .tm9-testimonials-grid{
        grid-template-columns:1fr !important;
    }

    body.mtg-template-tm9 .tm9-gallery-grid{
        grid-template-columns:1fr !important;
    }

    body.mtg-template-tm9 .tm9-newsletter-inner{
        grid-template-columns:1fr !important;
    }

    body.mtg-template-tm9 .tm9-footer-core-grid{
        grid-template-columns:1fr 1fr !important;
    }

}


@media (max-width:480px){

    body.mtg-template-tm9 .tm9-product-image{
        height:185px !important;
    }

    body.mtg-template-tm9 .tm9-product-content h3{
        font-size:12px !important;
    }

    body.mtg-template-tm9 .tm9-product-price{
        font-size:14px !important;
    }

    body.mtg-template-tm9 .tm9-footer-core-grid{
        grid-template-columns:1fr !important;
    }

}



/* TM9_REFINEMENT_V2_START */


/* ==========================================================
   ANCHO GENERAL — 90% REAL
   ========================================================== */

body.mtg-template-tm9 .tm9-container{
    width:90% !important;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
}


/* ==========================================================
   RITMO GENERAL
   ========================================================== */

body.mtg-template-tm9
section[data-core-section]{
    position:relative;
}

body.mtg-template-tm9
.tm9-section-head,
body.mtg-template-tm9
.tm9-categories-heading{
    margin-bottom:22px !important;
}

body.mtg-template-tm9
.tm9-section-head{
    display:flex !important;
    align-items:flex-end !important;
    justify-content:space-between !important;
    gap:20px;
}

body.mtg-template-tm9
.tm9-section-head > div{
    min-width:0;
}


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

body.mtg-template-tm9
.tm9-hero-slide,
body.mtg-template-tm9
.tm9-hero{
    min-height:500px !important;
}

body.mtg-template-tm9
.tm9-hero-grid{
    width:90% !important;
    max-width:none !important;
    min-height:500px !important;

    margin:auto !important;
}

body.mtg-template-tm9
.tm9-hero-content{
    max-width:520px !important;
}

body.mtg-template-tm9
.tm9-hero-content h1,
body.mtg-template-tm9
.tm9-hero-content h2{
    max-width:500px !important;
}

body.mtg-template-tm9
.tm9-hero-slider .mtg-hero-slider-v2__arrow,
body.mtg-template-tm9
.tm9-hero-slider button[data-mtg-hero-slider-prev],
body.mtg-template-tm9
.tm9-hero-slider button[data-mtg-hero-slider-next]{
    width:38px !important;
    height:38px !important;

    border-radius:50% !important;

    background:rgba(255,255,255,.90) !important;
    color:#111827 !important;

    border:1px solid rgba(17,24,39,.08) !important;

    box-shadow:0 5px 16px rgba(0,0,0,.10) !important;
}


/* ==========================================================
   CATEGORIAS
   ========================================================== */

body.mtg-template-tm9
.tm9-categories{
    padding-top:38px !important;
    padding-bottom:46px !important;
}

body.mtg-template-tm9
.tm9-category-grid{
    grid-template-columns:
        repeat(5,minmax(0,1fr)) !important;

    gap:18px !important;
}

body.mtg-template-tm9
.tm9-category-card{
    min-width:0;
}

body.mtg-template-tm9
.tm9-category-image{
    height:auto !important;
    aspect-ratio:1 / 1.04 !important;
}

body.mtg-template-tm9
.tm9-category-card > strong{
    font-size:16px !important;
    padding-top:14px !important;
}


/* ==========================================================
   PRODUCTOS
   ========================================================== */

body.mtg-template-tm9
section[data-core-section="featured"],
body.mtg-template-tm9
section[data-core-section="new_products"]{
    padding-top:42px !important;
    padding-bottom:50px !important;
}

body.mtg-template-tm9
.tm9-product-grid{
    grid-template-columns:
        repeat(4,minmax(0,1fr)) !important;

    gap:20px !important;
}

body.mtg-template-tm9
.tm9-product-card{
    border-radius:12px !important;

    box-shadow:
        0 7px 22px
        rgba(15,23,42,.065) !important;
}

body.mtg-template-tm9
.tm9-product-image{
    height:auto !important;
    aspect-ratio:1 / 1.06 !important;
}

body.mtg-template-tm9
.tm9-product-content{
    padding:14px 15px 15px !important;
}

body.mtg-template-tm9
.tm9-product-content h3{
    font-size:15px !important;
}

body.mtg-template-tm9
.tm9-product-button{
    min-height:40px !important;

    margin-top:7px !important;
}

body.mtg-template-tm9
.mtg-share-clean{
    opacity:.82;

    transform:scale(.94);
    transform-origin:left center;
}


/* ==========================================================
   BANNER CENTRAL
   ========================================================== */

body.mtg-template-tm9
.tm9-banner-section{
    padding:14px 0 32px !important;
}

body.mtg-template-tm9
.tm9-banner{
    min-height:285px !important;

    grid-template-columns:
        .92fr 1.35fr !important;

    border-radius:15px !important;

    box-shadow:
        0 10px 28px
        rgba(20,151,245,.12) !important;
}

body.mtg-template-tm9
.tm9-banner-content{
    padding:
        42px 48px !important;
}

body.mtg-template-tm9
.tm9-banner-content h2{
    font-size:
        clamp(34px,3.6vw,50px) !important;
}

body.mtg-template-tm9
.tm9-banner-visual{
    height:285px !important;
}


/* ==========================================================
   BENEFICIOS
   ========================================================== */

body.mtg-template-tm9
.tm9-benefits-section{
    padding:
        25px 0 !important;
}

body.mtg-template-tm9
.tm9-benefits-grid{
    gap:0 !important;
}

body.mtg-template-tm9
.tm9-benefit{
    min-height:72px;

    padding:
        10px 22px !important;

    border-right:
        1px solid #e8edf3 !important;
}

body.mtg-template-tm9
.tm9-benefit:last-child{
    border-right:0 !important;
}

body.mtg-template-tm9
.tm9-benefit-icon{
    width:46px !important;
    height:46px !important;
}


/* ==========================================================
   MARCAS
   ========================================================== */

body.mtg-template-tm9
.tm9-brands-section{
    padding:
        42px 0 48px !important;
}

body.mtg-template-tm9
.tm9-brands-grid{
    grid-template-columns:
        repeat(6,minmax(0,1fr)) !important;

    gap:16px !important;
}

body.mtg-template-tm9
.tm9-brand-card{
    min-height:88px !important;

    border-radius:11px !important;
}


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

body.mtg-template-tm9
.tm9-testimonials-section{
    padding:
        42px 0 48px !important;
}

body.mtg-template-tm9
.tm9-testimonials-grid{
    gap:18px !important;
}

body.mtg-template-tm9
.tm9-testimonial-card{
    min-height:150px;

    padding:20px !important;

    border-radius:12px !important;
}


/* ==========================================================
   OFERTAS
   ========================================================== */

body.mtg-template-tm9
.tm9-gallery-section{
    padding:
        42px 0 46px !important;
}

body.mtg-template-tm9
.tm9-gallery-grid{
    gap:18px !important;
}

body.mtg-template-tm9
.tm9-gallery-item{
    border-radius:13px !important;

    box-shadow:
        0 7px 18px
        rgba(15,23,42,.06);
}


/* ==========================================================
   NEWSLETTER
   ========================================================== */

body.mtg-template-tm9
.tm9-newsletter{
    padding:
        22px 0 !important;
}

body.mtg-template-tm9
.tm9-newsletter-inner{
    width:90% !important;
    max-width:none !important;
}

body.mtg-template-tm9
.tm9-newsletter-copy h2{
    font-size:19px !important;
}


/* ==========================================================
   CTA FINAL
   CAPTURA TAMBIEN HTML SIN .tm9-cta
   ========================================================== */

body.mtg-template-tm9
section[data-core-section="cta"]{
    width:100% !important;

    margin:0 !important;

    padding:
        34px 0 38px !important;

    background:#fff !important;
}


/*
 * Sea cual sea el wrapper interno del CTA,
 * lo convertimos en la caja oscura del mockup.
 */
body.mtg-template-tm9
section[data-core-section="cta"]
> .tm9-container,

body.mtg-template-tm9
section[data-core-section="cta"]
> div,

body.mtg-template-tm9
.tm9-cta{
    width:90% !important;
    max-width:none !important;

    min-height:250px !important;

    margin:
        0 auto !important;

    padding:
        45px 52px !important;

    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:flex-start !important;

    border-radius:
        16px !important;

    background:
        linear-gradient(
            105deg,
            #111315 0%,
            #1b1d20 72%,
            #24272b 100%
        ) !important;

    color:#fff !important;

    box-shadow:
        0 15px 38px
        rgba(15,23,42,.12) !important;

    overflow:hidden;
}


/* Textos directos o internos */

body.mtg-template-tm9
section[data-core-section="cta"] h1,

body.mtg-template-tm9
section[data-core-section="cta"] h2,

body.mtg-template-tm9
section[data-core-section="cta"] h3,

body.mtg-template-tm9
.tm9-cta h1,

body.mtg-template-tm9
.tm9-cta h2,

body.mtg-template-tm9
.tm9-cta h3{
    max-width:600px !important;

    margin:
        0 0 10px !important;

    color:#fff !important;

    font-size:
        clamp(32px,3.4vw,48px) !important;

    line-height:
        1.02 !important;

    font-weight:
        800 !important;

    letter-spacing:
        -.04em !important;
}


body.mtg-template-tm9
section[data-core-section="cta"] p,

body.mtg-template-tm9
.tm9-cta p{
    max-width:610px !important;

    margin:
        0 0 16px !important;

    color:
        rgba(255,255,255,.70) !important;

    font-size:
        14px !important;

    line-height:
        1.55 !important;
}


/*
 * Cualquier grupo de enlaces del CTA.
 */
body.mtg-template-tm9
section[data-core-section="cta"] a,

body.mtg-template-tm9
.tm9-cta a{
    display:inline-flex !important;

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

    min-height:42px;

    margin:
        5px 7px 0 0 !important;

    padding:
        0 18px !important;

    border-radius:
        8px !important;

    font-size:
        13px !important;

    font-weight:
        700 !important;
}


/* Botón principal */

body.mtg-template-tm9
section[data-core-section="cta"] a:first-of-type,

body.mtg-template-tm9
.tm9-cta a:first-of-type{
    border:
        1px solid
        var(--tm9-coral) !important;

    background:
        var(--tm9-coral) !important;

    color:#fff !important;
}


/* secundarios */

body.mtg-template-tm9
section[data-core-section="cta"] a:not(:first-of-type),

body.mtg-template-tm9
.tm9-cta a:not(:first-of-type){
    border:
        1px solid
        rgba(255,255,255,.24) !important;

    background:
        rgba(255,255,255,.06) !important;

    color:#fff !important;
}


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

body.mtg-template-tm9
.tm9-footer{
    padding-top:
        42px !important;
}

body.mtg-template-tm9
.tm9-footer-core-grid{
    width:90% !important;
    max-width:none !important;

    margin:auto !important;

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

    gap:
        42px !important;
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width:1100px){

    body.mtg-template-tm9
    .tm9-container,

    body.mtg-template-tm9
    .tm9-newsletter-inner,

    body.mtg-template-tm9
    section[data-core-section="cta"]
    > .tm9-container,

    body.mtg-template-tm9
    section[data-core-section="cta"]
    > div,

    body.mtg-template-tm9
    .tm9-cta,

    body.mtg-template-tm9
    .tm9-footer-core-grid{
        width:92% !important;
    }

    body.mtg-template-tm9
    .tm9-product-grid{
        grid-template-columns:
            repeat(3,minmax(0,1fr))
            !important;
    }

}


@media (max-width:767px){

    body.mtg-template-tm9
    .tm9-container,

    body.mtg-template-tm9
    .tm9-newsletter-inner,

    body.mtg-template-tm9
    section[data-core-section="cta"]
    > .tm9-container,

    body.mtg-template-tm9
    section[data-core-section="cta"]
    > div,

    body.mtg-template-tm9
    .tm9-cta,

    body.mtg-template-tm9
    .tm9-footer-core-grid{
        width:
            calc(100% - 28px) !important;
    }


    body.mtg-template-tm9
    .tm9-hero-grid{
        width:
            calc(100% - 28px) !important;
    }


    body.mtg-template-tm9
    .tm9-category-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr))
            !important;
    }


    body.mtg-template-tm9
    .tm9-product-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr))
            !important;

        gap:
            12px !important;
    }


    body.mtg-template-tm9
    .tm9-banner{
        grid-template-columns:
            1fr !important;
    }


    body.mtg-template-tm9
    .tm9-benefits-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr))
            !important;
    }


    body.mtg-template-tm9
    .tm9-benefit:nth-child(2){
        border-right:0 !important;
    }


    body.mtg-template-tm9
    .tm9-brands-grid{
        grid-template-columns:
            repeat(3,minmax(0,1fr))
            !important;
    }


    body.mtg-template-tm9
    .tm9-testimonials-grid{
        grid-template-columns:
            1fr !important;
    }


    body.mtg-template-tm9
    .tm9-gallery-grid{
        grid-template-columns:
            1fr !important;
    }


    body.mtg-template-tm9
    section[data-core-section="cta"]
    > .tm9-container,

    body.mtg-template-tm9
    section[data-core-section="cta"]
    > div,

    body.mtg-template-tm9
    .tm9-cta{
        min-height:
            250px !important;

        padding:
            34px 28px !important;

        border-radius:
            13px !important;
    }


    body.mtg-template-tm9
    .tm9-footer-core-grid{
        grid-template-columns:
            1fr 1fr !important;
    }

}


/* TM9_REFINEMENT_V2_END */



/* TM9_REFINEMENT_V3_START */


/* ==========================================================
   CATEGORIAS
   4 TARJETAS OCUPANDO TODO EL ANCHO
   ========================================================== */

body.mtg-template-tm9
section[data-core-section="categories"]
.tm9-container{
    width:90% !important;
    max-width:none !important;
}

body.mtg-template-tm9
.tm9-category-grid{
    display:grid !important;

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

    width:100% !important;

    gap:20px !important;
}

body.mtg-template-tm9
.tm9-category-card{
    width:100% !important;
    min-width:0 !important;

    border-radius:14px !important;

    overflow:hidden !important;

    background:#fff !important;

    box-shadow:
        0 8px 24px
        rgba(15,23,42,.07) !important;
}

body.mtg-template-tm9
.tm9-category-image{
    width:100% !important;

    height:auto !important;

    aspect-ratio:
        1.18 / 1 !important;

    overflow:hidden !important;
}

body.mtg-template-tm9
.tm9-category-image img{
    width:100% !important;
    height:100% !important;

    object-fit:cover !important;
}

body.mtg-template-tm9
.tm9-category-card > strong{
    position:relative;

    display:block !important;

    min-height:48px;

    padding:
        13px 16px !important;

    background:
        linear-gradient(
            90deg,
            #14213d 0%,
            #2467ec 100%
        ) !important;

    color:#fff !important;

    font-size:
        16px !important;

    line-height:
        22px !important;

    font-weight:
        800 !important;
}


/*
 * En esta versión visual no necesitamos
 * el subtítulo abajo ocupando altura.
 */
body.mtg-template-tm9
.tm9-category-card > small{
    display:none !important;
}


/* ==========================================================
   CTA FINAL
   IZQUIERDA: COPY + BOTONES
   DERECHA: 3 BENEFICIOS
   ========================================================== */

body.mtg-template-tm9
section[data-core-section="cta"]{
    padding:
        34px 0 42px !important;

    background:#fff !important;
}


/*
 * Caja principal
 */
body.mtg-template-tm9
section[data-core-section="cta"]
.tm9-cta,

body.mtg-template-tm9
.tm9-cta{
    width:90% !important;
    max-width:none !important;

    min-height:310px !important;

    margin:
        0 auto !important;

    padding:
        48px 56px !important;

    display:grid !important;

    grid-template-columns:
        minmax(0,1.08fr)
        minmax(420px,.92fr) !important;

    grid-template-rows:auto !important;

    align-items:center !important;

    gap:
        70px !important;

    border-radius:
        18px !important;

    background:
        linear-gradient(
            110deg,
            #111315 0%,
            #17191c 58%,
            #202327 100%
        ) !important;

    box-shadow:
        0 18px 42px
        rgba(15,23,42,.14) !important;
}


/*
 * Primer bloque directo del CTA:
 * texto / botones.
 */
body.mtg-template-tm9
.tm9-cta > div:first-child{
    min-width:0 !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
}


/*
 * Titulo
 */
body.mtg-template-tm9
.tm9-cta h2{
    max-width:
        650px !important;

    margin:
        0 0 12px !important;

    color:#fff !important;

    font-size:
        clamp(
            38px,
            4vw,
            58px
        ) !important;

    line-height:
        .98 !important;

    letter-spacing:
        -.045em !important;

    font-weight:
        800 !important;
}


/*
 * Texto
 */
body.mtg-template-tm9
.tm9-cta p{
    max-width:
        560px !important;

    margin:
        0 0 20px !important;

    color:
        rgba(
            255,
            255,
            255,
            .72
        ) !important;

    font-size:
        14px !important;

    line-height:
        1.55 !important;
}


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

body.mtg-template-tm9
.tm9-cta-actions{
    display:flex !important;

    flex-direction:row !important;
    flex-wrap:wrap !important;

    align-items:center !important;

    gap:
        12px !important;

    margin:
        2px 0 0 !important;
}

body.mtg-template-tm9
.tm9-cta-actions a{
    width:auto !important;

    min-width:
        150px !important;

    min-height:
        46px !important;

    margin:
        0 !important;

    padding:
        0 22px !important;

    display:inline-flex !important;

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

    border-radius:
        9px !important;

    font-size:
        14px !important;

    font-weight:
        800 !important;
}

body.mtg-template-tm9
.tm9-cta-actions a:first-child{
    background:
        var(--tm9-coral) !important;

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

    color:#fff !important;
}

body.mtg-template-tm9
.tm9-cta-actions a:first-child:hover{
    background:
        var(--tm9-coral-dark) !important;

    border-color:
        var(--tm9-coral-dark) !important;
}

body.mtg-template-tm9
.tm9-cta-actions a:last-child{
    background:
        rgba(
            255,
            255,
            255,
            .05
        ) !important;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .30
        ) !important;

    color:#fff !important;
}


/* ==========================================================
   COLUMNA DERECHA CTA
   ========================================================== */

/*
 * Tomamos el último hijo directo del CTA.
 * Ahí están las tres ventajas actuales.
 */
body.mtg-template-tm9
.tm9-cta > div:last-child:not(:first-child){
    min-width:0 !important;

    display:grid !important;

    grid-template-columns:
        1fr !important;

    gap:
        13px !important;

    align-self:center !important;
}


/*
 * Cualquier elemento directo dentro
 * del bloque derecho se convierte
 * en card horizontal.
 */
body.mtg-template-tm9
.tm9-cta
> div:last-child:not(:first-child)
> *{
    width:100% !important;

    min-height:
        66px !important;

    margin:
        0 !important;

    padding:
        0 20px !important;

    display:flex !important;

    align-items:center !important;

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

    border-radius:
        11px !important;

    background:
        rgba(
            255,
            255,
            255,
            .07
        ) !important;

    color:#fff !important;

    font-size:
        14px !important;

    font-weight:
        700 !important;
}


/*
 * Si son listas UL/LI
 */
body.mtg-template-tm9
.tm9-cta ul{
    width:100% !important;

    margin:0 !important;
    padding:0 !important;

    display:grid !important;

    gap:
        13px !important;

    list-style:none !important;
}

body.mtg-template-tm9
.tm9-cta li{
    min-height:
        66px !important;

    margin:
        0 !important;

    padding:
        0 20px !important;

    display:flex !important;

    align-items:center !important;

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

    border-radius:
        11px !important;

    background:
        rgba(
            255,
            255,
            255,
            .07
        ) !important;

    color:#fff !important;

    font-size:
        14px !important;

    font-weight:
        700 !important;
}


/* ==========================================================
   SEPARACION NEWSLETTER -> CTA
   ========================================================== */

body.mtg-template-tm9
.tm9-newsletter{
    margin-bottom:
        0 !important;
}

body.mtg-template-tm9
section[data-core-section="cta"]{
    border-top:
        0 !important;
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width:1100px){

    body.mtg-template-tm9
    .tm9-category-grid{
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            ) !important;
    }

    body.mtg-template-tm9
    .tm9-cta{
        grid-template-columns:
            1fr
            minmax(
                340px,
                .9fr
            ) !important;

        gap:
            38px !important;

        padding:
            42px !important;
    }

}


@media (max-width:767px){

    body.mtg-template-tm9
    section[data-core-section="categories"]
    .tm9-container{
        width:
            calc(
                100% - 28px
            ) !important;
    }

    body.mtg-template-tm9
    .tm9-category-grid{
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            ) !important;

        gap:
            12px !important;
    }

    body.mtg-template-tm9
    .tm9-category-image{
        aspect-ratio:
            1 / 1 !important;
    }

    body.mtg-template-tm9
    .tm9-category-card > strong{
        font-size:
            13px !important;
    }


    body.mtg-template-tm9
    .tm9-cta{
        width:
            calc(
                100% - 28px
            ) !important;

        min-height:
            0 !important;

        padding:
            34px 26px !important;

        grid-template-columns:
            1fr !important;

        gap:
            30px !important;

        border-radius:
            14px !important;
    }

    body.mtg-template-tm9
    .tm9-cta h2{
        font-size:
            36px !important;
    }

    body.mtg-template-tm9
    .tm9-cta-actions{
        width:100% !important;
    }

    body.mtg-template-tm9
    .tm9-cta-actions a{
        flex:
            1 1 140px !important;
    }

}


/* TM9_REFINEMENT_V3_END */



/* TM9_CTA_V4_FIX_START */


/* ==========================================================
   CTA FINAL REAL
   ========================================================== */

body.mtg-template-tm9
section[data-core-section="cta"]{
    padding:34px 0 42px !important;
    background:#fff !important;
}


/* Caja completa */
body.mtg-template-tm9
section[data-core-section="cta"]
.mtg-cta-final-v4{
    width:90% !important;
    max-width:none !important;

    min-height:300px !important;

    margin:0 auto !important;
    padding:46px 54px !important;

    display:grid !important;

    grid-template-columns:
        minmax(0,1.1fr)
        minmax(400px,.9fr) !important;

    align-items:center !important;

    gap:64px !important;

    border-radius:18px !important;

    background:
        linear-gradient(
            110deg,
            #111315 0%,
            #17191c 55%,
            #24272b 100%
        ) !important;

    box-shadow:
        0 18px 42px
        rgba(15,23,42,.14) !important;
}


/* ==========================================================
   COLUMNA IZQUIERDA
   ========================================================== */

body.mtg-template-tm9
.mtg-cta-final-v4__copy{
    min-width:0 !important;

    display:flex !important;
    flex-direction:column !important;

    align-items:flex-start !important;
    justify-content:center !important;
}

body.mtg-template-tm9
.mtg-cta-final-v4__copy h2{
    max-width:650px !important;

    margin:0 0 12px !important;

    color:#fff !important;

    font-size:
        clamp(38px,4vw,58px) !important;

    line-height:.98 !important;

    font-weight:800 !important;

    letter-spacing:-.045em !important;
}

body.mtg-template-tm9
.mtg-cta-final-v4__copy p{
    max-width:560px !important;

    margin:0 0 20px !important;

    color:
        rgba(255,255,255,.72) !important;

    font-size:14px !important;
    line-height:1.55 !important;
}


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

body.mtg-template-tm9
.mtg-cta-final-v4__actions{
    display:flex !important;

    flex-direction:row !important;
    flex-wrap:wrap !important;

    align-items:center !important;

    gap:12px !important;

    margin:0 !important;
}

body.mtg-template-tm9
.mtg-cta-final-v4__button{
    width:auto !important;

    min-width:150px !important;
    min-height:46px !important;

    margin:0 !important;
    padding:0 22px !important;

    display:inline-flex !important;

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

    border-radius:9px !important;

    font-size:14px !important;
    font-weight:800 !important;

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

body.mtg-template-tm9
.mtg-cta-final-v4__button:hover{
    transform:translateY(-1px);
}

body.mtg-template-tm9
.mtg-cta-final-v4__button--primary{
    background:var(--tm9-coral) !important;

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

    color:#fff !important;
}

body.mtg-template-tm9
.mtg-cta-final-v4__button--primary:hover{
    background:
        var(--tm9-coral-dark) !important;

    border-color:
        var(--tm9-coral-dark) !important;
}

body.mtg-template-tm9
.mtg-cta-final-v4__button--secondary{
    background:
        rgba(255,255,255,.05) !important;

    border:
        1px solid
        rgba(255,255,255,.30) !important;

    color:#fff !important;
}


/* ==========================================================
   COLUMNA DERECHA
   ========================================================== */

body.mtg-template-tm9
.mtg-cta-final-v4__features{
    width:100% !important;

    min-width:0 !important;

    display:grid !important;

    grid-template-columns:
        1fr !important;

    gap:13px !important;

    align-self:center !important;
}


/* Cards */
body.mtg-template-tm9
.mtg-cta-final-v4__feature{
    width:100% !important;

    min-height:66px !important;

    margin:0 !important;

    padding:0 20px !important;

    display:flex !important;

    align-items:center !important;

    border:
        1px solid
        rgba(255,255,255,.14) !important;

    border-radius:11px !important;

    background:
        rgba(255,255,255,.08) !important;

    color:#fff !important;

    font-size:14px !important;
    font-weight:700 !important;

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


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width:1100px){

    body.mtg-template-tm9
    section[data-core-section="cta"]
    .mtg-cta-final-v4{
        width:92% !important;

        grid-template-columns:
            1fr
            minmax(340px,.85fr) !important;

        gap:36px !important;

        padding:40px !important;
    }

}


@media (max-width:767px){

    body.mtg-template-tm9
    section[data-core-section="cta"]
    .mtg-cta-final-v4{
        width:
            calc(100% - 28px) !important;

        min-height:0 !important;

        padding:34px 26px !important;

        grid-template-columns:
            1fr !important;

        gap:28px !important;

        border-radius:14px !important;
    }

    body.mtg-template-tm9
    .mtg-cta-final-v4__copy h2{
        font-size:36px !important;
    }

    body.mtg-template-tm9
    .mtg-cta-final-v4__actions{
        width:100% !important;
    }

    body.mtg-template-tm9
    .mtg-cta-final-v4__button{
        flex:1 1 140px !important;
    }

    body.mtg-template-tm9
    .mtg-cta-final-v4__features{
        gap:10px !important;
    }

    body.mtg-template-tm9
    .mtg-cta-final-v4__feature{
        min-height:58px !important;
    }

}


/* TM9_CTA_V4_FIX_END */


/* ===== MTG TM9 CATEGORY BAR OVERRIDE START ===== */

/*
   Ajuste para que las tarjetas de categorías se parezcan más al mockup:
   - eliminar sensación de barra azul fuerte
   - usar gris/plomo suave
   - texto oscuro
   - flecha oscura
*/

.tm9-categories .tm9-category-card,
.tm9-categories .tm9-category-item,
.tm9-categories .tm9-category-box,
.tm9-shop-categories .tm9-category-card,
.tm9-shop-categories .tm9-category-item,
.tm9-shop-categories .tm9-category-box,
.mtg-core-section--categories .tm9-category-card,
.mtg-core-section--categories .tm9-category-item,
.mtg-core-section--categories .tm9-category-box {
    background: #ffffff;
    border: 1px solid #e8ebf0;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.tm9-categories .tm9-category-card__content,
.tm9-categories .tm9-category-content,
.tm9-categories .tm9-category-info,
.tm9-categories .tm9-category-caption,
.tm9-categories .tm9-category-meta,
.tm9-categories .tm9-category-footer,
.tm9-shop-categories .tm9-category-card__content,
.tm9-shop-categories .tm9-category-content,
.tm9-shop-categories .tm9-category-info,
.tm9-shop-categories .tm9-category-caption,
.tm9-shop-categories .tm9-category-meta,
.tm9-shop-categories .tm9-category-footer,
.mtg-core-section--categories .tm9-category-card__content,
.mtg-core-section--categories .tm9-category-content,
.mtg-core-section--categories .tm9-category-info,
.mtg-core-section--categories .tm9-category-caption,
.mtg-core-section--categories .tm9-category-meta,
.mtg-core-section--categories .tm9-category-footer {
    background: linear-gradient(180deg, #f2f4f7 0%, #e8edf3 100%) !important;
    color: #1f2937 !important;
    padding: 16px 16px 15px !important;
    min-height: 78px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
}

.tm9-categories .tm9-category-card__content h3,
.tm9-categories .tm9-category-content h3,
.tm9-categories .tm9-category-info h3,
.tm9-categories .tm9-category-caption h3,
.tm9-categories .tm9-category-meta h3,
.tm9-categories .tm9-category-footer h3,
.tm9-categories .tm9-category-card__content strong,
.tm9-categories .tm9-category-content strong,
.tm9-categories .tm9-category-info strong,
.tm9-categories .tm9-category-caption strong,
.tm9-categories .tm9-category-meta strong,
.tm9-categories .tm9-category-footer strong,
.tm9-shop-categories .tm9-category-card__content h3,
.tm9-shop-categories .tm9-category-content h3,
.tm9-shop-categories .tm9-category-info h3,
.tm9-shop-categories .tm9-category-caption h3,
.tm9-shop-categories .tm9-category-meta h3,
.tm9-shop-categories .tm9-category-footer h3,
.tm9-shop-categories .tm9-category-card__content strong,
.tm9-shop-categories .tm9-category-content strong,
.tm9-shop-categories .tm9-category-info strong,
.tm9-shop-categories .tm9-category-caption strong,
.tm9-shop-categories .tm9-category-meta strong,
.tm9-shop-categories .tm9-category-footer strong,
.mtg-core-section--categories .tm9-category-card__content h3,
.mtg-core-section--categories .tm9-category-content h3,
.mtg-core-section--categories .tm9-category-info h3,
.mtg-core-section--categories .tm9-category-caption h3,
.mtg-core-section--categories .tm9-category-meta h3,
.mtg-core-section--categories .tm9-category-footer h3,
.mtg-core-section--categories .tm9-category-card__content strong,
.mtg-core-section--categories .tm9-category-content strong,
.mtg-core-section--categories .tm9-category-info strong,
.mtg-core-section--categories .tm9-category-caption strong,
.mtg-core-section--categories .tm9-category-meta strong,
.mtg-core-section--categories .tm9-category-footer strong {
    color: #111827 !important;
    font-weight: 800;
}

.tm9-categories .tm9-category-card__content p,
.tm9-categories .tm9-category-content p,
.tm9-categories .tm9-category-info p,
.tm9-categories .tm9-category-caption p,
.tm9-categories .tm9-category-meta p,
.tm9-categories .tm9-category-footer p,
.tm9-shop-categories .tm9-category-card__content p,
.tm9-shop-categories .tm9-category-content p,
.tm9-shop-categories .tm9-category-info p,
.tm9-shop-categories .tm9-category-caption p,
.tm9-shop-categories .tm9-category-meta p,
.tm9-shop-categories .tm9-category-footer p,
.mtg-core-section--categories .tm9-category-card__content p,
.mtg-core-section--categories .tm9-category-content p,
.mtg-core-section--categories .tm9-category-info p,
.mtg-core-section--categories .tm9-category-caption p,
.mtg-core-section--categories .tm9-category-meta p,
.mtg-core-section--categories .tm9-category-footer p {
    color: #6b7280 !important;
}

.tm9-categories .tm9-category-card__content .arrow,
.tm9-categories .tm9-category-content .arrow,
.tm9-categories .tm9-category-info .arrow,
.tm9-categories .tm9-category-caption .arrow,
.tm9-categories .tm9-category-meta .arrow,
.tm9-categories .tm9-category-footer .arrow,
.tm9-categories .tm9-category-card__content svg,
.tm9-categories .tm9-category-content svg,
.tm9-categories .tm9-category-info svg,
.tm9-categories .tm9-category-caption svg,
.tm9-categories .tm9-category-meta svg,
.tm9-categories .tm9-category-footer svg,
.tm9-shop-categories .tm9-category-card__content .arrow,
.tm9-shop-categories .tm9-category-content .arrow,
.tm9-shop-categories .tm9-category-info .arrow,
.tm9-shop-categories .tm9-category-caption .arrow,
.tm9-shop-categories .tm9-category-meta .arrow,
.tm9-shop-categories .tm9-category-footer .arrow,
.tm9-shop-categories .tm9-category-card__content svg,
.tm9-shop-categories .tm9-category-content svg,
.tm9-shop-categories .tm9-category-info svg,
.tm9-shop-categories .tm9-category-caption svg,
.tm9-shop-categories .tm9-category-meta svg,
.tm9-shop-categories .tm9-category-footer svg,
.mtg-core-section--categories .tm9-category-card__content .arrow,
.mtg-core-section--categories .tm9-category-content .arrow,
.mtg-core-section--categories .tm9-category-info .arrow,
.mtg-core-section--categories .tm9-category-caption .arrow,
.mtg-core-section--categories .tm9-category-meta .arrow,
.mtg-core-section--categories .tm9-category-footer .arrow,
.mtg-core-section--categories .tm9-category-card__content svg,
.mtg-core-section--categories .tm9-category-content svg,
.mtg-core-section--categories .tm9-category-info svg,
.mtg-core-section--categories .tm9-category-caption svg,
.mtg-core-section--categories .tm9-category-meta svg,
.mtg-core-section--categories .tm9-category-footer svg {
    color: #374151 !important;
    fill: #374151 !important;
    stroke: #374151 !important;
}

.tm9-categories .tm9-category-card:hover,
.tm9-categories .tm9-category-item:hover,
.tm9-categories .tm9-category-box:hover,
.tm9-shop-categories .tm9-category-card:hover,
.tm9-shop-categories .tm9-category-item:hover,
.tm9-shop-categories .tm9-category-box:hover,
.mtg-core-section--categories .tm9-category-card:hover,
.mtg-core-section--categories .tm9-category-item:hover,
.mtg-core-section--categories .tm9-category-box:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.10);
}

/* ===== MTG TM9 CATEGORY BAR OVERRIDE END ===== */

/* TM9_CATEGORY_IMAGE_CROP_V1_START */

body.mtg-template-tm9
.tm9-category-image{
    width:100% !important;

    height:auto !important;

    aspect-ratio:
        1.28 / 1 !important;

    overflow:hidden !important;

    background:#f4f4f5 !important;
}

body.mtg-template-tm9
.tm9-category-image img{
    width:100% !important;
    height:100% !important;

    object-fit:cover !important;

    /*
     * Subimos el foco para evitar
     * cortar cabeza/cara.
     */
    object-position:center 22% !important;

    transform:none !important;
}

body.mtg-template-tm9
.tm9-category-card:hover
.tm9-category-image img{
    transform:scale(1.015) !important;
}

@media (max-width:767px){

    body.mtg-template-tm9
    .tm9-category-image{
        aspect-ratio:
            1.12 / 1 !important;
    }

    body.mtg-template-tm9
    .tm9-category-image img{
        object-position:
            center 20% !important;
    }

}

/* TM9_CATEGORY_IMAGE_CROP_V1_END */

/* TM9_REAL_FULL_BACKGROUND_START */

/*
 * ============================================
 * TM9 HERO
 * La imagen del slide ocupa TODO el contenedor
 * igual que TM2.
 * ============================================
 */

body.mtg-template-tm9
.tm9-hero-slider{
    width:100% !important;
    max-width:none !important;
    overflow:hidden !important;
}

body.mtg-template-tm9
.tm9-hero-slider
.mtg-hero-slider-v2__viewport{
    width:100% !important;
    overflow:hidden !important;
}

body.mtg-template-tm9
.tm9-hero-slider
.mtg-hero-slider-v2__track{
    width:100% !important;
}

body.mtg-template-tm9
.tm9-hero-slider
.mtg-hero-slider-v2__slide{
    width:100% !important;
    min-width:100% !important;
}


/*
 * El slide completo es el lienzo.
 */

body.mtg-template-tm9
.tm9-hero-slider
.tm9-hero-slide--full-bg{
    position:relative !important;

    width:100% !important;
    min-height:620px !important;

    overflow:hidden !important;

    background-color:#eef4f8 !important;

    background-image:
        var(--tm9-slide-image) !important;

    background-repeat:
        no-repeat !important;

    background-size:
        cover !important;

    background-position:
        center center !important;
}


/*
 * Eliminamos cualquier pseudo-background
 * anterior para que no duplique imagen.
 */

body.mtg-template-tm9
.tm9-hero-slider
.tm9-hero-slide--full-bg::before{
    content:none !important;
    display:none !important;
}


/*
 * Difuminado encima del background.
 */

body.mtg-template-tm9
.tm9-hero-slider
.tm9-hero-slide--full-bg::after{
    content:"";

    position:absolute !important;
    inset:0 !important;

    z-index:1 !important;

    pointer-events:none !important;

    background:
        linear-gradient(
            90deg,
            rgba(238,244,248,.98) 0%,
            rgba(238,244,248,.96) 18%,
            rgba(238,244,248,.90) 30%,
            rgba(238,244,248,.70) 40%,
            rgba(238,244,248,.38) 50%,
            rgba(238,244,248,.12) 60%,
            rgba(238,244,248,0) 70%
        ) !important;
}


/*
 * El grid deja de dividir el hero.
 * Solo posiciona contenido encima.
 */

body.mtg-template-tm9
.tm9-hero-slider
.tm9-hero-grid{
    position:relative !important;
    z-index:2 !important;

    width:100% !important;
    max-width:100% !important;

    min-height:620px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;

    grid-template-columns:none !important;
    gap:0 !important;

    padding:
        70px
        5.5%
        70px
        5.5% !important;
}


/*
 * Texto encima de imagen.
 */

body.mtg-template-tm9
.tm9-hero-slider
.tm9-hero-content{
    position:relative !important;
    z-index:3 !important;

    width:100% !important;
    max-width:520px !important;

    margin:0 !important;
    padding:0 !important;

    background:transparent !important;

    border:0 !important;
    box-shadow:none !important;
}


/*
 * La antigua columna visual NO participa.
 */

body.mtg-template-tm9
.tm9-hero-slider
.tm9-hero-visual{
    display:none !important;
}


/*
 * Desktop:
 * pequeño ajuste del foco hacia la derecha
 * porque las personas están allí.
 */

@media (min-width:1200px){

    body.mtg-template-tm9
    .tm9-hero-slider
    .tm9-hero-slide--full-bg{
        min-height:620px !important;

        background-size:
            cover !important;

        background-position:
            center center !important;
    }

}


/*
 * Tablet
 */

@media (max-width:1199px){

    body.mtg-template-tm9
    .tm9-hero-slider
    .tm9-hero-slide--full-bg{
        min-height:560px !important;

        background-size:
            cover !important;

        background-position:
            center center !important;
    }

    body.mtg-template-tm9
    .tm9-hero-slider
    .tm9-hero-grid{
        min-height:560px !important;

        padding:
            55px
            4%
            55px
            4% !important;
    }

}


/*
 * Mobile:
 * mantenemos full background.
 */

@media (max-width:767px){

    body.mtg-template-tm9
    .tm9-hero-slider
    .tm9-hero-slide--full-bg{
        min-height:500px !important;

        background-size:
            cover !important;

        background-position:
            65% center !important;
    }

    body.mtg-template-tm9
    .tm9-hero-slider
    .tm9-hero-grid{
        min-height:500px !important;

        padding:
            34px
            22px
            42px
            22px !important;
    }

    body.mtg-template-tm9
    .tm9-hero-slider
    .tm9-hero-content{
        max-width:100% !important;
    }

}

/* TM9_REAL_FULL_BACKGROUND_END */

/* TM9_SLIDER_HEIGHT_PLUS60_START */

body.mtg-template-tm9
.tm9-hero-slider
.tm9-hero-slide--full-bg{
    min-height:680px !important;
}

body.mtg-template-tm9
.tm9-hero-slider
.tm9-hero-grid{
    min-height:680px !important;
}

@media (max-width:1199px){

    body.mtg-template-tm9
    .tm9-hero-slider
    .tm9-hero-slide--full-bg{
        min-height:620px !important;
    }

    body.mtg-template-tm9
    .tm9-hero-slider
    .tm9-hero-grid{
        min-height:620px !important;
    }

}

@media (max-width:767px){

    body.mtg-template-tm9
    .tm9-hero-slider
    .tm9-hero-slide--full-bg{
        min-height:540px !important;
    }

    body.mtg-template-tm9
    .tm9-hero-slider
    .tm9-hero-grid{
        min-height:540px !important;
    }

}

/* TM9_SLIDER_HEIGHT_PLUS60_END */

/* TM9_SLIDER_BG_DOWN_50_START */

body.mtg-template-tm9 .tm9-hero-slider .tm9-hero-slide--full-bg{
    background-position:center calc(50% + 100px) !important;
}

body.mtg-template-tm9 .tm9-hero-slider .tm9-hero-slide--full-bg::before{
    background-position:center calc(50% + 100px) !important;
}

body.mtg-template-tm9 .tm9-hero-slider .tm9-hero-media{
    background-position:center calc(50% + 100px) !important;
}

body.mtg-template-tm9 .tm9-hero-slider .tm9-hero-image{
    background-position:center calc(50% + 100px) !important;
}

body.mtg-template-tm9 .tm9-hero-slider .swiper-slide{
    background-position:center calc(50% + 100px) !important;
}

/* TM9_SLIDER_BG_DOWN_50_END */

/* TM9_CORE_BANNER_NORMALIZED_START */

/*
 * ==========================================================
 * TM9 CORE BANNER
 * Arquitectura amplia equivalente al concepto TM2.
 * ==========================================================
 */

body.mtg-template-tm9
.tm9-core-banner-section{
    padding:
        36px 0
        42px !important;

    background:
        #ffffff !important;
}


/*
 * Contenedor principal.
 */

body.mtg-template-tm9
.tm9-core-banner{
    position:relative;

    width:100%;

    min-height:
        420px;

    display:grid;

    grid-template-columns:
        minmax(0, .96fr)
        minmax(0, 1.04fr);

    align-items:stretch;

    overflow:hidden;

    border:
        1px solid
        #e7edf5;

    border-radius:
        28px;

    background:
        linear-gradient(
            135deg,
            #edf8ff 0%,
            #f7f5ff 100%
        );

    box-shadow:
        0 20px 55px
        rgba(21,37,64,.08);
}


/*
 * COPY
 */

body.mtg-template-tm9
.tm9-core-banner__copy{
    position:relative;

    z-index:2;

    display:flex;

    flex-direction:column;

    align-items:flex-start;

    justify-content:center;

    min-width:0;

    padding:
        58px
        52px
        58px
        58px;
}


body.mtg-template-tm9
.tm9-core-banner__kicker{
    display:inline-flex;

    align-items:center;

    min-height:
        34px;

    padding:
        7px 16px;

    margin-bottom:
        18px;

    border-radius:
        999px;

    background:
        #ffffff;

    color:
        #162033;

    font-size:
        12px;

    line-height:
        1;

    font-weight:
        900;

    letter-spacing:
        .05em;

    text-transform:
        uppercase;

    box-shadow:
        0 5px 16px
        rgba(19,37,63,.05);
}


body.mtg-template-tm9
.tm9-core-banner__copy h2{
    width:100%;

    max-width:
        650px;

    margin:
        0 0 18px;

    color:
        #111b2e;

    font-size:
        clamp(
            38px,
            3.7vw,
            62px
        );

    line-height:
        1.02;

    letter-spacing:
        -.045em;

    font-weight:
        900;
}


body.mtg-template-tm9
.tm9-core-banner__copy p{
    max-width:
        560px;

    margin:
        0 0 28px;

    color:
        #526075;

    font-size:
        17px;

    line-height:
        1.55;
}


body.mtg-template-tm9
.tm9-core-banner__button{
    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:
        12px;

    min-height:
        52px;

    padding:
        0 24px;

    border-radius:
        12px;

    background:
        #ff6269;

    color:
        #ffffff !important;

    font-size:
        15px;

    font-weight:
        900;

    text-decoration:
        none !important;

    box-shadow:
        0 10px 24px
        rgba(255,98,105,.20);
}


body.mtg-template-tm9
.tm9-core-banner__button:hover{
    transform:
        translateY(-1px);
}


/*
 * MEDIA
 *
 * Igual que la idea visual de TM2:
 * imagen grande dentro del banner,
 * pero con aire alrededor.
 */

body.mtg-template-tm9
.tm9-core-banner__media{
    position:relative;

    min-width:0;

    min-height:
        420px;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:
        36px
        36px
        36px
        18px;
}


body.mtg-template-tm9
.tm9-core-banner__media img{
    width:
        100%;

    height:
        100%;

    min-height:
        348px;

    max-height:
        370px;

    display:block;

    object-fit:
        cover;

    object-position:
        center center;

    border-radius:
        24px;

    box-shadow:
        0 14px 36px
        rgba(22,39,66,.10);
}


body.mtg-template-tm9
.tm9-core-banner__placeholder{
    width:
        100%;

    min-height:
        348px;

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    gap:
        12px;

    border:
        2px dashed
        #d5dfeb;

    border-radius:
        24px;

    color:
        #67758a;

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


/*
 * TABLET
 */

@media (max-width:1100px){

    body.mtg-template-tm9
    .tm9-core-banner{
        min-height:
            390px;

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


    body.mtg-template-tm9
    .tm9-core-banner__copy{
        padding:
            44px
            34px;
    }


    body.mtg-template-tm9
    .tm9-core-banner__media{
        min-height:
            390px;

        padding:
            28px
            28px
            28px
            10px;
    }


    body.mtg-template-tm9
    .tm9-core-banner__media img{
        min-height:
            330px;

        max-height:
            340px;
    }

}


/*
 * MOBILE
 */

@media (max-width:767px){

    body.mtg-template-tm9
    .tm9-core-banner-section{
        padding:
            24px 0
            30px !important;
    }


    body.mtg-template-tm9
    .tm9-core-banner{
        grid-template-columns:
            1fr;

        min-height:
            0;

        border-radius:
            20px;
    }


    body.mtg-template-tm9
    .tm9-core-banner__copy{
        padding:
            34px
            24px;
    }


    body.mtg-template-tm9
    .tm9-core-banner__copy h2{
        font-size:
            clamp(
                34px,
                10vw,
                48px
            );
    }


    body.mtg-template-tm9
    .tm9-core-banner__media{
        min-height:
            280px;

        padding:
            0
            18px
            18px;
    }


    body.mtg-template-tm9
    .tm9-core-banner__media img{
        min-height:
            260px;

        max-height:
            none;

        border-radius:
            18px;
    }

}

/* TM9_CORE_BANNER_NORMALIZED_END */

/* TM9_INTERNAL_PAGES_WIDE_START */

/*
 * ==========================================================
 * TM9 - PAGINAS INTERNAS
 *
 * SHOP
 * CONTACTO
 * CART
 * CHECKOUT
 *
 * Regla:
 * ancho 90%, centrado y sin constraint de WP.
 * ==========================================================
 */


/*
 * ----------------------------------------------------------
 * QUITAR CONSTRAINT DE WORDPRESS
 * ----------------------------------------------------------
 */

body.mtg-template-tm9.mtg-matrix-commerce-shop
.entry-content,

body.mtg-template-tm9.mtg-matrix-commerce-cart
.entry-content,

body.mtg-template-tm9.mtg-matrix-commerce-checkout
.entry-content,

body.mtg-template-tm9.mtg-contact-page
.entry-content{

    width:100% !important;

    max-width:none !important;

    margin-left:0 !important;
    margin-right:0 !important;

    padding-left:0 !important;
    padding-right:0 !important;
}


/*
 * Twenty Twenty-Four mete restricciones
 * mediante layout constrained.
 */

body.mtg-template-tm9.mtg-matrix-commerce-shop
.entry-content > *,

body.mtg-template-tm9.mtg-matrix-commerce-cart
.entry-content > *,

body.mtg-template-tm9.mtg-matrix-commerce-checkout
.entry-content > *,

body.mtg-template-tm9.mtg-contact-page
.entry-content > *{

    max-width:none !important;

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


/*
 * ==========================================================
 * SHOP
 * ==========================================================
 */

body.mtg-template-tm9.mtg-matrix-commerce-shop
.mtg-commerce-internal-matrix{

    width:90% !important;

    max-width:1500px !important;

    margin:
        36px auto
        80px !important;

    padding-left:0 !important;
    padding-right:0 !important;
}


body.mtg-template-tm9.mtg-matrix-commerce-shop
.mtg-shop-shell,

body.mtg-template-tm9.mtg-matrix-commerce-shop
.mtg-shop-page{

    width:100% !important;

    max-width:none !important;

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


/*
 * Sidebar + catálogo.
 *
 * Dejamos espacio suficiente a productos.
 */

body.mtg-template-tm9.mtg-matrix-commerce-shop
.mtg-shop-layout,

body.mtg-template-tm9.mtg-matrix-commerce-shop
.mtg-shop-grid{

    width:100% !important;

    max-width:none !important;

    grid-template-columns:
        minmax(250px,290px)
        minmax(0,1fr) !important;

    gap:34px !important;
}


body.mtg-template-tm9.mtg-matrix-commerce-shop
.mtg-shop-side{

    width:100% !important;

    max-width:290px !important;

    min-width:0 !important;
}


/*
 * ==========================================================
 * CONTACTO
 * ==========================================================
 */

body.mtg-template-tm9.mtg-contact-page
.mtg-contact{

    width:90% !important;

    max-width:1450px !important;

    margin:
        48px auto
        90px !important;

    padding-left:0 !important;
    padding-right:0 !important;
}


/*
 * Hero principal.
 */

body.mtg-template-tm9.mtg-contact-page
.mtg-contact-hero{

    width:100% !important;

    max-width:none !important;

    min-width:0 !important;

    display:grid !important;

    grid-template-columns:
        minmax(0,1.15fr)
        minmax(380px,.85fr) !important;

    gap:42px !important;

    overflow:visible !important;
}


body.mtg-template-tm9.mtg-contact-page
.mtg-contact-hero__copy{

    min-width:0 !important;

    max-width:none !important;
}


body.mtg-template-tm9.mtg-contact-page
.mtg-contact-hero__copy h1{

    max-width:720px !important;

    word-break:normal !important;

    overflow-wrap:normal !important;
}


body.mtg-template-tm9.mtg-contact-page
.mtg-contact-panel{

    width:100% !important;

    min-width:0 !important;

    max-width:none !important;
}


/*
 * Bloques inferiores de Contacto.
 */

body.mtg-template-tm9.mtg-contact-page
.mtg-contact-cards,

body.mtg-template-tm9.mtg-contact-page
.mtg-contact-main{

    width:100% !important;

    max-width:none !important;
}


/*
 * ==========================================================
 * CART
 * ==========================================================
 */

body.mtg-template-tm9.mtg-matrix-commerce-cart
.mtg-commerce-internal-matrix{

    width:90% !important;

    max-width:1350px !important;

    margin:
        42px auto
        90px !important;

    padding-left:0 !important;
    padding-right:0 !important;
}


body.mtg-template-tm9.mtg-matrix-commerce-cart
.mtg-clean-wrap{

    width:100% !important;

    max-width:1180px !important;

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


body.mtg-template-tm9.mtg-matrix-commerce-cart
.mtg-clean-card{

    width:100% !important;

    max-width:none !important;

    padding:
        34px 38px !important;
}


/*
 * La fila del producto necesita espacio.
 */

body.mtg-template-tm9.mtg-matrix-commerce-cart
.mtg-clean-card
table{

    width:100% !important;

    table-layout:auto !important;
}


body.mtg-template-tm9.mtg-matrix-commerce-cart
.mtg-cart-item,

body.mtg-template-tm9.mtg-matrix-commerce-cart
.mtg-clean-cart-item{

    width:100% !important;

    max-width:none !important;
}


/*
 * ==========================================================
 * CHECKOUT
 * ==========================================================
 */

body.mtg-template-tm9.mtg-matrix-commerce-checkout
.mtg-commerce-internal-matrix{

    width:90% !important;

    max-width:1450px !important;

    margin:
        42px auto
        90px !important;

    padding-left:0 !important;
    padding-right:0 !important;
}


body.mtg-template-tm9.mtg-matrix-commerce-checkout
.mtg-clean-wrap{

    width:100% !important;

    max-width:1250px !important;

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


body.mtg-template-tm9.mtg-matrix-commerce-checkout
.mtg-clean-grid{

    width:100% !important;

    max-width:none !important;

    grid-template-columns:
        minmax(0,1.35fr)
        minmax(360px,.85fr) !important;

    gap:32px !important;

    align-items:start !important;
}


body.mtg-template-tm9.mtg-matrix-commerce-checkout
.mtg-clean-card{

    width:100% !important;

    max-width:none !important;
}


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

@media(max-width:1100px){

    body.mtg-template-tm9.mtg-matrix-commerce-shop
    .mtg-shop-layout,

    body.mtg-template-tm9.mtg-matrix-commerce-shop
    .mtg-shop-grid{

        grid-template-columns:
            240px
            minmax(0,1fr) !important;

        gap:24px !important;
    }


    body.mtg-template-tm9.mtg-contact-page
    .mtg-contact-hero{

        grid-template-columns:
            minmax(0,1fr)
            minmax(320px,.85fr) !important;

        gap:28px !important;
    }


    body.mtg-template-tm9.mtg-matrix-commerce-checkout
    .mtg-clean-grid{

        grid-template-columns:
            minmax(0,1fr)
            minmax(320px,.8fr) !important;

        gap:24px !important;
    }

}


/*
 * ==========================================================
 * MOBILE
 * ==========================================================
 */

@media(max-width:820px){

    body.mtg-template-tm9.mtg-matrix-commerce-shop
    .mtg-commerce-internal-matrix,

    body.mtg-template-tm9.mtg-matrix-commerce-cart
    .mtg-commerce-internal-matrix,

    body.mtg-template-tm9.mtg-matrix-commerce-checkout
    .mtg-commerce-internal-matrix,

    body.mtg-template-tm9.mtg-contact-page
    .mtg-contact{

        width:calc(100% - 28px) !important;

        margin:
            28px auto
            60px !important;
    }


    body.mtg-template-tm9.mtg-matrix-commerce-shop
    .mtg-shop-layout,

    body.mtg-template-tm9.mtg-matrix-commerce-shop
    .mtg-shop-grid,

    body.mtg-template-tm9.mtg-contact-page
    .mtg-contact-hero,

    body.mtg-template-tm9.mtg-matrix-commerce-checkout
    .mtg-clean-grid{

        grid-template-columns:
            1fr !important;
    }


    body.mtg-template-tm9.mtg-matrix-commerce-shop
    .mtg-shop-side{

        width:100% !important;

        max-width:none !important;
    }


    body.mtg-template-tm9.mtg-matrix-commerce-cart
    .mtg-clean-card{

        padding:
            24px 20px !important;
    }

}

/* TM9_INTERNAL_PAGES_WIDE_END */