:root{
      --bg:#f4f7fb;
      --bg2:#eef2f8;
      --ink:#0e1b2b;
      --muted:#5b6b7e;
      --card:#ffffff;
      --line:#e3e8f1;
      --accent:#ff6a2a;
      --accent-2:#ff8a3d;
      --navy:#0b1f39;
      --navy-2:#0e2a4d;
      --header-blue:rgba(255,255,255,0.82);
      --header-border:rgba(11,31,57,0.08);
      --shadow: 0 18px 40px rgba(13, 32, 61, .10);
      --shadow-2: 0 12px 24px rgba(13, 32, 61, .12);
      --radius:20px;
      --radius-sm:14px;
    }

    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      padding-top:92px;
      font-family:"Sora","Trebuchet MS","Segoe UI",sans-serif;
      color:var(--ink);
      zoom:1.25;
      overflow-x:hidden;
      background:
        radial-gradient(900px 380px at 80% -10%, rgba(255,106,42,.10), transparent 60%),
        radial-gradient(720px 360px at 10% 10%, rgba(14,42,77,.10), transparent 60%),
        linear-gradient(180deg, #fff 0%, var(--bg) 55%, var(--bg2) 100%);
    }

    a{color:inherit;text-decoration:none}
    img{max-width:100%;display:block}
    button,input,select{font:inherit}
    .container{width:92vw; max-width:1140px; margin:0 auto}

    .loader{
      position:fixed;
      top:0;
      right:0;
      bottom:0;
      left:0;
      background:#ffffff;
      display:grid;
      place-items:center;
      z-index:999;
      transition:opacity .35s ease, visibility .35s ease;
    }
    .loader.is-hidden{
      opacity:0;
      visibility:hidden;
    }
    .loader-inner{
      display:flex;
      flex-direction:column;
      align-items:center;
      gap:12px;
    }
    .loader-logo{
      width:64px;
      height:64px;
      border-radius:18px;
      animation:pulse 1.6s ease-in-out infinite;
    }
    .loader-ring{
      width:46px;
      height:46px;
      border-radius:999px;
      border:3px solid rgba(36,62,98,.25);
      border-top-color:var(--accent);
      animation:spin 1s linear infinite;
    }
    @keyframes spin{
      to{transform:rotate(360deg)}
    }
    @keyframes pulse{
      0%,100%{transform:scale(1); opacity:1}
      50%{transform:scale(1.04); opacity:.85}
    }

    .header{
      position:fixed; top:0; left:0; right:0; z-index:60;
      background:var(--header-blue);
      backdrop-filter: blur(12px);
      border-bottom:1px solid var(--header-border);
      box-shadow:0 10px 22px rgba(11, 31, 57, .18);
    }
    .header-inner{
      display:flex; align-items:center; justify-content:space-between;
      gap:16px; padding:20px 0;
    }
    .brand{
      display:flex; align-items:center; gap:12px; min-width:210px;
    }
    .brand img{width:50px;height:50px;padding:4px;border-radius:14px;object-fit:contain;background:#fff}
    .brand b{display:block; font-size:18px; letter-spacing:.2px; color:var(--navy)}
    .brand span{display:block; font-size:11px; letter-spacing:.18em; color:#5a6c83; text-transform:uppercase}

    .nav{display:flex; gap:18px; font-weight:700; font-size:13px; color:var(--navy)}
    .nav a{padding:8px 10px; border-radius:12px}
    .nav a:hover{background:rgba(11,31,57,.08); color:var(--navy)}

    .actions{display:flex; gap:10px; align-items:center}
    .btn{
      border:0; cursor:pointer; font-weight:800;
      padding:10px 14px; border-radius:999px; display:inline-flex; align-items:center; gap:8px;
      transition:transform .08s ease, filter .2s ease;
    }
    .btn:active{transform:translateY(1px)}
    .btn-primary{background:var(--accent); color:#fff; box-shadow:0 14px 28px rgba(255,106,42,.26)}
    .btn-ghost{background:#eef3fb; color:var(--navy); border:1px solid #dfe6f3}
    .btn .btn-icon{display:inline-flex; align-items:center}
    .btn .btn-icon svg{width:16px; height:16px; display:block}

        .burger{display:none}
    @media (max-width: 1100px){
      body{zoom:1;}
      .nav{display:none !important}
      .burger{display:inline-flex !important; background:rgba(11,31,57,.08); color:var(--navy)}
      .header-inner{flex-wrap:wrap}
      .actions{margin-left:auto}
    }
    .drawer{display:none; border-top:1px solid var(--header-border); padding:10px 0 14px; background:rgba(255,255,255,.92); color:var(--navy)}
    .drawer.show{display:block}
    .drawer a{display:block; padding:10px 10px; border-radius:12px; font-weight:700; color:var(--navy)}
    .drawer a:hover{background:rgba(11,31,57,.08)}

    /* Hero */
    .hero{
      position:relative;
      min-height:100vh;
      padding:140px 0 80px;
      color:#ffffff;
      background:url("https://orinocogz.com/wp-content/uploads/2025/12/890d5e3fd2b3edcc6493d1e6dd1f981a.jpg") center/cover no-repeat;
      overflow:hidden;
      display:flex;
      align-items:center;
    }
    .hero::before{
      content:"";
      position:absolute;
      top:0;
      right:0;
      bottom:0;
      left:0;
      background:linear-gradient(90deg, rgba(6,20,40,.84) 0%, rgba(6,20,40,.64) 44%, rgba(6,20,40,.20) 76%, rgba(6,20,40,0) 100%);
    }
    .hero .container{position:relative; z-index:2}
    .hero-inner{
      max-width:700px;
      color:#ffffff;
    }
    .hero-pill{
      display:inline-flex; align-items:center; gap:8px; padding:7px 10px;
      border-radius:999px; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.25);
      font-size:12px; text-transform:uppercase; letter-spacing:.16em;
    }
    .hero h1{margin:14px 0 12px; font-size:clamp(32px, 4vw, 54px); line-height:1.05; letter-spacing:-.02em}
    .hero p{margin:0 0 20px; color:rgba(255,255,255,.85); font-size:15.5px}
    .hero-cta{display:flex; gap:12px; flex-wrap:wrap; margin-bottom:18px}
    .hero-cta .btn-ghost{background:rgba(255,255,255,.12); color:#fff; border:1px solid rgba(255,255,255,.30)}
    .stats{display:flex; gap:22px; flex-wrap:wrap}
    .stat{
      background:transparent;
      border:0;
      padding:0;
      min-width:0;
    }
    .stat b{display:block; font-size:30px; color:var(--accent)}
    .stat span{display:block; font-size:16px; color:var(--accent-2)}

    /* Sections */
    section{padding:38px 0}
    .section-title{margin:0 0 8px; font-size:28px; color:var(--navy)}
    .section-sub{margin:0 0 22px; color:var(--muted)}

    /* Experts */
    .experts{display:grid; grid-template-columns:1fr 1.1fr; gap:20px; align-items:stretch}
    .media-card{
      background:var(--card); border:1px solid var(--line); border-radius:24px; box-shadow:var(--shadow);
      overflow:hidden; position:relative; min-height:320px; height:100%;
    }
    .media-card .photo{
      position:absolute;
      top:0;
      right:0;
      bottom:0;
      left:0;
      background:url("https://orinocogz.com/wp-content/uploads/2025/12/alamcen.jpg") center/cover;
    }
    .media-card .badge{
      position:absolute; left:14px; bottom:14px; background:var(--navy); border-radius:14px;
      border:1px solid #ffffff; box-shadow:var(--shadow-2); padding:8px 12px; font-weight:800; font-size:12px; color:var(--accent);
    }
    .info-card{
      background:var(--card); border:1px solid var(--line); border-radius:24px; box-shadow:var(--shadow);
      padding:22px; height:100%;
    }
    .bullets{display:grid; gap:12px; margin-top:12px}
    .bullet{
      display:flex; gap:12px; align-items:flex-start; padding:12px; border-radius:16px;
      border:1px solid #edf1f8; background:#fbfcff;
    }
    .bullet .icon{
      width:36px; height:36px; border-radius:12px; background:#fff2ea; color:var(--accent);
      display:grid; place-items:center; font-weight:900; border:1px solid #ffe0cf;
    }
    .bullet strong{display:block; font-size:13px; color:var(--navy)}
    .bullet span{display:block; font-size:12.5px; color:var(--muted); margin-top:4px}

    /* Process */
    .steps{display:grid; grid-template-columns:repeat(4, 1fr); gap:14px}
    .step{
      background:var(--card); border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow-2);
      padding:16px; min-height:140px; position:relative;
    }
    .step .num{position:absolute; right:12px; top:10px; font-weight:900; color:#e9eef6; font-size:22px}
    .step .icon-badge{margin-bottom:10px}
    .step h4{margin:10px 0 6px; color:var(--navy); font-size:14px}
    .step p{margin:0; color:var(--muted); font-size:12.5px; line-height:1.45}

    /* Trust */
    .trust{display:grid; grid-template-columns:repeat(3, 1fr); gap:14px}
    .trust .card{
      background:var(--card); border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow-2);
      padding:16px; min-height:120px;
    }
    .trust .card .icon-badge{margin-bottom:10px}
    .trust .card h4{margin:0 0 6px; color:var(--navy); font-size:14px}
    .trust .card p{margin:0; color:var(--muted); font-size:12.5px; line-height:1.45}

    .icon-badge{
      width:38px; height:38px;
      border-radius:12px;
      background:var(--navy);
      border:2px solid var(--accent);
      color:#ffffff;
      display:grid;
      place-items:center;
      box-shadow:0 10px 18px rgba(11,31,57,.18);
    }
    .icon-badge svg{width:18px; height:18px; display:block}

    /* CTA band */
    .cta-band{
      background:linear-gradient(90deg, var(--navy), var(--navy-2));
      border-radius:22px; padding:22px; color:#fff; display:flex; align-items:center; justify-content:space-between;
      gap:14px; box-shadow:var(--shadow);
    }
    .cta-band p{margin:6px 0 0; color:rgba(255,255,255,.78)}

    /* Calculator */
    .calc{
      background:#eef2f6;
      border:1px solid #e3e8f1;
      border-radius:22px;
      box-shadow:var(--shadow);
      padding:20px;
    }
    .calc-layout{
      display:grid;
      grid-template-columns: 1.15fr .85fr;
      gap:16px;
      align-items:start;
    }
    .calc-tabs{display:flex; gap:10px; margin-bottom:14px}
    .calc-tab{
      flex:1;
      padding:12px 16px;
      border-radius:14px;
      border:1px solid #e6ebf3;
      background:#ffffff;
      font-weight:800;
      font-size:14px;
      color:#5a6c83;
      cursor:pointer;
      box-shadow:0 6px 14px rgba(13,32,61,.08);
      display:flex;
      align-items:center;
      justify-content:center;
      gap:8px;
    }
    .calc-tab.active{
      background:linear-gradient(90deg, var(--accent), var(--accent-2));
      border-color:transparent;
      color:#ffffff;
      box-shadow:0 10px 18px rgba(255,106,42,.22);
    }
    .calc-form{display:block}
    .calc-note-title{
      font-size:16px;
      font-weight:800;
      color:var(--navy);
      margin-bottom:12px;
    }
    .calc-form.is-maritimo .weight-field{display:none}
    .calc-form.is-maritimo .dim-field{grid-column:1 / -1}
    .calc-form.is-maritimo .air-cost-field{display:none}
    .calc-form:not(.is-maritimo) .cbm-field{display:none}
    .cbm-field{grid-column:1 / -1}
    .air-cost-field{grid-column:1 / -1}
    .grid-2{display:grid; grid-template-columns:1fr 1fr; gap:12px}
    .grid-3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px}
    .field label{display:block; font-size:12.5px; color:#607187; margin:0 0 6px}
    .field input,.field select{
      width:100%;
      padding:12px 14px;
      border-radius:12px;
      border:1px solid #e3e9f2;
      background:#ffffff;
      color:#1a2b42;
      outline:none;
      box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
    }
    .dim-row{display:grid; grid-template-columns:repeat(3, 1fr); gap:8px}
    .field input:focus,.field select:focus{border-color:#ffd6bf; box-shadow:0 0 0 4px rgba(255,106,42,.10)}
    .calc-actions{display:flex; justify-content:center; margin-top:16px}
    .calc-actions .btn{
      width:100%;
      justify-content:center;
      padding:14px 16px;
      border-radius:14px;
      font-size:15px;
    }
    .calc-result{
      opacity:0;
      transform:translateY(8px);
      pointer-events:none;
      transition:opacity .2s ease, transform .2s ease;
    }
    .calc-result.show{
      opacity:1;
      transform:translateY(0);
      pointer-events:auto;
    }
    .result-card{
      background:#ffffff;
      border:1px solid var(--line);
      border-radius:18px;
      box-shadow:var(--shadow-2);
      padding:18px;
    }
    .result-title{margin:0 0 12px; font-size:18px; color:var(--navy)}
    .result-row{
      display:flex; justify-content:space-between; align-items:center;
      padding:10px 0; border-bottom:1px solid #edf1f6; color:#5a6c83; font-size:13px;
    }
    .result-row strong{color:var(--navy)}
    .result-total{
      margin-top:12px;
      display:flex; align-items:center; justify-content:space-between;
      background:linear-gradient(90deg, #0b1f39, #0e2a4d);
      border-radius:14px;
      padding:14px 16px;
      color:#ffffff;
      font-weight:900;
    }
    .result-total span{color:#ff8a3d; font-size:20px}
    .result-time{
      margin-top:12px;
      border-radius:14px;
      background:#fff4ed;
      border:1px solid #ffe3d3;
      padding:12px;
      color:#9a4a2d;
      font-size:13px;
    }
    .result-time b{display:block; margin-top:6px; color:#0b1f39}
    .result-foot{margin-top:10px; font-size:11.5px; color:#8a98ab; text-align:center}

    /* Tracking */
    .track{
      background:var(--card); border:1px solid var(--line); border-radius:22px; box-shadow:var(--shadow);
      padding:18px; text-align:center;
    }
    .track-row{display:flex; gap:10px; margin-top:10px}
    .track-row input{flex:1}
    .calc-note{text-align:center; color:#6a7c91; font-size:12.5px; margin-top:10px}

    /* FAQ */
    .faq{
      display:grid; grid-template-columns:1fr 1.2fr; gap:18px; align-items:start;
    }
    .faq-left{
      background:var(--card); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow);
      padding:18px;
    }
    .faq-left p{color:var(--muted); font-size:13px; line-height:1.6}
    .faq-right{display:grid; gap:12px}
    .faq-item{
      background:var(--card);
      border:1px solid var(--line);
      border-radius:16px;
      box-shadow:var(--shadow-2);
      overflow:hidden;
    }
    .faq-question{
      width:100%;
      text-align:left;
      background:transparent;
      border:0;
      padding:14px 16px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      font-weight:800;
      color:var(--navy);
      cursor:pointer;
    }
    .faq-toggle{
      width:28px; height:28px;
      border-radius:999px;
      background:#ffe9df;
      color:var(--accent);
      display:grid;
      place-items:center;
      transition:transform .2s ease;
      flex:0 0 auto;
    }
    .faq-item.open .faq-toggle{transform:rotate(180deg)}
    .faq-answer{
      max-height:0;
      overflow:hidden;
      padding:0 16px;
      color:var(--muted);
      font-size:12.5px;
      line-height:1.5;
      transition:max-height .25s ease;
    }
    .faq-item.open .faq-answer{padding-bottom:14px}
    .btn-outline-accent{
      background:transparent;
      color:var(--accent);
      border:1px solid rgba(255,106,42,.4);
    }

    /* Final CTA */
    .final{
      background:linear-gradient(180deg, #0b1f39, #0e2a4d);
      color:#ffffff;
      padding:60px 0 54px;
    }
    .final-cta{
      text-align:center;
      max-width:760px;
      margin:0 auto 34px;
    }
    .final-cta h2{margin:0 0 10px; font-size:30px}
    .final-cta p{margin:0 0 18px; color:rgba(255,255,255,.78)}
    .final-actions{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}
    .btn-outline{
      background:#ffffff;
      color:#0b1f39;
      border:1px solid rgba(255,255,255,.65);
      box-shadow:0 10px 20px rgba(11,31,57,.18);
    }
    .contact-grid{
      display:grid;
      grid-template-columns:repeat(4, 1fr);
      gap:18px;
      text-align:center;
    }
    .contact-card h4{margin:8px 0 6px; color:#ffffff; font-size:14px}
    .contact-card p{margin:0; color:rgba(255,255,255,.78); font-size:12px; line-height:1.5}
    .contact-icon{
      width:46px; height:46px;
      border-radius:14px;
      background:var(--accent);
      display:grid;
      place-items:center;
      margin:0 auto;
      box-shadow:0 12px 20px rgba(255,106,42,.24);
    }

    /* Footer */
    .orange-footer{
      background:#ff6a2a;
      color:#ffffff;
      padding:42px 0 24px;
    }
    .footer-columns{
      display:grid;
      grid-template-columns:1.2fr 1fr 1fr 1.2fr;
      gap:18px;
      align-items:start;
    }
    .footer-brand p{color:rgba(255,255,255,.88); font-size:12.5px; line-height:1.6}
    .footer-list b{display:block; margin-bottom:8px}
    .footer-list a{display:block; color:rgba(255,255,255,.9); font-size:12.5px; margin:6px 0}
    .footer-social{display:flex; gap:8px; margin-top:12px}
    .footer-social a{
      width:30px; height:30px; border-radius:999px;
      background:rgba(255,255,255,.2);
      display:grid; place-items:center;
    }
    .footer-input{display:grid; gap:10px; margin-top:10px}
    .footer-input input{
      border:1px solid rgba(255,255,255,.4);
      border-radius:12px;
      padding:10px 12px;
      background:rgba(255,255,255,.18);
      color:#ffffff;
    }
    .footer-input button{
      border:0;
      border-radius:12px;
      padding:10px 12px;
      background:#0b1f39;
      color:#ffffff;
      font-weight:800;
      cursor:pointer;
    }
    .footer-bottom{
      margin-top:24px;
      padding-top:14px;
      border-top:1px solid rgba(255,255,255,.35);
      display:flex;
      justify-content:space-between;
      gap:12px;
      flex-wrap:wrap;
      font-size:12px;
      color:rgba(255,255,255,.9);
    }
    .footer-links a{margin-right:14px; color:rgba(255,255,255,.9)}

    /* Floating */
    .float{
      position:fixed;
      right:18px;
      bottom:24px;
      z-index:70;
      display:flex;
      flex-direction:column;
      gap:10px;
    }
    .float a,.float button{
      width:48px; height:48px;
      border-radius:14px;
      border:1px solid rgba(255,255,255,.22);
      background:rgba(11,31,57,.9);
      color:#ffffff;
      display:grid;
      place-items:center;
      box-shadow:0 12px 26px rgba(11,31,57,.22);
      cursor:pointer;
    }
    .float a.wa{background:#25d366; border-color:#25d366}
    .float a.ig{background:#ff6a2a; border-color:#ff6a2a}

    /* Animations */
    .reveal{opacity:0; transform:translateY(10px); animation:rise .7s ease forwards}
    .delay-1{animation-delay:.08s}
    .delay-2{animation-delay:.16s}
    .delay-3{animation-delay:.24s}
    @keyframes rise{to{opacity:1; transform:translateY(0)}}

    /* Responsive */
    @media (max-width: 980px){
      .experts{grid-template-columns:1fr}
      .steps{grid-template-columns:1fr 1fr}
      .trust{grid-template-columns:1fr}
      .cta-band{flex-direction:column; align-items:flex-start}
      .contact-grid{grid-template-columns:1fr 1fr}
      .footer-columns{grid-template-columns:1fr 1fr}
      .calc-layout{grid-template-columns:1fr}
    }
    @media (max-width: 640px){
      .hero{padding:110px 0 50px}
      .steps{grid-template-columns:1fr}
      .grid-2,.grid-3,.dim-row{grid-template-columns:1fr}
      .track-row{flex-direction:column}
      .faq{grid-template-columns:1fr}
      .contact-grid{grid-template-columns:1fr}
      .footer-columns{grid-template-columns:1fr}
    }
/* Hover naranja en cards de proceso */
.step{
  transition: background-color .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.step:hover{
  background: rgba(255,106,42,.12);
  border-color: rgba(255,106,42,.35);
  box-shadow: 0 18px 36px rgba(255,106,42,.20);
}

/* Hover naranja en cards de confianza */
.trust .card{
  transition: background-color .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.trust .card:hover{
  background: rgba(255,106,42,.12);
  border-color: rgba(255,106,42,.35);
  box-shadow: 0 18px 36px rgba(255,106,42,.20);
}
/* Centrar tarjetas en la sección de modalidades de envío */
#modalidades-envio .trust {
  display: flex;
  justify-content: center;
  gap: 24px;
  flex-wrap: wrap;
}

/* Ajuste de ancho para que no se estiren demasiado */
#modalidades-envio .card {
  max-width: 420px;
  width: 100%;
}

/* Mobile */
@media (max-width: 768px) {
  #modalidades-envio .trust {
    gap: 16px;
  }

  #modalidades-envio .card {
    max-width: 100%;
  }
}
/* Tracking */
.rastreo-section{padding:46px 0 34px} /* Espaciado vertical de la sección */

.track-panel{
  position:relative;
  max-width:900px;
  margin:0 auto;
  /* Fondo azul degradado del panel */
  background:linear-gradient(135deg, rgba(11,31,57,.86), rgba(14,42,77,.74));
  /* Borde blanco suave para separar del fondo */
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;
  /* Sombra general azul oscura del panel */
  box-shadow:0 18px 40px rgba(11,31,57,.35);
  padding:22px;
  color:#f2f5fb;

  overflow:hidden; /* Recorta decoraciones internas (important para ::before) */
  text-align:center;
}


.track-panel .track-head{display:flex; flex-direction:column; gap:4px; align-items:center}
.track-panel .track-title{margin:0; color:#fff; font-size:20px; letter-spacing:-.01em} /* Título blanco */
.track-panel .track-hint{margin:0; color:rgba(255,255,255,.72); font-size:13px} /* Subtítulo blanco suave */

.track-panel .field{margin:0; text-align:left}
.track-panel .field label{color:rgba(255,255,255,.78); font-weight:700} /* Label claro */
.track-panel .field input{
  /* Fondo del input semitransparente */
  background:rgba(255,255,255,.14);
  /* Borde blanco suave */
  border:1px solid rgba(255,255,255,.28);
  color:#ffffff;
  border-radius:16px;
  padding:13px 14px;
  /* Sombra interna sutil (efecto “glass”) */
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
}
.track-panel .field input::placeholder{color:rgba(255,255,255,.78)} /* Placeholder visible */

/* Botón principal */
.track-panel .btn-primary{
  align-self:stretch;
  padding:14px 22px;
  border-radius:999px;
  /* Halo naranja del botón (si lo quieres quitar, pon box-shadow:none) */
  box-shadow:none !important;
  /* Degradado naranja */
  background:linear-gradient(90deg, var(--accent), var(--accent-2));
  color:#ffffff;
  min-width:150px;
}
/* Si también quieres eliminar halo del botón, descomenta: */
 .track-panel .btn-primary{ box-shadow:none; } 

.track-panel .btn-primary:hover{filter:brightness(1.04)} /* Hover: más brillo */
.track-panel .btn-primary:active{transform:translateY(1px)} /* Click: efecto presión */

.track-meta{margin-top:12px}
.track-panel .calc-note{color:rgba(255,255,255,.78); font-size:12.5px; margin:0} /* Texto informativo */

.track-status{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
  margin:14px 0 8px;

  /* ✅ FIX: evita que sombras de chips “se monten” sobre inputs/tarjetas */
  overflow:hidden;
  position:relative;
  border-radius:16px; /* recorte suave */
}

.status-chip{
  padding:9px 14px;
  border-radius:999px;
  /* Fondo base del chip (apagado) */
  background:rgba(255,255,255,.10);
  /* Borde base del chip */
  border:1px solid rgba(255,255,255,.20);
  color:#f4f7fb;
  font-weight:800;
  font-size:12.5px;
  letter-spacing:.05em;
}

.track-help{
  display:flex;
  justify-content:center;
  gap:6px;
  color:rgba(255,255,255,.78);
  font-size:12.5px;
  margin-top:6px;
}
.track-link{color:#ffffff; font-weight:800} /* Link destacado */

@media (max-width: 640px){
  .track-row{grid-template-columns:1fr; align-items:stretch} /* Layout 1 columna en móvil */
  .track-panel .btn-primary{width:100%; justify-content:center} /* Botón full width */
}

/* Ajuste ancho botón Rastrear (refuerzo) */
.track-panel .btn-primary{
  min-width:80px;
  padding:12px 18px;
}

/* Meta de fecha dentro del chip */
.status-chip .chip-meta{
  display:block;
  font-weight:600;
  font-size:11px;
  opacity:.8;
}

/* Chips activos - DONE (confirmado) */
.status-chip.done{
  /* Fondo naranja suave */
  background:rgba(255,106,42,.18);
  /* Borde naranja */
  border-color:rgba(255,106,42,.35);
  color:#fff;

  /* ✅ QUITADO: el halo naranja que se salía y se montaba encima */
  box-shadow:none;
}
.status-chip.done .chip-meta{color:rgba(255,255,255,.9)} /* Meta clara */

/* Chips activos - PLANNED (previsto) */
.status-chip.planned{
  /* Fondo naranja más suave */
  background:rgba(255,106,42,.12);
  /* Borde naranja más suave */
  border-color:rgba(255,106,42,.28);
  color:#fff;

  /* ✅ QUITADO: el halo naranja */
  box-shadow:none;
}

/* Caja de resultados */
.track-result{
  margin-top:16px;
  /* Fondo “glass” suave */
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);
  border-radius:16px;
  padding:16px;
  text-align:left;
  color:#f7f9fc;
}

/* Resumen arriba (estado + meta) */
.track-summary{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  justify-content:space-between;
}

/* Badge principal de estado */
.track-status-badge{
  background:rgba(255,255,255,.12);
  padding:10px 12px;
  border-radius:12px;
  font-weight:800;
  color:#fff;
}

/* Meta (ETA / actualizado) */
.track-meta{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  color:rgba(255,255,255,.86);
  font-size:12.5px;
}

/* Tarjetas de pasos */
.track-steps{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:10px;
  margin-top:12px;
}
.track-step{
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.08);
}
.track-step-title{font-weight:800; color:#fff; margin-bottom:4px}
.track-step-meta{color:rgba(255,255,255,.82); font-size:12.5px}
.track-step-date{color:rgba(255,255,255,.7); font-size:12px; margin-top:4px}

/* Paso confirmado: fondo/borde naranja (sin glow) */
.track-step.is-done{
  border-color:rgba(255,106,42,.45);
  background:rgba(255,106,42,.16);
}
.track-step.is-planned{border-color:rgba(255,255,255,.28)} /* Paso previsto: borde suave */