.scp0:hover { color: rgb(255, 255, 255) !important; border-color: rgb(255, 255, 255) !important; }
.scp1:hover { color: rgb(240, 201, 135) !important; border-color: rgb(240, 201, 135) !important; }
.scp2:hover { background: rgb(232, 240, 238) !important; color: rgb(22, 48, 46) !important; }
.scp3:hover { background: rgb(22, 48, 46) !important; color: rgb(255, 255, 255) !important; }
.scp4:hover { border-color: rgb(31, 95, 91) !important; }
.scp5:hover { border-color: rgb(47, 133, 128) !important; background: rgb(232, 240, 238) !important; }
.scp6:hover { border-color: rgb(47, 133, 128) !important; background: rgb(232, 240, 238) !important; transform: translateY(-2px) !important; }
.scp7:hover { border-color: rgb(47, 133, 128) !important; transform: translateY(-3px) !important; box-shadow: rgba(22, 48, 46, 0.09) 0px 14px 30px !important; }
.scp8:hover { background: rgb(30, 63, 60) !important; border-color: rgb(77, 122, 118) !important; }
.scp9:hover { color: rgb(255, 255, 255) !important; }
.scpa:hover { background: rgb(31, 95, 91) !important; color: rgb(255, 255, 255) !important; }
.scpb:hover { background: rgb(244, 247, 245) !important; }
.scpc:hover { background: rgb(240, 201, 135) !important; color: rgb(22, 48, 46) !important; }
.scpd:hover { background: rgb(30, 63, 60) !important; color: rgb(255, 255, 255) !important; }
.scpe:hover { border-color: rgb(47, 133, 128) !important; }
.scpf:hover { background: rgba(255, 255, 255, 0.6) !important; }
.scpg:hover { background: rgb(111, 35, 35) !important; color: rgb(255, 255, 255) !important; }
.scph:hover { background: rgb(232, 240, 238) !important; }
.scpi:hover { background: rgb(22, 48, 46) !important; }
.scpj:hover { border-color: rgb(47, 133, 128) !important; background: rgb(232, 240, 238) !important; transform: translateX(3px) !important; }
.scpk:hover { box-shadow: rgba(22, 48, 46, 0.1) 0px 16px 34px !important; transform: translateY(-3px) !important; }
.scpl:hover { color: rgb(47, 133, 128) !important; }
.scpm:hover { border-color: rgb(47, 133, 128) !important; transform: translateX(4px) !important; box-shadow: rgba(22, 48, 46, 0.08) 0px 12px 28px !important; }
.scpn:hover { transform: translateY(-3px) !important; box-shadow: rgba(22, 48, 46, 0.09) 0px 14px 30px !important; }
.scpo:hover { border-color: rgb(47, 133, 128) !important; background: rgb(244, 247, 245) !important; }
.scpp:hover { border-color: rgb(47, 133, 128) !important; color: rgb(22, 48, 46) !important; }

* { box-sizing: border-box; }
body { margin: 0px; background: rgb(251, 250, 247); color: rgb(28, 43, 42); font-family: "Open Sans", system-ui, sans-serif; line-height: 1.6; -webkit-font-smoothing: antialiased; }
a { color: rgb(31, 95, 91); text-underline-offset: 3px; transition: color 0.18s; }
a:hover { color: rgb(47, 133, 128); }
h1, h2, h3, h4 { margin: 0px; font-family: Montserrat, system-ui, sans-serif; font-weight: 700; line-height: 1.25; letter-spacing: -0.02em; text-wrap: pretty; }
h1 { line-height: 1.15; }
p, li, span, a, button, label, div { line-height: inherit; }
ul, ol { line-height: 1.7; }
p { margin: 0px; text-wrap: pretty; }
input, select, textarea, button { font-family: inherit; font-size: inherit; }
input:focus, select:focus, textarea:focus { outline: rgb(47, 133, 128) solid 2px; outline-offset: 1px; }
::selection { background: rgb(201, 227, 223); }
@keyframes riseIn {
  0% { opacity: 0; transform: translateY(12px); }
  100% { opacity: 1; transform: none; }
}
@keyframes pulseRing {
  0% { box-shadow: rgba(47, 133, 128, 0.45) 0px 0px 0px 0px; }
  70% { box-shadow: rgba(47, 133, 128, 0) 0px 0px 0px 14px; }
  100% { box-shadow: rgba(47, 133, 128, 0) 0px 0px 0px 0px; }
}

/* ===================== Responsive Header ===================== */

/* Sticky outer wrapper */
.pt-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(251, 250, 247, 0.95);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgb(230, 226, 217);
}

/* Centred inner row — relative so the mobile dropdown positions from here */
.pt-header-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 12px 20px;
  display: flex;
  align-items: center;
  gap: 16px;
  position: relative;
}

/* Logo link */
.pt-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: inherit;
  flex-shrink: 0;
}

/* Desktop nav row */
.pt-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  margin-left: auto;
  align-items: center;
}

/* Plain link nav item — hover handled by .scp2 */
.pt-nav-link {
  font-size: 14px;
  font-weight: 600;
  padding: 9px 12px;
  border-radius: 8px;
  text-decoration: none;
  color: rgb(60, 74, 73);
  transition: background 0.18s, color 0.18s;
  white-space: nowrap;
}

/* ---- CTA Button nav item ----
   To turn any nav <a> into a pill button, simply change its class
   from  pt-nav-link  to  pt-nav-btn  (and swap scp2 → scp3).
   That is the ONLY change needed — no inline styles required. */
.pt-nav-btn {
  font-size: 14px;
  font-weight: 700;
  padding: 11px 18px;
  margin-left: 8px;
  border-radius: 999px;
  text-decoration: none;
  background: rgb(31, 95, 91);
  color: rgb(255, 255, 255) !important;
  transition: background 0.18s, color 0.18s;
  white-space: nowrap;
  display: inline-block;
}

/* Hamburger button — hidden on desktop */
.pt-nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  border: none;
  background: transparent;
  cursor: pointer;
  margin-left: auto;
  padding: 4px;
  border-radius: 8px;
  transition: background 0.18s;
  flex-shrink: 0;
}
.pt-nav-toggle:hover { background: rgb(232, 240, 238); }
.pt-nav-toggle span {
  display: block;
  width: 22px;
  height: 2px;
  background: rgb(22, 48, 46);
  border-radius: 2px;
  transition: transform 0.25s, opacity 0.25s, width 0.25s;
  transform-origin: center;
}
/* Animate burger → X when open */
.pt-nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.pt-nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; width: 0; }
.pt-nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---- Mobile: ≤768 px ---- */
@media (max-width: 768px) {
  /* Show hamburger, hide regular nav layout */
  .pt-nav-toggle { display: flex; }

  /* Slide-down dropdown menu */
  .pt-nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: rgba(251, 250, 247, 0.98);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgb(230, 226, 217);
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    box-shadow: 0 8px 24px rgba(22, 48, 46, 0.08);
    margin-left: 0;
    /* Collapsed state */
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    padding: 0 16px;
    transition: max-height 0.32s ease, opacity 0.22s ease, padding 0.22s ease;
  }
  /* Open state toggled by JS */
  .pt-nav.pt-nav-open {
    max-height: 600px;
    opacity: 1;
    pointer-events: auto;
    padding: 12px 16px 20px;
  }

  /* Bigger tap targets on mobile */
  .pt-nav-link {
    padding: 11px 14px;
    font-size: 15px;
    border-radius: 10px;
    display: block;
  }
  .pt-nav-btn {
    margin-left: 0;
    margin-top: 6px;
    padding: 13px 18px;
    text-align: center;
    font-size: 15px;
    border-radius: 999px;
    display: block;
  }
}

/* ===================== End Responsive Header ===================== */

/* static pages extras */
details.pt-faq-d>summary::-webkit-details-marker{display:none}
details.pt-faq-d>summary{outline:none}
details.pt-faq-d .pt-faq-icon{transition:transform .2s;display:inline-block}
details.pt-faq-d[open] .pt-faq-icon{transform:rotate(45deg)}
.pt-tcard:hover{border-color:#2f8580!important;transform:translateY(-3px);box-shadow:0 14px 30px -18px rgba(22,48,46,.35)}
[data-pt-tabset][hidden]{display:none!important}
.pt-static #pt-access{font-family:"Open Sans",sans-serif}

.pt-main p{margin:0 0 .9em}.pt-main h1,.pt-main h2,.pt-main h3{margin:0 0 .5em}

*{box-sizing:border-box}body{margin:0;font-family:"Open Sans",sans-serif;color:#3c4a49;background:#fbfaf7;line-height:1.6}h1,h2,h3,h4{font-family:Montserrat,sans-serif;margin:0;line-height:1.3}p{margin:0}a{color:#1f5f5b}a:hover{color:#16302e}img{max-width:100%}
label:has(input[type=radio]:checked){border-color:#1f5f5b!important;background:#e8f0ee}
.pt-done{background:#e8f0ee;border-radius:14px;padding:22px;color:#16302e}
[hidden]{display:none!important}
.pt-step:not([hidden]){display:grid}
