/* A playful editorial layer: circuit lines, pit notes and bold type.
   Motion follows deliberate scrolling or interaction; no content waits to appear. */
:root { --play-blue: #1958de; --play-ease: cubic-bezier(.22,.8,.25,1); }
body::before { content:""; position:fixed; left:8px; top:105px; bottom:24px; width:5px; background:linear-gradient(90deg,var(--play-blue) 0 40%,transparent 40% 70%,#90b8ff 70%); z-index:6; pointer-events:none; }
.kicker,.section-note { font-size:12px; }
.desktop-nav { border:0; background:none; padding:0; gap:4px; }
.desktop-nav>a { border-radius:0; background:none!important; box-shadow:none!important; font-size:13px; position:relative; }
.desktop-nav>a::after { content:""; position:absolute; bottom:5px; left:17px; right:17px; height:2px; background:var(--play-blue); transform:scaleX(0); transform-origin:right; transition:transform .3s var(--play-ease); }
.desktop-nav>a:hover::after,.desktop-nav>a[aria-current=page]::after { transform:scaleX(1); transform-origin:left; }
.header-cta,.button,.text-link { transition:background-color .25s,color .25s,border-color .25s; }
.header-cta>span,.button>span,.text-link>span { transition:transform .35s var(--play-ease),background-color .25s; }
.header-cta:hover>span,.button:hover>span,.text-link:hover>span { transform:rotate(45deg); }
.scroll-progress { position:absolute; left:0; bottom:0; width:100%; height:2px; transform:scaleX(0); transform-origin:left; background:var(--play-blue); pointer-events:none; }
.hero.race-hero { border-radius:8px 8px 54px 8px; }
.hero h1 .hero-change { display:inline-block; text-shadow:3px 3px 0 #f4f7fd; }
.hero-english { letter-spacing:.015em; }
.apex-stamp { position:absolute; right:10%; top:36%; width:158px; aspect-ratio:1; display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--ink); background:#fff; border:1px solid var(--ink); border-radius:50%; transform:rotate(10deg); box-shadow:6px 7px 0 var(--play-blue); transition:transform .45s var(--play-ease),box-shadow .45s var(--play-ease),background-color .25s; }
.apex-stamp:hover,.apex-stamp:focus-visible { transform:rotate(-8deg); box-shadow:2px 3px 0 var(--play-blue); background:#edf3ff; }
.stamp-top { font:700 11px var(--latin); letter-spacing:.07em; }
.stamp-copy { margin-top:9px; font-size:18px; font-weight:700; line-height:1.55; letter-spacing:-.025em; }
.stamp-arrow { font:34px/1 var(--latin); margin-top:4px; }
.type-runway { margin:75px 0 0; padding:0 0 60px; overflow:hidden; border-bottom:1px solid var(--ink); }
.runway-caption { display:flex; justify-content:space-between; gap:20px; margin:0 4.2% 22px; font:12px var(--latin); letter-spacing:.065em; }
.runway-caption>span:last-child { font-family:var(--font); letter-spacing:0; }
.runway-line { width:max-content; white-space:nowrap; font:900 clamp(70px,10.4vw,170px)/1.04 Arial,Helvetica,sans-serif; letter-spacing:-.065em; padding-left:4vw; color:var(--ink); will-change:transform; }
.runway-line>span { color:var(--play-blue); }
.runway-outline { padding-left:16vw; color:transparent; -webkit-text-stroke:1.5px var(--ink); }
.runway-outline>span { color:transparent; -webkit-text-stroke:1.5px var(--play-blue); }
.runway-outline .runway-direction { display:inline-block; margin-left:32px; -webkit-text-stroke:0; color:var(--play-blue); }
.brand-approach { padding-top:90px; padding-bottom:100px; }
.brand-approach .section-top { align-items:center; }
.brand-approach .kicker { color:var(--ink); }
.brand-approach .approach-intro { gap:70px; }
.brand-approach .approach-intro h2 { font-size:clamp(38px,4.1vw,61px); font-weight:700; line-height:1.6; letter-spacing:-.065em; }
.brand-approach .blue-text { text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:13px; }
.brand-approach .body-large { margin-top:12px; }
.judgment-statement { border-left:0; border-block:1px solid var(--ink); padding:26px 0; margin-bottom:52px; }
.judgment-statement p { font-weight:700; }
.values-caption { display:flex; justify-content:space-between; gap:20px; font-size:12px; margin-bottom:15px; }
.values-caption>span:last-child { color:var(--muted); }
.value-notes { border-top:1px solid var(--ink); }
.value-lane { border-bottom:1px solid var(--ink); position:relative; background:#fff; transition:background-color .3s; }
.value-lane summary { list-style:none; padding:30px 24px 30px 0; display:grid; grid-template-columns:66px 1fr auto 38px; align-items:center; gap:22px; cursor:pointer; }
.value-lane summary::-webkit-details-marker { display:none; }
.value-number { width:58px; height:50px; display:grid; place-items:center; font:700 28px Arial,sans-serif; letter-spacing:-.055em; color:var(--play-blue); border-right:1px solid #b8c6df; transform:skewY(-5deg); transition:background-color .2s,color .2s; }
.value-lane h3 { font-size:clamp(21px,2.25vw,32px); font-weight:700; letter-spacing:-.045em; line-height:1.6; }
.value-word { font:700 14px Arial,sans-serif; letter-spacing:.015em; color:var(--muted); }
.value-toggle { height:38px; width:38px; border:1px solid #a7adb8; border-radius:50%; position:relative; transition:transform .3s var(--play-ease); }
.value-toggle::before,.value-toggle::after { content:""; position:absolute; left:11px; top:17px; width:14px; height:1px; background:currentColor; }
.value-toggle::after { transform:rotate(90deg); }
.value-lane[open] { background:#edf3ff; }
.value-lane[open] summary { padding-bottom:18px; }
.value-lane[open] .value-number { background:var(--play-blue); color:#fff; border-color:transparent; }
.value-lane[open] .value-toggle { transform:rotate(45deg); color:var(--play-blue); border-color:var(--play-blue); }
.value-lane summary:hover { color:var(--play-blue); }
.value-lane summary:focus-visible { outline:3px solid var(--play-blue); outline-offset:5px; position:relative; z-index:1; }
.value-note { padding:0 28px 32px 88px; display:flex; gap:36px; align-items:flex-end; overflow:hidden; }
.value-note p { font-size:16px; line-height:2; max-width:570px; flex:1 1 60%; color:#3d4c63; }
.value-note>span { font:900 clamp(25px,4.8vw,72px)/1 Arial,sans-serif; letter-spacing:-.06em; -webkit-text-stroke:1px #729bd7; color:transparent; flex:0 1 auto; }
.home-practice { border-radius:48px 48px 0 0; background:#f4f6fa; padding-top:75px; }
.practice-heading h2 { font-weight:700; }
.service-tabs { border-radius:0; background:none; padding:0; gap:8px; border:0; }
.service-tabs button { border:1px solid #c5cad3; border-radius:4px 4px 0 0; box-shadow:none; min-height:60px; font-size:14px; transition:transform .25s var(--play-ease),background-color .25s; }
.service-tabs button[aria-selected=true] { background:var(--play-blue); border-color:var(--play-blue); color:#fff; transform:translateY(-5px); }
.service-tabs button:hover { transform:translateY(-5px); }
.need-panel { border-radius:0 22px 22px 22px; }
.switch-banner { border-radius:0; background:#fff; border-block:1px solid var(--ink); border-inline:0; transition:background-color .25s; }
.switch-banner:hover { background:#e8efff; }
.switch-banner>span:last-child { transition:transform .3s var(--play-ease); }
.switch-banner:hover>span:last-child { transform:translate(5px,-5px); }
.home-extra>a { border-radius:8px 8px 44px 8px; background:#e4ecff; }
.home-extra>a h3 { font-weight:700; }
.home-extra>a:hover .people-teaser-sub { color:var(--play-blue); }
.play-motorsport { display:grid; grid-template-columns:1fr 1fr; gap:40px 70px; padding-top:52px; padding-bottom:110px; }
.spirit-word { grid-column:1/-1; font:900 clamp(46px,6.7vw,101px)/1.04 Arial,Helvetica,sans-serif; letter-spacing:-.06em; position:relative; z-index:1; }
.spirit-word>span { display:block; margin-left:10%; color:var(--play-blue); }
.teaser-copy h2 { font-weight:700; font-size:38px; }
.teaser-track { transform:rotate(3deg); transition:transform .55s var(--play-ease); }
.teaser-track:hover,.teaser-track:focus-within { transform:rotate(0deg); }
.teaser-track>a { display:block; position:relative; border:8px solid white; box-shadow:0 9px 25px #16264813; border-radius:0; }
.teaser-track img { height:360px; border-radius:0; transition:filter .4s; }
.track-ticket { position:absolute; top:-20px; left:22px; z-index:1; background:var(--play-blue); color:#fff; display:flex; align-items:center; gap:35px; padding:12px 16px; font:700 12px Arial,sans-serif; letter-spacing:.04em; transform:rotate(-6deg); }
.track-ticket>span { font-size:28px; line-height:1; }
.teaser-track figcaption { font-size:12px; margin-top:12px; }
.page-word { font:900 clamp(72px,12vw,184px)/1.03 Arial,Helvetica,sans-serif; letter-spacing:-.07em; padding-block:24px 33px; margin-bottom:24px; border-bottom:1px solid var(--ink); color:var(--ink); text-shadow:2px 2px 0 white,3px 4px 0 var(--ink); overflow-wrap:anywhere; }
.play-page-intro .breadcrumb { margin-top:0; }
.play-page-intro>.kicker { display:none; }
.play-page-intro h1 { font-weight:700; font-size:clamp(35px,4vw,58px); }
.play-page-intro .lead { font-size:16px; }
.portrait-frame { border-radius:0 0 48px 0; }
.play-story { background:#182831; padding-top:60px; }
.story-word { font:900 clamp(48px,7.4vw,110px)/1.04 Arial,sans-serif; letter-spacing:-.065em; padding:0 0 45px; color:#fff; }
.story-word>span { color:transparent; -webkit-text-stroke:1px #b6d0ff; margin-left:6%; }
.play-story .motorsport-intro h2 { font-weight:700; }
.driver-ticket { border-radius:0; border:1px solid #91a7c1; background:#ffffff08; transform:rotate(-2deg); position:sticky; top:112px; }
.driver-ticket::before { content:"YAKUJI PARTNERS × SYUN KOIDE"; display:block; position:relative; color:#142b4c; background:#b4ceff; margin:-32px -32px 25px; padding:13px 20px; font:700 12px Arial,sans-serif; letter-spacing:.025em; }
.driver-ticket::after { content:""; display:block; height:10px; margin-top:28px; background:repeating-linear-gradient(90deg,#cfe0ff 0 2px,transparent 2px 5px,#cfe0ff 5px 6px,transparent 6px 10px); opacity:.55; }
.motorsport-reasons article { transition:padding-left .3s var(--play-ease),border-color .3s; }
.motorsport-reasons article:hover { padding-left:12px; border-color:#a9c5fa; }
.contact-band { background:var(--play-blue); color:#fff; border:0; padding-top:35px; padding-bottom:80px; }
.contact-word { font:900 clamp(75px,14.5vw,230px)/1.05 Arial,sans-serif; letter-spacing:-.07em; white-space:nowrap; color:transparent; -webkit-text-stroke:1px #ffffff96; padding:0 4% 38px; }
.contact-word>span { display:inline-block; color:white; -webkit-text-stroke:0; margin-left:25px; }
.contact-band .kicker,.contact-band p:not(.kicker) { color:#e1ebff; }
.contact-band h2 { font-size:clamp(32px,3.5vw,51px); font-weight:700; margin-top:18px; }
.contact-band p:not(.kicker) { font-size:16px; }
.contact-band .button { background:#fff; color:#183967; width:225px; min-width:225px; height:225px; border:1px solid #fff; border-radius:50%; display:flex; flex-direction:column-reverse; justify-content:center; gap:18px; padding:25px; font-size:15px; margin-right:6%; box-shadow:8px 8px 0 #1545a3; transition:transform .4s var(--play-ease),box-shadow .4s var(--play-ease); }
.contact-band .button>span { font:72px/.9 Arial,sans-serif; width:auto; height:auto; background:none; color:var(--play-blue); }
.contact-band .button:hover { transform:translate(4px,4px); box-shadow:4px 4px 0 #1545a3; }
.contact-band .button:hover>span { transform:rotate(45deg); }
.footer-wordmark { font-weight:800; font-size:clamp(44px,5.4vw,80px); letter-spacing:-.065em; line-height:.95; }
.footer-wordmark>span { font-size:13px; letter-spacing:0; line-height:1.8; margin-top:22px; }
.back-top { transition:transform .25s; }
.back-top:hover { transform:translateY(-4px); }
.menu-dialog { border-radius:4px 4px 36px 4px; border:1px solid var(--ink); }
.menu-dialog nav>a { font-weight:700; position:relative; padding-left:38px; }
.menu-dialog nav { counter-reset:menu; }
.menu-dialog nav>a::before { counter-increment:menu; content:"0" counter(menu); position:absolute; left:0; top:22px; font:12px Arial,sans-serif; color:var(--play-blue); }
@media (max-width:1199px) {
  .desktop-nav>a { padding-inline:10px; }
  .apex-stamp { right:7%; width:145px; }
  .brand-approach .approach-intro { gap:42px; }
  .value-note>span { font-size:43px; }
  .driver-ticket::before { margin:-26px -26px 25px; }
  .contact-band .button { margin-right:0; }
}
@media (max-width:900px) {
  .apex-stamp { width:128px; top:34%; right:5%; }
  .stamp-copy { font-size:16px; }
  .stamp-top { font-size:10px; }
  .type-runway { margin-top:48px; padding-bottom:45px; }
  .brand-approach .approach-intro { gap:30px; }
  .value-lane summary { grid-template-columns:60px 1fr 36px; gap:16px; }
  .value-word { display:none; }
  .value-note { padding-left:76px; }
  .value-note>span { display:none; }
  .play-motorsport { gap:38px; }
  .teaser-copy h2 { font-size:30px; }
  .teaser-track img { height:310px; }
  .driver-ticket::before { margin:-23px -23px 25px; padding-inline:15px; font-size:11px; }
  .contact-band .button { width:190px; min-width:190px; height:190px; padding:20px; font-size:14px; }
}
@media (max-width:700px) {
  body::before { display:none; }
  .hero.race-hero { border-radius:5px 5px 30px 5px; }
  .apex-stamp { top:238px; right:1px; width:92px; box-shadow:3px 4px 0 var(--play-blue); transform:rotate(10deg); }
  .stamp-top { font-size:8px; letter-spacing:0; }
  .stamp-copy { font-size:12px; margin-top:5px; }
  .stamp-arrow { font-size:22px; margin-top:1px; }
  .type-runway { margin-top:38px; padding-bottom:32px; }
  .runway-caption { margin-inline:22px; margin-bottom:18px; font-size:11px; }
  .runway-caption>span:last-child { display:none; }
  .runway-line { font-size:clamp(28px,9.4vw,66px); letter-spacing:-.065em; padding-left:12px; }
  .runway-outline { padding-left:27px; -webkit-text-stroke:1px var(--ink); }
  .runway-outline>span { -webkit-text-stroke-width:1px; }
  .runway-outline .runway-direction { margin-left:12px; }
  .brand-approach { padding-top:52px; padding-bottom:60px; }
  .brand-approach .approach-intro h2 { font-size:37px; }
  .brand-approach .blue-text { text-underline-offset:9px; }
  .brand-approach .body-large { margin-top:0; }
  .brand-approach .section-note { max-width:140px; text-align:right; font-size:12px; }
  .judgment-statement { padding:22px 0; margin-bottom:33px; }
  .judgment-statement p { font-size:19px; }
  .values-caption { font-size:12px; gap:12px; }
  .value-lane summary { padding:24px 8px 24px 0; grid-template-columns:35px 1fr 28px; gap:9px; }
  .value-lane h3 { font-size:clamp(17px,4.6vw,27px); line-height:1.6; letter-spacing:-.05em; }
  .value-number { width:32px; height:37px; font-size:21px; }
  .value-toggle { width:28px; height:28px; }
  .value-toggle::before,.value-toggle::after { width:12px; top:12px; left:7px; }
  .value-note { padding:0 18px 25px 44px; }
  .value-note p { font-size:16px; line-height:1.9; }
  .home-practice { padding-top:45px; border-radius:28px 28px 0 0; }
  .service-tabs { gap:6px; }
  .service-tabs button { font-size:12px; min-height:54px; border-radius:3px; }
  .service-tabs button[aria-selected=true],.service-tabs button:hover { transform:none; }
  .need-panel { border-radius:0 0 18px 18px; }
  .play-motorsport { grid-template-columns:1fr; gap:30px; padding-top:36px; padding-bottom:65px; }
  .spirit-word { font-size:clamp(27px,7.4vw,52px); }
  .spirit-word>span { margin-left:3%; }
  .teaser-copy h2 { font-size:32px; }
  .teaser-track { margin-inline:5px 9px; transform:rotate(2deg); }
  .teaser-track img { height:250px; }
  .teaser-track>a { border-width:6px; }
  .track-ticket { top:-14px; left:15px; padding:9px 12px; font-size:11px; }
  .page-word { font-size:clamp(58px,15.4vw,105px); padding-block:12px 26px; margin-bottom:25px; text-shadow:1px 1px 0 white,2px 3px 0 var(--ink); }
  .play-page-intro h1 { font-size:clamp(30px,8.4vw,48px); }
  .play-page-intro .lead { font-size:16px; }
  .story-word { font-size:clamp(34px,8.8vw,60px); padding-bottom:30px; }
  .story-word>span { margin-left:2%; }
  .play-story { padding-top:38px; }
  .driver-ticket { position:relative; top:auto; margin:5px 4px; transform:rotate(-1deg); }
  .driver-ticket::before { margin:-27px -25px 25px; font-size:12px; padding-inline:25px; }
  .motorsport-reasons article:hover { padding-left:0; }
  .contact-band { padding-top:24px; padding-bottom:50px; }
  .contact-word { font-size:15.7vw; padding:0 22px 22px; }
  .contact-word>span { margin-left:10px; }
  .contact-band h2 { font-size:30px; }
  .contact-band p:not(.kicker) { font-size:16px; }
  .contact-band p:not(.kicker) br { display:none; }
  .contact-band .button { width:100%; min-width:0; height:auto; min-height:64px; margin-top:30px; border-radius:999px; flex-direction:row; justify-content:space-between; font-size:15px; padding:16px 22px; gap:16px; box-shadow:4px 4px 0 #1545a3; }
  .contact-band .button>span { font-size:32px; }
  .footer-wordmark { font-size:57px; }
}
@media (max-width:360px) {
  .apex-stamp { width:77px; top:245px; right:0; }
  .stamp-top { display:none; }
  .stamp-copy { font-size:12px; margin-top:0; }
  .brand-approach .approach-intro h2 { font-size:33px; }
  .value-lane h3 { font-size:16px; }
  .value-lane summary { gap:7px; grid-template-columns:32px 1fr 26px; padding-right:3px; }
  .value-note { padding-left:39px; padding-right:12px; }
  .values-caption { font-size:11px; }
  .service-tabs button { font-size:11px; }
  .footer-wordmark { font-size:49px; }
}
@media (prefers-reduced-motion:reduce) {
  .runway-line { transform:none!important; will-change:auto; }
  .apex-stamp,.teaser-track,.driver-ticket { transform:none; }
  .service-tabs button,.motorsport-reasons article { transition:none; }
}
@media print {
  body::before,.scroll-progress,.type-runway,.apex-stamp,.contact-word { display:none!important; }
  .value-lane::details-content { display:block; }
  .value-note { display:block!important; }
  .value-note>span { display:none; }
  .page-word,.story-word { color:black; -webkit-text-stroke:0; text-shadow:none; }
  .driver-ticket { transform:none; position:static; }
}
/* Prevent long Latin artwork captions from dictating the journal grid width. */
.article-card { min-width:0; }
.article-art>span { overflow-wrap:anywhere; }
@media (max-width:700px) {
  .hero-description-block>p { font-size:14px; }
}
