@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Libre+Franklin:ital,wght@0,300;0,400;0,500;1,300;1,400&display=swap');

*{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;scroll-behavior:smooth}
body{background:#fcfcfc;color:#111827;font-family:'Libre Franklin',sans-serif;font-size:16px;line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased}

/* ── TIMER BAR ── */
#timer-bar{display:none;position:fixed;top:0;left:0;right:0;height:68px;background:linear-gradient(180deg,rgba(252,252,252,0.98),rgba(252,252,252,0.94));border-bottom:1.5px solid rgba(16,57,72,0.18);box-shadow:0 8px 20px rgba(16,57,72,0.12);align-items:center;justify-content:space-between;padding:0 18px;z-index:300;backdrop-filter:blur(10px)}
#timer-bar.on{display:flex}
body.timer-on #app{padding-top:68px}
.t-left{display:flex;align-items:center;gap:12px}
.t-pip{width:10px;height:10px;border-radius:50%;background:#e8a44a;animation:pip 1.8s infinite;flex-shrink:0}
@keyframes pip{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.82)}}
#t-digits{font-family:'Outfit',sans-serif;font-size:22px;font-weight:800;color:#103948;letter-spacing:.1em}
.t-cta{background:linear-gradient(135deg,#103948,#1a5c75);color:#fff;border:1px solid rgba(232,164,74,0.45);border-radius:12px;font-size:15px;font-weight:700;padding:12px 18px;cursor:pointer;font-family:'Outfit',sans-serif;letter-spacing:.02em;white-space:nowrap;box-shadow:0 6px 18px rgba(16,57,72,0.26);animation:ctaPulse 1.4s ease-in-out infinite;position:relative;overflow:hidden}
.t-cta::after{content:'';position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.28),transparent);animation:timerShine 2.2s ease-in-out infinite}
.t-cta:hover{background:linear-gradient(135deg,#0d2f3a,#154d61)}
@keyframes ctaPulse{0%,100%{transform:scale(1);box-shadow:0 6px 18px rgba(16,57,72,0.26)}50%{transform:scale(1.07);box-shadow:0 14px 36px rgba(232,164,74,0.55),0 0 0 5px rgba(232,164,74,0.18)}}
@keyframes timerShine{0%{left:-120%}60%,100%{left:160%}}

/* ── LAYOUT ── */
#app{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:0 20px 100px}
.screen{display:none;width:100%;max-width:540px;flex-direction:column;animation:fu .32s cubic-bezier(.4,0,.2,1) both}
.screen.active{display:flex}
@keyframes fu{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}

/* ── LOGO ── */
.logo-wrap{width:100%;max-width:540px;padding:10px 0 8px;display:flex;align-items:center;justify-content:center;position:relative;margin-bottom:8px;border-bottom:1px solid rgba(0,0,0,0.07)}
.logo-img{height:130px;width:auto;max-width:460px;object-fit:contain;object-position:center}
#back-btn{display:none;align-items:center;justify-content:center;width:34px;height:34px;border:none;background:transparent;font-size:23px;line-height:1;color:#1a5c75;cursor:pointer;border-radius:50%;transition:background .15s,color .15s,transform .12s;flex-shrink:0;position:absolute;left:0;top:50%;transform:translateY(-50%);font-family:'Outfit',sans-serif;-webkit-tap-highlight-color:transparent}
#back-btn:hover{background:rgba(16,57,72,0.08);color:#103948}
#back-btn:active{background:rgba(16,57,72,0.14);color:#0d2f3a;transform:translateY(-50%) scale(.97)}
.logo-spacer{display:none}

/* ── PROGRESS ── */
#prog-wrap{display:none;width:100%;max-width:540px;padding:10px 0 0;margin-bottom:18px}
#prog-count{font-family:'Outfit',sans-serif;font-size:12px;font-weight:500;color:#9ca3af;text-align:right;margin-bottom:6px;letter-spacing:.02em}
#prog-track{height:2px;background:rgba(0,0,0,0.08);border-radius:99px;overflow:hidden}
#prog-fill{height:100%;background:linear-gradient(90deg,#103948,#1a5c75);border-radius:99px;width:0%;transition:width .5s cubic-bezier(.4,0,.2,1)}
body.q-progress .logo-wrap{border-bottom:none;margin-bottom:2px;padding-bottom:0}
body.q-progress #prog-wrap{padding-top:0;margin-bottom:14px}

/* ── LABELS ── */
.lbl{font-family:'Outfit',sans-serif;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(232,164,74,0.85);margin-bottom:10px}

/* ── HEADINGS ── */
.h1{font-family:'Outfit',sans-serif;font-weight:700;font-size:clamp(26px,5vw,36px);line-height:1.2;color:#111827;margin-bottom:14px;letter-spacing:-.02em}
.h1 em{font-style:normal;color:#e8a44a}
.sub{font-family:'Libre Franklin',sans-serif;font-size:17px;color:#4b5563;margin-bottom:26px;line-height:1.75}
.sub .hl{color:#1f2937;font-style:italic}
.sub .ha{color:#e8a44a;font-weight:500}

/* ── CHOICE BUTTONS ── */
.choices{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}
.cb{display:flex;align-items:center;gap:14px;padding:16px 18px;background:#ffffff;border:1.5px solid rgba(0,0,0,0.1);border-radius:12px;color:#374151;font-family:'Libre Franklin',sans-serif;font-size:15px;cursor:pointer;transition:border-color .2s,background .2s,color .2s;text-align:left;width:100%;line-height:1.5}
.cb:hover{border-color:rgba(16,57,72,0.3);background:rgba(16,57,72,0.03);color:#111827}
.cb.sel{border-color:#103948;background:rgba(16,57,72,0.05);color:#111827}
.cb .dot{width:18px;height:18px;border-radius:50%;border:1.5px solid rgba(0,0,0,0.2);flex-shrink:0;transition:.2s;display:flex;align-items:center;justify-content:center}
.cb.sel .dot{background:#103948;border-color:#103948}
.cb.sel .dot::after{content:'';width:5px;height:5px;background:#fcfcfc;border-radius:50%}
.cb.multi .dot{border-radius:4px}

/* ── GENDER GRID ── */
.gg{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:22px}
.gb{padding:30px 16px;background:#ffffff;border:1.5px solid rgba(0,0,0,0.1);border-radius:14px;color:#374151;font-family:'Outfit',sans-serif;font-weight:600;font-size:16px;cursor:pointer;transition:.2s;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}
.gb:hover{border-color:rgba(16,57,72,0.3);color:#111827;background:rgba(16,57,72,0.03)}
.gi{font-size:30px}

/* ── SCALE ── */
.sc-wrap{margin-bottom:24px}
.sc-labels{display:flex;justify-content:space-between;font-size:14px;color:#6b7280;margin-bottom:12px;letter-spacing:.02em;font-family:'Outfit',sans-serif;font-weight:500}
.sc-btns{display:flex;gap:8px}
.sc-btn{flex:1;aspect-ratio:1;border:1.5px solid rgba(0,0,0,0.1);background:#ffffff;border-radius:12px;color:#6b7280;font-family:'Outfit',sans-serif;font-weight:600;font-size:16px;cursor:pointer;transition:.2s;display:flex;align-items:center;justify-content:center}
.sc-btn:hover{border-color:rgba(16,57,72,0.3);color:#111827;background:rgba(16,57,72,0.03)}
.sc-btn.sel{border-color:#103948;background:rgba(16,57,72,0.07);color:#103948}

/* ── INPUTS ── */
.inp{width:100%;padding:15px 18px;background:#ffffff;border:1.5px solid rgba(0,0,0,0.1);border-radius:12px;color:#111827;font-family:'Libre Franklin',sans-serif;font-size:16px;outline:none;transition:.2s;margin-bottom:14px}
.inp:focus{border-color:#103948;background:#fff}
.inp::placeholder{color:rgba(0,0,0,0.3)}

/* ── BUTTONS ── */
.btn{display:block;width:100%;padding:16px 24px;background:linear-gradient(135deg,#103948 0%,#1a5c75 100%);color:#ffffff;border:none;border-radius:12px;font-family:'Outfit',sans-serif;font-weight:700;font-size:16px;letter-spacing:.01em;cursor:pointer;transition:opacity .2s;text-align:center;margin-top:10px}
.btn:hover{opacity:.88}
#ssales .btn,#pp .btn{position:relative;overflow:hidden;animation:btnShake 7s ease-in-out 3s infinite}
#ssales .btn::after,#pp .btn::after{content:'';position:absolute;top:0;left:-120%;width:55%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.22),transparent);animation:btnShine 3s ease-in-out infinite}
@keyframes btnShine{0%{left:-120%}55%,100%{left:160%}}
@keyframes btnShake{0%,88%,100%{transform:translateX(0)}90%,94%{transform:translateX(-3px)}92%,96%{transform:translateX(3px)}}
.btn-outline{display:block;width:100%;padding:14px 24px;background:transparent;color:rgba(0,0,0,0.4);border:1.5px solid rgba(0,0,0,0.1);border-radius:12px;font-family:'Libre Franklin',sans-serif;font-size:14px;cursor:pointer;transition:.2s;text-align:center;margin-top:10px}
.btn-outline:hover{border-color:rgba(0,0,0,0.25);color:rgba(0,0,0,0.65)}
.btn-navy{background:rgba(0,0,0,0.05);color:#111827;border:1.5px solid rgba(0,0,0,0.1)}
.btn-navy:hover{background:rgba(0,0,0,0.08);opacity:1}

/* ── DIVIDER ── */
.div{border:none;border-top:1px solid rgba(0,0,0,0.07);margin:28px 0}

/* ── QUOTE BLOCK ── */
.qb{border-left:3px solid rgba(232,164,74,0.5);padding:16px 20px;background:rgba(232,164,74,0.05);border-radius:0 12px 12px 0;margin:20px 0;font-family:'Libre Franklin',sans-serif;font-style:italic;font-size:16px;color:#374151;line-height:1.75}
.qb strong{color:#111827;font-style:normal;font-weight:600}
.qa{font-family:'Outfit',sans-serif;font-style:normal;font-size:11px;font-weight:600;color:rgba(232,164,74,0.8);margin-top:12px;letter-spacing:.12em;text-transform:uppercase}

/* ── STAT CARD ── */
.stat-card{background:#ffffff;border:1.5px solid rgba(0,0,0,0.08);border-radius:14px;padding:24px;margin-bottom:18px}
.stat-num{font-family:'Outfit',sans-serif;font-weight:700;font-size:56px;color:#103948;line-height:1;margin-bottom:6px;letter-spacing:-.02em}
.stat-sub{font-size:18px;color:#374151;margin-bottom:18px;line-height:1.5;font-weight:400}
.stat-div{border:none;border-top:1px solid rgba(0,0,0,0.07);margin-bottom:16px}
.stars{color:#e8a44a;font-size:13px;margin-bottom:8px;letter-spacing:.04em}
.rt{font-family:'Libre Franklin',sans-serif;font-style:italic;font-size:17px;color:#374151;line-height:1.75}
.ra{font-size:13px;color:#6b7280;font-style:normal;font-family:'Outfit',sans-serif;font-weight:500;margin-top:10px;letter-spacing:.06em;text-transform:uppercase}
.ra-row{display:flex;align-items:center;gap:11px;margin-top:10px}
.ra-row .ra{margin-top:0}
.ra-pfp{width:56px;height:56px;border-radius:50%;object-fit:cover;border:1px solid rgba(0,0,0,0.08);flex-shrink:0}
.s7-stat{font-family:'Outfit',sans-serif;font-weight:700;font-size:28px;line-height:1.2;color:#103948;letter-spacing:-.02em;margin-bottom:10px;text-align:center}
.s7-copy{font-family:'Libre Franklin',sans-serif;font-size:16px;line-height:1.65;color:#4b5563;margin-bottom:16px;text-align:center}
.jam-card{background:#f5f5f6;border:1px solid rgba(0,0,0,0.08);border-radius:18px;overflow:hidden}
.jam-media{position:relative;aspect-ratio:16/10;overflow:hidden}
.jam-media-img{display:block;width:100%;height:100%;object-fit:cover}
.jam-media-overlay{position:absolute;left:0;right:0;bottom:0;padding:14px 16px;background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,0.78) 80%);display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:8px}
.jam-stars{font-size:17px;letter-spacing:.08em;color:#ffb84d;font-family:'Outfit',sans-serif;font-weight:700;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,0.4)}
.jam-name{font-family:'Outfit',sans-serif;font-size:13px;font-weight:600;color:rgba(255,255,255,0.97);letter-spacing:.02em;text-transform:none;text-align:left;line-height:1.35;max-width:100%;text-shadow:0 1px 2px rgba(0,0,0,0.45)}
.jam-verify{font-family:'Outfit',sans-serif;font-size:10px;font-weight:600;color:rgba(255,255,255,0.82);letter-spacing:.12em;text-transform:uppercase;line-height:1}
.jam-quote{padding:16px 18px 18px;font-family:'Libre Franklin',sans-serif;font-size:16px;line-height:1.7;color:#111827}

/* ── LOADER ── */
.lt{height:2px;background:rgba(0,0,0,0.07);border-radius:99px;overflow:hidden;margin:22px 0 26px}
.lf{height:100%;background:#e8a44a;border-radius:99px;width:0%;transition:width .4s cubic-bezier(.4,0,.2,1)}
.ls-list{list-style:none}
.ls{display:flex;align-items:center;gap:12px;padding:10px 0;font-size:14px;color:rgba(0,0,0,0.2);border-bottom:1px solid rgba(0,0,0,0.05);transition:color .3s;font-family:'Libre Franklin',sans-serif}
.ls.done{color:#4b5563}
.ls .sd2{width:7px;height:7px;border-radius:50%;background:rgba(0,0,0,0.1);flex-shrink:0;transition:background .3s}
.ls.done .sd2{background:#103948}

/* ── RESULTS ── */
.type-badge{display:block;width:100%;background:linear-gradient(135deg,rgba(16,57,72,0.08),rgba(16,57,72,0.04));border:2px solid rgba(16,57,72,0.22);color:#103948;font-family:'Outfit',sans-serif;font-weight:800;font-size:22px;letter-spacing:.1em;text-transform:uppercase;padding:18px 22px;border-radius:16px 16px 0 0;margin-bottom:0;text-align:center;line-height:1.2}
.type-identity{font-family:'Libre Franklin',sans-serif;font-size:13px;font-style:italic;color:#6b7280;text-align:center;padding:8px 18px 16px;background:linear-gradient(135deg,rgba(16,57,72,0.05),rgba(16,57,72,0.02));border:2px solid rgba(16,57,72,0.22);border-top:none;border-radius:0 0 16px 16px;margin-bottom:20px;line-height:1.5}
.sw{display:flex;justify-content:center;margin:22px 0 18px}
.sr{position:relative;width:130px;height:130px}
.sr svg{width:130px;height:130px}
.rb-track{fill:none;stroke:rgba(0,0,0,0.07);stroke-width:7}
.rb-fill{fill:none;stroke:#dc2626;stroke-width:7;stroke-linecap:round;stroke-dasharray:351;stroke-dashoffset:351;transition:stroke-dashoffset 1.6s cubic-bezier(.4,0,.2,1) .4s,stroke .35s ease;transform:rotate(-90deg);transform-origin:65px 65px}
.si{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.snum{font-family:'Outfit',sans-serif;font-weight:700;font-size:32px;color:#111827;line-height:1;letter-spacing:-.03em}
.sdenom{font-size:11px;color:#9ca3af;margin-top:2px;letter-spacing:.06em;font-family:'Outfit',sans-serif}
.rrow{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid rgba(0,0,0,0.06);font-size:14px}
.rl{color:#6b7280;font-family:'Libre Franklin',sans-serif}
.rv{font-weight:700;color:#111827;font-family:'Outfit',sans-serif}
.mb{width:80px;height:4px;background:rgba(0,0,0,0.07);border-radius:99px;overflow:hidden}
.mf{height:100%;background:linear-gradient(90deg,#e8a44a,#dc2626);border-radius:99px;width:0%;transition:width 1.3s cubic-bezier(.4,0,.2,1) .8s}
.td{background:#ffffff;border:1.5px solid rgba(0,0,0,0.08);border-radius:14px;padding:20px 22px;margin:18px 0;font-size:15px;color:#4b5563;line-height:1.8;font-family:'Libre Franklin',sans-serif}
.td strong{color:#111827;font-weight:600}

.gp-card{background:#f4f5f7;border:1.5px solid rgba(0,0,0,0.07);border-radius:18px;padding:18px 16px;margin:6px 0 18px}
.gp-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.gp-title{font-family:'Outfit',sans-serif;font-size:28px;font-weight:700;color:#111827;letter-spacing:-.02em;line-height:1.1}
.gp-tag{font-family:'Outfit',sans-serif;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:7px 11px;border-radius:8px;background:#d7e9ef;color:#103948}
.gp-tag.sev-high{background:#fde8e8;color:#b91c1c;border:1px solid rgba(220,38,38,0.25)}
.gp-tag.sev-veryhigh{background:#dc2626;color:#ffffff}
.gp-tag.sev-mid{background:#fef3cd;color:#8f6015;border:1px solid rgba(232,164,74,0.4)}
.gp-tag.sev-low{background:#dcfce7;color:#166534;border:1px solid rgba(46,158,107,0.3)}
.gp-main{display:flex;justify-content:center;margin-top:4px}
.gp-radar-wrap{position:relative;width:220px;height:220px}
.gp-radar-svg{width:220px;height:220px}
.gp-grid{fill:none;stroke:rgba(16,57,72,0.2);stroke-width:1}
.gp-axis{stroke:rgba(16,57,72,0.22);stroke-width:1}
.gp-poly-fill{fill:rgba(151,115,239,0.30)}
.gp-poly-stroke{fill:none;stroke:rgba(109,74,207,0.85);stroke-width:2}
.gp-core{fill:#6d4acf}
.gp-lbl{position:absolute;font-family:'Outfit',sans-serif;font-size:9px;font-weight:700;letter-spacing:.08em;color:#5b6470;text-transform:uppercase}
.gp-lbl-top{left:50%;top:-2px;transform:translateX(-50%)}
.gp-lbl-rt{right:-2px;top:58px}
.gp-lbl-rb{right:7px;bottom:46px}
.gp-lbl-bot{left:50%;bottom:-4px;transform:translateX(-50%)}
.gp-lbl-lb{left:8px;bottom:46px}
.gp-lbl-lt{left:-2px;top:58px}

.gp-range-wrap{position:relative;margin-top:2px}
.gp-pill{position:absolute;top:-28px;left:0;background:#ffffff;border:1px solid rgba(0,0,0,0.08);border-radius:10px;padding:4px 10px;font-family:'Outfit',sans-serif;font-size:11px;font-weight:600;color:#374151;white-space:nowrap;transition:left .9s cubic-bezier(.2,.7,.2,1)}
.gp-bar{height:10px;border-radius:99px;background:linear-gradient(90deg,#79c2e8 0%,#5dbc8a 32%,#e6b25d 65%,#dc2626 100%);position:relative;margin-top:32px}
.gp-dot{position:absolute;top:50%;left:0;width:18px;height:18px;border-radius:50%;background:#ffffff;border:2px solid #dc2626;box-shadow:0 4px 12px rgba(0,0,0,0.18);transform:translate(-50%,-50%);transition:left .9s cubic-bezier(.2,.7,.2,1),border-color .35s ease}
.gp-range-labels{display:flex;justify-content:space-between;margin-top:6px;font-family:'Outfit',sans-serif;font-size:11px;font-weight:700;letter-spacing:.08em;color:#6b7280}
.gp-note{margin-top:14px;border:1.5px solid rgba(16,57,72,0.22);background:#eaf4f8;border-radius:14px;padding:12px 14px}
.gp-note-t{font-family:'Outfit',sans-serif;font-size:20px;font-weight:700;color:#103948;margin-bottom:4px;line-height:1.1}
.gp-note-b{font-family:'Libre Franklin',sans-serif;font-size:14px;line-height:1.55;color:#4b5563}
.gp-note.low{border-color:rgba(46,158,107,0.35);background:#f0faf4}
.gp-note.low .gp-note-t{color:#166534}
.gp-note.mid{border-color:rgba(230,178,93,0.55);background:#fff8e8}
.gp-note.mid .gp-note-t{color:#8f6015}
.gp-note.high{border-color:rgba(220,38,38,0.3);background:#fff5f5}
.gp-note.high .gp-note-t{color:#b91c1c}

/* ── SALES ── */
.sf-wrap{background:#ffffff;border:1.5px solid rgba(0,0,0,0.07);border-radius:16px;padding:18px 16px 16px;margin:14px 0 16px}
.sf-k{font-family:'Outfit',sans-serif;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(200,130,20,0.85);margin-bottom:8px}
.sf-h{font-family:'Outfit',sans-serif;font-size:28px;font-weight:700;line-height:1.15;color:#111827;letter-spacing:-.02em;margin-bottom:8px}
.sf-sub{font-family:'Libre Franklin',sans-serif;font-size:14px;line-height:1.65;color:#4b5563;margin-bottom:10px}
.sf-status{display:inline-flex;align-items:center;background:rgba(16,57,72,0.08);border:1px solid rgba(16,57,72,0.18);color:#103948;border-radius:999px;padding:6px 12px;font-family:'Outfit',sans-serif;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}
.sf-pred{font-family:'Libre Franklin',sans-serif;font-size:13px;line-height:1.6;color:#6b7280;margin-bottom:12px}
.sf-pred span{color:#103948;font-family:'Outfit',sans-serif;font-weight:700}

.sf-card{background:#f4f5f7;border:1.5px solid rgba(0,0,0,0.07);border-radius:14px;padding:10px 10px 8px}
.sf-plot{position:relative;aspect-ratio:420/250}
.sf-svg{position:absolute;inset:0;width:100%;height:100%}
.sf-base{stroke:rgba(16,57,72,0.14);stroke-width:1.5}
.sf-guide{stroke:rgba(16,57,72,0.16);stroke-width:1.25;stroke-dasharray:5 5}
.sf-area{fill:url(#sf-area-grad);opacity:0;transition:opacity .65s ease}
.sf-line{fill:none;stroke:url(#sf-line-grad);stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round}
.sf-point{stroke:#ffffff;stroke-width:4;opacity:0;filter:drop-shadow(0 5px 12px rgba(0,0,0,0.16))}
.sf-point-start{fill:#ef5f58}
.sf-point-mid{fill:#e8ab63}
.sf-point-end{fill:#16a598}

.sf-chip{position:absolute;opacity:0;pointer-events:none;background:#ffffff;border:1px solid rgba(0,0,0,0.08);border-radius:10px;padding:7px 10px;font-family:'Outfit',sans-serif;font-size:11px;font-weight:700;letter-spacing:.02em;color:#111827;line-height:1.2;box-shadow:0 6px 18px rgba(16,57,72,0.12);transition:opacity .34s ease,transform .34s ease}
.sf-chip-start{transform:translate(0,-120%)}
.sf-chip-mid{transform:translate(-50%,-120%)}
.sf-chip-end{transform:translate(-100%,-120%);background:#0f8f84;color:#ffffff;border-color:rgba(15,143,132,0.55)}
.sf-chip.on{opacity:1}

.sf-x{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;padding:0 20px}
.sf-x span{font-family:'Outfit',sans-serif;font-size:11px;font-weight:700;letter-spacing:.08em;color:#6b7280}

.sales-meta{display:flex;flex-wrap:wrap;gap:10px;margin:-6px 0 12px}
.sales-chip{display:inline-flex;align-items:center;background:#f4f7f8;border:1px solid rgba(16,57,72,0.18);color:#103948;border-radius:999px;padding:7px 12px;font-family:'Outfit',sans-serif;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}

.cdw{background:#fff8ee;border:1.5px solid rgba(232,164,74,0.25);border-radius:14px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;margin:18px 0}
.cd-lbl{font-size:11px;color:#6b7280;letter-spacing:.1em;text-transform:uppercase;font-family:'Outfit',sans-serif}
.cd-d{display:flex;align-items:center;gap:2px;font-family:'Outfit',sans-serif;font-weight:700;font-size:28px;color:#103948;letter-spacing:.04em}
.cd-sep{color:rgba(232,164,74,0.4);font-size:22px;padding:0 1px}

.tlc{background:#ffffff;border:1.5px solid rgba(0,0,0,0.07);border-radius:14px;padding:18px 22px;margin:8px 0}
.tl-lbl{font-size:16px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:rgba(200,130,20,0.95);margin-bottom:14px;font-family:'Outfit',sans-serif}
.tl-list{list-style:none}
.tl-i{display:flex;align-items:flex-start;gap:10px;font-size:15px;color:#1f2937;padding:8px 0;position:relative;line-height:1.58;font-family:'Libre Franklin',sans-serif}
.tl-i::before{content:'';display:none}
.tl-ico{width:22px;height:22px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-family:'Outfit',sans-serif;font-size:15px;font-weight:800;line-height:1;margin-top:1px}
.tl-now .tl-ico{background:#ef4a5a;color:#ffffff}
.tl-after .tl-ico{background:#0ea5a4;color:#ffffff}
.tl-t{display:block;flex:1;font-weight:600}

.rc{background:#ffffff;border:1.5px solid rgba(0,0,0,0.07);border-radius:14px;padding:20px 22px;margin:8px 0}
.rb2{font-family:'Libre Franklin',sans-serif;font-style:italic;font-size:15px;color:#374151;line-height:1.75;margin-bottom:10px}
.rn{font-size:11px;color:#9ca3af;font-weight:500;letter-spacing:.1em;text-transform:uppercase;font-family:'Outfit',sans-serif}

.ii{display:flex;align-items:flex-start;gap:14px;padding:13px 0;border-bottom:1px solid rgba(0,0,0,0.06);font-size:15px;color:#374151;line-height:1.55;font-family:'Libre Franklin',sans-serif}
.ick{color:#e8a44a;flex-shrink:0;font-size:14px;margin-top:2px;font-family:'Outfit',sans-serif;font-weight:700}

/* ── PRICE CARD ── */
.pc{background:#ffffff;border:2px solid rgba(232,164,74,0.3);border-radius:16px;padding:26px 24px;margin:14px 0}
.pbadge{display:inline-block;background:rgba(232,164,74,0.12);color:#b86c10;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:5px 14px;border-radius:99px;margin-bottom:14px;font-family:'Outfit',sans-serif;border:1px solid rgba(232,164,74,0.25)}
.ptr{display:flex;align-items:baseline;gap:12px;margin:12px 0 4px}
.pm{font-family:'Outfit',sans-serif;font-weight:700;font-size:48px;color:#111827;letter-spacing:-.03em;line-height:1}
.po{font-size:17px;color:#d1d5db;text-decoration:line-through;font-family:'Libre Franklin',sans-serif}
.ps{font-size:13px;font-weight:600;color:#e8a44a;font-family:'Libre Franklin',sans-serif}
.pf{margin-top:16px;border-top:1px solid rgba(0,0,0,0.07);padding-top:16px;display:flex;flex-direction:column;gap:8px}
.pfi{font-size:14px;color:#4b5563;display:flex;gap:10px;align-items:flex-start;font-family:'Libre Franklin',sans-serif}
.pfi span:first-child{color:#e8a44a;font-weight:700;flex-shrink:0;font-family:'Outfit',sans-serif}

.gw{display:flex;gap:16px;background:#f9fafb;border:1.5px solid rgba(0,0,0,0.07);border-radius:14px;padding:18px 22px;margin:14px 0;align-items:flex-start}
.gi2{font-size:24px;flex-shrink:0}
.gt{font-weight:700;font-size:15px;color:#111827;margin-bottom:5px;font-family:'Outfit',sans-serif}
.gb2{font-size:14px;color:#6b7280;line-height:1.65;font-family:'Libre Franklin',sans-serif}

.ticker{display:flex;align-items:center;gap:8px;font-size:13px;color:#6b7280;background:#f9fafb;border:1px solid rgba(0,0,0,0.07);border-radius:10px;padding:10px 16px;margin:10px 0;font-family:'Libre Franklin',sans-serif}
.tdot{width:7px;height:7px;background:#22c55e;border-radius:50%;flex-shrink:0;animation:pip 2s infinite}

.ts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}
.tc{background:#ffffff;border:1.5px solid rgba(0,0,0,0.08);border-radius:14px;padding:18px;text-align:center}
.tn{font-family:'Outfit',sans-serif;font-size:30px;font-weight:700;color:#103948;letter-spacing:-.02em}
.ts2{font-size:12px;color:#6b7280;line-height:1.5;margin-top:5px;font-family:'Libre Franklin',sans-serif}

.faq-i{border-bottom:1px solid rgba(0,0,0,0.07)}
.faq-q{display:flex;justify-content:space-between;align-items:center;padding:16px 0;cursor:pointer;font-size:15px;font-weight:600;color:#1f2937;user-select:none;gap:12px;font-family:'Outfit',sans-serif}
.faq-arr{color:#9ca3af;font-size:20px;transition:transform .3s;flex-shrink:0}
.faq-i.open .faq-arr{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s cubic-bezier(.4,0,.2,1),padding .3s;font-size:14px;color:#4b5563;line-height:1.8;font-family:'Libre Franklin',sans-serif}
.faq-i.open .faq-a{max-height:300px;padding-bottom:16px}

/* ── PROGRAM POPUP ── */
#pp{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.45);backdrop-filter:blur(6px);z-index:500;align-items:flex-end;justify-content:center;padding:0}
#pp.on{display:flex}
.pp-in{background:#fcfcfc;border:1px solid rgba(0,0,0,0.08);border-radius:24px 24px 0 0;padding:28px 22px 48px;width:100%;max-width:540px;max-height:90vh;overflow-y:auto;animation:su .32s cubic-bezier(.4,0,.2,1) both}
@keyframes su{from{transform:translateY(100%)}to{transform:translateY(0)}}
.pp-h{width:40px;height:4px;background:rgba(0,0,0,0.12);border-radius:99px;margin:0 auto 24px}
.pp-title{font-family:'Outfit',sans-serif;font-size:22px;font-weight:700;color:#111827;margin-bottom:6px;line-height:1.25}
.pp-sub{font-size:14px;color:#6b7280;margin-bottom:18px;line-height:1.7;font-family:'Libre Franklin',sans-serif}
.ll{list-style:none;margin-bottom:20px}
.li{display:flex;gap:12px;padding:11px 0;border-bottom:1px solid rgba(0,0,0,0.06);font-size:14px;color:#4b5563;line-height:1.5;font-family:'Libre Franklin',sans-serif}
.day{font-weight:700;color:rgba(200,130,20,0.8);flex-shrink:0;font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding-top:2px;min-width:36px;font-family:'Outfit',sans-serif}
.pp-pr{background:#fff8ee;border:1.5px solid rgba(232,164,74,0.2);border-radius:14px;padding:16px 20px;margin-bottom:16px;display:flex;align-items:center;justify-content:space-between}
.pp-pl{font-size:11px;color:#9ca3af;font-family:'Outfit',sans-serif;letter-spacing:.06em;text-transform:uppercase}
.pp-pn{font-family:'Outfit',sans-serif;font-size:28px;font-weight:700;color:#111827;letter-spacing:-.02em}
.pp-po{font-size:13px;color:#d1d5db;text-decoration:line-through;margin-top:1px;font-family:'Libre Franklin',sans-serif}
.pp-day-body{display:flex;flex-direction:column;gap:2px;flex:1}
.pp-day-title{font-size:14px;color:#111827;font-weight:500;line-height:1.4;font-family:'Libre Franklin',sans-serif}
.pp-nudge{display:block;font-size:12px;color:#9ca3af;font-weight:400;font-family:'Libre Franklin',sans-serif;line-height:1.4}
.pp-x{position:absolute;top:16px;right:16px;width:32px;height:32px;background:rgba(0,0,0,0.06);border:none;border-radius:50%;font-size:18px;color:#6b7280;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;transition:.18s;z-index:10}
.pp-x:hover{background:rgba(0,0,0,0.12);color:#111827}
.pp-in{position:relative}

/* ── TYPE DESCRIPTION LIST ── */
.tdesc-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.tdesc-list li{display:flex;align-items:flex-start;gap:10px;font-size:15px;color:#374151;line-height:1.6;font-family:'Libre Franklin',sans-serif}
.tdesc-list li::before{content:'→';color:#e8a44a;flex-shrink:0;font-weight:700;margin-top:1px}

/* ── COURSE TIMELINE ── */
#course-timeline{display:flex;flex-direction:column;gap:0;margin-bottom:16px;border-radius:16px;overflow:hidden;border:1.5px solid rgba(16,57,72,0.1)}
.ctl-item{display:flex;align-items:flex-start;gap:14px;padding:14px 16px;border-bottom:1px solid rgba(16,57,72,0.07);background:#fff;transition:.15s}
.ctl-item:last-child{border-bottom:none}
.ctl-item.ctl-key{background:linear-gradient(135deg,rgba(16,57,72,0.04),rgba(232,164,74,0.06));border-left:3px solid #e8a44a}
.ctl-num{font-family:'Outfit',sans-serif;font-size:10px;font-weight:800;color:#e8a44a;letter-spacing:.1em;text-transform:uppercase;min-width:38px;flex-shrink:0;padding-top:3px}
.ctl-item.ctl-key .ctl-num{color:#103948}
.ctl-body{flex:1}
.ctl-title{font-family:'Outfit',sans-serif;font-size:14px;font-weight:700;color:#111827;margin-bottom:3px;line-height:1.3}
.ctl-desc{font-size:13px;color:#6b7280;line-height:1.55;font-family:'Libre Franklin',sans-serif}
.ctl-item.ctl-key .ctl-desc{color:#374151}

/* ── DOWNSELL ── */
#ds{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.5);backdrop-filter:blur(6px);z-index:600;align-items:center;justify-content:center;padding:20px}
#ds.on{display:flex}
.ds-in{background:#fcfcfc;border:1px solid rgba(0,0,0,0.08);border-radius:20px;padding:32px 26px;max-width:400px;width:100%;animation:fu .28s cubic-bezier(.4,0,.2,1) both;text-align:center}
.ds-h{font-family:'Outfit',sans-serif;font-size:22px;font-weight:700;color:#111827;margin-bottom:10px;line-height:1.3}
.ds-b{font-size:15px;color:#4b5563;margin-bottom:20px;line-height:1.7;font-family:'Libre Franklin',sans-serif}
.ds-p{font-family:'Outfit',sans-serif;font-size:40px;font-weight:700;color:#111827;letter-spacing:-.03em;margin-bottom:4px}
.ds-o{font-size:13px;color:#d1d5db;text-decoration:line-through;margin-bottom:18px;font-family:'Libre Franklin',sans-serif}

/* ── SPIN ── */
#sp{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.45);backdrop-filter:blur(6px);z-index:400;align-items:flex-end;justify-content:center;padding:0}
#sp.on{display:flex}
.sp-in{background:#fcfcfc;border:1px solid rgba(0,0,0,0.08);border-radius:24px 24px 0 0;padding:28px 22px 48px;width:100%;max-width:540px;text-align:center;animation:su .32s cubic-bezier(.4,0,.2,1) both}
.ww{position:relative;width:280px;height:280px;margin:16px auto}
.wptr{position:absolute;top:-12px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:20px solid #e8a44a;z-index:2}
.wctr{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.wsb{width:58px;height:58px;background:linear-gradient(135deg,#103948,#1a5c75);border:none;border-radius:50%;cursor:pointer;font-family:'Outfit',sans-serif;font-weight:700;font-size:11px;color:#ffffff;letter-spacing:.08em;pointer-events:all;transition:opacity .18s}
.wsb:hover{opacity:.85}
#sp-res{font-family:'Outfit',sans-serif;font-size:20px;font-weight:700;color:#111827;min-height:30px;margin:14px 0;line-height:1.3}

/* ── WIN OVERLAY ── */
#win-overlay{display:none;position:fixed;inset:0;background:linear-gradient(135deg,rgba(16,57,72,0.97),rgba(7,34,46,0.97));z-index:700;align-items:center;justify-content:center}
#win-overlay.on{display:flex;animation:wfade .35s ease both}
@keyframes wfade{from{opacity:0}to{opacity:1}}
.win-inner{text-align:center;padding:40px 32px}
.win-emoji{font-size:64px;margin-bottom:18px;animation:wbounce .55s cubic-bezier(.34,1.56,.64,1) both}
@keyframes wbounce{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
.win-label{font-family:'Outfit',sans-serif;font-size:14px;font-weight:600;color:rgba(255,255,255,0.65);letter-spacing:.18em;text-transform:uppercase;margin-bottom:10px}
.win-value{font-family:'Outfit',sans-serif;font-size:80px;font-weight:700;color:#e8a44a;letter-spacing:-.02em;line-height:1;margin-bottom:10px;animation:wpop .4s .2s cubic-bezier(.34,1.56,.64,1) both}
@keyframes wpop{from{transform:scale(0.4);opacity:0}to{transform:scale(1);opacity:1}}
.win-price{font-size:17px;color:rgba(255,255,255,0.75);font-family:'Libre Franklin',sans-serif;line-height:1.6}

/* ── ATOUSSA ── */
.atoussa-hero{display:flex;align-items:center;gap:16px;background:linear-gradient(135deg,rgba(16,57,72,0.07),rgba(16,57,72,0.03));border:1.5px solid rgba(16,57,72,0.14);border-radius:16px;padding:20px;margin-top:12px;margin-bottom:4px}
.atoussa-av-wrap{width:56px;height:56px;border-radius:50%;overflow:hidden;border:1.5px solid rgba(16,57,72,0.22);flex-shrink:0}
.atoussa-av{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 24%;transform:scale(1.35);transform-origin:50% 28%}
.atoussa-nm{font-family:'Outfit',sans-serif;font-size:18px;font-weight:700;color:#111827;margin-bottom:3px}
.atoussa-rl{font-size:13px;color:#6b7280;font-family:'Libre Franklin',sans-serif}

/* ── TYPE VIDEO ── */
#type-video{margin-bottom:20px}
.type-vid{width:100%;border-radius:14px;overflow:hidden;background:#111827}

/* ── UTILS ── */
.mt8{margin-top:8px}.mt16{margin-top:16px}.mt24{margin-top:24px}
.sm{font-size:13px;color:#9ca3af;line-height:1.55;font-family:'Libre Franklin',sans-serif}
.c{text-align:center}
.ha{color:#e8a44a!important}
.hl{color:#1f2937!important;font-style:italic}

@media(min-width:1024px){
  #app{padding:0 32px 120px}
  .screen{max-width:700px}
  .logo-wrap,#prog-wrap{max-width:700px}

  #s31{max-width:860px}
  #s31 .gp-card{max-width:820px;margin-left:auto;margin-right:auto}

  #ssales{max-width:1080px}
  #ssales>.lbl,
  #ssales>.h1,
  #ssales>.sub,
  #ssales>.sales-meta,
  #ssales>.cdw,
  #ssales>.sf-wrap,
  #ssales>.tlc,
  #ssales>.ii,
  #ssales>.rc,
  #ssales>.ts,
  #ssales>.qb,
  #ssales>.pc,
  #ssales>.gw,
  #ssales>.ticker,
  #ssales>.btn,
  #ssales>.sm,
  #ssales>#fq,
  #ssales>div[style*="margin-top:40px"]{
    width:100%;
    max-width:940px;
    margin-left:auto;
    margin-right:auto;
  }

  #ssales>.div{
    width:100%;
    max-width:940px;
    align-self:center;
  }
}

@media(max-width:480px){
  /* ── BASE ── */
  #app{padding:0 16px 120px}
  #timer-bar{height:60px;padding:0 12px}
  body.timer-on #app{padding-top:60px}
  .t-left{gap:8px}
  .t-pip{width:8px;height:8px}
  #t-digits{font-size:18px;letter-spacing:.08em}
  .t-cta{font-size:13px;padding:10px 14px;border-radius:10px}

  /* ── LOGO ── */
  .logo-wrap{padding:8px 0 6px;margin-bottom:6px}
  .logo-img{height:110px;max-width:90vw}
  #back-btn{width:32px;height:32px;font-size:21px}

  /* ── PROGRESS ── */
  #prog-wrap{padding:8px 0 0;margin-bottom:14px}
  #prog-track{height:3px}
  body.q-progress .logo-wrap{margin-bottom:2px;padding-bottom:0}
  body.q-progress #prog-wrap{padding-top:0;margin-bottom:12px}

  /* ── HEADINGS ── */
  .h1{font-size:clamp(24px,7vw,30px);line-height:1.18;margin-bottom:12px}
  .sub{font-size:16px;line-height:1.7;margin-bottom:20px}
  .lbl{font-size:11px;margin-bottom:10px}

  /* ── CHOICES ── */
  .choices{gap:10px;margin-bottom:20px}
  .cb{padding:18px 16px;font-size:16px;border-radius:14px;gap:14px;min-height:54px}
  .cb .dot{width:20px;height:20px;flex-shrink:0}

  /* ── GENDER GRID ── */
  .gg{gap:12px;margin-bottom:22px}
  .gb{padding:34px 14px;font-size:17px;border-radius:16px}
  .gi{font-size:34px}

  /* ── SCALE ── */
  .sc-wrap{margin-bottom:20px}
  .sc-btns{gap:7px}
  .sc-btn{font-size:19px;border-radius:14px;min-height:56px}
  .sc-labels{font-size:11px}

  /* ── INPUTS ── */
  .inp{font-size:16px;padding:18px 16px;border-radius:14px;margin-bottom:12px}

  /* ── BUTTONS ── */
  .btn{padding:20px 24px;font-size:17px;border-radius:14px;margin-top:14px}
  .btn-outline{font-size:15px;padding:16px 24px;border-radius:14px}

  /* ── STAT CARD ── */
  .stat-card{padding:20px 18px}
  .stat-num{font-size:52px}
  .stat-sub{font-size:15px}
  .stars{font-size:14px}
  .rt{font-size:15px}
  .ra{font-size:11px}
  .s7-stat{font-size:22px;margin-bottom:8px}
  .s7-copy{font-size:15px;margin-bottom:14px}
  .jam-media-overlay{padding:12px 13px;gap:6px}
  .jam-stars{font-size:15px}
  .jam-name{font-size:11px;line-height:1.3}
  .jam-verify{font-size:9px}
  .jam-quote{padding:14px 14px 16px;font-size:15px;line-height:1.65}

  /* ── QUOTE ── */
  .qb{font-size:16px;padding:16px 18px;line-height:1.75}

  /* ── LOADER ── */
  .ls{font-size:15px;padding:11px 0}

  /* ── RESULTS ── */
  .rrow{font-size:15px;padding:13px 0}
  .mb{width:70px}
  .td{font-size:15px;padding:18px}
  .gp-card{padding:14px 12px 14px}
  .gp-title{font-size:23px}
  .gp-radar-wrap{width:196px;height:196px}
  .gp-radar-svg{width:196px;height:196px}
  .gp-lbl{font-size:8px}
  .gp-pill{font-size:10px;top:-26px;padding:4px 8px}
  .gp-note-t{font-size:18px}
  .gp-note-b{font-size:13px}

  /* ── SALES ── */
  .sf-wrap{padding:16px 12px 12px;margin:12px 0 14px}
  .sf-h{font-size:24px}
  .sf-sub{font-size:13px}
  .sf-status{font-size:10px;padding:6px 10px}
  .sf-pred{font-size:12px;margin-bottom:10px}
  .sf-card{padding:8px 8px 6px}
  .sf-chip{font-size:10px;padding:6px 8px;border-radius:9px}
  .sf-x{padding:0 14px}
  .sf-x span{font-size:10px}
  .sales-chip{font-size:10px;padding:6px 10px}
  .cdw{padding:14px 16px;border-radius:14px}
  .cd-d{font-size:30px}
  .tlc{padding:16px 18px}
  .tl-i{font-size:14px}
  .rc{padding:18px}
  .rb2{font-size:15px}
  .ii{font-size:15px;padding:14px 0;gap:14px}

  /* ── PRICE CARD ── */
  .pc{padding:16px 14px;border-radius:14px}
  .pm{font-size:34px}
  .po{font-size:14px}
  .ptr{margin:8px 0 2px;gap:8px}
  .ps{font-size:12px}
  .pf{margin-top:12px;padding-top:12px;gap:6px}
  .pfi{font-size:13px}
  .pbadge{font-size:10px;padding:4px 10px;margin-bottom:10px}

  /* ── GUARANTEE ── */
  .gw{padding:16px 16px;gap:14px}
  .gt{font-size:15px}
  .gb2{font-size:14px}

  /* ── STATS GRID ── */
  .ts{gap:10px}
  .tc{padding:16px 14px}
  .tn{font-size:28px}
  .ts2{font-size:12px}

  /* ── FAQ ── */
  .faq-q{font-size:16px;padding:18px 0}
  .faq-a{font-size:14px}

  /* ── TICKER ── */
  .ticker{font-size:13px;padding:10px 14px}

  /* ── POPUPS ── */
  .pp-in{padding:22px 16px 48px}
  .pp-title{font-size:20px}
  .pp-sub{font-size:14px}
  .li{font-size:14px;padding:12px 0}
  .ds-in{padding:28px 18px;border-radius:18px}
  .ds-h{font-size:22px}
  .ds-b{font-size:15px}
  .ds-p{font-size:38px}
  .sp-in{padding:24px 16px 48px}

  /* ── UTILS ── */
  .sm{font-size:13px}
  .div{margin:22px 0}
}