@charset "UTF-8";
/* =========================================================
   PC (> 640px) — fixed side navigation & CTA at the
   viewport edges, mobile chrome hidden.
   Wrapped in a min-width query so it never fights with
   sp.css (which is loaded only at <=640px via the <link
   media> attribute) — whichever matches the viewport wins
   cleanly, no !important needed.
========================================================= */

@media (min-width: 641px) {

  .sp_header,
  .sp_nav,
  .sp_nav_overlay,
  .sp_bottom_cta {
    display: none;
  }

  .l_side_left {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 28px;
    left: 24px;
    top: 40px;
  }

  .l_logo {
    font-family: "Cormorant Garamond", serif;
    font-size: 0.95rem;
    letter-spacing: 0.12em;
    writing-mode: vertical-rl;
    color: #fff;
  }

  .l_nav {
    display: flex;
    flex-direction: column;
    gap: 18px;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    color: #fff;
  }

  .l_nav a {
    writing-mode: vertical-rl;
  }

  .l_cart {
    color: #fff;
  }

  .l_copyright {
    display: block;
    top: 40px;
    right: 24px;
    font-size: 0.65rem;
    color: #fff;
    letter-spacing: 0.03em;
  }

  .l_side_cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    background: var(--c-black);
    color: #fff;
    padding: 20px 12px;
    border-radius: 999px;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    writing-mode: vertical-rl;
  }
}