/* Mobile layout uses the approved art and text, at readable sizes rather than a scaled desktop canvas. */
@media(max-width:1023px){
  html{scroll-padding-top:80px}
  body{font-size:16px}
  /* Mobile header shows the company wordmark only; the footer retains RECRUIT SITE. */
  .brand{--hu:1px;width:min(164px,calc(100% - 200px));max-width:none;height:72px;padding:12px 10px;gap:7px;border-radius:0 0 16px 0}
  .brand img{width:0;min-width:0;flex:1;height:auto}
  .brand .brand-caption{display:none}
  .brand-caption{font-size:clamp(6.5px,2vw,8.5px);line-height:1.05;letter-spacing:.06em}
  .header-bar{--hu:1px;top:16px;left:auto;right:12px;transform:none;width:168px;max-width:none;height:44px;gap:12px}
  .global-nav{display:none}
  .entry-link{width:112px;height:44px;padding:0;font-family:Arial,sans-serif;font-size:15px;font-weight:800;letter-spacing:.12em;gap:0}
  .entry-link-arrow{display:none}
  .menu-toggle{width:44px;height:44px;margin:0;border-color:var(--navy);background:#fff;color:var(--navy)}
  .menu-toggle svg{width:20px;height:20px}
  .site-menu{top:60px;left:auto;right:0;width:min(660px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 96px);margin:0;padding:18px 24px 24px}
  .site-menu a{font-size:18px}

  .opening,.motion .opening{--cu:1px;--card-top:0px;height:auto}
  .stage,.motion .stage{--u:calc(min(180cqw,900px) / 1440);position:relative;top:auto;height:clamp(640px,168vw,800px);overflow:hidden}
  .hero-world,.motion .hero-world{left:50%;top:190px;width:calc(1440*var(--u));height:calc(900*var(--u));transform:translateX(-50%) !important;transform-origin:50% 0;will-change:auto}
  .company-ground{display:none}
  .hero-land,.hero-office{display:none}
  .opening-copy{position:static;height:auto}
  .hero{top:0;height:620px}
  .hero-title{left:max(24px,calc(50% - 300px));top:125px;gap:10px;font-size:clamp(24px,6.35vw,34px)}
  .hero-title .label{border-width:1.5px;padding:.22em .2em}
  .hero-title .label-lg{font-size:clamp(31px,8.4vw,44px)}
  .scene-anchor{position:relative;top:0;height:0}
  .company-card{position:relative;left:auto;top:auto;width:auto;max-width:668px;margin:0 auto;padding:18px 24px 0}
  .company-hand{width:min(280px,82vw);margin:0 0 32px;height:auto}
  .company-card .eyebrow{font-size:14px;line-height:1.5;letter-spacing:.06em}
  .company-title{margin-top:18px;font-size:clamp(26px,6.9vw,34px);line-height:1.5}
  .company-title span{white-space:normal}
  .company-body{margin-top:24px;font-size:16px;line-height:1.95}
  .company-body span{display:inline;white-space:normal}
  .company-body .company-invitation{display:block;margin-top:24px}
  .company-disc{--mu:1px;width:120px;height:120px;margin-top:32px}
  .company-disc-arrow{width:24px;height:34px}

  .jobs{--u:1px;padding:76px 0 40px}
  .jobs-frame{width:calc(100% - 48px);max-width:600px;margin:auto;padding:0}
  .jobs-head{position:relative;height:200px}
  .jobs-word{left:-10px;top:0;font-size:112px;-webkit-text-stroke-width:1px}
  .jobs-caption{left:132px;top:89px;padding:5px 10px;font-size:12px;border-width:1px}
  .jobs-title{top:138px;right:0;writing-mode:horizontal-tb;padding:8px 16px;font-size:28px;line-height:1.2;border-width:1.5px}
  .jobs-list{grid-template-columns:1fr;gap:46px;margin-top:28px}
  .job{--row:180px;--art:210px;padding-top:var(--row)}
  .job-card{--fold:24px;display:flex;flex-direction:column;gap:16px;padding:28px 24px 24px}
  .job-name{font-size:26px;line-height:1.35;min-height:0}
  .job-note{font-size:13px;line-height:1.4}
  .job-tag{padding:4px 12px}
  .job-text{font-size:16px;line-height:1.85}
  .job-text span{display:inline}
  .job-link{min-height:48px;margin-top:4px;padding:0 18px;font-size:15px}
  .job-link:before{width:22px}
  .job-link .arrow{width:22px;height:15px}

  .people{--u:1px;padding:8px 0 40px}
  .people-lines{display:none}
  /* Short curves stay in dedicated gaps: after the marquee and below all carousel controls. */
  .people-mobile-line{display:block;position:absolute;left:0;width:100%;height:24px;fill:none;stroke:var(--navy);stroke-width:1;opacity:.38;pointer-events:none}
  .people-mobile-line path{vector-effect:non-scaling-stroke}
  .people-mobile-line-top{top:116px}
  .people-mobile-line-bottom{bottom:-32px}
  .people-frame{width:100%;height:auto;padding-top:144px}
  .people-head{top:144px}
  .people-caption{font-size:13px;line-height:1.5}
  .people-caption:before,.people-caption:after{height:18px;width:1.5px}
  .people-caption:before{left:-20px}.people-caption:after{right:-20px}
  .people-title{font-size:30px;margin-top:10px;padding:7px 22px;border-width:1.5px}
  .marquee-track{--mu:1px;font-size:112px;line-height:1;letter-spacing:.07em;-webkit-text-stroke-width:1px}
  .marquee-group{gap:40px;padding-right:40px}
  .people-word{left:-60px;top:0}
  .pc{--slide-width:min(calc(100vw - 64px),390px);position:relative;inset:auto;padding-top:116px}
  .pc-stage,.pc.is-carousel .pc-stage{position:relative;left:0;top:0;width:100%;height:514px;margin:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:calc((100vw - var(--slide-width)) / 2);scrollbar-width:none;overscroll-behavior-x:contain}
  .pc-stage::-webkit-scrollbar{display:none}
  .pc-track,.pc.is-carousel .pc-track{position:relative;display:flex;width:max-content;height:auto;gap:16px;padding:0 calc((100vw - var(--slide-width)) / 2)}
  .pc-slide,.pc.is-carousel .pc-slide{--u:calc(var(--slide-width) / 600);position:relative;left:auto;top:auto;flex:none;width:var(--slide-width);height:510px;scroll-snap-align:center;will-change:auto}
  .pc-face{--u:calc(var(--slide-width) / 510);left:0;top:28px;width:100%;height:310px;border-radius:6px;box-shadow:0 5px 14px rgba(9,43,67,.1)}
  .pc-tag{right:12px;top:18px;padding:10px 7px;font-size:14px;border-width:1.5px}
  .pc-paper,[data-person="aoki"] .pc-paper{--fold:22px;left:12px;top:284px;width:calc(100% - 12px);min-height:192px;padding:22px 20px 18px;row-gap:16px;opacity:1}
  .pc-paper:before{border-width:1.5px}
  .pc-quote{font-size:20px;line-height:1.5;letter-spacing:.01em}
  .pc-quote span{white-space:normal}
  [data-person="yamamoto"] .pc-quote{font-size:clamp(19px,5.12vw,20px)}
  .pc-mobile-break{display:block}
  .pc-who{flex-direction:column;align-items:flex-start}
  .pc-name{font-size:18px;line-height:1.3}
  .pc-role{margin:5px 0 0;padding:0;border:0;font-size:12px;line-height:1.45;white-space:normal}
  .pc-link{width:44px;height:44px;margin-left:10px}
  .pc-link .arrow{width:22px;height:22px}
  .pc.is-carousel .pc-slide:not(.is-current) .pc-paper{pointer-events:auto}
  .pc:not(.is-photo) .pc-card:hover .pc-photo{opacity:0}
  .pc:not(.is-photo) .pc-card:hover .pc-portrait{opacity:1}
  .pc-card:not(.is-photo-ready) .pc-photo{opacity:0}
  .pc-card:not(.is-photo-ready) .pc-portrait{opacity:1}
  [data-person="yamamoto"] .pc-photo{--px:24;--py:47;--pw:475}
  [data-person="aoki"] .pc-photo{--px:-7;--py:24;--pw:520}
  .pc-controls{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:500px;margin:10px auto 0;padding:0 24px}
  .pc-controls[hidden]{display:none}
  .pc-count{position:static;transform:none;font-size:13px;gap:6px}
  .pc-count:before,.pc-count:after{display:none}
  .pc-now{font-size:16px}
  .pc-buttons{position:static;gap:8px}
  .pc-btn{width:44px;height:44px;border-width:1.5px}
  .pc-btn svg{width:18px;height:18px}
  .pc-btn:disabled{opacity:.35;cursor:default;background:#fff;color:var(--navy)}
  .pc-photo-btn{display:block;height:44px;padding:0 12px;font-size:13px;border-width:1.5px}

  .social{--u:1px;padding:72px 0 28px}
  .social:after{height:330px}
  .social-photo{--fade:240px}
  .social-photo img{object-position:46% 60%}
  .social-photo:after{background:linear-gradient(180deg,rgba(5,31,46,.08),rgba(5,31,46,.38) 22%,rgba(5,31,46,.3) 35%,rgba(5,31,46,.08) 65%,transparent)}
  .social-frame{width:100%;max-width:660px;height:auto;padding:0 24px}
  .social-head{display:flex;flex-direction:column}
  .social-hand{position:static;order:-1;width:250px;margin:0 0 36px}
  .social-title{position:static;font-size:clamp(28px,7.5vw,38px);line-height:1.6;letter-spacing:.02em}
  .social-title span{white-space:normal}
  .social-lead{position:relative;left:auto;top:auto;margin:24px 0 0;font-size:16px;line-height:1.85;letter-spacing:0}
  .social-lead span{display:inline;white-space:normal}
  .social-lead:before{inset:-35px -15px;background:radial-gradient(closest-side,rgba(9,43,67,.3),transparent)}
  .spread{position:relative;inset:auto;display:flex;flex-direction:column;align-items:flex-start;gap:28px;margin-top:52px;pointer-events:auto}
  .proof{--title-row:54;--body-row:70;--copy-gap:8;position:relative;left:auto;top:auto;width:min(342px,100%);height:auto;aspect-ratio:1;padding:28px;grid-template-rows:18px 34px auto 44px;row-gap:8px;flex:none}
  .proof-hulic{--title-row:52;--body-row:44;width:min(288px,calc(100% - 24px));padding:24px;grid-template-rows:18px 34px auto 44px;row-gap:8px}
  .proof-ppa{left:auto;top:auto;margin-left:auto}
  .proof-tag{font-size:12px;line-height:1.5;letter-spacing:.04em}
  .proof-hulic .proof-wordmark{font-size:29px}
  .proof-logo{gap:10px}
  .proof-smbc{height:30px}.proof-tepco{height:22px}.proof-cross{font-size:16px}
  .proof-title,.proof-hulic .proof-title{font-size:18px;line-height:1.45;letter-spacing:0;text-align:center}
  .proof-body{font-size:14px;line-height:1.6}
  .proof-hulic .proof-body{font-size:13px}
  .proof-source{min-height:44px;padding:0;font-size:13px;gap:6px}
  .proof-ext{width:12px;height:12px}
  .proof-orbit text{font-size:14px;letter-spacing:2.4px}
  .social-marquee{height:124px;margin-top:52px}

  .join{--u:1px;padding:40px 0 48px}
  .join-frame{width:calc(100% - 40px);max-width:660px}
  .join-head{height:auto}
  .join-title{margin:0;padding:12px 14px;font-size:26px;line-height:1.3;letter-spacing:0;border-width:1.5px}
  .join-hand{position:static;width:230px;margin:22px 8px 0 auto}
  .doors{grid-template-columns:1fr;gap:16px;margin-top:24px}
  .door{--fold:22px;height:132px;padding:20px 56px 18px 114px}
  .door:before{border-width:1.5px}
  .door-art{left:5px;top:16px;width:106px;height:102px;margin:0}
  .door-name{height:auto;font-size:20px;line-height:1.3;letter-spacing:0}
  .door-foot{margin-top:10px}
  .door-tag{padding:4px 8px;font-size:12px;line-height:1.3;letter-spacing:0;border-width:1px}
  .door-arrow{position:absolute;right:14px;top:50%;width:34px;height:34px;transform:translateY(-50%)}
  .door-arrow svg{width:19px;height:13px}
  .band{display:grid;grid-template-columns:30px 1fr;height:auto;margin-top:28px;padding:24px;gap:16px;border-width:1.5px}
  .band-icon{width:30px;height:40px}
  .band-title{margin:0;font-size:20px;line-height:1.4;letter-spacing:0;white-space:normal}
  .band-copy{grid-column:1/-1;margin:0;padding:0;border:0}
  .band-note{font-size:16px;line-height:1.8;letter-spacing:0}
  .band-note span{white-space:normal}
  .band-guide{display:flex;align-items:center;min-height:44px;margin-top:8px;padding-bottom:0;font-size:14px;letter-spacing:0}
  .band-cta{grid-column:1/-1;width:100%;height:62px;margin:0;padding-right:24px;font-size:21px;border-width:1.5px;letter-spacing:.04em}
  .band-arrow{right:22px;width:24px;height:16px;margin-top:-8px}

  .site-footer{--u:1px}
  .site-footer:before{left:24px;right:24px;width:auto;margin:0}
  .footer-frame{width:100%;max-width:708px;min-height:0;margin:auto;padding:52px 24px 0}
  .footer-main{flex-direction:column}
  .footer-brand{width:100%}
  .footer-mark{width:min(280px,100%);gap:12px}
  .footer-mark .brand-caption{font-size:11px}
  .footer-phrase{margin-top:28px;font-size:30px;line-height:1.5;letter-spacing:.03em}
  .footer-address{margin-top:22px;font-size:14px;line-height:1.9;letter-spacing:0}
  .footer-nav{flex-direction:column;width:100%;gap:24px;margin-top:40px}
  .footer-group,.footer-group:first-child,.footer-group+.footer-group{width:auto;padding:20px 0 0;border-left:0;border-top:1px solid rgba(255,255,255,.45)}
  .footer-label{font-size:12px;line-height:1.5;margin:0 0 8px}
  .footer-group a{min-height:48px;height:auto;padding:12px 0;font-size:16px;line-height:1.5;letter-spacing:0;gap:12px;white-space:normal}
  .footer-arrow{width:22px;height:14px}
  .footer-closing{flex-direction:column;align-items:flex-start;gap:24px;margin-top:16px;padding-top:24px}
  .footer-word{margin:0;font-size:clamp(48px,15vw,100px);line-height:1;letter-spacing:.065em;-webkit-text-stroke-width:1px}
  .footer-top{align-self:flex-end;width:80px;height:80px;margin:20px 20px 20px 0;gap:5px}
  .footer-top-arrow{width:16px;height:20px}
  .footer-top-ring text{font-size:10px}
  .footer-top span[lang]{font-size:12px;letter-spacing:.04em}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:24px;margin-top:24px;padding:24px 0 32px}
  .footer-legal{flex-direction:column;align-items:flex-start;gap:8px}
  .footer-legal li+li{margin:0;padding:0;border:0}
  .footer-legal a{min-height:44px;font-size:14px;line-height:1.5;letter-spacing:0}
  .footer-external{width:13px;height:13px}
  .footer-copy{font-size:12px}
}
@media(min-width:600px) and (max-width:1023px){
  .hero-title{left:max(24px,calc(50% - 300px))}
  .company-title{font-size:34px}.company-body{font-size:18px}
  .job{--art:240px;--row:214px}.job-card{padding:32px}.job-name{font-size:28px}
  .spread{gap:32px}.proof-hulic{margin-left:24px}.proof-ppa{margin-right:24px}
}