/* ═══════════════════════════════════════════════════════════════════════════
   DUOVIA AGENDA · sistema visual compartido por el producto y cada empresa.
   La plataforma utiliza la identidad DUOVIA; las páginas de reserva conservan
   el logotipo y el color configurado por cada negocio.

   Índice
     0 · Tokens y modo oscuro        5 · Front-end público
     1 · Base                        6 · Back-end
     2 · Superficies                 7 · Instalador y errores
     3 · Controles                   8 · Responsive
     4 · Patrones                    9 · Impresión

   Sin build, sin dependencias, sin @layer (un navegador sin soporte
   descartaría el bloque entero y la página saldría desnuda).
   ═══════════════════════════════════════════════════════════════════════════ */

/* ══ 0 · TOKENS ═══════════════════════════════════════════════════════════ */

:root{
  color-scheme: light;
  accent-color: var(--accent);           /* todos los radio y checkbox, gratis */

  /* ── Marca. Lo único que inyecta el proveedor; PHP calcula los derivados
        con matemática de contraste WCAG en lib/theme.php, así que funcionan
        con cualquier tono (lima, cian, fucsia, marino) y sin color-mix. ── */
  --accent:#15557f;
  --accent-ink:#0d476d;       --accent-ink-d:#0d476d;
  --on-accent:#ffffff;
  --accent-line:#a9c8dc;      --accent-line-d:#a9c8dc;
  --tint-1:#eef6fa;           --tint-1-d:#eef6fa;
  --tint-2:#dcecf4;           --tint-2-d:#dcecf4;
  --tint-3:#c5dee9;           --tint-3-d:#c5dee9;

  --duovia-ink:#08233e;
  --duovia-deep:#04182a;
  --duovia-blue:#15557f;
  --duovia-gold:#b9821f;
  --duovia-gold-soft:#f4e7ca;

  /* ── Superficies (claro) ── */
  --bg:#f7f8f8;
  --bg-2:#eef2f4;            /* el «pozo»: hover de tabla, franja ocupada  */
  --panel:#ffffff;
  --panel-2:#f8f6f1;         /* superficie anidada y campos hundidos       */
  --ink:#08233e;
  --ink-2:#354a5d;
  --muted:#5c6874;           /* contenido secundario legible               */
  --muted-2:#78838d;         /* cromo decorativo                           */
  --line:#d7dee7;
  --line-2:#e9edf1;
  --rim:rgba(255,255,255,.75);          /* el filete de luz que «levanta»  */
  --glass:rgba(255,255,255,.78);

  /* ── Estado. Deliberadamente separado de la marca ── */
  --ok:#0f9d58;      --ok-ink:#0a6b3d;
  --warn:#d97706;    --warn-ink:#8f560c;
  --danger:#e11d48;  --danger-ink:#a3123a;
  --info:#3b64d8;    --info-ink:#28459c;
  --neutral:#64748b; --neutral-ink:#3f4a5e;

  /* ── Elevación: sombras teñidas de tinta, nunca negras ── */
  --sh:15 23 42;
  --e0: 0 1px 1px -.5px rgb(var(--sh)/.05);
  --e1: 0 1px 2px -1px rgb(var(--sh)/.10), 0 2px 6px -2px rgb(var(--sh)/.06);
  --e2: 0 1px 2px -1px rgb(var(--sh)/.08), 0 4px 10px -3px rgb(var(--sh)/.08),
        0 14px 28px -14px rgb(var(--sh)/.16);
  --e3: 0 2px 4px -2px rgb(var(--sh)/.10), 0 8px 18px -6px rgb(var(--sh)/.12),
        0 28px 48px -24px rgb(var(--sh)/.24);
  --e4: 0 4px 8px -4px rgb(var(--sh)/.12), 0 18px 36px -12px rgb(var(--sh)/.18),
        0 56px 84px -40px rgb(var(--sh)/.32);
  --inset-1: inset 0 1px 2px rgb(var(--sh)/.07);
  --inset-2: inset 0 2px 5px rgb(var(--sh)/.11);

  /* ── Radios: escala cerrada, sin valores sueltos ── */
  --r-1:8px; --r-2:12px; --r-3:16px; --r-4:22px; --r-5:28px; --r-full:999px;

  /* ── Espaciado, rejilla de 4 ── */
  --s-1:4px; --s-2:8px;  --s-3:12px; --s-4:16px; --s-5:20px;
  --s-6:26px; --s-7:34px; --s-8:44px; --s-9:56px;

  /* ── Medidas de control: una sola verdad, 44px de pulgar ── */
  --ctl:44px; --ctl-sm:34px; --ctl-lg:52px;
  --head-h:68px; --tabbar-h:62px; --icon:20px; --pad:20px;

  /* ── Tipografía ── */
  --font:"Poppins", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-num: var(--font);
  --mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", Consolas, monospace;
  --num: tabular-nums lining-nums;
  --fs-3xs:11px; --fs-2xs:12px; --fs-xs:13px; --fs-sm:14px; --fs-base:15px;
  --fs-md:16px;  --fs-lg:19px;  --fs-xl:23px;
  --fs-2xl:clamp(26px, 1.4vw + 21px, 34px);
  --fs-3xl:clamp(34px, 3vw + 22px, 52px);

  /* ── Movimiento ── */
  --t-1:120ms; --t-2:190ms; --t-3:320ms;
  --ease: cubic-bezier(.32,.72,0,1);
  --ease-inout: cubic-bezier(.65,0,.35,1);
  --spring: cubic-bezier(.34,1.56,.64,1);
}

/* Indirección de marca: --t1/--t2/--t3/--acc-ink/--acc-line se reevalúan en
   CADA elemento, así que funcionan tanto con el acento global del proveedor
   como con el acento propio que un servicio inyecta en su style= en línea
   (donde no caben media queries). */
*, *::before, *::after{
  --t1: var(--tint-1);
  --t2: var(--tint-2);
  --t3: var(--tint-3);
  --acc-ink: var(--accent-ink);
  --acc-line: var(--accent-line);
}

@font-face{ font-family:"Poppins"; src:url("fonts/poppins-400-latin.woff2") format("woff2"); font-style:normal; font-weight:400; font-display:swap; }
@font-face{ font-family:"Poppins"; src:url("fonts/poppins-500-latin.woff2") format("woff2"); font-style:normal; font-weight:500; font-display:swap; }
@font-face{ font-family:"Poppins"; src:url("fonts/poppins-600-latin.woff2") format("woff2"); font-style:normal; font-weight:600; font-display:swap; }
@font-face{ font-family:"Poppins"; src:url("fonts/poppins-700-latin.woff2") format("woff2"); font-style:normal; font-weight:700; font-display:swap; }

/* ══ 1 · BASE ═════════════════════════════════════════════════════════════ */

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  font:var(--fs-base)/1.55 var(--font);
  color:var(--ink);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}

/* La aureola de marca: un solo degradado fijo que baña toda la página desde
   arriba. Sustituye a los cuatro filetes sueltos de acento del diseño viejo. */
body::before{
  content:""; position:fixed; inset:0 0 auto 0; height:min(56vh,560px);
  z-index:-1; pointer-events:none;
  background:
    radial-gradient(1100px 520px at 15% -10%, var(--t2), transparent 68%),
    radial-gradient(900px 420px at 92% -14%, var(--t1), transparent 70%);
  opacity:.9;
}

:where(h1,h2,h3,h4){ margin:0 0 .45em; line-height:1.2; font-weight:640; letter-spacing:-.015em; }
h1{ font-size:var(--fs-2xl); }
h2{ font-size:var(--fs-lg); }
h3{ font-size:var(--fs-md); }
:where(p){ margin:0 0 .8em; }
:where(a){ color:var(--acc-ink); text-decoration:none; }
:where(a):hover{ text-decoration:underline; text-underline-offset:2px; }
:where(code){ font-family:var(--mono); font-size:.9em; }
:where(img){ max-width:100%; }
:where(ul,ol){ margin:0 0 .8em; padding-left:1.2em; }

/* Foco visible en toda la aplicación. Usa --acc-ink, así que el anillo se ve
   igual con un acento turquesa, lima o ámbar. */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:2px solid var(--acc-ink);
  outline-offset:2px;
  border-radius:var(--r-1);
}

::selection{ background:var(--t3); color:var(--ink); }

.muted{ color:var(--muted); }
.small{ font-size:var(--fs-sm); }
.right{ text-align:right; }
.nowrap{ white-space:nowrap; }
.grow{ flex:1 1 auto; min-width:0; }
.inline{ display:inline; }
.narrow{ max-width:440px; margin-inline:auto; }
.icon{ display:block; width:var(--icon); height:var(--icon); flex:none; }

/* La única voz de «cromo» del sistema: versalita de 11px. */
.sub, .kpi-lab, .table th, .cal-wd, .locator span, .side-sep, .loadbar-d,
.summary-list dt, .crumbs{
  font-size:var(--fs-3xs); text-transform:uppercase; letter-spacing:.085em;
  font-weight:700; color:var(--muted);
}
.sub{ margin:var(--s-6) 0 var(--s-3); }
.sub:first-child{ margin-top:0; }
.hint{ font-size:var(--fs-sm); color:var(--muted); margin:var(--s-3) 0 0; }
.section-title{ margin:var(--s-7) 0 var(--s-4); font-size:var(--fs-lg); }
.note{ color:var(--ink-2); font-style:italic; }

/* Toda cifra del producto va tabular: las columnas se alinean solas. */
.kpi-num, .cal-day, .slot-time, .agenda-time strong, .booking-when span,
.locator strong, .price, .loadbar-n, .summary-list dd, .table td, code.big{
  font-variant-numeric:var(--num);
}

/* ══ 2 · SUPERFICIES ══════════════════════════════════════════════════════ */

/* La losa: filete de luz arriba + borde + sombra. Es el átomo del sistema. */
.panel{
  position:relative;
  padding:var(--pad);
  background:linear-gradient(180deg, var(--panel), var(--panel-2));
  border:1px solid var(--line);
  border-radius:var(--r-4);
  box-shadow: inset 0 1px 0 var(--rim), var(--e1);
  margin-bottom:var(--s-4);
}
.panel-head{
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--s-4); flex-wrap:wrap; margin-bottom:var(--s-4);
}
.panel-head h2{ margin:0; }

/* Regla que sangra de canto a canto del panel. */
.panel-head + .table-wrap, .status-form{
  border-top:1px solid var(--line-2);
  margin-inline:calc(var(--pad) * -1);
  padding-inline:var(--pad);
  padding-top:var(--s-4);
}
.panel-head + .table-wrap{ border-top:0; padding-top:0; }

.empty{
  text-align:center; padding:var(--s-8) var(--s-5); color:var(--muted);
  background:var(--panel-2); border:1px dashed var(--line);
  border-radius:var(--r-3); box-shadow:var(--inset-1);
}
.empty h3{ color:var(--ink); }
.empty .btn{ margin-top:var(--s-3); }
.empty.sm{ padding:var(--s-6) var(--s-4); }

/* Alertas: rejilla de icono + texto. */
.alert{
  display:grid; grid-template-columns:1fr; gap:var(--s-2);
  padding:var(--s-3) var(--s-4); border-radius:var(--r-3);
  margin-bottom:var(--s-4); font-size:var(--fs-sm);
  border:1px solid; box-shadow:var(--e0);
}
.alert-ok{    background:color-mix(in srgb, var(--ok) 12%, var(--panel));     border-color:color-mix(in srgb, var(--ok) 34%, transparent);     color:var(--ok-ink); }
.alert-error{ background:color-mix(in srgb, var(--danger) 12%, var(--panel)); border-color:color-mix(in srgb, var(--danger) 34%, transparent); color:var(--danger-ink); }
.alert-warn{  background:color-mix(in srgb, var(--warn) 12%, var(--panel));   border-color:color-mix(in srgb, var(--warn) 34%, transparent);   color:var(--warn-ink); }
.alert-info{  background:color-mix(in srgb, var(--info) 12%, var(--panel));   border-color:color-mix(in srgb, var(--info) 34%, transparent);   color:var(--info-ink); }

/* La marca es REDONDA (pill), el estado es RECTANGULAR (badge). */
.pill{
  display:inline-flex; align-items:center; gap:5px;
  padding:4px 11px; border-radius:var(--r-full);
  background:var(--t1); color:var(--acc-ink);
  border:1px solid var(--acc-line);
  font-size:var(--fs-2xs); font-weight:650; white-space:nowrap;
}
.badge{
  --st:var(--neutral); --st-ink:var(--neutral-ink);
  display:inline-flex; align-items:center; gap:5px;
  padding:3px 9px; border-radius:var(--r-1);
  background:color-mix(in srgb, var(--st) 15%, var(--panel));
  color:var(--st-ink);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--st) 30%, transparent);
  font-size:var(--fs-3xs); font-weight:700; white-space:nowrap;
  letter-spacing:.01em;
}
.badge::before{
  content:""; width:6px; height:6px; border-radius:var(--r-full);
  background:var(--st); flex:none;
}
.badge-confirmed{ --st:var(--ok);      --st-ink:var(--ok-ink); }
.badge-pending  { --st:var(--warn);    --st-ink:var(--warn-ink); }
.badge-cancelled{ --st:var(--danger);  --st-ink:var(--danger-ink); }
.badge-completed{ --st:var(--info);    --st-ink:var(--info-ink); }
.badge-no_show  { --st:var(--neutral); --st-ink:var(--neutral-ink); }

.dot{
  display:inline-block; width:9px; height:9px; border-radius:var(--r-full);
  margin-right:.45em; vertical-align:middle; flex:none;
  box-shadow: inset 0 0 0 1px rgb(var(--sh)/.18);
}

/* ══ 3 · CONTROLES ════════════════════════════════════════════════════════ */

/* Tamaño y anchura separados: .btn-lg ya no ocupa el 100%. */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.45em;
  min-height:var(--ctl); padding:0 18px;
  border:1px solid transparent; border-radius:var(--r-2);
  font:inherit; font-weight:650; cursor:pointer; text-align:center;
  transition: transform var(--t-1) var(--ease), box-shadow var(--t-2) var(--ease),
              background var(--t-1) var(--ease), border-color var(--t-1) var(--ease);
}
.btn:hover{ text-decoration:none; }
.btn-sm{ min-height:var(--ctl-sm); padding:0 12px; font-size:var(--fs-sm); }
.btn-lg{ min-height:var(--ctl-lg); padding:0 26px; font-size:var(--fs-md); }
.btn-block{ width:100%; }

.btn-primary{
  background:linear-gradient(180deg,
    color-mix(in srgb, var(--accent) 88%, #fff), var(--accent) 55%,
    color-mix(in srgb, var(--accent) 92%, #000));
  color:var(--on-accent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), var(--e1),
              0 6px 20px -8px var(--acc-line);
}
.btn-primary:hover{ transform:translateY(-1px); box-shadow: inset 0 1px 0 rgba(255,255,255,.28), var(--e2), 0 12px 30px -10px var(--acc-line); }
.btn-primary:active{ transform:translateY(1px) scale(.985); box-shadow:var(--inset-1); }

.btn-ghost{
  background:linear-gradient(180deg, var(--panel), var(--panel-2));
  color:var(--ink-2); border-color:var(--line);
  box-shadow: inset 0 1px 0 var(--rim), var(--e0);
}
.btn-ghost:hover{ transform:translateY(-1px); border-color:var(--acc-line); color:var(--acc-ink); box-shadow: inset 0 1px 0 var(--rim), var(--e1); }
.btn-ghost:active{ transform:translateY(1px); box-shadow:var(--inset-1); }

.btn-danger{
  background:color-mix(in srgb, var(--danger) 10%, var(--panel));
  color:var(--danger-ink);
  border-color:color-mix(in srgb, var(--danger) 32%, transparent);
}
.btn-danger:hover{ background:color-mix(in srgb, var(--danger) 18%, var(--panel)); transform:translateY(-1px); }

/* WhatsApp: verde de marca ajeno al acento del proveedor, a propósito. */
.btn-wa{
  background:linear-gradient(180deg,#2ec26a,#1f9e52); color:#fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.3), var(--e1), 0 6px 18px -8px rgba(31,158,82,.7);
}
.btn-wa:hover{ transform:translateY(-1px); filter:brightness(1.06); }
.btn-wa:active{ transform:translateY(1px) scale(.985); box-shadow:var(--inset-1); }
.btn-wa svg{ width:18px; height:18px; }

.link-sm{ font-size:var(--fs-sm); font-weight:650; color:var(--acc-ink); }
button.link-sm{ background:none; border:0; padding:2px 4px; cursor:pointer; font-family:inherit; }
.danger, button.danger{ color:var(--danger-ink); }

/* Campos HUNDIDOS que SUBEN a la superficie al enfocarse. */
.field{ display:block; margin-bottom:var(--s-4); min-width:0; }
.field > span, .filters label > span{
  display:block; font-size:var(--fs-xs); font-weight:650;
  color:var(--ink-2); margin-bottom:6px; text-transform:none; letter-spacing:0;
}
.field small{ font-weight:400; color:var(--muted); }

input[type=text],input[type=email],input[type=password],input[type=tel],
input[type=number],input[type=date],input[type=time],input[type=datetime-local],
input[type=search],input[type=file],select,textarea{
  width:100%; min-height:var(--ctl); padding:10px 12px;
  font:inherit; color:var(--ink);
  background:var(--panel-2);
  border:1px solid var(--line); border-radius:var(--r-2);
  box-shadow:var(--inset-1);
  transition: border-color var(--t-1) var(--ease), box-shadow var(--t-2) var(--ease),
              background var(--t-1) var(--ease);
}
textarea{ resize:vertical; min-height:calc(var(--ctl) * 1.6); line-height:1.5; }
input:focus,select:focus,textarea:focus{
  outline:none;
  background:var(--panel);
  border-color:var(--accent);
  box-shadow: 0 0 0 3px var(--t3), var(--e1);
}
input[type=color]{ padding:3px; min-height:var(--ctl); cursor:pointer; }
input::placeholder,textarea::placeholder{ color:var(--muted-2); }
select{
  appearance:none; padding-right:34px; cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),
                   linear-gradient(135deg,currentColor 50%,transparent 50%);
  background-position: calc(100% - 17px) calc(50% + 1px), calc(100% - 12px) calc(50% + 1px);
  background-size:5px 5px, 5px 5px; background-repeat:no-repeat;
}

.check{
  display:flex; gap:10px; align-items:flex-start;
  margin-bottom:var(--s-3); font-size:var(--fs-sm); cursor:pointer;
}
.check input{ margin-top:2px; flex:none; width:17px; height:17px; }
.check small{ display:block; color:var(--muted); }
.check-row{ display:flex; flex-wrap:wrap; gap:var(--s-4); }
.check-row .check{ margin:0; }

/* Rejilla determinista: el número de columnas lo decide la plantilla. */
.row-inline{
  display:grid; grid-template-columns:repeat(var(--cols,2),minmax(0,1fr));
  gap:2px var(--s-4); align-items:end;
}
.row-inline.c3{ --cols:3; }
.row-inline.c4{ --cols:4; }
.row-inline > .field.grow{ grid-column:span 2; }
.row-inline > .btn, .row-inline > .check{ margin-bottom:var(--s-4); }

.form-actions{ display:flex; gap:var(--s-3); align-items:center; margin-top:var(--s-5); flex-wrap:wrap; }
.form-wide{ max-width:860px; }
.switch{ margin-top:var(--s-5); font-size:var(--fs-sm); color:var(--muted); text-align:center; }
.logo-preview{ max-height:52px; width:auto; }
.logo-plinth{
  display:grid; place-items:center; padding:10px;
  background:var(--t1); border-radius:var(--r-3); box-shadow:var(--inset-1);
}
.logo-plinth.sm{ width:96px; height:56px; }

/* ══ 4 · PATRONES ═════════════════════════════════════════════════════════ */

/* ── Tablas ───────────────────────────────────────────────────────────── */
.table-wrap{ overflow-x:auto; overscroll-behavior-x:contain; }
.table{ width:100%; border-collapse:collapse; font-size:var(--fs-sm); }
.table th{
  text-align:left; padding:0 10px 8px; border-bottom:1px solid var(--line);
  position:sticky; top:0; background:var(--panel); z-index:1;
}
.table td{ padding:12px 10px; border-bottom:1px solid var(--line-2); vertical-align:top; }
.table tr:last-child td{ border-bottom:0; }
.table tbody tr{ transition:background var(--t-1) var(--ease); }
.table tbody tr:hover{ background:var(--bg-2); }
.table a{ font-weight:600; }
/* Sin opacidad: una fila anulada RECEDE, pero su badge conserva el contraste. */
.row-muted td{ background:var(--bg-2); color:var(--muted); }
.row-muted td:first-child{ box-shadow: inset 2px 0 0 var(--line); }
.w-when{ white-space:nowrap; }

.pager{ display:flex; gap:6px; flex-wrap:wrap; margin-top:var(--s-4); }
.pager a,.pager span{
  min-width:var(--ctl-sm); min-height:var(--ctl-sm);
  display:inline-flex; align-items:center; justify-content:center;
  padding:0 10px; border-radius:var(--r-2);
  border:1px solid var(--line); background:var(--panel);
  font-size:var(--fs-sm); font-weight:650; color:var(--ink-2);
  font-variant-numeric:var(--num);
}
.pager a:hover{ border-color:var(--acc-line); color:var(--acc-ink); text-decoration:none; }
.pager .on{ background:var(--accent); color:var(--on-accent); border-color:var(--accent); }

/* ── Calendario: el momento estrella ──────────────────────────────────── */
.booking-step-panel{
  padding:24px; border-color:var(--line); overflow:hidden;
  box-shadow:0 16px 40px rgba(8,35,62,.075);
}
.booking-step-head{
  display:flex; align-items:center; gap:12px; margin-bottom:22px;
}
.booking-step-head .eyebrow{ display:block; margin-bottom:2px; font-size:10px; }
.booking-step-head h2{ margin:0; color:var(--ink); font-size:21px; letter-spacing:-.02em; }
.booking-step-number{
  display:inline-flex; flex:none; align-items:center; justify-content:center;
  width:36px; height:36px; border:1px solid var(--acc-line); border-radius:12px;
  background:var(--t2); color:var(--acc-ink); font-size:14px; font-weight:750;
}
.booking-time-head{
  padding-bottom:18px; border-bottom:1px solid var(--line-2);
}
.booking-step-head .slots-title{ margin:0; }
.slots-summary{ margin:3px 0 0; color:var(--muted); font-size:12px; }

.cal-head{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:14px; padding:7px; border-radius:14px; background:var(--panel-2);
}
.cal-head strong{ color:var(--ink); font-size:var(--fs-md); font-weight:700; text-transform:capitalize; }
.cal-nav{
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:10px;
  border:1px solid var(--line-2); color:var(--ink-2);
  font-size:var(--fs-lg); line-height:1; font-weight:700;
  background:var(--panel); box-shadow:0 2px 8px rgba(8,35,62,.05);
  transition: transform var(--t-1) var(--ease), border-color var(--t-1) var(--ease);
}
.cal-nav:hover{ transform:translateY(-1px); border-color:var(--acc-line); color:var(--acc-ink); text-decoration:none; }
.cal-nav.disabled{ opacity:.3; box-shadow:none; background:transparent; }

.cal-grid{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:7px; }
.cal-wd{
  padding:4px 0 7px; color:var(--muted); font-size:10px; font-weight:700;
  letter-spacing:.08em; text-align:center; text-transform:uppercase;
}

.cal-cell{
  position:relative; min-height:50px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:5px; border-radius:12px; border:1px solid transparent;
  color:var(--ink-2); font-size:var(--fs-sm);
  transition: transform var(--t-2) var(--ease), box-shadow var(--t-2) var(--ease),
              border-color var(--t-1) var(--ease), background var(--t-1) var(--ease);
}
.cal-cell.blank{ visibility:hidden; }
.cal-day{ font-size:var(--fs-md); font-weight:600; line-height:1; }

/* Día con hueco: ELEVADO. El tinte sale de PHP, así que la señal de
   disponibilidad no desaparece nunca, sea cual sea el color de marca. */
.cal-cell.free{
  background:linear-gradient(180deg, var(--panel), var(--t1));
  border-color:color-mix(in srgb, var(--accent) 20%, var(--line));
  box-shadow:0 3px 10px rgba(8,35,62,.065);
  color:var(--ink); font-weight:650;
}
.cal-cell.free:hover{
  transform:translateY(-2px); border-color:var(--accent);
  box-shadow:0 8px 18px rgba(8,35,62,.12); text-decoration:none;
}
.cal-cell.free:active{ transform:translateY(0) scale(.96); }

/* Día sin hueco: neutro y claramente no interactivo. */
.cal-cell.off{ background:var(--panel-2); box-shadow:none; color:var(--muted-2); }

.cal-cell.today::after{
  content:""; position:absolute; top:6px; right:6px;
  width:6px; height:6px; border-radius:50%; background:var(--accent);
}
.cal-cell.sel{
  background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 86%, #fff), var(--accent));
  color:var(--on-accent); border-color:var(--accent); font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3), 0 10px 22px -9px var(--acc-line);
}
.cal-cell.sel .cal-day{ color:var(--on-accent); }
.cal-cell.sel::after, .cal-cell.sel .cal-bar{ background:var(--on-accent); }

/* Capacidad en BARRA, no en punto: sobrevive al daltonismo y al monocromo. */
.cal-bar{
  display:block; height:3px; border-radius:var(--r-full);
  background:var(--accent); width:40%;
}
.cal-bar.lv1{ width:26%; } .cal-bar.lv2{ width:52%; } .cal-bar.lv3{ width:78%; }
.cal-dot{ display:block; width:5px; height:5px; border-radius:var(--r-full); background:var(--accent); }
.cal-legend{
  display:flex; align-items:center; justify-content:center; gap:18px; flex-wrap:wrap;
  margin:16px 0 0; padding-top:14px; border-top:1px solid var(--line-2);
  color:var(--muted); font-size:var(--fs-2xs);
}
.cal-legend-item{ display:inline-flex; align-items:center; gap:7px; }
.cal-legend .cal-bar.lv1{ width:8px; }
.cal-legend .cal-bar.lv2{ width:16px; }
.cal-legend .cal-bar.lv3{ width:26px; }
.cal-count{ font-size:var(--fs-3xs); font-weight:700; opacity:.8; font-variant-numeric:var(--num); }

/* En el back-end el tinte de marca NO puede significar «ocupado»: la carga
   se dice en grafito y con barra, y el acento sigue queriendo decir «libre». */
.cal-admin .cal-cell.off{ background:var(--panel-2); box-shadow:none; color:var(--ink-2); }
.cal-admin .cal-cell.off:hover{ background:var(--bg-2); text-decoration:none; }
.cal-admin .cal-cell.free{
  background:linear-gradient(180deg, color-mix(in srgb, var(--ink) 7%, var(--panel)), var(--panel));
  color:var(--ink);
}
.cal-admin .cal-cell.sel{ background:var(--accent); color:var(--on-accent); }

/* ── Selector de franjas ──────────────────────────────────────────────── */
.slot-form{ display:grid; gap:18px; }
.qty-row{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s-3); flex-wrap:wrap;
  font-size:var(--fs-sm); font-weight:650;
  padding:12px 14px; background:var(--panel-2);
  border:1px solid var(--line-2); border-radius:12px;
}
.qty-row select{ width:auto; min-width:90px; background:var(--panel); }

.slots-groups{ display:grid; gap:20px; }
.slots-group+.slots-group{ padding-top:18px; border-top:1px solid var(--line-2); }
.slots-group-title{
  margin:0 0 9px; color:var(--muted); font-size:11px; font-weight:700;
  letter-spacing:.09em; text-transform:uppercase;
}
.slots{ display:grid; grid-template-columns:repeat(auto-fill,minmax(108px,1fr)); gap:9px; }
.slot{
  position:relative;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:3px; min-height:64px; padding:10px 8px;
  background:linear-gradient(180deg, var(--panel), var(--panel-2));
  border:1px solid var(--line); border-radius:12px;
  box-shadow:0 3px 10px rgba(8,35,62,.055);
  font:inherit; color:var(--ink); cursor:pointer; text-align:center;
  transition: transform var(--t-2) var(--ease), box-shadow var(--t-2) var(--ease),
              border-color var(--t-1) var(--ease), background var(--t-1) var(--ease);
}
.slot:hover{
  transform:translateY(-2px); border-color:var(--accent); background:var(--t1);
  box-shadow:0 8px 20px rgba(8,35,62,.11);
}
.slot:active{ transform:translateY(0) scale(.97); }
.slot-time{ color:var(--ink); font-size:18px; font-weight:750; line-height:1.1; }
.slot-left{ font-size:11px; color:var(--muted); line-height:1.25; }

/* Franja completa: HUNDIDA y tachada. */
.slot.taken{
  background:var(--bg-2); box-shadow:var(--inset-2);
  border-color:transparent; color:var(--muted); cursor:not-allowed;
}
.slot.taken:hover{ transform:none; border-color:transparent; background:var(--bg-2); box-shadow:var(--inset-2); }
.slot.taken .slot-time{ text-decoration:line-through; text-decoration-thickness:1px; }

/* Alta manual: la franja se elige con radio. :focus-within cierra el agujero
   de accesibilidad de elegir a ciegas con el teclado. */
.slots.pick .slot input{ position:absolute; inset:0; opacity:0; cursor:pointer; margin:0; }
.slots.pick .slot:focus-within{ border-color:var(--accent); box-shadow: 0 0 0 3px var(--t3), var(--e2); }
.slots.pick .slot:has(input:checked){
  background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 86%, #fff), var(--accent));
  color:var(--on-accent); border-color:var(--accent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.3), var(--e2), 0 10px 26px -10px var(--acc-line);
}
.slots.pick .slot:has(input:checked) .slot-left{ color:var(--on-accent); opacity:.85; }
@supports not selector(:has(*)){
  .slots.pick .slot input{
    position:absolute; inset:auto 6px 6px auto; opacity:1;
    appearance:auto; width:16px; height:16px; accent-color:var(--accent);
  }
}

/* ── KPIs ─────────────────────────────────────────────────────────────── */
.kpis{ display:grid; grid-template-columns:repeat(auto-fit,minmax(168px,1fr)); gap:var(--s-3); margin-bottom:var(--s-4); }
.kpi{
  position:relative; display:block; padding:var(--s-4) var(--s-5);
  border:1px solid var(--line); border-radius:var(--r-3);
  background:linear-gradient(180deg, var(--panel), var(--panel-2));
  box-shadow: inset 0 1px 0 var(--rim), var(--e1);
  color:inherit;
  transition: transform var(--t-2) var(--ease), box-shadow var(--t-2) var(--ease), border-color var(--t-1) var(--ease);
}
/* Enlace vs dato se distingue por relieve, sin tocar el marcado. */
a.kpi::after{
  content:""; position:absolute; right:14px; bottom:14px;
  width:7px; height:7px; border-right:2px solid var(--muted-2); border-top:2px solid var(--muted-2);
  rotate:45deg; transition: transform var(--t-2) var(--ease), border-color var(--t-1) var(--ease);
}
a.kpi:hover{ transform:translateY(-2px); border-color:var(--acc-line); box-shadow: inset 0 1px 0 var(--rim), var(--e2); text-decoration:none; }
a.kpi:hover::after{ transform:translate(3px,-3px); border-color:var(--acc-ink); }
.kpi-flat, div.kpi{ background:var(--panel-2); box-shadow:none; border-color:var(--line-2); }
.kpi-num{ display:block; font-size:var(--fs-xl); font-weight:700; letter-spacing:-.025em; line-height:1.1; }
.kpi-lab{ display:block; margin-top:4px; font-weight:600; }
.kpi.warn{
  background:color-mix(in srgb, var(--warn) 10%, var(--panel));
  box-shadow: inset 3px 0 0 var(--warn), var(--e1);
  border-color:color-mix(in srgb, var(--warn) 28%, transparent);
}
.kpi.warn .kpi-num{ color:var(--warn-ink); }

/* ── Listas compactas ─────────────────────────────────────────────────── */
.mini-list{ list-style:none; margin:0; padding:0; }
.mini-list li{
  display:flex; align-items:center; gap:var(--s-2);
  padding:10px 0; border-bottom:1px solid var(--line-2);
}
.mini-list li:last-child{ border-bottom:0; }
.mini-list strong{ display:block; font-size:var(--fs-sm); font-weight:650; }
.mini-list small{ display:block; font-size:var(--fs-2xs); color:var(--muted); }

/* ── Gráfico de carga ─────────────────────────────────────────────────── */
.loadchart{
  display:grid; grid-auto-flow:column; grid-auto-columns:1fr;
  gap:5px; align-items:end; block-size:clamp(140px,22vh,200px);
}
.loadbar{ display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:5px; height:100%; }
.loadbar-n{ font-size:var(--fs-2xs); font-weight:700; color:var(--ink-2); }
.loadbar-fill{
  width:100%; min-height:3px; border-radius:var(--r-1) var(--r-1) 3px 3px;
  background:linear-gradient(180deg, var(--accent), color-mix(in srgb, var(--accent) 58%, var(--panel)));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
  transition:height var(--t-3) var(--ease);
}
.loadbar.zero .loadbar-fill{ background:var(--line); box-shadow:none; }
.loadbar-d{ line-height:1.25; text-align:center; letter-spacing:.04em; }

/* ── Editor semanal ───────────────────────────────────────────────────── */
.week-grid{ display:grid; grid-template-columns:1fr; gap:var(--s-3); margin-bottom:var(--s-4); }
.day-card{ --pad:14px; margin:0; }
.day-card h3{ font-size:var(--fs-sm); margin-bottom:var(--s-3); }
.day-card.is-closed{ background:var(--bg-2); box-shadow:var(--inset-1); }
.range-list{ list-style:none; margin:0 0 var(--s-3); padding:0; display:grid; gap:5px; }
.range-list li{
  display:flex; justify-content:space-between; align-items:center; gap:var(--s-2);
  background:var(--t1); border:1px solid var(--acc-line); border-radius:var(--r-1);
  padding:5px 5px 5px 10px; font-size:var(--fs-sm); font-weight:650;
  font-variant-numeric:var(--num); color:var(--acc-ink);
}
.range-add{ display:grid; grid-template-columns:1fr 1fr auto; gap:5px; align-items:center; }
.range-add input[type=time]{ min-width:0; padding:6px 8px; min-height:var(--ctl-sm); font-size:var(--fs-xs); }
.range-add .btn{ min-height:var(--ctl-sm); padding:0 10px; }
/* Objetivo táctil de 32px con la cruz dibujada en CSS. */
.x{
  position:relative; width:32px; height:32px; flex:none;
  border:0; background:none; cursor:pointer; color:var(--muted);
  border-radius:var(--r-1); font-size:0;
  transition: background var(--t-1) var(--ease), color var(--t-1) var(--ease);
}
.x::before,.x::after{
  content:""; position:absolute; top:50%; left:50%;
  width:12px; height:2px; border-radius:1px; background:currentColor;
}
.x::before{ transform:translate(-50%,-50%) rotate(45deg); }
.x::after{  transform:translate(-50%,-50%) rotate(-45deg); }
.x:hover{ color:var(--danger-ink); background:color-mix(in srgb, var(--danger) 12%, transparent); }

/* ══ 5 · FRONT-END PÚBLICO ════════════════════════════════════════════════ */

/* Columna completa: el pie queda pegado al fondo aunque la página sea corta. */
body.pub{ display:flex; flex-direction:column; }
body.pub .page{ flex:1 0 auto; }
body.pub .site-foot{ flex:none; }

.wrap{ width:100%; max-width:1080px; margin-inline:auto; padding-inline:var(--s-5); }
.page{ padding-block:var(--s-7) var(--s-9); }

.site-head{
  position:sticky; top:0; z-index:20;
  background:var(--glass); backdrop-filter:blur(14px) saturate(180%);
  border-bottom:1px solid var(--line);
}
@supports not (backdrop-filter: blur(1px)){ .site-head{ background:var(--panel); } }
.head-row{ display:flex; align-items:center; justify-content:space-between; gap:var(--s-4); min-height:var(--head-h); }
.brand{ display:flex; align-items:center; gap:var(--s-3); color:var(--ink); min-width:0; }
.brand:hover{ text-decoration:none; }
.brand strong{ display:block; font-size:var(--fs-md); line-height:1.2; font-weight:650; }
.brand small{ display:block; color:var(--muted); font-size:var(--fs-2xs); }
.brand-badge{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; flex:none; border-radius:var(--r-2);
  background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 84%, #fff), var(--accent));
  color:var(--on-accent); font-weight:700; font-size:var(--fs-sm);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.3), var(--e1);
}
.brand-badge.lg{ width:60px; height:60px; border-radius:var(--r-3); font-size:var(--fs-lg); }
.brand-logo{ width:40px; height:40px; object-fit:contain; border-radius:var(--r-1); flex:none; }
.brand-logo.lg{ width:auto; height:44px; max-width:170px; }
.head-nav{ display:flex; align-items:center; gap:var(--s-4); font-size:var(--fs-sm); font-weight:600; }
.head-nav a{ color:var(--ink-2); }
.head-nav a:hover{ color:var(--acc-ink); }
.head-nav .btn{ color:var(--ink-2); }
.who{ color:var(--muted); font-weight:500; }

.language-switcher{ position:relative; color:var(--ink-2); font-size:var(--fs-xs); }
.language-switcher summary{
  display:flex; align-items:center; gap:7px; min-height:36px; padding:7px 10px;
  border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.78);
  cursor:pointer; list-style:none; box-shadow:0 1px 2px rgba(8,35,62,.04);
}
.language-switcher summary::-webkit-details-marker{ display:none; }
.language-switcher summary:hover{ border-color:color-mix(in srgb,var(--accent) 40%,var(--line)); color:var(--acc-ink); }
.language-switcher[open] summary{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.language-menu{
  position:absolute; z-index:80; top:calc(100% + 8px); right:0; min-width:174px;
  padding:6px; border:1px solid var(--line); border-radius:var(--r-2); background:var(--panel);
  box-shadow:var(--e3);
}
.language-menu a{
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:9px 10px; border-radius:9px; color:var(--ink-2); font-weight:600;
}
.language-menu a:hover{ background:var(--panel-2); text-decoration:none; }
.language-menu a.on{ background:var(--accent-soft); color:var(--acc-ink); }
.language-menu small{ color:var(--muted); font-size:10px; letter-spacing:.08em; }
.language-switcher-admin summary{ background:var(--panel); }
.language-switcher-login{ margin-left:auto; }
.language-inline{
  display:inline-flex; align-items:center; gap:7px; min-height:36px; padding:5px 10px;
  border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.82);
  color:var(--muted); font-size:11px; font-weight:750; letter-spacing:.08em;
  box-shadow:0 1px 2px rgba(8,35,62,.04);
}
.language-inline a{ padding:3px 2px; color:var(--muted); text-decoration:none; }
.language-inline a:hover{ color:var(--acc-ink); }
.language-inline a.on{ color:var(--duovia-ink); }
.language-inline-admin{ background:var(--panel); }
.language-inline-login{ margin-left:auto; }
.password-login-page{
  display:grid; grid-template-rows:auto 1fr; align-items:stretch; justify-content:stretch;
  min-height:100vh; padding:0;
}
.password-login-shell{ display:flex; align-items:center; justify-content:center; padding:32px 20px; }

.site-foot{
  border-top:1px solid var(--line); background:var(--panel);
  padding-block:var(--s-5); margin-top:var(--s-8);
}
.foot-row{ display:flex; justify-content:space-between; gap:var(--s-4); flex-wrap:wrap; font-size:var(--fs-sm); color:var(--muted); }

.hero{ margin-bottom:var(--s-7); }
.hero h1{ font-size:var(--fs-3xl); letter-spacing:-.03em; }
.hero.tight{ margin-bottom:var(--s-5); }
.hero .btn{ margin-top:var(--s-2); }
.lede{ font-size:var(--fs-md); color:var(--muted); max-width:62ch; }

.crumbs{ margin-bottom:var(--s-4); color:var(--muted); }
.crumbs a{ color:var(--muted); }
.crumbs a:hover{ color:var(--acc-ink); }
.crumbs span{ margin-inline:.4em; opacity:.5; }

/* ── Tarjetas: ahora SON superficie, no un div desnudo ────────────────── */
.grid.cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(272px,1fr)); gap:var(--s-4); }
.card{
  position:relative; display:flex; flex-direction:column; gap:var(--s-2);
  padding:var(--s-5); margin:0; color:inherit;
  background:linear-gradient(180deg, var(--panel), var(--panel-2));
  border:1px solid var(--line); border-radius:var(--r-4);
  box-shadow: inset 0 1px 0 var(--rim), var(--e1);
  transition: transform var(--t-2) var(--ease), box-shadow var(--t-2) var(--ease), border-color var(--t-2) var(--ease);
  overflow:hidden;
}
.card::after{
  content:""; position:absolute; inset:-1px; border-radius:inherit; pointer-events:none;
  box-shadow:0 14px 40px -12px var(--acc-line); opacity:0;
  transition:opacity var(--t-2) var(--ease);
}
.card:hover{ transform:translateY(-3px); border-color:var(--acc-line); box-shadow: inset 0 1px 0 var(--rim), var(--e3); text-decoration:none; }
.card:hover::after{ opacity:.7; }
.card:active{ transform:translateY(-1px) scale(.995); }
.card h3{ margin:0; }

.service-card{ padding-left:calc(var(--s-5) + 4px); }
.service-card::before{
  content:""; position:absolute; inset:0 auto 0 0; width:4px;
  background:linear-gradient(180deg, var(--accent), color-mix(in srgb, var(--accent) 40%, transparent));
}
.service-top{ display:flex; justify-content:space-between; align-items:baseline; gap:var(--s-3); }
.service-top h3{ margin:0; }
.price{ font-weight:700; color:var(--acc-ink); white-space:nowrap; font-size:var(--fs-lg); }
.meta-row{ display:flex; flex-wrap:wrap; gap:6px; margin-top:var(--s-2); }
.card-cta{ margin-top:auto; padding-top:var(--s-3); font-size:var(--fs-sm); font-weight:700; color:var(--acc-ink); }
.tenant-card{ text-align:center; align-items:center; }
.tenant-card .logo-plinth{ width:100%; height:76px; margin-bottom:var(--s-2); }

.service-head{
  position:relative; padding:0; margin-bottom:var(--s-6); overflow:hidden;
  background:linear-gradient(180deg, var(--t1), var(--panel));
  border:1px solid var(--line); border-radius:var(--r-4);
  box-shadow: inset 0 1px 0 var(--rim), var(--e1);
}
.service-head.has-cover{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,39%);
  min-height:220px;
}
.service-head-copy{
  position:relative; z-index:1; align-self:center; padding:clamp(26px,4vw,42px);
}
.service-head-media{
  position:relative; min-height:220px; overflow:hidden; border-left:1px solid var(--line-2);
}
.service-head-media::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,.16),transparent 35%);
}
.service-head-media img{ display:block; width:100%; height:100%; object-fit:cover; }
.service-head h1{ margin-bottom:.25em; }
.service-head .lede{ margin-bottom:var(--s-3); }

/* ── Reserva: calendario + franjas ────────────────────────────────────── */
.booking-grid{ display:grid; grid-template-columns:minmax(320px,400px) 1fr; gap:22px; align-items:start; }
.booking-calendar-panel .cal-cell{ aspect-ratio:auto; }
.slots-title{ margin-bottom:var(--s-4); }

/* ── Selector de «¿con quién?» ────────────────────────────────────────── */
.who-picker{
  display:flex; flex-wrap:wrap; gap:7px; align-items:center;
  margin-bottom:18px; padding:13px; border:1px solid var(--line-2);
  border-radius:12px; background:var(--panel-2);
}
.who-lab{ font-size:var(--fs-xs); font-weight:700; color:var(--muted);
          text-transform:uppercase; letter-spacing:.07em; flex-basis:100%; margin-bottom:2px; }
.who-opt{
  display:inline-flex; align-items:center; gap:5px;
  min-height:var(--ctl-sm); padding:0 12px; border-radius:var(--r-full);
  border:1px solid var(--line); background:var(--panel);
  font:inherit; font-size:var(--fs-sm); font-weight:600; color:var(--ink-2); cursor:pointer;
  box-shadow: inset 0 1px 0 var(--rim), var(--e0);
  transition: transform var(--t-1) var(--ease), border-color var(--t-1) var(--ease),
              background var(--t-1) var(--ease), color var(--t-1) var(--ease);
}
.who-opt:hover{ transform:translateY(-1px); border-color:var(--acc-line); color:var(--acc-ink); }
.who-opt.on{
  background:var(--accent); color:var(--on-accent); border-color:var(--accent);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 6px 18px -8px var(--acc-line);
}
.who-opt.on .dot{ background:var(--on-accent) !important; }

/* ── Textos largos (política de privacidad) ───────────────────────────── */
.narrow-lg{ max-width:760px; margin-inline:auto; }
.narrow-lg .panel{ padding:var(--s-7) var(--s-6); }
.narrow-lg h2.sub{ margin-top:var(--s-7); }
.narrow-lg li{ margin-bottom:.35em; }
.prose{ color:var(--ink-2); }

/* ── Checkout ─────────────────────────────────────────────────────────── */
.checkout-grid{ display:grid; grid-template-columns:360px 1fr; gap:22px; align-items:start; }
.checkout-main{ display:grid; gap:var(--s-4); min-width:0; }
.summary{
  position:sticky; top:calc(var(--head-h) + var(--s-4));
  background:linear-gradient(180deg, var(--t1), var(--panel) 70%);
  box-shadow: inset 0 1px 0 var(--rim), var(--e3);
}
.booking-summary{ padding:0; overflow:hidden; background:var(--panel); }
.summary-cover{
  position:relative; display:flex; align-items:flex-end; min-height:168px; padding:22px;
  overflow:hidden; background:linear-gradient(135deg,var(--duovia-ink),var(--acc-ink));
}
.summary-cover img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.summary-cover::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(0deg,rgba(4,24,42,.94),rgba(4,24,42,.08) 82%);
}
.summary-cover-copy{ position:relative; z-index:1; }
.summary-cover-copy .eyebrow{ display:block; margin-bottom:5px; color:#f0cf8a; }
.summary-cover-copy h2{
  max-width:16ch; margin:0; color:#fff; font-size:23px; line-height:1.14;
  text-shadow:0 2px 10px rgba(4,24,42,.32);
}
.summary-body{ padding:20px; }
.summary-appointment{
  display:grid; grid-template-columns:56px minmax(0,1fr); gap:13px;
  align-items:center; padding-bottom:17px; border-bottom:1px solid var(--line-2);
}
.summary-date-tile{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-height:64px; border:1px solid var(--acc-line); border-radius:14px;
  background:var(--t1); color:var(--acc-ink);
}
.summary-date-tile strong{ font-size:25px; line-height:1; }
.summary-date-tile span{ margin-top:4px; font-size:10px; font-weight:750; letter-spacing:.09em; text-transform:uppercase; }
.summary-when>strong,.summary-when>span{ display:block; }
.summary-when>strong{ font-size:16px; }
.summary-when>span:not(.summary-time-row){ margin:1px 0 7px; color:var(--muted); font-size:12px; }
.summary-time-row{ display:flex !important; align-items:center; gap:5px; color:var(--ink); font-size:14px; font-weight:650; }
.summary-time-row .icon{ color:var(--acc-ink); }
.summary-time-row small{ margin-left:2px; color:var(--muted); font-size:11px; font-weight:500; }
.summary-detail{
  display:flex; align-items:center; gap:10px; padding:14px 2px;
  border-bottom:1px solid var(--line-2);
}
.summary-detail>.icon{ color:var(--acc-ink); }
.summary-detail span>*{ display:block; }
.summary-detail small{ margin-bottom:1px; color:var(--muted); font-size:10px; letter-spacing:.07em; text-transform:uppercase; }
.summary-detail strong{ font-size:14px; }
.summary-total{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-top:14px; padding:12px 14px; border-radius:12px; background:var(--t1);
}
.summary-total span{ color:var(--muted); font-size:12px; font-weight:650; text-transform:uppercase; letter-spacing:.06em; }
.summary-total strong{ color:var(--acc-ink); font-size:22px; }
.summary-status{
  display:flex; align-items:flex-start; gap:9px; margin-top:16px; padding:12px;
  border:1px solid #ead9ad; border-radius:12px; background:#fff8e8;
}
.summary-status-dot{ flex:none; width:8px; height:8px; margin-top:5px; border-radius:50%; background:var(--duovia-gold); box-shadow:0 0 0 4px rgba(185,130,31,.12); }
.summary-status span>*{ display:block; }
.summary-status strong{ color:#674810; font-size:13px; }
.summary-status small{ margin-top:2px; color:#806630; font-size:11px; line-height:1.35; }
.summary-status.confirmed{ border-color:#b9dfca; background:#edf8f2; }
.summary-status.confirmed .summary-status-dot{ background:var(--ok); box-shadow:0 0 0 4px rgba(15,157,88,.12); }
.summary-status.confirmed strong{ color:var(--ok-ink); }
.summary-status.confirmed small{ color:#37634b; }
.summary-cancel{ display:flex; align-items:center; gap:7px; margin:13px 0 0; color:var(--muted); font-size:12px; }
.summary-cancel .icon{ color:var(--muted-2); }
.booking-summary .back-link{ margin-top:15px; font-size:13px; font-weight:650; }
.summary-list{ margin:0; }
.summary-list > div{
  display:flex; justify-content:space-between; gap:var(--s-4);
  padding:9px 0; border-bottom:1px solid var(--line-2);
}
.summary-list > div:last-child{ border-bottom:0; }
.summary-list dt{ flex:none; padding-top:2px; }
.summary-list dd{ margin:0; text-align:right; font-weight:650; }
.summary-list .total{
  margin-top:var(--s-2); padding:var(--s-3); border-bottom:0;
  background:var(--t1); border-radius:var(--r-2); box-shadow:var(--inset-1);
}
.summary-list .total dd{ color:var(--acc-ink); font-size:var(--fs-xl); font-weight:700; }
.back-link{ display:inline-block; margin-top:var(--s-3); font-size:var(--fs-sm); }

/* El panel enfocado gana peso; el otro RECEDE. */
.auth-pair{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s-4); align-items:start; }
.auth-pair .panel{ margin:0; }
.auth-pair .panel.focus{
  border-color:var(--acc-line); transform:translateY(-2px);
  box-shadow: inset 0 1px 0 var(--rim), var(--e3), 0 10px 30px -14px var(--acc-line);
}
.auth-pair .panel.focus::before{
  content:""; position:absolute; inset:0 0 auto 0; height:3px;
  border-radius:var(--r-4) var(--r-4) 0 0;
  background:linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 35%, transparent));
}
.auth-pair .panel:not(.focus){ background:var(--panel-2); box-shadow:var(--e0); border-color:var(--line-2); }

/* ── Lista de espera ──────────────────────────────────────────────────── */
.waitlist-box{
  margin-top:var(--s-4); padding:var(--s-4);
  background:var(--t1); border:1px dashed var(--acc-line); border-radius:var(--r-3);
}
.waitlist-box h3{ margin:0 0 .25em; font-size:var(--fs-md); }
.waitlist-box form{ display:flex; gap:var(--s-2); flex-wrap:wrap; align-items:center; margin-top:var(--s-3); }
.waitlist-box input[type=text]{ flex:1 1 200px; min-width:0; }

/* ── Confirmación: el pico emocional ──────────────────────────────────── */
.done{
  max-width:600px; margin-inline:auto; text-align:center;
  padding:var(--s-8) var(--s-6); border-radius:var(--r-5);
  background:radial-gradient(120% 80% at 50% -10%, var(--t1), var(--panel) 62%);
  box-shadow: inset 0 1px 0 var(--rim), var(--e4);
}
.done-mark{
  position:relative; width:72px; height:72px; margin:0 auto var(--s-4);
  border-radius:var(--r-full);
  background:radial-gradient(120% 120% at 50% 0, color-mix(in srgb, var(--accent) 88%, #fff), var(--accent));
  box-shadow: 0 12px 36px -10px var(--acc-line), inset 0 1px 0 rgba(255,255,255,.35);
  font-size:0;
}
/* El ✓ se dibuja: queda ópticamente centrado con cualquier fuente. */
.done-mark::after{
  content:""; position:absolute; top:50%; left:50%;
  width:26px; height:13px;
  border-left:3.5px solid var(--on-accent); border-bottom:3.5px solid var(--on-accent);
  border-radius:2px;
  transform:translate(-50%,-62%) rotate(-45deg);
}
@media (prefers-reduced-motion: no-preference){
  .done-mark{ animation:pop 420ms var(--spring) both; }
  @keyframes pop{ from{ transform:scale(.82); opacity:0 } to{ transform:scale(1); opacity:1 } }
}
/* El localizador como talón de embarque troquelado. */
.locator{
  position:relative; margin:var(--s-5) auto; padding:var(--s-4) var(--s-6);
  max-width:340px; background:var(--t1);
  border:2px dashed var(--acc-line); border-radius:var(--r-3);
}
.locator::before,.locator::after{
  content:""; position:absolute; top:50%; translate:0 -50%;
  width:18px; height:18px; border-radius:var(--r-full); background:var(--bg);
}
.locator::before{ left:-10px; } .locator::after{ right:-10px; }
.locator span{ display:block; margin-bottom:4px; }
.locator strong{
  display:block; font-size:var(--fs-2xl); font-weight:700;
  letter-spacing:.16em; margin-right:-.16em; color:var(--acc-ink);
  font-family:var(--mono);
}
.done .summary-list{ text-align:left; margin-bottom:var(--s-5); }
.done-actions{ display:flex; gap:var(--s-2); flex-wrap:wrap; justify-content:center; }

/* ── Mis reservas ─────────────────────────────────────────────────────── */
.booking-list{ display:grid; gap:var(--s-3); }
.booking-row{
  display:grid; grid-template-columns:78px 1fr auto; gap:var(--s-4);
  align-items:center; margin:0; padding-left:calc(var(--pad) + 4px);
}
.booking-row::before{
  content:""; position:absolute; inset:0 auto 0 0; width:4px;
  border-radius:var(--r-4) 0 0 var(--r-4);
  background:linear-gradient(180deg, var(--accent), color-mix(in srgb, var(--accent) 40%, transparent));
}
.booking-when{
  text-align:center; padding:var(--s-2); border-radius:var(--r-2);
  background:var(--t1); box-shadow:var(--inset-1);
}
.booking-when strong{ display:block; font-size:var(--fs-2xs); text-transform:uppercase; letter-spacing:.06em; color:var(--muted); }
.booking-when span{ font-size:var(--fs-lg); font-weight:700; color:var(--acc-ink); }
.booking-info h3{ margin:0 0 2px; }
.booking-info p{ margin:0; }
.booking-side{ display:flex; flex-direction:column; align-items:flex-end; gap:6px; text-align:right; }

/* ══ 6 · BACK-END ═════════════════════════════════════════════════════════ */

body.adm{ display:flex; min-height:100vh; }

.side{
  position:sticky; top:0; z-index:30;
  width:248px; flex:none; height:100vh;
  display:flex; flex-direction:column;
  background:var(--glass); backdrop-filter:blur(14px) saturate(180%);
  border-right:1px solid var(--line);
}
@supports not (backdrop-filter: blur(1px)){ .side{ background:var(--panel); } }
.side-brand{ display:flex; align-items:center; gap:var(--s-3); padding:var(--s-4); border-bottom:1px solid var(--line-2); }
.side-brand strong{ display:block; font-size:var(--fs-sm); line-height:1.25; font-weight:650; }
.side-brand small{ display:block; color:var(--muted); font-size:var(--fs-3xs); }
.side-nav{ flex:1; overflow-y:auto; padding:var(--s-3) var(--s-2); display:flex; flex-direction:column; gap:2px; }
.side-nav a{
  position:relative; display:flex; align-items:center; gap:10px;
  min-height:var(--ctl-sm); padding:0 10px; border-radius:var(--r-2);
  color:var(--ink-2); font-size:var(--fs-sm); font-weight:600;
  transition: background var(--t-1) var(--ease), color var(--t-1) var(--ease);
}
.side-nav a:hover{ background:var(--bg-2); text-decoration:none; }
.side-nav a.on{
  background:var(--t1); color:var(--acc-ink);
  box-shadow: inset 0 0 0 1px var(--acc-line);
}
.side-nav a.on::before{
  content:""; position:absolute; left:0; top:50%; translate:0 -50%;
  width:3px; height:18px; border-radius:0 3px 3px 0; background:var(--accent);
}
.side-nav i{ display:inline-flex; align-items:center; justify-content:center; width:var(--icon); height:var(--icon); flex:none; }
.side-nav svg{ width:var(--icon); height:var(--icon); }
.side-sep{ padding:var(--s-4) 10px var(--s-1); }
.side-foot{ border-top:1px solid var(--line-2); padding:var(--s-3) var(--s-4); font-size:var(--fs-sm); }
.side-web{ display:block; margin-bottom:var(--s-2); font-weight:650; font-size:var(--fs-xs); }
.side-user{ display:flex; align-items:center; justify-content:space-between; gap:var(--s-2); }
.side-user span{ min-width:0; font-size:var(--fs-xs); font-weight:600; }
.side-user small{ display:block; color:var(--muted); font-size:var(--fs-3xs); font-weight:400; overflow:hidden; text-overflow:ellipsis; }

.main{ flex:1; min-width:0; display:flex; flex-direction:column; }
.top{
  position:sticky; top:0; z-index:20;
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--s-4); flex-wrap:wrap; padding:var(--s-3) var(--s-6);
  background:var(--glass); backdrop-filter:blur(14px) saturate(180%);
  border-bottom:1px solid var(--line);
}
@supports not (backdrop-filter: blur(1px)){ .top{ background:var(--panel); } }
.top h1{ margin:0; font-size:var(--fs-lg); }
.top-actions{ display:flex; align-items:center; gap:var(--s-2); }
.main-body{ padding:var(--s-5) var(--s-6) var(--s-9); max-width:1440px; width:100%; margin-inline:auto; }

.cols{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s-4); align-items:start; }
.cols-2-1{ grid-template-columns:1.7fr 1fr; }
.cols-1-2{ grid-template-columns:1fr 1.7fr; }

.share-box{ margin-top:var(--s-4); padding-top:var(--s-4); border-top:1px solid var(--line-2); }
.share-url{
  display:block; padding:10px 12px; background:var(--panel-2);
  border:1px solid var(--line); border-radius:var(--r-2); box-shadow:var(--inset-1);
  font-size:var(--fs-xs); word-break:break-all; color:var(--ink-2);
}

/* ── Agenda ───────────────────────────────────────────────────────────── */
.agenda-grid{ display:grid; grid-template-columns:minmax(380px,420px) minmax(0,1fr); gap:var(--s-5); align-items:start; }
.agenda-calendar-panel{ padding:22px; border-radius:24px; }
.agenda-calendar-panel .cal-head{ margin-bottom:18px; padding:8px; border-radius:16px; }
.agenda-calendar-panel .cal-head strong{ font-size:17px; }
.agenda-calendar-panel .cal-nav{ width:38px; height:38px; border-radius:11px; }
.agenda-calendar-panel .cal-grid{ column-gap:8px; row-gap:10px; }
.agenda-calendar-panel .cal-wd{ padding-bottom:8px; }
.agenda-calendar-panel .cal-cell{
  width:100%; min-width:0; min-height:58px; aspect-ratio:auto;
  gap:4px; overflow:hidden; padding:7px 3px; border-radius:13px;
}
.agenda-calendar-panel .cal-cell.off{
  border-color:#ebe7df; background:#f7f4ee;
}
.agenda-calendar-panel .cal-cell.free{
  border-color:color-mix(in srgb,var(--accent) 24%,var(--line));
}
.agenda-calendar-panel .cal-cell.sel{
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 86%,#fff),var(--accent));
  color:var(--on-accent);
  border-color:color-mix(in srgb,var(--accent) 78%,#fff);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 8px 18px -10px var(--acc-line);
}
.agenda-calendar-panel .cal-day{ font-size:16px; font-weight:700; }
.agenda-calendar-panel .cal-count{
  display:grid; min-width:18px; height:17px; place-items:center; padding-inline:4px;
  border-radius:999px; background:rgba(8,35,62,.07); line-height:1;
}
.agenda-calendar-panel .cal-cell.sel .cal-count{ background:rgba(255,255,255,.18); }
.agenda-calendar-panel .cal-legend{ margin-top:19px; padding-top:17px; line-height:1.5; }
.agenda-list{ list-style:none; margin:0; padding:0; display:grid; gap:var(--s-2); }
.agenda-item{
  position:relative; display:grid; grid-template-columns:66px 1fr auto;
  gap:var(--s-3); align-items:start; padding:var(--s-3) var(--s-3) var(--s-3) calc(var(--s-3) + 4px);
  background:linear-gradient(180deg, var(--panel), var(--panel-2));
  border:1px solid var(--line); border-radius:var(--r-3);
  box-shadow: inset 0 1px 0 var(--rim), var(--e0);
}
.agenda-item::before{
  content:""; position:absolute; inset:0 auto 0 0; width:4px;
  border-radius:var(--r-3) 0 0 var(--r-3);
  background:linear-gradient(180deg, var(--accent), color-mix(in srgb, var(--accent) 40%, transparent));
}
.agenda-item.is-cancelled{ background:var(--bg-2); box-shadow:var(--inset-1); }
.agenda-item.is-cancelled::before{ background:var(--line); }
.agenda-time{ text-align:center; padding:6px; background:var(--t1); border-radius:var(--r-1); box-shadow:var(--inset-1); }
.agenda-time strong{ display:block; font-size:var(--fs-md); font-weight:700; color:var(--acc-ink); }
.agenda-time small{ color:var(--muted); font-size:var(--fs-2xs); }
.agenda-body{ min-width:0; }
.agenda-side{ display:flex; flex-direction:column; align-items:flex-end; gap:5px; }

/* ── Conmutador día / semana ──────────────────────────────────────────── */
.agenda-toolbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--s-4); flex-wrap:wrap; margin-bottom:var(--s-4);
}
.seg{
  display:inline-flex; padding:3px; gap:2px;
  background:var(--panel-2); border:1px solid var(--line); border-radius:var(--r-2);
  box-shadow:var(--inset-1);
}
.seg-opt{
  padding:.35em 1em; border-radius:var(--r-1); font-size:var(--fs-sm);
  font-weight:650; color:var(--ink-2);
}
.seg-opt:hover{ text-decoration:none; color:var(--acc-ink); }
.seg-opt.on{
  background:var(--panel); color:var(--acc-ink);
  box-shadow: inset 0 1px 0 var(--rim), var(--e1);
}
.week-nav{ display:flex; align-items:center; gap:var(--s-3); }
.week-nav strong{ font-size:var(--fs-md); }

/* ── Tablero semanal ──────────────────────────────────────────────────── */
.week-board{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:var(--s-2); align-items:start; }
.week-col{
  background:linear-gradient(180deg, var(--panel), var(--panel-2));
  border:1px solid var(--line); border-radius:var(--r-3);
  box-shadow: inset 0 1px 0 var(--rim), var(--e0);
  padding:var(--s-2); min-height:130px; display:flex; flex-direction:column; gap:5px;
}
.week-col.is-today{ border-color:var(--acc-line); box-shadow: inset 0 1px 0 var(--rim), var(--e2); }
.week-head{ display:flex; align-items:center; justify-content:space-between; gap:4px; padding:2px 4px 6px; }
.week-head a{ display:flex; align-items:baseline; gap:5px; color:var(--ink); }
.week-head a:hover{ text-decoration:none; color:var(--acc-ink); }
.week-wd{ font-size:var(--fs-3xs); text-transform:uppercase; letter-spacing:.07em; color:var(--muted); font-weight:700; }
.week-num{ font-size:var(--fs-md); font-weight:700; font-variant-numeric:var(--num); }
.week-col.is-today .week-num{ color:var(--acc-ink); }
.week-count{
  font-size:var(--fs-3xs); font-weight:700; padding:1px 6px; border-radius:var(--r-full);
  background:var(--t1); color:var(--acc-ink);
}
.week-item{
  display:block; padding:6px 8px; border-radius:var(--r-1);
  background:var(--panel); border:1px solid var(--line-2);
  border-left:3px solid var(--accent); color:var(--ink); font-size:var(--fs-2xs);
  transition: transform var(--t-1) var(--ease), box-shadow var(--t-1) var(--ease);
}
.week-item:hover{ transform:translateY(-1px); box-shadow:var(--e1); text-decoration:none; }
.week-item.is-cancelled{ background:var(--bg-2); border-left-color:var(--line); opacity:.7; }
.week-item.is-cancelled strong{ text-decoration:line-through; }
.week-item strong{ font-variant-numeric:var(--num); }
.week-svc, .week-who{ display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.week-who{ color:var(--muted); }
.week-empty{ text-align:center; color:var(--muted-2); margin:auto 0; }
.week-add{
  margin-top:auto; text-align:center; padding:5px; border-radius:var(--r-1);
  font-size:var(--fs-3xs); font-weight:700; color:var(--muted);
  border:1px dashed var(--line);
}
.week-add:hover{ text-decoration:none; color:var(--acc-ink); border-color:var(--acc-line); }

@media (max-width:1100px){
  .week-board{ grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); }
}

/* ── Filtros ──────────────────────────────────────────────────────────── */
.filters{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:var(--s-3); align-items:end; }
.filters label{ margin:0; min-width:0; }
.filters-actions{ display:flex; gap:var(--s-2); }

.big-name{ font-size:var(--fs-lg); font-weight:650; margin-bottom:2px; }
code.big{ font-size:var(--fs-xl); letter-spacing:.1em; font-weight:700; color:var(--acc-ink); }
.mail-body{
  white-space:pre-wrap; background:var(--panel-2); padding:var(--s-3);
  border:1px solid var(--line-2); border-radius:var(--r-2);
  font-size:var(--fs-2xs); margin:var(--s-2) 0 0;
  max-height:min(260px,45vh); overflow:auto;
}
details summary{ cursor:pointer; font-weight:600; }
details summary::marker{ color:var(--muted); }

/* ── Administración del titular desde la plataforma ──────────────────── */
.owner-access-panel{ margin-top:var(--s-5); overflow:hidden; }
.owner-access-head{ align-items:flex-start; }
.owner-access-head .eyebrow{ display:block; margin-bottom:5px; }
.owner-access-head p{ max-width:650px; margin:7px 0 0; font-size:var(--fs-sm); }
.owner-access-scope{
  display:inline-flex; align-items:center; min-height:31px; padding:6px 10px;
  border:1px solid color-mix(in srgb,var(--ok) 24%,var(--line)); border-radius:999px;
  background:color-mix(in srgb,var(--ok) 8%,var(--panel)); color:var(--ok-ink);
  font-size:var(--fs-3xs); font-weight:750;
}
.owner-access-boundary{
  display:flex; align-items:flex-start; gap:12px; margin:0 calc(var(--pad) * -1) var(--s-5);
  padding:14px var(--pad); border-block:1px solid var(--line-2); background:var(--panel-2);
}
.owner-access-boundary>span{
  display:grid; flex:0 0 40px; width:40px; height:40px; place-items:center;
  border-radius:12px; background:var(--t2); color:var(--acc-ink);
}
.owner-access-boundary p{ margin:0; color:var(--ink-2); font-size:var(--fs-xs); line-height:1.6; }
.owner-access-boundary strong{ display:block; margin-bottom:2px; color:var(--ink); }
.owner-access-form{
  padding:20px; border:1px solid var(--line-2); border-radius:var(--r-3);
  background:var(--panel); box-shadow:var(--e0);
}
.owner-access-form+.owner-access-form{ margin-top:var(--s-4); }
.owner-access-form__title{
  display:flex; align-items:flex-start; justify-content:space-between; gap:18px;
  margin-bottom:var(--s-5); padding-bottom:var(--s-4); border-bottom:1px solid var(--line-2);
}
.owner-access-form__title strong,.owner-access-form__title small{ display:block; }
.owner-access-form__title strong{ color:var(--ink); }
.owner-access-form__title small{ margin-top:3px; color:var(--muted); font-size:var(--fs-2xs); }
.owner-access-state{
  display:inline-flex; flex:none; min-height:27px; align-items:center; padding:4px 9px;
  border-radius:999px; background:var(--bg-2); color:var(--neutral-ink);
  font-size:var(--fs-3xs); font-weight:750;
}
.owner-access-state.is-active{ background:color-mix(in srgb,var(--ok) 10%,var(--panel)); color:var(--ok-ink); }
.owner-access-fields{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.owner-access-fields>.field.grow{ grid-column:auto; }
.owner-access-form__actions{
  display:flex; align-items:center; gap:14px 22px; flex-wrap:wrap;
  padding-top:2px;
}
.owner-access-form__actions .check{ margin:0 auto 0 0; }
.owner-access-form__actions>small{ font-size:var(--fs-2xs); }

/* ── Zona de borrado ──────────────────────────────────────────────────── */
.danger-zone{
  border-color:color-mix(in srgb, var(--danger) 30%, var(--line));
  background:color-mix(in srgb, var(--danger) 5%, var(--panel));
}
.sub.danger{ color:var(--danger-ink); }
.danger-what{ font-size:var(--fs-sm); color:var(--ink-2); }
.danger-zone code{
  background:color-mix(in srgb, var(--danger) 14%, transparent);
  color:var(--danger-ink); padding:.12em .45em; border-radius:var(--r-1); font-weight:700;
}

/* ── Acceso ───────────────────────────────────────────────────────────── */
.login-page{ display:flex; align-items:center; justify-content:center; min-height:100vh; padding:var(--s-5); }
.login-box{ width:100%; max-width:400px; text-align:center; margin:0; padding:var(--s-7) var(--s-6); border-radius:var(--r-5); box-shadow: inset 0 1px 0 var(--rim), var(--e4); }
.login-box .brand-badge{ margin-bottom:var(--s-3); }
.login-box form{ text-align:left; margin-top:var(--s-5); }
.login-box .btn{ width:100%; }

/* Acceso empresarial: marca DUOVIA y formulario en dos planos. */
.admin-login-page{
  --font:"Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  padding:32px; background:#eef2f4;
}
.admin-login-page::before{
  height:100%; opacity:1;
  background:
    radial-gradient(800px 440px at 8% 0%,rgba(185,130,31,.13),transparent 68%),
    radial-gradient(780px 500px at 96% 100%,rgba(21,85,127,.12),transparent 70%);
}
.admin-login-shell{
  display:grid; grid-template-columns:minmax(430px,1.06fr) minmax(390px,.94fr);
  width:min(1080px,100%); min-height:640px; overflow:hidden;
  border:1px solid rgba(8,35,62,.1); border-radius:28px; background:var(--panel);
  box-shadow:0 34px 90px rgba(8,35,62,.17);
}
.admin-login-intro{
  position:relative; display:flex; flex-direction:column; gap:32px; overflow:hidden;
  padding:42px; background:var(--duovia-deep); color:#fff;
}
.admin-login-intro::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(520px 320px at 4% 8%,rgba(21,85,127,.68),transparent 72%),
    radial-gradient(430px 260px at 96% 100%,rgba(185,130,31,.2),transparent 70%);
}
.admin-login-intro>*{ position:relative; z-index:1; }
.admin-login-logo{ display:flex; align-items:center; gap:13px; width:max-content; max-width:100%; }
.admin-login-logo:hover{ text-decoration:none; }
.admin-login-logo .duovia-full-logo{ display:block; width:220px; height:auto; }
.admin-login-product{
  padding-left:13px; border-left:1px solid rgba(255,255,255,.22);
  color:#e6c57f; font-size:14px; font-weight:650;
}
.admin-login-pitch{ max-width:460px; margin-top:6px; }
.admin-login-pitch .eyebrow{ color:#e6c57f; }
.admin-login-pitch h2{
  max-width:12ch; margin:8px 0 15px; color:#fff;
  font-size:clamp(35px,3.2vw,47px); line-height:1.06; letter-spacing:-.045em;
}
.admin-login-pitch p{ max-width:42ch; margin:0; color:#bdccd7; font-size:16px; line-height:1.55; }
.admin-login-benefits{ display:flex; flex-wrap:wrap; gap:9px; margin-top:22px; }
.admin-login-benefits span{
  display:inline-flex; align-items:center; gap:7px; padding:8px 11px;
  border:1px solid rgba(255,255,255,.12); border-radius:999px;
  background:rgba(255,255,255,.06); color:#dce6ed; font-size:12px;
}
.admin-login-benefits .icon{ color:#e6c57f; }
.admin-login-privacy{
  display:flex; align-items:flex-start; gap:14px; margin-top:auto; padding:18px;
  border:1px solid rgba(255,255,255,.12); border-radius:17px;
  background:rgba(255,255,255,.07); box-shadow:0 20px 45px rgba(0,0,0,.14);
  backdrop-filter:blur(10px);
}
.admin-login-privacy-icon{
  display:grid; flex:0 0 42px; width:42px; height:42px; place-items:center;
  border:1px solid rgba(230,197,127,.32); border-radius:13px;
  background:rgba(230,197,127,.1); color:#e6c57f;
}
.admin-login-privacy strong{ display:block; margin:1px 0 5px; color:#fff; font-size:13px; }
.admin-login-privacy p{ max-width:42ch; margin:0; color:#aebfcb; font-size:11px; line-height:1.55; }
.login-box.admin-login-card{
  display:flex; flex-direction:column; justify-content:center;
  max-width:none; padding:clamp(38px,5vw,64px); border:0; border-radius:0;
  background:#fff; box-shadow:none; text-align:left;
}
.admin-login-card-head .eyebrow{ display:block; margin-bottom:7px; color:var(--duovia-gold); }
.admin-login-card-head h1{ margin-bottom:7px; font-size:clamp(31px,3vw,40px); letter-spacing:-.035em; }
.admin-login-card-head p{ margin:0; }
.admin-login-card form{ margin-top:28px; }
.admin-login-card .btn-primary{ background:var(--duovia-ink); box-shadow:0 10px 24px rgba(8,35,62,.16); }
.admin-login-card .btn-primary:hover{ background:#0d3153; }
.admin-login-links{
  display:flex; flex-direction:column; align-items:flex-start; gap:11px;
  margin-top:20px; padding-top:18px; border-top:1px solid var(--line-2); font-size:13px;
}
.admin-login-links a:first-child{ color:var(--duovia-blue); font-weight:650; }
.admin-login-links a:last-child{ color:var(--muted); }

/* ══ 7 · INSTALADOR Y ERRORES ═════════════════════════════════════════════ */
.setup{ max-width:760px; margin-inline:auto; padding:var(--s-7) var(--s-5) var(--s-9); }
.setup h1{ margin-bottom:var(--s-5); }
.setup .btn-lg{ width:auto; }

/* ══ 7.1 · DIRECCIÓN DUOVIA ═══════════════════════════════════════════════
   Superficies tranquilas, jerarquía tipográfica y un único acento útil. */

.sr-only{
  position:absolute!important; width:1px!important; height:1px!important;
  padding:0!important; margin:-1px!important; overflow:hidden!important;
  clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important;
}
.skip-link{
  position:fixed; top:10px; left:10px; z-index:100; padding:10px 14px;
  border-radius:8px; background:var(--duovia-deep); color:#fff;
  transform:translateY(-150%); transition:transform var(--t-1) var(--ease);
}
.skip-link:focus{ transform:translateY(0); }
.eyebrow{
  display:block; margin-bottom:12px; color:var(--duovia-gold);
  font-size:12px; font-weight:700; letter-spacing:.11em; text-transform:uppercase;
}

body::before{
  height:520px; opacity:1;
  background:radial-gradient(760px 360px at 8% -12%, rgba(185,130,31,.11), transparent 72%);
}
.panel,.card,.service-head,.agenda-item,.week-col{
  background:var(--panel); box-shadow:0 12px 35px rgba(8,35,62,.07);
}
.panel{ border-radius:18px; }
input[type=text],input[type=email],input[type=password],input[type=tel],
input[type=number],input[type=date],input[type=time],input[type=datetime-local],
input[type=search],input[type=file],select,textarea{
  background:#fff; box-shadow:none; border-radius:9px;
}
.btn{ border-radius:9px; font-weight:600; }
.btn-primary{
  background:var(--accent); box-shadow:0 8px 18px color-mix(in srgb,var(--accent) 22%,transparent);
}
.btn-primary:hover{ box-shadow:0 10px 24px color-mix(in srgb,var(--accent) 28%,transparent); }
.btn-ghost{ background:#fff; box-shadow:none; }
.btn-ghost:hover{ box-shadow:none; }

/* Cabecera y escaparate público. */
.site-head{ background:rgba(255,255,255,.94); backdrop-filter:blur(16px); }
.duovia-mark{ width:36px; height:36px; flex:none; }
.duovia-lockup{ display:flex; align-items:baseline; gap:7px; }
.duovia-lockup strong{ color:var(--duovia-ink); font-size:18px; letter-spacing:.09em; }
.duovia-lockup small{ color:var(--duovia-gold); font-size:13px; font-weight:600; }
.duovia-official-lockup{ display:flex; align-items:center; gap:12px; }
.duovia-official-lockup img{ display:block; width:128px; height:auto; }
.duovia-official-lockup small{ padding-left:12px; border-left:1px solid rgba(8,35,62,.18); color:var(--duovia-gold); font-size:13px; font-weight:700; }
.brand-by{ color:var(--duovia-gold); font-weight:600; }
.product-home .page{ max-width:1180px; padding-top:0; }
.product-home .site-foot{ background:var(--duovia-deep); border:0; color:#dce6ee; }
.product-home .site-foot a,.product-home .site-foot .muted{ color:#dce6ee; }

.product-hero{
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(390px,.95fr);
  gap:clamp(44px,7vw,92px); align-items:center; padding:clamp(68px,9vw,116px) 0 70px;
}
.product-hero-copy h1{
  max-width:760px; margin-bottom:20px; color:var(--duovia-ink);
  font-size:clamp(42px,5.4vw,72px); line-height:1.04; letter-spacing:-.048em;
}
.product-hero-copy h1 span{ color:var(--duovia-blue); }
.product-hero-copy .lede{ max-width:650px; font-size:clamp(17px,1.3vw,20px); line-height:1.65; }
.hero-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.product-home .btn-primary{ background:var(--duovia-ink); }
.trust-list{
  display:flex; flex-wrap:wrap; gap:12px 24px; margin:27px 0 0; padding:0; list-style:none;
  color:var(--ink-2); font-size:13px; font-weight:600;
}
.trust-list li{ display:flex; align-items:center; gap:7px; }
.trust-list svg{ width:16px; height:16px; color:var(--duovia-gold); }

.product-preview{
  position:relative; padding:25px; border:1px solid #d9e1e8; border-radius:24px;
  background:#fff; box-shadow:0 30px 70px rgba(8,35,62,.14);
}
.product-preview::before{
  content:""; position:absolute; z-index:-1; inset:24px -22px -22px 35px;
  border-radius:24px; background:var(--duovia-gold-soft);
}
.preview-top{ display:flex; justify-content:space-between; gap:16px; padding-bottom:18px; border-bottom:1px solid var(--line-2); }
.preview-top span{ color:var(--muted); font-size:12px; }
.preview-top strong{ color:var(--duovia-ink); }
.preview-kpis{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:18px 0; }
.preview-kpis div{ padding:15px; border-radius:12px; background:#f3f7f9; }
.preview-kpis strong{ display:block; color:var(--duovia-blue); font-size:28px; line-height:1; }
.preview-kpis span{ color:var(--muted); font-size:11px; }
.preview-booking{
  display:grid; grid-template-columns:52px 1fr auto; gap:13px; align-items:center;
  padding:13px 0; border-top:1px solid var(--line-2); font-size:12px;
}
.preview-booking time{ color:var(--duovia-blue); font-weight:700; font-variant-numeric:var(--num); }
.preview-booking span>*{ display:block; }
.preview-booking small{ margin-top:2px; color:var(--muted); }
.preview-booking em{ padding:4px 8px; border-radius:999px; background:#e8f5ef; color:#0a6b3d; font-size:10px; font-style:normal; font-weight:600; }
.preview-booking.muted-row{ color:var(--muted); }

.value-strip{
  display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid var(--line);
  margin-bottom:94px;
}
.value-strip article{ display:flex; gap:15px; padding:28px 24px; }
.value-strip article+article{ border-left:1px solid var(--line); }
.value-strip svg{ flex:none; color:var(--duovia-gold); }
.value-strip strong,.value-strip span{ display:block; }
.value-strip strong{ margin-bottom:4px; color:var(--duovia-ink); font-size:14px; }
.value-strip span{ color:var(--muted); font-size:12px; line-height:1.5; }

.demo-section{ scroll-margin-top:90px; }
.section-heading{ max-width:660px; margin-bottom:32px; }
.section-heading h2,.free-base h2{ color:var(--duovia-ink); font-size:clamp(29px,3vw,42px); letter-spacing:-.035em; }
.section-heading p{ color:var(--muted); font-size:16px; }
.demo-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.demo-grid .tenant-card{
  align-items:flex-start; text-align:left; min-height:270px; padding:24px;
  border-radius:16px; box-shadow:none; transform:none;
}
.demo-grid .tenant-card:hover{ transform:translateY(-3px); box-shadow:0 18px 42px rgba(8,35,62,.11); }
.demo-grid .logo-plinth{
  place-items:center; height:172px; padding:0; overflow:hidden;
  background:#f5f7f8; box-shadow:none;
}
.demo-cover{ display:block; width:100%; height:100%; object-fit:cover; transition:transform 420ms var(--ease); }
.tenant-card:hover .demo-cover{ transform:scale(1.035); }
.demo-grid .tenant-card h3{ margin-top:8px; font-size:19px; }
.demo-card-foot{
  display:flex; justify-content:space-between; gap:12px; width:100%; margin-top:auto; padding-top:18px;
  border-top:1px solid var(--line-2); color:var(--muted); font-size:12px;
}
.demo-card-foot strong{ color:var(--acc-ink); }
.free-base{
  display:grid; grid-template-columns:1.25fr 1fr auto; gap:35px; align-items:center;
  margin-top:84px; padding:42px; border-radius:22px; background:var(--duovia-ink); color:#fff;
}
.free-base .eyebrow{ color:#ebcf94; }
.free-base h2{ margin:0; color:#fff; }
.free-base ul{ margin:0; padding-left:20px; color:#dce6ee; font-size:13px; line-height:2; }
.free-base .btn-primary{ background:var(--duovia-gold); box-shadow:none; white-space:nowrap; }

/* Portada institucional del producto. La función de escaparate queda por
   debajo de la explicación del servicio y nunca representa datos privados.

   Tipografía: la portada usa la misma Poppins autoalojada que el resto del
   producto. Antes forzaba "Segoe UI Variable Text", que sólo existe en
   Windows; fuera de ahí caía a system-ui y la puerta de entrada aparecía con
   otra letra distinta de todo lo que hay detrás, y distinta según el visitante.

   Ritmo: la separación entre bloques sale siempre de --band, no de márgenes
   sueltos, para que la página respire igual en móvil que en escritorio. */
.product-home{
  --band:clamp(60px,6.5vw,100px);
  background:#f6f4ef;
}
.product-home::before{
  height:680px;
  background:
    radial-gradient(760px 420px at 2% 4%,rgba(185,130,31,.12),transparent 70%),
    radial-gradient(820px 440px at 94% 12%,rgba(21,85,127,.08),transparent 72%);
}
.product-home :where(h1,h2,h3,h4){ font-weight:700; letter-spacing:-.03em; }
.product-home .site-head{ border-bottom:1px solid rgba(8,35,62,.1); box-shadow:none; }
.product-home .head-nav>a:not(.btn){ color:var(--duovia-ink); font-weight:650; }
.product-home .head-nav .btn{ border-color:rgba(8,35,62,.2); color:var(--duovia-ink); }

/* La columna de texto pesa más que el panel: con 1.02fr contra 430px el
   titular se quedaba con ~540px y rompía en cuatro líneas desiguales
   («… Una / agenda propia para / tu empresa»). Ahora tiene sitio, y balance
   reparte las líneas en lugar de dejar huérfanas. */
.institutional-hero{
  display:grid; grid-template-columns:minmax(0,1.16fr) minmax(384px,.84fr);
  gap:clamp(40px,5vw,68px); align-items:center;
  padding:var(--band) 0 calc(var(--band) * .78);
}
.institutional-hero-copy h1{
  margin:0 0 22px; color:var(--duovia-ink);
  font-size:clamp(38px,3.7vw,54px); line-height:1.07; letter-spacing:-.038em;
  text-wrap:balance;
}
.institutional-hero-copy .lede{
  max-width:47ch; margin:0; color:#41535f; font-size:clamp(16px,1.1vw,18px); line-height:1.66;
  text-wrap:pretty;
}
.institutional-hero .hero-actions{ margin-top:28px; }
.institutional-hero .btn-primary{ box-shadow:0 12px 28px rgba(8,35,62,.16); }
.institutional-statement{
  display:flex; align-items:center; gap:14px; max-width:610px; margin-top:35px; padding-top:25px;
  border-top:1px solid rgba(8,35,62,.14); color:#52616e;
}
.statement-mark{
  display:grid; flex:0 0 44px; width:44px; height:44px; place-items:center;
  border-radius:13px; background:var(--duovia-gold); color:#fff; font-size:18px; font-weight:800;
  box-shadow:0 10px 24px rgba(185,130,31,.2);
}
.institutional-statement p{ margin:0; font-size:13px; line-height:1.55; }
.institutional-statement strong{ color:var(--duovia-ink); font-size:14px; }

.institutional-system{
  overflow:hidden; border:1px solid rgba(255,255,255,.08); border-radius:26px;
  background:var(--duovia-deep); color:#fff; box-shadow:0 32px 80px rgba(8,35,62,.22);
}
.system-head{
  display:flex; justify-content:space-between; align-items:center; gap:15px; padding:18px 22px;
  border-bottom:1px solid rgba(255,255,255,.09); background:rgba(255,255,255,.035);
}
.system-brand{ display:flex; align-items:center; gap:10px; }
.system-brand img{ display:block; width:102px; height:auto; }
.system-brand em{ padding-left:10px; border-left:1px solid rgba(255,255,255,.2); color:#e5c477; font-size:12px; font-style:normal; font-weight:600; }
.system-status{ display:flex; align-items:center; gap:7px; color:#c3d2dc; font-size:12px; font-weight:600; }
.system-status i,.company-online i{
  width:7px; height:7px; border-radius:50%; background:#2dbb80; box-shadow:0 0 0 4px rgba(45,187,128,.12);
}
.system-title{ padding:31px 30px 20px; }
.system-title .eyebrow{ margin-bottom:9px; color:#e5c477; }
.system-title h2{ margin:0; color:#fff; font-size:clamp(25px,2.6vw,34px); line-height:1.18; }
.system-path{ padding:0 30px 30px; }
.system-path article{
  display:grid; grid-template-columns:48px 1fr; gap:15px; align-items:start; padding:18px;
  border:1px solid rgba(255,255,255,.1); border-radius:16px; background:rgba(255,255,255,.055);
}
.system-icon{
  display:grid; width:48px; height:48px; place-items:center; border-radius:13px;
  background:rgba(229,196,119,.12); color:#e5c477;
}
.system-path small,.system-path strong,.system-path p{ display:block; }
.system-path small{ margin-bottom:4px; color:#9db3c2; font-size:11px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.system-path strong{ color:#fff; font-size:16px; }
.system-path p{ margin:5px 0 0; color:#c3d2dc; font-size:13px; line-height:1.55; }
.system-connector{ position:relative; display:block; width:2px; height:27px; margin-left:41px; background:rgba(229,196,119,.3); }
.system-connector i{ position:absolute; bottom:-1px; left:-3px; width:8px; height:8px; border-radius:50%; background:#e5c477; }
.system-foot{
  display:flex; flex-wrap:wrap; gap:11px 18px; padding:16px 28px;
  border-top:1px solid rgba(255,255,255,.09); background:rgba(255,255,255,.035);
}
.system-foot span{ display:flex; align-items:center; gap:7px; color:#cbd8e1; font-size:12px; font-weight:600; }
.system-foot .icon{ color:#e5c477; }

/* Estas tres frases son la promesa del producto y estaban a 12px entre dos
   bloques pesados. El ordinal pasa a ser elemento gráfico, no una etiqueta. */
.institutional-values{
  display:grid; grid-template-columns:repeat(3,1fr); margin-bottom:var(--band);
  border-block:1px solid rgba(8,35,62,.16);
}
.institutional-values article{ display:grid; grid-template-columns:auto 1fr; gap:18px; padding:34px 30px; }
.institutional-values article+article{ border-left:1px solid rgba(8,35,62,.13); }
.institutional-values article>span{
  color:var(--duovia-gold); font-size:22px; font-weight:700; font-variant-numeric:var(--num);
  letter-spacing:-.02em; line-height:1; opacity:.75;
}
.institutional-values strong{ display:block; margin-bottom:7px; color:var(--duovia-ink); font-size:16px; }
.institutional-values p{ margin:0; color:#5b6874; font-size:13.5px; line-height:1.6; text-wrap:pretty; }

.company-directory{ scroll-margin-top:90px; }
.directory-heading{
  display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:34px; padding-bottom:24px;
  border-bottom:1px solid rgba(8,35,62,.15);
}
.directory-heading .eyebrow{ margin-bottom:8px; }
.directory-heading h2{ margin:0; color:var(--duovia-ink); font-size:clamp(30px,3vw,42px); }
.directory-heading>p{ max-width:440px; margin:0 0 3px; color:#5b6874; font-size:14px; line-height:1.6; }
.institutional-company-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.institutional-company-card{
  align-items:stretch; min-height:0; overflow:hidden; padding:0; border-radius:18px;
  background:#fff; box-shadow:none; text-align:left; transform:none;
}
.institutional-company-card:hover{ transform:translateY(-4px); box-shadow:0 20px 48px rgba(8,35,62,.12); text-decoration:none; }
.company-media{ position:relative; display:grid; width:100%; height:180px; place-items:center; overflow:hidden; background:#edf1f3; }
.company-media .demo-cover{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.company-media::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(4,24,42,.04),rgba(4,24,42,.16)); }
.company-online{
  position:absolute; z-index:1; top:14px; right:14px; display:flex; align-items:center; gap:7px;
  padding:7px 10px; border:1px solid rgba(255,255,255,.55); border-radius:999px;
  background:rgba(255,255,255,.9); color:var(--duovia-ink); font-size:10px; font-weight:700;
  backdrop-filter:blur(8px);
}
.company-card-body{ display:grid; grid-template-columns:30px 1fr auto; gap:12px; align-items:start; padding:20px 20px 14px; }
.company-number{ padding-top:3px; color:var(--duovia-gold); font-size:10px; font-weight:800; letter-spacing:.08em; }
.company-copy strong,.company-copy small{ display:block; }
.company-copy strong{ color:var(--duovia-ink); font-size:18px; }
.company-copy small{ min-height:42px; margin-top:6px; color:#5f6c78; font-size:13px; line-height:1.55; text-wrap:pretty; }
.company-arrow{ color:var(--acc-ink); font-size:21px; transition:transform var(--t-2) var(--ease); }
.institutional-company-card:hover .company-arrow{ transform:translateX(3px); }
.company-card-foot{ margin:0 20px; padding:13px 0 16px 42px; border-top:1px solid var(--line-2); color:#6b7883; font-size:12px; }

.institutional-access{
  display:grid; grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr) auto; gap:36px; align-items:center;
  margin-top:var(--band); padding:clamp(32px,3.4vw,46px); border-radius:22px;
  background:var(--duovia-ink); color:#fff; box-shadow:0 26px 65px rgba(8,35,62,.16);
}
.institutional-access .eyebrow{ color:#ebcf94; }
.institutional-access h2{ max-width:640px; margin:0; color:#fff; font-size:clamp(27px,2.7vw,38px); line-height:1.15; }
.institutional-access p{ max-width:62ch; margin:14px 0 0; color:#c8d5de; font-size:14px; line-height:1.65; text-wrap:pretty; }
.access-options{ display:grid; gap:10px; padding-left:24px; border-left:1px solid rgba(255,255,255,.16); }
.access-options span,.access-options strong,.access-options small{ display:block; }
.access-options span{ position:relative; padding-left:15px; }
.access-options span::before{ content:""; position:absolute; top:7px; left:0; width:5px; height:5px; border-radius:50%; background:#e5c477; }
.access-options strong{ color:#fff; font-size:13.5px; }
.access-options small{ margin-top:2px; color:#a9bccb; font-size:12px; }
.institutional-access .btn{ background:var(--duovia-gold); box-shadow:none; white-space:nowrap; }

/* Acceso de empresa: misma identidad institucional que la portada pública. */
.institutional-login-page{
  --font:"Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  display:grid; grid-template-rows:auto 1fr auto; align-items:stretch; justify-content:stretch;
  min-height:100vh; padding:0; background:#eef2f4;
}
.institutional-login-page::before{
  height:100%; opacity:1;
  background:
    radial-gradient(850px 480px at 0% 5%,rgba(185,130,31,.1),transparent 70%),
    radial-gradient(900px 560px at 100% 100%,rgba(21,85,127,.1),transparent 72%);
}
.login-site-head{
  display:flex; justify-content:space-between; align-items:center; gap:24px;
  min-height:76px; padding:0 max(24px,calc((100vw - 1180px)/2));
  border-bottom:1px solid rgba(8,35,62,.1); background:rgba(255,255,255,.92); backdrop-filter:blur(16px);
}
.login-site-head .brand:hover{ text-decoration:none; }
.login-head-actions{ display:flex; align-items:center; gap:14px; margin-left:auto; }
.institutional-login-shell{
  display:grid; grid-template-columns:minmax(0,1.12fr) minmax(390px,.88fr); gap:0;
  width:min(1120px,calc(100% - 48px)); height:min(650px,calc(100vh - 170px)); min-height:560px;
  margin:clamp(22px,4vh,50px) auto; overflow:hidden;
  border:1px solid rgba(8,35,62,.1); border-radius:26px; background:#fff;
  box-shadow:0 28px 80px rgba(8,35,62,.16);
}
.institutional-login-visual{
  position:relative; min-width:0; min-height:100%; overflow:hidden; background:#102a3f;
}
.institutional-login-visual>img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:52% center; }
.institutional-login-visual::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(0deg,rgba(3,24,43,.95) 0%,rgba(3,24,43,.62) 34%,rgba(3,24,43,.06) 72%);
}
.institutional-login-visual__copy{ position:absolute; z-index:1; inset:auto 46px 43px; max-width:490px; }
.institutional-login-visual__copy .eyebrow{ margin-bottom:12px; color:#edcd86; }
.institutional-login-visual__copy h1{
  max-width:12ch; margin:0 0 14px; color:#fff;
  font-size:clamp(38px,3.7vw,51px); line-height:1.03; letter-spacing:-.048em;
}
.institutional-login-visual__copy p{ max-width:44ch; margin:0; color:#d3dee5; font-size:15px; line-height:1.58; }
.login-box.institutional-login-card{
  display:flex; flex-direction:column; justify-content:center;
  position:relative; width:100%; max-width:none; margin:0; overflow:hidden; padding:clamp(38px,4.5vw,54px);
  border:0; border-radius:0; background:#fff; box-shadow:none; text-align:left;
}
.login-box.institutional-login-card::before{ content:none; }
.institutional-login-card-head .eyebrow{ margin-bottom:9px; }
.institutional-login-card-head h2{ margin:0 0 9px; color:var(--duovia-ink); font-size:clamp(32px,3vw,40px); letter-spacing:-.04em; }
.institutional-login-card-head p{ margin:0; color:#697681; font-size:13px; }
.institutional-login-card form{ margin-top:28px; }
.institutional-login-card .field>span{ color:var(--duovia-ink); font-size:12px; font-weight:650; }
.institutional-login-card input{ min-height:48px; border-color:#cfd7de; background:#fbfcfc; }
.institutional-login-card .btn{ min-height:50px; background:var(--duovia-ink); box-shadow:0 11px 25px rgba(8,35,62,.16); }
.institutional-login-card .btn:hover{ background:#0d3153; }
.institutional-login-links{
  display:flex; flex-direction:column; gap:11px; margin-top:20px; padding-top:19px;
  border-top:1px solid var(--line-2); color:#75818b; font-size:11px;
}
.institutional-login-links>a{ color:var(--duovia-blue); font-size:12px; font-weight:650; }
.institutional-login-links span a{ color:var(--duovia-ink); font-weight:650; }
.login-site-foot{
  display:flex; justify-content:space-between; gap:20px; padding:18px max(24px,calc((100vw - 1180px)/2));
  border-top:1px solid rgba(8,35,62,.1); color:#73808b; font-size:10px;
}
.login-site-foot span:first-child{ color:var(--duovia-ink); font-weight:750; letter-spacing:.04em; }

/* Página pública de cada empresa. */
body.tenant-public{
  --font:"Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
}
.tenant-public :where(h1,h2,h3,h4){ font-weight:680; letter-spacing:-.025em; }
.tenant-public .slot-time{ font-weight:700; letter-spacing:-.015em; }
.tenant-public .cal-day{ font-weight:650; }
.tenant-public .page{ max-width:1120px; }
.tenant-public .hero{ max-width:760px; }
.tenant-public .hero h1{ color:var(--ink); }
.tenant-public .card{ box-shadow:none; border-radius:15px; }
.tenant-public .card:hover{ box-shadow:0 15px 36px rgba(8,35,62,.1); }
.tenant-public .site-foot{
  margin-top:clamp(52px,7vw,88px); padding:0;
  border-top:1px solid rgba(255,255,255,.1); background:#03182b; color:#dce6ed;
}
.tenant-public .site-foot .wrap{ max-width:1120px; }
.tenant-footer-row{
  display:flex; align-items:center; justify-content:space-between; gap:36px;
  min-height:96px; padding-block:20px;
}
.tenant-footer-business{ display:grid; gap:5px; min-width:0; }
.tenant-footer-business strong{ color:#fff; font-size:12px; font-weight:750; letter-spacing:.025em; }
.tenant-footer-business>span{ color:#8199a9; font-size:11px; }
.tenant-footer-nav{ display:flex; align-items:center; justify-content:flex-end; gap:24px; font-size:11px; }
.tenant-footer-nav a{ color:#dce6ed; font-weight:650; }
.tenant-footer-nav a:hover{ color:#fff; text-decoration:none; }
.tenant-footer-powered{ color:#8199a9; white-space:nowrap; }
.tenant-footer-powered a{ margin-left:3px; color:#e7c67c; }
.tenant-footer-private{
  display:inline-flex; align-items:center; gap:8px; min-height:38px; padding:8px 13px;
  border:1px solid rgba(255,255,255,.18); border-radius:10px; background:rgba(255,255,255,.06);
  white-space:nowrap;
}
.tenant-hero{
  position:relative; display:flex; align-items:flex-end; min-height:360px;
  margin-bottom:64px; overflow:hidden; border:1px solid var(--line); border-radius:24px;
  background:linear-gradient(135deg,var(--t1),#fff); box-shadow:0 22px 55px rgba(8,35,62,.1);
}
.tenant-hero>img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.tenant-hero::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg,rgba(4,24,42,.96) 0%,rgba(4,24,42,.78) 42%,rgba(4,24,42,.1) 78%);
  opacity:0;
}
.tenant-hero.has-cover::after{ opacity:1; }
.tenant-hero-copy{ position:relative; z-index:1; max-width:610px; padding:clamp(32px,5vw,58px); }
.tenant-hero-copy h1{ margin-bottom:12px; font-size:clamp(36px,5vw,58px); letter-spacing:-.04em; }
.tenant-hero-copy p{ max-width:52ch; margin:0; color:var(--muted); }
.tenant-hero-copy .lede{ margin-bottom:12px; color:var(--ink-2); font-size:18px; }
.tenant-hero.has-cover .tenant-hero-copy h1,.tenant-hero.has-cover .tenant-hero-copy p{ color:#fff; }
.tenant-hero.has-cover .tenant-hero-copy .lede{ color:#dfe8ee; }
.tenant-hero.has-cover .eyebrow{ color:#ebcf94; }
.tenant-services-head{ margin-bottom:24px; }
.tenant-services-head h2{ font-size:clamp(26px,3vw,36px); }

.customer-auth-shell{
  display:grid; grid-template-columns:minmax(330px,.92fr) minmax(390px,1.08fr);
  width:100%; max-width:980px; min-height:590px; margin:20px auto 0;
  border-radius:24px; box-shadow:0 24px 64px rgba(8,35,62,.13);
}
.customer-auth-shell:not(.has-cover){ display:block; max-width:540px; min-height:0; box-shadow:none; }
.customer-auth-visual{
  position:relative; min-height:100%; overflow:hidden;
  border-radius:24px 0 0 24px; background:var(--duovia-deep); color:#fff;
}
.customer-auth-visual>img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.customer-auth-visual::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(0deg,rgba(4,24,42,.94),rgba(4,24,42,.06) 68%);
}
.customer-auth-visual>div{ position:absolute; z-index:1; inset:auto 34px 34px; }
.customer-auth-visual h2{ margin:0; color:#fff; font-size:28px; }
.customer-auth-visual p{ margin:8px 0 0; color:#dfe8ee; }
.customer-auth-visual .eyebrow{ color:#ebcf94; }
.customer-auth-card{
  margin:0; padding:clamp(30px,4vw,48px); border-radius:0 24px 24px 0;
  box-shadow:none; display:flex; flex-direction:column; justify-content:center;
}
.customer-auth-shell:not(.has-cover) .customer-auth-card{ border-radius:22px; box-shadow:0 20px 55px rgba(8,35,62,.1); }
.customer-auth-card h1{ font-size:clamp(30px,3vw,40px); letter-spacing:-.035em; }
.customer-auth-card>p{ margin-bottom:24px; }
.customer-auth-card form{ margin-top:4px; }
.customer-auth-card .switch{ line-height:1.7; }
.customer-auth-shell.is-compact{ max-width:900px; min-height:480px; }

.account-hero{
  position:relative; min-height:280px; display:flex; align-items:flex-end; overflow:hidden;
  margin-bottom:48px; border:1px solid var(--line); border-radius:24px;
  background:linear-gradient(135deg,var(--t1),#fff); box-shadow:0 20px 50px rgba(8,35,62,.1);
}
.account-hero>img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.account-hero::after{ content:""; position:absolute; inset:0; opacity:0; background:linear-gradient(90deg,rgba(4,24,42,.95),rgba(4,24,42,.58) 58%,transparent); }
.account-hero.has-cover::after{ opacity:1; }
.account-hero>div{ position:relative; z-index:1; padding:clamp(28px,5vw,52px); }
.account-hero h1{ font-size:clamp(32px,4vw,48px); }
.account-hero.has-cover h1,.account-hero.has-cover .lede{ color:#fff; }
.account-hero.has-cover .eyebrow{ color:#ebcf94; }

.cover-settings{ display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.7fr); gap:var(--s-4); align-items:start; }
.cover-current{ margin:0; }
.cover-preview{ display:block; width:100%; max-width:360px; aspect-ratio:16/9; object-fit:cover; border:1px solid var(--line); border-radius:12px; }
.cover-current .check{ margin-top:8px; }
.auth-single{ max-width:690px; }
.auth-tabs{ display:flex; gap:4px; padding:4px; margin-bottom:22px; border-radius:11px; background:var(--bg-2); }
.auth-tabs a{ flex:1; padding:9px 12px; border-radius:8px; color:var(--muted); text-align:center; font-size:13px; font-weight:600; }
.auth-tabs a:hover{ text-decoration:none; color:var(--acc-ink); }
.auth-tabs a.on{ background:#fff; color:var(--acc-ink); box-shadow:0 2px 8px rgba(8,35,62,.08); }
.auth-intro{ margin-bottom:20px; }
.auth-help{ padding-top:16px; border-top:1px solid var(--line-2); color:var(--muted); font-size:12px; }

/* Back-end sobrio; el color del negocio queda reservado a las acciones. */
.adm{ background:#f4f6f7; }
.side{ background:var(--duovia-deep); border:0; backdrop-filter:none; }
.side-brand{ border-color:rgba(255,255,255,.1); color:#fff; }
.side-brand .brand-badge{ background:var(--duovia-gold); box-shadow:none; }
.side-brand small,.side-sep,.side-user small{ color:#91a4b4; }
.side-nav a{ color:#c8d3dc; }
.side-nav a:hover{ background:rgba(255,255,255,.07); color:#fff; }
.side-nav a.on{ background:rgba(255,255,255,.1); color:#fff; box-shadow:none; }
.side-nav a.on::before{ background:var(--duovia-gold); }
.side-foot{ border-color:rgba(255,255,255,.1); color:#fff; }
.side-foot a{ color:#dce6ee; }
.side-action button{
  display:flex; align-items:center; gap:10px; width:100%; min-height:38px; padding:0 10px;
  border:0; border-radius:12px; background:transparent; color:#ebcf94;
  font:inherit; font-size:13px; font-weight:600; text-align:left; cursor:pointer;
}
.side-action button:hover{ background:rgba(255,255,255,.07); }
.side-action i{ display:inline-flex; width:20px; }
.top{ background:rgba(255,255,255,.94); }
.support-banner{
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:12px 24px; border-bottom:1px solid #e5c77f; background:#fff5da; color:#62440a;
  font-size:12px;
}
.support-banner strong{ display:block; font-size:13px; }
.support-banner p{ margin:2px 0 0; }
.commercial-banner{
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  margin:0 0 18px; padding:13px 16px; border:1px solid #e5c77f;
  border-radius:14px; background:#fff8e8; color:#62440a; font-size:12px;
}
.commercial-banner strong{ display:block; margin-bottom:2px; font-size:13px; }
.commercial-banner-blocked{ border-color:#e6b5b5; background:#fff0f0; color:#743232; }
.support-gate{ max-width:720px; margin:30px auto; }
.support-gate .panel{ padding:34px; }
.support-notice{ margin:22px 0; padding:17px 18px; border-left:4px solid var(--duovia-gold); background:#fff8e8; color:#62440a; }
.support-notice p{ margin:4px 0 0; font-size:13px; }
.audit-head>div p{ margin:3px 0 0; }
.filter-inline{ min-width:240px; }
.filter-inline label{ margin:0; }

/* ══ 8 · RESPONSIVE ═══════════════════════════════════════════════════════ */

@media (min-width:430px){ .cal-cell{ aspect-ratio:1/1; } }
@media (min-width:1080px){ .week-grid{ grid-template-columns:repeat(7,minmax(0,1fr)); } }
@media (min-width:1100px){ .kpi-hero{ grid-column:span 2; } .kpi-hero .kpi-num{ font-size:var(--fs-3xl); } }

@media (max-width:820px){
  .admin-login-page{ align-items:stretch; padding:0; background:#fff; }
  .admin-login-shell{ grid-template-columns:1fr; min-height:100vh; border:0; border-radius:0; box-shadow:none; }
  .admin-login-intro{ min-height:108px; justify-content:center; padding:24px; }
  .admin-login-pitch,.admin-login-privacy{ display:none; }
  .login-box.admin-login-card{ justify-content:flex-start; padding:38px 24px 48px; }
}

@media (max-width:1000px){
  .booking-grid,.checkout-grid,.agenda-grid,.cols,.cols-2-1,.cols-1-2{ grid-template-columns:1fr; }
  .booking-grid{ width:100%; max-width:720px; margin-inline:auto; }
  .summary{ position:static; }
  .auth-pair{ grid-template-columns:1fr; }
  .product-hero{ grid-template-columns:1fr; }
  .product-preview{ max-width:660px; }
  .customer-auth-shell{ grid-template-columns:minmax(280px,.8fr) minmax(380px,1.2fr); }
  .free-base{ grid-template-columns:1fr 1fr; }
  .free-base .btn{ justify-self:start; }
  .institutional-hero{ grid-template-columns:1fr; }
  .institutional-system{ width:100%; max-width:680px; }
  .institutional-company-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .institutional-access{ grid-template-columns:1fr 1fr; }
  .institutional-access .btn{ justify-self:start; }
}

@media (max-width:900px){
  .institutional-login-shell{
    grid-template-columns:1fr; gap:0; width:min(680px,calc(100% - 40px));
    height:auto; min-height:0;
  }
  .institutional-login-visual{ min-height:340px; }
  .institutional-login-visual__copy{ inset:auto 34px 32px; }
  .institutional-login-visual__copy h1{ max-width:15ch; }
  .login-box.institutional-login-card{ width:100%; max-width:none; }
}

@media (max-width:860px){
  body.adm{ flex-direction:column; padding-bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom)); }
  .side{
    position:fixed; inset:auto 0 0 0; top:auto; width:100%; height:auto;
    flex-direction:row; align-items:stretch;
    border-right:0; border-top:1px solid rgba(255,255,255,.1);
    box-shadow:0 -8px 24px -12px rgba(8,35,62,.45);
    padding-bottom:env(safe-area-inset-bottom); z-index:40;
  }
  .side-brand,.side-foot{ display:none; }
  .side-nav{
    flex-direction:row; overflow-x:auto; padding:var(--s-1);
    gap:2px; scrollbar-width:none;
  }
  .side-nav::-webkit-scrollbar{ display:none; }
  .side-nav a{
    flex-direction:column; gap:3px; min-width:66px; min-height:56px;
    justify-content:center; font-size:var(--fs-3xs); text-align:center; padding:4px;
  }
  .side-nav a.on::before{ inset:0 auto auto 50%; translate:-50% 0; width:20px; height:3px; border-radius:0 0 3px 3px; }
  .side-sep{ display:none; }
  .top{ padding-inline:var(--s-4); }
  .main-body{ padding:var(--s-4) var(--s-4) var(--s-7); }
}

@media (max-width:700px){
  :root{ --pad:16px; }
  .wrap{ padding-inline:var(--s-4); }
  .cal-grid{ gap:4px; }
  .agenda-calendar-panel{ padding:16px; border-radius:19px; }
  .agenda-calendar-panel .cal-head{ margin-bottom:14px; }
  .agenda-calendar-panel .cal-grid{ column-gap:5px; row-gap:7px; }
  .agenda-calendar-panel .cal-wd{ font-size:9px; letter-spacing:.05em; }
  .agenda-calendar-panel .cal-cell{ min-height:49px; padding-inline:2px; border-radius:10px; }
  .agenda-calendar-panel .cal-day{ font-size:15px; }
  .booking-grid{ gap:16px; }
  .booking-step-panel{ padding:18px 14px; }
  .booking-step-head{ margin-bottom:18px; }
  .booking-step-number{ width:34px; height:34px; border-radius:11px; }
  .booking-step-head h2{ font-size:20px; }
  .booking-time-head{ padding-bottom:15px; }
  .booking-calendar-panel .cal-cell{ min-height:46px; border-radius:10px; }
  .service-head{ margin-bottom:18px; }
  .service-head.has-cover{ grid-template-columns:1fr; min-height:0; }
  .service-head-copy{ padding:22px 20px; }
  .service-head-media{
    grid-row:1; min-height:170px; max-height:190px;
    border-left:0; border-bottom:1px solid var(--line-2);
  }
  .service-head-media::after{ background:linear-gradient(0deg,rgba(4,24,42,.13),transparent 55%); }
  .booking-row{ grid-template-columns:66px 1fr; }
  .booking-side{ grid-column:1/-1; flex-direction:row; align-items:center; justify-content:space-between; text-align:left; }
  .agenda-item{ grid-template-columns:58px 1fr; }
  .agenda-side{ grid-column:1/-1; flex-direction:row; align-items:center; justify-content:space-between; }
  .foot-row{ flex-direction:column; gap:var(--s-2); }
  .tenant-footer-row{ align-items:flex-start; flex-direction:column; gap:20px; padding-block:27px; }
  .tenant-footer-nav{ width:100%; justify-content:flex-start; flex-wrap:wrap; gap:14px 20px; }
  .tenant-footer-powered{ order:3; width:100%; }
  .brand small{ display:none; }
  .done{ padding:var(--s-6) var(--s-4); }
  .tenant-hero{ min-height:340px; margin-bottom:48px; border-radius:18px; }
  .tenant-hero::after{ background:linear-gradient(0deg,rgba(4,24,42,.96),rgba(4,24,42,.2) 88%); }
  .tenant-hero-copy{ padding:28px 24px; }
  .customer-auth-shell{ grid-template-columns:1fr; min-height:0; margin-top:4px; box-shadow:0 18px 48px rgba(8,35,62,.12); }
  .customer-auth-visual{ min-height:220px; border-radius:20px 20px 0 0; }
  .customer-auth-visual>div{ inset:auto 24px 24px; }
  .customer-auth-card{ border-radius:0 0 20px 20px; padding:28px 24px; }
  .customer-auth-shell:not(.has-cover) .customer-auth-card{ border-radius:20px; }
  .account-hero{ min-height:270px; border-radius:18px; }
  .cover-settings{ grid-template-columns:1fr; }
  .product-hero{ padding:54px 0; gap:44px; }
  .product-hero-copy h1{ font-size:clamp(38px,12vw,54px); }
  .value-strip{ grid-template-columns:1fr; margin-bottom:68px; }
  .value-strip article{ padding:20px 4px; }
  .value-strip article+article{ border-left:0; border-top:1px solid var(--line); }
  .demo-grid{ grid-template-columns:1fr; }
  .free-base{ grid-template-columns:1fr; padding:30px 24px; }
  .institutional-hero{ padding:54px 0 58px; gap:40px; }
  .institutional-hero-copy h1{ font-size:clamp(38px,10vw,51px); }
  .institutional-values{ grid-template-columns:1fr; margin-bottom:68px; }
  .institutional-values article{ padding:20px 4px; }
  .institutional-values article+article{ border-left:0; border-top:1px solid rgba(8,35,62,.13); }
  .directory-heading{ align-items:start; flex-direction:column; gap:12px; }
  .institutional-company-grid{ grid-template-columns:1fr; }
  .institutional-access{ grid-template-columns:1fr; margin-top:62px; padding:30px 24px; }
  .access-options{ padding:18px 0 0; border-top:1px solid rgba(255,255,255,.16); border-left:0; }
  .institutional-login-shell{ margin:32px auto; }
  .institutional-login-visual__copy h1{ font-size:clamp(36px,8vw,47px); }
  .support-banner{ align-items:flex-start; padding:12px 16px; }

  /* Modo tarjeta: se acaba el arrastrar-y-buscar en el móvil. */
  .table-cards, .table-cards tbody, .table-cards tr, .table-cards td{ display:block; }
  .table-cards thead{ position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .table-cards tr{
    padding:var(--s-3); margin-bottom:var(--s-2);
    border-radius:var(--r-3); background:var(--panel-2);
    box-shadow: inset 0 1px 0 var(--rim), var(--e1);
  }
  /* Cada celda es un bloque «etiqueta encima, valor debajo»: así da igual
     cuántos elementos lleve dentro (strong + br + span), no hay emparejamiento
     que se pueda descuadrar. */
  .table-cards td{ border:0; padding:5px 0; }
  .table-cards td + td{ border-top:1px solid var(--line-2); }
  .table-cards td[data-l]::before{
    content:attr(data-l); display:block; margin-bottom:1px;
    font-size:var(--fs-3xs); text-transform:uppercase;
    letter-spacing:.07em; color:var(--muted); font-weight:700;
  }
  .table-cards td.right{ text-align:left; padding-top:var(--s-2); }
  .table-cards td:empty{ display:none; }
  .table-cards .row-muted td{ background:none; }
}

@media (max-width:520px){
  .head-nav{ gap:var(--s-3); font-size:var(--fs-xs); }
  .head-nav>a:not(.btn), .head-nav .who{ display:none; }
  /* «Área privada» partía en dos líneas y deformaba la cabecera. */
  .head-nav .btn{ white-space:nowrap; }
  .language-switcher summary{ min-height:34px; padding:6px 9px; }
  .language-switcher summary svg{ display:none; }
  .duovia-lockup small{ display:block; }
  .hero-actions .btn{ width:100%; }
  .product-preview{ padding:18px; border-radius:18px; }
  .tenant-hero{ min-height:360px; }
  .tenant-hero-copy h1{ font-size:38px; }
  .customer-auth-visual{ min-height:190px; }
  .customer-auth-card{ padding:26px 20px; }
  .product-preview::before{ inset:18px -9px -14px 18px; }
  .preview-booking{ grid-template-columns:46px 1fr; }
  .preview-booking em{ grid-column:2; justify-self:start; }
  .free-base{ margin-top:60px; }
  .system-head{ align-items:flex-start; }
  .system-title{ padding:26px 21px 18px; }
  .system-path{ padding:0 21px 24px; }
  .system-foot{ padding:15px 21px; }
  .system-path article{ grid-template-columns:42px 1fr; padding:15px; }
  .system-icon{ width:42px; height:42px; }
  .system-connector{ margin-left:35px; }
  .company-media{ height:170px; }
  .login-site-head{ min-height:68px; padding-inline:17px; }
  .duovia-official-lockup{ gap:8px; }
  .duovia-official-lockup img{ width:105px; }
  .duovia-official-lockup small{ display:block; padding-left:8px; font-size:11px; }
  .institutional-login-shell{ width:calc(100% - 28px); margin:22px auto; gap:0; border-radius:20px; }
  .institutional-login-visual{ min-height:255px; }
  .institutional-login-visual>img{ object-position:48% center; }
  .institutional-login-visual__copy{ inset:auto 22px 22px; }
  .institutional-login-visual__copy h1{ margin-bottom:9px; font-size:32px; }
  .institutional-login-visual__copy p{ font-size:12px; line-height:1.5; }
  .login-box.institutional-login-card{ padding:30px 22px; }
  .login-site-foot{ flex-direction:column; gap:3px; padding:15px 17px; }
  .support-banner{ flex-direction:column; }
  .support-banner .btn{ width:100%; }
  .slots{ grid-template-columns:repeat(auto-fill,minmax(96px,1fr)); }
  .hero h1{ letter-spacing:-.02em; }
  .row-inline{ --cols:1 !important; }
}

@media (max-width:620px){
  .commercial-banner{ align-items:flex-start; flex-direction:column; }
}

@media (max-width:360px){
  .slots{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
  .card:hover,.slot:hover,.cal-cell.free:hover,.kpi:hover,.btn:hover{ transform:none; }
}

/* ══ PUERTA DE ENTRADA · DUOVIA AGENDA ═══════════════════════════════════
   Presentación comercial para empresas, con fotografía editorial y
   acceso a las agendas publicadas en una sección independiente. */
.product-home{
  --agenda-cream:#f8f8f2;
  --agenda-night:#03182b;
  --agenda-night-2:#082d4d;
  --agenda-gold:#e2b45b;
  background:var(--agenda-cream);
}
.product-home::before{ display:none; }
.product-home .page{ max-width:1240px; padding-top:0; }
.product-home .site-head .wrap{ max-width:1240px; }
.product-home .site-head{
  border-bottom-color:rgba(8,35,62,.1);
  background:rgba(248,248,242,.94);
}
.product-home .head-nav .btn{
  border-color:rgba(8,35,62,.16); background:rgba(255,255,255,.62);
}
.product-home .site-foot{
  margin-top:clamp(52px,7vw,88px); padding:0;
  border-top:1px solid rgba(255,255,255,.1); background:var(--agenda-night);
}
.product-home .site-foot .wrap{ max-width:1240px; }
.product-footer-row{
  display:flex; align-items:center; justify-content:space-between; gap:32px;
  min-height:96px; padding-block:20px;
}
.product-footer-brand{ display:flex; align-items:center; gap:12px; flex:none; }
.product-footer-brand:hover{ text-decoration:none; }
.product-footer-brand img{ display:block; width:112px; height:auto; }
.product-footer-brand small{
  padding-left:12px; border-left:1px solid rgba(255,255,255,.2);
  color:#e7c67c; font-size:11px; font-weight:700;
}
.product-footer-nav{ display:flex; align-items:center; justify-content:flex-end; gap:24px; font-size:11px; }
.product-footer-nav>span{ color:#8fa7b7; }
.product-footer-nav a{ color:#dce6ed; font-weight:600; }
.product-footer-nav a:hover{ color:#fff; text-decoration:none; }
.product-footer-private{
  display:inline-flex; align-items:center; gap:8px; min-height:38px; padding:8px 13px;
  border:1px solid rgba(255,255,255,.18); border-radius:10px; background:rgba(255,255,255,.06);
}
.agenda-kicker{
  display:inline-flex; align-items:center; gap:10px;
  color:var(--duovia-gold); font-size:11px; font-weight:700;
  letter-spacing:.14em; line-height:1.4; text-transform:uppercase;
}
.agenda-kicker i{
  display:inline-block; width:22px; height:2px; border-radius:2px;
  background:currentColor;
}

.agenda-home-hero{
  --hero-green:#256252;
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);
  gap:40px clamp(32px,5vw,72px); align-items:center;
  margin-top:40px; padding:0; color:var(--duovia-ink);
}
.agenda-home-hero__copy{ min-width:0; padding:26px 0 26px 8px; }
.agenda-home-hero__copy .agenda-kicker{
  margin-bottom:30px; color:var(--hero-green); font-size:10px; letter-spacing:.13em;
}
.agenda-home-hero__copy .agenda-kicker i{
  width:7px; height:7px; border-radius:50%;
}
.agenda-home-hero__copy h1{
  margin:0 0 25px; color:var(--duovia-ink);
  font-size:clamp(40px,4.2vw,59px); font-weight:500;
  line-height:1.12; letter-spacing:-.055em;
}
.agenda-home-hero__copy h1 span,.agenda-home-hero__copy h1 em{ display:block; }
.agenda-home-hero__copy h1 em{
  margin-top:7px; color:var(--hero-green);
  font-family:Georgia,"Times New Roman",serif; font-size:1.3em;
  font-style:italic; font-weight:400; letter-spacing:-.055em; line-height:1.07;
}
.agenda-home-hero__copy>p{
  max-width:42ch; margin:0; color:#58645f;
  font-size:16px; line-height:1.85; text-wrap:pretty;
}
.agenda-home-hero__actions{
  display:flex; align-items:flex-start; flex-direction:column; gap:15px; margin-top:30px;
}
.agenda-home-hero__actions .btn-primary{
  min-height:54px; gap:24px; padding:14px 23px;
  border:1px solid var(--duovia-ink); border-radius:8px;
  background:var(--duovia-ink); color:#fff; box-shadow:none; font-size:14px; font-weight:500;
}
.agenda-home-hero__actions .btn-primary:hover{
  border-color:var(--hero-green); background:var(--hero-green); color:#fff; box-shadow:none;
}
.agenda-home-hero__actions .btn-primary>span{ font-size:21px; font-weight:400; line-height:1; }
.agenda-home-hero__contact{
  display:inline-flex; align-items:center; gap:10px; min-height:44px;
  color:var(--duovia-ink); font-size:12px; font-weight:500;
  text-decoration:underline; text-underline-offset:5px; text-decoration-color:#b6c0b9;
}
.agenda-home-hero__contact:hover{ color:var(--hero-green); text-decoration-color:currentColor; }
.agenda-home-hero__copy>.agenda-home-hero__note{
  display:flex; align-items:center; gap:8px; margin-top:22px;
  color:#58645f; font-size:11px; line-height:1.6;
}
.agenda-home-hero__note .icon{ --icon:17px; color:var(--hero-green); }
.agenda-home-portrait{
  position:relative; align-self:stretch; min-width:0; min-height:540px;
  overflow:hidden; margin:0; border-radius:12px 90px 12px 12px;
  background:#9c886c;
}
.agenda-home-portrait>img{
  position:absolute; inset:0; display:block; width:100%; height:100%;
  object-fit:cover; object-position:43% center;
}
.agenda-home-portrait::after{
  content:""; position:absolute; inset:45% 0 0;
  background:linear-gradient(180deg,transparent,rgba(12,25,20,.76));
}
.agenda-home-portrait figcaption{
  position:absolute; z-index:1; right:32px; bottom:32px; left:32px;
  display:flex; align-items:flex-start; flex-direction:column; gap:6px; color:#fff;
}
.agenda-home-portrait__rule{ width:34px; height:2px; margin-bottom:9px; background:#ebd9b6; }
.agenda-home-portrait figcaption strong{
  color:#fff; font-size:22px; font-weight:500; line-height:1.3; letter-spacing:-.025em;
}
.agenda-home-portrait figcaption>span:last-child{ font-size:13px; line-height:1.55; color:#fff; }
.agenda-home-benefits{
  grid-column:1/-1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  margin:0; padding:26px 0; list-style:none;
  border-top:1px solid #d5dcd3; border-bottom:1px solid #d5dcd3;
}
.agenda-home-benefits>li{ display:flex; align-items:flex-start; gap:16px; padding:0 30px; }
.agenda-home-benefits>li:first-child{ padding-left:8px; }
.agenda-home-benefits>li:last-child{ padding-right:0; }
.agenda-home-benefits>li+li{ border-left:1px solid #d5dcd3; }
.agenda-home-benefits .icon{ --icon:26px; margin-top:3px; color:var(--hero-green); }
.agenda-home-benefits strong,.agenda-home-benefits span{ display:block; }
.agenda-home-benefits strong{ margin-bottom:6px; color:var(--duovia-ink); font-size:13px; font-weight:600; }
.agenda-home-benefits span{ max-width:32ch; color:#58645f; font-size:11px; line-height:1.65; }

.agenda-businesses{ padding-top:clamp(88px,9vw,132px); scroll-margin-top:88px; }
.agenda-section-heading{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,430px); gap:50px; align-items:end;
  margin-bottom:34px; padding-bottom:28px; border-bottom:1px solid rgba(8,35,62,.14);
}
.agenda-section-heading .agenda-kicker{ margin-bottom:12px; }
.agenda-section-heading h2{
  max-width:760px; margin:0; color:var(--duovia-ink);
  font-size:clamp(37px,4.1vw,55px); line-height:1.04; letter-spacing:-.046em; text-wrap:balance;
}
.agenda-section-heading>p{ margin:0 0 3px; color:#586976; font-size:14px; line-height:1.7; text-wrap:pretty; }
.agenda-business-grid{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); grid-auto-flow:dense; gap:18px; }
.agenda-business-card{
  --card-radius:24px; position:relative; display:block; grid-column:span 5; min-height:280px;
  overflow:hidden; border:1px solid rgba(8,35,62,.12); border-radius:var(--card-radius);
  background:#183a54; color:#fff; box-shadow:0 14px 38px rgba(8,35,62,.09);
  transition:transform var(--t-3) var(--ease),box-shadow var(--t-3) var(--ease);
}
.agenda-business-card:first-child{ grid-column:span 7; grid-row:span 2; min-height:578px; }
.agenda-business-card:nth-child(n+4){ grid-column:span 4; min-height:310px; }
.agenda-business-grid--1 .agenda-business-card:first-child{ grid-column:1/-1; min-height:480px; }
.agenda-business-grid--2 .agenda-business-card:first-child,
.agenda-business-grid--2 .agenda-business-card:nth-child(2){ grid-row:auto; min-height:440px; }
.agenda-business-card:hover{ transform:translateY(-5px); box-shadow:0 28px 65px rgba(8,35,62,.2); text-decoration:none; }
.agenda-business-card__media,.agenda-business-card__veil{ position:absolute; inset:0; display:block; }
.agenda-business-card__media{ background:linear-gradient(145deg,var(--t2),var(--accent)); }
.agenda-business-card__media img{ display:block; width:100%; height:100%; object-fit:cover; transition:transform 850ms var(--ease); }
.agenda-business-card:hover .agenda-business-card__media img{ transform:scale(1.045); }
.agenda-business-card__logo{ width:64% !important; height:64% !important; margin:18%; object-fit:contain !important; }
.agenda-business-card__fallback{ display:grid; width:100%; height:100%; place-items:center; color:var(--on-accent); font-size:50px; font-weight:800; }
.agenda-business-card__veil{
  background:
    linear-gradient(180deg,rgba(3,24,43,.48),transparent 36%),
    linear-gradient(0deg,rgba(3,24,43,.97),rgba(3,24,43,.08) 72%);
}
.agenda-business-card__top{
  position:absolute; z-index:2; top:18px; left:18px; display:flex; align-items:center; gap:8px;
  padding:7px 11px; border:1px solid rgba(255,255,255,.3); border-radius:999px;
  background:rgba(3,24,43,.48); color:#fff; font-size:9px; font-weight:700;
  letter-spacing:.05em; backdrop-filter:blur(12px);
}
.agenda-business-card__top i{ width:7px; height:7px; border-radius:50%; background:#38d08e; box-shadow:0 0 0 4px rgba(56,208,142,.13); }
.agenda-business-card__content{
  position:absolute; z-index:2; right:0; bottom:0; left:0; display:grid;
  grid-template-columns:auto 1fr; gap:12px 16px; align-items:start; padding:24px;
}
.agenda-business-card__number{ padding-top:6px; color:#ebc97f; font-size:10px; font-weight:800; letter-spacing:.12em; }
.agenda-business-card__copy,.agenda-business-card__copy strong,.agenda-business-card__copy small,.agenda-business-card__copy em{ display:block; min-width:0; }
.agenda-business-card__copy strong{ color:#fff; font-size:clamp(20px,2.1vw,29px); line-height:1.12; letter-spacing:-.032em; }
.agenda-business-card__copy small{ max-width:42ch; margin-top:7px; color:#d2dee6; font-size:11px; line-height:1.5; }
.agenda-business-card__copy em{ margin-top:11px; color:#9eb6c6; font-size:9px; font-style:normal; font-weight:650; text-transform:uppercase; letter-spacing:.08em; }
.agenda-business-card__action{
  grid-column:2; display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-top:5px; padding-top:15px; border-top:1px solid rgba(255,255,255,.18);
  color:#fff; font-size:11px; font-weight:650;
}
.agenda-business-card__action b{ display:grid; width:29px; height:29px; place-items:center; border-radius:50%; background:#fff; color:var(--duovia-ink); font-size:14px; transition:transform var(--t-2) var(--ease); }
.agenda-business-card:hover .agenda-business-card__action b{ transform:translateX(3px); }
.agenda-home-empty{ padding:50px; border:1px solid rgba(8,35,62,.1); border-radius:24px; background:#fff; }

.agenda-how{
  display:grid; grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr); gap:clamp(40px,6vw,86px);
  scroll-margin-top:90px;
  margin-top:clamp(88px,10vw,145px); padding:clamp(40px,5vw,68px);
  border:1px solid rgba(8,35,62,.09); border-radius:28px; background:#fff;
  box-shadow:0 25px 70px rgba(8,35,62,.07);
}
.agenda-how__intro .agenda-kicker{ margin-bottom:15px; }
.agenda-how__intro h2{ margin:0; color:var(--duovia-ink); font-size:clamp(34px,3.4vw,47px); line-height:1.05; letter-spacing:-.045em; }
.agenda-how__intro p{ margin:18px 0 0; color:#60717e; font-size:14px; line-height:1.7; }
.agenda-how__steps{ display:grid; grid-template-columns:repeat(3,1fr); }
.agenda-how__steps article{ position:relative; padding:5px 25px 2px; }
.agenda-how__steps article+article{ border-left:1px solid rgba(8,35,62,.11); }
.agenda-how__steps article>span{ position:absolute; top:7px; right:20px; color:#c3cbd1; font-size:10px; font-weight:750; letter-spacing:.1em; }
.agenda-how__icon{ display:grid; width:48px; height:48px; margin-bottom:22px; place-items:center; border-radius:15px; background:#f3ead8; color:#a56f12; }
.agenda-how__steps h3{ margin:0 0 9px; color:var(--duovia-ink); font-size:16px; }
.agenda-how__steps p{ margin:0; color:#657581; font-size:11.5px; line-height:1.65; text-wrap:pretty; }

.agenda-final-cta{
  position:relative; isolation:isolate; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:50px; align-items:end;
  margin-top:clamp(88px,10vw,145px); padding:clamp(38px,5vw,64px);
  overflow:hidden; border-radius:28px; background:var(--agenda-night); color:#fff;
  box-shadow:0 28px 70px rgba(4,24,42,.17);
}
.agenda-final-cta__mark{
  position:absolute; z-index:-1; top:-76px; right:18%;
  color:rgba(226,180,91,.08); font-size:270px; font-weight:800; line-height:1;
}
.agenda-final-cta .agenda-kicker{ margin-bottom:14px; color:#ebc97f; }
.agenda-final-cta h2{ max-width:800px; margin:0; color:#fff; font-size:clamp(32px,4vw,51px); line-height:1.07; letter-spacing:-.044em; text-wrap:balance; }
.agenda-final-cta p{ margin:17px 0 0; color:#adbfcb; font-size:13px; }
.agenda-final-cta__actions{ display:flex; flex-direction:column; align-items:flex-start; gap:15px; }
.agenda-final-cta__actions .btn{ border-color:#e5bb6e; background:#e5bb6e; color:#132c40; white-space:nowrap; }
.agenda-final-cta__actions>a:not(.btn){ color:#d6e1e8; font-size:11px; font-weight:650; }
.agenda-final-cta__actions>a:hover{ text-decoration:none; color:#fff; }

@media (max-width:1080px){
  .agenda-home-hero{ gap:32px; }
  .agenda-home-portrait{ min-height:515px; border-top-right-radius:65px; }
  .agenda-home-benefits>li{ gap:12px; padding-inline:20px; }
  .agenda-how{ grid-template-columns:1fr; }
}

@media (max-width:900px){
  .agenda-home-hero__copy{ padding-left:0; }
  .agenda-home-hero__copy .agenda-kicker{ max-width:28ch; font-size:9px; }
  .agenda-home-hero__copy .agenda-kicker i{ flex:none; }
  .agenda-home-hero__copy h1{ font-size:clamp(32px,4.8vw,43px); }
  .agenda-home-hero__copy>p{ font-size:14px; }
  .agenda-home-portrait figcaption{ right:24px; bottom:25px; left:24px; }
  .agenda-home-portrait figcaption strong{ font-size:20px; }
  .agenda-home-benefits>li{ flex-direction:column; }
  .agenda-section-heading{ grid-template-columns:1fr; gap:16px; }
  .agenda-section-heading>p{ max-width:620px; }
  .agenda-business-card,.agenda-business-card:nth-child(n+4){ grid-column:span 6; min-height:330px; }
  .agenda-business-card:first-child{ grid-column:1/-1; grid-row:auto; min-height:450px; }
  .agenda-business-grid--2 .agenda-business-card:first-child,
  .agenda-business-grid--2 .agenda-business-card:nth-child(2){ min-height:370px; }
  .agenda-final-cta{ grid-template-columns:1fr; align-items:start; gap:30px; }
}

@media (max-width:700px){
  .product-home .page{ padding-inline:20px; }
  .agenda-home-hero{ grid-template-columns:1fr; gap:28px; margin-top:32px; }
  .agenda-home-hero__copy{ padding:8px 0 0; }
  .agenda-home-hero__copy .agenda-kicker{ max-width:none; margin-bottom:24px; font-size:9px; }
  .agenda-home-hero__copy h1{ margin-bottom:22px; font-size:clamp(34px,9.2vw,54px); }
  .agenda-home-hero__copy h1 em{ font-size:1.3em; }
  .agenda-home-hero__copy>p{ max-width:48ch; font-size:14px; }
  .agenda-home-hero__actions{ align-items:center; flex-direction:row; flex-wrap:wrap; gap:8px 24px; margin-top:25px; }
  .agenda-home-hero__actions .btn-primary{ min-height:52px; font-size:13px; }
  .agenda-home-hero__copy>.agenda-home-hero__note{ margin-top:15px; }
  .agenda-home-portrait{ min-height:0; aspect-ratio:1.15; border-radius:10px 60px 10px 10px; }
  .agenda-home-portrait>img{ object-position:center 42%; }
  .agenda-home-portrait figcaption{ right:24px; bottom:24px; left:24px; }
  .agenda-home-benefits{ grid-template-columns:1fr; padding:0; }
  .agenda-home-benefits>li,.agenda-home-benefits>li:first-child,.agenda-home-benefits>li:last-child{
    flex-direction:row; align-items:center; gap:18px; padding:21px 4px;
  }
  .agenda-home-benefits>li+li{ border-left:0; border-top:1px solid #d5dcd3; }
  .agenda-home-benefits .icon{ --icon:25px; margin-top:0; }
  .agenda-home-benefits strong{ margin-bottom:3px; font-size:13px; }
  .agenda-home-benefits span{ max-width:42ch; font-size:11px; }
  .agenda-businesses{ padding-top:78px; }
  .agenda-section-heading{ margin-bottom:24px; padding-inline:5px; }
  .agenda-section-heading h2{ font-size:clamp(35px,10.8vw,48px); }
  .agenda-business-card,.agenda-business-card:first-child,.agenda-business-card:nth-child(n+4),
  .agenda-business-grid--1 .agenda-business-card:first-child,
  .agenda-business-grid--2 .agenda-business-card:first-child,
  .agenda-business-grid--2 .agenda-business-card:nth-child(2){ grid-column:1/-1; min-height:350px; }
  .agenda-business-card__content{ padding:21px; }
  .agenda-business-card__copy strong{ font-size:24px; }
  .agenda-how{ margin-top:80px; padding:34px 24px; border-radius:23px; }
  .agenda-how__steps{ grid-template-columns:1fr; }
  .agenda-how__steps article{ padding:24px 0; }
  .agenda-how__steps article+article{ border-top:1px solid rgba(8,35,62,.11); border-left:0; }
  .agenda-how__steps article>span{ top:28px; right:2px; }
  .agenda-how__icon{ margin-bottom:16px; }
  .agenda-final-cta{ margin-top:80px; padding:38px 24px; border-radius:23px; }
  .agenda-final-cta__actions,.agenda-final-cta__actions .btn{ width:100%; }
  .agenda-final-cta__actions>a:not(.btn){ align-self:center; }
  .product-footer-row{ align-items:flex-start; flex-direction:column; gap:21px; padding-block:28px; }
  .product-footer-nav{ justify-content:flex-start; flex-wrap:wrap; gap:13px 20px; }
  .product-footer-nav>span{ width:100%; }
  .owner-access-fields{ grid-template-columns:1fr; }
  .owner-access-form__actions{ align-items:stretch; flex-direction:column; }
  .owner-access-form__actions .check{ margin-right:0; }
  .owner-access-form__actions .btn{ width:100%; }
}

@media (max-width:520px){
  .product-home .head-row{ gap:10px; }
  .product-home .brand{ flex:none; }
  .product-home .duovia-official-lockup{ align-items:flex-start; flex-direction:column; gap:2px; }
  .product-home .duovia-official-lockup img{ width:90px; }
  .product-home .duovia-official-lockup small{ padding-left:0; border-left:0; font-size:9px; }
  .product-home .head-nav{ gap:8px; }
  .product-home .head-nav .btn{ padding-inline:10px; font-size:11px; }
}

/* ══ 9 · IMPRESIÓN ════════════════════════════════════════════════════════
   done.php es LA página que la gente imprime o guarda en PDF. */
@media print{
  :root{ --panel:#fff; --panel-2:#fff; --bg:#fff; --ink:#000; --muted:#444;
         --e0:none; --e1:none; --e2:none; --e3:none; --e4:none;
         --inset-1:none; --inset-2:none; --rim:transparent; }
  body{ background:#fff; }
  body::before, .site-head, .site-foot, .done-actions, .head-nav,
  .side, .top, .crumbs, .filters, .pager{ display:none !important; }
  .page,.main-body{ padding:0; }
  .panel,.card,.done{ border:1px solid #bbb; box-shadow:none; break-inside:avoid; }
  .done{ max-width:none; }
  .locator strong{ font-size:30pt; color:#000; }
  .table th{ position:static; }
  a[href]::after{ content:""; }
}