/* ============ GPSR Listing Fixer — Integra Scientific (site design language) ============ */
:root{
  --primary:#4B3F72;
  --primary-container:#34285A;
  --gold:#C5A059;
  --gold-hover:#D4B26C;
  --gold-soft:rgba(197,160,89,.10);
  --navy:#F8F9FB;            /* page background (legacy var name kept for JS safety) */
  --navy-mid:#FFFFFF;        /* card surface */
  --navy-soft:#F2F4F6;       /* low surface */
  --amber:var(--gold);
  --amber-soft:var(--gold-soft);
  --blue:#4B3F72;
  --blue-soft:rgba(75,63,114,.10);
  --text:#131B2C;
  --text-dim:#494550;
  --line:#E4E6EB;
  --ok:#2E7D5B;
  --warn:#B08830;
  --bad:#C0392B;
  --radius:2px;
  --font-head:"Manrope",system-ui,sans-serif;
  --font-body:"Inter",system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--navy);
  color:var(--text);
  font-family:var(--font-body);
  font-size:16px;line-height:1.6;
  min-height:100vh;display:flex;flex-direction:column;
}
h1,h2,h3,legend{font-family:var(--font-head);font-weight:500}
a{color:var(--gold)}
.hidden{display:none!important}

/* ---------- topbar (Integra dark bar) ---------- */
.topbar{position:sticky;top:0;z-index:50;background:var(--primary-container);border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 10px 30px rgba(19,27,44,.10)}
.topbar-inner{max-width:1120px;margin:0 auto;padding:15px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff}
.brand-mark{width:28px;height:28px;flex:none}
.brand-text{font-size:1.02rem;letter-spacing:.01em;display:flex;align-items:baseline;white-space:nowrap}
.brand-text .wm-integra{font-family:"Montserrat",sans-serif;font-weight:900;letter-spacing:-.04em;margin-right:4px}
.brand-text .wm-scientific{font-family:var(--font-body);font-weight:300;letter-spacing:-.01em;opacity:.9}
.brand-text .tool-name{color:var(--gold);font-family:var(--font-body);font-weight:700;font-size:.64rem;text-transform:uppercase;letter-spacing:.2em;border-left:1px solid rgba(255,255,255,.25);padding-left:12px;margin-left:12px;white-space:nowrap}
.topbar-tag{font-size:.74rem;color:rgba(255,255,255,.6);white-space:nowrap}
.topbar-tag a{color:var(--gold)!important}

/* ---------- layout ---------- */
#app{flex:1;position:relative;z-index:1;width:100%}
.view{animation:fadeup .35s ease}
@keyframes fadeup{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.view-inner{max-width:1120px;margin:0 auto;padding:36px 20px 64px}
#view-triage,#view-verdict,#view-details,#view-results{max-width:1120px;margin:0 auto;padding:36px 20px 64px}

/* ---------- hero (dark page-header band) ---------- */
#view-intro .hero-band{background:var(--primary-container);color:#fff}
.hero{text-align:left;padding:52px 20px 48px;max-width:1120px;margin:0 auto}
.hero-kicker{display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);margin-bottom:18px}
.hero h1{font-size:clamp(1.8rem,4.4vw,2.9rem);line-height:1.16;font-weight:300;max-width:52rem}
.hero .accent{color:var(--gold);font-style:italic}
.hero-sub{margin:20px 0 0;color:rgba(255,255,255,.7);max-width:44rem;font-weight:300}
.hero-sub strong{color:#fff;font-weight:600}
.hero-actions{display:flex;gap:14px;justify-content:flex-start;flex-wrap:wrap;margin-top:32px}
.hero-privacy{margin-top:20px;font-size:.8rem;color:rgba(255,255,255,.55)}

.feature-wrap{max-width:1120px;margin:0 auto;padding:0 20px 64px}
.feature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
.feature-card{background:var(--navy-mid);border:1px solid var(--line);border-radius:var(--radius);padding:26px;transition:box-shadow .15s,transform .15s}
.feature-card:hover{box-shadow:0 8px 30px rgba(19,27,44,.08);transform:translateY(-2px)}
.feature-num{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius);background:var(--primary-container);color:var(--gold);font-family:var(--font-head);font-weight:700;margin-bottom:14px}
.feature-card h3{font-size:1.02rem;font-weight:600;margin-bottom:6px}
.feature-card p{font-size:.88rem;color:var(--text-dim);font-weight:300}

/* ---------- buttons (Integra: gold, white text, square, uppercase) ---------- */
.btn{font-family:var(--font-body);font-weight:600;font-size:.72rem;text-transform:uppercase;letter-spacing:.15em;border:none;border-radius:var(--radius);padding:13px 24px;cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease,transform .12s ease;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--gold);color:#fff;box-shadow:0 6px 18px rgba(19,27,44,.10)}
.btn-primary:hover{background:var(--gold-hover);transform:none;box-shadow:0 6px 20px rgba(197,160,89,.3)}
.btn-primary:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.btn-ghost{background:transparent;color:var(--text);border:1px solid #D5D8DF}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold);background:transparent}
.hero-actions .btn-ghost{color:#fff;border-color:rgba(255,255,255,.35)}
.hero-actions .btn-ghost:hover{border-color:var(--gold);color:var(--gold)}
.btn-lg{padding:15px 30px;font-size:.78rem}
.btn-link{background:none;border:none;color:var(--gold);cursor:pointer;font-size:.85rem;padding:6px 0;text-decoration:underline;font-family:var(--font-body)}
.btn-copy{background:var(--primary);color:#fff;padding:9px 18px;font-size:.66rem}
.btn-copy:hover{background:var(--primary-container)}
.btn-copy.copied{background:var(--ok)}

/* ---------- wizard ---------- */
.wizard-head{max-width:680px;margin:0 auto 26px}
.progress-track{height:5px;background:#E7EAF0;border-radius:999px;overflow:hidden}
.progress-fill{height:100%;width:0;background:var(--gold);border-radius:999px;transition:width .3s ease}
.wizard-step-label{margin-top:10px;font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--text-dim);text-align:right}
.q-card{max-width:680px;margin:0 auto;background:var(--navy-mid);border:1px solid var(--line);border-radius:var(--radius);padding:32px 30px;box-shadow:0 8px 30px rgba(19,27,44,.06)}
.q-title{font-family:var(--font-head);font-size:1.32rem;font-weight:500;line-height:1.35}
.q-help{margin-top:8px;font-size:.88rem;color:var(--text-dim);font-weight:300}
.q-options{margin-top:22px;display:grid;gap:10px}
.q-opt{display:flex;gap:12px;align-items:flex-start;background:var(--navy);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;cursor:pointer;transition:border-color .12s,background .12s;width:100%;text-align:left;color:var(--text);font-family:var(--font-body);font-size:.95rem}
.q-opt:hover{border-color:var(--gold)}
.q-opt[aria-checked="true"]{border-color:var(--gold);background:var(--gold-soft)}
.q-opt .radio{flex:none;width:18px;height:18px;margin-top:2px;border-radius:50%;border:2px solid #B9BDC7;position:relative}
.q-opt[aria-checked="true"] .radio{border-color:var(--gold)}
.q-opt[aria-checked="true"] .radio::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--gold)}
.q-opt .opt-label{font-weight:500}
.q-opt .opt-sub{display:block;font-size:.82rem;color:var(--text-dim);margin-top:2px;font-weight:300}
.wizard-nav{max-width:680px;margin:24px auto 0;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
#view-details .wizard-nav,#view-results .wizard-nav{max-width:none}

/* ---------- verdict ---------- */
.verdict-card{max-width:680px;margin:0 auto;background:var(--navy-mid);border:1px solid var(--line);border-radius:var(--radius);padding:36px 32px;box-shadow:0 8px 30px rgba(19,27,44,.06)}
.verdict-badge{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-body);font-weight:700;font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;padding:9px 18px;border-radius:var(--radius);margin-bottom:20px}
.verdict-badge.v-applies{background:var(--blue-soft);color:var(--primary);border:1px solid rgba(75,63,114,.35)}
.verdict-badge.v-excluded{background:rgba(46,125,91,.08);color:var(--ok);border:1px solid rgba(46,125,91,.35)}
.verdict-badge.v-edge{background:var(--gold-soft);color:#8a6d33;border:1px solid rgba(197,160,89,.45)}
.verdict-card h2{font-size:1.5rem;line-height:1.3;font-weight:500;margin-bottom:12px}
.verdict-card p{color:var(--text-dim);margin-bottom:10px;font-weight:300}
.verdict-card p strong{color:var(--text);font-weight:600}
.verdict-cites{margin-top:18px;display:flex;flex-wrap:wrap;gap:8px}
.cite-pill{font-family:var(--font-mono);font-size:.75rem;background:var(--navy-soft);border:1px solid var(--line);color:var(--text-dim);padding:5px 10px;border-radius:var(--radius);text-decoration:none}
.cite-pill:hover{border-color:var(--gold);color:#8a6d33}
.verdict-flags{margin-top:16px;display:grid;gap:10px}

/* ---------- callouts ---------- */
.callout{border-radius:var(--radius);padding:14px 16px;font-size:.88rem;line-height:1.55;border:1px solid}
.callout-warn{background:var(--gold-soft);border-color:rgba(197,160,89,.4);color:#6e5626}
.callout-info{background:var(--blue-soft);border-color:rgba(75,63,114,.3);color:var(--primary-container)}
.callout a{color:inherit;text-decoration:underline}

/* ---------- details form ---------- */
.section-title{font-size:1.7rem;font-weight:400;letter-spacing:-.3px;margin-bottom:6px}
.section-sub{color:var(--text-dim);margin-bottom:26px;max-width:640px;font-weight:300}
.req{font-size:.62rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;color:#8a6d33;background:var(--gold-soft);border:1px solid rgba(197,160,89,.35);padding:2px 7px;border-radius:var(--radius);vertical-align:middle}
.hint-inline{font-size:.8rem;color:var(--text-dim);font-weight:400}
.form-group{border:1px solid var(--line);background:var(--navy-mid);border-radius:var(--radius);padding:24px;margin-bottom:18px}
.form-group legend{font-weight:600;font-size:1.05rem;padding:0 10px;margin-left:-10px}
.cite-chip{font-family:var(--font-mono);font-size:.68rem;color:var(--text-dim);background:var(--navy-soft);border:1px solid var(--line);padding:2px 8px;border-radius:var(--radius);margin-left:8px;vertical-align:middle;font-weight:400}
.group-note{font-size:.87rem;color:var(--text-dim);margin:6px 0 16px;max-width:70ch;font-weight:300}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:flex;flex-direction:column;gap:6px}
.field-wide{grid-column:1/-1}
.field label{font-size:.86rem;font-weight:500}
.field input[type=text],.field input[type=email],.field textarea{
  background:#fff;border:1px solid #D5D8DF;border-radius:var(--radius);color:var(--text);
  font-family:var(--font-body);font-size:.93rem;padding:11px 13px;width:100%;
  transition:border-color .12s,box-shadow .12s;
}
.field input::placeholder,.field textarea::placeholder{color:#9aa0ab}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.field input.invalid,.field textarea.invalid{border-color:var(--bad)}
.field-hint{font-size:.8rem;color:var(--text-dim)}
.field-check{grid-column:1/-1;justify-content:center}
.check-label{display:flex;align-items:flex-start;gap:10px;font-size:.9rem;cursor:pointer;color:var(--text)}
.check-label input{accent-color:var(--gold);width:17px;height:17px;margin-top:2px;flex:none}
.rp-toggle{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:16px}

/* ---------- chips ---------- */
.chip-row{display:flex;flex-wrap:wrap;gap:8px}
.chip{background:#fff;border:1px solid #D5D8DF;color:var(--text-dim);border-radius:999px;padding:7px 15px;font-size:.85rem;cursor:pointer;font-family:var(--font-body);transition:all .12s}
.chip:hover{border-color:var(--gold);color:var(--text)}
.chip[aria-pressed="true"]{background:var(--gold-soft);border-color:var(--gold);color:#8a6d33;font-weight:600}
.chip-row-mkt .chip[aria-pressed="true"]{background:var(--blue-soft);border-color:var(--primary);color:var(--primary)}

/* ---------- results ---------- */
.results-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start}
.col-title{font-size:1.05rem;font-weight:600;margin-bottom:14px;color:var(--text)}
.matrix{list-style:none;display:grid;gap:10px}
.matrix li{display:flex;gap:12px;align-items:flex-start;background:var(--navy-mid);border:1px solid var(--line);border-radius:var(--radius);padding:13px 15px;font-size:.89rem}
.matrix .m-icon{flex:none;width:22px;height:22px;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;margin-top:1px}
.matrix .m-req .m-icon{background:var(--gold-soft);color:#8a6d33}
.matrix .m-ok .m-icon{background:rgba(46,125,91,.10);color:var(--ok)}
.matrix .m-na .m-icon{background:var(--navy-soft);color:var(--text-dim)}
.matrix .m-body strong{display:block;font-weight:600}
.matrix .m-body span{color:var(--text-dim);font-size:.83rem;font-weight:300}
.matrix .m-body a{font-family:var(--font-mono);font-size:.73rem;color:var(--primary);text-decoration:none;border-bottom:1px dotted var(--primary)}
.matrix .m-body a:hover{color:#8a6d33;border-color:var(--gold)}

.block-card{background:var(--primary-container);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.block-toolbar{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04)}
.block-label{font-size:.68rem;color:rgba(255,255,255,.7);font-family:var(--font-body);font-weight:600;text-transform:uppercase;letter-spacing:.12em}
.block-card pre{padding:18px;font-family:var(--font-mono);font-size:.78rem;line-height:1.65;white-space:pre-wrap;word-break:break-word;color:#E9EDF5;max-height:480px;overflow:auto}
.micro-note{font-size:.8rem;color:var(--text-dim);margin-top:10px;font-weight:300}

/* ---------- marketplace tabs ---------- */
.mkt-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.mkt-tab{background:var(--navy-mid);border:1px solid #D5D8DF;color:var(--text-dim);border-radius:var(--radius);padding:9px 15px;font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;cursor:pointer;font-family:var(--font-body);transition:all .12s}
.mkt-tab:hover{color:var(--text);border-color:var(--gold)}
.mkt-tab[aria-selected="true"]{background:var(--gold);color:#fff;border-color:var(--gold)}
.mkt-panel{background:var(--navy-mid);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.mkt-panel h4{font-family:var(--font-head);font-size:1.05rem;font-weight:600;margin-bottom:4px}
.mkt-panel .mkt-enf{font-size:.78rem;color:#8a6d33;margin-bottom:14px}
.mkt-steps{list-style:none;counter-reset:step;display:grid;gap:12px;margin-bottom:14px}
.mkt-steps li{counter-increment:step;display:flex;gap:12px;font-size:.87rem;color:var(--text-dim)}
.mkt-steps li::before{content:counter(step);flex:none;width:22px;height:22px;border-radius:50%;background:var(--primary-container);color:var(--gold);font-size:.72rem;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:1px;font-family:var(--font-head)}
.mkt-steps li strong{color:var(--text)}
.mkt-src{font-size:.78rem;color:var(--text-dim);border-top:1px solid var(--line);padding-top:12px}
.mkt-src a{color:var(--primary)}

/* ---------- CTA band (dark, like site sections) ---------- */
.cta-band{margin-top:44px;background:var(--primary-container);color:#fff;border:0;border-radius:var(--radius);padding:34px 32px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.cta-band h3{font-size:1.3rem;font-weight:400;margin-bottom:6px}
.cta-band p{font-size:.88rem;color:rgba(255,255,255,.65);max-width:60ch;font-weight:300}

/* ---------- footer (Integra dark band) ---------- */
.site-footer{position:relative;z-index:1;background:var(--primary-container);border-top:1px solid rgba(255,255,255,.05);padding:34px 20px 40px;text-align:center}
.disclaimer{max-width:760px;margin:0 auto 14px;font-size:.74rem;color:rgba(255,255,255,.4);line-height:1.6}
.disclaimer a{color:var(--gold)}
.footer-brand{font-size:.83rem;color:rgba(255,255,255,.6);font-weight:300}
.footer-brand strong{color:#fff;font-weight:600}
.footer-brand a{color:var(--gold);text-decoration:none}
.footer-brand a:hover{text-decoration:underline}

/* ---------- toast ---------- */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--primary-container);color:#fff;font-family:var(--font-body);font-weight:500;font-size:.9rem;padding:12px 24px;border-radius:var(--radius);opacity:0;pointer-events:none;transition:all .25s ease;z-index:100;box-shadow:0 16px 40px rgba(19,27,44,.3)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .results-grid{grid-template-columns:1fr}
  .feature-row{grid-template-columns:1fr}
}
@media(max-width:620px){
  .form-grid{grid-template-columns:1fr}
  .topbar-tag{display:none}
  .cta-band{flex-direction:column;align-items:flex-start}
  .q-card{padding:22px 18px}
  .verdict-card{padding:24px 20px}
  .hero{padding:36px 16px 36px}
  .wizard-nav .btn{flex:1;justify-content:center}
  .brand-text .tool-name{display:none}
}

/* ---------- i18n (EN / zh-CN) ---------- */
.lang-zh .i18n-en{display:none!important}
html:not(.lang-zh) .i18n-zh{display:none!important}
.lang-toggle{
  background:transparent;color:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.3);
  border-radius:0;padding:7px 12px;font-size:.66rem;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;cursor:pointer;white-space:nowrap;
  font-family:inherit;transition:color .15s ease,border-color .15s ease;
}
.lang-toggle:hover{color:#C5A059;border-color:#C5A059;background:transparent}


/* ============ v2: homepage primary navbar + secondary tool bar ============ */
.site-header { position: sticky; top: 0; z-index: 50; background: transparent; border: 0; box-shadow: none; }

.pnav { background: var(--primary-container); box-shadow: 0 10px 30px rgba(19,27,44,.10); }
.pnav-inner {
  padding: 0 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  height: 80px;
}
@media (min-width: 1024px) { .pnav-inner { padding: 0 48px; } }
.pnav-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; color: #fff; flex: 0 0 auto; }
.pnav-logo { height: 34px; width: auto; display: block; }
.wordmark { display: flex; align-items: baseline; white-space: nowrap; color: #fff; }
.wordmark .wm-integra { font-family: "Montserrat", sans-serif; font-weight: 900; font-size: 1.4rem; letter-spacing: -0.05em; margin-right: 5px; }
.wordmark .wm-scientific { font-family: "Inter", sans-serif; font-weight: 300; font-size: 1.4rem; letter-spacing: -0.02em; opacity: .9; }

.pnav-links { display: none; align-items: center; gap: 28px; }
@media (min-width: 1280px) { .pnav-links { display: flex; } }
.pnav-links a {
  position: relative; color: rgba(255,255,255,.8); text-decoration: none;
  font-family: var(--font-body); font-size: .72rem; font-weight: 500;
  text-transform: uppercase; letter-spacing: .18em; padding-bottom: 4px;
  white-space: nowrap; transition: color .3s;
}
.pnav-links a::after {
  content: ""; position: absolute; left: 0; bottom: 0; height: 1px; width: 0;
  background: var(--gold); transition: width .3s;
}
.pnav-links a:hover { color: #fff; }
.pnav-links a:hover::after, .pnav-links a.active::after { width: 100%; }
.pnav-links a.active { color: var(--gold); }
.pnav-qr { font-size: 15px; vertical-align: middle; margin-right: 6px; color: var(--gold); }
.material-symbols-outlined { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }

.pnav-actions { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.portal-btn {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--gold); color: #fff; text-decoration: none;
  height: 44px; padding: 0 24px; border-radius: 0;
  font-family: var(--font-body); font-size: .72rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .18em; white-space: nowrap;
  box-shadow: 0 6px 18px rgba(0,0,0,.10); transition: background .2s, transform .12s;
}
.portal-btn:hover { background: var(--gold-hover); }
.portal-btn:active { transform: scale(.97); }
.pnav .portal-btn { display: none; }
@media (min-width: 1280px) { .pnav .portal-btn { display: inline-flex; } }

/* lang toggle: same height as Client Portal button */
.lang-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  height: 44px; padding: 0 16px; border-radius: 0;
  background: transparent; color: rgba(255,255,255,.8);
  border: 1px solid rgba(255,255,255,.3);
  font-size: .72rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase;
  cursor: pointer; white-space: nowrap; font-family: var(--font-body);
  transition: color .15s, border-color .15s;
}
.lang-toggle:hover { color: var(--gold); border-color: var(--gold); background: transparent; }

.nav-burger {
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  gap: 5px; width: 44px; height: 44px; background: transparent; border: 0; cursor: pointer;
}
@media (min-width: 1280px) { .nav-burger { display: none; } }
.nav-burger span { display: block; width: 24px; height: 2px; background: #fff; transition: transform .3s, opacity .3s; }
.nav-burger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-burger.open span:nth-child(2) { opacity: 0; }
.nav-burger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.pnav-drawer {
  display: none; flex-direction: column; background: var(--primary-container);
  border-top: 1px solid rgba(255,255,255,.1); padding: 8px 24px 20px;
}
.pnav-drawer.open { display: flex; }
@media (min-width: 1280px) { .pnav-drawer.open { display: none; } }
.pnav-drawer a {
  color: rgba(255,255,255,.75); text-decoration: none; padding: 14px 0;
  font-size: .72rem; font-weight: 500; text-transform: uppercase; letter-spacing: .18em;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.pnav-drawer a:hover { color: #fff; }
.pnav-drawer a.active { color: var(--gold); }
.pnav-drawer .drawer-portal { border: 0; margin-top: 14px; height: 44px; display: inline-flex; align-items: center; justify-content: center; background: var(--gold); color: #fff; }

/* ---------- secondary tool bar ---------- */
.toolbar { background: var(--primary); border-bottom: 1px solid rgba(255,255,255,.08); }
.toolbar-inner {
  max-width: 1120px; margin: 0 auto; padding: 0 20px;
  display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
  min-height: 54px;
}
.tool-id { display: flex; align-items: center; gap: 12px; padding: 10px 0; text-decoration: none; }
.tool-title {
  color: #fff; font-family: var(--font-head); font-weight: 600; font-size: .95rem;
  letter-spacing: .01em; white-space: nowrap;
}
.tool-desc {
  color: rgba(255,255,255,.55); font-size: .74rem; font-weight: 300;
  border-left: 1px solid rgba(255,255,255,.25); padding-left: 12px; white-space: nowrap;
  display: none;
}
@media (min-width: 760px) { .tool-desc { display: inline; } }

.toolbar .tools-back {
  display: inline-flex; align-items: center; margin-left: auto;
  color: rgba(255,255,255,.75); font-size: .66rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .15em; text-decoration: none;
  border: 1px solid rgba(255,255,255,.3); border-radius: 0;
  height: 32px; padding: 0 14px; white-space: nowrap;
  transition: color .15s, border-color .15s;
}
.toolbar .tools-back:hover { color: var(--gold); border-color: var(--gold); background: transparent; }

/* footer wordmark (header style, smaller) */
.wm-footer { display: inline-flex; vertical-align: baseline; }
.wm-footer .wm-integra { font-size: .95rem; margin-right: 3px; color: #fff; }
.wm-footer .wm-scientific { font-size: .95rem; color: #fff; }

@media (max-width: 480px) {
  .pnav-inner { padding: 0 16px; height: 68px; }
  .pnav-logo { height: 26px; }
  .wordmark .wm-integra, .wordmark .wm-scientific { font-size: 1.05rem; }
  .lang-toggle { height: 38px; padding: 0 10px; }
  .nav-burger { height: 38px; width: 38px; }
  .tool-desc { display: none; }
}

/* clamp horizontal overflow */
html, body { overflow-x: hidden; }


/* ============ v3: toolbar responsive fix ============ */
@media (max-width: 1100px) {
  .toolbar-inner { flex-wrap: wrap; padding-top: 6px; padding-bottom: 10px; }
  .toolbar .tool-id { order: 1; padding: 8px 0; }
  .toolbar .tools-back { order: 2; margin-left: auto; align-self: center; }
}


/* ============ v5: lang toggle == Client Portal height at every breakpoint (mirror homepage) ============ */
.pnav-actions { align-items: stretch; }
.portal-btn {
  height: auto;
  padding: 10px 20px;            /* = homepage py-2.5 px-5 */
  font-size: 10px;               /* = text-[10px] */
}
@media (min-width: 1350px) { .portal-btn { padding: 12px 24px; font-size: 12px; } }   /* py-3 px-6 text-xs */
@media (min-width: 1536px) { .portal-btn { padding: 14px 32px; font-size: 14px; } }   /* py-3.5 px-8 text-sm */
.lang-toggle {
  height: auto; align-self: stretch;
  padding: 10px 16px; font-size: 10px;
}
@media (min-width: 1350px) { .lang-toggle { padding: 12px 16px; font-size: 12px; } }
@media (min-width: 1536px) { .lang-toggle { padding: 14px 20px; font-size: 14px; } }
/* below 1280px the portal button is hidden: toggle pairs with the burger instead */
@media (max-width: 1279.98px) { .lang-toggle { align-self: center; height: 44px; padding: 0 14px; } }
@media (max-width: 480px)     { .lang-toggle { height: 38px; padding: 0 10px; } }
.nav-burger { align-self: center; }


/* ============ v6: shared chrome integration ============ */
.toolbar {
  position: fixed; left: 0; right: 0; top: var(--ic-nav-h); z-index: 45;
}
#app { padding-top: calc(var(--ic-nav-h) + var(--ic-toolbar-h, 54px)); }
.tool-disclaimer { background: var(--primary); border-top: 1px solid rgba(255,255,255,.08); padding: 18px 20px 20px; }
.tool-disclaimer p { color: rgba(255,255,255,.55); font-size: .74rem; line-height: 1.6; max-width: 760px; margin: 0 auto; font-weight: 300; text-align: center; }
.tool-disclaimer a { color: var(--gold); }