/* P8.23: One M01 Banner owner. Width is a canvas control, not a second module.
 * Original editorial Hero/brand-quote markup and stock illustrations are preserved.
 * All sizing is CSS responsive; theme SVGs never get enlarged via a full-bleed cover crop.
 */
.jby-p3-m01_banner.jby-banner-width-standard{width:min(calc(100% - 2 * clamp(20px,3.2vw,64px)),1360px);margin-inline:auto}
.jby-p3-m01_banner.jby-banner-width-narrow{width:min(calc(100% - 2 * clamp(18px,3.2vw,64px)),1040px);margin-inline:auto}
.jby-p3-m01_banner.jby-banner-width-full{width:100%;margin-inline:auto}
.jby-p3-m01_banner.jby-banner-width-standard,.jby-p3-m01_banner.jby-banner-width-narrow{border:1px solid #e1d9cd}
.jby-p3-m01_banner.jby-p1v-hero.jby-banner-width-standard .jby-hero-grid,
.jby-p3-m01_banner.jby-p1v-hero.jby-banner-width-narrow .jby-hero-grid{min-height:clamp(490px,62vh,710px)}
.jby-p3-m01_banner.jby-p1v-hero.jby-banner-width-standard .jby-hero-visual,
.jby-p3-m01_banner.jby-p1v-hero.jby-banner-width-narrow .jby-hero-visual{min-height:clamp(490px,62vh,710px)}
.jby-p3-m01_banner.jby-p1v-hero.jby-banner-width-narrow .jby-hero-heading{font-size:clamp(36px,4vw,63px)}
.jby-p3-m01_banner.jby-p1v-brand-quote.jby-banner-width-narrow{padding:60px 0}
.jby-p3-m01_banner.jby-p1v-brand-quote.jby-banner-width-standard{padding:76px 0}

/* Common Banner typography and spacing, only for the six modern M01 layouts. */
.jby-p3-m01_banner.jby-banner{--jby-banner-bg:#f4f0ea;--jby-banner-ink:#282725;--jby-banner-muted:#69645f;box-sizing:border-box;background:var(--jby-banner-bg);color:var(--jby-banner-ink);padding:0;min-height:0;isolation:isolate}
.jby-banner .jby-banner-shell{position:relative;max-width:1440px;padding:clamp(46px,5.4vw,96px) clamp(22px,5.5vw,84px);margin:0 auto;box-sizing:border-box;min-width:0}
.jby-banner .jby-banner-layout{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center;gap:clamp(35px,5vw,85px);min-width:0}
.jby-banner .jby-banner-copy{position:relative;z-index:2;min-width:0}
.jby-banner .jby-p3-intro{margin:0;max-width:640px}
.jby-banner .jby-eyebrow{font-size:clamp(10px,.78vw,12px);letter-spacing:.18em;font-weight:650;color:#8f6f48;margin:0 0 22px;line-height:1.6}
.jby-banner .jby-p3-heading{font-family:var(--jby-serif,Georgia,serif);font-size:clamp(37px,4.2vw,70px);font-weight:400;letter-spacing:-.049em;line-height:1.12;margin:0 0 24px;max-width:13ch;overflow-wrap:break-word}
.jby-banner .jby-p3-lead{font-size:clamp(14px,1.08vw,17px);line-height:1.85;color:var(--jby-banner-muted);max-width:53ch}
.jby-banner .jby-p3-lead > :last-child{margin-bottom:0}
.jby-banner .jby-banner-actions{display:flex;align-items:stretch;gap:clamp(12px,1.2vw,20px);flex-wrap:wrap;margin-top:clamp(25px,2.8vw,40px);max-width:100%;min-width:0}
.jby-banner .jby-banner-actions:empty{display:none}
.jby-banner .jby-banner-actions :is(.jby-p3-cta,.jby-module-rfq){display:inline-flex;align-items:center;justify-content:center;gap:13px;flex:0 1 auto;width:auto;min-width:clamp(165px,13vw,218px);max-width:100%;min-height:50px;margin:0!important;padding:13px 22px;line-height:1.25;box-sizing:border-box;font-size:12px;font-weight:650;letter-spacing:.025em;white-space:normal;text-align:center;text-decoration:none;transition:transform .25s ease,background-color .25s ease,border-color .25s ease,box-shadow .25s ease}
.jby-banner .jby-banner-actions .jby-p3-cta{background:#252a2a;color:#fff;border:1px solid #252a2a}
.jby-banner .jby-banner-actions .jby-module-rfq{background:transparent;color:#292a2a;border:1px solid #b7aa99}
.jby-banner .jby-banner-actions .jby-module-rfq:hover{background:#282b2b;color:#fff;border-color:#282b2b}
.jby-banner .jby-banner-actions :is(a,button):focus-visible{outline:3px solid #b99765;outline-offset:3px}
.jby-banner .jby-banner-art{position:relative;min-width:0;overflow:hidden;background:#e3dbd1;aspect-ratio:5/4;max-height:640px}
.jby-banner .jby-banner-art .jby-p3-media{position:absolute;inset:0;width:100%;height:100%;min-height:0;aspect-ratio:auto;overflow:hidden;background:transparent}
.jby-banner .jby-banner-art .jby-p3-media :is(img,video){width:100%;height:100%;object-position:center;transition:transform .7s cubic-bezier(.2,.7,.28,1)}
.jby-banner .jby-banner-art.is-sample-art .jby-p3-media img{object-fit:contain}
.jby-banner .jby-banner-art.is-uploaded-art .jby-p3-media :is(img,video){object-fit:cover}
.jby-banner .jby-banner-art .jby-p3-media > :is(a,video){width:100%;height:100%}
.jby-banner .jby-banner-art .jby-p3-media a{position:relative;z-index:2}
.jby-banner .jby-banner-points{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:clamp(22px,3vw,36px);min-width:0;z-index:2}
.jby-banner .jby-banner-point{display:grid;grid-template-columns:25px minmax(0,1fr);gap:13px;align-items:start;background:rgba(255,255,255,.9);border:1px solid rgba(184,173,157,.45);padding:clamp(17px,2vw,25px);min-width:0}
.jby-banner .jby-banner-point-num{font-size:10px;letter-spacing:.14em;color:#9b7d54;line-height:1.9}
.jby-banner .jby-banner-point h3{font-family:var(--jby-serif,Georgia,serif);font-weight:400;font-size:clamp(18px,1.5vw,23px);line-height:1.25;letter-spacing:-.025em;margin:0 0 9px}
.jby-banner .jby-banner-point .jby-entry-content{font-size:12px;line-height:1.65;color:#68605a;max-height:4.95em;overflow:hidden}
.jby-banner .jby-banner-point .jby-entry-content > :first-child{margin-top:0}
.jby-banner .jby-banner-point .jby-entry-content > :last-child{margin-bottom:0}
@media(hover:hover) and (pointer:fine){
 .jby-banner .jby-banner-art:hover .jby-p3-media img{transform:scale(1.035)}
 .jby-banner .jby-banner-actions :is(a,button):hover{transform:translateY(-2px)}
}
/* 01 · full-width opening: cinematic art beside a genuine B2B buyer story. */
.jby-banner.jby-p3-v-hero{--jby-banner-bg:#282d2e;--jby-banner-ink:#faf7f1;--jby-banner-muted:#d5d1ca}
.jby-banner.jby-p3-v-hero .jby-banner-shell{max-width:1510px;padding-top:clamp(74px,8vw,138px);padding-bottom:clamp(74px,8vw,138px)}
.jby-banner.jby-p3-v-hero .jby-banner-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
.jby-banner.jby-p3-v-hero .jby-eyebrow{color:#d7b78d}
.jby-banner.jby-p3-v-hero .jby-p3-heading{max-width:13ch;font-size:clamp(43px,4.8vw,76px)}
.jby-banner.jby-p3-v-hero .jby-banner-art{aspect-ratio:5/5.1;max-height:750px;background:linear-gradient(140deg,#c5b8aa,#e5d9cc);border:1px solid rgba(255,255,255,.22)}
.jby-banner.jby-p3-v-hero .jby-banner-art::after{content:"";position:absolute;inset:12px;z-index:1;border:1px solid rgba(255,255,255,.28);pointer-events:none}
.jby-banner.jby-p3-v-hero .jby-banner-actions .jby-p3-cta{background:#f2ece1;border-color:#f2ece1;color:#272728}
.jby-banner.jby-p3-v-hero .jby-banner-actions .jby-module-rfq{border-color:#ac9c84;color:#fff}
.jby-banner.jby-p3-v-hero .jby-banner-actions .jby-module-rfq:hover{background:#f2ece1;color:#272728;border-color:#f2ece1}
/* 03 · split, a warm editorial product study in an independent image frame. */
.jby-banner.jby-p3-v-split{--jby-banner-bg:#f9f7f3}
.jby-banner.jby-p3-v-split .jby-banner-shell{padding-block:clamp(46px,6vw,92px)}
.jby-banner.jby-p3-v-split .jby-banner-art{aspect-ratio:6/5;border:12px solid #fff;box-shadow:0 20px 65px rgba(55,44,30,.07)}
.jby-banner.jby-p3-v-split .jby-p3-heading{max-width:14ch}
/* 04 · process background, decorative full bleed but readable card on the left. */
.jby-banner.jby-p3-v-image_banner{--jby-banner-bg:#e5ded4}
.jby-banner.jby-p3-v-image_banner .jby-banner-shell{max-width:none;padding:clamp(62px,6.4vw,114px) clamp(22px,7vw,140px)}
.jby-banner.jby-p3-v-image_banner .jby-banner-layout{display:block;min-height:clamp(340px,40vw,520px)}
.jby-banner.jby-p3-v-image_banner .jby-banner-copy{background:rgba(251,249,245,.95);padding:clamp(28px,4vw,65px);max-width:590px;box-shadow:0 20px 70px rgba(33,30,25,.1);border-left:3px solid #b79a72}
.jby-banner.jby-p3-v-image_banner .jby-banner-art{position:absolute;inset:0 0 0 auto;width:70%;max-height:none;height:100%;aspect-ratio:auto;background:linear-gradient(120deg,#e6e0d7,#d6c9b8);z-index:0}
.jby-banner.jby-p3-v-image_banner .jby-banner-art.is-sample-art .jby-p3-media img{object-fit:contain;object-position:right center}
.jby-banner.jby-p3-v-image_banner .jby-banner-art.is-uploaded-art .jby-p3-media :is(img,video){object-fit:cover;object-position:right center}
.jby-banner.jby-p3-v-image_banner .jby-banner-layout::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#e5ded4 0%,rgba(229,222,212,.2) 52%,rgba(229,222,212,0) 100%);pointer-events:none;z-index:1}
/* 05 · material/value story with a principal image and compact supporting points. */
.jby-banner.jby-p3-v-background{--jby-banner-bg:#f1f2ec}
.jby-banner.jby-p3-v-background .jby-banner-layout{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
.jby-banner.jby-p3-v-background .jby-banner-art{grid-column:1;grid-row:1;aspect-ratio:5/3.7;background:#d7e0d7}
.jby-banner.jby-p3-v-background .jby-banner-copy{grid-column:2;grid-row:1}
.jby-banner.jby-p3-v-background .jby-p3-heading{font-size:clamp(38px,3.8vw,62px)}
.jby-banner.jby-p3-v-background .jby-banner-point{background:rgba(255,255,255,.78);box-shadow:0 5px 20px rgba(36,44,35,.025)}
/* 06 · dark editorial spotlight with a separate proof-point row. */
.jby-banner.jby-p3-v-overlay{--jby-banner-bg:#24292b;--jby-banner-ink:#faf6ef;--jby-banner-muted:#e0d8cd}
.jby-banner.jby-p3-v-overlay .jby-banner-shell{max-width:1440px}
.jby-banner.jby-p3-v-overlay .jby-banner-layout{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
.jby-banner.jby-p3-v-overlay .jby-banner-art{aspect-ratio:5/4;background:linear-gradient(155deg,#30393b,#556365)}
.jby-banner.jby-p3-v-overlay .jby-eyebrow{color:#d2b78d}
.jby-banner.jby-p3-v-overlay .jby-banner-actions .jby-p3-cta{background:#ece3d5;color:#252b2c;border-color:#ece3d5}
.jby-banner.jby-p3-v-overlay .jby-banner-actions .jby-module-rfq{background:transparent;color:#faf6ef;border-color:#b4a58f}
.jby-banner.jby-p3-v-overlay .jby-banner-point{background:#303638;border-color:#495052}
.jby-banner.jby-p3-v-overlay .jby-banner-point h3{color:#f3eee6}
.jby-banner.jby-p3-v-overlay .jby-banner-point .jby-entry-content{color:#d4cec4}
/* 07 · minimal line, intentionally no large art, a quiet premium signature. */
.jby-banner.jby-p3-v-minimal{--jby-banner-bg:#faf9f6}
.jby-banner.jby-p3-v-minimal .jby-banner-shell{padding-top:clamp(55px,6vw,88px);padding-bottom:clamp(55px,6vw,88px)}
.jby-banner.jby-p3-v-minimal .jby-banner-layout{display:block}
.jby-banner.jby-p3-v-minimal .jby-banner-copy{text-align:center}
.jby-banner.jby-p3-v-minimal .jby-p3-intro{margin-inline:auto;max-width:680px}
.jby-banner.jby-p3-v-minimal .jby-p3-heading{margin-inline:auto;max-width:18ch;font-size:clamp(34px,3.6vw,59px)}
.jby-banner.jby-p3-v-minimal .jby-p3-lead{margin-inline:auto}
.jby-banner.jby-p3-v-minimal .jby-eyebrow:before{content:"";display:block;width:35px;height:1px;margin:0 auto 18px;background:#b99a72}
.jby-banner.jby-p3-v-minimal .jby-banner-actions{justify-content:center}

/* Responsive: never shrink two CTA labels into tiny adjacent blocks. */
@media(max-width:1120px){
 .jby-banner .jby-banner-layout{gap:clamp(25px,3.5vw,54px)}
 .jby-banner .jby-banner-actions :is(.jby-p3-cta,.jby-module-rfq){min-width:170px}
}
@media(max-width:800px){
 .jby-banner .jby-banner-shell{padding:clamp(38px,7vw,64px) clamp(20px,5vw,42px)}
 .jby-banner .jby-banner-layout,.jby-banner.jby-p3-v-hero .jby-banner-layout,.jby-banner.jby-p3-v-background .jby-banner-layout,.jby-banner.jby-p3-v-overlay .jby-banner-layout{grid-template-columns:minmax(0,1fr);gap:30px}
 .jby-banner .jby-p3-heading{font-size:clamp(34px,6.1vw,55px);max-width:20ch}
 .jby-banner .jby-banner-art{max-height:530px;aspect-ratio:5/3.8}
 .jby-banner.jby-p3-v-hero .jby-banner-art{aspect-ratio:5/4}
 .jby-banner.jby-p3-v-background .jby-banner-art{grid-row:auto;grid-column:auto}
 .jby-banner.jby-p3-v-background .jby-banner-copy{grid-row:1;grid-column:1}
 .jby-banner.jby-p3-v-image_banner .jby-banner-art{width:100%;opacity:.43}
 .jby-banner.jby-p3-v-image_banner .jby-banner-copy{max-width:600px}
 .jby-banner .jby-banner-points{grid-template-columns:repeat(2,minmax(0,1fr))}
 .jby-p3-m01_banner.jby-p1v-hero.jby-banner-width-narrow .jby-hero-grid,.jby-p3-m01_banner.jby-p1v-hero.jby-banner-width-standard .jby-hero-grid{min-height:0}
 .jby-p3-m01_banner.jby-p1v-hero.jby-banner-width-narrow .jby-hero-visual,.jby-p3-m01_banner.jby-p1v-hero.jby-banner-width-standard .jby-hero-visual{min-height:0}
}
@media(max-width:560px){
 .jby-p3-m01_banner.jby-banner-width-standard,.jby-p3-m01_banner.jby-banner-width-narrow{width:calc(100% - 24px)}
 .jby-banner .jby-banner-shell{padding:40px 22px}
 .jby-banner .jby-p3-heading{font-size:clamp(31px,9vw,44px)}
 .jby-banner .jby-banner-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:11px;max-width:100%}
 .jby-banner .jby-banner-actions :is(.jby-p3-cta,.jby-module-rfq){display:flex;width:100%;min-width:0;padding:14px 16px;min-height:48px}
 .jby-banner .jby-banner-points{grid-template-columns:minmax(0,1fr);gap:12px}
 .jby-banner .jby-banner-art{aspect-ratio:5/4}
 .jby-banner.jby-p3-v-hero .jby-banner-art{aspect-ratio:4/4.2}
 .jby-banner.jby-p3-v-image_banner .jby-banner-layout{min-height:320px}
 .jby-banner.jby-p3-v-image_banner .jby-banner-copy{padding:24px}
 .jby-banner.jby-p3-v-split .jby-banner-art{border-width:6px}
}
@media(prefers-reduced-motion:reduce){.jby-banner :is(.jby-banner-art img,.jby-banner-actions a,.jby-banner-actions button){transition:none!important;transform:none!important}}

/* P8.24 Banner refinements: share one layout/hover owner, never alter the
 * approved editorial_hero composition. Width is canvas-only. */
.jby-banner .jby-banner-point{
  transition:transform .3s cubic-bezier(.22,.61,.36,1),border-color .3s ease,box-shadow .3s ease,background-color .3s ease;
  will-change:auto;
}
.jby-banner .jby-banner-points-count-4{grid-template-columns:repeat(2,minmax(0,1fr))}
.jby-banner.jby-p3-v-background .jby-banner-layout{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(28px,3.2vw,55px)}
.jby-banner.jby-p3-v-background .jby-p3-heading{
  font-size:clamp(35px,3.1vw,53px);line-height:1.1;letter-spacing:-.045em;
  max-width:min(100%,11.4em);overflow-wrap:normal;word-break:normal;text-wrap:balance;
}
.jby-banner.jby-p3-v-background .jby-banner-copy .jby-p3-intro{max-width:none}
.jby-banner.jby-p3-v-background .jby-banner-art{aspect-ratio:4/3.2}
.jby-banner.jby-p3-v-background .jby-banner-actions :is(.jby-p3-cta,.jby-module-rfq){min-width:min(100%,165px)}
@media(hover:hover) and (pointer:fine){
 .jby-banner .jby-banner-point:hover{transform:translateY(-5px);border-color:#b79b77;box-shadow:0 16px 35px rgba(39,34,27,.1)}
 .jby-banner.jby-p3-v-overlay .jby-banner-point:hover{background:#384044;border-color:#ad9677;box-shadow:0 15px 35px rgba(0,0,0,.18)}
}
/* Tablet: reduce copy pressure before switching to one column. */
@media (min-width:801px) and (max-width:1180px){
 .jby-banner.jby-p3-v-background .jby-banner-layout{grid-template-columns:minmax(0,.93fr) minmax(0,1.07fr);gap:clamp(22px,2.5vw,38px)}
 .jby-banner.jby-p3-v-background .jby-p3-heading{font-size:clamp(32px,3.6vw,43px)}
 .jby-banner .jby-banner-actions{gap:11px}
 .jby-banner .jby-banner-actions :is(.jby-p3-cta,.jby-module-rfq){min-width:0;flex:1 1 175px}
}
@media(max-width:800px){
 .jby-banner.jby-p3-v-background .jby-banner-layout{grid-template-columns:minmax(0,1fr);gap:26px}
 .jby-banner.jby-p3-v-background .jby-banner-art{aspect-ratio:5/3.8}
 .jby-banner.jby-p3-v-background .jby-p3-heading{font-size:clamp(33px,5.8vw,48px);max-width:18ch}
 .jby-banner .jby-banner-points-count-4{grid-template-columns:repeat(2,minmax(0,1fr))}
 .jby-banner.jby-p3-v-hero .jby-banner-shell{padding:clamp(44px,6vw,72px) clamp(20px,4vw,44px)}
 .jby-banner.jby-p3-v-hero .jby-p3-heading{font-size:clamp(35px,5.8vw,53px);max-width:16ch}
 .jby-banner.jby-p3-v-hero .jby-banner-art{aspect-ratio:5/4}
 .jby-banner.jby-p3-v-image_banner .jby-banner-shell{padding:clamp(42px,6vw,62px) clamp(20px,5vw,42px)}
}
@media(max-width:560px){
 .jby-banner.jby-p3-v-hero .jby-banner-shell{padding:38px 20px 44px}
 .jby-banner.jby-p3-v-hero .jby-p3-heading{font-size:clamp(33px,8.2vw,43px);line-height:1.13;max-width:18ch}
 .jby-banner .jby-eyebrow{margin-bottom:12px}
 .jby-banner .jby-banner-actions{margin-top:24px}
 .jby-banner .jby-banner-art{aspect-ratio:5/4}
 .jby-banner.jby-p3-v-hero .jby-banner-art{aspect-ratio:5/4}
 .jby-banner.jby-p3-v-background .jby-p3-heading{font-size:clamp(31px,8vw,40px);max-width:20ch}
 .jby-banner .jby-banner-points-count-4{grid-template-columns:minmax(0,1fr)}
 .jby-banner .jby-banner-point{padding:18px}
}
@media(hover:none),(pointer:coarse){.jby-banner .jby-banner-point:hover{transform:none;box-shadow:none}}
@media(prefers-reduced-motion:reduce){.jby-banner .jby-banner-point{transition:none!important;transform:none!important}}
