:root { --navy:#0a1f3d; --navy-2:#102b51; --ink:#152033; --muted:#637187; --ivory:#f7f4ee; --paper:#fffdf9; --line:#dbe1e9; --red:#d7514b; --blue:#3972be; --gold:#dfaf65; --max:1180px; --shadow:0 18px 45px rgba(8,31,61,.11); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang TC","Noto Sans TC",Arial,sans-serif; line-height:1.7; }
body.dialog-open { overflow:hidden; }
a { color:inherit; text-decoration-thickness:1px; text-underline-offset:3px; }
img { max-width:100%; height:auto; }
button,input,textarea { font:inherit; }
button { cursor:pointer; }
:focus-visible { outline:3px solid #e6b057; outline-offset:3px; }
.skip-link { position:absolute; z-index:50; left:16px; top:-100px; padding:10px 14px; background:#fff; color:var(--navy); border-radius:0 0 8px 8px; }.skip-link:focus { top:0; }
.container { width:min(var(--max),calc(100% - 48px)); margin-inline:auto; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(255,253,249,.94); border-bottom:1px solid rgba(10,31,61,.08); backdrop-filter:blur(14px); }
.header-inner { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:24px; }.brand { display:flex; align-items:center; gap:12px; text-decoration:none; font-weight:750; color:var(--navy); line-height:1.25; font-size:.84rem; }.brand img { width:42px; height:42px; }.brand small { display:block; color:var(--muted); font-size:.65rem; font-weight:600; letter-spacing:.03em; }
.site-nav { display:flex; align-items:center; gap:26px; font-size:.9rem; }.site-nav a { text-decoration:none; font-weight:650; }.site-nav a:hover,.site-nav a[aria-current="page"] { color:var(--red); }.menu-toggle { display:none; border:0; background:transparent; font-size:1.2rem; padding:8px; }
.language-switch { display:inline-flex; align-items:center; gap:7px; padding-left:18px; border-left:1px solid var(--line); color:var(--muted); font-size:.78rem; white-space:nowrap; }.language-switch a { color:var(--muted); }.language-switch a:hover,.language-switch strong { color:var(--red); }.language-switch strong { font-weight:800; }
.hero { position:relative; isolation:isolate; overflow:hidden; background:var(--navy); color:#fff; min-height:648px; display:grid; align-items:center; }.hero::before { content:""; position:absolute; inset:0; z-index:-3; background:radial-gradient(circle at 18% 26%,rgba(57,114,190,.56),transparent 29%),linear-gradient(135deg,#081a33 0%,#0b2c54 62%,#0d2342 100%); }.hero::after { content:""; position:absolute; z-index:-2; width:600px; height:600px; right:-160px; bottom:-270px; border:1px solid rgba(255,255,255,.24); border-radius:50%; box-shadow:0 0 0 55px rgba(255,255,255,.025),0 0 0 115px rgba(255,255,255,.018); }
.hero-grid { display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:50px; padding:96px 0 70px; }.hero-brand { width:82px; height:82px; padding:9px; border-radius:18px; background:#fff; box-shadow:0 14px 32px rgba(0,0,0,.18); }.eyebrow { display:flex; align-items:center; gap:10px; margin:20px 0 12px; color:#c8d8ed; font-size:.8rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }.eyebrow::before { content:""; width:28px; height:1px; background:var(--gold); }.hero h1 { max-width:740px; margin:0; font-size:clamp(2.15rem,4.5vw,4.8rem); letter-spacing:-.055em; line-height:1.14; }.english-name { margin:22px 0 0; max-width:620px; font-size:clamp(1rem,1.6vw,1.26rem); line-height:1.45; color:#dbe8f5; letter-spacing:.01em; }.tagline { margin:34px 0 32px; max-width:540px; font-size:1.26rem; line-height:1.7; font-weight:650; }.tagline small { display:block; margin-top:3px; color:#9fb9d7; font-size:.82rem; letter-spacing:.08em; }.button-row { display:flex; flex-wrap:wrap; gap:12px; }.button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; border:1px solid transparent; padding:10px 18px; border-radius:999px; background:var(--red); color:#fff; text-decoration:none; font-weight:750; transition:transform .2s ease,background .2s ease; }.button:hover { background:#bc3e3d; transform:translateY(-2px); }.button.secondary { background:transparent; border-color:rgba(255,255,255,.55); }.button.secondary:hover { background:rgba(255,255,255,.1); }
.exchange-visual { position:relative; min-height:405px; }.network { position:absolute; inset:0; border:1px solid rgba(255,255,255,.18); border-radius:36px; background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.02)); overflow:hidden; }.network::before { content:""; position:absolute; inset:16% 13%; background:repeating-linear-gradient(90deg,transparent 0 34px,rgba(255,255,255,.12) 35px 36px),repeating-linear-gradient(0deg,transparent 0 34px,rgba(255,255,255,.08) 35px 36px); transform:perspective(520px) rotateX(55deg); transform-origin:center bottom; opacity:.65; }.network::after { content:""; position:absolute; width:330px; height:330px; left:50%; top:52%; transform:translate(-50%,-50%); border-radius:50%; border:1px solid rgba(223,175,101,.8); box-shadow:0 0 0 48px rgba(223,175,101,.06),0 0 80px rgba(223,175,101,.32); }.orb { position:absolute; z-index:1; display:grid; place-items:center; width:100px; height:100px; border-radius:50%; color:white; font-weight:800; letter-spacing:.06em; background:rgba(7,24,47,.87); border:1px solid rgba(255,255,255,.65); box-shadow:0 14px 35px rgba(0,0,0,.2); }.orb::after { content:""; position:absolute; inset:-11px; border:1px solid currentColor; border-radius:inherit; opacity:.45; }.orb.tw { left:13%; top:19%; color:#d7514b; }.orb.il { right:13%; bottom:19%; color:#8cbbff; }.orb.core { width:126px; height:126px; top:50%; left:50%; transform:translate(-50%,-50%); color:var(--gold); font-size:.77rem; text-align:center; line-height:1.35; }.line { position:absolute; z-index:0; height:1px; background:linear-gradient(90deg,transparent,#dfaf65,transparent); width:43%; transform-origin:left center; left:23%; top:38%; transform:rotate(21deg); }.line.two { top:62%; transform:rotate(-21deg); }
.section { padding:104px 0; }.section.tint { background:var(--ivory); }.section-head { display:grid; grid-template-columns:1fr minmax(220px,400px); align-items:end; gap:30px; margin-bottom:44px; }.kicker { margin:0 0 8px; color:var(--red); font-size:.76rem; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }.section h2 { margin:0; color:var(--navy); font-size:clamp(2rem,3.5vw,3.55rem); letter-spacing:-.045em; line-height:1.2; }.section-intro { margin:0; color:var(--muted); }
.activity-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }.activity-card { min-height:315px; display:flex; flex-direction:column; padding:31px; border:1px solid var(--line); border-radius:22px; background:#fff; box-shadow:0 8px 24px rgba(12,31,58,.04); }.activity-card.feature { color:#fff; border-color:transparent; background:linear-gradient(135deg,#16375d,#0a1f3d); }.card-meta { display:flex; justify-content:space-between; gap:16px; font-size:.78rem; font-weight:750; letter-spacing:.1em; text-transform:uppercase; color:var(--red); }.feature .card-meta { color:#f2ca8f; }.activity-card h3 { margin:35px 0 13px; font-size:1.55rem; line-height:1.36; }.activity-card p { margin:0; color:var(--muted); }.feature p { color:#d7e3ef; }.activity-detail { margin-top:auto !important; padding-top:24px; font-size:.9rem; font-weight:750; }.activity-detail a { color:var(--red); text-underline-offset:4px; }.feature .activity-detail a { color:#f2ca8f; }
.people-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }.person-card { position:relative; overflow:hidden; padding:24px 20px 22px; min-height:403px; border:1px solid var(--line); border-radius:20px; background:#fff; }.person-portrait { position:relative; display:grid; place-items:center; width:172px; height:172px; margin:0 auto 28px; }.person-portrait::before { content:""; position:absolute; z-index:0; width:164px; height:148px; border-radius:54% 46% 57% 43% / 44% 55% 45% 56%; background:#e8edf4; transform-origin:center; animation:portraitBubbleSpin 18s linear infinite; will-change:transform; }.person-card:nth-child(2) .person-portrait::before { background:#f7e5d8; animation-duration:22s; animation-direction:reverse; }.person-card:nth-child(3) .person-portrait::before { background:#e8effa; animation-duration:25s; }.person-card:nth-child(4) .person-portrait::before { background:#f4e5e3; animation-duration:20s; animation-direction:reverse; }.person-portrait img { position:relative; z-index:1; width:153px; height:153px; object-fit:cover; border-radius:50%; }.person-role { margin:0; color:var(--red); font-size:.78rem; font-weight:800; }.person-card h3 { margin:7px 0 3px; color:var(--navy); font-size:1.25rem; line-height:1.35; }.person-position { margin:0; color:var(--muted); font-size:.84rem; line-height:1.5; }.person-bio { margin:15px 0 0; font-size:.86rem; line-height:1.75; }
@keyframes portraitBubbleSpin { from { transform:rotate(-15deg); } to { transform:rotate(345deg); } }
.cooperate { position:relative; overflow:hidden; color:#fff; background:var(--navy); }.cooperate::after { content:""; position:absolute; width:450px; height:450px; right:-120px; top:-200px; border:1px solid rgba(255,255,255,.15); border-radius:50%; box-shadow:0 0 0 60px rgba(255,255,255,.025),0 0 0 120px rgba(255,255,255,.018); }.cooperate .section-head h2 { color:#fff; }.cooperate .section-intro { color:#c6d5e5; }.cooperate-inner { position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:end; }.topic-list { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }.topic { padding:17px; border:1px solid rgba(255,255,255,.25); border-radius:12px; color:#e9f0f7; font-weight:700; }.topic span { display:block; color:#e4b776; font-size:.72rem; letter-spacing:.12em; }.cooperate .button { margin-top:25px; }
.cooperate .section-head { grid-template-columns:max-content minmax(0,1fr); }.cooperate .section-head h2 { white-space:nowrap; }
.page-hero { position:relative; overflow:hidden; padding:100px 0 82px; background:#f5eee2 url("../images/israel-hero-landmarks.png") center 48% / cover no-repeat; }.page-hero::before { content:""; position:absolute; z-index:0; inset:0; background:linear-gradient(90deg,rgba(255,253,250,.97) 0%,rgba(245,238,226,.92) 42%,rgba(234,240,248,.72) 68%,rgba(255,253,250,.22) 100%); }.page-hero .container { position:relative; z-index:1; }.page-hero .eyebrow { margin:0 0 14px; color:var(--red); }.page-hero .eyebrow::before { background:var(--red); }.page-hero h1 { max-width:820px; margin:0; color:var(--navy); font-size:clamp(2.5rem,5.4vw,5rem); letter-spacing:-.06em; line-height:1.05; }.page-hero p { max-width:630px; margin:22px 0 0; color:var(--muted); font-size:1.08rem; }
.content-grid { display:grid; grid-template-columns:260px 1fr; gap:70px; }.side-note { position:sticky; top:112px; align-self:start; padding:20px; border-left:2px solid var(--red); color:var(--muted); font-size:.9rem; }.prose > * + * { margin-top:28px; }.prose h2 { color:var(--navy); font-size:2rem; letter-spacing:-.03em; line-height:1.25; }.prose p { color:#425168; }.mission-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin:32px 0; }.mission { padding:21px; border-radius:14px; background:var(--ivory); border:1px solid #ece5d9; }.mission strong { display:block; margin-bottom:6px; color:var(--red); font-size:.78rem; letter-spacing:.12em; }.mission p { margin:0; }
.org-chart { display:grid; justify-items:center; gap:0; padding:22px 0; }.org-node { width:min(100%,490px); padding:18px 22px; text-align:center; border:1px solid var(--line); border-radius:12px; background:#fff; box-shadow:0 5px 16px rgba(12,31,58,.04); font-weight:750; color:var(--navy); }.org-node small { display:block; margin-top:3px; color:var(--muted); font-weight:550; }.org-line { width:1px; height:34px; background:#aab6c6; }.org-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; width:100%; }.org-row .org-node { width:100%; }.known-leaders { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-top:38px; }.leader { padding:18px; background:var(--ivory); border-radius:12px; }.leader b { color:var(--navy); }.pending { margin-top:28px; padding:18px 20px; border-left:3px solid var(--gold); background:#fffbf3; color:#69583c; }
.contact-layout { display:grid; grid-template-columns:.82fr 1.18fr; gap:50px; align-items:start; }.contact-details { padding:30px; background:var(--navy); color:#fff; border-radius:20px; }.contact-details h2 { color:#fff; font-size:1.55rem; }.contact-details dl { margin:25px 0 0; }.contact-details dt { margin-top:19px; color:#a8c0dc; font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; }.contact-details dd { margin:3px 0 0; }.pending-text { color:#a8c0dc; font-size:.92rem; }.form-shell { padding:34px; border:1px solid var(--line); border-radius:20px; background:#fff; }.form-shell h2 { margin-top:0; color:var(--navy); }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.field { display:grid; gap:7px; }.field.full { grid-column:1/-1; }.field label { font-size:.88rem; font-weight:700; }.field input,.field textarea { width:100%; padding:11px 12px; color:var(--ink); border:1px solid #b9c5d4; border-radius:8px; background:#fff; }.field textarea { min-height:125px; resize:vertical; }.form-status { min-height:1.6em; margin:15px 0 0; color:var(--muted); font-size:.86rem; }.form-status:not(:empty) { padding:9px 11px; background:var(--ivory); border-radius:7px; }.form-note { margin:14px 0 0; color:var(--muted); font-size:.78rem; }.form-frame { display:none; }.form-shell .button { margin-top:16px; }.button:disabled { cursor:not-allowed; background:#9da8b6; transform:none; }
.hp-field { position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; }
.sharebar { display:flex; flex-wrap:wrap; gap:9px; align-items:center; }.sharebar span { font-size:.78rem; font-weight:800; color:var(--muted); letter-spacing:.1em; }.sharebar a,.sharebar button { display:inline-flex; align-items:center; min-height:34px; padding:5px 11px; border:1px solid var(--line); border-radius:999px; background:transparent; color:var(--navy); text-decoration:none; font-size:.75rem; font-weight:750; }.sharebar a:hover,.sharebar button:hover { border-color:var(--blue); color:var(--blue); }
.site-footer { padding:44px 0; background:#071a32; color:#d4deeb; }.footer-inner { display:grid; grid-template-columns:1fr auto; gap:30px; align-items:end; }.footer-brand { display:flex; gap:13px; align-items:center; }.footer-brand img { width:44px; height:44px; padding:5px; border-radius:10px; background:#fff; }.footer-brand strong { display:block; color:#fff; font-size:.94rem; }.footer-brand small { display:block; color:#aebed1; }.footer-meta { margin:18px 0 0; color:#aebed1; font-size:.8rem; }.footer-links { display:flex; gap:17px; font-size:.83rem; }.footer-links a { color:#d4deeb; }.footer-share { margin-top:17px; }.footer-share span,.footer-share a,.footer-share button { color:#d4deeb; border-color:rgba(212,222,235,.35); }
.dialog { position:fixed; z-index:100; inset:0; display:grid; place-items:center; padding:20px; background:rgba(3,13,28,.7); }.dialog[hidden] { display:none; }.dialog-panel { position:relative; width:min(620px,100%); max-height:calc(100vh - 40px); overflow:auto; padding:32px; border-radius:20px; background:#fff; box-shadow:var(--shadow); }.dialog-close { position:absolute; top:12px; right:12px; width:38px; height:38px; border:0; border-radius:50%; background:var(--ivory); color:var(--navy); font-size:1.3rem; }.dialog-panel h2 { margin:0 38px 8px 0; color:var(--navy); }.dialog-panel > p { margin:0 0 22px; color:var(--muted); }
@media (max-width:850px) { .site-nav { gap:16px; }.hero-grid,.cooperate-inner,.contact-layout { grid-template-columns:1fr; }.exchange-visual { max-width:570px; width:100%; margin:0 auto; }.hero { min-height:auto; }.people-grid { grid-template-columns:repeat(2,1fr); }.content-grid { grid-template-columns:1fr; gap:22px; }.side-note { position:static; }.org-row { grid-template-columns:1fr; width:min(100%,490px); }.org-row .org-line-mobile { display:block; }.footer-inner { grid-template-columns:1fr; }.section-head,.cooperate .section-head { grid-template-columns:1fr; } }
@media (min-width:681px) and (max-width:1020px) { html[lang="en"] .menu-toggle { display:block; } html[lang="en"] .site-nav { position:absolute; left:0; right:0; top:100%; display:none; flex-direction:column; align-items:stretch; gap:0; padding:9px 24px 18px; background:var(--paper); border-bottom:1px solid var(--line); box-shadow:0 16px 25px rgba(9,30,57,.08); } html[lang="en"] .site-nav.is-open { display:flex; } html[lang="en"] .site-nav > a { padding:9px 4px; } html[lang="en"] .language-switch { margin-top:7px; padding:11px 4px 2px; border-top:1px solid var(--line); border-left:0; } }
@media (max-width:680px) { .container { width:min(100% - 32px,var(--max)); }.header-inner { min-height:67px; }.brand { font-size:.73rem; }.brand img { width:38px; height:38px; }.menu-toggle { display:block; }.site-nav { position:absolute; left:0; right:0; top:100%; display:none; flex-direction:column; align-items:stretch; gap:0; padding:9px 16px 16px; background:var(--paper); border-bottom:1px solid var(--line); box-shadow:0 16px 25px rgba(9,30,57,.08); }.site-nav.is-open { display:flex; }.site-nav a { padding:10px 4px; }.language-switch { margin-top:7px; padding:11px 4px 2px; border-top:1px solid var(--line); border-left:0; }.language-switch a { padding:0; }.hero-grid { gap:28px; padding:62px 0 45px; }.hero-brand { width:67px; height:67px; border-radius:14px; }.hero h1 { font-size:clamp(2.3rem,12vw,3.4rem); }.english-name { font-size:.92rem; }.tagline { margin:25px 0; font-size:1.08rem; }.exchange-visual { min-height:330px; }.orb { width:80px; height:80px; font-size:.78rem; }.orb.core { width:104px; height:104px; font-size:.65rem; }.section { padding:68px 0; }.section h2 { font-size:2.25rem; }.activity-grid,.people-grid,.mission-grid,.topic-list,.known-leaders,.form-grid { grid-template-columns:1fr; }.activity-card { min-height:280px; padding:25px; }.person-card { min-height:auto; }.cooperate-inner { gap:31px; }.page-hero { padding:66px 0 56px; background-position:68% center; }.page-hero::before { background:linear-gradient(90deg,rgba(255,253,250,.96),rgba(245,238,226,.84)); }.page-hero h1 { font-size:3rem; }.form-shell,.contact-details,.dialog-panel { padding:24px 19px; }.footer-links { flex-wrap:wrap; }.dialog { padding:12px; }.dialog-panel { max-height:calc(100vh - 24px); } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; } }