/* Service L1 (Template B) components — ported 1:1 from the approved reference build
   `millwork-shop-submittal-drawings.html`. Class names match the reference exactly so any
   future diff against it is a straight comparison. Scoped to .bm-l1. */

.bm-l1 img{max-width:100%;display:block;}
.bm-l1 a{color:inherit;text-decoration:none;}
.bm-l1 .wrap{max-width:1340px;margin:0 auto;padding:0 var(--s4);}
@media (max-width:640px){ .bm-l1 .wrap{padding:0 var(--s3);} }
.bm-l1 section{padding:var(--s7) 0;position:relative;}
@media (max-width:768px){ .bm-l1 section{padding:var(--s6) 0;} }

.bm-l1 h1,.bm-l1 h2,.bm-l1 h3,.bm-l1 h4{color:var(--ink);font-weight:600;line-height:1.1;letter-spacing:-.025em;margin:0;}
.bm-l1 p{margin:0;}

.bm-l1 .eyebrow{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--timber-mid);
  display:flex;align-items:center;gap:14px;justify-content:unset !important;background:unset !important;}
.bm-l1 .eyebrow::before{content:"";width:32px;height:1px;background:var(--brass);flex:none;}
.bm-l1 .eyebrow.dk{color:var(--brass-lift);}
.bm-l1 .lede{font-size:19px;line-height:1.65;}

.bm-l1 .head{max-width:780px;margin-bottom:var(--s6);}
.bm-l1 .head h2{font-size:clamp(29px,3.5vw,46px);margin-top:var(--s3);}
.bm-l1 .head p{margin-top:var(--s3);font-size:18px;}
.bm-l1 .head.dk h2{color:var(--bone);} .bm-l1 .head.dk p{color:rgba(246,241,233,.72);}

/* buttons */
.bm-l1 .btn{display:inline-flex;align-items:center;gap:10px;padding:16px 30px;border-radius:24px;font-size:16px;
  font-weight:600;border:1px solid transparent;cursor:pointer;font-family:inherit;
  transition:transform .25s var(--ease),background .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease);}
.bm-l1 .btn:hover{transform:translateY(-2px);}
.bm-l1 .btn .arw{transition:transform .25s var(--ease);}
.bm-l1 .btn:hover .arw{transform:translateX(4px);}
.bm-l1 .b-brass{background:var(--brass);color:#1a1208;}
.bm-l1 .b-brass:hover{background:var(--brass-lift);}
.bm-l1 .b-timber{background:var(--timber);color:var(--bone);}
.bm-l1 .b-timber:hover{background:var(--ink);}
.bm-l1 .b-line{background:transparent;color:var(--ink);border-color:var(--rule);}
.bm-l1 .b-line:hover{border-color:var(--timber);background:rgba(94,58,34,.05);}
.bm-l1 .b-line.dk{color:var(--bone);border-color:var(--rule-d);}
.bm-l1 .b-line.dk:hover{border-color:var(--brass-lift);background:rgba(246,241,233,.08);}

.bm-l1 a:focus-visible,.bm-l1 button:focus-visible,.bm-l1 summary:focus-visible{
  outline:2px solid var(--brass);outline-offset:3px;border-radius:2px;
}

/* reveal — visible by default; JS arms + observes, so a script failure never hides content */
.bm-l1 .rv{opacity:1;transform:none;}
.bm-l1 .rv.rv-armed{opacity:0;transform:translateY(24px);transition:opacity .75s var(--ease),transform .75s var(--ease);}
.bm-l1 .rv.rv-armed.in{opacity:1;transform:none;}
.bm-l1 .is-pending{cursor:default;opacity:.7;}
.bm-l1 .is-pending .go,.bm-l1 .is-pending .arw{display:none;}

/* ============ HERO (shero) — dark, animated line-drawing behind the type ============ */
.bm-l1 .shero{background:var(--ink);color:rgba(246,241,233,.72);position:relative;overflow:hidden;
  padding:var(--s6) 0 var(--s7);}
.bm-l1 .shero-bg{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;}
.bm-l1 .shero-bg svg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:1500px;max-width:none;height:auto;opacity:.5;}
.bm-l1 .shero-bg::after{content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 62% 78% at 26% 50%,rgba(23,18,16,.94) 30%,rgba(23,18,16,.72) 60%,rgba(23,18,16,.4));}
.bm-l1 .shero canvas{position:absolute;inset:0;z-index:2;pointer-events:none;}
.bm-l1 .shero .wrap{position:relative;z-index:3;}
.bm-l1 .shero-top{max-width:900px;}
.bm-l1 .crumbs{font-size:12.5px;color:rgba(246,241,233,.55);display:flex;align-items:center;
  gap:10px;flex-wrap:wrap;margin-bottom:var(--s6);}
.bm-l1 .crumbs a{color:rgba(246,241,233,.78);text-decoration:none;}
.bm-l1 .crumbs a:hover{color:var(--brass-lift);}
.bm-l1 .crumbs .sep{opacity:.35;}
.bm-l1 .crumbs strong{color:var(--bone);font-weight:500;}
.bm-l1 .shero h1{margin:0;}
.bm-l1 .shero .kw{display:block;font-size:13px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;
  color:var(--brass-lift);margin-bottom:var(--s3);}
.bm-l1 .shero .disp{display:block;font-size:clamp(40px,5.4vw,74px);font-weight:700;letter-spacing:-.04em;
  line-height:1.02;color:var(--bone);}
.bm-l1 .shero .disp .warmc{color:var(--brass-lift);}
.bm-l1 .shero .lede{margin-top:var(--s4);font-size:19px;max-width:58ch;color:rgba(246,241,233,.78);}
.bm-l1 .shero-cta{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s5);}
@media (max-width:900px){ .bm-l1 .shero-bg svg{width:1100px;opacity:.34;} }
@media (max-width:700px){ .bm-l1{padding-top:107px;} .bm-l1 .shero{padding:var(--s5) 0 var(--s7);} .bm-l1 .crumbs{margin-bottom:var(--s5);} }

/* line-drawing draw-on animation */
.bm-l1 .shero-bg .el,.bm-l1 .shero-bg .dl{fill:none;stroke-linecap:square;
  stroke-dasharray:1;stroke-dashoffset:1;animation:bm-l1-draw var(--dur,1s) var(--ease) var(--d,0s) forwards;
  animation-play-state:paused;}
.bm-l1 .shero-bg .el{stroke:rgba(246,241,233,.55);stroke-width:1.1;}
.bm-l1 .shero-bg .dl{stroke:var(--brass-lift);stroke-width:1;}
.bm-l1 .shero-bg .ar{fill:var(--brass-lift);opacity:0;animation:bm-l1-fade .4s var(--ease) var(--d,0s) forwards;animation-play-state:paused;}
.bm-l1 .shero-bg .an{fill:var(--brass-lift);font-size:15px;opacity:0;animation:bm-l1-fade .6s var(--ease) var(--d,0s) forwards;animation-play-state:paused;}
body.bm-l1-anim .shero-bg .el,body.bm-l1-anim .shero-bg .dl,
body.bm-l1-anim .shero-bg .an,body.bm-l1-anim .shero-bg .ar{animation-play-state:running;}
@keyframes bm-l1-draw{to{stroke-dashoffset:0;}}
@keyframes bm-l1-fade{to{opacity:.95;}}

/* ============ HERO warm variant — for the "untemplated" pages assigned a
   warm ground per Master Build Instructions §5.7.1 (Studio Models, How We
   Work, Pricing, Turnaround, Contact). Component reuse only: same .shero
   markup/SVG/animation, palette flipped light-on-warm instead of light-on-ink. ============ */
.bm-l1 .shero.shero-warm{background:var(--bone);color:var(--ink-soft);
  border-bottom:1px solid var(--rule);box-shadow:inset 0 -40px 50px -40px rgba(23,18,16,.06);}
.bm-l1 .shero.shero-warm .shero-bg::after{background:radial-gradient(ellipse 62% 78% at 26% 50%,rgba(242,236,225,.95) 30%,rgba(242,236,225,.78) 60%,rgba(242,236,225,.4));}
.bm-l1 .shero.shero-warm .shero-bg .el{stroke:rgba(23,18,16,.45);}
.bm-l1 .shero.shero-warm .shero-bg .dl{stroke:var(--timber);}
.bm-l1 .shero.shero-warm .shero-bg .ar,.bm-l1 .shero.shero-warm .shero-bg .an{fill:var(--timber);}
.bm-l1 .shero.shero-warm .crumbs{color:rgba(23,18,16,.62);}
.bm-l1 .shero.shero-warm .crumbs a{color:var(--timber);}
.bm-l1 .shero.shero-warm .crumbs a:hover{color:var(--brass);}
.bm-l1 .shero.shero-warm .crumbs strong{color:var(--ink);}
.bm-l1 .shero.shero-warm .kw{color:var(--timber);}
.bm-l1 .shero.shero-warm .disp{color:var(--ink);}
.bm-l1 .shero.shero-warm .disp .warmc{color:var(--timber);}
.bm-l1 .shero.shero-warm .lede{color:var(--ink-soft);}
.bm-l1 .shero.shero-warm .b-line.dk{color:var(--ink);border-color:var(--rule);}
.bm-l1 .shero.shero-warm .b-line.dk:hover{border-color:var(--timber);background:rgba(94,58,34,.05);}

/* Two forms, one section — used where two low-commitment offers (e.g. a
   quick enquiry and a brochure request) would otherwise read as duplicated
   back-to-back .mini blocks. Same .gform-box-free-standing styling as the
   rest of the L1 form components, just laid out side by side. */
.bm-l1 .dual-mini{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);align-items:start;}
.bm-l1 .dual-mini-col{background:var(--paper);border:1px solid var(--rule);padding:var(--s5);}
.bm-l1 .dual-mini-col h4{font-size:16px;font-weight:600;color:var(--ink);margin-bottom:var(--s4);
  padding-bottom:var(--s3);border-bottom:1px solid var(--rule);}
@media (max-width:820px){ .bm-l1 .dual-mini{grid-template-columns:1fr;gap:var(--s5);} }

/* Boxed callout — component from §2.3 parent context bar, recoloured to
   --bone per §5.7's component-reuse mapping (used for the "For projects
   under formal certification" box on How We Work, etc). */
.bm-l1 .callout{margin-top:var(--s5);background:var(--bone);border-left:2px solid var(--brass);padding:var(--s4) var(--s5);}
.bm-l1 .callout h3{font-size:17px;color:var(--ink);font-weight:600;}
.bm-l1 .callout p{margin-top:var(--s2);font-size:16px;line-height:1.65;}
.bm-l1 .callout p+p{margin-top:var(--s2);}

/* ============ SHEET BAND: sticky index rail + content ============ */
.bm-l1 .band-sheet{background:var(--warm);padding:var(--s7) 0;}
.bm-l1 .sheet{display:grid;grid-template-columns:236px minmax(0,1fr);gap:var(--s7);align-items:start;}
.bm-l1 .idx{position:sticky;top:88px;}
.bm-l1 .idx h4{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--timber-mid);
  font-weight:600;padding-bottom:var(--s2);border-bottom:1px solid var(--rule);margin:0;}
.bm-l1 .idx ol{list-style:none;margin:0;padding:0;}
.bm-l1 .idx li{border-bottom:1px solid var(--rule);}
.bm-l1 .idx a{display:block;padding:12px 0 12px 14px;position:relative;
  text-decoration:none;font-size:14px;color:var(--ink-soft);transition:color .25s var(--ease),padding-left .25s var(--ease);}
.bm-l1 .idx a::before{content:"";position:absolute;left:0;top:50%;width:0;height:1px;background:var(--brass);
  transform:translateY(-50%);transition:width .3s var(--ease);}
.bm-l1 .idx a:hover{padding-left:20px;color:var(--timber);}
.bm-l1 .idx a.on{color:var(--timber);font-weight:500;padding-left:20px;}
.bm-l1 .idx a.on::before{width:8px;}
.bm-l1 .idx .back{margin-top:var(--s4);display:inline-flex;align-items:center;gap:9px;font-size:12.5px;
  font-weight:600;letter-spacing:.06em;color:var(--timber);text-decoration:none;}
.bm-l1 .idx .back:hover .arw{transform:translateX(-4px);}
.bm-l1 .idx .back .arw{transition:transform .25s var(--ease);display:inline-block;}
@media (max-width:1000px){
  .bm-l1 .sheet{grid-template-columns:1fr;gap:var(--s5);}
  .bm-l1 .idx{position:static;}
  .bm-l1 .idx ol{display:grid;grid-template-columns:1fr 1fr;}
}
@media (max-width:600px){ .bm-l1 .idx ol{grid-template-columns:1fr;} }

/* sheet sections */
/* .sh is a <section>, so it inherits the generic page-section top/bottom
   padding above - zeroed here since these sections are nested content inside
   the sheet-band grid, not standalone page sections; the real spacing
   between them is the bottom rule below. */
.bm-l1 .sh{padding-top:0;padding-bottom:var(--s5);border-bottom:1px solid var(--rule);margin-bottom:var(--s5);}
.bm-l1 .sh:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0;}
.bm-l1 .sh-hd{margin-bottom:var(--s4);}
.bm-l1 .sh-hd::before{content:"";display:block;width:34px;height:2px;background:var(--brass);margin-bottom:var(--s3);}
.bm-l1 .sh h2{font-size:clamp(26px,3vw,38px);}
.bm-l1 .sh .intro{margin-top:var(--s3);font-size:17.5px;max-width:70ch;}
.bm-l1 .sh p+p{margin-top:var(--s3);}
.bm-l1 .sh .close-note{margin-top:var(--s4);max-width:72ch;}
.bm-l1 .sh .close-note a{color:var(--timber);}

/* A-01 contents */
.bm-l1 .contents{list-style:none;margin:var(--s4) 0 0;padding:0;columns:2;column-gap:var(--s6);}
.bm-l1 .contents li{break-inside:avoid;padding:11px 0 11px var(--s4);position:relative;font-size:16px;
  border-bottom:1px solid var(--rule);}
.bm-l1 .contents li::before{content:"";position:absolute;left:0;top:22px;width:12px;height:1px;background:var(--brass);}
@media (max-width:760px){ .bm-l1 .contents{columns:1;} }

/* Definition list and hairline list — ported from the L2 stylesheet for the
   Region category (BluEnt_Millwork_Content_Regions_v1.md's dense
   term/description content), since no equivalent existed in the L1
   stylesheet before this. Same tokens, same 16px floor. */
.bm-l1 .deflist{list-style:none;margin:var(--s4) 0 0;padding:0;}
.bm-l1 .deflist>div{position:relative;padding:var(--s3) 0 var(--s3) var(--s4);border-top:1px solid var(--rule);}
.bm-l1 .deflist>div::before{content:"";position:absolute;left:0;top:calc(var(--s3) + 13px);width:14px;height:1px;background:var(--brass);}
.bm-l1 .deflist dt{font-size:16px;font-weight:500;color:var(--ink);margin:0;}
.bm-l1 .deflist dd{font-size:16px;line-height:1.65;margin:6px 0 0;}

.bm-l1 .hl-list{list-style:none;margin:var(--s4) 0 0;padding:0;}
.bm-l1 .hl-list li{position:relative;padding:12px 0 12px var(--s4);border-bottom:1px solid var(--rule);font-size:16px;}
.bm-l1 .hl-list li::before{content:"";position:absolute;left:0;top:22px;width:14px;height:1px;background:var(--brass);}
.bm-l1 .hl-list li strong{color:var(--ink);font-weight:500;}

/* A-02 comparison */
.bm-l1 .vs-tbl{border:1px solid var(--rule);background:var(--rule);display:grid;
  grid-template-columns:150px 1fr 1fr;gap:1px;margin-top:var(--s4);}
.bm-l1 .vs-tbl>div{background:var(--warm);padding:var(--s3);}
.bm-l1 .vs-tbl .hd{background:var(--ink);color:var(--bone);font-weight:600;font-size:16px;}
.bm-l1 .vs-tbl .rl{font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--timber-mid);background:var(--bone);}
.bm-l1 .vs-tbl .cell{font-size:16px;line-height:1.6;}
.bm-l1 .vs-tbl .cell.b{background:var(--paper);}
@media (max-width:820px){ .bm-l1 .vs-tbl{grid-template-columns:1fr !important;} .bm-l1 .vs-tbl .hd.blank{display:none;} }
/* Some pages set an inline grid-template-columns on .vs-tbl to define a
   2- or 3-column shape (the base rule above is 3-column by default).
   Inline styles beat this file's own media query on specificity alone,
   which silently broke the mobile collapse on every page using an
   inline override. !important on the mobile rule only restores the
   existing intended behaviour — no new column count, colour, spacing
   or breakpoint is introduced. */

/* Region "routing block" — 3-cell link grid (Sectors active here / Services
   that apply), required by BluEnt_Millwork_Content_Regions_v1.md's own
   [ROUTING BLOCK, 3 cells] markers. No equivalent text-only card grid
   existed before this — reuses existing tokens only, no new colours,
   fonts or shadows. */
.bm-l1 .rt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin-top:var(--s4);}
.bm-l1 .rt-card{display:block;border:1px solid var(--rule);padding:var(--s4);text-decoration:none;
  background:var(--paper);transition:border-color .2s var(--ease);}
.bm-l1 .rt-card:hover{border-color:var(--brass);}
.bm-l1 .rt-card h4{font-size:16px;font-weight:500;color:var(--ink);}
.bm-l1 .rt-card p{margin-top:6px;font-size:16px;line-height:1.5;color:var(--timber-mid);}
@media (max-width:900px){ .bm-l1 .rt-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:520px){ .bm-l1 .rt-grid{grid-template-columns:1fr;} }

/* A-03 sub-service index, not cards */
.bm-l1 .subidx{list-style:none;margin:var(--s4) 0 0;padding:0;border-top:1px solid var(--rule);}
.bm-l1 .subidx li{border-bottom:1px solid var(--rule);}
.bm-l1 .subidx a,.bm-l1 .subidx .is-pending{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s3);align-items:center;
  padding:var(--s4) 0;text-decoration:none;transition:padding-left .3s var(--ease);}
.bm-l1 .subidx a:hover{padding-left:10px;}
.bm-l1 .subidx h3{font-size:19px;letter-spacing:-.015em;}
.bm-l1 .subidx p{font-size:16px;margin-top:6px;max-width:62ch;}
.bm-l1 .subidx .go{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--timber-mid);display:inline-flex;align-items:center;gap:8px;white-space:nowrap;}
.bm-l1 .subidx a:hover .go{color:var(--timber);}
.bm-l1 .subidx a:hover .go svg{transform:translateX(4px);}
.bm-l1 .subidx .go svg{transition:transform .25s var(--ease);}
@media (max-width:740px){
  .bm-l1 .subidx a,.bm-l1 .subidx .is-pending{grid-template-columns:1fr;gap:var(--s2);}
  .bm-l1 .subidx .go{padding-top:10px;}
}
.bm-l1 .listed-one{margin-top:var(--s4);background:var(--bone);border-left:2px solid var(--timber-mid);
  padding:var(--s3) var(--s4);}
.bm-l1 .listed-one strong{display:block;font-size:16px;color:var(--ink);font-weight:500;}
.bm-l1 .listed-one span{display:block;font-size:16px;margin-top:8px;line-height:1.6;}
.bm-l1 .listed-one span a{color:var(--timber);}
.bm-l1 .listed-one em{display:inline-block;margin-top:11px;font-style:normal;font-size:10px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--brass);}

/* A-04 rejection causes */
.bm-l1 .causes{list-style:none;margin:var(--s4) 0 0;padding:0;}
.bm-l1 .causes li{position:relative;padding:var(--s3) 0 var(--s3) var(--s4);
  border-top:1px solid var(--rule);font-size:16px;}
.bm-l1 .causes li::before{content:"";position:absolute;left:0;top:calc(var(--s3) + 13px);
  width:14px;height:1px;background:var(--brass);}
.bm-l1 .causes li strong{display:block;color:var(--ink);font-weight:500;margin-bottom:4px;}
.bm-l1 .needs-fact{margin-top:var(--s4);padding:var(--s3) var(--s4);background:var(--bone-2);
  border-left:2px solid var(--timber-mid);font-size:16px;color:var(--timber-mid);}

/* A-05 process, 2-col tiles, last one wide */
.bm-l1 .proc-l{list-style:none;margin:var(--s4) 0 0;padding:0;
  display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);}
.bm-l1 .proc-l li{background:var(--warm);padding:var(--s4);position:relative;}
.bm-l1 .proc-l li::before{content:"";display:block;width:22px;height:1px;background:var(--brass);margin-bottom:14px;}
.bm-l1 .proc-l li strong{display:block;font-size:16px;color:var(--ink);font-weight:500;}
.bm-l1 .proc-l li span{display:block;font-size:16px;line-height:1.6;margin-top:8px;}
.bm-l1 .proc-l li.wide{grid-column:1/-1;background:var(--bone);}
@media (max-width:640px){ .bm-l1 .proc-l{grid-template-columns:1fr;} .bm-l1 .proc-l li.wide{grid-column:1;} }

/* in-section figures */
.bm-l1 .shfig{margin:var(--s5) 0 0;overflow:hidden;}
.bm-l1 .shfig img{width:100%;height:clamp(260px,30vw,400px);object-fit:cover;background:var(--bone-2);display:block;}
.bm-l1 .shfig figcaption{margin-top:12px;font-size:13px;color:var(--timber-mid);}

/* A-06 retention */
.bm-l1 .ret-note{background:var(--ink);color:rgba(246,241,233,.74);padding:var(--s5);margin-top:var(--s4);}
.bm-l1 .ret-note h3{color:var(--bone);font-size:21px;}
.bm-l1 .ret-note p{margin-top:var(--s3);font-size:16px;max-width:72ch;}
.bm-l1 .ret-note p a{color:var(--brass-lift);}
.bm-l1 .ret-note .btn{margin-top:var(--s4);}

/* ============ PORTFOLIO strip ============ */
.bm-l1 .pstrip{background:var(--bone);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);}
.bm-l1 .pstrip-hd{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s4);
  margin-bottom:var(--s5);flex-wrap:wrap;}
.bm-l1 .pstrip-hd h2{font-size:clamp(24px,2.7vw,34px);}
.bm-l1 .pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s3);}
.bm-l1 .pcard{position:relative;overflow:hidden;text-decoration:none;display:block;background:var(--ink-2);}
.bm-l1 .pcard img{width:100%;height:230px;object-fit:cover;transition:transform .7s var(--ease),opacity .5s var(--ease);}
.bm-l1 .pcard:hover img{transform:scale(1.05);opacity:.82;}
.bm-l1 .pcard .cap{position:absolute;left:0;right:0;bottom:0;padding:var(--s3);
  background:linear-gradient(transparent,rgba(23,18,16,.9));}
.bm-l1 .pcard h3{font-size:16px;color:var(--bone);}
.bm-l1 .pcard small{display:block;margin-top:4px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--brass-lift);}
.bm-l1 .req{margin-top:var(--s4);font-size:16px;letter-spacing:.06em;color:var(--timber-mid);
  border:1px dashed var(--rule);padding:var(--s3) var(--s4);background:var(--paper);}
.bm-l1 .req a{color:var(--timber);}
@media (max-width:900px){ .bm-l1 .pgrid{grid-template-columns:1fr 1fr;} }

/* ============ CASE STUDY — exact component from the Hub (.case-cta/.cs),
   real destination, not the reference build's own dashed-border placeholder. ============ */
.bm-l1 .case-cta{background:var(--warm);}
.bm-l1 .cs{border:1px solid var(--rule);background:var(--paper);
  display:grid;grid-template-columns:1fr auto;gap:var(--s4);align-items:center;padding:var(--s4);}
.bm-l1 .cs h3{font-size:18px;font-weight:500;}
.bm-l1 .cs p{font-size:16px;margin-top:6px;color:var(--timber-mid);}
.bm-l1 .cs a{font-size:16px;font-weight:600;color:var(--timber);white-space:nowrap;
  display:inline-flex;align-items:center;gap:8px;}
@media (max-width:760px){ .bm-l1 .cs{grid-template-columns:1fr;gap:var(--s3);text-align:left;} }
@media (max-width:520px){ .bm-l1 .pgrid{grid-template-columns:1fr;} }

/* ============ MINI FORM — bone, bordered, copy left / 2-col field grid right ============ */
.bm-l1 .mini{background:var(--bone);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);}
.bm-l1 .mini-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:var(--s6);align-items:center;}
.bm-l1 .mini h2{font-size:clamp(26px,3vw,38px);}
.bm-l1 .mini .sub{margin-top:var(--s3);font-size:17.5px;}
.bm-l1 .mini .rea{margin-top:var(--s3);font-size:16px;color:var(--timber-mid);}
@media (max-width:940px){ .bm-l1 .mini-grid{grid-template-columns:1fr;gap:var(--s5);} }
/* Force Gravity Form 30's own field layout to match .mini form{grid-template-columns:1fr 1fr}
   — using GF's own gfield--width-half/--width-full semantic classes with flexbox, not a
   generic nth-child grid. A CSS grid with display:contents breaks here because GF's legacy
   theme (gform-theme--no-framework) inserts a honeypot anti-spam field before the real
   fields in DOM order, which silently consumes the first grid cell and pushes every visible
   field into the wrong slot — flex-wrap with explicit widths is immune to that, since the
   honeypot's own width class (full-width, visually hidden by Gravity Forms' own CSS) just
   takes its own row instead of stealing a column. */
.bm-l1 .mini .gform_wrapper .gform_fields{display:flex;flex-wrap:wrap;gap:0 var(--s4);list-style:none;padding:0;margin:0;}
.bm-l1 .mini .gform_wrapper .gfield{width:100%;margin-top:var(--s3) !important;}
.bm-l1 .mini .gform_wrapper .gfield--width-half{width:calc(50% - (var(--s4) / 2));}
.bm-l1 .mini .gform_wrapper .gform_footer{width:100%;}
@media (max-width:560px){ .bm-l1 .mini .gform_wrapper .gfield--width-half{width:100%;} }

/* ============ RELATED PAGES RAIL (rail2) — warm, 4 columns + lead-link ============ */
.bm-l1 .rail2{background:var(--warm);}
.bm-l1 .rail2-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s5);}
.bm-l1 .rail2 h4{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--timber-mid);
  font-weight:600;padding-bottom:var(--s2);border-bottom:1px solid var(--rule);margin-bottom:var(--s3);}
.bm-l1 .rail2 ul{list-style:none;margin:0;padding:0;}
.bm-l1 .rail2 li{margin-bottom:11px;}
.bm-l1 .rail2 a,.bm-l1 .rail2 .is-pending{font-size:16px;text-decoration:none;color:var(--ink-soft);transition:color .25s var(--ease);}
.bm-l1 .rail2 a:hover{color:var(--timber);}
.bm-l1 .rail2 .lead-link{display:block;margin-top:var(--s5);font-size:16px;font-weight:600;color:var(--timber);
  text-decoration:none;padding-top:var(--s3);border-top:1px solid var(--rule);}
@media (max-width:900px){ .bm-l1 .rail2-grid{grid-template-columns:1fr 1fr;gap:var(--s4);} }
@media (max-width:520px){ .bm-l1 .rail2-grid{grid-template-columns:1fr;} }

/* ============ MATERIAL BAND ============ */
.bm-l1 .band{position:relative;padding:0;overflow:hidden;background:var(--ink);}
.bm-l1 .band canvas{position:absolute;inset:0;z-index:2;pointer-events:none;}
.bm-l1 .band .ov{position:absolute;inset:0;z-index:3;display:flex;align-items:center;height:clamp(230px,25vw,320px);
  background:linear-gradient(90deg,rgba(23,18,16,.92) 12%,rgba(23,18,16,.44) 62%,rgba(23,18,16,.24));}
.bm-l1 .band .ov .wrap{width:100%;}
.bm-l1 .band p{max-width:34ch;font-size:clamp(20px,2.4vw,30px);line-height:1.3;color:var(--bone);
  font-weight:500;letter-spacing:-.025em;}

/* ============ FAQ — exact chevron arrow ============ */
.bm-l1 .faq{background:var(--paper);}
.bm-l1 .faq .eyebrow{gap:0;}
.bm-l1 .faq .eyebrow::before{display:none;}
.bm-l1 .faq-list{border-top:1px solid var(--rule);max-width:940px;}
.bm-l1 .faq-list details{border-bottom:1px solid var(--rule);}
.bm-l1 .faq-list summary{list-style:none;cursor:pointer;padding:var(--s4) var(--s6) var(--s4) 0;font-size:18px;font-weight:500;
  color:var(--ink);position:relative;letter-spacing:-.01em;}
.bm-l1 .faq-list summary::-webkit-details-marker{display:none;}
.bm-l1 .faq-list summary::after{content:"";position:absolute;right:10px;top:50%;width:11px;height:11px;
  border-right:1.5px solid var(--timber-mid);border-bottom:1.5px solid var(--timber-mid);
  transform:translateY(-70%) rotate(45deg);transition:transform .3s var(--ease);}
.bm-l1 .faq-list details[open] summary::after{transform:translateY(-25%) rotate(-135deg);}
.bm-l1 .faq-list details .a{padding:0 var(--s6) var(--s4) 0;font-size:16px;max-width:74ch;}
.bm-l1 .faq-list details .a a{color:var(--timber);text-underline-offset:3px;}

/* ============ FOOTER CONVERSION (fconv) — ink, long Gravity Form 20 ============ */
.bm-l1 .fconv{background:var(--ink);color:rgba(246,241,233,.74);}
.bm-l1 .fconv-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:var(--s7);align-items:start;}
.bm-l1 .fconv h2{color:var(--bone);font-size:clamp(28px,3.4vw,44px);}
.bm-l1 .fconv .sub{margin-top:var(--s3);font-size:17.5px;color:rgba(246,241,233,.72);}
.bm-l1 .fconv .why{list-style:none;margin:var(--s5) 0 0;padding:0;}
.bm-l1 .fconv .why li{font-size:16px;color:rgba(246,241,233,.66);padding:11px 0 11px var(--s3);
  border-top:1px solid var(--rule-d);position:relative;}
.bm-l1 .fconv .why li::before{content:"";position:absolute;left:0;top:22px;width:10px;height:1px;background:var(--brass);}
.bm-l1 .gform-box{background:rgba(246,241,233,.05);border:1px solid var(--rule-d);padding:var(--s5) var(--s4);}
.bm-l1 .gform-box h3{color:var(--bone);font-size:20px;}
.bm-l1 .gform-box .fh{font-size:16px;margin-top:10px;color:rgba(246,241,233,.55);}
@media (max-width:940px){ .bm-l1 .fconv-grid{grid-template-columns:minmax(0,1fr);gap:var(--s5);} }

/* brochure-style link */
.bm-l1 .broch{display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-size:16px;font-weight:500;
  color:var(--timber);border-bottom:1px solid var(--rule);padding-bottom:6px;transition:border-color .3s var(--ease);margin-top:var(--s5);}
.bm-l1 .broch:hover{border-bottom-color:var(--brass);}
.bm-l1 .broch svg{flex:none;}
.bm-l1 .broch .arw{transition:transform .25s var(--ease);display:inline-block;}
.bm-l1 .broch:hover .arw{transform:translateY(2px);}

/* ============ GRAVITY FORMS — re-skinned to brand tokens ============ */
.bm-l1 .gform_wrapper{max-width:none !important;}
.bm-l1 .gform_wrapper .gform_heading{display:none;}
.bm-l1 .gform_wrapper .gfield{margin-top:var(--s3) !important;}
.bm-l1 .gform_wrapper label.gfield_label{
  display:block;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--timber-mid);margin-bottom:8px !important;
}
.bm-l1 .fconv .gform_wrapper label.gfield_label{color:var(--brass-lift);}
.bm-l1 .gform_wrapper input[type=text],
.bm-l1 .gform_wrapper input[type=email],
.bm-l1 .gform_wrapper input[type=tel],
.bm-l1 .gform_wrapper textarea,
.bm-l1 .gform_wrapper select{
  width:100% !important;background:transparent !important;border:0 !important;
  border-bottom:1px solid var(--rule) !important;border-radius:0 !important;
  color:var(--ink) !important;font-family:var(--sans) !important;font-size:16px !important;
  padding:9px 0 !important;box-shadow:none !important;transition:border-color .3s var(--ease);
}
.bm-l1 .fconv .gform_wrapper input,
.bm-l1 .fconv .gform_wrapper textarea{color:var(--bone) !important;border-bottom-color:var(--rule-d) !important;}
.bm-l1 .gform_wrapper input:focus,
.bm-l1 .gform_wrapper textarea:focus,
.bm-l1 .gform_wrapper select:focus{outline:none !important;border-bottom-color:var(--brass) !important;}
.bm-l1 .gform_wrapper .gform_footer{margin-top:var(--s4) !important;padding:0 !important;}
.bm-l1 .gform_wrapper .gform_button{
  display:inline-flex !important;align-items:center;gap:8px;
  background:var(--brass) !important;color:#1a1208 !important;
  border:none !important;border-radius:24px !important;padding:16px 30px !important;
  font-size:16px !important;font-weight:600 !important;cursor:pointer;
  width:100%;justify-content:center;text-transform:none !important;
  transition:transform .25s var(--ease),background .25s var(--ease);
}
.bm-l1 .gform_wrapper .gform_button:hover{transform:translateY(-2px);background:var(--brass-lift) !important;}
.bm-l1 .gform_wrapper .gform_validation_container{display:none !important;}
.bm-l1 .gform_wrapper .validation_message{color:#b3261e !important;font-size:16px !important;margin-top:4px !important;}
.bm-l1 .gform_confirmation_message{font-size:16px;color:var(--timber);}

/* ============ TESTIMONIAL SLIDER — real content, same component as the Hub.
   Not part of the original reference build's L1 page - added per direct
   instruction to use the same approach as the Hub everywhere. ============ */
.bm-l1 .tst{background:var(--bone);}
.bm-l1 .tst-slider{max-width:1140px;}
.bm-l1 .tst-track{display:flex;align-items:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;}
.bm-l1 .tst-track::-webkit-scrollbar{display:none;height:0;}
.bm-l1 .tst-in{flex:0 0 100%;min-width:0;max-width:1140px;scroll-snap-align:start;border-left:2px solid var(--brass);padding-left:var(--s5);margin:0;}
.bm-l1 .tst-in .lab{font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);}
.bm-l1 .tst-in blockquote{margin:var(--s4) 0 0;font-size:clamp(21px,2.6vw,30px);line-height:1.4;color:var(--ink);font-weight:400;letter-spacing:-.02em;}
.bm-l1 .tst-in figcaption{margin-top:var(--s4);font-size:13.5px;color:var(--timber-mid);}
.bm-l1 .tst-nav{display:flex;align-items:center;justify-content:flex-start;gap:var(--s5);margin-top:var(--s6);}
.bm-l1 .tst-arw{width:48px;height:48px;border-radius:50%;border:1px solid var(--timber-mid);background:var(--paper);
  color:var(--ink);font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex:none;
  transition:border-color .25s var(--ease),background .25s var(--ease),transform .25s var(--ease);}
.bm-l1 .tst-arw:hover{border-color:var(--timber);background:var(--timber);color:var(--bone);transform:translateY(-2px);}
.bm-l1 .tst-dots{display:flex;align-items:center;gap:12px;}
.bm-l1 .tst-dot{width:11px;height:11px;border-radius:50%;background:transparent;border:1.5px solid var(--timber-mid);
  padding:0;cursor:pointer;transition:background .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease);}
.bm-l1 .tst-dot:hover{border-color:var(--timber);}
.bm-l1 .tst-dot[aria-selected="true"]{background:var(--brass);border-color:var(--brass);transform:scale(1.2);}
@media (max-width:640px){ .bm-l1 .tst-in{padding-left:var(--s3);} }

/* ============ CLOSING CTA BAND — Batch 1's own block, primary + secondary pair.
   Not in the original reference build's L1 page (which goes straight from FAQ
   to the long enquiry form) - added because Batch 1 explicitly requires a
   distinct closing band ahead of the fconv form, same pattern as the Hub. ============ */
.bm-l1 .close{background:var(--ink);color:rgba(246,241,233,.74);}
.bm-l1 .close .inner{max-width:820px;}
.bm-l1 .close h2{color:var(--bone);font-size:clamp(30px,3.9vw,50px);}
.bm-l1 .close p{margin-top:var(--s3);font-size:17.5px;}
.bm-l1 .close .alt{margin-top:var(--s5);display:flex;flex-wrap:wrap;gap:var(--s2);}

@media (prefers-reduced-motion:reduce){
  .bm-l1 .btn:hover{transform:none;}
  .bm-l1 .pcard:hover img{transform:none;}
}

/* ── Gravity Forms confirmation card ── */
.gform_confirmation_message,
.gform_confirmation_wrapper{ padding:0; margin:0; border:0; }

.bl-thanks{
  box-sizing:border-box;
  max-width:680px;
  margin:0 auto;
  padding:48px 32px 44px;
  text-align:center;
  background:#F6F1E9;
  border:1px solid rgba(59,50,43,.10);
  border-radius:18px;
  font-family:Poppins, system-ui, sans-serif;
  color:#4A4038;
}
.bl-thanks *{ box-sizing:border-box; }

/* check badge */
.bl-thanks__badge{
  position:relative;
  display:block;
  width:78px; height:78px;
  margin:0 auto 28px;
  border:1px solid rgba(185,143,69,.45);
  border-radius:50%;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B98F45' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") no-repeat center/32px 32px;
}
.bl-thanks__badge::before,
.bl-thanks__badge::after{
  content:"\2726";
  position:absolute; top:26px;
  font-size:13px; line-height:1;
  color:rgba(185,143,69,.55);
}
.bl-thanks__badge::before{ left:-26px; }
.bl-thanks__badge::after{ right:-26px; }

/* title + gold hairline */
.bl-thanks__title{
  margin:0 0 26px !important;
  font-size:clamp(22px, 3.2vw, 30px)!important;
  font-weight:700 !important;
  line-height:1.3 !important;
  letter-spacing:-.01em !important;
  color:var(--timber-mid) !important;
}
.bl-thanks__title::after{
  content:"";
  display:block;
  width:78px; height:1px;
  margin:22px auto 0;
  background:#C9A867;
}

.bl-thanks__lede {
    margin: 10px 0 16px !important;
    font-size: 17px;
    line-height: 1.65;
    color: var(--timber-mid);
}

/* dotted divider with sprig */
.bl-thanks__ornament{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:46px;
  margin:0 0 26px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B98F45' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22V9'/%3E%3Cpath d='M12 12C12 7 9 3 5 2c0 5 3 9 7 10z'/%3E%3Cpath d='M12 12c0-5 3-9 7-10 0 5-3 9-7 10z'/%3E%3C/svg%3E") no-repeat center/22px 22px;
}
.bl-thanks__ornament::before,
.bl-thanks__ornament::after{
  content:"";
  flex:0 1 150px;
  border-top:2px dotted rgba(185,143,69,.45);
}

.bl-thanks__more{
  margin:0 0 32px !important;
  font-size:17px;
  line-height:1.65;
  color:var(--timber-mid);
}

/* buttons */
.bl-thanks__actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:14px;
}
.bl-thanks__btn{
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:15px 30px;
  font-size:16px;
  font-weight:500;
  line-height:1;
  text-decoration:none;
  color:#fff !important;
  background:#2400A1;
  border-radius:999px;
  transition:background-color .2s, transform .15s, box-shadow .2s;
}
.bl-thanks__btn:hover{
  background:#1B0079;
  transform:translateY(-1px);
  box-shadow:0 8px 20px rgba(36,0,161,.22);
  color:#fff !important;
}
.bl-thanks__btn:focus-visible{
  outline:2px solid #C9A867;
  outline-offset:3px;
}
.bl-thanks__btn::before{
  content:"";
  flex:0 0 19px; width:19px; height:19px;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
}
.bl-thanks__btn--work::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='7' width='20' height='14' rx='2'/%3E%3Cpath d='M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3C/svg%3E");
}
.bl-thanks__btn--blog::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E");
}
.bl-thanks__btn--case::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.3' stroke-linecap='round'%3E%3Cline x1='6' y1='20' x2='6' y2='16'/%3E%3Cline x1='12' y1='20' x2='12' y2='10'/%3E%3Cline x1='18' y1='20' x2='18' y2='4'/%3E%3C/svg%3E");
}

@media (max-width:600px){
  .bl-thanks{ padding:36px 20px 32px; border-radius:14px; }
  .bl-thanks br{ display:none; }
  .bl-thanks__lede,
  .bl-thanks__more{ font-size:15.5px; }
  .bl-thanks__ornament{ gap:30px; }
  .bl-thanks__ornament::before,
  .bl-thanks__ornament::after{ flex:0 1 90px; }
  .bl-thanks__btn{ width:100%; justify-content:center; padding:14px 22px; }
}

/* ── Attach drawings pill — Form 20 / Field 19 ── */
#field_20_19{
  display:flex; align-items:center; flex-wrap:wrap;
  gap:14px 18px; margin-top:6px;
}

/* label = pill trigger */
#field_20_19 > .gfield_label{
  display:inline-flex; align-items:center; gap:10px;
  margin:0; padding:13px 24px 13px 20px;
  font-size:14px; font-weight:600; line-height:1;
  letter-spacing:0; text-transform:none;
  color:#F2ECE1; background:transparent;
  border:1px solid rgba(242,236,225,.30);
  border-radius:999px; cursor:pointer;
  user-select:none; -webkit-user-select:none;
  transition:border-color .2s, background-color .2s, transform .15s;
}
#field_20_19 > .gfield_label::before{
  content:""; flex:0 0 16px; width:16px; height:16px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F2ECE1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='17 8 12 3 7 8'/%3E%3Cline x1='12' y1='3' x2='12' y2='15'/%3E%3C/svg%3E") no-repeat center/contain;
}
#field_20_19 > .gfield_label:hover{
  border-color:#D6A758; background:rgba(214,167,88,.08);
}
#field_20_19 > .gfield_label:active{ transform:translateY(1px); }
#field_20_19:focus-within > .gfield_label{
  border-color:#D6A758; box-shadow:0 0 0 3px rgba(214,167,88,.18);
}

/* container inline, native input hidden (accessible) */
#field_20_19 .ginput_container_fileupload{
  display:flex; align-items:center; flex-wrap:wrap;
  gap:10px; margin:0; flex:1 1 auto;
}
#field_20_19 input[type="file"]{
  position:absolute !important; width:1px; height:1px;
  padding:0; margin:-1px; border:0; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap;
}

/* helper text */
#gfield_upload_rules_20_19{
  margin:0; padding:0; font-size:13px;
  color:rgba(242,236,225,.45);
}

/* selected-file chip */
#field_20_19 .bl-file-chip{
  display:none; align-items:center; gap:8px; max-width:100%;
  padding:7px 8px 7px 14px; font-size:13px; color:#F2ECE1;
  background:rgba(246,241,233,.07);
  border:1px solid rgba(242,236,225,.18);
  border-radius:999px;
}
#field_20_19.has-file .bl-file-chip{ display:inline-flex; }
#field_20_19.has-file #gfield_upload_rules_20_19{ display:none; }
#field_20_19 .bl-file-chip__name{
  max-width:24ch; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap;
}
#field_20_19 .bl-file-chip__x{
  all:unset; cursor:pointer; width:20px; height:20px;
  border-radius:50%; display:grid; place-items:center;
  font-size:15px; line-height:1; color:rgba(242,236,225,.6);
}
#field_20_19 .bl-file-chip__x:hover{
  background:rgba(242,236,225,.12); color:#F2ECE1;
}

@media (max-width:520px){
  #field_20_19{ gap:12px; }
  #gfield_upload_rules_20_19{ flex-basis:100%; }
}