/* Homepage hero ported from the approved hero-preview.html design. */
.home-hero { --purple:#7950d2; --ink:#211b2f; --muted:#6c6479; color:var(--ink); font-family:'DM Sans',sans-serif; background:radial-gradient(ellipse at 76% 49%,#e8ddf7 0,transparent 49%),linear-gradient(120deg,#faf7ff,#f2edf9); overflow:hidden; padding:22px 5.4% 38px; }
.home-hero .wrap { max-width:1216px; margin:auto; }
.home-hero .hero-grid { gap:0; }
.home-hero .eyebrow { background:transparent; line-height:1.4; }
.home-hero a { color:inherit; text-decoration:none; }
.home-hero h1 { color:var(--ink); }
.home-hero .button { display:inline-flex; align-items:center; justify-content:center; gap:20px; background:var(--purple); color:white; border-radius:7px; padding:17px 23px; font-size:14px; font-weight:600; box-shadow:0 7px 18px #7950d219; transition:transform .2s,background .2s; }.home-hero .button:hover { transform:translateY(-2px); background:#6940bd; }.home-hero .header-cta { padding:13px 19px; font-size:12px; }.home-hero .hero-grid { display:grid; grid-template-columns:1.05fr 1fr; min-height:566px; align-items:center; position:relative; padding:24px 0 0; }.home-hero .copy { padding:0 0 33px; z-index:2; }.home-hero .eyebrow { display:inline-flex; align-items:center; gap:8px; color:#7853b7; border:1px solid #ded2ef; padding:7px 12px; border-radius:30px; font-size:10px; font-weight:700; letter-spacing:1.3px; text-transform:uppercase; }.home-hero .eyebrow i { width:5px; height:5px; background:var(--purple); border-radius:50%; }.home-hero h1 { font:800 clamp(42px,4.65vw,64px)/1.08 'Manrope',sans-serif; letter-spacing:-2.8px; margin:24px 0 20px; }.home-hero h1 span { color:var(--purple); }.home-hero .intro { font-size:16px; line-height:1.75; color:var(--muted); max-width:390px; margin:0 0 27px; }.home-hero .actions { display:flex; gap:24px; align-items:center; }.home-hero .results-link { color:#7150b5; display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600; }.home-hero .results-link b { display:grid; place-items:center; width:22px; height:22px; border:1.5px solid #997acb; border-radius:50%; font-size:12px; }.home-hero .proof { display:flex; gap:12px; align-items:center; margin-top:30px; }.home-hero .proof-icon { width:39px; height:39px; border-radius:50%; background:#e9ddf9; display:grid; place-items:center; color:var(--purple); font-size:20px; }.home-hero .proof strong { font-size:12px; font-weight:600; display:block; }.home-hero .proof p { margin:4px 0 0; font-size:11px; color:var(--muted); }.home-hero .visual { height:558px; position:relative; align-self:end; }.home-hero .wash { position:absolute; width:395px; height:445px; left:22px; top:60px; border-radius:49% 51% 44% 56% / 59% 40% 60% 41%; background:#ddcbf1; transform:rotate(-12deg); }.home-hero .wash:before, .home-hero .wash:after { content:''; position:absolute; background:#e2d3f3; width:340px; height:65px; border-radius:60%; transform:rotate(-24deg); left:-28px; top:40px; }.home-hero .wash:after { top:290px; left:-25px; width:425px; height:75px; }.home-hero .portrait { position:absolute; height:535px; width:430px; object-fit:contain; object-position:bottom; left:-8px; bottom:0; z-index:1; filter:drop-shadow(0 9px 12px #56403c13); }.home-hero .metrics { position:absolute; right:0; top:66px; display:flex; flex-direction:column; gap:15px; z-index:3; }.home-hero .metric { width:179px; min-height:91px; display:flex; align-items:center; gap:12px; padding:20px 16px; background:#ffffffdc; border:1px solid #ffffff; border-radius:12px; box-shadow:0 8px 30px #77559a05; backdrop-filter:blur(12px); }.home-hero .metric .icon { display:grid; place-items:center; width:34px; height:34px; background:#eee7f8; border-radius:50%; color:var(--purple); flex-shrink:0; font-size:18px; }.home-hero .metric strong { display:block; font:800 25px/1.2 'Manrope',sans-serif; letter-spacing:-.8px; }.home-hero .metric small { display:block; font-size:10px; color:var(--muted); margin-top:5px; }.home-hero .founder { position:absolute; bottom:36px; left:12px; z-index:4; background:#fffffff0; padding:13px 18px; border-radius:10px; box-shadow:0 5px 30px #5539790a; transform:rotate(-3deg); }.home-hero .founder strong { display:block; font-size:13px; }.home-hero .founder span { display:block; font-size:10px; color:var(--muted); margin-top:4px; }.home-hero .founder i { color:var(--purple); font-style:normal; }.home-hero .doodle { position:absolute; top:35px; left:-70px; width:95px; height:95px; z-index:3; transform:rotate(9deg); }.home-hero .spark { position:absolute; right:43px; bottom:39px; color:#483355; font-size:51px; line-height:1; transform:rotate(-10deg); }.home-hero .platforms { position:relative; z-index:5; border:1px solid #ffffff; background:#ffffffd4; border-radius:11px; padding:21px 35px 26px; text-align:center; }.home-hero .platforms p { font-size:11px; color:var(--muted); margin:0 0 21px; letter-spacing:.2px; }.home-hero .platform-list { display:flex; align-items:center; justify-content:space-around; gap:24px; }.home-hero .platform { display:flex; gap:7px; align-items:center; font-size:19px; font-weight:600; letter-spacing:-.6px; }.home-hero .google { font-weight:500; color:#49434e; }.home-hero .google b { color:#4285f4; font-size:23px; }.home-hero .meta b { color:#0866ff; font-size:34px; font-weight:500; line-height:24px; }.home-hero .linkedin { color:#1265a3; font-size:18px; }.home-hero .linkedin b { color:white; background:#1265a3; border-radius:3px; font-size:15px; padding:0 3px; }.home-hero .youtube b { font-size:11px; color:white; background:#ee3535; padding:5px 8px; border-radius:6px; }.home-hero .reddit { font-size:20px; }.home-hero .reddit b { color:#ff4500; font-size:25px; }.home-hero .microsoft { font-size:18px; font-weight:500; color:#59545d; }.home-hero .squares { display:grid; grid-template-columns:repeat(2,8px); gap:2px; }.home-hero .squares i { width:8px; height:8px; background:#f35325; }.home-hero .squares i:nth-child(2) {background:#81bc06}.home-hero .squares i:nth-child(3) {background:#05a6f0}.home-hero .squares i:nth-child(4) {background:#ffba08}
    @media(min-width:1500px) {.home-hero .hero-grid { min-height:650px; }.home-hero .visual { height:625px; }.home-hero .portrait { height:600px; width:475px; }.home-hero .wash { width:440px; height:500px; }.home-hero .metrics { top:100px; } }
    @media(max-width:1000px) {.home-hero nav { gap:18px; }.home-hero nav a:nth-last-child(-n+2) { display:none; }.home-hero { padding:0 4% 28px; }.home-hero h1 { font-size:49px; }.home-hero .portrait { left:-30px; width:370px; height:490px; }.home-hero .visual { height:510px; }.home-hero .metric { width:150px; padding:16px 12px; gap:8px; }.home-hero .metric strong {font-size:22px}.home-hero .wash {width:310px;height:380px;left:5px}.home-hero .platform-list {gap:14px;flex-wrap:wrap}.home-hero .platform {font-size:17px} }
    @media(max-width:720px) {.home-hero header { height:84px; gap:12px; }.home-hero .brand {font-size:20px}.home-hero .brand img {width:30px;height:30px}.home-hero nav {display:none}.home-hero .header-cta {font-size:10px;padding:12px}.home-hero {padding:0 6% 24px}.home-hero .hero-grid {grid-template-columns:1fr;padding-top:22px}.home-hero .copy {padding-bottom:0}.home-hero h1 {font-size:48px;letter-spacing:-2px;margin-top:22px}.home-hero .intro {font-size:15px;max-width:410px}.home-hero .eyebrow {font-size:8px;letter-spacing:1px}.home-hero .actions {gap:20px}.home-hero .button {padding:16px 18px;font-size:12px;gap:12px}.home-hero .results-link {font-size:12px}.home-hero .proof {margin-top:24px}.home-hero .visual {height:450px;margin-top:28px;width:100%;max-width:440px;justify-self:center}.home-hero .portrait {left:-24px;width:345px;height:445px}.home-hero .metrics {right:-5px;top:53px;gap:12px}.home-hero .metric {width:139px;min-height:76px;padding:15px 10px}.home-hero .metric .icon {width:27px;height:27px;font-size:15px}.home-hero .metric strong {font-size:22px}.home-hero .metric small {font-size:9px}.home-hero .wash {left:0;top:45px;width:310px;height:355px}.home-hero .founder {bottom:25px;left:0;padding:12px 14px}.home-hero .doodle {left:10px;top:-14px;width:65px;height:65px}.home-hero .spark {right:15px;bottom:27px}.home-hero .platforms {padding:20px 15px 23px}.home-hero .platform-list {display:grid;grid-template-columns:repeat(3,1fr);gap:21px 12px}.home-hero .platform {font-size:14px;justify-content:center}.home-hero .linkedin, .home-hero .microsoft {font-size:13px}.home-hero .platforms p {font-size:10px}.home-hero .meta b {font-size:26px}.home-hero .google b {font-size:20px}.home-hero .reddit b {font-size:21px} }
    @media(prefers-reduced-motion:reduce){.home-hero .button {transition:none}}
  
.home-hero .button { color:#fff; }
.home-hero .results-link { color:#7150b5; }
.home-hero .platform { color:var(--ink); }
.home-hero .platform img { width:24px; height:24px; object-fit:contain; }
.home-hero h1 { font-size:clamp(36px,4vw,56px); letter-spacing:-2px; }
.home-hero .intro { margin-bottom:16px; }
.home-hero .experience { max-width:390px; margin:0 0 27px; font-size:14px; line-height:1.7; color:var(--muted); }
.home-hero .experience strong { font-weight:600; color:var(--ink); }
.home-hero .doodle { transform-origin:50% 60%; animation:hero-arrow-sway 7s ease-in-out infinite; }
.home-hero .metric { animation:hero-card-float 6s ease-in-out infinite; }
.home-hero .metric:nth-child(2) { animation-duration:7s; animation-delay:-2s; }
.home-hero .metric:nth-child(3) { animation-duration:8s; animation-delay:-4s; }
.home-hero .founder { animation:hero-founder-float 8s ease-in-out infinite; animation-delay:-3s; }
.home-hero .spark { animation:hero-spark-sway 9s ease-in-out infinite; }
@keyframes hero-arrow-sway {
  0%,100% { transform:translate(0,0) rotate(9deg); }
  50% { transform:translate(3px,5px) rotate(13deg); }
}
@keyframes hero-card-float {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-6px); }
}
@keyframes hero-founder-float {
  0%,100% { transform:translateY(0) rotate(-3deg); }
  50% { transform:translateY(-5px) rotate(-2deg); }
}
@keyframes hero-spark-sway {
  0%,100% { transform:rotate(-10deg); }
  50% { transform:translateY(-4px) rotate(-2deg); }
}
@media(prefers-reduced-motion:reduce) {
  .home-hero .doodle,.home-hero .metric,.home-hero .founder,.home-hero .spark { animation:none; }
}
@media(max-width:720px) { .home-hero .platform img { width:19px; height:19px; } }
@media(max-width:720px) { .home-hero h1 { font-size:36px; letter-spacing:-1.5px; } }
@media(max-width:380px) { .home-hero h1 { font-size:32px; } .home-hero .actions { gap:13px; } .home-hero .button { padding:16px 13px; } }
