/* Progressive visual storytelling: content stays visible if JS never runs. */
:root{--ease-premium:cubic-bezier(.2,.8,.2,1)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(circle at var(--mx,78%) var(--my,12%),rgba(214,180,90,.11),transparent 28%);transition:background-position .8s var(--ease-premium)}
.route-loader{position:fixed;z-index:20;inset:0 0 auto;height:3px;background:linear-gradient(90deg,transparent,var(--gb),transparent);transform-origin:right;animation:loadline .65s var(--ease-premium) forwards;pointer-events:none}
.motion-ready main>section>*{opacity:1;transform:none}.motion-ready main>section>*.seen{animation:reveal .7s var(--ease-premium) both;animation-delay:calc(var(--i,0)*55ms)}
.card{position:relative;overflow:hidden;transition:transform .3s var(--ease-premium),border-color .3s,box-shadow .3s}.card:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 15%,rgba(240,213,139,.08),transparent 70%);transform:translateX(120%);transition:transform .65s}.card:hover,.card:focus-within{transform:translateY(-5px);border-color:var(--g);box-shadow:0 22px 50px #0008}.card:hover:before{transform:translateX(-120%)}
/* process family: numbered vertical journey */
.family-process main>section{position:relative}.family-process .steps{position:relative;padding-right:28px}.family-process .steps:before{content:"";position:absolute;right:20px;top:18px;bottom:18px;width:1px;background:linear-gradient(var(--g),transparent)}.family-process .step{background:#111b;border:1px solid var(--l);border-radius:16px;padding:18px;margin:22px 0;transform-origin:right}
/* decision family: asymmetric comparison board */
.family-decision .cards{grid-template-columns:1.25fr .9fr}.family-decision .card:first-child{grid-row:span 2;background:radial-gradient(circle at 85% 10%,#302615,#121212 55%)}.family-decision .fact{max-width:720px;margin:36px auto;font-size:18px}
/* technical family: dashboard tiles */
.family-technical main>section:after{content:"עיבוד מקומי  •  מקור לקריאה  •  יעד נפרד";display:block;margin-top:36px;padding:14px;border:1px dashed var(--l);color:var(--m);text-align:center;border-radius:999px}.family-technical .cards{grid-template-columns:repeat(12,1fr)}.family-technical .card{grid-column:span 4}.family-technical .card:nth-child(2){transform:translateY(22px)}
/* editorial family: magazine rhythm */
.family-editorial h1{max-width:780px}.family-editorial .cards{grid-template-columns:repeat(2,1fr);counter-reset:tip}.family-editorial .card{min-height:210px}.family-editorial .card:after{counter-increment:tip;content:"0" counter(tip);position:absolute;left:18px;bottom:4px;font-size:64px;color:#d6b45a18;font-weight:900}
/* commercial family: deliberate ad inventory skeleton without fake brands */
.family-commercial main>section{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.family-commercial main>section>h1,.family-commercial main>section>.eyebrow,.family-commercial main>section>p:last-child{grid-column:1/-1}.family-commercial main>section>.card{grid-column:1/-1}.family-commercial .cards{display:grid;grid-template-columns:repeat(3,1fr);grid-column:1/-1}.family-commercial .card{border-style:dashed}
.hero-orbit{position:absolute;left:5vw;top:150px;width:190px;height:190px;border:1px solid #d6b45a55;border-radius:50%;pointer-events:none;animation:orbit 18s linear infinite}.hero-orbit:before,.hero-orbit:after{content:"";position:absolute;border-radius:50%}.hero-orbit:before{width:12px;height:12px;background:var(--gb);top:20px;right:20px;box-shadow:0 0 28px var(--g)}.hero-orbit:after{inset:32px;border:1px dashed #d6b45a33}
@keyframes reveal{from{opacity:.45;transform:translateY(22px)}to{opacity:1;transform:none}}@keyframes loadline{0%{transform:scaleX(0)}75%{transform:scaleX(.85)}100%{transform:scaleX(1);opacity:0}}@keyframes orbit{to{transform:rotate(360deg)}}
@media(max-width:760px){.hero-orbit{width:100px;height:100px;top:120px;opacity:.45}.family-decision .cards,.family-editorial .cards,.family-commercial main>section,.family-commercial .cards{grid-template-columns:1fr}.family-commercial main>section>*{grid-column:1!important}.family-technical .cards{display:grid;grid-template-columns:1fr}.family-technical .card{grid-column:auto}.family-technical .card:nth-child(2){transform:none}}
@media(prefers-reduced-motion:reduce){.route-loader,.hero-orbit{display:none!important}.motion-ready main>section>*{opacity:1!important;transform:none!important}.motion-ready main>section>*.seen{animation:none!important}.card,.card:before,body:before{transition:none!important}.card:hover{transform:none!important}}
/* Family palettes add restrained color while gold remains the shared identity. */
.family-process{--accent:#69d3c5;--accent-soft:#153b37}.family-decision{--accent:#a9c7ff;--accent-soft:#18263e}.family-technical{--accent:#a8df8e;--accent-soft:#1d351d}.family-editorial{--accent:#d5a8ff;--accent-soft:#332040}.family-commercial{--accent:#ffad85;--accent-soft:#42251b}
[class*="family-"] .eyebrow{color:var(--accent,var(--gb))}[class*="family-"] .card{border-color:color-mix(in srgb,var(--accent,var(--g)) 34%,#352e22);background:linear-gradient(145deg,color-mix(in srgb,var(--accent-soft,#191919) 35%,#151515),#101010)}
[class*="family-"] .fact{border-color:var(--accent,var(--g))}[class*="family-"] .card h2,[class*="family-"] .card h3{color:color-mix(in srgb,var(--accent,var(--gb)) 72%,white)}
.family-process .step:before{background:var(--accent);color:#07110f}.family-process .steps:before{background:linear-gradient(var(--accent),transparent)}
.family-decision .card:first-child{background:radial-gradient(circle at 85% 10%,var(--accent-soft),#121212 58%)}
.family-technical main>section:after{border-color:var(--accent);color:#dcebd6;background:linear-gradient(90deg,transparent,var(--accent-soft),transparent)}
.family-editorial .card:after{color:color-mix(in srgb,var(--accent) 16%,transparent)}
.family-commercial .card{border-color:color-mix(in srgb,var(--accent) 60%,#222)}
@supports not (color:color-mix(in srgb,red,blue)){[class*="family-"] .card{border-color:#665b48}[class*="family-"] .card h2,[class*="family-"] .card h3{color:#f3eadb}}