/* Activate Intelligence — Excellera Claude Training Programme
 * House style per AIC visual identity: mono body, italic-serif headings,
 * black on white, CMY reserved for the logo, editorial pacing.
 */

/* ---- Fonts ---- */
@import url("https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap");

@font-face { font-family:"Nudica Mono"; font-style:normal; font-weight:300; font-display:swap;
  src:url("https://activateintelligence.co.uk/wp-content/uploads/fonts/nudicamono-light-webfont.woff2") format("woff2"); }
@font-face { font-family:"Nudica Mono"; font-style:normal; font-weight:400; font-display:swap;
  src:url("https://activateintelligence.co.uk/wp-content/uploads/fonts/nudicamono-regular-webfont.woff2") format("woff2"); }
@font-face { font-family:"Nudica Mono"; font-style:normal; font-weight:500; font-display:swap;
  src:url("https://activateintelligence.co.uk/wp-content/uploads/fonts/nudicamono-medium-webfont.woff2") format("woff2"); }
@font-face { font-family:"Nudica Mono"; font-style:normal; font-weight:700; font-display:swap;
  src:url("https://activateintelligence.co.uk/wp-content/uploads/fonts/nudicamono-bold-webfont.woff2") format("woff2"); }

/* ---- Tokens ---- */
:root{
  --fg:#000000; --bg:#ffffff; --surface:#f5f5f5; --secondary:#767676; --tertiary:#e6e6e6;
  --font-body:"Nudica Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-display:"Libre Baskerville", Georgia, serif;
  --max-content:620px; --max-wide:1000px;
  --shadow-crisp:6px 6px 0px rgb(0,0,0);
  --s40:1rem; --s50:1.5rem; --s60:2.25rem; --s70:3.38rem; --s80:5.06rem;
}

/* ---- Reset ---- */
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0; background:var(--bg); color:var(--fg);
  font-family:var(--font-body); font-weight:300; line-height:1.6;
  font-size:clamp(0.9375rem, 0.9rem + 0.4vw, 1.0625rem);
}
img{max-width:100%; height:auto; display:block;}
a{color:inherit; text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px;}
a:hover{background:var(--fg); color:var(--bg); text-decoration:none;}

/* ---- Headings ---- */
h1,h2,h3{font-family:var(--font-display); font-weight:400; line-height:1.15; margin:0 0 var(--s40);}
h1{font-style:italic; font-size:clamp(2rem, 1.5rem + 2.4vw, 3rem);}
h2{font-style:italic; font-size:clamp(1.5rem, 1.2rem + 1.4vw, 2rem);}
h3{font-size:clamp(1.0625rem, 1rem + 0.5vw, 1.25rem);}

/* ---- Layout ---- */
.wrap{max-width:var(--max-wide); margin:0 auto; padding:0 var(--s50);}
.col{max-width:var(--max-content);}
main{padding:var(--s70) 0 var(--s80);}
.muted{color:var(--secondary);}
.small{font-size:0.85em; color:var(--secondary);}

/* ---- Site header ---- */
.site-head{border-bottom:1px solid var(--tertiary);}
.site-head .wrap{display:flex; align-items:center; justify-content:space-between; gap:var(--s50); padding-top:var(--s40); padding-bottom:var(--s40); flex-wrap:wrap;}
.brand img{width:200px; max-width:48vw;}
.brand:hover{background:none;}
.nav{display:flex; align-items:center; gap:0.4rem; flex-wrap:wrap;}
.nav a{text-decoration:none;}
.nav a:hover{background:var(--fg); color:var(--bg);}
.nav .sep{color:var(--tertiary); user-select:none;}

/* ---- Hero ---- */
.hero{padding-top:var(--s60);}
.hero h1{margin-bottom:var(--s50);}
.kicker{font-size:0.8rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--secondary); margin:0 0 var(--s40);}
.standfirst{font-family:var(--font-display); font-style:italic; font-size:clamp(1.1rem,1rem+0.6vw,1.4rem); line-height:1.45; color:var(--fg);}
.meta-row{display:flex; flex-wrap:wrap; gap:var(--s50); margin-top:var(--s50); padding-top:var(--s40); border-top:1px solid var(--tertiary); color:var(--secondary); font-size:0.85rem; letter-spacing:0.04em;}
.meta-row strong{display:block; color:var(--fg); font-weight:500; font-size:1.4rem; letter-spacing:0;}

/* ---- Session list (index) ---- */
.sessions{margin-top:var(--s70); border-top:1px solid var(--fg);}
.session-item{display:grid; grid-template-columns:auto auto 1fr auto; gap:var(--s50); align-items:center; padding:var(--s50) 0; border-bottom:1px solid var(--tertiary); text-decoration:none;}
.session-item:hover{background:none;}
.session-item:hover .s-title{background:var(--fg); color:var(--bg);}
.session-item > span:nth-child(3){align-self:center;}
.s-num{font-family:var(--font-display); font-style:italic; font-size:clamp(1.6rem,1.2rem+1.6vw,2.4rem); color:var(--secondary); line-height:1;}
.s-title{font-family:var(--font-display); font-style:italic; font-size:clamp(1.25rem,1.1rem+0.8vw,1.6rem); line-height:1.2; margin-bottom:0.35rem; display:inline;}
.s-by{color:var(--secondary); font-size:0.85rem; margin-top:0.5rem;}
.s-blurb{margin-top:0.6rem; max-width:46ch;}
.s-when{text-align:right; color:var(--secondary); font-size:0.8rem; white-space:nowrap; line-height:1.5;}
.s-go{margin-top:0.6rem; font-weight:500; color:var(--fg);}
@media(max-width:680px){
  .session-item{grid-template-columns:auto auto 1fr; align-items:center;}
  .s-when{grid-column:3; text-align:right; margin-top:0; align-self:center;}
}

/* ---- Lesson page ---- */
.breadcrumb{font-size:0.8rem; color:var(--secondary); margin-bottom:var(--s50);}
.lesson-head .kicker{margin-bottom:var(--s40);}
.lesson-meta{display:flex; flex-wrap:wrap; gap:1.4rem; margin:var(--s40) 0 var(--s60); color:var(--secondary); font-size:0.85rem; letter-spacing:0.03em;}
.lesson-meta span strong{color:var(--fg); font-weight:500;}

/* ---- Presenter ---- */
.presenter{display:flex; align-items:center; gap:1rem; margin:var(--s40) 0 var(--s60);}
.presenter img{width:64px; height:64px; border-radius:50%; object-fit:cover; flex:0 0 auto; border:1px solid var(--tertiary);}
.presenter .p-name{font-weight:500; font-size:1rem; line-height:1.3;}
.presenter .p-role{color:var(--secondary); font-size:0.82rem;}

/* small presenter thumb on the index list */
.s-thumb{width:54px; height:54px; border-radius:50%; object-fit:cover; border:1px solid var(--tertiary);}

/* ---- Watch link ---- */
.watch{display:flex; align-items:center; gap:1.25rem; flex-wrap:wrap; padding:var(--s50); background:var(--surface); border:1px solid var(--tertiary); box-shadow:var(--shadow-crisp);}
.watch .w-icon{flex:0 0 auto; width:48px; height:48px; border:1.5px solid var(--fg); border-radius:50%; display:flex; align-items:center; justify-content:center;}
.watch .w-icon svg{width:18px; height:18px; margin-left:3px; fill:var(--fg);}
.watch .w-text{flex:1 1 auto; min-width:12rem;}
.watch .w-title{font-weight:500;}
.watch .w-sub{color:var(--secondary); font-size:0.82rem; margin-top:0.2rem;}
.watch .btn{white-space:nowrap;}

/* ---- Content sections ---- */
.section{margin-top:var(--s70);}
.section h2{margin-bottom:var(--s40);}
.section p{margin:0 0 var(--s40);}
ul.takeaways{list-style:none; margin:0; padding:0;}
ul.takeaways li{padding:0.7rem 0 0.7rem 1.6rem; border-bottom:1px solid var(--tertiary); position:relative;}
ul.takeaways li::before{content:"\2192"; position:absolute; left:0; top:0.7rem; color:var(--secondary);}

ol.chapters{list-style:none; margin:0; padding:0; counter-reset:none;}
.chapter{display:grid; grid-template-columns:5.5rem 1fr; gap:1rem; padding:0.6rem 0; border-bottom:1px solid var(--tertiary);}
.chapter .ts{color:var(--secondary); font-variant-numeric:tabular-nums; font-size:0.85rem;}
.chapter .ct{font-weight:400;}

/* ---- Download / button ---- */
.btn{display:inline-block; border:1px solid var(--fg); background:none; color:var(--fg); padding:0.6rem 1.1rem; text-decoration:none; font-weight:500; letter-spacing:0.03em; border-radius:0;}
.btn:hover{background:var(--fg); color:var(--bg);}
.downloads p{color:var(--secondary); font-size:0.9rem;}

/* ---- Resources list ---- */
ul.resources{list-style:none; margin:0; padding:0;}
ul.resources li{border-bottom:1px solid var(--tertiary);}
ul.resources a{display:flex; align-items:baseline; gap:0.75rem; padding:0.85rem 0; text-decoration:none;}
ul.resources a:hover{background:none;}
ul.resources a:hover .r-title{background:var(--fg); color:var(--bg);}
ul.resources .r-title{font-weight:500;}
ul.resources .r-meta{color:var(--secondary); font-size:0.8rem;}
ul.resources .r-arrow{margin-left:auto; color:var(--secondary);}

/* ---- Prev / next ---- */
.pager{display:flex; justify-content:space-between; gap:var(--s50); margin-top:var(--s80); padding-top:var(--s50); border-top:1px solid var(--fg); flex-wrap:wrap;}
.pager a{text-decoration:none; max-width:48%;}
.pager a:hover{background:none;}
.pager .lab{font-size:0.75rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--secondary);}
.pager .ttl{font-family:var(--font-display); font-style:italic; font-size:1.1rem;}
.pager a:hover .ttl{background:var(--fg); color:var(--bg);}
.pager .next{text-align:right; margin-left:auto;}

/* ---- Footer ---- */
.site-foot{border-top:1px solid var(--tertiary); margin-top:var(--s80);}
.site-foot .wrap{display:flex; justify-content:space-between; align-items:center; gap:var(--s50); padding:var(--s50) var(--s50); flex-wrap:wrap;}
.site-foot img{width:34px;}
.site-foot .small{max-width:60ch;}
