/* Static sections sat under the fixed .bg-wrap (z-index 0) and painted as blank space. */
.hx-sec{position:relative;z-index:1}

/* Download head: module cells span the heading and the lede only, sized to those two lines. */
@media (min-width:1181px){
  .home-dl-head{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center}
  .home-dl-head>*{grid-column:1}
  .home-dl-eyebrow{grid-row:1}
  .home-dl-h2{grid-row:2}
  .home-dl-lede{grid-row:3}
  .dl-recwrap{grid-row:4}
  /* zoom scales the inline left/top of every cell too; 170px of cells become the ~108px of two lines */
  .home-dl-head>.dl-hexside{grid-row:2/4;position:relative;top:auto;transform:none;align-self:center;zoom:.635}
  .home-dl-head>.dl-hexside-l{justify-self:start;left:auto}
  .home-dl-head>.dl-hexside-r{justify-self:end;right:auto}
}

/* What is in the download: media card, a narrow full-height photo on the left, text in a clean column. */
.dl-why-col{display:grid;grid-template-columns:112px minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:20px;
  padding:0 20px 0 0;min-height:236px;align-content:start}
.dl-why-media{grid-column:1;grid-row:1/3;margin:0;width:100%;height:100%;aspect-ratio:auto;border:0;border-radius:15px 0 0 15px;
  box-shadow:none;position:relative;isolation:isolate;overflow:hidden;background:var(--bg-2)}
.dl-why-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.88) contrast(1.04);
  transition:transform .8s cubic-bezier(.2,.7,.2,1),filter .5s}
.dl-why-media::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 55%,color-mix(in srgb,var(--accent) 28%,transparent)),
             linear-gradient(90deg,transparent 78%,color-mix(in srgb,var(--bg-0) 35%,transparent))}
.dl-why-head{grid-column:2;margin:20px 0 8px}
.dl-why-p{grid-column:2;margin:0 0 20px;font-size:14px;line-height:1.6}
.dl-why-col:hover .dl-why-media img{transform:scale(1.07);filter:saturate(1.02) contrast(1.06)}
@media (max-width:720px){.dl-why-col{grid-template-columns:92px minmax(0,1fr);min-height:0}}
@media (prefers-reduced-motion:reduce){.dl-why-media img{transition:none;transform:none!important}}

/* Academy lessons strip: compact. */
.oce-vids-new{margin-top:clamp(22px,2.6vw,34px);padding-top:clamp(18px,2vw,24px)}
.oce-vids-new-head{margin-bottom:12px;display:flex;align-items:baseline;gap:6px 16px;flex-wrap:wrap}
.oce-vids-new-h{font-size:clamp(1.05rem,1.4vw,1.25rem);margin:0}
.oce-vids-new-lede{font-size:.9rem;max-width:none}
.oce-vids-new-grid{gap:10px}
.oce-vids-new-grid .oce-vid-t{font-size:.86rem}
.oce-vids-new-grid .oce-vid-cap{padding-top:6px}

/* LinkedIn voices: photos in the same flat-top hexagon as every other avatar cell. */
.li-av.li-ph{width:62px;height:54px;border-radius:0;box-shadow:none;object-fit:cover;
  clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.li-who{grid-template-columns:62px minmax(0,1fr)}

/* Hero secondary row: OS tiles and the GitHub pill as one even strip; long translations wrap, never clip. */
@media (min-width:561px){
  .hero-secondary-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px}
  .hero-platform-icons{gap:8px}
}
.hero-platform-icon{width:54px;height:auto;min-height:60px;border-radius:14px;gap:6px;padding:9px 4px 8px;
  background:linear-gradient(180deg,#fff,color-mix(in srgb,var(--bg-1,#f3f5f9) 75%,#fff));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 1px 2px rgba(15,23,42,.06),0 12px 24px -18px rgba(15,23,42,.5)}
.hero-platform-icon svg{width:21px;height:21px;transition:transform .22s cubic-bezier(.2,.7,.2,1)}
.hero-platform-icon span{font-size:10.5px;font-weight:650;letter-spacing:.02em;color:var(--ink-2);transition:color .18s}
.hero-platform-icon:hover svg{transform:translateY(-1px) scale(1.08)}
.hero-platform-icon:hover span{color:inherit}
.hero-star-pill{position:relative;height:auto;min-height:60px;padding:8px 12px 8px 9px;gap:11px;border-radius:14px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 1px 2px rgba(15,23,42,.06),0 12px 24px -18px rgba(15,23,42,.5)}
.hero-star-pill>svg{width:36px;height:36px;padding:8px;box-sizing:border-box;border-radius:11px;background:var(--ink-0);fill:#fff;color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 6px 14px -8px rgba(15,23,42,.6);transition:transform .22s cubic-bezier(.2,.7,.2,1)}
.hero-star-text{flex:1 1 auto}
.hero-star-title{white-space:normal;overflow-wrap:break-word;hyphens:auto;text-wrap:balance;line-height:1.16;font-size:13px}
.hero-star-sub{white-space:normal;overflow-wrap:break-word;line-height:1.22;margin-top:3px;font-size:10.5px}
/* a small amber star pinned to the corner of the GitHub badge */
.hero-star-pill::after{content:"\2605";position:absolute;left:36px;top:calc(50% - 24px);width:16px;height:16px;display:grid;place-items:center;
  border-radius:50%;font-size:9.5px;line-height:1;color:#fff;background:#e8a90c;box-shadow:0 0 0 2px var(--bg-0,#fff);
  transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.hero-star-pill:hover>svg{transform:rotate(-6deg)}
.hero-star-pill:hover::after{transform:scale(1.15) rotate(72deg)}
[data-theme="dark"] .hero-platform-icon,[data-theme="dark"] .hero-star-pill{background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.05));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 24px -18px rgba(0,0,0,.7)}
[data-theme="dark"] .hero-star-pill>svg{background:#fff;fill:#0b1220;color:#0b1220}
@media (prefers-reduced-motion:reduce){.hero-platform-icon svg,.hero-star-pill>svg,.hero-star-pill::after{transition:none;transform:none!important}}

/* OS tiles: full-size platform marks, Linux in its own colours. */
.hero-platform-icon svg{width:25px;height:25px}
.hero-platform-icon[href$="card-macos"] svg{fill:#1d1d1f}
.hero-platform-icon svg.tux{width:27px;height:27px;filter:drop-shadow(0 1px 1px rgba(15,23,42,.18))}
[data-theme="dark"] .hero-platform-icon[href$="card-macos"] svg{fill:#f5f5f7}

/* Download head: module cells read as a soft honeycomb, not as faint outlines. */
.dl-hexside{color:var(--accent);opacity:.7}
.dl-hexside .ihx-svg{filter:drop-shadow(0 3px 5px color-mix(in srgb,var(--accent) 22%,transparent))}
.dl-hexside .ihx-p{fill:color-mix(in srgb,var(--accent) 7%,var(--bg-0,#fff));stroke-opacity:.42;stroke-width:1.2}
.dl-hexside .ihx-i{stroke-opacity:.95;stroke-width:1.7}
[data-theme="dark"] .dl-hexside{opacity:.6}
[data-theme="dark"] .dl-hexside .ihx-p{fill:color-mix(in srgb,var(--accent) 14%,transparent)}

/* Custom-software cards: the animated scene with a photo in its honeycomb cell. */
.oxs-art-live .a-ph-rim{fill:none;stroke:#fff;stroke-width:2.2}
.oxs-art-live image{filter:saturate(.95) contrast(1.03)}
.oxs-art-live svg{overflow:visible}
.oxs-art.oxs-art-live{height:172px}
.oxs-art-live .a-spin .a-fill{fill:none;stroke-width:1.3;stroke-dasharray:7 6}
[data-theme="dark"] .oxs-art-live .a-ph-rim{stroke:rgba(255,255,255,.6)}

/* G2 reviewers: initials in the same flat-top hexagon as the LinkedIn photos. */
.li-av.g2-mono{width:62px;height:54px;display:grid;place-items:center;flex:none;border-radius:0;
  clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);
  background:linear-gradient(140deg,color-mix(in srgb,var(--accent) 88%,#fff),color-mix(in srgb,var(--accent) 70%,#0b1220));
  color:#fff;font:700 17px/1 'Inter Tight',Inter,sans-serif;letter-spacing:.04em;box-shadow:none}
.g2-who{grid-template-columns:62px minmax(0,1fr)}
/* Download cards: three short, equal texts. */
.dl-why-col{min-height:0}
.dl-why-head{margin:18px 0 6px}
.dl-why-p{font-size:13.5px;line-height:1.55;margin:0 0 18px;color:var(--ink-2)}

/* Custom cards: job arrives, the ring closes, a person signs off */
.oxs-art-live .a-pulse{animation:none;opacity:0}
.oxs-art-live .a-halo{fill:color-mix(in oklab,currentColor 22%,transparent);stroke:none;transform-box:fill-box;transform-origin:center;opacity:0;animation:oxs2-halo 6s ease-out infinite}
.oxs-art-live .a-rim{fill:none;stroke:currentColor;stroke-width:2.6;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:100;animation:oxs2-rim 6s ease-in-out infinite}
.oxs-art-live .a-ok{transform-box:fill-box;transform-origin:center;transform:scale(0);opacity:0;animation:oxs2-ok 6s infinite}
.oxs-art-live .a-ok circle{fill:var(--hc-green,#1f9d70);stroke:#fff;stroke-width:2}
.oxs-art-live .a-ok path{fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.oxs-art-live .a-pk{fill:currentColor;stroke:none;opacity:0;animation:oxs2-pk 6s linear infinite}
@keyframes oxs2-rim{0%,14%{stroke-dashoffset:100;opacity:1}44%,88%{stroke-dashoffset:0;opacity:1}96%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes oxs2-ok{0%,44%{transform:scale(0);opacity:0}50%{transform:scale(1.18);opacity:1}54%,88%{transform:scale(1);opacity:1}96%,100%{transform:scale(.6);opacity:0}}
@keyframes oxs2-halo{0%,44%{transform:scale(1);opacity:0}50%{transform:scale(1.04);opacity:1}72%,100%{transform:scale(1.24);opacity:0}}
@keyframes oxs2-pk{0%{transform:translateX(0);opacity:0}3%{opacity:1}14%{transform:translateX(22px);opacity:1}17%,100%{transform:translateX(22px);opacity:0}}
@media (prefers-reduced-motion:reduce){
  .oxs-art-live .a-halo,.oxs-art-live .a-pk{animation:none;opacity:0}
  .oxs-art-live .a-rim{animation:none;stroke-dashoffset:0}
  .oxs-art-live .a-ok{animation:none;transform:none;opacity:1}
}

/* Hero hexes: whole words, never an ellipsis */
.module-honeycomb .hc-title{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;hyphens:auto;display:block;font-size:10.5px;line-height:1.14;width:68px;max-width:68px;text-align:center;letter-spacing:-.01em}
.module-honeycomb .hc-sub{display:none}
/* end Hero hexes: whole words, never an ellipsis */

/* RTL hero mirrors around the hub */
[dir="rtl"] .hero-people{left:calc(50% + var(--hp-w) * 2.84)}
[dir="rtl"] .hero-flow{transform:scaleX(-1)}
[dir="rtl"] .hero-star-pill{padding:8px 9px 8px 12px}
[dir="rtl"] .hero-star-pill::after{left:auto;right:36px}
/* batch18 */
/* batch19 */
#no-it .oxs-ba>div{position:relative;overflow:hidden;padding-top:150px!important;display:block}
#no-it .oco-pic{position:absolute;top:0;inset-inline:0;height:136px;display:flex;justify-content:center;padding:6px 12px 0;color:var(--accent);background:linear-gradient(180deg,color-mix(in oklab,var(--accent) 7%,var(--bg-0)),transparent);border-bottom:1px solid color-mix(in oklab,var(--line-1) 70%,transparent)}
#no-it .oco-pic svg{width:100%;max-width:360px;height:124px;overflow:visible}
#no-it .oco-off .oco-h{fill:color-mix(in oklab,var(--ink-3) 13%,var(--bg-0));stroke:color-mix(in oklab,var(--ink-3) 42%,transparent)}
#no-it .oco-off .oco-g,#no-it .oco-off.oco-hero .oco-b2{fill:color-mix(in oklab,var(--ink-3) 72%,var(--bg-0))}
#no-it .oco-x line{stroke:#c2410c;stroke-width:3.2;stroke-linecap:round}
.oxs-js #no-it .oxs-ba:not(.is-in) .oco-c{opacity:1}
.oxs-js #no-it .oxs-ba .oco-c{animation:none}
#no-it .oxs3 .oxs-stop{padding-bottom:18px}
#no-it .oxs3 .oxs-stop .wr-cell{display:flex;flex-direction:column;align-self:stretch;width:100%}
#no-it .oxs3 .oxs-stop-link{min-height:0;margin-top:auto;padding-top:10px}
#no-it .oxs3 .wr-mini{flex:none}
#no-it .oxs3 .oxs-stop:first-child .oxs-stop-d{display:block;grid-row:2}
#no-it .oxs3 .oxs-stop:first-child .oxs-who{grid-row:3}
#no-it .oxs-ba>.oxs-ba-old{display:flex;flex-direction:column;justify-content:center}
#no-it .oxs-ba-old p{font-size:clamp(17px,1.5vw,20px)}
/* batch21 */
#no-it .oxs-ba>div{padding-top:188px!important}
#no-it .oco-pic{height:172px;padding:0;background:var(--bg-2);border-bottom:0;display:block}
#no-it .oco-pic img{display:block;width:100%;height:100%;object-fit:cover}
#no-it .oco-pic-off img{filter:grayscale(1) contrast(.92) brightness(1.04)}
#no-it .oco-strike{position:absolute;inset:0;width:100%;height:100%}
#no-it .oco-strike line{stroke:#c2410c;stroke-width:3.5;stroke-linecap:round}
/* batch24 */
@media (min-width:1321px) and (max-width:1560px){html:root #nav.nav .nav-inner{padding-inline:20px!important;max-width:none!important}
html:root .nav .nav-right .github-pill :is(.gh-star-sep,.gh-star-icon,.gh-star-count){display:none!important}}
@media (min-width:1321px) and (max-width:1400px){html:root .nav .nav-right .github-pill [data-i18n="nav.github"]{display:none!important}
html:root .nav .nav-links{gap:10px!important}}
/* batch24b */
#custom .cb-svc{display:block}
#custom .cb-hex{float:right;float:inline-end;position:relative;width:112px;height:129px;margin:-10px -6px 6px 14px;margin-inline:14px -6px;shape-outside:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);shape-margin:10px}
#custom .cb-hex-p{position:absolute;inset:0;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:var(--bg-2)}
#custom .cb-hex-p img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
#custom .cb-svc:hover .cb-hex-p img{transform:scale(1.07)}
#custom .cb-hex i{position:absolute;width:30px;height:35px;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
#custom .cb-hex-a{inset-inline-end:-4px;top:101px;background:var(--accent);z-index:1}
#custom .cb-hex-b{inset-inline-end:-19px;top:75px;background:color-mix(in oklab,var(--accent) 24%,transparent)}
#custom .cb-svc h3{padding-top:4px}
#custom .cb-svc ul{clear:both;padding-top:6px}
/* batch25 */
#no-it .oxs3 .oxs-stop{padding-top:62px;padding-bottom:18px}
#no-it .oxs-node.oxs-node-pic{top:-44px;inset-inline-start:18px;width:112px;height:96px;overflow:visible}
#no-it .oxs-node-pic img{position:absolute;inset:3px;width:calc(100% - 6px);height:calc(100% - 6px);object-fit:cover;clip-path:var(--oxs-hex);transition:transform .9s cubic-bezier(.2,.8,.2,1)}
#no-it .oxs-stop:hover .oxs-node-pic img{transform:scale(1.06)}
#no-it .oxs-size{position:absolute;top:14px;inset-inline:142px 14px;font:600 11px/1.3 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
/* batch26 */
#no-it .oxs-ba>div{padding-top:30px!important;overflow:visible}
#no-it .oco-pic{top:-30px;inset-inline:auto 20px;width:112px;height:96px;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);z-index:2}
#no-it .oxs-ba>div>.oxs-tag{display:block;padding-inline-end:124px}
#no-it .oxs-ba>div{justify-content:flex-start!important}
#no-it .oxs-ba>div>p{margin-top:34px}
.dl-why-col .dl-why-hx{grid-column:1;grid-row:1/3;justify-self:end;align-self:end;position:relative;width:0;height:0;z-index:2}
.dl-why-hx i{position:absolute;display:block;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:var(--bg-0);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.dl-why-hx img{position:absolute;inset:2px;width:calc(100% - 4px);height:calc(100% - 4px);object-fit:cover;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.dl-why-hx .hx-a{width:64px;height:55px;inset-inline-end:-18px;bottom:16px}
.dl-why-hx .hx-b{width:52px;height:45px;inset-inline-end:29px;bottom:45px}
.dl-why-hx .hx-c{width:26px;height:22px;inset-inline-end:1px;bottom:75px;background:var(--accent)}
.dl-why-col:hover .hx-a{transform:translateY(-3px)}
.dl-why-col:hover .hx-b{transform:translateY(3px)}
/* batch27 */
#proof .section-head{display:block;max-width:none;margin:0 auto clamp(20px,2.4vw,32px);text-align:center}
#proof .section-title{max-width:none;margin:0;font-size:clamp(24px,2.7vw,38px);line-height:1.16}
#proof .section-title .italic{display:block}
#no-it .oxs-ba-hex{clip-path:none;background:none;display:flex;align-items:center;--nx:3px;--ny:0px;transition:opacity .6s ease .4s}
[dir="rtl"] #no-it .oxs-ba-hex{--nx:-3px}
.oxs-js #no-it .oxs-ba:not(.is-in) .oxs-ba-hex{transform:none;opacity:0}
#no-it .br-h{flex:none;width:60px;height:52px;display:grid;place-items:center;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:linear-gradient(180deg,var(--accent-2),var(--accent-3));color:#fff}
#no-it .br-h svg{width:22px;height:22px;animation:br-nudge 2.4s ease-in-out infinite}
#no-it .br-a,#no-it .br-b{position:relative;display:block;flex:1 1 0;height:2px}
#no-it .br-a{background:repeating-linear-gradient(90deg,color-mix(in oklab,var(--ink-2) 45%,transparent) 0 4px,transparent 4px 8px)}
#no-it .br-b{background:var(--accent)}
#no-it .br-a::before,#no-it .br-b::after{content:"";position:absolute;top:-4px;width:10px;height:10px;box-sizing:border-box;border-radius:50%}
#no-it .br-a::before{inset-inline-start:-5px;background:var(--bg-0);border:2px solid color-mix(in oklab,var(--ink-2) 55%,transparent)}
#no-it .br-b::after{inset-inline-end:-5px;background:var(--accent);box-shadow:0 0 0 4px color-mix(in oklab,var(--accent) 20%,transparent)}
#no-it .br-b::before{content:"";position:absolute;top:-2px;width:6px;height:6px;border-radius:50%;background:#fff;box-shadow:0 0 6px 1px var(--accent);animation:br-run 2.4s ease-in-out infinite}
@keyframes br-nudge{0%,100%{translate:calc(var(--nx)*-1) calc(var(--ny)*-1)}50%{translate:var(--nx) var(--ny)}}
@keyframes br-run{0%{inset-inline-start:0;opacity:0}20%{opacity:1}80%{opacity:1}100%{inset-inline-start:100%;opacity:0}}
@media (min-width:900px){#no-it .oxs-ba{column-gap:112px}
#no-it .oxs-ba-hex{width:112px;height:52px;margin:-26px 0 0 -56px}}
@media (max-width:899px){#no-it .oxs-ba-hex{--nx:0px;--ny:3px;flex-direction:column;width:60px;height:96px;margin:0 auto}
[dir="rtl"] #no-it .oxs-ba-hex{--nx:0px}
#no-it .br-a,#no-it .br-b{width:2px;height:auto;flex:1 1 0}
#no-it .br-a{background:repeating-linear-gradient(180deg,color-mix(in oklab,var(--ink-2) 45%,transparent) 0 4px,transparent 4px 8px)}
#no-it .br-a::before{top:-5px;inset-inline-start:-4px}
#no-it .br-b::after{top:auto;bottom:-5px;inset-inline-end:-4px}
#no-it .br-b::before{display:none}}
@media (prefers-reduced-motion:reduce){#no-it .br-h svg,#no-it .br-b::before{animation:none}#no-it .br-b::before{display:none}}
