/* Case pages · cinematic layout (fixed title, blurred media backdrop, editorial column) — The Wallet identity */
:root{--tw-accent:linear-gradient(100deg,#8E80E8 0%,#DE8AF7 55%,#E551C1 100%);--cc-g:max(var(--g,24px),calc((100% - 1360px)/2))}
html.cc-ready body{background:#07070D!important;color:#fff;font-family:"Red Hat Display",system-ui,sans-serif}
html.cc-ready body>header{background:transparent!important;border:0!important;position:fixed!important;top:0;left:0;right:0;z-index:40;mix-blend-mode:normal}
html.cc-ready body>header::before{content:"";position:absolute;inset:0 0 -40px;background:linear-gradient(180deg,rgba(7,7,13,.85),rgba(7,7,13,0));pointer-events:none;z-index:-1}
html.cc-ready main.cc-on{background:transparent!important;padding:0!important;max-width:none!important;display:block!important}
html.cc-ready main.cc-on>*:not(.cc-wrap):not(.case-more):not(.next-brief):not(script){display:none!important}
/* backdrop */
.cc-bg{position:fixed;inset:0;z-index:-2;overflow:hidden;background:#07070D}
.cc-bg i{position:absolute;inset:-6%;background-position:center;background-size:cover;filter:blur(26px) brightness(.42) saturate(.85);transform:scale(1.08);opacity:0;transition:opacity 1.1s ease}
.cc-bg i.on{opacity:1}
.cc-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(70% 60% at 70% 40%,rgba(105,50,204,.22),transparent 70%),linear-gradient(180deg,rgba(7,7,13,.55),rgba(7,7,13,.15) 30%,rgba(7,7,13,.55)),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E")}
/* fixed title */
.cc-title{position:fixed;left:50%;top:50%;transform:translateY(-50%);z-index:5;width:min(46vw,760px);pointer-events:none;transition:opacity .6s ease}
.cc-title.out{opacity:0}
.cc-title .k{display:flex;gap:14px;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.6);margin:0 0 18px}
.cc-title .k b{font-weight:500;color:#DE8AF7}
.cc-title h1{margin:0;font-weight:500;font-size:clamp(52px,7.2vw,124px);line-height:.9;letter-spacing:-.06em;color:#fff;overflow-wrap:anywhere}
.cc-title h1 em{font-style:normal;background:var(--tw-accent);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-right:.04em}
.cc-title h1 .w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .06em .1em 0;margin:0 -.06em -.1em 0}
.cc-title h1 .w>span{display:inline-block;transform:translateY(105%);transition:transform 1.2s cubic-bezier(.16,.84,.24,1);transition-delay:calc(var(--i,0)*70ms)}
html.cc-in .cc-title h1 .w>span{transform:none}
.cc-title .s{margin:16px 0 0;font-size:clamp(18px,1.5vw,24px);letter-spacing:-.02em;color:#E8E3F2}
.cc-title .d{margin:20px 0 0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#9C90AE}
/* column */
.cc-wrap{position:relative;z-index:6}
.cc-col{width:min(46vw,680px);margin-left:var(--cc-g);padding:0 0 18vh}
.cc-intro{height:100svh;display:flex;align-items:flex-end;padding-bottom:7vh}
.cc-cue{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.cc-cue::after{content:"";display:inline-block;width:46px;height:1px;margin-left:12px;vertical-align:middle;background:var(--tw-accent);transform-origin:left;animation:cc-cue 2.4s ease-in-out infinite}
@keyframes cc-cue{0%{transform:scaleX(0)}50%{transform:scaleX(1)}100%{transform:scaleX(0);transform-origin:right}}
.cc-row{display:grid;grid-template-columns:150px minmax(0,1fr);gap:8px 28px;margin:0 0 clamp(56px,9vh,110px)}
.cc-row>.l{font-size:14px;color:rgba(255,255,255,.62);padding-top:3px}
.cc-row>.v{font-size:clamp(15px,1.08vw,17px);line-height:1.6;color:#E8E3F2}
.cc-row>.v p{margin:0 0 1em}.cc-row>.v p:last-child{margin:0}
.cc-row>.v .lead{font-size:clamp(20px,1.6vw,26px);line-height:1.35;letter-spacing:-.02em;color:#fff;margin-bottom:.8em}
.cc-info{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 20px}
.cc-info dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.45);margin:0 0 4px}
.cc-info dd{margin:0;font-size:14px;color:#fff;line-height:1.45}
.cc-media{margin:0 0 clamp(18px,2.4vw,30px);position:relative}
.cc-media img,.cc-media video{display:block;width:100%;height:auto;max-height:86vh;object-fit:contain;background:rgba(0,0,0,.25)}
.cc-media figcaption{font-size:12px;color:rgba(255,255,255,.55);margin-top:10px;letter-spacing:.02em}
.cc-media.v figcaption::before{content:"▶ ";color:#DE8AF7;font-size:9px}
.cc-group{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.6vw,22px);margin:0 0 clamp(18px,2.4vw,30px)}
.cc-group .cc-media{margin:0}
.cc-rv{opacity:0;transform:translateY(40px);transition:opacity .9s ease,transform 1.1s cubic-bezier(.2,.75,.2,1)}
.cc-rv.on{opacity:1;transform:none}
.cc-end{margin-top:12vh}
.cc-end a{font-size:15px;color:#fff;text-decoration:none;border-bottom:1px solid transparent;border-image:var(--tw-accent) 1;padding-bottom:4px}
/* loader */
.cc-load{position:fixed;inset:0;z-index:60;background:#07070D;display:grid;place-items:center;transition:opacity .7s ease,visibility .7s}
.cc-load.done{opacity:0;visibility:hidden}
.cc-load>div{width:min(56vw,760px)}
.cc-load p{margin:0 0 14vh;font-size:14px;color:#fff}
.cc-load .bar{position:relative;height:1px;background:rgba(255,255,255,.14)}
.cc-load .bar i{position:absolute;left:0;top:0;bottom:0;width:calc(var(--p,0)*100%);background:var(--tw-accent);transition:width .25s}
.cc-load .bar b{position:absolute;top:50%;left:calc(var(--p,0)*100%);transform:translate(-100%,-50%);font-size:11px;font-weight:500;background:#fff;color:#07070D;padding:1px 5px;transition:left .25s}
.cc-load .meta{display:flex;justify-content:space-between;gap:24px;margin-top:14vh;font-size:12px;color:rgba(255,255,255,.4)}
html.cc-ready main.cc-on>.case-more{position:relative;z-index:6;padding:0 var(--cc-g) 60px!important;background:transparent!important}
html.cc-ready main.cc-on>.next-brief{position:relative;z-index:6}
@media(max-width:860px){
 .cc-title{position:absolute;left:0;right:0;top:20svh;transform:none;width:auto;padding:0 var(--cc-g)}
 .cc-title.out{opacity:1}
 .cc-col{width:auto;margin:0;padding:0 var(--cc-g) 12vh}
 .cc-intro{height:62svh}
 .cc-row{grid-template-columns:1fr}
 .cc-info{grid-template-columns:1fr 1fr}
 .cc-group{grid-template-columns:1fr}
 .cc-load>div{width:80vw}
}
@media(prefers-reduced-motion:reduce){.cc-rv{opacity:1;transform:none}.cc-title h1 .w>span{transform:none}.cc-bg i{transition:none}}
html.cc-ready .cs-chapter{display:none!important}
html.cc-ready .cc-media.cs-figure,html.cc-ready .cc-media.cs-figure>img,html.cc-ready .cc-media.cs-figure>video{transform:none!important;clip-path:none!important;filter:none!important;opacity:1}
html.cc-ready .cc-wrap h2.cs-heading{all:unset}

/* case story: challenge, approach and chapters */
.cc-story>.l b{display:block;font-weight:500;font-size:11px;letter-spacing:.2em;color:#DE8AF7;margin-bottom:6px}
.cc-story.k-reto>.v .lead,.cc-story.k-enfoque>.v .lead{font-size:clamp(24px,2.1vw,34px);line-height:1.22;letter-spacing:-.03em}
.cc-steps{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:0}
.cc-steps li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:16px;padding:18px 0;border-top:1px solid rgba(255,255,255,.1)}
.cc-steps li>span{font-size:12px;letter-spacing:.14em;color:#DE8AF7;padding-top:4px}
.cc-steps b{display:block;font-weight:500;font-size:clamp(18px,1.4vw,22px);letter-spacing:-.02em;color:#fff;margin-bottom:4px}
.cc-steps p{margin:0;font-size:15px;line-height:1.55;color:#C9C1DB}
.cc-chap{margin:clamp(90px,14vh,170px) 0 clamp(40px,6vh,70px);padding-top:28px;border-top:1px solid rgba(222,138,247,.35)}
.cc-chap .n{display:block;font-size:12px;letter-spacing:.2em;color:#9C90AE;margin-bottom:14px}
.cc-wrap .cc-chap h2{margin:0 0 18px!important;font-weight:500!important;font-size:clamp(34px,3.6vw,60px)!important;line-height:.98!important;letter-spacing:-.05em!important;color:#fff!important;max-width:none!important;opacity:1!important;transform:none!important}
.cc-chap h2 em{font-style:normal;background:linear-gradient(100deg,#8E80E8 0%,#DE8AF7 55%,#E551C1 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.cc-chap p{margin:0;max-width:52ch;font-size:clamp(15px,1.1vw,17px);line-height:1.6;color:#C9C1DB}

/* full-page website captures: framed and scrollable */
.cc-media:has(>img[data-scroll]){max-height:82vh;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#DE8AF7 transparent;border:1px solid rgba(255,255,255,.12);border-radius:10px;position:relative}
.cc-media:has(>img[data-scroll])::before{content:"";display:block;position:sticky;top:0;z-index:2;height:26px;background:#14121B url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='26'%3E%3Ccircle cx='14' cy='13' r='4' fill='%23E551C1'/%3E%3Ccircle cx='28' cy='13' r='4' fill='%23DE8AF7'/%3E%3Ccircle cx='42' cy='13' r='4' fill='%238E80E8'/%3E%3C/svg%3E") no-repeat 4px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.cc-wrap .cc-media>img[data-scroll]{width:100%!important;height:auto!important;max-height:none!important;object-fit:initial!important;display:block}
.cc-media:has(>img[data-scroll])>figcaption{position:sticky;bottom:0;background:linear-gradient(0deg,rgba(7,7,13,.92),rgba(7,7,13,0));padding:22px 14px 10px;margin:0}

.cc-wrap .cc-story>.v .lead{font-size:clamp(22px,1.9vw,30px)!important}
.cc-wrap .cc-chap p{font-size:clamp(15px,1.1vw,17px)!important}