/* PP Frama typography trial — Brainbox Energy
   Place supplied PPFrama-Medium.woff2 at assets/PPFrama-Medium.woff2.
   If missing, the website safely uses Manrope/DM Sans. */
@font-face{
  font-family:"PP Frama";
  src:url("./assets/PPFrama-Medium.woff2") format("woff2");
  font-weight:500;
  font-style:normal;
  font-display:swap;
}
:root{--bb-display:"PP Frama","Manrope","DM Sans",Arial,sans-serif}
h1,h2,h3,h4,.hero h1,.page-banner h1,.bb-section-top h2,.bb-faq-layout h2,.bb-intro-section h2,.bb-feature-section h2,.bb-services-section h2,.bb-sectors-section h2,.bb-gallery-section h2,.cta h2,.modern-contact .contact-intro h2,.enquiry-wizard h3{
 font-family:var(--bb-display);
 font-weight:500;
 letter-spacing:-.057em;
}
.hero h1{font-size:clamp(59px,6.45vw,105px);line-height:1.015;letter-spacing:-.067em;font-weight:500}
.page-banner h1{line-height:1.04}
h2{font-size:clamp(42px,4.55vw,70px);line-height:1.065}
h3{letter-spacing:-.045em}
.bb-services-section .service-card h3{font-size:clamp(24px,2.15vw,31px);line-height:1.13}
.bb-workflow-copy h3{font-size:clamp(25px,2.5vw,34px);line-height:1.15}
.bb-faq-items summary,.stats strong,.bb-workflow-strip strong{font-family:var(--bb-display);font-weight:500}
#header nav a{font-size:13px;letter-spacing:.025em}
.hero p{font-family:"DM Sans",Arial,sans-serif;font-weight:400}
@media(max-width:700px){
 .hero h1{font-size:clamp(47px,10.6vw,71px);line-height:1.05}
 h2{font-size:clamp(36px,9.7vw,52px)}
}

/* Body companion: PP Frama Text Regular */
@font-face{
  font-family:"PP Frama Text";
  src:url("./assets/PPFramaText-Regular.woff2") format("woff2");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
:root{--bb-body-font:"PP Frama Text","DM Sans",Arial,sans-serif}
body,p,li,dt,dd,blockquote,input,textarea,select,button,figcaption,
.service-card p,.insight-card p,.bb-workflow-copy p,
.bb-faq-items p,.bb-intro-section p,.bb-feature-section p,
.page-banner p,.hero p,.cta p,.stats span,
.enquiry-wizard .wizard-panel>p,.enquiry-wizard .wizard-option,
.enquiry-wizard .wizard-field input,.enquiry-wizard .wizard-field textarea,
.enquiry-wizard .wizard-field select,.enquiry-wizard .wizard-footnote,
.modern-contact .contact-intro>p,.contact-details p,
footer p,footer a,.notice{
 font-family:var(--bb-body-font);
}
body{font-size:17px;line-height:1.65}
p{font-size:17px;line-height:1.75;letter-spacing:0}
.hero p{font-size:clamp(18px,1.5vw,21px);line-height:1.65}
.page-banner p,.cta p{font-size:18px;line-height:1.7}
.bb-intro-section .split p:not(.lead),.bb-feature-section p,
.bb-services-section .service-card p,
.bb-workflow-copy p,.bb-faq-items p,
.bb-guidance-section .insight-card p{
 font-size:16.5px;line-height:1.7;
}
.bb-workflow-strip,.stats span,.workshop-gallery figcaption{font-size:14px;line-height:1.55}
.enquiry-wizard .wizard-panel>p,.modern-contact .contact-intro>p{font-size:16px;line-height:1.65}
.enquiry-wizard .wizard-option{font-size:14px;line-height:1.45}
.enquiry-wizard .wizard-field input,.enquiry-wizard .wizard-field select,
.enquiry-wizard .wizard-field textarea{font-size:16px;line-height:1.45}
.enquiry-wizard .wizard-field label{font-size:13px}
.bb-faq-items summary{font-size:17px}
footer p,footer a{font-size:14px;line-height:1.7}
@media(max-width:700px){
 body{font-size:16px}
 p{font-size:16px;line-height:1.72}
 .hero p{font-size:17px;line-height:1.65}
 .page-banner p,.cta p{font-size:16px}
 .bb-intro-section .split p:not(.lead),.bb-feature-section p,
 .bb-services-section .service-card p,.bb-workflow-copy p,
 .bb-faq-items p,.bb-guidance-section .insight-card p{font-size:16px}
 .enquiry-wizard .wizard-option{font-size:14px}
 .enquiry-wizard .wizard-field input,.enquiry-wizard .wizard-field select,.enquiry-wizard .wizard-field textarea{font-size:16px}
}

/* Sitewide type enforcement: all reading copy uses PP Frama Text Regular.
   Headings remain PP Frama Medium. Font files verified in /assets on main. */
:root{--bb-reading-font:"PP Frama Text","DM Sans",Arial,sans-serif}
html body{font-family:var(--bb-reading-font);font-size:18px;line-height:1.65}
html body :is(p,li,dt,dd,blockquote,figcaption,small,label,summary,input,select,textarea,button),
html body :is(.lead,.notice,.value,.card-note,.contact-details,.contact-benefits,.wizard-option,.wizard-review,.service-card,.insight-card,.process,.bb-workflow-copy,.bb-workflow-strip,.bb-faq-items,.stats,.eyebrow,.overline,.bb-eyebrow,.bb-text-link),
html body footer,
html body #header nav,
html body .header-cta{
  font-family:var(--bb-reading-font);
}
html body main p,
html body .split p,
html body .bb-intro-section .split p,
html body .bb-intro-section .split p.lead,
html body .bb-feature-section p,
html body .section > .container > h2 + p{
 font-family:var(--bb-reading-font);
 font-size:18px;
 line-height:1.7;
 letter-spacing:-.005em;
}
html body .bb-intro-section .split .lead{
 font-family:var(--bb-reading-font);
 font-size:21px;
 line-height:1.55;
 font-weight:600;
 letter-spacing:-.014em;
}
html body .hero p{font-family:var(--bb-reading-font);font-size:20px;line-height:1.62}
html body :is(.service-card p,.insight-card p,.bb-services-section .service-card p,
.bb-workflow-copy p,.bb-faq-items p,.bb-guidance-section .insight-card p,
.process p,.value p,.contact-details p,.benefit-card p){
 font-family:var(--bb-reading-font);
 font-size:17px;
 line-height:1.65;
}
html body .bb-workflow-strip,
html body .workshop-gallery figcaption,
html body .stats span{font-family:var(--bb-reading-font);font-size:15px;line-height:1.6}
html body .modern-contact .contact-intro>p,
html body .enquiry-wizard .wizard-panel>p{
 font-family:var(--bb-reading-font);font-size:17px;line-height:1.7;
}
html body .enquiry-wizard .wizard-option{font-family:var(--bb-reading-font);font-size:15px;line-height:1.45}
html body .enquiry-wizard :is(input,select,textarea){font-family:var(--bb-reading-font);font-size:16px}
html body :is(.page-banner p,.cta p){font-family:var(--bb-reading-font);font-size:19px;line-height:1.7}
html body footer :is(p,a){font-family:var(--bb-reading-font);font-size:15px;line-height:1.6}
html body .bb-faq-items summary{font-family:var(--bb-reading-font);font-size:18px;line-height:1.5}
html body #header nav a{font-family:var(--bb-reading-font);font-size:14px;letter-spacing:.01em}
html body :is(h1,h2,h3,h4),
html body .hero h1,
html body .page-banner h1,
html body .modern-contact .contact-intro h2,
html body .enquiry-wizard h3{
 font-family:var(--bb-display);
}
@media(max-width:700px){
 html body{font-size:16px}
 html body main p,html body .split p,
 html body .bb-intro-section .split p,
 html body .bb-feature-section p,
 html body .section > .container > h2 + p{font-size:16.5px;line-height:1.7}
 html body .bb-intro-section .split .lead{font-size:19px;line-height:1.56}
 html body .hero p{font-size:17px;line-height:1.65}
 html body :is(.service-card p,.insight-card p,.bb-services-section .service-card p,
 .bb-workflow-copy p,.bb-faq-items p,.bb-guidance-section .insight-card p,
 .process p,.value p,.contact-details p,.benefit-card p){font-size:16px;line-height:1.66}
 html body :is(.page-banner p,.cta p){font-size:17px}
 html body .bb-faq-items summary{font-size:16.5px}
 html body .enquiry-wizard .wizard-option{font-size:14px}
}

/* Header safeguard: nav items are links, not selectable page copy.
   Prevent the accidental dark text-selection band visible in screenshots. */
#header #nav{background:transparent;box-shadow:none}
#header #nav a{
  background:transparent;
  -webkit-user-select:none;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  text-decoration:none;
}
#header #nav a::selection,#header #nav::selection{background:transparent;color:inherit}
@media(max-width:1120px){
 #header #nav{background:linear-gradient(135deg,rgba(7,29,57,.95),rgba(8,42,76,.91));box-shadow:none}
 #header #nav a{color:white}
 #header #nav a.active{color:#f4bd58}
}