/* Studio case study (_case-study-studio.php): the Atlas build (case-study-atlas.css) retinted to Studio's own look.
   Studio blue #0060FF, night #0A0F1B, card #151E2F, canvas #F2F5F9; Instrument Sans for titles, Geist Mono for labels. */
.c27x.st{--red:#0060FF;--blue:#0060FF;--blue-lt:#8FB5FF;--lime:#8FB5FF;--ink:#0A0F1B;--stage:#0A0F1B;--navy:#0A0F1B;--soft:#F2F5F9;--tint:#E3ECFF;--pop:"Instrument Sans",system-ui,sans-serif}
.c27x.st h1,.c27x.st h2{letter-spacing:-.035em!important}
.c27x.st .cf-toc a:hover{color:#fff}

/* Hero: the logo, white on Studio blue, the editions under it */
.c27x .st-hero{background:var(--blue)}
.c27x .st-hero .lk{display:block;width:min(1080px,82%)}
.c27x .st-lg{display:block;width:100%;height:auto}
.c27x .st-hero .dots{flex-wrap:wrap;justify-content:center;gap:4px 18px}
.c27x .st-hero .dots span{font:600 12px/1 "Geist Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}

/* 01 Brand */
.c27x .st-brand .lg{background:var(--blue)}
.c27x .st-brand .lg figcaption{color:#CFE0FF}
.c27x .st-brand .big{width:min(560px,84%);display:block}
.c27x .st-brand .cn .gd{width:min(72%,320px)}
.c27x .st-brand .cn figcaption{color:#8A94A6}
.c27x .st-brand .ty{grid-column:span 6}
.c27x .st-brand .ed{grid-column:span 6;background:var(--tint)}
.c27x .st-brand .ed figcaption{color:#1d3f86}
.c27x .st-brand .eds{list-style:none;margin:0;padding:0;display:grid;gap:10px;width:min(420px,94%)}
.c27x .st-brand .eds li{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;background:#fff;border-radius:18px;padding:14px 18px;box-shadow:0 18px 40px -26px rgba(10,15,27,.35)}
.c27x .st-brand .eds{gap:8px}
.c27x .st-brand .eds li{padding:10px 18px 10px 10px}
.c27x .st-brand .eds .fi{width:38px;height:38px;border-radius:11px;background:var(--c);display:grid;place-items:center}
.c27x .st-brand .eds .fi svg{width:19px;height:19px}
.c27x .st-brand .eds b{font:600 clamp(17px,1.5vw,21px)/1 var(--pop);letter-spacing:-.02em;color:var(--ink)}
.c27x .st-brand .eds span{font-size:13px;color:#5B6070}
.c27x .st-brand .at-op{margin:14px 0 0;border-radius:32px}

/* 02 Color */
.c27x.st .fv-look h2 span{color:var(--blue-lt)!important}

/* 03 Icons */
.c27x .st-icons .apps{display:flex;flex-wrap:wrap;gap:clamp(18px,2.4vw,40px);align-items:flex-end;margin:0 0 clamp(36px,4vw,64px)}
.c27x .st-icons .apps figure{margin:0;display:grid;justify-items:center;gap:12px}
.c27x .st-icons .apps figcaption{position:static!important;background:none!important;padding:0!important;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#5B6070}
.c27x .st-icons .ai{width:clamp(84px,8.4vw,132px);aspect-ratio:1;display:grid;place-items:center;border-radius:23%;box-shadow:0 24px 44px -24px rgba(10,15,27,.45)}
.c27x .st-icons .ai svg{width:52%;height:52%}
.c27x .st-icons .ios{background:var(--blue)}
.c27x .st-icons .and{background:var(--blue);border-radius:50%}
.c27x .st-icons .sta{background:var(--ink)}
.c27x .st-icons .fav{width:clamp(48px,4.4vw,64px);background:#fff;border-radius:14px}
.c27x .st-icons .ig{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:12px}
.c27x .st-icons .ig li{background:#fff;border-radius:22px;padding:clamp(16px,1.6vw,24px) 12px;display:grid;justify-items:center;gap:12px}
.c27x .st-icons .ig span{width:60px;height:60px;border-radius:50%;background:var(--tint);color:var(--blue);display:grid;place-items:center}
.c27x .st-icons .ig svg{width:28px;height:28px}
.c27x .st-icons .ig b{font:600 14px/1.1 var(--pop);color:var(--ink);text-align:center}

/* 04 Marketing site: light blue band, the homepage scrolls in its window */
.c27x .st-site{background:var(--tint)}
.c27x .st-scroll .sc{container-type:size;overflow:hidden;height:clamp(380px,36vw,620px);background:#fff}
.c27x .st-scroll.m .sc{height:auto;aspect-ratio:9/19.5}
.c27x .st-scroll .sc img{display:block;width:100%;height:auto;animation:stScroll 26s cubic-bezier(.45,0,.55,1) infinite alternate}
.c27x .st-scroll.m .sc img{animation-duration:20s}
@keyframes stScroll{0%,6%{transform:translateY(0)}94%,100%{transform:translateY(calc(-100% + 100cqh))}}
.c27x .st-site .r2{margin-bottom:clamp(24px,3vw,44px)}
.c27x .st-site .r2:last-child{margin-bottom:0}

/* 05 Web app stage, on Studio blue */
.c27x .st-stage{background:var(--blue)}
.c27x .st-stage .hd .eyebrow{color:#CFE0FF!important}
.c27x .st-stage h2{color:#fff!important}
.c27x .st-stage .hd p{color:#DCE7FF}
.c27x .st-stage .desk{background:var(--ink);box-shadow:0 50px 90px -36px rgba(0,20,80,.7)}
.c27x .st-stage .bar{background:#151E2F;border-bottom-color:#222C40}
.c27x .st-stage .bar i{background:#2A3449}
.c27x .st-stage .bar span{background:var(--ink);color:#8A94A6}
.c27x .st-stage .desk>img{display:block;width:100%;height:auto}
.c27x .st-stage .at-notes li{border-top-color:rgba(255,255,255,.6)}
.c27x .st-stage .at-notes .mono{color:#CFE0FF}
.c27x .st-stage .at-notes b{color:#fff}
.c27x .st-stage .at-notes p{color:#DCE7FF}
.c27x .st-gift .tp,.c27x .st-ok .tp{display:flex;align-items:center;gap:10px}
.c27x .st-gift .ic,.c27x .st-ok .sk{width:34px;height:34px;border-radius:50%;background:var(--blue);display:grid;place-items:center;flex:none}
.c27x .st-gift .ic svg,.c27x .st-ok .sk svg{width:17px;height:17px}
.c27x .st-gift small{color:#6b7280;font-size:12px}
.c27x .st-gift .amt{font:600 clamp(30px,2.6vw,40px)/1 var(--pop);letter-spacing:-.03em;margin-top:6px}
.c27x .st-gift .amt sup{font-size:.45em;vertical-align:.9em;margin-left:1px}
.c27x .st-gift .ok,.c27x .st-tix .ok,.c27x .st-inv .ok{justify-self:start;font-size:11.5px;font-weight:600;color:#047857;background:#D4F5E2;border-radius:999px;padding:4px 10px}
.c27x .st-ok .msg{background:var(--soft);border-radius:12px;padding:10px 12px;display:grid;gap:2px;margin-top:4px}
.c27x .st-ok .msg small{color:var(--blue);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.c27x .st-ok .act{display:flex;gap:8px;justify-content:flex-end;margin-top:4px}
.c27x .st-ok .act span{font-size:12.5px;font-weight:600;border-radius:999px;padding:8px 14px}
.c27x .st-ok .no{background:var(--soft);color:#4B5563}
.c27x .st-ok .yes{background:var(--blue);color:#fff}
.c27x .st-paid{grid-template-columns:auto 1fr;align-items:center;gap:12px}
.c27x .st-paid .ck{width:34px;height:34px;border-radius:50%;background:#16A34A;display:grid;place-items:center}
.c27x .st-paid .ck svg{width:16px;height:16px}

/* 06 iPhone and Android */
.c27x .st-mobile .pst{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin:0 calc(-1 * clamp(0px,2vw,36px)) clamp(48px,5vw,88px)}
.c27x .st-mobile .pst figure{margin:0}
.c27x .st-mobile .pst img{display:block;width:100%;height:auto;border-radius:18px}
.c27x .st-mobile .prs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,48px)}
.c27x .st-mobile .pr{display:grid;gap:16px;justify-items:center}
.c27x .st-mobile .pr .duo{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}
.c27x .st-mobile .pr b{font:600 clamp(20px,1.7vw,26px)/1 var(--pop);letter-spacing:-.03em;color:var(--ink)}
.c27x .st-fig.at-ph{max-width:none}
.c27x .st-mobile .at-ph .win,.c27x .st-portal .at-ph .win{border-width:clamp(4px,.4vw,6px);border-radius:clamp(20px,2vw,30px)}
.c27x .st-mobile .at-ph figcaption{margin-top:10px}
.c27x .st-mobile .pr .duo .at-ph{margin:0}

/* 07 Client portal, on night */
.c27x .st-portal{background:var(--ink)}
.c27x .st-portal h2{color:#fff!important}
.c27x .st-portal .hd .eyebrow{color:var(--blue-lt)}
.c27x .st-portal .hd p{color:#A9B0C2}
.c27x .st-portal .pr6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(10px,1.4vw,22px);align-items:start}
.c27x .st-portal .pr6 .p1,.c27x .st-portal .pr6 .p3,.c27x .st-portal .pr6 .p5{margin-top:clamp(24px,4vw,64px)}
.c27x .st-portal .at-ph .win{border-color:#2A3449;background:#2A3449}
.c27x .st-portal figcaption{color:#8A94A6!important}
.c27x .st-portal .cl{display:flex;align-items:center;gap:clamp(20px,3vw,48px);margin-top:clamp(36px,4vw,64px)}
.c27x .st-portal .cl p{margin:0;color:#A9B0C2;font-size:16px;line-height:1.55;max-width:38ch}
.c27x .st-appr{width:min(380px,100%);flex:none;padding:16px}
.c27x .st-appr .tp{display:flex;align-items:center;gap:12px}
.c27x .st-appr .av{width:38px;height:38px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font-weight:600;font-size:13px;flex:none}
.c27x .st-appr .bx{display:flex;justify-content:space-between;align-items:center;background:var(--soft);border-radius:12px;padding:10px 12px;margin-top:4px}
.c27x .st-appr .bx i{font-style:normal;font-size:11.5px;font-weight:600;color:#047857;background:#D4F5E2;border-radius:999px;padding:4px 10px}
.c27x .st-appr .beads{display:flex;gap:4px;align-items:center}
.c27x .st-appr .beads small{margin-left:8px;color:#6b7280;font-size:12px}
.c27x .st-appr .beads i.d{background:var(--blue)}

/* 08 Stations */
.c27x .st-kiosk .k3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.c27x .st-kiosk figure{margin:0}
.c27x .st-kiosk img{display:block;width:100%;height:auto;border-radius:24px}

/* 09 The kit: deck backdrops and components */
.c27x .bg-st1{background:var(--tint);color:var(--ink)}
.c27x .bg-stb{background:var(--blue);color:#fff}
.c27x.st .bg-ink{background:var(--ink)}
.c27x.st .dk-f{border-radius:32px}
.c27x.st .xl-deck .dk-set::before,.c27x.st .xl-deck .dk-set::after{border-radius:32px}
.c27x.st .xl-deck .dk-set::before{background:#E3E8F2}
.c27x.st .xl-deck .dk-set::after{background:#D5DCEA}
.c27x.st .cp{border-radius:22px}
.c27x.st .cp-btn{background:var(--blue)}
.c27x.st .cp-ghost.on{background:var(--blue);border-color:var(--blue)}
.c27x .st-person .who{display:flex;align-items:center;gap:12px}
.c27x .st-person .av{width:52px;height:52px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font:600 18px var(--pop)}
.c27x .st-person .who b{font:600 20px/1.1 var(--pop);letter-spacing:-.02em}
.c27x .st-person .who em,.c27x .st-tix em{display:block;font-style:normal;color:#6B6B73;font-size:13px}
.c27x .st-person .tg i.b{background:var(--tint);color:var(--blue);font-weight:600}
.c27x .st-person .tg i.g{background:#D4F5E2;color:#047857;font-weight:600}
.c27x .st-person .tiles{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.c27x .st-person .tiles div{border-radius:16px;padding:12px 14px;display:grid;gap:10px}
.c27x .st-person .tiles small{font-size:11.5px;opacity:.8}
.c27x .st-person .tiles b{font:600 24px/1 var(--pop);letter-spacing:-.03em}
.c27x .st-person .bl{background:var(--blue);color:#fff}
.c27x .st-person .nt{background:var(--ink);color:#fff}
.c27x .st-give .amt{font:600 52px/1 var(--pop);letter-spacing:-.04em;text-align:center;padding:6px 0}
.c27x .st-give .seg{display:grid;grid-template-columns:1fr 1fr;background:var(--soft);border-radius:999px;padding:4px;font-size:13px;text-align:center}
.c27x .st-give .seg span{padding:7px;border-radius:999px;color:#6B6B73}
.c27x .st-give .seg .on{background:#fff;color:var(--ink);font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.c27x .st-give .fd{display:flex;justify-content:space-between;align-items:center;border:1px solid #E6E8EE;border-radius:12px;padding:10px 12px}
.c27x .st-give .fd small{color:#6B6B73}
.c27x .st-tix{padding:0;overflow:hidden;gap:0}
.c27x .st-tix .hd2{background:var(--ink);color:#fff;padding:18px 20px;display:grid;gap:4px}
.c27x .st-tix .hd2 small{font:600 10.5px "Geist Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-lt)}
.c27x .st-tix .hd2 b{font:600 22px/1.1 var(--pop);letter-spacing:-.02em}
.c27x .st-tix .hd2 em{color:#A9B0C2}
.c27x .st-tix .qr{display:grid;grid-template-columns:repeat(9,1fr);gap:3px;width:150px;margin:20px auto 16px}
.c27x .st-tix .qr i{aspect-ratio:1;border-radius:2px;background:#EEF0F4}
.c27x .st-tix .qr i.d{background:var(--ink)}
.c27x .st-tix .cp-row{padding:0 20px 18px}
.c27x .st-inv .ln{display:flex;justify-content:space-between;font-size:14px;color:#4B5563}
.c27x .st-inv .ln b{color:var(--ink)}
.c27x .st-inv .tot{border-top:1px solid #ECECEF;padding-top:10px;font-weight:600;color:var(--ink)}
.c27x .st-inv .tot b{font:600 22px/1 var(--pop)}
.c27x .st-inv .tl{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:8px;font-size:13px;color:#6B6B73}
.c27x .st-inv .tl li{display:flex;align-items:center;gap:10px}
.c27x .st-inv .tl li::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--blue)}
.c27x .st-inv .tl li:last-child::before{background:#16A34A}
.c27x .st-port .t{font:600 22px/1.1 var(--pop)}
.c27x .st-port .pg{height:10px;border-radius:10px;background:var(--tint);overflow:hidden}
.c27x .st-port .pg i{display:block;height:100%;width:var(--w);background:var(--blue);border-radius:inherit}
.c27x .st-port .nd{display:grid;gap:8px;background:var(--soft);border-radius:14px;padding:12px}
.c27x .st-port .nd small{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.c27x .st-port .it{display:flex;justify-content:space-between;align-items:center;gap:10px;background:#fff;border-radius:10px;padding:8px 10px;font-size:13px}
.c27x .st-skye .me{justify-self:end;max-width:86%;background:var(--blue);color:#fff;border-radius:16px 16px 4px 16px;padding:10px 14px;font-size:13.5px}
.c27x .st-skye .ai{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:start}
.c27x .st-skye .sk{width:30px;height:30px;border-radius:50%;background:var(--ink);display:grid;place-items:center}
.c27x .st-skye .sk svg{width:15px;height:15px}
.c27x .st-skye .ai p{margin:0;background:var(--soft);border-radius:16px 16px 16px 4px;padding:10px 14px;font-size:13.5px;color:#111114}

/* Contents: six parts, what is in each */
.c27x .st-toc ol{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px clamp(20px,2.4vw,40px)}
.c27x .st-toc a{align-items:flex-start}
.c27x .st-toc .tx{display:grid;gap:8px;font:600 19px/1.15 var(--pop);letter-spacing:-.02em}
.c27x .st-toc .tx small{font:500 13px/1.45 Gilroy,sans-serif;letter-spacing:0;color:#8A94A6}

/* Part dividers: Part 02, a big numeral, the title */
.c27x .st-part{max-width:var(--box);margin:clamp(56px,7vw,120px) auto clamp(20px,2.4vw,36px);padding:0 clamp(20px,4.6vw,80px);display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:24px clamp(32px,4vw,80px);align-items:end}
.c27x .st-part .pl{display:grid;gap:6px;border-top:2px solid var(--blue);padding-top:16px}
.c27x .st-part .pl .mono{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.c27x .st-part .num{font:600 clamp(110px,15vw,260px)/.8 var(--pop);letter-spacing:-.06em;color:var(--blue)}
.c27x .st-part h2{font-size:clamp(44px,6.4vw,112px)!important;line-height:.92!important;margin:0 0 18px;color:var(--ink)}
.c27x .st-part p{margin:0 0 22px;font-size:clamp(17px,1.4vw,21px);line-height:1.45;color:#5B6070;max-width:44ch}
.c27x .st-part ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.c27x .st-part li{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#1d3f86;background:var(--tint);border-radius:999px;padding:8px 14px}

/* 01 Why: what each Studio replaces */
.c27x .st-why{background:#fff;box-shadow:inset 0 0 0 1px #E6E8EE}
.c27x .st-why .rp{display:grid;gap:10px}
.c27x .st-why .rr{display:grid;grid-template-columns:56px minmax(0,2.2fr) minmax(0,4fr) minmax(0,4fr);gap:20px;align-items:center;background:var(--soft);border-radius:22px;padding:14px 22px 14px 14px}
.c27x .st-fl .ch,.c27x .st-why .ch,.c27x .st-films .ch{width:56px;height:56px;border-radius:16px;background:var(--c);display:grid;place-items:center;flex:none}
.c27x .st-why .ch svg,.c27x .st-fl .ch svg{width:26px;height:26px}
.c27x .st-why .nm{display:grid;gap:6px}
.c27x .st-why .nm b{font:600 clamp(19px,1.6vw,24px)/1 var(--pop);letter-spacing:-.025em;color:var(--ink)}
.c27x .st-why .nm small{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--c)}
.c27x .st-why .tl{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.c27x .st-why .rx{display:grid;gap:8px}
.c27x .st-why .rx>.mono{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#8A94A6}
.c27x .st-why .tl li{background:#fff;border-radius:999px;padding:8px 14px;font:600 14.5px/1 var(--pop);letter-spacing:-.01em;color:var(--ink)}
.c27x .st-why .tl s{text-decoration:line-through;text-decoration-color:var(--c);text-decoration-thickness:2px;text-decoration-skip-ink:none}
.c27x .st-why .rr p{margin:0;font:600 clamp(16px,1.3vw,19px)/1.3 var(--pop);letter-spacing:-.015em;color:var(--ink)}
.c27x .st-why .rl,.c27x .st-nat .rl{list-style:none;margin:clamp(40px,4.4vw,72px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,48px)}
.c27x .st-nat .rl{grid-template-columns:repeat(4,minmax(0,1fr))}
.c27x .st-why .rl li,.c27x .st-nat .rl li{border-top:2px solid var(--ink);padding-top:16px;display:grid;gap:10px;align-content:start}
.c27x .st-why .rl .mono,.c27x .st-nat .rl .mono{font-size:11px;color:var(--blue)}
.c27x .st-why .rl b,.c27x .st-nat .rl b{font:600 clamp(20px,1.7vw,26px)/1.1 var(--pop);letter-spacing:-.025em;color:var(--ink)}
.c27x .st-why .rl p,.c27x .st-nat .rl p{margin:0;color:#5B6070;font-size:15.5px;line-height:1.55}

/* 03 The opener, on night */
.c27x .st-open{background:var(--ink)}
.c27x .st-open h2{color:#fff!important}
.c27x .st-open .hd .eyebrow{color:var(--blue-lt)}
.c27x .st-open .hd p{color:#A9B0C2}
.c27x .st-open .at-op{margin:0;border-radius:28px}

/* 05 Icons: the full usestudio.app set */
.c27x .st-icons .sx{margin-top:clamp(40px,4.4vw,72px);background:var(--ink);border-radius:28px;padding:clamp(24px,3vw,48px)}
.c27x .st-icons .sh{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:clamp(20px,2.4vw,36px)}
.c27x .st-icons .sh .mono{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-lt)}
.c27x .st-icons .sh p{margin:0;color:#A9B0C2;font-size:15.5px;line-height:1.55;max-width:52ch}
.c27x .st-icons .si{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:6px}
.c27x .st-icons .si li{display:grid;justify-items:center;gap:10px;padding:18px 4px 12px;border-radius:16px;background:#151E2F;color:#fff;transition:background .2s}
.c27x .st-icons .si li:hover{background:var(--blue)}
.c27x .st-icons .si svg{width:26px;height:26px}
.c27x .st-icons .si span{font-size:9.5px;letter-spacing:.06em;color:#8A94A6;text-transform:lowercase;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c27x .st-icons .si li:hover span{color:#DCE7FF}

/* 06 The seven Studios: icon tiles as tabs, photography panels */
.c27x .st-fl .ft{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;margin-bottom:14px}
.c27x .st-fl .ft button{appearance:none;border:0;outline:none;cursor:pointer;text-align:left;display:grid;gap:4px;padding:14px;border-radius:22px;background:transparent;color:var(--ink);font:inherit;transition:background .2s}
.c27x .st-fl .ft button:focus,.c27x .st-fl .ft button:focus-visible{outline:none;box-shadow:none}
.c27x .st-fl .ft button[aria-selected=true]{background:#fff}
.c27x .st-fl .ft .ch{margin-bottom:10px;transition:transform .25s}
.c27x .st-fl .ft button:hover .ch{transform:translateY(-3px)}
.c27x .st-fl .ft b{font:600 clamp(16px,1.3vw,20px)/1.1 var(--pop);letter-spacing:-.02em}
.c27x .st-fl .ft small{font-size:12.5px;color:#6B6B73}
.c27x .st-fl .fp{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:12px}
.c27x .st-fl .fp[hidden]{display:none}
.c27x .st-fl .hr{margin:0;position:relative;border-radius:28px;overflow:hidden;min-height:clamp(380px,40vw,640px)}
.c27x .st-fl .hr img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.c27x .st-fl .hr figcaption{position:absolute!important;left:0;right:0;bottom:0;padding:clamp(20px,2.4vw,36px)!important;background:linear-gradient(transparent,rgba(10,15,27,.82))!important;display:grid;gap:10px;justify-items:start;color:#fff;border-radius:0!important}
.c27x .st-fl .hr .ch{width:48px;height:48px;border-radius:14px}
.c27x .st-fl .hr .ch svg{width:22px;height:22px}
.c27x .st-fl .hr figcaption,.c27x .st-fl .hr figcaption *{color:#fff!important;text-transform:none!important;letter-spacing:normal!important;font-family:var(--pop)!important}
.c27x .st-fl .hr figcaption .mono{font:600 11px/1 "Geist Mono",monospace!important;letter-spacing:.14em!important;text-transform:uppercase!important;opacity:.85}
.c27x .st-fl .hr b{font-size:clamp(28px,3vw,48px)!important;line-height:1;font-weight:600;letter-spacing:-.035em;max-width:16ch}
.c27x .st-fl .ps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.c27x .st-fl .ps li{position:relative;border-radius:20px;overflow:hidden;min-height:150px;background:#dfe3ea}
.c27x .st-fl .ps img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.c27x .st-fl .ps span{position:absolute;left:10px;bottom:10px;right:10px;justify-self:start;width:max-content;max-width:calc(100% - 20px);background:#fff;color:var(--ink);border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:600;box-shadow:0 0 0 0 transparent}
.c27x .st-fl .ps span::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--c);margin-right:7px;vertical-align:1px}

/* 08 A page per Studio: nine pages scrolling */
.c27x .st-pw .pw{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px) clamp(14px,1.6vw,24px)}
.c27x .st-pw .sc{height:clamp(320px,27vw,500px)}
.c27x .st-pw .sc img{animation-duration:34s;animation-delay:var(--d)}
.c27x .st-pw figcaption::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--c);margin-right:8px;vertical-align:0}

/* 09 Commercials, on night */
.c27x .st-films{background:var(--ink)}
.c27x .st-films h2{color:#fff!important}
.c27x .st-films .hd .eyebrow{color:var(--blue-lt)}
.c27x .st-films .hd p{color:#A9B0C2}
.c27x .st-films .pl{position:relative;aspect-ratio:16/9;border-radius:28px;overflow:hidden;background:#000}
.c27x .st-films .pl>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.c27x .st-films .pl.is-on .lb,.c27x .st-films .pl.is-on .go{display:none}
.c27x .st-films .pl iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:3}
.c27x .st-films .go{appearance:none;border:0;outline:none;cursor:pointer;position:absolute;left:50%;top:50%;width:clamp(72px,7vw,108px);height:clamp(72px,7vw,108px);margin:calc(clamp(72px,7vw,108px) / -2) 0 0 calc(clamp(72px,7vw,108px) / -2);border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;z-index:2;transition:transform .25s}
.c27x .st-films .go:hover{transform:scale(1.06)}
.c27x .st-films .go svg{width:38%;height:38%;margin-left:6%}
.c27x .st-films .lb{position:absolute;right:clamp(16px,2vw,28px);top:clamp(16px,2vw,28px);text-align:right;justify-items:end;background:rgba(10,15,27,.55);border-radius:16px;padding:12px 16px;display:grid;gap:4px;z-index:2;color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.4)}
.c27x .st-films .lb .mono{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;opacity:.8}
.c27x .st-films .lb b{font:600 clamp(20px,2vw,30px)/1 var(--pop);letter-spacing:-.025em}
.c27x .st-films .fl{list-style:none;margin:clamp(16px,2vw,24px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.6vw,22px)}
.c27x .st-films .fl button{appearance:none;border:0;outline:none;background:none;cursor:pointer;text-align:left;width:100%;padding:0;display:grid;gap:6px;color:#fff;font:inherit}
.c27x .st-films .fl button:focus{outline:none;box-shadow:none}
.c27x .st-films .th{position:relative;display:block;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#151E2F;margin-bottom:6px;box-shadow:inset 0 -4px 0 var(--c)}
.c27x .st-films .th img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.78;transition:opacity .25s}
.c27x .st-films .th::after{content:"";position:absolute;inset:auto 0 0 0;height:5px;background:var(--c)}
.c27x .st-films li.on .th img,.c27x .st-films .fl button:hover .th img{opacity:1}
.c27x .st-films .th i{position:absolute;right:8px;top:8px;font-style:normal;font-size:10.5px;background:rgba(10,15,27,.75);color:#fff;border-radius:999px;padding:4px 8px}
.c27x .st-films .fl b{font:600 16px/1.15 var(--pop);letter-spacing:-.015em}
.c27x .st-films .fl small{font-size:12.5px;color:#8A94A6}
.c27x .st-films li.on b{color:var(--blue-lt)}

/* 14 Why native: the browser dialog vs Stations */
.c27x .st-nat .vs{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.c27x .st-nat .vs figure{margin:0;border-radius:28px;padding:clamp(24px,3vw,44px);display:grid;gap:clamp(20px,2.4vw,32px);align-content:start;justify-items:center;min-height:clamp(440px,38vw,580px);position:relative;overflow:hidden}
.c27x .st-nat .b{background:#E6E9EF}
.c27x .st-nat .vs figure{display:flex;flex-direction:column;align-items:center}
.c27x .st-nat .b .dlg{margin:auto 0}
.c27x .st-nat .vs .tg{align-self:flex-start}
.c27x .st-nat .vs figcaption{align-self:flex-start}
.c27x .st-nat .s{background:var(--blue)}
.c27x .st-nat .tg{justify-self:start;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#5B6070}
.c27x .st-nat .s .tg{color:#CFE0FF}
.c27x .st-nat figcaption{position:static!important;background:none!important;padding:0!important;font-size:15.5px!important;line-height:1.5;color:#5B6070!important;text-transform:none!important;letter-spacing:0!important;font-family:inherit!important;max-width:40ch;justify-self:start;margin-top:auto}
.c27x .st-nat .s figcaption{color:#DCE7FF!important}
.c27x .st-nat .dlg{width:min(380px,100%);background:#fff;border-radius:16px;box-shadow:0 30px 60px -28px rgba(10,15,27,.45),0 0 0 1px rgba(10,15,27,.06);padding:18px;display:grid;gap:10px;font-size:14px}
.c27x .st-nat .dh{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:6px;border-bottom:1px solid #ECECEF}
.c27x .st-nat .dh b{font:600 20px var(--pop)}
.c27x .st-nat .dh span{font-size:12.5px;color:#E5484D;font-weight:600}
.c27x .st-nat .dr{display:flex;justify-content:space-between;gap:12px;color:#6B6B73}
.c27x .st-nat .dr b{color:var(--ink);font-weight:600}
.c27x .st-nat .da{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}
.c27x .st-nat .da span{border-radius:999px;padding:8px 16px;font-weight:600;font-size:13px}
.c27x .st-nat .da .no{background:var(--soft);color:#4B5563}
.c27x .st-nat .da .yes{background:#1A73E8;color:#fff}
.c27x .st-nat .okc{display:grid;justify-items:center;gap:4px;color:#fff;text-align:center}
.c27x .st-nat .okc .ck{width:52px;height:52px;border-radius:50%;background:#16A34A;display:grid;place-items:center;margin-bottom:6px}
.c27x .st-nat .okc .ck svg{width:24px;height:24px}
.c27x .st-nat .okc>b{font:600 22px var(--pop)}
.c27x .st-nat .okc .mono{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#CFE0FF;margin-top:6px}
.c27x .st-nat .okc .cd{font:700 44px/1 var(--pop);letter-spacing:.18em;margin-left:.18em}
.c27x .st-nat .out{display:flex;gap:14px;justify-content:center;align-items:flex-start;flex-wrap:wrap}
.c27x .lbl{background:#fff;color:#111;border-radius:6px;padding:12px 14px;width:min(230px,100%);display:grid;gap:6px;box-shadow:0 26px 40px -20px rgba(0,10,40,.55);font-family:"Instrument Sans",system-ui,sans-serif}
.c27x .lbl.tag{transform:rotate(-3deg)}
.c27x .lbl.rc{transform:rotate(2.5deg) translateY(18px);text-align:center}
.c27x .lbl hr{border:0;border-top:2px solid #111;margin:2px 0;width:100%}
.c27x .lbl hr.ds{border-top:1.5px dashed #111}
.c27x .lbl .t1{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;text-align:left}
.c27x .lbl .t1 b{display:block;font:700 30px/1 "Instrument Sans",sans-serif;letter-spacing:-.03em}
.c27x .lbl .t1 span{font-size:13px;font-weight:600}
.c27x .lbl .t1 em{font-style:normal;font-size:10px;font-weight:600;text-align:right;max-width:9ch;line-height:1.15}
.c27x .lbl .t1 .pr{font-size:15px!important;letter-spacing:0!important}
.c27x .lbl .t2{display:flex;justify-content:space-between;align-items:center}
.c27x .lbl .cd{font:700 28px/1 "Instrument Sans",sans-serif;letter-spacing:.14em}
.c27x .lbl.rc .cd{font-size:34px;margin:4px 0}
.c27x .lbl .t2 i{font-style:normal;background:#E5484D;color:#fff;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:4px;padding:4px 7px}
.c27x .lbl small{font-size:11px;color:#333}
.c27x .lbl .ft{color:#666}
.c27x .lbl.rc span{font-size:13px;font-weight:600}
.c27x .lbl .up{font-size:9.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}

/* 15 The flow: seven phone screens */
.c27x .st-kiosk .p7{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(8px,1vw,16px);margin-top:clamp(40px,4.4vw,72px);align-items:start}
.c27x .st-kiosk .p7 .at-ph{margin:0}
.c27x .st-kiosk .p7 .at-ph .win{border-width:clamp(3px,.35vw,5px);border-radius:clamp(16px,1.6vw,26px)}
.c27x .st-kiosk .p7 .at-ph img{border-radius:0}
.c27x .st-kiosk .p7 .q1,.c27x .st-kiosk .p7 .q3,.c27x .st-kiosk .p7 .q5{margin-top:clamp(20px,3vw,48px)}
.c27x .st-kiosk .p7 figcaption{margin-top:10px;font-size:10px!important}

/* 16 In the stores */
.c27x .st-store{background:var(--tint)}
.c27x .st-store .sa{display:grid;grid-template-columns:.75fr .75fr .4613fr .4613fr .5625fr;gap:clamp(10px,1.2vw,18px);align-items:end}
.c27x .st-store figure{margin:0}
.c27x .st-store .sa img{display:block;width:100%;height:auto;border-radius:clamp(12px,1.2vw,20px)}
.c27x .st-store .fg{display:flex;align-items:center;gap:clamp(20px,3vw,56px);margin-top:clamp(24px,3vw,44px)}
.c27x .st-store .fg figure{flex:0 1 560px}
.c27x .st-store .fg img{display:block;width:100%;height:auto;border-radius:18px}
.c27x .st-store .ico{display:flex;align-items:center;gap:18px}
.c27x .st-store .ai{width:clamp(84px,8vw,124px);aspect-ratio:1;border-radius:23%;background:var(--blue);display:grid;place-items:center;box-shadow:0 24px 44px -24px rgba(10,15,27,.45);flex:none}
.c27x .st-store .ai svg{width:52%;height:52%}
.c27x .st-store .ico b{display:block;font:600 clamp(22px,2vw,30px)/1.1 var(--pop);letter-spacing:-.03em;color:var(--ink);margin-bottom:6px}
.c27x .st-store .ico .mono{font-size:11px;letter-spacing:.08em;color:#5B6070}

@media (max-width:1000px){
	.c27x .st-brand .ty,.c27x .st-brand .ed{grid-column:1/-1}
	.c27x .st-icons .ig{grid-template-columns:repeat(4,minmax(0,1fr))}
	.c27x .st-mobile .pst{grid-template-columns:repeat(3,minmax(0,1fr));margin-left:0;margin-right:0}
	.c27x .st-mobile .prs{grid-template-columns:1fr;max-width:520px;margin:0 auto}
	.c27x .st-portal .pr6{grid-template-columns:repeat(3,minmax(0,1fr))}
	.c27x .st-portal .pr6 .p1,.c27x .st-portal .pr6 .p5{margin-top:0}
	.c27x .st-portal .pr6 .p3{margin-top:0}
	.c27x .st-portal .pr6 .p1,.c27x .st-portal .pr6 .p4{margin-top:clamp(24px,4vw,40px)}
	.c27x .st-portal .cl{flex-direction:column;align-items:flex-start}
	.c27x .st-site .r1 .st-scroll.m{max-width:300px}
	.c27x .st-toc ol{grid-template-columns:repeat(2,minmax(0,1fr))}
	.c27x .st-part{grid-template-columns:1fr;align-items:start}
	.c27x .st-part .num{font-size:clamp(90px,22vw,160px)}
	.c27x .st-why .rr{grid-template-columns:56px minmax(0,1fr);row-gap:12px}
	.c27x .st-why .rr .rx,.c27x .st-why .rr p{grid-column:2}
	.c27x .st-why .rl,.c27x .st-nat .rl{grid-template-columns:1fr 1fr}
	.c27x .st-icons .si{grid-template-columns:repeat(6,minmax(0,1fr))}
	.c27x .st-icons .sh{flex-direction:column;align-items:flex-start}
	.c27x .st-fl .ft{grid-template-columns:repeat(4,minmax(0,1fr))}
	.c27x .st-fl .fp{grid-template-columns:1fr}
	.c27x .st-fl .ps{grid-template-columns:repeat(3,minmax(0,1fr))}
	.c27x .st-pw .pw{grid-template-columns:1fr 1fr}
	.c27x .st-films .fl{grid-template-columns:repeat(2,minmax(0,1fr))}
	.c27x .st-nat .vs{grid-template-columns:1fr}
	.c27x .st-kiosk .p7{grid-template-columns:repeat(4,minmax(0,1fr))}
	.c27x .st-kiosk .p7 .q3{margin-top:0}
	.c27x .st-kiosk .p7 .q4,.c27x .st-kiosk .p7 .q6{margin-top:clamp(20px,3vw,48px)}
	.c27x .st-store .sa{grid-template-columns:.75fr .75fr .4613fr}
	.c27x .st-store .sa .ph:nth-child(4),.c27x .st-store .sa .an{display:none}
	.c27x .st-store .fg{flex-direction:column;align-items:flex-start}
}
@media (max-width:640px){
	.c27x .st-hero .lk{width:86%}
	.c27x .st-hero .dots{border-radius:22px;max-width:86%}
	.c27x .st-icons .ig{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
	.c27x .st-icons .ig li{border-radius:16px;padding:14px 6px}
	.c27x .st-icons .ig span{width:42px;height:42px}
	.c27x .st-icons .ig b{font-size:12.5px}
	.c27x .st-mobile .pst{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
	.c27x .st-mobile .pst img{border-radius:12px}
	.c27x .st-portal .pr6{grid-template-columns:repeat(2,minmax(0,1fr))}
	.c27x .st-portal .pr6 .p1,.c27x .st-portal .pr6 .p3,.c27x .st-portal .pr6 .p5{margin-top:28px}
	.c27x .st-portal .pr6 .p4{margin-top:0}
	.c27x .st-kiosk .k3{grid-template-columns:1fr;max-width:420px;margin:0 auto}
	.c27x .st-scroll .sc{height:360px}
	.c27x .st-brand .eds li{grid-template-columns:auto 1fr;padding:12px 14px}
	.c27x .st-brand .eds li>span:last-child{display:none}
	.c27x .st-brand .at-op{border-radius:20px}
	.c27x .st-toc ol{grid-template-columns:1fr}
	.c27x .st-part{margin-top:56px}
	.c27x .st-why .rr{grid-template-columns:44px minmax(0,1fr);gap:10px 14px;padding:12px 14px 14px 12px}
	.c27x .st-why .ch,.c27x .st-fl .ch{width:44px;height:44px;border-radius:13px}
	.c27x .st-why .ch svg,.c27x .st-fl .ch svg{width:20px;height:20px}
	.c27x .st-why .rr .rx,.c27x .st-why .rr p{grid-column:1/-1}
	.c27x .st-why .rl,.c27x .st-nat .rl{grid-template-columns:1fr}
	.c27x .st-icons .si{grid-template-columns:repeat(4,minmax(0,1fr))}
	.c27x .st-icons .sx,.c27x .st-open .at-op{border-radius:20px}
	.c27x .st-fl .ft{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
	.c27x .st-fl .ft button{padding:10px 6px;border-radius:16px;justify-items:center;text-align:center}
	.c27x .st-fl .ft .ch{margin-bottom:4px}
	.c27x .st-fl .ft b{font-size:14px}
	.c27x .st-fl .ft small{display:none}
	.c27x .st-fl .hr{min-height:360px;border-radius:20px}
	.c27x .st-fl .ps{grid-template-columns:1fr 1fr;gap:8px}
	.c27x .st-fl .ps li{min-height:130px;border-radius:16px}
	.c27x .st-fl .ps span{font-size:11px;padding:5px 9px;white-space:normal}
	.c27x .st-pw .pw{grid-template-columns:1fr}
	.c27x .st-pw .sc{height:340px}
	.c27x .st-films .pl{border-radius:18px}
	.c27x .st-films .lb{display:none}
	.c27x .st-films .fl{gap:14px 10px}
	.c27x .st-films .fl b{font-size:14px}
	.c27x .st-nat .vs figure{border-radius:20px;min-height:0}
	.c27x .lbl{width:min(200px,100%)}
	.c27x .lbl.rc{transform:rotate(2deg)}
	.c27x .st-kiosk .p7{grid-template-columns:repeat(2,minmax(0,1fr));max-width:420px;margin-inline:auto}
	.c27x .st-kiosk .p7 .q1,.c27x .st-kiosk .p7 .q3,.c27x .st-kiosk .p7 .q5{margin-top:28px}
	.c27x .st-kiosk .p7 .q2,.c27x .st-kiosk .p7 .q4,.c27x .st-kiosk .p7 .q6{margin-top:0}
	.c27x .st-store .sa{grid-template-columns:1fr 1fr}
	.c27x .st-store .sa .ph{display:none}
}
@media (prefers-reduced-motion:reduce){ .c27x .st-scroll .sc img{animation:none} .c27x .st-fl .ft .ch{transition:none} }

/* 11 Inside the app */
.c27x .st-in{background:var(--soft)}
.c27x .st-in .ir{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,4vw,72px);align-items:center;margin-top:clamp(56px,7vw,120px)}
.c27x .st-in .ir.fl{grid-template-columns:minmax(0,8fr) minmax(0,4fr)}
.c27x .st-in .ir.fl .tx{order:2}
.c27x .st-in .tx .mono{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:14px}
.c27x .st-in .tx h3{font:600 clamp(26px,2.4vw,40px)/1.08 var(--pop);letter-spacing:-.025em;color:var(--ink);margin:0 0 14px}
.c27x .st-in .tx p{font-size:16.5px;line-height:1.6;color:#4A5468;margin:0;max-width:36ch}
.c27x .st-in .sh{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:start}
.c27x .st-in .sh .st-fig{margin:0;position:relative}
.c27x .st-in .sh .win{overflow:hidden;background:#fff}
.c27x .st-in .sh img{display:block;width:100%;height:auto}
.c27x .st-in .sh .w0{grid-column:1/-1;z-index:1}
.c27x .st-in .n2 .w0{grid-column:1/11}
.c27x .st-in .n2 .w1{grid-column:6/-1;margin-top:-26%;z-index:2}
.c27x .st-in .n3 .w0{grid-column:2/12}
.c27x .st-in .n3 .w1{grid-column:1/7;margin-top:-12%;z-index:2}
.c27x .st-in .n3 .w2{grid-column:7/-1;margin-top:-4%;margin-left:8%;z-index:3}
.c27x .st-in .fl .n3 .w0,.c27x .st-in .ir.fl.n3 .w0,.c27x .st-in .ir.fl.n2 .w0{grid-column:3/-1}
.c27x .st-in .ir.fl.n2 .w1{grid-column:1/8}
@media (max-width:1000px){
	.c27x .st-in .ir,.c27x .st-in .ir.fl{grid-template-columns:1fr}
	.c27x .st-in .ir.fl .tx{order:0}
}
@media (max-width:640px){
	.c27x .st-in .sh .st-fig,.c27x .st-in .ir.fl .st-fig{grid-column:1/-1!important;margin:0!important}
	.c27x .st-in .sh{gap:14px}
	.c27x .st-in .sh .bar span{padding:5px 12px}
}

/* Browser mockups: a quiet bar in the screen's own color, square image corners under it */
.c27x.st .at-br .win,.c27x .st-stage .desk{border-radius:12px;overflow:hidden}
.c27x.st .at-br .bar,.c27x .st-stage .bar{position:relative;height:32px;padding:0 14px;gap:6px;background:#fff;border-bottom:1px solid #EDEFF3}
.c27x.st .at-br .bar i,.c27x .st-stage .bar i{width:7px;height:7px;background:#DADDE3}
.c27x.st .at-br .bar span,.c27x .st-stage .bar span{position:absolute;left:50%;transform:translateX(-50%);margin:0;padding:0;background:none!important;border:0;border-radius:0;font:500 10.5px/1 "Geist Mono",monospace;letter-spacing:.02em;color:#9AA1AE;max-width:60%}
.c27x.st .at-br.dk .bar,.c27x .st-stage .bar{background:#14161B;border-bottom-color:#23262D}
.c27x.st .at-br.dk .bar i,.c27x .st-stage .bar i{background:#30343D}
.c27x.st .at-br.dk .bar span,.c27x .st-stage .bar span{color:#6E7584}
.c27x.st .at-br.dk .win{background:#14161B}
.c27x.st .at-br img,.c27x .st-stage .desk>img{border-radius:0!important}
@media (max-width:640px){.c27x.st .at-br .bar,.c27x .st-stage .bar{height:26px;padding:0 10px}.c27x.st .at-br .bar span,.c27x .st-stage .bar span{font-size:9px}}

/* Inside the app: tabs */
.c27x .st-in .itabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:clamp(36px,4vw,64px)}
.c27x .st-in .itabs button{appearance:none;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:10px;padding:13px 20px;border-radius:999px;background:#fff;color:var(--ink);font:600 15px/1 var(--pop);letter-spacing:-.01em;outline:none}
.c27x .st-in .itabs button .mono{font-size:10.5px;letter-spacing:.1em;color:#8A94A6}
.c27x .st-in .itabs button[aria-selected=true]{background:var(--ink);color:#fff}
.c27x .st-in .itabs button[aria-selected=true] .mono{color:#8FB5FF}
.c27x .st-in .ir{margin-top:clamp(28px,3vw,48px)}
.c27x .st-in .ir[hidden]{display:none}
@media (max-width:640px){
	.c27x .st-in .itabs{flex-wrap:nowrap;overflow-x:auto;margin-left:-16px;margin-right:-16px;padding:0 16px;scrollbar-width:none}
	.c27x .st-in .itabs::-webkit-scrollbar{display:none}
	.c27x .st-in .itabs button{flex:none;padding:11px 16px;font-size:14px}
}

/* Stations icon: its real blue to purple gradient (2026-11-13) */
.c27x .st-icons .sta,.c27x .st-store .ai{background:linear-gradient(135deg,#1363FF 0%,#4A3BFF 50%,#6919FF 100%)}

/* Stations labels side by side, the receipt overlapping the tag (2026-11-13) */
.c27x .st-nat .out{flex-wrap:nowrap;gap:0;align-items:flex-start;justify-content:center;padding:4px 0 28px}
.c27x .st-nat .out .lbl{flex:0 0 auto;width:min(230px,52%)}
.c27x .st-nat .out .lbl.tag{position:relative;z-index:1;transform:rotate(-4deg)}
.c27x .st-nat .out .lbl.rc{position:relative;z-index:2;margin-left:-12px;transform:rotate(3deg) translateY(30px);box-shadow:0 30px 44px -18px rgba(0,10,40,.6),0 2px 6px rgba(0,10,40,.18)}
@media (max-width:640px){.c27x .st-nat .out{transform:scale(.6);margin:-44px -100px -36px}.c27x .st-nat .out .lbl{width:230px}}