/* =========================================================
   index.css — トップページ固有スタイル
   （common.css に続けて読み込む）
   ========================================================= */

/* allow English headline to wrap (JA version uses nowrap) */
body.lang-en .hero h1{white-space:normal;}

/* ===== Hero ===== */
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line);}
.hero-grid{
  display:grid;grid-template-columns:1.32fr .68fr;align-items:center;
  min-height:620px;padding:96px 0 104px;
}
.hero-copy{max-width:780px;position:relative;z-index:2;}
.hero h1{
  font-size:clamp(22px,5.6vw,54px);font-weight:700;line-height:1.32;color:var(--ink);white-space:nowrap;
  letter-spacing:.005em;
}
.hero h1 br.m{display:none;}
.hero .lead{margin-top:30px;font-size:17px;line-height:1.95;color:var(--body);max-width:430px;}
.hero .cta-row{display:flex;gap:16px;margin-top:52px;flex-wrap:wrap;}

/* hero image */
.hero-visual{position:relative;z-index:1;height:480px;display:flex;align-items:center;justify-content:center;}
.hero-img{width:250%;height:auto;max-width:none;object-fit:contain;transform:translate(-2%,-20%) rotate(-15deg);opacity:.6;}

/* ===== Section scaffolding ===== */
section.block{padding:104px 0;}
.sec-head{font-size:34px;font-weight:700;color:var(--ink);letter-spacing:.01em;display:flex;align-items:baseline;gap:14px;}
.sec-head .note{font-size:14px;font-weight:500;color:var(--sub);letter-spacing:.02em;}

/* features */
.features{padding-top:0;}
.feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:48px;}
.feat-card{
  background:var(--white);border:1px solid var(--border);border-radius:8px;
  padding:38px 30px 36px;transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
.feat-card:hover{transform:translateY(-5px);box-shadow:0 14px 34px -18px rgba(17,17,17,.18);border-color:#d8d8d8;}
.feat-icon{height:58px;display:flex;align-items:center;justify-content:center;}
.feat-icon img{height:54px;width:auto;}
.feat-icon svg{height:48px;width:48px;color:var(--ink);}
.feat-card:hover .feat-icon svg{color:var(--ink);}
.feat-card h3{margin-top:26px;font-size:19px;font-weight:700;color:var(--ink);line-height:1.5;}
.feat-card p{margin-top:14px;font-size:14.5px;line-height:1.85;color:var(--sub);}

/* customer cases */
.cases{background:var(--gray-soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.case-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:48px;}
.case-card{
  background:var(--white);border:1px solid var(--border);border-radius:8px;
  display:grid;grid-template-columns:200px 1fr;transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.case-card:hover{transform:translateY(-5px);box-shadow:0 16px 38px -20px rgba(17,17,17,.22);}
/* image bleeds over the top/left/bottom borders so it sits flush to the card frame */
.case-img{overflow:hidden;background:var(--gray);margin:-1px 0 -1px -1px;border-radius:8px 0 0 8px;}
.case-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.02);transition:transform .6s var(--ease);}
.case-card:hover .case-img img{transform:scale(1.05);}
.case-body{padding:26px 28px 26px;display:flex;flex-direction:column;flex:1;}
.case-tag{font-size:12.5px;font-weight:700;color:var(--sub);letter-spacing:.04em;}
.case-body h3{margin-top:7px;font-size:18px;font-weight:700;color:var(--ink);line-height:1.45;}
.case-meta{margin-top:13px;font-size:13px;line-height:1.85;color:var(--sub);}
.case-link{margin-top:auto;padding-top:18px;display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;color:var(--ink);}
.case-link .arr{transition:transform .25s var(--ease);}
.case-card:hover .case-link .arr{transform:translateX(5px);}

/* tieset banner */
.tieset-wrap{padding:80px 0;}
.tieset-wrap + .tieset-wrap{padding-top:80px;}
/* Partners: white section, gray card */
#partners.tieset-wrap{background:var(--white);}
#partners .tieset{background:var(--gray-soft);}
/* TieSet: gray section, white card */
#tieset.tieset-wrap{background:var(--gray-soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
#tieset .tieset{background:var(--white);}
.tieset{
  position:relative;overflow:hidden;border:1px solid var(--border);border-radius:10px;
  padding:66px 56px;
}
.tieset .net{position:absolute;top:0;right:0;bottom:0;width:62%;z-index:0;opacity:.85;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 38%);mask-image:linear-gradient(90deg,transparent,#000 38%);}
.tieset-inner{position:relative;z-index:1;}
.tieset-wrap .sec-head{margin-bottom:28px;}
.recruit-wrap .sec-head{margin-bottom:28px;}
.tieset h2{font-size:30px;font-weight:700;color:var(--ink);line-height:1.5;letter-spacing:.01em;}
.tieset h2 .ts{font-weight:700;}
.tieset .btn{margin-top:30px;height:50px;}

/* contact cta */
.contact-wrap{background:var(--white);padding:96px 0 104px;border-top:1px solid var(--line);}
.contact{}
.contact h2.sec-head{margin-bottom:0;}
.contact p{margin-top:18px;font-size:15px;line-height:1.95;color:var(--sub);max-width:760px;}
.contact .btn{margin-top:34px;height:58px;padding:0 42px;font-size:15.5px;}

/* architecture carousel */
.arch-wrap{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:96px 0 104px;}
.arch-head{display:grid;grid-template-columns:auto 1fr;gap:48px;align-items:center;padding-bottom:28px;border-bottom:1px solid var(--border);}
.arch-title{font-size:34px;font-weight:700;color:var(--ink);line-height:1.3;letter-spacing:.01em;}
.arch-lead{font-size:14.5px;line-height:1.95;color:var(--body);max-width:680px;padding-bottom:0;}
.arch{margin-top:40px;}
@media (max-width:860px){
  .arch-head{grid-template-columns:1fr;gap:18px;align-items:start;}
  .arch-title{font-size:27px;}
  .arch-lead{padding-bottom:0;}
}
.arch-stage{position:relative;background:var(--white);border:1px solid var(--border);border-radius:10px;overflow:hidden;}
.arch-track{display:flex;transition:transform .55s var(--ease);will-change:transform;}
.arch-slide{flex:0 0 100%;min-width:0;}
.arch-slide img{width:100%;height:auto;display:block;}
.arch-btn{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;
  background:rgba(255,255,255,.94);border:1px solid var(--border);box-shadow:0 6px 18px -8px rgba(17,17,17,.18);
  display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink);
  transition:background .2s var(--ease), transform .2s var(--ease);z-index:3;}
.arch-btn:hover{background:var(--white);transform:translateY(-50%) scale(1.04);}
.arch-btn svg{width:18px;height:18px;}
.arch-prev{left:18px;}
.arch-next{right:18px;}
.arch-meta{margin-top:24px;display:flex;align-items:center;gap:24px;}
.arch-label{font-size:14px;color:var(--sub);}
.arch-label strong{color:var(--ink);font-weight:700;margin-right:6px;}
.arch-dots{display:flex;gap:10px;margin-left:auto;}
.arch-dot{width:9px;height:9px;border-radius:50%;background:#D0D0D0;border:none;padding:0;cursor:pointer;transition:background .2s var(--ease), transform .2s var(--ease);}
.arch-dot.active{background:var(--ink);transform:scale(1.15);}
.arch-dot:hover{background:#888;}

/* recruit cta */
.recruit-wrap{padding:92px 0 92px;background:var(--gray-soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.recruit{
  display:grid;grid-template-columns:1fr .82fr;align-items:stretch;
  border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--white);
}
.recruit-copy{padding:62px 56px;display:flex;flex-direction:column;justify-content:center;}
.recruit-copy h2{font-size:28px;font-weight:700;color:var(--ink);line-height:1.6;letter-spacing:.01em;}
.recruit-copy .btn{margin-top:34px;align-self:flex-start;}
.recruit-photo{position:relative;min-height:280px;background:var(--gray);overflow:hidden;}
.recruit-photo img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease);}
.recruit:hover .recruit-photo img{transform:scale(1.04);}

/* responsive */
@media (max-width:1080px){
  .feat-grid,.case-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:860px){
  .hero-grid{grid-template-columns:1fr;min-height:480px;padding:64px 0 72px;gap:32px;position:relative;}
  .hero h1{font-size:clamp(34px,9vw,52px);}
  .hero h1 br.m{display:inline;}
  .hero-copy{position:relative;z-index:2;}
  .hero-visual{position:absolute;top:0;left:90%;right:-90%;height:340px;z-index:1;opacity:.35;}
  .case-grid{grid-template-columns:1fr;}
  .recruit{grid-template-columns:1fr;}
  .recruit-photo{min-height:240px;order:-1;}
  .tieset .net{width:100%;opacity:.4;}
  .foot-nav{grid-template-columns:repeat(2,auto);justify-content:start;gap:16px 48px;}
  .foot-nav a{white-space:nowrap;}
}
@media (max-width:560px){
  .feat-grid,.case-grid{grid-template-columns:1fr;}
  .case-card{grid-template-columns:1fr;}
  .case-img{margin:-1px -1px 0;border-radius:8px 8px 0 0;aspect-ratio:16/10;}
  .sec-head{font-size:27px;}
  .cta-row .btn{flex:1;}
  .tieset,.recruit-copy{padding:40px 28px;}
  .recruit-copy h2{font-size:18px;line-height:1.6;}
  .tieset h2{font-size:18px;line-height:1.6;}
}