/* Quest template • story block 02. Isolated: no changes to approved quest hero or frozen site pages. */
.qt-story{
  position:relative;isolation:isolate;overflow:hidden;
  padding:clamp(82px,8.5vw,150px) 0 48px;
  background:
    radial-gradient(ellipse at 78% 50%,rgba(9,74,87,.29) 0%,transparent 56%),
    radial-gradient(ellipse at 4% 105%,rgba(30,40,93,.20),transparent 55%),
    #02111e;
  border-top:1px solid rgba(87,215,235,.10);
}
.qt-story::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.24;
  background-image:linear-gradient(90deg,rgba(60,191,213,.09) 1px,transparent 1px),
    linear-gradient(rgba(60,191,213,.07) 1px,transparent 1px);
  background-size:120px 120px;
  mask-image:linear-gradient(90deg,transparent 0%,#000 62%,#000 100%);
}
.qt-story-wrap{
  position:relative;z-index:1;margin:0 auto;width:min(1460px,calc(100% - 96px));
  display:grid;grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr);
  gap:clamp(40px,6vw,110px);align-items:center;
}
.qt-story-copy{min-width:0;padding:10px 0 30px}
.qt-story-kicker{display:flex;align-items:center;gap:13px;margin:0 0 42px;
  color:#60e9f7;font-size:12px;font-weight:900;letter-spacing:.18em}
.qt-story-kicker-line{display:block;width:34px;height:2px;background:#4ce7f5;flex:0 0 auto}
.qt-story-pretitle{margin:0 0 25px;color:#93b3c3;font-size:11px;letter-spacing:.21em;font-weight:850}
.qt-story h2{margin:0;color:#f6fbff;font-size:clamp(39px,4.65vw,72px);font-weight:950;line-height:.99;
  letter-spacing:-.057em;text-transform:uppercase;text-wrap:balance}
.qt-story h2 span{color:#4ce7f5;display:block;text-shadow:0 0 36px rgba(76,231,245,.08)}
.qt-story-intro{margin:35px 0 18px;max-width:580px;color:#edfaff;font-size:clamp(18px,1.5vw,24px);
  font-weight:650;line-height:1.44;text-wrap:pretty}
.qt-story-detail{margin:0 0 15px;max-width:630px;color:#acc4d1;font-size:clamp(15px,1.05vw,17px);line-height:1.8;text-wrap:pretty}
.qt-story-moods{display:flex;flex-wrap:wrap;gap:10px;margin-top:35px}
.qt-story-moods span{display:inline-flex;align-items:center;gap:9px;min-height:40px;padding:9px 14px;
  background:rgba(6,34,48,.72);border:1px solid rgba(87,226,241,.23);border-radius:10px;
  font-size:12px;color:#dceaf4;font-weight:800}
.qt-story-moods i{font-style:normal;color:#4ce7f5;font-size:13px}
.qt-story-art{position:relative;min-width:0;min-height:490px;aspect-ratio:1.12/1;margin:0;border:1px solid rgba(98,224,238,.32);
  border-radius:28px;overflow:hidden;background:#071f26;box-shadow:0 35px 85px rgba(0,0,0,.27),0 0 70px rgba(30,226,237,.045)}
.qt-story-art img{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:59% 46%;
  filter:brightness(1.13) saturate(1.16) contrast(1.06)}
.qt-story-art-shade{position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(0deg,rgba(0,10,22,.92) 0%,transparent 37%,transparent 69%,rgba(0,10,22,.54) 100%),
  linear-gradient(90deg,rgba(0,19,27,.20),transparent 46%)}
.qt-story-art::after{content:"";position:absolute;inset:0;border:1px solid rgba(155,253,255,.08);border-radius:inherit;pointer-events:none}
.qt-story-art-top{position:absolute;top:24px;left:27px;display:inline-flex;align-items:center;gap:12px;
  border:1px solid rgba(112,238,246,.31);border-radius:8px;padding:11px 14px;background:rgba(2,20,32,.67);
  backdrop-filter:blur(6px);font-size:10px;font-weight:900;letter-spacing:.14em;color:#effaff}
.qt-story-indicator{display:block;width:7px;height:7px;flex:none;background:#4ce7f5;border-radius:50%;box-shadow:0 0 11px #4ce7f5}
.qt-story-art figcaption{position:absolute;bottom:30px;left:32px;right:32px;display:flex;align-items:center;justify-content:space-between;gap:16px;
  color:#e3f7ff;font-size:11px;font-weight:850;letter-spacing:.18em}
.qt-story-caption-n{font-size:29px;font-weight:950;letter-spacing:-.045em}
.qt-story-caption-n em{color:#5ad9ed;font-style:normal;font-size:18px;margin:0 9px}
.qt-story-bottom{width:min(1460px,calc(100% - 96px));margin:72px auto 0;display:flex;align-items:center;gap:18px;
  font-size:10px;font-weight:800;letter-spacing:.17em;color:#7497a9}
.qt-story-bottom-rule{height:1px;flex:1;background:linear-gradient(90deg,rgba(76,231,245,.6),transparent)}
@media(max-width:1180px){.qt-story-wrap{gap:38px}.qt-story-kicker{margin-bottom:32px}.qt-story-art{min-height:420px}.qt-story h2{font-size:clamp(39px,4.7vw,62px)}}
@media(max-width:860px){.qt-story{padding:74px 0 30px}.qt-story-wrap{width:calc(100% - 38px);grid-template-columns:1fr;gap:32px}.qt-story-copy{padding:0}.qt-story-kicker{margin-bottom:28px}.qt-story-art{min-height:0;aspect-ratio:1.5/1;border-radius:20px}.qt-story h2{font-size:clamp(40px,7.7vw,63px)}.qt-story-detail{max-width:100%}.qt-story-bottom{width:calc(100% - 38px);margin-top:37px}}
@media(max-width:510px){.qt-story{padding:58px 0 24px}.qt-story-wrap{width:calc(100% - 32px);gap:22px}.qt-story-kicker{font-size:10px;letter-spacing:.13em;margin-bottom:23px}.qt-story-kicker-line{width:25px}.qt-story-pretitle{font-size:9px;letter-spacing:.13em;margin-bottom:24px}.qt-story h2{font-size:clamp(34px,9.8vw,49px)}.qt-story-intro{margin:22px 0 15px;font-size:18px}.qt-story-detail{font-size:14px;line-height:1.7}.qt-story-moods{margin-top:22px;gap:7px}.qt-story-moods span{font-size:10px;padding:8px 10px;min-height:33px}.qt-story-art{aspect-ratio:1.16/1;border-radius:17px}.qt-story-art-top{top:13px;left:13px;padding:8px 10px;font-size:9px;letter-spacing:.05em}.qt-story-art figcaption{left:17px;right:17px;bottom:17px;font-size:9px;letter-spacing:.08em}.qt-story-caption-n{font-size:23px}.qt-story-bottom{width:calc(100% - 32px);margin-top:27px;font-size:9px;gap:9px}.qt-story-bottom span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){.qt-story *{scroll-behavior:auto}}