/* ============================================================
   GWV Interactions — "Glass Zine" aesthetic
   Stacks on top of liquid-glass.css. Every effect honors
   prefers-reduced-motion.
   ============================================================ */

:root {
    --aurora-a: rgba(212, 114, 158, 0.55);
    --aurora-b: rgba(212, 168, 83, 0.45);
    --aurora-c: rgba(155, 111, 192, 0.55);
    --ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
    --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ---------- global grain overlay (very subtle, zine texture) ---------- */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 9995;
    opacity: 0.035;
    mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.7 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* ---------- cursor aurora blob (desktop only) ---------- */
.cursor-aurora {
    position: fixed;
    top: 0;
    left: 0;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: radial-gradient(circle at 50% 50%,
        var(--aurora-a) 0%,
        var(--aurora-b) 35%,
        var(--aurora-c) 60%,
        transparent 72%);
    filter: blur(55px) saturate(140%);
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    transform: translate3d(-50%, -50%, 0);
    transition: opacity 0.6s ease;
    mix-blend-mode: screen;
    will-change: transform, opacity;
}
.cursor-aurora.is-active { opacity: 0.85; }

@media (hover: none), (prefers-reduced-motion: reduce) {
    .cursor-aurora { display: none; }
}

/* ---------- cursor sparkle trail ---------- */
.sparkle-particle {
    position: fixed;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    pointer-events: none;
    z-index: 9996;
    background: radial-gradient(circle, var(--bright-gold) 0%, rgba(212,168,83,0) 70%);
    mix-blend-mode: screen;
    animation: sparkle-fade 900ms ease-out forwards;
    will-change: transform, opacity;
}
@keyframes sparkle-fade {
    0%   { opacity: 0.95; transform: translate(-50%, -50%) scale(0.4); }
    60%  { opacity: 0.75; transform: translate(-50%, -50%) scale(1.6); }
    100% { opacity: 0;    transform: translate(-50%, -50%) scale(2.2) translateY(12px); }
}
@media (hover: none), (prefers-reduced-motion: reduce) {
    .sparkle-particle { display: none !important; }
}

/* ---------- hero verb cycle ---------- */
.verb-cycle {
    position: relative;
    display: inline-block;
    vertical-align: baseline;
    white-space: nowrap;
    padding-right: 0.1ch;
}
@keyframes verb-shimmer {
    0%   { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}
.verb-cycle .verb-in,
.verb-cycle .verb-out {
    display: inline-block;
    background: linear-gradient(135deg, var(--bright-gold) 0%, var(--soft-pink) 50%, var(--bright-purple) 100%);
    background-size: 200% 100%;
    background-position: 30% 50%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.verb-cycle .verb-in {
    animation: verb-enter 520ms var(--ease-out-expo) both;
}
.verb-cycle .verb-out {
    animation: verb-leave 360ms ease-in both;
    position: absolute;
    left: 0;
    top: 0;
}
@keyframes verb-enter {
    0%  { opacity: 0.35; transform: translateY(15%) rotate(-1.2deg); filter: blur(2px); }
    100% { opacity: 1; transform: translateY(0) rotate(0); filter: blur(0); }
}
@keyframes verb-leave {
    from { opacity: 1; transform: translateY(0); filter: blur(0); }
    to   { opacity: 0; transform: translateY(-22%); filter: blur(4px); }
}
@media (prefers-reduced-motion: reduce) {
    .verb-cycle { animation: none; }
    .verb-cycle .verb-in, .verb-cycle .verb-out { animation: none; }
}

/* Tiny animated underline under "you wish existed" */
.hand-underline {
    position: relative;
    display: inline-block;
}
.hand-underline::after {
    content: "";
    position: absolute;
    left: 6%;
    right: 6%;
    bottom: -8px;
    height: 10px;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 10' preserveAspectRatio='none'><path d='M2 8 C 35 2, 70 2, 110 6 S 185 4, 218 2' stroke='%23e8c875' stroke-width='2.2' fill='none' stroke-linecap='round'/></svg>") no-repeat center / 100% 100%;
    transform: scaleX(0);
    transform-origin: left center;
    animation: hand-draw 1.6s 0.7s var(--ease-out-expo) forwards;
    opacity: 0.9;
    pointer-events: none;
}
@keyframes hand-draw {
    to { transform: scaleX(1); }
}
@media (prefers-reduced-motion: reduce) {
    .hand-underline::after { animation: none; transform: scaleX(1); }
}

/* ---------- stream card magnetism + pick ripple + seat counter ---------- */
.stream-card {
    --mx: 50%;
    --my: 50%;
    --tilt: 0deg;
    --rx: 0deg;
    --ry: 0deg;
    transform-style: preserve-3d;
    will-change: transform;
}
.stream-card:hover,
.stream-card:focus-visible {
    transform: translateY(-6px) perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));
}
.stream-card::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(380px circle at var(--mx) var(--my),
        rgba(255, 255, 255, 0.14) 0%,
        rgba(255, 255, 255, 0) 55%);
    opacity: 0;
    transition: opacity 0.35s ease;
    pointer-events: none;
    z-index: 1;
}
.stream-card:hover::after,
.stream-card:focus-visible::after {
    opacity: 1;
}

.stream-card .seat-badge {
    position: absolute;
    top: 14px;
    left: 50%;
    transform: translateX(-50%);
    font-family: 'DM Mono', monospace;
    font-size: 0.68rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 999px;
    background: rgba(13, 10, 18, 0.55);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: var(--bright-gold);
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}
.stream-card .seat-badge::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--bright-gold);
    box-shadow: 0 0 0 0 rgba(232, 200, 117, 0.7);
    animation: seat-pulse 2s ease-out infinite;
}
.stream-card[data-stream-status="filling"] .seat-badge {
    color: var(--terracotta);
    border-color: rgba(196, 77, 63, 0.5);
}
.stream-card[data-stream-status="filling"] .seat-badge::before {
    background: var(--terracotta);
    animation-duration: 1.2s;
}
@keyframes seat-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(232, 200, 117, 0.55); }
    70%  { box-shadow: 0 0 0 8px rgba(232, 200, 117, 0); }
    100% { box-shadow: 0 0 0 0 rgba(232, 200, 117, 0); }
}
@media (prefers-reduced-motion: reduce) {
    .stream-card .seat-badge::before { animation: none; }
}

.pick-ripple {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    border: 2px solid var(--warm-gold);
    transform: translate(-50%, -50%) scale(0);
    opacity: 0.8;
    animation: pick-ripple 780ms var(--ease-out-expo) forwards;
    z-index: 4;
}
@keyframes pick-ripple {
    to { transform: translate(-50%, -50%) scale(14); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .pick-ripple { animation: none; opacity: 0; }
}

/* ---------- 6-week timeline scroll progression ---------- */
.week-rail {
    position: relative;
}
.week-rail::before {
    content: "";
    position: absolute;
    left: 1rem;
    right: 1rem;
    top: 3.4rem;
    height: 2px;
    background: linear-gradient(to right,
        var(--warm-gold) 0%,
        var(--warm-gold) var(--rail-progress, 0%),
        rgba(123, 79, 158, 0.25) var(--rail-progress, 0%),
        rgba(123, 79, 158, 0.15) 100%);
    z-index: 0;
    transition: background 0.6s ease;
    pointer-events: none;
}
@media (max-width: 900px) {
    .week-rail::before { display: none; }
}

.week-cell {
    position: relative;
    cursor: pointer;
    transform-origin: center center;
    transition: transform 0.5s var(--ease-bounce), border-color 0.5s ease, box-shadow 0.5s ease;
}
.week-cell::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: 0 0 0 0 rgba(212, 168, 83, 0);
    transition: box-shadow 0.7s ease;
    pointer-events: none;
}
.week-cell.is-lit {
    border-color: rgba(212, 168, 83, 0.45);
    transform: translateY(-4px);
}
.week-cell.is-lit::after {
    box-shadow: 0 0 0 1px rgba(212, 168, 83, 0.32), 0 16px 42px rgba(212, 114, 158, 0.22);
}
.week-cell.is-lit .week-num {
    animation: week-num-pop 700ms var(--ease-bounce);
}
@keyframes week-num-pop {
    0%   { transform: scale(0.7) rotate(-4deg); opacity: 0.3; }
    60%  { transform: scale(1.12) rotate(2deg); opacity: 1; }
    100% { transform: scale(1) rotate(0); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .week-cell { transition: none; }
    .week-cell.is-lit { transform: none; }
    .week-cell.is-lit .week-num { animation: none; }
    .week-rail::before { transition: none; }
}

/* week peek expansion */
.week-cell .week-peek {
    margin-top: 0.9rem;
    padding-top: 0.75rem;
    border-top: 1px dashed rgba(255, 255, 255, 0.18);
    display: none;
    animation: peek-down 420ms var(--ease-out-expo);
}
.week-cell.is-open .week-peek {
    display: block;
}
.week-cell .week-peek-item {
    font-size: 0.78rem;
    color: rgba(245, 240, 232, 0.72);
    font-family: 'DM Mono', monospace;
    padding: 3px 0;
    display: flex;
    gap: 8px;
    align-items: baseline;
}
.week-cell .week-peek-item::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--warm-gold);
    flex-shrink: 0;
    margin-top: 5px;
}
@keyframes peek-down {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}
.week-toggle-hint {
    font-family: 'DM Mono', monospace;
    font-size: 0.65rem;
    letter-spacing: 0.1em;
    color: var(--warm-gold);
    text-transform: uppercase;
    opacity: 0.5;
    margin-top: auto;
    padding-top: 0.5rem;
    transition: opacity 0.3s ease;
}
.week-cell:hover .week-toggle-hint,
.week-cell.is-open .week-toggle-hint,
.week-cell:focus-visible .week-toggle-hint {
    opacity: 0.95;
}
.week-cell.is-open .week-toggle-hint::after {
    content: " · tap to close";
}
.week-cell:not(.is-open) .week-toggle-hint::after {
    content: " · tap to peek";
}

/* ---------- toolkit card expansion ---------- */
.tool-card {
    position: relative;
    cursor: pointer;
}
.tool-card .tool-use {
    display: none;
    margin-top: 0.7rem;
    padding-top: 0.6rem;
    border-top: 1px dashed rgba(255, 255, 255, 0.15);
    font-family: 'Newsreader', serif;
    font-size: 0.82rem;
    line-height: 1.55;
    color: rgba(245, 240, 232, 0.88);
    font-style: italic;
    animation: tool-fade 360ms var(--ease-out-expo);
}
.tool-card.is-open .tool-use { display: block; }
.tool-card.is-open {
    border-color: rgba(212, 168, 83, 0.5);
    background: rgba(212, 168, 83, 0.08);
}
@keyframes tool-fade {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}
.tool-card .tool-chip {
    position: absolute;
    top: 12px;
    right: 12px;
    font-family: 'DM Mono', monospace;
    font-size: 0.6rem;
    letter-spacing: 0.1em;
    padding: 3px 9px;
    border-radius: 999px;
    background: rgba(155, 111, 192, 0.2);
    border: 1px solid rgba(155, 111, 192, 0.35);
    color: var(--bright-purple);
    text-transform: uppercase;
    z-index: 2;
}

/* ---------- sponsor progress bar ---------- */
.sponsor-progress {
    margin: 0 auto 1.5rem;
    max-width: 560px;
    font-family: 'Work Sans', sans-serif;
}
.sponsor-progress-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 0.5rem;
    font-family: 'DM Mono', monospace;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    color: var(--warm-gold);
    text-transform: uppercase;
}
.sponsor-progress-head .count {
    font-family: var(--font-display);
    font-size: 1.1rem;
    color: var(--cream);
    letter-spacing: -0.01em;
    text-transform: none;
}
.sponsor-progress-head .count .sponsor-big {
    font-size: 1.55rem;
    font-weight: 700;
    background: linear-gradient(135deg, var(--bright-gold), var(--soft-pink));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin-right: 0.2rem;
}
.sponsor-progress-bar {
    position: relative;
    height: 14px;
    background: rgba(13, 10, 18, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 999px;
    overflow: hidden;
}
.sponsor-progress-fill {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 0%;
    background: linear-gradient(90deg, var(--bright-gold) 0%, var(--soft-pink) 50%, var(--bright-purple) 100%);
    border-radius: 999px;
    transition: width 1.6s var(--ease-out-expo);
    box-shadow: 0 0 16px rgba(232, 200, 117, 0.4), inset 0 1px 0 rgba(255,255,255,0.35);
}
.sponsor-progress-fill::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.35) 50%, transparent 100%);
    background-size: 60% 100%;
    background-repeat: no-repeat;
    animation: sponsor-shimmer 2.8s linear infinite;
    border-radius: inherit;
}
@keyframes sponsor-shimmer {
    from { background-position: -60% 0; }
    to   { background-position: 160% 0; }
}
.sponsor-progress-meta {
    display: flex;
    justify-content: space-between;
    margin-top: 0.55rem;
    font-family: 'DM Mono', monospace;
    font-size: 0.7rem;
    color: rgba(245, 240, 232, 0.55);
    letter-spacing: 0.06em;
}
@media (prefers-reduced-motion: reduce) {
    .sponsor-progress-fill { transition: none; }
    .sponsor-progress-fill::after { animation: none; opacity: 0.1; }
}

/* ---------- confetti container ---------- */
#gwv-confetti {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 9997;
}

/* ---------- handwritten note floaters ---------- */
.hand-note {
    font-family: var(--font-hand);
    font-size: 1.2rem;
    color: var(--warm-gold);
    line-height: 1.1;
    opacity: 0.7;
    transform: rotate(-4deg);
    pointer-events: none;
    position: absolute;
    white-space: nowrap;
}
.hand-note-arrow {
    display: inline-block;
    margin-right: 0.3rem;
    transform: rotate(20deg);
}

/* ---------- scroll-progress ribbon at very top ---------- */
.scroll-ribbon {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    width: 0;
    background: linear-gradient(90deg, var(--bright-gold), var(--soft-pink), var(--bright-purple));
    z-index: 10000;
    transition: width 80ms linear;
    will-change: width;
    pointer-events: none;
    box-shadow: 0 0 12px rgba(232, 200, 117, 0.5);
}
@media (prefers-reduced-motion: reduce) {
    .scroll-ribbon { display: none; }
}

/* ---------- nav subtle hover lift ---------- */
.desktop-nav .nav-link {
    position: relative;
}
.desktop-nav .nav-link::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 2px;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--bright-gold), var(--soft-pink));
    border-radius: 999px;
    transition: width 0.3s var(--ease-out-expo), left 0.3s var(--ease-out-expo);
}
.desktop-nav .nav-link:hover::after,
.desktop-nav .nav-link.active::after {
    width: 60%;
    left: 20%;
}

/* ============================================================
   NATURE SCENES — iOS wallpaper vibe.
   Each section gets a photographic backdrop with a dark glass overlay
   so the glass cards stay legible.
   ============================================================ */
.scene-mountains,
.scene-waterfall,
.scene-wildflowers {
    position: relative;
    isolation: isolate;
    background: var(--deep-purple);
    overflow: hidden;
}
.scene-mountains > .scene-layer,
.scene-waterfall > .scene-layer,
.scene-wildflowers > .scene-layer {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.scene-mountains > .scene-layer::after,
.scene-waterfall > .scene-layer::after,
.scene-wildflowers > .scene-layer::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(13, 10, 18, 0.45) 0%, rgba(45, 27, 78, 0.65) 45%, rgba(26, 10, 46, 0.9) 100%),
        radial-gradient(ellipse at 70% 30%, rgba(212, 114, 158, 0.18), transparent 55%);
    backdrop-filter: saturate(1.1);
}

.scene-mountains > .scene-layer {
    background-image: url("https://images.unsplash.com/photo-1464822759023-fed622ff2c3b?auto=format&fit=crop&w=2000&q=75");
}
.scene-waterfall > .scene-layer {
    background-image: url("https://images.unsplash.com/photo-1432405972618-c60b0225b8f9?auto=format&fit=crop&w=2000&q=75");
}
.scene-wildflowers > .scene-layer {
    background-image: url("https://images.unsplash.com/photo-1522383225653-ed111181a951?auto=format&fit=crop&w=2000&q=75");
}

@media (prefers-reduced-motion: no-preference) and (min-width: 760px) {
    .scene-mountains > .scene-layer,
    .scene-waterfall > .scene-layer,
    .scene-wildflowers > .scene-layer {
        background-attachment: fixed;
    }
}

/* ============================================================
   TOOLKIT FLIP CARDS — "this tool does X" / "here's the tool"
   ============================================================ */
.tool-flip-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    grid-auto-rows: 1fr;
}
@media (max-width: 900px) {
    .tool-flip-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 500px) {
    .tool-flip-grid { grid-template-columns: 1fr; }
}

.tool-flip {
    position: relative;
    height: 100%;
    min-height: 210px;
    perspective: 1200px;
    cursor: pointer;
    outline: none;
}
.tool-flip:focus-visible {
    border-radius: 20px;
    box-shadow: 0 0 0 3px rgba(232, 200, 117, 0.55);
}
.tool-flip-inner {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: inherit;
    transition: transform 0.7s var(--ease-out-expo);
    transform-style: preserve-3d;
}
.tool-flip.is-flipped .tool-flip-inner { transform: rotateY(180deg); }

.tool-flip-face {
    position: absolute;
    inset: 0;
    border-radius: 20px;
    padding: 1.4rem 1.2rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    overflow: hidden;
    isolation: isolate;
    background: var(--glass-bg);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
}
.tool-flip-face::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: var(--glass-highlight);
    opacity: 0.8;
    pointer-events: none;
}
.tool-flip-face > * { position: relative; z-index: 2; }

.tool-flip-front {
    background: linear-gradient(140deg, rgba(155, 111, 192, 0.16), rgba(26, 10, 46, 0.6));
}
.tool-flip-front-label {
    font-family: 'DM Mono', monospace;
    font-size: 0.68rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--warm-gold);
    opacity: 0.85;
}
.tool-flip-front-what {
    font-family: var(--font-body);
    color: var(--cream);
    font-size: 1.02rem;
    line-height: 1.45;
    font-style: italic;
    flex: 1;
}
.tool-flip-cta {
    font-family: 'DM Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    color: var(--bright-gold);
    opacity: 0.8;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
}

.tool-flip-back {
    transform: rotateY(180deg);
    background: linear-gradient(140deg, rgba(212, 168, 83, 0.18), rgba(212, 114, 158, 0.15), rgba(45, 27, 78, 0.7));
    text-align: center;
    align-items: center;
    justify-content: center;
}
.tool-flip-mark {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 2.2rem;
    line-height: 1;
    background: linear-gradient(135deg, var(--bright-gold), var(--soft-pink));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.tool-flip-name {
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--cream);
    font-size: 1.15rem;
    line-height: 1.1;
}
.tool-flip-access {
    font-size: 0.82rem;
    color: rgba(245, 240, 232, 0.75);
    line-height: 1.4;
}
.tool-flip-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 0.4rem;
    padding: 0.45rem 0.95rem;
    border-radius: 999px;
    background: var(--warm-gold);
    color: var(--deep-purple);
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
    font-size: 0.85rem;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.tool-flip-link:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(212, 168, 83, 0.35);
}
.tool-flip-practice {
    font-family: 'DM Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.1em;
    color: var(--soft-pink);
    text-transform: uppercase;
    padding: 0.35rem 0.8rem;
    border: 1px solid rgba(212, 114, 158, 0.4);
    border-radius: 999px;
    margin-top: 0.4rem;
}

@media (prefers-reduced-motion: reduce) {
    .tool-flip-inner { transition: none; }
}

/* ============================================================
   PROMPT CARDS — "we built these with prompts, try it on Lovable"
   ============================================================ */
.prompt-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.2rem;
    grid-auto-rows: 1fr;
}
@media (max-width: 760px) {
    .prompt-grid { grid-template-columns: 1fr; }
}
.prompt-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1.5rem 1.4rem;
    border-radius: 22px;
    background: rgba(13, 10, 18, 0.55);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 14px 38px rgba(0, 0, 0, 0.35);
    height: 100%;
}
.prompt-card-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}
.prompt-card-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: 'DM Mono', monospace;
    font-size: 0.65rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--bright-purple);
}
.prompt-card-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #7ce382;
    box-shadow: 0 0 8px #7ce38299;
    animation: seat-pulse 2.4s ease-out infinite;
}
.prompt-card-name {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 1.35rem;
    color: var(--cream);
    margin-top: 0.1rem;
    line-height: 1.1;
}
.prompt-card-visit {
    font-family: 'DM Mono', monospace;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    color: var(--warm-gold);
    text-decoration: none;
    padding: 0.45rem 0.8rem;
    border: 1px solid rgba(212, 168, 83, 0.45);
    border-radius: 999px;
    transition: all 0.25s ease;
    flex-shrink: 0;
}
.prompt-card-visit:hover {
    background: var(--warm-gold);
    color: var(--deep-purple);
}
.prompt-card-what {
    color: rgba(245, 240, 232, 0.88);
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.55;
    font-style: italic;
}
.prompt-card-details {
    margin-top: auto;
    padding-top: 0.75rem;
    border-top: 1px dashed rgba(255, 255, 255, 0.15);
}
.prompt-card-details[open] .prompt-card-summary-chevron { transform: rotate(180deg); }
.prompt-card-details summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.15rem 0;
    font-family: 'DM Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    color: var(--warm-gold);
    text-transform: uppercase;
}
.prompt-card-details summary::-webkit-details-marker { display: none; }
.prompt-card-summary-chevron {
    transition: transform 0.3s ease;
}
.prompt-card-prompt {
    margin: 0.75rem 0 0.85rem;
    padding: 0.85rem 1rem;
    background: rgba(212, 168, 83, 0.08);
    border-left: 3px solid var(--warm-gold);
    border-radius: 0 12px 12px 0;
    color: rgba(245, 240, 232, 0.92);
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 0.92rem;
    line-height: 1.55;
    white-space: pre-wrap;
    quotes: "“" "”";
}
.prompt-card-prompt::before { content: open-quote; color: var(--warm-gold); margin-right: 2px; }
.prompt-card-prompt::after { content: close-quote; color: var(--warm-gold); margin-left: 2px; }
.prompt-card-actions {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}
.prompt-copy-btn,
.prompt-try-btn {
    font-family: 'Work Sans', sans-serif;
    font-size: 0.85rem;
    font-weight: 600;
    padding: 0.55rem 1rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    background: rgba(255, 255, 255, 0.06);
    color: var(--cream);
    cursor: pointer;
    transition: all 0.25s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.prompt-copy-btn:hover {
    border-color: var(--warm-gold);
    color: var(--warm-gold);
}
.prompt-try-btn {
    background: linear-gradient(135deg, var(--warm-gold), var(--bright-gold));
    color: var(--deep-purple);
    border-color: transparent;
    font-weight: 700;
}
.prompt-try-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(212, 168, 83, 0.45);
}

/* ============================================================
   ENROLL STEPS (slim, numbered)
   ============================================================ */
.enroll-step {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.1);
}
.enroll-step:last-of-type { border-bottom: none; }
.enroll-step-num {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--bright-gold), var(--soft-pink));
    color: var(--deep-purple);
    font-family: var(--font-display);
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.05rem;
    flex-shrink: 0;
}
.enroll-step-body { min-width: 0; }
.enroll-step-label {
    display: block;
    font-family: 'DM Mono', monospace;
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--warm-gold);
    margin-bottom: 0.5rem;
}
.enroll-step .enroll-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}
@media (max-width: 560px) {
    .enroll-step .enroll-row { grid-template-columns: 1fr; }
}
.enroll-step input,
.enroll-step select {
    background: rgba(13, 10, 18, 0.45);
    border: 1px solid var(--glass-border);
    border-radius: 12px;
    padding: 0.8rem 0.95rem;
    color: var(--cream);
    font-family: 'Work Sans', sans-serif;
    font-size: 1rem;
    width: 100%;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.enroll-step input:focus,
.enroll-step select:focus {
    outline: none;
    border-color: var(--warm-gold);
    box-shadow: 0 0 0 3px rgba(212, 168, 83, 0.18);
}

.enroll-guardian-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
    gap: 0.75rem;
}
@media (max-width: 640px) {
    .enroll-guardian-row { grid-template-columns: 1fr; }
}
.enroll-guardian-row input {
    background: rgba(13, 10, 18, 0.45);
    border: 1px solid var(--glass-border);
    border-radius: 12px;
    padding: 0.8rem 0.95rem;
    color: var(--cream);
    font-family: 'Work Sans', sans-serif;
    font-size: 1rem;
    width: 100%;
}
.enroll-guardian-row input:focus {
    outline: none;
    border-color: var(--warm-gold);
    box-shadow: 0 0 0 3px rgba(212, 168, 83, 0.18);
}

.enroll-consent {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    background: rgba(212, 168, 83, 0.06);
    border: 1px solid rgba(212, 168, 83, 0.22);
    border-radius: 12px;
}
.enroll-consent input[type="checkbox"] {
    margin: 0.2rem 0 0 0;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    accent-color: var(--warm-gold);
    cursor: pointer;
}
.enroll-consent label {
    font-family: 'Work Sans', sans-serif;
    font-size: 0.92rem;
    line-height: 1.55;
    color: rgba(245, 240, 232, 0.9);
    cursor: pointer;
    flex: 1;
    text-transform: none;
    letter-spacing: normal;
}
.enroll-consent label a {
    color: var(--warm-gold);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.enroll-optional {
    margin-top: 1rem;
    padding: 1rem;
    background: rgba(155, 111, 192, 0.08);
    border: 1px dashed rgba(155, 111, 192, 0.3);
    border-radius: 16px;
}
.enroll-optional summary {
    cursor: pointer;
    list-style: none;
    font-family: 'DM Mono', monospace;
    font-size: 0.78rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--bright-purple);
    padding: 0.15rem 0;
}
.enroll-optional summary::-webkit-details-marker { display: none; }
.enroll-optional summary::before {
    content: "+";
    margin-right: 0.55rem;
    display: inline-block;
    transition: transform 0.3s ease;
    color: var(--warm-gold);
    font-weight: 700;
}
.enroll-optional[open] summary::before { content: "\2013"; }
.enroll-optional-body {
    padding-top: 0.9rem;
}

/* ============================================================
   ASK ROO CTA block (replaces the old contact form)
   ============================================================ */
.roo-cta-block {
    margin-top: 2.25rem;
    padding: 1.4rem 1.6rem;
    background: linear-gradient(135deg, rgba(236, 72, 153, 0.14), rgba(155, 111, 192, 0.14));
    border: 1px solid rgba(236, 72, 153, 0.3);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}
.roo-cta-text h3 {
    color: var(--cream);
    font-size: 1.2rem;
    margin: 0 0 0.25rem;
}
.roo-cta-text p {
    color: rgba(245, 240, 232, 0.78);
    font-size: 0.92rem;
    margin: 0;
}
.roo-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 12px 22px;
    background: radial-gradient(circle at 30% 30%, #fbcfe8 0%, #ec4899 70%);
    color: #fff;
    border: none;
    border-radius: 999px;
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(236, 72, 153, 0.35);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.roo-cta-btn img { width: 28px; height: 28px; }
.roo-cta-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(236, 72, 153, 0.5);
}

/* ============================================================
   SPONSOR EDITORIAL — cream paper pledge card, distinct from girl-facing glass
   ============================================================ */
.sponsor-editorial {
    padding: clamp(3rem, 7vw, 6rem) 1rem;
    background:
        linear-gradient(180deg, rgba(26, 10, 46, 0.9), rgba(26, 10, 46, 0.95)),
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='260' height='260'><defs><pattern id='d' x='0' y='0' width='26' height='26' patternUnits='userSpaceOnUse'><circle cx='1' cy='1' r='0.6' fill='%23d4a85333'/></pattern></defs><rect width='100%25' height='100%25' fill='url(%23d)'/></svg>");
    display: flex;
    justify-content: center;
}
.sponsor-editorial-wrap {
    width: 100%;
    max-width: 820px;
}
.pledge-card {
    position: relative;
    padding: clamp(2rem, 5vw, 3.5rem);
    background:
        linear-gradient(180deg, #faf5ea 0%, #f3ebd8 100%),
        #faf5ea;
    color: #1a1414;
    border-radius: 6px;
    box-shadow:
        0 30px 60px rgba(0, 0, 0, 0.45),
        0 1px 0 rgba(255, 255, 255, 0.7) inset,
        0 0 0 1px rgba(120, 90, 40, 0.18) inset;
    font-family: var(--font-body);
    overflow: hidden;
}
.pledge-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 6px;
    background: linear-gradient(90deg, #c9a14a 0%, #e4c275 50%, #c9a14a 100%);
}
.pledge-card::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='p'><feTurbulence type='fractalNoise' baseFrequency='0.78' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.55  0 0 0 0 0.38  0 0 0 0 0.15  0 0 0 0.08 0'/></filter><rect width='100%25' height='100%25' filter='url(%23p)'/></svg>");
    opacity: 0.35;
    mix-blend-mode: multiply;
}
.pledge-card > * { position: relative; z-index: 1; }

.pledge-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    margin-bottom: 1.75rem;
    flex-wrap: wrap;
}
.pledge-stamp {
    border: 1.5px double #8d6b28;
    padding: 0.55rem 1rem;
    border-radius: 2px;
    transform: rotate(-2deg);
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #6b4d16;
}
.pledge-stamp-inner {
    font-family: var(--font-display);
    font-variation-settings: "opsz" 16;
    font-weight: 800;
    letter-spacing: 0.08em;
    font-size: 0.7rem;
    text-transform: uppercase;
}
.pledge-stamp-ein {
    font-family: 'DM Mono', monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    margin-top: 2px;
    color: #8d6b28;
}
.pledge-eyebrow {
    font-family: 'DM Mono', monospace;
    font-size: 0.68rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #8d6b28;
    text-align: right;
    flex: 1;
    align-self: center;
}
.pledge-title {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: clamp(2rem, 5vw, 3rem);
    line-height: 1.05;
    color: #1a1414;
    margin-bottom: 1rem;
    font-variation-settings: "opsz" 144, "SOFT" 30;
    letter-spacing: -0.01em;
}
.pledge-lede p {
    font-family: var(--font-body);
    font-size: 1.08rem;
    line-height: 1.7;
    color: #2a1e14;
    margin-bottom: 0.85rem;
}
.pledge-lede p:first-of-type::first-letter {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 3.2rem;
    float: left;
    line-height: 0.85;
    padding: 6px 10px 0 0;
    color: #8d6b28;
}
.pledge-ledger {
    margin: 2rem 0 2rem;
    padding: 1.2rem 1.35rem;
    border-top: 1px solid #b5913d;
    border-bottom: 1px solid #b5913d;
    font-family: 'Newsreader', serif;
}
.pledge-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 0.4rem 0;
    gap: 1rem;
    border-bottom: 1px dotted rgba(141, 107, 40, 0.3);
}
.pledge-row:last-child { border-bottom: none; }
.pledge-line {
    color: #3a2c1a;
    font-size: 0.98rem;
}
.pledge-amt {
    font-family: 'DM Mono', monospace;
    color: #6b4d16;
    font-size: 0.92rem;
    font-weight: 600;
    white-space: nowrap;
}
.pledge-row-total {
    padding-top: 0.65rem;
    margin-top: 0.35rem;
    border-top: 1.5px solid #8d6b28;
    border-bottom: none;
}
.pledge-row-total .pledge-line,
.pledge-row-total .pledge-amt {
    font-family: var(--font-display);
    font-weight: 700;
    color: #1a1414;
    font-size: 1.1rem;
}

.pledge-card .sponsor-tile {
    background: rgba(141, 107, 40, 0.06);
    border-color: #b5913d;
    color: #1a1414;
}
.pledge-card .sponsor-tile:hover {
    background: rgba(141, 107, 40, 0.14);
}
.pledge-card .sponsor-tile.is-active {
    background: #f0e2be;
    border-color: #8d6b28;
    box-shadow: 0 0 0 3px rgba(141, 107, 40, 0.18);
}
.pledge-card .sponsor-tile-amt {
    color: #1a1414;
    background: none;
    -webkit-text-fill-color: #1a1414;
}
.pledge-card .sponsor-tile.is-active .sponsor-tile-amt {
    color: #6b4d16;
    -webkit-text-fill-color: #6b4d16;
}
.pledge-card .sponsor-tile-sub { color: #6b4d16; }

.pledge-card .enroll-field input {
    background: #fefbf2;
    border: 1px solid #b5913d;
    color: #1a1414;
    border-radius: 4px;
}
.pledge-card .enroll-field input:focus {
    border-color: #6b4d16;
    box-shadow: 0 0 0 3px rgba(107, 77, 22, 0.18);
}
.pledge-card .enroll-field label > span,
.pledge-card .enroll-field > span {
    color: #8d6b28 !important;
}
.pledge-card .btn-primary {
    background: #1a1414 !important;
    color: #f0e2be !important;
    border-radius: 4px !important;
    font-family: var(--font-display) !important;
    letter-spacing: 0.03em;
}
.pledge-card .btn-primary:hover {
    background: #2a1e14 !important;
}

.pledge-footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: 2rem;
    padding-top: 1.25rem;
    border-top: 1px solid #b5913d;
}
.pledge-signature {
    display: flex;
    flex-direction: column;
}
.pledge-signed-by {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-size: 0.95rem;
    color: #3a2c1a;
}
.pledge-signed-name {
    font-family: var(--font-hand);
    font-size: 1.65rem;
    color: #1a1414;
    line-height: 1;
    margin-top: 0.1rem;
}
.pledge-seal {
    position: relative;
    width: 84px;
    height: 84px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.pledge-seal-ring {
    position: absolute;
    inset: 0;
    border: 2.5px double #8d6b28;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(240, 226, 190, 0.6) 0%, rgba(240, 226, 190, 0.2) 100%);
    box-shadow: inset 0 0 0 1px rgba(141, 107, 40, 0.2);
}
.pledge-seal-text {
    position: relative;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 0.82rem;
    color: #6b4d16;
    letter-spacing: 0.03em;
    white-space: nowrap;
    transform: rotate(-4deg);
    text-align: center;
}
.pledge-micro {
    margin-top: 1rem;
    font-family: 'DM Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.05em;
    color: #6b4d16;
    text-align: center;
}
.pledge-micro a { color: #1a1414; text-decoration: underline; }

/* ============================================================
   INCLUDED / VALUE / FAQ BLOCK (conversion)
   ============================================================ */
.included-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    grid-auto-rows: 1fr;
    margin-bottom: 2rem;
}
@media (max-width: 780px) { .included-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .included-grid { grid-template-columns: 1fr; } }

.included-cell {
    padding: 1.5rem 1.25rem;
    border-radius: 20px;
    background: var(--glass-bg);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
    border: 1px solid var(--glass-border);
    color: var(--cream);
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    height: 100%;
    min-height: 160px;
}
.included-icon {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 2.4rem;
    line-height: 1;
    background: linear-gradient(135deg, var(--bright-gold), var(--soft-pink));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin-bottom: 0.1rem;
}
.included-title {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--cream);
}
.included-body {
    font-size: 0.9rem;
    color: rgba(245, 240, 232, 0.78);
    line-height: 1.55;
}

.value-strip {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: stretch;
    gap: 1.25rem;
    padding: 1.75rem;
    border-radius: 24px;
    background: rgba(13, 10, 18, 0.45);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
    border: 1px solid var(--glass-border);
    margin-bottom: 2rem;
}
@media (max-width: 620px) {
    .value-strip { grid-template-columns: 1fr; }
    .value-strip-divider { display: none; }
}
.value-strip-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.3rem;
    text-align: center;
}
.value-strip-col.is-feature { text-align: center; }
.value-strip-eyebrow {
    font-family: 'DM Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--warm-gold);
}
.value-strip-big {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: clamp(1.6rem, 4vw, 2.4rem);
    line-height: 1.05;
    color: rgba(245, 240, 232, 0.55);
}
.value-strip-col.is-feature .value-strip-big {
    color: var(--cream);
}
.value-strip-col.is-feature .value-strip-big.gradient-text {
    background: linear-gradient(135deg, var(--bright-gold), var(--soft-pink));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.value-strip-sub {
    font-size: 0.85rem;
    color: rgba(245, 240, 232, 0.7);
    max-width: 260px;
    margin: 0 auto;
}
.value-strip-divider {
    width: 1px;
    background: linear-gradient(180deg, transparent, rgba(212,168,83,0.45), transparent);
}

.faq-strip { margin-top: 1.5rem; }
.faq-item {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding: 0.75rem 0;
}
.faq-item:last-of-type { border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.faq-item summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 1.05rem;
    color: var(--cream);
    padding: 0.2rem 0;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
    content: "+";
    color: var(--warm-gold);
    font-weight: 800;
    transition: transform 0.3s ease;
    font-size: 1.2rem;
}
.faq-item[open] summary::after { content: "\2013"; }
.faq-item p {
    margin-top: 0.5rem;
    color: rgba(245, 240, 232, 0.78);
    line-height: 1.6;
    font-family: 'Newsreader', serif;
    font-size: 0.98rem;
}

/* ---------- Hero CTA buttons (with dates baked in) ---------- */
.hero-cta-row {
    display: flex;
    gap: 0.9rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
}
/* Higher-specificity selector so we beat the inline-style <style> block's .btn-primary rule. */
.hero-cta-row .hero-cta {
    display: inline-flex !important;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    padding: 14px 28px;
    min-width: 270px;
    border-radius: 12px;
    cursor: pointer;
    transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
    line-height: 1.15;
    text-align: center;
    white-space: normal;
}
.hero-cta-main {
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: 0.01em;
}
.hero-cta-sub {
    font-family: 'DM Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.78;
}
.hero-cta-primary .hero-cta-sub { color: rgba(26, 10, 46, 0.78); }
.hero-cta-secondary .hero-cta-sub { color: var(--bright-gold); }
@media (max-width: 520px) {
    .hero-cta { min-width: 0; width: 100%; padding: 14px 16px; }
    .hero-cta-main { font-size: 1rem; }
    .hero-cta-sub { font-size: 0.65rem; }
    .hero-subhead { white-space: normal !important; }
}

/* ---------- Hero line stacking (always 2 lines: [verb] the future / you wish existed) ---------- */
#hero h1 .hand {
    display: block;
    margin-top: 0.15em;
}
#hero h1 .verb-cycle + * { /* keep 'the future' on same line as verb */ white-space: nowrap; }
@media (max-width: 560px) {
    #hero h1 .verb-cycle + * { white-space: normal; }
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ============================================================
   BLOOM BREAK — 60-second breath practice
   ============================================================ */
.breath-section {
    padding: clamp(3rem, 6vw, 5rem) 1rem;
    background:
        radial-gradient(ellipse at 20% 40%, rgba(253, 203, 209, 0.14), transparent 55%),
        radial-gradient(ellipse at 80% 70%, rgba(212, 168, 83, 0.08), transparent 55%),
        linear-gradient(180deg, var(--mid-purple), var(--deep-purple));
    position: relative;
    overflow: hidden;
}
.breath-container {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: center;
    max-width: 1000px;
}
@media (max-width: 780px) {
    .breath-container { grid-template-columns: 1fr; text-align: center; }
}
.breath-intro {
    position: relative;
    z-index: 2;
}
.breath-intro h2 { line-height: 1.1; }
.breath-badges {
    list-style: none;
    padding: 0;
    margin: 1.25rem 0 0;
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.breath-badges li {
    font-family: 'DM Mono', monospace;
    font-size: 0.7rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--bright-gold);
    padding: 0.35rem 0.75rem;
    border: 1px solid rgba(253, 203, 209, 0.35);
    border-radius: 999px;
    background: rgba(253, 203, 209, 0.06);
}
@media (max-width: 780px) {
    .breath-badges { justify-content: center; }
}

.breath-open {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.25rem 1.6rem;
    background: rgba(253, 203, 209, 0.08);
    border: 1px solid rgba(253, 203, 209, 0.3);
    border-radius: 28px;
    cursor: pointer;
    transition: transform 0.35s var(--ease-bounce), border-color 0.35s ease, box-shadow 0.35s ease;
    color: var(--cream);
    font-family: inherit;
    text-align: left;
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
    min-height: 160px;
    min-width: 280px;
    justify-self: center;
}
.breath-open:hover,
.breath-open:focus-visible {
    transform: translateY(-3px);
    border-color: rgba(253, 203, 209, 0.65);
    box-shadow: 0 20px 50px rgba(253, 203, 209, 0.2), 0 0 40px rgba(212, 168, 83, 0.15);
    outline: none;
}
.breath-open-blossom {
    flex-shrink: 0;
    width: 92px;
    height: 92px;
    overflow: visible;
    filter: drop-shadow(0 6px 14px rgba(236, 120, 164, 0.35));
    animation: breath-idle 5.5s ease-in-out infinite;
    transform-origin: center;
}
@keyframes breath-idle {
    0%, 100% { transform: scale(1) rotate(0deg); }
    50%      { transform: scale(1.05) rotate(4deg); }
}
.breath-open-blossom .sakura-stamens circle,
.breath-open-blossom circle { transform-origin: center; }
.breath-open-label {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.breath-open-title {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 1.35rem;
    background: linear-gradient(135deg, #fbcfe8, #fdba74);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.breath-open-sub {
    font-family: 'DM Mono', monospace;
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    color: rgba(245, 240, 232, 0.75);
}

/* floating orb removed — single entry point is the Bloom Break section button. */

/* ---------- overlay ---------- */
#breath-overlay {
    position: fixed;
    inset: 0;
    z-index: 10001;
    background: radial-gradient(ellipse at center, rgba(26, 10, 46, 0.92), rgba(13, 10, 18, 0.98));
    backdrop-filter: blur(40px) saturate(150%);
    -webkit-backdrop-filter: blur(40px) saturate(150%);
    display: none;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.5s ease;
}
#breath-overlay.is-open {
    display: flex;
    opacity: 1;
}
.breath-stage {
    position: relative;
    max-width: 520px;
    width: 100%;
    text-align: center;
    padding: 2rem;
}
.breath-close {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    background: none;
    border: none;
    color: rgba(245, 240, 232, 0.6);
    font-size: 2rem;
    line-height: 1;
    cursor: pointer;
    padding: 0.5rem 0.75rem;
    transition: color 0.2s ease;
}
.breath-close:hover { color: var(--cream); }
.breath-ring {
    position: relative;
    width: 280px;
    height: 280px;
    margin: 0 auto 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.breath-ring-glow {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: radial-gradient(circle,
        rgba(253, 203, 209, 0.25) 0%,
        rgba(253, 203, 209, 0.12) 40%,
        transparent 70%);
    filter: blur(30px);
    animation: breath-glow 10s ease-in-out infinite;
}
@keyframes breath-glow {
    0%, 100% { opacity: 0.5; transform: scale(1); }
    50% { opacity: 0.9; transform: scale(1.25); }
}
.breath-blossom {
    overflow: visible;
    transform-origin: center;
    /* No transition during breathing — JS drives transform per-frame via rAF.
       A CSS transition would fight the per-frame updates and cause choppiness. */
    filter: drop-shadow(0 10px 36px rgba(236, 120, 164, 0.45));
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}
.breath-cue {
    font-family: var(--font-display);
    font-weight: 500;
    font-style: italic;
    font-size: clamp(1.5rem, 3vw, 2rem);
    color: var(--cream);
    margin-bottom: 0.35rem;
    letter-spacing: -0.01em;
    min-height: 2.2em;
}
.breath-dots {
    display: flex;
    gap: 0.55rem;
    justify-content: center;
    margin: 0.35rem 0 0.9rem;
}
.breath-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(253, 203, 209, 0.18);
    border: 1px solid rgba(253, 203, 209, 0.35);
    transition: background 0.4s ease, transform 0.3s ease, box-shadow 0.4s ease, border-color 0.3s ease;
}
.breath-dot.is-done {
    background: rgba(253, 203, 209, 0.85);
    border-color: rgba(253, 203, 209, 0.95);
    box-shadow: 0 0 10px rgba(253, 203, 209, 0.55);
}
.breath-dot.is-active {
    background: #fbcfe8;
    border-color: #fbcfe8;
    transform: scale(1.4);
    box-shadow: 0 0 18px rgba(251, 207, 232, 0.95), 0 0 36px rgba(236, 120, 164, 0.45);
}
.breath-count {
    font-family: 'DM Mono', monospace;
    font-size: 0.78rem;
    letter-spacing: 0.16em;
    color: var(--bright-gold);
    text-transform: uppercase;
    margin-bottom: 1.25rem;
    min-height: 1.2em;
    opacity: 0.82;
}
.breath-actions { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; }
.breath-actions .btn-primary {
    min-width: 160px;
    background: radial-gradient(circle at 30% 30%, #fff3b5 0%, #e8c875 60%, #d4a853 100%);
}
.breath-hint {
    font-family: 'DM Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    color: rgba(245, 240, 232, 0.55);
    margin: 0;
}

@media (prefers-reduced-motion: reduce) {
    .breath-open-blossom,
    #breath-orb,
    .breath-ring-glow,
    .breath-blossom.is-breathing .petal { animation: none !important; }
    .breath-blossom { transition: none; }
}

/* ============================================================
   GLOSSARY — friendly name -> industry name translator
   ============================================================ */
.glossary-list {
    display: grid;
    gap: 0.6rem;
}
.glossary-row {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) auto minmax(180px, 1fr) minmax(240px, 2fr);
    align-items: baseline;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: rgba(255, 255, 255, 0.035);
    border: 1px solid var(--glass-border);
    border-radius: 14px;
    transition: border-color 0.25s ease, background 0.25s ease, transform 0.25s ease;
}
.glossary-row:hover {
    border-color: rgba(212, 168, 83, 0.4);
    background: rgba(212, 168, 83, 0.06);
    transform: translateY(-1px);
}
.glossary-friendly {
    font-family: var(--font-hand);
    font-size: 1.35rem;
    color: var(--soft-pink);
    line-height: 1;
}
.glossary-arrow {
    font-family: 'DM Mono', monospace;
    color: var(--warm-gold);
    font-size: 1.1rem;
    opacity: 0.65;
}
.glossary-industry {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 1.05rem;
    background: linear-gradient(135deg, var(--bright-gold), var(--soft-pink));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    letter-spacing: -0.005em;
}
.glossary-note {
    font-family: 'Newsreader', serif;
    font-size: 0.92rem;
    line-height: 1.55;
    color: rgba(245, 240, 232, 0.72);
    font-style: italic;
}
@media (max-width: 820px) {
    .glossary-row {
        grid-template-columns: 1fr auto 1fr;
        gap: 0.6rem;
    }
    .glossary-note {
        grid-column: 1 / -1;
        padding-top: 0.4rem;
        border-top: 1px dashed rgba(255,255,255,0.08);
    }
}
@media (max-width: 520px) {
    .glossary-row {
        grid-template-columns: 1fr;
        gap: 0.3rem;
    }
    .glossary-arrow { display: none; }
    .glossary-industry { margin-top: -0.15rem; }
}

/* ---------- Info Days ---------- */
.infoday-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    grid-auto-rows: 1fr;
}
@media (max-width: 780px) { .infoday-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .infoday-grid { grid-template-columns: 1fr; } }
.infoday-cell {
    padding: 1.25rem 1.1rem;
    border-radius: 18px;
    background: var(--glass-bg);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturation));
    border: 1px solid var(--glass-border);
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-height: 150px;
}
.infoday-date {
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--cream);
    font-size: 1.15rem;
    line-height: 1.1;
}
.infoday-time {
    font-family: 'DM Mono', monospace;
    font-size: 0.9rem;
    color: var(--warm-gold);
}
.infoday-tz {
    font-family: 'DM Mono', monospace;
    font-size: 0.72rem;
    color: rgba(245, 240, 232, 0.65);
}
.infoday-link {
    margin-top: auto;
    padding-top: 0.5rem;
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
    font-size: 0.88rem;
    color: var(--bright-gold);
    text-decoration: none;
    align-self: flex-start;
    transition: transform 0.2s ease;
}
.infoday-link:hover { transform: translateX(2px); color: var(--cream); }

.stream-tz {
    font-family: 'DM Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    color: rgba(245, 240, 232, 0.62);
    margin-top: -0.15rem;
}

/* ============================================================
   MOBILE POLISH
   ============================================================ */
@media (max-width: 640px) {
    .cursor-aurora { display: none; }
    .sparkle-particle { display: none; }
    .hand-note { display: none !important; }
    .enroll-step {
        grid-template-columns: 32px 1fr;
        gap: 0.75rem;
        padding: 0.85rem 0;
    }
    .enroll-step-num {
        width: 28px;
        height: 28px;
        font-size: 0.9rem;
    }
    .enroll-step .enroll-row { grid-template-columns: 1fr; gap: 0.6rem; }
    .pledge-card {
        padding: 1.5rem 1.1rem;
    }
    .pledge-title {
        font-size: 1.6rem;
    }
    .pledge-header { flex-direction: column; align-items: flex-start; }
    .pledge-eyebrow { text-align: left; margin-top: 0.5rem; }
    .pledge-lede p:first-of-type::first-letter {
        font-size: 2.4rem;
    }
    .pledge-ledger { padding: 0.9rem 1rem; }
    .prompt-card { padding: 1.15rem 1rem; }
    .prompt-card-head { flex-direction: column; gap: 0.35rem; }
    .prompt-card-visit { align-self: flex-start; }
    .tool-flip { min-height: 190px; }
    .tool-flip-face { padding: 1.15rem 1rem; }
    .roo-cta-block { flex-direction: column; text-align: center; }
    .roo-cta-btn { width: 100%; justify-content: center; }
    .scene-mountains > .scene-layer,
    .scene-waterfall > .scene-layer,
    .scene-wildflowers > .scene-layer {
        background-attachment: scroll;
    }
    .stream-card { min-height: 210px; padding: 1.5rem 1.25rem; }
    .stream-card .seat-badge { top: 10px; right: 10px; font-size: 0.62rem; padding: 3px 8px; }
    .included-cell { min-height: 140px; padding: 1.2rem 1rem; }
    .value-strip { padding: 1.25rem; }
}

/* Hero stays readable on small screens */
@media (max-width: 480px) {
    #hero h1 { font-size: clamp(1.9rem, 9vw, 2.6rem) !important; line-height: 1.15 !important; }
    .verb-cycle { white-space: normal; }
    .glass-chip { font-size: 0.7rem; padding: 0.4rem 0.8rem; }
    .week-rail::before { display: none; }
    .week-toggle-hint { font-size: 0.6rem; }
}

/* ============================================================
   enroll submit confetti trigger hint
   ============================================================ */
/* ---------- enroll submit confetti trigger hint ---------- */
.btn-primary.is-celebrating {
    animation: celebrate 600ms var(--ease-bounce);
}
@keyframes celebrate {
    0%   { transform: scale(1); }
    50%  { transform: scale(1.05) rotate(-1.5deg); }
    100% { transform: scale(1); }
}