/*
Theme Name: Blue Collar Operators
Author: Blue Collar Operators
Description: Custom block theme for Blue Collar Operators - coaching for tree and home service companies. Petrol teal with a blue accent. Edit colours, fonts and spacing in Appearance > Editor > Styles.
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 7.4
Version: 3.2.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bco
Tags: block-theme, full-site-editing, business, one-column
*/

/* Self-hosted fonts. Drop the .woff2 files in assets/fonts/ and these take
   over automatically; functions.php stops loading Google Fonts when present. */
@font-face{font-family:"Archivo Black";src:url("assets/fonts/archivo-black.woff2") format("woff2");
  font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Archivo";src:url("assets/fonts/archivo.woff2") format("woff2");
  font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Archivo";src:url("assets/fonts/archivo-600.woff2") format("woff2");
  font-weight:500 600;font-style:normal;font-display:swap}
@font-face{font-family:"Archivo";src:url("assets/fonts/archivo-700.woff2") format("woff2");
  font-weight:700;font-style:normal;font-display:swap}
/* Granesta - licensed brush accent, self-hosted and subset to Latin. */
@font-face{font-family:"Granesta";src:url("assets/fonts/brush.woff2") format("woff2");
  font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+2010-2122}

:root{
  --bco-petrol:#0A1719; --bco-900:#0F2124; --bco-800:#142B2F; --bco-700:#1D3D42;
  --bco-text:#EEF4F4;   --bco-muted:#8FA3A5;
  --bco-blue:#249AD6;   --bco-blue-hover:#1B86BE; --bco-blue-light:#7FC7E8;
  --bco-radius:16px;
}

body{-webkit-font-smoothing:antialiased}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,
summary:focus-visible{outline:3px solid var(--bco-blue);outline-offset:3px}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap}
.skip-link:focus{position:fixed;left:0;top:0;z-index:99;background:var(--bco-blue);
  color:#fff;padding:12px 18px;font-weight:700;width:auto;height:auto;clip:auto}

/* ---------- header ---------- */
.bco-header{border-bottom:1px solid var(--bco-800);position:sticky;top:0;z-index:50;
  background:var(--bco-petrol)}
.bco-logo img{height:clamp(30px,4vw,40px);width:auto;display:block}
.bco-nav a{color:var(--bco-muted);text-decoration:none;font-size:.95rem;font-weight:600}
.bco-nav a:hover,.bco-nav .current-menu-item a{color:var(--bco-text)}

/* ---------- eyebrow pill ---------- */
.bco-pill{display:inline-flex;align-items:center;gap:8px;background:var(--bco-800);
  border:1px solid var(--bco-700);border-radius:999px;padding:7px 15px;
  color:var(--bco-muted);font-size:.85rem;font-weight:600}
.bco-pill::before{content:"";width:7px;height:7px;border-radius:50%;
  background:var(--bco-blue);flex:none}

/* ---------- bands ---------- */
.bco-band{background:var(--bco-900);border-top:1px solid var(--bco-700);
  border-bottom:1px solid var(--bco-700)}

/* two-column section head: heading left, intro right */
.bco-shead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
  gap:clamp(20px,4vw,56px);align-items:start}
.bco-shead>h2{margin:0}
.bco-shead>p{margin:0;padding-top:.25em}
@media(max-width:900px){.bco-shead{grid-template-columns:1fr;gap:14px}
  .bco-shead>p{padding-top:0}}


/* ---------- icon chips, drawn in CSS so the markup stays native blocks ---------- */
.bco-card,.bco-contact-card{position:relative}
.bco-card::before,.bco-contact-card::before{content:"";position:absolute;
  border-radius:11px;background:var(--bco-700)}
.bco-card::after,.bco-contact-card::after{content:"";position:absolute;
  background:var(--bco-blue)}
.bco-card::before{top:22px;left:22px;width:42px;height:42px}
.bco-card::after{top:32px;left:32px;width:22px;height:22px}
.bco-contact-card::before{top:50%;left:18px;margin-top:-19px;width:38px;height:38px}
.bco-contact-card::after{top:50%;left:26px;margin-top:-11px;width:22px;height:22px}
.ic-target::after{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%224%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%224%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat}
.ic-chart::after{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2018V9M10%2018V5M16%2018v-6M21%2018H3%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2018V9M10%2018V5M16%2018v-6M21%2018H3%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat}
.ic-star::after{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%204l2.3%205%205.2.6-3.9%203.5%201.1%205.1L12%2015.6%207.3%2018.2l1.1-5.1L4.5%209.6%209.7%209z%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%204l2.3%205%205.2.6-3.9%203.5%201.1%205.1L12%2015.6%207.3%2018.2l1.1-5.1L4.5%209.6%209.7%209z%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat}
.ic-flow::after{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%206h6a3%203%200%200%201%203%203v6a3%203%200%200%200%203%203h2%22%2F%3E%3Ccircle%20cx%3D%224%22%20cy%3D%226%22%20r%3D%222%22%2F%3E%3Ccircle%20cx%3D%2220%22%20cy%3D%2218%22%20r%3D%222%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%206h6a3%203%200%200%201%203%203v6a3%203%200%200%200%203%203h2%22%2F%3E%3Ccircle%20cx%3D%224%22%20cy%3D%226%22%20r%3D%222%22%2F%3E%3Ccircle%20cx%3D%2220%22%20cy%3D%2218%22%20r%3D%222%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat}
.ic-bolt::after{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%2012h6M6%208h9M6%2016h4%22%2F%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2212%22%20r%3D%223%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%2012h6M6%208h9M6%2016h4%22%2F%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2212%22%20r%3D%223%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat}
.ic-phone::after{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%204h4l2%205-2.5%201.5a11%2011%200%200%200%205%205L15%2013l5%202v4a1%201%200%200%201-1%201A16%2016%200%200%201%204%205a1%201%200%200%201%201-1z%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%204h4l2%205-2.5%201.5a11%2011%200%200%200%205%205L15%2013l5%202v4a1%201%200%200%201-1%201A16%2016%200%200%201%204%205a1%201%200%200%201%201-1z%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat}
.ic-mail::after{-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M3%207l9%206%209-6%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M3%207l9%206%209-6%22%2F%3E%3C%2Fsvg%3E") center/22px 22px no-repeat}

/* ---------- cards (native block version) ---------- */
.bco-card{background:var(--bco-800);border:1px solid var(--bco-700);
  border-radius:var(--bco-radius);padding:22px;padding-top:80px;height:100%;
  display:flex;flex-direction:column}
.bco-card:hover{border-color:var(--bco-blue)}
.bco-card h3{margin:0;font-size:1.125rem;line-height:1.2}
.bco-card p{margin:8px 0 0;color:var(--bco-muted);font-size:.9rem;line-height:1.6}
.bco-card .bco-card__hit{margin-top:auto;padding-top:14px;
  border-top:1px solid var(--bco-700);color:var(--bco-blue-light);
  font-size:.85rem;font-weight:600}

/* blue feature tile, fills the sixth slot */
.bco-tile{background:var(--bco-blue);border-radius:var(--bco-radius);padding:26px;
  display:flex;flex-direction:column;justify-content:center;height:100%}
.bco-tile h3{margin:0;color:#fff;font-size:1.25rem}
.bco-tile p{margin:8px 0 0;color:#fff;opacity:.92}
.bco-tile .wp-block-button__link{background:#fff;color:var(--bco-blue)}

/* The grid is the core Group block in grid layout, so cards stay draggable.
   Forced here rather than left to the block's own setting: once a template is
   saved in the Site Editor, WordPress stores a copy of the markup in the
   database and stops reading the theme's version, so a layout set only in the
   pattern can go stale. Setting it in CSS keeps 6 cards at 3 x 2 either way. */
.bco-cards{margin-top:30px}
.bco-cards.wp-block-group{grid-template-columns:repeat(3,minmax(0,1fr))!important}
@media(max-width:960px){
  .bco-cards.wp-block-group{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:620px){
  .bco-cards.wp-block-group{grid-template-columns:1fr!important}
}

/* Any button sitting on a blue panel must be white with blue text. Matched on
   the inline background colour so it holds for older saved copies too. */
[style*="#249AD6"] .wp-block-button__link,
[style*="rgb(36, 154, 214)"] .wp-block-button__link,
.bco-tile .wp-block-button__link,
.bco-tier--hero .wp-block-button__link{
  background:#fff!important;color:var(--bco-blue)!important}
[style*="#249AD6"] .wp-block-button__link:hover,
[style*="rgb(36, 154, 214)"] .wp-block-button__link:hover,
.bco-tile .wp-block-button__link:hover,
.bco-tier--hero .wp-block-button__link:hover{
  background:#E6F3FA!important;color:var(--bco-blue)!important}

/* Keep body copy at a readable size even if a stale global style inflates it. */
/* Page intro: lock the lead paragraph so a stale editor-saved template
   can't inflate it back to the old fluid size. */
.bco-shead .wp-block-post-excerpt,
.bco-shead .wp-block-post-excerpt p{font-size:1.1875rem!important;line-height:1.65}
body{font-size:1.0625rem}
.bco-hero-lead,p.has-large-font-size{font-size:1.1875rem!important;line-height:1.65}

/* ---------- timeline rows ---------- */
.bco-row{display:grid;grid-template-columns:54px 1fr;gap:20px;
  padding:16px 0;border-top:1px solid var(--bco-700);align-items:center}
.bco-rows>.bco-row:last-child{border-bottom:1px solid var(--bco-700)}
.bco-row p{margin:0}
.bco-row .bco-row__n{color:var(--bco-blue);font-size:.85rem;font-weight:700;letter-spacing:.08em}
.bco-row .bco-row__t{color:var(--bco-text);font-size:1rem;font-weight:700}
.bco-row .bco-row__d{color:var(--bco-muted);font-size:.85rem;margin-top:3px;line-height:1.5}
.bco-row .bco-row__w{color:var(--bco-muted);font-size:.8rem;text-align:right;font-weight:600}
@media(max-width:700px){.bco-row{grid-template-columns:40px 1fr}
  .bco-row .bco-row__w{grid-column:2;text-align:left}}

/* ---------- steps ---------- */
.bco-step{display:grid;grid-template-columns:42px 1fr;gap:clamp(14px,3vw,28px);
  padding:24px 0;border-top:1px solid var(--bco-700);align-items:start}
.bco-steps>.bco-step:last-child{border-bottom:1px solid var(--bco-700)}
.bco-step .bco-step__n{margin:0;width:42px;height:42px;border-radius:11px;
  background:var(--bco-800);border:1px solid var(--bco-700);display:flex;
  align-items:center;justify-content:center;font-family:"Archivo Black",sans-serif;
  font-size:1.05rem;color:var(--bco-blue)}
.bco-step h3{margin:0;font-size:1.15rem}
.bco-step p{margin:7px 0 0;color:var(--bco-muted);font-size:.95rem;line-height:1.65}

/* ---------- contact cards ---------- */
.bco-contact-card{background:var(--bco-800);border:1px solid var(--bco-700);
  border-radius:14px;padding:18px 18px 18px 70px}
.bco-contact-card p{margin:0}
.bco-contact-card .bco-contact-card__t{color:var(--bco-text);font-size:1.05rem;font-weight:700}
.bco-contact-card .bco-contact-card__s{color:var(--bco-muted);font-size:.85rem;margin-top:2px}
.bco-contact-card a{color:inherit;text-decoration:none}

/* ---------- pricing tiers (native block version) ---------- */
.bco-tier{background:var(--bco-800);border:1px solid var(--bco-700);border-radius:20px;
  padding:clamp(24px,3vw,32px);height:100%;display:flex;flex-direction:column}
.bco-tier--hero{background:var(--bco-blue);border-color:var(--bco-blue)}
.bco-tier .bco-tier__step{margin:0;color:var(--bco-blue);font-size:.8rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase}
.bco-tier h3{margin:8px 0 0;font-size:1.6rem}
.bco-tier .bco-tier__price{margin:14px 0 0;font-family:"Archivo Black",sans-serif;
  font-size:clamp(2.4rem,5vw,3.1rem);letter-spacing:-.04em;color:var(--bco-blue);line-height:1}
.bco-tier .bco-tier__price small{font-family:"Archivo",sans-serif;font-size:.95rem;
  font-weight:600;color:var(--bco-muted);letter-spacing:0;margin-left:8px}
.bco-tier .bco-tier__blurb{margin:14px 0 0;color:var(--bco-muted);font-size:.95rem;line-height:1.65}
.bco-tier .bco-tier__fine{margin:13px 0 0;color:var(--bco-muted);font-size:.82rem;text-align:center}
.bco-tier--hero .bco-tier__step,.bco-tier--hero h3{color:#fff}
.bco-tier--hero .bco-tier__price{color:#fff}
.bco-tier--hero .bco-tier__price small,.bco-tier--hero .bco-tier__blurb,
.bco-tier--hero .bco-tier__fine{color:rgba(255,255,255,.88)}
.bco-tier .wp-block-buttons{margin-top:auto;padding-top:22px}
.bco-tier--hero .wp-block-button__link{background:#fff;color:var(--bco-blue)}
.bco-tier--hero .wp-block-button__link:hover{background:#E6F3FA;color:var(--bco-blue)}
.bco-tier ul{list-style:none;margin:18px 0 0;padding:0}
.bco-tier li,.bco-checks li{position:relative;padding:10px 0 10px 30px;
  border-top:1px solid var(--bco-700);color:var(--bco-text);font-size:.95rem;line-height:1.5}
.bco-tier li::before,.bco-checks li::before{content:"";position:absolute;left:0;top:16px;
  width:14px;height:8px;border-left:2px solid var(--bco-blue);
  border-bottom:2px solid var(--bco-blue);transform:rotate(-45deg)}
.bco-tier--hero li{border-color:rgba(255,255,255,.28);color:#fff}
.bco-tier--hero li::before{border-color:#fff}
.bco-checks{list-style:none;margin:18px 0 0;padding:0}
.bco-checks--muted li{color:var(--bco-muted)}
.bco-checks--muted li::before{border-color:var(--bco-muted)}

/* ---------- entry offer band ---------- */
.bco-entry{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
  gap:clamp(20px,4vw,40px);align-items:center;background:var(--bco-900);
  border:1px solid var(--bco-700);border-radius:20px;padding:clamp(22px,3vw,30px)}
@media(max-width:780px){.bco-entry{grid-template-columns:1fr}}
.bco-entry h3{margin:6px 0 0;font-size:1.5rem}
.bco-entry p{margin:10px 0 0;color:var(--bco-muted)}
.bco-entry .bco-tier__step{margin:0}
.bco-entry__buy{text-align:center}
.bco-entry__price{margin:0!important;font-family:"Archivo Black",sans-serif;
  font-size:clamp(2.2rem,5vw,2.9rem);color:var(--bco-blue);letter-spacing:-.04em;line-height:1}
.bco-entry__price small{display:block;font-family:"Archivo",sans-serif;font-size:.85rem;
  font-weight:600;color:var(--bco-muted);letter-spacing:0;margin-top:6px}
.bco-entry__buy .wp-block-buttons{justify-content:center;margin-top:14px}

/* ---------- calculator ---------- */
.bco-calc{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,4vw,44px);
  background:var(--bco-800);border:1px solid var(--bco-700);
  border-radius:20px;padding:clamp(22px,3vw,36px)}
@media(max-width:780px){.bco-calc{grid-template-columns:1fr}}
.bco-calc h3{margin:0;font-size:1.4rem}
.bco-calc__intro{margin:8px 0 0;color:var(--bco-muted);font-size:.95rem}
.bco-calc__fields{display:grid;gap:20px;margin-top:24px}
.bco-calc__row label{display:block;font-size:.85rem;font-weight:700;
  color:var(--bco-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.bco-calc__row .val{float:right;font-family:"Archivo Black",sans-serif;
  font-size:1.25rem;color:var(--bco-text);letter-spacing:-.02em}
.bco-calc__row input[type=range]{width:100%;accent-color:var(--bco-blue);height:26px}
.bco-calc__out{background:var(--bco-petrol);border:1px solid var(--bco-blue);
  border-radius:16px;padding:24px}
.bco-calc__big{margin:0;font-family:"Archivo Black",sans-serif;
  font-size:clamp(2.2rem,5.5vw,3rem);color:var(--bco-blue);letter-spacing:-.04em;line-height:1}
.bco-calc__cap{margin:14px 0 0;color:var(--bco-muted);font-size:.92rem;line-height:1.6}
.bco-calc__hit{margin:16px 0 0;padding-top:14px;border-top:1px solid var(--bco-700);
  color:var(--bco-text);font-weight:700;font-size:.95rem;line-height:1.4}
.bco-calc__split{margin-top:18px;padding-top:16px;border-top:1px solid var(--bco-700);
  display:grid;gap:8px;color:var(--bco-muted);font-size:.92rem}
.bco-calc__split b{color:var(--bco-text)}
.bco-calc__note{margin:16px 0 0;color:#6D8183;font-size:.8rem;line-height:1.55}

/* ---------- trunk illustration ---------- */
.bco-trunk{display:block;width:100%;max-width:380px;margin:0 auto}
.bco-trunk .ring{fill:none;stroke:#2C565D;stroke-width:1.7;stroke-linejoin:round}
.bco-trunk .crack{fill:none;stroke:var(--bco-petrol);stroke-width:2.6;stroke-linecap:round}
.bco-trunk .pith{fill:var(--bco-petrol);stroke:#2C565D;stroke-width:1.4}
.bco-trunk .live{fill:none;stroke:var(--bco-blue);stroke-width:3.6;stroke-linejoin:round;
  stroke-dasharray:1;stroke-dashoffset:1;animation:bcoDraw 1.1s .3s cubic-bezier(.4,0,.2,1) forwards}
@keyframes bcoDraw{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.bco-trunk .live{stroke-dashoffset:0;animation:none}}
.bco-trunk__cap{margin:14px auto 0;text-align:center;color:var(--bco-blue-light);
  font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.16em;
  max-width:24ch;line-height:1.5}
.bco-trunk__cap::before{content:"";display:block;width:34px;height:2px;
  background:var(--bco-blue);margin:0 auto 11px}

/* ---------- FAQ ---------- */
.bco-faq .wp-block-details{background:var(--bco-800);border:1px solid var(--bco-700);
  border-radius:14px;padding:18px 22px;margin-bottom:10px}
.bco-faq summary{list-style:none;cursor:pointer;color:var(--bco-text);
  font-size:1.05rem;font-weight:700;display:flex;justify-content:space-between;
  gap:18px;align-items:center}
.bco-faq summary::-webkit-details-marker{display:none}
.bco-faq summary::after{content:"+";color:var(--bco-blue);font-size:1.4rem;
  line-height:1;flex:none}
.bco-faq .wp-block-details[open] summary::after{content:"\2013"}
.bco-faq .wp-block-details p{margin:10px 0 0;color:var(--bco-muted);
  font-size:.95rem;line-height:1.65}

/* ---------- forms ---------- */
.bco-form input,.bco-form textarea,.bco-form select,
.wpcf7 input,.wpcf7 textarea{font-family:inherit;font-size:1rem;color:var(--bco-text);
  background:var(--bco-900);border:1px solid var(--bco-700);border-radius:10px;
  padding:14px;width:100%;box-sizing:border-box}
.bco-form label,.wpcf7 label{display:block;font-size:.85rem;font-weight:700;
  color:var(--bco-muted);margin-bottom:7px}
.wpcf7 input[type=submit]{background:var(--bco-blue);color:#fff;border:none;
  font-weight:700;cursor:pointer;width:auto;padding:15px 28px}

/* ---------- footer ---------- */
.bco-footer{border-top:1px solid var(--bco-800)}
.bco-footer h2,.bco-footer h3{font-family:"Archivo",sans-serif!important;
  font-size:.8rem!important;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--bco-text);margin-bottom:14px;letter-spacing:.16em!important}
.bco-footer a{color:var(--bco-muted);text-decoration:none;font-size:.92rem}
.bco-footer a:hover{color:var(--bco-blue-light)}
.bco-footer .wp-block-navigation__container{flex-direction:column;gap:9px}

/* ---------- secondary button ---------- */
.wp-block-button.is-style-secondary .wp-block-button__link{
  background:var(--bco-800);color:var(--bco-text);border:1px solid var(--bco-700)}
.wp-block-button.is-style-secondary .wp-block-button__link:hover{
  background:var(--bco-700);color:var(--bco-text)}


/* ---------- accent: brush + brushed-silver ----------
   Applied from the editor: select a heading, paragraph or quote and pick
   "Brush, silver", "Brush, silver + stroke" or "Silver" under Styles. */
:root{
  --bco-silver-ramp:linear-gradient(170deg,
    #FFFFFF 0%, #D7E1E3 15%, #8FA1A4 31%, #F7FBFC 46%,
    #A6B5B8 58%, #E6EDEE 74%, #7F9194 90%, #CBD6D8 100%);
  --bco-brush-font:"Granesta","Bradley Hand","Segoe Script",cursive;
}

.is-style-bco-brush,
.is-style-bco-brush-stroke,
.is-style-bco-silver{color:#DCE5E7}

@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .is-style-bco-brush,
  .is-style-bco-brush-stroke,
  .is-style-bco-silver,
  .bco-silver{
    background-image:var(--bco-silver-ramp);
    -webkit-background-clip:text;background-clip:text;
    color:transparent;-webkit-text-fill-color:transparent;
  }
}

.is-style-bco-brush,
.is-style-bco-brush-stroke,
.bco-brush{
  font-family:var(--bco-brush-font);
  font-weight:400;
  letter-spacing:.005em;
  line-height:1.2;
  text-transform:none;
}

/* The hand-lettered look leans; headings only, so body copy stays level. */
h1.is-style-bco-brush,h2.is-style-bco-brush,h3.is-style-bco-brush,
h1.is-style-bco-brush-stroke,h2.is-style-bco-brush-stroke,h3.is-style-bco-brush-stroke{
  transform:rotate(-3.5deg);transform-origin:left center;
}
.has-text-align-center.is-style-bco-brush,
.has-text-align-center.is-style-bco-brush-stroke{transform-origin:center}

/* Brush underline sweep, painted with the same silver ramp. */
.is-style-bco-brush-stroke{position:relative;padding-bottom:.34em;
  width:fit-content;max-width:100%}
.is-style-bco-brush-stroke::after{
  content:"";position:absolute;left:0;bottom:0;
  width:min(100%,10em);height:.19em;
  background-image:var(--bco-silver-ramp);
  -webkit-mask:var(--bco-stroke) no-repeat left center/100% 100%;
  mask:var(--bco-stroke) no-repeat left center/100% 100%;
}
.has-text-align-center.is-style-bco-brush-stroke{margin-inline:auto}
.has-text-align-center.is-style-bco-brush-stroke::after{left:50%;transform:translateX(-50%)}
.has-text-align-right.is-style-bco-brush-stroke::after{left:auto;right:0}

:root{
  --bco-stroke:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 20' preserveAspectRatio='none'%3E%3Cpath d='M2,12 C50,4 110,3 170,5 C215,6.5 258,9 298,6 C260,14 215,16 168,14 C112,12 55,13 2,17 Z' fill='%23000'/%3E%3C/svg%3E");
}

/* Standalone slogan band. */
.bco-slogan{font-family:var(--bco-brush-font);line-height:1.15;
  font-size:clamp(1.75rem,1.1rem + 2.4vw,3rem);transform:rotate(-3.5deg)}

@media (prefers-reduced-motion:reduce){
  .is-style-bco-brush,.is-style-bco-brush-stroke,.bco-slogan{transform:none}
}

/* ---------- buttons: uppercase, with an arrow so they read as clickable ---------- */
:root{--bco-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 14' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 7h30M25 1.5L31.5 7 25 12.5'/%3E%3C/svg%3E")}

.wp-block-button__link{
  text-transform:uppercase;letter-spacing:.055em;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;gap:.55em}
.wp-block-button__link::after{
  content:"";width:1.45em;height:.6em;flex:none;
  background:currentColor;
  -webkit-mask:var(--bco-arrow) no-repeat center/contain;
  mask:var(--bco-arrow) no-repeat center/contain;
  transition:transform .18s ease}
.wp-block-button__link:hover::after{transform:translateX(4px)}
/* the small nav button stays tight - no arrow */
.bco-header .wp-block-button__link::after{display:none}
@media (prefers-reduced-motion:reduce){
  .wp-block-button__link::after{transition:none}
  .wp-block-button__link:hover::after{transform:none}}

/* ---------- eyebrows all caps ---------- */
.bco-pill,.bco-tier__step,.bco-trunk__cap{
  text-transform:uppercase;letter-spacing:.14em}

/* ---------- footer ---------- */
.bco-footer__h{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--bco-text);margin:0 0 16px}
.bco-footer__desc{color:var(--bco-muted);max-width:40ch;font-size:.95rem;line-height:1.65}
.bco-footer__nav a{font-size:.95rem;color:var(--bco-muted);text-decoration:none}
.bco-footer__nav a:hover{color:var(--bco-text)}
.bco-footer__contact{margin:0 0 8px;font-size:.95rem}
.bco-footer__contact a{color:var(--bco-text);text-decoration:none}
.bco-footer__contact a:hover{color:var(--bco-blue-light)}
/* the footer link colour was bleeding onto the button and killing contrast */
.bco-footer .wp-block-button__link,
.bco-footer .wp-block-button__link:hover,
.bco-footer .wp-block-button__link:focus{color:#fff;font-size:.85rem;padding:12px 20px}

/* a straight recommendation, not fine print */
.bco-tier__note{margin:18px 0 0;padding:14px 16px;border-radius:12px;
  background:rgba(36,154,214,.10);border:1px solid rgba(36,154,214,.32);
  color:var(--bco-text);font-size:.93rem;line-height:1.6}
.bco-tier--hero .bco-tier__note{background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.4)}

/* ---------- roadmap: rows sat too far apart and the intro left a dead column ---------- */
.bco-rows{display:flex;flex-direction:column;gap:0}
.bco-rows>.bco-row{margin:0}
.bco-timeline .bco-row{padding:14px 0}
@media(min-width:901px){
  .bco-timeline .wp-block-columns>.wp-block-column:first-child{
    position:sticky;top:92px;align-self:flex-start}
}

/* ---------- full-width bands must butt together ----------
   WordPress was inserting its block gap between consecutive full-width
   sections, and that sliver of page background between two bands of the
   same colour read as a stray stripe. The bands carry their own padding,
   so the gap between them should be zero. */
main > .alignfull{margin-block-start:0;margin-block-end:0}
main > .alignfull + .alignfull{margin-block-start:0}
.bco-slogan-band{border-top:1px solid var(--bco-700);border-bottom:1px solid var(--bco-700)}

.bco-note{margin-top:18px;padding:14px 16px;border-left:2px solid var(--bco-blue);
  background:var(--bco-800);border-radius:0 12px 12px 0;color:var(--bco-muted);
  font-size:.92rem;line-height:1.6}

/* ---------- the mark, drawn in type so it stays sharp at every size ---------- */
.bco-mark{margin:0}
.bco-mark a{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.bco-mark__b{font-family:"Archivo Black",system-ui,sans-serif;
  background:var(--bco-blue);color:#fff;border-radius:8px;
  padding:.3em .36em .26em;line-height:1;letter-spacing:-.025em;
  font-size:clamp(1rem,.88rem + .5vw,1.28rem)}
.bco-mark__w{display:flex;flex-direction:column;line-height:1}
.bco-mark__l1{font-family:"Archivo Black",system-ui,sans-serif;letter-spacing:-.012em;
  font-size:clamp(.86rem,.76rem + .4vw,1.06rem);
  background-image:var(--bco-silver-ramp);-webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent}
.bco-mark__l2{font-weight:600;letter-spacing:.24em;color:var(--bco-muted);
  font-size:.56rem;margin-top:4px}
.bco-mark--lg .bco-mark__b{font-size:clamp(1.15rem,1rem + .6vw,1.5rem)}
.bco-mark--lg .bco-mark__l1{font-size:clamp(1rem,.86rem + .5vw,1.22rem)}
.bco-mark--lg .bco-mark__l2{font-size:.62rem}

/* ---------- portrait ---------- */
.bco-portrait{margin:0}
.bco-portrait img{border-radius:16px;display:block;width:100%;height:auto;
  border:1px solid var(--bco-700)}
.bco-portrait figcaption{margin-top:12px;font-size:.78rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--bco-muted);text-align:left}