:root {
        --black: #070303;
        --black-soft: #130707;
        --red: #b60b08;
        --red-bright: #ef261e;
        --red-dark: #4a0201;
        --gold: #d4a642;
        --gold-light: #ffe49a;
        --cream: #fff7e8;
        --muted: #d8c4ae;
        --line: rgba(255, 219, 126, 0.58);
        --max: 1120px;
      }

      * {
        box-sizing: border-box;
      }

      html {
        scroll-behavior: smooth;
      }

      body {
        margin: 0;
        color: var(--cream);
        background:
          radial-gradient(circle at 50% -10%, rgba(239, 38, 30, 0.34), transparent 32%),
          linear-gradient(180deg, #180202 0%, var(--black) 45%, #130202 100%);
        font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
        line-height: 1.95;
      }

      body.is-locked {
        overflow: hidden;
      }

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

      button,
      select {
        font: inherit;
      }

      a {
        color: inherit;
      }

      .wrap {
        width: min(var(--max), calc(100% - 40px));
        margin: 0 auto;
      }

      .hero {
        position: relative;
        min-height: 720px;
        display: flex;
        align-items: flex-end;
        border-bottom: 1px solid var(--line);
        background:
          linear-gradient(0deg, rgba(7, 3, 3, 1) 0%, rgba(7, 3, 3, 0.18) 42%),
          linear-gradient(90deg, rgba(0, 0, 0, 0.52), transparent 45%, rgba(0, 0, 0, 0.28)),
          url("https://lumiere-a.akamaihd.net/v1/images/tos_kv_124d2b9f.jpeg") center / cover no-repeat;
      }

      .hero::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(120deg, transparent 24%, rgba(255, 228, 154, 0.14) 43%, transparent 59%);
      }

      .hero__inner {
        position: relative;
        z-index: 1;
        padding: 72px 0 62px;
      }

      .hero h1 {
        max-width: 940px;
        margin: 0;
        color: #fff;
        line-height: 1.22;
        text-shadow:
          0 4px 18px rgba(0, 0, 0, 0.9),
          0 0 34px rgba(239, 38, 30, 0.38);
      }

      .hero__kicker {
        display: block;
        margin-bottom: 12px;
        color: var(--gold-light);
        font-size: clamp(18px, 2vw, 28px);
        letter-spacing: 0.08em;
      }

      .hero__title {
        display: block;
        font-size: clamp(42px, 7vw, 92px);
        letter-spacing: -0.04em;
      }

      .hero__guide {
        display: inline-block;
        margin-top: 12px;
        padding: 5px 14px 7px;
        color: #180403;
        background: var(--gold-light);
        font-size: clamp(20px, 2.7vw, 36px);
        letter-spacing: 0.05em;
        text-shadow: none;
      }

      .hero__catch {
        display: block;
        max-width: 780px;
        margin-top: 20px;
        font-size: clamp(23px, 3.4vw, 46px);
        letter-spacing: -0.02em;
      }

      .lead {
        position: relative;
        z-index: 2;
        max-width: 980px;
        margin: -34px auto 0;
        padding: 48px 54px;
        border: 1px solid #e6ded2;
        color: #211b18;
        background: #fffdf9;
        box-shadow: 0 28px 80px rgba(0, 0, 0, 0.4);
      }

      .lead p {
        margin: 0;
        font-size: clamp(16px, 1.7vw, 20px);
      }

      .rule {
        padding: 92px 20px;
        color: #1d1714;
        text-align: center;
        background:
          linear-gradient(90deg, transparent, rgba(182, 11, 8, 0.07), transparent),
          #f7f2ea;
        border-bottom: 1px solid #ded3c4;
      }

      .rule p {
        margin: 0;
        color: #8e0b08;
        font-size: clamp(17px, 2vw, 25px);
        font-weight: 700;
        letter-spacing: 0.12em;
		  padding: 10px 0px 0px 0px;
      }

      .rule strong {
        display: block;
        margin-top: 16px;
        color: #15100e;
        font-size: clamp(35px, 6.5vw, 82px);
        line-height: 1.2;
        text-shadow: 0 2px 0 #fff;
      }

      .section {
        padding: 88px 0;
      }

      .section-title {
        margin: 0 0 38px;
        padding-bottom: 18px;
        border-bottom: 1px solid var(--line);
        color: var(--gold-light);
        font-size: clamp(32px, 5vw, 60px);
        line-height: 1.3;
      }

      .sort {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        gap: 12px;
        margin-bottom: 26px;
      }

      .sort label {
        color: var(--muted);
        font-size: 13px;
      }

      .sort select {
        min-height: 42px;
        padding: 0 38px 0 14px;
        border: 1px solid var(--line);
        color: var(--cream);
        background: var(--black-soft);
      }

      .films {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 22px 18px;
      }

      .film {
        overflow: hidden;
        border: 1px solid var(--line);
        background: linear-gradient(145deg, #4b0604, #160505 48%, #070303);
        transition: transform 0.25s ease, box-shadow 0.25s ease;
      }

      .film:hover {
        transform: translateY(-6px);
        box-shadow:
          0 22px 52px rgba(0, 0, 0, 0.52),
          0 0 30px rgba(239, 38, 30, 0.25);
      }

      .film__photo {
        position: relative;
        width: 100%;
        padding: 0;
        overflow: hidden;
        border: 0;
        background: #000;
        cursor: zoom-in;
      }

      .film__photo img {
        width: 100%;
        aspect-ratio: 3 / 4;
        object-fit: cover;
        transition: transform 0.45s ease;
      }

      .film:hover .film__photo img {
        transform: scale(1.035);
      }

      .film__photo::after {
        content: "＋";
        position: absolute;
        right: 12px;
        bottom: 12px;
        width: 38px;
        height: 38px;
        display: grid;
        place-items: center;
        border: 1px solid var(--gold-light);
        border-radius: 50%;
        color: var(--gold-light);
        background: rgba(92, 4, 3, 0.88);
        font-size: 24px;
      }

      .film__body {
        padding: 20px;
      }

      .film__body h3 {
        margin: 0 0 8px;
        color: #fff;
        font-size: 24px;
        line-height: 1.35;
      }

      .film__meta {
        margin: 0 0 12px;
        color: var(--gold-light);
        font-size: 13px;
      }

      .film__body p {
        margin: 0;
        color: var(--muted);
        font-size: 14px;
        line-height: 1.8;
      }

      .article {
        color: #211b18;
        border-top: 1px solid #ded3c4;
        background: #fffdf9;
      }

      .article .section-title {
        color: #15100e;
        border-bottom-color: #9b0805;
      }

      .article__body {
        max-width: 760px;
        margin: 0 auto;
      }

      .article__body p {
        margin: 0;
        font-size: clamp(16px, 1.65vw, 19px);
      }

      .article__body p + p {
        margin-top: 2.1em;
      }

      .distribution {
        padding: 70px 0;
        text-align: center;
        border-top: 1px solid var(--line);
      }

      .distribution p {
        margin: 0;
        font-size: clamp(18px, 2.3vw, 28px);
      }

      .links {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 14px;
        margin-top: 28px;
      }

      .links a {
        min-width: 230px;
        padding: 13px 20px;
        border: 1px solid var(--gold-light);
        color: #180403;
        background: linear-gradient(180deg, #ffe9a4, #c7962f);
        font-weight: 700;
        text-decoration: none;
      }

      .footer {
        padding: 26px 20px 40px;
        color: #bba993;
        background: #030202;
        text-align: center;
        font-family: Arial, sans-serif;
        font-size: 12px;
      }

      .lightbox {
        position: fixed;
        z-index: 100;
        inset: 0;
        display: none;
        place-items: center;
        padding: 24px;
        background: rgba(0, 0, 0, 0.94);
      }

      .lightbox.is-open {
        display: grid;
      }

      .lightbox__dialog {
        position: relative;
        width: min(1100px, 100%);
        max-height: calc(100vh - 48px);
        display: grid;
        grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr);
        overflow: auto;
        border: 1px solid var(--line);
        background: #0d0505;
      }

      .lightbox__visual {
        min-height: 520px;
        background: #000;
      }

      .lightbox__visual img {
        width: 100%;
        height: 100%;
        object-fit: contain;
      }

      .lightbox__copy {
        padding: 46px 34px 34px;
      }

      .lightbox__copy h2 {
        margin: 0 0 12px;
        color: var(--gold-light);
        font-size: 34px;
        line-height: 1.35;
      }

      .lightbox__copy p {
        margin: 0;
      }

      .lightbox__copy p + p {
        margin-top: 16px;
      }

      .lightbox__close,
      .lightbox__prev,
      .lightbox__next {
        position: fixed;
        z-index: 102;
        display: grid;
        place-items: center;
        border: 1px solid var(--gold-light);
        color: var(--gold-light);
        background: rgba(69, 2, 1, 0.9);
        cursor: pointer;
      }

      .lightbox__close {
        top: 18px;
        right: 18px;
        width: 46px;
        height: 46px;
        font-size: 25px;
      }

      .lightbox__prev,
      .lightbox__next {
        top: 50%;
        width: 48px;
        height: 64px;
        transform: translateY(-50%);
        font-size: 28px;
      }

      .lightbox__prev {
        left: 18px;
      }

      .lightbox__next {
        right: 18px;
      }

      @media (max-width: 980px) {
        .films {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .lightbox__dialog {
          grid-template-columns: 1fr;
        }

        .lightbox__visual {
          min-height: 0;
        }
      }

      @media (max-width: 680px) {
        .wrap {
          width: min(100% - 24px, var(--max));
        }

        .hero {
          min-height: 560px;
        }

        .hero__inner {
          padding-bottom: 34px;
        }

        .hero__title {
          font-size: 48px;
        }

        .hero__catch {
          font-size: 26px;
        }

        .lead {
          margin: 0 12px;
          padding: 28px 22px;
        }

        .rule {
          padding: 70px 14px;
        }

        .section {
          padding: 66px 0;
        }

        .films {
          grid-template-columns: 1fr;
        }

        .sort {
          justify-content: stretch;
        }

        .sort select {
          flex: 1;
          min-width: 0;
        }

        .lightbox {
          padding: 12px;
        }

        .lightbox__dialog {
          max-height: calc(100vh - 24px);
        }

        .lightbox__copy {
          padding: 28px 20px;
        }

        .lightbox__prev,
        .lightbox__next {
          top: auto;
          bottom: 18px;
          width: 44px;
          height: 44px;
          transform: none;
        }
      }


      /* Cinematic visual refinement */
      :root {
        --black: #050505;
        --black-soft: #11100f;
        --red: #a20d0b;
        --red-bright: #e52b22;
        --red-dark: #310302;
        --gold: #b98a32;
        --gold-light: #f1d58a;
        --cream: #f7f1e8;
        --muted: #c8bbae;
        --line: rgba(241, 213, 138, 0.42);
        --paper: #f3efe8;
        --ink: #171412;
      }

      body {
        overflow-x: hidden;
        background: #050505;
      }

      .wrap,
      .hero__inner,
      .lead,
      .article__body,
      .film,
      .film__body,
      .lightbox__copy {
        min-width: 0;
      }

      h1,
      h2,
      h3,
      p,
      strong,
      span,
      a,
      button,
      label,
      select {
        overflow-wrap: anywhere;
      }

      .hero {
        min-height: min(860px, 92vh);
        isolation: isolate;
        background-position: center 28%;
      }

      .hero::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background:
          linear-gradient(90deg, rgba(0, 0, 0, 0.88) 0%, rgba(0, 0, 0, 0.22) 48%, rgba(0, 0, 0, 0.58) 100%),
          linear-gradient(0deg, #050505 0%, rgba(5, 5, 5, 0.1) 46%, rgba(5, 5, 5, 0.3) 100%);
      }

      .hero::after {
        z-index: 0;
        opacity: 0.75;
        background:
          linear-gradient(115deg, transparent 30%, rgba(255, 225, 147, 0.12) 46%, transparent 60%),
          repeating-linear-gradient(90deg, transparent 0 11.8%, rgba(255,255,255,0.018) 12% 12.1%);
      }

      .hero__inner {
        z-index: 2;
        padding-top: 110px;
        padding-bottom: 78px;
      }

      .hero h1 {
        width: min(920px, 92%);
        line-height: 1.08;
      }

      .hero__kicker {
        margin-bottom: 18px;
        font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif;
        font-size: clamp(15px, 1.5vw, 22px);
        font-weight: 700;
        letter-spacing: 0.2em;
      }

      .hero__title {
        font-size: clamp(46px, 7.4vw, 106px);
        line-height: 0.98;
        letter-spacing: -0.055em;
        filter: drop-shadow(0 8px 24px rgba(0,0,0,0.8));
      }

      .hero__guide {
        margin-top: 20px;
        padding: 7px 20px 9px;
        border: 1px solid rgba(255,255,255,0.38);
        background: linear-gradient(180deg, #f5de9a, #b9852b);
        font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif;
        font-size: clamp(18px, 2.2vw, 31px);
        font-weight: 900;
        box-shadow: 0 10px 30px rgba(0,0,0,0.34);
      }

      .hero__catch {
        width: min(760px, 100%);
        margin-top: 25px;
        font-size: clamp(22px, 3.2vw, 45px);
        line-height: 1.38;
        letter-spacing: -0.035em;
        text-wrap: balance;
      }

      .lead {
        max-width: 1040px;
        margin-top: -42px;
        padding: clamp(34px, 5vw, 64px);
        border: 0;
        border-top: 5px solid var(--red);
        background: rgba(250, 248, 244, 0.98);
        box-shadow: 0 30px 90px rgba(0, 0, 0, 0.48);
      }

      .lead p {
        max-width: 860px;
        margin: 0 auto;
        font-size: clamp(16px, 1.45vw, 19px);
        line-height: 2.12;
      }

      .rule {
        position: relative;
        overflow: hidden;
        padding: 104px 20px 112px;
        background:
          radial-gradient(circle at 50% 50%, rgba(162, 13, 11, 0.1), transparent 42%),
          linear-gradient(135deg, #f9f6f0, #eee7dc);
      }

      .rule::before,
      .rule::after {
        content: "";
        position: absolute;
        left: 50%;
        width: min(860px, calc(100% - 40px));
        height: 1px;
        transform: translateX(-50%);
        background: linear-gradient(90deg, transparent, #a20d0b, transparent);
      }

      .rule::before { top: 52px; }
      .rule::after { bottom: 52px; }

      .rule p {
        font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif;
        font-size: clamp(14px, 1.6vw, 20px);
        letter-spacing: 0.22em;
      }

      .rule strong {
        width: min(1000px, 100%);
        margin-inline: auto;
        font-size: 46px;
        line-height: 1.32;
        letter-spacing: -0.045em;
        text-wrap: balance;
      }

      #films {
        position: relative;
        background:
          radial-gradient(circle at 50% 0%, rgba(162, 13, 11, 0.3), transparent 30%),
          linear-gradient(180deg, #0b0908 0%, #050505 100%);
      }

      #films::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        opacity: 0.16;
        background-image: radial-gradient(circle, rgba(255,255,255,0.5) 0 0.6px, transparent 0.8px);
        background-size: 5px 5px;
      }

      #films .wrap {
        position: relative;
      }

      .section-title {
        font-size: clamp(32px, 4.6vw, 64px);
        line-height: 1.24;
        letter-spacing: -0.035em;
        text-wrap: balance;
      }

      #films .section-title {
        padding-bottom: 24px;
        border-bottom: 0;
        text-align: center;
      }

      #films .section-title::after {
        content: "";
        display: block;
        width: 108px;
        height: 2px;
        margin: 20px auto 0;
        background: linear-gradient(90deg, transparent, var(--gold-light), transparent);
      }

      .sort {
        margin-bottom: 34px;
      }

      .sort select {
        max-width: 100%;
        border-color: rgba(241, 213, 138, 0.5);
        background: #151311;
      }

      .films {
        gap: 28px 20px;
      }

      .film {
        border-color: rgba(241, 213, 138, 0.38);
        background: #0c0b0a;
        box-shadow: 0 16px 36px rgba(0,0,0,0.26);
      }

      .film:hover {
        transform: translateY(-8px);
        border-color: var(--gold-light);
        box-shadow: 0 28px 64px rgba(0,0,0,0.6), 0 0 24px rgba(162,13,11,0.3);
      }

      .film__photo img {
        aspect-ratio: 16 / 11;
      }

      .film__photo::before {
        content: "VIEW";
        position: absolute;
        left: 14px;
        bottom: 14px;
        z-index: 2;
        padding: 5px 9px;
        color: #fff;
        background: rgba(0,0,0,0.7);
        font-family: Arial, sans-serif;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.18em;
      }

      .film__body {
        padding: 22px 20px 24px;
      }

      .film__body h3 {
        font-size: clamp(19px, 2vw, 25px);
        line-height: 1.42;
        word-break: normal;
      }

      .film__meta,
      .film__body p {
        word-break: normal;
      }

      .article {
        position: relative;
        overflow: hidden;
        padding-block: 112px;
        background:
          linear-gradient(90deg, rgba(162,13,11,0.035), transparent 28%, transparent 72%, rgba(162,13,11,0.035)),
          var(--paper);
      }

      .article::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        width: min(1160px, calc(100% - 48px));
        height: 1px;
        transform: translateX(-50%);
        background: linear-gradient(90deg, transparent, #a20d0b, transparent);
      }

      .article__body {
        max-width: 820px;
      }

      .article .section-title {
        margin-bottom: 48px;
        padding: 0 0 28px;
        border-bottom: 0;
        font-size: clamp(30px, 4.25vw, 58px);
        line-height: 1.34;
        text-align: left;
      }

      .article .section-title::after {
        content: "";
        display: block;
        width: 84px;
        height: 3px;
        margin-top: 24px;
        background: var(--red);
      }

      .article__body p {
        font-size: clamp(16px, 1.45vw, 19px);
        line-height: 2.18;
        text-align: justify;
        text-justify: inter-ideograph;
      }

      .distribution {
        position: relative;
        padding: 104px 0;
        isolation: isolate;
      }

      .distribution::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        background: linear-gradient(90deg, rgba(0,0,0,0.72), rgba(0,0,0,0.34), rgba(0,0,0,0.72));
      }

      .distribution p {
        width: min(860px, 100%);
        margin-inline: auto;
        font-size: clamp(18px, 2.3vw, 30px);
        line-height: 1.7;
        text-wrap: balance;
      }

      .links a {
        min-width: min(280px, 100%);
        padding: 15px 24px;
		  text-align: center;
        border-color: rgba(255,255,255,0.3);
        box-shadow: 0 12px 28px rgba(0,0,0,0.28);
      }

      .lightbox__dialog {
        width: min(1120px, calc(100% - 104px));
        max-height: calc(100vh - 80px);
        overflow: auto;
      }

      .lightbox__copy h2,
      .lightbox__copy p {
        word-break: normal;
        overflow-wrap: anywhere;
      }

      @media (max-width: 980px) {
        .films {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .hero h1 {
          width: min(800px, 96%);
        }
      }

      @media (max-width: 640px) {
        .wrap {
          width: min(var(--max), calc(100% - 28px));
        }

        .hero {
          min-height: 680px;
          background-position: 58% center;
        }

        .hero__inner {
          padding: 92px 0 44px;
        }

        .hero h1 {
          width: 100%;
        }

        .hero__kicker {
          font-size: 14px;
          letter-spacing: 0.12em;
        }

        .hero__title {
          font-size: clamp(39px, 13vw, 58px);
          line-height: 1.04;
          letter-spacing: -0.065em;
        }

        .hero__guide {
          font-size: 18px;
        }

        .hero__catch {
          font-size: clamp(21px, 7vw, 30px);
          line-height: 1.45;
        }

        .hero__catch br {
          display: none;
        }

        .lead {
          width: calc(100% - 22px);
          margin-top: -24px;
          padding: 30px 22px;
        }

        .lead p,
        .article__body p {
          text-align: left;
        }

        .rule {
          padding: 86px 16px;
        }

        .rule strong {
          font-size: 40px;
          letter-spacing: -0.06em;
        }

        .section {
          padding: 72px 0;
        }

        .section-title,
        .article .section-title {
          font-size: clamp(29px, 9vw, 43px);
          line-height: 1.42;
        }

        .sort {
          justify-content: stretch;
          align-items: stretch;
          flex-direction: column;
        }

        .sort select {
          width: 100%;
        }

        .films {
          grid-template-columns: 1fr;
          gap: 24px;
        }

        .film__photo img {
          aspect-ratio: 16 / 10;
        }

        .article {
          padding-block: 78px;
        }

        .distribution {
          padding: 78px 0;
        }

        .links {
          display: grid;
        }

        .links a {
          min-width: 0;
          width: 100%;
        }

        .lightbox__dialog {
          width: calc(100% - 28px);
          max-height: calc(100vh - 72px);
        }
      }


      /* Full-key-visual hero + refined paper sections */
      .hero {
        min-height: 0;
        display: block;
        padding: 0;
        background: #000;
        border-bottom: 1px solid rgba(241, 213, 138, 0.38);
      }

      .hero::before,
      .hero::after {
        display: none;
      }

      .hero__image {
        width: min(100%, 1680px);
        height: auto;
        margin: 0 auto;
        object-fit: contain;
      }

      .lead,
      .rule,
      .article {
        color: var(--ink);
        background-color: var(--paper);
      }

      .lead {
        position: relative;
        margin-top: 0;
        padding: clamp(48px, 7vw, 86px) clamp(28px, 6vw, 78px);
        border: 0;
        border-top: 1px solid rgba(185, 138, 50, 0.55);
        border-bottom: 1px solid rgba(185, 138, 50, 0.32);
        background:
          linear-gradient(90deg, transparent, rgba(162, 13, 11, 0.035), transparent),
          repeating-linear-gradient(0deg, rgba(52, 38, 28, 0.018) 0 1px, transparent 1px 5px),
          #f6f1e8;
        box-shadow: none;
      }

      .lead::before {
        content: "";
        position: absolute;
        top: 34px;
        bottom: 34px;
        left: clamp(16px, 3vw, 42px);
        width: 3px;
        background: linear-gradient(180deg, var(--red), var(--gold));
      }

      .lead p {
        max-width: 860px;
        margin: 0 auto;
        color: #2a231f;
        font-size: clamp(16px, 1.45vw, 19px);
        line-height: 2.15;
      }

      .rule {
        padding: clamp(76px, 9vw, 118px) 20px;
        background:
          radial-gradient(circle at 50% 50%, rgba(162, 13, 11, 0.09), transparent 38%),
          repeating-linear-gradient(90deg, rgba(52, 38, 28, 0.018) 0 1px, transparent 1px 6px),
          #eee6da;
      }

      .rule::before,
      .rule::after {
        width: min(900px, calc(100% - 48px));
        background: linear-gradient(90deg, transparent, rgba(162, 13, 11, 0.8), var(--gold), rgba(162, 13, 11, 0.8), transparent);
      }

      .rule p {
        color: #8d0b08;
      }

      .rule strong {
        color: #171210;
        text-shadow: 0 1px 0 #fff;
      }

      .article {
        position: relative;
        padding-block: clamp(86px, 10vw, 132px);
        background:
          linear-gradient(90deg, rgba(162, 13, 11, 0.03), transparent 18%, transparent 82%, rgba(185, 138, 50, 0.04)),
          repeating-linear-gradient(0deg, rgba(52, 38, 28, 0.017) 0 1px, transparent 1px 5px),
          #f7f3ec;
      }

      .article::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        width: min(1040px, calc(100% - 40px));
        height: 1px;
        transform: translateX(-50%);
        background: linear-gradient(90deg, transparent, var(--gold), var(--red), var(--gold), transparent);
      }

      .article__body {
        max-width: 820px;
        padding: clamp(28px, 5vw, 58px);
        border: 1px solid rgba(87, 67, 48, 0.18);
        background: rgba(255, 253, 249, 0.82);
        box-shadow: 0 24px 70px rgba(63, 43, 28, 0.12);
      }

      .article .section-title {
        position: relative;
        margin-bottom: 46px;
        padding: 0 0 28px;
        border-bottom: 1px solid rgba(162, 13, 11, 0.28);
        color: #1c1714;
        font-size: clamp(30px, 4.3vw, 54px);
        line-height: 1.42;
        letter-spacing: -0.035em;
      }

      .article .section-title::before {
        content: "";
        display: block;
        width: 72px;
        height: 5px;
        margin-bottom: 22px;
        background: linear-gradient(90deg, var(--red), var(--gold));
      }

      .article__body p {
        color: #2b2521;
        font-size: clamp(16px, 1.3vw, 18px);
        line-height: 2.2;
      }

      .article__body p + p {
        margin-top: 2.25em;
      }

      @media (max-width: 760px) {
        .hero__image {
          width: 100%;
        }

        .lead {
          padding: 48px 26px 48px 34px;
        }

        .lead::before {
          top: 26px;
          bottom: 26px;
          left: 16px;
        }

        .article__body {
          width: min(100% - 24px, 820px);
          padding: 30px 22px;
        }
      }

    

  /* Clean light sections: remove decorative background lines */
  .lead-section,
  .rule-section,
  .article-section,
  .article-card {
    background-image: none !important;
  }

  .lead-section::before,
  .lead-section::after,
  .rule-section::before,
  .rule-section::after,
  .article-section::before,
  .article-section::after,
  .article-card::before,
  .article-card::after {
    content: none !important;
    display: none !important;
  }



/* Film production note treatment for the editorial section */
.article__body {
  position: relative;
  max-width: 920px;
  padding: clamp(78px, 8vw, 108px) clamp(42px, 7vw, 92px) clamp(58px, 7vw, 86px);
  border: 1px solid rgba(36, 30, 26, 0.28);
  border-radius: 2px;
  background:
    linear-gradient(90deg,
      transparent 0 34px,
      rgba(24, 20, 18, 0.045) 34px 35px,
      transparent 35px calc(100% - 35px),
      rgba(24, 20, 18, 0.045) calc(100% - 35px) calc(100% - 34px),
      transparent calc(100% - 34px)),
    repeating-linear-gradient(0deg, rgba(45, 35, 27, 0.018) 0 1px, transparent 1px 5px),
    rgba(255, 253, 249, 0.96);
  box-shadow:
    0 34px 90px rgba(43, 29, 18, 0.14),
    0 1px 0 rgba(255, 255, 255, 0.85) inset;
}

/* Clapperboard header */
.article__body::before {
  content: "PRODUCTION  01   /   THE ONE SHOT";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  min-height: 54px;
  display: flex;
  align-items: center;
  padding: 0 clamp(24px, 5vw, 52px);
  border-bottom: 4px solid #111;
  color: #fff;
  background:
    repeating-linear-gradient(135deg,
      #111 0 28px,
      #f3eee5 28px 56px);
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-shadow: 0 1px 5px rgba(0,0,0,0.9);
  box-shadow: 0 7px 0 #a20d0b;
}

/* Keep the film motif subtle: no side perforation dots */
.article__body::after {
  content: "";
  position: absolute;
  left: clamp(24px, 4vw, 44px);
  right: clamp(24px, 4vw, 44px);
  bottom: 22px;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(162,13,11,.34), rgba(185,138,50,.48), transparent);
}

.article .article__body .section-title {
  position: relative;
  z-index: 1;
  margin: 0 0 42px;
  padding: 0 0 30px;
  border-bottom: 1px solid rgba(23, 20, 18, 0.24);
  color: #171412;
}

.article .article__body .section-title::before {
  content: "FEATURE STORY  /  SCENE 01";
  display: block;
  width: auto;
  height: auto;
  margin: 0 0 16px;
  color: #9a0c09;
  background: none;
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.2em;
}

.article .article__body .section-title::after {
  content: "";
  display: block;
  width: 116px;
  height: 4px;
  margin-top: 25px;
  background: linear-gradient(90deg, #a20d0b 0 62%, #171412 62% 76%, #b98a32 76%);
}

.article__body p {
  position: relative;
  z-index: 1;
}

.article__body p:first-of-type::first-letter {
  font-size: inherit !important;
  float: none !important;
  margin: 0 !important;
  color: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}

.article__body .dropcap {
  float: left;
  margin: 0.12em 0.16em 0 0;
  color: #9a0c09;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-size: 4.1em;
  font-weight: 700;
  line-height: 0.78;
}

@media (max-width: 760px) {
  .article__body {
    width: min(100% - 20px, 920px);
    padding: 78px 34px 46px;
  }

  .article__body::before {
    min-height: 48px;
    padding-inline: 18px;
    font-size: 9px;
    letter-spacing: 0.1em;
    background-size: auto;
  }

  .article__body::after {
    left: 22px;
    right: 22px;
    bottom: 16px;
  }

  .article .article__body .section-title {
    margin-bottom: 32px;
    padding-bottom: 24px;
  }
}

/* 2026 refinement layer */
:root{--ease:cubic-bezier(.22,1,.36,1);}
body{background:#050505;}
.hero{position:relative;overflow:hidden;}
.hero__image{animation:heroBreath 16s ease-in-out infinite alternate;transform-origin:center center;}
.hero::after{display:block;content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.08) 45%,rgba(0,0,0,.32));}
.hero::before{display:block;content:"THE ONE SHOT";position:absolute;z-index:2;left:clamp(18px,5vw,72px);bottom:clamp(24px,5vw,72px);display:block;color:rgba(255,255,255,.94);font-family:Arial,"Hiragino Kaku Gothic ProN",sans-serif;font-size:clamp(28px,6vw,88px);font-weight:800;letter-spacing:-.06em;line-height:.9;text-shadow:0 12px 40px rgba(0,0,0,.7);mix-blend-mode:screen;}
@keyframes heroBreath{from{transform:scale(1)}to{transform:scale(1.035)}}

.lead,.rule,.article__body,.film,.distribution .wrap{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease);}
.is-visible{opacity:1!important;transform:none!important;}

#films{overflow:hidden;}
#films::after{content:"";position:absolute;inset:-20% -30%;pointer-events:none;background:radial-gradient(circle at var(--mx,50%) var(--my,30%),rgba(241,213,138,.12),transparent 22%);transition:background-position .2s linear;}
.films{position:relative;z-index:1;}
.film{position:relative;border-radius:18px;overflow:hidden;backdrop-filter:blur(8px);transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s ease;}
.film::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(120deg,transparent 28%,rgba(255,255,255,.12) 45%,transparent 62%);transform:translateX(-120%);transition:transform .8s var(--ease);}
.film:hover::after{transform:translateX(120%);}
.film:hover{transform:translateY(-10px) scale(1.015);}
.film__photo::after{content:"▶";font-size:13px;border-radius:999px;background:rgba(5,5,5,.68);backdrop-filter:blur(8px);}
.film__photo::before{letter-spacing:.22em;background:rgba(5,5,5,.52);backdrop-filter:blur(8px);}
.film__photo img{transition:transform .8s var(--ease),filter .8s ease;}
.film:hover .film__photo img{transform:scale(1.07);filter:saturate(1.08) contrast(1.04);}
.film__body{background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,0));}
.section-title{letter-spacing:-.045em;}
.section-title::selection,.film h3::selection{background:var(--red);color:white;}

.links a{position:relative;overflow:hidden;border-radius:999px;transition:transform .35s var(--ease),box-shadow .35s ease;}
.links a::after{content:"";position:absolute;inset:-2px;background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.7) 45%,transparent 70%);transform:translateX(-130%);transition:transform .7s var(--ease);}
.links a:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(0,0,0,.4);}
.links a:hover::after{transform:translateX(130%);}


/* Cinematic line system — repeated subtly across the page */
.lead {
  position: relative;
  background-image:
    linear-gradient(90deg, transparent 0 7%, rgba(162,13,11,.72) 7% 20%, rgba(185,138,50,.55) 20% 23%, transparent 23%),
    linear-gradient(90deg, transparent 0 77%, rgba(185,138,50,.55) 77% 80%, rgba(162,13,11,.72) 80% 93%, transparent 93%),
    repeating-linear-gradient(0deg, rgba(52,38,28,.018) 0 1px, transparent 1px 5px),
    linear-gradient(90deg, transparent, rgba(162,13,11,.035), transparent) !important;
  background-size: 100% 2px, 100% 2px, auto, auto;
  background-position: top left, bottom left, center, center;
  background-repeat: no-repeat, no-repeat, repeat, no-repeat;
}

.rule strong {
  position: relative;

}
.rule strong::before,
.rule strong::after {
  content: "";
  position: absolute;
  top: 50%;
  width: clamp(28px, 6vw, 88px);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(162,13,11,.8), #b98a32);
}
.rule strong::before { right: 100%; }
.rule strong::after { left: 100%; transform: scaleX(-1); }

#films .wrap::before,
#films .wrap::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(241,213,138,.2) 12%, rgba(241,213,138,.62) 50%, rgba(241,213,138,.2) 88%, transparent);
}
#films .wrap::before { top: 0; }
#films .wrap::after { bottom: 0; }

#films .section-title {
  position: relative;
}
#films .section-title::before {
  content: "OFFICIAL SELECTION  /  08 FILMS";
  display: block;
  margin-bottom: 13px;
  color: rgba(241,213,138,.72);
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .28em;
}

.film__body {
  position: relative;
  padding-top: 30px;
}
.film__body::before {
  content: "";
  position: absolute;
  top: 18px;
  left: 20px;
  width: 58px;
  height: 2px;
  background: linear-gradient(90deg, var(--red) 0 62%, var(--gold-light) 62% 78%, rgba(255,255,255,.34) 78%);
}

.distribution .wrap {
  position: relative;
  padding-block: 36px;
}
.distribution .wrap::before,
.distribution .wrap::after {
  content: "";
  position: absolute;
  left: 50%;
  width: min(880px, calc(100% - 28px));
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(241,213,138,.55), rgba(255,255,255,.72), rgba(241,213,138,.55), transparent);
}
.distribution .wrap::before { top: 0; }
.distribution .wrap::after { bottom: 0; }
.distribution p::before {
  content: "NOW STREAMING";
  display: block;
  margin-bottom: 12px;
  color: var(--gold-light);
  font-family: Arial, "Helvetica Neue", sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .3em;
}

@media (max-width: 760px) {
  .rule strong::before,
  .rule strong::after { display: none; }
  #films .wrap::before,
  #films .wrap::after { left: 8px; right: 8px; }
  .distribution .wrap { padding-block: 28px; }
}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.lead,.rule,.article__body,.film,.distribution .wrap{opacity:1;transform:none}}

/* 35mm cinematic pass — grain, gate, frame numbers, projector texture */
html { background:#020202; }
body { position:relative; }
body::before {
  content:"";
  position:fixed;
  z-index:9998;
  inset:-40%;
  pointer-events:none;
  opacity:.16;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.62'/%3E%3C/svg%3E");
  transform:translate3d(0,0,0);
  animation:filmGrain .22s steps(2) infinite;
  mix-blend-mode:soft-light;
}
body::after {
  content:"";
  position:fixed;
  z-index:9997;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse at center, transparent 48%, rgba(0,0,0,.16) 76%, rgba(0,0,0,.48) 100%),
    linear-gradient(90deg, rgba(255,60,24,.025), transparent 14%, transparent 86%, rgba(45,110,255,.022));
  box-shadow:inset 0 0 90px rgba(0,0,0,.34);
}
@keyframes filmGrain {
  0%{transform:translate(-2%,-3%)} 25%{transform:translate(3%,1%)}
  50%{transform:translate(-1%,4%)} 75%{transform:translate(4%,-2%)} 100%{transform:translate(-3%,2%)}
}

.hero {
  border-top:clamp(10px,1.6vw,24px) solid #020202;
  border-bottom:clamp(10px,1.6vw,24px) solid #020202;
  box-shadow:0 22px 70px rgba(0,0,0,.72);
}
.hero__image {
  filter:saturate(.86) contrast(1.08) brightness(.9) sepia(.04);
  animation:heroBreath 18s ease-in-out infinite alternate, projectorFlicker 7s steps(1) infinite;
}
.hero::before {
  content:"THE ONE SHOT   •   ORIGINAL MOTION PICTURE   •   01";
  left:clamp(16px,3vw,46px);
  right:auto;
  bottom:clamp(16px,2.8vw,38px);
  color:rgba(255,244,211,.9);
  font-family:"Courier New",monospace;
  font-size:clamp(9px,.8vw,12px);
  font-weight:700;
  letter-spacing:.22em;
  line-height:1;
  mix-blend-mode:normal;
  text-shadow:0 2px 12px #000;
}
.hero::after {
  display:block;
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.18),transparent 18%,transparent 74%,rgba(0,0,0,.48)),
    linear-gradient(90deg,rgba(0,0,0,.25),transparent 8%,transparent 92%,rgba(0,0,0,.25));
  animation:projectorFlicker 6.5s steps(1) infinite;
}
@keyframes projectorFlicker {
  0%,18%,22%,52%,55%,100%{opacity:1} 20%{opacity:.93} 53%{opacity:.96}
}

.lead,.rule,.article__body { border-radius:0; }
.lead { box-shadow:0 28px 80px rgba(0,0,0,.38); }

#films { counter-reset:film; }
.film {
  counter-increment:film;
  border-radius:2px;
  box-shadow:0 18px 42px rgba(0,0,0,.48);
}
.film::before {
  content:"FRAME 0" counter(film) "  /  24 FPS";
  position:absolute;
  z-index:5;
  top:10px;
  left:12px;
  padding:4px 7px;
  color:rgba(255,244,211,.92);
  background:rgba(0,0,0,.66);
  font-family:"Courier New",monospace;
  font-size:9px;
  font-weight:700;
  letter-spacing:.13em;
  pointer-events:none;
}
.film::after { border-radius:0; opacity:.55; }
.film__photo img {
  filter:saturate(.82) contrast(1.1) brightness(.9) sepia(.035);
}
.film:hover .film__photo img {
  filter:saturate(.96) contrast(1.13) brightness(.94) sepia(.02);
}
.film__photo::before {
  content:"35MM  •  " counter(film);
  border:1px solid rgba(255,244,211,.34);
  border-radius:0;
  font-family:"Courier New",monospace;
}
.film__photo::after { border-radius:50%; }
.film__body { border-top:1px solid rgba(241,213,138,.22); }
.film__meta { font-family:"Courier New","Yu Gothic",monospace; letter-spacing:.02em; }

.article__body::before {
  content:"ROLL 01   SCENE 01   TAKE 01   /   THE ONE SHOT";
  background:repeating-linear-gradient(135deg,#111 0 24px,#e8e1d5 24px 48px);
}

.lightbox { background:rgba(0,0,0,.97); }
.lightbox__dialog { border-radius:0; box-shadow:0 0 0 1px rgba(255,255,255,.08),0 40px 120px #000; }
.lightbox__visual { position:relative; }
.lightbox__visual::after {
  content:"PREVIEW  •  35MM  •  24 FPS";
  position:absolute;
  left:18px;
  bottom:15px;
  padding:5px 8px;
  color:#f1d58a;
  background:rgba(0,0,0,.72);
  font:700 10px/1 "Courier New",monospace;
  letter-spacing:.18em;
}

@media (max-width:760px){
  body::before{opacity:.1}
  .hero{border-top-width:8px;border-bottom-width:8px}
  .hero::before{letter-spacing:.12em}
  .film::before{font-size:8px}
}


/* Lead section as a 35mm film title card; keep the top key visual untouched */
.hero {
  border-top:0;
  border-bottom:1px solid rgba(241,213,138,.38);
  box-shadow:none;
}
.hero__image {
  filter:none;
  animation:none;
  transform:none;
}
.hero::before,
.hero::after {
  display:none;
  content:none;
  animation:none;
}

.lead {
  position:relative;
  overflow:hidden;
  margin-top:0;
  padding:clamp(92px,10vw,128px) clamp(34px,7vw,82px) clamp(74px,8vw,104px);
  border:1px solid rgba(218,197,152,.34);
  border-top:0;
  color:#eee8dd;
  background:
    linear-gradient(90deg,rgba(103,19,14,.2),transparent 12%,transparent 88%,rgba(103,19,14,.2)),
    radial-gradient(circle at 48% 40%,rgba(255,244,211,.07),transparent 48%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 4px),
    #11100e !important;
  box-shadow:0 30px 90px rgba(0,0,0,.55),inset 0 0 100px rgba(0,0,0,.42);
}
.lead::before {
  content:"ROLL 01   •   OPENING TITLE   •   24 FPS   •   THE ONE SHOT";
  position:absolute;
  top:0;
  left:0;
  right:0;
  width:auto;
  height:54px;
  display:flex;
  align-items:center;
  padding:0 clamp(24px,5vw,52px);
  color:rgba(246,226,171,.88);
  background:
    radial-gradient(circle,transparent 0 5px,#050505 5.5px 8px,transparent 8.5px) 10px center/30px 24px repeat-x,
    linear-gradient(180deg,#070706,#12100d);
  border-bottom:1px solid rgba(241,213,138,.34);
  font:700 clamp(9px,1vw,11px)/1 "Courier New",monospace;
  letter-spacing:.18em;
  white-space:nowrap;
  overflow:hidden;
  text-shadow:0 1px 8px #000;
}
.lead::after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:30px;
  pointer-events:none;
  background:
    radial-gradient(circle,transparent 0 5px,#050505 5.5px 8px,transparent 8.5px) 10px center/30px 24px repeat-x,
    linear-gradient(180deg,#12100d,#050505);
  border-top:1px solid rgba(241,213,138,.24);
}
.lead p {
  position:relative;
  z-index:1;
  max-width:880px;
  color:#eee8dd;
  font-size:clamp(16px,1.45vw,19px);
  line-height:2.2;
  letter-spacing:.02em;
  text-shadow:0 2px 18px rgba(0,0,0,.8);
}
.lead p::before {
  content:"PROLOGUE / 001";
  display:block;
  margin-bottom:24px;
  color:#c9a451;
  font:700 10px/1 "Courier New",monospace;
  letter-spacing:.28em;
}
.lead p::after {
  content:"— END OF PROLOGUE —";
  display:block;
  margin-top:28px;
  color:rgba(238,232,221,.46);
  font:700 9px/1 "Courier New",monospace;
  letter-spacing:.22em;
  text-align:center;
}

@media (max-width:760px){
  .lead{padding:82px 28px 62px}
  .lead::before{height:48px;padding-inline:18px;font-size:8px;letter-spacing:.1em}
  .lead::after{height:26px}
  .lead p{line-height:2.05}
}

@media (prefers-reduced-motion:reduce){body::before,.hero__image,.hero::after{animation:none!important}}

/* Remove decorative film-label text; retain the visual film treatment only */
.hero::before { display:none !important; content:none !important; }
.film::before { display:none !important; content:none !important; }
.film__photo::before { display:none !important; content:none !important; }
.article__body::before { content:"" !important; color:transparent !important; text-shadow:none !important; }
.article .article__body .section-title::before { display:none !important; content:none !important; }
#films .section-title::before { display:none !important; content:none !important; }
.distribution p::before { display:none !important; content:none !important; }
.lightbox__visual::after { display:none !important; content:none !important; }
.lead::before { content:"" !important; color:transparent !important; text-shadow:none !important; }
.lead p::before,
.lead p::after { display:none !important; content:none !important; }

/* Editorial image sequence */
.article__body {
  max-width: 980px;
}
.article__story {
  position: relative;
  z-index: 1;
}
.article__scene {
  margin: 0;
}
.article__scene + .article__scene {
  margin-top: 10px;
}
.article__media {
  position: relative;
  margin: 0px 0px 20px 0px;
  overflow: hidden;
  border: 1px solid rgba(32, 27, 24, .28);
  background: #0a0908;
  box-shadow: 0 24px 58px rgba(38, 27, 19, .18);
}
.article__media::before {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0,0,0,.14), transparent 18%, transparent 80%, rgba(0,0,0,.2)),
    radial-gradient(ellipse at center, transparent 56%, rgba(0,0,0,.24) 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
.article__media::after {
  content: "";
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  pointer-events: none;
  background: linear-gradient(90deg, #8f0b08, #b98a32 46%, rgba(255,255,255,.58), #8f0b08);
}
.article__media img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  filter: saturate(.9) contrast(1.06) brightness(.94);
  transition: transform 1.1s var(--ease), filter 1.1s ease;
}
.article__media:hover img {
  transform: scale(1.025);
  filter: saturate(.98) contrast(1.08) brightness(.98);
}
.article__scene p {
  margin: 0;
}
.article__scene:first-child p::first-letter {
  float: left;
  margin: .12em .16em 0 0;
  color: #9a0c09;
  font-size: 4.1em;
  font-weight: 700;
  line-height: .78;
}
@media (max-width: 760px) {
  .article__scene + .article__scene { margin-top: 15px; }
  .article__media { margin-inline: -10px; }
  .article__media img { aspect-ratio: 4 / 3; }
}

/* Distribution panel with jacket art */
.distribution .wrap {
  width: min(980px, calc(100% - 40px));
  display: grid;
  grid-template-columns: minmax(180px, 300px) minmax(0, 1fr);
  align-items: center;
  gap: clamp(30px, 5vw, 72px);
  text-align: left;
}
.distribution__jacket {
  position: relative;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(241, 213, 138, .42);
  background: #050505;
  box-shadow: 0 28px 70px rgba(0, 0, 0, .55);
}
.distribution__jacket::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 56%, rgba(0,0,0,.24));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
.distribution__jacket img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  filter: saturate(.92) contrast(1.05);
}
.distribution__content { min-width: 0; }
.distribution__content p { text-align: left; }
.distribution__content .links { justify-content: flex-start; }
.article__scene:first-child p::first-letter {
  float: none;
  margin: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}
.dropcap {
  float: left;
  margin: .12em .16em 0 0;
  color: #9a0c09;
  font-size: 4.1em;
  font-weight: 700;
  line-height: .78;
}
@media (max-width: 760px) {
  .distribution .wrap {
    grid-template-columns: 1fr;
    width: min(100% - 28px, 560px);
    gap: 30px;
  }
  .distribution__jacket { width: min(72vw, 320px); margin-inline: auto; }
  .distribution__content,
  .distribution__content p { text-align: center; }
  .distribution__content .links { justify-content: center; }
}

/* Uncropped image pass: preserve every source image's full frame */
.film__photo {
  display: grid;
  place-items: center;
  background: #050505;
}
.film__photo img {
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center;
}
.film:hover .film__photo img {
  transform: none !important;
}

.article__media {
  display: grid;
  place-items: center;
  background: #050505;
}
.article__media img {
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center;
}
.article__media:hover img {
  transform: none !important;
}

.distribution__jacket {
  display: grid;
  place-items: center;
}
.distribution__jacket img {
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center;
}

.lightbox__visual img {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  object-position: center;
}

/* Lightbox image size refinement */
.lightbox__visual {
  display: grid;
  place-items: center;
  padding: clamp(24px, 4vw, 56px);
  min-height: 0;
}

.lightbox__visual img {
  width: auto;
  height: auto;
  max-width: min(82%, 720px);
  max-height: 68vh;
  object-fit: contain;
}

@media (max-width: 980px) {
  .lightbox__visual {
    padding: 24px;
  }

  .lightbox__visual img {
    max-width: min(88%, 620px);
    max-height: 54vh;
  }
}

@media (max-width: 680px) {
  .lightbox__visual {
    padding: 18px;
  }

  .lightbox__visual img {
    max-width: 92%;
    max-height: 46vh;
  }
}

/* Mobile card thumbnails: keep desktop size, reduce only on phones */
@media (max-width: 640px) {
  .film__photo {
    width: min(82%, 360px);
    margin: 18px auto 0;
  }

  .film__photo img {
    width: 100%;
    height: auto;
    aspect-ratio: auto !important;
    object-fit: contain !important;
  }

  .film__body {
    padding-top: 24px;
  }
}

/* Latest gallery: thumbnails only; full details remain in the lightbox */
#films .films {
  align-items: start;
}

#films .film {
  background: #050505;
}

#films .film__photo {
  display: block;
}

#films .film__photo img {
  width: 100%;
  height: auto;
  object-fit: contain !important;
}

/* YouTube introduction block */
.youtube-feature {
  position: relative;
  overflow: hidden;
  color: var(--cream);
  background:
    radial-gradient(circle at 50% 0%, rgba(162, 13, 11, 0.22), transparent 34%),
    linear-gradient(180deg, #080706, #030303);
  border-top: 1px solid rgba(241, 213, 138, 0.28);
  border-bottom: 1px solid rgba(241, 213, 138, 0.28);
}

.youtube-feature__inner {
  max-width: 1040px;
}

.youtube-feature__title {
  margin: 0 0 30px;
  color: var(--gold-light);
  font-size: clamp(28px, 4.2vw, 54px);
  line-height: 1.35;
  text-align: center;
}

.youtube-feature__frame {
  position: relative;
  width: min(920px, 100%);
  margin: 0 auto;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 1px solid rgba(241, 213, 138, 0.48);
  background: #000;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.52);
}

.youtube-feature__frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (max-width: 640px) {
  #films .films {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 12px;
  }

  #films .film__photo {
    width: 100%;
    max-width: none;
    margin: 0;
  }

  .youtube-feature__title {
    margin-bottom: 22px;
    font-size: clamp(25px, 8vw, 36px);
  }
}

/* Readability pass for the short-film gallery */
#films .films {
  gap: 24px 18px;
}

#films .film {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(241, 213, 138, 0.42);
  background: #050505;
  box-shadow: 0 18px 46px rgba(0,0,0,.44);
}

#films .film::before,
#films .film::after {
  content: none !important;
  display: none !important;
}

#films .film__photo {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  background: #000;
}

#films .film__photo::before,
#films .film__photo::after {
  content: none !important;
  display: none !important;
}

#films .film__photo img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain !important;
  transition: transform .45s var(--ease), filter .45s ease;
}

#films .film:hover .film__photo img,
#films .film:focus-within .film__photo img {
  transform: scale(1.025);
  filter: brightness(.76) contrast(1.05);
}

.film__summary {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 58px 18px 17px;
  color: #fff;
  text-align: left;
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(0,0,0,.22) 24%, rgba(0,0,0,.94) 100%);
}

.film__number {
  display: inline-block;
  margin-bottom: 7px;
  color: var(--gold-light);
  font-family: Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
}

.film__summary strong {
  display: block;
  margin: 0;
  font-size: clamp(16px, 1.5vw, 21px);
  line-height: 1.35;
}

.film__summary span:last-child {
  display: block;
  margin-top: 5px;
  color: rgba(255,255,255,.78);
  font-size: 12px;
  line-height: 1.45;
}

.film__open {
  position: absolute;
  z-index: 4;
  top: 12px;
  right: 12px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(241,213,138,.7);
  border-radius: 50%;
  color: var(--gold-light);
  background: rgba(0,0,0,.62);
  font-family: Arial, sans-serif;
  font-size: 19px;
  line-height: 1;
  pointer-events: none;
  backdrop-filter: blur(5px);
}

#films .film__photo:focus-visible {
  outline: 2px solid var(--gold-light);
  outline-offset: 4px;
}

@media (max-width: 640px) {
  #films .films {
    gap: 14px 10px;
  }

  .film__summary {
    padding: 42px 11px 11px;
  }

  .film__number {
    margin-bottom: 4px;
    font-size: 8px;
  }

  .film__summary strong {
    font-size: 13px;
  }

  .film__summary span:last-child {
    margin-top: 3px;
    font-size: 10px;
  }

  .film__open {
    top: 8px;
    right: 8px;
    width: 28px;
    height: 28px;
    font-size: 16px;
  }
}

/* Stronger visual separation for the short-film introduction */
#films {
  position: relative;
  color: #171412;
  background:
    radial-gradient(circle at 50% 0%, rgba(162, 13, 11, .09), transparent 34%),
    repeating-linear-gradient(0deg, rgba(45, 35, 27, .018) 0 1px, transparent 1px 5px),
    #eee7dc !important;
  border-top: 1px solid rgba(87, 67, 48, .24);
  border-bottom: 1px solid rgba(87, 67, 48, .24);
}

#films::before,
#films::after {
  content: "" !important;
  position: absolute;
  inset: 0;
  pointer-events: none;
}

#films::before {
  display: block !important;
  opacity: 1 !important;
  background:
    linear-gradient(90deg, rgba(162,13,11,.055), transparent 18%, transparent 82%, rgba(185,138,50,.06));
}

#films::after {
  display: block !important;
  inset: 28px max(16px, 3vw);
  border-top: 1px solid rgba(162, 13, 11, .24);
  border-bottom: 1px solid rgba(185, 138, 50, .3);
}

#films .wrap {
  position: relative;
  z-index: 1;
  padding-top: clamp(24px, 3vw, 40px);
  padding-bottom: clamp(24px, 3vw, 40px);
}

#films .section-title {
  color: #171412 !important;
  text-shadow: none !important;
}

#films .section-title::after {
  width: 132px;
  height: 4px;
  background: linear-gradient(90deg, #a20d0b 0 58%, #171412 58% 74%, #b98a32 74%) !important;
}

#films .films {
  padding: clamp(18px, 2.4vw, 30px);
  border: 1px solid rgba(36, 30, 26, .18);
  background: rgba(255, 253, 249, .72);
  box-shadow:
    0 28px 70px rgba(43, 29, 18, .13),
    0 1px 0 rgba(255,255,255,.85) inset;
}

#films .film {
  border-color: rgba(36, 30, 26, .3) !important;
  box-shadow: 0 14px 30px rgba(30, 22, 16, .2) !important;
}

#films .film:hover,
#films .film:focus-within {
  border-color: #a20d0b !important;
  box-shadow:
    0 22px 46px rgba(30, 22, 16, .3),
    0 0 0 2px rgba(162, 13, 11, .16) !important;
}

@media (max-width: 640px) {
  #films::after {
    inset: 16px 8px;
  }

  #films .wrap {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  #films .films {
    padding: 10px;
  }
}

/* Dark cinematic section + light inner gallery panel */
#films {
  position: relative;
  background:
    radial-gradient(circle at 50% 0%, rgba(162,13,11,.34), transparent 34%),
    linear-gradient(180deg, #140504 0%, #080605 48%, #030303 100%) !important;
  border-top: 1px solid rgba(241,213,138,.2);
  border-bottom: 1px solid rgba(241,213,138,.16);
}
#films::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .16;
  background-image: radial-gradient(circle, rgba(255,255,255,.5) 0 .6px, transparent .8px);
  background-size: 5px 5px;
}
#films .section-title {
  color: var(--gold-light) !important;
  text-shadow: 0 4px 24px rgba(0,0,0,.55);
}
#films .section-title::before {
  color: rgba(241,213,138,.7) !important;
}
#films .section-title::after {
  background: linear-gradient(90deg, transparent, var(--gold-light), transparent) !important;
}
#films .films {
  position: relative;
  z-index: 1;
  padding: clamp(18px, 2.4vw, 30px);
  border: 1px solid rgba(92,62,37,.2);
  background:
    repeating-linear-gradient(0deg, rgba(52,38,28,.018) 0 1px, transparent 1px 5px),
    linear-gradient(135deg, rgba(255,253,249,.98), rgba(238,229,216,.96));
  box-shadow:
    0 28px 70px rgba(0,0,0,.42),
    0 1px 0 rgba(255,255,255,.86) inset;
}
#films .film {
  background: #090807 !important;
}
@media (max-width: 640px) {
  #films .films {
    padding: 14px;
  }
}

/* Remove white dot texture from the short-film section */
#films::before {
  background-image: none !important;
  opacity: 0 !important;
}

/* Match the editorial headline to the dramatic rule-section treatment */
.article .article__body > .section-title {
  position: relative;
  width: min(920px, 100%);
  margin: 0 auto clamp(54px, 7vw, 84px);
  padding: clamp(54px, 7vw, 82px) clamp(24px, 6vw, 72px);
  border: 0 !important;
  color: #171210;
  text-align: center;
  font-size: clamp(32px, 5.5vw, 72px);
  line-height: 1.32;
  letter-spacing: -.045em;
  text-wrap: balance;
  text-shadow: 0 1px 0 rgba(255,255,255,.9);
  background:
    radial-gradient(circle at 50% 50%, rgba(162,13,11,.09), transparent 42%),
    linear-gradient(135deg, rgba(249,246,240,.98), rgba(238,231,220,.98));
  box-shadow: 0 24px 64px rgba(43,29,18,.12);
}
.article .article__body > .section-title::before,
.article .article__body > .section-title::after {
  display: block !important;
  content: "" !important;
  position: absolute;
  left: 50%;
  width: min(760px, calc(100% - 48px));
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(162,13,11,.82), #b98a32, rgba(162,13,11,.82), transparent);
}
.article .article__body > .section-title::before { top: 28px; }
.article .article__body > .section-title::after { bottom: 28px; margin: 0; }

@media (max-width: 760px) {
  .article .article__body > .section-title {
    margin-bottom: 48px;
    padding: 40px 0px;
    font-size: clamp(30px, 9vw, 46px);
    line-height: 1.42;
  }
  .article .article__body > .section-title::before { top: 22px; }
  .article .article__body > .section-title::after { bottom: 22px; }
}

/* Reference-matched typography + site chrome */
:root { --site-header-height: 68px; }
body { letter-spacing: .035em; }
.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 120;
  background: linear-gradient(180deg, rgba(5,3,3,.96), rgba(5,3,3,.58));
  border-bottom: 1px solid rgba(241,213,138,.38);
  box-shadow: 0 0 34px rgba(185,138,50,.12);
  backdrop-filter: blur(14px);
}
.site-header__inner {
  width: min(1120px, calc(100% - 36px));
  height: var(--site-header-height);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.site-brand {
  min-width: 0;
  display: grid;
  line-height: 1;
  text-decoration: none;
}
.site-brand small {
  color: #b98a32;
  font-family: Arial, sans-serif;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .28em;
}
.site-brand strong {
  margin-top: 5px;
  color: #f1d58a;
  font-size: clamp(14px, 1.55vw, 22px);
  letter-spacing: .04em;
  white-space: nowrap;
  text-shadow: 0 0 14px rgba(241,213,138,.28);
}
.site-nav {
  display: flex;
  gap: 18px;
  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .12em;
}
.site-nav a { color: #c8bbae; text-decoration: none; transition: color .2s ease; }
.site-nav a:hover, .site-nav a:focus-visible { color: #f1d58a; }
.hero { padding-top: var(--site-header-height); }
.lead p,
.article__scene p {
  font-size: clamp(16px, 1.35vw, 19px) !important;
  line-height: 1.95 !important;
  letter-spacing: .035em;
}
.article .article__body > .section-title {
  font-size: clamp(30px, 4.8vw, 62px);
  line-height: 1.28;
}
.site-footer {
  background:
    radial-gradient(circle at 50% 0%, rgba(162,13,11,.18), transparent 34%),
    linear-gradient(180deg, #0a0504, #020202);
  border-top: 1px solid rgba(241,213,138,.34);
}
.site-footer__inner {
  width: min(1120px, calc(100% - 36px));
  margin: 0 auto;
  padding: 48px 0 56px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 28px;
  align-items: end;
}
.site-footer__brand { display: grid; gap: 10px; }
.site-footer__brand strong { color: #f1d58a; font-size: clamp(20px, 2.6vw, 34px); }
.site-footer__brand p { margin: 0; max-width: 620px; color: #b9aa91; font-size: 13px; line-height: 1.8; }
.site-footer__nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 14px 18px; }
.site-footer__nav a { color: #c8bbae; font-family: Arial, sans-serif; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-decoration: none; }
.site-footer__nav a:hover, .site-footer__nav a:focus-visible { color: #f1d58a; }
.site-footer__copy {
  grid-column: 1 / -1;
  padding-top: 24px;
  border-top: 1px solid rgba(241,213,138,.18);
  color: #8f8275;
  font-family: Arial, sans-serif;
  font-size: 11px;
  letter-spacing: .1em;
}
@media (max-width: 760px) {
  :root { --site-header-height: 58px; }
  .site-header__inner { width: calc(100% - 24px); }
  .site-nav { display: none; }
  .site-brand strong { font-size: 14px; }
  .article .article__body > .section-title { font-size: clamp(28px, 8.2vw, 42px); }
  .site-footer__inner { width: calc(100% - 28px); grid-template-columns: 1fr; padding: 38px 0 42px; }
  .site-footer__nav { justify-content: flex-start; }
}

/* Crank-in common header / footer */
:root { --crankin-header-height: 62px; }
.crankin-header {
  position: fixed; inset: 0 0 auto; z-index: 1000;
  background: rgba(255,255,255,.98); color:#111;
  border-bottom: 1px solid #e6e6e6;
  box-shadow: 0 2px 12px rgba(0,0,0,.12);
  font-family: Arial, "Hiragino Kaku Gothic ProN", sans-serif;
}
.crankin-header__inner {
  width: min(1180px, calc(100% - 30px)); height: var(--crankin-header-height);
  margin:auto; display:flex; align-items:center; justify-content:space-between;
}
.crankin-header__logo img { width:126px; height:auto; }
.crankin-header__tools { display:flex; align-items:center; gap:15px; }
.crankin-header__search { color:#111; font-size:28px; line-height:1; text-decoration:none; transform:rotate(-20deg); }
.crankin-header__menu { width:34px; height:30px; padding:4px; border:0; background:transparent; display:grid; align-content:center; gap:5px; cursor:pointer; }
.crankin-header__menu span { display:block; height:2px; background:#111; }
.crankin-drawer { display:none; grid-template-columns:repeat(6,auto); justify-content:center; gap:24px; padding:14px 20px 16px; border-top:1px solid #eee; background:#fff; }
.crankin-drawer.is-open { display:grid; }
.crankin-drawer a { color:#222; font-size:13px; font-weight:700; text-decoration:none; }
.hero { padding-top: var(--crankin-header-height) !important; }
.crankin-footer-section { background:#111; color:#fff; font-family:Arial,"Hiragino Kaku Gothic ProN",sans-serif; }
.crankin-footer { width:min(1120px,calc(100% - 36px)); margin:auto; padding:48px 0 32px; text-align:center; }
.crankin-footer__tagline { margin:0 0 14px; font-size:14px; font-weight:700; }
.crankin-footer__logo { margin:0; }
.crankin-footer__logo img { width:150px; filter:brightness(0) invert(1); }
.crankin-footer__links { margin:30px auto 0; padding-top:22px; border-top:1px solid #383838; display:flex; flex-wrap:wrap; justify-content:center; gap:12px 24px; }
.crankin-footer__links a { color:#ccc; font-size:12px; text-decoration:none; }
.crankin-footer__links a:hover { color:#fff; }
.crankin-footer__copy { margin:28px 0 0; color:#777; font-size:10px; }
@media(max-width:750px){
 :root{--crankin-header-height:54px}
 .crankin-header__inner{width:calc(100% - 24px)}
 .crankin-header__logo img{width:110px}
 .crankin-drawer{grid-template-columns:1fr 1fr; justify-items:center; gap:0; padding:0 12px 12px}
 .crankin-drawer a{width:100%; padding:11px; border-bottom:1px solid #eee; text-align:center}
 .crankin-footer{width:calc(100% - 28px);padding:40px 0 28px}
 .crankin-footer__links{display:grid;grid-template-columns:1fr 1fr;gap:0;text-align:left}
 .crankin-footer__links a{padding:10px;border-bottom:1px solid #2b2b2b}
}

/* Crank-in common header: checkbox drawer specification */
:root { --crankin-header-height: 62px; }
#header { position: relative; z-index: 2000; font-family: Arial, "Hiragino Kaku Gothic ProN", sans-serif; }
#header .top { position: fixed; inset: 0 0 auto; z-index: 2000; background: #fff; border-bottom: 1px solid #e7e7e7; box-shadow: 0 2px 10px rgba(0,0,0,.12); }
#header .header { width: min(1180px, calc(100% - 30px)); height: var(--crankin-header-height); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
#header .logo { line-height: 0; }
#header .logo img { display: block; width: 126px; height: auto; }
.drawer_area { margin-left: auto; }
.drawer-hidden { position: absolute; opacity: 0; pointer-events: none; }
.drawer-open { position: relative; z-index: 2202; width: 38px; height: 38px; display: grid; place-items: center; cursor: pointer; }
.drawer-open span, .drawer-open span::before, .drawer-open span::after { width: 28px; height: 2px; display: block; background: #111; transition: transform .28s ease, top .28s ease, opacity .2s ease; }
.drawer-open span { position: relative; }
.drawer-open span::before, .drawer-open span::after { content: ""; position: absolute; left: 0; }
.drawer-open span::before { top: -8px; }
.drawer-open span::after { top: 8px; }
#togglenav:checked + .drawer-open span { background: transparent; }
#togglenav:checked + .drawer-open span::before { top: 0; transform: rotate(45deg); }
#togglenav:checked + .drawer-open span::after { top: 0; transform: rotate(-45deg); }
.togglenav-bg { position: fixed; z-index: 2198; inset: 0; visibility: hidden; opacity: 0; background: rgba(0,0,0,.52); cursor: pointer; transition: .28s ease; }
.drawermenu { position: fixed; z-index: 2200; top: 0; right: 0; width: min(430px, 88vw); height: 100dvh; overflow-y: auto; transform: translateX(105%); background: #fff; color: #222; box-shadow: -12px 0 34px rgba(0,0,0,.24); transition: transform .32s cubic-bezier(.22,1,.36,1); }
#togglenav:checked ~ .togglenav-bg { visibility: visible; opacity: 1; }
#togglenav:checked ~ .drawermenu { transform: translateX(0); }
.menu_all section { padding-bottom: 40px; }
.drawer-spacer { min-height: var(--crankin-header-height); background: #f9f9f9; }
.menu_title, .menu_title_sub { margin: 0; padding: 16px 22px; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #ddd; background: #f4f4f4; color: #111; font-size: 16px; line-height: 1.4; }
.menu_title a, .menu_title_sub a { color: inherit; text-decoration: none; }
.menu_list { margin: 0; padding: 0; list-style: none; }
.menu_list li { border-bottom: 1px solid #ececec; }
.menu_list .txt p { margin: 0; padding: 14px 22px; color: #be171b; font-size: 14px; }
.menu_list a { color: #222; text-decoration: none; }
.menu_list a:hover, .menu_title a:hover, .menu_title_sub a:hover { color: #b60b08; }
.hero { padding-top: var(--crankin-header-height) !important; }
@media (max-width: 750px) {
  :root { --crankin-header-height: 54px; }
  #header .header { width: calc(100% - 24px); }
  #header .logo img { width: 110px; }
  .drawer-open { width: 36px; height: 36px; }
  .drawermenu { width: min(390px, 92vw); }
}

/* Crank-in common header: normal flow, not sticky/fixed */
#header,
#header .top,
#header .header {
  position: static !important;
  inset: auto !important;
  top: auto !important;
}
body {
  padding-top: 0 !important;
}

/* Crank-in common footer */
.site-footer {
  margin-top: 0;
  padding: 46px 20px 28px;
  color: #fff;
  background: #111;
  text-align: center;
  font-family: Arial, "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  border-top: 1px solid #333;
}
.site-footer .footer-txt {
  margin: 0 0 14px;
  font-size: 13px;
  letter-spacing: .08em;
}
.site-footer .footer-logo {
  margin: 0;
}
.site-footer .footer-logo img {
  width: 150px;
  height: auto;
  margin: 0 auto;
}
.site-footer .footer-under-area {
  margin-top: 28px;
}
.site-footer .footer-navbar {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.site-footer .footer-navbar + .footer-navbar {
  margin-top: 8px;
}
.site-footer .footer-navbar li {
  display: flex;
  align-items: center;
}
.site-footer .footer-navbar li + li::before {
  content: "|";
  margin: 0 12px;
  color: #666;
}
.site-footer .footer-navbar a {
  color: #ddd;
  font-size: 12px;
  text-decoration: none;
}
.site-footer .footer-navbar a:hover,
.site-footer .footer-navbar a:focus-visible {
  color: #fff;
  text-decoration: underline;
}
.site-footer .footer-copy {
  margin: 26px 0 0;
  color: #888;
  font-size: 11px;
}
@media (max-width: 680px) {
  .site-footer {
    padding: 38px 16px 24px;
  }
  .site-footer .footer-navbar {
    display: grid;
    gap: 10px;
  }
  .site-footer .footer-navbar li {
    justify-content: center;
  }
  .site-footer .footer-navbar li + li::before {
    display: none;
  }
}

/* Final: plain Crank-in common header */
#header {
  position: static !important;
  z-index: auto !important;
  width: 100%;
  background: #fff !important;
}
#header .top {
  position: static !important;
  inset: auto !important;
  width: 100%;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid #e5e5e5 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}
#header .header {
  position: static !important;
  height: 62px;
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
#header .logo,
#header .drawer_area {
  filter: none !important;
  text-shadow: none !important;
}
.hero {
  padding-top: 0 !important;
}
@media (max-width: 750px) {
  #header .header { height: 54px; }
}

/* Header is a completely independent, plain white Crank-in common component. */
#header {
  position: relative !important;
  z-index: 10010 !important;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  isolation: isolate;
  color: #222 !important;
  background: #fff !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
}
#header::before,
#header::after,
#header .top::before,
#header .top::after,
#header .header::before,
#header .header::after {
  content: none !important;
  display: none !important;
}
#header .top {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #222 !important;
  background: #fff !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
}
#header .header {
  position: static !important;
  width: min(1180px, calc(100% - 30px)) !important;
  height: 62px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  color: #222 !important;
  background: #fff !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
}
#header .logo,
#header .logo a,
#header .logo img,
#header .drawer_area,
#header .drawer-open {
  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
}
#header .logo img {
  width: 126px !important;
  height: auto !important;
  margin: 0 !important;
}
main {
  position: relative;
  z-index: 1;
}
@media (max-width: 750px) {
  #header .header {
    width: calc(100% - 24px) !important;
    height: 54px !important;
  }
  #header .logo img { width: 110px !important; }
}

/* Remove decorative lead pseudo-element */
.lead::before {
  content: none !important;
  display: none !important;
}

/* Spacing refinement: tighter vertical rhythm on desktop and mobile */
.hero { margin-bottom: 0 !important; }
.lead {
  padding-top: clamp(34px, 4.5vw, 56px) !important;
  padding-bottom: clamp(34px, 4.5vw, 56px) !important;
}
.rule {
  padding-top: clamp(58px, 6.5vw, 82px) !important;
  padding-bottom: clamp(58px, 6.5vw, 82px) !important;
}
.section {
  padding-top: clamp(58px, 6vw, 78px) !important;
  padding-bottom: clamp(58px, 6vw, 78px) !important;
}
#films { padding-top: 0 !important; padding-bottom: 0 !important; }
#films .wrap { padding-top: clamp(54px, 6vw, 74px) !important; padding-bottom: clamp(54px, 6vw, 74px) !important; }
.section-title { margin-bottom: 28px !important; }
.article { padding-top: clamp(64px, 7vw, 92px) !important; padding-bottom: clamp(64px, 7vw, 92px) !important; }
.article__body {
  padding-top: clamp(48px, 5.5vw, 72px) !important;
  padding-bottom: clamp(42px, 5vw, 64px) !important;
}
.article .article__body .section-title { margin-bottom: 30px !important; }
.article-block, .article-scene, .story-block { margin-top: 34px !important; margin-bottom: 34px !important; }
.youtube-section, .youtube-feature, .youtube-intro {
  padding-top: clamp(54px, 6vw, 76px) !important;
  padding-bottom: clamp(54px, 6vw, 76px) !important;
}
.distribution {
  padding-top: clamp(58px, 6vw, 82px) !important;
  padding-bottom: clamp(58px, 6vw, 82px) !important;
}
.distribution .wrap { padding-top: 26px !important; padding-bottom: 26px !important; }
.links { margin-top: 20px !important; }
.site-footer { margin-top: 0 !important; }

@media (max-width: 760px) {
  .lead { padding: 30px 22px !important; }
  .rule { padding: 48px 14px !important; }
  .section { padding-top: 46px !important; padding-bottom: 46px !important; }
  #films .wrap { padding-top: 44px !important; padding-bottom: 44px !important; }
  .section-title { margin-bottom: 22px !important; }
  .article { padding-top: 50px !important; padding-bottom: 50px !important; }
  .article__body { padding: 75px 20px 38px !important; }
  .article .article__body .section-title { margin-bottom: 24px !important; }
  .article-block, .article-scene, .story-block { margin-top: 26px !important; margin-bottom: 26px !important; }
  .youtube-section, .youtube-feature, .youtube-intro { padding-top: 46px !important; padding-bottom: 46px !important; }
  .distribution { padding-top: 48px !important; padding-bottom: 48px !important; }
  .distribution .wrap { padding-top: 20px !important; padding-bottom: 20px !important; }
  .links { margin-top: 16px !important; }
}

/* Final article heading line-balance adjustment */
@media (min-width: 761px) {
  .article__body {
    max-width: 1120px !important;
    padding-left: clamp(48px, 6vw, 82px) !important;
    padding-right: clamp(48px, 6vw, 82px) !important;
  }

  .article .article__body .section-title {
    width: min(100%, 980px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    font-size: clamp(34px, 3.7vw, 52px) !important;
    line-height: 1.35 !important;
    letter-spacing: -0.045em !important;
    text-wrap: balance;
  }
}

@media (max-width: 760px) {
  .article .article__body .section-title {
    margin-top: 40 !important;
    padding-top: 40 !important;
    line-height: 1.5 !important;
  }
}

/* Brighter cinematic balance */
body {
  background:
    radial-gradient(circle at 50% -8%, rgba(239, 38, 30, .28), transparent 34%),
    radial-gradient(circle at 18% 18%, rgba(212, 166, 66, .12), transparent 26%),
    linear-gradient(180deg, #200504 0%, #0b0807 46%, #180403 100%) !important;
}

#films {
  background:
    radial-gradient(circle at 50% 0%, rgba(182, 11, 8, .38), transparent 34%),
    linear-gradient(180deg, #17110f 0%, #090706 100%) !important;
}

.film {
  box-shadow:
    0 20px 50px rgba(0,0,0,.42),
    0 0 24px rgba(241,213,138,.14),
    0 0 44px rgba(182,11,8,.12) !important;
}

.film:hover {
  box-shadow:
    0 28px 70px rgba(0,0,0,.46),
    0 0 30px rgba(241,213,138,.28),
    0 0 56px rgba(239,38,30,.24) !important;
}

.article__body,
.lead,
.youtube-section .wrap,
.distribution .wrap {
  box-shadow:
    0 28px 76px rgba(0,0,0,.24),
    0 0 24px rgba(212,166,66,.12) !important;
}

.section-title,
.rule strong,
.article .section-title {
  text-shadow:
    0 2px 0 rgba(255,255,255,.22),
    0 0 18px rgba(241,213,138,.16) !important;
}

.links a {
  box-shadow:
    0 14px 34px rgba(0,0,0,.28),
    0 0 22px rgba(241,213,138,.2) !important;
}

@media (max-width: 760px) {
  body {
    background:
      radial-gradient(circle at 50% -5%, rgba(239,38,30,.24), transparent 30%),
      linear-gradient(180deg, #1b0504 0%, #0b0807 52%, #150403 100%) !important;
  }

  .film,
  .article__body,
  .lead {
    box-shadow:
      0 16px 38px rgba(0,0,0,.34),
      0 0 18px rgba(241,213,138,.11) !important;
  }
}
	
	
.youtube-feature__grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:32px;
}

.youtube-feature__item{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.youtube-feature__caption{
    margin:0;
    text-align:center;
    color:#f1d58a;
    font-weight:700;
    font-size:15px;
}

.youtube-feature__frame{
    position:relative;
    aspect-ratio:16/9;
    overflow:hidden;
    border:1px solid rgba(241,213,138,.35);
    border-radius:12px;
}

.youtube-feature__frame iframe{
    width:100%;
    height:100%;
    border:0;
}

@media (max-width:760px){
    .youtube-feature__grid{
        grid-template-columns:1fr;
        gap:24px;
    }
}

/* Consolidated lightbox styles */
.lightbox__copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

#lightbox-title,
#lightbox-director,
#lightbox-genre {
  width: 100%;
  max-width: 38em;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

#lightbox-description {
  width: 100%;
  max-width: 38em;
  margin: 24px auto 0;
  text-align: left;
  line-height: 2;
}

.lightbox__close,
.lightbox__prev,
.lightbox__next {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  text-align: center;
  line-height: 1;
}

.lightbox__close {
  font-family: Arial, "Helvetica Neue", sans-serif;
  padding-bottom: 2px;
}

@media (max-width: 760px) {
  .lightbox {
    align-items: stretch;
    justify-items: stretch;
    padding: 0;
    background: rgba(0, 0, 0, 0.96);
    overscroll-behavior: contain;
  }

  .lightbox__dialog {
    width: 100%;
    height: 100dvh;
    max-width: none;
    max-height: none;
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
    border: 0;
    background: linear-gradient(180deg, #080605 0%, #120807 56%, #080504 100%);
    box-shadow: none;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    padding-bottom: calc(92px + env(safe-area-inset-bottom));
  }

  .lightbox__visual {
    width: 100%;
    min-height: 0;
    height: auto;
    padding: calc(58px + env(safe-area-inset-top)) 18px 18px;
    display: grid;
    place-items: center;
    background: radial-gradient(circle at 50% 36%, rgba(241, 213, 138, 0.12), transparent 44%), #030303;
    border-bottom: 1px solid rgba(241, 213, 138, 0.28);
  }

  .lightbox__visual img {
    width: auto;
    max-width: min(88vw, 420px);
    height: auto;
    max-height: 43dvh;
    object-fit: contain;
    border: 1px solid rgba(241, 213, 138, 0.48);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.62), 0 0 22px rgba(241, 213, 138, 0.12);
  }

  .lightbox__copy {
    padding: 24px 22px 34px;
    background: transparent;
  }

  .lightbox__copy h2 {
    margin: 0 0 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(241, 213, 138, 0.32);
    color: #ffe7a3;
    font-size: clamp(25px, 7.4vw, 34px);
    line-height: 1.3;
  }

  .lightbox__copy p {
    color: #f4eadc;
    font-size: 15px;
    line-height: 1.85;
  }

  .lightbox__copy p + p {
    margin-top: 10px;
  }

  #lightbox-director,
  #lightbox-genre {
    color: #d9bf83;
    font-size: 13px;
    line-height: 1.65;
  }

  #lightbox-description {
    max-width: none;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    line-height: 1.9;
  }

  .lightbox__close {
    position: fixed;
    top: calc(10px + env(safe-area-inset-top));
    right: 12px;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: 1px solid rgba(255, 231, 163, 0.76);
    color: #fff4cf;
    background: rgba(12, 8, 6, 0.9);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.46);
    backdrop-filter: blur(8px);
    font-size: 26px;
  }

  .lightbox__prev,
  .lightbox__next {
    position: fixed;
    z-index: 103;
    top: auto;
    bottom: calc(12px + env(safe-area-inset-bottom));
    width: calc(50% - 24px);
    height: 54px;
    transform: none;
    border: 1px solid rgba(241, 213, 138, 0.55);
    border-radius: 999px;
    color: #fff0bd;
    background: linear-gradient(180deg, rgba(119, 18, 14, 0.97), rgba(55, 7, 5, 0.97));
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    font-size: 0;
    backdrop-filter: blur(10px);
  }

  .lightbox__prev { left: 12px; }
  .lightbox__next { right: 12px; }

  .lightbox__prev::before,
  .lightbox__next::before {
    font-family: Arial, "Hiragino Kaku Gothic ProN", sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.08em;
  }

  .lightbox__prev::before { content: "‹  前の作品"; }
  .lightbox__next::before { content: "次の作品  ›"; }

  .lightbox__close:active,
  .lightbox__prev:active,
  .lightbox__next:active {
    transform: scale(0.97);
  }
}

@media (max-width: 380px) {
  .lightbox__visual { padding-inline: 12px; }
  .lightbox__copy { padding-inline: 18px; }
  .lightbox__prev,
  .lightbox__next { width: calc(50% - 18px); }
  .lightbox__prev { left: 8px; }
  .lightbox__next { right: 8px; }
}

/* PCライトボックス：縦長画像に合わせて画像枠を狭める */
@media (min-width: 761px) {
  .lightbox__dialog {
    width: min(1000px, calc(100% - 48px));
    max-height: calc(100dvh - 48px);
    display: flex;
    align-items: stretch;
    padding: 24px;
    overflow: hidden;
    border: 1px solid var(--line);
    background: #0d0505;
  }

  .lightbox__visual {
    flex: 0 0 38%;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
    overflow: hidden;
    background: #000;
  }

  .lightbox__visual img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: calc(100dvh - 96px);
    margin: 0;
    object-fit: contain;
  }

  .lightbox__copy {
    flex: 1;
    min-width: 0;
    max-height: calc(100dvh - 96px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 0 0 24px;
    margin: 0;
    overflow-y: auto;
  }

  #lightbox-title,
  #lightbox-director,
  #lightbox-genre {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }

  #lightbox-description {
    width: 100%;
    max-width: none;
    margin: 24px 0 0;
    text-align: left;
    line-height: 2;
  }
}

/* Rule headline: PCは1行、スマホのみ指定位置で改行 */
.rule strong {
  font-size: 46px;
}

.rule-break {
  display: none;
}

@media (max-width: 760px) {
  .rule strong {
    font-size: 34px;
	  padding: 0px 0px 10px 0px
  }

  .rule-break {
    display: inline;
  }
}

/* ===== extracted style block ===== */

/* ===== Final typography & readability ===== */

/* 基本はゴシック */
body,
.lead,
.article__body,
#films,
.films,
.youtube-feature,
.youtube-feature__title,
.youtube-feature__caption,
.distribution,
.distribution__content,
.distribution p,
.links,
.links a,
.lightbox,
.lightbox__copy,
.header,
.footer {
  font-family: "Hiragino Sans", "Yu Gothic", "Noto Sans JP", sans-serif;
}

/* 演出コピーだけ明朝 */
.article .section-title,
.rule strong {
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
}

/* ルール上の補助文はゴシック */
.rule p {
  font-family: "Hiragino Sans", "Yu Gothic", "Noto Sans JP", sans-serif;
}

/* ショートフィルム一覧はゴシック＆少し小さめ */
#films .section-title {
  font-family: "Hiragino Sans", "Yu Gothic", "Noto Sans JP", sans-serif;
  font-size: clamp(28px, 3.6vw, 46px);
}

/* 見出し内の強調 */
.headline-key,
.headline-focus {
  font-weight: 900;
}

.headline-key,
.headline-focus {
  color: #8f0b08;
}

.headline-focus {
  font-size: 1.05em;
}

/* “真の力”の下線は無し */
.headline-focus::after {
  display: none !important;
  content: none !important;
}

/* リード：黒背景で絶対に黒文字にしない */
.lead .text-title,
.lead .text-quote {
  color: var(--gold-light);
  font-weight: 800;
}

.lead .text-key {
  color: #fff;
  font-weight: 800;
  background: linear-gradient(
    transparent 68%,
    rgba(212, 166, 66, .34) 68%
  );
}

.lead .text-focus {
  color: #ff4a3f;
  font-weight: 900;
}

.lead .people-em {
  color: #fff;
  font-weight: 800;
}

.lead .stage-em {
  color: var(--gold-light);
  font-weight: 800;
}

/* 記事本文：白背景なので黒・赤・金 */
.article__body .text-title {
  color: #8f0b08;
  font-weight: 800;
}

.article__body .text-key {
  color: #171412;
  font-weight: 800;
  background: linear-gradient(
    transparent 68%,
    rgba(185, 138, 50, .22) 68%
  );
}

.article__body .text-focus {
  color: #9a0c09;
  font-weight: 900;
}

.article__body .text-quote {
  color: #7d0a08;
  font-weight: 700;
}

.article__body .people-em {
  color: #171412;
  font-weight: 800;
}

.article__body .stage-em {
  display: inline;
  padding: .08em .22em;
  color: #8f0b08;
  font-weight: 800;
  background: rgba(185, 138, 50, .12);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

/* 動画・配信導線もゴシックで読みやすく */
.youtube-feature__caption {
  font-weight: 700;
  line-height: 1.6;
}

.distribution p {
  font-weight: 500;
  line-height: 1.8;
}

.links a {
  font-weight: 700;
}

/* スマホ */
@media (max-width: 760px) {
  #films .section-title {
    font-size: 30px;
  }

  .headline-focus {
    font-size: 1.02em;
  }

  .article__body .text-focus {
    font-size: 1em;
  }
}

/* ===== extracted style block ===== */

#lightbox-title {
  order: 1;
}

#lightbox-description {
  order: 3;
}

#lightbox-director {
  order: 4;
}

#lightbox-genre {
  order: 2;
}
.lightbox__copy {
  text-align: center;
}

#lightbox-title {
  margin: 0 0 22px;
  color: var(--gold-light);
  font-size: clamp(30px, 3vw, 44px);
  line-height: 1.3;
}

#lightbox-description {
  max-width: 38em;
  margin: 0 auto 28px;
  text-align: left;
}

.lightbox__description-label {
  display: block;
  margin-bottom: 10px;
  color: var(--gold-light);
  font-family: Arial, "Hiragino Kaku Gothic ProN", sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.lightbox__description-text {
  display: block;
  color: var(--cream);
  font-size: 16px;
  line-height: 2;
}

#lightbox-director {
  margin: 0;
  padding-top: 22px;
  border-top: 1px solid rgba(241, 213, 138, 0.35);
  text-align: center;
}

.lightbox__credit-label {
  display: block;
  margin-bottom: 8px;
  color: var(--gold-light);
  font-family: Arial, "Hiragino Kaku Gothic ProN", sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.lightbox__credit-name {
  display: block;
  color: #fff;
  font-size: clamp(26px, 2.5vw, 38px);
  line-height: 1.4;
}

#lightbox-genre {
  margin: 18px 0 0;
  text-align: center;
}

.lightbox__genre-label {
  display: inline-block;
  padding: 6px 14px;
  border: 1px solid rgba(241, 213, 138, 0.45);
  color: var(--gold-light);
  font-size: 12px;
  line-height: 1.4;
}

@media (max-width: 760px) {
  #lightbox-title {
    margin-bottom: 18px;
    font-size: 30px;
  }

  #lightbox-description {
    margin-bottom: 24px;
  }

  .lightbox__description-text {
    font-size: 15px;
    line-height: 1.9;
  }

  #lightbox-director {
    padding-top: 20px;
  }

  .lightbox__credit-name {
    font-size: 26px;
  }
}
@media (max-width: 760px) {
  .lightbox__copy {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 24px 20px 110px;
    text-align: center;
  }

  /* 1. 監督・脚本 */
  #lightbox-director {
    order: 1;
    margin: 0 0 20px;
    padding: 0;
    border: 0;
    text-align: center;
  }

  .lightbox__credit-label {
    display: block;
    margin-bottom: 6px;
    color: var(--gold-light);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .18em;
  }

  .lightbox__credit-name {
    display: block;
    color: #fff;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.4;
  }

  /* 2. タイトル */
  #lightbox-title {
    order: 2;
    margin: 0 0 12px;
    padding: 0;
    color: #ffe7a3;
    font-size: 30px;
    line-height: 1.4;
    text-align: center;
  }

  /* 3. ジャンル */
  #lightbox-genre {
    order: 3;
    margin: 0 0 16px;
    text-align: center;
  }

  .lightbox__genre-label {
    display: inline-block;
    padding: 5px 12px;
    border: 1px solid rgba(241, 213, 138, .45);
    color: var(--gold-light);
    font-size: 11px;
    line-height: 1.4;
  }

  /* 4. あらすじ */
  #lightbox-description {
        order: 4;
        width: 100%;
        margin: 0;
        padding-top: 0px;
        border-top: 0px solid rgba(255, 255, 255, .12) !important;
        text-align: left;
  }

  .lightbox__description-label {
    display: block;
    margin-bottom: 10px;
    color: var(--gold-light);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
  }

  .lightbox__description-text {
    display: block;
    color: #f4eadc;
    font-size: 15px;
    line-height: 1.9;
  }
}