/* =====================================================================
   Advokatur Kamer – Corporate-Design-Ebene (ak-cd.css)
   Schriften (EB Garamond + Jost, selbst gehostet), Header-Logo und
   grosses Monogramm im Kopfbild. Farben der Website bleiben unverändert;
   Gold-Akzente im Logo: #A5824A, auf dunklem Grund #D9C39A.
   ===================================================================== */

/* ---------- Schriften: EB Garamond (Serif) -------------------------- */
@font-face{
  font-family:"EB Garamond"; font-style:normal; font-weight:400; font-display:swap;
  src:url("../fonts/eb-garamond-latin-400-normal.woff2") format("woff2");
}
@font-face{
  font-family:"EB Garamond"; font-style:normal; font-weight:500; font-display:swap;
  src:url("../fonts/eb-garamond-latin-500-normal.woff2") format("woff2");
}
@font-face{
  font-family:"EB Garamond"; font-style:normal; font-weight:600; font-display:swap;
  src:url("../fonts/eb-garamond-latin-600-normal.woff2") format("woff2");
}
@font-face{
  font-family:"EB Garamond"; font-style:italic; font-weight:400; font-display:swap;
  src:url("../fonts/eb-garamond-latin-400-italic.woff2") format("woff2");
}
@font-face{
  font-family:"EB Garamond"; font-style:italic; font-weight:500; font-display:swap;
  src:url("../fonts/eb-garamond-latin-500-italic.woff2") format("woff2");
}

/* ---------- Schriften: Jost (serifenlos) ---------------------------- */
@font-face{
  font-family:"Jost"; font-style:normal; font-weight:300; font-display:swap;
  src:url("../fonts/jost-latin-300-normal.woff2") format("woff2");
}
@font-face{
  font-family:"Jost"; font-style:normal; font-weight:400; font-display:swap;
  src:url("../fonts/jost-latin-400-normal.woff2") format("woff2");
}
@font-face{
  font-family:"Jost"; font-style:normal; font-weight:500; font-display:swap;
  src:url("../fonts/jost-latin-500-normal.woff2") format("woff2");
}

/* ---------- Header-Logo (Monogramm · Goldlinie · Wortmarke) ---------- */
.ak-brand{display:inline-flex; align-items:center; gap:.8rem; color:#fff; text-decoration:none}
.ak-brand__mark{width:50px; height:auto; display:block; flex:none}
.ak-brand__rule{
  width:1px; align-self:stretch; min-height:40px; flex:none; margin-block:2px;
  background:#D9C39A; opacity:.55;
}
.ak-brand > span:last-child{display:flex; flex-direction:column; gap:.4rem; line-height:1}
.ak-brand__name{
  font-family:"EB Garamond",Georgia,serif; font-weight:500; font-size:1.08rem;
  letter-spacing:.2em; text-transform:uppercase; color:#fff; white-space:nowrap;
}
.ak-brand__sub{
  font-family:"Jost","Helvetica Neue",Arial,sans-serif; font-weight:400; font-size:.58rem;
  letter-spacing:.32em; text-transform:uppercase; color:#D9C39A;
}

/* ---------- Grosses Monogramm im Kopfbild (Elfenbein, transparent) -- */
.ak-hero-mark{
  position:absolute; z-index:1; pointer-events:none;
  top:clamp(30px,2.8vw,40px); right:clamp(20px,4vw,52px);
  width:clamp(140px,22vw,300px); aspect-ratio:256/175;
  background:url("../img/ak-monogramm-elfenbein.svg") center/contain no-repeat;
  opacity:.14;
}

@media (max-width:880px){
  .ak-brand__name{font-size:1.04rem; letter-spacing:.2em}
  .ak-brand__mark{width:46px}
  .ak-hero-mark{top:58px; right:12px}
}
@media (max-width:560px){
  /* Monogramm oben rechts in die Bildecke, überlappt den Text nicht */
  .ak-hero-mark{top:14px; right:14px; width:clamp(104px,30vw,146px); opacity:.12}
  .ak-brand__rule{min-height:34px}
  .ak-brand__name{font-size:.96rem; letter-spacing:.2em}
  .ak-brand__sub{font-size:.54rem; letter-spacing:.26em}
}