@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display&family=Inter:wght@400;500;600;700&family=Roboto+Mono:wght@400;500&display=swap');
:root{--bg:#102542;--surface:#243B53;--gold:#C8A951;--cream:#F7F2E8;--muted:rgba(247,242,232,.64);--line:rgba(247,242,232,.14);--gutter:clamp(1.25rem,4vw,3rem);--max:1320px;--serif:'DM Serif Display',Georgia,serif;--sans:Inter,system-ui,sans-serif;--mono:'Roboto Mono',monospace;--motion-ease:cubic-bezier(.22,1,.36,1);--motion-fast:200ms;--motion-card:350ms;--motion-enter:350ms;--motion-exit:250ms;--motion-reveal:650ms;--motion-distance:16px;--ease:var(--motion-ease)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--cream);font:400 16px/1.75 var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}.skip-link{position:fixed;z-index:10001;top:8px;left:8px;padding:.7rem 1rem;background:var(--gold);color:var(--bg);transform:translateY(-160%)}.skip-link:focus{transform:none}.progress{position:fixed;inset:0 0 auto;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;z-index:2000}.site-header{position:fixed;inset:0 0 auto;z-index:1000;padding:1rem var(--gutter);transition:background .3s, padding .3s}.site-header.scrolled{background:rgba(16,37,66,.9);backdrop-filter:blur(16px);padding-block:.7rem;border-bottom:1px solid var(--line)}.nav-wrap{max-width:var(--max);margin:auto;display:flex;align-items:center;justify-content:space-between;gap:2rem}.brand{display:flex;align-items:center;gap:.7rem;font-weight:700;letter-spacing:-.04em;white-space:nowrap}.brand-mark{width:34px;height:34px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold);font:500 .68rem var(--mono)}.nav-links{display:flex;align-items:center;gap:.25rem}.nav-links a{font-size:.76rem;color:rgba(247,242,232,.78);padding:.55rem .65rem;border-radius:7px;transition:background .2s,color .2s}.nav-links a:hover,.nav-links a[aria-current=page]{background:rgba(198,161,91,.14);color:var(--gold)}.menu-toggle{display:none;background:none;border:1px solid var(--line);border-radius:8px;padding:.6rem;cursor:pointer}.container{width:min(var(--max),calc(100% - 2*var(--gutter)));margin-inline:auto}.eyebrow{display:flex;align-items:center;gap:.7rem;color:var(--gold);text-transform:uppercase;letter-spacing:.2em;font:500 .68rem var(--mono)}.eyebrow:before{content:'';width:26px;height:1px;background:var(--gold)}h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.05;letter-spacing:-.025em;margin:0}h1{font-size:clamp(3.2rem,8vw,7.5rem)}h2{font-size:clamp(2rem,4vw,3.5rem)}h3{font-size:clamp(1.45rem,2vw,2rem)}p{max-width:72ch;color:rgba(247,242,232,.82);margin:.8rem 0 0}.lead{font-size:clamp(1.05rem,1.6vw,1.25rem);line-height:1.8}.gold{color:var(--gold)}.muted{color:var(--muted)}.hero{background-image:url('../media/schoolimage.webp');background-size:max(125%,133.333svh) auto;background-position:30% 58%;min-height:100svh;display:flex;align-items:center;position:relative;overflow:hidden;padding:9rem 0 5rem}.hero-media{position:absolute;inset:0;opacity:.28;pointer-events:none}.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 42%;filter:saturate(.72)}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 12%,rgba(16,37,66,.92) 24%,rgba(16,37,66,.62) 42%,transparent 62%),linear-gradient(270deg,rgba(16,37,66,.72) 0%,rgba(16,37,66,.4) 12%,transparent 32%),linear-gradient(0deg,rgba(16,37,66,.55),transparent 34%)}.hero-content{position:relative;z-index:1;max-width:850px;margin-left:max(6rem,calc((100vw - var(--max))/2));margin-right:auto}.hero h1{margin:1.5rem 0}.hero h1 span{display:block;color:var(--gold)}.hero-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2rem}.button{display:inline-flex;align-items:center;justify-content:center;gap:.7rem;min-height:48px;padding:.7rem 1.15rem;border:1px solid var(--gold);border-radius:8px;background:var(--gold);color:var(--bg);font-size:.82rem;font-weight:700;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px);filter:brightness(1.1)}.button.secondary{background:transparent;color:var(--cream);border-color:var(--line)}.button.secondary:hover{border-color:var(--gold);color:var(--gold)}.scroll-note{margin-top:4rem;color:var(--muted);font: .65rem var(--mono);letter-spacing:.15em;text-transform:uppercase}.section{padding:clamp(4rem,9vw,8rem) 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-bottom:2.7rem}.section-head p{max-width:42ch}.section-kicker{display:block;color:var(--gold);font:500 .68rem var(--mono);letter-spacing:.18em;text-transform:uppercase;margin-bottom:.85rem}.grid{display:grid;gap:1rem}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.card{position:relative;padding:1.5rem;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,rgba(36,59,83,.94),rgba(36,59,83,.48));box-shadow:0 12px 32px rgba(0,0,0,.12);transition:transform .35s var(--ease),border-color .25s}.card:hover{transform:translateY(-5px);border-color:rgba(200,169,81,.55)}.card-number{color:var(--gold);font:500 .67rem var(--mono);letter-spacing:.16em}.card h3{margin-top:1.4rem}.card p{font-size:.9rem}.card-link{display:inline-flex;align-items:center;gap:.5rem;margin-top:1.4rem;color:var(--gold);font-size:.78rem;font-weight:600}.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--line)}.stat{padding:1.5rem;background:var(--surface)}.stat strong{display:block;color:var(--gold);font:400 clamp(2rem,4vw,3.1rem) var(--serif)}.stat span{font-size:.76rem;color:var(--muted)}.page-hero{padding:12rem 0 5rem;border-bottom:1px solid var(--line);position:relative;overflow:hidden}.page-hero:after{content:'';position:absolute;right:-8rem;top:4rem;width:36rem;height:36rem;border:1px solid rgba(198,161,91,.16);border-radius:50%;box-shadow:0 0 0 60px rgba(198,161,91,.025),0 0 0 120px rgba(198,161,91,.02);pointer-events:none}.page-hero h1{font-size:clamp(3rem,7vw,6.3rem);max-width:900px;margin:1.1rem 0}.page-hero .lead{max-width:68ch}.chapter{padding:clamp(3.5rem,7vw,6.5rem) 0;border-bottom:1px solid var(--line)}.chapter-head{display:grid;grid-template-columns:100px 1fr;gap:1rem;align-items:start;margin-bottom:2rem}.chapter-num{padding-top:.45rem;color:var(--gold);font:500 .72rem var(--mono);letter-spacing:.15em}.chapter-body{max-width:900px}.chapter-body>p:first-child{margin-top:1rem}.callout{padding:1.4rem 1.5rem;border-left:2px solid var(--gold);background:rgba(36,59,83,.65);border-radius:0 12px 12px 0;margin:1.5rem 0}.callout p{margin:0}.list{padding-left:1.2rem;color:rgba(247,242,232,.82)}.list li{padding:.28rem 0}.list li::marker{color:var(--gold)}.pill{display:inline-flex;padding:.35rem .65rem;border:1px solid var(--line);border-radius:999px;color:var(--gold);font: .65rem var(--mono);letter-spacing:.1em;text-transform:uppercase}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px;margin:1.5rem 0}.doc-table{width:100%;border-collapse:collapse;min-width:620px;font-size:.85rem}.doc-table th{background:rgba(198,161,91,.12);color:var(--gold);text-align:left;font:500 .68rem var(--mono);letter-spacing:.1em;text-transform:uppercase}.doc-table th,.doc-table td{padding:.9rem 1rem;border-bottom:1px solid var(--line)}.doc-table tr:last-child td{border:0}.doc-table td{color:rgba(247,242,232,.82)}.week{display:grid;grid-template-columns:100px 1fr;gap:1rem;padding:1.2rem 0;border-bottom:1px solid var(--line)}.week strong{color:var(--gold);font:500 .72rem var(--mono);text-transform:uppercase;letter-spacing:.12em}.week p{margin:0}.steps{counter-reset:steps;display:grid;gap:.8rem}.step{counter-increment:steps;display:grid;grid-template-columns:42px 1fr;gap:1rem;padding:1.1rem;border:1px solid var(--line);border-radius:12px;background:rgba(36,59,83,.48)}.step:before{content:counter(steps,decimal-leading-zero);color:var(--gold);font:500 .68rem var(--mono);padding-top:.3rem}.step h3{font:600 .95rem var(--sans);letter-spacing:0}.step p{font-size:.86rem;margin-top:.3rem}.grade{display:flex;align-items:center;gap:.7rem;font-size:.82rem}.grade i{width:10px;height:10px;border-radius:50%;background:currentColor}.grade.blue{color:#74b8f0}.grade.green{color:#75cc9a}.grade.yellow{color:#e8ca63}.grade.red{color:#ef7777}.poster-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.poster-tile{padding:1.2rem;border-radius:12px;background:var(--surface);border:1px solid var(--line)}.poster-tile b{display:block;color:var(--gold);font:500 .65rem var(--mono);letter-spacing:.15em}.poster-tile span{display:block;font-family:var(--serif);font-size:1.3rem;margin-top:.4rem}.site-footer{border-top:1px solid var(--line);padding:3rem 0 2rem}.footer-top{display:flex;justify-content:space-between;gap:2rem;align-items:start}.footer-links{display:flex;gap:1rem;flex-wrap:wrap;font-size:.78rem;color:var(--muted)}.footer-bottom{display:flex;justify-content:space-between;gap:1rem;margin-top:2.5rem;padding-top:1rem;border-top:1px solid var(--line);font-size:.68rem;color:var(--muted)}.back-top{position:fixed;right:1.2rem;bottom:1.2rem;width:44px;height:44px;border:1px solid var(--gold);border-radius:50%;background:var(--surface);color:var(--gold);display:grid;place-items:center;opacity:0;pointer-events:none;transition:opacity .2s;z-index:500}.back-top.show{opacity:1;pointer-events:auto}.mobile-backdrop{display:none}.reveal{opacity:1;transform:none;transition:opacity .65s var(--ease),transform .65s var(--ease)}.reveal.visible{opacity:1;transform:none}:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.broken{color:rgba(247,242,232,.8)}
.ar-block{margin-top:1.5rem;padding:1rem 1.2rem;border-right:2px solid var(--gold);border-radius:0 10px 10px 0;background:rgba(36,59,83,.6);direction:rtl;text-align:right;font-family:var(--sans);line-height:1.9;color:rgba(247,242,232,.86)}.ar-block p{margin:0;color:inherit;max-width:none}
.ar-block{margin-top:1.5rem;padding:1rem 1.2rem;border-right:2px solid var(--gold);border-radius:0 10px 10px 0;background:rgba(36,59,83,.6);direction:rtl;text-align:right;font-family:var(--sans);line-height:1.9;color:rgba(247,242,232,.86)}.ar-block p{margin:0;color:inherit;max-width:none}
.bilingual{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem;align-items:start}.bilingual>p{margin-top:1rem}.bilingual .ar-block{margin-top:1rem}
@media(max-width:1080px){.menu-toggle{display:block}.nav-links{display:none;position:fixed;inset:0 0 0 auto;width:min(360px,88vw);height:100dvh;padding:6rem 1.4rem 2rem;background:var(--surface);z-index:1002;flex-direction:column;align-items:stretch;gap:.25rem;box-shadow:-20px 0 70px rgba(0,0,0,.3)}.nav-links.open{display:flex}.nav-links a{padding:.9rem 1rem;font-size:.9rem}.mobile-backdrop.show{display:block;position:fixed;inset:0;background:rgba(4,12,24,.65);z-index:1001}.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.5rem}.gallery-item,.doc-fig{margin:0;min-width:0;padding:.65rem;border:1px solid var(--line);border-radius:12px;background:rgba(36,59,83,.55)}.gallery-item img,.doc-fig img{width:100%;height:auto;max-height:260px;object-fit:contain;display:block;background:var(--cream);border-radius:7px;cursor:zoom-in}.gallery-item figcaption,.doc-fig figcaption{padding:.65rem .35rem .25rem;color:var(--muted);font: .63rem/1.5 var(--mono);letter-spacing:.04em}.doc-fig{margin:1.5rem 0;max-width:760px}.doc-fig img{max-height:500px}.lightbox{width:min(84vw,1100px);height:min(82vh,850px);max-width:none;max-height:none;padding:3.5rem 1rem 1rem;border:1px solid var(--line);border-radius:16px;background:rgba(16,37,66,.98);color:var(--cream);box-shadow:0 24px 64px rgba(0,0,0,.5)}.lightbox::backdrop{background:rgba(3,10,20,.86);backdrop-filter:blur(5px)}.lightbox img{display:block;max-width:100%;max-height:calc(72vh - 5rem);object-fit:contain;margin:auto}.lightbox figcaption{text-align:center;color:var(--muted);font-size:.8rem;padding:.5rem}.lightbox-close{position:absolute;right:.7rem;top:.7rem;width:40px;height:40px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--cream);font-size:1.2rem;cursor:pointer}.pub-toc{display:none}.page-leave{opacity:0;transform:scale(0.98);transition:opacity 200ms var(--ease),transform 200ms var(--ease)}.page-enter{animation:pageEnter 350ms var(--ease) both}@keyframes pageEnter{from{opacity:0;transform:scale(1.02)}to{opacity:1;transform:none}}html.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}html.js .reveal.visible{opacity:1;transform:none}

@view-transition{navigation:auto}
::view-transition-old(root){animation:var(--motion-exit) var(--motion-ease) both root-exit}
::view-transition-new(root){animation:var(--motion-enter) var(--motion-ease) both root-enter}
@keyframes root-exit{to{opacity:0;transform:scale(.985)}}
@keyframes root-enter{from{opacity:0;transform:scale(.985)}}
.page-leave{opacity:0;transform:scale(.985);transition:opacity var(--motion-exit) var(--motion-ease),transform var(--motion-exit) var(--motion-ease);pointer-events:none}
.page-enter{animation:root-enter var(--motion-enter) var(--motion-ease) both}
html{scroll-padding-top:6.5rem}
[id]{scroll-margin-top:6.5rem}
@media(min-width:1820px){.pub-toc{display:block;position:fixed;z-index:400;left:max(2rem,calc((100vw - 1600px)/2 - 230px));top:40vh;width:190px;padding:1rem;border:1px solid var(--line);border-radius:12px;background:rgba(36,59,83,.9)}.pub-toc a{display:block;padding:.45rem 0;color:var(--muted);font-size:.72rem}.pub-toc a.active,.pub-toc a:hover{color:var(--gold)}}
@media(max-width:980px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.gallery{grid-template-columns:1fr}.gallery-item img{max-height:360px}}
.quote{font:400 1.03rem/1.55 var(--serif);color:var(--cream);margin:1rem 0 0;max-width:40ch}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.authors-grid{gap:1.1rem}.author-card{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,rgba(36,59,83,.94),rgba(36,59,83,.48));box-shadow:0 12px 32px rgba(0,0,0,.12);transition:transform .35s var(--ease),border-color .25s}.author-card:hover{transform:translateY(-5px);border-color:rgba(200,169,81,.55)}.author-card>img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;object-position:center 30%;background:var(--surface)}.author-card:nth-child(5)>img{object-position:center 40%}.author-card:nth-child(7)>img{object-position:center 50%}.author-info{padding:1.1rem 1.15rem 1.3rem}.author-info h3{font-size:1.35rem}.author-role{color:var(--gold);font:500 .66rem/1.5 var(--mono);letter-spacing:.06em;margin:.6rem 0 0}.author-bio{font-size:.84rem;line-height:1.6;margin:.55rem 0 0}.home-guides .card h3{margin-top:1rem}
@media(max-width:1080px){.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.grid-4{grid-template-columns:1fr}.author-card{display:grid;grid-template-columns:minmax(110px,38%) 1fr;align-items:stretch}.author-card>img{height:100%;min-height:175px;aspect-ratio:auto}.author-info{padding:1rem}.author-info h3{font-size:1.2rem}.section-head{align-items:start;flex-direction:column}}

.hero-ar{position:relative;z-index:1;max-width:680px;background:rgba(16,37,66,.65);border-right-color:#C8A951}.hero-ar p{color:rgba(247,242,232,.88)}.hero .lead{max-width:42rem;padding:.65rem .9rem;border-left:2px solid var(--gold);border-radius:0 8px 8px 0;background:rgba(16,37,66,.48);line-height:1.65;text-wrap:pretty}.hero-content{max-width:760px}.hero h1{font-size:clamp(3rem,6.4vw,6.2rem)}

/* Introduction bilingual section layout */
.chapter-title{font:500 .78rem/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin:0 0 1.2rem}
.chapter-subtitle{font:600 .95rem/1.4 var(--sans);letter-spacing:0;color:var(--cream);margin:0 0 1rem}
.translation-pair{display:grid;grid-template-columns:minmax(0,1fr);gap:.75rem;align-items:stretch}
.translation-en,.translation-pair>.ar-block{margin:0;max-width:none;padding:1.05rem 1.2rem;border:1px solid var(--line);border-radius:12px;background:rgba(36,59,83,.52)}
.translation-en{display:flex;align-items:flex-start}
.translation-en p{margin:0;max-width:none;color:rgba(247,242,232,.88)}
.translation-pair>.ar-block{border-right:2px solid var(--gold);border-radius:12px 0 0 12px;text-align:right;line-height:1.9}
.translation-pair>.ar-block p{margin:0;color:inherit;max-width:none}
.translation-pair>.ar-block p+p{margin-top:.6rem}
.intro-lead{margin-top:1.3rem}
.intro-lead .translation-en,.intro-lead>.ar-block{background:rgba(36,59,83,.72)}
@media(max-width:680px){.translation-pair{grid-template-columns:1fr;gap:.75rem}.translation-pair>.ar-block{border-radius:12px}.translation-en,.translation-pair>.ar-block{padding:.9rem 1rem}}

/* Portfolio navigation, table of contents, and example formatting */
@media(min-width:1200px){
  .pub-toc{display:block;position:fixed;right:1rem;left:auto;top:50%;transform:translateY(-50%);z-index:900;width:54px;max-height:72vh;overflow:hidden;padding:.8rem .65rem;border:1px solid var(--line);border-radius:14px;background:rgba(36,59,83,.97);box-shadow:0 14px 40px rgba(0,0,0,.28);transition:width .24s ease,padding .24s ease}
  .pub-toc:hover,.pub-toc:focus-within{width:min(300px,32vw);max-height:78vh;overflow-y:auto;padding:.9rem;}
  .pub-toc .section-kicker{writing-mode:vertical-rl;transform:rotate(180deg);margin:0 auto;color:var(--gold);white-space:nowrap}
  .pub-toc:hover .section-kicker,.pub-toc:focus-within .section-kicker{writing-mode:initial;transform:none;margin:0 0 .65rem}
  .pub-toc a{display:block;max-height:0;overflow:hidden;opacity:0;padding:0 .55rem;color:var(--muted);font-size:.74rem;line-height:1.45;border-left:2px solid transparent;border-radius:5px;transition:opacity .18s ease,max-height .18s ease,padding .18s ease}
  .pub-toc:hover a,.pub-toc:focus-within a{max-height:4rem;opacity:1;padding:.48rem .55rem}
  .pub-toc a.active,.pub-toc a:hover{color:var(--gold);background:rgba(200,169,81,.1);border-left-color:var(--gold)}
}
.portfolio-page .chapter-body,.poster-page .chapter-body{width:100%;max-width:none}
.portfolio-toc-section .chapter-body{max-width:1040px}
.portfolio-toc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.5rem}
.toc-card,.toc-group{min-width:0;padding:1.1rem 1.2rem;border:1px solid var(--line);border-radius:13px;background:linear-gradient(145deg,rgba(36,59,83,.88),rgba(36,59,83,.48))}
.toc-card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.35rem .8rem;border-right:3px solid var(--gold);transition:transform .2s,border-color .2s}
.toc-card:hover,.toc-links a:hover{transform:translateY(-2px);border-color:var(--gold);color:var(--gold)}
.toc-number{grid-column:1/-1;color:var(--gold);font:500 .62rem var(--mono);letter-spacing:.14em}
.toc-card strong{font-size:1rem}
.toc-card>span:last-child{color:var(--gold)}
.toc-group h3{font:600 .9rem/1.4 var(--sans);letter-spacing:0;color:var(--cream)}
.toc-group h3 span{display:block;margin-top:.2rem;color:var(--muted);font-size:.76rem;font-weight:400}
.toc-links{display:grid;gap:.35rem;margin-top:.8rem}
.toc-links a{padding:.45rem .55rem;border-left:2px solid var(--line);border-radius:4px;color:rgba(247,242,232,.82);font-size:.8rem;line-height:1.4;transition:transform .2s,color .2s,border-color .2s}
.portfolio-page .doc-p.portfolio-one-line{display:block;width:100%;max-width:100%;margin-left:0;padding-block:.65rem;white-space:nowrap;overflow-x:auto;text-align:left;font-size:.94rem;font-style:normal;opacity:1}
.portfolio-page .portfolio-long-copy{display:block;width:100%;max-width:none;margin-left:0;text-align:left;line-height:1.8;white-space:normal;font-style:normal;opacity:1;overflow-wrap:anywhere}
.portfolio-page p.portfolio-long-copy{padding:1.15rem 1.25rem;border-left:2px solid var(--gold);border-radius:0 12px 12px 0;background:rgba(36,59,83,.58)}
.portfolio-requirements{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:1.1rem 0 1.6rem}
.requirement-group{padding:1.2rem 1.35rem;border:1px solid var(--line);border-radius:13px;background:rgba(36,59,83,.58)}
.requirement-group h3{font:600 1rem/1.4 var(--sans);letter-spacing:0;color:var(--gold);margin:0 0 .65rem}
.requirement-group h4{font:600 .78rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:.2rem 0 .8rem}
.requirement-group ul,.requirement-group ol,.test-plan-steps{margin:.25rem 0 0;padding-left:1.35rem;color:rgba(247,242,232,.86)}
.requirement-group li,.test-plan-steps li{padding:.35rem 0 .35rem .2rem;line-height:1.7}
.requirement-group li::marker,.test-plan-steps li::marker{color:var(--gold);font-weight:700}
.portfolio-long-copy.test-plan-example{margin:1rem 0 1.5rem;padding:1.25rem 1.35rem;border-left:2px solid var(--gold);border-radius:0 12px 12px 0;background:rgba(36,59,83,.58)}
.test-plan-intro{max-width:none!important;margin:0 0 .8rem!important;text-align:left!important;line-height:1.8}
.test-plan-steps{margin-top:.8rem}
@media(max-width:760px){.portfolio-toc-grid,.portfolio-requirements{grid-template-columns:1fr}.portfolio-toc-section .chapter-head{grid-template-columns:1fr}.toc-group{padding:1rem}}

/* Poster page contents navigation */
.poster-contents{padding-top:clamp(3rem,6vw,5rem);padding-bottom:clamp(2rem,4vw,3.5rem)}
.poster-contents .section-head{margin-bottom:1.4rem}
.poster-contents-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}
.poster-toc-card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.3rem .7rem;min-width:0;padding:1rem 1.1rem;border:1px solid var(--line);border-right:3px solid var(--gold);border-radius:12px;background:linear-gradient(145deg,rgba(36,59,83,.9),rgba(36,59,83,.48));transition:transform .2s,border-color .2s,color .2s}
.poster-toc-card:hover,.poster-toc-card:focus-visible{transform:translateY(-2px);border-color:var(--gold);color:var(--gold)}
.poster-toc-number{grid-column:1/-1;color:var(--gold);font:500 .62rem var(--mono);letter-spacing:.12em}
.poster-toc-card strong{font-size:.88rem;line-height:1.4}
.poster-toc-arrow{color:var(--gold)}
@media(max-width:980px){.poster-contents-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.poster-contents-grid{grid-template-columns:1fr}.poster-toc-card{padding:.9rem 1rem}}

.poster-page .chapter-body .en,.poster-page .chapter-body .ar{width:100%;max-width:none}
.poster-page .chapter-body blockquote.ex{width:100%;max-width:none}
.poster-page .chapter-body blockquote.ex p{max-width:none}

/* Journal page contents navigation */
.journal-contents{padding-top:clamp(3rem,6vw,5rem);padding-bottom:clamp(2rem,4vw,3.5rem)}
.journal-contents .section-head{margin-bottom:1.4rem}
.journal-contents-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}
.journal-toc-card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.3rem .7rem;min-width:0;padding:1rem 1.1rem;border:1px solid var(--line);border-right:3px solid var(--gold);border-radius:12px;background:linear-gradient(145deg,rgba(36,59,83,.9),rgba(36,59,83,.48));transition:transform .2s,border-color .2s,color .2s}
.journal-toc-card:hover,.journal-toc-card:focus-visible{transform:translateY(-2px);border-color:var(--gold);color:var(--gold)}
.journal-toc-card strong{font-size:.88rem;line-height:1.4}
.journal-toc-card>span:first-child{grid-column:1/-1;color:var(--gold);font:500 .62rem var(--mono);letter-spacing:.12em}
.journal-toc-card>span:last-child{color:var(--gold)}
@media(max-width:980px){.journal-contents-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.journal-contents-grid{grid-template-columns:1fr}.journal-toc-card{padding:.9rem 1rem}}
.journal-page .chapter-head{grid-template-columns:40px minmax(0,1fr);gap:.5rem}
.journal-page .chapter-body.jg{width:100%;max-width:900px;min-width:0;margin:0}
.journal-page .jg h2{display:block;width:100%;margin:0 0 1.1rem;padding:.8rem 1rem;border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:10px;background:linear-gradient(145deg,rgba(36,59,83,.9),rgba(36,59,83,.48));font:600 1.25rem/1.35 var(--sans);letter-spacing:0}
.journal-page .jg p.en,.journal-page .jg p.ar{display:block;width:100%;max-width:none;box-sizing:border-box}
.journal-page .jg p.en{direction:ltr;text-align:left;margin-left:-2.5rem;width:calc(100% + 2.5rem);padding:0;border:0;box-sizing:border-box}
.journal-page .jg li p.en{margin-left:0;width:100%}
.journal-page .jg p.ar{direction:rtl;text-align:right;margin-left:0;margin-right:-1rem;width:calc(100% + 1rem);padding:0 1rem 0 0;border-left:0;border-right:3px solid var(--gold);box-sizing:border-box}
.journal-page .jg ul.en,.journal-page .jg ol.en{border:0;padding-left:1.4rem}
.journal-page .jg h3{margin:1.7rem 0 .7rem;padding-bottom:.45rem;border-bottom:1px solid var(--line);color:var(--gold);font:600 1.05rem/1.45 var(--sans);letter-spacing:0}
.journal-page .jg li{line-height:1.7;margin-bottom:.65rem}
@media(max-width:760px){.journal-page .chapter{padding:2rem 0}.journal-page .chapter-head{grid-template-columns:minmax(0,1fr);gap:.35rem}.journal-page .chapter-num{padding-top:0}.journal-page .chapter-body.jg{max-width:none}.journal-page .jg p.en{margin-left:0;width:100%}}
.logbook-page .chapter-body h2{display:flex;align-items:center;gap:1rem;margin:0 0 1.2rem;padding:1rem 1.2rem;border:1px solid var(--line);border-right:3px solid var(--gold);border-radius:12px;background:linear-gradient(145deg,rgba(36,59,83,.9),rgba(36,59,83,.48));font:600 1.05rem/1.4 var(--sans);letter-spacing:0}
.logbook-page #logbook-weekly h2::before,.logbook-page #logbook-parts h2::before,.logbook-page #logbook-guidance h2::before,.logbook-page #logbook-problems h2::before{flex:none;color:var(--gold);font:500 .68rem/1.4 var(--mono);letter-spacing:.12em}
.logbook-page #logbook-weekly h2::before{content:"05.01"}.logbook-page #logbook-parts h2::before{content:"05.02"}.logbook-page #logbook-guidance h2::before{content:"05.03"}.logbook-page #logbook-problems h2::before{content:"05.04"}
.logbook-page .chapter-body p:not(.ar),.logbook-page .card p:not(.ar){width:100%;max-width:none;padding-left:1rem;border-left:3px solid var(--gold);text-align:left}
.logbook-page .chapter-body p.ar,.logbook-page .card p.ar{width:100%;max-width:none;padding-right:1rem;border-right:3px solid var(--gold);text-align:right;direction:rtl;line-height:1.9}
.logbook-page .section-translation{margin:-.55rem 0 1rem;padding-right:1rem;border-right:3px solid var(--gold)}
@media(max-width:600px){.logbook-page .chapter-body h2{gap:.75rem;padding:.85rem 1rem;font-size:.98rem}}
.logbook-intro{padding-top:clamp(2.5rem,5vw,4rem);padding-bottom:clamp(2.5rem,5vw,4rem)}
.logbook-intro .section-head{margin-bottom:1.2rem}
.logbook-intro-copy{display:grid;gap:.8rem;padding:1.3rem 1.5rem;border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:12px;background:linear-gradient(145deg,rgba(36,59,83,.9),rgba(36,59,83,.48))}
.logbook-intro-copy p{width:100%;max-width:none;margin:0}
.logbook-intro-copy .en{padding-left:1rem;border-left:3px solid var(--gold);text-align:left}
.logbook-intro-copy .ar{padding-right:1rem;border-right:3px solid var(--gold);text-align:right;direction:rtl;line-height:1.9}
@media(max-width:600px){.logbook-intro-copy{padding:1rem}}

.panel-page .panel-contents{padding-top:clamp(3rem,6vw,5rem)}
.panel-page .chapter-body h2,.panel-page .jg>h2{display:flex;align-items:center;gap:1rem;width:100%;margin:2.2rem 0 1.2rem;padding:1rem 1.2rem;border:1px solid var(--line);border-right:3px solid var(--gold);border-radius:12px;background:linear-gradient(145deg,rgba(36,59,83,.9),rgba(36,59,83,.48));font:600 1.05rem/1.4 var(--sans);letter-spacing:0}
.panel-page .jg>h2:first-child{margin-top:0}
.panel-page .jg h2[id^="panel-"]::before{flex:none;color:var(--gold);font:500 .68rem/1.4 var(--mono);letter-spacing:.12em}
.panel-page #panel-overview::before{content:"04.01"}.panel-page #panel-introduction::before{content:"04.02"}.panel-page #panel-design-requirements::before{content:"04.03"}.panel-page #panel-time-frame::before{content:"04.04"}.panel-page #panel-materials::before{content:"04.05"}.panel-page #panel-safety::before{content:"04.06"}.panel-page #panel-selected-prototype::before{content:"04.07"}.panel-page #panel-prototype-design::before{content:"04.08"}.panel-page #panel-examples::before{content:"04.09"}
.panel-page .jg p.en,.panel-page .jg p.ar{display:block;width:100%;max-width:none;box-sizing:border-box}
.panel-page .jg p.en{direction:ltr;text-align:left;margin:0 0 .8rem;padding-left:1rem;border-left:3px solid var(--gold)}
.panel-page .jg p.ar{direction:rtl;text-align:right;margin:0 0 1.4rem;padding-right:1rem;border-right:3px solid var(--gold);line-height:1.9}
.panel-page .jg ol.en{padding-left:1.6rem}
.panel-page .jg figure{max-width:100%;padding:.7rem;border:1px solid var(--line);border-radius:12px;background:rgba(36,59,83,.55)}
@media(max-width:600px){.panel-page .chapter-body h2,.panel-page .jg>h2{gap:.75rem;padding:.85rem 1rem;font-size:.98rem}}

.time-frame-page .time-contents{padding-top:clamp(3rem,6vw,5rem)}
.time-frame-page .chapter-head{grid-template-columns:64px minmax(0,1fr);gap:.75rem}
.time-frame-page .chapter-body h2{display:flex;align-items:center;gap:1rem;margin:0 0 1.2rem;padding:1rem 1.2rem;border:1px solid var(--line);border-right:3px solid var(--gold);border-radius:12px;background:linear-gradient(145deg,rgba(36,59,83,.9),rgba(36,59,83,.48));font:600 1.05rem/1.4 var(--sans);letter-spacing:0}
.time-frame-page #time-general-rule-title::before,.time-frame-page #time-roadmap-title::before{flex:none;color:var(--gold);font:500 .68rem/1.4 var(--mono);letter-spacing:.12em}
.time-frame-page #time-general-rule-title::before{content:"07.02"}.time-frame-page #time-roadmap-title::before{content:"07.03"}
.time-frame-page .chapter-body>p,.time-frame-page .week>div>p{width:100%;max-width:none;margin:.65rem 0;padding-left:1rem;border-left:3px solid var(--gold);text-align:left;box-sizing:border-box}
.time-frame-page .chapter-body .callout>p{margin:0;padding-left:1rem}
.time-frame-page .section-translation{margin:-.55rem 0 1rem;padding-right:1rem;border-right:3px solid var(--gold);text-align:right;direction:rtl}
.time-frame-page .week{scroll-margin-top:100px}
.time-frame-page .week>div{min-width:0}
.time-frame-page .week .ar-block{margin-top:.9rem}
@media(max-width:760px){.time-frame-page .chapter-head{grid-template-columns:minmax(0,1fr);gap:.35rem}.time-frame-page .chapter-num{padding-top:0}}
@media(max-width:600px){.time-frame-page .chapter-body h2{gap:.75rem;padding:.85rem 1rem;font-size:.98rem}.time-frame-page .week{grid-template-columns:1fr;gap:.35rem}}

/* Shared motion tokens keep the interaction language consistent site-wide. */
html.js .reveal{opacity:1;transform:none}
html.motion-ready .reveal:not(.visible){opacity:0;transform:translateY(var(--motion-distance))}
.reveal{transition:opacity var(--motion-reveal) var(--motion-ease),transform var(--motion-reveal) var(--motion-ease);transition-delay:var(--reveal-delay,0ms)}
.site-header,.nav-links a,.button,.card,.author-card,.poster-toc-card,.journal-toc-card,.toc-card,.toc-group,.back-top,.gallery-item,.doc-fig{transition-timing-function:var(--motion-ease)}
.nav-links a{position:relative;transition:background-color var(--motion-fast),color var(--motion-fast)}
.nav-links a[aria-current="page"]::after{content:"";position:absolute;left:.65rem;right:.65rem;bottom:.24rem;height:1px;background:var(--gold);transform-origin:left;animation:nav-indicator var(--motion-card) var(--motion-ease) both}
@keyframes nav-indicator{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.button{transition:transform var(--motion-fast),background-color var(--motion-fast),border-color var(--motion-fast),color var(--motion-fast),filter var(--motion-fast)}
.back-top{visibility:hidden;transform:translateY(8px);transition:opacity var(--motion-fast),transform var(--motion-fast),visibility 0s linear var(--motion-fast)}
.back-top.show{visibility:visible;transform:translateY(0);transition-delay:0s}
.time-frame-page .week{position:relative;border-color:var(--line);transition:border-color var(--motion-card) var(--motion-ease),background-color var(--motion-card) var(--motion-ease)}
.time-frame-page .week::before{content:"";position:absolute;left:0;top:1.2rem;bottom:1.2rem;width:2px;background:var(--gold);transform:scaleY(0);transform-origin:top;transition:transform var(--motion-reveal) var(--motion-ease)}
.time-frame-page .week.is-active{border-color:rgba(200,169,81,.48);background:linear-gradient(90deg,rgba(200,169,81,.035),transparent 45%)}
.time-frame-page .week.is-active::before{transform:scaleY(1)}
.gallery-item,.doc-fig{overflow:hidden}
.gallery-item img,.doc-fig img{transition:transform var(--motion-card) var(--motion-ease)}
@media(hover:hover) and (pointer:fine){.gallery-item:hover img,.doc-fig:hover img{transform:scale(1.025)}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  html.js .reveal,html.motion-ready .reveal:not(.visible){opacity:1;transform:none;transition:none}
  ::view-transition-old(root),::view-transition-new(root){animation:none!important}
  .page-enter{animation:none}
  .page-leave{opacity:1;transform:none;transition:none}
  .time-frame-page .week::before{transform:scaleY(1);transition:none}
  .nav-links a[aria-current="page"]::after{animation:none}
}

/* Responsive audit fixes: keep document content inside its grid and viewport. */
.hero{background-repeat:no-repeat}
.hero-actions,.chapter-body,.chapter-head{min-width:0}
.hero-actions>.button{flex:0 1 auto;min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere;text-align:center}
.chapter-head{grid-template-columns:100px minmax(0,1fr)}
.chapter-body{min-width:0}
.table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
img,video,iframe{max-width:100%}
:where(p,li,td,th){overflow-wrap:anywhere}
.menu-toggle{width:44px;min-width:44px;min-height:44px;padding:.5rem}
.brand{min-height:44px}
.nav-links a{min-height:44px;display:inline-flex;align-items:center}

@media(max-width:680px){
  .menu-toggle{display:block}
  .nav-links{max-width:88vw;overflow-y:auto;overscroll-behavior:contain;padding-bottom:max(2rem,env(safe-area-inset-bottom))}
  .grid-3,.grid-2{grid-template-columns:minmax(0,1fr)}
  .bilingual{grid-template-columns:minmax(0,1fr);gap:.85rem}
  .chapter-head{grid-template-columns:minmax(0,1fr);gap:.35rem}
  .chapter-num{padding-top:0}
  .chapter-body{width:100%;max-width:none}
  .page-hero{padding:8rem 0 3rem}
  .hero{min-height:100svh;padding:7rem 0 max(3rem,env(safe-area-inset-bottom));background-size:cover;background-position:50% 58%}
  .hero-content{width:calc(100% - 2*var(--gutter));max-width:none;margin-inline:auto}
  .hero h1{font-size:clamp(2rem,8vw,3rem);margin:1rem 0}
  .hero .lead{max-width:100%;font-size:1rem;line-height:1.65;padding:.65rem .8rem}
  .hero-ar{max-width:100%;padding:.75rem .85rem;margin-top:.85rem}
  .hero-actions{gap:.65rem;margin-top:1.2rem}
  .hero-actions .button{flex:1 1 100%;width:100%;min-height:48px}
  .scroll-note{margin-top:1.5rem}
  .footer-top,.footer-bottom{flex-direction:column;align-items:flex-start;gap:1.1rem}
  .footer-bottom{margin-top:1.5rem}
  .poster-contents-grid,.portfolio-toc-grid,.portfolio-requirements,.journal-contents-grid{grid-template-columns:minmax(0,1fr)}
}

@media(max-width:360px){
  :root{--gutter:1rem}
  .site-header{padding-inline:var(--gutter)}
  .hero h1{font-size:2.25rem}
  .author-card{grid-template-columns:minmax(96px,36%) minmax(0,1fr)}
}

@media(max-width:760px){
  .journal-page .jg{min-width:0;max-width:100%;margin-inline:0}
  .journal-page .jg p.en{width:100%!important;margin-left:0!important}
}
