/* ===== Mediandseo — Bold Kinetic design system ===== */
:root{
  --bg:#0f0f0f;--ink:#f5f5f0;--lime:#d7ff00;--pink:#ff3d81;--blue:#2b4bff;
  --mut:#9a9a92;--glass:rgba(255,255,255,.04);--line:rgba(255,255,255,.14);--card:#161616;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:'Helvetica Neue','Arial',sans-serif;overflow-x:hidden;cursor:none}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1240px;margin:0 auto;padding:0 30px}
.sr-only{position:absolute;left:-9999px}

/* custom cursor */
.cursor{position:fixed;width:22px;height:22px;border:2px solid var(--lime);border-radius:50%;pointer-events:none;z-index:1000;transition:transform .12s,background .2s,width .2s,height .2s;transform:translate(-50%,-50%)}
.cursor.big{width:60px;height:60px;background:rgba(215,255,0,.15)}
@media(max-width:760px){body{cursor:auto}.cursor{display:none}}

/* nav */
nav{position:fixed;top:0;left:0;right:0;z-index:60;background:rgba(15,15,15,.72);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.06)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:78px}
.logo{font-weight:800;font-size:22px;letter-spacing:-1px}
.logo .n{color:var(--pink);display:inline-block;transform:rotate(-10deg) skewX(-8deg);font-style:italic;margin:0 2px}
.nlinks{display:flex;gap:28px;font-size:14px;text-transform:uppercase;letter-spacing:1px;align-items:center}
.nlinks a{color:var(--ink);opacity:.85;transition:.2s}
.nlinks a:hover,.nlinks a.active{opacity:1;color:var(--lime)}
.nav-cta{background:var(--pink);color:#fff;padding:11px 20px;border-radius:40px;font-weight:800;letter-spacing:.5px;transition:.2s}
.nav-cta:hover,.nav-cta.active{background:var(--pink);color:#fff;box-shadow:0 6px 20px rgba(255,61,129,.4)}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px}
.burger span{width:26px;height:3px;background:var(--ink);border-radius:3px;transition:.3s}
.burger.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.mobile-menu{position:fixed;inset:78px 0 0;background:var(--bg);z-index:55;transform:translateX(100%);transition:.35s;display:flex;flex-direction:column;padding:40px 30px;gap:8px}
.mobile-menu.open{transform:none}
.mobile-menu a{font-size:34px;font-weight:800;text-transform:uppercase;letter-spacing:-1px;padding:14px 0;border-bottom:1px solid var(--line)}
.mobile-menu a:hover{color:var(--lime)}
@media(max-width:860px){.nlinks{display:none}.burger{display:flex}}

/* buttons */
.cta{display:inline-flex;align-items:center;gap:12px;background:var(--lime);color:#0f0f0f;padding:18px 32px;border-radius:60px;font-weight:800;font-size:16px;text-transform:uppercase;letter-spacing:1px;transition:.25s;border:none;cursor:pointer}
.cta:hover{background:var(--pink);color:#fff}
.cta.ghost{background:transparent;color:var(--ink);border:2px solid var(--line)}
.cta.ghost:hover{border-color:var(--lime);color:var(--lime);background:transparent}

/* page hero (inner pages) */
.phero{padding:150px 0 60px}
.phero .eyebrow{color:var(--pink);font-weight:800;font-size:14px;letter-spacing:3px;text-transform:uppercase}
.phero h1{font-size:clamp(48px,11vw,140px);font-weight:800;text-transform:uppercase;letter-spacing:-4px;line-height:.9;margin-top:16px}
.phero h1 .l{color:var(--lime)}.phero h1 .o{-webkit-text-stroke:2px var(--ink);color:transparent}
.phero .lead{max-width:560px;font-size:18px;color:var(--mut);line-height:1.55;margin-top:26px}

/* marquee */
.mband{background:var(--lime);color:#0f0f0f;padding:22px 0;overflow:hidden;white-space:nowrap;transform:rotate(-2deg)}
.mband div{display:inline-block;animation:sc 18s linear infinite;font-size:40px;font-weight:800;text-transform:uppercase;letter-spacing:-1px}
.mband span{margin:0 20px}.mband .star{color:var(--pink)}
@keyframes sc{to{transform:translateX(-50%)}}

/* home hero */
.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:100px 0 40px}
.mega{font-size:clamp(56px,14vw,190px);font-weight:800;line-height:.86;letter-spacing:-4px;text-transform:uppercase}
.mega .l{color:var(--lime)}.mega .o{-webkit-text-stroke:2px var(--ink);color:transparent}.mega .p{color:var(--pink)}
.herobtm{display:flex;justify-content:space-between;align-items:flex-end;margin-top:40px;flex-wrap:wrap;gap:20px}
.herobtm p{max-width:420px;font-size:17px;color:var(--mut);line-height:1.5}

/* service rows */
.rows{padding:90px 0}
.srow{border-top:1px solid rgba(255,255,255,.15);padding:36px 0;display:flex;align-items:center;justify-content:space-between;transition:.35s}
.srow:last-child{border-bottom:1px solid rgba(255,255,255,.15)}
.srow .num{font-size:16px;color:var(--mut);width:60px}
.srow .name{font-size:clamp(28px,6vw,64px);font-weight:800;text-transform:uppercase;letter-spacing:-2px;flex:1}
.srow .desc{max-width:300px;font-size:15px;color:var(--mut);opacity:0;transition:.35s}
.srow:hover{padding-left:24px;background:var(--pink);color:#fff}
.srow:hover .name,.srow:hover .num{color:#fff}.srow:hover .desc{opacity:1}
.srow .arrow{font-size:32px;opacity:0;transition:.35s;width:44px;text-align:right}
.srow:hover .arrow{opacity:1}
@media(max-width:760px){.srow .desc{display:none}}

/* section heading */
.shead{text-align:center;max-width:680px;margin:0 auto 54px}
.shead .eyebrow{color:var(--pink);font-weight:800;font-size:14px;letter-spacing:3px;text-transform:uppercase}
.shead h2{font-size:clamp(36px,7vw,80px);font-weight:800;text-transform:uppercase;letter-spacing:-3px;line-height:.92;margin:14px 0}
.shead h2 .l{color:var(--lime)}
.shead .hint,.shead p{color:var(--mut);font-size:16px;line-height:1.55;text-transform:none;letter-spacing:0}

/* tilt cards */
.caps{padding:90px 0}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.tcard{background:var(--glass);border:1px solid var(--line);border-radius:18px;padding:30px;transition:transform .15s ease-out,box-shadow .25s,border-color .25s;transform-style:preserve-3d;cursor:pointer}
.tcard:hover{box-shadow:0 24px 60px rgba(215,255,0,.12);border-color:var(--lime)}
.tcard .ic{width:56px;height:56px;border-radius:14px;background:var(--lime);color:#0f0f0f;display:grid;place-items:center;font-size:26px;margin-bottom:18px}
.tcard h4{font-size:20px;margin-bottom:8px;text-transform:uppercase;letter-spacing:-.5px}
.tcard p{color:var(--mut);font-size:14px;line-height:1.6}
@media(max-width:820px){.cards{grid-template-columns:1fr}}

/* stats */
.stats{max-width:1240px;margin:0 auto;padding:80px 30px;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;text-align:center}
.stats .n{font-size:clamp(44px,7vw,90px);font-weight:800;color:var(--lime);letter-spacing:-2px}
.stats .t{color:var(--mut);text-transform:uppercase;letter-spacing:1px;font-size:13px}
@media(max-width:700px){.stats{grid-template-columns:1fr;gap:30px}}

/* generic content grid */
.split{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;padding:80px 30px}
.split h2{font-size:clamp(30px,5vw,56px);font-weight:800;text-transform:uppercase;letter-spacing:-2px;line-height:.95;margin-bottom:20px}
.split h2 .l{color:var(--lime)}
.split p{color:var(--mut);font-size:16px;line-height:1.7;margin-bottom:16px}
.split ul{list-style:none;margin-top:10px}
.split li{padding:10px 0 10px 30px;position:relative;font-size:16px}
.split li:before{content:"→";position:absolute;left:0;color:var(--lime);font-weight:800}
@media(max-width:820px){.split{grid-template-columns:1fr;gap:26px}}

/* case study cards */
.cases{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;padding:20px 0 40px}
.case{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:32px;transition:.3s}
.case:hover{border-color:var(--lime);transform:translateY(-6px)}
.case .trade{color:var(--pink);font-weight:800;text-transform:uppercase;letter-spacing:2px;font-size:13px}
.case h3{font-size:28px;font-weight:800;letter-spacing:-1px;margin:6px 0 4px}
.case .loc{color:var(--mut);font-size:14px;margin-bottom:20px}
.case .rankbar{display:flex;align-items:center;gap:14px;margin-bottom:18px;font-weight:800;font-size:15px}
.case .rankbar .from{color:var(--mut)}.case .rankbar .to{color:var(--lime);font-size:22px}
.case p{color:var(--mut);font-size:15px;line-height:1.6;margin-bottom:20px}
.case .kpis{display:flex;gap:14px}
.case .kpi{flex:1;background:var(--glass);border:1px solid var(--line);border-radius:12px;padding:14px;text-align:center}
.case .kpi .k{font-size:26px;font-weight:800;color:var(--lime)}
.case .kpi .l2{font-size:12px;color:var(--mut);text-transform:uppercase;letter-spacing:1px}
@media(max-width:760px){.cases{grid-template-columns:1fr}}

/* pricing */
.pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:20px 0 40px}
.plan{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:34px;display:flex;flex-direction:column;transition:.3s}
.plan:hover{transform:translateY(-6px);border-color:var(--lime)}
.plan.feat{border-color:var(--lime);background:linear-gradient(180deg,rgba(215,255,0,.06),transparent)}
.plan .badge{align-self:flex-start;background:var(--pink);color:#fff;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1.5px;padding:5px 12px;border-radius:40px;margin-bottom:16px}
.plan .pname{font-size:15px;text-transform:uppercase;letter-spacing:2px;color:var(--mut);font-weight:700}
.plan .price{font-size:56px;font-weight:800;letter-spacing:-2px;margin:8px 0 2px}
.plan .price span{font-size:16px;color:var(--mut);letter-spacing:0}
.plan .tagline{color:var(--mut);font-size:14px;margin-bottom:22px;line-height:1.5}
.plan ul{list-style:none;margin-bottom:26px;flex:1}
.plan li{padding:9px 0 9px 28px;position:relative;font-size:15px;border-bottom:1px solid rgba(255,255,255,.06)}
.plan li:before{content:"✓";position:absolute;left:0;color:var(--lime);font-weight:800}
.plan .cta{justify-content:center;width:100%}
@media(max-width:860px){.pricing{grid-template-columns:1fr}}

/* team */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:20px 0 40px}
.member{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:30px;text-align:center;transition:.3s}
.member:hover{border-color:var(--lime);transform:translateY(-6px)}
.member .ava{width:88px;height:88px;border-radius:50%;margin:0 auto 18px;display:grid;place-items:center;font-size:32px;font-weight:800;background:var(--lime);color:#0f0f0f}
.member h4{font-size:20px;text-transform:uppercase;letter-spacing:-.5px}
.member .role{color:var(--pink);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;margin:4px 0 12px}
.member p{color:var(--mut);font-size:14px;line-height:1.55}
@media(max-width:760px){.team{grid-template-columns:1fr}}

/* contact form */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;padding:40px 0 60px}
.cinfo h3{font-size:24px;text-transform:uppercase;letter-spacing:-1px;margin:24px 0 6px}
.cinfo p{color:var(--mut);font-size:16px;line-height:1.6}
.cinfo a{color:var(--lime)}
.form{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:34px}
.form .row{margin-bottom:20px}
.form label{display:block;font-size:13px;text-transform:uppercase;letter-spacing:1.5px;font-weight:700;margin-bottom:8px;color:var(--mut)}
.form input,.form select,.form textarea{width:100%;background:#0f0f0f;border:1px solid var(--line);border-radius:12px;padding:14px 16px;color:var(--ink);font-size:15px;font-family:inherit;transition:.2s}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--lime)}
.form textarea{min-height:120px;resize:vertical}
.form .err{color:var(--pink);font-size:13px;margin-top:6px;display:none}
.form .row.bad .err{display:block}
.form .row.bad input,.form .row.bad textarea,.form .row.bad select{border-color:var(--pink)}
.form-success{display:none;text-align:center;padding:30px 0}
.form-success .big{font-size:48px;margin-bottom:12px}
.form-success h3{font-size:26px;text-transform:uppercase;letter-spacing:-1px;color:var(--lime)}
.form-success p{color:var(--mut);margin-top:8px}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr;gap:30px}}

/* CTA band */
.band{padding:120px 30px;text-align:center;background:var(--blue)}
.band h2{font-size:clamp(40px,9vw,110px);font-weight:800;text-transform:uppercase;letter-spacing:-3px;line-height:.9}
.band .cta{margin-top:36px;background:var(--lime);color:#0f0f0f}
.band .cta:hover{background:#fff}

/* footer */
footer{padding:60px 0 40px;border-top:1px solid var(--line)}
footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px;margin-bottom:40px}
footer .logo{font-size:26px;margin-bottom:12px}
footer p{color:var(--mut);font-size:14px;line-height:1.6;max-width:320px}
footer h5{text-transform:uppercase;letter-spacing:2px;font-size:12px;color:var(--mut);margin-bottom:14px}
footer .fl a{display:block;padding:6px 0;font-size:15px;opacity:.85}
footer .fl a:hover{color:var(--lime);opacity:1}
footer .copy{color:var(--mut);font-size:13px;text-transform:uppercase;letter-spacing:1px;border-top:1px solid rgba(255,255,255,.08);padding-top:24px}
@media(max-width:760px){footer .cols{grid-template-columns:1fr;gap:24px}}

/* reveal */
.reveal{opacity:0;transform:translateY(30px);transition:.7s}
.reveal.in{opacity:1;transform:none}