/* ============================================================
   ShiftResume — Design System v2 (rich visual layer)
   Palette: deep navy + teal + warm gold, flat SVG illustration
   ============================================================ */
:root{
  --navy:#0f2a43; --navy-2:#16395c; --navy-3:#1e4a74;
  --teal:#0e7c7b; --teal-dark:#0a5f5e; --teal-bright:#3fd0c9;
  --ink:#1c2733; --muted:#54677a; --line:#d9e2ec; --bg:#f2f6fa; --card:#ffffff;
  --teal-tint:#e6f4f3; --gold:#c9a227; --gold-dark:#9a7b14; --gold-tint:#faf3da;
  --rose-tint:#fdeeee; --indigo:#3c4f9e; --indigo-tint:#e9ecfa;
  --shadow-sm:0 1px 3px rgba(15,42,67,.08),0 4px 14px rgba(15,42,67,.06);
  --shadow-md:0 4px 10px rgba(15,42,67,.10),0 14px 34px rgba(15,42,67,.13);
  --shadow-lg:0 10px 24px rgba(15,42,67,.16),0 26px 60px rgba(15,42,67,.18);
  --radius:16px;
  --font-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-display:"Sora","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);color:var(--ink);background:var(--bg);line-height:1.7;font-size:17px;-webkit-font-smoothing:antialiased}
a{color:var(--teal-dark);text-decoration:underline;text-underline-offset:2px}
a:hover{color:var(--navy)}
img,svg{max-width:100%}
::selection{background:var(--teal-bright);color:var(--navy)}
.skip-link{position:absolute;left:-999px;top:0;background:var(--navy);color:#fff;padding:.5rem 1rem;z-index:60;border-radius:0 0 8px 0}
.skip-link:focus{left:0}

/* ---------- Header ---------- */
.site-header{background:linear-gradient(90deg,var(--navy) 0%,var(--navy-2) 60%,var(--navy-3) 100%);color:#fff;position:sticky;top:0;z-index:30;box-shadow:0 4px 18px rgba(15,42,67,.28)}
.header-inner{max-width:1180px;margin:0 auto;padding:.7rem 1.2rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:.55rem;color:#fff;text-decoration:none;font-family:var(--font-display);font-weight:800;font-size:1.32rem;letter-spacing:.2px}
.logo:hover{color:#fff}
.logo .logo-mark{flex:0 0 auto;display:block}
.logo span{color:var(--teal-bright)}
.main-nav{display:flex;gap:1.35rem;flex-wrap:wrap;align-items:center}
.main-nav a{color:#dbe7f3;text-decoration:none;font-size:.97rem;font-weight:600;padding:.25rem 0}
.main-nav a:hover{color:#fff;text-decoration:underline}
.header-cta{background:var(--teal);color:#fff!important;font-weight:700;padding:.5rem 1.05rem!important;border-radius:999px;box-shadow:0 3px 10px rgba(14,124,123,.45);transition:transform .18s ease,background .18s ease}
.header-cta:hover{background:var(--teal-dark);text-decoration:none!important;transform:translateY(-1px)}

/* ---------- Layout ---------- */
.wrap{max-width:1180px;margin:0 auto;padding:1.4rem 1.2rem 3rem}
.breadcrumbs{font-size:.88rem;color:var(--muted);margin:.4rem 0 1.2rem}
.breadcrumbs a{color:var(--muted);text-decoration:none}
.breadcrumbs a:hover{text-decoration:underline}
.breadcrumbs .sep{margin:0 .4rem;color:var(--line)}
article,.page{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:2.3rem 2.5rem;max-width:850px;box-shadow:var(--shadow-sm)}
article.wide,.page.wide{max-width:100%}
h1,h2,h3{font-family:var(--font-display);letter-spacing:-.01em}
h1{font-size:2.2rem;line-height:1.18;color:var(--navy);margin:.2rem 0 .8rem}
h2{font-size:1.52rem;color:var(--navy);margin:2.3rem 0 .75rem;line-height:1.3;padding-bottom:.4rem;border-bottom:3px solid var(--teal-tint);position:relative}
h2::after{content:"";position:absolute;left:0;bottom:-3px;width:64px;height:3px;background:var(--teal);border-radius:2px}
h3{font-size:1.16rem;color:var(--navy-2);margin:1.55rem 0 .45rem}
p{margin:.65rem 0}
ul,ol{margin:.6rem 0 .9rem;padding-left:1.4rem}
li{margin:.3rem 0}
.kicker{font-size:.8rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--teal);margin:0}
.byline{font-size:.92rem;color:var(--muted);margin:0}
.byline a{font-weight:600}
table{width:100%;border-collapse:separate;border-spacing:0;margin:1.1rem 0;font-size:.95rem;border:1px solid var(--line);border-radius:10px;overflow:hidden}
th,td{padding:.6rem .75rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
th{background:var(--navy);color:#fff;font-family:var(--font-display);font-size:.9rem}
tr:last-child td{border-bottom:0}
tr:nth-child(even) td{background:#f2f7fa}

/* ---------- Article hero band ---------- */
.article-hero{display:flex;gap:1.6rem;align-items:center;background:linear-gradient(120deg,var(--navy) 0%,var(--navy-2) 70%,var(--navy-3) 100%);border-radius:14px;padding:1.9rem 2rem;margin:-.4rem -.5rem 1.7rem;position:relative;overflow:hidden}
.article-hero::before{content:"";position:absolute;right:-70px;top:-70px;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,rgba(63,208,201,.35),rgba(63,208,201,0) 70%)}
.article-hero::after{content:"";position:absolute;left:38%;bottom:-90px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(201,162,39,.22),rgba(201,162,39,0) 70%)}
.article-hero .ah-text{flex:1 1 auto;min-width:0;position:relative;z-index:1}
.article-hero h1{color:#fff;margin:.3rem 0 .35rem;font-size:clamp(1.7rem,3.2vw,2.1rem);line-height:1.16}
.article-hero .kicker{color:var(--teal-bright)}
.article-hero .byline{color:#b9cede}
.article-hero .byline a{color:#eaf2f9}
.article-hero .ah-art{flex:0 0 128px;position:relative;z-index:1}
.ah-art .ah-scene{width:128px;height:128px;border-radius:26px;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 2px rgba(255,255,255,.35),0 10px 24px rgba(0,0,0,.25)}
.ah-examples .ah-scene{background:linear-gradient(140deg,#bfe9e6,#7fc9c4)}
.ah-career .ah-scene{background:linear-gradient(140deg,#f6e3a1,#e3c766)}
.ah-shift .ah-scene{background:linear-gradient(140deg,#c3cbf2,#8d9bdd)}
.ah-page .ah-scene{background:linear-gradient(140deg,#d7e3ef,#a9c2d8)}
.page-hero{display:flex;gap:1.4rem;align-items:center;margin:-.2rem 0 1.4rem}
.page-hero .ah-scene{width:88px;height:88px;border-radius:20px;display:flex;align-items:center;justify-content:center;background:linear-gradient(140deg,var(--teal-tint),#bcd9e2);box-shadow:inset 0 0 0 2px rgba(255,255,255,.5),var(--shadow-sm);flex:0 0 auto}
.page-hero h1{margin:0}

/* ---------- Callouts, TOC, examples ---------- */
.short-answer{background:linear-gradient(120deg,var(--teal-tint),#f2faf9);border:1px solid #bfe3e1;border-left:5px solid var(--teal);border-radius:12px;padding:1.15rem 1.3rem 1.15rem 3.2rem;margin:1.3rem 0;position:relative;box-shadow:var(--shadow-sm)}
.short-answer::before{content:"";position:absolute;left:1.05rem;top:1.15rem;width:26px;height:26px;border-radius:50%;background:var(--teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13l5 5L20 7'/%3E%3C/svg%3E") center/15px no-repeat}
.short-answer p:first-child{margin-top:0}.short-answer p:last-child{margin-bottom:0}
.toc{background:#fbfcfe;border:1.5px solid var(--line);border-top:5px solid var(--navy);border-radius:12px;padding:1.15rem 1.4rem;margin:1.5rem 0;box-shadow:var(--shadow-sm)}
.toc h2{font-size:1.02rem;border:0;margin:.1rem 0 .55rem;padding:0;text-transform:uppercase;letter-spacing:.08em}
.toc h2::after{display:none}
.toc ol{margin:.2rem 0}
.toc li{margin:.34rem 0}
.toc a{text-decoration:none;font-weight:600}
.toc a:hover{text-decoration:underline}
.resume-example{background:#fffdf6;border:1.5px solid var(--navy);border-radius:12px;padding:2.6rem 1.9rem 1.6rem;margin:1.6rem 0;font-size:.96rem;position:relative;box-shadow:var(--shadow-md)}
.resume-example::before{content:"WORKED EXAMPLE";position:absolute;top:0;left:0;right:0;background:var(--navy);color:#fff;font-family:var(--font-display);font-size:.72rem;font-weight:700;letter-spacing:.22em;text-align:center;padding:.42rem;border-radius:10px 10px 0 0}
.resume-example::after{content:"";position:absolute;top:2.35rem;left:1.1rem;width:9px;height:9px;border-radius:50%;background:#e0655f;box-shadow:16px 0 #e8b93c,32px 0 #57b06a}
.resume-example h3{margin-top:1.15rem;color:var(--navy);border-bottom:2px solid var(--teal-tint);padding-bottom:.25rem;text-transform:uppercase;font-size:.95rem;letter-spacing:.05em}
.resume-example h3:first-of-type{margin-top:.6rem}
.resume-example .rname{font-size:1.5rem;font-weight:800;font-family:var(--font-display);color:var(--navy);text-align:center;margin:0}
.resume-example .rtitle{text-align:center;color:var(--teal-dark);font-weight:700;margin:.15rem 0}
.resume-example .rcontact{text-align:center;color:var(--muted);font-size:.88rem;margin:.2rem 0 .6rem}
.resume-example .rjob{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:.7rem}
.resume-example .rdates{color:var(--muted);font-size:.9rem;white-space:nowrap}
.note{background:var(--gold-tint);border:1px solid #e8d488;border-left:5px solid var(--gold);border-radius:10px;padding:.95rem 1.2rem;margin:1.25rem 0}
.disclaimer{background:var(--rose-tint);border:1px solid #eccaca;border-left:5px solid #b85450;border-radius:10px;padding:.95rem 1.2rem;margin:1.5rem 0;font-size:.95rem}
.keyword-cloud{display:flex;flex-wrap:wrap;gap:.45rem;margin:.85rem 0}
.keyword-cloud span{background:linear-gradient(120deg,var(--teal-tint),#eef7f0);border:1px solid #a9d8d5;color:var(--navy);border-radius:999px;padding:.24rem .75rem;font-size:.87rem;font-weight:600;box-shadow:0 1px 2px rgba(15,42,67,.06)}

/* ---------- FAQ accordion ---------- */
.faq{display:flex;flex-direction:column;gap:.6rem;margin:1rem 0 1.4rem}
.faq details{background:#fbfcfe;border:1.5px solid var(--line);border-radius:12px;padding:0;overflow:hidden;transition:border-color .18s ease,box-shadow .18s ease}
.faq details:hover{border-color:#a9c6d8}
.faq details[open]{border-color:var(--teal);box-shadow:var(--shadow-sm);background:#fff}
.faq summary{cursor:pointer;font-family:var(--font-display);font-weight:700;color:var(--navy);font-size:1.02rem;padding:.95rem 2.6rem .95rem 1.2rem;list-style:none;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:1.05rem;top:50%;width:11px;height:11px;border-right:3px solid var(--teal);border-bottom:3px solid var(--teal);transform:translateY(-70%) rotate(45deg);transition:transform .2s ease}
.faq details[open] summary::after{transform:translateY(-30%) rotate(225deg)}
.faq .faq-a{padding:0 1.2rem 1rem;color:var(--ink)}
.faq .faq-a p:first-child{margin-top:0}.faq .faq-a p:last-child{margin-bottom:0}

/* ---------- Part-of + continue cards ---------- */
.part-of{background:linear-gradient(120deg,var(--navy),var(--navy-2));color:#eaf2f9;border-radius:14px;padding:1.25rem 1.4rem;margin:2.1rem 0 1rem;box-shadow:var(--shadow-sm)}
.part-of a{color:var(--teal-bright);font-weight:700}
.continue{margin-top:1.8rem}
.continue ul{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.85rem}
.continue li{border:1.5px solid var(--line);border-radius:12px;padding:.95rem 1.05rem;margin:0;background:#fbfcfe;display:flex;gap:.8rem;align-items:flex-start;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.continue li:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:#a9c6d8}
.continue li a{font-weight:700;text-decoration:none;font-family:var(--font-display);font-size:.99rem;line-height:1.35;display:inline-block;margin-bottom:.15rem}
.continue li a:hover{text-decoration:underline}
.thumb-chip{flex:0 0 46px;width:46px;height:46px;border-radius:13px;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 2px rgba(255,255,255,.45)}

/* ---------- Thumbnails & cards ---------- */
.thumb{height:118px;border-radius:10px;display:flex;align-items:center;justify-content:center;margin:-1.15rem -1.25rem 1rem;position:relative;overflow:hidden}
.thumb::before{content:"";position:absolute;width:120px;height:120px;border-radius:50%;right:-35px;top:-55px;background:rgba(255,255,255,.35)}
.thumb::after{content:"";position:absolute;width:70px;height:70px;border-radius:50%;left:-20px;bottom:-40px;background:rgba(255,255,255,.28)}
.thumb svg{position:relative;z-index:1;filter:drop-shadow(0 4px 6px rgba(15,42,67,.18))}
.tint-1{background:linear-gradient(135deg,#bfe9e6,#8fd0cb)}
.tint-2{background:linear-gradient(135deg,#f6e3a1,#ecc95f)}
.tint-3{background:linear-gradient(135deg,#c3cbf2,#93a3e0)}
.tint-4{background:linear-gradient(135deg,#f5c6c0,#eda294)}
.tint-5{background:linear-gradient(135deg,#cdeac0,#9ed18a)}
.cluster-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(295px,1fr));gap:1.15rem;margin:1.3rem 0}
.cluster-card{border:1.5px solid var(--line);border-radius:14px;padding:1.15rem 1.25rem 1.25rem;background:var(--card);box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease}
.cluster-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.cluster-card h3{margin:.1rem 0 .4rem;font-size:1.08rem}
.cluster-card h3 a{text-decoration:none;color:var(--navy)}
.cluster-card h3 a:hover{text-decoration:underline;color:var(--teal-dark)}
.cluster-card p{color:var(--muted);font-size:.94rem;margin:.2rem 0 0}
.hub-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;margin:1.4rem 0}
.hub-card{border:1.5px solid var(--line);border-top:5px solid var(--teal);border-radius:14px;padding:1.35rem;background:var(--card);box-shadow:var(--shadow-sm)}
.hub-card h2,.hub-card h3{border:0;margin-top:0;padding:0}
.hub-card h2::after,.hub-card h3::after{display:none}

/* ---------- Footer ---------- */
.site-footer{background:linear-gradient(180deg,var(--navy) 0%,#0b2036 100%);color:#cfe0ee;margin-top:2.5rem}
.footer-inner{max-width:1180px;margin:0 auto;padding:2.6rem 1.2rem 2rem;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:1.8rem}
.footer-brand p{font-size:.93rem;color:#a9bfd4;margin:.6rem 0 .9rem;max-width:300px}
.footer-brand .logo{font-size:1.25rem}
.footer-chips{display:flex;flex-wrap:wrap;gap:.4rem}
.footer-chips span{border:1px solid var(--navy-3);background:rgba(255,255,255,.06);color:#dbe7f3;border-radius:999px;padding:.18rem .65rem;font-size:.78rem;font-weight:600}
.site-footer h3{color:#fff;font-size:.98rem;margin:0 0 .6rem;font-family:var(--font-display)}
.site-footer a{color:#cfe0ee;text-decoration:none;font-size:.93rem}
.site-footer a:hover{text-decoration:underline;color:#fff}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin:.38rem 0}
.footer-bottom{border-top:1px solid var(--navy-2);padding:1.05rem 1.2rem;text-align:center;font-size:.87rem;color:#9db4c9;max-width:1180px;margin:0 auto}
.footer-bottom a{color:#9db4c9}

/* ============================================================
   HOMEPAGE composition
   ============================================================ */
.home-hero{background:linear-gradient(125deg,var(--navy) 0%,var(--navy-2) 55%,var(--navy-3) 100%);border-radius:20px;padding:2.8rem 2.6rem;margin-bottom:0;position:relative;overflow:hidden;box-shadow:var(--shadow-lg)}
.home-hero::before{content:"";position:absolute;right:-120px;top:-120px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(63,208,201,.4),rgba(63,208,201,0) 70%)}
.home-hero::after{content:"";position:absolute;left:-80px;bottom:-140px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(201,162,39,.28),rgba(201,162,39,0) 70%)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:2.4rem;align-items:center;position:relative;z-index:1}
.hero-copy .eyebrow{display:inline-flex;align-items:center;gap:.45rem;background:rgba(63,208,201,.16);border:1px solid rgba(63,208,201,.5);color:#9fe8e3;border-radius:999px;padding:.28rem .8rem;font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.hero-copy h1{color:#fff;font-size:2.65rem;line-height:1.12;margin:.9rem 0 .8rem}
.hero-copy h1 .hl{color:var(--teal-bright)}
.hero-copy p{color:#cfe0ee;font-size:1.09rem;max-width:540px}
.hero-ctas{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.3rem 0 .9rem}
.cta{display:inline-block;background:var(--teal);color:#fff;text-decoration:none;font-weight:700;padding:.78rem 1.45rem;border-radius:999px;box-shadow:0 6px 18px rgba(14,124,123,.5);transition:transform .18s ease,background .18s ease}
.cta:hover{background:var(--teal-dark);color:#fff;transform:translateY(-2px)}
.cta.alt{background:transparent;border:1.5px solid var(--teal-bright);color:var(--teal-bright);box-shadow:none}
.cta.alt:hover{background:rgba(63,208,201,.12);color:#fff}
.cta.gold{background:var(--gold);color:var(--navy);box-shadow:0 6px 18px rgba(201,162,39,.45)}
.cta.gold:hover{background:var(--gold-dark);color:#fff}
.hero-trust{color:#9db4c9;font-size:.9rem;display:flex;flex-wrap:wrap;gap:.4rem 1.1rem}
.hero-trust b{color:#eaf2f9;font-weight:600}
.hero-visual{position:relative;min-height:430px}
.doc-card{position:absolute;left:50%;top:6px;transform:translateX(-58%) rotate(-2.5deg);width:295px;background:#fff;border-radius:12px;box-shadow:var(--shadow-lg);padding:1.15rem 1.25rem 1.3rem;color:var(--ink)}
.doc-card::before{content:"";position:absolute;top:0;left:0;right:0;height:8px;border-radius:12px 12px 0 0;background:linear-gradient(90deg,var(--teal),var(--teal-bright))}
.doc-name{font-family:var(--font-display);font-weight:800;font-size:1.13rem;color:var(--navy);margin-top:.35rem}
.doc-role{color:var(--teal-dark);font-weight:700;font-size:.85rem}
.doc-meta{color:var(--muted);font-size:.72rem;border-bottom:1px solid var(--line);padding-bottom:.5rem;margin-bottom:.55rem}
.doc-sec{font-family:var(--font-display);font-size:.68rem;font-weight:800;letter-spacing:.14em;color:var(--navy);margin:.6rem 0 .3rem;text-transform:uppercase}
.doc-line{height:7px;border-radius:4px;background:#dbe5ee;margin:.32rem 0}
.doc-line.s{width:55%}.doc-line.m{width:78%}.doc-line.teal{background:#a9d8d5}
.doc-tags{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.35rem}
.doc-tags span{background:var(--teal-tint);color:var(--navy);border-radius:999px;font-size:.64rem;font-weight:700;padding:.12rem .5rem}
.callout-chip{position:absolute;display:flex;align-items:center;gap:.45rem;background:#fff;border-radius:999px;box-shadow:var(--shadow-md);padding:.42rem .8rem .42rem .5rem;font-size:.76rem;font-weight:700;color:var(--navy);animation:bob 5s ease-in-out infinite}
.callout-chip .dot{width:22px;height:22px;border-radius:50%;background:var(--teal);color:#fff;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.callout-chip.c1{right:-6px;top:52px}
.callout-chip.c2{left:-16px;top:196px;animation-delay:1.4s}
.callout-chip.c3{right:2px;top:308px;animation-delay:2.6s}
.callout-chip .dot.gold{background:var(--gold)}
.float-card{position:absolute;background:#fff;border-radius:14px;box-shadow:var(--shadow-md);padding:.8rem .95rem;width:196px;animation:bob 6s ease-in-out infinite}
.float-card .fc-title{font-family:var(--font-display);font-weight:800;font-size:.8rem;color:var(--navy);margin-bottom:.3rem}
.float-card .fc-row{display:flex;align-items:center;gap:.4rem;font-size:.74rem;color:var(--muted);margin:.22rem 0}
.fc-check{width:16px;height:16px;border-radius:50%;background:var(--teal);flex:0 0 auto;display:flex;align-items:center;justify-content:center}
.fc-card-1{left:-8px;bottom:26px}
.fc-card-2{right:-14px;bottom:-8px;animation-delay:2s;width:182px}
.fc-meter{height:8px;border-radius:99px;background:#e3ebf2;overflow:hidden;margin-top:.4rem}
.fc-meter i{display:block;height:100%;width:86%;border-radius:99px;background:linear-gradient(90deg,var(--teal),var(--teal-bright))}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media(prefers-reduced-motion:reduce){.callout-chip,.float-card{animation:none}html{scroll-behavior:auto}}
.trust-strip{background:#fff;border:1.5px solid var(--line);border-radius:14px;margin-top:1.3rem;padding:1.05rem 1.5rem;display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1.6rem;box-shadow:var(--shadow-sm)}
.trust-strip .ts-label{font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.trust-strip .ts-item{font-family:var(--font-display);font-weight:700;color:var(--navy);font-size:1rem;display:flex;align-items:center;gap:.5rem}
.trust-strip .ts-item::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gold)}
.section{padding:2.6rem 0 .4rem}
.section-head{max-width:720px;margin-bottom:1.3rem}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center}
.section-head .kicker{margin-bottom:.3rem}
.section-head h2{border:0;padding:0;margin:.2rem 0 .5rem;font-size:1.85rem}
.section-head h2::after{display:none}
.section-head p{color:var(--muted);font-size:1.02rem}
.band{border-radius:20px;padding:2.5rem 2.4rem;margin-top:2.6rem}
.band h2{border:0;padding:0}
.band h2::after{display:none}
.role-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.05rem}
.role-card{background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:1.05rem 1.1rem 1.15rem;box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease}
.role-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.role-card .thumb{height:92px;margin:-1.05rem -1.1rem .85rem}
.role-card h3{margin:.1rem 0 .3rem;font-size:1rem}
.role-card h3 a{color:var(--navy);text-decoration:none}
.role-card h3 a:hover{text-decoration:underline;color:var(--teal-dark)}
.role-card p{color:var(--muted);font-size:.86rem;margin:0;line-height:1.55}
.problem-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.15rem}
.problem-card{background:#fff;border:1.5px solid var(--line);border-top:5px solid var(--gold);border-radius:14px;padding:1.5rem 1.4rem;box-shadow:var(--shadow-sm)}
.problem-card .p-icon{width:54px;height:54px;border-radius:15px;background:var(--gold-tint);display:flex;align-items:center;justify-content:center;margin-bottom:.8rem}
.problem-card h3{margin:.1rem 0 .4rem}
.problem-card p{color:var(--muted);font-size:.95rem;margin:0}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.15rem;margin-top:1.2rem}
.step-card{background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:1.5rem 1.4rem;position:relative;box-shadow:var(--shadow-sm)}
.step-card .step-num{position:absolute;top:-17px;left:1.3rem;background:var(--teal);color:#fff;font-family:var(--font-display);font-weight:800;font-size:.95rem;border-radius:999px;padding:.28rem .85rem;box-shadow:0 4px 10px rgba(14,124,123,.4)}
.step-card .p-icon{width:54px;height:54px;border-radius:15px;background:var(--teal-tint);display:flex;align-items:center;justify-content:center;margin:.4rem 0 .8rem}
.step-card h3{margin:.1rem 0 .4rem}
.step-card p{color:var(--muted);font-size:.95rem;margin:0}
.ba-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:1.1rem;align-items:stretch}
.ba-card{border-radius:14px;padding:1.5rem 1.5rem 1.3rem;box-shadow:var(--shadow-sm)}
.ba-before{background:#fdf3f2;border:1.5px solid #eccaca}
.ba-after{background:linear-gradient(150deg,var(--navy),var(--navy-2));color:#eaf2f9;border:1.5px solid var(--navy)}
.ba-card .ba-tag{display:inline-block;font-family:var(--font-display);font-weight:800;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;border-radius:999px;padding:.22rem .75rem;margin-bottom:.8rem}
.ba-before .ba-tag{background:#b85450;color:#fff}
.ba-after .ba-tag{background:var(--teal-bright);color:var(--navy)}
.ba-card ul{list-style:none;padding:0;margin:0}
.ba-card li{padding:.5rem 0 .5rem 1.7rem;position:relative;border-bottom:1px dashed rgba(120,140,160,.3);font-size:.97rem}
.ba-card li:last-child{border-bottom:0}
.ba-before li::before{content:"✕";position:absolute;left:.2rem;color:#b85450;font-weight:800}
.ba-after li::before{content:"✓";position:absolute;left:.2rem;color:var(--teal-bright);font-weight:800}
.ba-arrow{display:flex;align-items:center;justify-content:center}
.ba-arrow span{width:46px;height:46px;border-radius:50%;background:var(--gold);color:var(--navy);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-md)}
.ba-note{color:var(--muted);font-size:.93rem;margin-top:1rem}
.ba-note a{font-weight:600}
.band-career{background:linear-gradient(125deg,#0a5f5e,#0e7c7b 55%,#12948f);color:#eafaf8;box-shadow:var(--shadow-md)}
.band-career h2{color:#fff}
.band-career p{color:#cdeae7;max-width:640px}
.band-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center}
.band-links{display:flex;flex-direction:column;gap:.7rem}
.band-link{background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.35);border-radius:12px;padding:.9rem 1.1rem;color:#fff;text-decoration:none;display:flex;gap:.85rem;align-items:center;transition:background .18s ease,transform .18s ease}
.band-link:hover{background:rgba(255,255,255,.2);color:#fff;transform:translateX(4px)}
.band-link b{font-family:var(--font-display);display:block;font-size:.99rem}
.band-link small{color:#cdeae7;font-size:.83rem}
.band-link .thumb-chip{background:rgba(255,255,255,.16);box-shadow:none}
.featured-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:1.15rem}
.feature-card{background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:1.1rem 1.2rem 1.2rem;box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease}
.feature-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.feature-card .thumb{height:100px;margin:-1.1rem -1.2rem .9rem}
.feature-card h3{margin:.1rem 0 .35rem;font-size:1.03rem}
.feature-card h3 a{color:var(--navy);text-decoration:none}
.feature-card h3 a:hover{text-decoration:underline;color:var(--teal-dark)}
.feature-card p{color:var(--muted);font-size:.9rem;margin:0}
.feature-card .fc-kicker{font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}
.band-keywords{background:linear-gradient(120deg,var(--gold-tint),#fdf8e7);border:1.5px solid #e8d488}
.band-keywords h2{color:var(--navy)}
.band-keywords p{color:#6d5d22;max-width:680px}
.kw-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.1rem}
.kw-chips span{background:#fff;border:1.5px solid #e0cd7e;color:var(--navy);border-radius:999px;padding:.32rem .85rem;font-weight:700;font-size:.9rem;box-shadow:0 1px 3px rgba(154,123,20,.12)}
.home-faq{max-width:820px;margin:0 auto}
.band-cta{background:linear-gradient(125deg,var(--navy),var(--navy-3));color:#eaf2f9;text-align:center;box-shadow:var(--shadow-md);position:relative;overflow:hidden}
.band-cta::before{content:"";position:absolute;right:-90px;top:-90px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(63,208,201,.4),rgba(63,208,201,0) 70%)}
.band-cta h2{color:#fff;font-size:2rem;position:relative;z-index:1}
.band-cta p{color:#cfe0ee;max-width:560px;margin:.4rem auto 1.3rem;position:relative;z-index:1}
.band-cta .cta{position:relative;z-index:1}
.stats-row{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin:1.6rem 0 .4rem;position:relative;z-index:1}
.stat-chip{background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.25);border-radius:14px;padding:.8rem 1.3rem;min-width:150px}
.stat-chip b{display:block;font-family:var(--font-display);font-size:1.5rem;color:#fff}
.stat-chip span{font-size:.82rem;color:#b9cede}

@media(max-width:1020px){
  .footer-inner{grid-template-columns:1fr 1fr 1fr}
  .footer-brand{grid-column:1/-1}
}
@media(max-width:900px){
  .hero-grid{grid-template-columns:1fr}
  .hero-visual{min-height:400px;max-width:430px;margin:0 auto;width:100%}
  .band-grid{grid-template-columns:1fr}
  .ba-grid{grid-template-columns:1fr}
  .ba-arrow span{transform:rotate(90deg)}
  .article-hero{flex-direction:column;align-items:flex-start}
}
@media(max-width:640px){
  article,.page{padding:1.35rem 1.15rem}
  h1{font-size:1.72rem}
  body{font-size:16px}
  .home-hero{padding:1.9rem 1.25rem}
  .hero-copy h1{font-size:2rem}
  .band{padding:1.8rem 1.25rem}
  .doc-card{width:262px}
  .callout-chip.c2{left:0}
  .fc-card-1{left:0}
  .fc-card-2{right:0}
  .footer-inner{grid-template-columns:1fr 1fr}
  .article-hero{padding:1.4rem 1.2rem;margin:-.2rem -.2rem 1.4rem}
  .resume-example{padding:2.5rem 1.1rem 1.2rem}
}

/* ---------- Format retrofit: article components (Article Format Standard v1) ---------- */
.key-takeaways{background:#fff;border:1.5px solid var(--line);border-top:5px solid var(--gold);border-radius:12px;padding:1.05rem 1.3rem 1.05rem 1.3rem;margin:1.3rem 0;box-shadow:var(--shadow-sm)}
.key-takeaways h2,.key-takeaways .kt-label{font-family:var(--font-display);font-size:.95rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--navy);margin:.05rem 0 .55rem;border:0;padding:0}
.key-takeaways h2::after{display:none}
.key-takeaways ul{margin:.2rem 0 .1rem;padding-left:1.15rem}
.key-takeaways li{margin:.34rem 0}
.contract{font-size:1.02rem;color:var(--navy);border-left:4px solid var(--teal);padding:.15rem 0 .15rem .9rem;margin:1.2rem 0}
.resume-support{background:linear-gradient(120deg,var(--teal-tint),#f2faf9);border:1.5px solid #a9d8d5;border-radius:12px;padding:1.05rem 1.3rem;margin:1.3rem 0;box-shadow:var(--shadow-sm)}
.resume-support h2{font-size:1.02rem;text-transform:uppercase;letter-spacing:.08em;border:0;margin:.05rem 0 .4rem;padding:0}
.resume-support h2::after{display:none}
.resume-support ol{margin:.35rem 0 .1rem;padding-left:1.3rem}
.resume-support li{margin:.3rem 0}
.provenance{font-style:italic;color:var(--muted);font-size:.94rem;margin:1rem 0 .2rem}
.illustration-note{font-size:.88rem;color:var(--muted);margin:.5rem 0 1.2rem}
.resume-template{border-style:dashed;background:#fdfcf8}
.resume-template::before{content:"BLANK TEMPLATE — COPY & FILL IN"}
.resume-template .formula-note{font-size:.92rem;color:var(--muted);font-style:italic;margin:.4rem 0}
.example-subhead{margin-top:1.6rem}
.tip-callout{background:var(--gold-tint);border:1px solid #e8d488;border-left:5px solid var(--gold);border-radius:10px;padding:.85rem 1.15rem;margin:1.1rem 0}
.tip-callout p{margin:0}
.related-link{font-size:.97rem;margin:.9rem 0;padding:.55rem .85rem;background:#fbfcfe;border:1px solid var(--line);border-radius:8px}
.related-link strong{color:var(--teal-dark)}
.bottom-line{background:var(--navy);color:#eaf3f3;border-radius:12px;padding:1.15rem 1.35rem;margin:1.6rem 0;box-shadow:var(--shadow-md)}
.bottom-line h2{color:#fff;border:0;margin:.05rem 0 .5rem;padding:0;font-size:1.15rem}
.bottom-line h2::after{display:none}
.bottom-line p{margin:0;color:#dcebe9}
.author-box{display:flex;gap:1.05rem;align-items:flex-start;background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:1.15rem 1.3rem;margin:1.6rem 0;box-shadow:var(--shadow-sm)}
.author-avatar{flex:0 0 auto;width:52px;height:52px;border-radius:50%;background:var(--navy);color:#3fd0c9;font-family:var(--font-display);font-weight:800;font-size:1.05rem;display:flex;align-items:center;justify-content:center}
.author-box .author-name{font-weight:700;color:var(--navy);margin:.05rem 0 .3rem}
.author-box p{margin:.25rem 0}
.art-credit{font-size:.78rem;color:var(--muted);text-align:right;margin:-1.05rem 0 0}
/* ---------- Format retrofit: two-zone article layout (main + ONE right sidebar) ---------- */
.wrap-wide{max-width:1360px}
.article-main{min-width:0}
.sidebar{display:flex;flex-direction:column;gap:1.1rem;margin-top:1.6rem}
.side-card{background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:1rem 1.15rem;box-shadow:var(--shadow-sm)}
.side-title{font-family:var(--font-display);font-size:.92rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--navy);margin:.05rem 0 .5rem;border:0;padding:0}
.side-title::after{display:none}
.side-sub{font-size:.86rem;color:var(--muted);margin:-.25rem 0 .55rem}
.sidebar details.toc{margin:0}
details.toc>summary{font-family:var(--font-display);font-size:.95rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--navy);cursor:pointer;list-style:none;margin-bottom:.45rem}
details.toc>summary::-webkit-details-marker{display:none}
.guide-nav{list-style:none;margin:.2rem 0;padding:0}
.guide-nav li{margin:.14rem 0}
.guide-nav a,.guide-nav .current{display:block;padding:.42rem .6rem;border-radius:8px;font-size:.93rem;line-height:1.35;text-decoration:none}
.guide-nav a:hover{background:var(--teal-tint)}
.guide-nav .current{background:var(--teal-tint);border-left:4px solid var(--teal);font-weight:700;color:var(--navy)}
.side-author .author-avatar{margin-bottom:.55rem}
.side-author .ra-name{font-weight:700;color:var(--navy);margin:.1rem 0 0}
.side-author .ra-role{font-size:.88rem;color:var(--teal-dark);font-weight:600;margin:.05rem 0 .4rem}
.side-author .ra-line{font-size:.9rem;color:var(--muted);margin:.2rem 0 .5rem}
.side-related-card{display:flex;gap:.65rem;align-items:flex-start;padding:.55rem 0;border-top:1px solid var(--line)}
.side-related-card:first-of-type{border-top:0;padding-top:.15rem}
.side-related-card a{font-weight:600;font-size:.94rem;line-height:1.35;text-decoration:none}
.side-related-card p{font-size:.85rem;color:var(--muted);margin:.15rem 0 0}
.side-popular{margin:.2rem 0;padding-left:1.2rem}
.side-popular li{margin:.4rem 0;font-size:.94rem}
.side-cta{background:var(--navy);border-color:var(--navy);color:#eaf3f3}
.side-cta .side-title{color:#fff}
.side-cta p{font-size:.93rem;color:#dcebe9;margin:.2rem 0 .8rem}
.side-cta a.side-cta-btn{display:inline-block;background:var(--teal);color:#fff;font-weight:700;padding:.55rem 1rem;border-radius:999px;text-decoration:none;font-size:.93rem}
@media (min-width:1100px){
  .article-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:2.1rem;align-items:start}
  .sidebar{position:sticky;top:92px;margin-top:0}
  .sidebar details.toc>summary{cursor:default}
  .toc-mobile{display:none}
}
@media (max-width:1099.98px){
  .sidebar .toc{display:none}
}

/* ---------- Layout fix round 2: slim meta row under the hero band ---------- */
.meta-row{margin:.35rem 0 .25rem}