
/* ====== VARIABLES ====== */
:root{
  --ivory:    #fff7f0;      /* blanco marfil */
  --ivory-2:  #fffdf9;
  --powder:   #e9c7cf;      /* rosa empolvado */
  --powder-2: #dcb1bb;      /* rosa empolvado más intenso */
  --rose:     #c7927f;      /* color “inspiración” (rose-gold suave) */
  --rose-2:   #d59a86;      /* brillo */
  --rosewood: #8b4c5b;      /* palo de rosa (detalles) */

  --text:     rgba(60, 45, 50, .86);   /* texto general (NO negro) */
  --muted:    rgba(60, 45, 50, .62);

  --card:        rgba(255,255,255,.82);
  --card-strong: rgba(255,255,255,.92);
  --border:      rgba(139, 76, 91, .14);
  --stroke:      rgba(139, 76, 91, .16);

  --shadow: 0 18px 50px rgba(139, 76, 91, .12);
  --radius: 18px;
}

/* ====== TIPOS ====== */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;800;900&family=Great+Vibes&display=swap');

/* ====== BASE / FIX SCROLL ====== */
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html, body{ overflow-x:hidden !important; }
body{
  margin:0;
  color: var(--text);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial;
  background:
    radial-gradient(1100px 650px at 12% 10%, rgba(233,199,207,.65), transparent 62%),
    radial-gradient(1050px 650px at 88% 0%,  rgba(233,199,207,.55), transparent 60%),
    radial-gradient(1100px 720px at 70% 92%, rgba(220,177,187,.52), transparent 62%),
    linear-gradient(180deg, var(--ivory-2), var(--ivory));
}

/* evita que imágenes/iframes generen overflow */
img, svg, video, iframe{ max-width:100%; height:auto; display:block; }

/* Links */
a{ color: inherit; }
a:hover{ opacity:.92; }

/* =========================================================
   REGLA CLAVE: TITULOS + NEGRITAS = COLOR “INSPIRACIÓN”
   (EXCEPTO footer: lo corregimos abajo sin tocar su fondo)
   ========================================================= */
h1,h2,h3,h4,h5,h6,
.section-title,
.hero-card-title,
.service-title,
.booking-title,
.calendar-title,
.note-title,
.about-title,
.review-name,
.footer-title{ /* footer-title se re-ajusta abajo para no romperlo */
  color: var(--rose);
}

.hero-kicker,
.brand-name,
.navbar .nav-link,
.topbar-item,
.form-label{
  color: var(--muted) !important;
}

/* Negritas (pero solo en contenido, NO footer) */
.hero strong, .hero b,
.section strong, .section b,
.nav-premium strong, .nav-premium b,
.topbar strong, .topbar b{
  color: var(--rose);
  font-weight: 800;
}

/* =========================================================
   TOPBAR
   ========================================================= */
.topbar{
  background: rgba(255,255,255,.60);
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(10px);
}
.topbar-item{ font-size:.92rem; color: var(--muted); }
.topbar-item a{ text-decoration:none; color: var(--text); }

.topbar-social{
  width:34px; height:34px;
  display:inline-flex;
  align-items:center; justify-content:center;
  border-radius:999px;
  background: rgba(233,199,207,.45);
  border: 1px solid rgba(139,76,91,.16);
  text-decoration:none;
}
.topbar-social i{ color: var(--rosewood); }

/* =========================================================
   NAVBAR
   ========================================================= */
.nav-premium{
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
}
.brand-logo{ width:44px; height:44px; object-fit:contain; }
.brand-name{
  font-weight: 900;
  letter-spacing:.2px;
  line-height:1.05;
}
.brand-sub{ font-size:.88rem; color: var(--muted); line-height:1.1; }

.navbar .nav-link{
  font-weight:700;
  color: rgba(60,45,50,.72) !important;
}
.navbar .nav-link:hover{ color: var(--rosewood) !important; }

.navbar-toggler{ border:1px solid rgba(139,76,91,.22); }
.navbar-toggler-icon{ filter: none; }

/* =========================================================
   BOTONES (SIN AZUL/NEGRO)
   ========================================================= */
.btn{
  border-radius: 14px !important;
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}

.btn-accent{
  background: linear-gradient(180deg, var(--rose-2), var(--rose));
  color: #fff !important;
  border: 1px solid rgba(139,76,91,.18);
  box-shadow: 0 14px 34px rgba(139,76,91,.18);
}
.btn-accent:hover{ transform: translateY(-1px); opacity:.98; }

.btn-outline-ink{
  border: 1px solid rgba(139,76,91,.28) !important;
  color: var(--rosewood) !important;
  background: rgba(255,255,255,.72) !important;
}
.btn-outline-ink:hover{
  background: rgba(255,255,255,.92) !important;
}

/* =========================================================
   HERO (2 tarjetas + MÁS rosa empolvado)
   ========================================================= */
.hero{
  position:relative;
  padding: 56px 0 46px;
  overflow:hidden;
  background:
    radial-gradient(1200px 680px at 68% 8%, rgba(233,199,207,.78) 0%, rgba(233,199,207,0) 62%),
    radial-gradient(1100px 680px at 10% 90%, rgba(220,177,187,.70) 0%, rgba(220,177,187,0) 62%),
    linear-gradient(180deg, #fffaf6 0%, #fff1f1 46%, #fffaf6 100%);
}

/* tarjeta izquierda (SIN cambiar tu HTML: úsala si envuelves con .hero-left-card) */
.hero-left-card{
  height:100%;
  background: var(--card);
  border: 1px solid var(--stroke);
  border-radius: 28px;
  box-shadow: var(--shadow);
  padding: 44px 46px 36px;
  backdrop-filter: blur(8px);
}

/* logo centrado y más grande */
.hero-logo-wrap{
  display:grid;
  place-items:center;
  gap:10px;
  margin-top:6px;
  margin-bottom:10px;
}
.hero-logo{
  width: 140px;     /* un poco más grande */
  max-width: 75%;
  height:auto;
  display:block;
  filter: drop-shadow(0 10px 24px rgba(139,76,91,.14));
}
.hero-logo-sub{
  font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size:.95rem;
  color: var(--muted);
  font-weight:600;
}

/* título estilo referencia */
.hero-title{
  margin: 18px 0 10px !important;
  line-height: 1.0;
  text-align:center;
}
.hero-kicker{
  display:block;
  font-family: "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight:700;
  font-size: 16px;
  letter-spacing: .38em;
  text-transform: uppercase;
  margin-bottom:10px;
}
.hero-script{
  display:block;
  font-family: "Great Vibes", cursive;
  font-weight: 400;
  font-size: clamp(56px, 5.2vw, 92px);
  letter-spacing: 0;
  color: transparent;
  background: linear-gradient(90deg, var(--rose-2) 0%, var(--rose) 45%, rgba(226,180,166,1) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  text-shadow: 0 10px 22px rgba(139,76,91,.10);
}

.hero-lead{
  max-width: 60ch;
  margin: 12px auto 0 !important;
  color: var(--muted);
  font-size: 1.05rem;
  text-align:center;
}

/* acciones centradas */
.hero-actions{
  display:flex;
  justify-content:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:22px;
}

/* mini icon pills */
.hero-icons{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:14px;
  margin-top:18px;
}
.icon-pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  background: rgba(255,255,255,.76);
  border: 1px solid var(--stroke);
  border-radius: 999px;
  padding: 10px 14px;
}
.icon-pill-text{
  font-weight: 700;
  color: rgba(60,45,50,.70);
  font-size: .95rem;
}
.icon-bubble{
  width: 44px; height: 44px;
  border-radius: 999px;
  display:inline-flex;
  align-items:center; justify-content:center;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.40), transparent 45%),
    linear-gradient(180deg, var(--powder), var(--powder-2));
  border: 1px solid rgba(139,76,91,.18);
  box-shadow: 0 12px 26px rgba(139,76,91,.14);
}
.icon-bubble i{ color:#fff; font-size:1.15rem; }

/* =========================================================
   TARJETA DERECHA (FORM) — SIN AZUL/NEGRO
   ========================================================= */
.hero-card{
  background: var(--card-strong);
  border: 1px solid var(--stroke);
  border-radius: 24px;
  box-shadow: var(--shadow);
  padding: 18px;
}
.hero-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.hero-card-icon{
  width:42px; height:42px;
  border-radius: 12px;
  display:inline-flex;
  align-items:center; justify-content:center;
  background: rgba(233,199,207,.45);
  border: 1px solid rgba(139,76,91,.16);
}
.hero-card-icon i{ color: var(--rosewood); }

.hero-card-title{ font-weight: 900; line-height:1.1; }
.hero-card-sub{ color: var(--muted); font-size:.92rem; }

.hero-card-chip{
  font-size:.85rem;
  font-weight:800;
  color: rgba(60,45,50,.72);
  background: rgba(233,199,207,.45);
  border: 1px solid rgba(139,76,91,.16);
  padding:6px 10px;
  border-radius:999px;
  white-space:nowrap;
}

.form-label{
  font-weight: 800;
  margin-bottom:6px;
}
.form-control-premium{
  border-radius:14px;
  border:1px solid rgba(139,76,91,.18);
  background: rgba(255,255,255,.92);
}
.mini-help{ font-size:.88rem; color: var(--muted); }
.mini-help a{ color: var(--rosewood); font-weight: 900; text-decoration:none; }

/* =========================================================
   SECCIONES
   ========================================================= */
.section{ padding:64px 0; }
.section-soft{
  background: rgba(255,255,255,.38);
  border-top: 1px solid rgba(139,76,91,.10);
  border-bottom: 1px solid rgba(139,76,91,.10);
}
.section-head{ max-width:740px; }
.section-title{ font-weight: 950; letter-spacing:.2px; margin:0; }
.section-lead{ margin:10px 0 0; color: var(--muted); font-size:1.02rem; }

/* NOTE */
.note-box{
  display:flex;
  gap:12px;
  align-items:flex-start;
  background: rgba(255,255,255,.76);
  border: 1px solid var(--stroke);
  border-radius: var(--radius);
  padding:14px;
}
.note-ico{
  width:44px; height:44px;
  border-radius:14px;
  display:flex;
  align-items:center; justify-content:center;
  background: rgba(233,199,207,.45);
  border: 1px solid rgba(139,76,91,.16);
}
.note-ico i{ color: var(--rosewood); }
.note-title{ font-weight: 950; }
.note-text{ color: var(--muted); }

/* =========================================================
   SERVICIOS
   ========================================================= */
.service-card{
  height:100%;
  background: var(--card);
  border: 1px solid var(--stroke);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding:18px;
}
.service-icon-bubble{
  margin: 0 auto 10px;
  width: 78px;
  height: 78px;
  border-radius: 999px;
  display:flex;
  align-items:center; justify-content:center;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.40), transparent 45%),
    linear-gradient(180deg, var(--powder), var(--powder-2));
  border: 1px solid rgba(139,76,91,.18);
  box-shadow: 0 12px 26px rgba(139,76,91,.14);
}
.service-icon-bubble i{ color:#fff; font-size:1.75rem; }

.service-title{
  text-align:center;
  font-weight: 950;
  margin: 0 0 10px;
}
.service-item,
.service-bullets li{
  padding:10px 10px;
  border-radius:14px;
  background: rgba(255,255,255,.66);
  border: 1px solid rgba(139,76,91,.10);
  margin-bottom:10px;
}
.service-item-title{
  font-weight: 950;
  color: var(--rose); /* negrita al color inspiración */
  margin-bottom:4px;
}
.service-item-text{ color: var(--muted); font-size:.96rem; }
.service-bullets{ list-style:none; padding:0; margin:0; }
.service-bullets i{ color: var(--rosewood); margin-top:2px; }

/* =========================================================
   ABOUT / GALERIA / AGENDA / TESTIMONIOS / FAQ
   (armonizado sin azul/negro)
   ========================================================= */
.about-card,
.booking-card,
.calendar-embed,
.review-card{
  background: var(--card);
  border: 1px solid var(--stroke);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding:18px;
}

.about-chip{
  display:inline-flex;
  gap:8px;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  background: rgba(233,199,207,.45);
  border: 1px solid rgba(139,76,91,.16);
  font-weight: 900;
  color: rgba(60,45,50,.74);
}
.about-title{ margin:0; font-weight:950; }
.about-text{ color: var(--muted); }
.about-point{
  display:flex;
  gap:8px;
  align-items:center;
  background: rgba(255,255,255,.66);
  border: 1px solid rgba(139,76,91,.10);
  border-radius:14px;
  padding:10px 12px;
  color: rgba(60,45,50,.74);
}
.about-point i{ color: var(--rosewood); }

.gallery-tile{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:18px;
  border: 1px solid var(--stroke);
  background: rgba(255,255,255,.50);
}
.gallery-tile img{
  width:100%;
  height:240px;
  object-fit:cover;
  transition: transform .35s ease;
}
.gallery-tile:hover img{ transform: scale(1.03); }
.gallery-overlay{
  position:absolute; inset:0;
  display:flex;
  align-items:center; justify-content:center;
  background: linear-gradient(180deg, transparent, rgba(139,76,91,.28));
  opacity:0;
  transition: opacity .25s ease;
}
.gallery-tile:hover .gallery-overlay{ opacity:1; }
.gallery-overlay i{ color:#fff; font-size:1.6rem; }

.booking-head-text .booking-title{ font-weight: 950; }
.booking-head-text .booking-sub{ color: var(--muted); font-size:.95rem; }

.step{
  display:flex;
  gap:10px;
  align-items:center;
  background: rgba(255,255,255,.66);
  border: 1px solid rgba(139,76,91,.10);
  border-radius:14px;
  padding:10px 12px;
  color: rgba(60,45,50,.74);
}
.step span{
  width:28px; height:28px;
  border-radius:999px;
  display:flex;
  align-items:center; justify-content:center;
  background: rgba(233,199,207,.55);
  border: 1px solid rgba(139,76,91,.16);
  font-weight: 950;
  color: rgba(60,45,50,.78);
}

.calendar-dot{
  width:10px; height:10px;
  border-radius:999px;
  background: var(--rosewood);
  box-shadow: 0 0 0 5px rgba(233,199,207,.38);
}
.calendar-hint{ color: var(--muted); font-size:.92rem; }
.calendar-embed iframe{
  width:100%;
  height:520px;
  border:0;
  border-radius:16px;
  background: rgba(255,255,255,.80);
}

.review-stars i{ color: rgba(139,76,91,.92); }
.review-text{ margin:12px 0 14px; color: var(--muted); }
.avatar{
  width:44px; height:44px;
  border-radius:999px;
  display:flex;
  align-items:center; justify-content:center;
  background: rgba(233,199,207,.55);
  border: 1px solid rgba(139,76,91,.16);
  font-weight: 950;
  color: rgba(60,45,50,.78);
}
.review-sub{ color: var(--muted); font-size:.92rem; }

.accordion-premium .accordion-item{
  background: rgba(255,255,255,.70);
  border: 1px solid var(--stroke);
  border-radius:16px;
  overflow:hidden;
  box-shadow: 0 10px 22px rgba(139,76,91,.10);
  margin-bottom:10px;
}
.accordion-premium .accordion-button{
  background: transparent;
  font-weight: 950;
  color: var(--rose); /* título acorde a inspiración */
}
.accordion-premium .accordion-body{ color: var(--muted); }

/* CTA (la tarjeta azul/negra: ahora rosa empolvado, como pediste) */
.cta-box{
  background:
    radial-gradient(700px 260px at 18% 20%, rgba(233,199,207,.65), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.58));
  border: 1px solid var(--stroke);
  border-radius: var(--radius);
  padding: 18px;
  color: rgba(60,45,50,.86);
  box-shadow: var(--shadow);
}
.cta-title{
  font-weight: 950;
  font-size: 1.4rem;
  color: var(--rose);
}
.cta-text{ color: var(--muted); margin-top:6px; opacity:1; }

/* =========================================================
   FLOATING ICONS (sin azul)
   ========================================================= */
.wa-float{
  position:fixed;
  right:18px;
  bottom:18px;
  width:56px;
  height:56px;
  border-radius:999px;
  display:flex;
  align-items:center; justify-content:center;
  background:#25D366;
  color:#fff;
  box-shadow:0 16px 30px rgba(0,0,0,.18);
  text-decoration:none;
  z-index:50;
}
.wa-float i{ font-size:1.55rem; }

.social-float{
  position:fixed;
  left:18px;
  bottom:18px;
  display:flex;
  flex-direction:column;
  gap:10px;
  z-index:50;
}
.social-float a{
  width:44px; height:44px;
  border-radius:999px;
  display:flex;
  align-items:center; justify-content:center;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(139,76,91,.18);
  box-shadow: 0 12px 26px rgba(139,76,91,.14);
  text-decoration:none;
}
.social-float a i{ color: var(--rosewood); }

/* Modal */
.modal-premium{
  background: rgba(255,255,255,.92);
  color: var(--text);
  border-radius: 18px;
  border: 1px solid var(--stroke);
}

.footer{
  margin-top: 40px;
  background: rgba(16,42,67,.96);
  color: rgba(255,255,255,.90);
  padding: 46px 0 18px;
}
.footer-logo{
  width: 54px; height: 54px;
  object-fit: contain;
}
.footer-name{
  font-weight: 950;
  letter-spacing: .2px;
}
.footer-sub{
  opacity: .78;
  font-size: .92rem;
}
.footer-title{
  font-weight: 950;
  margin-bottom: 10px;
}
.footer-text{
  opacity: .86;
}
.footer-links{
  display: grid;
  gap: 10px;
}
.footer-links a{
  text-decoration: none;
  color: rgba(255,255,255,.90);
  opacity: .92;
}
.footer-links a i{ color: rgba(233,199,207,.95); margin-right: 8px; }
.footer-mini{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(233,199,207,.18);
  padding: 10px 12px;
  border-radius: 14px;
}
.footer-mini i{ color: rgba(233,199,207,.95); }
.footer-bottom{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-between;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.12);
  opacity: .90;
}
.footer-small{ opacity: .78; }

/* Asegura que reglas globales NO alteren footer (sin mover su color) */
.footer h1,.footer h2,.footer h3,.footer h4,.footer h5,.footer h6,
.footer .footer-title{ color: rgba(255,255,255,.90); }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 991px){
  .hero{ padding-top: 34px; padding-bottom: 26px; }
  .gallery-tile img{ height: 180px; }
  .calendar-embed iframe{ height: 520px; }
}

@media (max-width: 576px){
  .hero-logo{ width: 120px; }
  .hero-kicker{ letter-spacing: .26em; font-size: .95rem; }
}


/* =========================================
   FIX AGENDA (Horarios/Contacto + Mapa)
   - Alinea alturas
   - Mapa full dentro con bordes redondeados
   - Evita recortes y “saltos”
   ========================================= */

/* 1) Asegura que las 2 columnas estiren igual (Bootstrap row) */
#agenda .row{
  align-items: stretch !important;
}

/* 2) Las dos tarjetas deben ocupar el 100% de altura */
#agenda .booking-card,
#agenda .calendar-embed{
  height: 100%;
  display: flex;
  flex-direction: column;
}


#agenda .booking-card,
#agenda .calendar-embed{
  padding: 18px !important;   /* consistente */
}

#agenda .calendar-embed{
  overflow: hidden;           /
}


#agenda .calendar-embed iframe{
  width: 100% !important;
  height: 100% !important;  
  min-height: 360px;          /* para desktop */
  border: 0 !important;
  border-radius: 16px !important;
  display: block;
}

#agenda .calendar-embed-head{
  flex: 0 0 auto;
  margin-bottom: 12px;
}
#agenda .calendar-embed iframe{
  flex: 1 1 auto;             /* ocupa el resto */
}

/* 7) En móvil, que no se aplaste el mapa */
@media (max-width: 991.98px){
  #agenda .calendar-embed iframe{
    min-height: 320px;
  }
}

/* 8) Si hay “línea” o borde raro por el shadow: suaviza */
#agenda .booking-card,
#agenda .calendar-embed{
  border-radius: 18px !important;
}


#agenda .map-wrap,
#agenda #map{
  width: 100%;
  height: 100%;
  min-height: 360px;
  border-radius: 16px;
  overflow: hidden;
}


/* =========================
   HORARIO + CONTACTO (premium)
   Solo estilos visuales — NO MAPA
   ========================= */

/* Contenedor general (tu tarjeta izquierda donde viene horario/contacto) */
.booking-card{
  position: relative;
}

/* Texto general dentro de la tarjeta */
.booking-card p,
.booking-card li,
.booking-card small{
  color: rgba(60,47,51,.75);
}

/* Título "Horario de atención" y "Ubicación" si vienen como h5/h6 o .booking-title */
.booking-card h4,
.booking-card h5,
.booking-card h6,
.booking-title{
  color: var(--inspo);
  font-weight: 950;
  letter-spacing: .2px;
}

/* Subtítulo "Atención con cita previa" */
.booking-card .text-muted,
.booking-card .booking-sub{
  color: rgba(60,47,51,.62) !important;
}

/* ===== HORARIOS en formato tarjetitas ===== */
/* Si tu horario está en líneas sueltas, esto lo acomoda como bloque elegante */
.hours-grid{
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

/* Cada fila tipo “L–V / 9:00–7:00” */
.hours-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255,255,255,.74);
  border: 1px solid rgba(199,146,127,.18);
  box-shadow: 0 10px 22px rgba(199,146,127,.10);
}

.hours-item .day{
  font-weight: 900;
  color: var(--inspo);
  letter-spacing: .02em;
}

.hours-item .time{
  font-weight: 800;
  color: rgba(60,47,51,.78);
}

/* Si NO tienes .day y .time, igual mejora cualquier <strong> dentro */
.hours-item strong{ color: var(--inspo); }

/* ===== CONTACTO + REDES ===== */
.contact-mini{
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

/* Cada línea: ícono + link */
.contact-mini-row{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255,255,255,.74);
  border: 1px solid rgba(199,146,127,.18);
  box-shadow: 0 10px 22px rgba(199,146,127,.10);
}

/* Burbuja del ícono */
.contact-mini-row i{
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--powder), var(--powder-2));
  border: 1px solid rgba(199,146,127,.22);
  color: #fff;                 /* ícono blanco */
  flex: 0 0 38px;
  box-shadow: 0 10px 22px rgba(199,146,127,.12);
  font-size: 1.05rem;
}

/* Enlace bonito + subrayado suave */
.contact-mini-row a{
  text-decoration: none;
  color: rgba(60,47,51,.86);
  font-weight: 800;
  border-bottom: 1px solid rgba(199,146,127,.32);
  padding-bottom: 2px;
}

.contact-mini-row a:hover{
  color: var(--inspo);
  border-bottom-color: rgba(199,146,127,.70);
}

/* Separador suave (si usas .divider-soft) */
.divider-soft{
  height: 1px;
  background: rgba(199,146,127,.18);
  width: 100%;
  margin: 14px 0;
}

/* ===== Responsive: que no se vea apretado ===== */
@media (max-width: 576px){
  .hours-item,
  .contact-mini-row{
    padding: 12px 12px;
  }
}

/* =========================================================
   BOOKING HEAD FLEX
   ========================================================= */
.booking-head{
  display: flex;
  align-items: center;
  gap: 12px;
}

/* =========================================================
   CALENDAR EMBED HEAD
   ========================================================= */
.calendar-embed-head{
  display: flex;
  align-items: center;
  gap: 10px;
}

/* =========================================================
   HOURS BADGE + TIME
   ========================================================= */
.hours-badge{
  font-weight: 900;
  color: var(--rosewood);
  background: rgba(233,199,207,.45);
  border: 1px solid rgba(139,76,91,.16);
  border-radius: 999px;
  padding: 3px 14px;
  font-size: .86rem;
  letter-spacing: .02em;
  white-space: nowrap;
}
.hours-time{
  font-weight: 700;
  color: rgba(60,47,51,.82);
  font-size: .93rem;
}

/* =========================================================
   ABOUT IMAGE + BADGE PREMIUM
   ========================================================= */
.about-image{
  position: relative;
  display: block;
}
.about-badge{
  position: absolute;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: linear-gradient(135deg, rgba(255,255,255,.96) 0%, rgba(255,247,240,.93) 100%);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1.5px solid rgba(199,146,127,.32);
  border-radius: 999px;
  padding: 10px 22px;
  font-weight: 800;
  font-size: .9rem;
  color: var(--rosewood);
  letter-spacing: .02em;
  white-space: nowrap;
  box-shadow:
    0 12px 32px rgba(139,76,91,.18),
    0 2px 8px rgba(0,0,0,.06),
    inset 0 1px 0 rgba(255,255,255,.85);
}
.about-badge i{
  color: var(--rose);
  font-size: 1.1rem;
  filter: drop-shadow(0 2px 4px rgba(199,146,127,.35));
}
@media (max-width: 576px){
  .about-badge{
    font-size: .82rem;
    padding: 8px 16px;
    bottom: 12px;
  }
}
