/* Double RR Buildings — interior-page components.
   New shared building blocks the homepage didn't need (breadcrumb, page hero,
   prose, spec table, accordion, comparison table, swatches, RTO calculator,
   gallery, etc.). Depends on the palette vars in site.css. */

/* ---- active nav state (set by partials.js from <body data-page>) ---- */
#topbar .nav-left > a.active, #topbar .nav-right > a.active,
#topbar .nav-left > .has-drop > a.active, #topbar .nav-right > .has-drop > a.active{
  color:var(--rust);
}
#topbar .nav-left > a.active::after, #topbar .nav-right > a.active::after{
  content:"";position:absolute;left:16px;right:16px;bottom:6px;height:2px;background:var(--rust);
}

/* ---- breadcrumb ---- */
.crumb{font-family:'Special Elite',monospace;font-size:12px;color:var(--wood-grey);
  padding:18px 0 0;display:flex;gap:8px;flex-wrap:wrap}
.crumb a{color:var(--gold-deep);text-decoration:none}
.crumb a:hover{color:var(--rust)}
.crumb span{color:var(--wood-grey)}

/* ---- page hero ---- */
.page-hero{position:relative;background:linear-gradient(180deg,var(--cream-2),var(--paper));
  border-bottom:1px solid var(--line);padding:34px 0 30px;overflow:hidden}
.page-hero.dark{background:linear-gradient(180deg,var(--ink),var(--ink-2));color:var(--cream)}
.page-hero.dark .lede{color:#d8cdb6}
.page-hero h1{font-size:clamp(30px,4vw,46px);font-weight:700;letter-spacing:.03em;margin:6px 0 0}
.page-hero .lede{font-size:18px;color:var(--wood);max-width:62ch;margin:12px 0 0}
.page-hero .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.page-hero .hero-photo{position:absolute;inset:0;z-index:0;opacity:.16;
  background-size:cover;background-position:center}
.page-hero .wrap{position:relative;z-index:1}

/* photo hero — full-bleed image with a readable scrim + light text */
.page-hero--photo{border-bottom:none;padding:0}
.page-hero--photo .hero-bg{position:absolute;inset:0;z-index:0;
  background-size:cover;background-position:center}
.page-hero--photo::after{content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(90deg,rgba(18,14,10,.84) 0%,rgba(18,14,10,.58) 42%,rgba(18,14,10,.12) 100%)}
.page-hero--photo .wrap{padding:84px 24px 76px}
.page-hero--photo .eyebrow{color:var(--gold)}
.page-hero--photo h1{color:var(--cream)}
.page-hero--photo .lede{color:#e7dcc6}
@media(max-width:760px){
  .page-hero--photo::after{background:linear-gradient(180deg,rgba(18,14,10,.62) 0%,rgba(18,14,10,.78) 100%)}
  .page-hero--photo .wrap{padding:56px 24px 52px}
}

/* ---- generic section + prose ---- */
.lede{font-size:18px;color:var(--wood)}
.prose{max-width:72ch}
.prose p{margin:0 0 16px}
.prose h2{margin:30px 0 10px}
.prose h3{margin:24px 0 8px;font-size:16px;letter-spacing:.06em}
.prose ul{margin:0 0 16px;padding-left:20px}
.prose li{margin:4px 0}
.muted{color:var(--wood-grey)}
.center{text-align:center}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:40px}
@media(max-width:880px){.two-col{grid-template-columns:1fr;gap:28px}}

/* ---- spec table (building detail) ---- */
.spec-table{width:100%;border-collapse:collapse;font-size:14px}
.spec-table th,.spec-table td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)}
.spec-table th{font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:.04em;color:var(--wood);
  width:42%;background:var(--cream-2)}

/* ---- size / starting-price chart ---- */
.size-chart{width:100%;border-collapse:collapse;font-size:14px;background:#fff;
  border:1px solid var(--line);border-radius:10px;overflow:hidden}
.size-chart th,.size-chart td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:left}
.size-chart thead th{background:var(--ink);color:var(--cream);font-family:'Oswald',sans-serif;
  letter-spacing:.06em;font-weight:600}
.size-chart td .price{font-family:'Bebas Neue',sans-serif;font-size:20px;color:var(--rust)}

/* ---- comparison table (financing) ---- */
.compare{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);
  border-radius:10px;overflow:hidden;font-size:14px}
.compare th,.compare td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.compare thead th{background:var(--wood);color:var(--cream);font-family:'Oswald',sans-serif;letter-spacing:.05em}
.compare tbody th{font-family:'Oswald',sans-serif;background:var(--cream-2);width:24%}

/* ---- video band (category walkthrough) ---- */
.video-band{position:relative;max-width:900px;margin:0 auto;border-radius:12px;
  overflow:hidden;background:#000;aspect-ratio:16/9;
  box-shadow:0 10px 30px rgba(60,40,20,.18)}
.video-band video{width:100%;height:100%;display:block;object-fit:cover}
.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:1100px;margin:0 auto}
@media(max-width:760px){.video-grid{grid-template-columns:1fr}}
.video-fig{margin:0}
.video-fig figcaption{text-align:center;font-size:13px;color:var(--wood-grey);margin-top:8px}

/* ---- building style cards ---- */
.styles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:960px){.styles-grid{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.styles-grid{grid-template-columns:1fr}}
.style-card{background:#fff;border:1px solid var(--line);border-radius:10px;
  overflow:hidden;box-shadow:0 6px 16px rgba(60,40,20,.08);display:flex;flex-direction:column}
.style-card__img{aspect-ratio:4/3;overflow:hidden;background:var(--cream-2);position:relative}
.style-card__img--placeholder{background:var(--cream-2)}
.style-card__img img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .3s ease}
.style-card:hover .style-card__img img{transform:scale(1.03)}
.style-card__badge{position:absolute;bottom:10px;right:10px;
  background:rgba(20,16,12,.78);color:#fff;font-size:12px;font-weight:600;
  padding:5px 10px;border-radius:20px;letter-spacing:.02em;pointer-events:none;
  opacity:.92;transition:opacity .2s ease}
.style-card--clickable{cursor:pointer}
.style-card--clickable:hover .style-card__badge{opacity:1}
.style-card--clickable:focus-visible{outline:3px solid var(--rust);outline-offset:2px}

/* ---- lightbox carousel ---- */
body.lb-open{overflow:hidden}
.lb[aria-hidden="true"]{display:none}
.lb{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center}
.lb__backdrop{position:absolute;inset:0;background:rgba(12,10,8,.92);cursor:zoom-out}
.lb__dialog{position:relative;z-index:1;display:flex;align-items:center;gap:8px;
  width:100%;max-width:1200px;padding:0 12px;box-sizing:border-box}
.lb__figure{margin:0;flex:1;display:flex;flex-direction:column;align-items:center;min-width:0}
.lb__img{max-width:100%;max-height:82vh;object-fit:contain;border-radius:6px;
  box-shadow:0 12px 40px rgba(0,0,0,.5);background:#000}
.lb__caption{margin-top:12px;color:var(--cream);font-size:14px;display:flex;
  gap:14px;align-items:baseline}
.lb__title{font-family:'Oswald',sans-serif;letter-spacing:.04em;font-weight:600}
.lb__counter{opacity:.7;font-size:13px}
.lb__close{position:absolute;top:-44px;right:12px;background:none;border:none;
  color:#fff;font-size:34px;line-height:1;cursor:pointer;padding:4px 10px;opacity:.85}
.lb__close:hover{opacity:1}
.lb__nav{flex:0 0 auto;background:rgba(255,255,255,.12);border:none;color:#fff;
  font-size:30px;line-height:1;width:48px;height:64px;border-radius:8px;cursor:pointer;
  transition:background .2s ease}
.lb__nav:hover{background:rgba(255,255,255,.24)}
.lb__close:focus-visible,.lb__nav:focus-visible{outline:3px solid var(--rust);outline-offset:2px}
@media(max-width:640px){
  .lb__nav{width:40px;height:52px;font-size:24px}
  .lb__img{max-height:72vh}
  .lb__close{top:-40px}
}
.style-card__body{padding:18px;flex:1;display:flex;flex-direction:column}
.style-card__name{font-family:'Oswald',sans-serif;font-size:18px;font-weight:600;
  letter-spacing:.03em;margin:0 0 4px;color:var(--ink)}
.style-card__tagline{font-size:13px;color:var(--wood-grey);margin:0 0 12px}
.style-card__specs{list-style:none;padding:0;margin:0 0 14px;font-size:13px;
  display:flex;flex-direction:column;gap:5px;flex:1}
.style-card__specs li{padding-left:18px;position:relative;color:var(--ink)}
.style-card__specs li::before{content:"✓";position:absolute;left:0;
  color:var(--rust);font-weight:700}
.style-card__price{font-family:'Bebas Neue',sans-serif;font-size:22px;
  color:var(--rust);margin:0;line-height:1}

/* ---- common-uses / feature cards ---- */
.uses-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:880px){.uses-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.uses-grid{grid-template-columns:1fr}}
.use-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px 18px;
  box-shadow:0 6px 16px rgba(60,40,20,.08)}
.use-card b{font-family:'Oswald',sans-serif;letter-spacing:.04em;display:block;margin-bottom:4px}
.use-card p{margin:0;font-size:14px;color:var(--wood-grey)}

/* ---- color/option swatches ---- */
.swatches{display:flex;flex-wrap:wrap;gap:14px}
.swatch{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;color:var(--wood-grey);width:84px;text-align:center}
.swatch .chip-color{width:54px;height:54px;border-radius:10px;border:2px solid #fff;
  background-size:cover;background-position:center;box-shadow:0 1px 3px rgba(0,0,0,.2)}
/* colors page: larger texture tiles + grouped sections + filter dimming */
.swatch-grid{display:flex;flex-wrap:wrap;gap:16px}
.swatch-grid .swatch{width:104px}
.swatch-grid .chip-color{width:88px;height:88px;border-radius:12px}
.color-group{margin:28px 0}
.color-group.is-dimmed{opacity:.28;filter:grayscale(.6)}
.color-group .group-note{font-size:13px;color:var(--wood-grey);margin:6px 0 0}
.color-filter{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 6px}
.color-filter .chip{cursor:pointer}
.color-filter .chip[aria-pressed="true"]{background:var(--rust);color:#fff;border-color:var(--rust)}

/* ---- accordion (FAQ / details) ---- */
.accordion details{background:#fff;border:1px solid var(--line);border-radius:10px;margin:0 0 10px;overflow:hidden}
.accordion summary{cursor:pointer;list-style:none;padding:16px 18px;font-family:'Oswald',sans-serif;
  font-weight:600;letter-spacing:.03em;font-size:16px;display:flex;justify-content:space-between;gap:12px}
.accordion summary::-webkit-details-marker{display:none}
.accordion summary::after{content:"+";color:var(--rust);font-size:22px;line-height:1}
.accordion details[open] summary::after{content:"–"}
.accordion details[open] summary{border-bottom:1px solid var(--line)}
.accordion .body{padding:14px 18px;font-size:15px;color:var(--ink-2)}
.faq-group{font-family:'Oswald',sans-serif;letter-spacing:.1em;color:var(--gold-deep);
  text-transform:none;font-size:13px;margin:26px 0 10px}

/* ---- steps (how-it-works) ---- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:step}
@media(max-width:880px){.steps{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.steps{grid-template-columns:1fr}}
.step{background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px 18px;position:relative}
.step::before{counter-increment:step;content:counter(step);font-family:'Bebas Neue',sans-serif;
  font-size:30px;color:var(--gold);display:block;line-height:1;margin-bottom:6px}
.step b{font-family:'Oswald',sans-serif;display:block;letter-spacing:.04em;margin-bottom:4px}
.step p{margin:0;font-size:14px;color:var(--wood-grey)}

/* ---- checklist (site prep) ---- */
.checklist{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
@media(max-width:680px){.checklist{grid-template-columns:1fr}}
.checklist li{position:relative;padding-left:30px;font-size:15px}
.checklist li::before{content:"✓";position:absolute;left:0;top:0;color:#fff;background:var(--green);
  width:20px;height:20px;border-radius:50%;font-size:12px;display:flex;align-items:center;justify-content:center}

/* ---- RTO calculator ---- */
.calc{background:#fff;border:1px solid var(--line);border-radius:12px;padding:22px 22px;
  box-shadow:0 8px 22px rgba(60,40,20,.1)}
.calc label{font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:.06em;color:var(--wood);display:block;margin:0 0 6px}
.calc input[type=number]{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:8px;font:inherit}
.calc input[type=range]{width:100%}
.calc .out{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}
.calc .out .term{background:var(--cream-2);border:1px solid var(--line);border-radius:10px;padding:14px;text-align:center}
.calc .out .term b{font-family:'Bebas Neue',sans-serif;font-size:30px;color:var(--rust);display:block;line-height:1}
.calc .out .term span{font-size:12px;color:var(--wood-grey)}

/* ---- testimonial cards ---- */
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:880px){.reviews-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.reviews-grid{grid-template-columns:1fr}}
.review{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px;box-shadow:0 6px 16px rgba(60,40,20,.08)}
.review .stars{color:var(--gold);letter-spacing:2px;font-size:16px}
.review p{font-size:15px;margin:8px 0 14px}
.review .who{font-family:'Oswald',sans-serif;letter-spacing:.04em;font-size:14px}
.review .who small{display:block;font-family:'Special Elite',monospace;color:var(--wood-grey);font-size:12px}

/* ---- gallery masonry ---- */
.masonry{columns:3 260px;column-gap:16px}
.masonry figure{margin:0 0 16px;break-inside:avoid;background:#fff;border:1px solid var(--line);
  border-radius:10px;overflow:hidden;box-shadow:0 6px 16px rgba(60,40,20,.1)}
.masonry img{width:100%;display:block}
.masonry figcaption{padding:10px 12px;font-size:13px;color:var(--wood-grey)}
.masonry figcaption b{font-family:'Oswald',sans-serif;color:var(--ink);display:block;letter-spacing:.03em}

/* ---- gallery empty / "coming soon" state ---- */
.gallery-empty{max-width:620px;margin:0 auto;text-align:center;padding:48px 24px;
  background:#fff;border:1px solid var(--line);border-radius:14px;
  box-shadow:0 6px 16px rgba(60,40,20,.08)}
.gallery-empty .eyebrow{color:var(--rust)}
.gallery-empty h2{margin:10px 0 12px}
.gallery-empty p{color:var(--wood-grey);margin:0 auto 22px;max-width:48ch;line-height:1.55}

/* ---- blog cards ---- */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:880px){.post-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.post-grid{grid-template-columns:1fr}}
.post{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 6px 16px rgba(60,40,20,.08)}
.post .ph{height:150px;background:linear-gradient(180deg,#dccaa3,#9c7c4f)}
.post .pad{padding:16px 18px}
.post .pad b{font-family:'Oswald',sans-serif;letter-spacing:.03em;display:block;margin-bottom:6px;font-size:17px}
.post .pad p{margin:0;font-size:14px;color:var(--wood-grey)}

/* ---- callout band ---- */
.cta-band{background:linear-gradient(180deg,var(--ink),var(--ink-2));color:var(--cream);
  border-radius:14px;padding:30px 28px;text-align:center;margin:0 auto}
.cta-band h2{color:var(--cream)}
.cta-band .lede{color:#d8cdb6;margin:8px auto 18px;max-width:60ch}

/* ---- map embed (real iframe) + its placeholder ---- */
/* Matches .map-ph's box so the page layout is identical either way. */
.map-embed{display:block;width:100%;height:300px;border-radius:12px;border:1px solid var(--line);background:#e6eae3}
.map-ph{height:300px;border-radius:12px;border:1px solid var(--line);
  background:repeating-linear-gradient(45deg,#e7dcc4,#e7dcc4 12px,#efe6cf 12px,#efe6cf 24px);
  display:flex;align-items:center;justify-content:center;color:var(--wood);
  font-family:'Special Elite',monospace;font-size:14px;text-align:center;padding:20px}

/* ---- delivery: free-zone town list ---- */
.town-list{list-style:none;margin:12px 0 0;padding:0;columns:3 10rem;column-gap:18px}
.town-list li{break-inside:avoid;padding:3px 0 3px 18px;position:relative}
.town-list li::before{content:"✓";position:absolute;left:0;color:var(--green);font-weight:700}

/* ---- "open today" pill ---- */
.open-pill{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);
  border-radius:999px;padding:8px 16px;font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:.04em}
.open-pill .dot{width:10px;height:10px;border-radius:50%;background:var(--green)}

/* ---- detail page layout ---- */
.detail-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:start}
@media(max-width:880px){.detail-grid{grid-template-columns:1fr}}
.gallery-main{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#fff}
.gallery-main img{width:100%;display:block;aspect-ratio:4/3;object-fit:cover}
.gallery-main .burst{position:absolute;top:12px;right:12px;width:96px;height:96px;border-radius:50%;
  background:var(--rust);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  font-family:'Bebas Neue',sans-serif;font-size:28px;line-height:.95;letter-spacing:.04em;transform:rotate(8deg);
  box-shadow:0 4px 0 rgba(0,0,0,.18);z-index:2}
.gallery-main .burst small{display:block;font-size:13px;letter-spacing:.1em;opacity:.95}
.gallery-thumbs{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.gallery-thumbs .th{width:84px;height:64px;padding:0;border-radius:8px;overflow:hidden;border:1px solid var(--line);
  background:linear-gradient(180deg,#dccaa3,#9c7c4f);cursor:pointer;transition:border-color .12s,box-shadow .12s}
.gallery-thumbs .th:hover{border-color:var(--gold)}
.gallery-thumbs .th.is-active{border-color:var(--rust);box-shadow:0 0 0 2px rgba(176,48,42,.3)}
.gallery-thumbs .th img{width:100%;height:100%;object-fit:cover;display:block}
.cost-box{background:var(--cream-2);border:1px solid var(--gold);border-radius:12px;padding:20px}
.cost-box .cash{font-family:'Bebas Neue',sans-serif;font-size:42px;color:var(--rust);line-height:1}

/* ---- building-detail options list (spec table) ---- */
.opt-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.opt-list li{position:relative;padding-left:18px;font-size:14px;line-height:1.4}
.opt-list li::before{content:"";position:absolute;left:2px;top:7px;width:6px;height:6px;border-radius:50%;background:var(--gold-deep)}
.opt-list--inline{flex-direction:row;flex-wrap:wrap;gap:8px 22px}

/* ---- Custom Builds: brochure customization teaser ---- */
.opt-group{margin-bottom:28px}
.opt-group__title{font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:.04em;font-size:18px;margin:0 0 14px;
  padding-bottom:8px;border-bottom:1px solid var(--line)}
.opt-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
@media(max-width:900px){.opt-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:620px){.opt-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:400px){.opt-grid{grid-template-columns:repeat(2,1fr)}}
.opt-card{display:flex;flex-direction:column;gap:8px;padding:0;background:none;border:0;cursor:pointer;
  font:inherit;color:inherit;text-align:center}
.opt-card__img{aspect-ratio:1;display:flex;align-items:center;justify-content:center;overflow:hidden;
  background:var(--cream);border:1px solid var(--line);border-radius:10px;transition:border-color .15s,transform .15s}
.opt-card__img img{max-width:90%;max-height:90%;object-fit:contain}
.opt-card:hover .opt-card__img,.opt-card:focus-visible .opt-card__img{border-color:var(--rust);transform:translateY(-2px)}
.opt-card__cap{font-size:12px;line-height:1.3;color:var(--wood-grey)}

/* ---- "Also available" built-to-order styles (no photos) ---- */
.extra-styles{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:760px){.extra-styles{grid-template-columns:1fr}}
.extra-style{background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px 20px}
.extra-style__head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.extra-style__head h3{font-size:18px}
.extra-style__from{font-size:14px;color:var(--wood)}
.extra-style__from b{font-family:'Bebas Neue',sans-serif;font-size:21px;color:var(--rust);letter-spacing:.02em}
.extra-style__label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--wood-grey);margin:12px 0 4px;font-weight:700}
/* "All sizes & pricing" — opens the full table in a modal (RRModal) */
.size-extras{margin-top:12px;border-top:1px solid var(--line);padding-top:10px}
.size-link{display:inline-flex;align-items:center;gap:5px;background:none;border:none;padding:0;
  font:inherit;font-size:13px;font-weight:600;color:var(--gold-deep);cursor:pointer}
.size-link:hover{color:var(--rust)}
.size-link:focus-visible{outline:3px solid var(--rust);outline-offset:3px;border-radius:3px}

/* ---- content modal (size tables, etc.) — mirrors the lightbox shell ---- */
body.modal-open{overflow:hidden}
.modal[aria-hidden="true"]{display:none}
.modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px}
.modal__backdrop{position:absolute;inset:0;background:rgba(12,10,8,.72);cursor:pointer}
.modal__dialog{position:relative;z-index:1;width:100%;max-width:540px;max-height:85vh;overflow:auto;
  background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:24px 24px 20px;
  box-shadow:0 20px 60px rgba(0,0,0,.45)}
.modal__close{position:absolute;top:8px;right:12px;background:none;border:none;font-size:30px;line-height:1;
  cursor:pointer;color:var(--wood-grey);padding:4px 8px}
.modal__close:hover{color:var(--ink)}
.modal__close:focus-visible{outline:3px solid var(--rust);outline-offset:2px;border-radius:4px}
.modal__title{font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:.03em;font-size:18px;margin:2px 28px 16px 0}
.modal__body .size-chart{width:100%;font-size:13px}
.modal__body .size-chart td .price{font-size:15px}

/* ---- material price matrix (catalog popups) ---- */
.size-matrix-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.size-matrix{min-width:max-content}
.size-matrix th,.size-matrix td{text-align:right;white-space:nowrap}
.size-matrix th:first-child,.size-matrix td:first-child{text-align:left;position:sticky;left:0;background:#fff}
.size-matrix thead th:first-child{background:var(--ink)}
.size-matrix th.is-hero{background:var(--rust)}
.size-matrix td.is-hero{background:rgba(176,48,42,.06)}
.style-card__shown{font-size:13px;color:var(--ink);margin:0 0 2px}
.style-card__finishes,.extra-style__finishes{font-size:12px;color:var(--wood-grey);margin:0 0 10px}