/* Exypnos presentation mode. Style A: cream text column + navy illustration panel.
   All sizes inside the stage use --u (1% of stage width in landscape) so the
   deck scales to any screen; illustrations use their own container units. */
:root{
  --navy:#26385C; --navy-dark:#1A2740; --blue:#4E86B7; --blue-light:#8FBBE0; --blue-lighter:#DCE8F4;
  --cream:#F5F2EC; --paper:#FFFFFF; --ink:#1C2740; --muted:#5D6A82; --good:#2F8F6B; --gold:#E0B04A; --gold-deep:#B07D16;
  --display:'Montserrat',system-ui,sans-serif; --body:'Inter',system-ui,sans-serif;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--navy-dark);color:var(--ink);font-family:var(--body);overflow:hidden;
  display:grid;place-items:center;-webkit-tap-highlight-color:transparent;touch-action:pan-y}

.stage{position:relative;width:min(100vw,calc(100dvh * 16 / 9));aspect-ratio:16/9;container-type:inline-size;
  --u:1cqw;overflow:hidden;background:var(--cream);user-select:none;-webkit-user-select:none}

/* ---------- slides ---------- */
.slide{position:absolute;inset:0;display:grid;grid-template-columns:42% 58%;
  opacity:0;visibility:hidden;transform:translateX(calc(var(--dir,1) * 2%));
  transition:opacity .5s ease,transform .6s cubic-bezier(.2,.7,.2,1),visibility 0s linear .6s}
.slide.is-active{opacity:1;visibility:visible;transform:none;transition:opacity .5s ease,transform .6s cubic-bezier(.2,.7,.2,1),visibility 0s}
.txt{padding:calc(var(--u)*5) calc(var(--u)*3) calc(var(--u)*9) calc(var(--u)*5);display:flex;flex-direction:column;justify-content:center;gap:calc(var(--u)*1.9);min-width:0}
.ey{font:700 calc(var(--u)*1.2)/1.2 var(--display);letter-spacing:.16em;color:var(--blue);text-transform:uppercase}
.ttl{font:900 calc(var(--u)*4)/1.07 var(--display);color:var(--navy);letter-spacing:-.01em;margin:0;text-wrap:balance}
.ttl.big{font-size:calc(var(--u)*5.2)}
.ben{display:grid;gap:calc(var(--u)*1.3);margin:calc(var(--u)*.6) 0 0;padding:0;list-style:none}
.ben li{display:grid;grid-template-columns:calc(var(--u)*2.5) 1fr;gap:calc(var(--u)*1.1);align-items:center;font:500 calc(var(--u)*1.6)/1.3 var(--body)}
.ben b{display:grid;place-items:center;width:calc(var(--u)*2.5);height:calc(var(--u)*2.5);border-radius:50%;background:var(--navy);color:#fff;font:800 calc(var(--u)*1.15)/1 var(--display)}
.cover-logo{width:calc(var(--u)*7);height:auto}
.site{font:700 calc(var(--u)*1.5)/1 var(--display);color:var(--blue);letter-spacing:.06em}

.art{background:var(--navy);container-type:size;display:grid;place-items:center;
  padding:calc(var(--u)*3.5) calc(var(--u)*3.5) calc(var(--u)*8.5);min-width:0;min-height:0;position:relative;overflow:hidden}
/* each illustration declares --k (its width / height) so it fits the panel both ways */
.fit{width:min(100cqw,calc(100cqh * var(--k,1.6)));container-type:inline-size}

/* ---------- entrance animation ---------- */
.is-active [data-a]{animation:up .7s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--d,0) * 1s)}
@keyframes up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes growx{from{transform:scaleX(0)}to{transform:none}}
@keyframes growy{from{transform:scaleY(0)}to{transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}

/* ---------- chrome ---------- */
.chrome{position:absolute;left:0;right:0;bottom:0;height:calc(var(--u)*7);display:grid;grid-template-columns:42% 58%;z-index:5;pointer-events:none}
.chrome > *{pointer-events:auto}
.chrome .brand{display:flex;align-items:center;gap:calc(var(--u)*.9);padding-left:calc(var(--u)*5);color:var(--navy);font:800 calc(var(--u)*1.4)/1 var(--display);letter-spacing:.22em}
.chrome .brand img{width:calc(var(--u)*2.4);height:auto}
.chrome .ctrls{display:flex;align-items:center;justify-content:flex-end;gap:calc(var(--u)*.8);padding-right:calc(var(--u)*3.5);color:#C9D5E8}
.count{font:600 calc(var(--u)*1.2)/1 var(--display);letter-spacing:.12em;margin-right:calc(var(--u)*.6);font-variant-numeric:tabular-nums;color:#fff}
.btn{width:max(32px,calc(var(--u)*3.2));height:max(32px,calc(var(--u)*3.2));border-radius:50%;border:0;display:grid;place-items:center;cursor:pointer;
  background:rgba(255,255,255,.12);color:#fff;font:700 max(13px,calc(var(--u)*1.2))/1 var(--display);padding:0}
.btn svg{width:45%;height:45%;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.btn.main{background:#fff;color:var(--navy)}
a.btn{text-decoration:none}
.btn:hover{background:rgba(255,255,255,.24)} .btn.main:hover{background:var(--blue-lighter)}
.btn:focus-visible{outline:2px solid var(--blue-light);outline-offset:2px}
.btn.on{background:var(--blue);color:#fff}
.sep{width:1px;height:calc(var(--u)*2.2);background:rgba(255,255,255,.2);margin:0 calc(var(--u)*.3)}
.progress{position:absolute;left:0;bottom:0;height:calc(var(--u)*.45);background:var(--blue);width:0;transition:width .5s ease;z-index:6}
.autobar{position:absolute;left:0;top:0;height:3px;background:var(--blue-light);width:0;z-index:6}

/* ---------- shared illustration pieces ---------- */
.card{background:var(--paper);border-radius:2cqw;box-shadow:0 2cqw 5cqw -2cqw rgba(0,0,0,.45)}

/* cover */
.cover{display:grid;place-items:center;position:relative;aspect-ratio:1.6}
.cover img{width:62cqw}


/* stats */
.stats{display:grid;gap:4cqw}
.stat{display:grid;grid-template-columns:30cqw 1fr;gap:3cqw;align-items:center;border-top:.3cqw solid rgba(143,187,224,.35);padding-top:3cqw}
.stat strong{font:900 13cqw/1 var(--display);color:#fff;font-variant-numeric:tabular-nums}
.stat span{font:500 3.6cqw/1.3 var(--body);color:#fff}
.stat small{display:block;margin-top:1cqw;font:600 2.3cqw/1.2 var(--body);color:var(--blue-light);letter-spacing:.04em}

/* offers */
.offers{display:grid;gap:3cqw}
.offer{display:grid;grid-template-columns:12cqw 1fr;gap:3.5cqw;align-items:center;padding:3.6cqw 4cqw}
.offer i{width:12cqw;height:12cqw;border-radius:3cqw;background:var(--navy);display:grid;place-items:center}
.offer i svg{width:55%;height:55%;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.offer b{display:block;font:800 4.4cqw/1.1 var(--display);color:var(--navy)}
.offer span{display:block;margin-top:.8cqw;font:500 3.1cqw/1.3 var(--body);color:var(--muted)}

/* audit ranking */
.audit{padding:4.5cqw;display:grid;gap:3.4cqw}
.ihead{display:flex;justify-content:space-between;align-items:baseline;gap:2cqw}
.ihead b{font:800 3.6cqw/1.1 var(--display);color:var(--navy)}
.ihead span{font:600 2.4cqw/1 var(--body);color:var(--muted)}
.rank{display:grid;gap:2.4cqw}
.rk{display:grid;grid-template-columns:4cqw minmax(0,1fr) 24cqw auto;gap:2cqw;align-items:center;font:500 3cqw/1.2 var(--body)}
.rk .n{font:800 2.8cqw/1 var(--display);color:var(--muted)}
.rk .bar{height:2.8cqw;background:#EEF1F6;border-radius:2cqw;overflow:hidden}
.rk .bar i{display:block;height:100%;border-radius:2cqw;transform-origin:left}
.is-active .rk .bar i{animation:growx 1s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--d,0) * 1s + .25s)}
.rk .when{font:700 2.3cqw/1 var(--display);text-align:center;border-radius:5cqw;padding:1.1cqw 1.8cqw;white-space:nowrap;min-width:11cqw;color:#fff}
.m3{background:var(--navy)} .m6{background:var(--blue)} .m12{background:var(--blue-light)} .rk .when.m12{color:var(--navy)}

/* timeline */
.plan{display:grid;gap:5cqw;color:#fff}
.tl{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:3cqw;padding-top:7cqw}
.tl::before{content:"";position:absolute;left:2cqw;right:2cqw;top:2.1cqw;height:.5cqw;background:rgba(143,187,224,.4);border-radius:1cqw;transform-origin:left}
.is-active .tl::before{animation:growx 1.2s cubic-bezier(.2,.7,.2,1) .2s both}
.tl .step{position:relative;display:grid;gap:1.6cqw}
.tl .dot{position:absolute;top:-7cqw;left:0;width:4.6cqw;height:4.6cqw;border-radius:50%;border:.7cqw solid var(--navy);box-shadow:0 0 0 .4cqw rgba(143,187,224,.5)}
.is-active .tl .dot{animation:pop .5s cubic-bezier(.3,1.6,.5,1) both;animation-delay:calc(var(--d,0) * 1s)}
.tl b{font:900 5.6cqw/1 var(--display);white-space:nowrap}
.tl p{margin:0;font:500 3cqw/1.35 var(--body);color:#D5E0F0}
.rollout{display:flex;align-items:center;gap:2.6cqw;background:rgba(255,255,255,.08);border:.25cqw solid rgba(143,187,224,.35);border-radius:2cqw;padding:3cqw 3.4cqw;font:600 3cqw/1.3 var(--body)}
.rollout i{flex:none;width:6cqw;height:6cqw;border-radius:50%;background:var(--blue-light);display:grid;place-items:center}
.rollout i svg{width:60%;height:60%;fill:none;stroke:var(--navy);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

/* chat */
.chat{display:grid;grid-template-columns:25% 1fr;gap:4cqw;align-items:center}
.srcs{display:grid;gap:2.6cqw}
.src{display:flex;align-items:center;gap:1.6cqw;background:rgba(255,255,255,.08);border:.25cqw solid rgba(143,187,224,.4);color:#fff;border-radius:1.6cqw;padding:2cqw;font:700 2.4cqw/1.1 var(--display);position:relative}
.src i{width:4.2cqw;height:4.2cqw;border-radius:1cqw;background:var(--blue-light);display:grid;place-items:center;font:800 2cqw/1 var(--display);color:var(--navy);font-style:normal;flex:none}
.src::after{content:"";position:absolute;left:100%;top:50%;width:4cqw;border-top:.3cqw dashed var(--blue-light);opacity:.7}
.is-active .src.hit{animation:up .7s cubic-bezier(.2,.7,.2,1) both,hit .9s ease both;animation-delay:calc(var(--d,0) * 1s),1.9s}
@keyframes hit{0%{background:rgba(255,255,255,.08)}40%{background:var(--blue);border-color:var(--blue-light)}100%{background:rgba(78,134,183,.45);border-color:var(--blue-light)}}
.chatwin{padding:3.4cqw;display:grid;gap:2.6cqw}
.chathead{display:flex;align-items:center;gap:1.8cqw;font:800 2.7cqw/1 var(--display);color:var(--navy);padding-bottom:2.2cqw;border-bottom:.2cqw solid #EEF1F6}
.chathead .dot{width:4.6cqw;height:4.6cqw;border-radius:50%;background:var(--navy);display:grid;place-items:center}
.chathead .dot svg{width:55%;height:55%;fill:#fff}
.chathead small{margin-left:auto;font:600 2.1cqw/1 var(--body);color:var(--good)}
.q{justify-self:end;background:var(--blue);color:#fff;border-radius:2.4cqw 2.4cqw .6cqw 2.4cqw;padding:2.2cqw 2.8cqw;font:500 2.8cqw/1.35 var(--body);max-width:86%}
.aslot{position:relative;display:grid}
.typing{position:absolute;left:0;top:0;display:flex;gap:1cqw;background:#F1F4F9;border-radius:2.4cqw;padding:2.6cqw 3cqw;opacity:0}
.typing i{width:1.6cqw;height:1.6cqw;border-radius:50%;background:var(--muted)}
.is-active .typing{animation:typing 1.3s ease 1.2s both}
.is-active .typing i{animation:blink .9s ease-in-out infinite}
.typing i:nth-child(2){animation-delay:.15s!important} .typing i:nth-child(3){animation-delay:.3s!important}
@keyframes typing{0%{opacity:0}12%,85%{opacity:1}100%{opacity:0}}
@keyframes blink{0%,100%{opacity:.3}50%{opacity:1}}
.a{background:#F1F4F9;border-radius:2.4cqw 2.4cqw 2.4cqw .6cqw;padding:2.4cqw 2.8cqw;font:400 2.7cqw/1.45 var(--body);max-width:94%;display:grid;gap:1.4cqw}
.a strong{font-weight:700;color:var(--navy)}
.cites{display:flex;flex-wrap:wrap;gap:1.2cqw}
.cites span{font:700 1.8cqw/1 var(--display);letter-spacing:.06em;color:var(--blue);background:#fff;border:.2cqw solid var(--blue-lighter);border-radius:5cqw;padding:1cqw 1.6cqw}

/* excel -> dashboard */
.e2dwrap{display:grid;gap:5cqw}
.dlogo{display:flex;align-items:center;gap:2.4cqw;color:#fff}
.dlogo svg{width:7cqw;height:7cqw;fill:var(--blue-light)}
.dlogo svg rect:last-child{fill:#fff}
.dlogo b{font:900 7cqw/1 var(--display);letter-spacing:-.01em}
.dlogo b span{color:var(--blue-light)}
.e2d{display:grid;grid-template-columns:36% 9% 1fr;align-items:center}
.xl{overflow:hidden;font:500 1.9cqw/1 var(--body)}
.xl .fn{background:#1F6E43;color:#fff;font:700 2cqw/1 var(--display);padding:1.8cqw 2cqw;display:flex;gap:1.2cqw;align-items:center}
.xl .fn i{font-style:normal;background:#fff;color:#1F6E43;border-radius:.6cqw;padding:.5cqw .8cqw;font-size:1.7cqw}
.xl table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
.xl td{border:.15cqw solid #E4E7EC;padding:1.25cqw 1.2cqw;white-space:nowrap;color:#3B4458}
.xl tr:first-child td{background:#F3F5F8;font-weight:700;color:var(--navy)}
.xl td:last-child{text-align:right}
.is-active .xl tr{animation:fade .4s ease both;animation-delay:calc(var(--d,0) * 1s)}
.arrow{display:grid;justify-items:center;gap:1cqw;color:var(--blue-light);font:800 1.7cqw/1 var(--display);letter-spacing:.08em}
.arrow svg{width:7cqw;height:4cqw}
.is-active .arrow svg{animation:nudge 1.6s ease-in-out 1.4s infinite}
@keyframes nudge{0%,100%{transform:none}50%{transform:translateX(.8cqw)}}
.dash{padding:3cqw;display:grid;gap:2.4cqw}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6cqw}
.kpi{background:#F4F7FB;border-radius:1.4cqw;padding:1.8cqw;display:grid;gap:.8cqw}
.kpi span{font:600 1.6cqw/1 var(--body);color:var(--muted)}
.kpi b{font:800 3cqw/1 var(--display);color:var(--navy);font-variant-numeric:tabular-nums}
.kpi em{font:700 1.6cqw/1 var(--body);color:var(--good);font-style:normal}
.charts{display:grid;grid-template-columns:1.6fr 1fr;gap:2cqw;align-items:end}
.ctitle{font:700 1.7cqw/1 var(--display);color:var(--navy)}
.bars{display:grid;gap:1cqw}
.bars .plot{display:flex;align-items:flex-end;gap:1.4cqw;height:17cqw;border-bottom:.2cqw solid #DDE3EC;padding-inline:.6cqw}
.bars .plot i{flex:1;background:var(--blue);border-radius:.8cqw .8cqw 0 0;transform-origin:bottom}
.bars .plot i:last-child{background:var(--navy)}
.is-active .bars .plot i{animation:growy .8s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--d,0) * 1s)}
.bars .ax{display:flex;gap:1.4cqw;padding-inline:.6cqw}
.bars .ax span{flex:1;text-align:center;font:600 1.5cqw/1 var(--body);color:var(--muted)}
.donut{display:grid;gap:1.2cqw;justify-items:center}
@property --p{syntax:'<percentage>';inherits:false;initial-value:100%}
.donut .ring{--p:100%;width:15cqw;height:15cqw;border-radius:50%;display:grid;place-items:center;
  background:conic-gradient(var(--navy) 0 35%,var(--blue) 35% 69%,var(--blue-light) 69% 100%);
  -webkit-mask:conic-gradient(#000 var(--p),transparent 0);mask:conic-gradient(#000 var(--p),transparent 0)}
.is-active .donut .ring{animation:sweep 1.2s ease-out 1.7s both}
@keyframes sweep{from{--p:0%}to{--p:100%}}
.donut .ring::after{content:"";width:8.5cqw;height:8.5cqw;border-radius:50%;background:#fff}
.legend{display:grid;gap:.7cqw;font:500 1.5cqw/1 var(--body);color:var(--muted);justify-self:stretch}
.legend span{display:flex;gap:.8cqw;align-items:center}
.legend i{width:1.6cqw;height:1.6cqw;border-radius:.4cqw}

/* video */
.vid{width:100%;border-radius:1.6cqw;overflow:hidden;box-shadow:0 2cqw 5cqw -2cqw rgba(0,0,0,.5);background:#000;aspect-ratio:16/9}
.vid video{display:block;width:100%;height:100%;object-fit:contain}

/* method */
.method{display:grid;gap:3.4cqw;position:relative;padding-left:1cqw}
.method::before{content:"";position:absolute;left:5.5cqw;top:5cqw;bottom:5cqw;width:.5cqw;background:rgba(143,187,224,.35);transform-origin:top}
.is-active .method::before{animation:growy 1.4s ease .2s both}
.mstep{display:grid;grid-template-columns:10cqw 1fr;gap:3.5cqw;align-items:center;position:relative}
.mstep i{width:10cqw;height:10cqw;border-radius:50%;background:var(--paper);color:var(--navy);display:grid;place-items:center;font:900 3.6cqw/1 var(--display);font-style:normal;box-shadow:0 0 0 .8cqw var(--navy)}
.mstep span{display:block;font:700 2.4cqw/1 var(--display);letter-spacing:.14em;color:var(--blue-light);text-transform:uppercase}
.mstep b{display:block;margin-top:1cqw;font:800 4.4cqw/1.15 var(--display);color:#fff}

/* clients */
.proof{display:grid;gap:3.4cqw}
.case{display:flex;align-items:center;justify-content:center;gap:4cqw;padding:4.5cqw 5cqw;border:.3cqw solid rgba(143,187,224,.4);border-radius:2cqw;background:rgba(255,255,255,.06)}
.case img{width:42cqw;height:auto}
.logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2cqw}
.logos div{position:relative;aspect-ratio:2/1;border:.2cqw solid rgba(143,187,224,.22);border-radius:1.6cqw}
.logos img{position:absolute;inset:18%;width:64%;height:64%;object-fit:contain;filter:grayscale(1) brightness(0) invert(1);opacity:.85}
.count15{color:#fff;font:600 3cqw/1.2 var(--body)} .count15 b{font:900 5.4cqw/1 var(--display);margin-right:1.4cqw;color:var(--blue-light)}

/* contact */
.qrs{display:grid;grid-template-columns:52cqw;justify-content:center}
.qr{padding:4cqw;display:grid;gap:2.6cqw;justify-items:center;text-align:center}
.qr img{width:100%;aspect-ratio:1;display:block}
.qr b{font:800 3.6cqw/1.15 var(--display);color:var(--navy);display:flex;align-items:center;gap:1.4cqw}
.qr b svg{width:4.4cqw;height:4.4cqw}
.qr span{font:500 2.6cqw/1 var(--body);color:var(--muted)}
/* Big Tech offer: gold lead-in in the title, gold ring and tag on the Calendly card */
.ttl em{font-style:normal;color:var(--gold-deep)}
.ttl .w:has(em){display:block}
.qrs:has(.promo){padding-top:2.4cqw}
.qr.promo{position:relative;box-shadow:0 0 0 1.1cqw var(--gold),0 2cqw 5cqw -2cqw rgba(0,0,0,.45)}
.qr .tag{position:absolute;top:0;left:50%;transform:translate(-50%,-60%);white-space:nowrap;background:var(--gold);color:var(--navy-dark);
  font:800 2.3cqw/1 var(--display);letter-spacing:.08em;text-transform:uppercase;padding:1.3cqw 2.6cqw;border-radius:99px}
.contacts{display:grid;gap:calc(var(--u)*1.1);margin:calc(var(--u)*.8) 0 0;padding:0;list-style:none}
.contacts li{display:flex;align-items:center;gap:calc(var(--u)*1.1);font:600 calc(var(--u)*1.6)/1.25 var(--body);color:var(--navy);overflow-wrap:anywhere}
.contacts svg{flex:none;width:calc(var(--u)*2.4);height:calc(var(--u)*2.4);padding:calc(var(--u)*.45);border-radius:50%;background:var(--navy);fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.contacts a{color:inherit;text-decoration:none;user-select:text;-webkit-user-select:text}


/* ---------- extra motion ---------- */
.ttl .w{display:inline-block}
.is-active .ttl .w{animation:wordup .75s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--d,0) * 1s)}
@keyframes wordup{from{opacity:0;transform:translateY(.45em) rotate(2deg)}to{opacity:1;transform:none}}
.ey{position:relative;padding-left:calc(var(--u)*3.4)}
.ey{display:none} /* titles stand alone: no small label above them, on any slide */
.ey::before{content:"";position:absolute;left:0;top:50%;width:calc(var(--u)*2.4);height:2px;background:var(--blue);transform-origin:left}
.is-active .ey::before{animation:growx .7s ease .1s both}
.glow{position:absolute;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(143,187,224,.16),transparent 65%);top:-20%;right:-20%;pointer-events:none}
.is-active .glow{animation:drift 14s ease-in-out infinite alternate}
@keyframes drift{from{transform:translate(0,0)}to{transform:translate(-30%,45%)}}
.answer{margin:calc(var(--u)*.4) 0 0;font:800 calc(var(--u)*2.3)/1.2 var(--display);color:var(--blue);display:inline-block}
.is-active .slidein{animation:slidein .8s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--d,0) * 1s)}
@keyframes slidein{from{opacity:0;transform:translateX(12cqw)}to{opacity:1;transform:none}}
.offer{position:relative;grid-template-columns:12cqw 1fr auto}
button.offer{border:0;font:inherit;text-align:left;cursor:pointer;color:inherit;width:100%;transition:scale .25s ease,box-shadow .25s ease}
button.offer:hover,button.offer:focus-visible{scale:1.03;box-shadow:0 2.6cqw 6cqw -2cqw rgba(0,0,0,.6)}
button.offer:focus-visible{outline:.5cqw solid var(--blue-light);outline-offset:.6cqw}
.offer .check{font-style:normal;width:6cqw;height:6cqw;border-radius:50%;background:var(--good);color:#fff;display:grid;place-items:center;font:800 3cqw/1 var(--body);opacity:0}
.is-active .offer .check{animation:pop .45s cubic-bezier(.3,1.6,.5,1) both;animation-delay:calc(var(--d,0) * 1s + .7s)}
.is-active .popin{animation:pop .7s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(var(--d,0) * 1s)}
.is-active .flip{animation:flip .8s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--d,0) * 1s)}
@keyframes flip{from{opacity:0;transform:perspective(60cqw) rotateY(-70deg)}to{opacity:1;transform:none}}
.is-active .qr img{animation:fade .6s ease both;animation-delay:calc(var(--d,0) * 1s + .5s)}

/* audit process */
.process{padding:4cqw;display:grid;gap:4cqw}
.ptrack{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:2cqw}
.pline{position:absolute;left:6%;right:6%;top:3.2cqw;height:.5cqw;background:#E6EBF2;border-radius:1cqw;overflow:hidden}
.pline i{display:block;height:100%;background:var(--blue);width:0;transition:width .6s ease}
[data-step="1"] .pline i{width:33%} [data-step="2"] .pline i{width:66%} [data-step="3"] .pline i{width:100%}
.pstep{position:relative;display:grid;justify-items:center;gap:1.4cqw;text-align:center}
.pstep i{width:6.8cqw;height:6.8cqw;border-radius:50%;background:#E6EBF2;color:var(--muted);display:grid;place-items:center;font:800 2.8cqw/1 var(--display);font-style:normal;transition:background .4s,color .4s,transform .4s}
.pstep span{font:600 2.2cqw/1.25 var(--body);color:var(--muted);transition:color .4s}
[data-step="0"] .pstep[data-s="0"] i,[data-step="1"] .pstep[data-s="1"] i,[data-step="2"] .pstep[data-s="2"] i,[data-step="3"] .pstep[data-s="3"] i{background:var(--navy);color:#fff;transform:scale(1.12)}
[data-step="0"] .pstep[data-s="0"] span,[data-step="1"] .pstep[data-s="1"] span,[data-step="2"] .pstep[data-s="2"] span,[data-step="3"] .pstep[data-s="3"] span{color:var(--navy)}
[data-step="1"] .pstep[data-s="0"] i,[data-step="2"] .pstep[data-s="0"] i,[data-step="2"] .pstep[data-s="1"] i,[data-step="3"] .pstep:not([data-s="3"]) i{background:var(--blue);color:#fff}
.pstage{position:relative;height:30cqw;background:#F4F7FB;border-radius:2cqw;overflow:hidden}
.pv{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transform:translateY(3cqw);transition:opacity .45s ease,transform .45s ease;pointer-events:none}
[data-step="0"] .pv[data-s="0"],[data-step="1"] .pv[data-s="1"],[data-step="2"] .pv[data-s="2"],[data-step="3"] .pv[data-s="3"]{opacity:1;transform:none}
/* step 1: workshop table with sticky notes */
.pv[data-s="0"]{grid-template-columns:1fr 1fr;padding:0 4cqw;gap:3cqw}
.table{position:relative;width:24cqw;height:16cqw;justify-self:center}
.board{position:absolute;left:4cqw;right:4cqw;top:4cqw;bottom:4cqw;border-radius:3cqw;background:var(--blue-lighter)}
.seat{position:absolute;width:6cqw;height:6cqw;border-radius:50%;background:var(--navy)}
.s1{left:0;top:5cqw}.s2{right:0;top:5cqw}.s3{left:9cqw;top:-1cqw;background:var(--blue)}.s4{left:9cqw;bottom:-1cqw;background:var(--blue-light)}
.notes{display:grid;gap:1.6cqw}
.note{background:#FFF4C2;color:#5B4A00;font:600 2.2cqw/1.2 var(--body);padding:1.6cqw 2cqw;border-radius:.6cqw;box-shadow:0 .6cqw 1.4cqw -.6cqw rgba(0,0,0,.3);opacity:0;transform:rotate(-2deg) translateY(2cqw)}
.n1{transform:rotate(2deg) translateY(2cqw);background:#D9F0E3;color:#14513A}.n2{background:#DCE8F4;color:var(--navy)}
[data-step="0"] .note{animation:noteIn .5s ease forwards}
[data-step="0"] .n0{animation-delay:.3s}[data-step="0"] .n1{animation-delay:.8s}[data-step="0"] .n2{animation-delay:1.3s}
@keyframes noteIn{to{opacity:1;transform:rotate(var(--r,-2deg))}}
.n1{--r:2deg}.n2{--r:-1deg}
/* step 2: ranking */
.mini-rank{width:80%;display:grid;gap:2.4cqw}
.mini-rank div{display:grid;grid-template-columns:1fr 26cqw;gap:2cqw;align-items:center;font:600 2.5cqw/1.2 var(--body);color:var(--navy)}
.mini-rank b{height:2.6cqw;background:#E3E9F1;border-radius:2cqw;overflow:hidden}
.mini-rank b i{display:block;height:100%;background:var(--navy);border-radius:2cqw;transform-origin:left;transform:scaleX(0);transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.mini-rank div:nth-child(2) b i{background:var(--blue)} .mini-rank div:nth-child(3) b i{background:var(--blue-light)}
[data-step="1"] .mini-rank b i{transform:none}
[data-step="1"] .mini-rank div:nth-child(2) b i{transition-delay:.15s}[data-step="1"] .mini-rank div:nth-child(3) b i{transition-delay:.3s}
/* step 3: tool review */
.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:2.4cqw;width:86%}
.tool{background:#fff;border-radius:1.6cqw;padding:2.6cqw 2cqw;display:grid;justify-items:center;gap:1.4cqw;box-shadow:0 .8cqw 2cqw -1cqw rgba(38,56,92,.3);font:700 2.2cqw/1.2 var(--display);color:var(--navy);text-align:center}
.tool .logo{width:7cqw;height:7cqw;border-radius:1.6cqw;background:linear-gradient(135deg,var(--blue-light),var(--blue))}
.tool em{font-style:normal;width:5cqw;height:5cqw;border-radius:50%;display:grid;place-items:center;color:#fff;font:800 2.6cqw/1 var(--body);transform:scale(0);transition:transform .4s cubic-bezier(.3,1.6,.5,1);transition-delay:calc(var(--i) * .25s + .3s)}
.tool.ok em{background:var(--good)} .tool.no em{background:#C9514A} .tool.no{opacity:.75}
[data-step="2"] .tool em{transform:none}
/* step 4: report */
.report{display:grid;grid-template-columns:auto 1fr;gap:4cqw;align-items:center;width:86%}
.doc{width:20cqw;height:24cqw;background:#fff;border-radius:1.2cqw;box-shadow:0 1cqw 2.4cqw -1cqw rgba(38,56,92,.35);padding:2.4cqw;display:grid;gap:1.6cqw;align-content:start;border-top:1.2cqw solid var(--navy)}
.doc b{font:800 2.1cqw/1.2 var(--display);color:var(--navy)}
.doc span{height:1.2cqw;border-radius:1cqw;background:#E3E9F1}.doc .short{width:60%}
.todo{list-style:none;margin:0;padding:0;display:grid;gap:2cqw}
.todo li{display:flex;align-items:center;gap:1.6cqw;font:600 2.6cqw/1.2 var(--body);color:var(--navy);opacity:0;transform:translateX(3cqw);transition:opacity .4s,transform .4s;transition-delay:calc(var(--i) * .3s + .2s)}
.todo em{font-style:normal;width:4.4cqw;height:4.4cqw;border-radius:1cqw;background:var(--good);color:#fff;display:grid;place-items:center;font:800 2.4cqw/1 var(--body)}
[data-step="3"] .todo li{opacity:1;transform:none}

/* Betatex: borderless stat strip, then the phases (ongoing ones as white cards) */
.casewrap{display:grid;gap:4.4cqw}
.case-logo{width:30cqw;height:auto}
.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:.2cqw solid rgba(143,187,224,.3)}
.metric{padding:3.4cqw 2.4cqw;display:grid;gap:1.2cqw;align-content:start}
.metric+.metric{border-left:.2cqw solid rgba(143,187,224,.3)}
.metric b{font:900 6cqw/1 var(--display);color:#fff;white-space:nowrap}
.metric span{font:500 2cqw/1.35 var(--body);color:var(--blue-lighter)}
.road{display:grid;gap:2.4cqw}
.road .label{font:800 1.8cqw/1 var(--display);letter-spacing:.16em;text-transform:uppercase;color:var(--blue-light)}
.phases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6cqw}
.phase{padding:2.6cqw 2.4cqw;border-radius:1.6cqw;display:grid;gap:1.4cqw;align-content:start;background:var(--paper);color:var(--navy);box-shadow:0 1.6cqw 3cqw -1.6cqw rgba(0,0,0,.5)}
.phase.done{background:rgba(255,255,255,.06);color:var(--blue-lighter);box-shadow:none}
.phase small{font:700 1.5cqw/1.2 var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.phase.done small{color:var(--blue-light)}
.phase b{font:800 2.5cqw/1.2 var(--display)}
.trust{font:600 calc(var(--u)*1.4)/1.2 var(--body);color:var(--navy);margin-top:calc(var(--u)*1.2)}
.trust b{font:900 calc(var(--u)*2.6)/1 var(--display);color:var(--blue);margin-right:calc(var(--u)*.8)}
.logos-dark{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(var(--u)*1.2) calc(var(--u)*1.6);max-width:calc(var(--u)*27)}
.logos-dark span{position:relative;aspect-ratio:2.2/1}
.logos-dark img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:grayscale(1) brightness(0);opacity:.55}

/* pricing */
.prices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3cqw}
.price{padding:4cqw 3.6cqw;display:grid;gap:1.2cqw;align-content:start}
.pname{font:800 2.6cqw/1.2 var(--display);color:var(--blue);letter-spacing:.02em}
.price b{font:900 5.6cqw/1.05 var(--display);color:var(--navy);font-variant-numeric:tabular-nums}
.price em{font:700 2.2cqw/1 var(--display);font-style:normal;color:var(--navy);letter-spacing:.06em}
.price small{font:500 2.3cqw/1.3 var(--body);color:var(--muted);margin-top:.6cqw}
.annex .art{background:var(--navy-dark)}

/* fullscreen button shows enter or leave */
.btn .i-out{display:none} .btn.is-full .i-in{display:none} .btn.is-full .i-out{display:block}

/* full-screen question slide */
.slide.full{grid-template-columns:1fr;background:var(--navy)}
.slide.full .txt{align-items:center;text-align:center;justify-content:center;padding:calc(var(--u)*5) calc(var(--u)*8) calc(var(--u)*9);gap:calc(var(--u)*3)}
.slide.full .ey{color:var(--blue-light)}
.slide.full .ey::before{background:var(--blue-light)}
.slide.full .ttl{color:#fff;font-size:calc(var(--u)*7.4);max-width:calc(var(--u)*80)}
.slide.full .answer{color:var(--blue-light);font-size:calc(var(--u)*4)}
.stage.on-dark .chrome .brand{color:#fff}
.stage.on-dark .chrome .brand img{filter:brightness(0) invert(1)}

/* ---------- portrait phones: text above, picture below ---------- */
@media (orientation:portrait){
  html:not(.rot) .stage{width:100vw;height:100dvh;aspect-ratio:auto;--u:2.15cqw}
  html:not(.rot) .slide{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  html:not(.rot) .txt{padding:calc(var(--u)*5) calc(var(--u)*4) calc(var(--u)*3.4);gap:calc(var(--u)*1.5)}
  html:not(.rot) .ttl{font-size:calc(var(--u)*3.8)} html:not(.rot) .ttl.big{font-size:calc(var(--u)*4.6)}
  html:not(.rot) .slide.full{grid-template-rows:1fr} html:not(.rot) .slide.full .txt{padding:calc(var(--u)*5) calc(var(--u)*4) calc(var(--u)*8)} html:not(.rot) .slide.full .ttl{font-size:calc(var(--u)*6.4)} html:not(.rot) .slide.full .answer{font-size:calc(var(--u)*3.4)}
  html:not(.rot) .art{padding:calc(var(--u)*3) calc(var(--u)*3) calc(var(--u)*8)}
  html:not(.rot) .chrome{grid-template-columns:auto 1fr;background:var(--navy);height:calc(var(--u)*6.4)}
  html:not(.rot) .chrome .brand{color:#fff;padding-left:calc(var(--u)*3)}
  html:not(.rot) .chrome .brand img{filter:brightness(0) invert(1)}
  html:not(.rot) .chrome .ctrls{padding-right:calc(var(--u)*3)}
  html:not(.rot) .e2d{grid-template-columns:1fr;gap:3cqw}
  html:not(.rot) .arrow svg{transform:rotate(90deg)!important;animation:none!important}
  html:not(.rot) .e2d .xl tr:nth-child(n+5){display:none}
  html:not(.rot) .logos-dark{max-width:none}
  html:not(.rot) .count{display:inline}
}
/* home-screen app and fullscreen: the deck fills the whole screen (no 16:9 letterbox);
   sizes follow the height so a wider screen only widens the columns */
html.app body,html.fs body{display:block;touch-action:none}
html.app:not(.rot) .stage,html.fs:not(.rot) .stage{position:fixed;top:0;bottom:0;left:env(safe-area-inset-left);right:env(safe-area-inset-right);
  width:auto;aspect-ratio:auto;--u:min(1cqw,calc(100dvh * 16 / 900))}
/* held upright with rotation lock: the deck is turned 90°, below the iOS status bar
   (a web app cannot hide it while the phone is upright) */
html.rot .stage{position:fixed;left:50%;top:calc(env(safe-area-inset-top) + (100dvh - env(safe-area-inset-top)) / 2);
  width:calc(100dvh - env(safe-area-inset-top));height:100vw;aspect-ratio:auto;--u:min(1cqw,calc(100vw * 16 / 900));
  transform:translate(-50%,-50%) rotate(90deg)}

/* no fullscreen button where it cannot work (iPhone Safari) or is not needed (home-screen app) */
.no-fs #full{display:none}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* offer title slides */
.sec-ic{width:calc(var(--u)*7);height:calc(var(--u)*7);border-radius:calc(var(--u)*1.8);background:var(--blue);display:grid;place-items:center}
.sec-ic svg{width:55%;height:55%;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.is-active .sec-ic{animation:pop .7s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(var(--d,0) * 1s)}

/* audit: who it's for */
.aud{display:grid;gap:3cqw}
.audc{padding:3.6cqw 4cqw}
.audh{display:grid;grid-template-columns:10cqw 1fr;gap:3cqw;align-items:center}
.audh i{width:10cqw;height:10cqw;border-radius:2.6cqw;background:var(--navy);display:grid;place-items:center}
.audh i svg{width:55%;height:55%;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.audh small{display:block;font:700 2.2cqw/1.2 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.audh b{display:block;margin-top:.6cqw;font:800 3.9cqw/1.15 var(--display);color:var(--navy)}
.audc ul{list-style:none;margin:3cqw 0 0;padding:0;display:flex;flex-wrap:nowrap;gap:1.2cqw}
.audc li{font:600 2.2cqw/1 var(--body);color:var(--navy);background:rgba(66,122,182,.12);border-radius:99px;padding:1.3cqw 2cqw;white-space:nowrap}
/* one audience at a time: the second card arrives on the next step, the first one steps back.
   filter/translate/scale so the slide-in animation's opacity and transform are left alone */
.audc{transition:filter .5s ease,scale .5s ease,translate .6s cubic-bezier(.2,.7,.2,1),visibility 0s}
.aud[data-step="0"] .audc:nth-child(2){filter:opacity(0);translate:0 4cqw;visibility:hidden;transition:filter .3s ease,translate .3s ease,visibility 0s linear .3s}
.aud[data-step="1"] .audc:nth-child(1){filter:opacity(.35) grayscale(1);scale:.96}

/* ---------- phones (html.m): a landscape canvas filling the screen, one section per slide.
   The text column is dropped: eyebrow + title sit in a strip above a full-width picture.
   Sizes use --s = 1% of the screen's short side, so the canvas is ~180-220s by 100s. ---------- */
html.m{--s:min(1vw,1dvh)}
html.m body{touch-action:none}
html.m:not(.rot) .stage{position:fixed;top:0;bottom:0;left:env(safe-area-inset-left);right:env(safe-area-inset-right);width:auto;aspect-ratio:auto}
html.m .slide{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr)}
html.m .slide.full{grid-template-rows:1fr}
html.m .mhead{padding:calc(var(--s)*4) calc(var(--s)*36) calc(var(--s)*3.4) calc(var(--s)*5);display:grid;gap:calc(var(--s)*1.1);min-width:0}
html.m .ey{font-size:calc(var(--s)*2.6);padding-left:calc(var(--s)*6.4)}
html.m .ey::before{width:calc(var(--s)*4.6)}
html.m .ttl{font-size:calc(var(--s)*5.2);line-height:1.1}
html.m .art{padding:calc(var(--s)*3.4) calc(var(--s)*5) calc(var(--s)*4.4)}
html.m .mfit{width:100%;display:grid;justify-items:center;align-items:center}
html.m .card{border-radius:calc(var(--s)*2.6);box-shadow:0 calc(var(--s)*2.4) calc(var(--s)*5) calc(var(--s)*-2.4) rgba(0,0,0,.5)}

/* chrome: count and buttons top right, progress line at the bottom */
html.m .chrome{top:0;bottom:auto;height:auto;display:flex;justify-content:flex-end;padding:calc(var(--s)*3) calc(var(--s)*4) 0 0}
html.m .chrome .brand{display:none}
html.m .chrome .ctrls{padding:0;gap:calc(var(--s)*1.8)}
html.m .count{font-size:calc(var(--s)*2.8);color:var(--navy);margin-right:calc(var(--s)*1)}
html.m .btn{width:calc(var(--s)*9);height:calc(var(--s)*9);background:rgba(38,56,92,.1);color:var(--navy);font-size:calc(var(--s)*3)}
html.m .stage.on-dark .count{color:#fff}
html.m .stage.on-dark .btn{background:rgba(255,255,255,.14);color:#fff}
html.m .progress{height:calc(var(--s)*1)}

/* full slides: cover, question, offer titles */
html.m .slide.full .txt{padding:calc(var(--s)*8) calc(var(--s)*12);gap:calc(var(--s)*3)}
html.m .slide.full .ey{font-size:calc(var(--s)*3)}
html.m .slide.full .ttl{font-size:calc(var(--s)*10);max-width:none}
html.m .slide.full .answer{font-size:calc(var(--s)*5.6);margin:0}
html.m .sec-ic{width:calc(var(--s)*13);height:calc(var(--s)*13);border-radius:calc(var(--s)*3.4)}
html.m .mcover{width:calc(var(--s)*64);height:auto;margin-bottom:calc(var(--s)*3)}
html.m .slide.full .mcover ~ .ttl{font-size:calc(var(--s)*9)}

/* offers: three cards side by side */
html.m .offers{grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(var(--s)*3.4);width:min(100%,calc(var(--s)*168))}
html.m .offer{grid-template-columns:1fr;align-content:start;justify-items:start;gap:calc(var(--s)*3);padding:calc(var(--s)*4.4);min-height:calc(var(--s)*46);border-radius:calc(var(--s)*3)}
html.m .offer i{width:calc(var(--s)*12);height:calc(var(--s)*12);border-radius:calc(var(--s)*3)}
html.m .offer b{font-size:calc(var(--s)*4.4)}
html.m .offer span{font-size:calc(var(--s)*3.5);margin-top:calc(var(--s)*1.2)}
html.m .offer .check{position:absolute;top:calc(var(--s)*4.4);right:calc(var(--s)*4.4);width:calc(var(--s)*7);height:calc(var(--s)*7);font-size:calc(var(--s)*3.4)}

/* audit process: steps listed on the left, the picture of the current step on the right */
html.m .process{width:min(100%,calc(var(--s)*168));grid-template-columns:calc(var(--s)*48) minmax(0,1fr);gap:calc(var(--s)*4);padding:calc(var(--s)*4);align-items:center}
html.m .ptrack{grid-template-columns:1fr;gap:calc(var(--s)*3.6)}
html.m .pline{left:calc(var(--s)*3.1);right:auto;top:calc(var(--s)*3.5);bottom:calc(var(--s)*3.5);width:calc(var(--s)*.8);height:auto}
html.m .pline i{width:100%;height:0;transition:height .6s ease}
html.m [data-step="1"] .pline i{height:33%} html.m [data-step="2"] .pline i{height:66%} html.m [data-step="3"] .pline i{height:100%}
html.m .pstep{grid-template-columns:calc(var(--s)*7) 1fr;justify-items:start;align-items:center;text-align:left;gap:calc(var(--s)*2.6)}
html.m .pstep i{width:calc(var(--s)*7);height:calc(var(--s)*7);font-size:calc(var(--s)*3.2)}
html.m .pstep span{font-size:calc(var(--s)*3.4)}
html.m .pstage{height:calc(var(--s)*56);border-radius:calc(var(--s)*2.6)}
html.m .pv{transform:translateY(calc(var(--s)*3))}
html.m .pv[data-s="0"]{padding:0 calc(var(--s)*4);gap:calc(var(--s)*4)}
html.m .table{width:calc(var(--s)*36);height:calc(var(--s)*25)}
html.m .board{inset:calc(var(--s)*6)}
html.m .seat{width:calc(var(--s)*9);height:calc(var(--s)*9)}
html.m .s1,html.m .s2{top:calc(var(--s)*8)} html.m .s3,html.m .s4{left:calc(var(--s)*13.5)}
html.m .s3{top:calc(var(--s)*-1.6)} html.m .s4{top:auto;bottom:calc(var(--s)*-1.6)}
html.m .notes{gap:calc(var(--s)*2.6)}
html.m .note{font-size:calc(var(--s)*3.3);padding:calc(var(--s)*2.2) calc(var(--s)*2.8);border-radius:calc(var(--s)*1)}
html.m .mini-rank{width:86%;gap:calc(var(--s)*4.4)}
html.m .mini-rank div{grid-template-columns:1fr calc(var(--s)*40);gap:calc(var(--s)*3);font-size:calc(var(--s)*3.6)}
html.m .mini-rank b{height:calc(var(--s)*3.6)}
html.m .tools{width:90%;gap:calc(var(--s)*3)}
html.m .tool{padding:calc(var(--s)*3.6) calc(var(--s)*2.4);gap:calc(var(--s)*2);border-radius:calc(var(--s)*2.2);font-size:calc(var(--s)*3.2)}
html.m .tool .logo{width:calc(var(--s)*10);height:calc(var(--s)*10);border-radius:calc(var(--s)*2.4)}
html.m .tool em{width:calc(var(--s)*7);height:calc(var(--s)*7);font-size:calc(var(--s)*3.6)}
html.m .report{width:88%;gap:calc(var(--s)*5)}
html.m .doc{width:calc(var(--s)*28);height:calc(var(--s)*34);padding:calc(var(--s)*3);gap:calc(var(--s)*2.2);border-top-width:calc(var(--s)*1.6);border-radius:calc(var(--s)*1.6)}
html.m .doc b{font-size:calc(var(--s)*3)}
html.m .doc span{height:calc(var(--s)*1.8)}
html.m .todo{gap:calc(var(--s)*3.4)}
html.m .todo li{font-size:calc(var(--s)*3.6);gap:calc(var(--s)*2.2)}
html.m .todo em{width:calc(var(--s)*6);height:calc(var(--s)*6);font-size:calc(var(--s)*3.2);border-radius:calc(var(--s)*1.4)}

/* audit audiences: the two cards side by side */
html.m .aud{grid-template-columns:1fr 1fr;gap:calc(var(--s)*4);width:min(100%,calc(var(--s)*168));align-items:stretch}
html.m .audc{padding:calc(var(--s)*5) calc(var(--s)*4.6)}
html.m .audh{grid-template-columns:calc(var(--s)*12) 1fr;gap:calc(var(--s)*3.4)}
html.m .audh i{width:calc(var(--s)*12);height:calc(var(--s)*12);border-radius:calc(var(--s)*3)}
html.m .audh small{font-size:calc(var(--s)*2.8)}
html.m .audh b{font-size:calc(var(--s)*4.6);margin-top:calc(var(--s)*1)}
html.m .audc ul{flex-wrap:wrap;gap:calc(var(--s)*2);margin-top:calc(var(--s)*4.4)}
html.m .audc li{font-size:calc(var(--s)*3.4);padding:calc(var(--s)*1.8) calc(var(--s)*3)}
html.m .aud[data-step="0"] .audc:nth-child(2){translate:0 calc(var(--s)*4)}

/* chatbot */
html.m .chat{grid-template-columns:calc(var(--s)*36) minmax(0,1fr);gap:calc(var(--s)*7);width:min(100%,calc(var(--s)*168))}
html.m .srcs{gap:calc(var(--s)*3)}
html.m .src{font-size:calc(var(--s)*3.4);padding:calc(var(--s)*2.6);gap:calc(var(--s)*2.2);border-radius:calc(var(--s)*2);border-width:calc(var(--s)*.3)}
html.m .src i{width:calc(var(--s)*6);height:calc(var(--s)*6);font-size:calc(var(--s)*2.8);border-radius:calc(var(--s)*1.4)}
html.m .src::after{width:calc(var(--s)*7);border-top-width:calc(var(--s)*.4)}
html.m .chatwin{padding:calc(var(--s)*4.4);gap:calc(var(--s)*3.2)}
html.m .chathead{font-size:calc(var(--s)*3.8);gap:calc(var(--s)*2.4);padding-bottom:calc(var(--s)*3);border-bottom-width:calc(var(--s)*.3)}
html.m .chathead .dot{width:calc(var(--s)*7);height:calc(var(--s)*7)}
html.m .chathead small{font-size:calc(var(--s)*3)}
html.m .q{font-size:calc(var(--s)*3.8);padding:calc(var(--s)*2.8) calc(var(--s)*3.6);border-radius:calc(var(--s)*3.4) calc(var(--s)*3.4) calc(var(--s)*1) calc(var(--s)*3.4)}
html.m .typing{gap:calc(var(--s)*1.4);padding:calc(var(--s)*3.4) calc(var(--s)*4);border-radius:calc(var(--s)*3.4)}
html.m .typing i{width:calc(var(--s)*2.2);height:calc(var(--s)*2.2)}
html.m .a{font-size:calc(var(--s)*3.8);padding:calc(var(--s)*3) calc(var(--s)*3.6);gap:calc(var(--s)*2.2);border-radius:calc(var(--s)*3.4) calc(var(--s)*3.4) calc(var(--s)*3.4) calc(var(--s)*1)}
html.m .cites{gap:calc(var(--s)*1.6)}
html.m .cites span{font-size:calc(var(--s)*2.8);padding:calc(var(--s)*1.4) calc(var(--s)*2.2);border-width:calc(var(--s)*.3)}

/* Excel -> dashboard (the DashAI name is already in the strip) */
html.m .dlogo{display:none}
html.m .e2dwrap{width:min(100%,calc(var(--s)*170))}
html.m .e2d{grid-template-columns:calc(var(--s)*56) calc(var(--s)*14) minmax(0,1fr)}
html.m .xl{font-size:calc(var(--s)*3)}
html.m .xl .fn{font-size:calc(var(--s)*3);padding:calc(var(--s)*2.6) calc(var(--s)*3);gap:calc(var(--s)*1.8)}
html.m .xl .fn i{font-size:calc(var(--s)*2.5);padding:calc(var(--s)*.8) calc(var(--s)*1.2);border-radius:calc(var(--s)*1)}
html.m .xl td{padding:calc(var(--s)*1.9) calc(var(--s)*1.8);border-width:calc(var(--s)*.2)}
html.m .arrow{font-size:calc(var(--s)*2.4);gap:calc(var(--s)*1.4)}
html.m .arrow svg{width:calc(var(--s)*9);height:calc(var(--s)*5.2)}
html.m .dash{padding:calc(var(--s)*3.6);gap:calc(var(--s)*3)}
html.m .kpis{gap:calc(var(--s)*2)}
html.m .kpi{padding:calc(var(--s)*2.4);gap:calc(var(--s)*1.2);border-radius:calc(var(--s)*1.8)}
html.m .kpi span,html.m .kpi em{font-size:calc(var(--s)*2.6)}
html.m .kpi b{font-size:calc(var(--s)*4.6)}
html.m .charts{gap:calc(var(--s)*3)}
html.m .ctitle{font-size:calc(var(--s)*2.8)}
html.m .bars{gap:calc(var(--s)*1.4)}
html.m .bars .plot{height:calc(var(--s)*20);gap:calc(var(--s)*1.8)}
html.m .bars .plot i{border-radius:calc(var(--s)*1) calc(var(--s)*1) 0 0}
html.m .bars .ax{gap:calc(var(--s)*1.8)}
html.m .bars .ax span{font-size:calc(var(--s)*2.6)}
html.m .donut{gap:calc(var(--s)*1.4)}
html.m .donut .ring{width:calc(var(--s)*17);height:calc(var(--s)*17)}
html.m .donut .ring::after{width:calc(var(--s)*9.6);height:calc(var(--s)*9.6)}
html.m .legend{gap:calc(var(--s)*1.1);font-size:calc(var(--s)*2.6)}
html.m .legend i{width:calc(var(--s)*2.4);height:calc(var(--s)*2.4);border-radius:calc(var(--s)*.6)}

/* contact: the two QR codes, then WhatsApp and email */
html.m .mcontact{display:grid;grid-template-columns:auto auto;gap:calc(var(--s)*7);align-items:center}
html.m .qrs{grid-template-columns:calc(var(--s)*48)}
html.m .qrs:has(.promo){padding-top:calc(var(--s)*2.6)}
html.m .qr.promo{box-shadow:0 0 0 calc(var(--s)*1) var(--gold),0 calc(var(--s)*2.4) calc(var(--s)*5) calc(var(--s)*-2.4) rgba(0,0,0,.5)}
html.m .qr .tag{font-size:calc(var(--s)*2.3);padding:calc(var(--s)*1.2) calc(var(--s)*2.4)}
html.m .qr{padding:calc(var(--s)*3.6);gap:calc(var(--s)*2.2)}
html.m .qr b{font-size:calc(var(--s)*3.2);gap:calc(var(--s)*1.4)}
html.m .qr b svg{width:calc(var(--s)*4.4);height:calc(var(--s)*4.4)}
html.m .qr span{font-size:calc(var(--s)*2.8)}
html.m .contacts{gap:calc(var(--s)*3.6);margin:0}
html.m .contacts li{font-size:calc(var(--s)*3.6);gap:calc(var(--s)*2.4);color:#fff}
html.m .contacts svg{width:calc(var(--s)*8);height:calc(var(--s)*8);padding:calc(var(--s)*1.7);background:var(--blue)}

/* pricing */
html.m .prices{width:min(100%,calc(var(--s)*160));gap:calc(var(--s)*4)}
html.m .price{padding:calc(var(--s)*4) calc(var(--s)*4.4);gap:calc(var(--s)*1.4)}
html.m .pname{font-size:calc(var(--s)*3.4)}
html.m .price b{font-size:calc(var(--s)*6.4)}
html.m .price em{font-size:calc(var(--s)*2.8)}
html.m .price small{font-size:calc(var(--s)*3)}

/* phones: client case in two slides. Betatex: logo + phases timeline | figures */
html.m .mc{width:min(100%,calc(var(--s)*164));display:grid;grid-template-columns:calc(var(--s)*62) 1fr;gap:calc(var(--s)*8);align-items:center}
html.m .mc-left{display:grid;gap:calc(var(--s)*6)}
html.m .mc-logo{display:block;width:calc(var(--s)*44);height:auto}
html.m .mc-metrics{display:grid;gap:calc(var(--s)*4.4);padding-left:calc(var(--s)*8);border-left:calc(var(--s)*.3) solid rgba(143,187,224,.3)}
html.m .mc-metrics > div{display:grid;gap:calc(var(--s)*.6)}
html.m .mc-metrics b{font:900 calc(var(--s)*6.4)/1 var(--display);color:#fff;white-space:nowrap}
html.m .mc-metrics span{font:500 calc(var(--s)*3.2)/1.3 var(--body);color:var(--blue-lighter)}
html.m .mc-tl{list-style:none;margin:0;padding:0;display:grid;gap:calc(var(--s)*3.4);position:relative}
html.m .mc-tl::before{content:"";position:absolute;left:calc(var(--s)*1.55);top:calc(var(--s)*2);bottom:calc(var(--s)*4);width:calc(var(--s)*.3);background:rgba(143,187,224,.4)}
html.m .mc-tl li{display:grid;grid-template-columns:calc(var(--s)*3.4) 1fr;gap:calc(var(--s)*2.6);align-items:start;position:relative}
html.m .mc-tl i{width:calc(var(--s)*3.4);height:calc(var(--s)*3.4);border-radius:50%;border:calc(var(--s)*.6) solid var(--blue-light);margin-top:calc(var(--s)*.3);background:var(--navy);position:relative;z-index:1}
html.m .mc-tl li.done i{background:var(--blue-light)}
html.m .mc-tl small{display:block;font:700 calc(var(--s)*2.3)/1.2 var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--blue-light)}
html.m .mc-tl b{display:block;margin-top:calc(var(--s)*.6);font:700 calc(var(--s)*3.3)/1.25 var(--display);color:#fff}
/* other clients: +15 and the logos */
html.m .mc-trust{width:min(100%,calc(var(--s)*160));display:grid;gap:calc(var(--s)*7)}
html.m .mc-trust p{margin:0;font:600 calc(var(--s)*3.6)/1.2 var(--body);color:var(--blue-lighter)}
html.m .mc-trust p b{font:900 calc(var(--s)*8)/1 var(--display);color:var(--cream);margin-right:calc(var(--s)*2.4);vertical-align:middle}
html.m .mc-logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(var(--s)*6) calc(var(--s)*8)}
html.m .mc-logos span{position:relative;aspect-ratio:2.6/1}
html.m .mc-logos img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:grayscale(1) brightness(0) invert(1);opacity:.85}