:root{
  --orange:#FF6B1A;
  --turq:#14C8C0;
  --teal:#0A7A75;
  --pink:#FF5FA2;
  --bord:#6A0F2A;
  --ink:#111;
  --grey:#6B6B6B;
  --hair:#E4E4E4;
  --paper:#FFFFFF;
  --font:"Heebo", system-ui, sans-serif;
  --wrap:1280px;
  --gut:clamp(16px,4vw,48px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 18px/1.6 var(--font);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:700}
p{margin:0}
:focus-visible{outline:2px solid var(--turq);outline-offset:3px}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}

.skip{position:absolute;inset-inline-start:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 14px;z-index:20}
.skip:focus{inset-inline-start:8px}

/* header */
.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:32px;padding:18px var(--gut);
  background:rgba(255,255,255,.92);backdrop-filter:blur(8px)}
.logo{display:flex;align-items:center;gap:10px;font:800 28px/1 var(--font);text-decoration:none;letter-spacing:-.02em}
.eq{display:flex;align-items:flex-end;gap:3px;height:22px}
.eq i{width:4px;border-radius:2px;background:var(--orange)}
.eq i:nth-child(1){height:40%}.eq i:nth-child(2){height:100%;background:var(--turq)}
.eq i:nth-child(3){height:65%}.eq i:nth-child(4){height:85%;background:var(--turq)}
@media (prefers-reduced-motion:no-preference){
  .eq i{animation:eq 1.1s ease-in-out infinite alternate}
  .eq i:nth-child(2){animation-delay:-.4s}.eq i:nth-child(3){animation-delay:-.7s}.eq i:nth-child(4){animation-delay:-.2s}
  @keyframes eq{0%{transform:scaleY(.35)}100%{transform:scaleY(1)}}
  .eq i{transform-origin:bottom}
}
.nav{display:flex;gap:28px;margin-inline-start:auto}
.nav a{text-decoration:none;font-size:16px;font-weight:500;position:relative}
.nav a::after{content:"";position:absolute;inset-inline:0;bottom:-4px;height:2px;background:var(--orange);transform:scaleX(0);transition:transform .25s;transform-origin:right}
.nav a:hover::after{transform:scaleX(1)}
.top-actions{display:flex;gap:10px;align-items:center}
.lang{font:500 14px var(--font);background:none;color:var(--ink);border:1px solid var(--hair);border-radius:999px;padding:7px 12px;cursor:pointer}
.lang:hover{border-color:var(--ink)}

/* pills */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;cursor:pointer;
  font:500 15px/1 var(--font);padding:11px 18px;border-radius:999px;border:1px solid transparent;transition:background .2s,color .2s,border-color .2s}
.pill-lg{font-size:18px;padding:18px 30px}
.pill-turq{background:var(--turq);color:var(--ink)}
.pill-turq:hover{background:var(--ink);color:#fff}
.pill-line{border-color:var(--ink);color:var(--ink);background:none}
.pill-line:hover{background:var(--orange);border-color:var(--orange)}

/* hero: video full width, headline over it */
.hero{position:relative;margin-inline:auto;max-width:1600px;padding-inline:clamp(0px,1.5vw,24px)}
.hero-media{position:relative;aspect-ratio:16/9;max-height:860px;width:100%;max-width:100%;overflow:hidden;background:#1A1C1D;border-radius:clamp(0px,1.4vw,22px)}
.hero-media video,.hero-media img{width:100%;height:100%;object-fit:cover;display:block}
/* white wash from the text side (left in RTL), video stays clear on the right */
/* dark wash on the text side so white type reads over live footage */
.hero-media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to right,rgba(12,14,15,.78) 0%,rgba(12,14,15,.62) 32%,rgba(12,14,15,.25) 52%,rgba(12,14,15,0) 68%)}
.hero-over{position:absolute;inset-block:0;left:clamp(16px,4vw,72px);width:min(40%,600px);display:flex;flex-direction:column;justify-content:center;gap:clamp(16px,2vw,28px);text-align:start;padding-block:24px}
.hero-over{color:#fff}
.tagline{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font:500 clamp(15px,1.25vw,18px)/1.3 var(--font);letter-spacing:.01em;margin-bottom:-4px}
.tagline i{font-style:normal;color:var(--turq);font-weight:700}
.hero h1{font:800 clamp(36px,4.1vw,78px)/1 var(--font);letter-spacing:-.035em;text-wrap:balance}
.hero h1 .soft{color:var(--orange);display:block}
.lead{font-size:clamp(17px,1.4vw,20px);font-weight:400;max-width:40ch;color:inherit}
.hero .lead{color:rgba(255,255,255,.9)}
.hero .pill-line{border-color:#fff;color:#fff}
.hero .pill-line:hover{background:#fff;color:var(--ink);border-color:#fff}
.hero .pill-turq:hover{background:#fff;color:var(--ink)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px}

@media (max-width:900px){
  .hero{padding-inline:0}
  .hero-media{aspect-ratio:9/16;max-height:none;border-radius:0}
  .hero-media video,.hero-media img{object-position:62% 50%}
  .hero-media::after{background:linear-gradient(to top,rgba(12,14,15,.92) 0%,rgba(12,14,15,.8) 40%,rgba(12,14,15,.35) 58%,rgba(12,14,15,0) 72%)}
  .hero-over{inset:auto 0 0 0;left:0;width:auto;padding:0 max(16px,env(safe-area-inset-left,0px)) 28px max(16px,env(safe-area-inset-right,0px));justify-content:flex-end}
  .hero h1{font-size:clamp(34px,9.4vw,52px)}
}

/* process animation */
.process-media{margin:28px 0 8px;border-radius:18px;overflow:hidden;aspect-ratio:16/9;max-width:100%;background:#FBFAF7}
.process-media.story{background:#fff;border:1px solid var(--hair)}
.process-media video,.process-media img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:700px){.process-media{aspect-ratio:4/3;border-radius:14px}.process-media.story{aspect-ratio:16/9}}

/* work */
.row-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap;
  border-top:1px solid var(--ink);padding-top:18px;margin-bottom:28px}
.row-head h2,.section>h2{font:700 clamp(28px,3vw,40px)/1.1 var(--font);letter-spacing:-.02em}
.row-head p{color:var(--grey)}
.reels{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-inline:var(--gut);padding-bottom:12px;scrollbar-width:none}
.reels::-webkit-scrollbar{display:none}
.reel{flex:0 0 clamp(220px,24vw,300px);aspect-ratio:9/16;margin:0;scroll-snap-align:start;position:relative;border-radius:14px;overflow:hidden;background:var(--orange)}
.reel:nth-child(even){background:var(--turq)}
.reel:nth-child(3n){background:#F2F2F2}
.reel video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.reel:hover video{transform:scale(1.03)}
.reel figcaption{position:absolute;inset-inline-start:16px;bottom:14px;font:500 15px var(--font);color:var(--ink)}
.reel .ph{position:absolute;inset:0;display:grid;place-items:center;font:300 15px var(--font);color:var(--ink)}
.reel .ph b{display:block;text-align:center;font-size:40px;font-weight:300;line-height:1}

/* manifesto */
.manifesto{padding-block:clamp(90px,13vw,190px)}
.work{margin-top:clamp(64px,8vw,120px)}
.manifesto{padding-block:clamp(56px,8vw,120px)}
.mf{display:flex;align-items:center;gap:clamp(20px,3vw,44px);padding:clamp(22px,3vw,40px) clamp(22px,3.4vw,48px);border:2px solid var(--ink);border-radius:28px;max-width:980px;margin-inline:auto}
.mf-timer{position:relative;flex:none;width:clamp(84px,10vw,132px);aspect-ratio:1;display:grid;place-items:center;align-content:center;background:var(--orange);color:#fff;border-radius:50%}
.mf-timer svg{position:absolute;inset:-8px;width:calc(100% + 16px);height:calc(100% + 16px);transform:rotate(-90deg)}
.mf-timer circle{fill:none;stroke-width:5}
.mf-track{stroke:var(--hair)}
.mf-ring{stroke:var(--turq);stroke-linecap:round;stroke-dasharray:327;stroke-dashoffset:327;animation:mfTick 3s linear infinite}
@keyframes mfTick{to{stroke-dashoffset:0}}
.mf-timer b{font:800 clamp(40px,5vw,64px)/.9 var(--font)}
.mf-timer small{font-size:clamp(12px,1.1vw,15px);font-weight:500;margin-top:2px}
.mf-text{margin:0;min-width:0;font:800 clamp(28px,3.6vw,54px)/1.08 var(--font);letter-spacing:-.03em;text-wrap:balance}
.mf-text em{font-style:normal;color:var(--orange);display:block}
@media (max-width:560px){.mf{flex-direction:column;text-align:center}}
@media (prefers-reduced-motion:reduce){.mf-ring{animation:none;stroke-dashoffset:0}}
html.a11y-calm .mf-ring{stroke-dashoffset:0}

/* sections */
.section{padding-bottom:clamp(80px,10vw,140px)}
.section>h2{border-top:1px solid var(--ink);padding-top:18px;margin-bottom:12px}

/* services: words fill with colour as you scroll, the stage changes colour with them */
.svc-grid{margin-top:28px;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px,5vw,72px);align-items:start}
.svc-list{list-style:none;margin:0;padding:0 0 12vh}
.svc-row{--fill:0;--col:var(--orange);padding-block:clamp(28px,5vh,52px);border-bottom:1px solid var(--hair);display:grid;gap:12px}
.svc-row[data-c="q"]{--col:var(--turq)}
.svc-row h3{font:800 clamp(52px,7.6vw,118px)/.95 var(--font);letter-spacing:-.045em;width:max-content;max-width:100%;
  background:linear-gradient(to left,var(--col) calc(var(--fill)*100%),#D9D9D9 calc(var(--fill)*100%));-webkit-background-clip:text;background-clip:text;color:transparent}
html[dir="ltr"] .svc-row h3{background:linear-gradient(to right,var(--col) calc(var(--fill)*100%),#D9D9D9 calc(var(--fill)*100%));-webkit-background-clip:text;background-clip:text}
.svc-row p{font-size:clamp(17px,1.4vw,20px);font-weight:300;max-width:34ch;opacity:.35;transform:translateY(8px);transition:opacity .4s,transform .4s}
.svc-row.on p{opacity:1;transform:none}
.svc-stage{position:sticky;top:96px;border-radius:24px;padding:clamp(14px,1.6vw,22px);background:#FFE9DC;transition:background .5s}
.svc-stage[data-c="q"]{background:#D9F5F3}
.svc-frame{border-radius:16px;overflow:hidden;aspect-ratio:16/10;max-width:100%;background:#FBFAF7}
.svc-frame video,.svc-frame img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.svc-badge{display:inline-flex;align-items:center;gap:10px;margin-top:14px;padding:10px 18px;border-radius:999px;background:var(--paper);font:800 clamp(18px,1.6vw,22px)/1 var(--font)}
.svc-dot{width:12px;height:12px;border-radius:50%;background:var(--orange);transition:background .5s}
.svc-stage[data-c="q"] .svc-dot{background:var(--turq)}
#svc-now{display:inline-block;transition:opacity .2s,transform .2s}
#svc-now.swap{opacity:0;transform:translateY(6px)}
@media (max-width:980px){
  .svc-grid{grid-template-columns:1fr;gap:8px}
  .svc-stage{top:72px;z-index:2;padding:10px;border-radius:18px}
  .svc-frame{aspect-ratio:16/8}
  .svc-badge{margin-top:10px;padding:8px 14px}
  .svc-list{padding-bottom:6vh}
}
@media (prefers-reduced-motion:reduce){.svc-row{--fill:1!important}.svc-row p{opacity:1;transform:none}}

.steps{list-style:none;margin:28px 0 0;padding:0;counter-reset:s;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px}
.steps li{counter-increment:s;border-top:1px solid var(--hair);padding-top:18px}
.steps li::before{content:counter(s, decimal-leading-zero);display:block;font:300 15px var(--font);color:var(--orange);margin-bottom:28px}
.steps li:nth-child(even)::before{color:var(--teal)}
.steps h3{font:700 22px/1.2 var(--font);margin-bottom:8px}
.steps p{font-size:16px;font-weight:300;color:#333}

.terms-h s{text-decoration-color:var(--pink);text-decoration-thickness:.12em;color:#9A9A9A}
.terms-cards{list-style:none;margin:32px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.tc{border-radius:24px;padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;gap:10px;min-height:340px}
.tc-o{background:#FFE9DC}
.tc-q{background:#D9F5F3}
.tc-w{background:var(--paper);border:1.5px solid var(--ink)}
.tc-glyph{height:clamp(120px,12vw,160px);display:flex;align-items:flex-end;gap:10px;margin-bottom:auto;padding-bottom:18px}
.tc-big{font:800 clamp(120px,13vw,190px)/.78 var(--font);letter-spacing:-.06em}
.tc-o .tc-big{color:var(--orange)}
.tc-q .tc-big{color:var(--teal)}
.tc-unit{font:800 clamp(22px,2vw,28px)/1 var(--font);color:var(--orange);padding-bottom:6px}
.tc-glyph svg{width:clamp(100px,10vw,130px);height:auto;color:var(--orange)}
.tc h3{font:800 clamp(24px,2.2vw,30px)/1.1 var(--font);letter-spacing:-.02em}
.tc-o h3{color:var(--bord)}
.tc p{font-size:17px;font-weight:300;color:#333;max-width:32ch}
@media (max-width:900px){.terms-cards{grid-template-columns:1fr}.tc{min-height:0}}

/* packages */
.pkgs{margin-top:28px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;align-items:stretch}
.pkg{display:flex;flex-direction:column;gap:14px;padding:28px 26px 30px;border:1px solid var(--hair);border-radius:18px;background:var(--paper)}
.pkg-main{border:2px solid var(--orange)}
.pkg-tag{font-size:14px;font-weight:500;color:var(--teal)}
.pkg-main .pkg-tag{color:var(--orange)}
.pkg h3{font:800 clamp(28px,2.6vw,38px)/1.05 var(--font);letter-spacing:-.02em}
.pkg-for{color:#444;font-weight:300}
.price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding-block:14px;border-block:1px solid var(--hair)}
.price .num{font:800 clamp(40px,4vw,56px)/1 var(--font);letter-spacing:-.03em}
.price .num-text{font-size:clamp(30px,2.8vw,40px)}
.pkg-main .price .num{color:var(--orange)}
.price .per{font-size:15px;color:var(--grey)}
.price .from{font-size:18px;font-weight:500;color:var(--orange);align-self:center}
.pkg ul{list-style:none;margin:0;padding:0;display:grid;gap:12px;flex:1;align-content:start}
.pkg li{position:relative;padding-inline-start:22px;font-size:16px;font-weight:300;line-height:1.5}
.pkg li::before{content:"";position:absolute;inset-inline-start:0;top:.55em;width:9px;height:9px;border-radius:50%;background:var(--turq)}
.pkg-main li::before{background:var(--orange)}
.pkg .pill{align-self:stretch;margin-top:8px}
@media (max-width:1200px){.pkgs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.pkgs{grid-template-columns:1fr}}
.pkg-tag{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.soon{display:inline-block;padding:3px 10px;border-radius:999px;background:var(--pink);color:#fff;font-size:13px;font-weight:700;letter-spacing:.02em}
.pkg-soon{border-style:dashed}

/* contact */
.contact{padding-bottom:clamp(80px,10vw,140px)}
.ct-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);border:1px solid var(--hair);border-radius:24px;overflow:hidden}
.ct-side{padding:clamp(28px,4vw,56px);display:flex;flex-direction:column;gap:22px;position:relative}
.ct-side::after{content:"";position:absolute;inset-inline-start:clamp(28px,4vw,56px);top:0;width:72px;height:6px;border-radius:0 0 6px 6px;background:linear-gradient(90deg,var(--orange) 50%,var(--turq) 50%)}
.ct-side h2{font:800 clamp(44px,5.4vw,80px)/.95 var(--font);letter-spacing:-.04em;text-wrap:balance;border:0;padding:0;margin:0}
.ct-lead{font-size:clamp(17px,1.4vw,20px);font-weight:300;max-width:34ch;color:#333}
.ct-actions{display:grid;gap:12px;margin-top:6px}
.ct-tile{display:flex;align-items:center;gap:16px;padding:16px 18px;border-radius:16px;text-decoration:none;color:var(--ink);border:1px solid var(--hair);transition:transform .2s,border-color .2s,background .2s}
.ct-tile:hover{transform:translateY(-2px);border-color:var(--ink)}
.ct-wa{background:var(--turq);border-color:var(--turq)}
.ct-wa:hover{background:#10b8b0;border-color:#10b8b0}
.ct-ico{flex:0 0 auto;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--paper)}
.ct-tel{background:var(--orange);border-color:var(--orange)}
.ct-tel:hover{background:#F25E0E;border-color:#F25E0E}
.ct-tel .ct-ico{background:var(--paper)}
.ct-ico svg{width:24px;height:24px;fill:var(--ink)}
.ct-tel .ct-ico svg{fill:var(--orange)}
.ct-txt{display:grid;gap:2px;min-width:0}
.ct-txt strong{font:800 clamp(19px,1.7vw,24px)/1.15 var(--font);letter-spacing:-.01em}
.ct-txt small{font-size:14px;color:#2F4F4D}
.ct-tel .ct-txt small{color:#4A2410}
.ct-more{list-style:none;margin:0;padding:0;display:flex;gap:18px;flex-wrap:wrap}
.ct-more a{font-weight:500;text-decoration:none;border-bottom:1.5px solid var(--orange)}
.ct-more li[hidden]{display:none}
.ct-form{padding:clamp(28px,4vw,56px);background:#F7F7F5;display:flex;flex-direction:column;gap:18px}
.ct-form h3{font:800 clamp(22px,2vw,28px)/1.1 var(--font);letter-spacing:-.01em}
.ct-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fld{display:grid;gap:6px;font-size:14px;font-weight:500;color:#444}
.fld input{font:400 18px var(--font);padding:14px 16px;border:1px solid #DADADA;border-radius:12px;background:var(--paper);color:var(--ink);width:100%;transition:border-color .2s,box-shadow .2s}
.fld input:hover{border-color:#BDBDBD}
.fld input:focus{outline:none;border-color:var(--turq);box-shadow:0 0 0 4px rgba(20,200,192,.18)}
.ct-submit{width:100%;gap:10px}
.ct-submit svg{width:22px;height:22px;fill:currentColor}
.ct-note{font-size:14px;color:var(--grey);text-align:center}
.form-error{color:var(--bord);font-weight:500;margin:0}
@media (max-width:900px){.ct-panel{grid-template-columns:1fr}.ct-fields{grid-template-columns:1fr}}

/* footer */
/* footer */
.foot{border-top:1px solid var(--ink);margin-top:20px}
.foot-top{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:32px;padding-block:44px 36px}
.foot .logo{font-size:30px}
.foot-tag{margin-top:12px;font-size:15px;color:#444}
.foot-tag i{font-style:normal;color:var(--turq);font-weight:800}
.foot-links,.foot-contact{display:grid;gap:10px;align-content:start}
.foot-links a,.foot-contact a{text-decoration:none;font-weight:500;width:max-content}
.foot-links a:hover,.foot-contact a:hover{color:var(--orange)}
.foot-contact [hidden]{display:none}
.foot-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;padding-block:20px 110px;border-top:1px solid var(--hair);font-size:14px;color:var(--grey)}
.foot-legal{display:flex;flex-wrap:wrap;gap:4px 20px}
.foot-legal button{background:none;border:0;padding:8px 0;font:inherit;color:#333;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.foot-legal button:hover{color:var(--orange)}
.ai-links{flex-basis:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 18px;padding-top:6px;font-size:12px;color:#8A8A8A}
.ai-links span{letter-spacing:2px;text-transform:uppercase;font-weight:700}
.ai-links a{color:#8A8A8A;text-decoration:none}
.ai-links a:hover{color:var(--orange)}
.to-top{margin-inline:auto;display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border:1.5px solid var(--ink);border-radius:999px;text-decoration:none;color:var(--ink);font-weight:500;font-size:15px}
.to-top svg{width:18px;height:18px}
.to-top:hover{background:var(--ink);color:#fff}
@media (max-width:800px){.foot-top{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}.foot-bottom{justify-content:center;text-align:center}}

/* accessibility menu */
.a11y-btn{position:fixed;bottom:calc(18px + env(safe-area-inset-bottom,0px));inset-inline-start:18px;z-index:40;width:56px;height:56px;box-sizing:border-box;border-radius:50%;background:#1F4E9C;color:#fff;border:2px solid #fff;box-shadow:0 8px 22px rgba(0,0,0,.25);display:grid;place-items:center;cursor:pointer;padding:0}
.a11y-btn svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.a11y-btn circle{fill:currentColor;stroke:none}
.a11y-panel{position:fixed;bottom:calc(82px + env(safe-area-inset-bottom,0px));inset-inline-start:18px;z-index:41;width:min(300px,calc(100vw - 36px));background:#fff;color:#151413;border-radius:10px;box-shadow:0 16px 40px rgba(0,0,0,.3);padding:16px;display:flex;flex-direction:column;gap:8px;font-family:Arial,sans-serif}
.a11y-panel[hidden]{display:none}
.a11y-head{display:flex;align-items:center;justify-content:space-between;font-size:18px}
.a11y-x,.doc-x{background:none;border:0;font-size:20px;cursor:pointer;width:40px;height:40px;border-radius:50%}
.a11y-x:hover,.doc-x:hover{background:#F0F0F0}
.a11y-opt{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:44px;padding:10px 12px;border-radius:6px;border:2px solid #D8D3CB;background:#fff;color:#151413;font:700 15px Arial,sans-serif;text-align:start;cursor:pointer}
.a11y-opt[aria-pressed="true"]{border-color:#1F4E9C;background:#E6EEFB}
.a11y-opt[aria-pressed="true"]::after{content:"✓";color:#1F4E9C}
.a11y-reset{min-height:44px;border-radius:6px;border:0;background:#151413;color:#fff;font:700 15px Arial,sans-serif;cursor:pointer}
.a11y-doc{background:none;border:0;padding:6px;font:14px Arial,sans-serif;text-decoration:underline;cursor:pointer;color:#1F4E9C}
html.a11y-zoom body{zoom:1.18}
html.a11y-contrast body>:not(.a11y-ui){filter:contrast(1.35) brightness(1.05)}
html.a11y-gray body>:not(.a11y-ui){filter:grayscale(1)}
html.a11y-contrast.a11y-gray body>:not(.a11y-ui){filter:grayscale(1) contrast(1.35) brightness(1.05)}
html.a11y-links a{text-decoration:underline!important;text-underline-offset:3px}
html.a11y-font *{font-family:Arial,sans-serif!important;letter-spacing:.02em}
html.a11y-calm *{transition:none!important;animation:none!important;scroll-behavior:auto!important}

/* legal documents */
.doc{width:min(720px,calc(100vw - 32px));max-height:calc(100vh - 64px);border:0;border-radius:18px;padding:clamp(24px,4vw,44px);color:var(--ink);box-shadow:0 30px 80px rgba(0,0,0,.3)}
.doc::backdrop{background:rgba(17,17,17,.55)}
.doc-x{position:sticky;top:0;float:inline-end;margin:-10px -10px 0 0}
.doc h2{font:800 clamp(30px,4vw,42px)/1.05 var(--font);letter-spacing:-.02em;margin-bottom:6px}
.doc-date{font-size:14px;color:var(--grey);margin-bottom:18px}
.doc h3{font:800 19px/1.3 var(--font);margin:22px 0 6px}
.doc p{font-size:16px;line-height:1.7;color:#333}
.doc-link{background:none;border:0;padding:0;font:inherit;color:var(--teal);text-decoration:underline;cursor:pointer}

.wa-float{position:fixed;inset-inline-end:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));width:56px;height:56px;box-sizing:border-box;border-radius:50%;background:var(--ink);
  display:grid;place-items:center;z-index:15;transition:transform .2s}
.wa-float:hover{transform:scale(1.08)}
.wa-float svg{width:28px;height:28px;fill:var(--turq)}

@media (max-width:980px){
  .nav{display:none}
  .top-actions{margin-inline-start:auto}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  body{font-size:17px}
  .rows li,.not{grid-template-columns:1fr;gap:10px}
  .not p{grid-column:1}
  .terms,.contact-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .cta-row{width:100%}
  .cta-row .pill{flex:1 1 100%}
  .top{gap:12px}
}

/* reels with own video */
.reel{background:#EEE}
.reel video,.reel img.loop{width:100%;height:100%;object-fit:cover;display:block}
.reel-open{position:absolute;inset:0;border:0;background:none;cursor:pointer;display:block}
.play{position:absolute;top:12px;inset-inline-end:12px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;transition:transform .2s,background .2s}
.play::before{content:"";width:20px;height:20px;background:var(--ink);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 9v6h4l5 5V4L7 9H3zm13.5 3A4.5 4.5 0 0 0 14 8v8a4.5 4.5 0 0 0 2.5-4zM14 3.2v2.1a7 7 0 0 1 0 13.4v2.1a9 9 0 0 0 0-17.6z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 9v6h4l5 5V4L7 9H3zm13.5 3A4.5 4.5 0 0 0 14 8v8a4.5 4.5 0 0 0 2.5-4zM14 3.2v2.1a7 7 0 0 1 0 13.4v2.1a9 9 0 0 0 0-17.6z'/%3E%3C/svg%3E") center/contain no-repeat}
.reel-open:hover .play{transform:scale(1.1);background:var(--turq)}
.reel figcaption{position:absolute;inset-inline:0;bottom:0;padding:40px 16px 14px;background:linear-gradient(transparent,rgba(0,0,0,.55));color:#fff;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;pointer-events:none}
.views{font:800 clamp(30px,3vw,40px)/1 var(--font);letter-spacing:-.03em}
.views-label{font-size:15px}
.client{flex-basis:100%;font-size:14px;font-weight:500}

.player{border:0;padding:0;background:none;max-width:none;max-height:none;overflow:visible}
.player::backdrop{background:rgba(0,0,0,.85)}
.player video{display:block;height:min(88vh,860px);aspect-ratio:9/16;max-width:94vw;border-radius:14px;background:#000}
.player-close{position:absolute;top:-48px;inset-inline-end:0;width:40px;height:40px;border-radius:50%;border:0;background:#fff;color:var(--ink);font-size:18px;cursor:pointer}

/* background videos: never show the native play button */
video::-webkit-media-controls,video::-webkit-media-controls-start-playback-button,video::-webkit-media-controls-overlay-play-button{display:none!important;-webkit-appearance:none;opacity:0}
.hero-media video,.process-media video,.reel video,.svc-frame video{pointer-events:none}

/* process timeline: fills as you scroll */
.how-grid{margin-top:32px;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,5vw,72px);align-items:start}
.how-grid .process-media{position:sticky;top:110px;margin:0}
.timeline{list-style:none;margin:0;padding:0;position:relative;display:grid;gap:clamp(36px,6vh,64px);padding-block:8px 24px}
.tl-track{position:absolute;inset-block:36px 30px;inset-inline-start:27px;width:4px;border-radius:2px;background:var(--hair)}
.tl-fill{position:absolute;top:0;inset-inline:0;height:calc(var(--p,0)*100%);border-radius:2px;background:var(--orange);transition:height .15s linear}
.tl-head{position:absolute;bottom:-14px;inset-inline-start:-10px;width:24px;height:24px;color:var(--orange);opacity:calc(var(--p,0)*20)}
.tl-step{position:relative;display:grid;grid-template-columns:58px minmax(0,1fr);gap:20px;align-items:start}
.tl-body{opacity:.42;transition:opacity .35s}
.tl-step.on .tl-body{opacity:1}
.tl-step:not(.on) .tl-dot{border-color:#C9C9C9;color:#9A9A9A}
.tl-dot{position:relative;z-index:1;width:58px;height:58px;border-radius:50%;border:2px solid var(--ink);background:var(--paper);color:var(--ink);
  font:800 24px/1 var(--font);cursor:pointer;display:grid;place-items:center;transition:background .3s,color .3s,border-color .3s,transform .3s}
.tl-step.on .tl-dot{background:var(--orange);border-color:var(--orange);color:#fff}
.tl-step.now .tl-dot{transform:scale(1.14);box-shadow:0 0 0 8px rgba(255,107,26,.16)}
.tl-step:nth-child(odd).on .tl-dot{background:var(--turq);border-color:var(--turq);color:var(--ink)}
.tl-step:nth-child(odd).now .tl-dot{box-shadow:0 0 0 8px rgba(20,200,192,.18)}
.tl-body h3{font:800 clamp(26px,2.6vw,36px)/1.1 var(--font);letter-spacing:-.02em;margin:8px 0 8px}
.tl-body p{font-size:18px;font-weight:300;max-width:38ch}
@media (max-width:980px){.how-grid{grid-template-columns:1fr}.how-grid .process-media{position:relative;top:auto;order:-1}}
@media (prefers-reduced-motion:reduce){.tl-body{opacity:1}.tl-fill{transition:none}}

/* hamburger + full-screen menu */
.burger{width:44px;height:44px;border-radius:50%;border:1px solid var(--hair);background:var(--paper);display:grid;place-content:center;gap:5px;cursor:pointer;padding:0}
.burger span{display:block;width:20px;height:2px;border-radius:2px;background:var(--ink);transition:transform .3s,opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:9;background:var(--paper);padding:110px max(24px,env(safe-area-inset-right,0px)) 40px max(24px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;justify-content:space-between;overflow-y:auto}
.menu[hidden]{display:none}
.menu-links{display:grid;gap:4px}
.menu-links a{font:800 clamp(38px,8vw,72px)/1.15 var(--font);letter-spacing:-.03em;text-decoration:none;width:max-content;max-width:100%;opacity:0;transform:translateY(14px);animation:menuIn .45s cubic-bezier(.2,.7,.2,1) forwards}
.menu-links a:nth-child(odd):hover{color:var(--orange)}
.menu-links a:nth-child(even):hover{color:var(--teal)}
.menu-links a:nth-child(2){animation-delay:.04s}.menu-links a:nth-child(3){animation-delay:.08s}.menu-links a:nth-child(4){animation-delay:.12s}.menu-links a:nth-child(5){animation-delay:.16s}.menu-links a:nth-child(6){animation-delay:.2s}
@keyframes menuIn{to{opacity:1;transform:none}}
.menu-foot{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px}
body.menu-open{overflow:hidden}
@media (prefers-reduced-motion:reduce){.menu-links a{animation:none;opacity:1;transform:none}}

/* floating back-to-top, between WhatsApp and accessibility */
.top-float{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:40;width:56px;height:56px;box-sizing:border-box;border-radius:50%;
  background:var(--paper);border:1.5px solid var(--ink);display:grid;place-items:center;color:var(--ink);box-shadow:0 8px 22px rgba(0,0,0,.12);
  transform:translate(-50%,24px);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}
.top-float.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.top-float svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.top-float:hover{background:var(--ink);color:#fff}

/* blog */
.blog-all{font-weight:500;text-decoration:none;border-bottom:1.5px solid var(--orange)}
.post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.post-card{border:1px solid var(--hair);border-radius:20px;transition:border-color .2s,transform .2s}
.post-card:hover{border-color:var(--ink);transform:translateY(-3px)}
.post-card a{display:flex;flex-direction:column;gap:12px;height:100%;padding:26px;text-decoration:none;color:var(--ink)}
.post-card h3{font:800 clamp(22px,2vw,27px)/1.15 var(--font);letter-spacing:-.02em}
.post-excerpt{font-size:16px;font-weight:300;color:#444;flex:1}
.post-more{font-weight:500;color:var(--orange)}
.post-meta{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-size:14px;color:var(--grey)}
.post-tag{padding:4px 10px;border-radius:999px;background:#D9F5F3;color:#06504D;font-weight:500}
.post-card:nth-child(even) .post-tag{background:#FFE9DC;color:#8A3A08}
@media (max-width:900px){.post-grid{grid-template-columns:1fr}}
.blog-index h1,.post h1{font:800 clamp(40px,6vw,76px)/1 var(--font);letter-spacing:-.04em;text-wrap:balance;margin:14px 0 16px}
.blog-index{padding-top:48px}
.post{max-width:780px;padding-block:40px 90px}
.post-back a{font-size:15px;text-decoration:none;color:var(--grey)}
.post-back a::before{content:"→ "}
.post-lead{font-size:clamp(19px,1.8vw,22px);font-weight:300;color:#333;max-width:46ch;margin-bottom:30px}
.post-body h2{font:800 clamp(24px,2.4vw,30px)/1.2 var(--font);margin:34px 0 10px}
.post-body p{font-size:18px;line-height:1.8;color:#222;margin-bottom:14px;max-width:62ch}
.post-cta{margin-top:48px;padding:clamp(24px,4vw,40px);border-radius:22px;background:#D9F5F3;display:grid;gap:12px;justify-items:start}
.post-cta h2{font:800 clamp(24px,2.6vw,32px)/1.15 var(--font)}
.foot-legal a{padding:8px 0;color:#333}
body.menu-open .wa-float,body.menu-open .a11y-btn,body.menu-open .top-float{display:none}
.pkg .pill-lg{font-size:16px;padding:16px 14px;white-space:nowrap}
@media (min-width:1201px){.pkg{padding:26px 22px 28px}.pkg h3{font-size:clamp(26px,2.2vw,34px)}.price .num{font-size:clamp(38px,3.4vw,52px)}}

/* founder */
.fd-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,88px);align-items:center;border-top:1px solid var(--ink);padding-top:clamp(36px,5vw,64px)}
.fd-photo{position:relative;margin:0;max-width:460px;width:100%;justify-self:center}
.fd-photo::before{content:"";position:absolute;inset:22px -22px -22px 22px;border-radius:26px;background:var(--orange)}
.fd-photo::after{content:"";position:absolute;width:74px;height:74px;border-radius:50%;background:var(--turq);top:-26px;left:-26px}
.fd-photo img{position:relative;z-index:1;display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:26px;max-width:100%}
.fd-text{display:grid;gap:14px}
.fd-text h2{font:800 clamp(40px,5vw,64px)/1 var(--font);letter-spacing:-.04em}
.fd-name{font-size:17px;font-weight:500;color:var(--teal)}
.fd-big{font:800 clamp(24px,2.6vw,34px)/1.2 var(--font);letter-spacing:-.02em;max-width:24ch;margin-block:6px}
.fd-text>p:not(.fd-name):not(.fd-big){font-size:18px;font-weight:300;line-height:1.7;max-width:56ch;color:#333}
.fd-facts{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.fd-facts li{display:grid;gap:6px;padding:16px 18px;border-radius:16px;background:#F7F7F5}
.fd-facts li:nth-child(1),.fd-facts li:nth-child(4){background:#FFE9DC}
.fd-facts li:nth-child(2),.fd-facts li:nth-child(3){background:#D9F5F3}
.fd-facts strong{font:800 22px/1 var(--font)}
.fd-facts span{font-size:15px;line-height:1.5;color:#333}
@media (max-width:900px){.fd-grid{grid-template-columns:1fr}.fd-photo{max-width:300px;width:calc(100% - 44px);margin-inline:22px auto;margin-top:26px}.fd-photo::after{width:56px;height:56px;top:-18px;left:-18px}.fd-facts{grid-template-columns:1fr}}

/* results / case studies: horizontal carousel, screenshot with metrics on top */
.cs-track{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(280px,30vw,380px);gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;
  padding:6px 2px 18px;scrollbar-width:none;overscroll-behavior-x:contain}
.cs-track::-webkit-scrollbar{display:none}
.cs-slide{scroll-snap-align:start;position:relative;border-radius:24px;overflow:hidden;background:#0F0F0F;aspect-ratio:9/16;max-width:100%}
.cs-shot{margin:0;position:absolute;inset:0}
.cs-shot img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.cs-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.15) 0%,rgba(0,0,0,0) 30%);pointer-events:none}
.cs-panel{position:absolute;inset-inline:10px;bottom:10px;z-index:1;background:rgba(255,255,255,.96);backdrop-filter:blur(6px);border-radius:16px;padding:12px 14px 10px;display:grid;gap:6px;box-shadow:0 12px 30px rgba(0,0,0,.25);border-top:5px solid var(--orange)}
.cs-slide[data-c="q"] .cs-panel{border-top-color:var(--turq)}
.cs-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.cs-head h3{font:800 18px/1.1 var(--font);letter-spacing:-.01em;white-space:nowrap;flex:0 0 auto}
.cs-tag{font-size:12px;color:var(--grey);text-align:end;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.cs-x{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.cs-xn{font:800 clamp(36px,3.4vw,46px)/.9 var(--font);letter-spacing:-.05em;color:var(--orange)}
.cs-slide[data-c="q"] .cs-xn{color:var(--teal)}
.cs-x span:last-child{font-weight:500;font-size:15px}
.cs-rows{display:grid;border-top:1px solid var(--hair)}
.cs-cols,.cs-row{display:grid;grid-template-columns:minmax(0,1fr) 5.5ch 16px 7ch;align-items:baseline;gap:8px;padding-block:5px;border-bottom:1px solid var(--hair)}
.cs-cols{font-size:11px;color:var(--grey);padding-block:3px}
.cs-cols span:nth-child(2),.cs-cols span:nth-child(4){text-align:center}
.cs-lab{font-size:13px;color:#444;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cs-before{font-size:15px;color:#999;text-decoration:line-through;text-decoration-color:var(--pink);text-align:center;font-variant-numeric:tabular-nums}
.cs-arrow{color:var(--grey);text-align:center;font-size:13px}
.cs-after{font:800 17px/1 var(--font);text-align:center;font-variant-numeric:tabular-nums}
.cs-note{font-size:12px;font-weight:500;color:var(--teal)}
.cs-nav{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:8px}
.cs-btn{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--ink);background:var(--paper);display:grid;place-items:center;cursor:pointer}
.cs-btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.cs-btn:hover{background:var(--ink);color:#fff}
html[dir="ltr"] .cs-btn svg{transform:scaleX(-1)}
.cs-dots{display:flex;gap:8px}
.cs-dots span{width:8px;height:8px;border-radius:999px;background:#D0D0D0;transition:width .3s,background .3s}
.cs-dots span.on{width:26px;background:var(--orange)}
@media (max-width:700px){.cs-track{grid-auto-columns:82%}}
html[dir="ltr"] .cs-arrow{transform:scaleX(-1)}

.cs-panel>*{min-width:0}
.cs-panel{grid-template-columns:minmax(0,1fr)}

@media (max-width:700px){.cs-cols,.cs-row{grid-template-columns:minmax(0,1fr) 5ch 12px 6.5ch;gap:6px}.cs-lab{font-size:12px;white-space:normal;line-height:1.2}.cs-before{font-size:13px}.cs-after{font-size:16px}}

/* hero poster as background so the first paint is instant on every screen size */
.hero-media{background:#1A1C1D url(videos/hero.webp) center/cover no-repeat}
@media (max-width:900px){.hero-media{background-image:url(videos/hero-m.webp)}}
.lazy-vid{background:#F2F2F2}
/* desktop: align rows (tag/title/text/price/list/cta) across the 4 package cards */
@media (min-width:1201px){
  .pkgs{grid-template-rows:repeat(6,auto);row-gap:0}
  .pkg{display:grid;grid-row:span 6;grid-template-rows:subgrid;grid-template-columns:minmax(0,1fr);row-gap:14px}
  .pkg>*{min-width:0}
  .pkg .price{display:grid;grid-template-rows:22px auto auto;justify-items:start;row-gap:6px;align-content:start}
  .price .from{grid-row:1;font-size:16px;align-self:end;white-space:nowrap}
  .price .num{grid-row:2}
  .price .per{grid-row:3}
  .pkg .pill{align-self:end}
}
