/*
 * Trust Centre (/trust/) - loaded alongside style.css on that page only.
 *
 * Hand-written in the same spirit as track.css and the tz-trust block: semantic
 * markup, BEM-ish .tzt__* classes, tokens scoped to the .tzt root. The token
 * values are lifted from the home page's .elementor-kit-7 palette so this page
 * reads as a standard Traizr page without pulling in Elementor's hash-ID CSS.
 *
 * NOTE: --tzt-primary is #1C6BA6, not #2582C5. style.css declares
 * .elementor-kit-7 twice and the later block overrides primary. The inline SVG
 * icons still hard-code stroke #2582C5, so icon blue and button blue genuinely
 * differ on this site; --tzt-icon keeps that intentional.
 */

.tzt{
  --tzt-primary:#1C6BA6;
  --tzt-primary-border:#0B6BB1;
  --tzt-secondary:#70B2E2;
  --tzt-secondary-border:#5FA4D6;
  --tzt-btn-ink:#0D2B45;   /* dark label on the light-blue secondary button, as on the home page */
  --tzt-icon:#2582C5;
  --tzt-navy:#185B8D;
  --tzt-text:#40596B;
  --tzt-muted:#616F7D;
  --tzt-border:#AED4F0;
  --tzt-wash:#F0F5FF;
  --tzt-tint:#DCEEFA;
  --tzt-radius:50px;
  --tzt-radius-sm:18px;
  --tzt-shadow:0 0 10px 0 rgba(0,0,0,.1);
  --tzt-shadow-soft:0 0 10px 0 rgba(0,0,0,.05);
  font-family:"Inter Tight","Inter",system-ui,sans-serif;
  color:var(--tzt-text);
}
.tzt *,.tzt *::before,.tzt *::after{box-sizing:border-box}
@media(max-width:767px){.tzt{--tzt-radius:25px}}

.tzt__wrap{max-width:1140px;margin:0 auto;padding:0 20px}

/* ---------- Sections ---------- */
/* position/overflow are required by the absolutely-positioned wave dividers */
.tzt__section{position:relative;overflow:hidden;padding:66px 0;background:#fff}
.tzt__section--wash{background:var(--tzt-wash)}
.tzt__section--navy{background:var(--tzt-navy);color:#DCEEFA}
/* dark bands carry a wave top and bottom, so they need room to breathe */
.tzt__section--navy{padding:104px 0}
@media(max-width:767px){
  .tzt__section{padding:44px 0}
  .tzt__section--navy{padding:80px 0}
}

.tzt__head{text-align:center;max-width:760px;margin:0 auto 38px}
.tzt__head--left{text-align:left;margin-left:0}
.tzt__eyebrow{display:inline-block;font-family:"Inter",sans-serif;font-size:13px;font-weight:500;
  letter-spacing:.04em;text-transform:uppercase;color:var(--tzt-primary);background:#FBFCFF;
  border:.5px solid var(--tzt-primary);border-radius:50px;padding:8px 22px;margin:0 0 18px;
  box-shadow:var(--tzt-shadow-soft)}
.tzt__section h2{font-family:"Inter",sans-serif;font-size:42px;font-weight:700;line-height:1.2;
  color:var(--tzt-navy);margin:0 0 14px}
.tzt__section h3{font-family:"Inter",sans-serif;font-size:19px;font-weight:600;color:var(--tzt-navy);margin:0 0 8px}
.tzt__lede{font-size:18px;line-height:1.65;color:var(--tzt-muted);margin:0}
.tzt__prose{font-size:16px;line-height:1.75;color:var(--tzt-text);max-width:820px}
.tzt__prose p{margin:0 0 14px}
.tzt__prose a{color:var(--tzt-primary);text-decoration:underline}
.tzt__prose a:hover{text-decoration:none}

@media(max-width:767px){
  .tzt__section h2{font-size:30px}
  .tzt__eyebrow{font-size:12px;padding:10px 22px}
  .tzt__lede{font-size:16px}
}

/* Dark-band overrides */
.tzt__section--navy h2{color:#fff}
.tzt__section--navy h3{color:#fff}
.tzt__section--navy .tzt__lede{color:#C9DCEC}
.tzt__section--navy .tzt__eyebrow{color:#fff;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.45);
  box-shadow:none}

/* ---------- Wave dividers ---------- */
/*
 * style.css supplies .elementor-shape positioning but sets NO height and
 * defaults .elementor-shape-fill to #fff. Both must be set per divider here,
 * and each fill MUST match the background of the ADJACENT section or the wave
 * renders as a white seam.
 *
 * Only two markup combinations are used, both lifted verbatim from index.php,
 * because they are the ones that dodge style.css's rotate/z-index:-1 rules:
 *   top    + mountains + data-negative="false"
 *   bottom + curve     + data-negative="true"
 */
.tzt__section > .elementor-shape svg{height:50px}
@media(max-width:767px){.tzt__section > .elementor-shape svg{height:30px}}

/* Compliance band: wash above, white below */
.tzt__section--compliance > .elementor-shape-top .elementor-shape-fill{fill:#F0F5FF}
.tzt__section--compliance > .elementor-shape-bottom .elementor-shape-fill{fill:#FFFFFF}
/* CTA band: white above */
.tzt__section--cta > .elementor-shape-top .elementor-shape-fill{fill:#FFFFFF}

/* ---------- Breadcrumb ---------- */
/* The site has no breadcrumb component (schema only), so this is a new pattern.
   Sits below the floating header, hence the top padding. */
.tzt__crumbs{padding:118px 0 0;font-size:14px}
@media(max-width:767px){.tzt__crumbs{padding-top:100px}}
.tzt__crumbs ol{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;padding:0}
.tzt__crumbs li{display:flex;align-items:center;gap:8px;color:var(--tzt-muted)}
.tzt__crumbs li+li::before{content:"/";color:var(--tzt-border);font-weight:400}
.tzt__crumbs a{color:var(--tzt-muted);text-decoration:none}
.tzt__crumbs a:hover{color:var(--tzt-primary);text-decoration:underline}
.tzt__crumbs [aria-current="page"]{color:var(--tzt-navy);font-weight:600}

/* ---------- Hero ---------- */
/* Gradient + dotted world-map overlay at 3% - the home page's hero signature. */
.tzt__hero{position:relative;overflow:hidden;background:linear-gradient(12deg,#F0F5FF 55%,#DCE9FD 71%);
  padding:26px 0 92px}
.tzt__hero::before{content:"";position:absolute;inset:0;background-image:url(/assets/images/2026/04/dotted-word-map.webp);
  background-position:center center;background-repeat:no-repeat;background-size:contain;opacity:.03;pointer-events:none}
.tzt__hero .tzt__wrap{position:relative;z-index:1}
.tzt__hero h1{font-family:"Inter",sans-serif;font-size:clamp(34px,2.7vw,50px);font-weight:600;line-height:1.15;
  color:var(--tzt-navy);margin:0 0 18px;max-width:16ch}
.tzt__hero p{font-size:18px;line-height:1.65;color:var(--tzt-muted);max-width:620px;margin:0 0 28px}
.tzt__hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 26px}
.tzt__reviewed{display:inline-flex;align-items:center;gap:9px;font-size:14px;color:var(--tzt-muted);margin:0}
.tzt__reviewed::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--tzt-primary);flex:0 0 auto}
@media(max-width:767px){
  .tzt__hero{padding:18px 0 64px}
  .tzt__hero p{font-size:16px}
}

/* ---------- Buttons ---------- */
/*
 * Buttons are anchors, and style.css sets `.elementor-kit-7 a{color:var(--e-global-color-secondary)}`
 * (specificity 0,1,1). elementor-kit-7 has to stay on <body> for the design tokens, so a bare
 * `.tzt__btn--secondary{color:#fff}` (0,1,0) LOSES and the label renders #70B2E2 on a #70B2E2
 * button - invisible. Qualifying with `.tzt a` (0,2,1) wins. Do not simplify these selectors.
 */
.tzt__btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:"Inter",sans-serif;font-size:16px;font-weight:600;text-decoration:none;
  border-radius:50px;padding:12px 26px;min-height:40px;cursor:pointer;
  box-shadow:var(--tzt-shadow);transition:transform .3s}
.tzt__btn:hover{transform:scale(1.06)}
/* Cover BOTH <a> and <button>. `.tzt .tzt__btn--x` (0,2,0) beats the theme's
   button reset `button{color:#CC3366}` / `button:hover{background:#CC3366}` (0,1,1)
   AND `.elementor-kit-7 a{color:secondary}` (0,1,1). Without this, bare <button>
   triggers render in the theme's magenta. :focus is covered too — a <dialog>
   focuses its first button on open, which would otherwise flip it magenta. */
.tzt .tzt__btn--primary{background:var(--tzt-primary);color:#fff;border:2px solid var(--tzt-primary-border)}
.tzt .tzt__btn--primary:hover,.tzt .tzt__btn--primary:focus{background:var(--tzt-primary);color:#fff}
/* Dark ink on the light-blue secondary, matching the home page's own secondary button
   ("See how it works" renders #0D2B45 on #70B2E2). White here would be 2.29:1; this is 6.32:1. */
.tzt .tzt__btn--secondary{background:var(--tzt-secondary);color:var(--tzt-btn-ink);border:2px solid var(--tzt-secondary-border)}
.tzt .tzt__btn--secondary:hover,.tzt .tzt__btn--secondary:focus{background:var(--tzt-secondary);color:var(--tzt-btn-ink)}
.tzt .tzt__btn--ghost{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.6);box-shadow:none}
.tzt .tzt__btn--ghost:hover,.tzt .tzt__btn--ghost:focus{border-color:#fff;color:#fff;background:transparent}
.tzt__btn svg{width:15px;height:15px;flex:0 0 auto}

/* ---------- Card grids ---------- */
.tzt__grid{display:grid;gap:20px;margin:0}
.tzt__grid--2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.tzt__grid--3{grid-template-columns:repeat(auto-fit,minmax(268px,1fr))}
.tzt__grid--4{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}

.tzt__card{background:#fff;border:.5px solid var(--tzt-border);border-radius:var(--tzt-radius);
  box-shadow:var(--tzt-shadow);padding:34px 32px}
.tzt__card p{margin:0;font-size:15px;line-height:1.65;color:var(--tzt-muted)}
.tzt__card-icon{display:block;width:40px;height:40px;margin:0 0 16px}
.tzt__card-icon svg{width:40px;height:40px;display:block}

/* Anchor cards (quick nav) */
.tzt__card--link{display:flex;flex-direction:column;justify-content:space-between;gap:10px;
  text-decoration:none;color:inherit;transition:border-color .15s,box-shadow .15s,transform .15s}
.tzt__card--link:hover{border-color:var(--tzt-primary);box-shadow:0 10px 26px rgba(16,44,67,.13);transform:translateY(-2px)}
.tzt__card--link .tzt__card-go{font-family:"Inter",sans-serif;font-size:14px;font-weight:600;color:var(--tzt-primary)}

/* ---------- Trust summary cards (compact, icon + label + detail) ---------- */
.tzt__facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.tzt__fact{background:#fff;border:.5px solid var(--tzt-border);border-radius:var(--tzt-radius);
  box-shadow:var(--tzt-shadow);padding:30px 30px;display:flex;flex-direction:column;gap:10px}
.tzt__fact-icon{width:36px;height:36px}
.tzt__fact-icon svg{width:36px;height:36px;display:block}
.tzt__fact h3{margin:0}
.tzt__fact p{margin:0;font-size:14.5px;line-height:1.6;color:var(--tzt-muted)}

/* ---------- Status cards (compliance) ---------- */
/* Deliberately cards, not a <table> - this is a labelled status list, not
   tabular data with meaningful row/column relationships. */
.tzt__status{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.tzt__status-item{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.22);
  border-radius:var(--tzt-radius-sm);padding:22px 24px}
/* flex-start + nudge so the dot tracks the FIRST line when the name wraps to two.
   Qualified with .tzt__status-item because the name is itself a <p>, so the
   `.tzt__status-item p` rule below (0,1,1) would otherwise win and mute it to #C9DCEC. */
.tzt__status-item .tzt__status-name{display:flex;align-items:flex-start;gap:10px;
  font-family:"Inter",sans-serif;font-size:16px;font-weight:600;color:#fff;margin:0 0 6px}
.tzt__status-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;margin-top:7px}
.tzt__status-dot--done{background:#7BD88F}
.tzt__status-dot--progress{background:var(--tzt-secondary)}
.tzt__status-dot--planned{background:var(--tzt-border)}
/* #DCEEFA not #C9DCEC: over the navy+7%-white card this clears WCAG AA (4.5:1); the darker tint measured 4.36:1 */
.tzt__status-item p{margin:0;font-size:14px;line-height:1.6;color:#DCEEFA}

/* ---------- Roadmap timeline ---------- */
/* New component - nothing like it exists on the site. Three stages joined by a
   connector rule on desktop; stacks to a plain vertical list on mobile. */
.tzt__timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;position:relative}
.tzt__timeline::before{content:"";position:absolute;top:19px;left:12%;right:12%;height:2px;
  background:var(--tzt-border);z-index:0}
.tzt__stage{position:relative;z-index:1;text-align:center}
.tzt__stage-dot{width:38px;height:38px;border-radius:50%;margin:0 auto 16px;display:flex;
  align-items:center;justify-content:center;background:#fff;border:2px solid var(--tzt-border);
  box-shadow:var(--tzt-shadow-soft)}
.tzt__stage-dot svg{width:17px;height:17px;display:block}
.tzt__stage--done .tzt__stage-dot{border-color:var(--tzt-primary);background:var(--tzt-primary)}
.tzt__stage--progress .tzt__stage-dot{border-color:var(--tzt-secondary);background:var(--tzt-secondary)}
.tzt__stage h3{margin:0 0 4px}
.tzt__stage-label{display:block;font-size:12.5px;font-weight:500;letter-spacing:.05em;
  text-transform:uppercase;color:var(--tzt-muted);margin:0 0 14px}
.tzt__stage ul{list-style:none;margin:0;padding:0;text-align:left;background:#fff;
  border:.5px solid var(--tzt-border);border-radius:var(--tzt-radius-sm);
  box-shadow:var(--tzt-shadow);padding:20px 22px}
.tzt__stage li{font-size:14.5px;line-height:1.55;color:var(--tzt-muted);padding:7px 0 7px 20px;position:relative}
.tzt__stage li+li{border-top:1px solid #EDF4FB}
.tzt__stage li::before{content:"";position:absolute;left:0;top:14px;width:7px;height:7px;border-radius:50%;
  background:var(--tzt-border)}
.tzt__stage--done li::before{background:var(--tzt-primary)}
.tzt__stage--progress li::before{background:var(--tzt-secondary)}
@media(max-width:900px){
  .tzt__timeline{grid-template-columns:1fr;gap:28px}
  .tzt__timeline::before{display:none}
}

/* ---------- Document library ---------- */
.tzt__docs{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;margin:0 0 44px}
.tzt__doc{background:#fff;border:.5px solid var(--tzt-border);border-radius:var(--tzt-radius-sm);
  box-shadow:var(--tzt-shadow);padding:24px 26px;display:flex;flex-direction:column;gap:14px}
.tzt__doc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.tzt__doc h3{margin:0;font-size:17px}
.tzt__doc-chip{flex:0 0 auto;font-family:"Inter",sans-serif;font-size:11.5px;font-weight:600;
  letter-spacing:.03em;color:var(--tzt-primary);background:#EAF4FF;border-radius:50px;padding:5px 12px;
  white-space:nowrap}
.tzt__doc p{margin:0;font-size:14.5px;line-height:1.6;color:var(--tzt-muted)}
.tzt__doc-meta{display:flex;flex-wrap:wrap;gap:0 26px;margin:0;padding:14px 0 0;border-top:1px solid #EDF4FB}
.tzt__doc-meta div{display:flex;gap:6px;align-items:baseline}
.tzt__doc-meta dt{font-size:12px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:var(--tzt-muted)}
.tzt__doc-meta dd{margin:0;font-family:"Inter",sans-serif;font-size:13px;font-weight:600;color:var(--tzt-navy)}

/* ---------- Sub-processor table ---------- */
/* Genuinely tabular, so a real <table>. Collapses to stacked cards at 767 using
   data-label, since three columns cannot survive a phone width. */
.tzt__table-wrap{overflow-x:auto}
.tzt__table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;
  border:.5px solid var(--tzt-border);border-radius:var(--tzt-radius-sm);overflow:hidden;
  box-shadow:var(--tzt-shadow)}
.tzt__table th,.tzt__table td{text-align:left;padding:16px 22px;font-size:15px;line-height:1.55}
.tzt__table thead th{font-family:"Inter",sans-serif;font-size:12.5px;font-weight:600;letter-spacing:.05em;
  text-transform:uppercase;color:var(--tzt-navy);background:var(--tzt-wash);
  border-bottom:1px solid var(--tzt-border)}
.tzt__table tbody tr+tr td{border-top:1px solid #EDF4FB}
.tzt__table td{color:var(--tzt-muted)}
.tzt__table td:first-child{font-family:"Inter",sans-serif;font-weight:600;color:var(--tzt-navy)}
@media(max-width:767px){
  .tzt__table thead{position:absolute;left:-9999px}
  .tzt__table,.tzt__table tbody,.tzt__table tr,.tzt__table td{display:block;width:100%}
  .tzt__table tr{padding:8px 0}
  .tzt__table tr+tr{border-top:1px solid var(--tzt-border)}
  .tzt__table tbody tr+tr td{border-top:0}
  .tzt__table td{padding:7px 20px;display:flex;justify-content:space-between;gap:16px}
  .tzt__table td::before{content:attr(data-label);font-family:"Inter",sans-serif;font-size:12.5px;
    font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--tzt-navy);flex:0 0 auto}
}

/* ---------- Definition rows (availability targets) ---------- */
.tzt__rows{list-style:none;margin:0;padding:0;display:grid;gap:0;background:#fff;
  border:.5px solid var(--tzt-border);border-radius:var(--tzt-radius-sm);box-shadow:var(--tzt-shadow);
  padding:6px 26px}
.tzt__rows li{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 20px;
  padding:15px 0;font-size:15px;color:var(--tzt-muted)}
.tzt__rows li+li{border-top:1px solid #EDF4FB}
.tzt__rows b{font-family:"Inter",sans-serif;font-weight:600;color:var(--tzt-navy);font-size:15px}
.tzt__rows span{font-family:"Inter",sans-serif;font-weight:600;color:var(--tzt-primary);white-space:nowrap}

/* ---------- Tick list ---------- */
.tzt__ticks{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:11px}
.tzt__ticks li{position:relative;padding-left:28px;font-size:15px;line-height:1.6;color:var(--tzt-muted)}
.tzt__ticks li::before{content:"";position:absolute;left:0;top:6px;width:16px;height:16px;border-radius:50%;
  background:var(--tzt-tint);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231C6BA6' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-size:11px 11px;background-position:center;background-repeat:no-repeat}

/* ---------- FAQ ---------- */
.tzt__faq{max-width:860px;margin:0 auto}
.tzt__faq details{border-bottom:1px solid var(--tzt-border);padding:16px 0}
.tzt__faq summary{font-family:"Inter",sans-serif;font-weight:600;font-size:16.5px;color:var(--tzt-navy);
  cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.tzt__faq summary::-webkit-details-marker{display:none}
.tzt__faq summary::after{content:"+";color:var(--tzt-primary);font-weight:400;font-size:24px;line-height:1;flex:0 0 auto}
.tzt__faq details[open] summary::after{content:"\2212"}
.tzt__faq p{font-size:15px;line-height:1.75;color:var(--tzt-muted);margin:12px 0 0;max-width:74ch}
.tzt__faq a{color:var(--tzt-primary);text-decoration:underline}

/* ---------- Callout ---------- */
.tzt__callout{background:var(--tzt-wash);border:.5px solid var(--tzt-border);border-radius:var(--tzt-radius-sm);
  padding:26px 30px;margin:24px 0 0}
.tzt__callout h3{margin:0 0 8px}
.tzt__callout p{margin:0 0 10px;font-size:15px;line-height:1.7;color:var(--tzt-muted)}
.tzt__callout p:last-child{margin-bottom:0}
.tzt__callout a{color:var(--tzt-primary);text-decoration:underline}

/* ---------- CTA band ---------- */
.tzt__section--cta{text-align:center}
.tzt__section--cta p{color:#C9DCEC;font-size:17px;line-height:1.7;max-width:660px;margin:0 auto 26px}
.tzt__section--cta a.tzt__inline{color:#fff;text-decoration:underline}
.tzt__cta-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}

/* ---------- Entity small print ---------- */
.tzt__entity{border-top:1px solid var(--tzt-border);margin:44px 0 0;padding:24px 0 0;
  font-size:13px;line-height:1.7;color:var(--tzt-muted);text-align:center}

/* ---------- Document request form ---------- */
/*
 * IMPORTANT: style.css only carries Elementor's structural form base
 * (.elementor-field-textual{border:1px solid #69727d;border-radius:3px}). Every
 * good-looking form on this site is styled by page-scoped inline CSS
 * (contact-traizr.php scopes its rules to .elementor-518). Copying that markup
 * without these overrides yields a grey-bordered, 3px-radius, unspaced form.
 *
 * Inputs get a 12px radius, not the 50px pill - pills are for buttons, cards
 * and eyebrows; the site's own text inputs are rectangular.
 */
.tzt__form{background:#fff;border:.5px solid var(--tzt-border);border-radius:var(--tzt-radius-sm);
  box-shadow:var(--tzt-shadow);padding:34px 34px 30px;max-width:860px;margin:0 auto}
@media(max-width:767px){.tzt__form{padding:26px 20px 24px}}

.tzt__form .elementor-form-fields-wrapper{display:flex;flex-wrap:wrap;align-items:flex-start;margin:0 -8px}
/* Elementor's base .elementor-field-group is display:flex + align-items:center + flex-wrap:wrap.
   All three must be overridden or the label refuses to span the group and the label/input
   pair lays out side-by-side instead of stacked. */
.tzt__form .elementor-field-group{padding:0 8px;margin:0 0 18px;flex:0 0 100%;max-width:100%;
  display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap}
.tzt__form .elementor-col-50{flex:0 0 50%;max-width:50%}
@media(max-width:640px){.tzt__form .elementor-col-50{flex:0 0 100%;max-width:100%}}

.tzt__form .elementor-field-label{display:block;width:100%;text-align:left;
  font-family:"Inter",sans-serif;font-size:14px;font-weight:600;
  color:var(--tzt-navy);padding:0 0 6px;line-height:1.4}
.tzt__form .elementor-field-required .elementor-field-label::after{content:" *";color:var(--tzt-primary)}

.tzt__form .elementor-field-textual{width:100%;border:1px solid var(--tzt-border);border-radius:12px;
  min-height:46px;padding:11px 16px;background:#fff;color:var(--tzt-text);
  font-family:"Inter Tight","Inter",system-ui,sans-serif;font-size:15px;line-height:1.5;
  transition:border-color .15s,box-shadow .15s}
.tzt__form .elementor-field-textual::placeholder{color:#8CA3B5}
.tzt__form .elementor-field-textual:hover{border-color:#8FBFE4}
.tzt__form .elementor-field-textual:focus{outline:none;border-color:var(--tzt-primary);
  box-shadow:0 0 0 3px rgba(28,107,166,.14)}
.tzt__form textarea.elementor-field-textual{min-height:104px;resize:vertical}

/* Document checkbox group */
.tzt__form fieldset{border:0;padding:0;margin:0;min-width:0}
.tzt__form legend{font-family:"Inter",sans-serif;font-size:14px;font-weight:600;color:var(--tzt-navy);
  padding:0;margin:0 0 4px}
.tzt__form .tzt__legend-note{font-size:13.5px;line-height:1.6;color:var(--tzt-muted);margin:0 0 14px}
.tzt__checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:8px}
.tzt__check{display:flex;align-items:flex-start;gap:11px;padding:11px 14px;border:1px solid #E3EEF8;
  border-radius:12px;cursor:pointer;font-size:14.5px;line-height:1.45;color:var(--tzt-text);
  transition:border-color .15s,background-color .15s}
.tzt__check:hover{border-color:var(--tzt-border);background:#FAFCFF}
.tzt__check input{flex:0 0 auto;width:17px;height:17px;margin:1px 0 0;accent-color:var(--tzt-primary);cursor:pointer}
.tzt__check:has(input:checked){border-color:var(--tzt-primary);background:#F4FAFF}

.tzt__form .e-form__buttons{flex:0 0 100%;max-width:100%;margin:8px 0 0}
/* align-self stops the group's align-items:stretch from smearing the pill across the full width */
.tzt__form button[type="submit"]{align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:"Inter",sans-serif;font-size:16px;font-weight:600;color:#fff;background:var(--tzt-primary);
  border:2px solid var(--tzt-primary-border);border-radius:50px;padding:12px 30px;min-height:44px;
  cursor:pointer;box-shadow:var(--tzt-shadow);transition:transform .3s}
.tzt__form button[type="submit"]:hover{transform:scale(1.04)}
.tzt__form button[type="submit"]:disabled{opacity:.6;cursor:default;transform:none}
.tzt__form-note{font-size:13px;line-height:1.65;color:var(--tzt-muted);margin:16px 0 0}
.tzt__form-note a{color:var(--tzt-primary);text-decoration:underline}

/* .tzr-form-msg / .tzr-ok / .tzr-err / .tzr-invalid are global in style.css - do not redefine. */

/* ---------- Document-request button + modal ---------- */
.tzt__docs-cta{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;margin:8px 0 0}
.tzt__docs-cta-note{font-size:14px;color:var(--tzt-muted);margin:6px 0 0}
.tzt__docs-cta-note a{color:var(--tzt-primary);text-decoration:underline}

/* Native <dialog>. Blue hairline border + card radius to match the content cards;
   a softer, lighter backdrop and shadow. Closed state is display:none by default. */
.tzt__modal{border:1px solid var(--tzt-border);padding:0;width:min(900px,calc(100vw - 40px));
  max-height:calc(100dvh - 40px);border-radius:var(--tzt-radius-sm);background:#fff;color:var(--tzt-text);
  box-shadow:0 24px 70px rgba(16,44,67,.26);overflow:hidden}
.tzt__modal::backdrop{background:rgba(16,44,67,.42)}
.tzt__modal-inner{padding:26px 30px 30px;max-height:calc(100dvh - 42px);overflow-y:auto}
@media(max-width:767px){.tzt__modal-inner{padding:22px 18px 24px}}
.tzt__modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin:0 0 4px}
.tzt__modal-head h3{font-family:"Inter",sans-serif;font-size:24px;font-weight:600;color:var(--tzt-navy);margin:0;padding-right:4px}
.tzt__modal-sub{font-size:15px;line-height:1.6;color:var(--tzt-muted);margin:0 0 22px}
/* close: circle, blue hairline border, muted grey glyph. Higher specificity + :focus so the
   theme's `button:focus{background:#CC3366}` cannot flip it magenta when the dialog opens. */
.tzt__modal .tzt__modal-close{flex:0 0 auto;width:36px;height:36px;display:inline-flex;align-items:center;
  justify-content:center;font-size:26px;line-height:1;color:var(--tzt-muted);background:transparent;
  border:1px solid var(--tzt-border);border-radius:50%;cursor:pointer;padding:0;
  transition:color .15s,border-color .15s,background-color .15s}
.tzt__modal .tzt__modal-close:hover,.tzt__modal .tzt__modal-close:focus{color:var(--tzt-navy);
  border-color:var(--tzt-primary);background:var(--tzt-wash)}
/* inside the modal the form supplies fields only - drop its standalone card chrome to avoid a box-in-a-box */
.tzt__modal .tzt__form{border:0;box-shadow:none;padding:0;background:transparent;max-width:none;margin:0}
/* lock background scroll while the modal is open (showModal makes content inert but does not lock scroll) */
body:has(.tzt__modal[open]){overflow:hidden}
