/* Buckeye Beauty & Barber: re-skins the inner pages' original components into the new style.
   Loaded after each page's own <style> blocks, so these rules win. */
:root,:root[data-theme]{
  --ground:#F6EFE0;--surface:#fff;--ink:#12233F;--ink-soft:#44506A;--line:#D9D2C0;
  --navy:#12233F;--navy-deep:#12233F;--navy-ink:#fff;--cream:#EDE3CE;
  --red:#C8322B;--red-deep:#a92721;--stamp:#C8322B;--band:#12233F;--band-ink:#F6EFE0;
  --note-bg:#fff4d6;--note-ink:#5c4400;
  --display:Oswald,"Arial Narrow",sans-serif;
  --body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}
body{font-size:17px;line-height:1.65;background:var(--ground);color:var(--ink)}
.wrap,.wrap-narrow{padding-inline:24px}
section{padding-block:72px}

/* Type */
h1,h2,h3,h4{font-family:var(--display);text-transform:uppercase;letter-spacing:.01em;font-weight:700;line-height:1.05;color:var(--navy)}
h1,.article-head h1{font-size:clamp(2.3rem,5.2vw,3.9rem);line-height:1.02}
.hero h1{font-size:clamp(2.3rem,5.2vw,3.9rem);max-width:20ch}
h2{font-size:clamp(1.8rem,3.6vw,2.6rem)}
.prose h2{font-size:clamp(1.5rem,2.8vw,2rem)}
h3{font-size:1.25rem;font-weight:600;letter-spacing:.02em}
.band h2{color:var(--band-ink)}
.eyebrow{font:600 .85rem/1.2 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.lede{color:#2B3853}
.faq summary{font:700 1.08rem/1.35 var(--body);text-transform:none;letter-spacing:0;color:var(--ink)}
.amanda blockquote,.prose blockquote{font:600 1.12rem/1.5 var(--body)}
.buy-as,.updated,.form-sheet .hdr,th{font-family:var(--display)!important;font-weight:600!important;letter-spacing:.08em!important;text-transform:uppercase}
.plan .price,.card-license .top b,.caption-card b{font-family:var(--display);text-transform:uppercase;letter-spacing:.02em}
.hero-under{font:500 .9rem var(--body)}
.crumbs{font:500 .82rem/1.5 var(--body)}

/* Square corners everywhere, as in the new design */
.btn,.choose,.plan,.card,.table-wrap,form.quote,.field input,.field select,.field textarea,.chip,.note,.ok,.err,
.portrait,.hero-photo img,.caption-card,.form-sheet,.card-license,.prose .answer,.gate,.flag{border-radius:0}

/* Buttons */
.btn{font-weight:700}
.btn-primary{background:var(--navy);color:#fff}
.btn-primary:hover{background:#2B3853;filter:none}
.btn-red:hover{background:#a92721;filter:none}

/* Sections */
.bg-surface{background:var(--cream);border-block:0}
.bg-surface+.bg-surface{border-top:1px solid #d9cfb6}
.trustbar{background:var(--navy);border:0}
.trustbar .wrap{color:var(--band-ink);font:600 .88rem/1.4 var(--display);letter-spacing:.08em;text-transform:uppercase}
.trustbar span+span:before{color:#E8574F}

/* Plan boxes: white, separate, navy / red top bars */
.plans{gap:24px}
.plan{background:#fff;border:0;border-top:6px solid var(--navy);padding:24px}
.plan+.plan,#option2{border-top-color:var(--red)}
.plan .price{font-size:1.45rem}

/* Cards, tables, forms */
.card{border:0;border-top:3px solid var(--navy);background:#fff}
.card:hover{border-top-color:var(--red)}
.table-wrap{border:0;border-top:6px solid var(--navy)}
th{background:var(--navy)!important;color:var(--band-ink)!important;font-size:.85rem!important}
.lines th{background:none!important}
form.quote{border:0;border-top:6px solid var(--navy);background:#fff}
.field input,.field select,.field textarea{background:var(--ground);border:1.5px solid var(--line)}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--navy);outline:none;box-shadow:0 0 0 3px #12233f22}
.chip{border:1.5px solid var(--navy);background:transparent;font:600 .82rem/1 var(--body)}
.creds .chip{color:inherit}
.prose .answer{border-left-color:var(--red)}
.covers div{border-color:var(--line)}
.step:before{font-family:var(--display);background:var(--navy);color:#fff;width:48px;height:48px;display:grid;place-items:center;font-size:1.5rem}
.band{border-top:6px solid var(--red)}
.hero-photo img,.portrait{border:3px solid #fff;box-shadow:none}
.caption-card{box-shadow:none;border:0;border-left:5px solid var(--red)}
.amanda{align-items:start}

/* "Not eligible" call-outs that route to a quote */
.bb-route{font-weight:600}
.bb-route a{color:var(--red)}

/* Phone-width fixes */
.flag{white-space:normal}
a[href^="mailto:"]{overflow-wrap:anywhere}
.plans>*,.two-col>*,.owners>*,.amanda>*,.hero-grid>*{min-width:0}
@media (max-width:520px){.lines .amt{white-space:normal!important}}
h1 .flag,h2 .flag,h3 .flag,h4 .flag{font:500 .72rem/1.35 var(--body);text-transform:none;letter-spacing:0;vertical-align:middle}