.lc-cinematic-home .hero {
  padding: clamp(16px, 3vw, 36px) 0;
  background: #071620;
  color: #edfbff;
  border-bottom: 1px solid #1c3b4c;
}
.lc-cinematic-home .hero-grid {
  position: relative;
  isolation: isolate;
  grid-template-columns: minmax(0, 54fr) minmax(0, 46fr);
  align-items: stretch;
  gap: 0;
  width: min(1200px, calc(100% - 40px));
  min-height: 500px;
  border: 1px solid #3f7892;
  border-radius: 24px 5px 24px 5px;
  overflow: hidden;
  background: radial-gradient(ellipse at top left, #14374d 0, #081c2a 58%);
  box-shadow: 0 18px 46px #030c1466;
}
.lc-cinematic-scene {
  grid-column: 1;
  grid-row: 1;
  position: relative;
  overflow: hidden;
  min-width: 0;
  background: #0b2a3a;
}
.lc-cinematic-scene::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, #081c2a 0%, transparent 31%),
              linear-gradient(0deg, #081c2a99 0%, transparent 24%);
}
.lc-cinematic-frame {
  position: absolute;
  top: 50%;
  right: 0;
  width: max(100%, 750px);
  aspect-ratio: 3 / 2;
  transform: translateY(-50%) scaleX(-1);
}
.lc-cinematic-art {
  position: relative;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.lc-cinematic-art img {
  display: block;
  width: 100%;
  height: 100%;
  filter: saturate(.82) brightness(1.1);
}
.lc-warden-chest {
  position: absolute;
  left: 30.1%;
  top: 58.4%;
}
.lc-warden-chest::before {
  content: "";
  position: absolute;
  width: 64px;
  height: 64px;
  inset: -32px auto auto -32px;
  border-radius: 50%;
  background: radial-gradient(circle, #d6faff 0%, #80e5ff99 23%, transparent 66%);
  animation: lc-warden-glow 4.8s ease-in-out infinite;
}
@keyframes lc-warden-glow {
  0%, 46%, 100% {opacity: .22;transform: scale(.77)}
  60% {opacity: .84;transform: scale(1.25)}
  76% {opacity: .32;transform: scale(.93)}
}
.lc-cinematic-home .hero-copy {
  grid-column: 2;
  grid-row: 1;
  z-index: 1;
  align-self: center;
  min-width: 0;
  padding: 35px clamp(23px, 4.1vw, 60px);
  text-align: left;
}
.lc-cinematic-home .hero .lc-hero-wordmark {
  position: relative;
  width: 100%;
  max-width: 510px;
  margin: 0 auto 3px 0;
  line-height: 1;
}
.lc-hero-wordmark img {
  display: block;
  width: 100%;
  height: auto;
}
.lc-cinematic-home .hero h2 {color: #edfbff;margin: 0 0 4px}
.lc-cinematic-home .hero p {color: #c5e0e9;max-width: 43ch;margin: 0 auto 0 0}
.lc-cinematic-home .hero .kicker {
  gap: 8px;
  padding: 5px 10px;
  background: #102d3d;
  border-color: #335e72;
  color: #b2edf4;
  font-size: .78rem;
  letter-spacing: 0;
}
.lc-hero-address {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px 12px;
  margin-top: 16px;
  color: #c9edf8;
  font-size: .82rem;
  text-decoration: none;
}
.lc-hero-address bdi {
  color: #9cf1fa;
  font: 700 .86rem/1.5 Tahoma, Arial, sans-serif;
  overflow-wrap: anywhere;
}
.lc-hero-address:hover bdi {text-decoration: underline}
.lc-cinematic-home .hero-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  margin: 13px 0 0;
}
.lc-cinematic-home .hero-actions .btn {
  min-height: 44px;
  margin: 0;
  padding: 7px 13px;
  border: 1px solid #3f677b;
  border-radius: 10px;
  background: #112e41;
  color: #f0faff;
  font-size: .85rem;
  box-shadow: none;
}
.lc-cinematic-home .hero-actions .btn:hover {background: #1a4056;border-color: #6adce8}
.lc-cinematic-home .hero-actions .portal-cta {
  background: #84edf5;
  color: #092936;
  border-color: #adf6fa;
}
.lc-cinematic-home .hero-actions .portal-cta:hover {background: #a8f7fc}
.lc-cinematic-home .hero :is(a,button):focus-visible {outline: 2px solid #acf9ff;outline-offset: 3px}
.lc-cinematic-home #ip {scroll-margin-top: 86px}
.lc-cinematic-home .warden-portal-dialog {
  --surface-strong: #102331;
  --surface: #132d3c;
  --card: #0b1b29;
  --line: #346478;
  --line-strong: #58a1af;
  --text: #effcff;
  --muted: #c0dce6;
  --primary: #7ae8f4;
  --primary-2: #a5f7fa;
  --accent: #79e6f0;
  color-scheme: dark;
}
.lc-cinematic-home .warden-portal-dialog .primary {color: #082a38}
.lc-cinematic-home .warden-portal-dialog .secondary {color: #eef9fb;background: #183747}
.lc-cinematic-home .lc-discover-item,
.lc-cinematic-home .armory-quick-item {
  background: linear-gradient(140deg,#102f3f,#0b2234);
  border-color: #3e839c;
  color: #f0fcff;
}
.lc-cinematic-home .lc-discover-item:hover,
.lc-cinematic-home .armory-quick-item:hover {border-color: #50c5e2}
.lc-cinematic-home .lc-discover-item .lc-go {color: #a4f3fa}
.lc-portal-pulse[hidden] {display: none}
.lc-portal-pulse {
  position: absolute;
  inset: 0 auto auto 0;
  width: 0;
  height: 0;
  pointer-events: none;
}
.lc-portal-pulse::before,
.lc-portal-pulse::after {
  content: "";
  position: absolute;
  inset: -34px auto auto -34px;
  width: 68px;
  height: 68px;
  border: 2px dashed #c2f7ff;
  border-radius: 50%;
  box-shadow: 0 0 12px #80e5ff, inset 0 0 8px #80e5ff;
  animation: lc-ice-echo 590ms cubic-bezier(.12,.51,.42,1) both;
}
.lc-portal-pulse::after {animation-delay: 130ms}
@keyframes lc-ice-echo {
  0% {opacity: 0;transform: scale(.32)}
  16% {opacity: 1}
  100% {opacity: 0;transform: scale(7)}
}
@media(max-width: 900px) {
  .lc-cinematic-home .hero-grid {
    grid-template-columns: minmax(0, 49fr) minmax(0, 51fr);
    min-height: 445px;
  }
  .lc-cinematic-frame {width: max(100%, 668px)}
}
@media(max-width: 680px) {
  .lc-cinematic-home .hero-grid {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
    width: calc(100% - 24px);
  }
  .lc-cinematic-frame {
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
    transform: scaleX(-1);
  }
  .lc-cinematic-scene::after {
    background: linear-gradient(0deg, #081c2a 0%, transparent 38%);
  }
  .lc-cinematic-home .hero-copy {
    grid-column: 1;
    grid-row: 2;
    padding: 5px 18px 23px;
    text-align: right;
  }
  .lc-cinematic-home .hero .lc-hero-wordmark {margin: 0 0 3px auto}
  .lc-cinematic-home .hero p {margin-inline: 0 auto}
  .lc-cinematic-home .hero-actions {justify-content: flex-start}
}
@media(prefers-reduced-motion:reduce) {
  .lc-portal-pulse {display: none}
  .lc-warden-chest::before {animation: none;opacity: .35}
  .lc-cinematic-art {transform: none!important}
}

.ice-divider{
  --glacier:#6ecdfb;
  position:relative;isolation:isolate;display:grid;place-items:center;
  min-height:clamp(76px,11vw,126px);
  background:linear-gradient(#071620,#071726 80%);
}
.ice-divider::before{
  content:"";position:absolute;inset-inline:4%;height:2px;top:56%;
  background:linear-gradient(90deg,transparent,#285b7c 18%,#8ee4ff 50%,#285b7c 82%,transparent);
  box-shadow:0 3px #19354a;
}
.ice-formation{
  position:relative;width:min(78vw,505px);aspect-ratio:6.7;direction:ltr;
  filter:drop-shadow(0 0 12px #48cbf52e);
}
.ice-block{
  position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);
  clip-path:polygon(0 20%,10% 20%,10% 0,89% 0,89% 14%,100% 14%,100% 78%,88% 78%,88% 100%,12% 100%,12% 85%,0 85%);
  background:
    linear-gradient(180deg,#d2f5ff 0 15%,#94d7f7 15% 28%,transparent 28%),
    linear-gradient(90deg,#4f9bc4 0 18%,#69b5da 18% 62%,#3274a2 62% 100%);
  box-shadow:inset 0 -5px #1b537e;
}
.ice-block:nth-child(even){filter:brightness(.78)}
.ice-core{
  position:absolute;z-index:2;left:50%;top:2%;width:9%;height:85%;
  transform:translateX(-50%);
  clip-path:polygon(50% 0,100% 27%,100% 73%,50% 100%,0 73%,0 27%);
  background:
    linear-gradient(145deg,#e8fbff 0 2%,transparent 48%),
    linear-gradient(90deg,#72ddff 0 48%,#e4fbff 48% 52%,#1b85c9 52%);
  box-shadow:inset 0 0 12px #fff9;
}
.ice-shard{
  position:absolute;top:27%;width:5%;height:51%;
  clip-path:polygon(44% 0,100% 26%,91% 75%,43% 100%,0 70%,0 24%);
  background:linear-gradient(90deg,#b6eeff 0 44%,#398fc4 45%);
}
.ice-shard.left{left:41%;transform:rotate(-30deg)}
.ice-shard.right{right:41%;transform:rotate(30deg)}
.ice-base{
  position:absolute;z-index:3;left:42%;top:69%;width:16%;height:29%;
  clip-path:polygon(0 0,100% 0,100% 70%,80% 70%,80% 100%,48% 100%,48% 80%,12% 80%,12% 64%,0 64%);
  background:linear-gradient(180deg,#e0f6ff 0 20%,#7dbee1 20% 48%,transparent 48%),
             linear-gradient(90deg,#377ea9 32%,#67b0d5 32% 65%,#28668d 65%);
}

@supports (mask-image: url("legend-craft-ice-wordmark.webp")) {
  .lc-hero-wordmark::after {
    content: "";
    pointer-events: none;
    position: absolute;
    inset: 0;
    background: linear-gradient(112deg, transparent 44%, #d7f8ff66 50%, transparent 56%) no-repeat;
    background-size: 250% 100%;
    mask: url("legend-craft-ice-wordmark.webp") center / 100% 100% no-repeat;
    animation: lc-logo-gleam 9s ease-in-out infinite;
  }
}
@keyframes lc-logo-gleam {
  0%, 74% {background-position: 100% 0}
  91%, 100% {background-position: 0 0}
}

.lc-frost-dust {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}
.lc-frost-dust span {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: var(--size);
  height: var(--size);
  background: #a0ddff;
  opacity: .25;
  animation: lc-frost-drift var(--duration) linear var(--delay) infinite;
}
@keyframes lc-frost-drift {
  0% {transform: translate(0, -18px);opacity: 0}
  22% {opacity: .25}
  76% {opacity: .21}
  100% {transform: translate(-12px, 29px);opacity: 0}
}

.lc-ice-navigation {
  background: #071726;
  color: #eefaff;
  padding: 0 0 clamp(19px, 3vw, 34px);
}
.lc-ice-navigation h2 {
  margin: 0 0 12px;
  font-size: clamp(1.1rem, 2vw, 1.4rem);
}
.lc-ice-navigation .container {
  max-width: 960px;
}
.lc-ice-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(12px, 2.5vw, 27px);
}
.lc-ice-card {
  display: grid;
  gap: 8px;
  align-content: start;
  min-width: 0;
  padding: 4px 4px 8px;
  text-align: center;
  color: #f0faff;
  text-decoration: none;
  border-radius: 8px;
}
.lc-ice-card-art {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: var(--crop-ratio);
  transition: filter .2s ease, transform .2s ease;
}
.lc-ice-card-art img {
  position: absolute;
  top: var(--art-top);
  left: var(--art-left);
  width: var(--art-width);
  height: auto;
  max-width: none;
  display: block;
}
.lc-ice-card:is(:hover, :focus-visible, :active) .lc-ice-card-art {
  filter: drop-shadow(0 0 8px #71d9ff70) brightness(1.10);
}
.lc-ice-card:focus-visible {outline: 2px solid #dcf8ff;outline-offset: 3px}
.lc-ice-card:active .lc-ice-card-art {transform: translateY(2px)}
.lc-ice-card-copy {display: grid;gap: 2px}
.lc-ice-card-copy strong {font-size: 1rem;line-height: 1.5}
.lc-ice-card-copy small {color: #bcd7e7;font-size: .76rem;line-height: 1.55}
@media (max-width: 620px) {
  .lc-ice-grid {grid-template-columns: minmax(0, 305px);justify-content: center}
}
@media (max-width: 760px) {
  .ice-formation {width: min(88vw, 505px)}
  .lc-frost-dust span:nth-child(n+6) {display: none}
}
@media (prefers-reduced-motion: reduce) {
  .lc-hero-wordmark::after {display: none}
  .lc-frost-dust span {animation: none;opacity: .15}
  .lc-ice-card-art {transition: none}
  .lc-ice-card:active .lc-ice-card-art {transform: none}
}