/* =========================
   DESIGN TOKENS
========================= */
:root{
    --navy:#101c2c;
    --navy-soft:#1c2c42;
    --cream:#f7f3ea;
    --gold:#c9a14d;
    --gold-soft:#e2c88a;
    --ink:#20242c;
    --grey:#5d6470;
    --line: rgba(201,161,77,0.28);
  }
/* =========================
   LANDING
========================= */
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Work Sans', sans-serif;
    background:var(--cream);
    color:var(--ink);
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3{
    font-family:'Fraunces', serif;
    font-weight:500;
    letter-spacing:-0.01em;
    color:var(--navy);
  }
  a{color:inherit;}
  img{max-width:100%; display:block;}

  /* ---------- HEADER ---------- */
  header{
    position:sticky; top:0; z-index:50;
    display:flex; align-items:center; justify-content:space-between;
    padding: 22px 6vw;
    background:rgba(247,243,234,0.9);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line);
  }
  .brand{
    font-family:'Fraunces', serif;
    font-size:1.15rem;
    font-weight:600;
    color:var(--navy);
    letter-spacing:0.02em;
  }
  .brand span{color:var(--gold);}
  .header-cta{
    font-size:0.85rem;
    font-weight:600;
    padding:11px 22px;
    border-radius:100px;
    background:var(--navy);
    color:var(--cream);
    text-decoration:none;
    white-space:nowrap;
    transition: transform .2s ease, background .2s ease;
  }
  .header-cta:hover{background:var(--navy-soft); transform:translateY(-1px);}

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    padding: 9vw 6vw 7vw;
    overflow:hidden;
    background:
      radial-gradient(60% 55% at 82% 8%, rgba(201,161,77,0.18), transparent 65%),
      var(--cream);
  }
  .hero::after{
    content:"";
    position:absolute; left:0; right:0; bottom:0;
    height:1px;
    background:linear-gradient(90deg, transparent, var(--gold) 50%, transparent);
    opacity:0.6;
  }
  .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-size:0.78rem; letter-spacing:0.14em; text-transform:uppercase;
    color:var(--gold); font-weight:600; margin-bottom:22px;
  }
  .eyebrow::before{
    content:""; width:26px; height:1px; background:var(--gold);
  }
  .hero h1{
    font-size: clamp(2.3rem, 5.2vw, 3.8rem);
    max-width:15ch;
    line-height:1.08;
  }
  .hero h1 em{
    font-style:normal;
    color:var(--gold);
  }
  .hero p.lede{
    margin-top:26px;
    max-width:46ch;
    font-size:1.08rem;
    color:var(--grey);
  }
  .hero-actions{
    display:flex; flex-wrap:wrap; gap:16px; margin-top:38px;
  }
  .btn-primary{
    display:inline-flex; align-items:center; gap:10px;
    background:var(--navy); color:var(--cream);
    padding:15px 30px; border-radius:100px;
    text-decoration:none; font-weight:600; font-size:0.95rem;
    transition: transform .2s ease, box-shadow .2s ease;
    box-shadow:0 8px 24px -8px rgba(16,28,44,0.45);
  }
  .btn-primary:hover{transform:translateY(-2px); box-shadow:0 12px 28px -8px rgba(16,28,44,0.55);}
  .btn-ghost{
    display:inline-flex; align-items:center; gap:8px;
    padding:15px 26px; border-radius:100px;
    border:1px solid var(--line);
    text-decoration:none; font-weight:600; font-size:0.95rem;
    color:var(--navy);
    transition: border-color .2s ease, background .2s ease;
  }
  .btn-ghost:hover{border-color:var(--gold); background:rgba(201,161,77,0.08);}

  .ledger{
    margin-top:56px;
    display:flex; flex-wrap:wrap; gap:0;
    border-top:1px solid var(--line);
    padding-top:26px;
    max-width:640px;
  }
  .ledger-item{
    flex:1 1 140px;
    padding-right:24px;
  }
  .ledger-item .num{
    font-family:'Fraunces', serif; font-size:1.7rem; color:var(--navy); font-weight:500;
  }
  .ledger-item .lbl{
    font-size:0.8rem; color:var(--grey); margin-top:4px;
  }

  /* ---------- PILARES ---------- */
  .pillars{
    padding: 6vw 6vw;
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:2px;
    background:var(--line);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .pillar{
    background:var(--cream);
    padding:44px 34px;
  }
  .pillar .mark{
    width:34px; height:34px; border-radius:50%;
    border:1px solid var(--gold);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:20px;
    font-family:'Fraunces', serif; color:var(--gold); font-size:0.95rem;
  }
  .pillar h3{font-size:1.15rem; margin-bottom:10px;}
  .pillar p{color:var(--grey); font-size:0.95rem;}

  /* ---------- SERVICIOS (un formulario por servicio) ---------- */
  .services{
    padding: 7vw 6vw 9vw;
    background:var(--navy);
  }
  .services-head{
    max-width:640px; margin-bottom:52px;
  }
  .services-head .eyebrow{color:var(--gold-soft);}
  .services-head h2{
    color:var(--cream);
    font-size:clamp(1.8rem, 3.4vw, 2.5rem);
  }
  .services-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:1px;
    background:rgba(226,200,138,0.18);
  }
  .service-card{
    background:var(--navy);
    padding:40px 38px;
    display:flex;
    flex-direction:column;
  }
  .service-card .service-num{
    font-family:'Fraunces', serif;
    color:var(--gold);
    font-size:0.85rem;
    letter-spacing:0.08em;
    margin-bottom:14px;
  }
  .service-card h3{
    color:var(--cream);
    font-size:1.35rem;
    margin-bottom:14px;
  }
  .service-card p.desc{
    color:rgba(247,243,234,0.68);
    font-size:0.95rem;
    margin-bottom:22px;
    flex-grow:0;
  }
  .feature-list{
    list-style:none;
    margin-bottom:28px;
    border-top:1px solid rgba(226,200,138,0.16);
    padding-top:18px;
  }
  .feature-list li{
    display:flex; align-items:baseline; gap:10px;
    font-size:0.86rem;
    color:rgba(247,243,234,0.8);
    padding:6px 0;
  }
  .feature-list li::before{
    content:"—";
    color:var(--gold);
    flex-shrink:0;
  }
  .service-cta{
    margin-top:auto;
    display:inline-flex; align-items:center; gap:8px;
    align-self:flex-start;
    padding:13px 26px;
    border-radius:100px;
    border:1px solid var(--gold);
    color:var(--gold-soft);
    text-decoration:none;
    font-weight:600;
    font-size:0.88rem;
    transition: background .2s ease, color .2s ease;
  }
  .service-cta:hover{
    background:var(--gold);
    color:var(--navy);
  }

  /* ---------- RECURSOS PARA ALIADOS ---------- */
  .ally-resources{
    padding:clamp(56px, 7vw, 104px) 6vw;
    background:var(--cream);
  }
  .ally-resources-content{
    max-width:1100px;
    margin:auto;
    padding:clamp(28px, 5vw, 64px);
    border:1px solid var(--line);
    background:linear-gradient(135deg, rgba(226,200,138,0.18), rgba(247,243,234,0) 58%);
  }
  .ally-resources .eyebrow{margin-bottom:18px;}
  .ally-resources h2{
    max-width:22ch;
    font-size:clamp(1.8rem, 3.4vw, 2.5rem);
    line-height:1.18;
  }
  .ally-resources p{
    max-width:66ch;
    margin-top:18px;
    color:var(--grey);
    font-size:1rem;
  }
  .ally-resources-categories{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    list-style:none;
    margin:30px 0 34px;
  }
  .ally-resources-categories li{
    max-width:100%;
    padding:8px 14px;
    border:1px solid var(--line);
    border-radius:100px;
    color:var(--navy);
    font-size:0.85rem;
    font-weight:500;
  }
  .ally-resources-cta:focus-visible{
    outline:3px solid var(--gold);
    outline-offset:4px;
  }
  @media (max-width: 560px){
    .ally-resources{padding:48px 5vw;}
    .ally-resources-categories{margin:24px 0 28px;}
    .ally-resources-cta{width:100%; min-height:52px; justify-content:center; text-align:center; padding:14px 20px;}
  }

  /* ---------- DESCARGAS ---------- */
  .downloads{
    padding: 6vw 6vw 7vw;
    background:var(--cream);
  }
  .downloads-head{
    max-width:520px; margin-bottom:34px;
  }
  .downloads-head h2{
    font-size:clamp(1.5rem, 2.6vw, 1.9rem);
    margin-bottom:10px;
  }
  .downloads-head p{
    color:var(--grey); font-size:0.95rem;
  }
  .downloads-list{
    display:flex; flex-direction:column;
    border-top:1px solid var(--line);
  }
  .download-row{
    display:flex; align-items:center; justify-content:space-between;
    gap:20px;
    padding:22px 4px;
    border-bottom:1px solid var(--line);
    text-decoration:none;
    color:var(--ink);
    transition: background .2s ease;
  }
  .download-row:hover{background:rgba(201,161,77,0.06);}
  .download-row .dl-info{
    display:flex; align-items:baseline; gap:14px;
  }
  .download-row .dl-ext{
    font-family:'Fraunces', serif;
    font-size:0.72rem;
    letter-spacing:0.08em;
    color:var(--gold);
    border:1px solid var(--gold);
    border-radius:100px;
    padding:3px 10px;
    flex-shrink:0;
  }
  .download-row .dl-name{
    font-size:0.98rem; font-weight:500;
  }
  .download-row .dl-action{
    font-size:0.85rem; font-weight:600; color:var(--navy);
    white-space:nowrap;
  }

  /* ---------- FOOTER ---------- */
  footer{
    padding:34px 6vw;
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;
    border-top:1px solid var(--line);
    font-size:0.82rem; color:var(--grey);
  }
  footer a{text-decoration:none; color:var(--grey);}
  footer a:hover{color:var(--gold);}
  .foot-links{display:flex; gap:20px;}

  @media (max-width: 820px){
    .pillars{grid-template-columns:1fr;}
    .services-grid{grid-template-columns:1fr;}
    header{padding:18px 5vw;}
    .hero{padding:16vw 5vw 12vw;}
  }

/* =========================
   AUTH
========================= */
.auth-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: radial-gradient(60% 55% at 82% 8%, rgba(201,161,77,.18), transparent 65%), var(--cream); }
.auth-card { width: min(100%, 430px); padding: 38px 30px; background: #fff; border: 1px solid var(--line); box-shadow: 0 22px 55px -35px rgba(16,28,44,.55); }
.auth-brand { display: block; margin-bottom: 36px; text-decoration: none; }
.auth-card .eyebrow { margin-bottom: 12px; }
.auth-card h1 { font-size: clamp(2rem, 8vw, 2.7rem); margin-bottom: 24px; }
.auth-form { display: grid; gap: 10px; }
.auth-form label { margin-top: 8px; color: var(--navy); font-size: .88rem; font-weight: 600; }
.auth-form input { width: 100%; padding: 13px 14px; border: 1px solid rgba(16,28,44,.22); border-radius: 4px; background: var(--cream); color: var(--ink); font: inherit; }
.auth-form input:focus { outline: 2px solid rgba(201,161,77,.4); border-color: var(--gold); }
.auth-form .btn-primary { justify-content: center; border: 0; margin-top: 18px; cursor: pointer; }
.alert { margin-bottom: 18px; padding: 12px 14px; border-left: 3px solid; font-size: .9rem; }
.alert-error { border-color: #9f3a38; background: #fff4f3; color: #742a28; }
.alert-success { border-color: #427c54; background: #f2faf4; color: #2d593a; }
.app-shell { min-height: 100vh; }
.app-header { position: static; gap: 24px; }
.app-header .brand { text-decoration: none; }
.app-nav { display: flex; flex-wrap: wrap; gap: 12px 18px; margin-left: auto; }
.app-nav a { color: var(--navy); font-size: .9rem; font-weight: 600; text-decoration: none; }
.app-header-actions { display: flex; flex: 0 1 auto; align-items: center; gap: 20px; min-width: 0; }
.app-user { display: grid; min-width: 0; max-width: 260px; color: var(--grey); font-size: .85rem; overflow-wrap: anywhere; }
.app-user small { font-size: .72rem; }
.logout-form { flex: 0 0 auto; }
.logout-form button { padding: 9px 16px; border: 1px solid var(--navy); border-radius: 100px; background: transparent; color: var(--navy); font: inherit; font-size: .82rem; font-weight: 600; cursor: pointer; }
.app-main { min-height: calc(100vh - 160px); padding: 6vw; }
.module-placeholder { max-width: 720px; margin: 0 auto; padding: 48px; border: 1px solid var(--line); background: #fff; }
.module-placeholder h1 { margin-bottom: 12px; }
.module-placeholder p { color: var(--grey); }

/* =========================
   FORMS
========================= */
.page-head{max-width:900px;margin:0 auto 28px}.page-head h1{font-size:clamp(2rem,6vw,3rem)}.page-head p{color:var(--grey);margin-top:8px}
.referral-layout{max-width:900px;margin:auto;display:grid;grid-template-columns:minmax(200px,280px) 1fr;gap:24px;align-items:start}.seller-card,.referral-form,.confirmation-card,.detail-card{background:#fff;border:1px solid var(--line);padding:28px}.seller-card{display:grid;gap:5px}.seller-card span{color:var(--grey);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}.seller-card strong{margin-bottom:18px;color:var(--navy)}
.referral-form{display:grid;gap:9px}.referral-form label,.filters label{font-size:.88rem;font-weight:600;color:var(--navy);margin-top:8px}.referral-form input,.referral-form select,.referral-form textarea,.filters input,.filters select{width:100%;min-height:48px;padding:12px;border:1px solid rgba(16,28,44,.24);background:var(--cream);font:inherit}.referral-form textarea{resize:vertical}.referral-form :focus,.filters :focus{outline:2px solid rgba(201,161,77,.35);border-color:var(--gold)}.referral-form .btn-primary{border:0;justify-content:center;margin-top:16px;cursor:pointer}
.confirmation-card,.detail-card{max-width:800px;margin:auto}.success-mark{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#edf7ef;color:#2d593a;font-size:1.5rem;margin-bottom:18px}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:28px 0}.detail-grid div{border-top:1px solid var(--line);padding-top:12px}.detail-grid dt{color:var(--grey);font-size:.78rem;text-transform:uppercase}.detail-grid dd{color:var(--navy);font-weight:600;margin-top:4px}.detail-grid .detail-wide{grid-column:1/-1}.form-actions{display:flex;flex-wrap:wrap;gap:12px}
.filters{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:12px;align-items:end;margin-bottom:22px}.filters .btn-ghost{height:48px;background:transparent;cursor:pointer}.table-wrap{overflow-x:auto;background:#fff;border:1px solid var(--line)}table{width:100%;border-collapse:collapse;min-width:720px}th,td{text-align:left;padding:14px;border-bottom:1px solid var(--line);font-size:.9rem}th{color:var(--navy);background:rgba(201,161,77,.08)}td a,.pagination a{color:var(--navy);font-weight:600}.pagination{display:flex;justify-content:center;gap:18px;margin-top:22px;color:var(--grey)}
.status-badge{display:inline-flex;padding:5px 10px;border-radius:100px;background:rgba(201,161,77,.14);color:var(--navy);font-size:.78rem;font-weight:600}
.workflow-detail h2{font-size:1.25rem;margin-top:32px}.timeline{list-style:none;margin:18px 0 32px;border-left:2px solid var(--line);padding-left:24px}.timeline li{position:relative;display:grid;gap:4px;padding:0 0 24px}.timeline li::before{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:var(--gold);left:-30px;top:7px}.timeline time,.notes time{font-size:.78rem;color:var(--grey)}.timeline span{color:var(--grey);font-size:.88rem}.timeline em{width:max-content;padding:3px 8px;background:rgba(159,58,56,.09);color:#742a28;font-size:.75rem;font-style:normal}.timeline p,.notes p{white-space:normal;overflow-wrap:anywhere}.notes{display:grid;gap:12px;margin:18px 0 30px}.notes article{padding:16px;border:1px solid var(--line);background:var(--cream)}.notes article header{position:static;padding:0 0 10px;background:none;border:0;display:flex;gap:12px}.workflow-actions{display:grid;grid-template-columns:1fr 1fr;gap:20px}.workflow-actions>h2{grid-column:1/-1}.checkbox{display:flex!important;align-items:center;gap:8px}.checkbox input{width:auto;min-height:auto}

/* =========================
   DASHBOARD
========================= */
.document-upload{display:grid;gap:8px;margin:14px 0;padding:20px;border:1px solid var(--line);background:rgba(201,161,77,.06)}.document-upload legend{padding:0 8px;font-family:'Fraunces',serif;font-size:1.15rem;color:var(--navy)}.document-upload p,.document-upload small,.document-form small{color:var(--grey)}.document-upload input[type=file]{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.file-picker{display:inline-flex!important;width:max-content;margin:4px 0!important;padding:12px 20px;border:1px solid var(--gold);border-radius:100px;background:var(--navy);color:var(--cream)!important;cursor:pointer}.documents-panel{margin:30px 0}.documents-table{min-width:760px}.document-form{margin-top:18px;background:var(--cream)}
.status-desembolsado,.status-aprobado,.status-viable{background:rgba(66,124,84,.13);color:#2d593a}.status-negado,.status-rechazado,.status-no_viable{background:rgba(159,58,56,.09);color:#742a28}.status-no_contesta,.status-gimnasia_financiera{background:rgba(201,161,77,.18)}
.dashboard-welcome { margin-bottom: 38px; }
.dashboard-welcome .eyebrow { margin-bottom: 12px; }
.dashboard-welcome h1 { font-size: clamp(2rem, 5vw, 3rem); }
.dashboard-welcome p { margin-top: 8px; color: var(--grey); }
.dashboard-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; }
.dashboard-card { min-height: 160px; display: flex; flex-direction: column; justify-content: space-between; padding: 26px; border: 1px solid var(--line); background: #fff; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
.dashboard-card:hover { transform: translateY(-2px); box-shadow: 0 16px 30px -24px rgba(16,28,44,.6); }
.dashboard-card h2 { font-size: 1.35rem; }
.dashboard-card span { color: var(--gold); font-size: .88rem; font-weight: 600; }
.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-bottom:34px}.metrics-grid article{display:grid;gap:4px;padding:20px;background:#fff;border:1px solid var(--line)}.metrics-grid strong{font-family:'Fraunces',serif;font-size:2rem;color:var(--navy)}.metrics-grid span{font-size:.82rem;color:var(--grey)}.admin-head{display:flex;align-items:center;justify-content:space-between}.admin-form{max-width:680px;margin:0 auto}.admin-actions{max-width:680px;margin:24px auto;display:grid;gap:20px}.admin-referral-filters,.audit-filters{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.admin-referral-filters .btn-ghost,.audit-filters .btn-ghost{justify-content:center;align-items:center;background:transparent;cursor:pointer}

@media (max-width: 1024px) {
  .app-header { flex-wrap: wrap; }
  .app-nav { order: 3; width: 100%; margin-left: 0; }
  .app-header-actions { margin-left: auto; }
}

@media (max-width: 700px) {
  .app-header { align-items: flex-start; gap: 12px; }
  .app-main{padding:32px 16px}.referral-layout{grid-template-columns:1fr}.seller-card,.referral-form,.confirmation-card,.detail-card{padding:22px 18px}.filters{grid-template-columns:1fr}.detail-grid{grid-template-columns:1fr}.form-actions a{width:100%;justify-content:center}
.workflow-actions{grid-template-columns:1fr}
}

@media (max-width: 560px) {
  .app-header-actions { width: 100%; margin-left: 0; align-items: flex-start; flex-wrap: wrap; }
  .app-user { flex: 1 1 180px; max-width: none; }
}

.commission-panel{margin:32px -1px;padding:24px;border:1px solid var(--line);background:rgba(201,161,77,.05)}
.commission-panel h3{margin:24px 0 12px}.commission-form{margin-top:22px}.commission-timeline{margin-bottom:12px}.commission-filters{grid-template-columns:2fr 1fr 1fr 1fr auto}
@media(max-width:900px){.commission-filters{grid-template-columns:1fr 1fr}.commission-filters button{align-self:end}}
@media(max-width:560px){.commission-filters{grid-template-columns:1fr}.commission-panel{margin:28px 0;padding:16px}}

@media (max-width: 375px) {
  .hero .eyebrow { display: block; max-width: 100%; font-size: .68rem; letter-spacing: .08em; overflow-wrap: anywhere; }
  .hero .eyebrow::before { display: none; }
  .auth-page { padding: 12px; }
  .auth-card { padding: 30px 18px; }
}

/* =========================
   AUTHENTICATED LAYOUT
========================= */
.app-footer { position: static; }
.admin-head-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:12px}.admin-head-actions form{margin:0}.admin-head-actions .btn-ghost{padding:12px 18px;background:#fff;cursor:pointer}.sync-summary{max-width:900px;margin:0 auto 20px}.managed-notice{max-width:680px;margin:0 auto 18px;padding:14px 16px;border-left:3px solid var(--gold);background:rgba(201,161,77,.09);color:var(--navy)}.external-user-details{max-width:680px;margin:0 auto 20px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:20px;background:#fff;border:1px solid var(--line)}.external-user-details div:last-child{grid-column:1/-1}.external-user-details dt{font-size:.76rem;text-transform:uppercase;color:var(--grey)}.external-user-details dd{margin-top:3px;color:var(--navy);overflow-wrap:anywhere}.auth-help{margin:-10px 0 18px;color:var(--grey)}.mandatory-logout{margin-top:18px;text-align:center}.mandatory-logout button{border:0;background:transparent;color:var(--navy);text-decoration:underline;cursor:pointer}
@media(max-width:700px){.admin-head{align-items:flex-start;gap:18px;flex-direction:column}.admin-head-actions{width:100%;justify-content:flex-start}.external-user-details{grid-template-columns:1fr}.external-user-details div:last-child{grid-column:auto}}
.sync-force-panel{max-width:900px;margin:0 auto 24px;padding:22px;border:2px solid #9f3a38;background:#fff4f3;color:#742a28}.sync-force-panel h2{font-size:1.35rem;margin-bottom:8px}.sync-force-panel dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0}.sync-force-panel dt{font-size:.75rem;text-transform:uppercase}.sync-force-panel dd{font-weight:700}.sync-force-panel form{display:grid;gap:12px}.btn-danger{width:max-content;padding:11px 18px;border:0;background:#742a28;color:#fff;font:inherit;font-weight:700;cursor:pointer}@media(max-width:700px){.sync-force-panel dl{grid-template-columns:1fr 1fr}}
.sync-status{max-width:900px;margin:0 auto 20px;padding:18px;border:1px solid var(--line);background:#fff}.sync-status h2{font-size:1.1rem;margin-bottom:8px}.sync-status p{color:var(--grey);overflow-wrap:anywhere}
