.bf-blue { --bf-deep:#071b39; --bf-accent:#a5ccff; --bf-light:#f0f6ff; --bf-link:#164aa5; }
.bf-berry { --bf-deep:#291522; --bf-accent:#ffc1d2; --bf-light:#fff1f5; --bf-link:#833352; }
.bf-gold { --bf-deep:#251d12; --bf-accent:#ffe49c; --bf-light:#fff8e6; --bf-link:#68440d; }
.bf-amber { --bf-deep:#302019; --bf-accent:#ffd4a6; --bf-light:#fff4e8; --bf-link:#7a4420; }
.bf-slate { --bf-deep:#152638; --bf-accent:#b9dfef; --bf-light:#eef6f9; --bf-link:#245477; }
.bf-header { background:var(--bf-deep); color:#fff; position:sticky; top:0; z-index:6; border-bottom:1px solid #ffffff38; }
.bf-header-inner { display:grid; grid-template-columns:auto 1fr auto; gap:clamp(10px,3vw,30px); align-items:center; min-height:70px; }
.bf-mark { display:inline-flex; align-items:center; justify-content:center; padding:8px 12px; min-height:39px; border-radius:9px; background:#fff; color:var(--bf-deep); max-width:170px; font-weight:800; line-height:1.15; }
.bf-mark img { display:block; width:auto; height:auto; max-height:33px; max-width:145px; object-fit:contain; }
.bf-header nav { display:flex; justify-content:center; gap:clamp(10px,3vw,36px); font-size:.92rem; }
.bf-header nav a:hover,.bf-footer a:hover { text-decoration:underline; text-underline-offset:4px; }
.bf-page [id] { scroll-margin-top:105px; }
.bf-hero,.bf-book,.bf-footer { background:var(--bf-deep); color:#fff; }
.bf-hero-inner { display:grid; grid-template-columns:.93fr 1.07fr; align-items:center; gap:clamp(18px,5vw,65px); padding-block:clamp(40px,7vw,94px); }
.bf-hero-inner img { border-radius:24px; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; }
.bf-hero-text { animation:bf-arrive .65s both; }
.bf-kicker { color:var(--bf-accent); font-weight:700; font-size:.9rem; margin:0 0 10px; }
.bf-page h1 { font-size:clamp(2.9rem,6.1vw,6.6rem); line-height:1.04; overflow-wrap:anywhere; letter-spacing:-.04em; margin:0; }
.bf-page h1 em { color:var(--bf-accent); font-style:normal; }
.bf-page h1 + p { max-width:50ch; color:#fff; opacity:.86; margin:16px 0 0; }
.bf-actions { display:flex; flex-wrap:wrap; gap:10px 18px; margin-top:18px; align-items:center; }
.bf-header .p-button,.bf-hero .p-button,.bf-book .p-button { background:var(--bf-accent); color:var(--bf-deep); border-color:var(--bf-accent); }
.bf-link { text-decoration:underline; text-underline-offset:4px; color:var(--bf-link); font-weight:700; }
.bf-hero .bf-link,.bf-book .bf-link { color:var(--bf-accent); }
.bf-section { padding-block:clamp(44px,7vw,90px); }
.bf-section-title { display:grid; grid-template-columns:1fr .7fr; align-items:end; gap:12px 22px; margin:0 0 24px; }
.bf-page h2 { font-size:clamp(2rem,5vw,4.8rem); line-height:1.13; margin:0; letter-spacing:-.042em; }
.bf-page h3 { font-size:clamp(1.3rem,3vw,2.25rem); line-height:1.22; margin:0 0 10px; }
.bf-section-title p,.bf-cards p,.bf-note { margin:0; color:#40556f; }
.bf-device-nav { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.bf-device-nav a,.bf-related a { display:inline-flex; background:var(--bf-light); color:var(--bf-link); border-radius:40px; padding:5px 13px; font-weight:600; }
.bf-device-nav a:hover,.bf-related a:hover { text-decoration:underline; text-underline-offset:3px; }
.bf-article { background:var(--bf-light); margin-block:16px; border-radius:20px; overflow:hidden; display:grid; grid-template-columns:1.25fr .75fr; }
.bf-article-copy { padding:clamp(17px,3.2vw,40px); }
.bf-article figure { margin:0; padding:14px; align-self:center; }
.bf-article figure img { display:block; width:100%; height:auto; border-radius:14px; aspect-ratio:3/2; object-fit:cover; }
.bf-article figcaption { color:#40556f; font-size:.79rem; margin:5px 0; }
.bf-page details { border-bottom:1px solid #aebbd0; padding:10px 0; }
.bf-page details p { margin:7px 0 0; max-width:75ch; }
.bf-page summary { cursor:pointer; font-weight:700; }
.bf-page .bf-note { margin-top:12px; }
.bf-visit { background:var(--bf-light); }
.bf-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.bf-cards article { background:#fff; border-radius:15px; padding:clamp(15px,2.5vw,28px); }
.bf-book-inner { display:grid; grid-template-columns:1fr .82fr; gap:24px; align-items:center; }
.bf-book-inner p { margin:13px 0; opacity:.9; }
.bf-book form { border-radius:16px; background:#ffffff16; border:1px solid #ffffff42; padding:clamp(15px,3vw,28px); display:grid; gap:11px; }
.bf-book label { display:grid; gap:4px; font-weight:600; }
.bf-book small { color:var(--bf-accent); font-weight:400; }
.bf-book :is(input,select,textarea) { min-width:0; width:100%; border:1px solid #b3c2d6; border-radius:8px; padding:9px 12px; background:#fff; color:#132c48; }
.bf-related { display:flex; flex-wrap:wrap; gap:8px; padding-block:20px; }
.bf-footer { padding-block:32px 18px; }
.bf-footer-grid { display:grid; grid-template-columns:1.2fr .9fr .7fr; gap:15px; }
.bf-footer nav { display:grid; align-content:start; gap:4px; }
.bf-footer p { margin:9px 0; }
.bf-footer-phone { color:var(--bf-accent); font-size:clamp(1.7rem,3vw,2.6rem); font-weight:800; }
.bf-credit { border-top:1px solid #ffffff49; padding-top:10px; margin-top:15px; color:#e1eaf7; font-size:.82rem; }
@keyframes bf-arrive { from { opacity:0; transform:translateY(12px); } }
@media(max-width:700px){
  .bf-header-inner { grid-template-columns:1fr auto; min-height:0; padding-top:8px; gap:4px 8px; }
  .bf-header .bf-mark { justify-self:start; max-width:140px; }
  .bf-header nav { grid-column:1/-1; grid-row:2; justify-content:space-between; padding:5px 0 8px; font-size:.81rem; }
  .bf-header .p-button { justify-self:end; padding:7px 10px; font-size:.81rem; }
  .bf-section-title,.bf-hero-inner,.bf-article,.bf-book-inner,.bf-cards,.bf-footer-grid { grid-template-columns:1fr; }
  .bf-article figure { padding-top:0; }
}
@media(prefers-reduced-motion:reduce){ .bf-hero-text { animation:none; } }
/* Brand guides share navigation and booking while their device chapters follow the actual catalog. */
.bf-mark-dark { background:#131d2b; }
.bf-hero-visual { position:relative; isolation:isolate; margin:0; min-width:0; }
.bf-hero-visual .bf-hero-primary { display:block; aspect-ratio:3/2; }
.bf-hero-visual .bf-hero-inset {
  position:absolute; inset:auto auto -15px -12px; width:39%; aspect-ratio:3/2; height:auto;
  border:4px solid var(--bf-deep); border-radius:15px; object-fit:cover;
  box-shadow:0 12px 38px #0005;
}
.bf-page .bf-index { padding-block:clamp(38px,7vw,80px); }
.bf-index ul,.bf-index-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; list-style:none; padding:0; margin:18px 0 0; }
.bf-index a { display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:14px 16px; background:var(--bf-light); color:var(--bf-link); border:1px solid #d8e3ee; border-radius:12px; }
.bf-index a:hover { text-decoration:underline; text-underline-offset:4px; }
.bf-index + .bf-section { padding-top:8px; }
.bf-editorial,.bf-aftercare,.bf-compare { background:var(--bf-light); }
.bf-editorial .bf-section,.bf-aftercare .bf-section,.bf-compare .bf-section { padding-block:clamp(45px,7vw,90px); }
.bf-editorial-grid,.bf-example-grid,.bf-examples-grid,.bf-aftercare-grid,.bf-compare-grid {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px;
}
.bf-editorial-grid article,.bf-editorial-card,.bf-example-grid article,.bf-examples-grid article,.bf-example,.bf-aftercare-grid article,.bf-compare-grid article {
  min-width:0; padding:clamp(17px,2.5vw,27px); background:white; border:1px solid #d9e4ef; border-radius:16px;
}
.bf-example-grid article,.bf-examples-grid article,.bf-example { background:var(--bf-light); }
.bf-page blockquote { margin:12px 0; padding:9px 14px; border-inline-start:3px solid var(--bf-link); background:#fff; }
.bf-page .bf-inline-note,.bf-book .bf-form-feedback { margin:10px 0 0; font-size:.88rem; }
.bf-article .bf-symptom-action { display:inline-block; margin-block:8px 4px; }
.bf-article .bf-symptom-action,.bf-example a { font-size:.91rem; }
.bf-layout-1 .bf-hero { background:radial-gradient(ellipse at 15% 80%,var(--bf-link),var(--bf-deep) 64%); }
.bf-layout-2 .bf-hero { background:linear-gradient(115deg,var(--bf-deep),var(--bf-link)); }
@media(min-width:850px){
  .bf-layout-1 .bf-hero-inner { grid-template-columns:1.1fr .9fr; }
  .bf-layout-1 .bf-hero-visual { order:-1; }
  .bf-layout-2 .bf-hero-inner { grid-template-columns:.8fr 1.2fr; }
}
@media(max-width:700px){
  .bf-hero-visual .bf-hero-inset { inset:auto auto -8px -5px; border-width:3px; }
  .bf-index ul,.bf-index-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .bf-editorial-grid,.bf-example-grid,.bf-examples-grid,.bf-aftercare-grid,.bf-compare-grid { grid-template-columns:1fr; }
}
.bf-header nav a[aria-current] { color:var(--bf-accent); text-decoration:underline; text-underline-offset:.45em; }
.bf-book [data-brand-feedback]:empty { display:none; }
.bf-book [data-brand-feedback] { margin:0; color:var(--bf-accent); font-size:.85rem; }
.bf-index > .p-wrap { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:9px; }
.bf-index a { font-weight:700; justify-content:center; min-height:52px; }
.bf-hero-visual figcaption { margin:7px 0 0; color:#fff; opacity:.82; font-size:.79rem; }
.bf-hero-visual .bf-hero-inset { bottom:25px; }
.bf-context {
  padding:clamp(18px,3vw,31px); margin:17px 0 25px; background:var(--bf-light);
  border:1px solid #d9e4ef; border-inline-start:4px solid var(--bf-link); border-radius:14px;
}
.bf-context p,.bf-editorial > p { margin:0; color:#344c69; }
.bf-visit .bf-editorial,.bf-aftercare .bf-editorial { background:transparent; margin-top:20px; padding-top:19px; border-top:1px solid #cddbeb; }
.bf-editorial > .bf-cards { margin-top:13px; }
.bf-examples .bf-kicker,.bf-aftercare .bf-kicker { color:var(--bf-link); }
.bf-examples .bf-cards article,.bf-compare.bf-cards article { background:var(--bf-light); border:1px solid #dce6f0; }
.bf-aftercare { background:transparent; }
.bf-compare { background:transparent; }
.bf-aftercare .bf-editorial .bf-cards article { background:var(--bf-light); }
.bf-examples .bf-link,.bf-article details .bf-link { display:inline-flex; margin-top:8px; font-size:.88rem; }
.bf-cards p + p { margin-top:8px; }
@media(max-width:850px){ .bf-index > .p-wrap { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:470px){ .bf-index > .p-wrap { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.bf-motion { transition:opacity .55s ease,transform .55s ease; }
.bf-motion.bf-waiting { opacity:0; transform:translateY(18px); }
@media(prefers-reduced-motion:reduce) {
  .bf-motion,.bf-motion.bf-waiting { transition:none; transform:none; opacity:1; }
}
