/* GENERATED by Documentation/5. Programs/options course hubens/locales/build_locales.py.
   Do not edit: the first part is the <style> block of options-course/index.html, the rest is
   EXTRA_CSS in the builder. */
    /* Tokens and components follow /analyst-programme (the sa-* system), so the two program
       pages read as one site. Course-only parts are prefixed oc-. */
    :root {
      --cream:        #f6f3ee;
      --cream-deep:   #ede8df;
      --paper:        #fbf9f5;
      --ink:          #030248;
      --ink-soft:     rgba(3, 2, 72, 0.7);
      --ink-faint:    rgba(3, 2, 72, 0.45);
      --ink-line:     rgba(3, 2, 72, 0.18);
      --gold:         #daa520;
      --body:         #1a1410;
      --body-soft:    rgba(26, 20, 16, 0.65);
      --burg:         #66100c;
      --burg-deep:    #1c0503;
      --burg-line:    rgba(102, 16, 12, 0.18);
      --rose:         #f0c9c5;
      --rose-kick:    #e8a49e;
      --rose-body:    #e3d8d4;
      --rose-faint:   #bfa9a4;
    }
    html.oc-handoff body { visibility: hidden; }

    *, *::before, *::after { box-sizing: border-box; }
    html { overflow-x: hidden; }
    body {
      margin: 0; padding: 0;
      background: var(--cream); color: var(--body);
      font-family: 'Chivo', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
      -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
    }
    a { color: inherit; text-decoration: none; }
    img { max-width: 100%; }

    .sph-topnav { display: flex; align-items: center; justify-content: space-between; padding: 22px 40px; width: 100%; gap: 24px; }
    .sph-topnav-brand { font-family: 'Cardo', serif; font-size: 1.15rem; font-weight: 700; letter-spacing: 0.04em; color: var(--ink); }
    .sph-topnav-brand sup { color: var(--gold); font-size: 0.5em; vertical-align: super; }
    .sph-topnav-links { display: flex; gap: 28px; align-items: center; }
    .sph-topnav-links a { font-size: 0.72rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-soft); transition: color 0.25s ease; }
    .sph-topnav-links a:hover { color: var(--gold); }
    .sph-topnav-links sup { font-size: 0.6em; line-height: 0; vertical-align: baseline; position: relative; top: -0.55em; color: var(--gold); }

    /* ---- Banner: the studio still, a slow zoom and the dark veil (same as the analyst program) ---- */
    .sa-hx { position: relative; background: var(--burg-deep); color: #fff; padding: 96px 0 84px; overflow: hidden; display: flex; flex-direction: column; justify-content: center; }
    .sa-hx-bg { position: absolute; inset: 0; overflow: hidden; background: url('/options-course/assets/video-still.webp') 70% 37% / cover no-repeat; opacity: .6; transform: scale(1.02); transform-origin: 72% 40%; animation: saKen 26s ease-in-out infinite alternate; }
    /* Sven's face sits at about 72% across and 40% down the still. The crop (37%) keeps it at the middle of
       the banner's height at any width, and the slow zoom grows from his face, so it is never pushed past an
       edge (Vincent, 13 Oct 2026: "don't cut off his face in banner"). */
    @keyframes saKen { from { transform: scale(1.02); } to { transform: scale(1.08); } }
    /* A taller banner on the course page only (Vincent, 13 Oct 2026: "make banner taller"): an exception to
       the one sophron.eu banner height (452 / 419px in sph-nav.css), so the studio shot has room. The
       selector carries one class more than sph-nav.css's, so its !important wins. Text centred in it. */
    html body .sa-hx.oc-hx { height: 620px !important; min-height: 620px !important; max-height: 620px !important; justify-content: center !important; }
    html body .sa-hx.oc-hx .sa-hx-in { padding-top: 0 !important; padding-bottom: 0 !important; }
    @media (max-width: 760px) {
      html body .sa-hx.oc-hx { height: 520px !important; min-height: 520px !important; max-height: 520px !important; }
    }
    /* The buttons and the line under them, centred below the banner (Vincent, 13 Oct 2026). */
    .oc-under .sph-hx-under__in { align-items: center; text-align: center; }
    .oc-under .sa-cta { justify-content: center; }
    .oc-under .sa-hx-note { max-width: 46em; }
    @media (prefers-reduced-motion: reduce) { .sa-hx-bg { animation: none; } }
    .sa-hx::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(100deg, rgba(20,5,3,.94) 0%, rgba(20,5,3,.82) 40%, rgba(20,5,3,.35) 58%, rgba(20,5,3,.12) 100%); }
    .sa-hx-in { position: relative; z-index: 2; max-width: 1240px; margin: 0 auto; padding: 0 24px; width: 100%; }
    .sa-hx-kick { font-size: .78rem; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: var(--rose-kick); }
    .sa-hx-h { font-family: 'Cardo', serif; font-weight: 400; font-size: clamp(2.2rem, 4.4vw, 3.9rem); line-height: 1.08; letter-spacing: -.02em; margin: 26px 0 26px; color: #fff; max-width: 13em; }
    .sa-hx-h em { font-style: italic; color: var(--rose); }
    .sa-hx-p { font-family: 'Cardo', serif; font-size: 1.22rem; line-height: 1.6; color: var(--rose-body); max-width: 34em; margin: 0; }
    .sa-hx-note { font-size: .92rem; line-height: 1.6; color: var(--body-soft); margin: 0; }
    .sa-hx-note a { color: var(--burg); border-bottom: 1px solid var(--burg-line); }
    .sa-hx-note a:hover { border-color: var(--burg); }
    .sa-hx-stats { display: flex; gap: 52px; flex-wrap: wrap; }

    /* Buttons */
    .sa-cta { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
    .sa-btn {
      display: inline-flex; align-items: center; justify-content: center; gap: 8px;
      min-height: 52px; padding: 14px 26px;
      font: inherit; font-size: .78rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
      border-radius: 12px; border: 1px solid transparent; cursor: pointer;
      transition: background .2s ease, color .2s ease, border-color .2s ease;
    }
    .sa-btn--light { background: var(--cream); color: var(--burg); }
    .sa-btn--light:hover { background: var(--rose); }
    .sa-btn--line { border-color: rgba(255,255,255,.3); color: #fff; }
    .sa-btn--line:hover { border-color: var(--rose); color: var(--rose); }
    .sa-btn--prem { border-color: rgba(218,165,32,.75); color: #f1d48a; }
    .sa-btn--prem:hover { background: rgba(218,165,32,.12); border-color: var(--gold); color: #fff; }
    /* The owner's label: the same button, read from <html data-oc="own"> */
    [data-oc-l="own"] { display: none; }
    html[data-oc="own"] [data-oc-l="buy"] { display: none; }
    html[data-oc="own"] [data-oc-l="own"] { display: inline; }
    html[data-oc="own"] .oc-buyonly { display: none !important; }

    /* Practitioner logos */
    .sa-cred { background: var(--paper); border-bottom: 1px solid var(--ink-line); border-top: 1px solid var(--ink-line); padding: 28px 0 30px; margin-top: 40px; }
    .sa-cred-t { text-align: center; font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--body-soft); margin: 0 0 18px; }
    .sa-cred-row { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 22px 56px; }
    .sa-cred-row img { height: 26px; width: auto; object-fit: contain; filter: grayscale(1); opacity: .72; }
    .sa-cred-row img.oc-maven { height: 30px; }
    .sa-cred-row img.oc-cboe { height: 30px; }
    .sa-cred-row img.oc-optiver { height: 22px; }

    /* The sixteen subtitle languages scroll by, like the sector desks on the analyst program */
    .sa-marq { background: #1a0605; color: var(--rose); padding: 17px 0; overflow: hidden; border-block: 1px solid rgba(240,201,197,.12); }
    .sa-marq-track { display: flex; gap: 46px; width: max-content; animation: saSlide 48s linear infinite; }
    .sa-marq-track span { display: flex; align-items: center; gap: 46px; font-size: .72rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; white-space: nowrap; color: rgba(240,201,197,.6); }
    .sa-marq-track span::after { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #e8a49e; opacity: .7; }
    @keyframes saSlide { to { transform: translateX(-50%); } }
    @media (prefers-reduced-motion: reduce) { .sa-marq-track { animation: none; } }

    /* Bands */
    .sa-band { padding: 96px 0; }
    .sa-band--paper { background: var(--paper); border-top: 1px solid var(--ink-line); border-bottom: 1px solid var(--ink-line); }
    .sa-band--dark { background: var(--burg-deep); color: var(--rose-body); }
    .sa-wrap { max-width: 1240px; margin: 0 auto; padding: 0 24px; }
    .sa-wrap--narrow { max-width: 900px; }
    .sa-head { max-width: 46em; margin: 0 0 44px; }
    .sa-head--c { margin-left: auto; margin-right: auto; text-align: center; }
    .sa-eyebrow {
      display: inline-block; font-size: .7rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase;
      color: var(--burg); margin: 0 0 16px; padding: 6px 14px;
      background: rgba(102, 16, 12, 0.06); border: 1px solid var(--burg-line); border-radius: 2px;
    }
    .sa-band--dark .sa-eyebrow { color: var(--rose-kick); background: rgba(240,201,197,.06); border-color: rgba(240,201,197,.25); }
    .sa-h2 { font-family: 'Cardo', serif; font-size: clamp(1.9rem, 3.6vw, 2.8rem); font-weight: 700; line-height: 1.12; letter-spacing: -.01em; margin: 0 0 16px; color: var(--body); }
    .sa-h2 em { font-style: italic; font-weight: 400; color: var(--burg); }
    .sa-band--dark .sa-h2 { color: #fff; }
    .sa-band--dark .sa-h2 em { color: var(--rose); }
    .sa-hx-p sup, .sa-card h3 sup, .oc-lic sup, .sa-h2 sup, .sa-lede sup, .sa-card p sup, .sa-checks sup, .sa-price sup, .oc-faq sup, .sa-hx-note sup { font-size: .55em; line-height: 0; vertical-align: super; }
    .sa-lede { font-family: 'Cardo', serif; font-size: 1.15rem; line-height: 1.65; color: var(--body-soft); margin: 0; }
    .sa-band--dark .sa-lede { color: var(--rose-body); }

    /* Cards */
    .sa-grid { display: grid; gap: 18px; }
    .sa-g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sa-g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    /* Live Q&A (20 Oct 2026): the badge in the banner and the one dark card among "What it is". */
    .oc-qa-badge { display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; margin: 2px 0 4px; padding: 9px 16px; border: 1px solid rgba(240,201,197,.55); border-radius: 999px; background: rgba(255,255,255,.08); color: #fff; font-size: .82rem; font-weight: 700; letter-spacing: .04em; text-decoration: none; }
    .oc-qa-badge:hover { background: rgba(255,255,255,.16); }
    .oc-qa-badge i { width: 8px; height: 8px; border-radius: 50%; background: #e8574b; flex: none; }
    .oc-qa-badge span { font-weight: 500; color: #e3d8d4; }
    .oc-qa-badge b { font-weight: 800; color: #fff; font-size: 1.06em; }
    .sa-hx-p .oc-qa-em { font-weight: 700; color: #fff; border-bottom: 2px solid #e8574b; padding-bottom: 1px; }
    .oc-incl .oc-card-group { grid-column: 1 / -1; }
    .oc-incl .oc-card-group p { max-width: none; }
    .sa-card.oc-card-qa { background: var(--burg-deep, #1c0503); border-color: var(--burg-deep, #1c0503); }
    .sa-card.oc-card-qa .sa-card-n { color: #f0c9c5; }
    .sa-card.oc-card-qa h3 { color: #fff; }
    .sa-card.oc-card-qa p { color: #e3d8d4; }
    /* When the next Q&A is (22 Oct 2026), from /api/qa-next: a countdown, or "scheduled soon" with none set. */
    .oc-qa-box { display: inline-flex; align-items: center; gap: 0; align-self: flex-start; margin: 30px 0 0; padding: 16px 0; border: 1px solid rgba(240,201,197,.55); border-radius: 14px; background: rgba(28,5,3,.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); color: #fff; text-decoration: none; }
    .oc-qa-box[hidden] { display: none; }
    /* The group link under the Q&A timer (13 Nov 2026): same glass as the timer, one line, a soft pill for the perk. */
    .oc-tg-box { display: flex; width: fit-content; max-width: 100%; box-sizing: border-box; flex-wrap: wrap; align-items: center; gap: 12px; margin: 12px 0 0; padding: 12px 20px; border: 1px solid rgba(240,201,197,.55); border-radius: 14px; background: rgba(28,5,3,.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); color: #fff; text-decoration: none; }
    .oc-qa-box[hidden] + .oc-tg-box { margin-top: 30px; }
    .oc-tg-box:hover { background: rgba(28,5,3,.72); border-color: #f0c9c5; }
    .oc-tg-box svg { width: 20px; height: 20px; flex: none; fill: none; stroke: #f0c9c5; stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; }
    .oc-tg-box__t { font-family: 'Chivo', system-ui, sans-serif; font-size: 1rem; font-weight: 700; color: #fff; }
    .oc-tg-box__w { padding: 4px 10px; border-radius: 999px; background: rgba(240,201,197,.18); font-family: 'Chivo', system-ui, sans-serif; font-size: .74rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #f0c9c5; }
    /* Card 07 as the target: the line darkens and a soft ring shows where you landed (no fill, rule book 5c). */
    .oc-card-group { scroll-margin-top: 110px; transition: border-color .3s, box-shadow .3s; }
    .oc-card-group:target { border-color: #66100c; box-shadow: 0 0 0 4px rgba(102,16,12,.14); }
    .oc-qa-box:hover { background: rgba(28,5,3,.72); border-color: #f0c9c5; }
    .oc-qa-box > span { padding: 0 24px; }
    .oc-qa-box > span + span { border-left: 1px solid rgba(240,201,197,.35); }
    .oc-qa-box__k { display: inline-flex; align-items: center; gap: 10px; font-size: .74rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #f0c9c5; }
    .oc-qa-box__k i { width: 9px; height: 9px; border-radius: 50%; background: #e8574b; box-shadow: 0 0 0 0 rgba(232,87,75,.6); animation: ocQaPulse 2s infinite; flex: none; }
    @keyframes ocQaPulse { 0% { box-shadow: 0 0 0 0 rgba(232,87,75,.55); } 70% { box-shadow: 0 0 0 9px rgba(232,87,75,0); } 100% { box-shadow: 0 0 0 0 rgba(232,87,75,0); } }
    @media (prefers-reduced-motion: reduce) { .oc-qa-box__k i { animation: none; } }
    .oc-qa-box__t { font-family: 'Cardo', serif; font-size: 2.1rem; line-height: 1; font-weight: 700; color: #fff; white-space: nowrap; }
    .oc-qa-box__w { font-size: .95rem; line-height: 1.4; color: #e3d8d4; }
    .oc-qa-box__w:empty { display: none; }
    @media (max-width: 760px) {
      .oc-qa-box { display: grid; grid-template-columns: auto 1fr; align-items: center; row-gap: 8px; margin-top: 20px; padding: 14px 18px; }
      .oc-qa-box > span { padding: 0; }
      .oc-qa-box > span + span { border-left: 0; }
      .oc-qa-box__k { grid-column: 1 / -1; }
      .oc-qa-box__t { font-size: 1.7rem; padding-right: 14px !important; }
    }
    .sa-card.oc-card-qa p.oc-qa-when { margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(240,201,197,.3); color: #fff; font-weight: 700; }
    .oc-qa-when span { font-weight: 400; color: #e3d8d4; }
    .sa-pipe.oc-pipe6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    @media (max-width: 1100px) { .sa-pipe.oc-pipe6 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
    @media (max-width: 760px) { .sa-pipe.oc-pipe6 { grid-template-columns: minmax(0, 1fr); } }
    .sa-g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .sa-card { background: var(--paper); border: 1px solid var(--ink-line); border-radius: 14px; padding: 26px 24px; min-width: 0; }
    .sa-band--paper .sa-card { background: var(--cream); }
    .sa-card-n { display: block; font-family: 'Cardo', serif; font-size: 1rem; color: var(--burg); margin: 0 0 14px; }
    .sa-card h3 { font-family: 'Cardo', serif; font-size: 1.28rem; font-weight: 700; line-height: 1.25; margin: 0 0 10px; color: var(--body); }
    .sa-card p { font-size: .93rem; line-height: 1.65; color: var(--body-soft); margin: 0; }

    /* The walkthrough film: poster until tapped, then the mp4 */
    .oc-film { position: relative; margin: 44px 0 0; border-radius: 14px; overflow: hidden; background: var(--burg-deep); border: 1px solid var(--ink-line); aspect-ratio: 16 / 9; cursor: pointer; }
    .oc-film img, .oc-film video { display: block; width: 100%; height: 100%; object-fit: cover; }
    .oc-film::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(28,5,3,0) 55%, rgba(28,5,3,.55) 100%); pointer-events: none; transition: opacity .3s ease; }
    .oc-film.is-playing::after, .oc-film.is-playing .oc-film-play, .oc-film.is-playing .oc-film-chip { opacity: 0; pointer-events: none; }
    .oc-film-play { position: absolute; left: 50%; top: 50%; width: 84px; height: 84px; margin: -42px 0 0 -42px; border-radius: 50%; border: 1px solid rgba(255,255,255,.55); background: rgba(102,16,12,.82); cursor: pointer; z-index: 1; transition: background .2s ease, transform .2s ease, opacity .3s ease; }
    .oc-film-play::before { content: ''; position: absolute; left: 34px; top: 27px; border-style: solid; border-width: 15px 0 15px 24px; border-color: transparent transparent transparent var(--cream); }
    .oc-film:hover .oc-film-play { background: var(--burg); transform: scale(1.05); }
    .oc-film-chip { position: absolute; left: 20px; bottom: 18px; z-index: 1; font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--cream); transition: opacity .3s ease; }

    /* Pipeline (dark) */
    .sa-pipe { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
    .sa-pipe > div { border: 1px solid rgba(240,201,197,.2); border-radius: 14px; padding: 22px 20px; background: rgba(255,255,255,.03); min-width: 0; }
    .sa-pipe b { display: block; font-family: 'Cardo', serif; font-weight: 400; font-size: 2rem; line-height: 1; color: var(--rose); margin: 0 0 16px; }
    .sa-pipe strong { display: block; font-size: .78rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #fff; margin: 0 0 8px; }
    .sa-pipe span { display: block; font-size: .9rem; line-height: 1.6; color: var(--rose-body); }
    .sa-pipe sup { font-size: .6em; line-height: 0; vertical-align: super; }

    /* The five parts */
    .oc-parts { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink-line); }
    .oc-parts li { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 18px 24px; align-items: baseline; padding: 26px 0; border-bottom: 1px solid var(--ink-line); }
    .oc-parts-n { font-family: 'Cardo', serif; font-size: 2.2rem; line-height: 1; color: var(--burg); }
    .oc-parts h3 { font-family: 'Cardo', serif; font-size: 1.4rem; font-weight: 700; line-height: 1.25; margin: 0 0 6px; color: var(--body); }
    .oc-parts p { font-size: .95rem; line-height: 1.65; color: var(--body-soft); margin: 0; max-width: 40em; }
    .oc-parts-m { font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-soft); white-space: nowrap; text-align: right; line-height: 1.7; }

    /* Slides from the course (the seven public ones) */
    .oc-slides { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 44px; }
    .oc-slides figure { margin: 0; min-width: 0; }
    .oc-slides img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 6px; border: 1px solid var(--ink-line); background: #fff; }
    .oc-slides figcaption { font-size: .84rem; color: var(--body-soft); margin-top: 10px; line-height: 1.5; }

    /* The teacher (dark) */
    .sa-authors { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 56px; align-items: center; }
    .sa-shot { margin: 0; }
    .sa-shot img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 12px; border: 1px solid rgba(240,201,197,.2); }
    .sa-shot figcaption { font-size: .82rem; color: var(--rose-faint); margin-top: 10px; }
    .oc-bio p { font-size: 1rem; line-height: 1.7; color: var(--rose-body); margin: 0 0 16px; }
    .oc-bio strong { color: #fff; font-weight: 600; }
    .oc-hc { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin: 26px 0 0; padding: 20px 0 0; border-top: 1px solid rgba(240,201,197,.15); }
    .oc-hc img { height: 30px; width: auto; }
    .oc-hc span { font-size: .74rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--rose-faint); }
    .oc-li { display: inline-flex; align-items: center; gap: 8px; font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--rose); border-bottom: 1px solid rgba(240,201,197,.35); padding-bottom: 2px; }
    .oc-li:hover { border-color: var(--rose); }
    .oc-lic { font-size: .84rem; line-height: 1.6; color: var(--rose-faint); margin: 24px 0 0; }

    /* Certificate (dark) */
    .sa-cert { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 56px; align-items: center; }
    .sa-cert-shot { margin: 0; }
    .sa-cert-shot img { display: block; width: 100%; height: auto; border-radius: 6px; box-shadow: 0 30px 70px rgba(0,0,0,.45); }
    .sa-checks { list-style: none; margin: 26px 0 30px; padding: 0; display: grid; gap: 14px; }
    .sa-checks li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; font-size: .95rem; line-height: 1.6; color: var(--rose-body); }
    .sa-checks svg { width: 18px; height: 18px; color: var(--rose); margin-top: 3px; }
    .sa-checks strong { color: #fff; font-weight: 600; }

    /* Facts */
    .sa-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border: 1px solid var(--ink-line); border-radius: 14px; overflow: hidden; background: var(--paper); margin: 0; }
    .sa-facts > div { padding: 20px 22px; border-right: 1px solid var(--ink-line); border-bottom: 1px solid var(--ink-line); min-width: 0; }
    .sa-facts > div:nth-child(3n) { border-right: 0; }
    .sa-facts > div:nth-last-child(-n+3) { border-bottom: 0; }
    .sa-facts dt { font-size: .66rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-faint); margin: 0 0 6px; }
    .sa-facts dd { margin: 0; font-family: 'Cardo', serif; font-size: 1.08rem; line-height: 1.4; color: var(--body); }

    /* FAQ */
    .oc-faq { border-top: 1px solid var(--ink-line); margin-top: 48px; }
    .oc-faq details { border-bottom: 1px solid var(--ink-line); }
    .oc-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 20px 0; font-family: 'Cardo', serif; font-size: 1.18rem; font-weight: 700; color: var(--body); }
    .oc-faq summary::-webkit-details-marker { display: none; }
    .oc-faq summary::after { content: '+'; font-family: 'Chivo', sans-serif; font-size: 1.3rem; font-weight: 400; color: var(--burg); transition: transform .2s ease; }
    .oc-faq details[open] summary::after { transform: rotate(45deg); }
    .oc-faq p { font-size: .95rem; line-height: 1.7; color: var(--body-soft); margin: 0 0 22px; max-width: 46em; }
    .oc-faq a { color: var(--burg); border-bottom: 1px solid var(--burg-line); }
    .oc-disc { font-size: .8rem; line-height: 1.65; color: var(--ink-faint); margin: 32px 0 0; }

    /* Final */
    .sa-final { text-align: center; max-width: 44em; margin: 0 auto; }
    .sa-final .sa-cta { justify-content: center; margin: 30px 0 22px; }
    .sa-price { font-size: .9rem; line-height: 1.7; color: var(--rose-faint); margin: 0; }
    .sa-price a { color: var(--rose); border-bottom: 1px solid rgba(240,201,197,.45); }

    /* Footer */
    .sph-foot { max-width: 1100px; margin: 60px auto 0; padding: 32px 24px 0; text-align: center; font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-faint); border-top: 1px solid var(--ink-line); }
    .sph-foot a { color: var(--ink-soft); transition: color 0.3s ease; }
    .sph-foot a:hover { color: var(--gold); }
    .sph-foot-brand { font-family: 'Cardo', serif; font-size: 1.45rem; font-weight: 700; letter-spacing: 0.04em; color: var(--ink); text-transform: none; margin: 22px 0; }
    .sph-foot-brand sup { color: var(--gold); font-size: 0.5em; vertical-align: super; }
    .sph-foot-legal { display: flex; gap: 22px; justify-content: center; flex-wrap: wrap; margin-bottom: 18px; font-size: 0.74rem; letter-spacing: 0.12em; }
    .sph-foot-meta { opacity: 0.7; font-size: 0.66rem; letter-spacing: 0.18em; padding-bottom: 32px; }

    @media (max-width: 1100px) {
      .sa-pipe { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .sa-g4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }
    @media (max-width: 900px) {
      .sa-authors, .sa-cert { grid-template-columns: minmax(0, 1fr); gap: 36px; }
      .sa-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .sa-facts > div { border-right: 1px solid var(--ink-line); border-bottom: 1px solid var(--ink-line); }
      .sa-facts > div:nth-child(2n) { border-right: 0; }
      .sa-facts > div:nth-last-child(-n+2) { border-bottom: 0; }
      .oc-slides { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .oc-slides figure:nth-child(3) { display: none; }
    }
    @media (max-width: 760px) {
      .sa-hx-in, .sa-wrap { padding: 0 16px; }
      .sa-hx-bg { opacity: .4; background-position: 74% 40%; transform-origin: 74% 40%; }
      .sa-hx::before { background: linear-gradient(168deg, rgba(20,5,3,.7) 0%, rgba(20,5,3,.85) 60%, rgba(20,5,3,.96) 100%); }
      .sa-band { padding: 64px 0; }
      .sa-head { margin-bottom: 32px; }
      .sa-g2, .sa-g3, .sa-g4, .sa-pipe { grid-template-columns: minmax(0, 1fr); }
      .sa-facts { grid-template-columns: minmax(0, 1fr); }
      .sa-facts > div, .sa-facts > div:nth-child(2n), .sa-facts > div:nth-child(3n) { border-right: 0; border-bottom: 1px solid var(--ink-line); }
      .sa-facts > div:last-child { border-bottom: 0; }
      .sa-cred-row { gap: 18px 32px; }
      .sa-cred-row img { height: 20px; }
      .sa-cred-row img.oc-maven, .sa-cred-row img.oc-cboe { height: 24px; }
      .sa-cred-row img.oc-optiver { height: 17px; }
      .sa-facts > div:nth-last-child(2) { border-bottom: 1px solid var(--ink-line); }
      .sa-btn { flex: 1 1 100%; }
      .oc-parts li { grid-template-columns: 44px minmax(0, 1fr); }
      .oc-parts-m { grid-column: 2; text-align: left; }
      .oc-parts-n { font-size: 1.8rem; }
      .oc-slides { grid-template-columns: minmax(0, 1fr); }
      .oc-slides figure:nth-child(n+2) { display: none; }
      .oc-film { margin-top: 32px; }
      .oc-film-play { width: 64px; height: 64px; margin: -32px 0 0 -32px; }
      .oc-film-play::before { left: 26px; top: 20px; border-width: 12px 0 12px 19px; }
    }
    @media (max-width: 600px) {
      .oc-film-play { width: 44px; height: 44px; margin: -22px 0 0 -22px; }
      .oc-film-play::before { left: 17px; top: 13px; border-width: 9px 0 9px 14px; }
      .oc-film-chip { top: 12px; bottom: auto; left: 14px; }
      .sph-topnav { padding: 16px 16px; gap: 14px; }
      .sph-topnav-brand { font-size: 1rem; }
      .sph-topnav-links { gap: 16px; }
      .sph-topnav-links a { font-size: 0.62rem; letter-spacing: 0.14em; }
      .sph-foot { padding: 28px 16px 0; }
      .sph-foot-brand { font-size: 1.25rem; }
      .sph-foot-legal { gap: 14px; font-size: 0.68rem; letter-spacing: 0.08em; }
    }
    /* Small uppercase labels: never below 12px (the sophron.eu layout gate). */
    .sa-cred-t, .sa-marq-track span, .sa-facts dt, .sa-eyebrow, .sa-card-n, .sa-pipe strong, .oc-parts-m,
    .oc-film-chip, .oc-hc span, .oc-li, .sa-hx-stats span { font-size: max(12px, 1em * .75) !important; }
  
/* ===================================================================================================
   Locale and glossary pages (13 Oct 2026). Everything ABOVE this line is copied verbatim from the
   <style> block of options-course/index.html by build_locales.py; everything below is EXTRA_CSS in
   that builder. Generated file: edit the English page or the builder, never this file.
   =================================================================================================== */
.sa-hx-p em { font-style: italic; color: var(--rose); }
.sa-hx-p strong { color: #fff; font-weight: 600; }

/* The course banner on a locale page: the English page's taller studio banner, but it grows with
   a longer translation instead of clipping it (the text is still centred in at least 620px). */
html body.oc-loc .sa-hx.oc-hx { height: auto !important; max-height: none !important; min-height: 620px !important; }
html body.oc-loc .sa-hx.oc-hx .sa-hx-in { padding-top: 64px !important; padding-bottom: 64px !important; }
@media (max-width: 760px) {
  html body.oc-loc .sa-hx.oc-hx { min-height: 520px !important; }
  html body.oc-loc .sa-hx.oc-hx .sa-hx-in { padding-top: 48px !important; padding-bottom: 48px !important; }
}

/* Right to left (Arabic): the content only, the header and footer stay left to right. The veil
   turns round so the dark side sits under the text. Letter spacing breaks joined scripts. */
html body [dir="rtl"] .sa-hx-in, html body [dir="rtl"] .sa-hx-kick, html body [dir="rtl"] .sa-hx-h,
html body [dir="rtl"] .sa-hx-p { text-align: right !important; }
[dir="rtl"] .sa-hx::before { background: linear-gradient(260deg, rgba(20,5,3,.94) 0%, rgba(20,5,3,.84) 45%, rgba(20,5,3,.5) 70%, rgba(20,5,3,.3) 100%); }
html[lang="ar"] body [dir="rtl"] *, html[lang="hi"] body .oc-content * { letter-spacing: 0 !important; }
[dir="rtl"] .oc-parts-m { text-align: left; }

/* Language dropdown */
.oc-langbar { display: flex; justify-content: center; }
.oc-langsel { position: relative; display: inline-flex; align-items: center; color: var(--ink); }
.oc-langsel select {
  -webkit-appearance: none; appearance: none; margin: 0; height: 42px; padding: 0 38px 0 40px;
  border: 1px solid var(--ink-line); border-radius: 999px; background: var(--paper);
  font: inherit; font-size: .88rem; font-weight: 600; color: var(--ink); cursor: pointer; direction: ltr;
}
.oc-langsel select:hover, .oc-langsel select:focus { border-color: var(--burg); outline: none; }
.oc-langsel__g { position: absolute; left: 14px; width: 17px; height: 17px; color: var(--burg); pointer-events: none; }
.oc-langsel__c { position: absolute; right: 14px; width: 14px; height: 14px; color: var(--ink-soft); pointer-events: none; }
.oc-langbar { direction: ltr; }

/* Links to the glossary and the English page */
.oc-more { margin: 36px 0 0; font-size: .98rem; line-height: 1.6; }
.oc-more a { color: var(--burg); font-weight: 600; border-bottom: 1px solid var(--burg-line); padding-bottom: 2px; }
.oc-more a:hover { border-color: var(--burg); }
.sa-band--dark .oc-more a { color: var(--rose); border-color: rgba(240,201,197,.4); }
.oc-more--c { text-align: center; }

/* Outcomes and the teacher line */
.oc-out { padding-top: 80px; }
.oc-teach { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; margin: 32px 0 0; padding: 22px 0 0; border-top: 1px solid var(--ink-line); }
.oc-teach img { height: 28px; width: auto; }
.oc-teach span { font-size: max(12px, .74rem); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-soft); }
.oc-teach a { display: inline-flex; align-items: center; gap: 8px; font-size: max(12px, .74rem); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--burg); border-bottom: 1px solid var(--burg-line); padding-bottom: 2px; }

/* Live Q&A with Sven (20 Oct 2026): the badge under the eyebrow in the banner. Never say how often. */
.oc-qa-badge { display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; margin: 14px 0 6px; padding: 9px 16px; border: 1px solid rgba(240,201,197,.55); border-radius: 999px; background: rgba(255,255,255,.08); font-size: .82rem; letter-spacing: .02em; }
.oc-qa-badge span { font-weight: 500; color: #e3d8d4; }
.oc-qa-badge b { font-weight: 800; color: #fff; font-size: 1.06em; }
.oc-qa-badge i { width: 8px; height: 8px; border-radius: 50%; background: #e8574b; flex: none; }
html body [dir="rtl"] .oc-qa-badge { align-self: flex-end; }
/* The group with Sven (13 Nov 2026). The .oc-tg-box and .oc-card-group rules come with the English
   <style> above; a locale banner has no Q&A countdown box, so the link takes the box's 30px itself.
   The card sits full width under the checklist (the four "What you get" cards stay four). */
.sa-hx-p + .oc-tg-box { margin-top: 30px; }
.oc-incl--group { margin: 40px 0 0; }
.oc-get .oc-card-group h3 { margin: 0 0 10px; }
/* What you get: the figure leads each card, then the checklist */
.oc-get .sa-card-k { display: block; font-family: 'Cardo', serif; font-size: 2.1rem; line-height: 1.05; color: var(--burg); margin: 0 0 16px; }
.oc-get .sa-card h3 { margin: 0; }
.oc-checklist { list-style: none; margin: 40px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 40px; }
.oc-checklist li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; font-size: .95rem; line-height: 1.6; color: var(--body-soft); }
.oc-checklist li b { color: var(--body); font-weight: 600; }
.oc-checklist svg { width: 18px; height: 18px; color: var(--burg); margin-top: 3px; }

/* Four steps instead of five */
.sa-pipe.oc-pipe4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* Subtitles */
.oc-chips { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 8px auto 0; padding: 0; max-width: 940px; }
.oc-chips li { padding: 8px 16px; border: 1px solid rgba(240,201,197,.25); border-radius: 999px; font-size: .9rem; color: var(--rose); background: rgba(255,255,255,.03); }
.oc-subsnote { font-size: .9rem; line-height: 1.65; color: var(--rose-faint); margin: 32px auto 0; max-width: 46em; text-align: center; }

/* Slides without captions on a locale page */
.oc-slides--bare { margin-top: 40px; }

/* The buy card at the foot of a locale page */
.oc-buy { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 48px; align-items: center;
  max-width: 1040px; margin: 0 auto; padding: 48px; border-radius: 16px; border: 1px solid rgba(240,201,197,.2); background: rgba(255,255,255,.03); }
.oc-buy::before { content: ''; position: absolute; left: -20%; top: -40%; width: 70%; height: 140%; background: radial-gradient(closest-side, rgba(232,164,158,.14), rgba(232,164,158,0)); pointer-events: none; }
.oc-buy > div { position: relative; min-width: 0; }
.oc-buy-k { font-size: max(12px, .72rem); font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--rose-kick); margin: 0 0 24px; }
.oc-buy-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; margin: 0 0 24px; }
.oc-buy-price b { font-family: 'Cardo', serif; font-weight: 400; font-size: 3.2rem; line-height: 1.05; color: #fff; }
.oc-buy-price em { font-style: normal; font-size: .92rem; color: var(--rose-faint); }
.oc-buy-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.oc-buy-list li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 12px; font-size: .95rem; line-height: 1.55; color: var(--rose-body); }
.oc-buy-list svg { width: 16px; height: 16px; color: var(--rose); margin-top: 4px; }
.oc-buy .sa-btn { width: 100%; min-height: 58px; font-size: .84rem; }
.oc-buy-foot { display: block; text-align: center; margin: 12px 0 0; font-size: .86rem; color: var(--rose-faint); }
.oc-buy-fine { font-size: .88rem; line-height: 1.6; color: var(--rose-body); margin: 24px 0 0; }
.oc-buy-trust { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 18px 0 0; padding: 18px 0 0; border-top: 1px solid rgba(240,201,197,.15); }
.oc-buy-trust span { font-size: .84rem; color: var(--rose-faint); }
html[data-oc="own"] .oc-buyonly { display: none !important; }

@media (max-width: 1100px) { .sa-pipe.oc-pipe4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .oc-buy { grid-template-columns: minmax(0, 1fr); gap: 32px; } }
@media (max-width: 760px) {
  .oc-out { padding-top: 56px; }
  .oc-checklist { grid-template-columns: minmax(0, 1fr); }
  .sa-pipe.oc-pipe4 { grid-template-columns: minmax(0, 1fr); }
  .oc-buy { padding: 32px 20px; }
  .oc-buy-price b { font-size: 2.6rem; }
  .oc-chips li { font-size: .86rem; padding: 7px 13px; }
}

/* ===================================================================================================
   Glossary (index + one page per term)
   =================================================================================================== */
.sa-hx.og-hx { background: radial-gradient(90% 120% at 88% 18%, rgba(102,16,12,.75) 0%, rgba(102,16,12,0) 62%), var(--burg-deep); }
.sa-hx.og-hx::before { display: none; }
.sa-hx.og-hx .sa-hx-h { max-width: 16em; }
.og-under { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; }
.og-crumb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: max(12px, .74rem); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); }
.og-crumb a { color: var(--burg); }
.og-crumb a:hover { text-decoration: underline; }
.og-crumb b { color: var(--ink); font-weight: 700; }
.og-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.og-chips a { display: inline-block; padding: 8px 15px; border: 1px solid var(--burg-line); border-radius: 999px; background: var(--paper); color: var(--burg); font-size: .88rem; line-height: 1.35; transition: border-color .2s ease, background .2s ease; }
.og-chips a:hover { border-color: var(--burg); background: #fff; }
.og-chips__all a { background: var(--burg); border-color: var(--burg); color: var(--cream); }
.og-chips__all a:hover { background: #4d0c09; }
.og-body { padding: 72px 0 96px; }
.og-def { font-family: 'Cardo', serif; font-size: clamp(1.35rem, 2.3vw, 1.75rem); line-height: 1.5; color: var(--body); margin: 0; }
.og-lbl { display: block; font-size: max(12px, .7rem); font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-faint); margin: 0 0 12px; }
.og-formula { margin: 36px 0 0; padding: 22px 24px; background: var(--paper); border: 1px solid var(--ink-line); border-left: 3px solid var(--burg); border-radius: 10px; }
[dir="rtl"] .og-formula { border-left: 1px solid var(--ink-line); border-right: 3px solid var(--burg); }
.og-formula__eq { font-family: 'Cardo', serif; font-size: 1.32rem; line-height: 1.5; color: var(--ink); direction: ltr; unicode-bidi: isolate; overflow-wrap: anywhere; }
[dir="rtl"] .og-formula__eq { text-align: right; }
.og-incourse { margin: 44px 0 0; padding: 28px 0 0; border-top: 1px solid var(--ink-line); }
.og-incourse p { margin: 0; font-size: 1rem; line-height: 1.7; color: var(--body-soft); }
.og-incourse a { color: var(--burg); font-weight: 600; border-bottom: 1px solid var(--burg-line); white-space: nowrap; }
.og-related { margin: 36px 0 0; }
.og-nav { display: flex; justify-content: space-between; gap: 16px 24px; margin: 48px 0 0; padding: 24px 0 0; border-top: 1px solid var(--ink-line); }
.og-nav a { color: var(--burg); font-weight: 600; font-size: .98rem; max-width: 48%; }
.og-nav a:hover { text-decoration: underline; }
.og-nav__n { text-align: right; margin-left: auto; }
[dir="rtl"] .og-nav__n { text-align: left; margin-left: 0; margin-right: auto; }
/* Index */
.og-part { margin: 0 0 72px; scroll-margin-top: 24px; }
.og-part:last-child { margin-bottom: 0; }
.og-sec { font-family: 'Cardo', serif; font-size: 1.3rem; font-weight: 700; color: var(--body); margin: 36px 0 12px; }
.og-list { margin: 0; border-top: 1px solid var(--ink-line); }
.og-list > div { display: grid; grid-template-columns: minmax(0, 15em) minmax(0, 1fr); gap: 6px 32px; padding: 16px 0; border-bottom: 1px solid var(--ink-line); }
.og-list dt a { font-family: 'Cardo', serif; font-weight: 700; font-size: 1.12rem; line-height: 1.35; color: var(--burg); }
.og-list dt a:hover { text-decoration: underline; }
.og-list dd { margin: 0; font-size: .95rem; line-height: 1.65; color: var(--body-soft); }
/* The course card at the foot of every glossary page */
.og-cta { padding: 88px 0; }
.og-promo { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, .65fr); align-items: end; gap: 24px;
  max-width: 1080px; margin: 0 auto; border-radius: 18px; border: 1px solid rgba(240,201,197,.18); background: linear-gradient(135deg, #2c0a07 0%, #1c0503 62%); }
.og-promo__glow { position: absolute; right: -12%; bottom: -35%; width: 62%; height: 130%; background: radial-gradient(closest-side, rgba(232,164,158,.26), rgba(232,164,158,0)); pointer-events: none; }
.og-promo__copy { position: relative; z-index: 1; padding: 48px 0 44px 48px; }
[dir="rtl"] .og-promo__copy { padding: 48px 48px 44px 0; }
.og-promo__h { font-family: 'Cardo', serif; font-size: clamp(1.7rem, 2.8vw, 2.2rem); font-weight: 700; line-height: 1.15; color: #fff; margin: 0 0 12px; text-wrap: pretty; }
.og-promo__by { font-size: .95rem; line-height: 1.6; color: var(--rose-body); margin: 0 0 24px; max-width: 40em; }
.og-promo__facts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 24px; }
.og-promo__facts li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 10px; font-size: .93rem; line-height: 1.5; color: var(--rose-body); }
.og-promo__facts svg { width: 16px; height: 16px; color: var(--rose); margin-top: 3px; }
.og-promo__row { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; margin: 30px 0 0; }
.og-promo__price { font-size: .9rem; color: var(--rose-faint); }
.og-promo__logos { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 32px; margin: 30px 0 0; padding: 22px 0 0; border-top: 1px solid rgba(240,201,197,.15); }
.og-promo__logos img { height: 20px; width: auto; opacity: .72; filter: grayscale(1) brightness(1.8); }
.og-promo__logos img.og-l-maven { height: 22px; }
.og-promo__pic { position: relative; z-index: 1; display: block; align-self: end; }
.og-promo__pic img { display: block; width: 100%; max-width: 340px; height: auto; margin: 0 0 0 auto; }
[dir="rtl"] .og-promo__pic img { margin: 0 auto 0 0; }
.og-promo__pic::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 34%; background: linear-gradient(180deg, rgba(28,5,3,0) 0%, rgba(28,5,3,.88) 100%); pointer-events: none; }
.og-promo__mark { position: absolute; left: 18px; bottom: 18px; z-index: 1; }
.og-promo__mark img { height: 22px; width: auto; }
.og-fine { text-align: center; font-size: .82rem; line-height: 1.6; color: var(--rose-faint); margin: 28px auto 0; max-width: 46em; }
@media (max-width: 900px) {
  .og-promo { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .og-promo__copy, [dir="rtl"] .og-promo__copy { padding: 36px 28px 8px; }
  .og-promo__pic img, [dir="rtl"] .og-promo__pic img { max-width: 280px; margin: 0 auto; }
  .og-promo__pic { margin-top: 24px; }
}
@media (max-width: 760px) {
  .og-body { padding: 48px 0 64px; }
  .og-under { flex-direction: column; align-items: flex-start; }
  .og-list > div { grid-template-columns: minmax(0, 1fr); }
  .og-promo__facts { grid-template-columns: minmax(0, 1fr); }
  .og-promo__copy, [dir="rtl"] .og-promo__copy { padding: 32px 20px 8px; }
  .og-cta { padding: 64px 0; }
  .og-nav { flex-direction: column; }
  .og-nav a { max-width: none; }
  .og-nav__n, [dir="rtl"] .og-nav__n { margin: 0; }
}