@font-face{font-family:"Thmanyah Sans";font-weight:400;font-display:swap;src:url(fonts/thmanyahsans-Regular.otf) format("opentype")}
  @font-face{font-family:"Thmanyah Sans";font-weight:700;font-display:swap;src:url(fonts/thmanyahsans-Bold.otf) format("opentype")}
  @font-face{font-family:"Thmanyah Sans";font-weight:900;font-display:swap;src:url(fonts/thmanyahsans-Black.otf) format("opentype")}
  :root{
    --sky:#0593C6; --sky-deep:#036a91; --white:#FCFFFF; --pink:#D83995; --pink-soft:#ff7cc4;
    --navy:#0a2a4a; --navy-dim:#456a8a; --line:rgba(10,42,74,.12);
    --glass:rgba(255,255,255,.16); --glass-line:rgba(255,255,255,.34);
  }
  *{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
  body{margin:0;background:linear-gradient(160deg,#0593C6 0%,#047bab 55%,#036a91 100%) fixed;color:var(--white);
    font:16px/1.55 "Thmanyah Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
  a{color:inherit}
  :focus-visible{outline:3px solid var(--pink);outline-offset:3px}

  /* ---------- hero ---------- */
  .hero{position:relative;min-height:100svh;display:flex;flex-direction:column}
  .blobs{position:fixed;inset:0;z-index:-2;overflow:hidden;filter:blur(70px) saturate(1.1);pointer-events:none}
  .blob{position:absolute;border-radius:50%;opacity:.9;animation:drift 18s ease-in-out infinite alternate}
  .b1{width:46vmax;height:46vmax;left:12%;top:18%;background:radial-gradient(circle at 40% 40%,#fff 0,rgba(255,255,255,.0) 62%);opacity:.55}
  .b2{width:44vmax;height:44vmax;left:38%;top:34%;background:radial-gradient(circle,var(--pink) 0,rgba(216,57,149,0) 66%);animation-duration:22s}
  .b3{width:34vmax;height:34vmax;left:-6%;top:48%;background:radial-gradient(circle,#7fd6ff 0,rgba(127,214,255,0) 66%);animation-duration:26s;animation-direction:alternate-reverse}
  .b4{width:30vmax;height:30vmax;right:-6%;top:-8%;background:radial-gradient(circle,#0bb6f0 0,rgba(11,182,240,0) 66%);animation-duration:20s}
  @keyframes drift{from{transform:translate3d(-4%,-3%,0) scale(1)}to{transform:translate3d(6%,5%,0) scale(1.12)}}
  .grain{position:fixed;inset:0;z-index:-1;opacity:.14;mix-blend-mode:overlay;pointer-events:none;
    background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.5) 0 1px,transparent 1px 4px)}

  .wrap{width:100%;max-width:1120px;margin:0 auto;padding:0 20px}
  nav{display:flex;justify-content:space-between;align-items:center;padding:20px 0}
  .logo{font-weight:900;font-size:19px;letter-spacing:-.01em;text-decoration:none}
  .pill{display:flex;gap:4px;background:var(--glass);border:1px solid var(--glass-line);
    -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:14px;padding:5px}
  .pill a{text-decoration:none;font-size:14px;padding:8px 14px;border-radius:10px}
  .pill a:hover,.pill a.on{background:rgba(255,255,255,.22)}

  .hero-body{flex:1;display:grid;gap:28px;align-content:end;padding:36px 0 28px;
    grid-template-columns:1fr}
  @media (min-width:880px){.hero-body{grid-template-columns:1.25fr .75fr;align-items:end}}
  h1{margin:0;font-weight:400;font-size:clamp(46px,10.5vw,118px);line-height:.95;letter-spacing:-.045em}
  h1 b{font-weight:400;color:var(--pink-soft)}
  .sub{max-width:460px;font-size:clamp(15px,2vw,17px);color:rgba(252,255,255,.9);margin:18px 0 22px}
  .cta{display:flex;gap:10px;flex-wrap:wrap}
  .btn{display:inline-flex;align-items:center;gap:8px;font:700 15px/1 inherit;font-family:inherit;text-decoration:none;
    background:var(--white);color:var(--navy);padding:14px 20px;border-radius:12px;border:0;cursor:pointer}
  .btn.pink{background:var(--pink);color:#fff}
  .btn.glass{background:var(--glass);color:var(--white);border:1px solid var(--glass-line);
    -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}

  .panel{background:var(--glass);border:1px solid var(--glass-line);border-radius:22px;padding:16px;
    -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);display:grid;gap:10px}
  .panel .cap{font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:rgba(252,255,255,.8);padding:2px 4px}
  .slot{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);border-radius:16px;padding:14px;
    display:grid;gap:4px}
  .slot .t{display:flex;justify-content:space-between;align-items:center;gap:10px}
  .slot h3{margin:0;font-size:20px;font-weight:700}
  .slot p{margin:0;font-size:13px;color:rgba(252,255,255,.85)}
  .tag{font-size:12px;border-radius:999px;padding:3px 10px;background:rgba(255,255,255,.22);white-space:nowrap}
  .tag.free{background:var(--pink);color:#fff}

  .facts{display:grid;gap:18px;grid-template-columns:repeat(2,1fr);padding:22px 0 30px;
    border-top:1px solid rgba(255,255,255,.28);font-size:13px;color:rgba(252,255,255,.9)}
  @media (min-width:880px){.facts{grid-template-columns:repeat(5,1fr)}}
  .facts div{display:grid;gap:8px}
  .facts svg{width:18px;height:18px;stroke:var(--white);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

  /* ---------- below the fold: same glass ---------- */
  section{padding:72px 0 8px}
  h2{font-size:clamp(34px,6vw,64px);font-weight:400;letter-spacing:-.04em;margin:0 0 22px;line-height:.98}
  h2 b{font-weight:400;color:var(--pink-soft)}
  .grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
  .card,details,.steps li{background:var(--glass);border:1px solid var(--glass-line);
    -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
  .card{border-radius:22px;padding:20px;display:flex;flex-direction:column;gap:10px}
  .card h3{margin:0;font-size:24px;font-weight:700}
  .card p{margin:0;color:rgba(252,255,255,.88);flex:1}
  .row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:8px}
  .price{font-weight:900;font-size:24px}
  .card .btn{background:var(--white);color:var(--navy)}
  .card .btn.ghost{background:transparent;color:var(--white);border:1px solid var(--glass-line)}
  .badge{font-size:12px;border-radius:999px;padding:3px 10px;background:rgba(255,255,255,.22);color:#fff;white-space:nowrap}
  .badge.free{background:var(--pink)}
  .steps{counter-reset:s;display:grid;gap:12px;padding:0;list-style:none;margin:0}
  .steps li{counter-increment:s;border-radius:18px;padding:18px 18px 18px 62px;position:relative}
  .steps li::before{content:counter(s);position:absolute;left:18px;top:15px;width:30px;height:30px;border-radius:50%;
    background:var(--pink);color:#fff;font-weight:900;display:grid;place-items:center;font-size:14px}
  code{font-family:inherit;font-weight:700;background:rgba(255,255,255,.2);border-radius:6px;padding:1px 7px}
  details{border-radius:18px;padding:16px 20px;margin-bottom:10px}
  summary{cursor:pointer;font-weight:700;font-size:17px}
  details p{color:rgba(252,255,255,.88);margin:10px 0 0}
  form{display:flex;gap:10px;flex-wrap:wrap}
  input[type=email]{flex:1;min-width:220px;padding:15px 16px;border-radius:14px;border:1px solid var(--glass-line);
    background:rgba(255,255,255,.16);color:var(--white);font:inherit;
    -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
  input::placeholder{color:rgba(252,255,255,.7)}
  form .btn{background:var(--pink);color:#fff}
  .note{font-size:13px;color:rgba(252,255,255,.8);margin-top:12px}
  footer{margin-top:72px;padding:28px 0 44px;border-top:1px solid rgba(255,255,255,.28);color:rgba(252,255,255,.85);font-size:14px}
  footer a{color:rgba(252,255,255,.85)}
  button,input,summary{font-family:inherit}
  .band{overflow:hidden;white-space:nowrap;margin-top:8px;border-block:1px solid rgba(255,255,255,.28);padding:8px 0}
  .band span{display:inline-block;font-size:clamp(46px,9vw,120px);line-height:1;letter-spacing:-.04em;color:transparent;
    -webkit-text-stroke:1.5px rgba(255,255,255,.75);padding-right:.5em;animation:slide 30s linear infinite}
  .band span:nth-child(odd){-webkit-text-stroke-color:rgba(255,124,196,.95)}
  @keyframes slide{to{transform:translateX(-100%)}}
  .lead2{max-width:560px;color:rgba(252,255,255,.9);font-size:clamp(16px,2vw,19px);margin:-6px 0 24px}
  .how{display:grid;gap:18px}
  @media (min-width:880px){.how{grid-template-columns:1fr 1fr;align-items:start}}
  .steps li b{font-weight:700}
  .chat{background:var(--glass);border:1px solid var(--glass-line);border-radius:22px;padding:16px;display:grid;gap:10px;
    -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
  .chat .cap{font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:rgba(252,255,255,.8)}
  .msg{max-width:88%;padding:12px 16px;border-radius:18px;font-size:15px;opacity:0;transform:translateY(8px);animation:pop .5s ease forwards}
  .msg.you{justify-self:end;background:var(--white);color:var(--navy);border-bottom-right-radius:5px}
  .msg.ai{justify-self:start;background:rgba(255,255,255,.2);border:1px solid var(--glass-line);border-bottom-left-radius:5px}
  .msg:nth-of-type(1){animation-delay:.2s}.msg:nth-of-type(2){animation-delay:1.2s}.msg:nth-of-type(3){animation-delay:2.6s}
  @keyframes pop{to{opacity:1;transform:none}}
  .ticket{position:relative;border-style:dashed}
  .no{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--pink-soft)}
  .card .row:last-child{border-top:1px dashed rgba(255,255,255,.4);padding-top:14px}
  @media (prefers-reduced-motion:reduce){.blob,.band span{animation:none}.msg{opacity:1;transform:none;animation:none}html{scroll-behavior:auto}}

  .herowrap{flex:1;display:flex;flex-direction:column}
  .slots{display:grid;gap:10px}
  .row.first{margin-top:0}
  .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
  .how-line{font-size:13px;color:rgba(252,255,255,.8);font-family:inherit}
  .alt{color:rgba(252,255,255,.9);font-size:14px;text-decoration:underline;text-underline-offset:3px}
  .skillhead{padding:48px 0 8px}
  .skilltitle{font-weight:400;font-size:clamp(72px,18vw,200px);line-height:.9;letter-spacing:-.05em;margin:6px 0 14px}
  .no{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--pink-soft)}
  .cmd{display:flex;align-items:center;gap:10px;margin-top:10px;background:rgba(0,0,0,.22);border:1px solid var(--glass-line);
    border-radius:12px;padding:10px 12px}
  .cmd code{flex:1;background:none;padding:0;overflow-x:auto;white-space:nowrap}
  .copy{background:var(--pink);color:#fff;border:0;border-radius:9px;padding:8px 14px;font-weight:700;cursor:pointer}
  .pinkbtn{background:var(--pink);color:#fff}
  .steps li code{font-weight:700}