/* ============================================================
   D-Connect デジタルパートナーズ 共通スタイル
   全ページで読み込む(変数 / リセット / ナビ / フッター / 共通見出し / リビール)
   ============================================================ */
:root {
  --black:#060606;--dark:#0b0b0b;--card:#0f0f0f;--border:#1c1c1c;
  --white:#f2efe8;--muted:#505050;--accent:#b0b0b0;
  --gold:#c9a84c;--gold-dim:rgba(201,168,76,0.08);--gold-line:rgba(201,168,76,0.35);
  --en:'Playfair Display','Noto Serif JP',serif;--jp:'Noto Serif JP',serif;--mono:'Space Mono',monospace;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--black);color:var(--white);font-family:var(--jp);font-weight:300;overflow-x:hidden}
::-webkit-scrollbar{width:3px}
::-webkit-scrollbar-thumb{background:var(--gold)}

/* SCROLL BAR */
#scrollProg{position:fixed;top:0;left:0;z-index:999;height:2px;width:0%;background:linear-gradient(to right,var(--gold),rgba(201,168,76,.4));pointer-events:none}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:20px 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid transparent;transition:border-color .3s,background .3s}
nav.scrolled{background:rgba(6,6,6,.96);border-color:rgba(201,168,76,.1);backdrop-filter:blur(12px)}
.nav-logo{text-decoration:none;display:flex;align-items:center}
.nav-links{display:flex;gap:36px;list-style:none}
.nav-links a{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:#c3beb1;text-decoration:none;text-transform:uppercase;transition:color .2s;position:relative}
.nav-links a::after{content:'';position:absolute;bottom:-4px;left:0;right:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform .25s ease}
.nav-links a:hover{color:var(--white)}
.nav-links a:hover::after{transform:scaleX(1);transform-origin:left}
.nav-cta{font-family:var(--mono);font-size:11px;letter-spacing:.15em;padding:10px 22px;border:1px solid var(--gold-line);color:var(--gold);text-decoration:none;text-transform:uppercase;position:relative;overflow:hidden;transition:color .25s}
.nav-cta::before{content:'';position:absolute;inset:0;background:var(--gold);transform:translateX(-101%);transition:transform .25s ease;z-index:-1}
.nav-cta:hover{color:var(--black)}
.nav-cta:hover::before{transform:translateX(0)}

/* HAMBURGER */
.nav-hbg{display:none;flex-direction:column;justify-content:center;align-items:center;width:40px;height:40px;gap:6px;background:none;border:none;cursor:pointer;}
.nav-hbg span{display:block;width:22px;height:1px;background:var(--white);transition:transform .3s,opacity .3s;transform-origin:center}
.nav-hbg.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-hbg.open span:nth-child(2){opacity:0}
.nav-hbg.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nav-ovl{visibility:hidden;position:fixed;inset:0;z-index:150;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);opacity:0;transition:opacity .3s,visibility .3s}
.nav-ovl.show{visibility:visible;opacity:1}
.nav-drw{position:fixed;top:0;right:0;bottom:0;z-index:160;width:min(320px,85vw);background:#0a0a0a;border-left:1px solid var(--border);display:flex;flex-direction:column;padding:80px 36px 48px;transform:translateX(100%);transition:transform .4s cubic-bezier(.4,0,.2,1)}
.nav-drw.open{transform:translateX(0)}
.nav-drw-close{position:absolute;top:20px;right:24px;background:none;border:none;color:var(--muted);font-size:18px;cursor:pointer;transition:color .2s}
.nav-drw-close:hover{color:var(--white)}
.nav-drw-links{list-style:none;flex:1}
.nav-drw-links li{border-bottom:1px solid var(--border)}
.nav-drw-link{display:block;padding:20px 0;font-size:16px;color:#c9c4b8;text-decoration:none;letter-spacing:.06em;transition:color .2s,padding-left .2s}
.nav-drw-link:hover{color:var(--white);padding-left:8px}
.nav-drw-cta{display:block;margin-top:40px;padding:16px 24px;text-align:center;font-family:var(--mono);font-size:11px;letter-spacing:.15em;text-decoration:none;text-transform:uppercase;background:var(--gold);color:var(--black);font-weight:700}

/* COMMON */
section{padding:120px 48px}
.sec-lbl{font-family:var(--mono);font-size:10px;letter-spacing:.3em;color:var(--gold);opacity:.7;text-transform:uppercase;margin-bottom:20px}
.sec-ttl{font-family:var(--en);font-size:clamp(48px,6vw,88px);font-weight:500;line-height:1.05;letter-spacing:.04em;text-transform:uppercase}

/* REVEAL */
.rv{opacity:0;transform:translateY(40px);transition:opacity 1s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1);will-change:opacity,transform}
.rv.on{opacity:1;transform:none}
.d1{transition-delay:.1s}
.d2{transition-delay:.2s}
.d3{transition-delay:.3s}

/* FOOTER */
footer{padding:80px 48px 40px;border-top:1px solid var(--border)}
.ft-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:60px;margin-bottom:60px}
.ft-brand{font-family:var(--en);font-size:24px;letter-spacing:.1em;background:linear-gradient(to right,var(--gold),rgba(201,168,76,.4));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:20px}
.ft-desc{font-size:13px;line-height:2;color:#b8b3a6;font-weight:400}
.ft-col-ttl{font-family:var(--mono);font-size:10px;letter-spacing:.25em;color:var(--gold);opacity:.8;text-transform:uppercase;margin-bottom:24px}
.ft-links{list-style:none}
.ft-links li{margin-bottom:12px}
.ft-links a{font-size:13px;color:#b0aa9d;text-decoration:none;transition:color .2s}
.ft-links a:hover{color:var(--gold)}
.ft-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(201,168,76,.1);padding-top:32px}
.ft-copy{font-family:var(--mono);font-size:11px;color:#8f8a7f;letter-spacing:.1em}
.ft-soc{display:flex;gap:24px}
.ft-soc a{font-family:var(--mono);font-size:11px;color:#8f8a7f;text-decoration:none;letter-spacing:.1em;transition:color .2s}
.ft-soc a:hover{color:var(--gold)}

/* MOBILE (共通) */
@media(max-width:768px){
  nav{padding:14px 20px}
  .nav-links,.nav-cta{display:none}
  .nav-hbg{display:flex}
  section{padding:72px 20px}
  .ft-grid{grid-template-columns:1fr;gap:40px}
  footer{padding:60px 20px 32px}
  .ft-bottom{flex-direction:column;gap:16px;align-items:flex-start}
}