/* === CSS 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,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,main,section,article,aside,footer,header,nav,figure,figcaption {margin:0;padding:0;border:0;font:inherit;font-size:100%;vertical-align:baseline;box-sizing:border-box;}
html {box-sizing:border-box;}
*, *:before, *:after {box-sizing:inherit;}
body {line-height:1.5; background-color:#10202b; color:#eaf6fa; min-height:100vh; -webkit-font-smoothing:antialiased;}
img {max-width:100%; display:block; height:auto; border:0;}
a {color:inherit; text-decoration:none;}
ul,ol {list-style:none;}
button, input, select, textarea {font:inherit; background:none; border:none; outline:none; color:inherit;}
table {border-collapse:collapse; width:100%;}
th,td {padding:12px 16px; text-align:left;}

/* === ROOT, BRAND COLORS, FONTS === */
:root {
  --color-primary: #187085;
  --color-primary-dark: #17536a;
  --color-secondary: #F5F7FA;
  --color-accent: #F2B134;
  --color-bg: #10202b;
  --color-content: #232f3d;
  --color-card: #183145;
  --color-input: #16232e;
  --color-link: #31e1ff;
  --color-link-hover: #9df2ff;
  --color-light: #eaf6fa;
  --color-neon: #3fffd4;
  --color-shadow: rgba(30, 220, 255, .15);
}

body {
  font-family: 'Roboto', Arial, Helvetica, sans-serif;
  font-size: 16px;
  background-color: var(--color-bg);
  color: var(--color-light);
  letter-spacing:.01em;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Montserrat', 'Roboto', Arial, Helvetica, sans-serif;
  font-weight:700;
  letter-spacing:.01em;
  color: #fff;
}
h1 { font-size: 2.125rem; margin-bottom: 24px; line-height:1.15; }
h2 { font-size: 1.5rem; margin-bottom: 20px; line-height:1.22; }
h3 { font-size: 1.25rem; margin-bottom: 16px; }
h4, h5, h6 { font-size: 1rem; }
@media (min-width: 540px) { h1{font-size:2.75rem;} h2{font-size:2rem;} }
@media (min-width: 900px) { h1{font-size:3rem;} h2{font-size:2.25rem;} }

p, ul, ol, table, blockquote { margin-bottom: 18px; }
strong, b { font-weight: 700; }

/* === BASIC LAYOUT CONTAINERS === */
.container {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  padding-left: 18px;
  padding-right: 18px;
  display: flex;
  flex-direction: column;
}
.content-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.section, section {
  margin-bottom: 60px;
  padding: 40px 20px;
  background: none;
}

/* === HEADER & NAVIGATION === */
header {
  background: #121e27;
  box-shadow: 0 2px 8px 0 var(--color-shadow);
  position:sticky; top:0; z-index:98;
}
header .container {
  flex-direction:row; align-items:center; justify-content:space-between;
  min-height:70px;
  gap: 0;
}
.logo img { height:44px; width:auto; margin-right:18px; filter:drop-shadow(0 0 4px #00ffe0c9);}

.main-nav {
  display:flex;
  align-items:center;
  gap: 22px;
  z-index:99;
  transition:color 0.2s;
}
.main-nav a {
  color:#d3f9ff;
  font-family:'Montserrat',sans-serif;
  font-size:1rem;
  font-weight:500;
  padding: 6px 4px;
  position:relative;
  transition:color .20s;
}
.main-nav a::after {
  content:"";
  display:block;
  margin:6px auto 0 auto;
  width:0; height:2px;
  background:linear-gradient(90deg,var(--color-neon),var(--color-accent));
  border-radius:2px;
  transition:width .23s;
}
.main-nav a:hover, .main-nav a.active {
  color: var(--color-neon);
}
.main-nav a:hover::after, .main-nav a.active::after { width:80%; }

.primary-btn {
  display:inline-block;
  background: var(--color-accent);
  color: #10202b;
  font-weight:700;
  letter-spacing:.02em;
  border-radius: 32px;
  padding: 10px 26px;
  margin-left: 12px;
  box-shadow:0 1px 12px 0 #faefcd44,0 0 0 2px var(--color-accent);
  text-shadow: none;
  border:none;
  transition: all .22s;
  font-size:1rem;
  cursor:pointer;
  position: relative;
  overflow: hidden;
}
.primary-btn:hover, .cta-btn:hover {
  background: #ffd874;
  color: #10202b;
  box-shadow:0 0 12px 2px #ffe9bc,0 0 0 2.5px var(--color-neon);
  transform:translateY(-2px) scale(1.045);
}

/* === BURGER MENU ON MOBILE === */
.mobile-menu-toggle {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size: 2.1rem;
  color:var(--color-neon);
  background:none;
  border:none;
  cursor:pointer;
  transition:color .2s,transform .2s;
  padding: 8px;
  margin-left:16px;
  z-index:101;
}
.mobile-menu-toggle:active,
.mobile-menu-toggle:focus {
  color: var(--color-accent);
  outline: 2px solid var(--color-accent);
}

@media(min-width: 1025px) {
  .mobile-menu-toggle { display:none; }
}

.mobile-menu {
  position:fixed; left:0; top:0; bottom:0; right:0;
  background:rgba(17,30,40,.94);
  z-index: 120;
  display:none;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  transform: translateX(100%);
  transition:transform .35s cubic-bezier(.77,0,.18,1);
  box-shadow: -12px 0 50px 0px #00ffe159;
  padding-top:30px;
}
.mobile-menu.open {
  display:flex;
  transform:translateX(0%);
}
.mobile-menu-close {
  align-self: flex-end;
  background:none;
  color: var(--color-neon);
  font-size: 2rem;
  cursor: pointer;
  border-radius: 32px;
  padding: 14px 20px 6px 6px;
  margin-bottom: 8px;
  border:1px solid transparent;
  transition: color .2s, border-color .2s;
}
.mobile-menu-close:hover, .mobile-menu-close:focus {
  color: #fff97a;
  border-color: var(--color-accent);
}
.mobile-nav {
  display:flex;
  flex-direction:column;
  width:100%;
  gap:20px;
  padding:12px 30px 18px 36px;
}
.mobile-nav a {
  font-size:1.2rem;
  color:#3fffd4;
  padding:12px 0 8px 0;
  border-bottom:1px solid #183b49;
  font-family:'Montserrat',sans-serif;
  font-weight:600;
  letter-spacing:.02em;
  transition:color .2s,border .2s;
}
.mobile-nav a:hover { color:#F2B134; border-bottom:2px solid var(--color-accent); }

@media (max-width:1024px){
  .main-nav{ display:none; }
  .mobile-menu { display:flex; }
}
@media (min-width:1025px){
  .mobile-menu { display:none !important; }
  .main-nav { display:flex !important; }
}

/* === HERO & GRADIENT BACKGROUND === */
.hero {
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  background:#112430;
  background-image: linear-gradient(120deg, #141d21, #1b3a47 65%, #187085 120%);
  border-bottom: 4px solid var(--color-primary-dark);
  min-height:380px;
  margin-bottom:60px;
  box-shadow: 0 8px 56px 8px #00fde529;
}
.hero .container { align-items:center; }
.hero h1 {
  color:#fff;
  font-size:2.25rem;
  line-height:1.18;
  text-shadow:0 1px 22px #00ffe07c;
}
.hero p {
  font-size:1.09rem;
  margin-bottom:26px;
  color:#eaf6fa;
  max-width:540px;
}
.cta-btn {
  display:inline-block;
  background: var(--color-neon);
  color: #0d2839;
  font-weight:700;
  border-radius: 30px;
  padding: 14px 34px;
  box-shadow:0 1px 16px 0 #40ffd4bf, 0 0 0 2.2px var(--color-accent);
  border:none;
  font-size:1.08rem;
  letter-spacing:.03em;
  cursor:pointer;
  transition: all .21s;
  margin-top:13px;
}
.cta-link {
  color: var(--color-link);
  font-weight:500;
  letter-spacing:.02em;
  margin-top: 8px;
  position:relative;
  padding-right: 10px;
  transition: color .2s;
}
.cta-link::after {
  content:'→';
  margin-left:6px;
  font-size:.95em;
  color:var(--color-neon);
  position: absolute;
  right: 0;
  top:3px;
}
.cta-link:hover { color:var(--color-neon); }

/* === FEATURES PREVIEW (WARUM) === */
.features { background:none; }
.features .content-wrapper { padding:0; }
.feature-grid {
  display: flex; flex-wrap: wrap;
  gap:24px;
  margin-top: 18px;
  justify-content: flex-start;
}
.feature-grid li {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  min-width:196px;
  gap:14px;
  background: #183145;
  border-radius: 12px;
  box-shadow:0 2px 22px 0 var(--color-shadow);
  padding: 18px 20px;
  margin-bottom:20px;
  color:#cff7ff;
  font-size: 1.06rem;
  transition:background .18s,box-shadow .23s,transform .15s;
  border-left: 4px solid var(--color-neon);
}
.feature-grid li img {
  height:34px; width:auto;
  filter:drop-shadow(0 0 10px var(--color-neon));
}
.feature-grid li:hover {
  background: #204a62;
  box-shadow:0 5px 32px 0 #38fbbb4c;
  transform:translateY(-3px) scale(1.03);
}

/* === ABOUT PREVIEW & SECTION === */
.about-preview, .about {
  background: #1c2b3a;
  border-radius: 18px;
  box-shadow:0 2px 32px 0 var(--color-shadow);
}
.about-preview p, .about p, .why-us p { color:#d1eaff; }
.about-preview strong, .about strong { color:var(--color-accent); }

.text-section {
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:18px 0 0 0;
}

.certifications {
  display:flex; align-items:center; gap:13px;
  font-size: 1.09rem;
  margin:15px 0 6px 0;
  font-weight:500;
}
.certifications img { height:32px; width:auto; filter:drop-shadow(0 0 4px var(--color-neon)); margin-right:8px; }

/* === SERVICES PREVIEW === */
.services-preview, .services {
  background: #16222e;
  border-radius: 16px;
  box-shadow: 0 2px 24px 0 var(--color-shadow);
}
.service-list-short {
  display: flex; flex-wrap: wrap; gap: 20px; margin-top: 10px;
}
.service-list-short li {
  display:flex; align-items: center; gap: 9px;
  background: #20354a;
  color:#bbf5ff;
  border-radius:10px;
  padding:14px 19px;
  font-size:1.08rem;
  box-shadow: 0 1px 10.5px 1px #17fdff17;
  margin-bottom: 20px;
  font-weight:500;
}
.service-list-short li img {height:30px; width:auto; filter:drop-shadow(0 0 4px var(--color-neon));}

.service-tabs {
  display:flex; flex-wrap:wrap; gap:20px; margin:22px 0 12px 0;
}
.service-tabs a {
  background: #002d3d;
  color: var(--color-neon);
  padding: 11px 28px;
  border-radius: 20px;
  font-weight:600;
  box-shadow:0 2px 12px 0 #3bb09c19;
  transition: background .18s, color .17s, transform .12s;
  font-family:'Montserrat',sans-serif;
}
.service-tabs a:hover {
  background:var(--color-primary);
  color:#fff;
  transform:scale(1.07);
}

/* === SERVICE DETAILS === */
.service-details .content-wrapper {
  gap:30px;
}
.service-block {
  background: #223348;
  border-radius: 14px;
  box-shadow: 0 2px 28px 0 #22e4ff25;
  margin-bottom: 20px;
  padding: 22px 18px 22px 25px;
  border-left: 5px solid var(--color-primary);
  min-width:0;
  transition: border 0.2s;
}
.service-block:hover {
  border-left: 5px solid var(--color-neon);
}

/* === TESTIMONIALS === */
.testimonials-preview, .testimonials {
  background:#effafd;
  color:#1a222b;
  border-radius:16px;
  box-shadow:0 1.5px 18px var(--color-shadow),0 0 0 2.5px var(--color-neon);
}
.testimonial-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding: 20px 24px;
  margin-bottom:20px;
  background: #fff;
  color: #15213b;
  border-radius: 16px;
  box-shadow: 0 2px 22px 0 #aeeffd39;
  border-left: 5px solid var(--color-primary);
  font-size:1.08rem;
  transition:box-shadow .19s,border .16s,transform .14s;
}
.testimonial-card strong{
  color:var(--color-primary);
  font-weight:700;
}
.testimonial-card span{
  color:var(--color-accent);
  font-size:1.1em;
  margin-right:4px;
}
.testimonial-card:hover{
  box-shadow:0 3px 40px 0 var(--color-neon);
  border-left: 5px solid var(--color-neon);
  transform:translateY(-2px) scale(1.019);
}

/* === CTA BANNER === */
.cta-banner {
  background: linear-gradient(90deg, #17536a 35%, #187085 100%);
  border-radius: 20px;
  margin-bottom:60px;
  padding: 44px 20px 38px 20px;
  box-shadow:0 4px 42px 0 var(--color-shadow);
  text-align:center;
}
.cta-banner h2, .cta-banner p{
  color:#fff;
}
.cta-banner .cta-btn{
  margin-top:16px;
  background:var(--color-neon);
  color:#16232e;
  box-shadow:0 2px 30px 0 #00ffe05a,0 0 0 2.6px var(--color-accent);
  font-size:1.07rem;
}

/* === BLOG === */
.blog-feed .recent-posts-list {
  display: flex; flex-wrap: wrap;
  gap:24px;
  margin-top: 18px;
}
.blog-feed .recent-posts-list article {
  background:#183145;
  border-radius:14px;
  box-shadow:0 1.5px 14px 0 #9afaef23;
  padding:20px 24px;
  min-width:220px;
  flex:1 1 260px;
  color:#eaf6fa;
  margin-bottom:20px;
  position: relative;
  transition:box-shadow .18s,background .18s,transform .14s;
}
.blog-feed .recent-posts-list article:hover{
  box-shadow:0 4px 24px 5.5px var(--color-neon);
  transform:scale(1.02);
  background:#187085;
}
.popular-tags { margin:22px 0 2px 0; }
.popular-tags span {
  display:inline-block;
  margin-right:8px;
  color:#17ffd4;
  background: #234251;
  font-size:.95rem;
  padding:7px 13px;
  border-radius:38px;
  margin-bottom:11px;
  font-weight:600;
}
.popular-tags span:hover{background:var(--color-accent);color:#181f36;}

/* === PRICING TABLE AND SECTION === */
.pricing table {
  width:100%;
  background:#fff;
  color:#24374c;
  margin-bottom:28px;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 2px 16px #c2f6ff62;
}
.pricing th {
  background:var(--color-primary);
  color:#fff;
  font-size:1.1rem;
}
.pricing td {
  background: #f8fcff;
  border-bottom:1px solid #edf8ff;
  color:#21587a;
  font-weight:500;
}
.pricing tr:last-child td { border-bottom:none; }
.pricing ul li { color:#b8dce6; margin-bottom:10px; }
.pricing h3 { margin-top: 26px; color: var(--color-accent); }

/* === CONTACT PAGE === */
.contact-info, .contact-support, .map-embed {
  background: #153657;
  color: #f8fafc;
  border-radius: 13px;
  margin-bottom:20px;
  padding:18px 23px;
  box-shadow:0 1.5px 13px 0 var(--color-shadow);
  font-size:1.045rem;
}
.contact-info h3 { color: var(--color-accent); font-size:1.11rem; margin-bottom:6px; }
.map-embed img { height:44px; margin-bottom:8px; filter: drop-shadow(0 0 5px #3fffd4); }
.contact-support { background: #224a67; color: #d4faff; }
.contact-short h3 { color: var(--color-accent); margin-bottom:6px; }

/* === FOOTER === */
footer {
  background: #121e27;
  color: #d6f4ff;
  border-top:4px solid var(--color-neon);
  box-shadow:0 -2px 24px 0 #00ffe037;
  padding:30px 0 28px 0;
}
footer .container {
  flex-wrap:wrap;
  gap:32px;
  align-items:flex-start;
}
.footer-logo img {
  height:36px;
  filter:drop-shadow(0 0 5px #00ffe0a6);
  margin-bottom:18px;
}
.footer-nav {
  display:flex; flex-direction:column;
  gap:10px;
  margin-bottom:14px;
}
.footer-nav a {
  color: #3fffd4;
  font-size: .97rem;
  font-family: 'Montserrat',sans-serif;
  transition: color .18s;
  padding:3px 0 2px 0;
}
.footer-nav a:hover { color:var(--color-accent); }
.footer-contact-short {font-size:.98rem;color:#ccecf9;margin-bottom:7px;}
.footer-contact-short img {height:14px;width:auto;vertical-align:middle;margin-right:5px;}
.footer-newsletter h3 {color:var(--color-accent);margin-bottom:5px;}
.footer-newsletter p {color:#62ebe6;}
.footer-social {display:flex; gap:17px; align-items:center; margin-top:8px;}
.footer-social a img {height:28px;filter:drop-shadow(0 0 4px #0ff8fe);}
.footer-social a:hover img {filter:drop-shadow(0 0 12px #f2b134);}

/* === LEGAL PAGES === */
.privacy-policy, .cookie-policy, .terms-of-service, .dsgvo-info {
  background: #1d2e3c;
  color: #d1eaff;
  border-radius:16px;
  padding:38px 20px 32px 20px;
  margin-bottom:60px;
  box-shadow:0 1.5px 18px var(--color-shadow);
}
.privacy-policy h2, .cookie-policy h2, .terms-of-service h2, .dsgvo-info h2 { color:var(--color-neon); font-size:1.17rem; }

/* === FLEXBOX UTILS & ALIGNMENT === */
.card-container { display: flex; flex-wrap: wrap; gap: 24px; }
.card { margin-bottom: 20px; position:relative; background: #183145; border-radius:16px; box-shadow:0 1.5px 13px 0 var(--color-shadow); padding: 30px 26px; min-width:240px; transition:box-shadow .18s; }
.card:hover { box-shadow:0 4px 22px 0 var(--color-neon);}
.card-content { display:flex; flex-direction:column; justify-content:center; }
.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; }
.testimonial-card { display: flex; align-items: center; gap: 20px; padding: 20px; }
.feature-item { display: flex; flex-direction: column; align-items: flex-start; gap: 15px; }

/* === SPACING PATTERNS === */
.section { margin-bottom: 60px; padding: 40px 20px; }
.card-container { gap:24px;margin-bottom:20px; }
.card { margin-bottom:20px; }
.content-grid { gap:20px; }
.text-image-section { gap:30px; }
.testimonial-card { gap:20px; padding:20px; }
.feature-item { gap:15px; }

/* === RESPONSIVE DESIGN === */
@media (max-width:1024px) {
  .main-nav { display:none; }
  header .container { flex-direction:row; }
  footer .container { flex-direction:column; gap:28px; }
}
@media (max-width:900px) {
  .section, section { padding:30px 10px; }
  .cta-banner { padding:32px 10px; }
}
@media (max-width:768px) {
  .container { padding-left:8px; padding-right:8px; }
  .content-grid, .feature-grid, .service-list-short, .blog-feed .recent-posts-list { flex-direction:column; gap:16px; }
  .text-image-section { flex-direction:column; gap:20px; }
  .footer-nav { flex-direction:column; }
  .footer-social { margin-bottom:8px; }
  .hero{ min-height:230px;padding-top:27px; }
}
@media (max-width:470px) {
  .hero h1 { font-size: 1.24rem; }
  h2 { font-size:1.03rem; }
}

/* === BUTTON UTILITIES AND HOVERS === */
button, .primary-btn, .cta-btn {
  box-shadow:0 1.5px 10px 0 var(--color-shadow);
  transition: background .18s, color .17s, box-shadow .17s, transform .14s;
}
button:hover, .primary-btn:active, .cta-btn:active {
  transform:scale(1.04);
  box-shadow:0 4.5px 18px 2px var(--color-neon);
  filter:brightness(1.07);
}

/* MICRO-INTERACTIONS & NEON EFFECTS */
a, .primary-btn, .cta-btn {
  transition: color .19s,background .19s, box-shadow .18s,filter .13s;
}
a:focus, .primary-btn:focus, .cta-btn:focus {
  outline:2.5px solid var(--color-neon);
  outline-offset:1px;
}

/* === COOKIE CONSENT BANNER & MODAL === */
.cookie-banner {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  background: #183145;
  color: #eaf6fa;
  width:100vw;
  z-index: 199;
  box-shadow: 0 -3px 32px 0 #2ee8f825;
  display:flex;
  flex-direction: row;
  align-items:center;
  justify-content:center;
  gap:28px;
  padding:26px 20px 18px 20px;
  border-top:3px solid var(--color-neon);
  animation:cookiebanner-slidein .55s cubic-bezier(.77,0,.18,1);
}
@keyframes cookiebanner-slidein {
  from {transform:translateY(80px); opacity:.1;}
  to {transform:translateY(0); opacity:1;}
}
.cookie-banner__text {
  color:#d6f4ff;
  font-size:1.02rem;
  max-width:520px;
  flex:1 1 320px;
}
.cookie-banner__actions {
  display:flex; flex-wrap:wrap; gap:18px; align-items:center;
}
.cookie-banner button {
  background: var(--color-accent);
  color: #134053;
  border:none;
  border-radius:22px;
  padding:9px 20px;
  font-family:'Montserrat';
  font-weight:600;
  font-size:.99rem;
  margin-right:8px;
  cursor:pointer;
  box-shadow:0 1.5px 8px 0 #fcdeae42;
  transition: background .18s, color .17s,transform .15s;
}
.cookie-banner button:hover {
  background: var(--color-neon);
  color: #083c40;
  transform:translateY(-2px) scale(1.04);
}

/* Cookie Settings Modal */
.cookie-modal-backdrop {
  position:fixed; left:0; right:0; top:0; bottom:0; z-index:201;
  background:rgba(14,31,37,0.82);
  display:flex; align-items:center; justify-content:center;
  animation:cookiebackdrop-fadeIn .3s cubic-bezier(.7,0,.2,1);
}
@keyframes cookiebackdrop-fadeIn{from{opacity:0;}to{opacity:1;}}
.cookie-modal {
  background:#131e2a;
  color:#eaf6fa;
  border-radius:18px;
  max-width:440px; width:94vw;
  padding:38px 24px 24px 24px;
  z-index:202;
  box-shadow:0 2.5px 34px 6px #19fbe641;
  position:relative;
  animation: cookiemodal-slideup .43s cubic-bezier(.7,0,.21,1);
}
@keyframes cookiemodal-slideup{from{transform:translateY(60px);opacity:0;}to{transform:translateY(0);opacity:1;}}
.cookie-modal h3 {
  font-size:1.27rem; color:var(--color-accent); margin-bottom:8px;
}
.cookie-category {
  display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:15px;
}
.cookie-category label {
  font-size:.98rem; font-weight:500; color:#c6fcff;
}
.cookie-category input[type="checkbox"] {
  accent-color: var(--color-accent);
  width:19px; height:19px;
  margin-right:5px;
  border-radius:6px;
}
.cookie-modal .cookie-modal-close {
  position:absolute; top:14px; right:18px;
  background:none; border:none;
  color:var(--color-neon);
  font-size:2rem; cursor:pointer;
  padding:2px 11px;
}
.cookie-modal .cookie-modal-close:hover {
  color:var(--color-accent);
}
.cookie-modal .cookie-actions {
  margin-top:18px;
  display:flex;gap:13px;align-items:center;justify-content:flex-end;
}
.cookie-modal .cookie-actions button {
  background:var(--color-accent);color:#183145;border-radius:12px;padding:7px 20px;font-weight:600;margin:2px;font-size:.98rem;transition:background .1s,color .1s;
}
.cookie-modal .cookie-actions button:hover{background:var(--color-neon);color:#134348;}

@media(max-width:640px){
  .cookie-banner{
    flex-direction:column;
    align-items:flex-start;
    gap:13px;
    padding:19px 8px 13px 8px;
  }
  .cookie-banner__actions{gap:11px;}
  .cookie-modal{padding:21px 6px 17px 8px;}
}

/* === MODALS, OVERLAYS, AND Z-INDEXES === */
.mobile-menu, .cookie-modal-backdrop { z-index: 200+; }

/* === SCROLLBARS (THEME) === */
::-webkit-scrollbar {width:8px;background:#14232e;}
::-webkit-scrollbar-thumb {background:linear-gradient(120deg,#173549 60%,#1dfbf9 130%);border-radius:6px;}

/* === THANK-YOU PAGE === */
.thank-you {
  background: #183145;
  color: #dffaf8;
  border-radius: 20px;
  box-shadow: 0 2.5px 28px #40fff359;
  padding:38px 26px 36px 26px;
  text-align:center;
  margin-top:36px;
}
.thank-you a.cta-btn {
  margin-top:23px;
}

/* === UTILITIES === */
.neon {
  color: var(--color-neon) !important;
  text-shadow:0 0 6px #00fff2, 0 0 3.5px #075e6d;
}
.bg-card {
  background: #193448;
  border-radius: 15px;
}
.bg-dark {
  background: #111d2c;
}
.bg-accent {
  background: var(--color-accent);
  color: #16232e;
}
.flex-between {
  display: flex; justify-content: space-between; align-items:center; gap:16px;
}

/* =========== END OF STYLES ========== */