/* =========================
   Settings
========================= */
:root {
  --color-black: #050505;
  --color-ink: #111111;
  --color-paper: #efeee9;
  --color-white: #ffffff;
  --color-blue: #00b5f5;
  --color-lime: #d5ff00;
  --color-muted: #a5a5a0;
  --font-display: "Space Grotesk", sans-serif;
  --font-ui: "Inter", sans-serif;
  --font-ja: "Noto Sans JP", sans-serif;
  --gutter: clamp(1.25rem, 3vw, 3.75rem);
  --section-space: clamp(6rem, 12vw, 12rem);
  --line: 1px solid rgba(255, 255, 255, 0.25);
}

/* =========================
   Foundation
========================= */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--color-black); color: var(--color-white); font-family: var(--font-ja); font-size: 1rem; line-height: 1.75; overflow-x: clip; }
body.is-menu-open { overflow: hidden; }
img, video { display: block; max-width: 100%; }
button, input, textarea { color: inherit; font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
p, h1, h2, h3, figure, dl, dd, ol, ul, fieldset { margin: 0; }
ol, ul { padding: 0; list-style: none; }
fieldset { min-width: 0; padding: 0; border: 0; }
button { border: 0; background: none; cursor: pointer; }
:focus-visible { outline: 2px solid var(--color-lime); outline-offset: 5px; }
::selection { background: var(--color-lime); color: var(--color-black); }
.c-skip-link { position: fixed; z-index: 1000; top: 0.75rem; left: 0.75rem; padding: 0.6rem 1rem; background: var(--color-lime); color: var(--color-black); transform: translateY(-200%); }
.c-skip-link:focus { transform: translateY(0); }
.c-index { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; }
.c-index::before { display: inline-block; width: 0.55rem; height: 0.55rem; margin-right: 0.65rem; background: currentColor; content: ""; }
.l-header__status,
.l-header__menu-label,
.l-header__link-number,
.l-header__nav-note,
.p-hero__eyebrow,
.p-hero__hud,
.p-hero__control,
.p-brands__head,
.c-index,
.p-bike-feature__data,
.p-bike-feature__body > p:first-child,
.p-about__lead,
.p-about__archive-label,
.p-about__archive-note,
.p-about__aside,
.p-shop__label,
.p-shop__image figcaption,
.l-footer__nav,
.l-footer__social,
.l-footer__bottom { font-family: var(--font-ui); }

/* =========================
   Header
========================= */
.l-header { position: fixed; z-index: 100; top: 0; left: 0; display: grid; width: 100%; grid-template-columns: minmax(10rem, 18rem) 1fr auto; align-items: center; gap: 2rem; padding: 1.25rem var(--gutter); border-bottom: 1px solid rgba(255,255,255,.22); transition: background .3s, padding .3s; }
.l-header.is-scrolled { padding-top: .8rem; padding-bottom: .8rem; background: rgba(5,5,5,.94); }
.l-header--solid { background: var(--color-black); }
.l-header__logo { position: relative; z-index: 2; width: min(16rem, 34vw); }
.l-header__logo img { width: 100%; height: auto; }
.l-header__status { display: grid; grid-template-columns: auto 1fr; align-items: center; justify-self: end; column-gap: .5rem; font-size: .62rem; letter-spacing: .16em; text-transform: uppercase; }
.l-header__status-dot { display: block; width: .45rem; height: .45rem; border-radius: 50%; background: #666; transition: background-color .25s, box-shadow .25s; }
.l-header__status small { grid-column: 2; font-family: var(--font-ja); font-size: .5rem; font-weight: 500; line-height: 1.4; letter-spacing: .08em; text-transform: none; }
.l-header__status.is-open .l-header__status-dot { background: var(--color-lime); box-shadow: 0 0 .8rem var(--color-lime); }
.l-header__menu { position: relative; z-index: 102; display: flex; align-items: center; gap: .75rem; padding: .5rem 0 .5rem 1rem; text-transform: uppercase; }
.l-header__menu-label { font-size: .7rem; letter-spacing: .16em; }
.l-header__menu-lines, .l-header__menu-lines::before { display: block; width: 1.8rem; height: 1px; background: currentColor; transition: transform .3s; content: ""; }
.l-header__menu-lines::before { transform: translateY(.45rem); }
.l-header__menu[aria-expanded="true"] .l-header__menu-lines { transform: rotate(45deg); }
.l-header__menu[aria-expanded="true"] .l-header__menu-lines::before { transform: rotate(-90deg); }
.l-header__nav { position: fixed; z-index: 101; inset: 0; display: grid; grid-template-columns: 1fr auto; align-content: center; gap: 3rem; padding: clamp(6rem, 12vw, 9rem) var(--gutter) 3rem; visibility: hidden; background: var(--color-blue); color: var(--color-black); opacity: 0; transform: translateY(-2rem); transition: visibility .4s, opacity .4s, transform .4s; }
.l-header__nav.is-open { visibility: visible; opacity: 1; transform: none; }
.l-header__links { grid-row: span 2; counter-reset: menu; }
.l-header__links a { display: flex; align-items: flex-start; gap: 1.5rem; padding: .08em 0; font-family: var(--font-display); font-size: clamp(2rem, 5.2vw, 6rem); font-weight: 700; line-height: .88; letter-spacing: -.06em; text-transform: uppercase; }
.l-header__link-number { min-width: 2rem; padding-top: .65em; font-family: var(--font-ui); font-size: .65rem; letter-spacing: .15em; }
.l-header__link-text { display: flex; min-width: 0; flex-direction: column; }
.l-header__link-text small { margin: .4rem 0 .1rem .2rem; font-family: var(--font-ja); font-size: clamp(.55rem, .65vw, .72rem); font-weight: 500; line-height: 1.2; letter-spacing: .14em; text-transform: none; }
.l-header__social { display: flex; align-self: end; gap: 1rem; }
.l-header__social a { display: grid; width: 3rem; height: 3rem; border: 1px solid currentColor; border-radius: 50%; place-items: center; }
.l-header__social img { width: 1.4rem; height: 1.4rem; }
.l-header__nav-note { align-self: end; font-size: .7rem; letter-spacing: .15em; text-transform: uppercase; writing-mode: vertical-rl; }

/* =========================
   Hero
========================= */
.p-hero { position: relative; min-height: 100svh; overflow: hidden; background: #111; isolation: isolate; }
.p-hero__video, .p-hero__shade, .p-hero__grid { position: absolute; inset: 0; width: 100%; height: 100%; }
.p-hero__video { z-index: -3; max-width: none; object-fit: cover; object-position: center; }
.p-hero__shade { z-index: -2; background: linear-gradient(90deg, rgba(0,0,0,.72), rgba(0,0,0,.12) 65%), linear-gradient(0deg, rgba(0,0,0,.55), transparent 50%); }
.p-hero__grid { z-index: -1; opacity: .26; background-image: linear-gradient(rgba(255,255,255,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.15) 1px, transparent 1px); background-size: 5vw 5vw; mask-image: linear-gradient(to bottom, #000, transparent 80%); }
.p-hero__hud { position: absolute; top: 48%; right: var(--gutter); display: flex; flex-direction: column; align-items: flex-end; gap: .5rem; font-size: .6rem; letter-spacing: .16em; text-transform: uppercase; }
.p-hero__content { display: flex; min-height: 100svh; flex-direction: column; justify-content: flex-end; padding: clamp(8rem, 15vh, 11rem) var(--gutter) clamp(2rem, 5vh, 4rem); }
.p-hero__eyebrow { margin-bottom: 1rem; font-size: .65rem; letter-spacing: .22em; text-transform: uppercase; }
.p-hero__title { font-family: var(--font-display); font-size: clamp(4.4rem, 14.5vw, 16rem); font-weight: 700; line-height: .7; letter-spacing: -.085em; text-transform: uppercase; }
.p-hero__title span { display: block; }
.p-hero__title span:nth-child(2) { margin-left: 12vw; color: transparent; -webkit-text-stroke: 2px var(--color-white); }
.p-hero__dot { display: inline !important; color: var(--color-blue); -webkit-text-stroke: 0; }
.p-hero__bottom { display: grid; grid-template-columns: minmax(15rem, 32rem) auto; align-items: end; gap: 3rem; margin-top: clamp(2rem, 6vh, 5rem); }
.p-hero__bottom > p { font-size: clamp(.9rem, 1.25vw, 1.1rem); font-weight: 600; line-height: 1.8; }
.c-circle-link { display: flex; width: clamp(7.5rem, 10vw, 10rem); aspect-ratio: 1; align-items: center; justify-content: space-around; justify-self: end; padding: 1rem; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; font-size: .68rem; line-height: 1.3; letter-spacing: .1em; text-transform: uppercase; transition: background .25s, color .25s; }
.p-hero__control { position: absolute; right: var(--gutter); bottom: 1.5rem; display: flex; align-items: center; gap: .6rem; font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; }
.p-hero__control-icon { width: .7rem; height: .7rem; border-right: 2px solid; border-left: 2px solid; }
.p-hero__control[aria-pressed="true"] .p-hero__control-icon { border: .35rem solid transparent; border-right: 0; border-left: .6rem solid; }

/* =========================
   Brand marquee
========================= */
.p-brands { overflow: hidden; border-top: var(--line); border-bottom: var(--line); background: var(--color-paper); color: var(--color-black); }
.p-brands__head { display: flex; justify-content: space-between; padding: .65rem var(--gutter); border-bottom: 1px solid rgba(0,0,0,.25); font-size: .6rem; letter-spacing: .15em; text-transform: uppercase; }
.p-brands__viewport { overflow-x: auto; overflow-y: hidden; border-bottom: 1px solid rgba(0,0,0,.25); cursor: grab; scrollbar-width: none; touch-action: pan-x; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; }
.p-brands__viewport::-webkit-scrollbar { display: none; }
.p-brands__viewport.is-dragging { cursor: grabbing; user-select: none; }
.p-brands__track { display: flex; width: max-content; }
.p-brands__list { display: flex; }
.p-brands__list li { display: grid; width: clamp(9rem, 14vw, 14rem); aspect-ratio: 1.9; border-right: 1px solid rgba(0,0,0,.18); place-items: center; }
.p-brands__list img { width: 75%; height: 65%; filter: grayscale(1) contrast(1.2); object-fit: contain; }

/* =========================
   About
========================= */
.p-about { position: relative; display: grid; min-height: clamp(44rem, 58vw, 58rem); grid-template-columns: minmax(8rem, .3fr) minmax(34rem, 1.3fr) minmax(30rem, 1.2fr); grid-template-rows: 1fr auto; column-gap: clamp(2rem, 3.5vw, 5rem); padding: clamp(4.5rem, 7vw, 8rem) var(--gutter) clamp(3rem, 5vw, 5rem); overflow: hidden; background: var(--color-paper); color: var(--color-black); }
.p-about__intro { position: relative; z-index: 2; padding-top: 2.25rem; }
.p-about__lead { margin-top: clamp(5rem, 9vw, 9rem); font-size: clamp(.7rem, .8vw, .85rem); font-weight: 700; letter-spacing: .12em; line-height: 1.4; text-transform: uppercase; writing-mode: vertical-rl; }
.p-about__copy { position: relative; z-index: 2; align-self: start; padding-top: 0; }
.p-about__copy h2 { max-width: 44rem; margin-bottom: clamp(3rem, 5vw, 5rem); font-size: clamp(3rem, 5.5vw, 6.5rem); line-height: 1.04; letter-spacing: -.065em; }
.p-about__copy p { max-width: 39rem; margin-top: 1.4rem; font-size: clamp(.92rem, 1.05vw, 1.12rem); }
.p-about__archive { position: relative; z-index: 2; display: grid; align-self: start; min-width: 0; padding: 2.25rem clamp(1rem, 3vw, 3.5rem) 0; border-top: 1px solid rgba(0,0,0,.45); grid-template-columns: auto 1fr; }
.p-about__archive span { display: block; grid-column: 1 / -1; margin: .4rem 0 0; font-family: var(--font-display); font-size: clamp(10rem, 20vw, 22rem); font-weight: 700; line-height: .7; letter-spacing: -.1em; color: var(--color-blue); }
.p-about__archive-label, .p-about__archive-note { position: relative; z-index: 2; font-size: clamp(.55rem, .68vw, .72rem); font-weight: 700; line-height: 1.45; letter-spacing: .14em; text-transform: uppercase; }
.p-about__archive-note { margin-top: -.6rem; grid-column: 1 / -1; text-align: center; }
.p-instagram { position: relative; z-index: 2; margin-top: clamp(5rem, 9vw, 9rem); padding-top: 1rem; border-top: 2px solid var(--color-black); grid-column: 1 / -1; }
.p-instagram[hidden], .p-instagram__grid[hidden], .p-instagram__profile[hidden], .p-instagram__status[hidden] { display: none; }
.p-instagram__header { display: grid; grid-template-columns: minmax(10rem, .55fr) minmax(0, 1.45fr); gap: clamp(3rem, 8vw, 10rem); }
.p-instagram__header h3 { max-width: 54rem; font-family: var(--font-display); font-size: clamp(2.5rem, 5vw, 5.5rem); font-weight: 700; line-height: .9; letter-spacing: -.055em; text-transform: uppercase; }
.p-instagram__header > div > p { max-width: 40rem; margin-top: 2rem; }
.p-instagram__status { margin-top: clamp(3rem, 6vw, 6rem); font-family: var(--font-ui); font-size: .68rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.p-instagram__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: clamp(3rem, 6vw, 6rem); border-top: 1px solid rgba(0,0,0,.3); border-left: 1px solid rgba(0,0,0,.3); }
.p-instagram__grid li { min-width: 0; border-right: 1px solid rgba(0,0,0,.3); border-bottom: 1px solid rgba(0,0,0,.3); }
.p-instagram__skeleton { margin-top: 1rem; }
.p-instagram__skeleton li { position: relative; overflow: hidden; aspect-ratio: 1; background: rgba(0,0,0,.08); }
.p-instagram__skeleton li::after { position: absolute; inset: 0; background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.45) 50%, transparent 70%); content: ""; animation: instagram-loading 1.8s linear infinite; transform: translateX(-100%); }
.p-instagram__post { position: relative; display: block; overflow: hidden; aspect-ratio: 1; background: var(--color-black); }
.p-instagram__post img { width: 100%; height: 100%; transition: opacity .3s, transform .5s cubic-bezier(.2,.75,.25,1); object-fit: cover; }
.p-instagram__post span { position: absolute; right: .75rem; bottom: .75rem; padding: .4rem .55rem; background: var(--color-black); color: var(--color-white); font-family: var(--font-ui); font-size: .55rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.c-arrow-link.p-instagram__profile { width: min(100%, 27rem); margin-left: auto; border-color: rgba(0,0,0,.35); }
.p-instagram__profile b { display: inline-flex; align-items: center; font-weight: inherit; }
.p-instagram__profile .c-external-icon::before { background: var(--color-paper); }
@keyframes instagram-loading { to { transform: translateX(100%); } }
.p-about__aside { position: relative; z-index: 2; margin-top: 2rem; grid-column: 1 / -1; font-size: .52rem; letter-spacing: .12em; text-align: center; text-transform: uppercase; }

/* =========================
   Bikes
========================= */
.p-bikes { padding: var(--section-space) 0; background: var(--color-black); }
.p-bikes__title { display: grid; grid-template-columns: .55fr 1.45fr; align-items: end; padding: 0 var(--gutter) clamp(5rem, 10vw, 10rem); }
.p-bikes__title h2 { font-family: var(--font-display); font-size: clamp(4.5rem, 14vw, 15rem); font-weight: 700; line-height: .73; letter-spacing: -.085em; text-transform: uppercase; }
.p-bikes__title h2 i { color: var(--color-blue); font-weight: 400; }
.p-bikes__title > p:last-child { max-width: 29rem; margin: 3rem 0 0 auto; grid-column: 2; }
.p-bike-feature { position: relative; min-height: min(82vw, 56rem); margin-bottom: clamp(7rem, 16vw, 16rem); }
.p-bike-feature img { width: min(78vw, 84rem); aspect-ratio: 1.78; object-fit: cover; }
.p-bike-feature--city img { margin-left: auto; }
.p-bike-feature__data { position: absolute; top: 1rem; display: flex; width: min(78vw, 84rem); justify-content: space-between; padding: 0 1rem; font-size: .57rem; letter-spacing: .15em; text-transform: uppercase; }
.p-bike-feature--city .p-bike-feature__data { right: 0; }
.p-bike-feature__panel { position: absolute; right: var(--gutter); bottom: 0; width: min(48rem, 52vw); }
.p-bike-feature--city .p-bike-feature__panel { right: auto; left: var(--gutter); }
.p-bike-feature__name { margin: 0 0 clamp(1.5rem, 3vw, 3rem); font-family: var(--font-display); font-size: clamp(3rem, 7.2vw, 8rem); font-weight: 700; line-height: .78; letter-spacing: -.07em; text-align: right; text-transform: uppercase; white-space: nowrap; }
.p-bike-feature--city .p-bike-feature__name { text-align: left; }
.p-bike-feature__body { width: 100%; padding: clamp(2rem, 5vw, 5rem); background: var(--color-blue); color: var(--color-black); }
.p-bike-feature--city .p-bike-feature__body { background: var(--color-lime); }
.p-bike-feature--mtb .p-bike-feature__body { background: var(--color-paper); }
.p-bike-feature__body > p:first-child { margin-bottom: 3rem; font-size: .65rem; letter-spacing: .16em; text-transform: uppercase; }
.p-bike-feature__body h3 { margin-bottom: 2rem; font-size: clamp(1.6rem, 3.4vw, 3.4rem); line-height: 1.15; letter-spacing: -.04em; }
.p-bike-feature__body > p:last-child { font-size: .92rem; }
.p-restoration { position: relative; min-height: clamp(34rem, 47vw, 48rem); padding: clamp(7rem, 12vw, 12rem) var(--gutter) 0; overflow: hidden; }
.p-restoration__word { position: absolute; z-index: 0; top: .08em; left: -.04em; font-family: var(--font-display); font-size: clamp(5rem, 13.5vw, 14rem); font-weight: 700; line-height: .8; letter-spacing: -.085em; color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.28); text-transform: uppercase; white-space: nowrap; }
.p-restoration figure { position: relative; z-index: 1; width: 55%; }
.p-restoration figure::after { position: absolute; inset: 5%; border: 1px solid rgba(213,255,0,.7); content: ""; }
.p-restoration img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.p-restoration figcaption { position: absolute; z-index: 2; right: 7%; bottom: 8%; left: 7%; color: var(--color-lime); font-family: var(--font-ui); font-size: clamp(.52rem, .7vw, .68rem); font-weight: 600; line-height: 1.4; letter-spacing: .1em; text-transform: uppercase; }
.p-restoration__body { position: absolute; z-index: 2; right: var(--gutter); bottom: 0; width: min(48rem, 52vw); padding: clamp(2.5rem, 5vw, 5rem); background: var(--color-paper); color: var(--color-black); }
.p-restoration h3 { margin: 3rem 0 2rem; font-size: clamp(2.1rem, 4.5vw, 5rem); line-height: 1.08; letter-spacing: -.05em; }
.p-restoration__body > p:not(.c-index) { max-width: 34rem; }
.p-restoration .c-arrow-link { border-color: rgba(0,0,0,.35); }
.c-arrow-link { display: flex; max-width: 27rem; justify-content: space-between; margin-top: 3rem; padding: 1rem .75rem; border-top: var(--line); border-bottom: var(--line); font-size: .8rem; font-weight: 700; transition: background .25s; }
.c-arrow-link span { transition: transform .25s; }
.c-arrow-link:focus-visible { background: var(--color-lime); }
.c-arrow-link:focus-visible span { transform: translate(3px, -3px); }
.c-external-icon { position: relative; display: inline-block; width: .72rem; height: .72rem; margin-left: .45rem; border: 1px solid currentColor; vertical-align: .02em; }
.c-external-icon::before { position: absolute; top: -.2rem; right: -.2rem; width: .45rem; height: .45rem; border-top: 1px solid currentColor; border-right: 1px solid currentColor; background: var(--color-blue); content: ""; }
.c-external-icon::after { position: absolute; top: -.08rem; right: -.08rem; width: .42rem; height: 1px; background: currentColor; content: ""; transform: rotate(-45deg); transform-origin: right center; }

/* =========================
   Repair
========================= */
.p-repair { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; padding: var(--section-space) var(--gutter); overflow: hidden; background: var(--color-blue); color: var(--color-black); }
.p-repair__scan { position: absolute; inset: 0; opacity: .13; background: repeating-linear-gradient(0deg, transparent 0 5px, #000 6px); pointer-events: none; }
.p-repair__header, .p-repair__visual, .p-repair__menu, .p-repair__cta { position: relative; }
.p-repair__header { grid-column: 1 / -1; }
.p-repair__header h2 { margin: 4rem 0 2rem; font-family: var(--font-display); font-size: clamp(5rem, 15vw, 16rem); font-weight: 700; line-height: .7; letter-spacing: -.085em; text-transform: uppercase; }
.p-repair__header h2 span { color: var(--color-lime); }
.p-repair__header > p:last-child { margin-left: 55%; font-weight: 700; }
.p-repair__visual { width: 88%; margin-top: 8rem; }
.p-repair__visual img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: 58% center; filter: grayscale(1) contrast(1.15); }
.p-repair__cross { position: absolute; right: -3rem; bottom: -3rem; width: 8rem; aspect-ratio: 1; border: 1px solid; border-radius: 50%; }
.p-repair__cross::before, .p-repair__cross::after { position: absolute; top: 50%; left: 10%; width: 80%; height: 1px; background: currentColor; content: ""; }
.p-repair__cross::after { transform: rotate(90deg); }
.p-repair__menu { align-self: end; margin-top: 8rem; }
.p-repair__menu li { border-top: 1px solid rgba(0,0,0,.35); }
.p-repair__menu li:last-child { border-bottom: 1px solid rgba(0,0,0,.35); }
.p-repair__menu a { display: grid; grid-template-columns: 2rem 1fr auto; gap: 1.4rem; padding: 1.7rem 1rem; transition: background .25s; }
.p-repair__menu span { font-size: .6rem; }
.p-repair__menu h3 { margin-bottom: .7rem; font-size: clamp(1.5rem, 2.8vw, 2.7rem); line-height: 1; text-transform: uppercase; }
.p-repair__menu p { max-width: 27rem; font-size: .82rem; }
.p-repair__menu i { font-size: 1.5rem; font-style: normal; transition: transform .25s; }
.p-repair__menu a:focus-visible { background: var(--color-lime); }
.p-repair__menu a:focus-visible i { transform: translate(3px, -3px); }
.p-repair__cta { display: flex; width: clamp(10rem, 17vw, 15rem); aspect-ratio: 1; align-items: center; justify-content: space-around; margin: 5rem auto 0; border-radius: 50%; background: var(--color-black); color: var(--color-white); font-size: .7rem; letter-spacing: .1em; line-height: 1.3; text-transform: uppercase; }

/* =========================
   Shop
========================= */
.p-shop { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(3rem, 8vw, 10rem); padding: var(--section-space) var(--gutter); background: var(--color-paper); color: var(--color-black); }
.p-shop__title { grid-column: 1 / -1; }
.p-shop__title h2 { max-width: 80rem; margin: 3rem 0; font-family: var(--font-display); font-size: clamp(5rem, 15vw, 15rem); font-weight: 700; line-height: .7; letter-spacing: -.085em; text-transform: uppercase; }
.p-shop__image > img { width: 100%; height: min(60rem, 78vw); object-fit: cover; object-position: right center; }
.p-shop__image--entrance > img { height: auto; aspect-ratio: 4 / 5; object-position: center; }
.p-shop__image figcaption, .p-shop__nearby-caption { display: flex; justify-content: space-between; padding-top: .7rem; font-size: .58rem; letter-spacing: .15em; text-transform: uppercase; }
.p-shop__image > .p-shop__nearby-image { width: 74%; height: auto; aspect-ratio: 4 / 3; margin: clamp(2.5rem, 5vw, 5rem) 0 0 auto; object-position: center; }
.p-shop__nearby-caption { width: 74%; margin-left: auto; }
.p-shop__info { align-self: end; padding-bottom: 3rem; }
.p-shop__label { margin-bottom: 1rem; font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; }
.p-shop__name { font-size: clamp(1.8rem, 3.7vw, 4rem); font-weight: 700; line-height: 1.1; letter-spacing: -.04em; }
.p-shop__name-reading { font-size: .45em; letter-spacing: .04em; white-space: nowrap; }
.p-shop__map { margin-top: clamp(2rem, 4vw, 4rem); }
.p-shop__map iframe { display: block; width: 100%; height: clamp(18rem, 30vw, 27rem); border: 0; filter: grayscale(1) contrast(1.05); }
.p-shop__map a { display: flex; justify-content: space-between; padding: .9rem 0; border-bottom: 1px solid rgba(0,0,0,.35); font-family: var(--font-ui); font-size: .68rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.p-shop__info dl { margin-top: 5rem; border-top: 1px solid; }
.p-shop__info dl div { display: grid; grid-template-columns: 8rem 1fr; padding: 1rem 0; border-bottom: 1px solid rgba(0,0,0,.3); }
.p-shop__info dt { font-size: .65rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.p-shop__info dd { font-size: .85rem; }
.p-shop__access { display: grid; gap: .35rem; }
.p-shop__note { margin-top: 2rem; padding-left: 1rem; border-left: 3px solid var(--color-blue); font-size: .75rem; }

/* =========================
   Category hero / Maintenance
========================= */
.p-category-hero { position: relative; display: flex; min-height: min(48rem, 78svh); flex-direction: column; justify-content: space-between; padding: clamp(8rem, 14vw, 11rem) var(--gutter) clamp(2.5rem, 5vw, 4rem); overflow: hidden; background: var(--color-black); isolation: isolate; }
.p-category-hero--maintenance, .p-category-hero--brands, .p-category-hero--about, .p-category-hero--shop, .p-category-hero--contact, .p-category-hero--privacy { background-position: center; background-size: cover; }
.p-category-hero--maintenance { background-image: linear-gradient(90deg, rgba(5,5,5,.88), rgba(5,5,5,.42) 68%, rgba(5,5,5,.68)), linear-gradient(0deg, rgba(5,5,5,.72), transparent 55%), url("../img/maintenance/derailleur.webp"); }
.p-category-hero--brands { background-image: linear-gradient(90deg, rgba(5,5,5,.88), rgba(5,5,5,.42) 68%, rgba(5,5,5,.68)), linear-gradient(0deg, rgba(5,5,5,.72), transparent 55%), url("../img/brands/bike-01.webp"); }
.p-category-hero--about { background-image: linear-gradient(90deg, rgba(5,5,5,.88), rgba(5,5,5,.42) 68%, rgba(5,5,5,.68)), linear-gradient(0deg, rgba(5,5,5,.72), transparent 55%), url("../img/about/about-01.webp"); }
.p-category-hero--shop { background-image: linear-gradient(90deg, rgba(5,5,5,.88), rgba(5,5,5,.42) 68%, rgba(5,5,5,.68)), linear-gradient(0deg, rgba(5,5,5,.72), transparent 55%), url("../img/shop/shop-01.webp"); }
.p-category-hero--contact { background-image: linear-gradient(90deg, rgba(5,5,5,.88), rgba(5,5,5,.42) 68%, rgba(5,5,5,.68)), linear-gradient(0deg, rgba(5,5,5,.72), transparent 55%), url("../img/contact/contact-01.webp"); }
.p-category-hero--privacy { background-image: linear-gradient(90deg, rgba(5,5,5,.88), rgba(5,5,5,.42) 68%, rgba(5,5,5,.68)), linear-gradient(0deg, rgba(5,5,5,.72), transparent 55%), url("../img/privacy/privacy-01.webp"); }
.p-category-hero__grid { position: absolute; z-index: 1; inset: 0; opacity: .22; background-image: linear-gradient(rgba(255,255,255,.13) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.13) 1px, transparent 1px); background-size: 8vw 8vw; mask-image: linear-gradient(135deg, #000, transparent 78%); pointer-events: none; }
.p-category-hero__breadcrumb, .p-category-hero__body, .p-category-hero__meta { position: relative; z-index: 3; }
.p-category-hero__breadcrumb { display: flex; gap: .7rem; color: var(--color-muted); font-family: var(--font-ui); font-size: .62rem; letter-spacing: .15em; text-transform: uppercase; }
.p-category-hero__breadcrumb a { color: var(--color-white); }
.p-category-hero__body { margin-top: clamp(5rem, 10vw, 9rem); }
.p-category-hero__body h1 { position: relative; margin-top: 2rem; font-family: var(--font-display); font-size: clamp(4.5rem, 14vw, 14rem); font-weight: 700; line-height: .72; letter-spacing: -.085em; text-transform: uppercase; }
.p-category-hero__title-line { display: block; white-space: nowrap; }
.p-category-hero__title-char { display: inline-block; white-space: pre; }
.p-category-hero__title-line.is-split .p-category-hero__title-char { opacity: 0; }
.p-category-hero__title-line.is-lit .p-category-hero__title-char { animation: category-title-light .36s ease-out forwards; }
.p-category-hero__title-char:last-child { color: var(--color-lime); }
.p-category-hero__intro { display: grid; max-width: 68rem; grid-template-columns: .55fr 1.45fr; gap: clamp(2rem, 8vw, 9rem); margin: clamp(3rem, 6vw, 6rem) 0 0 auto; }
.p-category-hero__intro p:first-child { font-weight: 700; }
.p-category-hero__intro p:last-child { max-width: 40rem; }
.p-category-hero__meta { align-self: flex-end; margin-top: 3rem; font-family: var(--font-ui); font-size: .58rem; letter-spacing: .16em; text-transform: uppercase; }
@keyframes category-title-light { 0%, 24.9% { opacity: 0; } 25%, 49.9% { opacity: 1; } 50%, 64.9% { opacity: 0; } 65%, 100% { opacity: 1; } }

/* =========================
   Lower page content
========================= */
.p-page { padding: var(--section-space) var(--gutter); background: var(--color-paper); color: var(--color-black); }
.p-page__lead { display: grid; grid-template-columns: minmax(10rem, .55fr) minmax(0, 1.45fr); gap: clamp(3rem, 8vw, 10rem); margin-bottom: clamp(6rem, 11vw, 11rem); }
.p-page__lead h2 { width: 100%; margin-bottom: 2rem; font-size: clamp(2.4rem, 5vw, 5.5rem); line-height: 1.04; letter-spacing: -.055em; }
.p-page__lead p:not(.c-index) { width: 100%; }
.p-page__section { width: 100%; margin-right: auto; margin-left: auto; }
.p-page__section + .p-page__section { margin-top: clamp(6rem, 11vw, 11rem); }
.p-page__section-head { display: grid; grid-template-columns: 4rem 1fr auto; align-items: end; gap: 1.5rem; padding-bottom: 1rem; border-bottom: 2px solid var(--color-black); }
.p-page__section-head > p, .p-page__section-head > span { font-family: var(--font-ui); font-size: .6rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.p-page__section-head h2 { font-size: clamp(1.8rem, 3.5vw, 3.6rem); line-height: 1.1; }
.p-page__text { max-width: 56rem; margin: clamp(2.5rem, 5vw, 5rem) 0 0 auto; }
.p-page__text p + p { margin-top: 1.5rem; }
.p-page__timeline { margin-top: clamp(2.5rem, 5vw, 5rem); border-top: 1px solid rgba(0,0,0,.24); }
.p-page__timeline li { display: grid; grid-template-columns: minmax(7rem, .3fr) 1.7fr; gap: 2rem; padding: 1.7rem 0; border-bottom: 1px solid rgba(0,0,0,.24); }
.p-page__timeline time { color: var(--color-blue); font-family: var(--font-display); font-size: clamp(1.5rem, 3vw, 3rem); font-weight: 700; line-height: 1; }
.p-about-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(.75rem, 1.5vw, 1.5rem); margin-top: clamp(4rem, 7vw, 7rem); }
.p-about-gallery img { width: 100%; height: auto; aspect-ratio: 64 / 45; object-fit: cover; }
.p-about-gallery figcaption { padding-top: .7rem; font-family: var(--font-ui); font-size: .58rem; letter-spacing: .15em; text-transform: uppercase; }
.p-page__profile { margin-top: clamp(2.5rem, 5vw, 5rem); border-top: 1px solid rgba(0,0,0,.24); }
.p-page__profile div { display: grid; grid-template-columns: minmax(8rem, .45fr) 1.55fr; gap: 2rem; padding: 1.4rem 0; border-bottom: 1px solid rgba(0,0,0,.24); }
.p-page__profile dt { font-size: .72rem; font-weight: 700; letter-spacing: .08em; }
.p-page__detail-link { display: flex; width: fit-content; max-width: 100%; align-items: center; justify-content: space-between; gap: 1.5rem; margin-top: 1rem; padding: .8rem 1rem; border: 1px solid rgba(0,0,0,.45); font-size: .72rem; font-weight: 700; line-height: 1.5; transition: background .25s, border-color .25s; }
.p-page__detail-link span { flex: none; font-size: 1rem; transition: transform .25s; }
.p-page__detail-link:focus-visible { border-color: var(--color-black); background: var(--color-lime); }
.p-page__detail-link:focus-visible span { transform: translate(3px, -3px); }
.p-page__brands { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: clamp(2.5rem, 5vw, 5rem); border-top: 1px solid rgba(0,0,0,.24); border-left: 1px solid rgba(0,0,0,.24); }
.p-page__brand { display: grid; min-height: 18rem; grid-template-rows: 8rem auto; padding: clamp(1.5rem, 3vw, 3rem); border-right: 1px solid rgba(0,0,0,.24); border-bottom: 1px solid rgba(0,0,0,.24); }
.p-page__brand img { width: min(14rem, 72%); height: 6rem; align-self: center; filter: grayscale(1) contrast(1.2); object-fit: contain; object-position: left center; }
.p-page__brand h3 { font-size: clamp(1.25rem, 2vw, 2rem); line-height: 1.2; }
.p-page__brand p { margin-top: 1rem; font-size: .82rem; }
.c-notice { margin-top: clamp(5rem, 8vw, 8rem); padding: clamp(2rem, 5vw, 5rem); background: var(--color-black); color: var(--color-white); }
.c-notice h2 { margin-bottom: 1.5rem; font-size: clamp(1.7rem, 3.5vw, 3.5rem); line-height: 1.15; }
.c-notice > p { max-width: 50rem; }
.c-notice--split { display: grid; grid-template-columns: minmax(10rem, .55fr) minmax(0, 1.45fr); gap: clamp(3rem, 8vw, 10rem); }
.c-notice--split h2 { margin-bottom: 2.5rem; letter-spacing: -.04em; }
.c-notice--split ul { display: grid; gap: 1rem; border-top: 1px solid rgba(255,255,255,.3); counter-reset: notice; }
.c-notice--split li { display: grid; grid-template-columns: 2rem 1fr; gap: 1rem; padding: 1.4rem 0; border-bottom: 1px solid rgba(255,255,255,.3); font-size: .85rem; }
.c-notice--split li::before { color: var(--color-lime); font-family: var(--font-ui); font-size: .65rem; content: "0" counter(notice); counter-increment: notice; }
.p-brands__notice { margin-bottom: clamp(6rem, 10vw, 10rem); }
.p-restoration-guide__intro { display: grid; grid-template-columns: minmax(8rem, .45fr) minmax(0, 1.55fr); gap: clamp(2rem, 6vw, 7rem); margin-top: clamp(3rem, 6vw, 6rem); }
.p-restoration-guide__intro h3 { max-width: 50rem; margin-bottom: 2rem; font-size: clamp(2rem, 4vw, 4.5rem); line-height: 1.08; letter-spacing: -.045em; }
.p-restoration-guide__intro > div > p { max-width: 50rem; }
.p-restoration-guide__services, .p-restoration-guide__flow { margin-top: clamp(5rem, 9vw, 9rem); }
.p-restoration-guide__subhead { display: grid; grid-template-columns: 4rem 1fr auto; align-items: end; gap: 1.5rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(0,0,0,.4); }
.p-restoration-guide__subhead > p, .p-restoration-guide__subhead > span { font-family: var(--font-ui); font-size: .6rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.p-restoration-guide__subhead h3 { font-size: clamp(1.4rem, 2.5vw, 2.5rem); line-height: 1.15; }
.p-restoration-guide__services ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-left: 1px solid rgba(0,0,0,.24); }
.p-restoration-guide__services li { min-height: 13rem; padding: clamp(1.4rem, 3vw, 2.5rem); border-right: 1px solid rgba(0,0,0,.24); border-bottom: 1px solid rgba(0,0,0,.24); }
.p-restoration-guide__services li > p:first-child { color: var(--color-blue); font-family: var(--font-ui); font-size: .58rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.p-restoration-guide__services h4 { margin: 2.5rem 0 1rem; font-size: clamp(1.25rem, 2vw, 2rem); line-height: 1.2; }
.p-restoration-guide__services li > p:last-child { font-size: .8rem; }
.p-restoration-guide__note { margin-top: 1rem; color: rgba(0,0,0,.68); font-size: .7rem; }
.p-restoration-guide__flow ol { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-bottom: 1px solid rgba(0,0,0,.24); }
.p-restoration-guide__flow li { position: relative; min-height: 9rem; padding: 1.5rem 1rem; border-right: 1px solid rgba(0,0,0,.24); }
.p-restoration-guide__flow li:first-child { border-left: 1px solid rgba(0,0,0,.24); }
.p-restoration-guide__flow li:not(:last-child)::after { position: absolute; top: 50%; right: 0; z-index: 1; width: .55rem; height: .55rem; background: var(--color-blue); content: ""; transform: translate(50%, -50%) rotate(45deg); }
.p-restoration-guide__flow span { display: block; margin-bottom: 2.5rem; color: var(--color-blue); font-family: var(--font-ui); font-size: .58rem; font-weight: 600; }
.p-restoration-guide__flow strong { font-size: clamp(.8rem, 1.1vw, 1rem); }
.p-page__access { display: grid; gap: 0; margin-top: clamp(2.5rem, 5vw, 5rem); border-top: 1px solid rgba(0,0,0,.24); }
.p-page__access li { display: grid; grid-template-columns: minmax(8rem, .45fr) 1.55fr; gap: 2rem; padding: 1.5rem 0; border-bottom: 1px solid rgba(0,0,0,.24); }
.p-page__access strong { font-size: .75rem; letter-spacing: .08em; }
.p-shop-map { margin-top: clamp(2.5rem, 5vw, 5rem); background: rgba(0,0,0,.08); }
.p-shop-map iframe { display: block; width: 100%; height: auto; min-height: 24rem; aspect-ratio: 16 / 7; border: 0; }
.p-shop-map__link { display: flex; width: fit-content; align-items: center; gap: .75rem; margin: 1rem 0 0 auto; padding-bottom: .35rem; border-bottom: 1px solid rgba(0,0,0,.45); font-size: .72rem; font-weight: 700; }
.p-shop-map__link span { transition: transform .25s; }
.p-shop-map__link:focus-visible span { transform: translate(3px, -3px); }
.p-shop-purpose { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: clamp(2.5rem, 5vw, 5rem); border-top: 1px solid rgba(0,0,0,.24); border-left: 1px solid rgba(0,0,0,.24); }
.p-shop-purpose__item { display: flex; min-height: 25rem; flex-direction: column; padding: clamp(1.5rem, 3vw, 3rem); border-right: 1px solid rgba(0,0,0,.24); border-bottom: 1px solid rgba(0,0,0,.24); }
.p-shop-purpose__item > p:first-child { color: var(--color-blue); font-family: var(--font-ui); font-size: .58rem; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; }
.p-shop-purpose__item h3 { margin: auto 0 1.5rem; font-size: clamp(1.5rem, 2.5vw, 2.5rem); line-height: 1.15; }
.p-shop-purpose__item > p:not(:first-child) { font-size: .82rem; }
.p-shop-purpose__item a { display: flex; justify-content: space-between; gap: 1rem; margin: 2rem -.75rem -.75rem; padding: 1rem .75rem .75rem; border-top: 1px solid rgba(0,0,0,.24); font-size: .72rem; font-weight: 700; transition: background .25s, border-color .25s; }
.p-shop-purpose__item a span { flex: none; transition: transform .25s; }
.p-shop-purpose__item a:focus-visible { border-color: rgba(0,0,0,.55); background: var(--color-lime); }
.p-shop-purpose__item a:focus-visible span { transform: translate(3px, -3px); }
.p-shop-first { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(20rem, .95fr); gap: clamp(2rem, 6vw, 7rem); align-items: start; margin-top: clamp(2.5rem, 5vw, 5rem); }
.p-shop-first__visual img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: left center; }
.p-shop-first__visual figcaption { padding-top: .7rem; font-family: var(--font-ui); font-size: .58rem; letter-spacing: .12em; text-transform: uppercase; }
.p-shop-first__body > p { font-size: clamp(1rem, 1.6vw, 1.25rem); font-weight: 500; }
.p-shop-first__body ol { margin-top: clamp(2.5rem, 5vw, 4rem); border-top: 1px solid rgba(0,0,0,.24); }
.p-shop-first__body li { display: grid; grid-template-columns: 2.5rem 1fr; gap: 1rem; padding: 1.4rem 0; border-bottom: 1px solid rgba(0,0,0,.24); }
.p-shop-first__body li > span { color: var(--color-blue); font-family: var(--font-ui); font-size: .65rem; font-weight: 600; }
.p-shop-first__body strong { display: block; margin-bottom: .35rem; }
.p-shop-first__body small { display: block; margin-top: 1.5rem; color: rgba(0,0,0,.68); font-size: .7rem; }
.c-cta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, 27rem); align-items: center; gap: clamp(3rem, 8vw, 10rem); margin-top: clamp(6rem, 10vw, 10rem); padding: clamp(3rem, 6vw, 6rem); background: var(--color-blue); color: var(--color-black); }
.c-cta > p { max-width: 42rem; font-weight: 600; }
.c-cta .c-arrow-link { width: 100%; max-width: none; margin-top: 0; border-color: rgba(0,0,0,.35); }
.c-cta--connected { margin-top: 0; }
.c-cta--multiple { align-items: end; }
.c-cta__copy { max-width: 48rem; }
.c-cta__copy h3 { margin: 2rem 0 1.5rem; font-size: clamp(1.8rem, 3.5vw, 3.7rem); line-height: 1.1; letter-spacing: -.04em; }
.c-cta__copy .c-cta__message { margin-top: 2rem; font-size: clamp(1.1rem, 1.8vw, 1.5rem); }
.c-cta__links { display: grid; gap: 1rem; }
.c-cta__label { display: inline-flex; align-items: center; font-weight: inherit; }
.p-policy__body { max-width: 56rem; margin: clamp(2.5rem, 5vw, 5rem) 0 0 auto; }
.p-policy__body p + p { margin-top: 1.5rem; }
.p-policy__body ul { display: grid; gap: .8rem; margin-top: 1.5rem; }
.p-policy__body li { position: relative; padding-left: 1.4rem; }
.p-policy__body li::before { position: absolute; top: .72em; left: 0; width: .45rem; height: .45rem; background: var(--color-blue); content: ""; }
.p-policy__contact { margin-top: 2rem; padding: clamp(1.5rem, 3vw, 3rem); background: var(--color-black); color: var(--color-white); }
.p-policy__contact p + p { margin-top: .35rem; }
.p-policy__date { width: 84%; margin: clamp(6rem, 10vw, 10rem) auto 0; padding-top: 1.5rem; border-top: 1px solid rgba(0,0,0,.24); font-family: var(--font-ui); font-size: .68rem; letter-spacing: .1em; text-align: right; text-transform: uppercase; }
.p-maintenance { padding: var(--section-space) var(--gutter); background: var(--color-paper); color: var(--color-black); }
.p-maintenance__header { display: grid; grid-template-columns: minmax(10rem, .55fr) minmax(0, 1.45fr); gap: clamp(3rem, 8vw, 10rem); margin-bottom: clamp(6rem, 11vw, 11rem); }
.p-maintenance__header h2 { margin-bottom: 2rem; font-size: clamp(2rem, 4.5vw, 5rem); line-height: 1.1; letter-spacing: -.045em; }
.p-maintenance__header > div p { max-width: 48rem; }
.p-maintenance__section { width: 100%; margin-right: auto; margin-left: auto; scroll-margin-top: 7rem; }
.p-maintenance__section + .p-maintenance__section { margin-top: clamp(5rem, 9vw, 8rem); }
.p-maintenance__section-head { display: grid; grid-template-columns: 4rem 1fr auto; align-items: end; gap: 1.5rem; padding-bottom: 1rem; border-bottom: 2px solid var(--color-black); }
.p-maintenance__section-head p, .p-maintenance__section-head span { font-family: var(--font-ui); font-size: .6rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.p-maintenance__section-head h2 { font-size: clamp(1.6rem, 3vw, 3rem); line-height: 1.1; }
.p-maintenance__table-wrap { overflow-x: auto; }
.p-maintenance__table-wrap:focus-visible { outline-offset: 3px; }
.p-maintenance__table { width: 100%; min-width: 44rem; border-collapse: collapse; table-layout: fixed; }
.p-maintenance__table th, .p-maintenance__table td { padding: 1.25rem 1rem; border-bottom: 1px solid rgba(0,0,0,.24); text-align: left; vertical-align: top; }
.p-maintenance__table thead th { background: var(--color-black); color: var(--color-white); font-family: var(--font-ui); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; }
.p-maintenance__table th:first-child { width: 76%; }
.p-maintenance__table th[scope="row"] { font-size: .9rem; font-weight: 500; }
.p-maintenance__table td { font-family: var(--font-ui); font-size: .9rem; font-weight: 600; white-space: nowrap; }
.p-maintenance__table small { display: block; margin-top: .25rem; color: #555; font-size: .72rem; font-weight: 400; line-height: 1.6; }

/* =========================
   Contact
========================= */
.p-contact { padding: var(--section-space) var(--gutter); background: var(--color-black); }
.p-contact__header { display: grid; grid-template-columns: .6fr 1.4fr; align-items: end; }
.p-contact__header h1, .p-contact__header h2 { margin: 0; font-family: var(--font-display); font-size: clamp(4.4rem, 12.5vw, 13rem); font-weight: 700; line-height: .72; letter-spacing: -.085em; text-transform: uppercase; }
.p-contact__header h1 span, .p-contact__header h2 span { color: var(--color-blue); }
.p-contact__header > p:last-child { max-width: 35rem; margin: 3rem 0 0 auto; grid-column: 2; }
.p-contact__form { max-width: 90rem; margin: clamp(4rem, 8vw, 8rem) auto 0; }
.p-contact__row { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.p-contact__field { margin-top: 3rem; }
.p-contact__field label, .p-contact__field legend { display: block; margin-bottom: 1rem; font-size: clamp(1rem, 1.2vw, 1.2rem); font-weight: 700; }
.p-contact__field label > span:first-child, .p-contact__field legend > span:first-child { margin-right: 1.2rem; color: var(--color-blue); font-size: .6rem; }
.p-contact__field em { margin-left: .7rem; color: var(--color-lime); font-size: .62rem; font-style: normal; }
.p-contact__field small { margin-left: .7rem; color: var(--color-muted); font-size: .62rem; font-weight: 400; }
.p-contact__field input:not([type="radio"]):not([type="checkbox"]), .p-contact__field textarea { width: 100%; padding: 1rem; border: 0; border-bottom: 1px solid #666; border-radius: 0; background: #1a1a1a; transition: border-color .2s, background-color .2s; }
.p-contact__field textarea { resize: vertical; }
.p-contact__field input:focus, .p-contact__field textarea:focus { border-color: var(--color-blue); outline: 0; }
.p-contact__field input::placeholder, .p-contact__field textarea::placeholder { color: #a5a5a0; opacity: 1; }
.p-contact__choices { display: grid; grid-template-columns: repeat(5, 1fr); gap: .6rem; }
.p-contact__choices label { position: relative; margin: 0; }
.p-contact__choices input { position: absolute; opacity: 0; }
.p-contact__choices span { display: grid; min-height: 4rem; margin: 0 !important; border: 1px solid #555; color: var(--color-white) !important; font-size: .76rem !important; place-items: center; transition: background .2s, color .2s, border-color .2s; cursor: pointer; }
.p-contact__choices input:checked + span { border-color: var(--color-lime); background: var(--color-lime); color: var(--color-black) !important; }
.p-contact__choices input:focus-visible + span { outline: 2px solid var(--color-lime); outline-offset: 3px; }
.p-contact__sales-notice { margin-top: 3rem; padding: 1.25rem; border-left: 3px solid var(--color-lime); background: #1a1a1a; }
.p-contact__sales-notice p:first-child { margin-bottom: .5rem; color: var(--color-lime); font-size: .8rem; font-weight: 700; }
.p-contact__sales-notice p:last-child { font-size: .75rem; }
.p-contact__agree { display: flex; align-items: flex-start; gap: .9rem; width: fit-content; margin-top: 3rem; font-size: .78rem; cursor: pointer; }
.p-contact__agree input { width: 1.2rem; height: 1.2rem; margin-top: .25rem; accent-color: var(--color-lime); }
.p-contact__agree small { color: var(--color-muted); }
.c-form-error,.contact__error-text { margin-top: .6rem; color: #ff7b7b; font-size: .75rem; }
.p-contact__submit { display: flex; width: min(100%, 32rem); justify-content: space-between; margin: 5rem 0 0 auto; padding: 1.4rem 1.7rem; background: var(--color-blue); color: var(--color-black); font-weight: 700; text-align: left; }
.p-contact__submit i { font-size: 1.4rem; font-style: normal; }
.p-contact__status { margin: 1rem 0 0 auto; padding: 1rem; max-width: 32rem; border: 1px solid var(--color-blue); color: var(--color-blue); font-size: .8rem; }

.p-contact.p-contact-confirm {
   padding-top: 3rem;
}
.p-contact-confirm .contact__inner {
  margin-top: 3rem;
}
.contact__confirm-list .contact__row {
   display: flex;
   margin-bottom: 2rem;
   padding-bottom: 2rem;
   border-bottom: 1px solid #666;
}
.contact__confirm-list .contact__label {
   width: 18rem;
}
.contact__confirm-list .contact__label em {
   margin-left: .7rem;
   color: var(--color-lime);
   font-size: .62rem;
   font-style: normal;
}
.contact__confirm-list .contact__label small {
   margin-left: .7rem;
   color: var(--color-muted);
   font-size: .62rem;
   font-weight: 400;
}
.contact__confirm-list .contact__confirm-value {
   width: calc(100% - 18rem);
}

.p-contact-confirm .contact__btn-group {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 2rem;
   margin: 5rem 0 0; 
}
.p-contact-confirm .contact__btn--back { 
   width: min(100%, 20rem); 
   padding: 1.4rem 1.7rem; 
   background: var(--color-paper); 
   color: var(--color-black); 
   font-weight: 700; 
   text-align: center; 
}
.p-contact-confirm .contact__submit { 
   width: min(100%, 20rem); 
   padding: 1.4rem 1.7rem; 
   background: var(--color-blue); 
   color: var(--color-black); 
   font-weight: 700; 
   text-align: center; 
}

.p-contact-confirm .contact__btn--back:hover { background: var(--color-muted); }
.p-contact-confirm .contact__submit:hover { background: var(--color-lime); }

@media (max-width: 767px) {
   .p-contact-confirm .p-contact__header > p:last-child {
      margin-left: 0;
   }
   
   .contact__confirm-list .contact__row {
      display: block;
   }
   .contact__confirm-list .contact__label {
      width: 100%;
   }
   .contact__confirm-list .contact__confirm-value {
      width: 100%;
      margin-top: 1rem;
   }
   .p-contact-confirm .contact__btn-group {
      gap: 1rem;
      margin: 3rem 0 0; 
   }
}


.p-contact.p-contact-thanks {
   padding-top: 3rem;
}

.p-contact.p-contact-thanks .thanks-page {
   text-align: center;
   margin-top: 5rem;
}
.p-contact.p-contact-thanks .thanks-page__title {
  margin-bottom: 1rem;
}

/* =========================
   Footer
========================= */
.l-footer { overflow: hidden; background: var(--color-blue); color: var(--color-black); }
.l-footer__marquee { overflow: hidden; padding: 1rem 0 2rem; }
.l-footer__marquee-track { display: flex; width: max-content; will-change: transform; animation: footer-marquee 60s linear infinite; }
.l-footer__marquee p { flex: none; padding-right: .18em; font-family: var(--font-display); font-size: 8rem; font-weight: 700; line-height: 1; letter-spacing: -.07em; text-transform: uppercase; white-space: nowrap; }
@keyframes footer-marquee { to { transform: translate3d(-50%, 0, 0); } }
.l-footer__main { display: grid; grid-template-columns: 1fr auto auto; gap: clamp(3rem, 8vw, 9rem); padding: 5rem var(--gutter); border-top: 1px solid rgba(0,0,0,.3); }
.l-footer__logo { width: min(23rem, 100%); filter: brightness(0); }
.l-footer__main > div:first-child p { margin-top: 2rem; font-family: var(--font-display); font-size: clamp(1.5rem, 3vw, 3rem); font-weight: 700; line-height: 1.05; text-transform: uppercase; }
.l-footer__nav { display: flex; flex-direction: column; font-size: 1.1rem; font-weight: 700; }
.l-footer__privacy { margin-top: 1.25rem; font-family: var(--font-ja); font-size: .72rem; font-weight: 500; }
.l-footer__social > p { margin-bottom: 1.5rem; font-size: .65rem; letter-spacing: .13em; text-transform: uppercase; }
.l-footer__social div { display: flex; flex-direction: column; gap: .8rem; }
.l-footer__social a { display: flex; align-items: center; gap: .8rem; font-weight: 700; }
.l-footer__social img { width: 2rem; height: 2rem; }
.l-footer__social small { display: block; margin-top: 1.5rem; font-size: .65rem; }
.l-footer__ai-note { width: 100%; padding: 1.5rem var(--gutter); border-top: 1px solid rgba(0,0,0,.3); font-size: .68rem; line-height: 1.7; }
.l-footer__ai-note p + p { margin-top: .15rem; }
.l-footer__ai-note p[lang="en"] { font-family: var(--font-ui); }
.l-footer__bottom { display: grid; grid-template-columns: 1fr 1fr auto; gap: 2rem; padding: 1rem var(--gutter); border-top: 1px solid rgba(0,0,0,.3); font-size: .6rem; letter-spacing: .12em; text-transform: uppercase; }

/* =========================
   Utility
========================= */
.u-sp-break { display: none; }

/* =========================
   Interaction
========================= */
.js-reveal { opacity: 0; transform: translateY(3rem); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.75,.25,1); }
.js-reveal.is-visible { opacity: 1; transform: none; }
@media (hover: hover) {
  .c-circle-link:hover { background: var(--color-lime); color: var(--color-black); }
  .l-header__links a:hover { font-style: italic; transform: translateX(1rem); }
  .l-header__social a:hover { background: var(--color-lime); }
  .c-arrow-link:hover { background: var(--color-lime); }
  .c-arrow-link:hover span { transform: translate(3px, -3px); }
  .p-page__detail-link:hover { border-color: var(--color-black); background: var(--color-lime); }
  .p-page__detail-link:hover span { transform: translate(3px, -3px); }
  .p-shop-purpose__item a:hover { border-color: rgba(0,0,0,.55); background: var(--color-lime); }
  .p-shop-purpose__item a:hover span { transform: translate(3px, -3px); }
  .p-shop-map__link:hover span { transform: translate(3px, -3px); }
  .p-repair__menu a:hover { background: var(--color-lime); }
  .p-repair__menu a:hover i { transform: translate(3px, -3px); }
  .p-repair__cta:hover { background: var(--color-lime); color: var(--color-black); }
  .p-contact__submit:hover { background: var(--color-lime); }
  .p-instagram__post:hover img { opacity: .82; transform: scale(1.035); }
  .l-footer a:hover { opacity: .55; }
}

/* =========================
   Responsive
========================= */
@media (min-width: 768px) {
  .p-category-hero { min-height: min(42rem, 70svh); padding-top: clamp(7.5rem, 10vw, 9rem); padding-bottom: 2.5rem; }
  .p-category-hero__body { margin-top: clamp(3rem, 6vw, 5rem); }
  .p-category-hero__body h1 { font-size: clamp(4.5rem, 10vw, 10rem); }
  .p-category-hero__intro { margin-top: clamp(2rem, 4vw, 3.5rem); }
  .p-repair__menu p { max-width: 34rem; }
  .p-page__section, .p-maintenance__section { width: 84%; }
  .p-page__section.p-restoration-guide { width: 100%; }
  .p-restoration-guide > .p-page__section-head, .p-restoration-guide__intro, .p-restoration-guide__services, .p-restoration-guide__flow { width: 84%; margin-right: auto; margin-left: auto; }
  .p-maintenance__table thead th { font-size: .72rem; }
  .p-maintenance__table th[scope="row"], .p-maintenance__table td { font-size: 1.6rem; }
  .p-maintenance__table small { font-size: .8rem; }
}

@media (max-width: 767px) {
  :root { --gutter: 1.15rem; --section-space: 6.5rem; }
  .l-header { grid-template-columns: 1fr auto auto; gap: .75rem; padding-top: 1rem; padding-bottom: 1rem; }
  .l-header__logo { width: min(9rem, 40vw); }
  .l-header__status { display: grid; }
  .l-header__status .js-workshop-status-label { white-space: nowrap; }
  .l-header__status small { display: block; max-width: 8.6rem; font-size: .45rem; white-space: normal; }
  .l-header__menu-label { display: none; }
  .l-header__menu { padding-left: .25rem; }
  .l-header__nav { display: flex; flex-direction: column; justify-content: center; }
  .l-header__links { margin-top: 2rem; }
  .l-header__links a { gap: .7rem; padding: .2em 0; font-size: clamp(1.8rem, 8.5vw, 3rem); letter-spacing: -.045em; }
  .l-header__link-number { min-width: 1.7rem; padding-top: .55em; font-size: .55rem; }
  .l-header__link-text small { margin-top: .35rem; font-size: .55rem; }
  .l-header__nav-note { writing-mode: horizontal-tb; }
  .p-hero__video { left: 50%; width: auto; min-width: 100%; max-width: none; transform: translateX(-50%); object-position: center; }
  .p-hero__hud { top: 9rem; }
  .p-hero__grid { background-size: 12vw 12vw; }
  .p-hero__content { padding-bottom: 5rem; }
  .p-hero__title { font-size: clamp(4.1rem, 25vw, 7rem); line-height: .76; }
  .p-hero__title span:nth-child(2) { margin-left: 0; -webkit-text-stroke-width: 1px; }
  .p-hero__bottom { display: block; margin-top: 2.5rem; }
  .p-hero__bottom > p { max-width: 20rem; font-size: .8rem; }
  .c-circle-link { width: 6.5rem; margin: 1.5rem 3.5rem 0 auto; }
  .p-hero__control { bottom: 1rem; }
  .p-brands__head p:last-child { display: none; }
  .p-brands__list li { width: 8.5rem; }
  .p-about { display: flex; min-height: 0; flex-direction: column; padding-top: 5rem; padding-bottom: 5rem; }
  .p-about__lead { margin: 3rem 0; writing-mode: horizontal-tb; }
  .p-about__copy { margin-top: 3rem; }
  .p-about__copy h2 { margin-bottom: 2.5rem; font-size: clamp(2.7rem, 13vw, 4.3rem); }
  .p-about__copy p { font-size: .9rem; }
  .p-about__archive { width: 100%; margin-top: 5rem; padding: 1.5rem 0 0; }
  .p-about__archive span { font-size: 36vw; }
  .p-about__archive-label, .p-about__archive-note { font-size: .5rem; }
  .p-about__archive-note { margin-top: 0; text-align: right; }
  .p-instagram__header { display: block; }
  .p-instagram__header > div { margin-top: 2.5rem; }
  .p-instagram__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-instagram__profile { margin-top: 3rem; }
  .p-about__aside { width: 100%; margin-top: 3rem; text-align: center; }
  .p-bikes__title { display: block; }
  .p-bikes__title h2 { margin-top: 3rem; font-size: 22vw; }
  .p-bikes__title > p:last-child { margin-left: 15%; }
  .p-bike-feature { min-height: 40rem; margin-bottom: 8rem; }
  .p-bike-feature img { width: 94%; aspect-ratio: 1.2; }
  .p-bike-feature--city img { margin-left: 6%; }
  .p-bike-feature__data { width: 94%; }
  .p-bike-feature--city .p-bike-feature__data { width: 94%; }
  .p-bike-feature__panel { right: 0; width: 88%; }
  .p-bike-feature--city .p-bike-feature__panel { left: 0; }
  .p-bike-feature__name { margin-bottom: 1.5rem; font-size: clamp(2.4rem, 13vw, 4rem); white-space: normal; }
  .p-bike-feature__body { padding: 2rem; }
  .p-bike-feature__body > p:first-child { margin-bottom: 1.5rem; }
  .p-restoration { min-height: 0; padding-top: 6rem; }
  .p-restoration__word { top: .35em; font-size: 19vw; }
  .p-restoration figure { width: 90%; }
  .p-restoration img { aspect-ratio: 16 / 10; }
  .p-restoration__body { position: relative; right: auto; bottom: auto; width: 92%; margin: -1rem 0 0 auto; padding: 2rem; }
  .p-restoration h3 { margin-top: 2rem; }
  .p-repair { display: block; }
  .p-repair__header h2 { margin-top: 3rem; font-size: 22vw; }
  .p-repair__header > p:last-child { margin-left: 15%; }
  .p-repair__visual { width: 88%; margin-top: 5rem; }
  .p-repair__visual img { aspect-ratio: 5 / 4; object-position: 58% center; }
  .p-repair__menu { margin-top: 6rem; }
  .p-repair__menu a { gap: .7rem; padding-right: .75rem; padding-left: .75rem; }
  .p-repair__cta { margin-right: 0; }
  .p-shop { display: block; }
  .p-shop__title h2 { margin: 3rem 0 5rem; font-size: 21vw; }
  .p-shop__image { width: 88%; }
  .p-shop__image > img { height: 31rem; }
  .p-shop__image--entrance > img { height: auto; }
  .p-shop__image > .p-shop__nearby-image { width: 82%; height: auto; }
  .p-shop__nearby-caption { width: 82%; }
  .p-shop__info { margin: 5rem 0 0 10%; }
  .p-shop__map iframe { height: 20rem; }
  .p-shop__info dl div { display: block; }
  .p-shop__info dd { margin-top: .4rem; }
  .p-category-hero { min-height: 42rem; }
  .p-category-hero__grid { background-size: 16vw 16vw; }
  .p-category-hero__body h1 { font-size: clamp(3rem, 14vw, 5rem); }
  .p-category-hero__intro { display: block; margin-top: 3rem; }
  .p-category-hero__intro p:last-child { margin-top: 1.5rem; font-size: .88rem; }
  .p-page__lead { display: block; }
  .p-page__lead > div { margin-top: 2.5rem; }
  .u-pc-break { display: none; }
  .u-sp-break { display: block; }
  .p-page__section-head { grid-template-columns: 2.5rem 1fr; gap: .75rem; }
  .p-page__section-head > span { display: none; }
  .p-page__timeline li, .p-page__profile div, .p-page__access li { grid-template-columns: 1fr; gap: .75rem; }
  .p-shop-purpose { grid-template-columns: 1fr; }
  .p-shop-purpose__item { min-height: 0; }
  .p-shop-purpose__item h3 { margin: 3rem 0 1.5rem; }
  .p-shop-first { grid-template-columns: 1fr; }
  .p-shop-first__visual { width: 88%; }
  .p-shop-first__visual img { aspect-ratio: 4 / 3; }
  .p-shop-map iframe { min-height: 22rem; aspect-ratio: 4 / 5; }
  .c-notice--split { display: block; }
  .c-notice--split > .c-index + div { margin-top: 2.5rem; }
  .p-about-gallery { grid-template-columns: 1fr; gap: 2.5rem; }
  .p-about-gallery li { width: 88%; }
  .p-about-gallery li:nth-child(even) { margin-left: auto; }
  .p-about-gallery li:nth-child(odd) { margin-right: auto; }
  .p-page__brands { grid-template-columns: 1fr; }
  .p-page__brand { min-height: 0; }
  .p-restoration-guide__intro { display: block; }
  .p-restoration-guide__intro > div { margin-top: 2.5rem; }
  .p-restoration-guide__subhead { grid-template-columns: 2.5rem 1fr; gap: .75rem; }
  .p-restoration-guide__subhead > span { display: none; }
  .p-restoration-guide__services ul { grid-template-columns: 1fr; }
  .p-restoration-guide__services li { min-height: 0; }
  .p-restoration-guide__services h4 { margin-top: 2rem; }
  .p-restoration-guide__flow ol { grid-template-columns: 1fr; border-bottom: 0; }
  .p-restoration-guide__flow li { display: grid; min-height: 0; grid-template-columns: 2.5rem 1fr; gap: 1rem; padding: 1.2rem 0; border-right: 0; border-bottom: 1px solid rgba(0,0,0,.24); }
  .p-restoration-guide__flow li:first-child { border-left: 0; }
  .p-restoration-guide__flow li:not(:last-child)::after { top: auto; right: auto; bottom: 0; left: 1rem; transform: translate(-50%, 50%) rotate(45deg); }
  .p-restoration-guide__flow span { margin-bottom: 0; }
  .c-cta { display: block; padding: 2rem; }
  .c-cta > .c-arrow-link, .c-cta__links { margin-top: 3rem; }
  .p-policy__date { width: 100%; }
  .p-maintenance__header { display: block; }
  .p-maintenance__header > div { margin-top: 2.5rem; }
  .p-maintenance__section-head { grid-template-columns: 2.5rem 1fr; gap: .75rem; }
  .p-maintenance__section-head span { display: none; }
  .p-maintenance__table-wrap { overflow-x: visible; }
  .p-maintenance__table { min-width: 0; table-layout: fixed; }
  .p-maintenance__table th:first-child { width: 68%; }
  .p-maintenance__table th, .p-maintenance__table td { padding: 1rem .75rem; }
  .p-contact__header { display: block; }
  .p-contact__header h1, .p-contact__header h2 { margin-top: 3rem; font-size: 20vw; }
  .p-contact__header > p:last-child { margin-left: 12%; }
  .p-contact__row { display: block; }
  .p-contact__choices { grid-template-columns: 1fr 1fr; }
  .p-contact__choices label:last-child { grid-column: 1 / -1; }
  .p-contact__agree { line-height: 1.5; }
  .p-contact__submit { margin-top: 3rem; }
  .l-footer__marquee p { font-size: 25vw; }
  .l-footer__main { display: block; padding-top: 3rem; }
  .l-footer__nav { margin: 4rem 0; }
  .l-footer__bottom { display: block; }
  .l-footer__bottom > * + * { margin-top: .5rem; }
  .l-footer__bottom a { display: block; margin-top: 1.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .p-brands__list[aria-hidden="true"] { display: none; }
  .p-category-hero__title-line.is-split .p-category-hero__title-char { opacity: 1; animation: none !important; }
  .js-reveal { opacity: 1; transform: none; }
}