/* ===========================================================
   MCGL Consulting — hoja de estilos compartida
   =========================================================== */
/* Fuente de acento real del sitio (The Rickon), con fallback si el hotlink falla */
@font-face{
  font-family:'The Rickon';
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url('fonts/The-Rickon.woff') format('woff'),
       url('fonts/The-Rickon.ttf') format('truetype');
}
:root{
  /* Paleta real extraída del sitio (kit de colores globales de Elementor) */
  --primary:#E29706;      /* dorado/naranja — color primario de marca */
  --accent:#E39807;       /* dorado (casi idéntico al primario) */
  --blue:#1970A2;         /* azul — botones de acción */
  --black:#000000;
  --text:#1C1D1B;         /* texto — negro cálido */
  --muted:#8B8A8A;
  --bg:#ffffff;
  --bg-alt:#ECECEC;       /* gris claro de secciones alternas */
  --footer-dark:#3A3B3A;  /* barra inferior del footer */
  --border:#e2e2e2;
  --heading:#000000;
  --max:1200px;
  --radius:0px;           /* el sitio original es 100% plano, sin bordes redondeados */
  --shadow:none;          /* sin sombras en el sitio original */
  --display-font:'The Rickon', 'Anton', 'Arial Narrow', sans-serif;
  --whatsapp:#25D366;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.65;
  font-size:16px;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding-left:20px;}
.container{max-width:var(--max);margin:0 auto;padding:0 24px;}
h1,h2,h3,h4{color:var(--heading);font-weight:700;margin:0 0 16px;line-height:1.25;}
h1{font-size:2.4rem;}
h2{font-size:2rem;}
h3{font-size:1.25rem;}
p{margin:0 0 16px;}

/* ---------- Foco visible accesible (teclado) ---------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible{
  outline:2px solid var(--blue);
  outline-offset:2px;
}

/* ---------- Botones ---------- */
.btn{
  display:inline-block;
  background:var(--blue);
  color:#fff;
  padding:18px 22px;
  border-radius:0;
  font-weight:600;
  font-size:1rem;
  letter-spacing:normal;
  text-transform:none;
  border:none;
  cursor:pointer;
  transition:background .2s ease, opacity .2s ease;
}
.btn:hover{opacity:0.85;}
.btn:disabled{opacity:0.6;cursor:not-allowed;}
.btn-outline{background:transparent;color:var(--blue);border:2px solid var(--blue);}
.btn-outline:hover{background:var(--blue);color:#fff;}
.btn-gold{background:var(--primary);text-transform:uppercase;font-size:0.9rem;letter-spacing:0.03em;}
.req{color:#c0392b;}

/* ---------- Header / Navbar ---------- */
.site-header{
  padding:16px 0;
  border-bottom:1px solid var(--border);
  position:sticky;top:0;background:rgba(255,255,255,0.97);
  backdrop-filter:blur(6px);
  z-index:200;
}
.site-header .container{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.brand img{max-width:170px;}
.navbar ul{list-style:none;display:flex;gap:34px;padding:0;margin:0;}
.navbar a{
  font-weight:600;color:var(--black);font-size:1.125rem;
  position:relative;padding:6px 0;
}
.navbar a::after{
  content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--primary);
  transition:width .2s ease;
}
.navbar a:hover::after,
.navbar a.active::after{width:100%;}
.navbar a.active{color:var(--primary);}
.header-actions{display:flex;align-items:center;gap:18px;}
.header-actions .btn{padding:11px 24px;}
.menu-toggle{
  display:none;background:none;border:none;font-size:1.7rem;color:var(--primary);cursor:pointer;
  padding:4px 8px;
}

@media(max-width:900px){
  .navbar{display:none;}
  .header-actions .btn{display:none;}
  .menu-toggle{display:block;}
  /* Menu movil: navbar y boton fluyen uno debajo del otro dentro del mismo
     panel desplegable, en vez de posiciones absolutas con offsets fijos
     (fragil ante cambios en el contenido del menu). */
  .site-header.open .container{flex-wrap:wrap;}
  .site-header.open .navbar{
    display:block;order:3;width:100%;background:#fff;
    border-top:1px solid var(--border);padding:24px 24px 8px;box-shadow:0 12px 24px rgba(0,0,0,0.08);
  }
  .site-header.open .navbar ul{flex-direction:column;gap:20px;}
  .site-header.open .header-actions{
    display:block;order:4;width:100%;background:#fff;
    padding:0 24px 24px;box-shadow:0 12px 24px rgba(0,0,0,0.08);
  }
  .site-header.open .header-actions .btn{display:inline-block;}
}

/* ---------- Breadcrumb / page header (páginas internas) ---------- */
.page-header{
  position:relative;
  height:360px;
  background-size:cover;
  background-position:center;
  display:flex;align-items:flex-end;justify-content:flex-end;
  border-bottom:none;
  text-align:right;
  padding:0;
}
.page-header .container{padding-bottom:36px;}
.page-header h1{
  margin:0;font-size:2.6rem;color:var(--black);display:flex;align-items:center;justify-content:flex-end;gap:10px;
}
.page-header h1::before{
  content:"";width:0;height:0;
  border-top:12px solid transparent;border-bottom:12px solid transparent;
  border-left:16px solid var(--primary);
}
.page-header .subtitle{font-size:1.15rem;color:var(--black);margin:0 0 6px;text-align:right;}
.page-header .subtitle strong{color:var(--primary);}

/* ---------- Hero (home) ---------- */
.hero-banner{
  background-image:url('img/hero-banner.jpg');
  background-size:cover;
  background-position:center;
  border-bottom:4px solid var(--primary);
  padding:0;
}
.hero-banner .container{
  padding-top:70px;padding-bottom:70px;text-align:center;
}
.hero-banner .eyebrow{
  font-weight:600;color:var(--text);font-size:0.95rem;margin-bottom:4px;
}
.hero-banner .display-word{
  font-family:var(--display-font);
  font-weight:500;color:var(--primary);
  font-size:clamp(2.6rem, 7vw, 5.2rem);
  line-height:1;
  margin:0;
}
.hero{padding:52px 0 40px;text-align:center;}
.hero h1{
  font-size:1.25rem;font-weight:500;color:var(--black);
  max-width:640px;margin:0 auto 28px;
}
.hero-images{
  display:flex;justify-content:center;align-items:flex-end;gap:24px;
  flex-wrap:wrap;margin:32px 0;
}
.hero-images img.person{max-width:320px;}
.hero-images img.tri{max-width:220px;}
.hero-lede{max-width:640px;margin:20px auto 0;font-size:1rem;}

/* ---------- Secciones genéricas ---------- */
section{padding:64px 0;}
section.alt{background:var(--bg-alt);}
section.band-gold{background:var(--primary);color:#fff;padding:44px 0;}
section.band-gold h2,
section.band-gold h3{color:#fff;}
.section-head{text-align:center;max-width:720px;margin:0 auto 40px;}
.kicker{color:var(--primary);text-transform:uppercase;font-weight:700;font-size:0.85rem;letter-spacing:0.08em;}
.center{text-align:center;margin-top:36px;}

/* ---------- Bloque 3 pasos (patrimonio) ---------- */
.steps-block{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;}
.steps-block img{border-radius:var(--radius);}
.steps-list{list-style:none;padding:0;margin:0 0 24px;display:flex;flex-direction:column;gap:26px;}
.steps-list li{display:flex;gap:14px;align-items:flex-start;}
.steps-list .num{
  flex:none;color:var(--primary);font-weight:700;font-size:1.15rem;line-height:1.6;
}
@media(max-width:800px){.steps-block{grid-template-columns:1fr;}}

/* ---------- Cards / Servicios (grid genérico) ---------- */
.cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;}
.card{
  text-align:center;padding:30px 22px;background:#fff;
  border:1px solid var(--border);
  box-shadow:0 4px 14px rgba(0,0,0,0.06);
  transition:box-shadow .2s ease;
}
.card img{margin:0 auto 18px;width:64px;}
.card h3{font-size:1.125rem;font-weight:600;color:var(--black);}
/* ---------- Toggle acordeón de cada tarjeta (igual al sitio original) ---------- */
.card-toggle{
  display:flex;align-items:center;justify-content:center;
  margin:14px auto 0;background:none;border:none;cursor:pointer;
  color:var(--primary);padding:6px;width:100%;
}
.card-toggle .chev{width:22px;height:12px;transition:transform .25s ease;}
.card.open .card-toggle .chev{transform:rotate(180deg);}
.card-list{
  list-style:none;padding:0;color:var(--text);font-size:0.92rem;text-align:left;
  max-height:0;overflow:hidden;margin-top:0;
  transition:max-height .3s ease, margin-top .3s ease;
}
.card.open .card-list{max-height:400px;margin-top:16px;}
.card-list li{margin-bottom:6px;padding-left:18px;position:relative;}
.card-list li::before{content:"—";position:absolute;left:0;color:var(--primary);}
@media(max-width:900px){.cards-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.cards-grid{grid-template-columns:1fr;}}
.cards-grid-services{display:flex;flex-wrap:wrap;justify-content:center;}
.cards-grid-services .card{flex:0 1 calc((100% - 60px)/3);}
@media(max-width:900px){.cards-grid-services .card{flex:0 1 calc((100% - 30px)/2);}}
@media(max-width:600px){.cards-grid-services .card{flex:0 1 100%;}}

/* ---------- Fila de servicio grande (página Servicios) ---------- */
.service-row{
  display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;
  padding:56px 0;border-bottom:1px solid var(--border);
}
.service-row:last-of-type{border-bottom:none;}
.service-row.reverse .service-media{order:2;}
.service-row .service-icon{width:56px;margin-bottom:14px;}
.service-row img.service-media{border-radius:var(--radius);box-shadow:var(--shadow);}
@media(max-width:800px){
  .service-row{grid-template-columns:1fr;padding:36px 0;}
  .service-row.reverse .service-media{order:0;}
}

/* ---------- Oficinas (mapa) ---------- */
.offices-img{max-width:900px;margin:0 auto 40px;}
.offices-flags{display:flex;justify-content:center;gap:70px;flex-wrap:wrap;}
.offices-flags div{text-align:center;}
.offices-flags img{width:70px;margin:0 auto 12px;}

/* ---------- CTA banda (momento) ---------- */
.moment{
  background:var(--primary);color:#fff;text-align:center;padding:70px 0;
}
.moment h2{color:#fff;}
.moment .btn{margin-top:20px;background:var(--accent);border-color:var(--accent);}
.moment .btn:hover{background:#fff;color:var(--primary);border-color:#fff;}

/* ---------- Equipo ---------- */
.team-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;text-align:center;}
.team-grid img{width:110px;margin:0 auto 16px;}
.team-grid h3{margin-bottom:0;}
@media(max-width:700px){.team-grid{grid-template-columns:1fr;}}

/* ---------- Clientes ---------- */
.clients-grid{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;}
.client-card{
  border:1px solid var(--border);padding:20px 28px;min-width:220px;text-align:center;
  border-radius:var(--radius);background:#fff;
}
.client-card b{display:block;color:var(--primary);margin-bottom:6px;}
.client-card span{color:var(--accent);font-size:0.85rem;text-transform:uppercase;letter-spacing:0.04em;}

/* ---------- Nosotros: intro ---------- */
.about-intro{display:grid;grid-template-columns:1.1fr 0.9fr;gap:50px;align-items:center;}
@media(max-width:800px){.about-intro{grid-template-columns:1fr;}}

/* ---------- Formulario de contacto ---------- */
.contact-wrap{display:grid;grid-template-columns:1fr;gap:40px;max-width:560px;margin:0 auto;}
.contact-form{
  background:#fff;border:1px solid var(--border);
  padding:44px;box-shadow:0 20px 50px rgba(0,0,0,0.08);
  margin-top:-90px;position:relative;z-index:2;
}
.form-group{margin-bottom:18px;display:flex;flex-direction:column;gap:6px;}
.form-group label{font-size:0.9rem;font-weight:600;color:var(--black);}
.form-group input,
.form-group select,
.form-group textarea{
  padding:12px 14px;border:1px solid #999;border-radius:0;
  font-family:inherit;font-size:0.95rem;color:var(--text);background:#fff;
}
.form-group input::placeholder,
.form-group textarea::placeholder{color:#aaa;}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{outline:2px solid var(--primary);outline-offset:1px;border-color:var(--primary);}
.form-group textarea{resize:vertical;min-height:120px;}
.form-note{font-size:0.82rem;color:#888;margin-top:6px;}
.form-success,
.form-error{
  display:none;
  padding:14px 18px;border-radius:var(--radius);margin-top:16px;font-size:0.92rem;
}
.form-success{background:#eefaf0;border:1px solid #bfe6c4;color:#256a34;}
.form-error{background:#fdecea;border:1px solid #f3c2bd;color:#a12b23;}
.form-success.show,
.form-error.show{display:block;}
.honey-field{position:absolute;left:-9999px;top:-9999px;opacity:0;height:0;width:0;overflow:hidden;}

/* ---------- Footer ---------- */
.site-footer{background:var(--bg-alt);padding:0;}
.footer-content{padding:56px 0 40px;}
.footer-top{text-align:center;margin-bottom:20px;}
.footer-top img{max-width:150px;margin:-22px auto 6px;}
.footer-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:40px;align-items:start;}
.footer-grid>.office-block:first-child{justify-self:end;}
.office-block{display:flex;gap:16px;align-items:flex-start;}
.office-block img.badge{width:52px;flex:none;}
.office-block h4{margin-bottom:10px;font-weight:700;}
.office-block h4 .entity-tag{font-size:0.65em;font-weight:600;color:var(--primary);border:1px solid var(--primary);border-radius:4px;padding:1px 6px;margin-left:6px;vertical-align:middle;}
.office-block .row{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:0.94rem;}
.office-block .row img{width:16px;height:16px;flex:none;}
.office-block .row a{color:inherit;}
.office-block .row a:hover{color:var(--primary);}
@media(max-width:760px){.footer-grid{grid-template-columns:1fr;text-align:center;}
  .footer-grid>.office-block:first-child{justify-self:center;}
  .office-block{flex-direction:column;align-items:center;text-align:center;}}
.rights{
  text-align:center;background:var(--footer-dark);color:#fff;
  padding:18px 0;font-size:0.85rem;
}

/* ---------- Botón flotante de WhatsApp ---------- */
.whatsapp-float{
  position:fixed;
  right:22px;bottom:22px;
  width:60px;height:60px;
  background:var(--whatsapp);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px rgba(0,0,0,0.28);
  z-index:999;
  transition:transform .2s ease, box-shadow .2s ease;
}
.whatsapp-float:hover,
.whatsapp-float:focus-visible{
  transform:scale(1.08);
  box-shadow:0 8px 22px rgba(0,0,0,0.34);
  outline:none;
}
.whatsapp-float svg{width:32px;height:32px;fill:#fff;}
.whatsapp-float .wa-tooltip{
  position:absolute;right:72px;
  background:#111;color:#fff;font-size:0.82rem;font-weight:600;
  padding:8px 12px;border-radius:6px;white-space:nowrap;
  opacity:0;pointer-events:none;transform:translateX(6px);
  transition:opacity .2s ease, transform .2s ease;
}
.whatsapp-float:hover .wa-tooltip,
.whatsapp-float:focus-visible .wa-tooltip{opacity:1;transform:translateX(0);}
@media(max-width:600px){
  .whatsapp-float{width:52px;height:52px;right:16px;bottom:16px;}
  .whatsapp-float svg{width:28px;height:28px;}
  .whatsapp-float .wa-tooltip{display:none;}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{transition:none !important;}
}