/* ═══ BUSCADOR DE ACEITE IPONE (compartido home + secciones) ═══ */
.oilf-modal { position:fixed; inset:0; z-index:1000; display:none; align-items:center; justify-content:center; padding:24px; font-family:'Inter',sans-serif; }
.oilf-modal.open { display:flex; }
.oilf-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.85); backdrop-filter:blur(5px); opacity:0; transition:opacity .3s; }
.oilf-modal.open .oilf-backdrop { opacity:1; }
.oilf-panel {
  position:relative; z-index:1; width:100%; max-width:760px; max-height:92vh; overflow-y:auto;
  background:#0d0d0d; border:1px solid rgba(255,255,255,.08); border-radius:14px;
  box-shadow:0 40px 120px rgba(0,0,0,.6);
  transform:translateY(24px) scale(.98); opacity:0;
  transition:transform .35s cubic-bezier(.16,1,.3,1), opacity .35s;
}
.oilf-modal.open .oilf-panel { transform:translateY(0) scale(1); opacity:1; }
.oilf-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:30px 34px 0; }
.oilf-eyebrow { font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:#E8001C; margin-bottom:8px; }
.oilf-title { font-family:'Bebas Neue',sans-serif; font-size:38px; line-height:.92; color:#fff; letter-spacing:.01em; }
.oilf-close { flex-shrink:0; width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,.2); background:transparent; color:#fff; font-size:22px; line-height:1; cursor:pointer; transition:background .2s, border-color .2s; }
.oilf-close:hover { background:#E8001C; border-color:#E8001C; }
.oilf-body { padding:26px 34px 34px; }
.oilf-step { animation:oilffade .32s ease; }
@keyframes oilffade { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
.oilf-prog { display:flex; gap:6px; margin-bottom:20px; }
.oilf-prog span { height:3px; flex:1; border-radius:2px; background:rgba(255,255,255,.14); transition:background .35s ease; }
.oilf-prog span.on { background:#E8001C; }
.oilf-steplabel { font-size:13px; color:rgba(255,255,255,.5); letter-spacing:.04em; margin-bottom:18px; }
.oilf-steplabel b { color:#fff; font-weight:600; }
.oilf-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.oilf-opt {
  background:#161616; border:1px solid rgba(255,255,255,.09); border-radius:10px;
  padding:22px 16px; text-align:center; cursor:pointer; color:#fff;
  transition:background .2s, border-color .2s, transform .15s; font-family:inherit;
}
.oilf-opt:hover { background:#1e1e1e; border-color:#E8001C; transform:translateY(-2px); }
.oilf-opt-ico { font-size:30px; line-height:1; margin-bottom:10px; display:block; color:#fff; transition:color .2s, transform .2s; }
.oilf-opt:hover .oilf-opt-ico { color:#E8001C; transform:scale(1.08); }
.oilf-opt-t { display:block; font-size:13px; font-weight:700; letter-spacing:.02em; }
.oilf-opt-s { display:block; font-size:11px; color:rgba(255,255,255,.45); margin-top:4px; }
.oilf-back { background:none; border:none; color:rgba(255,255,255,.55); font-size:13px; cursor:pointer; padding:0; margin-bottom:16px; font-family:inherit; transition:color .2s; }
.oilf-back:hover { color:#fff; }
.oilf-result { display:flex; gap:28px; align-items:center; }
.oilf-rimg { flex:0 0 150px; height:210px; display:flex; align-items:center; justify-content:center; background:radial-gradient(120px 120px at 50% 46%, rgba(255,255,255,.08), transparent 72%); }
.oilf-rimg img { max-height:205px; max-width:140px; width:auto; object-fit:contain; filter:drop-shadow(0 14px 26px rgba(0,0,0,.55)); }
.oilf-rinfo { flex:1; min-width:0; }
.oilf-badge { display:inline-block; font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; padding:5px 12px; border-radius:3px; margin-bottom:16px; }
.oilf-badge.racing   { background:#141414; color:#fff; border:1px solid rgba(255,255,255,.35); }
.oilf-badge.sport    { background:#1B3F7A; color:#fff; }
.oilf-badge.advanced { background:#1A5C2A; color:#fff; }
.oilf-badge.essential{ background:#C05C00; color:#fff; }
.oilf-badge.standard { background:#B8960A; color:#fff; }
.oilf-rname { font-family:'Bebas Neue',sans-serif; font-size:40px; line-height:.92; color:#fff; margin-bottom:6px; }
.oilf-rvisc { font-size:14px; color:#E8001C; font-weight:700; letter-spacing:.06em; margin-bottom:16px; }
.oilf-rwhy { font-size:14px; color:rgba(255,255,255,.6); line-height:1.6; margin-bottom:26px; max-width:520px; }
.oilf-ractions { display:flex; gap:12px; flex-wrap:wrap; }
.oilf-btn { display:inline-flex; align-items:center; gap:8px; padding:13px 24px; border-radius:4px; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; text-decoration:none; cursor:pointer; border:none; font-family:inherit; transition:background .2s, transform .15s; }
.oilf-btn.primary { background:#E8001C; color:#fff; }
.oilf-btn.primary:hover { background:#c40018; transform:translateY(-2px); }
.oilf-btn.ghost { background:transparent; color:#fff; border:1px solid rgba(255,255,255,.25); }
.oilf-btn.ghost:hover { border-color:#fff; }
.oilf-foot { margin-top:26px; padding-top:18px; border-top:1px solid rgba(255,255,255,.08); }
.oilf-official { font-size:12px; color:rgba(255,255,255,.42); text-decoration:none; letter-spacing:.03em; transition:color .2s; }
.oilf-official:hover { color:#fff; }
.oilf-official b { color:rgba(255,255,255,.7); font-weight:600; }
body.oilf-lock { overflow:hidden; }
@media (max-width:560px) {
  .oilf-modal { padding:0; }
  .oilf-panel { max-width:none; height:100vh; max-height:100vh; border-radius:0; }
  .oilf-grid { grid-template-columns:repeat(2,1fr); }
  .oilf-title { font-size:32px; }
  .oilf-rname { font-size:36px; }
  .oilf-result { flex-direction:column; align-items:flex-start; gap:18px; }
  .oilf-rimg { flex:none; width:100%; height:180px; }
}

/* ═══ MEJORAS GLOBALES (scroll suave, transiciones, volver arriba, microinteracciones) ═══ */
html { scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
@keyframes ip-pagefade { from { opacity:0; } to { opacity:1; } }
body { animation:ip-pagefade .5s ease both; }

/* Botón volver arriba */
.to-top {
  position:fixed; right:22px; bottom:22px; z-index:900;
  width:46px; height:46px; border-radius:50%;
  border:1px solid rgba(255,255,255,.18); background:rgba(18,18,18,.85); backdrop-filter:blur(8px);
  color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center;
  opacity:0; transform:translateY(12px); pointer-events:none;
  transition:opacity .3s, transform .3s, background .2s, border-color .2s;
}
.to-top.show { opacity:1; transform:none; pointer-events:auto; }
.to-top:hover { background:#E8001C; border-color:#E8001C; transform:translateY(-3px); }
.to-top:active { transform:translateY(0) scale(.94); }
.to-top svg { width:20px; height:20px; stroke:currentColor; stroke-width:2; fill:none; stroke-linecap:round; stroke-linejoin:round; }

/* Microinteracciones: "press" al hacer clic en botones/CTA */
.nav-cta:active, .btn-red:active, .btn-ghost:active, .btn-outline-b:active, .btn-outline-w:active,
.pcard-buy:active, .ig-btn:active, .banner-cta:active, .oilf-btn:active, .gama-chip:active {
  transform:translateY(1px) scale(.98);
}
