/* Use Cases — page-specific styles */
/* Inherits base tokens and components from v3-styles.css */

/* ===== HERO ===== */
.uc-hero{background:var(--dark);padding:120px 0 80px;text-align:center;position:relative;overflow:hidden}
.uc-hero::before{content:'';position:absolute;top:0;left:50%;width:120%;height:120%;transform:translate(-50%,-20%);background:radial-gradient(ellipse at 50% 60%,rgba(200,96,10,0.10) 0%,transparent 60%);pointer-events:none}
.uc-hero-inner{position:relative;z-index:1;max-width:680px;margin:0 auto}
.uc-hero .eyebrow-row{margin-bottom:20px;justify-content:center}
.uc-hero h1{color:var(--white);margin-bottom:20px}
.uc-hero .body-lg{color:rgba(245,240,234,0.65);max-width:520px;margin:0 auto}

/* ===== JUMP NAV ===== */
.uc-jump{background:var(--bg);padding:56px 0 0}
.uc-jump-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.uc-jump-card{display:flex;align-items:center;gap:14px;padding:18px 20px;background:var(--white);border:1px solid var(--line-soft);border-radius:10px;transition:border-color .2s,box-shadow .2s,transform .2s;text-decoration:none}
.uc-jump-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 8px 24px rgba(28,23,17,0.08)}
.uc-jump-num{font-family:var(--serif);font-size:28px;color:var(--accent);line-height:1;letter-spacing:-0.02em;min-width:36px}
.uc-jump-name{font-family:var(--sans);font-size:14px;font-weight:600;color:var(--dark);line-height:1.25}

/* ===== USE CASE SECTIONS ===== */
.uc-section{padding:80px 0;border-top:1px solid var(--line-soft)}
.uc-section.alt{background:var(--white)}
.uc-section:not(.alt){background:var(--bg)}
.uc-section-inner{max-width:var(--maxw);margin:0 auto;padding:0 64px}

/* Section head: number + title */
.uc-section-head{display:flex;align-items:baseline;gap:20px;margin-bottom:48px}
.uc-num{font-family:var(--serif);font-size:72px;line-height:0.85;letter-spacing:-0.04em;color:var(--accent);opacity:0.3}
.uc-section-head h2{font-size:clamp(28px,3.5vw,40px);margin:0}

/* Two columns: challenge + solution */
.uc-columns{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-bottom:40px}
.uc-col p{font-size:16px;line-height:1.7;color:var(--text);margin:0}
.uc-col-title{font-family:var(--mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;font-weight:500;margin-bottom:16px;display:flex;align-items:center;gap:10px}
.uc-col-title::before{content:"";width:20px;height:1px;flex-shrink:0}
.uc-col-title.challenge{color:var(--muted)}
.uc-col-title.challenge::before{background:var(--border)}
.uc-col-title.solution{color:var(--accent-deep)}
.uc-col-title.solution::before{background:var(--accent)}

/* Features row */
.uc-features{background:var(--white);border:1px solid var(--line-soft);border-radius:12px;padding:28px 32px}
.uc-section.alt .uc-features{background:var(--bg)}
.uc-features-label{font-family:var(--mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--muted);margin:0 0 16px;font-weight:500}
.uc-features-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 32px}
.uc-features-list li{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.5;color:var(--dark)}
.uc-features-list li::before{content:"";width:6px;height:6px;margin-top:7px;flex-shrink:0;border-radius:50%;background:var(--accent)}

/* ===== RESPONSIVE ===== */
@media(max-width:1024px){
  .uc-jump-grid{grid-template-columns:repeat(2,1fr)}
  .uc-columns{grid-template-columns:1fr;gap:32px}
  .uc-features-list{grid-template-columns:1fr}
}
@media(max-width:768px){
  .uc-hero{padding:88px 0 56px}
  .uc-jump{padding:40px 0 0}
  .uc-jump-grid{grid-template-columns:1fr 1fr;gap:8px}
  .uc-section{padding:56px 0}
  .uc-section-inner{padding:0 20px}
  .uc-num{font-size:48px}
  .uc-section-head{gap:14px;margin-bottom:32px}
  .uc-features{padding:20px 22px}
}
@media(max-width:480px){
  .uc-jump-grid{grid-template-columns:1fr}
}
