
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('./archivo-viet.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('./archivo-latext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('./archivo-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { font-family: 'Archivo', sans-serif; background: #fff; color: #15171C; overflow-x: hidden; }
a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font-family: 'Archivo', sans-serif; }

.wrap { max-width: 1240px; margin: 0 auto; width: 100%; padding: 0 clamp(18px,5vw,40px); }
.only-desktop { display: flex; }
.only-mobile { display: none; }
@media (max-width: 920px) { .only-desktop { display: none !important; } .only-mobile { display: flex !important; } }

@keyframes kb { from { transform: scale(1.001); } to { transform: scale(1.07); } }
@keyframes bnc { 0%,100% { transform: translateY(0); } 50% { transform: translateY(9px); } }

.rv { opacity: 0; transform: translateY(32px); transition: opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); }
.rv.visible { opacity: 1; transform: translateY(0); }
@supports not (animation-timeline: view()) { .rv { opacity: 1; transform: none; } }

/* Header */
.site-header { position:sticky;top:0;z-index:90;background:rgba(255,237,0,.97);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(0,0,0,.12);box-shadow:0 1px 0 rgba(0,0,0,.04); }
.site-header .wrap { height:80px;display:flex;align-items:center;justify-content:space-between;gap:24px; }
.nav-links { align-items:center;gap:clamp(14px,2vw,30px); }
.navlink { font:600 15px/1 Archivo;color:#004f9f;letter-spacing:.01em;transition:color .2s; }
.navlink:hover, .navlink.active { color:#000; }
.navlink.active { font-weight:700;color:#000; }
.btn-cta-nav { display:inline-flex;align-items:center;gap:8px;background:#004f9f;color:#fff;font:800 15px Archivo;padding:12px 20px;border-radius:3px;transition:background .2s,transform .2s; }
.btn-cta-nav:hover { background:#003c7a;transform:translateY(-1px); }
.hamburger { align-items:center;justify-content:center;width:48px;height:48px;background:#004f9f;border:none;border-radius:4px;cursor:pointer; }

.mobile-menu { position:fixed;inset:0;z-index:100;background:#ffed00;padding:0 clamp(18px,5vw,40px) 24px;display:none;flex-direction:column; }
.mobile-menu.open { display:flex; }
.mobile-menu-head { display:flex;align-items:center;justify-content:space-between;height:68px;flex:none; }
@media (max-width: 920px) {
  .site-logo { height:46px !important; }
  .site-header .wrap { height:68px; }
}
.mobile-menu-close { width:48px;height:48px;background:#004f9f;border:none;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center; }
.mobile-nav { display:flex;flex-direction:column;gap:4px;margin-top:32px; }
.mobile-nav a { font:700 28px Archivo;color:#15171C;padding:14px 0;border-bottom:1px solid rgba(0,79,159,.16); }
.mobile-nav a:last-child { border-bottom:none; }
.mobile-cta { margin-top:auto;display:flex;flex-direction:column;gap:12px; }

/* Hero */
.hero { position:relative;min-height:clamp(580px,90vh,900px);display:flex;align-items:flex-end;overflow:hidden;background:#00254d; }
.hero-bg { position:absolute;inset:0; }
.hero-bg img { position:absolute;inset:0;width:100%;height:100%;object-fit:cover; }
.hero-overlay { position:absolute;inset:0;background:linear-gradient(100deg,rgba(0,30,61,.93) 0%,rgba(0,30,61,.66) 44%,rgba(0,30,61,.3) 100%); }
.hero-fade { position:absolute;left:0;right:0;bottom:0;height:160px;background:linear-gradient(to top,rgba(0,30,61,.85),transparent); }
.hero-content { position:relative;z-index:2;padding:clamp(72px,10vw,120px) 0 clamp(48px,7vw,96px); }
.eyebrow-pill { display:inline-flex;align-items:center;gap:10px;background:rgba(255,237,0,.16);border:1px solid rgba(255,237,0,.45);color:#ffed00;font:700 12.5px Archivo;letter-spacing:.16em;text-transform:uppercase;padding:8px 14px;border-radius:100px;margin-bottom:24px; }
.eyebrow-pill span { width:7px;height:7px;background:#ffed00;border-radius:50%; }
.meta-badges { display:flex;flex-wrap:wrap;gap:12px;margin-top:30px; }
.meta-badge { display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#fff;font:600 14px Archivo;padding:10px 16px;border-radius:100px; }
.hero-btns { display:flex;flex-wrap:wrap;gap:14px;margin-top:34px; }
.btn-primary { display:inline-flex;align-items:center;gap:10px;background:#ffed00;color:#15171C;font:800 17px Archivo;padding:17px 28px;border-radius:4px;transition:background .2s,transform .2s; }
.btn-primary:hover { background:#fff34d;transform:translateY(-2px); }
.btn-secondary { display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,.06);color:#fff;font:700 17px Archivo;padding:17px 28px;border-radius:4px;border:1.5px solid rgba(255,255,255,.32);transition:background .2s,border-color .2s; }
.btn-secondary:hover { background:rgba(255,255,255,.13);border-color:#fff; }

/* Sections */
.sec-eyebrow { display:inline-flex;align-items:center;gap:10px;font:700 13px Archivo;letter-spacing:.18em;text-transform:uppercase;color:#15171C;margin-bottom:16px; }
.sec-eyebrow span { width:22px;height:3px;background:#ffed00; }
.sec-eyebrow.light { color:#ffed00; }
.sec-eyebrow.light span { background:#ffed00; }

/* Aufgaben */
.aufgaben-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:clamp(36px,5vw,72px); }
.task-card { display:flex;gap:18px;background:#F4F5F7;border:1px solid #E7E9EE;border-radius:10px;padding:22px 24px; }
.task-icon { width:46px;height:46px;border-radius:10px;background:#004f9f;display:flex;align-items:center;justify-content:center;flex:none; }

/* Qualifikationen */
.quals-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:clamp(16px,2vw,22px); }
.qual-card { background:#fff;border:1px solid #E7E9EE;border-radius:10px;padding:28px 26px; }

/* Vorteile */
.vorteile-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:1px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.09);border-radius:12px;overflow:hidden; }
.vorteil-cell { background:#16181D;padding:clamp(28px,3vw,38px);transition:background .25s; }
.vorteil-cell:hover { background:#1C1F26; }
.vorteil-num { width:48px;height:48px;border-radius:10px;background:#ffed00;display:flex;align-items:center;justify-content:center;font:800 16px Archivo;color:#15171C;margin-bottom:18px; }

/* Ablauf */
.steps-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:clamp(18px,2.5vw,28px); }
.step-card { position:relative;background:#F4F5F7;border:1px solid #E7E9EE;border-radius:12px;padding:34px 28px; }
.step-num { width:48px;height:48px;border-radius:50%;background:#ffed00;display:flex;align-items:center;justify-content:center;font:800 20px Archivo;color:#15171C;margin-bottom:18px; }

/* Formular */
.form-section { background:#004f9f;padding:clamp(60px,9vw,116px) clamp(18px,5vw,40px); }
.form-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:clamp(32px,4vw,64px);align-items:start; }
.form-card { background:#fff;border-radius:14px;padding:clamp(26px,3vw,40px);box-shadow:0 24px 60px rgba(0,30,61,.28); }
.kfield { font:500 16px Archivo;color:#16181D;padding:13px 14px;border:1px solid #D6DAE2;border-radius:6px;outline:none;width:100%;transition:border-color .2s;background:#fff; }
.kfield:focus { border-color:#004f9f; }
/* Einheitliche Feldhöhen (iOS rendert select/date sonst abweichend) */
input.kfield, select.kfield { height:50px; }
select.kfield { -webkit-appearance:none; appearance:none; background:#fff url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235A6472' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 14px center; padding-right:38px; }
input[type="date"].kfield { -webkit-appearance:none; appearance:none; display:block; min-width:0; }
input[type="date"].kfield::-webkit-date-and-time-value { text-align:left; }
.form-label { display:flex;flex-direction:column;gap:7px; }
.form-label > span { font:600 13px Archivo;color:#5A6472; }
.form-row { display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px; }
.success-state { display:none;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:440px;gap:18px; }
.success-state.visible { display:flex; }
.success-icon { width:74px;height:74px;border-radius:50%;background:#ffed00;display:flex;align-items:center;justify-content:center; }

/* Footer */
.site-footer { background:#111317;padding:clamp(56px,7vw,88px) clamp(18px,5vw,40px) 40px; }
.footer-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(32px,4vw,56px);padding-bottom:clamp(36px,4vw,52px);border-bottom:1px solid rgba(255,255,255,.1); }
.footer-col-title { font:700 13px Archivo;letter-spacing:.14em;text-transform:uppercase;color:#ffed00;margin-bottom:18px; }
.footer-links { display:flex;flex-direction:column;gap:11px; }
.footer-links a { font:500 15px Archivo;color:rgba(255,255,255,.7);transition:color .2s; }
.footer-links a:hover { color:#fff; }
.footer-bottom { display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding-top:26px; }
.social-btn { width:42px;height:42px;border-radius:9px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;transition:background .2s,border-color .2s; }
.social-btn:hover { background:#ffed00;border-color:#ffed00; }

.mbar { display:none;position:fixed;left:0;right:0;bottom:0;z-index:80;background:#004f9f;border-top:1px solid rgba(255,255,255,.12);padding:10px 12px;gap:10px; }
@media (max-width:920px) { .mbar { display:flex; } }
