/* 2028 / independent static LP. Tokens and BEM follow the 2026 LPs.
   PC reference: Figma 1306:2738 / FV 1377:3082. Mobile layout is provisional. */

:root{
  --main-color:#e60012;
  --main-color2:#c4a552;
  --text-color:#626262;
  --bg-color:#f9f6ee;
  --line-color:#efe5cb;
  --white:#fff;
  --font-family-base:'Zen Old Mincho','Hiragino Mincho ProN','Yu Mincho',serif;
  --font-family-second:'Inter','Noto Sans JP','Hiragino Sans','Yu Gothic',sans-serif;
  --duration-base:.3s;
  --z-index-header:100;
  --z-index-modal:1000
}
*,*::before,*::after{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth
}
body{
  margin:0;
  color:var(--text-color);
  background:var(--white);
  font-family:var(--font-family-base);
  font-size:14px;
  line-height:1.9;
  overflow-wrap:anywhere;
  -webkit-font-smoothing:antialiased
}
body.is-menu-open{
  overflow:hidden
}
h1,h2,h3,p,ul,dl,dd{
  margin:0
}
ul{
  padding:0;
  list-style:none
}
button,a{
  -webkit-tap-highlight-color:transparent
}
a{
  color:inherit;
  text-decoration:none
}
button{
  font:inherit;
  cursor:pointer;
  color:inherit
}
button{
  border:0;
  background:none
}
img{
  display:block;
  max-width:100%;
  height:auto
}
button:focus-visible,a:focus-visible,summary:focus-visible{
  outline:3px solid #856b26;
  outline-offset:5px
}
button,a,summary{
  touch-action:manipulation
}
dialog{
  border:0;
  color:var(--text-color)
}
dialog::backdrop{
  background:#0008
}
.skip-link{
  position:fixed;
  left:20px;
  top:-100px;
  z-index:2000;
  padding:10px 20px;
  background:white;
  color:var(--main-color)
}
.skip-link:focus{
  top:10px
}
.inner{
  width:100%;
  max-width:560px;
  padding-inline:20px;
  margin-inline:auto
}
.section{
  margin-top:75px
}
.section--cream{
  background:var(--bg-color);
  padding-block:65px
}
.section-title{
  font-size:24px;
  font-weight:600;
  line-height:1.6;
  letter-spacing:.015em
}
.section-title::after{
  content:'';
  display:block;
  background:var(--main-color);
  width:50px;
  height:1px;
  margin-top:25px
}
.section-lead{
  margin-top:32px;
  font-weight:700;
  font-size:14px;
  line-height:1.9
}
.center{
  text-align:center
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:12px 26px;
  background:var(--main-color);
  color:white;
  border:1px solid var(--main-color);
  font-weight:700;
  transition:background var(--duration-base),color var(--duration-base);
  max-width:100%
}
.u-desktop{
  display:none
}
.header{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:76px;
  background:white;
  z-index:var(--z-index-header);
  box-shadow:0 4px 4px #00000012
}
.header__inner{
  padding:18px 20px;
  min-width:0
}
.brand{
  display:flex;
  align-items:center;
  gap:13px
}
.brand__image{
  width:132px;
  height:auto
}
.brand span{
  font-size:14px;
  font-weight:500;
  color:var(--main-color2);
  white-space:nowrap
}
.header .brand{
  display:block
}
.header .brand span{
  display:block;
  font-size:11px;
  margin-top:4px
}
.header__nav{
  display:none
}
.header__login{
  display:none
}
.menu-button{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:6px;
  width:54px;
  height:54px;
  margin-right:12px
}
.menu-button span{
  width:26px;
  height:1px;
  background:var(--main-color)
}
.menu{
  position:fixed;
  inset:0 0 0 auto;
  margin:0;
  width:min(90%,420px);
  height:100dvh;
  max-height:none;
  padding:24px;
  z-index:var(--z-index-modal)
}
.menu__top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:25px
}
.menu__top h2{
  font-size:18px
}
.menu__close{
  min-height:44px
}
.menu nav{
  display:grid;
  margin-bottom:30px
}
.header__nav-link{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-block:18px;
  border-bottom:1px solid var(--line-color);
  font-weight:700
}
.header__nav-link small{
  font-size:10px;
  color:var(--main-color2)
}
.fv{
  position:relative;
  padding-left:20px;
  padding-bottom:140px
}
.fv__collage{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  aspect-ratio:1327 / 558;
  overflow:hidden;
  border-bottom-left-radius:30px
}
.fv__photo{
  position:relative;
  overflow:hidden;
  min-width:0;
  min-height:0
}
.fv__photo img{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:fill;
  object-position:center bottom
}
.fv__year{
  white-space:nowrap;
  position:absolute;
  top:20px;
  left:12px;
  background:transparent;
  padding:5px 8px;
  color:#917735;
  font-size:12px;
  line-height:1.5
}
.fv__year span{
  display:block;
  width:5px;
  height:5px;
  background:var(--main-color);
  margin-top:8px
}
.fv__copy{
  position:absolute;
  bottom:0;
  left:20px;
  right:15px
}
.fv__copy h1,.fv__copy p{
  background:var(--main-color);
  color:white;
  width:fit-content;
  font-weight:600;
  letter-spacing:.03em
}
.fv__copy h1{
  padding:10px 14px;
  font-size:25px;
  line-height:1.5
}
.fv__copy p{
  margin-top:7px;
  padding:10px 14px;
  font-size:16px;
  line-height:1.8
}
.message{
  margin-top:50px
}
.message__box{
  padding:38px 24px;
  background:var(--bg-color);
  border-radius:35px 0 35px 0;
  text-align:center
}
.message .section-title{
  font-size:23px
}
.message .section-title::after{
  margin-inline:auto
}
.message p{
  margin-top:30px;
  font-size:14px;
  font-weight:700;
  line-height:2
}
.movies__grid{
  display:grid;
  gap:26px;
  margin-top:30px
}
.movie{
  border:1px solid var(--line-color);
  border-radius:0 50px 0 50px;
  overflow:hidden;
  align-self:start
}
.movie__thumbnail{
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:349/195;
  padding:0;
  overflow:hidden
}
.movie__thumbnail>img{
  width:100%;
  height:100%;
  object-fit:cover
}
.movie:nth-child(2) .movie__thumbnail>img{
  object-position:bottom
}
.movie__play{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  border-radius:50%;
  background:#ffffffe6;
  box-shadow:0 4px 4px #0004
}
.movie__play img{
  margin-left:3px
}
.movie__body{
  padding:18px 20px 30px
}
.movie__number{
  color:#917735;
  font-size:12px;
  letter-spacing:.14em
}
.movie h3{
  font-size:17.5px;
  line-height:1.6;
  margin-top:6px;
  color:#222;
  font-weight:700
}
.movie__body p{
  font-size:14px;
  line-height:1.92;
  margin:8px 0 12px
}
.text-link{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:44px;
  padding:0;
  color:var(--main-color);
  font-size:14px
}
.flow{
  display:grid;
  gap:18px;
  margin-top:35px
}
.flow__card{
  position:relative;
  padding:30px 24px 26px;
  border:1px solid var(--line-color);
  background:white
}
.flow__step{
  position:absolute;
  left:-1px;
  top:-1px;
  background:var(--main-color);
  color:white;
  font-size:14px;
  font-weight:700;
  letter-spacing:.08em;
  line-height:1;
  padding:8px 12px;
  border-radius:0 0 10px 0
}
.flow__icon{
  width:76px;
  height:76px;
  border:1px solid var(--main-color);
  border-radius:50%;
  display:grid;
  place-items:center;
  margin:auto
}
.flow h3{
  text-align:center;
  font-size:21px;
  font-weight:600;
  line-height:1.9;
  color:#222;
  margin-top:6px
}
.flow ul{
  display:grid;
  gap:5px;
  margin-top:14px
}
.flow li{
  background:var(--bg-color);
  padding:4px 8px;
  text-align:center;
  color:#222;
  font-weight:700
}
.flow__card p{
  font-size:14px;
  line-height:1.85;
  margin-top:12px
}
.flow__card:last-child p{
  text-align:center;
  margin-top:24px
}
.flow__card .flow__note{
  font-size:12px;
  color:#746f65;
  margin-top:8px
}
.flow__arrow{
  display:flex;
  align-items:center;
  justify-content:center;
  height:32px
}
.flow__arrow img{
  transform:rotate(90deg)
}
.events__list{
  margin-top:32px;
  border-top:1px solid var(--line-color)
}
.events__list>div{
  border-bottom:1px solid var(--line-color)
}
.events dt{
  background:var(--bg-color);
  color:var(--main-color);
  padding:12px 16px;
  font-weight:700
}
.events dd{
  padding:16px
}
.events h3{
  font-size:14px;
  color:#222
}
.events p{
  font-size:14px
}
.events__note{
  margin-top:18px;
  background:var(--bg-color);
  padding:15px 20px;
  text-align:center
}
.faq__list{
  margin-top:50px
}
.faq__item{
  background:white;
  border-block:1px solid #ececec
}
.faq__item+.faq__item{
  border-top:0
}
.faq__question{
  list-style:none;
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px 18px;
  font-size:14px;
  font-weight:700;
  cursor:pointer
}
.faq__question::-webkit-details-marker{
  display:none
}
.faq__q{
  font-family:var(--font-family-second);
  font-size:24px;
  color:var(--main-color);
  font-weight:300
}
.faq__toggle{
  margin-left:auto;
  flex-shrink:0;
  width:18px;
  height:18px;
  position:relative
}
.faq__toggle::before,.faq__toggle::after{
  content:'';
  position:absolute;
  left:0;
  top:8px;
  width:18px;
  height:1px;
  background:var(--main-color2)
}
.faq__toggle::after{
  transform:rotate(90deg)
}
.faq__item.is-open .faq__toggle::after{
  transform:none
}
.faq__answer{
  padding:0 12px 15px
}
.faq__answer p{
  background:var(--bg-color);
  padding:20px;
  border-radius:5px;
  font-size:14px;
  line-height:1.92;
  box-shadow:0 2px 2px #0001
}
.faq .center{
  margin-top:40px
}
.site-links__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:14px;
  margin-top:32px
}
.site-card{
  background:white;
  display:flex;
  flex-direction:column;
  border:1px solid var(--line-color);
  min-width:0
}
.site-card__image{
  aspect-ratio:4096/2730;
  overflow:hidden;
  position:relative
}
.site-card__image img{
  width:100%;
  height:100%;
  object-fit:cover
}
.site-card__body{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:17px;
  padding:20px 12px;
  flex:1
}
.site-card h3{
  font-size:16px;
  color:#222;
  align-self:stretch;
  font-weight:600;
  line-height:1.5
}
.site-card p{
  font-size:14px;
  line-height:1.92;
  flex:1
}
.button--small{
  min-height:44px;
  font-size:12px;
  padding:7px 12px;
  white-space:nowrap
}
.cta{
  background:var(--main-color);
  color:white;
  padding:64px 0;
  text-align:center
}
.cta .section-title::after{
  background:white;
  margin-inline:auto
}
.cta p{
  margin-top:25px
}
.cta .cta__note{
  font-size:13px;
  margin-top:0
}
.cta__login{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:6px;
  min-height:85px;
  max-width:400px;
  border:2px solid #ffffffd9;
  border-radius:10px;
  margin:26px auto 40px;
  padding:16px 20px
}
.cta__login small{
  font-size:11px
}
.cta__login strong{
  font-size:19px;
  letter-spacing:.04em
}
.cta__social{
  max-width:816px;
  margin:auto;
  padding-top:40px;
  border-top:1px solid #ffffff4d
}
.social-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  max-width:100%;
  padding:14px 18px;
  border-radius:5px;
  background:white;
  color:var(--main-color);
  font-size:13px;
  font-weight:700
}
.footer__body{
  background:var(--bg-color);
  padding:60px 0
}
.footer .brand{
  flex-wrap:wrap;
  margin-bottom:30px
}
.footer p{
  font-size:14px;
  font-weight:700
}
.footer__copyright{
  text-align:center;
  padding:40px 20px 60px;
  font-size:10px!important;
  font-weight:400!important;
  letter-spacing:.1em
}
@media(any-hover:hover){
  .button:hover{
    background:white;
    color:var(--main-color)
  }
  .header__nav-link:hover,.text-link:hover{
    color:var(--main-color)
  }
  .cta__login:hover{
    background:white;
    color:var(--main-color)
  }
  .cta__login--entry:hover{
    background:var(--main-color);
    color:white;
    filter:none;
  }
  .social-button:hover{
    background:var(--main-color);
    color:white;
    filter:none;
    box-shadow:none;
  }
  .social-button:hover img{
    filter:brightness(0) invert(1);
  }
  .movie__thumbnail:hover .movie__play{
    box-shadow:0 4px 14px #0006
  }
  .site-card:hover .button{
    background:white;
    color:var(--main-color)
  }
}
@media(min-width:768px){
  body{
    font-size:16px
  }
  .u-mobile{
    display:none
  }
  .u-desktop{
    display:initial
  }
  .inner{
    max-width:1160px;
    padding-inline:30px
  }
  .section{
    margin-top:150px
  }
  .section--cream{
    padding-block:120px
  }
  .section-title{
    font-size:32px;
    line-height:1.5
  }
  .section-lead{
    margin-top:50px;
    font-size:16px;
    line-height:1.767
  }
  .header{
    min-height:95px
  }
  .header__inner{
    padding:20px 30px
  }
  .header .brand{
    display:flex
  }
  .header .brand span{
    font-size:17px;
    margin:0
  }
  .brand__image{
    width:171.64px
  }
  .brand span{
    font-size:20px
  }
  .header__login{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:var(--main-color);
    color:white;
    align-self:stretch;
    width:210px;
    margin-left:auto;
    border-top-right-radius:20px
  }
  .header__login span{
    font-size:12px
  }
  .header__login strong{
    font-size:25px;
    letter-spacing:.16em
  }
  .fv{
    padding:0 0 0 7.847222%;
    height:38.75vw;
    max-height:697.5px
  }
  .fv__collage{
    height:100%;
    aspect-ratio:auto;
    grid-template-columns:repeat(5,minmax(0,1fr));
    border-bottom-left-radius:56px
  }
  .fv__photo img{
    position:absolute;
    object-fit:fill
  }
  .fv__year{
    left:3.81944%;
    top:46.774194%;
    font-size:clamp(12px,1.388889vw,25px);
    padding:0;
    line-height:1.5;
    color:var(--main-color2);
    letter-spacing:-.031944vw
  }
  .fv__year span{
    width:7px;
    height:7px;
    margin-top:15px
  }
  .fv__copy{
    left:3.81944%;
    top:60.215054%;
    bottom:auto;
    right:auto
  }
  .fv__copy h1{
    width:32.083333vw;
    height:5.763889vw;
    font-size:2.8375vw;
    line-height:4.599861vw;
    letter-spacing:.09684vw;
    padding:.6861vw 1.973vw
  }
  .fv__copy p{
    white-space:nowrap;
    width:46.076944vw;
    height:4.671042vw;
    font-size:1.70368vw;
    line-height:1.9;
    padding:.7625vw 1.973vw;
    margin-top:.579861vw;
    letter-spacing:.068146vw
  }
  .message{
    margin-top:70px
  }
  .message__box{
    padding:50px 30px;
    border-radius:50px 0 50px 0;
    margin-inline:-30px
  }
  .message .section-title{
    font-size:32px;
    line-height:1.45
  }
  .message p{
    font-size:16px;
    margin-top:50px;
    line-height:1.767
  }
  .movies{
    margin-top:80px
  }
  .movies__grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:26px
  }
  .movie:nth-child(2){
    margin-top:56px
  }
  .movie:nth-child(3){
    margin-top:112px
  }
  .flow{
    grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr) 40px minmax(0,1fr);
    gap:14px
  }
  .flow__card{
    min-height:378px;
    padding-inline:20px
  }
  .flow__arrow{
    height:auto
  }
  .flow__arrow img{
    transform:none
  }
  .events__list>div{
    display:grid;
    grid-template-columns:190px 1fr
  }
  .events dt{
    padding:16px 20px;
    border-right:1px solid var(--line-color)
  }
  .events dd{
    padding:16px 20px
  }
  .faq__question{
    padding:16px 30px
  }
  .faq__answer{
    padding-inline:15px
  }
  .faq__answer p{
    padding:20px 50px
  }
  .site-links__grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:20px
  }
  .site-card__body{
    padding:5px 20px 20px
  }
  .site-card__image{
    margin-bottom:20px
  }
  .site-card h3{
    font-size:16.5px
  }
  .footer__body{
    padding:90px 0 80px
  }
  .footer p{
    font-size:16px
  }
  .footer__copyright{
    padding:50px 20px 100px
  }
  .menu-button{
    margin-left:10px
  }
}
@media(min-width:1200px){
  .header__inner{
    display:flex;
    flex:1;
    align-items:center;
    justify-content:space-between;
    padding:0 40px;
    gap:28px
  }
  .header__nav{
    display:flex;
    gap:clamp(18px,2.85vw,41px)
  }
  .header__nav-link{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:5px;
    padding:0;
    min-height:95px;
    border:0;
    white-space:nowrap;
    font-size:14px
  }
  .header .brand span{
    font-size:20px
  }
  .header__login{
    width:15.9%;
    flex-shrink:0
  }
  .menu-button{
    display:none
  }
}
@media(min-width:1800px){
  .fv__copy h1{
    font-size:51px;
    padding:12px 35px
  }
  .fv__copy p{
    font-size:30px;
    padding:13px 35px
  }
}
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important
  }
}
/* Match the Figma thumbnail slot: the second source is fitted in full. */

.movie:nth-child(2) .movie__thumbnail>img{
  object-fit:fill
}
.button{
  position:relative
}
.button__arrow{
  position:absolute;
  left:calc(100% - 20px);
  top:calc(50% - 8px);
  max-width:none
}
.button--small .button__arrow{
  left:calc(100% - 14px);
  top:calc(50% - 6px)
}
@media(max-width:767px){
  .fv{
    padding-top:50px
  }
  .fv__year{
    top:8px;
    left:20px;
    padding:0;
    background:transparent;
    font-size:11px;
    line-height:1.4
  }
  .fv__year span{
    display:none
  }
  .fv__copy p{
    font-size:15px
  }
}

/* Figma fidelity: user instruction 2026-09-28 supersedes earlier readability overrides. */
.cta__buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  padding: 26px 0 40px;
}
.cta__login {
  width: 400px;
  max-width: 100%;
  min-height: 0;
  margin: 0;
  padding: 16px 44px;
  gap: 0;
  filter: drop-shadow(0 3px 5px #0003);
}
.cta__login small { line-height: 11px; letter-spacing: .66px; }
.cta__login strong { line-height: 28.5px; letter-spacing: 1.14px; }
.cta__login--entry {
  background: white;
  color: var(--main-color);
  border-color: white;
}
.cta .cta__note { font-size: 12.5px; font-weight: 400; line-height: 23.75px; color: #fffc; }
.cta .section-title + p { font-weight: 700; line-height: 26.6px; color: #ffffffe0; }
.social-button { border: 1px solid white; position: relative; width: 319px; height: 54px; padding: 8px 30px 8px 50px; line-height: 20px; }
.social-button img:first-child { position: absolute; left: 34.5px; }
.social-button img:last-child { position: absolute; right: 18px; }
.movie__number { color: var(--main-color2); }
@media (min-width: 768px) {
  .section-title { line-height: 32px; letter-spacing: 0; }
  .message .section-title { line-height: normal; }
  .movies__grid { min-height: 538px; }
  .movie__body p { font-size: 13px; line-height: 24.975px; margin: 8px 0 14px; }
  .text-link { font-size: 13px; line-height: 24.7px; min-height: 0; height: 24.695px; }
  .flow { grid-template-columns: minmax(0,1fr) 70px minmax(0,1fr) 70px minmax(0,1fr); gap: 0; margin-top: 32px; }
  .flow__card { padding: 30px 24px 26px; min-height: 378px; }
  .flow__card p { font-size: 13px; line-height: 24.05px; }
  .flow__card:last-child p { font-size: 14px; line-height: 26.6px; margin-top: 28px; }
  .flow__card .flow__note { font-size: 12px; line-height: 21px; }
  .faq__question { font-size: 13px; min-height: 72px; letter-spacing: -.13px; }
  .faq__answer p { font-size: 13px; font-weight: 500; line-height: 25px; letter-spacing: -.13px; }
  .faq .center .button { width: 318px; height: 50px; min-height: 0; padding: 8px 30px; line-height: normal; }
  .site-links__grid { align-items: start; }
  .site-card h3 { line-height: 16.5px; }
  .site-card p { font-size: 13px; line-height: 25px; font-weight: 700; }
  .button--small { width: 142.85px; height: 35.712px; min-height: 0; font-size: 8.57px; padding: 5.714px 21.427px; line-height: normal; }
  .footer__body .inner { padding-inline: 23px; }
  .footer p { line-height: 24px; letter-spacing: .32px; }
  .footer__copyright { line-height: 15px !important; letter-spacing: 1px !important; }
}
@media (min-width: 1200px) {
  .header__nav-link { gap: 9px; font-weight: 900; line-height: 14px; }
  .header__nav-link small { font-weight: 400; line-height: normal; letter-spacing: .3px; }
  .header__login { position: relative; }
  .header__login span { font-size: 12.538px; font-weight: 700; }
  .header__login strong { font-size: 25.077px; letter-spacing: 7.2722px; font-weight: 600; line-height: 1.5; }
  .header__login::after { content: '›'; position: absolute; right: 11px; top: 33px; color: white; font-size: 20px; }
}
@media (min-width: 768px) {
  .movies { min-height: 645px; }
  .movies__grid { min-height: 0; }
}

/* Existing recruitment.js pattern: .is-open + animated answer max-height. */
.faq__heading { margin: 0; font: inherit; }
.faq__question { width: 100%; text-align: left; line-height: inherit; }
.faq__item-answer { max-height: 0; overflow: hidden; transition: max-height var(--duration-base) ease; }
.faq__toggle::after { transition: transform var(--duration-base) ease; }

/* Scroll reveal: internship2026's 20px / 0.65s fade-up. */
@media (prefers-reduced-motion: no-preference){
  .scroll-effects .js-fade-up{
    opacity:0;
    translate:0 20px;
    transition:opacity .65s ease-in-out, translate .65s ease-in-out;
  }
  .scroll-effects .js-fade-up.is-active{
    opacity:1;
    translate:0 0;
  }
}

/* Recruitment page's leadSweep, scoped to text to preserve heading layout. */
@media (prefers-reduced-motion: no-preference){
  .js-text-animate.is-active .title-sweep{
    display:inline-block;
    background:linear-gradient(90deg, transparent 0%, #e60012 20%, #e60012 50%, transparent 60%) 0 0 / 200% 100% no-repeat,
      linear-gradient(#626262, #626262) 0 0 / 100% 100% no-repeat;
    background-clip:text;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    animation:leadSweep 2.8s cubic-bezier(.25,.1,.25,1) forwards;
  }
  .cta .js-text-animate.is-active .title-sweep{
    background-image:linear-gradient(90deg, transparent 0%, #e60012 20%, #e60012 50%, transparent 60%), linear-gradient(white, white);
  }
}
@keyframes leadSweep{
  from{background-position:100% 0, 0 0}
  to{background-position:-100% 0, 0 0}
}

/* 2026-10-01: latest Figma section backgrounds and spacing. */
.events[hidden]{display:none}
.faq{margin-top:0;background:white;padding-block:65px}
.site-links{margin-top:0;background:var(--bg-color);padding-block:75px}
.site-links + .cta{margin-top:0}
@media(min-width:768px){
  .faq{padding-block:120px}
  .site-links{padding-block:150px}
}

/* Smartphone FV: Figma 1478:5517, 390px reference. */
.fv__photo picture{display:block;width:100%;height:100%}
@media(max-width:767px){
  .header{height:53px;min-height:53px;justify-content:flex-start;box-shadow:0 2px 2.5px #0000002b}
  .header__inner{padding:0;position:absolute;left:12.5641%;top:17px}
  .header .brand{display:flex;gap:6px;align-items:center}
  .header .brand__image{width:clamp(76px,24.9064vw,97.135px)}
  .header .brand span{margin:0;font-family:var(--font-family-second);font-size:clamp(9px,3.0769vw,12px);line-height:16px}
  .header__login{display:flex;position:absolute;right:0;top:0;width:28.5333%;height:53px;background:var(--main-color);color:white;border-top-right-radius:7px;flex-direction:column;align-items:center;justify-content:center;font-family:var(--font-family-second);line-height:1.3;padding-right:10px}
  .header__login span{font-size:7.778px;font-weight:700}
  .header__login strong{font-size:14.432px;font-style:italic;font-weight:600;letter-spacing:4.1851px;line-height:14.432px;margin-top:3px}
  .header__login::after{content:'';position:absolute;right:10px;top:23px;width:7px;height:7px;border-top:1px solid white;border-right:1px solid white;transform:rotate(45deg)}
  .menu-button{position:absolute;left:0;top:0;width:43px;height:53px;margin:0;padding:0 14px;gap:5px}
  .menu-button span{width:18px}
  .fv{padding:0;height:94.358974vw}
  .fv__collage{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(2,38.717949vw);aspect-ratio:auto;border-radius:0}
  .fv__photo{grid-column:span 2}
  .fv__photo:nth-child(n+4){grid-column:span 3}
  .fv__photo picture,.fv__photo img{height:50.25641vw}
  .fv__copy{top:70.25641vw;left:20px;right:20px;bottom:auto}
  .fv__copy h1{width:100%;padding:8px 12px;font-size:clamp(24px,7.692308vw,30px);line-height:1.3;letter-spacing:0;text-align:center;white-space:nowrap}
  .fv__copy p{display:none}
  .fv__year{display:flex;flex-direction:column;align-items:center;gap:8px;top:calc(70.25641vw + clamp(31.2px,10vw,39px) + 39px);left:0;width:100%;padding:0;font-size:11px;font-weight:600;line-height:normal;letter-spacing:.33px;color:var(--main-color2)}
  .fv__year span{display:block;order:-1;width:7px;height:7px;margin:0;position:absolute;bottom:calc(100% + 8px)}
  .message{max-width:none;margin-top:46px;padding:0 20px 18px}
  .message__box{padding:38px 22px 40px;border-radius:30px 0 30px 0}
  .message .section-title{font-size:clamp(18px,5.641026vw,22px);line-height:1.7;letter-spacing:0;width:calc(100% + 44px);margin-inline:-22px}
  .message .section-title::after{width:44px;margin-top:22px}
  .message p{font-size:12.5px;line-height:1.85;font-weight:500;text-align:left;margin-top:22px}
  .message p .u-desktop{display:initial}
}

/* Enlarge the recruitment group photo within its existing PC/SP frame. */
.site-card__image--recruitment img{
  transform:scale(1.2);
  transform-origin:center top;
}

/* Swipe through selection steps on phones; retain the desktop grid. */
@media(max-width:767px){
  .flow{display:flex;gap:3px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:1px;margin-top:35px;padding:1px 1px 14px;scrollbar-width:thin;scrollbar-color:var(--main-color2) var(--line-color)}
  .flow__card{flex:0 0 calc(100% - 26px);scroll-snap-align:start;min-width:0}
  .flow__arrow{flex:0 0 14px;align-self:stretch;height:auto}
  .flow__arrow img{display:none}
  .flow__arrow::after{content:"";width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:12px solid var(--main-color2)}
  .flow:focus-visible{outline:2px solid var(--main-color2);outline-offset:4px}
}

.flow-scrollbar{display:none}
@media(max-width:767px){
  .flow--with-scrollbar{scrollbar-width:none}
  .flow--with-scrollbar::-webkit-scrollbar{display:none}
  .flow-scrollbar{display:block;height:4px;background:var(--line-color);border-radius:2px;overflow:hidden}
  .flow-scrollbar__thumb{display:block;height:100%;background:var(--main-color2);border-radius:inherit}
}

/* Figma adopted A: PC 1502:3073 / SP 1502:3083, checked 2026-10-14. */
.fv-a{--fv-unit:min(.069444444vw,1.25px);position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding-left:calc(113 * var(--fv-unit));height:calc(558 * var(--fv-unit));max-width:1800px;margin-inline:auto}
.fv-a__photo{min-width:0;overflow:hidden;border-radius:0 calc(50 * var(--fv-unit)) 0 calc(50 * var(--fv-unit))}
.fv-a__photo picture,.fv-a__photo img{display:block;width:100%;height:100%}
.fv-a__photo img{object-fit:fill;object-position:bottom}
.fv-a__copy{position:absolute;top:calc(289 * var(--fv-unit));left:calc(22 * var(--fv-unit));width:calc(500 * var(--fv-unit));padding:calc(24 * var(--fv-unit)) calc(60 * var(--fv-unit)) calc(32 * var(--fv-unit)) calc(50 * var(--fv-unit));border-radius:0 calc(60 * var(--fv-unit)) 0 calc(60 * var(--fv-unit));background:var(--main-color);color:#fff}
.fv-a__copy h1{font-size:calc(35 * var(--fv-unit));font-weight:600;line-height:calc(45 * var(--fv-unit));letter-spacing:calc(1.3945 * var(--fv-unit));margin:0}
.fv-a__line{display:block;white-space:nowrap}
.fv-a__copy small{font-size:calc(30 * var(--fv-unit));line-height:1}
.fv-a__year-char{letter-spacing:calc(5.3945 * var(--fv-unit))}
.fv-a__month-char{letter-spacing:calc(-1.6055 * var(--fv-unit))}
.fv-a__company-char{letter-spacing:calc(.3945 * var(--fv-unit))}
.fv-a__copy p{margin:calc(10 * var(--fv-unit)) 0 0;font-size:calc(17 * var(--fv-unit));line-height:1.5;letter-spacing:calc(2.21 * var(--fv-unit));white-space:nowrap;font-weight:400}
@media(max-width:767px){
 .fv-a{--fv-unit:.256410256vw;padding:0;height:auto;grid-template-columns:repeat(6,minmax(0,1fr))}
 .fv-a__photo{grid-row:1;grid-column:span 2;height:calc(196 * var(--fv-unit));border-radius:0 calc(20 * var(--fv-unit)) 0 calc(20 * var(--fv-unit))}
 .fv-a__photo:nth-child(2){grid-column:5 / 7}
 .fv-a__photo:nth-child(3){grid-column:3 / 5}
 .fv-a__photo:nth-child(4){grid-row:3;grid-column:1 / 4}
 .fv-a__photo:nth-child(5){grid-row:3;grid-column:4 / 7}
 .fv-a__copy{position:static;grid-row:2;grid-column:1 / -1;width:auto;padding:calc(21 * var(--fv-unit)) calc(46 * var(--fv-unit));border-radius:0 calc(50 * var(--fv-unit)) 0 calc(50 * var(--fv-unit))}
 .fv-a__copy h1{font-size:calc(26 * var(--fv-unit));line-height:calc(33 * var(--fv-unit));letter-spacing:calc(2 * var(--fv-unit))}
 .fv-a__copy small{font-size:calc(20 * var(--fv-unit))}
 .fv-a__year-char,.fv-a__month-char,.fv-a__company-char{letter-spacing:inherit}
 .fv-a__copy p{margin-top:calc(3 * var(--fv-unit));font-size:calc(14 * var(--fv-unit));letter-spacing:calc(1.82 * var(--fv-unit))}
}

/* Figma video-only links: 2026-10-14. */
.movies .text-link{gap:5px}
.movies .text-link img{width:13px;height:15px;flex:none}
/* Latest Figma: PC 1306:2738 / SP 1478:5517, 2026-10-14. */
.movie__picture{display:block;position:absolute;inset:0;overflow:hidden}
.movie__picture img{width:100%;height:100%;object-fit:cover;max-width:none}
.movie:nth-child(2) .movie__picture img{object-fit:fill;object-position:bottom}
.movie__link-arrow{display:flex;align-items:center;flex:none}
.movie__number{display:block;line-height:22.8px}
.site-card__image picture{display:block;width:100%;height:100%}
.site-card__image img{position:absolute;max-width:none;object-fit:fill;transform:none}
.site-card:nth-child(1) .site-card__image img{width:246.13%;height:207.05%;left:-146.16%;top:-65.16%}
.site-card:nth-child(2) .site-card__image img{width:125.58%;height:125.61%;left:-15.12%;top:-9.9%}
.site-card:nth-child(3) .site-card__image img{width:122.1%;height:122.13%;left:-14.54%;top:-3.5%}
.site-card:nth-child(4) .site-card__image img{width:100%;height:100%;left:0;top:0;object-position:bottom}
@media(min-width:768px){
 .movies .section-lead{min-height:57px}
 .movie__thumbnail{aspect-ratio:16/9}
 .movie__play{box-shadow:none}
 .movie:first-child .movie__play{box-shadow:0 4px 4px #0004}
}
@media(max-width:767px){
 /* Figma mobile content uses 390/440 scale; FV and message have independent sizing. */
 .section,.footer{font-size:12.409px;line-height:1.9}
 .section.inner,.section>.inner,.footer .inner{max-width:496.364px;padding-inline:17.727px}
 .section{margin-top:66.477px}
 .section .section-title{font-size:21.273px;line-height:34.036px;letter-spacing:.3191px}
 .section .section-title::after{width:44.318px;height:.886px;margin-top:22.159px}
 .section-lead{font-size:12.409px;line-height:23.577px;margin-top:28.364px}
 .section--cream,.faq{padding-block:57.614px}
 .faq,.site-links,.site-links+.cta{margin-top:0}
 .site-links{padding-block:66.477px}
 .movies__grid{gap:23.045px;margin-top:26.591px}
 .movie{border-width:.886px;border-radius:0 44.318px 0 44.318px}
 .movie__thumbnail{aspect-ratio:352.773/196.773}
 .movie:nth-child(2) .movie__picture img{position:absolute;width:124.41%;height:135.46%;left:-10.84%;top:-6.81%;object-fit:fill}
 .movie__play{width:47.864px;height:47.864px;box-shadow:0 3.545px 3.545px #0004}
 .movie__play img{width:17.727px;height:17.727px;margin-left:2.659px}
 .movie__body{padding:17.8px 17.727px 26.591px}
 .movie__number{font-size:10.636px;line-height:20.209px;letter-spacing:1.4891px}
 .movie h3{font-size:15.511px;line-height:24.818px;margin-top:6.681px}
 .movie__body p{font-size:12.409px;line-height:23.825px;margin:6.982px 0 10.636px}
 .movies .text-link{font-size:12.409px;line-height:23.577px;min-height:39px;gap:6.205px}
 .movies .text-link img{width:18.6096px;height:5.29592px}
 .flow{gap:2.659px;margin-top:31.023px;padding:1px 1px 12.409px}
 .flow__card{flex-basis:calc(100% - 23.045px);padding:26.591px 21.273px 23.045px;border-width:.886px}
 .flow__step{font-size:12.409px;padding:7.091px 10.636px;border-radius:0 0 8.864px 0}
 .flow__icon{width:67.364px;height:67.364px;border-width:.886px}
 .flow__icon img{width:49.636px;height:49.636px}
 .flow h3{font-size:18.614px;line-height:35.366px;margin-top:5.318px}
 .flow ul{gap:4.432px;margin-top:12.409px}
 .flow li{padding:3.545px 7.091px}
 .flow__card p{font-size:12.409px;line-height:22.957px;margin-top:10.636px}
 .flow__card:last-child p{margin-top:21.273px}
 .flow__card .flow__note{font-size:10.636px;margin-top:7.091px}
 .flow__arrow{flex-basis:12.409px}
 .flow__arrow::after{border-top-width:7.091px;border-bottom-width:7.091px;border-left-width:10.636px}
 .flow-scrollbar{height:3.545px;border-radius:1.773px}
 .faq__list{margin-top:44.318px}
 .faq__question{gap:12.409px;padding:14.182px 15.955px;font-size:12.409px}
 .faq__q{font-size:21.273px}
 .faq__toggle{width:15.955px;height:15.955px}
 .faq__toggle::before,.faq__toggle::after{top:7.091px;width:15.955px;height:.886px}
 .faq__answer{padding:0 10.636px 13.295px}
 .faq__answer p{padding:17.727px;font-size:12.409px;line-height:23.825px}
 .faq .center{margin-top:35.455px}
 .section .button{min-height:44.318px;padding:10.636px 23.045px}
 .site-links__grid{gap:12.409px;margin-top:28.364px}
 .site-card{border-width:.886px}
 .site-card__body{gap:15.068px;padding:17.727px 10.636px}
 .site-card h3{font-size:14.182px;line-height:21.273px}
 .site-card p{font-size:12.409px;line-height:23.825px;min-height:47.864px}
 .site-card .button--small{font-size:10.636px;min-height:39px;padding:6.205px 10.636px}
 .site-card:nth-child(2) .site-card__image img,.site-card:nth-child(3) .site-card__image img{width:100%;height:100%;left:0;top:0;object-fit:cover}
 .cta{padding-block:56.727px}
 .cta p{margin-top:22.159px}
 .cta .section-title+p{line-height:23.577px}
 .cta .cta__note{font-size:11.08px;line-height:21.051px}
 .cta__buttons{gap:14.182px;padding:23.045px 0 35.455px}
 .cta__login{width:354.545px;padding:14.182px 39px;border-width:1.773px;border-radius:8.864px}
 .cta__login small{font-size:9.75px;line-height:9.75px;letter-spacing:.585px}
 .cta__login strong{font-size:16.841px;line-height:25.261px;letter-spacing:1.0105px}
 .cta__social{padding-top:35.455px}
 .social-button{width:282.75px;height:47.864px;padding:7.091px 26.591px 7.091px 44.318px;font-size:11.523px;line-height:17.727px}
 .social-button img:first-child{left:30.58px;width:19.5px;height:19.5px}
 .social-button img:last-child{right:15.955px;width:13.295px;height:13.295px}
 .footer__body{padding:53.182px 0}
 .footer .brand{margin-bottom:26.591px}
 .footer p{font-size:12.409px;line-height:23.577px}
 .footer__copyright{font-size:8.864px!important;line-height:16.841px;padding:35.455px 17.727px 53.182px;letter-spacing:.8864px}
}
@media(min-width:768px){
 .movie:nth-child(3) .movie__picture img{object-fit:fill;object-position:bottom}
 .movies .text-link{display:flex;width:fit-content}
}
@media(max-width:767px){
 .footer .brand{gap:11.523px}
 .footer .brand__image{width:117px}
 .footer .brand span{font-size:12.409px;line-height:23.577px;font-weight:500}
}

/* Remaining PC differences verified against Figma on 2026-10-14. */
@media(min-width:768px){
 .movies + .selection{margin-top:64px}
 .flow{grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr) 40px minmax(0,1fr);gap:14px}
 .flow ul{gap:3px}
 .flow li{font-size:14px;line-height:26.6px}
 .flow__number{color:var(--main-color)}
}
@media(min-width:1200px){
 .flow__card{height:378px;min-height:378px;align-self:start}
}

.video-dialog{width:min(960px,calc(100% - 32px));max-height:90dvh;padding:16px;border:0;background:#fff;box-sizing:border-box}
.video-dialog::backdrop{background:rgba(0,0,0,.75)}
.video-dialog__header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}
.video-dialog__header h2{margin:0;font-size:18px}
.video-dialog__close{flex-shrink:0;cursor:pointer;border:0;background:none;padding:8px;color:#222}
.video-dialog video{display:block;width:100%;max-height:72dvh;background:#000}

/* Figma revision 1589:3074 / 1589:3432, 2026-10-19. */
.header .brand{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center}
.header .brand span{margin:0;font-family:var(--font-family-second);font-size:17px;line-height:20px}
@media(min-width:768px){
 .message p{max-width:800px;margin:25px auto 0;font-size:16px;line-height:28.275px}
 .movie:nth-child(3) .movie__picture img{position:absolute;width:112%;height:132.74%;left:-7.58%;top:-6.13%;object-fit:fill}
}
@media(max-width:767px){
 .header__inner{top:10px}
 .header .brand{align-items:center;gap:0}
 .header .brand span{font-size:10px;line-height:20px;margin-top:-1px}
 .message p{margin-top:22px}
}

/* 2026-10-20: movies 01/02 use the same play-icon hover shadow as 03. */
@media(any-hover:hover){
  .movie:nth-child(-n+2) .movie__thumbnail:hover .movie__play{
    box-shadow:0 4px 14px #0006;
  }
}

/* Local update: invert play-button colors on hover. */
@media (any-hover:hover){
  .movie__thumbnail:hover .movie__play{background:var(--main-color)}
  .movie__thumbnail:hover .movie__play img{filter:brightness(0) invert(1)}
}
.movie__thumbnail:focus-visible .movie__play{background:var(--main-color)}
.movie__thumbnail:focus-visible .movie__play img{filter:brightness(0) invert(1)}

/* Match the page buttons: 300ms ease, including the return to normal. */
.movie__play{transition:background-color var(--duration-base) ease,box-shadow var(--duration-base) ease}
.movie__play img{transition:filter var(--duration-base) ease}

/* Video photo zoom matches recruitment cards. */
.movie__picture{transition:transform var(--duration-base) ease;transform-origin:center}
@media (hover:hover) and (pointer:fine){
  .movie__thumbnail:hover .movie__picture{transform:scale(1.05)}
}
.movie__thumbnail:focus-visible .movie__picture{transform:scale(1.05)}
@media (prefers-reduced-motion:reduce){
  .movie__picture{transition:none}
}

/* Movie 02: not playable until the official video arrives (2026-10-24). */
.movie__thumbnail:disabled{cursor:default}
.movie__thumbnail:disabled .movie__picture{transform:none}
.movie__soon{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:6px 20px;border-radius:999px;background:#ffffffe6;color:var(--text-color);font-size:14px;font-weight:700;letter-spacing:.1em;white-space:nowrap}
.text-link.is-soon{color:var(--text-color);cursor:default}

/* Cookie consent banner: same as internship2026. */
cookie-consent-banner{position:fixed;left:0;right:0;bottom:0;z-index:9999;display:block;padding:20px 10px;background:#e5e5e5;color:#111;font-size:15px;text-align:center}
cookie-consent-banner[hidden]{display:none}
cookie-consent-banner button{margin-left:20px;padding:8px 20px;border:1px solid var(--main-color);border-radius:4px;background:#fff;color:var(--main-color);font-size:15px;opacity:.8;cursor:pointer}
@media(any-hover:hover){
  cookie-consent-banner button:hover{opacity:1}
}