/* Home hero inspired by the supplied reference: hand-lettered copy and a product network. */
.site-header{
  height:104px;
  border-bottom:1px solid rgba(113,57,189,.25);
  background:rgba(255,253,248,.96);
  box-shadow:0 5px 22px rgba(65,47,31,.045);
}
.header-inner{max-width:none;padding:0 clamp(20px,2.7vw,44px);gap:clamp(18px,3vw,48px)}
.wordmark{gap:14px}
.brand-symbol{
  width:54px;height:54px;flex:0 0 54px;
  border:2px solid var(--purple);border-radius:14px 8px 14px 8px;
  display:grid;place-items:center;background:#fffefa;color:var(--purple);
  font:800 15px var(--sans);letter-spacing:-.04em;transform:rotate(-3deg);
  box-shadow:2px 4px 0 rgba(113,57,189,.14),inset 0 0 0 3px rgba(113,57,189,.055);
}
.brand-symbol-image{width:38px;height:38px;object-fit:contain}
.brand-name{display:grid;gap:3px;color:#302823;font:700 12px var(--sans);letter-spacing:.12em;text-transform:none}
.brand-name strong{font:inherit}
.brand-name small{display:block;color:#89796e;font:9px var(--sans);letter-spacing:.11em}
.primary-nav{margin-left:auto;gap:clamp(15px,2.4vw,38px)}
.primary-nav a{color:var(--purple);font-size:14px}
.header-actions{gap:clamp(10px,1.5vw,24px)}
.header-icon-control,.language-current{min-width:50px;min-height:50px;border:1px solid rgba(60,48,40,.16);border-radius:14px;background:#fffefa;box-shadow:0 3px 0 rgba(52,38,26,.08)}
.theme-toggle .theme-icon{width:20px;height:20px}
.language-picker{position:relative}
.language-current{display:flex;align-items:center;justify-content:center;gap:10px;padding:0 17px;color:#514944}
.language-options{position:absolute;top:calc(100% + 8px);right:0;z-index:20;min-width:100%;padding:8px;border:1px solid var(--line);border-radius:12px;background:#fffefa;box-shadow:0 12px 28px rgba(56,42,29,.12)}
.language-options a{display:block;padding:7px 10px;color:var(--purple)}
.header-cta{min-height:52px;padding:0 17px;display:flex;align-items:center;gap:18px;border:1.5px solid var(--purple);border-radius:12px 10px 8px 11px;color:var(--purple)!important;background:#fffefa;box-shadow:2px 4px 0 rgba(113,57,189,.12);font-size:14px;font-weight:700;white-space:nowrap}
.hero.page-intro{
  width:100%;max-width:1600px;min-height:min(834px,calc(100svh - 104px));
  margin:0 auto;padding:clamp(28px,3.6vw,58px) clamp(32px,4.1vw,68px) 42px;
  display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
  align-items:center;gap:clamp(28px,4.1vw,68px);overflow:hidden;
  border:0;background:transparent;
}
.hero .intro-copy{grid-column:1;grid-row:1;width:auto;max-width:620px;margin:0;padding:0;z-index:2;animation:none}
.hero .eyebrow{color:var(--purple);font:700 12px var(--sans);letter-spacing:.1em}
.hero .eyebrow i{width:8px;height:8px;background:var(--teal);box-shadow:0 0 0 5px rgba(23,143,132,.12)}
.hero h1{
  max-width:575px;margin:29px 0 23px;color:#211b18;
  font-family:"Segoe Print","Comic Sans MS","Bradley Hand",cursive;
  font-size:clamp(58px,5.45vw,88px);font-weight:700;line-height:.99;
  letter-spacing:-.075em;
}
.hero h1:after{content:"";display:block;width:76%;height:9px;margin:3px 0 0 7%;border-top:5px solid var(--purple);border-radius:50%;transform:rotate(-1.4deg)}
.hero .intro-lead{max-width:560px;color:#302823;font-size:clamp(17px,1.35vw,21px);line-height:1.85}
.hero-actions{gap:16px;margin-top:34px}
.hero .button{min-height:62px;padding:0 21px;border-radius:12px 10px 9px 12px;font-size:14px;box-shadow:2px 4px 0 rgba(52,38,26,.12)}
.hero .button-primary{border-color:var(--purple);background:var(--purple);color:#fff}
.hero .button-primary span{color:#fff}
.hero .button-outline{border-color:#594d46;background:#fffefa;color:#302823}
.hero .button-outline span{color:var(--purple)}
.hero-footnote{margin-top:36px;color:#8a7e76;font-size:9px}
.hero-footnote span:first-child{color:var(--purple)}
.hero-network{
  position:relative;grid-column:2;grid-row:1;top:auto;right:auto;left:auto;
  width:100%;height:min(45.2vw,738px);min-height:590px;max-width:820px;
  justify-self:stretch;margin:0;transform:none;overflow:visible;
  background:rgba(255,254,250,.48)!important;border:1px solid rgba(113,57,189,.035);
  box-shadow:0 22px 76px rgba(82,119,102,.08);
}
.hero-network-route{opacity:.9}
.hero-network-orbit{stroke:#93877d;stroke-width:1.7;stroke-dasharray:5 10;opacity:.56}
.hero-network-link{stroke:#8d8178;stroke-width:1.5;stroke-dasharray:4 8;opacity:.5;animation:hero-network-data-flow 2.8s linear infinite}
.hero-network-flow{stroke:var(--flow-color,var(--orange));stroke-width:4;stroke-linecap:round;stroke-dasharray:4 420;stroke-dashoffset:0;opacity:.96;filter:drop-shadow(0 0 4px rgba(229,139,36,.55));animation:hero-network-packet-travel 3.8s linear infinite}
.hero-network-packet--static{display:none;fill:var(--orange)}
@keyframes hero-network-data-flow{to{stroke-dashoffset:-48}}
@keyframes hero-network-packet-travel{to{stroke-dashoffset:-310}}
.hero-network-hub{width:clamp(112px,9.2vw,150px);height:clamp(112px,9.2vw,150px);font-size:clamp(28px,2.9vw,40px);background:#fffefa;box-shadow:0 0 0 7px rgba(113,57,189,.08),3px 5px 0 rgba(113,57,189,.15)}
.hero-network-node{width:112px;gap:5px}
.hero-network-node-icon{width:clamp(48px,4.4vw,62px);height:clamp(48px,4.4vw,62px);border-width:1.3px;box-shadow:0 5px 13px rgba(47,35,26,.08),inset 0 0 0 4px rgba(255,255,255,.74)}
.hero-network-node-label{max-width:120px;color:#443a34;font-size:10px}
.hero-network-node-kind{font-size:7px;letter-spacing:.11em}
.hero-network-caption{bottom:1%;color:#85756a;font-size:8px}
.systems-section#systems .product-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
html[data-theme=dark] .hero h1,html[data-theme=dark] .hero .intro-lead{color:#f5eff9}
html[data-theme=dark] .hero .eyebrow{color:#cdb2f4}
html[data-theme=dark] .hero-network{background:rgba(28,25,34,.62)!important}
html[data-theme=dark] .brand-name{color:#f1eaf5}
@media(max-width:1120px){
  .systems-section#systems .product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
  .header-inner{gap:18px}.primary-nav{gap:16px}.primary-nav a{font-size:12px}.header-actions{gap:9px}
  .hero.page-intro{gap:25px;padding-left:34px;padding-right:34px}
  .hero h1{font-size:clamp(54px,6vw,72px)}
  .hero-network{min-height:500px}
  .hero-network-node{width:86px}.hero-network-node-label{max-width:94px;font-size:8px}.hero-network-node-kind{font-size:6px}
}
@media(max-width:860px){
  .site-header{height:82px}.header-inner{padding:0 20px}.brand-symbol{width:46px;height:46px;flex-basis:46px}
  .brand-name{font-size:11px}.primary-nav{gap:13px}.primary-nav a{font-size:11px}.header-cta{min-height:46px;padding:0 12px;font-size:12px}
  .header-icon-control,.language-current{min-width:44px;min-height:44px}
  .hero.page-intro{min-height:auto;padding:48px 30px 55px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:16px}
  .hero h1{font-size:clamp(48px,6.2vw,64px)}.hero .intro-lead{font-size:16px}
  .hero-network{height:58vw;min-height:410px}
  .hero-network-node{width:68px}.hero-network-node-icon{width:42px;height:42px}.hero-network-node-label{max-width:74px;font-size:7px}.hero-network-node-kind{display:none}
}
@media(max-width:720px){.systems-section#systems .product-grid{grid-template-columns:1fr}}
@media(max-width:680px){
  .site-header{height:72px}.header-inner{padding:0 15px;gap:8px}.brand-symbol{width:40px;height:40px;flex-basis:40px;font-size:12px}.brand-symbol-image{width:30px;height:30px}.wordmark{gap:9px}.brand-name{font-size:10px}.brand-name small{font-size:7px}
  .header-actions{margin-left:auto;gap:6px}.header-icon-control,.language-current{min-width:38px;min-height:38px;border-radius:11px}.language-current{padding:0 9px}.header-cta{display:none}
  .hero.page-intro{display:flex;flex-direction:column;align-items:stretch;gap:15px;padding:38px 20px 46px;min-height:0}
  .hero .intro-copy{width:100%;max-width:none}.hero .eyebrow{font-size:10px}.hero h1{font-size:clamp(47px,12vw,64px);max-width:540px;margin:20px 0 17px;line-height:1.01}.hero h1:after{height:7px;border-top-width:4px}
  .hero .intro-lead{font-size:15px;line-height:1.7}.hero-actions{gap:10px;margin-top:23px}.hero .button{min-height:50px;padding:0 13px;gap:12px;font-size:12px}.hero-footnote{margin-top:25px}
  .hero-network{width:100%;height:min(92vw,470px);min-height:310px;max-width:none;margin-top:10px}
  .hero-network-hub{width:76px;height:76px;font-size:22px}.hero-network-hub:before{inset:-8px}.hero-network-hub:after{inset:-14px}.hero-network-hub i{width:7px;height:7px;right:4px;top:10px}
  .hero-network-node{width:56px;gap:2px}.hero-network-node-icon{width:32px;height:32px}.hero-network-node-label{max-width:61px;font-size:6px}.hero-network-caption{font-size:6px;letter-spacing:.1em}
}
@media(prefers-reduced-motion:reduce){.hero-network-orbit,.hero-network-node,.hero-network-hub,.hero-network-link,.hero-network-flow{animation:none!important}.hero-network-packet--static{display:block!important}}