:root{
	--bg:#f4f7fb;
	--surface:#ffffff;
	--line:#e6ebf2;
	--text:#122034;
	--muted:#4b5f7b;
	--brand:#1f5e8c;
	--brand-2:#2f79ad;
	--brand-dark:#123e62;
	--radius:16px;
	--shadow:0 10px 30px rgba(16,39,66,.08);
	--nav-offset:52px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
html.anna-i18n-pending body{visibility:hidden;}
body{
	margin:0;
        overflow-x:hidden;
	background:linear-gradient(180deg,#f7f9fc 0%,var(--bg) 100%);
	line-height:1.6;
}

section[id],
div[id],
main[id],
article[id]{
	scroll-margin-top:var(--nav-offset);
}

.container{max-width:1180px;margin:auto;padding:12px 20px;}

/* ── MAIN NAV ── */
.nav{
	background:#fff;
	position:sticky;
	top:0;
	z-index:40;
	border-bottom:2px solid var(--line);
	box-shadow:0 2px 16px rgba(17,42,67,.08);
	transition:box-shadow .24s ease;
}

.nav.nav-scrolled{
	box-shadow:0 4px 24px rgba(16,39,66,.15);
}

.nav-main-inner{
	max-width:1180px;
	margin:auto;
	display:flex !important;
	flex-direction:row !important;
	align-items:center !important;
	justify-content:space-between !important;
	gap:10px;
	padding:0 20px;
	min-height:52px;
}

/* Logo area */
.nav-logo-link{
	display:flex;
	align-items:center;
	gap:10px;
	text-decoration:none;
	flex-shrink:0;
	padding:2px 0;
}
.logo-icon{
	height:44px;
	width:auto;
	max-width:200px;
	object-fit:contain;
	display:block;
	border-radius:0;
	background:transparent;
	padding:0;
	box-shadow:none;
}
/* legacy .logo — secondary pages */
.logo{height:92px;width:92px;object-fit:contain;display:block;border-radius:14px;background:#fff;padding:5px;box-shadow:0 2px 8px rgba(0,0,0,0.15);}

/* Nav items */
.nav nav{
	display:flex;
	align-items:center;
	gap:2px;
	flex:1;
	justify-content:center;
	flex-wrap:nowrap;
}

.nav-toggle{
	display:none;
	border:none;
	background:transparent;
	color:var(--text);
	cursor:pointer;
	padding:8px;
	gap:5px;
	flex-direction:column;
	align-items:center;
	justify-content:center;
}
.nav-toggle__bar{
	display:block;
	width:24px;
	height:2px;
	background:var(--text);
	border-radius:2px;
	transition:transform .22s ease, opacity .22s ease;
}

.nav a{
	display:inline-flex;
	align-items:center;
	gap:6px;
	padding:6px 10px;
	text-decoration:none;
	color:#2a3d55;
	font-weight:700;
	font-size:1.05rem;
	border-bottom:3px solid transparent;
	transition:color .18s ease, border-color .18s ease;
	white-space:nowrap;
}

.nav a:hover{
	color:var(--brand);
	border-bottom-color:var(--brand);
}
.nav a.is-active{
	color:var(--brand-dark);
	border-bottom-color:var(--brand-dark);
}

.nav-icon{
	width:22px;
	height:22px;
	stroke:currentColor;
	flex-shrink:0;
	opacity:.8;
}

/* Nav right actions */
.nav-actions{
	display:flex;
	align-items:center;
	gap:8px;
	flex-shrink:0;
}
.nav-link-login{
	display:inline-flex;
	align-items:center;
	gap:6px;
	padding:5px 12px;
	color:#2a3d55;
	font-weight:700;
	font-size:1.05rem;
	text-decoration:none;
	border-radius:999px;
	transition:background .18s ease;
}
.nav-link-login:hover{background:#eef6ff;color:var(--brand);}
/* mobile-only: login + CTA inside hamburger menu */
.nav-link-login-mobile{display:none;align-items:center;gap:6px;padding:12px 10px;font-size:1rem;font-weight:700;color:#2a3d55;text-decoration:none;border-bottom:1px solid var(--line);}
.nav nav a.nav-link-login-mobile{display:none !important;}
.nav-cta-mobile{display:none;}

/* OLD .hero kept as fallback – not used anymore by index.html slider */
.hero{
	padding:34px 16px 24px;
	text-align:center;
	background:
		radial-gradient(1200px 380px at 50% -20%, #d9ebfb 0%, rgba(217,235,251,0) 70%),
		linear-gradient(180deg,#eef5fc 0%, #f8fbff 100%);
}

/* ── HERO SLIDER ── */
.hero-slider{
	position:relative;
	width:100%;
	overflow:hidden;
	background:#0c1e2e;
}

.hero-slides-track{
	display:flex;
	width:300%;
	transform:translateX(0%);
	transition:transform .55s cubic-bezier(.4,0,.2,1);
}

.hero-slide{
	position:relative;
	width:33.3333%;
        min-height:380px;
        max-height:none;
}

.hero-slide__bg{
	position:absolute;
	inset:0;
	z-index:0;
}
.hero-slide__bg img{
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center right;
	display:block;
	filter:brightness(.82) saturate(1.1);
	transition:transform 6s ease;
}
.hero-slide[data-active] .hero-slide__bg img{
	transform:scale(1.04);
}

.hero-slide__overlay{
	position:absolute;
	inset:0;
	z-index:1;
	background:linear-gradient(
		105deg,
		rgba(11,27,46,.82) 0%,
		rgba(11,27,46,.65) 45%,
		rgba(11,27,46,.1) 75%,
		transparent 100%
	);
}

.hero-slide__content{
	position:relative;
	z-index:2;
	max-width:1180px;
	margin:0 auto;
        padding:28px 40px 28px 48px;
        width:100%;
        color:#fff;
        text-align:left;
}

.hero-slide__content .eyebrow{
	background:rgba(255,255,255,.15);
	border:1px solid rgba(255,255,255,.3);
	color:#fff;
	font-size:.82rem;
}

.hero-slide__content h1{
	color:#fff;
	max-width:560px;
	font-size:clamp(1.7rem,3.5vw,2.8rem);
	margin-bottom:14px;
	text-shadow:0 2px 12px rgba(0,0,0,.3);
}

.hero-slide__content .lead{
	color:rgba(255,255,255,.88);
	max-width:480px;
	margin-left:0;
}

.hero-slide__content .hero-actions{
	justify-content:flex-start;
	margin-bottom:14px;
}

.hero-slide__content .hero-note{
	color:rgba(255,255,255,.72);
	font-size:.88rem;
}

/* Slider arrows */
.hero-slider__arrow{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	z-index:10;
	width:48px;
	height:48px;
	border-radius:50%;
	border:2px solid rgba(255,255,255,.5);
	background:rgba(0,0,0,.28);
	color:#fff;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	transition:background .2s ease, border-color .2s ease;
	backdrop-filter:blur(6px);
}
.hero-slider__arrow:hover{
	background:rgba(0,0,0,.55);
	border-color:rgba(255,255,255,.85);
}
.hero-slider__arrow svg{width:22px;height:22px;}
.hero-slider__arrow--prev{left:20px;}
.hero-slider__arrow--next{right:20px;}

/* Slider dots */
.hero-slider__dots{
	position:absolute;
	bottom:20px;
	left:50%;
	transform:translateX(-50%);
	z-index:10;
	display:flex;
	gap:10px;
}
.hero-slider__dot{
	width:10px;
	height:10px;
	border-radius:50%;
	border:2px solid rgba(255,255,255,.6);
	background:transparent;
	cursor:pointer;
	padding:0;
	transition:background .22s ease, border-color .22s ease, transform .22s ease;
}
.hero-slider__dot--active{
	background:#fff;
	border-color:#fff;
	transform:scale(1.3);
}
.hero-slider__dot:hover{border-color:#fff;}

@media(max-width:768px){
	.hero-slide{min-height:auto;max-height:none;}
	.hero-slide__content{padding:24px 16px 28px;}
	.hero-slide__content h1{font-size:clamp(1.4rem,5vw,1.9rem);}
	.hero-slider__arrow{width:38px;height:38px;}
	.hero-slider__arrow svg{width:18px;height:18px;}
}

h1{font-size:clamp(2rem,4.2vw,3.3rem);line-height:1.15;margin:0 0 16px;letter-spacing:-.02em;}
h2{font-size:clamp(1.55rem,3vw,2.2rem);line-height:1.2;margin:0 0 14px;letter-spacing:-.01em;}
h3{margin:0 0 8px;font-size:1.15rem;}

.lead{font-size:1.05rem;max-width:760px;margin:0 auto 16px;color:var(--muted);}

.eyebrow{
	display:inline-block;
	margin:0 0 10px;
	padding:6px 12px;
	border-radius:999px;
	background:#e9f3ff;
	border:1px solid #cfe4fb;
	font-size:.85rem;
	font-weight:700;
	letter-spacing:.02em;
	color:#194f79;
	text-transform:uppercase;
}

.hero-actions{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:10px;}

.hero-note{
	margin:10px auto 0;
	color:#2e4c6a;
	font-size:.94rem;
	font-weight:600;
}

.hero-visual{margin:18px auto 4px;max-width:940px;}
.hero-visual img{width:100%;height:auto;display:block;border-radius:22px;border:1px solid #d6e8fb;box-shadow:var(--shadow);}

.hero-device-showcase{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:12px;
	max-width:920px;
}

.device-shot{
	background:#fff;
	border:1px solid #d6e8fb;
	border-radius:18px;
	padding:10px;
	box-shadow:var(--shadow);
	text-align:left;
}

.device-shot img{
	width:100%;
	height:auto;
	border-radius:12px;
	border:1px solid #d8e9fb;
	background:#f7fbff;
}

.device-shot p{
	margin:8px 4px 2px;
	font-size:.9rem;
	line-height:1.35;
	color:#2a4665;
	font-weight:600;
}

.device-shot--left{transform:rotate(-1.2deg);}
.device-shot--right{transform:rotate(1.2deg);}

.hero-highlights{
	max-width:1060px;
	margin:0 auto 10px;
	padding:10px 14px;
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
	gap:10px;
	background:#0f2f45;
	color:#fff;
	border-radius:14px;
	border:1px solid rgba(255,255,255,.12);
	box-shadow:0 12px 32px rgba(13,34,55,.22);
}

.hero-highlights__item{
	text-align:center;
	font-weight:700;
	padding:10px 8px;
	border-radius:10px;
	background:rgba(255,255,255,.06);
	border:1px solid rgba(255,255,255,.08);
}

.section{padding:18px 16px;}
.section.light{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}

.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;}

.card{
	background:var(--surface);
	padding:14px;
	border-radius:var(--radius);
	border:1px solid var(--line);
	box-shadow:var(--shadow);
}

.card[data-plan-slot]{
	position:relative;
	overflow:visible;
	--plan-badge-height:30px;
	--plan-badge-lift:18px;
	padding-top:calc(var(--plan-badge-height) + 20px);
	transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
        /* flex column so CTA sticks to bottom */
        display:flex;
        flex-direction:column;
}

.card[data-plan-slot]::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	right:0;
	height:8px;
	background:linear-gradient(90deg,#6f87a5 0%,#92a8c3 100%);
}

.card[data-plan-slot="basic"]::before,
.card[data-plan-id="basic"]::before{
	background:linear-gradient(90deg,#5ea86f 0%,#2e7f43 100%);
}

.card[data-plan-slot="plus"]::before,
.card[data-plan-id="plus"]::before{
        background:linear-gradient(90deg,#f0cb66 0%,#d6a63a 100%);
}

.card[data-plan-slot="premium"]::before,
.card[data-plan-id="premium"]::before{
	background:linear-gradient(180deg,#ffffff 0%,#f5f9ff 100%);
}

.card.plan-popular{
	position:relative;
	border:2px solid #d6a93a;
	background:linear-gradient(180deg,#fffdf6 0%,#fff8e6 100%);
	box-shadow:0 16px 36px rgba(150,111,16,.24);
}

.card.plan-popular::before{
	background:linear-gradient(90deg,#f0cb66 0%,#d6a63a 100%);
}

.plan-badge{
	position:absolute;
	top:calc(-1 * var(--plan-badge-lift));
	left:50%;
	transform:translateX(-50%);
	z-index:5;
	display:inline-flex;
	align-items:center;
	gap:6px;
	min-height:var(--plan-badge-height);
	padding:5px 10px;
	white-space:nowrap;
	border-radius:999px;
	background:linear-gradient(180deg,#f6d373 0%,#e8b948 100%);
	border:1px solid #cb9a2e;
	color:#47340f;
	font-size:.92rem;
	font-weight:800;
	letter-spacing:.01em;
}

.plan-name{margin-top:8px;line-height:1.2;}

.card.plan-popular .plan-name,
.card.highlight .plan-name{
	margin-top:12px;
}

/* Price: bold + prominent */
.plan-price{
        font-size:1.5rem;
        font-weight:800;
        color:var(--brand-dark);
        margin:6px 0 4px;
        letter-spacing:-.01em;
}

/* Features grow to fill space, pushing CTA to bottom */
.plan-features{
        flex:1;
}

/* CTA button — ANNA brand color, always at bottom */
.plan-cta{
        width:100%;
        margin-top:16px;
        padding:13px 14px;
        font-weight:800;
        font-size:1rem;
        background:linear-gradient(180deg,var(--brand-2,#2b8fd4) 0%,var(--brand,#1a6fb8) 100%);
        color:#fff;
        border:none;
        border-radius:999px;
        cursor:pointer;
        text-align:center;
        text-decoration:none;
        display:block;
        transition:background .18s,box-shadow .18s,transform .12s;
}
.plan-cta:hover{
        background:linear-gradient(180deg,#3a9ee3 0%,#1560a0 100%);
        box-shadow:0 6px 18px rgba(26,111,184,.35);
        transform:translateY(-1px);
}

/* Selected plan state */
.card[data-plan-slot].is-selected{
        border:2px solid var(--brand);
        box-shadow:0 0 0 4px rgba(26,111,184,.15), 0 16px 36px rgba(14,35,56,.18);
}
.card[data-plan-slot].is-selected .plan-cta{
        background:linear-gradient(180deg,#0f5fa3 0%,#0d4d87 100%);
        box-shadow:0 4px 14px rgba(13,77,135,.45);
	background:#f4f9ff;
	color:#234161;
	font-size:1.03rem;
	line-height:1.5;
}

.b2b-note strong{color:#173a5e;}
.b2b-note a{margin-left:8px;color:var(--brand);font-weight:800;text-decoration:none;}
.b2b-note a:hover{text-decoration:underline;}

.inquiry-wrap{padding:20px 16px 24px;}
.inquiry-card{
	background:#fff;
	border:1px solid var(--line);
	border-radius:16px;
	box-shadow:var(--shadow);
	padding:16px;
}

.inquiry-grid{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:12px;
	margin-top:12px;
}

.inquiry-field{display:flex;flex-direction:column;gap:6px;}
.inquiry-field.full{grid-column:1/-1;}
.inquiry-field label{font-weight:700;color:#23415f;}
.inquiry-field input,
.inquiry-field select,
.inquiry-field textarea{
	width:100%;
	border:1px solid #c9d9ea;
	border-radius:10px;
	padding:10px 12px;
	font:inherit;
	color:var(--text);
	background:#fff;
}

.inquiry-field textarea{min-height:200px;resize:vertical;}
.inquiry-hint{font-size:.85rem;color:#56718f;}
.inquiry-actions{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap;}

@media (max-width:900px){
	.inquiry-grid{grid-template-columns:1fr;}
}

.btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:12px 24px;
	border-radius:999px;
	text-decoration:none;
	border:1px solid transparent;
	transition:.2s ease;
}

.btn.primary{
	background:linear-gradient(180deg,var(--brand-2) 0%, var(--brand) 100%);
	color:#fff;
	font-weight:700;
	box-shadow:0 8px 24px rgba(31,94,140,.28);
}

.btn.primary:hover{transform:translateY(-1px);background:linear-gradient(180deg,var(--brand) 0%, var(--brand-dark) 100%);}

.btn.secondary{
	background:#fff;
	border-color:#ced9e8;
	color:var(--brand-dark);
	font-weight:700;
}

.btn.secondary:hover{border-color:#9eb9d7;color:var(--brand);transform:translateY(-1px);}

.btn.secondary.light{
	background:transparent;
	border-color:rgba(255,255,255,.5);
	color:#fff;
}

.btn.secondary.light:hover{border-color:#fff;color:#fff;}

.lang-switch{
	margin-left:10px;
	font-size:1.05rem;
	opacity:.9;
}

.lang-menu{position:relative;display:inline-block;}
.lang-menu summary{
	list-style:none;
	cursor:pointer;
	border:1px solid var(--line);
	border-radius:999px;
	padding:8px 12px;
	background:#fff;
	font-weight:700;
	font-size:1.05rem;
	color:var(--text);
}
.lang-menu summary::-webkit-details-marker{display:none;}
.lang-menu__list{
	position:absolute;
	right:0;
	top:calc(100% + 8px);
	min-width:280px;
	background:#fff;
	border:1px solid var(--line);
	border-radius:12px;
	box-shadow:var(--shadow);
	padding:8px;
	z-index:300;
	max-height:70vh;
	overflow-y:auto;
}
.lang-menu__list a{
	display:block;
	margin:0;
	padding:8px 10px;
	border-radius:8px;
	color:var(--text);
	text-decoration:none;
	font-weight:600;
}
.lang-menu__list a:hover{background:#f4f8fd;color:var(--brand);}

.lang-switch a{
	margin:0 4px;
	color:var(--brand);
	text-decoration:none;
	font-weight:700;
}

.nav-utility-link{
	margin-left:8px;
	text-decoration:none;
	font-weight:700;
	color:var(--brand-dark);
	padding:6px 10px;
	border:1px solid #ced9e8;
	border-radius:999px;
	background:#fff;
	display:inline-flex;
	align-items:center;
}

.nav-utility-link:hover{color:var(--brand);border-color:#9eb9d7;}

.lang-select-wrap{display:inline-block;}
.lang-select{
	appearance:none;
	-webkit-appearance:none;
	-moz-appearance:none;
	border:1px solid var(--line);
	border-radius:999px;
	padding:8px 34px 8px 12px;
	background:#fff;
	font-weight:700;
	color:var(--text);
	background-image:linear-gradient(45deg,transparent 50%,#4e6a86 50%),linear-gradient(135deg,#4e6a86 50%,transparent 50%);
	background-position:calc(100% - 16px) calc(50% - 2px),calc(100% - 11px) calc(50% - 2px);
	background-size:5px 5px,5px 5px;
	background-repeat:no-repeat;
}

.nav-cta{padding:10px 20px;font-size:1.0rem;white-space:nowrap;flex-shrink:0;font-weight:700;}
.lang-code-badge{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	font-size:.68rem;
	font-weight:800;
	letter-spacing:.03em;
	background:var(--brand);
	color:#fff;
	border-radius:4px;
	padding:1px 4px;
	min-width:22px;
	line-height:1.4;
	vertical-align:middle;
	margin-right:3px;
	flex-shrink:0;
}

.cta{text-align:center;background:linear-gradient(180deg,var(--brand) 0%,var(--brand-dark) 100%);color:#fff;}
.cta p{opacity:.92;}

.proof-strip{
	background: linear-gradient(135deg, #0f2f45 0%, #123e62 100%);
	color:#fff;
	padding:24px 0;
	border-top:1px solid rgba(255,255,255,.08);
	border-bottom:1px solid rgba(0,0,0,.2);
}

.proof-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
	gap:28px;
}

.proof-grid--3col{
	grid-template-columns:repeat(3,1fr);
}

.proof-item{
	display:flex;
	flex-direction:column;
	gap:10px;
	padding:16px;
	border-radius:12px;
	background:rgba(255,255,255,.05);
	border-left:3px solid rgba(100,180,255,.6);
	transition:all .3s ease;
}

.proof-item:hover{
	background:rgba(255,255,255,.08);
	border-left-color:rgba(100,180,255,.95);
	transform:translateY(-2px);
}

.proof-item__icon{
	font-size:1.3rem;
	color:rgba(100,180,255,.8);
	font-weight:700;
}

.proof-grid div{display:flex;flex-direction:column;gap:2px;}
.proof-grid strong{font-size:1.05rem;line-height:1.3;font-weight:700;margin-top:4px;}
.proof-grid span{font-size:.87rem;opacity:.85;line-height:1.5;}

@media(max-width:900px){
	.proof-grid--3col{ grid-template-columns:repeat(2,1fr); }
	.proof-strip{ padding:20px 0; }
}

@media(max-width:540px){
	.proof-grid--3col{ grid-template-columns:1fr; gap:16px; }
	.proof-item{ padding:14px; gap:8px; }
	.proof-grid strong{ font-size:.95rem; }
	.proof-grid span{ font-size:.81rem; }
	.proof-strip{ padding:16px 0; }
}

.scenario-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:10px;}

.checklist{margin:12px 0 0;padding-left:20px;color:#2a3d56;}
.checklist li{margin:6px 0;}

.demo-box{
	display:grid;
	grid-template-columns:1.3fr .9fr;
	gap:16px;
	align-items:stretch;
}

.demo-box .lead{max-width:unset;margin:0 0 16px;}

.demo-preview{
	border-radius:16px;
	border:1px solid #d5e3f2;
	background:linear-gradient(180deg,#f8fbff 0%,#eaf3fc 100%);
	padding:16px;
	box-shadow:var(--shadow);
	display:flex;
	flex-direction:column;
	justify-content:center;
	gap:8px;
}

.demo-preview p{margin:0;color:#17344f;font-weight:600;}
.demo-label{font-size:.78rem;letter-spacing:.08em;color:#42617f !important;}

.emotion-grid{display:grid;grid-template-columns:1.25fr .9fr;gap:16px;align-items:stretch;}

.emotion-card,
.emotion-facts{
	background:#fff;
	border:1px solid var(--line);
	border-radius:18px;
	padding:14px;
	box-shadow:var(--shadow);
}

.emotion-card img{width:100%;height:auto;display:block;border-radius:14px;border:1px solid #d8e9fb;margin-bottom:10px;}
.emotion-card p{margin:0;color:#2a3d56;}

.emotion-facts ul{margin:10px 0 14px;padding-left:20px;color:#2a3d56;}
.emotion-facts li{margin:8px 0;}

.source-note{font-size:.82rem;color:#5b6f88;margin-top:10px;}
.pricing-b2b-note{margin-top:24px;text-align:center;font-size:1.05rem;color:#1d4f7b;font-weight:700;}
.pricing-b2b-note a{color:#1d4f7b;font-weight:700;text-decoration:underline;font-size:1.05rem;}

/* Kern-Features Section */
.kern-features-section{background:#f0f6ff;}
.kern-features__grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:36px;}
.kern-feature{background:#fff;border-radius:16px;padding:28px 24px;box-shadow:0 2px 12px rgba(0,0,0,.07);display:flex;flex-direction:column;gap:14px;}
.kern-feature--highlight{background:#1d4f7b;color:#fff;}
.kern-feature--highlight h3{color:#fff;}
.kern-feature--highlight p,.kern-feature--highlight li{color:#cde3f7;}
.kern-feature--highlight .kern-feature__icon{background:rgba(255,255,255,.15);color:#fff;}
.kern-feature__icon{font-size:1.8rem;background:#e8f1fb;border-radius:10px;width:52px;height:52px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.kern-feature__body h3{font-size:1.15rem;margin-bottom:8px;color:#1d2f45;}
.kern-feature--highlight .kern-feature__body h3{color:#fff;}
.kern-feature__body ul{margin:10px 0 0;padding-left:18px;}
.kern-feature__body li{margin-bottom:5px;font-size:.9rem;color:#4a5f76;}
.kern-feature--highlight .kern-feature__body li{color:#cde3f7;}
.kern-features__cta{display:flex;gap:16px;justify-content:center;margin-top:36px;flex-wrap:wrap;}
@media(max-width:768px){.kern-features__grid{grid-template-columns:1fr;}}

.live-subscriptions{margin-top:12px;}
.live-subscriptions ul{margin:8px 0 0;padding-left:18px;color:#28415f;}
.live-subscriptions li{margin:4px 0;}

.plan-features{
	margin:10px 0 0;
	padding-left:18px;
	color:#28415f;
	font-size:.92rem;
}

.plan-features li{margin:4px 0;}

.waitlist-section{background:linear-gradient(120deg,#0f2f45 0%,#1f5e8c 100%);color:#fff;padding:28px 0;}
.waitlist-inner{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:24px;
	align-items:center;
}
.waitlist-text h2{margin:0 0 6px;color:#fff;}
.waitlist-text p{margin:0;opacity:.9;font-size:.97rem;}
.waitlist-form{display:flex;flex-direction:column;gap:10px;}
.waitlist-form input[type="email"]{
	padding:10px 14px;
	border-radius:9px;
	border:1.5px solid rgba(255,255,255,.3);
	background:rgba(255,255,255,.1);
	color:#fff;
	font-size:1rem;
	outline:none;
	transition:border-color .18s;
}
.waitlist-form input[type="email"]::placeholder{color:rgba(255,255,255,.6);}
.waitlist-form input[type="email"]:focus{border-color:#fff;}
.waitlist-note{margin:0;font-size:.88rem;}
@media(max-width:680px){
	.waitlist-inner{grid-template-columns:1fr;}
}

.billing-toggle{
	display:flex;
	gap:4px;
	background:#e8f0f8;
	border-radius:10px;
	padding:4px;
	width:fit-content;
	margin:0 auto 18px;
}
.billing-btn{
	border:none;
	background:transparent;
	border-radius:7px;
	padding:6px 18px;
	font-size:1.05rem;
	font-weight:600;
	color:var(--muted);
	cursor:pointer;
	transition:background .18s,color .18s;
	display:flex;
	align-items:center;
	gap:6px;
}
.billing-btn.active{background:#fff;color:var(--brand);box-shadow:0 1px 4px rgba(0,0,0,.1);}
.billing-save{
	background:#d1fae5;
	color:#065f46;
	border-radius:5px;
	padding:2px 8px;
	font-size:.92rem;
	font-weight:700;
}

.price-anchor-box{
	background:#f2f8ff;
	border:1px solid #cfe3f8;
	border-radius:14px;
	padding:12px;
	margin:8px 0 14px;
}

.price-anchor-box h3{margin:0 0 6px;color:#1d4f7b;}
.price-anchor-box p{margin:0;color:#2d4a67;}

.cta-banner{
	background:linear-gradient(120deg,#0f2f45 0%,#194f79 55%,#1f5e8c 100%);
	color:#fff;
	padding:0 0 10px;
	border-top:1px solid rgba(255,255,255,.1);
	border-bottom:1px solid rgba(0,0,0,.08);
}

.cta-banner__inner{
	background:rgba(255,255,255,.04);
	border:1px solid rgba(255,255,255,.14);
	border-radius:16px;
	padding:14px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:14px;
	box-shadow:0 18px 44px rgba(12,30,52,.32);
}

.cta-banner__inner h3{color:#fff;margin:4px 0 8px;}
.cta-banner__inner .lead{color:rgba(255,255,255,.9);margin:0;}
.cta-banner__actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;}
.cta-banner .btn.secondary{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28);color:#fff;}
.cta-banner .btn.secondary:hover{background:rgba(255,255,255,.16);border-color:#fff;color:#fff;}

.flow-visual{
	width:100%;
	height:auto;
	border-radius:16px;
	border:1px solid #d2e6fb;
	box-shadow:var(--shadow);
}

.logo-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
.logo-chip{
	display:inline-flex;
	align-items:center;
	padding:6px 10px;
	border-radius:999px;
	background:#eef5ff;
	border:1px solid #d2e3f7;
	font-size:.86rem;
	font-weight:700;
	color:#23476b;
}

.video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:8px 0 14px;}
.video-grid iframe{
	width:100%;
	aspect-ratio:16/9;
	border:1px solid #cfe1f7;
	border-radius:14px;
	box-shadow:var(--shadow);
	background:#0f2235;
}

.comparison-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:10px;}
.comparison-card{
	background:#fff;
	border:1px solid var(--line);
	border-radius:14px;
	box-shadow:var(--shadow);
	padding:14px;
}

.sales-impact h2{margin-bottom:6px;}
.sales-impact .comparison-card h3{margin-bottom:10px;}
.comparison-card.highlight{border:2px solid var(--brand);background:linear-gradient(180deg,#ffffff 0%,#f4f9ff 100%);}
.comparison-card ul{margin:10px 0 0;padding-left:18px;color:#2b405d;}
.comparison-card li{margin:6px 0;}

.promise-box{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
	background:#fff;
	border:1px solid var(--line);
	border-radius:16px;
	box-shadow:var(--shadow);
	padding:14px;
}
.promise-box h3{margin:4px 0 8px;}
.promise-box .lead{margin:0;color:#2b415d;}
.promise-box .btn.secondary{border-color:#ced9e8;color:var(--brand-dark);}

.ui-action-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
	gap:14px;
	margin-top:10px;
}

.ui-action-card{
	background:#fff;
	border:1px solid var(--line);
	border-radius:16px;
	padding:12px;
	box-shadow:var(--shadow);
}

.ui-action-card img{
	width:100%;
	height:auto;
	border-radius:12px;
	border:1px solid #d4e7fb;
	margin-bottom:10px;
}

.ui-action-card p{margin:0;color:#2b415c;}

.testimonial-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(270px,1fr));
	gap:16px;
	margin-top:16px;
}
.testimonial-card{
	background:#fff;
	border:1px solid var(--line);
	border-radius:16px;
	padding:18px 16px;
	box-shadow:var(--shadow);
	display:flex;
	flex-direction:column;
	gap:10px;
}
.testimonial-card blockquote{
	margin:0;
	color:#1f3852;
	font-size:.97rem;
	line-height:1.55;
	font-style:italic;
}
.testimonial-card footer{
	display:flex;
	flex-direction:column;
	gap:2px;
	margin-top:auto;
	padding-top:8px;
	border-top:1px solid var(--line);
}
.testimonial-card footer strong{color:#0f2f45;font-size:.93rem;}
.testimonial-card footer span{color:#5b6f88;font-size:.83rem;}

.faq-grid{display:grid;gap:10px;margin-top:10px;}
.faq-item{
	background:#fff;
	border:1px solid var(--line);
	border-radius:12px;
	padding:10px 12px;
	box-shadow:var(--shadow);
}
.faq-item summary{cursor:pointer;font-weight:800;color:#1b3855;}
.faq-item p{margin:8px 0 0;color:#2b405a;}

.rating-stars{
	color:#d4a017;
	font-size:1.05rem;
	letter-spacing:1px;
	margin-bottom:8px;
}

.anna-media-showcase{background:#fff;border-top:1px solid var(--line);}
.anna-media-showcase__images{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
	gap:12px;
	margin-top:10px;
}

.anna-media-showcase__images img{
	width:100%;
	height:auto;
	display:block;
	border-radius:14px;
	border:1px solid #d4e6fa;
	box-shadow:var(--shadow);
	background:#f7fbff;
}

.anna-media-showcase__videos{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
	gap:12px;
	margin-top:14px;
}

.anna-media-showcase__videos iframe{
	width:100%;
	aspect-ratio:16/9;
	border:1px solid #cfe1f7;
	border-radius:14px;
	box-shadow:var(--shadow);
	background:#0f2235;
}

.objection-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:10px;}

.sticky-cta{
	position:fixed;
	left:12px;
	right:12px;
	bottom:12px;
	z-index:120;
	display:none;
}

.sticky-cta__inner{
	background:#0f2f45;
	color:#fff;
	border-radius:14px;
	padding:10px 12px;
	border:1px solid rgba(255,255,255,.16);
	box-shadow:0 18px 42px rgba(10,30,52,.32);
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
}

.sticky-cta__inner p{margin:2px 0 0;opacity:.9;font-size:.95rem;}
.sticky-cta__actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.sticky-cta .btn.secondary{border-color:rgba(255,255,255,.5);color:#0f2f45;background:#fff;}

.footer{background:#0f2f45;color:#fff;padding:16px 14px;}
.footer a{color:#fff;text-decoration:none;opacity:.93;}
.footer a:hover{opacity:1;text-decoration:underline;}
.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.footer-col p{margin:.35rem 0;}
.footer-bottom{padding-top:8px;opacity:.9;border-top:1px solid rgba(255,255,255,.2);}
.footer-social{display:flex;align-items:center;gap:10px;margin-top:8px;}
.footer-social__icon{
	width:32px;
	height:32px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	border-radius:999px;
	background:#0a0a0a;
	color:#fff !important;
	font-weight:800;
	text-decoration:none !important;
	line-height:1;
	font-size:14px;
	opacity:1 !important;
}

.footer-social__icon:hover{transform:translateY(-1px);filter:brightness(1.08);}

/* Help chatbot */
.anna-help-chat{
	position:fixed;
	right:16px;
	bottom:16px;
	z-index:980;
	display:flex;
	flex-direction:column;
	align-items:flex-end;
	gap:8px;
}

.anna-help-chat__toggle{
	border:0;
	border-radius:999px;
	padding:10px 14px;
	font-weight:700;
	color:#122034;
	background:#fff;
	box-shadow:0 10px 28px rgba(15,33,53,.24);
	cursor:pointer;
	display:inline-flex;
	align-items:center;
	gap:10px;
}

.anna-help-chat__toggle-icon{font-size:18px;line-height:1;}

.anna-help-chat__toggle-badge{
	font-size:.72rem;
	font-weight:800;
	padding:4px 7px;
	border-radius:999px;
	background:#0f2f45;
	color:#fff;
}

.anna-help-chat__panel{
	width:min(360px, calc(100vw - 24px));
	background:#fff;
	border:1px solid var(--line);
	border-radius:14px;
	box-shadow:0 18px 48px rgba(14,33,56,.22);
	overflow:hidden;
}

.anna-help-chat__header{
	padding:10px 12px;
	background:#f2f8ff;
	border-bottom:1px solid #dbe9f9;
	color:#173e61;
}

.anna-help-chat__messages{
	height:220px;
	overflow:auto;
	padding:10px;
	background:#fff;
	display:flex;
	flex-direction:column;
	gap:8px;
}

.anna-help-chat__msg{
	max-width:92%;
	padding:8px 10px;
	border-radius:10px;
	font-size:.92rem;
	line-height:1.45;
}

.anna-help-chat__msg--bot{
	background:#f0f6fd;
	border:1px solid #d8e7f8;
	color:#1e3c5b;
	align-self:flex-start;
}

.anna-help-chat__msg--user{
	background:#1f5e8c;
	color:#fff;
	align-self:flex-end;
}

.anna-help-chat__form{
	display:flex;
	gap:8px;
	padding:10px;
	border-top:1px solid var(--line);
	background:#fbfdff;
}

.anna-help-chat__form input{
	flex:1;
	min-width:0;
	border:1px solid #c9d8ea;
	border-radius:8px;
	padding:10px;
	font:inherit;
}

.anna-help-chat__form button{
	border:0;
	border-radius:8px;
	padding:10px 12px;
	font-weight:700;
	color:#fff;
	background:var(--brand);
	cursor:pointer;
}

/* Legal pages */
.legal-wrap{min-height:100vh;display:flex;flex-direction:column;}
.legal-main{flex:1;}

.legal-hero{padding:14px 0 2px;}

.legal-card{
	background:#fff;
	border:1px solid var(--line);
	border-radius:18px;
	box-shadow:var(--shadow);
	padding:16px 14px;
}

.legal-card p,.legal-card li{color:#2a3d56;}
.legal-card ul{padding-left:20px;}

.legal-links{
	margin-top:20px;
	padding-top:16px;
	border-top:1px solid var(--line);
	display:flex;
	flex-wrap:wrap;
	gap:10px 14px;
}

.legal-links a{color:var(--brand);text-decoration:none;font-weight:600;}
.legal-links a:hover{text-decoration:underline;}

@media (max-width:1050px){
	.nav-main-inner{padding:0 14px;position:relative;}
	.logo-icon{height:48px;width:48px;}
	.hero-actions{justify-content:flex-start;}
	.demo-box{grid-template-columns:1fr;}
	.emotion-grid{grid-template-columns:1fr;}
	.footer-grid{grid-template-columns:1fr;}
	.logo{height:56px;width:56px;}
	.hero-device-showcase{grid-template-columns:1fr;}
	.device-shot--left,.device-shot--right{transform:none;}
	.anna-help-chat{right:12px;bottom:12px;}
	.sticky-cta{display:none;}
	.cta-banner__inner{flex-direction:column;align-items:flex-start;}
	.cta-banner__actions{justify-content:flex-start;}
	.promise-box{flex-direction:column;align-items:flex-start;}
}

.sticky-cta{display:none !important;}
.anna-help-chat{display:none !important;}

/* Cookie consent */
.cookie-consent{
	position:fixed;
	left:16px;
	right:16px;
	bottom:16px;
	z-index:1000;
	display:flex;
	justify-content:center;
}

.cookie-consent__box{
	width:min(860px,100%);
	background:#fff;
	border:1px solid var(--line);
	border-radius:14px;
	box-shadow:0 18px 48px rgba(14,33,56,.2);
	padding:16px;
}

.cookie-consent__title{font-weight:800;margin-bottom:4px;}
.cookie-consent__text{color:var(--muted);font-size:.95rem;}

.cookie-consent__actions{
	margin-top:12px;
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	align-items:center;
}

.cookie-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	border-radius:999px;
	padding:10px 16px;
	text-decoration:none;
	font-weight:700;
	border:1px solid var(--line);
	color:var(--text);
	background:#fff;
}

.cookie-btn:hover{border-color:#cfd8e6;}

.cookie-btn.primary{
	background:linear-gradient(180deg,var(--brand-2) 0%, var(--brand) 100%);
	border-color:transparent;
	color:#fff;
}

.cookie-btn.link{padding:0;border:0;background:transparent;color:var(--brand);font-weight:600;}

/* ── Store Badges ─────────────────────────────────────────── */
.store-badges{
        display:flex;
        justify-content:center;
        align-items:center;
        flex-wrap:wrap;
        gap:12px;
        margin-top:14px;
}
.store-badge{
        display:inline-flex;
        align-items:center;
        text-decoration:none;
        border-radius:10px;
        overflow:hidden;
        transition:opacity .2s,transform .2s;
        flex-shrink:0;
}
.store-badge:hover{opacity:.88;transform:translateY(-1px);}
.store-badge img{
        display:block;
        height:44px;
        width:auto;
}
@media(max-width:480px){.store-badge img{height:38px;}}

/* ── BOTTOM NAVIGATION (mobile only) ── */
.bottom-nav{display:none;}

@media(max-width:1050px){
/* Hide hamburger — bottom nav replaces it */
.nav-toggle{display:none !important;}
/* Hide desktop nav on mobile — multiple selectors for certainty */
.nav nav{display:none !important;}
#main-nav{display:none !important;}
/* Keep lang-switch visible in topbar on mobile */
.nav-actions{display:flex !important;flex-shrink:0 !important;align-items:center !important;gap:4px;}
.lang-switch{display:inline-flex !important;align-items:center !important;}
.lang-menu{display:block !important;}
.nav-cta{display:none !important;}
.nav-link-login{display:none !important;}
/* Dropdown via position:fixed — never clipped by ancestor overflow */
.lang-menu__list{position:fixed !important;top:58px !important;right:14px !important;max-height:calc(100vh - 130px) !important;}

/* Bottom nav bar */
.bottom-nav{
display:flex;
position:fixed;
bottom:0;
left:0;
right:0;
z-index:200;
background:#fff;
border-top:1px solid var(--line);
box-shadow:0 -4px 16px rgba(14,33,56,.10);
padding-bottom:env(safe-area-inset-bottom,0px);
}
.bottom-nav__item{
flex:1;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
padding:8px 2px 6px;
text-decoration:none;
color:var(--muted);
font-size:.68rem;
font-weight:700;
gap:3px;
min-height:56px;
border-top:2px solid transparent;
transition:color .18s,border-color .18s;
white-space:nowrap;
}
.bottom-nav__item svg{
width:22px;
height:22px;
stroke:currentColor;
flex-shrink:0;
}
.bottom-nav__item:hover,
.bottom-nav__item.is-active{
color:var(--brand);
border-top-color:var(--brand);
}
.bottom-nav__item--cta{
color:#fff;
background:var(--brand);
border-top-color:transparent;
}
.bottom-nav__item--cta svg{stroke:#fff;}
.bottom-nav__item--cta:hover{
background:var(--brand-dark);
color:#fff;
border-top-color:transparent;
}
/* Prevent content hidden behind bottom nav */
body{padding-bottom:calc(56px + env(safe-area-inset-bottom,0px));}
}

/* ── ANNA × app.annacare.eu symbiosis styles ── */

/* Nav "App öffnen" button */
.nav-open-app{
  font-size:.88rem;
  padding:6px 14px;
  white-space:nowrap;
}

/* Feature card deeplink */
.card-deeplink{
  display:inline-block;
  margin-top:10px;
  font-size:.82rem;
  font-weight:700;
  color:var(--brand);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:border-color .18s,color .18s;
}
.card-deeplink:hover{
  color:var(--brand-dark);
  border-bottom-color:var(--brand);
}

/* Pricing "try before buy" banner */
.try-before-buy-banner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
  background:linear-gradient(135deg,#e8f5e9 0%,#f0fdf4 100%);
  border:1px solid #a7d7a9;
  border-radius:14px;
  padding:14px 20px;
  margin-bottom:20px;
  font-weight:600;
  font-size:.97rem;
  color:#1b5e20;
}
.try-before-buy-banner .btn-sm{
  padding:7px 16px;
  font-size:.87rem;
  white-space:nowrap;
}
.btn-sm{
  padding:7px 16px;
  font-size:.87rem;
}

/* Demo section WebApp CTA */
.demo-webapp-cta{
  margin-top:20px;
  padding:18px 20px;
  background:#f0f6ff;
  border-radius:12px;
  border-left:4px solid var(--brand);
  text-align:center;
}
.demo-webapp-cta p{
  margin:0 0 12px;
  font-weight:600;
  color:var(--brand-dark);
}

/* Floating CTA */
.anna-float-cta{
  position:fixed;
  bottom:80px;
  right:20px;
  z-index:9000;
  background:#fff;
  border:2px solid var(--brand);
  border-radius:18px;
  box-shadow:0 8px 32px rgba(16,39,66,.22);
  padding:16px 20px;
  max-width:280px;
  opacity:0;
  transform:translateY(16px);
  transition:opacity .4s ease,transform .4s ease;
  pointer-events:none;
}
.anna-float-cta.is-visible{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.anna-float-cta__close{
  position:absolute;
  top:8px;
  right:10px;
  background:none;
  border:none;
  cursor:pointer;
  font-size:1.1rem;
  color:var(--muted);
  line-height:1;
  padding:2px 6px;
}
.anna-float-cta p{
  margin:0 0 10px;
  font-size:.9rem;
  font-weight:700;
  color:var(--text);
  padding-right:16px;
}
@media(max-width:700px){
  .anna-float-cta{
    right:12px;
    bottom:72px;
    max-width:calc(100vw - 24px);
  }
}

/* WebApp launcher (app.html) */
.webapp-launcher{
  max-width:760px;
  margin:0 auto;
  padding:48px 16px 64px;
  text-align:center;
}
.webapp-launcher__hero{margin-bottom:40px;}
.webapp-launcher__hero .eyebrow{
  display:inline-block;
  background:var(--brand-light,#e8f4ff);
  color:var(--brand-dark,#0d4a8a);
  font-size:.85rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:5px 14px;
  border-radius:999px;
  margin-bottom:14px;
}
.webapp-launcher__hero h1{
  font-size:clamp(1.6rem,4vw,2.4rem);
  line-height:1.2;
  margin-bottom:10px;
}
.webapp-launcher__hero .lead{
  color:var(--muted);
  max-width:520px;
  margin:0 auto;
}
.webapp-options{
  display:grid;
  grid-template-columns:1fr;
  gap:20px;
  max-width:640px;
  margin:0 auto 32px;
}
.webapp-option{
  background:#fff;
  border:2px solid var(--line);
  border-radius:20px;
  box-shadow:0 4px 20px rgba(0,0,0,.07);
  padding:28px 24px;
  text-align:center;
  text-decoration:none;
  transition:border-color .2s,box-shadow .2s,transform .2s;
}
.webapp-option:hover{
  border-color:var(--brand-2);
  box-shadow:0 8px 30px rgba(31,94,140,.16);
  transform:translateY(-2px);
}
.webapp-option--primary{
  border-color:var(--brand);
  background:linear-gradient(135deg,#e8f4ff 0%,#f0f7ff 100%);
}
.webapp-option__icon{font-size:2.4rem;margin-bottom:10px;}
.webapp-option__title{
  font-size:1.2rem;
  font-weight:800;
  color:var(--text);
  margin-bottom:6px;
}
.webapp-option__desc{
  font-size:.9rem;
  color:var(--muted);
  margin-bottom:14px;
}
.webapp-option--primary .webapp-option__title{color:var(--brand-dark);}
.webapp-coming{
  display:inline-block;
  padding:5px 14px;
  background:#f1f5f9;
  color:#64748b;
  font-size:.82rem;
  font-weight:600;
  border-radius:999px;
  border:1px solid var(--line);
}
.webapp-login-link{
  margin-top:8px;
  font-size:.95rem;
  color:var(--muted);
}
.webapp-login-link a{
  color:var(--brand);
  font-weight:700;
  text-decoration:none;
}
.webapp-login-link a:hover{text-decoration:underline;}

/* Install pages — Schritt 0 / WebApp block */
.webapp-first-section{background:linear-gradient(135deg,#e8f5e9 0%,#f0fdf4 100%);border-bottom:2px solid #c8e6c9;}
.webapp-option-box{
  background:#fff;
  border:2px solid var(--brand);
  border-radius:20px;
  box-shadow:0 4px 20px rgba(31,94,140,.12);
  padding:32px 28px;
  max-width:640px;
  margin:0 auto;
  text-align:center;
}
.webapp-option-box h2{margin:0 0 10px;font-size:1.4rem;}
.webapp-option-box p{color:var(--muted);margin-bottom:18px;}
.webapp-badge{
  display:inline-block;
  background:var(--brand);
  color:#fff;
  font-size:.8rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:4px 12px;
  border-radius:999px;
  margin-bottom:14px;
}
.webapp-sub{font-size:.88rem;color:var(--muted);margin-top:14px;margin-bottom:0;}

/* =====================================================
   STORY SECTION — "Kennen Sie das?"
   ===================================================== */
.story-section {
  background: var(--surface);
  border-top: 1px solid #e8eef6;
}
.story-badge {
  display: inline-block;
  background: rgba(31,94,140,.1);
  color: var(--brand);
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 5px 14px;
  border-radius: 999px;
  margin-bottom: 14px;
}
.story-header {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 48px;
}
.story-header h2 {
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
  margin-bottom: 16px;
}
.story-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 48px;
}
.story-pain {
  background: #f4f8fd;
  border-radius: var(--radius);
  padding: 28px 24px;
  border-left: 4px solid var(--brand);
  transition: transform .2s, box-shadow .2s;
}
.story-pain:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow);
}
.story-pain__icon {
  font-size: 2.2rem;
  margin-bottom: 14px;
  display: block;
}
.story-pain h3 {
  font-size: 1.05rem;
  font-weight: 700;
  margin-bottom: 8px;
  color: var(--text);
}
.story-pain p {
  font-size: .93rem;
  color: var(--muted);
  line-height: 1.6;
  margin: 0;
}
.story-solution {
  display: flex;
  align-items: center;
  gap: 40px;
  background: linear-gradient(135deg, #1a4d7a 0%, #2c75ab 100%);
  border-radius: 20px;
  padding: 40px 48px;
  color: #fff;
}
.story-solution__text { flex: 1; }
.story-solution__text h3 {
  font-size: 1.35rem;
  font-weight: 700;
  margin-bottom: 18px;
  color: #fff;
}
.story-quote {
  font-size: 1.1rem;
  font-style: italic;
  line-height: 1.75;
  color: rgba(255,255,255,.92);
  margin: 0 0 24px;
  border-left: 3px solid rgba(255,255,255,.4);
  padding-left: 18px;
}
.story-cta-group {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.story-solution__image {
  flex: 0 0 280px;
  max-width: 280px;
}
.story-solution__image img {
  width: 100%;
  height: auto;
  border-radius: 16px;
  filter: drop-shadow(0 8px 24px rgba(0,0,0,.25));
}

/* =====================================================
   KERN-FEATURES 5-COL LAYOUT
   ===================================================== */
.kern-features__grid--5col {
  grid-template-columns: repeat(5, 1fr);
}
.kern-feature--countdown {
  border-top: 4px solid var(--brand);
  background: linear-gradient(160deg, #f0f6ff 0%, #fff 100%);
}
.countdown-mockup {
  background: var(--brand);
  border-radius: 14px;
  padding: 16px 18px;
  margin: 18px 0;
  color: #fff;
  font-size: .88rem;
}
.countdown-mockup__header {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: .8rem;
  opacity: .8;
  margin-bottom: 8px;
}
.countdown-mockup__time {
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 4px;
}
.countdown-mockup__info {
  font-size: .85rem;
  opacity: .85;
}

/* =====================================================
   FEATURE CARDS — "Neu"-Badge
   ===================================================== */
.card--new {
  position: relative;
  border: 2px solid var(--brand);
}
.card__badge {
  display: inline-block;
  background: var(--brand);
  color: #fff;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 2px 10px;
  border-radius: 999px;
  margin-bottom: 10px;
}

/* =====================================================
   RESPONSIVE ADJUSTMENTS
   ===================================================== */
@media (max-width: 1100px) {
  .kern-features__grid--5col { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .story-grid { grid-template-columns: 1fr; }
  .story-solution { flex-direction: column; padding: 28px 24px; }
  .story-solution__image { flex: none; max-width: 100%; }
  .kern-features__grid--5col { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .kern-features__grid--5col { grid-template-columns: 1fr; }
}

/* =====================================================
   MENU OPTIMIZATION — Hide non-essential links on mobile
   ===================================================== */

/* On tablet (1024px): Hide secondary links, keep only core */
@media (max-width: 1024px) {
  /* Hide secondary nav items */
  .nav-link[href*="blog"],
  .nav-link[href*="docs"],
  .nav-link[href*="integrations"],
  .nav-link[href*="press"],
  .nav-link[href*="careers"],
  .nav-link[href*="affiliate"] {
    display: none !important;
  }
}

/* On mobile (768px): Ultra-slim menu */
@media (max-width: 768px) {
  .nav {
    padding: 0 12px;
  }
  
  /* Show only essential items + hamburger */
  .nav-link[href*="pricing"],
  .nav-link[href*="features"],
  .nav-link[href*="demo"] {
    font-size: 0.9rem;
  }
  
  /* Hide non-essential links */
  .nav-link[href*="blog"],
  .nav-link[href*="docs"],
  .nav-link[href*="integrations"],
  .nav-link[href*="press"],
  .nav-link[href*="careers"],
  .nav-link[href*="partner"],
  .nav-link[href*="affiliate"],
  .nav-link[href*="imprint"],
  .nav-link[href*="faq"],
  .nav-link[href*="about"] {
    display: none !important;
  }
}
