/*
 * AXENZA Production — styles.css
 * Sitio web: https://axenza.mx
 * Descripción: Hoja de estilos principal — diseño Apple-inspired
 * Estructura:
 *   1. Reset & Variables CSS
 *   2. Utilidades y tipografía global
 *   3. Botones
 *   4. Navegación (desktop + mobile)
 *   5. Hero
 *   6. Ticker
 *   7. Secciones — padding base
 *   8. Propósito & Pilares
 *   9. Números / KPIs
 *  10. Proceso
 *  11. Servicios
 *  12. Entregables
 *  13. Por qué AXENZA
 *  14. Sectores
 *  15. Paquetes
 *  16. CTA
 *  17. Contacto & Formulario
 *  18. Footer
 *  19. Responsive (1100px · 768px)
 * ================================================ */

/* =============================================
   RESET & VARIABLES
============================================= */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

:root {
    /* Colors */
    --gold:       #A17C32;   /* ONLY: logo symbol, icon strokes, icon borders */
    --black:      #0A0A0A;
    --black-mid:  #111111;
    --black-card: #161616;
    --black-lift: #1C1C1E;
    --border:     rgba(255,255,255,0.06);
    --border-md:  rgba(255,255,255,0.10);
    --border-vis: rgba(255,255,255,0.16);
    --white:      #FFFFFF;
    --gray-1:     #F5F5F7;   /* Apple off-white */
    --gray-2:     #A1A1A6;   /* Apple secondary */
    --gray-3:     #6E6E73;   /* Apple tertiary */
    --gray-4:     #3A3A3C;   /* visible border */
    /* Typography */
    --font:       'Source Sans 3', -apple-system, BlinkMacSystemFont, sans-serif;
    /* Easing — Apple signature */
    --ease:       cubic-bezier(0.16, 1, 0.3, 1);
    --ease-spring:cubic-bezier(0.34, 1.56, 0.64, 1);
    --trans:      all 0.5s var(--ease);
    /* Border radius */
    --radius-xs:  8px;
    --radius-sm:  12px;
    --radius:     20px;
    --radius-lg:  28px;
    --radius-xl:  36px;
}

html { scroll-behavior: smooth; font-size: 16px; }

body {
    background: var(--black);
    color: var(--white);
    font-family: var(--font);
    line-height: 1.65;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "cv02","cv03","cv04","cv11";
}

img  { max-width: 100%; display: block; }
a    { text-decoration: none; color: inherit; }

/* =============================================
   UTILITIES
============================================= */
.container { max-width: 1200px; margin: 0 auto; padding: 0 52px; }

.s-label {
    display: inline-flex; align-items: center; gap: 12px;
    font-size: 11px; font-weight: 600; letter-spacing: 0.22em;
    text-transform: uppercase; color: var(--gray-3);
}
.s-label::before { content:''; display:block; width:20px; height:1px; background:var(--gray-4); }

.s-h2 {
    font-size: clamp(36px, 4vw, 62px);
    font-weight: 200; letter-spacing: -0.03em; line-height: 1.05;
}
.s-h2 strong { font-weight: 700; }

.s-rule { width:40px; height:1px; background:var(--gray-4); margin:24px 0; }

/* Scroll reveal — Apple-style: fade + subtle scale */
.reveal {
    opacity:0;
    transform:translateY(24px) scale(0.99);
    transition: opacity 0.9s var(--ease), transform 0.9s var(--ease);
}
.reveal.in { opacity:1; transform:translateY(0) scale(1); }
.d1{transition-delay:.08s} .d2{transition-delay:.16s}
.d3{transition-delay:.24s} .d4{transition-delay:.32s}

/* =============================================
   BUTTONS
============================================= */
.btn {
    display: inline-flex; align-items: center; gap: 10px;
    font-family: var(--font); font-size: 14px; font-weight: 500;
    letter-spacing: 0.005em; text-transform: none;
    padding: 14px 28px; cursor: pointer; border: none; outline: none;
    transition: var(--trans); white-space: nowrap;
    border-radius: 980px; position: relative; overflow: hidden;
}
/* Primary — pill, Apple style */
.btn-w {
    background: var(--white); color: var(--black);
}
.btn-w:hover {
    background: var(--gray-1);
    transform: scale(1.02);
    box-shadow: 0 8px 32px rgba(255,255,255,0.14);
}

/* Ghost — clean underline link */
.btn-ghost {
    background: transparent; color: var(--gray-2);
    border-radius: 0;
    border-bottom: 1px solid var(--gray-4);
    padding-left: 0; padding-right: 0; padding-bottom: 8px;
}
.btn-ghost:hover { color: var(--white); border-color: var(--border-vis); gap: 16px; }

/* WhatsApp */
.btn-wa { background: #22C55E; color: var(--white); }
.btn-wa:hover { background: #16A34A; transform: scale(1.02); box-shadow: 0 8px 32px rgba(34,197,94,0.3); }

/* =============================================
   NAVBAR
============================================= */
#nav {
    position: fixed; top:0; left:0; right:0; z-index:900;
    padding: 20px 0;
    transition: padding 0.5s var(--ease), background 0.5s, border-color 0.5s;
    border-bottom: 1px solid transparent;
}
#nav.scrolled {
    background: rgba(10,10,10,0.80);
    backdrop-filter: blur(40px) saturate(180%);
    -webkit-backdrop-filter: blur(40px) saturate(180%);
    padding: 13px 0;
    border-bottom-color: rgba(255,255,255,0.07);
}
.nav-wrap { display:flex; align-items:center; justify-content:space-between; }

/* Logo */
.nav-logo { display:flex; align-items:center; gap:13px; }
.nav-logo-svg { width:34px; height:34px; }
.nav-wm strong { display:block; font-size:17px; font-weight:700; letter-spacing:0.18em; color:var(--white); }
.nav-wm span   { display:block; font-size:8.5px; font-weight:400; letter-spacing:0.45em; color:var(--gray-3); margin-top:1px; }

/* Links */
.nav-links { display:flex; align-items:center; gap:36px; list-style:none; }
.nav-links a {
    font-size:13px; font-weight:400; letter-spacing:0.01em;
    text-transform:none; color:var(--gray-2); transition:color 0.3s;
}
.nav-links a:hover, .nav-links a.active { color:var(--white); }
.nav-cta {
    color:var(--white) !important;
    background: rgba(255,255,255,0.08);
    border:1px solid rgba(255,255,255,0.12) !important;
    padding:8px 20px !important;
    border-radius: 980px !important;
    transition:var(--trans) !important;
    letter-spacing: 0.01em !important;
    font-size: 13px !important;
}
.nav-cta:hover {
    background:var(--white) !important;
    color:var(--black) !important;
    border-color:transparent !important;
}

/* Burger */
.nav-burger { display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:6px; }
.nav-burger span { display:block; width:24px; height:1.5px; background:var(--white); transition:var(--trans); }

/* Mobile nav */
.mobile-nav {
    display:none; position:fixed; inset:0; z-index:950;
    background: rgba(10,10,10,0.96);
    backdrop-filter: blur(40px); -webkit-backdrop-filter: blur(40px);
    flex-direction:column; align-items:center; justify-content:center; gap:36px;
}
.mobile-nav.open { display:flex; }
.mobile-nav a { font-size:26px; font-weight:600; letter-spacing:-0.01em; color:var(--white); transition:color 0.3s; }
.mobile-nav a:hover { color:var(--gray-2); }
.mn-close { position:absolute; top:24px; right:40px; font-size:24px; cursor:pointer; color:var(--gray-3); background:none; border:none; }

/* =============================================
   HERO
============================================= */
#hero {
    position:relative; min-height:100vh;
    display:flex; align-items:center;
    overflow:hidden;
}

/* Subtle gold aura — very restrained */
.hero-atmos {
    position:absolute; inset:0; pointer-events:none;
    background: radial-gradient(ellipse 60% 55% at 70% 40%, rgba(161,124,50,0.05) 0%, transparent 70%);
}

/* Dot grid */
.hero-dots {
    position:absolute; inset:0; pointer-events:none;
    background-image: radial-gradient(circle, rgba(255,255,255,0.055) 1px, transparent 1px);
    background-size: 52px 52px;
    mask-image: radial-gradient(ellipse 80% 80% at 50% 50%, black 10%, transparent 72%);
    -webkit-mask-image: radial-gradient(ellipse 80% 80% at 50% 50%, black 10%, transparent 72%);
}

/* Floating orbs — white/gray, not gold */
.orb {
    position:absolute; border-radius:50%; filter:blur(100px);
    animation: floatOrb 10s ease-in-out infinite; pointer-events:none;
}
.orb-1 { width:500px; height:500px; background:rgba(255,255,255,0.03); top:-120px; right:-80px; animation-delay:0s; }
.orb-2 { width:300px; height:300px; background:rgba(255,255,255,0.02); bottom:60px; left:-40px; animation-delay:5s; }
@keyframes floatOrb { 0%,100%{transform:translateY(0) scale(1);} 50%{transform:translateY(-40px) scale(1.06);} }

/* Vertical accent lines */
.hero-vl {
    position:absolute; top:0; bottom:0; width:1px; pointer-events:none;
    background: linear-gradient(to bottom, transparent 5%, rgba(255,255,255,0.05) 40%, rgba(255,255,255,0.05) 60%, transparent 95%);
}
.hero-vl-1 { left:32%; } .hero-vl-2 { right:28%; }

.hero-content { position:relative; z-index:2; max-width:800px; padding-top:80px; }

.hero-eyebrow {
    display:inline-flex; align-items:center; gap:14px;
    font-size:10.5px; font-weight:600; letter-spacing:0.28em;
    text-transform:uppercase; color:var(--gray-3);
    margin-bottom:48px;
    animation: fadeUp 0.9s var(--ease) both;
}
.hero-eyebrow::before { content:''; width:28px; height:1px; background:var(--gray-4); }

.hero-h1 {
    font-size: clamp(54px, 8.5vw, 112px);
    font-weight:200; letter-spacing:-0.045em; line-height:0.93;
    margin-bottom:32px;
    animation: fadeUp 1s var(--ease) 0.12s both;
}
.hero-h1 strong { font-weight:700; display:block; }
.hero-h1 em     { font-style:normal; font-weight:200; color:var(--gray-1); }

.hero-sub {
    font-size:18px; font-weight:300; color:var(--gray-2);
    line-height:1.75; max-width:520px; margin-bottom:52px;
    animation: fadeUp 1s var(--ease) 0.24s both;
}

.hero-actions {
    display:flex; align-items:center; gap:22px; flex-wrap:wrap;
    animation: fadeUp 1s var(--ease) 0.36s both;
}

/* Hero pills — subtle frosted tags */
.hero-pills {
    display:flex; gap:8px; flex-wrap:wrap; margin-top:52px;
    animation: fadeUp 1s var(--ease) 0.52s both;
}
.hero-pill {
    font-size:11px; font-weight:400; letter-spacing:0.12em;
    text-transform:uppercase; color:var(--gray-3);
    border:1px solid var(--border); padding:6px 14px;
    border-radius: var(--radius-xs);
    background: rgba(255,255,255,0.03);
    backdrop-filter: blur(8px);
}

/* Side stats */
.hero-stats {
    position:absolute; right:0; bottom:80px; z-index:2;
    display:flex; flex-direction:column;
    border-left:1px solid var(--border);
    animation: fadeUp 1s var(--ease) 0.72s both;
}
.h-stat {
    padding:28px 44px; text-align:right;
    border-bottom:1px solid var(--border);
}
.h-stat:last-child { border-bottom:none; }
.h-stat-v { font-size:38px; font-weight:200; letter-spacing:-0.04em; line-height:1; color:var(--white); }
.h-stat-v strong { font-weight:700; }
.h-stat-l { font-size:10px; font-weight:400; letter-spacing:0.16em; text-transform:uppercase; color:var(--gray-4); margin-top:5px; }

/* Scroll cue */
.scroll-cue {
    position:absolute; bottom:36px; left:50%; transform:translateX(-50%);
    display:flex; flex-direction:column; align-items:center; gap:8px;
    animation: fadeUp 1s var(--ease) 1.1s both;
}
.sc-line { width:1px; height:40px; background:linear-gradient(to bottom, rgba(255,255,255,0.25), transparent); animation:scPulse 2.4s ease infinite; }
@keyframes scPulse {
    0%  { transform:scaleY(0); transform-origin:top;    opacity:0; }
    40% { transform:scaleY(1); transform-origin:top;    opacity:1; }
    60% { transform:scaleY(1); transform-origin:bottom; opacity:1; }
    100%{ transform:scaleY(0); transform-origin:bottom; opacity:0; }
}
.sc-lbl { font-size:9px; font-weight:600; letter-spacing:0.3em; text-transform:uppercase; color:var(--gray-4); }

@keyframes fadeUp { from{opacity:0;transform:translateY(28px);}to{opacity:1;transform:translateY(0);} }

/* =============================================
   TICKER
============================================= */
.ticker {
    background: var(--gold);
    overflow:hidden; padding:14px 0;
}
.ticker-track { display:flex; white-space:nowrap; animation:tickerScroll 32s linear infinite; }
.ticker-track:hover { animation-play-state:paused; }
@keyframes tickerScroll { 0%{transform:translateX(0);} 100%{transform:translateX(-50%);} }
.t-item {
    display:inline-flex; align-items:center; gap:18px; padding:0 32px;
    font-size:11px; font-weight:700; letter-spacing:0.22em;
    text-transform:uppercase; color: var(--black);
}
.t-sep { width:4px; height:4px; border-radius:50%; background:rgba(18,16,12,0.35); }

/* =============================================
   SECTION PADDING
============================================= */
.section { padding:160px 0; }
.section-alt { padding:160px 0; background:var(--black-mid); }

/* =============================================
   PURPOSE
============================================= */
.proposito-grid { display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:center; }
.prop-body { font-size:17px; font-weight:300; color:var(--gray-2); line-height:1.85; margin-bottom:52px; }

.pillars { display:flex; flex-direction:column; gap:3px; }
.pillar {
    display:flex; align-items:flex-start; gap:20px;
    padding:22px 22px;
    background:var(--black-card); border:1px solid var(--border);
    border-radius: var(--radius-sm);
    position:relative; overflow:hidden;
    transition: border-color 0.4s, transform 0.5s var(--ease);
}
.pillar::before {
    content:''; position:absolute; left:0; top:0; bottom:0; width:2px;
    background: linear-gradient(to bottom, transparent, var(--border-vis), transparent);
    transform:scaleY(0); transform-origin:bottom;
    transition:transform 0.5s var(--ease);
}
.pillar:hover { border-color:var(--border-md); transform: translateX(4px); }
.pillar:hover::before { transform:scaleY(1); }
.p-ico {
    width:42px; height:42px; flex-shrink:0;
    border:1px solid var(--gold);
    border-radius: var(--radius-xs);
    display:flex; align-items:center; justify-content:center;
}
.p-h { font-size:15px; font-weight:600; color:var(--white); margin-bottom:4px; letter-spacing:-0.01em; }
.p-p { font-size:14px; font-weight:300; color:var(--gray-2); line-height:1.7; }

/* Visual panel */
.prop-panel {
    aspect-ratio:4/5; background:var(--black-card); border:1px solid var(--border);
    border-radius: var(--radius-lg);
    position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center;
}
.pp-grid {
    position:absolute; inset:0;
    background-image: linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
    background-size:56px 56px;
}
.pp-fade {
    position:absolute; inset:0;
    background:radial-gradient(ellipse 60% 50% at 50% 80%, rgba(18,16,12,0.9), transparent 70%);
}
.pp-quote-wrap {
    position:absolute; bottom:0; left:0; right:0;
    padding:36px 40px;
    background:linear-gradient(to top, rgba(18,16,12,1) 0%, rgba(18,16,12,0.5) 60%, transparent 100%);
}
.pp-quote { font-size:17px; font-weight:300; font-style:italic; color:var(--gray-1); line-height:1.5; }
.pp-author { font-size:10px; font-weight:600; letter-spacing:0.22em; text-transform:uppercase; color:var(--gray-4); margin-top:10px; }

/* =============================================
   NUMBERS
============================================= */
.nums-wrap {
    border-top:1px solid var(--border); border-bottom:1px solid var(--border);
}
.nums-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.num-item {
    padding:72px 52px; text-align:center;
    border-right:1px solid var(--border);
    transition: background 0.4s var(--ease);
    position:relative;
}
.num-item:last-child { border-right:none; }
.num-item:hover { background:var(--black-card); }
.num-v {
    font-size: clamp(52px, 5vw, 76px);
    font-weight:200; letter-spacing:-0.05em; line-height:1;
    color:var(--white); margin-bottom:12px;
}
.num-v strong { font-weight:700; }
.num-l { font-size:11px; font-weight:400; letter-spacing:0.16em; text-transform:uppercase; color:var(--gray-3); }

/* =============================================
   PROCESS
============================================= */
.proceso-hdr { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:end; margin-bottom:80px; }
.proceso-sub { font-size:17px; font-weight:300; color:var(--gray-2); line-height:1.85; }

.steps-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:2px; }
.step-card {
    background:var(--black-card); border:1px solid var(--border);
    border-radius: var(--radius-sm);
    padding:44px 32px 52px; position:relative; overflow:hidden;
    transition: transform 0.5s var(--ease), border-color 0.4s, box-shadow 0.5s var(--ease);
    will-change: transform;
}
.step-card:hover {
    transform:translateY(-8px);
    border-color:var(--border-md);
    box-shadow: 0 24px 64px rgba(0,0,0,0.5);
}
.step-card::after {
    content:''; position:absolute; bottom:0; left:0; right:0; height:1px;
    background:linear-gradient(90deg, rgba(255,255,255,0.12), transparent);
    transform:scaleX(0); transform-origin:left; transition:transform 0.6s var(--ease);
}
.step-card:hover::after { transform:scaleX(1); }
.step-n { position:absolute; top:16px; right:20px; font-size:64px; font-weight:900; color:rgba(255,255,255,0.025); line-height:1; }
.step-ico {
    width:48px; height:48px; margin-bottom:28px;
    border:1px solid var(--gold);
    border-radius: var(--radius-xs);
    display:flex; align-items:center; justify-content:center;
}
.step-h { font-size:18px; font-weight:600; color:var(--white); margin-bottom:12px; letter-spacing:-0.01em; }
.step-p { font-size:14px; font-weight:300; color:var(--gray-2); line-height:1.8; }

/* =============================================
   SERVICES
============================================= */
.svc-hdr { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:end; margin-bottom:80px; }
.svc-intro { font-size:17px; font-weight:300; color:var(--gray-2); line-height:1.85; }

.svc-grid { display:grid; grid-template-columns:1fr 1fr; gap:2px; }
.svc-card {
    background:var(--black-card); border:1px solid var(--border);
    border-radius: var(--radius);
    padding:60px 52px; position:relative; overflow:hidden;
    transition: transform 0.5s var(--ease), border-color 0.4s, box-shadow 0.5s var(--ease);
    will-change: transform;
}
.svc-card:hover {
    border-color:var(--border-md);
    transform:translateY(-4px);
    box-shadow: 0 24px 64px rgba(0,0,0,0.5);
}
.svc-card::before {
    content:''; position:absolute; inset:0;
    background:radial-gradient(ellipse 70% 70% at 100% 100%, rgba(255,255,255,0.025), transparent 60%);
    opacity:0; transition:opacity 0.6s var(--ease);
}
.svc-card:hover::before { opacity:1; }
.svc-arrow {
    position:absolute; top:36px; right:36px; width:38px; height:38px;
    border-radius: 50%;
    border:1px solid var(--border); display:flex; align-items:center; justify-content:center;
    font-size:15px; color:var(--gray-3); transition:var(--trans);
}
.svc-card:hover .svc-arrow { background:var(--white); border-color:var(--white); color:var(--black); transform:rotate(45deg) scale(1.05); }
.svc-ico { width:50px; height:50px; margin-bottom:28px; border:1px solid var(--gold); border-radius: var(--radius-xs); display:flex; align-items:center; justify-content:center; }
.svc-h3 { font-size:22px; font-weight:600; color:var(--white); margin-bottom:14px; letter-spacing:-0.01em; }
.svc-p  { font-size:15px; font-weight:300; color:var(--gray-2); line-height:1.8; margin-bottom:24px; }
.svc-tags { display:flex; flex-wrap:wrap; gap:7px; }
.svc-tag {
    font-size:9.5px; font-weight:600; letter-spacing:0.10em; text-transform:uppercase;
    color:var(--gray-3); border:1px solid var(--border); padding:5px 12px;
    border-radius: var(--radius-xs);
    background: rgba(255,255,255,0.03);
}

/* =============================================
   DELIVERABLES
============================================= */
.ent-hdr { text-align:center; margin-bottom:80px; }
.ent-sub { font-size:17px; font-weight:300; color:var(--gray-2); max-width:600px; margin:20px auto 0; }

.ent-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; }
.ent-card {
    background:var(--black-card); border:1px solid var(--border);
    border-radius: var(--radius-sm);
    padding:44px 40px;
    transition: transform 0.5s var(--ease), border-color 0.4s, box-shadow 0.5s var(--ease);
    position:relative; overflow:hidden;
    will-change: transform;
}
.ent-card:hover {
    border-color:var(--border-md);
    transform: translateY(-4px);
    box-shadow: 0 20px 48px rgba(0,0,0,0.4);
}
.ent-card::before {
    content:''; position:absolute; top:0; left:0; right:0; height:1px;
    background:linear-gradient(90deg, rgba(255,255,255,0.12), transparent);
    transform:scaleX(0); transform-origin:left; transition:transform 0.6s var(--ease);
}
.ent-card:hover::before { transform:scaleX(1); }
.ent-num { font-size:10px; font-weight:700; letter-spacing:0.22em; text-transform:uppercase; color:var(--gray-4); margin-bottom:20px; }
.ent-h3  { font-size:19px; font-weight:600; color:var(--white); margin-bottom:12px; letter-spacing:-0.01em; }
.ent-p   { font-size:14px; font-weight:300; color:var(--gray-2); line-height:1.8; }

/* =============================================
   WHY AXENZA
============================================= */
.porque-grid { display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:center; }

.difs { list-style:none; }
.dif {
    display:flex; align-items:flex-start; gap:22px;
    padding:26px 0; border-bottom:1px solid var(--border);
    transition:padding-left 0.35s var(--ease);
}
.dif:first-child { border-top:1px solid var(--border); }
.dif:hover { padding-left:10px; }
.dif-ico {
    width:40px; height:40px; flex-shrink:0;
    border:1px solid var(--gold);
    border-radius: var(--radius-xs);
    display:flex; align-items:center; justify-content:center;
}
.dif-h { font-size:15px; font-weight:600; color:var(--white); margin-bottom:4px; letter-spacing:-0.01em; }
.dif-p { font-size:14px; font-weight:300; color:var(--gray-2); line-height:1.7; }

.porque-panel {
    background:var(--black-card); border:1px solid var(--border);
    border-radius: var(--radius-xl);
    padding:60px 56px; position:relative; overflow:hidden;
}
.porque-glow {
    position:absolute; bottom:-80px; right:-80px;
    width:320px; height:320px; border-radius:50%;
    background:rgba(255,255,255,0.02); filter:blur(80px); pointer-events:none;
}
.porque-quote {
    position:relative;
    font-size: clamp(22px, 2.2vw, 30px);
    font-weight:200; font-style:italic; line-height:1.45;
    color:var(--white); margin-bottom:40px;
}
.porque-quote strong { font-weight:700; font-style:normal; display:block; }
.porque-rule { width:56px; height:1px; background:var(--gray-4); margin-bottom:32px; }
.porque-desc { font-size:15px; font-weight:300; color:var(--gray-2); line-height:1.85; }

/* =============================================
   SECTORS
============================================= */
.sector-hdr { text-align:center; margin-bottom:80px; }
.sector-sub { font-size:17px; font-weight:300; color:var(--gray-2); max-width:620px; margin:20px auto 0; }

.sector-grid { display:grid; grid-template-columns:1fr 1fr; gap:2px; }
.sector-card {
    background:var(--black-card); border:1px solid var(--border);
    border-radius: var(--radius);
    padding:52px 48px; display:flex; gap:28px; align-items:flex-start;
    transition: transform 0.5s var(--ease), border-color 0.4s, box-shadow 0.5s var(--ease);
    position:relative; overflow:hidden;
    will-change: transform;
}
.sector-card::after {
    content:''; position:absolute; top:0; left:0; right:0; height:1px;
    background:linear-gradient(90deg, rgba(255,255,255,0.12), transparent);
    transform:scaleX(0); transform-origin:left; transition:transform 0.6s var(--ease);
}
.sector-card:hover {
    border-color:var(--border-md);
    transform: translateY(-4px);
    box-shadow: 0 20px 48px rgba(0,0,0,0.4);
}
.sector-card:hover::after { transform:scaleX(1); }
.sector-ico {
    width:54px; height:54px; flex-shrink:0;
    border:1px solid var(--gold);
    border-radius: var(--radius-xs);
    display:flex; align-items:center; justify-content:center;
}
.sector-h { font-size:20px; font-weight:600; color:var(--white); margin-bottom:12px; letter-spacing:-0.01em; }
.sector-p { font-size:14.5px; font-weight:300; color:var(--gray-2); line-height:1.8; }

/* =============================================
   PACKAGES
============================================= */
.paq-hdr { text-align:center; margin-bottom:80px; }
.paq-sub { font-size:17px; font-weight:300; color:var(--gray-2); max-width:580px; margin:20px auto 0; }

.paq-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.paq-card {
    background:var(--black-card); border:1px solid var(--border);
    border-radius: var(--radius-xl);
    padding:60px 48px; position:relative; overflow:hidden;
    transition: transform 0.5s var(--ease), border-color 0.4s, box-shadow 0.5s var(--ease);
    display:flex; flex-direction:column;
    will-change: transform;
}
.paq-card:hover {
    transform:translateY(-8px);
    border-color:var(--border-md);
    box-shadow: 0 32px 72px rgba(0,0,0,0.5);
}
.paq-card.featured { border-color:var(--border-vis); background: var(--black-lift); }
.paq-badge {
    display:inline-block; font-size:9px; font-weight:700; letter-spacing:0.18em;
    text-transform:uppercase; color:var(--gray-3);
    border:1px solid var(--border-md); padding:5px 14px;
    border-radius: 980px;
    margin-bottom:36px; align-self:flex-start;
}
.paq-card.featured .paq-badge { background:var(--white); color:var(--black); border-color:var(--white); }
.paq-ico { margin-bottom:22px; }
.paq-name { font-size:30px; font-weight:700; letter-spacing:-0.02em; margin-bottom:5px; }
.paq-subtitle { font-size:11px; font-weight:400; letter-spacing:0.18em; text-transform:uppercase; color:var(--gray-3); margin-bottom:32px; }
.paq-rule { width:100%; height:1px; background:var(--border); margin-bottom:28px; }
.paq-list { list-style:none; flex:1; display:flex; flex-direction:column; gap:13px; }
.paq-list li { font-size:14px; font-weight:300; color:var(--gray-1); display:flex; gap:12px; align-items:flex-start; line-height:1.55; }
.paq-list li::before { content:'—'; color:var(--gray-4); flex-shrink:0; font-size:12px; margin-top:2px; }
.paq-cta { margin-top:44px; }
.paq-note { text-align:center; font-size:13px; font-weight:300; color:var(--gray-3); font-style:italic; margin-top:40px; }

/* =============================================
   CTA
============================================= */
.cta-wrap { text-align:center; position:relative; max-width:860px; margin:0 auto; }

.cta-h2 {
    font-size: clamp(44px, 5.5vw, 76px);
    font-weight:200; letter-spacing:-0.04em; line-height:1.0;
    margin:20px 0 28px;
}
.cta-h2 strong { font-weight:700; display:block; }
.cta-body { font-size:18px; font-weight:300; color:var(--gray-2); max-width:500px; margin:0 auto 72px; line-height:1.8; }

.cta-steps { display:flex; align-items:flex-start; justify-content:center; gap:0; margin-bottom:72px; }
.cta-step  { flex:1; max-width:220px; text-align:center; position:relative; }
.cta-step:not(:last-child)::after {
    content:''; position:absolute; top:22px; left:55%; width:90%;
    height:1px; background:linear-gradient(90deg, var(--border-vis), transparent);
}
.cta-step-num {
    width:44px; height:44px; border-radius:50%;
    background:transparent; border:1px solid var(--border-vis);
    display:flex; align-items:center; justify-content:center;
    font-size:14px; font-weight:700; color:var(--white); margin:0 auto 18px;
}
.cta-step-h { font-size:15px; font-weight:600; margin-bottom:8px; }
.cta-step-p { font-size:13px; font-weight:300; color:var(--gray-3); }
.cta-btns { display:flex; align-items:center; justify-content:center; gap:20px; flex-wrap:wrap; }

/* =============================================
   CONTACT
============================================= */
.contact-grid { display:grid; grid-template-columns:5fr 7fr; gap:100px; align-items:start; }
.contact-h2 { font-size: clamp(34px, 3.5vw, 52px); font-weight:200; letter-spacing:-0.035em; margin-bottom:24px; }
.contact-h2 strong { font-weight:700; }
.contact-desc { font-size:17px; font-weight:300; color:var(--gray-2); line-height:1.85; margin-bottom:52px; }

.c-infos { display:flex; flex-direction:column; gap:24px; }
.c-info  { display:flex; gap:20px; align-items:center; }
.c-ico   {
    width:46px; height:46px; flex-shrink:0;
    border:1px solid var(--gold);
    border-radius: var(--radius-xs);
    display:flex; align-items:center; justify-content:center;
}
.c-lbl   { font-size:10px; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--gray-4); margin-bottom:3px; }
.c-val   { font-size:16px; font-weight:400; color:var(--white); }

/* Form */
.c-form  { display:flex; flex-direction:column; gap:16px; }
.f-row   { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.fg      { display:flex; flex-direction:column; gap:7px; }
.fg label { font-size:10px; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--gray-4); }
.fg input, .fg select, .fg textarea {
    background:var(--black-card); border:1px solid var(--gray-4);
    color:var(--white); font-family:var(--font); font-size:15px; font-weight:300;
    padding:14px 18px; outline:none; resize:none;
    transition: border-color 0.3s, box-shadow 0.3s;
    -webkit-appearance:none;
    border-radius: var(--radius-xs);
}
.fg input:focus, .fg select:focus, .fg textarea:focus {
    border-color: rgba(255,255,255,0.28);
    box-shadow: 0 0 0 3px rgba(255,255,255,0.06);
}
.fg input::placeholder, .fg textarea::placeholder { color:var(--gray-4); }
.fg select option { background:var(--black-card); }

/* =============================================
   FOOTER
============================================= */
footer { background:var(--black-card); border-top:1px solid var(--border); padding:80px 0 40px; }
.footer-grid {
    display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:60px;
    padding-bottom:56px; border-bottom:1px solid var(--border); margin-bottom:36px;
}
.f-brand-desc { font-size:14px; font-weight:300; color:var(--gray-3); line-height:1.85; margin-top:24px; max-width:300px; }
.f-col-ttl { font-size:10px; font-weight:700; letter-spacing:0.25em; text-transform:uppercase; color:var(--gray-2); margin-bottom:22px; }
.f-links { list-style:none; display:flex; flex-direction:column; gap:12px; }
.f-links a { font-size:14px; font-weight:300; color:var(--gray-3); transition:color 0.3s; }
.f-links a:hover { color:var(--white); }
.footer-btm { display:flex; align-items:center; justify-content:space-between; }
.f-copy  { font-size:13px; font-weight:300; color:var(--gray-3); }
.f-legal { display:flex; gap:24px; }
.f-legal a { font-size:13px; font-weight:300; color:var(--gray-3); transition:color 0.3s; }
.f-legal a:hover { color:var(--white); }

/* =============================================
   RESPONSIVE
============================================= */
@media (max-width:1100px) {
    .container { padding:0 36px; }
    .proposito-grid, .porque-grid { grid-template-columns:1fr; gap:56px; }
    .prop-panel { display:none; }
    .proceso-hdr, .svc-hdr { grid-template-columns:1fr; gap:24px; }
    .steps-grid { grid-template-columns:1fr 1fr; }
    .nums-grid  { grid-template-columns:1fr 1fr; }
    .num-item:nth-child(2) { border-right:none; }
    .num-item:nth-child(3) { border-top:1px solid var(--border); }
    .hero-stats { display:none; }
    .contact-grid { grid-template-columns:1fr; gap:56px; }
    .footer-grid { grid-template-columns:1fr 1fr; gap:40px; }
}

@media (max-width:768px) {
    .container { padding:0 20px; }
    .nav-links { display:none; } .nav-burger { display:flex; }
    #hero { padding:120px 0 80px; min-height:auto; }
    .hero-h1 { font-size:44px; }
    .section, .section-alt { padding:96px 0; }
    .svc-grid, .sector-grid, .paq-grid, .ent-grid { grid-template-columns:1fr; }
    .steps-grid { grid-template-columns:1fr; }
    .cta-steps { flex-direction:column; align-items:center; gap:32px; }
    .cta-step::after { display:none; }
    .f-row { grid-template-columns:1fr; }
    .footer-grid { grid-template-columns:1fr; gap:36px; }
    .footer-btm { flex-direction:column; gap:16px; text-align:center; }
    .paq-grid { gap:12px; }
}
