:root {
  --local-navy: #083b66;
  --local-blue: #0a86c8;
  --local-sky: #dff4ff;
  --local-green: #3f8b42;
  --local-leaf: #77aa43;
  --local-wheat: #d8b85d;
  --local-ink: #0c3859;
  --local-surface: #f8fbfd;
}

body.preview-refresh {
  color: var(--local-ink);
  background:
    radial-gradient(circle at 85% 10%, rgba(150, 201, 95, 0.15), transparent 27rem),
    linear-gradient(180deg, #fbfdff 0%, #f5faf7 42%, #fff 100%);
}

body.retiro-page.preview-refresh {
  --site-accent: #10a3a6;
  --site-accent-2: #7540d2;
  background:
    radial-gradient(circle at 88% 8%, rgba(117, 64, 210, 0.12), transparent 25rem),
    radial-gradient(circle at 8% 28%, rgba(16, 163, 166, 0.13), transparent 29rem),
    #f8fcfc;
}

body.parral-page.preview-refresh {
  --site-accent: #04a9df;
  --site-accent-2: #0061a8;
  background:
    radial-gradient(circle at 88% 8%, rgba(4, 169, 223, 0.15), transparent 26rem),
    radial-gradient(circle at 9% 32%, rgba(0, 97, 168, 0.1), transparent 29rem),
    #f8fcff;
}

.preview-refresh .site-header {
  background: rgba(255, 255, 255, 0.93);
  backdrop-filter: blur(15px);
}

.preview-refresh .brand-refresh-lockup {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}

.preview-refresh .brand-refresh-lockup img {
  width: 185px;
  max-height: 48px;
  object-fit: contain;
  object-position: left center;
}

.preview-refresh .desktop-nav {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
}

.preview-refresh .desktop-nav a {
  padding: 10px 12px;
  border-radius: 11px;
  color: var(--local-ink);
  font-size: 0.92rem;
  font-weight: 800;
  text-decoration: none;
}

.preview-refresh .desktop-nav a:hover,
.preview-refresh .desktop-nav a:focus-visible,
.preview-refresh .desktop-nav a[aria-current="page"] {
  color: #fff;
  background: var(--local-navy);
  outline: none;
}

.preview-refresh .site-menu { display: none; }
.preview-refresh .site-menu-panel { z-index: 120; }

.local-home-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(56px, 8vw, 100px) 0 70px;
}

.local-home-hero::after,
.local-clinic-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -8%;
  bottom: -90px;
  width: 58%;
  height: 250px;
  border-radius: 50% 0 0 0;
  background: repeating-linear-gradient(170deg, rgba(63, 139, 66, 0.07) 0 2px, transparent 2px 22px);
  transform: rotate(-3deg);
}

.local-home-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.72fr);
  gap: clamp(34px, 6vw, 82px);
  align-items: center;
}

.home-doctor-panel {
  display: grid;
  align-self: start;
  gap: 18px;
}

.local-home-copy h1,
.local-clinic-copy h1 {
  max-width: 760px;
  margin: 16px 0 18px;
  color: var(--local-navy);
  font-size: clamp(2.75rem, 5.8vw, 5.4rem);
  line-height: 0.98;
  letter-spacing: -0.055em;
}

.local-home-copy .lead,
.local-clinic-copy .lead {
  max-width: 690px;
  font-size: clamp(1.08rem, 1.8vw, 1.28rem);
  line-height: 1.65;
}

.local-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: var(--local-green);
  font-size: 0.8rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.local-kicker::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--local-leaf);
  box-shadow: 0 0 0 6px rgba(119, 170, 67, 0.13);
}

.local-choice-title {
  margin: 34px 0 13px;
  color: var(--local-navy);
  font-size: 1rem;
  font-weight: 900;
}

.local-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
}

.local-choice-card {
  position: relative;
  display: grid;
  min-height: 158px;
  align-content: space-between;
  gap: 18px;
  padding: 22px;
  overflow: hidden;
  border: 1px solid rgba(8, 59, 102, 0.1);
  border-radius: 22px 22px 22px 7px;
  color: var(--local-navy);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 16px 40px rgba(8, 59, 102, 0.09);
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.local-choice-card::after {
  content: "→";
  position: absolute;
  right: 18px;
  bottom: 18px;
  display: grid;
  width: 35px;
  height: 35px;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: var(--local-blue);
}

.local-choice-card:hover,
.local-choice-card:focus-visible {
  outline: none;
  box-shadow: 0 21px 48px rgba(8, 59, 102, 0.15);
  transform: translateY(-4px);
}

.local-choice-card strong {
  display: block;
  max-width: 78%;
  font-size: 1.24rem;
  line-height: 1.18;
}

.local-choice-card small {
  display: block;
  max-width: 82%;
  color: #527087;
  font-size: 0.86rem;
  line-height: 1.4;
}

.local-choice-card.retiro { border-top: 5px solid var(--local-leaf); }
.local-choice-card.parral { border-top: 5px solid #1aa6d9; }

.local-domicilio-link,
.local-secondary-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 15px;
  color: var(--local-navy);
  font-weight: 850;
  text-underline-offset: 4px;
}

.local-secondary-link { margin-left: 18px; color: #526d82; }

.maule-visual {
  position: relative;
  display: block;
  min-height: 590px;
  overflow: hidden;
  border-radius: 42px 42px 42px 12px;
  background: linear-gradient(160deg, #dff5ff 0%, #f4f7d9 54%, #b9dca2 100%);
  box-shadow: 0 32px 70px rgba(8, 59, 102, 0.16);
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.maule-visual:hover,
.maule-visual:focus-visible {
  outline: none;
  box-shadow: 0 38px 80px rgba(8, 59, 102, 0.22);
  transform: translateY(-5px);
}

.maule-visual img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
}

.maule-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 45%, rgba(5, 42, 71, 0.78) 100%);
}

.maule-visual-caption {
  position: absolute;
  z-index: 2;
  right: 28px;
  bottom: 28px;
  left: 28px;
  color: #fff;
}

.maule-visual-caption span {
  display: block;
  margin-bottom: 7px;
  color: #d9f1be;
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.maule-visual-caption strong {
  display: block;
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  line-height: 1.12;
}

.maule-visual-caption em {
  display: inline-flex;
  margin-top: 16px;
  padding: 9px 13px;
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-radius: 999px;
  color: #fff;
  background: rgba(255, 255, 255, 0.12);
  font-size: 0.9rem;
  font-style: normal;
  font-weight: 850;
  backdrop-filter: blur(8px);
}

.local-project-section { padding-top: 78px; }
.local-project-section .section-head { max-width: 760px; }
.local-project-section .home-project-grid { margin-top: 30px; }

.local-clinic-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(52px, 7vw, 90px) 0 72px;
}

.retiro-page .local-clinic-hero {
  border-top: 4px solid transparent;
  border-image: linear-gradient(90deg, #10a3a6, #7540d2) 1;
}

.parral-page .local-clinic-hero {
  border-top: 4px solid transparent;
  border-image: linear-gradient(90deg, #04a9df, #0061a8) 1;
}

.retiro-page .local-kicker { color: #7540d2; }
.parral-page .local-kicker { color: #006aa9; }
.retiro-page .local-kicker::before { background: #10a3a6; box-shadow: 0 0 0 6px rgba(16, 163, 166, 0.13); }
.parral-page .local-kicker::before { background: #04a9df; box-shadow: 0 0 0 6px rgba(4, 169, 223, 0.13); }
.retiro-page .local-place-line { border-left-color: #10a3a6; }
.parral-page .local-place-line { border-left-color: #04a9df; }

.retiro-page .local-fact:nth-child(1) { border-top: 3px solid #10a3a6; }
.retiro-page .local-fact:nth-child(2) { border-top: 3px solid #7540d2; }
.retiro-page .local-fact:nth-child(3) { border-top: 3px solid #10a3a6; }
.parral-page .local-fact { border-top: 3px solid #04a9df; }

.local-clinic-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(340px, 0.68fr);
  gap: clamp(32px, 6vw, 78px);
  align-items: center;
}

.local-place-line {
  margin: 22px 0;
  padding: 16px 18px;
  border-left: 5px solid var(--local-leaf);
  border-radius: 8px 16px 16px 8px;
  background: rgba(255, 255, 255, 0.8);
}

.local-place-line span,
.local-place-line strong { display: block; }
.local-place-line span { color: #648095; font-size: 0.8rem; font-weight: 800; text-transform: uppercase; }
.local-place-line strong { margin-top: 3px; color: var(--local-navy); font-size: 1.08rem; }

.local-map-reference {
  display: inline-block;
  margin-top: 9px;
  color: var(--blue-800);
  font-size: 0.88rem;
  font-weight: 850;
  text-underline-offset: 3px;
}

.local-location-note {
  margin: 9px 0 0;
  color: #4e6c82;
  font-size: 0.94rem;
  line-height: 1.45;
}

.local-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 26px 0;
}

.local-fact {
  padding: 14px 15px;
  border: 1px solid rgba(8, 59, 102, 0.1);
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.82);
}

.local-fact span,
.local-fact strong { display: block; }
.local-fact span { color: #678094; font-size: 0.72rem; font-weight: 850; text-transform: uppercase; }
.local-fact strong { margin-top: 3px; color: var(--local-navy); font-size: 0.9rem; line-height: 1.3; }

.local-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 11px;
}

.local-action-groups {
  display: grid;
  gap: 22px;
}

.local-action-group {
  display: grid;
  gap: 11px;
}

.local-action-group h2 {
  margin: 0;
  color: var(--local-navy);
  font-size: clamp(1.06rem, 2vw, 1.24rem);
  line-height: 1.2;
}

.local-actions .button { min-height: 49px; }

.local-actions .button-route {
  gap: 8px;
  padding-inline: 18px;
}

.route-icon {
  font-size: 1.08rem;
  line-height: 1;
}

.button-map-google {
  color: #0757a6;
  border-color: rgba(7, 87, 166, 0.24);
  background: #eef7ff;
  box-shadow: 0 11px 25px rgba(7, 87, 166, 0.12);
}

.button-whatsapp {
  gap: 8px;
  padding-inline: 18px;
  color: #fff;
  border-color: #169b58;
  background: #20a861;
  box-shadow: 0 11px 25px rgba(32, 168, 97, 0.2);
}

.button-whatsapp:hover {
  color: #fff;
  border-color: #128149;
  background: #169b58;
}

.button-map-waze {
  color: #07506d;
  border-color: rgba(0, 174, 239, 0.28);
  background: #eafaff;
  box-shadow: 0 11px 25px rgba(0, 139, 191, 0.12);
}

.local-primary-card {
  padding: clamp(25px, 4vw, 38px);
  border: 1px solid rgba(8, 59, 102, 0.1);
  border-radius: 30px 30px 30px 9px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 25px 58px rgba(8, 59, 102, 0.14);
}

.local-primary-card img {
  display: block;
  width: min(100%, 330px);
  max-height: 150px;
  margin: 0 auto 22px;
  object-fit: contain;
}

.local-primary-card.local-image-card {
  overflow: hidden;
  padding: 10px;
  background: #fff;
}

.retiro-page .local-primary-card.local-image-card {
  border-color: rgba(117, 64, 210, 0.22);
  box-shadow: 0 25px 62px rgba(86, 58, 153, 0.16);
}

.parral-page .local-primary-card.local-image-card {
  border-color: rgba(4, 169, 223, 0.25);
  box-shadow: 0 25px 62px rgba(0, 97, 168, 0.16);
}

.partner-brand {
  display: grid;
  min-height: 102px;
  place-items: center;
  margin-bottom: 10px;
  padding: 10px 16px;
  border-radius: 22px 22px 12px 5px;
  background: #fff;
}

.local-primary-card.local-image-card .partner-brand img {
  width: min(100%, 390px);
  max-height: 88px;
  margin: 0;
  object-fit: contain;
}

.partner-brand-erik {
  border-bottom: 3px solid #10a3a6;
  background: linear-gradient(90deg, rgba(16, 163, 166, 0.08), rgba(117, 64, 210, 0.07));
}

.partner-brand-tecno {
  border-bottom: 3px solid #04a9df;
  background: linear-gradient(90deg, rgba(4, 169, 223, 0.08), rgba(0, 97, 168, 0.06));
}

.local-image-card .local-feature-poster {
  display: block;
  overflow: hidden;
  border-radius: 22px 22px 13px 5px;
  background: #eef6fa;
}

.local-primary-card.local-image-card .local-feature-poster img {
  width: 100%;
  max-height: none;
  margin: 0;
  object-fit: cover;
}

.local-image-card-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 8px;
  padding: 10px 2px 2px;
}

.local-image-card-actions a {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 11px;
  color: var(--local-navy);
  background: #edf6fb;
  font-size: 0.82rem;
  font-weight: 850;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
}

.local-primary-card.local-image-card .social-icon {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  max-height: none;
  margin: 0;
  border-radius: 6px;
  object-fit: contain;
}

.local-image-card-actions a:first-child {
  color: #fff;
  background: var(--local-navy);
}

.retiro-page .local-image-card-actions a:first-child {
  background: linear-gradient(135deg, #10a3a6, #7540d2);
}

.parral-page .local-image-card-actions a:first-child {
  background: linear-gradient(135deg, #04a9df, #0061a8);
}

.local-primary-card h2 { margin: 0 0 8px; color: var(--local-navy); font-size: 1.55rem; }
.local-primary-card p { margin: 0 0 18px; color: #5e788d; }

.local-contact-list {
  display: grid;
  gap: 9px;
}

.local-contact-list a {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  padding: 12px 14px;
  border-radius: 12px;
  color: var(--local-navy);
  background: #edf6fb;
  font-weight: 850;
  text-decoration: none;
}

.local-poster-strip {
  padding: 0 0 30px;
}

.local-poster-card {
  display: grid;
  grid-template-columns: 135px 1fr auto;
  gap: 24px;
  align-items: center;
  padding: 20px;
  border: 1px solid rgba(8, 59, 102, 0.1);
  border-radius: 23px;
  background: #fff;
  box-shadow: 0 15px 38px rgba(8, 59, 102, 0.08);
}

.local-poster-card img {
  width: 135px;
  height: 112px;
  border-radius: 13px;
  object-fit: cover;
  object-position: top center;
}

.local-poster-card h2 { margin: 0 0 5px; font-size: 1.35rem; }
.local-poster-card p { margin: 0; color: #627b8e; }

.preview-refresh .direct-contact {
  z-index: 32;
  top: auto;
  right: 18px;
  bottom: 18px;
  min-width: 190px;
  padding: 10px 15px 10px 46px;
  border-right: 1px solid rgba(8, 59, 102, 0.14);
  border-radius: 999px;
  transform: none;
}

.preview-refresh .direct-contact::before { left: 13px; }
.preview-refresh .direct-contact:hover { transform: translateY(-3px); }

@media (min-width: 981px) {
  .preview-refresh .nav { padding-right: 205px; }
  .preview-refresh .direct-contact {
    top: 8px;
    right: max(18px, calc((100vw - 1120px) / 2));
    bottom: auto;
    width: 192px;
    min-width: 192px;
    padding: 8px 12px 8px 43px;
    border-radius: 14px;
    box-shadow: 0 9px 24px rgba(15, 86, 56, 0.22);
  }
  .preview-refresh .direct-contact::before { left: 10px; width: 24px; height: 24px; }
  .preview-refresh .direct-contact-label { font-size: 0.56rem; }
  .preview-refresh .direct-contact strong { font-size: 0.76rem; }
}

@media (max-width: 980px) {
  body.preview-refresh { padding-bottom: 82px; }
  .preview-refresh .desktop-nav { display: none; }
  .preview-refresh .site-menu { display: block; }
  .preview-refresh .site-menu-panel { z-index: 120; }
  .preview-refresh .direct-contact { min-width: 184px; }
  .preview-refresh .direct-contact-label { display: none; }
  .preview-refresh .direct-contact strong { font-size: 0.78rem; }
  .local-home-layout,
  .local-clinic-grid { grid-template-columns: 1fr; }
  .local-clinic-grid .local-image-card {
    order: -1;
    width: min(100%, 560px);
    margin: 0 auto;
  }
  .maule-visual { min-height: 460px; }
  .local-home-copy h1,
  .local-clinic-copy h1 { max-width: 820px; }
}

@media (max-width: 620px) {
  .preview-refresh .brand-refresh-lockup img { width: 145px; }
  .local-home-hero,
  .local-clinic-hero { padding-top: 38px; }
  .local-home-copy h1,
  .local-clinic-copy h1 { font-size: clamp(2.5rem, 13vw, 3.55rem); }
  .local-choice-grid,
  .local-facts { grid-template-columns: 1fr; }
  .local-secondary-link { display: block; margin: 13px 0 0; }
  .maule-visual { min-height: 400px; border-radius: 29px 29px 29px 9px; }
  .local-actions { display: grid; }
  .local-actions .button { width: 100%; }
  .local-poster-card { grid-template-columns: 82px 1fr; gap: 15px; }
  .local-poster-card img { width: 82px; height: 90px; }
  .local-poster-card .button { grid-column: 1 / -1; width: 100%; }
  .local-image-card-actions { grid-template-columns: 1fr; }
  .preview-refresh .direct-contact {
    right: 10px;
    bottom: 9px;
    left: auto;
    min-width: 190px;
    padding: 10px 12px 10px 46px;
  }
  .preview-refresh .direct-contact-label { display: none; }
  .preview-refresh .direct-contact strong { font-size: 0.76rem; }
}

@media (prefers-reduced-motion: reduce) {
  .local-choice-card,
  .maule-visual { transition: none; }
}
