:root{
      --red:#0057b8;
      --red-dark:#00479a;
      --black:#08111f;
      --black-2:#0d1b30;
      --gray:#60708a;
      --light:#f3f7fc;
      --line:#dbe6f3;
      --white:#ffffff;
      --green:#0b5aa9;
      --orange:#5b8fd8;
      --purple:#2f73d9;
      --radius:24px;
      --shadow:0 20px 55px rgba(0,0,0,.12);
      --container:1240px;
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:Inter,Arial,Helvetica,sans-serif;
      color:var(--black);
      background:var(--white);
      line-height:1.5;
      overflow-x:hidden;
    }
    img{max-width:100%;display:block}
    a{text-decoration:none;color:inherit}
    button{font:inherit}
    .container{width:min(92%,var(--container));margin:auto}

    .topline{
      height:4px;
      background:linear-gradient(90deg,var(--red),#4f8ff0 45%,var(--black) 45%);
    }

    .header{
      position:sticky;top:0;z-index:1000;
      background:rgba(255,255,255,.88);
      backdrop-filter:blur(16px);
      border-bottom:1px solid rgba(0,0,0,.06);
    }
    .nav{
      height:78px;display:flex;align-items:center;justify-content:space-between;gap:28px;
    }
    .brand{
      display:flex;align-items:center;gap:10px;font-weight:950;letter-spacing:-1.6px;
      font-size:32px;
    }
    .brand-mark{
      width:42px;height:16px;border-radius:100% 0 100% 0;
      background:linear-gradient(90deg,#0057b8,#2f73d9);transform:skewX(-28deg);
    }
    .brand small{font-size:12px;letter-spacing:1.4px;color:var(--gray);font-weight:800}
    .menu{display:flex;gap:24px;align-items:center;font-size:14px;font-weight:800}
    .menu a{position:relative}
    .menu a:after{
      content:"";position:absolute;left:0;bottom:-8px;width:0;height:2px;background:#0057b8;transition:.25s;
    }
    .menu a:hover:after{width:100%}
    .menu-btn{display:none;border:0;background:#fff;font-size:26px;cursor:pointer}

    .hero{
      min-height:760px;
      background:
        radial-gradient(circle at 75% 30%,rgba(0,87,184,.20),transparent 26%),
        linear-gradient(120deg,#0f1115 0%,#17191e 58%,#22242a 100%);
      color:#fff;
      position:relative;overflow:hidden;
    }
    .hero:before{
      content:"ERKE";position:absolute;right:-35px;bottom:-60px;
      font-size:260px;font-weight:950;letter-spacing:-12px;color:rgba(103,162,255,.06)
    }
    .hero-grid{
      min-height:760px;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:48px;
    }
    .eyebrow{
      color:#67a2ff;font-size:13px;font-weight:900;letter-spacing:2.2px;text-transform:uppercase;margin-bottom:16px
    }
    .hero h1{
      font-size:clamp(54px,7.5vw,104px);line-height:.9;letter-spacing:-5px;margin:0 0 24px;font-style:italic;
    }
    .hero h1 span{color:var(--red)}
    .hero p{font-size:19px;color:#d8e4f4;max-width:640px;margin-bottom:30px}
    .actions{display:flex;gap:12px;flex-wrap:wrap}
    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:10px;
      padding:14px 21px;border-radius:12px;border:1px solid transparent;font-weight:900;cursor:pointer;transition:.25s;
    }
    .btn-red{background:#0057b8;color:#fff}
    .btn-red:hover{background:#00479a;transform:translateY(-2px)}
    .btn-ghost{border-color:#3b3f47;color:#fff;background:rgba(255,255,255,.04)}
    .btn-ghost:hover{background:rgba(255,255,255,.1)}
    .hero-panel{
      background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.03));
      border:1px solid rgba(255,255,255,.11);
      border-radius:32px;padding:26px;box-shadow:0 30px 80px rgba(4,45,95,.34);
    }
    .shoe-orbit{
      min-height:430px;border-radius:24px;
      background:
        radial-gradient(circle at 50% 50%,rgba(0,87,184,.42),transparent 32%),
        linear-gradient(135deg,#202229,#0d0f12);
      position:relative;display:grid;place-items:center;overflow:hidden;
    }
    .shoe-orbit:before,.shoe-orbit:after{
      content:"";position:absolute;border:1px solid rgba(255,255,255,.12);border-radius:50%;
    }
    .shoe-orbit:before{width:360px;height:360px}
    .shoe-orbit:after{width:250px;height:250px}
    .shoe-shape{
      width:320px;height:125px;background:linear-gradient(135deg,#f8fbff,#d7e6fb);
      border-radius:65% 35% 32% 68% / 63% 62% 38% 37%;
      transform:rotate(-9deg);
      box-shadow:0 30px 55px rgba(0,0,0,.45);
      position:relative;z-index:2;
    }
    .shoe-shape:before{
      content:"";position:absolute;right:35px;top:40px;width:120px;height:16px;background:#0057b8;border-radius:30px;transform:skewX(-20deg);
    }
    .shoe-shape:after{
      content:"";position:absolute;left:18px;right:18px;bottom:-13px;height:24px;background:#202226;border-radius:50%;
    }
    .hero-tags{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
    .hero-tag{
      padding:12px 14px;border-radius:14px;background:#0f1b2e;border:1px solid #22416c;
      font-size:12px;color:#d2dded
    }
    .hero-tag strong{display:block;color:#fff;font-size:15px;margin-bottom:2px}

    section{padding:88px 0}
    .section-head{
      display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:34px
    }
    .section-head h2{font-size:clamp(34px,4vw,56px);letter-spacing:-2px;margin:0}
    .section-head p{max-width:650px;color:var(--gray);margin:0}

    .worlds{background:var(--light)}
    .tabs{
      display:flex;gap:10px;flex-wrap:wrap;margin-bottom:26px
    }
    .tab-btn{
      border:1px solid var(--line);background:#fff;padding:12px 17px;border-radius:999px;font-weight:900;cursor:pointer;
      transition:.2s
    }
    .tab-btn.active,.tab-btn:hover{background:var(--black);color:#fff;border-color:var(--black)}
    .tab-pane{display:none}
    .tab-pane.active{display:block;animation:fade .35s ease}
    @keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

    .world-card{
      display:grid;grid-template-columns:1.05fr .95fr;gap:26px;background:#fff;border-radius:30px;padding:28px;box-shadow:var(--shadow)
    }
    .world-visual{
      min-height:390px;border-radius:24px;padding:28px;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;
      overflow:hidden;position:relative;
    }
    .world-visual h3{font-size:48px;line-height:.95;margin:0 0 8px;letter-spacing:-2px}
    .world-visual p{max-width:520px;color:#eef0f2}
    .run{background:linear-gradient(135deg,#003b7c,#0a67d1)}
    .cross{background:linear-gradient(135deg,#0a2b59,#4a8be8)}
    .tennis{background:linear-gradient(135deg,#06162c,#1160be)}
    .life{background:linear-gradient(135deg,#13253d,#4d7cc5)}
    .tech{background:linear-gradient(135deg,#0d1728,#284a7d)}
    .world-info{display:flex;flex-direction:column;justify-content:center}
    .mini-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:20px}
    .mini-card{border:1px solid var(--line);border-radius:18px;padding:16px;background:#fff}
    .mini-card span{font-size:12px;color:var(--gray);font-weight:800}
    .mini-card strong{display:block;margin:5px 0;font-size:18px}

    .products{background:#fff}
    .product-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
    .product-card{
      border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#fff;transition:.25s;cursor:pointer
    }
    .product-card:hover{transform:translateY(-7px);box-shadow:var(--shadow)}
    .product-media{
      height:210px;display:grid;place-items:center;position:relative;overflow:hidden;
      background:linear-gradient(145deg,#f7fbff,#dbe8f9)
    }
    .product-media.dark{background:linear-gradient(145deg,#1d2025,#090b0e)}
    .product-media.green{background:linear-gradient(145deg,#0f4b94,#06284f)}
    .product-media.gold{background:linear-gradient(145deg,#7fb0ff,#0a57b6)}
    .product-media.purple{background:linear-gradient(145deg,#7aa9f5,#14498f)}
    .mini-shoe{
      width:165px;height:62px;border-radius:70% 35% 35% 60%;background:#f7f7f7;transform:rotate(-9deg);
      box-shadow:0 15px 28px rgba(0,0,0,.22);position:relative
    }
    .mini-shoe:after{content:"";position:absolute;left:6px;right:6px;bottom:-9px;height:14px;border-radius:50%;background:#1c1d20}
    .product-body{padding:18px}
    .product-body small{font-weight:900;color:var(--red)}
    .product-body h3{margin:5px 0 8px;font-size:22px}
    .product-body p{font-size:13px;color:var(--gray);margin:0}

    .technology{background:var(--black);color:#fff}
    .technology .section-head p{color:#bdd1ec}
    .tech-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
    .tech-card{
      background:linear-gradient(150deg,#10213a,#07111f);border:1px solid #22416c;border-radius:24px;padding:24px;min-height:280px;
      transition:.25s
    }
    .tech-card:hover{transform:translateY(-5px);border-color:#5f9cf0}
    .tech-icon{
      width:60px;height:60px;border-radius:18px;background:#0057b8;display:grid;place-items:center;font-weight:950;font-size:22px;margin-bottom:42px
    }
    .tech-card:nth-child(2) .tech-icon{background:#4b8ef5}
    .tech-card:nth-child(3) .tech-icon{background:#0f63c7}
    .tech-card:nth-child(4) .tech-icon{background:#78a9f7}
    .tech-card h3{font-size:25px;margin:0 0 10px}
    .tech-card p{color:#b7bcc4;font-size:14px}

    .looks{background:var(--light)}
    .look-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .look-card{
      border-radius:26px;overflow:hidden;background:#fff;border:1px solid var(--line);transition:.25s
    }
    .look-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
    .look-visual{
      height:320px;padding:22px;display:flex;align-items:end;color:#fff;
      background:
        linear-gradient(180deg,transparent,rgba(0,0,0,.68)),
        linear-gradient(135deg,#0057b8,#09182d);
    }
    .look-card:nth-child(2) .look-visual{background:linear-gradient(180deg,transparent,rgba(0,0,0,.68)),linear-gradient(135deg,#3479de,#10233f)}
    .look-card:nth-child(3) .look-visual{background:linear-gradient(180deg,transparent,rgba(0,0,0,.68)),linear-gradient(135deg,#4c6ea8,#0d1728)}
    .look-visual h3{font-size:30px;margin:0}
    .look-body{padding:20px}
    .look-body p{color:var(--gray);font-size:14px;margin:0 0 10px}
    .pill{display:inline-block;background:#e8f1fd;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:900;margin:4px 4px 0 0}

    .lifestyle-strip{
      display:grid;grid-template-columns:repeat(4,1fr);gap:12px
    }
    .life-card{
      min-height:250px;border-radius:24px;padding:22px;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;
      background:linear-gradient(155deg,#0c1a2f,#2c67b5);position:relative;overflow:hidden;transition:.25s
    }
    .life-card:hover{transform:scale(1.02)}
    .life-card:nth-child(2){background:linear-gradient(155deg,#edf5ff,#86aee9);color:#0b1a2f}
    .life-card:nth-child(3){background:linear-gradient(155deg,#17345f,#0b1220)}
    .life-card:nth-child(4){background:linear-gradient(155deg,#314f80,#6da3f5)}
    .life-card h3{font-size:26px;margin:0 0 5px}
    .life-card p{font-size:13px;margin:0;opacity:.9}

    .stores{
      background:linear-gradient(140deg,#fff,#f4f4f1)
    }
    .store-panel{
      border-radius:30px;background:#fff;border:1px solid var(--line);padding:28px;
      display:grid;grid-template-columns:.8fr 1.2fr;gap:28px
    }
    .map{
      min-height:380px;border-radius:24px;background:
        linear-gradient(0deg,rgba(255,255,255,.82),rgba(255,255,255,.82)),
        repeating-linear-gradient(45deg,#d8e7fb 0 12px,#edf5ff 12px 24px);
      position:relative;overflow:hidden
    }
    .map:before{
      content:"ECUADOR";position:absolute;inset:0;display:grid;place-items:center;font-weight:950;font-size:56px;color:#9fb9dc;letter-spacing:4px
    }
    .store-list{display:grid;gap:12px}
    .store-item{padding:17px;border:1px solid var(--line);border-radius:18px}
    .store-item strong{display:block;margin-bottom:5px}
    .store-item span{font-size:13px;color:var(--gray)}

    footer{background:#08111f;color:#fff;padding:54px 0 22px}
    .footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:34px}
    footer h4{margin:0 0 12px}
    footer p,footer a{font-size:13px;color:#bdd1ec}
    footer a{display:block;margin:7px 0}
    .copy{margin-top:34px;padding-top:18px;border-top:1px solid #20375a;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap}

    .floating{
      position:fixed;right:20px;bottom:20px;z-index:1200;width:58px;height:58px;border-radius:50%;
      display:grid;place-items:center;background:#0057b8;color:#fff;font-weight:950;box-shadow:0 16px 30px rgba(0,0,0,.25);
    }

    .reveal{opacity:0;transform:translateY(18px);transition:.65s}
    .reveal.show{opacity:1;transform:none}

    @media(max-width:1000px){
      .menu-btn{display:block}
      .menu{
        position:absolute;left:0;right:0;top:78px;background:#fff;padding:22px 4%;
        flex-direction:column;align-items:flex-start;transform:translateY(-140%);opacity:0;pointer-events:none;transition:.3s;
        border-bottom:1px solid var(--line)
      }
      .menu.open{transform:none;opacity:1;pointer-events:auto}
      .hero-grid,.world-card,.store-panel{grid-template-columns:1fr}
      .product-grid{grid-template-columns:repeat(2,1fr)}
      .tech-grid{grid-template-columns:repeat(2,1fr)}
      .look-grid{grid-template-columns:1fr}
      .lifestyle-strip{grid-template-columns:repeat(2,1fr)}
      .footer-grid{grid-template-columns:repeat(2,1fr)}
    }
    @media(max-width:650px){
      .nav{height:68px}
      .brand{font-size:27px}
      .menu{top:68px}
      .hero,.hero-grid{min-height:720px}
      .hero-grid{padding:70px 0}
      .hero h1{font-size:58px;letter-spacing:-3px}
      .shoe-orbit{min-height:300px}
      .shoe-shape{width:240px;height:95px}
      section{padding:64px 0}
      .section-head{flex-direction:column;align-items:flex-start}
      .product-grid,.tech-grid,.lifestyle-strip,.mini-grid{grid-template-columns:1fr}
      .hero-tags{grid-template-columns:1fr}
      .footer-grid{grid-template-columns:1fr}
    }
  
    /* EXTRA MOTION */
    @keyframes floatSoft{
      0%,100%{transform:translateY(0)}
      50%{transform:translateY(-12px)}
    }
    @keyframes pulseGlow{
      0%,100%{box-shadow:0 0 0 0 rgba(0,87,184,.18)}
      50%{box-shadow:0 0 0 18px rgba(0,87,184,0)}
    }
    @keyframes shine{
      0%{transform:translateX(-120%) skewX(-18deg)}
      100%{transform:translateX(220%) skewX(-18deg)}
    }
    @keyframes zoomIn{
      from{opacity:0;transform:scale(.92) translateY(12px)}
      to{opacity:1;transform:scale(1) translateY(0)}
    }
    @keyframes marqueeMove{
      from{transform:translateX(0)}
      to{transform:translateX(-50%)}
    }

    .brand-mark{animation:floatSoft 4s ease-in-out infinite}
    .shoe-shape{animation:floatSoft 3.8s ease-in-out infinite}
    .btn-red{position:relative;overflow:hidden}
    .btn-red::after{
      content:"";position:absolute;top:-30%;left:-30%;width:28%;height:160%;
      background:rgba(255,255,255,.32);transform:skewX(-18deg);
      animation:shine 3.2s ease-in-out infinite;
    }
    .floating{animation:pulseGlow 2.8s ease-in-out infinite}

    .hero-panel{transition:transform .35s ease, box-shadow .35s ease}
    .hero-panel:hover{transform:translateY(-6px) rotateX(1deg) rotateY(-1deg)}
    .product-card,.tech-card,.look-card,.life-card,.store-item{will-change:transform}

    .ticker{
      overflow:hidden;
      background:#0057b8;
      color:#fff;
      border-top:1px solid rgba(255,255,255,.08);
      border-bottom:1px solid rgba(255,255,255,.08);
    }
    .ticker-track{
      display:flex;
      gap:44px;
      width:max-content;
      padding:11px 0;
      white-space:nowrap;
      animation:marqueeMove 22s linear infinite;
      font-weight:900;
      font-size:13px;
      letter-spacing:1.2px;
    }
    .ticker-track span{opacity:.96}

    /* WELCOME POPUP */
    .popup-backdrop{
      position:fixed;inset:0;z-index:2500;
      display:flex;align-items:center;justify-content:center;
      padding:20px;background:rgba(3,15,32,.62);
      backdrop-filter:blur(12px);
      opacity:0;pointer-events:none;transition:.28s;
    }
    .popup-backdrop.show{opacity:1;pointer-events:auto}
    .popup-card{
      width:min(94%,760px);
      background:
        radial-gradient(circle at 78% 20%,rgba(77,140,229,.24),transparent 30%),
        linear-gradient(145deg,#ffffff,#edf5ff);
      border:1px solid #d2e1f4;
      border-radius:30px;
      box-shadow:0 32px 90px rgba(4,45,95,.28);
      overflow:hidden;
      animation:zoomIn .45s ease;
      position:relative;
    }
    .popup-grid{
      display:grid;
      grid-template-columns:1fr .9fr;
      min-height:420px;
    }
    .popup-copy{
      padding:42px;
      display:flex;
      flex-direction:column;
      justify-content:center;
    }
    .popup-copy h2{
      margin:0 0 14px;
      font-size:clamp(38px,5vw,62px);
      line-height:.95;
      letter-spacing:-2.5px;
      color:#08111f;
    }
    .popup-copy h2 span{color:#0057b8}
    .popup-copy p{
      margin:0 0 24px;
      color:#60708a;
      font-size:16px;
    }
    .popup-visual{
      background:
        radial-gradient(circle at 50% 40%,rgba(255,255,255,.22),transparent 28%),
        linear-gradient(155deg,#0057b8,#08244b);
      position:relative;
      overflow:hidden;
      display:grid;
      place-items:center;
      min-height:320px;
    }
    .popup-visual:before{
      content:"ERKE";
      position:absolute;
      font-size:120px;
      font-weight:950;
      letter-spacing:-8px;
      color:rgba(255,255,255,.08);
      transform:rotate(-90deg);
      right:-55px;
    }
    .popup-shoe{
      width:245px;height:92px;
      border-radius:70% 35% 35% 60%;
      background:linear-gradient(135deg,#fff,#d8e6fa);
      transform:rotate(-10deg);
      box-shadow:0 24px 55px rgba(0,0,0,.32);
      position:relative;
      animation:floatSoft 3.1s ease-in-out infinite;
    }
    .popup-shoe:before{
      content:"";position:absolute;right:30px;top:31px;width:92px;height:14px;
      background:#0057b8;border-radius:30px;transform:skewX(-18deg);
    }
    .popup-shoe:after{
      content:"";position:absolute;left:10px;right:10px;bottom:-10px;height:16px;
      background:#0d1728;border-radius:50%;
    }
    .popup-close{
      position:absolute;right:16px;top:14px;z-index:3;
      width:42px;height:42px;border-radius:50%;
      border:0;background:rgba(255,255,255,.86);
      color:#0b1a2f;font-size:24px;cursor:pointer;
      box-shadow:0 8px 20px rgba(0,0,0,.12);
    }
    .popup-actions{display:flex;gap:10px;flex-wrap:wrap}
    .popup-note{margin-top:14px;font-size:12px;color:#7b8797}

    @media(max-width:760px){
      .popup-grid{grid-template-columns:1fr}
      .popup-visual{min-height:220px}
      .popup-copy{padding:30px}
    }


    /* MOCKUP CON IMÁGENES DEL MATERIAL 26Q3 */
    .brand-mark{display:none}
    .brand-logo-img{height:44px;width:auto;object-fit:contain}
    .shoe-orbit{
      background:
        linear-gradient(180deg,rgba(7,20,40,.08),rgba(7,20,40,.38)),
        url('../img/hero.png') center 22%/cover no-repeat!important;
    }
    .shoe-orbit .shoe-shape{display:none}
    .popup-visual{
      background:
        linear-gradient(180deg,rgba(0,87,184,.08),rgba(4,31,66,.48)),
        url('../img/p6.png') center 13%/cover no-repeat!important;
    }
    .popup-visual .popup-shoe{display:none}
    .popup-visual:before{display:none}

    .product-media{background-size:cover!important;background-position:center 16%!important}
    .product-card:nth-child(1) .product-media{background-image:url('../img/p6.png')!important}
    .product-card:nth-child(2) .product-media{background-image:url('../img/p7.png')!important}
    .product-card:nth-child(3) .product-media{background-image:url('../img/p8.png')!important}
    .product-card:nth-child(4) .product-media{background-image:url('../img/p11.png')!important}
    .product-card:nth-child(5) .product-media{background-image:url('../img/p18.png')!important}
    .product-media .mini-shoe{display:none}

    .look-card:nth-child(1) .look-visual{
      background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.70)),
                 url('../img/p22.png') center/cover no-repeat!important;
    }
    .look-card:nth-child(2) .look-visual{
      background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.70)),
                 url('../img/p23.png') center/cover no-repeat!important;
    }
    .look-card:nth-child(3) .look-visual{
      background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.70)),
                 url('../img/p24.png') center/cover no-repeat!important;
    }

    .life-card:nth-child(1){
      background:linear-gradient(180deg,transparent,rgba(5,19,38,.78)),
                 url('../img/p16.png') center/cover no-repeat!important;
    }
    .life-card:nth-child(2){
      background:linear-gradient(180deg,transparent,rgba(5,19,38,.78)),
                 url('../img/p14.png') center/cover no-repeat!important;color:#fff!important;
    }
    .life-card:nth-child(3){
      background:linear-gradient(180deg,transparent,rgba(5,19,38,.78)),
                 url('../img/p15.png') center/cover no-repeat!important;
    }
    .life-card:nth-child(4){
      background:linear-gradient(180deg,transparent,rgba(5,19,38,.78)),
                 url('../img/p19.png') center/cover no-repeat!important;
    }

    .world-visual.run{
      background:linear-gradient(180deg,rgba(0,33,75,.05),rgba(0,33,75,.80)),
                 url('../img/p6.png') center 15%/cover no-repeat!important;
    }
    .world-visual.cross{
      background:linear-gradient(180deg,rgba(0,33,75,.05),rgba(0,33,75,.82)),
                 url('../img/p11.png') center 15%/cover no-repeat!important;
    }
    .world-visual.tennis{
      background:linear-gradient(180deg,rgba(0,33,75,.05),rgba(0,33,75,.82)),
                 url('../img/app14.png') center/cover no-repeat!important;
    }
    .world-visual.life{
      background:linear-gradient(180deg,rgba(0,33,75,.05),rgba(0,33,75,.82)),
                 url('../img/p27.png') center/cover no-repeat!important;
    }
    .world-visual.tech{
      background:linear-gradient(180deg,rgba(0,33,75,.08),rgba(0,33,75,.84)),
                 url('../img/app23.png') center/cover no-repeat!important;
    }

    .mockup-badge{
      position:absolute;left:18px;top:18px;z-index:4;
      padding:8px 11px;border-radius:999px;background:rgba(255,255,255,.9);
      color:#0057b8;font-size:11px;font-weight:900;letter-spacing:.6px;
      box-shadow:0 8px 20px rgba(0,0,0,.12)
    }