/* Shared editorial rhythm. Loaded last on every page. */
:root{--section-space:88px;--column-gap:56px}
body{font-size:16px;line-height:1.9}
html{scroll-padding-top:100px}
body .wrap{width:calc(100% - 96px);max-width:1160px;padding-inline:0;margin-inline:auto}
body main>section:not(.service-hero):not(.c21-hero):not(.lp-company){padding-block:var(--section-space);scroll-margin-top:0}
body h1,body h2,body h3{letter-spacing:.02em;word-break:normal;overflow-wrap:break-word;text-wrap:initial}
body h2,body #dx h2,body .company h2,body .sale-lp h2{font-size:clamp(28px,2.8vw,38px);line-height:1.55;margin:0 0 28px;font-weight:500}
body h3{font-size:22px;line-height:1.6;margin:0 0 14px}
body .heading-phrase{display:inline;vertical-align:baseline;text-wrap:initial}
body p{line-height:1.9;text-wrap:initial;margin:0 0 20px}
body .prose{padding-top:0;max-width:640px}
body .prose p,body .step p,body .service p,body .section-top>p,body .service-needs p,body .page-hero p{font-size:16px;line-height:1.9}
body .prose p:last-child,body .step p:last-child,body .service p:last-child{margin-bottom:0}
body .eyebrow{font-size:12px;line-height:1.5;letter-spacing:.14em;margin-bottom:18px}
body .split,body .corporate-approach .split,body .message-layout{grid-template-columns:minmax(0,.95fr) minmax(0,1.15fr);gap:var(--column-gap);align-items:start}
body .section-top{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:start;gap:var(--column-gap);margin-bottom:40px}
body .section-top h2{margin-bottom:0}
body .section-top>p,body #dx .section-top>p,body .brands-section .section-top>p{max-width:100%;padding:0;margin:0}
body #business h2{margin-bottom:36px}
body .steps,body .strength-grid,body .service-needs{gap:32px}
body .strength-grid,body .service-needs{margin-top:36px}
body .step,body .strength-grid article,body .service-needs article{padding-top:24px}
body .number{margin-bottom:18px}
body .service{grid-template-columns:44px minmax(0,1fr) minmax(0,1.2fr);gap:28px;padding:32px 0}
body .service-info .service{grid-template-columns:36px minmax(0,.8fr) minmax(0,1.2fr)}
body .service h3{font-size:24px;line-height:1.6}
body .tag{margin-bottom:10px}
body .brand-panel{min-height:280px;padding:28px}
body .brand-logo-stage{margin-block:20px}
body .portfolio-bottom p{font-size:14px;line-height:1.8}
body .careers-word,body .philosophy-watermark,body .page-word{display:none}
body .corporate-message .prose{padding-left:32px}
body .message-signature{margin-top:32px;line-height:2}
body .workplace-points{margin:28px 0}
body .workplace-points h3{font-size:20px}
body .company .subtle{font-family:inherit;margin-top:0;line-height:1.9}
body .company dl div{padding:18px 0}
body .company dd{font-size:15px;line-height:1.9}
body .brand-hero{height:auto;min-height:620px;max-height:none}
body .brand-hero .hero-copy{padding:88px max(48px,calc((100vw - 1160px)/2));justify-content:center}
body .brand-hero h1{font-size:clamp(38px,4.5vw,64px);line-height:1.55;margin:0 0 30px;letter-spacing:.035em}
body .brand-hero h1 .heading-phrase{display:block;line-height:inherit}
body .brand-hero h1 wbr{display:none}
body .brand-hero .eyebrow{margin-bottom:28px}
body .hero-bottom{max-width:900px;gap:40px;align-items:end}
body .hero-bottom p{font-size:16px;max-width:520px;margin:0;line-height:1.9}
body .hero-signature{display:none}
body .page-hero{padding-block:72px}
body .page-hero h1{font-size:clamp(32px,3.5vw,48px);line-height:1.55;margin-bottom:24px}
body .service-lp .service-hero{padding-block:64px}
body .service-lp .refined-hero{padding-block:0}
body .service-hero .service-name{margin-bottom:18px}
body .service-hero h1{line-height:1.6;margin-block:18px 24px}
body .refined-hero .heading-phrase:first-child::after{display:none}
body .service-hero .button{margin-top:8px}
body .contact-page{padding-block:64px;gap:56px}
body .contact-heading h1{margin-top:18px;line-height:1.6}
body .contact-heading p{line-height:1.9}
@media(max-width:900px){
 :root{--section-space:60px;--column-gap:28px}
 body .wrap{width:calc(100% - 48px)}
 body .split,body .corporate-approach .split,body .message-layout,body .section-top{grid-template-columns:1fr;gap:24px}
 body .section-top{margin-bottom:32px}
 body .section-top>p,body #dx .section-top>p{margin:0;max-width:640px}
 body .corporate-message .prose{padding-left:0;border:0}
 body .brand-hero .hero-copy{padding:64px 24px}
 body .brand-hero{min-height:540px;height:auto;max-height:none}
 body .brand-hero h1{font-size:clamp(30px,6.3vw,46px)}
 body .page-hero{padding-block:56px}
 body .contact-page{gap:32px;padding-block:40px}
 body .strength-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
 :root{--section-space:52px}
 body .wrap{width:calc(100% - 40px)}
 body h2,body #dx h2,body .company h2,body .sale-lp h2,body .corporate-message h2{font-size:26px;line-height:1.6;margin-bottom:22px}
 body h3,body .service h3,body .strength-grid h3,body .approach-list h3{font-size:20px;line-height:1.6}
 body .eyebrow{font-size:12px;margin-bottom:14px}
 body .prose p,body .step p,body .service p,body .section-top>p,body .page-hero p{font-size:16px;line-height:1.9}
 body .steps,body .service-needs{grid-template-columns:1fr;gap:24px}
 body .service,body .service-info .service{grid-template-columns:28px minmax(0,1fr);gap:12px 16px;padding:26px 0}
 body .service>div:last-child,body .service-info .service>p{grid-column:2}
 body .service .number{font-size:22px;margin:3px 0 0}
 body .brand-panel{min-height:240px;padding:22px}
 body .brand-hero .hero-copy{padding:56px 20px}
 body .brand-hero{min-height:480px}
 body .brand-hero h1{font-size:clamp(29px,7.4vw,40px)}
 body .hero-bottom p{font-size:15px}
 body .service-lp .service-hero{padding-block:44px}
 body .service-lp .refined-hero h1,body .danchi-lp .service-hero h1,body .page-hero h1{font-size:30px;line-height:1.6}
 body .service-hero .service-name{font-size:16px}
 body .hero-guide{padding:24px}
 body .hero-guide h2{font-size:22px}
 body .contact-page{padding-inline:20px}
 body .contact-heading h1{font-size:28px}
 body .approach-list li{padding:20px 0}
 body footer{padding:36px 20px 28px}
}
body h2,body h3{text-wrap:balance}
body .split>div>h2:last-child,body .message-layout>div>h2:last-child{margin-bottom:0}
@media(max-width:600px){body .split,body .corporate-approach .split,body .message-layout{gap:20px}body .split>div>h2{margin-bottom:0}body .split>div>h2+p{margin-top:18px}}
/* Main visual: moderate spacing between headline, lead and edges. */
body .brand-hero{min-height:0}
body .brand-hero .hero-copy{padding-top:80px;padding-bottom:80px}
body .brand-hero h1{line-height:1.48;margin-bottom:34px}
body .brand-hero h1 .heading-phrase{line-height:inherit}
body .brand-hero .eyebrow{margin-bottom:28px}
@media(max-width:900px){body .brand-hero .hero-copy{padding-top:60px;padding-bottom:60px}}
@media(max-width:600px){body .brand-hero .hero-copy{padding-top:52px;padding-bottom:52px}body .brand-hero h1{line-height:1.5;margin-bottom:30px}body .brand-hero .eyebrow{margin-bottom:24px}}

/* Corporate footer uses the same mark and lockup as the header. */
body footer .footer-corporate-brand{display:flex;align-items:center;gap:10px;width:auto;padding:0;border:0;font-family:Arial,sans-serif;font-size:18px;font-weight:500;letter-spacing:.15em;line-height:1.1;color:#fff}
body footer .footer-corporate-brand .brand-mark{width:43px;height:43px;object-fit:contain;filter:brightness(0) invert(1)}
body footer .footer-corporate-brand small{display:block;font-family:'Noto Sans JP',sans-serif;font-size:10px;font-weight:400;letter-spacing:.15em;margin-top:9px;line-height:1.4}
@media(max-width:600px){body footer .footer-corporate-brand{font-size:16px;letter-spacing:.1em}body footer .footer-corporate-brand .brand-mark{width:35px;height:35px}body footer .footer-corporate-brand small{font-size:10px;letter-spacing:.07em}}