
/* ================================================================
   Sprint 2 UX refinement secondary pages
   ================================================================ */

:root{
  --ux-red:#e2231b;
  --ux-black:#171717;
  --ux-text:#252525;
  --ux-muted:#60656b;
  --ux-line:#dedede;
  --ux-soft:#f7f7f7;
  --ux-soft-red:#fff4f3;
  --ux-blue:#1c92cc;
  --ux-font:'DM Sans',Arial,Helvetica,sans-serif;
}

body:not(.page-home){
  font-family:var(--ux-font);
  color:var(--ux-text);
  background:#fff;
}
body:not(.page-home) h1,
body:not(.page-home) h2,
body:not(.page-home) h3,
body:not(.page-home) .metric strong{
  font-family:var(--ux-font)!important;
  text-transform:none!important;
  letter-spacing:-.025em!important;
}

/* Page headers */
.refined-page-hero{
  padding:38px 0 42px!important;
  background:#fff!important;
  border-bottom:1px solid var(--ux-line)!important;
}
.refined-page-hero::before{display:none!important}
.refined-page-hero .breadcrumb{
  display:flex;align-items:center;gap:8px;
  margin-bottom:28px;color:#70757a;font-size:.85rem
}
.refined-page-hero .breadcrumb a{color:#444;text-decoration:none}
.refined-page-hero .breadcrumb a:hover{text-decoration:underline}
.page-eyebrow,.aside-kicker{
  margin:0 0 8px;color:var(--ux-red);
  font-weight:800;font-size:.78rem;letter-spacing:.09em
}
.refined-page-hero h1{
  margin:0;
  max-width:850px;
  font-size:clamp(2.35rem,4vw,4.2rem)!important;
  line-height:1.03!important;
  color:#171717;
}
.page-intro{
  max-width:760px;margin:14px 0 0;
  color:var(--ux-muted);font-size:1.05rem;line-height:1.65
}

/* Global secondary-page spacing */
body:not(.page-home) .section{padding:52px 0}
body:not(.page-home) .notice{
  border:0!important;border-left:4px solid #d8d8d8!important;
  background:#f7f7f7!important;
  color:#34383d!important;
  border-radius:2px!important;
  padding:14px 16px!important;
}
body:not(.page-home) .notice.warn{border-left-color:var(--ux-red)!important;background:#fff7f6!important}
body:not(.page-home) .notice.success{border-left-color:#238636!important;background:#f4fbf5!important}

/* Forms */
body:not(.page-home) .form-card{
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  padding:0!important;
  background:transparent!important;
}
body:not(.page-home) .form-card h2{font-size:1.55rem!important;margin-bottom:20px}
body:not(.page-home) .form-grid{gap:22px 24px}
body:not(.page-home) .field label{
  font-size:.9rem;font-weight:700;color:#262626;margin-bottom:7px
}
body:not(.page-home) input,
body:not(.page-home) select,
body:not(.page-home) textarea{
  border:1px solid #aeb3b8!important;
  border-radius:5px!important;
  background:#fff!important;
  padding:12px 13px!important;
  min-height:47px;
  transition:border .15s,box-shadow .15s;
}
body:not(.page-home) input:hover,
body:not(.page-home) select:hover,
body:not(.page-home) textarea:hover{border-color:#6f7479!important}
body:not(.page-home) input:focus,
body:not(.page-home) select:focus,
body:not(.page-home) textarea:focus{
  outline:none!important;border-color:#111!important;
  box-shadow:0 0 0 3px rgba(0,0,0,.08)!important
}
body:not(.page-home) .help{color:#71767c}
body:not(.page-home) .btn{
  min-height:45px;border-radius:4px!important;
  font-family:var(--ux-font)!important;font-weight:700;
  padding:10px 18px
}
body:not(.page-home) .btn-primary{background:var(--ux-red)!important}
body:not(.page-home) .btn-primary:hover{background:#ba1813!important}
body:not(.page-home) .btn-ghost{background:#fff;border:1px solid #555!important;color:#222}
body:not(.page-home) .form-actions{
  padding-top:24px;margin-top:28px;border-top:1px solid var(--ux-line)
}

/* Register + login */
.auth-layout{
  display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr);
  gap:70px;align-items:start;max-width:1050px
}
.auth-main{min-width:0}
.auth-aside{
  border-left:1px solid var(--ux-line);
  padding:12px 0 12px 38px;
  position:sticky;top:180px
}
.auth-aside h2{font-size:1.65rem;margin:0 0 12px}
.auth-aside p{color:var(--ux-muted)}
.auth-aside .check-list,.plain-feature-list{list-style:none;padding:0;margin:22px 0 0}
.auth-aside .check-list li,.plain-feature-list li{
  position:relative;padding:9px 0 9px 29px;color:#333
}
.auth-aside .check-list li::before,.plain-feature-list li::before{
  content:"✓";position:absolute;left:0;color:var(--ux-red);font-weight:900
}
.page-login .auth-main{max-width:540px}
.page-login .auth-layout{max-width:980px}
.page-login .notice:first-of-type,.page-register .section>.container>.notice{margin-bottom:34px}

/* About */
.editorial-layout{
  display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);
  gap:90px;align-items:start
}
.editorial-copy{max-width:760px}
.editorial-copy .eyebrow{color:var(--ux-red)}
.editorial-copy h2{margin:38px 0 10px;font-size:1.8rem}
.editorial-copy p{color:#444;line-height:1.75}
.editorial-note{
  border-top:4px solid var(--ux-red);
  padding-top:22px;position:sticky;top:175px
}
.editorial-note h2{font-size:1.6rem;margin:0 0 12px}
.editorial-note p{color:var(--ux-muted);line-height:1.65}
.principle-rail{
  margin-top:46px;padding-top:22px;border-top:1px solid var(--ux-line);
  display:flex;flex-wrap:wrap;gap:10px
}
.principle-rail span{
  padding:8px 11px;background:#f5f5f5;border-radius:999px;
  color:#444;font-size:.82rem
}

/* Questionnaire page */
.questionnaire-list{margin-top:32px;border-top:1px solid var(--ux-line)}
.questionnaire-row{
  padding:30px 0;border-bottom:1px solid var(--ux-line);
  display:grid;grid-template-columns:180px minmax(0,1fr) auto;
  column-gap:32px;align-items:start
}
.questionnaire-row .chip{grid-column:1;grid-row:1/4;align-self:start;width:max-content}
.questionnaire-row h2{grid-column:2;margin:0 0 8px;font-size:1.55rem}
.questionnaire-row p{grid-column:2;margin:0;color:var(--ux-muted);max-width:680px}
.questionnaire-row>a,.questionnaire-row>.btn{grid-column:3;grid-row:1/4;align-self:center}
.questionnaire-row .chip{
  background:transparent!important;color:var(--ux-red)!important;
  padding:0!important;font-weight:800
}

/* Contact */
.contact-layout{
  display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);
  gap:75px;max-width:1050px
}
.contact-form-wrap{min-width:0}
.contact-aside{
  border-left:1px solid var(--ux-line);padding-left:38px;
  position:sticky;top:175px
}
.contact-aside h2{font-size:1.55rem;margin:0 0 12px}
.contact-aside p{color:var(--ux-muted);line-height:1.7}

/* Agreement */
.agreement-layout{
  display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);
  gap:75px;max-width:1100px
}
.agreement-main{min-width:0}
.page-agreement .legal-banner{
  background:transparent!important;color:#222!important;
  border:0!important;border-left:4px solid var(--ux-red)!important;
  padding:3px 0 3px 18px!important;margin-bottom:28px!important
}
.page-agreement .legal-banner strong{font-family:var(--ux-font)!important;font-size:1rem!important}
.agreement-aside{
  border-left:1px solid var(--ux-line);padding-left:36px;
  position:sticky;top:175px
}
.agreement-aside h2{font-size:1.5rem;margin:0 0 10px}
.agreement-aside p{color:var(--ux-muted);line-height:1.65}
.agreement-aside .check-list li::before{background:transparent!important;color:var(--ux-red)!important}
.typed-signature{
  border:0!important;border-bottom:1px solid #aaa!important;
  background:#fbfbfb!important;border-radius:0!important
}

/* The long application: progressive, calm and non-card-like */
.page-apply .section>.container{max-width:1240px}
.application-journey{
  border:0!important;border-radius:0!important;
  display:flex!important;gap:0;background:transparent!important;
  margin:0 0 28px!important;border-bottom:1px solid var(--ux-line)!important
}
.journey-step{
  flex:1;min-height:auto!important;padding:0 16px 14px!important;
  border:0!important;background:transparent!important
}
.journey-step strong{font-family:var(--ux-font)!important;font-size:.9rem!important;text-transform:none!important}
.journey-step span{font-size:.72rem!important}
.journey-step::after{height:3px!important;bottom:-1px!important}
.form-shell{
  grid-template-columns:235px minmax(0,1fr)!important;
  gap:54px!important;align-items:start
}
.step-nav{
  border:0!important;border-radius:0!important;background:#fff!important;
  box-shadow:none!important;padding:0!important;position:sticky;top:165px;
  max-height:calc(100vh - 190px);overflow:auto
}
.step-nav a{
  border-radius:0!important;background:transparent!important;color:#4b4f54!important;
  border-left:2px solid #e1e1e1!important;
  padding:8px 8px 8px 15px!important;font-size:.82rem!important
}
.step-nav a:hover{color:#111!important;border-left-color:#888!important}
.step-nav a.active{
  color:#111!important;font-weight:800!important;
  border-left:3px solid var(--ux-red)!important;background:transparent!important
}
.step-dot{
  background:transparent!important;color:#777!important;border:0!important;
  min-width:24px!important;width:24px!important;height:auto!important
}
.step-nav a.active .step-dot{background:transparent!important;color:var(--ux-red)!important}
.page-apply .progress-wrap{
  margin:0 0 34px;padding:0 0 22px;border-bottom:1px solid var(--ux-line)
}
.page-apply .progress{height:5px!important}
.page-apply .form-card{
  padding:0 0 42px!important;margin:0 0 38px!important;
  border-bottom:1px solid var(--ux-line)!important
}
.page-apply .form-card:last-of-type{border-bottom:0!important}
.page-apply .form-card h2{
  font-size:1.65rem!important;margin:0 0 7px!important
}
.page-apply .form-card>p{color:var(--ux-muted);max-width:760px}
.page-apply .choice{
  border:1px solid #ddd!important;border-radius:5px!important;
  background:#fff!important;padding:12px!important
}
.page-apply .choice:hover{border-color:#999!important}
.page-apply .choice:has(input:checked){
  background:#fff8f7!important;border-color:var(--ux-red)!important;
  box-shadow:none!important
}
.page-apply .repeatable-card{
  border:0!important;border-left:3px solid #ddd!important;
  border-radius:0!important;background:#fafafa!important;
  padding:18px 20px!important;margin:12px 0!important
}

/* Dashboards: turn dark left rail into lightweight workspace tabs */
.refined-dashboard{
  display:block!important;background:#fff!important;min-height:0!important
}
.workspace-nav{
  position:sticky;top:144px;z-index:50;
  display:flex!important;align-items:center;gap:4px;
  background:#fff!important;color:#111!important;
  padding:0 max(24px,calc((100vw - 1240px)/2))!important;
  border-bottom:1px solid var(--ux-line);
  overflow:auto
}
.workspace-nav h2{
  font-size:.8rem!important;text-transform:uppercase!important;letter-spacing:.08em!important;
  margin:0 24px 0 0!important;color:#686d72!important;white-space:nowrap
}
.workspace-nav a{
  color:#3d4247!important;background:transparent!important;
  padding:16px 14px!important;border:0!important;border-bottom:3px solid transparent!important;
  white-space:nowrap
}
.workspace-nav a:hover{color:#000!important;background:#f7f7f7!important}
.workspace-nav a.active{color:#111!important;border-bottom-color:var(--ux-red)!important;font-weight:800}
.dashboard-main{
  padding:38px max(24px,calc((100vw - 1240px)/2)) 70px!important;
  background:#fff!important
}
.metric-grid{
  grid-template-columns:repeat(4,1fr)!important;
  gap:0!important;margin:30px 0 46px!important;
  border-top:1px solid var(--ux-line);border-bottom:1px solid var(--ux-line)
}
.metric{
  border:0!important;border-radius:0!important;box-shadow:none!important;
  border-right:1px solid var(--ux-line)!important;
  padding:22px 26px!important;background:#fff!important
}
.metric:last-child{border-right:0!important}
.metric strong{font-size:2.15rem!important;color:#111}
.metric span{color:var(--ux-muted);font-size:.84rem}
.dashboard-main .section-heading{margin-bottom:18px!important}
.dashboard-main .section-heading h2{font-size:1.65rem!important}
.table-wrap{
  border:1px solid var(--ux-line)!important;border-radius:6px!important;
  box-shadow:none!important;overflow:auto!important
}
table{font-family:var(--ux-font)!important}
th{
  background:#f6f6f6!important;color:#303030!important;
  font-size:.76rem!important;text-transform:uppercase;letter-spacing:.04em;
  border-bottom:1px solid #d8d8d8!important
}
td{font-size:.86rem!important;border-bottom:1px solid #ececec!important}
.status{font-size:.76rem!important}
.search-bar{
  display:grid!important;grid-template-columns:minmax(280px,1fr) 210px auto;
  gap:10px!important;margin-bottom:16px!important
}
.search-bar input,.search-bar select{min-height:43px!important}

/* Footer stays visually consistent but less heavy on secondary pages */
body:not(.page-home) .site-footer{margin-top:0}
body:not(.page-home) .footer-grid{padding-top:38px!important}

/* Mobile */
@media(max-width:900px){
  .auth-layout,.editorial-layout,.contact-layout,.agreement-layout{grid-template-columns:1fr;gap:40px}
  .auth-aside,.editorial-note,.contact-aside,.agreement-aside{
    position:static;border-left:0;border-top:1px solid var(--ux-line);padding:28px 0 0
  }
  .questionnaire-row{grid-template-columns:1fr}
  .questionnaire-row .chip,.questionnaire-row h2,.questionnaire-row p,.questionnaire-row>a,.questionnaire-row>.btn{
    grid-column:1;grid-row:auto
  }
  .questionnaire-row>a,.questionnaire-row>.btn{margin-top:16px;width:max-content}
  .form-shell{grid-template-columns:1fr!important;gap:22px!important}
  .step-nav{
    position:static;display:flex!important;overflow:auto;max-height:none!important;
    border-bottom:1px solid var(--ux-line)!important;padding-bottom:8px!important
  }
  .step-nav a{
    border-left:0!important;border-bottom:2px solid #ddd!important;
    min-width:max-content
  }
  .step-nav a.active{border-left:0!important;border-bottom-color:var(--ux-red)!important}
  .application-journey{overflow:auto}
  .journey-step{min-width:180px!important}
  .metric-grid{grid-template-columns:1fr 1fr!important}
  .metric:nth-child(2){border-right:0!important}
  .metric:nth-child(-n+2){border-bottom:1px solid var(--ux-line)!important}
}
@media(max-width:620px){
  .refined-page-hero{padding:28px 0 32px!important}
  .refined-page-hero .breadcrumb{margin-bottom:20px}
  .refined-page-hero h1{font-size:2.45rem!important}
  .page-intro{font-size:.98rem}
  .metric-grid{grid-template-columns:1fr!important}
  .metric{border-right:0!important;border-bottom:1px solid var(--ux-line)!important}
  .search-bar{grid-template-columns:1fr!important}
}
