@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Libre+Baskerville:wght@400&display=swap');

/* BBC News typography reference: Reith Sans for reading text and interface,
   Reith Serif for editorial headings. */
@font-face{font-family:'ReithSans';src:url('https://static.files.bbci.co.uk/fonts/reith/2.610/BBCReithSans_W_Rg.woff2') format('woff2');font-display:swap;font-style:normal;font-weight:400}
@font-face{font-family:'ReithSans';src:url('https://static.files.bbci.co.uk/fonts/reith/2.610/BBCReithSans_W_It.woff2') format('woff2');font-display:swap;font-style:italic;font-weight:400}
@font-face{font-family:'ReithSans';src:url('https://static.files.bbci.co.uk/fonts/reith/2.610/BBCReithSans_W_Md.woff2') format('woff2');font-display:swap;font-style:normal;font-weight:500 600}
@font-face{font-family:'ReithSans';src:url('https://static.files.bbci.co.uk/fonts/reith/2.610/BBCReithSans_W_Bd.woff2') format('woff2');font-display:swap;font-style:normal;font-weight:700 800}
@font-face{font-family:'ReithSerif';src:url('https://static.files.bbci.co.uk/fonts/reith/2.610/BBCReithSerif_W_Rg.woff2') format('woff2');font-display:swap;font-style:normal;font-weight:400}
@font-face{font-family:'ReithSerif';src:url('https://static.files.bbci.co.uk/fonts/reith/2.610/BBCReithSerif_W_It.woff2') format('woff2');font-display:swap;font-style:italic;font-weight:400}
@font-face{font-family:'ReithSerif';src:url('https://static.files.bbci.co.uk/fonts/reith/2.610/BBCReithSerif_W_Md.woff2') format('woff2');font-display:swap;font-style:normal;font-weight:500 600}
@font-face{font-family:'ReithSerif';src:url('https://static.files.bbci.co.uk/fonts/reith/2.610/BBCReithSerif_W_Bd.woff2') format('woff2');font-display:swap;font-style:normal;font-weight:700 800}

:root{
  --bg:#F4EFE7;
  --surface:rgba(255,255,255,.72);
  --surface-strong:rgba(255,255,255,.84);
  --text:#2E2E2E;
  --muted:#4A4A4A;
  --subtle:#6B655E;
  --gold:#C8A96A;
  --gold-deep:#B88C3E;
  --line:rgba(46,46,46,.08);
  --shadow:0 18px 40px rgba(46,46,46,.08);
  --max:1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,sans-serif;
  color:var(--muted);
  background:
    radial-gradient(circle at top left, rgba(255,255,255,.8), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.03)),
    var(--bg);
  line-height:1.72;
}
body::before{
  content:"";
  position:fixed; inset:0; pointer-events:none; z-index:-1; opacity:.022;
  background-image:linear-gradient(0deg, transparent 0 23px, rgba(46,46,46,.11) 24px, transparent 25px);
  background-size:100% 26px;
}
img{display:block;max-width:100%;height:auto}
a{text-decoration:none;color:inherit}
p{margin:0 0 1rem}
ul{margin:.35rem 0 0;padding-left:1.1rem}
li{margin:.35rem 0}

h1,h2,h3,strong{
  color:var(--text);
  font-family:Inter,system-ui,sans-serif;
  font-weight:600;
  letter-spacing:-.01em;
  margin:0 0 1rem;
}

.hero-copy h1,
.page-hero.compact h1{
  font-size:clamp(1.9rem,2.15vw,2.05rem);
  line-height:1.1;
}

.section-heading h2,
.quote,
.feature-band h3,
.cta h2,
.about .section-title,
section.alt .section-title,
.section-title{
  font-size:clamp(1.72rem,1.9vw,1.84rem);
  line-height:1.16;
}

.focus-card h3,
.post-card h2,
.post-card h3,
.card h2,
.card h3,
.contact-card h2,
.service-card-title{
  font-size:clamp(1.04rem,1vw,1.1rem);
  line-height:1.22;
}

.serif-copy{font-family:Inter,system-ui,sans-serif; line-height:1.72}

.container{width:min(calc(100% - 2rem), var(--max)); margin:auto}
.text-narrow{max-width:860px}
.page-wrap{min-height:100vh; display:flex; flex-direction:column}

.small-caps{
  display:block;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:.76rem;
  color:var(--subtle);
  font-weight:500;
  margin:0;
}

.gold-divider{
  width:106px;
  height:1px;
  background:linear-gradient(90deg, transparent 0%, var(--gold) 12%, var(--gold) 88%, transparent 100%);
  margin:1rem auto 1.25rem auto;
}
.gold-divider.left{margin:1rem 0 1.25rem 0}

.title-divider{
  width:48px;
  height:1px;
  background:var(--gold);
  margin:.55rem 0 1rem;
}

.sep{
  color:var(--gold);
  font-size:.56em;
  vertical-align:middle;
}

/* Header */
.site-header{
  position:sticky; top:0; z-index:100;
  backdrop-filter:blur(14px);
  background:rgba(244,239,231,.9);
  border-bottom:1px solid rgba(46,46,46,.04);
}
.header-inner{
  min-height:78px;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.brand{display:flex; align-items:center; gap:.8rem}
.brand img{width:42px; height:42px; object-fit:contain}
.brand-text{display:flex; flex-direction:column; gap:.05rem}
.brand-text strong{font-size:1.08rem; margin:0}
.brand-text span{font-size:.75rem; color:var(--subtle)}
.site-nav{display:flex; align-items:center; gap:1.25rem; font-size:.93rem}
.site-nav a{position:relative; color:var(--subtle)}
.site-nav a::after{
  content:""; position:absolute; left:0; bottom:-.28rem; width:100%; height:1px;
  background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .22s ease;
}
.site-nav a:hover,.site-nav a.active{color:var(--text)}
.site-nav a:hover::after,.site-nav a.active::after{transform:scaleX(1)}
.nav-toggle{
  display:none;
  border:1px solid rgba(200,169,106,.76);
  background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.66));
  border-radius:999px;
  padding:.68rem .98rem;
  color:var(--text);
  font-weight:500;
  font-family:inherit;
}

/* Hero / page hero */
.hero{padding:3.4rem 0 3rem}
.hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(280px,.82fr);
  gap:1.8rem;
  align-items:center;
}
.hero-kicker-block{display:block; margin-bottom:1rem}
.hero-copy p{max-width:720px}
.hero-card{
  justify-self:end; width:100%; max-width:380px;
  border-radius:32px; overflow:hidden;
  border:1px solid rgba(200,169,106,.22);
  box-shadow:var(--shadow);
  background:linear-gradient(180deg, rgba(255,255,255,.56), rgba(255,255,255,.22));
}
.hero-card img{width:100%; aspect-ratio:4/4.75; object-fit:cover; object-position:center 10%}
.hero-badge{
  padding:1rem;
  background:rgba(244,239,231,.95);
  border-top:1px solid rgba(46,46,46,.05);
}
.hero-badge p{margin:0}

.page-hero.compact{padding:3.2rem 0 1.1rem}
.page-hero.compact .gold-divider{margin:1rem 0 1.25rem}
.page-hero.compact p{max-width:860px}

/* Buttons */
.button-row{display:flex; flex-wrap:wrap; gap:.82rem; margin-top:1.25rem}
.button{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:45px; padding:.78rem 1.18rem;
  border-radius:999px;
  border:1px solid rgba(200,169,106,.76);
  background:linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,255,255,.70));
  font-weight:500;
  box-shadow:0 8px 20px rgba(46,46,46,.05);
  color:var(--text);
}
.button.primary{
  background:linear-gradient(180deg, rgba(200,169,106,.22), rgba(200,169,106,.11));
}
.button:hover{color:var(--gold-deep); border-color:var(--gold-deep)}
.text-link{display:inline-flex; align-items:center; gap:.45rem; font-weight:500; color:var(--text)}
.text-link::after{content:"→"; color:var(--gold-deep)}
.hero-buttons{flex-wrap:nowrap}
.hero-buttons .button{white-space:nowrap; font-size:.88rem; padding:.72rem .96rem}

/* Stats */
.hero-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.72rem;
  margin-top:1.35rem;
  align-items:stretch;
}
.stat{
  padding:.9rem;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.86), rgba(255,255,255,.62));
  border:1px solid rgba(200,169,106,.18);
  box-shadow:0 8px 18px rgba(46,46,46,.05);
  display:flex; flex-direction:column; justify-content:flex-start;
}
.stat strong{
  color:var(--gold);
  font-family:Inter,system-ui,sans-serif;
  font-size:1.04rem;
  line-height:1.2;
  min-height:1.28em;
  display:block;
  margin:0 0 .18rem;
}
.stat span{display:block; margin-top:0; font-size:.84rem; color:var(--muted)}

/* Sections / cards */
.section{padding:3.7rem 0}
.section.alt{
  background:linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.05));
  border-top:1px solid rgba(46,46,46,.04);
  border-bottom:1px solid rgba(46,46,46,.04);
}
.section-heading{
  max-width:820px;
  margin:0 auto 2rem;
  text-align:center;
}
.section-heading p{max-width:760px; margin-left:auto; margin-right:auto}
.section-heading.text-left-copy p,
.section-heading.text-left-copy .text-narrow{ text-align:left }

.card,.focus-card,.post-card,.contact-card,.article-card,.feature-band{
  background:linear-gradient(180deg, rgba(255,255,255,.84), rgba(255,255,255,.54));
  border:1px solid rgba(46,46,46,.05);
  box-shadow:var(--shadow);
  border-radius:26px;
  padding:1.45rem;
}
.focus-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem}
.focus-card{
  position:relative; overflow:hidden;
}
.focus-card::before{content:none}
.focus-card::after{
  content:""; position:absolute; inset:auto -30px -42px auto; width:110px; height:110px;
  background:radial-gradient(circle, rgba(200,169,106,.14), transparent 70%);
}
.focus-card h3,.service-card-title{margin-bottom:0}
.focus-card .title-divider,.services-grid-secondary .title-divider{margin:.55rem 0 1rem}

.quote-panel{
  position:relative; overflow:hidden;
  border-radius:32px;
  padding:2.1rem 1.4rem;
  text-align:center;
  background:linear-gradient(180deg, rgba(255,255,255,.74), rgba(255,255,255,.34));
  border:1px solid rgba(200,169,106,.22);
  box-shadow:var(--shadow);
}
.quote-panel::before{content:none}
.quote-panel p{max-width:760px; margin:0 auto}

.feature-band{position:relative; overflow:hidden}
.feature-band::before{content:none}
.feature-band.left-content{text-align:left}
.feature-band.left-content h3,.feature-band.left-content p{text-align:left; max-width:none}

.post-list,.insights-grid{display:grid; gap:1rem}
.insights-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.post-card{display:flex; flex-direction:column; justify-content:flex-start}
.kicker{
  display:block;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.76rem;
  color:var(--subtle);
  font-weight:500;
}
.kicker.with-line::after{
  content:"";
  display:block;
  width:48px;
  height:1px;
  background:var(--gold);
  margin:.55rem 0 1rem;
}
.post-card h2,.post-card h3{margin-top:0}
.form-note{
  margin:.15rem 0 1.1rem;
  padding:.85rem 1rem;
  border-left:2px solid var(--gold);
  background:rgba(200,169,106,.08);
  color:var(--subtle);
  font-size:.9rem;
  line-height:1.55;
}


/* Layout helpers */
.two-col,.contact-grid{display:grid; gap:1rem}
.two-col{grid-template-columns:minmax(0,1.08fr) minmax(280px,.92fr)}
.two-col.balanced-top{
  align-items:start;
  grid-template-columns:minmax(0,.95fr) minmax(320px,.8fr);
}
.image-frame{
  position:relative; overflow:hidden;
  border-radius:30px;
  border:1px solid rgba(200,169,106,.18);
  box-shadow:var(--shadow);
  background:var(--surface);
}
.image-frame img{width:100%; height:100%}
.image-frame.conversation{min-height:430px; max-height:430px}
.image-frame.conversation img{height:430px; object-fit:cover; object-position:center}
.image-frame.studio img{aspect-ratio:4/3; object-fit:cover; object-position:center 16%}
.image-frame.watermarked::after{
  content:""; position:absolute; inset:0;
  background:url('assets/watermark-post.png') center/64% auto no-repeat;
  opacity:.05;
}

.core-strengths-card{
  padding:1.35rem;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:430px;
  max-height:430px;
  text-align:center;
}
.core-strengths-card .gold-divider{margin:1rem auto 1.1rem}
.core-strengths-card ul{margin:0}
.core-strengths-list{
  display:block;
  text-align:left;
  margin:.15rem 0 0;
  padding-left:1.05rem;
}
.core-strengths-list li{margin:.3rem 0}
.core-strengths-list li:last-child{margin-bottom:0}

.contact-grid{
  grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);
  align-items:start;
}
.contact-grid.swapped > .contact-card:first-child{order:2}
.contact-grid.swapped > .contact-card:last-child{order:1}
.contact-card.compact-info{min-height:auto; align-self:start}
.contact-list{list-style:none; padding:0; margin:1rem 0 0}
.contact-list li{padding:.85rem 0; border-top:1px solid var(--line)}
.contact-card form{margin-top:.15rem}

.form-grid{display:grid; gap:.95rem}
label{display:grid; gap:.42rem; font-size:.94rem; font-weight:500; color:var(--text)}
input,textarea{
  width:100%; padding:.9rem 1rem;
  border-radius:14px;
  border:1px solid rgba(46,46,46,.12);
  background:rgba(255,255,255,.92);
  font:inherit;
  color:var(--text);
}
textarea{min-height:180px; resize:vertical}
.hidden{position:absolute !important; left:-9999px !important}

.cta{text-align:center; padding:3rem 0 3.4rem}
.cta p{max-width:760px; margin:0 auto 1.2rem}
.cta h2{margin-bottom:16px}

/* policy */
.policy-page .page-hero.compact{padding-bottom:.55rem}
.policy-page .page-hero.compact + .section{padding-top:.9rem}
.policy-page .article-body,.policy-page .article-body p,.policy-page .article-body .serif-copy{
  font-family:Inter,system-ui,sans-serif;
  line-height:1.72;
}

/* footer */
.site-footer{
  margin-top:auto;
  background:linear-gradient(180deg, rgba(236,229,218,.96), rgba(232,224,213,.98));
  border-top:1px solid rgba(46,46,46,.05);
}
.footer-grid{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) repeat(2,minmax(180px,.72fr));
  gap:1rem;
  padding:2.2rem 0 1.4rem;
}
.footer-title{font-size:1rem; margin-bottom:.68rem}
.footer-links{display:grid; gap:.55rem}
.footer-links a,.footer-links span{color:var(--subtle)}
.footer-links a:hover{color:var(--gold-deep)}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:.7rem;
  padding:1rem 0 1.4rem;
  border-top:1px solid rgba(46,46,46,.05);
  font-size:.83rem;
  color:var(--subtle);
}

@media (max-width:1024px){
  .hero-grid,.footer-grid{grid-template-columns:1fr}
  .hero-card{justify-self:start; max-width:360px}
  .hero-buttons{flex-wrap:wrap}
}

@media (max-width:900px){
  .focus-grid,.insights-grid,.two-col,.contact-grid,.hero-stats{grid-template-columns:1fr}
  .two-col.balanced-top .image-frame.conversation,
  .two-col.balanced-top .core-strengths-card{
    min-height:auto;
    max-height:none;
  }
  .two-col.balanced-top .image-frame.conversation img{
    height:auto;
    aspect-ratio:4/3;
  }
  .contact-grid.swapped > .contact-card:first-child,
  .contact-grid.swapped > .contact-card:last-child{order:initial}
}

@media (max-width:760px){
  .container{width:min(calc(100% - 1.35rem), var(--max))}
  .header-inner{min-height:72px}
  .brand-text span{display:none}
  .nav-toggle{display:inline-flex}
  .site-nav{
    display:none;
    position:absolute;
    top:72px; left:.7rem; right:.7rem;
    flex-direction:column;
    align-items:flex-start;
    gap:.9rem;
    padding:1rem;
    background:rgba(244,239,231,.98);
    border:1px solid rgba(46,46,46,.06);
    border-radius:18px;
    box-shadow:0 8px 18px rgba(46,46,46,.05);
  }
  .site-nav.open{display:flex}
  .button-row{flex-direction:column; align-items:stretch}
  .button{width:100%}
  .card,.focus-card,.post-card,.contact-card,.article-card,.feature-band{padding:1.12rem}
  .quote-panel{padding:1.55rem .95rem}
  .section{padding:3rem 0}
  .cta{padding:2.4rem 0 2.9rem}
  .nav-toggle{color:var(--text)}
}


/* ===== v12 targeted home/about fixes ===== */

/* Home: make Signature Perspective title match main section-title system exactly */
.quote-panel .quote{
  color:#2E2E2E !important;
  font-family:Inter, system-ui, sans-serif !important;
  font-weight:600 !important;
  letter-spacing:-0.01em !important;
  font-size:clamp(1.72rem, 1.9vw, 1.84rem) !important;
  line-height:1.16 !important;
  margin:0 0 16px 0 !important;
}

/* Home: ensure explicit divider appears between label and title in What sits behind the work */
.feature-band .gold-divider.left{
  display:block !important;
  width:106px !important;
  height:1px !important;
  background:linear-gradient(90deg, transparent 0%, var(--gold) 12%, var(--gold) 88%, transparent 100%) !important;
  margin:1rem 0 1.25rem 0 !important;
}
.feature-band .small-caps.with-line::after{
  display:none !important;
  content:none !important;
}

/* About: centre only this title, keep divider centered under it, body left aligned */
.centered-about-title{
  text-align:center !important;
}
section.alt .card > .gold-divider{
  margin:1rem auto 1.25rem auto !important;
}
section.alt .card p{
  text-align:left !important;
}


/* ===== v13: center 'What sits behind the work' sections (home + about only) ===== */
.centered-feature{
  text-align:center !important;
}
.centered-feature .small-caps{
  text-align:center !important;
}
.centered-feature .gold-divider{
  margin:1rem auto 1.25rem auto !important;
}
.centered-feature h2,
.centered-feature .section-title{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.centered-feature p{
  text-align:center !important;
}


/* ===== v14 FINAL HOME FIX ===== */
.force-center{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.force-center-divider{
  margin-left:auto !important;
  margin-right:auto !important;
}


/* ===== v15 mobile-only refinements ===== */
@media (max-width:900px){
  /* Contact page: form first, contact details second on mobile only */
  .contact-grid.swapped > .contact-card:first-child{order:2 !important;}
  .contact-grid.swapped > .contact-card:last-child{order:1 !important;}

  /* About page: remove tiny floating image on mobile */
  .two-col.balanced-top .image-frame.conversation{
    display:none !important;
  }
  .two-col.balanced-top{
    grid-template-columns:1fr !important;
  }
}

@media (max-width:760px){
  /* Mobile title scale */
  .hero-copy h1,
  .page-hero.compact h1{
    font-size:clamp(1.45rem, 7.2vw, 1.8rem) !important;
    line-height:1.08 !important;
  }

  .section-heading h2,
  .quote,
  .feature-band h3,
  .cta h2,
  .about .section-title,
  section.alt .section-title,
  .section-title{
    font-size:clamp(1.28rem, 5.6vw, 1.52rem) !important;
    line-height:1.14 !important;
  }

  .focus-card h3,
  .post-card h2,
  .post-card h3,
  .card h2,
  .card h3,
  .contact-card h2,
  .service-card-title{
    font-size:clamp(0.98rem, 4.5vw, 1.06rem) !important;
    line-height:1.22 !important;
  }

  .small-caps,
  .kicker{
    font-size:.7rem !important;
    letter-spacing:.16em !important;
  }
}


/* ===== v16 targeted fixes ===== */

/* Home page "What sits behind the work" section: fully centered */
.feature-band.centered-feature{
  text-align:center !important;
}
.feature-band.centered-feature .small-caps{
  text-align:center !important;
}
.feature-band.centered-feature .gold-divider{
  display:block !important;
  margin:1rem auto 1.25rem auto !important;
}
.feature-band.centered-feature h2,
.feature-band.centered-feature h3{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.feature-band.centered-feature p{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
  max-width:900px !important;
}

/* Mobile only: contact form first, details second */
@media (max-width:900px){
  .contact-grid.swapped > .contact-card:first-child{order:2 !important;}
  .contact-grid.swapped > .contact-card:last-child{order:1 !important;}

  /* About page mobile: keep image visible and stack normally above core strengths */
  .two-col.balanced-top{
    grid-template-columns:1fr !important;
  }
  .two-col.balanced-top .image-frame.conversation{
    display:block !important;
    min-height:auto !important;
    max-height:none !important;
    margin-bottom:1rem !important;
  }
  .two-col.balanced-top .image-frame.conversation img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    aspect-ratio:4/3 !important;
    object-fit:cover !important;
  }
}

/* Mobile titles remain slightly reduced only */
@media (max-width:760px){
  .hero-copy h1,
  .page-hero.compact h1{
    font-size:clamp(1.45rem, 7.2vw, 1.8rem) !important;
    line-height:1.08 !important;
  }

  .section-heading h2,
  .quote,
  .feature-band h3,
  .cta h2,
  .about .section-title,
  section.alt .section-title,
  .section-title{
    font-size:clamp(1.28rem, 5.6vw, 1.52rem) !important;
    line-height:1.14 !important;
  }

  .focus-card h3,
  .post-card h2,
  .post-card h3,
  .card h2,
  .card h3,
  .contact-card h2,
  .service-card-title{
    font-size:clamp(0.98rem, 4.5vw, 1.06rem) !important;
    line-height:1.22 !important;
  }
}


/* ===== v18 targeted updates ===== */

/* 1. Title system: align hero and section titles consistently */
.hero-copy h1,
.page-hero.compact h1,
.section-heading h2,
.quote,
.feature-band h3,
.cta h2,
.about .section-title,
section.alt .section-title,
.section-title{
  font-size:clamp(1.72rem, 1.9vw, 1.84rem) !important;
  line-height:1.16 !important;
}

/* 2. Home feature heading centered and clean two-line treatment */
.feature-band{
  text-align:center !important;
}
.feature-band .small-caps{
  text-align:center !important;
}
.feature-band .gold-divider,
.feature-band .title-divider{
  margin:1rem auto 1.25rem auto !important;
}
.feature-band h3{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
  max-width:1000px !important;
}
.feature-band p{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
  max-width:920px !important;
}

/* 3. Desktop hero: align image card height with left content block */
@media (min-width:901px){
  .hero-grid{
    align-items:stretch !important;
    grid-template-columns:minmax(0,1.15fr) minmax(300px,.82fr) !important;
  }
  .hero-copy{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
  }
  .hero-card{
    height:100% !important;
    max-width:380px !important;
    display:flex !important;
    flex-direction:column !important;
  }
  .hero-card img{
    flex:1 1 auto !important;
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:auto !important;
    object-fit:cover !important;
  }
  .hero-badge{
    margin-top:auto !important;
  }
}

/* 4. Contact page: image moved under contact details and aligned with form height */
.contact-grid{
  align-items:stretch !important;
}
.contact-card{
  display:flex;
  flex-direction:column;
}
.contact-card.compact-info{
  min-height:100%;
}
.contact-shot{
  margin-top:1rem;
  flex:1 1 auto;
  min-height:320px;
}
.contact-shot img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

/* 5. About page after image removal: strengths card full width and centered */
.text-narrow .core-strengths-card{
  max-width:860px;
  margin:0 auto;
}
.text-narrow .core-strengths-list{
  max-width:720px;
  margin:0 auto;
}

/* 6. Mobile-only: title scaling tidied but not oversized */
@media (max-width:760px){
  .hero-copy h1,
  .page-hero.compact h1,
  .section-heading h2,
  .quote,
  .feature-band h3,
  .cta h2,
  .about .section-title,
  section.alt .section-title,
  .section-title{
    font-size:clamp(1.34rem, 5.8vw, 1.56rem) !important;
    line-height:1.14 !important;
  }

  .focus-card h3,
  .post-card h2,
  .post-card h3,
  .card h2,
  .card h3,
  .contact-card h2,
  .service-card-title{
    font-size:clamp(0.98rem, 4.2vw, 1.05rem) !important;
  }
}

/* 7. Mobile contact/about image flow */
@media (max-width:900px){
  .contact-grid.swapped > .contact-card:first-child{order:2 !important;}
  .contact-grid.swapped > .contact-card:last-child{order:1 !important;}

  .contact-shot{
    min-height:220px;
  }
}


/* ===== v20 targeted batch updates from v18 ===== */

/* 1) Home hero desktop: align image card top and bottom with left content block */
@media (min-width: 901px) {
  .hero-grid {
    align-items: stretch !important;
  }

  .hero-copy {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
  }

  .hero-buttons {
    margin-top: auto !important;
  }

  .hero-card {
    display: grid !important;
    grid-template-rows: 1fr auto !important;
    height: 100% !important;
    align-self: stretch !important;
    overflow: hidden !important;
  }

  .hero-card img {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    object-position: center 10% !important;
    display: block !important;
  }

  .hero-badge {
    margin-top: 0 !important;
  }
}

/* 2) Home page: keep titles/dividers centered, but left-align body text in the two centred statement sections */
.quote-panel,
.feature-band.centered-feature {
  text-align: center !important;
}
.quote-panel .small-caps,
.quote-panel .gold-divider,
.feature-band.centered-feature .small-caps,
.feature-band.centered-feature .gold-divider {
  text-align: center !important;
}
.quote-panel .quote,
.feature-band.centered-feature h3 {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.quote-panel p,
.feature-band.centered-feature p {
  text-align: left !important;
  max-width: 640px !important;
  margin: 0 auto !important;
}

/* 3) About page desktop: how/core side-by-side, equal heights */
.about-dual-grid {
  display: grid !important;
  grid-template-columns: minmax(0,1.12fr) minmax(320px,.88fr) !important;
  gap: 1rem !important;
  align-items: stretch !important;
}
.about-how-card,
.about-core-card {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}
.about-how-card {
  text-align: center !important;
}
.about-how-card h2 {
  text-align: center !important;
}
.about-how-card .gold-divider {
  margin: 1rem auto 1.25rem auto !important;
}
.about-how-card p {
  text-align: left !important;
}
.about-core-card {
  text-align: center !important;
}
.about-core-card .gold-divider {
  margin: 1rem auto 1.1rem auto !important;
}
.about-core-card .core-strengths-card,
.about-how-card .section-title-force {
  min-height: auto !important;
  max-height: none !important;
}
.about-core-card .core-strengths-list {
  text-align: left !important;
  max-width: 720px !important;
  margin: 0 auto !important;
}
@media (max-width: 900px) {
  .about-dual-grid {
    grid-template-columns: 1fr !important;
  }
}

/* 4) About page statement section: centred heading/divider, left-aligned body */
.about-page .feature-band p,
body.about-page .feature-band p {
  text-align: left !important;
  max-width: 700px !important;
  margin: 0 auto !important;
}

/* 5) Contact page desktop: reduce right section height and align both columns top/bottom more neatly */
.contact-grid {
  align-items: stretch !important;
}
.contact-card {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}
.contact-card form {
  margin-bottom: 0 !important;
}
.contact-card textarea {
  min-height: 170px !important;
}
.contact-card.compact-info {
  justify-content: flex-start !important;
}
.contact-shot {
  margin-top: 1rem !important;
  flex: 1 1 auto !important;
  min-height: 200px !important;
  max-height: 270px !important;
}
.contact-shot img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

@media (max-width: 900px) {
  .contact-card,
  .contact-card.compact-info {
    height: auto !important;
  }
  .contact-shot {
    min-height: 220px !important;
    max-height: none !important;
  }
}


/* ===== v21 proper targeted fixes ===== */

/* HOME HERO: keep left block unchanged, reduce right block only so bottom aligns closer to buttons */
@media (min-width: 901px) {
  .home-page .hero-grid {
    align-items: start !important;
  }

  .home-page .hero-copy {
    display: block !important;
    height: auto !important;
  }

  .home-page .hero-card {
    align-self: start !important;
    height: auto !important;
    max-width: 350px !important;
    display: block !important;
  }

  .home-page .hero-card img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4 / 4.7 !important;
    object-fit: cover !important;
    object-position: center 10% !important;
    display: block !important;
  }

  .home-page .hero-badge {
    padding: .82rem .92rem !important;
  }
}

/* HOME STATEMENT PANELS: centered small caps/title/divider, left-aligned body copy */
.home-page .quote-panel .quote,
.home-page .feature-band.centered-feature h3 {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 760px !important;
}

.home-page .quote-panel p,
.home-page .feature-band.centered-feature p {
  text-align: left !important;
  width: min(100%, 640px) !important;
  max-width: 640px !important;
  margin: 0 auto !important;
}

/* ABOUT: side-by-side cards equal height and visually balanced */
@media (min-width: 901px) {
  .about-page .about-dual-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr) !important;
    gap: 1rem !important;
    align-items: stretch !important;
  }

  .about-page .about-how-card,
  .about-page .about-core-card {
    min-height: 400px !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }
}

/* ABOUT: "How I am often brought in" to match Core Strengths style */
.about-page .about-how-card h2 {
  text-transform: uppercase !important;
  letter-spacing: .18em !important;
  font-size: .76rem !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  color: var(--subtle) !important;
  margin: 0 !important;
  text-align: center !important;
}

.about-page .about-how-card .gold-divider,
.about-page .about-core-card .gold-divider {
  margin: 1rem auto 1.15rem auto !important;
}

.about-page .about-how-card p,
.about-page .about-core-card .core-strengths-list {
  text-align: left !important;
}

.about-page .about-core-card .core-strengths-list {
  max-width: 720px !important;
  margin: auto 0 !important;
  padding-left: 1.05rem !important;
}

.about-page .about-core-card {
  text-align: center !important;
}

/* ABOUT feature block: centered heading/divider, left-aligned body */
.about-page .feature-band h3 {
  text-align: center !important;
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.about-page .feature-band p {
  text-align: left !important;
  width: min(100%, 640px) !important;
  max-width: 640px !important;
  margin: 0 auto !important;
}

/* CONTACT desktop only: reduce right block height and remove excess white space */
@media (min-width: 901px) {
  .contact-page .contact-grid {
    align-items: start !important;
  }

  .contact-page .contact-card {
    height: auto !important;
    min-height: 0 !important;
    display: block !important;
  }

  .contact-page .contact-card textarea {
    min-height: 155px !important;
  }

  .contact-page .contact-shot {
    min-height: 220px !important;
    max-height: 250px !important;
    margin-top: .9rem !important;
  }

  .contact-page .contact-shot img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
  }
}

/* MOBILE: keep these statement bodies left aligned too */
@media (max-width: 900px) {
  .home-page .quote-panel p,
  .home-page .feature-band.centered-feature p,
  .about-page .feature-band p {
    width: min(100%, 640px) !important;
    max-width: 640px !important;
    text-align: left !important;
    margin: 0 auto !important;
  }

  .about-page .about-dual-grid {
    grid-template-columns: 1fr !important;
  }

  .about-page .about-how-card,
  .about-page .about-core-card {
    min-height: auto !important;
    height: auto !important;
  }
}


/* ===== v22 requested refinements ===== */

/* Home hero: keep left side unchanged, reduce only right card height */
@media (min-width: 901px) {
  .home-page .hero-grid {
    align-items: start !important;
  }

  .home-page .hero-copy {
    display: block !important;
    height: auto !important;
  }

  .home-page .hero-card {
    align-self: start !important;
    height: auto !important;
    max-width: 340px !important;
    display: block !important;
  }

  .home-page .hero-card img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4 / 4.45 !important;
    object-fit: cover !important;
    object-position: center 10% !important;
  }

  .home-page .hero-badge {
    padding: 0.75rem 0.9rem !important;
  }
}

/* Home: add more gap between stat blocks and buttons */
.home-page .hero-buttons {
  margin-top: 1.2rem !important;
}

/* Home statement panels: centered title/divider, left-aligned body copy */
.home-page .quote-panel .quote,
.home-page .feature-band.centered-feature h3 {
  text-align: center !important;
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.home-page .quote-panel p,
.home-page .feature-band.centered-feature p {
  text-align: left !important;
  width: min(100%, 650px) !important;
  max-width: 650px !important;
  margin: 0 auto !important;
}

/* About dual cards: equal visual height and balanced vertical placement */
@media (min-width: 901px) {
  .about-page .about-dual-grid {
    align-items: stretch !important;
  }

  .about-page .about-how-card,
  .about-page .about-core-card {
    min-height: 390px !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }
}

/* About: make "How I am often brought in" match Core Strengths style */
.about-page .about-how-card h2 {
  text-transform: uppercase !important;
  letter-spacing: .18em !important;
  font-size: .76rem !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  color: var(--subtle) !important;
  text-align: center !important;
  margin: 0 !important;
}

.about-page .about-how-card .gold-divider,
.about-page .about-core-card .gold-divider {
  margin: 1rem auto 1.1rem auto !important;
}

.about-page .about-how-card p {
  text-align: left !important;
}

.about-page .about-core-card {
  text-align: center !important;
}

.about-page .about-core-card .core-strengths-list {
  text-align: left !important;
  max-width: 720px !important;
  margin-top: auto !important;
  margin-bottom: auto !important;
  padding-left: 1.05rem !important;
}

/* About feature panel: centered title/divider, left-aligned body */
.about-page .feature-band h3 {
  text-align: center !important;
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.about-page .feature-band p {
  text-align: left !important;
  width: min(100%, 650px) !important;
  max-width: 650px !important;
  margin: 0 auto !important;
}

/* Mobile: keep statement bodies left aligned and controlled width */
@media (max-width: 900px) {
  .home-page .quote-panel p,
  .home-page .feature-band.centered-feature p,
  .about-page .feature-band p {
    text-align: left !important;
    width: min(100%, 650px) !important;
    max-width: 650px !important;
    margin: 0 auto !important;
  }

  .about-page .about-how-card,
  .about-page .about-core-card {
    min-height: auto !important;
    height: auto !important;
  }
}


/* ===== v23 about accordion + subtle site texture ===== */

/* subtle parchment texture, slightly richer but still restrained */
body{
  background:
    radial-gradient(circle at top left, rgba(255,255,255,.82), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.04)),
    var(--bg) !important;
}
body::before{
  opacity:.032 !important;
  background-image:
    linear-gradient(0deg, transparent 0 23px, rgba(46,46,46,.09) 24px, transparent 25px),
    linear-gradient(90deg, rgba(200,169,106,.018), rgba(200,169,106,0) 28%, rgba(200,169,106,.014) 54%, rgba(200,169,106,0) 78%);
  background-size:100% 26px, 100% 100%;
}

/* about core strengths as grouped accordion */
.about-page .about-core-card{
  position:relative;
  overflow:hidden;
}
.about-page .section-watermark::before{
  content:"";
  position:absolute;
  inset:0;
  background:url('assets/watermark-post.png') center 58%/72% auto no-repeat;
  opacity:.05;
  pointer-events:none;
}
.about-page .core-accordion-card{
  justify-content:center !important;
}
.about-page .core-accordion{
  position:relative;
  z-index:1;
  width:min(100%, 720px);
  margin:auto 0;
}
.about-page .strength-group{
  border-top:1px solid rgba(46,46,46,.08);
}
.about-page .strength-group:first-child{
  border-top:0;
}
.about-page .strength-group summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  cursor:pointer;
  padding:.9rem 0;
  color:var(--text);
}
.about-page .strength-group summary::-webkit-details-marker{
  display:none;
}
.about-page .strength-title{
  font-size:.98rem;
  font-weight:500;
  letter-spacing:0;
  text-transform:none;
  color:var(--text);
}
.about-page .strength-marker{
  font-size:1.1rem;
  line-height:1;
  color:var(--gold-deep);
  min-width:1rem;
  text-align:center;
}
.about-page .strength-group[open] .strength-marker{
  content:"–";
}
.about-page .strength-group[open] .strength-marker::before{
  content:"–";
}
.about-page .strength-group[open] .strength-marker{
  color:var(--gold-deep);
}
.about-page .strength-group[open] summary .strength-marker{
  font-size:1.1rem;
}
.about-page .strength-group summary .strength-marker{
  position:relative;
}
.about-page .strength-group summary .strength-marker{
  color:var(--gold-deep);
}
.about-page .strength-group[open] summary .strength-marker{
  color:var(--gold-deep);
}
.about-page .strength-group[open] summary .strength-marker{
  visibility:hidden;
}
.about-page .strength-group[open] summary .strength-marker::before{
  visibility:visible;
  position:absolute;
  inset:0;
}
.about-page .strength-items{
  margin:0 0 .8rem 0;
  padding:0 0 0 1.05rem;
}
.about-page .strength-items li{
  margin:.35rem 0;
}

/* keep about paired cards aligned and balanced */
@media (min-width:901px){
  .about-page .about-dual-grid{
    align-items:stretch !important;
  }
  .about-page .about-how-card,
  .about-page .about-core-card{
    min-height:410px !important;
  }
}

/* optional small-caps look retained on left heading only if desired elsewhere */
.about-page .about-how-card h2{
  text-transform:uppercase !important;
  letter-spacing:.18em !important;
  font-size:.76rem !important;
  font-weight:500 !important;
  line-height:1.3 !important;
  color:var(--subtle) !important;
  text-align:center !important;
  margin:0 !important;
}

/* ===== v23 redo fixes ===== */

/* Subtle global parchment texture only.  No repeated image background. */
body{
  background:
    radial-gradient(circle at top left, rgba(255,255,255,.78), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.03)),
    var(--bg) !important;
}

body::before{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  pointer-events:none !important;
  z-index:0 !important;
  opacity:.028 !important;
  background-image:
    linear-gradient(0deg, transparent 0 24px, rgba(46,46,46,.075) 25px, transparent 26px),
    linear-gradient(90deg, rgba(200,169,106,.025), rgba(200,169,106,0) 32%, rgba(200,169,106,.018) 66%, rgba(200,169,106,0) 100%);
  background-size:100% 27px, 100% 100% !important;
}

.page-wrap, .site-header, main, footer{
  position:relative;
  z-index:1;
}

/* About page phoenix watermark: present but very faint and contained */
.about-page .section-watermark{
  position:relative;
  overflow:hidden;
}

.about-page .section-watermark::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:url('assets/watermark-post.png') center 58% / 62% auto no-repeat !important;
  opacity:.055 !important;
  z-index:0;
}

.about-page .core-accordion,
.about-page .about-core-card > .small-caps,
.about-page .about-core-card > .gold-divider{
  position:relative;
  z-index:1;
}

/* Accordion: all closed by default, tidy spacing and bullet alignment */
.about-page .core-accordion{
  width:min(100%, 720px);
  margin:auto 0;
}

.about-page .strength-group{
  border-top:1px solid rgba(46,46,46,.08);
  padding:0;
}

.about-page .strength-group:first-child{
  border-top:0;
}

.about-page .strength-group summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  cursor:pointer;
  padding:.88rem 0;
  margin:0 !important;
}

.about-page .strength-group summary::-webkit-details-marker{
  display:none;
}

.about-page .strength-title{
  font-size:.98rem;
  font-weight:500;
  color:var(--text);
}

.about-page .strength-marker{
  position:relative;
  min-width:1rem;
  text-align:center;
  font-size:1.05rem;
  line-height:1;
  color:var(--gold-deep);
}

.about-page .strength-group[open] .strength-marker{
  color:transparent;
}

.about-page .strength-group[open] .strength-marker::before{
  content:"–";
  position:absolute;
  inset:0;
  color:var(--gold-deep);
}

.about-page .strength-group[open] summary{
  padding-bottom:.4rem;
}

.about-page .strength-items{
  margin:.1rem 0 .9rem 0 !important;
  padding:0 0 0 1.25rem !important;
  list-style:disc outside !important;
}

.about-page .strength-items li{
  margin:.32rem 0 !important;
  line-height:1.58 !important;
  padding-left:0 !important;
}

@media (max-width: 900px){
  .about-page .section-watermark::before{
    background-size:74% auto !important;
    opacity:.05 !important;
  }
}


/* ===== v31 proper about/services accordion + about watermark ===== */

/* ABOUT PAGE watermark behind the page content area, not inside cards */
.about-page main{
  position: relative;
  isolation: isolate;
}
.about-page .about-page-watermark{
  position: absolute;
  top: 110px;
  left: 50%;
  transform: translateX(-50%);
  width: min(980px, 88vw);
  height: 1300px;
  pointer-events: none;
  z-index: 0;
  background: url('assets/phoenix-watermark-clean.png') center 120px / 76% auto no-repeat;
  opacity: .12;
}
.about-page main > *:not(.about-page-watermark){
  position: relative;
  z-index: 1;
}
/* Ensure no internal card watermark remains */
.about-page .about-core-card.section-watermark::before{
  content: none !important;
}

/* ABOUT core strengths accordion: clean rows, no browser bullets at all */
.about-page .core-accordion{
  width:min(100%, 720px);
  margin:auto 0;
}
.about-page .strength-group{
  border-top:1px solid rgba(46,46,46,.08);
  padding:0;
}
.about-page .strength-group:first-child{
  border-top:0;
}
.about-page .strength-group summary{
  list-style:none;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  column-gap:1rem;
  cursor:pointer;
  padding:.88rem 0;
  margin:0 !important;
}
.about-page .strength-group summary::-webkit-details-marker{
  display:none;
}
.about-page .strength-title{
  font-size:.98rem;
  font-weight:500;
  color:var(--text);
  line-height:1.35;
  text-align:left;
  margin:0;
}
.about-page .strength-marker{
  position:relative;
  min-width:1rem;
  text-align:center;
  font-size:1.05rem;
  line-height:1;
  color:var(--gold-deep);
}
.about-page .strength-group[open] .strength-marker{
  color:transparent;
}
.about-page .strength-group[open] .strength-marker::before{
  content:"–";
  position:absolute;
  inset:0;
  color:var(--gold-deep);
}
.about-page .strength-group[open] summary{
  padding-bottom:.42rem;
}
.about-page .strength-rows{
  margin:.08rem 0 .92rem 0;
  display:grid;
  row-gap:.34rem;
}
.about-page .strength-row{
  display:block;
  margin:0;
  padding:0;
}
.about-page .strength-copy{
  display:block;
  line-height:1.58;
  color:var(--muted);
  text-align:left;
  margin:0;
  padding:0;
}

/* SERVICES "What you can expect" accordion */
.services-bullets .service-accordion{
  margin-top:.25rem;
}
.services-bullets .service-strength-group{
  border-top:1px solid rgba(46,46,46,.08);
  padding:0;
}
.services-bullets .service-strength-group:first-child{
  border-top:0;
}
.services-bullets .service-strength-group summary{
  list-style:none;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  column-gap:1rem;
  cursor:pointer;
  padding:.88rem 0;
  margin:0 !important;
}
.services-bullets .service-strength-group summary::-webkit-details-marker{
  display:none;
}
.services-bullets .service-strength-title{
  font-size:.98rem;
  font-weight:500;
  color:var(--text);
  line-height:1.35;
}
.services-bullets .service-strength-marker{
  position:relative;
  min-width:1rem;
  text-align:center;
  font-size:1.05rem;
  line-height:1;
  color:var(--gold-deep);
}
.services-bullets .service-strength-group[open] .service-strength-marker{
  color:transparent;
}
.services-bullets .service-strength-group[open] .service-strength-marker::before{
  content:"–";
  position:absolute;
  inset:0;
  color:var(--gold-deep);
}
.services-bullets .service-strength-group[open] summary{
  padding-bottom:.42rem;
}
.services-bullets .service-strength-rows{
  margin:.08rem 0 .92rem 0;
  display:grid;
  row-gap:.34rem;
}
.services-bullets .service-strength-copy{
  display:block;
  line-height:1.58;
  color:var(--muted);
}

/* Mobile: keep watermark softer */
@media (max-width:900px){
  .about-page .about-page-watermark{
    top: 90px;
    width: 96vw;
    height: 1100px;
    background-size: 92% auto;
    background-position: center 90px;
    opacity: .085;
  }
}


/* ===== v35 about phoenix from logo + mobile menu fix ===== */

/* About page watermark: clean logo-derived phoenix behind the page content area */
.about-page main{
  position: relative !important;
  isolation: isolate !important;
}

.about-page .about-page-watermark{
  position: absolute !important;
  top: 90px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: min(980px, 86vw) !important;
  height: 1200px !important;
  pointer-events: none !important;
  z-index: 0 !important;
  background: url('assets/phoenix-watermark-logo.png') center 130px / 78% auto no-repeat !important;
  opacity: 1 !important;
  filter: none !important;
}

.about-page main > *:not(.about-page-watermark){
  position: relative !important;
  z-index: 1 !important;
}

/* Ensure no internal card watermark remains */
.about-page .about-core-card.section-watermark::before{
  content: none !important;
  background: none !important;
}

/* Mobile header/menu: reliable open state and cleaner button */
.header-inner{
  position: relative !important;
}
.nav-toggle{
  cursor: pointer !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  touch-action: manipulation !important;
  line-height: 1 !important;
}

@media (max-width: 760px){
  .nav-toggle{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 46px !important;
    min-width: 92px !important;
    padding: .82rem 1rem !important;
    font-size: 1rem !important;
    border-radius: 999px !important;
    position: relative !important;
    z-index: 120 !important;
  }

  .site-nav{
    display: none !important;
    position: absolute !important;
    top: calc(100% - 4px) !important;
    left: 0 !important;
    right: 0 !important;
    margin-top: .65rem !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    padding: .45rem 0 !important;
    background: rgba(244,239,231,.992) !important;
    border: 1px solid rgba(46,46,46,.08) !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 28px rgba(46,46,46,.12) !important;
    z-index: 119 !important;
  }

  .site-nav.open{
    display: flex !important;
  }

  .site-nav a{
    width: 100% !important;
    padding: .9rem 1rem !important;
  }

  .site-nav a::after{
    display: none !important;
  }

  .site-nav a + a{
    border-top: 1px solid rgba(46,46,46,.06) !important;
  }

  .brand{
    min-width: 0 !important;
  }

  .brand-text strong{
    font-size: clamp(1rem, 5vw, 1.18rem) !important;
  }

  .brand-text span{
    display: none !important;
  }
}

/* Mobile watermark softer */
@media (max-width: 900px){
  .about-page .about-page-watermark{
    top: 78px !important;
    width: 96vw !important;
    height: 950px !important;
    background-size: 95% auto !important;
    background-position: center 80px !important;
    opacity: .78 !important;
  }
}


/* ===== v37 actual mobile menu fix ===== */
/* The menu issue was not just CSS overrides. Phones were likely double-firing touch/click.
   This block simplifies mobile nav styling and uses a wider breakpoint for consistency. */

.header-inner{
  position: relative !important;
}

.nav-toggle{
  cursor: pointer !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  user-select: none !important;
  touch-action: manipulation !important;
}

@media (max-width: 900px){
  .brand{
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }

  .brand-text strong{
    font-size: clamp(1rem, 5vw, 1.16rem) !important;
  }

  .brand-text span{
    display: none !important;
  }

  .nav-toggle{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 92px !important;
    min-height: 46px !important;
    padding: .8rem 1rem !important;
    border-radius: 999px !important;
    position: relative !important;
    z-index: 320 !important;
    border: 1px solid rgba(200,169,106,.76) !important;
    background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.72)) !important;
    color: var(--text) !important;
    line-height: 1 !important;
  }

  .site-nav{
    display: none !important;
    position: absolute !important;
    top: calc(100% - 2px) !important;
    left: 0 !important;
    right: 0 !important;
    margin-top: .55rem !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    padding: .45rem 0 !important;
    background: rgba(244,239,231,.995) !important;
    border: 1px solid rgba(46,46,46,.08) !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 28px rgba(46,46,46,.12) !important;
    z-index: 319 !important;
  }

  .site-nav.open,
  body.menu-open .site-nav{
    display: flex !important;
  }

  .site-nav a{
    width: 100% !important;
    padding: .9rem 1rem !important;
  }

  .site-nav a::after{
    display: none !important;
  }

  .site-nav a + a{
    border-top: 1px solid rgba(46,46,46,.06) !important;
  }
}

@media (min-width: 901px){
  .nav-toggle{
    display: none !important;
  }
  .site-nav{
    display: flex !important;
    position: static !important;
    margin-top: 0 !important;
    box-shadow: none !important;
    border: 0 !important;
    background: transparent !important;
    padding: 0 !important;
  }
}


/* ===== v38 true mobile menu overlay fix ===== */
/* The problem is stacking and positioning.  Make the mobile nav a fixed overlay panel
   under the sticky header so page content cannot sit on top of it or intercept taps. */

.site-header{
  overflow: visible !important;
}

@media (max-width: 900px){
  .site-header{
    z-index: 1000 !important;
  }

  .header-inner{
    position: relative !important;
    z-index: 1001 !important;
  }

  .nav-toggle{
    position: relative !important;
    z-index: 1003 !important;
  }

  .site-nav{
    display: none !important;
    position: fixed !important;
    top: 86px !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-height: calc(100vh - 110px) !important;
    overflow: auto !important;
    margin: 0 !important;
    padding: .45rem 0 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    background: rgba(244,239,231,.998) !important;
    border: 1px solid rgba(46,46,46,.08) !important;
    border-radius: 18px !important;
    box-shadow: 0 16px 34px rgba(46,46,46,.16) !important;
    z-index: 1002 !important;
    pointer-events: auto !important;
  }

  .site-nav.open,
  body.menu-open .site-nav{
    display: flex !important;
  }

  .site-nav a{
    display: block !important;
    width: 100% !important;
    padding: .95rem 1rem !important;
    position: relative !important;
    z-index: 1003 !important;
  }

  .site-nav a + a{
    border-top: 1px solid rgba(46,46,46,.06) !important;
  }

  .site-nav a::after{
    display: none !important;
  }

  /* ensure page content never stacks above open menu */
  body.menu-open main,
  body.menu-open footer{
    position: relative !important;
    z-index: 1 !important;
  }
}


/* ===== v43 Contact image: show full supplied photograph ===== */
.contact-page .contact-shot {
  min-height: 0 !important;
  max-height: none !important;
  height: auto !important;
  aspect-ratio: 746 / 524 !important;
  flex: 0 0 auto !important;
}

.contact-page .contact-shot img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
}
/* v45 Insight article spacing: clear separation after publication date and around lists */
.article-card .article-meta{
  margin-bottom:1.35rem;
}
.article-card .article-body ul,
.article-card .article-body ol{
  margin:1rem 0 1.25rem;
  padding-left:1.35rem;
}
.article-card .article-body ul + p,
.article-card .article-body ol + p{
  margin-top:.25rem;
}


/* ===== Operational Clarity publication ===== */
.oc-page, .oc-archive-page{background:var(--bg)}
.oc-narrow{max-width:880px}
.oc-masthead{position:relative;overflow:hidden;padding:4.8rem 0 4rem;text-align:center;border-bottom:1px solid rgba(200,169,106,.18)}
.oc-masthead::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 20%,rgba(255,255,255,.72),transparent 56%);pointer-events:none}
.oc-masthead .container{position:relative;z-index:1}
.oc-mark{width:76px;height:76px;object-fit:contain;margin:0 auto 1.15rem;opacity:.82}
.oc-edition{font-size:.78rem;letter-spacing:.12em;color:var(--subtle);margin-bottom:.7rem}
.oc-edition span{color:var(--gold);padding:0 .35rem}
.oc-masthead h1{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-weight:400;font-size:clamp(2.35rem,5vw,4.2rem);line-height:1.08;letter-spacing:-.02em;margin-bottom:.9rem}
.oc-masthead .gold-divider{margin:.9rem auto 1.1rem}
.oc-strapline{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);font-size:clamp(1rem,1.8vw,1.18rem);line-height:1.6;max-width:720px;margin:0 auto}
.oc-archive-link{display:inline-block;margin-top:1rem;color:var(--subtle);font-size:.88rem;border-bottom:1px solid rgba(200,169,106,.65)}
.oc-section{padding:4.5rem 0}
.oc-section + .oc-section{border-top:1px solid rgba(46,46,46,.05)}
.oc-label{font-size:.78rem;letter-spacing:.13em;color:var(--gold-deep);font-weight:600;margin-bottom:1rem}
.oc-opening p,.oc-feature p,.oc-radar p,.oc-closing p,.oc-pattern p{font-size:1.01rem;line-height:1.86}
.oc-feature h2,.oc-radar h2,.oc-pattern h2{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-weight:600;letter-spacing:-.01em;color:var(--text);line-height:1.2}
.oc-feature h2,.oc-radar h2{font-size:clamp(1.8rem,3vw,2.55rem);margin-bottom:.8rem}
body.oc-page .oc-feature h3,body.oc-page .oc-radar h3{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif!important;font-weight:600!important;letter-spacing:-.01em!important;font-size:1.18rem;line-height:1.35;margin:2.3rem 0 .85rem;color:var(--text)}
.oc-feature .title-divider,.oc-radar .title-divider{margin:.8rem 0 2rem}
.oc-pullquote{margin:3rem 0;padding:2rem 1.5rem;text-align:center;border-top:1px solid rgba(200,169,106,.55);border-bottom:1px solid rgba(200,169,106,.55)}
.oc-pullquote p{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-size:clamp(1.35rem,2.6vw,1.9rem);line-height:1.45;color:var(--text);margin:0}
.oc-pattern{padding:3.6rem 0;background:linear-gradient(180deg,rgba(255,255,255,.58),rgba(255,255,255,.24));border-top:1px solid rgba(200,169,106,.2);border-bottom:1px solid rgba(200,169,106,.2)}
.oc-pattern-inner{max-width:880px;position:relative}
.oc-pattern-inner>img{position:absolute;width:150px;right:-40px;top:50%;transform:translateY(-50%);opacity:.055;pointer-events:none}
.oc-pattern h2{font-size:clamp(1.55rem,2.6vw,2.15rem);margin-bottom:1.35rem}
.oc-source-note{margin:1.7rem 0 2rem;padding:1rem 1.15rem;border-left:2px solid var(--gold);background:rgba(200,169,106,.07);font-size:.9rem!important;line-height:1.65!important;color:var(--subtle)}
.oc-source-note a{text-decoration:underline;text-decoration-color:rgba(184,140,62,.55);text-underline-offset:3px}
.oc-questions{padding:4.4rem 0;background:rgba(255,255,255,.2);border-top:1px solid rgba(46,46,46,.05);border-bottom:1px solid rgba(46,46,46,.05)}
.oc-questions .gold-divider.left{margin:1rem 0 2rem}
.oc-question{display:grid;grid-template-columns:46px 1fr;gap:1.15rem;padding:1.35rem 0;border-top:1px solid rgba(46,46,46,.07);align-items:start}
.oc-question:last-child{border-bottom:1px solid rgba(46,46,46,.07)}
.oc-question span{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--gold-deep);font-weight:500;font-size:.9rem;padding-top:.25rem}
.oc-question p{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);font-weight:400;font-size:clamp(1.05rem,1.8vw,1.25rem);line-height:1.6;margin:0}
.oc-closing{padding-bottom:4.8rem}
.oc-more{margin-top:2.2rem!important;padding-top:1.5rem;border-top:1px solid rgba(200,169,106,.35)}
.oc-more .text-link{display:inline-flex}
.oc-cta{border-top:1px solid rgba(200,169,106,.2);background:rgba(255,255,255,.15)}
.oc-archive-head{padding-bottom:3.5rem}
.oc-intro{max-width:760px;margin:1.35rem auto 0;color:var(--muted)}
.oc-archive-list{max-width:940px}
.oc-edition-card{display:flex;justify-content:space-between;gap:2rem;align-items:flex-end;padding:2rem;border:1px solid rgba(200,169,106,.26);border-radius:26px;background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.46));box-shadow:var(--shadow)}
.oc-edition-card>div:first-child{max-width:720px}
.oc-edition-card h2{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-weight:400;font-size:clamp(1.45rem,2vw,1.8rem);line-height:1.35;margin-bottom:.8rem}
.oc-edition-card p{margin-bottom:0}
.oc-insights-callout{padding-bottom:0}
.oc-callout-links{display:flex;gap:1.4rem;flex-wrap:wrap}
.oc-home-feature{padding:3.8rem 0}
.oc-home-inner{position:relative;overflow:hidden;display:grid;grid-template-columns:150px 1fr;gap:2rem;align-items:center;padding:2rem;border:1px solid rgba(200,169,106,.24);border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.76),rgba(255,255,255,.44));box-shadow:var(--shadow)}
.oc-home-inner>img{width:130px;opacity:.12}
.oc-home-inner h2{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-weight:400;font-size:clamp(1.7rem,2.5vw,2.2rem);line-height:1.25;margin-bottom:.7rem}
.oc-home-inner .gold-divider.left{margin:.8rem 0 1rem}

@media (max-width:900px){
  .oc-home-inner{grid-template-columns:1fr}
  .oc-home-inner>img{position:absolute;width:170px;right:1rem;opacity:.055}
  .oc-pattern-inner>img{width:135px;right:0;opacity:.045}
  .oc-edition-card{align-items:flex-start;flex-direction:column}
}
@media (max-width:760px){
  .oc-masthead{padding:3.5rem 0 3rem}
  .oc-mark{width:62px;height:62px}
  .oc-section,.oc-questions{padding:3.2rem 0}
  .oc-opening p,.oc-feature p,.oc-radar p,.oc-closing p,.oc-pattern p{font-size:.98rem;line-height:1.78}
  .oc-pullquote{margin:2.2rem 0;padding:1.5rem .8rem}
  .oc-pattern{padding:2.8rem 0}
  .oc-question{grid-template-columns:34px 1fr;gap:.8rem}
  .oc-edition-card,.oc-home-inner{padding:1.35rem}
  .oc-home-feature{padding:3rem 0}
}


/* ===== v49 Operational Clarity hard-coded typography correction ===== */
body.oc-page main .oc-feature h2,
body.oc-page main .oc-radar h2,
body.oc-page main .oc-pattern h2,
body.oc-page main .oc-feature h3,
body.oc-page main .oc-radar h3 {
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
}
body.oc-page main .oc-question p {
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}
body.oc-page main .oc-question span {
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  font-weight: 500 !important;
}

/* ===== v50 Operational Clarity typography normalization =====
   Operational Clarity uses the same Inter heading/subheading system as the core SWG site.
   This block is intentionally last so older publication-specific serif rules cannot override it. */
body.oc-page .oc-masthead h1,
body.oc-archive-page .oc-masthead h1,
body.oc-page .oc-strapline,
body.oc-archive-page .oc-strapline,
body.oc-page main h2,
body.oc-page main h3,
body.oc-archive-page main h2,
body.oc-archive-page main h3,
body.oc-page .oc-pullquote p,
body.oc-archive-page .oc-edition-card h2,
body .oc-insights-callout .oc-edition-card h2 {
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
}
body.oc-page .oc-masthead h1,
body.oc-archive-page .oc-masthead h1,
body.oc-page main h2,
body.oc-archive-page main h2,
body .oc-insights-callout .oc-edition-card h2 {
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
}
body.oc-page .oc-strapline,
body.oc-archive-page .oc-strapline,
body.oc-page .oc-pullquote p,
body.oc-archive-page .oc-edition-card h2 {
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}
body.oc-page main h3,
body.oc-archive-page main h3 {
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
}

/* ===== v51 Operational Clarity navigation, PDF and quote refinements ===== */
.oc-masthead-actions{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:1rem;
  flex-wrap:wrap;
  margin-top:1.15rem;
}
.oc-masthead-actions .oc-archive-link{margin-top:0}
.oc-pdf-button{
  min-height:40px;
  padding:.58rem 1rem;
  font-size:.86rem;
  box-shadow:none;
}
.oc-quote-line{display:block}

/* Wide-screen issue index.  Kept outside the article column so reading width is unchanged. */
.oc-side-nav{
  position:fixed;
  z-index:30;
  top:132px;
  left:calc(50% - 640px);
  width:170px;
  padding:.9rem 0;
  color:var(--subtle);
}
.oc-side-nav-title{
  color:var(--gold-deep);
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.13em;
  text-transform:uppercase;
  padding-bottom:.65rem;
  margin-bottom:.45rem;
  border-bottom:1px solid rgba(200,169,106,.38);
}
.oc-side-nav nav{display:flex;flex-direction:column;gap:.14rem}
.oc-side-nav a{
  position:relative;
  display:block;
  padding:.48rem .4rem .48rem .72rem;
  font-size:.82rem;
  line-height:1.35;
  border-left:1px solid rgba(46,46,46,.10);
  transition:color .18s ease,border-color .18s ease,background .18s ease;
}
.oc-side-nav a:hover,
.oc-side-nav a:focus{
  color:var(--text);
  border-left-color:var(--gold-deep);
  background:rgba(255,255,255,.26);
}
.oc-mobile-jump{display:none}
.oc-section[id],.oc-questions[id],.oc-pattern[id]{scroll-margin-top:96px}

@media (max-width:1199px){
  .oc-side-nav{display:none}
  .oc-mobile-jump{
    display:block;
    position:sticky;
    top:72px;
    z-index:45;
    width:min(calc(100% - 1.35rem),880px);
    margin:.75rem auto 0;
    border:1px solid rgba(200,169,106,.28);
    border-radius:16px;
    background:rgba(244,239,231,.96);
    box-shadow:0 8px 18px rgba(46,46,46,.05);
    backdrop-filter:blur(12px);
  }
  .oc-mobile-jump summary{
    cursor:pointer;
    list-style:none;
    padding:.72rem 1rem;
    color:var(--text);
    font-weight:600;
    font-size:.88rem;
  }
  .oc-mobile-jump summary::-webkit-details-marker{display:none}
  .oc-mobile-jump summary::after{content:"+";float:right;color:var(--gold-deep);font-weight:500}
  .oc-mobile-jump[open] summary::after{content:"–"}
  .oc-mobile-jump nav{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.1rem .8rem;
    padding:0 1rem .85rem;
    border-top:1px solid rgba(46,46,46,.06);
  }
  .oc-mobile-jump nav a{padding:.52rem 0;font-size:.82rem;color:var(--subtle)}
}
@media (max-width:520px){
  .oc-mobile-jump nav{grid-template-columns:1fr}
  .oc-masthead-actions{flex-direction:column;align-items:center}
}

.oc-print-footer{display:none}

@media print{
  @page{size:A4;margin:15mm 15mm 17mm}
  html,body{background:#fff!important}
  body::before,.site-header,.oc-side-nav,.oc-mobile-jump,.oc-masthead-actions,.oc-cta,.site-footer{display:none!important}
  .oc-page main{display:block!important}
  .oc-masthead{padding:14mm 0 10mm!important;border-bottom:1px solid rgba(200,169,106,.35)!important;break-after:avoid-page}
  .oc-masthead::after{display:none!important}
  .oc-mark{width:50px!important;height:50px!important;margin-bottom:8px!important}
  .oc-masthead h1{font-size:30pt!important;margin-bottom:6px!important}
  .oc-strapline{font-size:11pt!important;line-height:1.45!important}
  .oc-edition{font-size:8pt!important}
  .oc-section,.oc-questions,.oc-pattern{padding:9mm 0!important;background:#fff!important;border-top:0!important;border-bottom:0!important;break-inside:auto}
  .oc-narrow,.oc-pattern-inner{max-width:none!important;width:100%!important}
  .oc-opening p,.oc-feature p,.oc-radar p,.oc-closing p,.oc-pattern p{font-size:9.6pt!important;line-height:1.58!important;margin-bottom:8pt!important}
  .oc-label{font-size:7.8pt!important;margin-bottom:6pt!important}
  .oc-feature h2,.oc-radar h2,.oc-pattern h2{font-size:18pt!important;line-height:1.2!important;break-after:avoid-page}
  body.oc-page .oc-feature h3,body.oc-page .oc-radar h3{font-size:11.5pt!important;margin:14pt 0 6pt!important;break-after:avoid-page}
  .oc-pullquote{margin:16pt 0!important;padding:12pt 8pt!important;break-inside:avoid}
  .oc-pullquote p{font-size:15pt!important;line-height:1.35!important}
  .oc-pattern-inner>img{display:none!important}
  .oc-source-note{font-size:8.3pt!important;line-height:1.45!important;break-inside:avoid}
  .oc-question{grid-template-columns:26px 1fr!important;gap:8pt!important;padding:9pt 0!important;break-inside:avoid}
  .oc-question p{font-size:10.5pt!important;line-height:1.45!important}
  .oc-question span{font-size:8pt!important}
  a{color:inherit!important;text-decoration:none!important}
  .oc-more{margin-top:14pt!important;padding-top:10pt!important}
  .oc-print-footer{display:block!important;margin-top:10mm;padding-top:4mm;border-top:1px solid rgba(200,169,106,.35);font-size:7.5pt;color:#6B655E;text-align:center}
}

/* Rising Through Fire */
.book-page{--book-ink:#27231f;--book-gold:#b7772d;--book-cream:#f3e6d1}
.book-hero{padding:4rem 0 3.4rem;background:radial-gradient(circle at 24% 28%,rgba(200,169,106,.18),transparent 34%),linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,.04))}
.book-hero-grid{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);gap:4rem;align-items:center}
.book-cover-stage{display:flex;justify-content:center;position:relative;padding:1.1rem}
.book-cover-stage:before{content:"";position:absolute;inset:10% 5%;background:radial-gradient(circle,rgba(183,119,45,.18),transparent 68%);filter:blur(12px)}
.book-cover{position:relative;width:min(100%,330px);border-radius:3px;box-shadow:0 30px 55px rgba(46,46,46,.22),-12px 10px 22px rgba(46,46,46,.08);transform:perspective(900px) rotateY(3deg)}
.book-hero-copy h1{font-family:"Libre Baskerville",Georgia,serif;font-size:clamp(2.7rem,5vw,4.7rem);line-height:1.02;letter-spacing:-.035em;margin-bottom:.35rem;color:var(--book-ink)}
.book-subtitle{font-family:"Libre Baskerville",Georgia,serif;font-size:clamp(1.35rem,2.4vw,2rem);color:var(--book-gold);margin-bottom:1.2rem}
.book-lead{font-size:1.14rem;color:var(--text);max-width:680px}
.book-purchase-card{margin-top:1.5rem;padding:1.35rem 1.4rem;border:1px solid rgba(183,119,45,.28);border-radius:24px;background:rgba(255,255,255,.68);box-shadow:var(--shadow);max-width:690px}
.book-purchase-card>div{display:flex;align-items:baseline;gap:.7rem;flex-wrap:wrap;margin-bottom:.55rem}.book-purchase-card strong{font-size:1.85rem;margin:0;color:var(--book-ink)}.purchase-label{font-weight:600;color:var(--book-ink)}.book-purchase-card p{margin-bottom:.85rem}.book-purchase-card small{display:block;margin-top:.7rem;color:var(--subtle)}
.book-buy-disabled{opacity:.7;cursor:default;pointer-events:none}
.book-assurance{border-top:1px solid rgba(46,46,46,.05);border-bottom:1px solid rgba(46,46,46,.05);background:rgba(255,255,255,.22)}
.assurance-grid{display:grid;grid-template-columns:repeat(4,1fr)}.assurance-grid>div{padding:1.3rem 1rem;text-align:center;border-right:1px solid rgba(46,46,46,.06)}.assurance-grid>div:last-child{border-right:0}.assurance-grid strong,.assurance-grid span{display:block}.assurance-grid strong{margin:0 0 .15rem;color:var(--book-ink)}.assurance-grid span{font-size:.84rem;color:var(--subtle)}
.book-story-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(300px,.72fr);gap:3.2rem;align-items:center}.book-story-grid h2,.book-business-bridge h2,.book-final-cta h2{font-family:"Libre Baskerville",Georgia,serif;color:var(--book-ink)}
.book-reading-photo{margin:0}.book-reading-photo img{border-radius:28px;box-shadow:var(--shadow);border:1px solid rgba(183,119,45,.2)}.book-reading-photo figcaption{font-size:.8rem;color:var(--subtle);margin-top:.6rem;text-align:center}
.book-reflection{max-width:880px;margin:0 auto;text-align:left;font-size:1.04rem}
.review-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.review-grid blockquote{margin:0;padding:1.35rem;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.84),rgba(255,255,255,.54));border:1px solid rgba(183,119,45,.16);box-shadow:0 12px 28px rgba(46,46,46,.06)}.review-grid blockquote p{font-family:"Libre Baskerville",Georgia,serif;color:var(--book-ink);font-size:1rem;line-height:1.55}.review-grid cite{font-style:normal;font-size:.78rem;color:var(--subtle)}.stars{color:var(--book-gold);letter-spacing:.08em;margin-bottom:.6rem}
.book-business-bridge{position:relative;display:grid;grid-template-columns:180px minmax(0,760px);justify-content:center;gap:2.2rem;align-items:center}.book-business-bridge>img{width:180px;opacity:.22}.book-business-bridge p:last-child{margin-bottom:0}
.book-final-cta{text-align:center;padding:4rem 0}.book-final-cta p{max-width:760px;margin:0 auto}.centered-buttons{justify-content:center}
.book-home-feature{border-top:1px solid rgba(46,46,46,.04)}.book-home-inner{display:grid;grid-template-columns:160px minmax(0,720px);justify-content:center;gap:2.2rem;align-items:center}.book-home-inner>img{width:150px;box-shadow:0 18px 35px rgba(46,46,46,.16);border-radius:2px}.book-home-inner h2{font-family:"Libre Baskerville",Georgia,serif}
@media(max-width:900px){.book-hero-grid,.book-story-grid{grid-template-columns:1fr;gap:2.2rem}.book-cover{width:min(70vw,300px)}.book-hero-copy{text-align:center}.book-hero-copy .gold-divider.left{margin-left:auto;margin-right:auto}.book-purchase-card{margin-left:auto;margin-right:auto}.book-hero-copy .button-row{justify-content:center}.assurance-grid{grid-template-columns:repeat(2,1fr)}.assurance-grid>div:nth-child(2){border-right:0}.assurance-grid>div:nth-child(-n+2){border-bottom:1px solid rgba(46,46,46,.06)}.review-grid{grid-template-columns:repeat(2,1fr)}.book-business-bridge{grid-template-columns:120px 1fr}.book-business-bridge>img{width:120px}}
@media(max-width:620px){.book-hero{padding:2.6rem 0}.assurance-grid,.review-grid{grid-template-columns:1fr}.assurance-grid>div{border-right:0;border-bottom:1px solid rgba(46,46,46,.06)}.assurance-grid>div:last-child{border-bottom:0}.book-business-bridge,.book-home-inner{grid-template-columns:1fr;text-align:center}.book-business-bridge>img,.book-home-inner>img{margin:0 auto}.book-business-bridge .gold-divider.left,.book-home-inner .gold-divider.left{margin-left:auto;margin-right:auto}.book-purchase-card>div{justify-content:center}}

/* ===== v48 global header refinement ===== */
.site-header{background:rgba(255,255,255,.97)!important;border-bottom:1px solid rgba(200,169,106,.28)!important;box-shadow:0 1px 0 rgba(46,46,46,.02)!important}
.header-inner{min-height:82px!important}
.brand{gap:1rem!important;text-decoration:none!important}
.brand img{width:50px!important;height:50px!important}
.brand-text strong{font-family:Georgia,'Times New Roman',serif!important;font-size:1.28rem!important;font-weight:600!important;letter-spacing:.015em!important;color:#171717!important}
.brand-text span{font-family:Arial,sans-serif!important;font-size:.62rem!important;letter-spacing:.16em!important;text-transform:uppercase!important;color:#7b6d5a!important}
.site-nav{gap:1.45rem!important;font-family:Georgia,'Times New Roman',serif!important;font-size:.98rem!important}
.site-nav a{color:#3f3a34!important;padding:.45rem 0!important}
.site-nav a::after{height:1px!important;background:#a97822!important}
.site-nav a:hover,.site-nav a.active{color:#8c5d13!important}
@media(max-width:900px){.header-inner{min-height:72px!important}.brand img{width:44px!important;height:44px!important}.brand-text strong{font-size:1.12rem!important}}

/* ===== v52 targeted My Book refinements ===== */
/* Desktop hero title: deliberately smaller for a calmer editorial hierarchy. */
@media (min-width:701px){
  .rtf-title{font-size:clamp(2.95rem,4.25vw,4.55rem);line-height:.95;letter-spacing:-.04em}
}

/* Book artwork: transparent silhouette rather than a rectangular image panel. */
.rtf-book-stage{background:transparent!important;overflow:visible}
.rtf-book-mockup{width:min(330px,100%);mix-blend-mode:normal!important;filter:drop-shadow(18px 22px 18px rgba(46,46,46,.18))}

/* Desktop only: tighten the About/photo/quote band vertically. */
@media (min-width:1001px){
  .rtf-about{align-items:stretch}
  .rtf-about-copy{padding-top:1.75rem;padding-bottom:1.75rem}
  .rtf-photo{min-height:0;height:410px}
  .rtf-sidequote{padding-top:2rem;padding-bottom:2rem}
}

/* Mobile only: keep review format and Amazon action on separate lines. */
@media (max-width:700px){
  .rtf-review-actions{display:flex!important;flex-direction:column;align-items:flex-start;gap:.55rem}
  .rtf-review-actions span,.rtf-review-actions a{display:block!important;width:auto;max-width:100%;margin:0!important}
}

/* ===== v60 site-wide typography =====
   Retains every existing size and colour while applying the BBC News type system. */
html,body,button,input,select,textarea,
body *{font-family:'ReithSans',Helvetica,Arial,freesans,sans-serif!important}
h1,h2,h3,
.hero-copy h1,.page-hero.compact h1,.section-heading h2,.quote,
.feature-band h3,.cta h2,.about .section-title,section.alt .section-title,
.section-title,.rtf-title,.rtf-subtitle,.rtf-deck,.rtf-section-title,
.rtf-quote blockquote,.rtf-sidequote,.rtf-review-card h3,
.rtf-banner-copy blockquote{font-family:'ReithSerif',Georgia,serif!important}

/* Preserve authored italics using the matching BBC italic faces. */
em,i,cite,blockquote{font-style:italic}

/* ===== v60 My Book desktop refinements ===== */
@media (min-width:1001px){
  /* Remove the disproportionate blank band before the closing quotation. */
  .rtf-lower{align-items:start!important}
  .rtf-reviews,.rtf-available{padding-top:2rem!important;padding-bottom:1.45rem!important}
  .rtf-review-carousel{padding-bottom:0!important}
  .rtf-banner-image{margin-top:0!important}

  /* Match the locked mock-up's complete book edges and softer integrated finish. */
  .rtf-book-mockup{width:min(330px,100%)!important;mix-blend-mode:multiply!important;filter:drop-shadow(8px 13px 10px rgba(53,37,15,.14))!important}

  /* Use only the recognisable lower-right foliage from the locked composition. */
  .rtf-hero:before{right:-34px!important;bottom:-40px!important;width:285px!important;height:360px!important;background:url('assets/rtf-hero-foliage-v60.png') right bottom/contain no-repeat!important;opacity:.92!important;filter:blur(2.1px)!important;transform:rotate(-2deg)!important;mix-blend-mode:multiply!important}
}

/* ===== v62 complete BBC typography map =====
   This block deliberately matches the specificity of every older component
   rule so no legacy Inter, Georgia or Libre Baskerville declaration survives. */
html,body,button,input,select,textarea,
body *{
  font-family:'ReithSans',Helvetica,Arial,freesans,sans-serif!important;
  font-feature-settings:'ss01' off;
}

body h1,body h2,body h3,body h4,body h5,body h6,
body .quote,
body .home-page .quote-panel .quote,
body.home-page .quote-panel .quote,
body.home-page .feature-band.centered-feature h3,
body .oc-home-inner h2,
body .oc-insights-callout .oc-edition-card h2,
body.oc-archive-page .oc-masthead h1,
body.oc-archive-page .oc-edition-card h2,
body.oc-page .oc-masthead h1,
body.oc-page main h2,
body.oc-page main h3,
body.oc-page main .oc-feature h2,
body.oc-page main .oc-feature h3,
body.oc-page main .oc-radar h2,
body.oc-page main .oc-radar h3,
body.oc-page main .oc-pattern h2,
body.oc-page .oc-pullquote p,
body .rtf-title,body .rtf-subtitle,body .rtf-deck,
body .rtf-section-title,body .rtf-quote blockquote,
body .rtf-sidequote,body .rtf-review-card h3,
body .rtf-banner-copy blockquote{
  font-family:'ReithSerif',Georgia,serif!important;
  font-feature-settings:'ss01' off;
}

/* Replace every former small-cap/uppercase component with the BBC-style
   sentence-case Sans treatment, while retaining its existing size and colour. */
body .small-caps,
body .kicker,
body .oc-label,
body .oc-edition,
body .oc-side-nav-title,
body .rtf-kicker{
  font-family:'ReithSans',Helvetica,Arial,freesans,sans-serif!important;
  text-transform:none!important;
  letter-spacing:0!important;
  font-weight:500!important;
  font-style:normal!important;
}

body .brand-text strong,
body .brand-text span,
body .site-nav,
body .site-nav a,
body.oc-page .oc-strapline,
body.oc-archive-page .oc-strapline,
body.oc-page main .oc-question p,
body.oc-page main .oc-question span,
body.oc-page .oc-side-nav,
body.oc-page .oc-masthead-actions,
body.oc-archive-page .oc-edition-card p,
body .oc-insights-callout .oc-edition-card p{
  font-family:'ReithSans',Helvetica,Arial,freesans,sans-serif!important;
  font-feature-settings:'ss01' off;
}

/* Preserve true authored emphasis. */
body em,body i,body cite,body blockquote{font-style:italic}

/* Bring the My Book charcoal heading hierarchy into line with the core pages. */
body.rtf .rtf-title{
  font-size:clamp(1.9rem,2.15vw,2.05rem)!important;
  line-height:1.1!important;
  letter-spacing:-.01em!important;
}
body.rtf .rtf-section-title{
  font-size:clamp(1.72rem,1.9vw,1.84rem)!important;
  line-height:1.16!important;
  letter-spacing:-.01em!important;
}

/* Use the complete transparent hardback artwork, with only a natural shadow. */
body.rtf .rtf-book-mockup{
  background:transparent!important;
  mix-blend-mode:normal!important;
  filter:drop-shadow(8px 13px 10px rgba(53,37,15,.14))!important;
}
@media (min-width:1001px){
  body.rtf .rtf-book-mockup{mix-blend-mode:normal!important}
}

/* ===== v63 final consistency refinements ===== */
/* Match the readable v59 label scale everywhere while using sentence case. */
body .small-caps,
body .kicker,
body .oc-label,
body .oc-edition,
body .oc-side-nav-title,
body .rtf-kicker,
body.about-page .about-how-card h2{
  font-family:'ReithSans',Helvetica,Arial,freesans,sans-serif!important;
  font-size:.76rem!important;
  line-height:1.3!important;
  text-transform:none!important;
  letter-spacing:0!important;
  font-weight:500!important;
}

/* The publication card title follows the same heading face and weight as the
   other principal headings on the Home and Insights pages. */
body.home-page .oc-home-inner h2,
body .oc-home-inner h2,
body .oc-insights-callout .oc-edition-card h2{
  font-family:'ReithSerif',Georgia,serif!important;
  font-size:clamp(1.72rem,1.9vw,1.84rem)!important;
  line-height:1.16!important;
  font-weight:600!important;
  letter-spacing:-.01em!important;
}

/* My Book closing slogan uses the same editorial serif as the rest of the page. */
body.rtf .rtf-banner-copy blockquote{
  font-family:'ReithSerif',Georgia,serif!important;
  font-style:italic!important;
  font-weight:400!important;
}

/* Keep the updated legal pages compact and easy to scan. */
body.policy-page .article-body h2{
  font-size:1.12rem!important;
  line-height:1.3!important;
  margin:1.55rem 0 .55rem!important;
}
body.policy-page .article-body h2:first-child{margin-top:0!important}

/* ===== v64 targeted typography and My Book hero refinements ===== */
/* Use one editorial heading treatment throughout the publication archive. */
body.oc-archive-page .oc-masthead h1,
body.oc-archive-page .oc-edition-card h2,
body.oc-archive-page .cta h2{
  font-family:'ReithSerif',Georgia,serif!important;
  font-style:normal!important;
  font-weight:600!important;
  letter-spacing:-.01em!important;
}

/* Publication pull quotes and questions follow the agreed BBC-style serif. */
body.oc-page .oc-pullquote p,
body.oc-page main .oc-question p{
  font-family:'ReithSerif',Georgia,serif!important;
  font-style:normal!important;
  font-weight:600!important;
  letter-spacing:-.01em!important;
}

/* These two navigational labels need greater prominence on the issue page. */
body.oc-page .oc-side-nav-title,
body.oc-page .oc-questions .oc-label,
body.oc-page .oc-closing .oc-label{
  font-size:.92rem!important;
  line-height:1.35!important;
}

/* The closing memoir slogan is a heading, not an italic quotation treatment. */
body.rtf .rtf-banner-copy blockquote{
  font-family:'ReithSerif',Georgia,serif!important;
  font-style:normal!important;
  font-weight:600!important;
  letter-spacing:-.01em!important;
  font-size:clamp(1.62rem,1.9vw,1.84rem)!important;
}

/* Make links identifiable without relying on colour, then echo the footer's
   gold interaction colour on hover and keyboard focus. */
body.policy-page .article-body a{
  color:var(--text)!important;
  text-decoration:underline!important;
  text-decoration-color:rgba(140,93,19,.55)!important;
  text-underline-offset:3px!important;
  transition:color .18s ease,text-decoration-color .18s ease!important;
}
body.policy-page .article-body a:hover,
body.policy-page .article-body a:focus-visible{
  color:#8c5d13!important;
  text-decoration-color:#8c5d13!important;
}

/* Restore clear hierarchy beneath the now-correct memoir title. */
body.rtf .rtf-subtitle{
  font-size:clamp(1.32rem,1.55vw,1.58rem)!important;
  line-height:1.15!important;
}
body.rtf .rtf-deck{
  font-size:clamp(1.08rem,1.25vw,1.22rem)!important;
  line-height:1.28!important;
}

@media (min-width:1001px){
  /* The transparent artwork already contains its own natural grounding. */
  body.rtf .rtf-book-mockup{
    width:min(330px,100%)!important;
    clip-path:none!important;
    filter:drop-shadow(5px 9px 8px rgba(53,37,15,.12))!important;
    mix-blend-mode:multiply!important;
  }

  /* Clean foliage only: the previous crop contained duplicate theme text. */
  body.rtf .rtf-hero:before{
    right:-34px!important;
    bottom:-66px!important;
    width:255px!important;
    height:405px!important;
    background:url('assets/rtf-hero-foliage-transparent.png') right bottom/contain no-repeat!important;
    opacity:.90!important;
    filter:blur(1.5px)!important;
    transform:rotate(-2deg)!important;
    mix-blend-mode:multiply!important;
  }
}

/* ===== v70 clean-alpha foliage asset ===== */
@media (min-width:1001px){
  body.rtf .rtf-hero:before{
    background-color:transparent!important;
    background-image:url('assets/rtf-hero-foliage-v70.png')!important;
    background-position:right bottom!important;
    background-size:contain!important;
    background-repeat:no-repeat!important;
    opacity:.76!important;
    filter:none!important;
    transform:none!important;
    mix-blend-mode:normal!important;
  }
}

/* ===== v67 final hierarchy and artwork corrections ===== */
body .small-caps,
body .kicker,
body .oc-label,
body .oc-edition,
body .oc-side-nav-title,
body .rtf-kicker,
body.about-page .about-how-card h2{
  font-size:.92rem!important;
  line-height:1.35!important;
}

body.oc-page .oc-masthead h1{
  font-size:clamp(2rem,3vw,2.55rem)!important;
  line-height:1.12!important;
}
body.oc-page main .oc-feature h2,
body.oc-page main .oc-radar h2,
body.oc-page main .oc-pattern h2{
  font-size:clamp(1.62rem,2vw,1.84rem)!important;
  line-height:1.2!important;
}

body.oc-page main .oc-pullquote p,
body.oc-page main .oc-pullquote p span{
  font-family:'ReithSerif',Georgia,serif!important;
  font-style:normal!important;
  font-weight:600!important;
  font-feature-settings:'ss01' off!important;
  letter-spacing:-.01em!important;
}

body.oc-page main .oc-question p{
  font-size:clamp(1rem,1.25vw,1.12rem)!important;
  line-height:1.55!important;
  font-weight:500!important;
}

@media (min-width:1001px){
  body.rtf .rtf-title{white-space:nowrap!important}
  body.rtf .rtf-book-stage{
    background:radial-gradient(ellipse at 52% 82%,rgba(104,82,52,.10) 0,rgba(104,82,52,.04) 34%,transparent 68%)!important;
  }
  body.rtf .rtf-book-mockup{
    mix-blend-mode:multiply!important;
    filter:drop-shadow(6px 10px 9px rgba(53,37,15,.12))!important;
    -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 95%,rgba(0,0,0,.82) 98%,transparent 100%)!important;
    mask-image:linear-gradient(to bottom,#000 0%,#000 95%,rgba(0,0,0,.82) 98%,transparent 100%)!important;
  }
  body.rtf .rtf-hero:before{
    right:-48px!important;
    bottom:-104px!important;
    width:290px!important;
    height:455px!important;
    opacity:.96!important;
    filter:blur(1.7px) saturate(1.18) contrast(1.14)!important;
    transform:rotate(-4deg)!important;
  }
}

/* ===== v68 archive scale and final Firefox-safe memoir artwork ===== */
body.oc-archive-page .oc-masthead h1{
  font-size:clamp(2rem,3vw,2.55rem)!important;
  line-height:1.12!important;
}

@media (min-width:1001px){
  body.rtf .rtf-book-stage{background:transparent!important}
  body.rtf .rtf-book-mockup{
    mix-blend-mode:normal!important;
    filter:none!important;
    clip-path:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }
  body.rtf .rtf-hero:before{
    right:-24px!important;
    bottom:-34px!important;
    width:285px!important;
    height:340px!important;
    background:url('assets/rtf-hero-foliage-v68.png') right bottom/contain no-repeat!important;
    opacity:.82!important;
    filter:blur(.8px)!important;
    transform:none!important;
    mix-blend-mode:multiply!important;
  }
}

/* ===== v72 definitive hero foliage rule =====
   This must remain after all legacy My Book rules.  The earlier v68 rule had
   equal specificity and appeared later than v70, so it was still winning in
   the deployed page. */
@media (min-width:1001px){
  body.rtf .rtf-hero:before{
    content:""!important;
    position:absolute!important;
    right:-8px!important;
    bottom:-42px!important;
    width:410px!important;
    height:490px!important;
    z-index:0!important;
    background-color:transparent!important;
    background-image:url('assets/rtf-hero-foliage-v70.png')!important;
    background-position:right bottom!important;
    background-size:contain!important;
    background-repeat:no-repeat!important;
    opacity:.76!important;
    filter:none!important;
    transform:none!important;
    mix-blend-mode:normal!important;
    pointer-events:none!important;
  }
}