/* r2 Console -- shualadom.com in Metrics chrome. The rail padding, rule, tab, toggle and red-rule numbers are lifted from
   Metrics (app/_shared/rf-viewer.css .vmast/.vmbr/.vmastrule, app/styles/shared.css .tab/.theme-toggle);
   _tools/build.py re-reads those sources and fails the build if a copied number is gone. */
@font-face{font-family:"Assistant";font-style:normal;font-weight:200 800;font-display:swap;src:url(/assets/assistant-hebrew.f9805e7a.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:"Assistant";font-style:normal;font-weight:200 800;font-display:swap;src:url(/assets/assistant-latin.26b77cc3.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{--bg:#1f1f1d;--panel:#242422;--card:#2a2a28;--card2:#323230;--line:#4a4a48;--ink:#e8e8e2;--dim:#aaa;
  --rule:rgba(232,232,226,.32);--red:#b62628;--red-ink:#ff5b5d;--scrim:rgba(31,31,29,.72);--glow:0 0 12px rgba(182,38,40,.35);
  --gx:max(16px,env(safe-area-inset-left,0px),env(safe-area-inset-right,0px));--w:min(1200px,100% - 2 * var(--gx));
  --st:env(safe-area-inset-top,0px);--sb:env(safe-area-inset-bottom,0px);--lk:96px;--tw:.24;
  --f:"Assistant",-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans Hebrew",sans-serif;
  --mono:ui-monospace,"SF Mono",Consolas,monospace;color-scheme:dark}
[data-theme="light"]{--bg:#f5f5f5;--panel:#ffffff;--card:#f5f5f5;--card2:#f0f0f0;--line:rgba(0,0,0,.18);--ink:#1a1a1a;--dim:#666;
  --rule:rgba(26,26,26,.32);--red-ink:var(--red);color-scheme:light}

*,*::before,*::after{box-sizing:border-box;border-radius:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:transparent;background:var(--bg)}
body{margin:0;font:400 17px/1.7 var(--f);color:var(--ink);background:var(--bg);overflow-wrap:anywhere;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body.lock{position:fixed;left:0;right:0;overflow:hidden}
img{display:block;max-width:100%;height:auto;border:0}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,ul,figure,blockquote{margin:0}
ul{padding:0;list-style:none}
button,input{font:inherit;color:inherit;margin:0}
button{background:none;border:0;padding:0;cursor:pointer;touch-action:manipulation}
input{appearance:none;-webkit-appearance:none;font-size:16px}
input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;display:none}
svg{width:1em;height:1em;fill:currentColor;flex:none}
[hidden]{display:none!important}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.skip{position:absolute;top:-80px;inset-inline-start:var(--gx);z-index:200;display:flex;align-items:center;min-height:48px;padding:0 16px;background:var(--red);color:#fff;font-weight:800}
.skip:focus{top:calc(8px + var(--st))}
:focus{outline:none}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
main{display:block;padding-bottom:64px}
p+p{margin-top:16px}

/* one box for every square control: 48 both ways, 2px line border */
.burger,.s-tog,.tog,.mnav-x,.sov-x,.td-x,.car-arr,.soc a{display:flex;align-items:center;justify-content:center;width:48px;height:48px;flex:none;border:2px solid var(--line);color:var(--ink);background:transparent}
.burger svg,.s-tog svg,.mnav-x svg,.sov-x svg,.td-x svg,.car-arr svg,.soc svg,.srch button svg,.sov-f button svg,.lb button svg{width:20px;height:20px}
.tog svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:square;stroke-linejoin:miter}
.t-moon,[data-theme="light"] .t-sun{display:none}
[data-theme="light"] .t-moon{display:block}
.lg-l,[data-theme="light"] .lg-d{display:none}
[data-theme="light"] .lg-l{display:block}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 28px;background:var(--red);color:#fff;font:800 16px/1.2 var(--f);letter-spacing:.5px;text-align:center;border:0}

/* ── header: Metrics' rail (.vmast) between a search box and the door/toggle pair ────────────────── */
.hdr{background:var(--panel);padding-top:var(--st)}
.hdr-in{width:var(--w);margin-inline:auto;display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:"s r e";align-items:center;column-gap:16px}
.srch{grid-area:s;justify-self:start;display:grid;grid-template-columns:216px 48px;height:48px}
.srch input,.sov-f input{height:48px;min-width:0;padding:0 14px;background:var(--card);border:1px solid var(--line);color:var(--ink);font:500 16px/1 var(--f)}
.srch input{border-inline-end:0}
.srch input::placeholder,.sov-f input::placeholder{color:var(--dim);opacity:1}
.srch button,.sov-f button{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--red);color:#fff}
.hdr-e{grid-area:e;justify-self:end;display:flex;align-items:center;gap:8px}
.hdr-cta{width:208px;padding:0 16px}
.burger,.s-tog{display:none}

/* the lockup, his pick (r2-brand 03): the full Metrics logo | a rule | the Hebrew name on one line, all three on the
   logo's centre line. One variable sizes it: --lk, the logo's height. The name's letters are centred, not its line box:
   Assistant 800's letter body sits .07em below the box centre (r2-brand/_tools/measure_type.py). */
.ralm{grid-area:r;display:flex;align-items:center;padding:15px 0}
.lk{height:var(--lk);width:auto;max-width:none}
.tw-t{display:flex;align-items:center;height:calc(var(--lk) * .254);margin-inline-start:calc(var(--lk) / 8);padding-inline-start:calc(var(--lk) / 8);
  border-inline-start:1px solid var(--rule);font:800 calc(var(--lk) * var(--tw))/1 var(--f);white-space:nowrap;color:var(--ink)}
.tw-t>span{position:relative;top:-.07em}
.ralrule{height:4px;background:var(--red)}

.tabs{padding:1px 16px 16px}
.tabs-l{display:flex;justify-content:center;gap:8px}
.tab{display:flex;align-items:center;justify-content:center;width:160px;min-height:48px;padding:8px 16px;background:var(--card);border:1px solid var(--line);color:var(--dim);font:800 15px/1.2 var(--f);letter-spacing:1px;text-align:center;transition:background .12s,color .12s,border-color .12s,box-shadow .12s}
.tab[aria-current="page"]{background:var(--red);border-color:var(--red);color:#fff;box-shadow:var(--glow)}

/* ── phone/tablet menu sheet and search panel ─────────────────────────────────────────────────── */
.mnav{position:fixed;inset:0;z-index:50;display:none;background:var(--bg);overflow:auto;overscroll-behavior:contain}
.mnav.on{display:block}
.mnav-hd{display:grid;grid-template-columns:48px minmax(0,1fr) 48px;align-items:center;column-gap:8px;padding:var(--st) var(--gx) 0;background:var(--panel)}
.mnav-hd .ralm{grid-area:auto;justify-self:center}
.mnav nav{padding:24px var(--gx) calc(24px + var(--sb))}
.mnav-l{display:flex;flex-direction:column;align-items:center;gap:8px}
.mnav-l li{width:min(100%,320px)}
.mnav-l .tab{width:100%}
.mnav-l li:last-child .tab:not([aria-current]){border-color:var(--red);color:var(--ink)}

.sov{--hr:calc(var(--lk) + 30px + var(--st));position:fixed;inset:0;z-index:60;display:none;padding:calc((var(--lk) - 18px) / 2 + var(--st)) var(--gx) 0;
  background:linear-gradient(to bottom,var(--panel) var(--hr),var(--red) var(--hr),var(--red) calc(var(--hr) + 4px),var(--scrim) calc(var(--hr) + 4px))}
.sov.on{display:grid;grid-template-columns:minmax(0,1fr) 48px;align-content:start;column-gap:8px}
.sov-f{display:grid;grid-template-columns:48px minmax(0,1fr);height:48px}
.sov-f button{order:-1}
.sov-f input{border-inline-start:0}

/* ── heroes and the title plate ───────────────────────────────────────────────────────────────── */
.hero{position:relative}
.hero-pic{height:clamp(200px,32vw,460px);height:clamp(200px,max(min(32vw,460px),30vw),70svh);background:var(--card2);overflow:hidden}
.hero-bg{width:100%;height:100%;object-fit:cover}
.hero--contact .hero-bg{object-position:50% 30%}
.hero--arts .hero-bg{object-position:50% 45%}
.hero--gal .hero-bg{object-position:50% 38%}
.hero--home .hero-pic{position:relative;height:min(60vw,calc(100svh - 300px));min-height:220px}
.hero--home .hero-bg{object-position:36% 62%}
/* a section's words stand in the foot of its photo as the home poster's name stands in the collage: the letters, their red
   glow and mist, the shadow pool and the rise are the home's own rules, re-selected out of hero.css where the marker
   stands (build.py BLEND). Below it, only the fit to a strip: the photo's foot dissolves into the page on the home's
   curve, scaled to the strip, and the words climb one line into it. */
.hero{--bx:max(var(--gx),3vw);--ink1:#fbfdff;--ink2:#aab6c3;--wrap:rgba(214,228,242,.42);--cast:rgba(4,7,11,.78);--pool:rgba(8,11,16,.74);--haze:rgba(200,214,228,.30)}
[data-theme="light"] .hero{--ink1:#56616d;--ink2:#222a33;--wrap:rgba(255,255,255,.75);--cast:rgba(34,42,52,.26);--pool:rgba(238,242,246,.74);--haze:rgba(250,252,253,.62)}
.hero-cap::before{content:"";position:absolute;inset:-70% 0 0;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse 72% 88% at 50% 100%,var(--pool) 50%,color-mix(in srgb,var(--pool) 55%,transparent) 76%,transparent)}
.hero-t{position:relative;z-index:0;font:800 var(--fs)/1.05 var(--f);margin:0}
.hero-l{display:block;color:var(--ink2);
  background:url(/media/bn-grain-f85a84.webp) 0 0/160px 160px,linear-gradient(to bottom,var(--ink1) 22%,var(--ink2) 86%);
  background-blend-mode:overlay,normal;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 0 1px var(--wrap)) drop-shadow(0 .04em .04em var(--cast)) drop-shadow(0 .12em .22em var(--cast))}
.hero-t::before,.hero-t::after{content:"";position:absolute;pointer-events:none}
.hero-t::before{z-index:-1;left:-8%;right:-8%;bottom:-.26em;height:.32em;
  background:radial-gradient(farthest-side,var(--red) 18%,color-mix(in srgb,var(--red) 80%,transparent) 34%,color-mix(in srgb,var(--red) 50%,transparent) 52%,
    color-mix(in srgb,var(--red) 22%,transparent) 70%,color-mix(in srgb,var(--red) 6%,transparent) 86%,transparent)}
.hero-t::after{z-index:1;left:-6%;right:-6%;bottom:-.04em;height:.36em;background:radial-gradient(farthest-side at 50% 100%,var(--haze),transparent)}
[data-theme="light"] .hero .hero-tag{color:var(--ink1)}
@keyframes bn-in{from{opacity:0;transform:translateY(14px)}}
.hero-cap>*,.hero>.hero-tag{animation:bn-in .9s cubic-bezier(.2,.7,.2,1) both}
.hero>.hero-tag{animation-delay:.1s}
.hero{--fs:clamp(32px,5vw,60px);overflow:hidden}
.hero-pic{position:relative}
.hero-pic::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,var(--bg) 4%,color-mix(in srgb,var(--bg) 94%,transparent) 22%,color-mix(in srgb,var(--bg) 60%,transparent) 36%,transparent 60%)}
.hero-cap{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;width:fit-content;max-width:100%;margin:calc(-1 * var(--fs)) auto 0;padding:0 var(--gx) calc(.5 * var(--fs));text-align:center}
/* the home's caption is the width of the screen, a section's is the width of its words: the pool is held to the words and
   thins out at its sides and its last 40px, and no layer reaches the screen's edge, so the page beside the title stays the page */
.hero-cap::before{left:-25%;right:-25%;
  -webkit-mask-image:linear-gradient(to top,transparent 4px,#000 44px),linear-gradient(to right,transparent,#000 20% 80%,transparent);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(to top,transparent 4px,#000 44px),linear-gradient(to right,transparent,#000 20% 80%,transparent);mask-composite:intersect}
.hero-cap::before,.hero-t::before,.hero-t::after{max-width:calc(100vw - 2 * var(--gx));margin-inline:auto}
.hero-l{text-wrap:balance}
.hero-tag{display:block;margin-top:14px;font:600 clamp(18px,1.5vw,21px)/1.5 var(--f);color:var(--dim)}
.ab-lead{width:min(44em,100% - 2 * var(--gx));margin-inline:auto;text-align:center;text-wrap:balance}

/* ── sections ─────────────────────────────────────────────────────────────────────────────────── */
.sec{padding-top:64px}
.sec>*{width:var(--w);margin-inline:auto}
.panel{background:var(--panel);border:1px solid var(--line);padding:40px}
.ttl{font:800 30px/1.25 var(--f);text-align:center;margin-bottom:32px}
.ttl::after,.ab-h::after,.tc-name::after,.td-name::after,.ct-h::after{content:"";display:block;width:48px;height:4px;background:var(--red);margin:14px auto 0}
.panel .ttl,.ab-h,.tc-name,.ct-h{text-align:start}
.panel .ttl::after,.ab-h::after,.tc-name::after,.ct-h::after{margin-inline:0}
.panel .ttl{margin-bottom:24px}
.ab-h,.ct-h{font:800 26px/1.3 var(--f);margin-bottom:24px}
.ts-sub,.tc-sub,.td-sub{color:var(--dim);font-weight:700}
.more{text-align:center;margin-top:32px}

/* home: about */
.h-about-row{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch}
.h-about-img{position:relative;min-height:360px;background:var(--card2);overflow:hidden}
.h-about-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 20%}
.h-about-txt .btn{align-self:start;margin-top:24px}
.h-about-txt{display:flex;flex-direction:column;justify-content:center}

/* carousels */
.car{position:relative}
.car-vp{overflow:hidden;touch-action:pan-y}
.car-track{display:flex;gap:16px;will-change:transform}
.car-track>*{flex:0 0 100%;min-width:0}
.car-bar{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:24px}
/* the dots never wrap: they shrink, so a long carousel stays one row (r3's, lifted) */
.car-dots{display:flex;align-items:center;justify-content:center;min-width:0}
.car-dots>*{display:flex;align-items:center;justify-content:center;height:48px;min-width:0}
.car-dots>button{width:48px;flex:0 1 48px}
.car-dots>span{width:20px;flex:0 1 20px}
.car-dots>*::before{content:"";display:block;flex:none;width:12px;height:12px;border:1px solid var(--line)}
.car-dots>[aria-current="true"]::before{background:var(--red);border-color:var(--red)}

/* home: the athletes, one r3 card per slide */
.tcar{max-width:1000px}
.ts{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:clamp(20px,3vw,40px);align-items:center;padding:clamp(20px,3vw,40px);background:var(--panel);border:1px solid var(--line);border-top:4px solid var(--red)}
.ts-txt{display:flex;flex-direction:column;gap:14px;min-width:0}
.ts-txt p+p{margin-top:0}
.ts-name{font:800 clamp(24px,2.4vw,30px)/1.2 var(--f)}
.ts-txt .ts-sub{font-size:18px}
.ts-all{align-self:start;margin-top:8px}
.ts-img{min-width:0;background:var(--card2)}
.ts-img img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%}
.ts-img [data-only="m"],.ts-more{display:none}
.btn-2{background:transparent;color:var(--ink);border:2px solid var(--line)}

.gcar .car-track>*{flex-basis:calc((100% - 16px) / 2)}
.gs img{width:100%;aspect-ratio:3/2;object-fit:cover;background:var(--card2)}

/* home: articles grid */
.agrid{display:grid;grid-template-columns:1fr 2fr 1fr;grid-template-rows:240px 240px;grid-template-areas:"a m b" "c m d";gap:16px}
.at--m{grid-area:m}.at--a{grid-area:a}.at--b{grid-area:b}.at--c{grid-area:c}.at--d{grid-area:d}
.at{display:flex;flex-direction:column;min-width:0}
.at a{position:relative;flex:1;display:flex;flex-direction:column;justify-content:flex-end;padding-top:44px;overflow:hidden;background:var(--card2);color:#fff}
.at img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.at-cat{position:absolute;top:12px;inset-inline-start:12px;z-index:1;padding:6px 10px;background:var(--red);color:#fff;font:800 13px/1.1 var(--f)}
.at-b{position:relative;display:block;padding:40px 16px 16px;background:linear-gradient(to bottom,rgba(31,31,29,0),rgba(31,31,29,.85) 45%);color:#fff}
.at-t{font:800 18px/1.3 var(--f);text-wrap:balance}
/* lit (hover/focus): the title turns brand red, and the scrim under it closes up so the red reads over any photo */
.at-b{--lit:linear-gradient(to bottom,rgba(31,31,29,0),rgba(31,31,29,.94) 40px)}
.at a:focus-visible .at-b{background:var(--lit)}
.at a:focus-visible .at-t{color:#ff5b5d}
.at--m .at-t{font-size:26px}
.at-m{display:block;margin-top:6px;font-size:14px;color:#e8e8e2}

/* two-up rows: about, contact */
.ab+.ab{padding-top:48px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch}
.row-txt{display:flex;flex-direction:column;justify-content:center}
.row-img{display:flex;align-items:center;justify-content:center;padding:12px;background:var(--card2);border:1px solid var(--line);overflow:hidden}
.row-img img{width:auto;max-height:min(720px,80svh)}
.row--flip .row-txt{order:2}

/* testimonies: cards with an excerpt; the full testimony opens in its dialog */
.tgrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:24px}
.tc{position:relative;grid-column:span 2;grid-row:span 5;display:grid;grid-template-rows:subgrid;row-gap:12px;min-width:0;padding-bottom:24px;background:var(--panel);border:1px solid var(--line);border-bottom:3px solid var(--red)}
.tc>:not(.tc-img){margin-inline:24px}
.tc-img{grid-row:1;margin-bottom:8px;background:var(--card2)}
.tc-img img{width:100%;aspect-ratio:1;object-fit:cover;object-position:50% 25%}
.tc-name{grid-row:2;font:800 22px/1.3 var(--f)}
.tc-name::after{margin-top:10px}
.tc-sub{grid-row:3}
.tc-x{grid-row:4;margin:0}
.tc-more{grid-row:5;align-self:end}
.tc-more::after{content:"";position:absolute;inset:0}
.td{width:min(760px,100% - 2 * var(--gx));max-width:none;max-height:calc(100% - 32px - var(--st) - var(--sb));margin:auto;padding:0;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-top:4px solid var(--red);overflow:hidden}
.td[open]{display:flex;flex-direction:column}
.td::backdrop{background:rgba(31,31,29,.86)}
.td-hd{flex:none;display:grid;grid-template-columns:48px minmax(0,1fr) 48px;align-items:center;column-gap:8px;padding:16px;border-bottom:1px solid var(--line)}
.td-t{grid-column:2;text-align:center}
.td-name{font:800 26px/1.3 var(--f)}
.td-name::after{margin-top:10px}
.td-sub{margin-top:10px}
.td-x{grid-column:3}
.td-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:24px 32px 32px;line-height:1.75}

/* articles */
.arts-q{text-align:center;font-weight:700;margin-bottom:24px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.card{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);min-width:0}
.card-img{display:block;background:var(--card2)}
.card-img img{width:100%;aspect-ratio:3/2;object-fit:cover}
.card-b{flex:1;display:flex;flex-direction:column;gap:10px;padding:20px 24px 24px}
.card-t{font:800 21px/1.3 var(--f);text-wrap:balance}
.card-t a{display:flex;align-items:center;min-height:48px}
.card-t a:focus-visible{color:var(--red-ink)}
.card-m{font-size:14px;color:var(--dim)}
.card-m+.card-x{margin-top:0}
.card-x{font-size:17px}
.card-more{align-self:start;margin-top:auto;display:flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border:2px solid var(--line);font-weight:800}

/* gallery */
.gal-grid{columns:3;column-gap:8px}
.gi{position:relative;display:block;margin-bottom:8px;break-inside:avoid;overflow:hidden;background:var(--card2)}
.gi img{width:100%}
.gi::after{content:"";position:absolute;inset:0;background-color:rgba(31,31,29,0);transition:background-color .4s}
.gal-grid.js-m{position:relative;columns:auto}
.gal-grid.js-m .gi{position:absolute;margin:0}
.gal-grid.js-m .gi img{height:100%;object-fit:cover}
.gal-grid.ready .gi img{transition:opacity .6s}
.gi.wait img{opacity:0}
.lb{--bg:#1f1f1d;--panel:#242422;--line:#4a4a48;--ink:#e8e8e2;--dim:#aaa;position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:rgba(31,31,29,.97);color:var(--ink);touch-action:none;opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s .3s}
.lb.on{opacity:1;visibility:visible;transition:opacity .3s,visibility 0s}
.lb img{max-width:calc(100% - 144px);max-height:calc(100svh - 144px);width:auto;height:auto;user-select:none;-webkit-user-drag:none}
.lb button{position:absolute;display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--panel);border:2px solid var(--line);color:var(--ink)}
.lb-x{top:calc(16px + var(--st));inset-inline-end:var(--gx)}
.lb-p,.lb-n{top:50%;margin-top:-24px}
.lb-p{inset-inline-start:var(--gx)}
.lb-n{inset-inline-end:var(--gx)}
.lb-c{position:absolute;bottom:calc(16px + var(--sb));left:0;right:0;pointer-events:none;display:flex;align-items:center;justify-content:center;height:48px;font:700 15px/1 var(--mono);color:var(--dim);direction:ltr}

/* contact */
.ct-txt{align-items:center;text-align:center}
.ct-txt .ct-h{text-align:center}
.ct-txt .ct-h::after{margin-inline:auto}
.ct-h2{margin-top:40px}
.ct-mail a{display:inline-flex;align-items:center;gap:12px;min-height:48px;font-size:20px;font-weight:700}
.ct-mail svg{width:20px;height:20px}
.soc{--tgf:var(--panel);display:flex;justify-content:center;gap:8px}

/* article */
.ar-hero{height:420px;display:flex;justify-content:center;background:var(--panel);border-bottom:1px solid var(--line)}
.ar-bg{height:100%;width:auto;max-width:100%;object-fit:contain}
.ar-card{width:min(800px,100% - 2 * var(--gx));margin:40px auto 0}
.ar-cat,.ar-info,.ar-h{text-align:center}
.ar-cat a{display:inline-flex;align-items:center;min-height:48px;padding:0 20px;background:var(--red);color:#fff;font-weight:800}
.ar-info{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 24px;margin-top:16px;color:var(--dim);font-size:15px}
.ar-info li{display:flex;align-items:center;gap:8px}
.ar-info svg{width:16px;height:16px}
.ar-h{font:800 36px/1.25 var(--f);margin:16px 0 40px}
.ar-body{font-size:18px;line-height:1.8}
.ar-body p+p{margin-top:18px}
.ar-body>*+*{margin-top:18px}
.ar-body .red{border-inline-start:4px solid var(--red);padding-inline-start:16px;font-weight:700}
.ar-body .sp{display:none}
.ph{font:800 26px/1.3 var(--f)}
.ar-body>.ph{margin-top:48px}
.pf{text-align:center}
.pf img{width:min(100%,500px);max-height:min(80svh,720px);object-fit:contain;margin-inline:auto}
.pf figcaption{margin-top:10px;font-size:17px;color:var(--dim)}
.pbox{padding:24px;padding-inline-end:28px;background:var(--panel);border-inline-start:4px solid var(--red)}
.pbox>*+*{margin-top:16px}
.pbox-h{font:800 20px/1.35 var(--f)}
.pq{padding:24px;text-align:center;background:var(--panel);border-bottom:3px solid var(--red);font-size:20px;font-weight:700}
.ar-body ul{list-style:square;padding-inline:24px}
.ar-body ul+ul{margin-top:6px}
.ar-body li::marker{color:var(--red)}

/* footer, his pick (mockups/footer 02 מסילה): the header's grid at the page's foot. Three destinations either side of
   the logo in cells of one width; under the site's 1px line, the mission, the contact squares and the copyright on the
   same axis; the dedication alone as the page's last line. */
.ftr{background:var(--panel);border-top:4px solid var(--red)}
.ftr-in{width:var(--w);margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr) min-content minmax(0,1fr);
  grid-template-areas:"ns m ne" "l l l" "t k c";align-items:center;column-gap:32px;padding-top:16px}
.ftr-in::before{content:"";grid-area:l;height:1px;margin-top:16px;background:var(--line)}
.f-mark{grid-area:m;justify-self:center;display:flex;justify-content:center;min-width:48px}
.f-mark .lk{height:64px}
/* three cells of 152px, each with its rule on the logo's side (459 = 3 x 153) */
.f-nav{display:flex;align-items:center;width:min(459px,100%)}
.f-nav li{flex:1 1 0;display:flex;align-items:center}
.f-nav--s li::after,.f-nav--e li::before{content:"";flex:none;width:1px;height:16px;background:var(--rule)}
.f-nav--s{grid-area:ns;justify-self:end}
.f-nav--e{grid-area:ne;justify-self:start}
.f-nav a{flex:1 1 0;display:flex;align-items:center;justify-content:center;min-height:48px;font:800 15px/1.2 var(--f);letter-spacing:1px;color:var(--dim);text-align:center}
.f-nav a:focus-visible{color:var(--red-ink)}
.f-tag,.f-copy{font:400 14px/1.45 var(--f);color:var(--dim)}
.f-tag{grid-area:t;justify-self:end}
.f-soc{grid-area:k;margin-block:12px}
.f-copy{grid-area:c;justify-self:start}
.f-ded{display:flex;align-items:center;justify-content:center;gap:16px;padding:2px var(--gx) calc(18px + var(--sb));font:600 15px/1.5 var(--f);color:var(--ink);text-align:center}
.f-ded::before,.f-ded::after{content:"";flex:none;width:40px;height:1px;background:var(--red)}

@media (hover:hover){
  .btn:hover{box-shadow:var(--glow)}
  .btn-2:hover{box-shadow:none;border-color:var(--red)}
  .tab:hover{color:var(--ink);border-color:var(--dim)}
  .tab[aria-current="page"]:hover{color:#fff;border-color:var(--red)}
  .burger:hover,.s-tog:hover,.tog:hover,.mnav-x:hover,.sov-x:hover,.td-x:hover,.car-arr:hover,.soc a:hover,.card-more:hover,.lb button:hover{border-color:var(--red)}
  .srch button:hover,.sov-f button:hover{box-shadow:var(--glow)}
  .at a:hover img{transform:scale(1.05)}
  .at a:hover .at-b{background:var(--lit)}
  .at a:hover .at-t{color:#ff5b5d}
  .gi:hover::after{background-color:rgba(31,31,29,.3)}
  .card-t a:hover{color:var(--red-ink)}
  .tc:hover .tc-more{border-color:var(--red)}
  .f-nav a:hover{color:var(--red-ink)}
}

@media (max-width:1024px){
  .hdr-in{grid-template-columns:48px minmax(0,1fr) 48px;grid-template-areas:"b r t";column-gap:8px}
  .srch,.hdr-e,.tabs{display:none}
  .burger{display:flex;grid-area:b}
  .s-tog{display:flex;grid-area:t}
  .hdr .ralm{justify-self:center}
  /* the footer's phone form (02 · A) switches with the header's burger: the burger carries the nav; no mission, no
     contact squares. The copyright's two halves take the nav's cells either side of the logo, behind the rail's own
     16px rules, each hugging its rule */
  .f-nav,.f-tag,.f-soc,.f-cd{display:none}
  .ftr-in{grid-template-columns:minmax(0,1fr) auto auto auto minmax(0,1fr);grid-template-areas:"c1 r1 m r2 c2";column-gap:12px;padding-bottom:12px}
  .ftr-in::before,.ftr-in::after{content:"";display:block;width:1px;height:16px;margin:0;background:var(--rule)}
  .ftr-in::before{grid-area:r1}
  .ftr-in::after{grid-area:r2}
  .f-mark .lk{height:56px}
  .f-copy{display:contents;font-size:13px}
  .f-c1,.f-c2{text-wrap:balance}
  .f-c1{grid-area:c1;justify-self:end;text-align:end}
  .f-c2{grid-area:c2;justify-self:start;text-align:start}
  .f-ded{gap:12px;font-size:14px}
  .f-ded::before,.f-ded::after{width:24px}
}
@media (max-width:991px){
  .agrid{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-template-areas:"m m" "a b" "c d"}
  .at a{min-height:220px}
  .at--m a{min-height:320px}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gal-grid{columns:2}
  .tgrid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .tc:last-child:nth-child(odd){grid-column:2/span 2}
}
@media (max-width:767px){
  /* the phone lockup fills the header's middle column (48 + 8 each side) and stops at 64; 3.52 = logo .948 + gaps 2/8 + name --tw x 9.642 */
  :root{--lk:clamp(48px,(100vw - 2 * var(--gx) - 121px) / 3.52,64px)}
  main{padding-bottom:40px}
  .sec{padding-top:40px}
  .panel{padding:24px 20px}
  .ab-lead{font-size:17px}
  .ttl{font-size:26px;margin-bottom:24px}
  .ab-h,.ct-h{font-size:22px}
  .ab+.ab{padding-top:32px}
  .row,.h-about-row{grid-template-columns:minmax(0,1fr)}
  .row--flip .row-txt{order:0}
  .h-about-img{min-height:0;aspect-ratio:1;width:100%}
  .h-about-txt{align-items:center;text-align:center}
  .h-about-txt .ttl{text-align:center}
  .h-about-txt .ttl::after{margin-inline:auto}
  .h-about-txt .btn{align-self:center}
  .row-img img{max-height:min(560px,70svh)}
  .ts{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
  .ts-txt{display:contents}
  .ts-txt>:not(.ts-name){display:none}
  .ts-img{width:100%;max-width:300px}
  .ts-img [data-only="d"]{display:none}
  .ts-img [data-only="m"]{display:block}
  .ts-more{display:inline-flex}
  .gcar .car-track>*{flex-basis:100%}
  .lb img{max-width:calc(100% - 2 * var(--gx));max-height:calc(100svh - 176px)}
  .lb-p,.lb-n{top:auto;bottom:calc(16px + var(--sb));margin-top:0}
  .ar-hero{height:240px}
  .ar-card{margin-top:28px}
  .ar-h{font-size:26px;margin-bottom:28px}
  .pq{font-size:18px}
  .td-name{font-size:22px}
  .td-body{padding:20px}
}
@media (max-width:575px){
  .agrid{grid-template-columns:minmax(0,1fr);grid-template-areas:"m" "a" "b" "c" "d"}
  .at--m a{min-height:260px}
  .cards{grid-template-columns:minmax(0,1fr)}
  .tgrid{grid-template-columns:minmax(0,1fr)}
  .tc,.tc:last-child:nth-child(odd){grid-column:auto}
  .tc-img img{aspect-ratio:4/3}
}
/* a phone on its side: the phone card's name, photo and button, laid out as the desktop card, one screen tall */
@media (max-height:500px) and (min-aspect-ratio:1001/1000){
  .ts{display:grid;grid-template-columns:auto auto;grid-template-rows:1fr 1fr;justify-content:center;gap:16px 48px;text-align:center}
  .ts-txt{display:flex;grid-area:1/1;align-self:end}
  .ts-txt>:not(.ts-name){display:none}
  .ts-more{display:inline-flex;grid-area:2/1;align-self:start;justify-self:center}
  .ts-img{grid-area:1/2/3/3;width:auto;max-width:none}
  .ts-img img{width:auto;max-width:none;height:60svh}
  .ts-img [data-only="d"]{display:none}
  .ts-img [data-only="m"]{display:block}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}

/* site additions: the classes import_wp.py emits for the 21 post bodies, which the r2 mockup (coaches only) never carried */
.c-red{color:var(--red-ink)}
.c-blue{font-weight:700}
.center{text-align:center}
.note{padding:24px;padding-inline-end:28px;background:var(--panel);border-inline-start:4px solid var(--red)}
.note>*+*{margin-top:12px}
.pbox-name,.pbox-title,.note-title{font:800 20px/1.35 var(--f)}
.ar-body ol{list-style:decimal;padding-inline:max(24px,1.4em) 24px}
.ar-body hr{border:0;border-top:1px solid var(--rule)}
.ar-body video{display:block;width:min(100%,500px);max-height:min(80svh,720px);margin-inline:auto;background:var(--panel)}
.pbox .pf img{width:min(100%,300px)}