/* =========================================================================
   Ber&Ber24 — estilos de marca para Astra + Elementor
   Clases para usar en Elementor › Avanzado › Clases CSS:
     Secciones:   bb-noche · bb-dia
     Textos:      bb-ante (antetítulo) · bb-entradilla · bb-cita
     Imágenes:    bb-arco (retrato en arco) · bb-foto-mono (monocromo cálido)
     Botones:     bb-btn-principal · bb-btn-secundario · bb-btn-texto  (en el widget Botón)
     Otros:       bb-cred (fila de credenciales) · bb-lista-rombo (lista con rombos)
   ========================================================================= */

/* ---------- Tipografías locales ---------- */
@font-face{font-family:"Cormorant Garamond";src:url("../fonts/cormorant-garamond.woff2") format("woff2");font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url("../fonts/cormorant-garamond-italic.woff2") format("woff2");font-weight:300 700;font-style:italic;font-display:swap}
@font-face{font-family:"Cinzel";src:url("../fonts/cinzel.woff2") format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:"Jost";src:url("../fonts/jost.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Jost";src:url("../fonts/jost-italic.woff2") format("woff2");font-weight:100 900;font-style:italic;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  --bb-ebano:#0C0B09; --bb-ebano-elevado:#17150F;
  --bb-oro:#D2A457; --bb-oro-claro:#EBCD8C; --bb-bronce:#8A5E22; --bb-oro-texto-claro:#8A5F22;
  --bb-marfil:#F7F4EE; --bb-blanco:#FFFFFF;
  --bb-tinta:#F2ECDF; --bb-tinta-suave:#B3A78F;
  --bb-tinta-dia:#17140E; --bb-tinta-suave-dia:#665B48;
  --bb-filete:#3A3225; --bb-filete-dia:#E0D6C2; --bb-filete-control:#7A6B50;
  --bb-f-display:"Cormorant Garamond",Garamond,"Times New Roman",serif;
  --bb-f-cap:"Cinzel","Times New Roman",serif;
  --bb-f-texto:"Jost","Futura","Century Gothic",sans-serif;
  /* colores de contexto (los cambian .bb-noche / .bb-dia) */
  --bb-c-texto:var(--bb-tinta); --bb-c-suave:var(--bb-tinta-suave); --bb-c-acento:var(--bb-oro);
  --bb-c-filete:var(--bb-filete); --bb-c-fondo-elev:var(--bb-ebano-elevado);
}

/* ---------- Base (sitio oscuro por defecto) ---------- */
body{background:var(--bb-ebano);color:var(--bb-tinta);font-family:var(--bb-f-texto);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.entry-title{font-family:var(--bb-f-display);font-weight:500;text-wrap:balance}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--bb-oro-claro);outline-offset:2px}
::selection{background:var(--bb-oro);color:var(--bb-ebano)}

/* ---------- Secciones Noche / Día ---------- */
.bb-noche{--bb-c-texto:var(--bb-tinta);--bb-c-suave:var(--bb-tinta-suave);--bb-c-acento:var(--bb-oro);--bb-c-filete:var(--bb-filete);--bb-c-fondo-elev:var(--bb-ebano-elevado);background-color:var(--bb-ebano);color:var(--bb-tinta)}
.bb-dia{--bb-c-texto:var(--bb-tinta-dia);--bb-c-suave:var(--bb-tinta-suave-dia);--bb-c-acento:var(--bb-oro-texto-claro);--bb-c-filete:var(--bb-filete-dia);--bb-c-fondo-elev:var(--bb-blanco);background-color:var(--bb-marfil);color:var(--bb-tinta-dia)}
.bb-noche .elementor-heading-title,.bb-dia .elementor-heading-title{color:var(--bb-c-texto)}
.bb-noche .elementor-widget-text-editor,.bb-dia .elementor-widget-text-editor{color:var(--bb-c-suave)}

/* ---------- Textos ---------- */
.bb-ante,.bb-ante .elementor-heading-title{font-family:var(--bb-f-cap)!important;font-size:12.5px!important;line-height:18px!important;letter-spacing:.2em!important;text-transform:uppercase;font-weight:500!important;color:var(--bb-c-acento)!important}
.bb-entradilla,.bb-entradilla p{font-size:19px;line-height:1.6;font-weight:300;color:var(--bb-c-suave)}
.bb-cita,.bb-cita p{font-family:var(--bb-f-display);font-style:italic;font-size:clamp(24px,2.6vw,30px);line-height:1.3;color:var(--bb-oro-claro)}
.bb-dia .bb-cita,.bb-dia .bb-cita p{color:var(--bb-oro-texto-claro)}
.bb-destacado em,.bb-destacado .elementor-heading-title em{font-style:italic;font-weight:400;color:var(--bb-oro-claro)}
.bb-dia .bb-destacado em{color:var(--bb-oro-texto-claro)}

/* ---------- Menú (cabecera de Astra) ---------- */
.main-header-menu .menu-link,.ast-builder-menu .menu-link{font-family:var(--bb-f-cap);font-size:13px;letter-spacing:.1em}

/* ---------- Botones (widget Botón de Elementor + botones de Astra) ---------- */
.bb-btn-principal .elementor-button,.ast-custom-button,.bb-btn-principal a{background:var(--bb-oro)!important;color:var(--bb-ebano)!important;border:1px solid var(--bb-oro)!important;border-radius:2px!important;font-family:var(--bb-f-texto)!important;font-size:14px!important;font-weight:500!important;letter-spacing:.06em!important;padding:14px 28px!important;transition:background .2s,border-color .2s}
.bb-btn-principal .elementor-button:hover,.ast-custom-button:hover{background:var(--bb-oro-claro)!important;border-color:var(--bb-oro-claro)!important}
.bb-dia .bb-btn-principal .elementor-button{background:var(--bb-oro-texto-claro)!important;border-color:var(--bb-oro-texto-claro)!important;color:#fff!important}
.bb-dia .bb-btn-principal .elementor-button:hover{background:var(--bb-bronce)!important}
.bb-btn-secundario .elementor-button{background:transparent!important;color:var(--bb-c-texto)!important;border:1px solid var(--bb-filete-control)!important;border-radius:2px!important;font-family:var(--bb-f-texto)!important;font-size:14px!important;font-weight:500!important;letter-spacing:.06em!important;padding:14px 28px!important}
.bb-btn-secundario .elementor-button:hover{border-color:var(--bb-c-acento)!important;color:var(--bb-c-acento)!important}
.bb-btn-texto .elementor-button,.bb-enlace{background:none!important;padding:4px 0!important;border:0!important;border-bottom:1px solid currentColor!important;border-radius:0!important;color:var(--bb-c-acento)!important;font-family:var(--bb-f-texto);font-size:14px;font-weight:500;letter-spacing:.06em;text-decoration:none}

/* ---------- Filete con rombo ([berber_filete]) ---------- */
.bb-filete{display:flex;align-items:center;gap:14px;color:var(--bb-c-acento);margin:0 auto;max-width:320px}
.bb-filete::before,.bb-filete::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,currentColor)}
.bb-filete::after{background:linear-gradient(90deg,currentColor,transparent)}
.bb-filete i{width:8px;height:8px;background:currentColor;transform:rotate(45deg)}

/* ---------- Retrato en arco ---------- */
.bb-arco{aspect-ratio:4/5;border-radius:999px 999px 0 0;overflow:hidden;position:relative;background:linear-gradient(170deg,#2A241A 0%,var(--bb-ebano-elevado) 55%,#0F0E0B 100%);display:grid;place-items:center;max-width:100%}
.bb-arco img{width:100%!important;height:100%!important;object-fit:cover;display:block}
.bb-arco::after{content:"";position:absolute;inset:10px 10px 0;border-radius:999px 999px 0 0;border:1px solid rgba(210,164,87,.4);border-bottom:0;pointer-events:none}
.bb-arco__ini{font-family:var(--bb-f-display);font-style:italic;font-size:clamp(56px,7vw,96px);color:var(--bb-oro);line-height:1}
.bb-dia .bb-arco{background:linear-gradient(170deg,#E9E1D0,#DCD0B8)}
.bb-dia .bb-arco__ini{color:var(--bb-oro-texto-claro)}
.bb-foto-mono img{filter:grayscale(1) sepia(.18) contrast(1.05)}

/* ---------- Portada: retratos de los asesores ([berber_asesores estilo="portada"]) ---------- */
.bb-duo{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:clamp(14px,2vw,24px);align-items:end}
.bb-duo__item{margin:0}
.bb-duo__item:nth-child(even){margin-bottom:clamp(28px,5vw,64px)}
.bb-duo figcaption{padding-top:16px;border-top:1px solid var(--bb-oro)}
.bb-duo figcaption b{display:block;font-family:var(--bb-f-display);font-weight:500;font-size:clamp(20px,2.2vw,26px);line-height:1.2;color:var(--bb-c-texto)}
.bb-duo figcaption span{font-size:13px;color:var(--bb-c-suave)}

/* ---------- Fichas de asesor ([berber_asesores]) ---------- */
.bb-equipo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,56px)}
.bb-asesor{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);gap:clamp(20px,3vw,36px);align-items:start}
.bb-asesor__cargo{font-family:var(--bb-f-cap);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--bb-c-acento)}
.bb-asesor__nombre{font-size:clamp(28px,3vw,36px)!important;line-height:1.1!important;margin:8px 0 16px!important;color:var(--bb-c-texto)}
.bb-asesor__bio{font-size:15.5px;line-height:1.7;color:var(--bb-c-suave);margin:0}
.bb-lista-rombo,.bb-lista-rombo ul{list-style:none!important;padding:0!important;margin:18px 0 22px!important;display:grid;gap:8px;font-size:14px}
.bb-lista-rombo li{display:flex;gap:10px;align-items:baseline;margin:0}
.bb-lista-rombo li::before{content:"";width:6px;height:6px;background:var(--bb-c-acento);transform:rotate(45deg) translateY(-2px);flex:none}
@media (max-width:900px){.bb-equipo{grid-template-columns:1fr}}
@media (max-width:560px){.bb-asesor{grid-template-columns:1fr}.bb-asesor .bb-arco{max-width:280px}}

/* ---------- Firma de asesor ([berber_asesor]) ---------- */
.bb-firma{display:flex;gap:20px;align-items:center;padding:24px;background:var(--bb-c-fondo-elev);border-top:1px solid var(--bb-c-acento);max-width:560px}
.bb-firma p{margin:0;font-size:14.5px;line-height:1.55;color:var(--bb-c-suave)}
.bb-firma b{display:block;color:var(--bb-c-texto);font-family:var(--bb-f-display);font-size:22px;font-weight:500}
.bb-arco--mini{width:72px;height:88px;aspect-ratio:auto;flex:none}
.bb-arco--mini::after{inset:5px 5px 0}
.bb-arco--mini .bb-arco__ini{font-size:34px}

/* ---------- Fila de credenciales ---------- */
.bb-cred{border-block:1px solid var(--bb-c-filete)}
.bb-cred .elementor-widget-wrap>.elementor-element,.bb-cred>.e-con-inner>.e-con,.bb-cred>.e-con{border-left:1px solid var(--bb-c-filete)}
.bb-cred .elementor-counter-number-wrapper,.bb-cred .elementor-heading-title{font-family:var(--bb-f-cap)!important;color:var(--bb-c-acento)!important}

/* ---------- Iconos de servicios (widget Cuadro de icono) ---------- */
.bb-servicio .elementor-icon{color:var(--bb-c-acento)!important;fill:var(--bb-c-acento)!important}
.bb-servicio .elementor-icon-box-title{font-family:var(--bb-f-display)!important;font-size:23px!important;color:var(--bb-c-texto)!important}
.bb-servicio .elementor-icon-box-description{font-size:14.5px!important;color:var(--bb-c-suave)!important}

/* ---------- Formularios ---------- */
.bb-noche input[type=text],.bb-noche input[type=email],.bb-noche input[type=tel],.bb-noche select,.bb-noche textarea{background:var(--bb-ebano)!important;color:var(--bb-tinta)!important;border:1px solid var(--bb-filete-control)!important;border-radius:2px!important}

.bb-aviso-admin{padding:12px 16px;border:1px dashed var(--bb-oro);color:var(--bb-oro);font-size:14px}

@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Email del asesor */
.bb-duo figcaption .bb-email{display:block;margin-top:6px;font-size:14px;color:var(--bb-c-acento);text-decoration:none;border-bottom:1px solid transparent;width:fit-content}
.bb-duo figcaption .bb-email:hover{border-bottom-color:currentColor}
.bb-asesor .bb-email{display:block;width:fit-content;margin:4px 0 14px;font-size:15px;color:var(--bb-oro);text-decoration:none;border-bottom:1px solid transparent;word-break:break-all}
.bb-asesor .bb-email:hover{border-bottom-color:currentColor}
.bb-dia .bb-asesor .bb-email{color:var(--bb-oro-texto-claro)}