/* 内田登記測量事務所 — shared chrome for sub pages (top band, menu, footer) */
:root{
  --ink:#01050c; --ink-2:#06111a; --teal:#3ee8d4; --gold:#ffcf66;
  --on-dark:#e9fbf8; --on-dark-dim:rgba(233,251,248,.62); --on-dark-line:rgba(233,251,248,.26);
  --font-jp:"Zen Kaku Gothic New", system-ui, sans-serif; --font-en:"Jost", sans-serif; --font-mono:"IBM Plex Mono", monospace;
}

/* ---------- top band with an animated background ---------- */
.sub-hero{ position:relative; isolation:isolate; overflow:hidden; color:var(--on-dark); background:var(--ink);
  height:clamp(320px,50vh,480px); --accent:var(--teal); font-family:var(--font-jp); }
.sub-hero > canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; z-index:-2; }
.sub-hero__veil{ position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(90deg, rgba(1,5,12,.86) 0%, rgba(1,5,12,.5) 38%, rgba(1,5,12,0) 64%),
             linear-gradient(0deg, rgba(1,5,12,.55) 0%, rgba(1,5,12,0) 40%); }
.sub-hero__title{ position:absolute; left:clamp(20px,6.5vw,104px); bottom:clamp(34px,7vh,60px); right:20px; z-index:1; }
.sub-hero__eyebrow{ font-family:var(--font-mono); font-size:12px; letter-spacing:.32em; color:var(--accent); margin:0 0 14px; display:flex; align-items:center; gap:12px; }
.sub-hero__eyebrow::before{ content:""; width:24px; height:1px; background:var(--accent); }
.sub-hero__en{ font-family:var(--font-en); font-weight:200; font-size:clamp(38px,6vw,84px); letter-spacing:.12em; line-height:1; margin:0; color:var(--on-dark); }
.sub-hero__ja{ font-size:clamp(15px,1.4vw,18px); letter-spacing:.2em; margin:16px 0 0; font-weight:500; color:var(--on-dark); }

/* theme accents per background */
.sub-hero[data-theme="contour"]{ --accent:#6cc2ff; background:#030716; }
.sub-hero[data-theme="contour"] .sub-hero__veil{ background:linear-gradient(90deg, rgba(3,7,22,.82) 0%, rgba(3,7,22,.4) 40%, rgba(3,7,22,0) 64%), linear-gradient(0deg, rgba(3,7,22,.6) 0%, rgba(3,7,22,0) 42%); }
.sub-hero[data-theme="cad"]{ --accent:#46f5c0; background:#020504; }
.sub-hero[data-theme="cad"] .sub-hero__veil{ background:linear-gradient(90deg, rgba(2,5,4,.92) 0%, rgba(2,5,4,.62) 36%, rgba(2,5,4,0) 60%); }
.sub-hero[data-theme="cad"]::after{ content:""; position:absolute; inset:12px; border:1px solid rgba(70,245,192,.3); pointer-events:none; z-index:0; }
.sub-hero[data-theme="tiles"]{ --accent:#f5f5f5; background:#050505; }
.sub-hero[data-theme="tiles"] .sub-hero__veil{ background:linear-gradient(90deg, rgba(5,5,5,.9) 0%, rgba(5,5,5,.55) 40%, rgba(5,5,5,0) 66%); }
.sub-hero[data-theme="gnss"]{ --accent:#3ee8d4; background:#01050c; }
.sub-hero[data-theme="gnss"] .sub-hero__veil{ background:linear-gradient(90deg, rgba(1,5,12,.9) 0%, rgba(1,5,12,.55) 38%, rgba(1,5,12,0) 62%); }

/* ---------- site navigation (shared with the homepage) ---------- */
.site-nav{ position:absolute; top:0; left:0; right:0; z-index:5; display:flex; align-items:center; justify-content:space-between; padding:26px clamp(20px,5vw,64px); font-family:var(--font-jp); }
.site-nav a{ color:inherit; text-decoration:none; }
.site-brand{ display:flex; align-items:center; gap:14px; color:var(--on-dark); }
.site-brand img{ height:30px; width:auto; filter:brightness(0) invert(1); opacity:.95; display:block; }
.site-brand b{ font-weight:500; font-size:14.5px; letter-spacing:.2em; color:var(--on-dark); }
.site-links{ display:flex; align-items:center; gap:clamp(20px,3.2vw,48px); list-style:none; margin:0; padding:0; font-size:inherit; }
.site-links li{ margin:0; }
.site-links a{ font-family:var(--font-en); font-weight:300; font-size:13px; letter-spacing:.26em; color:var(--on-dark-dim); padding:6px 0; position:relative; transition:color .2s; }
.site-links a:hover, .site-links a.on{ color:var(--on-dark); }
.site-links a.on::after{ content:""; position:absolute; left:0; right:.26em; bottom:0; height:1px; background:var(--accent, var(--teal)); }
.site-links a.pill{ border:1px solid var(--on-dark-line); border-radius:999px; padding:7px 20px; color:var(--on-dark); }
.site-links a.pill:hover{ border-color:var(--accent, var(--teal)); }
.site-burger{ display:none; width:42px; height:42px; border:1px solid var(--on-dark-line); border-radius:50%; background:none; position:relative; cursor:pointer; padding:0; }
.site-burger::before,.site-burger::after{ content:""; position:absolute; left:12px; right:12px; height:1px; background:var(--on-dark); transition:transform .25s, top .25s; }
.site-burger::before{ top:16px; } .site-burger::after{ top:24px; }
body.menu-open .site-burger::before{ top:20px; transform:rotate(45deg); }
body.menu-open .site-burger::after{ top:20px; transform:rotate(-45deg); }

/* full-screen menu for phones */
.site-menu{ position:fixed; inset:0; z-index:4; background:rgba(1,5,12,.96); display:none; flex-direction:column; justify-content:center; padding:0 34px; }
.site-menu a{ font-family:var(--font-en); font-weight:200; font-size:34px; letter-spacing:.18em; color:var(--on-dark); text-decoration:none; padding:12px 0; border-bottom:1px solid rgba(233,251,248,.1); }
.site-menu a small{ display:block; font-family:var(--font-jp); font-size:12px; letter-spacing:.2em; color:var(--on-dark-dim); margin-top:2px; }
body.menu-open .site-menu{ display:flex; }
body.menu-open{ overflow:hidden; }
body.menu-open .site-nav{ position:fixed; }

/* ---------- footer ---------- */
.site-footer{ background:#01050c; color:var(--on-dark-dim); border-top:1px solid rgba(62,232,212,.14); padding:56px 20px 46px; text-align:center; font-family:var(--font-jp); font-size:12.5px; letter-spacing:.08em; line-height:1.9; }
.site-footer a{ color:inherit; }
.site-footer__brand{ display:inline-flex; align-items:center; gap:12px; color:var(--on-dark); font-size:16px; letter-spacing:.2em; font-weight:500; margin-bottom:14px; text-decoration:none; }
.site-footer__brand img{ height:28px; width:auto; filter:brightness(0) invert(1); }
.site-footer__links{ margin-top:16px; display:flex; justify-content:center; gap:22px; flex-wrap:wrap; }
.site-footer__links a{ text-decoration:underline; text-underline-offset:3px; }
.site-footer__links a:hover{ color:var(--on-dark); }
.site-footer__copy{ margin-top:16px; opacity:.55; font-family:var(--font-en); letter-spacing:.14em; }

@media (max-width:760px){
  .site-links li{ display:none; } .site-burger{ display:block; }
  .site-brand b{ font-size:13px; letter-spacing:.14em; }
  .sub-hero{ height:clamp(300px,46vh,400px); }
  .sub-hero__veil, .sub-hero[data-theme] .sub-hero__veil{ background:linear-gradient(0deg, rgba(1,5,12,.95) 0%, rgba(1,5,12,.82) 42%, rgba(1,5,12,.35) 70%, rgba(1,5,12,.1) 100%); }
  .sub-hero__eyebrow{ letter-spacing:.2em; font-size:11px; }
}