.news-page.news-cool {
  --page-bg: #edf5f8;
  --surface: #f9fdff;
  --ink: #142b3f;
  --muted: #526b7c;
  --line: #9eb9c8;
  --accent: #177f9d;
  --accent-dark: #105c78;
  --blue: #24529a;
  --focus: #105c78;
}

.news-cool .news-masthead {
  background: #f9fdff;
}

.news-cool .news-hero {
  padding-block: 2.25rem 2rem;
  background: #e5f2f7;
}

.news-cool .news-hero h1 {
  font-size: clamp(3rem, 13vw, 4.75rem);
  letter-spacing: -0.14em;
  font-feature-settings: "palt" 1, "kern" 1;
}

.news-cool .motion-frame {
  --motion-delay: 0ms;
}

.news-cool .motion-frame--section {
  display: block;
  width: min(100%, 18rem);
  margin-inline: auto;
}

.news-cool .motion-frame--section > .news-section-art {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  margin: 0;
}

.news-cool .motion-frame--hero {
  margin-block-start: 1.25rem;
}

.news-cool .motion-frame--feature,
.news-cool .motion-frame--interview,
.news-cool .motion-frame--conditions,
.news-cool .motion-frame--coming,
.news-cool .motion-frame--booking {
  width: min(100%, 15rem);
}

.news-cool .motion-frame--feature {
  margin-block-start: 1.75rem;
}

.news-cool .motion-frame--interview,
.news-cool .motion-frame--conditions,
.news-cool .motion-frame--coming,
.news-cool .motion-frame--booking {
  margin-block-start: 1.5rem;
}

.news-cool .motion-frame--support {
  width: min(100%, 14rem);
  margin-block-start: 1.75rem;
}

.news-cool .review-flow-frame {
  display: grid;
  width: 100%;
  max-width: 100%;
  place-items: center;
}

.news-cool .review-flow-frame > .review-flow-art {
  margin: 0;
}

.news-cool .news-lead h2,
.news-cool .news-section h2,
.news-cool .news-coming h2,
.news-cool .news-booking h2,
.news-cool .news-review-flow h2 {
  font-size: clamp(1.6rem, 6.5vw, 2.15rem);
  line-height: 1.35;
}

.news-cool .news-pullquote {
  text-align: center;
}

.news-cool .news-review-flow {
  padding-block: 3.5rem;
  border-block-start: 1px solid var(--line);
  background: #f9fdff;
}

.news-cool .news-section-heading > h2 {
  flex: 1 1 auto;
}

.news-cool .news-review-flow h2 {
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(1.6rem, 6.5vw, 2.15rem);
  font-weight: 700;
  line-height: 1.35;
}

.news-cool .review-flow-list {
  display: grid;
  gap: 1rem;
  margin-block-start: 1.75rem;
}

.news-cool .review-flow-step {
  position: relative;
  overflow: hidden;
  padding: 0.75rem 0.85rem 0.8rem;
  background: #e5f2f7;
  border: 1px solid var(--line);
  box-shadow: 0.25rem 0.25rem 0 #bfd4df;
}

.news-cool .review-flow-step:nth-child(2) {
  background: #edf7fa;
}

.news-cool .review-flow-step:nth-child(3) {
  background: #e1f0f5;
}

.news-cool .review-flow-step h3 {
  display: flex;
  align-items: baseline;
  gap: 0.45rem;
  margin: 0;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(1rem, 4.6vw, 1.25rem);
  font-weight: 700;
  line-height: 1.45;
  text-wrap: wrap;
}

.news-cool .review-flow-step-copy {
  min-inline-size: 0;
  text-wrap: wrap;
}

.news-cool .review-flow-step-number {
  display: block;
  flex: 0 0 1.2rem;
  inline-size: 1.2rem;
  block-size: auto;
  margin-block-start: 0;
  color: var(--accent);
  background: transparent;
  border-radius: 0;
  font-family: var(--font-mono);
  font-size: 1.1rem;
  font-weight: 800;
  line-height: 1.45;
  text-align: center;
}

.news-cool .review-flow-visual {
  position: relative;
  display: grid;
  min-block-size: 10.75rem;
  place-items: center;
  margin-block-start: 0.25rem;
}

.news-cool .review-flow-art {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 10.25rem;
  height: auto;
  margin-inline: auto;
  object-fit: contain;
}

.news-cool .review-flow-step--report .review-flow-art {
  width: min(100%, 18rem);
  max-height: 10.5rem;
}

.news-cool .review-flow-bubbles {
  position: absolute;
  z-index: 1;
  inset-block-start: -0.25rem;
  inset-inline: 0;
  display: flex;
  justify-content: center;
  gap: 2.5rem;
  pointer-events: none;
}

.news-cool .review-flow-bubble {
  position: relative;
  display: grid;
  place-items: center;
  inline-size: 3.4rem;
  block-size: 2.2rem;
  color: var(--accent-dark);
  background: var(--surface);
  border: 2px solid var(--accent);
  border-radius: 50%;
  font-family: var(--font-mono);
  font-size: 1.25rem;
  line-height: 1;
}

.news-cool .review-flow-bubble::after {
  position: absolute;
  inset-block-end: -0.45rem;
  inset-inline-start: 0.45rem;
  inline-size: 0.7rem;
  block-size: 0.7rem;
  content: "";
  background: var(--surface);
  border-block-end: 2px solid var(--accent);
  border-inline-start: 2px solid var(--accent);
  transform: rotate(-24deg) skew(-12deg);
}

.news-cool .review-flow-bubble--second {
  transform: translateY(0.6rem) rotate(5deg);
}

.news-cool .review-flow-note {
  margin-block: 1.35rem 0;
  padding: 1rem 1.1rem;
  color: var(--ink);
  background: #f9fdff;
  border: 2px solid var(--accent);
  border-radius: 1.6rem 1.6rem 0.7rem 1.6rem;
  font-weight: 700;
}

.news-cool .review-flow-step--report .review-flow-note {
  margin-block-start: 0.45rem;
}

.news-cool .news-concerns {
  background: #e2f1f8;
}

.news-cool .news-concerns .news-section-heading {
  display: block;
  margin-block-end: 0;
  padding-block: 0.75rem 0.85rem;
  border-block: 2px solid var(--ink);
  text-align: center;
}

.news-cool .news-concerns .news-section-heading::before {
  display: block;
  inline-size: 2.8rem;
  block-size: 0.45rem;
  margin: -1.05rem auto 0.55rem;
  content: "";
  background: var(--accent);
  clip-path: polygon(0 50%, 20% 38%, 29% 0, 43% 38%, 50% 8%, 57% 38%, 71% 0, 80% 38%, 100% 50%, 80% 62%, 71% 100%, 57% 62%, 50% 92%, 43% 62%, 29% 100%, 20% 62%);
}

.news-cool .news-concerns .news-section-heading h2 {
  font-size: clamp(1.6rem, 6.5vw, 2.15rem);
  line-height: 1.35;
}

.news-cool .news-concern-list {
  display: grid;
  gap: 1.35rem;
  margin-block-start: 2rem;
  border-block: 0;
}

.news-cool .news-concern-list > li.news-concern-card {
  --card-back: #c5e0ea;
  --card-back-line: #8db8c7;
  --card-tilt: 0deg;
  --back-tilt: 0deg;
  position: relative;
  display: block;
  padding: 0.35rem 0.25rem 0.55rem;
  border: 0;
  isolation: isolate;
}

.news-cool .news-concern-card::before {
  position: absolute;
  z-index: -1;
  inset: 0.75rem -0.05rem 0.1rem 0.45rem;
  content: "";
  background: var(--card-back);
  border: 2px solid var(--card-back-line);
  clip-path: polygon(0.5% 0.5%, 94% 0.5%, 100% 8%, 99.5% 99%, 0.5% 100%);
  transform: rotate(var(--back-tilt));
}

.news-cool .news-concern-paper {
  position: relative;
  display: grid;
  z-index: 1;
  --fold-size: 1.65rem;
  --paper-stroke: 1px;
  --fold-line: 1px;
  grid-template-columns: minmax(0, 1fr) minmax(5.6rem, 6.7rem);
  align-items: center;
  gap: 0.7rem;
  min-block-size: 12rem;
  padding: 1.1rem 0.8rem 1.1rem 0.95rem;
  background: var(--ink);
  border: 0;
  clip-path: polygon(
    0 0,
    calc(100% - var(--fold-size)) 0,
    100% var(--fold-size),
    100% 100%,
    0 100%
  );
  isolation: isolate;
  transform: rotate(var(--card-tilt));
  transform-origin: center;
}

.news-cool .news-concern-paper::before {
  position: absolute;
  z-index: 0;
  inset: var(--paper-stroke);
  content: "";
  background: #fbfdff;
  clip-path: polygon(
    0 0,
    calc(100% - var(--fold-size)) 0,
    100% var(--fold-size),
    100% 100%,
    0 100%
  );
  pointer-events: none;
}

.news-cool .news-concern-paper > * {
  position: relative;
  z-index: 1;
}

.news-cool .news-concern-copy {
  position: relative;
  display: grid;
  grid-template-columns: minmax(3rem, 3.4rem) minmax(0, 1fr);
  align-items: start;
  gap: 0.55rem;
  min-inline-size: 0;
}

.news-cool .news-concern-copy::before {
  position: absolute;
  inset-block: 0.15rem;
  inset-inline-start: 3.55rem;
  content: "";
  border-inline-start: 2px dotted var(--line);
}

.news-cool .news-concern-number {
  display: block;
  min-inline-size: 3rem;
  padding-inline: 0.1rem 0.25rem;
  color: var(--accent);
  border-block-end: 3px solid var(--accent);
  font-family: var(--font-serif);
  font-size: clamp(1.35rem, 5vw, 1.85rem);
  line-height: 1;
  letter-spacing: -0.04em;
  text-align: center;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: keep-all;
  justify-self: center;
}

.news-cool .news-concern-number::after {
  content: none;
}

.news-cool .news-concern-copy p {
  position: relative;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(1rem, 3.5vw, 1.15rem);
  font-weight: 700;
  line-height: 1.5;
}

.news-cool .news-concern-paper > .news-concern-art-frame {
  display: grid;
  width: min(100%, 6.7rem);
  max-height: 10.2rem;
  justify-self: end;
  place-items: center;
}

.news-cool .news-concern-art-frame > img {
  display: block;
  width: 100%;
  max-height: 10.2rem;
  object-fit: contain;
}

.news-cool .news-concern-card:nth-child(2) .news-concern-art-frame {
  --motion-delay: 110ms;
}

.news-cool .news-concern-card:nth-child(3) .news-concern-art-frame {
  --motion-delay: 220ms;
}

.news-cool .news-concern-fold {
  position: absolute;
  z-index: 2;
  inset-block-start: var(--paper-stroke);
  inset-inline-end: var(--paper-stroke);
  inline-size: var(--fold-size);
  block-size: var(--fold-size);
  background: #fbfdff;
  box-sizing: border-box;
  border-inline-start: var(--fold-line) solid var(--ink);
  border-block-end: var(--fold-line) solid var(--ink);
  clip-path: polygon(0 0, 100% 100%, 0 100%);
  pointer-events: none;
}

.news-cool .news-concern-fold::before {
  position: absolute;
  inset: 0;
  content: "";
  background: var(--ink);
  clip-path: polygon(0 0, 100% calc(100% - var(--fold-line)), 100% 100%, 0 var(--fold-line));
}

.news-cool .news-concern-card--uncertain {
  --card-tilt: -0.8deg;
  --back-tilt: 0.35deg;
  --card-back: #c5e0ea;
  --card-mark: #2b9bab;
}

.news-cool .news-concern-card--update {
  --card-tilt: 0.55deg;
  --back-tilt: -0.3deg;
  --card-back: #cce7e8;
  --card-mark: #2b9bab;
}

.news-cool .news-concern-card--no-resume {
  --card-tilt: -0.45deg;
  --back-tilt: 0.25deg;
  --card-back: #d8e6ef;
  --card-mark: #e36b5c;
}

.news-cool .news-concerns-interview {
  background: rgba(237, 247, 250, 0.95);
}

.news-cool .news-support {
  background: #d9eaf2;
}

.news-cool .news-interview-copy p + p {
  margin-block-start: 1.2rem;
  padding: 0;
  color: var(--ink);
  background: transparent;
  border: 0;
  border-radius: 0;
  font-family: "Klee One", "UD Digi Kyokasho NP", "UD Digi Kyokasho", "Hiragino Maru Gothic ProN", "BIZ UDPGothic", Meiryo, cursive;
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.8;
  transform: rotate(-0.35deg);
}

.news-cool .news-interview-copy p + p strong {
  color: inherit;
  font-weight: inherit;
  text-decoration: none;
}

.news-cool .news-support-intro {
  margin-block-start: 1.25rem;
  padding: 1rem;
  color: var(--ink);
  background: #f9fdff;
  border-inline-start: 0.35rem solid var(--accent);
  font-weight: 700;
}

.news-cool .news-conditions {
  background: #eaf6fa;
}

.news-cool .news-condition-row {
  display: grid;
  gap: 0.65rem;
}

.news-cool .news-condition-row .line-cta {
  margin-block-start: 0.15rem;
}

.news-cool .line-cta {
  display: flex;
  width: min(100%, 17rem);
  min-height: 3rem;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 0.7rem 1.25rem;
  color: #fff;
  background: #06c755;
  border: 2px solid #059b43;
  border-radius: 999px;
  font-size: 1rem;
  font-weight: 800;
  text-decoration: none;
  justify-self: start;
  transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.news-cool .line-cta::after {
  content: "→";
  font-size: 1.2rem;
  line-height: 1;
  transition: transform 160ms ease;
}

.news-cool .line-cta:hover {
  background: #05ad4b;
  box-shadow: 0 0.25rem 0 #047d38;
  transform: translateY(-0.125rem);
}

.news-cool .line-cta:hover::after {
  transform: translateX(0.2rem);
}

.news-cool .line-cta--openchat {
  animation: news-line-pulse 3.8s ease-in-out 1.2s infinite;
}

.news-cool .line-cta-note {
  display: block;
  color: var(--muted);
  font-size: 0.875rem;
}

.news-cool .news-condition-row .news-file-note {
  margin-block-start: 0.1rem;
}

.news-cool .news-coming {
  background: #e2f0f5;
}

.news-cool .news-coming-box {
  background: #f9fdff;
  box-shadow: 0.25rem 0.25rem 0 #bfd4df;
}

.news-cool .news-booking {
  color: #f1fbff;
  background: #1d4862;
}

.news-cool .news-booking h2 {
  color: #f1fbff;
}

.news-cool .news-booking > .container > p {
  color: #d9edf5;
}

.news-cool .news-booking .line-cta {
  margin-block-start: 1.25rem;
  min-height: 3.5rem;
  border-radius: 0.2rem;
  justify-content: space-between;
}

.news-cool .news-booking .primary-cta {
  width: min(100%, 17rem);
  margin-block-start: 0.75rem;
  justify-self: start;
}

.news-cool .news-booking .calendar-slot {
  min-height: 0;
  padding: 0;
  color: var(--muted);
  background: transparent;
  border: 0;
}

.news-cool .news-booking .calendar-slot strong {
  color: var(--ink);
}

.news-cool .news-hero .primary-cta,
.news-cool .news-booking .primary-cta {
  box-shadow: 0.15rem 0.2rem 0 #0b2537;
}

.has-js .news-cool [data-enter]:not(.is-visible) {
  opacity: 0;
  transform: translateY(1rem) scale(0.985);
}

.has-js .news-cool [data-enter] {
  transition: opacity 560ms cubic-bezier(0.2, 0, 0, 1),
    transform 680ms cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: var(--motion-delay);
}

.news-cool .news-hero-art {
  animation: none;
}

.news-cool .motion-frame.is-in-view[data-motion="float"] > .motion-art {
  animation: cool-motion-float 4.2s ease-in-out 160ms infinite;
}

.news-cool .motion-frame.is-in-view[data-motion="scan"] > .motion-art {
  animation: cool-motion-scan 4.8s ease-in-out 240ms infinite;
}

.news-cool .motion-frame.is-in-view[data-motion="paper-bob"] > .motion-art {
  animation: cool-motion-paper-bob 4.1s ease-in-out 180ms infinite;
}

.news-cool .motion-frame.is-in-view[data-motion="conversation"] > .motion-art {
  animation: cool-motion-conversation 4.6s ease-in-out 220ms infinite;
}

.news-cool .motion-frame.is-in-view[data-motion="report-glide"] > .motion-art {
  animation: cool-motion-report-glide 4.4s ease-in-out 260ms infinite;
}

.news-cool .motion-frame.is-in-view[data-motion="wobble"] > .motion-art {
  animation: cool-motion-wobble 4.8s ease-in-out 180ms infinite;
}

.news-cool .motion-frame.is-in-view[data-motion="swing"] > .motion-art {
  transform-origin: 50% 4%;
  animation: cool-motion-swing 4.5s ease-in-out 220ms infinite;
}

.news-cool .motion-frame.is-in-view[data-motion="lean"] > .motion-art {
  animation: cool-motion-lean 4.6s ease-in-out 180ms infinite;
}

.news-cool .motion-frame.is-in-view[data-motion="conditions"] > .motion-art {
  animation: cool-motion-conditions 5.2s ease-in-out 240ms infinite;
}

.news-cool .motion-frame.is-in-view[data-motion="glide"] > .motion-art {
  animation: cool-motion-glide 4.7s ease-in-out 260ms infinite;
}

.news-cool .motion-frame.is-in-view[data-motion="booking"] > .motion-art {
  animation: cool-motion-booking 4.2s ease-in-out 200ms infinite;
}

@keyframes cool-motion-float {
  0%, 24%, 100% { transform: translate3d(0, 0, 0) rotate(-1deg); }
  48% { transform: translate3d(-0.1rem, -0.42rem, 0) rotate(1.3deg); }
  68% { transform: translate3d(0.08rem, -0.16rem, 0) rotate(0.2deg); }
}

@keyframes cool-motion-scan {
  0%, 24%, 100% { transform: translate3d(0, 0, 0) rotate(-1.3deg); }
  46% { transform: translate3d(0.24rem, -0.16rem, 0) rotate(0.8deg); }
  58% { transform: translate3d(0.42rem, 0.04rem, 0) rotate(1.4deg); }
  72% { transform: translate3d(0.08rem, 0, 0) rotate(0.2deg); }
}

@keyframes cool-motion-paper-bob {
  0%, 24%, 100% { transform: translate3d(0, 0, 0) rotate(-1deg); }
  46% { transform: translate3d(0, -0.55rem, 0) rotate(1.3deg); }
  59% { transform: translate3d(0.04rem, 0.08rem, 0) rotate(0.3deg); }
  72% { transform: translate3d(-0.02rem, -0.12rem, 0) rotate(-0.2deg); }
}

@keyframes cool-motion-conversation {
  0%, 26%, 100% { transform: translate3d(0, 0, 0) rotate(-0.6deg); }
  50% { transform: translate3d(0.18rem, -0.08rem, 0) rotate(2.1deg); }
  68% { transform: translate3d(-0.04rem, 0, 0) rotate(0.2deg); }
}

@keyframes cool-motion-report-glide {
  0%, 24%, 100% { transform: translate3d(0, 0, 0) rotate(-0.8deg); }
  48% { transform: translate3d(0.55rem, -0.12rem, 0) rotate(1.8deg); }
  64% { transform: translate3d(0.26rem, 0.02rem, 0) rotate(0.6deg); }
}

@keyframes cool-motion-wobble {
  0%, 64%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  70% { transform: translate3d(-0.18rem, 0, 0) rotate(-1.8deg); }
  77% { transform: translate3d(0.22rem, 0, 0) rotate(2.1deg); }
  84% { transform: translate3d(-0.08rem, 0, 0) rotate(-0.6deg); }
  90% { transform: translate3d(0, 0, 0) rotate(0deg); }
}

@keyframes cool-motion-swing {
  0%, 26%, 100% { transform: rotate(-0.8deg); }
  50% { transform: rotate(2.6deg) translate3d(0.12rem, 0, 0); }
  70% { transform: rotate(-1.2deg) translate3d(-0.06rem, 0, 0); }
}

@keyframes cool-motion-lean {
  0%, 28%, 100% { transform: translate3d(0, 0, 0) rotate(-0.8deg); }
  52% { transform: translate3d(0.18rem, -0.1rem, 0) rotate(2deg); }
  68% { transform: translate3d(0.03rem, 0, 0) rotate(0.2deg); }
}

@keyframes cool-motion-conditions {
  0%, 24%, 100% { transform: translate3d(0, 0, 0) scale(1) rotate(-0.6deg); }
  48% { transform: translate3d(0, -0.28rem, 0) scale(1.02) rotate(0.8deg); }
  66% { transform: translate3d(0.04rem, 0.04rem, 0) scale(1) rotate(0.2deg); }
}

@keyframes cool-motion-glide {
  0%, 24%, 100% { transform: translate3d(0, 0, 0) rotate(-0.8deg); }
  50% { transform: translate3d(0.62rem, -0.12rem, 0) rotate(1.8deg); }
  70% { transform: translate3d(0.18rem, 0.02rem, 0) rotate(0.4deg); }
}

@keyframes cool-motion-booking {
  0%, 24%, 100% { transform: translate3d(0, 0, 0) rotate(-0.6deg); }
  50% { transform: translate3d(0, -0.4rem, 0) rotate(1.2deg); }
  68% { transform: translate3d(0.04rem, -0.08rem, 0) rotate(0.2deg); }
}

@keyframes news-line-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(6, 199, 85, 0.12); }
  50% { box-shadow: 0 0 0 0.45rem rgba(6, 199, 85, 0.18); }
}

@media (prefers-reduced-motion: reduce) {
  .news-cool .motion-frame.is-in-view > .motion-art,
  .news-cool .line-cta--openchat {
    animation: none;
  }
}