/* OCC 2027 · V2 — המרכז לתקשורת אופטית בע"מ
   tokens → base → header → hero → sections → components → floating UI → themes / accessibility */

@font-face{font-family:"Heebo";font-style:normal;font-weight:300 800;font-display:swap;
  src:url(../fonts/heebo-hebrew.woff2) format("woff2");unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:"Heebo";font-style:normal;font-weight:300 800;font-display:swap;
  src:url(../fonts/heebo-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  /* brand: deep navy + OCC blue + optical cyan (logo swoosh #1a8ac5) */
  --navy-950:#040a1e; --navy-900:#071030; --navy-800:#0b1a4a; --navy-700:#112a6e;
  --blue-700:#173fa8; --blue-600:#1d58d6; --blue-500:#2f6bff; --cyan-400:#22c8ff; --cyan-500:#0aa6e0; --logo-blue:#1a8ac5;

  /* light theme (default) */
  --bg:#ffffff; --bg-soft:#f4f8fd; --bg-tint:#eaf2fc; --surface:#ffffff; --surface-2:#f1f6fc;
  --head:#08122f; --text:#0f1b3f; --text-2:#3f4e78; --line:#dce6f4; --line-strong:#b9c9e3;
  --link:#1747b8; --accent:#0a6fa3; --focus:#1d58d6; --icon:#1d58d6; --dot:#1d58d6; --num-a:#1d58d6; --num-b:#0889c2;
  --btn-from:#2467ec; --btn-to:#173fa8; --btn-text:#fff; --btn-shadow:0 10px 24px -10px rgb(29 88 214/.65);
  --plate:#eef3fa; --plate-hi:#ffffff; --shadow-c:10 22 58;
  --ok:#0b7a4b; --ok-bg:#e3f6ec; --err:#b3261e; --err-bg:#fdeceb;
  --grid-op:1; --deco-op:.9;

  /* header is white in every theme: the logo is drawn for white */
  --hdr-bg:#ffffff; --hdr-text:#0a1636; --hdr-line:#e1e9f5; --hdr-hover:#173fa8;

  /* type (fluid) */
  --fs-0:clamp(.97rem,.94rem + .16vw,1.06rem);
  --fs-1:clamp(1.06rem,1rem + .26vw,1.2rem);
  --fs-2:clamp(1.22rem,1.1rem + .55vw,1.5rem);
  --lh:1.7;

  --s-1:.25rem; --s-2:.5rem; --s-3:.75rem; --s-4:1rem; --s-5:1.5rem; --s-6:2rem; --s-7:3rem; --s-8:4.5rem; --s-9:clamp(4rem,3rem + 5vw,7.5rem);
  --gutter:clamp(1rem,.45rem + 2.6vw,2.25rem);
  --container:1240px;
  --r-1:10px; --r-2:14px; --r-3:20px; --r-4:28px; --r-pill:999px;
  --shadow-1:0 1px 2px rgb(var(--shadow-c)/.05),0 6px 18px -8px rgb(var(--shadow-c)/.12);
  --shadow-2:0 2px 6px rgb(var(--shadow-c)/.06),0 24px 46px -18px rgb(var(--shadow-c)/.28);
  --ease:cubic-bezier(.22,.8,.24,1); --dur:.6s; --dur-s:.2s;
  --header-h:72px;
  --font:"Heebo",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}
@media (max-width:959px){:root{--header-h:64px}}

:root[data-theme="dark"]{
  --bg:#060d24; --bg-soft:#0a1433; --bg-tint:#0c1a42; --surface:#0e1a3e; --surface-2:#132250;
  --head:#ffffff; --text:#e8efff; --text-2:#b0bddf; --line:#1f3068; --line-strong:#31499a;
  --link:#8bb8ff; --accent:#58d3ff; --focus:#7fd4ff; --icon:#8dbaff; --dot:#4f93ff; --num-a:#7aa9ff; --num-b:#4fd2ff;
  --btn-from:#2b62ec; --btn-to:#1d58d6; --btn-shadow:0 10px 24px -10px rgb(47 107 255/.7);
  --plate:#e7edf7; --plate-hi:#ffffff; --shadow-c:0 0 0;
  --ok:#5be0a1; --ok-bg:#0d2b21; --err:#ff8e86; --err-bg:#341514;
  --grid-op:.9; --deco-op:.75;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;font-size:100%}
/* anchors and focus-scrolling clear the sticky header via scroll-margin on the targets (a root scroll-padding would make Tab on the header itself scroll the page) */
section[id]{scroll-margin-top:var(--header-h)}
main :is(a,button,input,textarea,select){scroll-margin-top:calc(var(--header-h) + 16px);scroll-margin-bottom:96px}
html.is-locked{overflow:hidden;scrollbar-gutter:stable}
/* the reserved scrollbar strip takes the colour of whatever is covering the page, so no stray strip shows beside the menu or the viewer */
html.lock-menu{background:#fff}
html.lock-viewer{background:#04081a}
body{margin:0;font-family:var(--font);font-size:var(--fs-0);line-height:var(--lh);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-wrap:break-word}
img,svg,video{display:block;max-width:100%}
img{height:auto}
h1,h2,h3,p,ul,figure,dialog{margin:0}
ul{padding:0;list-style:none}
a{color:var(--link);text-underline-offset:.2em}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer}
[hidden]{display:none!important}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.ico{width:1.35em;height:1.35em;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.container{width:min(100% - var(--gutter)*2,var(--container));margin-inline:auto}

:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:6px}
.skip-link{position:fixed;inset-block-start:8px;inset-inline-start:8px;z-index:200;background:#fff;color:#08122f;padding:.7rem 1.1rem;border-radius:var(--r-1);box-shadow:var(--shadow-2);font-weight:700;transform:translateY(-200%)}
.skip-link:focus{transform:none}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:50px;padding:.7rem 1.6rem;border:1.5px solid transparent;border-radius:var(--r-2);font-weight:700;font-size:var(--fs-0);text-decoration:none;line-height:1.2;
  transition:background var(--dur-s),border-color var(--dur-s),transform var(--dur-s) var(--ease),box-shadow var(--dur-s)}
.btn--lg{min-height:56px;padding:.85rem 2rem;font-size:var(--fs-1)}
.btn--primary{background:linear-gradient(135deg,var(--btn-from),var(--btn-to));color:var(--btn-text);box-shadow:var(--btn-shadow)}
.btn--primary:hover{transform:translateY(-2px);filter:brightness(1.08)}
.btn--ghost-dark{background:transparent;color:var(--text);border-color:var(--line-strong)}
.btn--ghost-dark:hover{background:var(--surface-2)}
.btn:active{transform:translateY(0)}
.icon-btn{display:inline-grid;place-items:center;width:46px;height:46px;border:1.5px solid var(--line-strong);border-radius:50%;background:transparent;color:var(--text);transition:background var(--dur-s)}
.icon-btn:hover{background:var(--surface-2)}
.icon-btn--on-dark{color:#fff;border-color:rgba(255,255,255,.4)}
.icon-btn--on-dark:hover{background:rgba(255,255,255,.14)}

/* ---------- header (white, in flow, sticky) ---------- */
.site-header{position:sticky;inset-block-start:0;z-index:100;background:var(--hdr-bg);color:var(--hdr-text);border-block-end:1px solid var(--hdr-line);transition:box-shadow var(--dur-s)}
.site-header.is-scrolled{box-shadow:0 10px 30px -18px rgb(10 22 58/.45)}
/* explicit physical layout, independent of the page's dir="rtl": logo LEFT; nav tabs (desktop) or hamburger (mobile) RIGHT.
   The bar is LTR; the nav / menu keep their own dir="rtl" so tabs, text and the open menu stay fully RTL. */
.header__bar{display:flex;align-items:center;justify-content:space-between;gap:var(--s-5);height:calc(var(--header-h) - 1px);direction:ltr}
.brand{display:flex;align-items:center;flex:none;height:100%;padding-block:.5rem;border-radius:8px}
.brand picture{display:block}
.brand img{width:150px;height:auto}
@media (min-width:400px){.brand img{width:172px}}
@media (min-width:960px){.brand img{width:206px}}
.nav{display:flex;align-items:center;gap:var(--s-5);margin-left:auto;direction:rtl}
.nav__list{display:flex;align-items:center;gap:.15rem}
.nav__link{position:relative;display:block;padding:.65rem .95rem;font-weight:600;font-size:1rem;line-height:1.2;color:var(--hdr-text);text-decoration:none;border-radius:var(--r-1);transition:color var(--dur-s)}
.nav__link::after{content:"";position:absolute;inset-inline:.95rem;inset-block-end:.28rem;height:2px;border-radius:2px;background:linear-gradient(270deg,var(--cyan-400),var(--blue-600));transform:scaleX(0);transform-origin:100% 50%;transition:transform .35s var(--ease)}
.nav__link:hover{color:var(--hdr-hover)}
.nav__link:hover::after,.nav__link[aria-current="true"]::after{transform:scaleX(1)}
.nav__link[aria-current="true"]{color:var(--hdr-hover)}
.nav__cta-item{margin-inline-start:.5rem}
.nav__link--cta{padding:.7rem 1.35rem;color:#fff;background:linear-gradient(135deg,#2467ec,#173fa8);box-shadow:0 8px 20px -10px rgb(29 88 214/.8);transition:transform var(--dur-s) var(--ease),filter var(--dur-s)}
.nav__link--cta::after{display:none}
.nav__link--cta:hover,.nav__link--cta[aria-current="true"]{color:#fff;filter:brightness(1.1);transform:translateY(-1px)}
.nav__foot{display:none}
.menu-btn{display:none;place-items:center;width:48px;height:48px;border:1.5px solid var(--hdr-line);border-radius:var(--r-2);background:#fff;color:var(--hdr-text);transition:background var(--dur-s),border-color var(--dur-s)}
.menu-btn:hover{background:#f1f6fc;border-color:#c5d4ec}
.menu-btn__bars{position:relative;width:22px;height:16px}
.menu-btn__bars i{position:absolute;inset-inline:0;height:2px;border-radius:2px;background:currentColor;transition:top .3s var(--ease),transform .3s var(--ease),opacity .2s}
.menu-btn__bars i:nth-child(1){top:0}
.menu-btn__bars i:nth-child(2){top:7px}
.menu-btn__bars i:nth-child(3){top:14px}
.menu-btn[aria-expanded="true"] i:nth-child(1){top:7px;transform:rotate(45deg)}
.menu-btn[aria-expanded="true"] i:nth-child(2){opacity:0;transform:scaleX(.2)}
.menu-btn[aria-expanded="true"] i:nth-child(3){top:7px;transform:rotate(-45deg)}

@media (max-width:959px){
  .menu-btn{display:grid}
  .nav{position:fixed;inset:var(--header-h) 0 0 0;z-index:99;flex-direction:column;align-items:stretch;justify-content:space-between;gap:var(--s-5);margin:0;
    padding:var(--s-4) var(--gutter) calc(var(--s-5) + env(safe-area-inset-bottom));background:#fff url(../images/bg/trails.svg) 50% 62%/190% auto no-repeat;overflow:hidden;overscroll-behavior:contain;
    opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .25s,transform .35s var(--ease),visibility 0s linear .35s}
  .nav.is-open{opacity:1;visibility:visible;transform:none;transition-delay:0s}
  .nav__list{flex-direction:column;align-items:stretch;gap:0}
  .nav__list>li{border-block-end:1px solid var(--hdr-line)}
  .nav__link{display:flex;align-items:center;justify-content:space-between;padding:1.05rem .35rem;font-size:1.3rem;font-weight:700;border-radius:0}
  .nav__link::after{position:static;inset:auto;width:22px;height:22px;border-radius:0;transform:none;background:none;border:solid currentColor;border-width:0 0 2px 2px;rotate:45deg;scale:.42;translate:6px 0;opacity:.45;transition:translate .3s var(--ease),opacity .2s}
  .nav__link:hover::after,.nav__link[aria-current="true"]::after{transform:none;translate:0 0;opacity:1}
  .nav__cta-item{margin:var(--s-4) 0 0;border:0!important}
  .nav__link--cta{justify-content:center;padding:1rem;font-size:1.15rem;border-radius:var(--r-2)}
  .nav__link--cta::after{display:none}
  .nav__foot{display:grid;gap:.5rem}
  .nav__contact{display:flex;align-items:center;gap:.75rem;padding:.8rem 1rem;border-radius:var(--r-2);background:#f1f6fc;color:var(--hdr-text);font-weight:600;text-decoration:none}
  .nav__contact .ico{color:var(--blue-600)}
}
@media (max-width:959px) and (max-height:560px){
  .nav{gap:var(--s-3);padding-block-start:var(--s-3)}
  .nav__list{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--s-5)}
  .nav__link{padding-block:.7rem;font-size:1.1rem}
  .nav__cta-item{grid-column:1/-1;margin-block-start:var(--s-3)}
  .nav__link--cta{padding-block:.75rem}
  .nav__foot{display:none}
}

/* ---------- hero ---------- */
.hero{position:relative;isolation:isolate;display:grid;align-items:center;min-height:max(560px,calc(100svh - var(--header-h)));padding-block:var(--s-8) calc(var(--s-8) + 40px);background:var(--navy-950);color:#fff;overflow:hidden;overflow:clip}
.hero__media,.hero__video{position:absolute;inset:0;width:100%;height:100%;z-index:-4}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:30% 50%}
.hero__video{object-fit:cover;object-position:30% 50%;opacity:0;transition:opacity 1.4s ease;z-index:-3}
.hero__video.is-ready{opacity:1}
.hero__scrim{position:absolute;inset:0;z-index:-2;
  background:linear-gradient(270deg,rgb(4 10 30/.9) 0%,rgb(4 10 30/.72) 28%,rgb(4 10 30/.22) 62%,rgb(4 10 30/0) 100%),
             linear-gradient(0deg,rgb(4 10 30/.7),transparent 34%),
             linear-gradient(180deg,rgb(4 10 30/.4),transparent 22%)}
.hero__grid{position:absolute;inset:0;z-index:-1;background:url(../images/bg/grid.svg) 0 0/56px 56px;opacity:.55;
  -webkit-mask-image:radial-gradient(75% 85% at 22% 42%,#000 0%,transparent 72%);mask-image:radial-gradient(75% 85% at 22% 42%,#000 0%,transparent 72%)}
.hero__inner{position:relative;display:grid;justify-content:start}
/* luminous accent UNDER the headline: the fiberline used under every section heading, but as long as the headline itself
   (the grid column is exactly as wide as the headline, so 100% = the headline's width; capped on very wide screens), drawn once on load */
.hero__inner .hero__accent{width:min(100%,38rem);margin-block:clamp(1.1rem,.7rem + 1.3vw,2rem) 0;filter:drop-shadow(0 0 7px rgb(34 200 255/.55))}
.js .hero__accent{animation:accentin 1s .35s var(--ease) both}
@keyframes accentin{from{clip-path:inset(-24px 0 -24px 100%)}to{clip-path:inset(-24px -24px -24px -24px)}}
.hero h1{font-size:clamp(2.7rem,1rem + 7.2vw,7.25rem);line-height:1.03;font-weight:800;letter-spacing:-.022em;max-width:14ch;text-shadow:0 2px 30px rgb(4 10 30/.5);text-wrap:balance}
.h1-line{display:block}
.h1-line--accent{padding-block-end:.1em;background:linear-gradient(270deg,#fff 0%,#aee8ff 45%,#4cc4ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.hero__wave{position:absolute;inset-inline:0;inset-block-end:-1px;z-index:1;width:100%;height:clamp(40px,6.5vw,100px);pointer-events:none;overflow:visible}
.hero__wave-fill{fill:var(--bg)}
.hero__wave-line{fill:none;stroke:var(--cyan-400);stroke-width:1.5;vector-effect:non-scaling-stroke;opacity:.8;filter:drop-shadow(0 0 5px rgb(34 200 255/.9))}
.js .hero__wave-line{stroke-dasharray:3600;stroke-dashoffset:3600;animation:drawlong 2.8s .4s var(--ease) forwards}
@keyframes drawlong{to{stroke-dashoffset:0}}
@keyframes draw{to{stroke-dashoffset:0}}

/* desktop: the headline lives in the dark-navy negative space on the inline-start (right) side of the hero, away from the lit fibres.
   Size and position follow the viewport (vw / container), not pixel offsets. */
@media (min-width:720px){
  .hero h1{font-size:clamp(2.9rem,5.3vw,8.5rem)}
}
@media (min-width:1500px){.hero__inner{width:min(100% - var(--gutter)*2,88vw)}}
/* portrait tablets: the lit fibres sweep across the middle, so the headline moves up into the clean navy corner */
@media (min-width:720px) and (max-width:1023px) and (orientation:portrait){
  .hero{align-items:start;padding-block-start:clamp(3rem,13svh,8rem)}
}

@media (max-width:719px){
  .hero{align-items:end;min-height:max(560px,calc(100svh - var(--header-h)));padding-block:var(--s-7) clamp(4.5rem,21svh,10.5rem)}
  .hero__media img,.hero__video{object-position:50% 0}
  .hero__scrim{background:linear-gradient(0deg,rgb(4 10 30/.97) 0%,rgb(4 10 30/.86) 30%,rgb(4 10 30/.28) 56%,rgb(4 10 30/0) 76%),linear-gradient(180deg,rgb(4 10 30/.35),transparent 18%)}
  .hero__grid{-webkit-mask-image:radial-gradient(90% 55% at 40% 28%,#000 0%,transparent 75%);mask-image:radial-gradient(90% 55% at 40% 28%,#000 0%,transparent 75%)}
}

/* ---------- optical fibre network: lives ONLY in the outer page margins, beside the content column, never over any content.
   Two strips (left / right) stretched over <main>; each is as wide as the free margin minus a safe zone, so lines can never reach text, cards, images or forms.
   Wide screens: a branching network that fades towards the content; narrow screens: one quiet fibre in the thin margin. The hero sits above (z-index 3). ---------- */
main{position:relative}
.hero{z-index:3}
.fibers-bg{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.fibers-bg i{position:absolute;inset-block:0;width:max(8px,calc((100% - min(100% - var(--gutter)*2,var(--container)))/2 - 22px));background:var(--fib-img) 0 0/100% 100% no-repeat}
.fibers-bg i:first-child{left:0}
.fibers-bg i:last-child{right:0;transform:scaleX(-1)}
@media (min-width:1100px){.fibers-bg i{-webkit-mask-image:linear-gradient(90deg,#000 50%,transparent 100%);mask-image:linear-gradient(90deg,#000 50%,transparent 100%)}}
:root{--fib-img:url(../images/bg/fibers-n-light.svg)}:root[data-theme="dark"]{--fib-img:url(../images/bg/fibers-n-dark.svg)}
@media (min-width:1100px){:root{--fib-img:url(../images/bg/fibers-g-light.svg)}:root[data-theme="dark"]{--fib-img:url(../images/bg/fibers-g-dark.svg)}}
@media (prefers-reduced-motion:reduce){:root{--fib-img:url(../images/bg/fibers-n-light-static.svg)}:root[data-theme="dark"]{--fib-img:url(../images/bg/fibers-n-dark-static.svg)}}
@media (prefers-reduced-motion:reduce) and (min-width:1100px){:root{--fib-img:url(../images/bg/fibers-g-light-static.svg)}:root[data-theme="dark"]{--fib-img:url(../images/bg/fibers-g-dark-static.svg)}}
:root.a11y-motion{--fib-img:url(../images/bg/fibers-n-light-static.svg)}:root[data-theme="dark"].a11y-motion{--fib-img:url(../images/bg/fibers-n-dark-static.svg)}
@media (min-width:1100px){:root.a11y-motion{--fib-img:url(../images/bg/fibers-g-light-static.svg)}:root[data-theme="dark"].a11y-motion{--fib-img:url(../images/bg/fibers-g-dark-static.svg)}}
:root.a11y-contrast{--fib-img:none}

/* ---------- sections, backgrounds, headings ---------- */
.section{position:relative;padding-block:var(--s-9)}
.section__head{margin-block-end:clamp(2rem,1.2rem + 3vw,3.5rem)}
.section__head h2{font-size:clamp(2.1rem,1.5rem + 2.6vw,3.5rem);line-height:1.08;font-weight:800;letter-spacing:-.018em;color:var(--head)}
.fiberline{display:block;position:relative;width:clamp(84px,12vw,128px);height:3px;margin-block-start:var(--s-4);border-radius:3px;background:linear-gradient(270deg,var(--blue-600),var(--cyan-400) 60%,rgb(34 200 255/0))}
.fiberline::before{content:"";position:absolute;inset-block-start:50%;inset-inline-start:0;width:9px;height:9px;translate:0 -50%;border-radius:50%;background:#fff;box-shadow:0 0 0 3px var(--cyan-400),0 0 14px 3px rgb(34 200 255/.65)}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-3);box-shadow:var(--shadow-1)}

/* ---------- about ---------- */
.about{background:radial-gradient(55% 45% at 88% 50%,rgb(34 200 255/.07),transparent 100%),linear-gradient(180deg,var(--bg) 0%,var(--bg-soft) 100%)}
.about__intro{display:grid;gap:clamp(2rem,1.2rem + 3vw,3.5rem);align-items:center}
.about__copy{display:grid;gap:var(--s-6)}
.about__head{margin-block-end:0}
.about__lead{display:grid;gap:var(--s-4);max-width:40rem}
.about__lead-main{font-size:clamp(1.45rem,1.05rem + 1.6vw,2.3rem);line-height:1.3;font-weight:700;letter-spacing:-.01em;color:var(--head);text-wrap:balance}
.about__lead-sub{font-size:var(--fs-1);line-height:1.85;color:var(--text-2)}
.about__figure{position:relative;margin:0}
@media (min-width:640px) and (max-width:959px){.about__figure{max-width:38rem;margin-inline:auto}}
/* one clean image container: rounded corners and a very soft shadow only (no backdrop panel, no caption) */
.about__frame{border-radius:var(--r-4);overflow:hidden;background:var(--plate);box-shadow:0 1px 2px rgb(var(--shadow-c)/.06),0 14px 30px -18px rgb(var(--shadow-c)/.32)}
.about__frame img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.about__blocks{display:grid;gap:var(--s-7);margin-block-start:clamp(3.25rem,2rem + 5vw,6rem)}
.about__block{position:relative;display:grid;gap:var(--s-4);align-content:start;padding-block-start:var(--s-5);border-block-start:1px solid var(--line)}
.about__block::before{content:"";position:absolute;inset-inline-start:0;inset-block-start:-1px;width:64px;height:3px;border-radius:3px;background:linear-gradient(270deg,var(--blue-600),var(--cyan-400))}
.about__ico{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;color:var(--icon);background:linear-gradient(145deg,var(--bg-tint),var(--surface));border:1px solid var(--line)}
.about__ico .ico{width:24px;height:24px}
.about__text{display:grid;gap:.7rem;max-width:34rem}
.about__text p{font-size:var(--fs-0);line-height:1.85;color:var(--text-2)}
.about__text p:first-child{color:var(--text);font-weight:600}
@media (min-width:900px){.about__blocks{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(2rem,3.4vw,3.75rem)}}
@media (min-width:960px){
  .about__intro{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);column-gap:clamp(3rem,6vw,6.5rem)}
}

/* ---------- highlights: its own credibility section ---------- */
.highlights{position:relative;padding-block:clamp(3.25rem,2rem + 5vw,6.25rem) 0;background:radial-gradient(50% 45% at 12% 60%,rgb(47 107 255/.08),transparent 100%),radial-gradient(45% 40% at 90% 35%,rgb(34 200 255/.06),transparent 100%),linear-gradient(180deg,var(--bg-soft) 0%,var(--bg-tint) 100%)}
.counts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:clamp(.75rem,.4rem + 1.5vw,1.5rem)}
@media (min-width:900px){.counts{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* all four cards share one visual language: dark premium card, blue accent edge, white type (white-on-navy in light AND dark theme) */
.count{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:clamp(.8rem,.55rem + .8vw,1.2rem);padding:clamp(1rem,.7rem + 1.1vw,1.6rem);color:#fff;background:linear-gradient(155deg,#10214f 0%,#091433 100%);border:1px solid rgb(120 165 255/.26);border-radius:var(--r-3);box-shadow:0 1px 2px rgb(4 10 30/.12),0 18px 34px -20px rgb(4 10 30/.7);overflow:hidden;
  transition:transform var(--dur-s) var(--ease),box-shadow var(--dur-s),border-color var(--dur-s)}
.count::before{content:"";position:absolute;inset-inline:0;inset-block-start:0;height:3px;background:linear-gradient(270deg,var(--cyan-400),var(--blue-600));opacity:.95}
.count:hover{transform:translateY(-3px);box-shadow:0 2px 6px rgb(4 10 30/.16),0 24px 42px -20px rgb(4 10 30/.8);border-color:rgb(120 165 255/.5)}
.count__ico{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:14px;color:#9cc4ff;background:rgb(255 255 255/.06);border:1px solid rgb(143 186 255/.3)}
.count__ico .ico{width:24px;height:24px}
.count__text{display:block;font-size:clamp(1.08rem,.96rem + .62vw,1.5rem);font-weight:700;line-height:1.35;color:#fff;text-wrap:balance}
.count__nb{white-space:nowrap} /* "ב־90": the preposition + maqaf never separates from the number (U+05BE allows a line break after it) */
.count__num{font-weight:800;font-variant-numeric:tabular-nums;color:#fff}
.count__label{color:#fff}
@media (max-width:359px){
  .counts{grid-template-columns:minmax(0,1fr)}
  .count{flex-direction:row;align-items:center}
}

/* the statement is the closing line of the SAME section (no band, no border): it sits on the shared background */
.credo{position:relative;max-width:min(100%,54rem);margin-inline:auto;margin-block-start:var(--s-9);text-align:center;font-size:clamp(1.5rem,1.05rem + 2.1vw,2.7rem);line-height:1.28;font-weight:700;letter-spacing:-.012em;color:var(--head);text-wrap:balance}
/* horizontal blue/cyan accent under the whole statement (same gradient language as the heading accents), centred */
.credo::after{content:"";display:block;width:clamp(96px,14vw,176px);height:3px;margin:clamp(1.1rem,.8rem + 1.2vw,1.75rem) auto 0;border-radius:3px;background:linear-gradient(90deg,rgb(34 200 255/0),var(--blue-600) 22%,var(--cyan-400) 50%,var(--blue-600) 78%,rgb(34 200 255/0));box-shadow:0 0 14px rgb(34 200 255/.35)}

/* ---------- services ---------- */
.services{background:radial-gradient(50% 30% at 85% 55%,rgb(34 200 255/.06),transparent 100%),linear-gradient(180deg,var(--bg-tint) 0%,var(--bg) 100%)}
.services__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(.85rem,.5rem + 1.4vw,1.5rem)}
.svc{position:relative;display:flex;flex-direction:column;gap:var(--s-5);padding:clamp(1.2rem,.9rem + 1vw,1.75rem);border-radius:var(--r-3);overflow:hidden;
  transition:transform var(--dur-s) var(--ease),box-shadow var(--dur-s),border-color var(--dur-s)}
.svc::before{content:"";position:absolute;inset-inline:0;inset-block-start:0;height:3px;background:linear-gradient(270deg,var(--cyan-400),var(--blue-600));transform:scaleX(.18);transform-origin:100% 50%;transition:transform .55s var(--ease)}
.svc:hover{transform:translateY(-3px);box-shadow:var(--shadow-2);border-color:var(--line-strong)}
.svc:hover::before{transform:scaleX(1)}
/* icon (inline-start = right in RTL) + heading as one grid component: the icon never moves when the heading wraps; the heading is centred on it */
.svc__top{--svc-ico:58px;display:grid;grid-template-columns:var(--svc-ico) minmax(0,1fr);align-items:start;column-gap:var(--s-4)}
.svc__iconwrap{display:grid;place-items:center;width:var(--svc-ico);height:var(--svc-ico);border-radius:16px;background:linear-gradient(145deg,var(--bg-tint),var(--surface));border:1px solid var(--line)}
.svc__icon{width:36px;height:36px;color:var(--icon);fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.svc__icon .glow{stroke:var(--cyan-500)}
.svc h3{display:grid;align-content:center;min-block-size:var(--svc-ico);font-size:clamp(1.12rem,1.03rem + .4vw,1.36rem);line-height:1.3;font-weight:800;color:var(--head);text-wrap:balance}
.svc__list{display:grid;gap:.7rem;padding-block-start:var(--s-5);border-block-start:1px solid var(--line)}
@media (max-width:359px){.svc__top{--svc-ico:52px;column-gap:var(--s-3)}}
.svc__list li{position:relative;padding-inline-start:1.55rem;font-size:var(--fs-0);font-weight:500;line-height:1.5;color:var(--text-2)}
.svc__list li::before{content:"";position:absolute;inset-inline-start:.1rem;inset-block-start:.5em;width:8px;height:8px;border-radius:50%;background:var(--dot);box-shadow:0 0 0 3px rgb(34 200 255/.24)}
.svc--wide .svc__list li::before{background:var(--cyan-500)}
.svc__art{display:none}
@media (min-width:640px){
  .services__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .svc--tall,.svc--wide{grid-column:1/-1}
  .svc--tall .svc__list{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s-5)}
}
@media (min-width:1024px){
  .services__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .svc--tall{grid-column:3;grid-row:1/span 2}
  .svc--tall .svc__list{grid-template-columns:minmax(0,1fr);align-content:start;gap:.85rem}
  .svc--tall .svc__art{display:block;margin-block-start:auto;width:100%;height:auto;aspect-ratio:3/1;color:var(--icon);opacity:.85}
  .svc--wide{flex-direction:row;align-items:center;gap:var(--s-6)}
  .svc--wide .svc__top{flex:1 1 55%}
  .svc--wide .svc__list{flex:1 1 45%;padding-block-start:0;border-block-start:0;padding-inline-start:var(--s-6);border-inline-start:1px solid var(--line)}
  .svc--wide{background:linear-gradient(120deg,var(--surface) 0%,var(--surface) 55%,var(--bg-tint) 100%)}
}

/* ---------- catalog ---------- */
.catalog{background:radial-gradient(50% 18% at 12% 40%,rgb(47 107 255/.06),transparent 100%),linear-gradient(180deg,var(--bg) 0%,var(--bg-soft) 100%)}
.catalog__tools{display:flex;flex-wrap:wrap;gap:var(--s-4);align-items:center;justify-content:space-between;margin-block-end:var(--s-4)}
.filters{display:flex;flex-wrap:nowrap;gap:var(--s-2);min-width:0;max-width:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-block:.5rem;margin-block:-.5rem}
.filters::-webkit-scrollbar{display:none}
.filters .chip{flex:0 0 auto;white-space:nowrap}
.chip{display:inline-flex;align-items:center;gap:.55em;min-height:46px;padding:.4rem 1.05rem;border:1.5px solid var(--line-strong);border-radius:var(--r-pill);background:var(--surface);font-weight:700;color:var(--text);transition:background var(--dur-s),color var(--dur-s),border-color var(--dur-s),box-shadow var(--dur-s)}
.chip:hover{border-color:var(--blue-600);color:var(--link)}
.chip.is-active{background:linear-gradient(135deg,var(--btn-from),var(--btn-to));border-color:transparent;color:#fff;box-shadow:var(--btn-shadow)}
.chip__n{display:inline-grid;place-items:center;min-width:1.8em;padding-inline:.4em;border-radius:var(--r-pill);background:var(--bg-tint);color:var(--text-2);font-size:.82em}
.chip.is-active .chip__n{background:rgb(0 0 0/.28);color:#fff}
.search{position:relative;flex:1 1 260px;max-width:400px}
.search__label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.search .ico{position:absolute;inset-inline-start:1rem;inset-block-start:50%;translate:0 -50%;color:var(--text-2);pointer-events:none}
.search__input{width:100%;min-height:50px;padding:.6rem 1rem;padding-inline-start:2.9rem;border:1.5px solid var(--line-strong);border-radius:var(--r-pill);background:var(--surface);color:var(--text)}
.search__input::placeholder{color:var(--text-2);opacity:.85}
.catalog__status{margin-block-end:var(--s-5);color:var(--text-2);font-size:.92rem}
.catalog__empty{padding:var(--s-7);text-align:center;font-size:var(--fs-1);color:var(--text-2)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr));gap:var(--s-3)}
@media (min-width:640px){.grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:var(--s-5)}}
@media (max-width:340px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-2)}}
@media (max-width:639px){.filters{gap:.45rem}.chip{min-height:44px;padding:.3rem .8rem;gap:.4em;font-size:.92rem}.p-card__body{padding:var(--s-3) var(--s-3) var(--s-4);min-height:4.6rem}.p-card__name{font-size:var(--fs-0)}.p-card{border-radius:var(--r-2)}}
.p-item[hidden]{display:none}
.p-card{position:relative;display:flex;flex-direction:column;height:100%;color:var(--text);text-decoration:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-3);overflow:hidden;box-shadow:var(--shadow-1);
  transition:transform var(--dur-s) var(--ease),box-shadow var(--dur-s),border-color var(--dur-s)}
.p-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-2);border-color:var(--blue-600)}
.p-card__plate{position:relative;display:block;aspect-ratio:1/1;background:#fff;overflow:hidden}  /* the unified catalog template: every product image is a white square, so the plate is white in both themes */
.p-card__plate::after{display:none;content:"";position:absolute;inset:10px;pointer-events:none;opacity:.55;transition:opacity var(--dur-s);
  background:
    linear-gradient(var(--blue-600),var(--blue-600)) 0 0/12px 1.5px no-repeat,linear-gradient(var(--blue-600),var(--blue-600)) 0 0/1.5px 12px no-repeat,
    linear-gradient(var(--blue-600),var(--blue-600)) 100% 0/12px 1.5px no-repeat,linear-gradient(var(--blue-600),var(--blue-600)) 100% 0/1.5px 12px no-repeat,
    linear-gradient(var(--blue-600),var(--blue-600)) 0 100%/12px 1.5px no-repeat,linear-gradient(var(--blue-600),var(--blue-600)) 0 100%/1.5px 12px no-repeat,
    linear-gradient(var(--blue-600),var(--blue-600)) 100% 100%/12px 1.5px no-repeat,linear-gradient(var(--blue-600),var(--blue-600)) 100% 100%/1.5px 12px no-repeat}
.p-card:hover .p-card__plate::after{opacity:1}
.p-card__plate img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.p-card.is-wide .p-card__plate img{object-fit:contain;padding:6%}
.p-card:hover .p-card__plate img{transform:scale(1.045)}
.p-card__body{display:flex;flex-direction:column;gap:.25rem;padding:var(--s-4) var(--s-4) var(--s-5);min-height:5.4rem;border-block-start:1px solid var(--line)}
.p-card__cat{font-size:.8rem;font-weight:700;color:var(--accent);letter-spacing:.02em}
.p-card__name{font-size:var(--fs-1);line-height:1.35;font-weight:700;color:var(--head)}
.p-card__zoom{position:absolute;inset-block-start:var(--s-3);left:var(--s-3);display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:rgb(255 255 255/.94);color:var(--navy-800);box-shadow:var(--shadow-1);opacity:0;transform:scale(.85);transition:opacity var(--dur-s),transform var(--dur-s) var(--ease)}
.p-card:hover .p-card__zoom,.p-card:focus-visible .p-card__zoom{opacity:1;transform:none}
@media (hover:none){.p-card__zoom{opacity:1;transform:none;width:34px;height:34px}}

/* ---------- viewer (native dialog) ---------- */
.viewer{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;background:rgb(4 8 22/.95);color:#fff}
.viewer:not([open]){display:none}
.viewer[open]{display:grid;grid-template-rows:auto 1fr}
.viewer::backdrop{background:rgb(4 8 22/.95)}
.viewer__bar{display:flex;align-items:center;justify-content:space-between;padding:max(var(--s-3),env(safe-area-inset-top)) var(--gutter) var(--s-3)}
.viewer__count{font-weight:700;font-variant-numeric:tabular-nums}
.viewer__stage{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--s-3);padding:0 var(--s-3) max(var(--s-4),env(safe-area-inset-bottom));min-height:0}
.viewer__fig{display:flex;flex-direction:column;align-items:center;gap:var(--s-4);min-height:0;max-height:100%}
.viewer__imgwrap{position:relative;display:grid;place-items:center;min-height:0;max-width:100%;border-radius:var(--r-2);overflow:hidden;background:#fff}
.viewer__imgwrap img{width:auto;height:auto;max-width:min(100%,92vw);max-height:calc(100svh - 190px);object-fit:contain;transition:opacity .25s}
.viewer__imgwrap img.is-loading{opacity:.25}
.viewer__cap{font-size:var(--fs-1);font-weight:700;text-align:center;line-height:1.4;max-width:60ch}
.viewer__cap small{display:block;font-size:.85rem;font-weight:600;color:#9ec3ff}
.viewer__nav{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;border:1.5px solid rgba(255,255,255,.4);background:rgba(255,255,255,.08);color:#fff}
.viewer__nav:hover{background:rgba(255,255,255,.2)}
@media (max-width:640px){
  .viewer__stage{grid-template-columns:minmax(0,1fr);grid-template-rows:1fr auto;position:relative}
  .viewer__fig{grid-row:1}
  .viewer__nav{position:absolute;inset-block-end:var(--s-4);width:56px;height:56px}
  .viewer__nav--prev{inset-inline-start:var(--gutter)}
  .viewer__nav--next{inset-inline-end:var(--gutter)}
  .viewer__imgwrap img{max-height:calc(100svh - 270px)}
}
.spinner{display:none;width:18px;height:18px;border:2.5px solid rgb(255 255 255/.35);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}
.spinner--big{position:absolute;inset:50% auto auto 50%;translate:-50% -50%;width:42px;height:42px;border-color:rgb(11 19 48/.2);border-top-color:var(--navy-800)}
.viewer__imgwrap.is-busy .spinner--big{display:block}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- contact ---------- */
.contact{padding-block-end:calc(var(--s-9) + 24px);background:linear-gradient(180deg,var(--bg-soft) 0%,var(--bg-tint) 100%)}
.contact__grid{display:grid;gap:var(--s-5);align-items:stretch;grid-template-columns:minmax(0,1fr)}
@media (min-width:960px){.contact__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--s-6)}}
.contact__info{position:relative;isolation:isolate;display:flex;border:1px solid rgb(255 255 255/.1);padding:clamp(1.4rem,1rem + 1.6vw,2.4rem);border-radius:var(--r-4);overflow:hidden;color:#fff;background:linear-gradient(150deg,var(--navy-900) 0%,var(--navy-800) 60%,#10337f 130%);box-shadow:var(--shadow-2)}
.contact__info::before{content:"";position:absolute;inset:auto 0 0 0;height:34%;z-index:-1;background:url(../images/bg/fiber-band.svg) 100% 100%/cover no-repeat;opacity:.7}
@media (max-width:959px){.contact__info::before{display:none}}
.info{display:grid;gap:var(--s-5);width:100%;align-content:start}
.info__item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-4);align-items:start}
.info__item+.info__item{padding-block-start:var(--s-5);border-block-start:1px solid rgb(255 255 255/.14)}
.info__ico{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:rgb(34 200 255/.14);color:#8fe0ff;border:1px solid rgb(143 224 255/.28)}
.info__item h3{font-size:.95rem;font-weight:700;letter-spacing:.02em;color:#8fe0ff;margin-block-end:.2rem}
.info__item p{font-size:var(--fs-1);font-weight:600;line-height:1.55;color:#fff}
.info__link{color:#bfeaff;text-decoration:none;font-weight:600;border-radius:6px;transition:color var(--dur-s)}
.info__link:hover{color:#fff;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:.3em;text-decoration-color:var(--cyan-400)}
.contact__info :focus-visible{outline:3px solid #8fe0ff;outline-offset:3px;text-decoration:underline}
.info__link--map{display:inline-flex;align-items:center;gap:.4em;margin-block-start:.4rem;font-size:.95rem;color:#8fe0ff}
.info__link--map .ico{width:1em;height:1em}
.contact__form{padding:clamp(1.3rem,.9rem + 2vw,2.6rem);border-radius:var(--r-4);background:var(--surface);color:var(--text);border:1px solid var(--line);box-shadow:var(--shadow-2);position:relative;overflow:hidden}
.contact__form::before{content:"";position:absolute;inset-inline:0;inset-block-start:0;height:4px;background:linear-gradient(270deg,var(--cyan-400),var(--blue-600))}
.form{display:grid;gap:var(--s-5)}
.form__row{display:grid;gap:var(--s-5)}
@media (min-width:640px){.form__row{grid-template-columns:1fr 1fr}}
.field{display:grid;gap:.45rem}
.field label{font-weight:700;color:var(--head)}
.field input,.field textarea{width:100%;min-height:54px;padding:.8rem 1rem;border:1.5px solid var(--line-strong);border-radius:var(--r-2);background:var(--surface-2);color:var(--text);transition:border-color var(--dur-s),background var(--dur-s),box-shadow var(--dur-s)}
.field textarea{min-height:150px;resize:vertical}
.field input:hover,.field textarea:hover{border-color:var(--blue-600)}
.field input:focus-visible,.field textarea:focus-visible{outline:3px solid var(--focus);outline-offset:1px;background:var(--surface)}
.field [aria-invalid="true"]{border-color:var(--err);background:var(--err-bg)}
.field__err{color:var(--err);font-weight:700;font-size:.92rem}
.field__err:not([hidden]){display:flex;gap:.4em;align-items:center}
.hp{position:absolute;inset-inline-start:-9999px;width:1px;height:1px;overflow:hidden}
.form__actions{display:flex;flex-wrap:wrap;gap:var(--s-4);align-items:center}
.form__status{flex:1 1 220px;font-weight:700;min-height:1.5em}
.form__status.is-ok{color:var(--ok);background:var(--ok-bg);padding:.75rem 1rem;border-radius:var(--r-2)}
.form__status.is-err{color:var(--err);background:var(--err-bg);padding:.75rem 1rem;border-radius:var(--r-2)}
.btn .spinner{display:none}
.btn.is-busy{pointer-events:none;opacity:.85}
.btn.is-busy .spinner{display:inline-block}
@media (max-width:639px){.form__actions .btn{width:100%}}

/* ---------- footer ---------- */
.site-footer{position:relative;isolation:isolate;background:linear-gradient(180deg,var(--navy-900),var(--navy-950));color:#fff;text-align:center;padding-block:clamp(2.25rem,1.6rem + 2.6vw,3.5rem) 4.5rem}
.site-footer::before{content:"";position:absolute;inset-inline:0;inset-block-start:-56px;height:56px;z-index:0;background:linear-gradient(180deg,rgb(7 16 48/0),var(--navy-900));pointer-events:none}
.footer__inner{display:grid;justify-items:center;gap:var(--s-4)}
.footer__brand{font-size:clamp(1.25rem,.45rem + 4.6vw,2.85rem);font-weight:700;letter-spacing:.01em;line-height:1.25;color:#fff;text-wrap:balance}
.footer__contact{display:grid;grid-template-columns:repeat(2,auto);justify-content:center;gap:.7rem 2.5rem;font-size:.98rem;color:rgb(255 255 255/.9)}
.footer__contact li{display:inline-flex;align-items:center;gap:.55rem;line-height:1.5}
.footer__contact .ico{flex:none;color:#6fd8ff;width:1.25em;height:1.25em}
.footer__contact a{display:inline-block;padding-block:.2rem;color:#fff;text-decoration:none;border-radius:6px}
.footer__contact a:hover{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:.3em;text-decoration-color:var(--cyan-400)}
.footer__contact a:focus-visible{outline-color:#8fe0ff;text-decoration:underline}
@media (min-width:1100px){.footer__contact{display:flex;flex-wrap:nowrap;justify-content:center;gap:0 2.5rem}.footer__contact li{white-space:nowrap}}
@media (max-width:639px){.footer__contact{grid-template-columns:minmax(0,1fr);justify-items:center;gap:.55rem}.footer__contact li{text-align:center}}
.footer__rule{display:block;width:min(100%,44rem);height:1px;margin-block:var(--s-2) var(--s-1);background:linear-gradient(90deg,rgb(34 200 255/0),rgb(143 224 255/.4) 50%,rgb(34 200 255/0))}
.footer__copy{font-size:.88rem;line-height:1.6;color:rgb(255 255 255/.82);text-wrap:balance}

/* ---------- floating controls + accessibility panel ---------- */
.a11y-btn,.to-top{position:fixed;z-index:90;display:grid;place-items:center;border-radius:50%;box-shadow:0 10px 26px -8px rgb(7 16 48/.55);transition:transform var(--dur-s) var(--ease),opacity var(--dur-s)}
.a11y-btn{inset-inline-end:max(14px,env(safe-area-inset-right));inset-block-end:max(14px,env(safe-area-inset-bottom));width:50px;height:50px;background:linear-gradient(145deg,#2467ec,#173fa8);color:#fff;border:2px solid #fff}
.a11y-btn .ico{width:28px;height:28px}
.a11y-btn:hover{transform:scale(1.07)}
.a11y-btn.is-typing{opacity:0;pointer-events:none;transform:scale(.8)}
@media (max-width:959px){
  /* while the contact form is on screen the button folds into a slim edge tab that sits in the page gutter, clear of every field */
  .a11y-btn.is-tucked{inset-inline-end:0;width:30px;height:50px;border:0;border-start-start-radius:14px;border-end-start-radius:14px;border-start-end-radius:0;border-end-end-radius:0;box-shadow:0 6px 18px -6px rgb(7 16 48/.5)}
  .a11y-btn.is-tucked .ico{width:20px;height:20px}
  .to-top.is-tucked{visibility:hidden}
}
.to-top{inset-inline-end:max(17px,env(safe-area-inset-right));inset-block-end:calc(max(14px,env(safe-area-inset-bottom)) + 62px);width:44px;height:44px;background:var(--surface);color:var(--text);border:1.5px solid var(--line-strong)}
.to-top:hover{transform:translateY(-2px)}
@media (max-width:719px){.to-top{display:none}}
.a11y-panel{position:fixed;z-index:95;inset-inline-end:max(14px,env(safe-area-inset-right));inset-block-end:calc(max(14px,env(safe-area-inset-bottom)) + 62px);
  width:min(380px,100vw - 28px);max-height:calc(100svh - var(--header-h) - 96px);display:flex;flex-direction:column;background:var(--surface);color:var(--text);border:1px solid var(--line-strong);border-radius:var(--r-3);box-shadow:0 30px 70px -20px rgb(0 0 0/.55);overflow:hidden}
.a11y-panel[hidden]{display:none}
.a11y-panel__head{display:flex;align-items:center;justify-content:space-between;padding:var(--s-3) var(--s-3) var(--s-3) var(--s-3);padding-inline:var(--s-4) var(--s-3);background:linear-gradient(120deg,var(--navy-800),var(--blue-700));color:#fff}
.a11y-panel__head h2{font-size:var(--fs-1);font-weight:800}
.a11y-panel__head .icon-btn{color:#fff;border-color:rgb(255 255 255/.5);width:44px;height:44px}
.a11y-panel__body{display:grid;gap:var(--s-4);padding:var(--s-4);overflow-y:auto;overscroll-behavior:contain}
.a11y-group{margin:0;padding:0;border:0;display:grid;gap:var(--s-2)}
.a11y-group legend{padding:0;font-weight:800;margin-block-end:var(--s-2)}
.a11y-note{font-size:.9rem;color:var(--text-2)}
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:var(--s-2)}
.seg__btn,.tgl{display:flex;align-items:center;justify-content:center;gap:.45em;min-height:48px;padding:.4rem .6rem;border:1.5px solid var(--line-strong);border-radius:var(--r-2);background:var(--surface-2);font-weight:700;font-size:.95rem;line-height:1.2;text-align:center;transition:background var(--dur-s),border-color var(--dur-s)}
.seg__btn:hover,.tgl:hover{border-color:var(--blue-600)}
.seg__btn[aria-pressed="true"],.tgl[aria-pressed="true"]{background:linear-gradient(135deg,var(--btn-from),var(--btn-to));border-color:transparent;color:#fff}
.a11y-toggles{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-2)}
.tgl{flex-direction:column;gap:.3rem;padding:.7rem .4rem;min-height:84px}
.a11y-reset{width:100%}
@media (max-width:420px){.seg__btn{font-size:.88rem;padding-inline:.3rem}.seg__btn .ico{display:none}}

/* ---------- reveal + icon drawing ---------- */
.js .reveal{opacity:0;transform:translateY(20px);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
.js .reveal.is-in{opacity:1;transform:none}
.js .svc .draw{stroke-dasharray:1;stroke-dashoffset:1}
.js .svc.is-in .draw{animation:draw 1.5s var(--ease) forwards}
.js .svc.is-in .draw:nth-child(2){animation-delay:.15s}.js .svc.is-in .draw:nth-child(3){animation-delay:.3s}.js .svc.is-in .draw:nth-child(4){animation-delay:.45s}
.js .svc.is-in .glow{animation:draw 1.5s .3s var(--ease) forwards,pulse 3.4s 2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.45}}

/* ---------- accessibility modes ---------- */
.a11y-links a:not(.btn):not(.nav__link):not(.p-card):not(.brand):not(.skip-link):not(.nav__contact){text-decoration:underline!important;text-decoration-thickness:2px;outline:2px solid color-mix(in srgb,var(--link) 55%,transparent);outline-offset:2px;background:color-mix(in srgb,var(--link) 14%,transparent)}
.a11y-links .nav__link,.a11y-links .btn,.a11y-links .nav__contact{outline:2px dashed var(--link);outline-offset:2px}
.a11y-spacing body{line-height:2.05;letter-spacing:.015em}
.a11y-spacing p,.a11y-spacing li{line-height:2.05}
.a11y-readable{--font:Arial,"Segoe UI",Tahoma,sans-serif}
.a11y-readable body{letter-spacing:.03em;word-spacing:.14em;font-weight:500}
.a11y-readable .hero h1,.a11y-readable h2,.a11y-readable h3{letter-spacing:.01em}
.a11y-focus :focus-visible{outline:5px solid #ffbf00;outline-offset:4px;box-shadow:0 0 0 9px #000;border-radius:6px}
.a11y-motion *,.a11y-motion *::before,.a11y-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.a11y-motion .reveal{opacity:1;transform:none}
.a11y-motion .svc .draw,.a11y-motion .hero__wave-line{stroke-dashoffset:0}
.a11y-motion .hero__video{display:none}

:root.a11y-contrast{--bg:#000;--bg-soft:#000;--bg-tint:#000;--surface:#000;--surface-2:#111;--head:#fff;--text:#fff;--text-2:#fff;--line:#fff;--line-strong:#fff;--link:#ffe35c;--accent:#ffe35c;
  --btn-from:#ffe35c;--btn-to:#ffe35c;--btn-text:#000;--btn-shadow:none;--plate:#fff;--plate-hi:#fff;--ok:#7dffb8;--ok-bg:#000;--err:#ff9d96;--err-bg:#000;--focus:#ffbf00;--shadow-c:0 0 0;--grid-op:0;--deco-op:0;--flow-op:0;--hdr-line:#000;--hdr-hover:#00308f;--icon:#ffe35c;--dot:#ffe35c}
.a11y-contrast .site-header{border-block-end:3px solid #000}
.a11y-contrast .nav__link--cta{background:#000;color:#fff;box-shadow:none;border:2px solid #000}
.a11y-contrast .h1-line--accent{background:none;-webkit-text-fill-color:currentColor;color:#ffe35c}
.a11y-contrast .count{background:#000;border-color:#fff;box-shadow:none}
.a11y-contrast .count__ico{background:#000;color:#ffe35c;border-color:#fff}
.a11y-contrast .about__ico,.a11y-contrast .svc__iconwrap{background:#000;color:#ffe35c}
.a11y-contrast .svc__icon,.a11y-contrast .fact .ico{color:#ffe35c}
.a11y-contrast .svc__icon .glow{stroke:#fff}
.a11y-contrast .contact__info,.a11y-contrast .site-footer{background:#000;border:2px solid #fff}
.a11y-contrast .info__ico{background:#000;color:#ffe35c;border-color:#fff}
.a11y-contrast .info__item h3,.a11y-contrast .info__link--map,.a11y-contrast .footer__contact .ico{color:#ffe35c}
.a11y-contrast .info__link{color:#ffe35c}
.a11y-contrast .chip.is-active,.a11y-contrast .seg__btn[aria-pressed="true"],.a11y-contrast .tgl[aria-pressed="true"]{color:#000;background:#ffe35c}
.a11y-contrast .chip.is-active .chip__n{background:#000;color:#fff}
.a11y-contrast .a11y-panel__head{background:#000;border-bottom:2px solid #fff}
.a11y-contrast .a11y-btn{background:#ffe35c;color:#000;border-color:#000}
.a11y-contrast .hero__scrim{background:rgb(0 0 0/.72)}
.a11y-contrast .contact__info::before,.a11y-contrast .site-footer::before,.a11y-contrast .site-footer::after{display:none}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .js .reveal{opacity:1;transform:none}
  .js .svc .draw,.hero__wave-line{stroke-dashoffset:0!important}
  .hero__video{display:none}
}
@media (prefers-contrast:more){:root:not(.a11y-contrast){--line:var(--line-strong);--text-2:var(--text)}}
@media (forced-colors:active){.h1-line--accent{background:none;color:CanvasText;-webkit-text-fill-color:currentColor}.nav__link--cta{border:2px solid ButtonText}}
@media print{.site-header,.a11y-btn,.a11y-panel,.to-top,.hero__video,.viewer,.deco{display:none!important}.hero{min-height:0;color:#000;background:#fff}}