/* Btaa Tarjama — Start Here V3
   Goal-first decision funnel. Scoped to .start-here-page/.sh3-* only. */

body.start-here-page {
    --sh3-navy:#071321;
    --sh3-navy-2:#0b1b2c;
    --sh3-ink:#101827;
    --sh3-muted:#667085;
    --sh3-gold:#e4aa35;
    --sh3-gold-2:#f2bd4e;
    --sh3-paper:#fbfaf7;
    --sh3-cream:#f2eadc;
    --sh3-line:rgba(16,24,39,.11);
    --sh3-line-dark:rgba(255,255,255,.12);
    --sh3-shadow:0 24px 70px rgba(7,19,33,.09);
    --sh3-ease:cubic-bezier(.22,.8,.24,1);
    background:var(--sh3-paper)!important;
}

body.start-here-page .sh3-main { overflow:hidden; }
body.start-here-page .sh3-main * { box-sizing:border-box; }
body.start-here-page .sh3-main h1,
body.start-here-page .sh3-main h2,
body.start-here-page .sh3-main h3 { font-family:"Readex Pro","IBM Plex Sans Arabic",sans-serif; }
body.start-here-page .sh3-main p { font-family:"IBM Plex Sans Arabic",sans-serif; }

/* HERO */
body.start-here-page .sh3-hero {
    position:relative;
    overflow:hidden;
    padding:72px 0 68px;
    color:#fff;
    background:
        radial-gradient(circle at 18% 18%,rgba(228,170,53,.12),transparent 25%),
        radial-gradient(circle at 74% 84%,rgba(51,88,126,.20),transparent 30%),
        linear-gradient(135deg,#06111d 0%,#081725 54%,#0a1b2d 100%);
}
body.start-here-page .sh3-hero::after {
    content:"";
    position:absolute;
    inset:auto 0 0;
    height:1px;
    background:linear-gradient(90deg,transparent,rgba(228,170,53,.6),transparent);
}
body.start-here-page .sh3-hero-grid {
    min-height:430px;
    display:grid;
    grid-template-columns:minmax(0,1.03fr) minmax(430px,.97fr);
    gap:clamp(52px,7vw,96px);
    align-items:center;
}
body.start-here-page .sh3-hero-copy { max-width:620px; position:relative; z-index:3; }
body.start-here-page .sh3-breadcrumbs {
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:20px;
    color:rgba(255,255,255,.55);
    font-size:.82rem;
}
body.start-here-page .sh3-breadcrumbs a { color:rgba(255,255,255,.78); }
body.start-here-page .sh3-kicker {
    display:inline-flex;
    align-items:center;
    gap:10px;
    color:var(--sh3-gold-2);
    font-size:.78rem;
    font-weight:700;
}
body.start-here-page .sh3-kicker::before {
    content:"";
    width:30px;
    height:1px;
    background:currentColor;
    opacity:.75;
}
body.start-here-page .sh3-kicker-dark { color:#b97d16; }
body.start-here-page .sh3-hero h1 {
    margin:16px 0 18px;
    max-width:610px;
    font-size:clamp(3.15rem,5.1vw,5.6rem);
    line-height:1.08;
    letter-spacing:-.055em;
    color:#fff;
}
body.start-here-page .sh3-hero h1 span { color:var(--sh3-gold-2); }
body.start-here-page .sh3-hero-copy>p {
    max-width:560px;
    margin:0;
    color:rgba(255,255,255,.68);
    font-size:1.03rem;
    line-height:1.95;
}
body.start-here-page .sh3-hero-actions {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:18px;
    margin-top:28px;
}
body.start-here-page .sh3-text-link {
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:rgba(255,255,255,.82);
    font-weight:700;
    font-size:.92rem;
}
body.start-here-page .sh3-text-link svg,
body.start-here-page .sh3-goal-arrow svg,
body.start-here-page .sh3-route-cta svg,
body.start-here-page .sh3-live-link svg,
body.start-here-page .sh3-live-empty a svg { width:17px; height:17px; }

body.start-here-page .sh3-hero-route {
    position:relative;
    min-height:420px;
    isolation:isolate;
}
body.start-here-page .sh3-route-orbit {
    position:absolute;
    width:420px;
    height:420px;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    border:1px solid rgba(255,255,255,.055);
    border-radius:50%;
    box-shadow:inset 0 0 0 64px rgba(255,255,255,.012), inset 0 0 0 128px rgba(255,255,255,.008);
}
body.start-here-page .sh3-route-line {
    position:absolute;
    inset:70px 64px 78px 60px;
    border-radius:48% 52% 54% 46% / 54% 42% 58% 46%;
    border:1px solid rgba(228,170,53,.28);
    transform:rotate(-9deg);
}
body.start-here-page .sh3-route-line::after {
    content:"";
    position:absolute;
    width:8px;
    height:8px;
    border-radius:50%;
    background:var(--sh3-gold-2);
    box-shadow:0 0 0 7px rgba(242,189,78,.09),0 0 34px rgba(242,189,78,.38);
    left:18%;
    top:11%;
}
body.start-here-page .sh3-route-node {
    position:absolute;
    display:grid;
    gap:2px;
    min-width:190px;
    padding:12px 0;
}
body.start-here-page .sh3-route-node span { color:var(--sh3-gold-2); font-size:.68rem; font-weight:700; }
body.start-here-page .sh3-route-node strong { color:#fff; font-size:clamp(1.65rem,2.2vw,2.45rem); line-height:1.15; }
body.start-here-page .sh3-route-node small { color:rgba(255,255,255,.52); font-size:.78rem; }
body.start-here-page .sh3-route-node-1 { top:58px; right:34px; }
body.start-here-page .sh3-route-node-2 { top:166px; left:72px; }
body.start-here-page .sh3-route-node-3 { bottom:60px; right:84px; }
body.start-here-page .sh3-route-note {
    position:absolute;
    left:34px;
    bottom:8px;
    max-width:240px;
    margin:0;
    color:rgba(255,255,255,.42);
    font-size:.72rem;
    line-height:1.7;
}

/* SHARED SECTION HEAD */
body.start-here-page .sh3-section-head {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:34px;
    margin-bottom:34px;
}
body.start-here-page .sh3-section-head>div { max-width:720px; }
body.start-here-page .sh3-section-head h2 {
    margin:8px 0 0;
    color:var(--sh3-ink);
    font-size:clamp(2.25rem,3.5vw,3.65rem);
    line-height:1.18;
    letter-spacing:-.045em;
}
body.start-here-page .sh3-section-head>p {
    max-width:390px;
    margin:0;
    color:var(--sh3-muted);
    line-height:1.85;
    font-size:.96rem;
}
body.start-here-page .sh3-section-head-light h2 { color:#fff; }
body.start-here-page .sh3-section-head-light>p { color:rgba(255,255,255,.58); }

/* GOALS */
body.start-here-page .sh3-goals { padding:88px 0 94px; background:var(--sh3-paper); }
body.start-here-page .sh3-goal-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
}
body.start-here-page .sh3-goal-card {
    appearance:none;
    position:relative;
    min-height:208px;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:space-between;
    gap:24px;
    padding:24px;
    text-align:right;
    border:1px solid var(--sh3-line);
    border-radius:18px;
    background:#fff;
    color:var(--sh3-ink);
    cursor:pointer;
    overflow:hidden;
    transition:transform .32s var(--sh3-ease),border-color .32s var(--sh3-ease),box-shadow .32s var(--sh3-ease),background .32s var(--sh3-ease);
}
body.start-here-page .sh3-goal-card::after {
    content:"";
    position:absolute;
    inset:auto -28px -45px auto;
    width:120px;
    height:120px;
    border:1px solid rgba(228,170,53,.16);
    border-radius:50%;
    transition:transform .4s var(--sh3-ease),opacity .4s var(--sh3-ease);
}
body.start-here-page .sh3-goal-card:hover { transform:translateY(-4px); border-color:rgba(228,170,53,.34); box-shadow:0 16px 44px rgba(7,19,33,.07); }
body.start-here-page .sh3-goal-card.is-active {
    color:#fff;
    border-color:rgba(255,255,255,.08);
    background:linear-gradient(145deg,#09182a,#102640);
    box-shadow:0 22px 54px rgba(7,19,33,.18);
}
body.start-here-page .sh3-goal-card.is-active::after { transform:scale(1.3); opacity:.55; }
body.start-here-page .sh3-goal-number { color:#b88222; font-size:.7rem; font-weight:700; }
body.start-here-page .sh3-goal-card.is-active .sh3-goal-number { color:var(--sh3-gold-2); }
body.start-here-page .sh3-goal-card h3 { margin:0 0 8px; font-size:1.38rem; line-height:1.35; }
body.start-here-page .sh3-goal-card p { margin:0; color:var(--sh3-muted); font-size:.9rem; line-height:1.8; }
body.start-here-page .sh3-goal-card.is-active p { color:rgba(255,255,255,.64); }
body.start-here-page .sh3-goal-arrow {
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border:1px solid var(--sh3-line);
    border-radius:50%;
    color:#8c641d;
}
body.start-here-page .sh3-goal-card.is-active .sh3-goal-arrow { border-color:rgba(255,255,255,.14); color:var(--sh3-gold-2); }

body.start-here-page .sh3-route-result {
    margin-top:20px;
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
    gap:48px;
    align-items:center;
    padding:34px 38px;
    border:1px solid rgba(7,19,33,.09);
    border-radius:20px;
    background:var(--sh3-cream);
}
body.start-here-page .sh3-result-label { color:#9e6a13; font-size:.72rem; font-weight:700; }
body.start-here-page .sh3-route-result h3 { margin:8px 0 8px; font-size:clamp(1.6rem,2.2vw,2.25rem); line-height:1.35; color:var(--sh3-ink); }
body.start-here-page .sh3-route-result-copy>p { max-width:640px; margin:0 0 18px; color:var(--sh3-muted); line-height:1.85; }
body.start-here-page .sh3-route-cta { display:inline-flex; align-items:center; gap:8px; color:#8e6217; font-weight:700; }
body.start-here-page .sh3-route-steps { display:grid; gap:0; border-top:1px solid rgba(7,19,33,.11); }
body.start-here-page .sh3-route-step { display:grid; grid-template-columns:46px 1fr; align-items:center; gap:12px; min-height:58px; border-bottom:1px solid rgba(7,19,33,.11); }
body.start-here-page .sh3-route-step span { color:#ad7618; font-size:.68rem; }
body.start-here-page .sh3-route-step strong { color:var(--sh3-ink); font-size:.95rem; }
body.start-here-page .sh3-route-result.is-switching .sh3-route-result-copy,
body.start-here-page .sh3-route-result.is-switching .sh3-route-steps { opacity:.18; transform:translateY(5px); }
body.start-here-page .sh3-route-result-copy,
body.start-here-page .sh3-route-steps { transition:opacity .2s ease,transform .2s ease; }

/* AVAILABLE NOW */
body.start-here-page .sh3-live {
    padding:92px 0;
    background:
        radial-gradient(circle at 10% 10%,rgba(228,170,53,.08),transparent 22%),
        var(--sh3-navy);
    color:#fff;
}
body.start-here-page .sh3-live-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
body.start-here-page .sh3-live-count-1 { grid-template-columns:minmax(0,620px); }
body.start-here-page .sh3-live-count-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
body.start-here-page .sh3-live-count-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
body.start-here-page .sh3-live-card {
    display:flex;
    flex-direction:column;
    min-height:320px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.10);
    border-radius:18px;
    background:rgba(255,255,255,.035);
    color:#fff;
    transition:transform .32s var(--sh3-ease),background .32s var(--sh3-ease),border-color .32s var(--sh3-ease);
}
body.start-here-page .sh3-live-card:hover { transform:translateY(-5px); background:rgba(255,255,255,.055); border-color:rgba(228,170,53,.26); }
body.start-here-page .sh3-live-media { aspect-ratio:16/9; background:#040a11; overflow:hidden; }
body.start-here-page .sh3-live-media img { width:100%; height:100%; object-fit:cover; display:block; }
body.start-here-page .sh3-live-body { padding:22px; display:flex; flex:1; flex-direction:column; }
body.start-here-page .sh3-live-topline { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; color:var(--sh3-gold-2); font-size:.72rem; font-weight:700; }
body.start-here-page .sh3-live-topline small { color:rgba(255,255,255,.42); font-size:.69rem; font-weight:500; }
body.start-here-page .sh3-live-card h3 { margin:0 0 9px; color:#fff; font-size:1.22rem; line-height:1.48; }
body.start-here-page .sh3-live-card p { margin:0; color:rgba(255,255,255,.56); font-size:.87rem; line-height:1.75; }
body.start-here-page .sh3-live-link { margin-top:auto; padding-top:22px; display:inline-flex; align-items:center; gap:8px; color:#fff; font-size:.83rem; font-weight:700; }
body.start-here-page .sh3-live-course::before,
body.start-here-page .sh3-live-job::before {
    content:"";
    height:4px;
    display:block;
    background:linear-gradient(90deg,var(--sh3-gold),rgba(228,170,53,.08));
}
body.start-here-page .sh3-live-empty {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:34px;
    padding:30px 34px;
    border:1px solid rgba(255,255,255,.1);
    border-radius:18px;
    background:rgba(255,255,255,.035);
}
body.start-here-page .sh3-live-empty strong { display:block; margin-bottom:5px; font-size:1.3rem; color:#fff; }
body.start-here-page .sh3-live-empty p { margin:0; color:rgba(255,255,255,.55); }
body.start-here-page .sh3-live-empty nav { display:flex; flex-wrap:wrap; gap:10px; }
body.start-here-page .sh3-live-empty a { display:inline-flex; gap:7px; align-items:center; padding:10px 13px; border:1px solid rgba(255,255,255,.12); border-radius:999px; color:#fff; font-size:.82rem; }

/* JOURNEY */
body.start-here-page .sh3-method { padding:92px 0 96px; background:var(--sh3-cream); }
body.start-here-page .sh3-journey { position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:12px; }
body.start-here-page .sh3-journey-line { position:absolute; top:24px; right:9%; left:9%; height:1px; background:linear-gradient(90deg,rgba(7,19,33,.08),rgba(228,170,53,.55),rgba(7,19,33,.08)); }
body.start-here-page .sh3-journey-step { position:relative; padding:60px 24px 12px; }
body.start-here-page .sh3-journey-step::before { content:""; position:absolute; top:18px; right:24px; width:13px; height:13px; border-radius:50%; background:var(--sh3-paper); border:3px solid var(--sh3-gold); box-shadow:0 0 0 6px rgba(228,170,53,.10); z-index:2; }
body.start-here-page .sh3-journey-step span { color:#a56f15; font-size:.68rem; font-weight:700; }
body.start-here-page .sh3-journey-step h3 { margin:6px 0 7px; font-size:1.32rem; color:var(--sh3-ink); }
body.start-here-page .sh3-journey-step p { margin:0; color:var(--sh3-muted); font-size:.87rem; line-height:1.75; }

/* FINAL */
body.start-here-page .sh3-final { padding:72px 0; background:var(--sh3-paper); }
body.start-here-page .sh3-final-inner {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:40px;
    padding:34px 38px;
    border-radius:20px;
    color:#fff;
    background:linear-gradient(135deg,#071321,#10243a);
    box-shadow:var(--sh3-shadow);
}
body.start-here-page .sh3-final h2 { max-width:700px; margin:8px 0 0; font-size:clamp(1.8rem,2.7vw,2.8rem); line-height:1.3; color:#fff; }
body.start-here-page .sh3-final-actions { display:flex; align-items:center; gap:16px; flex-shrink:0; }
body.start-here-page .sh3-text-link-light { color:#fff; }

/* REVEAL */
body.start-here-page [data-sh3-reveal] { opacity:0; transform:translateY(18px); transition:opacity .62s var(--sh3-ease),transform .62s var(--sh3-ease); }
body.start-here-page [data-sh3-reveal].is-visible { opacity:1; transform:none; }

@media (max-width: 1020px) {
    body.start-here-page .sh3-hero-grid { grid-template-columns:1fr 390px; gap:36px; }
    body.start-here-page .sh3-hero h1 { font-size:clamp(3rem,6vw,4.6rem); }
    body.start-here-page .sh3-goal-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    body.start-here-page .sh3-route-result { grid-template-columns:1fr; gap:28px; }
    body.start-here-page .sh3-live-grid,
    body.start-here-page .sh3-live-count-3,
    body.start-here-page .sh3-live-count-4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width: 820px) {
    body.start-here-page .sh3-hero { padding:52px 0 48px; }
    body.start-here-page .sh3-hero-grid { min-height:0; grid-template-columns:1fr; gap:30px; }
    body.start-here-page .sh3-hero-copy { max-width:none; }
    body.start-here-page .sh3-hero h1 { font-size:clamp(2.65rem,10vw,4rem); }
    body.start-here-page .sh3-hero-route { min-height:300px; }
    body.start-here-page .sh3-route-orbit { width:300px; height:300px; }
    body.start-here-page .sh3-route-line { inset:50px 52px 54px 44px; }
    body.start-here-page .sh3-route-node-1 { top:34px; right:6%; }
    body.start-here-page .sh3-route-node-2 { top:118px; left:9%; }
    body.start-here-page .sh3-route-node-3 { bottom:34px; right:18%; }
    body.start-here-page .sh3-route-note { left:4%; bottom:0; }

    body.start-here-page .sh3-section-head { align-items:flex-start; flex-direction:column; gap:12px; margin-bottom:26px; }
    body.start-here-page .sh3-section-head>p { max-width:600px; }
    body.start-here-page .sh3-goals,
    body.start-here-page .sh3-live,
    body.start-here-page .sh3-method { padding:68px 0; }
    body.start-here-page .sh3-final { padding:58px 0; }

    body.start-here-page .sh3-journey { grid-template-columns:1fr; padding-right:22px; }
    body.start-here-page .sh3-journey-line { top:18px; bottom:18px; right:6px; left:auto; width:1px; height:auto; background:linear-gradient(180deg,rgba(7,19,33,.08),rgba(228,170,53,.55),rgba(7,19,33,.08)); }
    body.start-here-page .sh3-journey-step { padding:12px 30px 24px 0; }
    body.start-here-page .sh3-journey-step::before { top:18px; right:-22px; }
    body.start-here-page .sh3-final-inner { align-items:flex-start; flex-direction:column; padding:28px; }
}

@media (max-width: 560px) {
    body.start-here-page .sh3-breadcrumbs { margin-bottom:14px; }
    body.start-here-page .sh3-hero h1 { margin:12px 0 14px; font-size:clamp(2.35rem,11.7vw,3.25rem); line-height:1.12; }
    body.start-here-page .sh3-hero-copy>p { font-size:.96rem; line-height:1.85; }
    body.start-here-page .sh3-hero-actions { margin-top:22px; gap:12px; }
    body.start-here-page .sh3-hero-route { min-height:260px; }
    body.start-here-page .sh3-route-orbit { width:250px; height:250px; }
    body.start-here-page .sh3-route-line { inset:42px 40px 48px 34px; }
    body.start-here-page .sh3-route-node { min-width:140px; padding:8px 0; }
    body.start-here-page .sh3-route-node strong { font-size:1.45rem; }
    body.start-here-page .sh3-route-node small { font-size:.7rem; }
    body.start-here-page .sh3-route-node-1 { top:24px; right:2%; }
    body.start-here-page .sh3-route-node-2 { top:104px; left:2%; }
    body.start-here-page .sh3-route-node-3 { bottom:34px; right:12%; }
    body.start-here-page .sh3-route-note { display:none; }

    body.start-here-page .sh3-section-head h2 { font-size:clamp(1.95rem,9vw,2.55rem); }
    body.start-here-page .sh3-goal-grid { grid-template-columns:1fr; gap:10px; }
    body.start-here-page .sh3-goal-card { min-height:0; padding:20px; gap:18px; }
    body.start-here-page .sh3-goal-card h3 { font-size:1.2rem; }
    body.start-here-page .sh3-goal-card p { font-size:.86rem; }
    body.start-here-page .sh3-route-result { margin-top:14px; padding:24px 20px; border-radius:16px; }
    body.start-here-page .sh3-route-result h3 { font-size:1.45rem; }
    body.start-here-page .sh3-route-step { min-height:52px; }

    body.start-here-page .sh3-live-grid,
    body.start-here-page .sh3-live-count-2,
    body.start-here-page .sh3-live-count-3,
    body.start-here-page .sh3-live-count-4 { grid-template-columns:1fr; }
    body.start-here-page .sh3-live-card { min-height:0; }
    body.start-here-page .sh3-live-empty { align-items:flex-start; flex-direction:column; padding:22px; }
    body.start-here-page .sh3-live-empty nav { display:grid; grid-template-columns:1fr 1fr; width:100%; }
    body.start-here-page .sh3-live-empty a { justify-content:space-between; }

    body.start-here-page .sh3-final-actions { width:100%; align-items:flex-start; flex-direction:column; }
    body.start-here-page .sh3-final-actions .btn { width:100%; justify-content:center; }
}

@media (prefers-reduced-motion: reduce) {
    body.start-here-page [data-sh3-reveal],
    body.start-here-page .sh3-goal-card,
    body.start-here-page .sh3-route-result-copy,
    body.start-here-page .sh3-route-steps,
    body.start-here-page .sh3-live-card { transition:none!important; transform:none!important; opacity:1!important; }
}