/* ==========================================================================
   responsive.css — Dr. Rodrigo Mata · Dos breakpoints por CSS + móvil
   ≥1100 desktop (header dos líneas) · 900–1099 tablet (una línea + ☰)
   <900 (una columna, sticky off) · ≤640 móvil (header 64 px, barra fija)
   Anchos de QA: 1440 · 1280 · 1100 · 1024 · 900/899 · 820 · 768 · 641/640 ·
   430 · 390 · 360
   ========================================================================== */

/* ---------- < 1100: header de una línea con hamburguesa ---------- */
@media (max-width: 1099px) {
  .site-header__topbar, .site-header__nav { display: none; }
  .site-header__tabbar { display: flex; }
  .site-header__logo { grid-row: 1; }
  .site-header__logo img { height: 24px; }
  .site-header[data-compact="true"] .site-header__logo img { height: 24px; }
  .site-header[data-compact="true"] { box-shadow: none; }
}

/* ---------- < 900: una columna, sticky desactivado ---------- */
@media (max-width: 899px) {
  :root { --section-y: 96px; --section-y-s: 80px; --fs-h3: 28px; }
  [data-sticky] { position: static !important; top: auto !important; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .site-footer__main { align-items: start; padding: 56px 0 44px; }
  .site-footer__address { white-space: normal; align-items: flex-start; }
  .site-footer__address .icon { margin-top: 3px; }
  .lines--hero-home { left: -44%; height: 100%; }
  /* Legal: índice estático arriba, una columna */
  .legal-grid { grid-template-columns: 1fr; }
  .toc { position: static; padding-bottom: 8px; }
  /* Contacto: formulario a una columna, autoridad apilada */
  .contact-form-section__intro { position: static; }
  .contact-form-section { padding: 96px 0; }
  .how-to, .pre-visit, .authority { padding: 96px 0; }
  .authority .container { grid-template-columns: 1fr; }
  .closing { padding: 96px 0; }
  .contact-band__cell { padding: 0 24px; }
  .contact-band__cell:first-child { padding-left: 0; }
  /* Casos: evidencia primero, una columna */
  .case, .case--alt { grid-template-columns: 1fr; }
  .case__media, .case--alt .case__media { order: 0; }
  .case__text { order: 1; }
  .cases { padding: 96px 0; margin-top: 96px; }
  .case { padding: 72px 0; }
  .cases__head { padding-bottom: 56px; margin-bottom: 72px; }
  .cases-intro { padding-top: 96px; }
  .observe, .reviews { padding: 96px 0; }
  .cta-tech { padding-top: 96px; }
  .booking { padding: 96px 0; }
  /* Dr. Rodrigo Mata (UI-02) tablet: año arriba (no sticky), hito a una columna, documento debajo */
  .philo .container { grid-template-columns: 1fr; gap: 24px; }
  .tl-year { grid-template-columns: 1fr; }
  .tl-year__sticky { position: static; padding-bottom: 20px; }
  .tl-year + .tl-year .tl-year__sticky { padding-top: 56px; }
  .tl-year + .tl-year .tl-items { padding-top: 0; }
  .tl-item { grid-template-columns: 1fr; }
  .tl-item__doc { max-width: 260px; }
  .about { padding-top: 96px; }
  .about .container { grid-template-columns: 1fr; grid-template-areas: "head" "media" "body"; }
  .about__media { margin-top: 32px; }
  .rail { padding-top: 80px; }
  .philo, .creds-official { padding: 96px 0; }
  .timeline-section { padding: 96px 0; }
  .gallery { padding-top: 96px; }
  .gallery__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "g1 g3" "g1 g4" "g2 g2"; grid-auto-rows: 260px; }
  .quote-doc { padding: 96px 0; }
  /* Rinoplastia Ultrasónica (UI-03) tablet: comparativa apilada con prefijos, columnas sticky desactivadas */
  .tech__intro, .faq__intro { position: static; }
  .faq__intro { padding: 0; }
  .compare__row--head { display: none; }
  .compare__row { grid-template-columns: 1fr; gap: 10px; }
  .compare__feat { padding-top: 0; }
  .compare__col { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; }
  .compare__ultra { padding-left: 16px; }
  .tech__step { grid-template-columns: 44px 1fr; }
  .whatis, .benefits { padding-top: 96px; }
  .tech { padding: 96px 0; margin-top: 96px; }
  .candid, .compare, .process, .results, .expect, .faq { padding: 96px 0; }
  /* Home (UI-01) tablet: plano crema a todo el ancho hasta la base del retrato, texto debajo */
  .intro .lines { display: none; }
  .intro .container { grid-template-columns: 1fr; gap: 0; }
  .intro__portrait { padding: 56px 0 0; clip-path: inset(-200px -100vw 0 -100vw); }
  .intro__portrait::before { right: -100vw; bottom: 0; }
  .intro__portrait img { max-width: 340px; }
  .intro__text { padding: 56px 0 40px; }
  .whatis--home { padding: 48px 0 96px; }
  .benefits-home { padding-bottom: 96px; }
  .bblocks { margin-top: 110px; }
  .steps { padding: 96px 0; }
  .steps__track::before { display: none; }
  .steps__list { grid-template-columns: 1fr 1fr; gap: 40px 24px; }
  .quote-home { padding: 96px 0; }
}

/* ---------- ≤ 640: móvil ---------- */
@media (max-width: 640px) {
  :root { --section-y: var(--section-y-m); --section-y-s: 56px; --pad-x: 22px; --fs-h3: 24px; --fs-lead: 20px; --fs-quote: 22px; --fs-body: 14.5px; }
  body { padding-bottom: var(--mobile-bar-h); }
  body.no-mobile-bar { padding-bottom: 0; }
  h1, .h1 { font-size: 48px; }
  h2, .h2, .h2--home { font-size: clamp(26px, 8vw, 31px); }

  /* Header móvil: logo 20 px · TEL 44 · ☰ 44 */
  .site-header__inner { display: block; }
  .site-header__tabbar { display: none; }
  .site-header__mobile { display: flex; }
  .site-header__logo { display: none; }
  .site-header__mobile img { height: 20px; width: auto; }
  .hamburger { width: 44px; height: 44px; }

  /* Panel */
  /* T-10: panel compacto; CTA visible sin scroll en 360x740 (scroll como reserva en alturas menores) */
  .nav-panel { padding: 0 22px 18px; }
  .nav-panel__top { height: 60px; }
  .nav-panel__top img { height: 20px; }
  .nav-panel__close { width: 44px; height: 44px; }
  .nav-panel__nav { padding-top: 18px; }
  .nav-panel__nav a { font-size: 22px; padding: 12px 0; min-height: 44px; }
  .nav-panel__foot { margin-top: auto; flex-direction: column; align-items: stretch; gap: 16px; padding-top: 18px; }
  .nav-panel__foot .eyebrow { margin-bottom: 8px; }
  .nav-panel__foot p { font-size: 13px; line-height: 1.55; }
  .nav-panel__tel { margin-top: 6px; font-size: 20px; }
  .nav-panel__aside { align-items: stretch; gap: 10px; }
  .nav-panel__aside .btn { display: flex; min-height: 48px; }
  .nav-panel__social { justify-content: center; gap: 24px; }
  .nav-panel__social a { padding: 15px 0; }

  /* Barra fija */
  .mobile-bar { display: flex; }

  /* Footer móvil */
  .site-footer--overlap .container { padding-top: 0; }
  .site-footer__main { grid-template-columns: 1fr; gap: 0; padding: 44px 0 0; border-top: 0; }
  .site-footer__brand { padding-bottom: 36px; border-bottom: var(--bw) solid var(--b-dark-3); }
  .site-footer__logo { height: 24px; }
  .site-footer__eyebrow { margin: 26px 0 12px; font-size: 9.5px; letter-spacing: .16em; }
  .site-footer__claim { font-size: 17px; line-height: 1.5; }
  .site-footer__contact { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding: 32px 0; border-bottom: var(--bw) solid var(--b-dark-3); }
  .site-footer__contact .site-footer__eyebrow { margin: 0 0 14px; font-size: 9.5px; }
  .site-footer__phone { font-size: 19px; }
  .site-footer__address { margin-top: 12px; font-size: var(--fs-micro); gap: 8px; }
  .site-footer__social { flex-direction: column; gap: 10px; }
  .site-footer__social a { font-size: 13px; padding: 4px 0; }
  .site-footer__social .icon { width: 15px; height: 15px; }
  .site-footer__navrow { padding: 24px 0; }
  .site-footer__nav { gap: 8px 22px; }
  .site-footer__nav a { font-size: 12px; padding: 6px 0; }
  .site-footer__navrow .btn { display: none; }
  .site-footer__legal { flex-direction: column; align-items: flex-start; gap: 12px; padding: 22px 0 28px; }
  .site-footer__legal-links { flex-direction: column; align-items: flex-start; gap: 12px; font-size: 11px; }
  .site-footer__legal-links a, .site-footer__legal-links button { font-size: 11px; }
  .site-footer__credit { font-size: var(--fs-label-s); margin-top: 6px; }
  .site-footer__credit img { height: 13px; }

  /* Formulario móvil */
  .wa-card { padding: 36px 22px 30px; border-radius: 0; }
  .wa-card--overlap { margin: 36px 0 0; }
  .wa-card::before { left: 26px; right: 26px; }
  .wa-card__head .eyebrow { font-size: 9.5px; letter-spacing: .16em; }
  .wa-card__note { display: none; }
  .wa-card__title { font-size: 22px; margin-top: 10px; }
  .wa-form { gap: 26px; margin-top: 30px; }
  .wa-form__row { grid-template-columns: 1fr; gap: 26px; }
  .field__label { font-size: 10px; margin-bottom: 6px; }
  .field__control, select.field__control, textarea.field__control { font-size: 16px; padding: 12px 0; }   /* 16 px: sin zoom iOS */
  .wa-form__actions { grid-template-columns: 1fr; gap: 14px; }
  .wa-form__actions .btn { min-height: 52px; padding: 17px; font-size: var(--fs-label); border-radius: 0; }
  .wa-form__privacy { justify-self: center; border: 0; color: var(--c-teal); border-bottom: var(--bw) solid var(--c-teal-100); }
  .wa-form__legal { text-align: center; font-size: 12px; }

  /* Modal */
  .aviso-dialog { padding: 32px 24px; width: calc(100% - 32px); }
  .aviso-dialog__body { font-size: 14.5px; }

  /* Doctoralia */
  .doctoralia { padding: 56px 0; }
  .doctoralia__row { flex-direction: column; gap: 18px; }
  .doctoralia__sep { display: none; }
  .doctoralia__rating { flex-direction: column; gap: 10px; text-align: center; }
  .doctoralia__count { font-size: 18px; }

  /* Líneas: una composición por sección, trazo 2.2 px */
  .lines path { stroke-width: 2.2; }
  .lines path:nth-child(3) { display: none; }
  .lines--hero-home, .lines--hero-int, .lines--hero-wide { left: auto; right: -170px; bottom: -120px; height: auto; width: 440px; }
  .lines--quote, .lines--corner-br { left: -150px; right: auto; bottom: -140px; width: 320px; }
  .lines--corner-tr { display: none; }
  .btn { min-height: 50px; }

  /* Legal móvil */
  .legal { padding: 56px 0 72px; }
  .legal-body p { font-size: 16px; }
  .legal-lead { font-size: 20px; }
  .toc__list a { min-height: 44px; align-items: center; padding: 10px 0; border-bottom: var(--bw) solid var(--b-200); }
  .toc__list a:last-child { border-bottom: 0; }
  .legal-section { padding: 36px 0 16px; }
  .legal-section h2 { font-size: 24px; }
  .legal-address { padding: 18px 20px; }
  .lines--hero-legal { right: -170px; bottom: -100px; width: 420px; }
  .lines--hero-legal path:nth-child(2) { display: none; }

  /* Contacto móvil */
  .hero-contact { align-items: flex-start; min-height: 0; background-image: linear-gradient(180deg, #585858 0%, #3E3E3E 100%); }
  .hero-contact::before { background: linear-gradient(180deg, rgba(11,11,11,0) 45%, rgba(11,11,11,.92) 100%); }
  .hero-contact .container { display: block; }
  .hero-contact__copy { max-width: none; padding: 40px 0 0; }
  .hero-contact__copy h1 { font-size: 36px; margin-top: 18px; }
  .hero-contact__copy .lead { font-size: 17px; margin-top: 16px; }
  .hero-contact__cta { flex-direction: column; align-items: stretch; gap: 10px; margin-top: 26px; }
  .hero-contact__cta .btn { display: flex; min-height: 52px; }
  .hero-contact__hours { display: none; }
  .hero-contact__photo { display: block; margin: 26px -22px 0; padding: 0; height: 250px; min-width: 0; flex: none; }
  .hero-contact__photo img { position: absolute; right: 10px; bottom: 0; width: 62%; filter: drop-shadow(0 20px 30px rgba(0,0,0,.45)); }
  .hero-contact__hours-mobile { display: flex; position: absolute; left: 22px; bottom: 26px; align-items: flex-start; gap: 8px; font-size: 12px; line-height: 1.55; color: var(--t-on-dark-2); max-width: 46%; }
  .hero-contact__hours-mobile .icon { color: var(--c-teal-100); margin-top: 2px; }
  .lines--hero-contact { left: auto; right: -170px; bottom: -100px; height: auto; width: 420px; }
  .lines--hero-contact path:nth-child(2) { display: none; }
  .contact-band .container { padding-top: 22px; padding-bottom: 40px; }
  .contact-band__grid { display: block; }
  .contact-band__cell { padding: 18px 0; border-left: 0; border-bottom: var(--bw) solid var(--b-dark-2); display: grid; grid-template-columns: 28px 1fr; gap: 12px; align-items: start; }
  .contact-band__cell:last-child { border-bottom: 0; }
  .contact-band__label { display: contents; }
  .contact-band__label .icon { width: 16px; height: 16px; margin-top: 2px; }
  .contact-band__label-text { display: block; font-size: 9px; letter-spacing: .16em; font-weight: var(--fw-semibold); text-transform: uppercase; color: var(--c-teal-300); margin-bottom: 6px; }
  .contact-band__body { grid-column: 2; }
  .contact-band__value { font-size: 18px; padding: 4px 0; line-height: 1.3; }
  .contact-band__text { font-size: 14px; }
  .contact-form-section { padding: 64px 0; }
  .contact-form-section .container { gap: 32px; }
  .contact-form-section__intro { display: flex; flex-direction: column; }
  .contact-form-section__intro .callout { order: 3; margin-top: 22px; padding: 16px 18px; font-size: 13px; }
  .contact-form-section__support { order: 4; margin-top: 18px; }
  .wa-card--contacto { border: var(--bw) solid var(--b-200); box-shadow: var(--sh-card-light); }
  .how-to { padding: 56px 0 64px; }
  .how-to .container { display: flex; flex-direction: column; gap: 24px; }
  .how-to .map-card { order: -1; padding: 10px; }
  .how-to__cta { flex-direction: column; align-items: stretch; margin-top: 26px; }
  .how-to__cta .btn { display: flex; min-height: 52px; }
  .lines--howto { left: -150px; bottom: -140px; width: 320px; }
  .authority { padding: 56px 0 64px; }
  .authority__portrait { margin-top: 28px; order: 2; }
  .authority__portrait::before { left: 14%; right: 14%; }
  .authority__portrait img { width: 68%; }
  .authority__creds { grid-template-columns: 1fr 1fr; gap: 20px 16px; }
  .pre-visit { padding: 64px 0 0; }
  .pre-visit__head { padding-bottom: 28px; }
  .pre-visit__head p { display: none; }
  .pre-visit__grid { gap: 10px; }
  .card-link { min-height: 0; padding: 22px 20px; gap: 16px; }
  .doctoralia--inline { padding: 48px 0 64px; }
  .closing { padding: 64px 0; }
  .closing .container { display: block; }
  .closing__aside { margin-top: 28px; gap: 0; align-items: stretch; }
  .closing__cta { flex-direction: column; align-items: stretch; }
  .closing__cta .btn { display: flex; min-height: 52px; }
  .closing__cta .btn--outline-dark { display: none; }
  .closing__meta { grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 32px; padding-top: 26px; }
  .lines--closing { display: none; }

  /* Casos móvil */
  .hero-cases { min-height: 0; }
  .hero-cases .container { padding-top: 44px; padding-bottom: 40px; }
  .hero-cases h1 { font-size: 38px; margin-top: 18px; }
  .hero-cases .lead { font-size: 17px; margin-top: 16px; }
  .hero-cases__cta { flex-direction: column; align-items: stretch; margin-top: 24px; }
  .hero-cases__cta .btn { display: flex; min-height: 50px; }
  .hero-cases__cta .btn--outline-dark { display: none; }
  .lines--hero-cases { right: -170px; bottom: -140px; width: 420px; }
  .lines--hero-cases path:nth-child(2) { display: none; }
  .cases-intro { padding-top: 56px; }
  .cases-intro .container { gap: 24px; }
  .cases-intro__aside { gap: 14px; padding-top: 0; }
  .cases-intro__links { gap: 8px 24px; }
  .cases { padding: 64px 0; margin-top: 64px; }
  .cases__head { padding-bottom: 0; margin-bottom: 44px; gap: 20px; }
  .cases__head-aside { gap: 14px; }
  .case { padding: 44px 0; gap: 0; }
  .case:first-of-type { padding-top: 0; }
  .case__media { order: 1; }
  .case__text { order: 0; }
  .case__frame { margin: 22px -22px 0; }
  .case__label { font-size: 8.5px; letter-spacing: .16em; padding: 5px 8px; border-radius: 0; }
  .case__meta { padding-top: 10px; font-size: 9.5px; }
  .case__meta .plain { display: none; }
  .case__num span:first-child { font-size: 34px; }
  .case h3 { font-size: 24px; margin-top: 14px; }
  .case__tags { margin-top: 12px; gap: 6px; }
  .case__tags li { font-size: 9.5px; letter-spacing: .12em; padding: 6px 9px; border-radius: 0; }
  .case__desc-label { margin-top: 22px; }
  .case__desc { font-size: 14px; }
  .case__cta { flex-direction: column; align-items: stretch; gap: 8px; margin-top: 22px; }
  .case__cta .btn { display: flex; min-height: 50px; }
  .case__cta .link-cta { align-self: flex-start; }
  .observe { padding: 56px 0 64px; }
  .observe__list { padding: 4px 18px; margin-top: 24px; }
  .observe__item { padding: 18px 0; grid-template-columns: 34px 1fr; gap: 12px; }
  .observe__num { font-size: 17px; }
  .observe__title { font-size: 15px; }
  .observe__text { font-size: 13px; }
  .observe__link { margin-top: 18px; }
  .lines--observe { left: -150px; bottom: -140px; width: 320px; }
  .cta-tech { padding-top: 56px; }
  .cta-tech__card { padding: 32px 22px 28px; }
  .cta-tech__card::before { left: 22px; width: 48px; }
  .cta-tech h2 { font-size: 24px; }
  .cta-tech__actions { align-items: stretch; gap: 10px; }
  .cta-tech__actions .btn { display: flex; min-height: 50px; border-radius: 0; }
  .reviews { padding: 64px 0; }
  .reviews__head { padding-bottom: 22px; gap: 16px; }
  .reviews__grid { gap: 12px; }
  .review { padding: 22px 20px; gap: 14px; }
  .review__text { font-size: 14px; }
  .booking { padding: 64px 0; }
  .booking .container { display: block; }
  .booking__copy > p { margin-top: 18px; font-size: 14.5px; }
  .booking__meta { margin-top: 40px; padding-top: 28px; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
  .booking__phone { font-size: 19px; }
  .booking .wa-card { margin-top: 36px; }

  /* Dr. Rodrigo Mata (UI-02) móvil */
  .hero-doctor { min-height: 0; background: linear-gradient(180deg, #575757 0%, #3C3C3C 100%); }
  .hero-doctor::after { background: linear-gradient(180deg, rgba(11,11,11,0) 50%, rgba(11,11,11,.9) 100%); }
  .hero-doctor .container { display: block; }
  .hero-doctor__copy { padding: 40px 0 0; max-width: none; }
  .hero-doctor h1 { font-size: 36px; margin-top: 18px; }
  .hero-doctor .lead { font-size: 17px; margin-top: 16px; max-width: none; }
  .hero-doctor__cta { margin-top: 26px; }
  .hero-doctor__cta .btn { display: flex; width: 100%; min-height: 50px; }
  .hero-doctor__cta .btn--outline-dark { display: none; }
  .hero-doctor__portrait { margin: 28px 0 0; padding: 0; justify-content: center; min-width: 0; }
  .hero-doctor__frame { padding: 10px; }
  .hero-doctor__frame img { width: 100%; max-width: 300px; }
  .lines--hero-doctor { left: auto; right: -170px; bottom: -100px; height: auto; width: 420px; }
  .lines--hero-doctor path { stroke-width: 2.2; }
  .lines--hero-doctor path:nth-child(1) { stroke: rgba(255,255,255,.22); }
  .lines--hero-doctor path:nth-child(2) { display: none; }
  .creds-band { padding: 34px 0 40px; }
  .creds-band .container { grid-template-columns: 1fr 1fr; gap: 22px 20px; }
  .creds-band__cell { padding: 0; border-left: 0; }
  .creds-band__cell:first-child { grid-column: 1 / -1; padding-bottom: 22px; border-bottom: var(--bw) solid var(--b-dark-2); }
  .creds-band__label { font-size: 9px; letter-spacing: .16em; margin-bottom: 8px; }
  .creds-band__name { font-size: 21px; }
  .creds-band__value { font-size: 13px; line-height: 1.45; }
  .creds-band__value .sub { font-size: 11.5px; margin-top: 4px; }
  .about { padding-top: 64px; }
  .about .container { display: flex; flex-direction: column; gap: 0; }
  .about h2 { font-size: 27px; margin-top: 16px; max-width: none; }
  .about__media { order: 1; margin-top: 28px; padding: 18px 0 0 18px; }
  .about__body { order: 2; }
  .about__body p { margin-top: 28px; font-size: 14.5px; }
  .about__body p + p { margin-top: 16px; }
  .about__years { gap: 16px; margin-top: 30px; padding-top: 24px; }
  .about__year { font-size: 26px; }
  .about__year-label { font-size: 11.5px; margin-top: 6px; }
  .about__links { flex-direction: column; gap: 8px; margin-top: 26px; }
  .rail { padding: 56px 0 0; }
  .rail__frame { border-bottom: 0; }
  .rail .container { display: block; }
  .rail__cell { padding: 22px 0; border-left: 0; border-bottom: var(--bw) solid var(--b-200); display: grid; grid-template-columns: 34px 1fr; gap: 12px; }
  .rail__cell:last-child { border-bottom: 0; }
  .rail__num { font-size: 17px; line-height: 1.3; margin: 0; grid-row: 1 / span 2; }
  .rail__title { font-size: 15px; }
  .rail__text { font-size: 13px; margin-top: 8px; }
  .philo { padding: 56px 0; }
  .philo .container { gap: 20px; }
  .philo .lines { display: none; }
  .quote-mark { font-size: 56px; }
  .philo blockquote p { font-size: 21px; line-height: 1.5; }
  .philo blockquote footer { margin-top: 24px; padding-top: 18px; gap: 6px; }
  .philo blockquote cite { font-size: 13.5px; }
  .timeline-section { padding: 64px 0; }
  .timeline-section__head { gap: 16px; padding-bottom: 36px; }
  .timeline-section__head h2 { font-size: 27px; margin-top: 16px; }
  .timeline-section__head p { font-size: 13.5px; }
  .tl-year__num { font-size: 44px; }
  .tl-year__sticky { padding-bottom: 20px; }
  .tl-year + .tl-year .tl-year__sticky { padding-top: 40px; }
  .tl-items { gap: 28px; padding-bottom: 0; }
  .tl-item { padding-left: 22px; gap: 14px; }
  .tl-item__dot { left: -6px; width: 11px; height: 11px; border-width: 2px; }
  .tl-item::before { bottom: -28px; }
  .tl-item__label { font-size: 9.5px; letter-spacing: .16em; margin-bottom: 8px; }
  .tl-item h4 { font-size: 17px; }
  .tl-item__inst { font-size: 13px; margin-top: 8px; }
  .tl-item__doc { max-width: 200px; padding: 8px; }
  .creds-official { padding: 56px 0 64px; }
  .creds-official .container { gap: 28px; }
  .creds-official h2 { font-size: 27px; margin-top: 16px; }
  .creds-official__intro p { font-size: 14px; margin-top: 18px; }
  .btn-ghost { margin-top: 22px; padding: 13px 16px; font-size: 10.5px; }
  .creds-list > div { padding: 22px 0; grid-template-columns: 1fr; gap: 8px; }
  .creds-list dt { font-size: 9px; letter-spacing: .18em; }
  .creds-list__value { font-size: 16px; }
  .creds-list__inst { font-size: 12.5px; margin-top: 6px; }
  .gallery { padding-top: 64px; }
  .gallery__head { padding-bottom: 28px; gap: 12px; }
  .gallery__head h2 { font-size: 27px; margin-top: 16px; }
  .gallery__grid { grid-template-columns: 1fr 1fr; grid-template-areas: "g1 g1" "g3 g4" "g2 g2"; grid-auto-rows: auto; gap: 8px; }
  .gallery__item--1 { aspect-ratio: 4 / 3; }
  .gallery__item--3, .gallery__item--4 { aspect-ratio: 1; }
  .gallery__item--2 { aspect-ratio: 16 / 10; }
  .quote-doc { padding: 56px 0 60px; margin-top: 64px; }
  .quote-doc blockquote { text-align: left; padding: 0; }
  .quote-doc .quote-mark { font-size: 56px; }
  .quote-doc blockquote p { font-size: 21px; margin-top: 20px; }
  .quote-doc blockquote footer { justify-content: flex-start; margin-top: 28px; padding-top: 22px; border-top: var(--bw) solid var(--b-200); gap: 18px; }
  .quote-doc__avatar { width: 64px; height: 64px; }
  .quote-doc .lines { left: -150px; bottom: -140px; width: 320px; }

  /* Rinoplastia Ultrasónica (UI-03) móvil */
  .hero-tech { min-height: 0; background: linear-gradient(180deg, #585858 0%, #3E3E3E 100%); }
  .hero-tech::after { background: linear-gradient(180deg, rgba(11,11,11,0) 45%, rgba(11,11,11,.92) 100%); }
  .hero-tech .container { display: block; }
  .hero-tech__copy { padding: 40px 0 0; max-width: none; }
  .hero-tech h1 { font-size: 42px; margin-top: 18px; }
  .hero-tech .lead { font-size: 18px; margin-top: 16px; max-width: none; }
  .hero-tech__sign { font-size: 13px; margin-top: 18px; }
  .hero-tech__cta { margin-top: 26px; }
  .hero-tech__cta .btn { display: flex; width: 100%; min-height: 50px; }
  .hero-tech__cta .btn--outline-dark { display: none; }
  .hero-tech__media { margin: 30px 0 0; padding: 0; justify-content: center; min-width: 0; }
  .hero-tech__figure { padding: 10px; width: 100%; max-width: 320px; box-sizing: border-box; margin-bottom: -1px; }
  .hero-tech__frame img { width: 100%; }
  .hero-tech__tag { font-size: 8px; letter-spacing: .14em; border-radius: 0; }
  .hero-tech__figure figcaption { padding-top: 10px; font-size: 9.5px; }
  .hero-tech__figure figcaption .plain { display: none; }
  .lines--hero-tech { left: auto; right: -170px; bottom: -100px; height: auto; width: 420px; }
  .lines--hero-tech path { stroke-width: 2.2; }
  .lines--hero-tech path:nth-child(1) { stroke: rgba(255,255,255,.22); }
  .lines--hero-tech path:nth-child(2) { display: none; }
  .auth-strip .container { padding: 30px 22px 36px; display: block; }
  .auth-strip__who { gap: 16px; }
  .auth-strip__avatar { width: 52px; height: 52px; }
  .auth-strip__name { font-size: 14px; }
  .auth-strip__role { font-size: 11.5px; line-height: 1.5; }
  .auth-strip__meta { display: block; margin-top: 10px; font-size: 11.5px; line-height: 1.6; }
  .auth-strip__meta > span { display: block; }
  .auth-strip__link { display: inline-block; margin-top: 16px; font-size: 12px; padding: 6px 0 3px; }
  .whatis { padding-top: 64px; }
  .whatis .container { gap: 28px; }
  .whatis h2 { font-size: 27px; margin-top: 16px; max-width: none; }
  .whatis__text p { font-size: 14.5px; margin-top: 22px; }
  .whatis__text p + p { margin-top: 14px; }
  .whatis__links { flex-direction: column; align-items: flex-start; gap: 10px; margin-top: 26px; }
  .whatis__media { padding: 18px 0 0 18px; }
  .whatis__frame { padding: 10px; }
  .tech { padding: 56px 0 64px; margin-top: 56px; }
  .tech .lines { display: none; }
  .tech .container { gap: 28px; }
  .tech__intro h2 { font-size: 27px; margin-top: 16px; }
  .tech__intro p { font-size: 14.5px; margin-top: 18px; }
  .tech__phrase { margin-top: 24px; padding: 20px 22px; }
  .tech__phrase p { font-size: 18px; }
  .tech__step { padding: 22px 0; grid-template-columns: 34px 1fr; gap: 12px; }
  .tech__num { font-size: 22px; }
  .tech__title { font-size: 16px; }
  .tech__text { font-size: 13.5px; }
  .benefits { padding-top: 64px; }
  .benefits__head h2 { font-size: 27px; margin-top: 16px; }
  .benefits__grid { margin-top: 32px; gap: 16px; }
  .benefit-card { padding: 28px 22px; }
  .benefit-card::before { left: 22px; }
  .benefit-card__avatar { width: 56px; height: 56px; }
  .benefit-card h3 { font-size: 22px; }
  .benefit-card li { padding: 20px 0; gap: 12px; }
  .benefit-card__title { font-size: 15px; }
  .benefit-card__text { font-size: 13.5px; }
  .benefits__note, .compare__note { font-size: 12px; margin-top: 22px; }
  .candid { padding: 64px 0; }
  .candid .container { gap: 32px; }
  .candid h2 { font-size: 27px; margin-top: 16px; max-width: none; }
  .candid__intro > p { font-size: 14.5px; margin-top: 18px; }
  .candid__quote { margin-top: 28px; padding: 22px 22px; font-size: 18px; }
  .candid__cta { margin-top: 24px; }
  .candid__cta .btn { display: flex; width: 100%; min-height: 50px; }
  .candid__list li { padding: 20px 0; }
  .candid__title { font-size: 15px; }
  .candid__text { font-size: 13.5px; }
  .compare { padding: 64px 0; }
  .compare__head { gap: 16px; padding-bottom: 32px; }
  .compare__head h2 { font-size: 27px; margin-top: 16px; }
  .compare__head p { font-size: 14.5px; }
  .compare__table { padding: 0 20px; }
  .compare__row { padding: 22px 0; gap: 8px; }
  .compare__feat { font-size: 10.5px; }
  .compare__trad, .compare__ultra { font-size: 14px; }
  .compare__trad::before, .compare__ultra::before { font-size: 10px; }
  .process { padding: 64px 0; }
  .process__head { gap: 16px; }
  .process__head h2 { font-size: 27px; margin-top: 16px; }
  .process__head p { font-size: 14.5px; }
  .process__grid { margin-top: 36px; gap: 0; position: relative; padding-left: 0; }
  .process__step { border: 0; padding: 0 0 36px 64px; position: relative; }
  .process__step::before { content: ""; position: absolute; left: 21px; top: 44px; bottom: 0; width: 1px; background: var(--b-200); }
  .process__step:last-child::before { display: none; }
  .process__num { position: absolute; left: 0; top: 0; width: 44px; height: 44px; font-size: 14px; }
  .process__step h3 { margin-top: 0; font-size: 18px; padding-top: 10px; }
  .process__desc { font-size: 14px; }
  .process__more { font-size: 13px; }
  .results { padding: 64px 0; }
  .results__head { gap: 14px; padding-bottom: 32px; }
  .results__head h2 { font-size: 27px; margin-top: 16px; }
  .results__head p { font-size: 14px; }
  .results__grid { margin-top: 40px; gap: 48px; }
  .results .case__frame { margin: 0 -22px; }
  .result__text { padding-top: 22px; }
  .result__text h3 { font-size: 24px; margin-top: 12px; }
  .result__desc { font-size: 14px; }
  .results__cta { margin-top: 44px; }
  .results__cta .btn { display: flex; width: 100%; min-height: 50px; justify-content: center; }
  .expect { padding: 64px 0; }
  .expect .lines { display: none; }
  .expect .container { gap: 32px; }
  .expect h2 { font-size: 27px; margin-top: 16px; max-width: none; }
  .expect__intro > p { font-size: 14.5px; margin-top: 18px; }
  .expect .observe__list { padding: 4px 18px; }
  .expect .observe__item { padding: 18px 0; }
  .link-rows { margin-top: 26px; gap: 10px; }
  .link-row { padding: 14px 16px; font-size: 13px; }
  .faq { padding: 60px 0 64px; }
  .faq .container { gap: 28px; }
  .faq__intro h2 { font-size: 27px; margin-top: 16px; }
  .faq__intro p { font-size: 14px; margin-top: 16px; }
  .faq__intro .link-cta { margin-top: 20px; }
  .faq__q { grid-template-columns: 30px 1fr 28px; column-gap: 14px; padding: 22px 0; min-height: 48px; }
  .faq__q::before { font-size: 15px; }
  .faq__q span { font-size: 15px; }
  .faq__q::after { width: 28px; height: 28px; font-size: 15px; }
  .faq__a { margin-top: -4px; padding: 0 24px 28px 44px; font-size: 14px; }

  /* Home (UI-01) móvil */
  .hero-home { min-height: 0; display: block; }
  .hero-home__bg img { object-position: 18% 20%; }
  .hero-home::before { background: linear-gradient(180deg, rgba(18,18,18,.55) 0%, rgba(18,18,18,.35) 40%, rgba(11,11,11,.92) 100%); }
  .hero-home .container { display: block; }
  .hero-home__copy { padding: 40px 0 0; max-width: none; }
  .hero-home h1 { font-size: 48px; margin-top: 20px; }
  .hero-home .lead { font-size: 20px; margin-top: 18px; max-width: 15em; }
  .hero-home__sign { font-size: 13px; margin-top: 20px; }
  .hero-home__cta { margin-top: 28px; }
  .hero-home__cta .btn { display: flex; width: 100%; min-height: 50px; }
  .hero-home__cta .btn--outline-dark { display: none; }
  .hero-home__phone { position: absolute; left: 22px; bottom: 34px; z-index: 3; margin: 0; flex-direction: column; gap: 6px; }
  .hero-home__phone-label { font-size: 9px; }
  .hero-home__phone a { font-size: 18px; }
  .hero-home__portrait { position: relative; margin: 24px -22px 0; height: clamp(290px, 74vw, 420px); display: block; min-width: 0; flex: none; }
  .whatis__tag { font-size: 8px; letter-spacing: .14em; border-radius: 0; }
  .hero-home__portrait img { position: absolute; right: -64px; bottom: 0; width: min(80%, 380px); height: auto; margin: 0; transform: none; filter: drop-shadow(0 20px 30px rgba(0,0,0,.45)); }   /* T-10: el PNG tiene 1/3 transparente a la derecha; -64px lleva la figura al borde y libera la zona del telefono */
  .lines--hero-home2 { left: auto; right: -170px; bottom: -120px; height: auto; width: 440px; }
  .lines--hero-home2 path { stroke-width: 2.2; }
  .lines--hero-home2 path:nth-child(3) { display: none; }
  .intro { padding: 64px 0 60px; }
  .intro__portrait { padding: 0; clip-path: none; display: block; }
  .intro__portrait::before { display: none; }
  /* T-10: el plano crema deja de ser una altura fija (617 px) y cubre retrato + eyebrow + h2 como item de la rejilla */
  .intro .container { display: grid; grid-template-columns: minmax(0, 1fr); }
  .intro .container::before { content: ""; grid-column: 1; grid-row: 1 / 4; margin: -64px -100vw 0; background: var(--s-cream); }
  .intro__text { display: contents; }
  .intro__portrait { grid-area: 1 / 1; }
  .intro__text > .eyebrow { grid-area: 2 / 1; }
  .intro h2 { grid-area: 3 / 1; }
  .intro h2 { font-size: 28px; margin-top: 16px; max-width: none; padding-bottom: 36px; }
  .intro__portrait { margin: 32px 0 0; text-align: center; }
  .intro__portrait img { width: 78%; max-width: none; margin: 0 auto; filter: saturate(.96) drop-shadow(0 26px 34px rgba(11,11,11,.22)); }
  .intro__text > p { font-size: 14.5px; margin-top: 32px; }
  .intro__axes { gap: 20px; margin-top: 32px; padding-top: 26px; }
  .intro__axis { font-size: 26px; }
  .intro__axis-text { font-size: 12.5px; margin-top: 10px; }
  .intro__link { margin-top: 30px; }
  .whatis--home { padding: 40px 0 64px; }
  .whatis__bullets { margin-top: 24px; }
  .whatis__bullets li { font-size: 14.5px; }
  .whatis__cta { margin-top: 28px; }
  .whatis__cta .btn { display: flex; width: 100%; min-height: 50px; }
  .benefits-home { padding-bottom: 120px; }   /* T-10: el circulo sobresale 78 px del bloque gris; quedan ~42 px de fondo claro antes de la seccion negra */
  .benefits-home__head { text-align: left; max-width: none; }
  .benefits-home__head h2 { font-size: 30px; margin-top: 16px; }
  .rail--home { margin-top: 36px; }
  .rail--home .container { display: grid; grid-template-columns: 1fr 1fr; }
  .rail--home .rail__cell { display: block; padding: 22px 18px 22px 0; border-bottom: var(--bw) solid var(--b-200); }
  .rail--home .rail__cell:nth-child(even) { padding-left: 18px; border-left: var(--bw) solid var(--b-200); }
  .rail--home .rail__cell:nth-last-child(-n+2) { border-bottom: 0; }
  .rail__label { font-size: 11px; margin-bottom: 10px; }
  .rail--home .rail__text { font-size: 13px; }
  .bblocks { margin-top: 64px; }
  .bblock-wrap { padding: 0 22px; }
  .bblock { grid-template-columns: 1fr; gap: 28px; padding: 0 0 48px; }
  .bblock + .bblock { padding: 48px 0 0; }
  .bblock__circle { width: 78%; margin: 0 auto; }
  .bblock__circle--up { margin-top: -60px; }
  .bblock__circle--down { margin-bottom: -60px; order: 2; }
  .bblock__text--first { padding-top: 0; }
  .bblock__text--last { padding-bottom: 0; }
  .bblock h3 { font-size: 26px; }
  .bblock p { font-size: 14.5px; margin-top: 16px; }
  .bblock .btn { margin-top: 24px; }
  .steps { padding: 64px 0; }
  .steps__head { gap: 16px; }
  .steps__head h2 { font-size: 29px; margin-top: 16px; }
  .steps__head p { font-size: 14px; }
  .steps__track { margin-top: 36px; }
  .steps__track::before { display: block; top: 14px; bottom: 30px; left: 23px; right: auto; width: 1px; height: auto; background: linear-gradient(180deg, var(--c-teal), var(--c-teal-300) 40%, var(--c-teal-100) 70%, var(--b-200)); }
  .steps__list { display: block; }
  .step { text-align: left; position: relative; display: flex; gap: 22px; padding-bottom: 34px; }
  .step:last-child { padding-bottom: 0; }
  .step__num { flex: 0 0 46px; width: 46px; height: 46px; margin: 0; font-size: 13px; }
  .step h3 { margin: 4px 0 0; font-size: 16px; }
  .step p { margin: 8px 0 0; font-size: 13.5px; max-width: none; }
  .quote-home { padding: 56px 0 60px; }
  .quote-home .container { display: block; }
  .quote-home__portrait { display: none; }
  .quote-home blockquote p.quote-mark { font-size: 56px; }
  .quote-home blockquote p { font-size: 20px; margin-top: 14px; }
  .quote-home blockquote footer { margin-top: 28px; padding-top: 22px; align-items: center; gap: 18px; }
  .quote-home__avatar { display: block; width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: 50% 0; padding-top: 7px; box-sizing: border-box; background: #fff; flex: 0 0 auto; }   /* T-10: cabeza completa con un pequeno espacio superior */
  .quote-home__who cite, .quote-home__who span { display: block; }
}

/* ---------- Muy estrecho (≤ 360) ---------- */
@media (max-width: 360px) {
  h1, .h1 { font-size: 44px; }
  .mobile-bar .btn--secondary { flex-basis: 104px; }
}

/* T-10 - Hero Home entre 1000 y 1099 px (columnas aun lado a lado): figura mayor y a la derecha sin tocar el texto */
@media (min-width: 1000px) and (max-width: 1099px) {
  .hero-home__portrait img { right: -28%; height: calc(100% - clamp(56px, 8vw, 110px) - 28px); }   /* T-10A.1: figura algo menor para no tocar el texto */
  .lines--hero-home2 { height: 88%; bottom: -7%; }
}
/* T-10 / T-10A.1 - Entre 641 y 999 px el hero envuelve (retrato bajo el texto): se conserva el encuadre previo en flujo */
@media (min-width: 641px) and (max-width: 999px) {
  .hero-home__portrait { align-self: flex-end; }
  .hero-home__portrait img { position: relative; right: auto; bottom: auto; height: auto; width: min(100%, 600px); margin-right: -32.4%; transform: none; }
  .lines--hero-home2 { height: 112%; bottom: -8%; }
}

/* T-10 - Menu movil en alturas bajas (p. ej. 320x568): compacta un paso mas; el scroll del panel sigue disponible */
@media (max-width: 640px) and (max-height: 620px) {
  .nav-panel__top { height: 54px; }
  .nav-panel__nav { padding-top: 10px; }
  .nav-panel { padding-bottom: 14px; }
  .nav-panel__nav a { font-size: 20px; padding: 9px 0; }
  .nav-panel__foot { gap: 12px; padding-top: 14px; }
  .nav-panel__foot .eyebrow { margin-bottom: 4px; }
  .nav-panel__foot p { font-size: 12.5px; line-height: 1.45; }
  .nav-panel__tel { margin-top: 2px; }
  .nav-panel__social a { padding: 10px 0; }
}

/* ---------- Impresión ---------- */
@media print {
  .site-header, .mobile-bar, .nav-panel, .lines, .skip-link { display: none !important; }
  body { padding-bottom: 0; color: #000; }
}

/* UI-02 · banda de credenciales: 2 × 2 por debajo del header completo (evita 3 + 1 con auto-fit) */
@media (max-width: 1099px) {
  .creds-band .container { grid-template-columns: 1fr 1fr; gap: 28px 0; }
  .creds-band__cell:nth-child(odd) { border-left: 0; padding-left: 0; }
  .creds-band__cell:nth-child(even) { padding-right: 0; }
}

/* UI-01 · rail de valores 2 × 2 por debajo del header completo (evita 3 + 1 con auto-fit) */
@media (max-width: 1199px) and (min-width: 641px) {
  .rail--home .container { grid-template-columns: 1fr 1fr; }
  .rail--home .rail__cell:nth-child(odd) { border-left: 0; padding-left: 0; }
  .rail--home .rail__cell:nth-child(even) { padding-right: 0; }
  .rail--home .rail__cell:nth-child(-n+2) { border-bottom: var(--bw) solid var(--b-200); }
}