/* Recepcionista IA 0.2.0 — la página principal (plantilla propia del plugin: no depende del tema).
   Encabezado con la marca · presentación con la tarjeta del agente · servicios (fichas de Conocimiento) · testimonios ·
   agendar (formulario por pasos + calendario) · pie con los teléfonos. El color de la marca llega como --wria-marca.
   Sin fuentes externas (letra del sistema): nada sale a otros servidores. */
.wria-pp{--wria-marca:#2f3fb8;--wria-acento:var(--wria-marca);--pp-tinta:#151a2d;--pp-suave:#5a6075;--pp-linea:#e3e5ee;--pp-fondo:#f5f6fa;--pp-blanco:#fff;--pp-verde:#15803d;--pp-max:1160px;--pp-letra:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;margin:0;background:var(--pp-fondo);color:var(--pp-tinta);font-family:var(--pp-letra);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
.wria-pp *,.wria-pp *::before,.wria-pp *::after{box-sizing:border-box}
.wria-pp img{max-width:100%;height:auto}
.wria-pp :where(a){color:inherit} /* 0.6.1 — con :where no le gana al color propio de un enlace con clase (el «Agendar una cita» salía con letra oscura sobre el color de la marca) */
.wria-pp h1,.wria-pp h2,.wria-pp h3{text-wrap:balance;margin:0;letter-spacing:-.015em;line-height:1.15}
.wria-pp :focus-visible{outline:3px solid color-mix(in srgb,var(--wria-marca) 55%,#fff);outline-offset:2px}
.wria-pp__in{max-width:var(--pp-max);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wria-pp__salto{position:absolute;left:-9999px;top:8px;background:var(--pp-blanco);padding:8px 12px;border-radius:8px;z-index:100}
.wria-pp__salto:focus{left:12px}

/* Saltar a una sección deja ver su título (el encabezado queda fijo arriba). */
.wria-pp [id]{scroll-margin-top:84px}
/* Encabezado */
.wria-pp__cab{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--pp-blanco) 92%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--pp-linea)}
.wria-pp__cab .wria-pp__in{display:flex;align-items:center;gap:20px;min-height:68px}
.wria-pp__marca{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;font-size:18px;min-width:0}
.wria-pp__marca img{max-height:40px;width:auto;display:block}
.wria-pp__marca span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wria-pp__nav{display:flex;gap:4px;margin-left:auto}
.wria-pp__nav a{text-decoration:none;color:var(--pp-suave);font-weight:600;font-size:15px;padding:8px 12px;border-radius:10px}
.wria-pp__nav a:hover{color:var(--pp-tinta);background:var(--pp-fondo)}
.wria-pp__idioma{display:flex;border:1px solid var(--pp-linea);border-radius:999px;overflow:hidden;font-size:13px;font-weight:700}
.wria-pp__idioma a{text-decoration:none;padding:5px 10px;color:var(--pp-suave)}
.wria-pp__idioma a[aria-current]{background:var(--pp-tinta);color:#fff}
.wria-pp__boton{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:12px;padding:12px 20px;font:inherit;font-weight:700;font-size:15.5px;text-decoration:none;cursor:pointer;background:var(--wria-marca);color:#fff;transition:filter .15s,transform .1s}
.wria-pp__boton:hover{filter:brightness(1.08)}
.wria-pp__boton:active{transform:translateY(1px)}
.wria-pp__boton--claro{background:var(--pp-blanco);color:var(--pp-tinta);border:1.5px solid var(--pp-linea)}
.wria-pp__boton--claro:hover{border-color:var(--wria-marca);filter:none}
.wria-pp__boton svg{flex:none}

/* Presentación */
.wria-pp__hero{padding-block:64px 56px;background:radial-gradient(900px 420px at 85% 0%,color-mix(in srgb,var(--wria-marca) 12%,transparent),transparent 70%),var(--pp-blanco);border-bottom:1px solid var(--pp-linea)}
.wria-pp__hero .wria-pp__in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:56px;align-items:center}
.wria-pp__ceja{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--wria-marca);margin:0 0 14px}
.wria-pp__ceja i{width:8px;height:8px;border-radius:50%;background:var(--pp-verde);box-shadow:0 0 0 4px color-mix(in srgb,var(--pp-verde) 20%,transparent)}
.wria-pp__hero h1{font-size:clamp(32px,4.6vw,52px);font-weight:800}
.wria-pp__hero p.wria-pp__sub{font-size:clamp(17px,1.6vw,19.5px);color:var(--pp-suave);max-width:34em;margin:18px 0 28px}
.wria-pp__accs{display:flex;flex-wrap:wrap;gap:12px}
.wria-pp__canales{display:flex;flex-wrap:wrap;gap:8px 18px;margin:22px 0 0;padding:0;list-style:none;color:var(--pp-suave);font-size:14.5px}
.wria-pp__canales li{display:flex;align-items:center;gap:7px}
.wria-pp__canales svg{color:var(--wria-marca)}

/* La tarjeta del agente (lo que ve la persona cuando le escribe) */
.wria-pp__agente{background:var(--pp-blanco);border:1px solid var(--pp-linea);border-radius:22px;box-shadow:0 30px 60px -36px rgba(21,26,45,.45),0 2px 6px rgba(21,26,45,.05);overflow:hidden;max-width:420px;justify-self:end;width:100%}
.wria-pp__ag-cab{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--pp-linea)}
.wria-pp__av{width:44px;height:44px;border-radius:50%;background:var(--wria-marca);color:#fff;display:grid;place-items:center;font-weight:800;font-size:18px;overflow:hidden;flex:none}
.wria-pp__av img{width:100%;height:100%;object-fit:cover}
.wria-pp__ag-cab b{display:block;font-size:16px}
.wria-pp__ag-cab small{display:flex;align-items:center;gap:6px;color:var(--pp-verde);font-weight:600;font-size:13px}
.wria-pp__ag-cab small::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.wria-pp__ag-msgs{padding:18px;display:flex;flex-direction:column;gap:10px;background:var(--pp-fondo)}
.wria-pp__msg{max-width:88%;padding:11px 14px;border-radius:16px;font-size:14.5px;line-height:1.45;background:var(--pp-blanco);border:1px solid var(--pp-linea);border-bottom-left-radius:5px}
.wria-pp__msg--yo{align-self:flex-end;background:var(--wria-marca);color:#fff;border:0;border-bottom-left-radius:16px;border-bottom-right-radius:5px}
.wria-pp__ag-accs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:14px 18px 18px}
.wria-pp__ag-accs button,.wria-pp__ag-accs a{display:flex;flex-direction:column;align-items:center;gap:4px;border:1px solid var(--pp-linea);background:var(--pp-blanco);border-radius:14px;padding:10px 6px;font:inherit;font-size:13px;font-weight:700;color:var(--pp-tinta);cursor:pointer;text-decoration:none}
.wria-pp__ag-accs button:hover,.wria-pp__ag-accs a:hover{border-color:var(--wria-marca)}
.wria-pp__ag-accs svg{color:var(--wria-marca)}
.wria-pp__ag-accs .es-wa svg{color:var(--pp-verde)}

/* Secciones */
.wria-pp__sec{padding-block:72px}
.wria-pp__sec + .wria-pp__sec{padding-top:0}
.wria-pp__cabsec{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:12px 24px;margin-bottom:28px}
.wria-pp__cabsec h2{font-size:clamp(26px,3vw,36px);font-weight:800}
.wria-pp__cabsec p{color:var(--pp-suave);margin:8px 0 0;max-width:40em}

/* Servicios: las fichas de Conocimiento */
.wria-pp__servicios{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.wria-pp__serv{display:flex;flex-direction:column;gap:10px;background:var(--pp-blanco);border:1px solid var(--pp-linea);border-radius:18px;padding:22px}
.wria-pp__serv h3{font-size:18.5px;font-weight:800}
.wria-pp__serv p{margin:0;color:var(--pp-suave);font-size:15px;flex:1}
.wria-pp__serv button{align-self:flex-start;border:0;background:none;padding:0;font:inherit;font-weight:700;font-size:14.5px;color:var(--wria-marca);cursor:pointer}
.wria-pp__serv button:hover{text-decoration:underline}

/* Agendar */
.wria-pp__agendar{background:var(--pp-blanco);border-top:1px solid var(--pp-linea);border-bottom:1px solid var(--pp-linea);padding-block:72px}
.wria-pp__agendar .wria-pp__cabsec{justify-content:center;text-align:center}
.wria-pp__agendar .wria-pp__cabsec p{margin-inline:auto}

/* Pie */
.wria-pp__pie{padding-block:44px 36px;color:var(--pp-suave);font-size:14.5px}
.wria-pp__pie .wria-pp__in{display:grid;grid-template-columns:minmax(0,1.2fr) repeat(2,minmax(0,1fr));gap:28px}
.wria-pp__pie h3{font-size:14px;text-transform:uppercase;letter-spacing:.07em;color:var(--pp-tinta);margin:0 0 10px}
.wria-pp__pie ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.wria-pp__pie b{color:var(--pp-tinta)}
.wria-pp__pie a{text-decoration:none}
.wria-pp__pie a:hover{color:var(--pp-tinta);text-decoration:underline}
.wria-pp__legal{grid-column:1/-1;border-top:1px solid var(--pp-linea);padding-top:18px;font-size:13px}
.wria-pp__num{font-variant-numeric:tabular-nums}

/* Con la barra de WordPress (solo el administrador la ve): el encabezado queda debajo. */
.admin-bar .wria-pp__cab{top:32px}
/* 0.6.0 — La foto de portada (Página principal → Foto de portada): grande a la derecha; la tarjeta del agente cuelga de su
   borde de abajo para que se vea lo de la foto (el letrero). En el celular, la foto arriba y sin la tarjeta (queda la
   burbuja del widget). */
.wria-pp__hero--foto .wria-pp__in{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:48px}
.wria-pp__media{position:relative;min-width:0;margin-bottom:72px}
.wria-pp__foto{display:block;width:100%;aspect-ratio:5/4;object-fit:cover;border-radius:24px;background:var(--pp-linea);box-shadow:0 30px 60px -38px rgba(21,26,45,.45)}
.wria-pp__hero--foto .wria-pp__agente{position:absolute;left:-20px;bottom:-72px;width:min(300px,calc(100% - 40px));max-width:none;justify-self:auto}
.wria-pp__hero--foto .wria-pp__ag-msgs{padding:12px 14px}
.wria-pp__hero--foto .wria-pp__ag-cab{padding:12px 14px}
.wria-pp__hero--foto .wria-pp__ag-accs{padding:10px 14px 14px}
/* 0.6.0 — Pulsaciones que guían: un halo que late 3 veces y se queda quieto (el botón de agendar al abrir; después el
   «Chatear» de la tarjeta y la burbuja del widget). Con «reducir movimiento», nada late (regla de abajo). */
.wria-pp__late{position:relative;animation:wria-pp-late 1.6s ease-out 3}
.wria-pp__late--tarde{animation-delay:2.5s}
.wria-pp__late::after{content:"";position:absolute;inset:-4px;border-radius:15px;box-shadow:0 0 0 3px color-mix(in srgb,var(--wria-marca) 26%,transparent);pointer-events:none}
@keyframes wria-pp-late{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--wria-marca) 55%,transparent)}70%{box-shadow:0 0 0 14px transparent}100%{box-shadow:0 0 0 0 transparent}}
.wria-pp__ceja i{position:relative}
.wria-pp__ceja i::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--pp-verde);opacity:0;animation:wria-pp-radar 2s ease-out 3}
@keyframes wria-pp-radar{0%{transform:scale(.6);opacity:.8}100%{transform:scale(1.8);opacity:0}}
.wria-pp .wria-agente__fab{animation:wria-pp-late 1.6s ease-out 3 4s}
.wria-pp__serv-accs{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:auto}
.wria-pp__serv-accs a{color:var(--wria-marca);font-weight:700;font-size:14.5px;text-decoration:none}
@media (max-width:782px){.admin-bar .wria-pp__cab{top:46px}}
@media (max-width:600px){.admin-bar .wria-pp__cab{top:0}}
/* Celular */
@media (max-width:900px){
  .wria-pp__hero .wria-pp__in{grid-template-columns:minmax(0,1fr);gap:36px}
  .wria-pp__agente{justify-self:stretch;max-width:none}
  .wria-pp__hero--foto .wria-pp__in{grid-template-columns:minmax(0,1fr);gap:26px}
  .wria-pp__hero--foto .wria-pp__media{order:-1;margin-bottom:0}
  .wria-pp__hero--foto .wria-pp__foto{aspect-ratio:16/10}
  .wria-pp__hero--foto .wria-pp__agente{display:none}
  .wria-pp__nav{display:none}
  .wria-pp__idioma{margin-left:auto}
  .wria-pp__pie .wria-pp__in{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  .wria-pp__cab .wria-pp__boton{display:none}
  .wria-pp__hero{padding-block:40px 36px}
  .wria-pp__accs .wria-pp__boton{flex:1 1 100%}
  .wria-pp__sec,.wria-pp__agendar{padding-block:52px}
}
@media (prefers-reduced-motion:reduce){.wria-pp *{transition:none!important;animation:none!important}}

/* 0.9.0 — Color de acento (Página principal → Colores). Sin acento vale el principal: la página se ve igual que antes. */
.wria-pp__ceja,.wria-pp__canales svg,.wria-pp__serv-accs a,.wria-pp__serv button{color:var(--wria-acento)}
/* 0.9.0 — Pie: redes y enlaces legales */
.wria-pp__pie--redes .wria-pp__in{grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr))}
.wria-pp__pie .wria-pp__redes{display:flex;flex-wrap:wrap;gap:8px}
.wria-pp__redes a{width:40px;height:40px;border-radius:50%;border:1px solid var(--pp-linea);display:grid;place-items:center;color:var(--pp-tinta);background:var(--pp-blanco)}
.wria-pp__redes a:hover{border-color:var(--wria-acento);color:var(--wria-acento);text-decoration:none}
.wria-pp__legal{display:flex;flex-wrap:wrap;gap:6px 18px}
/* 0.9.0 — Plantilla «Elegante»: presentación oscura y centrada, títulos con letra de libro (la del sistema: no se carga
   ninguna fuente de afuera), servicios en lista. El encabezado queda claro para que se vea cualquier logo. */
.wria-pp--elegante h1,.wria-pp--elegante h2,.wria-pp--elegante h3{font-family:Georgia,"Times New Roman",Times,serif;font-weight:400;letter-spacing:0}
.wria-pp--elegante .wria-pp__hero{background:#10151f;color:#f4f1ea;border-bottom:0;padding-block:80px 72px}
.wria-pp--elegante .wria-pp__hero .wria-pp__in,.wria-pp--elegante .wria-pp__hero--foto .wria-pp__in{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:40px}
.wria-pp--elegante .wria-pp__hero h1{font-size:clamp(34px,5vw,58px)}
.wria-pp--elegante .wria-pp__hero p.wria-pp__sub{color:#c9ccd6;margin-inline:auto}
.wria-pp--elegante .wria-pp__accs,.wria-pp--elegante .wria-pp__canales{justify-content:center}
.wria-pp--elegante .wria-pp__canales{color:#c9ccd6}
/* Auditoría: sobre el fondo oscuro, el acento aclarado (la línea de arriba del título y los íconos se leen). */
.wria-pp--elegante .wria-pp__hero .wria-pp__ceja,.wria-pp--elegante .wria-pp__hero .wria-pp__canales svg{color:color-mix(in srgb,var(--wria-acento) 40%,#fff)}
.wria-pp--elegante .wria-pp__hero .wria-pp__boton{background:var(--wria-acento)}
.wria-pp--elegante .wria-pp__hero .wria-pp__boton--claro{background:transparent;color:#f4f1ea;border:1.5px solid #3a4152}
.wria-pp--elegante .wria-pp__hero .wria-pp__boton--claro:hover{border-color:#f4f1ea}
.wria-pp--elegante .wria-pp__agente{display:none}
.wria-pp--elegante .wria-pp__media{margin-bottom:0;width:100%;max-width:1000px}
.wria-pp--elegante .wria-pp__foto{aspect-ratio:21/9}
.wria-pp--elegante .wria-pp__servicios{grid-template-columns:minmax(0,1fr);gap:0;border-top:1px solid var(--pp-linea)}
.wria-pp--elegante .wria-pp__serv{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:6px 28px;background:transparent;border:0;border-bottom:1px solid var(--pp-linea);border-radius:0;padding:22px 4px}
.wria-pp--elegante .wria-pp__serv h3{flex:0 1 280px;font-size:21px}
.wria-pp--elegante .wria-pp__serv p{flex:1 1 320px}
.wria-pp--elegante .wria-pp__serv-accs{margin-top:0}
.wria-pp--elegante .wria-pp__pie{background:#10151f;color:#c9ccd6}
.wria-pp--elegante .wria-pp__pie h3,.wria-pp--elegante .wria-pp__pie b{color:#fff}
.wria-pp--elegante .wria-pp__pie a:hover{color:#fff}
.wria-pp--elegante .wria-pp__legal{border-top-color:#2a3140}
.wria-pp--elegante .wria-pp__redes a{background:transparent;color:#f4f1ea;border-color:#3a4152}
/* 0.9.0 — Plantilla «Directa»: el formulario para agendar arriba, al lado del título. */
.wria-pp--directa .wria-pp__hero .wria-pp__in{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:start;gap:44px}
.wria-pp__form-arriba{background:var(--pp-blanco);border:1px solid var(--pp-linea);border-radius:22px;padding:24px;box-shadow:0 30px 60px -40px rgba(21,26,45,.4);min-width:0;width:100%}
.wria-pp__form-arriba .wria-pp__cabsec{margin-bottom:16px}
.wria-pp__form-arriba .wria-pp__cabsec h2{font-size:24px}
@media (max-width:900px){
  .wria-pp--directa .wria-pp__hero .wria-pp__in{grid-template-columns:minmax(0,1fr)}
  .wria-pp__pie--redes .wria-pp__in{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:900px){.wria-pp--elegante .wria-pp__foto{aspect-ratio:16/10}}
@media (max-width:560px){
  /* Auditoría: en el celular el formulario usa todo el ancho, como en su sección (el calendario necesita el espacio). */
  .wria-pp__form-arriba{padding:0;border:0;border-radius:0;box-shadow:none;background:transparent}
  .wria-pp--elegante .wria-pp__hero{padding-block:48px 40px}
}
