/* =========================================================
   Epsilon Zero — feuille de style partagée
   ========================================================= */

:root{
  --ink:#1c1a17;
  --parchment:#f3ede1;
  --parchment-dim:#e9e0cf;
  --prussian:#1b3a5c;
  --prussian-deep:#122841;
  --ochre:#c08a2e;
  --oxblood:#7a2e2e;
  --forest:#3f5d3a;
  --teal:#1f5c58;
  --plum:#623763;
  --rust:#9a4b1f;
  --slate:#38566e;
  --indigo:#4b4a8f;
  --rule: rgba(28,26,23,0.14);
  --bg: var(--parchment);
  --fg: var(--ink);
  --panel-frame: var(--ink);
  --label-fg: rgba(28,26,23,0.62);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#15130f;
    --fg:#ece4d3;
    --rule: rgba(236,228,211,0.16);
    --label-fg: rgba(236,228,211,0.6);
    --panel-frame: #ece4d3;
    --parchment-dim:#201c16;
  }
}
:root[data-theme="dark"]{
  --bg:#15130f;
  --fg:#ece4d3;
  --rule: rgba(236,228,211,0.16);
  --label-fg: rgba(236,228,211,0.6);
  --panel-frame: #ece4d3;
  --parchment-dim:#201c16;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--fg);
  font-family:'Piazzolla', Georgia, 'Times New Roman', serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.wrap{ max-width:1180px; margin:0 auto; padding-inline:24px; }
h1,h2,h3{ font-family:'Fraunces', Georgia, serif; font-weight:600; text-wrap:balance; margin:0; }
p{ margin:0; }
.eyebrow{
  font-family:'Piazzolla', Georgia, serif;
  font-variant-caps: small-caps;
  letter-spacing:0.14em;
  font-size:0.82rem;
  color:var(--label-fg);
  text-transform:lowercase;
}
a{ color:inherit; }
img{max-width:100%;}
[hidden]{display:none!important;}

/* ---------- Barre de navigation ---------- */
.site-nav{
  position:sticky; top:0; z-index:30;
  display:flex; align-items:center; justify-content:space-between;
  gap:20px;
  padding:14px 24px;
  background: color-mix(in srgb, var(--bg) 90%, transparent);
  backdrop-filter: blur(6px);
  border-bottom:1px solid var(--rule);
}
.site-nav .logo-link{ display:flex; align-items:center; }
.site-nav .logo-mark{ height:34px; width:auto; display:block; }
.site-nav .links{
  display:flex; gap:28px; flex-wrap:wrap;
}
.site-nav .links a{
  text-decoration:none;
  font-variant-caps: small-caps;
  letter-spacing:0.06em;
  font-size:0.92rem;
  color: var(--label-fg);
  border-bottom:2px solid transparent;
  padding-bottom:3px;
  transition: color .2s ease, border-color .2s ease;
}
.site-nav .links a:hover{ color:var(--fg); }
.site-nav .links a[aria-current="page"]{
  color:var(--fg);
  border-color: var(--prussian);
}
@media (max-width:640px){
  .site-nav .links{ gap:16px; }
  .site-nav .links a{ font-size:0.82rem; }
}

/* ---------- Rampe de navigation laterale ---------- */
.rail{
  position:fixed; right:20px; top:50%; transform:translateY(-50%);
  display:flex; flex-direction:column; gap:16px;
  z-index:20;
}
.rail a{
  width:9px; height:9px; border-radius:50%;
  background:transparent;
  border:1.5px solid var(--label-fg);
  display:block;
  transition:background .3s ease, transform .3s ease, border-color .3s ease;
}
.rail a.active{ background:var(--rail-accent, var(--prussian)); border-color:var(--rail-accent, var(--prussian)); transform:scale(1.5); }
@media (max-width: 900px){ .rail{ display:none; } }

/* ---------- Hero / mur de titre ---------- */
.titlewall{
  position:relative;
  overflow:hidden;
  padding-block: clamp(56px,10vh,100px) clamp(40px,7vh,72px);
  border-bottom:1px solid var(--rule);
}
.titlewall .mega{
  position:absolute;
  top:-0.22em; right:-0.06em;
  font-family:'Fraunces', Georgia, serif;
  font-weight:600;
  font-size: clamp(6rem, 19vw, 15rem);
  line-height:1;
  color:transparent;
  -webkit-text-stroke: 1.4px color-mix(in srgb, var(--prussian) 55%, var(--fg) 12%);
  opacity:0.15;
  white-space:nowrap;
  pointer-events:none;
  z-index:0;
  margin:0;
}
.titlewall > *:not(.mega){ position:relative; z-index:1; }
.titlewall .eyebrow{ margin-bottom:18px; display:block; }
.titlewall h1{
  font-size: clamp(2.3rem, 6vw, 4.6rem);
  line-height:1.03;
  max-width: 16ch;
}
.titlewall .lede{
  margin-top:28px;
  max-width:56ch;
  font-size:1.15rem;
  color: color-mix(in srgb, var(--fg) 82%, transparent);
}
.titlewall .plate{
  margin-top:40px;
  display:flex; gap:28px; flex-wrap:wrap;
}
.plate-item{ min-width:150px; }
.plate-item .n{ font-family:'Fraunces',serif; font-size:1.6rem; }
.plate-item .l{ font-size:0.78rem; color:var(--label-fg); font-variant-caps: small-caps; letter-spacing:0.1em;}

/* ---------- Bandeau defilant des partenaires ---------- */
.marquee{
  margin-top:52px;
  overflow:hidden;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  padding-block:15px;
}
.marquee-track{
  display:flex; width:max-content;
  gap:0;
  animation: ez-marquee 32s linear infinite;
}
.marquee-track span{
  font-family:'Fraunces',serif; font-variant-caps:small-caps;
  letter-spacing:0.09em; font-size:1.02rem; color:var(--label-fg);
  white-space:nowrap; padding-inline:24px;
  display:inline-flex; align-items:center; gap:24px;
}
.marquee-track span::after{ content:'—'; color:var(--rule); }
@keyframes ez-marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .marquee-track{ animation:none; } }

/* ---------- Bandeau defilant des logos partenaires ---------- */
.partner-logos{
  margin-top:52px;
  overflow:hidden;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  padding-block:26px;
}
.partner-logos-track{
  display:flex; width:max-content; align-items:center;
  gap:0;
  animation: ez-marquee 52s linear infinite;
}
.partner-logos-track .plogo{
  display:inline-flex; align-items:center; justify-content:center;
  height:44px; padding-inline:30px;
  white-space:nowrap;
  flex-shrink:0;
}
.partner-logos-track .plogo img{
  height:100%; width:auto; max-width:150px; object-fit:contain;
  filter: grayscale(1) brightness(0.45) contrast(0.9);
  opacity:0.62;
  transition: filter .3s ease, opacity .3s ease;
}
.partner-logos-track .plogo:hover img{ filter:none; opacity:1; }
.partner-logos-track .plogo.on-white-bg img{
  mix-blend-mode: multiply;
  filter: grayscale(1);
}
.partner-logos-track .plogo .wordmark{
  font-family:'Fraunces',serif; font-weight:600; letter-spacing:0.01em;
  font-size:1rem; line-height:1.15; text-align:center;
  color: var(--label-fg);
  border:1px dashed var(--rule);
  padding:8px 16px;
  opacity:0.72;
  transition: opacity .3s ease, border-color .3s ease, color .3s ease;
}
.partner-logos-track .plogo .wordmark small{
  display:block; font-family:'Piazzolla',serif; font-style:italic;
  font-weight:400; font-size:0.62rem; letter-spacing:0.04em;
  margin-top:4px; opacity:0.75;
}
.partner-logos-track .plogo:hover .wordmark{ opacity:1; border-color: var(--prussian); color:var(--fg); }
@media (prefers-reduced-motion: reduce){ .partner-logos-track{ animation:none; } }

/* ---------- Cartes d'accueil (deux portes) ---------- */
.gateways{
  padding-block: clamp(40px,8vh,88px);
}
.gateway-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:28px;
}
@media (max-width:760px){ .gateway-grid{ grid-template-columns:1fr; } }
.gateway{
  position:relative;
  display:block;
  text-decoration:none;
  padding:40px 32px;
  border:2px solid var(--gw-accent, var(--prussian));
  background: color-mix(in srgb, var(--gw-accent, var(--prussian)) 8%, var(--bg));
  overflow:hidden;
  transition: transform .3s ease, box-shadow .3s ease;
  box-shadow: 10px 12px 0 0 color-mix(in srgb, var(--gw-accent, var(--prussian)) 55%, transparent);
}
.gateway:hover{ transform: translate(-4px,-4px); box-shadow: 14px 16px 0 0 color-mix(in srgb, var(--gw-accent, var(--prussian)) 55%, transparent); }
.gateway .gw-num{
  position:absolute; top:-0.25em; right:0.1em;
  font-family:'Fraunces',serif; font-weight:600;
  font-size:8rem; line-height:1;
  color:transparent;
  -webkit-text-stroke: 1.2px color-mix(in srgb, var(--gw-accent, var(--prussian)) 60%, var(--fg) 10%);
  opacity:0.18;
  pointer-events:none;
}
.gateway .eyebrow{ color: var(--gw-accent, var(--prussian)); }
.gateway h2{ font-size: clamp(1.5rem,3vw,2rem); margin-top:12px; }
.gateway p{ margin-top:14px; max-width:42ch; color: color-mix(in srgb, var(--fg) 84%, transparent); }
.gateway .go{
  display:inline-block; margin-top:22px;
  font-variant-caps: small-caps; letter-spacing:0.08em; font-size:0.9rem;
  color: var(--gw-accent, var(--prussian));
  border-bottom:1px solid var(--gw-accent, var(--prussian));
  padding-bottom:2px;
}

/* ---------- Notre accompagnement (parcours en quatre etapes) ---------- */
.journey{
  padding-block: clamp(48px,9vh,96px) clamp(28px,5vh,52px);
  border-bottom:1px solid var(--rule);
}
.journey-intro{ max-width:74ch; }
.journey-intro h2{ font-size:clamp(1.9rem,4vw,2.8rem); max-width:22ch; }
.journey-intro .lede{ margin-top:16px; max-width:66ch; color: color-mix(in srgb, var(--fg) 84%, transparent); }
.journey-grid{
  display:grid;
  grid-template-columns: repeat(4,1fr);
  gap:22px;
  margin-top: clamp(32px,6vh,48px);
}
@media (max-width:980px){ .journey-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .journey-grid{ grid-template-columns:1fr; } }
.step-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(230px,1fr));
  gap:22px;
  margin-top: clamp(28px,5vh,40px);
}
.step{
  position:relative;
  display:flex; flex-direction:column; gap:10px;
  padding:28px 22px 24px;
  border:1px solid color-mix(in srgb, var(--step-accent, var(--prussian)) 40%, var(--rule));
  border-top:3px solid var(--step-accent, var(--prussian));
  background: color-mix(in srgb, var(--step-accent, var(--prussian)) 6%, var(--bg));
}
.step .step-num{
  font-family:'Fraunces',serif; font-weight:600;
  font-size:1.9rem; line-height:1;
  color: var(--step-accent, var(--prussian));
  opacity:0.6;
}
.step h3{ font-size:1.1rem; line-height:1.28; }
.step p{ font-size:0.9rem; color: color-mix(in srgb, var(--fg) 82%, transparent); }
.journey-cta{
  display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px;
  margin-top: clamp(30px,5vh,40px);
  padding-top: clamp(20px,4vh,28px);
  border-top:1px solid var(--rule);
}
.journey-cta p{ flex:1 1 320px; margin:0; font-size:0.94rem; max-width:46ch; color: color-mix(in srgb, var(--fg) 84%, transparent); }
.journey-cta .tarif-cta{ margin:0; }

/* ---------- Grille de partenaires (logos carres, format annuaire) ---------- */
.partner-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(200px,1fr));
  gap:22px;
  margin-top: clamp(28px,5vh,40px);
}
.partner-card{
  position:relative;
  display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:12px;
  padding:26px 20px 24px;
  border:2px solid var(--accent, var(--prussian));
  background: color-mix(in srgb, var(--accent, var(--prussian)) 8%, var(--bg));
  box-shadow: 8px 10px 0 0 color-mix(in srgb, var(--accent, var(--prussian)) 45%, transparent);
  transition: transform .3s ease, box-shadow .3s ease;
}
.partner-card:hover{ transform: translate(-3px,-3px); box-shadow: 11px 13px 0 0 color-mix(in srgb, var(--accent, var(--prussian)) 45%, transparent); }
.partner-card .logo-square{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  width:100%; max-width:148px; aspect-ratio:1/1;
  background: color-mix(in srgb, var(--accent, var(--prussian)) 14%, var(--parchment-dim));
  border:1px solid color-mix(in srgb, var(--accent, var(--prussian)) 32%, var(--rule));
}
.partner-card .logo-square img{
  max-width:76%; max-height:64%; width:auto; height:auto; object-fit:contain;
}
.partner-card .logo-square img.on-white-bg{ mix-blend-mode: multiply; }
.partner-card .logo-square .ph-letter{
  font-family:'Fraunces',serif; font-weight:600;
  font-size:2.4rem; color: var(--accent, var(--prussian));
  line-height:1;
}
.partner-card .logo-square .ph-label{
  font-variant-caps: small-caps; letter-spacing:0.06em;
  font-size:0.62rem; color: var(--label-fg);
}
.partner-card h3{ font-size:1.05rem; line-height:1.3; }
.partner-card .tag{
  font-variant-caps: small-caps; letter-spacing:0.07em; font-size:0.78rem;
  color: var(--label-fg);
}
.partner-card .tarif-cta{ justify-content:center; margin-top:2px; }

/* ---------- Schema (diagramme du parcours, sans numerotation) ---------- */
.schema{
  margin-top: clamp(28px,5vh,44px);
  display:flex; flex-direction:column; align-items:center;
}
.schema-row{
  display:flex; justify-content:center; align-items:stretch;
  gap:20px;
  width:100%;
  flex-wrap:wrap;
}
.schema-box{
  flex:1 1 240px; max-width:380px;
  border:2px solid var(--accent, var(--prussian));
  background: color-mix(in srgb, var(--accent, var(--prussian)) 8%, var(--bg));
  box-shadow: 6px 7px 0 0 color-mix(in srgb, var(--accent, var(--prussian)) 40%, transparent);
  padding:18px 22px;
  text-align:center;
}
.schema-box.wide{ flex-basis:100%; max-width:660px; }
.schema-box .icon{ width:30px; height:30px; margin:0 auto 10px; display:block; color:var(--accent, var(--prussian)); }
.schema-box h4{ font-family:'Fraunces',serif; font-weight:600; font-size:1.02rem; margin:0 0 8px; }
.schema-box p{ font-size:0.86rem; margin:0; color: color-mix(in srgb, var(--fg) 82%, transparent); }
.schema-branch{
  position:relative;
  width:100%; max-width:660px;
  height:34px;
}
.schema-branch::before{
  content:'';
  position:absolute; top:0; left:50%; width:2px; height:14px;
  background: var(--rule); transform:translateX(-50%);
}
.schema-branch::after{
  content:'';
  position:absolute; top:14px; left:25%; right:25%; height:2px;
  background: var(--rule);
}
.schema-branch .drop-left, .schema-branch .drop-right, .schema-branch .drop-mid{
  position:absolute; top:14px; width:2px; height:20px; background: var(--rule);
}
.schema-branch .drop-left{ left:25%; }
.schema-branch .drop-right{ right:25%; }
.schema-branch.three::after{ left:16%; right:16%; }
.schema-branch.three .drop-left{ left:16%; }
.schema-branch.three .drop-mid{ left:50%; transform:translateX(-50%); }
.schema-branch.three .drop-right{ right:16%; }
@media (max-width:640px){
  .schema-branch{ display:none; }
  .schema-row{ gap:14px; }
}

/* ---------- Sections de degre (Undergraduate / Postgrad) ---------- */
.level-intro{
  padding-block: clamp(40px,7vh,64px) 0;
}
.level-intro .lede{ max-width:60ch; color: color-mix(in srgb, var(--fg) 84%, transparent); margin-top:16px; }
.level-heading{
  padding-block: clamp(48px,8vh,72px) 0;
  border-top:1px solid var(--rule);
  margin-top: clamp(32px,6vh,56px);
}
.level-heading .eyebrow{ margin-bottom:10px; display:block; }
.level-heading h2{ font-size:clamp(1.8rem,3.6vw,2.6rem); }
.level-heading .lede{ margin-top:14px; max-width:60ch; color: color-mix(in srgb, var(--fg) 84%, transparent); }

/* ---------- Salles de la galerie ---------- */
.room{
  position:relative;
  overflow:hidden;
  padding-block: clamp(64px,11vh,120px);
  border-bottom:1px solid var(--rule);
  --accent: var(--prussian);
}
.room-num{
  position:absolute;
  top:50%; left:50%;
  transform:translate(-50%,-54%);
  font-family:'Fraunces', Georgia, serif;
  font-weight:600;
  font-size:clamp(9rem, 28vw, 22rem);
  line-height:1;
  color:transparent;
  -webkit-text-stroke: 1.4px color-mix(in srgb, var(--accent) 60%, var(--fg) 10%);
  opacity:0.13;
  white-space:nowrap;
  pointer-events:none;
  z-index:0;
  user-select:none;
}
.room-grid{
  position:relative; z-index:1;
  display:grid;
  grid-template-columns: 1.15fr 1fr;
  gap: clamp(28px,5vw,72px);
  align-items:center;
}
.room.reverse .room-grid{ direction: rtl; }
.room.reverse .room-grid > *{ direction: ltr; }
@media (max-width: 860px){
  .room-grid{ grid-template-columns: 1fr; }
  .room.reverse .room-grid{ direction: ltr; }
}

.frame{
  --tilt: -1.6deg;
  border: 8px solid var(--accent);
  outline: 1px solid var(--rule);
  outline-offset: -12px;
  aspect-ratio: 4/5;
  position:relative;
  overflow:hidden;
  background:var(--parchment-dim);
  transform: rotate(var(--tilt));
  box-shadow: 12px 16px 0 0 color-mix(in srgb, var(--accent) 65%, transparent);
  transition: transform .5s ease, box-shadow .5s ease;
}
.room.reverse .frame{ --tilt: 1.6deg; }
.frame:hover{ transform: rotate(0deg) scale(1.015); box-shadow: 16px 20px 0 0 color-mix(in srgb, var(--accent) 65%, transparent); }
.frame canvas, .frame img{ position:absolute; inset:0; width:100%; height:100%; display:block; object-fit:cover; transition: transform .8s ease; }
.frame:hover img{ transform: scale(1.06); }
.frame .plaque{
  position:absolute; top:16px; left:-9px;
  background: var(--accent);
  color:#fbf7ee;
  border:none;
  padding:8px 16px 8px 20px;
  font-size:0.7rem;
  font-variant-caps: small-caps;
  letter-spacing:0.08em;
  transform: rotate(-2deg);
  box-shadow: 3px 4px 0 rgba(0,0,0,0.28);
}
.frame .partner-logo{
  position:absolute; top:auto; left:auto; bottom:16px; right:16px;
  max-height:32px;
  max-width:36%;
  width:auto; height:auto;
  object-fit:contain;
  /* halo blanc doux qui epouse le contour du logo (pas un panneau/rectangle) pour rester lisible
     sur n'importe quelle photo, sans jamais poser un fond blanc plein */
  filter:
    drop-shadow(0 0 2px rgba(255,255,255,0.95))
    drop-shadow(0 0 5px rgba(255,255,255,0.85))
    drop-shadow(0 0 9px rgba(255,255,255,0.5))
    drop-shadow(0 1px 3px rgba(0,0,0,0.35));
}
/* pour un logo livre avec un fond blanc "cuit" dans l'image (pas de vraie transparence) :
   le mode de fusion "multiply" efface visuellement ce blanc directement sur la photo */
.frame .partner-logo.on-white-bg{
  mix-blend-mode: multiply;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.25));
}
/* ---------- Salle "logo seul" (page Etudes universitaires) ---------- */
.frame.logo-frame{
  display:flex; align-items:center; justify-content:center;
  background: color-mix(in srgb, var(--accent) 14%, var(--parchment-dim));
  padding:36px;
}
.frame.logo-frame img{
  position:static; inset:auto;
  width:auto; height:auto;
  max-width:78%; max-height:60%;
  object-fit:contain;
  transition:none;
}
.frame.logo-frame:hover img{ transform:none; }
.frame.logo-frame.on-white-bg img{ mix-blend-mode: multiply; }
.frame.placeholder{
  display:flex; align-items:center; justify-content:center;
  background: color-mix(in srgb, var(--accent) 16%, var(--parchment-dim));
}
.frame.placeholder .ph-inner{
  text-align:center; padding:24px;
}
.frame.placeholder .ph-letter{
  font-family:'Fraunces',serif; font-weight:600;
  font-size:4.2rem; color: var(--accent);
  line-height:1;
}
.frame.placeholder .ph-label{
  margin-top:10px;
  font-variant-caps: small-caps; letter-spacing:0.08em;
  font-size:0.82rem; color: var(--label-fg);
}

.rule-accent{ display:block; width:46px; height:4px; background:var(--accent); margin-bottom:16px; }
.wall-label .eyebrow{ margin-bottom:14px; display:block; }
.wall-label h2{ font-size: clamp(1.7rem, 3.1vw, 2.5rem); margin-bottom:18px; }
.wall-label .desc{ max-width:48ch; color: color-mix(in srgb, var(--fg) 84%, transparent); }
.wall-label .facts{
  margin-top:26px;
  display:flex; flex-wrap:wrap; gap:10px;
}
.fact-row{
  display:flex; align-items:baseline; gap:8px;
  background: color-mix(in srgb, var(--accent) 12%, var(--bg));
  border:1px solid color-mix(in srgb, var(--accent) 40%, var(--rule));
  padding:8px 14px;
  font-size:0.88rem;
}
.fact-row .k{ min-width:auto; font-variant-caps: small-caps; letter-spacing:0.06em; color:var(--accent); font-weight:600; }

/* ---------- Appel a l'action tarif (au lieu d'un prix affiche) ---------- */
.tarif-cta{
  display:flex; flex-wrap:wrap; gap:10px;
}
.fact-cta{
  display:inline-flex; align-items:center; gap:8px;
  background: var(--accent);
  color:#fbf7ee;
  border:1px solid var(--accent);
  padding:9px 18px;
  font-size:0.86rem;
  font-variant-caps: small-caps;
  letter-spacing:0.06em;
  text-decoration:none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.fact-cta:hover{ transform: translateY(-2px); box-shadow: 3px 4px 0 0 color-mix(in srgb, var(--accent) 55%, transparent); }
.fact-cta.ghost{
  background: transparent;
  color: var(--accent);
}
.fact-cta.ghost:hover{ box-shadow: 3px 4px 0 0 color-mix(in srgb, var(--accent) 30%, transparent); }

.reveal{
  opacity:1; transform:none;
  transition: opacity .8s ease, transform .8s ease;
}
.js .reveal{ opacity:0; transform: translateY(22px); }
.js .reveal.in{ opacity:1; transform:none; }
.js .frame.reveal{ opacity:0; transform: rotate(var(--tilt)) translateY(28px) scale(0.97); }
.js .frame.reveal.in{ opacity:1; transform: rotate(var(--tilt)); }
@media (prefers-reduced-motion: reduce){
  .js .reveal{ opacity:1!important; transform:none!important; transition:none!important; }
}

/* ---------- Accueil / contact ---------- */
.desk{
  position:relative;
  overflow:hidden;
  padding-block: clamp(64px,12vh,120px);
  text-align:left;
}
.desk .logo-lockup{ height:108px; width:auto; display:block; margin-bottom:28px; }
.desk .rule-accent{ background:var(--prussian); }
.desk h2{ font-size: clamp(2rem,4.5vw,3.2rem); max-width:16ch; }
.desk .lede{ margin-top:18px; max-width:50ch; color: color-mix(in srgb, var(--fg) 84%, transparent); font-size:1.08rem; }
.desk-row{
  margin-top:36px;
  display:flex; gap:16px; flex-wrap:wrap; align-items:center;
}
.btn{
  display:inline-block;
  padding:14px 28px;
  background:var(--prussian);
  color:#f3ede1;
  text-decoration:none;
  font-variant-caps: small-caps;
  letter-spacing:0.08em;
  font-size:0.95rem;
  border:1px solid var(--prussian);
  transition: transform .25s ease, box-shadow .25s ease;
}
.btn:hover{ transform: translateY(-3px); box-shadow: 5px 6px 0 0 color-mix(in srgb, var(--prussian) 55%, transparent); }
:root[data-theme="dark"] .btn{ background:var(--ochre); border-color:var(--ochre); color:#1c1a17; }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .btn{ background:var(--ochre); border-color:var(--ochre); color:#1c1a17; }
}
:root[data-theme="dark"] .btn:hover{ box-shadow: 5px 6px 0 0 color-mix(in srgb, var(--ochre) 55%, transparent); }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .btn:hover{ box-shadow: 5px 6px 0 0 color-mix(in srgb, var(--ochre) 55%, transparent); }
}
.btn.ghost{
  background:transparent; color:var(--fg); border:1px solid var(--fg);
}
.btn.ghost:hover{ box-shadow: 5px 6px 0 0 color-mix(in srgb, var(--fg) 30%, transparent); }
.contact-meta{
  margin-top:30px;
  display:flex; gap:32px; flex-wrap:wrap;
  font-size:0.92rem;
  color: var(--label-fg);
  border-top:1px solid var(--rule);
  padding-top:22px;
}
footer{
  padding-block:28px;
  font-size:0.78rem;
  color:var(--label-fg);
  text-align:center;
  padding-inline:24px;
}