:root{
  --bg:#0a0e1a; --bg2:#111726; --card:#161d2f; --card-hover:#1c2540;
  --border:#26304a; --border-glow:#3b82f6;
  --text:#f1f5f9; --text2:#aab4c8; --text3:#6b7689;
  --accent:#38bdf8; --accent2:#818cf8; --free:#34d399;
  --radius:18px; --maxw:860px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text);
  font-family:'Segoe UI',system-ui,-apple-system,sans-serif;
  font-size:19px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:100vh;}
body::before{content:"";position:fixed;top:-30%;left:50%;transform:translateX(-50%);
  width:900px;height:900px;border-radius:50%;
  background:radial-gradient(circle,rgba(56,189,248,.10),transparent 60%);pointer-events:none;z-index:0;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;position:relative;z-index:1;min-height:70vh;}

/* HEADER */
header{padding:28px 0;display:flex;align-items:center;justify-content:space-between;}
.logo{display:flex;align-items:center;gap:12px;font-size:26px;font-weight:800;letter-spacing:-.5px;text-decoration:none;color:var(--text);}
.logo-mark{width:44px;height:44px;border-radius:12px;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:900;color:#0a0e1a;}
.logo span{background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent;}
.lang-switch{position:relative;}
.lang-btn{background:var(--card);border:1.5px solid var(--border);color:var(--text2);
  padding:9px 16px;border-radius:10px;font-size:17px;font-weight:700;cursor:pointer;
  font-family:inherit;display:flex;align-items:center;gap:7px;transition:border-color .2s;}
.lang-btn:hover{border-color:var(--accent);color:var(--text);}
.lang-menu{position:absolute;top:110%;inset-inline-end:0;background:var(--card);border:1.5px solid var(--border);
  border-radius:12px;padding:6px;display:none;min-width:180px;max-height:340px;overflow-y:auto;z-index:100;
  box-shadow:0 12px 40px rgba(0,0,0,.4);}
.lang-menu.open{display:block;}
.lang-menu button{display:block;width:100%;text-align:start;background:none;border:none;color:var(--text2);
  padding:10px 14px;border-radius:8px;cursor:pointer;font-size:17px;font-family:inherit;}
.lang-menu button:hover{background:rgba(56,189,248,.12);color:var(--text);}

/* HERO */
.hero{text-align:center;padding:60px 0;}
.tagline{font-size:18px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--accent);margin-bottom:20px;}
.hero h1{font-size:54px;line-height:1.12;font-weight:900;letter-spacing:-1.5px;margin-bottom:24px;}
.hero h1 .grad{background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero .sub{font-size:23px;color:var(--text2);max-width:680px;margin:0 auto 36px;line-height:1.6;}
.btn-hero{font-size:22px;font-weight:800;padding:18px 44px;border-radius:14px;border:none;cursor:pointer;
  font-family:inherit;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#0a0e1a;
  transition:filter .2s,transform .1s;box-shadow:0 10px 36px rgba(56,189,248,.3);}
.btn-hero:hover{filter:brightness(1.1);transform:translateY(-2px);}

/* "We are not GPT" differentiation */
.notgpt{margin-top:72px;padding-top:48px;border-top:1.5px solid var(--border);}
.notgpt-title{font-size:34px;font-weight:900;letter-spacing:-1px;margin-bottom:10px;}
.notgpt-sub{font-size:19px;color:var(--text2);max-width:620px;margin:0 auto 36px;}
.notgpt-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;max-width:760px;margin:0 auto;text-align:start;}
.notgpt-card{background:var(--card);border:1.5px solid var(--border);border-radius:16px;
  padding:22px 24px;display:flex;gap:14px;align-items:flex-start;transition:border-color .2s,transform .15s;}
.notgpt-card:hover{border-color:var(--accent);transform:translateY(-2px);}
.notgpt-ico{font-size:28px;line-height:1;flex:0 0 auto;}
.notgpt-card p{font-size:17px;color:var(--text2);line-height:1.5;font-weight:500;}
@media(max-width:640px){.notgpt-grid{grid-template-columns:1fr;}.notgpt-title{font-size:27px;}}

/* QUIZ */
.quiz{padding:40px 0 80px;max-width:640px;margin:0 auto;}
.quiz-progress{height:6px;background:var(--border);border-radius:99px;margin-bottom:40px;overflow:hidden;}
.quiz-progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:99px;transition:width .4s;width:0;}
.quiz-step{animation:fadeIn .3s;}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
.quiz-q{font-size:30px;font-weight:800;margin-bottom:8px;letter-spacing:-.5px;}
.quiz-hint{font-size:17px;color:var(--text3);margin-bottom:24px;}
.quiz-input{width:100%;padding:16px 20px;font-size:19px;border-radius:12px;border:1.5px solid var(--border);
  background:var(--card);color:var(--text);font-family:inherit;outline:none;margin-bottom:24px;}
.quiz-input:focus{border-color:var(--accent);}
.quiz-options{display:flex;flex-direction:column;gap:12px;margin-bottom:24px;}
.quiz-opt{padding:16px 20px;font-size:18px;font-weight:600;border-radius:12px;border:1.5px solid var(--border);
  background:var(--card);color:var(--text2);cursor:pointer;text-align:start;font-family:inherit;transition:all .2s;}
.quiz-opt:hover{border-color:var(--accent);color:var(--text);}
.quiz-opt.selected{border-color:var(--accent);background:rgba(56,189,248,.12);color:var(--text);}
.quiz-nav{display:flex;gap:12px;justify-content:space-between;margin-top:8px;}

/* two equal report paths: quick vs deeper */
.quiz-choice{display:flex;gap:14px;margin-top:28px;padding-top:24px;border-top:1.5px dashed var(--border);}
.quiz-choice button{flex:1;font-size:19px;font-weight:800;padding:20px 18px;border-radius:14px;border:none;
  cursor:pointer;font-family:inherit;line-height:1.3;transition:filter .2s,transform .1s;}
.btn-quick{background:linear-gradient(135deg,var(--free),#22c55e);color:#0a0e1a;
  box-shadow:0 10px 30px rgba(52,211,153,.28);}
.btn-deep{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#0a0e1a;
  box-shadow:0 10px 30px rgba(56,189,248,.28);}
.btn-quick:hover,.btn-deep:hover{filter:brightness(1.08);transform:translateY(-2px);}
@media(max-width:560px){.quiz-choice{flex-direction:column;}}
.btn{font-size:19px;font-weight:700;padding:14px 32px;border-radius:12px;border:none;cursor:pointer;
  font-family:inherit;transition:filter .2s,transform .1s;}
.btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#0a0e1a;}
.btn-primary:hover{filter:brightness(1.1);transform:translateY(-2px);}
.btn-ghost{background:transparent;color:var(--text2);border:1.5px solid var(--border);}
.btn-ghost:hover{border-color:var(--accent);color:var(--text);}

/* WORKING */
.working{text-align:center;padding:80px 0;}
.working-spinner{width:64px;height:64px;margin:0 auto 30px;border:4px solid var(--border);
  border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.working-title{font-size:26px;font-weight:800;margin-bottom:20px;}
/* rotating value tips shown while the report is generated */
.working-tip{max-width:560px;min-height:64px;margin:0 auto 28px;padding:18px 24px;
  background:linear-gradient(135deg,var(--card),var(--bg2));border:1.5px solid var(--border);
  border-inline-start:4px solid var(--accent);border-radius:14px;font-size:18px;color:var(--text);
  line-height:1.5;display:none;animation:fadeIn .5s;text-align:start;}
.working-tip.show{display:block;}
.working-log{max-width:520px;margin:0 auto;text-align:start;display:flex;flex-direction:column;gap:8px;}
.log-line{font-size:16px;color:var(--text3);padding:8px 16px;background:var(--card);border-radius:10px;
  border:1px solid var(--border);animation:fadeIn .3s;}
.log-line.search{color:var(--accent);}

/* REPORT */
.report{padding:30px 0 80px;animation:fadeIn .4s;}
.report-head{text-align:center;margin-bottom:40px;}
.report-brand{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:20px;}
.report-brand .logo-mark{width:40px;height:40px;font-size:22px;}
.report-brand-name{font-size:24px;font-weight:800;letter-spacing:-.5px;}
.report-brand-name .grad{background:linear-gradient(135deg,var(--accent),var(--accent2));
  -webkit-background-clip:text;background-clip:text;color:transparent;}
.report-head .badge{display:inline-block;font-size:15px;font-weight:700;letter-spacing:2px;text-transform:uppercase;
  color:var(--free);background:rgba(52,211,153,.12);padding:6px 16px;border-radius:99px;margin-bottom:16px;}
.report-head h2{font-size:38px;font-weight:900;letter-spacing:-1px;}

/* branding credit at the foot of the report (also captured into the PDF) */
.report-credit{display:flex;align-items:center;gap:14px;justify-content:center;text-align:start;
  margin-top:36px;padding:24px 28px;background:linear-gradient(135deg,rgba(56,189,248,.08),rgba(129,140,248,.05));
  border:1.5px solid var(--border);border-radius:var(--radius);}
.report-credit .logo-mark{width:44px;height:44px;font-size:24px;flex-shrink:0;}
.report-credit-text{font-size:16px;color:var(--text2);line-height:1.5;}
.report-credit-url{font-weight:800;color:var(--accent);}
.rsection{background:var(--card);border:1.5px solid var(--border);border-radius:var(--radius);
  padding:32px 36px;margin-bottom:20px;}
.rsection h3{font-size:15px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--accent);margin-bottom:16px;}
.rsection .big{font-size:22px;color:var(--text);line-height:1.6;font-weight:500;}
.rlist{list-style:none;display:flex;flex-direction:column;gap:12px;}
.rlist li{font-size:19px;color:var(--text2);padding-inline-start:32px;position:relative;line-height:1.55;}
.rlist li::before{content:"→";position:absolute;inset-inline-start:0;color:var(--accent);font-weight:900;}

/* deep prose sections — the value-first body (no products) */
.prose-body p{font-size:19px;color:var(--text2);line-height:1.75;margin-bottom:16px;}
.prose-body p:last-child{margin-bottom:0;}

/* benchmarks table — where you stand vs the average */
.bench-table{display:flex;flex-direction:column;}
.bench-row{display:grid;grid-template-columns:2fr 1fr 1fr;gap:14px;align-items:baseline;
  padding:14px 0;border-bottom:1px solid var(--border);}
.bench-row:last-child{border-bottom:none;}
.bench-head{border-bottom:1.5px solid var(--border);}
.bench-head span{font-size:13px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--text3);}
.bench-metric{font-size:18px;color:var(--text);font-weight:600;display:flex;flex-direction:column;gap:4px;}
.bench-note{font-size:14px;font-weight:400;color:var(--text3);line-height:1.4;}
.bench-val{font-size:18px;color:var(--text2);font-weight:700;}
.bench-val.bench-good{color:var(--free);}

/* common mistakes */
.mistakes{border-inline-start:4px solid #f0644b;}
.mistakes h3{color:#f0926b;}
.mistakes-list li::before{content:"✗";color:#f0644b;}

/* content ideas — ready-to-use titles/topics/posts */
.content-ideas{border-inline-start:4px solid var(--free);}
.ci-group{margin-bottom:22px;}
.ci-group:last-child{margin-bottom:0;}
.ci-label{font-size:17px;font-weight:800;color:var(--text);margin-bottom:12px;}
.content-ideas .rlist li::before{content:"✎";color:var(--free);}

/* growth direction cards */
.dir{background:var(--bg2);border:1.5px solid var(--border);border-radius:14px;padding:24px 28px;margin-bottom:14px;}
.dir-title{font-size:22px;font-weight:800;margin-bottom:10px;display:flex;align-items:center;gap:10px;}
.dir-why{font-size:18px;color:var(--text2);margin-bottom:8px;}
.dir-why strong{color:var(--text);}
.dir-details{margin:12px 0;}
.dir-details p{font-size:17px;color:var(--text2);line-height:1.7;margin-bottom:12px;}
.dir-details p:last-child{margin-bottom:0;}
.dir-steps{margin:14px 0;background:rgba(56,189,248,.05);border:1px solid var(--border);border-radius:10px;padding:16px 20px;}
.dir-steps-label{font-size:13px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--accent);margin-bottom:10px;}
.dir-steps ol{padding-inline-start:22px;display:flex;flex-direction:column;gap:8px;}
.dir-steps li{font-size:16px;color:var(--text2);line-height:1.5;}
.dir-evidence{font-size:16px;color:var(--text3);font-style:italic;margin-bottom:16px;}
.dir-tool{display:flex;align-items:center;gap:14px;background:rgba(56,189,248,.08);
  border:1.5px solid rgba(56,189,248,.25);border-radius:12px;padding:14px 18px;flex-wrap:wrap;}
.dir-tool-icon{font-size:28px;}
.dir-tool-info{flex:1;min-width:180px;}
.dir-tool-name{font-size:18px;font-weight:800;color:var(--text);}
.dir-tool-reason{font-size:15px;color:var(--text2);}
.dir-tool a{font-size:16px;font-weight:800;padding:10px 22px;border-radius:10px;text-decoration:none;
  background:linear-gradient(135deg,var(--accent),var(--accent2));color:#0a0e1a;white-space:nowrap;transition:filter .2s;}
.dir-tool a:hover{filter:brightness(1.1);}

/* 30/60/90 */
.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.plan-col{background:var(--bg2);border:1.5px solid var(--border);border-radius:12px;padding:20px;}
.plan-col h4{font-size:14px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--accent2);margin-bottom:10px;}
.plan-col p{font-size:17px;color:var(--text2);line-height:1.5;}

/* first step highlight */
.firststep{background:linear-gradient(135deg,rgba(56,189,248,.1),rgba(129,140,248,.06));
  border:1.5px solid rgba(56,189,248,.3);}
.firststep .action{font-size:22px;font-weight:700;color:var(--text);margin-bottom:16px;line-height:1.5;}
.firststep a{display:inline-block;font-size:18px;font-weight:800;padding:14px 30px;border-radius:12px;text-decoration:none;
  background:linear-gradient(135deg,var(--accent),var(--accent2));color:#0a0e1a;}

/* toolkit table */
.toolkit-row{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--border);flex-wrap:wrap;}
.toolkit-row:last-child{border-bottom:none;}
.toolkit-challenge{flex:1;font-size:18px;color:var(--text2);min-width:160px;}
.toolkit-row a{font-size:16px;font-weight:800;color:var(--accent);text-decoration:none;}
.toolkit-row a:hover{text-decoration:underline;}

/* tip */
.tip{background:linear-gradient(135deg,var(--card),var(--bg2));border-inline-start:4px solid var(--accent);}
.tip .big{font-style:italic;}

/* top 3 actions — the hero of the report */
.top3{background:linear-gradient(135deg,rgba(52,211,153,.1),rgba(56,189,248,.05));border:1.5px solid rgba(52,211,153,.3);}
.top3-item{display:flex;gap:16px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--border);}
.top3-item:last-child{border-bottom:none;}
.top3-when{flex-shrink:0;min-width:110px;font-size:14px;font-weight:800;letter-spacing:1px;text-transform:uppercase;
  color:var(--free);padding-top:3px;}
.top3-item.track .top3-when{color:var(--accent);}
.top3-what{flex:1;font-size:20px;color:var(--text);line-height:1.5;font-weight:500;}

/* report actions */
.report-actions{display:flex;gap:14px;justify-content:center;margin-top:30px;flex-wrap:wrap;}

/* FOOTER */
footer{border-top:1.5px solid var(--border);padding:40px 24px;text-align:center;color:var(--text3);font-size:17px;
  max-width:var(--maxw);margin:0 auto;position:relative;z-index:1;}
.logo-foot{display:flex;align-items:center;justify-content:center;gap:10px;font-size:22px;font-weight:800;margin-bottom:12px;}
.logo-foot span{background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent;}
footer a{color:var(--text2);text-decoration:none;}
footer a:hover{color:var(--accent);}
.footer-links{display:flex;gap:22px;justify-content:center;flex-wrap:wrap;margin-bottom:14px;}
.footer-links a{font-size:15px;font-weight:600;color:var(--text3);}
.footer-links a:hover{color:var(--accent);}

/* LEGAL / DOC PAGES */
.doc{max-width:760px;margin:0 auto;padding:30px 0 80px;animation:fadeIn .4s;}
.doc h1{font-size:42px;font-weight:900;letter-spacing:-1px;margin-bottom:10px;}
.doc .doc-meta{font-size:16px;color:var(--text3);margin-bottom:40px;}
.doc h2{font-size:24px;font-weight:800;margin:36px 0 12px;color:var(--accent);}
.doc p{font-size:18px;color:var(--text2);line-height:1.8;margin-bottom:16px;}
.doc ul{margin:0 0 16px;padding-inline-start:26px;}
.doc li{font-size:18px;color:var(--text2);line-height:1.8;margin-bottom:8px;}
.doc a{color:var(--accent);text-decoration:none;}
.doc a:hover{text-decoration:underline;}
.doc strong{color:var(--text);}
.doc .back{display:inline-block;margin-bottom:24px;font-size:16px;color:var(--text2);}
.doc-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:24px 0;}
.doc-card{background:var(--card);border:1.5px solid var(--border);border-radius:16px;padding:22px 24px;}
.doc-card h3{font-size:19px;margin-bottom:6px;}
.doc-card p{font-size:16px;margin:0;}

/* sources — credibility */
.sources h3{color:var(--text3);}
.sources-list{display:flex;flex-direction:column;gap:8px;}
.source-item{display:flex;flex-direction:column;gap:2px;padding:12px 16px;background:var(--bg2);
  border:1px solid var(--border);border-radius:10px;text-decoration:none;transition:border-color .2s;}
.source-item:hover{border-color:var(--accent);}
.source-domain{font-size:13px;font-weight:700;color:var(--accent);}
.source-title{font-size:15px;color:var(--text2);line-height:1.4;}

.hidden{display:none!important;}

@media(max-width:768px){
  body{font-size:18px;}
  .hero{padding:40px 0;}
  .hero h1{font-size:36px;letter-spacing:-1px;}
  .hero .sub{font-size:19px;}
  .quiz-q{font-size:24px;}
  .report-head h2{font-size:28px;}
  .rsection{padding:24px 22px;}
  .plan-grid{grid-template-columns:1fr;}
  .dir-tool a{width:100%;text-align:center;}
}