/* ==========================================================================
   SAPERE AUDE GREECE — SITE STYLES
   ==========================================================================

   AESTHETIC CONTRACT (read before changing anything)
   --------------------------------------------------
   WORLD:      The Solar Agora at night — a floating island with an Acropolis,
               lit by torches under a lime moon (see assets/world/).
   DIRECTION:  taken from the crest, not copied from it: night navy panels,
               lavender marble, black ink, and the lime disc behind the shield.
               The mood is a torch-lit assembly the night before an action —
               serious, a little dramatic, never childish.
   SIGNATURE:  the 3D island and its camera flight. The pages around it are
               the same night, quieter: navy grounds, lavender text, lime only
               where something can be pressed or is worth noticing.
   PALETTE:    night #0A1235 · deep night #060B24 · lavender #E4E7F6 ·
               moon lime #DCF36A · ember coral #FF8F75 (deadlines only)
   TYPE:       Noto Serif Display, condensed (headlines — carved, classical) /
               Sofia Sans Extra Condensed (labels, buttons — set in spaced
               capitals) / Geologica (reading text). GFS Didot is used for one
               thing only: the polytonic motto τόλμησον φρονεῖν.
               All self-hosted with Greek subsets (assets/fonts).
   RADIUS:     14px for cards and panels, 999px for pills. Nothing else.
   MOTION:     verb "soar" · ease cubic-bezier(.22,.9,.24,1) · 200 / 600 /
               1100 ms. Nothing loops on its own outside the island.
   SURPRISE:   lives in the island only (moon, wild key, greeting).
   QUIET:      hairlines over shadows; one shadow on floating world panels.

   CONTRAST (WCAG, measured on --parch #0A1235 and --ink #060B24)
     --txt 15.9 · --txt-2 10.6 · --txt-3 6.6 · --gold (lime) 14.6 ·
     --red (coral) 7.6 · navy text on lime 14.6
   ========================================================================== */

@import url("fonts.css");

:root{
  color-scheme:dark;
  /* ground: the night */
  --parch:#0A1235;        /* the page */
  --parch-2:#0D1741;      /* tinted sections */
  --parch-3:#17235C;      /* hover, empty images */
  --card:#101B4B;         /* cards on the page */
  --ink:#060B24;          /* deep night — bands, footer */
  --ink-2:#081030;
  --ink-3:#04081A;

  /* text: lavender marble */
  --txt:#E9EBFA;
  --txt-2:#C2C8EA;
  --txt-3:#9AA3D2;
  --on-ink:#F1F4FF;
  --on-ink-2:rgba(241,244,255,.8);
  --on-ink-3:rgba(241,244,255,.64);

  /* the moon: lime. On the night it is readable as text too. */
  --gold:#DCF36A;
  --gold-ink:#DCF36A;
  --gold-lit:#E4F78A;
  --red:#FF8F75;          /* deadlines and urgency only */
  --red-lit:#FF8F75;
  --sage:#9BE3A8;
  --sky:#8FA8FF;          /* decorative only */
  --marble:#E4E7F6;

  /* lines */
  --hair:rgba(228,231,246,.18);
  --hair-2:rgba(228,231,246,.09);
  --hair-ink:rgba(241,244,255,.16);

  /* type */
  --display:"Noto Serif Display","GFS Didot",Georgia,"Times New Roman",serif;
  --body:"Geologica",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"Sofia Sans Extra Condensed","Arial Narrow",system-ui,sans-serif;
  --motto:"GFS Didot","Noto Serif","Times New Roman",serif;
  --stretch:84%;

  /* shape */
  --r:14px;
  --r-pill:999px;

  /* motion: "soar" */
  --out:cubic-bezier(.22,.9,.24,1);
  --inout:cubic-bezier(.77,0,.175,1);
  --drawer:cubic-bezier(.32,.72,0,1);
  --t-fast:200ms; --t-base:600ms; --t-slow:1100ms;

  --pad:clamp(1rem,5vw,4rem);
  --maxw:1200px;
  --head:72px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--head) + 1rem)}
body{
  margin:0;background:var(--parch);color:var(--txt);
  font-family:var(--body);font-size:clamp(1rem,.25vw + .95rem,1.0625rem);line-height:1.65;font-weight:400;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
::selection{background:var(--gold);color:var(--ink-2)}

.skip{position:absolute;left:-9999px;top:0;z-index:99;background:var(--ink);color:var(--on-ink);padding:.7rem 1.1rem;font-family:var(--mono);font-weight:700;font-size:1rem;border-radius:0 0 var(--r) 0}
.skip:focus{left:0}
:focus-visible{outline:3px solid var(--gold-ink);outline-offset:3px;border-radius:6px}
.sec.dark :focus-visible,.hero :focus-visible,.banner :focus-visible,.foot :focus-visible,.drawer :focus-visible{outline-color:var(--gold)}

/* ------------------------------------------------------------ typography */
h1,h2,h3,h4{margin:0;font-family:var(--display);font-stretch:var(--stretch);font-weight:600;line-height:1.02;letter-spacing:-.01em;text-wrap:balance}
p{margin:0}
.h1{font-size:clamp(3rem,9vw,7rem);line-height:.92}
.h2{font-size:clamp(2.1rem,4.6vw,3.6rem);line-height:1}
.h3{font-size:clamp(1.45rem,2.2vw,1.9rem)}
.motto{font-family:var(--motto);font-style:normal;letter-spacing:.01em}

/* the "sticker" label — does the job an all-caps eyebrow would, in the voice of a protest sticker */
.eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;align-self:flex-start;
  font-family:var(--mono);font-size:.95rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;line-height:1;
  color:var(--gold);background:transparent;padding:.42rem .8rem .44rem .75rem;border:1px solid color-mix(in srgb,var(--gold) 55%,transparent);border-radius:var(--r-pill);margin:0;
}
.eyebrow.gold{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.foot .eyebrow,.foot .eyebrow.gold{border:0;padding:0;background:transparent;color:var(--gold)}

.lead{font-size:clamp(1.05rem,.6vw + .92rem,1.28rem);line-height:1.55;color:var(--txt-2);max-width:56ch}

/* ------------------------------------------------------------ layout */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}
.sec{padding-block:clamp(3.5rem,7vw,6.5rem);position:relative}
.sec.tint{background:var(--parch-2)}
.sec.dark{background:var(--ink);color:var(--on-ink)}
.stars{background-image:radial-gradient(1px 1px at 12% 22%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 68% 14%,rgba(255,255,255,.35),transparent),radial-gradient(1.5px 1.5px at 84% 62%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 32% 78%,rgba(255,255,255,.3),transparent),radial-gradient(1px 1px at 52% 40%,rgba(255,255,255,.25),transparent);background-size:340px 300px}
.sec.dark .lead{color:var(--on-ink-2)}
.sec + .sec:not(.tint):not(.dark){border-top:1px solid var(--hair-2)}

.sec-head{
  display:flex;flex-wrap:wrap;gap:1rem 2.5rem;align-items:flex-end;justify-content:space-between;
  padding-bottom:1.2rem;border-bottom:1px solid var(--hair);margin-bottom:clamp(1.75rem,3.5vw,2.75rem);
}
.sec.dark .sec-head{border-bottom-color:var(--hair-ink)}
.sec-head-txt{max-width:60ch;display:flex;flex-direction:column;gap:.7rem}

.rule{display:flex;align-items:center;gap:.75rem;margin-block:clamp(2rem,4vw,3rem)}
.rule span{flex:1;height:1px;background:var(--hair)}
.rule i{width:10px;height:10px;border-radius:50%;background:var(--gold)}

/* ------------------------------------------------------------ links & buttons */
.lnk{
  font-family:var(--mono);font-size:1.0625rem;font-weight:700;letter-spacing:.01em;
  color:var(--gold-ink);display:inline-flex;align-items:center;gap:.45rem;white-space:nowrap;
  padding-bottom:2px;position:relative;
}
.lnk::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:currentColor;opacity:.35;transition:opacity var(--t-fast) ease}
@media (hover:hover) and (pointer:fine){.lnk:hover::after{opacity:1}}
.sec.dark .lnk,.banner .lnk{color:var(--gold-lit)}
.lnk span{transition:transform 260ms var(--out)}
@media (hover:hover) and (pointer:fine){.lnk:hover span{transform:translateX(4px)}}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;cursor:pointer;
  border:2px solid var(--txt);background:var(--txt);color:var(--parch);border-radius:var(--r-pill);
  font-family:var(--mono);font-size:1.05rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;line-height:1;
  padding:.8rem 1.35rem .85rem;min-height:48px;
  transition:transform 140ms var(--out),background-color 160ms ease,color 160ms ease,border-color 160ms ease;
}
.btn:active{transform:scale(.97)}
.btn-gold{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.btn-line{background:transparent;color:var(--txt);border-color:var(--hair)}
.banner .btn-line,.sec.dark .btn-line,.hero .btn-line,.st-approach .btn-line,.st-assembly .btn-line{color:var(--on-ink);border-color:rgba(241,244,255,.4)}
@media (hover:hover) and (pointer:fine){
  .btn-gold:hover{background:#EBFB9C;border-color:#EBFB9C;box-shadow:0 0 0 6px rgba(220,243,106,.14)}
  .btn-line:hover{border-color:currentColor}
  .btn:not(.btn-gold):not(.btn-line):hover{background:#fff;border-color:#fff}
}

/* ------------------------------------------------------------ header */
.head{
  position:sticky;top:0;z-index:40;background:var(--parch);
  border-bottom:1px solid transparent;
  transition:border-color 200ms ease,background-color 200ms ease;
}
.head.stuck{border-bottom-color:var(--hair);background:color-mix(in srgb,var(--parch) 90%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.head-in{max-width:var(--maxw);margin-inline:auto;padding:.55rem var(--pad);min-height:var(--head);display:flex;align-items:center;gap:1.25rem}
.brand{display:flex;align-items:center;gap:.6rem;flex:0 0 auto;min-width:0}
.brand-crest{width:74px;height:auto;transition:transform 320ms var(--out)}
@media (hover:hover) and (pointer:fine){.brand:hover .brand-crest{transform:scale(1.05)}}
.brand-txt{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.brand-name{font-family:var(--display);font-stretch:var(--stretch);font-size:1.3rem;font-weight:600;line-height:1}
.brand-motto{font-family:var(--motto);font-size:.9rem;color:var(--gold);white-space:nowrap;line-height:1.1}
@media (max-width:420px){.brand-crest{width:54px}.brand-name{font-size:1.1rem}.brand-motto{display:none}.head-in{gap:.5rem}.head-end{gap:.3rem}.lang,.viewtog{padding:.45rem .6rem}}

.nav{display:none;gap:1.35rem;margin-inline:auto}
@media (min-width:1120px){.nav{display:flex}}
.nav a{
  position:relative;font-family:var(--mono);font-size:1rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--txt-2);padding-block:.3rem;
  transition:color 160ms ease;
}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;border-radius:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform 240ms var(--out)}
.nav a:hover{color:var(--txt)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1)}
.nav a[aria-current="page"]{color:var(--txt)}
.ct{font-family:var(--body);font-size:.625rem;font-weight:700;color:var(--ink);background:var(--red);padding:.1rem .35rem;margin-left:.3rem;vertical-align:super;border-radius:var(--r-pill)}

.head-end{display:flex;align-items:center;gap:.45rem;margin-left:auto}
@media (min-width:1120px){.head-end{margin-left:0}}
.lang,.viewtog{
  font-family:var(--mono);font-size:1rem;font-weight:700;line-height:1;
  padding:.5rem .8rem .55rem;border:2px solid var(--hair);color:var(--txt-2);border-radius:var(--r-pill);background:transparent;cursor:pointer;
  min-height:40px;display:inline-flex;align-items:center;gap:.4rem;
  transition:background-color 160ms ease,color 160ms ease,border-color 160ms ease;
}
.viewtog[hidden]{display:none}
@media (hover:hover) and (pointer:fine){.lang:hover,.viewtog:hover{background:var(--txt);border-color:var(--txt);color:var(--ink)}}
@media (max-width:560px){.viewtog .vt-label{display:none}}
.viewtog svg{width:18px;height:18px}

.burger{width:44px;height:44px;display:grid;place-content:center;gap:6px;background:none;border:0;padding:0;cursor:pointer}
@media (min-width:1120px){.burger{display:none}}
.burger span{display:block;width:22px;height:2px;border-radius:2px;background:var(--txt);transition:transform 240ms var(--out),opacity 160ms ease}
.burger[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}

.drawer{
  position:fixed;inset:var(--head) 0 0;z-index:39;background:var(--ink);color:var(--on-ink);
  display:flex;flex-direction:column;justify-content:center;gap:.25rem;padding:2rem var(--pad) 4rem;
  transform:translateY(-8px);opacity:0;transition:transform 200ms var(--out),opacity 140ms ease;
}
.drawer[hidden]{display:none}
.drawer.in{transform:none;opacity:1;transition:transform 320ms var(--drawer),opacity 200ms ease}
.drawer nav{display:flex;flex-direction:column}
.drawer nav a{font-family:var(--display);font-stretch:var(--stretch);font-size:clamp(2rem,8vw,2.8rem);font-weight:600;padding-block:.28em;border-bottom:1px solid var(--hair-ink);opacity:0;transform:translateY(10px)}
.drawer.in nav a{animation:drawerIn 380ms var(--out) forwards;animation-delay:calc(var(--i) * 45ms)}
@keyframes drawerIn{to{opacity:1;transform:none}}
.drawer-lang{margin-top:1.75rem;font-family:var(--mono);font-size:1.25rem;font-weight:700;color:var(--gold-lit)}
body.locked{overflow:hidden}

/* ------------------------------------------------------------ banner (inner pages): navy sky, the sun disc, the island */
.banner{
  position:relative;overflow:hidden;background:radial-gradient(120% 90% at 75% 40%,#16246A 0,#0B1440 45%,var(--ink) 100%);color:var(--on-ink);
  padding-block:clamp(2.5rem,5vw,4rem) clamp(2.75rem,5vw,4.25rem);isolation:isolate;
}
.banner::before{ /* the lime moon */
  content:"";position:absolute;z-index:-2;width:min(34vw,440px);aspect-ratio:1;border-radius:50%;
  right:max(1rem,calc((100vw - var(--maxw)) / 2 + 2rem));top:46%;translate:0 -50%;
  background:radial-gradient(circle at 42% 38%,#F1FBC4 0,var(--gold) 55%,#BCD24E 99%,transparent 100%);box-shadow:0 0 120px 30px rgba(220,243,106,.18);
}
.banner-art{position:absolute;z-index:-1;right:max(-2rem,calc((100vw - var(--maxw)) / 2 - 4rem));top:52%;translate:0 -50%;width:min(46vw,620px);pointer-events:none;user-select:none}
.banner .wrap > *{max-width:min(100%,38rem)}
@media (max-width:1000px){.banner::before{width:36vw;right:-6vw}.banner-art{width:50vw;right:-12vw}.banner .wrap > *{max-width:54vw}}
@media (max-width:760px){.banner::before{width:52vw;right:-18vw;top:18%;opacity:.28}.banner-art{display:none}.banner .wrap > *{max-width:100%}}
.banner .wrap{position:relative}
.crumbs{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;font-family:var(--mono);font-size:1rem;font-weight:700;color:var(--on-ink-3);margin-bottom:1.25rem}
.crumbs a{transition:color 160ms ease}
.crumbs a:hover{color:var(--gold-lit)}
.crumbs i{font-style:normal;opacity:.5}
.banner-h{margin-top:.9rem;font-size:clamp(2.6rem,7vw,5rem);color:#fff;max-width:18ch}
.banner-lead{margin-top:1.1rem;font-size:clamp(1.02rem,.5vw + .92rem,1.22rem);line-height:1.55;color:var(--on-ink-2);max-width:54ch}
.banner-meta{margin-top:1.1rem;font-family:var(--mono);font-size:1.125rem;font-weight:700;color:var(--gold-lit)}
.banner-plate{display:inline-block;max-width:100%;background:rgba(6,11,36,.72);padding:.25rem .6rem;border-radius:12px;margin-left:-.6rem}

.tabs{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.85rem}
.tabs a{
  font-family:var(--mono);font-size:1.0625rem;font-weight:700;padding:.5rem 1rem .55rem;border:2px solid var(--hair-ink);border-radius:var(--r-pill);color:var(--on-ink-2);background:rgba(10,21,64,.6);
  transition:color 160ms ease,border-color 160ms ease,background-color 160ms ease;
}
.tabs a:hover{color:var(--on-ink);border-color:var(--on-ink-3)}
.tabs a.on{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.tabs a{letter-spacing:.08em;text-transform:uppercase;font-size:.95rem}

/* ------------------------------------------------------------ cards */
.grid{display:grid;gap:1.25rem}
@media (min-width:640px){.grid.c2{grid-template-columns:repeat(2,1fr)}}
@media (min-width:900px){.grid.c3{grid-template-columns:repeat(3,1fr)}}
@media (min-width:640px) and (max-width:899px){.grid.c3{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.grid.c4{grid-template-columns:repeat(4,1fr)}}
@media (min-width:600px) and (max-width:999px){.grid.c4{grid-template-columns:repeat(2,1fr)}}

.card{
  position:relative;background:var(--card);padding:1rem 1rem 1.3rem;border:1px solid var(--hair);border-radius:var(--r);
  display:flex;flex-direction:column;gap:.85rem;isolation:isolate;overflow:hidden;
  transition:border-color 200ms ease,background-color 200ms ease;
}
.card-hit{position:absolute;inset:0;z-index:3;border-radius:var(--r)}
@media (hover:hover) and (pointer:fine){
  .card:hover{border-color:var(--txt)}
  .card:hover .card-img img{transform:scale(1.035)}
  .card:hover .card-h{background-size:100% 3px}
}
.card-top{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;justify-content:space-between;min-height:1.6rem}
.card-img{overflow:hidden;background:var(--parch-3);aspect-ratio:16/10;border-radius:12px}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform 620ms var(--out)}
/* no photo yet: a view of the island instead of an empty box */
.card-img-none{display:block;position:relative;background:radial-gradient(90% 90% at 70% 20%,#1C2C78 0,#0B1440 60%,#060B24 100%)}
.card-img-none img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card-img-none[data-h="1"]{background:radial-gradient(90% 90% at 25% 15%,#26347E 0,#0D1848 60%,#060B24 100%)}
.card-img-none[data-h="2"]{background:radial-gradient(90% 90% at 50% 0,#2A3A8C 0,#0B1440 60%,#060B24 100%)}
.ghost-glyph{width:40%;max-width:96px;height:auto;color:rgba(228,231,246,.28);position:absolute;inset:0;margin:auto}
.card-body{display:flex;flex-direction:column;gap:.45rem}
.card-h{
  font-family:var(--display);font-stretch:var(--stretch);font-size:1.55rem;line-height:1.05;font-weight:600;line-height:1;
  background:linear-gradient(var(--gold),var(--gold)) left 100%/0 3px no-repeat;padding-bottom:3px;
  transition:background-size 300ms var(--out);
}
.card-place{font-size:.875rem;color:var(--txt-3)}
.card-when{font-family:var(--mono);font-size:1rem;font-weight:700;color:var(--txt-3)}
.card-sum{font-size:.9375rem;line-height:1.5;color:var(--txt-2)}
.card-read{font-family:var(--mono);font-size:1rem;font-weight:700;color:var(--txt-3);margin-top:.1rem}
.card-left{font-family:var(--mono);font-size:1.0625rem;font-weight:800;color:var(--red)}
.card.is-closed{opacity:.66}
.card.is-closed:hover{opacity:.86}
.card.is-closed .card-img img{filter:grayscale(1)}

.pill{font-family:var(--mono);font-size:.9375rem;font-weight:800;line-height:1;padding:.3rem .65rem .34rem;border-radius:var(--r-pill)}
.pill-open{background:var(--gold);color:var(--ink)}
.pill-closed{background:transparent;color:var(--txt-3);border:1px solid var(--hair)}
.tag{font-family:var(--mono);font-size:.9375rem;font-weight:700;line-height:1;color:var(--txt-2);border:1px solid var(--hair);padding:.3rem .6rem .34rem;border-radius:var(--r-pill)}

/* the deadline stamp — the one place poppy is allowed */
.stamp{font-family:var(--mono);font-size:.9375rem;font-weight:700;line-height:1;color:var(--red);border:2px solid currentColor;padding:.25rem .55rem .3rem;border-radius:var(--r-pill);white-space:nowrap}
.stamp b{font-weight:800}
.stamp-off{color:var(--txt-3)}

.empty{display:flex;flex-direction:column;align-items:center;gap:.9rem;text-align:center;padding:clamp(2.5rem,6vw,4.5rem) 1.5rem;border:2px dashed var(--hair);border-radius:var(--r)}
.empty-glyph{width:48px;height:48px;color:var(--gold-ink)}
.empty p{max-width:46ch;color:var(--txt-2)}

/* ------------------------------------------------------------ value panels (the four themes) */
.quarters{display:grid;gap:1rem}
@media (min-width:560px){.quarters{grid-template-columns:1fr 1fr}}
.q{background:var(--card);border:1px solid var(--hair);border-radius:var(--r);padding:clamp(1.2rem,2.4vw,1.75rem);display:flex;flex-direction:column;gap:.6rem}
.quarters-dark .q{background:var(--ink-2);border-color:var(--hair-ink)}
.quarters-dark .q h3{color:#fff}
.quarters-dark .q p{color:var(--on-ink-2)}
.quarters-dark .q-word{color:var(--gold-lit)}
.quarters-dark .glyph{color:var(--gold-lit)}
.sec.tint .q{background:var(--card)}
.q-top{display:flex;align-items:center;gap:.6rem}
.q .glyph{width:28px;height:28px;color:var(--gold-ink);flex:0 0 auto}
.q-word{font-family:var(--mono);font-size:1.0625rem;font-weight:700;color:var(--txt-3)}
.q h3{font-family:var(--display);font-stretch:var(--stretch);font-size:1.75rem;font-weight:600}
.q p{font-size:.9375rem;color:var(--txt-2);line-height:1.55}

/* ------------------------------------------------------------ programmes (accordion) */
.progs{border-top:1px solid var(--hair)}
.prog{border-bottom:1px solid var(--hair)}
.prog-btn{width:100%;background:none;border:0;padding:1.2rem 0;cursor:pointer;text-align:left;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem 1.25rem;list-style:none}
.prog-btn::-webkit-details-marker{display:none}
.prog-code{font-family:var(--mono);font-size:.95rem;font-weight:800;letter-spacing:.08em;color:var(--ink);background:var(--gold);padding:.25rem .55rem .3rem;border-radius:var(--r-pill);line-height:1}
.prog-title{font-family:var(--display);font-stretch:var(--stretch);font-size:clamp(1.6rem,2.8vw,2.2rem);font-weight:600;line-height:1;transition:color 160ms ease}
.prog-sign{position:relative;width:16px;height:16px;flex:0 0 auto}
.prog-sign::before,.prog-sign::after{content:"";position:absolute;background:var(--txt-2);border-radius:2px;transition:transform 240ms var(--out),opacity 200ms ease}
.prog-sign::before{left:0;right:0;top:7px;height:2px}
.prog-sign::after{top:0;bottom:0;left:7px;width:2px}
.prog[open] .prog-sign::after{transform:rotate(90deg);opacity:0}
@media (hover:hover) and (pointer:fine){.prog-btn:hover .prog-title{color:var(--gold-ink)}}
.prog-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows 260ms var(--out)}
.prog[open] .prog-body{grid-template-rows:1fr}
.prog-body > div{overflow:hidden}
.prog-body p{max-width:62ch;color:var(--txt-2);padding-bottom:1.4rem;padding-left:clamp(0px,5vw,5.1rem);opacity:0;transition:opacity 200ms ease 60ms}
.prog[open] .prog-body p{opacity:1}

/* ------------------------------------------------------------ about / story */
.two{display:grid;gap:clamp(2rem,5vw,4.5rem)}
@media (min-width:900px){.two{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:start}}
@media (min-width:1080px){.two > .two-side{position:sticky;top:calc(var(--head) + 2rem)}}
.prose-lead{font-family:var(--display);font-stretch:var(--stretch);font-size:clamp(1.7rem,2.8vw,2.3rem);font-weight:560;line-height:1.05;margin-bottom:1.4rem}
.sec.dark .prose-lead{color:#fff}

.years{display:flex;flex-direction:column}
.year{display:grid;grid-template-columns:4.5rem 1fr;gap:1.25rem;padding:1.1rem 0;border-top:1px solid var(--hair)}
.year:last-child{border-bottom:1px solid var(--hair)}
.year b{font-family:var(--display);font-stretch:var(--stretch);font-size:1.6rem;font-weight:600;line-height:1;color:var(--gold-ink)}
.year p{color:var(--txt-2);font-size:.9375rem}

.team{display:grid;gap:1.25rem}
@media (min-width:640px){.team{grid-template-columns:repeat(auto-fit,minmax(16rem,1fr))}}
.member{background:var(--card);border:1px solid var(--hair);border-radius:var(--r);padding:clamp(1.2rem,2.4vw,1.75rem);display:flex;flex-direction:column;gap:.65rem}
.member-ph{width:76px;height:76px;border-radius:50%;object-fit:cover;background:var(--parch-3)}
.member-ph-none{width:76px;height:76px;border-radius:50%;background:var(--ink);color:var(--gold-lit);display:grid;place-items:center;font-family:var(--display);font-stretch:var(--stretch);font-size:1.6rem;font-weight:600}
.member-slot .member-ph-none{background:transparent;border:2px dashed var(--hair);color:var(--txt-3)}
.member h3{font-family:var(--display);font-stretch:var(--stretch);font-size:1.7rem;font-weight:600}
.member-role{font-family:var(--mono);font-size:1.0625rem;font-weight:700;color:var(--gold-ink)}
.member p{font-size:.9375rem;color:var(--txt-2);line-height:1.5}
.member-slot h3{color:var(--txt-3)}
.team-note{margin-top:1.25rem;font-size:.875rem;color:var(--txt-3)}

/* ------------------------------------------------------------ detail pages */
.detail{display:grid;gap:clamp(2rem,4vw,3.5rem)}
@media (min-width:960px){.detail{grid-template-columns:minmax(0,1fr) 18rem;align-items:start}}
.detail-cover{overflow:hidden;margin:0 0 clamp(1.75rem,3vw,2.5rem);background:var(--parch-3);border-radius:var(--r)}
.detail-cover img{width:100%;aspect-ratio:16/9;object-fit:cover}

.prose{max-width:66ch;font-size:1.0625rem;line-height:1.72}
.prose > * + *{margin-top:1.05em}
.prose h3{font-family:var(--display);font-stretch:var(--stretch);font-size:clamp(1.8rem,3vw,2.3rem);font-weight:600;margin-top:1.8em}
.prose h4{font-family:var(--display);font-stretch:var(--stretch);font-size:1.55rem;font-weight:600;margin-top:1.6em}
.prose h3:first-child,.prose h4:first-child{margin-top:0}
.prose a{color:var(--txt);background:linear-gradient(var(--gold),var(--gold)) left 100%/100% 3px no-repeat;padding-bottom:1px;transition:background-size 200ms ease}
.prose a:hover{background-size:100% 100%;color:var(--ink)}
.prose strong{font-weight:600}
.prose ul,.prose ol{padding-left:1.35em;margin-top:1.05em}
.prose li + li{margin-top:.45em}
.prose ul{list-style:none;padding-left:0}
.prose ul li{position:relative;padding-left:1.5em}
.prose ul li::before{content:"";position:absolute;left:.25em;top:.6em;width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 2px var(--gold-ink) inset}
.prose blockquote{margin-block:1.8em;padding:1rem 1.25rem;border-left:3px solid var(--gold);background:var(--card);border-radius:0 var(--r) var(--r) 0;font-family:var(--display);font-stretch:var(--stretch);font-size:1.6rem;font-weight:560;line-height:1.1;color:var(--txt)}
.prose code{font-size:.875em;background:var(--parch-2);padding:.1em .35em;border-radius:6px}
.prose .md-figure{margin-block:2em}
.prose .md-figure img{border-radius:var(--r)}
.prose .md-hr{border:0;height:0;width:80px;border-top:2px solid var(--hair);margin:2.5em 0}
.prose img{width:100%}
.sec.dark .prose a{color:#fff}

.facts{border-top:4px solid var(--gold);padding-top:1.1rem;display:flex;flex-direction:column;gap:1.1rem}
@media (min-width:960px){.facts{position:sticky;top:calc(var(--head) + 1.5rem)}}
.fact{display:flex;flex-direction:column;gap:.2rem}
.fact dt{font-family:var(--mono);font-size:1rem;font-weight:700;color:var(--txt-3)}
.fact dd{margin:0;font-size:.9375rem;font-weight:500}
.facts ul{margin:0;padding-left:1.1em;font-size:.9375rem;color:var(--txt-2)}
.facts ul li + li{margin-top:.3em}
.chips{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.15rem}
.reslist{display:flex;flex-direction:column;gap:.4rem;margin-top:.2rem}
.reslist a{font-size:.875rem;color:var(--txt);display:flex;gap:.5rem;padding:.55rem .75rem;border:1px solid var(--hair);border-radius:12px;background:var(--card);transition:border-color 160ms ease,transform 200ms var(--out)}
.reslist a:hover{border-color:var(--txt);transform:translateX(3px)}

.deadline-box{border:2px solid var(--red);border-radius:var(--r);padding:1.1rem 1.15rem;display:flex;flex-direction:column;gap:.35rem;margin:0}
.deadline-box.off{border-color:var(--hair)}
.deadline-box dt{font-family:var(--mono);font-size:1.0625rem;font-weight:800;color:var(--red)}
.deadline-box.off dt{color:var(--txt-3)}
.deadline-box dd{margin:0;font-family:var(--display);font-stretch:var(--stretch);font-size:2.2rem;font-weight:600;line-height:1}
.deadline-box small{font-family:var(--mono);font-size:1rem;font-weight:700;color:var(--red)}
.deadline-box.off small{color:var(--txt-3)}

.gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.5rem;margin-top:1.1rem}
.gal a{overflow:hidden;background:var(--parch-3);display:block;border-radius:12px}
.gal img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform 500ms var(--out)}
@media (hover:hover) and (pointer:fine){.gal a:hover img{transform:scale(1.05)}}

.detail-foot{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin-top:clamp(2rem,4vw,3rem);padding-top:1.35rem;border-top:1px solid var(--hair)}
.share{cursor:pointer;background:none;border:2px solid var(--hair);border-radius:var(--r-pill);font-family:var(--mono);font-size:1.0625rem;font-weight:700;padding:.6rem 1.1rem;min-height:48px;transition:transform 140ms var(--out),border-color 160ms ease}
.share:active{transform:scale(.97)}
.share:hover{border-color:var(--txt)}

.prog-bar{position:fixed;left:0;top:0;height:4px;background:var(--gold);width:0;z-index:50;transform-origin:left}

.lb{position:fixed;inset:0;z-index:60;background:rgba(7,15,48,.94);display:grid;place-items:center;padding:1.5rem;opacity:0;pointer-events:none;transition:opacity 200ms ease}
.lb.in{opacity:1;pointer-events:auto}
.lb img{max-width:min(94vw,1100px);max-height:88vh;border-radius:12px}
.lb button{position:absolute;top:1.25rem;right:1.25rem;width:48px;height:48px;border-radius:50%;background:none;border:2px solid var(--hair-ink);color:var(--on-ink);font-size:1.3rem;cursor:pointer}

/* ------------------------------------------------------------ contact */
.contact{display:grid;gap:clamp(2rem,4vw,3.5rem)}
@media (min-width:900px){.contact{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:start}}
.field{display:flex;flex-direction:column;gap:.35rem;margin-bottom:1.1rem}
.field label{font-family:var(--mono);font-size:1.0625rem;font-weight:700;color:var(--txt-2)}
.field input,.field textarea{
  width:100%;padding:.8rem .95rem;border:2px solid var(--hair);background:var(--card);border-radius:12px;
  font:inherit;font-size:1rem;color:var(--txt);transition:border-color 160ms ease,box-shadow 160ms ease;
}
.field input:focus,.field textarea:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 4px rgba(220,243,106,.22)}
.field textarea{min-height:9.5rem;resize:vertical;line-height:1.6}
.frow{display:grid;gap:1.1rem}
@media (min-width:560px){.frow{grid-template-columns:1fr 1fr}}
.hp{position:absolute!important;left:-9999px!important}
.note{padding:.85rem 1.05rem;margin-bottom:1.35rem;font-size:.9375rem;display:flex;gap:.65rem;border:2px solid;border-radius:12px}
.note.ok{border-color:var(--sage);background:rgba(155,227,168,.08);color:var(--sage)}
.note.bad{border-color:var(--red);background:rgba(255,143,117,.08);color:var(--red)}
.orgcard{background:var(--ink);border:1px solid var(--hair);color:var(--on-ink);padding:clamp(1.4rem,3vw,2rem);border-radius:var(--r);display:flex;flex-direction:column;gap:1.1rem}
.orgcard h2{font-family:var(--display);font-stretch:var(--stretch);font-size:1.9rem;font-weight:600;color:#fff}
.orgcard dl{margin:0;display:flex;flex-direction:column;gap:.9rem}
.orgcard dt{font-family:var(--mono);font-size:1rem;font-weight:700;color:var(--gold-lit)}
.orgcard dd{margin:.15rem 0 0;font-size:.9375rem;overflow-wrap:anywhere}
.orgcard a{background:linear-gradient(var(--gold-lit),var(--gold-lit)) left 100%/100% 2px no-repeat}
.copy{cursor:pointer;background:none;border:1px solid var(--hair-ink);border-radius:var(--r-pill);color:var(--on-ink-2);font-family:var(--mono);font-size:.875rem;font-weight:700;padding:.15rem .5rem;margin-left:.4rem;transition:color 160ms ease,border-color 160ms ease}
.copy:hover{color:var(--gold-lit);border-color:var(--gold-lit)}

/* ------------------------------------------------------------ footer */
.foot{background:var(--ink);border-top:1px solid var(--hair-2);color:var(--on-ink);padding-top:clamp(3rem,6vw,4.5rem);position:relative;overflow:hidden}
.foot-in{display:grid;gap:2.25rem;padding-bottom:2.5rem}
@media (min-width:760px){.foot-in{grid-template-columns:1.6fr 1fr 1.35fr 1fr}}
.foot-motto{font-family:var(--motto);font-size:2rem;color:var(--gold-lit);line-height:1.1}
.foot-name{font-family:var(--display);font-stretch:var(--stretch);font-size:1.4rem;font-weight:600;margin-top:.4rem}
.foot-tag{margin-top:.8rem;font-size:.9375rem;line-height:1.55;color:var(--on-ink-2);max-width:38ch}
.foot-col{display:flex;flex-direction:column;gap:.55rem}
.foot-col h2{margin-bottom:.35rem;font-size:1.25rem}
.foot-col a{font-size:.9375rem;color:var(--on-ink-2);transition:color 160ms ease;overflow-wrap:break-word}
.foot-col a:hover{color:var(--gold-lit)}
.foot-place{font-size:.9375rem;color:var(--on-ink-3)}
.foot-eu{display:flex;gap:1rem;align-items:flex-start;padding-block:1.35rem;border-top:1px solid var(--hair-ink)}
.eu{flex:0 0 auto;width:46px}
.eu svg{width:100%;height:auto;display:block;border-radius:3px}
.foot-eu p{font-size:.8125rem;line-height:1.55;color:var(--on-ink-3)}
.foot-end{display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;justify-content:space-between;padding-block:1.25rem 2.25rem;border-top:1px solid var(--hair-ink);font-size:.8125rem;color:var(--on-ink-3)}
.foot-end a:hover{color:var(--gold-lit)}
.foot-credit{font-size:.8125rem;color:var(--on-ink-3)}
.foot-credit a{text-decoration:underline;text-decoration-color:var(--hair-ink);text-underline-offset:3px}

/* ------------------------------------------------------------ 404 */
.err{min-height:58vh;display:grid;place-items:center;text-align:center;padding-block:5rem}
.err-num{font-family:var(--display);font-stretch:var(--stretch);font-size:clamp(6rem,22vw,13rem);font-weight:600;line-height:.85;color:var(--txt);-webkit-text-stroke:0;text-shadow:.05em .05em 0 var(--gold)}

/* ------------------------------------------------------------ scroll reveal */
.js .r{opacity:0;transform:translateY(12px)}
.js .r.in{opacity:1;transform:none;transition:opacity 520ms ease-out,transform 620ms var(--out);transition-delay:calc(var(--i,0) * 60ms)}
.js .r .card-img,.js .detail-cover.r{clip-path:inset(0 0 100% 0 round 12px)}
.js .r.in .card-img,.js .detail-cover.r.in{clip-path:inset(0 0 0 0 round 12px);transition:clip-path 700ms var(--out) 60ms}
.js .stg{opacity:0;transform:translateY(10px)}
.js .stg.go{opacity:1;transform:none;transition:opacity 460ms ease-out,transform 560ms var(--out);transition-delay:calc(var(--s,0) * 70ms)}

/* ------------------------------------------------------------ reduced motion */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:1ms!important;animation-delay:0ms!important;transition-duration:1ms!important;transition-delay:0ms!important}
  .js .r,.js .stg{opacity:1;transform:none}
  .js .r .card-img,.js .detail-cover.r{clip-path:none}
}

/* ------------------------------------------------------------ print */
@media print{
  .head,.drawer,.foot,.btn,.tabs,.detail-foot,.prog-bar,.agora-stage,.w-ui{display:none!important}
  body{background:#fff;color:#000}
  .banner,.sec.dark,.station,.card,.q,.member{background:#fff!important;color:#000!important}
  *{color:#000!important}
  .banner::before,.banner-art{display:none}
  .banner-h{color:#000!important}
}

/* ==========================================================================
   HOME — the stations of the Solar Agora, as plain sections.
   This is the whole home page when the island is off, when JS fails, in
   "Plain view", and for reduced motion. world.css re-stages these same
   elements over the 3D island.
   ========================================================================== */
.agora{position:relative}
.station{position:relative;padding-block:clamp(3.25rem,7vw,6rem)}
.st-card{width:100%;max-width:calc(760px + var(--pad) * 2);margin-inline:auto;padding-inline:var(--pad);display:flex;flex-direction:column;gap:1rem;align-items:flex-start}
.st-card > *{max-width:100%}
.station:nth-of-type(even){background:var(--parch-2)}
.st-approach{background:radial-gradient(110% 80% at 78% 45%,#18266C 0,#0B1440 45%,var(--ink) 100%)!important;color:var(--on-ink);overflow:hidden;isolation:isolate;padding-block:clamp(3rem,8vw,6.5rem)}
.st-assembly{background:var(--ink)!important;color:var(--on-ink)}
.st-art{display:none}
@media (min-width:1080px){
  .st-art{display:block;position:absolute;z-index:-1;right:max(-4rem,calc((100vw - var(--maxw)) / 2 - 3rem));top:54%;translate:0 -50%;width:min(52vw,760px);pointer-events:none}
  .st-approach .st-card{max-width:var(--maxw)}
  .st-approach .st-card > *{max-width:min(100%,34rem)}
}
[data-view="world"] .st-art{display:none}

.st-crest{width:min(380px,76vw);height:auto;margin-bottom:.25rem;
  /* the lime disc that sits behind the shield in the original crest */
  background:radial-gradient(circle at 52% 42%,var(--gold) 0 41%,transparent 41.3%)}
.hero-title{margin:.35rem 0 0;font-size:clamp(3.6rem,11vw,7.6rem);line-height:.9;color:#fff;font-weight:600;letter-spacing:-.015em}
.hero-title .ln{display:block;overflow:hidden;padding-right:.1em;margin-right:-.1em;padding-bottom:.04em}
.hero-title .ln > span{display:block}
.hero-title .dot{color:var(--gold)}
.js .hero-title .ln > span{transform:translateY(105%)}
.js .hero-title.go .ln > span{transform:none;transition:transform 720ms var(--out);transition-delay:calc(var(--l) * 90ms + 90ms)}
@media (prefers-reduced-motion:reduce){.js .hero-title .ln > span{transform:none}}

.st-lead{font-size:clamp(1.05rem,.6vw + .92rem,1.25rem);line-height:1.55;color:var(--txt-2);max-width:58ch}
.st-approach .st-lead,.st-assembly .st-lead{color:var(--on-ink-2)}
.st-motto{font-size:1.35rem;color:var(--gold-lit)}
.st-motto-alt{font-family:var(--mono);font-weight:700;font-size:1rem;letter-spacing:.16em;text-transform:uppercase;color:var(--on-ink-3)}
.st-cta{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.5rem}
.btn-ct{display:inline-grid;place-items:center;min-width:1.5em;height:1.5em;padding:0 .35em;border-radius:var(--r-pill);background:var(--ink);color:var(--gold-lit);font-size:.85em;letter-spacing:0}
.station .h2{max-width:20ch}
.st-approach .h2,.st-assembly .h2{color:#fff}
.st-prose{font-size:1rem}
.st-sub{font-family:var(--display);font-stretch:var(--stretch);font-size:1.75rem;font-weight:600;margin-top:1.25rem}
.st-more{margin-top:.25rem}

.st-chips{list-style:none;margin:.5rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.st-chip{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--mono);font-size:1.125rem;font-weight:700;line-height:1;padding:.5rem .9rem .55rem;border:2px solid var(--txt);border-radius:var(--r-pill);transition:background-color 160ms ease,color 160ms ease}
.st-chip .glyph{width:18px;height:18px}
@media (hover:hover) and (pointer:fine){.st-chip:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)}}

.station .eyebrow .glyph{width:18px;height:18px}
.st-fact{margin:.4rem 0 0;padding:1rem 1.2rem 1.1rem;border-left:3px solid var(--gold);background:var(--card);border-radius:0 var(--r) var(--r) 0;font-size:.975rem;line-height:1.55;color:var(--txt);max-width:60ch}
.station:nth-of-type(even) .st-fact{background:var(--parch)}

.st-rows{list-style:none;margin:.25rem 0 0;padding:0;width:100%;display:flex;flex-direction:column;border-top:1px solid var(--hair)}
.st-row{border-bottom:1px solid var(--hair)}
.st-row a{display:grid;grid-template-columns:1fr auto;gap:.2rem 1rem;align-items:center;padding:.8rem 0}
.st-row-t{font-family:var(--display);font-stretch:var(--stretch);font-size:1.5rem;font-weight:600;line-height:1.02}
.st-row-m{grid-column:1;font-size:.875rem;color:var(--txt-3)}
.st-row .stamp{grid-column:2;grid-row:1 / span 2}
@media (hover:hover) and (pointer:fine){.st-row a:hover .st-row-t{text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:3px;text-underline-offset:4px}}
.station .progs{width:100%}

.st-team{list-style:none;margin:0;padding:0;display:grid;gap:.75rem;width:100%}
@media (min-width:560px){.st-team{grid-template-columns:1fr 1fr}}
.st-team li{display:flex;align-items:center;gap:.8rem}
.st-team img,.st-init{width:52px;height:52px;border-radius:50%;flex:0 0 auto;object-fit:cover}
.st-init{display:grid;place-items:center;background:var(--gold);color:var(--ink);font-family:var(--display);font-stretch:var(--stretch);font-weight:600;font-size:1.3rem}
.st-team b{display:block;font-family:var(--display);font-stretch:var(--stretch);font-size:1.4rem;font-weight:600;line-height:1}
.st-team small{display:block;font-size:.875rem;color:var(--txt-3)}
.st-assembly .st-team small{color:var(--on-ink-3)}
.st-facts{margin:0;display:grid;gap:.75rem 1.5rem;width:100%}
@media (min-width:560px){.st-facts{grid-template-columns:1fr 1fr}}
.st-facts dt{font-family:var(--mono);font-size:1rem;font-weight:700;color:var(--txt-3)}
.st-assembly .st-facts dt{color:var(--gold-lit)}
.st-facts dd{margin:.1rem 0 0;font-size:.9375rem;overflow-wrap:anywhere}
.st-facts a{background:linear-gradient(currentColor,currentColor) left 100%/100% 1px no-repeat}
.st-letter{width:100%;margin-top:.5rem;padding:1.1rem 1.25rem 1.3rem;border-radius:var(--r);border:1px solid var(--gold);background:linear-gradient(180deg,rgba(220,243,106,.07),transparent 70%)}
.st-letter .st-sub{margin-top:0;color:var(--gold-lit)}
.st-assembly .prose a{color:#fff}

/* world-only bits are hidden in the plain page */
.w-only,.w-note,.agora-stage,.w-ui{display:none}
[data-view="plain"][data-rm-note] .w-note-rm,[data-view="plain"][data-nogl] .w-note-gl{display:block}
.w-note{max-width:var(--maxw);margin:0 auto;padding:.9rem var(--pad);font-size:.9375rem;background:var(--gold);color:var(--ink)}
.w-note .lnk{color:var(--ink);background:none;border:0;cursor:pointer;padding:0 0 2px}
@media (max-width:560px){.eyebrow{letter-spacing:.1em;font-size:.875rem}}
.nav a{white-space:nowrap}
@media (min-width:1120px) and (max-width:1439px){html[lang="el"] .viewtog .vt-label{display:none}html[lang="el"] .nav{gap:1.1rem}}