/* ==========================================================
   米軍入札センター — usbidcenter.jp landing page
   Tokens harmonised with the USBidCenter design system
   ========================================================== */
:root{
  --navy-900:#0A1830;
  --navy-800:#11233E;
  --navy-700:#1B2E4B;     /* primary per spec */
  --navy-600:#274064;
  --navy-500:#3B5680;
  --navy-100:#DCE4F0;
  --navy-050:#EEF2F8;

  --blue-700:#1D4ED8;
  --blue-600:#2563EB;     /* secondary per spec */
  --blue-500:#3B82F6;
  --blue-050:#EFF6FF;

  --gold-700:#B45309;
  --gold-600:#D97706;
  --gold-500:#F59E0B;     /* accent per spec */
  --gold-200:#FCD34D;
  --gold-050:#FFFBEB;

  --green-600:#059669;
  --green-500:#10B981;    /* success */
  --green-050:#ECFDF5;

  --red-500:#DC2626;
  --red-050:#FEF2F2;
  --orange-500:#EA580C;
  --orange-050:#FFF7ED;

  --bg:#F8FAFC;
  --paper:#FFFFFF;
  --parchment:#F5EFE0;
  --ink:#1E293B;
  --ink-muted:#475569;
  --ink-faint:#64748B;
  --hairline:#E2E8F0;
  --hairline-strong:#CBD5E1;

  --font-jp:'Noto Sans JP','Hiragino Kaku Gothic ProN',system-ui,sans-serif;
  --font-en:'Inter','Noto Sans JP',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,Menlo,monospace;

  --container:1280px;
  --header-h:72px;
  --radius-sm:4px;
  --radius-md:8px;
  --radius-lg:12px;
  --radius-xl:16px;
  --radius-pill:999px;

  --shadow-1:0 1px 2px rgba(15,23,42,.06), 0 0 0 1px rgba(15,23,42,.04);
  --shadow-2:0 10px 30px -12px rgba(15,23,42,.18);
  --shadow-3:0 24px 48px -20px rgba(15,23,42,.24);

  --ease:cubic-bezier(.2,.6,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0}
body{
  font-family:var(--font-jp);
  color:var(--ink);
  background:var(--bg);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}
:lang(en){font-family:var(--font-en)}

/* Hide localisation pair the active lang doesn't want. We default to JA. */
html[data-lang="ja"] .en-only{display:none}
html[data-lang="en"] .ja-only{display:none}
html[data-lang="en"]{font-family:var(--font-en)}
html[data-lang="en"] body{font-family:var(--font-en)}

.container{
  max-width:var(--container);
  margin:0 auto;
  padding:0 32px;
}
@media (max-width:760px){ .container{padding:0 20px} }

/* ============== Eyebrow / section heading system ============== */
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-en);
  font-weight:600;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--gold-600);
  margin-bottom:14px;
}
.eyebrow::before{
  content:"";
  width:24px;height:2px;background:var(--gold-500);
}
.section-title{
  font-family:var(--font-jp);
  font-weight:800;
  font-size:clamp(28px,4vw,40px);
  line-height:1.2;
  letter-spacing:-.01em;
  margin:0 0 14px;
}
.section-sub{
  color:var(--ink-muted);
  font-size:16px;
  line-height:1.7;
  max-width:720px;
  margin:0;
}
.section-head{ margin-bottom:48px; }
.section-head.center{ text-align:center; }
.section-head.center .eyebrow{ justify-content:center }
.section-head.center .section-sub{ margin:0 auto; }

section{ padding:96px 0; position:relative; }
@media (max-width:760px){ section{padding:64px 0} }

/* ============== Navigation ============== */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  height:var(--header-h);
  background:rgba(255,255,255,0);
  border-bottom:1px solid transparent;
  transition:background var(--ease) .25s, border-color var(--ease) .25s, box-shadow var(--ease) .25s;
}
.nav.scrolled{
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom-color:var(--hairline);
  box-shadow:var(--shadow-1);
}
.nav-inner{
  height:100%;
  display:flex; align-items:center; gap:32px;
}
.brand{
  display:flex; align-items:center; gap:12px;
  color:var(--paper);
  flex-shrink:0;
}
.nav.scrolled .brand{ color:var(--ink); }
.brand-mark{
  width:42px;height:42px;
  display:inline-block;
  background-color:var(--gold-500);
  -webkit-mask:url(static/logo-mark.svg) center/contain no-repeat;
          mask:url(static/logo-mark.svg) center/contain no-repeat;
  transition:background-color var(--ease) .25s;
  flex-shrink:0;
}
.nav.scrolled .brand-mark{ background-color:var(--navy-700); }
.brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.brand-text .name-jp{ font-weight:800; font-size:16px; letter-spacing:.02em; }
.brand-text .name-en{ font-family:var(--font-en); font-weight:600; font-size:11px; letter-spacing:.16em; text-transform:uppercase; opacity:.85; }

.nav-links{ display:flex; align-items:center; gap:28px; margin-left:auto; }
.nav-links a{
  font-size:14px; font-weight:500; color:rgba(255,255,255,.88);
  transition:color var(--ease) .15s;
}
.nav.scrolled .nav-links a{ color:var(--ink-muted); }
.nav-links a:hover{ color:var(--gold-500); }
.nav.scrolled .nav-links a:hover{ color:var(--navy-700); }

.nav-actions{ display:flex; align-items:center; gap:12px; }
.lang-switch{
  display:inline-flex; align-items:center;
  border:1px solid rgba(255,255,255,.3);
  border-radius:var(--radius-pill);
  overflow:hidden;
  font-family:var(--font-en);
  font-size:12px; font-weight:600;
}
.nav.scrolled .lang-switch{ border-color:var(--hairline-strong); }
.lang-switch button{
  padding:6px 12px;
  color:rgba(255,255,255,.7);
  transition:all var(--ease) .15s;
}
.nav.scrolled .lang-switch button{ color:var(--ink-muted); }
.lang-switch button.active{
  background:var(--paper);
  color:var(--navy-700);
}
.nav.scrolled .lang-switch button.active{ background:var(--navy-700); color:var(--paper); }
.btn-login{
  font-size:14px; font-weight:600; color:var(--paper); padding:8px 14px;
}
.nav.scrolled .btn-login{ color:var(--ink); }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-weight:600; font-size:15px;
  padding:11px 20px;
  border-radius:var(--radius-md);
  transition:all var(--ease) .15s;
  white-space:nowrap;
  border:1px solid transparent;
}
.btn-primary{
  background:var(--blue-600); color:var(--paper);
}
.btn-primary:hover{ background:var(--blue-700); transform:translateY(-1px); box-shadow:var(--shadow-2); }
.btn-success{
  background:var(--green-500); color:var(--paper);
}
.btn-success:hover{ background:var(--green-600); transform:translateY(-1px); box-shadow:var(--shadow-2); }
.btn-ghost{
  background:transparent; color:var(--paper); border-color:rgba(255,255,255,.4);
}
.btn-ghost:hover{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.7); }
.btn-outline{
  background:transparent; color:var(--navy-700); border-color:var(--hairline-strong);
}
.btn-outline:hover{ border-color:var(--navy-700); background:var(--navy-050); }
.btn-gold{
  background:var(--gold-500); color:#1c1410;
}
.btn-gold:hover{ background:var(--gold-600); color:var(--paper); transform:translateY(-1px); }
.btn-lg{ padding:14px 26px; font-size:16px; }
.btn-xl{ padding:18px 32px; font-size:17px; }

.hamburger{
  display:none;
  width:40px;height:40px;
  align-items:center;justify-content:center;
  color:var(--paper);
}
.nav.scrolled .hamburger{ color:var(--ink); }
.hamburger svg{ width:24px; height:24px; }

@media (max-width:980px){
  .nav-links{
    position:fixed; top:var(--header-h); left:0; right:0;
    flex-direction:column; gap:0; align-items:stretch;
    background:var(--paper);
    border-bottom:1px solid var(--hairline);
    padding:8px 0;
    transform:translateY(-120%);
    transition:transform var(--ease) .3s;
    box-shadow:var(--shadow-2);
  }
  .nav-links.open{ transform:translateY(0); }
  .nav-links a{
    padding:14px 24px;
    color:var(--ink) !important;
    border-bottom:1px solid var(--hairline);
  }
  .hamburger{ display:inline-flex; }
  .nav-actions .btn-success{ display:none }
  .btn-login{ display:none }
}

/* ============== Hero ============== */
.hero{
  position:relative;
  padding:calc(var(--header-h) + 80px) 0 100px;
  color:var(--paper);
  overflow:hidden;
  background:
    radial-gradient(ellipse at 80% 10%, rgba(245,158,11,.18), transparent 55%),
    radial-gradient(ellipse at 10% 90%, rgba(37,99,235,.28), transparent 55%),
    linear-gradient(180deg, var(--navy-900) 0%, var(--navy-700) 60%, var(--navy-800) 100%);
}
/* Eagle emblem, left of hero copy (moved from the top-right corner) */
.hero::before{
  content:"";
  position:absolute; top:50%; left:-120px; transform:translateY(-50%);
  width:640px; height:640px;
  background:url("static/logo-usbidcenter-full.png") center/contain no-repeat;
  opacity:.07;
  filter:brightness(0) invert(1);
  pointer-events:none;
}
@media (max-width:980px){
  .hero::before{ left:-220px; width:520px; height:520px; opacity:.05; }
}
/* Topographic line texture */
.hero::after{
  content:"";
  position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(0deg, transparent, transparent 39px, rgba(255,255,255,.025) 39px, rgba(255,255,255,.025) 40px),
    repeating-linear-gradient(90deg, transparent, transparent 39px, rgba(255,255,255,.025) 39px, rgba(255,255,255,.025) 40px);
  pointer-events:none;
}
.hero > .container{ position:relative; z-index:1; }

.hero-eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  padding:6px 14px 6px 8px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.04);
  border-radius:var(--radius-pill);
  font-family:var(--font-en);
  font-size:12px; font-weight:600;
  letter-spacing:.1em;
  margin-bottom:24px;
}
.hero-eyebrow .dot{ width:8px; height:8px; background:var(--green-500); border-radius:50%; box-shadow:0 0 0 4px rgba(16,185,129,.2); animation:pulse 2s var(--ease) infinite; }
@keyframes pulse{ 50%{box-shadow:0 0 0 8px rgba(16,185,129,0)} }

.hero h1{
  font-family:var(--font-jp);
  font-weight:900;
  font-size:clamp(36px,5.5vw,68px);
  line-height:1.15;
  letter-spacing:-.02em;
  margin:0 0 24px;
  max-width:18ch;
}
.hero h1 .accent{ color:var(--gold-500); }
.hero h1 .en-only{ font-family:var(--font-en); }

.hero-sub{
  font-size:clamp(16px,1.5vw,19px);
  line-height:1.7;
  color:rgba(255,255,255,.78);
  max-width:620px;
  margin:0 0 36px;
}

.hero-badges{
  display:flex; flex-wrap:wrap; gap:10px; margin-bottom:40px;
}
.hero-badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 14px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius-pill);
  font-size:13px; font-weight:500;
  color:rgba(255,255,255,.92);
}
.hero-badge.is-new::after{
  content:"NEW";
  font-family:var(--font-en);
  font-size:9px; font-weight:800;
  background:var(--gold-500);
  color:var(--navy-900);
  padding:2px 6px; border-radius:3px; margin-left:4px;
  letter-spacing:.05em;
}
.hero-badge svg{ width:14px; height:14px; color:var(--green-500); }

.hero-ctas{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:64px; }

.hero-trust{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  border-top:1px solid rgba(255,255,255,.12);
  padding-top:32px;
  max-width:780px;
}
.hero-trust .stat{
  padding:0 24px;
  border-left:1px solid rgba(255,255,255,.12);
}
.hero-trust .stat:first-child{ border-left:none; padding-left:0; }
.hero-trust .stat .num{
  font-family:var(--font-en);
  font-weight:800;
  font-size:clamp(28px,3.5vw,40px);
  letter-spacing:-.02em;
  color:var(--gold-500);
  line-height:1;
  margin-bottom:8px;
  font-variant-numeric:tabular-nums;
}
.hero-trust .stat .lbl{
  font-size:12px;
  letter-spacing:.08em;
  color:rgba(255,255,255,.7);
  font-weight:500;
}
@media (max-width:600px){
  .hero-trust{ grid-template-columns:1fr; gap:18px; }
  .hero-trust .stat{ padding:0; border-left:none; border-top:1px solid rgba(255,255,255,.1); padding-top:18px;}
  .hero-trust .stat:first-child{ border-top:none; padding-top:0;}
}

/* ============== Tables (bids + awards) ============== */
.table-wrap{
  background:var(--paper);
  border:1px solid var(--hairline);
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow-1);
}
.filter-tabs{
  display:flex; gap:6px; flex-wrap:wrap;
  margin-bottom:20px;
  padding:6px;
  background:var(--paper);
  border:1px solid var(--hairline);
  border-radius:var(--radius-pill);
  width:fit-content;
}
.filter-tab{
  padding:8px 16px;
  border-radius:var(--radius-pill);
  font-size:13px; font-weight:600;
  color:var(--ink-muted);
  transition:all var(--ease) .15s;
}
.filter-tab:hover{ color:var(--navy-700); }
.filter-tab.active{
  background:var(--navy-700); color:var(--paper);
}

.bid-table{ width:100%; border-collapse:collapse; font-size:14px; }
.bid-table thead{
  background:var(--navy-050);
  border-bottom:1px solid var(--hairline);
}
.bid-table th{
  text-align:left;
  padding:14px 14px;
  font-weight:600;
  color:var(--navy-700);
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  white-space:nowrap;
}
.bid-table td{
  padding:18px 14px;
  border-bottom:1px solid var(--hairline);
  vertical-align:middle;
}
.bid-table tbody tr{ transition:background var(--ease) .12s; }
.bid-table tbody tr:hover{ background:var(--navy-050); }
.bid-table tbody tr:last-child td{ border-bottom:none; }
.bid-table .case-no{ font-family:var(--font-mono); font-size:13px; color:var(--navy-700); font-weight:600; white-space:nowrap; }
.bid-table .case-name{ color:var(--ink); font-weight:500; max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bid-table .date{ font-family:var(--font-en); font-variant-numeric:tabular-nums; color:var(--ink-muted); white-space:nowrap; }
.bid-table .award-amount{ font-family:var(--font-en); font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; white-space:nowrap; }

.kind-badge{
  display:inline-block;
  padding:3px 10px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
  border-radius:var(--radius-sm);
  font-family:var(--font-en);
  text-transform:uppercase;
}
.kind-Solicitation{ background:#DBEAFE; color:#1D4ED8; }
.kind-Presolicitation{ background:#E0E7FF; color:#4338CA; }
.kind-Award{ background:#D1FAE5; color:#047857; }

.industry{
  display:inline-flex; align-items:center; gap:6px;
  font-size:13px; color:var(--ink-muted);
}

.dday{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:64px;
  padding:5px 10px;
  font-family:var(--font-en);
  font-weight:700;
  font-size:13px;
  border-radius:var(--radius-pill);
  background:var(--navy-050);
  color:var(--navy-700);
}
.dday.urgent{ background:var(--red-050); color:var(--red-500); }
.dday.warn{ background:var(--orange-050); color:var(--orange-500); }
.dday.done{ background:var(--green-050); color:var(--green-600); }

.table-notice{
  margin-top:16px;
  padding:14px 18px;
  background:var(--gold-050);
  border:1px solid var(--gold-200);
  border-radius:var(--radius-md);
  font-size:13px;
  color:var(--ink-muted);
  display:flex; gap:10px; align-items:flex-start;
}
.table-notice svg{ width:18px; height:18px; flex-shrink:0; color:var(--gold-600); margin-top:1px; }

.section-toolbar{
  display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:16px;
  margin-bottom:24px;
}
.see-all{
  font-size:14px; font-weight:600; color:var(--blue-600);
  display:inline-flex; align-items:center; gap:6px;
  border-bottom:1px solid transparent;
  transition:border-color var(--ease) .15s;
}
.see-all:hover{ border-bottom-color:var(--blue-600); }

/* ============== Why Us cards ============== */
.section-why{ background:var(--paper); }
.why-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.why-card{
  position:relative;
  background:var(--paper);
  border:1px solid var(--hairline);
  border-radius:var(--radius-lg);
  padding:32px 28px;
  transition:all var(--ease) .2s;
}
.why-card:hover{
  border-color:var(--navy-700);
  transform:translateY(-4px);
  box-shadow:var(--shadow-3);
}
.why-card::before{
  content:""; position:absolute; top:0; left:24px; right:24px; height:2px;
  background:var(--gold-500);
  opacity:0; transition:opacity var(--ease) .2s;
}
.why-card:hover::before{ opacity:1; }
.why-icon{
  width:48px; height:48px;
  border-radius:var(--radius-md);
  background:linear-gradient(135deg, var(--navy-700), var(--navy-600));
  color:var(--gold-500);
  display:grid; place-items:center;
  margin-bottom:20px;
}
.why-icon svg{ width:24px; height:24px; }
.why-card h3{
  font-family:var(--font-jp);
  font-weight:700;
  font-size:18px;
  line-height:1.4;
  margin:0 0 12px;
  letter-spacing:-.01em;
}
.why-card p{
  font-size:14px;
  line-height:1.75;
  color:var(--ink-muted);
  margin:0;
}
.new-pill{
  position:absolute; top:24px; right:24px;
  font-family:var(--font-en);
  font-size:10px; font-weight:800;
  letter-spacing:.08em;
  background:var(--gold-500); color:var(--navy-900);
  padding:3px 8px; border-radius:3px;
}
@media (max-width:980px){ .why-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .why-grid{ grid-template-columns:1fr; } }

/* ============== AI chatbot showcase ============== */
.section-ai{
  background:linear-gradient(160deg, var(--navy-800) 0%, var(--navy-900) 100%);
  color:var(--paper);
  overflow:hidden;
}
.section-ai::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 85% 50%, rgba(245,158,11,.12), transparent 50%);
  pointer-events:none;
}
.ai-grid{
  display:grid;
  grid-template-columns:1fr 1.05fr;
  gap:64px;
  align-items:center;
  position:relative; z-index:1;
}
@media (max-width:900px){ .ai-grid{ grid-template-columns:1fr; gap:48px; } }

.section-ai .eyebrow{ color:var(--gold-500); }
.section-ai .section-title{ color:var(--paper); }
.section-ai .ai-sub{
  color:rgba(255,255,255,.78);
  font-size:16px; line-height:1.8;
  margin:0 0 28px;
}
.ai-feats{ list-style:none; padding:0; margin:0 0 36px; display:grid; gap:14px; }
.ai-feats li{
  display:flex; align-items:flex-start; gap:12px;
  font-size:14px; color:rgba(255,255,255,.92);
}
.ai-feats svg{ width:18px; height:18px; color:var(--green-500); flex-shrink:0; margin-top:2px; }

/* chat mockup */
.chat-mock{
  background:var(--paper);
  border-radius:var(--radius-xl);
  box-shadow:0 30px 60px -20px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.06);
  overflow:hidden;
  color:var(--ink);
}
.chat-head{
  display:flex; align-items:center; gap:12px;
  padding:14px 18px;
  background:var(--navy-700); color:var(--paper);
}
.chat-head .avatar{
  width:36px;height:36px;border-radius:50%;
  background:linear-gradient(135deg, var(--gold-500), var(--gold-600));
  display:grid; place-items:center; color:var(--navy-900);
}
.chat-head .avatar svg{ width:20px; height:20px; }
.chat-head .name{ font-weight:700; font-size:14px; }
.chat-head .status{ font-size:11px; opacity:.75; display:flex; align-items:center; gap:6px; }
.chat-head .status::before{ content:""; width:6px;height:6px;border-radius:50%; background:var(--green-500); }
.chat-body{
  padding:24px 20px;
  background:var(--navy-050);
  display:flex; flex-direction:column; gap:14px;
  max-height:480px; overflow:hidden;
}
.bubble{
  max-width:88%;
  padding:14px 16px;
  font-size:13.5px;
  line-height:1.65;
  border-radius:14px;
}
.bubble.user{
  align-self:flex-end;
  background:var(--blue-600); color:var(--paper);
  border-bottom-right-radius:4px;
}
.bubble.ai{
  align-self:flex-start;
  background:var(--paper); color:var(--ink);
  border:1px solid var(--hairline);
  border-bottom-left-radius:4px;
  box-shadow:var(--shadow-1);
}
.bubble.ai .lead{ margin-bottom:8px; font-weight:600; color:var(--navy-700); }
.bubble.ai ul{
  list-style:none; padding:0; margin:6px 0;
  display:grid; gap:7px;
}
.bubble.ai li{
  display:flex; gap:8px; align-items:flex-start;
  padding:8px 10px;
  background:var(--navy-050);
  border-radius:6px;
  font-size:12.5px;
}
.bubble.ai li .b-name{ font-weight:600; color:var(--navy-700); }
.bubble.ai li .meta{ color:var(--ink-muted); font-size:11.5px; font-family:var(--font-en); }
.bubble.ai .followup{ margin-top:10px; color:var(--ink-muted); }
.chat-input{
  padding:14px 18px;
  background:var(--paper);
  border-top:1px solid var(--hairline);
  display:flex; gap:10px; align-items:center;
}
.chat-input .field{
  flex:1; padding:10px 14px; border:1px solid var(--hairline);
  border-radius:var(--radius-pill); font-size:13px; color:var(--ink-faint);
}
.chat-input .send{
  width:36px;height:36px;border-radius:50%;
  background:var(--blue-600); color:var(--paper);
  display:grid; place-items:center;
}
.chat-input .send svg{ width:16px;height:16px; }

/* ============== Pricing ============== */
.section-pricing{ background:var(--paper); }
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
  align-items:stretch;
}
.pricing-grid-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
  max-width:880px;
  margin:0 auto;
}
.plan-annual{ font-size:13px; color:var(--ink-muted); margin:-4px 0 12px; }
.plan-annual b{ color:var(--green-600); font-weight:700; }
.plan-invoice-note{ font-size:12px; color:var(--ink-muted); text-align:center; max-width:760px; margin:20px auto 0; line-height:1.6; }
.plan{
  background:var(--paper);
  border:1px solid var(--hairline);
  border-radius:var(--radius-lg);
  padding:36px 30px;
  display:flex; flex-direction:column;
  transition:all var(--ease) .25s;
  position:relative;
}
.plan:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-3);
  border-color:var(--navy-700);
}
.plan.featured{
  background:linear-gradient(180deg, var(--navy-700), var(--navy-800));
  color:var(--paper);
  border-color:transparent;
  transform:scale(1.03);
  box-shadow:var(--shadow-3);
}
.plan.featured:hover{ transform:scale(1.05) translateY(-4px); }
.plan-badge{
  position:absolute; top:-12px; left:50%; transform:translateX(-50%);
  background:var(--gold-500); color:var(--navy-900);
  font-family:var(--font-en); font-weight:800; font-size:11px;
  letter-spacing:.08em;
  padding:6px 14px; border-radius:var(--radius-pill);
}
.plan-name{
  font-family:var(--font-jp);
  font-weight:700;
  font-size:18px;
  letter-spacing:.02em;
  margin:0 0 6px;
}
.plan-name .plan-en{ display:block; font-family:var(--font-en); font-size:11px; letter-spacing:.14em; text-transform:uppercase; opacity:.6; font-weight:600; margin-top:4px; }
.plan-price{
  display:flex; align-items:baseline; gap:6px;
  margin:14px 0 24px;
}
.plan-price .currency{ font-family:var(--font-en); font-size:18px; font-weight:600; }
.plan-price .num{ font-family:var(--font-en); font-size:44px; font-weight:800; letter-spacing:-.02em; line-height:1; }
.plan-price .unit{ font-size:13px; opacity:.7; }
.plan-free .num{ font-size:36px; }
.plan ul{ list-style:none; padding:0; margin:0 0 28px; display:grid; gap:10px; flex:1; }
.plan li{
  display:flex; gap:10px; align-items:flex-start;
  font-size:14px; line-height:1.55;
}
.plan li svg{ width:18px; height:18px; flex-shrink:0; margin-top:1px; }
.plan li.yes svg{ color:var(--green-500); }
.plan li.no{ opacity:.45; }
.plan li.no svg{ color:currentColor; }
.plan .btn{ width:100%; }
.plan.featured .btn-primary{ background:var(--gold-500); color:var(--navy-900); }
.plan.featured .btn-primary:hover{ background:var(--gold-600); color:var(--paper); }
.plan-trial-note{
  font-size:11.5px;
  line-height:1.55;
  opacity:.75;
  margin:12px 0 0;
  text-align:center;
}
@media (max-width:780px){
  .pricing-grid{ grid-template-columns:1fr; }
  .pricing-grid-2{ grid-template-columns:1fr; max-width:none; }
  .plan.featured{ transform:none; }
  .plan.featured:hover{ transform:translateY(-4px); }
}
.pricing-note{
  margin-top:28px; text-align:center;
  font-size:13px; color:var(--ink-muted);
}
.pricing-note strong{ color:var(--ink); }

/* ============== Consulting service pricing section ============== */
.section-svc{ background:var(--bg); }
.svc-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
}
@media (max-width:760px){ .svc-grid{ grid-template-columns:1fr; } }

.svc-card{
  background:var(--paper);
  border:1px solid var(--hairline);
  border-radius:var(--radius-lg);
  padding:28px 28px 26px;
  display:flex; flex-direction:column; gap:14px;
  position:relative;
  transition:all var(--ease) .2s;
}
.svc-card:hover{
  border-color:var(--navy-700);
  box-shadow:var(--shadow-3);
  transform:translateY(-4px);
}
.svc-card-head{
  display:grid;
  grid-template-columns:56px 1fr auto;
  gap:16px;
  align-items:start;
}
.svc-icon{
  width:56px; height:56px;
  border-radius:var(--radius-md);
  background:linear-gradient(135deg, var(--navy-700), var(--navy-600));
  color:var(--gold-500);
  display:grid; place-items:center;
  flex-shrink:0;
}
.svc-icon svg{ width:26px; height:26px; }
.svc-meta{ display:flex; flex-direction:column; gap:8px; min-width:0; }
.svc-name{
  font-family:var(--font-jp);
  font-weight:700;
  font-size:16px;
  line-height:1.4;
  color:var(--ink);
  letter-spacing:-.01em;
}
.svc-tag{
  display:inline-flex; align-items:center;
  font-size:11px; font-weight:700;
  letter-spacing:.04em;
  padding:4px 10px;
  border-radius:var(--radius-sm);
  width:fit-content;
  white-space:nowrap;
}
.svc-tag-neutral{ background:var(--navy-050); color:var(--navy-700); }
.svc-tag-gold{
  background:var(--gold-500);
  color:var(--navy-900);
  font-weight:800;
}
.svc-tag-danger{
  background:var(--red-500);
  color:var(--paper);
  font-weight:800;
}
.svc-price{
  display:flex; align-items:baseline; gap:2px;
  font-family:var(--font-en);
  font-variant-numeric:tabular-nums;
  text-align:right;
  flex-direction:column;
  align-items:flex-end;
}
.svc-price .price-amt{
  font-weight:800;
  font-size:22px;
  letter-spacing:-.02em;
  color:var(--ink);
  line-height:1.1;
}
.svc-price .price-unit{
  font-family:var(--font-jp);
  font-size:12px;
  color:var(--ink-muted);
  font-weight:600;
}
.svc-price .price-quote{
  font-family:var(--font-jp);
  font-style:italic;
  font-size:14px;
  font-weight:600;
  color:var(--ink-faint);
  letter-spacing:0;
}
.svc-desc{
  font-size:13.5px;
  line-height:1.75;
  color:var(--ink-muted);
  margin:0;
}
.svc-link{
  display:inline-flex; align-items:center; gap:6px;
  font-size:13px; font-weight:700;
  color:var(--gold-700);
  margin-top:8px;
  text-decoration:none;
  transition:gap var(--ease) .15s, color var(--ease) .15s;
}
.svc-link:hover{
  color:var(--navy-700);
  gap:10px;
}

/* Footer notice + CTA inside services section */
.svc-footer{
  margin-top:32px;
  background:var(--navy-700);
  color:var(--paper);
  border-radius:var(--radius-lg);
  padding:28px 32px;
  display:flex; align-items:center; gap:28px;
  flex-wrap:wrap;
  border-left:4px solid var(--gold-500);
}
.svc-footer-copy{
  flex:1 1 380px;
  font-size:13.5px;
  line-height:1.8;
  color:rgba(255,255,255,.85);
}
.svc-footer .btn{ flex-shrink:0; }
@media (max-width:760px){
  .svc-card-head{ grid-template-columns:48px 1fr; }
  .svc-icon{ width:48px; height:48px; }
  .svc-icon svg{ width:22px; height:22px; }
  .svc-price{
    grid-column:1 / -1;
    flex-direction:row;
    align-items:baseline;
    justify-content:flex-start;
    padding-top:4px;
    border-top:1px dashed var(--hairline);
  }
  .svc-footer{ padding:22px 24px; }
}

/* ============== CMMC urgent banner ============== */
.cmmc-alert{
  background:linear-gradient(110deg, #7F1D1D 0%, #B91C1C 55%, #DC2626 100%);
  color:var(--paper);
  padding:32px 0;
  position:relative;
  overflow:hidden;
  border-top:3px solid var(--gold-500);
  border-bottom:3px solid var(--gold-500);
}
.cmmc-alert::before{
  content:"";
  position:absolute; inset:0;
  background:
    repeating-linear-gradient(45deg, transparent 0 18px, rgba(255,255,255,.04) 18px 19px);
  pointer-events:none;
}
.cmmc-alert .container{
  position:relative; z-index:1;
  display:flex; align-items:center; gap:28px; flex-wrap:wrap;
}
.cmmc-alert .siren{
  width:64px; height:64px;
  flex-shrink:0;
  border-radius:50%;
  background:rgba(255,255,255,.12);
  display:grid; place-items:center;
  border:2px solid rgba(255,255,255,.3);
  animation:siren 2s var(--ease) infinite;
}
@keyframes siren{ 50%{ box-shadow: 0 0 0 12px rgba(245,158,11,0); background:rgba(255,255,255,.2);} 0%,100%{box-shadow: 0 0 0 0 rgba(245,158,11,.5);} }
.cmmc-alert .siren svg{ width:32px; height:32px; color:var(--gold-200); }
.cmmc-alert .copy{ flex:1 1 360px; min-width:260px; }
.cmmc-alert .tag{
  display:inline-flex; align-items:center; gap:6px;
  font-family:var(--font-en); font-weight:800;
  font-size:10px; letter-spacing:.16em;
  background:var(--gold-500); color:var(--navy-900);
  padding:4px 10px; border-radius:var(--radius-sm);
  margin-bottom:10px;
  text-transform:uppercase;
}
.cmmc-alert h3{
  font-family:var(--font-jp);
  font-weight:900;
  font-size:clamp(20px,2.5vw,26px);
  line-height:1.35;
  margin:0 0 8px;
  letter-spacing:-.01em;
}
.cmmc-alert h3 .hi{ color:var(--gold-200); }
.cmmc-alert p{ margin:0; font-size:14.5px; color:rgba(255,255,255,.88); line-height:1.7; }
.cmmc-alert .btn-emergency{
  background:var(--paper); color:#991B1B;
  font-weight:800;
  padding:14px 24px;
  border-radius:var(--radius-md);
  display:inline-flex; align-items:center; gap:8px;
  white-space:nowrap;
  flex-shrink:0;
  transition:all var(--ease) .15s;
}
.cmmc-alert .btn-emergency:hover{ background:var(--gold-500); color:var(--navy-900); transform:translateY(-1px); box-shadow:var(--shadow-2); }

/* ============== Coverage map ============== */
.section-map{ background:var(--bg); }
.regions{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
@media (max-width:900px){ .regions{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:580px){ .regions{ grid-template-columns:1fr; } }
.region{
  background:var(--paper);
  border:1px solid var(--hairline);
  border-radius:var(--radius-lg);
  padding:24px 24px 22px;
}
.region-head{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:16px;
  padding-bottom:14px;
  border-bottom:1px solid var(--hairline);
}
.region-head .name{ font-weight:700; font-size:14px; color:var(--navy-700); }
.region-head .name .en{ font-family:var(--font-en); font-weight:500; font-size:11px; color:var(--ink-faint); letter-spacing:.1em; text-transform:uppercase; margin-left:6px; }
.region-head .count{
  font-family:var(--font-en); font-size:12px; font-weight:700;
  background:var(--navy-050); color:var(--navy-700);
  padding:3px 8px; border-radius:var(--radius-sm);
}
.base-list{ display:flex; flex-wrap:wrap; gap:8px; }
.base-chip{
  position:relative;
  display:inline-flex; align-items:center; gap:6px;
  padding:7px 12px;
  background:var(--bg);
  border:1px solid var(--hairline);
  border-radius:var(--radius-pill);
  font-size:12.5px;
  color:var(--ink);
  cursor:default;
  transition:all var(--ease) .15s;
}
.base-chip:hover{ background:var(--navy-700); color:var(--paper); border-color:var(--navy-700); }
.base-chip .pin{ width:6px; height:6px; border-radius:50%; background:var(--gold-500); }
.base-chip:hover .pin{ background:var(--paper); }
.base-chip[data-tip]:hover::after{
  content:attr(data-tip);
  position:absolute; bottom:calc(100% + 8px); left:50%;
  transform:translateX(-50%);
  background:var(--navy-900); color:var(--paper);
  font-size:11px; padding:6px 10px; border-radius:4px;
  white-space:nowrap;
  box-shadow:var(--shadow-2);
  pointer-events:none;
  z-index:5;
}

/* ============== Stats section ============== */
.section-stats{ background:var(--bg); }
.stats-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}
@media (max-width:900px){ .stats-grid{ grid-template-columns:repeat(2,1fr); } }
.stat-card{
  background:var(--paper);
  border:1px solid var(--hairline);
  border-radius:var(--radius-lg);
  padding:32px 28px;
  text-align:left;
  position:relative;
  overflow:hidden;
}
.stat-card::before{
  content:""; position:absolute; top:0; left:0; height:3px; width:48px;
  background:var(--gold-500);
}
.stat-card .num{
  font-family:var(--font-en);
  font-weight:800;
  font-size:48px;
  letter-spacing:-.02em;
  color:var(--navy-700);
  line-height:1;
  font-variant-numeric:tabular-nums;
  margin-bottom:10px;
}
.stat-card .num .suffix{ font-size:24px; color:var(--gold-600); margin-left:2px; }
.stat-card .lbl{ font-size:14px; color:var(--ink-muted); font-weight:500; }
.stats-note{
  margin-top:40px;
  background:var(--paper);
  border:1px solid var(--hairline);
  border-left:3px solid var(--gold-500);
  padding:22px 26px;
  border-radius:var(--radius-md);
  font-size:15px;
  color:var(--ink-muted);
  line-height:1.75;
}

/* ============== SAM banner ============== */
.sam-banner{
  background:linear-gradient(110deg, var(--gold-600) 0%, var(--gold-500) 60%, #FBBF24 100%);
  padding:48px 0;
  color:var(--navy-900);
  position:relative;
  overflow:hidden;
}
.sam-banner::before{
  content:""; position:absolute; right:-40px; top:-30px; width:300px; height:300px;
  background:url("static/logo-usbidcenter-full.png") center/contain no-repeat;
  opacity:.1; pointer-events:none;
}
.sam-banner .container{
  display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap; position:relative; z-index:1;
}
.sam-banner h3{
  font-family:var(--font-jp);
  font-weight:900;
  font-size:clamp(22px,3vw,30px);
  margin:0 0 8px;
  letter-spacing:-.01em;
}
.sam-banner p{ margin:0; font-size:15px; opacity:.85; }
.sam-banner .btn-dark{
  background:var(--navy-900); color:var(--paper);
  padding:14px 26px; border-radius:var(--radius-md); font-weight:700;
}
.sam-banner .btn-dark:hover{ background:var(--navy-700); }

/* ============== FAQ ============== */
.section-faq{ background:var(--paper); }
.faq-list{ max-width:880px; margin:0 auto; }
.faq-item{
  border:1px solid var(--hairline);
  border-radius:var(--radius-md);
  margin-bottom:12px;
  background:var(--paper);
  overflow:hidden;
  transition:border-color var(--ease) .15s;
}
.faq-item.open{ border-color:var(--navy-700); }
.faq-q{
  width:100%;
  display:flex; align-items:center; gap:16px;
  text-align:left;
  padding:22px 24px;
  font-weight:600;
  font-size:16px;
  color:var(--ink);
  line-height:1.5;
}
.faq-q .q-mark{
  font-family:var(--font-en);
  font-weight:800; font-size:14px;
  color:var(--gold-600);
  flex-shrink:0;
}
.faq-q .toggle{
  margin-left:auto;
  width:24px; height:24px;
  display:grid; place-items:center;
  color:var(--ink-muted);
  flex-shrink:0;
  transition:transform var(--ease) .25s;
}
.faq-item.open .toggle{ transform:rotate(45deg); color:var(--navy-700); }
.faq-a{
  max-height:0; overflow:hidden;
  transition:max-height var(--ease) .35s;
}
.faq-a-inner{
  padding:0 24px 22px 56px;
  color:var(--ink-muted);
  font-size:15px;
  line-height:1.8;
}

/* ============== Final CTA ============== */
.section-cta{
  background:
    radial-gradient(ellipse at 70% 30%, rgba(245,158,11,.14), transparent 55%),
    linear-gradient(180deg, var(--navy-800) 0%, var(--navy-900) 100%);
  color:var(--paper);
  text-align:center;
  position:relative;
  overflow:hidden;
}
.section-cta::before{
  content:""; position:absolute; left:50%; top:50%;
  width:600px; height:600px; transform:translate(-50%,-50%);
  background:url("static/logo-usbidcenter-full.png") center/contain no-repeat;
  opacity:.04;
  filter:brightness(0) invert(1);
  pointer-events:none;
}
.section-cta > .container{ position:relative; z-index:1; }
.section-cta h2{
  font-family:var(--font-jp);
  font-weight:900;
  font-size:clamp(32px,4.5vw,52px);
  margin:0 0 16px;
  letter-spacing:-.02em;
}
.section-cta .sub{
  font-size:18px; color:rgba(255,255,255,.78);
  margin:0 0 40px;
}
.section-cta .small{
  margin-top:24px;
  font-size:13px; color:rgba(255,255,255,.55);
  font-family:var(--font-en);
}
.section-cta .small a{ color:var(--gold-500); border-bottom:1px solid var(--gold-500); }

/* ============== Footer ============== */
.footer{
  background:var(--navy-900);
  color:rgba(255,255,255,.7);
  padding:64px 0 28px;
  font-size:14px;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1.2fr;
  gap:40px;
  margin-bottom:48px;
}
@media (max-width:760px){ .footer-grid{ grid-template-columns:1fr 1fr; gap:32px; } }
@media (max-width:480px){ .footer-grid{ grid-template-columns:1fr; } }
.footer .brand{ color:var(--paper); margin-bottom:16px; }
.footer .desc{ font-size:13px; line-height:1.75; }
.footer h4{
  font-family:var(--font-jp);
  font-weight:700;
  color:var(--paper);
  font-size:13px;
  letter-spacing:.06em;
  margin:0 0 16px;
}
.footer ul{ list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.footer ul a{ font-size:13px; color:rgba(255,255,255,.7); transition:color var(--ease) .15s; }
.footer ul a:hover{ color:var(--gold-500); }
.footer .contact-block{ font-size:13px; line-height:1.85; }
.footer .contact-block a{ color:var(--gold-500); }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);
  padding-top:22px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  font-family:var(--font-en);
  font-size:12px; color:rgba(255,255,255,.5);
}

/* ============== Responsive tweaks ============== */
/* Bid + Award tables: always allow horizontal scroll so right-edge columns
   never get clipped on narrower laptop viewports. Card layout kicks in below 560px. */
.table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.bid-table{ min-width:880px; }
@media (max-width:1100px){
  .bid-table{ min-width:980px; }
}
@media (max-width:560px){
  .table-wrap{ overflow-x:visible; }
  .bid-table{ min-width:0; }
  .bid-table thead{ display:none; }
  .bid-table, .bid-table tbody, .bid-table tr, .bid-table td{ display:block; width:100%; }
  .bid-table tr{
    border-bottom:1px solid var(--hairline);
    padding:14px 16px;
  }
  .bid-table tr:last-child{ border-bottom:none; }
  .bid-table td{
    padding:6px 0;
    border:none;
    display:flex; justify-content:space-between; align-items:center; gap:12px;
  }
  .bid-table td::before{
    content:attr(data-label);
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.06em;
    color:var(--ink-faint);
    font-weight:600;
  }
  .bid-table .case-name{ max-width:none; text-align:right; white-space:normal; overflow:visible; }
}

.reveal{ opacity:0; transform:translateY(20px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:none; }

/* small util */
.no-wrap{white-space:nowrap}


/* ============== Multi-page additions ============== */

/* Active nav link */
.nav-links a.is-active{ color:var(--gold-500); }
.nav.scrolled .nav-links a.is-active{ color:var(--navy-700); }

/* ----- Pricing redirect banner on index ----- */
.svc-redirect{ padding:48px 0; background:var(--paper); }
.svc-redirect-card{
  background:linear-gradient(135deg, var(--navy-700) 0%, var(--navy-800) 100%);
  color:var(--paper);
  border-radius:var(--radius-lg);
  padding:40px 44px;
  display:flex; align-items:center; justify-content:space-between; gap:32px;
  flex-wrap:wrap;
  position:relative;
  overflow:hidden;
  border-left:4px solid var(--gold-500);
}
.svc-redirect-card::after{
  content:""; position:absolute; right:-40px; bottom:-60px;
  width:280px; height:280px;
  background:url("static/logo-usbidcenter-full.png") center/contain no-repeat;
  opacity:.05;
  filter:brightness(0) invert(1);
  pointer-events:none;
}
.svc-redirect-copy{ flex:1 1 400px; position:relative; z-index:1; }
.svc-redirect h3{
  font-family:var(--font-jp);
  font-weight:800;
  font-size:clamp(20px,2.4vw,26px);
  line-height:1.4;
  margin:0 0 10px;
  letter-spacing:-.01em;
}
.svc-redirect-sub{
  margin:0;
  font-size:14.5px;
  line-height:1.7;
  color:rgba(255,255,255,.8);
}
.svc-redirect .btn{ flex-shrink:0; position:relative; z-index:1; }
@media (max-width:680px){
  .svc-redirect-card{ padding:28px 24px; }
}

/* ----- Page header for subpages (lighter than hero) ----- */
.page-header{
  position:relative;
  padding:calc(var(--header-h) + 80px) 0 80px;
  color:var(--paper);
  overflow:hidden;
  background:
    radial-gradient(ellipse at 80% 20%, rgba(245,158,11,.16), transparent 55%),
    linear-gradient(180deg, var(--navy-900) 0%, var(--navy-700) 100%);
}
.page-header::before{
  content:"";
  position:absolute; top:-40px; right:-80px;
  width:420px; height:420px;
  background:url("static/logo-usbidcenter-full.png") center/contain no-repeat;
  opacity:.06;
  filter:brightness(0) invert(1);
  pointer-events:none;
}
.page-header::after{
  content:"";
  position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(0deg, transparent, transparent 39px, rgba(255,255,255,.025) 39px, rgba(255,255,255,.025) 40px),
    repeating-linear-gradient(90deg, transparent, transparent 39px, rgba(255,255,255,.025) 39px, rgba(255,255,255,.025) 40px);
  pointer-events:none;
}
.page-header > .container{ position:relative; z-index:1; max-width:880px; }
.page-header .breadcrumb{
  font-family:var(--font-en);
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gold-500);
  margin-bottom:16px;
  display:flex; align-items:center; gap:10px;
}
.page-header .breadcrumb a{ color:rgba(255,255,255,.6); transition:color var(--ease) .15s; }
.page-header .breadcrumb a:hover{ color:var(--gold-500); }
.page-header .breadcrumb .sep{ color:rgba(255,255,255,.3); }
.page-header h1{
  font-family:var(--font-jp);
  font-weight:900;
  font-size:clamp(32px,4.5vw,52px);
  line-height:1.15;
  letter-spacing:-.02em;
  margin:0 0 18px;
}
.page-header .lede{
  font-size:clamp(15px,1.4vw,18px);
  line-height:1.7;
  color:rgba(255,255,255,.78);
  max-width:680px;
  margin:0;
}

/* ----- Login banner (used on bids/awards) ----- */
.login-banner{
  margin-top:32px;
  background:var(--gold-050);
  border:1px solid var(--gold-200);
  border-left:4px solid var(--gold-500);
  border-radius:var(--radius-md);
  padding:28px 32px;
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
}
.login-banner-copy{ flex:1 1 320px; }
.login-banner h4{
  font-family:var(--font-jp);
  font-weight:700;
  font-size:18px;
  margin:0 0 6px;
  color:var(--navy-700);
}
.login-banner p{ margin:0; font-size:14px; color:var(--ink-muted); line-height:1.6; }
.login-banner-actions{ display:flex; gap:12px; flex-wrap:wrap; }

/* ----- Info-prop cards (used on awards page) ----- */
.info-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
@media (max-width:820px){ .info-grid{ grid-template-columns:1fr; } }
.info-card{
  background:var(--paper);
  border:1px solid var(--hairline);
  border-radius:var(--radius-lg);
  padding:28px 28px 26px;
  transition:all var(--ease) .2s;
  position:relative;
}
.info-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:var(--navy-700); }
.info-card .step{
  font-family:var(--font-en);
  font-weight:800;
  font-size:12px;
  letter-spacing:.16em;
  color:var(--gold-600);
  margin-bottom:14px;
}
.info-card h4{
  font-family:var(--font-jp);
  font-weight:700;
  font-size:17px;
  line-height:1.45;
  margin:0 0 10px;
  letter-spacing:-.01em;
}
.info-card p{ margin:0; font-size:13.5px; color:var(--ink-muted); line-height:1.75; }

/* ----- Contact form ----- */
.contact-layout{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:48px;
  align-items:start;
}
@media (max-width:920px){ .contact-layout{ grid-template-columns:1fr; gap:32px; } }
.contact-form{
  background:var(--paper);
  border:1px solid var(--hairline);
  border-radius:var(--radius-lg);
  padding:36px 36px 32px;
}
.contact-form h3{
  font-family:var(--font-jp);
  font-weight:700;
  font-size:20px;
  margin:0 0 24px;
  padding-bottom:16px;
  border-bottom:1px solid var(--hairline);
}
.form-grid{ display:grid; gap:18px; }
.form-row{ display:grid; gap:6px; }
.form-row.two{ grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:560px){ .form-row.two{ grid-template-columns:1fr; } }
.form-label{
  font-size:13px;
  font-weight:600;
  color:var(--ink);
  display:flex; align-items:center; gap:6px;
}
.form-label .req{
  color:var(--red-500);
  font-size:14px;
  line-height:1;
}
.form-input, .form-select, .form-textarea{
  width:100%;
  font:inherit;
  font-size:14.5px;
  color:var(--ink);
  background:var(--paper);
  border:1px solid var(--hairline-strong);
  border-radius:var(--radius-md);
  padding:11px 14px;
  transition:border-color var(--ease) .15s, box-shadow var(--ease) .15s;
}
.form-input:focus, .form-select:focus, .form-textarea:focus{
  outline:none;
  border-color:var(--navy-700);
  box-shadow:0 0 0 3px rgba(27,46,75,.12);
}
.form-textarea{ resize:vertical; min-height:120px; font-family:var(--font-jp); }
.form-select{
  appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.5'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat;
  background-position:right 12px center;
  padding-right:36px;
}
.form-check{
  display:flex; align-items:flex-start; gap:10px;
  font-size:13.5px;
  color:var(--ink-muted);
  line-height:1.6;
  cursor:pointer;
}
.form-check input{
  margin-top:3px;
  width:18px; height:18px;
  accent-color:var(--navy-700);
  flex-shrink:0;
}
.form-submit{
  margin-top:6px;
  width:100%;
  padding:14px 24px;
  font-size:16px;
}

/* Contact sidebar */
.contact-side > section{
  background:var(--paper);
  border:1px solid var(--hairline);
  border-radius:var(--radius-lg);
  padding:24px 26px;
  margin-bottom:18px;
}
.contact-side h4{
  font-family:var(--font-jp);
  font-weight:700;
  font-size:14px;
  letter-spacing:.04em;
  margin:0 0 14px;
  color:var(--navy-700);
  display:flex; align-items:center; gap:10px;
}
.contact-side h4::before{
  content:""; width:18px; height:2px; background:var(--gold-500);
}
.contact-side .channel{
  font-size:14px;
  color:var(--ink);
  line-height:1.85;
}
.contact-side .channel a{ color:var(--blue-600); border-bottom:1px solid currentColor; }
.contact-side .channel small{ color:var(--ink-muted); }
.contact-side ul.bullets{
  list-style:none; padding:0; margin:0;
  display:grid; gap:10px;
}
.contact-side ul.bullets li{
  font-size:13.5px;
  color:var(--ink-muted);
  display:flex; gap:10px;
  padding-left:14px;
  position:relative;
}
.contact-side ul.bullets li::before{
  content:""; position:absolute; left:0; top:9px;
  width:5px; height:5px;
  background:var(--gold-500);
  border-radius:50%;
}
.contact-side .korea-link{
  background:var(--navy-700); color:var(--paper); border:none;
}
.contact-side .korea-link h4{ color:var(--gold-500); }
.contact-side .korea-link p{ font-size:13.5px; line-height:1.75; color:rgba(255,255,255,.85); margin:0; }
.contact-side .korea-link a{ color:var(--gold-500); }

/* Compact CTA strip used at bottom of services etc */
.cta-strip{
  background:linear-gradient(135deg, var(--navy-700), var(--navy-900));
  color:var(--paper);
  text-align:center;
  padding:64px 0;
}
.cta-strip h2{
  font-family:var(--font-jp);
  font-weight:900;
  font-size:clamp(26px,3.5vw,36px);
  margin:0 0 14px;
}
.cta-strip p{ color:rgba(255,255,255,.78); margin:0 0 24px; font-size:15px; }

/* ============== Cookie Consent Banner ============== */
.cookie-banner{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:1000;
  max-width:920px; margin:0 auto;
  background:var(--parchment);
  border:1px solid var(--gold-500);
  border-radius:var(--radius-md);
  padding:18px 22px;
  box-shadow:var(--shadow-3);
  transform:translateY(140%);
  transition:transform .35s var(--ease);
}
.cookie-banner.visible{ transform:translateY(0); }
.cookie-banner-inner{
  display:flex; gap:24px; align-items:center; flex-wrap:wrap;
}
.cookie-banner-text{
  flex:1; min-width:280px;
  font-size:14px; line-height:1.6; color:var(--ink);
}
.cookie-banner-text a{
  color:var(--gold-600); text-decoration:underline; font-weight:600;
}
.cookie-banner-actions{
  display:flex; gap:10px; flex-shrink:0;
}
.cookie-banner-actions .btn{
  padding:8px 18px; font-size:14px;
}
@media (max-width:600px){
  .cookie-banner{ left:8px; right:8px; bottom:8px; padding:14px; }
  .cookie-banner-inner{ gap:14px; }
  .cookie-banner-actions{ width:100%; }
  .cookie-banner-actions .btn{ flex:1; }
}

/* ============== Disabled state (e.g. unimplemented login) ============== */
.btn-login.disabled, a.disabled{
  opacity:.45;
  cursor:not-allowed;
  pointer-events:none;
}

/* ============== Dynamic data status bar ============== */
.data-status{
  font-size:13px; color:var(--ink-muted);
  font-family:var(--font-en);
  margin-bottom:12px;
  letter-spacing:.02em;
}

/* ============== Pagination ============== */
.pagination{
  display:flex; align-items:center; justify-content:center;
  gap:6px;
  margin:28px 0 8px;
  flex-wrap:wrap;
}
.page-btn{
  min-width:36px; height:36px;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--paper);
  border:1px solid var(--hairline-strong);
  color:var(--ink-muted);
  font-family:var(--font-en);
  font-weight:600; font-size:13px;
  border-radius:var(--radius-sm);
  cursor:pointer;
  padding:0 10px;
  transition:all var(--ease) .15s;
}
.page-btn:hover:not(:disabled):not(.active){
  border-color:var(--navy-700);
  color:var(--navy-700);
  background:var(--bg);
}
.page-btn.active{
  background:var(--navy-700);
  color:var(--paper);
  border-color:var(--navy-700);
  cursor:default;
}
.page-btn:disabled{
  opacity:.35;
  cursor:not-allowed;
}
.page-btn.pg-nav{ font-size:18px; line-height:1; }
.page-ellipsis{
  color:var(--ink-faint);
  padding:0 4px;
  font-size:14px;
  user-select:none;
}
.page-info{
  margin-left:14px;
  font-size:12px;
  color:var(--ink-faint);
  font-family:var(--font-en);
  letter-spacing:.02em;
}
@media (max-width:600px){
  .pagination{ gap:4px; margin-top:20px; }
  .page-btn{ min-width:32px; height:32px; font-size:12px; padding:0 8px; }
  .page-info{ flex-basis:100%; text-align:center; margin:8px 0 0; }
}

/* ============== BETA notice banner + modal ============== */
.beta-banner{
  background:linear-gradient(90deg, var(--navy-900), var(--navy-700));
  color:var(--paper);
  font-size:13px;
  border-bottom:2px solid var(--gold-500);
  /* 헤더 nav(z-index:100) 위에 fixed로 고정 — 메뉴와 겹침 방지 */
  position:fixed;
  top:0; left:0; right:0;
  z-index:101;
}
/* 배너가 떠 있는 동안 nav를 배너 높이만큼 아래로 밀고, 본문도 그만큼 padding */
body.has-beta-banner .nav{ top:44px; }
body.has-beta-banner{ padding-top:44px; }
@media (max-width:600px){
  body.has-beta-banner .nav{ top:64px; }    /* 모바일은 텍스트 줄바꿈으로 키 큼 */
  body.has-beta-banner{ padding-top:64px; }
}
.beta-banner-inner{
  display:flex; align-items:center; gap:14px;
  max-width:1200px; margin:0 auto;
  padding:10px 20px;
  flex-wrap:wrap;
}
.beta-tag{
  background:var(--gold-500); color:var(--navy-900);
  font-family:var(--font-en); font-weight:800; font-size:10.5px;
  padding:3px 9px; border-radius:3px;
  letter-spacing:.14em;
  flex-shrink:0;
}
.beta-text{ flex:1; min-width:200px; line-height:1.5; color:rgba(255,255,255,.92); }
.beta-details{
  background:transparent; border:1px solid var(--gold-500); color:var(--gold-500);
  font-size:12px; font-weight:700; padding:5px 12px;
  border-radius:4px; cursor:pointer; font-family:inherit;
  flex-shrink:0;
  transition:all var(--ease) .15s;
}
.beta-details:hover{ background:var(--gold-500); color:var(--navy-900); }
.beta-close{
  background:transparent; border:none; color:rgba(255,255,255,.55);
  font-size:22px; cursor:pointer; line-height:1; padding:2px 6px;
  flex-shrink:0;
  font-family:inherit;
}
.beta-close:hover{ color:var(--paper); }
@media (max-width:600px){
  .beta-banner-inner{ padding:8px 14px; gap:10px; }
  .beta-text{ font-size:12px; line-height:1.4; flex-basis:100%; order:3; }
  .beta-tag{ order:1; }
  .beta-details{ order:2; margin-left:auto; }
  .beta-close{ order:4; position:absolute; top:6px; right:8px; }
}

/* 모달 */
.beta-modal-back{
  display:none;
  position:fixed; inset:0; z-index:1100;
  background:rgba(15,23,42,.7);
  align-items:flex-start; justify-content:center;
  padding:40px 20px;
  overflow-y:auto;
  animation:fadeIn .2s var(--ease);
}
.beta-modal-back.show{ display:flex; }
@keyframes fadeIn{ from{ opacity:0; } to{ opacity:1; } }
.beta-modal{
  background:var(--paper);
  border-radius:var(--radius-lg);
  max-width:560px; width:100%;
  padding:40px 36px 32px;
  position:relative;
  box-shadow:0 24px 48px -8px rgba(0,0,0,.4);
  animation:slideUp .25s var(--ease);
}
@keyframes slideUp{ from{ transform:translateY(20px); opacity:0; } to{ transform:translateY(0); opacity:1; } }
.beta-modal-close{
  position:absolute; top:14px; right:14px;
  background:transparent; border:none;
  width:36px; height:36px; border-radius:50%;
  color:var(--ink-muted); cursor:pointer; font-size:22px;
  line-height:1;
  transition:all var(--ease) .15s;
}
.beta-modal-close:hover{ background:var(--bg); color:var(--ink); }
.beta-modal-head{
  text-align:center;
  margin-bottom:20px;
}
.beta-modal-tag{
  display:inline-block;
  background:var(--gold-500); color:var(--navy-900);
  font-family:var(--font-en); font-weight:800; font-size:11px;
  letter-spacing:.16em;
  padding:5px 14px; border-radius:4px;
  margin-bottom:14px;
}
.beta-modal-title{
  font-family:var(--font-jp);
  font-size:24px; font-weight:800;
  color:var(--ink);
  margin:0;
  letter-spacing:-.01em;
}
.beta-modal-lede{
  text-align:center;
  color:var(--ink-muted);
  font-size:14px;
  line-height:1.7;
  margin:0 0 22px;
}
.beta-modal-list{
  list-style:none; padding:0; margin:0 0 22px;
  display:flex; flex-direction:column; gap:10px;
}
.beta-modal-list li{
  display:flex; gap:12px; align-items:flex-start;
  font-size:13.5px; line-height:1.6;
  color:var(--ink);
  padding:12px 14px;
  border-radius:var(--radius-sm);
}
.beta-modal-list li.ready{
  background:var(--green-050);
  border-left:3px solid var(--green-500);
}
.beta-modal-list li.wip{
  background:#fef3c7;
  border-left:3px solid var(--gold-500);
}
.beta-modal-list li::before{
  flex-shrink:0; font-size:16px; line-height:1.4;
}
.beta-modal-list li.ready::before{ content:"✓"; color:var(--green-600); font-weight:800; }
.beta-modal-list li.wip::before{ content:"🔧"; }
.beta-modal-foot{
  text-align:center;
  font-size:13px;
  color:var(--ink-muted);
  margin:0 0 4px;
  line-height:1.7;
  padding-top:18px;
  border-top:1px dashed var(--hairline);
}
.beta-modal .btn{ width:100%; margin-top:18px; }
@media (max-width:480px){
  .beta-modal{ padding:30px 22px 24px; }
  .beta-modal-title{ font-size:20px; }
}

/* ============== Package bundles (services page) ============== */
.pkg-wrap{
  margin:40px 0 36px;
  background:linear-gradient(180deg, var(--navy-900) 0%, var(--navy-700) 100%);
  border-radius:var(--radius-lg);
  padding:48px 36px 40px;
  position:relative;
  overflow:hidden;
}
.pkg-wrap::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg, transparent, var(--gold-500), transparent);
}
.pkg-head{ text-align:center; margin-bottom:36px; }
.pkg-head .eyebrow-on-dark{
  color:var(--gold-500);
  font-family:var(--font-en);
  font-size:12px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase;
  margin-bottom:10px;
}
.pkg-title{
  font-family:var(--font-jp);
  color:var(--paper);
  font-size:28px; font-weight:800;
  letter-spacing:-.01em;
  margin:0 0 12px;
}
.pkg-sub{
  color:rgba(255,255,255,.78);
  font-size:14.5px; line-height:1.7;
  max-width:680px; margin:0 auto;
}

.pkg-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:20px;
  align-items:stretch;
}
@media (max-width:900px){ .pkg-grid{ grid-template-columns:1fr; } }

.pkg-card{
  background:var(--paper);
  border:1px solid var(--hairline);
  border-radius:var(--radius-lg);
  padding:32px 26px 28px;
  display:flex; flex-direction:column;
  position:relative;
  transition:all var(--ease) .2s;
}
.pkg-card:hover{
  border-color:var(--gold-500);
  box-shadow:var(--shadow-3);
  transform:translateY(-4px);
}
.pkg-card.pkg-featured{
  border:3px solid var(--gold-500);
  padding:36px 26px 30px;
  transform:scale(1.03);
  box-shadow:var(--shadow-3);
}
.pkg-card.pkg-featured:hover{ transform:scale(1.04) translateY(-4px); }
@media (max-width:900px){
  .pkg-card.pkg-featured{ transform:none; }
  .pkg-card.pkg-featured:hover{ transform:translateY(-4px); }
}

.pkg-badge{
  position:absolute;
  top:-14px; left:50%; transform:translateX(-50%);
  background:var(--gold-500);
  color:var(--navy-900);
  font-family:var(--font-en);
  font-size:11px; font-weight:800;
  letter-spacing:.14em;
  padding:7px 18px;
  border-radius:999px;
  box-shadow:0 4px 12px rgba(0,0,0,.15);
  white-space:nowrap;
}
.pkg-tag-soft{
  align-self:flex-start;
  background:var(--navy-050);
  color:var(--navy-700);
  font-size:11px; font-weight:700;
  letter-spacing:.04em;
  padding:4px 10px;
  border-radius:var(--radius-sm);
  margin-bottom:8px;
}
.pkg-save{
  align-self:flex-start;
  background:var(--green-500);
  color:var(--paper);
  font-size:11px; font-weight:800;
  letter-spacing:.04em;
  padding:4px 10px;
  border-radius:var(--radius-sm);
  margin-bottom:8px;
}

.pkg-name{
  font-family:var(--font-jp);
  font-weight:800;
  font-size:18px;
  color:var(--ink);
  margin-bottom:14px;
  letter-spacing:-.01em;
}
.pkg-price{
  display:flex; align-items:baseline; gap:2px;
  font-family:var(--font-en);
  font-variant-numeric:tabular-nums;
  margin-bottom:20px;
  padding-bottom:18px;
  border-bottom:1px solid var(--hairline);
}
.pkg-price .currency{
  font-size:22px; font-weight:600; color:var(--ink-muted);
}
.pkg-price .num{
  font-size:38px; font-weight:800; color:var(--ink);
  letter-spacing:-.02em;
  line-height:1;
}

.pkg-list{
  list-style:none; padding:0; margin:0 0 18px;
  display:flex; flex-direction:column; gap:10px;
}
.pkg-list li{
  display:flex; align-items:flex-start; gap:10px;
  font-size:13.5px; line-height:1.55;
  color:var(--ink);
}
.pkg-list li svg{
  flex-shrink:0;
  width:18px; height:18px;
  color:var(--green-600);
  margin-top:2px;
}

.pkg-desc{
  font-size:12.5px;
  line-height:1.7;
  color:var(--ink-muted);
  margin:0 0 22px;
  padding-top:16px;
  border-top:1px dashed var(--hairline);
}

.pkg-cta{
  margin-top:auto;
  width:100%;
  justify-content:center;
}

@media (max-width:600px){
  .pkg-wrap{ padding:36px 20px 32px; }
  .pkg-title{ font-size:24px; }
  .pkg-card{ padding:26px 22px 24px; }
  .pkg-card.pkg-featured{ padding:30px 22px 26px; }
  .pkg-price .num{ font-size:34px; }
}