/* =========================================
   WMH – Design System v2.0 – Premium
   ========================================= */
/* =========================================
   LOCAL FONTS (kein Google-Fonts-Request)
   ========================================= */
@font-face { font-family:'Barlow Condensed'; font-style:normal; font-weight:400; font-display:swap; src:url('fonts/barlow-condensed-400.woff2') format('woff2'); }
@font-face { font-family:'Barlow Condensed'; font-style:normal; font-weight:600; font-display:swap; src:url('fonts/barlow-condensed-600.woff2') format('woff2'); }
@font-face { font-family:'Barlow Condensed'; font-style:normal; font-weight:700; font-display:swap; src:url('fonts/barlow-condensed-700.woff2') format('woff2'); }
@font-face { font-family:'Barlow Condensed'; font-style:normal; font-weight:800; font-display:swap; src:url('fonts/barlow-condensed-800.woff2') format('woff2'); }
@font-face { font-family:'Barlow Condensed'; font-style:normal; font-weight:900; font-display:swap; src:url('fonts/barlow-condensed-900.woff2') format('woff2'); }
@font-face { font-family:'Inter'; font-style:normal; font-weight:300 700; font-display:swap; src:url('fonts/inter.woff2') format('woff2'); }

/* =========================================
   1. DESIGN TOKENS
   ========================================= */
:root {
  --blue:        #1A3F6F;
  --blue-dark:   #0D2240;
  --blue-mid:    #1E4D87;
  --blue-light:  #EEF4FF;
  --orange:      #F07800;
  --orange-dark: #D46800;
  --orange-light:#FFF4E6;

  --white:    #FFFFFF;
  --gray-50:  #F8FAFC;
  --gray-100: #F1F5F9;
  --gray-200: #E2E8F0;
  --gray-300: #CBD5E1;
  --gray-400: #94A3B8;
  --gray-500: #64748B;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-800: #1E293B;
  --gray-900: #0F172A;

  --text:       #1E293B;
  --text-mid:   #475569;
  --text-light: #94A3B8;
  --mid:        #64748B;
  --text-strong: #0F172A;
  --text-muted:  #475569;
  --on-dark:        #FFFFFF;
  --on-dark-body:   rgba(255,255,255,0.82);
  --on-dark-muted:  rgba(255,255,255,0.68);
  --on-dark-subtle: rgba(255,255,255,0.56);
  --on-dark-border: rgba(255,255,255,0.18);
  --on-light-link:  var(--blue);
  --on-dark-link:   #FFB15E;

  --font-display: 'Barlow Condensed', sans-serif;
  --font-body:    'Inter', sans-serif;

  --radius-sm:   6px;
  --radius:      10px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-full: 9999px;

  --shadow-sm: 0 1px 3px rgba(0,0,0,0.07), 0 1px 2px rgba(0,0,0,0.05);
  --shadow:    0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -1px rgba(0,0,0,0.05);
  --shadow-md: 0 10px 15px -3px rgba(0,0,0,0.08), 0 4px 6px -2px rgba(0,0,0,0.04);
  --shadow-lg: 0 20px 25px -5px rgba(0,0,0,0.10), 0 10px 10px -5px rgba(0,0,0,0.04);
  --shadow-xl: 0 25px 50px -12px rgba(0,0,0,0.18);
  --shadow-blue:   0 20px 40px rgba(26,63,111,0.22);
  --shadow-orange: 0 8px 24px rgba(240,120,0,0.32);

  --transition-fast: 150ms ease;
  --transition:      250ms ease;
  --transition-slow: 400ms cubic-bezier(0.4, 0, 0.2, 1);

  --nav-height: 72px;
  --container:  1280px;
}

/* =========================================
   2. RESET
   ========================================= */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-body);
  font-size: 1rem; line-height: 1.65;
  color: var(--text); background: var(--white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { font-family: inherit; }
h1,h2,h3,h4,h5,h6 { font-family: var(--font-display); font-weight: 800; line-height: 1.08; color: var(--gray-900); }

/* =========================================
   3. LAYOUT
   ========================================= */
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 1.5rem; }
.container--narrow { max-width: 800px; }
.section {
  position: relative;
  padding: clamp(4rem, 8vw, 7rem) 0;
  overflow: hidden;
}
.section--gray {
  background:
    radial-gradient(ellipse 70% 50% at 85% 0%, rgba(26,63,111,0.08) 0%, transparent 60%),
    linear-gradient(180deg, #F8FAFC 0%, #F1F5F9 100%);
}
.section--blue   { background: var(--blue); }
.section--dark   { background: var(--gray-900); }
.section--border { border-top: 1px solid var(--gray-100); }

/* =========================================
   4. TYPOGRAPHY HELPERS
   ========================================= */
.section__header { position: relative; z-index: 1; margin-bottom: clamp(2.5rem, 4vw, 3.5rem); }
.section__header--center { text-align: center; }
.section__header--center .section__sub { margin-left: auto; margin-right: auto; }

.section-label,
.section__label {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-size: 0.7rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.14em;
  color: var(--orange); margin-bottom: 0.75rem;
}
.section__label::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 0 5px rgba(240,120,0,0.12);
}
.section__title {
  font-family: var(--font-display);
  font-size: clamp(1.9rem, 3.5vw, 3rem); font-weight: 900;
  text-transform: uppercase; color: var(--gray-900);
  line-height: 1.04; margin-bottom: 1rem;
}
.section--blue .section__title,
.section--dark .section__title,
.portal-section .section__title,
.process-section .section__title { color: var(--on-dark); }
.section__sub { font-size: clamp(1rem, 1.4vw, 1.15rem); color: var(--text-mid); max-width: 600px; line-height: 1.7; }
.section--blue .section__sub,
.section--dark .section__sub,
.portal-section .section__sub,
.process-section .section__sub { color: var(--on-dark-body); }

.lead { font-size: clamp(1rem, 1.4vw, 1.15rem); line-height: 1.7; color: var(--text-mid); }
.lead--white { color: var(--on-dark-body); }

/* =========================================
   5. BUTTONS
   ========================================= */
.btn {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: var(--font-body); font-size: 0.9rem; font-weight: 600;
  padding: 0.8rem 1.6rem; border-radius: var(--radius);
  border: 2px solid transparent; cursor: pointer;
  transition: all var(--transition); white-space: nowrap;
  letter-spacing: 0.01em; line-height: 1;
}
.btn svg { width: 15px; height: 15px; flex-shrink: 0; transition: transform var(--transition); }
.btn:hover svg { transform: translateX(3px); }

.btn--primary,
.btn--orange {
  background: var(--orange); color: var(--white);
  box-shadow: var(--shadow-orange);
}
.btn--primary:hover,
.btn--orange:hover {
  background: var(--orange-dark);
  box-shadow: 0 12px 32px rgba(240,120,0,0.42);
  transform: translateY(-2px);
}
.btn--blue { background: var(--blue); color: var(--white); box-shadow: var(--shadow-blue); }
.btn--blue:hover { background: var(--blue-mid); transform: translateY(-2px); }
.btn--outline { background: transparent; color: var(--on-dark); border-color: rgba(255,255,255,0.46); }
.btn--outline:hover { background: rgba(255,255,255,0.12); border-color: rgba(255,255,255,0.78); color: var(--on-dark); }
.btn--outline-blue { background: transparent; color: var(--blue); border-color: var(--blue); }
.btn--outline-blue:hover { background: var(--blue); color: var(--white); }
.btn--lg { font-size: 1rem; padding: 1rem 2.2rem; }
.btn--sm { font-size: 0.8rem; padding: 0.5rem 1.1rem; }

/* =========================================
   6. NAVIGATION
   ========================================= */
.nav {
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 100; height: var(--nav-height);
  transition: background var(--transition), box-shadow var(--transition);
}
.nav.scrolled {
  background: rgba(255,255,255,0.97);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 var(--gray-100), 0 4px 20px rgba(0,0,0,0.06);
}
.nav__inner { display: flex; align-items: center; gap: 2rem; height: 100%; }

.nav__logo {
  display: flex; align-items: center; gap: 0.75rem; flex-shrink: 0;
  min-width:min(225px,42vw);
}
.nav__logo-icon { width: 40px; height: 40px; }
.nav__logo-img  { height: 34px; width: auto; }
.site-logo { display:block; width:auto; object-fit:contain; }
.site-logo-stack { position:relative; display:block; width:min(225px,42vw); height:42px; }
.site-logo--nav {
  position:absolute; inset:0 auto auto 0;
  height:42px; max-width:min(225px,42vw);
  transition:opacity var(--transition);
}
.site-logo--light-bg { opacity:0; }
.nav.scrolled .site-logo--dark-bg { opacity:0; }
.nav.scrolled .site-logo--light-bg { opacity:1; }
.nav__logo-text { display: flex; flex-direction: column; line-height: 1; }
.nav__logo-top {
  font-family: var(--font-display); font-size: 0.9rem; font-weight: 900;
  text-transform: uppercase; letter-spacing: 0.03em;
  color: var(--white); transition: color var(--transition);
}
.nav__logo-bot {
  font-family: var(--font-display); font-size: 0.9rem; font-weight: 900;
  text-transform: uppercase; letter-spacing: 0.03em; color: var(--orange);
}
.nav.scrolled .nav__logo-top { color: var(--blue); }

.nav__links { display: flex; align-items: center; gap: 0.25rem; margin-left: auto; }
.nav__links li { position: relative; }
.nav__links > li > a,
.nav__dropdown-toggle {
  font-size: 0.875rem; font-weight: 500; padding: 0.4rem 0.75rem;
  border-radius: var(--radius-sm); transition: all var(--transition-fast);
  color: rgba(255,255,255,0.88); cursor: pointer;
  display: flex; align-items: center; gap: 4px; white-space: nowrap;
}
.nav.scrolled .nav__links > li > a,
.nav.scrolled .nav__dropdown-toggle { color: var(--gray-700); }
.nav__links > li > a:hover,
.nav__dropdown-toggle:hover { background: rgba(255,255,255,0.14); color: var(--white); }
.nav.scrolled .nav__links > li > a:hover,
.nav.scrolled .nav__dropdown-toggle:hover { background: var(--gray-100); color: var(--blue); }
.nav__links a.active { color: var(--orange) !important; }

.nav__dropdown-toggle svg { width: 13px; height: 13px; transition: transform var(--transition-fast); }
.nav__dropdown:hover .nav__dropdown-toggle svg { transform: rotate(180deg); }
.nav__dropdown-menu {
  position: absolute; top: calc(100% + 10px); left: 50%;
  transform: translateX(-50%) translateY(-6px);
  background: var(--white); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xl); padding: 0.5rem; min-width: 210px;
  opacity: 0; visibility: hidden;
  transition: all var(--transition); border: 1px solid var(--gray-100);
}
.nav__dropdown:hover .nav__dropdown-menu { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.nav__dropdown-menu a {
  display: block !important; padding: 0.5rem 0.75rem !important;
  font-size: 0.875rem; color: var(--gray-700) !important;
  border-radius: var(--radius-sm); background: transparent !important;
}
.nav__dropdown-menu a:hover { background: var(--gray-50) !important; color: var(--blue) !important; }

.nav__actions { display: flex; align-items: center; gap: 0.75rem; margin-left: 1rem; }
.nav__login { font-size: 0.8rem; font-weight: 500; color: rgba(255,255,255,0.65) !important; transition: color var(--transition); }
.nav__login:hover { color: var(--white) !important; }
.nav.scrolled .nav__login { color: var(--gray-500) !important; }
.nav.scrolled .nav__login:hover { color: var(--blue) !important; }

.nav__toggle {
  display: none; flex-direction: column; gap: 5px;
  background: none; border: none; cursor: pointer; padding: 0.5rem; margin-left: auto;
}
.nav__toggle span { display: block; width: 22px; height: 2px; background: var(--white); border-radius: 2px; transition: all var(--transition); }
.nav.scrolled .nav__toggle span { background: var(--gray-700); }

.nav__mobile {
  position: fixed; top: var(--nav-height); left: 0; right: 0; bottom: 0;
  background: var(--white); z-index: 99; padding: 1.5rem;
  display: flex; flex-direction: column; gap: 0.25rem;
  overflow-y: auto; transform: translateX(100%);
  transition: transform var(--transition-slow);
}
.nav__mobile.is-open { transform: translateX(0); }
.nav__mobile a {
  font-size: 1.1rem; font-weight: 600; color: var(--gray-800);
  padding: 0.85rem 0; border-bottom: 1px solid var(--gray-100); display: block;
}
.nav__mobile a:hover { color: var(--blue); }
.nav__mobile-label {
  font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.1em; color: var(--gray-400); padding-top: 1.25rem; display: block;
}
.nav__mobile .btn { margin-top: 1rem; justify-content: center; }
.nav__mobile .nav__mobile-login {
  text-align: center;
  color: var(--gray-700);
  font-size: 0.875rem;
  border-bottom: none;
  margin-top: 0.5rem;
}

/* =========================================
   7. HERO
   ========================================= */
.hero {
  position: relative; min-height: 100vh;
  display: flex; align-items: center;
  overflow: hidden; padding-top: var(--nav-height);
  background: var(--blue-dark);
}
.hero__bg { position: absolute; inset: 0; overflow: hidden; }
.hero__bg-gradient {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 80% 70% at 75% 50%, rgba(30,77,135,0.75) 0%, transparent 70%),
    radial-gradient(ellipse 50% 50% at 10% 90%, rgba(240,120,0,0.07) 0%, transparent 60%),
    linear-gradient(140deg, #091928 0%, #122d52 40%, #1A3F6F 70%, #0f2540 100%);
}
.hero__bg-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 44px 44px;
}
.hero__bg-noise {
  position: absolute; inset: 0;
  background-image: radial-gradient(rgba(255,255,255,0.04) 1px, transparent 1px);
  background-size: 22px 22px;
}
.hero__bg-glow {
  position: absolute; width: 600px; height: 600px; border-radius: 50%;
  background: radial-gradient(circle, rgba(240,120,0,0.06) 0%, transparent 70%);
  bottom: -200px; left: -100px; pointer-events: none;
}
.hero__inner { position: relative; z-index: 2; width: 100%; }
.hero__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; padding: 5rem 0 6rem; }

.hero__eyebrow {
  display: inline-flex; align-items: center; gap: 0.5rem;
  background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.14);
  border-radius: var(--radius-full); padding: 0.3rem 1rem;
  font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.12em; color: var(--on-dark-body); margin-bottom: 1.5rem;
}
.hero__eyebrow-dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--orange);
  animation: pulse 2s ease-in-out infinite;
}
@keyframes pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:0.6; transform:scale(0.8); } }

.hero__headline {
  font-family: var(--font-display);
  font-size: clamp(2.8rem, 5.2vw, 5rem); font-weight: 900;
  line-height: 1.0; text-transform: uppercase; color: var(--white);
  margin-bottom: 1.5rem; letter-spacing: -0.02em;
}
.hero__headline em { font-style: normal; color: var(--orange); }
.hero__sub { font-size: clamp(1rem, 1.4vw, 1.15rem); line-height: 1.75; color: var(--on-dark-body); margin-bottom: 2.5rem; max-width: 480px; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 3rem; }
.hero__trust { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.hero__trust-item { display: flex; align-items: center; gap: 0.4rem; color: var(--on-dark-muted); font-size: 0.78rem; font-weight: 500; }
.hero__trust-item svg { color: var(--orange); width: 14px; height: 14px; flex-shrink: 0; }

.hero__visual { position: relative; height: 580px; display: flex; align-items: center; justify-content: center; }

/* Portal Window Mockup */
.portal-window {
  position: relative; width: 100%; max-width: 460px;
  border-radius: var(--radius-xl);
  box-shadow: 0 0 0 1px rgba(255,255,255,0.08), 0 50px 100px rgba(0,0,0,0.5), 0 25px 50px rgba(0,0,0,0.3);
  overflow: hidden; animation: floatWindow 7s ease-in-out infinite;
}
@keyframes floatWindow { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-14px); } }
.portal-window__chrome { background: #1a2535; padding: 10px 14px; display: flex; align-items: center; gap: 8px; }
.portal-window__dots { display: flex; gap: 5px; }
.portal-window__dot  { width: 10px; height: 10px; border-radius: 50%; }
.portal-window__dot:nth-child(1) { background: #FF5F57; }
.portal-window__dot:nth-child(2) { background: #FFBD2E; }
.portal-window__dot:nth-child(3) { background: #28C840; }
.portal-window__url { flex: 1; background: rgba(255,255,255,0.09); border-radius: 4px; padding: 3px 10px; font-size: 11px; color: var(--on-dark-muted); font-family: monospace; text-align: center; }

.portal-ui { display: grid; grid-template-columns: 130px 1fr; background: #F1F5F9; }
.portal-ui__sidebar { background: var(--blue); padding: 14px 0; display: flex; flex-direction: column; }
.portal-ui__logo-area { padding: 0 12px 12px; margin-bottom: 6px; border-bottom: 1px solid rgba(255,255,255,0.1); }
.portal-ui__logo-bar  { height: 5px; background: rgba(255,255,255,0.85); border-radius: 3px; width: 65%; margin-bottom: 3px; }
.portal-ui__logo-bar2 { height: 4px; background: var(--orange); border-radius: 3px; width: 85%; }
.portal-ui__nav-item  { display: flex; align-items: center; gap: 7px; padding: 6px 12px; font-size: 10px; color: var(--on-dark-muted); }
.portal-ui__nav-item.active { background: rgba(255,255,255,0.12); color: var(--white); }
.portal-ui__nav-dot   { width: 5px; height: 5px; border-radius: 50%; background: rgba(255,255,255,0.32); flex-shrink: 0; }
.portal-ui__nav-item.active .portal-ui__nav-dot { background: var(--orange); }
.portal-ui__nav-line  { height: 7px; background: rgba(255,255,255,0.22); border-radius: 4px; flex: 1; }
.portal-ui__nav-spacer { flex: 1; }
.portal-ui__main      { padding: 14px; }
.portal-ui__topbar    { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.portal-ui__page-title { height: 8px; width: 90px; background: var(--gray-700); border-radius: 4px; opacity: 0.8; }
.portal-ui__badge      { height: 18px; width: 65px; background: var(--orange); border-radius: 10px; opacity: 0.9; }
.portal-ui__stats      { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-bottom: 10px; }
.portal-ui__stat       { background: var(--white); border-radius: 6px; padding: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.07); }
.portal-ui__stat-num   { height: 13px; background: var(--blue); border-radius: 3px; width: 45%; margin-bottom: 4px; opacity: 0.8; }
.portal-ui__stat-label { height: 6px; background: var(--gray-200); border-radius: 3px; width: 75%; }
.portal-ui__list       { display: flex; flex-direction: column; gap: 6px; }
.portal-ui__row        { background: var(--white); border-radius: 6px; padding: 7px 9px; display: flex; align-items: center; gap: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.portal-ui__row-icon   { width: 22px; height: 22px; border-radius: 4px; background: var(--blue-light); flex-shrink: 0; }
.portal-ui__row-icon.orange { background: var(--orange-light); }
.portal-ui__row-icon.green  { background: #ECFDF5; }
.portal-ui__row-body   { flex: 1; }
.portal-ui__row-line1  { height: 6px; background: var(--gray-300); border-radius: 3px; width: 80%; margin-bottom: 3px; }
.portal-ui__row-line2  { height: 5px; background: var(--gray-200); border-radius: 3px; width: 50%; }
.portal-ui__row-status { height: 16px; width: 42px; border-radius: 8px; background: #DCFCE7; flex-shrink: 0; }
.portal-ui__row-status.orange-status { background: #FEF3C7; }
.portal-ui__row-status.blue-status   { background: #DBEAFE; }

.hero__float { position: absolute; background: var(--white); border-radius: var(--radius-lg); padding: 1rem 1.2rem; box-shadow: var(--shadow-xl); border: 1px solid rgba(255,255,255,0.9); }
.hero__float--1 { top: 6%;  right: -2%; animation: floatCard 7s 0s   ease-in-out infinite; }
.hero__float--2 { bottom: 14%; right: -5%; animation: floatCard 6s 1.2s ease-in-out infinite; }
.hero__float--3 { top: 44%; left: -4%; animation: floatCard 8s 2s   ease-in-out infinite; }
@keyframes floatCard { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-8px); } }
.hero__float-icon { width: 34px; height: 34px; border-radius: var(--radius); display: flex; align-items: center; justify-content: center; margin-bottom: 0.4rem; }
.hero__float-icon--blue   { background: var(--blue-light); }
.hero__float-icon--orange { background: var(--orange-light); }
.hero__float-icon--green  { background: #ECFDF5; }
.hero__float-icon svg { width: 17px; height: 17px; }
.hero__float-icon--blue svg   { color: var(--blue); }
.hero__float-icon--orange svg { color: var(--orange); }
.hero__float-icon--green svg  { color: #10B981; }
.hero__float-label { font-size: 0.65rem; font-weight: 600; color: var(--gray-400); text-transform: uppercase; letter-spacing: 0.06em; }
.hero__float-value { font-size: 0.82rem; font-weight: 700; color: var(--gray-900); white-space: nowrap; }

/* =========================================
   8. TRUST BAR
   ========================================= */
.trust-bar {
  position: relative;
  background: linear-gradient(180deg, var(--white) 0%, var(--gray-50) 100%);
  border-bottom: 1px solid var(--gray-100);
  padding: 1.35rem 0;
}
.trust-bar::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(26,63,111,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(26,63,111,0.035) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(90deg, transparent, #000 18%, #000 82%, transparent);
  pointer-events: none;
}
.trust-bar__inner {
  position: relative;
  z-index: 1;
  display: flex; align-items: center; justify-content: center; gap: 1rem;
  flex-wrap: wrap;
}
.trust-bar__item {
  display: flex; align-items: center; gap: 0.55rem;
  color: var(--gray-600); font-size: 0.82rem; font-weight: 600;
  background: rgba(255,255,255,0.72);
  border: 1px solid rgba(226,232,240,0.9);
  border-radius: var(--radius-full);
  padding: 0.45rem 0.8rem;
  box-shadow: 0 10px 25px rgba(15,23,42,0.04);
}
.trust-bar__item svg { color: var(--orange); width: 16px; height: 16px; flex-shrink: 0; }
.trust-bar__divider { display: none; }

/* =========================================
   9. TARGET GROUP CARDS
   ========================================= */
.target-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; }
.target-grid--4 { grid-template-columns: repeat(4,1fr); }
.target-card {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(248,250,252,0.96) 100%);
  border-radius: var(--radius-lg);
  padding: 2.25rem 2rem; border: 1px solid rgba(226,232,240,0.82);
  box-shadow: 0 18px 45px rgba(15,23,42,0.08);
  transition: all var(--transition); display: flex; flex-direction: column;
  position: relative; overflow: hidden;
}
.target-card::before {
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 70% 45% at 100% 0%, rgba(26,63,111,0.12) 0%, transparent 62%),
    linear-gradient(135deg, rgba(240,120,0,0.08), transparent 34%);
  opacity: 0;
  transition: opacity var(--transition);
  pointer-events: none;
}
.target-card::after { content:''; position: absolute; bottom:0; left:0; right:0; height:3px; background: linear-gradient(90deg, var(--blue), var(--blue-mid)); transition: height var(--transition); }
.target-card:hover { box-shadow: 0 28px 60px rgba(15,23,42,0.13); transform: translateY(-6px); border-color: rgba(26,63,111,0.18); }
.target-card:hover::before { opacity: 1; }
.target-card:hover::after { height:4px; background: linear-gradient(90deg, var(--orange), var(--orange-dark)); }
.target-card__icon { position: relative; z-index: 1; width:52px; height:52px; border-radius:var(--radius); background:linear-gradient(135deg, var(--blue-light), var(--white)); border:1px solid var(--gray-100); display:flex; align-items:center; justify-content:center; margin-bottom:1.25rem; box-shadow:0 14px 28px rgba(26,63,111,0.12); }
.target-card__icon svg { width:24px; height:24px; color:var(--blue); }
.target-card__icon--solid { background:var(--blue); border-color:transparent; }
.target-card__icon--solid svg { color:var(--white); }
.target-card__icon--orange { background:var(--orange-light); border-color:rgba(240,120,0,0.2); }
.target-card__title { position: relative; z-index: 1; font-family:var(--font-display); font-size:1.3rem; font-weight:900; text-transform:uppercase; color:var(--gray-900); margin-bottom:0.75rem; }
.target-card__text  { position: relative; z-index: 1; font-size:0.9rem; color:var(--text-mid); line-height:1.65; flex:1; margin-bottom:1.5rem; }
.target-card__link  { position: relative; z-index: 1; font-size:0.85rem; font-weight:700; color:var(--blue); display:flex; align-items:center; gap:0.25rem; transition:gap var(--transition),color var(--transition); }
.target-card__link:hover { gap:0.5rem; color:var(--orange); }
.target-card__link svg { width:15px; height:15px; }
.target-card__meta { position:relative; z-index:1; font-size:0.8rem; font-weight:700; color:var(--gray-600); text-transform:uppercase; letter-spacing:0.08em; }

.partner-strip {
  position: relative;
  z-index: 1;
  margin-top: 1.5rem;
  padding: 1.35rem 1.5rem;
  background: linear-gradient(135deg, var(--blue-dark), var(--blue) 68%, var(--blue-mid));
  border-radius: var(--radius-lg);
  border: 1px solid rgba(255,255,255,0.12);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
  box-shadow: var(--shadow-blue);
  overflow: hidden;
}
.partner-strip::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 32% 120% at 6% 20%, rgba(240,120,0,0.18) 0%, transparent 70%),
    linear-gradient(rgba(255,255,255,0.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.028) 1px, transparent 1px);
  background-size: auto, 44px 44px, 44px 44px;
  pointer-events: none;
}
.partner-strip__content {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 1rem;
  flex: 1;
  min-width: 260px;
}
.partner-strip__icon {
  width: 46px;
  height: 46px;
  border-radius: var(--radius);
  background: rgba(240,120,0,0.13);
  border: 1px solid rgba(240,120,0,0.34);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.partner-strip__text strong {
  display: block;
  font-family: var(--font-display);
  font-size: 1.1rem;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--white);
}
.partner-strip__text p {
  font-size: 0.875rem;
  color: var(--on-dark-body);
  margin-top: 2px;
}
.partner-strip .btn {
  position: relative;
  z-index: 1;
  color: var(--white);
  border-color: rgba(255,255,255,0.36);
}
.partner-strip .btn:hover {
  background: rgba(255,255,255,0.1);
  border-color: rgba(255,255,255,0.62);
}

/* =========================================
   10. SERVICE CARDS
   ========================================= */
.services-grid { position: relative; z-index: 1; display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem; }
.service-card {
  background:rgba(255,255,255,0.9);
  border-radius:var(--radius-lg);
  padding:1.75rem 1.5rem;
  border:1px solid rgba(226,232,240,0.9);
  transition:all var(--transition);
  position:relative;
  overflow:hidden;
  box-shadow:0 14px 36px rgba(15,23,42,0.06);
  min-height: 220px;
}
.service-card::before { content:''; position:absolute; inset:0 auto 0 0; width:3px; background:linear-gradient(180deg, var(--blue-light), rgba(26,63,111,0.3)); transition:width var(--transition),background var(--transition),opacity var(--transition); }
.service-card::after { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 95% 55% at 100% 0%, rgba(26,63,111,0.1) 0%, transparent 62%); opacity:0; transition:opacity var(--transition); pointer-events:none; }
.service-card:hover { box-shadow:0 22px 50px rgba(15,23,42,0.1); transform:translateY(-4px); border-color:rgba(26,63,111,0.16); }
.service-card:hover::before { width:4px; background:var(--orange); }
.service-card:hover::after { opacity:1; }
.service-card__icon { position:relative; z-index:1; width:42px; height:42px; border-radius:var(--radius); background:linear-gradient(135deg, var(--blue-light), var(--white)); border:1px solid var(--gray-100); display:flex; align-items:center; justify-content:center; margin-bottom:1rem; box-shadow:0 10px 24px rgba(26,63,111,0.1); }
.service-card__icon svg { width:20px; height:20px; color:var(--blue); }
.service-card__title { position:relative; z-index:1; font-family:var(--font-display); font-size:1rem; font-weight:800; text-transform:uppercase; color:var(--gray-900); margin-bottom:0.5rem; }
.service-card__text  { position:relative; z-index:1; font-size:0.85rem; color:var(--text-mid); line-height:1.55; }
.service-card__link  { position:relative; z-index:1; display:inline-flex; align-items:center; gap:4px; font-size:0.78rem; font-weight:700; color:var(--blue); margin-top:0.75rem; transition:gap var(--transition),color var(--transition); }
.service-card__link:hover { gap:8px; color:var(--orange); }
.service-card--overview {
  background: linear-gradient(135deg, var(--blue-dark), var(--blue));
  border-color: rgba(255,255,255,0.1);
}
.service-card--overview::before { background: var(--orange); }
.service-card--overview::after { opacity: 1; background: radial-gradient(ellipse 85% 60% at 100% 0%, rgba(240,120,0,0.18) 0%, transparent 64%); }
.service-card--overview .service-card__icon { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.16); box-shadow:none; }
.service-card--overview .service-card__title { color: var(--white); }
.service-card--overview .service-card__text { color: rgba(255,255,255,0.64); }
.service-card--overview .service-card__link { color: var(--white); }

/* =========================================
   11. PORTAL FEATURE SECTION
   ========================================= */
.portal-section { position:relative; overflow:hidden; background:var(--blue-dark); }
.portal-section__bg-gradient { position:absolute; inset:0; background: radial-gradient(ellipse 60% 80% at 80% 50%, rgba(30,77,135,0.85) 0%, transparent 70%), linear-gradient(140deg, #091928 0%, #1A3F6F 100%); }
.portal-section__bg-grid { position:absolute; inset:0; background-image: linear-gradient(rgba(255,255,255,0.022) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.022) 1px, transparent 1px); background-size:44px 44px; }
.portal-section__inner { position:relative; z-index:2; }
.portal-section__grid  { display:grid; grid-template-columns:1fr 1.25fr; gap:5rem; align-items:center; }
.portal-section__grid > div:first-child { max-width:560px; }
.portal-section .section-label,
.portal-section .section__label { color:var(--orange); margin-bottom:1.1rem; }
.portal-section h2,
.portal-section .section__title { color:var(--on-dark); margin-bottom:clamp(1.25rem,2vw,1.65rem); }
.portal-section .lead,
.portal-section .section__sub,
.portal-section__sub {
  color:var(--on-dark-body);
  max-width:560px;
  line-height:1.78;
  margin-bottom:2.4rem;
}

.portal-feature-list { display:flex; flex-direction:column; gap:1.5rem; }
.portal-feature-item { display:flex; gap:1rem; align-items:flex-start; padding:1rem; border:1px solid rgba(255,255,255,0.08); border-radius:var(--radius-lg); background:rgba(255,255,255,0.035); transition:background var(--transition),transform var(--transition),border-color var(--transition); }
.portal-feature-item:hover { background:rgba(255,255,255,0.06); border-color:rgba(255,255,255,0.14); transform:translateX(4px); }
.portal-feature-item__icon { width:42px; height:42px; flex-shrink:0; border-radius:var(--radius); background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.12); display:flex; align-items:center; justify-content:center; }
.portal-feature-item__icon svg { width:18px; height:18px; color:var(--orange); }
.portal-feature-item h3 { font-size:1rem; font-weight:600; color:var(--white); margin-bottom:3px; }
.portal-feature-item p  { font-size:0.85rem; color:var(--on-dark-muted); line-height:1.55; }
.portal-feature-cta { margin-top:2rem; display:flex; gap:1rem; flex-wrap:wrap; }

.portal-shot-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-top:1rem; }
.portal-shot {
  margin:0;
  border-radius:var(--radius-xl);
  overflow:hidden;
  background:#07111f;
  box-shadow:0 0 0 1px rgba(255,255,255,0.12), 0 32px 70px rgba(0,0,0,0.34);
}
.portal-shot img {
  display:block;
  width:100%;
  height:auto;
}
.portal-shot--tilted {
  transform:perspective(1200px) rotateY(-4deg) rotateX(1.5deg);
  transform-origin:center;
}
.portal-shot__caption {
  padding:1rem 1.1rem 1.15rem;
  color:var(--on-dark-body);
  background:rgba(7,17,31,0.96);
  border-top:1px solid rgba(255,255,255,0.08);
}
.portal-shot__caption strong {
  display:block;
  color:var(--white);
  font-size:0.98rem;
  margin-bottom:0.25rem;
}
.portal-shot__caption span {
  display:block;
  color:var(--on-dark-muted);
  font-size:0.84rem;
  line-height:1.5;
}

.portal-mockup-lg { position:relative; border-radius:var(--radius-xl); overflow:hidden; box-shadow:0 0 0 1px rgba(255,255,255,0.08), 0 50px 100px rgba(0,0,0,0.55); background:#1a2535; transform: perspective(1200px) rotateY(-5deg) rotateX(2deg); transform-origin:center; }
.portal-mockup-lg::before { content:''; position:absolute; inset:-1px; border-radius:inherit; background:linear-gradient(135deg, rgba(255,255,255,0.34), transparent 34%, rgba(240,120,0,0.16)); pointer-events:none; opacity:0.7; }
.portal-mockup-lg__chrome { background:#111827; padding:12px 16px; display:flex; align-items:center; gap:10px; }

.portal-screenshot-slot { background:linear-gradient(135deg, #F8FAFC 0%, #EAF1FB 100%); display:flex; align-items:center; justify-content:center; flex-direction:column; gap:0.5rem; color:var(--gray-400); font-size:0.8rem; min-height:340px; position:relative; overflow:hidden; padding:2rem; }
.portal-screenshot-slot::before {
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(26,63,111,0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(26,63,111,0.055) 1px, transparent 1px),
    radial-gradient(ellipse 55% 70% at 82% 18%, rgba(26,63,111,0.12) 0%, transparent 70%);
  background-size:32px 32px, 32px 32px, auto;
}
.portal-screenshot-slot::after {
  content:'';
  position:absolute;
  left:7%;
  right:7%;
  top:13%;
  bottom:13%;
  border-radius:var(--radius-lg);
  background:
    linear-gradient(90deg, var(--blue) 0 24%, transparent 24%),
    linear-gradient(#FFFFFF 0 0) 30% 15% / 26% 10px no-repeat,
    linear-gradient(#F07800 0 0) 82% 15% / 12% 24px no-repeat,
    linear-gradient(#FFFFFF 0 0) 30% 31% / 18% 58px no-repeat,
    linear-gradient(#FFFFFF 0 0) 52% 31% / 18% 58px no-repeat,
    linear-gradient(#FFFFFF 0 0) 74% 31% / 18% 58px no-repeat,
    linear-gradient(#FFFFFF 0 0) 30% 61% / 64% 24px no-repeat,
    linear-gradient(#FFFFFF 0 0) 30% 75% / 64% 24px no-repeat,
    linear-gradient(#FFFFFF 0 0) 30% 89% / 64% 24px no-repeat,
    #F1F5F9;
  box-shadow:0 28px 55px rgba(15,23,42,0.18);
  opacity:0.86;
}
.portal-screenshot-slot__label { position:relative; z-index:1; text-align:center; background:rgba(255,255,255,0.9); border:1px solid rgba(226,232,240,0.95); border-radius:var(--radius); padding:0.9rem 1.25rem; box-shadow:0 16px 35px rgba(15,23,42,0.12); backdrop-filter:blur(8px); }
.portal-screenshot-slot__label strong { display:block; font-weight:700; color:var(--blue); margin-bottom:0.25rem; }
.portal-screenshot-slot__label code { font-size:0.7rem; color:var(--gray-500); background:var(--gray-100); padding:2px 6px; border-radius:4px; }
.portal-screenshot-slot__inner {
  position: relative;
  z-index: 1;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.45rem;
  text-align: center;
  color: var(--blue);
  font-weight: 700;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(226,232,240,0.95);
  border-radius: var(--radius);
  padding: 1rem 1.25rem;
  box-shadow: 0 16px 35px rgba(15,23,42,0.12);
}
.portal-screenshot-slot__inner svg { width: 28px; height: 28px; color: var(--blue); }
.portal-screenshot-slot__inner code {
  font-size: 0.7rem;
  color: var(--gray-600);
  background: var(--gray-100);
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: 500;
}
.portal-screenshot-slot--image {
  display:block;
  padding:0;
  background:#F8FAFC;
}
.portal-screenshot-slot--image::before,
.portal-screenshot-slot--image::after { display:none; }
.portal-screenshot-img {
  display:block;
  width:100%;
  height:100%;
  min-height:inherit;
  object-fit:cover;
  object-position:left top;
}

/* =========================================
   12. STATS BAR
   ========================================= */
.stats-bar { position:relative; overflow:hidden; background:var(--blue); padding:3rem 0; }
.stats-bar::before { content:''; position:absolute; inset:0; background:linear-gradient(140deg, #091928 0%, #1A3F6F 68%, #0f2540 100%); }
.stats-bar::after { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px); background-size:44px 44px; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; text-align:center; }
.stat-item { position:relative; z-index:1; padding:1rem; border-radius:var(--radius-lg); }
.stat-item + .stat-item::before { content:''; position:absolute; left:0; top:15%; height:70%; width:1px; background:rgba(255,255,255,0.14); }
.stat-item__number { font-family:var(--font-display); font-size:clamp(2.2rem,4vw,3.5rem); font-weight:900; color:var(--white); line-height:1; margin-bottom:0.5rem; }
.stat-item__number span { color:var(--orange); }
.stat-item__label { font-size:0.85rem; color:var(--on-dark-muted); font-weight:500; }

.stats-bar__grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; text-align:center; }
.stats-bar__item { position:relative; padding:1rem; border-radius:var(--radius-lg); }
.stats-bar__item + .stats-bar__item::before { content:''; position:absolute; left:0; top:15%; height:70%; width:1px; background:rgba(255,255,255,0.14); }
.stats-bar__num { font-family:var(--font-display); font-size:clamp(2.2rem,4vw,3.5rem); font-weight:900; color:var(--on-dark); line-height:1; margin-bottom:0.5rem; }
.stats-bar__label { font-size:0.85rem; color:var(--on-dark-muted); font-weight:500; }

/* =========================================
   13. PROCESS TIMELINE
   ========================================= */
.process-section { background:var(--blue-dark); }
.process-section::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 65% 80% at 78% 22%, rgba(30,77,135,0.82) 0%, transparent 68%), radial-gradient(ellipse 45% 50% at 10% 90%, rgba(240,120,0,0.1) 0%, transparent 62%), linear-gradient(140deg, #091928 0%, #122d52 58%, #0f2540 100%); }
.process-section::after { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.024) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.024) 1px, transparent 1px); background-size:44px 44px; pointer-events:none; }
.process-section .container { position:relative; z-index:1; }
.process-section .section__title { color:var(--on-dark); }
.process-section .section__sub { color:var(--on-dark-body); }
.process-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:1rem; position:relative; }
.process-grid--6 { grid-template-columns:repeat(6,1fr); }
.process-grid::before { content:''; position:absolute; top:28px; left:calc(10% + 4px); right:calc(10% + 4px); height:2px; background:linear-gradient(90deg, var(--blue-light) 0%, var(--blue-mid) 50%, var(--orange) 100%); z-index:0; }
.process-step { text-align:center; padding:0 0.4rem; position:relative; z-index:1; }
.process-step::before { content:''; position:absolute; left:0; right:0; top:28px; bottom:0; z-index:-1; border-radius:var(--radius-lg); background:var(--white); border:1px solid var(--gray-100); box-shadow:0 20px 45px rgba(15,23,42,0.08); transform:translateY(28px); }
.process-step__num { width:56px; height:56px; border-radius:50%; background:var(--white); border:3px solid rgba(255,255,255,0.75); color:var(--blue); font-family:var(--font-display); font-size:1.3rem; font-weight:900; display:flex; align-items:center; justify-content:center; margin:0 auto 1.25rem; box-shadow:var(--shadow-md); transition:all var(--transition); }
.process-step:last-child .process-step__num { background:var(--orange); border-color:var(--orange); color:var(--white); }
.process-step:hover .process-step__num { background:var(--blue); color:var(--white); }
.process-step__title { font-family:var(--font-display); font-size:1rem; font-weight:800; text-transform:uppercase; color:var(--gray-900); margin-bottom:0.5rem; }
.process-step__text  { font-size:0.82rem; color:var(--text-mid); line-height:1.55; padding:0 0.75rem 1rem; }
.process-section .process-step::before { background:rgba(255,255,255,0.06); border-color:rgba(255,255,255,0.12); box-shadow:0 20px 45px rgba(0,0,0,0.14); }
.process-section .process-step__title { color:var(--on-dark); }
.process-section .process-step__text { color:var(--on-dark-muted); }
.process-section .process-grid::before { background:linear-gradient(90deg, rgba(255,255,255,0.26) 0%, var(--blue-mid) 50%, var(--orange) 100%); }

/* =========================================
   14. BENEFIT CARDS
   ========================================= */
.benefit-grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.benefit-card { background:linear-gradient(180deg, var(--white) 0%, var(--gray-50) 100%); border-radius:var(--radius-lg); padding:2rem; border:1px solid rgba(226,232,240,0.86); box-shadow:0 16px 42px rgba(15,23,42,0.07); transition:all var(--transition); position:relative; overflow:hidden; }
.benefit-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, var(--blue), var(--orange)); }
.benefit-card::after { content:''; position:absolute; width:130px; height:130px; right:-60px; top:-65px; border-radius:50%; background:rgba(26,63,111,0.07); pointer-events:none; }
.benefit-card:hover { box-shadow:0 24px 55px rgba(15,23,42,0.11); transform:translateY(-4px); }
.benefit-card__icon { position:relative; z-index:1; width:48px; height:48px; border-radius:var(--radius); display:flex; align-items:center; justify-content:center; margin-bottom:1.25rem; box-shadow:0 12px 26px rgba(15,23,42,0.08); }
.benefit-card__icon--blue   { background:var(--blue-light); }
.benefit-card__icon--orange { background:var(--orange-light); }
.benefit-card__icon--gray   { background:var(--gray-100); }
.benefit-card__icon svg { width:22px; height:22px; }
.benefit-card__icon--blue svg   { color:var(--blue); }
.benefit-card__icon--orange svg { color:var(--orange); }
.benefit-card__icon--gray svg   { color:var(--gray-600); }
.benefit-card__title { position:relative; z-index:1; font-family:var(--font-display); font-size:1.1rem; font-weight:800; text-transform:uppercase; color:var(--gray-900); margin-bottom:0.6rem; }
.benefit-card__text  { position:relative; z-index:1; font-size:0.875rem; color:var(--text-mid); line-height:1.65; }
.benefit-card--dark { background:linear-gradient(135deg, var(--blue-dark), var(--blue)); border-color:transparent; }
.benefit-card--dark::after { background:rgba(255,255,255,0.08); }
.benefit-card--dark .benefit-card__title { color:var(--on-dark); }
.benefit-card--dark .benefit-card__text { color:var(--on-dark-body); }

/* =========================================
   15. CTA BANNER
   ========================================= */
.cta-banner { position:relative; overflow:hidden; background:var(--blue); padding:clamp(5rem,8vw,8rem) 0; }
.cta-banner::before { content:''; position:absolute; inset:0; background: radial-gradient(ellipse 50% 80% at 15% 50%, rgba(240,120,0,0.16) 0%, transparent 65%), radial-gradient(ellipse 50% 80% at 85% 50%, rgba(10,30,70,0.64) 0%, transparent 65%), linear-gradient(140deg, #091928 0%, #1A3F6F 74%, #0f2540 100%); }
.cta-banner::after { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.024) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.024) 1px, transparent 1px); background-size:44px 44px; pointer-events:none; }
.cta-banner .container { position:relative; z-index:2; text-align:center; max-width:860px; }
.cta-banner__label { display:inline-block; font-size:0.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.14em; color:var(--orange); margin-bottom:1.15rem; }
.cta-banner__title { font-family:var(--font-display); font-size:clamp(2rem,4vw,3.5rem); font-weight:900; text-transform:uppercase; color:var(--white); line-height:1.04; margin-bottom:1.6rem; }
.cta-banner__text  { font-size:1.1rem; color:var(--on-dark-body); margin-bottom:3rem; max-width:560px; margin-left:auto; margin-right:auto; line-height:1.75; }
.cta-banner__actions { display:flex; gap:1rem; justify-content:center; align-items:center; flex-wrap:wrap; }
.cta-banner h1,
.cta-banner h2,
.cta-banner h3 { color:var(--on-dark); margin-bottom:1.6rem; }
.cta-banner p,
.cta-banner .lead {
  color:var(--on-dark-body);
  max-width:560px;
  margin:0 auto 3rem;
  line-height:1.75;
}
.cta-banner a:not(.btn) { color:var(--on-dark-link); }

/* =========================================
   16. FAQ
   ========================================= */
.faq { display:flex; flex-direction:column; gap:0.75rem; }
.faq__item { background:var(--white); border:1px solid var(--gray-200); border-radius:var(--radius-lg); overflow:hidden; transition:box-shadow var(--transition),border-color var(--transition); }
.faq__item.is-open { box-shadow:var(--shadow-md); border-color:var(--gray-300); }
.faq__question { width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.25rem 1.5rem; background:none; border:none; cursor:pointer; font-family:var(--font-body); font-size:0.95rem; font-weight:600; color:var(--gray-900); text-align:left; transition:color var(--transition); }
.faq__question:hover { color:var(--blue); }
.faq__question svg { width:18px; height:18px; color:var(--gray-400); flex-shrink:0; transition:transform var(--transition),color var(--transition); }
.faq__item.is-open .faq__question svg { transform:rotate(180deg); color:var(--blue); }
.faq__answer { display:none; padding:0 1.5rem 1.25rem; font-size:0.9rem; color:var(--text-mid); line-height:1.7; border-top:1px solid var(--gray-100); padding-top:1rem; }
.faq__item.is-open .faq__answer { display:block; }

/* =========================================
   17. PAGE HEADER (subpages)
   ========================================= */
.page-header { position:relative; background:var(--blue); padding:calc(var(--nav-height) + 3.5rem) 0 3.5rem; overflow:hidden; }
.page-header::before { content:''; position:absolute; inset:0; background: radial-gradient(ellipse 80% 60% at 70% 50%, rgba(30,77,135,0.75) 0%, transparent 70%), linear-gradient(140deg, #091928 0%, #1A3F6F 100%); }
.page-header::after  { content:''; position:absolute; inset:0; background-image: linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px); background-size:44px 44px; }
.page-header .container { position:relative; z-index:2; }

.breadcrumb { display:flex; align-items:center; gap:0.5rem; font-size:0.82rem; color:var(--on-dark-muted); margin-bottom:1.25rem; }
.breadcrumb a { color:var(--on-dark-muted); transition:color var(--transition-fast); }
.breadcrumb a:hover { color:rgba(255,255,255,0.85); }
.breadcrumb span { color:var(--on-dark-subtle); }
[aria-current="page"] { color:var(--on-dark-body) !important; }
.page-header h1 { font-family:var(--font-display); font-size:clamp(2rem,4vw,3.25rem); font-weight:900; text-transform:uppercase; color:var(--white); line-height:1.04; margin-bottom:1.25rem; }
.page-header h1 span { color:var(--orange); }
.page-header .lead { max-width:620px; }

/* =========================================
   18. CONTENT CARDS (subpages)
   ========================================= */
.card { background:var(--white); border-radius:var(--radius-lg); padding:2rem; border:1px solid var(--gray-100); box-shadow:var(--shadow-sm); }
.card--blue { background:linear-gradient(135deg, var(--blue-dark), var(--blue)); border-color:transparent; }
.card--blue h2, .card--blue h3 { color:var(--white); }
.card--blue p,
.card--blue li,
.card--blue .lead,
.card--blue .icon-list__item { color:var(--on-dark-body); }
.card--blue .card__link,
.card--blue a:not(.btn) { color:var(--on-dark-link); }
.card--orange { background:var(--orange); border-color:transparent; }
.card--gray   { background:var(--gray-50); }
.card h3 { font-family:var(--font-display); font-size:1.25rem; font-weight:800; text-transform:uppercase; margin-bottom:0.75rem; }
.card p  { font-size:0.9rem; line-height:1.65; color:var(--text-mid); }
.card.card--blue h2,
.card.card--blue h3 { color:var(--on-dark); }
.card.card--blue p,
.card.card--blue li,
.card.card--blue .lead,
.card.card--blue .icon-list__item { color:var(--on-dark-body); }
.card.card--blue .btn--orange,
.card.card--blue .btn--orange:hover { color:var(--white); }
.card__muted { margin-top:0.5rem; font-size:0.9375rem; color:var(--text-mid); }
.card__link { display:inline-flex; align-items:center; gap:0.25rem; font-size:0.85rem; font-weight:700; color:var(--blue); margin-top:0.75rem; transition:gap var(--transition),color var(--transition); }
.card__link:hover { gap:0.5rem; }
.cards--2 { grid-template-columns:repeat(2,1fr); }
.cards--3 { grid-template-columns:repeat(3,1fr); }
.card__icon { width:44px; height:44px; border-radius:var(--radius); background:var(--blue-light); color:var(--blue); display:flex; align-items:center; justify-content:center; margin-bottom:1rem; }
.card__icon svg { width:22px; height:22px; }

.two-col { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; }
.cards   { display:grid; gap:1rem; }

.icon-list { display:flex; flex-direction:column; gap:0.75rem; }
.icon-list__item { display:flex; align-items:flex-start; gap:0.75rem; font-size:0.9rem; color:var(--text-mid); line-height:1.55; }
.icon-list__item svg { width:17px; height:17px; color:var(--orange); flex-shrink:0; margin-top:1px; }

/* =========================================
   19. FORMS
   ========================================= */
.form-grid { display:grid; grid-template-columns:1fr 340px; gap:3.5rem; align-items:start; }
.form-card { background:var(--white); border-radius:var(--radius-xl); padding:2.5rem; box-shadow:var(--shadow-lg); border:1px solid var(--gray-100); }
.form-card h2 { font-family:var(--font-display); font-size:1.75rem; font-weight:900; text-transform:uppercase; margin-bottom:0.5rem; }
.form-card > p { font-size:0.9rem; color:var(--text-mid); margin-bottom:2rem; }
.form-group { margin-bottom:1.25rem; }
.form-group label { display:block; font-size:0.85rem; font-weight:600; color:var(--gray-700); margin-bottom:0.5rem; }
.form-group input, .form-group select, .form-group textarea { width:100%; padding:0.75rem 1rem; border:1.5px solid var(--gray-200); border-radius:var(--radius); font-family:var(--font-body); font-size:0.95rem; color:var(--gray-900); background:var(--white); transition:border-color var(--transition),box-shadow var(--transition); outline:none; -webkit-appearance:none; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(26,63,111,0.1); }
.form-group textarea { min-height:120px; resize:vertical; }
.form-group a { color:var(--blue); font-weight:600; }
.form-hint { font-size:0.875rem; color:var(--text-mid); line-height:1.55; }
.form-consent { font-size:0.875rem; color:var(--text-mid); }
.form-consent a { color:var(--blue); font-weight:600; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-checkbox { display:flex; gap:0.75rem; align-items:flex-start; }
.form-checkbox input { width:18px; height:18px; flex-shrink:0; margin-top:1px; accent-color:var(--blue); }
.form-checkbox label { font-size:0.85rem; color:var(--text-mid); line-height:1.55; font-weight:400; }
.form-sidebar { display:flex; flex-direction:column; gap:1.25rem; }
.info-card { background:var(--white); border-radius:var(--radius-lg); padding:1.5rem; box-shadow:var(--shadow-sm); border:1px solid var(--gray-100); }
.info-card h3 { font-family:var(--font-display); font-size:1.1rem; font-weight:800; text-transform:uppercase; margin-bottom:0.75rem; }
.info-card p  { font-size:0.85rem; color:var(--text-mid); line-height:1.6; }
.info-card--blue { background:var(--blue); border-color:transparent; }
.info-card--blue h3 { color:var(--white); }
.info-card--blue p  { color:var(--on-dark-body); }

/* =========================================
   20. HIGHLIGHT BOXES
   ========================================= */
.highlight-box { background:var(--blue-light); border-left:4px solid var(--blue); border-radius:0 var(--radius) var(--radius) 0; padding:1.25rem 1.5rem; }
.highlight-box--orange { background:var(--orange-light); border-color:var(--orange); }
.highlight-box h3 { font-family:var(--font-display); font-size:1.05rem; font-weight:800; color:var(--gray-900); margin-bottom:0.4rem; text-transform:uppercase; }
.highlight-box p  { font-size:0.875rem; color:var(--text-mid); line-height:1.6; }
.highlight-box a  { color:var(--blue); font-weight:700; }
.highlight-box__text { font-size:0.875rem; color:var(--text-mid); }
.highlight-box__text a { color:var(--blue); font-weight:700; }

/* =========================================
   PARTNERNETZWERK PAGE
   ========================================= */
.partner-hero .container {
  display:grid;
  grid-template-columns:minmax(0, 1.25fr) minmax(220px, 0.55fr);
  gap:clamp(2rem, 6vw, 5rem);
  align-items:center;
}
.partner-hero .breadcrumb { grid-column:1 / -1; }
.partner-hero__content { max-width:760px; }
.partner-hero__actions { display:flex; flex-wrap:wrap; gap:0.75rem; margin-top:2rem; }
.partner-hero__seal {
  justify-self:center;
  width:min(260px, 58vw);
  padding:1.1rem;
  border-radius:var(--radius-xl);
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.14);
  box-shadow:0 28px 70px rgba(0,0,0,0.22);
}
.partner-hero__seal img { width:100%; height:auto; filter:drop-shadow(0 18px 26px rgba(0,0,0,0.20)); }
.criteria-panel {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:0.85rem 1.25rem;
  padding:2rem;
  background:var(--white);
  border:1px solid var(--gray-100);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md);
}
.criteria-panel__item {
  display:flex;
  align-items:flex-start;
  gap:0.75rem;
  font-size:0.92rem;
  color:var(--text-mid);
  line-height:1.55;
}
.criteria-panel__item svg {
  width:18px;
  height:18px;
  color:var(--orange);
  flex-shrink:0;
  margin-top:2px;
}
.seal-section {
  display:grid;
  grid-template-columns:minmax(220px, 0.45fr) minmax(0, 1fr);
  gap:clamp(2rem, 5vw, 4rem);
  align-items:center;
}
.seal-card {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:320px;
  padding:2rem;
  border-radius:var(--radius-xl);
  background:linear-gradient(145deg, var(--white), var(--gray-50));
  border:1px solid rgba(226,232,240,0.9);
  box-shadow:var(--shadow-lg);
}
.seal-card img { width:min(240px, 70%); height:auto; }
.note-box {
  margin-top:1.5rem;
  padding:1.2rem 1.35rem;
  background:var(--gray-50);
  border:1px solid var(--gray-200);
  border-left:4px solid var(--orange);
  border-radius:0 var(--radius) var(--radius) 0;
}
.note-box strong {
  display:block;
  font-family:var(--font-display);
  font-weight:800;
  text-transform:uppercase;
  color:var(--gray-900);
  margin-bottom:0.35rem;
}
.note-box p { font-size:0.9rem; color:var(--text-mid); line-height:1.65; }
.benefit-split {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:1.5rem;
}
.benefit-split .card { height:100%; }
.partner-link-panel {
  margin-top:1.5rem;
  padding:1.5rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
  border-radius:var(--radius-lg);
  background:linear-gradient(135deg, var(--blue-dark), var(--blue));
  color:var(--white);
  box-shadow:var(--shadow-blue);
}
.partner-link-panel p { color:var(--on-dark-body); font-size:0.92rem; max-width:680px; }
.partner-link-panel strong {
  display:block;
  font-family:var(--font-display);
  font-size:1.15rem;
  font-weight:800;
  text-transform:uppercase;
  color:var(--white);
  margin-bottom:0.25rem;
}
.notice { display:flex; gap:0.75rem; align-items:flex-start; background:var(--blue-light); border-radius:var(--radius); padding:1rem 1.25rem; }
.notice svg { width:18px; height:18px; color:var(--blue); flex-shrink:0; margin-top:2px; }
.notice p   { font-size:0.875rem; color:var(--text-mid); line-height:1.6; }
.portal-section .notice { background:rgba(255,255,255,0.1); border:1px solid var(--on-dark-border); }
.portal-section .notice svg { color:var(--orange); }
.portal-section .notice p { color:var(--on-dark-body); }

/* =========================================
   21. PORTAL PAGE ROLES
   ========================================= */
.role-section { display:grid; grid-template-columns:1fr 1.1fr; gap:4rem; align-items:center; }
.role-section--reverse { direction:rtl; }
.role-section--reverse > * { direction:ltr; }
.role-features { display:flex; flex-direction:column; gap:1rem; margin-top:1.5rem; }
.role-feature { display:flex; gap:0.75rem; align-items:flex-start; padding:1rem 1.25rem; background:var(--white); border-radius:var(--radius); border:1px solid var(--gray-100); box-shadow:var(--shadow-sm); }
.role-feature__icon { width:34px; height:34px; flex-shrink:0; border-radius:var(--radius-sm); background:var(--blue-light); display:flex; align-items:center; justify-content:center; }
.role-feature__icon svg { width:16px; height:16px; color:var(--blue); }
.role-feature h4 { font-size:0.9rem; font-weight:700; color:var(--gray-900); margin-bottom:2px; }
.role-feature p  { font-size:0.82rem; color:var(--text-mid); line-height:1.5; }

.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; }
.feature-card { background:var(--white); border-radius:var(--radius-lg); padding:1.75rem 1.5rem; border:1px solid var(--gray-100); box-shadow:var(--shadow-sm); transition:all var(--transition); }
.feature-card:hover { box-shadow:var(--shadow-md); transform:translateY(-3px); }
.feature-card__num { font-family:var(--font-display); font-size:2.5rem; font-weight:900; color:var(--blue-light); line-height:1; margin-bottom:0.75rem; }
.feature-card h3   { font-family:var(--font-display); font-size:1rem; font-weight:800; text-transform:uppercase; margin-bottom:0.5rem; color:var(--gray-900); }
.feature-card p    { font-size:0.85rem; color:var(--text-mid); line-height:1.6; }
.feature-card--dark { background:linear-gradient(135deg, var(--blue-dark), var(--blue)); border-color:transparent; text-align:center; padding:2rem 3rem; }
.feature-card--dark h3 { color:var(--on-dark); }
.feature-card--dark p { color:var(--on-dark-body); max-width:400px; margin:0 auto; }
.feature-card__icon { display:inline-flex; align-items:center; justify-content:center; width:52px; height:52px; border-radius:var(--radius); margin:0 auto 1rem; }
.feature-card__icon--dark { background:rgba(255,255,255,0.12); border:1px solid var(--on-dark-border); }

.portal-access-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.portal-access-icon { width:56px; height:56px; border-radius:var(--radius); background:var(--blue-light); display:flex; align-items:center; justify-content:center; margin:0 auto 1.25rem; }
.portal-access-icon--dark { background:rgba(255,255,255,0.12); border:1px solid var(--on-dark-border); }

/* =========================================
   22. LEGAL CONTENT
   ========================================= */
.legal-content { padding:clamp(2rem,4vw,3rem); }
.legal-content h2 { font-size:clamp(1.55rem,2.4vw,2rem); margin:2.25rem 0 1rem; color:var(--gray-900); }
.legal-content h2:first-child { margin-top:0; }
.legal-content h3 { font-size:1.15rem; margin:2rem 0 0.75rem; color:var(--gray-900); }
.legal-content h4 { font-family:var(--font-body); font-size:1rem; margin:1.5rem 0 0.6rem; color:var(--gray-900); }
.legal-content p { color:var(--text-mid); line-height:1.78; margin-bottom:1.1rem; }
.legal-content a { color:var(--blue); font-weight:600; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
.legal-content__source { margin-top:2rem; padding-top:1.25rem; border-top:1px solid var(--gray-200); font-size:0.92rem; }

/* =========================================
   23. IMAGE PLACEHOLDER
   ========================================= */
.img-placeholder { background:var(--gray-100); border-radius:var(--radius-lg); display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--gray-400); font-size:0.85rem; position:relative; overflow:hidden; border:2px dashed var(--gray-200); }
.img-placeholder::before { content:''; position:absolute; inset:0; background:repeating-linear-gradient(-45deg, transparent, transparent 12px, rgba(0,0,0,0.02) 12px, rgba(0,0,0,0.02) 24px); }
.img-placeholder__label { position:relative; z-index:1; text-align:center; padding:1.5rem; }
.img-placeholder__label strong { display:block; font-weight:700; color:var(--gray-500); margin-bottom:0.4rem; }
.img-placeholder__label code { font-size:0.72rem; background:var(--white); padding:2px 7px; border-radius:4px; }

/* =========================================
   24. FOOTER
   ========================================= */
.footer { position:relative; overflow:hidden; background:var(--gray-900); padding:5rem 0 2rem; }
.footer::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 60% 75% at 12% 8%, rgba(26,63,111,0.45) 0%, transparent 68%), linear-gradient(140deg, #091928 0%, #0F172A 72%, #0D2240 100%); }
.footer::after { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.022) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.022) 1px, transparent 1px); background-size:44px 44px; pointer-events:none; }
.footer .container { position:relative; z-index:1; }
.footer__grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:3.5rem; margin-bottom:3rem; padding-bottom:3rem; border-bottom:1px solid rgba(255,255,255,0.08); }
.footer__logo {
  display:inline-flex; align-items:center; gap:0.75rem; margin-bottom:1.25rem;
}
.site-logo--footer { height:52px; max-width:245px; }
.footer__logo-text { display:flex; flex-direction:column; line-height:1; }
.footer__logo-top { font-family:var(--font-display); font-size:0.9rem; font-weight:900; text-transform:uppercase; color:var(--white); }
.footer__logo-bot { font-family:var(--font-display); font-size:0.9rem; font-weight:900; text-transform:uppercase; color:var(--orange); }
.footer__brand p  { font-size:0.85rem; color:var(--on-dark-muted); line-height:1.65; margin-bottom:1.25rem; max-width:320px; }
.footer__heading  { font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.12em; color:var(--on-dark-muted); margin-bottom:1.25rem; }
.footer__links { display:flex; flex-direction:column; gap:0.65rem; }
.footer__links a { font-size:0.875rem; color:var(--on-dark-body); transition:color var(--transition),transform var(--transition); display:inline-block; }
.footer__links a:hover { transform:translateX(3px); }
.footer__links a:hover { color:var(--white); }
.footer__bottom { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.footer__copy   { font-size:0.78rem; color:var(--on-dark-muted); }
.footer__legal  { display:flex; gap:1rem 1.5rem; flex-wrap:wrap; justify-content:flex-end; }
.footer__legal a { font-size:0.78rem; color:var(--on-dark-muted); transition:color var(--transition); }
.footer__legal a:hover { color:var(--on-dark); }

/* =========================================
   24. SCROLL ANIMATIONS
   ========================================= */
.animate { opacity:0; transform:translateY(28px); transition:opacity 0.65s ease,transform 0.65s ease; }
.animate.visible { opacity:1; transform:translateY(0); }
.animate--delay-1 { transition-delay:0.1s; }
.animate--delay-2 { transition-delay:0.2s; }
.animate--delay-3 { transition-delay:0.3s; }
.animate--delay-4 { transition-delay:0.4s; }
.animate--delay-5 { transition-delay:0.5s; }
.animate-fade  { opacity:0; transition:opacity 0.65s ease; }
.animate-fade.visible { opacity:1; }
.animate-scale { opacity:0; transform:scale(0.94); transition:opacity 0.65s ease,transform 0.65s ease; }
.animate-scale.visible { opacity:1; transform:scale(1); }

/* =========================================
   25. UTILS / COMPAT
   ========================================= */
.mt-2 { margin-top:1rem; }
.mt-3 { margin-top:2rem; }
.mt-4 { margin-top:3rem; }
.mb-2 { margin-bottom:1rem; }
.mb-3 { margin-bottom:2rem; }
.text-center { text-align:center; }
.is-hidden {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

/* =========================================
   26. RESPONSIVE
   ========================================= */
@media (max-width:1100px) {
  .services-grid  { grid-template-columns:repeat(3,1fr); }
  .stats-grid     { grid-template-columns:repeat(2,1fr); gap:3rem; }
  .stats-grid .stat-item + .stat-item::before { display:none; }
  .feature-grid   { grid-template-columns:repeat(2,1fr); }
  .target-grid--4 { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:1024px) {
  .hero__grid           { grid-template-columns:1fr; padding:3rem 0 2.5rem; }
  .hero__visual         { display:flex; height:290px; overflow:hidden; margin-top:1.5rem; justify-content:center; }
  .portal-window        { zoom:0.62; flex-shrink:0; }
  .hero__float          { display:none; }
  .hero__sub            { max-width:100%; }
  .target-grid          { grid-template-columns:repeat(2,1fr); }
  .services-grid        { grid-template-columns:repeat(2,1fr); }
  .portal-section__grid { grid-template-columns:1fr; gap:3rem; }
  .portal-shot-grid     { grid-template-columns:1fr; }
  .process-grid         { grid-template-columns:repeat(3,1fr); gap:1.25rem; }
  .process-grid--6      { grid-template-columns:repeat(3,1fr); }
  .process-grid::before { display:none; }
  .benefit-grid         { grid-template-columns:repeat(2,1fr); }
  .two-col              { grid-template-columns:1fr; gap:2.5rem; }
  .partner-hero .container,
  .seal-section,
  .benefit-split        { grid-template-columns:1fr; }
  .partner-hero__seal   { justify-self:start; width:min(220px, 55vw); }
  .criteria-panel       { grid-template-columns:1fr; }
  .partner-link-panel   { align-items:flex-start; flex-direction:column; }
  .form-grid            { grid-template-columns:1fr; }
  .form-sidebar         { display:none; }
  .footer__grid         { grid-template-columns:1fr 1fr; gap:2.5rem; }
  .role-section         { grid-template-columns:1fr; }
  .role-section--reverse{ direction:ltr; }
  .nav__links           { display:none; }
  .nav__actions .btn--sm{ display:none; }
  .nav__toggle          { display:flex; }
  .nav__login           { display:block !important; }
}
@media (max-width:768px) {
  .section              { padding: clamp(3.5rem, 12vw, 5rem) 0; }
  .section__header      { margin-bottom: 2rem; }
  .target-grid          { grid-template-columns:1fr; }
  .services-grid        { grid-template-columns:repeat(2,1fr); }
  .process-grid         { grid-template-columns:repeat(2,1fr); }
  .process-grid--6      { grid-template-columns:repeat(2,1fr); }
  .benefit-grid         { grid-template-columns:1fr; }
  .stats-grid           { grid-template-columns:repeat(2,1fr); }
  .feature-grid         { grid-template-columns:1fr; }
  .cards--2,
  .cards--3,
  .portal-access-grid   { grid-template-columns:1fr; }
  .partner-hero__actions { flex-direction:column; align-items:stretch; max-width:420px; }
  .partner-hero__actions .btn { justify-content:center; width:100%; white-space:normal; line-height:1.25; }
  .seal-card            { min-height:240px; }
  .trust-bar__divider   { display:none; }
  .trust-bar__inner     { gap:1rem; }
  .hero__actions        { flex-direction:column; }
  .hero__actions .btn   { justify-content:center; }
  .portal-mockup-lg     { transform:none; }
  .portal-shot--tilted  { transform:none; }
  .portal-screenshot-slot { min-height:300px; }
  .partner-strip        { align-items:stretch; padding:1.25rem; }
  .partner-strip .btn   { justify-content:center; width:100%; }
  .cta-banner__actions  { flex-direction:column; align-items:stretch; max-width:420px; margin-left:auto; margin-right:auto; }
  .cta-banner__actions .btn { justify-content:center; width:100%; white-space:normal; line-height:1.25; }
  .footer__grid         { grid-template-columns:1fr; gap:2rem; }
  .footer__bottom       { flex-direction:column; text-align:center; }
  .footer__legal        { justify-content:center; }
  .form-row             { grid-template-columns:1fr; }
}
@media (max-width:480px) {
  .services-grid { grid-template-columns:1fr; }
  .process-grid  { grid-template-columns:1fr; }
  .process-grid--6 { grid-template-columns:1fr; }
  .stats-grid    { grid-template-columns:1fr; }
  .container     { padding:0 1rem; }
  .nav__login    { display:none !important; }
  .hero          { min-height:auto; }
  .hero__grid    { padding:2.25rem 0 2.5rem; }
  .hero__visual  { height:240px; }
  .portal-window { zoom:0.50; }
  .hero__trust   { gap:0.75rem 1rem; }
  .hero__trust-item { width:100%; }
  .btn--lg       { width:100%; justify-content:center; white-space:normal; text-align:center; line-height:1.2; }
  .trust-bar__inner { justify-content:flex-start; }
  .trust-bar__item { width:100%; justify-content:flex-start; }
  .target-card,
  .benefit-card,
  .service-card,
  .criteria-panel,
  .seal-card { padding:1.5rem; }
  .process-step { padding:0; }
  .process-step::before { transform:translateY(25px); }
  .portal-screenshot-slot { min-height:260px; padding:1.25rem; }
  .portal-screenshot-slot__label { padding:0.75rem 1rem; }
}

/* ── Cookie Banner ─────────────────────────────────────────────────── */
.cookie-banner {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 9999;
  background: #0f1e35;
  border-top: 2px solid var(--orange);
  padding: 1rem 0;
  box-shadow: 0 -4px 32px rgba(0,0,0,0.25);
  animation: cookieFadeIn 0.35s ease both;
}
@keyframes cookieFadeIn {
  from { transform: translateY(100%); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}
.cookie-banner__inner {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--container-pad);
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.cookie-banner__text {
  flex: 1;
  font-size: 0.875rem;
  color: var(--on-dark-body);
  line-height: 1.6;
  margin: 0;
  min-width: 200px;
}
.cookie-banner__text a {
  color: var(--orange);
  text-decoration: underline;
  white-space: nowrap;
}
.cookie-banner__text a:hover { color: #fff; }
@media (max-width:480px) {
  .cookie-banner__inner { gap: 1rem; }
  .cookie-banner__text  { font-size: 0.82rem; }
  .cookie-banner .btn   { width: 100%; justify-content: center; }
}