:root{
  --brand-blue: #002b4f;
  --brand-gold: #eeb22d;
  --text: #111111;
  --bg: #ffffff;
  --muted: #F5F7FA;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, "Helvetica Neue", Ubuntu, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img{max-width:100%;height:auto;display:block}

.site-header{
  background: var(--brand-blue);
  color: #fff;
  padding: .5rem 1rem 0 1rem;
  border-bottom: 4px solid var(--brand-gold);
}
.header-top{
  display:flex; align-items:center; justify-content:center; position:relative;
}
.logo img{ height: 96px; width: auto; margin: .25rem auto .5rem; }
.menu-toggle{
  position:absolute;
  left: 1rem;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  color: #fff;
  border: 2px solid var(--brand-gold);
  border-radius: .5rem;
  padding: .5rem .75rem;
  font-weight:700;
  display:none;
  cursor:pointer;
}

.site-nav{padding:0 .75rem 1rem}
.site-nav ul{list-style:none;display:flex;gap:.5rem 1rem;justify-content:center;align-items:center;flex-wrap:wrap;margin:0;padding:0}
.site-nav a{ color:#fff; text-decoration:none; font-weight:700; padding:.5rem .25rem; border-bottom: 3px solid transparent; }
.site-nav a:hover,.site-nav a:focus{border-bottom-color: var(--brand-gold); outline: none}
.site-nav .book-link .btn-nav{ padding:.4rem .6rem; border-radius:.4rem; background: var(--brand-gold); color: var(--brand-blue); border:2px solid var(--brand-gold); }

@media (max-width: 900px){
  .menu-toggle{display:inline-block}
  .site-nav{display:none}
  .site-nav.open{display:block}
  .site-nav ul{flex-direction:column}
}

.page-hero{
  color:#fff;
  text-align:center;
  padding: 4.5rem 1rem;
  border-bottom: 4px solid var(--brand-gold);
  background: var(--brand-blue);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  position: relative;
}
.page-hero::before{ content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.35); }
.page-hero .hero-inner{ position: relative; max-width: 980px; margin: 0 auto; }
.page-hero h1{ font-size: clamp(2rem,4.5vw,3rem); margin: 0 0 .5rem; }
.page-hero p{ font-size: clamp(1rem,2.2vw,1.2rem); color: #EEF3FF; margin: 0 auto; max-width: 840px; }
.hero-actions{ display:flex; flex-wrap:wrap; gap: .75rem; margin-top: .75rem; justify-content:center }

main{ max-width: 980px; margin: 2rem auto 4rem; padding: 0 1rem }
.content h2{ font-size: clamp(1.8rem, 3.5vw, 2.2rem); margin: .5rem 0 1rem }
.content h3{ font-size: clamp(1.25rem, 2.4vw, 1.5rem); margin: 1.25rem 0 .5rem }
.content p{ margin: .5rem 0 1rem }
.content ul, .content ol{ padding-left: 1.25rem }

a{ color: var(--brand-blue); font-weight:700; text-decoration: none; }
a:hover{ color: var(--brand-gold); text-decoration: underline; }

.btn{ display:inline-block; background: var(--brand-gold); color: var(--brand-blue); text-decoration:none; font-weight:800; padding: .8rem 1.1rem; border-radius: .5rem; border: 2px solid var(--brand-gold); }
.btn:hover{ filter: brightness(.95); transform: translateY(-1px); }
.btn-secondary{ background: #ffffff; color: var(--brand-blue); border-color: #ffffff; }
.btn-outline{ background: transparent; color: #ffffff; border-color: #ffffff; }
.btn-cta{ background: var(--brand-gold); color: var(--brand-blue); border-color: var(--brand-gold); font-weight: 900; box-shadow: 0 4px 0 rgba(0,0,0,.15); }

.intro-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 1rem }
.card{ background: var(--muted); padding: 1rem; border-radius: .5rem }
@media (max-width: 800px){ .intro-grid{grid-template-columns: 1fr} }

.proof-points ul{ display:flex; flex-wrap:wrap; gap: .75rem; padding:0; margin: 1rem 0 0; list-style:none }
.proof-points li{ background:#f0f3f9; border:1px solid #dde3ee; padding:.5rem .75rem; border-radius:.35rem; font-weight:700; }

.deliverables-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:1rem }
.tile{ background:#f7f9ff; border:1px solid #e1e7f0; border-radius:.5rem; padding:1rem }
@media (max-width: 800px){ .deliverables-grid{ grid-template-columns:1fr } }

.block-cta{ background:#fff7e1; border:1px solid #f2d48a; border-radius:.5rem; padding:1rem; margin-top:1rem; }

.timeline li{ margin:.25rem 0 }

.template{ white-space: pre-wrap; background: #0b2c5f10; border: 1px solid #0b2c5f33; padding: .75rem; border-radius: .5rem; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; font-size: .95rem; position:relative; }
.copy-btn{ position:absolute; top:8px; right:8px; border:2px solid var(--brand-blue); background:#fff; color:var(--brand-blue); font-weight:800; padding:.25rem .5rem; border-radius:.35rem; cursor:pointer; }

.resource-strip{ background:#fafafa; border-top:1px solid #eee; border-bottom:1px solid #eee; padding: .75rem 1rem; text-align:center; }
.help-strip{ background: var(--brand-blue); color:#fff; text-align:center; padding: .9rem 1rem; }
.help-strip a{ color: var(--brand-gold); text-decoration: underline; }

.site-footer{ background: var(--brand-blue); color:#ffffff; text-align:center; padding: 1.25rem 1rem; border-top: 4px solid var(--brand-gold); }
.site-footer a{ color: var(--brand-gold) }

/* Page-specific hero images via Unsplash Source (topic tags) */
.home-hero{ background-image: url('https://source.unsplash.com/1600x900/?law,library'); }
.about-hero{ background-image: url('https://source.unsplash.com/1600x900/?advocate,leadership'); }
.what-hero{ background-image: url('https://source.unsplash.com/1600x900/?strategy,planning'); }
.frameworks-hero{ background-image: url('https://source.unsplash.com/1600x900/?documents,law'); }
.selfhelp-hero{ background-image: url('https://source.unsplash.com/1600x900/?forms,writing'); }
.debt-hero{ background-image: url('https://source.unsplash.com/1600x900/?finance,debts'); }
.enforcement-hero{ background-image: url('https://source.unsplash.com/1600x900/?uk,council'); }
.parking-hero{ background-image: url('https://source.unsplash.com/1600x900/?parking,carpark'); }
.caselaw-hero{ background-image: url('https://source.unsplash.com/1600x900/?law,justice'); }
.contact-hero{ background-image: url('https://source.unsplash.com/1600x900/?contact,desk'); }