
:root{
  --red:#D81E1E; --black:#111111; --green:#0A8F4C; --gold:#F0C419;
  --bg:#fffdfa; --text:#161616; --muted:#5e5e5e;
  --radius:16px; --shadow:0 8px 24px rgba(0,0,0,.12);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;line-height:1.6}
a{color:var(--green);text-decoration-thickness:2px}
.wrap{max-width:1280px;margin:0 auto;padding:20px}
.hero .mast{display:flex;align-items:center;gap:16px}
.logo{width:64px;height:64px;object-fit:contain;border-radius:50%;background:#fff;box-shadow:var(--shadow)}
.flag{height:64px;width:auto;border-radius:10px;outline:3px solid rgba(255,255,255,.5);background:#fff;margin-left:auto}
.flag-bar,.flag-footer{display:grid;grid-template-columns:1fr}
.flag-bar>div{height:8px} .flag-footer>div{height:6px}
.r{background:var(--red)} .b{background:var(--black)} .g{background:var(--green)}
.title h1{font-weight:800;margin:0}
.title p{margin:0;color:var(--muted)}
.nav{display:flex;flex-wrap:wrap;gap:8px;padding-top:0}
.nav a{display:inline-block;padding:8px 12px;border:1.5px solid var(--black);border-radius:999px;color:var(--black);background:#fff;font-weight:600;text-decoration:none}
.nav a:hover,.nav a.active{background:var(--green);color:#fff;border-color:var(--green)}
main{max-width:1280px;margin:0 auto;padding:20px;display:grid;grid-template-columns:minmax(0,1fr)}
.card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}
h2{font-size:28px;margin:.4rem 0 1rem;font-weight:800}
p{margin:.6rem 0}
ul,ol{margin:.5rem 0 .75rem 1.25rem}
.footer-info{background:#0c0c0c;color:#efefef}
.footer-logo{height:30px;width:auto;border-radius:50%;background:#fff;padding:2px}

/* Footer row layout (centered items) */
.footer-info .wrap.footer-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  flex-wrap:wrap;
}
.footer-info .nsi-logo{ height:40px; width:auto; }


/* --- Design upgrade --- */
:root{
  --red:#D7263D; --black:#111111; --green:#0A8F4C; --gold:#F4C542;
  --bg:#fffaf2; --paper:#ffffff; --text:#171717; --muted:#626262;
  --radius:18px; --shadow:0 10px 30px rgba(0,0,0,.12);
}
/* Subtle background texture */
body{
  background: var(--bg);
  background-image:
    radial-gradient(rgba(0,0,0,.02) 1px, transparent 1px),
    radial-gradient(rgba(0,0,0,.02) 1px, transparent 1px);
  background-size: 12px 12px, 12px 12px;
  background-position: 0 0, 6px 6px;
  color: var(--text);
}

/* Typography */
h1,h2,h3,h4{font-family:'Poppins', Inter, system-ui, Arial; line-height:1.2}
body, p, li{font-family:'Inter', system-ui, Arial}
h1{font-weight:800}
h2{font-weight:800; letter-spacing:.2px; margin-top:.2rem}
h2.gradient-underline{
  position:relative; padding-bottom:.35rem; display:inline-block;
}
h2.gradient-underline:after{
  content:""; position:absolute; left:0; right:0; bottom:-6px; height:6px;
  background: linear-gradient(90deg, var(--red), var(--black) 45%, var(--green));
  border-radius: 6px;
}

/* Header / Nav */
.flag-bar>div{height:10px}
.hero .mast{padding:28px 20px}
.nav{gap:10px; padding-bottom:10px}
.nav a{
  border:2px solid var(--black);
  border-radius:999px;
  padding:10px 14px;
  background:#fff;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.nav a:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(0,0,0,.12) }
.nav a.active{ background:var(--green); color:#fff; border-color:var(--green) }

/* Card look */
.card{
  background: var(--paper);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 28px;
}

/* CTA Buttons */
button.primary{ background: var(--green); color:#fff }
button.primary:hover{ filter:brightness(.95) }
button.secondary{ background:#fff; color:var(--black); border:2px solid var(--black) }
button.secondary:hover{ background:#f8f8f8 }

/* Home hero section */
.home-hero{
  position:relative;
  overflow:hidden;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  margin: 14px auto 10px;
  background:
    linear-gradient(135deg, rgba(0,0,0,.55), rgba(0,0,0,.55)),
    url('flag.png');
  background-size: cover;
  color:#fff;
}
.home-hero .inner{ padding: 48px 24px; text-align:center }
.home-hero h1{ font-size: clamp(28px, 5vw, 44px); margin:0 0 8px }
.home-hero p{ margin:.25rem 0 16px; color:#f2f2f2 }
.home-hero .cta{ display:inline-block; padding:12px 18px; border-radius:999px; background:var(--gold); color:#181818; font-weight:800; text-decoration:none }
.home-hero .cta:hover{ filter:brightness(.95) }

/* Footer layout */
.footer-info .wrap{ display:flex; align-items:center; justify-content:center; gap:16px; flex-wrap:wrap }
.footer-info p{ margin:0; color:#e5e5e5 }
.footer-logo{ height:36px; width:auto }
.nsi-logo{ height:40px; width:auto }


/* --- Button & Nav enhancements --- */
:root{
  --btnRadius:999px;
}
.nav a{
  border:0;
  border-radius:var(--btnRadius);
  padding:12px 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.95), #fff);
  box-shadow: 0 2px 0 rgba(0,0,0,.15), 0 8px 20px rgba(0,0,0,.10);
  color:#111;
  position:relative;
}
.nav a:before{
  content:"";
  position:absolute; inset:0; border-radius:var(--btnRadius);
  padding:1.5px; background:linear-gradient(90deg, var(--red), var(--black) 45%, var(--green));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}
.nav a:hover{ transform:translateY(-2px); box-shadow:0 3px 0 rgba(0,0,0,.18), 0 12px 24px rgba(0,0,0,.14) }
.nav a.active{
  background: linear-gradient(180deg, var(--green), #06683A);
  color:#fff;
}
.nav a.active:before{ opacity:.0 }

/* Form buttons */
button{
  border-radius:var(--btnRadius);
  font-weight:800;
}
button.primary{
  background: linear-gradient(180deg, var(--green), #06683A);
  color:#fff;
  border:0;
  box-shadow:0 2px 0 rgba(0,0,0,.18), 0 10px 22px rgba(10,143,76,.28);
}
button.primary:hover{ transform: translateY(-1px) }
button.primary:focus-visible{ outline:3px solid var(--gold); outline-offset:2px }

button.secondary{
  background: #fff;
  color: #111;
  border:0;
  box-shadow: inset 0 0 0 2px #111, 0 8px 18px rgba(0,0,0,.08);
}
button.secondary:hover{ background:#f7f7f7 }


/* --- Horizontal tab navigation refresh --- */
.nav{
  display:flex; gap:18px; padding:0 20px 8px; border-bottom:2px solid rgba(0,0,0,.12);
  justify-content:center; flex-wrap:wrap;
}
.nav a{
  background:transparent; border:none; color:#0f0f0f; font-weight:700;
  padding:10px 4px; position:relative; text-decoration:none; letter-spacing:.2px;
}
.nav a:after{
  content:""; position:absolute; left:0; right:0; bottom:-10px; height:4px;
  background:transparent; border-radius:4px; transform:translateY(4px);
  transition:all .18s ease;
}
.nav a:hover:after{
  background: linear-gradient(90deg, var(--red), var(--black) 45%, var(--green));
  transform:translateY(0);
}
.nav a.active{ color:var(--black) }
.nav a.active:after{
  background: linear-gradient(90deg, var(--red), var(--black) 45%, var(--green));
  transform:translateY(0);
}

/* Card accent + livelier palette */
:root{
  --red:#E11D2B; --green:#0A9B59; --gold:#FFC447; --bg:#FFF8EF; --paper:#FFFFFF;
}
.card{
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 14px 30px rgba(0,0,0,.12);
}
.card:before{
  content:""; display:block; height:6px; margin:-28px -28px 20px; border-top-left-radius:18px; border-top-right-radius:18px;
  background: linear-gradient(90deg, var(--red), var(--black) 45%, var(--green));
}

/* Buttons -> simple links to match tabs */
button.primary, button.secondary{
  border-radius:12px;
  box-shadow:none;
  border:1.5px solid rgba(0,0,0,.2);
}
button.primary{ background:var(--green); color:#fff }
button.secondary{ background:#fff; color:#111 }


/* --- Contact form: wide + creative --- */
.form-hero .inner{ padding:64px 28px }
.form-card{ padding:34px }
.form-grid{ display:grid; gap:18px }
@media (min-width: 720px){ .form-grid{ grid-template-columns:1fr 1fr } }
@media (min-width: 1060px){ .form-grid{ grid-template-columns:1.2fr 1.2fr 1.6fr } }
.form-grid .full{ grid-column:1/-1 }
.field label{ font-weight:800; letter-spacing:.2px }
.input, .select, .textarea{
  padding:16px 16px 16px 46px; font-size:1.05rem; border-radius:16px; border:2px solid rgba(0,0,0,.12);
  box-shadow:0 6px 18px rgba(0,0,0,.06) inset;
}
.textarea{ min-height:220px }
.input:focus, .select:focus, .textarea:focus{
  border-color:var(--green); box-shadow:0 0 0 4px rgba(10,155,89,.2);
}
/* Icon base */
.icon{ position:relative }
.icon:before{
  content:""; position:absolute; left:14px; top:50%; width:22px; height:22px; transform:translateY(-50%);
  background-size:22px 22px; background-repeat:no-repeat; opacity:.9;
}
.icon-user:before  { background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%230A9B59'><path d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm0 2c-5 0-9 2.5-9 5.5V22h18v-2.5C21 16.5 17 14 12 14Z'/></svg>"); }
.icon-mail:before  { background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%230A9B59'><path d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2Zm-1.4 4.25L12 13 5.4 8.25a1 1 0 1 0-1.2 1.6l7 5a2 2 0 0 0 2.4 0l7-5a1 1 0 1 0-1.2-1.6Z'/></svg>"); }
.icon-globe:before { background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%230A9B59'><path d='M12 2a10 10 0 1 0 .001 20.001A10 10 0 0 0 12 2Zm0 2c1.7 0 3.2 2.1 3.74 5H8.26C8.8 6.1 10.3 4 12 4Zm-4 6h8c.02.33.03.66.03 1s-.01.67-.03 1H8c-.02-.33-.03-.66-.03-1s.01-.67.03-1Zm.26 3h7.48C15.2 16.9 13.7 19 12 19s-3.2-2.1-3.74-5Z'/></svg>"); }
.icon-topic:before { background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%230A9B59'><path d='M4 5h16v3H4zM4 10h10v3H4zM4 15h7v3H4z'/></svg>"); }
.icon-msg:before   { background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%230A9B59'><path d='M21 6a3 3 0 0 0-3-3H6a3 3 0 0 0-3 3v9a3 3 0 0 0 3 3h9l4 4v-4h-1a3 3 0 0 0 3-3V6Z'/></svg>"); }


/* --- Contact page split layout --- */
.contact-split{
  display:flex; flex-wrap:wrap; min-height:500px; border-radius:18px; overflow:hidden; box-shadow:0 16px 36px rgba(0,0,0,.15);
}
.contact-photo{
  flex:1 1 40%; background:url('bg_p3.svg') center/cover no-repeat; min-height:300px;
}
.contact-form-side{
  flex:1 1 60%; background:#fff; padding:36px; display:flex; align-items:center; justify-content:center;
}
@media(max-width:820px){
  .contact-photo, .contact-form-side{ flex:1 1 100% }
  .contact-form-side{ padding:24px }
}

.photo-credit{ position:absolute; bottom:8px; right:10px; color:#eee; font-size:.75rem; opacity:.9 }


/* --- Contact grid: 4 columns on desktop --- */
.simple-grid{ display:grid; gap:16px }
@media (min-width: 720px){ .simple-grid{ grid-template-columns: 1fr 1fr } }
@media (min-width: 1200px){ .simple-grid{ grid-template-columns: 1fr 1fr 1.8fr 1fr } } /* forename | surname | email (wider) | area */
.simple-grid .full{ grid-column:1/-1 }


/* --- Make message box wider/taller --- */
.simple-grid textarea.textarea {
  min-height: 200px;
  width: 100%;
  resize: vertical;
}


/* --- Split screen contact form --- */
.contact-container {
  display: flex;
  flex-wrap: wrap;
  min-height: 80vh;
}
.contact-image {
  flex: 1;
  background: url('contact-panel.jpg') center/cover no-repeat;
}
.contact-form {
  flex: 1;
  background: #fff;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
@media(max-width: 768px) {
  .contact-image { display: none; }
  .contact-form { flex: 1 1 100%; }
}

/* ensure the form sits high */
.contact-form { align-items: stretch; }
.contact-form .simple-grid { margin-top: 6px; }

/* Reduce top spacing in contact form column */
.contact-form { justify-content:flex-start; padding-top:18px; }
.contact-form h2 { margin-top:0 }
.contact-form .simple-grid { margin-top:6px }
.simple-grid textarea.textarea { min-height:220px; }

/* Only left panel should have background image on contact page */
.contact-form{ background:#fff !important; }


/* --- Strong split guard: grid, no overlap --- */
.contact-container{
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: stretch;
}
@media (max-width: 980px){
  .contact-container{ grid-template-columns: 1fr; }
}
.contact-image{
  position: relative;
  min-height: 70vh;
  background-position: center;
  background-size: cover;
  z-index: 0;
}
.contact-form{
  position: relative;
  z-index: 1;
  background: #fff !important;
  margin: 0 !important;
  padding: 20px 18px !important;
  box-shadow: none;
}
/* Make sure inner form does not slide under the image */
.contact-form .simple-grid{ margin-top: 6px !important; }


/* --- Hard column assignment + overflow guards --- */
.contact-container{ position:relative; overflow:hidden }
.contact-container > .contact-image{ grid-column:1 / 2 !important; }
.contact-container > .contact-form{ grid-column:2 / 3 !important; background:#fff !important; }
.contact-image{ overflow:hidden }

/* prevent grid overflow */
.contact-form{ min-width:0 !important; }
.contact-image{ min-width:0; max-width:100%; }
.simple-grid{ min-width:0; }

/* email width + overflow guards */
.field{ min-width:0 }
.field *{ min-width:0 }
.input, .select, .textarea{ width:100%; box-sizing:border-box }
.contact-form{ overflow: visible }


/* --- Form alignment normalization & clipping fix --- */
.simple-grid{ align-items:start }
.field{ min-width:0 }
.field *{ min-width:0 }

/* Unify input/select sizing and remove leftover icon padding */
.input, .select{
  display:block;
  width:100%;
  box-sizing:border-box;
  height:48px;
  padding:12px 14px !important; /* override any 46px left padding from icon styles */
  line-height:1.2;
}

/* Ensure textarea is roomy and not clipped */
.textarea{
  display:block;
  width:100%;
  min-height:240px;
  line-height:1.5;
  padding:14px !important;
  box-sizing:border-box;
}

/* Make 4 columns align cleanly on wide screens and avoid wrap */
@media (min-width: 1200px){
  .simple-grid{ grid-template-columns: 1fr 1fr 1.6fr 1fr } /* Email still wider but prevents overflow */
  .simple-grid .full{ grid-column: 1 / -1 }
}

/* Prevent any column bleed or clipping */
.contact-form{ min-width:0 !important; overflow:visible }
.simple-grid{ min-width:0 }


/* --- FINAL contact alignment + clipping fixes --- */
/* Make 4 columns kick in earlier and stay on one row on typical laptops */
@media (min-width: 1024px){
  .simple-grid{ grid-template-columns: 1fr 1fr 1.8fr 1fr; grid-auto-flow: row dense; }
}

/* Ensure fields stretch properly and don't clip text */
.field{ min-width:0; align-items:stretch }
.field *{ min-width:0 }

/* Inputs/selects: no fixed height; use min-height and comfortable padding */
.input, .select{
  display:block; width:100%; box-sizing:border-box;
  min-height:48px; /* was height:48px */
  height:auto;
  padding:12px 14px !important;
  font-size:16px; line-height:1.35;
}

/* Select styling & arrow, and prevent clipping */
.select{
  -webkit-appearance:none; appearance:none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23111111'><path d='M5.23 7.21a.75.75 0 011.06.02L10 10.94l3.71-3.71a.75.75 0 111.06 1.06l-4.24 4.24a.75.75 0 01-1.06 0L5.21 8.29a.75.75 0 01.02-1.08z'/></svg>");
  background-repeat:no-repeat; background-position: right 12px center; background-size:18px 18px;
  padding-right:40px !important;
}

/* Textarea: roomy, never clipped */
.textarea{
  display:block; width:100%; min-height:260px;
  line-height:1.5; padding:14px !important; box-sizing:border-box;
}

/* Prevent any grid item from overflowing its track */
.simple-grid{ min-width:0 }
.contact-form{ min-width:0 !important; overflow:visible; }


/* --- HARD FIX: first-row alignment + no clipping --- */
@media (min-width: 1024px){
  .simple-grid{
    grid-template-columns: 1fr 1fr 2fr 1fr !important; /* Email wider */
    grid-auto-flow: row dense;
    align-items: end;
  }
  .simple-grid > .field:nth-child(1){ grid-column: 1; }
  .simple-grid > .field:nth-child(2){ grid-column: 2; }
  .simple-grid > .field:nth-child(3){ grid-column: 3; }
  .simple-grid > .field:nth-child(4){ grid-column: 4; }
  .simple-grid .full{ grid-column: 1 / -1; }
}

/* Inputs & selects: fully visible text, equal heights */
.field{ min-width:0; }
.field *{ min-width:0; }

.input, .select{
  width:100% !important;
  box-sizing:border-box !important;
  height:auto !important;
  min-height:52px !important;
  padding:12px 16px !important;
  font-size:16px !important;
  line-height:1.4 !important;
  overflow:visible !important;
}

/* Native select tweaks (consistent baseline) */
.select{
  -webkit-appearance:none; appearance:none;
  background-repeat:no-repeat;
  background-position: right 14px center;
  background-size:18px 18px;
  padding-right:44px !important;
}
.select option{ font-size:16px; line-height:1.4; }

/* Textarea roomy & unclipped */
.textarea{
  width:100% !important;
  min-height:280px !important;
  padding:14px 16px !important;
  line-height:1.5 !important;
  box-sizing:border-box !important;
}

/* Prevent any grid overflow */
.simple-grid{ min-width:0 !important; }
.contact-form{ min-width:0 !important; overflow:visible !important; }


/* --- Rounded Green Tabs (match reference image) --- */
:root{
  --tab-bg1:#1e6b52;         /* top/left green */
  --tab-bg2:#1a5b46;         /* bottom/right green */
  --tab-text:#ffffff;        /* white text */
  --tab-shadow:0 8px 18px rgba(0,0,0,.18);
  --tab-radius:16px;
}
.nav{ gap:18px; padding:8px 12px; justify-content:center; flex-wrap:wrap }
.nav a, .btn-tab{
  display:inline-block;
  color:var(--tab-text);
  background: linear-gradient(180deg, var(--tab-bg1), var(--tab-bg2));
  border: 1px solid rgba(255,255,255,.18);
  border-radius: var(--tab-radius);
  padding: 12px 18px;
  text-decoration:none;
  font-weight:700;
  box-shadow: var(--tab-shadow);
  transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}
.nav a:hover, .btn-tab:hover{ transform: translateY(-1px); filter:brightness(1.05); }
.nav a:active, .btn-tab:active{ transform: translateY(0); filter:brightness(.98) }
.nav a.active{
  outline: 2px solid rgba(255,255,255,.28);
  outline-offset: 2px;
}
/* optional small variant */
.btn-tab.sm{ padding:8px 14px; border-radius:14px }


/* --- Gradient Green Tabs with No Outline --- */
:root{
  --tab-green-light:#3d7a63;
  --tab-green-dark:#2f5d4e;
  --tab-green-hover:#499d7d;
  --tab-green-active:#1e4035;
}

.nav {
  text-align: center;
  margin: 20px 0;
  gap: 12px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.nav a,
.btn-tab {
  display: inline-block;
  background: linear-gradient(180deg, var(--tab-green-light), var(--tab-green-dark));
  color: white;
  padding: 10px 22px;
  border-radius: 10px;
  text-decoration: none;
  font-weight: bold;
  margin: 5px;
  transition: background 0.3s ease, transform 0.2s ease;
  outline: none !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

/* Hover Effect */
.nav a:hover,
.btn-tab:hover {
  background: linear-gradient(180deg, var(--tab-green-hover), var(--tab-green-dark));
  transform: translateY(-2px);
}

/* Remove focus outline completely */
.nav a:focus,
.btn-tab:focus {
  outline: none !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

/* Active Tab Styling */
.nav a.active,
.btn-tab.active {
  background: linear-gradient(180deg, var(--tab-green-active), var(--tab-green-dark));
}


/* --- FULL OUTLINE & FOCUS RING REMOVAL FOR NAV BUTTONS --- */
.nav a,
.btn-tab {
  outline: none !important;
  box-shadow: none !important;
}

.nav a:focus,
.btn-tab:focus,
.nav a:focus-visible,
.btn-tab:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

.nav a::-moz-focus-inner,
.btn-tab::-moz-focus-inner {
  border: 0 !important;
}


/* --- NAV TABS: remove ALL outlines/borders/pseudo-borders --- */
.nav a, .btn-tab{
  outline: 0 !important;
  outline-offset: 0 !important;
  box-shadow: none !important;
  border: 0 !important;                /* kill any border that looks like an outline */
  text-decoration: none !important;
  -webkit-tap-highlight-color: transparent;
}
.nav a:focus, .btn-tab:focus,
.nav a:focus-visible, .btn-tab:focus-visible,
.nav a:active, .btn-tab:active {
  outline: 0 !important;
  outline-offset: 0 !important;
  box-shadow: none !important;
  border: 0 !important;
}
/* Remove any pseudo-element gradient borders previously added */
.nav a::before, .nav a::after,
.btn-tab::before, .btn-tab::after{
  content: none !important;
  display: none !important;
}


/* --- CTA: Next Steps callout --- */
.cta-next-steps{
  margin: 14px auto 18px;
}
.cta-next-steps .cta-inner{
  background: linear-gradient(135deg, rgba(225,29,43,.95), rgba(26,91,70,.95));
  color: #fff;
  border-radius: 18px;
  padding: 18px 18px;
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
.cta-next-steps h3{
  margin: 0 0 6px 0;
  color: #fff;
}
.cta-next-steps p{
  margin: 0;
  opacity: .95;
  max-width: 70ch;
}
.cta-next-steps .cta-actions .btn-tab{
  background: linear-gradient(180deg, var(--tab-green-light), var(--tab-green-dark));
  border-radius: 12px;
  font-weight: 800;
}
@media (max-width: 820px){
  .cta-next-steps .cta-inner{ flex-direction: column; align-items: flex-start; }
}
