/* SURFACE 50 · Blake's Bricks · /legacybricks/ · page layer (Opus 5.5 pass, 2026-10-22)
   Loads after styles.css, v13-shared.css, mini-cart.css, voice-polish.css (the 36-wine set). Scoped to main.bk and
   .bk-*; the one rule outside main is the paper ground on body.light-warm, as on 36-wine. Tokens: .light-warm in
   v13-shared.css. Grounds: paper (open) · card (barn) · paper (bricks) · gray closer · dark signature band. */

main.bk{display:block;--focus-ring:var(--burgundy)}
main.bk :where(a:not(.btn)){color:var(--burgundy)}
main.bk :where(a:not(.btn)):hover{color:#3D0000}
.bk-wrap{max-width:1280px;margin:0 auto;padding:0 56px}
.bk-vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.bk-sec{padding:clamp(84px,9vw,120px) 0;border-top:1px solid var(--rule-warm-2)}
.bk-paper{background:var(--paper)}
.bk-card{background:var(--card)}

/* TYPE · Cormorant 500 only on paper; second line italic gray, one accent word in burgundy (canon § 4) */
.bk-h1,.bk-h2{margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;color:var(--ink-warm);text-wrap:balance}
.bk-h1{font-size:var(--type-hero);line-height:.96;letter-spacing:-.016em}
.bk-h2{font-size:clamp(40px,4.8vw,68px);line-height:1;letter-spacing:-.012em}
.bk-h1 em,.bk-h2 em{font-style:italic;font-weight:500;color:var(--ink-warm-2)}
.bk-acc{color:var(--burgundy)}
.bk-lede{margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:500;font-size:clamp(23px,2.1vw,28px);line-height:1.34;color:var(--ink-warm-2);text-wrap:pretty}
.bk-p{margin:0;max-width:62ch;font-family:"Lora",Georgia,serif;font-size:18px;line-height:1.7;color:var(--ink-warm-2);text-wrap:pretty}

/* BUTTONS · the 36-wine pair: same size, never wrap */
.bk-ctas{display:flex;flex-wrap:wrap;gap:14px;align-items:stretch;max-width:620px}
.bk-ctas .btn,.bk-order .btn{font-weight:600;font-size:13px;min-height:52px;flex:1 1 0;min-width:max-content;justify-content:center;white-space:nowrap}
.bk-ctas .btn:only-child{flex:0 0 auto}
.bk-ctas .btn-primary,.bk-order .btn-primary{background:var(--burgundy);color:var(--paper);border:1px solid var(--burgundy);box-shadow:0 12px 34px -14px rgba(82,0,0,.5)}
.bk-ctas .btn-primary:hover,.bk-order .btn-primary:hover{background:#3D0000;border-color:#3D0000;color:var(--paper);transform:translateY(-1px)}
.bk-ctas .btn-outline{border:1px solid rgba(82,0,0,.45);color:var(--burgundy);background:transparent}
.bk-ctas .btn-outline:hover{border-color:var(--burgundy);background:rgba(82,0,0,.05);color:var(--burgundy)}

/* PHOTOS · hairline frame + inset so they don't sit pasted on */
.bk-fig{margin:0}
.bk-photo{position:relative;overflow:hidden;background:var(--card-2);border:1px solid var(--rule-warm-2)}
.bk-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.96) contrast(1.03)}
.bk-photo::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);pointer-events:none}

/* OPEN · light editorial open (36-wine): one statement, two CTAs, one image */
.bk-hero{padding:clamp(56px,7vw,96px) 0 clamp(72px,8vw,112px);background:var(--paper)}
.bk-hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(40px,6vw,88px);align-items:center}
.bk-hero .bk-ctas{margin-top:clamp(32px,3.4vw,48px)}
.bk-hero .bk-ctas .btn{min-width:272px}
.bk-hero .bk-photo{aspect-ratio:4/5}
/* One swappable hero image (11-04): nudge the crop with --bk-hero-pos on the figure. */
.bk-hero .bk-photo img{object-position:var(--bk-hero-pos,50% 50%);filter:contrast(1.03)}

/* BARN · Blake first, then the client's two paragraphs */
.bk-barn-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,96px);align-items:start}
.bk-barn-grid .bk-fig{position:sticky;top:112px}
.bk-barn .bk-photo{aspect-ratio:4/5}
.bk-barn .bk-photo img{object-position:50% 100%}
.bk-barn-body{display:flex;flex-direction:column;gap:24px;padding-top:clamp(0px,1vw,12px)}
.bk-barn-body .bk-h2{margin-bottom:8px}
/* 11-04: the lede runs the paragraphs' measure, one 620px column for all three. */
.bk-barn-body{max-width:620px}
.bk-barn-body .bk-lede,.bk-barn-body .bk-p{max-width:none}
.bk-barn-body .bk-ctas{margin-top:12px}

/* BRICKS · intro (copy + the walkway), five same-size informational cards, one order link */
.bk-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:center}
.bk-intro-copy{display:flex;flex-direction:column;gap:26px}
.bk-intro .bk-photo{aspect-ratio:3/2}
.bk-intro .bk-photo img{object-position:50% 70%}
.bk-opts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-top:clamp(56px,6vw,88px)}
.bk-opt{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--rule-warm-2);-webkit-tap-highlight-color:transparent;transition:border-color .3s ease,box-shadow .3s ease}






.bk-stage{position:relative;display:grid;place-items:center;aspect-ratio:4/3;background:var(--card);border-bottom:1px solid var(--rule-warm);overflow:hidden}
.bk-opt-body{display:flex;flex-direction:column;flex:1;padding:18px 20px 22px}
.bk-opt-name{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:26px;line-height:1.05;letter-spacing:-.006em;color:var(--ink-warm)}
.bk-opt-kind{margin-top:2px;font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:500;font-size:21px;line-height:1.2;color:var(--rhino-warm)}
.bk-opt-spec{margin-top:12px;font-family:"Lora",Georgia,serif;font-size:15px;line-height:1.5;color:var(--ink-warm-2)}
.bk-opt-price{margin-top:auto;padding-top:18px;font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:34px;line-height:1;color:var(--burgundy);font-variant-numeric:lining-nums}

/* Brick face · a to-scale product diagram, not a photo: 4×8 is half the height of 8×8 at the same width.
   Bars stand for engraved lines (no tiny sample text); the mark stands for clip art. */
.bk-face{position:relative;container-type:inline-size;display:block;width:58%;aspect-ratio:1/1;background:color-mix(in oklab,var(--land) 66%,var(--acacia) 34%);color:rgba(45,41,38,.8);box-shadow:inset 0 0 0 1px rgba(45,41,38,.16),inset 0 2px 0 rgba(255,255,255,.26),inset 0 -2px 0 rgba(45,41,38,.12);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.bk-face::before{content:"";position:absolute;inset:0;opacity:.3;mix-blend-mode:multiply;pointer-events:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/></filter><rect width='160' height='160' filter='url(%23n)' opacity='0.5'/></svg>")}
.bk-cut{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:5cqw;padding:9cqw}
.bk-face[data-size="4x8"]{aspect-ratio:2/1}
.bk-face[data-size="4x8"] .bk-cut{padding:6cqw 9cqw}
.bk-face[data-layout="stack"] .bk-cut{flex-direction:column;gap:6cqw}

.bk-lines{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4.4cqw;flex:1 1 auto;width:100%}
.bk-lines span{display:block;height:3.4cqw;border-radius:.6cqw;background:currentColor;box-shadow:inset 0 .5cqw 0 rgba(0,0,0,.2)}
.bk-lines span:nth-child(8n+1){width:70%}.bk-lines span:nth-child(8n+2){width:88%}.bk-lines span:nth-child(8n+3){width:58%}.bk-lines span:nth-child(8n+4){width:80%}
.bk-lines span:nth-child(8n+5){width:64%}.bk-lines span:nth-child(8n+6){width:84%}.bk-lines span:nth-child(8n+7){width:52%}.bk-lines span:nth-child(8n+8){width:74%}
.bk-mark{position:relative;flex:0 0 auto;display:block;width:34cqw;aspect-ratio:597/262;overflow:hidden}
.bk-mark img{display:block;width:100%;height:auto;filter:brightness(0);opacity:.86}
.bk-face[data-layout="row"] .bk-lines{width:auto;flex:0 1 auto}
.bk-face[data-layout="row"] .bk-lines span:nth-child(8n+1){width:36cqw}.bk-face[data-layout="row"] .bk-lines span:nth-child(8n+2){width:42cqw}.bk-face[data-layout="row"] .bk-lines span:nth-child(8n+3){width:30cqw}
.bk-face[data-layout="stack"] .bk-mark{width:38cqw}
.bk-face[data-layout="custom"] .bk-mark{width:62cqw}

.bk-order{display:grid;grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"go go go" "note note note";align-items:center;column-gap:clamp(24px,3vw,40px);row-gap:14px;margin-top:40px;padding:28px 0 30px;border-top:1px solid var(--rule-warm-2);border-bottom:1px solid var(--rule-warm-2)}
.bk-order .btn{grid-area:go;min-width:240px}
.bk-note{grid-area:note;justify-self:end;margin:0;max-width:52ch;font-family:"Lora",Georgia,serif;font-size:16px;line-height:1.6;color:var(--ink-warm-2);text-align:right;text-wrap:pretty}

/* CLOSE · gray pre-footer band (canon § 5: no shared token yet, so the oklab mix 36-wine uses) + dark signature band */
.bk-close{--bk-closer-gray:color-mix(in oklab,var(--rhino-warm) 16%,var(--paper));background:var(--bk-closer-gray);border-top:1px solid var(--rule-warm-2);padding:clamp(84px,9vw,120px) 0}
.bk-close-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(36px,5vw,72px);align-items:center}
.bk-close .bk-ctas{justify-self:end;width:100%}
.bk-close .bk-ctas .btn{min-width:230px}
.bk-close .btn-outline{border-color:var(--burgundy)}
.bk-dark{background:#1A1512;color:var(--ivory);padding:72px 0 76px;text-align:center}
.bk-dark .bk-wrap{display:flex;flex-direction:column;align-items:center;gap:22px}
.bk-sig{display:inline-flex;align-items:center;gap:22px;font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-weight:500;font-size:clamp(30px,3.4vw,44px);line-height:1;color:var(--ivory)}
.bk-sig::before,.bk-sig::after{content:"";width:48px;height:1px;background:var(--acacia)}
.bk-triad{font-family:"Josefin Sans",system-ui,sans-serif;font-size:12px;font-weight:600;letter-spacing:.34em;text-transform:uppercase;color:var(--acacia)}

/* RESPONSIVE */
@media (max-width:1180px){
  .bk-opts{display:flex;flex-wrap:wrap;justify-content:center}
  .bk-opt{flex:0 0 calc((100% - 32px) / 3)}
  .bk-close-grid{grid-template-columns:minmax(0,1fr);gap:36px}
  .bk-close .bk-ctas{justify-self:start}
}
@media (max-width:1024px){.bk-wrap{padding:0 40px}}
@media (max-width:900px){
  .bk-hero-grid,.bk-barn-grid,.bk-intro,.bk-close-grid{grid-template-columns:minmax(0,1fr);gap:40px}
  .bk-hero .bk-photo{aspect-ratio:1/1}
  .bk-barn-grid .bk-fig{position:static}
  .bk-barn .bk-photo{aspect-ratio:4/3}
  .bk-barn .bk-photo img{object-position:50% 70%}
  .bk-close .bk-ctas{justify-self:start}
}
@media (max-width:760px){
  .bk-opts{display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:1fr;gap:12px}
  .bk-opt{flex:0 0 auto;display:grid;grid-template-columns:132px minmax(0,1fr);align-items:stretch}
  .bk-stage{aspect-ratio:auto;min-height:132px;border-bottom:0;border-right:1px solid var(--rule-warm)}
  .bk-face{width:74%}
  .bk-opt-body{padding:16px 52px 18px 18px}
  .bk-opt-spec{margin-top:8px}
  .bk-opt-price{padding-top:12px;font-size:30px}

  .bk-order{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"go go" "note note";row-gap:18px}
  .bk-order .btn{min-width:0;width:100%}
  .bk-note{justify-self:start;text-align:left}
}
@media (max-width:640px){
  .bk-wrap{padding:0 22px}
  .bk-hero{padding-top:40px}
  .bk-ctas{max-width:none}
  .bk-ctas .btn,.bk-ctas .btn:only-child{flex:1 1 100%;min-width:0}
  .bk-p{font-size:17px}
  .bk-sig::before,.bk-sig::after{width:24px}
}
@media (max-width:420px){
  .bk-opt{grid-template-columns:104px minmax(0,1fr)}
  .bk-stage{min-height:120px}
  .bk-opt-name{font-size:24px}
  .bk-opt-kind{font-size:19px}
}
@media (prefers-reduced-motion:reduce){
  .bk-face,.bk-opt,
  .bk-opt:hover .bk-face{transform:none}
}

/* WordPress core-block adaptation; approved content-only cards, 2026-10-26. */
.bk{--paper:#FBF7EE;--card:#F4EEE0;--card-2:#EAE1CE;--land:#D8C6A0;--ink-warm:#2D2926;--ink-warm-2:#3A352F;--rhino-warm:#717271;--rule-warm:rgba(45,41,38,.10);--rule-warm-2:rgba(45,41,38,.18);--burgundy:#520000;--acacia:#B97727;--ivory:#F3F2ED;--type-hero:clamp(46px,6vw,84px);background:var(--paper);color:var(--ink-warm);font-family:Lora,Georgia,serif;}
.rhinory-page.bk{padding-bottom:0;}
.bk > *,.bk .wp-block-group > *{margin-block:0;}
.bk .bk-hero .bk-ctas{margin-top:clamp(32px,3.4vw,48px);}
.bk mark.bk-acc{background:transparent;color:var(--burgundy);}
.bk .bk-photo{margin:0;}
.bk .bk-opts{margin-top:clamp(56px,6vw,88px);}
.bk .bk-opt-body > p{margin:0;}
.bk .bk-opt-body .bk-opt-kind{margin-top:2px;}
.bk .bk-opt-body .bk-opt-spec{margin-top:12px;}
.bk .bk-opt-body .bk-opt-price{margin-top:auto;}
.bk .bk-order{margin-top:40px;}
.bk .bk-order-link{grid-area:go;margin:0;justify-self:end;}
.bk .bk-order .btn{display:inline-flex;}
.bk .btn{display:inline-flex;align-items:center;gap:12px;padding:16px 26px;font-family:"Josefin Sans",sans-serif;text-transform:uppercase;letter-spacing:.16em;text-decoration:none;line-height:1.25;border-radius:0;}
.bk .bk-arrow{font-family:Arial,sans-serif;}
.bk .bk-opt{cursor:default;}
.bk .bk-sig,.bk .bk-triad{margin:0;}
@media(max-width:760px){.bk .bk-order-link{width:100%;justify-self:stretch;}.bk .bk-opt-body{padding-right:18px;}}
.bk .bk-barn-body .bk-h2{margin-bottom:8px;}
.bk .bk-barn-body .bk-ctas{margin-top:12px;}

/* PHASE 1 POLISH (2026-11-04, prototype 50 § PHASE 1 POLISH) */
/* Visible breadcrumb, word for word the page's BreadcrumbList (inc/foundation-pages-head.php); 44px links */
.bk-crumb{padding:28px 0 0;background:var(--paper)}
.bk-crumb__trail{margin-top:0;margin-bottom:0;display:flex;flex-wrap:wrap;align-items:center;gap:0 11px;font-family:"Josefin Sans",system-ui,sans-serif;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;line-height:1.4;color:var(--ink-warm-2)}
.bk-crumb__sep{color:var(--rhino-warm)}
main.bk .bk-crumb a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink-warm-2);text-decoration:none;transition:color .2s}
main.bk .bk-crumb a:hover{color:var(--burgundy)}
.bk-crumb__current{color:var(--burgundy)}
.bk-crumb + .bk-hero{padding-top:clamp(24px,3.4vw,48px)}
/* Hero: one image, slow Ken Burns (1.02 to 1.10, once) */
@keyframes bkKb{from{transform:scale(1.02)}to{transform:scale(1.1)}}
.bk-hero .bk-photo img{transform-origin:50% 50%;animation:bkKb 24s cubic-bezier(.2,.7,.2,1) both}
/* Narrow phones: buttons may wrap instead of overflowing */
@media (max-width:480px){
  .bk-ctas .btn,.bk-order .btn,.bk-hero .bk-ctas .btn,.bk-close .bk-ctas .btn{min-width:0;white-space:normal;text-align:center;letter-spacing:.12em;line-height:1.4;padding-left:20px;padding-right:20px}
}
@media (prefers-reduced-motion:reduce){.bk-hero .bk-photo img{animation:none;transform:none}main.bk .bk-crumb a{transition:none}}