@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;0,900;1,400;1,700&family=DM+Sans:wght@300;400;500&display=swap');

:root {
  --navy:     #C8C8C8;   /* GRIS oscuro — fondo principal de TODAS las páginas */
  --navy-dk:  #143263;          /* azul corporativo MÁS OSCURO (CTAs, footer, nav, contraste) */
  --navy-md:  #D8D8D8;   /* gris medio (secciones alternadas, cards) */
  --navy-lt:  #B8B8B8;   /* gris ligeramente más oscuro (hover) */
  --navy-xl:  #143263;   /* azul de contraste */
  --gold:     #D4A848;   /* dorado principal */
  --gold-lt:  #E0BC68;   /* dorado claro */
  --gold-dim: #B08A2E;   /* dorado apagado */
  --cream:    #C8C8C8;   /* gris (mismo que navy) */
  --cream-lt: #D8D8D8;
  --cream-dk: #B8B8B8;
  --cream-dim:#9C9C9C;
  --white:    #D8D8D8;
  --text:     #1A1A1A;          /* texto NEGRO */
  --muted:    #4A4A4A;          /* gris oscuro para descripciones */
  --border:   #A8A8A8;
  --blue:     #143263;          /* azul corporativo más oscuro */
  --blue-dk:  #0E2547;          /* azul muy oscuro (hover) */
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:hidden;width:100%;max-width:100%;scroll-padding-top:90px;}
section[id]{scroll-margin-top:90px;}
body{background:var(--navy);color:var(--text);font-family:'DM Sans',sans-serif;font-weight:300;overflow-x:hidden;width:100%;max-width:100%;position:relative;}
img{max-width:100%;height:auto;display:block;}
section{max-width:100%;overflow-x:hidden;}
nav,footer{max-width:100vw;}
main{max-width:100vw;overflow-x:hidden;}
*{min-width:0;}
p, h1, h2, h3, h4, h5, h6, li, span, div{
  word-wrap:break-word;
  overflow-wrap:break-word;
  max-width:100%;
}

/* ══ TEXTO JUSTIFICADO GLOBAL ══ */
p {
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
}
/* Excepciones: párrafos que deben quedar centrados (CTAs, hero) */
.cta-band p, .sv-cta p, .hero-new-sub, .construction-body,
.hero-scroll p, .ct-quote blockquote, .pillar-back p,
.why-back p, .pillar-front p, .why-front p {
  text-align: center;
  hyphens: none;
}

/* ══ NAV ══ */
nav{
  position:fixed;top:0;left:0;right:0;width:100%;z-index:100;
  background: #F4F7FB;
  border-bottom: 1px solid var(--gold);
  padding:0 60px;height:90px;
  display:flex;align-items:center;justify-content:space-between;
  transition:transform 0.45s ease, opacity 0.45s ease;
  box-shadow: 0 2px 18px rgba(20,50,99,0.12);
  box-sizing: border-box;
}
.nav-logo-img-wrap{
  display:flex !important;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  padding:8px 20px;
  margin:0;
  background: transparent;
  border: none;
  outline:none;
  border-radius: 0;
  box-shadow: none;
  transition: transform .3s;
  max-height: calc(100% - 16px);
  box-sizing: border-box;
}
.nav-logo-img-wrap:hover{
  transform: translateY(-1px);
  box-shadow: none;
}
.nav-logo-img-wrap::before,.nav-logo-img-wrap::after{display:none;}
.nav-logo-img{
  height:64px;width:auto;object-fit:contain;display:block;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,0.4));
  transition:transform .3s, filter .3s;
}
.nav-logo-img-wrap:hover .nav-logo-img{
  transform:scale(1.02);
  filter:drop-shadow(0 4px 14px rgba(201,168,76,0.3));
}
nav.nav--hidden{transform:translateY(-100%);opacity:0;pointer-events:none;}
.nav-logo{display:flex;align-items:center;gap:14px;text-decoration:none;}
.nav-monogram{width:40px;height:40px;background:var(--navy);display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-size:1rem;font-weight:700;color:var(--gold);}
.nav-name{font-family:'Playfair Display',serif;font-size:0.95rem;font-weight:400;letter-spacing:0.05em;color:var(--navy);}
.nav-name span{color:var(--gold);}
.nav-links{display:flex;align-items:center;gap:32px;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0;border-radius:0;border:none;box-shadow:none;}
.nav-links a{font-size:0.78rem;font-weight:500;letter-spacing:0.08em;color:var(--blue);text-decoration:none;transition:color .25s;padding:6px 0;border-radius:0;}
.nav-links a:hover,.nav-links a.active{color:var(--gold);background:transparent;}
.nav-links a:hover,.nav-links a.active{color:var(--gold);}
.nav-links a.nav-cta{background:var(--gold);color:#fff !important;padding:10px 24px;font-size:0.73rem !important;letter-spacing:0.1em !important;text-transform:uppercase;border-radius:2px;font-weight:600;}
.nav-links a.nav-cta:hover{background:var(--gold-lt);color:var(--navy) !important;}

/* Logo imagen izquierda — DESTACADO */
@keyframes logoShine {
  0%   { left: -80%; }
  100% { left: 160%;  }
}
@keyframes logoPulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(201,168,76,0); }
  50%      { box-shadow: 0 0 0 6px rgba(201,168,76,0.18); }
}

/* ══ FOOTER ══ */
footer{background:var(--navy-dk);padding:48px 72px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;}
.f-logo{font-family:'Playfair Display',serif;font-size:1rem;color:#FFFFFF;}
.f-logo em{color:var(--gold);font-style:normal;}
.f-links{display:flex;gap:28px;}
.f-links a{font-size:0.72rem;color:#FFFFFF;text-decoration:none;letter-spacing:0.08em;transition:color 0.2s;}
.f-links a:hover{color:var(--gold);}
.f-copy{font-size:0.68rem;color:#FFFFFF;text-align:right;}

/* ══ PAGE HEADER ══ */
.page-header{min-height:36vh;display:flex;align-items:flex-end;padding:120px 72px 56px;background:var(--blue);position:relative;overflow:hidden;margin-top:90px;}
.page-header::after{content:attr(data-title);position:absolute;right:60px;bottom:-30px;font-family:'Playfair Display',serif;font-size:12rem;font-weight:900;color:rgba(201,168,76,0.05);line-height:1;pointer-events:none;}
.ph-eyebrow{font-size:0.65rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;display:block;}
.ph-title{font-family:'Playfair Display',serif;font-size:clamp(2.8rem,5vw,4.2rem);font-weight:400;color:#fff;line-height:1.1;}
.ph-title em{font-style:italic;color:var(--gold);}

/* ══ HELPERS ══ */
.section-label{font-size:0.68rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:12px;}
.section-heading{font-family:'Playfair Display',serif;font-size:clamp(2.2rem,3vw,3rem);font-weight:700;color:var(--blue);line-height:1.15;}
.section-heading em{font-style:italic;}
.gold-pull{font-family:'Playfair Display',serif;font-size:1.35rem;font-style:italic;color:var(--blue);line-height:1.5;padding:28px 0 28px 28px;border-left:3px solid var(--gold);margin:36px 0;}

/* ══ BOTONES ══ */
.btn-primary{background:var(--gold);color: #fff;;padding:15px 32px;font-size:0.75rem;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;text-decoration:none;transition:background .3s,transform .2s;display:inline-block;}
.btn-primary:hover{background:var(--gold-lt);transform:translateY(-2px);}
.btn-outline{border:1px solid rgba(255,255,255,0.25);color:rgba(255,255,255,0.7);padding:15px 32px;font-size:0.75rem;letter-spacing:0.12em;text-transform:uppercase;text-decoration:none;transition:border-color .3s,color .3s;display:inline-block;}
.btn-outline:hover{border-color:var(--gold);color:var(--gold);}

/* ══════════════════════════════════
   INICIO
══════════════════════════════════ */
.hero{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;padding-top:90px;}
.hero-left{background:var(--navy);padding:80px 72px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;}
.hero-left::after{content:'JS';position:absolute;bottom:-40px;right:-20px;font-family:'Playfair Display',serif;font-size:18rem;font-weight:900;color:rgba(201,168,76,0.06);line-height:1;pointer-events:none;}
.hero-eyebrow{font-size:0.68rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--gold);margin-bottom:32px;}
.hero-left h1{font-family:'Playfair Display',serif;font-size:clamp(3rem,4.5vw,4.5rem);font-weight:400;color:var(--blue);line-height:1.12;margin-bottom:32px;}
.hero-left h1 em{font-style:italic;color:var(--gold);}
.hero-left p{font-size:0.9rem;line-height:1.85;color:var(--text);max-width:400px;margin-bottom:52px;}
.hero-btns{display:flex;gap:16px;}
.hero-right{background:var(--navy);padding:80px 72px;display:flex;flex-direction:column;justify-content:center;border-left:1px solid var(--border);}
.hero-right-title{font-size:0.68rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--muted);margin-bottom:36px;}
.highlight-list{list-style:none;}
.highlight-list li{padding:22px 0;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:20px;font-size:0.92rem;font-weight:400;}
.highlight-list li::before{content:'';width:8px;height:8px;background:var(--gold);flex-shrink:0;transform:rotate(45deg);}

@keyframes slide{from{opacity:0;transform:translateX(-24px);}to{opacity:1;transform:translateX(0);}}
.hero-left>*{animation:slide .8s ease forwards;opacity:0;}
.hero-eyebrow{animation-delay:.1s;}
.hero-left h1{animation-delay:.25s;}
.hero-left p{animation-delay:.4s;}
.hero-btns{animation-delay:.55s;}

/* Pilares */
.pillars-section{padding:100px 72px;background:var(--navy);}
.pillars-label{text-align:center;margin-bottom:60px;}
.pillars-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;background:transparent;}
.pillar-card{background:#F4F7FB;padding:52px 40px;transition:background .3s,border-color .3s,box-shadow .3s;border:1px solid rgba(201,168,76,0.3);border-radius:2px;}
.pillar-card:hover{background:#F4F7FB;border-color:var(--gold);box-shadow:0 4px 24px rgba(201,168,76,0.15);}
.pillar-num{font-family:'Playfair Display',serif;font-size:3rem;font-weight:900;color:var(--border);line-height:1;margin-bottom:20px;transition:color .3s;}
.pillar-card:hover .pillar-num{color:var(--gold);}
.pillar-name{font-family:'Playfair Display',serif;font-size:1.3rem;font-weight:700;color:var(--gold);margin-bottom:16px;}
.pillar-desc{font-size:0.87rem;line-height:1.85;color:var(--muted);}

/* Áreas */
.areas-section{padding:100px 72px;background:var(--navy);}
.areas-header{text-align:center;margin-bottom:60px;}
.areas-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;background:transparent;}
.area-card{background:#F4F7FB;padding:40px 32px;transition:background .3s,border-color .3s,box-shadow .3s;border:1px solid rgba(201,168,76,0.3);border-radius:2px;}
.area-card:hover{background:#F4F7FB;border-color:var(--gold);box-shadow:0 4px 24px rgba(201,168,76,0.15);}
.area-icon{font-size:1.6rem;margin-bottom:16px;display:block;}
.area-title{font-family:'Playfair Display',serif;font-size:1.05rem;font-weight:700;color:var(--gold);margin-bottom:10px;}
.area-desc{font-size:0.83rem;line-height:1.8;color:var(--muted);}

/* CTA final */
.cta-section{background:var(--blue);padding:100px 72px;}
.cta-inner{max-width:720px;margin:0 auto;text-align:center;}
.cta-quote{font-family:'Playfair Display',serif;font-size:clamp(1.2rem,2vw,1.6rem);font-style:italic;color:#fff;line-height:1.6;margin-bottom:40px;}

/* ══════════════════════════════════
   QUIÉNES SOMOS
══════════════════════════════════ */
.qs-section{padding:120px 72px;background:var(--navy);}
.quienes-layout{display:grid;grid-template-columns:320px 1fr;gap:100px;align-items:start;}
.qs-sidebar .num{width:64px;height:64px;display:flex;align-items:center;justify-content:center;color:var(--gold);margin-bottom:24px;}
.qs-sidebar .num svg{width:52px;height:52px;stroke-width:1.5;}
.qs-body p{font-size:0.9rem;line-height:1.9;color:var(--muted);margin-bottom:24px;}
.valores-row{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px;}
.valor-item{padding:32px 24px;border:1px solid var(--gold);border-radius:2px;text-align:center;background:#F4F7FB;transition:border-color .3s,box-shadow .3s;}
.valor-item:hover{box-shadow:0 4px 24px rgba(212,168,72,0.18);}
.valor-icon{display:block;margin-bottom:12px;font-size:1.6rem;}
.valor-name{font-size:0.85rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:8px;}
.valor-desc{font-size:0.85rem;color:var(--text);line-height:1.6;}

/* Misión y Visión */
.mv-section{padding:0 72px 80px;background:var(--navy);}
.mv-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;background:transparent;}
.mv-card{padding:60px 56px;background:#F4F7FB;border:1px solid rgba(201,168,76,0.3);border-radius:2px;transition:border-color .3s,box-shadow .3s;}
.mv-card:hover{border-color:var(--gold);box-shadow:0 4px 24px rgba(201,168,76,0.15);}
.mv-card--dark{background:#F4F7FB;}
.mv-title{font-family:'Playfair Display',serif;font-size:1.8rem;font-weight:400;color:var(--gold);margin-bottom:24px;margin-top:8px;}
.mv-title em{font-style:italic;}
.mv-card p{font-size:0.88rem;line-height:1.9;color:var(--muted);}

/* Equipo */
.team-section{padding:80px 72px 120px;background:var(--navy);}
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;background:transparent;margin-top:40px;}
.team-grid--two{grid-template-columns:repeat(2,1fr);}
.team-card{background:var(--blue);padding:40px 32px;text-align:center;transition:background .3s,border-color .3s,box-shadow .3s;border:1px solid var(--gold);border-radius:2px;}
.team-card:hover{background:var(--blue);border-color:var(--gold);box-shadow:0 4px 24px rgba(212,168,72,0.25);}
.team-card--large{text-align:left;}
.team-avatar{width:80px;height:80px;border-radius:50%;background:#F4F7FB;border:3px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-size:1.4rem;color:var(--blue);margin:0 auto 20px;font-weight:700;}
.team-card--large .team-avatar{margin:0 0 20px;}
.team-name{font-family:'Playfair Display',serif;font-size:1.1rem;font-weight:700;color:var(--gold);margin-bottom:6px;}
.team-role{font-size:0.76rem;color:rgba(255,255,255,0.75);margin-bottom:16px;}
.team-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px;}
.team-tag{font-size:0.68rem;font-weight:500;letter-spacing:0.06em;background:rgba(255,255,255,0.12);color:var(--gold);padding:4px 10px;border:1px solid rgba(212,168,72,0.4);}
.team-bio{font-size:0.84rem;line-height:1.85;color:#FFFFFF;margin-bottom:12px;}

/* Por qué elegirnos */
.why-section{background:var(--navy);padding:100px 72px;}
.why-inner{max-width:1400px;margin:0 auto;}
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;background:transparent;margin-top:48px;}
.why-item{background:#F4F7FB;padding:40px 36px;display:flex;gap:24px;transition:background .3s,border-color .3s,box-shadow .3s;border:1px solid rgba(201,168,76,0.3);border-radius:2px;}
.why-item:hover{background:#F4F7FB;border-color:var(--gold);box-shadow:0 4px 24px rgba(201,168,76,0.15);}
.why-num{width:52px;height:52px;display:flex;align-items:center;justify-content:center;color:var(--gold);flex-shrink:0;transition:color .3s,transform .3s;}
.why-num svg{width:40px;height:40px;stroke-width:1.5;}
.why-item:hover .why-num{color:var(--gold-lt);transform:scale(1.08);}
.why-title{font-family:'Playfair Display',serif;font-size:1.05rem;font-weight:700;color:var(--gold);margin-bottom:10px;}
.why-desc{font-size:0.85rem;line-height:1.85;color:var(--muted);}

/* ══════════════════════════════════
   SERVICIOS
══════════════════════════════════ */
.sv-section{padding:120px 72px;background:var(--navy);}
.sv-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:64px;}
.sv-header p{max-width:380px;font-size:0.88rem;line-height:1.8;color:var(--muted);}
.sv-list{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;background:transparent;}
.sv-item{background:#F4F7FB;padding:44px 48px;display:flex;gap:28px;align-items:flex-start;transition:background .3s,border-color .3s,box-shadow .3s;cursor:default;border:1px solid rgba(201,168,76,0.3);border-radius:2px;}
.sv-item:hover{background:#F4F7FB;border-color:var(--gold);box-shadow:0 4px 24px rgba(201,168,76,0.15);}
.sv-item:hover .sv-num{color:var(--gold-lt);}
.sv-num{width:60px;height:60px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--gold);transition:color .3s,transform .3s;}
.sv-num svg{width:42px;height:42px;stroke-width:1.5;}
.sv-item:hover .sv-num{transform:scale(1.08);}
.sv-title{font-family:'Playfair Display',serif;font-size:1.15rem;font-weight:700;color:var(--gold);margin-bottom:12px;}
.sv-desc{font-size:0.84rem;line-height:1.8;color:var(--muted);}
.sv-detail{font-size:0.76rem;color:var(--muted);opacity:.7;line-height:1.7;margin-top:12px;padding-top:12px;border-top:1px solid var(--border);}
.sv-more{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-size:0.72rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);transition:gap .25s;text-decoration:none;}
.sv-item:hover .sv-more{gap:14px;}

/* CTA servicios */
.sv-cta{background:var(--cream);padding:80px 72px;}
.sv-cta-inner{
  text-align:center;
  max-width:1100px;
  margin:0 auto;
  padding:70px 40px;
  border:1px solid var(--gold);
  border-radius:2px;
  background:#fff;
  box-shadow:0 4px 24px rgba(20,50,99,0.12);
  transition:border-color .3s, box-shadow .3s;
}
.sv-cta-inner:hover{
  border-color:var(--gold);
  box-shadow:0 4px 24px rgba(212,168,72,0.25);
}
.sv-cta-title{font-family:'Playfair Display',serif;font-size:1.8rem;font-weight:700;color:var(--gold);margin-bottom:16px;}
.sv-cta p{font-size:0.88rem;line-height:1.8;color:var(--text);max-width:600px;margin:0 auto;}

/* ══════════════════════════════════
   CONTACTO
══════════════════════════════════ */
.ct-wrapper{display:grid;grid-template-columns:1fr 1fr;min-height:680px;}
.ct-left{background:#F4F7FB;padding:80px 72px;display:flex;flex-direction:column;justify-content:center;}
.ct-left .section-heading{color:var(--blue);margin-bottom:32px;}
.ct-left p{font-size:0.88rem;line-height:1.85;color:var(--text);margin-bottom:52px;}
.info-lines{display:flex;flex-direction:column;gap:24px;}
.info-line{display:flex;gap:20px;align-items:center;}
.info-dot{width:6px;height:6px;background:var(--gold);border-radius:50%;flex-shrink:0;}
.info-text{font-size:0.86rem;color:var(--text);}
.info-text strong{display:block;color:var(--blue);font-weight:500;margin-bottom:2px;font-size:0.78rem;text-transform:uppercase;letter-spacing:.1em;}
.ct-quote{margin-top:48px;padding-top:40px;border-top:1px solid var(--gold);}
.ct-quote blockquote{font-family:'Playfair Display',serif;font-size:1rem;font-style:italic;color:var(--text);line-height:1.7;}
.ct-right{background:var(--navy-md);padding:80px 72px;display:flex;flex-direction:column;justify-content:center;}
.form-title{font-family:'Playfair Display',serif;font-size:1.6rem;font-weight:700;color:var(--gold);margin-bottom:40px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.fg{margin-bottom:20px;}
.fg label{display:block;font-size:0.68rem;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;font-weight:500;}
.fg input,.fg textarea,.fg select{width:100%;border:1px solid var(--border);background:#F4F7FB;padding:13px 16px;font-family:'DM Sans',sans-serif;font-size:.86rem;color:var(--text);outline:none;transition:border-color .25s;}
.fg input:focus,.fg textarea:focus,.fg select:focus{border-color:var(--gold);}
.fg textarea{height:120px;resize:none;}
.btn-send{background:#fff;color:var(--gold);border:2px solid var(--gold);padding:14px 38px;font-family:'DM Sans',sans-serif;font-size:.75rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;cursor:pointer;transition:background .3s,color .3s,border-color .3s,box-shadow .3s;margin-top:8px;border-radius:2px;}
.btn-send:hover{background:var(--gold);color:var(--navy);border-color:var(--gold-lt);box-shadow:0 4px 18px rgba(201,168,76,0.25);}
.btn-send:disabled{opacity:0.6;cursor:not-allowed;}

/* ══ WHATSAPP FLOTANTE ══ */
.wa-btn{position:fixed;bottom:32px;right:32px;z-index:999;width:60px;height:60px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(37,211,102,0.4);text-decoration:none;transition:transform 0.3s,box-shadow 0.3s;animation:waPulse 2.5s infinite;}
.wa-btn:hover{transform:scale(1.1);box-shadow:0 6px 28px rgba(37,211,102,0.55);}
.wa-btn svg{width:32px;height:32px;fill:#ffffff;}
.wa-tooltip{position:absolute;right:72px;background:#111;color:#fff;font-size:0.72rem;letter-spacing:0.06em;white-space:nowrap;padding:8px 14px;border-radius:4px;opacity:0;pointer-events:none;transition:opacity 0.25s;}
.wa-tooltip::after{content:"";position:absolute;right:-6px;top:50%;transform:translateY(-50%);border:6px solid transparent;border-right:none;border-left-color:#111;}
.wa-btn:hover .wa-tooltip{opacity:1;}
@keyframes waPulse{0%,100%{box-shadow:0 4px 20px rgba(37,211,102,0.4);}50%{box-shadow:0 4px 32px rgba(37,211,102,0.7);}}

/* ══ NAV HAMBURGUESA ══ */
.nav-hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:4px;}
.nav-hamburger span{display:block;width:24px;height:2px;background:var(--blue);transition:transform 0.3s,opacity 0.3s;}
.nav-mobile{display:none;flex-direction:column;background:#2A2A2A;position:fixed;top:90px;left:0;right:0;z-index:99;padding:0;max-height:0;overflow:hidden;transition:max-height 0.4s ease;}
.nav-mobile.open{max-height:400px;}
.nav-mobile a{padding:18px 28px;font-size:0.85rem;font-weight:500;color:rgba(255,255,255,0.75);text-decoration:none;border-bottom:1px solid rgba(255,255,255,0.06);letter-spacing:0.05em;transition:color 0.2s,background 0.2s;}
.nav-mobile a:hover,.nav-mobile a.active{color:var(--gold);background:rgba(255,255,255,0.04);}

/* ══════════════════════════════════════════════
   RESPONSIVE — Mobile First Adaptation
   Breakpoints:
   - 1200px+ : desktop XL (default)
   - 992-1199: desktop
   - 768-991 : tablet
   - 481-767 : mobile L
   - 320-480 : mobile S
══════════════════════════════════════════════ */

/* ── Desktop grande / 1200px+ usa los valores por defecto ── */

/* ══ TABLET LANDSCAPE / DESKTOP PEQUEÑO (max 1199px) ══ */
@media (max-width: 1199px) {
  nav{padding:0 40px;height:90px;}
  .nav-logo-img{height:64px;}
  .nav-links{gap:24px;}
  .nav-mobile{top:90px;}
  .page-header{margin-top:90px;padding:90px 40px 48px;}
  .hero{padding-top:90px;}

  .hero-left,.hero-right{padding:60px 40px;}
  .pillars-section,.areas-section,.cta-section,
  .pilares-section,.servicios-section,.cta-band,
  .qs-section,.team-section,.why-section,.sv-section,.sv-cta{padding-left:40px;padding-right:40px;}
  .ct-left,.ct-right{padding:60px 40px;}
  .quienes-layout{gap:60px;}
  footer{padding:40px 40px;}
}

/* ══ TABLET (max 991px) ══ */
@media (max-width: 991px) {
  nav{padding:0 32px;height:90px;}
  .nav-logo-img{height:64px;}
  .nav-links{display:none;}
  .nav-hamburger{display:flex;}
  .nav-mobile{display:flex;top:90px;}
  .page-header{margin-top:90px;padding:80px 32px 44px;}
  .hero{padding-top:90px;grid-template-columns:1fr;}
  .hero-right{display:none;}

  .areas-grid{grid-template-columns:1fr 1fr;}
  .pillars-grid{grid-template-columns:1fr 1fr;}
  .pilares-grid{grid-template-columns:1fr 1fr;}
  .servicios-grid{grid-template-columns:1fr 1fr;}
  .sv-list{grid-template-columns:1fr;}
  .why-grid{grid-template-columns:1fr 1fr;}
  .team-grid{grid-template-columns:1fr 1fr;}
  .team-grid--two{grid-template-columns:1fr 1fr;}

  .quienes-layout{grid-template-columns:1fr;gap:32px;}
  .valores-row{grid-template-columns:repeat(2,1fr);gap:16px;}
  .mv-grid{grid-template-columns:1fr;}
  .ct-wrapper{grid-template-columns:1fr;}
  .ct-left{border-right:none;border-bottom:1px solid var(--border);}

  .sv-header{flex-direction:column;gap:24px;align-items:flex-start;}
  footer{grid-template-columns:1fr;gap:18px;text-align:center;}
  .f-copy{text-align:center;}
  .f-links{justify-content:center;flex-wrap:wrap;gap:16px 24px;}
}

/* ══ MOBILE GRANDE (max 767px) ══ */
@media (max-width: 767px) {
  nav{padding:0 18px;height:90px;}
  .nav-logo-img{height:60px;}
  .nav-logo-img-wrap{padding:6px 14px;border-width:1.5px;}
  .nav-mobile{top:90px;}
  .page-header{margin-top:90px;padding:70px 22px 40px;}
  .ph-title{font-size:clamp(2rem,7vw,2.8rem);}
  .page-header::after{font-size:7rem;right:20px;bottom:-15px;}

  .hero{padding-top:90px;}
  .hero-left{padding:50px 22px;}
  .hero-left h1{font-size:clamp(2.2rem,8vw,3rem);margin-bottom:24px;}
  .hero-left p{font-size:0.88rem;margin-bottom:36px;}
  .hero-btns{flex-direction:column;gap:12px;align-items:flex-start;}
  .hero-btns .btn-primary,.hero-btns .btn-outline{width:100%;text-align:center;}

  /* INICIO landing page (con Sanhattan) */
  .hero-new-inner{padding:0 22px;gap:1rem;}
  .hero-new h1{font-size:clamp(2.2rem,9vw,3.4rem);letter-spacing:0.06em;}
  .hero-new-eyebrow{font-size:0.62rem;letter-spacing:0.2em;}
  .hero-new-sub{font-size:0.95rem;}
  .hero-new-btns{flex-direction:column;width:100%;max-width:280px;margin:0 auto;}
  .hero-new-btns .btn-gold,.hero-new-btns .btn-border{width:100%;text-align:center;}
  .hero-scroll{bottom:1.5rem;}

  /* Secciones principales */
  .pillars-section,.areas-section,.cta-section,
  .pilares-section,.servicios-section,.cta-band,
  .qs-section,.team-section,.why-section,
  .sv-section,.sv-cta,.mv-section{padding:60px 22px;}
  .mv-section{padding:0 22px 60px;}

  .pillars-grid,.pilares-grid{grid-template-columns:1fr;gap:1.4rem;}
  .areas-grid{grid-template-columns:1fr;}
  .servicios-grid{grid-template-columns:1fr;}
  .why-grid{grid-template-columns:1fr;}
  .team-grid,.team-grid--two{grid-template-columns:1fr;}
  .mv-card{padding:36px 22px;}

  .section-heading{font-size:1.7rem;}
  .s-title{font-size:1.5rem;}

  /* Pilares con flip - ajuste de altura */
  .pillar-flip,.pillar-flip-inner{min-height:240px;}
  .pillar-front,.pillar-back{padding:30px 22px;}

  /* Servicios */
  .sv-item{padding:30px 22px;gap:18px;flex-direction:column;}
  .sv-num{width:48px;height:48px;}
  .sv-num svg{width:34px;height:34px;}
  .svc-overlay{padding:1.4rem;}
  .svc-title{font-size:1.1rem;}

  /* Quienes */
  .quienes-layout{gap:24px;}
  .qs-sidebar .num{width:54px;height:54px;}
  .qs-sidebar .num svg{width:42px;height:42px;}
  .qs-sidebar .section-heading{font-size:1.6rem;}
  .qs-body p{font-size:0.88rem;line-height:1.8;}
  .valores-row{grid-template-columns:1fr;gap:14px;margin-top:32px;}
  .valor-item{padding:24px 18px;}
  .valor-name{font-size:0.78rem;}
  .valor-desc{font-size:0.82rem;}
  .gold-pull{font-size:1.05rem;padding:18px 0 18px 18px;margin:24px 0;}
  .team-card--large{text-align:center;}
  .team-card--large .team-avatar{margin:0 auto 20px;}

  .why-item{padding:30px 22px;gap:18px;}
  .why-num{width:46px;height:46px;}
  .why-num svg{width:34px;height:34px;}

  .team-card{padding:32px 22px;}
  .team-avatar{width:68px;height:68px;font-size:1.2rem;}

  /* Contacto */
  .ct-left,.ct-right{padding:50px 22px;}
  .form-row{grid-template-columns:1fr;}
  .form-title{font-size:1.4rem;}
  .ct-left .section-heading{font-size:1.7rem;}
  .info-line{align-items:flex-start;}

  /* Botones generales */
  .btn-primary,.btn-outline,.btn-gold,.btn-border,.btn-navy,.btn-send{font-size:0.7rem;padding:13px 22px;}

  /* WhatsApp button */
  .wa-btn{bottom:18px;right:18px;width:54px;height:54px;}
  .wa-btn svg{width:28px;height:28px;}
  .wa-tooltip{display:none;}

  /* Footer */
  footer{padding:36px 22px;}
  .f-logo{font-size:0.95rem;}
}

/* ══ MOBILE PEQUEÑO (max 480px) ══ */
@media (max-width: 480px) {
  nav{padding:0 14px;height:90px;}
  .nav-logo-img{height:54px;}
  .nav-mobile{top:90px;}
  .nav-mobile a{padding:14px 22px;font-size:0.8rem;}
  .page-header{margin-top:90px;padding:60px 16px 32px;}
  .ph-title{font-size:1.7rem;line-height:1.15;}
  .page-header::after{display:none;}

  .hero{padding-top:90px;}
  .hero-left{padding:40px 16px;}
  .hero-left h1{font-size:2rem;}
  .hero-eyebrow,.hero-new-eyebrow{font-size:0.6rem;letter-spacing:0.18em;}

  .hero-new-inner{padding:0 16px;}
  .hero-new h1{font-size:2.2rem;}
  .hero-new-sub{font-size:0.88rem;}

  .pillars-section,.areas-section,.cta-section,
  .pilares-section,.servicios-section,.cta-band,
  .qs-section,.team-section,.why-section,
  .sv-section,.sv-cta{padding:48px 16px;}
  .mv-section{padding:0 16px 48px;}

  .section-heading{font-size:1.4rem;line-height:1.2;}
  .section-label{font-size:0.62rem;letter-spacing:0.18em;}
  .s-title{font-size:1.3rem;}

  .pillar-front,.pillar-back{padding:24px 18px;}
  .pillar-front h3,.pillar-back h3{font-size:1.05rem;}
  .pillar-front p,.pillar-back p{font-size:0.85rem;}

  .sv-item{padding:24px 18px;}
  .sv-title{font-size:1.05rem;}
  .sv-desc{font-size:0.82rem;}

  .qs-sidebar .num{width:46px;height:46px;}
  .qs-sidebar .num svg{width:36px;height:36px;}

  .why-item{padding:24px 18px;}
  .why-title{font-size:1rem;}
  .why-desc{font-size:0.83rem;}

  .ct-left,.ct-right{padding:40px 16px;}
  .form-title{font-size:1.25rem;margin-bottom:24px;}
  .fg input,.fg textarea,.fg select{padding:11px 14px;font-size:0.85rem;}

  .gold-pull{font-size:1.1rem;padding:20px 0 20px 18px;}

  .wa-btn{bottom:14px;right:14px;width:48px;height:48px;}
  .wa-btn svg{width:24px;height:24px;}

  footer{padding:28px 16px;}
  .f-logo{font-size:0.85rem;}
  .f-links{gap:12px 18px;}
  .f-links a{font-size:0.68rem;}
  .f-copy{font-size:0.62rem;}
}

/* ══ AJUSTES TÁCTILES (touch devices) ══ */
@media (hover: none) and (pointer: coarse) {
  /* Pilares: en táctil el flip se hace al toque */
  .pillar-flip:active .pillar-flip-inner{transform:rotateY(180deg);}

  /* Hover effects sutiles para no requerir hover */
  .area-card:active,.pillar-card:active,.sv-item:active,
  .why-item:active,.team-card:active{background:var(--cream-dk);}
}

/* ══ ORIENTACIÓN HORIZONTAL EN MÓVIL ══ */
@media (max-height: 500px) and (orientation: landscape) {
  nav{height:90px;}
  .nav-logo-img{height:60px;}
  .hero,.hero-new{min-height:auto;padding-top:60px;padding-bottom:40px;}
  .hero-new-inner{min-height:auto;padding:40px 6vw;}
  .hero-scroll{display:none;}
}