/* ==========================================================
   C×T sub-pages (/tcm など) — page-specific styles
   Shared base: style.css (official site)
   ========================================================== */

/* Hero: 2 lines, highlight the 2nd */
.hero-title .line:nth-child(2) > span { background: linear-gradient(transparent 70%, rgba(255, 214, 10, .85) 70%, rgba(255, 214, 10, .85) 92%, transparent 92%); background-size: 0 100%; background-repeat: no-repeat; transition: transform 1.2s var(--ease) .12s, background-size 1.1s var(--ease) 1.1s; }
.is-loaded .hero-title .line:nth-child(2) > span { background-size: 100% 100%; }

/* Statement: reversed (photo on the right) */
.statement-rev { background: var(--white); }
@media (min-width: 901px) { .statement-rev .statement-grid { grid-template-columns: 1fr 1.15fr; } .statement-rev .statement-photo { order: 2; } }

/* Questions */
.questions { padding: clamp(100px, 13vw, 170px) 0; background: var(--paper); }
.questions-grid { display: grid; grid-template-columns: 1fr 1.35fr; gap: clamp(40px, 6vw, 96px); align-items: start; }
.questions-head { position: sticky; top: calc(var(--header-h) + 32px); }
.questions-photo { margin-top: 36px; border-radius: var(--radius-lg); overflow: hidden; aspect-ratio: 4 / 3; }
.questions-photo img { width: 100%; height: 100%; object-fit: cover; }
.question-list { border-top: 1px solid var(--line); counter-reset: q; }
.question-list li { display: grid; grid-template-columns: 4.2em 1fr; gap: 16px; align-items: baseline; padding: clamp(32px, 4vw, 52px) 0; border-bottom: 1px solid var(--line); }
.question-list li:nth-child(2) { --d: .12s; }
.question-list li:nth-child(3) { --d: .24s; }
.qn { font-family: var(--font-en); font-weight: 800; font-size: clamp(2rem, 3.4vw, 3rem); line-height: 1; color: var(--brand-deep); letter-spacing: -.02em; }
.question-list p { font-family: var(--font-head); font-weight: 900; font-size: clamp(1.3rem, 2.4vw, 2rem); line-height: 1.55; font-feature-settings: "palt" 1; }
@media (max-width: 900px) {
  .questions-grid { grid-template-columns: 1fr; }
  .questions-head { position: static; }
  .question-list li { grid-template-columns: 3em 1fr; }
}

/* Creed */
.creed-title { font-size: clamp(2rem, 4.2vw, 3.6rem); }
.creed-list { margin-top: 36px; display: grid; gap: 12px; max-width: 34em; }
.creed-list li { position: relative; padding: 16px 20px 16px 56px; border: 1px solid var(--line-light); border-radius: 14px; background: rgba(255,255,255,.07); backdrop-filter: blur(4px); font-weight: 700; line-height: 1.7; }
.creed-list li::before { content: ""; position: absolute; left: 20px; top: 50%; width: 20px; height: 20px; margin-top: -10px; border-radius: 50%; background: var(--brand); }
.creed-list li::after { content: ""; position: absolute; left: 26px; top: 50%; width: 8px; height: 4px; margin-top: -4px; border-left: 2px solid var(--ink); border-bottom: 2px solid var(--ink); transform: rotate(-45deg); }
@media (max-width: 720px) { .creed-title { font-size: clamp(1.7rem, 7.6vw, 2.4rem); } }

/* Sites: white band */
.page-concept .sites { background: var(--paper); }

/* Creed heading: use the full column and keep each line unbroken */
.message-inner .creed-title { justify-self: stretch; }
.creed-title .nb { white-space: nowrap; }

/* ==========================================================
   Cross Compass entry (/shindan)
   ========================================================== */
.hero-3 .hero-title .line:nth-child(2) > span { background: none; }
.hero-3 .hero-title { font-size: clamp(2.4rem, 5.4vw, 4.8rem); }
.spec-list { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 10px; }
.spec-list li { display: inline-flex; align-items: baseline; gap: 10px; padding: 8px 18px; border-radius: 999px; background: rgba(255,255,255,.7); border: 1px solid var(--line); font-weight: 700; font-size: 15px; backdrop-filter: blur(6px); }
.spec-list li span { font-family: var(--font-en); font-size: 11px; font-weight: 800; letter-spacing: .12em; color: var(--mute); }

.indicators { position: relative; color: var(--white); padding: clamp(100px, 13vw, 170px) 0; overflow: hidden; background: var(--ink); }
.indicators-media { position: absolute; inset: -12% 0; opacity: .38; }
.indicators-media img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 50%; }
.indicators-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15,27,51,.6), rgba(15,27,51,.92)); }
.indicators-inner { position: relative; }
.indicators .section-title { color: var(--white); }
.ind-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.ind-grid li { padding: 28px 24px 30px; border-radius: var(--radius); background: rgba(255,255,255,.06); border: 1px solid var(--line-light); backdrop-filter: blur(6px); transition: background-color .4s, transform .6s var(--ease); }
.ind-grid li:hover { background: rgba(255,255,255,.1); transform: translateY(-4px); }
.ind-grid li:nth-child(4n+2) { --d: .08s; } .ind-grid li:nth-child(4n+3) { --d: .16s; } .ind-grid li:nth-child(4n) { --d: .24s; }
.ind-en { display: block; font-family: var(--font-en); font-weight: 800; font-size: 13px; letter-spacing: .16em; color: var(--brand); }
.ind-grid h3 { font-size: 1.15rem; line-height: 1.5; margin: 10px 0 8px; letter-spacing: 0; }
.ind-grid p { font-size: 14px; line-height: 1.8; color: rgba(255,255,255,.88); }
.ind-grid .ind-map { background: var(--brand); border-color: var(--brand); color: var(--ink); }
.ind-grid .ind-map .ind-en { color: var(--ink); }
.ind-grid .ind-map p { color: var(--ink-2); }
.ind-grid .ind-map:hover { background: var(--brand); }
@media (max-width: 1080px) { .ind-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .ind-grid { grid-template-columns: 1fr; } }

.how-list { margin-top: 8px; border-top: 1px solid var(--line); }
.how-list li { display: grid; grid-template-columns: 3.4em 1fr; gap: 14px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.how-list li:nth-child(2) { --d: .1s; } .how-list li:nth-child(3) { --d: .2s; }
.how-n { font-family: var(--font-en); font-weight: 800; font-size: 1.9rem; line-height: 1.1; color: var(--brand-deep); }
.how-list h3 { font-size: 1.15rem; margin-bottom: 4px; }
.statement-text .how-list p { color: var(--mute); font-size: 15px; margin: 0; }

/* ==========================================================
   Newsletter (/optin.html)
   ========================================================== */
.nl-hero { display: grid; grid-template-columns: 1fr 1fr; min-height: 100svh; background: var(--paper); }
.nl-photo { position: relative; overflow: hidden; }
.nl-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 38% 40%; animation: nlZoom 9s var(--ease) both; }
@keyframes nlZoom { from { transform: scale(1.08); } to { transform: scale(1); } }
.nl-body { padding: calc(var(--header-h) + 48px) clamp(24px, 5vw, 80px) 64px; display: flex; flex-direction: column; justify-content: center; max-width: 680px; }
.nl-title { font-size: clamp(2.2rem, 4.2vw, 3.6rem); line-height: 1.3; }
.nl-title em { font-style: normal; background: linear-gradient(transparent 70%, rgba(255,214,10,.85) 70%, rgba(255,214,10,.85) 92%, transparent 92%); }
.nl-lead { margin-top: 22px; color: var(--ink-2); }
.nl-card { margin-top: 32px; background: var(--white); border-radius: var(--radius-lg); padding: clamp(24px, 3vw, 36px); box-shadow: 0 30px 70px -40px rgba(15,27,51,.4); }
.nl-card h2 { font-size: 1.1rem; letter-spacing: .02em; }
.nl-card .field { margin-top: 18px; }
.nl-card label { display: block; margin-bottom: 6px; font-size: 13px; font-weight: 700; color: var(--mute); }
.nl-card input[type="email"] { width: 100%; padding: 15px 16px; font: inherit; font-size: 16px; letter-spacing: .02em; color: var(--ink); background: var(--paper); border: 1.5px solid var(--line); border-radius: 12px; transition: border-color .3s, background-color .3s; }
.nl-card input[type="email"]:focus { outline: none; border-color: var(--ink); background: var(--white); }
.nl-card .gate { min-height: 65px; margin-top: 16px; }
.nl-card button[type="submit"] { width: 100%; margin-top: 14px; border: 0; cursor: pointer; font-size: 16px; }
.nl-card button[type="submit"]:disabled { opacity: .6; cursor: default; }
.nl-card .status { margin-top: 14px; min-height: 1.4em; text-align: center; font-size: 14px; font-weight: 700; }
.nl-card .status.ok { color: #1e6b45; }
.nl-card .status.ng { color: #a23b3b; }
.nl-card .privacy { margin-top: 10px; text-align: center; font-size: 12px; line-height: 1.8; color: var(--mute); }
.nl-card .done { text-align: center; padding: 18px 0 6px; }
.nl-card .done .mark { display: inline-grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--brand); color: var(--ink); font-size: 30px; font-weight: 800; }
.nl-card .done p { margin-top: 14px; color: var(--ink-2); }
[hidden] { display: none !important; }
.page-optin .views { border-radius: 0; }
.page-optin .view-card h3 { font-size: clamp(1.1rem, 1.5vw, 1.3rem); }
.nl-cta { padding: clamp(90px, 11vw, 150px) 0; text-align: center; background: var(--paper); }
.nl-cta-inner { max-width: 760px; }
.nl-cta .label { justify-content: center; }
.nl-cta p:not(.label) { margin: 18px 0 30px; color: var(--mute); }
@media (max-width: 960px) {
  .nl-hero { grid-template-columns: 1fr; min-height: 0; }
  .nl-photo { height: 46svh; min-height: 300px; }
  .nl-photo img { object-position: 36% 30%; }
  .nl-body { padding: 36px var(--gutter) 72px; max-width: none; }
}
/* Turnstile needs >= 300px: keep the form card from overflowing on phones */
.nl-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.nl-body { min-width: 0; }
@media (max-width: 960px) { .nl-hero { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 420px) { .nl-card { padding: 22px 14px; border-radius: var(--radius); } }
/* Message headings on sub-pages: full column, no mid-word breaks */
.message-inner .message-title { justify-self: stretch; }
.message-title .nb { white-space: nowrap; }
@media (max-width: 720px) { .message-title:not(.creed-title) { font-size: clamp(1.7rem, 7.8vw, 2.4rem); } }