:root{
  --navy:#132A44;
  --navy-deep:#0C1C2E;
  --orange:#C8672E;
  --teal:#276E68;
  --gold:#B8933F;
  --cream:#FBF7EF;
  --paper:#F3EDE1;
  --ink:#1C2521;
  --line:rgba(19,42,68,.14);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Work Sans', sans-serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4{
  font-family:'Fraunces', serif;
  font-weight:500;
  margin:0 0 .5em;
  color:var(--navy-deep);
}
a{color:inherit; text-decoration:none;}
img,svg{max-width:100%; display:block;}
::selection{background:var(--orange); color:var(--cream);}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:2px solid var(--orange); outline-offset:3px;
}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}
.wrap{max-width:1120px; margin:0 auto; padding:0 28px;}
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 26px; border-radius:2px;
  font-family:'Work Sans',sans-serif; font-weight:600; font-size:.95rem;
  text-decoration:none; border:1.5px solid transparent; cursor:pointer;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.btn-solid{background:var(--orange); color:var(--cream);}
.btn-solid:hover{background:#a95523;}
.btn-outline{border-color:var(--navy); color:var(--navy);}
.btn-outline:hover{background:var(--navy); color:var(--cream);}

/* WhatsApp flotante */
.wa-float{
  position:fixed; bottom:32px; right:32px; z-index:999;
  width:54px; height:54px; border-radius:50%;
  background:#25a050; display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 20px rgba(37,160,80,.4);
  transition:transform .2s ease, box-shadow .2s ease;
}
.wa-float:hover{transform:scale(1.08) translateY(-2px); box-shadow:0 8px 28px rgba(37,160,80,.5);}
.wa-float svg{width:28px; height:28px; fill:#fff;}

/* Header */
header{
  position:sticky; top:0; z-index:100;
  background:rgba(251,247,239,.92); backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex; align-items:center; justify-content:space-between; padding:16px 28px; max-width:1120px; margin:0 auto;}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none;}
.brand img{width:40px; height:auto; display:block;}
.brand-name{font-family:'Fraunces',serif; font-size:1.25rem; color:var(--navy-deep); letter-spacing:.02em;}
nav.links{display:flex; gap:32px; font-size:.95rem;}
nav.links a{text-decoration:none; color:var(--navy); position:relative;}
nav.links a::after{content:""; position:absolute; left:0; bottom:-4px; width:0; height:1px; background:var(--orange); transition:width .2s;}
nav.links a:hover::after{width:100%;}
.nav-cta{display:flex; align-items:center; gap:20px;}
.menu-toggle{
  display:none; align-items:center; justify-content:center;
  width:44px; height:44px; margin:-8px -8px -8px 0;
  background:none; border:none; border-radius:2px;
  font-size:1.4rem; line-height:1; cursor:pointer; color:var(--navy);
}

/* Hero */
.hero{padding:88px 0 72px; position:relative; overflow:hidden;}
.hero .wrap{display:grid; grid-template-columns:1.15fr .85fr; gap:56px; align-items:center;}
.eyebrow{font-size:.9rem; color:var(--teal); margin-bottom:14px; font-weight:500;}
.hero h1{font-size:clamp(2.3rem,4.2vw,3.4rem); line-height:1.12;}
.hero h1 em{font-style:italic; color:var(--orange);}
.hero p.lede{font-size:1.1rem; max-width:44ch; color:#3B4B44; margin-bottom:28px;}
.hero-actions{display:flex; gap:16px; flex-wrap:wrap;}
.seal{width:100%; max-width:340px; margin:0 auto; filter:drop-shadow(0 18px 34px rgba(19,42,68,.16));}

section{padding:76px 0;}
.section-label{color:var(--teal); font-weight:500; font-size:.9rem; margin-bottom:10px;}

/* Nosotros */
.nosotros{background:var(--paper);}
.nosotros-grid{display:grid; grid-template-columns:.7fr 1.3fr; gap:56px; align-items:start;}
.nosotros-num{font-family:'Fraunces',serif; font-size:4.5rem; color:var(--navy); line-height:1;}
.nosotros-num + p{margin-top:10px; color:var(--teal); font-weight:500; max-width:16ch;}
.nosotros-text p{margin:0 0 18px; max-width:62ch;}

/* Servicios */
.servicios h2{max-width:20ch; margin-bottom:48px;}
.serv-cols{display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--line); border-radius:2px; overflow:hidden;}
.serv-col{padding:40px 36px;}
.serv-col:first-child{background:var(--navy); color:var(--cream); border-right:1px solid var(--line);}
.serv-col:last-child{background:var(--cream);}
.serv-col .cat{font-size:.85rem; letter-spacing:.02em; margin-bottom:6px; opacity:.75;}
.serv-col:first-child .cat{color:var(--gold);}
.serv-col:last-child .cat{color:var(--teal);}
.serv-col h3{font-size:1.5rem; margin-bottom:24px;}
.serv-col:first-child h3{color:var(--cream);}
.serv-list{list-style:none; margin:0; padding:0;}
.serv-list li{padding:14px 0; border-top:1px solid rgba(255,255,255,.14);}
.serv-col:last-child .serv-list li{border-top:1px solid var(--line);}
.serv-list li:first-child{border-top:none;}
.serv-list strong{display:block; font-weight:600; margin-bottom:3px;}
.serv-list span{font-size:.92rem; opacity:.8;}

/* Por que */
.porque-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:40px;}
.porque-card{padding:0; border-top:2px solid var(--orange); padding-top:20px;}
.porque-card:nth-child(2){border-top-color:var(--teal);}
.porque-card:nth-child(3){border-top-color:var(--gold);}
.porque-card h4{font-size:1.15rem; margin-bottom:10px;}
.porque-card p{color:#3B4B44; font-size:.98rem;}

/* Contacto */
.contacto{background:var(--navy-deep); color:var(--cream);}
.contacto .section-label{color:var(--gold);}
.contacto h2{color:var(--cream); max-width:18ch;}
.contacto-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:56px; margin-top:36px;}
.info-list{list-style:none; margin:28px 0 0; padding:0;}
.info-list li{padding:16px 0; border-top:1px solid rgba(251,247,239,.14);}
.info-list li:first-child{border-top:none;}
.info-list .label{display:block; font-size:.82rem; color:var(--gold); margin-bottom:4px;}
.info-list a{text-decoration:none;}
.info-list a:hover{text-decoration:underline;}
form{display:grid; gap:16px;}
.field label{display:block; font-size:.85rem; margin-bottom:6px; color:#D7DCD5;}
.field input, .field select, .field textarea{
  width:100%; padding:12px 14px; background:rgba(251,247,239,.06);
  border:1px solid rgba(251,247,239,.25); color:var(--cream);
  font-family:'Work Sans',sans-serif; font-size:1rem; border-radius:2px;
  transition:border-color .2s ease, background .2s ease;
}
.field input:focus, .field select:focus, .field textarea:focus{
  border-color:var(--gold); background:rgba(251,247,239,.1); outline:none;
}
.field select option{color:#111;}
.field textarea{min-height:110px; resize:vertical;}
.field input::placeholder, .field textarea::placeholder{color:#8FA09A;}
.form-note{font-size:.82rem; color:#9FB0A9; margin-top:4px;}

footer{padding:40px 0; background:var(--navy-deep); border-top:1px solid rgba(251,247,239,.12); color:#B9C4BE;}
.footer-grid{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;}
.footer-grid .brand img{width:32px;}
.footer-grid .brand-name{color:var(--cream); font-size:1.05rem;}
.footer-links{display:flex; gap:24px; font-size:.9rem;}
.footer-links a:hover{color:var(--gold);}
.footer-legal{font-size:.78rem; margin-top:14px; color:#7E8C86;}

@media (max-width:860px){
  nav.links, .nav-cta .btn{display:none;}
  .menu-toggle{display:flex;}
  .hero .wrap, .nosotros-grid, .contacto-grid{grid-template-columns:1fr;}
  .seal{order:-1; max-width:220px;}
  .serv-cols{grid-template-columns:1fr;}
  .serv-col:first-child{border-right:none; border-bottom:1px solid var(--line);}
  .porque-grid{grid-template-columns:1fr;}
  .nav{padding:16px 22px;}
  .wrap{padding:0 22px;}
  section{padding:56px 0;}
  .hero{padding:56px 0 48px;}
}

nav.links.mobile-open{
  display:flex; flex-direction:column; gap:8px;
  position:fixed; top:0; right:0; bottom:0; width:78%; max-width:320px;
  background:var(--cream); padding:100px 28px 32px; z-index:99;
  box-shadow:-8px 0 30px rgba(0,0,0,.12);
  overflow-y:auto;
}
nav.links.mobile-open a{
  display:block; padding:14px 4px; font-size:1.05rem;
  border-bottom:1px solid var(--line);
}

@media (max-width:480px){
  .hero-actions{flex-direction:column; align-items:stretch;}
  .hero-actions .btn{justify-content:center;}
  .serv-col{padding:32px 24px;}
}