/* ===== AETHIA — Estilos compartidos ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0d1117;--bg2:#111820;--bg3:#161e28;
  --accent:#4a8fb5;--accent2:#2e6a8a;
  --text:#c8d6e0;--text-muted:#6a8a9a;
  --border:rgba(74,143,181,0.15);
  --font-head:'Barlow Condensed',sans-serif;
  --font-body:'Barlow',sans-serif
}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--font-body);font-weight:300;font-size:16px;line-height:1.7;overflow-x:hidden}
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--accent2);border-radius:2px}

/* --- Nav --- */
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:center;padding:1.4rem 3rem;background:rgba(13,17,23,0.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);transition:padding 0.3s}
.nav-logo{font-family:var(--font-head);font-weight:300;font-size:1.1rem;letter-spacing:0.35em;color:var(--accent);text-decoration:none;text-transform:lowercase}
.nav-links{display:flex;gap:2.5rem;list-style:none}
.nav-links a{font-family:var(--font-head);font-weight:400;font-size:0.75rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--text-muted);text-decoration:none;transition:color 0.2s}
.nav-links a:hover{color:var(--accent)}
.nav-lang{font-family:var(--font-head);font-size:0.72rem;letter-spacing:0.18em;text-transform:uppercase;background:transparent;border:1px solid var(--accent2);color:var(--text-muted);padding:0.35rem 0.85rem;cursor:pointer;transition:all 0.2s;text-decoration:none}
.nav-lang:hover{border-color:var(--accent);color:var(--accent)}
.nav-lang-sm{font-family:var(--font-head);font-size:0.68rem;letter-spacing:0.18em;text-transform:uppercase;background:transparent;border:1px solid var(--accent2);color:var(--text-muted);padding:0.3rem 0.7rem;cursor:pointer;transition:all 0.2s;text-decoration:none}

/* --- Mobile menu --- */
.nav-hamburger{align-items:center;gap:0.8rem}
.hamburger-btn{background:transparent;border:none;cursor:pointer;padding:0.3rem;display:flex;flex-direction:column;gap:5px}
.hamburger-btn span{display:block;width:22px;height:1.5px;background:var(--text-muted);transition:all 0.3s}
.hamburger-btn.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.hamburger-btn.open span:nth-child(2){opacity:0}
.hamburger-btn.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.mobile-menu{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(13,17,23,0.97);backdrop-filter:blur(16px);z-index:99;flex-direction:column;justify-content:center;align-items:center;gap:2.5rem}
.mobile-menu.open{display:flex}
.mobile-menu a{font-family:var(--font-head);font-size:1.6rem;font-weight:300;letter-spacing:0.2em;text-transform:uppercase;color:var(--text-muted);text-decoration:none;transition:color 0.2s}
.mobile-menu a:hover{color:var(--accent)}
.mobile-menu-lang{font-family:var(--font-head);font-size:0.75rem !important;letter-spacing:0.2em;text-transform:uppercase;background:transparent;border:1px solid var(--accent2);color:var(--text-muted) !important;padding:0.5rem 1.2rem;margin-top:1rem;transition:all 0.2s;display:inline-block;text-decoration:none}
.mobile-menu-lang:hover{border-color:var(--accent);color:var(--accent) !important}

/* --- Secciones comunes --- */
section{padding:7rem 3rem}
.section-label{font-family:var(--font-head);font-size:0.68rem;font-weight:400;letter-spacing:0.3em;text-transform:uppercase;color:var(--accent);margin-bottom:1.2rem;display:flex;align-items:center;gap:1rem}
.section-label::after{content:'';flex:1;max-width:60px;height:1px;background:var(--accent2)}
.section-title{font-family:var(--font-head);font-size:clamp(2rem,4vw,3.2rem);font-weight:600;line-height:1.1;color:#e8f0f5;margin-bottom:3rem}
.highlight{color:var(--text)}

/* --- Servicios --- */
#servicios,#serveis{background:var(--bg)}
.servicios-inner{max-width:1100px;margin:0 auto}
.servicios-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;border:1px solid var(--border);background:var(--border)}
.servicio-card{background:var(--bg);padding:2.5rem;transition:background 0.3s;position:relative;overflow:hidden}
.servicio-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 0.35s}
.servicio-card:hover{background:var(--bg3)}
.servicio-card:hover::before{transform:scaleX(1)}
.servicio-icon{width:32px;height:32px;margin-bottom:1.3rem;display:block;color:var(--accent);opacity:0.8}
.servicio-icon svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.servicio-num{font-family:var(--font-head);font-size:0.65rem;letter-spacing:0.2em;color:var(--accent2);margin-bottom:0.8rem;display:block}
.servicio-title{font-family:var(--font-head);font-size:1.15rem;font-weight:600;color:#e8f0f5;margin-bottom:0.9rem;letter-spacing:0.02em}
.servicio-desc{font-size:0.88rem;color:var(--text-muted);line-height:1.7}
.servicio-list{margin-top:1rem;list-style:none;display:flex;flex-direction:column;gap:0.35rem}
.servicio-list li{font-size:0.82rem;color:var(--text-muted);display:flex;align-items:center;gap:0.5rem}
.servicio-list li::before{content:'—';color:var(--accent2);font-size:0.7rem}

/* --- Contacto --- */
#contacto,#contacte{background:var(--bg2);border-top:1px solid var(--border)}
.contacto-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr 1.4fr;gap:5rem;align-items:start}
.contacto-tagline{font-size:0.95rem;color:var(--text-muted);max-width:380px;line-height:1.8}
.contacto-form{display:flex;flex-direction:column;gap:1.2rem}
.form-group{display:flex;flex-direction:column;gap:0.5rem}
.form-label{font-family:var(--font-head);font-size:0.65rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--accent2)}
.form-input,.form-textarea{background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:var(--font-body);font-size:0.9rem;font-weight:300;padding:0.85rem 1rem;outline:none;resize:none;transition:border-color 0.2s;-webkit-appearance:none}
.form-input:focus,.form-textarea:focus{border-color:var(--accent2)}
.form-textarea{height:130px}
.form-btn{font-family:var(--font-head);font-size:0.75rem;letter-spacing:0.2em;text-transform:uppercase;font-weight:400;padding:1rem 2rem;background:transparent;border:1px solid var(--accent);color:var(--accent);cursor:pointer;align-self:flex-start;transition:all 0.25s}
.form-btn:hover{background:var(--accent);color:var(--bg)}
.form-btn:disabled{opacity:0.5;cursor:not-allowed}
.form-error{font-size:0.75rem;color:#e05c5c;letter-spacing:0.03em;margin-top:0.2rem;min-height:1rem;display:block}

/* --- Footer --- */
footer{padding:2rem 3rem;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border);background:var(--bg)}
.footer-brand{font-family:var(--font-head);font-weight:300;font-size:0.9rem;letter-spacing:0.3em;color:var(--accent2);text-transform:lowercase}
.footer-copy{font-size:0.78rem;color:var(--text-muted);letter-spacing:0.05em}

/* --- WhatsApp --- */
.wa-btn{position:fixed;bottom:2rem;right:2rem;z-index:200;display:flex;align-items:center;gap:0.7rem;padding:0.75rem 1.3rem 0.75rem 1rem;background:var(--bg2);border:1px solid var(--accent2);color:var(--text-muted);text-decoration:none;font-family:var(--font-head);font-size:0.7rem;letter-spacing:0.15em;text-transform:uppercase;transition:all 0.3s;backdrop-filter:blur(12px)}
.wa-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(74,143,181,0.06)}
.wa-btn svg{width:16px;height:16px;fill:currentColor;flex-shrink:0}
@media(max-width:600px){.wa-btn-label{display:none}}

/* --- Animaciones --- */
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.reveal{opacity:0;transform:translateY(30px);transition:opacity 0.7s,transform 0.7s}
.reveal.visible{opacity:1;transform:none}

/* --- Hero fondo común --- */
.hero-bg{position:absolute;inset:0;background:radial-gradient(ellipse 60% 60% at 70% 50%,rgba(46,106,138,0.12) 0%,transparent 70%),radial-gradient(ellipse 40% 40% at 10% 80%,rgba(74,143,181,0.06) 0%,transparent 60%);pointer-events:none}
.hero-grid-lines{position:absolute;inset:0;background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black 20%,transparent 100%);opacity:0.4;pointer-events:none}

/* --- Botones CTA (páginas secundarias) --- */
.btn-primary{font-family:var(--font-head);font-size:0.75rem;letter-spacing:0.2em;text-transform:uppercase;padding:0.9rem 2rem;background:var(--accent);color:var(--bg);text-decoration:none;border:1px solid var(--accent);transition:all 0.25s}
.btn-primary:hover{background:transparent;color:var(--accent)}
.btn-secondary{font-family:var(--font-head);font-size:0.75rem;letter-spacing:0.2em;text-transform:uppercase;padding:0.9rem 2rem;background:transparent;color:var(--text-muted);text-decoration:none;border:1px solid var(--accent2);transition:all 0.25s}
.btn-secondary:hover{border-color:var(--accent);color:var(--accent)}

/* ===== RESPONSIVE ===== */
@media(max-width:900px){
  nav{padding:1.2rem 1.5rem}
  .nav-links{gap:1.5rem}
  section{padding:5rem 1.5rem}
  .servicios-grid{grid-template-columns:1fr}
  .contacto-inner{grid-template-columns:1fr;gap:3rem}
  footer{flex-direction:column;gap:0.8rem;text-align:center}
}
@media(max-width:600px){
  .nav-links{display:none}
  .nav-desktop{display:none}
  .nav-hamburger{display:flex}
}
@media(min-width:601px){
  .nav-hamburger{display:none}
  .nav-desktop{display:flex}
}