@charset "utf-8";

/* Search-focused lower pages. Uses the same colors, type and header behavior as the main site. */
.seo-page{background:var(--bg);color:var(--ink)}
.seo-page header,.seo-page header.solid{background:rgba(255,255,255,.96);border-bottom-color:var(--line);backdrop-filter:blur(14px) saturate(150%)}
.seo-main{padding-top:clamp(112px,11vw,150px)}
.seo-wrap{width:min(90vw,1060px);margin:0 auto}
.seo-crumb{display:flex;flex-wrap:wrap;gap:7px;font-size:11px;color:var(--sub);margin-bottom:24px}
.seo-crumb a{text-decoration:underline;text-underline-offset:3px}
.seo-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);gap:clamp(28px,5vw,72px);align-items:center;background:var(--panel);border-radius:var(--r);padding:clamp(28px,5vw,64px)}
.seo-kicker{font-family:var(--font-en);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;display:flex;align-items:center;gap:10px;margin-bottom:18px}
.seo-kicker::before{content:"";width:28px;height:3px;background:var(--accent)}
.seo-hero h1{font-size:clamp(30px,4.8vw,56px);letter-spacing:-.035em;line-height:1.28}
.seo-lead{font-size:clamp(14px,1.55vw,17px);line-height:2;margin-top:22px;max-width:42em}
.seo-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.seo-hero__media{background:var(--line-soft);overflow:hidden;border-radius:var(--r);aspect-ratio:4/3}
.seo-hero__media img{width:100%;height:100%;object-fit:cover}
.seo-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:24px}
.seo-fact{background:var(--panel);padding:18px}
.seo-fact b{display:block;font-size:14px;color:var(--ink-strong)}
.seo-fact span{display:block;font-size:12px;color:var(--sub);margin-top:4px;line-height:1.65}

.seo-section{padding:clamp(62px,8vw,104px) 0}
.seo-section--white{background:var(--panel)}
.seo-section--dark{background:var(--ink-strong);color:#fff}
.seo-section__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.75fr);gap:32px;align-items:end;margin-bottom:clamp(30px,4.5vw,52px)}
.seo-section h2{font-size:clamp(25px,3.6vw,42px);letter-spacing:-.025em;line-height:1.38}
.seo-section__intro{font-size:14px;line-height:1.95;color:var(--sub)}
.seo-section--dark .seo-section__intro{color:#c8c8c8}
.seo-prose{max-width:820px}
.seo-prose h2{margin-top:58px;margin-bottom:18px}
.seo-prose h2:first-child{margin-top:0}
.seo-prose h3{font-size:clamp(18px,2.2vw,24px);margin:34px 0 12px}
.seo-prose p{font-size:15px;line-height:2}
.seo-prose p+p{margin-top:15px}
.seo-prose ul,.seo-prose ol{margin:18px 0 0;padding-left:1.4em}
.seo-prose li{list-style:disc;font-size:14.5px;line-height:1.9;margin:7px 0}
.seo-prose ol li{list-style:decimal}
.seo-prose a,.seo-text-link{font-weight:700;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:3px;text-underline-offset:4px}

.seo-toc{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.seo-toc a{background:var(--panel);padding:17px 20px;font-size:13px;font-weight:700;transition:background .25s}
.seo-toc a:hover{background:var(--accent)}
.seo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,24px)}
.seo-grid--2{grid-template-columns:repeat(2,1fr)}
.seo-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:clamp(22px,3vw,34px)}
.seo-card__no{font-family:var(--font-num);font-size:11px;color:var(--sub);display:block;margin-bottom:12px}
.seo-card h3{font-size:clamp(18px,2.1vw,23px);line-height:1.5;margin-bottom:10px}
.seo-card p,.seo-card li{font-size:13.5px;line-height:1.9;color:var(--ink)}
.seo-card ul{padding-left:1.2em;margin-top:12px}
.seo-card li{list-style:disc;margin:5px 0}
.seo-note{border-left:4px solid var(--accent);background:var(--panel);padding:20px 24px;margin-top:28px;font-size:13.5px;line-height:1.9}
.seo-price{font-family:var(--font-ja);font-size:clamp(25px,3vw,36px);font-weight:700;line-height:1.2;margin:14px 0 8px;color:var(--ink-strong)}
.seo-price small{font-family:var(--font-ja);font-size:11px;color:var(--sub);font-weight:600}
.seo-table-wrap{overflow-x:auto;border-top:1px solid var(--ink-strong)}
.seo-table{width:100%;border-collapse:collapse;min-width:680px}
.seo-table th,.seo-table td{padding:18px 15px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;font-size:13.5px;line-height:1.8}
.seo-table th{font-weight:800;color:var(--ink-strong)}
.seo-table thead th{font-family:var(--font-en);font-size:11px;letter-spacing:.09em;color:var(--sub)}
.seo-steps{counter-reset:step;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.seo-step{counter-increment:step;background:var(--panel);padding:24px}
.seo-step::before{content:"STEP " counter(step,decimal-leading-zero);font-family:var(--font-num);font-size:10px;color:var(--sub)}
.seo-step h3{font-size:16px;margin:13px 0 8px}
.seo-step p{font-size:13px;line-height:1.85}
.seo-faq{border-top:1px solid var(--ink-strong)}
.seo-faq details{border-bottom:1px solid var(--line);padding:20px 2px}
.seo-faq summary{cursor:pointer;font-weight:800;font-size:15px;list-style:none;padding-right:34px;position:relative}
.seo-faq summary::after{content:"+";position:absolute;right:5px;top:0;font-family:var(--font-num);font-size:20px}
.seo-faq details[open] summary::after{content:"−"}
.seo-faq details p{font-size:14px;line-height:1.9;margin-top:14px;color:var(--ink)}
.seo-cta{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center}
.seo-cta h2{color:#fff}
.seo-cta p{font-size:14px;color:#c8c8c8;margin-top:12px;line-height:1.9}
.seo-cta .btn--ghost{color:#fff;border-color:#fff}
.seo-related{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.seo-related a{background:var(--panel);border:1px solid var(--line);padding:12px 16px;font-size:12.5px;font-weight:700}

.seo-footer-grid{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:clamp(20px,4vw,56px)}
.seo-footer-grid h2{font-size:18px;margin-bottom:10px}
.seo-footer-grid h3{font-family:var(--font-en);font-size:11px;letter-spacing:.12em;margin-bottom:12px}
.seo-footer-grid p,.seo-footer-grid a{display:block;font-size:12.5px;line-height:1.8;margin:6px 0}

@media(max-width:820px){
  .seo-hero{grid-template-columns:1fr;padding:24px}
  .seo-hero__media{order:-1}
  .seo-section__head{grid-template-columns:1fr}
  .seo-grid,.seo-grid--2{grid-template-columns:1fr}
  .seo-steps{grid-template-columns:1fr 1fr}
  .seo-cta{grid-template-columns:1fr}
  .seo-footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  .seo-main{padding-top:112px}
  .seo-facts,.seo-toc,.seo-steps{grid-template-columns:1fr}
  .seo-footer-grid{grid-template-columns:1fr}
  .seo-actions .btn{width:100%;justify-content:center}
}
