
/* ============================================================
   FreeStenoHub — Shorthand Dictation V3
   COMPLETE STANDALONE PAGE STYLES
   ============================================================ */

.sd-page-v2 {
    --sd-navy: #19243A;
    --sd-navy-2: #1F2940;
    --sd-purple: #4F329A;
    --sd-pink: #E72D76;
    --sd-lav: #F0E5ED;
    --sd-bg: #F9F8FA;
    --sd-surface: #FEFEFD;
    --sd-text: #747490;
    --sd-border: #E7E5EE;
    --sd-white: #FFFFFF;
    overflow-x: clip;
    background: var(--sd-surface);
    color: var(--sd-navy);
    font-family: inherit;
}

.sd-page-v2 *,
.sd-page-v2 *::before,
.sd-page-v2 *::after {
    box-sizing: border-box;
}

.sd-page-v2 img {
    max-width: 100%;
}

.sd-page-v2 a {
    text-decoration: none;
}

.sd-page-v2 button,
.sd-page-v2 a {
    -webkit-tap-highlight-color: transparent;
}

.sd-page-v2 .container {
    width: min(100% - 32px, 1200px);
    margin-inline: auto;
    /* Bootstrap adds 15px here; this page owns its gutter through width. */
    padding-inline: 0 !important;
}

@media (max-width: 575px) {
    .sd-page-v2 .container {
        /* Keep every section aligned to the same compact phone gutter. */
        width: min(100% - 20px, 1200px);
    }
}

/* breadcrumb */
.sd-crumbbar {
    background:#fff;
    border-bottom:1px solid var(--sd-border)
}

.sd-crumbbar-inner {
    min-height:48px;
    display:flex;
    align-items:center;
    gap:10px;
    font-size:12px;
    color:var(--sd-text)
}

.sd-crumbbar a {
    color:var(--sd-text);
    font-weight:700
}

.sd-crumbbar strong {
    color:var(--sd-navy);
    font-weight:800
}

.sd-crumbbar i {
    font-size:10px
}

.sd-crumbbar a i {
    font-size:11px;
    color:var(--sd-purple)
}

/* hero */
.sd-hero-v2 {
    position:relative;
    padding:16px 0 46px;
    background:radial-gradient(circle at 16% 10%,rgba(231,45,118,.08),transparent 28%),radial-gradient(circle at 88% 12%,rgba(79,50,154,.12),transparent 30%),linear-gradient(180deg,#fff 0%,#F9F8FA 100%)
}

.sd-hero-v2 .container {
    display:grid;
    grid-template-columns:minmax(0,.92fr) minmax(520px,1.08fr);
    gap:66px;
    align-items:center
}

.sd-kicker,.sd-eyebrow {
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--sd-purple);
    font-size:12px;
    font-weight:900;
    letter-spacing:.11em;
    text-transform:uppercase
}

.sd-kicker {
    padding:8px 12px;
    border:1px solid rgba(79,50,154,.15);
    background:#fff;
    border-radius:999px;
    box-shadow:0 8px 24px rgba(25,36,58,.05)
}

.sd-hero-copy h1 {
    margin:20px 0 20px;
    font-size:clamp(32px,4.2vw,52px);
    line-height:1.08;
    letter-spacing:-1.5px;
    font-weight:950;
    color:var(--sd-navy)
}

.sd-hero-copy h1 span {
    background:linear-gradient(90deg,var(--sd-purple),var(--sd-pink));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent
}

.sd-hero-copy>p {
    max-width:650px;
    margin:0;
    color:#686881;
    font-size:17px;
    line-height:1.78
}

.sd-hero-actions {
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:28px
}

.sd-btn {
    min-height:50px;
    padding:13px 20px;
    border-radius:14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    font-size:14px;
    font-weight:900;
    transition:.25s ease
}

.sd-track-link i {
    display: none;
}

.sd-btn-primary {
    background:var(--sd-navy);
    color:#fff!important;
    box-shadow:0 14px 30px rgba(25,36,58,.18)
}

.sd-btn-primary:hover {
    transform:translateY(-2px);
    background:var(--sd-purple)
}

.sd-btn-ghost {
    background:#fff;
    color:var(--sd-navy)!important;
    border:1px solid var(--sd-border)
}

.sd-btn-ghost:hover {
    transform:translateY(-2px);
    border-color:rgba(79,50,154,.3);
    color:var(--sd-purple)!important
}

.sd-proof-row {
    display:flex;
    gap:18px;
    flex-wrap:wrap;
    margin-top:26px;
    color:#77778f;
    font-size:12px;
    font-weight:800
}

.sd-proof-row span {
    display:flex;
    align-items:center;
    gap:6px
}

.sd-proof-row i {
    color:var(--sd-pink)
}

.sd-studio-shell {
    position:relative;
    border-radius:30px;
    padding:12px;
    background:linear-gradient(140deg,#fff,rgba(240,229,237,.8));
    border:1px solid rgba(79,50,154,.12);
    box-shadow:0 32px 80px rgba(25,36,58,.14)
}

.sd-studio-shell::before {
    content:"";
    position:absolute;
    inset:-14px auto auto -14px;
    width:110px;
    height:110px;
    border-radius:28px;
    background:linear-gradient(135deg,var(--sd-purple),var(--sd-pink));
    z-index:-1;
    opacity:.9
}

.sd-studio-topbar {
    height:52px;
    padding:0 14px 0 18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#77778f;
    font-size:11px;
    font-weight:900;
    letter-spacing:.12em
}

.sd-studio-topbar>div {
    display:flex;
    align-items:center;
    gap:8px
}

.sd-live-dot {
    width:8px;
    height:8px;
    border-radius:50%;
    background:var(--sd-pink);
    box-shadow:0 0 0 5px rgba(231,45,118,.1)
}

.sd-studio-mode {
    padding:7px 10px;
    border-radius:999px;
    background:#fff;
    border:1px solid var(--sd-border);
    color:var(--sd-purple);
    letter-spacing:0
}

.sd-studio-main {
    border-radius:22px;
    background:linear-gradient(145deg,var(--sd-navy),#232C47);
    padding:28px;
    color:#fff;
    overflow:hidden;
    position:relative
}

.sd-studio-main::after {
    content:"";
    position:absolute;
    width:250px;
    height:250px;
    border-radius:50%;
    right:-100px;
    top:-120px;
    background:rgba(231,45,118,.14)
}

.sd-studio-heading {
    position:relative;
    z-index:1;
    display:flex;
    align-items:flex-end;
    justify-content:space-between
}

.sd-studio-heading span {
    display:block;
    color:rgba(255,255,255,.58);
    font-size:11px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.12em
}

.sd-studio-heading strong {
    display:block;
    font-size:52px;
    line-height:1;
    font-weight:950;
    margin-top:5px
}

.sd-studio-heading em {
    font-size:13px;
    font-style:normal;
    color:#d9cee9;
    letter-spacing:.08em
}

.sd-studio-time {
    text-align:right
}

.sd-studio-time strong {
    font-size:25px;
    letter-spacing:.05em
}

.sd-waveform {
    height:118px;
    margin:24px 0 8px;
    display:flex;
    align-items:center;
    gap:4px;
    position:relative;
    z-index:1
}

.sd-waveform i {
    flex:1;
    height:var(--h);
    border-radius:99px;
    background:linear-gradient(180deg,#f7d6e4,#d9c7ff);
    opacity:.9
}

.sd-progress-line {
    height:5px;
    border-radius:99px;
    background:rgba(255,255,255,.12);
    overflow:hidden;
    position:relative;
    z-index:1
}

.sd-progress-line span {
    display:block;
    width:44%;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--sd-pink),#bf9cff)
}

.sd-studio-controls {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    margin:22px 0 24px;
    position:relative;
    z-index:1
}

.sd-studio-controls button {
    border:0;
    width:42px;
    height:42px;
    border-radius:50%;
    background:rgba(255,255,255,.09);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center
}

.sd-studio-controls .sd-play {
    width:62px;
    height:62px;
    background:#fff;
    color:var(--sd-navy);
    font-size:18px;
    box-shadow:0 10px 26px rgba(0,0,0,.18)
}

.sd-route-strip {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:8px;
    position:relative;
    z-index:1
}

.sd-route-strip div {
    padding:11px;
    border:1px solid rgba(255,255,255,.1);
    background:rgba(255,255,255,.05);
    border-radius:12px
}

.sd-route-strip b {
    display:block;
    color:#d8c8ff;
    font-size:11px;
    margin-bottom:4px
}

.sd-route-strip span {
    font-size:11px;
    color:rgba(255,255,255,.75);
    font-weight:700
}

/* common headings */
.sd-section-intro {
    max-width:760px;
    margin:0 auto 40px;
    text-align:center
}

.sd-section-intro h2,.sd-speed-copy h2,.sd-discipline-copy h2,.sd-flow-intro h2,.sd-final-inner h2 {
    margin:10px 0 12px;
    color:var(--sd-navy);
    font-size:clamp(31px,4vw,48px);
    line-height:1.06;
    letter-spacing:-1.6px;
    font-weight:950
}

.sd-section-intro p,.sd-speed-copy p,.sd-discipline-copy p {
    margin:0;
    color:var(--sd-text);
    font-size:15px;
    line-height:1.75
}

.sd-section-intro-split {
    max-width:none;
    text-align:left;
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:70px;
    align-items:end
}

.sd-section-intro-split p {
    padding-bottom:4px
}

/* tracks */
.sd-tracks-section {
    padding: 88px 0;
    background: #F9F8FA;
    position: relative;
}

.sd-track-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}

.sd-track-card {
    position: relative;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(79, 50, 154, 0.12);
    border-radius: 18px;
    background: #ffffff;
    overflow: hidden;
    transition: all 0.35s cubic-bezier(0.165, 0.84, 0.44, 1);
    color: inherit;
    text-decoration: none !important;
    box-shadow: 0 8px 24px rgba(25, 36, 58, 0.04);
}

.sd-track-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #4F329A 0%, #E72D76 100%);
    opacity: 0;
    transition: opacity 0.35s ease;
    z-index: 3;
}

.sd-track-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 22px 45px rgba(79, 50, 154, 0.14);
    border-color: rgba(79, 50, 154, 0.28);
}

.sd-track-card:hover::before {
    opacity: 1;
}

.sd-track-image {
    position: relative;
    aspect-ratio: 16/10;
    background: #EDE8F7;
    overflow: hidden;
}

.sd-track-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.sd-track-card:hover .sd-track-image img {
    transform: scale(1.07);
}

.sd-track-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(25, 36, 58, 0.6) 0%, rgba(25, 36, 58, 0.05) 60%, transparent 100%);
    pointer-events: none;
}

.sd-track-badges {
    position: absolute;
    inset: 12px 12px auto 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    z-index: 2;
}

.sd-track-badge-index {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(25, 36, 58, 0.82);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    color: #ffffff;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.4px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

.sd-track-badge-index i {
    color: #E72D76;
    font-size: 9.5px;
}

.sd-track-badge-count {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    color: #4F329A;
    font-size: 10.5px;
    font-weight: 800;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}

.sd-track-badge-count i {
    color: #4F329A;
    font-size: 9.5px;
}

.sd-track-content {
    padding: 18px 20px 20px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    background: #ffffff;
}

.sd-track-meta-row {
    margin-bottom: 6px;
}

.sd-track-kicker {
    display: inline-block;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    color: #E72D76;
}

.sd-track-content h3 {
    margin: 0 0 14px 0;
    color: #19243A !important;
    font-size: 16.5px;
    line-height: 1.35;
    font-weight: 800;
    min-height: 44px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.25s ease;
}

.sd-track-card:hover .sd-track-content h3 {
    color: #4F329A !important;
}

.sd-track-link {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #F4F2F7;
    color: #4F329A !important;
    font-size: 12.5px;
    font-weight: 800;
    padding: 10px 14px;
    border-radius: 10px;
    transition: all 0.3s ease;
}

.sd-track-card:hover .sd-track-link {
    background: #4F329A;
    color: #ffffff !important;
    box-shadow: 0 6px 16px rgba(79, 50, 154, 0.25);
}

.sd-track-link i {
    font-size: 11px;
    transition: transform 0.3s ease;
}

.sd-track-card:hover .sd-track-link i {
    transform: translateX(4px);
    color: #ffffff !important;
}

/* ladder */
.sd-speed-section {
    padding:30px 0 88px;
    background:#fff
}

.sd-speed-panel {
    display:grid;
    grid-template-columns:.82fr 1.18fr;
    gap:66px;
    padding:48px;
    border-radius:30px;
    background:linear-gradient(135deg,var(--sd-navy),#252d49);
    color:#fff;
    box-shadow:0 28px 60px rgba(25,36,58,.16)
}

.sd-eyebrow-light {
    color:#e3d5ff
}

.sd-speed-copy h2 {
    color:#fff
}

.sd-speed-copy p {
    color:rgba(255,255,255,.68)
}

.sd-speed-note {
    margin-top:24px;
    padding:14px 16px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:15px;
    background:rgba(255,255,255,.06);
    display:flex;
    gap:10px;
    color:rgba(255,255,255,.76);
    font-size:12px;
    line-height:1.6
}

.sd-speed-note i {
    color:#f09bc0;
    margin-top:3px
}

.sd-ladder-wrap {
    position:relative;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px
}

.sd-ladder-line {
    position:absolute;
    left:16%;
    right:16%;
    top:50%;
    height:1px;
    background:rgba(255,255,255,.11);
    z-index:0
}

.sd-ladder-step {
    position:relative;
    z-index:1;
    min-height:106px;
    padding:17px;
    border-radius:16px;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.09);
    color:#fff;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    transition:.25s ease
}

.sd-ladder-step:hover {
    transform:translateY(-3px);
    background:rgba(255,255,255,.11);
    color:#fff
}

.sd-ladder-step.is-focus {
    background:linear-gradient(135deg,var(--sd-purple),var(--sd-pink));
    border-color:transparent;
    box-shadow:0 14px 30px rgba(231,45,118,.18)
}

.sd-ladder-dot {
    width:7px;
    height:7px;
    border-radius:50%;
    background:#d7c8ff
}

.sd-ladder-step div {
    display:flex;
    align-items:baseline;
    gap:6px
}

.sd-ladder-step strong {
    font-size:26px;
    font-weight:950
}

.sd-ladder-step small {
    font-size:10px;
    color:rgba(255,255,255,.66);
    font-weight:800
}

.sd-ladder-step em {
    font-style:normal;
    font-size:10px;
    color:rgba(255,255,255,.65);
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.08em
}

/* library */
.sd-library-section {
    padding:92px 0;
    background:var(--sd-bg)
}

.sd-session-grid {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:18px;
    max-width:1120px;
    margin:0 auto
}

.sd-session-card {
    position:relative;
    padding:24px;
    border:1px solid var(--sd-border);
    border-radius:23px;
    background:#fff;
    box-shadow:0 10px 30px rgba(25,36,58,.04);
    transition:.28s ease;
    overflow:hidden
}

.sd-session-card::after {
    content:"";
    position:absolute;
    width:120px;
    height:120px;
    border-radius:50%;
    right:-64px;
    top:-64px;
    background:linear-gradient(135deg,rgba(79,50,154,.08),rgba(231,45,118,.08))
}

.sd-session-card:hover {
    transform:translateY(-4px);
    box-shadow:0 18px 42px rgba(25,36,58,.09)
}

.sd-session-head {
    display:flex;
    align-items:center;
    gap:11px;
    position:relative;
    z-index:1
}

.sd-session-icon {
    width:42px;
    height:42px;
    border-radius:13px;
    background:var(--sd-navy);
    color:#fff;
    display:grid;
    place-items:center
}

.sd-session-head>div:nth-child(2) {
    display:flex;
    flex-direction:column
}

.sd-session-head>div:nth-child(2) span {
    font-size:10px;
    font-weight:950;
    letter-spacing:.11em;
    color:var(--sd-purple)
}

.sd-session-head>div:nth-child(2) small {
    font-size:11px;
    color:var(--sd-text);
    font-weight:700;
    margin-top:2px
}

.sd-access {
    margin-left:auto;
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:6px 9px;
    border-radius:999px;
    font-size:10px;
    font-weight:900
}

.sd-access.is-free {
    background:#EAF8F0;
    color:#198754
}

.sd-access.is-premium {
    background:#FFF1F6;
    color:#c62566
}

.sd-session-card h3 {
    margin:20px 0 8px;
    color:var(--sd-navy)!important;
    font-size:21px;
    line-height:1.3;
    font-weight:950;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden
}

.sd-session-card>p {
    margin:0;
    color:#77778f;
    font-size:12.5px;
    line-height:1.65
}

.sd-session-stats {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:18px
}

.sd-session-stats div {
    padding:12px;
    border-radius:13px;
    background:#faf9fc;
    border:1px solid #eeecf2
}

.sd-session-stats span {
    display:block;
    color:#9390a3;
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:.1em;
    font-weight:900
}

.sd-session-stats strong {
    display:block;
    margin-top:4px;
    color:var(--sd-navy);
    font-size:13px;
    font-weight:900
}

.sd-session-start {
    margin-top:18px;
    min-height:58px;
    border-radius:14px;
    padding:11px 12px 11px 15px;
    background:var(--sd-navy);
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#fff!important;
    transition:.25s ease
}

.sd-session-start:hover {
    background:var(--sd-purple);
    transform:translateY(-1px)
}

.sd-session-start span {
    display:flex;
    flex-direction:column;
    font-size:13px;
    font-weight:900
}

.sd-session-start small {
    font-size:8px;
    letter-spacing:.11em;
    color:rgba(255,255,255,.55);
    margin-bottom:2px
}

.sd-session-start>i {
    width:36px;
    height:36px;
    border-radius:11px;
    background:linear-gradient(135deg,var(--sd-purple),var(--sd-pink));
    display:grid;
    place-items:center
}

.sd-library-footer {
    text-align:center;
    margin-top:32px
}

.sd-text-link {
    color:var(--sd-navy)!important;
    font-size:13px;
    font-weight:900
}

.sd-text-link i {
    margin-left:6px;
    color:var(--sd-pink)
}

/* discipline */
.sd-discipline-section {
    padding:94px 0;
    background:#fff
}

.sd-discipline-grid {
    display:grid;
    grid-template-columns:.72fr 1.28fr;
    gap:80px;
    align-items:start
}

.sd-discipline-copy {
    position:sticky;
    top:110px
}

.sd-discipline-stack {
    border-top:1px solid var(--sd-border)
}

.sd-discipline-row {
    display:grid;
    grid-template-columns:54px 1fr 54px;
    gap:18px;
    align-items:center;
    padding:24px 0;
    border-bottom:1px solid var(--sd-border)
}

.sd-discipline-row>span {
    font-size:12px;
    font-weight:950;
    color:#b4b0c0
}

.sd-discipline-row h3 {
    margin:0 0 6px;
    color:var(--sd-navy);
    font-size:20px;
    font-weight:950
}

.sd-discipline-row p {
    margin:0;
    color:var(--sd-text);
    font-size:13px;
    line-height:1.65
}

.sd-discipline-row>i {
    width:48px;
    height:48px;
    border-radius:15px;
    background:var(--sd-lav);
    color:var(--sd-purple);
    display:grid;
    place-items:center;
    font-size:18px
}

/* flow */
.sd-flow-section {
    padding:0 0 96px;
    background:#fff
}

.sd-flow-card {
    padding:44px;
    border-radius:28px;
    background:linear-gradient(180deg,#F9F8FA,#fff);
    border:1px solid var(--sd-border)
}

.sd-flow-intro {
    max-width:640px
}

.sd-flow-steps {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    margin-top:32px
}

.sd-flow-steps>div {
    padding:20px;
    border-radius:18px;
    background:#fff;
    border:1px solid var(--sd-border);
    min-height:168px
}

.sd-flow-steps b {
    width:35px;
    height:35px;
    border-radius:11px;
    background:var(--sd-navy);
    color:#fff;
    display:grid;
    place-items:center;
    font-size:12px;
    margin-bottom:18px
}

.sd-flow-steps strong {
    display:block;
    color:var(--sd-navy);
    font-size:15px;
    font-weight:950;
    line-height:1.35
}

.sd-flow-steps span {
    display:block;
    margin-top:8px;
    color:var(--sd-text);
    font-size:12px;
    line-height:1.6
}

/* cta */
.sd-final-cta {
    padding:0 0 90px;
    background:#fff
}

.sd-final-inner {
    padding:40px 44px;
    border-radius:28px;
    background:linear-gradient(125deg,var(--sd-purple),var(--sd-navy));
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:40px;
    box-shadow:0 26px 60px rgba(79,50,154,.18)
}

.sd-final-inner h2 {
    max-width:720px;
    color:#fff;
    margin-bottom:0
}

.sd-final-actions {
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    justify-content:flex-end
}

.sd-btn-pink {
    background:#fff;
    color:var(--sd-navy)!important
}

.sd-btn-pink:hover {
    transform:translateY(-2px);
    color:var(--sd-purple)!important
}

.sd-btn-dark-outline {
    border:1px solid rgba(255,255,255,.24);
    background:rgba(255,255,255,.08);
    color:#fff!important
}

.sd-btn-dark-outline:hover {
    background:rgba(255,255,255,.14);
    transform:translateY(-2px)
}

.sd-empty-state {
    grid-column:1/-1;
    padding:30px;
    text-align:center;
    border:1px dashed var(--sd-border);
    border-radius:18px;
    color:var(--sd-text);
    background:#fff
}

@media(max-width:1199px) {
    .sd-hero-v2 .container {
        grid-template-columns:1fr 1fr;
        gap:40px
    }

    .sd-hero-copy h1 {
        font-size:58px
    }

    .sd-speed-panel {
        gap:38px;
        padding:38px
    }

    .sd-discipline-grid {
        gap:48px
    }

    .sd-track-grid {
        grid-template-columns:repeat(3,1fr);
        gap:14px
    }

}

@media(max-width:991px) {
    .sd-hero-v2 {
        padding:64px 0
    }

    .sd-hero-v2 .container {
        grid-template-columns:1fr
    }

    .sd-hero-copy {
        text-align:center
    }

    .sd-hero-copy>p {
        margin-left:auto;
        margin-right:auto
    }

    .sd-hero-actions,.sd-proof-row {
        justify-content:center
    }

    .sd-studio-shell {
        max-width:720px;
        margin:0 auto;
        width:100%
    }

    .sd-section-intro-split {
        grid-template-columns:1fr;
        gap:14px
    }

    .sd-track-grid {
        grid-template-columns:repeat(2,1fr)
    }

    .sd-speed-panel {
        grid-template-columns:1fr
    }

    .sd-discipline-grid {
        grid-template-columns:1fr
    }

    .sd-discipline-copy {
        position:static;
        max-width:680px
    }

    .sd-flow-steps {
        grid-template-columns:repeat(2,1fr)
    }

    .sd-final-inner {
        align-items:flex-start;
        flex-direction:column
    }

    .sd-final-actions {
        justify-content:flex-start
    }

}

@media(max-width:767px) {
    .sd-hero-copy h1 {
        font-size:48px;
        letter-spacing:-2px
    }

    .sd-route-strip {
        grid-template-columns:repeat(2,1fr)
    }

    .sd-studio-main {
        padding:22px
    }

    .sd-studio-heading strong {
        font-size:42px
    }

    .sd-waveform {
        height:94px
    }

    .sd-track-grid,.sd-session-grid {
        grid-template-columns:1fr
    }

    .sd-speed-panel {
        padding:28px 22px
    }

    .sd-ladder-wrap {
        grid-template-columns:repeat(2,1fr)
    }

    .sd-ladder-line {
        display:none
    }

    .sd-flow-card {
        padding:30px 22px
    }

    .sd-final-inner {
        padding:30px 24px
    }

    .sd-discipline-row {
        grid-template-columns:42px 1fr
    }

    .sd-discipline-row>i {
        display:none
    }

}

@media(max-width:575px) {
    .sd-crumbbar-inner {
        padding-top:2px;
        padding-bottom:2px
    }

    .sd-hero-v2 {
        padding:48px 0 54px
    }

    .sd-hero-copy h1 {
        font-size:40px
    }

    .sd-hero-copy>p {
        font-size:14.5px
    }

    .sd-hero-actions {
        flex-direction:column
    }

    .sd-btn {
        width:100%
    }

    .sd-proof-row {
        gap:10px 14px
    }

    .sd-studio-shell {
        padding:8px;
        border-radius:22px
    }

    .sd-studio-main {
        border-radius:16px;
        padding:18px
    }

    .sd-studio-topbar {
        height:46px
    }

    .sd-waveform {
        gap:2px;
        height:82px
    }

    .sd-studio-heading strong {
        font-size:36px
    }

    .sd-studio-time strong {
        font-size:20px
    }

    .sd-tracks-section,.sd-library-section,.sd-discipline-section {
        padding:68px 0
    }

    .sd-section-intro h2,.sd-speed-copy h2,.sd-discipline-copy h2,.sd-flow-intro h2,.sd-final-inner h2 {
        font-size:32px;
        letter-spacing:-1px
    }

    .sd-track-content h3 {
        min-height:0
    }

    .sd-ladder-wrap {
        grid-template-columns:repeat(2,1fr);
        gap:8px
    }

    .sd-ladder-step {
        min-height:96px
    }

    .sd-session-card {
        padding:19px
    }

    .sd-session-head {
        align-items:flex-start
    }

    .sd-access {
        padding:5px 7px
    }

    .sd-session-stats {
        grid-template-columns:1fr 1fr
    }

    .sd-flow-steps {
        grid-template-columns:1fr
    }

    .sd-flow-steps>div {
        min-height:auto
    }

    .sd-final-actions {
        width:100%
    }

    .sd-final-actions .sd-btn {
        width:100%
    }

}


/* ============================================================
   Visibility / inheritance hardening
   ============================================================ */
.sd-page-v2 .sd-hero-copy h1,
.sd-page-v2 .sd-section-intro h2,
.sd-page-v2 .sd-speed-copy h2,
.sd-page-v2 .sd-discipline-copy h2,
.sd-page-v2 .sd-flow-intro h2 {
    opacity: 1 !important;
}

.sd-page-v2 .sd-session-card h3,
.sd-page-v2 .sd-track-content h3,
.sd-page-v2 .sd-discipline-row h3 {
    color: #19243A !important;
}

.sd-page-v2 .sd-btn-primary,
.sd-page-v2 .sd-session-start {
    color: #FFFFFF !important;
}

.sd-page-v2 .sd-studio-main,
.sd-page-v2 .sd-speed-panel,
.sd-page-v2 .sd-final-inner {
    isolation: isolate;
}

.sd-page-v2 .sd-track-card,
.sd-page-v2 .sd-session-card,
.sd-page-v2 .sd-flow-card {
    min-width: 0;
}

/* ============================================================
   SEO Content Enhancement Sections
   ============================================================ */
.sd-page-v2 .sd-seo-section {
    padding: 56px 0;
    background: #FFFFFF;
    border-bottom: 1px solid var(--sd-border);
}

.sd-page-v2 .sd-seo-section-alt {
    background: #F9F8FA;
}

.sd-page-v2 .sd-seo-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}

@media (max-width: 991px) {
    .sd-page-v2 .sd-seo-grid {
        grid-template-columns: 1fr;
    }
}

.sd-page-v2 .sd-seo-card {
    background: #FFFFFF;
    border: 1px solid var(--sd-border);
    border-radius: 18px;
    padding: 32px;
    box-shadow: 0 4px 20px rgba(25, 36, 58, 0.04);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.sd-page-v2 .sd-seo-card-full {
    grid-column: 1 / -1;
}

.sd-page-v2 .sd-seo-card h2,
.sd-page-v2 .sd-section-intro h2,
.sd-page-v2 .sd-speed-copy h2 {
    font-size: clamp(24px, 3vw, 32px);
    font-weight: 900;
    color: var(--sd-navy);
    margin: 12px 0 16px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    opacity: 1 !important;
}

.sd-page-v2 .sd-seo-card h2 span,
.sd-page-v2 .sd-section-intro h2 span,
.sd-page-v2 .sd-speed-copy h2 span {
    background: linear-gradient(90deg, var(--sd-purple), var(--sd-pink));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.sd-page-v2 .sd-seo-card p {
    font-size: 14.5px;
    line-height: 1.65;
    color: #55556A;
    margin-bottom: 12px;
    text-align: justify;
}

.sd-page-v2 .sd-seo-card p strong {
    color: var(--sd-navy);
}

.sd-page-v2 .sd-seo-card p a {
    color: var(--sd-purple);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.sd-page-v2 .sd-seo-card p a:hover {
    color: var(--sd-pink);
}

.sd-page-v2 .sd-seo-card-cta {
    margin-top: auto;
    padding-top: 14px;
}

.sd-page-v2 .sd-btn-outline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border-radius: 999px;
    border: 1.5px solid var(--sd-purple);
    color: var(--sd-purple);
    font-weight: 700;
    font-size: 14px;
    transition: all 0.2s ease;
}

.sd-page-v2 .sd-btn-outline:hover {
    background: var(--sd-purple);
    color: #FFFFFF !important;
}

/* FAQ Accordion */
.sd-page-v2 .sd-faq-accordion {
    max-width: 860px;
    margin: 32px auto 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.sd-page-v2 .sd-faq-acc-item {
    background: #FFFFFF;
    border: 1px solid var(--sd-border);
    border-radius: 14px;
    overflow: hidden;
    transition: all 0.25s ease;
    box-shadow: 0 2px 8px rgba(25, 36, 58, 0.03);
}

.sd-page-v2 .sd-faq-acc-item.active {
    border-color: var(--sd-purple);
    box-shadow: 0 4px 16px rgba(79, 50, 154, 0.08);
}

.sd-page-v2 .sd-faq-acc-trigger {
    width: 100%;
    padding: 18px 24px;
    background: none;
    border: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    text-align: left;
    cursor: pointer;
    font-size: 16px;
    font-weight: 800;
    color: var(--sd-navy);
}

.sd-page-v2 .sd-faq-acc-trigger span {
    display: flex;
    align-items: center;
    gap: 10px;
}

.sd-page-v2 .sd-faq-acc-trigger span i {
    color: var(--sd-purple);
    font-size: 15px;
}

.sd-page-v2 .sd-faq-icon {
    font-size: 14px;
    color: var(--sd-purple);
    transition: transform 0.3s ease;
}

.sd-page-v2 .sd-faq-acc-item.active .sd-faq-icon {
    transform: rotate(180deg);
}

.sd-page-v2 .sd-faq-acc-panel {
    display: none;
    padding: 0 24px 20px 48px;
}

.sd-page-v2 .sd-faq-acc-panel p {
    font-size: 14.5px;
    line-height: 1.65;
    color: #64647D;
    margin: 0;
    text-align: justify;
}

.sd-page-v2 .sd-speed-progression {
    margin-top: 20px;
    padding: 16px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    border-left: 3px solid var(--sd-pink);
    font-size: 14.5px;
    line-height: 1.6;
    color: #E2E8F0;
}

.sd-page-v2 .sd-speed-progression strong {
    color: #FFFFFF;
}

@media (max-width: 575px) {
    .sd-page-v2 .sd-seo-section {
        padding: 48px 0;
    }

    .sd-page-v2 .sd-seo-card {
        padding: 24px 20px;
    }

    .sd-page-v2 .sd-faq-accordion {
        margin-top: 24px;
    }

    .sd-page-v2 .sd-faq-acc-trigger {
        padding: 16px;
        gap: 12px;
        font-size: 15px;
    }

    .sd-page-v2 .sd-faq-acc-panel {
        padding: 0 16px 18px;
    }
}



/* SUPERCHARGED V8 CARDS OVERRIDE */
.fshv8-test-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    text-decoration: none !important;
    box-shadow: 0 8px 16px -4px rgba(15,23,42,0.03);
    min-height: auto;
}
.fshv8-test-card::before { display: none !important; }

/* Gradients & Top Borders */
.fshv8-test-card.fshcard-typing { background: linear-gradient(135deg, #ffffff 0%, #eff6ff 100%); border-top: 3px solid #60a5fa; }
.fshv8-test-card.fshcard-audio { background: linear-gradient(135deg, #ffffff 0%, #faf5ff 100%); border-top: 3px solid #c084fc; }
.fshv8-test-card.fshcard-pitman { background: linear-gradient(135deg, #ffffff 0%, #f0fdf4 100%); border-top: 3px solid #34d399; }
.fshv8-test-card.fshcard-ahc { background: linear-gradient(135deg, #ffffff 0%, #fff7ed 100%); border-top: 3px solid #fbbf24; }

/* Buttons inside the cards */
.fshv8-start-btn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 44px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    transition: all 0.2s ease;
    margin-top: auto;
    text-decoration: none !important;
}

/* Typing Button */
.fshv8-test-card.fshcard-typing .fshv8-start-btn { background: #2563eb; color: #fff; box-shadow: 0 2px 8px rgba(37,99,235,0.2); border: none; }
.fshv8-test-card.fshcard-typing:hover .fshv8-start-btn { background: #1d4ed8; color: #fff; box-shadow: 0 4px 12px rgba(37,99,235,0.3); }

/* Audio Button */
.fshv8-test-card.fshcard-audio .fshv8-start-btn { background: #c026d3; color: #fff; box-shadow: 0 2px 8px rgba(192,38,211,0.2); border: none; }
.fshv8-test-card.fshcard-audio:hover .fshv8-start-btn { background: #a21caf; color: #fff; box-shadow: 0 4px 12px rgba(192,38,211,0.3); }

/* Pitman Button */
.fshv8-test-card.fshcard-pitman .fshv8-start-btn { background: #059669; color: #fff; box-shadow: 0 2px 8px rgba(5,150,105,0.2); border: none; }
.fshv8-test-card.fshcard-pitman:hover .fshv8-start-btn { background: #047857; color: #fff; box-shadow: 0 4px 12px rgba(5,150,105,0.3); }

/* AHC Button */
.fshv8-test-card.fshcard-ahc .fshv8-start-btn { background: #ea580c; color: #fff; box-shadow: 0 2px 8px rgba(234,88,12,0.2); border: none; }
.fshv8-test-card.fshcard-ahc:hover .fshv8-start-btn { background: #c2410c; color: #fff; box-shadow: 0 4px 12px rgba(234,88,12,0.3); }

.fshv8-test-card:hover { transform: translateY(-3px); box-shadow: 0 12px 24px -8px rgba(15,23,42,0.08); }

/* ===== Clean Dictation Hub override ===== */
.sd-clean{background:#fff}.sd-clean-hero{padding:64px 0 56px;background:radial-gradient(circle at 18% 0,rgba(79,50,154,.12),transparent 32%),radial-gradient(circle at 90% 22%,rgba(233,38,119,.10),transparent 28%),#fff;text-align:center;position:relative;overflow:hidden}.sd-clean-hero .container{max-width:850px}.sd-clean-hero h1{margin:16px 0 14px;font-size:clamp(34px,5vw,54px);line-height:1.08;font-weight:950;color:var(--sd-navy)}.sd-clean-hero h1 span{background:linear-gradient(90deg,#4f329a,#e92677);-webkit-background-clip:text;color:transparent;display:inline-block}.sd-clean-hero p{max-width:720px;margin:0 auto;color:var(--sd-text);font-size:16px;line-height:1.7}.sd-clean-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:26px}.sd-clean-hero .sd-proof-row{justify-content:center;margin-top:24px}.sd-clean-section{padding:72px 0}.sd-clean-heading{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:28px}.sd-clean-heading h2,.sd-clean-speed h2{margin:8px 0 0;font-size:clamp(26px,3vw,36px);font-weight:900;color:var(--sd-navy)}.sd-clean-heading p{margin:0;max-width:380px;color:var(--sd-text)}.sd-clean-track-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.sd-clean-track{background:#fff;border:1px solid var(--sd-border);border-radius:18px;overflow:hidden;color:inherit;transition:.2s}.sd-clean-track:hover{transform:translateY(-3px);box-shadow:0 14px 35px rgba(25,36,58,.08)}.sd-clean-track-img{aspect-ratio:16/9;background:#f3f1f6;overflow:hidden}.sd-clean-track-img img{width:100%;height:100%;object-fit:cover}.sd-clean-track-body{padding:16px}.sd-clean-track-body h3{font-size:15px;line-height:1.4;margin:0 0 10px;color:var(--sd-navy);font-weight:850}.sd-clean-track-body span{font-size:12px;color:var(--sd-purple);font-weight:800}.sd-clean-speed{padding:56px 0;background:#f8f6fb}.sd-clean-speed-inner{display:grid;grid-template-columns:.75fr 1.25fr;gap:48px;align-items:center}.sd-clean-speed p{color:var(--sd-text);margin:10px 0 0}.sd-clean-wpm{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.sd-clean-wpm a{min-height:74px;border:1px solid var(--sd-border);border-radius:14px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--sd-navy)}.sd-clean-wpm a.focus{background:var(--sd-purple);color:#fff;border-color:var(--sd-purple)}.sd-clean-wpm strong{font-size:20px}.sd-clean-wpm small{font-size:9px;font-weight:800;letter-spacing:.08em}.sd-clean-library{background:#fff}.sd-clean-tools{display:flex;justify-content:space-between;gap:16px;margin-bottom:24px}.sd-clean-lang{display:flex;gap:8px}.sd-clean-lang a{padding:9px 15px;border:1px solid var(--sd-border);border-radius:999px;font-size:12px;font-weight:800;color:var(--sd-navy)}.sd-clean-lang a.active{background:var(--sd-purple);border-color:var(--sd-purple);color:#fff}.sd-clean-search{width:min(100%,340px);position:relative}.sd-clean-search i{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:var(--sd-text)}.sd-clean-search input{width:100%;height:42px;border:1px solid var(--sd-border);border-radius:999px;padding:0 16px 0 40px;outline:none}.sd-clean-session-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.sd-clean-session{border:1px solid var(--sd-border);border-radius:18px;padding:18px;background:#fff;display:flex;flex-direction:column}.sd-clean-session-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.sd-clean-wpm-badge{font-size:11px;font-weight:900;color:var(--sd-purple);background:#f3effa;padding:6px 9px;border-radius:8px}.sd-clean-access{font-size:9px;font-weight:900;text-transform:uppercase}.sd-clean-access.free{color:#198754}.sd-clean-access.premium{color:#c62566}.sd-clean-session h3{font-size:16px;line-height:1.4;color:var(--sd-navy);font-weight:850;margin:0 0 16px}.sd-clean-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;margin-bottom:16px;color:var(--sd-text);font-size:10px;font-weight:700}.sd-clean-start{min-height:42px;border-radius:11px;background:var(--sd-navy);color:#fff!important;display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:850}.sd-clean-start .fa-arrow-right{margin-left:auto;margin-right:12px}.sd-clean-start .fa-headphones{margin-left:12px}.sd-clean-more{text-align:center;margin-top:28px}.sd-clean-more a{font-size:13px;font-weight:850;color:var(--sd-purple)}
@media(max-width:991px){.sd-clean-track-grid,.sd-clean-session-grid{grid-template-columns:repeat(2,1fr)}.sd-clean-speed-inner{grid-template-columns:1fr}.sd-clean-wpm{grid-template-columns:repeat(3,1fr)}}
@media(max-width:575px){.sd-clean-hero{padding:42px 0}.sd-clean-section{padding:50px 0}.sd-clean-heading{display:block}.sd-clean-heading p{margin-top:10px}.sd-clean-track-grid,.sd-clean-session-grid{grid-template-columns:1fr}.sd-clean-tools{display:block}.sd-clean-search{margin-top:12px;width:100%}.sd-clean-wpm{grid-template-columns:repeat(3,1fr)}}
