:root {
    --landing-blue: #124d85;
    --landing-blue-deep: #082f56;
    --landing-blue-soft: #eaf4fc;
    --landing-orange: #ef791d;
    --landing-orange-deep: #cf5f10;
    --landing-green: #168465;
    --landing-violet: #7056ad;
    --landing-ink: #172536;
    --landing-muted: #607083;
    --landing-line: #dce5ee;
    --landing-soft: #f5f8fb;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; color: var(--landing-ink); background: #fff; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; line-height: 1.55; }
a { color: inherit; }
.landing-container { width: min(1120px, calc(100% - 40px)); margin: 0 auto; }

.landing-header { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid rgba(220, 229, 238, .9); background: rgba(255, 255, 255, .97); backdrop-filter: blur(12px); }
.landing-header__inner { display: flex; align-items: center; min-height: 74px; gap: 32px; }
.landing-brand { display: inline-flex; align-items: center; }
.landing-brand img { display: block; width: 155px; height: auto; }
.landing-nav { display: flex; gap: 24px; margin-left: auto; }
.landing-nav a, .landing-login-link, .landing-footer a { color: var(--landing-muted); font-size: .91rem; font-weight: 700; text-decoration: none; }
.landing-nav a:hover, .landing-login-link:hover, .landing-footer a:hover { color: var(--landing-blue); }
.landing-header__actions { display: flex; align-items: center; gap: 18px; }

.landing-button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 23px; border: 1px solid transparent; border-radius: 8px; font-size: .96rem; font-weight: 800; text-decoration: none; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.landing-button:hover { transform: translateY(-1px); }
.landing-button--small { min-height: 40px; padding: 0 16px; color: #fff; background: var(--landing-blue); font-size: .86rem; }
.landing-button--primary { color: #fff; background: var(--landing-orange); box-shadow: 0 10px 22px rgba(107, 43, 8, .28); }
.landing-button--primary:hover { background: var(--landing-orange-deep); }
.landing-button--outline { color: #fff; border-color: rgba(255, 255, 255, .68); background: rgba(4, 25, 46, .2); }
.landing-button--outline:hover { background: rgba(255, 255, 255, .13); }
.landing-button--light { color: var(--landing-blue-deep); background: #fff; }

.landing-hero { position: relative; min-height: 650px; isolation: isolate; color: #fff; background-image: linear-gradient(90deg, rgba(5, 24, 43, .92) 0%, rgba(7, 30, 52, .78) 30%, rgba(7, 30, 52, .26) 49%, rgba(7, 30, 52, .02) 68%), url('/assets/images/landing/hero-reparappe.png'); background-position: center; background-repeat: no-repeat; background-size: cover; }
.landing-hero::after { position: absolute; z-index: -1; right: 0; bottom: 0; left: 0; height: 32%; content: ""; background: linear-gradient(transparent, rgba(5, 24, 43, .38)); }
.landing-hero__content { display: flex; flex-direction: column; justify-content: center; min-height: 650px; max-width: 570px; padding: 86px 0; }
.landing-eyebrow, .landing-kicker { margin: 0 0 13px; color: var(--landing-orange); font-size: .76rem; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.landing-hero h1, .landing-section-heading h2, .landing-mobile-control h2, .landing-final-cta h2 { margin: 0; letter-spacing: -.047em; line-height: 1.04; }
.landing-hero h1 { max-width: 500px; font-size: clamp(3.05rem, 5.5vw, 5rem); }
.landing-hero h1 span { color: var(--landing-orange); }
.landing-hero__intro { margin: 22px 0 5px; font-size: 1.12rem; font-weight: 700; }
.landing-hero__lead { max-width: 460px; margin: 0; color: #e2edf6; font-size: 1.08rem; }
.landing-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 31px; }
.landing-hero__benefits { display: flex; flex-wrap: wrap; gap: 14px 23px; margin: 31px 0 0; padding: 0; list-style: none; color: #f4f8fb; font-size: .88rem; font-weight: 650; }
.landing-hero__benefits li::before { margin-right: 8px; color: #ffd3a7; content: "✓"; font-weight: 900; }

.landing-flow, .landing-functions { padding: 88px 0; }
.landing-section-heading { max-width: 700px; margin-bottom: 39px; }
.landing-section-heading--center { margin-right: auto; margin-left: auto; text-align: center; }
.landing-section-heading h2, .landing-mobile-control h2 { font-size: clamp(2rem, 3.5vw, 3.35rem); }
.landing-section-heading > p:last-child { margin: 15px 0 0; color: var(--landing-muted); font-size: 1.04rem; }
.landing-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; margin: 0; padding: 0; list-style: none; }
.landing-step { position: relative; min-height: 186px; padding: 10px 20px 10px 0; border-right: 1px solid var(--landing-line); }
.landing-step + .landing-step { padding-left: 21px; }.landing-step:last-child { border-right: 0; }
.landing-step__number { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; margin-bottom: 18px; border-radius: 50%; background: var(--landing-blue-soft); color: var(--landing-blue); font-size: .86rem; font-weight: 850; }
.landing-step strong { display: block; font-size: 1.05rem; text-transform: uppercase; letter-spacing: .035em; }.landing-step p { margin: 8px 0 0; color: var(--landing-muted); font-size: .87rem; }
.landing-step--orange .landing-step__number { color: var(--landing-orange-deep); background: #fff0e3; }.landing-step--violet .landing-step__number { color: var(--landing-violet); background: #f0ecfa; }.landing-step--green .landing-step__number { color: var(--landing-green); background: #e5f5ef; }

.landing-benefits { padding: 84px 0 90px; background: var(--landing-soft); }.landing-benefit-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }.landing-benefit-card { padding: 30px 27px; border: 1px solid #dce5ed; border-radius: 12px; background: #fff; box-shadow: 0 8px 20px rgba(29, 57, 83, .045); }
.landing-benefit-icon { display: inline-flex; align-items: center; justify-content: center; width: 43px; height: 43px; border-radius: 9px; color: var(--landing-blue); background: var(--landing-blue-soft); }.landing-benefit-icon--orange { color: var(--landing-orange-deep); background: #fff0e3; }.landing-benefit-icon--green { color: var(--landing-green); background: #e5f5ef; }.landing-benefit-icon svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }.landing-benefit-card h3 { margin: 20px 0 9px; font-size: 1.14rem; }.landing-benefit-card p { margin: 0; color: var(--landing-muted); font-size: .92rem; }

.landing-mobile-control { overflow: hidden; padding: 95px 0; background: linear-gradient(135deg, #f4f9fd 0%, #eaf3fa 100%); }.landing-mobile-control__grid { display: grid; grid-template-columns: .87fr 1.13fr; align-items: center; gap: clamp(42px, 7vw, 92px); }.landing-mobile-control__lead { margin: 18px 0 20px; color: var(--landing-blue); font-size: 1.2rem; font-weight: 750; }.landing-mobile-control ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; color: var(--landing-muted); font-size: .92rem; }.landing-mobile-control li::before { margin-right: 9px; color: var(--landing-orange); content: "✓"; font-weight: 900; }
.landing-dashboard-mockup { overflow: hidden; border: 1px solid #cbdce9; border-radius: 15px; background: #fff; box-shadow: 0 25px 50px rgba(18, 77, 133, .16); transform: rotate(1.3deg); }.landing-dashboard-mockup__bar { display: flex; align-items: center; min-height: 41px; gap: 6px; padding: 0 14px; border-bottom: 1px solid #e0e8ef; background: #f4f7fa; }.landing-dashboard-mockup__bar span { width: 8px; height: 8px; border-radius: 50%; background: #b8c7d5; }.landing-dashboard-mockup__bar span:first-child { background: #e69b92; }.landing-dashboard-mockup__bar span:nth-child(2) { background: #e7c77a; }.landing-dashboard-mockup__bar span:nth-child(3) { background: #88c3a1; }.landing-dashboard-mockup__bar b { margin-left: 8px; color: #52667a; font-size: .75rem; }.landing-dashboard-mockup__content { padding: clamp(17px, 3vw, 25px); }.landing-dashboard-mockup__heading { display: flex; justify-content: space-between; gap: 10px; color: #41576c; font-size: .79rem; font-weight: 750; }.landing-dashboard-mockup__heading b { padding: 4px 8px; border-radius: 5px; background: var(--landing-blue); color: #fff; font-size: .68rem; }.landing-dashboard-mockup__metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 17px 0; }.landing-dashboard-mockup__metrics span { min-width: 0; padding: 11px 8px; border: 1px solid #e0e8ef; border-left: 3px solid var(--landing-blue); border-radius: 6px; color: #69798a; font-size: .6rem; font-weight: 700; line-height: 1.25; }.landing-dashboard-mockup__metrics span:nth-child(2) { border-left-color: var(--landing-orange); }.landing-dashboard-mockup__metrics span:nth-child(3) { border-left-color: var(--landing-violet); }.landing-dashboard-mockup__metrics span:nth-child(4) { border-left-color: var(--landing-green); }.landing-dashboard-mockup__metrics strong { display: block; margin-bottom: 5px; color: var(--landing-ink); font-size: 1.25rem; line-height: 1; }
.landing-dashboard-mockup__list { padding: 14px; border: 1px solid #e0e8ef; border-radius: 8px; background: #fbfdff; color: #465d72; font-size: .75rem; }.landing-dashboard-mockup__list > b { font-size: .75rem; }.landing-dashboard-mockup__list p { display: flex; align-items: center; gap: 9px; margin: 11px 0 0; padding-top: 10px; border-top: 1px solid #edf1f5; }.landing-dashboard-mockup__list i { flex: 0 0 25px; width: 25px; height: 25px; border-radius: 7px; background: var(--landing-blue-soft); }.landing-dashboard-mockup__list-icon--orange { background: #fff0e3 !important; }.landing-dashboard-mockup__list span { flex: 1; font-weight: 700; }.landing-dashboard-mockup__list small { display: block; margin-top: 2px; color: #77889a; font-size: .63rem; font-weight: 500; }.landing-dashboard-mockup__list em { color: var(--landing-blue); font-size: 1.25rem; font-style: normal; }

.landing-functions { padding-top: 82px; padding-bottom: 52px; }.landing-function-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 11px 16px; margin: 0; padding: 0; list-style: none; }.landing-function-list li { padding: 12px 0; border-bottom: 1px solid var(--landing-line); color: #40556a; font-size: .92rem; font-weight: 700; }.landing-function-list li::before { margin-right: 8px; color: var(--landing-orange); content: "✓"; }
.landing-final-cta { padding: 87px 0; color: #fff; text-align: center; background: linear-gradient(125deg, var(--landing-blue-deep), var(--landing-blue)); }.landing-final-cta .landing-kicker { color: #ffa65f; }.landing-final-cta h2 { font-size: clamp(2.25rem, 4.1vw, 3.55rem); }.landing-final-cta p:not(.landing-kicker) { margin: 17px auto 28px; color: #d8e9f7; }
.landing-footer { padding: 29px 0; color: #f6fbff; background: #0c1d2e; }.landing-footer__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; }.landing-footer img { display: block; width: 172px; max-width: 100%; height: auto; }.landing-footer p { margin: 6px 0 0; color: #9bb1c5; font-size: .82rem; }.landing-footer nav { display: flex; gap: 21px; }.landing-footer a { color: #d6e4ef; }

@media (max-width: 900px) { .landing-header__inner { gap: 19px; }.landing-nav { gap: 15px; }.landing-header__actions { gap: 12px; }.landing-hero { min-height: 620px; background-position: 57% center; }.landing-hero__content { min-height: 620px; }.landing-steps { grid-template-columns: repeat(3, 1fr); row-gap: 28px; }.landing-step:nth-child(3) { border-right: 0; }.landing-mobile-control__grid { grid-template-columns: 1fr; }.landing-mobile-control__copy { max-width: 600px; }.landing-dashboard-mockup { max-width: 650px; }.landing-function-list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .landing-container { width: min(100% - 32px, 540px); }.landing-header__inner { display: grid; grid-template-columns: 1fr auto; min-height: 0; gap: 10px 14px; padding: 13px 0 11px; }.landing-brand img { width: 139px; }.landing-header__actions { gap: 10px; }.landing-login-link { font-size: .82rem; }.landing-button--small { min-height: 37px; padding: 0 11px; font-size: .78rem; }.landing-nav { grid-column: 1 / -1; margin: 0; gap: 19px; }.landing-nav a { font-size: .8rem; }.landing-hero { min-height: 610px; background-image: linear-gradient(180deg, rgba(5, 24, 43, .91) 0%, rgba(5, 24, 43, .78) 53%, rgba(5, 24, 43, .39) 100%), url('/assets/images/landing/hero-reparappe.png'); background-position: 56% center; }.landing-hero__content { min-height: 610px; justify-content: flex-start; padding-top: 71px; }.landing-hero h1 { font-size: clamp(2.75rem, 13vw, 3.55rem); }.landing-hero__intro { margin-top: 19px; font-size: 1rem; }.landing-hero__lead { font-size: .98rem; }.landing-hero__actions { display: grid; grid-template-columns: 1fr; margin-top: 25px; }.landing-hero__actions .landing-button { width: 100%; }.landing-hero__benefits { display: grid; gap: 8px; margin-top: 25px; }.landing-flow, .landing-functions { padding: 63px 0; }.landing-benefits { padding: 62px 0; }.landing-mobile-control { padding: 64px 0; }.landing-section-heading { margin-bottom: 29px; }.landing-section-heading h2, .landing-mobile-control h2 { font-size: 2.08rem; }.landing-steps { grid-template-columns: 1fr; gap: 0; }.landing-step, .landing-step + .landing-step, .landing-step:nth-child(3) { display: grid; grid-template-columns: 43px 1fr; column-gap: 9px; min-height: 0; padding: 16px 0; border-right: 0; border-bottom: 1px solid var(--landing-line); }.landing-step:last-child { border-bottom: 0; }.landing-step__number { grid-row: span 2; margin: 0; }.landing-step p { margin: 4px 0 0; }.landing-benefit-grid, .landing-function-list { grid-template-columns: 1fr; }.landing-benefit-card { padding: 23px; }.landing-dashboard-mockup { transform: none; }.landing-dashboard-mockup__metrics { grid-template-columns: repeat(2, 1fr); }.landing-functions { padding-bottom: 44px; }.landing-final-cta { padding: 66px 0; }.landing-final-cta .landing-button { width: 100%; }.landing-footer__inner { align-items: flex-start; flex-direction: column; gap: 18px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.landing-button { transition: none; } }
