/* Lo que comparten las páginas públicas de Dr.: botones, bloque final de contacto,
   foco visible, movimiento reducido y zonas táctiles de 44 px. */

/* Botones (48 px de alto, como pide el plan B) */
.dr-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:12px 22px;
  border-radius:12px;font:600 15px/1.2 'Inter',system-ui,sans-serif;text-decoration:none;cursor:pointer;
  border:1.5px solid transparent;transition:transform .18s,box-shadow .18s,background .18s}
.dr-btn:hover{transform:translateY(-1px)}
.dr-btn-solid{background:#30699b;color:#fff;border-color:#30699b}
.dr-btn-line{background:transparent;color:var(--text);border-color:var(--line)}
.dr-btn-line:hover{border-color:var(--text)}
html[data-theme="dark"] .dr-btn-solid{background:#5e9fd4;color:#0f1a24;border-color:#5e9fd4}

/* Botones debajo del texto de entrada de cada categoría */
.dr-hero-btns{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 8px}

/* «Talk to us» fijo en la barra superior del móvil y en la barra lateral del escritorio */
.dr-talk{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 14px;margin-left:auto;margin-right:10px;
  border-radius:10px;background:#30699b;color:#fff;font:600 13px/1 'Inter',system-ui,sans-serif;text-decoration:none;white-space:nowrap}
html[data-theme="dark"] .dr-talk{background:#5e9fd4;color:#0f1a24}
.dr-talk-side{margin:0 0 14px;width:100%}
.topbar-right .dr-talk{margin:0}

/* Bloque final: la pregunta, el precio, los dos botones y el plazo */
.dr-cta{max-width:640px;margin:0 auto;padding:72px 0 56px;text-align:center}
.dr-cta h2{font-family:'Fraunces',serif;font-size:clamp(26px,4vw,36px);font-weight:600;letter-spacing:-.02em;line-height:1.15;
  margin:0 0 14px;text-wrap:balance}
.dr-cta-price{font-size:16px;line-height:1.55;color:var(--muted);margin:0 auto 26px;max-width:520px}
.dr-cta-btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.dr-cta-note{font-size:14px;line-height:1.55;color:var(--muted);margin:22px auto 0;max-width:480px}

/* Preguntas plegadas */
.dr-faq{max-width:640px;margin:0 auto;padding:0 0 24px;text-align:left}
.dr-faq h3{font-family:'Fraunces',serif;font-size:20px;font-weight:600;margin:0 0 14px;text-align:center}
.dr-faq details{border:1px solid var(--line);border-radius:12px;background:var(--surface);margin:0 0 10px}
.dr-faq summary{cursor:pointer;list-style:none;padding:14px 18px;min-height:48px;display:flex;align-items:center;justify-content:space-between;
  gap:12px;font-size:15px;font-weight:600;color:var(--text)}
.dr-faq summary::-webkit-details-marker{display:none}
.dr-faq summary::after{content:'+';font-size:20px;font-weight:400;color:var(--muted);flex-shrink:0}
.dr-faq details[open] summary::after{content:'\2212'}
.dr-faq details p{margin:0;padding:0 18px 16px;font-size:15px;line-height:1.6;color:var(--muted)}

@media(max-width:560px){
  .dr-cta{padding:48px 0 40px}
  .dr-cta-btns .dr-btn,.dr-hero-btns .dr-btn{width:100%}
}

/* Foco visible en todo lo que se puede pulsar */
a:focus-visible,button:focus-visible,summary:focus-visible,[role="button"]:focus-visible{outline:2px solid #5e9fd4;outline-offset:3px;border-radius:6px}

/* Zonas táctiles de 44 px en pantallas táctiles */
@media(pointer:coarse){
  .lang-btn,.lang-switch button,#lang-switch button{min-width:40px;min-height:44px}
  .pr-more{display:inline-flex;align-items:center;min-height:44px}
  .topbar-chip{min-height:44px;align-items:center}
  .theme-btn{min-height:44px;min-width:44px}
}

/* Quien pide menos movimiento, no lo recibe */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1!important;transform:none!important}
}

/* Inicio: las tres mesas como tarjetas de tamaños distintos */
.desk-cards{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:16px;align-items:stretch}
.desk-card{display:flex;flex-direction:column;gap:10px;padding:26px 24px;border:1px solid var(--line);border-radius:16px;
  background:var(--surface);text-decoration:none;color:var(--text);transition:transform .18s,border-color .18s}
.desk-card:hover{transform:translateY(-2px);border-color:var(--text)}
.desk-card:first-child{padding:32px 28px}
.desk-card-eye{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.desk-card h3{font-family:'Fraunces',serif;font-size:21px;font-weight:600;line-height:1.2;letter-spacing:-.015em;margin:0}
.desk-card p{font-size:15px;line-height:1.6;color:var(--muted);margin:0;flex:1}
.desk-card .desk-link{margin-top:6px}
@media(max-width:860px){.desk-cards{grid-template-columns:1fr}.desk-card:first-child{padding:26px 24px}}

/* Barra superior del inicio en teléfono: marca corta, «Talk to us», idiomas y tema en una fila */
@media(max-width:520px){
  .topbar{padding:10px 16px}
  .topbar-right{gap:6px}
  .tb-long{display:none}
  .topbar-right .dr-talk{padding:0 10px;font-size:12px}
}

/* Una columna de rejilla no se ensancha por una palabra larga (neerlandés) */
.hero-grid>*,.split-grid>*,.split>*{min-width:0}
.hero .chip{flex-wrap:wrap}
h1,h2{overflow-wrap:anywhere}
@media(max-width:420px){.hero h1{font-size:clamp(27px,8.4vw,36px)}}
html[data-theme="dark"] .lang-switch button.on,html[data-theme="dark"] .lang-btn.on{color:#0f1a24}

/* Pasos plegados de la línea de tiempo */
.dr-more{margin-top:8px}
.dr-more>summary{cursor:pointer;list-style:none;min-height:48px;display:flex;align-items:center;font-size:15px;font-weight:600;color:var(--blue)}
.dr-more>summary::-webkit-details-marker{display:none}
.dr-more>summary::before{content:'+';margin-right:10px;font-size:20px;font-weight:400}
.dr-more[open]>summary::before{content:'\2212'}

/* Tarjeta flotante de panel, simulador y contacto: la misma del inicio */
.cta-wrap{text-align:center;padding:80px 0 100px}
.cta-wrap>h2{margin-bottom:36px}
.cta-single-card{
  display:grid;grid-template-columns:1fr 1px 1fr;
  max-width:880px;margin:0 auto;
  border:1px solid rgba(29,29,29,.18);border-radius:20px;
  background:transparent;
  will-change:transform;
  transition:transform 0.45s cubic-bezier(0.16,1,0.3,1),box-shadow 0.45s cubic-bezier(0.16,1,0.3,1);
}
html[data-theme="dark"] .cta-single-card{border-color:rgba(255,255,255,.22)}
.cta-col{padding:44px 48px;text-align:left;display:flex;flex-direction:column}
.cta-divider{background:var(--line);width:1px;margin:32px 0}
.cta-card-eye{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px}
.cta-card-eye.eye-blue{color:var(--blue)}
.cta-card-eye.eye-wa{color:#25D366}
.cta-card-eye.eye-sim{color:var(--green)}
.cta-col h3{font-family:'Fraunces',serif;font-size:22px;font-weight:600;margin-bottom:10px;letter-spacing:-.02em}
.cta-col>p{color:var(--muted);font-size:14px;line-height:1.65;margin-bottom:22px}
.cta-list{list-style:none;margin:0 0 32px;display:flex;flex-direction:column;gap:10px;flex:1}
.cta-list li{font-size:14px;color:var(--muted);display:flex;align-items:flex-start;gap:9px}
.cta-list li::before{content:'·';color:var(--text);font-size:18px;font-weight:700;flex-shrink:0;line-height:1.4}
.cta-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 28px;border-radius:12px;font-size:15px;font-weight:600;letter-spacing:-.01em;
  width:100%;background:transparent;
  transition:background .2s,transform .2s var(--ease)}
.cta-btn:hover{transform:translateY(-1px)}
.cta-btn-blue{border:1.5px solid var(--blue);color:var(--blue)}
.cta-btn-blue:hover{background:rgba(48,105,155,.07)}
.cta-btn-wa{border:1.5px solid #25D366;color:#25D366}
.cta-btn-wa:hover{background:rgba(37,211,102,.07)}
.cta-btn-job{border:1.5px solid var(--blue);color:var(--blue)}
.cta-btn-job:hover{background:rgba(48,105,155,.07)}
.cta-btn-solid{border:1.5px solid var(--text);background:var(--text);color:var(--bg)}
.cta-btn-solid:hover{background:var(--text);opacity:.9}
@media(max-width:860px){
  .cta-single-card{grid-template-columns:1fr;border:none;border-radius:0;background:transparent}
  .cta-single-card:hover{transform:none;box-shadow:none}
}

.dr-cta-wrap{padding:72px 0 56px}
.dr-cta-wrap>h2{font-family:'Fraunces',serif;font-size:clamp(26px,4vw,36px);font-weight:600;letter-spacing:-.02em;line-height:1.15;margin:0 0 14px;text-wrap:balance}
.dr-cta-wrap .dr-cta-price{margin-bottom:32px}
.dr-cta-wrap .cta-btn{width:100%}

/* Enlace para saltar al contenido: solo se ve con el teclado */
.dr-skip{position:absolute;left:12px;top:-60px;z-index:1000;padding:12px 18px;border-radius:10px;background:#30699b;color:#fff;font:600 14px/1 'Inter',system-ui,sans-serif;text-decoration:none}
.dr-skip:focus{top:12px}

/* Panel lateral flotante: el 80 % de la pantalla, con su propio scroll dentro */
.dr-panel{position:fixed;inset:0;z-index:2000}
.dr-panel[hidden]{display:none}
.dr-panel-fondo{position:absolute;inset:0;background:rgba(20,20,20,.28);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);opacity:0;transition:opacity .25s ease}
.dr-panel-caja{position:absolute;top:12px;right:12px;bottom:12px;width:80vw;min-width:360px;max-width:calc(100vw - 24px);display:flex;flex-direction:column;
  background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 80px rgba(0,0,0,.35);overflow:hidden;
  transform:translateX(110%);transition:transform .3s cubic-bezier(.22,1,.36,1)}
.dr-panel.dentro .dr-panel-fondo{opacity:1}
.dr-panel.dentro .dr-panel-caja{transform:none}
.dr-panel-cab{display:flex;align-items:center;gap:14px;padding:10px 12px 10px 20px;border-bottom:1px solid var(--line);flex-shrink:0}
.dr-panel-tit{font-family:'Fraunces',serif;font-size:18px;font-weight:600;margin-right:auto}
.dr-panel-pag{font-size:14px;font-weight:600;color:var(--blue);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.dr-panel-x{width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--text);font-size:24px;line-height:1;cursor:pointer}
.dr-panel-x:hover{border-color:var(--text)}
.dr-panel-cuerpo{position:relative;flex:1;min-height:0}
.dr-panel-marco{position:absolute;inset:0;width:100%;height:100%;border:0;background:var(--bg);opacity:0;transition:opacity .2s}
.dr-panel.listo .dr-panel-marco{opacity:1}
.dr-panel-carga{position:absolute;inset:0;display:grid;place-items:center;margin:0;color:var(--muted);font-size:15px}
.dr-panel.listo .dr-panel-carga{display:none}
@media(max-width:860px){
  .dr-panel-caja{inset:0;width:100%;max-width:none;min-width:0;border-radius:0;border:0}
}
@media(prefers-reduced-motion:reduce){.dr-panel-caja,.dr-panel-fondo{transition:none}}

/* Una mesa dentro del panel: sin barra ni menú lateral */
html.dr-embed .sidebar,html.dr-embed .topbar,html.dr-embed .overlay,html.dr-embed .dr-skip,html.dr-embed .dr-talk{display:none!important}
html.dr-embed main{margin-left:0!important;padding:0 28px!important}

/* Barra de scroll moderna: fina, redondeada y discreta en claro y en oscuro */
*{scrollbar-width:thin;scrollbar-color:rgba(128,128,128,.45) transparent}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(128,128,128,.4);border-radius:999px;border:3px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:rgba(128,128,128,.7);background-clip:content-box}
::-webkit-scrollbar-corner{background:transparent}

/* Espacios: menos aire vertical dentro del panel y en el movil, para que quepa como en la pagina completa */
html.dr-embed section{padding:72px 0}
html.dr-embed .hero{padding-top:64px;padding-bottom:64px}
html.dr-embed .close{padding:84px 0 96px}
@media(max-width:700px){
  section{padding:64px 0}
  .hero{padding-top:48px;padding-bottom:56px}
  .close{padding:80px 0 88px}
}

/* Enlaces de texto con zona táctil de 44 px en el móvil */
@media(max-width:700px){
  a.scroll-cue,a.hero-try,a.pr-more,.pr-aside a,.desk-link{display:inline-flex;align-items:center;min-height:44px}
}

/* Inicio en el movil: los párrafos de apoyo con el mismo tamaño que el resto */
@media(max-width:700px){
  [data-i18n="pr_compare"],[data-i18n="rt_p"],[data-i18n="ow_p"]{font-size:16px;line-height:1.6}
}

/* Barra superior del inicio: «Talk to us» aparte, al final y con otra apariencia que las tres mesas */
.topbar-right .dr-talk{order:99;margin-left:22px;min-height:42px;padding:0 20px;font-size:14px;border-radius:999px;position:relative;
  box-shadow:0 6px 18px rgba(48,105,155,.28)}
.topbar-right .dr-talk::before{content:'';position:absolute;left:-14px;top:50%;width:1px;height:24px;margin-top:-12px;background:var(--line)}
@media(max-width:520px){
  .topbar-right .dr-talk{margin-left:8px;padding:0 12px;font-size:12px;min-height:44px}
  .topbar-right .dr-talk::before{left:-7px;height:20px;margin-top:-10px}
}

/* Cabecera del panel: inicio, las otras mesas, simulador (azul) y contacto (azul, solo el teléfono) */
.dr-panel-cab{flex-wrap:wrap;gap:10px}
.dr-panel-tit{margin-right:6px}
.dr-panel-nav{display:flex;gap:8px;align-items:center}
.dr-panel-sp{flex:1}
.dr-panel-nb,.dr-panel-sim,.dr-panel-tel{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 14px;border-radius:12px;
  font:600 14px/1 'Inter',system-ui,sans-serif;text-decoration:none;cursor:pointer;white-space:nowrap}
.dr-panel-nb{border:1px solid var(--line);background:var(--surface);color:var(--text)}
.dr-panel-nb:hover{border-color:var(--text)}
.dr-panel-sim,.dr-panel-tel{border:1.5px solid var(--blue);background:transparent;color:var(--blue)}
.dr-panel-sim:hover,.dr-panel-tel:hover{background:color-mix(in srgb,var(--blue) 14%,transparent)}
.dr-panel-tel{width:44px;padding:0}
@media(max-width:860px){
  .dr-panel-tit{order:1;margin-right:auto}
  .dr-panel-x{order:2}
  .dr-panel-pag,.dr-panel-sp{display:none}
  .dr-panel-nav{order:3;width:100%;overflow-x:auto;padding-bottom:2px}
  .dr-panel-sim{order:4;flex:1}
  .dr-panel-tel{order:5}
}

.dr-panel-nb.solo{width:44px;padding:0}
