.quick-access { position: relative; z-index: 2; padding-top: 0; padding-bottom: var(--section-space); }
.trial-bridge { position: relative; transform: translateY(-50%); }
.trial-banner { display: flex; align-items: center; gap: 18px; padding: 16px 24px; background: var(--gold); background-image: var(--gold-metal); color: var(--ink); border-radius: var(--radius-card); transition: background-color .2s; }
.trial-banner > span:nth-child(2) { font-size: clamp(17px, 1.8vw, 24px); font-weight: 600; letter-spacing: -.025em; line-height: 1.45; }
.trial-banner-icon { display: grid; place-items: center; width: 48px; height: 48px; flex-shrink: 0; border: 1px solid currentColor; border-radius: 50%; }
.trial-banner-arrow { margin-left: auto; display: grid; place-items: center; }
.trial-banner-arrow .icon { width: 30px; height: 30px; font-size: 30px; }
@media (min-width: 701px) {
    .trial-banner { width: fit-content; max-width: 100%; margin-inline: auto; justify-content: center; }
    .trial-banner-arrow { margin-left: 0; }
}
.action-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 0; }
.action-tile { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 150px; padding: 22px 30px; text-align: center; border: 1px solid color-mix(in srgb, var(--gold) 45%, var(--line)); border-radius: var(--radius-card); background: linear-gradient(145deg, var(--ink) 35%, var(--surface-raised) 100%); box-shadow: 0 16px 36px color-mix(in srgb, var(--paper) 16%, transparent); transition: border-color .2s, box-shadow .2s, background-color .2s; }
.action-tile .action-icon { color: var(--gold); width: 56px; height: 56px; border: 1px solid color-mix(in srgb, var(--gold) 35%, transparent); border-radius: 50%; font-size: 28px; }
.action-tile .action-icon::before { padding: .12em; line-height: 1.2; background-image: var(--gold-metal); background-clip: text; -webkit-background-clip: text; color: transparent; }
.action-tile h2 { color: var(--paper); font-family: var(--font); font-size: 15px; font-weight: 700; line-height: 1.4; letter-spacing: -.01em; text-wrap: initial; }
.action-tile p { margin-top: 4px; font-size: 12px; line-height: 1.6; }
.home-intro .action-tile .action-icon {
    background: linear-gradient(145deg, var(--ink), var(--surface-raised));
    box-shadow: inset 0 1px 0 var(--media-ink);
}
@media (min-width: 601px) {
    .home-intro--desktop-video .action-tile {
        border-color: color-mix(in srgb, var(--media-ink) 85%, var(--gold));
        background: linear-gradient(130deg, color-mix(in srgb, var(--surface-raised) 72%, transparent), color-mix(in srgb, var(--ink) 92%, transparent) 42%, color-mix(in srgb, var(--surface-raised) 65%, transparent));
        backdrop-filter: blur(18px);
        box-shadow: inset 0 1px 0 var(--media-ink), 0 18px 32px color-mix(in srgb, var(--paper) 28%, transparent);
        min-height: clamp(112px, 12vw, 170px);
    }
    .home-intro--desktop-video .action-tile h2 { font-size: clamp(16px, 1.25vw, 20px); }
}
@media (max-width: 600px) {
    .home-intro--mobile-video .action-grid { gap: 10px; }
    .home-intro--mobile-video .action-tile {
        min-height: 126px;
        gap: 8px;
        padding: 16px 5px 14px;
        border: 1px solid color-mix(in srgb, var(--media-ink) 90%, transparent);
        border-radius: 18px;
        background:
            radial-gradient(ellipse at 25% 15%, color-mix(in srgb, var(--media-ink) 78%, transparent), transparent 55%),
            linear-gradient(135deg, color-mix(in srgb, var(--surface-raised) 66%, transparent), color-mix(in srgb, var(--ink) 72%, transparent) 50%, color-mix(in srgb, var(--surface-raised) 55%, transparent));
        backdrop-filter: blur(14px);
        box-shadow: inset 0 1px 2px var(--media-ink), inset 0 -1px 8px color-mix(in srgb, var(--media-ink) 45%, transparent), 0 10px 20px color-mix(in srgb, var(--paper) 20%, transparent);
    }
    .home-intro--mobile-video .action-tile .action-icon {
        width: 46px;
        height: 46px;
        font-size: 25px;
        background: linear-gradient(145deg, color-mix(in srgb, var(--ink) 80%, transparent), color-mix(in srgb, var(--surface-raised) 55%, transparent));
    }
    .home-intro--mobile-video .action-tile h2 {
        max-width: 100%;
        margin-inline: auto;
        font-size: 12px;
        line-height: 1.25;
    }
}
@media (hover: hover) { .action-tile:hover { border-color: var(--gold); box-shadow: 0 20px 44px color-mix(in srgb, var(--paper) 22%, transparent); } .trial-banner:hover { background-color: var(--gold); } }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .action-tile { transition: translate 200ms var(--ease-out), border-color .2s, box-shadow .2s, background-color .2s; }
    .action-tile:hover { translate: 0 -5px; }
}
@media (max-width: 1050px) {
    .action-tile { gap: 10px; min-height: 132px; padding: 16px 20px; }
    .action-tile .action-icon { width: 48px; height: 48px; font-size: 25px; }
}
@media (max-width: 700px) {
    .action-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: auto; gap: 8px; }
    .action-tile { gap: 8px; min-height: 112px; padding: 14px 6px 10px; }
    .action-tile .action-icon { width: 40px; height: 40px; font-size: 22px; }
    .action-tile > div { width: 100%; min-width: 0; }
    .action-tile h2 { font-size: 12px; line-height: 1.4; overflow-wrap: normal; }
    .action-tile p { display: none; }
    .trial-banner { gap: 10px; padding: 12px 14px; }
    .trial-banner-icon { width: 34px; height: 34px; }
    .trial-banner > span:nth-child(2) { font-size: 14px; }
    .trial-banner-arrow .icon { width: 23px; height: 23px; font-size: 23px; }
}
@media (max-width: 360px) {
    .trial-banner { padding: 12px 14px; gap: 10px; }
    .trial-banner-icon { display: none; }
}