/* WEB DESIGN — "Blueprint studio": drafting grid, browser windows, pen-tool curves */
.rd-web-design .pg-hero.wd{background:#0A1440;isolation:isolate}
.rd-web-design .pg-hero.wd::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(156,200,255,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(156,200,255,.09) 1px,transparent 1px),linear-gradient(rgba(156,200,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(156,200,255,.04) 1px,transparent 1px);background-size:96px 96px,96px 96px,24px 24px,24px 24px;mask-image:radial-gradient(ellipse at 70% 40%,#000 30%,transparent 80%)}
.rd-web-design .wd-pen{right:-40px;top:70px;width:min(720px,60vw);height:520px;opacity:.9}
.rd-web-design .wd-pen path.c{stroke-dasharray:1400;stroke-dashoffset:1400;animation:rdDash 3.2s .4s cubic-bezier(.6,0,.2,1) forwards}
.rd-web-design .wd-sw{left:4%;bottom:38px;display:flex;gap:10px;z-index:1}
.rd-web-design .wd-sw i{width:34px;height:34px;border-radius:10px;display:block;box-shadow:0 8px 20px rgba(0,0,0,.35)}
.rd-web-design .wd-sw i:nth-child(2){animation-delay:-1.5s}.rd-web-design .wd-sw i:nth-child(3){animation-delay:-3s}.rd-web-design .wd-sw i:nth-child(4){animation-delay:-4.5s}
/* services: bento of browser windows */
.rd-web-design .wd-svc{background:#F3EFE6;overflow:hidden}
.rd-web-design .wd-svc::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(43,69,230,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(43,69,230,.08) 1px,transparent 1px);background-size:40px 40px}
.rd-web-design .wd-svc::after{content:"BUILD";position:absolute;right:-2vw;bottom:-6vw;font:800 22vw/1 var(--display);letter-spacing:-.05em;color:transparent;-webkit-text-stroke:2px rgba(43,69,230,.12);pointer-events:none}
.rd-web-design .wd-svc .h2{font-size:clamp(44px,6vw,92px)}
.rd-web-design .svc-grid{grid-template-columns:repeat(12,1fr);gap:22px;margin-top:20px}
.rd-web-design .svc{position:relative;border:0;border-radius:18px;padding:64px 30px 30px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(11,18,48,.45);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s;min-height:240px;display:flex;flex-direction:column}
.rd-web-design .svc::before{content:"";position:absolute;left:0;right:0;top:0;height:40px;background:radial-gradient(circle at 20px 20px,#FF6B4A 5px,transparent 6px),radial-gradient(circle at 38px 20px,#FFC53D 5px,transparent 6px),radial-gradient(circle at 56px 20px,#2BD67B 5px,transparent 6px),rgba(0,0,0,.08);border-bottom:1px solid rgba(0,0,0,.08)}
.rd-web-design .svc::after{content:"";position:absolute;left:80px;right:24px;top:12px;height:16px;border-radius:99px;background:rgba(255,255,255,.35)}
.rd-web-design .svc:hover{transform:translateY(-8px) rotate(-.6deg);box-shadow:0 40px 70px -30px rgba(11,18,48,.6)}
.rd-web-design .svc span{position:absolute;right:22px;bottom:-14px;font:800 120px/1 var(--display);color:transparent;-webkit-text-stroke:2px currentColor;opacity:.25;letter-spacing:-.04em}
.rd-web-design .svc h3{font:800 clamp(24px,2.4vw,34px)/1.05 var(--display);letter-spacing:-.02em;margin:18px 0 10px;max-width:14ch}
.rd-web-design .svc p{color:inherit;opacity:.85;font-size:16.5px;max-width:34ch;position:relative}
.rd-web-design .rd-ico{display:grid;place-items:center;width:58px;height:58px;border-radius:16px;background:rgba(255,255,255,.18)}
.rd-web-design .rd-ico svg{width:30px;height:30px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rd-web-design .svc:nth-child(1){grid-column:1/8;grid-row:span 2;background:var(--cobalt);color:#fff;min-height:500px;justify-content:flex-end}
.rd-web-design .svc:nth-child(1) h3{font-size:clamp(38px,4.4vw,64px)}
.rd-web-design .svc:nth-child(1) .rd-ico{position:absolute;top:70px;left:30px;width:84px;height:84px}
.rd-web-design .svc:nth-child(1) .rd-ico svg{width:44px;height:44px}
.rd-web-design .svc:nth-child(2){grid-column:8/13;background:var(--volt);color:var(--night)}
.rd-web-design .svc:nth-child(2) .rd-ico{background:rgba(11,18,48,.08)}
.rd-web-design .svc:nth-child(3){grid-column:8/13;background:#FF6B4A;color:#1b0b05}
.rd-web-design .svc:nth-child(3) .rd-ico{background:rgba(0,0,0,.08)}
.rd-web-design .svc:nth-child(4){grid-column:1/5;background:#fff;color:var(--night)}
.rd-web-design .svc:nth-child(4) .rd-ico{background:#EEF1FF;color:var(--cobalt)}
.rd-web-design .svc:nth-child(5){grid-column:5/9;background:var(--night);color:#fff}
.rd-web-design .svc:nth-child(5) .rd-ico{color:var(--volt)}
.rd-web-design .svc:nth-child(6){grid-column:9/13;background:var(--sky);color:var(--night)}
.rd-web-design .svc:nth-child(6) .rd-ico{background:rgba(255,255,255,.5)}
.rd-web-design .svc.reveal{transform:translateY(50px) scale(.96)}
.rd-web-design .svc.reveal.in{transform:none}
.rd-web-design .svc.reveal.in:hover{transform:translateY(-8px) rotate(-.6deg)}
/* process: cobalt band with a line that draws as you scroll */
.rd-web-design .process{background:var(--cobalt);color:#fff;overflow:hidden}
.rd-web-design .process .eyebrow{color:var(--volt)}
.rd-web-design .process .h2{color:#fff}
.rd-web-design .process .sub{color:#DCE2FF}
.rd-web-design .process .pgrid{position:relative;padding-top:46px}
.rd-web-design .process .pgrid::before{content:"";position:absolute;left:0;right:0;top:12px;height:4px;border-radius:4px;background:var(--volt);transform-origin:left;transform:scaleX(calc(var(--rp,0)*1.8 - .3))}
.rd-web-design .process .pgrid::after{content:"";position:absolute;left:0;right:0;top:13px;height:2px;background:rgba(255,255,255,.2)}
.rd-web-design .pstep{background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.22);color:#fff;backdrop-filter:blur(6px)}
.rd-web-design .pstep::before{content:"";position:absolute;top:-40px;left:24px;width:18px;height:18px;border-radius:50%;background:var(--volt);box-shadow:0 0 0 6px rgba(217,244,91,.25)}
.rd-web-design .pstep{overflow:visible}
.rd-web-design .pstep span{-webkit-text-stroke-color:var(--volt)}
.rd-web-design .pstep p{color:#DCE2FF}
.rd-web-design .pstep:nth-child(even){translate:0 40px}
.rd-web-design .pstep:hover{background:#fff;color:var(--night)}.rd-web-design .pstep:hover p{color:var(--slate)}.rd-web-design .pstep:hover span{-webkit-text-stroke-color:var(--cobalt)}
/* tiers: night with aurora glows */
.rd-web-design .tiers{background:radial-gradient(60% 50% at 15% 10%,rgba(43,69,230,.45),transparent 70%),radial-gradient(50% 45% at 90% 90%,rgba(217,244,91,.18),transparent 70%),#070C26;overflow:hidden}
.rd-web-design .tier{background:rgba(20,28,70,.75);backdrop-filter:blur(8px)}
.rd-web-design .tier.pop{background:linear-gradient(160deg,#3B57FF,#1A2FB8)}
.rd-web-design .tier.pop::before{content:"Most chosen";position:absolute;top:-14px;right:24px;background:var(--volt);color:var(--night);font:700 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;padding:8px 12px;border-radius:99px}
.rd-web-design .tiers .price b{font-family:var(--display);font-size:56px;letter-spacing:-.03em}
/* portfolio: paper with tilted gallery frames */
.rd-web-design .work-ph{background:#FBFAF6;overflow:hidden}
.rd-web-design .work-ph::before{content:"";position:absolute;left:-10%;right:-10%;top:42%;height:260px;background:var(--volt);transform:rotate(-4deg);opacity:.55}
.rd-web-design .pf{border-radius:16px;box-shadow:0 24px 50px -28px rgba(11,18,48,.5);position:relative}
.rd-web-design .pf-grid.three .pf:nth-child(3n+1){rotate:-1deg}.rd-web-design .pf-grid.three .pf:nth-child(3n){rotate:1deg}
.rd-web-design .pf:hover{rotate:0deg}
/* faq: coral split */
.rd-web-design .wd-faq{background:#FF6B4A;color:#1b0b05;overflow:hidden}
.rd-web-design .wd-faq::before{content:"?";position:absolute;right:4vw;top:-4vw;font:800 34vw/1 var(--display);color:rgba(255,255,255,.18);pointer-events:none}
.rd-web-design .wd-faq .h2{color:#1b0b05}
.rd-web-design .wfaq details{background:#fff;border-radius:16px;padding:6px 22px;margin-bottom:12px;box-shadow:0 14px 30px -18px rgba(0,0,0,.4);border:0}
.rd-web-design .wfaq summary{font-family:var(--display);font-weight:700;font-size:20px}
@media(max-width:1000px){.rd-web-design .svc-grid{grid-template-columns:1fr 1fr}.rd-web-design .svc:nth-child(n){grid-column:auto;grid-row:auto;min-height:220px}.rd-web-design .svc:nth-child(1){grid-column:1/-1;min-height:340px}.rd-web-design .pstep:nth-child(even){translate:none}.rd-web-design .wd-pen{opacity:.35}}
@media(max-width:600px){.rd-web-design .svc-grid{grid-template-columns:1fr}.rd-web-design .svc span{font-size:90px}.rd-web-design .svc:nth-child(1){min-height:0}.rd-web-design .svc:nth-child(1) .rd-ico{position:static;width:58px;height:58px}.rd-web-design .wd-sw{display:none}.rd-web-design .process .pgrid::before,.rd-web-design .process .pgrid::after,.rd-web-design .pstep::before{display:none}.rd-web-design .process .pgrid{padding-top:0}.rd-web-design .pf-grid.three .pf:nth-child(n){rotate:0deg}}