/* 
 * CUANDEORO.IE - DESIGN SYSTEM UNIFICADO 
 * Anti-Frankenstein Architecture 
 */

/* Fuentes: cargadas vía <link> en baseof.html (el @import aquí era render-blocking en cadena) */

:root {
  /* Corporativos Base */
  --bg-navy: #121212;
  --bg-navy-light: #2D2D2D;
  --text-platinum: #E5E4E2;
  --text-platinum-muted: rgba(229, 228, 226, 0.7);
  --gold-primary: #E0E0E0;
  --gold-dark: #9aa0a6;
  --gold-light: #E0E0E0;
  
  /* B2B / Fractional Tokens */
  --tech-blue: #3B82F6;
  --tech-blue-bg: rgba(59, 130, 246, 0.1);
  --success-green: #10B981;
  
  /* Grid & Spacing (Ley 4px/8px) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;
  --space-8: 64px;
  --space-12: 96px;

  /* Typography */
  --font-base: 'Inter', system-ui, -apple-system, sans-serif;
  --font-luxury: 'Playfair Display', serif;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html { scroll-behavior: smooth; }

body {
  font-family: var(--font-base);
  background-color: var(--bg-navy);
  color: var(--text-platinum);
  font-size: 16px; /* Accessibility strict rule */
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

/* ── TYPOGRAPHY · escala contenida "banca privada" (orden Dirección de Marketing) ──
   El tamaño indica importancia, no urgencia. Jerarquía por peso y color, no por escala. */
h1, h2, h3, h4, h5 {
  font-family: var(--font-luxury);
  color: var(--gold-primary);
  line-height: 1.3;
  font-weight: 500;
}

h1 { font-size: clamp(1.9rem, 2.6vw, 2.6rem); letter-spacing: .015em; margin-bottom: var(--space-4); }
h2 { font-size: clamp(1.45rem, 2vw, 1.9rem); letter-spacing: .01em; margin-bottom: var(--space-3); }
h3 { font-size: 1.2rem; font-weight: 600; color: var(--gold-dark); margin-bottom: var(--space-2); }

p { margin-bottom: var(--space-4); color: var(--text-platinum-muted); }

a {
  color: var(--gold-primary);
  text-decoration: none;
  transition: all 0.3s ease;
}
a:hover { color: var(--gold-light); }

/* ── BUTTONS (THUMB-FRIENDLY > 48px heights) ── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 var(--space-5);
  font-family: var(--font-base);
  font-weight: 600;
  font-size: 1rem;
  letter-spacing: 0.5px;
  border-radius: 4px;
  cursor: pointer;
  border: 1px solid transparent;
  transition: all 0.3s ease;
}

.btn-primary {
  background: linear-gradient(135deg, var(--gold-primary), var(--gold-dark));
  color: var(--bg-navy);
}
.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(212, 175, 55, 0.3);
}

.btn-outline {
  background: transparent;
  border-color: var(--gold-primary);
  color: var(--gold-primary);
}
.btn-outline:hover {
  background: var(--gold-primary);
  color: var(--bg-navy);
}

/* ── LAYOUT & GRIDS ── */
.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--space-4);
}

.section { padding: var(--space-12) 0; }

/* ── MENU / NAVIGATION UNIFIED ── */
.mega-nav {
  position: fixed;
  top: 0; width: 100%;
  background: rgba(10, 22, 40, 0.95);
  backdrop-filter: blur(10px);
  z-index: 1000;
  border-bottom: 1px solid rgba(212, 175, 55, 0.1);
}

.mega-nav-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 80px;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--space-4);
}

.logo {
  font-family: var(--font-luxury);
  font-size: 24px;
  font-weight: 800;
  color: var(--text-platinum);
  letter-spacing: 2px;
}
.logo span { color: var(--gold-primary); }

.nav-links {
  display: flex;
  gap: var(--space-6);
  align-items: center;
}

.nav-item {
  position: relative;
  font-size: 0.9rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--text-platinum-muted);
}
.nav-item:hover { color: var(--gold-primary); }

.nav-item.active {
  color: var(--gold-primary);
}
.nav-item.active::after {
  content: '';
  position: absolute;
  bottom: -30px; /* Align to bottom border of navbar */
  left: 0;
  width: 100%;
  height: 3px;
  background: var(--gold-primary);
}

/* ── FOOTER ── */
footer {
  background: var(--bg-navy-light);
  padding: var(--space-8) 0;
  border-top: 1px solid rgba(255,255,255,0.05);
}

/* ════════════════════════════════════════════════════════════
   HOME V2 · captación (hero/video/value/audiences/cta)
   ════════════════════════════════════════════════════════════ */
.hero-v2{position:relative;text-align:center;padding:140px 20px 90px;background:
  radial-gradient(circle at 50% 0%,rgba(212,175,55,.14),transparent 55%),
  linear-gradient(180deg,var(--bg-navy) 0%,var(--bg-navy-light) 100%);overflow:hidden}
.hero-v2 .eyebrow{font-family:var(--font-base);letter-spacing:.22em;text-transform:uppercase;
  font-size:.78rem;color:var(--gold-primary);opacity:.9;margin-bottom:var(--space-4)}
.hero-v2 h1{max-width:920px;margin:0 auto var(--space-4)}
.hero-v2 .lead{max-width:680px;margin:0 auto var(--space-6);font-size:1.12rem;line-height:1.8;color:var(--text-platinum)}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}
.trust-row{display:flex;gap:28px;flex-wrap:wrap;justify-content:center;margin-top:var(--space-8);
  font-size:.82rem;color:var(--text-platinum-muted)}
.trust-row span{display:inline-flex;align-items:center;gap:8px}
.trust-row b{color:var(--gold-light);font-weight:600}

.video-band{padding:var(--space-12) 20px;text-align:center}
.video-band h2{margin-bottom:var(--space-2)}
.video-band .sub{max-width:560px;margin:0 auto var(--space-6);color:var(--text-platinum-muted)}
.video-frame{position:relative;max-width:880px;margin:0 auto;aspect-ratio:16/9;border-radius:14px;
  overflow:hidden;border:1px solid rgba(212,175,55,.32);box-shadow:0 30px 80px rgba(0,0,0,.45);
  background:linear-gradient(135deg,#0d1c33,#16263f)}
.video-frame video{width:100%;height:100%;object-fit:cover;display:block}
.video-frame .play-poster{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:14px;cursor:pointer;background:radial-gradient(circle at 50% 50%,rgba(212,175,55,.10),transparent 60%)}
.video-frame .play-btn{width:74px;height:74px;border-radius:50%;background:linear-gradient(135deg,var(--gold-primary),var(--gold-dark));
  display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(212,175,55,.4)}
.video-frame .play-btn::after{content:"";border-style:solid;border-width:13px 0 13px 22px;border-color:transparent transparent transparent #121212;margin-left:5px}
.video-frame .play-poster small{color:var(--text-platinum-muted);letter-spacing:.05em}

.value-grid,.aud-grid{display:grid;gap:22px;max-width:1080px;margin:0 auto;padding:0 20px}
.value-grid{grid-template-columns:repeat(3,1fr)}
.aud-grid{grid-template-columns:repeat(3,1fr)}
.card-v2{background:linear-gradient(180deg,var(--bg-navy-light),#101d31);border:1px solid rgba(212,175,55,.18);
  border-radius:12px;padding:30px 26px;transition:transform .25s ease,border-color .25s ease;text-align:left}
.card-v2:hover{transform:translateY(-4px);border-color:rgba(212,175,55,.55)}
.card-v2 .ic{font-size:1.7rem;margin-bottom:14px}
.card-v2 h3{font-size:1.3rem;margin-bottom:10px}
.card-v2 p{font-size:.96rem;margin-bottom:16px}
.card-v2 .more{font-size:.9rem;font-weight:600;color:var(--gold-primary)}
.aud-tag{font-family:var(--font-base);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-dark);font-weight:700;margin-bottom:10px}

.cta-band{margin:var(--space-12) 20px 0;padding:64px 24px;text-align:center;border-radius:18px;
  max-width:1080px;margin-left:auto;margin-right:auto;
  background:linear-gradient(135deg,rgba(212,175,55,.14),rgba(59,130,246,.08));border:1px solid rgba(212,175,55,.3)}
.cta-band h2{margin-bottom:var(--space-3)}
.cta-band p{max-width:560px;margin:0 auto var(--space-5)}

@media(max-width:860px){.value-grid,.aud-grid{grid-template-columns:1fr}.hero-v2{padding-top:110px}}

/* ── LOGO crest + PRICING partners ── */
.logo{display:inline-flex;align-items:center;gap:10px}
.logo-crest{height:44px;width:auto;display:block}
.logo-text{font-family:var(--font-luxury);font-size:1.35rem;color:var(--text-platinum);font-weight:700}
.logo-text span{color:var(--gold-primary)}

.pricing-wrap{padding:var(--space-8) 20px var(--space-12)}
.pricing-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;max-width:900px;margin:0 auto}
.price-card{position:relative;background:linear-gradient(180deg,var(--bg-navy-light),#101d31);
  border:1px solid rgba(212,175,55,.25);border-radius:16px;padding:38px 32px;display:flex;flex-direction:column}
.price-card.featured{border-color:var(--gold-primary);box-shadow:0 24px 60px rgba(212,175,55,.18)}
.price-card .tier{font-family:var(--font-base);letter-spacing:.14em;text-transform:uppercase;font-size:.78rem;color:var(--gold-dark);font-weight:700;margin-bottom:14px}
.price-card .badge{position:absolute;top:-13px;right:24px;background:linear-gradient(135deg,var(--gold-primary),var(--gold-dark));color:#121212;font-size:.72rem;font-weight:700;padding:5px 12px;border-radius:20px;letter-spacing:.04em}
.price-card .price{font-family:var(--font-luxury);font-size:2.6rem;color:var(--gold-primary);line-height:1;margin:6px 0 4px}
.price-card .price small{font-size:1rem;color:var(--text-platinum-muted);font-family:var(--font-base)}
.price-card ul{list-style:none;margin:22px 0 28px;padding:0;flex:1}
.price-card li{padding:9px 0 9px 28px;position:relative;color:var(--text-platinum);font-size:.96rem;border-bottom:1px solid rgba(229,228,226,.07)}
.price-card li::before{content:"✓";position:absolute;left:0;color:var(--success-green);font-weight:700}
.price-note{max-width:900px;margin:18px auto 0;text-align:center;font-size:.8rem;color:var(--text-platinum-muted)}

.call-band{max-width:900px;margin:var(--space-8) auto 0;padding:48px 30px;text-align:center;border-radius:16px;
  background:linear-gradient(135deg,rgba(212,175,55,.12),rgba(59,130,246,.06));border:1px solid rgba(212,175,55,.28)}
.call-band .phone{font-family:var(--font-luxury);font-size:1.9rem;color:var(--gold-light);margin:10px 0 18px;display:block}
@media(max-width:760px){.pricing-grid{grid-template-columns:1fr}}

/* ── PROSE (contenido migrado nativo) + breadcrumb + section cards ── */
.breadcrumb{font-size:.84rem;color:var(--text-platinum-muted);margin-bottom:18px}
.breadcrumb a{color:var(--gold-primary)}
.breadcrumb .sep{margin:0 8px;opacity:.5}
.breadcrumb .cur{color:var(--text-platinum)}
.lead-sub{font-size:1.15rem;color:var(--text-platinum);margin:-6px 0 26px;opacity:.9}
.prose{color:var(--text-platinum);line-height:1.75;font-size:1.02rem}
.prose h2{margin:38px 0 14px;font-size:1.7rem}
.prose h3{margin:28px 0 10px;font-size:1.3rem;color:var(--gold-light)}
.prose p{margin-bottom:16px;color:var(--text-platinum-muted)}
.prose ul,.prose ol{margin:0 0 18px 22px}
.prose li{margin-bottom:8px}
.prose a{color:var(--gold-primary)}
.prose strong{color:var(--text-platinum)}
.prose img{max-width:100%;height:auto;border-radius:10px;margin:18px 0}
.prose table{width:100%;border-collapse:collapse;margin:18px 0;font-size:.94rem}
.prose th,.prose td{border:1px solid rgba(212,175,55,.2);padding:10px 12px;text-align:left}
.prose th{background:rgba(212,175,55,.08);color:var(--gold-light)}
.prose blockquote{border-left:3px solid var(--gold-primary);margin:18px 0;padding:6px 18px;color:var(--text-platinum-muted);background:rgba(212,175,55,.05)}
.prose hr{border:0;border-top:1px solid rgba(212,175,55,.18);margin:30px 0}

.section-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px;max-width:1080px;margin:10px auto 0;padding:0 20px}
.subpage-card{display:block;background:linear-gradient(180deg,var(--bg-navy-light),#101d31);border:1px solid rgba(212,175,55,.18);border-radius:12px;padding:24px 22px;transition:transform .2s,border-color .2s}
.subpage-card:hover{transform:translateY(-3px);border-color:rgba(212,175,55,.5)}
.subpage-card h3{font-size:1.18rem;margin-bottom:8px}
.subpage-card p{font-size:.9rem;color:var(--text-platinum-muted);margin-bottom:12px}
.subpage-card .more{font-size:.85rem;font-weight:600;color:var(--gold-primary)}

/* ── FOOTER disclaimer ── */
.footer-notice{font-size:.82rem;line-height:1.6;color:var(--text-platinum-muted);max-width:760px;margin:0 auto 14px}
.footer-notice strong{color:var(--gold-light)}
.footer-copy{font-size:.8rem;color:var(--text-platinum-muted);opacity:.8;margin:0}

/* footer legal links */
.footer-legal{margin:6px 0 14px;font-size:.8rem;color:var(--text-platinum-muted)}
.footer-legal a{color:var(--gold-primary)}
.footer-legal span{margin:0 8px;opacity:.4}

/* logo + lema (tagline) */
.logo-text-wrap{display:inline-flex;flex-direction:column;line-height:1.05}
.logo-tagline{font-family:var(--font-base);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-dark);margin-top:3px}
@media(max-width:600px){.logo-tagline{display:none}}

/* ════ DASHBOARDS RBAC ════ */
.dash-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:96px 20px 24px;max-width:1100px;margin:0 auto;border-bottom:1px solid var(--line,rgba(212,175,55,.2))}
.dash-role{font-family:var(--font-luxury);font-size:1.9rem;color:var(--gold-primary)}
.dash-badges{display:flex;gap:10px;flex-wrap:wrap}
.badge-chip{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:20px;border:1px solid rgba(212,175,55,.35);color:var(--gold-light)}
.badge-chip.ok{border-color:var(--success-green);color:var(--success-green)}
.badge-chip.warn{border-color:#f59e0b;color:#f59e0b}
.dash-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;max-width:1100px;margin:26px auto;padding:0 20px}
.panel{background:linear-gradient(180deg,var(--bg-navy-light),#101d31);border:1px solid rgba(212,175,55,.18);border-radius:14px;padding:24px}
.panel h3{font-size:1.15rem;color:var(--gold-light);margin-bottom:14px;display:flex;align-items:center;gap:8px}
.field{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid rgba(229,228,226,.07);font-size:.93rem}
.field:last-child{border-bottom:0}
.field .k{color:var(--text-platinum-muted)}
.field .v{color:var(--text-platinum);text-align:right;font-weight:500}
.field .v[data-live]{color:var(--gold-light)}
.upload{margin-top:8px;border:1px dashed rgba(212,175,55,.4);border-radius:10px;padding:14px;text-align:center;color:var(--text-platinum-muted);font-size:.85rem}
.dash-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
.state-pill{display:inline-block;padding:4px 12px;border-radius:8px;font-size:.8rem;font-weight:600;background:rgba(59,130,246,.15);color:var(--tech-blue)}
.dash-note{max-width:1100px;margin:0 auto 60px;padding:0 20px;font-size:.8rem;color:var(--text-platinum-muted)}
.role-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;max-width:1000px;margin:30px auto;padding:0 20px}

/* ===== UI-UNI · Homologación sobria (Spec R90 · firma Gemma) =====
   Rev. Dirección de Mercadeo 2026-06-10: se mantiene el espíritu firmado (obsidiana,
   sin gradientes navy/oro, sobriedad) y se restaura la jerarquía de CTA — un embudo
   con primario y secundario idénticos reparte el clic. Acento platino cálido. */
:root{ --bg-navy:#121212; --bg-navy-light:#1E1E1E; --gold-primary:#E0E0E0; --gold-dark:#9aa0a6; --gold-light:#E0E0E0; --platinum-warm:#D9D4C9; --platinum-warm-deep:#C9C2B4; }
body,.page,main,section{ background:#121212 !important; background-image:none !important; color:#E0E0E0; }
.mega-nav, header.mega-nav{ background:#1E1E1E !important; border-bottom:1px solid #4A4A4A !important; }
h1,h2,.logo-text,.brand,.section-title{ color:var(--platinum-warm) !important; }
h3{ color:#E0E0E0 !important; }
a{ color:#E0E0E0; }
.btn{ box-shadow:none !important; background-image:none !important; }
.btn-primary{ background:var(--platinum-warm) !important; border:1px solid var(--platinum-warm) !important; color:#121212 !important; }
.btn-primary:hover{ background:var(--platinum-warm-deep) !important; border-color:var(--platinum-warm-deep) !important; color:#121212 !important; transform:none; }
.btn-outline{ background:transparent !important; border:1px solid rgba(229,228,226,.5) !important; color:#E0E0E0 !important; }
.btn-outline:hover{ background:#E0E0E0 !important; color:#121212 !important; }
.card,.panel,.cta-band,.feature,.box{ background:#1E1E1E !important; border:1px solid #4A4A4A !important; box-shadow:none !important; background-image:none !important; }

/* ── Hero · línea Ora (contraste alto: es el diferenciador, no una nota al pie) ── */
.hero-ora{ font-size:.95rem; color:var(--platinum-warm); margin:18px 0 0; }
.hero-ora a{ color:var(--platinum-warm); font-weight:600; border-bottom:1px solid rgba(217,212,201,.55); padding-bottom:1px; }
.hero-ora a:hover{ border-bottom-color:var(--platinum-warm); }

/* ── Nav móvil · hamburguesa CSS-only (fix crítico: nav desbordaba <920px sin menú) ── */
.nav-toggle{ display:none; }
.nav-burger{ display:none; cursor:pointer; width:30px; height:22px; position:relative; z-index:70; }
.nav-burger span{ display:block; position:absolute; left:0; width:100%; height:2px; background:#E0E0E0; transition:all .25s ease; }
.nav-burger span:nth-child(1){ top:0; }
.nav-burger span:nth-child(2){ top:10px; }
.nav-burger span:nth-child(3){ top:20px; }
@media (max-width: 920px){
  .nav-burger{ display:block; }
  .nav-links{ display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:#161616; flex-direction:column; align-items:center; justify-content:center; gap:30px; z-index:65; padding:40px 24px; }
  .nav-toggle:checked ~ .nav-links{ display:flex; }
  .nav-toggle:checked ~ .nav-burger span:nth-child(1){ top:10px; transform:rotate(45deg); }
  .nav-toggle:checked ~ .nav-burger span:nth-child(2){ opacity:0; }
  .nav-toggle:checked ~ .nav-burger span:nth-child(3){ top:10px; transform:rotate(-45deg); }
  .nav-links .nav-item{ font-size:1.1rem; }
  .language-selector .lang-menu{ position:static; display:block; background:transparent; border:none; box-shadow:none; text-align:center; }
  body:has(.nav-toggle:checked) .ora-fab{ display:none; }
}

/* ── Ora · botón flotante con identidad (conserje IA, no soporte genérico) ── */
.ora-fab{ position:fixed; right:22px; bottom:22px; z-index:9999; display:flex; align-items:center; gap:0; text-decoration:none; }
.ora-fab-bubble{ width:58px; height:58px; border-radius:50%; background:#1E1E1E; border:1px solid rgba(229,228,226,.35); color:#3DCF6E; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 22px rgba(0,0,0,.45); transition:transform .25s ease, border-color .25s ease; flex-shrink:0; }
.ora-fab:hover .ora-fab-bubble{ transform:scale(1.08); border-color:#3DCF6E; }
.ora-fab-label{ display:flex; flex-direction:column; align-items:flex-end; text-align:right; background:rgba(22,22,22,.92); border:1px solid rgba(229,228,226,.18); border-radius:10px; padding:8px 14px; margin-right:12px; backdrop-filter:blur(4px); }
.ora-fab-label strong{ font-family:var(--font-luxury); font-size:.95rem; color:var(--platinum-warm); letter-spacing:.04em; }
.ora-fab-label em{ font-style:normal; font-size:.68rem; color:#9aa0a6; letter-spacing:.06em; max-width:210px; line-height:1.35; }
@media (max-width: 600px){ .ora-fab-label em{ display:none; } .ora-fab-label{ padding:6px 12px; } }