/* Courthology Studio. Loaded after site.css on /studio/ pages. */
.t-studio{
  --paper:#070a09; --paper-2:#0e1412; --card:#0c1110;
  --ink:#eef2ee; --ink-2:#c3cbc6; --muted:#97a29c; --line:rgba(238,242,238,.1); --line-2:rgba(238,242,238,.2);
  --accent:#7be3a0; --accent-2:#7be3a0; --accent-soft:rgba(123,227,160,.12); --teal:#3fd0c9;
  --focus:0 0 0 2px #070a09,0 0 0 4px #7be3a0;
  color-scheme:dark;
}
.t-studio body{background:var(--paper);color:var(--ink)}
.t-studio h1,.t-studio h2,.t-studio .display{font-family:var(--sans);font-weight:600;letter-spacing:-.045em}
.t-studio h2{font-size:clamp(2.1rem,4.6vw,3.8rem);line-height:1.02}
.t-studio .display{font-size:clamp(3rem,7.6vw,6.6rem);line-height:.95}
.t-studio h2 em,.t-studio .display em{font-style:normal;color:transparent;background:linear-gradient(100deg,#7be3a0 10%,#3fd0c9 90%);-webkit-background-clip:text;background-clip:text}
.t-studio .kicker{font-family:var(--mono);font-weight:500;letter-spacing:.06em;text-transform:none;font-size:13px}
.t-studio .kicker::before{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent)}
.t-studio .btn{background:var(--ink);color:#070a09;border-color:var(--ink)}
.t-studio .btn:hover{background:var(--accent);border-color:var(--accent);color:#04120a}
.t-studio .btn.ghost{background:rgba(255,255,255,.03);color:var(--ink);border-color:var(--line-2)}
.t-studio .btn.ghost:hover{border-color:var(--ink);background:rgba(255,255,255,.07)}
.t-studio header.site{background:rgba(7,10,9,.7)}
.t-studio header.site.solid{background:rgba(7,10,9,.92);border-color:var(--line)}
.t-studio .brand .slash{color:var(--accent)}
.pill{font:500 12px/1 var(--mono);letter-spacing:.04em;padding:6px 9px;border-radius:999px;border:1px solid var(--line-2);color:var(--accent);margin-left:4px}
.t-studio nav.top a:hover{background:rgba(255,255,255,.06)}
.t-studio nav.top a[aria-current="page"]{background:rgba(255,255,255,.08)}
nav.top .return{display:inline-flex;align-items:center;gap:6px;color:var(--muted);margin-left:8px;border-left:1px solid var(--line);border-radius:0;padding-left:16px}
nav.top .return .i{width:16px;height:16px}
nav.top .nav-cta{display:none}
@media (max-width:980px){
  .t-studio.js nav.top{background:#0a0e0d}
  nav.top .return{margin:0;border-left:0;padding-left:4px;color:var(--accent)}
  nav.top .nav-cta{display:flex;justify-content:center;margin-top:18px;border:0;color:#070a09}
}
.t-studio .site-foot{background:#040605;border-top:1px solid var(--line)}
.t-studio .crumbs li+li::before{color:var(--muted)}

/* ---------- studio hero + tree ---------- */
.s-hero{position:relative;min-height:min(100svh,980px);display:flex;align-items:flex-start;padding:clamp(56px,8vw,110px) 0 0;overflow:hidden;isolation:isolate}
.s-hero .wrap{position:relative;z-index:3}
.s-hero-copy{max-width:640px}
.s-hero-copy .lede{margin-top:26px;color:var(--ink-2);max-width:46ch}
.s-hero .tree-wrap{position:absolute;inset:auto 0 0 0;height:min(92%,880px);z-index:1;pointer-events:none;will-change:transform,opacity}
.s-hero .tree{position:absolute;right:-6%;bottom:0;width:min(1120px,88vw);height:auto}
.s-hero::after{content:"";position:absolute;inset:auto 0 0 0;height:180px;background:linear-gradient(transparent,var(--paper));z-index:2;pointer-events:none}
.s-hero .hero-meta{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:40px;font:500 13px/1.4 var(--mono);color:var(--muted)}
.s-hero .hero-meta span::before{content:"/ ";color:var(--accent)}
.tree .t-motes circle{opacity:0}
/* sequence: armed only when JS has run and motion is allowed */
.tree.arm .t-roots path,.tree.arm .t-branches path{stroke-dasharray:1;stroke-dashoffset:1}
.tree.arm .t-trunk,.tree.arm .t-ground{opacity:0}
.tree.arm .t-leaves path{opacity:0}
.tree.arm .t-leaves .sway{scale:.15;opacity:0}
.tree.arm .t-light{opacity:0}
.tree.play .t-ground{animation:fadein .8s var(--ease) forwards}
.tree.play .t-roots path{animation:draw 1.3s var(--ease-out) forwards;animation-delay:var(--d)}
.tree.play .t-trunk{animation:fadein .9s var(--ease) .55s forwards}
.tree.play .t-branches path{animation:draw var(--dur,1s) var(--ease-out) forwards;animation-delay:var(--d)}
.tree.play .t-leaves path{animation:fadein .7s var(--ease) forwards;animation-delay:calc(var(--d) + .15s)}
.tree.play .t-leaves .sway{animation:grow 1.6s var(--ease-out) forwards;animation-delay:var(--d)}
.tree.play .t-light{animation:fadein 2.4s var(--ease) 2s forwards}
.tree.live .t-leaves .sway{animation:sway 7s ease-in-out infinite alternate;animation-delay:calc(var(--k) * -1.3s)}
.tree.live .t-motes circle{animation:mote 9s ease-in-out infinite;animation-delay:calc(var(--m) * -1.2s)}
.tree.live .t-light{animation:breathe 8s ease-in-out infinite alternate}
@keyframes grow{0%{scale:.15;opacity:0}40%{opacity:1}100%{scale:1;opacity:1}}
@keyframes sway{from{transform:rotate(-1.1deg)}to{transform:rotate(1.3deg)}}
@keyframes mote{0%{opacity:0;transform:translate(0,0)}30%{opacity:.8}100%{opacity:0;transform:translate(var(--dx),-60px)}}
@keyframes breathe{from{opacity:.75}to{opacity:1}}
.s-hero .scroll-cue{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);z-index:3;font:500 12px/1 var(--mono);color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:10px}
.s-hero .scroll-cue i{width:1px;height:38px;background:linear-gradient(var(--accent),transparent);animation:cue 2.4s var(--ease) infinite}
@media (max-width:860px){
  .s-hero{min-height:auto;padding-bottom:0;display:block}
  .s-hero .tree-wrap{position:relative;height:auto;margin-top:-10px}
  .s-hero .tree{position:relative;right:auto;width:150%;max-width:none;margin-left:-25%}
  .s-hero .scroll-cue{display:none}
}

/* ---------- section index (sticky) ---------- */
.s-index{position:sticky;top:72px;z-index:50;background:rgba(7,10,9,.86);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.s-index ol{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding:10px 0}
.s-index ol::-webkit-scrollbar{display:none}
.s-index a{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;padding:8px 14px;border-radius:999px;font-size:14px;color:var(--muted);font-weight:500}
.s-index a b{font:500 12px/1 var(--mono);color:var(--accent);opacity:.8}
.s-index a:hover{color:var(--ink);background:rgba(255,255,255,.05)}
.s-index a.on{color:var(--ink);background:rgba(123,227,160,.1)}

/* ---------- thread: the trunk that runs through the page ---------- */
.thread{position:relative}
.thread>section{position:relative}
.thread::before{content:"";position:absolute;left:max(calc((100vw - var(--max))/2 + var(--gutter) - 28px),10px);top:0;bottom:0;width:1px;background:linear-gradient(var(--accent),rgba(123,227,160,.15) 30%,rgba(63,208,201,.15) 70%,transparent)}
.node{position:absolute;left:max(calc((100vw - var(--max))/2 + var(--gutter) - 32px),6px);top:clamp(84px,11vw,150px);width:9px;height:9px;border-radius:50%;background:var(--paper);border:1.5px solid var(--accent);box-shadow:0 0 0 5px rgba(123,227,160,.08)}
@media (max-width:700px){.thread::before{left:8px}.node{left:4px}}

/* ---------- disciplines ---------- */
.disc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:22px;overflow:hidden}
.disc a{position:relative;display:flex;flex-direction:column;gap:14px;min-height:280px;padding:30px;background:var(--card);transition:background .35s var(--ease)}
.disc a::after{content:"";position:absolute;inset:0;background:radial-gradient(400px 200px at var(--mx,50%) var(--my,0%),rgba(123,227,160,.13),transparent 70%);opacity:0;transition:opacity .35s var(--ease);pointer-events:none}
.disc a:hover::after,.disc a:focus-visible::after{opacity:1}
.disc a:hover{background:#0f1614}
.disc .num{font:500 12px/1 var(--mono);color:var(--muted)}
.disc h3{font-size:1.45rem;font-weight:600;letter-spacing:-.025em}
.disc p{color:var(--ink-2);font-size:15.5px}
.disc .go{margin-top:auto;display:inline-flex;gap:8px;align-items:center;color:var(--accent);font-weight:600;font-size:14.5px}
.disc .go .i{transition:transform .25s var(--ease)}
.disc a:hover .go .i{transform:translateX(4px)}
.disc .glyph{width:44px;height:44px;color:var(--accent)}
@media (max-width:980px){.disc{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.disc{grid-template-columns:1fr}.disc a{min-height:0}}

/* ---------- roots diagram ---------- */
.roots-diagram{border:1px solid var(--line);border-radius:22px;background:radial-gradient(800px 400px at 50% 100%,rgba(123,227,160,.08),transparent 70%),var(--card);padding:clamp(20px,3vw,40px);overflow:hidden}
.roots-diagram svg{width:100%;height:auto}
.roots-diagram text{font-family:var(--sans);fill:var(--ink);font-size:15px;font-weight:600}
.roots-diagram .sub{fill:var(--muted);font-size:12.5px;font-weight:500;font-family:var(--mono)}
.roots-diagram .link{fill:none;stroke:url(#lineG);stroke-width:1.6}
.roots-diagram .dot{fill:#070a09;stroke:var(--accent);stroke-width:1.6}
.roots-diagram a:focus-visible rect,.roots-diagram a:hover rect{stroke:var(--accent)}
.roots-diagram rect{fill:#0c1110;stroke:rgba(238,242,238,.18);rx:12}
.js .roots-diagram .link{stroke-dasharray:1;stroke-dashoffset:1}
.js .roots-diagram.in .link{animation:draw 1.6s var(--ease-out) forwards;animation-delay:calc(var(--i) * .12s)}
.connect-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:28px}
.connect-list div{padding-top:16px;border-top:1px solid var(--line)}
.connect-list h3{font-size:1rem;font-weight:600;margin-bottom:6px}
.connect-list p{color:var(--ink-2);font-size:15px}
@media (max-width:800px){.connect-list{grid-template-columns:1fr}.roots-diagram .hide-m{display:none}}

/* ---------- work showcase ---------- */
.showcase{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.showcase .sc{border:1px solid var(--line);border-radius:18px;background:var(--card);overflow:hidden;display:flex;flex-direction:column}
.showcase .sc-art{aspect-ratio:4/3;overflow:hidden;position:relative;background:#0a0f0d;border-bottom:1px solid var(--line)}
.showcase .sc-art .demo-frame{transform:scale(.62);transform-origin:top left;width:161%;height:161%;border:0;border-radius:0;pointer-events:none}
.showcase .sc-body{padding:22px;display:flex;flex-direction:column;gap:8px;flex:1}
.showcase .sc-body small{font:500 12px/1 var(--mono);color:var(--accent)}
.showcase h3{font-size:1.15rem;font-weight:600}
.showcase p{color:var(--ink-2);font-size:15px}
.showcase .arrow-link{margin-top:auto}
@media (max-width:980px){.showcase{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.showcase{grid-template-columns:1fr}}
.request{margin-top:28px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:26px 30px;border:1px dashed var(--line-2);border-radius:18px}
.request p{color:var(--ink-2);max-width:62ch}

/* ---------- process ---------- */
.process{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;counter-reset:p;border-top:1px solid var(--line)}
.process li{position:relative;padding:28px 22px 0 0}
.process li::before{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--paper);border:1.5px solid var(--accent)}
.process b{display:block;font:500 12px/1 var(--mono);color:var(--accent);margin-bottom:12px}
.process h3{font-size:1.15rem;font-weight:600;margin-bottom:8px}
.process p{color:var(--ink-2);font-size:15px}
.process.four{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:900px){.process,.process.four{grid-template-columns:1fr 1fr;row-gap:30px}}
@media (max-width:520px){.process,.process.four{grid-template-columns:1fr}}

/* ---------- giving back ---------- */
.giving{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(30px,5vw,80px);align-items:center;border:1px solid var(--line);border-radius:26px;padding:clamp(28px,5vw,70px);background:radial-gradient(600px 400px at 85% 80%,rgba(123,227,160,.12),transparent 70%),var(--card);overflow:hidden}
.giving .stack p{color:var(--ink-2)}
.giving .seedling{width:100%;max-width:360px;justify-self:center;color:var(--accent)}
.giving .facts-row{display:grid;gap:12px;margin-top:26px}
.giving .facts-row div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:12px 0;border-top:1px solid var(--line);font-size:15px}
.giving .facts-row dt{font:500 12.5px/1.6 var(--mono);color:var(--muted)}
.giving .facts-row dd{color:var(--ink)}
@media (max-width:860px){.giving{grid-template-columns:1fr}.giving .seedling{max-width:220px;order:-1}.giving .facts-row div{grid-template-columns:1fr;gap:4px}}

/* ---------- final CTA ---------- */
.s-cta{text-align:center;padding:clamp(80px,12vw,160px) 0;position:relative;overflow:hidden}
.s-cta::before{content:"";position:absolute;left:50%;top:0;width:1px;height:90px;background:linear-gradient(transparent,var(--accent))}
.s-cta h2{max-width:16ch;margin:0 auto}
.s-cta .lede{margin:22px auto 0}
.s-cta .actions{justify-content:center}

/* ---------- service pages ---------- */
.svc-tabs{border-bottom:1px solid var(--line);position:sticky;top:72px;z-index:40;background:rgba(7,10,9,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.svc-tabs ul{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.svc-tabs ul::-webkit-scrollbar{display:none}
.svc-tabs a{display:block;white-space:nowrap;padding:16px 14px;font-size:14.5px;font-weight:500;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px}
.svc-tabs a:hover{color:var(--ink)}
.svc-tabs a[aria-current]{color:var(--ink);border-color:var(--accent)}
.svc-hero{padding:clamp(48px,7vw,96px) 0 clamp(40px,5vw,72px)}
.svc-hero .grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,5vw,72px);align-items:center}
.svc-hero h1{font-size:clamp(2.6rem,5.4vw,4.6rem);line-height:1;letter-spacing:-.045em;font-weight:600}
.svc-hero .lede{margin-top:22px;color:var(--ink-2)}
@media (max-width:900px){.svc-hero .grid{grid-template-columns:1fr}}
.deliv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden}
.deliv div{background:var(--card);padding:28px}
.deliv b{font:500 12px/1 var(--mono);color:var(--accent)}
.deliv h3{font-size:1.1rem;font-weight:600;margin:14px 0 8px}
.deliv p{color:var(--ink-2);font-size:15px}
@media (max-width:900px){.deliv{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.deliv{grid-template-columns:1fr}}
.problem{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,96px)}
.problem h2{font-size:clamp(1.9rem,3.6vw,3rem)}
.problem .stack p{font-size:1.1rem}
@media (max-width:800px){.problem{grid-template-columns:1fr}}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.pair a{display:block;padding:28px;border:1px solid var(--line);border-radius:18px;background:var(--card);transition:border-color .25s var(--ease)}
.pair a:hover{border-color:var(--accent)}
.pair small{font:500 12px/1 var(--mono);color:var(--muted)}
.pair h3{font-size:1.25rem;font-weight:600;margin:10px 0 6px}
.pair p{color:var(--ink-2);font-size:15px}
@media (max-width:700px){.pair{grid-template-columns:1fr}}
.note-box{border-left:2px solid var(--accent);padding:6px 0 6px 20px;color:var(--ink-2)}

/* ---------- concept demos ---------- */
.demo{margin:0}
.demo-frame{position:relative;border:1px solid var(--line-2);border-radius:18px;overflow:hidden;background:#0b100e;aspect-ratio:4/3;box-shadow:0 40px 80px -40px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.02) inset}
.demo-tag{position:absolute;bottom:12px;right:12px;z-index:5;font:600 12px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;padding:6px 9px;border-radius:999px;background:rgba(7,10,9,.8);border:1px solid var(--line-2);color:var(--accent)}
.demo figcaption{margin-top:14px;font-size:13.5px;color:var(--muted)}
.dm{position:absolute;inset:0;font-family:var(--sans);color:#eef2ee}
.dm *{box-sizing:border-box}
/* brand board */
.dm-brand{display:grid;grid-template-columns:1.2fr 1fr;grid-template-rows:1.25fr 1fr;gap:10px;padding:14px}
.dm-brand>div{border-radius:12px;overflow:hidden;position:relative;padding:16px}
.dm-brand .b1{background:#f1ede4;color:#1d2a52;display:grid;place-items:center;grid-row:1}
.dm-brand .b1 svg{width:62%;height:auto}
.dm-brand .b2{background:#1d2a52;color:#f1ede4;display:flex;flex-direction:column;justify-content:space-between}
.dm-brand .b2 .aa{font:600 54px/1 var(--serif)}
.dm-brand .b2 small{font:500 10px/1.4 var(--mono);opacity:.75}
.dm-brand .b3{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:0;background:none}
.dm-brand .b3 span{border-radius:8px;display:flex;align-items:flex-end;padding:8px;font:500 9px/1 var(--mono)}
.dm-brand .b4{background:#e66a3c;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;gap:6px}
.dm-brand .b4 b{font:600 20px/1.05 var(--sans);letter-spacing:-.02em}
.dm-brand .b4 small{font:500 10px var(--mono);opacity:.85}
/* marketing */
.dm-mkt{display:grid;grid-template-columns:1.25fr 1fr;gap:12px;padding:14px}
.dm-mkt .lp{background:#f7f6f2;color:#111;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:10px;overflow:hidden}
.dm-mkt .lp .nav{display:flex;justify-content:space-between;font:600 8px var(--sans)}
.dm-mkt .lp .nav i{display:inline-block;width:22px;height:5px;background:#ddd;border-radius:3px;margin-left:4px}
.dm-mkt .lp .h4{display:block;font:600 19px/1.02 var(--sans);letter-spacing:-.03em;margin-top:8px}
.dm-mkt .lp p{font-size:9px;color:#555;line-height:1.4}
.dm-mkt .lp .cta{align-self:flex-start;background:#111;color:#fff;font:600 9px var(--sans);padding:7px 12px;border-radius:999px}
.dm-mkt .lp .img{flex:1;border-radius:8px;background:linear-gradient(135deg,#cfe9d9,#9fd3b4 60%,#5fae7a)}
.dm-mkt .fn{display:flex;flex-direction:column;gap:8px;justify-content:center}
.dm-mkt .fn div{height:44px;border-radius:8px;background:linear-gradient(90deg,rgba(123,227,160,.35),rgba(63,208,201,.18));display:flex;align-items:center;justify-content:space-between;padding:0 12px;font:500 10px var(--mono);margin:0 auto}
.dm-mkt .fn div b{font-family:var(--sans);font-size:14px}
.dm-mkt .fn small{font:500 9px var(--mono);color:#97a29c;text-align:center}
/* ux */
.dm-ux{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:14px}
.dm-ux .col{border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px}
.dm-ux .wf{background:#121816;border:1px dashed rgba(238,242,238,.25)}
.dm-ux .wf i{display:block;background:rgba(238,242,238,.12);border-radius:5px}
.dm-ux .hi{background:#f6f7f5;color:#141a17}
.dm-ux .hi .h{font:600 13px/1.1 var(--sans)}
.dm-ux .hi .card{border-radius:8px;padding:9px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.08);font-size:9px;display:flex;justify-content:space-between;align-items:center}
.dm-ux .hi .card b{font-size:10px}
.dm-ux .hi .tag{background:#e1f3e8;color:#1d6a44;border-radius:999px;padding:3px 7px;font:600 8px var(--sans)}
.dm-ux .hi .btnx{margin-top:auto;background:#1d6a44;color:#fff;text-align:center;border-radius:8px;padding:9px;font:600 10px var(--sans)}
.dm-ux .arrow{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;background:#7be3a0;color:#04120a;display:grid;place-items:center;font-weight:700}
/* apps */
.dm-apps{display:flex;justify-content:center;align-items:center;gap:12px;padding:16px;background:radial-gradient(circle at 50% 60%,rgba(123,227,160,.15),transparent 60%)}
.dm-apps .ph{width:28%;aspect-ratio:9/18.5;border-radius:18px;background:#f5f5f2;border:4px solid #1b1f1d;color:#111;padding:10px 8px;display:flex;flex-direction:column;gap:6px;overflow:hidden;box-shadow:0 20px 40px -20px rgba(0,0,0,.8)}
.dm-apps .ph:nth-child(2){transform:translateY(-10px);width:31%}
.dm-apps .ph .t{font:600 10px/1.1 var(--sans)}
.dm-apps .ph .s{font-size:7px;color:#666}
.dm-apps .ph .img{height:34%;border-radius:8px;background:linear-gradient(160deg,#2b8a59,#9fd3b4)}
.dm-apps .ph .row{height:16px;border-radius:5px;background:#e7e7e2}
.dm-apps .ph .cal{display:grid;grid-template-columns:repeat(5,1fr);gap:3px}
.dm-apps .ph .cal i{aspect-ratio:1;border-radius:3px;background:#e7e7e2}
.dm-apps .ph .cal i.on{background:#2b8a59}
.dm-apps .ph .go{margin-top:auto;background:#111;color:#fff;border-radius:7px;text-align:center;font:600 8px var(--sans);padding:6px}
.dm-apps .ph .ok{margin:auto;width:42px;height:42px;border-radius:50%;background:#2b8a59;color:#fff;display:grid;place-items:center;font-size:18px}
/* platforms */
.dm-plat{display:grid;grid-template-columns:1.5fr 1fr;gap:12px;padding:14px}
.dm-plat .dash{background:#f4f5f3;color:#141a17;border-radius:12px;display:grid;grid-template-columns:44px 1fr;overflow:hidden}
.dm-plat .side{background:#141a17;display:flex;flex-direction:column;gap:8px;padding:10px 8px}
.dm-plat .side i{height:18px;border-radius:5px;background:rgba(255,255,255,.12)}
.dm-plat .side i:first-child{background:#7be3a0}
.dm-plat .main{padding:12px;display:flex;flex-direction:column;gap:8px}
.dm-plat .main .h{font:600 12px var(--sans)}
.dm-plat .kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.dm-plat .kpis div{background:#fff;border-radius:7px;padding:7px;font-size:7.5px;color:#666}
.dm-plat .kpis b{display:block;font:600 13px var(--sans);color:#111}
.dm-plat .chart{flex:1;background:#fff;border-radius:7px;padding:8px;display:flex;align-items:flex-end;gap:4px}
.dm-plat .chart i{flex:1;background:#2b8a59;border-radius:3px 3px 0 0;opacity:.85}
.dm-plat .tbl i{display:block;height:10px;background:#fff;border-radius:3px;margin-top:4px}
.dm-plat .arch{display:flex;flex-direction:column;gap:8px;justify-content:center}
.dm-plat .arch div{border:1px solid rgba(238,242,238,.2);border-radius:9px;padding:9px 10px;font:500 10px var(--mono);color:#c3cbc6;display:flex;justify-content:space-between;background:#0e1412}
.dm-plat .arch div b{color:#7be3a0;font-weight:500}
.dm-plat .arch .ln{height:10px;width:1px;background:#7be3a0;margin:-8px auto;border:0;padding:0;border-radius:0}
/* cms */
.dm-cms{display:grid;grid-template-columns:1.5fr 1fr;gap:12px;padding:14px}
.dm-cms .ed{background:#f6f6f3;color:#141a17;border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px}
.dm-cms .ed label{font:600 8px var(--mono);color:#777;text-transform:uppercase;letter-spacing:.06em}
.dm-cms .ed .f{background:#fff;border:1px solid #e1e1dc;border-radius:6px;padding:7px 8px;font-size:10px}
.dm-cms .ed .f.big{font:600 14px/1.15 var(--serif)}
.dm-cms .ed .f.body{flex:1;font-size:8.5px;color:#666;line-height:1.5}
.dm-cms .wfl{display:flex;flex-direction:column;gap:8px;justify-content:center}
.dm-cms .st{display:flex;align-items:center;gap:8px;font:500 11px var(--sans);padding:10px;border-radius:9px;border:1px solid rgba(238,242,238,.14);background:#0e1412;color:#c3cbc6}
.dm-cms .st i{width:9px;height:9px;border-radius:50%;border:1.5px solid #97a29c}
.dm-cms .st.done i{background:#7be3a0;border-color:#7be3a0}
.dm-cms .st.now{border-color:#7be3a0;color:#eef2ee}
.dm-cms .st.now i{border-color:#7be3a0;box-shadow:0 0 0 4px rgba(123,227,160,.2)}
.dm-cms .st small{margin-left:auto;font:500 9px var(--mono);color:#97a29c}

/* ---------- enquiry (dark form) ---------- */
.t-studio .field input,.t-studio .field select,.t-studio .field textarea{background:#0c1110;border-color:var(--line-2);color:var(--ink)}
.t-studio .field input:focus,.t-studio .field select:focus,.t-studio .field textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(123,227,160,.2)}
.t-studio .choices label{background:#0c1110;border-color:var(--line-2)}
.t-studio .choices label:has(input:checked){background:rgba(123,227,160,.12);border-color:var(--accent)}
.t-studio .field .err{color:#ff9b91}
.t-studio .field [aria-invalid="true"]{border-color:#ff9b91}
.t-studio .notice.ok{background:rgba(123,227,160,.1);border-color:rgba(123,227,160,.45);color:#d6f7e2}
.t-studio .notice.bad{background:rgba(255,120,110,.08);border-color:rgba(255,155,145,.45);color:#ffd9d5}
.t-studio .form-side{background:var(--card)}
.t-studio .steps-mini li{border-color:var(--line)}

@media (prefers-reduced-motion:reduce){
  .tree.live .t-leaves .sway,.tree.live .t-motes circle,.tree.live .t-light{animation:none}
  .js .roots-diagram .link{stroke-dashoffset:0}
}
.t-studio .site-foot h2{font:600 12.5px/1 var(--sans);letter-spacing:.14em;color:#8d9792}
.t-studio .notice h2{font:600 1.05rem/1.3 var(--sans);letter-spacing:-.01em}
.s-hero .scroll-cue{display:none}
@media (max-width:980px){.t-studio nav.top .nav-cta{border-radius:999px;border:0;font-size:16px}}

.t-studio .brand .mark{width:46px;height:46px}