.ess-showcase {
  --ess-rail: 68px;
  --ess-accent: #c3955c;
  --ess-bg: #000;
  --ess-rail-bg: #fff;
  --ess-rail-text: #111;
  --ess-frame: 8px;
  --ess-overlay: 38%;
  --ess-content: 620px;
  position: relative;
  display: grid;
  grid-template-columns: var(--ess-rail) minmax(0,1fr) var(--ess-rail);
  width: 100%;
  height: 100svh;
  min-height: 520px;
  padding: var(--ess-frame);
  box-sizing: border-box;
  background: var(--ess-rail-bg);
  overflow: hidden;
  isolation: isolate;
}
.ess-showcase * { box-sizing: border-box; }
.ess-rail {
  position: relative;
  z-index: 30;
  background: var(--ess-rail-bg);
  color: var(--ess-rail-text);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.ess-social-list,.ess-right-menu {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  height:100%;
}
.ess-vertical-link {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  color: var(--ess-rail-text);
  text-decoration:none;
  font-size:11px;
  font-weight:600;
  letter-spacing:.04em;
  line-height:1;
  white-space:nowrap;
}
.ess-vertical-link:hover { color: var(--ess-accent); }
.ess-social-link { display:inline-flex; align-items:center; gap:7px; }
.ess-social-icon { display:inline-flex; align-items:center; justify-content:center; writing-mode:inherit; transform:rotate(90deg); transform-origin:center; font-size:1.25em; line-height:1; color:inherit; }
.ess-social-icon i, .ess-social-icon svg { display:block; width:1em; height:1em; fill:currentColor; }
.ess-dot { color: var(--ess-accent); font-size:15px; line-height:1; }

.ess-stage { position:relative; overflow:hidden; background:transparent; min-width:0; min-height:0; touch-action:pan-y; }
.ess-stage.ess-can-drag { cursor:grab; }
.ess-stage.ess-can-drag.is-dragging { cursor:grabbing; user-select:none; }
.ess-stage.ess-can-drag.is-dragging * { user-select:none; }
.ess-track { height:100%; display:flex; will-change:transform; transform:translate3d(0,0,0); }
.ess-slide {
  position:relative;
  flex:0 0 100%;
  height:100%;
  min-width:0;
  overflow:hidden;
  background:transparent;
  color:#fff;
}
.ess-slide[data-href] { cursor:pointer; }
.ess-slide[href] { display:block; color:inherit; text-decoration:none; }
.ess-slide[href]:hover, .ess-slide[href]:focus, .ess-slide[href]:visited { color:inherit; text-decoration:none; }
.ess-slide-picture {
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  overflow:hidden;
  background:transparent;
}
.ess-slide-image {
  display:block;
  width:100% !important;
  height:100% !important;
  min-width:100%;
  min-height:100%;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center;
  transform:scale(1.025);
  transition:transform 1.2s cubic-bezier(.2,.7,.2,1);
}
.ess-slide.is-active .ess-slide-image { transform:scale(1); }
.ess-slide-shade {
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(90deg,
    rgba(0,0,0,calc(var(--ess-overlay) / 100)) 0%,
    rgba(0,0,0,calc((var(--ess-overlay) / 100) * .52)) 45%,
    rgba(0,0,0,calc(var(--ess-overlay) / 100)) 100%);
}
.ess-slide-copy {
  position:relative;
  z-index:2;
  height:100%;
  display:flex;
  align-items:flex-end;
  padding:8vh clamp(28px,6vw,110px) 12vh;
  pointer-events:none;
}
.ess-copy-inner {
  width:min(var(--ess-content), 46vw);
  pointer-events:auto;
}
.ess-copy-right .ess-copy-inner {
  text-align:left;
}
.ess-copy-left .ess-slide-copy { justify-content:flex-start; text-align:left; }
.ess-copy-right .ess-slide-copy { justify-content:flex-end; text-align:left; }
.ess-eyebrow {
  color:var(--ess-accent);
  font-size:clamp(12px,1vw,16px);
  margin-bottom:20px;
  opacity:0;
  transform:translateY(16px);
  transition:.6s ease .18s;
}
.ess-title {
  margin:0 0 28px;
  color:var(--ess-accent);
  font-size:clamp(34px,4.2vw,76px);
  line-height:1.02;
  font-weight:700;
  opacity:0;
  transform:translateY(24px);
  transition:.72s ease .25s;
}
.ess-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:10px 24px;
  border:1px solid var(--ess-accent);
  color:var(--ess-accent);
  background:rgba(0,0,0,.18);
  text-decoration:none;
  font-size:11px;
  letter-spacing:.04em;
  opacity:0;
  transform:translateY(16px);
  transition:opacity .65s ease .34s, transform .65s ease .34s, background .2s ease, color .2s ease;
}
.ess-button:hover { background:var(--ess-accent); color:#000; }
.ess-button-static { pointer-events:none; }
.ess-slide.is-active .ess-eyebrow,.ess-slide.is-active .ess-title,.ess-slide.is-active .ess-button { opacity:1; transform:translateY(0); }

.ess-pagination {
  position:absolute;
  right:26px;
  bottom:14px;
  z-index:15;
  display:flex;
  align-items:center;
  gap:18px;
}
.ess-page { appearance:none; border:0; padding:4px 2px; background:transparent; color:#fff; font-size:11px; line-height:1; cursor:pointer; opacity:.88; }
.ess-page:hover,.ess-page.is-active { color:var(--ess-accent); opacity:1; }
.ess-page-line { display:inline-block; width:34px; height:1px; background:currentColor; color:#fff; opacity:.7; }

.ess-arrows {
  position:absolute;
  left:18px;
  right:18px;
  top:50%;
  transform:translateY(-50%);
  z-index:16;
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
}
.ess-arrow {
  appearance:none;
  border:0;
  width:44px;
  height:44px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  background:rgba(0,0,0,.25);
  color:#fff;
  font-size:22px;
  line-height:1;
  cursor:pointer;
  pointer-events:auto;
  transition:transform .2s ease, opacity .2s ease, background-color .2s ease, color .2s ease;
}
.ess-arrow:hover { transform:scale(1.06); }
.ess-arrow:focus-visible { outline:2px solid currentColor; outline-offset:2px; }

@media (max-width: 1024px) {
  .ess-showcase { --ess-rail: 52px; --ess-frame: 4px; min-height: 500px; }
  .ess-slide-copy { padding:7vh 6vw 11vh; }
  .ess-copy-inner { width:min(var(--ess-content), 58vw); }
  .ess-title { font-size:clamp(32px,6vw,62px); }
}

@media (max-width: 767px) {
  .ess-showcase {
    grid-template-columns: minmax(0,1fr);
    grid-template-rows: auto var(--ess-mobile-height, auto) auto;
    --ess-frame: 0px;
    height: auto;
    min-height: 0;
    overflow: visible;
  }

  /* On mobile, enabled rails live OUTSIDE the image/slider area. */
  .ess-rail {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    width: 100%;
    height: 44px;
    min-height: 44px;
    padding: 0 14px;
    border: 0;
    border-radius: 0;
    background: var(--ess-rail-bg);
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    overflow: hidden;
  }
  .ess-rail-left { grid-column:1; grid-row:1; }
  .ess-stage { grid-column:1; grid-row:2; width:100%; height:var(--ess-mobile-height, auto); min-height:0; }
  .ess-rail-right { grid-column:1; grid-row:3; }

  .ess-social-list,
  .ess-right-menu {
    width:100%; height:100%; min-width:0;
    flex-direction:row; justify-content:center; gap:10px;
    overflow-x:auto; overflow-y:hidden;
    scrollbar-width:none; -webkit-overflow-scrolling:touch;
  }
  .ess-social-list::-webkit-scrollbar,
  .ess-right-menu::-webkit-scrollbar { display:none; }

  .ess-vertical-link {
    writing-mode:horizontal-tb; transform:none; flex:0 0 auto;
    font-size:10px; line-height:1.1; letter-spacing:.03em;
  }
  .ess-social-icon { writing-mode:horizontal-tb; transform:none; font-size:1.2em; }
  .ess-dot { flex:0 0 auto; font-size:11px; }

  .ess-mobile-left-hidden .ess-rail-left,
  .ess-mobile-right-hidden .ess-rail-right { display:none !important; }
  .ess-mobile-left-hidden { grid-template-rows: 0 var(--ess-mobile-height, auto) auto; }
  .ess-mobile-right-hidden { grid-template-rows: auto var(--ess-mobile-height, auto) 0; }
  .ess-mobile-left-hidden.ess-mobile-right-hidden { grid-template-rows: 0 var(--ess-mobile-height, auto) 0; }

  .ess-slide-copy {
    align-items:flex-end;
    padding:24px 20px 54px;
  }
  .ess-copy-left .ess-slide-copy { justify-content:flex-start; text-align:left; }
  .ess-copy-right .ess-slide-copy { justify-content:flex-end; text-align:left; }

  /* Keep Left/Right placement on mobile. The right block is anchored to
     the right, but every element starts from the same left edge. */
  .ess-copy-inner {
    width:max-content; max-width:100%;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
  }
  .ess-copy-left .ess-copy-inner { margin-right:auto; }
  .ess-copy-right .ess-copy-inner { margin-left:auto; }
  .ess-copy-left .ess-eyebrow,
  .ess-copy-left .ess-title,
  .ess-copy-right .ess-eyebrow,
  .ess-copy-right .ess-title { text-align:left; }
  .ess-button { width:max-content; max-width:100%; }

  .ess-slide-picture, .ess-slide-image { width:100% !important; height:100% !important; }
  .ess-slide-image { object-fit:cover !important; }
  .ess-track, .ess-slide { height:100%; min-height:0; }
  .ess-eyebrow { margin-bottom:12px; font-size:11px; }
  .ess-title { margin-bottom:18px; font-size:clamp(28px,9.5vw,48px); }
  .ess-button { min-height:38px; padding:8px 16px; font-size:10px; }

  .ess-pagination {
    left:50%; right:auto; bottom:10px; transform:translateX(-50%);
    gap:10px; max-width:calc(100% - 24px); padding:5px 9px;
    border-radius:999px; background:rgba(0,0,0,.25);
    backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  }
  .ess-page-line { display:none; }
  .ess-page { font-size:10px; }
  .ess-arrows { left:10px; right:10px; }
  .ess-arrow { width:38px; height:38px; font-size:19px; }
}

@media (max-width: 479px) {
  .ess-rail { height:40px; min-height:40px; padding:0 10px; }
  .ess-social-list,.ess-right-menu { gap:8px; justify-content:flex-start; }
  .ess-vertical-link { font-size:9px; }
  .ess-dot { font-size:10px; }
  .ess-slide-copy { padding-left:16px; padding-right:16px; }
  .ess-pagination { bottom:8px; }
}

@media (prefers-reduced-motion: reduce) {
  .ess-track,.ess-slide-image,.ess-eyebrow,.ess-title,.ess-button { transition:none !important; }
}

/* v1.6.4: keep horizontal slide swipes available on touch screens while
   preserving normal vertical page scrolling. */
@media (hover: none) and (pointer: coarse) {
  .ess-stage.ess-can-drag {
    touch-action: pan-y pinch-zoom;
    -ms-touch-action: pan-y;
  }
  .ess-stage.ess-can-drag .ess-slide,
  .ess-stage.ess-can-drag .ess-slide-picture,
  .ess-stage.ess-can-drag .ess-slide-image {
    -webkit-user-drag: none;
    user-select: none;
  }
}