/* AlphaTech corporate site — shared stylesheet (plain HTML/CSS/JS, no build step) */
:root{
  /* 背景（ベース）: 白からごく薄い水色へ */
  --bg-primary:#FFFFFF;        /* 画面全体の背景（純白） */
  --bg-secondary:#F0F7FF;      /* 柔らかなペールブルー（セクション区切り・フッター等） */
  /* コンテンツ・カード背景 */
  --bg-surface:#FFFFFF;        /* カード・ヘッダー背景（完全な純白） */
  --border-color:#E0F2FE;      /* 薄い水色の繊細な枠線 */
  --border-hover:#BAE6FD;      /* ホバー時のやや濃い水色枠線 */
  /* タイポグラフィ（文字色） */
  --text-main:#0F172A;         /* メイン文字：濃いスレートネイビー */
  --text-sub:#475569;          /* サブ文字：ミディアムスレートグレー */
  --text-muted:#64748B;        /* キャプション・注釈用 */
  /* アクセントカラー */
  --accent-primary:#2563EB;    /* ロイヤルブルー（ボタン・強調） */
  --accent-hover:#1D4ED8;      /* ボタンホバー時 */
  --accent-light-bg:#EFF6FF;   /* 薄い水色のハイライト背景 */
  /* Pros/Cons セマンティックカラー（白背景での可読性を優先した濃色） */
  --pros:#059669;
  --pros-bg:rgba(5,150,105,.08);
  --cons:#DC2626;
  --cons-bg:rgba(220,38,38,.08);
  --font-family:'M PLUS Rounded 1c', 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --gradient:linear-gradient(135deg,#2563EB 0%,#0284C7 100%);
  --shadow-card:0 4px 20px -2px rgba(15,23,42,.05);
  --shadow-card-hover:0 10px 34px -6px rgba(15,23,42,.10);
  /* spacing tokens（レスポンシブ実装手順書 §4） */
  --content-pad:clamp(20px,4.5vw,36px);
  --section-y:clamp(56px,9vw,100px);
  --gap-grid:clamp(14px,2.2vw,20px);
  --flow-gap:clamp(40px,6vw,60px);
  --space-2xs:8px;
  --space-xs:12px;
  --space-sm:16px;
  --space-md:24px;
  --space-lg:32px;
  --space-xl:48px;
  --space-2xl:64px;
  /* typography tokens（§5） */
  --fs-body-sm:clamp(0.95rem,0.9rem + 0.2vw,1rem);
  --fs-caption:0.8125rem;
  /* measure tokens（§6） */
  --measure-text:38em;
  --measure-wide:1060px;
  --measure-narrow:640px;
  --measure-form:760px;
  --wrap-max:1060px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important;transition:none !important}
  .opening{display:none}
}
body{
  font-family:var(--font-family);
  color:var(--text-main);
  background:linear-gradient(180deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
  background-attachment:fixed;
  line-height:1.75;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent-primary);outline-offset:3px;border-radius:2px}
.wrap{max-width:var(--wrap-max);margin-inline:auto;padding-inline:var(--content-pad)}
.grad-text{background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent}

/* header */
.site-head{position:sticky;top:0;z-index:50;background:rgba(240,247,255,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border-color)}
.site-head .wrap{max-width:var(--wrap-max);display:flex;align-items:center;gap:clamp(14px,3vw,32px);min-height:64px}
.brand{display:flex;align-items:center;gap:10px;flex-shrink:0}
.brand-logo{height:26px;width:auto;display:block;background:#fff;border-radius:4px;padding:6px 10px}
.brand-name{font-size:var(--fs-caption);color:var(--text-sub);letter-spacing:.05em;white-space:nowrap}
.gnav{display:flex;gap:clamp(12px,2.2vw,24px);margin-left:auto;overflow-x:auto;scrollbar-width:none}
.gnav::-webkit-scrollbar{display:none}
.gnav a{color:var(--text-sub);font-size:.82rem;letter-spacing:.02em;white-space:nowrap;padding:6px 2px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.gnav a:hover,.gnav a[aria-current="page"]{color:var(--text-main);border-color:var(--accent-primary)}
.hd-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.tel-btn{white-space:nowrap;background:var(--accent-primary);color:#fff;font-weight:700;font-size:.8rem;letter-spacing:.01em;padding:9px 14px;border-radius:6px;transition:background .2s}
.tel-btn:hover{background:var(--accent-hover)}
.contact-btn{white-space:nowrap;border:1px solid rgba(37,99,235,.35);background:rgba(37,99,235,.12);color:var(--accent-primary);font-weight:700;font-size:.8rem;letter-spacing:.01em;padding:9px 14px;border-radius:6px;transition:transform .2s ease,border-color .2s,background .2s,box-shadow .2s}
.contact-btn:hover,.contact-btn:focus-visible{border-color:var(--accent-primary);background:rgba(37,99,235,.22);transform:translateY(-3px);box-shadow:0 10px 20px -6px rgba(37,99,235,.35)}
.contact-btn:active{transform:translateY(-1px) scale(.97);box-shadow:0 6px 12px -4px rgba(37,99,235,.3)}

/* モバイルナビ開閉トグル（レスポンシブ実装手順書 §8） */
.nav-toggle{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;padding:0;border:none;background:transparent;cursor:pointer;flex-shrink:0}
.nav-toggle-bar{display:block;width:22px;height:2px;background:var(--text-main);border-radius:2px;transition:transform .25s ease,opacity .25s ease}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (prefers-reduced-motion: reduce){
  .nav-toggle-bar{transition:none}
}

/* hero */
.hero{position:relative;padding-top:12px;overflow:hidden}
.hero::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(ellipse 900px 520px at 18% 0%, rgba(37,99,235,.07), transparent 60%),
    radial-gradient(ellipse 700px 500px at 92% 6%, rgba(2,132,199,.06), transparent 60%);
}
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 3.5s ease}
.hero-bg img.is-active{opacity:1}
.hero-bg::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.78);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.hero-inner,.hero-strip{position:relative;z-index:1}
.hero-inner{padding-block:clamp(48px,8vw,84px) clamp(20px,3.5vw,32px)}
.hero-eyebrow{font-size:clamp(1.3rem,2.6vw,1.8rem);font-weight:700;letter-spacing:.14em;color:var(--accent-primary);margin-bottom:20px}
.hero-eyebrow .en{font-size:.7em;letter-spacing:.14em;color:var(--text-sub);margin-left:.8em}
.hero-catch{font-weight:400;font-size:clamp(1.3rem,3vw,2rem);letter-spacing:-.01em;line-height:1.4;color:var(--text-main);max-width:34em;margin-bottom:24px}
.hero-catch .accent{background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-lead{color:var(--text-sub);font-size:.96rem;max-width:38em;margin-bottom:28px}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}
.chip{border:1px solid var(--border-hover);color:var(--accent-primary);font-size:var(--fs-caption);font-weight:500;letter-spacing:.02em;padding:6px 16px;border-radius:999px;background:var(--accent-light-bg)}
.btn-amber{display:inline-flex;align-items:center;gap:8px;background:var(--accent-primary);color:#fff;font-weight:700;font-size:.9rem;padding:12px 22px;border-radius:8px;transition:transform .2s ease,background .2s,box-shadow .2s;box-shadow:0 4px 14px -2px rgba(37,99,235,.35)}
.btn-amber:hover,.btn-amber:focus-visible{background:var(--accent-hover);transform:translateY(-3px);box-shadow:0 12px 24px -6px rgba(37,99,235,.45)}
.btn-amber:active{transform:translateY(-1px) scale(.97);box-shadow:0 6px 14px -4px rgba(37,99,235,.4)}
.hero--center .hero-inner{text-align:center}
.hero--center .hero-catch{max-width:24em;margin-inline:auto}
.hero--center .hero-lead{margin-inline:auto;text-align:left}
.hero-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--gap-grid);text-align:left;margin-bottom:clamp(28px,4vw,40px)}
.hero-cards .card{background:transparent;border-color:var(--border-color);transition:opacity 2.2s ease,transform 2.2s ease,border-color .2s,box-shadow .2s}
.hero-cards .card h3{color:var(--accent-primary)}
[data-reveal-side]{opacity:0;transform:translateX(-60px);transition:opacity 2.2s ease,transform 2.2s ease}
[data-reveal-side].in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){[data-reveal-side]{opacity:1;transform:none;transition:none}}
.hero-cards .card:nth-child(1)[data-reveal-side]{transition-delay:0s}
.hero-cards .card:nth-child(2)[data-reveal-side]{transition-delay:.25s}
.hero-cards .card:nth-child(3)[data-reveal-side]{transition-delay:.5s}
.hero-strip[data-reveal-side]{transition-delay:2.9s}
.hero-tw{opacity:0}
.hero-tw.tw-ready{opacity:1}
.hero-tw .char{display:inline-block;opacity:0;transform:translateX(18px);transition:opacity .45s ease,transform .45s ease}
.hero-tw .char.in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  .hero-tw{opacity:1}
  .hero-tw .char{opacity:1;transform:none;transition:none}
}
.flow-text .char{display:inline-block;opacity:0;transform:translateY(10px);transition:opacity .4s ease,transform .4s ease}
.flow-text .char.in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  .flow-text .char{opacity:1;transform:none;transition:none}
}
.hero-strip{border-top:1px solid var(--border-color);background:transparent}
.hero-strip .wrap{display:flex;flex-wrap:wrap;justify-content:center;gap:8px clamp(18px,3.4vw,40px);padding-block:14px;font-size:.82rem;letter-spacing:.01em;color:var(--text-sub)}
.hero-strip .lbl{color:var(--accent-primary);margin-right:.6em;font-size:var(--fs-caption);font-weight:700;letter-spacing:.08em}
.hero-strip a{border-bottom:1px dotted var(--text-muted)}

/* セクション区切り（1pxのグラデーションライン） */
.noren{height:1px;background:linear-gradient(90deg,transparent,var(--border-color) 20%,var(--border-color) 80%,transparent)}
.noren.deep{background:linear-gradient(90deg,transparent,rgba(37,99,235,.35) 20%,rgba(2,132,199,.3) 80%,transparent)}

/* sections */
.sec{padding-block:var(--section-y)}
.sec--dark{
  background:var(--bg-secondary);
  border-block:1px solid var(--border-color);
}
.sec-head{margin-bottom:clamp(30px,5vw,48px)}
.sec-head.center{text-align:center}
.sec-head h1,.sec-head h2{font-weight:800;letter-spacing:-.01em;font-size:clamp(1.4rem,3.2vw,2rem);position:relative;padding-bottom:16px;display:inline-flex;align-items:center;gap:14px}
.sec-head h1::before,.sec-head h2::before{content:"";width:5px;height:1.1em;background:var(--gradient);border-radius:2px;flex-shrink:0}
.sec-head.center h1::before,.sec-head.center h2::before{display:none}
.sec-head h1::after,.sec-head h2::after{content:"";position:absolute;left:0;bottom:0;width:44px;height:3px;border-radius:2px;background:var(--gradient)}
.sec-head.center h1::after,.sec-head.center h2::after{left:50%;transform:translateX(-50%)}
.sec-head .lead{margin-top:12px;color:var(--text-sub);font-size:.9rem;max-width:var(--measure-text)}
.sec-head.center .lead{margin-inline:auto}
.sub-h{font-weight:700;font-size:clamp(1.05rem,2.2vw,1.25rem);letter-spacing:-.005em;margin:clamp(36px,5vw,52px) 0 8px;display:flex;align-items:center;gap:10px}
.sub-note{color:var(--text-sub);font-size:.86rem;margin-bottom:20px}

/* generic card grids */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--gap-grid)}
.card-grid.cols-2{grid-template-columns:1fr 1fr}
.industry-grid{grid-template-columns:repeat(4,1fr)}
.card{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:10px;padding:clamp(20px,3vw,32px);box-shadow:var(--shadow-card);transition:border-color .2s,box-shadow .2s}
.card:hover{border-color:var(--border-hover);box-shadow:var(--shadow-card-hover)}
.hero-cards .card,.industry-grid .card{transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.hero-cards .card:hover,.industry-grid .card:hover{transform:translateY(-6px);box-shadow:0 20px 40px -10px rgba(37,99,235,.24)}
.cloud-scene{position:relative;padding-block:36px 30px}
.cloud-block{position:relative;background:transparent;border:none;border-radius:24px;box-shadow:none;padding:clamp(32px,5vw,48px)}
.cloud-block-inner{animation:cloudFloat 6s ease-in-out infinite}
@keyframes cloudFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}

/* mini-cloud: CSS multi-lobe shape, shadow unified via drop-shadow on the wrapper
   so it traces the composite silhouette instead of outlining each lobe separately */
.mini-cloud{position:absolute;filter:drop-shadow(0 12px 18px rgba(37,99,235,.2));animation:cloudDrift 7s ease-in-out infinite;z-index:1}
.mini-cloud .base{background:#fff;border-radius:40px}
.mini-cloud .lobe{position:absolute;background:#fff;border-radius:50%}

.mini-cloud--sm .base{width:56px;height:22px}
.mini-cloud--sm .lobe:nth-child(1){width:24px;height:24px;top:-13px;left:0}
.mini-cloud--sm .lobe:nth-child(2){width:30px;height:30px;top:-18px;left:16px}
.mini-cloud--sm .lobe:nth-child(3){width:20px;height:20px;top:-10px;left:38px}

.mini-cloud--md .base{width:78px;height:30px}
.mini-cloud--md .lobe:nth-child(1){width:34px;height:34px;top:-18px;left:0}
.mini-cloud--md .lobe:nth-child(2){width:44px;height:44px;top:-26px;left:22px}
.mini-cloud--md .lobe:nth-child(3){width:30px;height:30px;top:-16px;left:52px}
.mini-cloud--md .lobe:nth-child(4){width:22px;height:22px;top:-9px;left:-8px}

.mini-cloud--lg .base{width:104px;height:40px}
.mini-cloud--lg .lobe:nth-child(1){width:46px;height:46px;top:-24px;left:0}
.mini-cloud--lg .lobe:nth-child(2){width:58px;height:58px;top:-34px;left:30px}
.mini-cloud--lg .lobe:nth-child(3){width:40px;height:40px;top:-20px;left:70px}
.mini-cloud--lg .lobe:nth-child(4){width:30px;height:30px;top:-12px;left:-10px}

.mini-cloud--1{top:-6px;left:-16px;animation-duration:7s}
.mini-cloud--2{top:-24px;left:26%;animation-delay:.8s;animation-duration:8s;opacity:.9}
.mini-cloud--3{top:-14px;right:-18px;animation-delay:1.6s;animation-duration:6.5s}
.mini-cloud--4{top:6px;right:20%;animation-delay:2.4s;animation-duration:8.5s;opacity:.85}
.mini-cloud--5{bottom:-16px;left:16%;animation-delay:3.2s;animation-duration:7.5s;opacity:.9}
.mini-cloud--6{bottom:-8px;right:10%;animation-delay:4s;animation-duration:6.8s;opacity:.85}

@keyframes cloudDrift{0%,100%{transform:translate(0,0)}50%{transform:translate(6px,-12px)}}
@media (max-width:640px){.mini-cloud{display:none}}
@media (prefers-reduced-motion:reduce){.cloud-block-inner,.mini-cloud{animation:none}}
.hero-cards .card:active,.industry-grid .card:active{transform:translateY(-2px) scale(.98);box-shadow:0 10px 24px -8px rgba(37,99,235,.2)}
.card .icon{font-size:1.6rem;margin-bottom:10px;display:block}
.card h3{font-weight:700;font-size:1.02rem;letter-spacing:-.005em;margin-bottom:8px;color:var(--accent-primary)}
.card p{font-size:var(--fs-body-sm);color:var(--text-sub);line-height:1.75}

/* 付箋風に右下の角が折れたタイル */
.card-note{position:relative}
.card-note::before{content:"";position:absolute;right:0;bottom:0;width:0;height:0;border-style:solid;border-width:0 0 32px 32px;border-color:transparent transparent rgba(15,23,42,.2) transparent;border-bottom-right-radius:10px}
.card-note::after{content:"";position:absolute;right:1px;bottom:1px;width:0;height:0;border-style:solid;border-width:0 0 28px 28px;border-color:transparent transparent var(--bg-surface) transparent;border-bottom-right-radius:9px}

/* 中央寄せの導入ブロック */
.intro-block{text-align:center;max-width:var(--measure-narrow);margin-inline:auto}
.intro-block .eyebrow{font-size:1.55rem;font-weight:700;letter-spacing:.16em;color:var(--accent-primary)}
.intro-block .big{font-weight:400;font-size:clamp(.92rem,1.9vw,1.1rem);letter-spacing:-.01em;margin:10px 0 16px;color:var(--text-main);text-align:center}
.intro-block .desc{color:var(--text-sub);font-size:.94rem;line-height:1.9;text-align:left}

/* 業務サイクル：番号付きカード */
.cycle-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:clamp(12px,2vw,18px)}
.cycle{display:flex;gap:14px;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:10px;padding:18px 18px 20px;align-items:flex-start;box-shadow:var(--shadow-card);transition:border-color .2s,box-shadow .2s}
.cycle:hover{border-color:var(--border-hover);box-shadow:var(--shadow-card-hover)}
.cycle .num{
  flex-shrink:0;width:36px;height:36px;border-radius:50%;
  background:var(--gradient);color:#fff;font-weight:700;font-size:.92rem;
  display:flex;align-items:center;justify-content:center;
}
.cycle h4{font-weight:700;font-size:.94rem;letter-spacing:-.005em;margin-bottom:4px;color:var(--accent-primary)}
.cycle p{font-size:var(--fs-body-sm);color:var(--text-sub);line-height:1.7}

/* Pros/Cons ハイブリッド設計 */
.pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:8px}
.pc-col{border-radius:10px;padding:22px 24px}
.pc-col.pros{background:var(--pros-bg);border:1px solid rgba(5,150,105,.3)}
.pc-col.cons{background:var(--cons-bg);border:1px solid rgba(220,38,38,.3)}
.pc-col h3{font-size:1rem;font-weight:700;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.pc-col.pros h3{color:var(--pros)}
.pc-col.cons h3{color:var(--cons)}
.pc-col ul{list-style:none}
.pc-col li{font-size:.86rem;color:var(--text-sub);line-height:1.7;padding-left:1.2em;position:relative;margin-bottom:8px}
.pc-col li::before{content:"•";position:absolute;left:0}
.pc-col.pros li::before{color:var(--pros)}
.pc-col.cons li::before{color:var(--cons)}

/* 動画埋め込み */
.video-box{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:10px;padding:clamp(20px,3vw,28px);box-shadow:var(--shadow-card)}
.video-frame{position:relative;width:100%;aspect-ratio:16/9;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:20px}
.video-frame .ph-icon{font-size:2.4rem;color:var(--accent-primary)}
.video-frame p{font-size:.86rem;color:var(--text-main);font-weight:700}
.video-frame .cap{font-size:.76rem;color:var(--text-sub);font-weight:400}
.video-caption{margin-top:12px;font-size:.84rem;color:var(--text-sub)}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* サービスパッケージ */
.pack-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-grid)}
.pack{display:block;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:10px;padding:clamp(20px,3vw,26px);box-shadow:var(--shadow-card);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
a.pack:hover,a.pack:focus-visible{transform:translateY(-6px);border-color:var(--border-hover);box-shadow:0 20px 40px -10px rgba(37,99,235,.24)}
a.pack:active{transform:translateY(-2px) scale(.98);box-shadow:0 10px 24px -8px rgba(37,99,235,.2)}
.pack .step{display:block;font-size:var(--fs-caption);font-weight:700;letter-spacing:.1em;color:var(--accent-primary);margin-bottom:10px;transition:transform .25s ease}
a.pack:hover .step,a.pack:focus-visible .step{transform:translateX(3px)}
.pack h3{font-size:1.08rem;font-weight:700;letter-spacing:-.005em;color:var(--accent-primary);margin-bottom:10px}
.pack p{font-size:var(--fs-body-sm);color:var(--text-sub);line-height:1.75}
.pack ul{margin-top:14px;list-style:none}
.pack ul li{font-size:var(--fs-body-sm);color:var(--text-sub);padding-left:1.1em;position:relative;margin-bottom:6px}
.pack ul li::before{content:"•";position:absolute;left:0;color:var(--accent-primary)}
.price-note{text-align:center;font-size:.78rem;color:var(--text-sub);margin-top:22px}

/* FAQ */
.faq-box{margin-top:30px;border:1px dashed var(--border-hover);border-radius:10px;padding:clamp(18px,3vw,26px);max-width:var(--measure-text);margin-inline:auto;background:var(--bg-surface);box-shadow:var(--shadow-card)}
.faq-box h4{font-weight:700;letter-spacing:.08em;color:var(--accent-primary);font-size:.9rem;margin-bottom:14px}
.faq-item + .faq-item{margin-top:14px}
.faq-item .q{font-size:.88rem;color:var(--text-main);font-weight:700;margin-bottom:4px}
.faq-item .q::before{content:"Q．";color:var(--accent-primary)}
.faq-item .a{font-size:var(--fs-body-sm);color:var(--text-sub)}
.faq-item .a::before{content:"A．";color:var(--text-sub)}

/* 沿革タイムライン */
.timeline{list-style:none;border-left:2px solid var(--border-color);padding-left:clamp(20px,3vw,28px)}
.timeline li{position:relative;padding-bottom:18px;font-size:.9rem;color:var(--text-sub)}
.timeline li::before{content:"";position:absolute;left:calc(-1 * clamp(20px,3vw,28px) - 6px);top:.6em;width:10px;height:10px;border-radius:50%;background:var(--gradient);border:2px solid var(--bg-primary)}
.timeline .yr{font-weight:700;color:var(--accent-primary);letter-spacing:.02em;margin-right:.8em}

/* 会社情報 / アクセス */
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3.5vw,40px);align-items:start}
.info-dl{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:10px;padding:clamp(20px,3vw,28px);box-shadow:var(--shadow-card)}
.info-dl .row{display:grid;grid-template-columns:6em 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--border-color);font-size:.88rem}
.info-dl .row:last-child{border-bottom:none}
.info-dl dt{color:var(--accent-primary);font-weight:700;letter-spacing:.01em}
.info-dl dd a{border-bottom:1px dotted var(--text-sub)}
.info-dl dd ul{list-style:none;padding-left:0}
.map-box{border-radius:10px;overflow:hidden;background:var(--bg-surface);border:1px solid var(--border-color);box-shadow:var(--shadow-card)}
.map-box iframe{width:100%;height:300px;border:0;display:block}
.map-note{font-size:.8rem;color:var(--text-sub);padding:12px 16px}

/* 対応業種チップ */
.industry-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:24px 0}
.industry-chip{display:inline-flex;align-items:center;gap:6px;font-size:.84rem;color:var(--text-sub);background:var(--bg-surface);border:1px solid var(--border-color);border-radius:999px;padding:8px 16px;transition:transform .2s ease,border-color .2s,background .2s,box-shadow .2s}
.industry-chip:hover{border-color:var(--border-hover);background:var(--accent-light-bg);color:var(--accent-primary);transform:translateY(-3px);box-shadow:0 10px 18px -6px rgba(37,99,235,.25)}
.industry-chip:active{transform:translateY(-1px) scale(.97);box-shadow:0 6px 12px -4px rgba(37,99,235,.2)}

/* CTA帯（ロイヤルブルー→シアンのグラデーションバナー） */
.cta-band{background:var(--gradient);border-radius:16px;padding:clamp(30px,5vw,50px) clamp(24px,4vw,44px);text-align:center;box-shadow:0 24px 60px -12px rgba(37,99,235,.35)}
.cta-band h2{font-weight:800;font-size:clamp(1.15rem,2.6vw,1.5rem);letter-spacing:-.01em;color:#fff;margin-bottom:14px}
.cta-band p{max-width:var(--measure-narrow);margin:0 auto 24px;font-size:.9rem;color:rgba(255,255,255,.9)}
.cta-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.cta-band .btn-amber{background:#fff;color:var(--accent-primary);box-shadow:none}
.cta-band .btn-amber:hover{background:rgba(255,255,255,.88)}
.btn-line{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border-color);color:var(--text-main);font-size:.86rem;font-weight:700;padding:12px 22px;border-radius:8px;transition:transform .2s ease,border-color .2s,background .2s,box-shadow .2s}
.btn-line:hover,.btn-line:focus-visible{border-color:var(--accent-primary);background:var(--accent-light-bg);transform:translateY(-3px);box-shadow:0 10px 22px -6px rgba(37,99,235,.3)}
.btn-line:active{transform:translateY(-1px) scale(.97);box-shadow:0 6px 14px -4px rgba(37,99,235,.25)}
.cta-band .btn-line{border-color:rgba(255,255,255,.6);color:#fff}
.cta-band .btn-line:hover{background:rgba(255,255,255,.15);border-color:#fff}
.cta-band--soft{background:#fff;border:1px solid var(--border-color);padding:clamp(18px,2.5vw,28px) clamp(16px,2.5vw,24px);max-width:var(--measure-narrow);margin-inline:auto}
.cta-band--soft h2{color:var(--accent-primary)}
.cta-band--soft p{color:var(--text-main)}
.cta-band--soft .btn-line{border:1px solid rgba(37,99,235,.35);background:rgba(37,99,235,.12);color:var(--accent-primary)}
.cta-band--soft .btn-line:hover{border-color:var(--accent-primary);background:rgba(37,99,235,.22)}

/* パンくず / 戻るリンク */
.back-link{display:inline-flex;align-items:center;gap:6px;font-size:.84rem;color:var(--accent-primary);margin-bottom:22px}
.back-link:hover{text-decoration:underline}
.next-links{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:20px;font-size:.86rem}
.next-links a{color:var(--accent-primary);font-weight:700}
.next-links a:hover{text-decoration:underline}

/* お問い合わせフォーム */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-field{margin-bottom:18px}
.form-field.full{grid-column:1 / -1}
.form-field label{display:block;font-size:.86rem;font-weight:700;margin-bottom:6px}
.form-field .req{color:var(--cons)}
.form-field input,.form-field select,.form-field textarea{width:100%;min-height:48px;border-radius:8px;border:1px solid var(--border-color);background:var(--bg-surface);color:var(--text-main);padding:12px 14px;font-size:16px;font-family:var(--font-family);transition:border-color .2s,box-shadow .2s}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--accent-light-bg)}
.form-field input::placeholder,.form-field textarea::placeholder{color:var(--text-sub)}
.form-note{font-size:.78rem;color:var(--text-sub);margin-bottom:16px}
.form-note.warn{color:var(--cons)}
.form-note.success{color:var(--pros)}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.consent-box{max-height:200px;overflow-y:auto;border:1px solid var(--border-color);border-radius:8px;padding:14px 16px;background:var(--bg-secondary);font-size:.82rem;color:var(--text-sub);line-height:1.85}
.consent-box p+p{margin-top:10px}
.consent-box a{color:var(--accent-primary);text-decoration:underline}
.consent-guide{font-size:.82rem;color:var(--text-sub);margin:12px 0}
.consent-check{display:flex;align-items:center;gap:8px;font-size:.9rem;font-weight:700;color:var(--text-main);cursor:pointer}
.consent-check input{width:auto;accent-color:var(--accent-primary)}

/* 汎用テキストブロック */
.page-hero{padding:clamp(48px,7vw,72px) 0 clamp(24px,3.5vw,32px)}
.page-hero h1{font-weight:800;letter-spacing:-.01em;font-size:clamp(1.7rem,3.6vw,2.4rem);margin-bottom:16px}
.page-hero p{color:var(--text-sub);font-size:.94rem;max-width:var(--measure-text);line-height:1.85}
.pill-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}
.pill-list li{background:var(--bg-surface);border:1px solid var(--border-color);border-radius:8px;padding:14px 16px;font-size:var(--fs-body-sm);color:var(--text-sub);display:flex;gap:8px;box-shadow:var(--shadow-card)}
.pill-list li::before{content:"•";color:var(--accent-primary)}
.plain-list{list-style:none;margin-top:10px}
.plain-list li{font-size:var(--fs-body-sm);color:var(--text-sub);padding-left:1.2em;position:relative;margin-bottom:8px}
.plain-list li::before{content:"•";position:absolute;left:0;color:var(--accent-primary)}
.step-list{list-style:none;counter-reset:step}
.step-list li{counter-increment:step;display:flex;gap:16px;padding-bottom:22px;position:relative}
.step-list li:not(:last-child)::after{content:"";position:absolute;left:17px;top:38px;bottom:0;width:1px;background:var(--border-hover)}
.step-list .num{flex-shrink:0;width:36px;height:36px;border-radius:50%;background:var(--gradient);color:#fff;font-weight:700;font-size:.9rem;display:flex;align-items:center;justify-content:center}
.step-list h3{font-size:1rem;font-weight:700;margin-bottom:4px;color:var(--text-main)}
.step-list p{font-size:var(--fs-body-sm);color:var(--text-sub);line-height:1.75}
.flow-img{width:100%;height:auto;border-radius:10px;border:1px solid var(--border-color);margin:20px 0 28px;box-shadow:var(--shadow-card);cursor:zoom-in;transition:opacity .2s ease}
.flow-img:hover,.flow-img:focus-visible{opacity:.9}

.lightbox{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:clamp(16px,5vw,48px);background:rgba(15,23,42,.78);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}
.lightbox.is-open{opacity:1;visibility:visible}
.lightbox img{max-width:min(1200px,92vw);max-height:88vh;width:auto;height:auto;border-radius:12px;box-shadow:0 30px 70px -14px rgba(0,0,0,.5)}
.lightbox-close{position:absolute;top:clamp(12px,3vw,24px);right:clamp(12px,3vw,24px);width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);color:#fff;font-size:1.4rem;line-height:1;display:flex;align-items:center;justify-content:center;transition:background .2s}
.lightbox-close:hover,.lightbox-close:focus-visible{background:rgba(255,255,255,.26)}
@media (prefers-reduced-motion: reduce){
  .lightbox{transition:none}
}
.profile-dl{border-top:1px solid var(--border-color)}
.profile-dl .row{display:grid;grid-template-columns:8em 1fr;gap:12px;padding:18px 0;border-bottom:1px solid var(--border-color);font-size:.9rem}
.profile-dl dt{color:var(--accent-primary);font-weight:700}
.profile-dl dd{color:var(--text-sub);line-height:1.75}
.profile-dl dd ul{list-style:none}
.profile-dl dd li{margin-bottom:4px}

/* 代表者挨拶 */
.ceo-block{display:grid;grid-template-columns:200px 1fr;gap:clamp(24px,4vw,40px);align-items:start}
.ceo-photo{width:100%;height:auto;border-radius:10px;border:1px solid var(--border-color);box-shadow:var(--shadow-card)}
.ceo-message p{color:var(--text-sub);font-size:1.05rem;line-height:1.95;margin-bottom:16px}
.ceo-sign{color:var(--text-main);font-weight:700;text-align:right;margin-top:20px}
@media (max-width:640px){
  .ceo-block{grid-template-columns:1fr;justify-items:center}
  .ceo-photo{max-width:200px}
  .ceo-message{text-align:left}
  .ceo-sign{text-align:center}
}

/* footer */
.site-foot{background:var(--bg-secondary);border-top:1px solid var(--border-color);color:var(--text-sub);text-align:center;padding:clamp(48px,7vw,72px) 20px clamp(30px,4vw,40px)}
.foot-brand{font-weight:800;font-size:clamp(1.3rem,3.2vw,1.8rem);letter-spacing:-.01em;line-height:1.2;background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
.foot-brand-sub{font-size:var(--fs-caption);letter-spacing:.08em;line-height:1.6;color:var(--text-sub);margin-top:6px}
.foot-cols{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:28px;text-align:left;max-width:var(--measure-narrow);margin:40px auto 0;padding-top:36px;border-top:1px solid var(--border-color)}
.foot-cols h4{color:var(--text-main);font-size:.85rem;font-weight:700;margin-bottom:14px;letter-spacing:.02em}
.foot-cols address{font-style:normal;font-size:.86rem;color:var(--text-sub);line-height:1.85}
.foot-cols ul{list-style:none}
.foot-cols li{margin-bottom:8px}
.foot-cols a{font-size:.86rem;color:var(--text-sub)}
.foot-cols a:hover{color:var(--accent-primary)}
.site-foot .copy{margin-top:30px;font-size:var(--fs-caption);color:var(--text-muted);letter-spacing:.04em}

/* オープニング演出（写真/AlphaTech.jpgをベクター化したロゴSVG。生成手順はメモリ参照） */
.opening{position:fixed;inset:0;z-index:120;background:var(--bg-primary);display:flex;align-items:center;justify-content:center;animation:op-lift 1s cubic-bezier(.75,0,.25,1) 3.5s forwards}
.op-box{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 20px}
.op-logo{width:clamp(300px,60vw,720px);max-width:92vw;height:auto;animation:logo-rise 1.4s ease .3s both}
@keyframes op-lift{to{transform:translateY(-101%);visibility:hidden}}
@keyframes logo-rise{from{opacity:0;transform:translateY(24px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}
html.op-skip .opening{display:none}

/* reveal */
[data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
[data-reveal].in{opacity:1;transform:none}
[data-reveal-left]{opacity:0;transform:translateX(-60px);transition:opacity .7s ease,transform .7s ease}
[data-reveal-left].in{opacity:1;transform:none}
[data-reveal-right]{opacity:0;transform:translateX(60px);transition:opacity .7s ease,transform .7s ease}
[data-reveal-right].in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  [data-reveal],[data-reveal-left],[data-reveal-right]{opacity:1;transform:none}
}

/* responsive（スマホ≤640 / タブレット641–1024 / PC≥1025の3ティア。レスポンシブ実装手順書 §3） */
@media (max-width:1024px){
  .industry-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:900px){
  .pack-grid{grid-template-columns:1fr}
  .info-grid{grid-template-columns:1fr}
  .brand-name{display:none}
}
@media (max-width:640px){
  .card-grid.cols-2{grid-template-columns:1fr}
  .industry-grid{grid-template-columns:1fr}
  .pill-list,.form-grid{grid-template-columns:1fr}
  .foot-cols{grid-template-columns:1fr;text-align:center}
  .info-dl .row,.profile-dl .row{grid-template-columns:1fr}
  .hd-actions .contact-btn{padding:6px 12px;font-size:.8rem}
  .pc-only{display:none}

  .nav-toggle{display:flex}
  .gnav{
    position:absolute;top:100%;left:0;right:0;z-index:49;
    flex-direction:column;align-items:stretch;overflow-y:auto;max-height:80vh;
    background:var(--bg-primary);border-top:1px solid var(--border-color);border-bottom:1px solid var(--border-color);
    box-shadow:0 16px 32px -12px rgba(15,23,42,.18);
    margin-left:0;padding:8px var(--content-pad) 16px;gap:0;
    transform:translateY(-8px);opacity:0;visibility:hidden;
    transition:opacity .2s ease,transform .2s ease,visibility .2s ease;
  }
  .gnav.is-open{transform:translateY(0);opacity:1;visibility:visible}
  .gnav a{padding:14px 4px;min-height:44px;display:flex;align-items:center;border-bottom:1px solid var(--border-color);font-size:1rem}
}
@media (max-width:640px) and (prefers-reduced-motion: reduce){
  .gnav{transition:none}
}