/*
Theme Name: Onrent
Theme URI: https://onrent.es
Author: onrent
Author URI: https://onrent.es
Description: Theme oficial de onrent® — Alquiler y renting flexible. Diseño 100% editable desde Gutenberg. Los estilos y estructura viven en el theme, el contenido en las páginas. Ideal para equipos de Marketing sin conocimientos técnicos.
Version: 4.1.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: Proprietary
Text Domain: onrent
Tags: full-width-template, custom-colors, custom-menu, editor-style, block-patterns
*/

@import url('https://fonts.googleapis.com/css2?family=Baloo+Tammudu+2:wght@500;600;700;800&family=Inter:wght@300;400;500;600;700;800&display=swap');

/* =============================================================================
 * VARIABLES DE MARCA (brandbook onrent)
 * ========================================================================== */
:root{
  --green:#36ad2d; --green-dark:#2a8a24; --lime:#c2d500; --emerald:#00827a;
  --black:#1e2722; --gray:#9cacac; --gray-100:#f6f8f7; --gray-200:#eceeed;
  --gray-300:#d9dcdb; --gray-500:#6b7573; --white:#ffffff;
  --grad:linear-gradient(90deg,#36ad2d 0%,#c2d500 100%);
  --radius-sm:8px; --radius:14px; --radius-lg:22px; --radius-xl:28px;
  --shadow-1:0 1px 2px rgba(30,39,34,.04),0 1px 3px rgba(30,39,34,.06);
  --shadow-2:0 4px 16px rgba(30,39,34,.08);
  --shadow-3:0 20px 48px -12px rgba(30,39,34,.18);
  --ease:cubic-bezier(.2,.7,.2,1);
  --font-display:'Baloo Tammudu 2','Verdana',system-ui,sans-serif;
  --font-body:'Inter','Aptos','Verdana',system-ui,sans-serif;
  --pad-x:clamp(20px,4vw,64px);

  /* v4.1: logo dimensiones exactas 188x46 px */
  --logo-w:188px;
  --logo-h:46px;
  --nav-height:96px;   /* ajustado al nuevo logo con respiración */
}

/* Reset base */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0;overflow-x:hidden}
body{font-family:var(--font-body);color:var(--black);background:var(--white);line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}

h1,h2,h3,h4{font-family:var(--font-display);color:var(--black);letter-spacing:-.01em;line-height:1.15;margin:0 0 .5em;font-weight:700}
h1{font-size:clamp(2.2rem,4vw,3.6rem)}
h2{font-size:clamp(1.6rem,2.6vw,2.4rem)}
h3{font-size:1.2rem}
p{margin:0 0 1em;color:var(--gray-500)}

body.admin-bar .site-header{top:32px}
@media (max-width:782px){body.admin-bar .site-header{top:46px}}

/* =============================================================================
 * HEADER · v4.1 con logo 188x46 y menú más grande
 * ========================================================================== */
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--gray-200)}
.nav-inner{display:flex;align-items:center;gap:28px;height:var(--nav-height);padding:0 var(--pad-x)}

/* Logo · dimensiones exactas 188x46 */
.site-logo{
  display:flex;align-items:center;flex-shrink:0;line-height:0;
}
.site-logo .custom-logo,
.site-logo img.site-logo-img,
.site-logo .custom-logo-link img{
  width:var(--logo-w) !important;
  height:var(--logo-h) !important;
  max-width:var(--logo-w) !important;
  max-height:var(--logo-h) !important;
  object-fit:contain;
  display:block;
}
/* Fallback texto si no hay logo */
.site-logo .site-logo-text{
  font-family:var(--font-display);font-size:2.4rem;font-weight:800;
  color:var(--green);letter-spacing:-.02em;line-height:1;
  display:flex;align-items:baseline;gap:2px;
}
.site-logo .site-logo-text sup{font-size:.4em;color:var(--green);font-weight:600}

/* Menú · v4.1: fuente más grande (1.02rem antes era .95rem) */
.primary-menu{list-style:none;display:flex;gap:4px;margin:0;padding:0;flex:1}
.primary-menu a{
  padding:11px 18px;
  border-radius:999px;
  font-weight:500;
  color:var(--black);
  transition:all .2s var(--ease);
  font-size:1.02rem;    /* v4.1: incrementado */
  position:relative;
  white-space:nowrap;
}
.primary-menu a:hover{background:var(--gray-100)}
.primary-menu .current-menu-item > a,.primary-menu a.active{background:var(--black);color:var(--white)}
.primary-menu .current-menu-item > a::before,.primary-menu a.active::before{
  content:"";position:absolute;left:18px;bottom:-2px;
  width:calc(100% - 36px);height:2px;background:var(--grad);border-radius:2px;
}

/* Antes .primary-menu vivía dentro de .nav-inner (fila horizontal en
   desktop) sin sacarlo del flujo normal -- al pasar a columna en móvil,
   empujaba el resto de la cabecera hacia abajo y se solapaba con ella
   en vez de abrirse como un desplegable real. Con position:absolute
   queda fuera del flujo, anclado debajo de la cabecera (top:100%,
   relativo a .site-header, que ya es position:sticky). El JS de main.js
   (línea 45: menu.classList.toggle('is-open')) solo alterna la clase
   .is-open -- todo el estilo de mostrar/ocultar vive aquí, para no tener
   dos sitios (JS y CSS) compitiendo por lo mismo. Además, el padding y el
   line-height de cada enlace se ampliaron -- antes se veían demasiado
   apretados y sin separación clara entre ellos. */
@media (max-width: 768px) {
  .primary-menu {
    display: none;
  }

  .primary-menu.is-open {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    align-items: stretch !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--white) !important;
    border-bottom: 1px solid var(--gray-200) !important;
    box-shadow: var(--shadow-2) !important;
    padding: 12px var(--pad-x) 16px !important;
    margin: 0 !important;
  }

  .primary-menu li {
    margin: 0 !important;
    display: block !important;
    width: 100% !important;
  }

  .primary-menu a {
    display: block !important;
    line-height: 1.3 !important;
    padding: 12px 14px !important;
    border-radius: 10px !important;
  }

  .primary-menu .current-menu-item > a::before,
  .primary-menu a.active::before {
    display: none !important;
  }
}
.nav-cta{display:flex;gap:12px;align-items:center;flex-shrink:0}
.nav-phone{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--black);font-size:.95rem;white-space:nowrap;flex-shrink:0}
.nav-phone .nav-phone-icon{width:18px;height:18px;color:var(--green);flex-shrink:0}
.nav-phone *{white-space:nowrap}

.menu-toggle{display:none;border:none;background:transparent;padding:8px;cursor:pointer}
.menu-toggle svg{width:26px;height:26px}

/* =============================================================================
 * FOOTER · logo 188x46 también
 * ========================================================================== */
.site-footer{background:var(--gray-100);padding:80px var(--pad-x) 24px;border-top:1px solid var(--gray-200);position:relative}
.site-footer::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad)}
.foot-inner{max-width:1600px;margin:0 auto}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:40px;margin-bottom:56px}

.foot-brand .site-logo{margin-bottom:12px}
.foot-brand .site-logo .custom-logo,
.foot-brand .site-logo img.site-logo-img,
.foot-brand .site-logo .custom-logo-link img{
  width:var(--logo-w) !important;
  height:var(--logo-h) !important;
  max-width:var(--logo-w) !important;
  max-height:var(--logo-h) !important;
}
.foot-brand p{font-size:.9rem;max-width:280px;margin-top:12px}

.foot-col h4{font-family:var(--font-body);font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:16px;color:var(--black)}
.foot-col ul{list-style:none;padding:0;margin:0}
.foot-col ul li{margin-bottom:10px}
.foot-col ul a{font-size:.9rem;color:var(--gray-500);transition:color .2s}
.foot-col ul a:hover{color:var(--green-dark)}
.foot-bottom{border-top:1px solid var(--gray-300);padding-top:24px;display:flex;justify-content:space-between;align-items:center;font-size:.82rem;color:var(--gray-500);flex-wrap:wrap;gap:12px}
.foot-bottom .grad-line{height:3px;background:var(--grad);border-radius:2px;flex:1;margin:0 24px}

/* =============================================================================
 * BOTONES · Estilos aplicados a Gutenberg wp:button
 * ========================================================================== */
.wp-block-buttons{gap:12px !important;flex-wrap:wrap;margin:0 0 1em}
.wp-block-button__link,
.wp-element-button{
  display:inline-flex !important;align-items:center;justify-content:center;gap:8px;
  padding:12px 22px;border-radius:999px !important;
  font-family:var(--font-body);font-weight:600;font-size:.95rem;
  border:1px solid transparent;cursor:pointer;
  transition:all .2s var(--ease);white-space:nowrap;text-decoration:none;line-height:1.2;
}

.wp-block-button.is-style-onr-primary .wp-block-button__link{background:var(--black);color:var(--white);border-color:var(--black)}
.wp-block-button.is-style-onr-primary .wp-block-button__link:hover{background:#000;transform:translateY(-1px);box-shadow:var(--shadow-2)}

.wp-block-button.is-style-onr-green .wp-block-button__link{background:var(--green);color:var(--white);border-color:var(--green);box-shadow:0 6px 16px rgba(54,173,45,.25)}
.wp-block-button.is-style-onr-green .wp-block-button__link:hover{background:var(--green-dark);border-color:var(--green-dark);transform:translateY(-1px);box-shadow:0 12px 32px -12px rgba(54,173,45,.35)}

.wp-block-button.is-style-onr-ghost .wp-block-button__link{background:transparent;color:var(--black);border-color:var(--gray-300)}
.wp-block-button.is-style-onr-ghost .wp-block-button__link:hover{background:var(--gray-100);border-color:var(--gray-500)}

.wp-block-button.is-style-onr-ghost-dark .wp-block-button__link{background:transparent;color:var(--white);border-color:rgba(255,255,255,.25)}
.wp-block-button.is-style-onr-ghost-dark .wp-block-button__link:hover{background:rgba(255,255,255,.08)}

.wp-block-button.is-style-onr-lg .wp-block-button__link{padding:16px 30px;font-size:1rem}

/* =============================================================================
 * HERO SECTIONS
 * ========================================================================== */
.wp-block-group.onr-hero{
  position:relative;padding:80px var(--pad-x) 48px;
  background:
    radial-gradient(60vw 60vh at 85% -10%,rgba(194,213,0,.22),transparent 60%),
    radial-gradient(50vw 50vh at -10% 110%,rgba(54,173,45,.15),transparent 60%),
    var(--white);
  overflow:hidden;
}
.wp-block-group.onr-hero > .wp-block-columns{max-width:1600px;margin:0 auto;gap:64px !important;align-items:center}
.wp-block-group.onr-hero > *{position:relative;z-index:1}

.wp-block-group.onr-hero-dark{
  position:relative;padding:120px var(--pad-x);
  background:var(--black);color:var(--white);overflow:hidden;
}
.wp-block-group.onr-hero-dark::before{
  content:"";position:absolute;inset:auto -200px -300px auto;
  width:700px;height:700px;border-radius:50%;
  background:var(--grad);filter:blur(120px);opacity:.4;
}
.wp-block-group.onr-hero-dark > *{position:relative;z-index:1;max-width:1600px;margin-left:auto;margin-right:auto}
.wp-block-group.onr-hero-dark h1{color:var(--white);max-width:900px}
.wp-block-group.onr-hero-dark p{color:rgba(255,255,255,.75);max-width:700px}

/* Eyebrow */
.wp-block-paragraph.onr-eyebrow,p.onr-eyebrow{
  display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;
  background:var(--gray-100);color:var(--black);
  font-size:.82rem;font-weight:600;margin-bottom:18px;
  border:1px solid var(--gray-200);
}
p.onr-eyebrow::before{
  content:"";width:8px;height:8px;background:var(--green);border-radius:50%;
  box-shadow:0 0 0 5px rgba(54,173,45,.18);display:inline-block;
  animation:onr-pulse 2s ease-in-out infinite;
}
@keyframes onr-pulse{
  0%,100%{box-shadow:0 0 0 5px rgba(54,173,45,.18)}
  50%{box-shadow:0 0 0 8px rgba(54,173,45,.05)}
}
.wp-block-group.onr-hero-dark .onr-eyebrow{background:rgba(255,255,255,.1);color:var(--lime);border-color:rgba(255,255,255,.15)}

p.onr-eyebrow-green,.wp-block-paragraph.onr-eyebrow-green{
  display:inline-block;padding:6px 14px;border-radius:999px;
  background:rgba(54,173,45,.12);color:var(--green-dark);
  font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  margin-bottom:16px;border:1px solid rgba(54,173,45,.2);
}

h1 .onr-grad,h2 .onr-grad,h3 .onr-grad,.onr-grad{
  background:var(--grad);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}

p.onr-hero-sub{font-size:1.1rem;max-width:520px;margin-bottom:28px;color:var(--gray-500)}
.wp-block-group.onr-hero-dark p.onr-hero-sub{color:rgba(255,255,255,.75);font-size:1.15rem}

/* =============================================================================
 * SECCIONES
 * ========================================================================== */
.wp-block-group.onr-section,
.wp-block-group.onr-section-gray,
.wp-block-group.onr-section-dark{padding:100px var(--pad-x)}
.wp-block-group.onr-section > *,
.wp-block-group.onr-section-gray > *,
.wp-block-group.onr-section-dark > *{max-width:1600px;margin-left:auto;margin-right:auto}
.wp-block-group.onr-section-gray{background:var(--gray-100)}
.wp-block-group.onr-section-dark{background:var(--black);color:var(--white)}
.wp-block-group.onr-section-dark h1,
.wp-block-group.onr-section-dark h2,
.wp-block-group.onr-section-dark h3{color:var(--white)}
.wp-block-group.onr-section-dark p{color:rgba(255,255,255,.75)}

.wp-block-group.onr-section-head{max-width:720px !important;margin:0 auto 56px !important;text-align:center}
.wp-block-group.onr-section-head h2{position:relative;padding-bottom:22px;margin-bottom:14px}
.wp-block-group.onr-section-head h2::after{
  content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:60px;height:4px;background:var(--grad);border-radius:2px;
}
.wp-block-group.onr-section-head .onr-eyebrow-green,
.wp-block-group.onr-section-head p.onr-eyebrow-green{margin-left:auto;margin-right:auto;display:inline-block}

/* =============================================================================
 * KPIs
 * ========================================================================== */
.wp-block-columns.onr-kpis{gap:36px !important;flex-wrap:wrap;margin-top:36px}
.wp-block-columns.onr-kpis .wp-block-column{flex-basis:auto !important;flex-grow:0;padding:0}
.wp-block-columns.onr-kpis h3,
.wp-block-columns.onr-kpis h2{
  font-family:var(--font-display);font-size:1.8rem;font-weight:800;
  line-height:1.2 !important;
  padding-top:4px !important;
  margin:0 0 4px;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
}
.wp-block-columns.onr-kpis p{font-size:.82rem;color:var(--gray-500);margin:0;font-weight:500}

/* =============================================================================
 * GRID DE CATEGORÍAS
 * ========================================================================== */
.wp-block-columns.onr-cat-grid{gap:24px !important;margin:0}
.wp-block-columns.onr-cat-grid .wp-block-column{
  background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-lg);
  overflow:hidden;transition:all .3s var(--ease);cursor:pointer;padding:0 !important;
  position:relative;display:flex;flex-direction:column;
  flex-basis:calc(25% - 18px) !important;
}
.wp-block-columns.onr-cat-grid .wp-block-column::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--grad);
  transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease);
  z-index:3;border-radius:var(--radius-lg) var(--radius-lg) 0 0;
}
.wp-block-columns.onr-cat-grid .wp-block-column:hover::before{transform:scaleX(1)}
.wp-block-columns.onr-cat-grid .wp-block-column:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 48px -12px rgba(30,39,34,.22),0 0 0 1px rgba(54,173,45,.15);
  border-color:transparent;
}
.wp-block-columns.onr-cat-grid .wp-block-image,
.wp-block-columns.onr-cat-grid figure.wp-block-image{
  background:linear-gradient(180deg,var(--gray-100),var(--gray-200));
  aspect-ratio:16/10;margin:0;padding:20px;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.wp-block-columns.onr-cat-grid .wp-block-image img{max-height:100%;width:auto;object-fit:contain;transition:transform .3s var(--ease)}
.wp-block-columns.onr-cat-grid .wp-block-column:hover .wp-block-image img{transform:scale(1.08)}
.wp-block-columns.onr-cat-grid h3{padding:24px 24px 6px;margin:0;font-family:var(--font-body);font-weight:700;font-size:1.05rem;color:var(--black)}
.wp-block-columns.onr-cat-grid > .wp-block-column > p{padding:0 24px 20px;margin:0;font-size:.88rem;color:var(--gray-500);flex:1}
.wp-block-columns.onr-cat-grid p.onr-price,
p.onr-price{
  padding:16px 24px 20px !important;
  border-top:1px dashed var(--gray-200);
  font-family:var(--font-display);font-weight:800;color:var(--black);font-size:1.4rem;
  margin:0 !important;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
}
p.onr-price small{font-family:var(--font-body);font-size:.78rem;color:var(--gray-500);font-weight:400;-webkit-text-fill-color:var(--gray-500);margin-right:4px}
p.onr-price em{font-family:var(--font-body);font-size:.8rem;color:var(--gray-500);font-weight:400;font-style:normal;-webkit-text-fill-color:var(--gray-500)}

/* =============================================================================
 * GRID DE FEATURES · v4.2: CSS GRID (fuerza 3 columnas siempre)
 *
 * Marketing pidió 3 elementos por fila. Usamos display:grid (no flex) porque
 * Gutenberg añade `style="flex-basis:XX%"` inline a cada columna cuando el
 * número de columnas es alto (WP calcula anchos iguales automáticamente), y
 * ese inline gana contra nuestro flex-basis en CSS. Con Grid nos saltamos
 * TODO el sistema de flex de Gutenberg y forzamos 3 columnas por fila
 * independientemente de si hay 6, 8, 10 o los elementos que sean.
 * ========================================================================== */
.wp-block-columns.onr-feat-grid,
.wp-block-columns.onr-feat-grid.is-layout-flex{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0,1fr)) !important;
  gap:24px !important;
  background:transparent;
  flex-wrap:unset !important;      /* Neutraliza el flex-wrap de is-layout-flex */
  align-items:stretch;
}
/* Cada columna: neutralizamos flex-basis inline con !important y max-width auto */
.wp-block-columns.onr-feat-grid > .wp-block-column,
.wp-block-columns.onr-feat-grid.is-layout-flex > .wp-block-column,
.wp-block-columns.onr-feat-grid > .wp-block-column[style]{
  background:var(--white);
  padding:28px !important;
  border-radius:var(--radius);
  border:1px solid var(--gray-200);
  transition:all .3s var(--ease);
  /* Reset TOTAL de flex para que grid mande */
  flex:unset !important;
  flex-basis:auto !important;
  flex-grow:unset !important;
  max-width:100% !important;
  width:auto !important;
  margin:0 !important;
}
.wp-block-columns.onr-feat-grid > .wp-block-column:hover{
  border-color:var(--green);
  box-shadow:0 12px 28px -8px rgba(54,173,45,.2);
  transform:translateY(-3px);
}
.wp-block-columns.onr-feat-grid p.onr-feat-icon{
  width:48px;height:48px;border-radius:12px;
  background:var(--grad);color:var(--white);
  display:flex;align-items:center;justify-content:center;
  font-size:1.5rem;margin-bottom:16px;
  box-shadow:0 6px 14px rgba(54,173,45,.3);
}
.wp-block-columns.onr-feat-grid h3{font-family:var(--font-body);font-size:1rem;font-weight:700;margin-bottom:6px;color:var(--black)}
.wp-block-columns.onr-feat-grid p:not(.onr-feat-icon){font-size:.88rem;margin:0;color:var(--gray-500)}

/* =============================================================================
 * GRID DE BENEFITS (3 columnas)
 * ========================================================================== */
.wp-block-columns.onr-benefits{gap:24px !important;flex-wrap:wrap}
.wp-block-columns.onr-benefits .wp-block-column{
  background:var(--white);border:1px solid var(--gray-200);
  border-radius:var(--radius-lg);padding:36px !important;
  transition:all .3s var(--ease);position:relative;overflow:hidden;
  flex-basis:calc(33.333% - 16px) !important;
}
.wp-block-columns.onr-benefits .wp-block-column::before{
  content:"";position:absolute;top:-10px;right:-10px;
  width:80px;height:80px;border-radius:50%;
  background:radial-gradient(circle,rgba(54,173,45,.08),transparent 70%);
  transition:transform .3s var(--ease);
}
.wp-block-columns.onr-benefits .wp-block-column:hover{
  border-color:var(--green);transform:translateY(-4px);
  box-shadow:0 20px 40px -12px rgba(54,173,45,.25);
}
.wp-block-columns.onr-benefits .wp-block-column:hover::before{transform:scale(1.5)}
.wp-block-columns.onr-benefits p.onr-benefit-num{
  font-family:var(--font-display);font-size:1.4rem;font-weight:800;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  margin-bottom:14px;display:block;position:relative;
}
.wp-block-columns.onr-benefits h3{font-family:var(--font-body);font-size:1.15rem;margin-bottom:10px;color:var(--black);position:relative}
.wp-block-columns.onr-benefits p:not(.onr-benefit-num){position:relative;color:var(--gray-500)}

/* =============================================================================
 * STEPS (4 pasos)
 * ========================================================================== */
.wp-block-columns.onr-steps{gap:24px !important;flex-wrap:wrap;background:var(--gray-100)}
.wp-block-columns.onr-steps .wp-block-column{
  background:var(--white);border-radius:var(--radius);padding:32px !important;
  border:1px solid var(--gray-200);transition:all .2s var(--ease);
  flex-basis:calc(25% - 18px) !important;
}
.wp-block-columns.onr-steps .wp-block-column:hover{
  transform:translateY(-2px);box-shadow:var(--shadow-2);border-color:rgba(54,173,45,.3);
}
.wp-block-columns.onr-steps p.onr-step-n{
  width:40px;height:40px;border-radius:12px;
  background:var(--grad);color:var(--white);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:800;font-size:1.1rem;
  margin-bottom:16px;box-shadow:0 6px 14px rgba(54,173,45,.3);
}
.wp-block-columns.onr-steps h3{font-family:var(--font-body);font-size:1rem;margin-bottom:6px;color:var(--black)}
.wp-block-columns.onr-steps p:not(.onr-step-n){font-size:.88rem;margin:0;color:var(--gray-500)}

/* =============================================================================
 * REVIEWS
 * ========================================================================== */
.wp-block-columns.onr-reviews-grid{gap:20px !important;flex-wrap:wrap}
.wp-block-columns.onr-reviews-grid .wp-block-column{
  background:var(--white);border:1px solid var(--gray-200);
  border-left:3px solid var(--green);
  border-radius:var(--radius);padding:22px !important;
  transition:all .2s var(--ease);
  flex-basis:calc(50% - 10px) !important;
}
.wp-block-columns.onr-reviews-grid .wp-block-column:hover{
  transform:translateY(-2px);box-shadow:var(--shadow-2);
}
.wp-block-columns.onr-reviews-grid h4{
  font-family:var(--font-body);font-size:.92rem;font-weight:700;margin:0 0 2px;color:var(--black);
}
.wp-block-columns.onr-reviews-grid p{margin:0;font-size:.9rem;color:var(--black);line-height:1.55}
.wp-block-columns.onr-reviews-grid p.onr-review-date{font-size:.78rem;color:var(--gray-500);margin-bottom:12px}
.wp-block-columns.onr-reviews-grid p.onr-stars{color:#f5a623;letter-spacing:2px;margin-bottom:8px;font-size:.9rem}

/* Enlace a Google Reviews - v4.1 */
.onr-google-link,a.onr-google-link{
  display:inline-flex;align-items:center;gap:6px;
  color:var(--green-dark);font-weight:600;font-size:.85rem;
  text-decoration:none;transition:all .2s var(--ease);
  padding:4px 0;
}
.onr-google-link:hover{color:var(--green);text-decoration:underline}
.onr-google-link::after{content:"→";font-size:.9rem}

/* =============================================================================
 * PLANS (Renting Flexible)
 * ========================================================================== */
.wp-block-columns.onr-plans{gap:28px !important;flex-wrap:wrap;max-width:1200px;margin:0 auto}
.wp-block-columns.onr-plans .wp-block-column{
  background:var(--white);border:1px solid var(--gray-200);
  border-radius:var(--radius-lg);padding:40px 32px !important;
  transition:all .3s var(--ease);flex-basis:calc(33.333% - 19px) !important;
}
.wp-block-columns.onr-plans .wp-block-column.onr-plan-featured{
  background:var(--black);color:var(--white);position:relative;transform:translateY(-8px);
  box-shadow:0 30px 60px -20px rgba(30,39,34,.4),0 0 0 2px var(--green);overflow:hidden;
}
.wp-block-columns.onr-plans .wp-block-column.onr-plan-featured::before{
  content:"";position:absolute;inset:auto -60px -60px auto;
  width:220px;height:220px;border-radius:50%;background:var(--grad);
  filter:blur(60px);opacity:.45;
}
.wp-block-columns.onr-plans .wp-block-column.onr-plan-featured::after{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--grad);
}
.wp-block-columns.onr-plans .wp-block-column.onr-plan-featured > *{position:relative}
.wp-block-columns.onr-plans h3{font-family:var(--font-display);font-size:1.6rem;margin-bottom:12px}
.wp-block-columns.onr-plans .onr-plan-featured h3{color:var(--white)}
.wp-block-columns.onr-plans p.onr-plan-tag{
  font-size:.78rem;font-weight:700;color:var(--gray-500);
  text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px;
}
.wp-block-columns.onr-plans .onr-plan-featured p.onr-plan-tag{color:var(--lime)}
.wp-block-columns.onr-plans p.onr-plan-price{
  font-family:var(--font-display);font-size:2.2rem;font-weight:800;color:var(--black);
  padding:16px 0;margin-bottom:24px;
  border-top:1px dashed var(--gray-200);border-bottom:1px dashed var(--gray-200);
}
.wp-block-columns.onr-plans .onr-plan-featured p.onr-plan-price{color:var(--white);border-color:rgba(255,255,255,.15)}
.wp-block-columns.onr-plans p.onr-plan-price em{font-family:var(--font-body);font-size:.85rem;color:var(--gray-500);font-weight:400;font-style:normal}
.wp-block-columns.onr-plans .onr-plan-featured p.onr-plan-price em{color:rgba(255,255,255,.6)}
.wp-block-columns.onr-plans ul{list-style:none !important;padding:0 !important;margin:0 0 28px !important;font-size:.9rem}
.wp-block-columns.onr-plans ul li{display:flex;gap:8px;padding:6px 0;color:var(--gray-500)}
.wp-block-columns.onr-plans ul li::before{content:"✓";color:var(--green);font-weight:700}
.wp-block-columns.onr-plans .onr-plan-featured ul li{color:rgba(255,255,255,.8)}
.wp-block-columns.onr-plans .onr-plan-featured ul li::before{color:var(--lime)}

/* =============================================================================
 * FAQ
 * ========================================================================== */
details.onr-faq{
  background:var(--white);border:1px solid var(--gray-200);border-left:3px solid transparent;
  border-radius:var(--radius);padding:20px 24px;margin-bottom:12px;
  cursor:pointer;transition:all .2s var(--ease);max-width:820px;margin-left:auto;margin-right:auto;
}
details.onr-faq:hover{border-left-color:var(--gray-300)}
details.onr-faq[open]{border-color:var(--green);border-left-color:var(--green);box-shadow:0 6px 16px -6px rgba(54,173,45,.2)}
details.onr-faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;font-weight:600;font-size:1rem;color:var(--black);cursor:pointer}
details.onr-faq summary::-webkit-details-marker{display:none}
details.onr-faq summary::after{content:"+";font-size:1.5rem;color:var(--green-dark);font-weight:300;transition:transform .2s var(--ease)}
details.onr-faq[open] summary::after{transform:rotate(45deg)}
details.onr-faq p{margin-top:14px;color:var(--gray-500);font-size:.95rem;line-height:1.65}

/* =============================================================================
 * CTA BANNER
 * ========================================================================== */
.wp-block-group.onr-cta{
  max-width:1600px;margin:0 auto 100px;
  background:var(--black);color:var(--white);
  border-radius:var(--radius-xl);padding:64px;
  position:relative;overflow:hidden;
  box-shadow:0 30px 60px -20px rgba(30,39,34,.4);
}
.wp-block-group.onr-cta::before{
  content:"";position:absolute;inset:auto -100px -100px auto;
  width:400px;height:400px;border-radius:50%;background:var(--grad);filter:blur(80px);opacity:.4;
}
.wp-block-group.onr-cta::after{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--grad);
  border-radius:var(--radius-xl) var(--radius-xl) 0 0;
}
.wp-block-group.onr-cta > *{position:relative;z-index:1}
.wp-block-group.onr-cta h2{color:var(--white);margin-bottom:12px}
.wp-block-group.onr-cta p{color:rgba(255,255,255,.7)}

/* =============================================================================
 * BREADCRUMB
 * ========================================================================== */
p.onr-breadcrumb{font-size:.85rem;color:var(--gray-500);margin-bottom:16px}
p.onr-breadcrumb a{color:var(--gray-500)}
p.onr-breadcrumb a:hover{color:var(--green-dark)}
p.onr-breadcrumb strong{color:var(--black)}

/* =============================================================================
 * LEGAL PAGE
 * ========================================================================== */
.wp-block-group.onr-legal-hero{padding:64px var(--pad-x) 32px;background:var(--gray-100);border-bottom:1px solid var(--gray-200)}
.wp-block-group.onr-legal-hero > *{max-width:900px;margin-left:auto;margin-right:auto}
.wp-block-group.onr-legal-body{padding:60px var(--pad-x) 100px}
.wp-block-group.onr-legal-body > *{max-width:900px;margin-left:auto;margin-right:auto;font-size:1rem;line-height:1.75;color:var(--black)}
.wp-block-group.onr-legal-body h2{margin-top:40px;color:var(--black)}

/* =============================================================================
 * SHORTCODES
 * ========================================================================== */

/* [onrent_hero_visual] */
.onr-hero-visual{position:relative}
.onr-visual-frame{
  border-radius:var(--radius-xl);overflow:hidden;aspect-ratio:5/4;
  background:linear-gradient(135deg,#1e2722 0%,#2d3833 100%);
  position:relative;box-shadow:var(--shadow-3),0 0 0 1px rgba(54,173,45,.1);
}
.onr-visual-frame::before{
  content:"";position:absolute;inset:auto -20% -30% -20%;height:60%;
  background:radial-gradient(ellipse at center,rgba(54,173,45,.4),transparent 65%);
  filter:blur(30px);
}
.onr-visual-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}

/* [onrent_offer_badge] */
.onr-badge-offer{
  position:absolute;top:20px;left:-20px;
  background:var(--white);border-radius:var(--radius);
  box-shadow:var(--shadow-3);padding:16px 20px;
  display:flex;gap:12px;align-items:center;z-index:2;
  border:1px solid rgba(54,173,45,.1);
}
.onr-badge-offer .onr-badge-icon{
  width:56px;height:56px;border-radius:14px;background:var(--grad);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:#fff;line-height:1;box-shadow:0 8px 20px rgba(54,173,45,.4);flex-shrink:0;
}
.onr-badge-offer .onr-badge-icon-num{font-family:var(--font-display);font-weight:800;font-size:1.1rem}
.onr-badge-offer .onr-badge-icon-lbl{font-size:.55rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;margin-top:2px;opacity:.95}
.onr-badge-offer .onr-badge-title{font-weight:700;font-size:.92rem;color:var(--black)}
.onr-badge-offer .onr-badge-sub{font-size:.76rem;color:var(--gray-500);margin-top:2px}
.onr-badge-offer .onr-badge-tag{font-size:.68rem;color:var(--green-dark);font-weight:600;margin-top:4px}

/* [onrent_google_badge] · v4.1: clickable a Google Reviews */
.onr-badge-google,a.onr-badge-google{
  position:absolute;bottom:30px;right:-10px;
  background:var(--white);border-radius:var(--radius);
  box-shadow:var(--shadow-3);padding:14px 18px 14px 14px;gap:14px;
  display:flex;align-items:center;z-index:2;
  border:1px solid rgba(54,173,45,.1);
  text-decoration:none;color:inherit;
  transition:all .2s var(--ease);cursor:pointer;
}
a.onr-badge-google:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-3),0 0 0 2px rgba(54,173,45,.2);
}
.onr-badge-google .onr-rating-num{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding-right:14px;border-right:1px solid var(--gray-200);min-width:52px;
}
.onr-badge-google .onr-rating-num-big{font-family:var(--font-display);font-weight:800;font-size:1.6rem;color:var(--black);line-height:1}
.onr-badge-google .onr-rating-stars{color:#f5a623;letter-spacing:1px;font-size:.72rem;line-height:1;margin-top:4px}
.onr-badge-google .onr-badge-title{font-weight:700;font-size:.92rem;color:var(--black)}
.onr-badge-google .onr-badge-sub{font-size:.76rem;color:var(--gray-500);margin-top:2px}
.onr-google-logo{display:inline-flex;gap:1px;font-family:'Product Sans','Baloo Tammudu 2',sans-serif;font-weight:700;font-size:.92rem;letter-spacing:-.02em}
.onr-google-logo .g1{color:#4285F4}
.onr-google-logo .g2{color:#EA4335}
.onr-google-logo .g3{color:#FBBC05}
.onr-google-logo .g4{color:#4285F4}
.onr-google-logo .g5{color:#34A853}
.onr-google-logo .g6{color:#EA4335}

/* Badge inline en reviews section (clicable) */
.onr-google-review-badge,a.onr-google-review-badge{
  display:inline-flex;gap:10px;align-items:center;padding:12px 18px;
  border-radius:16px;background:var(--white);
  border:1px solid var(--gray-200);
  box-shadow:0 8px 24px -8px rgba(30,39,34,.15);
  margin-top:20px;
  text-decoration:none;color:inherit;
  transition:all .2s var(--ease);cursor:pointer;
}
a.onr-google-review-badge:hover{
  transform:translateY(-2px);
  border-color:var(--green);
  box-shadow:0 12px 32px -8px rgba(54,173,45,.25);
}
.onr-google-review-badge .onr-stars-gold{color:#f5a623;letter-spacing:2px;font-size:1.1rem}
.onr-google-review-badge .onr-google-divider{width:1px;height:40px;background:var(--gray-200)}

/* [onrent_booking] */
.onr-booking{
  margin:40px auto 0;max-width:1600px;
  background:var(--white);border-radius:var(--radius-lg);padding:22px;
  box-shadow:var(--shadow-3);border:1px solid var(--gray-200);
  border-top:3px solid var(--green);
}
.onr-booking-tabs{display:flex;gap:6px;margin-bottom:18px;padding:4px;background:var(--gray-100);border-radius:999px;width:fit-content}
.onr-booking-tabs button{border:none;background:transparent;padding:8px 18px;font-family:inherit;font-weight:600;font-size:.9rem;border-radius:999px;cursor:pointer;color:var(--gray-500);display:flex;align-items:center;gap:8px}
.onr-booking-tabs button.on{background:var(--white);color:var(--black);box-shadow:var(--shadow-1)}
.onr-booking-fields{display:grid;grid-template-columns:1.2fr 1.3fr 1fr 1fr auto;gap:12px;align-items:end}
.onr-field{background:var(--gray-100);border-radius:var(--radius);padding:12px 14px;border:1px solid transparent;transition:all .2s var(--ease)}
.onr-field:hover,.onr-field:focus-within{background:var(--white);border-color:var(--green);box-shadow:0 0 0 3px rgba(54,173,45,.1)}
.onr-field label{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--gray-500);font-weight:600;margin-bottom:4px}
.onr-field select,.onr-field input{border:none;background:transparent;width:100%;padding:0;font-family:inherit;font-size:.98rem;font-weight:600;color:var(--black);outline:none}

/* Fecha + hora en línea (14/08/2026) -- .onr-field de Recogida/Devolución
   envuelve los dos inputs (date + time) en .onr-field-fecha-hora (ver
   class-onrent-shortcode.php), para poder ponerlos en fila SIN afectar a
   la etiqueta, que sigue fuera de ese contenedor y en su línea propia.
   Cada input reparte el espacio a la mitad -- mismo tamaño entre sí. */
.onr-field-fecha-hora{
  display:flex;
  align-items:center;
  gap:10px;
}
.onr-field-fecha-hora input{
  width:auto;
  flex:1 1 0;
  min-width:0;
}
.onr-booking-search{background:var(--green);color:var(--white);border:none;padding:16px 30px;border-radius:999px;font-weight:600;cursor:pointer;font-size:1rem;box-shadow:0 6px 16px rgba(54,173,45,.25);transition:all .2s var(--ease)}
.onr-booking-search:hover{background:var(--green-dark);box-shadow:0 12px 32px -12px rgba(54,173,45,.35)}
.onr-booking-extra{display:flex;align-items:center;gap:14px;margin-top:14px;flex-wrap:wrap;font-size:.88rem;color:var(--gray-500)}
.onr-chip{padding:6px 14px;border-radius:999px;background:var(--gray-100);font-weight:600;font-size:.82rem;color:var(--black);cursor:pointer;border:1px solid transparent}
.onr-chip.on{background:var(--black);color:var(--white)}

/* [onrent_vehicle_grid] */
.onr-vh-results{max-width:1600px;margin:0 auto;display:grid;grid-template-columns:300px 1fr;gap:40px;padding:48px var(--pad-x) 100px}
.onr-filters{background:var(--white);border:1px solid var(--gray-200);border-top:3px solid var(--green);border-radius:var(--radius);padding:24px;align-self:start;position:sticky;top:calc(var(--nav-height) + 20px);box-shadow:var(--shadow-1)}
.onr-filters h3{font-family:var(--font-body);font-size:.9rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px}
.onr-filter-group{border-bottom:1px solid var(--gray-200);padding:14px 0}
.onr-filter-group:last-child{border-bottom:none}
.onr-filter-group h4{font-size:.82rem;font-weight:700;margin-bottom:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--gray-500)}
.onr-filter-check{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:.9rem;cursor:pointer}
.onr-filter-check input{accent-color:var(--green)}
.onr-count{margin-left:auto;color:var(--gray-500);font-size:.8rem}
.onr-vh-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.onr-vh-card{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius);overflow:hidden;transition:all .3s var(--ease);position:relative;display:flex;flex-direction:column}
.onr-vh-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);z-index:3}
.onr-vh-card:hover::before{transform:scaleX(1)}
.onr-vh-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -12px rgba(30,39,34,.2);border-color:transparent}
.onr-vh-thumb{background:linear-gradient(180deg,var(--gray-100),var(--gray-200));aspect-ratio:4/3;position:relative;display:flex;align-items:center;justify-content:center;padding:12px}
.onr-vh-thumb img{max-height:100%;width:auto;object-fit:contain}
.onr-vh-tag{position:absolute;top:14px;left:14px;padding:5px 12px;border-radius:999px;background:var(--grad);font-size:.72rem;font-weight:700;color:var(--white);box-shadow:0 4px 12px rgba(54,173,45,.35)}
.onr-vh-body{padding:20px;display:flex;flex-direction:column;flex:1}
.onr-vh-body h3{font-family:var(--font-body);font-size:1.05rem;font-weight:700;margin-bottom:4px}
.onr-vh-cat{font-size:.82rem;color:var(--gray-500);margin-bottom:14px}
.onr-vh-specs{display:flex;gap:14px;padding:12px 0;border-top:1px dashed var(--gray-200);border-bottom:1px dashed var(--gray-200);margin-bottom:14px;font-size:.78rem;color:var(--gray-500);flex-wrap:wrap}
.onr-vh-foot{display:flex;justify-content:space-between;align-items:center;margin-top:auto}
.onr-vh-price{font-family:var(--font-display);font-size:1.4rem;font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.onr-vh-unit{font-size:.8rem;color:var(--gray-500);font-weight:400}
.onr-vh-btn{background:var(--black);color:var(--white);padding:9px 16px;border-radius:999px;font-weight:600;font-size:.85rem}
.onr-pagination{display:flex;justify-content:center;gap:6px;margin-top:48px;grid-column:1/-1}
.onr-pagination a{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;border:1px solid var(--gray-200);font-weight:600;font-size:.9rem;color:var(--black)}
.onr-pagination a.on{background:var(--black);color:var(--white);border-color:var(--black)}

/* [onrent_contact_form] */
.onr-contact-form{background:var(--white);padding:48px;border-radius:var(--radius-lg);border:1px solid var(--gray-200);border-top:4px solid var(--green);box-shadow:0 20px 40px -12px rgba(30,39,34,.15)}
.onr-contact-form h2{font-family:var(--font-display);font-size:1.5rem;margin-bottom:6px}
.onr-contact-form > p{margin-bottom:28px;font-size:.92rem}
.onr-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.onr-form-field{margin-bottom:16px}
.onr-form-field label{display:block;font-size:.82rem;font-weight:600;margin-bottom:6px;color:var(--black)}
.onr-form-field input,.onr-form-field select,.onr-form-field textarea{width:100%;padding:12px 14px;border:1px solid var(--gray-200);border-radius:10px;font-family:inherit;font-size:.95rem;background:var(--gray-100);outline:none;transition:all .2s var(--ease)}
.onr-form-field input:focus,.onr-form-field select:focus,.onr-form-field textarea:focus{background:var(--white);border-color:var(--green);box-shadow:0 0 0 3px rgba(54,173,45,.15)}
.onr-form-submit{background:var(--green);color:var(--white);padding:16px 30px;border-radius:999px;font-weight:600;font-size:1rem;width:100%;border:none;cursor:pointer;box-shadow:0 6px 16px rgba(54,173,45,.25)}
.onr-form-submit:hover{background:var(--green-dark)}

/* [onrent_contact_info] */
.onr-contact-info-block{display:flex;gap:16px;padding:20px 0;border-top:1px solid var(--gray-200)}
.onr-contact-info-icn{width:48px;height:48px;border-radius:12px;background:var(--grad);color:var(--white);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.2rem;box-shadow:0 6px 14px rgba(54,173,45,.25)}
.onr-contact-info-block h4{font-family:var(--font-body);font-size:.95rem;margin-bottom:2px;color:var(--black)}
.onr-contact-info-block p{margin:0;font-size:.9rem;color:var(--gray-500)}

/* =============================================================================
 * RESPONSIVE
 * ========================================================================== */
@media (max-width:1200px){
  :root{--nav-height:88px}
  .wp-block-group.onr-hero > .wp-block-columns{grid-template-columns:1fr}
  .wp-block-columns.onr-cat-grid .wp-block-column{flex-basis:calc(50% - 12px) !important}
  /* v4.2: feat-grid en tablet pasa a 2 columnas (era grid de 3) */
  .wp-block-columns.onr-feat-grid,
  .wp-block-columns.onr-feat-grid.is-layout-flex{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
  .wp-block-columns.onr-benefits .wp-block-column{flex-basis:calc(50% - 12px) !important}
  .wp-block-columns.onr-steps .wp-block-column{flex-basis:calc(50% - 12px) !important}
  .wp-block-columns.onr-reviews-grid .wp-block-column{flex-basis:100% !important}
  .wp-block-columns.onr-plans .wp-block-column{flex-basis:calc(50% - 14px) !important}
  .foot-grid{grid-template-columns:1fr 1fr}
  .wp-block-group.onr-cta{padding:40px}
  .primary-menu{display:none}
  .menu-toggle{display:block}
  .onr-booking-fields{grid-template-columns:1fr 1fr}
  .onr-vh-results{grid-template-columns:1fr}
  .onr-filters{position:static}
  .onr-vh-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:720px){
  :root{--nav-height:80px;--logo-w:150px;--logo-h:37px}
  .wp-block-group.onr-section,.wp-block-group.onr-section-gray,.wp-block-group.onr-section-dark{padding:64px var(--pad-x)}
  .wp-block-group.onr-hero{padding:48px var(--pad-x) 32px}
  .wp-block-group.onr-hero-dark{padding:64px var(--pad-x)}
  .wp-block-columns.onr-cat-grid .wp-block-column,
  .wp-block-columns.onr-benefits .wp-block-column,
  .wp-block-columns.onr-steps .wp-block-column,
  .wp-block-columns.onr-plans .wp-block-column{flex-basis:100% !important}
  /* v4.2: feat-grid móvil pasa a 1 columna */
  .wp-block-columns.onr-feat-grid,
  .wp-block-columns.onr-feat-grid.is-layout-flex{
    grid-template-columns:1fr !important;
  }
  .foot-grid{grid-template-columns:1fr}
  .wp-block-group.onr-cta{padding:32px}
  h1{font-size:2.2rem}
  .onr-badge-offer{top:10px;left:10px;padding:12px 14px}
  .onr-badge-google{bottom:10px;right:10px;padding:10px 14px}
  .onr-booking-fields{grid-template-columns:1fr}
  .onr-vh-grid{grid-template-columns:1fr}
  .onr-form-row{grid-template-columns:1fr}
}
@media (max-width:420px){
  :root{--logo-w:130px;--logo-h:32px}
  .nav-phone .onr-phone-label{display:none}
}

/* Estrellas con relleno parcial (ej. 4,5 de 5) -- 13/08/2026.
   Mismo carácter ★★★★★ superpuesto dos veces: una capa base en gris
   (estrellas "vacías") y otra en el color dorado original, recortada al
   ancho indicado por --onr-star-fill (ej. 90% = 4,5 de 5 estrellas). No
   depende de ningún carácter Unicode de "media estrella" -- esos tienen
   soporte de fuente poco fiable entre dispositivos. */
/* Estrellas con relleno parcial (ej. 4,5 de 5) -- 13/08/2026.
   Mismo carácter ★★★★★ superpuesto dos veces: una capa base en gris
   (estrellas "vacías") y otra en el color dorado original, recortada al
   ancho indicado por --onr-star-fill (ej. 90% = 4,5 de 5 estrellas). No
   depende de ningún carácter Unicode de "media estrella" -- esos tienen
   soporte de fuente poco fiable entre dispositivos.

   OJO -- guerra de especificidad CSS (mismo patrón que el bug de [hidden]
   ya documentado en el plugin): las reglas .onr-badge-google .onr-rating-
   stars y .onr-google-review-badge .onr-stars-gold, más arriba en este
   mismo archivo, tienen la misma especificidad (dos clases) y pintaban el
   color dorado directamente, tapando el relleno parcial. El !important en
   el color es necesario para garantizar que esta regla gane siempre,
   independientemente del orden en que se edite el archivo en el futuro. */
.onr-stars-partial,
.onr-badge-google .onr-stars-partial,
.onr-google-review-badge .onr-stars-partial{
  position:relative;
  display:inline-block;
  color:#d9d9d9 !important;
}
.onr-stars-partial::after{
  content:"★★★★★";
  position:absolute;
  top:0;
  left:0;
  width:var(--onr-star-fill, 100%);
  overflow:hidden;
  white-space:nowrap;
  color:#f5a623;
}