/* Just For U — botanical U-arch brand system */

.bw-u-mark {
    display: inline-grid;
    place-items: center;
    flex-shrink: 0;
    line-height: 0;
}

.bw-u-mark__svg {
    width: 100%;
    height: 100%;
    display: block;
    overflow: visible;
}

.bw-u-mark__outer {
    fill: none;
    stroke: var(--bw-olive-dark);
    stroke-width: 13;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bw-u-mark__inner {
    fill: none;
    stroke: var(--bw-gold);
    stroke-width: 4.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: 0.92;
}

.bw-u-mark__svg--hero .bw-u-mark__outer {
    stroke: color-mix(in srgb, var(--bw-ivory) 55%, var(--bw-gold));
    stroke-width: 16;
}

.bw-u-mark__svg--hero .bw-u-mark__inner {
    stroke: var(--bw-gold);
    stroke-width: 6;
}

.bw-band--dark .bw-u-mark__outer { stroke: var(--bw-ivory); }
.bw-band--dark .bw-u-mark__inner { stroke: var(--bw-gold); }

.bw-u-mark__svg--draw .bw-u-mark__trace {
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    animation: bw-u-draw 1.4s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.bw-u-mark__svg--draw .bw-u-mark__inner { animation-delay: 0.18s; }

.bw-u-mark__svg--draw .bw-u-mark__fill {
    opacity: 0;
    animation: bw-u-fill-in 0.8s ease 0.7s forwards;
}

@keyframes bw-u-draw { to { stroke-dashoffset: 0; } }
@keyframes bw-u-fill-in { to { opacity: 1; } }

.bw-masthead__brand {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.05rem 0.75rem;
    align-items: center;
    min-width: 0;
}

.bw-masthead__u {
    grid-row: 1 / span 3;
    width: 34px;
    height: 34px;
    transition: transform var(--bw-transition);
}

.bw-masthead__brand:hover .bw-masthead__u {
    transform: scale(1.04);
}

.bw-masthead__edition,
.bw-masthead__title,
.bw-masthead__tag { grid-column: 2; }

.bw-loader__u {
    position: relative;
    width: 64px;
    height: 76px;
}

.bw-loader__u .bw-u-mark,
.bw-loader__u .bw-arch__frame {
    width: 100%;
    height: 100%;
}

.bw-u-mark--pulse img,
.bw-u-mark--glow img {
    animation: bw-u-breathe 3.2s ease-in-out infinite;
}

@keyframes bw-u-breathe {
    0%, 100% { transform: scale(1); opacity: 0.92; }
    50% { transform: scale(1.04); opacity: 1; }
}

.bw-u-watermark {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.bw-u-watermark__cell {
    position: absolute;
    opacity: 0.55;
}

.bw-u-watermark__cell--tl {
    top: 6%;
    left: -10%;
    width: min(280px, 42vw);
    transform: rotate(-8deg);
}

.bw-u-watermark__cell--br {
    bottom: 10%;
    right: -12%;
    width: min(320px, 48vw);
    transform: rotate(6deg);
}

.bw-u-watermark__cell--tr { display: none; }

/* ─── The U Arch — café doorway ─── */
.bw-cover {
    position: relative;
    isolation: isolate;
    min-height: min(78dvh, 760px);
    display: grid;
    place-items: center;
    overflow: hidden;
    padding: 1.25rem 0 1.75rem;
    background: var(--bw-forest);
    color: var(--bw-ivory);
}

.bw-cover__media {
    position: absolute;
    inset: 0;
    z-index: 0;
    margin: 0;
}

.bw-cover__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.32;
    transform: scale(1.04);
}

.bw-cover__veil {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        radial-gradient(ellipse 70% 80% at 50% 42%, color-mix(in srgb, var(--bw-olive) 28%, transparent), transparent 62%),
        linear-gradient(180deg,
            color-mix(in srgb, var(--bw-forest) 35%, transparent) 0%,
            color-mix(in srgb, var(--bw-forest) 55%, transparent) 48%,
            color-mix(in srgb, var(--bw-forest) 88%, transparent) 100%);
    pointer-events: none;
}

.bw-cover__branch {
    position: absolute;
    z-index: 2;
    width: min(28vw, 180px);
    opacity: 0.55;
    pointer-events: none;
}

.bw-cover__branch--east {
    inset-inline-start: -2%;
    top: 18%;
    transform: scaleX(-1) rotate(-8deg);
}

.bw-cover__branch--west {
    inset-inline-end: -2%;
    bottom: 16%;
    transform: rotate(6deg);
}

.bw-cover__arch {
    position: relative;
    z-index: 3;
    width: min(420px, 88vw);
    aspect-ratio: 4 / 5.05;
    display: grid;
    place-items: center;
}

.bw-arch__frame {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    pointer-events: none;
}

.bw-arch__outer {
    fill: none;
    stroke: color-mix(in srgb, var(--bw-ivory) 55%, var(--bw-sage));
    stroke-width: 2.2;
    stroke-linecap: round;
}

.bw-arch__inner {
    fill: none;
    stroke: var(--bw-gold);
    stroke-width: 0.9;
    stroke-linecap: round;
    opacity: 0.8;
}

.bw-arch__frame--draw .bw-arch__outer,
.bw-arch__frame--draw .bw-arch__inner {
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    animation: bw-u-draw 1.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.bw-arch__frame--draw .bw-arch__inner { animation-delay: 0.22s; }

.bw-cover__glow {
    position: absolute;
    inset: 16% 18% 10%;
    background: radial-gradient(ellipse at 50% 40%, color-mix(in srgb, #f3e3b0 22%, transparent), transparent 70%);
    pointer-events: none;
}

.bw-cover__content {
    position: relative;
    z-index: 1;
    text-align: center;
    padding: 18% 14% 12%;
    max-width: 100%;
}

.bw-cover__wordmark {
    margin: 0;
    font-family: var(--bw-font-display);
    font-size: clamp(1.85rem, 7.4vw, 2.85rem);
    font-weight: 600;
    letter-spacing: 0.08em;
    line-height: 1.15;
    color: var(--bw-ivory);
    text-transform: uppercase;
}

.bw-cover__wordmark:not([dir="ltr"]) {
    letter-spacing: 0.01em;
    text-transform: none;
}

.bw-masthead__title:not([dir="ltr"]),
.bw-colophon__name:not([dir="ltr"]) {
    letter-spacing: 0;
}

.bw-cover__wordmark .bw-cover__u {
    color: var(--bw-gold);
    font-style: italic;
    font-weight: 700;
}

.bw-cover__menu {
    margin: 0.55rem 0 0;
    font-family: var(--bw-font-display);
    font-size: clamp(0.95rem, 3.2vw, 1.2rem);
    font-weight: 500;
    letter-spacing: 0.46em;
    text-transform: uppercase;
    color: var(--bw-gold);
}

.bw-cover__sub {
    margin: 0.9rem auto 0;
    max-width: 22ch;
    font-size: 0.92rem;
    line-height: 1.8;
    color: color-mix(in srgb, var(--bw-ivory) 78%, var(--bw-sage));
}

.bw-cover__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.6rem;
    margin-top: 1.35rem;
}

.bw-cover .bw-btn--fill {
    background: var(--bw-ivory);
    border-color: var(--bw-ivory);
    color: var(--bw-olive-dark);
    min-width: 10.5rem;
}

.bw-cover .bw-btn--fill:hover,
.bw-cover .bw-btn--fill:focus-visible {
    background: var(--bw-gold);
    border-color: var(--bw-gold);
    color: var(--bw-forest);
}

.bw-cover .bw-btn--line {
    border-color: color-mix(in srgb, var(--bw-ivory) 40%, transparent);
    color: var(--bw-ivory);
}

.bw-cover .bw-btn--line:hover {
    background: var(--bw-ivory);
    color: var(--bw-olive-dark);
    border-color: var(--bw-ivory);
}

.bw-sprig {
    display: inline-flex;
    justify-content: center;
    color: var(--bw-olive);
}

.bw-sprig__svg {
    width: 7.5rem;
    height: auto;
}

.bw-sprig__gold { fill: var(--bw-gold); }

.bw-band--dark .bw-sprig { color: var(--bw-sage-soft); }

.bw-colophon__emblem {
    width: 42px;
    height: 42px;
    margin: 0 auto 0.85rem;
}

.bw-loader .bw-arch__outer,
.bw-colophon .bw-arch__outer,
.bw-empty .bw-arch__outer {
    stroke: var(--bw-olive);
}

.bw-loader .bw-arch__inner,
.bw-colophon .bw-arch__inner,
.bw-empty .bw-arch__inner {
    stroke: var(--bw-gold);
}

.bw-issue-nav__emblem {
    display: inline-grid;
    place-items: center;
    width: 50px;
    height: 50px;
    margin: -1rem 0.3rem 0;
    border: 1px solid color-mix(in srgb, var(--bw-gold) 55%, var(--bw-olive));
    border-radius: 50% 50% 42% 42%;
    background: var(--bw-olive);
    box-shadow: 0 8px 22px color-mix(in srgb, var(--bw-olive-dark) 28%, transparent);
    transition: transform var(--bw-transition), box-shadow var(--bw-transition);
}

.bw-issue-nav__emblem:hover,
.bw-issue-nav__emblem:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px color-mix(in srgb, var(--bw-olive-dark) 32%, transparent);
}

.bw-issue-nav__emblem .bw-u-mark {
    width: 24px;
    height: 24px;
}

.bw-issue-nav__emblem .bw-u-mark__outer { stroke: var(--bw-ivory); stroke-width: 15; }
.bw-issue-nav__emblem .bw-u-mark__inner { stroke: var(--bw-gold); stroke-width: 5; }

.bw-menu-head__intro {
    position: relative;
}

.bw-modal__u {
    position: absolute;
    top: 0.85rem;
    left: 0.85rem;
    width: 28px;
    height: 28px;
    opacity: 0.4;
    z-index: 2;
}

@media (max-width: 640px) {
    .bw-masthead__u { width: 30px; height: 30px; }
    .bw-u-watermark__cell--tl { display: none; }

    .bw-cover {
        min-height: 0;
        padding: 1.75rem 0 2rem;
    }

    .bw-cover__arch {
        width: min(340px, 86vw);
        aspect-ratio: auto;
        min-height: 22.5rem;
        padding-bottom: 0.5rem;
    }

    .bw-cover__branch {
        width: min(34vw, 120px);
        opacity: 0.4;
    }

    .bw-cover__content { padding: 20% 12% 14%; }
}

@media (prefers-reduced-motion: reduce) {
    .bw-u-mark__svg--draw .bw-u-mark__trace,
    .bw-arch__frame--draw .bw-arch__outer,
    .bw-arch__frame--draw .bw-arch__inner {
        animation: none;
        stroke-dashoffset: 0;
        opacity: 1;
    }
}