/* Riko wordmark: concept 03, typography with a diagonal terminal. */
.logo{display:inline-flex;align-items:baseline;gap:11px;white-space:nowrap;letter-spacing:-1.8px;font-weight:900;font-size:43px;line-height:1;color:var(--ink)}
.logo .wordmark{font:inherit;letter-spacing:inherit;margin:0;position:relative}.logo .wordmark:after{content:'';position:absolute;left:6px;top:8px;width:9px;height:6px;background:var(--paper);clip-path:polygon(0 0,100% 0,0 100%)}.logo .wordmark-web{font-size:19px;font-weight:700;letter-spacing:.2px;margin:0;color:var(--cyber)}html[data-theme="dark"] .logo .wordmark-web{text-shadow:0 0 10px #39f5e34a}.logo i{display:none}
.hero{position:relative;isolation:isolate;background:#060d16;color:#f2f9ff;min-height:760px;padding-top:38px;overflow:hidden}.hero:before{content:'';position:absolute;inset:0;z-index:-2;background-image:url('/assets/cyber-city-4k.webp');background-size:cover;background-position:center;animation:cityArrival 1.5s ease-out both}.hero:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(3,9,17,.91),rgba(3,9,17,.67) 48%,rgba(3,9,17,.12)),linear-gradient(0deg,#090b0d 0%,transparent 35%)}.hero h1{font-size:clamp(62px,8vw,116px);margin-top:80px;margin-bottom:40px;letter-spacing:-5px;max-width:1050px;text-shadow:0 3px 35px #0008}.hero h1 em{color:#53f7e5;filter:none!important}.hero .star{display:none}.hero>.eyebrow{color:#c7dadf}.hero .herobottom{flex-wrap:wrap;gap:28px 38px}.hero .herobottom>p{color:#d4e2e8!important;max-width:430px}.hero .button{background:#e53284;color:white;box-shadow:0 0 32px #e5328425}.hero .button:hover{background:#b81f68}.hero .build-motion{width:270px;height:190px;margin-left:auto;box-shadow:0 20px 50px #0008;opacity:.94}.hero .build-motion .code-pane{font-size:8px;padding:10px}.hero .build-motion .preview-pane{padding:10px}.hero .build-motion .preview-kicker{margin-top:10px}.hero .build-motion .preview-title i{height:10px}.hero .build-motion .preview-button{margin-top:15px}.hero .build-motion .preview-card{width:50px;height:48px}.hero .build-motion .preview-card:after{width:26px}.hero .herofoot{color:#bcced5;border-color:#ffffff30!important;margin-top:65px}.hero .herofoot a:hover{color:white}@keyframes cityArrival{from{opacity:0;transform:scale(1.025)}to{opacity:1;transform:scale(1)}}@media(max-width:1050px){.hero .build-motion{display:none}.hero{min-height:690px}}@media(max-width:720px){.logo{font-size:34px;gap:7px;letter-spacing:-1.2px}.logo .wordmark-web{font-size:16px;letter-spacing:.2px}.logo .wordmark:after{top:6px;left:5px;width:7px;height:5px}.hero{min-height:700px;padding-top:28px;padding-bottom:28px}.hero:before{background-position:64% center}.hero:after{background:linear-gradient(90deg,#030911db,#03091180),linear-gradient(0deg,#090b0d,transparent 65%)}.hero h1{font-size:clamp(51px,10.5vw,76px);letter-spacing:-2.8px;margin-top:100px;margin-bottom:32px}.hero .herobottom{display:flex;gap:28px}.hero .herobottom>p{flex-basis:100%;font-size:16px}.hero .herofoot{margin-top:55px}.hero .button{font-size:15px}}@media(prefers-reduced-motion:reduce){.hero:before{animation:none}}
.hero .city-lights{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;mix-blend-mode:screen}.hero .city-pause{display:block;margin:18px 0 0 auto;border:1px solid #ffffff40;border-radius:25px;background:#061019b3;color:#cee0e6;font:12px Arial;padding:9px 14px;cursor:pointer}.hero .herobottom{justify-content:flex-start}.hero:before{animation:none}.hero .city-pause:hover{border-color:#53f7e5}@media(prefers-reduced-motion:reduce){.city-lights,.city-pause{display:none!important}}

.hero .city-lights{mix-blend-mode:normal}

.hero:before{z-index:-2}.hero:after{z-index:0;pointer-events:none}.hero>.city-lights{z-index:1}.hero>.eyebrow,.hero>h1,.hero>.herobottom,.hero>.herofoot,.hero>.city-pause{position:relative;z-index:2}

/* Readable cyberpunk title: solid letterforms, restrained neon offsets and clear spacing. */
.hero .cyber-heading{position:relative;display:inline-block;max-width:1180px;margin-top:88px;margin-bottom:42px;font-family:Impact,"Arial Black","Arial Narrow",Arial,sans-serif;font-size:clamp(44px,5.7vw,82px);font-weight:900;font-style:italic;line-height:.68;letter-spacing:-.025em;text-transform:uppercase;transform:skewX(-3deg);filter:drop-shadow(0 0 12px #00f0e62e);isolation:isolate}
.hero .cyber-heading:before,.hero .cyber-heading:after{content:'';position:absolute;z-index:-1;left:0;width:102%;height:3px;pointer-events:none;clip-path:polygon(0 25%,94% 0,100% 50%,92% 100%,3% 72%)}
.hero .cyber-heading:before{top:-13px;background:#ed1672;box-shadow:0 5px 0 #ed16724f;transform:rotate(-1deg)}
.hero .cyber-heading:after{bottom:-13px;background:#00f0e6;box-shadow:0 -5px 0 #00f0e64f;transform:rotate(.6deg)}
.hero .cyber-heading>span:first-child,.hero .cyber-heading em{position:relative;display:inline-block;line-height:1;color:#d7eef0!important;-webkit-text-stroke:1px #f2ffff;text-shadow:3px 3px 0 #162027,4px 4px 0 #8f174f,0 0 15px #00f0e638;paint-order:stroke fill;animation:cyberSignal 7s steps(1,end) infinite}
.hero .cyber-heading>span:first-child:before,.hero .cyber-heading>span:first-child:after,.hero .cyber-heading em:before,.hero .cyber-heading em:after{content:none!important}
.hero .cyber-heading>span:first-child{font-size:.5625em;letter-spacing:-.005em}
.hero .cyber-heading em{margin-top:2px;font-size:.5em;letter-spacing:.02em;color:#ef2c84!important;-webkit-text-stroke:.8px #ffd3e7;text-shadow:3px 3px 0 #121a20,-3px 2px 0 #008f91,0 0 16px #ed16724a}
.hero .cyber-heading .star{display:none!important}
@keyframes cyberSignal{0%,89%,92%,100%{filter:brightness(1)}90%{filter:brightness(1.18)}91%{filter:brightness(.92)}}
@media(max-width:720px){.hero .cyber-heading{font-size:clamp(34px,9.4vw,49px);line-height:.72;letter-spacing:-.015em;margin-top:106px;margin-bottom:38px;padding-right:14px;transform:skewX(-2deg);filter:none}.hero .cyber-heading>span:first-child,.hero .cyber-heading em{-webkit-text-stroke:.7px #e8ffff;text-shadow:2px 2px 0 #162027,3px 3px 0 #9d1c59,0 0 10px #00f0e638}.hero .cyber-heading>span:first-child{padding-right:.22em;margin-right:-.22em;animation:none;filter:none;overflow:visible}.hero .cyber-heading em{font-size:.5em;margin-top:2px}.hero .cyber-heading:before,.hero .cyber-heading:after{height:2px}}
@media(prefers-reduced-motion:reduce){.hero .cyber-heading>span:first-child,.hero .cyber-heading em{animation:none}}

/* Primary hero CTA echoes the pink SEO wordmark without sacrificing readability. */
.hero .hero-order-button{position:relative;min-width:300px;padding:17px 22px 16px 24px;overflow:visible;border:1px solid #ed1672;border-radius:3px;background:linear-gradient(105deg,rgba(6,14,21,.96),rgba(18,19,30,.92));box-shadow:3px 3px 0 #008f91,-3px -3px 0 #8f174f,0 0 28px #ed16723d;transform:skewX(-3deg);isolation:isolate}
.hero .hero-order-button:before,.hero .hero-order-button:after{content:'';position:absolute;height:2px;pointer-events:none}
.hero .hero-order-button:before{top:-5px;left:14px;width:43%;background:#00f0e6;box-shadow:0 0 9px #00f0e6a3}
.hero .hero-order-button:after{right:14px;bottom:-5px;width:57%;background:#ed1672;box-shadow:0 0 9px #ed1672a3}
.hero .hero-order-button__label{font-family:Impact,"Arial Black","Arial Narrow",Arial,sans-serif;font-size:21px;font-weight:900;font-style:italic;line-height:1;letter-spacing:.035em;text-transform:uppercase;white-space:nowrap;color:#ef2c84;-webkit-text-stroke:.55px #ffd3e7;text-shadow:2px 2px 0 #121a20,-2px 2px 0 #008f91,0 0 12px #ed167280;animation:cyberSignal 7s steps(1,end) infinite}
.hero .hero-order-button .icon-arrow{color:#53f7e5;filter:drop-shadow(0 0 7px #00f0e6a3);transform:skewX(3deg)}
.hero .hero-order-button:hover{background:linear-gradient(105deg,rgba(15,19,28,.98),rgba(38,16,31,.96));transform:translateY(-3px) skewX(-3deg);box-shadow:4px 5px 0 #008f91,-3px -3px 0 #b31f63,0 0 36px #ed16725c}
@media(hover:hover){.hero .hero-order-button:hover .icon-arrow{transform:skewX(3deg) translate(2px,-2px)}}
@media(max-width:720px){.hero .hero-order-button{min-width:0;padding:17px 19px}.hero .hero-order-button__label{font-size:18px;letter-spacing:.02em}}
@media(prefers-reduced-motion:reduce){.hero .hero-order-button__label{animation:none}}

.service .service-price{display:inline-block;margin:-2px 0 17px;color:var(--accent);font-size:24px;font-weight:800;letter-spacing:-.5px}
.service:hover .service-price{color:var(--cyber)}
.seo-price{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:24px 0 10px;padding:17px 20px;border:1px solid #ffffff2e;color:#fff;font-size:20px;font-weight:800}
.seo-price span{color:var(--cyber);font-size:13px;letter-spacing:1.3px;text-transform:uppercase}
@media(max-width:720px){.service .service-price{font-size:22px}.seo-price{align-items:flex-start;flex-direction:column;font-size:19px}}
