/* ── Nubik topbar & footer vars ── */

/* ── Ocultar la barra superior blanca de Google ── */
.goog-te-banner-frame.skiptranslate {
  display: none !important;
}
body {
  top: 0px !important;
  position: static !important;
}

/* ── Ocultar el texto "Powered by Google" ── */
.goog-te-gadget {
  color: transparent !important;
  font-size: 0px !important;
  margin-top: 2px;
}
.goog-logo-link {
  display: none !important;
}

/* ── Estilizar el menú desplegable (Select) ── */
.goog-te-combo {
  background-color: #060810 !important; /* Fondo oscuro absoluto */
  color: #00ffcc !important; /* Cyan absoluto */
  border: 1px solid rgba(0, 255, 204, 0.35) !important;
  border-radius: 999px !important;
  padding: 6px 12px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  outline: none !important;
  cursor: pointer !important;
  margin: 0 !important;
}

/* ── Color de las opciones al desplegar ── */
.goog-te-combo option {
  background-color: #0d1320 !important; /* Fondo oscuro para que se lea el texto */
  color: #ffffff !important; /* Texto blanco */
}
/* 1. Ocultar la barra superior blanca de Google */
    .goog-te-banner-frame {
      display: none !important;
    }
    .skiptranslate > iframe {
      display: none !important;
    }

    /* 2. Eliminar el espacio vacío que deja la barra en la parte superior */
    body {
      top: 0px !important;
      position: static !important;
    }

    /* 3. Ocultar el fondo amarillo que aparece al pasar el ratón sobre texto traducido */
    .goog-text-highlight {
      background-color: transparent !important;
      box-shadow: none !important;
    }

/* ── Fin traducir la pagina ── */ 

:root{
    --nubik-bg: #060810;
    --nubik-border: rgba(255,255,255,0.05);
    --nubik-text: #edf4ff;
    --nubik-muted: #95a7ba;
    --nubik-cyan: #00ffcc;
    --nubik-blue: #00aaff;
    --nubik-wrap: min(1240px, calc(100% - 32px));
    --nubik-shadow: 0 18px 48px rgba(0,0,0,0.28);
    --nubik-radius: 24px;

    /* DJI catalog vars */
    --bg:#080a0e;
    --bg2:#0d1117;
    --bg3:#131920;
    --card:#111820;
    --border:rgba(255,255,255,.07);
    --border-hover:rgba(255,200,0,.4);
    --yellow:#ffc600;
    --yellow-dim:rgba(255,198,0,.12);
    --text:#e8edf5;
    --text-muted:#6b7a8d;
    --text-dim:#3d4a5a;
    --ok:#9df5c7;
    --bad:#f0b1b1;
  }

  *{margin:0;padding:0;box-sizing:border-box}

  body{
    background:var(--bg);
    color:var(--text);
    font-family:'Inter',sans-serif;
    min-height:100vh;
    overflow-x:hidden;
  }

  /* ════════════════════════════════════════
     NUBIK TOPBAR
  ════════════════════════════════════════ */
  .nubik-topbar {
    position: sticky;
    top: 0;
    z-index: 200;
    backdrop-filter: blur(12px);
    background: rgba(6, 8, 16, 0.92);
    border-bottom: 1px solid var(--nubik-border);
  }
  .nubik-topbar-inner {
      width: 100%;
      margin: 0;
      padding: 0 80px;
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
  }
  .nubik-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: 'Orbitron', sans-serif;
    font-weight: 800;
    font-size: 1rem;
    letter-spacing: 0.16em;
    white-space: nowrap;
    color: var(--nubik-text);
    text-decoration: none;
  }
  .nubik-brand-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--nubik-cyan);
    box-shadow: 0 0 0 0 rgba(0,255,204,0.45), 0 0 18px rgba(0,255,204,0.45);
    animation: nubikPulse 2.8s ease-in-out infinite;
    flex: 0 0 auto;
  }
  @keyframes nubikPulse {
    0%,100%{ transform:scale(1); box-shadow:0 0 0 0 rgba(0,255,204,0.45),0 0 18px rgba(0,255,204,0.45); }
    50%{ transform:scale(1.35); box-shadow:0 0 0 10px rgba(0,255,204,0),0 0 30px rgba(0,255,204,0.6); }
  }
  .nubik-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
  }
  .nubik-nav a {
    color: var(--nubik-muted);
    padding: 8px 12px;
    border-radius: 999px;
    font-size: 1rem;
    text-decoration: none;
    transition: 0.2s ease;
    font-family: 'Inter', sans-serif;
  }
  .nubik-nav a:hover { color: var(--nubik-text); background: rgba(255,255,255,0.04); }
  .nubik-nav a.active { color: var(--nubik-cyan); }
  .nubik-session {
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid rgba(0,255,204,0.16);
    color: var(--nubik-cyan);
    background: rgba(0,255,204,0.06);
    font-size: 0.82rem;
    white-space: nowrap;
    font-family: 'Inter', sans-serif;
  }
  @media(max-width:768px){
    .nubik-topbar-inner{ min-height:auto; padding:10px 0; flex-wrap:wrap; }
    .nubik-session{ display:none; }
    .nubik-nav a{ padding:6px 8px; font-size:0.8rem; }
  }

  /* ════════════════════════════════════════
     NUBIK FOOTER
  ════════════════════════════════════════ */
  .nubik-footer {
    border-top: 1px solid var(--nubik-border);
    background: rgba(6,8,16,0.95);
    margin-top: 0;
  }
  .nubik-footer-inner {
    width: var(--nubik-wrap);
    margin: 0 auto;
    padding: 24px 0 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
  }
  .nubik-footer-copy {
    display: grid;
    gap: 6px;
  }
  .nubik-footer-copy p {
    color: var(--nubik-muted);
    font-size: 0.88rem;
    font-family: 'Inter', sans-serif;
  }
  .nubik-footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
  }
  .nubik-footer-links a {
    color: var(--nubik-muted);
    padding: 8px 12px;
    border-radius: 999px;
    font-size: 0.88rem;
    text-decoration: none;
    transition: 0.2s ease;
    font-family: 'Inter', sans-serif;
  }
  .nubik-footer-links a:hover { color: var(--nubik-text); background: rgba(255,255,255,0.04); }

  /* ════════════════════════════════════════
     DJI CATALOG — original styles
  ════════════════════════════════════════ */
  .hero{
    position:relative;
    padding:80px 40px 60px;
    text-align:center;
    background:radial-gradient(ellipse 80% 60% at 50% 0%, rgba(255,198,0,.06) 0%, transparent 70%);
    border-bottom:1px solid var(--border);
    overflow:hidden;
  }
  .hero::before{
    content:'';
    position:absolute;inset:0;
    background:
      repeating-linear-gradient(0deg, transparent, transparent 39px, rgba(255,255,255,.02) 39px, rgba(255,255,255,.02) 40px),
      repeating-linear-gradient(90deg, transparent, transparent 39px, rgba(255,255,255,.02) 39px, rgba(255,255,255,.02) 40px);
    pointer-events:none;
  }
  .hero-eyebrow{
    font-family:'Space Mono',monospace;
    font-size:11px;
    letter-spacing:.25em;
    color:var(--yellow);
    text-transform:uppercase;
    margin-bottom:20px;
    opacity:0;
    animation:fadeUp .6s ease forwards .2s;
  }
  .hero-title{
    font-family:'Bebas Neue',sans-serif;
    font-size:clamp(32px,6vw,70px);
    line-height:.9;
    letter-spacing:.02em;
    color:#fff;
    margin-bottom:8px;
    opacity:0;
    animation:fadeUp .7s ease forwards .3s;
  }
  .hero-title span{color:var(--yellow);display:block}
  .hero-sub{
    font-size:15px;
    color:var(--text-muted);
    margin-top:20px;
    font-weight:300;
    letter-spacing:.02em;
    opacity:0;
    animation:fadeUp .7s ease forwards .5s;
  }
  .hero-note{
    margin-top:14px;
    max-width:1000px;
    margin-left:auto;
    margin-right:auto;
    font-size:12px;
    line-height:1.6;
    color:var(--text-dim);
    opacity:0;
    animation:fadeUp .7s ease forwards .6s;
  }
  .hero-stats{
    display:flex;
    gap:40px;
    justify-content:center;
    margin-top:36px;
    flex-wrap:wrap;
    opacity:0;
    animation:fadeUp .7s ease forwards .7s;
  }
  .hero-stat{text-align:center}
  .hero-stat-num{
    font-family:'Bebas Neue',sans-serif;
    font-size:36px;
    color:var(--yellow);
    line-height:1;
  }
  .hero-stat-label{
    font-size:11px;
    color:var(--text-muted);
    letter-spacing:.15em;
    text-transform:uppercase;
    margin-top:4px;
  }

  .controls{
    position:sticky;
    top:68px;
    z-index:100;
    background:rgba(8,10,14,.95);
    backdrop-filter:blur(12px);
    border-bottom:1px solid var(--border);
    padding:14px 40px;
    display:flex;
    gap:12px;
    align-items:center;
    flex-wrap:wrap;
  }
  .search-box{
    flex:1;
    min-width:220px;
    max-width:340px;
    position:relative;
  }
  .search-box input{
    width:100%;
    background:var(--bg3);
    border:1px solid var(--border);
    color:var(--text);
    padding:9px 14px 9px 38px;
    border-radius:6px;
    font-size:13px;
    font-family:'Inter',sans-serif;
    outline:none;
    transition:border-color .2s;
  }
  .search-box input:focus{border-color:var(--yellow)}
  .search-icon{
    position:absolute;
    left:11px;
    top:50%;
    transform:translateY(-50%);
    color:var(--text-dim);
    width:16px;height:16px;
    pointer-events:none;
  }
  .search-icon svg,
  .view-btn svg,
  .card-icon svg,
  .list-icon svg,
  .modal-icon svg,
  .empty-icon svg{
    width:100%;height:100%;
    stroke:currentColor;fill:none;
    stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
  }

  .filter-group{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
  .filter-label{
    font-family:'Space Mono',monospace;
    font-size:10px;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--text-dim);
    margin-right:2px;
  }
  .filter-btns{display:flex;gap:6px;flex-wrap:wrap;}
  .filter-btn{
    padding:7px 14px;
    border-radius:5px;
    border:1px solid var(--border);
    background:transparent;
    color:var(--text-muted);
    font-size:12px;
    font-family:'Inter',sans-serif;
    cursor:pointer;
    transition:all .2s;
    white-space:nowrap;
  }
  .filter-btn:hover{border-color:var(--yellow);color:var(--yellow)}
  .filter-btn.active{background:var(--yellow);color:#000;border-color:var(--yellow);font-weight:600}

  .view-toggle{display:flex;gap:4px;margin-left:auto}
  .view-btn{
    width:36px;height:34px;
    border:1px solid var(--border);
    background:transparent;
    color:var(--text-muted);
    border-radius:5px;
    cursor:pointer;
    transition:all .2s;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  .view-btn.active{background:var(--bg3);color:var(--text);border-color:var(--border-hover)}

  .compare-panel{max-width:1600px;margin:18px auto 0;padding:0 40px;}
  .compare-box{background:var(--bg2);border:1px solid var(--border);border-radius:12px;overflow:hidden;}
  .compare-box-head{
    padding:16px 18px;
    border-bottom:1px solid var(--border);
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
  }
  .compare-title{font-family:'Bebas Neue',sans-serif;font-size:30px;letter-spacing:.04em;color:#fff;line-height:1;}
  .compare-subtitle{font-size:12px;color:var(--text-muted);margin-top:4px;}
  .compare-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
  .compare-pill{font-size:12px;color:var(--text-muted);border:1px solid var(--border);background:rgba(255,255,255,.03);border-radius:999px;padding:8px 12px;}
  .compare-clear{border:1px solid var(--border);background:transparent;color:var(--text);border-radius:8px;padding:8px 12px;cursor:pointer;}
  .compare-clear:hover{border-color:var(--yellow);color:var(--yellow);}
  .compare-content{padding:14px 18px 18px;}
  .compare-empty{padding:24px 10px;color:var(--text-muted);font-size:13px;}
  .compare-table-wrap{overflow:auto;border:1px solid var(--border);border-radius:10px;}
  .compare-table{width:100%;min-width:850px;border-collapse:collapse;background:var(--card);}
  .compare-table th,.compare-table td{border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:12px;vertical-align:top;text-align:left;}
  .compare-table th:last-child,.compare-table td:last-child{border-right:none}
  .compare-table tr:last-child td{border-bottom:none}
  .compare-table thead th{background:var(--bg3);position:sticky;top:0;z-index:2;}
  .compare-label-col{width:220px;min-width:220px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim);font-family:'Space Mono',monospace;}
  .compare-drone-col{min-width:220px;}
  .compare-drone-img{width:160px;height:96px;margin:0 auto 10px;display:block;position:relative;overflow:hidden;border-radius:12px;background:var(--bg3);}
  .compare-drone-img img{
    width:100%;height:100%;object-fit:cover;display:block;
    -webkit-mask-image:linear-gradient(to right,transparent 0,#000 3px,#000 calc(100% - 3px),transparent 100%),linear-gradient(to bottom,transparent 0,#000 3px,#000 calc(100% - 3px),transparent 100%);
    -webkit-mask-composite:source-in;
    mask-image:linear-gradient(to right,transparent 0,#000 3px,#000 calc(100% - 3px),transparent 100%),linear-gradient(to bottom,transparent 0,#000 3px,#000 calc(100% - 3px),transparent 100%);
    mask-composite:intersect;
  }
  .compare-series-badge{display:inline-block;font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;padding:4px 10px;border-radius:999px;margin-bottom:10px;}
  .compare-drone-name{font-size:18px;font-weight:700;color:#fff;line-height:1.25;margin-bottom:6px;}
  .compare-drone-meta{font-size:12px;color:var(--text-muted);line-height:1.5;}
  .compare-highlight-list{display:flex;flex-direction:column;gap:8px;}
  .compare-highlight-item{font-size:12px;color:var(--text-muted);line-height:1.5;display:flex;gap:8px;}
  .compare-highlight-item::before{content:'▸';color:var(--yellow);flex-shrink:0;}
  .yes{color:var(--ok);font-weight:600}
  .no{color:var(--bad);font-weight:600}

  .timeline-bar{
    padding:0 40px;
    overflow-x:auto;
    border-bottom:1px solid var(--border);
    background:var(--bg2);
    scrollbar-width:none;
    margin-top:20px;
  }
  .timeline-bar::-webkit-scrollbar{display:none}
  .timeline-inner{display:flex;min-width:max-content;padding:16px 0;position:relative;}
  .timeline-inner::before{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:linear-gradient(90deg, transparent, var(--border) 5%, var(--border) 95%, transparent);}
  .year-marker{display:flex;flex-direction:column;align-items:center;padding:0 20px;cursor:pointer;position:relative;transition:all .2s;}
  .year-dot{width:10px;height:10px;border-radius:50%;background:var(--bg3);border:2px solid var(--text-dim);margin-bottom:8px;transition:all .2s;position:relative;z-index:1;}
  .year-marker:hover .year-dot,.year-marker.active .year-dot{background:var(--yellow);border-color:var(--yellow);box-shadow:0 0 12px rgba(255,198,0,.5);}
  .year-label{font-family:'Space Mono',monospace;font-size:11px;color:var(--text-dim);transition:color .2s;}
  .year-marker:hover .year-label,.year-marker.active .year-label{color:var(--yellow)}
  .year-count{font-size:10px;color:var(--text-dim);margin-top:3px;}

  .main{padding:40px;max-width:1600px;margin:0 auto;}
  .section-header{display:flex;align-items:baseline;gap:16px;margin-bottom:28px;}
  .section-year{font-family:'Bebas Neue',sans-serif;font-size:48px;color:var(--yellow);line-height:1;}
  .section-divider{flex:1;height:1px;background:var(--border)}
  .section-count{font-family:'Space Mono',monospace;font-size:11px;color:var(--text-muted);}

  .drones-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;margin-bottom:60px;}
  .drones-list{display:flex;flex-direction:column;gap:10px;margin-bottom:60px;}

  .drone-card{
    background:var(--card);border:1px solid var(--border);border-radius:10px;
    padding:22px;padding-bottom:64px;cursor:pointer;
    transition:all .25s cubic-bezier(.4,0,.2,1);
    position:relative;overflow:hidden;
    animation:fadeIn .4s ease forwards;opacity:0;
  }
  .drone-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--series-color,var(--yellow));opacity:0;transition:opacity .25s;}
  .drone-card:hover{border-color:var(--border-hover);transform:translateY(-3px);box-shadow:0 12px 40px rgba(0,0,0,.4);}
  .drone-card:hover::before{opacity:1}
  .card-select-row{position:absolute;right:14px;bottom:14px;z-index:3;margin:0;}
  .select-box{display:inline-flex;align-items:center;gap:8px;font-size:11px;color:var(--text-muted);font-family:'Space Mono',monospace;background:rgba(8,10,14,.92);border:1px solid var(--border);border-radius:999px;padding:6px 10px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.25);}
  .select-box input{accent-color:var(--yellow);cursor:pointer;}
  .selected-drone{border-color:var(--yellow) !important;box-shadow:0 0 0 1px rgba(255,198,0,.35), 0 12px 40px rgba(0,0,0,.35);}
  .card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px;gap:8px;}
  .card-series{font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--series-color,var(--yellow));background:color-mix(in srgb, var(--series-color,var(--yellow)) 12%, transparent);padding:3px 10px;border-radius:3px;}
  .card-year{font-family:'Space Mono',monospace;font-size:11px;color:var(--text-dim);}
  .card-icon,.modal-icon{color:var(--series-color,var(--yellow))}
  .card-icon{width:180px;height:110px;margin:8px auto 12px;position:relative;overflow:hidden;border-radius:14px;background:var(--card);filter:drop-shadow(0 4px 12px rgba(255,198,0,.10));}
  .card-icon img,.list-icon img,.modal-icon img{
    width:100%;height:100%;object-fit:cover;display:block;
    -webkit-mask-image:linear-gradient(to right,transparent 0,#000 3px,#000 calc(100% - 3px),transparent 100%),linear-gradient(to bottom,transparent 0,#000 3px,#000 calc(100% - 3px),transparent 100%);
    -webkit-mask-composite:source-in;
    mask-image:linear-gradient(to right,transparent 0,#000 3px,#000 calc(100% - 3px),transparent 100%),linear-gradient(to bottom,transparent 0,#000 3px,#000 calc(100% - 3px),transparent 100%);
    mask-composite:intersect;
  }
  .card-name{font-size:17px;font-weight:600;color:#fff;margin-bottom:6px;line-height:1.2;}
  .card-desc{font-size:12px;color:var(--text-muted);line-height:1.6;margin-bottom:14px;}
  .card-specs{display:flex;flex-wrap:wrap;gap:6px;}
  .spec-tag{font-size:10px;padding:3px 9px;border-radius:3px;background:rgba(255,255,255,.04);color:var(--text-muted);border:1px solid rgba(255,255,255,.06);font-family:'Space Mono',monospace;}
  .spec-tag.sdk-yes{color:#9df5c7;border-color:rgba(0,212,170,.25);background:rgba(0,212,170,.08);}
  .spec-tag.sdk-no{color:#f0b1b1;border-color:rgba(255,68,68,.22);background:rgba(255,68,68,.08);}

  .drone-list-item{
    background:var(--card);border:1px solid var(--border);border-radius:8px;padding:16px 20px;
    display:grid;grid-template-columns:auto auto 1fr auto;gap:16px;align-items:center;
    cursor:pointer;transition:all .2s;animation:fadeIn .4s ease forwards;opacity:0;
    border-left:3px solid var(--series-color,var(--yellow));
  }
  .drone-list-item:hover{border-color:var(--border-hover);background:var(--bg3);}
  .list-icon{width:120px;height:74px;min-width:120px;position:relative;overflow:hidden;border-radius:10px;background:var(--card);color:var(--series-color,var(--yellow));}
  .list-info{flex:1}
  .list-name{font-size:15px;font-weight:600;color:#fff;margin-bottom:3px;}
  .list-desc{font-size:12px;color:var(--text-muted);line-height:1.4;}
  .list-meta{display:flex;flex-direction:column;align-items:flex-end;gap:6px;}
  .list-year-badge{font-family:'Space Mono',monospace;font-size:11px;color:var(--text-dim);white-space:nowrap;}

  .modal-overlay{
    position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:1000;
    display:flex;align-items:center;justify-content:center;padding:20px;
    opacity:0;pointer-events:none;transition:opacity .25s;backdrop-filter:blur(4px);
  }
  .modal-overlay.open{opacity:1;pointer-events:all}
  .modal{
    background:var(--bg2);border:1px solid rgba(255,198,0,.2);border-radius:14px;
    max-width:1080px;width:100%;max-height:85vh;overflow-y:auto;
    transform:scale(.94) translateY(20px);
    transition:transform .25s cubic-bezier(.4,0,.2,1);
    scrollbar-width:thin;scrollbar-color:var(--border) transparent;
  }
  .modal-overlay.open .modal{transform:scale(1) translateY(0)}
  .modal-header{padding:28px 28px 0;display:flex;justify-content:space-between;align-items:flex-start;}
  .modal-series-badge{font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;padding:4px 12px;border-radius:4px;}
  .modal-close{width:32px;height:32px;background:rgba(255,255,255,.06);border:none;border-radius:6px;color:var(--text-muted);font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;}
  .modal-close:hover{background:rgba(255,255,255,.1);color:#fff}
  .modal-body{padding:20px 28px 28px}
  .modal-icon{width:340px;height:200px;margin:16px auto;position:relative;overflow:hidden;border-radius:16px;background:var(--bg2);filter:drop-shadow(0 8px 24px rgba(255,198,0,.14));}
  .modal-name{font-family:'Bebas Neue',sans-serif;font-size:40px;color:#fff;letter-spacing:.03em;text-align:center;margin-bottom:6px;}
  .modal-year{text-align:center;font-family:'Space Mono',monospace;font-size:12px;color:var(--yellow);margin-bottom:20px;}
  .modal-desc{font-size:14px;color:var(--text-muted);line-height:1.7;margin-bottom:24px;text-align:center;}
  .modal-specs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px;}
  .modal-spec{background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:8px;padding:14px;}
  .modal-spec-label{font-size:10px;text-transform:uppercase;letter-spacing:.15em;color:var(--text-dim);margin-bottom:6px;}
  .modal-spec-value{font-size:14px;font-weight:600;color:#fff;}
  .modal-highlights{background:var(--yellow-dim);border:1px solid rgba(255,198,0,.15);border-radius:8px;padding:16px;}
  .modal-highlights-title{font-size:11px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--yellow);margin-bottom:12px;}
  .highlight-item{display:flex;gap:10px;font-size:13px;color:var(--text-muted);margin-bottom:8px;line-height:1.5;}
  .highlight-item::before{content:'▸';color:var(--yellow);flex-shrink:0;margin-top:1px;}

  .empty-state{text-align:center;padding:80px 20px;color:var(--text-dim);}
  .empty-icon{width:50px;height:50px;margin:0 auto 16px;color:var(--text-dim);}
  .empty-text{font-size:16px;margin-bottom:8px;color:var(--text-muted);}
  .empty-sub{font-size:13px}

  /* ── Precio de lanzamiento ── */
  .price-tag{
    display:inline-flex;align-items:center;gap:5px;
    font-family:'Space Mono',monospace;font-size:11px;font-weight:700;
    color:#00ffcc;background:rgba(0,255,204,0.08);
    border:1px solid rgba(0,255,204,0.22);
    border-radius:4px;padding:3px 9px;
    letter-spacing:.04em;
    white-space:nowrap;
  }
  .price-tag::before{content:'$';opacity:.7;font-size:9px;}
  .card-price{margin-bottom:10px;}
  .list-price{
    font-family:'Space Mono',monospace;font-size:11px;font-weight:700;
    color:#00ffcc;white-space:nowrap;
  }
  .modal-price-block{
    text-align:center;margin-bottom:18px;
  }
  .modal-price-label{
    font-size:10px;text-transform:uppercase;letter-spacing:.18em;
    color:var(--text-dim);margin-bottom:6px;
  }
  .modal-price-value{
    font-family:'Bebas Neue',sans-serif;font-size:32px;
    color:#00ffcc;letter-spacing:.04em;line-height:1;
    text-shadow:0 0 24px rgba(0,255,204,0.35);
  }

  /* ── Filtro de precio (rango dual) y orden ── */
  .price-filter-group{flex:1;min-width:260px;max-width:440px;}
  .price-range-row{display:flex;align-items:center;gap:12px;width:100%;}
  .price-range-vals{
    font-family:'Space Mono',monospace;font-size:10px;color:#00ffcc;
    white-space:nowrap;min-width:148px;text-align:right;
  }
  .dual-range{
    position:relative;flex:1;height:28px;
  }
  .dual-range-track{
    position:absolute;left:0;right:0;top:50%;
    height:4px;margin-top:-2px;border-radius:999px;
    background:var(--bg3);border:1px solid var(--border);pointer-events:none;
  }
  .dual-range-fill{
    position:absolute;top:0;bottom:0;border-radius:999px;
    background:linear-gradient(90deg,#00ffcc,var(--yellow));
  }
  .dual-range input[type=range]{
    position:absolute;left:0;top:0;width:100%;height:28px;margin:0;
    background:none;pointer-events:none;-webkit-appearance:none;appearance:none;
  }
  #priceMin{z-index:3}
  #priceMax{z-index:4}
  .dual-range input[type=range]::-webkit-slider-runnable-track{background:transparent;height:4px;}
  .dual-range input[type=range]::-moz-range-track{background:transparent;height:4px;border:none;}
  .dual-range input[type=range]::-webkit-slider-thumb{
    -webkit-appearance:none;appearance:none;pointer-events:all;
    width:16px;height:16px;border-radius:50%;
    background:var(--yellow);border:2px solid #080a0e;
    box-shadow:0 0 0 2px rgba(255,198,0,.35),0 0 10px rgba(255,198,0,.4);
    cursor:pointer;margin-top:-6px;
  }
  .dual-range input[type=range]::-moz-range-thumb{
    pointer-events:all;width:16px;height:16px;border-radius:50%;
    background:var(--yellow);border:2px solid #080a0e;
    box-shadow:0 0 0 2px rgba(255,198,0,.35);cursor:pointer;
  }
  .dual-range input[type=range]:focus{outline:none;}
  .dual-range input[type=range]:focus-visible::-webkit-slider-thumb{
    box-shadow:0 0 0 3px rgba(255,198,0,.55);
  }
  .rank-tag{
    font-size:10px;padding:3px 9px;border-radius:3px;
    background:rgba(255,198,0,.12);color:var(--yellow);
    border:1px solid rgba(255,198,0,.28);
    font-family:'Space Mono',monospace;
  }

  /* DJI original footer oculto — reemplazado por nubik-footer */
  footer.dji-footer{display:none}

  @keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
  @keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

  @media(max-width:900px){
    .drone-list-item{grid-template-columns:1fr;align-items:flex-start;}
    .list-meta{align-items:flex-start}
  }
  @media(max-width:780px){
    .controls{align-items:stretch}
    .view-toggle{margin-left:0}
  }
  @media(max-width:640px){
    .hero{padding:50px 20px 40px}
    .controls{padding:12px 20px;top:56px}
    .price-filter-group{max-width:none}
    .price-range-vals{min-width:0;font-size:9px}
    .main{padding:24px 20px}
    .compare-panel{padding:0 20px}
    .timeline-bar{padding:0 20px}
    .drones-grid{grid-template-columns:1fr}
    .modal-specs-grid{grid-template-columns:1fr}
  }