/* TiiX CSS source: assets/site.css */
:root{--navy:#1b2b57;--deep:#101a3a;--cyan:#2fd8ec;--white:#fff;--muted:#b9c5dd;--line:rgba(192,216,255,.18);--page:1280px;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--deep);color:var(--white);font-family:Montserrat,Arial,sans-serif;font-size:16px;line-height:1.55;overflow-x:clip}button,input,select,textarea{font:inherit}a{color:inherit;text-decoration:none}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--cyan);outline-offset:5px}button{cursor:pointer}::selection{background:var(--cyan);color:var(--deep)}.skip-link{position:fixed;top:-80px;left:15px;background:var(--cyan);color:var(--deep);z-index:100;padding:10px 20px}.skip-link:focus{top:10px}
.site-header{position:fixed;inset:0 0 auto;z-index:30;background:linear-gradient(180deg,rgba(16,26,58,.94),rgba(16,26,58,.8),transparent);backdrop-filter:blur(12px)}.header-inner{max-width:1440px;margin:auto;height:94px;padding:0 64px;display:flex;align-items:center;gap:24px}.brand{display:block;line-height:0;flex-shrink:0}.brand img{width:182px;height:40px;object-fit:contain}.main-nav{margin-left:auto;display:flex;gap:25px;font-size:13px;font-weight:500}.main-nav a{padding:13px 0;color:#d9e1f1;transition:color .2s}.main-nav a:hover{color:var(--cyan)}.header-tools{display:flex;gap:15px;align-items:center}.lang-switch{white-space:nowrap;font-size:12px;color:var(--muted)}.lang-switch a{padding:10px 3px}.lang-switch a[aria-current=page]{color:#fff;font-weight:800}.motion-control{border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--muted);border-radius:50%;width:38px;height:38px;display:grid;place-items:center}.motion-control::before{content:'Ⅱ';font-weight:800}.motion-control[aria-pressed=true]::before{content:'▷'}.menu-toggle{display:none;border:1px solid var(--line);background:transparent;color:#fff;width:40px;height:40px;border-radius:50%;padding:0;font-size:22px}
main,.site-footer{position:relative;z-index:2}.section{min-height:850px;position:relative;padding:125px max(5vw,24px) 100px;scroll-margin-top:15px}.section-inner{max-width:var(--page);margin:auto}.eyebrow{font-size:11px;letter-spacing:.16em;font-weight:700;text-transform:uppercase;color:var(--cyan);margin:0 0 26px;display:flex;align-items:center;gap:12px}.eyebrow::before{content:'';width:22px;height:1px;background:var(--cyan)}h1,h2,h3,p{margin-top:0}h1,h2{font-weight:800;line-height:1.04;letter-spacing:-.055em}h2{font-size:clamp(45px,6vw,82px);margin-bottom:28px}.section-intro{font-size:20px;font-weight:400;max-width:630px;line-height:1.6;color:#dde6f9}.text-muted{color:var(--muted)}.text-link{display:inline-flex;align-items:center;gap:10px;color:var(--cyan);font-size:14px;font-weight:600;padding:12px 0;border-bottom:1px solid rgba(47,216,236,.3)}.text-link:hover{border-color:var(--cyan)}.button{display:inline-flex;align-items:center;justify-content:center;gap:16px;padding:18px 27px;min-height:56px;border-radius:999px;background:var(--cyan);color:var(--deep);font-size:14px;font-weight:800;border:1px solid var(--cyan);box-shadow:0 8px 35px rgba(47,216,236,.13);transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-3px);box-shadow:0 15px 48px rgba(47,216,236,.2)}.button.secondary{background:transparent;color:#fff;border-color:var(--line);box-shadow:none}.dot-anchor{display:inline-block;width:.19em;height:.19em;vertical-align:baseline;margin-left:.03em;position:relative;color:var(--cyan)}.dot-anchor::after{content:'';position:absolute;width:100%;height:100%;border-radius:50%;background:var(--cyan);inset:0}body.motion-ready .dot-anchor::after{opacity:0}.section-number{position:absolute;right:6vw;bottom:65px;font-size:12px;color:var(--muted);letter-spacing:.18em;opacity:.55}
.hero{min-height:100svh;padding-top:180px;display:flex;align-items:center;padding-bottom:145px}.hero .section-inner{width:100%}.hero h1{font-size:clamp(72px,9.7vw,142px);max-width:1080px;margin:0 0 38px;position:relative;z-index:2}.gravity-title .gravity-word{display:inline-block}.hero .section-intro{font-size:clamp(18px,2.1vw,25px);max-width:690px;margin-bottom:20px}.hero-baseline{display:flex;justify-content:space-between;align-items:end;max-width:var(--page);position:absolute;inset:auto max(5vw,24px) 42px;font-size:11px;color:var(--muted);letter-spacing:.05em}.hero-baseline span:last-child{display:flex;align-items:center;gap:15px}.hero-baseline span:last-child::after{content:'↓';color:var(--cyan);font-size:22px}.hero-orbit-label{position:absolute;right:8vw;top:40%;font-size:11px;writing-mode:vertical-rl;color:var(--muted);letter-spacing:.18em;opacity:.6}
.lab-section{background:linear-gradient(135deg,rgba(27,43,87,.65),rgba(27,43,87,.05));min-height:920px}.lab-heading{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:end;margin-bottom:48px}.lab-heading .section-intro{font-size:18px;max-width:460px}.lab-status{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:8px 13px;font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-top:12px}.lab-stage-wrap{position:relative;border-radius:22px;border:1px solid var(--line);overflow:hidden;background:rgba(8,15,38,.35);box-shadow:0 30px 90px rgba(1,5,23,.22)}.mode-stage{height:315px;position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate;overflow:hidden;padding:35px}.mode-word{font-size:clamp(70px,13vw,165px);font-weight:800;line-height:1;letter-spacing:-.065em;position:relative;z-index:2;margin:0;text-align:center}.mode-word span{display:inline-block}.pixel-art{position:absolute;right:10%;top:22%;width:96px;height:96px;opacity:0}.stage-index{position:absolute;left:30px;top:24px;color:var(--muted);font-size:10px;letter-spacing:.16em;z-index:5}.stage-caption{position:absolute;bottom:23px;right:30px;font-size:11px;color:var(--muted);z-index:5}.mode-buttons{display:flex;gap:8px;flex-wrap:wrap;padding:20px 24px;background:rgba(4,10,30,.28);border-top:1px solid var(--line)}.mode-buttons button{padding:10px 15px;min-height:42px;border:1px solid var(--line);border-radius:99px;background:transparent;color:var(--muted);font-size:11px;font-weight:600}.mode-buttons button[aria-pressed=true]{background:var(--cyan);border-color:var(--cyan);color:var(--deep)}.lab-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:22px}.lab-note{font-size:11px;color:var(--muted);max-width:690px;margin:0}
.services-section{min-height:980px}.services-layout{display:grid;grid-template-columns:.95fr 1.05fr;gap:100px}.services-heading{position:sticky;top:155px;align-self:start}.services-heading h2{max-width:540px}.services-heading .section-intro{font-size:18px}.service-list{padding-top:4px;position:relative}.service-list::before{content:'';width:1px;position:absolute;left:-25px;top:12px;bottom:30px;background:linear-gradient(var(--cyan),rgba(47,216,236,.08))}.service-row{position:relative;border-bottom:1px solid var(--line);padding:0 0 24px;margin-bottom:26px}.service-row:last-child{border:0}.service-number{font-size:10px;color:var(--cyan);position:absolute;left:-57px;top:5px}.service-row h3{font-size:24px;line-height:1.3;letter-spacing:-.025em;font-weight:700;margin:0 0 8px}.service-row p{font-size:14px;color:var(--muted);margin:0;max-width:570px;line-height:1.65}.agency-note{font-size:13px;line-height:1.65;border:1px solid var(--line);padding:22px;border-radius:14px;color:var(--muted);margin-top:30px;max-width:440px}
.strategy-section{min-height:890px;background:radial-gradient(ellipse at 70% 50%,rgba(47,216,236,.055),transparent 50%)}.strategy-layout{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:80px}.strategy-heading h2{max-width:550px}.strategy-heading .section-intro{max-width:460px;font-size:18px}.strategy-steps{display:flex;gap:18px;margin-top:35px;font-size:10px;color:var(--muted);letter-spacing:.12em}.bubble-scene{height:510px;position:relative}.bubble{position:absolute;display:grid;place-items:center;aspect-ratio:1;width:138px;border-radius:50%;font-size:10px;font-weight:600;text-align:center;color:#e7faff}.bubble span{position:relative;z-index:2;max-width:100px}.bubble.b1{left:2%;top:6%;width:132px}.bubble.b2{right:5%;top:8%;width:150px}.bubble.b3{left:9%;bottom:6%;width:156px}.bubble.b4{right:0;bottom:10%;width:130px}.bubble.b5{left:44%;top:2%;width:90px}.bubble-core{position:absolute;left:35%;top:36%;width:160px;height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50%;font-size:23px;font-weight:800;line-height:1.2;text-align:center}.bubble-core small{font-size:9px;color:var(--muted);font-weight:500;letter-spacing:.12em;margin-top:12px}.bubble-legend{position:absolute;inset:auto 0 -25px;text-align:center;font-size:10px;color:var(--muted);letter-spacing:.08em}
.how-section{min-height:820px}.how-heading{max-width:900px;margin-bottom:50px}.how-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.how-step{padding-top:23px;border-top:1px solid var(--line)}.how-step .eyebrow{font-size:10px;letter-spacing:.13em;margin-bottom:22px}.how-step .eyebrow::before{display:none}.how-step h3{font-size:24px;font-weight:700;letter-spacing:-.035em;line-height:1.3;margin:0 0 12px}.how-step p{font-size:13px;color:var(--muted);margin:0}.how-footer{display:flex;justify-content:space-between;gap:40px;align-items:center;margin-top:70px}.contract-line{font-size:25px;font-weight:700;letter-spacing:-.02em;margin:0}.reply-promise{font-size:12px;color:var(--muted);line-height:1.7;max-width:400px;margin:0}
.brief-section{min-height:760px;background:linear-gradient(155deg,rgba(27,43,87,.75),transparent)}.brief-layout{display:grid;grid-template-columns:1.4fr .6fr;gap:70px;align-items:end}.brief-section h2{font-size:clamp(72px,10vw,140px)}.brief-section .section-intro{font-size:20px}.brief-contact{padding-bottom:15px;display:grid;gap:18px;font-size:16px}.brief-contact a:hover{color:var(--cyan)}.brief-contact .reply-promise{font-size:11px;margin-top:12px}.site-footer{max-width:1440px;margin:auto;padding:35px 64px 32px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;color:var(--muted);font-size:10px}.footer-links,.social-links{display:flex;flex-wrap:wrap;gap:22px}.site-footer a:hover{color:var(--cyan)}
.inner-page{padding:155px max(5vw,24px) 100px;min-height:calc(100vh - 90px)}.inner-page .section-inner{max-width:1080px}.inner-page h1{font-size:clamp(46px,6.5vw,86px);margin-bottom:24px}.inner-intro{font-size:18px;color:var(--muted);max-width:750px;line-height:1.6}.brief-form{margin-top:45px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px 30px}.field{display:grid;gap:9px;font-size:12px;font-weight:600;color:#eef4ff}.field.full{grid-column:1/-1}.field .optional{font-weight:400;color:var(--muted);font-size:10px}.field input,.field textarea,.field select{width:100%;color:#fff;background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:9px;padding:16px;font-size:14px;font-weight:400;min-height:55px;resize:vertical}.field input::placeholder,.field textarea::placeholder{color:#8f9db9}.field select option{background:var(--deep)}.field textarea{min-height:125px}.form-summary{margin-top:30px;font-size:12px;color:var(--muted);max-width:780px;line-height:1.7}.form-actions{display:flex;gap:15px;align-items:center;flex-wrap:wrap;margin-top:25px}.form-status{margin-top:20px;padding:18px;border:1px solid var(--line);border-radius:10px;font-size:13px;max-width:780px}.form-status[hidden]{display:none}.draft-preview{width:100%;margin-top:16px;min-height:190px;background:rgba(255,255,255,.04);color:#d9e6fb;padding:16px;border:1px solid var(--line);border-radius:10px;resize:vertical;font-size:12px}.legal-copy{font-size:15px;line-height:1.8;color:#d4def2;max-width:820px}.legal-copy h2{font-size:27px;letter-spacing:-.02em;line-height:1.35;margin-top:40px}.legal-copy dl{display:grid;grid-template-columns:190px 1fr;gap:16px 28px;padding:30px 0}.legal-copy dt{color:var(--muted);font-size:13px}.legal-copy dd{margin:0}.draft-label{display:inline-flex;color:var(--cyan);border:1px solid var(--line);font-size:11px;padding:9px 13px;border-radius:99px;margin-bottom:25px}.missing-data{font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:24px}.no-js-note{display:block;background:var(--navy);padding:15px;font-size:12px;text-align:center}
@media(min-width:1600px){.section{padding-left:calc((100vw - 1280px)/2);padding-right:calc((100vw - 1280px)/2)}.hero-baseline{left:calc((100vw - 1280px)/2);right:calc((100vw - 1280px)/2)}}
@media(max-width:1100px){.header-inner{padding:0 30px}.main-nav{gap:16px}.services-layout{gap:75px;grid-template-columns:.9fr 1.1fr}.strategy-layout{gap:30px}.bubble-scene{height:430px}.bubble{width:110px}.bubble.b2{width:125px}.bubble.b3{width:130px}.bubble-core{width:140px;height:140px}.how-grid{gap:20px}.how-step h3{font-size:21px}.brief-layout{grid-template-columns:1.1fr .9fr}}
@media(max-width:760px){html{scroll-padding-top:90px}.header-inner{height:76px;padding:0 23px;gap:13px}.brand img{width:141px;height:32px}.header-tools{margin-left:auto;gap:10px}.motion-control{width:33px;height:33px}.lang-switch{font-size:10px}.menu-toggle{display:grid;place-items:center;width:34px;height:34px;font-size:18px}.main-nav{position:absolute;top:76px;left:15px;right:15px;background:rgba(16,26,58,.98);border:1px solid var(--line);border-radius:14px;padding:20px;display:none;flex-direction:column;gap:0}.main-nav.is-open{display:flex}.main-nav a{padding:14px}.section{min-height:auto;padding:100px 24px 80px}.section-number{right:24px;bottom:30px;font-size:9px}.eyebrow{font-size:9px;letter-spacing:.12em;margin-bottom:24px}h2{font-size:46px;letter-spacing:-.045em}.section-intro{font-size:17px}.hero{min-height:850px;min-height:100svh;padding-top:160px;padding-bottom:135px;align-items:center}.hero h1{font-size:clamp(49px,13vw,92px);margin-bottom:30px;letter-spacing:-.055em;line-height:1.1}.hero .section-intro{font-size:17px}.hero-baseline{inset:auto 24px 30px;font-size:9px}.hero-baseline span:last-child{gap:9px}.hero-orbit-label{display:none}.lab-heading,.services-layout,.strategy-layout,.brief-layout{grid-template-columns:1fr;gap:24px}.lab-heading{margin-bottom:28px}.lab-heading h2{margin-bottom:0}.lab-heading .section-intro{font-size:16px;margin-bottom:0}.lab-status{font-size:9px}.mode-stage{height:255px;padding:24px}.mode-word{font-size:clamp(60px,18vw,115px)}.stage-index{left:20px;top:20px;font-size:8px}.stage-caption{right:20px;bottom:20px;font-size:9px}.mode-buttons{padding:14px;gap:7px}.mode-buttons button{font-size:9px;min-height:40px;padding:10px 12px}.lab-bottom{align-items:start;flex-direction:column;gap:15px}.lab-note{font-size:10px}.services-heading{position:static}.services-heading .section-intro{font-size:17px}.service-list{margin:35px 0 0 30px}.service-list::before{left:-17px}.service-number{left:-35px;font-size:9px;top:5px}.service-row h3{font-size:20px}.service-row p{font-size:13px}.agency-note{margin-top:24px;font-size:12px;max-width:100%}.strategy-heading .section-intro{font-size:16px}.strategy-steps{font-size:9px;gap:12px}.bubble-scene{height:355px;margin-top:25px}.bubble.b1{width:95px;left:0;top:5%}.bubble.b2{width:112px;right:0;top:5%}.bubble.b3{width:105px;left:1%;bottom:3%}.bubble.b4{width:96px;right:0;bottom:4%}.bubble.b5{width:62px;left:43%;top:0}.bubble{font-size:8px}.bubble span{max-width:85px}.bubble-core{width:114px;height:114px;left:33%;top:36%;font-size:19px}.bubble-core small{font-size:7px;margin-top:8px}.bubble-legend{font-size:9px}.how-heading{margin-bottom:35px}.how-grid{grid-template-columns:1fr 1fr;gap:36px 23px}.how-step h3{font-size:20px}.how-step p{font-size:12px}.how-step .eyebrow{font-size:9px;margin-bottom:18px}.how-footer{flex-direction:column;align-items:start;margin-top:45px;gap:22px}.contract-line{font-size:22px}.reply-promise{font-size:11px}.brief-section h2{font-size:76px;max-width:100%}.brief-section .section-intro{font-size:17px}.brief-contact{margin-top:36px;font-size:14px;gap:15px}.site-footer{padding:28px 24px 32px;gap:26px;font-size:9px}.footer-links,.social-links{gap:17px}.inner-page{padding:135px 24px 65px}.inner-page h1{font-size:47px}.inner-intro{font-size:16px}.form-grid{grid-template-columns:1fr;gap:23px}.field.full{grid-column:auto}.field{font-size:11px}.field input,.field textarea,.field select{font-size:16px;padding:14px}.form-actions{align-items:stretch}.form-actions .button{width:100%}.form-summary{font-size:11px}.legal-copy{font-size:13px}.legal-copy dl{grid-template-columns:1fr;gap:8px}.legal-copy dd{margin-bottom:18px}.legal-copy h2{font-size:24px}.hero .text-link{font-size:13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}html:not(.motion-enabled) *,html:not(.motion-enabled) *::before,html:not(.motion-enabled) *::after{animation:none!important;transition:none!important}.button:hover{transform:none}}

/* TiiX CSS source: assets/v03.css */
/* Layout and editorial colours. Motion effects live in motion.css. */
.brand{display:flex;align-items:center;gap:5px}.brand .brand-wordmark{width:174px;height:40px}
.logo-dot-origin{position:relative;display:block;width:14px;height:14px;flex:none;margin-top:9px}
.logo-dot-origin img{position:absolute;width:19.5px;height:20.7px;max-width:none;left:-2.75px;top:-2.1px}
.hero h1{max-width:1200px;font-size:clamp(66px,8.5vw,125px)}.gravity-word{max-width:100%}
.hero-baseline{justify-content:flex-end}.hero .section-intro{max-width:720px}
.eyebrow{font-size:13px;letter-spacing:.12em;text-transform:none}.lab-heading .eyebrow{font-size:18px;letter-spacing:-.015em;font-weight:800}
.lab-section{background:linear-gradient(165deg,rgba(5,12,33,.3),rgba(7,18,48,.72))}.lab-heading{gap:60px}
.pixel-brand-label{display:none;position:absolute;z-index:6;left:30px;top:61px;right:30px;margin:0;font-size:10px;line-height:1.8;color:#d8faff;font-family:'Press Start 2P',monospace}
.mode-stage[data-mode=pixel] .pixel-brand-label{display:block}.mode-stage[data-mode=pixel] .mode-word{margin-top:30px}
.media-gallery{margin-top:90px}.gallery-heading{max-width:720px;margin:75px 0 30px}
.gallery-heading:first-child{margin-top:0}.gallery-heading h3{font-size:clamp(27px,3vw,43px);line-height:1.15;letter-spacing:-.04em;margin-bottom:12px;font-weight:800;text-shadow:0 5px 18px #0006}
.gallery-heading p{font-size:15px;color:#c9d7ef;margin:0;max-width:610px}.film-grid{display:grid;gap:26px;align-items:start}.brand-films,.seasonal-films{grid-template-columns:repeat(3,minmax(0,1fr))}.links-films{grid-template-columns:repeat(2,minmax(0,1fr));max-width:950px;margin:auto}
.film-card{border:1px solid #8cc7ff33;border-radius:20px;overflow:hidden;background:#06142e;box-shadow:0 24px 65px #0005;--card-colour:#051736;--card-ink:#f4f8ff}
.film-media{padding:16px;background:radial-gradient(ellipse at center,#174e7355,#06142e 80%)}
.film-media video{display:block;width:100%;height:auto;aspect-ratio:var(--film-ratio,9/16);object-fit:contain;background:#030b1d;border-radius:10px;max-height:540px;color-scheme:dark}
.film-copy{padding:24px 26px 29px;background:var(--card-colour);color:var(--card-ink);min-height:184px}
.film-copy h3{font-size:23px;line-height:1.22;letter-spacing:-.035em;margin:0 0 12px;font-weight:800}.film-copy>p:last-child{font-size:13px;line-height:1.65;margin-bottom:0}
.media-status{font-size:9px!important;font-weight:700;letter-spacing:.08em;margin:0 0 13px;text-transform:uppercase;line-height:1.6!important}
.tone-cyan{--card-colour:#00b7d7;--card-ink:#071936}.tone-pink{--card-colour:#ff7fae;--card-ink:#091932}.tone-caramel{--card-colour:#cb9250;--card-ink:#0b1938}
.seasonal-films .film-copy{min-height:115px}.seasonal-films .film-copy>p:last-child:empty{display:none}
.exploration-grid{display:grid;grid-template-columns:2.25fr 1fr;gap:26px;align-items:stretch}
.coffee-concept{background:#f2e8d2;border:1px solid #fffb;border-radius:20px;overflow:hidden;color:#0b214e;box-shadow:0 20px 65px #0004}.concept-copy{padding:30px}.concept-copy h3{font-size:32px;letter-spacing:-.04em;line-height:1.15;margin-bottom:15px}.concept-copy>p:last-child{font-size:14px;margin:0;line-height:1.65}
.sketch-link{display:block;padding:0 18px 18px;line-height:0}.sketch-link img{display:block;width:100%;height:auto;border-radius:9px}.storyboard-link{padding-top:4px}
.skincare-concept{position:relative;background:#ff7fae;color:#081733;border-radius:20px;padding:30px;display:flex;flex-direction:column;justify-content:center;min-height:430px;box-shadow:0 20px 65px #0004;overflow:hidden}
.skincare-type{font-size:clamp(64px,7vw,108px);font-weight:800;line-height:.92;letter-spacing:-.06em;margin:30px 0 40px}.skincare-type span{color:white;font-size:.5em;margin-left:5px}.skincare-concept h3{font-size:24px;line-height:1.2;letter-spacing:-.03em;margin:0 0 14px}.skincare-concept>p:last-child{font-size:13px;line-height:1.65;margin:0}
.service-list::before{left:-22px}.service-row{padding-left:22px;border-left:3px solid var(--service-accent,#2fd8ec);border-bottom-color:#c0d8ff28}.service-row h3{color:var(--service-accent,#fff)}.service-1{--service-accent:#2fd8ec}.service-2{--service-accent:#ff92bd}.service-3{--service-accent:#dba363}.service-4{--service-accent:#aa9cff}.service-5{--service-accent:#80dfbb}.service-6{--service-accent:#eff5ff}
.services-section{background:linear-gradient(155deg,#03112955,transparent)}.strategy-section{background:radial-gradient(ellipse at 75% 40%,#396fb61e,transparent 65%)}.how-section{background:linear-gradient(145deg,#044b6533,#02102d40)}
.strategy-steps span{border:1px solid #79ddef40;border-radius:50px;padding:8px 12px}.brief-section{background:linear-gradient(160deg,#0a224399,transparent)}
@media(max-width:1100px){.header-inner{gap:18px}.brand .brand-wordmark{width:160px}.gallery-heading{margin-top:60px}.film-grid{gap:18px}.film-copy{padding:22px}.film-copy h3{font-size:20px}.exploration-grid{grid-template-columns:2fr 1fr;gap:18px}.skincare-concept{padding:24px}}
@media(max-width:760px){.brand{gap:3px}.brand .brand-wordmark{width:127px;height:32px}.logo-dot-origin{width:11px;height:11px;margin-top:6px}.logo-dot-origin img{width:15.3px;height:16.3px;left:-2.15px;top:-1.7px}.header-inner{gap:9px}.header-tools{gap:8px}.hero h1{font-size:clamp(43px,11.8vw,80px);line-height:1.08}.hero{padding-top:135px}.hero-baseline{bottom:26px}.eyebrow{font-size:12px}.lab-heading .eyebrow{font-size:17px}.lab-heading{gap:24px}.pixel-brand-label{left:20px;right:20px;top:46px;font-size:7px;max-width:240px;line-height:1.85}.mode-stage[data-mode=pixel] .mode-word{margin-top:48px}.media-gallery{margin-top:62px}.gallery-heading{margin:56px 0 24px}.gallery-heading h3{font-size:29px}.gallery-heading p{font-size:14px}.film-grid{grid-template-columns:1fr;gap:25px;max-width:430px;margin-left:auto;margin-right:auto}.film-media{padding:14px}.film-media video{max-height:none;width:100%}.film-copy{min-height:0;padding:24px}.film-copy h3{font-size:25px}.film-copy>p:last-child{font-size:14px}.media-status{font-size:10px!important}.exploration-grid{grid-template-columns:1fr}.concept-copy{padding:24px}.concept-copy h3{font-size:28px}.sketch-link{padding:0 10px 12px}.skincare-concept{min-height:390px;padding:28px}.skincare-type{font-size:96px;margin:25px 0 35px}.service-list{margin-left:15px}.service-list::before{left:-13px}.service-row{padding-left:17px}.strategy-steps{gap:8px}.strategy-steps span{padding:7px 10px;font-size:8px}.how-step .eyebrow{font-size:12px}.brief-section h2{font-size:clamp(60px,17vw,86px)}}

/* TiiX CSS source: assets/v04.css */
/* Five focused refinements to the approved v03 design. */
.service-row{padding-left:62px;min-height:86px;border-left:0}.service-symbol{position:absolute;left:0;top:1px;width:42px;height:42px;display:grid;place-items:center;color:var(--service-accent);border-radius:12px;background:linear-gradient(135deg,#ffffff0c,#ffffff02);box-shadow:inset 0 0 0 1px #acd7ff25,0 8px 22px #0002;transition:transform .3s,box-shadow .3s}
.service-symbol svg{display:block;width:32px;height:32px;overflow:visible;filter:drop-shadow(0 0 8px #2fd8ec20)}
.service-row:hover .service-symbol{transform:translateY(-3px) rotate(-5deg);box-shadow:inset 0 0 0 1px #ffffff40,0 12px 24px #0003}
.service-row:nth-child(even):hover .service-symbol{transform:translateY(-3px) rotate(5deg)}
.journey-legend{display:flex;gap:24px;flex-wrap:wrap;margin:-12px 0 36px;font-size:11px;color:#c8dcef;line-height:1.5}
.journey-legend span{display:inline-flex;align-items:center;gap:9px}.journey-legend span::before{content:'';width:10px;height:10px;border-radius:50%;background:var(--journey-colour);box-shadow:0 0 15px var(--journey-colour)}
.client-label{--journey-colour:#2fd8ec}.team-label{--journey-colour:#b4a1ff}
.how-step{position:relative;padding:25px 20px 24px;border-top:3px solid var(--journey-colour);border-radius:0 0 16px 16px;background:linear-gradient(160deg,var(--journey-wash),#03132a15);box-shadow:inset 0 1px #ffffff16,0 18px 30px #00102133}
.client-step{--journey-colour:#2fd8ec;--journey-wash:#2fd8ec14}.team-step{--journey-colour:#b4a1ff;--journey-wash:#b4a1ff12}
.how-step .eyebrow{display:inline-flex;padding:7px 11px;background:var(--journey-colour);color:#071b35;border-radius:99px;line-height:1.2;font-weight:800;letter-spacing:.06em;margin-bottom:22px}
.how-step h3{color:var(--journey-colour)}.how-step>p:last-child{color:#d4e3f2;line-height:1.7}
.how-step:not(:last-child)::after{content:'→';position:absolute;right:-24px;top:29px;font-size:19px;line-height:1;color:var(--journey-colour);opacity:.7}
.response-promise{max-width:430px;display:grid;gap:11px;line-height:1.5}.response-highlight{position:relative;display:block;padding:17px 18px 17px 53px;border:1px solid #2fd8ec55;border-radius:16px;background:linear-gradient(125deg,#2fd8ec14,#122c4940);font-size:16px;font-weight:800;color:#b8f8ff}
.plan-response{display:block;font-size:12px;color:#c1d6ed;padding-left:18px}.how-footer{align-items:center}
.brand-motion-heading{position:relative;padding-left:22px;border-left:4px solid #2fd8ec}.brand-motion-heading::after{content:'';display:block;width:145px;height:5px;border-radius:99px;margin-top:23px;background:linear-gradient(90deg,#2fd8ec 0 33.3%,#ff7fae 33.3% 66.6%,#dba363 66.6%)}
.brand-motion-heading h3{color:#d5faff}.brand-films .film-card{border-color:var(--card-colour);box-shadow:0 20px 60px #0005,inset 0 0 0 1px var(--card-colour)}
.brand-films .film-media{background:linear-gradient(140deg,var(--card-colour),#09223f 72%);padding:14px}.brand-films .film-copy{min-height:192px}.brand-films .film-copy h3{font-weight:850}
@media(max-width:1100px){.how-step{padding-left:15px;padding-right:15px}.how-step:not(:last-child)::after{right:-18px;font-size:16px}}
@media(max-width:760px){.service-row{padding-left:54px;min-height:83px}.service-symbol{width:37px;height:37px;top:0}.service-symbol svg{width:29px;height:29px}.service-list{margin-left:8px}.service-list::before{display:none}.journey-legend{font-size:10px;gap:14px;margin:0 0 28px}.journey-legend span{gap:7px}.how-grid{gap:26px 18px}.how-step{padding:19px 14px 23px}.how-step .eyebrow{font-size:10px;padding:7px 10px}.how-step h3{font-size:19px;line-height:1.3}.how-step>p:last-child{font-size:12px}.how-step:not(:last-child)::after{right:-16px;top:26px;font-size:15px}.how-step:nth-child(2)::after{content:none}.how-footer{align-items:stretch}.response-promise{max-width:none;gap:12px}.response-highlight{font-size:15px;padding:17px 16px 17px 49px}.plan-response{font-size:12px;padding-left:16px}.brand-motion-heading{padding-left:17px}.brand-films .film-media{padding:12px}.brand-films .film-copy{min-height:0}}
.motion-paused .service-symbol{transition:none}.motion-paused .service-row:hover .service-symbol{transform:none}
@media(prefers-reduced-motion:reduce){html:not(.motion-enabled) .service-row:hover .service-symbol{transform:none}}

/* TiiX CSS source: assets/motion.css */
/* TiiX Media — native motion layer. Layout, content and controls live in site.css. */

.ambient-scene {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  perspective: 1100px;
  background:
    radial-gradient(ellipse at 73% 12%, rgba(51, 84, 144, .22), transparent 54%),
    radial-gradient(ellipse at 9% 78%, rgba(47, 216, 236, .055), transparent 45%);
  --pointer-x: 0;
  --pointer-y: 0;
}

.ambient-scene::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .16;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.22' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

.ambient-orb {
  position: absolute;
  aspect-ratio: 1;
  border-radius: 50%;
  will-change: transform;
  background:
    radial-gradient(circle at 29% 23%, rgba(166, 220, 251, .22), transparent 32%),
    radial-gradient(circle at 36% 34%, #29436e 0, #1b2b57 34%, #101a3a 66%, #091126 100%);
  box-shadow: inset -35px -50px 90px rgba(3, 7, 21, .4), 0 60px 120px rgba(3, 7, 21, .25);
  opacity: .64;
}

.ambient-orb.a1 {
  width: min(60vw, 850px);
  top: -27%;
  right: -18%;
  transform: translate3d(calc(var(--pointer-x) * -18px), calc(var(--pointer-y) * -18px), -50px);
}

.ambient-orb.a2 {
  width: min(37vw, 500px);
  top: 62%;
  left: -20%;
  opacity: .35;
  filter: blur(1px);
  transform: translate3d(calc(var(--pointer-x) * 22px), calc(var(--pointer-y) * 25px), -100px);
}

.ambient-orb.a3 {
  width: min(14vw, 195px);
  top: 58%;
  right: 8%;
  opacity: .16;
  transform: translate3d(calc(var(--pointer-x) * 32px), calc(var(--pointer-y) * 20px), 50px);
}

.ambient-ring {
  position: absolute;
  width: min(65vw, 950px);
  aspect-ratio: 1;
  border: 1px solid rgba(100, 164, 203, .17);
  border-radius: 50%;
  box-shadow: 0 0 25px rgba(47, 216, 236, .018), inset 0 0 24px rgba(47, 216, 236, .018);
}

.ambient-ring.r1 {
  right: -21%;
  top: -28%;
  transform: rotateX(64deg) rotateY(-24deg) rotateZ(-18deg)
    translate3d(calc(var(--pointer-x) * -12px), calc(var(--pointer-y) * -12px), 0);
}

.ambient-ring.r2 {
  width: min(58vw, 740px);
  left: -30%;
  top: 49%;
  opacity: .5;
  transform: rotateX(68deg) rotateY(22deg) rotateZ(21deg);
}

.ambient-grid {
  position: absolute;
  width: 170%;
  height: 90%;
  left: -35%;
  bottom: -58%;
  opacity: .07;
  background-image:
    linear-gradient(rgba(47, 216, 236, .45) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47, 216, 236, .45) 1px, transparent 1px);
  background-size: 72px 72px;
  transform: rotateX(68deg);
  transform-origin: center top;
  mask-image: linear-gradient(transparent, #000 30%, transparent);
}

#story-dot {
  position: fixed;
  left: 0;
  top: 0;
  width: 30px;
  height: 30px;
  z-index: 25;
  pointer-events: none;
  border-radius: 50%;
  opacity: 0;
  --dot-x: -100px;
  --dot-y: -100px;
  --dot-scale: 1;
  --dot-color: #2fd8ec;
  background:
    radial-gradient(circle at 28% 23%, rgba(255, 255, 255, .96), transparent 23%),
    radial-gradient(circle at 33% 30%, var(--dot-color) 16%, var(--dot-color) 39%, #09869a 74%, #034254 100%);
  box-shadow: inset -4px -5px 7px rgba(0, 43, 58, .24), 0 8px 18px rgba(2, 5, 20, .2), 0 0 27px rgba(47, 216, 236, .17);
  transform: translate3d(var(--dot-x), var(--dot-y), 0) translate(-50%, -50%) scale(var(--dot-scale));
  transition: opacity .25s ease, background-color .3s ease, border-radius .28s ease;
  will-change: transform;
}

#story-dot.is-ready { opacity: 1; }

#story-dot::after {
  content: "";
  position: absolute;
  inset: -38%;
  border: 1px solid rgba(47, 216, 236, .11);
  border-radius: inherit;
  animation: tiix-dot-breath 5s ease-in-out infinite;
}

#story-dot.is-pixel {
  border-radius: 0;
  width: 19px;
  height: 19px;
  background: var(--dot-color);
  box-shadow: 19px 0 #2fd8ec, -19px 0 #2fd8ec, 0 19px #2fd8ec, 0 -19px #2fd8ec,
    19px 19px rgba(47, 216, 236, .4), -19px -19px rgba(47, 216, 236, .4);
}

#story-dot.is-pixel::after { display: none; }

#story-dot.is-pop {
  border-radius: 34% 66% 57% 43% / 43% 36% 64% 57%;
  box-shadow: 7px 7px 0 #8e6bff, -4px -4px 0 rgba(255, 127, 176, .4);
}

.gravity-title { perspective: 900px; }

.gravity-word {
  display: inline-block;
  transform-origin: 50% 65%;
  --word-lift: -7px;
  --word-tilt: -.9deg;
  --word-delay: 0s;
  text-shadow: 0 2px 0 rgba(117, 140, 177, .14), 0 7px 0 rgba(5, 14, 40, .26), 0 19px 32px rgba(2, 5, 19, .28);
  animation: tiix-gravity 8s ease-in-out var(--word-delay) infinite;
}

.gravity-word:nth-child(2) {
  --word-lift: 7px;
  --word-tilt: .65deg;
  --word-delay: -2.7s;
}

.gravity-word:nth-child(3) {
  --word-lift: -12px;
  --word-tilt: -1.1deg;
  --word-delay: -5s;
}

.gravity-word:nth-child(4) {
  --word-lift: 4px;
  --word-tilt: .7deg;
  --word-delay: -1.2s;
}

.mode-stage {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  perspective: 800px;
  transform-style: preserve-3d;
  background: radial-gradient(ellipse at 22% 24%, rgba(73, 113, 176, .19), transparent 70%), #111d40;
  --pointer-x: 0;
  --pointer-y: 0;
  --mode-accent: #2fd8ec;
}

.mode-stage::before,
.mode-stage::after {
  content: "";
  position: absolute;
  pointer-events: none;
  z-index: -1;
  transition: transform .8s cubic-bezier(.2, .7, .2, 1), opacity .45s ease;
}

.mode-stage::before {
  width: 63%;
  aspect-ratio: 1;
  right: -12%;
  top: -13%;
  border: 1px solid rgba(47, 216, 236, .2);
  border-radius: 50%;
  transform: rotateY(-38deg) rotateX(49deg);
}

.mode-stage::after {
  width: 50%;
  aspect-ratio: 1;
  left: -18%;
  bottom: -24%;
  border: 1px solid rgba(47, 216, 236, .12);
  border-radius: 50%;
  transform: rotateY(30deg) rotateX(54deg);
}

.mode-word {
  position: relative;
  display: block;
  z-index: 2;
  transform-origin: 50% 50%;
  transition: transform .65s cubic-bezier(.18, .75, .22, 1), color .3s ease, text-shadow .3s ease;
}

.mode-stage.has-type-dot > .dot-anchor { position: absolute; width: 0; height: 0; }
body.motion-ready .mode-stage.has-type-dot .mode-word span:last-child { visibility: hidden; }
.motion-paused body.motion-ready .mode-stage.has-type-dot .mode-word span:last-child,
.motion-reduced body.motion-ready .mode-stage.has-type-dot .mode-word span:last-child { visibility: visible; }

.mode-stage[data-mode="gravity"] .mode-word {
  color: #fff;
  transform: rotateX(calc(var(--pointer-y) * -7deg)) rotateY(calc(var(--pointer-x) * 7deg)) rotateZ(-4deg) translateZ(32px);
  text-shadow: 1px 2px #243c66, 2px 4px #20385f, 3px 6px #1b3155, 4px 8px #182c4d, 6px 12px #12233f, 12px 23px 32px rgba(2, 6, 22, .6);
}

.mode-stage.is-visible[data-mode="gravity"] .mode-word {
  animation: tiix-mode-float 6s ease-in-out infinite;
}

.mode-stage[data-mode="gravity"] .mode-word span:nth-child(2) { transform: translateY(10px) rotate(3deg); }
.mode-stage[data-mode="gravity"] .mode-word span:nth-child(3) { transform: translateY(-8px) rotate(-3deg); }
.mode-stage[data-mode="gravity"] .mode-word span:nth-child(4) { transform: translateY(4px) rotate(1deg); }
.mode-stage[data-mode="gravity"] .mode-word span:nth-child(5) { transform: translateY(-12px) rotate(-4deg); }

.pixel-art {
  display: none;
  position: absolute;
  width: 12px;
  height: 12px;
  right: 24%;
  top: auto;
  bottom: 27%;
  background: #2fd8ec;
  box-shadow:
    -12px -24px #2fd8ec, 0 -24px #2fd8ec, 12px -24px #2fd8ec,
    -24px -12px #2fd8ec, -12px -12px #e9fbff, 0 -12px #b6f4ff, 12px -12px #2fd8ec, 24px -12px #2fd8ec,
    -24px 0 #2fd8ec, -12px 0 #b6f4ff, 12px 0 #2fd8ec, 24px 0 #2fd8ec,
    -24px 12px #2fd8ec, -12px 12px #2fd8ec, 0 12px #2fd8ec, 12px 12px #2fd8ec, 24px 12px #0b9eb9,
    -12px 24px #2fd8ec, 0 24px #0b9eb9, 12px 24px #0b9eb9,
    -60px -48px rgba(47, 216, 236, .5), 60px 48px rgba(142, 107, 255, .7);
  image-rendering: pixelated;
}

.mode-stage[data-mode="pixel"] {
  background-color: #101a3a;
  background-image:
    linear-gradient(rgba(47, 216, 236, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47, 216, 236, .07) 1px, transparent 1px);
  background-size: 24px 24px;
}

.mode-stage[data-mode="pixel"]::before {
  border: 0;
  border-radius: 0;
  inset: 0;
  width: auto;
  height: auto;
  background: repeating-linear-gradient(transparent 0 3px, rgba(0, 0, 0, .12) 3px 4px);
  transform: none;
}

.mode-stage[data-mode="pixel"]::after { opacity: 0; }

.mode-stage[data-mode="pixel"] .mode-word {
  font-family: "Press Start 2P", ui-monospace, monospace;
  font-size: clamp(40px, 7.3vw, 104px);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: -.04em;
  color: #2fd8ec;
  transform: translate(-12px, -36px);
  text-shadow: 4px 4px #09102a, 8px 8px rgba(142, 107, 255, .65);
}

.mode-stage[data-mode="pixel"] .pixel-art { display: block; opacity: 1; }

.mode-stage.is-visible[data-mode="pixel"] .pixel-art {
  animation: tiix-pixel-hop 3.6s steps(1, end) infinite;
}

.mode-stage[data-mode="poster"] {
  background: linear-gradient(126deg, #dff7f8 0, #c9f1f5 74%, #2fd8ec 74%);
}

.mode-stage[data-mode="poster"]::before {
  content: "TiiX TiiX TiiX";
  top: -12%;
  left: -3%;
  right: auto;
  width: 110%;
  aspect-ratio: auto;
  border: 0;
  border-radius: 0;
  font-size: clamp(90px, 13vw, 190px);
  font-weight: 800;
  line-height: .9;
  letter-spacing: -.08em;
  color: transparent;
  -webkit-text-stroke: 1px rgba(16, 26, 58, .15);
  transform: rotate(-14deg);
  overflow-wrap: anywhere;
}

.mode-stage[data-mode="poster"]::after {
  width: 10%;
  right: 6%;
  left: auto;
  bottom: 12%;
  border: 2px solid #101a3a;
  transform: none;
}

.mode-stage[data-mode="poster"] .mode-word {
  color: #101a3a;
  font-weight: 900;
  letter-spacing: -.085em;
  transform: rotate(-7deg) scaleY(1.17);
  text-shadow: none;
}

.mode-stage[data-mode="poster"] :is(.stage-index, .stage-caption) { color: #1b2b57; }

.mode-stage[data-mode="pop"] {
  background: linear-gradient(133deg, #1b2b57 0 60%, #8e6bff 60%);
}

.mode-stage[data-mode="pop"]::before {
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
  background-image: radial-gradient(rgba(255, 255, 255, .18) 1px, transparent 1.3px);
  background-size: 9px 9px;
  transform: none;
  mask-image: linear-gradient(135deg, transparent 25%, #000);
}

.mode-stage[data-mode="pop"]::after {
  width: 52%;
  left: 23%;
  bottom: 8%;
  border: 0;
  border-radius: 0;
  background: #ff7fb0;
  clip-path: polygon(50% 0%, 58% 28%, 80% 6%, 77% 36%, 100% 28%, 84% 49%, 100% 65%, 74% 66%, 82% 94%, 61% 78%, 50% 100%, 41% 76%, 20% 95%, 25% 66%, 0 69%, 18% 49%, 0 30%, 27% 34%, 20% 8%, 42% 28%);
  transform: rotate(-10deg);
}

.mode-stage[data-mode="pop"] .mode-word {
  color: #fff;
  transform: rotate(-8deg) scale(1.04);
  text-shadow: 2px 2px #101a3a, 4px 4px #101a3a, 7px 7px #2fd8ec;
}

.mode-stage.is-visible[data-mode="pop"] .mode-word {
  animation: tiix-pop-entry .55s cubic-bezier(.2, 1.6, .3, 1) both;
}

.bubble-scene {
  position: relative;
  min-height: 470px;
  width: 100%;
  perspective: 900px;
  transform-style: preserve-3d;
  isolation: isolate;
  --pointer-x: 0;
  --pointer-y: 0;
}

.bubble-scene::before {
  content: "";
  position: absolute;
  width: 66%;
  height: 66%;
  left: 17%;
  top: 12%;
  border: 1px solid rgba(47, 216, 236, .14);
  border-radius: 50%;
  transform: rotateX(53deg) rotateZ(-22deg);
  opacity: .65;
  transition: opacity .7s ease, transform 1s ease;
}

.bubble-scene::after {
  content: "";
  position: absolute;
  width: 73%;
  height: 1px;
  left: 13%;
  top: 51%;
  background: linear-gradient(90deg, transparent, rgba(47, 216, 236, .6), transparent);
  transform: rotate(30deg) scaleX(.3);
  opacity: 0;
  transition: transform 1s cubic-bezier(.2, .7, .2, 1), opacity .7s ease;
}

.bubble {
  position: absolute;
  left: 50%;
  top: 47%;
  width: clamp(88px, 9.6vw, 138px);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(191, 238, 245, .24);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 12px;
  color: #e9f6f8;
  font-weight: 500;
  font-size: clamp(11px, .97vw, 14px);
  line-height: 1.3;
  background:
    radial-gradient(ellipse at 28% 16%, rgba(255, 255, 255, .2), transparent 24%),
    radial-gradient(ellipse at 58% 110%, rgba(47, 216, 236, .18), transparent 58%),
    radial-gradient(ellipse at 60% 53%, rgba(37, 66, 108, .85), rgba(16, 26, 58, .55) 72%);
  box-shadow: inset 1px 2px 5px rgba(220, 249, 255, .15), inset -5px -10px 22px rgba(2, 7, 21, .22), 0 24px 32px rgba(4, 9, 28, .15);
  transform: translate(-50%, -50%) translate3d(var(--bubble-x), var(--bubble-y), var(--bubble-z))
    rotateX(calc(var(--pointer-y) * -4deg)) rotateY(calc(var(--pointer-x) * 5deg));
  transition: transform 1.35s cubic-bezier(.2, .7, .2, 1), background .8s ease, border-color .8s ease;
  --bubble-x: 0px;
  --bubble-y: 0px;
  --bubble-z: 0px;
}

.bubble::before {
  content: "";
  position: absolute;
  width: 42%;
  height: 20%;
  top: 9%;
  left: 17%;
  border-top: 1px solid rgba(234, 253, 255, .48);
  border-radius: 50%;
  transform: rotate(-30deg);
}

.bubble span { position: relative; z-index: 1; }
.bubble.b1,
.bubble.b2,
.bubble.b3,
.bubble.b4,
.bubble.b5 {
  left: 50%;
  top: 47%;
  right: auto;
  bottom: auto;
  width: clamp(88px, 9.6vw, 138px);
  height: auto;
}

.bubble.b1 { --bubble-x: -155px; --bubble-y: -124px; --bubble-z: 35px; }
.bubble.b2 { --bubble-x: 117px; --bubble-y: -111px; --bubble-z: -25px; }
.bubble.b3 { --bubble-x: -177px; --bubble-y: 75px; --bubble-z: -60px; }
.bubble.b4 { --bubble-x: 175px; --bubble-y: 65px; --bubble-z: 25px; }
.bubble.b5 { --bubble-x: -5px; --bubble-y: 162px; --bubble-z: -25px; }

.bubble-core {
  position: absolute;
  width: 130px;
  height: 130px;
  aspect-ratio: 1;
  left: 50%;
  top: 47%;
  border-radius: 50%;
  border: 1px solid rgba(47, 216, 236, .5);
  background: radial-gradient(circle at 27% 23%, rgba(202, 248, 255, .2), rgba(47, 216, 236, .07) 45%, transparent 70%);
  box-shadow: 0 0 60px rgba(47, 216, 236, .07), inset 0 0 18px rgba(47, 216, 236, .12);
  transform: translate(-50%, -50%);
  transition: opacity .6s ease, transform .9s ease;
}

.bubble-scene.is-visible:not([data-phase="plan"]) .bubble-core {
  animation: tiix-core-breath 6s ease-in-out infinite;
}

.bubble-scene[data-phase="plan"]::before { opacity: .15; transform: rotateX(72deg) rotateZ(12deg); }
.bubble-scene[data-phase="plan"]::after { opacity: 1; transform: rotate(30deg) scaleX(1); }
.bubble-scene[data-phase="plan"] .bubble { --bubble-z: 0px; border-color: rgba(47, 216, 236, .45); }
.bubble-scene[data-phase="plan"] .bubble.b1 { --bubble-x: -180px; --bubble-y: -105px; }
.bubble-scene[data-phase="plan"] .bubble.b2 { --bubble-x: -90px; --bubble-y: -53px; }
.bubble-scene[data-phase="plan"] .bubble.b3 { --bubble-x: 0px; --bubble-y: 0px; }
.bubble-scene[data-phase="plan"] .bubble.b4 { --bubble-x: 90px; --bubble-y: 53px; }
.bubble-scene[data-phase="plan"] .bubble.b5 { --bubble-x: 180px; --bubble-y: 105px; }
.bubble-scene[data-phase="plan"] .bubble-core { opacity: 0; transform: translate(-50%, -50%) scale(.3); }

.motion-paused #story-dot,
.motion-reduced #story-dot { position: absolute; will-change: auto; }

.motion-paused body.motion-ready .dot-anchor::after,
.motion-reduced body.motion-ready .dot-anchor::after { opacity: 1; }

.motion-paused :is(.gravity-word, .mode-word, .pixel-art, .bubble-core, #story-dot::after),
.motion-reduced :is(.gravity-word, .mode-word, .pixel-art, .bubble-core, #story-dot::after) {
  animation: none !important;
}

.motion-paused :is(.mode-word, .bubble, .bubble-scene::before, .bubble-scene::after),
.motion-reduced :is(.mode-word, .bubble, .bubble-scene::before, .bubble-scene::after) {
  transition: none !important;
}

.motion-paused .gravity-word,
.motion-reduced .gravity-word { transform: none; }

@keyframes tiix-dot-breath {
  0%, 100% { opacity: .35; transform: scale(.94); }
  50% { opacity: .8; transform: scale(1.07); }
}

@keyframes tiix-gravity {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(var(--word-tilt)); }
  50% { transform: translate3d(0, var(--word-lift), 20px) rotate(calc(var(--word-tilt) * -.6)); }
}

@keyframes tiix-mode-float {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -14px; }
}

@keyframes tiix-pixel-hop {
  0%, 100% { transform: translate(0, 0); }
  20% { transform: translate(-24px, -24px); }
  40% { transform: translate(-48px, 0); }
  60% { transform: translate(-24px, 24px); }
  80% { transform: translate(0, -24px); }
}

@keyframes tiix-pop-entry {
  0% { transform: rotate(-14deg) scale(.8); }
  65% { transform: rotate(-5deg) scale(1.08); }
  100% { transform: rotate(-8deg) scale(1.04); }
}

@keyframes tiix-core-breath {
  0%, 100% { transform: translate(-50%, -50%) scale(.95); }
  50% { transform: translate(-50%, -50%) scale(1.08); }
}

@media (max-width: 760px) {
  .ambient-orb.a1 { width: 85vw; top: -10%; right: -45%; }
  .ambient-orb.a2 { width: 64vw; left: -43%; }
  .ambient-orb.a3, .ambient-ring.r2, .ambient-grid { display: none; }
  .ambient-ring.r1 { width: 100vw; right: -43%; top: -5%; opacity: .6; }
  .ambient-scene::after { opacity: .08; }
  .gravity-word { --word-lift: -4px; --word-tilt: -.5deg; }
  .gravity-word:nth-child(2) { --word-lift: 4px; --word-tilt: .4deg; }
  .gravity-word:nth-child(3) { --word-lift: -5px; --word-tilt: -.6deg; }
  #story-dot { width: 24px; height: 24px; }
  #story-dot.is-pixel { width: 12px; height: 12px; box-shadow: 12px 0 #2fd8ec, -12px 0 #2fd8ec, 0 12px #2fd8ec, 0 -12px #2fd8ec; }
  .bubble-scene { min-height: 385px; perspective: none; }
  .bubble { width: 86px; font-size: 11px; padding: 10px; }
  .bubble.b1 { width: 86px; --bubble-x: -104px; --bubble-y: -100px; --bubble-z: 0px; }
  .bubble.b2 { width: 86px; --bubble-x: 89px; --bubble-y: -95px; --bubble-z: 0px; }
  .bubble.b3 { width: 86px; --bubble-x: -107px; --bubble-y: 53px; --bubble-z: 0px; }
  .bubble.b4 { width: 86px; --bubble-x: 107px; --bubble-y: 46px; --bubble-z: 0px; }
  .bubble.b5 { width: 86px; --bubble-x: 0px; --bubble-y: 126px; --bubble-z: 0px; }
  .bubble-core { width: 104px; height: 104px; }
  .bubble-scene[data-phase="plan"] .bubble { width: 72px; }
  .bubble-scene[data-phase="plan"] .bubble.b1 { --bubble-x: -112px; --bubble-y: -84px; }
  .bubble-scene[data-phase="plan"] .bubble.b2 { --bubble-x: -56px; --bubble-y: -42px; }
  .bubble-scene[data-phase="plan"] .bubble.b4 { --bubble-x: 56px; --bubble-y: 42px; }
  .bubble-scene[data-phase="plan"] .bubble.b5 { --bubble-x: 112px; --bubble-y: 84px; }
  .bubble-scene[data-phase="plan"]::after { width: 90%; left: 5%; transform: rotate(37deg) scaleX(1); }
  .mode-stage[data-mode="poster"]::before { font-size: 108px; }
  .mode-stage[data-mode="pixel"] .mode-word { font-size: clamp(22px, 8.4vw, 46px); transform: translate(-3px, -28px); }
  .pixel-art { right: 16%; bottom: 43%; scale: .42; }
}

@media (prefers-reduced-motion: reduce) {
  html:not(.motion-enabled) :is(.gravity-word, .mode-word, .pixel-art, .bubble-core, #story-dot::after) { animation: none !important; }
  html:not(.motion-enabled) :is(.bubble, .mode-word, .mode-stage::before, .mode-stage::after) { transition: none !important; }
}

/* v03 — the original logo dot opens a changing, layered creative universe. */
.ambient-scene {
  perspective: 1200px;
  background: radial-gradient(ellipse at 78% 28%, rgba(24,55,101,.24) 0, transparent 60%),
    linear-gradient(rgba(7,17,42,.35),rgba(7,17,42,.45)), url("brand-background-dark.svg") center / cover no-repeat;
  --cosmos-shift: 0px;
  --scene-depth: 0;
}

.ambient-orb {
  opacity: .92;
  background:
    radial-gradient(ellipse at 23% 13%, rgba(138, 215, 249, .55), transparent 37%),
    radial-gradient(circle at 30% 27%, #326794 0, #163d6d 28%, #0d234b 53%, #071326 72%, #030817 100%);
  box-shadow: inset 11px 9px 26px rgba(93, 213, 244, .2), inset -65px -55px 130px rgba(0, 3, 13, .9),
    0 0 2px rgba(164, 246, 255, .25), 0 0 75px rgba(27, 132, 184, .13), 0 70px 100px rgba(0, 4, 15, .5);
  transition: opacity 1.1s ease, background-color 1s ease, border-radius .8s ease;
}

.ambient-orb::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  border: 1px solid rgba(132, 236, 255, .18);
  background: repeating-linear-gradient(177deg, transparent 0 28px, rgba(143, 210, 239, .034) 29px 30px);
  box-shadow: inset 1px 1px 9px rgba(168, 244, 255, .18);
  opacity: .7;
}

.ambient-orb::after {
  content: "";
  position: absolute;
  inset: 7%;
  border: 1px solid rgba(116, 196, 235, .085);
  border-radius: 50%;
  transform: rotateY(62deg) rotateX(-14deg);
}

.ambient-orb.a1 {
  width: min(66vw, 940px);
  top: -4%;
  right: -18%;
  transform: translate3d(calc(var(--pointer-x) * -25px), calc(var(--pointer-y) * -20px + var(--cosmos-shift)), -35px);
}
.ambient-orb.a2 {
  width: min(31vw, 440px);
  top: 70%;
  left: -13%;
  opacity: .67;
  background: radial-gradient(circle at 26% 21%, #487691, #1e3c5a 24%, #0a1a33 58%, #020914 85%);
  transform: translate3d(calc(var(--pointer-x) * 36px), calc(var(--pointer-y) * 28px), 90px);
  filter: none;
}
.ambient-orb.a3 {
  width: min(11vw, 155px);
  top: 74%;
  right: 10%;
  opacity: .74;
  background: radial-gradient(circle at 23% 18%, #508ba7, #173758 34%, #07152d 70%);
  transform: translate3d(calc(var(--pointer-x) * 48px), calc(var(--pointer-y) * 36px), 130px);
}
.ambient-ring.r1 { border-color: rgba(101, 213, 244, .22); top: -9%; right: -19%; }
.ambient-ring.r2 { border-color: rgba(101, 213, 244, .13); }
.ambient-grid { opacity: .11; }

.space-stars { position: absolute; inset: 0; transform: translate3d(calc(var(--pointer-x) * -8px), calc(var(--pointer-y) * -6px), -100px); }
.space-star {
  position: absolute;
  left: var(--star-x);
  top: var(--star-y);
  width: var(--star-size);
  height: var(--star-size);
  border-radius: 50%;
  background: #d7efff;
  opacity: .5;
  box-shadow: 0 0 5px rgba(132, 223, 255, .55);
  animation: tiix-star-light 5.5s ease-in-out var(--star-delay) infinite;
}
.space-star.bright::before,
.space-star.bright::after { content: ""; position: absolute; background: rgba(203, 240, 255, .5); }
.space-star.bright::before { width: 1px; height: 9px; left: 50%; top: -3px; }
.space-star.bright::after { height: 1px; width: 9px; top: 50%; left: -3px; }
.space-nebula { position: absolute; width: 60vw; height: 48vh; border-radius: 50%; filter: blur(40px); opacity: .16; }
.space-nebula.n1 { right: 7%; top: 14%; background: radial-gradient(ellipse, #2378ae, transparent 66%); animation: tiix-nebula-drift 34s ease-in-out infinite; }
.space-nebula.n2 { left: -8%; bottom: -10%; background: radial-gradient(ellipse, #22527a, transparent 66%); animation: tiix-nebula-drift 28s ease-in-out -13s infinite reverse; }
.scene-ribbon {
  position: absolute;
  inset: -3%;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: .26;
  transform: translate3d(calc(var(--pointer-x) * 12px), calc(var(--pointer-y) * 12px), 0);
  transition: opacity .8s ease, filter .8s ease;
}
.scene-ribbon.top { background-image: url("ribbon-top.svg"); background-position: top right; }
.scene-ribbon.bottom { background-image: url("ribbon-bottom.svg"); background-position: bottom left; opacity: .17; }
.orbital-track { position: absolute; aspect-ratio: 1; border-radius: 50%; border: 1px solid rgba(105, 207, 239, .18); transform-style: preserve-3d; }
.orbital-track::after { content: ""; position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #7fbfd4; box-shadow: 0 0 15px rgba(136, 229, 255, .6); top: 15%; left: 14%; }
.orbital-track.t1 { width: 66vw; top: -9%; right: -23%; transform: rotateX(63deg) rotateY(-13deg) rotateZ(-21deg); animation: tiix-orbit-drift 42s linear infinite; }
.orbital-track.t2 { width: 27vw; left: -14%; bottom: -18%; transform: rotateX(57deg) rotateZ(24deg); opacity: .4; }
.space-type-shape { position: absolute; inset: 0; opacity: 0; transition: opacity .8s ease; }
.space-type-shape::before { content: "TiiX"; position: absolute; right: -4%; top: 14%; font: 800 50vw/.85 Montserrat,sans-serif; letter-spacing: -.09em; color: transparent; -webkit-text-stroke: 1px rgba(178, 224, 246, .14); transform: rotate(-12deg); }
.space-emblem { position: absolute; width: min(53vw,760px); aspect-ratio: 1; left: -15%; top: 29%; background: url("brand-watermark.svg") center / contain no-repeat; opacity: .09; filter: drop-shadow(12px 22px 9px rgba(0,4,18,.5)); transform: perspective(900px) rotateY(-22deg) rotateZ(-15deg) translate3d(calc(var(--pointer-x) * 13px),calc(var(--pointer-y) * 10px),0); }

.ambient-scene[data-theme="pixel"] .ambient-orb { border-radius: 4px; opacity: .19; background-image: linear-gradient(rgba(47,216,236,.22) 2px,transparent 2px),linear-gradient(90deg,rgba(47,216,236,.22) 2px,transparent 2px); background-size: 30px 30px; box-shadow: 18px 18px 0 rgba(142,107,255,.25); }
.ambient-scene[data-theme="pixel"] .space-star { border-radius: 0; width: 3px; height: 3px; animation-timing-function: steps(2,end); }
.ambient-scene[data-theme="pixel"] .scene-ribbon { opacity: .08; }
.ambient-scene[data-theme="poster"] .ambient-orb { opacity: .1; }
.ambient-scene[data-theme="poster"] .space-type-shape { opacity: 1; }
.ambient-scene[data-theme="poster"] .space-stars { opacity: .2; }
.ambient-scene[data-theme="poster"] .scene-ribbon { opacity: .14; }
.ambient-scene[data-theme="pop"] .ambient-orb.a1 { background: radial-gradient(circle at 25% 20%,#765fb2,#24376d 30%,#070d29 72%); }
.ambient-scene[data-theme="pop"] .space-star { background: #ff7fb0; box-shadow: 4px 4px rgba(47,216,236,.45); }
.ambient-scene[data-theme="pop"] .space-nebula.n1 { background: radial-gradient(ellipse,#8e6bff,transparent 65%); opacity: .24; }
.ambient-scene[data-theme="bubble"] .ambient-orb { opacity: .47; border: 1px solid rgba(167,243,255,.28); background: radial-gradient(ellipse at 29% 16%,rgba(207,249,255,.35),transparent 21%),radial-gradient(circle at 50% 94%,rgba(47,216,236,.23),transparent 44%),rgba(17,40,71,.3); box-shadow: inset 2px 6px 9px rgba(227,250,255,.13),inset -15px -24px 40px rgba(4,12,31,.6); }
.ambient-scene[data-theme="bubble"] .space-star { width: 5px; height: 5px; border: 1px solid rgba(176,246,255,.4); background: transparent; box-shadow: none; }
.ambient-scene[data-theme="blueprint"] .ambient-orb { opacity: .22; background: repeating-linear-gradient(0deg,transparent 0 32px,rgba(76,195,222,.17) 33px 34px),repeating-linear-gradient(90deg,transparent 0 32px,rgba(76,195,222,.17) 33px 34px); box-shadow: inset -20px -25px 65px rgba(2,9,22,.6); }
.ambient-scene[data-theme="blueprint"] .ambient-grid { width: 100%; height: 100%; inset: 0; transform: none; background-size: 36px 36px; opacity: .16; mask-image: radial-gradient(ellipse at 75% 55%,#000,transparent 72%); }
.ambient-scene[data-theme="blueprint"] .scene-ribbon { opacity: .09; }

#story-dot {
  height: 30px;
  background: url("dot.svg") 50% 31.485% / 137.931% 146.552% no-repeat;
  border-radius: 0;
  box-shadow: none;
  filter: drop-shadow(0 8px 10px rgba(0,7,21,.32));
}
#story-dot.is-launching { z-index: 45; }
#story-dot.is-copy-hidden { opacity: 0; }
#story-dot::after { inset: -16%; border-color: rgba(47,216,236,.18); border-radius: 50%; }
.dot-journey-active [data-logo-dot] img { opacity: 0; }
.motion-paused [data-logo-dot] img,
.motion-reduced [data-logo-dot] img { opacity: 1; }
#story-dot.is-poster { box-shadow: 3px 3px 0 rgba(232,248,255,.75); border: 1px solid rgba(213,245,252,.55); border-radius: 2px; }
#story-dot.is-bubble::after { inset: -34%; background: radial-gradient(ellipse at 20% 13%,rgba(255,255,255,.26),transparent 30%); border-color: rgba(205,252,255,.55); box-shadow: inset 0 -7px 11px rgba(47,216,236,.1); }
#story-dot.is-blueprint::after { inset: -25%; border-style: dashed; border-color: rgba(121,230,250,.6); }
#story-dot.is-blueprint::before { content: ""; position: absolute; inset: -40%; background: linear-gradient(transparent calc(50% - .5px),rgba(114,217,243,.6) 50%,transparent calc(50% + .5px)),linear-gradient(90deg,transparent calc(50% - .5px),rgba(114,217,243,.6) 50%,transparent calc(50% + .5px)); }

[data-heading-effect] { position: relative; isolation: isolate; text-shadow: 1px 2px #2c466b,3px 6px #172946,0 18px 32px rgba(0,5,20,.42); }
[data-heading-effect="hero"] .gravity-word,
[data-heading-effect="hero"].heading-text { text-shadow: 1px 2px #6c91aa,2px 4px #3a5a7c,3px 6px #28466b,5px 9px #1a3457,7px 13px #102741,0 25px 40px rgba(0,4,16,.52); }
[data-heading-effect="lab"] { text-shadow: 1px 1px #2fd8ec,3px 3px #485190,6px 7px #11213f,0 17px 28px rgba(0,5,21,.45); }
[data-heading-effect="lab"]::after { content: ""; position: absolute; width: 62px; height: 12px; right: 6%; bottom: -18px; background: repeating-linear-gradient(90deg,#2fd8ec 0 7px,transparent 7px 12px); opacity: .55; transform: skewX(-18deg); }
[data-heading-effect="services"] { transform: perspective(900px) rotateY(-4deg) rotateX(1deg); transform-origin: left center; text-shadow: 1px 1px #8eabc1,2px 2px #5c7797,3px 3px #375477,4px 5px #244365,6px 8px #123050,9px 12px #0a213e,0 24px 30px rgba(0,5,20,.48); }
[data-heading-effect="strategy"] { text-shadow: 0 -1px rgba(224,253,255,.72),1px 2px #4f859d,3px 5px #24445e,7px 10px #102a44,0 21px 36px rgba(0,4,19,.45); }
[data-heading-effect="strategy"]::after { content: ""; position: absolute; width: 108px; height: 108px; right: -4%; top: -15%; border: 1px solid rgba(163,239,252,.22); border-radius: 50%; box-shadow: inset 3px 5px 12px rgba(176,244,255,.1),0 15px 25px rgba(0,5,20,.2); background: radial-gradient(ellipse at 30% 20%,rgba(200,249,255,.16),transparent 30%); z-index: -1; }
[data-heading-effect="how"] { color: #effaff; -webkit-text-stroke: .5px rgba(141,222,241,.5); text-shadow: 1px 1px #087b98,3px 4px #183853,6px 9px #10243d,0 18px 25px rgba(0,4,18,.5); }
[data-heading-effect="how"]::after { content: ""; position: absolute; bottom: -19px; left: 0; width: 42%; height: 9px; border-top: 1px solid rgba(47,216,236,.5); background: repeating-linear-gradient(90deg,rgba(47,216,236,.4) 0 1px,transparent 1px 18px); }
[data-heading-effect="brief"] { text-shadow: 1px 2px #68c7da,3px 5px #236985,5px 9px #123751,8px 14px #0a213b,0 24px 38px rgba(0,4,18,.5); }
[data-heading-effect="lab"].is-visible { animation: tiix-lab-resolve 1.15s steps(3,end) both; }
[data-heading-effect="lab"].is-visible::after { animation: tiix-lab-pixel-wipe 1.4s steps(6,end) both; }
[data-heading-effect="services"].is-visible { animation: tiix-service-layer-entry 1.65s cubic-bezier(.2,.75,.22,1) both; }
[data-heading-effect="strategy"].is-visible { animation: tiix-strategy-glint 8s ease-in-out infinite; }
[data-heading-effect="strategy"].is-visible::after { animation: tiix-heading-bubble-float 8s ease-in-out infinite; }
[data-heading-effect="how"].is-visible { animation: tiix-blueprint-ink 2s ease-out both; }
[data-heading-effect="how"].is-visible::after { animation: tiix-blueprint-scan 1.8s cubic-bezier(.2,.65,.3,1) both; }
[data-scene="brief"].is-active [data-heading-effect="brief"] { animation: tiix-brief-lift 7s ease-in-out infinite; }
.how-section::before { content: ""; position: absolute; inset: 7% 0 8%; pointer-events: none; z-index: -1; background-image: linear-gradient(rgba(47,216,236,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(47,216,236,.045) 1px,transparent 1px); background-size: 38px 38px; mask-image: linear-gradient(90deg,transparent,#000 30%,#000 75%,transparent); }
.how-step { box-shadow: inset 0 1px rgba(47,216,236,.13),0 -15px 35px rgba(17,54,78,.1); }
.pixel-brand-label { display: none; position: absolute; left: 30px; top: 61px; bottom: auto; max-width: 75%; font-family: "Press Start 2P",monospace; font-size: 10px; line-height: 1.8; color: #e8fbff; text-shadow: 2px 2px #06132c; z-index: 4; }
.mode-stage[data-mode="pixel"] .pixel-brand-label { display: block; }
.mode-stage[data-mode="pixel"] .stage-caption { max-width: 30%; text-align: right; }
.mode-stage[data-mode="poster"] .mode-word { text-shadow: 2px 3px rgba(19,49,74,.12),5px 7px rgba(19,49,74,.09); }
.mode-stage[data-mode="poster"] { background: linear-gradient(120deg,rgba(224,247,248,.4),rgba(224,247,248,.1)),url("brand-background-light.svg") center / cover no-repeat; }

@keyframes tiix-star-light { 0%,100% { opacity: .26; } 50% { opacity: .84; } }
@keyframes tiix-nebula-drift { 0%,100% { transform: translate3d(0,0,0) scale(1); } 50% { transform: translate3d(5vw,-3vh,0) scale(1.13); } }
@keyframes tiix-orbit-drift { from { transform: rotateX(63deg) rotateY(-13deg) rotateZ(-21deg); } to { transform: rotateX(63deg) rotateY(-13deg) rotateZ(339deg); } }
@keyframes tiix-brief-lift { 0%,100% { translate: 0 0; } 50% { translate: 0 -6px; } }
@keyframes tiix-lab-resolve {
  0% { text-shadow: -2px 1px #2fd8ec,3px -1px #765aaf,6px 7px #11213f,0 17px 28px rgba(0,5,21,.45); }
  25% { text-shadow: 2px 1px #2fd8ec,-2px 3px #485190,6px 7px #11213f,0 17px 28px rgba(0,5,21,.45); }
  55%,100% { text-shadow: 1px 1px #2fd8ec,3px 3px #485190,6px 7px #11213f,0 17px 28px rgba(0,5,21,.45); }
}
@keyframes tiix-lab-pixel-wipe {
  0% { clip-path: inset(0 100% 0 0); translate: -8px 0; }
  75%,100% { clip-path: inset(0); translate: 0 0; }
}
@keyframes tiix-service-layer-entry {
  0% { transform: perspective(900px) rotateY(-12deg) rotateX(3deg) translateZ(-15px); translate: 0 7px; }
  100% { transform: perspective(900px) rotateY(-4deg) rotateX(1deg) translateZ(0); translate: 0 0; }
}
@keyframes tiix-service-layer-entry-mobile {
  0% { transform: none; translate: 0 3px; }
  100% { transform: none; translate: 0 0; }
}
@keyframes tiix-strategy-glint {
  0%,100% { text-shadow: 0 -1px rgba(224,253,255,.72),1px 2px #4f859d,3px 5px #24445e,7px 10px #102a44,0 21px 36px rgba(0,4,19,.45); }
  50% { text-shadow: 0 -1px #f0fcff,1px 2px #76bfd2,3px 5px #2f566e,7px 10px #102a44,0 21px 36px rgba(0,4,19,.45); }
}
@keyframes tiix-heading-bubble-float {
  0%,100% { translate: 0 0; scale: 1; }
  50% { translate: 3px -5px; scale: 1.035; }
}
@keyframes tiix-heading-bubble-float-mobile {
  0%,100% { translate: 0 0; scale: 1; }
  50% { translate: 1px -2px; scale: 1.015; }
}
@keyframes tiix-blueprint-ink {
  0% { color: #bfdfeb; -webkit-text-stroke-color: rgba(47,216,236,.8); }
  60% { color: #effaff; -webkit-text-stroke-color: rgba(214,247,255,.7); }
  100% { color: #effaff; -webkit-text-stroke-color: rgba(141,222,241,.5); }
}
@keyframes tiix-blueprint-scan {
  0% { clip-path: inset(0 100% 0 0); background-position: -18px 0; }
  100% { clip-path: inset(0); background-position: 0 0; }
}

.motion-paused :is(.space-star,.space-nebula,.orbital-track,[data-heading-effect]),
.motion-reduced :is(.space-star,.space-nebula,.orbital-track,[data-heading-effect]) { animation: none !important; }
.motion-paused [data-heading-effect]::before,
.motion-paused [data-heading-effect]::after,
.motion-reduced [data-heading-effect]::before,
.motion-reduced [data-heading-effect]::after { animation: none !important; }
.motion-paused :is(.ambient-orb,.scene-ribbon,.space-type-shape),
.motion-reduced :is(.ambient-orb,.scene-ribbon,.space-type-shape) { transition: none !important; }

@media (max-width: 760px) {
  .ambient-orb.a1 { width: 110vw; top: 7%; right: -62%; opacity: .82; }
  .ambient-orb.a2 { width: 58vw; top: 78%; left: -31%; opacity: .65; }
  .ambient-orb.a3 { display: block; width: 16vw; right: 3%; top: 75%; opacity: .55; }
  .orbital-track.t1 { width: 120vw; right: -79%; top: 8%; opacity: .6; }
  .orbital-track.t2 { display: none; }
  .scene-ribbon { inset: -1% -55%; opacity: .2; }
  .scene-ribbon.bottom { opacity: .12; }
  .space-nebula { filter: blur(24px); width: 100vw; }
  .space-star:nth-child(2n) { display: none; }
  .space-stars { opacity: .7; }
  .ambient-scene[data-theme="blueprint"] .ambient-grid { display: block; }
  #story-dot { height: 24px; }
  .space-emblem { width: 72vw; left: -36%; top: 44%; opacity: .075; }
  .pixel-brand-label { left: 20px; top: 46px; bottom: auto; font-size: 7px; max-width: 80%; line-height: 1.9; }
  .mode-stage[data-mode="pixel"] .stage-caption { max-width: 31%; font-size: 7px; }
  [data-heading-effect="services"] { transform: none; }
  [data-heading-effect="services"].is-visible { animation-name: tiix-service-layer-entry-mobile; }
  [data-heading-effect="strategy"].is-visible::after { animation-name: tiix-heading-bubble-float-mobile; }
  [data-heading-effect="strategy"]::after { width: 75px; height: 75px; right: -2%; top: -5%; }
  [data-heading-effect="lab"]::after { width: 47px; height: 8px; bottom: -12px; }
  [data-heading-effect="how"]::after { bottom: -14px; width: 50%; }
  [data-heading-effect="hero"] .gravity-word { text-shadow: 1px 2px #608ba5,2px 4px #305171,3px 6px #193959,4px 8px #102740,0 16px 25px rgba(0,4,17,.5); }
}

@media (prefers-reduced-motion: reduce) {
  html:not(.motion-enabled) :is(.space-star,.space-nebula,.orbital-track,[data-heading-effect]) { animation: none !important; }
  html:not(.motion-enabled) [data-heading-effect]::before,
  html:not(.motion-enabled) [data-heading-effect]::after { animation: none !important; }
  html:not(.motion-enabled) :is(.ambient-orb,.scene-ribbon,.space-type-shape) { transition: none !important; }
}

/* The brand line accompanies the original storytelling dot in native 8-bit type. */
#dot-speech {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 24;
  width: max-content;
  max-width: 244px;
  padding: 11px 15px;
  border: 1px solid rgba(130, 237, 252, .42);
  border-radius: 16px 16px 16px 5px;
  background: linear-gradient(145deg, rgba(30, 63, 98, .97), rgba(10, 26, 54, .97));
  box-shadow: inset 0 1px rgba(230, 253, 255, .13), 0 10px 25px rgba(0, 6, 22, .25);
  color: #e9fcff;
  font: 400 10px/1.8 "Press Start 2P", ui-monospace, monospace;
  font-synthesis: none;
  letter-spacing: 0;
  text-align: left;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(var(--speech-x, -300px), var(--speech-y, -300px), 0);
  transition: opacity .2s ease, visibility .2s ease;
}
#dot-speech.is-shown { opacity: 1; visibility: visible; }
#dot-speech span { display: block; }
#dot-speech.is-shown:not(.is-static) span { animation: tiix-speech-ink 6s ease-in-out infinite; }
#dot-speech::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  background: #122d50;
  border-bottom: 1px solid rgba(130, 237, 252, .42);
  border-right: 1px solid rgba(130, 237, 252, .42);
  transform: rotate(45deg);
}
#dot-speech[data-side="right"]::before { left: -5px; top: var(--speech-tail-y, 18px); transform: rotate(135deg); }
#dot-speech[data-side="left"]::before { right: -5px; top: var(--speech-tail-y, 18px); transform: rotate(-45deg); }
#dot-speech[data-side="above"]::before { bottom: -5px; left: var(--speech-tail-x, 22px); }
#dot-speech[data-side="below"]::before { top: -5px; left: var(--speech-tail-x, 22px); transform: rotate(225deg); }
#dot-speech.is-static::before { display: none; }
.motion-paused #dot-speech,
.motion-reduced #dot-speech { position: absolute; transition: none; }
.bubble-legend {
  font-family: "Press Start 2P", ui-monospace, monospace;
  font-weight: 400;
  font-synthesis: none;
  font-size: 9px;
  line-height: 1.8;
  letter-spacing: 0;
  padding-inline: 8px;
  max-width: 100%;
  white-space: normal;
  text-shadow: 1px 1px #0c1e37;
}

.response-highlight { position: relative; isolation: isolate; }
[data-scene="how"].is-active .response-highlight { animation: tiix-response-glow 4.8s ease-in-out infinite; }
.response-highlight::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #2fd8ec;
  box-shadow: 0 0 7px rgba(47, 216, 236, .65);
  right: -9px;
  top: 50%;
  opacity: .7;
}
[data-scene="how"].is-active .response-highlight::after { animation: tiix-response-clock 4.8s ease-in-out infinite; }
@keyframes tiix-speech-ink {
  0%,100% { text-shadow: 0 0 0 rgba(47,216,236,0); translate: 0 0; }
  45% { text-shadow: 0 0 8px rgba(115,230,246,.36); translate: 0 -1px; }
}
@keyframes tiix-response-glow {
  0%,100% { text-shadow: 0 0 0 rgba(47,216,236,0); }
  50% { text-shadow: 0 0 16px rgba(47,216,236,.35); }
}
@keyframes tiix-response-clock {
  0%,100% { translate: 0 0; scale: .8; opacity: .45; }
  25% { translate: 1px -3px; }
  50% { translate: 3px 0; scale: 1; opacity: .9; }
  75% { translate: 1px 3px; }
}
.motion-paused #dot-speech span,
.motion-reduced #dot-speech span,
.motion-paused .response-highlight,
.motion-reduced .response-highlight,
.motion-paused .response-highlight::after,
.motion-reduced .response-highlight::after { animation: none !important; }
@media (max-width: 760px) {
  #dot-speech { max-width: 190px; padding: 9px 12px; font-size: 8px; line-height: 1.75; border-radius: 13px 13px 13px 4px; }
  .bubble-legend { font-size: 8px; line-height: 1.9; }
  .response-highlight::after { width: 3px; height: 3px; right: -7px; }
}
@media (prefers-reduced-motion: reduce) {
  html:not(.motion-enabled) #dot-speech { position: absolute; transition: none; }
  html:not(.motion-enabled) #dot-speech span,
  html:not(.motion-enabled) .response-highlight,
  html:not(.motion-enabled) .response-highlight::after { animation: none !important; }
}

/* TiiX CSS source: assets/v05.css */
/* V05: colour carries the strategy from the brief to the plan. */
.bubble.b1{--orb-base:#137b9d;--orb-deep:#07466d;--orb-rim:#2fd8ec}
.bubble.b2{--orb-base:#9d3563;--orb-deep:#632044;--orb-rim:#ff7fae}
.bubble.b3{--orb-base:#906238;--orb-deep:#513a23;--orb-rim:#dba363}
.bubble.b4{--orb-base:#6844a4;--orb-deep:#3a235a;--orb-rim:#b4a1ff}
.bubble.b5{--orb-base:#226c61;--orb-deep:#133c39;--orb-rim:#6ce4bd}
.bubble{color:#fffaf5;font-weight:700;border-color:var(--orb-rim);background:radial-gradient(ellipse at 28% 17%,#ffffffa8,transparent 23%),radial-gradient(ellipse at 58% 113%,var(--orb-rim),transparent 56%),radial-gradient(ellipse at 36% 35%,var(--orb-base),var(--orb-deep) 82%);box-shadow:inset 2px 3px 8px #ffffff45,inset -7px -13px 25px #03102155,0 24px 35px #020b2640,0 0 23px color-mix(in srgb,var(--orb-rim) 18%,transparent)}
.bubble-scene[data-phase="plan"] .bubble{border-color:var(--orb-rim)}
.bubble span{text-shadow:0 2px 5px #07172d80}
.bubble-core{border-color:#dba363bb;color:#ffe0b5;background:radial-gradient(circle at 25% 18%,#ffdfaa55,transparent 30%),radial-gradient(ellipse at 58% 105%,#dba36370,transparent 55%),radial-gradient(circle at 35% 35%,#735031,#362c28 82%);box-shadow:inset 2px 3px 8px #fff1c929,inset -7px -12px 20px #00102144,0 0 45px #dba3631c}
.bubble-core small{color:#f3d9b8}
.strategy-steps span{font-weight:800;color:#071b35;letter-spacing:.08em;padding:10px 15px;border:0;box-shadow:0 7px 18px #00102135}
.strategy-steps span:nth-child(1){background:#2fd8ec}
.strategy-steps span:nth-child(2){background:#ff7fae}
.strategy-steps span:nth-child(3){background:#dba363}
.plan-response{padding:13px 18px;border:1px solid #dba36370;border-radius:13px;background:linear-gradient(120deg,#dba36320,#dba36306);color:#ffdcae;font-size:13px;font-weight:750;line-height:1.65;box-shadow:inset 0 1px #ffe9b812}
.contact-promise{display:grid;gap:12px;margin-top:8px}
.contact-promise>span:first-child{color:#d6e6f4}
@media(max-width:760px){.strategy-steps{gap:8px}.strategy-steps span{padding:10px 12px;font-size:9px}.plan-response{padding:13px 16px;font-size:12px}.bubble-core small{font-size:7px}}

/* TiiX CSS source: assets/v07.css */
/* V07 — the dot makes the whole website a living creative playground. */
:root{--pixel-font:"Press Start 2P",ui-monospace,monospace}
.hero h1,.v07-pixel,.how-step h3,.how-step .eyebrow,.journey-legend,.response-promise,.strategy-steps,.pixel-wayfinder{font-family:var(--pixel-font);font-weight:400;font-synthesis:none;letter-spacing:0}
.hero h1{font-size:clamp(28px,4.3vw,64px);line-height:1.48;max-width:1280px;margin-bottom:30px}
.hero .gravity-word{animation:tiix-v07-type-hop 6s steps(5,end) infinite;text-shadow:3px 3px #197b99,6px 6px #142951,0 16px 35px #0009}
.hero .gravity-word:nth-of-type(2){animation-delay:-2.4s}
.hero{padding-top:158px;padding-bottom:160px;min-height:100svh}
.hero-copy-playground{position:relative;max-width:850px;margin-top:12px}
.hero-copy-playground .section-intro{max-width:850px;margin-bottom:17px}
.idea-chips{display:flex;align-items:center;flex-wrap:wrap;gap:14px;line-height:1.65}
.idea-chip{display:inline-block;position:relative;max-width:100%;isolation:isolate;font-size:clamp(14px,1.3vw,19px);font-weight:750;color:#eef9ff;padding:10px 14px}
.idea-chip.pixel{font-family:var(--pixel-font);font-size:clamp(10px,.87vw,13px);font-weight:400;color:#b5f6ff;border:2px solid #2fd8ec80;background:linear-gradient(90deg,#2fd8ec17,#01213745);box-shadow:5px 5px 0 #2fd8ec20;clip-path:polygon(0 6px,6px 6px,6px 0,calc(100% - 6px) 0,calc(100% - 6px) 6px,100% 6px,100% calc(100% - 6px),calc(100% - 6px) calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,6px calc(100% - 6px),0 calc(100% - 6px))}
.idea-chip.pop{color:#071b35;background:#ff7fae;border:2px solid #ffbcd6;transform:rotate(-3deg);box-shadow:5px 6px 0 #7550a980;line-height:1.2}
.idea-chip.pop::before{content:"";position:absolute;inset:3px;background:radial-gradient(#06193633 1px,transparent 1.5px) 0 0/6px 6px;z-index:-1}
.idea-chip.bubble{border-radius:28px 28px 28px 7px;border:1px solid #b4a1ff99;background:radial-gradient(ellipse at 28% 0,#e1cfff38,transparent 65%),linear-gradient(130deg,#b4a1ff24,#2fd8ec20);box-shadow:inset 0 2px #ffffff2b,0 9px 20px #0002;color:#e9e2ff}
.idea-chips.is-visible .idea-chip.pixel{animation:tiix-v07-pixel-pulse 4.4s steps(3,end) infinite}
.idea-chips.is-visible .idea-chip.pop{animation:tiix-v07-pop-tilt 5.2s ease-in-out -.8s infinite}
.idea-chips.is-visible .idea-chip.bubble{animation:tiix-v07-bubble-hover 6s ease-in-out -2s infinite}
.hero-audience{display:block;flex-basis:100%;margin-top:6px;color:#d4e7f7;font-size:clamp(15px,1.6vw,21px)}
.hero-unity{font-size:clamp(16px,1.5vw,22px);font-weight:650;margin-bottom:28px;color:#f6d9b6;line-height:1.65}
.bubble-cta{border:1px solid #90f1ffb3!important;border-bottom-width:1px!important;padding:15px 23px!important;border-radius:33px 33px 33px 9px;background:radial-gradient(ellipse at 24% 0,#fff5,transparent 54%),linear-gradient(135deg,#27cee733,#2fd8ec0e);box-shadow:inset 0 2px #ffffff2b,0 15px 34px #00698020;position:relative;animation:tiix-v07-cta-breathe 4s ease-in-out infinite;transition:background .25s,box-shadow .25s}
.bubble-cta::after{content:"";position:absolute;right:-14px;top:-12px;width:10px;height:10px;border:1px solid #d8fcff90;border-radius:50%;background:#2fd8ec33;animation:tiix-v07-bubble-pop 4s ease-in-out infinite}
.bubble-cta:hover{background:linear-gradient(135deg,#27cee74b,#2fd8ec22);box-shadow:inset 0 2px #fff4,0 14px 38px #00698030}
.cta-dot{display:inline-block;flex:none;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 28% 20%,#fff,#2fd8ec 42%,#087393 90%);box-shadow:0 0 11px #2fd8ec50}
.pixel-wayfinder{display:inline-flex;gap:18px;align-items:center;font-size:10px;line-height:1.8;color:#f4dcb2}
.pixel-wayfinder .wayfinder-arrow{position:relative;color:#2fd8ec;font-size:25px;line-height:1;animation:tiix-v07-waypoint 1.8s steps(4,end) infinite}
.pixel-wayfinder .wayfinder-arrow::after{content:none!important}
.wayfinder-dot{display:block;width:9px;height:9px;background:#2fd8ec;box-shadow:4px 4px 0 #0d5367,17px 1px 0 -3px #2fd8ec55,27px 1px 0 -3px #2fd8ec35}
.hero-baseline{justify-content:flex-start}
.lab-heading h2.v07-pixel{font-size:clamp(24px,4.2vw,58px);line-height:1.45;letter-spacing:0}
.lab-heading .section-intro{border-left:3px solid #ff7fae;padding:8px 0 8px 24px;background:linear-gradient(90deg,#ff7fae0c,transparent);line-height:1.75}
.lab-heading .eyebrow{color:#ff9bc1}
.lab-status{border-color:#b4a1ff70;color:#d8cdff;background:#b4a1ff0d}
.lab-stage-wrap{border-color:#b4a1ff50;box-shadow:0 30px 80px #0005,inset 0 1px #d7dcff16}
.mode-buttons button{transition:background .3s,color .3s,box-shadow .3s;position:relative}
.mode-buttons button[aria-pressed="true"]{box-shadow:0 0 18px #2fd8ec30}
.brand-motion-heading h3{font-size:clamp(26px,3vw,43px)}
.film-media video::-webkit-media-controls{display:none!important}
.motion-rail-note,.motion-rail-progress,.motion-rail-line{display:none}
.film-card{transition:box-shadow .6s,border-color .6s}
.brand-films.is-visible .film-card{animation:tiix-v07-card-glow 7s ease-in-out infinite}
.brand-films.is-visible .film-card:nth-child(2){animation-delay:-2.33s}
.brand-films.is-visible .film-card:nth-child(3){animation-delay:-4.66s}
.about-section{background:radial-gradient(ellipse at 20% 45%,#5a37a020,transparent 62%),linear-gradient(120deg,#01122b44,#092f431c);min-height:770px}
.about-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:80px;align-items:center}
.about-copy{max-width:750px}
.about-copy h2{font-size:clamp(40px,5.3vw,72px);line-height:1.13}
.about-copy h2.v07-pixel{font-size:clamp(21px,2.6vw,37px);line-height:1.65}
.about-copy>.bubble-cta{margin-top:28px}
.about-copy .section-intro{font-size:clamp(18px,1.7vw,23px);max-width:680px}
.about-copy>p:not(.eyebrow):not(.section-intro){color:#c9daee;line-height:1.8;max-width:640px;font-size:15px}
.about-copy .eyebrow{color:#d4c4ff}
.about-copy .about-credibility{font-size:13px!important;line-height:1.85!important;color:#e1d6ff!important;padding:17px 20px;border:1px solid #b4a1ff50;border-radius:15px 15px 15px 5px;background:linear-gradient(135deg,#b4a1ff16,#2fd8ec08);box-shadow:inset 0 1px #fff1;margin:0 0 24px}
.about-principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;list-style:none;padding:0;margin:30px 0 0}
.about-principles li{position:relative;padding-top:17px;border-top:2px solid var(--principle-colour,#2fd8ec)}
.about-principles h3{font-size:13px;line-height:1.6;color:var(--principle-colour,#2fd8ec);letter-spacing:0;font-weight:800;margin-bottom:8px}
.about-principles p{font-size:11px;line-height:1.8;color:#c9daee;margin:0}
.about-principle--pixel{--principle-colour:#2fd8ec}.about-principle--pop{--principle-colour:#ff7fae}.about-principle--bubble{--principle-colour:#dba363}
.about-principles li::before{content:"";position:absolute;width:7px;height:7px;top:-5px;left:0;background:var(--principle-colour);box-shadow:0 0 12px color-mix(in srgb,var(--principle-colour) 30%,transparent)}
.about-principle--pop::before{rotate:45deg}.about-principle--bubble::before{border-radius:50%}
[data-heading-effect="about"]{text-shadow:2px 3px #6c4795,5px 6px #242844,0 20px 32px #0005}
[data-heading-effect="about"].is-visible{animation:tiix-v07-about-ink 7s ease-in-out infinite}
.about-visual{position:relative;aspect-ratio:1;max-width:430px;width:100%;justify-self:center;isolation:isolate}
.about-visual::before{content:"";position:absolute;inset:13%;border-radius:50%;background:radial-gradient(circle,#2fd8ec18,transparent 69%);filter:blur(16px)}
.about-orbit{position:absolute;inset:10%;border:1px solid #a8dffc50;border-radius:50%;transform:rotateX(56deg) rotateY(-19deg);box-shadow:0 0 20px #2fd8ec0b}
.about-orbit-two{inset:19%;border-color:#ff7fae65;transform:rotateX(-29deg) rotateY(55deg)}
.about-orbit-three{inset:28%;border-color:#dba36370;transform:rotateX(40deg) rotateY(30deg)}
.about-orbit::before{content:"";position:absolute;width:15px;height:15px;left:50%;top:-8px;border-radius:50%;background:radial-gradient(circle at 29% 22%,#fff,#2fd8ec 38%,#066b91 90%);box-shadow:0 0 17px #2fd8ec45}
.about-orbit-two::before{background:radial-gradient(circle at 29% 22%,#fff,#ff7fae 38%,#912462 90%);border-radius:2px}
.about-orbit-three::before{background:radial-gradient(circle at 29% 22%,#fff,#dba363 38%,#805128 90%);clip-path:polygon(50% 0,62% 32%,100% 36%,73% 59%,80% 100%,50% 77%,20% 100%,27% 59%,0 36%,38% 32%)}
.about-visual.is-visible .about-orbit-one{animation:tiix-v07-about-orbit-one 18s linear infinite}
.about-visual.is-visible .about-orbit-two{animation:tiix-v07-about-orbit-two 22s linear reverse infinite}
.about-visual.is-visible .about-orbit-three{animation:tiix-v07-about-orbit-three 14s linear infinite}
.about-point{position:absolute;inset:33%;border-radius:50%;background:radial-gradient(circle at 29% 18%,#d3efff25,transparent 48%),linear-gradient(140deg,#243458cc,#0a183dcc);border:1px solid #a8dffc42;box-shadow:inset -8px -14px 20px #0004,0 28px 45px #0003}
.about-point::before{content:"";position:absolute;inset:23% 17%;background:url("brand-watermark.svg") center/contain no-repeat;opacity:.65}
.about-point .dot-anchor{position:absolute;right:10%;bottom:25%;width:18px;height:18px}
.service-row{isolation:isolate;padding-top:3px;padding-bottom:28px;margin-bottom:23px}
.service-row .service-need{display:inline-block;position:relative;z-index:1;margin:0 0 8px;color:var(--service-accent);font-size:11px;line-height:1.5;font-weight:750;letter-spacing:.015em;padding:5px 9px;border:1px solid color-mix(in srgb,var(--service-accent) 30%,transparent);border-radius:8px;background:color-mix(in srgb,var(--service-accent) 6%,transparent)}
.service-row h3{position:relative;z-index:1}
.service-row>p:last-child{position:relative;z-index:1}
.service-symbol{top:7px;background:linear-gradient(135deg,color-mix(in srgb,var(--service-accent) 17%,transparent),#ffffff02);border:1px solid color-mix(in srgb,var(--service-accent) 35%,transparent);box-shadow:0 8px 22px #0002}
.service-effect{pointer-events:none;position:absolute;left:-18px;top:-11px;width:80px;height:80px;z-index:-1;color:var(--service-accent)}
.service-effect i{position:absolute;left:38px;top:38px;width:4px;height:4px;border-radius:50%;background:currentColor;opacity:0;transform:rotate(calc(var(--particle) * 51deg)) translateY(-28px)}
.service-row.is-visible .service-effect i{animation:tiix-v07-service-spark 4.7s ease-out infinite;animation-delay:calc(var(--particle) * .05s)}
.service-1.is-visible .service-symbol{animation:tiix-v07-concept-turn 8s ease-in-out infinite}
.service-2.is-visible .service-symbol svg{animation:tiix-v07-frame-jump 3.7s steps(4,end) infinite}
.service-2 .service-effect i{border-radius:0;width:7px;height:4px}
.service-3 .service-effect i{border:1px solid currentColor;background:transparent;width:9px;height:9px}
.service-3.is-visible .service-effect i{animation-name:tiix-v07-chat-burst;animation-duration:5.2s}
.service-3.is-visible .service-symbol{animation:tiix-v07-chat-hover 5s ease-in-out infinite}
.service-4 .service-effect{border:1px dashed #b4a1ff40;border-radius:50%;inset:-13px auto auto -20px;width:83px;height:83px}
.service-4.is-visible .service-effect{animation:tiix-v07-network-orbit 13s linear infinite}
.service-4.is-visible .service-effect i{opacity:.5;animation:tiix-v07-node-signal 3s ease-in-out infinite;animation-delay:calc(var(--particle) * -.43s)}
.service-5 .service-effect i{background:none;border:1px solid currentColor;width:16px;height:16px;border-radius:50%;left:30px;top:30px;transform:none}
.service-5.is-visible .service-effect i{animation:tiix-v07-signal-wave 4s ease-out infinite;animation-delay:calc(var(--particle) * .4s)}
.service-6 .service-effect i{width:6px;height:9px;border-radius:0;clip-path:polygon(0 0,100% 30%,65% 100%,0 65%)}
.service-6.is-visible .service-effect i{animation-duration:5.8s}
.service-6.is-visible .service-symbol{animation:tiix-v07-event-pop 5.8s ease-in-out infinite}
.bubble-scene{overflow:visible}
.bubble-scene .bubble{z-index:2}
.bubble-scene.is-visible .bubble{animation:tiix-v07-strategy-float 6s ease-in-out infinite}
.bubble-scene.is-visible .b2{animation-delay:-1.5s}
.bubble-scene.is-visible .b3{animation-delay:-3s}
.bubble-scene.is-visible .b4{animation-delay:-4.5s}
.bubble-scene.is-visible .b5{animation-delay:-2.3s}
.bubble.b1{border-radius:8px;font-family:var(--pixel-font);font-size:9px;font-weight:400;line-height:1.65;background:repeating-linear-gradient(0deg,#2fd8ec08 0 2px,transparent 2px 5px),linear-gradient(145deg,#154b7d,#051f3e);box-shadow:5px 5px 0 #2fd8ec25,inset 0 0 0 4px #2fd8ec10;clip-path:polygon(0 10px,10px 10px,10px 0,calc(100% - 10px) 0,calc(100% - 10px) 10px,100% 10px,100% calc(100% - 10px),calc(100% - 10px) calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,10px calc(100% - 10px),0 calc(100% - 10px))}
.bubble.b1::before{border-radius:0;transform:none;left:22%;top:14%;height:7px;width:13px;border:0;background:#2fd8ec44;box-shadow:18px 0 #2fd8ec44,36px 0 #2fd8ec44}
.bubble.b2{border-width:1px;border-radius:46% 54% 57% 43%;background:radial-gradient(ellipse at 28% 17%,#ffe4f8aa,transparent 26%),radial-gradient(ellipse at 58% 105%,#ff7fae66,transparent 61%),radial-gradient(ellipse at 35% 35%,#7c2b59,#441636);box-shadow:inset 3px 4px 9px #fff3,inset -9px -13px 24px #0004,0 0 23px #ff7fae20}
.bubble.b3{background:radial-gradient(#18264370 1px,transparent 1.4px) 0 0/6px 6px,#dba363;color:#071b35;border:3px solid #f7d092;border-radius:44% 56% 42% 58%;box-shadow:5px 5px 0 #724575,0 17px 28px #0003;font-weight:850;transform-origin:center}
.bubble.b3 span{text-shadow:1px 1px #ffe1b5;rotate:-6deg}
.bubble.b3::before{border-top:3px solid #fff8;left:20%;top:14%;width:31%;height:12%}
.bubble.b4{border-radius:45% 55% 50% 50%;border:1px solid #e5cbff;background:radial-gradient(ellipse at 28% 20%,#f5ffffbb,transparent 22%),conic-gradient(from 35deg,#6852a1,#497dac,#90cfcc,#bda6db,#8368aa,#424785,#6852a1);box-shadow:inset 3px 3px 8px #fff8,inset -7px -12px 20px #0006,0 0 21px #b4a1ff25;font-style:italic}
.bubble.b4::before{width:125%;height:27%;left:-13%;top:38%;border:2px solid #dfd4ff80;transform:rotate(-23deg);box-shadow:0 2px 0 #482e6e80}
.bubble.b5{border-radius:50%;border:1px solid #6ce4bd;background:linear-gradient(#6ce4bd15 1px,transparent 1px),linear-gradient(90deg,#6ce4bd15 1px,transparent 1px),radial-gradient(circle,#0d4a42,#062524);background-size:14px 14px,14px 14px,auto;box-shadow:inset 0 0 13px #6ce4bd20,0 0 24px #6ce4bd0d;font-family:var(--pixel-font);font-size:8px;line-height:1.6;font-weight:400}
.bubble.b5::before{left:12%;top:12%;width:76%;height:76%;border:1px dashed #6ce4bd55;border-radius:50%;transform:rotate(20deg)}
.strategy-orbit{position:absolute;inset:12% 14% 22%;z-index:1;border:1px dashed #b4a1ff30;border-radius:50%;pointer-events:none;opacity:.8}
.strategy-orbit-dot{position:absolute;left:50%;top:-8px;width:17px;height:17px;border-radius:50%;background:radial-gradient(circle at 27% 24%,#fff,#2fd8ec 35%,#036585 90%);box-shadow:0 0 18px #2fd8ec50}
.bubble-scene.is-visible .strategy-orbit{animation:tiix-v07-network-orbit 15s linear infinite}
.bubble-scene[data-phase="plan"] .strategy-orbit{border-style:solid;border-color:#dba36333}
.strategy-steps{font-size:9px;line-height:1.6;gap:12px;flex-wrap:wrap}
.strategy-steps span{border-radius:7px;padding:12px 14px;position:relative}
.strategy-steps span:not(:last-child)::after{content:"›";position:absolute;right:-11px;color:#e8f6ff;top:12px}
.how-heading h2.v07-pixel,.brief-section h2.v07-pixel{font-size:clamp(25px,4.1vw,59px);line-height:1.5;letter-spacing:0}
.how-step h3{font-size:clamp(12px,1.15vw,16px);line-height:1.8;color:var(--journey-colour)}
.how-step .eyebrow{font-size:9px;line-height:1.8;border-radius:8px;padding:8px 10px}
.journey-legend{font-size:9px;line-height:1.8}
.how-step.is-visible{animation:tiix-v07-path-colour 6s ease-in-out infinite}
.how-step:nth-child(2){animation-delay:-1.5s}.how-step:nth-child(3){animation-delay:-3s}.how-step:nth-child(4){animation-delay:-4.5s}
.how-footer .contract-line{font-size:clamp(13px,1.65vw,22px);line-height:1.85;max-width:610px;color:#d5f8ff}
.response-promise{font-size:11px;line-height:1.95;max-width:470px}
.response-highlight,.plan-response{font-family:var(--pixel-font);font-weight:400;letter-spacing:0;font-size:10px;line-height:1.9;padding:18px 19px;border-radius:11px;text-wrap:pretty}
.response-highlight{color:#cefcff;background:linear-gradient(125deg,#2fd8ec20,#122c4940)}
.plan-response{color:#ffe1b9;background:linear-gradient(125deg,#dba36325,#dba36308)}
[data-scene="how"].is-active .response-highlight{animation:tiix-v07-response-pop 6s ease-in-out infinite}
[data-scene="how"].is-active .plan-response{animation:tiix-v07-response-pop 6s ease-in-out -3s infinite}
.response-highlight::after,.plan-response::after{content:"";position:absolute;width:8px;height:8px;right:-6px;top:11px;border-radius:1px;background:currentColor;box-shadow:13px -12px 0 -2px currentColor,-6px -18px 0 -2px currentColor;opacity:0}
.plan-response{position:relative}
[data-scene="how"].is-active :is(.response-highlight,.plan-response)::after{animation:tiix-v07-promise-sparks 6s ease-out infinite}
[data-scene="how"].is-active .plan-response::after{animation-delay:-3s}
.brief-contact{padding-bottom:25px}
.ambient-orb.a1{animation:tiix-v07-space-drift 28s ease-in-out infinite}
.ambient-orb.a2{animation:tiix-v07-space-drift 34s ease-in-out -9s infinite}
.ambient-orb.a3{animation:tiix-v07-space-drift 23s ease-in-out -15s infinite}
.ambient-scene[data-theme="pop"] .space-emblem{opacity:.12}

@keyframes tiix-v07-type-hop{0%,44%,100%{translate:0 0}48%,56%{translate:0 -3px}60%,66%{translate:0 1px}}
@keyframes tiix-v07-pixel-pulse{0%,100%{border-color:#2fd8ec65;box-shadow:5px 5px 0 #2fd8ec20}50%{border-color:#a7f4ff;box-shadow:5px 5px 0 #2fd8ec45}}
@keyframes tiix-v07-pop-tilt{0%,100%{rotate:0deg;translate:0 0}50%{rotate:3deg;translate:0 -3px}}
@keyframes tiix-v07-bubble-hover{0%,100%{translate:0 0}50%{translate:0 -5px}}
@keyframes tiix-v07-cta-breathe{0%,100%{translate:0 0;box-shadow:inset 0 2px #ffffff2b,0 15px 34px #00698020}50%{translate:0 -3px;box-shadow:inset 0 2px #ffffff40,0 18px 40px #00698040}}
@keyframes tiix-v07-bubble-pop{0%,45%{scale:.7;opacity:.4;translate:0 0}70%{scale:1.2;opacity:.9;translate:2px -7px}85%,100%{scale:1.55;opacity:0;translate:4px -12px}}
@keyframes tiix-v07-waypoint{0%,100%{translate:0 0}50%{translate:0 7px}}
@keyframes tiix-v07-card-glow{0%,100%{box-shadow:0 20px 60px #0005,inset 0 0 0 1px var(--card-colour)}50%{box-shadow:0 20px 55px #0005,0 0 23px color-mix(in srgb,var(--card-colour) 19%,transparent),inset 0 0 0 1px var(--card-colour)}}
@keyframes tiix-v07-about-ink{0%,100%{text-shadow:2px 3px #6c4795,5px 6px #242844,0 20px 32px #0005}50%{text-shadow:2px 3px #895cac,5px 6px #242844,0 20px 32px #0005}}
@keyframes tiix-v07-about-orbit-one{from{transform:rotateX(56deg) rotateY(-19deg) rotateZ(0)}to{transform:rotateX(56deg) rotateY(-19deg) rotateZ(360deg)}}
@keyframes tiix-v07-about-orbit-two{from{transform:rotateX(-29deg) rotateY(55deg) rotateZ(0)}to{transform:rotateX(-29deg) rotateY(55deg) rotateZ(360deg)}}
@keyframes tiix-v07-about-orbit-three{from{transform:rotateX(40deg) rotateY(30deg) rotateZ(0)}to{transform:rotateX(40deg) rotateY(30deg) rotateZ(360deg)}}
@keyframes tiix-v07-service-spark{0%,28%,100%{opacity:0;transform:rotate(calc(var(--particle) * 51deg)) translateY(-20px) scale(.35)}35%{opacity:.65}52%{opacity:0;transform:rotate(calc(var(--particle) * 51deg)) translateY(-44px) scale(1.1)}}
@keyframes tiix-v07-concept-turn{0%,38%,100%{rotate:0}45%{rotate:-9deg}57%{rotate:6deg}66%{rotate:0}}
@keyframes tiix-v07-frame-jump{0%,100%{translate:0 0}40%{translate:2px -2px}70%{translate:-1px 1px}}
@keyframes tiix-v07-chat-burst{0%,20%,100%{opacity:0;transform:rotate(calc(var(--particle) * 51deg)) translateY(-19px) scale(.3)}32%{opacity:.65}56%{opacity:0;transform:rotate(calc(var(--particle) * 51deg)) translateY(-44px) scale(1.6)}}
@keyframes tiix-v07-chat-hover{0%,100%{translate:0 0}50%{translate:0 -3px}}
@keyframes tiix-v07-network-orbit{from{rotate:0deg}to{rotate:360deg}}
@keyframes tiix-v07-node-signal{0%,100%{opacity:.2}50%{opacity:.8}}
@keyframes tiix-v07-signal-wave{0%{scale:.2;opacity:.55}65%,100%{scale:3;opacity:0}}
@keyframes tiix-v07-event-pop{0%,28%,100%{scale:1;rotate:0}34%{scale:1.08;rotate:-5deg}42%{scale:1;rotate:2deg}50%{rotate:0}}
@keyframes tiix-v07-strategy-float{0%,100%{translate:0 0}50%{translate:0 -4px}}
@keyframes tiix-v07-path-colour{0%,100%{box-shadow:inset 0 1px #ffffff16,0 18px 30px #00102133}50%{box-shadow:inset 0 1px #ffffff30,0 18px 30px #00102133,0 0 22px var(--journey-wash)}}
@keyframes tiix-v07-response-pop{0%,28%,100%{scale:1;translate:0 0}34%{scale:1.025;translate:0 -3px}45%{scale:1;translate:0 0}}
@keyframes tiix-v07-promise-sparks{0%,28%,100%{opacity:0;scale:.4;translate:0 0}35%{opacity:.75;scale:1}48%{opacity:0;scale:1.15;translate:6px -6px}}
@keyframes tiix-v07-space-drift{0%,100%{translate:0 0}50%{translate:10px -12px}}
@keyframes tiix-v07-rail-dot{0%,100%{left:14px;background:#2fd8ec}35%{left:calc(50% - 8px);background:#ff7fae}70%{left:calc(100% - 30px);background:#dba363}}

@media(max-width:1100px){.hero h1{font-size:clamp(28px,4.1vw,45px)}.about-layout{gap:35px;grid-template-columns:1.15fr .85fr}.about-copy h2{font-size:clamp(38px,5vw,56px)}.about-copy h2.v07-pixel{font-size:clamp(21px,2.6vw,29px)}.about-visual{max-width:350px}.how-step h3{font-size:11px}.response-highlight,.plan-response{font-size:9px}.strategy-steps{font-size:8px;gap:10px}.strategy-steps span{padding:10px}.strategy-steps span:not(:last-child)::after{right:-10px;top:10px}}
@media(max-width:760px){
  .hero{padding-top:132px;padding-bottom:142px;min-height:100svh;align-items:center}
  .hero h1{font-size:clamp(20px,5.55vw,34px);line-height:1.62;margin-bottom:24px}
  .hero .gravity-word{text-shadow:2px 2px #197b99,4px 4px #142951,0 14px 23px #0009}
  .hero-copy-playground{margin-top:0}.idea-chips{gap:12px 10px;align-items:flex-start}.idea-chip{font-size:14px;padding:9px 11px}.idea-chip.pixel{font-size:10px;line-height:1.7}.idea-chip.pop{font-size:14px}.idea-chip.bubble{font-size:13px;line-height:1.65;max-width:100%;text-wrap:pretty}.hero-audience{font-size:15px;margin-top:6px;line-height:1.65}.hero-unity{font-size:15px;margin-bottom:22px;line-height:1.7}.bubble-cta{padding:13px 20px!important;min-height:48px;font-size:13px}
  .hero-baseline{left:24px;right:24px;bottom:34px}.pixel-wayfinder{font-size:8px;line-height:1.8;gap:14px}.pixel-wayfinder .wayfinder-arrow{font-size:20px}
  .lab-heading h2.v07-pixel{font-size:clamp(21px,5.8vw,35px);line-height:1.6}.lab-heading .section-intro{padding-left:16px;font-size:16px}.lab-heading{gap:24px}.lab-status{max-width:100%;line-height:1.6}
  .film-grid.brand-films{display:grid;grid-template-columns:repeat(3,min(78vw,340px));grid-auto-flow:column;grid-auto-columns:min(78vw,340px);max-width:none;min-width:0;gap:18px;align-items:start;position:relative;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;padding:39px 8px 15px;margin:0 -8px;-webkit-overflow-scrolling:touch}
  .brand-films::-webkit-scrollbar{display:none}.film-grid.brand-films .film-card{width:min(78vw,340px);max-width:none;scroll-snap-align:start;scroll-snap-stop:always;min-width:0}.brand-films .film-media{padding:10px}.brand-films .film-copy{padding:21px 20px 24px;min-height:180px}.brand-films .film-copy h3{font-size:23px}.brand-films .film-copy>p:last-child{font-size:12px;line-height:1.65}.brand-films .media-status{font-size:9px!important}
  .motion-rail-note{display:block;font-size:11px;line-height:1.8;color:#cee3f4;margin:0 0 8px;max-width:430px}.motion-rail-note::before{content:"↔";margin-right:10px;color:#2fd8ec;font-size:18px}
  .motion-rail-line{display:block;position:absolute;left:8px;top:15px;width:calc(var(--rail-width,100%) - 16px);height:2px;border-radius:3px;background:linear-gradient(90deg,#2fd8ec,#ff7fae 50%,#dba363);pointer-events:none;z-index:2;box-shadow:0 0 10px #2fd8ec24}
  .motion-rail-dot{position:absolute;left:14px;top:-5px;width:12px;height:12px;border-radius:50%;background:#2fd8ec;border:2px solid #dcfbff;box-shadow:0 0 13px #2fd8ec66;animation:tiix-v07-rail-dot 16.4s ease-in-out infinite}
  .motion-rail-progress{display:flex;justify-content:center;gap:11px;margin:5px 0 28px}.motion-rail-progress button{position:relative;width:38px;height:38px;padding:0;border:0;background:transparent;display:grid;place-items:center}.motion-rail-progress button::before{content:"";width:9px;height:9px;border:1px solid var(--rail-accent);border-radius:2px;background:transparent;transition:background .4s,box-shadow .4s,scale .4s}.motion-rail-progress button[aria-pressed="true"]::before{background:var(--rail-accent);box-shadow:0 0 12px color-mix(in srgb,var(--rail-accent) 60%,transparent);scale:1.25}
  .about-section{min-height:0}.about-layout{grid-template-columns:1fr;gap:30px}.about-copy h2{font-size:clamp(36px,10vw,52px);line-height:1.16}.about-copy h2.v07-pixel{font-size:clamp(20px,5.6vw,31px);line-height:1.65}.about-copy .section-intro{font-size:18px}.about-copy>p:not(.eyebrow):not(.section-intro){font-size:14px}.about-visual{max-width:300px;justify-self:center;margin-top:0}.about-principles{grid-template-columns:1fr;gap:20px;margin-top:28px}.about-principles li{padding-top:13px}.about-principles h3{font-size:14px;margin-bottom:5px}.about-principles p{font-size:12px}
  .service-row{padding-left:52px;margin-left:0;min-height:110px}.service-row h3{font-size:20px;line-height:1.35}.service-row .service-need{font-size:10px;line-height:1.6;margin-bottom:9px;padding:5px 8px}.service-symbol{top:8px;width:36px;height:36px}.service-effect{left:-22px;top:-12px}.service-4 .service-effect{left:-23px}.service-list{margin-left:8px;margin-top:29px}
  .bubble.b1{font-size:7px;line-height:1.75}.bubble.b5{font-size:6px;line-height:1.65}.bubble-scene.is-visible .bubble{animation-name:tiix-v07-strategy-float}.strategy-orbit{inset:16% 12% 23%}.strategy-orbit-dot{width:14px;height:14px;top:-7px}
  .how-heading h2.v07-pixel,.brief-section h2.v07-pixel{font-size:clamp(20px,5.65vw,34px);line-height:1.7}.journey-legend{font-size:8px;gap:12px}.how-grid{gap:25px 17px}.how-step{padding:18px 13px 23px}.how-step h3{font-size:10px;line-height:1.85;overflow-wrap:anywhere}.how-step .eyebrow{font-size:8px;line-height:1.8;padding:7px 8px;margin-bottom:18px}.how-step>p:last-child{font-size:12px;line-height:1.7}.how-footer .contract-line{font-size:12px;line-height:1.9;max-width:100%}.response-highlight,.plan-response{font-size:9px;line-height:1.95;padding:17px 16px}.response-promise{max-width:100%;gap:13px}.brief-contact{margin-top:25px;padding-bottom:0}
}
@media(max-width:359px){.hero h1{font-size:19px}.idea-chip{font-size:13px}.idea-chip.pixel{font-size:9px}.idea-chip.bubble{font-size:12px}.how-step h3{font-size:9px}.how-step .eyebrow{font-size:7px}.how-step{padding-left:11px;padding-right:11px}.strategy-steps{font-size:7px}.strategy-steps span{padding:9px}.bubble.b1{font-size:6px}.bubble.b5{font-size:6px}}
.motion-paused :is(.idea-chip,.bubble-cta,.wayfinder-arrow,.film-card,.about-orbit,.about-point,.service-symbol,.service-symbol svg,.service-effect,.service-effect i,.strategy-orbit,.bubble,.how-step,.response-highlight,.plan-response,.motion-rail-dot,.ambient-orb),.motion-paused :is(.bubble-cta,.response-highlight,.plan-response)::after{animation:none!important}
@media(prefers-reduced-motion:reduce){html:not(.motion-enabled) .brand-films{scroll-behavior:auto}html:not(.motion-enabled) .motion-rail-dot{left:14px}html:not(.motion-enabled) .service-effect i{opacity:.2}html:not(.motion-enabled) .about-orbit{animation:none}html:not(.motion-enabled) .idea-chip.pop{rotate:0deg}}

/* TiiX CSS source: assets/v08.css */
/* V08 — pixel waypoints, warm sunlight and a single connected video story. */
.main-nav{font-family:var(--pixel-font);font-size:9px;font-weight:400;line-height:1.8;gap:23px;letter-spacing:0;font-synthesis:none}
.main-nav a{position:relative;text-shadow:2px 2px #031c37}
.main-nav a:hover,.main-nav a[aria-current]{color:#ffdc63;text-shadow:2px 2px #805627}
.lang-switch{font-family:var(--pixel-font);font-size:8px;font-weight:400}
.hero h1.v08-gravity{font-family:Montserrat,Arial,sans-serif;font-size:clamp(55px,8.25vw,119px);font-weight:850;letter-spacing:-.055em;line-height:1.12;max-width:1280px;margin-bottom:35px;perspective:1000px;color:#fff7eb}
.hero h1.v08-gravity .gravity-word{animation:none;text-shadow:none;transform:none;display:inline;white-space:normal}
.gravity-letter-word{display:inline-block;white-space:nowrap}
.gravity-letter{display:inline-block;transform-origin:50% 75%;text-shadow:1px 2px #9ab5c6,2px 4px #426184,3px 6px #223a61,5px 10px #08172b,0 24px 35px #0006;animation:tiix-v08-letter-orbit 7.5s ease-in-out infinite;animation-delay:calc(var(--letter-index) * -.37s);will-change:transform}
.gravity-letter:nth-child(3n){color:#ffe8c2;animation-name:tiix-v08-letter-drift}
.hero-copy-playground{max-width:1000px}
.hero-copy-playground .section-intro{max-width:1000px}
.idea-chips{gap:9px 10px;align-items:center}
.idea-chip.bubble{position:relative;left:auto;right:auto;top:auto;bottom:auto;aspect-ratio:auto;width:auto;height:auto;text-align:left;transform-style:flat;flex:0 1 455px;max-width:455px;padding:16px 20px;font-size:15px;line-height:1.55;font-weight:800;color:#132542;border:2px solid #e1b5ff;border-radius:31px 31px 31px 8px;background:radial-gradient(ellipse at 25% 8%,#fff9,transparent 44%),linear-gradient(135deg,#dfadff 2%,#ac8ee7 45%,#64efd4 100%);box-shadow:inset 0 4px 3px #fff6,inset -4px -6px 5px #55458d44,5px 7px 0 #47295466,0 17px 26px #0004;transform:rotate(1deg)}
.idea-chip.bubble::before{content:none}
.idea-chip.bubble::after{content:"";position:absolute;right:15px;top:7px;width:8px;height:8px;border-radius:50%;background:#fff9;box-shadow:-13px 3px 0 -2px #fff8}
.lab-status{position:relative;isolation:isolate;color:#131f3d;background:radial-gradient(#161e3c28 1px,transparent 1.5px) 0 0/5px 5px,#ff90bb;border:3px solid #fff0aa;border-radius:7px 7px 7px 1px;font-weight:850;font-size:12px;letter-spacing:.06em;padding:11px 17px;box-shadow:6px 6px 0 #ffcc44,9px 9px 0 #702f68;transform:rotate(-3deg);animation:tiix-v08-lab-pop 6.4s ease-in-out infinite}
.lab-status::after{content:"";position:absolute;left:14px;bottom:-9px;width:14px;height:14px;background:#ff90bb;border-bottom:3px solid #fff0aa;border-right:3px solid #fff0aa;transform:skew(-15deg) rotate(45deg);z-index:-1}
.section .eyebrow::before{width:18px;height:18px;flex:0 0 18px;background:currentColor;clip-path:polygon(38% 0,62% 0,62% 25%,75% 25%,75% 38%,100% 38%,100% 62%,75% 62%,75% 75%,62% 75%,62% 100%,38% 100%,38% 75%,25% 75%,25% 62%,0 62%,0 38%,25% 38%,25% 25%,38% 25%);filter:drop-shadow(3px 3px 0 #07172d);animation:tiix-v08-marker-blink 4s steps(2,end) infinite}
#lab .eyebrow::before{color:#ffcb48;clip-path:polygon(25% 0,75% 0,75% 25%,100% 25%,100% 75%,75% 75%,75% 100%,25% 100%,25% 75%,0 75%,0 25%,25% 25%)}
#services .eyebrow::before{color:#ff7fae;clip-path:polygon(0 25%,25% 25%,25% 0,50% 0,50% 25%,75% 25%,75% 50%,100% 50%,100% 75%,75% 75%,75% 100%,50% 100%,50% 75%,25% 75%,25% 50%,0 50%)}
#strategy .eyebrow::before{color:#63e6c4;clip-path:polygon(0 0,75% 0,75% 25%,100% 25%,100% 75%,75% 75%,75% 100%,0 100%,0 75%,25% 75%,25% 25%,0 25%)}
#how .how-heading .eyebrow::before{color:#b8a0ff;clip-path:polygon(0 25%,50% 25%,50% 0,75% 0,75% 25%,100% 25%,100% 50%,75% 50%,75% 75%,50% 75%,50% 50%,0 50%)}
#brief .eyebrow::before{color:#ffce53;clip-path:polygon(50% 0,75% 0,75% 25%,100% 25%,100% 50%,75% 50%,75% 75%,50% 75%,50% 100%,25% 100%,25% 75%,0 75%,0 50%,25% 50%,25% 25%,50% 25%)}
.how-step .eyebrow::before{display:none}
.service-row{padding-left:72px}
.service-symbol{width:53px;height:53px;border-radius:10px;border-color:color-mix(in srgb,var(--service-accent) 40%,transparent);background:#13284766}
.service-symbol .pixel-service-icon{width:40px;height:40px;display:block;image-rendering:pixelated;filter:drop-shadow(3px 3px 0 #03142b);object-fit:contain}
.service-1.is-visible .service-symbol{animation:tiix-v08-sun-hop 5.5s steps(4,end) infinite}
.service-2.is-visible .pixel-service-icon{animation:tiix-v08-tv-buzz 4.6s steps(2,end) infinite}
.service-3.is-visible .pixel-service-icon{animation:tiix-v08-smile-wink 5.3s steps(3,end) infinite}
.service-4.is-visible .pixel-service-icon{animation:tiix-v08-ai-glint 3.8s steps(2,end) infinite}
.service-5.is-visible .pixel-service-icon{animation:tiix-v08-tv-buzz 5.8s steps(2,end) infinite}
.service-6.is-visible .pixel-service-icon{animation:tiix-v08-sun-hop 5.1s steps(4,end) infinite}
.ambient-pixel-sun{position:absolute;left:3%;right:auto;top:26%;width:clamp(160px,21vw,300px);aspect-ratio:1;background:url('pixel-planet.svg') center/contain no-repeat;opacity:.29;image-rendering:pixelated;filter:drop-shadow(12px 12px 0 #8b4c2845) drop-shadow(5px 5px 0 #5d42752b);animation:tiix-v08-solar-float 22s ease-in-out infinite;transition:opacity 1.2s}
.ambient-pixel-sun i{position:absolute;width:9px;height:9px;background:#efb74f;box-shadow:5px 5px 0 #714d6555;opacity:.7;animation:tiix-v08-pixel-dust 7s steps(5,end) infinite}
.ambient-pixel-sun i:nth-child(1){left:-17%;top:12%;animation-delay:-1s}.ambient-pixel-sun i:nth-child(2){right:-12%;top:37%;width:13px;height:13px;animation-delay:-2.8s}.ambient-pixel-sun i:nth-child(3){left:4%;bottom:-22%;width:6px;height:6px;animation-delay:-4.5s}.ambient-pixel-sun i:nth-child(4){right:2%;bottom:-9%;animation-delay:-6s}
.ambient-scene[data-theme="pop"] .ambient-pixel-sun{opacity:.43}.ambient-scene[data-theme="blueprint"] .ambient-pixel-sun{opacity:.23}
.brand-films .film-card{opacity:.83;border-color:#8ca4c230;transition:opacity .5s,border-color .5s,box-shadow .5s}
.brand-films .film-card.is-active{opacity:1;border-color:var(--film-accent,#2fd8ec);box-shadow:0 0 0 1px color-mix(in srgb,var(--film-accent,#2fd8ec) 25%,transparent),0 20px 42px #0003}
.brand-films .film-card.is-active .media-status::before{content:"";display:inline-block;width:6px;height:6px;margin-right:7px;background:var(--film-accent,#2fd8ec);box-shadow:2px 2px 0 #fff5}
.brand-films .motion-rail-dot{animation:none;left:var(--rail-position,14px);background:var(--rail-colour,#2fd8ec);transition:left .7s ease,background .5s}
@keyframes tiix-v08-letter-orbit{0%,100%{transform:translate3d(0,0,0) rotate(-1.5deg)}50%{transform:translate3d(0,-9px,10px) rotate(2.5deg)}}
@keyframes tiix-v08-letter-drift{0%,100%{transform:translate3d(0,3px,3px) rotate(2deg)}50%{transform:translate3d(0,-5px,16px) rotate(-3deg)}}
@keyframes tiix-v08-lab-pop{0%,72%,100%{transform:rotate(-3deg) scale(1)}78%{transform:rotate(1deg) scale(1.035)}86%{transform:rotate(-4deg) scale(1)}}
@keyframes tiix-v08-marker-blink{0%,60%,100%{opacity:1}70%{opacity:.55}}
@keyframes tiix-v08-sun-hop{0%,68%,100%{transform:translateY(0)}78%{transform:translateY(-4px)}88%{transform:translateY(1px)}}
@keyframes tiix-v08-tv-buzz{0%,84%,100%{transform:translateX(0)}86%{transform:translateX(-2px)}90%{transform:translateX(2px)}94%{transform:translateX(0)}}
@keyframes tiix-v08-smile-wink{0%,70%,100%{transform:rotate(0)}80%{transform:rotate(-6deg)}90%{transform:rotate(4deg)}}
@keyframes tiix-v08-ai-glint{0%,65%,100%{filter:drop-shadow(3px 3px 0 #03142b)}78%{filter:drop-shadow(3px 3px 0 #b68eff66)}}
@keyframes tiix-v08-solar-float{0%,100%{transform:translate(0,0)}50%{transform:translate(-15px,-18px)}}
@keyframes tiix-v08-pixel-dust{0%,100%{transform:translateY(0);opacity:.35}50%{transform:translateY(-10px);opacity:.8}}
@media(max-width:1100px){.header-inner{height:76px;gap:15px}.header-tools{margin-left:auto}.menu-toggle{display:grid;place-items:center;width:36px;height:36px;font-size:18px}.main-nav{position:absolute;top:76px;left:20px;right:20px;margin:0;padding:18px;background:#10203bf5;border:1px solid #d9e6ff30;border-radius:10px;display:none;flex-direction:column;gap:0;font-size:10px}.main-nav.is-open{display:flex}.main-nav a{padding:15px}.hero h1.v08-gravity{font-size:clamp(54px,8vw,87px)}}
@media(max-width:760px){.main-nav{left:15px;right:15px}.hero h1.v08-gravity{font-size:clamp(37px,10.8vw,65px);line-height:1.22;letter-spacing:-.05em;margin-bottom:28px}.gravity-letter{text-shadow:1px 2px #688bac,2px 4px #243f62,3px 6px #0a1629,0 14px 20px #0006;animation-duration:8.5s}.idea-chips{gap:8px}.idea-chip.bubble{flex-basis:auto;max-width:100%;font-size:13px;padding:13px 16px;margin-top:1px}.idea-chip.pixel{font-size:9px}.idea-chip.pop{font-size:14px}.lab-status{font-size:10px;padding:9px 13px;box-shadow:4px 4px 0 #ffcc44,7px 7px 0 #702f68}.service-row{padding-left:60px}.service-symbol{width:43px;height:43px}.service-symbol .pixel-service-icon{width:34px;height:34px}.section .eyebrow::before{width:15px;height:15px;flex-basis:15px}.ambient-pixel-sun{left:-25px;right:auto;top:31%;width:165px;opacity:.23}.ambient-pixel-sun i{width:6px;height:6px}.motion-rail-note{font-size:9px;line-height:1.9}}
@media(max-width:359px){.hero h1.v08-gravity{font-size:34px}.main-nav{font-size:9px}.idea-chip.bubble{font-size:12px}.service-row{padding-left:55px}}
.motion-paused :is(.gravity-letter,.lab-status,.pixel-service-icon,.ambient-pixel-sun,.ambient-pixel-sun i),.motion-paused .section .eyebrow::before{animation:none!important}
@media(prefers-reduced-motion:reduce){html:not(.motion-enabled) .gravity-letter{transform:none!important}html:not(.motion-enabled) .brand-films .motion-rail-dot{transition:none}html:not(.motion-enabled) .lab-status{transform:rotate(-3deg)}}

/* TiiX CSS source: assets/v09.css */
/* A compact motion choice appears only when the system requests reduced motion. */
.motion-preference:not([hidden]){display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:8px 10px;border:1px solid #91e9f570;border-radius:18px;background:#112644;color:#e5faff;font-family:var(--pixel-font);font-size:7px;line-height:1.5;cursor:pointer;box-shadow:0 3px 0 #020c20}
.motion-preference[hidden],.video-autoplay-fallback[hidden]{display:none!important}
.motion-preference-dot{width:7px;height:7px;background:#8294ac;box-shadow:2px 2px 0 #020c20;flex-shrink:0}
.motion-preference[aria-checked="true"] .motion-preference-dot{background:#2fd8ec;box-shadow:0 0 8px #2fd8ec80}
.motion-preference:focus-visible,.video-autoplay-fallback:focus-visible{outline:3px solid #ffc94d;outline-offset:4px}
.video-autoplay-fallback{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:12px;padding:9px 13px;border:1px solid #2fd8ec90;border-radius:20px;background:#0b2843;color:#d9fbff;font-family:var(--pixel-font);font-size:8px;line-height:1.8;text-decoration:none;box-shadow:3px 3px 0 #020c20}
@media(max-width:600px){.header-tools{gap:9px}.motion-preference:not([hidden]){padding:7px 8px;font-size:6px;gap:5px}}
@media(max-width:359px){.motion-preference:not([hidden]){padding:7px 6px;font-size:5.5px}.header-tools{gap:6px}.motion-preference-dot{width:5px;height:5px}}

/* TiiX CSS source: assets/v10.css */
/* V10 — a compact selection of work, one clear route to the brief. */
@font-face { font-family: Montserrat; src: url("fonts/Montserrat-Latin-v10.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Press Start 2P"; src: url("fonts/PressStart2P-v10.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
.ambient-scene { background: radial-gradient(ellipse at 78% 28%, rgba(24,55,101,.24) 0, transparent 60%), linear-gradient(rgba(7,17,42,.35),rgba(7,17,42,.45)), url("brand-background-dark-v10-1600.webp") center / cover no-repeat; }
.mode-stage[data-mode="poster"] { background: linear-gradient(120deg,rgba(224,247,248,.4),rgba(224,247,248,.1)), url("brand-background-light-v10-1600.webp") center / cover no-repeat; }
.main-nav { font-family: var(--tiix-heading-font); font-size: 13px; font-weight: 700; gap: 24px; line-height: 1.5; }
.main-nav a, .main-nav a:hover { text-shadow: none; }
.logo-dot-origin { background: #2FD8EC; border-radius: 50%; box-shadow: none; }

.v10-landing .section { min-height: 0; padding-top: 86px; padding-bottom: 86px; }
.v10-landing h2 {
    font-family: var(--tiix-heading-font);
    font-weight: 800;
    font-size: clamp(42px, 5.5vw, 74px);
    line-height: 1.08;
    letter-spacing: -.055em;
    -webkit-text-stroke: 0;
    text-shadow: 0 8px 23px #0004 !important;
    transform: none;
    margin-bottom: 24px;
}
.v10-landing h2.is-visible { animation: tiix-v10-heading-entry .8s ease-out both; }
.v10-landing h2::after { content: none; }
.v10-landing .eyebrow, .v10-landing .stage-index, .v10-landing .stage-caption,
.v10-landing .media-status, .v10-landing .motion-rail-note {
    font-family: var(--pixel-font);
    font-weight: 400;
    font-size: 9px;
    line-height: 1.85;
    letter-spacing: 0;
}
.v10-landing .eyebrow { margin-bottom: 20px; }
.v10-landing .section-intro { font-size: 18px; line-height: 1.65; }

.v10-landing .hero { min-height: 760px; padding-top: 145px; padding-bottom: 120px; }
.v10-landing .hero h1.v08-gravity { max-width: 1060px; font-size: clamp(62px, 8.1vw, 116px); font-weight: 900; line-height: 1.15; letter-spacing: -.06em; margin-bottom: 23px; }
.v10-landing .hero h1 .dot-anchor { width: .32em; height: .32em; margin-left: .25em; }
.v10-landing .hero .gravity-letter { color: #f4fcff; text-shadow: 1px -1px #fff, 1px 2px #b8d5e0, 2px 4px #718ba6, 3px 6px #405773, 5px 10px #142c48, 0 20px 34px #0007; }
.v10-landing .hero .gravity-letter:nth-child(3n) { color: #f4fcff; }
.v10-landing .hero .hero-subtitle { max-width: 800px; margin-bottom: 24px; color: #e4ecfa; font-size: clamp(19px, 2vw, 27px); font-weight: 500; line-height: 1.5; }
.v10-landing .hero-copy-playground { max-width: 1000px; }
.v10-landing .hero .idea-chips { gap: 10px; margin-bottom: 16px; align-items: stretch; }
.v10-landing .idea-chip.pixel, .v10-landing .idea-chip.pop, .v10-landing .idea-chip.bubble, .v10-landing .idea-chip.event, .v10-landing .idea-chip.media {
    display: inline-flex; align-items: center; justify-content: center;
    flex: 0 1 auto; width: auto; max-width: 100%; padding: 12px 18px;
    font-family: var(--tiix-heading-font); font-size: 15px; font-weight: 750; line-height: 1.4;
    border: 1px solid #ffffff66; border-radius: 999px; clip-path: none;
    transform: none; box-shadow: inset 0 1px #fff5, 0 8px 17px #0003;
}
.v10-landing .idea-chip.pixel { color: #061d37; background: #2FD8EC; }
.v10-landing .idea-chip.pop { color: #081c37; background: #FF8FB9; }
.v10-landing .idea-chip.bubble { color: #132542; background: #b5a2f4; }
.v10-landing .idea-chip.event { color: #302616; background: #f5d273; }
.v10-landing .idea-chip.media { color: #103b35; background: #9ce9c8; }
.v10-landing .idea-chips.is-visible .idea-chip.event { animation: tiix-v07-pop-tilt 5.2s ease-in-out -2.4s infinite; }
.v10-landing .idea-chips.is-visible .idea-chip.media { animation: tiix-v07-bubble-hover 6s ease-in-out -4s infinite; }
.v10-landing .idea-chip::before, .v10-landing .idea-chip::after { content: none; }
.v10-landing .hero-audience { font-family: var(--tiix-heading-font); font-size: 15px; color: #bfcee2; margin: 0; }
.v10-landing .hero-brief-cta { margin-top: 76px; }
.v10-landing .hero-baseline { bottom: 35px; }

.v10-landing .lab-heading { grid-template-columns: 1.15fr .85fr; gap: 48px; margin-bottom: 34px; }
.v10-landing .lab-heading h2 { margin-bottom: 15px; }
.v10-landing .lab-heading .section-intro { font-size: 17px; margin-bottom: 0; }
.v10-landing .lab-status { font-family: var(--tiix-heading-font); font-weight: 800; letter-spacing: .015em; font-size: 12px; margin-top: 8px; }
.v10-landing .mode-stage { height: 300px; }
.v10-landing .stage-index { max-width: calc(100% - 60px); font-size: 8px; }
.v10-landing .stage-caption { font-size: 8px; }
.v10-landing .mode-buttons { padding: 16px 22px; gap: 8px; }
.v10-landing .mode-buttons button { min-height: 44px; font-family: var(--tiix-heading-font); font-size: 12px; }
.v10-landing .lab-bottom { margin-top: 15px; }
.v10-landing .lab-note { font-size: 11px; }
.v10-landing .media-gallery { margin-top: 48px; }
.v10-landing .gallery-heading { margin: 0 0 22px; }
.v10-landing .gallery-heading h3 { font-family: var(--tiix-heading-font); font-size: clamp(27px, 3.2vw, 40px); font-weight: 800; letter-spacing: -.045em; line-height: 1.15; text-shadow: 0 7px 18px #0003; }
.v10-landing .gallery-heading p { font-size: 14px; line-height: 1.65; }
.v10-landing .brand-motion-heading::after { margin-top: 16px; height: 3px; }
.v10-landing .brand-films { position: relative; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; padding-top: 34px; }
.v10-landing .brand-films .motion-rail-line { display: block; position: absolute; left: calc(100% / 6); right: calc(100% / 6); top: 15px; width: auto !important; height: 2px; border-radius: 3px; background: linear-gradient(90deg, #2FD8EC, #FF7FAE 50%, #DBA363); pointer-events: none; z-index: 2; box-shadow: 0 0 10px #2fd8ec24; }
.v10-landing .brand-films .motion-rail-dot { position: absolute; top: -5px; width: 12px; height: 12px; border-radius: 50%; border: 2px solid #dcfbff; box-shadow: 0 0 13px #2fd8ec66; }
.v10-landing .brand-films[data-active-card="0"] .motion-rail-dot { left: -6px; }
.v10-landing .brand-films[data-active-card="1"] .motion-rail-dot { left: calc(50% - 6px); }
.v10-landing .brand-films[data-active-card="2"] .motion-rail-dot { left: calc(100% - 6px); }
.v10-landing .motion-rail-note { display: block; margin: 0 0 8px; color: #cee3f4; }
.v10-landing .motion-rail-note::before { content: "→"; font-size: 14px; }
.v10-landing .brand-films .film-media { padding: 10px; }
.v10-landing .brand-films .film-media video { max-height: 470px; }
.v10-landing .brand-films .film-copy { padding: 21px 20px; min-height: 170px; }
.v10-landing .brand-films .film-copy h3 { font-size: 22px; font-family: var(--tiix-heading-font); font-weight: 800; line-height: 1.2; }
.v10-landing .brand-films .film-copy > p:last-child { font-size: 12px; line-height: 1.6; }
.v10-landing .brand-films .media-status { font-size: 7px !important; line-height: 1.8 !important; margin-bottom: 12px; }

.v10-landing .work-block { margin-top: 46px; }
.v10-landing .work-heading { margin-bottom: 21px; }
.v10-landing .work-grid { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: min(430px, 82vw); gap: 20px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-padding-inline: 1px; padding: 3px 1px 15px; scrollbar-width: thin; scrollbar-color: #2fd8ec80 #ffffff0a; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.v10-landing .work-grid > * { min-width: 0; scroll-snap-align: start; }
.v10-landing .client-work-hint { margin: 12px 0 0; color: #b9c5dd; }
.v10-landing .work-client { display: grid; grid-template-columns: 160px 1fr; min-height: 280px; }
.v10-landing .work-client .film-media { padding: 9px; background: #0c2342; display: flex; align-items: center; }
.v10-landing .work-client .film-media video { max-height: 280px; border-radius: 10px; }
.v10-landing .work-client .film-copy { display: flex; flex-direction: column; justify-content: center; padding: 24px; min-height: 0; }
.v10-landing .work-client .film-copy h3 { font-family: var(--tiix-heading-font); font-size: 27px; line-height: 1.15; margin-bottom: 18px; }
.v10-landing .work-client .film-copy > p:last-child { font-size: 13px; }
.v10-landing .work-client .media-status { font-size: 7px !important; line-height: 1.8 !important; }
.v10-landing .work-next { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 30px; min-height: 280px; border: 1px dashed #b5a2f47a; border-radius: 20px; background: linear-gradient(130deg,#b5a2f410,#2fd8ec06); transition: border-color .3s, background .3s; }
.v10-landing .work-next:hover { border-color: #2FD8EC; background: linear-gradient(130deg,#b5a2f422,#2fd8ec0f); }
.v10-landing .work-next-mark { display: block; color: #2FD8EC; font-family: var(--pixel-font); font-size: 22px; line-height: 1; margin-bottom: 22px; }
.v10-landing .work-next h3 { font-family: var(--tiix-heading-font); font-size: 30px; line-height: 1.15; letter-spacing: -.045em; font-weight: 800; max-width: 250px; margin-bottom: 22px; }
.v10-landing .work-next-cta { color: #bff9ff; font-size: 13px; font-weight: 700; }
.v10-landing .instagram-cta { border: 1px solid #2fd8ec80; border-radius: 999px; padding: 14px 22px; min-height: 48px; margin-top: 24px; font-size: 13px; color: #d5faff; background: #2fd8ec0a; }

.v10-landing .about-layout { grid-template-columns: 1.45fr .55fr; gap: 46px; }
.v10-landing .about-copy { max-width: 850px; }
.v10-landing .about-copy h2 { font-size: clamp(42px, 5.5vw, 74px); line-height: 1.08; }
.v10-landing .about-copy .about-credibility { font-family: var(--tiix-heading-font); font-size: 13px !important; line-height: 1.7 !important; padding: 15px 18px; margin-bottom: 24px; }
.v10-landing .about-copy .section-intro { font-size: 18px; line-height: 1.65; }
.v10-landing .about-ambition { display: block; color: #bff9ff; font-weight: 800; margin-bottom: 8px; text-shadow: 0 4px 16px #2fd8ec18; }
.v10-landing .about-copy > p:not(.eyebrow):not(.section-intro) { font-size: 14px; line-height: 1.75; }
.v10-landing .about-principles { margin-top: 25px; gap: 19px; }
.v10-landing .about-principles h3 { font-family: var(--tiix-heading-font); font-size: 13px; line-height: 1.45; }
.v10-landing .about-principles p { font-size: 12px; line-height: 1.7; }
.v10-landing .about-copy > .bubble-cta { margin-top: 25px; }
.v10-landing .about-visual { width: 100%; max-width: 310px; min-width: 0; justify-self: center; }

.v10-landing .services-layout { gap: 58px; grid-template-columns: .95fr 1.05fr; }
.v10-landing .services-heading { top: 120px; }
.v10-landing .services-heading h2 { font-size: clamp(42px, 5.5vw, 74px); line-height: 1.08; }
.v10-landing .service-row { padding-bottom: 22px; margin-bottom: 20px; padding-left: 67px; }
.v10-landing .service-row h3 { font-family: var(--tiix-heading-font); font-weight: 750; font-size: 23px; line-height: 1.3; }
.v10-landing .service-row p { font-family: var(--tiix-heading-font); font-size: 13px; line-height: 1.65; }
.v10-landing .service-row .service-need { font-size: 11px; }
.v10-landing .service-symbol { width: 48px; height: 48px; }
.v10-landing .service-symbol .pixel-service-icon { width: 36px; height: 36px; }
.v10-landing .agency-note { margin-top: 25px; padding: 20px; }

.v10-landing .section-anchor { position: absolute; top: 0; width: 0; height: 0; scroll-margin-top: 25px; }
.v10-landing .strategy-layout { grid-template-columns: 1fr 1fr; gap: 45px; align-items: center; margin-bottom: 56px; }
.v10-landing .strategy-heading h2 { max-width: 590px; font-size: clamp(42px, 5.5vw, 74px); line-height: 1.08; }
.v10-landing .strategy-heading .section-intro { max-width: 520px; font-size: 17px; }
.v10-landing .strategy-steps { margin-top: 28px; font-family: var(--tiix-heading-font); font-size: 11px; line-height: 1.5; }
.v10-landing .strategy-steps span { padding: 11px 14px; font-weight: 800; }
.v10-landing .bubble-scene { height: 430px; min-height: 430px; max-width: 550px; margin: 0 auto; }
.v10-landing .bubble.b1 { width: 112px; }
.v10-landing .bubble.b2 { width: 124px; }
.v10-landing .bubble.b3 { width: 126px; }
.v10-landing .bubble.b4 { width: 109px; }
.v10-landing .bubble.b5 { width: 78px; }
.v10-landing .bubble-core { width: 136px; height: 136px; font-family: var(--tiix-heading-font); font-weight: 800; }
.v10-landing .bubble-core small { font-family: var(--pixel-font); font-size: 6px; line-height: 1.8; }
.v10-landing .bubble-legend { bottom: -19px; font-family: var(--pixel-font); font-size: 8px; line-height: 1.85; letter-spacing: 0; }
.v10-landing .journey-legend { margin: 0 0 23px; font-family: var(--tiix-heading-font); font-size: 12px; font-weight: 600; }
.v10-landing .how-grid { gap: 23px; }
.v10-landing .how-step { padding: 23px 18px 24px; }
.v10-landing .how-step h3 { font-family: var(--tiix-heading-font); font-size: 21px; font-weight: 800; line-height: 1.25; letter-spacing: -.025em; }
.v10-landing .how-step p { font-family: var(--tiix-heading-font); font-size: 13px; line-height: 1.7; }
.v10-landing .how-step .eyebrow { font-family: var(--pixel-font); font-size: 8px; line-height: 1.7; font-weight: 400; padding: 8px 10px; margin-bottom: 17px; }
.v10-landing .how-footer { margin-top: 35px; gap: 35px; }
.v10-landing .contract-line { font-family: var(--tiix-heading-font); font-size: clamp(20px, 2.7vw, 32px); font-weight: 800; line-height: 1.3; letter-spacing: -.025em; }
.v10-landing .response-promise { font-family: var(--tiix-heading-font); font-size: 13px; max-width: 430px; }
.v10-landing .response-highlight, .v10-landing .plan-response { font-family: var(--tiix-heading-font); font-size: 13px; font-weight: 750; letter-spacing: 0; line-height: 1.6; padding: 15px 18px; }
.v10-landing .strategy-section.is-active .response-highlight { animation: tiix-v07-response-pop 6s ease-in-out infinite; }
.v10-landing .strategy-section.is-active .plan-response { animation: tiix-v07-response-pop 6s ease-in-out -3s infinite; }
.v10-landing .strategy-section.is-active :is(.response-highlight,.plan-response)::after { animation: tiix-v07-promise-sparks 6s ease-out infinite; }
.v10-landing .strategy-section.is-active .plan-response::after { animation-delay: -3s; }

.v10-landing .brief-layout { display: block; max-width: 900px; }
.v10-landing .brief-section h2 { font-size: clamp(42px, 5.5vw, 74px); line-height: 1.08; }
.v10-landing .brief-section .section-intro { font-size: 18px; }
.v10-landing .dot-speech-slot { display: block; width: 270px; max-width: 100%; height: 104px; }
.v10-landing .brief-contact { font-size: 15px; gap: 15px; padding-bottom: 15px; }
.site-footer .footer-contact { display: flex; flex-basis: 100%; flex-wrap: wrap; align-items: center; gap: 20px 36px; padding: 0 0 20px; margin-bottom: 1px; border-bottom: 1px solid #ffffff18; }
.site-footer .footer-contact-email { color: #2FD8EC; font-size: clamp(19px, 2.3vw, 30px); font-weight: 800; letter-spacing: -.035em; line-height: 1.4; }
.site-footer .footer-contact-phone { color: #f5d273; font-size: 17px; font-weight: 700; line-height: 1.4; white-space: nowrap; }
.site-footer .footer-contact a:hover { color: #fff; }
@keyframes tiix-v10-heading-entry { from { opacity: .65; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 1100px) {
    .main-nav { font-size: 13px; }
    .v10-landing .section { padding-top: 70px; padding-bottom: 70px; }
    .v10-landing .hero { min-height: 730px; padding-top: 125px; padding-bottom: 120px; }
    .v10-landing .hero h1.v08-gravity { font-size: clamp(60px, 8.1vw, 86px); }
    .v10-landing .about-layout { gap: 30px; grid-template-columns: 1.55fr .45fr; }
    .v10-landing .about-visual { max-width: 240px; }
    .v10-landing .services-layout { gap: 45px; }
    .v10-landing .strategy-layout { gap: 26px; }
    .v10-landing .how-step { padding: 20px 14px 22px; }
    .v10-landing .how-step h3 { font-size: 19px; }
    .v10-landing .work-client { grid-template-columns: 135px 1fr; }
    .v10-landing .work-client .film-copy { padding: 20px; }
    .v10-landing .work-client .film-copy h3 { font-size: 24px; }
    .v10-landing .work-next { padding: 25px; }
    .v10-landing .bubble-scene { min-height: 405px; height: 405px; }
}
@media (max-width: 760px) {
    .ambient-scene { background-image: radial-gradient(ellipse at 78% 28%, rgba(24,55,101,.24) 0, transparent 60%), linear-gradient(rgba(7,17,42,.35),rgba(7,17,42,.45)), url("brand-background-dark-v10-800.webp"); }
    .mode-stage[data-mode="poster"] { background-image: linear-gradient(120deg,rgba(224,247,248,.4),rgba(224,247,248,.1)), url("brand-background-light-v10-800.webp"); }
    .main-nav { font-family: var(--tiix-heading-font); font-size: 14px; }
    .v10-landing .section { padding: 66px 24px; }
    .v10-landing h2, .v10-landing .about-copy h2, .v10-landing .services-heading h2, .v10-landing .strategy-heading h2, .v10-landing .brief-section h2 { font-size: clamp(36px, 10.4vw, 54px); line-height: 1.1; margin-bottom: 23px; }
    .v10-landing .section-intro { font-size: 16px; line-height: 1.65; }
    .v10-landing .eyebrow { font-size: 8px; margin-bottom: 18px; }
    .v10-landing .hero { min-height: 790px; padding-top: 148px; padding-bottom: 114px; }
    .v10-landing .hero h1.v08-gravity { font-size: clamp(43px, 12.35vw, 72px); line-height: 1.2; margin-bottom: 26px; }
    .v10-landing .hero h1 .dot-anchor { width: .32em; height: .32em; margin-left: .25em; }
    .v10-landing .hero .gravity-letter { text-shadow: 1px -1px #fff, 1px 2px #b8d5e0, 2px 4px #718ba6, 3px 6px #405773, 0 14px 23px #0007; }
    .v10-landing .hero .hero-subtitle { font-size: 19px; line-height: 1.5; margin-bottom: 23px; }
    .v10-landing .idea-chip.pixel, .v10-landing .idea-chip.pop, .v10-landing .idea-chip.bubble, .v10-landing .idea-chip.event, .v10-landing .idea-chip.media { font-size: 13px; line-height: 1.4; padding: 11px 14px; margin: 0; }
    .v10-landing .hero .idea-chips { gap: 9px; margin-bottom: 14px; }
    .v10-landing .hero-audience { font-size: 14px; }
    .v10-landing .hero-brief-cta { margin-top: 74px; }
    .v10-landing .hero-baseline { bottom: 30px; }
    .v10-landing .lab-heading { grid-template-columns: 1fr; gap: 25px; margin-bottom: 25px; }
    .v10-landing .lab-heading h2 { margin-bottom: 13px; }
    .v10-landing .lab-heading .section-intro { font-size: 15px; padding-left: 15px; }
    .v10-landing .lab-status { font-size: 11px; }
    .v10-landing .mode-stage { height: 258px; padding: 22px; }
    .v10-landing .stage-index { left: 18px; top: 18px; max-width: calc(100% - 36px); font-size: 7px; line-height: 1.85; }
    .v10-landing .stage-caption { right: 18px; bottom: 17px; font-size: 7px; }
    .v10-landing .mode-buttons { padding: 12px; gap: 6px; }
    .v10-landing .mode-buttons button { padding: 10px 13px; font-size: 11px; }
    .v10-landing .media-gallery { margin-top: 36px; }
    .v10-landing .gallery-heading h3 { font-size: 29px; }
    .v10-landing .gallery-heading p { font-size: 13px; }
    .v10-landing .brand-films { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-columns: auto; gap: 7px; padding: 34px 0 0; overflow: visible; scroll-snap-type: none; margin: 0; }
    .v10-landing .brand-films .film-card { width: auto; max-width: 100%; min-width: 0; border-radius: 12px; }
    .v10-landing .brand-films .film-media { padding: 4px; }
    .v10-landing .brand-films .film-media video { max-height: none; }
    .v10-landing .brand-films .film-copy { padding: 10px 7px; min-height: 74px; }
    .v10-landing .brand-films .film-copy h3 { font-size: 12px; line-height: 1.4; letter-spacing: -.025em; margin: 0; }
    .v10-landing .brand-films .film-copy .media-status, .v10-landing .brand-films .film-copy > p:last-child { display: none; }
    .v10-landing .brand-films .motion-rail-line { left: calc(100% / 6); right: calc(100% / 6); width: auto !important; }
    .v10-landing .motion-rail-note { font-size: 7px; line-height: 1.95; }
    .v10-landing .work-block { margin-top: 32px; }
    .v10-landing .work-grid { grid-template-columns: none; grid-auto-columns: min(322px, 88vw); gap: 14px; padding-bottom: 13px; }
    .v10-landing .work-client { grid-template-columns: 110px minmax(0, 1fr); min-height: 230px; }
    .v10-landing .work-client .film-media { padding: 7px; }
    .v10-landing .work-client .film-media video { max-height: 235px; }
    .v10-landing .work-client .film-copy { padding: 18px 15px; }
    .v10-landing .work-client .film-copy h3 { font-size: 21px; margin-bottom: 12px; }
    .v10-landing .work-client .film-copy > p:last-child { font-size: 12px; line-height: 1.6; }
    .v10-landing .work-client .media-status { font-size: 6px !important; }
    .v10-landing .work-next { min-height: 230px; padding: 24px; }
    .v10-landing .work-next-mark { font-size: 18px; margin-bottom: 19px; }
    .v10-landing .work-next h3 { font-size: 27px; max-width: none; margin-bottom: 18px; }
    .v10-landing .instagram-cta { font-size: 12px; margin-top: 21px; padding: 13px 18px; }
    .v10-landing .about-layout { grid-template-columns: 1fr; gap: 25px; }
    .v10-landing .about-copy .about-credibility { font-size: 12px !important; line-height: 1.7 !important; padding: 14px 15px; margin-bottom: 22px; }
    .v10-landing .about-copy .section-intro { font-size: 17px; line-height: 1.65; }
    .v10-landing .about-copy > p:not(.eyebrow):not(.section-intro) { font-size: 14px; line-height: 1.75; }
    .v10-landing .about-principles { grid-template-columns: 1fr; gap: 20px; }
    .v10-landing .about-principles h3 { font-size: 14px; }
    .v10-landing .about-principles p { font-size: 12px; }
    .v10-landing .about-visual { max-width: 180px; margin-top: 0; }
    .v10-landing .services-layout { grid-template-columns: 1fr; gap: 22px; }
    .v10-landing .services-heading { position: static; }
    .v10-landing .services-heading .section-intro { font-size: 16px; }
    .v10-landing .service-list { margin: 12px 0 0 3px; }
    .v10-landing .service-row { padding-left: 58px; padding-bottom: 21px; margin-bottom: 22px; }
    .v10-landing .service-row h3 { font-size: 21px; line-height: 1.3; }
    .v10-landing .service-row p { font-size: 13px; line-height: 1.65; }
    .v10-landing .service-row .service-need { font-size: 10px; }
    .v10-landing .service-symbol { width: 42px; height: 42px; }
    .v10-landing .service-symbol .pixel-service-icon { width: 33px; height: 33px; }
    .v10-landing .strategy-layout { grid-template-columns: 1fr; gap: 26px; margin-bottom: 47px; }
    .v10-landing .strategy-heading .section-intro { font-size: 15px; }
    .v10-landing .strategy-steps { margin-top: 23px; font-size: 10px; gap: 10px; }
    .v10-landing .strategy-steps span { padding: 10px 12px; }
    .v10-landing .bubble-scene { height: 350px; min-height: 350px; max-width: 410px; margin-top: 8px; }
    .v10-landing .bubble.b1 { width: 93px; }
    .v10-landing .bubble.b2 { width: 103px; }
    .v10-landing .bubble.b3 { width: 103px; }
    .v10-landing .bubble.b4 { width: 92px; }
    .v10-landing .bubble.b5 { width: 66px; }
    .v10-landing .bubble-core { width: 114px; height: 114px; font-size: 20px; }
    .v10-landing .bubble-core small { font-size: 5px; }
    .v10-landing .bubble-legend { font-size: 7px; }
    .v10-landing .journey-legend { font-size: 11px; gap: 13px; margin-bottom: 22px; }
    .v10-landing .how-grid { grid-template-columns: 1fr 1fr; gap: 22px 17px; }
    .v10-landing .how-step { padding: 19px 13px 23px; }
    .v10-landing .how-step h3 { font-size: 20px; line-height: 1.3; }
    .v10-landing .how-step p { font-size: 12px; line-height: 1.65; }
    .v10-landing .how-step .eyebrow { font-size: 7px; padding: 8px; margin-bottom: 17px; }
    .v10-landing .how-footer { flex-direction: column; align-items: stretch; gap: 23px; margin-top: 29px; }
    .v10-landing .contract-line { font-size: 24px; }
    .v10-landing .response-promise { max-width: none; gap: 12px; }
    .v10-landing .response-highlight, .v10-landing .plan-response { font-size: 13px; line-height: 1.65; padding: 15px 16px; }
    .v10-landing .brief-layout { grid-template-columns: 1fr; gap: 26px; }
    .v10-landing .brief-section .section-intro { font-size: 16px; }
    .v10-landing .dot-speech-slot { width: 210px; height: 104px; }
    .v10-landing .brief-contact { margin-top: 0; font-size: 14px; gap: 14px; padding-bottom: 0; }
    .site-footer .footer-contact { gap: 12px; padding-bottom: 18px; }
    .site-footer .footer-contact-email { font-size: 20px; }
    .site-footer .footer-contact-phone { font-size: 16px; }
}
@media (max-width: 359px) {
    .v10-landing .hero h1.v08-gravity { font-size: 39px; }
    .v10-landing .idea-chip.pixel, .v10-landing .idea-chip.pop, .v10-landing .idea-chip.bubble, .v10-landing .idea-chip.event, .v10-landing .idea-chip.media { font-size: 12px; }
    .v10-landing .work-client { grid-template-columns: 95px 1fr; }
    .v10-landing .work-client .film-copy h3 { font-size: 21px; }
    .v10-landing .how-step h3 { font-size: 18px; }
}
/* Keep the existing transform-based orbit choreography centred in its smaller illustration. */
.v10-landing .bubble-scene .bubble { left: 50%; top: 47%; right: auto; bottom: auto; }
.v10-landing .bubble.b1 { --bubble-x: -140px; --bubble-y: -105px; --bubble-z: 20px; }
.v10-landing .bubble.b2 { --bubble-x: 128px; --bubble-y: -94px; --bubble-z: -15px; }
.v10-landing .bubble.b3 { --bubble-x: -132px; --bubble-y: 88px; --bubble-z: -20px; }
.v10-landing .bubble.b4 { --bubble-x: 136px; --bubble-y: 90px; --bubble-z: 15px; }
.v10-landing .bubble.b5 { --bubble-x: 0px; --bubble-y: -158px; --bubble-z: 0px; }
.v10-landing .bubble-core { left: 50%; top: 47%; }
.v10-landing .bubble-scene[data-phase="plan"] .bubble { width: 86px; }
.v10-landing .bubble-scene[data-phase="plan"] .b1 { --bubble-x: -158px; --bubble-y: -94px; }
.v10-landing .bubble-scene[data-phase="plan"] .b2 { --bubble-x: -79px; --bubble-y: -47px; }
.v10-landing .bubble-scene[data-phase="plan"] .b3 { --bubble-x: 0px; --bubble-y: 0px; }
.v10-landing .bubble-scene[data-phase="plan"] .b4 { --bubble-x: 79px; --bubble-y: 47px; }
.v10-landing .bubble-scene[data-phase="plan"] .b5 { --bubble-x: 158px; --bubble-y: 94px; }
@media (max-width: 760px) {
    .v10-landing .bubble.b1 { --bubble-x: -104px; --bubble-y: -80px; --bubble-z: 0px; }
    .v10-landing .bubble.b2 { --bubble-x: 96px; --bubble-y: -74px; --bubble-z: 0px; }
    .v10-landing .bubble.b3 { --bubble-x: -101px; --bubble-y: 75px; --bubble-z: 0px; }
    .v10-landing .bubble.b4 { --bubble-x: 104px; --bubble-y: 78px; --bubble-z: 0px; }
    .v10-landing .bubble.b5 { --bubble-x: 0px; --bubble-y: -126px; --bubble-z: 0px; }
    .v10-landing .bubble-scene[data-phase="plan"] .bubble { width: 72px; }
    .v10-landing .bubble-scene[data-phase="plan"] .b1 { --bubble-x: -112px; --bubble-y: -84px; }
    .v10-landing .bubble-scene[data-phase="plan"] .b2 { --bubble-x: -56px; --bubble-y: -42px; }
    .v10-landing .bubble-scene[data-phase="plan"] .b4 { --bubble-x: 56px; --bubble-y: 42px; }
    .v10-landing .bubble-scene[data-phase="plan"] .b5 { --bubble-x: 112px; --bubble-y: 84px; }
}

/* TiiX CSS source: assets/v10-motion.css */
/* A distant, single quiet burst: CSS gradients only, no late image or LCP-sized node. */
.ambient-scene::before {
  content: "";
  position: absolute;
  width: 104px;
  height: 104px;
  left: 69%;
  top: 13%;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(232,251,255,.8) 0 1px, rgba(47,216,236,.35) 2px, transparent 5px),
    radial-gradient(circle, transparent 0 22%, rgba(47,216,236,.13) 23% 24%, transparent 26%),
    radial-gradient(ellipse, rgba(47,216,236,.1), transparent 65%);
  opacity: .08;
  transform: translate3d(calc(var(--pointer-x, 0) * -6px), calc(var(--pointer-y, 0) * -4px), -180px) scale(.7);
  animation: tiix-distant-supernova 24s ease-in-out 1 both;
}
@keyframes tiix-distant-supernova {
  0%, 8% { opacity: .08; transform: translate3d(0,0,-180px) scale(.7); }
  28% { opacity: .25; transform: translate3d(0,0,-180px) scale(1.4); }
  58%, 100% { opacity: .06; transform: translate3d(0,0,-180px) scale(2); }
}
.space-stars .space-star:nth-child(3n) { transform: scale(.6) translateZ(-60px); filter: blur(.35px); }
.space-stars .space-star:nth-child(7n) { transform: scale(1.15) translateZ(40px); }
.video-autoplay-retry {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  margin: 8px 0 0;
  padding: 9px 14px;
  border: 1px solid #2FD8EC;
  border-radius: 999px;
  background: #2FD8EC;
  color: #07152d;
  font: 700 12px/1.35 "Montserrat", sans-serif;
  cursor: pointer;
  touch-action: manipulation;
}
.video-autoplay-retry[hidden], .video-autoplay-fallback[hidden] { display: none !important; }
.video-autoplay-retry:focus-visible { outline: 2px solid white; outline-offset: 3px; }
.motion-paused .ambient-scene::before { animation-play-state: paused; }
@media (max-width: 760px) {
  .ambient-scene::before { width: 72px; height: 72px; left: 70%; top: 17%; }
  .video-autoplay-retry { padding: 7px 10px; font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  html:not(.motion-enabled) .ambient-scene::before { animation: none; opacity: .08; }
}

/* Reveal native playback only after the adapter records a real autoplay failure. */
.film-card.is-autoplay-blocked .film-media video::-webkit-media-controls {
  display: flex !important;
}
@media (max-width: 760px) {
  /* Retry links/buttons are appended after the caption; they must not reveal it. */
  .v10-landing .brand-films .film-copy > p:last-of-type { display: none; }
}

/* The story dot leaves its logo origin; the placeholder keeps its geometry. */
.tiix-story-page.dot-journey-active [data-logo-dot] { opacity: 0; }

/* Final punctuation reserves the full 36px orb footprint and then stays still. */
.dot-terminal-heading [data-dot-terminal] { width: 44px; height: 36px; margin-left: 12px; }
body.dot-docked .dot-terminal-heading { animation: none !important; transform: none; }
#story-dot.is-docked::before, #story-dot.is-docked::after { animation: none; display: none; }
.v10-landing .story-page-link { margin: 4px 16px 0 0; }

/* TiiX CSS source: wp.css */
/* WordPress integration only. Approved visual assets stay frozen. */
body.admin-bar .site-header{top:32px}
.tiix-trap{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.tiix-message{padding:23px;border:1px solid #2fd8ec55;border-radius:16px;margin:30px 0;color:#dffcff}
.tiix-message.error{border-color:#ff7fae80;color:#ffe7ef}
@media(max-width:782px){body.admin-bar .site-header{top:46px}}
.hubspot-brief-frame{background:#1b2b57;color:#f6f8ff;border:1px solid #2fd8ec66;border-radius:18px;overflow:hidden;box-shadow:0 18px 45px #0003;margin:28px 0;padding:12px}
.hubspot-brief-frame .hs-form-frame{width:100%;min-height:200px}
.hubspot-brief-frame iframe{max-width:100%;border:0}
.hubspot-loading{font:16px/1.6 Montserrat,Arial,sans-serif;margin:20px;color:#f6f8ff}
.hs-form-frame:not(:empty)+.hubspot-loading{display:none}
@media(max-width:760px){.hubspot-brief-frame{padding:4px;border-radius:12px}}
/* The inflated title belongs only to the landing hero, including on legal/brief routes. */
.inner-page :is(h1,h2){font-family:Montserrat,Arial,sans-serif;font-weight:800;text-shadow:none!important;-webkit-text-stroke:0;transform:none;animation:none!important}
.inner-page .eyebrow{font-family:var(--pixel-font);font-weight:400;font-size:10px;line-height:1.8;letter-spacing:0}
.inner-page .eyebrow::before{width:16px;height:16px;flex:0 0 16px;background:currentColor;clip-path:polygon(38% 0,62% 0,62% 25%,100% 25%,100% 62%,62% 62%,62% 100%,38% 100%,38% 62%,0 62%,0 25%,38% 25%)}
@media(max-width:760px){.inner-page .eyebrow{font-size:8px}}