/* ── 80s 日本映画ポスター風テーマ ── */

body.poster-80s {
  --text-on-dark:  #fffef5;
  --text-on-light: #0a0612;
  --text-muted-on-dark:  rgba(255, 254, 245, 0.88);
  --text-muted-on-light: rgba(10, 6, 18, 0.72);
  --text-shadow-poster: 2px 2px 0 rgba(0, 0, 0, 0.45);
  background: var(--poster-purple);
  color: var(--text-on-dark);
}

body.poster-80s::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 9998;
  pointer-events: none;
  background-image: var(--film-grain);
  background-repeat: repeat;
  background-size: 220px 220px;
  opacity: 0.18;
  mix-blend-mode: overlay;
}

body.poster-80s::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 9997;
  pointer-events: none;
  background: repeating-linear-gradient(
    0deg,
    transparent 0,
    transparent 2px,
    rgba(0, 0, 0, 0.04) 2px,
    rgba(0, 0, 0, 0.04) 4px
  );
}

/* NAV */
body.poster-80s .ws-nav {
  background: var(--dark);
  border-bottom: 1px solid rgba(154, 143, 173, 0.45);
  backdrop-filter: none;
}

body.poster-80s .ws-nav .ws-logo {
  font-family: var(--font);
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 0.04em;
  color: #fffef5;
  text-shadow: none;
  line-height: 1.2;
}

body.poster-80s .ws-nav-cta {
  background: #222;
  color: #fff;
  border: 1px solid #fff;
  border-radius: 4px;
  box-shadow: none;
  font-family: var(--font);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

body.poster-80s .ws-nav-cta:hover {
  background: #444;
  color: #fff;
  transform: none;
  box-shadow: none;
}

body.poster-80s .ws-nav-instagram:hover { color: var(--text-on-dark); }

/* HERO */
body.poster-80s .ws-hero {
  background: var(--dark);
}

body.poster-80s .ws-hero-video {
  opacity: 1;
  filter: none;
}

body.poster-80s .ws-hero-overlay {
  background: linear-gradient(
    to bottom,
    rgba(10, 6, 18, 0.2) 0%,
    rgba(10, 6, 18, 0.55) 55%,
    rgba(10, 6, 18, 0.82) 100%
  );
}

body.poster-80s .ws-poster-eyebrow,
body.poster-80s .ws-hero .ws-eyebrow {
  font-family: var(--font);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255, 254, 245, 0.72);
  background: transparent;
  border: none;
  padding: 0;
  display: flex;
  box-shadow: none;
  margin-bottom: 24px;
}

body.poster-80s .ws-hero-title {
  font-family: var(--font);
  font-size: clamp(40px, 5vw, 68px);
  font-weight: 400;
  line-height: 1.2;
  color: var(--text-on-dark);
  text-shadow: none;
  transform: none;
  margin-bottom: 28px;
  letter-spacing: 0.02em;
}

body.poster-80s .ws-hero-title em {
  font-style: italic;
  color: var(--text-on-dark);
  text-shadow: none;
}

body.poster-80s .ws-hero-sub {
  font-size: 14px;
  font-weight: 400;
  color: var(--text-muted-on-dark);
  background: transparent;
  border-left: none;
  padding: 0;
  line-height: 2;
  max-width: 520px;
}

body.poster-80s .ws-btn-hero,
body.poster-80s .ws-btn-primary,
body.poster-80s .ws-nav-cta {
  border-radius: 0;
}

body.poster-80s .ws-btn-hero {
  background: transparent;
  color: var(--text-on-dark);
  border: 1px solid rgba(255, 254, 245, 0.55);
  box-shadow: none;
  font-family: var(--font);
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: none;
  padding: 16px 40px;
}

body.poster-80s .ws-btn-hero:hover {
  background: rgba(255, 254, 245, 0.12);
  color: var(--text-on-dark);
  border-color: rgba(255, 254, 245, 0.85);
  transform: none;
  box-shadow: none;
}

body.poster-80s .ws-hero-scroll {
  color: rgba(255, 254, 245, 0.55);
  font-family: var(--font);
  letter-spacing: 0.22em;
}

body.poster-80s .ws-scroll-line {
  background: linear-gradient(to bottom, rgba(255, 254, 245, 0.6), transparent);
  width: 1px;
  border-radius: 0;
}

/* セクション背景（全面） */
body.poster-80s .ws-bg-tex::before {
  background-image: var(--halftone), var(--section-tex, var(--ws-tex-natural));
  background-repeat: repeat, repeat;
  background-size: 10px 10px, var(--section-tex-size, 280px auto);
  background-blend-mode: multiply, normal;
  opacity: 0.92;
}

/* 紙貼り */
body.poster-80s .ws-paper {
  color: var(--text-on-light);
  border: 3px solid #000;
  border-radius: 0;
  box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.35);
  background-color: #fffef5;
  background-blend-mode: multiply, normal;
}

body.poster-80s .ws-paper .ws-section-h2,
body.poster-80s .ws-paper .ws-light-text,
body.poster-80s .ws-paper .ws-about-headline,
body.poster-80s .ws-paper .ws-about-closing p,
body.poster-80s .ws-paper h3,
body.poster-80s .ws-paper h4,
body.poster-80s .ws-paper .ws-stat-big,
body.poster-80s .ws-paper .ws-stat-pct,
body.poster-80s .ws-paper .ws-stat-unit,
body.poster-80s .ws-paper .ws-message-item h4,
body.poster-80s .ws-paper .ws-step-card strong {
  color: var(--text-on-light);
  text-shadow: none;
  transform: none;
}

body.poster-80s .ws-paper .ws-section-h2 em,
body.poster-80s .ws-paper .ws-about-headline em {
  color: var(--text-on-light);
  font-style: normal;
}

body.poster-80s .ws-paper .ws-eyebrow,
body.poster-80s .ws-paper .ws-section-sub,
body.poster-80s .ws-paper .ws-problem-lead,
body.poster-80s .ws-paper .ws-stat-desc,
body.poster-80s .ws-paper .ws-about-story p,
body.poster-80s .ws-paper .ws-approach-body p,
body.poster-80s .ws-paper .ws-message-lead,
body.poster-80s .ws-paper .ws-cta-body,
body.poster-80s .ws-paper .ws-cta-note,
body.poster-80s .ws-paper p {
  color: var(--text-on-light);
}

body.poster-80s .ws-paper .ws-about-story strong {
  color: var(--text-on-light);
  text-shadow: none;
}

body.poster-80s .ws-paper .ws-about-yea,
body.poster-80s .ws-about-yea {
  color: var(--accent2) !important;
  text-shadow: none;
}

body.poster-80s .ws-paper .ws-step-num,
body.poster-80s .ws-paper .ws-message-idx {
  color: rgba(10, 6, 18, 0.12);
}

body.poster-80s .ws-paper .ws-benefit-body h3 {
  color: var(--text-on-light);
}

body.poster-80s .ws-paper .ws-detail-line {
  background: var(--text-on-light);
}

body.poster-80s .ws-paper-hero .ws-hero-title {
  color: var(--text-on-light);
  text-shadow: none;
  transform: skewX(-3deg);
}

body.poster-80s .ws-paper-hero .ws-hero-title em {
  color: inherit;
  text-shadow: none;
}

body.poster-80s .ws-paper-hero .ws-hero-sub {
  color: var(--text-muted-on-light);
  background: transparent;
  border-left: 4px solid #000;
  padding-left: 16px;
}

body.poster-80s .ws-paper-hero .ws-poster-eyebrow,
body.poster-80s .ws-paper-hero .ws-eyebrow {
  color: var(--text-muted-on-light);
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  margin-bottom: 20px;
}

body.poster-80s .ws-paper .ws-footer-top .ws-logo,
body.poster-80s .ws-footer-top .ws-logo {
  color: var(--dark) !important;
  text-shadow: none;
}

body.poster-80s .ws-paper .ws-footer-top p {
  color: var(--text-muted-on-light);
}

body.poster-80s .ws-about.ws-bg-tex         { --section-bg: var(--bg-teal); }
body.poster-80s .ws-problem.ws-bg-tex       { --section-bg: var(--bg-coral); }
body.poster-80s .ws-approach.ws-bg-tex      { --section-bg: var(--bg-blue); }
body.poster-80s .ws-benefits.ws-bg-tex      { --section-bg: var(--bg-amber); }
body.poster-80s .ws-message.ws-bg-tex       { --section-bg: var(--bg-teal); }
body.poster-80s .ws-footer.ws-bg-tex        { --section-bg: var(--bg-blue); --section-tilt: 0deg; }

body.poster-80s .ws-bg-tex-grad {
  background-image:
    linear-gradient(135deg, rgba(255, 210, 225, 0.8) 0%, rgba(210, 225, 255, 0.8) 40%, rgba(255, 246, 200, 0.8) 100%),
    var(--halftone),
    var(--ws-tex-color);
  background-size: cover, 12px 12px, cover;
  background-blend-mode: normal, multiply, overlay;
  border-top: 4px solid rgba(0, 0, 0, 0.12);
  border-bottom: 4px solid rgba(0, 0, 0, 0.12);
}

/* タイポグラフィ */
body.poster-80s .ws-section-h2,
body.poster-80s .ws-about-headline,
body.poster-80s .ws-about-closing p {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: 0.02em;
}

body.poster-80s .ws-section-h2 {
  color: var(--text-on-dark);
  text-shadow: var(--text-shadow-poster);
  transform: skewX(-2deg);
}

body.poster-80s .ws-section-h2 em {
  color: inherit;
  font-style: normal;
}

body.poster-80s .ws-eyebrow {
  font-family: var(--font-en);
  font-size: 13px;
  letter-spacing: 0.28em;
  color: var(--text-muted-on-dark);
}

body.poster-80s .ws-eyebrow-line {
  height: 4px;
  background: currentColor;
  border-radius: 0;
}

/* ABOUT */
body.poster-80s .ws-about {
  color: var(--text-on-dark);
}

body.poster-80s .ws-about-headline {
  color: var(--text-on-dark);
  text-shadow: var(--text-shadow-poster);
}

body.poster-80s .ws-about-headline em { color: inherit; }

body.poster-80s .ws-about-story p { color: var(--text-muted-on-dark); }

body.poster-80s .ws-about-story strong { color: var(--text-on-dark); }

body.poster-80s .ws-about-yea {
  color: var(--accent2) !important;
  text-shadow: none;
}


body.poster-80s .ws-paper .ws-about-closing p,
body.poster-80s .ws-about-closing p {
  color: var(--dark) !important;
  text-shadow: none;
  transform: none;
}

/* IMAGE ROLL */
body.poster-80s .ws-image-roll {
  background: var(--dark);
  border-top: none;
  border-bottom: none;
}

body.poster-80s .ws-roll-track img {
  border: none;
  border-radius: 0;
  filter: none;
  opacity: 0.92;
}

body.poster-80s .ws-roll-track img:hover {
  transform: none;
  box-shadow: none;
}

/* MARQUEE */
body.poster-80s .ws-marquee {
  background: var(--poster-pink);
  border-top: 4px solid #000;
  border-bottom: 4px solid #000;
}

body.poster-80s .ws-marquee-track span {
  font-family: var(--font-en);
  font-size: 14px;
  letter-spacing: 0.3em;
  color: var(--text-on-dark);
  text-shadow: none;
}

body.poster-80s .ws-marquee-track span.dot {
  color: var(--text-muted-on-dark);
}

/* PROBLEM */
body.poster-80s .ws-problem {
  color: var(--text-on-dark);
}

body.poster-80s .ws-problem .ws-section-h2,
body.poster-80s .ws-problem .ws-light-text,
body.poster-80s .ws-problem-intro .ws-section-h2 {
  color: var(--dark);
  text-shadow: none;
  transform: none;
}

body.poster-80s .ws-problem .ws-section-h2 em {
  color: var(--dark);
}

body.poster-80s .ws-problem-lead { color: var(--text-muted-on-dark); }

body.poster-80s .ws-stat-card.ws-paper:hover {
  transform: rotate(var(--paper-tilt, -0.6deg)) translate(-3px, -3px);
  box-shadow: 8px 8px 0 #000;
}

body.poster-80s .ws-detail-line {
  background: var(--poster-yellow);
  height: 5px;
}

body.poster-80s .ws-detail-item.ws-paper h4 { color: var(--text-on-light); }
body.poster-80s .ws-detail-item.ws-paper p { color: var(--text-muted-on-light); }

/* APPROACH */
body.poster-80s .ws-approach-tag {
  background: var(--poster-yellow);
  color: var(--dark);
  border: 3px solid #000;
  border-radius: 0;
  font-family: var(--font-en);
  box-shadow: 4px 4px 0 #000;
}

body.poster-80s .ws-approach-content { color: var(--text-on-light); }

body.poster-80s .ws-approach-content .ws-section-h2 {
  color: var(--text-on-light);
  text-shadow: none;
}

body.poster-80s .ws-approach-content .ws-section-h2 em { color: inherit; }

body.poster-80s .ws-approach-body p { color: var(--text-muted-on-light); }

body.poster-80s .ws-approach-highlight {
  background: var(--bg-teal);
  border: 1px solid rgba(154, 143, 173, 0.35);
  border-radius: 0;
}

body.poster-80s .ws-highlight-num { color: var(--dark); }

body.poster-80s .ws-highlight-text { color: rgba(10, 6, 18, 0.72); }

/* BENEFITS */
body.poster-80s .ws-benefits { color: var(--text-on-light); }

body.poster-80s .ws-benefits .ws-section-h2 {
  color: var(--text-on-light);
  text-shadow: none;
}

body.poster-80s .ws-benefits .ws-section-sub { color: var(--text-muted-on-light); }

body.poster-80s .ws-benefit-slide.ws-paper .ws-benefit-body h3 {
  font-family: var(--font-display);
  color: var(--text-on-light);
}

body.poster-80s .ws-benefits-arrow,
body.poster-80s .ws-steps-arrow {
  border-radius: 0;
  border: 3px solid #000;
  box-shadow: 3px 3px 0 #000;
}

body.poster-80s .ws-benefits-arrow:hover,
body.poster-80s .ws-steps-arrow:hover {
  background: var(--poster-pink);
  border-color: #000;
  color: var(--white);
}

body.poster-80s .ws-benefits-dot.active,
body.poster-80s .ws-steps-dot.active {
  background: var(--poster-pink);
  border-radius: 0;
}

/* STEPS */
body.poster-80s .ws-step-card.ws-paper .ws-step-num { color: rgba(10, 6, 18, 0.12); }

body.poster-80s .ws-step-card.ws-paper strong {
  font-family: var(--font-display);
  color: var(--text-on-light);
}

body.poster-80s .ws-step-card.ws-paper:hover {
  box-shadow: 8px 8px 0 #000;
}

/* MESSAGE */
body.poster-80s .ws-message { color: var(--text-on-dark); }

body.poster-80s .ws-message-header .ws-section-h2,
body.poster-80s .ws-message-header .ws-light-text {
  color: var(--dark) !important;
  text-shadow: none;
  transform: none;
}

body.poster-80s .ws-message-header .ws-section-h2 em {
  color: var(--dark);
}

body.poster-80s .ws-message-lead { color: var(--text-muted-on-dark); }

body.poster-80s .ws-message-item.ws-paper:hover {
  box-shadow: 8px 8px 0 #000;
}

body.poster-80s .ws-message-item.ws-paper .ws-message-idx { color: rgba(10, 6, 18, 0.12); }

body.poster-80s .ws-message-item.ws-paper h4 {
  font-family: var(--font-display);
  color: var(--text-on-light);
}

/* CTA */
body.poster-80s .ws-btn-primary {
  background: #222;
  color: #fff;
  border: 1px solid #fff;
  box-shadow: none;
  font-family: var(--font-display);
  text-transform: none;
  letter-spacing: 0.06em;
}

body.poster-80s .ws-btn-primary:hover {
  background: #444;
  color: #fff;
  transform: none;
  box-shadow: none;
}

body.poster-80s .ws-cta-inner.ws-paper .ws-section-h2 {
  color: var(--text-on-light);
  text-shadow: none;
  transform: none;
}

body.poster-80s .ws-cta-inner.ws-paper .ws-section-h2 em { color: inherit; }

/* FOOTER */
body.poster-80s .ws-footer {
  border-top: 5px solid var(--poster-pink);
  color: var(--text-on-dark);
}

body.poster-80s .ws-footer-top .ws-logo {
  font-family: var(--font);
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--dark) !important;
  text-shadow: none;
}

body.poster-80s .ws-footer-top p {
  color: var(--text-muted-on-light);
}

body.poster-80s .ws-footer-bottom p {
  color: var(--dark);
}

body.poster-80s .ws-footer-links a {
  color: var(--text-muted-on-light);
}

body.poster-80s .ws-footer-links a:hover { color: var(--text-on-light); }

body.poster-80s .ws-footer-top.ws-paper {
  border-color: transparent;
}

@media (max-width: 768px) {
  body.poster-80s .ws-paper-hero .ws-hero-title { transform: skewX(-2deg); }
}

/* CONTACT */
body.poster-80s .contact-page { color: var(--white); }

body.poster-80s .contact-header.ws-paper h1 {
  font-family: var(--font-display);
  color: var(--text-on-light);
  text-shadow: none;
}

body.poster-80s .contact-header.ws-paper h1 em {
  color: inherit;
  font-style: normal;
}

body.poster-80s .contact-info.ws-paper p,
body.poster-80s .contact-info.ws-paper .contact-info-item dt,
body.poster-80s .contact-info.ws-paper .contact-info-item dd {
  color: var(--text-on-light);
}

body.poster-80s .form-group input,
body.poster-80s .form-group select,
body.poster-80s .form-group textarea {
  border: 3px solid #000;
  border-radius: 0;
  background: var(--cream);
  font-family: var(--font);
}

body.poster-80s .form-submit {
  background: var(--poster-yellow);
  color: var(--dark);
  border: 4px solid #000;
  box-shadow: 6px 6px 0 #000;
  font-family: var(--font-display);
  border-radius: 0;
}

body.poster-80s .form-submit:hover {
  background: var(--poster-pink);
  color: var(--white);
  transform: translate(3px, 3px);
  box-shadow: 3px 3px 0 #000;
}

body.poster-80s .contact-sns-btn {
  border: 3px solid #000;
  border-radius: 0;
  box-shadow: 4px 4px 0 #000;
}

@media (prefers-reduced-motion: reduce) {
  body.poster-80s::before,
  body.poster-80s::after { display: none; }
}
