/* Blane Canada -- Executive AI Answer Center
   Shared stylesheet for /faq/. One file so a colour or size changes in one place
   rather than across 137 pages. Generated pages link to /faq/faq.css. */

:root{
  --ground:#0C0C0C;
  --ground-raise:#151516;
  --ground-line:#262628;
  --sage:#A6ACA3;
  --sage-dim:#8B918A;
  --paper:#F2F4F7;
  --paper-raise:#FFFFFF;
  --navy:#16202B;
  --slate:#3C4A58;
  --slate-dim:#5A6673;
  --rule-paper:#D4DAE2;
  --accent:#CC0000;
  --accent-lift:#FF4A45;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Public Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --wrap:1120px;
  --read:34rem;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--sage);
  font-family:var(--sans);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3{margin:0;text-wrap:balance;font-weight:400}
p{margin:0}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}
:focus-visible{outline:2px solid var(--accent-lift);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-9999px;top:0;background:var(--accent);color:#fff;
  padding:12px 18px;z-index:100;font-weight:600}
.skip:focus{left:0}

/* ---------- masthead ---------- */
.mast{background:var(--ground);border-bottom:1px solid var(--ground-line);position:sticky;top:0;z-index:20}
.mast-in{max-width:var(--wrap);margin:0 auto;padding:18px 28px;
  display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.brand-name{font-weight:700;letter-spacing:.012em;color:#fff;font-size:16.5px}
.mast-nav{margin-left:auto;display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.mast-nav a{font-size:13.5px;color:var(--sage-dim);letter-spacing:.02em;padding:4px 0;
  border-bottom:1.5px solid transparent;transition:color .15s,border-color .15s}
.mast-nav a:hover{color:var(--sage)}
.mast-nav a[aria-current]{color:#fff;border-bottom-color:var(--accent)}
.mast-cta{color:#fff!important;border:1px solid var(--ground-line);padding:8px 16px!important;
  border-bottom-color:var(--ground-line)!important;transition:background .15s,border-color .15s}
.mast-cta:hover{background:var(--accent);border-color:var(--accent)}

/* ---------- shared ---------- */
.dark-surface{background:var(--ground);min-height:68vh}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}
.eyebrow{display:flex;align-items:center;gap:12px;font-size:11px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--accent-lift)}
.eyebrow::before{content:"";width:26px;height:1.5px;background:var(--accent);flex-shrink:0}
.pad-btm{padding-bottom:88px}
.grid-wrap{margin-top:34px}

.lede{padding:56px 0 38px}
.lede h1{font-family:var(--serif);color:#fff;font-size:clamp(2.25rem,4.6vw,3.35rem);
  line-height:1.07;letter-spacing:-.018em;margin:20px 0 0;max-width:20ch}
.sub{max-width:56ch;margin:20px 0 0;font-size:1.0625rem;color:var(--sage)}

/* search */
.filter{display:flex;align-items:center;gap:14px;border:1px solid var(--ground-line);
  background:var(--ground-raise);border-radius:2px;padding:0 8px 0 18px;margin:34px 0 0;
  max-width:600px;transition:border-color .18s}
.filter:focus-within{border-color:var(--accent)}
.filter svg{flex-shrink:0;stroke:var(--sage-dim)}
.filter input{flex:1;background:none;border:0;outline:0;color:#fff;font:inherit;font-size:15px;padding:15px 0}
.filter input::placeholder{color:var(--sage-dim)}
.filter-go{font:inherit;font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--sage);
  background:none;border:1px solid var(--ground-line);border-radius:2px;padding:9px 16px;
  cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.filter-go:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.result-note{margin:16px 0 0;font-size:13.5px;color:var(--sage-dim);min-height:20px}
.result-note .rn-count{color:#fff;font-weight:600}
.result-note .rn-soft{color:var(--accent-lift);font-weight:600}
mark{background:rgba(204,0,0,.26);color:#fff;padding:0;border-radius:1px;
  box-shadow:0 0 0 2px rgba(204,0,0,.26)}

/* ---------- featured wall ---------- */
.wall{border-top:1px solid var(--ground-line);margin-top:26px}
.q-row{display:block;border-bottom:1px solid var(--ground-line);padding:26px 0;
  position:relative;transition:background .18s}
.q-row:hover{background:#111112}
.q-row-in{display:flex;gap:26px;align-items:baseline;padding:0 16px 0 20px}
.q-row .cat{flex-shrink:0;width:190px;font-size:11.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--sage-dim);padding-top:6px}
.q-row .qt{font-family:var(--serif);font-size:clamp(1.22rem,2.1vw,1.62rem);line-height:1.24;
  color:#EDEDEA;letter-spacing:-.011em;flex:1;transition:color .18s}
.q-row:hover .qt{color:#fff}
.q-row .arrow{flex-shrink:0;color:var(--sage-dim);font-size:18px;line-height:1;
  transform:translateX(-6px);opacity:0;transition:opacity .18s,transform .18s}
.q-row:hover .arrow{opacity:1;transform:translateX(0);color:var(--accent-lift)}
.q-row::before{content:"";position:absolute;left:0;top:-1px;bottom:-1px;width:2px;
  background:var(--accent);transform:scaleY(0);transform-origin:top;transition:transform .2s}
.q-row:hover::before{transform:scaleY(1)}

/* ---------- topic grid ---------- */
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  padding:74px 0 26px;flex-wrap:wrap}
.section-head h2{font-family:var(--serif);color:#fff;font-size:1.95rem;letter-spacing:-.012em}
.section-head p{margin:8px 0 0;font-size:14.5px;color:var(--sage-dim);max-width:46ch}
.link-more{color:var(--accent-lift);font-size:13.5px;font-weight:600;letter-spacing:.02em}
.link-more:hover{text-decoration:underline}
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:1px;
  background:var(--ground-line);border:1px solid var(--ground-line);margin-bottom:80px}
.cat-card{background:var(--ground);padding:26px 24px 24px;display:flex;flex-direction:column;
  gap:9px;min-height:158px;transition:background .18s}
.cat-card:hover{background:var(--ground-raise)}
.cat-card .cn{font-family:var(--serif);font-size:1.24rem;line-height:1.24;color:#EDEDEA;transition:color .18s}
.cat-card:hover .cn{color:#fff}
.cat-card .cd{font-size:13.5px;color:var(--sage-dim);line-height:1.5;flex:1}
.cat-meta{display:flex;align-items:baseline;gap:7px;margin-top:auto;padding-top:12px;
  border-top:1px solid var(--ground-line)}
.cat-meta .num{font-size:1.5rem;font-weight:600;color:var(--accent-lift);
  font-variant-numeric:tabular-nums;line-height:1}
.cat-meta .lbl{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--sage-dim)}

/* ---------- lists ---------- */
.crumb{display:flex;align-items:center;gap:10px;padding:34px 0 0;font-size:13px;
  color:var(--sage-dim);flex-wrap:wrap}
.crumb a:hover{color:var(--sage);text-decoration:underline}
.crumb .sep{color:var(--ground-line)}
.list-head{padding:26px 0 8px}
.list-head h1{font-family:var(--serif);color:#fff;font-size:clamp(2rem,4vw,2.85rem);
  line-height:1.1;letter-spacing:-.016em;max-width:20ch}
.list{margin-top:30px}
.tier{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;padding:3px 8px;border-radius:2px;vertical-align:2px;white-space:nowrap}
.tier.F{background:rgba(204,0,0,.15);color:var(--accent-lift);box-shadow:inset 0 0 0 1px rgba(204,0,0,.4)}
.entry{display:block;border-bottom:1px solid var(--ground-line);padding:24px 20px;
  position:relative;transition:background .18s}
.entry:first-child{border-top:1px solid var(--ground-line)}
.entry:hover{background:#111112}
.entry::before{content:"";position:absolute;left:0;top:-1px;bottom:-1px;width:2px;
  background:var(--accent);transform:scaleY(0);transform-origin:top;transition:transform .2s}
.entry:hover::before{transform:scaleY(1)}
.entry .et{display:block;font-family:var(--serif);font-size:1.3rem;line-height:1.28;
  color:#EDEDEA;letter-spacing:-.01em}
.entry:hover .et{color:#fff}
.entry .ec{display:block;margin:10px 0 0;font-size:11px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--sage-dim)}
.entry .es{display:block;margin:9px 0 0;font-size:14.5px;color:var(--sage-dim);
  line-height:1.58;max-width:78ch}
.empty{padding:70px 20px;text-align:center;color:var(--sage-dim);border-bottom:1px solid var(--ground-line)}

/* ---------- the paper reading surface ---------- */
.paper-frame{background:var(--ground);padding:0 28px 100px}
.paper{max-width:960px;margin:0 auto;background:var(--paper);color:var(--slate);
  border-top:3px solid var(--accent);
  box-shadow:0 1px 0 rgba(255,255,255,.06),0 30px 70px -30px rgba(0,0,0,.9)}
.paper-in{padding:clamp(38px,5.2vw,76px) clamp(26px,5vw,86px) 72px}
.paper .crumb{padding:0 0 30px;color:var(--slate-dim)}
.paper .crumb .sep{color:var(--rule-paper)}
.paper .crumb a:hover{color:var(--accent)}
.paper .eyebrow{color:var(--accent)}
.paper h1{font-family:var(--serif);color:var(--navy);font-size:clamp(2rem,4.1vw,3rem);
  line-height:1.09;letter-spacing:-.019em;margin:18px 0 0;max-width:21ch}
.lead{margin:36px 0 0;padding:0 0 0 24px;border-left:2px solid var(--accent);
  max-width:calc(var(--read) + 2rem)}
.lead .lead-lbl{font-size:10.5px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  color:var(--accent);margin-bottom:9px}
.lead p:last-child{font-family:var(--serif);font-size:1.3rem;line-height:1.48;color:var(--navy)}
.answer{max-width:var(--read);margin:44px 0 0}
.answer p{margin:0 0 1.35em;font-size:1.0625rem;line-height:1.72;color:var(--slate)}
.answer p:last-child{margin-bottom:0}
.answer strong{color:var(--navy);font-weight:600}
.deeper{margin:56px 0 0;padding:30px 0 0;border-top:1px solid var(--rule-paper);max-width:60rem}
.deeper h2{font-size:11px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--slate-dim)}
.deeper-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:1px;
  background:var(--rule-paper);border:1px solid var(--rule-paper);margin-top:18px}
.deeper-list a{background:var(--paper-raise);padding:20px;display:block;font-family:var(--serif);
  font-size:1.05rem;line-height:1.34;color:var(--navy);transition:background .16s,color .16s}
.deeper-list a:hover{background:#fff;color:var(--accent)}
.paper-cta{margin:52px 0 0;padding:28px 30px;background:var(--navy);color:#D9E0E8;
  display:flex;gap:26px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.paper-cta p{font-size:15px;max-width:52ch;line-height:1.55}
.paper-cta strong{color:#fff;font-weight:600}
.paper-cta a{background:var(--accent);color:#fff;font-weight:600;font-size:14px;
  padding:13px 24px;white-space:nowrap;letter-spacing:.01em;transition:background .16s}
.paper-cta a:hover{background:#E11}
.paper-cta-actions{display:flex;flex-direction:column;gap:10px;flex-shrink:0}
.paper-cta a.paper-cta-secondary{background:transparent;border:1px solid rgba(255,255,255,.4);
  color:#fff;text-align:center}
.paper-cta a.paper-cta-secondary:hover{background:rgba(255,255,255,.08)}

/* ---------- footer ---------- */
.foot{border-top:1px solid var(--ground-line);background:var(--ground)}
.foot-in{max-width:var(--wrap);margin:0 auto;padding:34px 28px;display:flex;
  justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:13px;color:var(--sage-dim)}
.foot-in a:hover{color:var(--sage);text-decoration:underline}
.foot-in span{color:var(--ground-line);margin:0 6px}

@media (max-width:820px){
  .q-row-in{flex-direction:column;gap:8px;padding-right:0}
  .q-row .cat{width:auto;padding-top:0}
  .q-row .arrow{display:none}
  .mast-in{padding:14px 20px;gap:14px}
  .mast-nav{margin-left:0;width:100%;gap:16px}
  .wrap{padding:0 20px}
  .paper-frame{padding:0 14px 60px}
  .filter{flex-wrap:wrap;padding:0 12px}
  .filter-go{margin:0 0 12px auto}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}
@media print{
  .mast,.foot,.paper-cta,.deeper,.skip{display:none}
  body{background:#fff;color:#000}
  .paper-frame{padding:0}
  .paper{box-shadow:none;border-top:2px solid #000;max-width:none}
}
