/* Header and footer lockup for the Jenggala Equestrian wordmark (ratio ~3.36).

   The logo itself is never recoloured, cropped or filtered here — only the space
   around it changes. Two presentations, chosen in Admin > Branding >
   "Latar logo header":

   • brand--plate-none  — a light-ink lockup sits straight on the dark bar. This is
     the premium default: gold and ivory on the brand's own dark ground.
   • brand--plate-ivory — a dark-ink lockup keeps an ivory plate so it stays legible.

   The box geometry below is deliberately identical to the original lockup rules:
   the mobile topbar is a three-column grid that depends on it. */

.site-shell--editorial .topbar .brand--animated-lockup.brand--horizontal{
  width:max-content;
  min-width:0;
  max-width:min(250px,100%);
  height:66px;
  padding:6px 13px;
  overflow:hidden;
  background:#f4eee1;
  border:1px solid #d4bd91;
  border-radius:4px;
  box-shadow:none;
}
.site-shell--editorial .brand-horizontal-picture{display:block;line-height:0}
.site-shell--editorial .brand-horizontal-image{
  width:auto;
  height:54px;
  max-height:54px;
  max-width:100%;
  object-fit:contain;
  object-position:center;
  filter:none;
}

/* --- premium presentation: no box, the lockup lit on the dark bar ---------- */
.site-shell--editorial .topbar .brand--horizontal.brand--plate-none{
  background:none;
  border:0;
  border-radius:0;
  padding:6px 2px;
  overflow:visible;
  /* A whisper of warm light so the wordmark reads as lit, not pasted on. */
  filter:drop-shadow(0 1px 1px #0000006b) drop-shadow(0 0 20px #e7c98a1c);
}
.site-shell--editorial .topbar .brand--horizontal.brand--plate-none .brand-horizontal-image{
  height:58px;
  max-height:58px;
}

/* --- ivory plate, refined, for a dark-ink lockup --------------------------- */
.site-shell--editorial .topbar .brand--horizontal.brand--plate-ivory{
  border-radius:10px;
  background:linear-gradient(155deg,#fbf6ea 0%,#f3ebda 58%,#eee4cd 100%);
  border:1px solid #cfb488;
  box-shadow:0 1px 0 #ffffffb3 inset,0 10px 26px -18px #000000a6;
}

/* --- footer --------------------------------------------------------------- */
.site-shell--editorial .footer-logo-image{
  align-self:start;
  width:auto;
  max-width:min(300px,100%);
  height:84px;
  max-height:84px;
  padding:0;
  background:none;
  border:0;
  border-radius:0;
  object-fit:contain;
  filter:none;
}

@media (max-width:900px){
  .site-shell--editorial .topbar .brand--animated-lockup.brand--horizontal{height:62px;padding:6px 12px}
  .site-shell--editorial .brand-horizontal-image{height:50px;max-height:50px}
  .site-shell--editorial .topbar .brand--horizontal.brand--plate-none{padding:6px 2px}
  .site-shell--editorial .topbar .brand--horizontal.brand--plate-none .brand-horizontal-image{height:54px;max-height:54px}
}
@media (max-width:640px){
  .site-shell--editorial .topbar .brand--animated-lockup.brand--horizontal{
    width:max-content;max-width:calc(100vw - 150px);height:56px;padding:5px 10px;
  }
  .site-shell--editorial .brand-horizontal-image{height:46px;max-height:46px}
  .site-shell--editorial .topbar .brand--horizontal.brand--plate-none{padding:5px 2px;filter:drop-shadow(0 1px 1px #0000006b) drop-shadow(0 0 14px #e7c98a1a)}
  .site-shell--editorial .topbar .brand--horizontal.brand--plate-none .brand-horizontal-image{height:50px;max-height:50px}
  .site-shell--editorial .footer-logo-image{height:72px;max-height:72px}
}
@media (max-width:400px){
  .site-shell--editorial .topbar .brand--animated-lockup.brand--horizontal{height:52px;padding:4px 9px}
  .site-shell--editorial .brand-horizontal-image{height:44px;max-height:44px}
  .site-shell--editorial .topbar .brand--horizontal.brand--plate-none{padding:4px 2px}
  .site-shell--editorial .topbar .brand--horizontal.brand--plate-none .brand-horizontal-image{height:47px;max-height:47px}
}
@media (max-width:340px){
  .site-shell--editorial .topbar .brand--animated-lockup.brand--horizontal{height:48px;padding:4px 7px}
  .site-shell--editorial .brand-horizontal-image{height:40px;max-height:40px}
  .site-shell--editorial .topbar .brand--horizontal.brand--plate-none .brand-horizontal-image{height:43px;max-height:43px}
}