/* Opening composition: original BUM wordmark and editorial typography. */
:root{--nav-height:72px}html{scroll-padding-top:calc(var(--nav-height) + 24px)}
#top{scroll-margin-top:-24px}
.masthead{width:100%;max-width:none;min-height:calc(100svh - var(--nav-height));margin:0;overflow:hidden;display:grid;grid-template-rows:auto 1fr auto;gap:16px;padding:25px 0 24px;border-bottom:1px solid var(--line);background:radial-gradient(ellipse at 80% 42%,#17181f 0%,#0e0f13 32%,#0b0b0e 68%)}
.masthead:before{inset:0;background:linear-gradient(110deg,transparent 25%,#ffffff02 50%,transparent 65%);z-index:0}
[data-theme="light"] .masthead{background:radial-gradient(ellipse at 78% 42%,#dedfe5 0%,#edeef2 36%,#f5f5f7 70%)}
[data-theme="light"] .masthead:before{background:linear-gradient(110deg,transparent 25%,#ffffff45 50%,transparent 65%)}
.masthead-topline{position:relative;z-index:2;font-size:10px;letter-spacing:.13em}
.masthead-topline>span:last-child{font-size:9px}
.masthead-stage{position:relative;display:grid;grid-template-columns:1.25fr 1fr;align-items:center;text-align:left;padding:32px 0 42px;min-height:490px}
.masthead-copy{position:relative;z-index:2;padding:20px 0}
.masthead-eyebrow{color:var(--muted);font-size:10px;letter-spacing:.22em;margin-bottom:29px}
.masthead-title{font-size:clamp(40px,4.7vw,72px);line-height:1.38;font-weight:450;letter-spacing:-.06em;animation:statement-enter 1s .12s both}
.masthead-title>span{white-space:nowrap;display:block}
.masthead-title>span:first-child{font-weight:400;color:var(--muted)}
.masthead-focus{font-size:13px;line-height:1.8;letter-spacing:.025em;margin-top:33px;animation:statement-enter 1s .24s both}
.masthead-art{position:relative;justify-self:center;width:125%;max-width:630px;aspect-ratio:600 / 640;margin-left:0;isolation:isolate;animation:statement-enter 1s .15s both}
.masthead-logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:39%;max-width:224px;margin:0;height:auto;filter:var(--logo-filter);animation:none;opacity:.92}
.masthead-bottom{position:relative;z-index:2;padding-top:22px;border-top:1px solid var(--line);gap:24px}
.masthead-identity{display:flex;flex-direction:row;gap:20px;align-items:baseline}
.masthead-identity>span:first-child{font-size:17px}
.masthead-identity>span:last-child{font-size:11px;color:var(--muted);letter-spacing:.015em}
.masthead-cta{min-height:44px;font-size:13px;gap:25px}
.masthead-arrow{border:0;width:36px;height:36px;font-size:26px;transition:transform .25s,color .25s}
.masthead-cta:hover .masthead-arrow{transform:translate(3px,-3px);background:transparent;color:var(--accent)}
@media(min-width:1500px){.masthead-stage{padding-block:48px 58px}.masthead-eyebrow{margin-bottom:35px}.masthead-focus{font-size:14px;margin-top:40px}}
@media(max-width:1100px){.masthead-stage{min-height:470px}.masthead-title{font-size:clamp(37px,4.7vw,52px)}.masthead-art{width:134%;margin-left:20px}.masthead-eyebrow{font-size:9px}.masthead-focus{font-size:12px}}
@media(max-width:800px){:root{--nav-height:66px}.masthead{padding-top:22px;min-height:calc(100svh - var(--nav-height))}.masthead-stage{min-height:450px;padding-block:28px 38px;grid-template-columns:1.4fr 1fr}.masthead-title{font-size:clamp(32px,4.8vw,40px)}.masthead-art{width:150%;margin-left:32px}.masthead-eyebrow{font-size:9px;margin-bottom:24px}.masthead-focus{font-size:11px;margin-top:25px}.masthead-identity>span:last-child{font-size:10px}}
@media(max-height:680px) and (min-width:581px){.masthead{gap:10px;padding-block:16px 20px}.masthead-stage{min-height:0;padding-block:18px}.masthead-art{max-height:380px;width:110%;aspect-ratio:600 / 640}.masthead-title{font-size:clamp(32px,4.6vw,58px)}.masthead-eyebrow{margin-bottom:20px}.masthead-focus{margin-top:23px}.masthead-bottom{padding-top:15px}}
@media(prefers-reduced-motion:reduce){.masthead-art,.masthead-title,.masthead-focus{animation:none}.masthead-arrow{transition:none}}
@media print{.masthead{background:white!important;min-height:0;display:block;padding:15px 0;overflow:visible}.masthead-stage{display:block;min-height:0;padding:20px 0}.masthead-art,.masthead:before,.masthead-topline,.masthead-cta{display:none}.masthead-title{font-size:30px;animation:none}.masthead-focus{animation:none}}
@media(min-width:581px){.masthead-art{width:auto;height:min(43vw,570px);max-height:calc(100svh - 270px);max-width:none;aspect-ratio:600 / 640;margin-left:20px}.masthead-stage{min-height:400px}.masthead-title{font-size:clamp(33px,5vw,74px)}}
@media(min-width:801px) and (max-height:680px){.masthead-art{height:calc(100svh - 265px);max-height:380px}.masthead-stage{min-height:0}}

.masthead-logo{width:clamp(150px,21vw,240px);max-width:75%;opacity:.9}

.masthead-topline{justify-content:flex-end}

/* Mobile opening: a large, three-line statement with the original signature. */
@media screen and (max-width: 580px) {
  .masthead {
    min-height: calc(100svh - var(--nav-height));
    grid-template-columns: 24px minmax(0, 1fr) 24px;
    grid-template-rows: auto minmax(32px, .65fr) auto auto auto minmax(32px, 1fr) auto;
    gap: 0;
    padding: 30px 0 max(28px, env(safe-area-inset-bottom));
  }
  html[data-theme] .masthead { background: var(--paper); }
  .masthead::before,
  .masthead-topline { display: none; }
  .masthead-stage,
  .masthead-copy,
  .masthead-bottom { display: contents; }
  .masthead-art {
    grid-column: 2;
    grid-row: 1;
    justify-self: start;
    align-self: center;
    width: 92px;
    height: auto;
    max-width: none;
    aspect-ratio: auto;
    margin: 0;
    animation: none;
  }
  .masthead-logo {
    position: static;
    width: 100%;
    height: auto;
    max-width: none;
    margin: 0;
    transform: none;
    opacity: .95;
  }
  .masthead-eyebrow {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    justify-self: end;
    max-width: 112px;
    margin: 0;
    font-size: 10px;
    line-height: 1.8;
    letter-spacing: .14em;
    text-align: right;
  }
  .masthead-title {
    grid-column: 2;
    grid-row: 3;
    min-width: 0;
    font-size: clamp(50px, 18.8vw, 94px);
    font-weight: 600;
    line-height: 1.16;
    letter-spacing: -.07em;
    animation: none;
  }
  .masthead-title > .masthead-title-lead {
    color: var(--ink);
    font-weight: 400;
    opacity: .85;
    margin-bottom: 6px;
  }
  .masthead-title-lead > span {
    display: block;
    width: fit-content;
  }
  .masthead-title-end { width: fit-content; }
  .masthead-focus {
    grid-column: 2;
    grid-row: 4;
    margin: 23px 0 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.8;
    letter-spacing: 0;
    animation: none;
  }
  .masthead-identity {
    grid-column: 2;
    grid-row: 5;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    margin-top: 26px;
  }
  .masthead-identity > span:first-child {
    font-size: 17px;
    line-height: 1.5;
    font-weight: 500;
  }
  .masthead-identity > span:last-child {
    font-size: 12px;
    line-height: 1.65;
    letter-spacing: -.02em;
  }
  .masthead-cta {
    grid-column: 2;
    grid-row: 7;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 56px;
    padding: 12px 19px;
    border: 1px solid var(--ink);
    border-radius: 3px;
    background: var(--ink);
    color: var(--paper);
    font-size: 14px;
    font-weight: 500;
    transition: opacity .2s;
  }
  .masthead-cta .masthead-arrow {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 0;
    color: inherit;
    font-size: 26px;
  }
  .masthead-cta:hover { opacity: .86; }
  .masthead-cta:hover .masthead-arrow {
    color: inherit;
    background: none;
  }
}

@media screen and (max-width: 580px) and (max-height: 700px) {
  .masthead {
    padding-top: 22px;
    padding-bottom: 22px;
    grid-template-rows: auto minmax(22px, .65fr) auto auto auto minmax(24px, 1fr) auto;
  }
  .masthead-art { width: 82px; }
  .masthead-title { font-size: clamp(46px, 15.5vw, 72px); line-height: 1.12; }
  .masthead-focus { margin-top: 17px; }
  .masthead-identity { margin-top: 20px; }
}

@media screen and (max-width: 580px) and (max-height: 650px) {
  .masthead { padding-top: 20px; padding-bottom: 20px; }
  .masthead-focus { display: none; }
  .masthead-cta { min-height: 52px; padding-block: 10px; }
}

@media screen and (max-width: 350px) {
  .masthead { grid-template-columns: 20px minmax(0, 1fr) 20px; }
  .masthead-eyebrow { font-size: 9px; }
}

@media screen and (max-width: 580px) and (prefers-reduced-motion: no-preference) {
  .masthead-title-lead > span,
  .masthead-title-end {
    animation: mobile-statement-enter .7s cubic-bezier(.2,.7,.2,1) both;
  }
  .masthead-title-lead > span:nth-child(2) { animation-delay: .07s; }
  .masthead-title-end { animation-delay: .14s; }
}

@keyframes mobile-statement-enter {
  from { opacity: .25; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .masthead-cta { transition: none; }
}

.masthead-focus { line-height: 1.9; letter-spacing: 0; }
.masthead-focus > strong { display: block; color: var(--ink); font-size: 16px; font-weight: 500; letter-spacing: -.015em; }
.masthead-focus > span { display: block; margin-top: 6px; color: var(--muted); word-break: keep-all; }
.masthead-identity > span:last-child { word-break: keep-all; }
@media screen and (max-width: 580px) {
  .masthead-focus > strong { font-size: 15px; }
  .masthead-focus > span { max-width: 315px; margin-top: 5px; font-size: 12px; }
  .masthead-identity { gap: 5px; }
  .masthead-identity > span:last-child { font-size: 11px; }
}
@media screen and (max-width: 580px) and (max-height: 650px) {
  .masthead-focus { display: block; font-size: 11px; margin-top: 14px; }
  .masthead-focus > strong { font-size: 14px; }
  .masthead-focus > span { font-size: 11px; }
  .masthead-title { font-size: clamp(44px, 15.5vw, 65px); }
}
