:root{color-scheme:light;--navy:#0c2b46;--navy-deep:#071d33;--blue:#1a496c;--accent:#e4ad63;--text:#193349;--muted:#60778b;--line:#e2e9ee;--surface:#fff;--bg:#f6f8fb;--radius:17px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;background:var(--bg);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--text);line-height:1.55}a{color:inherit;text-decoration:none}button,input{font:inherit}.container{width:min(1120px,calc(100% - 48px));margin:0 auto}.header{height:78px;background:var(--navy-deep);border-bottom:1px solid rgba(255,255,255,.1)}.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:13px;color:#fff}.brand-mark{display:grid;place-items:center;width:43px;height:43px;border:2px solid var(--accent);font-family:Georgia,serif;font-size:30px;font-weight:700;letter-spacing:-3px;color:var(--accent);border-radius:9px}.brand-title{display:flex;flex-direction:column;line-height:1.15;gap:6px}.brand-title strong{font-size:15px;letter-spacing:1.15px}.brand-title small{font-size:9px;letter-spacing:2.1px;color:#b7c6d4}.header-link{color:#d8e4ed;font-size:13px;display:flex;gap:9px;align-items:center}.header-link:hover{color:#fff}.header-link span{font-size:20px}.hero{position:relative;min-height:336px;overflow:hidden;background:linear-gradient(110deg,#0b2945 3%,#124367 73%,#1e5677);color:#fff}.hero-content{position:relative;z-index:1;padding:55px 0 92px}.eyebrow{display:flex;align-items:center;gap:10px;font-size:10px;font-weight:700;letter-spacing:2.5px;color:#e7ba78}.eyebrow-dot{width:7px;height:7px;border-radius:50%;background:var(--accent)}.hero h1{margin:18px 0 16px;font-size:clamp(34px,4.1vw,55px);line-height:1.16;letter-spacing:-1.5px;font-weight:700}.hero h1 em{font-style:normal;color:#f0be7b}.hero p{margin:0;max-width:515px;color:#d2e1ec;font-size:15px;line-height:1.8}.hero-art{position:absolute;inset:0;pointer-events:none;overflow:hidden}.hero-art span{position:absolute;right:-120px;top:5%;height:430px;width:580px;border-radius:50%;border:1px solid rgba(255,255,255,.095);transform:rotate(-22deg)}.hero-art span:nth-child(2){right:-40px;top:20%;width:470px;height:350px}.hero-art span:nth-child(3){right:40px;top:34%;width:350px;height:260px}.content{position:relative;margin-top:-52px;margin-bottom:65px}.primary-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.52fr) minmax(290px,1fr);gap:22px;align-items:stretch}.search-card,.side-card,.result-panel{border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 13px 35px rgba(8,35,58,.055)}.search-card{background:#fff;padding:32px 34px}.card-heading{display:flex;align-items:center;gap:17px;margin-bottom:28px}.icon-circle{background:#eaf2f7;border-radius:14px;display:grid;place-items:center;width:51px;height:51px;color:var(--blue);flex:none}.card-heading h2{font-size:22px;margin:0 0 4px;letter-spacing:-.6px;line-height:1.3}.card-heading p{color:var(--muted);font-size:13px;margin:0}.tracking-form{display:flex;flex-direction:column}.search-types{border:0;padding:0;margin:0 0 21px;display:flex;flex-wrap:wrap;gap:10px}.search-types legend,.field-label{display:block;width:100%;font-weight:700;font-size:12px;color:#3b5367;margin:0 0 10px}.radio-card{position:relative;flex:1;cursor:pointer;min-width:125px}.radio-card input{position:absolute;width:1px;height:1px;opacity:0}.radio-card span{display:block;text-align:center;padding:11px 15px;font-size:13px;border:1px solid #d8e3eb;border-radius:9px;font-weight:600;color:#60778b;transition:all .17s}.radio-card input:checked+span{color:#144363;background:#eff6fa;border-color:#6992b0;box-shadow:inset 0 0 0 1px #6992b0}.radio-card input:focus-visible+span{outline:3px solid #f3bc75;outline-offset:2px}.required{color:#e48c43}.text-input{background:#fbfdff;border:1px solid #cad9e5;border-radius:9px;padding:14px 15px;width:100%;outline:0;font-size:14px;transition:border-color .17s,box-shadow .17s}.text-input:focus{border-color:#2f698e;box-shadow:0 0 0 3px rgba(47,105,142,.13)}.text-input::placeholder{color:#99a8b4}.input-hint{font-size:11px;color:#8292a0;margin:8px 0 21px}.search-button{width:100%;border:0;border-radius:9px;display:flex;align-items:center;justify-content:center;gap:12px;min-height:51px;cursor:pointer;color:#fff;font-size:14px;font-weight:700;background:#153f5f;transition:background .15s,transform .15s}.search-button span{margin-left:2px;font-size:20px;font-weight:400}.search-button:hover{background:#0b2c48;transform:translateY(-1px)}.search-button:disabled{background:#98a8b4;cursor:not-allowed;transform:none}.form-alert{border:1px solid #f1b7b5;background:#fff2f2;border-radius:8px;padding:12px;color:#a02d2d;font-size:13px;margin:16px 0 0}.side-card{background:linear-gradient(155deg,#f5f9fc,#eef5f9);padding:32px 31px}.side-icon{width:59px;height:59px;display:grid;place-items:center;border-radius:15px;background:#dcebf4;color:#1c4f72;margin-bottom:20px}.side-card h2{margin:0 0 12px;font-size:23px;line-height:1.3;letter-spacing:-.5px}.side-card>p{font-size:13px;color:#5f7485;line-height:1.8;margin:0}.side-divider{height:1px;background:#dbe6ed;margin:23px 0}.tip{display:flex;align-items:flex-start;gap:13px;margin:17px 0}.tip-num{font-size:11px;font-weight:800;color:#6690aa;letter-spacing:1px;min-width:25px}.tip div{display:flex;flex-direction:column;gap:4px}.tip strong{font-size:12px}.tip small{font-size:11px;color:#788b9a}.notice{position:relative;z-index:2;padding:14px 17px;border-radius:10px;border:1px solid;margin-bottom:18px;font-size:13px}.notice-demo{background:#fff5dd;color:#7e5215;border-color:#ebcc8d}.notice-setup{background:#fff0e8;border-color:#eec5a1;color:#7c482d}.results{margin-top:42px}.results-heading{display:flex;justify-content:space-between;gap:12px;align-items:end;margin-bottom:18px}.section-kicker{font-weight:800;letter-spacing:2px;font-size:10px;color:#8e9eaa}.results-heading h2{font-size:25px;margin:2px 0 0;letter-spacing:-.7px}.new-search{color:#1b5579;font-size:13px;font-weight:700}.new-search:hover{text-decoration:underline}.result-panel{background:#fff;margin-bottom:18px;overflow:hidden}.result-top{padding:26px 32px;display:grid;grid-template-columns:minmax(0,1fr) minmax(225px,.75fr);gap:15px;align-items:center;border-bottom:1px solid var(--line)}.detail-caption{font-size:10px;letter-spacing:1.5px;color:#7c8e9e;font-weight:800}.result-top h3{overflow-wrap:anywhere;font-size:26px;letter-spacing:-.6px;line-height:1.25;margin:9px 0 8px}.hbl-line{font-size:12px;color:#708594;overflow-wrap:anywhere}.hbl-line strong{color:#31485a;font-weight:700}.status-box{border:1px solid #d4e5e6;background:#eef8f6;padding:18px 19px;border-radius:12px;display:flex;flex-direction:column;align-items:flex-start}.status-box .detail-caption{color:#5c8990}.status-box strong{font-size:18px;color:#1b655d;margin:6px 0;overflow-wrap:anywhere}.status-box small{font-size:11px;color:#568079;line-height:1.6}.result-body{padding:27px 32px 28px}.result-body h4{font-size:14px;margin:0 0 14px;color:#1d3c55}.result-body h4:not(:first-child){margin-top:29px}.details-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0}.details-grid div{border:1px solid #e6edf2;background:#fcfdfe;border-radius:9px;padding:15px 17px;min-width:0}.details-grid dt{color:#7e91a0;font-size:11px;font-weight:600;margin-bottom:8px}.details-grid dd{margin:0;font-size:13px;color:#183b54;font-weight:700;overflow-wrap:anywhere}.footnote{margin:20px 0 0;padding-top:14px;border-top:1px dashed #dce5eb;font-size:11px;line-height:1.8;color:#8595a2}.empty-result{text-align:center;margin-top:30px;padding:38px 24px}.empty-icon{border-radius:50%;width:48px;height:48px;background:#eef4f8;display:grid;place-items:center;margin:0 auto 12px;color:#7a9bb1;font-size:24px}.empty-result h2{font-size:20px;margin:4px 0}.empty-result p{font-size:13px;color:#728697;margin:0 auto;max-width:520px}.bottom-help{border-top:1px solid #dce5eb;margin-top:38px;padding-top:25px;display:flex;align-items:center;justify-content:space-between;gap:16px}.bottom-help strong{font-size:14px}.bottom-help p{font-size:12px;color:#8392a0;margin:4px 0 0}.help-link{white-space:nowrap;border:1px solid #becfda;border-radius:8px;padding:10px 16px;font-size:12px;color:#194462;font-weight:700}.help-muted{font-size:12px;color:#80909c}.footer{background:var(--navy-deep);padding:24px 0;color:#a6b9c7}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:11px}.footer-inner span:last-child{text-align:right}
@media(max-width:850px){.hero{min-height:310px}.primary-grid{grid-template-columns:1fr}.side-card{display:none}.content{margin-top:-45px}.search-card{max-width:100%}.result-top{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.container{width:min(100% - 30px,1120px)}.header{height:70px}.brand-title strong{font-size:12px}.brand-title small{font-size:8px;letter-spacing:1px}.brand-mark{width:37px;height:37px;font-size:26px}.header-link{font-size:11px}.hero-content{padding:45px 0 80px}.hero h1{font-size:36px;letter-spacing:-1px}.hero p{font-size:13px}.content{margin-top:-36px;margin-bottom:35px}.search-card{padding:24px 20px}.card-heading h2{font-size:20px}.card-heading{gap:12px;margin-bottom:23px}.icon-circle{height:43px;width:43px}.radio-card span{padding:11px 10px}.results{margin-top:30px}.result-top{grid-template-columns:1fr;padding:24px 20px}.result-body{padding:24px 20px}.details-grid{grid-template-columns:1fr}.bottom-help{flex-direction:column;align-items:flex-start}.footer-inner{flex-direction:column;align-items:flex-start}.footer-inner span:last-child{text-align:left}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}


/* ============================================================
   v2 UI update: two-line company header + full-width tracking.
   Hero background is retained; tracking card moves up over it.
   ============================================================ */
.header {
  height: auto;
  min-height: 78px;
}
.header-inner {
  min-height: 78px;
  padding-top: 12px;
  padding-bottom: 12px;
  justify-content: flex-start;
}
.brand {
  max-width: 100%;
}
.brand-title {
  min-width: 0;
  gap: 6px;
}
.brand-title strong {
  display: block;
  font-size: 15px;
  letter-spacing: 1.15px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.hero {
  min-height: 190px;
}
.content {
  margin-top: -150px;
}
.primary-grid {
  grid-template-columns: minmax(0, 1fr);
}
.search-card {
  width: 100%;
}
@media (max-width: 850px) {
  .hero { min-height: 170px; }
  .content { margin-top: -130px; }
}
@media (max-width: 620px) {
  .header { min-height: 78px; }
  .header-inner { min-height: 78px; }
  .brand-title strong {
    font-size: clamp(10px, 2.8vw, 12px);
    letter-spacing: 0.15px;
  }
  .hero { min-height: 146px; }
  .content { margin-top: -112px; }
}


/* ============================================================
   v3 UI update: taller transparent gradient header, elegant font,
   fixed bottom footer. Keeps existing v2 tracking content/layout.
   ============================================================ */
:root {
  --tracking-header-height: 156px; /* Double the original 78px. */
  --tracking-hero-height: 190px;
}

/* One continuous gradient sits behind BOTH header and hero. */
body {
  position: relative;
  padding-bottom: 96px; /* Prevent the fixed footer covering content. */
}
body::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0 0 auto;
  height: calc(var(--tracking-header-height) + var(--tracking-hero-height));
  background: linear-gradient(110deg, #0b2945 3%, #124367 73%, #1e5677);
  pointer-events: none;
}
.header, main {
  position: relative;
  z-index: 1;
}
.header {
  height: var(--tracking-header-height);
  min-height: var(--tracking-header-height);
  background: transparent;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.header-inner {
  height: 100%;
  min-height: var(--tracking-header-height);
  padding-top: 20px;
  padding-bottom: 20px;
  align-items: center;
}
.brand-title {
  gap: 10px;
}
.brand-title strong {
  font-family: "Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;
  font-size: clamp(12px, 1.8vw, 23px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: .8px;
  color: #faf6eb;
  text-shadow: 0 2px 12px rgba(0, 15, 33, .19);
}
.hero {
  height: var(--tracking-hero-height);
  min-height: var(--tracking-hero-height);
  background: transparent;
}
/* Footer is always anchored to the visible bottom of the browser. */
.footer {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 30;
  padding: 16px 0;
  padding-bottom: max(16px, env(safe-area-inset-bottom));
  background: var(--navy-deep);
  border-top: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 -5px 25px rgba(8,26,42,.08);
}
.footer-inner {
  min-height: 32px;
}
@media (max-width: 850px) {
  :root { --tracking-hero-height: 170px; }
  .hero {
    height: var(--tracking-hero-height);
    min-height: var(--tracking-hero-height);
  }
}
@media (max-width: 620px) {
  :root { --tracking-hero-height: 146px; }
  body { padding-bottom: 122px; }
  .header {
    height: var(--tracking-header-height);
    min-height: var(--tracking-header-height);
  }
  .header-inner {
    min-height: var(--tracking-header-height);
    padding-top: 18px;
    padding-bottom: 18px;
  }
  .brand-title { gap: 7px; }
  .brand-title strong {
    font-size: clamp(10px, 3.05vw, 15px);
    letter-spacing: .12px;
    line-height: 1.35;
  }
  .hero {
    height: var(--tracking-hero-height);
    min-height: var(--tracking-hero-height);
  }
  .footer { padding: 15px 0; padding-bottom: max(15px,env(safe-area-inset-bottom)); }
  .footer-inner { gap: 5px; line-height: 1.5; }
}
