/* /partners and /ja/partners — layout only. Palette, type, bar, footer, buttons
   and the phone frame come from /site.css (linked after this by site_frame). */
* { box-sizing: border-box; }
body { margin: 0; font-size: 17px; line-height: 1.6; }
img { max-width: 100%; display: block; }
a { color: var(--pill-fg); }
.in { width: min(1080px, 100%); margin-inline: auto; padding-inline: 20px; }
.hp { position: absolute; left: -9999px; }

.hero .in { display: grid; grid-template-columns: 1.15fr .85fr; gap: 56px; align-items: center; padding-block: 48px 80px; }
.kicker { font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink); margin: 0 0 12px; }
.kicker.green { color: var(--matcha-2); }
:lang(ja) .kicker { letter-spacing: .06em; }
h1 { margin: 0; font-size: clamp(40px, 5.6vw, 68px); line-height: 1.02; }
:lang(ja) h1 { font-size: clamp(30px, 3.7vw, 46px); }
h1 .gold { color: var(--gold-icon); }
.lead { margin: 20px 0 0; color: var(--muted); font-size: 18.5px; max-width: 46ch; }
.cta-row { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 12px 18px; align-items: center; }
.cta-row small { color: var(--muted); font-size: 14.5px; }
.art { display: grid; justify-items: center; }
.art .site-phone { max-width: 280px; }

.nums-wrap { padding-bottom: 24px; }
.nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: -24px; }
.num { background: #fff; border: 1px solid var(--hair); border-radius: 24px; padding: 24px; }
.num .big { font-size: 46px; font-weight: 800; letter-spacing: -.04em; line-height: 1; color: var(--matcha-2); }
.num.gold { background: var(--gold-wash); border-color: transparent; }
.num.gold .big { color: var(--gold-icon); }
.num h3 { margin: 10px 0 4px; font-size: 18px; }
.num p { margin: 0; color: var(--muted); font-size: 15px; }

section.s { padding-block: 88px; }
h2 { margin: 0; font-size: clamp(30px, 3.6vw, 44px); line-height: 1.08; letter-spacing: -.03em; font-weight: 800; }
.sub { color: var(--muted); font-size: 17.5px; max-width: 52ch; margin: 14px 0 0; }
.split .in { display: grid; grid-template-columns: .85fr 1.15fr; gap: 64px; align-items: center; }
.tint { background: var(--paper); border-block: 1px solid var(--hair); }
.who { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.who span { background: var(--pale); color: var(--pill-fg); font-weight: 600; font-size: 14.5px; padding: 7px 14px; border-radius: 999px; }
.perk { margin-top: 24px; background: #fff; border: 1px solid var(--hair); border-radius: 20px; padding: 18px 20px; font-size: 15.5px; }
.perk b { display: block; font-size: 16.5px; margin-bottom: 2px; }
.steps { list-style: none; margin: 36px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; counter-reset: s; }
.steps li { background: #fff; border: 1px solid var(--hair); border-radius: 20px; padding: 20px; font-size: 15.5px; counter-increment: s; }
.steps li::before { content: counter(s); display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--pale); color: var(--pill-fg); font-weight: 700; font-size: 14px; margin-bottom: 12px; }

.apply .in { display: grid; grid-template-columns: .8fr 1.2fr; gap: 56px; align-items: start; }
form { background: #fff; border: 1px solid var(--hair); border-radius: 26px; padding: 28px; display: grid; gap: 16px; }
.row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
label { display: grid; gap: 6px; font-size: 14px; font-weight: 600; }
input, select, textarea { font: inherit; font-size: 16px; font-weight: 400; padding: 12px 14px; border-radius: 14px; border: 1.5px solid var(--hair); background: var(--paper); color: var(--deep); width: 100%; min-width: 0; }
textarea { min-height: 110px; resize: vertical; }
form .site-btn { justify-self: start; }
form .site-btn[disabled] { opacity: .6; }
.note { margin: 0; color: var(--muted); font-size: 13.5px; }
.note.err { color: var(--ink); }
.done { background: var(--pale); border-radius: 18px; padding: 18px; font-weight: 600; }
.faq-s { padding-top: 0 !important; }
.faq { margin: 30px 0 0; display: grid; gap: 12px; max-width: 760px; }
.faq div { background: #fff; border: 1px solid var(--hair); border-radius: 18px; padding: 18px 20px; }
.faq dt { font-weight: 700; }
.faq dd { margin: 4px 0 0; color: var(--muted); font-size: 15.5px; }

@media (max-width: 900px) {
  .hero .in, .split .in, .apply .in { grid-template-columns: 1fr; gap: 44px; }
  .nums { grid-template-columns: 1fr; margin-top: 0; }
  .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  section.s { padding-block: 64px; }
}
@media (max-width: 520px) { .steps, .row { grid-template-columns: 1fr; } form { padding: 20px; } }
