/* ============================================================
   ONDAS FRAMEWORK — public site
   Built on the ONDAS Inc design system v3 (same fonts, radii,
   shadows, buttons, cards), with teal as the lead colour and
   the ten-stage wave as the Framework's own signature.
   ============================================================ */


:root{
  --bg:         #F7F5EF;
  --bg-soft:    #EAE7DC;
  --ink:        #15160F;
  --ink-soft:   #5B5D57;
  --ink-faint:  #9A9C93;
  --line:       rgba(21,22,15,.10);
  --line-strong:rgba(21,22,15,.20);

  --teal:       #1FA79B;
  --teal-deep:  #137A71;
  --teal-dark:  #0B4F49;
  --teal-pale:  #E3F6F4;
  --teal-light: #7FD4C9;
  --sun:        #FFD700;

  --white:      #FFFFFF;
  --radius-sm:  10px;
  --radius:     20px;
  --radius-lg:  28px;
  --radius-pill:999px;
  --maxw:       1240px;
  --shadow:     0 1px 2px rgba(21,22,15,.04), 0 20px 40px -20px rgba(21,22,15,.16);
  --shadow-sm:  0 1px 2px rgba(21,22,15,.05), 0 8px 20px -10px rgba(21,22,15,.14);
  --head-h:     92px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--head-h) + 16px); }
body{ margin:0; background:var(--bg); color:var(--ink); font:400 16px/1.65 'Inter',sans-serif; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
h1,h2,h3,h4{ font-family:'Sora',sans-serif; color:var(--ink); line-height:1.12; letter-spacing:-.015em; font-weight:700; margin:0; text-wrap:balance; }
p{ margin:0 0 1em; }
a{ color:var(--teal-deep); }
img{ max-width:100%; display:block; }
:focus-visible{ outline:2px solid var(--teal); outline-offset:3px; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 2.4rem; }
@media (max-width:600px){ .wrap{ padding:0 1.3rem; } }
.prose{ max-width:68ch; }
.prose p{ color:var(--ink-soft); }
.skip{ position:absolute; top:0; inset-inline-start:0; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip:focus{ width:auto; height:auto; clip:auto; top:12px; inset-inline-start:12px; background:#fff; padding:8px 12px; z-index:300; }
.hl{ color:var(--teal); }
@media (prefers-reduced-motion: reduce){ *{ animation-duration:.001ms !important; transition-duration:.001ms !important; } }

/* ---------- announcement ---------- */
.announce{ background:var(--teal-dark); color:#fff; font-size:.86rem; }
.announce .wrap{ display:flex; gap:.8rem; align-items:center; justify-content:center; padding-block:.55rem; flex-wrap:wrap; text-align:center; }
.announce i{ width:7px; height:7px; border-radius:50%; background:var(--sun); flex:none; }
.announce a{ color:var(--sun); font-weight:600; }
@media (max-width:600px){ .announce i{ display:none; } .announce .wrap{ gap:.3rem .6rem; font-size:.8rem; } }

/* ---------- header (same as ONDAS Inc) ---------- */
.site-head{ position:sticky; top:0; z-index:200; background:rgba(255,255,255,.88); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.site-head .wrap{ height:var(--head-h); display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.brand{ display:flex; align-items:center; text-decoration:none; flex-shrink:0; }
.brand-logo{ height:52px; width:auto; }
.nav{ display:flex; align-items:center; gap:1.9rem; }
.nav a{ text-decoration:none; font-size:.9rem; font-weight:600; color:var(--ink-soft); transition:color .2s; white-space:nowrap; }
.nav a:hover, .nav a[aria-current="page"]{ color:var(--teal); }
.nav .nav-app{ background:var(--ink); color:#fff; padding:.7rem 1.3rem; border-radius:var(--radius-pill); font-family:'Sora',sans-serif; font-size:.82rem; }
.nav .nav-app:hover{ background:var(--teal); color:#fff; }
.menu-btn{ display:none; background:none; border:0; font:600 .95rem 'Sora',sans-serif; color:var(--ink); cursor:pointer; padding:.5rem 0; }
@media (max-width:1340px){
  :root{ --head-h:78px; }
  .brand-logo{ height:44px; }
  .menu-btn{ display:block; }
  .nav{ display:none; position:absolute; top:var(--head-h); left:0; right:0; flex-direction:column; align-items:flex-start; gap:1.2rem; background:var(--bg); padding:1.8rem 2.4rem 2.2rem; border-bottom:1px solid var(--line); box-shadow:var(--shadow); }
  .nav.open{ display:flex; }
  .nav a{ font-size:1.15rem; }
  .nav .nav-app{ font-size:.95rem; margin-top:.4rem; }
}

/* ---------- buttons ---------- */
.btn{ display:inline-flex; align-items:center; gap:.55rem; font-family:'Sora',sans-serif; font-weight:600; font-size:.92rem; padding:.95rem 1.7rem; border-radius:var(--radius-pill); text-decoration:none; border:1px solid transparent; transition:all .2s ease; white-space:nowrap; cursor:pointer; }
.btn-primary{ background:var(--teal); color:#fff; }
.btn-primary:hover{ background:var(--teal-deep); color:#fff; }
.btn-dark{ background:var(--ink); color:#fff; }
.btn-dark:hover{ background:var(--teal); color:#fff; }
.btn-ghost{ border-color:var(--line-strong); color:var(--ink); background:transparent; }
.btn-ghost:hover{ border-color:var(--ink); background:var(--white); }
.btn-sm{ padding:.7rem 1.3rem; font-size:.82rem; }
.btn svg{ width:14px; height:14px; transition:transform .2s; }
.btn:hover svg{ transform:translate(3px,-3px); }
.link-more{ font-family:'Sora',sans-serif; font-weight:600; font-size:.9rem; text-decoration:none; color:var(--teal-deep); display:inline-flex; gap:.4rem; align-items:center; }
.link-more:hover{ color:var(--ink); }
.link-more svg{ width:14px; height:14px; flex:none; transition:transform .2s; }
.link-more:hover svg{ transform:translate(3px,-3px); }

/* ---------- section scaffolding ---------- */
.section{ padding:6rem 0; }
.section-tight{ padding:4rem 0; }
@media (max-width:700px){ .section{ padding:4.2rem 0; } .section-tight{ padding:3rem 0; } }
.section-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:2rem; margin-bottom:3rem; flex-wrap:wrap; }
.section-head > div{ max-width:640px; }
.eyebrow{ font-family:'Sora',sans-serif; font-size:.78rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--teal); margin-bottom:.8rem; display:block; }
.section-head h2, .section-title{ font-size:clamp(1.8rem,3.4vw,2.6rem); }
.section-head p{ margin:1rem 0 0; color:var(--ink-soft); font-size:1.02rem; max-width:56ch; }
.bg-paper{ background:var(--bg-soft); }
.bg-teal{ background:var(--teal-dark); color:rgba(255,255,255,.75); }
.bg-teal h2{ color:#fff; }
.bg-teal .eyebrow{ color:var(--teal-light); }
.bg-teal .section-head p{ color:rgba(255,255,255,.7); }
.bg-teal .stage-list{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.12); }
.bg-teal .stage{ background:rgba(255,255,255,.04); }
.bg-teal .stage h3{ color:#fff; }
.bg-teal .stage p{ color:rgba(255,255,255,.72); }
.bg-teal .stage-n{ color:var(--teal-light); }
.bg-teal .formula{ background:rgba(127,212,201,.14); color:#fff; }
.bg-soft{ background:var(--bg-soft); }
.bg-mint{ background:var(--teal-pale); }
.bg-ink{ background:var(--ink); color:rgba(255,255,255,.7); }
.bg-ink h2, .bg-ink h3{ color:#fff; }
.bg-ink .section-head p{ color:rgba(255,255,255,.62); }

/* subpage intro (like the channel hero) */
.page-intro{ background:var(--teal-pale); padding:4.5rem 0 4rem; }
.page-intro .crumb{ display:inline-flex; gap:.5rem; text-decoration:none; font-size:.86rem; font-weight:600; color:var(--ink-soft); margin-bottom:1.4rem; }
.page-intro .crumb:hover{ color:var(--ink); }
.page-intro h1{ font-size:clamp(2.3rem,4.6vw,3.4rem); max-width:18ch; }
.page-intro p{ margin:1.2rem 0 0; color:var(--ink-soft); font-size:1.05rem; max-width:56ch; }

/* ---------- home hero ---------- */
.hero{ background:var(--teal-pale); padding:4.5rem 0 3rem; overflow:hidden; }
.hero-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:3rem; align-items:center; }
.eyebrow-pill{ display:inline-flex; align-items:center; gap:.5rem; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-pill); padding:.5rem 1rem; font-size:.8rem; font-weight:600; color:var(--teal-deep); margin-bottom:1.6rem; }
.eyebrow-pill .dot{ width:7px; height:7px; border-radius:50%; background:var(--teal); }
.hero h1{ font-size:clamp(2.6rem,5vw,4.1rem); }
.hero-lede{ margin:1.3rem 0 0; max-width:46ch; color:var(--ink-soft); font-size:1.08rem; }
.hero-actions{ margin-top:2.2rem; display:flex; gap:1rem; flex-wrap:wrap; }
.logo-frame{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow); padding:2.4rem; display:flex; align-items:center; justify-content:center; aspect-ratio:1/1; max-width:440px; width:100%; justify-self:end; }
.logo-frame img{ width:82%; height:auto; }
@media (max-width:860px){ .hero-grid{ grid-template-columns:1fr; } .logo-frame{ display:none; } }

/* ---------- the journey band (Framework signature) ---------- */
.stages-band{ background:var(--teal-dark); color:rgba(255,255,255,.72); padding:5.5rem 0 5rem; position:relative; overflow:hidden; }
.stages-band::before{ content:''; position:absolute; inset:auto -10% -55% auto; width:70vw; height:70vw; border-radius:50%; background:radial-gradient(closest-side, rgba(31,167,155,.35), transparent); pointer-events:none; }
.stages-band .wrap{ position:relative; }
.stages-top{ display:flex; justify-content:space-between; align-items:flex-end; gap:2rem; flex-wrap:wrap; margin-bottom:2.4rem; }
.stages-top .eyebrow{ color:var(--teal-light); }
.stages-top h2{ color:#fff; font-size:clamp(1.8rem,3.4vw,2.6rem); }
.stages-top p{ max-width:44ch; margin:0; }

.j-svg{ width:100%; height:auto; display:block; overflow:visible; }
.j-base{ fill:none; stroke:rgba(127,212,201,.22); stroke-width:3; stroke-linecap:round; }
.j-fill{ fill:none; stroke:var(--teal-light); stroke-width:4; stroke-linecap:round; transition:stroke-dashoffset .7s cubic-bezier(.6,.1,.3,1); }
.j-node{ cursor:pointer; outline:none; }
.j-node .halo{ fill:rgba(127,212,201,0); transition:fill .3s; }
.j-node .dot{ fill:var(--teal-dark); stroke:rgba(127,212,201,.45); stroke-width:2.5; transform-box:fill-box; transform-origin:center; transition:fill .3s, stroke .3s, transform .3s; }
.j-node .n{ font:700 16px 'Sora',sans-serif; fill:rgba(255,255,255,.75); text-anchor:middle; dominant-baseline:central; pointer-events:none; transition:fill .3s; }
.j-node .l{ font:600 14px 'Inter',sans-serif; fill:rgba(255,255,255,.55); text-anchor:middle; pointer-events:none; transition:fill .3s; }
.j-node:hover .dot, .j-node:focus-visible .dot{ stroke:var(--teal-light); }
.j-node:hover .l, .j-node:focus-visible .l{ fill:#fff; }
.j-node.done .dot{ fill:var(--teal-light); stroke:var(--teal-light); }
.j-node.done .n{ fill:var(--teal-dark); }
.j-node.on .halo{ fill:rgba(255,215,0,.16); }
.j-node.on .dot{ fill:var(--sun); stroke:var(--sun); transform:scale(1.2); }
.j-node.on .n{ fill:var(--ink); }
.j-node.on .l{ fill:#fff; font-weight:700; }

.j-picker{ display:none; }
.j-panel{ margin-top:2.2rem; display:grid; grid-template-columns:auto 1fr; gap:2.4rem; align-items:start; border-top:1px solid rgba(255,255,255,.14); padding-top:2.2rem; min-height:220px; }
.j-num{ font:800 clamp(4rem,9vw,7.5rem)/.85 'Sora',sans-serif; letter-spacing:-.05em; color:transparent; -webkit-text-stroke:2px var(--teal-light); min-width:2ch; }
.j-body h3{ color:#fff; font-size:clamp(1.4rem,2.4vw,1.9rem); margin-bottom:.8rem; }
.j-body p{ max-width:78ch; font-size:1rem; color:rgba(255,255,255,.75); margin:0; }
.j-foot{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1.4rem; flex-wrap:wrap; }
.j-keys{ display:flex; flex-wrap:wrap; gap:.45rem; margin-top:1rem; }
.j-keys span{ font:600 .8rem 'Sora',sans-serif; padding:.4rem .8rem; border-radius:999px; background:rgba(127,212,201,.14); color:#fff; }
.j-keys .more{ background:none; border:1px solid rgba(127,212,201,.4); color:var(--teal-light); }
.j-body .formula{ background:rgba(127,212,201,.14); color:#fff; max-width:62ch; }
.j-more{ font:600 .9rem 'Sora',sans-serif; color:var(--teal-light); text-decoration:none; }
.j-more:hover{ color:#fff; }
.j-nav{ display:flex; gap:.5rem; }
.j-nav button{ width:44px; height:44px; border-radius:50%; border:1px solid rgba(255,255,255,.25); background:transparent; color:#fff; font-size:1.3rem; cursor:pointer; transition:all .2s; }
.j-nav button:hover{ background:#fff; color:var(--teal-dark); }

@media (prefers-reduced-motion: no-preference){
  .j-node{ opacity:0; animation:pop .4s ease forwards; animation-delay:calc(.1s + var(--i) * .08s); }
}
@keyframes pop{ to{ opacity:1; } }

@media (max-width:860px){
  .j-svg{ display:none; }
  .j-picker{ display:grid; grid-template-columns:repeat(5,1fr); gap:.6rem; }
  .j-picker button{ aspect-ratio:1; border-radius:50%; border:2px solid rgba(127,212,201,.45); background:transparent; color:#fff; font:700 1rem 'Sora',sans-serif; cursor:pointer; }
  .j-picker button.done{ background:var(--teal-light); border-color:var(--teal-light); color:var(--teal-dark); }
  .j-picker button.on{ background:var(--sun); border-color:var(--sun); color:var(--ink); }
  .j-panel{ grid-template-columns:1fr; gap:.6rem; min-height:0; }
  .j-num{ font-size:4rem; }
}

/* ---------- manifesto quote band ---------- */
.manifesto{ background:var(--ink); padding:5rem 0; text-align:center; }
.manifesto blockquote{ font:600 clamp(1.5rem,3.2vw,2.2rem)/1.35 'Sora',sans-serif; color:#fff; max-width:26ch; margin:0 auto; }
.manifesto blockquote .hl{ color:var(--teal-light); }
.manifesto cite{ display:block; margin-top:1.4rem; font-style:normal; color:rgba(255,255,255,.5); font-size:.88rem; }

/* ---------- photo strips ---------- */
.photo-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.photo-row img{ width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:var(--radius-sm); background:var(--bg-soft); }
@media (max-width:760px){ .photo-row{ grid-template-columns:1fr 1fr; } }

/* ---------- objectives / mission ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; }
@media (max-width:860px){ .split{ grid-template-columns:1fr; gap:2.4rem; } }
.obj-list{ list-style:none; margin:1.6rem 0 0; padding:0; display:flex; flex-direction:column; gap:1rem; }
.obj-list li{ display:flex; gap:.9rem; align-items:flex-start; color:var(--ink-soft); }
.obj-list li::before{ content:''; flex-shrink:0; width:26px; height:26px; border-radius:50%; margin-top:.1rem; background:var(--teal-pale) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%231FA79B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat; }
.mv{ display:flex; flex-direction:column; gap:1.4rem; }
.mv-item{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:1.8rem; box-shadow:var(--shadow-sm); }
.mv-item h3{ font-size:1.05rem; margin-bottom:.6rem; }
.mv-item p{ color:var(--ink-soft); margin:0; }

/* ---------- CTA band ---------- */
.cta-band{ background:var(--teal); border-radius:var(--radius-lg); padding:3.4rem 3rem; display:flex; justify-content:space-between; align-items:center; gap:2rem; flex-wrap:wrap; }
.cta-band h2{ color:#fff; font-size:clamp(1.6rem,3vw,2.2rem); max-width:22ch; }
.cta-band p{ color:rgba(255,255,255,.85); margin:.7rem 0 0; }
.cta-band .btn-dark:hover{ background:#fff; color:var(--ink); }

/* ---------- newsletter ---------- */
.newsletter{ display:grid; grid-template-columns:1fr 1.2fr; gap:3rem; align-items:center; }
.newsletter h2{ font-size:clamp(1.6rem,3vw,2.2rem); }
.newsletter p{ color:rgba(255,255,255,.62); margin:.8rem 0 0; }
.nl-form{ display:grid; grid-template-columns:1fr 1fr; gap:.8rem; }
.nl-form input{ font:400 .95rem 'Inter',sans-serif; padding:.9rem 1.2rem; border-radius:var(--radius-pill); border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.06); color:#fff; width:100%; }
.nl-form input::placeholder{ color:rgba(255,255,255,.45); }
.nl-form input:focus{ outline:none; border-color:var(--teal); }
.nl-form .full{ grid-column:1/-1; }
.nl-form .btn{ justify-content:center; }
.nl-done{ grid-column:1/-1; color:var(--teal-light); font-weight:600; margin:0; }
@media (max-width:860px){ .newsletter{ grid-template-columns:1fr; } }

/* ---------- stages (process style) ---------- */
.stage-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.stage{ background:var(--white); padding:2.2rem 2.2rem; display:grid; grid-template-columns:minmax(200px,.8fr) 2fr; gap:2.4rem; }
.stage-n{ font:700 .8rem 'Sora',sans-serif; color:var(--teal); letter-spacing:.06em; text-transform:uppercase; display:block; margin-bottom:.6rem; }
.stage-n::before{ content:'Stage '; }
.stage h3{ font-size:1.25rem; }
.stage-sub{ display:block; margin-top:.35rem; font-size:1rem; font-weight:500; color:var(--ink-soft); }
.bg-teal .stage-sub, .j-body .stage-sub{ color:var(--teal-light); }
.j-body h3 .stage-sub{ display:inline; font-size:.75em; }
.stage-body p{ color:var(--ink-soft); font-size:.95rem; margin:0 0 .8rem; }
.stage-body p:last-child{ margin-bottom:0; }
.stage-ul{ list-style:none; padding:0; margin:.2rem 0 1rem; display:flex; flex-wrap:wrap; gap:.45rem; }
.stage-ul li{ font-size:.85rem; font-weight:500; padding:.35rem .8rem; border-radius:var(--radius-pill); background:var(--teal-pale); color:var(--teal-dark); }
.formula{ display:block; margin:.4rem 0 1rem; padding:.8rem 1rem; background:var(--teal-pale); border-radius:var(--radius-sm); font:600 .9rem/1.5 'Sora',sans-serif; color:var(--teal-dark); }
@media (max-width:760px){ .stage{ grid-template-columns:1fr; gap:1rem; padding:1.6rem 1.4rem; } }

/* sequences: numbered steps on a connecting line (horizontal; vertical on small screens) */
.flow{ list-style:none; padding:0; margin:1.2rem 0 1.4rem; display:grid; grid-auto-flow:column; grid-auto-columns:1fr; counter-reset:f; --c:var(--teal); --c-soft:var(--teal-pale); --t:var(--ink); }
.flow li{ counter-increment:f; position:relative; padding:2.9rem .4rem 0; text-align:center; font:600 .82rem/1.35 'Sora',sans-serif; color:var(--t); }
.flow li::before{ content:counter(f); position:absolute; top:0; left:50%; transform:translateX(-50%); width:2.1rem; height:2.1rem; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font:700 .8rem 'Sora',sans-serif; background:var(--c-soft); color:var(--c); box-shadow:0 0 0 2px var(--c) inset; z-index:1; }
.flow li:not(:last-child)::after{ content:''; position:absolute; top:1.05rem; inset-inline-start:calc(50% + 1.05rem); width:calc(100% - 2.1rem); height:2px;
  background:linear-gradient(90deg, var(--c), color-mix(in srgb, var(--c) 45%, transparent)); }
[dir="rtl"] .flow li:not(:last-child)::after{ background:linear-gradient(270deg, var(--c), color-mix(in srgb, var(--c) 45%, transparent)); }
.flow li:last-child::before{ background:var(--c); color:#fff; box-shadow:0 0 0 5px color-mix(in srgb, var(--c) 22%, transparent); }
.flow li:last-child{ color:var(--c); }
/* the sequence to avoid */
.flow-wrong{ --c:var(--ink-faint); --c-soft:var(--bg-soft); --t:var(--ink-faint); max-width:320px; }
.flow-wrong li{ text-decoration:line-through; }
.flow-wrong li:not(:last-child)::after, [dir="rtl"] .flow-wrong li:not(:last-child)::after{ background:repeating-linear-gradient(90deg, var(--ink-faint) 0 6px, transparent 6px 11px); }
.flow-wrong li:last-child::before{ content:'✕'; box-shadow:none; background:var(--ink-faint); }
.flow-label{ font-size:.85rem; color:var(--ink-faint); margin:.2rem 0 .3rem !important; }
@media (max-width:640px){
  .flow{ grid-auto-flow:row; grid-auto-columns:auto; gap:.2rem; }
  .flow li{ text-align:start; padding:.45rem 0 .45rem 3rem; min-height:2.6rem; display:flex; align-items:center; }
  [dir="rtl"] .flow li{ padding:.45rem 3rem .45rem 0; }
  .flow li::before{ top:.25rem; left:0; transform:none; }
  [dir="rtl"] .flow li::before{ left:auto; right:0; }
  .flow li:not(:last-child)::after{ top:2.35rem; inset-inline-start:1.05rem; width:2px; height:calc(100% - 2.1rem); background:var(--c); }
}

/* stage reached from the home page link: brief highlight */
.stage.flash{ animation:flash 2.4s ease-out 1; }
@keyframes flash{ 0%,30%{ box-shadow:inset 4px 0 0 var(--sun); background:rgba(255,215,0,.08); } 100%{ box-shadow:inset 4px 0 0 transparent; } }
[dir="rtl"] .stage.flash{ animation-name:flash-rtl; }
@keyframes flash-rtl{ 0%,30%{ box-shadow:inset -4px 0 0 var(--sun); background:rgba(255,215,0,.08); } 100%{ box-shadow:inset -4px 0 0 transparent; } }

/* teal context: stage list sits on dark teal */
.bg-teal .stage-list{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.12); }
.bg-teal .stage{ background:rgba(255,255,255,.04); }
.bg-teal .stage h3{ color:#fff; }
.bg-teal .stage-body p{ color:rgba(255,255,255,.75); }
.bg-teal .stage-n{ color:var(--teal-light); }
.bg-teal .formula{ background:rgba(127,212,201,.14); color:#fff; }
.bg-teal .stage-ul li{ background:rgba(127,212,201,.14); color:#fff; }
.bg-teal .tick-list li{ color:rgba(255,255,255,.8); }
.bg-teal .tick-list li::before{ background-color:rgba(127,212,201,.18); }
.bg-teal .flow{ --c:var(--teal-light); --c-soft:rgba(127,212,201,.12); --t:#fff; }
.bg-teal .flow li:last-child::before{ color:var(--teal-dark); }

/* O N D A S letters */
.letters-band{ background:var(--teal-dark); color:rgba(255,255,255,.75); padding:4.5rem 0; }
.letters-band .eyebrow{ color:var(--teal-light); }
.ondas-letters{ list-style:none; padding:0; margin:1.2rem 0 2rem; display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:rgba(255,255,255,.12); border-radius:var(--radius); overflow:hidden; }
.ondas-letters li{ background:var(--teal-dark); padding:1.6rem 1.2rem; display:flex; flex-direction:column; gap:.4rem; }
.ondas-letters b{ font:800 clamp(3rem,7vw,5.5rem)/1 'Sora',sans-serif; color:transparent; -webkit-text-stroke:2px var(--teal-light); }
.ondas-letters span{ font:600 1.05rem 'Sora',sans-serif; color:#fff; }
.letters-band > .wrap > p{ max-width:70ch; margin:0; font-size:1.02rem; }
@media (max-width:640px){ .ondas-letters{ grid-template-columns:1fr; } .ondas-letters li{ flex-direction:row; align-items:baseline; gap:1rem; padding:1rem 1.2rem; } .ondas-letters b{ font-size:2.6rem; } }
html[lang="ar"] .ondas-letters b{ font-family:'Sora',sans-serif !important; }
[dir="rtl"] .ondas-letters{ direction:ltr; }
[dir="rtl"] .ondas-letters span{ direction:rtl; }

/* lists with ticks */
.tick-list{ list-style:none; padding:0; margin:.4rem 0 1rem; display:grid; gap:.45rem; }
.tick-list li{ display:flex; gap:.6rem; align-items:flex-start; color:var(--ink-soft); font-size:.94rem; }
.tick-list li::before{ content:''; flex:none; width:20px; height:20px; margin-top:.15rem; border-radius:50%; background:var(--teal-pale) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%231FA79B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/11px no-repeat; }
.note{ border-inline-start:3px solid var(--sun); padding:.6rem 1rem; background:#FFF9D9; border-radius:0 var(--radius-sm) var(--radius-sm) 0; color:var(--ink) !important; font-size:.92rem; }
[dir="rtl"] .note{ border-radius:var(--radius-sm) 0 0 var(--radius-sm); }
.lead-out{ max-width:72ch; margin:2rem 0 0; font:600 1.1rem/1.55 'Sora',sans-serif; color:var(--ink); }

/* AI */
.ai-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.6rem; }
.ai-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:2rem; box-shadow:var(--shadow-sm); }
.ai-card h3{ font-size:1.15rem; margin-bottom:1rem; }
.ai-card .tick-list{ grid-template-columns:1fr 1fr; }
.ai-human{ background:var(--ink); border-color:var(--ink); }
.ai-human h3{ color:#fff; }
.ai-human .tick-list li{ color:rgba(255,255,255,.8); }
.ai-human .tick-list li::before{ background-color:rgba(127,212,201,.18); }
@media (max-width:860px){ .ai-grid{ grid-template-columns:1fr; } .ai-card .tick-list{ grid-template-columns:1fr; } }

/* who can use */
.who-grid{ display:grid; grid-template-columns:1fr 1fr; grid-template-areas:"a b" "a c" "d e"; gap:1.6rem; align-items:start; }
.who-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:2rem; box-shadow:var(--shadow-sm); }
.who-card:nth-child(1){ grid-area:a; } .who-card:nth-child(2){ grid-area:b; } .who-card:nth-child(3){ grid-area:c; }
.who-card:nth-child(4){ grid-area:d; } .who-card:nth-child(5){ grid-area:e; }
.who-card h3{ font-size:1.1rem; margin-bottom:.7rem; }
.who-card p{ color:var(--ink-soft); font-size:.94rem; }
.who-card .tick-list{ grid-template-columns:1fr 1fr; }
@media (max-width:860px){ .who-grid{ grid-template-columns:1fr; grid-template-areas:"a" "b" "c" "d" "e"; } .who-card .tick-list{ grid-template-columns:1fr; } }

/* ecosystem */
.eco{ list-style:none; padding:0; margin:0 0 2.4rem; display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; }
.eco li{ white-space:nowrap; font:600 .95rem 'Sora',sans-serif; color:#fff; border:1px solid rgba(127,212,201,.4); padding:.7rem 1.2rem; border-radius:var(--radius-pill); }
.eco li:not(:last-child)::after{ content:'+'; color:var(--teal-light); margin-inline-start:1.2rem; margin-inline-end:-.6rem; font-weight:700; }
.eco-text p{ color:rgba(255,255,255,.72); margin:0; }

/* core purpose questions */
.purpose{ list-style:none; padding:0; margin:0; counter-reset:q; display:flex; flex-direction:column; }
.purpose li{ counter-increment:q; position:relative; padding:.85rem 0 .85rem 3.4rem; font:600 1.02rem/1.45 'Sora',sans-serif; color:var(--ink); }
.purpose li::before{ content:counter(q); position:absolute; inset-inline-start:0; top:.7rem; width:2.2rem; height:2.2rem; border-radius:50%; background:var(--teal-pale); color:var(--teal-deep); font:700 .85rem/2.2rem 'Sora',sans-serif; text-align:center; z-index:1; }
.purpose li:not(:last-child)::after{ content:''; position:absolute; inset-inline-start:1.1rem; top:2.9rem; bottom:-.7rem; width:2px; background:var(--teal-pale); }
.purpose li:last-child::before{ background:var(--teal); color:#fff; }
[dir="rtl"] .purpose li{ padding:.85rem 3.4rem .85rem 0; }

.signature{ margin:2.4rem 0 0; display:flex; flex-direction:column; gap:.2rem; }
.signature b{ font:700 1.1rem 'Sora',sans-serif; }
.signature span{ color:var(--ink-soft); font-size:.94rem; }
.disc-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
.disc{ background:var(--bg-soft); border-radius:var(--radius); padding:2rem; }
.disc h3{ font-size:1.05rem; margin-bottom:.5rem; }
.disc p{ color:var(--ink-soft); font-size:.9rem; margin:0; }
@media (max-width:820px){ .disc-grid{ grid-template-columns:1fr; } }

.theory{ font:600 clamp(1.3rem,2.4vw,1.75rem)/1.4 'Sora',sans-serif; letter-spacing:-.01em; margin:0; color:var(--ink); }
.theory-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow); padding:2.6rem; border-top:4px solid var(--teal); }
.theory-src{ margin:1.2rem 0 0; color:var(--ink-faint); font-size:.88rem; }

/* ---------- classes / workshops ---------- */
.class-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.6rem; align-items:stretch; }
.class-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:2.2rem; display:flex; flex-direction:column; }
.when{ display:inline-flex; align-self:flex-start; align-items:center; gap:.5rem; font-weight:700; font-size:.74rem; letter-spacing:.06em; text-transform:uppercase; padding:.45rem .85rem; border-radius:var(--radius-pill); background:var(--teal-pale); color:var(--teal-deep); margin-bottom:1.1rem; }
.when::before{ content:''; width:7px; height:7px; border-radius:50%; background:currentColor; }
.class-card h3{ font-size:1.5rem; margin-bottom:.8rem; }
.class-card p{ color:var(--ink-soft); font-size:.95rem; }
.facts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius-sm); overflow:hidden; margin:.6rem 0 1.6rem; }
.facts > div{ background:var(--white); padding:1rem 1.1rem; }
.facts dt{ font-size:.78rem; color:var(--ink-soft); }
.facts dd{ margin:.2rem 0 0; font:700 1.25rem 'Sora',sans-serif; color:var(--teal-deep); }
.class-card .foot{ margin-top:auto; display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; }
.class-card .foot small{ color:var(--ink-faint); font-size:.86rem; }
@media (max-width:860px){ .class-grid{ grid-template-columns:1fr; } }

.modules{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; list-style:none; margin:0; padding:0; }
.modules li{ background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.10); border-radius:var(--radius); padding:1.5rem; }
.modules b{ display:block; font:700 .76rem 'Sora',sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--teal-light); margin-bottom:.5rem; }
.modules b::before{ content:'Module '; }
.modules span{ font:600 1rem/1.35 'Sora',sans-serif; color:#fff; }
@media (max-width:860px){ .modules{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .modules{ grid-template-columns:1fr; } }

.timeline{ display:grid; grid-template-columns:130px 1fr; gap:0 2.4rem; }
.tl-group{ display:contents; }
.tl-year{ font:700 1.9rem/1 'Sora',sans-serif; color:var(--teal); padding-top:1.4rem; position:sticky; top:calc(var(--head-h) + 24px); align-self:start; }
.tl-items{ display:flex; flex-direction:column; gap:1rem; padding-bottom:2rem; }
.tl-item{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:1.4rem 1.6rem; box-shadow:var(--shadow-sm); }
.tl-meta{ display:flex; gap:.6rem; flex-wrap:wrap; align-items:center; font-size:.82rem; color:var(--ink-faint); }
.tl-meta span:last-child{ background:var(--teal-pale); color:var(--teal-deep); font-weight:600; padding:.15rem .6rem; border-radius:var(--radius-pill); }
.tl-item h3{ font-size:1.02rem; line-height:1.35; margin:.6rem 0 .35rem; }
.tl-item p{ margin:0; color:var(--ink-soft); font-size:.88rem; }
.tl-links{ display:flex; gap:1rem; margin-top:.7rem; font-size:.86rem; font-weight:600; }
@media (max-width:760px){ .timeline{ grid-template-columns:1fr; } .tl-year{ position:static; padding:1.4rem 0 .8rem; } }

/* ---------- testimonials ---------- */
.quotes{ columns:3 300px; column-gap:1.6rem; }
.quote{ break-inside:avoid; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:1.8rem; margin:0 0 1.6rem; }
.quote p{ margin:0 0 1.2rem; color:var(--ink-soft); font-size:.95rem; }
.quote.big{ background:var(--teal); border-color:var(--teal); }
.quote.big p{ font:600 1.15rem/1.45 'Sora',sans-serif; color:#fff; }
.quote.big footer{ color:rgba(255,255,255,.8); }
.quote footer{ font-size:.84rem; font-weight:600; color:var(--ink); display:flex; align-items:center; gap:.6rem; }
.quote footer::before{ content:''; width:26px; height:26px; border-radius:50%; background:var(--teal-pale) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10h4v7H5v-5c0-3 1-5 4-6M17 10h4v7h-6v-5c0-3 1-5 4-6' fill='%231FA79B'/%3E%3C/svg%3E") center/14px no-repeat; flex:none; }

/* ---------- testimonial submission ---------- */
.share{ display:grid; grid-template-columns:.9fr 1.1fr; gap:3.5rem; align-items:start; }
.share-intro h2{ font-size:clamp(1.7rem,3vw,2.3rem); }
.share-intro p{ margin-top:1rem; color:rgba(255,255,255,.72); max-width:44ch; }
.share-form{ display:grid; grid-template-columns:1fr 1fr; gap:1.1rem 1rem; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius-lg); padding:2rem; }
.share-form .full{ grid-column:1/-1; }
.share-form label{ display:flex; flex-direction:column; gap:.45rem; font-size:.84rem; font-weight:600; color:#fff; position:relative; }
.share-form .opt{ font-weight:400; color:rgba(255,255,255,.5); }
.share-form input, .share-form select, .share-form textarea{ font:400 .95rem 'Inter',sans-serif; color:#fff; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.18); border-radius:var(--radius-sm); padding:.85rem 1rem; width:100%; }
.share-form textarea{ resize:vertical; min-height:140px; line-height:1.55; }
.share-form select option{ color:var(--ink); }
.share-form input::placeholder, .share-form textarea::placeholder{ color:rgba(255,255,255,.4); }
.share-form input:focus, .share-form select:focus, .share-form textarea:focus{ outline:none; border-color:var(--teal-light); }
.share-form .invalid{ border-color:#FF8A7A !important; outline:2px solid rgba(255,138,122,.4); }
.share-form .counter{ align-self:flex-end; font-weight:400; color:rgba(255,255,255,.45); font-size:.78rem; }
.share-form .check{ flex-direction:row; align-items:flex-start; gap:.7rem; font-weight:400; color:rgba(255,255,255,.75); }
.share-form .check input{ width:18px; height:18px; flex:none; margin-top:.15rem; accent-color:var(--teal); }
.share-form .hp{ position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
.share-actions{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.share-err{ color:#FFB3A8; font-size:.88rem; }
.share-done h3{ color:#fff; font-size:1.4rem; margin-bottom:.5rem; }
.share-done p{ color:rgba(255,255,255,.75); margin:0; }
@media (max-width:860px){ .share{ grid-template-columns:1fr; gap:2rem; } .share-form{ grid-template-columns:1fr; padding:1.4rem; } }

/* ---------- publications ---------- */
.pub-controls{ display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; margin-bottom:2rem; }
.tabs{ display:flex; gap:.6rem; flex-wrap:wrap; }
.tabs button{ font:600 .82rem 'Sora',sans-serif; padding:.65rem 1.2rem; border-radius:var(--radius-pill); border:1px solid var(--line-strong); background:var(--white); color:var(--ink-soft); cursor:pointer; transition:all .2s; white-space:nowrap; }
.tabs button:hover{ border-color:var(--teal); color:var(--teal); }
.tabs button[aria-selected="true"]{ background:var(--teal); border-color:var(--teal); color:#fff; }
.tabs sup{ font-size:.7rem; opacity:.7; margin-left:3px; }
.pub-search{ flex:1 1 240px; }
.pub-search input{ width:100%; padding:.8rem 1.2rem; border-radius:var(--radius-pill); border:1px solid var(--line-strong); font:400 .9rem 'Inter',sans-serif; background:var(--white); }
.pub-search input:focus{ outline:none; border-color:var(--teal); }
.pub-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.pub{ background:var(--white); display:grid; grid-template-columns:80px 1fr; gap:1.4rem; padding:1.4rem 1.8rem; }
.pub-year{ font:700 1rem 'Sora',sans-serif; color:var(--teal); }
.pub p{ margin:0; font-size:.94rem; color:var(--ink); max-width:85ch; }
.pub a{ display:inline-block; margin-top:.5rem; font-size:.84rem; font-weight:600; }
.pub.has-thumb{ grid-template-columns:80px 1fr 64px; }
.book-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:2rem 1.6rem; background:none; border:0; border-radius:0; overflow:visible; }
.book{ display:flex; flex-direction:column; gap:1.1rem; }
.book-info h3{ font-size:1.02rem; line-height:1.3; margin:.3rem 0 .5rem; }
.book-info p{ font-size:.82rem; color:var(--ink-soft); margin:0; }
.book-info a{ display:inline-block; margin-top:.6rem; font-size:.84rem; font-weight:600; }

/* covers */
.cover{ aspect-ratio:7/10; border-radius:6px 12px 12px 6px; overflow:hidden; box-shadow:var(--shadow); position:relative; background:var(--bg-soft); transition:transform .3s; }
.book:hover .cover{ transform:translateY(-6px) rotate(-1deg); }
.cover img{ width:100%; height:100%; object-fit:cover; }
.cover::after{ content:''; position:absolute; inset:0 auto 0 0; width:10px; background:linear-gradient(90deg, rgba(0,0,0,.22), rgba(0,0,0,0)); pointer-events:none; }
.cover-gen{ display:flex; flex-direction:column; padding:1.4rem 1.2rem 1.2rem 1.5rem; color:#fff; }
.cover-gen .cv-sub{ font:700 .62rem/1.4 'Sora',sans-serif; letter-spacing:.12em; text-transform:uppercase; opacity:.8; }
.cover-gen .cv-title{ font:700 1.25rem/1.15 'Sora',sans-serif; letter-spacing:-.01em; margin-top:auto; margin-bottom:auto; text-wrap:balance; }
.cover-gen .cv-foot{ font:600 .7rem 'Sora',sans-serif; opacity:.7; border-top:1px solid rgba(255,255,255,.3); padding-top:.6rem; }
.s-urban{ background:linear-gradient(160deg, #137A71, #0B4F49); }
.s-arch{ background:linear-gradient(160deg, #2A2B24, #15160F); }
.s-arch .cv-title{ color:var(--teal-light); }
.s-interior{ background:linear-gradient(160deg, #7FD4C9, #1FA79B); color:var(--ink); }
.s-interior .cv-foot{ border-color:rgba(21,22,15,.25); }
.s-ondas{ background:linear-gradient(160deg, #FFD700, #F2C200); color:var(--ink); }
.s-ondas .cv-foot{ border-color:rgba(21,22,15,.25); }
.s-single{ background:linear-gradient(160deg, #EAE7DC, #D9D4C3); color:var(--ink); }
.s-single .cv-foot{ border-color:rgba(21,22,15,.25); }
.cover.has-img{ background:var(--bg-soft); }
.cover.has-img img{ width:100%; height:100%; object-fit:cover; object-position:center; }
.cover-sm{ width:64px; border-radius:3px 6px 6px 3px; box-shadow:var(--shadow-sm); }
.cover-sm.cover-gen{ padding:.4rem .35rem .4rem .5rem; }
.cover-sm .cv-sub, .cover-sm .cv-foot{ display:none; }
.cover-sm .cv-title{ font-size:.42rem; }
@media (max-width:600px){ .pub.has-thumb{ grid-template-columns:1fr; } .pub.has-thumb .cover-sm{ display:none; } .book-grid{ grid-template-columns:1fr 1fr; gap:1.6rem 1rem; } .cover-gen .cv-title{ font-size:1rem; } }
.pub-empty{ background:var(--white); padding:2rem 1.8rem; color:var(--ink-faint); }
@media (max-width:600px){ .pub{ grid-template-columns:1fr; gap:.3rem; padding:1.2rem 1.3rem; } }

/* ---------- galleries (masonry + lightbox) ---------- */
.masonry{ columns:4 220px; column-gap:1rem; }
.masonry button{ display:block; width:100%; border:0; padding:0; margin:0 0 1rem; background:var(--bg-soft); cursor:zoom-in; break-inside:avoid; border-radius:var(--radius-sm); overflow:hidden; }
.masonry img{ width:100%; transition:transform .3s; }
.masonry button:hover img{ transform:scale(1.04); }
.lightbox{ display:none; position:fixed; inset:0; background:rgba(7,8,5,.92); z-index:2000; align-items:center; justify-content:center; }
.lightbox.open{ display:flex; }
.lightbox img{ max-width:90vw; max-height:82vh; border-radius:8px; }
.lb-btn{ position:fixed; background:rgba(255,255,255,.12); color:#fff; border:none; width:44px; height:44px; border-radius:50%; font-size:1.2rem; cursor:pointer; }
.lb-btn:hover{ background:rgba(255,255,255,.22); }
.lb-close{ top:1.25rem; right:1.25rem; font-size:0; }
.lb-close::before{ content:'✕'; font-size:1rem; }
.lb-prev{ left:1.25rem; top:50%; transform:translateY(-50%); }
.lb-next{ right:1.25rem; top:50%; transform:translateY(-50%); }
.lb-count{ position:fixed; bottom:1.2rem; left:0; right:0; text-align:center; color:rgba(255,255,255,.7); font-size:.85rem; }

/* ---------- team ---------- */
.team{ display:flex; flex-direction:column; gap:1.6rem; }
.member{ display:grid; grid-template-columns:220px 1fr; gap:2.4rem; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:2rem; }
.member img{ width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:var(--radius); background:var(--bg-soft); }
.member h2{ font-size:1.35rem; }
.member .role{ display:inline-block; margin:.6rem 0 1.1rem; font-size:.74rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--teal); }
.member .bio p{ color:var(--ink-soft); font-size:.94rem; max-width:72ch; }
.member .bio.clamp p:nth-child(n+2){ display:none; }
.bio-toggle{ background:none; border:0; padding:0; font:600 .86rem 'Sora',sans-serif; color:var(--teal-deep); cursor:pointer; }
.bio-toggle:hover{ color:var(--ink); }
@media (max-width:760px){ .member{ grid-template-columns:1fr; gap:1.4rem; } .member img{ max-width:200px; } }

/* ---------- contact ---------- */
.contact-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1.6rem; }
.contact-card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:2rem 1.9rem; text-decoration:none; color:var(--ink); display:flex; flex-direction:column; gap:.9rem; transition:transform .25s, box-shadow .25s; }
.contact-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow); color:var(--ink); }
.contact-ic{ width:52px; height:52px; border-radius:14px; background:var(--teal-pale); color:var(--teal); display:flex; align-items:center; justify-content:center; }
.contact-ic svg{ width:24px; height:24px; }
.contact-card span{ font-size:.84rem; color:var(--ink-soft); }
.contact-card b{ font:700 1.15rem/1.3 'Sora',sans-serif; word-break:break-word; }
@media (max-width:860px){ .contact-grid{ grid-template-columns:1fr; } }

/* ---------- footer (same as ONDAS Inc) ---------- */
.site-foot{ background:var(--ink); color:rgba(255,255,255,.65); padding:4.5rem 0 2rem; }
.foot-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:2rem; padding-bottom:3rem; border-bottom:1px solid rgba(255,255,255,.12); }
.foot-logo{ height:48px; width:auto; margin-bottom:1.2rem; }
.foot-note{ font-size:.88rem; max-width:36ch; color:rgba(255,255,255,.5); }
.site-foot h4{ font-size:.82rem; color:#fff; margin-bottom:1.1rem; letter-spacing:0; }
.site-foot ul{ list-style:none; margin:0; padding:0; }
.site-foot li a{ display:block; text-decoration:none; font-size:.88rem; color:rgba(255,255,255,.65); margin-bottom:.7rem; transition:color .2s; }
.site-foot li a:hover{ color:#fff; }
.foot-bottom{ padding-top:1.6rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; font-size:.78rem; color:rgba(255,255,255,.4); }
.foot-bottom a{ color:rgba(255,255,255,.6); text-decoration:none; }
.foot-bottom a:hover{ color:#fff; }
@media (max-width:820px){ .foot-grid{ grid-template-columns:1fr 1fr; } .foot-grid > div:first-child{ grid-column:1/-1; } }
@media (max-width:520px){ .foot-grid{ grid-template-columns:1fr; } }

/* ============================================================
   ARABIC (RTL) — pages in /ar/ use <html lang="ar" dir="rtl">.
   Flex and grid layouts mirror on their own; these rules fix
   typography and the few direction-specific details.
   ============================================================ */
html[lang="ar"] body, html[lang="ar"] body *:not(svg):not(svg *){ font-family:'IBM Plex Sans Arabic','Inter',system-ui,sans-serif !important; letter-spacing:0 !important; }
html[lang="ar"] body{ line-height:1.85; }
html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3, html[lang="ar"] h4{ line-height:1.35; font-weight:700; }
html[lang="ar"] .hero h1{ line-height:1.25; }
html[lang="ar"] .eyebrow, html[lang="ar"] .when, html[lang="ar"] .member .role, html[lang="ar"] .stage-n, html[lang="ar"] .modules b{ text-transform:none; font-size:.9rem; }
html[lang="ar"] .j-node text{ font-family:'IBM Plex Sans Arabic','Inter',sans-serif; }
html[lang="ar"] .stage-n::before{ content:'المرحلة '; }
html[lang="ar"] .modules b::before{ content:'الوحدة '; }
/* mixed Arabic / English content: each paragraph takes the direction of its own text */
[dir="rtl"] .quote p, [dir="rtl"] .pub p, [dir="rtl"] .book-info p, [dir="rtl"] .book-info h3, [dir="rtl"] .member .bio p,
[dir="rtl"] .member h2, [dir="rtl"] .member .role, [dir="rtl"] .tl-item h3, [dir="rtl"] .tl-item p, [dir="rtl"] .class-card p,
[dir="rtl"] .class-card h3, [dir="rtl"] .class-card .foot small, [dir="rtl"] .when, [dir="rtl"] .facts dt, [dir="rtl"] .mv-item p, [dir="rtl"] .obj-list li, [dir="rtl"] .modules span, [dir="rtl"] .facts dd{ unicode-bidi:plaintext; text-align:start; }
/* arrows point the other way */
[dir="rtl"] .btn svg, [dir="rtl"] .link-more svg{ transform:scaleX(-1); }
[dir="rtl"] .btn:hover svg, [dir="rtl"] .link-more:hover svg{ transform:scaleX(-1) translate(3px,-3px); }
/* books: spine on the right */
[dir="rtl"] .cover{ border-radius:12px 6px 6px 12px; }
[dir="rtl"] .cover::after{ inset:0 0 0 auto; background:linear-gradient(270deg, rgba(0,0,0,.22), rgba(0,0,0,0)); }
[dir="rtl"] .book:hover .cover{ transform:translateY(-6px) rotate(1deg); }
[dir="rtl"] .cover-gen{ padding:1.4rem 1.5rem 1.2rem 1.2rem; }
/* lightbox: previous on the right, next on the left */
[dir="rtl"] .lb-prev{ left:auto; right:1.25rem; }
[dir="rtl"] .lb-next{ right:auto; left:1.25rem; }
[dir="rtl"] .lb-close{ right:auto; left:1.25rem; }
/* inputs that are always latin */
[dir="rtl"] input[type="email"], [dir="rtl"] input[type="url"]{ text-align:right; }

/* language switch in the menu */
.nav .nav-lang{ color:var(--teal-deep); padding-inline-start:1.2rem; border-inline-start:1px solid var(--line); }
.nav .nav-lang:hover{ color:var(--ink); }
@media (max-width:1340px){ .nav .nav-lang{ padding-inline-start:0; border:0; } }
html[lang="ar"] .nav{ gap:1.35rem; }
html[lang="ar"] .nav a{ font-size:.92rem; }