/* White content surfaces and a lighter, consistent typographic voice. */
.service-visual img,.service-editorial:hover .service-visual img{filter:none;opacity:1;mix-blend-mode:normal;transition:transform .6s}
.svc-photo,.svc-card:hover .svc-photo,.sd-numcard-img,.sd-hero-grid img{filter:none;opacity:1;mix-blend-mode:normal;transition:none}
:root{--font-jp:'Zen Kaku Gothic New','Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;--font-jp-serif:var(--font-jp);--font-latin:'Manrope',Arial,sans-serif;--cream:#fff;--cream-deep:#fafafa;--surface:#fff;--sand:#f3f3f3;--taupe:#707070;--bark:#555;--ink-1:#202020;--ink-2:#555;--ink-3:#707070;--ink-4:#686868;--leaf:#252525;--leaf-bright:#454545;--leaf-deep:#202020;--leaf-soft:#dedede;--leaf-tint:#f5f5f5;--tascal-cyan:#252525;--tascal-cyan-deep:#202020;--tascal-cyan-soft:#dedede;--tascal-cyan-tint:#f5f5f5;--border-hair:#dedede;--border-input:#929292;--accent:#242424;--error:#ae2424}
body{background:#fff;color:#202020;font-family:var(--font-jp);font-weight:400;letter-spacing:.035em}h1,h2,h3{font-family:var(--font-jp);font-weight:500;letter-spacing:.06em}::selection{background:#d8d8d8;color:#111}.section-label{letter-spacing:.13em}.circle-arrow{border-color:#a4a4a4}.text-link{border-color:#999}.round-link,.text-link{font-weight:500}.display-en{font-weight:400;letter-spacing:-.055em}
/* Dark framing; fit the restored original wordmark without cropping its Latin line. */
.header-logo img{width:180px;height:58px;object-fit:contain;margin-inline:0}
.footer-logo{width:220px;height:70px;object-fit:contain;margin-inline:0}
@media(max-width:600px){.header-logo img{width:156px;height:48px}.footer-logo{width:190px;height:62px}}
#site-header,#site-header.scrolled,#site-header.open,#site-footer{background:#111;color:#f8f8f8;--ink-1:#f8f8f8;--ink-2:#b7b7b7;--ink-3:#aaa;--accent:#fff;border-color:#333}
.brand-caption{color:#b5b5b5;border-color:#555}.header-contact-btn,.mobile-contact-btn{background:#fff;color:#111}.header-contact-btn:hover,.header-contact-btn.active,.mobile-contact-btn:hover{background:#e8e8e8;color:#111}.nav-item-jp{font-weight:500}.mobile-menu{background:#111}.mobile-nav-item .en{color:#aaa}.mobile-tel .label{color:#aaa}.mobile-tel .num{color:#fff}.header-logo img,.footer-logo{mix-blend-mode:screen}.footer-address,.footer-tel-note,.footer-col-label{color:#aaa}.footer-col a{color:#ddd}.footer-tel-num{color:#fff}.footer-signature{color:#303030;font-weight:500}.footer-bottom{color:#aaa}
.back-to-top,.back-to-top.on-dark{background:#202020;color:#fff;border:1px solid #777}.back-to-top:hover{background:#444;color:#fff}.preview-tag{background:#fff;color:#555;border-color:#d0d0d0}
/* Homepage: white surfaces, neutral ink, and restrained rules. */
.service-strip,.home-services,.home-company,.home-contact{background:#fff;color:#202020;--ink-1:#202020;--ink-2:#555;--ink-3:#707070;--accent:#242424;--border-hair:#dedede}
.service-strip{border-color:#ddd}.service-strip span{color:#222}.service-strip p{color:#666}.service-strip i{color:#999}.service-strip a{color:#222}.home-services,.home-company,.home-contact{border-top:1px solid #e0e0e0}.section-jp{color:#555}.home-services a:hover{color:#555}.service-editorial{color:#222}.service-visual{background:#f5f5f5}.service-index{background:#fffffff0;color:#333}.service-editorial>p{color:#666}.service-english,.value-no,.value-en{color:#707070}.service-heading h3{font-weight:500}.philosophy-grid h2{font-weight:500;letter-spacing:.065em}.values-grid h3{font-weight:500}.business-split .business-note,.partner-list .partner-no,.partner-list p{color:#707070}.company-table .row,.company-table .row:last-child{border-color:#ddd}.company-table dt{color:#666}.company-table dd{color:#222}
.home-contact .section-label{color:#666}.home-contact .section-label>span:first-child::before{background:#222}.contact-display{color:#202020;border-color:#ccc;font-weight:400}.contact-display:hover{color:#555}.contact-bottom p,.contact-bottom span{color:#666}.contact-bottom a{color:#222}
/* Subpages and forms use the same neutral palette. */
body:not([data-page="home"]) .page-hero,.sd-hero{background:#fff!important;border-bottom:1px solid #e0e0e0}.page-hero-en{color:#777;font-weight:400}.page-hero-h1,.sec-h2,.sd-h2,.r-h2,.b-h2,.g-h2,.access-h2{font-weight:500}.page-hero-lead{color:#555}.eyebrow-jp::before{background:#555}.quick-card:hover,.related-card:hover{background:#f7f7f7}.feature-no,.svc-card-num{color:#666}.btn-primary,.btn-cyan{background:#222;color:#fff}.btn-primary:hover,.btn-cyan:hover{background:#444;color:#fff}.btn-ghost{color:#222;border-color:#888}.btn-ghost:hover{background:#222;color:#fff}.pkg-tag{background:#f3f3f3;color:#444}.info-row dt,.detail-row dt{color:#666}.info-row dd,.detail-row dd{color:#222}.form-box{background:#fff}.input,select.input,select option{background:#fff;color:#222;border-color:#999}.input::placeholder{color:#777}.chip{background:#fff;color:#555;border-color:#999}.chip:has(input:checked){background:#222;color:#fff}.preview-form-note,.preview-form-result{background:#fff;border-color:#bbb;color:#555}.portrait,.portrait::after{background-color:#111!important;border-color:#444}
/* The middle scene is now white; photo scenes keep neutral black overlays. */
.hero-story{background:#fff}.main-hero{--accent:#fff;--ink-1:#fff;--ink-2:#e5e5e5;color:#fff;background:#111}.hero-shade{background:linear-gradient(90deg,#0d0d0deb 0%,#0d0d0dad 30%,#0d0d0d0f 68%),linear-gradient(0deg,#0d0d0d94,transparent 30%)}.eyeline,.hero-side-note{color:#d5d5d5}.hero-description{color:#e0e0e0;font-weight:400;letter-spacing:.06em}.hero-content .round-link{color:#fff;font-weight:500}.story-slide .hero-content h1,.story-slide .hero-content h2{font-family:var(--font-jp);font-weight:500;letter-spacing:.055em;color:#fff;line-height:1.45}.story-organize{background:#fff;color:#202020;--accent:#222;--ink-1:#222;--ink-2:#555}.story-organize .hero-content h2{color:#202020}.story-organize .eyeline,.story-organize .hero-description{color:#555}.story-organize .round-link{color:#222}.story-organize .circle-arrow{border-color:#999}.story-organize .round-link:hover .circle-arrow{color:#fff;background:#222}.story-photo-large,.story-photo-small{filter:grayscale(1)}.story-photo-composition::after{background:linear-gradient(90deg,#fffffff5 0%,#ffffff66 38%,transparent 65%)}.story-photo-caption{color:#666}.story-reuse .hero-shade{background:linear-gradient(90deg,#101010f0,#10101088 46%,#10101020 80%),linear-gradient(0deg,#101010a0,transparent 40%)}
.story-controls{color:#ddd}.story-pagination button{color:#b5b5b5}.story-pagination button[aria-current]{color:#fff}.story-pagination button[aria-current]::after,.story-progress>span{background:#fff}.story-progress{background:#ffffff55}.story-skip{color:#ddd}
@media(max-width:600px){.story-slide .hero-content h1,.story-slide .hero-content h2{font-weight:500;letter-spacing:.025em;line-height:1.45}.hero-shade{background:linear-gradient(90deg,#0a0a0ac9,#0a0a0a3d),linear-gradient(0deg,#0a0a0aad,transparent 55%)}.story-photo-large,.story-photo-small{filter:grayscale(1)}.story-photo-composition::after{background:linear-gradient(180deg,#fff 0%,#fffffff0 33%,#ffffff11 75%)}.philosophy-grid h2{letter-spacing:.045em}.service-heading h3{font-weight:500}.hero-description{letter-spacing:.02em}}

/* Use built-in filters on mobile too; no external SVG filter dependency.
   Coincident shadows lift the source PNG's translucent ink, without a glow. */
.header-logo img,.footer-logo,.portrait::after{
  -webkit-filter:brightness(0) invert(1) sepia(.12) drop-shadow(0 0 0 #faf8f0) drop-shadow(0 0 0 #faf8f0) drop-shadow(0 0 0 #faf8f0);
  filter:brightness(0) invert(1) sepia(.12) drop-shadow(0 0 0 #faf8f0) drop-shadow(0 0 0 #faf8f0) drop-shadow(0 0 0 #faf8f0);
  mix-blend-mode:normal;
}
.portrait::after{background-color:transparent!important}

/* Readable typography across the homepage and all information pages.
   rem sizes respect the reader's default font size; keep the existing palette. */
:root{
  --type-body:1.125rem;
  --type-copy:1rem;
  --type-small:.875rem;
  --type-label:.8125rem;
}
body{font-size:var(--type-body)}
.round-link,.text-link,.section-intro .text-link,.recruit-link,.btn{font-size:var(--type-copy)}
.section-label{font-size:var(--type-small);gap:16px;flex-wrap:wrap}
.brand-caption{font-size:.75rem}
.nav-item-jp,.header-contact-btn{font-size:var(--type-copy);white-space:nowrap}
.header-nav{gap:22px}
.header-contact-btn{gap:16px}
.mobile-nav-item .jp{font-size:1.25rem}
.mobile-nav-item .en,.mobile-tel .label{font-size:var(--type-label)}
.mobile-contact-btn{font-size:1.125rem}
.mobile-tel .num{font-size:1.875rem}
.mobile-nav-item{min-height:56px}

/* Homepage copy, card descriptions, and company information. */
.service-strip span,.service-strip p{font-size:var(--type-small)}
.service-strip>.container{padding-block:20px;flex-wrap:wrap;gap:12px 28px}
.service-strip p{line-height:1.9}
.large-copy{font-size:1.375rem;line-height:2}
.philosophy-grid p:not(.large-copy),.business-split p,.company-split>div>p{font-size:var(--type-body);line-height:2}
.values-grid h3,.partner-list h3{font-size:1.25rem}
.values-grid p,.partner-list p,.business-split .business-note{font-size:var(--type-copy);line-height:1.9}
.value-no,.value-en,.partner-list .partner-no,.service-index,.service-english{font-size:var(--type-label)}
.section-jp{font-size:var(--type-body)}
.service-heading h3{font-size:1.5rem}
.service-editorial>p{font-size:var(--type-copy);line-height:1.95;max-width:100%}
.company-split h3{font-size:1.625rem}
.company-table .row{font-size:var(--type-copy);grid-template-columns:100px minmax(0,1fr);gap:24px}
.home-recruit h2{font-size:2.125rem}
.home-recruit p,.contact-bottom p{font-size:var(--type-copy)}
.contact-bottom span{font-size:var(--type-small)}
.contact-bottom a{font-size:2.125rem}

/* Subpage copy and controls share the same readable scale. */
.eyebrow-jp,.related-en,.svc-group-en,.svc-card-en,.pkg-en,.pos-en,
.strength-no,.feature-no,.info-label,.thanks-en,.nf-label,.nf-quick-label span,.nf-quick-en{font-size:var(--type-label)}
.breadcrumb{font-size:var(--type-small)}
.page-hero-lead,.r-lead-p,.b-lead-p,.greeting-p,.history-lead,.tl-body,.nf-p{font-size:var(--type-body)}
.sd-hero-lead{font-size:var(--type-body)!important}
.greeting-intro{font-size:1.25rem}
.greeting-sign{font-size:var(--type-body)}
.info-row dt,.info-row dd,.detail-row dt,.detail-row dd{font-size:var(--type-copy)}
.quick-card p,.svc-card-short,.svc-banner p,.concern-text,.feature p,.strength p,
.pkg-body,.pos p,.flow-item p,.b-cta p,.apply-p,.privacy-intro,.privacy-sec p,
.info-callout p,.thanks p,.map-link,.info-mail,.nf-quick-jp{font-size:var(--type-copy)}
.pkg-use,.pkg-tag,.pos-type,.tl-month,.privacy-foot,.info-note,.req,.opt,
.preview-form-note{font-size:var(--type-small)}
.quick-card h3,.svc-card-title,.svc-banner h3,.pkg h3{font-size:1.625rem}
.feature h3,.related-card h3,.strength h3,.pos h3,.flow-item h3,.privacy-sec h2{font-size:1.375rem}
.svc-group-h2{font-size:1.875rem}
.info-callout-title{font-size:1.125rem}
.form label.field-label,.chip,.form .privacy-row,.preview-form-result{font-size:var(--type-copy)}
.input{font-size:var(--type-body)}
.form .privacy-row{align-items:flex-start}
.privacy-row input{flex-shrink:0;margin-top:.5em}
.info-row dd,.detail-row dd{min-width:0;overflow-wrap:anywhere}

/* Footer information remains readable at both desktop and phone widths. */
.footer-address,.footer-col a{font-size:var(--type-copy)}
.footer-tel-note{font-size:var(--type-small)}
.footer-col-label,.footer-bottom{font-size:var(--type-label)}
.footer-tel-num{font-size:1.625rem}
.footer-col a{display:inline-block;padding-block:3px}
.footer-bottom{flex-wrap:wrap;gap:16px}
.footer-bottom-links{flex-wrap:wrap}
.footer-bottom-links a{font-size:var(--type-small)}

/* Photo story: enlarge copy independently of the decorative image rail. */
#hero-story :is(.hero-content,.gallery-copy) :is(h1,h2){font-size:clamp(38px,4vw,70px)}
#hero-story .gallery-copy h2{font-size:clamp(36px,3.8vw,64px)}
#hero-story #story-reuse h2{font-size:clamp(42px,4.9vw,82px)}
#hero-story :is(.hero-content,.gallery-copy) .eyeline{font-size:.75rem;letter-spacing:.12em}
#hero-story :is(.hero-content,.gallery-copy) .hero-description{font-size:var(--type-copy);line-height:2;letter-spacing:.035em}
#hero-story :is(.hero-content,.gallery-copy) .round-link{font-size:var(--type-copy);letter-spacing:.035em}
#hero-story .hero-side-note,#hero-story .gallery-caption{font-size:.75rem}
#hero-story .story-pagination button,#hero-story .story-skip,#hero-story .story-scroll-hint{font-size:var(--type-label)}
#hero-story .gallery-copy .hero-description{padding-left:3em}
#hero-story .gallery-copy .round-link{margin-left:3em}

@media(max-width:1280px){
  .brand-caption{display:none}
  .header-inner{gap:20px;padding-inline:28px}
  .header-nav{gap:18px}
}
@media(max-width:1050px) and (min-width:901px){
  .header-inner{gap:16px;padding-inline:22px}
  .header-logo img{width:156px}
  .header-nav{gap:14px}
  .header-contact-btn{padding-inline:12px;gap:10px}
}
@media(max-width:1150px){
  #hero-story .hero-content>.hero-description{bottom:20%}
  #hero-story .hero-content>.round-link{left:0;right:auto;bottom:10%}
  .values-grid{grid-template-columns:1fr}
  .values-grid article{grid-template-columns:28px minmax(0,1fr) auto;gap:16px}
  .value-en{grid-column:3;margin-top:7px}
}
@media(max-width:900px){
  #hero-story :is(.hero-content,.gallery-copy) :is(h1,h2){font-size:clamp(36px,4.5vw,48px)}
  #hero-story .gallery-copy .hero-description{padding-left:0;margin-left:0}
  #hero-story .gallery-copy .round-link{margin-left:0}
  .home-recruit>a{flex-wrap:wrap}
  .home-recruit h2{font-size:1.875rem}
}
@media(max-width:600px){
  :root{--type-body:1rem}
  .header-inner{padding-inline:22px}
  .section-label{font-size:var(--type-small);letter-spacing:.04em;gap:8px}
  .large-copy{font-size:1.1875rem}
  .values-grid article{grid-template-columns:24px minmax(0,1fr);gap:8px 12px}
  .value-en{grid-column:2;text-align:left;margin-top:4px}
  .values-grid h3,.partner-list h3{font-size:1.1875rem}
  .company-table .row{grid-template-columns:80px minmax(0,1fr);gap:16px}
  .company-split h3{font-size:1.5rem}
  .home-recruit h2{font-size:1.75rem}
  .footer-grid{column-gap:20px}
  .footer-col a{font-size:.9375rem}
  .footer-col-label{letter-spacing:.08em}
  .page-hero-lead{line-height:1.95}
  .info-row,.detail-row{grid-template-columns:1fr!important;gap:8px!important}
  .svc-group-h2{font-size:1.625rem}
  .svc-banner h3{font-size:1.375rem}
  .chip{padding:8px 12px}
  #hero-story .hero-content,#hero-story #story-reuse .hero-content{
    width:calc(100% - 44px);justify-content:center;padding:64px 0 100px;
  }
  #hero-story :is(.hero-content,.gallery-copy) :is(h1,h2),#hero-story #story-reuse h2{
    font-size:clamp(30px,8.5vw,46px);line-height:1.75;letter-spacing:.08em;
  }
  #hero-story .hero-content>.hero-description{position:static;margin:28px 0 18px}
  #hero-story .hero-content>.round-link{position:static}
  #hero-story :is(.hero-content,.gallery-copy) .eyeline{font-size:.75rem;margin-bottom:20px;letter-spacing:.08em}
  #hero-story .hero-side-note{left:22px;top:24px;font-size:.6875rem}
  #hero-story .gallery-copy{top:24%;width:36%}
  #hero-story .gallery-copy h2{font-size:8vw;letter-spacing:.05em}
  #hero-story .gallery-copy .hero-description{font-size:var(--type-copy);margin:24px 0 16px;line-height:1.9}
  #hero-story .gallery-copy .round-link{margin-left:0}
  #hero-story .gallery-caption{font-size:.6875rem}
  #hero-story .story-pagination button{width:32px;min-height:44px}
  #hero-story .story-skip{min-height:44px;align-items:center}
  #hero-story .story-controls{bottom:10px}
}
/* Short viewports and motion-free layouts must grow with the larger copy. */
@media(max-height:700px) and (min-width:601px){
  #hero-story .hero-content,#hero-story #story-reuse .hero-content{justify-content:center;padding:36px 0 80px}
  #hero-story :is(.hero-content,.gallery-copy) :is(h1,h2),#hero-story #story-reuse h2{font-size:clamp(30px,5.5svh,40px);line-height:1.55}
  #hero-story .hero-content>.hero-description{position:static;margin:18px 0 12px;line-height:1.8}
  #hero-story .hero-content>.round-link{position:static}
  #hero-story .gallery-copy{top:18%}
}
@media(max-width:600px) and (max-height:700px){
  #hero-story .hero-content,#hero-story #story-reuse .hero-content{padding:50px 0 70px}
  #hero-story .hero-content>.hero-description{margin-top:18px;line-height:1.8}
  #hero-story .gallery-copy{top:20%}
}
#hero-story:not(.is-scroll-story) .story-slide:not(.story-gallery){height:auto;min-height:var(--story-height)}
#hero-story:not(.is-scroll-story) .hero-content,#hero-story:not(.is-scroll-story) #story-reuse .hero-content{height:auto;padding:80px 0}
#hero-story:not(.is-scroll-story) .hero-content>.hero-description{position:static;margin:28px 0 20px}
#hero-story:not(.is-scroll-story) .hero-content>.round-link{position:static}