/* AI Infrastructure & Cloud · hero — ink band, headline + brief, then the bento of five telemetry tiles. */
.tic-hero{position:relative;overflow:hidden;isolation:isolate;padding-top:var(--bdh-hero-t);padding-bottom:clamp(64px,7vw,104px)}
.tic-hero__dots{position:absolute;inset:0;z-index:-1;pointer-events:none;
  -webkit-mask-image:radial-gradient(60% 55% at 78% 8%,#000 0%,transparent 75%);mask-image:radial-gradient(60% 55% at 78% 8%,#000 0%,transparent 75%)}

/* ---- top line ---- */
.tic-hero__top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 32px}
.tic-crumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:6px 0;font-size:var(--t-sm);color:var(--on-ink-3)}
.tic-crumb li+li::before{content:"/";margin-inline:10px;color:var(--on-ink-line)}
.tic-crumb a{color:var(--on-ink-2);text-decoration:underline;text-decoration-color:var(--on-ink-line);text-underline-offset:4px;transition:color var(--d1) var(--e-io),text-decoration-color var(--d1) var(--e-io)}
.tic-crumb a:hover{color:var(--on-ink);text-decoration-color:var(--blue)}
.tic-crumb [aria-current]{color:var(--on-ink);font-weight:500}
.tic-hero__eb{display:inline-flex;align-items:center;gap:12px;font-family:var(--f);font-size:var(--t-lbl);font-weight:500;letter-spacing:.14em;text-transform:uppercase;line-height:1.5;color:var(--on-ink-2)}
.tic-hero__eb .tic-led{box-shadow:0 0 0 4px var(--blue-wash-2)}

/* ---- headline + brief ---- */
.tic-hero__intro{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--tic-gap);row-gap:36px;align-items:end;margin-top:clamp(44px,5.4vw,80px)}
.tic-hero__h{grid-column:1 / span 7;align-self:end;font-family:var(--f-h);font-size:clamp(2.45rem,5.1vw,4.65rem);font-weight:500;line-height:1;letter-spacing:-.035em;color:var(--on-ink);max-width:15ch;text-wrap:balance}
.tic-hero__brief{grid-column:8 / -1;padding-left:clamp(0px,2vw,32px);display:flex;flex-direction:column;align-items:flex-start;gap:clamp(24px,2.6vw,32px);min-width:0}
.tic-hero__lead{margin:0;max-width:46ch;color:var(--on-ink-2)}
.tic-hero__act{display:flex;flex-wrap:wrap;gap:12px}
.tic-hero__ghost{border:1px solid var(--on-ink-line);color:var(--on-ink)}
.tic-hero__ghost .i{color:var(--blue)}
.tic-hero__ghost:hover{border-color:var(--on-ink-2);background:var(--on-ink-card)}

/* ---- bento ---- */
.tic-bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px;margin-top:clamp(56px,6.4vw,96px)}
.tic-tile{position:relative;display:flex;flex-direction:column;gap:14px;min-width:0;padding:clamp(16px,1.6vw,22px);border:1px solid var(--on-ink-line);border-radius:var(--r-lg);background:var(--on-ink-card);overflow:hidden}
.tic-tile--heat{grid-column:span 5}
.tic-tile--lat{grid-column:span 7}
.tic-tile--tps{grid-column:span 3}
.tic-tile--cost{grid-column:span 4}
.tic-tile--reg{grid-column:span 5;display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:18px;padding:12px 18px 12px 12px}
.tic-tile__head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.tic-tile__head .tic-k{display:inline-flex;align-items:center;gap:9px;color:var(--on-ink-2)}
.tic-tile__sub{font-family:var(--f);font-size:var(--t-lbl);letter-spacing:.04em;color:var(--on-ink-3);white-space:nowrap}
.tic-tile__big{font-size:clamp(1.7rem,2.3vw,2.25rem)}
.tic-tile__legend{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;font-family:var(--f);font-size:10px;letter-spacing:.04em;color:var(--on-ink-3)}
.tic-tile__foot{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:auto;font-family:var(--f);font-size:var(--t-lbl);letter-spacing:.04em;color:var(--on-ink-3)}
.tic-tile__foot b{font-weight:500;color:var(--on-ink)}
.tic-tile__kv{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:auto;padding-top:12px;border-top:1px solid var(--on-ink-line)}
.tic-tile__kv dt{font-family:var(--f);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--on-ink-3)}
.tic-tile__kv dd{margin-top:4px;font-family:var(--f);font-size:var(--t-xs);font-weight:500;color:var(--on-ink);font-variant-numeric:tabular-nums}

/* heatmap */
.tic-heat{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:4px 12px}
.tic-heat__n{font-family:var(--f);font-size:10px;letter-spacing:.02em;color:var(--on-ink-3);white-space:nowrap;line-height:1}
.tic-heat__n.is-warm{color:var(--on-ink-2)}
.tic-heat__row{display:grid;grid-template-columns:repeat(60,minmax(0,1fr));gap:2px;min-width:0}
.tic-heat__row i,.tic-heat__scale i{display:block;height:13px;border-radius:2px;background:var(--blue);opacity:clamp(.07,(var(--v) - .28) * 1.45,1);transition:opacity .6s var(--e)}
.tic-heat__scale{display:inline-grid;grid-template-columns:repeat(5,14px);gap:2px}
.tic-heat__scale i{height:8px}

/* latency */
.tic-lat{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;flex:1}
.tic-lat__legend{display:flex;flex-wrap:wrap;gap:6px 18px;font-family:var(--f);font-size:var(--t-lbl);letter-spacing:.04em;color:var(--on-ink-3)}
.tic-lat__legend li{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.tic-lat__legend b{font-weight:500;color:var(--on-ink);font-variant-numeric:tabular-nums}
.tic-lat__legend i{display:inline-block;width:16px;height:2px;border-radius:1px}
.tic-lat__legend .is-p50 i{background:var(--on-ink-3)}
.tic-lat__legend .is-p95 i{background:var(--blue);height:3px}
.tic-lat__legend .is-p99 i{background:var(--on-ink-2)}
.tic-lat__legend .is-slo i{height:0;border-top:1px dashed var(--on-ink-2)}
.tic-lat__legend .is-slo{margin-left:auto}
.tic-lat__plot{position:relative;min-height:170px;flex:1;padding-right:44px;border-bottom:1px solid var(--on-ink-line)}
.tic-lat__svg{position:absolute;inset:0 44px 0 0;width:calc(100% - 44px);height:100%;overflow:hidden}
.tic-lat__gl{stroke:rgba(255,255,255,.06);stroke-width:1;vector-effect:non-scaling-stroke}
.tic-lat__slo{stroke:var(--on-ink-2);stroke-width:1;stroke-dasharray:4 4;vector-effect:non-scaling-stroke}
.tic-lat__lines path{fill:none;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.tic-lat__p50{stroke:var(--on-ink-3);stroke-width:1.5}
.tic-lat__p95{stroke:var(--blue);stroke-width:2.25}
.tic-lat__p99{stroke:var(--on-ink-2);stroke-width:1.25;stroke-dasharray:3 3}
.tic-lat__y{position:absolute;right:0;top:calc(var(--y) * 100%);transform:translateY(-50%);font-family:var(--f);font-size:10px;letter-spacing:.02em;color:var(--on-ink-3);line-height:1}

/* gauge */
.tic-gauge{position:relative;display:grid;justify-items:center;margin-top:2px}
.tic-gauge__svg{width:100%;max-width:220px;height:auto;overflow:visible}
.tic-gauge__track,.tic-gauge__val{fill:none;stroke-width:12;stroke-linecap:round}
.tic-gauge__track{stroke:var(--on-ink-line)}
.tic-gauge__val{stroke:var(--blue);stroke-dasharray:100 100;transition:stroke-dashoffset 1.1s var(--e)}
.tic-gauge__tick{stroke:var(--on-ink-3);stroke-width:1.2}
.tic-gauge__v{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.tic-gauge__v .tic-v{font-size:clamp(1.45rem,2vw,1.9rem)}
.tic-gauge__u{font-family:var(--f);font-size:10px;letter-spacing:.06em;color:var(--on-ink-3)}

/* cost */
.tic-cost{position:relative;flex:1;min-height:92px}
.tic-cost__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.tic-cost__budget{stroke:var(--on-ink-2);stroke-width:1;stroke-dasharray:4 4;vector-effect:non-scaling-stroke}
.tic-cost__line{fill:none;stroke:var(--blue);stroke-width:2;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.tic-cost__bl{position:absolute;right:0;top:calc(var(--y) * 100%);transform:translateY(-130%);font-family:var(--f);font-size:10px;letter-spacing:.06em;color:var(--on-ink-3)}

/* regions */
.tic-reg__img{border-radius:var(--r);height:100%;min-height:150px}
.tic-reg__img img{object-position:50% 45%}
.tic-reg{display:flex;flex-direction:column;gap:12px;min-width:0;padding-block:6px}
.tic-reg__list li{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.9fr) auto;align-items:center;gap:12px;padding:9px 0;border-top:1px solid var(--on-ink-line)}
.tic-reg__city{display:flex;flex-direction:column;gap:3px;min-width:0;font-size:var(--t-sm);font-weight:500;color:var(--on-ink);line-height:1.2}
.tic-reg__city small{font-family:var(--f);font-size:10px;font-weight:400;letter-spacing:.02em;color:var(--on-ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tic-reg__share{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}
.tic-reg__share i{position:relative;display:block;height:4px;border-radius:2px;background:var(--on-ink-line);overflow:hidden}
.tic-reg__share i::after{content:"";position:absolute;inset:0;background:var(--on-ink-2);transform:scaleX(var(--w));transform-origin:left;transition:transform .8s var(--e)}
.tic-reg__share b,.tic-reg__co2 b{font-family:var(--f);font-size:var(--t-lbl);font-weight:500;color:var(--on-ink);font-variant-numeric:tabular-nums;min-width:3.2ch;text-align:right}
.tic-reg__co2{display:inline-flex;align-items:center;gap:8px}
.tic-reg__dots{display:inline-flex;gap:3px}
.tic-reg__dots i{width:5px;height:5px;border-radius:50%;background:var(--on-ink-line)}
.tic-reg__dots i.is-on{background:var(--on-ink-2)}
.tic-reg__list li:last-child .tic-reg__dots i.is-on{background:var(--blue)}
.is-live .tic-reg__list li:last-child .tic-reg__dots i.is-on{animation:tic-hero-glow 2.8s var(--e-io) infinite}
@keyframes tic-hero-glow{50%{opacity:.45}}

.tic-bento__foot{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;padding:10px 4px 0;font-family:var(--f);font-size:var(--t-lbl);letter-spacing:.06em;color:var(--on-ink-3)}
.tic-bento__cl{display:inline-flex;align-items:center;gap:10px;color:var(--on-ink-2)}
.tic-bento__foot .bdh-ill{margin-left:auto}

/* meta */
.tic-hero__meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:clamp(40px,4.4vw,60px);padding-top:18px;border-top:1px solid var(--on-ink-line)}
.tic-hero__meta>div{min-width:0;padding-right:24px}
.tic-hero__meta>div+div{padding-left:24px;border-left:1px solid var(--on-ink-line)}
.tic-hero__meta dt{font-family:var(--f);font-size:var(--t-lbl);letter-spacing:.14em;text-transform:uppercase;color:var(--on-ink-3);line-height:1.3}
.tic-hero__meta dd{margin-top:10px;font-family:var(--f);font-size:var(--t-xs);font-weight:500;letter-spacing:.03em;color:var(--on-ink);line-height:1.4}

/* ---- responsive ---- */
@media (max-width:1279px){
  .tic-tile--heat{grid-column:span 6}.tic-tile--lat{grid-column:span 6}
  .tic-tile--tps{grid-column:span 4}.tic-tile--cost{grid-column:span 4}.tic-tile--reg{grid-column:span 12;grid-template-columns:minmax(0,.5fr) minmax(0,1.5fr)}
  .tic-tile--tps,.tic-tile--cost{grid-column:span 6}
}
@media (max-width:1023px){
  .tic-hero__h{grid-column:1 / -1;max-width:17ch}
  .tic-hero__brief{grid-column:1 / span 9}
  .tic-tile--heat,.tic-tile--lat{grid-column:1 / -1}
}
@media (max-width:760px){
  .tic-hero__brief{grid-column:1 / -1}
  .tic-tile--tps,.tic-tile--cost{grid-column:1 / -1}
  .tic-tile--reg{grid-template-columns:minmax(0,1fr);padding:12px 16px 16px 12px}
  .tic-reg__img{min-height:0;aspect-ratio:21 / 8}
  .tic-heat__row{grid-template-columns:repeat(30,minmax(0,1fr))}
  .tic-heat__row i:nth-child(-n+30){display:none}
  .tic-lat__legend .is-slo{margin-left:0}
  .tic-hero__meta{grid-template-columns:minmax(0,1fr);row-gap:16px}
  .tic-hero__meta>div+div{padding-left:0;border-left:0;padding-top:16px;border-top:1px solid var(--on-ink-line)}
  .tic-bento__foot .bdh-ill{margin-left:0}
}
@media (max-width:600px){
  .tic-hero__top{flex-direction:column;align-items:flex-start}
  .tic-reg__list li{grid-template-columns:minmax(0,1fr) auto;row-gap:8px}
  .tic-reg__share{grid-column:1 / -1;grid-row:2}
  .tic-lat__plot{min-height:150px}
}