/* Josh Blair — editorial author profile */
.jb-about-page { background: var(--jb-paper); }

.jb-about-hero { position: relative; min-height: 920px; display: flex; align-items: center; padding: 126px 0 82px; overflow: hidden; isolation: isolate; color: var(--jb-cream); background: radial-gradient(circle at 78% 34%, #2d4a58 0, transparent 28%), linear-gradient(125deg, #070a0e 15%, #111b22 62%, #0a1116); }
.jb-about-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .3; background: repeating-linear-gradient(105deg, transparent 0 43px, rgba(255,255,255,.035) 44px 45px); }
.jb-about-hero__glow { position: absolute; width: 440px; height: 440px; right: -160px; top: 190px; border: 1px solid rgba(227,204,150,.16); border-radius: 50%; box-shadow: 0 0 120px rgba(70,119,139,.16); }
.jb-about-hero__grid { display: grid; gap: 64px; align-items: center; }
.jb-about-hero h1 { margin: 22px 0 29px; font-size: clamp(68px, 19vw, 104px); line-height: .72; letter-spacing: -.055em; }
.jb-about-hero h1 em { color: var(--jb-gold-light); }
.jb-about-hero__lead { max-width: 620px; color: var(--jb-cream)!important; font: 500 23px/1.35 var(--jb-serif)!important; }
.jb-about-hero__copy > p:not(.jb-eyebrow) { max-width: 610px; color: rgba(255,255,255,.61); font-size: 13px; line-height: 1.9; }
.jb-about-hero__copy .jb-text-link { margin-top: 12px; }
.jb-about-hero__portrait { width: min(84vw, 390px); margin: 0 auto; }
.jb-about-hero__frame { position: relative; padding: 10px; border: 1px solid rgba(227,204,150,.4); }
.jb-about-hero__frame::before { content: ""; position: absolute; inset: 25px -18px -18px 25px; z-index: -1; border: 1px solid rgba(227,204,150,.18); }
.jb-about-hero__frame img { width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center; filter: saturate(.82) contrast(1.04); }
.jb-about-hero__frame > span { position: absolute; right: 24px; bottom: 20px; color: rgba(255,255,255,.78); font: 500 42px/1 var(--jb-serif); letter-spacing: -.08em; }
.jb-about-hero figcaption { display: flex; align-items: center; justify-content: flex-end; gap: 11px; margin-top: 25px; color: rgba(255,255,255,.45); font: 700 8px/1 var(--jb-sans); letter-spacing: .18em; text-transform: uppercase; }
.jb-about-hero figcaption i { width: 34px; height: 1px; background: var(--jb-gold); }

.jb-about-worlds { position: relative; background: var(--jb-paper); }
.jb-about-worlds::before { content: ""; position: absolute; inset: 0; opacity: .18; background: repeating-linear-gradient(90deg, transparent 0 99px, rgba(13,20,27,.11) 100px); }
.jb-about-heading { position: relative; z-index: 1; max-width: 880px; margin-bottom: 58px; }
.jb-about-heading h2 { margin: 0 0 27px; font-size: clamp(52px, 14vw, 86px); line-height: .83; letter-spacing: -.045em; }
.jb-about-heading h2 em { color: #4a6570; }
.jb-about-heading > p:last-child { max-width: 650px; color: #4f595c; font-size: 14px; line-height: 1.9; }
.jb-about-series { position: relative; z-index: 1; display: grid; gap: 28px; }
.jb-about-series__card { position: relative; min-height: 700px; display: flex; align-items: flex-end; overflow: hidden; isolation: isolate; color: var(--jb-cream); border: 1px solid rgba(123,99,56,.34); box-shadow: 0 28px 70px rgba(22,28,30,.12); }
.jb-about-series__card::before { content: ""; position: absolute; inset: 0; z-index: -2; background-position: center; background-size: cover; transition: transform 1s cubic-bezier(.2,.7,.2,1); }
.jb-about-series__card:hover::before { transform: scale(1.035); }
.jb-about-series__card::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(5,8,10,.13) 0, rgba(5,8,10,.78) 27%, rgba(5,8,10,.98) 58%); }
.jb-about-series__card--scent::before { background-image: url("../assets/images/victor-dennison-atmosphere.png"); }
.jb-about-series__card--blackglass::before { background-image: url("../assets/images/blackglass-series-atmosphere.png"); }
.jb-about-series__number { position: absolute; right: 26px; top: 22px; color: rgba(255,255,255,.26); font: 500 68px/1 var(--jb-serif); }
.jb-about-series__copy { width: 100%; padding: 160px 25px 34px; }
.jb-about-series__copy .jb-kicker { color: var(--jb-gold-light); }
.jb-about-series h3 { max-width: 540px; margin: 0 0 20px; font-size: clamp(39px, 10vw, 57px); line-height: .86; letter-spacing: -.035em; }
.jb-about-series__copy > p:not(.jb-kicker) { max-width: 600px; color: rgba(255,255,255,.64); font-size: 12px; line-height: 1.85; }
.jb-about-booklist { margin: 27px 0; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.15); }
.jb-about-booklist li { display: grid; grid-template-columns: 28px 1fr; gap: 12px; align-items: center; padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.jb-about-booklist span { color: var(--jb-gold-light); font: 700 8px/1 var(--jb-sans); }
.jb-about-booklist cite { color: rgba(255,255,255,.88); font: italic 500 17px/1.2 var(--jb-serif); }
.jb-about-series__note { padding-left: 17px; border-left: 1px solid var(--jb-gold); font-style: italic; }
.jb-about-series__copy .jb-button { margin-top: 12px; }

.jb-about-craft { position: relative; color: var(--jb-cream); background: #11191f; }
.jb-about-craft::before { content: ""; position: absolute; inset: 0; opacity: .12; background: radial-gradient(circle at 17% 24%, #6ca1b6, transparent 28%), repeating-linear-gradient(135deg, transparent 0 18px, rgba(255,255,255,.045) 19px 20px); }
.jb-about-craft__grid { display: grid; gap: 58px; }
.jb-about-craft h2 { margin: 0 0 38px; font-size: clamp(53px, 14vw, 86px); line-height: .82; letter-spacing: -.045em; }
.jb-about-craft h2 em { color: var(--jb-gold-light); }
.jb-about-craft blockquote { max-width: 550px; margin: 0; padding: 22px 0 22px 22px; color: rgba(255,255,255,.9); border-left: 1px solid var(--jb-gold); font: italic 500 24px/1.4 var(--jb-serif); }
.jb-about-craft__copy > p { max-width: 610px; color: rgba(255,255,255,.6); font-size: 13px; line-height: 1.95; }
.jb-about-craft__copy > p:first-child { color: rgba(255,255,255,.88); font: 500 20px/1.55 var(--jb-serif); }
.jb-about-craft__actions { display: flex; align-items: flex-start; flex-direction: column; gap: 18px; margin-top: 31px; }

@media (min-width: 600px) {
    .jb-about-series__copy { padding: 190px 44px 46px; }
    .jb-about-booklist li { grid-template-columns: 34px 1fr; }
    .jb-about-booklist cite { font-size: 19px; }
    .jb-about-craft__actions { flex-direction: row; align-items: center; }
}

@media (min-width: 860px) {
    .jb-about-hero { min-height: 850px; padding: 150px 0 95px; }
    .jb-about-hero__grid { grid-template-columns: 1.15fr .85fr; gap: 105px; }
    .jb-about-hero h1 { font-size: clamp(94px, 9vw, 126px); }
    .jb-about-hero__portrait { width: min(31vw, 410px); }
    .jb-about-series { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jb-about-series__card { min-height: 820px; }
    .jb-about-series__copy { padding: 230px 48px 54px; }
    .jb-about-craft__grid { grid-template-columns: .9fr 1.1fr; gap: 110px; align-items: start; }
}

@media (min-width: 1200px) {
    .jb-about-hero__grid { gap: 150px; }
    .jb-about-series__copy { padding-inline: 58px; }
}

@media (prefers-reduced-motion: reduce) {
    .jb-about-series__card::before { transition: none; }
}