/* About template: rules added to / changed from main.css (from the static about.html) */
.te-marquee-track{animation:te-marquee 100s linear infinite}
/* abstract textures: slow drift, gentle scale and a soft iridescent shift (loops) */
@keyframes te-abstract{0%{scale:1.07;rotate:0deg;filter:hue-rotate(0deg) saturate(1)}50%{scale:1.12;rotate:1.6deg;filter:hue-rotate(16deg) saturate(1.12)}100%{scale:1.08;rotate:-1.2deg;filter:hue-rotate(-12deg) saturate(1.05)}}
.te-abstract{animation:te-abstract 16s ease-in-out infinite alternate}
.te-abstract-2{animation-duration:19s;animation-delay:-7s}
@media (prefers-reduced-motion: reduce){.te-abstract{animation:none}}
.te-card-arrow{transition:transform .25s cubic-bezier(.2,.7,.2,1)}
.te-card-link:hover .te-card-arrow{transform:translate(3px,-3px)}
.te-card-link:hover .te-card-title{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:8px;text-decoration-color:var(--te-dark)}
.te-card-link:hover{color:var(--te-dark) !important}
.te-illu>img{transform-origin:center bottom}
@media (min-width: 1024px){.te-eco-panel{min-height:280px}}
/* mobile: leadership two per row, photo above name */
@media (max-width: 600px){.te-g3{grid-template-columns:repeat(2,minmax(0,1fr)) !important;column-gap:16px !important}.te-person{flex-direction:column !important;align-items:flex-start !important;gap:12px !important}}
/* ecosystem: a donut with TechEquity Ai in the middle and a legend beside it.
   Best practice for more than four shares: no leader lines — a compact legend in the same order as the slices,
   one highlighted share in colour and the rest in a single neutral; the selected row opens to list who is in it.
   Desktop: intro + legend on the left (columns 1–6), the donut on the right (7–12). Smaller screens: intro, donut, legend. */
.te-pie{width:100%}
.te-pie-ring{position:relative;aspect-ratio:1}
/* inside the ring: the sector name sits on the ring's centre line, its share as a large serif number above and a few members below (an ellipsis shows there are more) */
.te-pie-callout{position:absolute;left:0;top:0;white-space:nowrap;color:var(--te-dark);pointer-events:none;opacity:0;transition:opacity .5s cubic-bezier(.4,0,.2,1)}
.te-pie-callout.is-shown{opacity:1}
.te-pie-callout{left:50% !important;top:50% !important;transform:translate(-50%,calc(-1 * var(--cy,50%))) !important;text-align:center;white-space:normal !important;width:62%}
.te-pie-cp{line-height:1;margin-bottom:10px}
.te-pie-cm{list-style:none;margin:8px 0 0;padding:0;color:var(--te-cool-400)}
.te-pie-cm li{padding:1px 0}
.te-pie-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.te-pie-seg{fill:var(--p);stroke:none;cursor:pointer;pointer-events:visibleFill;transition:fill .5s cubic-bezier(.4,0,.2,1),d .6s cubic-bezier(.34,1.3,.5,1),opacity .8s ease}
/* callout text: leaves upward, arrives from below */
.te-pie-callout>*{transition:translate .45s cubic-bezier(.2,.7,.3,1)}
.te-pie-callout:not(.is-shown)>*{translate:0 -6px}
.te-pie-callout.is-pre>*{translate:0 6px;transition:none}
@media (prefers-reduced-motion: reduce){.te-pie-seg{transition:fill .5s ease !important}.te-pie-callout>*{translate:none !important;transition:none !important}}
.te-eco.has-sel .te-pie-seg:not(.is-on){fill:var(--te-cool-500)}
.te-pie-logo{position:absolute;left:50%;top:50%;width:44%;height:auto;translate:-50% -50%;pointer-events:none}
.te-pie-legend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0}
.te-pie-key{width:100%;display:grid;grid-template-columns:8px minmax(0,1fr) auto;align-items:center;column-gap:10px;padding:5px 0;border:0;background:transparent;color:var(--te-dark);cursor:pointer;text-align:left}
.te-pie-key i{width:8px;height:8px;border-radius:50%;background:var(--p);transition:background-color .5s ease}
.te-eco.has-sel .te-pie-key:not(.is-on) i{background:var(--te-cool-500)}
/* the selected row gets a thin gray line underneath */
.te-pie-key{position:relative}
.te-pie-key::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--te-dark);transform:scaleX(0);transform-origin:left center;transition:transform .35s cubic-bezier(.4,0,.2,1)}
.te-pie-key.is-on::after{transform:scaleX(1)}
.te-pie-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.te-pie-num{font-variant-numeric:tabular-nums;text-align:right}
.te-pie-chev{width:16px;height:16px;fill:none;stroke:var(--te-cool-400);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .5s cubic-bezier(.4,0,.2,1)}
.te-pie-key.is-on .te-pie-chev{transform:rotate(180deg)}
.te-pie-key:focus-visible{outline:2px solid var(--te-cool-400);outline-offset:2px;border-radius:8px}
/* the selected row opens to show who is in that sector (progressive disclosure, right next to what was chosen) */
.te-pie-more{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s cubic-bezier(.4,0,.2,1)}
.te-pie-more>div{overflow:hidden;padding-left:24px;color:var(--te-cool-400)}
.te-pie-more p{padding:2px 0 4px;color:var(--te-cool-400)}
.te-pie-more ul{list-style:disc;margin:0 0 12px;padding-left:18px}
.te-pie-more li{padding:2px 0}
.te-pie-key.is-on+.te-pie-more{grid-template-rows:1fr}
.te-eco.te-measure .te-pie-more{transition:none}
.te-pie-key{padding:5px 0}
.te-pie-note{margin-top:16px;color:var(--te-cool-400)}
/* layout on the 12-column grid — desktop: intro + compact legend 1–4 · donut centred in 5–12; tablet: intro, then donut | legend; phone: one column (donut, then legend) */
.te-eco .te-12-48{display:grid !important;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px !important;row-gap:16px !important;align-items:start !important}
.te-eco .te-12-48>:first-child{display:contents !important}
.te-eco .te-12-48>:first-child>*{grid-column:1 / span 4}
.te-eco .te-12-48>:nth-child(2){grid-column:5 / span 8 !important;grid-row:1 / span 5;display:block !important;align-self:center}
.te-eco .te-pie-side{grid-column:1 / span 4 !important;grid-row:4;margin-top:24px;max-width:320px}
.te-eco .te-12-48{grid-template-rows:auto auto auto auto 1fr}
.te-pie-ring{width:100%;max-width:470px;margin:0 auto}
@media (max-width: 1023px){
.te-eco .te-12-48{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px !important;grid-template-rows:none}
.te-eco .te-12-48>:first-child>*{grid-column:1 / -1}
.te-eco .te-12-48>:nth-child(2){grid-column:1 !important;grid-row:4;margin-top:24px}
.te-eco .te-pie-side{grid-column:2 !important;grid-row:4;margin-top:24px;max-width:none}
}
@media (max-width: 639px){
.te-eco .te-12-48{grid-template-columns:minmax(0,1fr)}
.te-eco .te-12-48>:nth-child(2){grid-column:1 !important;grid-row:4}
.te-eco .te-pie-side{grid-column:1 !important;grid-row:5;margin-top:8px;padding-left:0;max-width:none}
.te-pie-ring{max-width:320px;margin:0 auto}
}
/* hovering takes over from the slow tour: changes snap in quickly */
.te-eco.is-user .te-pie-key i,.te-eco.is-user .te-pie-more,.te-eco.is-user .te-pie-chev{transition-duration:.25s !important}
.te-eco.is-user .te-pie-seg{transition-duration:.25s,.45s,.25s !important}
.te-eco-panel.is-user .te-eco-list:not([hidden]){animation-duration:.25s}
.te-eco-list,.te-eco-hint{transition:opacity .4s ease}
.te-eco-list:not([hidden]){animation:te-eco-fade .6s cubic-bezier(.4,0,.2,1)}
/* member lists: one divider above the list, none between names */
.te-eco-list ul{border-top:1px solid var(--te-line);padding-top:8px !important}
.te-eco-list li{border-top:0 !important;padding:6px 0 !important}
.te-eco-panel .te-eco-hint{margin:4px 0 0}
.te-pie-anim .te-pie-seg{opacity:0}
.te-pie-anim.te-pie-in .te-pie-seg{opacity:1;transition:fill .5s ease,d .6s cubic-bezier(.34,1.3,.5,1),opacity .8s ease calc(var(--k) * 90ms)}
@media (prefers-reduced-motion: reduce){.te-pie-anim .te-pie-seg{opacity:1 !important}.te-eco-list:not([hidden]){animation:none}}
/* audit: on phones the ring is small, so its centre lists three members and the ellipsis */
@media (max-width: 639px){.te-pie-cm li:nth-child(n+4):not(:last-child){display:none}}