:root{
  --brand:#c9a14a;
  --brand2:#e2c27b;
  --ink:#0f1115;
  --muted:#667085;
  --bg:#f6f5f1;
  --surface:#ffffff;
  --radius:18px;
  --border:rgba(15,23,42,.10);
  --shadow:0 18px 55px rgba(12,12,18,.12);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif;
  color:var(--ink);
  background:var(--bg);
}

a{color:var(--brand);text-decoration:none}
a:hover{opacity:.92}

.navbar-blur{
  backdrop-filter:saturate(160%) blur(10px);
  background:rgba(255,255,255,.78)!important;
  border-bottom:1px solid rgba(15,23,42,.08);
}

.brand-badge{display:flex;align-items:center;gap:.6rem}
.brand-badge img{
  width:34px;height:34px;
  object-fit:contain;
  border-radius:10px;
  background:transparent;
}

.brand-title{
  font-family:"Playfair Display",ui-serif,Georgia,serif;
  letter-spacing:.02em;
}

.badge-soft{
  display:inline-flex;align-items:center;gap:.35rem;
  font-weight:700;
  font-size:.82rem;
  padding:.35rem .65rem;
  border-radius:999px;
  color:#7a5a1a;
  background:rgba(201,161,74,.14);
  border:1px solid rgba(201,161,74,.30);
}

.hero{
  position:relative;
  overflow:hidden;
  border-radius:28px;
  background:linear-gradient(180deg,#0b0c10 0%,#12121a 100%);
  color:#fff;
}
.hero::before{
  content:"";
  position:absolute;inset:-220px;
  background:
    radial-gradient(closest-side at 16% 18%, rgba(201,161,74,.35), transparent 60%),
    radial-gradient(closest-side at 80% 50%, rgba(226,194,123,.18), transparent 65%);
  opacity:1;
}
.hero::after{
  content:"";
  position:absolute;inset:0;
  background:
    linear-gradient(to right, rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:64px 64px;
  opacity:.08;
  pointer-events:none;
}
.hero .inner{position:relative;padding:clamp(18px,4vw,44px)}
.hero h1{
  font-family:"Playfair Display",ui-serif,Georgia,serif;
  font-weight:700;
  letter-spacing:-.01em;
  line-height:1.05;
  margin:0 0 12px 0;
}
.hero p{color:rgba(255,255,255,.86);max-width:65ch;margin:0 0 18px 0}
.hero .cta{display:flex;gap:10px;flex-wrap:wrap}

.btn-brand{
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  border:none;
  color:#0b0b0f;
  border-radius:14px;
  padding:12px 16px;
  font-weight:800;
}
.btn-brand:hover{filter:brightness(1.02)}

.btn-ghost{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  color:white;
  border-radius:14px;
  padding:12px 16px;
  font-weight:700;
}
.btn-ghost:hover{background:rgba(255,255,255,.12);color:#fff}

.section-title{font-weight:900;letter-spacing:-.02em}
.small-muted{color:var(--muted);font-size:.95rem}

.card-elev{
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  background:var(--surface);
}
.kpi{
  border-radius:16px;
  border:1px solid var(--border);
  background:var(--surface);
  padding:14px;
  min-height:72px;
  color:var(--ink);
}
.kpi .num,
.kpi .value{
  font-weight:900;
  font-size:1.15rem;
  color:var(--ink);
}
.kpi .lbl,
.kpi .label{
  color:var(--muted);
  font-size:.9rem;
  margin-top:2px;
}

/* KPIs sobre fondo oscuro (hero) */
.hero .kpi{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.14);
  color:#fff;
}
.hero .kpi .num,
.hero .kpi .value{color:#fff;}
.hero .kpi .lbl,
.hero .kpi .label{color:rgba(255,255,255,.72);}

/* Cards sobre fondo oscuro */
.card-dark{
  background:rgba(255,255,255,.06)!important;
  border-color:rgba(255,255,255,.12)!important;
  color:#fff;
}
.card-dark .small-muted{color:rgba(255,255,255,.72)!important;}
.card-dark hr{border-color:rgba(255,255,255,.18)!important;}

.hero-preview{
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.20);
  box-shadow:0 28px 70px rgba(0,0,0,.45);
}
.hero-preview img{
  width:100%;
  height:260px;
  display:block;
  object-fit:cover;
  object-position:center;
  filter:saturate(1.02) contrast(1.03);
  opacity:.96;
}

@media (max-width: 991px){
  .hero-preview img{height:210px}
  .hero .cta .btn{width:100%}
}

@media (max-width: 575px){
  .hero-preview img{height:170px}
  .hero h1{font-size:clamp(28px,8vw,44px)}
}

.table-lite th, .table-lite td{padding:.65rem .75rem}
.table-lite thead th{background:#fbfaf7;border-bottom:1px solid var(--border);font-weight:800}
.table-lite tbody tr{border-bottom:1px solid rgba(15,23,42,.06)}

.form-card{
  max-width:560px;
  margin:0 auto;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

.footer{
  border-top:1px solid rgba(15,23,42,.08);
  padding:26px 0;
  margin-top:52px;
  background:rgba(255,255,255,.55);
  backdrop-filter:saturate(160%) blur(8px);
}

/* Bootstrap color overrides (sin recompilar Bootstrap) */
.btn-outline-primary{
  --bs-btn-color: var(--brand);
  --bs-btn-border-color: rgba(201,161,74,.55);
  --bs-btn-hover-bg: rgba(201,161,74,.12);
  --bs-btn-hover-border-color: rgba(201,161,74,.75);
  --bs-btn-hover-color: #0b0b0f;
  --bs-btn-active-bg: rgba(201,161,74,.18);
  --bs-btn-active-border-color: rgba(201,161,74,.85);
}
.btn-primary{
  --bs-btn-bg: var(--brand);
  --bs-btn-border-color: var(--brand);
  --bs-btn-hover-bg: var(--brand2);
  --bs-btn-hover-border-color: var(--brand2);
  --bs-btn-color:#0b0b0f;
}
.text-primary{color:var(--brand)!important}