/* =====================================================
   INFINITY DREAMS LABS v4 — FINAL EDITION
   Palette: Deep Indigo · Midnight · Dark Gold · Mauve · Ink
   Cormorant Garamond + Outfit + JetBrains Mono
   ===================================================== */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}

/* ─── BRAND PALETTE ─────────────────────────────────── */
:root{
  /* Official brand */
  --indigo:    #232B59;
  --midnight:  #182240;
  --ink:       #0D0D0D;

  /* DARK GOLD replacing copper — luxury perfume feel */
  --gold:      #A8843A;      /* Deep antique gold */
  --gold2:     #C09B4A;      /* Mid gold */
  --gold3:     #D4AF60;      /* Light gold highlight */
  --gold-dim:  rgba(168,132,58,0.15);
  --gold-glow: rgba(168,132,58,0.25);

  /* Mauve kept as secondary warm */
  --mauve:     #BF948A;
  --mauve-dim: rgba(191,148,138,0.2);

  /* Whites */
  --w90:  rgba(255,255,255,0.90);
  --w70:  rgba(255,255,255,0.70);
  --w50:  rgba(255,255,255,0.50);
  --w30:  rgba(255,255,255,0.30);
  --w15:  rgba(255,255,255,0.15);
  --w08:  rgba(255,255,255,0.08);
  --w04:  rgba(255,255,255,0.04);
  --bd:   rgba(255,255,255,0.10);

  /* Typography */
  --serif:  'Cormorant Garamond', Georgia, serif;
  --sans:   'Outfit', -apple-system, sans-serif;
  --mono:   'JetBrains Mono', monospace;

  --max:  1200px;
  --ease: cubic-bezier(0.4,0,0.2,1);
  --t:    0.3s var(--ease);
}

/* ─── BASE ──────────────────────────────────────────── */
body{font-family:var(--sans);background:var(--midnight);color:#fff;overflow-x:hidden;-webkit-font-smoothing:antialiased;cursor:none}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
ul{list-style:none}
.container{max-width:var(--max);margin:0 auto;padding:0 40px}
::selection{background:rgba(168,132,58,0.35)}
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:var(--ink)}
::-webkit-scrollbar-thumb{background:var(--gold);border-radius:2px}

/* ─── NOISE ─────────────────────────────────────────── */
.noise-overlay{position:fixed;inset:0;z-index:9990;pointer-events:none;opacity:0.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:180px}

/* ─── CURSOR ────────────────────────────────────────── */
#cursor{position:fixed;z-index:9999;pointer-events:none;width:36px;height:36px;border:1px solid rgba(168,132,58,0.7);border-radius:50%;transform:translate(-50%,-50%);transition:width .2s,height .2s,border-color .2s}
#cursorDot{position:absolute;top:50%;left:50%;width:4px;height:4px;background:var(--gold);border-radius:50%;transform:translate(-50%,-50%)}
#cursor.big{width:56px;height:56px;border-color:var(--gold)}

/* ─── LOADER ────────────────────────────────────────── */
#loader{position:fixed;inset:0;z-index:9998;background:var(--ink);display:flex;align-items:center;justify-content:center;transition:opacity .7s ease}
.loader-box{text-align:center}
.loader-progress{width:200px;height:1px;background:var(--w15);margin:24px auto 14px;overflow:hidden}
.loader-bar{height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--gold3));animation:loadBar 2s ease forwards}
.loader-status{font-family:var(--mono);font-size:11px;color:var(--w30);letter-spacing:1px}
@keyframes loadBar{from{width:0}to{width:100%}}

/* ─── CONTEXT RIBBON ────────────────────────────────── */
#contextRibbon{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(13,13,13,0.97);border-bottom:1px solid var(--bd);backdrop-filter:blur(20px);display:flex;align-items:center;justify-content:space-between;padding:5px 40px;font-family:var(--mono);font-size:11px;color:var(--w30);letter-spacing:.5px}
.ribbon-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ribbon-hello{color:var(--gold);font-weight:500;letter-spacing:2px}
.ribbon-sep{color:var(--bd);font-size:14px}
.ribbon-right{display:flex;gap:6px}
.lang-btn{background:transparent;border:1px solid var(--bd);color:var(--w30);padding:2px 10px;border-radius:20px;font-family:var(--mono);font-size:10px;cursor:none;transition:var(--t);letter-spacing:1px}
.lang-btn.active,.lang-btn:hover{border-color:var(--gold);color:var(--gold)}

/* ─── NAVBAR ────────────────────────────────────────── */
#navbar{position:fixed;top:29px;left:0;right:0;z-index:999;display:flex;align-items:center;justify-content:space-between;padding:14px 40px;transition:var(--t)}
#navbar.scrolled{background:rgba(24,34,64,0.97);border-bottom:1px solid var(--bd);backdrop-filter:blur(24px);padding:10px 40px}
.nav-logo img{display:block;height:36px;width:auto}
.nav-center{display:flex;gap:36px}
.nav-center a{font-size:14px;color:var(--w50);transition:var(--t);letter-spacing:.3px;font-weight:400}
.nav-center a:hover{color:#fff}
.nav-cta{background:var(--gold);color:var(--ink);padding:9px 22px;border-radius:8px;font-size:14px;font-weight:600;transition:var(--t);white-space:nowrap}
.nav-cta:hover{background:var(--gold2);transform:translateY(-1px);box-shadow:0 8px 24px var(--gold-glow)}
.hamburger{display:none;background:none;border:none;color:#fff;font-size:22px;cursor:none}

/* ─── MOBILE MENU ───────────────────────────────────── */
#mobileMenu{position:fixed;inset:0;z-index:1100;background:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:36px;transform:translateX(100%);transition:transform .35s var(--ease)}
#mobileMenu.open{transform:translateX(0)}
#mobileMenu a{font-family:var(--serif);font-size:30px;font-weight:600;color:#fff}
.mob-cta{background:var(--gold)!important;color:var(--ink)!important;padding:14px 32px;border-radius:8px;font-family:var(--sans)!important;font-size:16px!important;font-weight:600!important}
.mob-close{position:absolute;top:24px;right:28px;background:none;border:none;color:var(--w30);font-size:26px;cursor:none}

/* ─── BUTTONS ───────────────────────────────────────── */
.btn-gold{display:inline-flex;align-items:center;justify-content:center;background:var(--gold);color:var(--ink);padding:15px 32px;border-radius:10px;font-family:var(--sans);font-weight:700;font-size:16px;letter-spacing:.3px;transition:var(--t);border:none;cursor:none}
.btn-gold:hover{background:var(--gold2);transform:translateY(-2px);box-shadow:0 12px 40px var(--gold-glow)}
.btn-gold.full{width:100%;margin-top:8px}
.btn-ghost-light{display:inline-flex;align-items:center;color:var(--w50);font-size:16px;transition:var(--t);padding:15px 0}
.btn-ghost-light:hover{color:#fff}
.btn-dark{display:inline-flex;align-items:center;justify-content:center;background:var(--ink);color:#fff;padding:14px 28px;border-radius:8px;font-weight:600;font-size:15px;transition:var(--t);margin-top:28px}
.btn-dark:hover{background:#1a1a1a;transform:translateY(-1px)}

/* ─── TYPOGRAPHY ────────────────────────────────────── */
.section-kicker{font-family:var(--mono);font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:16px;display:flex;align-items:center;gap:10px}
.section-kicker::before{content:'';display:inline-block;width:20px;height:1px;background:var(--gold)}
.section-kicker.light{color:rgba(168,132,58,0.75)}
.section-kicker.contact-kicker::before{background:var(--gold3)}
h2{font-family:var(--serif);font-size:clamp(34px,4.5vw,60px);font-weight:600;line-height:1.06;letter-spacing:-1.5px;color:#fff}
h2 em,.italic-serif{font-style:italic;font-weight:400;color:var(--gold3)}

.section-header.center{text-align:center;max-width:640px;margin:0 auto 64px}
.section-header.center .section-kicker{justify-content:center}
.section-header.center .section-kicker::before{display:none}

/* ─── HERO ──────────────────────────────────────────── */
#inicio{position:relative;min-height:100vh;display:flex;flex-direction:column;overflow:hidden}
#heroCanvas{position:absolute;inset:0;z-index:1;width:100%;height:100%;pointer-events:none}
.hero-mesh{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse 80% 70% at 60% 30%, rgba(35,43,89,0.5) 0%,transparent 70%),linear-gradient(to bottom,rgba(24,34,64,0.3) 0%,rgba(13,13,13,0.8) 100%)}
.hero-img-bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;opacity:0.18}
.hero-content{position:relative;z-index:4;padding:180px 40px 60px;max-width:var(--max);margin:0 auto;width:100%;flex:1}

.hero-eyebrow{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:28px}
.eyebrow-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 var(--gold-glow);animation:goldPulse 2s ease infinite;flex-shrink:0}
@keyframes goldPulse{0%{box-shadow:0 0 0 0 rgba(168,132,58,0.6)}70%{box-shadow:0 0 0 10px rgba(168,132,58,0)}100%{box-shadow:0 0 0 0 rgba(168,132,58,0)}}

#heroH1{font-family:var(--serif);font-size:clamp(52px,8vw,100px);font-weight:600;line-height:1.03;letter-spacing:-3px;margin-bottom:28px;max-width:900px}
.h1-line{display:block;opacity:0;transform:translateY(32px)}
.h1-line.show{animation:slideIn .8s var(--ease) forwards}
@keyframes slideIn{to{opacity:1;transform:translateY(0)}}
.h1-line.italic-serif{font-style:italic;font-weight:400;color:var(--gold3)}

.hero-sub{font-family:var(--serif);font-size:clamp(17px,2vw,21px);font-weight:300;font-style:italic;color:var(--w70);line-height:1.75;max-width:560px;margin-bottom:44px}
.hero-ctas{display:flex;align-items:center;gap:24px;flex-wrap:wrap}

/* STATS BAR */
.hero-stats-bar{position:relative;z-index:4;background:rgba(13,13,13,0.75);border-top:1px solid rgba(168,132,58,0.2);backdrop-filter:blur(20px);display:flex;align-items:center;justify-content:center;gap:0;padding:20px 40px;flex-wrap:wrap}
.stat-item{display:flex;flex-direction:column;align-items:center;padding:0 32px;text-align:center}
.stat-item strong{font-family:var(--serif);font-size:28px;font-weight:600;color:#fff;letter-spacing:-1px;line-height:1}
.stat-item span{font-family:var(--mono);font-size:10px;color:var(--w30);letter-spacing:1.5px;text-transform:uppercase;margin-top:4px}
.stat-sep{width:1px;height:36px;background:var(--bd)}
.cnt{display:inline}

.hero-scroll-cue{position:absolute;bottom:8px;left:40px;display:flex;align-items:center;gap:14px;font-family:var(--mono);font-size:10px;color:var(--w30);letter-spacing:2px;text-transform:uppercase;z-index:4}
.scroll-line{width:40px;height:1px;background:var(--gold);animation:scrollPulse 2s ease infinite}
@keyframes scrollPulse{0%,100%{opacity:.4;width:40px}50%{opacity:1;width:60px}}

/* ─── VISITOR STRIP ─────────────────────────────────── */
#visitorStrip{background:rgba(35,43,89,0.7);border-top:1px solid var(--bd);border-bottom:1px solid var(--bd);backdrop-filter:blur(20px);padding:12px 0}
.visitor-inner{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.visitor-pulse span{width:7px;height:7px;border-radius:50%;background:#6bcf7f;display:block;animation:livePing 2s ease infinite;flex-shrink:0}
@keyframes livePing{0%{box-shadow:0 0 0 0 rgba(107,207,127,0.5)}70%{box-shadow:0 0 0 10px rgba(107,207,127,0)}100%{box-shadow:0 0 0 0 rgba(107,207,127,0)}}
#visitorMsg{font-size:14px;color:var(--w70);flex:1;font-family:var(--serif);font-style:italic}
.visitor-weather-pill{display:flex;align-items:center;gap:10px;background:var(--w08);border:1px solid var(--bd);border-radius:20px;padding:6px 16px}
#wIcon{font-size:18px}
#wTemp{font-family:var(--serif);font-size:18px;font-weight:600;color:#fff}
#wCity{font-family:var(--mono);font-size:10px;color:var(--w30);letter-spacing:1px}

/* ─── IA SECTION ────────────────────────────────────── */
#ia{padding:120px 0;position:relative;overflow:hidden}
.section-img-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.section-overlay{position:absolute;inset:0;background:rgba(24,34,64,0.92)}
.ia-header{text-align:center;margin-bottom:72px}
.ia-header h2{max-width:640px;margin:0 auto}
.ia-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.nucleus-wrap{height:420px;position:relative;display:flex;align-items:center;justify-content:center}
#nucleusCanvas{width:100%;height:100%}
.nucleus-label{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);text-align:center}
.nuc-tag{display:block;font-family:var(--mono);font-size:10px;color:var(--gold);letter-spacing:2px;text-transform:uppercase}
.nuc-status{font-family:var(--mono);font-size:10px;color:var(--w30)}
.ia-panels{display:flex;flex-direction:column;gap:64px}
.ia-panel{opacity:0;transform:translateX(24px);transition:all .6s var(--ease)}
.ia-panel.visible{opacity:1;transform:translateX(0)}
.panel-tag{font-family:var(--mono);font-size:11px;color:var(--gold);letter-spacing:2px;text-transform:uppercase;margin-bottom:14px}
.ia-panel h3{font-family:var(--serif);font-size:32px;font-weight:600;letter-spacing:-1px;color:#fff;margin-bottom:14px}
.ia-panel p{font-family:var(--serif);font-size:17px;font-weight:300;font-style:italic;color:var(--w70);line-height:1.8;margin-bottom:18px}
.panel-bullets{display:flex;flex-direction:column;gap:10px}
.panel-bullets li{font-size:14px;color:var(--w50);padding-left:20px;position:relative}
.panel-bullets li::before{content:'→';position:absolute;left:0;color:var(--gold)}

/* ─── PILLARS ───────────────────────────────────────── */
.pillar{padding:120px 0;position:relative;overflow:hidden}
.pillar-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.pillar-overlay{position:absolute;inset:0;background:rgba(35,43,89,0.88)}
.pillar-overlay.deep{background:rgba(24,34,64,0.93)}
.pillar-inner{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;position:relative;z-index:2}
.pillar-inner.reverse{direction:rtl}
.pillar-inner.reverse>*{direction:ltr}
.pillar-text h2{margin:14px 0 20px}
.pillar-p{font-family:var(--serif);font-size:18px;font-weight:300;font-style:italic;color:var(--w70);line-height:1.8;margin-bottom:24px}
.pillar-list{display:flex;flex-direction:column;gap:12px;margin-bottom:4px}
.pillar-list li{font-size:15px;color:var(--w60, rgba(255,255,255,0.6));padding-left:22px;position:relative}
.pillar-list li::before{content:'›';position:absolute;left:0;color:var(--gold);font-size:20px;line-height:1.2}
.pillar-proof{display:flex;gap:32px;margin-top:24px;margin-bottom:4px}
.proof-num strong{font-family:var(--serif);font-size:28px;font-weight:600;color:var(--gold3);display:block;letter-spacing:-1px}
.proof-num span{font-family:var(--mono);font-size:10px;color:var(--w30);letter-spacing:1px;text-transform:uppercase}

/* APPS PILLAR */
.pillar-apps{background:var(--indigo)}
/* App mockup */
.app-mockup{background:rgba(255,255,255,0.04);border:1px solid var(--bd);border-radius:20px;padding:20px;backdrop-filter:blur(10px)}
.mock-screen{background:rgba(13,13,13,0.9);border-radius:14px;overflow:hidden}
.mock-topbar{background:rgba(255,255,255,0.04);padding:12px 16px;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--bd)}
.mock-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.mock-dot.r{background:#ff5f57}.mock-dot.y{background:#febc2e}.mock-dot.g{background:#28c840}
.mock-url{font-family:var(--mono);font-size:10px;color:var(--w30);margin-left:8px;letter-spacing:.3px}
.mock-body{display:flex;min-height:280px}
.mock-sidebar{width:40px;background:rgba(35,43,89,0.5);display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px 0;border-right:1px solid var(--bd)}
.sb-item{width:20px;height:3px;background:var(--bd);border-radius:2px}
.sb-item.active{background:var(--gold);width:24px}
.mock-main{flex:1;padding:20px}
.mock-header-row{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px}
.mock-label{font-family:var(--serif);font-size:16px;font-weight:600;color:#fff}
.mock-sub{font-family:var(--mono);font-size:10px;color:var(--w30);margin-top:3px}
.mock-badge{background:rgba(168,132,58,0.2);border:1px solid rgba(168,132,58,0.4);color:var(--gold3);padding:4px 10px;border-radius:20px;font-family:var(--mono);font-size:11px;font-weight:600}
.mock-chart{display:flex;align-items:flex-end;gap:6px;height:90px;margin-bottom:16px}
.chart-col{display:flex;flex-direction:column;align-items:center;flex:1;gap:4px;height:100%}
.chart-bar{width:100%;background:rgba(168,132,58,0.3);border-radius:3px 3px 0 0;margin-top:auto;animation:barUp 1s var(--ease) both}
.chart-bar.active{background:var(--gold)}
@keyframes barUp{from{transform:scaleY(0);transform-origin:bottom}to{transform:scaleY(1)}}
.chart-col span{font-family:var(--mono);font-size:8px;color:var(--w30)}
.mock-metrics{display:flex;gap:12px}
.mock-metric{flex:1;background:var(--w04);border:1px solid var(--bd);border-radius:8px;padding:10px;text-align:center}
.mock-metric span{display:block;font-family:var(--mono);font-size:9px;color:var(--w30);letter-spacing:1px;text-transform:uppercase;margin-bottom:4px}
.mock-metric strong{font-family:var(--serif);font-size:16px;font-weight:600;color:#fff}

/* AGENTS PILLAR */
.pillar-agents{background:var(--midnight)}
.agent-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:24px}
.agent-card{background:var(--w08);border:1px solid var(--bd);border-radius:12px;padding:18px;display:flex;gap:12px;align-items:flex-start;transition:var(--t)}
.agent-card:hover{background:var(--w15);border-color:rgba(168,132,58,0.4)}
.agent-icon{font-size:24px;flex-shrink:0}
.agent-card strong{display:block;font-size:14px;font-weight:600;color:#fff;margin-bottom:4px}
.agent-card p{font-size:12px;color:var(--w30);line-height:1.6}
/* Orbit */
.agent-visual{display:flex;align-items:center;justify-content:center;height:380px}
.agent-orbit{position:relative;width:300px;height:300px}
.orbit-ring{position:absolute;border-radius:50%;border:1px solid rgba(168,132,58,0.2);top:50%;left:50%;transform:translate(-50%,-50%)}
.r1{width:100%;height:100%;animation:spin 20s linear infinite}
.r2{width:68%;height:68%;animation:spin 14s linear infinite reverse;border-color:rgba(168,132,58,0.15)}
.r3{width:38%;height:38%;animation:spin 8s linear infinite;border-color:rgba(168,132,58,0.25)}
@keyframes spin{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
.orbit-core{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:66px;height:66px;border-radius:50%;background:var(--indigo);border:2px solid var(--gold);display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 0 20px var(--gold-glow)}
.orbit-node{position:absolute;font-size:20px;background:var(--midnight);border:1px solid var(--gold);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 12px rgba(168,132,58,0.2)}
.n1{top:0;left:50%;transform:translateX(-50%)}
.n2{top:50%;right:0;transform:translateY(-50%)}
.n3{bottom:0;left:50%;transform:translateX(-50%)}
.n4{top:50%;left:0;transform:translateY(-50%)}
.n5{top:12%;right:12%}

/* BRAND PILLAR */
.pillar-brand{background:linear-gradient(135deg,rgba(35,43,89,1) 0%,rgba(24,34,64,1) 100%);border-top:1px solid rgba(168,132,58,0.2);border-bottom:1px solid rgba(168,132,58,0.2)}
.brand-steps{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}
.brand-step{background:var(--w08);border:1px solid var(--bd);border-radius:10px;padding:16px 18px;display:flex;align-items:center;gap:12px;transition:var(--t)}
.brand-step:hover{border-color:rgba(168,132,58,0.4);background:var(--gold-dim)}
.brand-step span{font-family:var(--mono);font-size:18px;color:rgba(168,132,58,0.3);font-weight:300;flex-shrink:0}
.brand-step strong{font-size:13px;color:var(--w70);font-weight:500}
/* Brand photo */
.brand-img-wrap{position:relative;border-radius:20px;overflow:hidden}
.brand-img-wrap img{width:100%;height:420px;object-fit:cover;filter:brightness(.85) saturate(.9)}
.brand-img-badge{position:absolute;bottom:24px;left:24px;background:rgba(13,13,13,0.9);border:1px solid rgba(168,132,58,0.4);border-radius:14px;padding:16px 20px;display:flex;flex-direction:column;align-items:center;gap:4px;backdrop-filter:blur(10px)}
.brand-img-badge span{font-size:28px}
.brand-img-badge strong{font-family:var(--serif);font-size:22px;color:var(--gold3);font-weight:600;letter-spacing:-1px}
.brand-img-badge small{font-family:var(--mono);font-size:9px;color:var(--w30);letter-spacing:1px;text-transform:uppercase}

/* ─── TESTIMONIALS ──────────────────────────────────── */
#testimonials{padding:100px 0;background:var(--ink)}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.testi-card{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.07);border-radius:16px;padding:36px 32px;transition:var(--t)}
.testi-card:hover{border-color:rgba(168,132,58,0.3);background:rgba(168,132,58,0.04)}
.testi-card.featured-testi{border-color:rgba(168,132,58,0.35);background:rgba(168,132,58,0.06)}
.testi-stars{color:var(--gold);font-size:14px;margin-bottom:18px;letter-spacing:2px}
.testi-card p{font-family:var(--serif);font-size:17px;font-weight:300;font-style:italic;color:var(--w70);line-height:1.8;margin-bottom:24px}
.testi-author{display:flex;align-items:center;gap:14px}
.testi-avatar{width:42px;height:42px;border-radius:50%;background:var(--indigo);border:1px solid rgba(168,132,58,0.3);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:12px;color:var(--gold);flex-shrink:0}
.testi-author strong{display:block;font-size:14px;font-weight:600;color:#fff}
.testi-author span{font-size:12px;color:var(--w30)}

/* ─── SERVICES ──────────────────────────────────────── */
#servicios{padding:100px 0;background:var(--indigo)}
.svcs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.svc-card{background:var(--w08);border:1px solid var(--bd);border-radius:14px;padding:32px 28px;cursor:none;transition:var(--t);opacity:0;transform:translateY(16px)}
.svc-card.visible{opacity:1;transform:translateY(0)}
.svc-card:hover{background:var(--w15);border-color:rgba(168,132,58,0.35);transform:translateY(-3px);box-shadow:0 16px 48px rgba(0,0,0,0.3)}
.svc-icon{font-size:30px;display:block;margin-bottom:16px}
.svc-card h4{font-family:var(--serif);font-size:20px;font-weight:600;color:#fff;margin-bottom:10px;letter-spacing:-.3px}
.svc-card p{font-size:14px;color:var(--w30);line-height:1.75}

/* ─── PHOTO ROW ─────────────────────────────────────── */
.photo-row{display:grid;grid-template-columns:repeat(4,1fr);height:320px}
.photo-tile{position:relative;background-size:cover;background-position:center;overflow:hidden;cursor:none}
.photo-tile::after{content:'';position:absolute;inset:0;background:rgba(24,34,64,0.55);transition:var(--t)}
.photo-tile:hover::after{background:rgba(168,132,58,0.25)}
.photo-caption{position:absolute;bottom:20px;left:20px;z-index:2;font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,0.7)}

/* ─── MARQUEE ───────────────────────────────────────── */
.marquee-section{padding:22px 0;background:var(--midnight);border-top:1px solid var(--bd);border-bottom:1px solid var(--bd);overflow:hidden}
.marquee-title{font-family:var(--mono);font-size:10px;text-align:center;color:var(--w30);letter-spacing:3px;text-transform:uppercase;margin-bottom:14px}
.marquee-wrap{overflow:hidden}
.marquee-track{display:flex;gap:24px;white-space:nowrap;animation:marqueeRun 50s linear infinite;font-family:var(--sans);font-size:14px;font-weight:500;color:var(--w30)}
.marquee-track span{flex-shrink:0}
.marquee-track .dot{color:var(--gold)}
@keyframes marqueeRun{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ─── CONTACT ───────────────────────────────────────── */
#contact{padding:120px 0;position:relative;overflow:hidden}
.contact-bg-img{position:absolute;inset:0;background-size:cover;background-position:center}
.contact-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(13,13,13,0.97) 0%,rgba(24,34,64,0.96) 100%)}
.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;align-items:start}
.contact-left h2{margin:12px 0 6px}
.contact-tagline{font-family:var(--serif);font-size:24px;font-style:italic;font-weight:300;color:var(--gold3);margin-bottom:20px;letter-spacing:-.3px}
.contact-p{font-family:var(--serif);font-size:17px;font-weight:300;color:var(--w50);line-height:1.8;margin-bottom:28px}
.contact-email{font-family:var(--mono);font-size:14px;color:var(--gold);display:block;margin-bottom:28px;transition:var(--t);letter-spacing:.5px}
.contact-email:hover{color:var(--gold3)}
.contact-badges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}
.contact-badges span{font-family:var(--mono);font-size:10px;letter-spacing:1px;text-transform:uppercase;background:var(--w04);border:1px solid var(--bd);color:var(--w30);padding:5px 14px;border-radius:20px}
.contact-trust{display:flex;gap:28px;padding-top:24px;border-top:1px solid var(--bd)}
.trust-item strong{font-family:var(--serif);font-size:24px;font-weight:600;color:var(--gold3);display:block;letter-spacing:-1px}
.trust-item span{font-family:var(--mono);font-size:10px;color:var(--w30);letter-spacing:1px;text-transform:uppercase}

/* Form */
.contact-right form{display:flex;flex-direction:column;gap:20px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fg{display:flex;flex-direction:column;gap:8px}
.fg label{font-family:var(--mono);font-size:11px;font-weight:500;color:var(--w30);letter-spacing:1.5px;text-transform:uppercase}
.fg input,.fg select,.fg textarea{background:var(--w08);border:1px solid var(--bd);border-radius:8px;padding:13px 16px;color:#fff;font-family:var(--sans);font-size:15px;transition:var(--t);outline:none;width:100%;-webkit-appearance:none}
.fg input::placeholder,.fg textarea::placeholder{color:var(--w30)}
.fg select option{background:var(--midnight)}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-dim)}
.fg textarea{resize:vertical;min-height:110px}
.form-ok{background:rgba(107,207,127,0.08);border:1px solid rgba(107,207,127,0.2);color:#7dd87d;padding:14px 18px;border-radius:8px;font-family:var(--serif);font-size:16px;font-style:italic}
.form-err{background:rgba(200,60,60,0.08);border:1px solid rgba(200,60,60,0.2);color:#e07070;padding:14px 18px;border-radius:8px;font-size:14px}
.hidden{display:none!important}

/* ─── FOOTER ────────────────────────────────────────── */
footer{background:var(--ink);padding:72px 0 36px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:60px}
.footer-brand p{font-family:var(--serif);font-size:15px;font-style:italic;font-weight:300;color:var(--w30);line-height:1.7}
.footer-social{display:flex;gap:12px;margin-top:20px}
.footer-social a{width:34px;height:34px;border-radius:50%;background:var(--w04);border:1px solid var(--bd);display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--w30);transition:var(--t);font-weight:700}
.footer-social a:hover{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.footer-col{display:flex;flex-direction:column;gap:12px}
.footer-col h5{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--w30);margin-bottom:4px}
.footer-col a{font-size:14px;color:rgba(255,255,255,0.25);transition:var(--t)}
.footer-col a:hover{color:var(--gold)}
.footer-bottom{border-top:1px solid var(--bd);padding-top:28px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}
.footer-bottom span{font-size:12px;color:var(--w30);font-family:var(--mono)}
.footer-lang{display:flex;gap:8px}
.footer-lang button{background:transparent;border:1px solid var(--bd);color:var(--w30);padding:3px 12px;border-radius:20px;font-family:var(--mono);font-size:10px;cursor:none;transition:var(--t)}
.footer-lang button:hover{border-color:var(--gold);color:var(--gold)}

/* ─── BACK TO TOP ───────────────────────────────────── */
#btt{position:fixed;bottom:32px;right:32px;z-index:800;width:42px;height:42px;border-radius:50%;background:var(--gold);color:var(--ink);border:none;font-size:16px;font-weight:700;cursor:none;opacity:0;transform:translateY(8px);transition:var(--t)}
#btt.on{opacity:1;transform:translateY(0)}
#btt:hover{background:var(--gold2)}

/* ─── RESPONSIVE ────────────────────────────────────── */
@media(max-width:1024px){
  .pillar-inner{grid-template-columns:1fr;gap:48px}
  .pillar-inner.reverse{direction:ltr}
  .pillar-visual{display:none}
  .ia-grid{grid-template-columns:1fr}
  .nucleus-wrap{display:none}
  .contact-grid{grid-template-columns:1fr;gap:48px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:36px}
  .testi-grid{grid-template-columns:1fr}
  .photo-row{grid-template-columns:1fr 1fr;height:auto}
  .photo-tile{height:220px}
}
@media(max-width:768px){
  #navbar{padding:10px 20px}
  .nav-center,.nav-cta{display:none}
  .hamburger{display:block}
  #inicio .hero-content{padding:120px 20px 60px}
  .container{padding:0 20px}
  .svcs-grid{grid-template-columns:1fr}
  .agent-cards{grid-template-columns:1fr}
  .brand-steps{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .hero-stats-bar{gap:0;padding:16px 20px}
  .stat-item{padding:8px 16px}
  .stat-sep{display:none}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;text-align:center}
  .photo-row{grid-template-columns:1fr;height:auto}
  .photo-tile{height:200px}
  #contextRibbon{padding:5px 20px;font-size:10px}
  .pillar{padding:80px 0}
  #testimonials,#servicios,#ia,#contact{padding:80px 0}
  .testi-grid{gap:16px}
}
