/*
 * Γραφές 1821–1922 — site stylesheet.
 *
 * Structure:
 *   1. @layer base        – browser reset (same normalisation the original build used)
 *   2. @layer components  – default behaviour of tabs, accordion and the search input
 *   3. Unlayered rules    – the Γραφές editorial identity. Unlayered CSS always wins
 *                           over layered CSS, exactly as in the original cascade.
 *   4. Progressive enhancement and small fixes (end of file).
 */
@layer base, components;

@layer base {
  *, ::after, ::before, ::backdrop { box-sizing:border-box; border:0 solid; margin:0; padding:0; }
  html { -webkit-text-size-adjust:100%; tab-size:4; line-height:1.5; font-family:Arial,Helvetica,sans-serif; -webkit-tap-highlight-color:transparent; }
  hr { height:0; color:inherit; border-top-width:1px; }
  h1,h2,h3,h4,h5,h6 { font-size:inherit; font-weight:inherit; }
  a { color:inherit; text-decoration:inherit; }
  b,strong { font-weight:bolder; }
  small { font-size:80%; }
  ol,ul,menu { list-style:none; }
  img,svg,video,canvas { vertical-align:middle; display:block; }
  img,video { max-width:100%; height:auto; }
  button,input,select,textarea { font:inherit; font-feature-settings:inherit; font-variation-settings:inherit; letter-spacing:inherit; color:inherit; opacity:1; background-color:transparent; border-radius:0; }
  button { -webkit-appearance:button; appearance:button; }
  ::placeholder { opacity:1; color:color-mix(in oklab, currentcolor 50%, transparent); }
  ::-webkit-search-decoration { -webkit-appearance:none; }
  [hidden]:where(:not([hidden="until-found"])) { display:none !important; }
}

@layer components {
  /* Tabs */
  [data-slot="tabs"] { display:flex; flex-direction:column; gap:.5rem; }
  [data-slot="tabs-list"] { display:inline-flex; align-items:center; justify-content:center; }
  [data-slot="tabs-trigger"] { position:relative; display:inline-flex; flex:1 1 0%; align-items:center; justify-content:center; gap:.375rem; white-space:nowrap; transition:all .15s cubic-bezier(.4,0,.2,1); }
  [data-slot="tabs-content"] { flex:1 1 0%; outline:none; }

  /* Accordion */
  [data-slot="accordion-item"] { border-bottom-width:1px; }
  [data-slot="accordion-item"]:last-child { border-bottom-width:0; }
  [data-slot="accordion-item"] > h3 { display:flex; }
  [data-slot="accordion-trigger"] { display:flex; flex:1 1 0%; align-items:flex-start; justify-content:space-between; gap:1rem; padding-block:1rem; text-align:left; font-size:.875rem; font-weight:500; transition:all .15s cubic-bezier(.4,0,.2,1); }
  [data-slot="accordion-trigger"]:focus-visible { box-shadow:0 0 0 3px rgba(138,103,47,.5); }
  [data-slot="accordion-trigger"] > svg { width:1rem; height:1rem; flex-shrink:0; pointer-events:none; translate:0 .125rem; transition:transform .2s cubic-bezier(.4,0,.2,1), translate .2s cubic-bezier(.4,0,.2,1), rotate .2s cubic-bezier(.4,0,.2,1); }
  [data-slot="accordion-trigger"][data-state="open"] > svg { rotate:180deg; }
  [data-slot="accordion-content"] { overflow:hidden; font-size:.875rem; }
  [data-slot="accordion-content"] > div { padding-top:0; padding-bottom:1rem; }

  /* Search input */
  [data-slot="input"] { width:100%; min-width:0; line-height:1.5; transition:color .15s cubic-bezier(.4,0,.2,1), box-shadow .15s cubic-bezier(.4,0,.2,1); }
  [data-slot="input"]::placeholder { color:#737373; }
  @media (min-width:768px) { [data-slot="input"] { line-height:calc(1.25 / .875); } }
}

/* GFS Didot (Greek Font Society, SIL OFL) — self-hosted; see assets/fonts/OFL.txt.
   The 19th-century Greek book face, with full polytonic coverage. */
@font-face { font-family:"GFS Didot"; font-style:normal; font-weight:400; font-display:swap; src:url("../fonts/GFSDidot-Regular.woff2") format("woff2"); }
@font-face { font-family:"GFS Didot"; font-style:italic; font-weight:400; font-display:swap; src:url("../fonts/GFSDidot-Italic.woff2") format("woff2"); }
@font-face { font-family:"GFS Didot"; font-style:normal; font-weight:700; font-display:swap; src:url("../fonts/GFSDidot-Bold.woff2") format("woff2"); }

/* Γραφές — an editorial identity for historical research. */
:root { --paper:#fbfaf7; --ink:#15343d; --body-ink:#3e5054; --muted-ink:#5d6b6c; --line:#d9ded8; --gold:#bb9557; --sage:#edf0eb;
  /* Typography: the title serif is used for everything. The sans survives only in the small tracked-capital
     labels ("02 / ΤΟ ΥΛΙΚΟ"), because Georgia's old-style figures make "02" read as "o2" next to capitals. */
  --font-text:'GFS Didot',Georgia,'Times New Roman',serif; --font-label:Arial,Helvetica,sans-serif;
  /* TITLE SCALE — multiplies every h1–h3 size. GFS Didot sets about 20% wider than Georgia, so the titles are
     drawn smaller to keep their intended line breaks. To go back to Georgia: remove 'GFS Didot' from --font-text
     and set this to 1. */
  --display-scale:.86; }
/* TEXT SCALE — the one knob for the size of all running text.
   Text sizes below are in rem (= design px / 16), so they follow this percentage and the visitor's own browser
   font-size setting. Titles and display numerals (h1–h3, logo, years, folio numbers) stay in px on purpose.
   100% = the original design sizes · 112.5% = current (body 17px -> ~19px), chosen because Georgia's lower
   x-height makes it look ~7% smaller than the Arial the sizes were first drawn for. */
html { font-size:112.5%; }

html { scroll-behavior:smooth; scroll-padding-top:100px; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--font-text); font-size:1.0625rem; line-height:1.65; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
button,a,input { -webkit-tap-highlight-color:transparent; }
button,a { touch-action:manipulation; }
button { cursor:pointer; }
button:focus-visible,a:focus-visible,input:focus-visible { outline:2px solid #8a672f; outline-offset:5px; }
::selection { background:#ead8ac; color:var(--ink); }
h1,h2,h3,h4,p,figure { margin:0; }
h1,h2,h3 { font-family:var(--font-text); font-weight:400; }
h2 { font-size:calc(43px * var(--display-scale)); line-height:1.18; letter-spacing:-1.15px; }
h3 { font-size:calc(27px * var(--display-scale)); line-height:1.3; }
p { color:var(--body-ink); }
.shell { width:min(1200px,calc(100% - 96px)); margin-inline:auto; }
.section { padding-block:100px; }
.eyebrow { display:flex; align-items:center; gap:11px; margin-bottom:25px; color:#596b6a; font-size:.75rem; font-weight:600; letter-spacing:1.65px; line-height:1.5; }
.eyebrow.light { color:#c9ccba; }
.tiny-rule { width:27px; height:1px; background:var(--gold); }
.skip-link { position:fixed; z-index:100; top:-100px; left:16px; padding:12px 20px; background:var(--ink); color:white; }
.skip-link:focus { top:12px; }
.site-header { position:sticky; top:0; z-index:30; border-bottom:1px solid var(--line); background:rgba(251,250,247,.97); backdrop-filter:blur(16px); }
.header-inner { display:flex; align-items:center; justify-content:space-between; min-height:92px; gap:30px; }
.brand { display:flex; align-items:center; gap:20px; flex-shrink:0; }
.brand>span { font-family:var(--font-text); font-size:34px; letter-spacing:-1.7px; line-height:1; }
.brand-dot { color:#a78342; }
.brand small { border-left:1px solid #c8cec7; padding-left:20px; font-size:.75rem; font-weight:500; letter-spacing:1px; }
.navigation { display:flex; align-items:center; gap:28px; font-size:.875rem; }
.navigation>a { transition:color .15s; }
.navigation>a:hover { color:#8a672f; }
.navigation .nav-cta { display:flex; gap:10px; align-items:center; padding:11px 16px; border:1px solid #b5c0b9; }
.menu-toggle { display:none; align-items:center; justify-content:center; width:44px; height:44px; }
.hero { display:grid; grid-template-columns:1.2fr 1fr; gap:70px; align-items:center; padding-block:66px 58px; }
.hero h1 { font-size:calc(67px * var(--display-scale)); letter-spacing:-2.7px; line-height:1.08; margin-bottom:28px; }
h1 em,.contact-section em { font-weight:400; color:#907445; }
.hero-lead { font-size:1.3125rem; line-height:1.55; color:var(--ink); }
.hero-description { max-width:31.875rem; margin-top:22px; font-size:1rem; line-height:1.7; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:22px; margin-top:30px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:16px; min-height:50px; padding:13px 20px; font-size:.875rem; font-weight:500; line-height:1.5; transition:background .15s,transform .15s; }
.button:hover { transform:translateY(-2px); }
.button.primary { color:var(--paper); background:var(--ink); }
.button.primary:hover { background:#28515b; }
.quiet-link { display:flex; align-items:center; gap:10px; font-size:.875rem; border-bottom:1px solid #c7cec5; padding-block:8px; }
.hero-affiliation { display:flex; align-items:center; gap:19px; margin-top:37px; font-size:.875rem; line-height:1.55; letter-spacing:.15px; color:#5d6b6c; }
.plus { color:#a78751; font-size:22px; }
.hero-art { width:100%; max-width:470px; justify-self:end; }
.artifact-frame { position:relative; background:var(--ink); padding:23px 38px 20px; }
.artifact-label { display:block; color:#d4d1bd; font-size:.625rem; letter-spacing:1.5px; margin-bottom:20px; }
.artifact-frame img { display:block; width:100%; height:auto; max-height:480px; object-fit:contain; box-shadow:0 13px 26px #071d2244; }
.artifact-bottom { display:flex; justify-content:space-between; gap:12px; color:#dadfd7; margin-top:20px; font-size:.6875rem; }
.artifact-bottom>span:last-child { font-family:var(--font-text); font-size:18px; color:#d9bd85; }
.hero-art figcaption { display:flex; flex-wrap:wrap; justify-content:space-between; gap:2px 12px; padding-top:12px; font-size:.625rem; line-height:1.6; color:#5c6868; }
.hero-art figcaption a { display:flex; align-items:center; gap:2px; text-decoration:underline; text-underline-offset:3px; }
.scope-band { border-block:1px solid var(--line); background:#f2f3ee; }
.scope-inner { display:flex; align-items:center; gap:60px; padding-block:27px; }
.scope-years { font-family:var(--font-text); font-size:30px; letter-spacing:-.6px; white-space:nowrap; }
.scope-years>span { color:#ae8f57; padding-inline:8px; }
.scope-text { display:flex; align-items:center; gap:23px; border-left:1px solid #cbd2c7; padding-left:45px; }
.scope-text>svg { color:#718077; flex-shrink:0; }
.scope-text p { font-size:1rem; color:var(--ink); }
.scope-text p>span { display:block; color:#61706c; font-size:.8125rem; margin-top:2px; }
.vision { display:grid; grid-template-columns:1fr 1.1fr; gap:88px; }
.vision-body>p+p { margin-top:21px; }
.large-copy { font-size:1.3125rem; line-height:1.55; color:var(--ink); }
.current-phase { display:flex; gap:15px; margin-top:32px; padding-top:23px; border-top:1px solid var(--line); }
.status-dot { height:7px; width:7px; border-radius:50%; background:#859a72; flex-shrink:0; margin-top:10px; }
.current-phase strong { font-size:.875rem; font-weight:600; }
.current-phase p { font-size:.875rem; margin-top:6px; }
.materials-section { background:var(--sage); }
.section-heading { display:grid; grid-template-columns:1.3fr 1fr; gap:95px; align-items:end; margin-bottom:45px; }
.section-heading>p { font-size:1rem; padding-bottom:4px; }
.editorial-tabs[data-slot="tabs-list"] { display:flex; flex-wrap:wrap; justify-content:flex-start; gap:0; width:100%; height:auto; border:0; border-bottom:1px solid #c3ccc4; background:transparent; border-radius:0; padding:0; color:var(--muted-ink); }
.editorial-tabs [data-slot="tabs-trigger"] { position:relative; flex:1 1 0; height:auto; min-height:61px; padding:15px 14px; border:0; border-radius:0; white-space:normal; font-size:1.0625rem; line-height:1.4; background:transparent; box-shadow:none; color:#596a65; font-weight:400; }
.editorial-tabs [data-slot="tabs-trigger"][data-state="active"] { background:transparent; color:var(--ink); box-shadow:inset 0 -2px 0 var(--ink); font-weight:600; }
.editorial-tabs [data-slot="tabs-trigger"]:hover { background:#15343d06; }
.materials-tabs,.pathway-tabs { gap:0; }
.material-panel { display:grid; grid-template-columns:1.25fr 1fr; gap:60px; padding-block:40px 30px; margin-top:0; min-height:245px; }
.material-panel[data-state="inactive"],.pathway-panel[data-state="inactive"] { display:none; }
.material-main { display:flex; align-items:flex-start; gap:23px; }
.folio { font-family:var(--font-text); color:#8b9a8d; font-size:45px; line-height:1; }
.material-main h3 { max-width:430px; margin-bottom:14px; }
.material-main p { font-size:1rem; }
.material-examples { border-left:1px solid #cbd3c8; padding-left:36px; }
.material-examples ul { list-style:none; padding:0; margin:0; font-size:.9375rem; }
.material-examples li { display:flex; align-items:baseline; gap:12px; margin-bottom:8px; }
.material-examples li>span { height:4px; width:4px; background:#81937f; flex-shrink:0; }
.material-examples>p { font-family:var(--font-text); font-style:italic; margin-top:19px; font-size:1rem; color:#65776c; }
.collection-note { display:flex; align-items:center; gap:17px; border-top:1px solid #cbd3c8; padding-top:24px; }
.collection-note svg { flex-shrink:0; color:#718575; }
.collection-note p { font-size:.875rem; }
.demo-grid { display:grid; grid-template-columns:1fr 1.18fr; border:1px solid var(--line); }
.scan-panel { padding:23px 26px; background:#edf0eb; }
.panel-top { display:flex; align-items:center; justify-content:space-between; gap:15px; color:#65726d; font-size:.75rem; margin-bottom:22px; }
.scan-panel>a { display:block; max-width:355px; margin-inline:auto; }
.scan-panel img { width:100%; height:auto; box-shadow:0 5px 20px #203f3512; }
.scan-panel figcaption { margin-top:20px; color:#606d65; font-size:.75rem; line-height:1.65; }
.text-link { display:inline-flex; align-items:center; gap:8px; font-size:.8125rem; margin-top:9px; border-bottom:1px solid #aebbab; padding-bottom:3px; color:var(--ink); }
.text-link:hover { border-color:var(--ink); }
.scan-panel .text-link { display:flex; width:fit-content; font-size:.75rem; }
.text-panel { padding:23px 28px 24px; min-width:0; }
.search-controls label { display:block; font-size:.8125rem; margin-bottom:9px; }
.search-field { position:relative; display:flex; align-items:center; background:white; border:1px solid #bac6bc; }
.search-field>svg { position:absolute; left:13px; color:#65796a; pointer-events:none; }
.search-field input { border:0; border-radius:0; box-shadow:none; background:transparent; color:var(--ink); height:46px; padding:9px 44px 9px 42px; font-size:1rem; }
.search-field input:focus-visible { box-shadow:0 0 0 2px #8a672f; outline-offset:0; }
.search-field button { position:absolute; right:4px; display:grid; place-items:center; width:36px; height:36px; color:#596c61; }
.search-status { font-size:.75rem; color:#657368; margin-top:9px; min-height:38px; }
.transcription { margin-top:20px; color:#34453c; }
.transcription h3 { font-size:calc(23px * var(--display-scale)); margin-bottom:17px; }
.transcription p { font-family:var(--font-text); font-size:1.0625rem; color:#3e4d44; line-height:1.85; margin-top:14px; }
.transcription mark { color:var(--ink); background:#eee0ae; padding:1px 2px; border-radius:1px; }
.demo-note { margin-top:24px; padding-top:17px; border-top:1px solid var(--line); }
.demo-note>span { color:#6b766b; font-size:.625rem; font-weight:600; letter-spacing:1.2px; }
.demo-note p { font-size:.75rem; color:#697367; margin-top:6px; line-height:1.7; }
.benefits { background:var(--ink); color:var(--paper); }
.benefits .section { padding-block:78px; }
.benefits .section-heading>p { color:#c2cec9; }
.benefit-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:45px; margin-top:48px; }
.benefit-grid article { border-top:1px solid #446066; padding-top:28px; }
.benefit-grid article>svg { color:#c7ad77; stroke-width:1.3; margin-bottom:20px; }
.benefit-grid h3 { font-size:calc(26px * var(--display-scale)); margin-bottom:16px; }
.benefit-grid p { color:#c2cec9; font-size:.9375rem; line-height:1.75; }
.pathway-panel { display:grid; grid-template-columns:1fr 1.35fr; gap:28px 65px; padding:38px 32px 26px; background:#f0f2ed; }
.pathway-intro>svg { color:#7d937e; margin-bottom:18px; stroke-width:1.4; }
.pathway-intro h3 { margin-bottom:18px; }
.pathway-intro p { font-size:.9375rem; }
.pathway-steps { list-style:none; margin:0; padding:0; }
.pathway-steps li { display:flex; gap:21px; padding-block:18px; border-bottom:1px solid #d4dccf; }
.pathway-steps li:first-child { padding-top:0; }
.pathway-steps li:last-child { border:0; padding-bottom:0; }
.step-number { font-family:var(--font-text); font-size:20px; color:#84927f; flex-shrink:0; }
.pathway-steps h4 { font-size:.9375rem; font-weight:600; margin-bottom:5px; }
.pathway-steps p { font-size:.875rem; line-height:1.7; }
.pathway-note { grid-column:1/-1; display:flex; align-items:flex-start; gap:10px; border-top:1px solid #cfd8c9; padding-top:17px; font-size:.75rem; color:#60705f; }
.pathway-note svg { flex-shrink:0; margin-top:2px; }
.collaborate-bottom { display:flex; justify-content:space-between; align-items:center; gap:24px; padding-top:29px; }
.collaborate-bottom p { font-size:.9375rem; }
.collaborate-bottom strong { font-weight:500; color:var(--ink); }
.team-section { background:#f1efe8; }
.team-grid { display:grid; grid-template-columns:1fr 1fr; gap:70px; }
.person { border-top:1px solid #c8cec1; padding-top:26px; }
.person-field { display:block; color:#596851; letter-spacing:.65px; font-size:.875rem; line-height:1.5; margin-bottom:15px; }
.person h3 { font-size:calc(30px * var(--display-scale)); margin-bottom:16px; }
.person>p { font-size:1rem; }
.person-dept { color:#687363; font-size:.875rem; margin-top:14px; }
.person .text-link { margin-top:20px; }
.student-band { display:grid; grid-template-columns:1fr 2.2fr; gap:30px; margin-top:42px; padding-top:25px; border-top:1px solid #c8cec1; }
.student-label { font-size:.6875rem; letter-spacing:1.3px; color:#6c7867; padding-top:5px; }
.student-band p { font-size:.9375rem; }
.faq-section { display:grid; grid-template-columns:1fr 1.5fr; gap:80px; }
.faq-aside { font-size:.9375rem; margin-top:25px; max-width:17.1875rem; }
.faq-list [data-slot="accordion-item"] { border-color:var(--line); }
.faq-list [data-slot="accordion-trigger"] { padding-block:23px; font-family:var(--font-text); font-size:1rem; font-weight:400; line-height:1.6; border-radius:0; gap:25px; }
.faq-list [data-slot="accordion-trigger"]:hover { text-decoration:none; color:#91713d; }
.faq-list [data-slot="accordion-trigger"]>svg { color:#718170; }
.faq-list [data-slot="accordion-content"] { font-size:.9375rem; color:var(--body-ink); line-height:1.8; }
.faq-list [data-slot="accordion-content"]>div { padding-bottom:25px; }
.contact-section { background:#1d3e46; color:var(--paper); }
.contact-inner { display:grid; grid-template-columns:1.5fr 1fr; gap:70px; align-items:center; padding-block:75px; }
.contact-section h2 { font-size:calc(40px * var(--display-scale)); }
.contact-section h2 em { color:#ccb07a; }
.contact-section p:not(.eyebrow) { color:#c3d0cb; font-size:.9375rem; margin-top:22px; }
.contact-details { display:flex; flex-direction:column; align-items:flex-start; justify-self:end; }
.light-button { background:#eeeadf; color:var(--ink); }
.light-button:hover { background:white; }
.email-link { display:flex; align-items:center; gap:14px; font-size:1.625rem; line-height:1.3; color:var(--paper); border-bottom:1px solid #4d6a70; padding-bottom:10px; transition:border-color .15s; }
.email-link:hover { border-color:#ccb07a; }
.email-link>svg { color:#ccb07a; flex-shrink:0; stroke-width:1.5; }
.contact-details>span { color:#b6c5bd; font-size:.9375rem; margin-top:18px; }
.site-footer { display:flex; align-items:center; justify-content:space-between; gap:30px; padding-block:34px; }
.footer-brand>span { font-size:28px; }
.footer-brand small { font-size:.625rem; }
.site-footer>p { font-size:.8125rem; color:#66736a; }
.site-footer>p>span { display:block; margin-top:3px; color:#748074; }
.site-footer>p a { text-decoration:underline; text-underline-offset:3px; }
.site-footer>p a:hover { color:var(--ink); }
.site-footer .sep { font-style:normal; }
@media(max-width:700px) { .site-footer .sep { display:none; } .site-footer>p a { display:block; width:fit-content; margin-top:3px; } }
.back-top { display:flex; gap:9px; align-items:center; font-size:.75rem; }
.back-top>svg { transform:rotate(-90deg); }
@media(min-width:1440px) {
  .shell { width:min(1240px,calc(100% - 120px)); }
  .hero { gap:90px; }
  .hero-art { max-width:475px; }
  .hero h1 { font-size:calc(72px * var(--display-scale)); }
}
@media(max-width:1100px) {
  .shell { width:calc(100% - 64px); }
  .navigation { gap:18px; font-size:.8125rem; }
  .brand { gap:14px; }
  .brand small { padding-left:14px; }
  .hero { gap:42px; }
  .hero h1 { font-size:calc(56px * var(--display-scale)); }
  .hero-lead { font-size:1.1875rem; }
  .artifact-frame { padding:20px 28px; }
  .section-heading { gap:50px; }
  .vision { gap:50px; }
  .hero-affiliation { margin-top:25px; }
  .scope-inner { gap:30px; }
  .scope-text { padding-left:30px; }
  .faq-section { gap:45px; }
  .contact-inner { gap:35px; }
  h2 { font-size:calc(39px * var(--display-scale)); }
}
@media(max-width:900px) {
  .navigation { gap:15px; }
  .navigation>a:nth-child(2) { display:none; }
  .hero { gap:28px; }
  .hero h1 { font-size:calc(48px * var(--display-scale)); }
  .hero-description { font-size:.9375rem; }
  .hero-art figcaption { font-size:.625rem; }
  .artifact-label { font-size:.5625rem; letter-spacing:.8px; }
  .hero-lead { font-size:1.125rem; }
  .section { padding-block:76px; }
  .section-heading { gap:38px; }
  .vision { gap:35px; }
  h2 { font-size:calc(35px * var(--display-scale)); }
  .large-copy { font-size:1.1875rem; }
  .material-panel { gap:25px; }
  .material-main { gap:16px; }
  .material-examples { padding-left:22px; }
  .benefit-grid { gap:25px; }
  .benefit-grid h3 { font-size:calc(23px * var(--display-scale)); }
  .pathway-panel { gap:30px; padding-inline:26px; }
  .team-grid { gap:40px; }
  .contact-section h2 { font-size:calc(34px * var(--display-scale)); }
  .demo-grid { grid-template-columns:.85fr 1.2fr; }
  .scan-panel { padding-inline:20px; }
  .text-panel { padding-inline:22px; }
  .transcription p { font-size:1rem; }
  .site-footer { flex-wrap:wrap; }
}
@media(max-width:700px) {
  html { scroll-padding-top:84px; }
  .shell { width:calc(100% - 40px); }
  .header-inner { min-height:76px; }
  .brand>span { font-size:30px; }
  .brand small { font-size:.6875rem; }
  .menu-toggle { display:flex; }
  .navigation { display:none; position:absolute; top:76px; left:0; right:0; background:var(--paper); padding:14px 20px 24px; border-bottom:1px solid var(--line); box-shadow:0 12px 20px #15343d09; }
  .navigation.open { display:flex; flex-direction:column; gap:0; align-items:stretch; }
  .navigation>a,.navigation>a:nth-child(2) { display:flex; font-size:.9375rem; padding:14px 0; }
  .navigation .nav-cta { padding:12px 15px; margin-top:9px; justify-content:space-between; }
  .hero { grid-template-columns:1fr; gap:36px; padding-block:39px 36px; }
  .hero .eyebrow { font-size:.625rem; letter-spacing:1.2px; margin-bottom:23px; }
  .hero h1 { font-size:calc(clamp(43px,9.7vw,62px) * var(--display-scale)); letter-spacing:-1.8px; margin-bottom:22px; }
  .hero-lead { font-size:1.1875rem; }
  .hero-description { max-width:32.5rem; font-size:.9375rem; margin-top:17px; }
  .hero-actions { gap:14px 20px; margin-top:24px; }
  .hero-affiliation { font-size:.875rem; margin-top:27px; }
  .hero-art { max-width:460px; justify-self:center; }
  .artifact-frame { padding:20px 35px; }
  .artifact-label { font-size:.625rem; }
  .artifact-frame img { max-height:440px; }
  .artifact-bottom { font-size:.6875rem; }
  .hero-art figcaption { font-size:.625rem; }
  .scope-inner { display:block; padding-block:24px; }
  .scope-years { font-size:27px; }
  .scope-text { padding:16px 0 0; border:0; gap:15px; }
  .scope-text p { font-size:.9375rem; }
  .scope-text p>span { font-size:.75rem; }
  .section { padding-block:62px; }
  .eyebrow { font-size:.625rem; letter-spacing:1.4px; margin-bottom:19px; }
  h2 { font-size:calc(34px * var(--display-scale)); letter-spacing:-.9px; }
  h3 { font-size:calc(25px * var(--display-scale)); }
  .vision { grid-template-columns:1fr; gap:28px; }
  .vision-body>p:not(.large-copy) { font-size:1rem; }
  .large-copy { font-size:1.25rem; }
  .section-heading { grid-template-columns:1fr; gap:22px; margin-bottom:30px; }
  .section-heading>p { font-size:.9375rem; max-width:33.125rem; }
  .editorial-tabs[data-slot="tabs-list"] { flex-wrap:wrap; align-items:stretch; }
  .materials-tabs .editorial-tabs [data-slot="tabs-trigger"] { flex:1 1 50%; min-height:55px; padding:12px 8px; font-size:.9375rem; }
  .material-panel { grid-template-columns:1fr; gap:28px; padding-block:30px; min-height:0; }
  .folio { font-size:38px; }
  .material-main { gap:20px; }
  .material-main p { font-size:.9375rem; }
  .material-examples { border-left:0; padding-left:57px; }
  .material-examples ul { font-size:.875rem; }
  .material-examples>p { font-size:.9375rem; }
  .collection-note { align-items:flex-start; gap:14px; }
  .collection-note>svg { margin-top:4px; }
  .collection-note p { font-size:.8125rem; }
  .demo-grid { grid-template-columns:1fr; }
  .scan-panel { padding:20px; }
  .scan-panel>a { max-width:290px; }
  .scan-panel figcaption { font-size:.6875rem; }
  .text-panel { padding:22px 20px; }
  .transcription p { font-size:1.0625rem; }
  .search-status { min-height:38px; }
  .benefits .section { padding-block:62px; }
  .benefit-grid { grid-template-columns:1fr; gap:28px; margin-top:35px; }
  .benefit-grid article { padding-top:24px; }
  .benefit-grid article>svg { margin-bottom:14px; }
  .benefit-grid h3 { font-size:calc(27px * var(--display-scale)); margin-bottom:11px; }
  .benefit-grid p { font-size:.9375rem; max-width:30.625rem; }
  .pathway-tabs .editorial-tabs [data-slot="tabs-trigger"] { flex:1 1 100%; justify-content:space-between; min-height:50px; padding-inline:12px; font-size:1rem; }
  .pathway-tabs .editorial-tabs [data-slot="tabs-trigger"][data-state="active"] { box-shadow:inset 3px 0 0 var(--ink); background:#edf0e9; }
  .pathway-panel { grid-template-columns:1fr; gap:27px; padding:26px 21px 22px; }
  .pathway-intro h3 { font-size:calc(26px * var(--display-scale)); }
  .pathway-steps { margin-top:0; }
  .pathway-steps li { gap:16px; }
  .pathway-note { font-size:.75rem; }
  .collaborate-bottom { flex-direction:column; align-items:flex-start; gap:22px; }
  .team-grid { grid-template-columns:1fr; gap:33px; }
  .person { padding-top:22px; }
  .person h3 { font-size:calc(29px * var(--display-scale)); }
  .student-band { grid-template-columns:1fr; gap:12px; margin-top:32px; }
  .student-band p { font-size:.9375rem; }
  .faq-section { grid-template-columns:1fr; gap:22px; }
  .faq-aside { max-width:none; margin-top:17px; }
  .faq-list [data-slot="accordion-trigger"] { font-size:.9375rem; padding-block:20px; }
  .faq-list [data-slot="accordion-content"] { font-size:.875rem; }
  .contact-inner { grid-template-columns:1fr; gap:30px; padding-block:59px; }
  .contact-section h2 { font-size:calc(32px * var(--display-scale)); }
  .contact-section p:not(.eyebrow) { font-size:.9375rem; }
  .contact-details { justify-self:start; }
  .email-link { font-size:1.375rem; }
  .site-footer { gap:25px; padding-block:30px; }
  .site-footer>p { order:3; flex:1 1 100%; padding-top:17px; border-top:1px solid var(--line); }
  .back-top { margin-left:auto; }
  .desktop-break { display:none; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; animation-iteration-count:1!important; }
}


/* Team portraits (a photo, or initials until one is supplied) and the student grid. */
.avatar { display:grid; place-items:center; width:104px; height:104px; margin-bottom:24px; border-radius:50%; overflow:hidden; background:#e5e6dc; border:1px solid #cdd3c6; color:#7b8a7c; font-size:32px; letter-spacing:.5px; line-height:1; }
.avatar img { width:100%; height:100%; object-fit:cover; }
.avatar svg { stroke-width:1.3; }
.student-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:34px 28px; margin:38px 0 0; padding:0; list-style:none; }
.student .avatar { width:84px; height:84px; margin-bottom:18px; font-size:26px; }
.student h4 { font-size:1.125rem; font-weight:400; line-height:1.35; }
.student-status { display:block; margin-top:4px; font-size:.8125rem; line-height:1.5; color:#687363; text-wrap:balance; }
.student-status+.student-status { margin-top:2px; color:#8b968a; }
.student p { margin-top:10px; font-size:.875rem; line-height:1.6; }
.student .text-link { font-size:.75rem; }
.student[data-placeholder] .avatar { border-style:dashed; background:transparent; }
.student[data-placeholder] h4,.student[data-placeholder] p,.student[data-placeholder] .student-status { color:#93a093; }
@media(max-width:1100px) { .student-grid { grid-template-columns:repeat(3,1fr); } }
@media(max-width:700px) {
  .avatar { width:88px; height:88px; margin-bottom:18px; font-size:27px; }
  .student-grid { grid-template-columns:1fr; gap:26px; margin-top:28px; }
  .student { display:grid; grid-template-columns:72px 1fr; column-gap:18px; align-items:start; }
  .student .avatar { width:72px; height:72px; margin:0; grid-row:1 / span 4; font-size:22px; }
  .student h4,.student .student-status,.student p,.student .text-link { grid-column:2; }
  .student .text-link { justify-self:start; }
}

/* Links inside running text. */
.inline-link { text-decoration:underline; text-underline-offset:3px; text-decoration-color:#aebbab; }
.inline-link:hover { text-decoration-color:var(--ink); }

/* Small tracked-capital labels keep the sans (see the note on --font-label). */
.eyebrow,.artifact-label,.panel-top,.demo-note>span,.person-field,.student-label { font-family:var(--font-label); }

/* The serif needs a little more size than the sans did at the very smallest settings (were 10–11px). */
.hero-art figcaption,.artifact-bottom { font-size:.75rem; }
@media(max-width:900px) { .hero-art figcaption { font-size:.75rem; } }
@media(max-width:700px) { .hero-art figcaption,.artifact-bottom,.scan-panel figcaption { font-size:.75rem; } }

/* Forced "desktop" line breaks only help where the column is wide enough for the wider face. */
@media(max-width:1100px) { .person .desktop-break { display:none; } }
@media(max-width:900px) { .desktop-break { display:none; } }

/* Buttons never fold onto two lines; nor do slash pairs such as «φοιτητές/φοιτήτριες»
   (browsers may otherwise break a line right after the slash). */
.button,.nav-cta,.nowrap { white-space:nowrap; }

/* When a title or tab label has to wrap, split it into even lines instead of leaving a single word behind;
   paragraphs avoid one-word last lines. (Ignored by browsers that do not support it.) */
h1,h2,h3,[data-slot="tabs-trigger"],[data-slot="accordion-trigger"] { text-wrap:balance; }
p,li { text-wrap:pretty; }

/* ------------------------------------------------------------------
 * Progressive enhancement and small fixes (not in the original build)
 * ------------------------------------------------------------------ */

/* The inline icon sprite must not take up space (kept out of a style attribute so a strict CSP can be used). */
.icon-sprite { position:absolute; width:0; height:0; overflow:hidden; }

/* Closed FAQ answers stay in the HTML (searchable, printable) but are not shown. */
[data-slot="accordion-content"][data-state="closed"] { display:none; }

/* Where the browser supports hidden="until-found", main.js upgrades inactive tab panels
   and closed answers so that find-in-page (Ctrl/Cmd+F) can reveal them. */
.material-panel[hidden="until-found"],.pathway-panel[hidden="until-found"] { display:block; min-height:0; padding:0; background:none; }
[data-slot="accordion-content"][hidden="until-found"] { display:block; }

/* Keyboard users can see which tab panel has focus. */
[data-slot="tabs-content"]:focus-visible { outline:2px solid #8a672f; outline-offset:5px; }

/* Print: show everything, drop the chrome. */
@media print {
  .site-header,.skip-link,.menu-toggle,.back-top,.search-controls,.hero-actions { display:none !important; }
  .material-panel[data-state="inactive"],.pathway-panel[data-state="inactive"] { display:grid; }
  [data-slot="accordion-content"][data-state="closed"] { display:block; }
  .editorial-tabs[data-slot="tabs-list"] { display:none; }
  .section { padding-block:36px; }
}