:root{
  --purple: #6D28D9;
  --purple-dark: #4C1D95;
  --purple-soft: #F3E8FF;
  --text: #111111;
  --white: #ffffff;
  --border: rgba(0,0,0,.08);
}

/* Global */
html { scroll-behavior: smooth; }
body{
  font-family: "Helvetica Nue", Helvetica, Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--text);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  line-height: 1.6;
}
a{ color: var(--purple); }
a:hover{ color: var(--purple-dark); }

h1, h2, h3, h4 {
    letter-spacing: -0.02em;
    text-align: center;
}
.cta-title
{
    text-align:left;
}
.lead {
    font-size: clamp(1.05rem, 1.35vw, 1.25rem);
    line-height: 1.6;
    max-width: 60ch;
}
/*p, li{ max-width: 70ch; }*/

.subtle{ opacity: .85; }

/* Brand */
.brand{
  display:flex;
  align-items:center;
  gap:.6rem;
  font-weight: 900;
  color: var(--text);
  text-decoration: none;
}
.brand:hover{ color: var(--text); }
.brand-badge{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--purple), var(--purple-dark));
  box-shadow: 0 10px 24px rgba(109,40,217,.25);
}

/* Tagline — always black (topbar + mobile menu), always white in footer */
.brand span,
.brand .brand-tagline {
    color: #000000 !important;
}
.site-footer .site-footer-tagline {
    color: rgba(255,255,255,.75) !important;
}

/* Top bar (sticky + shrink + glass) */
.topbar{
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 20;
  transition: box-shadow .2s ease, padding .2s ease, background .2s ease, border-color .2s ease;
  backdrop-filter: saturate(180%) blur(10px);
  background: rgba(255,255,255,.82);
}
.topbar-inner{
  padding: .85rem 0;
  transition: padding .18s ease;
}
.topbar.is-shrunk{
  border-bottom: 1px solid rgba(109,40,217,.18);
  box-shadow: 0 18px 60px rgba(0,0,0,.08);
}
.topbar.is-shrunk .topbar-inner{ padding: .55rem 0; }
.topbar.is-shrunk .brand-badge{
  width: 30px; height: 30px; border-radius: 9px;
}

/* Menu links */
.menu a {
    color: var(--text);
    /*  font-weight: 800;*/
    border-radius: 10px;
}
.menu a:hover{ color: var(--purple); }

/* Icon next to text */
.nav-link{
  display: inline-flex;
  align-items: center;
  gap: .55rem;
}
.nav-ico{
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  display: inline-block;
  opacity: .92;
}
.nav-ico svg{
  width: 20px;
  height: 20px;
  display: block;
  fill: currentColor;
}

/* Current page highlight */
a[aria-current="page"]{
  color: var(--purple-dark) !important;
  background: rgba(109,40,217,.10);
  border: 1px solid rgba(109,40,217,.18);
}
a[aria-current="page"]:hover{
  background: rgba(109,40,217,.14);
  border-color: rgba(109,40,217,.22);
}

/* Buttons */
.button{
  transition: transform .08s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
}
.button:active{ transform: translateY(1px); }

    .button.primaryish {
        background: var(--purple);
        color: var(--white);
        border-radius: 12px;
        font-weight: 600;
        padding: .9rem 1.15rem;
        box-shadow: none; /*0 18px 40px rgba(109,40,217,.22);*/
        position: relative;
        overflow: hidden;
        text-transform:uppercase;
        
    }
        .button.primaryish:hover {
            background: var(--purple-dark);
            /*box-shadow: 0 24px 60px rgba(109,40,217,.28);*/
            box-shadow: none;
        }
        .button.primaryish::after {
            content: "";
            position: absolute;
            inset: -40%;
            /*background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.45), transparent 55%);*/
            transform: translateX(-20%);
            opacity: .8;
            pointer-events: none;
        }

    .button.ghost {
        
        background: #F3E8FF;
        
        border: 1px solid var(--border);
        color: var(--text);
        border-radius: 12px;
        font-weight: 900;
        padding: .9rem 1.15rem;
        text-transform: uppercase;
    }
        .button.ghost:hover {
            border-color: rgba(109,40,217,.35);
            background-color: var(--purple);
            color: var(--white);
        }

/* ============================
   Mobile menu (off-canvas) polish
   ============================ */
.off-canvas{
  width: min(86vw, 340px);
  border-right: 1px solid rgba(0,0,0,.10);
  box-shadow: 22px 0 70px rgba(0,0,0,.18);
  border-top-right-radius: 22px;
  border-bottom-right-radius: 22px;
  overflow: hidden;
  background:
    radial-gradient(circle at 20% 12%, rgba(109,40,217,.12), transparent 55%),
    radial-gradient(circle at 80% 22%, rgba(109,40,217,.10), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,1), rgba(243,232,255,.30));
}

/* Foundation overlay behind off-canvas */
.js-off-canvas-overlay{
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(6px);
}

.off-canvas .grid-y{ height: 100%; }

.off-canvas .grid-y > .cell:first-child{
  border-bottom: 1px solid rgba(109,40,217,.14);
  background: rgba(255,255,255,.75);
  backdrop-filter: blur(10px);
  padding-top: .25rem;
  padding-bottom: .25rem;
}

.off-canvas .close-button{
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: var(--text);
}
.off-canvas .close-button:hover{
  background: rgba(109,40,217,.10);
  color: var(--purple-dark);
}

.off-canvas .vertical.menu{
  margin-top: .25rem;
  padding: .25rem .75rem 0;
}
.off-canvas .vertical.menu li{
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.off-canvas .vertical.menu li:last-child{ border-bottom: 0; }

/* Bigger, tappable, premium */
.off-canvas .vertical.menu a{
  padding: .95rem .9rem;
  border-radius: 14px;
  margin: .25rem 0;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: #444444;
  background: rgba(255,255,255,.55);
  border: 1px solid transparent;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}

/* Off-canvas bottom CTA area */
.off-canvas .grid-y > .cell:last-child{
  margin-top: auto;
  padding: .75rem 1rem 1rem;
  border-top: 1px solid rgba(109,40,217,.14);
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(10px);
}

/* Improve the mobile "Menu" button */
@media screen and (max-width: 39.9375em){
  .topbar .button.ghost{
    border-color: rgba(109,40,217,.22);
    background: rgba(255,255,255,.65);
    backdrop-filter: blur(10px);
    box-shadow: 0 14px 40px rgba(0,0,0,.08);
  }
}

/* Hero */
.hero{
  padding: clamp(2rem, 4vw, 4.5rem) 0;
  position: relative;
  overflow: hidden;
}
.hero::before{
  content:"";
  position:absolute;
  inset:-20%;
  background:
    radial-gradient(circle at 20% 20%, rgba(109,40,217,.16), transparent 55%),
    radial-gradient(circle at 80% 30%, rgba(109,40,217,.12), transparent 55%),
    radial-gradient(circle at 55% 85%, rgba(76,29,149,.10), transparent 55%);
  pointer-events:none;
}
.hero-inner{ position: relative; }
.hero-title{
  margin-top: .9rem;
  font-weight: 950;
  line-height: 1.06;
}
.hero-note{ margin-top: .75rem; }

/* Page hero (inner pages) */
.page-hero{
  padding: clamp(2rem, 4vw, 3.5rem) 0;
  border-bottom: 1px solid var(--border);
  background:
    radial-gradient(circle at 15% 15%, rgba(109,40,217,.16), transparent 55%),
    radial-gradient(circle at 85% 30%, rgba(109,40,217,.10), transparent 60%),
    linear-gradient(180deg, rgba(243,232,255,.55), rgba(255,255,255,1));
}
.page-hero h1{ margin-bottom: .5rem; font-weight: 950; }
.page-hero .lead{ margin-bottom: 0; }

/* Pills */
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  background: var(--purple-soft);
  color: var(--purple-dark);
  border: 1px solid rgba(109,40,217,.18);
  padding: .35rem .6rem;
  border-radius: 999px;
  font-weight: 900;
  font-size: .85rem;
}
.pill{
  display:inline-block;
  padding: .25rem .5rem;
  border-radius: 999px;
  background: rgba(109,40,217,.10);
  color: var(--purple-dark);
  border: 1px solid rgba(109,40,217,.18);
  font-weight: 900;
  font-size: .8rem;
}

/* Sections */
.section{ padding: clamp(2.25rem, 4vw, 4rem) 0; }
.section-title{ font-weight: 950; letter-spacing: -0.01em; }

.section-divider{
  height: 1px;
  background: var(--border);
  margin: 2rem 0;
}

.section.alt{
  background: linear-gradient(180deg, rgba(243,232,255,.55), rgba(255,255,255,1));
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.stack{
  display:flex;
  gap: .75rem;
  flex-wrap: wrap;
  align-items: center;
}

/* Cards */
.feature-card{
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 1.25rem;
  background: var(--white);
  height: 100%;
}
.feature-card,
.price-card,
.tcard{
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.feature-card:hover,
.price-card:hover,
.tcard:hover{
  transform: translateY(-4px);
  border-color: rgba(109,40,217,.25);
  box-shadow: 0 22px 70px rgba(0,0,0,.10);
}

.h4-strong{ font-weight: 950; }

.icon{
  width: 46px;
  height: 46px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(109,40,217,.12);
  border: 1px solid rgba(109,40,217,.18);
  margin-bottom: .85rem;
}
.icon svg{ width: 22px; height: 22px; fill: var(--purple-dark); }

/* Pricing */
.pricing{
  background: linear-gradient(180deg, rgba(243,232,255,.55), rgba(255,255,255,1));
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.price-card{
  border: 1px solid var(--border);
  border-radius: 20px;
  background: var(--white);
  padding: 1.5rem;
  height: 100%;
}
.price-card.featured{
  border-color: rgba(109,40,217,.35);
  box-shadow: 0 18px 55px rgba(109,40,217,.15);
  background: linear-gradient(135deg, rgba(243,232,255,.75), rgba(255,255,255,1));
}
.price{
  font-weight: 950;
  font-size: 2.1rem;
  letter-spacing: -0.02em;
}

/* Checklist */
.checklist{
  list-style: none;
  margin-left: 0;
}
.checklist li{
  display:flex;
  gap:.6rem;
  padding:.35rem 0;
  align-items:flex-start;
}
.check{
  width: 20px;
  height: 20px;
  margin-top: .2rem;
  border-radius: 6px;
  background: rgba(109,40,217,.12);
  border: 1px solid rgba(109,40,217,.18);
  flex: 0 0 auto;
  position: relative;
}
.check:after{
  content:"";
  position:absolute;
  left: 5px;
  top: 4px;
  width: 8px;
  height: 4px;
  border-left: 2px solid var(--purple-dark);
  border-bottom: 2px solid var(--purple-dark);
  transform: rotate(-45deg);
}

/* Accordion */
.accordion{
  border: 1px solid var(--border);
  border-radius: 18px;
  overflow: hidden;
  background: var(--white);
}
.accordion-title{
  color: var(--text);
  font-weight: 950;
  padding: 1rem 1.1rem;
}
.accordion-title:hover,
.accordion-title:focus{ color: var(--purple-dark); }
.accordion-content{
  border-top: 1px solid var(--border);
  background: rgba(243,232,255,.18);
}

/* Orbit / testimonials */
.orbit{ margin-top: 1rem; }
.tcard{
  border: 1px solid var(--border);
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(243,232,255,.55), rgba(255,255,255,1));
  padding: 1.35rem;
  min-height: 140px;
  box-shadow: 0 14px 40px rgba(0,0,0,.05);
}
.tquote{
  font-weight: 900;
  font-size: 1.15rem;
  margin-bottom: .75rem;
}
.orbit-bullets button{
  width: 10px;
  height: 10px;
  border-radius: 999px;
}
.orbit-bullets button.is-active{ background: var(--purple); }

/* Form polish */
input, select, textarea{
  border-radius: 14px !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  box-shadow: none !important;
  transition: border-color .18s ease, box-shadow .18s ease;
}
input:focus, select:focus, textarea:focus{
  border-color: rgba(109,40,217,.35) !important;
  box-shadow: 0 0 0 6px rgba(109,40,217,.10) !important;
}
label{ font-weight: 800; }

/* CTA */
.cta-box{
  border: 1px solid rgba(109,40,217,.25);
  background: linear-gradient(135deg, rgba(243,232,255,.9), rgba(255,255,255,1));
  border-radius: 22px;
  padding: clamp(1.2rem, 3vw, 2rem);
}

.info-box {
    border: 1px solid rgba(124,58,237,.25);
    background: linear-gradient(135deg, rgba(237,233,254,.9), rgba(255,255,255,1));
    border-radius: 22px;
    padding: clamp(1.2rem, 3vw, 2rem);
}

.cta-title{ font-weight: 950; margin-bottom: .35rem; }

/* Footer */
footer{
  border-top: 1px solid var(--border);
  padding: 1.6rem 0;
}

/* ============================
   Site Footer — all styles scoped to .site-footer
   ============================ */
.site-footer {
    background: linear-gradient(180deg, #1A1525, #0E0B12);
    padding: 0 0 2rem;
    border-top: none;
}

/* Gradient divider line at top */
.site-footer::before {
    content: "";
    display: block;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(124,37,132,.6), var(--purple), rgba(124,37,132,.6), transparent);
    margin-bottom: 2.5rem;
}

/* Brand inside footer */
.site-footer .site-footer-brand {
    display: flex;
    align-items: center;
    gap: .6rem;
    text-decoration: none;
    font-weight: 900;
    color: rgba(255,255,255,.9);
}
.site-footer .site-footer-brand:hover {
    color: rgba(255,255,255,1);
}
.site-footer .site-footer-brand img {
    height: 70px;
}

/* Tagline */
.site-footer .site-footer-tagline {
    color: rgba(255,255,255,.75) !important;
    font-weight: 700;
    font-size: .95rem;
    margin-top: .4rem;
}

/* Copyright / small text */
.site-footer .site-footer-copy {
    margin-top: 1.25rem;
    font-size: .8rem;
    color: rgba(255,255,255,.35);
    line-height: 1.6;
}

/* Column headings */
.site-footer .site-footer-heading {
    color: rgba(255,255,255,.5);
    font-weight: 700;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: .75rem;
    text-align: left;
}

/* Link list */
.site-footer .site-footer-links {
    list-style: none;
    margin: 0;
    padding: 0;
}
.site-footer .site-footer-links li {
    margin-bottom: .35rem;
}
.site-footer .site-footer-links a {
    color: rgba(255,255,255,.6);
    text-decoration: none;
    font-weight: 400;
    font-size: .9rem;
    transition: color .2s ease;
}
.site-footer .site-footer-links a:hover,
.site-footer .site-footer-links a:focus {
    color: #ffffff;
    text-decoration: none;
}


/* Reveal animation */
.reveal-up{
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .5s ease, transform .5s ease;
}
.reveal-up.is-visible{
  opacity: 1;
  transform: translateY(0);
}

/* Nudge nav icons down slightly (they sit ~2px high by default) */
.nav-ico{
  position: relative;
  top: 4px;
  padding-right:2px;
}

/* Optional: keep SVG itself perfectly centered too */
.nav-ico svg{
  display: block;
}

.h4-strong .feature-cardcenter {
    text-align: center;
}

footer  a
{
    color:white;
}

/* Footer link colors */
footer a,
footer a:visited,
footer .menu a,
footer a.nav-link {
  color: #ffffff;
  text-decoration: none;
  font-weight:normal;
}

    footer a:hover,
    footer a:focus,
    footer .menu a:hover,
    footer .menu a:focus,
    footer a.nav-link:hover,
    footer a.nav-link:focus {
        color: #ffffff;
        text-decoration: underline;
        font-weight: normal;
    }

.brands img {
    max-height: auto;
    width: 320px;
    aspect-ratio: 4/2;
    object-fit: contain;
    mix-blend-mode: color-burn;
    padding-left: 30px;
    padding-right: 30px;
    vertical-align: middle;
}
.brands img {
    vertical-align: middle !important;
}

.frontPageMainBox {
    border-radius: 18px;
    border-bottom: 5px solid #7C2584;
    border-top: 5px solid #7C2584;
    width: 100%;
    height: 60%;
    min-height: 400px;
    background-color: white;
    background-repeat: no-repeat;
    background-size: cover;
}

.frontPageBoxWithShadow {
    border-radius: 18px;
    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
    padding: 20px;
    background-color: white;
    box-shadow: initial;
    position: relative;
    top: -40px;
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
    text-align: center;
}

.moreInfoButton {
    margin-top: 10px;
    font-size: 1.2em;
    margin-bottom: 20px;
    border-radius: 18px;
}

.websiteThumb
{
    width:50%;
    margin-left:auto;
    margin-right:auto;
    display:flex;
}


/* Mobile Devices */
@media all and (max-width:720px) /* Small Screens */
{
    .websiteThumb {
        width:98%;
    }
}

.websiteThumbNails h4 {
    margin-top: 20px;
    text-align: center;
    color: black;
}

#zoom1
{
    z-index:999;
    overflow:hidden;
}

/* these styles are for the demo, but are not required for the plugin */
.zoom {
    display: inline-block;
    position: relative;
    background-color: white;
}

    /* magnifying glass icon */
    .zoom:after {
        content: '';
        display: block;
        width: 33px;
        height: 33px;
        position: absolute;
        top: 0;
        right: 0;
        background: url('/Scripts/icon.png');
        background-color:white;
    }

    .zoom img {
        display: block;
    }

        .zoom img::selection {
            background-color: white;
        }


.parksLogo
{    
    height:150px;
    width:auto;
    padding:10px;
    margin:20px;
}

/* Fix Font Awesome icons inside flex nav links */
.nav-link .fa {
    flex: 0 0 auto;
    font-style: normal;
    line-height: 1;
    width: auto;
    min-width: 1em;
}

.avatar {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    object-fit: cover;
}

.imageCard {
    width: 100%;
    aspect-ratio: 1 / 1; /* makes them perfect squares */
    overflow: hidden;
 
}

.imageCard img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px; /* optional */
}
.accordion-title
{
    font-size:1em;
}

/* Partners — grayscale with hover reveal */
/*.brands img {
    filter: grayscale(100%) opacity(.55);
    transition: filter .25s cubic-bezier(.4,0,.2,1), transform .25s cubic-bezier(.4,0,.2,1);
}

.brands img:hover {
    filter: grayscale(0%) opacity(1);
    transform: scale(1.05);
}
*/

/* Footer mobile — center everything */
@media screen and (max-width: 39.9375em) {
    .site-footer .site-footer-brand {
        justify-content: center;
    }
    .site-footer .site-footer-copy {
        text-align: center;
    }
    .site-footer .site-footer-heading {
        text-align: center;
        margin-top: 1.5rem;
    }
    .site-footer .site-footer-links {
        text-align: center;
    }
    .site-footer .cell[style*="text-align:right"] {
        text-align: center !important;
        margin-top: 1.5rem;
    }
}

/* Contact form validation errors */
.contact-validation-error {
    display: block;
    color: #cc4b37;
    font-size: .85rem;
    font-weight: 600;
    margin-top: .25rem;
    margin-bottom: .5rem;
}

.callout.alert 
{
    color:yellow;
    background-color:black;
    border-radius:12px;
}

/* Tablet portrait (iPad) — stack logo above nav */
@media screen and (min-width: 640px) and (max-width: 1023px) {
    .topbar-inner {
        flex-wrap: wrap;
        justify-content: center;
    }

        /* Logo row — full width, centred */
        .topbar-inner > .cell.auto {
            flex: 0 0 100%;
            max-width: 100%;
            text-align: center;
            padding-bottom: .3rem;
        }

            .topbar-inner > .cell.auto .brand {
                justify-content: center;
            }

        /* Nav links row — centred beneath logo */
        .topbar-inner > .cell.shrink.show-for-medium {
            flex: 0 1 auto;
        }

            .topbar-inner > .cell.shrink.show-for-medium .menu {
                justify-content: center;
                flex-wrap: wrap;
            }

                .topbar-inner > .cell.shrink.show-for-medium .menu a {
                    font-size: .85rem;
                    padding: .4rem .55rem;
                }

        /* Shrink logo slightly on tablet */
        .topbar-inner .brand img {
            height: 55px;
        }

    .brand-tagline {
        font-size: .7rem;
    }
}