/* ── T10 Sidebar Right Dark ── */
body.wb-template-10 {
  margin: 0; padding: 0;
  background: #f1f5f9; color: #1e293b;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  overflow-x: hidden;
}

body.wb-template-10 #wbHero img { width: 100%; height: 100%; object-fit: cover; display: block; }
body.wb-template-10 .wb-hero-overlay::-webkit-scrollbar { display: none; }

body.wb-template-10 .wb-profile-header {
  display: flex; flex-direction: column; align-items: center;
  gap: 14px; color: white; text-align: center;
}
body.wb-template-10 .wb-avatar {
  width: 80px; height: 80px;
  background: rgba(59,130,246,0.2); border: 2px solid #3b82f6;
  color: white; font-weight: 700; font-size: 26px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4);
}
body.wb-template-10 .wb-profile-info { width: 100%; }
body.wb-template-10 .wb-name     { font-size: 17px; font-weight: 700; color: white; margin: 0 0 4px; line-height: 1.2; }
body.wb-template-10 .wb-prof     { font-size: 12px; font-weight: 600; color: #93c5fd; margin: 0 0 3px; }
body.wb-template-10 .wb-location,
body.wb-template-10 .wb-address  { font-size: 11px; color: rgba(255,255,255,0.45); margin: 0; }

/* Bio en sidebar (no scroll) */
body.wb-template-10 .wb-sidebar-bio {
  margin-top: 20px;
}
body.wb-template-10 .wb-sidebar-bio .wb-bio { font-size: 13px; line-height: 1.7; color: rgba(255,255,255,0.75); margin: 0; }

body.wb-template-10 .wb-logo-container { background: transparent; display: flex; align-items: center; justify-content: center; padding: 8px 0; width: 100%; }
body.wb-template-10 .wb-logo-container img { width: auto; height: 108px; max-width: 216px; object-fit: contain; display: block; }

/* Botones y redes */
body.wb-template-10 .wb-actions-section { background: white; }
body.wb-template-10 .wb-btn {
  display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 10px;
  border: 1px solid #e2e8f0; background: #f8fafc; color: #0f172a;
  font-size: 13px; font-weight: 600; text-decoration: none; transition: all 0.2s;
}
body.wb-template-10 .wb-btn:hover { background: #eff6ff; border-color: #3b82f6; color: #3b82f6; }
body.wb-template-10 .wb-btn--directions { background: #f8fafc; color: #0f172a !important; }
body.wb-template-10 .wb-btn--directions:hover { background: #eff6ff; color: #3b82f6 !important; }

body.wb-template-10 .wb-section-title  { font-size: 20px; font-weight: 700; color: #0f172a; margin-bottom: 16px; }
body.wb-template-10 .wb-module-title   { font-size: 20px; font-weight: 700; color: #0f172a; margin-bottom: 16px; }
body.wb-template-10 .wb-portfolio-grid { display: flex; flex-direction: column; }
body.wb-template-10 .wb-portfolio-card:hover { box-shadow: 0 4px 16px rgba(59,130,246,0.12); border-color: #93c5fd; }
body.wb-template-10 .wb-portfolio-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
body.wb-template-10 .wb-portfolio-content { padding: 10px 12px; min-width: 0; }
body.wb-template-10 .wb-portfolio-title    { font-size: 13px; font-weight: 700; color: #0f172a; margin-bottom: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.wb-template-10 .wb-portfolio-subtitle { font-size: 11px; color: #64748b; margin-bottom: 3px; }
body.wb-template-10 .wb-portfolio-desc     { font-size: 11px; color: #94a3b8; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }

/* col-extra */
body.wb-template-10 .wb-col-extra .wb-module--map       { display: flex; flex-direction: column; overflow: hidden; }
body.wb-template-10 .wb-col-extra .wb-module--map .wb-map-body   { flex: 1; padding: 0 12px 12px; min-height: 0; }
body.wb-template-10 .wb-col-extra .wb-module--map .wb-map-iframe { width: 100%; height: 100%; display: block; border: 0; border-radius: 8px; }
body.wb-template-10 .wb-col-extra .wb-module--schedule    { width: 100%; }
body.wb-template-10 .wb-col-extra .wb-module--testimonials { width: 100%; }

/* ── DESKTOP ≥769px ── */
@media (min-width: 769px) {
  body.wb-template-10 .wb-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 300px;
    grid-template-rows: auto auto auto;
    min-height: 100vh; max-width: none; padding: 0;
  }


  /* Bio móvil: oculta en escritorio */
  body.wb-template-10 .wb-bio-section.wb-bio-mobile { display: none !important; }
  /* Actions: oculta en grid (JS la mueve a col-extra) */
  body.wb-template-10 .wb-actions-section {
    display: contents; /* no ocupa espacio en el grid, pero JS puede moverla */
  }
  body.wb-template-10 .wb-hero-section {
    grid-column: 4; grid-row: 1 / -1;
    position: sticky; top: 0; height: 100vh;
    background: #0f172a; border-left: 3px solid #3b82f6;
    display: flex; flex-direction: column; overflow: hidden;
  }
  body.wb-template-10 #wbHero { flex: 0 0 200px; width: 100%; background: #1e293b; overflow: hidden; }
  body.wb-template-10.wb-no-hero #wbHero { flex: 0 0 0px; }
  body.wb-template-10 .wb-hero-overlay {
    flex: 1; padding: 24px 24px 28px;
    display: flex; flex-direction: column; overflow: hidden;
  }

  body.wb-template-10 .wb-modules-container {
    grid-column: 1 / 4; grid-row: 1;
    display: grid; grid-template-columns: 2fr 1fr;
    gap: 0; align-items: start; align-self: stretch;
  }
  body.wb-template-10 .wb-modules-container > * {
    padding: 36px 24px 48px; border-right: 1px solid #e2e8f0;
    background: white; min-height: 100%; box-sizing: border-box; min-width: 0;
  }
  body.wb-template-10 .wb-main-col { display: flex; flex-direction: column; min-width: 0; }
  body.wb-template-10 .wb-modules-container > *:last-child { background: #f8fafc; border-right: none; }
  body.wb-template-10 .wb-modules-container.wb-mc--no-sidebar { grid-template-columns: 1fr; }
  body.wb-template-10 .wb-modules-container.wb-mc--no-sidebar .wb-col-extra { display: none !important; }
  body.wb-template-10 .wb-col-extra { padding: 36px 0 0 0; overflow: hidden; display: flex; flex-direction: column; gap: 24px; }

  body.wb-template-10 .wb-portfolio-card {
    display: grid; grid-template-columns: 100px 1fr; align-items: center;
    background: white; border-radius: 10px; overflow: hidden;
    border: 1px solid #e2e8f0; box-shadow: 0 2px 6px rgba(0,0,0,0.04);
    margin-bottom: 14px; transition: all 0.2s; text-decoration: none;
  }
  body.wb-template-10 .wb-portfolio-card:not(:has(.wb-portfolio-media)),
  body.wb-template-10 .wb-portfolio-card.wb-no-media { grid-template-columns: 1fr; }
  body.wb-template-10 .wb-portfolio-media { width: 100px; height: 80px; overflow: hidden; align-self: stretch; }

  body.wb-template-10 .wb-footer-section {
    grid-column: 1 / 4; grid-row: 2;
    padding: 14px 24px; background: white; border-top: 1px solid #e2e8f0;
  }
}

/* ── MEDIO 769px–1280px ── */
@media (min-width: 769px) and (max-width: 1280px) {
  body.wb-template-10 .wb-wrap { grid-template-columns: 1fr 1fr 300px; max-width: 100%; }
  body.wb-template-10 .wb-actions-section { grid-column: 1 / 3; }
  body.wb-template-10 .wb-modules-container { grid-column: 1 / 3; grid-template-columns: 1fr 1fr; }
  body.wb-template-10 .wb-hero-section { grid-column: 3; grid-row: 1 / -1; }
  body.wb-template-10 .wb-footer-section { grid-column: 1 / 3; }
}

/* ── MÓVIL ≤768px ── */
@media (max-width: 768px) {
  body.wb-template-10 .wb-wrap[data-wb-v5="1"] {
    display: flex !important; flex-direction: column !important; max-width: 100% !important; padding: 0 !important;
  }
  body.wb-template-10 .wb-wrap[data-wb-v5="1"] > * { width: 100% !important; box-sizing: border-box !important; }

  body.wb-template-10 .wb-hero-section {
    display: block !important; position: relative !important;
    min-height: 260px !important; height: auto !important;
    overflow: hidden !important; background: #0f172a !important;
  }
  body.wb-template-10 #wbHero {
    display: block !important; position: absolute !important; inset: 0 !important;
    width: 100% !important; height: 100% !important; z-index: 0 !important; overflow: hidden !important;
  }
  body.wb-template-10 #wbHero img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
  body.wb-template-10 .wb-hero-overlay {
    display: block !important; position: absolute !important;
    bottom: 0 !important; left: 0 !important; right: 0 !important; z-index: 2 !important;
    padding: 14px 18px 18px !important;
    background: rgba(15,23,42,0.85) !important; backdrop-filter: blur(8px) !important;
    border-top: 1px solid rgba(255,255,255,0.15) !important; overflow: hidden !important;
  }
  body.wb-template-10 .wb-sidebar-bio { display: none !important; }
  body.wb-template-10 .wb-profile-header {
    display: flex !important; flex-direction: row !important; align-items: center !important; gap: 12px !important;
  }
  body.wb-template-10 .wb-avatar { width: 60px !important; height: 60px !important; flex-shrink: 0 !important; }
  body.wb-template-10 .wb-profile-info { flex: 1 !important; min-width: 0 !important; }
  body.wb-template-10 .wb-name  { color: white !important; font-size: 17px !important; margin: 0 0 2px !important; }
  body.wb-template-10 .wb-prof  { color: #93c5fd !important; font-size: 12px !important; margin: 0 !important; }
  body.wb-template-10 .wb-location, body.wb-template-10 .wb-address { color: rgba(255,255,255,0.6) !important; font-size: 11px !important; }
  body.wb-template-10 .wb-logo-container { flex-shrink: 0 !important; max-width: 80px !important; padding: 0 !important; }
  body.wb-template-10 .wb-logo-container img { height: 48px !important; max-width: 80px !important; width: auto !important; }

  body.wb-template-10 .wb-modules-container { display: flex !important; flex-direction: column !important; padding: 16px !important; gap: 16px !important; }
  body.wb-template-10 .wb-col-extra { display: flex !important; flex-direction: column !important; gap: 16px !important; }


  body.wb-template-10 .wb-bio-section.wb-bio-mobile { display: block !important; }
  body.wb-template-10 .wb-wrap[data-wb-v5="1"] > .wb-hero-section     { order: 1 !important; }
  body.wb-template-10 .wb-wrap[data-wb-v5="1"] > .wb-actions-section  { order: 2 !important; }
  body.wb-template-10 .wb-wrap[data-wb-v5="1"] > .wb-bio-section      { order: 3 !important; }
  body.wb-template-10 .wb-wrap[data-wb-v5="1"] > .wb-modules-container { order: 5 !important; }
  body.wb-template-10 .wb-wrap[data-wb-v5="1"] > .wb-footer-section   { order: 99 !important; }
}

/* Publicaciones */
body.wb-template-10 .wb-main-col .wb-publications-section { padding: 24px 0 40px; box-sizing: border-box; width: 100%; }
body.wb-template-10 .wb-main-col .wb-publications-section .wb-pub-card { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; }
body.wb-template-10 .wb-main-col .wb-publications-section .wb-pub-ptitle { color: #0f172a; font-weight: 700; }
body.wb-template-10 .wb-main-col .wb-publications-section .wb-pub-more   { color: #3b82f6; }

/* Redes sociales */
body.wb-template-10 .wb-social-module { }

/* Botones y redes dentro de col-extra */
body.wb-template-10 .wb-sidebar-contact {
  padding: 0 12px 8px;
  display: flex; flex-direction: column; gap: 8px;
}
body.wb-template-10 .wb-sidebar-contact .wb-actions { flex-direction: column; gap: 8px; }
body.wb-template-10 .wb-sidebar-contact .wb-social-module { padding: 6px 0 0; }

body.wb-template-10 .wb-col-extra .wb-actions-section {
  padding: 12px 12px 8px; background: transparent;
  display: flex !important; flex-direction: column; gap: 8px;
}
body.wb-template-10 .wb-col-extra .wb-actions { flex-direction: column; gap: 8px; }
body.wb-template-10 .wb-col-extra .wb-social-module { padding: 4px 0 0; }

body.wb-template-10 .wb-rating { margin-left:auto; margin-right:auto; }

@media (max-width: 600px) {
  body.wb-template-10 .wb-rating { margin-left: 0; margin-right: 0; }
}

@media (max-width: 600px) {
  body.wb-template-10 .wb-portfolio-title { white-space: normal; overflow: visible; text-overflow: clip; word-break: break-word; }
  body.wb-template-10 .wb-portfolio-subtitle { white-space: normal; overflow: visible; text-overflow: clip; word-break: break-word; }
  body.wb-template-10 .wb-portfolio-content { min-width: 0; overflow: hidden; }
}