/* RESET & NORMALIZE */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, main, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  box-sizing: border-box;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section {
  display: block;
}
body {
  line-height: 1.6;
  background: #19212c;
  color: #eef5fa;
  font-family: 'Open Sans', Arial, sans-serif;
  min-height: 100vh;
  font-size: 16px;
  scroll-behavior: smooth;
}

/* BRAND FONTS */
h1, h2, h3, h4, h5, h6, .btn-primary, nav a, .mobile-nav a, .section-title {
  font-family: 'Montserrat', Arial, Helvetica, sans-serif;
}
p, ul, ol, li, td, th, label, input, textarea {
  font-family: 'Open Sans', Arial, Helvetica, sans-serif;
}

/* COLORS */
:root {
  --sb-primary: #255066;
  --sb-secondary: #41A5C2;
  --sb-accent: #F5F7F9;
  --sb-dark-bg: #161B23;
  --sb-light-bg: #F5F7F9;
  --sb-card-bg: #212C38;
  --sb-card-overlay: #264460;
  --sb-text: #F5F7F9;
  --sb-text-dark: #1d232c;
  --sb-focus: #41A5C2;
  --sb-neon: #09ffe3;
  --sb-shadow: 0 2px 24px 0 rgba(65,165,194,.15);
  --sb-radius: 14px;
}

/* GENERAL LAYOUT CONTAINERS */
.container {
  width: 100%;
  max-width: 1150px;
  margin: 0 auto;
  padding: 0 18px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.content-wrapper {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.section {
  margin-bottom: 60px;
  padding: 40px 20px;
}

/* HEADER */
header {
  background: linear-gradient(100deg, #183242 70%, #255066 100%);
  box-shadow: 0 2px 16px rgba(36,85,120, 0.09);
  z-index: 1000;
  position: relative;
}
header > .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px 18px 18px 18px;
}
header nav {
  display: flex;
  gap: 24px;
  align-items: center;
}
header nav a {
  color: var(--sb-text);
  text-decoration: none;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.04em;
  transition: color 0.18s;
  position: relative;
}
header nav a:after {
  content: '';
  display: block;
  height: 2px;
  width: 0;
  background: var(--sb-neon);
  transition: width 0.18s;
  position: absolute;
  left: 0; bottom: -4px;
  border-radius: 3px;
}
header nav a:hover, header nav a:focus {
  color: var(--sb-neon);
}
header nav a:hover:after, header nav a:focus:after {
  width: 100%;
}
header .btn-primary {
  margin-left: 12px;
}
/* Mobile Burger */
.mobile-menu-toggle {
  display: none;
  background: none;
  border: none;
  color: var(--sb-neon);
  font-size: 2.2rem;
  margin-left: auto;
  cursor: pointer;
  transition: color 0.2s;
  z-index: 1200;
}
.mobile-menu-toggle:focus {
  outline: 2px solid var(--sb-neon);
}
/* Mobile Menu */
.mobile-menu {
  display: none;
  position: fixed;
  top: 0; left: 100vw;
  height: 100vh;
  width: 100vw;
  background: linear-gradient(100deg, #192531 85%, #41A5C2 130%);
  box-shadow: 0 16px 64px rgba(31,107,146,0.25);
  z-index: 2000;
  flex-direction: column;
  transition: transform 0.38s cubic-bezier(.91,.01,.67,1.07), left 0.08s;
  padding: 0;
}
.mobile-menu.open {
  display: flex;
  left: 0;
  transform: translateX(0%);
}
.mobile-menu-close {
  align-self: flex-end;
  background: none;
  border: none;
  color: var(--sb-neon);
  font-size: 2.4rem;
  margin: 28px 28px 14px 0;
  cursor: pointer;
  transition: color .18s;
}
.mobile-nav {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 32px 36px 0 36px;
  gap: 24px;
  margin-top: 30px;
}
.mobile-nav a {
  color: var(--sb-text);
  font-size: 1.25rem;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: 0.04em;
  transition: color 0.2s;
  padding: 8px 0;
  border-radius: 7px;
}
.mobile-nav a:hover, .mobile-nav a:focus {
  color: var(--sb-neon);
  background: rgba(41,165,194, 0.11);
}

@media (max-width: 992px) {
  header > .container nav {
    display: none;
  }
  .mobile-menu-toggle {
    display: block;
  }
}
@media (max-width: 768px) {
  header > .container img {
    max-width: 108px;
  }
  .btn-primary {
    font-size: 18px;
    padding: 12px 28px;
  }
}

/* HERO, CTA, AND SECTION HEADINGS */
.hero, .cta, .resources-hero, .contact-hero, .blog-hero, .solutions-hero {
  background: linear-gradient(100deg, #255066 65%, #41A5C2 100%);
  color: var(--sb-accent);
  padding: 60px 0 54px 0;
  text-align: left;
}
.hero h1, .cta h2, .resources-hero h1, .contact-hero h1, .blog-hero h1, .solutions-hero h1 {
  font-size: 2.6rem;
  color: var(--sb-accent);
  font-weight: 800;
  letter-spacing: 0.02em;
  margin-bottom: 10px;
}
.hero p, .cta p, .resources-hero p, .contact-hero p, .blog-hero p, .solutions-hero p {
  font-size: 1.22rem;
  color: var(--sb-accent);
  margin-bottom: 18px;
}
@media (max-width: 768px) {
  .hero, .cta, .resources-hero, .contact-hero, .blog-hero, .solutions-hero {
    padding: 40px 0 34px 0;
  }
  .hero h1, .cta h2, .resources-hero h1, .contact-hero h1, .blog-hero h1, .solutions-hero h1 {
    font-size: 2rem;
  }
}

/* BUTTONS */
.btn-primary {
  display: inline-block;
  padding: 14px 36px;
  font-family: 'Montserrat', Arial, sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: var(--sb-primary);
  background: var(--sb-neon);
  border: none;
  border-radius: var(--sb-radius);
  cursor: pointer;
  box-shadow: 0 4px 32px rgba(9,255,227,0.12);
  transition: background 0.16s, color 0.14s, box-shadow 0.2s, transform 0.13s;
  letter-spacing: 0.04em;
  margin-top: 8px;
  margin-bottom: 8px;
  text-decoration: none;
}
.btn-primary:hover, .btn-primary:focus {
  background: #90ffe3;
  color: #183242;
  box-shadow: 0 4px 16px var(--sb-neon), 0 2px 24px #41A5C2;
  outline: none;
  transform: translateY(-2px) scale(1.03);
}

/* SECTION STYLES & SPACING */
.features, .services, .platform-list, .downloadables, .blog-list, .workflow-integration, .sector-solutions, .values, .team, .achievements, .faq, .resources-hero, .legal, .confirmation, .contact-info, .location {
  padding: 40px 0 40px 0;
  background: linear-gradient(120deg, #183242 90%, #1e7fa4 130%);
}
.features > .container, .services > .container, .platform-list > .container, .values > .container, .team > .container, .achievements > .container, .downloadables > .container, .blog-list > .container, .workflow-integration > .container, .sector-solutions > .container, .faq > .container, .legal > .container, .confirmation > .container, .contact-info > .container, .location > .container  {
  padding: 0 8px;
}
.section-title, .content-wrapper h2 {
  font-size: 2.1rem;
  font-weight: 700;
  color: var(--sb-neon);
  letter-spacing: 0.04em;
  margin-bottom: 1.5rem;
}

/* FEATURE CARDS AND FLEX GRIDS */
.feature-grid, .service-list, .download-grid, .platform-overview-cards, .value-cards, .team-bios, .industry-tabs, .blog-post-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin-bottom: 24px;
  justify-content: space-between;
}
.feature-grid > div, .service-list > div, .download-grid > div, .platform-overview-cards > div, .value-cards > div, .team-bios > div, .industry-tabs > .industry-card, .blog-post-cards > div {
  background: var(--sb-card-bg);
  border-radius: var(--sb-radius);
  box-shadow: 0 2px 24px 0 rgba(65,165,194,0.13);
  padding: 38px 28px 32px 28px;
  min-width: 260px;
  flex: 1 1 270px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  border: 1.5px solid #22384a;
  transition: border-color 0.17s, box-shadow 0.17s, transform 0.2s;
  margin-bottom: 20px;
  position: relative;
  z-index: 1;
}
.feature-grid > div:hover, .service-list > div:hover, .download-grid > div:hover, .platform-overview-cards > div:hover, .value-cards > div:hover, .team-bios > div:hover, .industry-tabs > .industry-card:hover, .blog-post-cards > div:hover {
  border-color: var(--sb-neon);
  box-shadow: 0 0 24px 3px var(--sb-neon), 0 2px 24px #41A5C2;
  transform: translateY(-2px) scale(1.03);
}
.feature-grid img, .service-list img, .download-grid img, .platform-overview-cards img, .value-cards img, .industry-card img {
  width: 49px;
  height: 49px;
  object-fit: contain;
}
.feature-grid h3, .service-list h3, .download-grid h3, .platform-overview-cards h3, .value-cards h3, .industry-tabs h3, .team-bios h3, .blog-post-cards h3 {
  color: var(--sb-neon);
  font-size: 1.17rem;
  font-weight: 700;
  margin-bottom: 3px;
}
.feature-grid p, .service-list p, .download-grid p, .platform-overview-cards p, .value-cards p, .industry-tabs p, .team-bios p, .blog-post-cards p {
  color: #e1f6ff;
  font-size: 1rem;
  line-height: 1.7;
}
.service-list > div a, .download-grid > div a, .platform-overview-cards > div a, .team-bios > div a, .blog-post-cards > div a {
  color: var(--sb-neon);
  font-weight: 600;
  font-size: 1rem;
  text-decoration: underline;
  margin-top: 10px;
  transition: color 0.18s;
}
.service-list > div a:hover, .download-grid > div a:hover, .platform-overview-cards > div a:hover, .team-bios > div a:hover, .blog-post-cards > div a:hover {
  color: #fafcff;
}

@media(max-width: 1099px) {
  .feature-grid, .service-list, .download-grid, .platform-overview-cards, .value-cards, .team-bios, .industry-tabs, .blog-post-cards {
    flex-wrap: wrap;
    gap: 18px;
  }
  .feature-grid > div, .service-list > div, .download-grid > div, .platform-overview-cards > div, .value-cards > div, .team-bios > div, .industry-tabs > .industry-card, .blog-post-cards > div {
    min-width: 190px;
    flex: 1 1 220px;
  }
}
@media(max-width: 768px) {
  .feature-grid, .service-list, .download-grid, .platform-overview-cards, .value-cards, .team-bios, .industry-tabs, .blog-post-cards {
    flex-direction: column;
    align-items: stretch;
    gap: 18px;
  }
  .feature-grid > div, .service-list > div, .download-grid > div, .platform-overview-cards > div, .value-cards > div, .team-bios > div, .industry-tabs > .industry-card, .blog-post-cards > div {
    min-width: 0;
  }
}

/* CARD-LIKE FLEX CONTAINERS */
.card-container {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.card {
  background: var(--sb-card-bg);
  border-radius: var(--sb-radius);
  box-shadow: var(--sb-shadow);
  padding: 32px;
  transition: box-shadow 0.18s, transform 0.16s;
  margin-bottom: 20px;
  position: relative;
}
.card:hover {
  box-shadow: 0 0 18px 2px var(--sb-neon), 0 4px 24px #41A5C2;
  transform: scale(1.03) translateY(-2px);
}

/* SECTION FLEX PATTERNS */
.section {
  margin-bottom: 60px;
  padding: 40px 20px;
}
.content-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: space-between;
}
.text-image-section {
  display: flex;
  align-items: center;
  gap: 30px;
  flex-wrap: wrap;
}
@media (max-width: 768px) {
  .text-image-section {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 20px;
  }
  .content-grid {
    flex-direction: column;
    gap: 18px;
  }
}

/*******************
 TESTIMONIALS & CARDS
********************/
.testimonials {
  padding: 40px 0 40px 0;
  background: linear-gradient(120deg, #fff 55%, #daf8fa 100%);
}
.testimonials > .container > .content-wrapper > h2 {
  color: var(--sb-primary);
}
.testimonial-card {
  background: #fff;
  color: #184159;
  border-radius: var(--sb-radius);
  box-shadow: 0 2px 16px rgba(65,165,194,0.16);
  border: 1.5px solid #c7eaff;
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px;
  margin-bottom: 20px;
  position: relative;
  transition: box-shadow 0.16s, border-color 0.16s;
}
.testimonial-card:hover {
  box-shadow: 0 0 32px 3px var(--sb-secondary), 0 6px 30px #41A5C2;
  border-color: var(--sb-secondary);
}
.testimonial-card p {
  font-size: 1.11rem;
  color: #174057;
  margin-bottom: 0;
}
.testimonial-author {
  font-size: 1rem;
  color: #0a3b5a;
  font-weight: 600;
  letter-spacing: 0.01em;
  margin-left: 6px;
}
.client-logos {
  display: flex;
  align-items: center;
  gap: 34px;
  margin: 18px 0 0 0;
  flex-wrap: wrap;
}
.client-logos img {
  width: 46px;
  height: auto;
  opacity: 0.85;
  filter: grayscale(0.2);
  transition: filter 0.19s, opacity .19s;
}
.client-logos img:hover { opacity: 1; filter: grayscale(0);} 
@media(max-width: 768px) {
  .testimonials {
    padding: 30px 0;
  }
  .testimonial-card {
    flex-direction: column;
    align-items: flex-start;
    padding: 20px 14px;
    gap: 14px;
  }
  .client-logos {
    gap: 18px;
  }
}

/*******************
 VALUE CARDS, TEAM BIOS
********************/
.value-cards, .team-bios,.achievement-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin-bottom: 24px;
  justify-content: space-between;
}
.value-cards > div, .team-bios > div {
  background: var(--sb-card-bg);
  border-radius: var(--sb-radius);
  box-shadow: var(--sb-shadow);
  padding: 34px 26px 28px 26px;
  min-width: 240px;
  flex: 1 1 250px;
  margin-bottom: 20px;
  transition: border-color 0.2s, box-shadow 0.18s, transform 0.19s;
  border: 1.5px solid #213752;
  position: relative;
}
.value-cards > div:hover, .team-bios > div:hover {
  border-color: var(--sb-neon);
  box-shadow: 0 0 20px 4px var(--sb-neon), 0 4px 24px #41A5C2;
  transform: translateY(-3px) scale(1.03);
}
.value-cards h3, .team-bios h3 {
  color: var(--sb-neon);
  font-size: 1.15rem;
  font-weight: 700;
}
.value-cards p, .team-bios p {
  color: #b7e8fc;
  font-size: 1rem;
}
.team-bios a {
  color: var(--sb-neon);
  text-decoration: underline;
  font-weight: 600;
  margin-top: 7px;
  transition: color .18s;
}
.team-bios a:hover {color: #fff;}

/*******************
 TABLE (for comparison)
********************/
.comparison-table {
  overflow-x: auto;
  background: var(--sb-card-bg);
  padding: 30px 18px;
  border-radius: var(--sb-radius);
  margin-bottom: 26px;
  box-shadow: var(--sb-shadow);
}
.comparison-table table {
  border-collapse: collapse;
  width: 100%;
  background: transparent;
  color: var(--sb-text);
  font-size: 1rem;
}
.comparison-table th, .comparison-table td {
  border: 1.5px solid #456f81;
  padding: 13px 12px;
  text-align: center;
}
.comparison-table th {
  color: var(--sb-neon);
  font-weight: 700;
  background: #283e50;
  border-bottom: 2px solid #41A5C2;
}
.comparison-table tr:nth-child(even) {
  background: #223648;
}
.comparison-table tr:hover {
  background: #234267;
  color: var(--sb-neon);
}
@media(max-width: 570px) {
  .comparison-table table, .comparison-table th, .comparison-table td {
    font-size: 0.92rem;
  }
}

/********************
 TEXT SECTIONS, LISTS
********************/
.text-section {
  display: flex;
  flex-direction: column;
  gap: 20px;
  color: var(--sb-text);
  margin-top: 8px;
  margin-bottom: 24px;
}
.text-section p, .text-section ul, .text-section li {
  font-size: 1.07rem;
  line-height: 1.7;
  color: #d4ebf9;
}
.text-section ul, .toolkit-list ul, .platform-highlight-features ul, .faq-accordion {
  list-style: disc inside;
  margin-left: 18px;
  padding-left: 0;
}
.text-section li, .toolkit-list li, .platform-highlight-features li {
  padding-bottom: 8px;
}

/********************
 FAQ ACCORDION
********************/
.faq-accordion {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.faq-accordion > div {
  background: var(--sb-card-bg);
  border-radius: var(--sb-radius);
  padding: 26px 18px;
  box-shadow: var(--sb-shadow);
  border: 1px solid #2e4469;
  margin-bottom: 13px;
  transition: box-shadow .14s, border .14s;
}
.faq-accordion > div:hover {
  box-shadow: 0 0 18px 2px var(--sb-neon), 0 4px 24px #41A5C2;
  border: 1.5px solid var(--sb-neon);
}
.faq-accordion h3 {
  font-size: 1.09rem;
  color: var(--sb-neon);
  margin-bottom: 3px;
}
.faq-accordion p {
  color: #cbf1fe;
}

/********************
 BLOG LAYOUTS
********************/
.blog-post-cards > div {
  border-left: 3.5px solid var(--sb-neon);
}
.blog-search {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}
.blog-search label {
  color: var(--sb-neon);
  font-weight: 600;
}
.blog-search input {
  font-size: 1.1rem;
  padding: 10px 13px;
  border: 1.5px solid #286788;
  border-radius: 8px;
  background: #1a2431;
  color: var(--sb-text);
  outline: none;
  transition: border-color 0.17s;
  margin-left: 5px;
}
.blog-search input:focus {
  border-color: var(--sb-neon);
}
.categories {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px 18px;
  margin-top: 20px;
}
.categories span {
  font-weight: 700;
  color: var(--sb-secondary);
  letter-spacing: 0.04em;
}
.categories a {
  color: var(--sb-neon);
  text-decoration: none;
  border-bottom: 2px dotted #41A5C2;
  transition: color .16s;
  font-weight: 500;
}
.categories a:hover {
  color: #fff;
  border-bottom: 2px solid var(--sb-neon);
}

/********************
 FEATURED BLOG POST
********************/
.featured-blog .highlighted-post {
  background: #14345d;
  padding: 28px 18px;
  border-radius: var(--sb-radius);
  color: var(--sb-accent);
  box-shadow: 0 2px 16px #25506660;
  border-left: 5px solid var(--sb-neon);
  margin-bottom: 20px;
}
.author-bio {
  display: flex;
  align-items: center;
  gap: 16px;
  color: #dafbff;
}
.author-bio img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
}

/*******************
 FOOTER
********************/
footer {
  background: #192531;
  color: #b8dbf5;
  border-top: 2.5px solid var(--sb-primary);
  padding: 40px 0 32px 0;
  margin-top: 60px;
}
footer > .container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 36px;
  flex-wrap: wrap;
}
footer nav {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
footer nav a {
  color: var(--sb-neon);
  text-decoration: none;
  font-size: 1.01rem;
  font-weight: 600;
  transition: color 0.17s;
}
footer nav a:hover{
  color: var(--sb-secondary);
}
.footer-contact {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  font-size: 15px;
  color: #b3cee7;
}
.footer-contact address {
  font-style: normal;
  color: #e8f1f9;
  margin-bottom: 4px;
}
.footer-contact img[alt="ShimmerBridge"] {
  width: 90px;
  margin-bottom: 12px;
}
.footer-contact img {
  width: 18px;
  height: 18px;
  vertical-align: sub;
  margin-right: 7px;
  opacity: 0.73; 
}
@media(max-width: 950px) {
  footer > .container {
    flex-direction: column;
    gap: 18px;
    align-items: flex-start;
  }
}

/*******************
 COOKIE CONSENT BANNER
********************/
.cookie-banner {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 3500;
  background: #1a283c;
  color: var(--sb-accent);
  border-top: 2px solid var(--sb-neon);
  box-shadow: 0 -4px 18px #41A5C2BB;
  padding: 24px 20px 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 13px;
  align-items: flex-start;
  animation: slideUpBanner 0.6s cubic-bezier(.56,1.74,.28,.71);
}
@keyframes slideUpBanner {
  from { transform: translateY(100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
.cookie-banner .cookie-banner-actions {
  display: flex;
  flex-direction: row;
  gap: 14px;
  margin-top: 7px;
  flex-wrap: wrap;
}
.cookie-banner .btn-cookie {
  font-family: 'Montserrat', Arial, sans-serif;
  font-size: 1rem;
  font-weight: 600;
  padding: 9px 22px;
  background: var(--sb-neon);
  color: var(--sb-primary);
  border: none;
  border-radius: 7px;
  cursor: pointer;
  transition: background 0.15s, color 0.14s, box-shadow 0.19s;
  margin-right: 8px;
  box-shadow: 0 0 12px 0 var(--sb-neon, #00ffe3)44;
}
.cookie-banner .btn-cookie:hover, .cookie-banner .btn-cookie:focus {
  background: #41A5C2;
  color: #fff;
  box-shadow: 0 0 14px 2px #41A5C2, 0 4px 22px #25506677;
}
.cookie-banner .btn-settings {
  background: none;
  border: 2px solid var(--sb-neon);
  color: var(--sb-neon);
}
.cookie-banner .btn-settings:hover, .cookie-banner .btn-settings:focus {
  background: var(--sb-neon);
  color: var(--sb-dark-bg);
  border-color: #0c7570;
}
@media(max-width: 520px) {
  .cookie-banner {
    padding: 14px 8px 12px 8px;
    font-size: 0.95em;
  }
}

/*******************
 COOKIE MODAL
********************/
.cookie-modal-overlay {
  position: fixed;
  top: 0; left: 0;
  width: 100vw; height: 100vh;
  background: rgba(30,60,80,0.81);
  z-index: 4000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cookie-modal {
  background: #202a33;
  color: var(--sb-accent);
  border-radius: 16px;
  max-width: 400px;
  width: 95%;
  padding: 34px 22px 24px 22px;
  box-shadow: 0 0 36px 8px var(--sb-neon), 0 4px 32px #41A5C2AA;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
  animation: fadeInCookieModal 0.36s cubic-bezier(.15,.79,.52,1.39);
}
@keyframes fadeInCookieModal {
  from { transform: translateY(60px) scale(0.95); opacity: 0; }
  to { transform: translateY(0) scale(1); opacity: 1; }
}
.cookie-modal h3 {
  font-size: 1.32rem;
  color: var(--sb-neon);
  font-weight: 700;
}
.cookie-modal ul {
  list-style: none;
  padding: 0;
}
.cookie-modal li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}
.cookie-modal .toggle {
  width: 48px;
  height: 24px;
  background: #253f59;
  border-radius: 12px;
  position: relative;
  cursor: pointer;
  transition: background 0.16s;
  flex-shrink: 0;
}
.cookie-modal .toggle[data-enabled="true"] {
  background: var(--sb-neon);
}
.cookie-modal .toggle-knob {
  position: absolute;
  left: 2px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 4px #0002;
  transition: left 0.2s, background 0.14s;
}
.cookie-modal .toggle[data-enabled="true"] .toggle-knob {
  left: 24px;
  background: var(--sb-primary);
}
.cookie-modal p {
  margin-bottom: 0;
  color: #defbff;
}
.cookie-modal .cookie-modal-actions {
  display: flex;
  flex-direction: row;
  gap: 16px;
  justify-content: flex-end;
  margin-top: 13px;
}
.cookie-modal .btn-cookie {
  padding: 10px 20px;
  font-size: 1rem;
  border-radius: 7px;
}
.cookie-modal .btn-close-modal {
  position: absolute;
  top: 18px; right: 18px;
  background: none;
  border: none;
  color: var(--sb-neon);
  font-size: 1.75rem;
  cursor: pointer;
  padding: 0;
  outline: none;
  line-height: 1;
}
.cookie-modal .btn-close-modal:focus { outline:2px solid var(--sb-neon); }

/*******************
 LEGAL PAGES
*******************/
.legal {
  background: linear-gradient(120deg, #183242 85%, #1e7fa4 120%);
  color: #e5f3f8;
  padding-top: 34px; padding-bottom: 34px;
}
.legal h1, .legal h2, .legal h3 {
  color: var(--sb-neon);
}
.legal h1 {
  font-size: 2.24rem; margin-bottom: 18px;
}
.legal h2 {
  font-size: 1.34rem; margin-top: 26px; margin-bottom: 10px;
}
.legal h3 {
  font-size: 1.13rem; margin-top: 18px; margin-bottom: 5px;
}
.legal ul {
  margin-left: 24px; margin-bottom: 16px;
}
.legal li {margin-bottom: 8px;}

/*******************
 CONTACT PAGE
*******************/
.contact-info .text-section > div {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.12rem;
}
.contact-info img {
  width: 22px;
  height: 22px;
  opacity: 0.66;
}

/**********************
 RESPONSIVE TUNING
**********************/
@media(max-width: 675px) {
  .container {
    max-width: 99vw;
    padding: 0 7px;
  }
  .content-wrapper {
    gap: 16px;
  }
}
@media(max-width: 430px) {
  .btn-primary {
    font-size: 1rem;
    padding: 12px 12px;
  }
  .footer-contact address, .footer-contact div {
    font-size: 0.92rem;
  }
}

/*******************
 GENERAL UTILITIES
*******************/
::-webkit-input-placeholder {color: #b4e8f4; opacity:0.8;}
::-moz-placeholder {color: #b4e8f4; opacity:0.8;}
:-ms-input-placeholder {color: #b4e8f4; opacity:0.8;}
::placeholder {color: #b4e8f4; opacity:0.8;}

/* Hide scrollbars on mobile menu and modal */
.mobile-menu, .cookie-modal-overlay {overflow-y: auto; -webkit-overflow-scrolling: touch;}

/*******************
 MICRO-INTERACTIONS
*******************/
a, .btn-primary, .btn-cookie, .toggle {
  outline: none;
  transition: color 0.18s, background 0.15s, border 0.14s, box-shadow 0.17s, transform 0.13s !important;
}
a:focus, .btn-primary:focus, .btn-cookie:focus, .toggle:focus {
  box-shadow: 0 0 0 2px var(--sb-neon);
}

/*******************
 ACCESSIBILITY FINE TUNING
*******************/
@media (prefers-reduced-motion: reduce) {
  * {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}