/* Contact page. Builds on tokens, base and home.css. */

/* breadcrumb (same as the Resource Centre) */
.ns-crumbs ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.ns-crumbs li+li::before{content:"/";margin-right:6px;color:var(--ns-survey)}
.ns-crumbs a{color:var(--ns-ink-2);text-decoration:none;border-bottom:1px solid var(--ns-rule)}
.ns-crumbs a:hover{color:var(--ns-redline);border-color:currentColor}
.ns-crumbs [aria-current]{color:var(--ns-ink)}

/* header */
.ns-ct-head{padding-block:var(--ns-s6)}
.ns-ct-top{margin-top:var(--ns-s6);display:grid;gap:var(--ns-s5)}
.ns-ct-h1{margin:0;font-family:var(--ns-f-display);font-weight:800;font-stretch:82%;letter-spacing:-.035em;line-height:.9;font-size:clamp(3rem,1.6rem + 6vw,7rem)}
.ns-ct-line{margin:var(--ns-s3) 0 0;font-family:var(--ns-f-display);font-weight:700;font-stretch:90%;font-size:clamp(1.25rem,1rem + 1.4vw,2.25rem);letter-spacing:-.015em;line-height:1.1}
.ns-ct-line::after{content:"";display:block;width:3.2em;height:.12em;margin-top:.3em;background:var(--ns-redline);transform:skewX(-14deg);transform-origin:left}
.ns-ct-lead{max-width:40ch;font-size:clamp(1rem,.95rem + .25vw,1.125rem);line-height:1.55}
@media (min-width:1024px){
  .ns-ct-top{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--ns-gutter);align-items:last baseline}
  .ns-ct-top > div{grid-column:1 / 8}
  .ns-ct-lead{grid-column:8 / 13;margin:0}
}

/* layout: form on the left, email and next steps on the right */
.ns-ct-grid{display:grid;gap:var(--ns-s7)}
@media (min-width:1024px){
  .ns-ct-grid{grid-template-columns:minmax(0,7fr) minmax(0,4fr);column-gap:var(--ns-s8);align-items:start}
  .ns-ct-aside{position:sticky;top:96px}
}

/* form */
.ns-form fieldset{border:0;margin:0;padding:0;min-width:0}
.ns-routes-pick > legend{margin-bottom:var(--ns-s4);padding:0}
.ns-route-grid{display:grid;gap:var(--ns-s3)}
@media (min-width:600px){.ns-route-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ns-route{position:relative;display:grid;grid-template-columns:auto 1fr;column-gap:var(--ns-s3);row-gap:4px;align-items:baseline;padding:var(--ns-s4);border:1px solid var(--ns-rule);background:var(--ns-paper);cursor:pointer;transition:border-color var(--ns-ui) var(--ns-ease),box-shadow var(--ns-ui) var(--ns-ease)}
.ns-route input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.ns-route-n{grid-row:1 / 3}
.ns-route-t{font-family:var(--ns-f-display);font-weight:700;font-stretch:95%;font-size:1.125rem;line-height:1.2}
.ns-route-d{grid-column:2;font-size:.875rem;color:var(--ns-ink-2);line-height:1.45}
.ns-route:hover{border-color:var(--ns-ink)}
.ns-route:has(input:checked){border-color:var(--ns-ink);box-shadow:inset 0 0 0 1px var(--ns-ink)}
.ns-route:has(input:checked) .ns-route-n{color:var(--ns-redline)}
.ns-route:has(input:focus-visible){outline:2px solid var(--ns-redline);outline-offset:3px}

.ns-form-body{margin-top:var(--ns-s6);border-top:1px solid var(--ns-ink);padding-top:var(--ns-s5);display:grid;gap:var(--ns-s5)}
.ns-you,.ns-route-fields{display:grid;gap:var(--ns-s5)}
@media (min-width:768px){
  .ns-you{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ns-you .ns-field:first-of-type{grid-column:1 / -1}
}
.ns-field{display:grid;gap:6px;align-content:start}
.ns-field > label,.ns-choice > legend{font-weight:600;font-size:.9375rem;line-height:1.3;padding:0}
.ns-opt{font-weight:400;color:var(--ns-ink-2)}
.ns-hint{margin:0;font-size:.8125rem;color:var(--ns-ink-2)}
.ns-field input[type=text],.ns-field input[type=email],.ns-field input[type=tel],.ns-field textarea,.ns-field select{
  width:100%;font:inherit;font-size:1rem;color:var(--ns-ink);background:var(--ns-paper);
  border:1px solid var(--ns-survey);border-radius:2px;padding:12px 14px;min-height:48px}
.ns-field textarea{resize:vertical;line-height:1.5}
.ns-field input:hover,.ns-field textarea:hover,.ns-field select:hover{border-color:var(--ns-ink)}
.ns-field input:focus-visible,.ns-field textarea:focus-visible,.ns-field select:focus-visible{outline:2px solid var(--ns-redline);outline-offset:1px;border-color:var(--ns-ink)}
.ns-select{position:relative}
.ns-select select{appearance:none;-webkit-appearance:none;padding-right:40px}
.ns-select::after{content:"";position:absolute;right:16px;top:50%;width:8px;height:8px;border-right:1.5px solid var(--ns-ink);border-bottom:1.5px solid var(--ns-ink);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.ns-choice-row{display:flex;flex-wrap:wrap;gap:var(--ns-s3) var(--ns-s5);margin-top:6px}
.ns-choice-row label,.ns-consent label{display:inline-flex;gap:10px;align-items:baseline;font-size:.9375rem;cursor:pointer}
.ns-choice-row input,.ns-consent input{accent-color:var(--ns-ink);width:18px;height:18px;flex:none;transform:translateY(3px)}
.ns-consent label{font-weight:400;color:var(--ns-ink-2);line-height:1.5}
.ns-consent a{color:var(--ns-ink)}
.ns-err{margin:0;font-size:.8125rem;font-weight:600;color:var(--ns-redline)}
.ns-field.is-bad input,.ns-field.is-bad textarea,.ns-field.is-bad select{border-color:var(--ns-redline)}
.ns-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ns-form-actions{display:flex;flex-wrap:wrap;gap:var(--ns-s4);align-items:center}
.ns-form-status{margin:0 0 var(--ns-s5);padding:var(--ns-s4);border:1px dashed var(--ns-ochre);background:var(--ns-paper);font-size:.9375rem}
/* with JS, only the chosen route's fields show */
.js .ns-route-fields[hidden]{display:none}

/* aside */
.ns-ct-aside{display:grid;gap:var(--ns-s5)}
.ns-ct-box{border-top:1px solid var(--ns-ink);padding-top:var(--ns-s4)}
.ns-ct-box > .ns-ann{margin:0 0 var(--ns-s3)}
.ns-ct-email{margin:0 0 var(--ns-s2);font-family:var(--ns-f-display);font-weight:700;font-stretch:92%;font-size:clamp(1.125rem,1rem + .6vw,1.5rem);letter-spacing:-.01em;overflow-wrap:anywhere;user-select:all}
.ns-ct-email a{text-decoration:none;border-bottom:1.5px solid currentColor}
.ns-ct-email a:hover{color:var(--ns-redline)}
.ns-ct-next{list-style:none;margin:0;padding:0;display:grid;gap:var(--ns-s3)}
.ns-ct-next li{display:grid;grid-template-columns:2.2em 1fr;align-items:baseline;line-height:1.5}

/* WhatsApp lines and the Telegram steps (30 Oct 2026) */
.ns-wa{margin-top:var(--ns-s5);padding-top:var(--ns-s4);border-top:1px solid var(--ns-rule)}
.ns-wa>.ns-ann{margin:0 0 var(--ns-s2)}
.ns-wa ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--ns-s2) var(--ns-s5)}
.ns-wa li a{display:inline-flex;align-items:baseline;gap:var(--ns-s2);color:inherit;font-weight:600}
.ns-wa li a .ns-ann{font-weight:400;text-decoration:none}
.ns-wa-ch{margin:var(--ns-s3) 0 0}
.ns-tg-steps{list-style:none;margin:0 0 var(--ns-s5);padding:0;display:grid}
.ns-tg-steps li{display:grid;grid-template-columns:2.5rem 1fr;gap:var(--ns-s2);padding-block:var(--ns-s3);border-top:1px solid var(--ns-rule);line-height:1.55}
.ns-tg-steps li:last-child{border-bottom:1px solid var(--ns-rule)}
.ns-ct-note{margin:var(--ns-s2) 0 0;font-size:.8125rem;line-height:1.5;color:var(--ns-ink-2)}
.ns-ct-note a{color:var(--ns-ink)}
.ns-rc-help-body>.ns-wa{grid-column:1/-1;justify-self:stretch;margin-top:0}
.ns-wa li a{text-decoration:none}
.ns-wa li a span:first-child{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.ns-wa li a:hover span:first-child,.ns-wa li a:focus-visible span:first-child{text-decoration-thickness:2px}