@charset "UTF-8";

:root {
    color-scheme: light;
    --ink: #000000;
    --paper: #ffffff;
    --muted: rgba(0, 0, 0, .64);
    --line: rgba(0, 0, 0, .16);
    --font-jp: "Noto Sans JP", sans-serif;
    --font-en: "automate", "Automate OT", "Space Grotesk", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 32px; }
body { isolation: isolate; margin: 0; background: var(--paper); color: var(--ink); font-family: var(--font-jp); font-size: 14px; line-height: 1.9; -webkit-font-smoothing: antialiased; overflow-wrap: break-word; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 5px; }
a:focus-visible { outline: 2px solid var(--ink); outline-offset: 6px; }
.latin { font-family: var(--font-en); }
.skip-link { position: absolute; top: -100px; left: 20px; padding: 8px 16px; background: var(--paper); z-index: 5; }
.skip-link:focus { top: 12px; }
.site-header { max-width: 1280px; margin: auto; padding: 27px 48px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.wordmark { font-size: 23px; font-weight: 700; letter-spacing: -.8px; }
.site-header nav { display: flex; align-items: center; gap: 30px; font-size: 12px; }
main { width: min(100% - 48px, 960px); margin: auto; text-align: center; }
h1, h2, h3, p { margin-top: 0; }
.hero { padding: 86px 0 90px; }
.page-watermark { position: fixed; z-index: -1; pointer-events: none; top: 50%; left: 50%; transform: translate(-50%, -50%); width: min(calc(100vw - 40px), 480px); max-height: 80vh; height: auto; object-fit: contain; opacity: .075; }
.eyebrow { color: var(--muted); font-size: 11px; font-weight: 400; letter-spacing: .16em; margin: 0 0 30px; }
h1 { font-size: clamp(30px, 4.5vw, 52px); font-weight: 500; line-height: 1.6; letter-spacing: .025em; margin-bottom: 30px; }
.hero-statement { font-size: clamp(25px, 3.5vw, 40px); line-height: 2; letter-spacing: .025em; margin-bottom: 22px; }
.hero-statement ruby { ruby-align: center; }
.hero-statement ruby .latin { font-size: 1.25em; line-height: 1; }
.hero-statement rt { font-family: var(--font-jp); font-size: 12px; font-weight: 500; letter-spacing: .12em; }
.hero-copy { line-height: 2.1; margin-bottom: 30px; }
.contact-button { display: inline-flex; align-items: center; gap: 36px; border: 1px solid var(--ink); background: var(--paper); padding: 12px 24px; font-size: 13px; }
.contact-button:hover { background: var(--ink); color: var(--paper); text-decoration: none; }
.section { border-top: 1px solid var(--line); padding: 70px 0; }
.section .eyebrow { margin-bottom: 16px; }
h2 { font-size: clamp(22px, 3vw, 30px); font-weight: 500; letter-spacing: .035em; margin-bottom: 18px; }
.section-intro { color: var(--muted); margin-bottom: 35px; }
.concern-list { max-width: 740px; margin: 42px auto 0; text-align: left; }
.concern-list article { display: grid; grid-template-columns: 42px 1fr; gap: 24px; padding: 28px 0; }
.concern-list article + article { border-top: 1px solid var(--line); }
.service-number { font-size: 14px; color: var(--muted); padding-top: 7px; }
h3 { font-size: 20px; line-height: 1.85; font-weight: 500; margin: 0 0 10px; }
.concern-list p { font-size: 13px; color: var(--muted); margin-bottom: 0; }
.text-link { font-size: 12px; border-bottom: 1px solid var(--ink); padding-bottom: 7px; }
.contact-section { padding: 75px 0 85px; }
.site-footer { border-top: 1px solid var(--line); text-align: center; padding: 32px 24px; font-size: 11px; }
.site-footer > .latin { font-size: 18px; font-weight: 400; }
.site-footer p { color: var(--muted); margin: 5px 0; }
.footer-note { display: inline-block; margin-top: 12px; padding: 4px 8px; font-size: 13px; }
.site-footer small { display: block; margin-top: 20px; color: var(--muted); font-size: 10px; }
@media (max-width: 600px) {
    .site-header { padding: 20px; flex-direction: column; gap: 10px; }
    .site-header nav { gap: 20px; font-size: 11px; }
    main { width: calc(100% - 40px); }
    .hero { padding: 52px 0 65px; }
    .hero-copy { font-size: 12px; }
    h1 { font-size: clamp(25px, 7vw, 38px); }
    .hero-statement { font-size: clamp(23px, 6vw, 32px); }
    .section { padding: 48px 0; }
    .concern-list { margin-top: 22px; }
    .concern-list article { grid-template-columns: 25px 1fr; gap: 12px; padding: 24px 0; }
    h3 { font-size: 17px; }
    .section-intro, .concern-list p { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Contact page: shared monochrome identity, readable form controls. */
.contact-page { padding: 64px 0 75px; }
.contact-heading .eyebrow { margin-bottom: 20px; }
.contact-heading h1 { font-size: clamp(24px, 3.6vw, 36px); margin-bottom: 20px; }
.contact-form-wrap { width: min(100%, 600px); margin: 42px auto 48px; text-align: left; }
.form-note { color: var(--muted); font-size: 12px; margin-bottom: 28px; }
.form-field { margin-bottom: 26px; }
.form-field > label { display: flex; align-items: center; gap: 12px; margin-bottom: 9px; font-size: 14px; font-weight: 500; }
.field-status { display: inline-block; font-size: 10px; font-weight: 400; color: var(--muted); border: 1px solid var(--line); padding: 0 6px; white-space: nowrap; }
.contact-form input:not([type="checkbox"]):not([type="hidden"]), .contact-form select, .contact-form textarea { display: block; width: 100%; min-width: 0; border: 1px solid rgba(0, 0, 0, .3); border-radius: 0; background: var(--paper); color: var(--ink); font: inherit; font-size: 16px; padding: 12px 14px; line-height: 1.6; }
.contact-form textarea { min-height: 190px; resize: vertical; }
.contact-form input::placeholder, .contact-form textarea::placeholder { color: var(--muted); opacity: 1; }
.contact-form input:focus-visible, .contact-form select:focus-visible, .contact-form textarea:focus-visible, .contact-form button:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.field-help { color: var(--muted); font-size: 11px; margin: 7px 0 0; }
.privacy-note { border-top: 1px solid var(--line); margin-top: 32px; padding-top: 26px; font-size: 12px; }
.privacy-note > p { color: var(--muted); margin-bottom: 20px; }
.privacy-check { display: flex; align-items: flex-start; gap: 10px; }
.privacy-check input { flex: 0 0 auto; width: 18px; height: 18px; margin: 4px 0 0; accent-color: var(--ink); }
.privacy-check label { cursor: pointer; }
.form-actions { margin-top: 36px; text-align: center; }
.form-actions button { font-family: inherit; cursor: pointer; min-height: 48px; }
.form-messages, .form-error-summary { border: 1px solid var(--ink); padding: 18px 22px; margin-bottom: 28px; background: var(--paper); font-size: 13px; }
.form-messages { list-style: none; }
.form-error-summary p { font-weight: 600; margin-bottom: 8px; }
.form-error-summary ul { margin: 0; padding-left: 20px; }
.form-error-summary a { text-decoration: underline; text-underline-offset: 3px; }
.contact-form .errorlist { list-style: none; padding: 0; margin: 8px 0 0; font-size: 12px; font-weight: 500; }
.contact-form .has-error input, .contact-form .has-error select, .contact-form .has-error textarea { border: 2px solid var(--ink); }
@media (max-width: 600px) {
    .contact-page { padding: 36px 0 52px; }
    .contact-form-wrap { margin-top: 30px; }
    .privacy-check label { font-size: 12px; }
}