/* uc-premium-homepage-v1 css start */
/* uc-premium-homepage-v1 integration start */
body.common-home .header-editor-wrapper,
body.common-home .header-wrapper,
body.common-home .menu-wrapper,
body.common-home .breadcrumb,
body.common-home #top,
body.common-home #footer,
body.common-home footer {
  display: none !important;
}
body.common-home #content {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #08090b !important;
}
body.common-home #content .home-seo-heading {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
}
body.common-home #content .ucp-injected-home {
  width: 100% !important;
}
/* uc-premium-homepage-v1 integration end */

    :root {
      --ink-950: #08090b;
      --ink-900: #101217;
      --ink-820: #181b22;
      --ink-760: #20242c;
      --warm-50: #f7f2e9;
      --warm-100: #eee6d8;
      --mist: #d9dde2;
      --muted: #aab0b9;
      --silver: #c8ccd2;
      --gold: #caa85b;
      --blue: #1f64ff;
      --red: #bf2633;
      --teal: #1b8d83;
      --line: rgba(247, 242, 233, 0.14);
      --dark-line: rgba(8, 9, 11, 0.12);
      --shadow: 0 26px 70px rgba(0, 0, 0, 0.28);
      --ease: cubic-bezier(.2, .8, .2, 1);
      --safe: clamp(16px, 3vw, 56px);
      --content: min(1760px, calc(100vw - var(--safe) * 2));
    }

    * {
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      margin: 0;
      min-width: 320px;
      overflow-x: hidden;
      color: var(--warm-50);
      background:
        radial-gradient(circle at 16% -8%, rgba(31, 100, 255, 0.18), transparent 34vw),
        radial-gradient(circle at 92% 12%, rgba(191, 38, 51, 0.16), transparent 30vw),
        linear-gradient(180deg, var(--ink-900), var(--ink-950) 42%, #111318);
      font-family: Inter, Arial, Helvetica, sans-serif;
      letter-spacing: 0;
    }

    img {
      display: block;
      max-width: 100%;
    }

    a {
      color: inherit;
      text-decoration: none;
    }

    button {
      font: inherit;
    }

    .page-progress {
      position: fixed;
      inset: 0 auto auto 0;
      z-index: 90;
      width: 100%;
      height: 3px;
      transform: scaleX(var(--page-progress, 0));
      transform-origin: left;
      background: linear-gradient(90deg, var(--silver), var(--gold), var(--blue), var(--red));
      pointer-events: none;
    }

    .site-shell {
      position: relative;
      isolation: isolate;
      min-height: 100vh;
    }

    .site-shell::before {
      content: '';
      position: fixed;
      inset: 0;
      z-index: -2;
      opacity: 0.18;
      background:
        linear-gradient(120deg, transparent 0 26px, rgba(247, 242, 233, 0.18) 27px 28px, transparent 29px 64px),
        linear-gradient(60deg, transparent 0 36px, rgba(247, 242, 233, 0.11) 37px 38px, transparent 39px 78px);
      background-size: 90px 90px;
      pointer-events: none;
    }

    .site-shell::after {
      content: '';
      position: fixed;
      inset: -24vh -12vw auto auto;
      z-index: -1;
      width: 48vw;
      height: 48vw;
      border-radius: 8px;
      background: radial-gradient(circle, rgba(202, 168, 91, 0.18), transparent 64%);
      filter: blur(8px);
      animation: glowShift 18s var(--ease) infinite alternate;
      pointer-events: none;
    }

    .top-strip {
      width: 100%;
      color: rgba(247, 242, 233, 0.82);
      background: rgba(8, 9, 11, 0.74);
      border-bottom: 1px solid var(--line);
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    .top-strip-inner,
    .nav-inner,
    .section-inner,
    .footer-inner {
      width: var(--content);
      margin: 0 auto;
    }

    .top-strip-inner {
      min-height: 38px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
    }

    .nav {
      position: sticky;
      top: 0;
      z-index: 40;
      background: rgba(12, 13, 16, 0.78);
      border-bottom: 1px solid var(--line);
      backdrop-filter: blur(20px);
    }

    .nav-inner {
      min-height: 84px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
    }

    .brand {
      display: inline-flex;
      align-items: center;
      min-width: 230px;
      padding: 10px 14px;
      border-radius: 8px;
      background: rgba(247, 242, 233, 0.94);
      box-shadow: 0 18px 40px rgba(0, 0, 0, 0.18);
    }

    .brand-logo {
      width: clamp(164px, 13vw, 232px);
      height: auto;
      object-fit: contain;
    }

    .nav-links {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: clamp(18px, 2.2vw, 38px);
      color: rgba(247, 242, 233, 0.88);
      font-size: clamp(13px, 0.78vw, 15px);
      font-weight: 950;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    .nav-links a {
      position: relative;
      padding: 14px 0;
    }

    .nav-links a::after {
      content: '';
      position: absolute;
      left: 0;
      right: 0;
      bottom: 8px;
      height: 1px;
      transform: scaleX(0);
      transform-origin: left;
      background: var(--gold);
      transition: transform 280ms var(--ease);
    }

    .nav-links a:hover::after {
      transform: scaleX(1);
    }

    .nav-actions {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .icon-btn,
    .btn {
      min-height: 46px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 1px solid rgba(247, 242, 233, 0.22);
      border-radius: 8px;
      background: rgba(247, 242, 233, 0.08);
      color: var(--warm-50);
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 0;
      text-transform: uppercase;
      cursor: pointer;
      transition: transform 240ms var(--ease), background 240ms ease, border-color 240ms ease;
    }

    .icon-btn {
      width: 46px;
      padding: 0;
      font-size: 18px;
    }

    .btn {
      padding: 0 22px;
      gap: 10px;
      white-space: nowrap;
    }

    .btn.primary {
      border-color: rgba(202, 168, 91, 0.72);
      background: linear-gradient(135deg, var(--gold), #e4cf91);
      color: var(--ink-950);
    }

    .btn.light {
      border-color: rgba(247, 242, 233, 0.72);
      background: rgba(247, 242, 233, 0.92);
      color: var(--ink-950);
    }

    .btn:hover,
    .icon-btn:hover {
      transform: translateY(-2px);
      border-color: rgba(247, 242, 233, 0.5);
    }

    .mobile-drawer {
      display: none;
    }

    .hero {
      width: 100%;
      min-height: calc(100svh - 122px);
      padding: clamp(18px, 3vw, 44px) var(--safe) clamp(26px, 5vw, 70px);
      display: grid;
      align-items: stretch;
    }

    .hero-stage {
      width: 100%;
      min-height: min(760px, calc(100svh - 150px));
      display: grid;
      grid-template-columns: minmax(420px, 0.78fr) minmax(0, 1.22fr);
      gap: 0;
      align-items: stretch;
      position: relative;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 8px;
      background:
        radial-gradient(circle at 76% 42%, rgba(247, 242, 233, 0.16), transparent 28vw),
        radial-gradient(circle at 38% 18%, rgba(31, 100, 255, 0.13), transparent 26vw),
        linear-gradient(135deg, rgba(32, 36, 44, 0.94), rgba(8, 9, 11, 0.98) 64%);
      box-shadow: var(--shadow);
      isolation: isolate;
    }

    .hero-stage::before {
      content: '';
      position: absolute;
      inset: 0;
      z-index: -1;
      opacity: 0.18;
      background:
        linear-gradient(90deg, rgba(247, 242, 233, 0.18) 1px, transparent 1px),
        linear-gradient(0deg, rgba(247, 242, 233, 0.12) 1px, transparent 1px);
      background-size: 58px 58px;
      mask-image: linear-gradient(90deg, transparent 0%, #000 18%, #000 86%, transparent 100%);
    }

    .hero-stage::after {
      content: '';
      position: absolute;
      inset: auto -8% -18% 34%;
      z-index: -1;
      height: 48%;
      background: radial-gradient(ellipse, rgba(202, 168, 91, 0.16), transparent 65%);
      animation: quietGlow 14s var(--ease) infinite alternate;
      pointer-events: none;
    }

    .hero-copy {
      min-height: 0;
      padding: clamp(30px, 5vw, 74px);
      display: flex;
      flex-direction: column;
      justify-content: center;
      position: relative;
      z-index: 2;
      overflow: visible;
      background: linear-gradient(90deg, rgba(8, 9, 11, 0.28), transparent);
    }

    .hero-copy::before {
      content: '';
      position: absolute;
      inset: 9% -22% 9% auto;
      width: 1px;
      background: linear-gradient(180deg, transparent, rgba(247, 242, 233, 0.2), transparent);
      pointer-events: none;
    }

    .eyebrow {
      width: max-content;
      max-width: 100%;
      margin: 0 0 18px;
      padding: 9px 13px;
      border: 1px solid rgba(247, 242, 233, 0.22);
      border-radius: 8px;
      color: rgba(247, 242, 233, 0.78);
      background: rgba(247, 242, 233, 0.06);
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    h1 {
      max-width: 780px;
      margin: 0;
      color: var(--warm-50);
      font-size: clamp(48px, 6.1vw, 112px);
      line-height: 0.9;
      font-weight: 950;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    .metallic-text {
      display: block;
      width: max-content;
      max-width: 100%;
      color: transparent;
      background: linear-gradient(95deg, #f7f2e9 0%, #aeb4bd 24%, #f7f2e9 44%, #caa85b 64%, #f7f2e9 100%);
      background-size: 220% 100%;
      background-clip: text;
      -webkit-background-clip: text;
      animation: metalSweep 9s ease-in-out infinite;
    }

    .hero-copy p {
      max-width: 560px;
      margin: 24px 0 0;
      color: rgba(247, 242, 233, 0.72);
      font-size: clamp(15px, 1.2vw, 19px);
      line-height: 1.55;
    }

    .hero-actions {
      margin-top: 34px;
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
    }

    .hero-note {
      margin-top: 28px;
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
    }

    .micro-proof {
      min-height: 0;
      padding: 0;
      display: inline-flex;
      align-items: center;
      gap: 9px;
      border: 0;
      background: transparent;
    }

    .micro-proof strong {
      display: inline;
      font-size: 13px;
      font-weight: 950;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    .micro-proof span {
      display: inline-flex;
      align-items: center;
      min-height: 32px;
      margin-top: 0;
      padding: 0 12px;
      border: 1px solid rgba(247, 242, 233, 0.18);
      border-radius: 8px;
      color: rgba(247, 242, 233, 0.68);
      background: rgba(247, 242, 233, 0.055);
      font-size: 13px;
      line-height: 1.2;
    }

    .hero-visual {
      --hero-footer-safe: clamp(146px, 17vh, 190px);
      --hero-focus-gap: clamp(32px, 3vh, 50px);
      min-height: 0;
      position: relative;
      display: grid;
      grid-template-rows: minmax(0, 1fr);
      gap: 0;
      overflow: hidden;
      border: 0;
      border-radius: 0;
      background:
        radial-gradient(ellipse at 50% 48%, rgba(247, 242, 233, 0.22), transparent 28vw),
        radial-gradient(circle at 76% 18%, rgba(31, 100, 255, 0.12), transparent 22vw),
        linear-gradient(145deg, rgba(32, 36, 44, 0.24), rgba(8, 9, 11, 0.18));
      box-shadow: none;
    }

    .hero-runway {
      min-height: 0;
      position: relative;
      display: grid;
      align-items: center;
      padding-bottom: var(--hero-footer-safe);
      overflow: hidden;
    }

    .hero-runway::before {
      content: '';
      position: absolute;
      inset: 14% 8% 12%;
      border-radius: 8px;
      background:
        linear-gradient(120deg, transparent 0 34px, rgba(247, 242, 233, 0.055) 35px 36px, transparent 37px 80px),
        radial-gradient(ellipse at 50% 62%, rgba(247, 242, 233, 0.3), rgba(247, 242, 233, 0.12) 34%, transparent 66%);
      background-size: 130px 130px, auto;
      opacity: 0.72;
      pointer-events: none;
    }

    .hero-runway::after {
      content: '';
      position: absolute;
      left: 7%;
      right: 7%;
      bottom: 12%;
      height: 28%;
      background:
        radial-gradient(ellipse at center, rgba(247, 242, 233, 0.36), rgba(247, 242, 233, 0.16) 44%, transparent 72%);
      filter: blur(1px);
      pointer-events: none;
    }

    .hero-track {
      width: max-content;
      display: flex;
      align-items: center;
      gap: clamp(28px, 3vw, 52px);
      padding: 0;
      opacity: 0.18;
      filter: saturate(0.56) brightness(0.54) blur(1.2px);
      transform: translateY(18px);
      animation: heroProductDrift 76s linear infinite;
    }

    .model-card {
      flex: 0 0 clamp(190px, 18vw, 300px);
      aspect-ratio: 3 / 4;
      overflow: hidden;
      border: 1px solid rgba(247, 242, 233, 0.12);
      border-radius: 8px;
      background: rgba(247, 242, 233, 0.05);
      box-shadow: 0 22px 34px rgba(8, 9, 11, 0.18);
      transform: translateY(22px) scale(0.78);
    }

    .model-card.is-large {
      transform: translateY(4px) scale(0.9);
      opacity: 0.5;
    }

    .model-card img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
    }

    .hero-track img {
      max-width: none;
      transform: translate3d(calc(var(--mx, 0px) * 0.012), calc(var(--my, 0px) * 0.008), 0);
    }

    .hero-focus-stage {
      position: absolute;
      left: 54%;
      bottom: calc(var(--hero-footer-safe) + var(--hero-focus-gap));
      z-index: 4;
      width: clamp(640px, 52vw, 900px);
      aspect-ratio: 4 / 3;
      max-width: none;
      transform: translate3d(calc(-50% + var(--mx, 0px) * -0.01), calc(var(--my, 0px) * -0.008), 0);
      animation: heroFocusFloat 9s var(--ease) infinite alternate;
      pointer-events: none;
    }

    .hero-focus-stage::before {
      content: '';
      position: absolute;
      inset: -2% 0 -14%;
      z-index: 0;
      border-radius: 50%;
      background:
        radial-gradient(ellipse at 52% 42%, rgba(31, 100, 255, 0.14), transparent 48%),
        radial-gradient(ellipse at center, rgba(247, 242, 233, 0.08), rgba(8, 9, 11, 0.16) 56%, transparent 80%);
      filter: blur(38px);
      opacity: 0.7;
      pointer-events: none;
    }

    .hero-focus-stage::after {
      content: '';
      position: absolute;
      inset: -2%;
      z-index: 3;
      border-radius: 18px;
      background: radial-gradient(ellipse at center, transparent 0 42%, rgba(8, 9, 11, 0.06) 66%, rgba(8, 9, 11, 0.3) 92%, rgba(8, 9, 11, 0.46) 100%);
      pointer-events: none;
    }

    .hero-focus {
      position: absolute;
      inset: 0;
      z-index: 1;
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center center;
      border-radius: 14px;
      opacity: 0;
      box-shadow: none;
      filter: saturate(1.08) contrast(1.05) drop-shadow(0 46px 84px rgba(8, 9, 11, 0.26));
      -webkit-mask-image: radial-gradient(ellipse 70% 82% at center, #000 0 52%, rgba(0, 0, 0, 0.94) 68%, rgba(0, 0, 0, 0.48) 84%, rgba(0, 0, 0, 0.12) 95%, transparent 100%);
      mask-image: radial-gradient(ellipse 70% 82% at center, #000 0 52%, rgba(0, 0, 0, 0.94) 68%, rgba(0, 0, 0, 0.48) 84%, rgba(0, 0, 0, 0.12) 95%, transparent 100%);
      transform: scale(1.04);
      animation: heroFocusCycle 32s ease-in-out infinite;
    }

    .hero-focus:nth-child(1) {
      animation-name: heroFocusFirstCycle;
      animation-delay: 0s;
    }

    .hero-focus:nth-child(2) {
      animation-delay: 9s;
    }

    .hero-focus:nth-child(3) {
      animation-delay: 17s;
    }

    .hero-focus:nth-child(4) {
      animation-delay: 24s;
    }

    .hero-edge {
      position: absolute;
      bottom: calc(var(--hero-footer-safe) + clamp(12px, 2vh, 34px));
      z-index: 1;
      width: clamp(230px, 22vw, 380px);
      max-width: none;
      border-radius: 8px;
      opacity: 0.16;
      filter: saturate(0.5) brightness(0.48) blur(1.5px) drop-shadow(0 24px 28px rgba(8, 9, 11, 0.14));
      pointer-events: none;
    }

    .hero-edge.left {
      left: 3%;
      opacity: 0.1;
      filter: saturate(0.4) brightness(0.38) blur(2px) drop-shadow(0 24px 30px rgba(8, 9, 11, 0.12));
      transform: translateY(2%) scale(0.82);
    }

    .hero-edge.right {
      right: 0;
      transform: translateY(1%) scale(0.84);
    }

    .hero-visual-footer {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      min-height: var(--hero-footer-safe);
      padding: 26px clamp(28px, 3vw, 54px) 30px clamp(96px, 12vw, 220px);
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 14px;
      align-items: start;
      align-content: start;
      color: var(--warm-50);
      background: linear-gradient(180deg, transparent, rgba(8, 9, 11, 0.72));
      border-top: 1px solid rgba(247, 242, 233, 0.1);
      z-index: 6;
    }

    .hero-visual-footer   div {
      max-width: 760px;
    }

    .hero-visual-footer strong {
      display: block;
      font-size: clamp(23px, 1.95vw, 38px);
      line-height: 0.96;
      font-weight: 950;
      text-transform: uppercase;
    }

    .hero-visual-footer strong .keep-together {
      display: inline;
      margin-top: 0;
      color: inherit;
      font-size: inherit;
      line-height: inherit;
      white-space: nowrap;
    }

    .hero-visual-footer   div   span {
      display: block;
      margin-top: 8px;
      color: rgba(247, 242, 233, 0.6);
      font-size: clamp(14px, 1vw, 17px);
      line-height: 1.45;
    }

    .pill {
      min-height: 52px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: max-content;
      max-width: 100%;
      padding: 0 24px;
      border-radius: 8px;
      border: 1px solid rgba(202, 168, 91, 0.56);
      background: linear-gradient(135deg, rgba(202, 168, 91, 0.94), rgba(228, 207, 145, 0.94));
      color: var(--warm-50);
      color: var(--ink-950);
      font-size: 13px;
      font-weight: 950;
      letter-spacing: 0;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .trust-bar {
      width: 100%;
      padding: 0 var(--safe) clamp(26px, 4vw, 52px);
    }

    .trust-inner {
      width: 100%;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      border: 1px solid var(--line);
      border-radius: 8px;
      overflow: hidden;
      background: rgba(247, 242, 233, 0.07);
      backdrop-filter: blur(18px);
    }

    .trust-item {
      min-height: 104px;
      padding: 22px;
      border-left: 1px solid var(--line);
    }

    .trust-item:first-child {
      border-left: 0;
    }

    .trust-item strong {
      display: block;
      font-size: 13px;
      font-weight: 950;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    .trust-item span {
      display: block;
      margin-top: 8px;
      color: rgba(247, 242, 233, 0.56);
      font-size: 13px;
      line-height: 1.4;
    }

    .section {
      width: 100%;
      padding: clamp(52px, 7vw, 108px) var(--safe);
    }

    .section.light {
      color: var(--ink-950);
      background:
        radial-gradient(circle at 80% 0%, rgba(31, 100, 255, 0.07), transparent 32vw),
        linear-gradient(180deg, #f7f2e9, #e9e1d3);
    }

    .section.product-section {
      padding-top: clamp(18px, 2.6vw, 38px);
    }

    .section.entry-section {
      position: relative;
      overflow: hidden;
      background:
        linear-gradient(120deg, rgba(255, 255, 255, 0.42), transparent 24%),
        radial-gradient(circle at 10% 0%, rgba(202, 168, 91, 0.16), transparent 28vw),
        radial-gradient(circle at 94% 22%, rgba(31, 100, 255, 0.08), transparent 30vw),
        linear-gradient(180deg, #f8f3ea 0%, #e8dfd1 100%);
    }

    .section.entry-section::before {
      content: '';
      position: absolute;
      inset: 0;
      opacity: 0.18;
      background:
        linear-gradient(120deg, transparent 0 34px, rgba(8, 9, 11, 0.08) 35px 36px, transparent 37px 88px),
        linear-gradient(60deg, transparent 0 44px, rgba(202, 168, 91, 0.08) 45px 46px, transparent 47px 110px);
      background-size: 132px 132px, 160px 160px;
      mask-image: linear-gradient(90deg, transparent, #000 18%, #000 82%, transparent);
      pointer-events: none;
    }

    .section.smoke {
      color: var(--ink-950);
      background:
        radial-gradient(circle at 12% 6%, rgba(202, 168, 91, 0.13), transparent 30vw),
        linear-gradient(180deg, #eef0f1, #f9f5ee);
    }

    .section.collection-section {
      padding-top: clamp(32px, 5.2vw, 76px);
      padding-bottom: clamp(34px, 4.2vw, 60px);
    }

    .section.deep {
      background:
        radial-gradient(circle at 10% 10%, rgba(27, 141, 131, 0.16), transparent 28vw),
        linear-gradient(180deg, #111318, #08090b);
    }

    .section-inner {
      position: relative;
    }

    .section-heading {
      max-width: 980px;
      margin: 0 0 clamp(26px, 4vw, 52px);
    }

    .section-heading.split {
      max-width: none;
      display: grid;
      grid-template-columns: minmax(0, 0.9fr) minmax(360px, 0.55fr);
      gap: 28px;
      align-items: end;
    }

    .section-kicker {
      display: block;
      margin-bottom: 12px;
      color: var(--gold);
      font-size: 12px;
      font-weight: 950;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    .light .section-kicker,
    .smoke .section-kicker {
      color: var(--red);
    }

    h2 {
      margin: 0;
      font-size: clamp(36px, 5vw, 86px);
      line-height: 0.94;
      font-weight: 950;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    .section-heading p {
      margin: 16px 0 0;
      color: rgba(247, 242, 233, 0.62);
      font-size: clamp(15px, 1.2vw, 18px);
      line-height: 1.55;
    }

    .light .section-heading p,
    .smoke .section-heading p {
      color: rgba(8, 9, 11, 0.62);
    }

    .entry-section .section-heading p {
      margin-top: 10px;
    }

    .entry-grid {
      display: grid;
      grid-template-columns: 1.12fr 0.88fr;
      gap: clamp(16px, 2vw, 28px);
      align-items: stretch;
    }

    .entry-panel {
      min-height: clamp(360px, 38vw, 620px);
      position: relative;
      overflow: hidden;
      display: flex;
      align-items: end;
      border-radius: 8px;
      border: 1px solid rgba(8, 9, 11, 0.1);
      background: #17191f;
      box-shadow: 0 26px 64px rgba(8, 9, 11, 0.18);
      isolation: isolate;
    }

    .entry-stack {
      display: grid;
      gap: clamp(16px, 2vw, 28px);
    }

    .entry-stack .entry-panel {
      min-height: clamp(250px, 18vw, 296px);
    }

    .entry-panel img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      opacity: 0.96;
      transform: scale(1.02);
      transition: transform 900ms var(--ease), opacity 600ms ease;
    }

    .entry-panel:hover img {
      transform: scale(1.08);
      opacity: 1;
    }

    .entry-panel.product img {
      object-fit: cover;
      object-position: center top;
      padding: 0;
      background: #111318;
    }

    .entry-slideshow {
      position: absolute;
      inset: 0;
      z-index: 0;
      overflow: hidden;
      background: #111318;
    }

    .entry-panel.product .entry-slideshow img {
      opacity: 0;
      filter: brightness(1.08) contrast(1.04) saturate(1.04);
      transform: scale(1.02);
      animation: entrySlideFade 32s ease-in-out infinite;
    }

    .entry-panel.product .entry-slideshow img:nth-child(1) {
      animation-name: entrySlideFirstFade;
      animation-delay: 0s;
    }

    .entry-panel.product .entry-slideshow img:nth-child(2) {
      animation-delay: 8s;
    }

    .entry-panel.product .entry-slideshow img:nth-child(3) {
      animation-delay: 16s;
    }

    .entry-panel.product .entry-slideshow img:nth-child(4) {
      animation-delay: 24s;
    }

    .entry-panel.print img {
      object-position: center 52%;
      filter: saturate(1.02) contrast(1.05) brightness(0.9);
    }

    .entry-panel.sheet img {
      object-position: center 54%;
      filter: saturate(1.04) contrast(1.06) brightness(0.88);
    }

    .entry-panel::after {
      content: '';
      position: absolute;
      inset: 0;
      z-index: 0;
      background:
        linear-gradient(180deg, rgba(8, 9, 11, 0.08) 0%, rgba(8, 9, 11, 0.16) 42%, rgba(8, 9, 11, 0.84) 100%),
        radial-gradient(circle at 18% 18%, rgba(247, 242, 233, 0.18), transparent 28vw);
      pointer-events: none;
    }

    .entry-panel.sheet::after {
      background:
        linear-gradient(90deg, rgba(8, 9, 11, 0.9) 0%, rgba(8, 9, 11, 0.58) 34%, rgba(8, 9, 11, 0.12) 72%),
        linear-gradient(180deg, rgba(8, 9, 11, 0.04) 0%, rgba(8, 9, 11, 0.3) 42%, rgba(8, 9, 11, 0.9) 100%),
        radial-gradient(circle at 80% 16%, rgba(202, 168, 91, 0.12), transparent 24vw);
    }

    .entry-content {
      position: relative;
      z-index: 1;
      max-width: 620px;
      padding: clamp(22px, 3vw, 42px);
    }

    .entry-content strong {
      display: block;
      margin: 0;
      color: var(--warm-50);
      text-shadow: 0 18px 36px rgba(8, 9, 11, 0.34);
      font-size: clamp(30px, 3vw, 58px);
      line-height: 0.94;
      font-weight: 950;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    .entry-content .entry-copy {
      display: block;
      margin-top: 14px;
      max-width: 520px;
      color: rgba(247, 242, 233, 0.78);
      font-size: 15px;
      line-height: 1.45;
    }

    .entry-cta {
      width: max-content;
      max-width: 100%;
      min-height: 44px;
      margin-top: 22px;
      padding: 0 18px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 8px;
      border: 1px solid rgba(202, 168, 91, 0.72);
      background: rgba(8, 9, 11, 0.5);
      color: var(--warm-50);
      box-shadow: inset 0 1px 0 rgba(247, 242, 233, 0.12), 0 14px 26px rgba(8, 9, 11, 0.28);
      font-size: 12px;
      font-weight: 950;
      text-transform: uppercase;
      backdrop-filter: blur(12px);
      transition: transform 260ms var(--ease), background 260ms ease, border-color 260ms ease;
    }

    .entry-panel:hover .entry-cta {
      transform: translateY(-2px);
      border-color: rgba(202, 168, 91, 0.95);
      background: rgba(202, 168, 91, 0.92);
      color: var(--ink-950);
    }

    .category-rail,
    .product-rail {
      display: grid;
      grid-auto-flow: column;
      grid-auto-columns: minmax(280px, 24vw);
      gap: 16px;
      overflow-x: auto;
      overscroll-behavior-inline: contain;
      scroll-snap-type: inline mandatory;
      scrollbar-width: thin;
      padding-bottom: 12px;
    }

    .product-rail {
      grid-auto-columns: clamp(300px, 17vw, 340px);
      gap: clamp(14px, 1.4vw, 22px);
    }

    .category-tile,
    .product-tile {
      scroll-snap-align: start;
      overflow: hidden;
      border-radius: 8px;
      border: 1px solid rgba(8, 9, 11, 0.12);
      background: rgba(255, 255, 255, 0.5);
      box-shadow: 0 16px 38px rgba(8, 9, 11, 0.08);
    }

    .category-tile {
      --category-art-height: clamp(300px, 31vw, 430px);
      min-height: 360px;
      display: flex;
      flex-direction: column;
      background: rgba(247, 242, 233, 0.86);
    }

    .category-art {
      width: 100%;
      height: var(--category-art-height);
      flex: 0 0 var(--category-art-height);
      min-height: 0;
      position: relative;
      display: block;
      overflow: hidden;
      background: #111318;
    }

    .category-art img {
      width: 100%;
      height: 100%;
      max-width: none;
      display: block;
      object-fit: cover;
      object-position: center;
      filter: saturate(1.03) contrast(1.04);
      transition: transform 800ms var(--ease), filter 500ms ease;
    }

    .category-tile:hover img {
      transform: scale(1.055);
      filter: saturate(1.08) contrast(1.06);
    }

    .category-label {
      min-height: 72px;
      width: 100%;
      flex: 0 0 auto;
      padding: 19px 20px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      font-size: 15px;
      font-weight: 950;
      text-transform: uppercase;
    }

    .category-label b {
      color: var(--red);
      font-size: 18px;
      line-height: 1;
    }

    .category-tile.lavalava .category-art img {
      object-position: center top;
      filter: saturate(1.09) contrast(1.07) brightness(1.12);
    }

    .category-tile.tshirts .category-art img {
      object-position: 68% 42%;
    }

    .category-tile.samoa .category-art img,
    .category-tile.tonga .category-art img {
      object-position: center 30%;
    }

    .category-tile.funeral-memorial .category-art img {
      position: relative;
      z-index: 1;
      box-sizing: border-box;
      padding: 8px 18px 8px;
      object-fit: contain;
      object-position: center;
      filter: saturate(0.96) contrast(1.05) brightness(0.94) drop-shadow(0 18px 28px rgba(0, 0, 0, 0.34));
    }

    .category-tile.funeral-memorial .category-art {
      background: #171515;
    }

    .category-tile.funeral-memorial .category-art::before {
      content: '';
      position: absolute;
      inset: -18px;
      background:
        linear-gradient(180deg, rgba(8, 9, 11, 0.2), rgba(8, 9, 11, 0.58));
      filter: blur(14px) saturate(0.82) brightness(0.46);
      transform: scale(1.08);
    }

    .category-tile.funeral-memorial .category-art::after {
      content: '';
      position: absolute;
      inset: 0;
      z-index: 2;
      pointer-events: none;
      background:
        radial-gradient(circle at 50% 44%, transparent 0 46%, rgba(8, 9, 11, 0.22) 82%),
        linear-gradient(180deg, rgba(8, 9, 11, 0.08), rgba(8, 9, 11, 0.18));
    }

    .category-tile.funeral-memorial:hover .category-art img {
      filter: saturate(0.98) contrast(1.06) brightness(0.98) drop-shadow(0 20px 30px rgba(0, 0, 0, 0.36));
    }

    .category-tile.dtf .category-art img {
      object-position: center 56%;
    }

    .studio-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.64fr);
      gap: clamp(14px, 1.8vw, 28px);
      align-items: stretch;
    }

    .print-studio-section {
      padding-top: clamp(28px, 3.8vw, 54px);
      padding-bottom: clamp(30px, 4vw, 58px);
    }

    .studio-visual {
      height: clamp(500px, 38vw, 700px);
      max-height: 78vh;
      position: relative;
      overflow: hidden;
      border-radius: 8px;
      border: 1px solid var(--line);
      background: #17191f;
      box-shadow: var(--shadow);
    }

    .studio-visual img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
      object-position: center 38%;
      filter: saturate(1) contrast(1.04) brightness(0.96);
      transform: scale(1.01) translateY(calc(var(--scroll-shift, 0px) * -0.014));
      transition: transform 800ms var(--ease);
    }

    .studio-visual::after {
      content: '';
      position: absolute;
      inset: 0;
      background:
        linear-gradient(180deg, rgba(8, 9, 11, 0.04) 0%, rgba(8, 9, 11, 0.06) 34%, rgba(8, 9, 11, 0.7) 100%),
        linear-gradient(90deg, rgba(8, 9, 11, 0.3), transparent 58%);
      pointer-events: none;
    }

    .studio-label {
      position: absolute;
      left: clamp(20px, 2.4vw, 36px);
      right: clamp(20px, 2.4vw, 36px);
      bottom: clamp(20px, 2.4vw, 34px);
      z-index: 1;
    }

    .studio-label strong {
      display: block;
      font-size: clamp(30px, 3.6vw, 62px);
      line-height: 0.9;
      font-weight: 950;
      text-transform: uppercase;
    }

    .studio-label span {
      display: block;
      max-width: 520px;
      margin-top: 10px;
      color: rgba(247, 242, 233, 0.78);
      line-height: 1.42;
    }

    .studio-side {
      display: grid;
      grid-template-rows: repeat(4, minmax(0, 1fr));
      gap: 10px;
      position: relative;
      align-content: stretch;
      z-index: 2;
    }

    .studio-side::before {
      content: '';
      position: absolute;
      left: 21px;
      top: 24px;
      bottom: 24px;
      width: 1px;
      background: linear-gradient(180deg, rgba(202, 168, 91, 0.18), rgba(202, 168, 91, 0.78), rgba(202, 168, 91, 0.18));
      pointer-events: none;
    }

    .studio-point {
      min-height: 96px;
      position: relative;
      padding: clamp(14px, 1.28vw, 19px) clamp(16px, 1.55vw, 22px) clamp(14px, 1.28vw, 19px) clamp(42px, 3.1vw, 52px);
      display: flex;
      flex-direction: column;
      justify-content: center;
      border-radius: 8px;
      border: 1px solid var(--line);
      background:
        radial-gradient(circle at 12% 12%, rgba(202, 168, 91, 0.16), transparent 34%),
        linear-gradient(135deg, rgba(29, 31, 38, 0.96), rgba(10, 11, 14, 0.92));
      box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
      transition: transform 500ms var(--ease), border-color 500ms ease, background 500ms ease;
    }

    .studio-point::before {
      content: '';
      position: absolute;
      left: 16px;
      top: 21px;
      width: 10px;
      height: 10px;
      border-radius: 50%;
      border: 1px solid rgba(202, 168, 91, 0.85);
      background: #111318;
      box-shadow: 0 0 0 5px rgba(202, 168, 91, 0.08);
    }

    .studio-point:hover {
      transform: translateY(-2px);
      border-color: rgba(202, 168, 91, 0.42);
      background:
        radial-gradient(circle at 12% 12%, rgba(202, 168, 91, 0.22), transparent 36%),
        linear-gradient(135deg, rgba(34, 36, 43, 0.98), rgba(13, 14, 18, 0.94));
    }

    .studio-point b {
      color: var(--gold);
      font-size: 11px;
      letter-spacing: 0;
      text-transform: uppercase;
    }

    .studio-point strong {
      display: block;
      margin-top: 6px;
      font-size: clamp(17px, 1.42vw, 23px);
      line-height: 1.04;
      text-transform: uppercase;
    }

    .studio-point span {
      display: block;
      max-width: 360px;
      margin-top: 6px;
      color: rgba(247, 242, 233, 0.62);
      font-size: 13px;
      line-height: 1.36;
    }

    .memorial {
      min-height: clamp(500px, 48vw, 760px);
      position: relative;
      overflow: hidden;
      display: grid;
      grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
      border-radius: 8px;
      border: 1px solid rgba(8, 9, 11, 0.12);
      background:
        linear-gradient(135deg, rgba(247, 242, 233, 0.92), rgba(215, 220, 225, 0.92)),
        radial-gradient(circle at 12% 88%, rgba(202, 168, 91, 0.14), transparent 34%);
      box-shadow: 0 24px 66px rgba(8, 9, 11, 0.14);
    }

    .memorial-section {
      padding-top: clamp(22px, 3vw, 48px);
    }

    .memorial-copy {
      padding: clamp(26px, 4vw, 56px);
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .memorial-copy h2 {
      color: var(--ink-950);
    }

    .memorial-copy p {
      max-width: 600px;
      margin: 18px 0 0;
      color: rgba(8, 9, 11, 0.64);
      font-size: clamp(15px, 1.2vw, 18px);
      line-height: 1.6;
    }

    .memorial-visual {
      min-height: 0;
      padding: clamp(12px, 2vw, 30px);
      display: grid;
      justify-items: center;
      align-items: center;
    }

    .memorial-frame {
      width: min(100%, clamp(415px, 38.2vw, 578px));
      aspect-ratio: 0.72 / 1;
      overflow: hidden;
      border-radius: 8px;
      padding: clamp(8px, 1vw, 14px);
      background: linear-gradient(180deg, #f4f0e8, #dfd8cf);
      box-shadow: 0 26px 64px rgba(8, 9, 11, 0.18);
    }

    .memorial-frame img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center;
      opacity: 1;
      transform: scale(1);
      transition: transform 900ms var(--ease);
    }

    .memorial:hover .memorial-frame img {
      transform: scale(1.012);
    }

    .product-tile {
      min-height: 0;
      display: grid;
      grid-template-rows: auto 1fr;
      color: var(--ink-950);
      background: rgba(247, 242, 233, 0.96);
      text-decoration: none;
      transition: transform 320ms var(--ease), box-shadow 320ms var(--ease), border-color 320ms ease;
    }

    .product-media {
      position: relative;
      aspect-ratio: 4 / 5;
      min-height: 0;
      display: block;
      overflow: hidden;
      background:
        linear-gradient(135deg, #f7f2e9, #e8e1d3),
        radial-gradient(circle at center, rgba(202, 168, 91, 0.16), transparent 34%);
    }

    .product-media::after {
      content: '';
      position: absolute;
      inset: 0;
      background:
        linear-gradient(180deg, rgba(247, 242, 233, 0.04), rgba(202, 168, 91, 0.07) 46%, rgba(8, 9, 11, 0.07)),
        radial-gradient(circle at 50% 20%, rgba(247, 242, 233, 0.08), transparent 42%);
      pointer-events: none;
    }

    .product-media img {
      width: 100%;
      height: 100%;
      max-width: none;
      display: block;
      object-fit: cover;
      object-position: var(--product-position, center top);
      filter: brightness(1.03) contrast(0.96) saturate(0.94) sepia(0.04);
      transform: scale(var(--product-scale, 1));
      transform-origin: var(--product-origin, center top);
      transition: transform 700ms var(--ease);
    }

    .product-tile:hover {
      transform: translateY(-3px);
      border-color: rgba(202, 168, 91, 0.44);
      box-shadow: 0 22px 48px rgba(8, 9, 11, 0.14);
    }

    .product-tile:hover .product-media img {
      transform: scale(var(--product-hover-scale, 1.055));
    }

    .product-info {
      padding: 16px;
      display: grid;
      gap: 9px;
      align-content: start;
    }

    .product-info strong {
      font-size: 17px;
      line-height: 1.12;
      text-transform: uppercase;
    }

    .product-info span {
      color: rgba(8, 9, 11, 0.6);
      font-size: 13px;
      line-height: 1.45;
    }

    .product-info .product-tag {
      color: rgba(8, 9, 11, 0.54);
      font-size: 10px;
      font-weight: 950;
      letter-spacing: 0;
      line-height: 1.1;
      text-transform: uppercase;
    }

    .product-info .product-meta {
      color: rgba(8, 9, 11, 0.64);
    }

    .product-action {
      width: max-content;
      min-height: 36px;
      padding: 0 14px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 999px;
      border: 1px solid rgba(202, 168, 91, 0.72);
      background: rgba(8, 9, 11, 0.82);
      color: var(--warm-50) !important;
      font-size: 11px !important;
      font-weight: 950;
      line-height: 1;
      text-transform: uppercase;
      transition: transform 260ms var(--ease), background 260ms ease, color 260ms ease;
    }

    .product-tile:hover .product-action {
      transform: translateX(3px);
      background: rgba(202, 168, 91, 0.94);
      color: var(--ink-950) !important;
    }

    .bottom-cta {
      min-height: clamp(420px, 44vw, 650px);
      display: grid;
      place-items: center;
      padding: clamp(44px, 7vw, 120px) var(--safe);
      position: relative;
      overflow: hidden;
      text-align: center;
      background:
        linear-gradient(90deg, rgba(247, 242, 233, 0.06) 1px, transparent 1px),
        linear-gradient(0deg, rgba(247, 242, 233, 0.04) 1px, transparent 1px),
        radial-gradient(circle at 50% 18%, rgba(202, 168, 91, 0.14), transparent 34%),
        linear-gradient(180deg, #101217, #08090b);
      background-size: 52px 52px, 52px 52px, auto, auto;
    }

    .bottom-cta-inner {
      width: min(980px, 100%);
    }

    .bottom-cta h2 {
      color: var(--warm-50);
      font-size: clamp(40px, 6vw, 96px);
    }

    .bottom-cta p {
      max-width: 680px;
      margin: 18px auto 0;
      color: rgba(247, 242, 233, 0.66);
      font-size: clamp(15px, 1.2vw, 18px);
      line-height: 1.55;
    }

    .bottom-actions {
      margin-top: 28px;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 12px;
    }

    .footer {
      color: rgba(247, 242, 233, 0.62);
      background: #08090b;
      border-top: 1px solid var(--line);
    }

    .footer-inner {
      min-height: 130px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 22px;
    }

    .footer .brand {
      min-width: 0;
      box-shadow: none;
    }

    .footer .brand-logo {
      width: 180px;
    }

    .reveal {
      opacity: 0;
      transform: translateY(34px);
      transition: opacity 800ms ease, transform 800ms var(--ease);
    }

    .reveal.is-visible {
      opacity: 1;
      transform: translateY(0);
    }

    @keyframes heroProductDrift {
      from {
        transform: translateX(0);
      }

      to {
        transform: translateX(calc(-50% - 17px));
      }
    }

    @keyframes heroFocusFloat {
      from {
        transform: translate3d(calc(-50% + var(--mx, 0px) * -0.01), calc(0px + var(--my, 0px) * -0.008), 0);
      }

      to {
        transform: translate3d(calc(-50% + var(--mx, 0px) * -0.01), calc(-12px + var(--my, 0px) * -0.008), 0);
      }
    }

    @keyframes heroFocusCycle {
      0% {
        opacity: 0;
        transform: scale(0.995);
      }

      4%, 25% {
        opacity: 1;
        transform: scale(1.005);
      }

      30%, 100% {
        opacity: 0;
        transform: scale(1.03);
      }
    }

    @keyframes heroFocusFirstCycle {
      0%, 25% {
        opacity: 1;
        transform: scale(1.005);
      }

      30%, 100% {
        opacity: 0;
        transform: scale(1.03);
      }
    }

    @keyframes entrySlideFade {
      0% {
        opacity: 0;
        transform: scale(1.02);
      }

      5%, 25% {
        opacity: 1;
        transform: scale(1.045);
      }

      31%, 100% {
        opacity: 0;
        transform: scale(1.065);
      }
    }

    @keyframes entrySlideFirstFade {
      0%, 25% {
        opacity: 1;
        transform: scale(1.045);
      }

      31%, 100% {
        opacity: 0;
        transform: scale(1.065);
      }
    }

    @keyframes glowShift {
      from {
        transform: translate3d(0, 0, 0) scale(1);
      }

      to {
        transform: translate3d(-8vw, 7vh, 0) scale(1.12);
      }
    }

    @keyframes quietGlow {
      from {
        transform: translate3d(-3%, 2%, 0);
        opacity: 0.6;
      }

      to {
        transform: translate3d(4%, -4%, 0);
        opacity: 1;
      }
    }

    @keyframes metalSweep {
      0%, 38% {
        background-position: 0% 50%;
      }

      70%, 100% {
        background-position: 100% 50%;
      }
    }

    @media (max-width: 1180px) {
      .nav-links {
        display: none;
      }

      .hero-stage,
      .entry-grid,
      .studio-grid,
      .memorial,
      .section-heading.split {
        grid-template-columns: 1fr;
      }

      .hero-copy,
      .hero-visual {
        min-height: 560px;
      }

      .hero-visual {
        min-height: 700px;
      }

      .hero-focus-stage {
        left: 50%;
        width: min(78vw, 660px);
      }

      .hero-visual-footer {
        padding-left: clamp(34px, 9vw, 120px);
      }

      .entry-stack {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .entry-panel {
        min-height: 460px;
      }

      .entry-stack .entry-panel {
        min-height: 320px;
      }

      .trust-inner {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .trust-item:nth-child(3) {
        border-left: 0;
        border-top: 1px solid var(--line);
      }

      .trust-item:nth-child(4) {
        border-top: 1px solid var(--line);
      }
    }

    @media (min-width: 1181px) and (max-height: 900px) {
      .hero-visual {
        --hero-footer-safe: clamp(142px, 16vh, 172px);
        --hero-focus-gap: 30px;
      }

      .hero-focus-stage {
        width: clamp(620px, 48vw, 820px);
      }

      .hero-visual-footer strong {
        font-size: clamp(24px, 1.9vw, 34px);
      }
    }

    @media (max-width: 720px) {
      :root {
        --safe: 16px;
      }

      .top-strip-inner {
        min-height: 34px;
        justify-content: center;
        text-align: center;
      }

      .top-strip-inner span:last-child,
      .nav-actions .btn,
      .nav-actions .icon-btn:first-child {
        display: none;
      }

      .nav-inner {
        min-height: 74px;
      }

      .brand {
        min-width: 0;
        padding: 8px 10px;
      }

      .brand-logo {
        width: 154px;
      }

      .mobile-drawer {
        position: fixed;
        inset: 0;
        z-index: 70;
        display: grid;
        grid-template-columns: minmax(0, 318px) 1fr;
        opacity: 0;
        pointer-events: none;
        transition: opacity 240ms ease;
      }

      body.menu-open .mobile-drawer {
        opacity: 1;
        pointer-events: auto;
      }

      .drawer-panel {
        min-height: 100svh;
        padding: 92px 18px 24px;
        background: rgba(16, 18, 23, 0.98);
        border-right: 1px solid var(--line);
        box-shadow: 20px 0 60px rgba(0, 0, 0, 0.38);
        transform: translateX(-100%);
        transition: transform 320ms var(--ease);
      }

      body.menu-open .drawer-panel {
        transform: translateX(0);
      }

      .drawer-panel a {
        min-height: 58px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid var(--line);
        color: rgba(247, 242, 233, 0.86);
        font-size: 14px;
        font-weight: 950;
        text-transform: uppercase;
      }

      .drawer-backdrop {
        border: 0;
        background: rgba(0, 0, 0, 0.56);
      }

      .hero {
        min-height: 0;
        padding-top: 16px;
      }

      .hero-stage {
        min-height: 0;
        grid-template-columns: 1fr;
        background:
          radial-gradient(circle at 50% 60%, rgba(247, 242, 233, 0.14), transparent 52vw),
          linear-gradient(180deg, rgba(32, 36, 44, 0.96), rgba(8, 9, 11, 0.98));
      }

      .hero-stage::before {
        opacity: 0.12;
        mask-image: linear-gradient(180deg, transparent 0%, #000 18%, #000 92%, transparent 100%);
      }

      .hero-copy {
        min-height: 0;
        padding: 30px 20px 22px;
        border-radius: 8px;
        background: transparent;
      }

      .hero-copy::before {
        display: none;
      }

      h1 {
        font-size: clamp(42px, 12vw, 64px);
        line-height: 0.96;
      }

      .hero-copy p {
        margin-top: 18px;
      }

      .hero-actions {
        display: grid;
        grid-template-columns: 1fr;
      }

      .btn {
        width: 100%;
      }

      .hero-note {
        gap: 8px;
      }

      .micro-proof {
        width: auto;
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 8px;
      }

      .micro-proof strong {
        color: rgba(247, 242, 233, 0.84);
      }

      .micro-proof span {
        width: auto;
        min-height: 34px;
      }

      .hero-visual {
        --hero-footer-safe: 0px;
        --hero-focus-gap: 0px;
        min-height: 0;
        grid-template-rows: minmax(350px, 42vh) auto;
        border-radius: 8px;
      }

      .hero-runway {
        min-height: 350px;
        padding-bottom: 0;
      }

      .hero-track {
        display: none;
      }

      .model-card {
        flex-basis: 190px;
        transform: translateY(30px) scale(0.72);
      }

      .model-card.is-large {
        transform: translateY(12px) scale(0.82);
      }

      .hero-runway::before {
        inset: 12px;
        background-size: 96px 96px, auto;
      }

      .hero-focus-stage {
        left: 50%;
        width: min(90vw, 410px);
        bottom: 22px;
        transform: translate3d(calc(-50% + var(--mx, 0px) * -0.006), calc(var(--my, 0px) * -0.006), 0);
      }

      .hero-edge {
        width: min(56vw, 230px);
        opacity: 0.06;
        bottom: 22px;
        filter: saturate(0.36) brightness(0.32) blur(2.6px);
      }

      .hero-edge.left {
        left: -16%;
      }

      .hero-edge.right {
        display: none;
      }

      .hero-visual-footer {
        position: relative;
        grid-template-columns: 1fr;
        min-height: 0;
        padding: 20px 20px 24px;
        background: linear-gradient(180deg, rgba(8, 9, 11, 0.04), rgba(8, 9, 11, 0.7));
      }

      .hero-visual-footer strong {
        font-size: 28px;
      }

      .pill {
        width: max-content;
      }

      .trust-inner,
      .entry-stack,
      .studio-grid,
      .memorial {
        grid-template-columns: 1fr;
      }

      .trust-item,
      .trust-item:nth-child(2),
      .trust-item:nth-child(3),
      .trust-item:nth-child(4) {
        min-height: 90px;
        border-left: 0;
        border-top: 1px solid var(--line);
      }

      .trust-item:first-child {
        border-top: 0;
      }

      .section {
        padding-top: 60px;
        padding-bottom: 60px;
      }

      .section-heading {
        margin-bottom: 24px;
      }

      .entry-panel {
        min-height: 360px;
        border-radius: 8px;
      }

      .entry-panel.product {
        min-height: 430px;
      }

      .entry-stack .entry-panel {
        min-height: 310px;
      }

      .entry-panel.product img {
        object-position: center top;
      }

      .entry-content {
        padding: 22px;
      }

      .entry-content strong {
        font-size: clamp(28px, 9vw, 44px);
      }

      .entry-content .entry-copy {
        max-width: 92%;
      }

      .category-rail,
      .product-rail {
        grid-auto-columns: minmax(248px, 78vw);
        margin-left: calc(var(--safe) * -1);
        margin-right: calc(var(--safe) * -1);
        padding-left: var(--safe);
        padding-right: var(--safe);
      }

      .product-rail {
        grid-auto-columns: minmax(260px, 82vw);
      }

      .studio-visual {
        height: min(420px, 112vw);
        min-height: 330px;
        max-height: none;
        border-radius: 8px;
      }

      .studio-visual img {
        object-position: center 36%;
        transform: scale(1.01);
      }

      .studio-label {
        left: 20px;
        right: 20px;
        bottom: 20px;
      }

      .studio-label strong {
        font-size: clamp(28px, 9vw, 38px);
      }

      .studio-label span {
        max-width: 96%;
        font-size: 13px;
        line-height: 1.38;
      }

      .studio-side {
        grid-template-rows: none;
        gap: 12px;
      }

      .studio-point {
        min-height: 126px;
      }

      .memorial {
        min-height: 0;
        border-radius: 8px;
      }

      .memorial-section {
        padding-top: 28px;
      }

      .memorial-copy {
        padding: 28px 22px 14px;
      }

      .memorial-visual {
        padding: 18px;
      }

      .product-tile {
        min-height: 0;
      }

      .footer-inner {
        min-height: 160px;
        align-items: flex-start;
        justify-content: center;
        flex-direction: column;
      }
    }

    @media (min-width: 1181px) and (max-width: 1500px) {
      .hero-stage {
        grid-template-columns: minmax(500px, 0.82fr) minmax(0, 1.18fr);
      }

      .hero-copy {
        padding: clamp(34px, 5vw, 58px);
      }

      h1 {
        max-width: 640px;
        font-size: clamp(42px, 4.1vw, 62px);
        line-height: 0.98;
      }

      .hero-copy p {
        max-width: 460px;
      }

      .hero-focus-stage {
        width: clamp(560px, 46vw, 740px);
      }
    }

    @media (max-width: 720px) {
      html,
      body,
      .site-shell,
      .ucp-injected-home {
        max-width: 100vw;
        overflow-x: hidden;
      }

      .hero {
        padding: 12px 0 28px;
        justify-items: start;
      }

      .hero-stage {
        width: min(100%, 390px);
        max-width: 100%;
        margin-inline: 0;
      }

      .hero-copy {
        padding: 24px 14px 18px;
      }

      h1 {
        width: min-content;
        max-width: 100%;
        font-size: clamp(30px, 8.8vw, 36px);
        line-height: 1;
      }

      .metallic-text {
        width: auto;
      }

      .eyebrow {
        font-size: 10px;
        padding: 8px 10px;
      }

      .hero-copy p {
        max-width: 100%;
        font-size: 14px;
        line-height: 1.48;
        overflow-wrap: break-word;
      }

      .hero-actions {
        margin-top: 24px;
      }

      .hero-actions .btn {
        min-width: 0;
        min-height: 46px;
        padding: 0 12px;
        white-space: normal;
        text-align: center;
      }

      .micro-proof strong,
      .micro-proof span {
        font-size: 12px;
      }

      .hero-visual {
        grid-template-rows: minmax(285px, 36vh) auto;
      }

      .hero-runway {
        min-height: 285px;
      }

      .hero-focus-stage {
        width: min(82vw, 330px);
        bottom: 18px;
      }

      .hero-visual-footer {
        padding: 18px 14px 22px;
      }

      .hero-visual-footer strong {
        font-size: 24px;
        line-height: 1.02;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      *,
      *::before,
      *::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 1ms !important;
      }

      .reveal {
        opacity: 1;
        transform: none;
      }
    }
  
/* uc-premium-homepage-v1 css end */