/* Edilab home — calm lavender canvas, one purple sky up top, one dark band for the AI team, one sky at the end. */
:root{--ink:#14111c;--ink2:rgba(20,17,28,.64);--ink3:rgba(20,17,28,.46);--brand:#8b32ec;--brand-ink:#7d2fd0;--lav:#f6f5fb;--lav2:#efeaf9;--line:rgba(20,17,28,.08);--bg-white:#fff;--bg-soft:#f6f5fb;--fade:clamp(120px,13vw,200px);--card-sh:0 1px 2px rgba(60,30,120,.04),0 18px 40px -26px rgba(76,40,150,.28);--r:24px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg-soft);color:var(--ink);font-family:'Poppins',system-ui,sans-serif;font-weight:300;-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:#14111c;color:#fff;padding:10px 14px;border-radius:10px}.skip:focus{top:12px}
.wrap{width:min(1240px,100%);margin:0 auto;padding:0 clamp(18px,4vw,40px)}
.sec{padding:clamp(76px,10vw,128px) 0}
main>section{overflow-x:clip}
.sec+.team,.nums+.team{margin-top:0}
/* Section grounds: the page is one soft-grey canvas (cards need it for contrast). A white band never starts or
 * ends on a hard edge — it fades in and out over --fade, behind its content, without adding height.
 * .flush-top / .flush-bottom drop a fade where the neighbour is already white. */
.sec-tint{--ft:var(--fade);--fb:var(--fade);background:linear-gradient(180deg,var(--bg-soft) 0,var(--bg-white) var(--ft),var(--bg-white) calc(100% - var(--fb)),var(--bg-soft) 100%)}
.flush-top{--ft:0px}.flush-bottom{--fb:0px}
/* The shared footer ships its own off-white and a top rule; here it continues the canvas and settles into white. */
footer[data-screen-label]{background:linear-gradient(180deg,var(--bg-soft) 0,var(--bg-white) 85%)!important;border-top:0!important}
.head{max-width:760px;margin:0 auto clamp(36px,5vw,60px);text-align:center}
.head-row{max-width:none;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;text-align:left}
.head h2,.app h2,.faq h2{margin:16px 0 0;font-size:clamp(32px,4.4vw,56px);font-weight:400;letter-spacing:-.04em;line-height:1.08}
.head p,.app-copy>p,.faq-l>p{margin:16px auto 0;max-width:58ch;font-size:clamp(15px,1.3vw,17px);color:var(--ink2);font-weight:300;line-height:1.65}
.mute{color:var(--ink3)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:#fff;border:1px solid rgba(124,92,190,.14);font-family:'Poppins',system-ui,sans-serif;font-weight:400;font-size:13px;letter-spacing:0;color:var(--brand-ink)}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brand)}
.tag{display:inline-block;font-family:'Poppins',system-ui,sans-serif;font-weight:400;font-size:12.5px;letter-spacing:0;color:var(--brand-ink)}
.center{display:flex;justify-content:center;margin-top:clamp(36px,5vw,56px)}

/* buttons */
.btn-light,.btn-dark,.btn-ghost,.btn-line{display:inline-flex;align-items:center;gap:12px;min-height:52px;border-radius:999px;font-size:15px;font-weight:400;transition:transform .2s ease,background .2s ease,box-shadow .2s ease;white-space:nowrap}
.btn-light{background:#fff;color:var(--ink);padding:6px 6px 6px 24px;box-shadow:0 14px 30px -14px rgba(40,10,90,.45)}
.btn-dark{background:var(--ink);color:#fff;padding:6px 6px 6px 24px;margin-top:28px}
.btn-light .arr,.btn-dark .arr{width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--brand);color:#fff}
.btn-ghost{color:#fff;padding:0 26px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.btn-line{min-height:46px;padding:0 20px;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:14px}
.btn-light:hover,.btn-dark:hover,.btn-ghost:hover,.btn-line:hover{transform:translateY(-2px)}
.btn-ghost:hover{background:rgba(255,255,255,.2)}

/* ---------- hero ---------- */
.hero{padding:clamp(8px,1vw,14px) clamp(8px,1vw,14px) 0}
.hero-panel{position:relative;overflow:hidden;border-radius:clamp(24px,3vw,36px);padding:calc(84px + clamp(28px,5vh,72px)) 20px 0;display:flex;flex-direction:column;align-items:center;color:#fff;background:#6a34d6}
.hero-sky,.hero-sky img{position:absolute;inset:0;width:100%;height:100%}
.hero-sky img{object-fit:cover;object-position:center bottom}
.hero-copy{position:relative;z-index:2;text-align:center;max-width:900px}
.hero-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);font-size:12.5px;letter-spacing:.02em;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.hero-pill i{width:7px;height:7px;border-radius:50%;background:#e6d3ff;box-shadow:0 0 0 4px rgba(230,211,255,.25)}
.hero h1{margin:0;font-size:clamp(38px,min(5.76vw,8.46vh),83px);font-weight:400;letter-spacing:-.05em;line-height:1.02}
.hero h1 span,.cta h2 span{display:block;color:#e3ccff}
.hero-copy>p{margin:clamp(12px,1.9vh,18px) auto 0;max-width:60ch;font-size:clamp(15px,1.35vw,18px);font-weight:300;line-height:1.6;color:rgba(255,255,255,.86)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:clamp(16px,2.6vh,26px)}

/* the curved row of work: real projects, 4:5. Positions come from data-pos (-4..4, set by home.js) and spread to the
   hero's edges at every width; the centre card faces you, the sides turn inward. */
.arc{position:relative;z-index:2;width:100%;container-type:inline-size;--w:clamp(150px,min(15vw,30vh),360px);height:calc(var(--w) * 1.25 + var(--w) * .3);margin-top:clamp(28px,5vh,60px);--step:calc((50cqw - var(--w) * .25) / 4)}
.ac{animation:acIn .9s ease both;position:absolute;left:50%;top:0;width:var(--w);aspect-ratio:4/5;margin-left:calc(var(--w) / -2);border-radius:20px;overflow:hidden;background:#e9e1fb;box-shadow:0 30px 60px -28px rgba(30,6,80,.6),0 0 0 1px rgba(255,255,255,.45);
  --x:calc(var(--step) * var(--p,0));--y:calc(var(--w) * var(--yy,0));
  transform:translateX(var(--x)) translateY(var(--y)) perspective(1200px) translateZ(var(--z,0px)) rotateY(var(--ry,0deg));transition:transform 1.1s cubic-bezier(.65,0,.25,1),box-shadow .5s ease,opacity .6s ease;z-index:var(--zi,1)}
.ac.no-anim{transition:none!important}
.ac:hover{box-shadow:0 40px 70px -28px rgba(30,6,80,.7),0 0 0 1px rgba(255,255,255,.6)}
.ac img{width:100%;height:100%;object-fit:cover}
.ac[data-pos="0"]{--p:0;--zi:9}
.ac[data-pos="-1"]{--p:-1;--yy:.017;--ry:12deg;--zi:8}.ac[data-pos="1"]{--p:1;--yy:.017;--ry:-12deg;--zi:8}
.ac[data-pos="-2"]{--p:-2;--yy:.06;--z:-12px;--ry:24deg;--zi:7}.ac[data-pos="2"]{--p:2;--yy:.06;--z:-12px;--ry:-24deg;--zi:7}
.ac[data-pos="-3"]{--p:-3;--yy:.13;--z:-40px;--ry:36deg;--zi:6}.ac[data-pos="3"]{--p:3;--yy:.13;--z:-40px;--ry:-36deg;--zi:6}
.ac[data-pos="-4"]{--p:-4;--yy:.22;--z:-80px;--ry:46deg;--zi:5}.ac[data-pos="4"]{--p:4;--yy:.22;--z:-80px;--ry:-46deg;--zi:5}
@keyframes acIn{from{opacity:0}to{opacity:1}}
/* home: seven landscape cards, positions -3..3 */
/* Each card sits beside its neighbour with a real gap (--g) instead of under it, so no project hides another.
   The x offsets add up the projected widths of the turned cards (cos 16° / 30° / 42°), and --w is sized so the
   outer pair still runs into the hero's edges. */
.arc-land{--g:7px;--w:min(calc((50cqw - 3 * var(--g)) / 2.62), 450px);height:calc(var(--w) * .77)}
.arc-land .ac{transform:translateX(var(--x)) translateY(var(--y)) perspective(800px) translateZ(var(--z,0px)) rotateY(var(--ry,0deg));aspect-ratio:4/3;border-radius:18px;box-shadow:0 26px 50px -24px rgba(30,6,80,.55),0 0 0 1px rgba(255,255,255,.5)}
.arc-land .ac[data-pos="0"]{--x:0px;--ry:0deg;--yy:0;--z:0px}
.arc-land .ac[data-pos="1"]{--x:calc(var(--w) * .98 + var(--g));--ry:-16deg;--yy:.03;--z:-8px}
.arc-land .ac[data-pos="-1"]{--x:calc((var(--w) * .98 + var(--g)) * -1);--ry:16deg;--yy:.03;--z:-8px}
.arc-land .ac[data-pos="2"]{--x:calc(var(--w) * 1.894 + var(--g) * 2);--ry:-30deg;--yy:.09;--z:-22px}
.arc-land .ac[data-pos="-2"]{--x:calc((var(--w) * 1.894 + var(--g) * 2) * -1);--ry:30deg;--yy:.09;--z:-22px}
.arc-land .ac[data-pos="3"]{--x:calc(var(--w) * 2.699 + var(--g) * 3);--ry:-42deg;--yy:.19;--z:-40px}
.arc-land .ac[data-pos="-3"]{--x:calc((var(--w) * 2.699 + var(--g) * 3) * -1);--ry:42deg;--yy:.19;--z:-40px}
.hero-rate{position:relative;z-index:2;display:flex;align-items:center;gap:10px;margin:clamp(14px,2.1vh,22px) 0 0;padding:0 0 clamp(60px,7vh,72px);font-size:14px;color:rgba(255,255,255,.92);text-shadow:0 1px 8px rgba(60,20,120,.4)}
.hero-rate .st{color:#ffd45c;letter-spacing:3px}
.hero-rate .g{flex:none;width:26px;height:26px;border-radius:50%;background:#fff;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 6px 14px -6px rgba(30,6,80,.5)}

/* ---------- clients ---------- */
.logos{padding:30px 0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.logos-track{display:flex;gap:56px;width:max-content;animation:marq 48s linear infinite}
.logos-track span{font-size:clamp(17px,1.6vw,21px);font-weight:400;letter-spacing:-.02em;color:rgba(20,17,28,.32);white-space:nowrap}
@keyframes marq{to{transform:translateX(-50%)}}

/* ---------- before / after ---------- */
.ba{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.ba-card{display:grid;grid-template-columns:1fr;align-items:start;gap:22px;padding:clamp(18px,2.4vw,30px);border-radius:var(--r);background:#fff;box-shadow:var(--card-sh);border:1px solid rgba(124,92,190,.07)}
.viz{position:relative;aspect-ratio:16/10;border-radius:20px;overflow:hidden}
.ba-card>div:last-child{padding:0 6px 4px}
.ba-card .ticks{grid-template-columns:1fr 1fr;column-gap:18px}
.viz-bad{background:radial-gradient(80% 70% at 30% 20%,#fff1ee,#f7f2f8 70%)}
.viz-good{background:radial-gradient(80% 70% at 70% 20%,#efe4ff,#f6f2fd 70%);display:flex;align-items:center;justify-content:center;padding:6% 18%}
.nt{position:absolute;display:flex;align-items:center;gap:10px;width:min(300px,58%);padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.9);box-shadow:0 14px 28px -16px rgba(60,20,80,.35),0 0 0 1px rgba(20,17,28,.05);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.nt b{display:block;font-size:12.5px;font-weight:400;color:var(--ink)}.nt span{display:block;font-size:11px;color:var(--ink3)}
.nt-1{left:7%;top:10%;transform:rotate(-5deg)}.nt-2{right:6%;top:28%;transform:rotate(4deg)}.nt-3{left:10%;top:52%;transform:rotate(-2deg)}.nt-4{right:9%;top:72%;transform:rotate(5deg);opacity:.85}
.dot{flex:none;width:10px;height:10px;border-radius:50%}.dot.red{background:#e0584a}.dot.amber{background:#e8a33c}.dot.gray{background:#b9b4c4}
.dash{width:100%;padding:14px;border-radius:18px;background:#fff;box-shadow:0 24px 40px -24px rgba(76,40,150,.45),0 0 0 1px rgba(124,92,190,.08)}
.dash-h{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--ink);margin-bottom:10px}.dash-h em{font-style:normal;font-size:11px;color:#2b8e5e;background:#e4f6ec;padding:3px 9px;border-radius:999px}
.dash-r{display:flex;align-items:center;gap:10px;padding:8px;border-radius:12px;background:#f8f6fc;margin-top:6px}
.dash-r img{width:30px;height:30px;object-fit:cover;object-position:top;border-radius:9px;background:#efe5ff}
.dash-r .ic{width:30px;height:30px;border-radius:9px;background:#efe5ff;color:var(--brand-ink);display:flex;align-items:center;justify-content:center;font-size:14px}
.dash-r div{flex:1;min-width:0}.dash-r b{display:block;font-size:12px;font-weight:400}.dash-r span{display:block;font-size:10.5px;color:var(--ink3)}
.dash-r i{font-style:normal;width:20px;height:20px;border-radius:50%;background:var(--brand);color:#fff;font-size:11px;display:flex;align-items:center;justify-content:center}
.spark{width:100%;margin-top:10px}
.ba-card h3{margin:10px 0 14px;font-size:clamp(20px,1.9vw,26px);font-weight:400;letter-spacing:-.02em}
.ba-good{background:linear-gradient(160deg,#fff 30%,#f4ecff)}
.tag-bad{color:#b4483b}.tag-good{color:var(--brand-ink)}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ticks li{position:relative;padding-left:30px;font-size:15px;line-height:1.45;color:var(--ink2)}
.ticks li::before{content:"";position:absolute;left:0;top:1px;width:20px;height:20px;border-radius:50%;background:#efe7fd center/12px no-repeat}
.ticks.good li::before{background-color:#efe7fd;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d2fd0' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4.5 4.5L19 7'/%3E%3C/svg%3E")}
.ticks.bad li::before{background-color:#fbe9e6;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b4483b' stroke-width='3.4' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E")}

/* ---------- AI team (the one dark band) ---------- */
.team{width:min(1520px,100%);margin:0 auto;padding:0 clamp(12px,2vw,28px);color:#fff}
.team-panel{position:relative;overflow:hidden;border-radius:clamp(24px,3vw,36px);padding:clamp(72px,9vw,110px) 0 0;background:#6a34d6;isolation:isolate}
.team-panel>.wrap,.team-panel>.stage{position:relative;z-index:1}
.team .head-dark p{color:rgba(255,255,255,.86)}
.team .head-dark .mute{color:#e3ccff}
.team .head-dark .eyebrow{color:#fff;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.team .head-dark .eyebrow::before{background:#fff}
.team .fc{box-shadow:0 40px 70px -30px rgba(40,8,100,.75),inset 0 0 0 1px rgba(255,255,255,.28)}
.head-dark p{color:rgba(255,255,255,.7)}
.head-dark .mute{color:rgba(255,255,255,.45)}
.head-dark .eyebrow{color:#e3ccff;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14)}.head-dark .eyebrow::before{background:#b98cf5}
/* ---------- work ---------- */
.work{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.wk{display:flex;flex-direction:column;padding:12px 12px 22px;border-radius:var(--r);background:#fff;box-shadow:var(--card-sh);border:1px solid rgba(124,92,190,.07);transition:transform .25s ease}
.wk:hover{transform:translateY(-4px)}
.wk-img{aspect-ratio:3/2;border-radius:16px;overflow:hidden;background:var(--lav2)}
.wk-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.wk:hover .wk-img img{transform:scale(1.04)}
.wk .tag{margin:18px 8px 0}
.wk h3{margin:8px 8px 0;font-size:21px;font-weight:400;letter-spacing:-.02em}
.wk p{margin:8px 8px 0;font-size:14.5px;line-height:1.6;color:var(--ink2)}

/* ---------- numbers ---------- */
.nums{padding:0 0 clamp(76px,10vw,120px)}
.nums-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding-top:clamp(40px,5vw,56px);background:linear-gradient(90deg,transparent,var(--line) 18%,var(--line) 82%,transparent) top/100% 1px no-repeat}
.nums-row>div{padding:0 clamp(12px,2vw,28px)}
.nums-row>div+div{border-left:1px solid var(--line)}
.nums-row b{display:block;font-size:clamp(40px,5.2vw,72px);font-weight:400;letter-spacing:-.045em;line-height:1;background:linear-gradient(135deg,#14111c 30%,#7d2fd0);-webkit-background-clip:text;background-clip:text;color:transparent}
.nums-row span{display:block;margin-top:10px;font-size:14px;color:var(--ink2)}

/* ---------- client app ---------- */
.app{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(30px,5vw,70px);align-items:center}
.app-copy>p{margin-left:0}
.app-copy .ticks{margin-top:24px}
.phones{position:relative;height:clamp(440px,46vw,600px)}
.ph{position:absolute;top:50%;left:50%;width:clamp(170px,17vw,240px);aspect-ratio:780/1688;padding:8px;border-radius:34px;background:#fff;box-shadow:0 40px 70px -36px rgba(60,20,120,.5),0 0 0 1px rgba(124,92,190,.1)}
.ph img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:27px}
.ph-c{transform:translate(-50%,-50%);z-index:2}
.ph-l{transform:translate(-118%,-44%) rotate(-7deg)}
.ph-r{transform:translate(18%,-44%) rotate(7deg)}

/* ---------- process ---------- */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;counter-reset:s}
.steps li{position:relative;padding:14px 14px 24px;border-radius:var(--r);background:#fff;box-shadow:var(--card-sh);border:1px solid rgba(124,92,190,.07)}
.sv{position:relative;aspect-ratio:4/3;border-radius:16px;background:linear-gradient(160deg,#f6f1ff,#efe7fd);overflow:hidden;padding:16px;display:flex;flex-direction:column;justify-content:center;gap:8px}
.sv>*{position:relative}
.cal-h{font-size:12.5px;color:var(--ink)}
.cal-g{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;font-size:11px;text-align:center;color:var(--ink3)}
.cal-g span{padding:5px 0;border-radius:8px;background:#fff}.cal-g span:nth-child(-n+4){background:none;padding:0}
.cal-g .on{background:var(--brand);color:#fff}
.pillok{align-self:flex-start;font-size:11px;color:#2b8e5e;background:#e4f6ec;padding:5px 10px;border-radius:999px}
.sv-plan{background:linear-gradient(160deg,#f6f1ff,#efe7fd)}
.q-h{display:flex;justify-content:space-between;font-size:12.5px;color:var(--ink)}.q-h em{font-style:normal;font-size:10.5px;color:var(--brand-ink);background:#fff;padding:3px 9px;border-radius:999px}
.q-r{display:flex;justify-content:space-between;font-size:11.5px;color:var(--ink2);padding:6px 10px;background:#fff;border-radius:10px}
.q-t{display:flex;justify-content:space-between;align-items:baseline;font-size:11px;color:var(--ink3);padding:2px 4px}.q-t b{font-size:20px;font-weight:400;color:var(--ink);letter-spacing:-.02em}
.bw{display:flex;gap:4px;padding:8px 10px;background:#fff;border-radius:10px 10px 0 0}.bw i{width:7px;height:7px;border-radius:50%;background:#e2d6fa}
.bb{display:flex;flex-direction:column;gap:6px;padding:10px;background:#fff;border-radius:0 0 10px 10px;margin-top:-8px}
.bb span{display:block;height:7px;border-radius:4px;background:#ece5f8}.bb .l1{width:70%;background:#14111c}.bb .l2{width:50%}.bb .blk{height:26px;width:40%;border-radius:8px;background:var(--brand)}
.prog{display:flex;justify-content:space-between;font-size:11px;color:var(--ink3)}.prog b{font-weight:400;color:var(--brand-ink)}
.bar{height:6px;border-radius:99px;background:#fff;overflow:hidden}.bar i{display:block;width:68%;height:100%;background:var(--brand);border-radius:99px}
.sv-launch{justify-content:flex-end}
.curve{width:100%}
.chip{position:absolute!important;top:16px;right:16px;font-size:11.5px;color:#2b8e5e;background:#fff;padding:5px 10px;border-radius:999px;box-shadow:0 8px 16px -10px rgba(60,20,120,.4)}
.steps .n{display:block;margin:14px 8px 0;font-size:13px;color:var(--brand-ink)}
.steps h3{margin:6px 8px 0;font-size:19px;font-weight:400;letter-spacing:-.015em}
.steps p{margin:8px 8px 0;font-size:14px;line-height:1.6;color:var(--ink2)}

/* ---------- reviews (cards are refilled from the CMS by the server: .e-rvc) ---------- */
.rv-nav{display:flex;gap:8px}
.rv-nav button{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:#fff;font-family:'Poppins',system-ui,sans-serif;font-weight:300;font-size:18px;cursor:pointer;color:var(--ink)}
.rv-nav button:hover{border-color:var(--brand);color:var(--brand-ink)}
.rv-wrap{overflow:hidden;margin:0 calc(-1 * clamp(18px,4vw,40px));padding:6px clamp(18px,4vw,40px) 30px}
.rv-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.rv-track::-webkit-scrollbar{display:none}
.e-rvc{flex:0 0 min(400px,86vw);scroll-snap-align:start;margin:0;padding:26px;border-radius:var(--r);background:var(--lav);border:1px solid rgba(124,92,190,.08);display:flex;flex-direction:column;gap:16px}
.e-stars{color:#f2b630;letter-spacing:3px;font-size:15px}
.e-rvc blockquote{margin:0;font-size:16px;line-height:1.6;color:var(--ink);flex:1}
.e-rvc figcaption{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding-top:16px;border-top:1px solid var(--line)}
.e-rvc figcaption div{display:flex;flex-direction:column}
.e-rvc figcaption b{font-size:15px;font-weight:400}
.e-rvc figcaption span{font-size:12.5px;color:var(--ink3)}
.e-rvsrc{font-size:11px!important;letter-spacing:.04em;color:var(--brand-ink)!important;white-space:nowrap}

/* ---------- FAQ ---------- */
.faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(30px,5vw,80px);align-items:start}
.faq-l{position:sticky;top:110px}
.faq-l>p{margin-left:0}
.fitem{border-bottom:1px solid var(--line)}
.fq{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;border:0;background:none;text-align:left;font:inherit;font-size:clamp(16px,1.4vw,18px);font-weight:400;color:var(--ink);cursor:pointer}
.pm{flex:none;width:34px;height:34px;border-radius:50%;background:#fff;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-size:18px;font-weight:400;color:var(--brand-ink);transition:transform .3s ease,background .3s ease}
.fitem.open .pm{transform:rotate(45deg);background:var(--brand);color:#fff;border-color:var(--brand)}
.fa{overflow:hidden;max-height:0;transition:max-height .4s cubic-bezier(.2,.8,.2,1)}
.fa p{margin:0;padding:0 50px 22px 0;font-size:15px;line-height:1.7;color:var(--ink2)}
.fa a{color:var(--brand-ink);text-decoration:underline;text-underline-offset:2px}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}
.hero .rv{animation:heroIn .9s cubic-bezier(.2,.8,.2,1) both}
.hero .rv:nth-child(2){animation-delay:.08s}.hero .rv:nth-child(3){animation-delay:.16s}.hero .rv:nth-child(4){animation-delay:.24s}
@keyframes heroIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.rv,.hero .rv,.ac{opacity:1!important;animation:none!important;transition:none!important}.rv,.hero .rv{transform:none}.fc{transition:none}.logos-track{animation:none}html{scroll-behavior:auto}}

/* ---------- tablet ---------- */
@media (max-width:1080px){
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ba{grid-template-columns:1fr}
  .ac[data-pos="-4"],.ac[data-pos="4"]{opacity:0;pointer-events:none}
}
/* ---------- phones ---------- */
@media (max-width:760px){
  .hero{padding-top:8px}
  .hero-panel{min-height:0;padding-top:100px}
  .hero h1{font-size:clamp(36px,10.2vw,52px)}
  .arc{height:auto;perspective:none;display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:36px -20px 0;padding:0 20px 8px;scrollbar-width:none;width:calc(100% + 40px)}
  .arc::-webkit-scrollbar{display:none}
  .ac,.ac[data-pos]{display:block;position:relative;left:auto;top:auto;flex:0 0 auto;width:58vw;margin:0;transform:none!important;opacity:1!important;pointer-events:auto!important;scroll-snap-align:center;animation:none;transition:none}
  .head-row{flex-direction:column;align-items:flex-start}
  .head{text-align:left;margin-left:0}
  .head p{margin-left:0}
  .ba-card{grid-template-columns:1fr}
  .viz{aspect-ratio:4/3}
  .viz-good{padding:6%}
  .nt{width:78%}
  .ba-card .ticks{grid-template-columns:1fr}
  .work,.steps{grid-template-columns:1fr}
  .steps li{display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:14px;align-items:start;padding:14px}
  .steps .sv{grid-row:1/span 3;width:96px;aspect-ratio:1;padding:8px;gap:4px;transform:none}
  .steps .sv *{font-size:8px!important}
  .steps .sv .q-t b{font-size:12px!important}
  .steps .n,.steps h3,.steps p{margin-left:0;margin-right:0}
  .steps .n{margin-top:4px}
  .nums-row{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:34px}
  .nums-row>div:nth-child(3){border-left:none}
  .app{grid-template-columns:1fr}
  .phones{height:clamp(380px,110vw,480px)}
  .ph{width:clamp(150px,42vw,200px)}
  .ph-l{transform:translate(-112%,-44%) rotate(-7deg)}
  .ph-r{transform:translate(12%,-44%) rotate(7deg)}
  .faq{grid-template-columns:1fr}
  .faq-l{position:static}
  .fa p{padding-right:0}
  .hero-cta{flex-direction:column;align-items:stretch}
  .hero-cta a{justify-content:space-between}
  .btn-ghost{justify-content:center!important}
}

/* The shared menu and footer carry heavier inline weights for the other pages; on the home page everything is Poppins Regular / Light. */
[data-nav] [style*="font-weight:5"],[data-nav] [style*="font-weight:6"],[data-nav] [style*="font-weight:7"],
[data-menu] [style*="font-weight:5"],[data-menu] [style*="font-weight:6"],[data-menu] [style*="font-weight:7"],
footer [style*="font-weight:5"],footer [style*="font-weight:6"],footer [style*="font-weight:7"],
[data-nav] b,[data-menu] b,footer b,footer strong{font-weight:400!important}

/* ---------- header over the hero ----------
   At the top of the page the shared header sits on the purple sky: transparent, white logo and links,
   a white "Start a project". home.js sets html.nav-hero while the hero is under the header. */
[data-nav]{transition:background .45s ease,border-color .45s ease,transform .45s ease,backdrop-filter .45s ease,box-shadow .45s ease!important}
[data-nav] img,[data-nav] [data-mq-hide]>a,[data-nav] [data-dd-btn],[data-nav] [data-mq-cta],[data-nav] [data-menu-btn]{transition:color .35s ease,background .35s ease,border-color .35s ease,filter .35s ease,box-shadow .35s ease!important}
html.nav-hero [data-nav]{background:transparent!important;border-color:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:none!important}
html.nav-hero [data-nav]>a:first-child img{filter:brightness(0) invert(1)}
html.nav-hero [data-nav] [data-mq-hide]>a,html.nav-hero [data-nav] [data-dd-btn]{color:rgba(255,255,255,.86)!important}
html.nav-hero [data-nav] [data-mq-hide]>a:hover,html.nav-hero [data-nav] [data-dd-btn]:hover{color:#fff!important}
html.nav-hero [data-nav] [data-mq-cta]{background:#fff!important;color:#5b21b6!important;box-shadow:0 10px 24px -12px rgba(30,6,80,.5)}
html.nav-hero [data-nav] [data-menu-btn]{color:#fff!important;border-color:rgba(255,255,255,.5)!important}

/* ---------- AI team: a fanned arc of big, colourful cards; the centre one leads ---------- */
.team .head{margin-bottom:clamp(20px,3vw,36px)}
.team-cta{margin-top:26px}
.stage{position:relative;container-type:inline-size;--w:clamp(220px,26cqw,380px);height:calc(var(--w) * 1.12 + 40px);max-width:1500px;margin:0 auto}
.fan{position:absolute;inset:0}
.fc{position:absolute;left:50%;top:40px;width:var(--w);height:calc(var(--w) * 1.34);margin-left:calc(var(--w) / -2);border-radius:clamp(26px,2.4vw,36px);overflow:hidden;color:#fff;transform-origin:50% 100%;transform:translateX(var(--x,0)) translateY(var(--y,0)) rotate(var(--rot,0)) scale(var(--s,1));transition:transform .8s cubic-bezier(.2,.8,.2,1),filter .8s ease,box-shadow .8s ease;z-index:var(--zi,1);box-shadow:0 40px 80px -36px rgba(0,0,0,.85),inset 0 0 0 1px rgba(255,255,255,.18);filter:saturate(var(--sat,1)) brightness(var(--b,1));cursor:pointer}
.fc::before{content:"";position:absolute;inset:0;background:radial-gradient(90% 60% at 20% 0%,rgba(255,255,255,.35),transparent 60%);pointer-events:none}
.fc-t{position:relative;z-index:2;padding:clamp(20px,2vw,30px) clamp(20px,2vw,30px) 0}
.fc-t b{display:block;font-size:clamp(34px,3.4vw,52px);font-weight:400;letter-spacing:-.04em;line-height:1}
.fc-t span{display:block;margin-top:6px;font-size:clamp(14px,1.1vw,16px);color:rgba(255,255,255,.82)}
.fc img{position:absolute;left:50%;bottom:-16%;width:96%;height:auto;transform:translateX(-50%);filter:drop-shadow(0 24px 30px rgba(0,0,0,.3));transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.fc em{position:absolute;z-index:3;top:clamp(18px,1.8vw,26px);right:clamp(16px,1.6vw,22px);display:inline-flex;align-items:center;gap:8px;font-style:normal;font-size:13.5px;padding:7px 7px 7px 14px;border-radius:999px;background:#fff;color:var(--ink);box-shadow:0 10px 20px -10px rgba(0,0,0,.4);opacity:0;transform:translateY(-6px) scale(.96);transition:opacity .45s ease .25s,transform .45s ease .25s}
.fc em i{width:26px;height:26px;border-radius:50%;background:#14111c;color:#fff;display:inline-flex;align-items:center;justify-content:center}
.fc[data-pos="0"]{--zi:6}
.fc[data-pos="0"] em{opacity:1;transform:none}
.fc[data-pos="0"] img{transform:translateX(-50%) translateY(-3%)}
.fc[data-pos="-1"]{--x:calc(var(--w) * -.86);--y:5%;--rot:-7deg;--s:.93;--zi:5;--b:.92}
.fc[data-pos="1"]{--x:calc(var(--w) * .86);--y:5%;--rot:7deg;--s:.93;--zi:5;--b:.92}
.fc[data-pos="-2"]{--x:calc(var(--w) * -1.64);--y:15%;--rot:-13deg;--s:.86;--zi:4;--b:.8;--sat:.9}
.fc[data-pos="2"]{--x:calc(var(--w) * 1.64);--y:15%;--rot:13deg;--s:.86;--zi:4;--b:.8;--sat:.9}
.fc:not([data-pos="0"]):hover{--b:1;--sat:1}
.fc-sam{background:linear-gradient(160deg,#a66bff 0%,#7c3aed 55%,#5b21b6 100%)}
.fc-bruno{background:linear-gradient(160deg,#ff7a9a 0%,#f43f5e 55%,#be123c 100%)}
.fc-milo{background:linear-gradient(160deg,#6aa8ff 0%,#2f6df6 55%,#1d4ed8 100%)}
.fc-gus{background:linear-gradient(160deg,#4fe0b0 0%,#10b981 55%,#047857 100%)}
.fc-pixel{background:linear-gradient(160deg,#ffc35a 0%,#f59e0b 50%,#ea580c 100%)}
@media (prefers-reduced-motion:reduce){.fc,.fc img,.fc em{transition:none}}
/* phones: a swipeable row */
@media (max-width:760px){
  .stage{height:auto;--w:74vw}
  .fan{position:relative;inset:auto;display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 20px 40px;scrollbar-width:none}
  .fan::-webkit-scrollbar{display:none}
  .fc{position:relative;left:auto;top:auto;flex:0 0 auto;margin:0;transform:none!important;filter:none!important;scroll-snap-align:center}
  .fc em{opacity:1;transform:none}
}

/* ---------- What we build: staggered service cards (left) that expand on hover/tap, sticky copy (right) ---------- */
.svx{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(30px,5vw,80px);align-items:start}
.svx-cards{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.svx-copy{position:sticky;top:clamp(120px,22vh,200px)}
.svx-copy h2{margin:16px 0 0;font-size:clamp(34px,4.4vw,60px);font-weight:400;letter-spacing:-.045em;line-height:1.05}
.svx-copy>p{margin:18px 0 0;max-width:44ch;font-size:clamp(15px,1.3vw,17px);color:var(--ink2);line-height:1.65}
.sv-card{--ih:120px;display:flex;align-items:stretch;gap:0;border-radius:22px;background:#fff;border:1px solid rgba(124,92,190,.08);box-shadow:var(--card-sh);overflow:hidden;cursor:pointer;width:var(--cw);margin-left:var(--ml);transition:width .6s cubic-bezier(.2,.8,.2,1),margin .6s cubic-bezier(.2,.8,.2,1),box-shadow .4s ease;outline:none}
.sv-card:focus-visible{box-shadow:0 0 0 3px rgba(139,50,236,.5),var(--card-sh)}
.sv-1{--cw:78%;--ml:16%}.sv-2{--cw:84%;--ml:0%}.sv-3{--cw:80%;--ml:4%}.sv-4{--cw:70%;--ml:22%}
.sv-card.on{--ih:clamp(300px,30vw,400px);--cw:94%;--ml:0%;box-shadow:0 30px 60px -30px rgba(76,40,150,.4),0 0 0 1px rgba(124,92,190,.1)}
.sv-img{flex:none;width:calc(var(--ih) * .78);height:var(--ih);margin:8px;border-radius:16px;overflow:hidden;background:#e9e1fb;transition:height .6s cubic-bezier(.2,.8,.2,1),width .6s cubic-bezier(.2,.8,.2,1)}
.sv-img img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.sv-card.on .sv-img img{transform:scale(1)}
.sv-body{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;padding:14px clamp(16px,2vw,28px) 14px clamp(10px,1.2vw,16px)}
.sv-card h3{margin:0;display:flex;align-items:baseline;gap:12px;font-size:clamp(20px,1.9vw,28px);font-weight:400;letter-spacing:-.03em;line-height:1.15}
.sv-n{font-size:.62em;color:var(--brand-ink);letter-spacing:0}
.sv-more{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .6s cubic-bezier(.2,.8,.2,1),opacity .4s ease}
.sv-more>div{overflow:hidden}
.sv-card.on .sv-more{grid-template-rows:1fr;opacity:1;transition-delay:0s,.15s}
.sv-more p{margin:14px 0 0;font-size:15px;line-height:1.65;color:var(--ink2);max-width:40ch}
.sv-more a{display:inline-flex;gap:6px;margin-top:16px;font-size:14.5px;color:var(--brand-ink)}
.sv-more a:hover{text-decoration:underline;text-underline-offset:3px}
@media (prefers-reduced-motion:reduce){.sv-card,.sv-img,.sv-img img,.sv-more{transition:none!important}}
@media (max-width:900px){
  .svx{grid-template-columns:1fr}
  .svx-copy{position:static;order:-1}
  .sv-card,.sv-card.on{--cw:100%;--ml:0%}
  .sv-1{--cw:94%;--ml:6%}.sv-3{--cw:96%;--ml:2%}.sv-4{--cw:90%;--ml:10%}
  .sv-card{--ih:96px}
  .sv-card.on{flex-direction:column}
  .sv-card.on .sv-img{width:auto;height:clamp(220px,64vw,340px)}
  .sv-card.on .sv-body{padding:8px 18px 20px}
}

/* ---------- final CTA: Sam leaps out of the container ---------- */
.cta{--pt:clamp(130px,12vw,180px);position:relative;width:min(1520px,100%);margin:0 auto;padding:var(--pt) clamp(12px,2vw,28px) clamp(40px,5vw,64px)}
.cta-panel{position:relative;overflow:hidden;border-radius:clamp(24px,3vw,36px);min-height:clamp(340px,28vw,400px);padding:clamp(44px,5vw,70px) clamp(24px,4.5vw,64px);display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);align-items:center;color:#fff;background:#7a45e6}
.cta-copy{position:relative;z-index:2;grid-column:2;max-width:620px}
.cta h2{margin:22px 0 0;font-size:clamp(32px,3.6vw,54px);font-weight:400;letter-spacing:-.045em;line-height:1.04}
.cta h2 span{display:block;color:#e3ccff}
.cta-copy>p{margin:18px 0 0;max-width:50ch;font-size:clamp(15px,1.3vw,17px);color:rgba(255,255,255,.88);line-height:1.6}
.cta .hero-cta{justify-content:flex-start}
.cta-hero{position:absolute;z-index:3;left:clamp(18px,4vw,80px);top:calc(var(--pt) - clamp(80px,8vw,120px));width:clamp(290px,32vw,450px);pointer-events:none;animation:ctaFloat 6s ease-in-out infinite}
.cta-hero img{width:100%;height:auto;filter:drop-shadow(0 30px 40px rgba(40,8,100,.35))}
@keyframes ctaFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-14px) rotate(1deg)}}
.cta-clouds{position:absolute;left:clamp(12px,2vw,28px);bottom:clamp(40px,5vw,64px);width:46%;height:130px;z-index:4;pointer-events:none;overflow:hidden;border-radius:0 0 0 clamp(24px,3vw,36px)}
.cta-clouds i{transform:translateY(42%)}
.cta-clouds i{position:absolute;bottom:0;border-radius:50%;background:radial-gradient(closest-side,#fff 62%,rgba(255,255,255,.85) 80%,rgba(255,255,255,0));filter:blur(1px)}
.cta-clouds i:nth-child(1){left:0;width:34%;height:120px}
.cta-clouds i:nth-child(2){left:22%;width:30%;height:150px}
.cta-clouds i:nth-child(3){left:44%;width:26%;height:110px}
.cta-clouds i:nth-child(4){left:62%;width:22%;height:86px}
.cta-clouds i:nth-child(5){left:12%;width:20%;height:70px;bottom:60px;opacity:.9}
@media (prefers-reduced-motion:reduce){.cta-hero{animation:none}}
@media (max-width:900px){
  .cta{--pt:clamp(200px,52vw,300px)}
  .cta-panel{grid-template-columns:1fr;text-align:center;padding-top:clamp(70px,16vw,110px)}
  .cta-copy{grid-column:1;margin:0 auto}
  .cta .hero-cta{justify-content:center}
  .cta-hero{left:50%;bottom:auto;top:clamp(14px,4vw,30px)!important;width:clamp(240px,62vw,380px);margin-left:calc(clamp(240px,62vw,380px) / -2)}
  .cta-clouds{width:calc(100% - 2 * clamp(12px,2vw,28px));height:80px;border-radius:0 0 clamp(24px,3vw,36px) clamp(24px,3vw,36px)}
}

/* ---------- Pricing (cards generated from home/pricing.json) ---------- */
.pr-grid{display:grid;grid-template-columns:1fr 1.08fr 1fr;gap:20px;align-items:stretch}
.pr-card{position:relative;border-radius:28px;background:#fff;border:1px solid rgba(124,92,190,.1);box-shadow:var(--card-sh);overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease;color:var(--ink)}
.pr-card:hover{transform:translateY(-6px);box-shadow:0 30px 60px -30px rgba(76,40,150,.45),0 0 0 1px rgba(124,92,190,.12)}
.pr-in{position:relative;z-index:1;display:flex;flex-direction:column;height:100%;padding:clamp(26px,2.6vw,36px)}
.pr-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pr-top h3{margin:0;font-size:clamp(24px,2.2vw,30px);font-weight:400;letter-spacing:-.03em}
.pr-badge{flex:none;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.35);font-size:12.5px;color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.pr-tag{margin:8px 0 0;font-size:15px;line-height:1.5;color:var(--ink2)}
.pr-price{display:flex;align-items:baseline;gap:6px;margin:26px 0 4px}
.pr-price b{font-size:clamp(44px,4.4vw,60px);font-weight:400;letter-spacing:-.05em;line-height:1}
.pr-price span{font-size:16px;color:var(--ink3)}
.pr-list{list-style:none;margin:22px 0 0;padding:22px 0 0;border-top:1px solid var(--line);display:grid;gap:12px;flex:1}
.pr-list li{position:relative;padding-left:30px;font-size:14.5px;line-height:1.5;color:var(--ink2)}
.pr-list li::before{content:"";position:absolute;left:0;top:1px;width:20px;height:20px;border-radius:50%;background:#efe7fd url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237d2fd0' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4.5 4.5L19 7'/%3E%3C/svg%3E") center/12px no-repeat}
.pr-cta{margin-top:28px;justify-content:space-between}
/* the featured plan: purple sky, white text, a little taller */
.pr-feat{color:#fff;border:none;box-shadow:0 40px 70px -34px rgba(76,30,170,.7);background:#6a34d6}
.pr-feat .pr-tag{color:rgba(255,255,255,.85)}
.pr-feat .pr-price span{color:rgba(255,255,255,.75)}
.pr-feat .pr-list{border-top-color:rgba(255,255,255,.22)}
.pr-feat .pr-list li{color:rgba(255,255,255,.92)}
.pr-feat .pr-list li::before{background-color:rgba(255,255,255,.2);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4.5 4.5L19 7'/%3E%3C/svg%3E")}
.pr-feat:hover{box-shadow:0 50px 80px -34px rgba(76,30,170,.8)}
/* build your own */
.pr-q{margin:26px 0 14px;font-size:15px;color:var(--ink)}
.pr-opts{display:grid;gap:10px}
.pr-opt{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:18px;background:var(--lav);border:1px solid rgba(124,92,190,.1);transition:background .25s ease,border-color .25s ease,transform .25s ease}
.pr-opt:hover{background:#fff;border-color:rgba(139,50,236,.45);transform:translateX(3px)}
.pr-ic{flex:none;width:42px;height:42px;border-radius:13px;background:#efe5ff;color:var(--brand-ink);display:flex;align-items:center;justify-content:center}
.pr-ot{flex:1;min-width:0;display:flex;flex-direction:column}
.pr-ot b{font-weight:400;font-size:15.5px}
.pr-ot small{font-size:12.5px;color:var(--ink3)}
.pr-go{flex:none;width:32px;height:32px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--brand-ink);transition:background .25s,color .25s}
.pr-opt:hover .pr-go{background:var(--brand);color:#fff;border-color:var(--brand)}
.pr-note{margin:clamp(30px,4vw,44px) 0 0;text-align:center;font-size:15px;color:var(--ink2)}
.pr-note a{color:var(--brand-ink)}
.pr-note a:hover{text-decoration:underline;text-underline-offset:3px}
@media (max-width:1080px){.pr-grid{grid-template-columns:1fr 1fr}.pr-feat{grid-column:1/-1;order:-1}}
@media (max-width:760px){.pr-grid{grid-template-columns:1fr}.pr-own{order:2}}

/* home hero on phones: landscape cards in the swipe row */
@media (max-width:760px){.arc-land{margin-top:26px}.arc-land .ac,.arc-land .ac[data-pos]{width:76vw}.hero-rate{justify-content:center;flex-wrap:wrap;text-align:center}}

/* ---------- Selected work: full-width project cards that stack as you scroll ---------- */
.sw .head h2 span{display:block;color:#a07ad6}
.sw-stack{position:relative}
.sw-card{--p:0;position:sticky;top:calc(100px + var(--i) * 14px);display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(20px,3.4vw,52px);align-items:center;min-height:clamp(380px,54vh,520px);margin:0 0 clamp(28px,5vh,56px);padding:clamp(12px,1.3vw,18px);padding-right:clamp(24px,3.6vw,56px);border-radius:30px;background:color-mix(in srgb,var(--bc) 9%,#fff);border:1px solid color-mix(in srgb,var(--bc) 15%,transparent);box-shadow:0 30px 60px -40px rgba(30,6,80,.45);transform-origin:50% 0}
.sw-stack .sw-card.rv,.sw-stack .sw-card.rv.in{opacity:1;transform:scale(calc(1 - var(--p) * .06))}
.sw-card::after{content:"";position:absolute;inset:0;border-radius:inherit;background:#14111c;opacity:calc(var(--p) * .26);pointer-events:none}
.sw-card:last-child{margin-bottom:0}
.sw-img{display:block;border-radius:22px;overflow:hidden;aspect-ratio:4/3;background:#fff}
.sw-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.sw-card:hover .sw-img img{transform:scale(1.03)}
.sw-n{font-size:13px;color:color-mix(in srgb,var(--bc) 80%,#14111c)}
.sw-body h3{margin:10px 0 0;font-size:clamp(28px,3vw,44px);font-weight:400;letter-spacing:-.04em;line-height:1.05}
.sw-body h3 a:hover{color:color-mix(in srgb,var(--bc) 85%,#14111c)}
.sw-place{margin:8px 0 0;font-size:15px;color:var(--ink2)}
.sw-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}
.sw-chips span{padding:6px 12px;border-radius:999px;background:#fff;border:1px solid color-mix(in srgb,var(--bc) 18%,transparent);font-size:13px;color:var(--ink)}
.sw-line{margin:24px 0 0}
.sw-line.is-num{display:flex;align-items:baseline;gap:12px}
.sw-line.is-num b{font-size:clamp(44px,5vw,66px);font-weight:400;letter-spacing:-.05em;line-height:1;color:var(--ink)}
.sw-line.is-num span{font-size:15px;color:var(--ink2)}
.sw-line.is-quote{padding-left:16px;border-left:3px solid color-mix(in srgb,var(--bc) 60%,#fff);font-size:17px;line-height:1.55;color:var(--ink)}
.sw-line cite{display:block;margin-top:8px;font-style:normal;font-size:13px;color:var(--ink3)}
.sw-line.is-built{font-size:15.5px;line-height:1.6;color:var(--ink2);max-width:46ch}
.sw-line.is-built small{display:block;margin-bottom:6px;font-size:12.5px;color:color-mix(in srgb,var(--bc) 80%,#14111c)}
.sw-link{display:inline-flex;gap:6px;margin-top:24px;font-size:15px;color:var(--brand-ink)}
.sw-link:hover{text-decoration:underline;text-underline-offset:3px}
@media (max-width:900px){
  .sw-card{grid-template-columns:1fr;min-height:0;padding-right:clamp(12px,1.3vw,18px)}
  .sw-body{padding:4px 8px 14px}
}
/* phones and reduced motion: a plain list of cards (fade in on scroll, no sticky stack) */
@media (max-width:760px){
  .sw-card{position:relative;top:auto;margin-bottom:18px;border-radius:24px}
  .sw-stack .sw-card.rv{opacity:0;transform:translateY(22px)}
  .sw-stack .sw-card.rv.in{opacity:1;transform:none}
  .sw-card::after{display:none}
}
@media (prefers-reduced-motion:reduce){
  .sw-card{position:relative;top:auto}
  .sw-stack .sw-card.rv,.sw-stack .sw-card.rv.in{transform:none;opacity:1}
  .sw-card::after{display:none}
}
/* when the highlighted plan is the first card, it gets the wider column */
@media (min-width:1081px){.pr-grid:has(>.pr-feat:first-child){grid-template-columns:1.08fr 1fr 1fr}}
/* The two regular plans share one height (buttons aligned at the bottom); the highlighted plan reaches past them
   top and bottom, so it is always the larger card whichever column it sits in. */
.pr-own .pr-cta{margin-top:auto}
.pr-own .pr-opts{margin-bottom:22px}
@media (min-width:1081px){.pr-feat{margin-block:calc(-1 * clamp(16px,1.8vw,28px))}.pr-feat .pr-in{padding-block:calc(clamp(26px,2.6vw,36px) + clamp(16px,1.8vw,28px))}}
/* CTA copy and buttons sit above the decorative clouds (on phones the clouds overlap the second button) */
.cta-copy{z-index:5}
@media (max-width:900px){.cta .btn-ghost{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.5);color:#fff}}
/* Heroes start straight with the headline: no badge pill above the title (section badges further down stay) */
.hero .hero-copy>.hero-pill:first-child,.hero .hero-copy>.bl-crumbs:first-child{display:none}
.hero .hero-copy>.hero-pill:first-child+h1,.hero .hero-copy>h1:first-child{margin-top:0!important}
