/* =========================================================
   株式会社Unity — Concept C : Industrial Spec / 構造体
   Palette: Concrete grey + Ink black + Safety Orange accent
   Migrated from design-concepts/concept-c-industrial.html
   ========================================================= */

:root{
  --concrete:#e7e5e1;
  --concrete-2:#d4d2cc;
  --concrete-3:#bfbcb4;
  --ink:#16140f;
  --ink-2:#262420;
  --ink-3:#37342d;
  --paper:#f4f3f0;
  --accent:#ff4d00;        /* Safety Orange */
  --accent-dk:#cc3d00;
  --line:rgba(22,20,15,.16);
  --line-strong:rgba(22,20,15,.4);
  --line-light:rgba(244,243,240,.16);
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:'Noto Sans JP',system-ui,sans-serif;
  --disp:'Anton',var(--sans);
  --gut:clamp(20px,5vw,72px);
  --maxw:1440px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  font-family:var(--sans);
  background:var(--concrete);
  color:var(--ink);
  line-height:1.85;
  font-weight:400;
  letter-spacing:.02em;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  word-break:auto-phrase;
  line-break:strict;
}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}

::selection{background:var(--accent);color:#fff}

/* ---------- Utility ---------- */
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)}
.mono{font-family:var(--mono);letter-spacing:.04em}
.disp{font-family:var(--disp);letter-spacing:.01em;line-height:.92;font-weight:400}
.accent{color:var(--accent)}

.eyebrow{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:#a83200;
  font-weight:700;
  display:inline-flex;
  align-items:center;
  gap:.7em;
}
.eyebrow::before{
  content:"";
  width:34px;height:2px;background:var(--accent);display:inline-block;
}

/* Section index number — large numbered sections */
.sec-no{
  font-family:var(--disp);
  font-size:clamp(2.4rem,6vw,4.6rem);
  color:transparent;
  -webkit-text-stroke:1.5px var(--line-strong);
  line-height:1;
  display:block;
}

/* =========================================================
   PAGE LOADER
   ========================================================= */
.page-loader{
  position:fixed;inset:0;z-index:9999;
  background:var(--ink);
  display:grid;place-items:center;
  transition:opacity .55s ease;
}
.page-loader.loaded{opacity:0;pointer-events:none}
.pl-inner{display:flex;flex-direction:column;align-items:center;gap:20px;padding:24px;text-align:center}
.pl-logo{font-family:var(--disp);font-size:clamp(2.8rem,9vw,4.8rem);color:var(--concrete);letter-spacing:.05em;line-height:1}
.pl-logo b{color:var(--accent);font-weight:inherit}
.pl-sub{font-family:var(--mono);font-size:.6rem;letter-spacing:.3em;color:var(--concrete-3);text-transform:uppercase}
.pl-bar{position:relative;width:min(220px,56vw);height:2px;background:rgba(244,243,240,.16);overflow:hidden}
.pl-bar i{position:absolute;inset:0;background:var(--accent);transform:translateX(-100%);animation:plFill .9s cubic-bezier(.65,0,.35,1) forwards}
@keyframes plFill{to{transform:translateX(0)}}
@media (prefers-reduced-motion:reduce){.page-loader{display:none}}

/* =========================================================
   HEADER
   ========================================================= */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:linear-gradient(180deg,rgba(244,243,240,.96) 0%,rgba(228,226,221,.80) 100%);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  transition:transform .35s ease;
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  height:68px;
  padding-inline:var(--gut);
  max-width:var(--maxw);margin-inline:auto;
}
.brand{display:flex;align-items:center;gap:14px}
.brand img{height:42px;width:auto;display:block}
.brand-mark{
  width:38px;height:38px;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--ink);
  position:relative;
  overflow:hidden;
}
.brand-mark::after{content:"";position:absolute;inset:0;border:2px solid var(--accent);transform:scale(.78);}
.brand-mark span{
  font-family:var(--disp);font-size:1.05rem;color:#fff;line-height:1;position:relative;z-index:1;
}
.brand-name{
  font-family:var(--disp);font-size:1.55rem;letter-spacing:.02em;line-height:1;
}
.brand-sub{
  display:block;font-family:var(--mono);font-size:.56rem;letter-spacing:.28em;
  color:var(--ink-3);margin-top:2px;text-transform:uppercase;
}
.nav-desktop{display:none}
.nav-desktop ul{display:flex;align-items:center;gap:clamp(14px,2vw,30px)}
.nav-desktop a{
  font-family:var(--mono);font-size:.78rem;letter-spacing:.12em;font-weight:500;
  position:relative;padding:6px 0;text-transform:uppercase;
}
.nav-desktop a .idx{color:var(--accent-dk);font-size:.66rem;margin-right:.4em}
.nav-desktop a::after{
  content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--accent);transition:width .25s ease;
}
.nav-desktop a:hover::after{width:100%}
.nav-desktop a.is-active::after{width:100%}

.burger{
  width:46px;height:46px;border:1px solid var(--line-strong);background:transparent;
  display:grid;place-items:center;cursor:pointer;gap:5px;
}
.burger span{display:block;width:22px;height:2px;background:var(--ink);transition:.3s}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* mobile drawer */
.nav-mobile{
  position:fixed;inset:68px 0 0 0;z-index:99;
  background:var(--ink);color:var(--concrete);
  transform:translateY(-110%);transition:transform .42s cubic-bezier(.7,0,.2,1);
  padding:40px var(--gut) 60px;
  overflow-y:auto;
}
.nav-mobile.open{transform:translateY(0)}
.nav-mobile ol{counter-reset:m}
.nav-mobile li{border-top:1px solid var(--line-light)}
.nav-mobile li:last-child{border-bottom:1px solid var(--line-light)}
.nav-mobile a{
  display:flex;align-items:baseline;gap:18px;padding:22px 4px;
  font-family:var(--disp);font-size:1.9rem;
}
.nav-mobile a .idx{font-family:var(--mono);font-size:.8rem;color:var(--accent);letter-spacing:.1em}
.nav-mobile .m-foot{margin-top:36px;font-family:var(--mono);font-size:.8rem;line-height:2;color:var(--concrete-3)}
.nav-mobile .m-foot strong{color:#fff;font-size:1.4rem;display:block;font-family:var(--disp);letter-spacing:.04em}

/* =========================================================
   HERO  (A)
   ========================================================= */
.hero{
  position:relative;
  padding-top:68px;
  background:var(--ink);
  color:var(--concrete);
  overflow:hidden;
  min-height:min(92vh,920px);
  display:flex;
  flex-direction:column;
}
.hero .eyebrow{color:var(--accent)}
.hero-photo{
  position:absolute;
  inset:0;
  z-index:0;
  background:linear-gradient(150deg,#1d1a14 0%,#2a261e 45%,#100e0a 100%);
  overflow:hidden;
}
.hero-photo::before{display:none}
.hero-kenburns{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-kenburns img{width:100%;height:100%;object-fit:cover;object-position:82% top;display:block;transform-origin:78% 30%;animation:heroKen 20s ease-in-out infinite alternate;will-change:transform}
@keyframes heroKen{0%{transform:scale(1) translate(0,0)}100%{transform:scale(1.2) translate(-2.5%,-1.5%)}}
@media(prefers-reduced-motion:reduce){.hero-kenburns img{animation:none;transform:scale(1.05)}}
.hero-photo::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(16,14,9,.80) 0%,rgba(16,14,9,.34) 48%,rgba(16,14,9,.04) 100%),
    linear-gradient(180deg,rgba(16,14,9,.50) 0%,rgba(16,14,9,.18) 40%,rgba(16,14,9,.52) 76%,rgba(16,14,9,.92) 100%);
}
.hero-photo .ph-label{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  text-align:center;font-family:var(--mono);font-size:.82rem;letter-spacing:.12em;
  color:rgba(244,243,240,.62);max-width:80%;line-height:1.9;
}
.hero-photo .ph-label .tag{
  display:inline-block;border:1px solid var(--line-light);padding:6px 12px;margin-bottom:14px;
  color:var(--accent);font-size:.66rem;letter-spacing:.24em;
}
.hero-content{
  position:relative;z-index:2;
  flex:1;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding-block:clamp(40px,7vw,90px) clamp(36px,4vw,60px);
}
.hero-copy{
  font-family:var(--disp);
  font-size:clamp(3rem,12.5vw,9.5rem);
  line-height:.86;
  letter-spacing:.005em;
  margin:18px 0 0;
}
.hero-copy .l2{color:var(--accent);display:block}
.hero-lead{
  margin-top:30px;
  max-width:46ch;
  font-size:clamp(.95rem,1.2vw,1.08rem);
  line-height:2.1;
  color:rgba(244,243,240,.82);
  font-weight:400;
}
.hero-en{
  font-family:var(--mono);font-size:.74rem;letter-spacing:.22em;color:rgba(244,243,240,.5);
  margin-top:18px;text-transform:uppercase;
}

/* hero data strip — license number / founded as DATA */
.hero-data{
  position:relative;z-index:2;
  border-top:1px solid rgba(244,243,240,.18);
  background:rgba(16,14,9,.5);
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
  display:grid;
  grid-template-columns:1fr;
}
.hero-data .cell{
  padding:22px var(--gut);
  border-bottom:1px solid var(--line-light);
}
.hero-data .k{font-family:var(--mono);font-size:.62rem;letter-spacing:.2em;color:var(--accent);text-transform:uppercase}
.hero-data .v{font-family:var(--disp);font-size:clamp(1.5rem,4vw,2.1rem);margin-top:6px;letter-spacing:.02em;line-height:1}
.hero-data .v small{font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;color:var(--concrete-3);display:block;margin-top:8px;font-weight:400}

/* marquee strip */
.ticker{
  background:var(--accent);color:var(--ink);
  font-family:var(--disp);font-size:1.05rem;letter-spacing:.06em;
  white-space:nowrap;overflow:hidden;border-block:1px solid var(--ink);
}
.ticker-track{display:inline-flex;gap:0;animation:slide 28s linear infinite}
.ticker-track span{padding:11px 28px;display:inline-flex;align-items:center;gap:28px}
.ticker-track span::after{content:"／";opacity:.4}
@keyframes slide{to{transform:translateX(-50%)}}

/* =========================================================
   GENERIC SECTION FRAME
   ========================================================= */
.section{padding-block:clamp(64px,9vw,128px);position:relative}
/* 先頭セクションは固定ヘッダー(68px)分の余白を確保（モバイルで見出しがヘッダーに隠れるのを防ぐ）。トップのヒーロー(.hero)は対象外 */
main > .section:first-child{padding-top:calc(68px + clamp(48px,9vw,72px))}
.section-head{
  display:grid;grid-template-columns:1fr;gap:18px;
  margin-bottom:clamp(40px,5vw,64px);
  align-items:end;
}
.section-head .ttl{
  font-family:var(--disp);
  font-size:clamp(2.4rem,7vw,5rem);
  line-height:.95;letter-spacing:.01em;
}
.section-head .ttl .jp{
  display:block;font-family:var(--sans);font-weight:900;
  font-size:clamp(1.05rem,2.4vw,1.5rem);letter-spacing:.06em;line-height:1.5;margin-top:14px;color:var(--ink-2);
}
.section-head .meta{font-family:var(--mono);font-size:.74rem;line-height:2;color:var(--ink-3);letter-spacing:.06em}

/* =========================================================
   PHILOSOPHY (B)
   ========================================================= */
.philosophy{background:var(--paper);border-block:1px solid var(--line)}
.phil-grid{display:grid;gap:clamp(40px,6vw,80px)}
.phil-lead{
  font-family:var(--disp);
  font-size:clamp(2.1rem,6vw,4.2rem);
  line-height:1.04;letter-spacing:.02em;
}
.phil-lead .accent{display:block}
.phil-body{
  border-left:3px solid var(--accent);
  padding-left:clamp(20px,3vw,34px);
}
.phil-body h3{
  font-weight:900;font-size:1.15rem;letter-spacing:.04em;margin-bottom:18px;
  display:flex;align-items:baseline;gap:12px;
}
.phil-body h3 .no{font-family:var(--mono);color:var(--accent-dk);font-size:.78rem;font-weight:700}
.phil-body p{font-size:1rem;line-height:2.15;color:var(--ink-2);max-width:64ch}
.phil-body p + h3{margin-top:42px}
.phil-sign{
  margin-top:40px;font-family:var(--mono);font-size:.78rem;letter-spacing:.1em;color:var(--ink-3);
  display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center;
  border-top:1px solid var(--line);padding-top:22px;
}
.phil-sign b{font-family:var(--sans);font-weight:900;font-size:1rem;letter-spacing:.06em;color:var(--ink)}

/* =========================================================
   SERVICE (C)
   ========================================================= */
.svc-list{border-top:1px solid var(--line-strong)}
.svc-row{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  padding:clamp(26px,3.4vw,44px) 0;
  border-bottom:1px solid var(--line-strong);
  position:relative;transition:background .25s ease;
}
.svc-row:hover{background:var(--paper)}
.svc-row .svc-no{
  font-family:var(--disp);font-size:clamp(1.6rem,4vw,2.4rem);
  color:transparent;-webkit-text-stroke:1.4px var(--ink-3);line-height:1;
  transition:.25s;
}
.svc-row:hover .svc-no{-webkit-text-stroke:1.4px var(--accent);color:var(--accent)}
.svc-row .svc-name{
  font-weight:900;font-size:clamp(1.25rem,2.4vw,1.7rem);letter-spacing:.04em;line-height:1.4;
}
.svc-row .svc-name .en{display:block;font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;color:var(--ink-3);font-weight:500;margin-top:6px;text-transform:uppercase}
.svc-row .svc-desc{font-size:.95rem;line-height:2.05;color:var(--ink-2);max-width:60ch}
.svc-row .svc-arrow{
  font-family:var(--mono);color:var(--accent);font-size:.8rem;letter-spacing:.1em;
  opacity:0;transform:translateX(-6px);transition:.25s;
}
.svc-row:hover .svc-arrow{opacity:1;transform:translateX(0)}

/* =========================================================
   WORKS (D)
   ========================================================= */
.works{background:var(--ink);color:var(--concrete);border-block:1px solid var(--ink)}
.works .section-head .ttl{color:var(--concrete)}
.works .section-head .ttl .jp{color:var(--concrete-3)}
.works .section-head .meta{color:rgba(244,243,240,.5)}
.works .eyebrow{color:var(--accent)}
.works-grid{
  display:grid;grid-template-columns:1fr;gap:1px;
  background:var(--line-light);border:1px solid var(--line-light);
}
.work-card{position:relative;background:var(--ink);overflow:hidden}
.work-fig{
  position:relative;aspect-ratio:4/3;
  background:
    radial-gradient(110% 80% at 70% 20%, rgba(255,77,0,.1), transparent 55%),
    linear-gradient(155deg,#26221b,#131009);
  overflow:hidden;transition:transform .5s cubic-bezier(.2,.7,.2,1);
}
.work-fig::before{
  content:"";position:absolute;inset:0;
  background-image:
    linear-gradient(var(--line-light) 1px,transparent 1px),
    linear-gradient(90deg,var(--line-light) 1px,transparent 1px);
  background-size:40px 40px;opacity:.5;
}
.work-card:hover .work-fig{transform:scale(1.04)}
.work-fig picture{position:absolute;inset:0}
.work-fig img{width:100%;height:100%;object-fit:cover;display:block}
.work-fig .ph-label{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  text-align:center;font-family:var(--mono);font-size:.78rem;letter-spacing:.08em;
  color:rgba(244,243,240,.6);line-height:1.8;width:84%;
}
.work-meta{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:18px 20px;border-top:1px solid var(--line-light);
}
.work-meta .w-no{font-family:var(--mono);font-size:.68rem;color:var(--accent);letter-spacing:.12em}
.work-tag{
  font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;
  border:1px solid var(--accent);color:var(--accent);padding:4px 10px;text-transform:uppercase;
}
.work-card .w-title{padding:0 20px 20px;font-weight:700;font-size:1rem;letter-spacing:.04em;color:var(--concrete)}
.works-note{margin-top:28px;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;color:rgba(244,243,240,.45);line-height:1.9}

/* =========================================================
   COMPANY (E)  — spec sheet table
   ========================================================= */
.company{background:var(--concrete)}
.company-layout{display:grid;gap:clamp(40px,5vw,64px)}
.spec-table{width:100%;border-collapse:collapse;border-top:2px solid var(--ink)}
.spec-table th,.spec-table td{
  text-align:left;vertical-align:top;padding:18px 4px;border-bottom:1px solid var(--line);
}
.spec-table th{
  width:34%;font-family:var(--mono);font-weight:500;font-size:.78rem;letter-spacing:.1em;
  color:var(--ink-3);text-transform:uppercase;white-space:nowrap;
}
.spec-table td{font-size:.98rem;line-height:1.95;color:var(--ink)}
.spec-table td b{font-weight:700}
@media (max-width:560px){
  .spec-table th,.spec-table td{display:block;width:auto;white-space:normal;padding:14px 4px}
  .spec-table th{padding-bottom:4px;border-bottom:0}
  .spec-table td{padding-top:0}
}
.spec-table td .sub{display:block;font-family:var(--mono);font-size:.74rem;color:var(--ink-3);margin-top:4px;letter-spacing:.04em}

/* license / corp-number featured data block */
.cred-stack{display:grid;gap:18px}
.cred-card{
  background:var(--ink);color:var(--concrete);padding:clamp(24px,3vw,34px);
  border:1px solid var(--ink);position:relative;overflow:hidden;
}
.cred-card::before{
  content:"";position:absolute;top:0;left:0;width:6px;height:100%;background:var(--accent);
}
.cred-card .k{font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;color:var(--accent);text-transform:uppercase}
.cred-card .v{
  font-family:var(--disp);font-size:clamp(1.7rem,4.5vw,2.6rem);letter-spacing:.02em;line-height:1.05;margin-top:12px;
  overflow-wrap:anywhere;word-break:keep-all;
}
.cred-card .v .pre{font-family:var(--mono);font-size:.78rem;letter-spacing:.08em;color:var(--concrete-3);display:block;font-weight:400;margin-bottom:8px}
.cred-card .note{font-family:var(--mono);font-size:.7rem;color:rgba(244,243,240,.55);margin-top:14px;letter-spacing:.04em;line-height:1.8}

/* =========================================================
   RECRUIT (F)
   ========================================================= */
.recruit{
  background:var(--accent);color:var(--ink);position:relative;overflow:hidden;
  border-block:1px solid var(--ink);
}
.recruit::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(22,20,15,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(22,20,15,.08) 1px,transparent 1px);
  background-size:64px 64px;mask-image:radial-gradient(120% 120% at 80% 0%,#000,transparent 70%);
}
.recruit-inner{position:relative;z-index:2;display:grid;gap:clamp(34px,5vw,56px)}
.recruit .eyebrow{color:var(--ink)}
.recruit .eyebrow::before{background:var(--ink)}
.recruit h2{
  font-family:var(--disp);font-size:clamp(2.6rem,8vw,6rem);line-height:.9;letter-spacing:.01em;
}
.recruit h2 .jp{display:block;font-family:var(--sans);font-weight:900;font-size:clamp(1.1rem,3vw,1.9rem);line-height:1.4;margin-top:18px;letter-spacing:.03em}
.recruit p{font-size:1.02rem;line-height:2.1;max-width:60ch;font-weight:500}
.recruit-points{display:grid;gap:1px;background:rgba(22,20,15,.22);border:1px solid rgba(22,20,15,.22)}
.recruit-points li{background:var(--accent);padding:22px 24px}
.recruit-points .rk{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;display:block;margin-bottom:8px}
.recruit-points .rv{font-weight:900;font-size:1.15rem;letter-spacing:.04em;line-height:1.5}
.btn-dark{
  display:inline-flex;align-items:center;gap:14px;
  background:var(--ink);color:#fff;font-family:var(--mono);font-weight:700;
  font-size:.92rem;letter-spacing:.08em;padding:18px 30px;border:1px solid var(--ink);
  transition:.25s;align-self:start;
}
.btn-dark:hover{background:transparent;color:var(--ink)}
.btn-dark .ar{font-size:1.1rem}

/* =========================================================
   CONTACT (G)
   ========================================================= */
.contact{background:var(--ink);color:var(--concrete)}
.contact .eyebrow{color:var(--accent)}
.contact-layout{display:grid;gap:clamp(40px,6vw,72px)}
.contact-tel{display:grid;gap:18px}
.contact-tel .lbl{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;color:var(--accent);text-transform:uppercase}
.tel-big{
  font-family:var(--disp);font-size:clamp(2.6rem,9vw,5.6rem);line-height:.9;letter-spacing:.01em;
  color:var(--concrete);display:inline-flex;align-items:baseline;gap:.3em;
}
.tel-big:hover{color:var(--accent)}
.contact-hours{font-family:var(--mono);font-size:.82rem;letter-spacing:.06em;color:var(--concrete-3);line-height:2}
.contact-fax{font-family:var(--mono);font-size:.82rem;letter-spacing:.06em;color:var(--concrete-3);margin-top:6px}

/* form */
.c-form{display:grid;gap:20px}
.c-form .field{display:grid;gap:8px}
.c-form label{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;color:var(--concrete-3);
  display:flex;align-items:center;gap:10px;text-transform:uppercase;
}
.c-form label .req{color:var(--accent);font-size:.62rem;border:1px solid var(--accent);padding:1px 6px}
.c-form input,.c-form textarea,.c-form select{
  width:100%;background:transparent;border:1px solid var(--line-light);
  color:var(--concrete);font-family:var(--sans);font-size:1rem;padding:14px 16px;
  border-radius:0;transition:border-color .2s;
}
.c-form input::placeholder,.c-form textarea::placeholder{color:rgba(244,243,240,.32)}
.c-form input:focus,.c-form textarea:focus,.c-form select:focus{outline:none;border-color:var(--accent)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--accent);color:#fff;padding:8px 14px;z-index:1000}
.skip-link:focus{left:0}
.c-form textarea{resize:vertical;min-height:130px;line-height:1.9}
.c-form .row2{display:grid;gap:20px}
.btn-accent{
  background:var(--accent);color:var(--ink);border:1px solid var(--accent);
  font-family:var(--mono);font-weight:700;font-size:.95rem;letter-spacing:.1em;
  padding:18px 30px;cursor:pointer;transition:.25s;display:inline-flex;align-items:center;gap:14px;justify-content:center;
}
.btn-accent:hover{background:var(--accent-dk);border-color:var(--accent-dk)}
.form-note{font-family:var(--mono);font-size:.7rem;color:rgba(244,243,240,.45);letter-spacing:.04em;line-height:1.8}

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{background:#0d0c08;color:var(--concrete-3);padding-top:clamp(56px,7vw,90px)}
.footer-top{display:grid;gap:clamp(36px,5vw,56px);padding-bottom:clamp(48px,6vw,72px);border-bottom:1px solid var(--line-light)}
.footer-brand .brand-name{color:#fff;font-size:2.4rem}
.footer-brand .brand-sub{color:var(--concrete-3);margin-top:6px}
.footer-brand p{margin-top:18px;font-family:var(--mono);font-size:.76rem;line-height:2;letter-spacing:.04em;max-width:40ch}
.footer-cols{display:grid;gap:32px}
.f-col h4{font-family:var(--mono);font-size:.68rem;letter-spacing:.2em;color:var(--accent);text-transform:uppercase;margin-bottom:16px}
.f-col address{font-style:normal;font-size:.86rem;line-height:2.1;color:var(--concrete)}
.f-col .ofc{margin-bottom:18px}
.f-col .ofc .tag{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;color:var(--concrete-3);display:block;margin-bottom:4px}
.f-col ul li{margin-bottom:12px}
.f-col ul a{font-size:.86rem;letter-spacing:.04em;color:var(--concrete);transition:color .2s}
.f-col ul a:hover{color:var(--accent)}
.f-data{font-family:var(--mono);font-size:.78rem;line-height:2.2;letter-spacing:.03em}
.f-data .k{color:var(--concrete-3);display:block;font-size:.62rem;letter-spacing:.16em;margin-top:14px}
.f-data .k:first-child{margin-top:0}
.f-data .v{color:#fff;font-size:.92rem;overflow-wrap:anywhere;word-break:keep-all}
.footer-bottom{
  display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between;
  padding-block:26px;
}
.footer-bottom .copy{font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;color:var(--concrete-3)}
.footer-bottom .legal{display:flex;flex-wrap:wrap;gap:18px;font-family:var(--mono);font-size:.7rem;letter-spacing:.06em}
.footer-bottom .legal a:hover{color:var(--accent)}

/* back to top */
.to-top{
  position:fixed;right:18px;bottom:18px;z-index:80;
  width:48px;height:48px;background:var(--ink);color:#fff;border:1px solid var(--accent);
  display:grid;place-items:center;font-family:var(--mono);font-size:1.1rem;
  opacity:0;pointer-events:none;transition:.3s;cursor:pointer;
}
.to-top.show{opacity:1;pointer-events:auto}
.to-top:hover{background:var(--accent)}

/* reveal animation */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* contact map */
.contact-map{margin-top:clamp(40px,6vw,72px);border:1px solid var(--line-light)}
.contact-map iframe{display:block;width:100%;height:clamp(280px,42vw,420px);border:0}

/* recruit apply steps (dark section) */
.apply-steps{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.apply-steps li{display:flex;align-items:center;gap:14px;font-size:.82rem;color:var(--concrete);letter-spacing:.04em}
.apply-steps li span{color:var(--accent);font-size:.64rem;letter-spacing:.16em;border:1px solid var(--line-light);padding:5px 9px;flex:0 0 auto}

/* recruit floating widget */
.recruit-widget{
  position:fixed;left:20px;bottom:20px;z-index:80;max-width:300px;
  background:var(--ink);color:var(--concrete);
  border:1px solid var(--accent);border-left:3px solid var(--accent);
  box-shadow:0 16px 44px rgba(0,0,0,.45), 0 0 18px rgba(255,77,0,.5);
  opacity:0;transform:translateY(18px);pointer-events:none;visibility:hidden;
  transition:opacity .4s ease,transform .4s ease,visibility .4s;
  animation:rwGlow 2.4s ease-in-out infinite;
}
@keyframes rwGlow{
  0%,100%{box-shadow:0 16px 44px rgba(0,0,0,.45), 0 0 12px rgba(255,77,0,.35)}
  50%{box-shadow:0 16px 44px rgba(0,0,0,.45), 0 0 30px rgba(255,77,0,.8)}
}
@media(prefers-reduced-motion:reduce){.recruit-widget{animation:none}}
.recruit-widget.rw-show{opacity:1;transform:none;pointer-events:auto;visibility:visible}
.rw-link{display:flex;flex-direction:column;gap:7px;padding:18px 20px 16px;text-decoration:none;color:inherit}
.rw-eyebrow{font-size:.58rem;letter-spacing:.22em;color:var(--accent);text-transform:uppercase}
.rw-title{font-family:var(--disp);font-size:1.5rem;line-height:1.06;letter-spacing:.02em}
.rw-title b{color:var(--accent)}
.rw-sub{font-size:.72rem;color:var(--concrete-3);line-height:1.65}
.rw-cta{font-size:.68rem;letter-spacing:.1em;margin-top:6px;color:var(--concrete);text-transform:uppercase;transition:color .2s}
.rw-link:hover .rw-cta{color:var(--accent)}
.rw-close{position:absolute;top:4px;right:4px;background:none;border:0;color:var(--concrete-3);font-size:1.15rem;line-height:1;cursor:pointer;width:40px;height:40px;display:grid;place-items:center}
.rw-close:hover{color:var(--accent)}
@media (max-width:560px){
  .recruit-widget{left:12px;right:auto;bottom:12px;max-width:min(82vw,300px)}
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (min-width:560px){
  .hero-data{grid-template-columns:repeat(3,1fr)}
  .hero-data .cell{border-bottom:none;border-right:1px solid var(--line-light)}
  .hero-data .cell:last-child{border-right:none}
  .recruit-points{grid-template-columns:repeat(3,1fr)}
  .c-form .row2{grid-template-columns:1fr 1fr}
}

@media (min-width:768px){
  .footer-cols{grid-template-columns:repeat(3,1fr)}
  .footer-top{grid-template-columns:1.2fr 2fr}
  .works-grid{grid-template-columns:repeat(2,1fr)}
  .svc-row{grid-template-columns:auto 1fr 1.4fr auto;align-items:center;gap:clamp(20px,3vw,48px)}
  .svc-row .svc-no{grid-row:1}
  .section-head{grid-template-columns:1fr auto;gap:30px}
  .recruit-inner{grid-template-columns:1.1fr .9fr;align-items:start}
  .phil-grid{grid-template-columns:.9fr 1.1fr;align-items:start}
}

@media (min-width:960px){
  .nav-desktop{display:block}
  .burger{display:none}
  .header-cta{margin-left:24px}
  .company-layout{grid-template-columns:1.4fr 1fr;align-items:start}
  .contact-layout{grid-template-columns:.9fr 1.1fr;align-items:start}
  .works-grid{grid-template-columns:repeat(3,1fr)}
  .hero-content{display:grid;grid-template-columns:1.5fr 1fr;align-items:end;gap:48px}
  .hero-side{padding-bottom:6px}
}

@media (max-width:959px){
  .header-cta{display:none}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;transition-duration:.001ms !important}
  .reveal{opacity:1;transform:none}
}