/* =====================================================
   section-worldview.css
   世界観カラム — 展示額フレーム内
   ===================================================== */

/* 注: .top-worldview 基底ブロックは section-soniria.css の上位互換定義に統合済み（低リスクリファクタ 2026-08-26） */

/* --- 世界観画像（4:3 中央クロップ / 左カラムと統一 + 二重マット額縁） --- */
.top-worldview-image {
  position: relative;
  isolation: isolate;
  width: 100%;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid var(--color-border, #DCE6EE);
  box-shadow:
    0 1px 3px rgba(31,32,65,0.06),
    0 6px 16px rgba(31,32,65,0.06),
    inset 0 0 0 1px rgba(255,255,255,0.90);
}

/* 外側リング（角縁）: 外枠〜内側アウトラインまでのドーナツ領域を 50%透過＋blur で額縁化 */
.top-worldview-image::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 7px;
  background: rgba(255,255,255,0.5);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 8px;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  pointer-events: none;
  z-index: 1;
}

.top-worldview-image::after {
  content: "";
  position: absolute;
  inset: 7px;
  border: 1px solid var(--color-fuji, #BBB7DA);
  border-radius: 6px;
  pointer-events: none;
  z-index: 2;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.65);
}

.top-worldview-img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center center;
  border: none;
  border-radius: 0;
  position: relative;
  z-index: 0;
  background: transparent;
}

/* --- テキスト (plan 1788166673044: soniriaと等価な flex 分配で gap整合) --- */
.top-worldview-content{
  padding:0;
  display:flex;
  flex-direction:column;
  flex:1;
  min-width:0;
  gap:0;
}
.top-worldview-title {
  font-size: 1.4em;
  font-weight: 700;
  color: var(--color-main);
  border-bottom: 2px solid var(--color-sky);
  padding-bottom: 0.3em;
  margin-bottom: 0.6rem;
  line-height: 1.25;
}

.top-worldview-desc {
  font-size: 0.95em;
  color: var(--color-text);
  line-height: 1.8;
  margin-bottom: 0;
  word-break: normal;
  overflow-wrap: break-word;
  line-break: strict;
  text-wrap: pretty;
  min-height: calc(1.8em * 3);
}
/* affordance (plan 1788166673044) fallback: worldview単独読込でも soniria側と同一トークン (margin 1.0em / padding 0) */
.top-worldview .top-card-aff{
  margin-top:1.0em;
  align-self:flex-end;
  padding-top:0;
}

/* --- レスポンシブ（768px以下）--- */


/* --- レスポンシブ（480px以下）--- */


/* backdrop-filter 非対応フォールバック: 半透明のみ残す */
@supports not ((backdrop-filter: blur(4px)) or (-webkit-backdrop-filter: blur(4px))) {
  .top-worldview-image::before {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

/* 印刷/PDF: mask/backdrop-filter が印刷パイプラインで無効化され
   ::before が全面ベール化する不具合を回避。
   印刷では mask/backdrop に依存しない border 方式リングに置換し、
   通常表示と同等のドーナツ額縁を再現する。 */
@media print {
  .top-soniria-image,
  .top-worldview-image {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .top-soniria-image::before,
  .top-worldview-image::before {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: transparent !important;
    mask: none !important;
    -webkit-mask: none !important;
    mask-composite: unset !important;
    -webkit-mask-composite: unset !important;
    padding: 0 !important;
    border: 7px solid rgba(255,255,255,0.5) !important;
    border-radius: 8px !important;
  }

  .top-soniria-image::after,
  .top-worldview-image::after {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}