:root { --ink:#121517; --paper:#f3f5f7; --line:rgba(18,21,23,.18); --strong-line:rgba(18,21,23,.72); --muted:#62686a; --dark:#141515; --panel:#1d1f1f; --dark-line:rgba(255,255,255,.19); --dark-strong-line:rgba(238,240,239,.72); --blue:#4967ff; --blue-on-dark:#5374ff; --font-sans:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue","Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic","YuGothic",Meiryo,Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--paper); -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body { margin:0; font-family:var(--font-sans); font-weight:400; color:var(--ink); background:var(--paper); -webkit-font-smoothing:antialiased; font-kerning:normal; font-feature-settings:"palt" 1,"kern" 1; line-break:strict; text-spacing-trim:trim-start; text-autospace:normal; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
img { max-width:100%; height:auto; }
h1,h2,h3,h4,p,li,dt,dd,a,button,span { font-feature-settings:"palt" 1,"kern" 1; }
h1,h2,h3 { text-wrap:balance; }
p,li,dd { hanging-punctuation:allow-end; }
.hero-copy,.fact p,.cases-head p,.case-copy p,.section-intro,.overview-layout li span,.overview-card-grid p,.dark-card p,.process-grid p,.note,.equipment-card p,.compare-grid li,.pricing-grid p,.about-hero p,.company dd,.placeholder-copy,.message-copy,.consulting-teaser-body > p,.consulting-lead { text-align:justify; text-justify:inter-character; text-justify-trim:punctuation; }
.theme-dark { background:var(--dark); color:#f4f4f1; min-height:100vh; }
.theme-light { background:var(--paper); min-height:100vh; }
.page-shell { width:min(1360px, calc(100% - 96px)); margin-inline:auto; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.eyebrow { position:relative; left:3px; display:block; font-size:11px; line-height:1; letter-spacing:.15em; text-transform:uppercase; font-weight:700; font-feature-settings:"kern" 1,"case" 1; }

.site-header { --header-surface-rgb:243,245,247; --header-surface-opacity:0; --header-blur:0px; height:92px; padding:0 48px; display:flex; align-items:center; justify-content:space-between; position:fixed; inset:0 0 auto; z-index:30; border-bottom:1px solid transparent; background:rgba(var(--header-surface-rgb),var(--header-surface-opacity)); -webkit-backdrop-filter:blur(var(--header-blur)); backdrop-filter:blur(var(--header-blur)); transition:background-color .08s linear,-webkit-backdrop-filter .08s linear,backdrop-filter .08s linear; }
.brand img { display:block; width:72px; }
.site-header nav { display:flex; gap:clamp(16px,1.8vw,26px); align-items:center; font-size:clamp(10.5px,.82vw,12px); font-weight:600; }
.site-header nav a { position:relative; padding:12px 0; white-space:nowrap; }
.site-header nav a::after { content:""; position:absolute; left:0; right:100%; bottom:5px; height:1px; background:currentColor; transition:right .25s ease; }
.site-header nav a:hover::after { right:0; }
.site-header-dark .brand img,.site-footer-dark img { filter:invert(1); }
.theme-dark > .site-header { --header-surface-rgb:20,21,21; }
.menu-button { display:none; width:42px; height:42px; border:1px solid currentColor; color:inherit; background:transparent; align-items:center; justify-content:center; flex-direction:column; gap:6px; }
.menu-button span:not(.sr-only) { width:18px; height:1px; background:currentColor; }

.home-hero { --home-title-size:clamp(54px,7.1vw,116px); min-height:100vh; padding:calc(13vh + 92px) 0 54px; display:grid; grid-template-columns:1.4fr .85fr; grid-template-rows:auto 1fr auto; gap:40px; align-items:start; position:relative; }
.home-hero .eyebrow { grid-column:1/-1; }
.hero-title-group { grid-column:1; grid-row:1 / 3; align-self:start; font-size:var(--home-title-size); transform:translateY(-18px); }
.home-hero h1 { font-size:1em; line-height:1.22; letter-spacing:-.055em; margin:0; font-weight:400; }
.hero-identity { position:relative; left:6px; display:block; width:3.6em; max-width:100%; height:auto; margin:0 0 32px; }
.hero-copy { grid-column:2; grid-row:1 / 3; align-self:end; font-size:clamp(15.5px,1.49vw,22.9px); line-height:1.5; margin:0 0 8px; max-width:640px; border-top:3px solid var(--strong-line); padding-top:1em; }

.split-section { display:grid; grid-template-columns:.8fr 1.65fr; gap:8vw; padding-block:130px; border-top:1px solid var(--line); }
.service-teaser { grid-template-columns:.95fr 1.65fr; gap:3vw; }
.consulting-teaser { grid-template-columns:.95fr 1.65fr; gap:3vw; }
.consulting-teaser-body { align-self:start; max-width:900px; }
.section-body.consulting-teaser-body h3 { margin:0 0 24px; }
.consulting-teaser-body > p { max-width:820px; margin:0; color:var(--muted); font-size:17px; line-height:1.75; }
.section-lead h2 { font-size:clamp(34px,4.2vw,64px); line-height:1.15; letter-spacing:-.035em; font-weight:400; margin:18px 0 0; }
#service-heading { font-size:clamp(35.1785px,3.8947625vw,55.2805px); white-space:nowrap; }
.section-body h3 { font-size:clamp(21px,2.1vw,33px); line-height:1.5; letter-spacing:-.025em; font-weight:500; margin:42px 0; max-width:820px; }
.media-frame { overflow:hidden; aspect-ratio:16/8.5; background:#e4e8ec; }
.media-frame img,
.media-frame video { display:block; width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.media-frame:hover img { transform:scale(1.018); }
.media-frame-dark { aspect-ratio:auto; background:transparent; padding:0; }
.media-frame-dark img,
.media-frame-dark video { display:block; width:100%; height:auto; object-fit:contain; }
.fact-grid { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--line); margin-top:26px; }
.fact { padding:24px 16px 28px 0; border-bottom:1px solid var(--line); }
.fact:nth-child(odd) { border-right:1px solid var(--line); }
.fact:nth-child(even) { padding-left:16px; }
.fact span { font-size:16px; line-height:1.35; font-weight:500; }
.fact p { color:var(--muted); margin:10px 0 0; line-height:1.55; font-size:14px; max-width:none; width:100%; }
.fact-grid:not(.fact-grid-three) { border-top:3px solid var(--strong-line); }
.fact-grid-product { grid-template-columns:repeat(4,1fr); }
.fact-grid-product .fact { padding-inline:16px; border-right:1px solid var(--line); }
.fact-grid-product .fact:nth-child(4n+1) { padding-left:0; }
.fact-grid-product .fact:nth-child(4n) { border-right:0; }
.fact-grid-three { grid-template-columns:repeat(3,1fr); border-top:3px solid var(--strong-line); }
.fact-grid-three .fact { border-right:1px solid var(--line); padding-left:20px; }
.fact-grid-three .fact:first-child { padding-left:0; }
.fact-grid-three .fact:last-child { border-right:0; }
.text-link { display:inline-flex; justify-content:space-between; align-items:center; gap:32px; min-width:230px; min-height:52px; border:1px solid currentColor; padding:0 18px; margin-top:34px; background:#ebeef2; font-size:13px; font-weight:600; transition:background-color .25s ease,color .25s ease; }
.text-link:hover { background:#e2e7ed; }
.theme-dark .text-link { background:color-mix(in srgb,var(--dark) 96%,white); }
.theme-dark .text-link:hover { background:color-mix(in srgb,var(--dark) 90%,white); }
.text-link span { width:8px; height:8px; flex:0 0 auto; border-top:1px solid currentColor; border-right:1px solid currentColor; font-size:0; transform:rotate(45deg); }

.cases { padding:130px 0; background:var(--paper); color:var(--ink); overflow:hidden; border-top:1px solid var(--line); }
.cases-head { display:flex; align-items:end; justify-content:space-between; margin-bottom:54px; }
.cases-head h2 { font-size:clamp(34px,4.2vw,64px); line-height:1.15; margin:16px 0 0; font-weight:400; letter-spacing:-.035em; }
.cases-head p { color:var(--muted); line-height:1.55; font-size:clamp(11px,1.2vw,14px); margin:0; text-align:right; white-space:nowrap; }
.case-rail { --case-card-width:min(740px,66vw); display:flex; gap:18px; padding-inline:max(20px,calc((100vw - var(--case-card-width))/2)); overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-inline:calc((100vw - var(--case-card-width))/2); scrollbar-width:none; }
.case-rail::-webkit-scrollbar { display:none; }
.case-card { flex:0 0 var(--case-card-width); scroll-snap-align:center; border:1px solid var(--line); background:#ebeef2; }
.case-image { height:min(34.7vw,361px); position:relative; overflow:hidden; }
.case-image img { object-fit:cover; object-position:center center; transition:transform .7s ease; }
.case-card:hover .case-image img { transform:scale(1.025); }
.case-copy { display:grid; grid-template-columns:180px 1fr; padding:30px; gap:12px 30px; border-top:1px solid var(--line); }
.case-copy span { font-size:10px; letter-spacing:.12em; color:#747a7b; }
.case-copy h3 { font-size:clamp(22px,2.3vw,36px); font-weight:400; margin:0; letter-spacing:-.02em; }
.case-copy p { grid-column:2; color:var(--muted); margin:6px 0 0; line-height:1.55; font-size:14px; }
.case-controls { display:flex; justify-content:flex-end; gap:8px; margin-top:28px; }
.case-controls button { width:54px; height:54px; border:1px solid var(--line); background:transparent; color:var(--ink); cursor:pointer; transition:.2s; }
.case-controls button:hover { background:var(--ink); color:white; }
.contact-band { padding-block:150px; border-top:1px solid var(--line); text-align:center; }
.contact-band > .eyebrow,.dark-contact > .eyebrow,.video-hero-copy > .eyebrow { left:0; }
.contact-band h2,.dark-contact h2 { font-size:clamp(34px,4.2vw,64px); line-height:1.15; font-weight:400; letter-spacing:-.035em; margin:26px 0 20px; }
.contact-band p,.dark-contact p { color:var(--muted); margin:0 auto 42px; line-height:1.55; text-align:center; }
.button { display:inline-flex; align-items:center; justify-content:center; min-width:260px; min-height:58px; border:1px solid currentColor; font-size:13px; font-weight:700; transition:.25s; }
.button-dark { color:white; background:var(--ink); border-color:var(--ink); }
.button-dark:hover { background:transparent; color:var(--ink); }
.button-light { color:white; background:transparent; }
.button-light:hover { color:black; background:white; }
/* 契約中の方向けの導入ボタン。白文字とのコントラストを AA に乗せるため、--blue より明度を 0.02 下げた値（4.91:1） */
.button-blue { flex-direction:column; gap:3px; color:#ffffff; background:#4460f8; border-color:#4460f8; }
.button-blue:hover { color:var(--blue-on-dark); background:transparent; border-color:var(--blue-on-dark); }
.button-blue small { font-size:10.5px; font-weight:600; letter-spacing:.02em; opacity:.82; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:stretch; gap:14px; }
.hero-actions .button { min-width:230px; }
.site-footer { min-height:150px; border-top:1px solid var(--line); margin:0 48px; padding-block:38px; display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:20px; font-size:11px; color:var(--muted); }
.site-footer > a { align-self:start; }
.site-footer-right { justify-self:end; display:flex; flex-direction:column; align-items:flex-end; gap:18px; }
.footer-topline { display:flex; align-items:center; justify-content:flex-end; }
.footer-legal { display:flex; align-items:center; justify-content:flex-end; gap:clamp(16px,1.8vw,26px); font-size:clamp(10.5px,.82vw,12px); font-weight:600; white-space:nowrap; }
.footer-legal a { position:relative; padding-bottom:7px; }
.footer-legal a::after { content:""; position:absolute; left:0; right:100%; bottom:2px; height:1px; background:currentColor; transition:right .25s ease; }
.footer-legal a:hover::after { right:0; }
.back-to-top { width:32px; height:32px; margin-left:clamp(34px,3.5vw,52px); border-radius:50%; display:grid; place-items:center; color:var(--ink); background:transparent; flex:0 0 auto; transition:opacity .25s; }
.back-to-top::before { content:""; width:10px; height:10px; border-top:2px solid currentColor; border-left:2px solid currentColor; transform:translateY(3px) rotate(45deg); }
.back-to-top:hover { opacity:.68; }
.site-footer-dark .back-to-top { color:#fff; background:transparent; }
.site-footer-dark { border-color:var(--dark-line); color:#838887; }

.dark-hero { min-height:100vh; display:grid; grid-template-columns:minmax(400px,.8fr) minmax(0,1.2fr); gap:4vw; align-items:center; padding-block:152px 158px; position:relative; isolation:isolate; overflow:hidden; }
.dark-hero.page-shell { width:100%; max-width:none; padding-left:max(48px,calc((100vw - 1360px)/2)); padding-right:0; }
.dark-hero::before { content:""; position:absolute; inset:-12%; z-index:0; background:url("../images/source/vv_capture01.png") 58% 20%/cover no-repeat; filter:blur(7px) saturate(1.28) contrast(1.59) brightness(1.28); opacity:.42; transform:scale(1.08); -webkit-mask-image:linear-gradient(90deg,transparent 0 2%,rgba(0,0,0,.5) 18%,#000 55%); mask-image:linear-gradient(90deg,transparent 0 2%,rgba(0,0,0,.5) 18%,#000 55%); pointer-events:none; }
.dark-hero::after { content:""; position:absolute; inset:0; z-index:0; background:radial-gradient(circle,rgba(0,0,0,.41) 0 .5px,transparent .65px) 0 0/3px 3px,linear-gradient(180deg,transparent 62%,rgba(20,21,21,.18) 77%,var(--dark) 100%),linear-gradient(90deg,var(--dark) 0 2%,rgba(20,21,21,.78) 14%,rgba(20,21,21,.18) 100%); pointer-events:none; }
.dark-hero > * { position:relative; z-index:1; }
.dark-hero-copy .viewer-logo { width:min(420px,96%); height:auto; margin:26px 0 34px; }
.dark-hero-copy h1 { font-size:clamp(24.2px,2.024vw,41.8px); line-height:1.38; letter-spacing:-.025em; font-weight:400; margin:0 0 40px; white-space:nowrap; }
.dark-hero-media { position:relative; box-shadow:none; }
.dark-hero-media img,
.dark-hero-media video { display:block; width:100%; height:auto; }
.local-nav,.local-nav-surface { --local-nav-surface-opacity:0; --local-nav-border-opacity:.19; --local-nav-inner-border-opacity:0; --local-nav-blur:0px; min-height:68px; position:sticky; top:92px; z-index:25; background:rgba(20,21,21,var(--local-nav-surface-opacity)); border-top:1px solid rgba(255,255,255,var(--local-nav-border-opacity)); -webkit-backdrop-filter:blur(var(--local-nav-blur)); backdrop-filter:blur(var(--local-nav-blur)); transition:background-color .08s linear,border-color .08s linear,-webkit-backdrop-filter .08s linear,backdrop-filter .08s linear; }
.local-nav { display:flex; align-items:center; gap:32px; margin-top:-68px; font-size:11px; color:#999f9d; overflow-x:auto; white-space:nowrap; }
.local-nav-surface { width:100%; }
.product-local-nav { --local-nav-border-opacity:0; --local-nav-inner-border-opacity:.19; margin-top:-68px; }
.service-local-nav { --local-nav-border-opacity:0; --local-nav-inner-border-opacity:.19; margin-top:-68px; }
.local-nav-links { min-height:68px; display:flex; align-items:center; gap:32px; border-top:1px solid rgba(255,255,255,var(--local-nav-inner-border-opacity)); font-size:11px; color:#999f9d; overflow-x:auto; white-space:nowrap; transition:border-color .08s linear; }
.local-nav,.local-nav-links { scrollbar-width:none; -ms-overflow-style:none; -webkit-overflow-scrolling:touch; overscroll-behavior-inline:contain; }
.local-nav::-webkit-scrollbar,.local-nav-links::-webkit-scrollbar { display:none; width:0; height:0; }
.local-nav a:hover,.local-nav-links a:hover { color:white; }
#overview h2 { margin-bottom:48px; }
.section-intro { font-size:17px; color:#b5bab8; margin:-28px 0 42px; line-height:1.55; }
.overview-section h2,.strength-section h2,.formats-section h2,.domain-section h2,.features-section h2,.security-section h2,.architecture-section h2,.service-section h2 { position:relative; display:block; max-width:none; margin-bottom:0; padding-bottom:34px; border:0; font-weight:400; }
.overview-section h2::after,.strength-section h2::after,.formats-section h2::after,.domain-section h2::after,.features-section h2::after,.security-section h2::after,.architecture-section h2::after,.service-section h2::after { content:""; position:absolute; right:0; bottom:0; left:0; height:1px; background:rgba(178,184,182,.38); }
.strength-section .section-intro { margin:44px 0 48px; color:#f4f4f1; font-size:clamp(17px,1.7vw,24px); font-weight:600; text-align:left; }
.formats-section .section-intro { margin:44px 0 48px; color:#f4f4f1; font-size:clamp(17px,1.7vw,24px); font-weight:600; text-align:left; }
@media (min-width: 621px) { .formats-section .format-grid { grid-template-columns:repeat(2,1fr); } }
.domain-section .section-intro { margin:44px 0 48px; color:#f4f4f1; font-size:clamp(17px,1.7vw,24px); font-weight:600; text-align:left; }
.security-section .detail-card { min-height:166px; }
.security-section .section-intro { margin:38px 0 34px; color:#f4f4f1; font-size:clamp(17px,1.7vw,24px); font-weight:600; text-align:left; }
.architecture { background:transparent; border:0; padding:0; }
.architecture img { display:block; width:100%; filter:brightness(1.15); }
.architecture .product-architecture-diagram { display:block; width:100%; height:auto; }
.product-architecture-diagram .architecture-node { fill:#1a1c1c; stroke:rgba(238,240,239,.14); stroke-width:1; }
.product-architecture-diagram .architecture-node-title { font-family:"Noto Sans JP",system-ui,sans-serif; font-size:13px; font-weight:600; fill:#f4f4f1; letter-spacing:.01em; }
.product-architecture-diagram .architecture-node-subtitle { font-family:"Noto Sans JP",system-ui,sans-serif; font-size:10.5px; fill:rgba(244,244,241,.52); }
.product-architecture-diagram .architecture-column-label { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:9px; letter-spacing:.2em; fill:rgba(244,244,241,.34); }
.product-architecture-diagram .architecture-boundary { fill:none; stroke:rgba(238,240,239,.16); stroke-width:1; stroke-dasharray:2 4; }
.product-architecture-diagram .architecture-connector { fill:none; stroke:rgba(238,240,239,.30); stroke-width:1; }
.product-architecture-diagram .architecture-junction { fill:#3b82f6; }
.product-architecture-diagram .architecture-edge-label { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:9px; letter-spacing:.12em; fill:#3b82f6; opacity:.85; }
.architecture-section .architecture { margin-top:38px; }
.cross-link { position:relative; display:grid; grid-template-columns:1fr 1.2fr; gap:7vw; align-items:center; padding:64px clamp(28px,4vw,56px) 52px; border:1px solid var(--dark-line); color:inherit; transition:box-shadow .2s ease; }
.cross-link:hover,.cross-link:focus-visible { box-shadow:inset 0 0 0 1px rgba(244,244,241,.72); }
.cross-link:focus-visible { outline:2px solid #f4f4f1; outline-offset:4px; }
.cross-link-label { position:absolute; top:0; left:50%; padding:0 clamp(16px,2.5vw,32px); background:var(--dark); color:#f4f4f1; font-size:clamp(17px,1.7vw,24px); font-weight:600; letter-spacing:.02em; line-height:1.2; white-space:nowrap; transform:translate(-50%,-50%); }
.cross-link .eyebrow { margin-bottom:22px; }
.cross-link h2 { margin:0; font-size:clamp(30px,4vw,56px); line-height:1.15; font-weight:400; letter-spacing:-.035em; }
.service-page .cross-link h2 { font-size:clamp(28px,2.8vw,40px); white-space:nowrap; }
.cross-link-cta { pointer-events:none; }
.cross-link img,
.cross-link video { display:block; width:100%; height:auto; aspect-ratio:16/9; align-self:center; object-fit:cover; }
.cross-link video { pointer-events:none; }
.dark-contact { text-align:center; padding-block:150px; }
.product-page .dark-contact h2 { font-size:clamp(31px,3.78vw,58px); }
.dark-contact p { color:#929795; }

/* ==== product / service のセクション罫組み（塗りカードを廃し、TOPの .fact-grid と同じ罫線構成に） ==== */
.sec { display:grid; grid-template-columns:.8fr 1.65fr; column-gap:8vw; row-gap:0; padding-block:118px; border-top:1px solid var(--dark-line); }
.sec-lead { align-self:start; }
.sec-lead h2 { margin:18px 0 0; font-size:clamp(32px,3.2vw,46px); line-height:1.14; letter-spacing:-.035em; font-weight:400; word-break:auto-phrase; }
.sec-index { display:block; margin:0 0 14px; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10px; letter-spacing:.2em; color:var(--blue-on-dark); }
.sec-body { min-width:0; }
/* システム構成図だけ全幅。viewBox 1280x620 を本文カラム幅に入れると図中の文字が8px台まで縮むため */
.sec-wide .sec-body { grid-column:1 / -1; margin-top:86px; }
.sec .lead { margin:0 0 46px; font-size:clamp(18px,1.6vw,23px); line-height:1.6; font-weight:600; letter-spacing:-.01em; }

.rule-grid { display:grid; border-top:3px solid var(--dark-strong-line); }
.rule-grid > * { padding:26px 24px 30px 0; border-bottom:1px solid var(--dark-line); min-width:0; }
.rule-grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.rule-grid-2 > *:nth-child(odd) { border-right:1px solid var(--dark-line); }
.rule-grid-2 > *:nth-child(even) { padding-left:24px; }
.rule-grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.rule-grid-3 > * { border-right:1px solid var(--dark-line); }
.rule-grid-3 > *:nth-child(3n) { border-right:0; padding-right:0; }
.rule-grid-3 > *:not(:nth-child(3n+1)) { padding-left:24px; }
.rule-grid h3 { margin:0; font-size:17px; font-weight:600; line-height:1.42; }
.rule-grid p { margin:12px 0 0; color:#9ca19f; font-size:13.5px; line-height:1.72; }
.rule-grid .rg-lead { padding-top:34px; padding-bottom:40px; }
.rule-grid .rg-lead h3 { font-size:clamp(22px,2.2vw,30px); line-height:1.16; letter-spacing:-.025em; font-weight:500; }
.rule-grid .rg-lead p { margin-top:18px; font-size:14px; }
.rule-grid .fmt-ext { margin-top:14px; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11px; line-height:1.8; letter-spacing:.01em; color:#777d7b; word-break:break-word; }

.metrics { display:grid; border-top:3px solid var(--dark-strong-line); }
.metrics > div { padding:34px 24px 38px 0; border-bottom:1px solid var(--dark-line); }
.metrics-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.metrics-2 > div:first-child { border-right:1px solid var(--dark-line); }
.metrics-2 > div:last-child { padding-left:24px; }
.metrics-3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.metrics-3 > div { border-right:1px solid var(--dark-line); }
.metrics-3 > div:last-child { border-right:0; padding-right:0; }
.metrics-3 > div:not(:first-child) { padding-left:24px; }
.metrics strong { display:block; font-size:clamp(34px,3.9vw,56px); line-height:1.05; letter-spacing:-.05em; font-weight:500; }
.metrics-3 strong { font-size:clamp(24px,2.3vw,32px); word-break:auto-phrase; }
.metrics span { display:block; margin-top:20px; font-size:15px; line-height:1.55; color:#9ca19f; }

.notes { display:grid; gap:18px; margin:44px 0 0; padding:0; list-style:none; color:#b7bcba; font-size:14.5px; line-height:1.7; max-width:900px; }
.notes li { display:grid; grid-template-columns:auto 1fr; gap:12px; }
.notes li::before { content:""; width:18px; height:1px; margin-top:.72em; background:#737876; }
.notes strong { color:#f4f4f1; font-weight:600; }
.foot-note { display:flex; align-items:center; gap:12px; margin:40px 0 0; color:#8f9492; font-size:13px; line-height:1.6; max-width:900px; }
.foot-note::before { content:""; width:32px; height:1px; flex:0 0 auto; background:#737876; }
.capture { margin-top:52px; background:#000; overflow:hidden; }
.capture img, .capture video { display:block; width:100%; height:auto; }

/* 導入の流れ・保有機材は写真を主役にし、枠の塗りを外す */
.flow { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.flow article { display:flex; flex-direction:column; border-top:3px solid var(--dark-strong-line); padding-top:20px; }
.flow .no { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11px; letter-spacing:.2em; color:#838886; }
.flow h3 { margin:16px 0 8px; font-size:20px; font-weight:600; }
.flow p { margin:0 0 22px; color:#9ca19f; font-size:13px; line-height:1.62; }
.flow figure { margin:auto 0 0; aspect-ratio:16/9; overflow:hidden; background:#111313; }
.flow figure img { display:block; width:100%; height:100%; object-fit:cover; }
.flow figure.contain { display:grid; place-items:center; }
.flow figure.contain img { width:66%; height:66%; object-fit:contain; }

.gear { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px 24px; }
.gear article { display:flex; flex-direction:column; }
.gear figure { margin:0; aspect-ratio:3/2; overflow:hidden; background:#e7e5df; }
.gear figure img { display:block; width:100%; height:100%; object-fit:cover; }
.gear h3 { margin:16px 0 0; padding-top:14px; border-top:1px solid var(--dark-line); font-size:14px; font-weight:600; line-height:1.4; }
.gear p { margin:7px 0 0; color:#8c9290; font-size:11.5px; line-height:1.5; }

/* 比較と料金は、VDC側・推奨プランだけブランド青の3px罫にして序列をつける */
.compare { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.compare article { padding:30px 28px 36px 0; }
.compare article:first-child { border-top:1px solid var(--dark-line); border-right:1px solid var(--dark-line); color:#777d7b; }
.compare article:last-child { border-top:3px solid var(--blue); padding-left:28px; padding-right:0; }
.compare article > span { display:block; margin-bottom:28px; font-size:clamp(18px,1.6vw,22px); line-height:1.35; font-weight:600; }
.compare article:first-child > span { color:#969c99; }
.compare ul { display:grid; gap:13px; margin:0; padding:0; list-style:none; font-size:15px; line-height:1.6; }
.compare article:last-child ul { color:#d8dcda; }
.compare li { position:relative; padding-left:18px; }
.compare li::before { content:""; position:absolute; top:.72em; left:0; width:7px; height:1px; background:currentColor; opacity:.75; }

.plans { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.plans article { padding:30px 28px 36px 0; }
.plans article:first-child { border-top:3px solid var(--blue); border-right:1px solid var(--dark-line); }
.plans article:last-child { border-top:1px solid var(--dark-line); padding-left:28px; padding-right:0; }
.plans article > span { display:block; font-size:16px; line-height:1.4; font-weight:600; }
.plans strong { display:flex; align-items:baseline; gap:.08em; line-height:1; letter-spacing:-.05em; margin:18px 0 20px; }
.plans .price-number { font-size:clamp(28px,3vw,41px); }
.plans .price-unit { font-size:clamp(21px,2.35vw,32px); }
.plans p { margin:0; color:#8d9290; font-size:13px; line-height:1.58; }

.video-hero { min-height:100vh; position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.video-hero video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.video-shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.46),rgba(0,0,0,.18) 45%,rgba(0,0,0,.76)); }
.video-shade::after { content:""; position:absolute; inset:0; pointer-events:none; opacity:.5; background-image:radial-gradient(circle,rgba(0,0,0,.82) 0 .5px,transparent .65px); background-size:3px 3px; }
.video-hero-copy { position:relative; text-align:center; z-index:1; transform:translateY(-4vh); }
.video-hero-copy h1 { font-size:clamp(45.9px,6.035vw,98.6px); line-height:1.22; letter-spacing:-.055em; font-weight:400; margin:22px 0 0; }
.scroll-cue { position:absolute; z-index:2; bottom:30px; left:48px; font-size:9px; letter-spacing:.15em; display:flex; gap:14px; }
.home-hero .scroll-cue { left:0; }
.product-page .scroll-cue,.service-page .scroll-cue { bottom:98px; }
.service-section .section-intro { margin:44px 0 48px; color:#f4f4f1; font-size:clamp(17px,1.7vw,24px); font-weight:600; text-align:left; }
.note { margin-top:25px; }
.case-image img { position:absolute; inset:0; width:100%; height:100%; }


.about-hero { min-height:calc(58vh + 92px); padding:calc(15vh + 92px) 0 80px; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:42px; }
.about-hero h1 { font-size:clamp(45.9px,6.035vw,98.6px); line-height:1.22; font-weight:400; letter-spacing:-.055em; margin:0; }
.company,.message { display:grid; grid-template-columns:.8fr 1.65fr; gap:8vw; padding-block:130px; border-top:1px solid var(--line); }
.company dl { margin:0; border-top:3px solid var(--strong-line); }
.company dl div { display:grid; grid-template-columns:160px 1fr; padding:22px 0; border-bottom:1px solid var(--line); }
.company dt { font-size:13px; font-weight:700; }
.company dd { margin:0; line-height:1.58; }
.message-body { min-width:0; }
.message-principles { border-top:2px solid var(--strong-line); }
.message-principle { display:grid; grid-template-columns:150px minmax(0,1fr); gap:32px; padding:28px 0; border-bottom:1px solid var(--line); }
/* ラベルを持たない principle は本文が150pxのラベル列に入って潰れるため1カラムにする */
.message-principle:not(:has(.message-principle-label)) { grid-template-columns:minmax(0,1fr); gap:0; }
.message-principle-label { padding-top:5px; font-size:11px; line-height:1.6; letter-spacing:.08em; font-weight:700; }
.message-principle h3 { margin:0; font-size:clamp(20px,2vw,28px); line-height:1.55; letter-spacing:-.025em; font-weight:500; text-wrap:pretty; }
.message-copy { margin-top:52px; font-size:15px; line-height:2.05; }
.message-copy p { margin:0; }
.message-copy p + p { margin-top:1.75em; }
.placeholder-copy { margin-top:70px; max-width:720px; font-size:17px; line-height:1.65; }
.placeholder-copy small { display:block; margin-top:32px; color:var(--muted); font-size:11px; }

.privacy-shell { width:min(960px,calc(100% - 96px)); margin-inline:auto; }
.privacy-hero { padding:calc(12vh + 92px) 0 72px; border-bottom:1px solid var(--line); }
.privacy-hero h1 { margin:24px 0 0; font-size:clamp(36px,4.5vw,64px); line-height:1.2; letter-spacing:-.04em; font-weight:400; }

/* ---- お問い合わせページ ---- */
/* Googleフォームの本体は iframe 幅の90%で描画され、744px のとき最大の 670px になる。
   752px 以上は Google 側のブレークポイントで 640px 固定に戻るため、744px が最適。
   本文カラムもこれに合わせている */
.contact-body { padding:56px 0 110px; }
.contact-col { width:744px; max-width:100%; }
.contact-intro { margin:0; font-size:16px; line-height:1.9; color:var(--muted); }
.contact-meta { display:grid; gap:0; margin:36px 0 0; padding:0; border-top:3px solid var(--strong-line); }
.contact-meta > div { display:grid; grid-template-columns:150px minmax(0,1fr); gap:20px; padding:16px 0 18px; border-bottom:1px solid var(--line); }
.contact-meta dt { margin:0; font-size:12.5px; font-weight:600; letter-spacing:.02em; }
.contact-meta dd { margin:0; font-size:13.5px; line-height:1.7; color:var(--muted); }
.contact-form { margin-top:56px; }
.contact-form iframe { display:block; width:100%; max-width:744px; border:0; }
.contact-fallback { margin:24px 0 0; font-size:13px; line-height:1.7; color:var(--muted); }
.contact-fallback a { text-decoration:underline; }
.privacy-content { padding:72px 0 120px; color:var(--ink); font-size:15px; line-height:1.9; }
.privacy-content p { margin:0; }
.privacy-content section { margin-top:64px; }
.privacy-content h2 { margin:0 0 24px; font-size:clamp(21px,2.1vw,27px); line-height:1.45; letter-spacing:-.02em; font-weight:600; text-wrap:pretty; }
.privacy-content ul { margin:0; padding-left:1.5em; }
.privacy-content li + li { margin-top:.65em; }
.privacy-content section > p + ul,.privacy-content section > p + .privacy-table-wrap { margin-top:24px; }
.privacy-content section > ul + p,.privacy-content section > .privacy-table-wrap + p { margin-top:28px; }
.privacy-table-wrap { max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain; }
.privacy-table-wrap table { width:100%; border-collapse:collapse; border-spacing:0; font-size:14px; line-height:1.65; }
.privacy-table-wrap th,.privacy-table-wrap td { padding:14px 16px; border:1px solid var(--line); text-align:left; vertical-align:top; font-weight:400; }
.privacy-table-wrap thead th { background:rgba(18,21,23,.055); font-weight:700; }
.privacy-table-wrap tbody th { width:28%; background:rgba(18,21,23,.025); font-weight:600; }
.privacy-table-wrap-wide table { min-width:900px; }
.privacy-table-wrap-wide tbody th { width:auto; }
.privacy-updated { margin-top:72px!important; color:var(--muted); font-size:13px; }

.consulting-hero { min-height:auto; padding:calc(13vh + 92px) 0 72px; display:flex; flex-direction:column; justify-content:center; }
.consulting-hero-heading { position:relative; padding-bottom:54px; border-bottom:1px solid var(--dark-line); }
.consulting-hero-heading::after { content:""; position:absolute; bottom:-1px; left:0; width:min(52%,720px); height:3px; background:var(--dark-strong-line); }
.consulting-hero h1 { max-width:1180px; margin:30px 0 0; font-size:clamp(44px,5.8vw,86px); line-height:1.2; letter-spacing:-.05em; font-weight:400; }
.consulting-hero-content { width:min(880px,72%); margin:64px 0 0 auto; }
.consulting-catch { margin:0 0 34px; font-size:clamp(25px,2.5vw,38px); line-height:1.45; letter-spacing:-.025em; font-weight:500; }
.consulting-lead { margin:0; color:#d8dcda; font-size:clamp(17px,1.6vw,22px); line-height:1.8; }
.consulting-note { display:flex; align-items:flex-start; gap:14px; margin:44px 0 0; color:#969c99; font-size:14px; line-height:1.7; }
.consulting-note::before { content:""; width:34px; height:1px; margin-top:.85em; flex:0 0 auto; background:#737876; }
.consulting-page .cases { padding-block:72px; border-top:0; background:var(--dark); color:#f4f4f1; }
.consulting-page .cases-head p { color:#a4aaa7; }
.consulting-page .case-card { border-color:var(--dark-line); background:var(--panel); }
.consulting-page .case-copy { border-top-color:var(--dark-line); }
.consulting-page .case-copy span { color:#929895; }
.consulting-page .case-copy p { color:#afb4b1; }
.consulting-page .case-controls button { border-color:var(--dark-line); color:#f4f4f1; }
.consulting-page .case-controls button:hover { background:#f4f4f1; color:var(--dark); }
.consulting-page .consulting-contact { padding-top:72px; }
.consulting-contact h2 { font-size:clamp(31px,3.78vw,58px); }

@media (max-width: 900px) {
  .desktop-break { display:none; }
  .page-shell { width:min(100% - 40px, 720px); }
  .site-header { height:74px; padding:0 20px; }
  .menu-button { display:flex; position:relative; z-index:3; }
  .site-header nav { position:absolute; top:0; left:0; width:100vw; height:100vh; height:100dvh; box-sizing:border-box; background:var(--paper); color:var(--ink); flex-direction:column; justify-content:flex-start; align-items:flex-start; padding:max(96px,15vw) 15vw max(32px,env(safe-area-inset-bottom)); gap:12px; font-size:24px; overflow-y:auto; overscroll-behavior:contain; visibility:hidden; opacity:0; pointer-events:none; transform:translateY(-105%); transition:transform .35s ease,opacity .2s ease,visibility 0s linear .35s; }
  .site-header nav a { flex:0 0 auto; width:100%; white-space:normal; }
  .site-header-dark nav { background:var(--dark); color:white; }
  .site-header nav.is-open { visibility:visible; opacity:1; pointer-events:auto; transform:translateY(0); transition-delay:0s; }
  body.menu-open { overflow:hidden; }
  .home-hero { --home-title-size:clamp(48px,14vw,76px); grid-template-columns:1fr; grid-template-rows:auto 1fr auto; padding-top:calc(10vh + 74px); min-height:100vh; }
  .hero-title-group { grid-column:1; grid-row:1; }
  .hero-copy { grid-column:1; grid-row:2; }
  .about-hero h1,.video-hero-copy h1 { font-size:clamp(40.8px,11.9vw,64.6px); }
  .hero-copy { align-self:end; max-width:680px; font-size:clamp(13.9px,2.26vw,16.7px); }
  .split-section,.company,.message { grid-template-columns:1fr; gap:48px; padding-block:90px; }
  .fact-grid-three { grid-template-columns:1fr; }
  .fact-grid-three .fact { border-right:0; padding-left:0; }
  .cases { padding-block:90px; }
  .cases-head { align-items:start; gap:30px; }
  .case-rail { --case-card-width:78vw; }
  .dark-hero { grid-template-columns:1fr; padding-top:110px; padding-bottom:138px; }
  .dark-hero.page-shell { width:100%; padding-inline:20px; }
  .dark-hero-copy h1 { font-size:clamp(20.9px,4.664vw,33px); }
  .local-nav,.local-nav-surface { top:74px; }
  .dark-hero-media { order:-1; }
  .cross-link { gap:44px; padding:56px 24px 24px; }
  .site-footer { margin:0 20px; }
  .about-hero { min-height:calc(58vh + 74px); padding-top:calc(15vh + 74px); }
  .privacy-shell { width:min(100% - 40px,720px); }
  .privacy-hero { padding:calc(10vh + 74px) 0 60px; }
  .contact-col { width:100%; }
  .contact-meta > div { grid-template-columns:1fr; gap:6px; }
  .privacy-content { padding:60px 0 90px; }
  .consulting-hero { min-height:auto; padding:calc(12vh + 74px) 0 72px; }
  .consulting-hero h1 { font-size:clamp(40px,8.6vw,68px); }
  .consulting-hero-content { width:100%; margin-top:52px; }
  .sec { grid-template-columns:1fr; row-gap:40px; padding-block:90px; }
  .sec-wide .sec-body { margin-top:0; }
  .rule-grid-2, .rule-grid-3 { grid-template-columns:1fr; }
  .rule-grid-2 > *, .rule-grid-3 > *,
  .rule-grid-2 > *:nth-child(even), .rule-grid-3 > *:not(:nth-child(3n+1)),
  .rule-grid-3 > *:nth-child(3n) { border-right:0; padding-left:0; padding-right:0; }
  .metrics-2, .metrics-3 { grid-template-columns:1fr; }
  .metrics-2 > div, .metrics-3 > div,
  .metrics-2 > div:first-child, .metrics-2 > div:last-child,
  .metrics-3 > div:not(:first-child), .metrics-3 > div:last-child { border-right:0; padding-left:0; padding-right:0; }
  .flow { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .gear { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width: 620px) {
  .security-section .detail-card { min-height:148px; padding-block:20px; }
  .fact:nth-child(odd) { border-right:0; }
  .fact:nth-child(even) { padding-left:0; }
  .fact-grid-product { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .fact-grid-product .fact { padding:20px 12px 22px 0; border-right:1px solid var(--line); }
  .fact-grid-product .fact:nth-child(even) { padding-left:12px; padding-right:0; border-right:0; }
  .fact-grid-product .fact:nth-child(odd) { border-right:1px solid var(--line); }
  .fact-grid-service { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .fact-grid-service .fact { padding:20px 12px 22px 0; border-right:1px solid var(--line); }
  .fact-grid-service .fact:nth-child(even) { padding-left:12px; padding-right:0; border-right:0; }
  .fact-grid-service .fact:nth-child(odd) { border-right:1px solid var(--line); }
  .cases-head { display:block; }
  .cases-head p { margin-top:24px; }
  .case-copy { grid-template-columns:1fr; padding:22px; }
  .case-copy p { grid-column:1; }
  .case-image { height:43.4vw; }
  .local-nav,.local-nav-links { gap:24px; }
  .strength-section h2,.formats-section h2,.domain-section h2,.features-section h2,.security-section h2,.architecture-section h2,.service-section h2 { white-space:nowrap; font-size:clamp(26px,8vw,34px); }
  .security-section h2,.architecture-section h2,.service-section h2 { white-space:normal; }
  .service-page .cross-link h2 { white-space:normal; }
  .scroll-cue { left:20px; }
  .company dl div { grid-template-columns:90px 1fr; gap:14px; }
  .message-principle { grid-template-columns:1fr; gap:10px; padding:24px 0; }
  .message-principle-label { padding-top:0; }
  .message-principle h3 { font-size:clamp(19px,5.4vw,24px); }
  .message-copy { margin-top:40px; font-size:14px; line-height:1.95; }
  .privacy-content { font-size:14px; line-height:1.85; }
  .privacy-content section { margin-top:52px; }
  .privacy-content h2 { margin-bottom:20px; }
  .privacy-table-wrap table { font-size:13px; }
  .privacy-table-wrap th,.privacy-table-wrap td { padding:12px; }
  .privacy-table-wrap tbody th { width:35%; }
  .site-footer { grid-template-columns:1fr auto; }
  .site-footer-right { gap:14px; }
  .footer-legal { gap:16px; }
  .back-to-top { width:30px; height:30px; margin-left:24px; }
  .consulting-teaser .section-lead h2 { font-size:clamp(32px,10vw,48px); }
  .consulting-teaser-body h3 { margin-bottom:24px; }
  .consulting-teaser-body > p { font-size:15px; }
  .consulting-hero { padding-bottom:72px; }
  .consulting-hero-heading { padding-bottom:38px; }
  .consulting-hero-heading::after { width:62%; }
  .consulting-hero h1 { margin-top:24px; font-size:clamp(34px,10vw,48px); }
  .consulting-hero h1 br { display:none; }
  .consulting-hero-content { margin-top:38px; }
  .consulting-catch { margin-bottom:26px; font-size:clamp(22px,6.5vw,31px); }
  .consulting-lead { font-size:16px; line-height:1.75; }
  .consulting-note { margin-top:32px; font-size:13px; }
  .consulting-contact h2 { font-size:clamp(28px,8vw,40px); }
  .flow, .gear { grid-template-columns:1fr; }
  .compare, .plans { grid-template-columns:1fr; }
  .compare article, .plans article { padding:26px 0 30px; border-right:0!important; padding-left:0!important; }
  .compare article:first-child, .plans article:last-child { border-bottom:1px solid var(--dark-line); }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; } }