/* AFRC Lab — "Drawing Sheet" theme (review build, Nov 2026)
   Loaded last on every page so it overrides each page's own styles.
   Colours come straight from the logo: red AF, sky-blue Australia, navy skyline.
   Remove the <link> to this file and the site goes back to the old look. */
@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,400;8..60,600;8..60,700&display=swap');

:root{
  --red:#e42534;--red-deep:#c01624;
  --sky:#17ade4;--cyan:#17ade4;--cyan-ink:#0a6e94;
  --navy:#16335b;--navy-deep:#0e2142;
  --bg:#f5fafd;--panel:#ffffff;--panel-2:#e7f4fb;
  --line:#c9dbe8;--line-strong:#16335b;
  --ink:#0e1c30;--ink-soft:#3f526a;--ink-faint:#6a7f98;
  --hatch:rgba(23,173,228,.16);
  --radius:2px;
  --shadow:none;--shadow-lift:none;
  --head:'Source Serif 4',Georgia,'Times New Roman',serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0f2546;--panel:#16335b;--panel-2:#1c3f6d;--line:#2e5585;--line-strong:#8fc9ea;
  --ink:#eef4fb;--ink-soft:#b6c7db;--ink-faint:#86a0bd;--cyan-ink:#8ad8f4;--red:#ff4757;--hatch:rgba(23,173,228,.12);
  --radius:2px;--shadow:none;--shadow-lift:none}}
:root[data-theme="dark"]{
  --bg:#0f2546;--panel:#16335b;--panel-2:#1c3f6d;--line:#2e5585;--line-strong:#8fc9ea;
  --ink:#eef4fb;--ink-soft:#b6c7db;--ink-faint:#86a0bd;--cyan-ink:#8ad8f4;--red:#ff4757;--hatch:rgba(23,173,228,.12);
  --radius:2px;--shadow:none;--shadow-lift:none}

/* ---------- square, flat, ruled ---------- */
*:not(.dot):not(.d):not(.swatch):not([class*="dot"]):not(.theme-btn):not(.round):not(.portrait):not(.portrait img){border-radius:0 !important}
*{box-shadow:none !important}
*::before,*::after{box-shadow:none !important}
header.bar{backdrop-filter:none !important;-webkit-backdrop-filter:none !important}
body{background:var(--bg)}

/* ---------- type: Archivo headings, mono only for labels + numbers ---------- */
h1,h2,h3,.hh,.door h2,.title,.arthead h1,.sp-hero h1{font-family:var(--head) !important;font-weight:700 !important;letter-spacing:-.01em !important}
.svc h3,.card h3,.prod h3,.path h3,.gblock h3{font-family:var(--head) !important;font-weight:700 !important;letter-spacing:0 !important}
h4,.step h4{font-family:'IBM Plex Sans',sans-serif !important;font-weight:600 !important;letter-spacing:0 !important}
h1 .hf,.hh .hf{color:var(--red) !important}

/* labels become drawing callouts: red mono, no pill */
.eyebrow,.pill,.tagpill,.pick-q,.sp-crumb,.kicker{
  font-family:'IBM Plex Mono',monospace !important;color:var(--red) !important;background:none !important;border:0 !important;
  padding:0 !important;letter-spacing:.12em !important;font-weight:600 !important}
.pill .d,.pill .dot{display:none !important}
.pill::before,.pick-q::before,.eyebrow::before{content:"";display:inline-block;width:22px;height:3px;background:var(--red);vertical-align:middle;margin-right:10px;transform:translateY(-1px)}

/* ---------- header: solid paper, navy rule, scale ticks ---------- */
header.bar{background:var(--panel) !important;border-bottom:1.5px solid var(--line-strong) !important;position:sticky}
header.bar::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:6px;pointer-events:none;
  background:repeating-linear-gradient(90deg,var(--line-strong) 0 1px,transparent 1px 64px),
             repeating-linear-gradient(90deg,var(--line-strong) 0 1px,transparent 1px 16px) 0 0/100% 3px no-repeat;opacity:.55}
.bar-in{height:76px !important}
.brand svg{height:54px !important}
.login-link,.svcmenu-btn,nav.links a,.navlink{font-family:'IBM Plex Mono',monospace !important;color:var(--navy) !important}
:root[data-theme="dark"] .login-link,:root[data-theme="dark"] .svcmenu-btn,:root[data-theme="dark"] .navlink{color:var(--ink) !important}
.login-link:hover,.svcmenu-btn:hover,.navlink:hover{color:var(--red) !important;background:none !important}
.svcmenu-panel{border:1.5px solid var(--line-strong) !important}
.svcmenu-panel a:hover{background:var(--panel-2) !important;color:var(--red) !important}
.svcmenu-lbl{color:var(--red) !important}
.theme-btn{border-radius:50% !important;border-color:var(--line) !important}

/* ---------- buttons: red is the one thing to press ---------- */
.cta-sm,.btn.cyan,.btn.primary,.btn.red,.sp-btn,.endcta a.btn,button[type="submit"],input[type="submit"]{
  background:var(--red) !important;border-color:var(--red) !important;color:#fff !important}
.cta-sm:hover,.btn.cyan:hover,.btn.primary:hover,.sp-btn:hover,button[type="submit"]:hover{background:var(--red-deep) !important;border-color:var(--red-deep) !important;color:#fff !important}
.btn:hover{transform:none !important}
.btn.ghost,.btn.line,.btn.outline,.btn.navy{background:transparent !important;color:var(--navy) !important;border:1.5px solid var(--line-strong) !important}
:root[data-theme="dark"] .btn.ghost{color:var(--ink) !important}
.btn.ghost:hover,.btn.line:hover,.btn.outline:hover{background:var(--panel-2) !important}

/* ---------- links ---------- */
main a:not(.btn):not(.door):not(.sp-card):not(.cta-sm):not(.card):not([class*="card"]){text-decoration-color:var(--red) !important;text-decoration-thickness:1.5px}

/* ---------- cards & panels: hairline navy frames ---------- */
.door,.card,.acard,.rcard,.sp-card,.listcard,.svc,.prod,.path,.gblock,.metric,.step,.verdict,.feature,.faq,.qa,.cs-stat,.word-card{
  border:1px solid var(--line-strong) !important;background:var(--panel) !important}
.door::before,.sp-card::before,.card::before{background:var(--red) !important}
.door:hover,.sp-card:hover,.card:hover,.acard:hover{transform:none !important;border-color:var(--red) !important}
.door .ar,.ar{background:var(--red) !important;color:#fff !important}
.doors{counter-reset:door}
.door{counter-increment:door}
.door::after{content:"0" counter(door);position:absolute;top:14px;right:16px;font:600 12px 'IBM Plex Mono',monospace;color:var(--red);letter-spacing:.06em}

/* pale-blue hatched "detail" bands */
.say,.sp-ctaband,.endcta,.sp-frsi{background:var(--panel-2) !important;background-image:repeating-linear-gradient(135deg,transparent 0 10px,var(--hatch) 10px 11px) !important}
.sp-ctaband,.sp-frsi{color:var(--ink) !important}
.sp-ctaband *,.sp-frsi *{color:inherit}
.sp-ctaband .sp-btn{color:#fff !important}
blockquote{border-left:4px solid var(--red) !important}

/* ---------- footer as a title block ---------- */
footer.foot,footer{border-top:1.5px solid var(--line-strong) !important;background:var(--panel) !important}
.foot-in{font-family:'IBM Plex Mono',monospace !important;font-size:12.5px !important;gap:0 !important;padding-block:0 !important;align-items:stretch !important}
.foot-in>*{padding:16px 18px;border-right:1px solid var(--line)}
.foot-in>*:first-child{padding-left:0}
.foot-in>*:last-child{border-right:0}
.foot-in .foot-sp{border-right:0;padding:0}
.foot-in::after{content:"REV C · NOV 2026";color:var(--red);font-weight:600;padding:16px 0 16px 18px;border-left:1px solid var(--line);white-space:nowrap}

/* ---------- phone: stop the header overflowing ---------- */
@media (max-width:600px){
  .bar-in{height:auto !important;flex-wrap:wrap;gap:6px 10px !important;padding-block:8px 6px}
  .brand svg{height:42px !important}
  .bar-sp{flex:1 1 auto}
  .login-link,.navlink{order:10;flex:1 1 0;text-align:center;padding:6px 4px !important;font-size:12px !important;display:block !important;border-top:1px solid rgba(255,255,255,.18)}
  .theme-btn{order:11;width:30px !important;height:30px !important;align-self:center}
  .svcmenu-btn{padding:8px 6px !important;font-size:12px !important}
  .cta-sm{padding:9px 10px !important;font-size:11px !important}
  .foot-in{flex-wrap:wrap}.foot-in>*{border-right:0;padding:8px 0}.foot-in::after{border-left:0;padding:8px 0}
}

/* ---------- homepage hero (index only) ---------- */
.lead-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:0;border:1.5px solid var(--line-strong);background:var(--panel)}
.lead-copy{padding:clamp(24px,3.6vw,48px);border-right:1.5px solid var(--line-strong)}
.lead-copy .hh{margin-top:16px;font-size:clamp(32px,4.4vw,56px) !important;line-height:1.02}
.lead-fig{margin:0;background:var(--panel-2);background-image:repeating-linear-gradient(135deg,transparent 0 10px,var(--hatch) 10px 11px);display:flex;flex-direction:column;justify-content:center;padding:26px}
.lead-fig img{display:block;width:auto;max-width:100%;max-height:440px;margin:0 auto;border:1px solid var(--line-strong);background:#fff}
.lead-fig figcaption{margin-top:12px;text-align:center;font:500 11px/1.5 'IBM Plex Mono',monospace;color:var(--navy);letter-spacing:.04em}
:root[data-theme="dark"] .lead-fig figcaption{color:var(--ink)}
.tblock{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);border-top:1.5px solid var(--line-strong);font-family:'IBM Plex Mono',monospace}
.tblock div{padding:12px 16px;border-right:1px solid var(--line-strong)}
.tblock div:last-child{border-right:0}
.tblock small{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}
.tblock b{font-size:clamp(18px,2vw,24px);font-weight:600;color:var(--navy)}
:root[data-theme="dark"] .tblock b{color:var(--ink)}
.tblock a{color:var(--red);font-size:12.5px;font-weight:600}
@media (max-width:820px){
  .lead-grid{grid-template-columns:1fr}.lead-copy{border-right:0;border-bottom:1.5px solid var(--line-strong)}
  .tblock{grid-template-columns:1fr 1fr}.tblock div:nth-child(2){border-right:0}.tblock div:nth-child(-n+2){border-bottom:1px solid var(--line-strong)}
}
.portrait{border:1.5px solid var(--line-strong) !important}

.lead-copy .tag{margin-top:18px}
.punchline .pl-lead{font-family:var(--head) !important;color:var(--red) !important;font-weight:700 !important;font-style:italic}
.tag b,.sub b{color:var(--navy)}
:root[data-theme="dark"] .tag b,:root[data-theme="dark"] .sub b{color:var(--ink)}
.eyebrow .d,.eyebrow .dot{display:none !important}
.door .enter,.readmore,.more,.read,.sp-card .more{color:var(--navy) !important}
:root[data-theme="dark"] .door .enter,:root[data-theme="dark"] .readmore,:root[data-theme="dark"] .more{color:var(--ink) !important}

/* ===== C: Founder's Notebook layer ===== */
/* navy header bar, white logo, sky scale ticks */
header.bar{background:var(--navy) !important;border-bottom:0 !important}
header.bar::after{background:repeating-linear-gradient(90deg,var(--sky) 0 1px,transparent 1px 64px),repeating-linear-gradient(90deg,var(--sky) 0 1px,transparent 1px 16px) 0 0/100% 3px no-repeat !important;opacity:.9 !important;bottom:-6px}
header.bar .brand .logo-light{display:none !important}
header.bar .brand .logo-dark{display:block !important}
header.bar .login-link,header.bar .svcmenu-btn,header.bar .navlink{color:#e3edf8 !important}
header.bar .login-link:hover,header.bar .svcmenu-btn:hover,header.bar .navlink:hover{color:#fff !important;text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:6px}
header.bar .theme-btn{background:transparent !important;border-color:rgba(255,255,255,.35) !important;color:#e3edf8 !important}
.svcmenu-panel{background:var(--panel) !important}
.svcmenu-panel a{color:var(--ink) !important}

/* serif reading voice for standfirsts and ledes */
.standfirst,.sub,.punchline,.sp-lead,.excerpt,blockquote{font-family:var(--head) !important}
.standfirst,.sub{font-size:clamp(17px,1.9vw,20px) !important;line-height:1.55 !important}

/* red notebook margin on articles */
article.read{position:relative}
article.read::before{content:"";position:absolute;left:max(4px,calc(clamp(16px,4vw,44px) - 22px));top:4px;bottom:0;width:2px;background:var(--red)}


/* real photo in bylines */
.by-photo{width:40px;height:40px;border-radius:50% !important;object-fit:cover;border:2px solid var(--red);flex:0 0 auto}

/* homepage founder note inside the drawing sheet */
.lead-note{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;padding:20px clamp(20px,3.6vw,48px);border-top:1.5px solid var(--line-strong);background:var(--panel-2);border-left:6px solid var(--red)}
.lead-note img{width:76px;height:76px;border-radius:50% !important;object-fit:cover;border:3px solid #fff}
.lead-note q{font:400 italic clamp(16px,1.6vw,19px)/1.5 var(--head);color:var(--ink);quotes:"\201C" "\201D"}
.lead-note .sig{display:block;margin-top:6px;font:600 12px 'IBM Plex Mono',monospace;color:var(--navy);font-style:normal;letter-spacing:.04em}
:root[data-theme="dark"] .lead-note .sig{color:var(--ink)}
.lead-note a{font:600 13px 'IBM Plex Mono',monospace;color:var(--red);white-space:nowrap;text-decoration:none}
@media (max-width:820px){.lead-note{grid-template-columns:auto 1fr;padding:18px 16px}.lead-note a{grid-column:1/-1}.lead-note img{width:60px;height:60px}}
.portrait{border-radius:50% !important;overflow:hidden;border:4px solid var(--panel-2) !important;outline:2px solid var(--red)}
.portrait img{border-radius:50% !important}

@media (max-width:720px){.door{padding-top:34px !important}.door::after{top:10px}}
@media (max-width:600px){.nav-links{flex-wrap:wrap;justify-content:flex-end}main table,.content table{display:block;max-width:100%;overflow-x:auto}}
header.bar nav.links a{color:#e3edf8 !important}header.bar nav.links a:hover{color:#fff !important;background:none !important;text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:6px}
/* end-of-article call to action on the pale hatched band: dark text */
.endcta{color:var(--ink) !important;border:1.5px solid var(--line-strong) !important;border-left:6px solid var(--red) !important}
.endcta h3{color:var(--navy) !important}
.endcta p{color:var(--ink-soft) !important}
:root[data-theme="dark"] .endcta h3{color:var(--ink) !important}
.endcta .btn{background:var(--red) !important;color:#fff !important;border-color:var(--red) !important}
.faq{border:0 !important;background:none !important}
.qa{padding:14px 18px !important;margin-top:-1px}
.sayq blockquote{border-left:0 !important;padding-left:0 !important}.sayq{border-left:6px solid var(--red) !important}