/* ALKA BAU — statisches CSS, repliziert die Design-Tokens aus styles.css */

:root{

  --background:#fbfaf7;

  --foreground:#1c1b1a;

  --card:#ffffff;

  --primary:#f26e22;

  --primary-foreground:#fdfcfa;

  --secondary:#0d0d0c;

  --secondary-foreground:#f7f6f4;

  --muted:#f3f2ef;

  --muted-foreground:#6b6967;

  --accent:#ededea;

  --border:rgba(28,27,26,0.12);

  --brand-blue:#2660ad;

  --radius:10px;

}

*{box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{

  margin:0;background:var(--background);color:var(--foreground);

  font-family:"Inter Tight","Inter",system-ui,-apple-system,sans-serif;

  -webkit-font-smoothing:antialiased;

  line-height:1.5;

  overflow-x:hidden;

}

h1,h2,h3,h4{font-weight:700;letter-spacing:-0.03em;margin:0;}

p{margin:0;}

a{color:inherit;text-decoration:none;}

img{max-width:100%;display:block;}

.wrap{max-width:1280px;margin:0 auto;padding:0 20px;}

.mono{font-family:"JetBrains Mono",ui-monospace,monospace;}



/* ===== HEADER ===== */

.site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--border);}

.topbar{display:none;border-bottom:1px solid var(--border);}

.topbar-inner{height:36px;display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--muted-foreground);gap:16px;flex-wrap:wrap;}

.topbar-right{display:flex;gap:20px;align-items:center;}

.phone-link{color:var(--brand-blue);font-weight:600;white-space:nowrap;}

.header-inner{height:68px;display:flex;align-items:center;gap:16px;}

.brand{display:flex;align-items:center;gap:10px;flex-shrink:0;}

.brand-logo{height:32px;width:auto;object-fit:contain;}

.brand-text{display:flex;flex-direction:column;line-height:1.2;}

.brand-name{font-weight:700;font-size:14px;}

.brand-sub{font-size:9px;text-transform:uppercase;letter-spacing:.18em;color:var(--muted-foreground);}

.navbar{display:none;flex:1;gap:2px;flex-wrap:wrap;}

.navlink{padding:8px 10px;border-radius:6px;font-size:13px;font-weight:500;color:var(--muted-foreground);white-space:nowrap;}

.navlink:hover,.navlink.active{color:var(--foreground);background:var(--muted);}

.header-cta{display:none;margin-left:auto;flex-shrink:0;white-space:nowrap;}

.burger{margin-left:auto;background:none;border:none;font-size:24px;cursor:pointer;color:var(--foreground);line-height:1;padding:6px;}

.mnav{display:none;flex-direction:column;padding:20px;border-top:1px solid var(--border);max-height:calc(100vh - 68px);overflow-y:auto;}

.mnav.open{display:flex;}

.mnavlink{padding:14px 0;border-bottom:1px solid var(--border);font-weight:600;font-size:18px;}

.mnavlink.active{color:var(--primary);}

.mnav-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px;}

@media(min-width:1024px){

  .topbar{display:block;}

  .navbar{display:flex;}

  .header-cta{display:inline-flex;}

  .burger{display:none;}

}



/* ===== BUTTONS ===== */

.btn{display:inline-flex;align-items:center;gap:8px;justify-content:center;padding:12px 22px;border-radius:6px;font-weight:600;font-size:13px;letter-spacing:.02em;text-transform:uppercase;border:1px solid transparent;cursor:pointer;transition:.2s;white-space:normal;text-align:center;line-height:1.3;}

.btn-primary{background:var(--primary);color:var(--primary-foreground);}

.btn-primary:hover{opacity:.92;}

.btn-outline{border-color:var(--border);background:transparent;}

.btn-outline:hover{border-color:var(--primary);color:var(--primary);}

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

.btn-outline-light:hover{border-color:var(--primary);color:var(--primary);}

.btn-muted{background:var(--muted);color:var(--foreground);}

.btn-lg{padding:16px 26px;}

.btn-block{width:100%;}



/* ===== PAGEHERO ===== */

.pagehero{background:var(--secondary);color:var(--secondary-foreground);padding:130px 0 70px;overflow:hidden;}

.crumbs{font-size:12px;color:rgba(247,246,244,.6);margin-bottom:20px;}

.crumbs a:hover{color:var(--primary);}

.crumbs .sep{margin:0 4px;}

.crumbs .cur{color:rgba(247,246,244,.9);}

.eyebrow{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.3em;color:var(--primary);margin-bottom:14px;}

.hero-title{font-size:clamp(2rem,5vw,3.4rem);line-height:1.08;max-width:820px;}

.hero-desc{margin-top:18px;font-size:17px;color:rgba(247,246,244,.78);max-width:620px;line-height:1.6;}



/* ===== SECTIONS / LAYOUT ===== */

section{padding:70px 0;}

.section-tight{padding:50px 0;}

.bg-dark{background:var(--secondary);color:var(--secondary-foreground);}

.bg-accent{background:var(--accent);}

.bg-muted{background:var(--muted);}

.grid{display:grid;gap:24px;min-width:0;}

.cols-2{grid-template-columns:repeat(2,1fr);}

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

.cols-4{grid-template-columns:repeat(4,1fr);}

@media(max-width:900px){.cols-2,.cols-3,.cols-4{grid-template-columns:1fr;}}

.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:28px;min-width:0;}

.card:hover{border-color:var(--primary);}

.center{text-align:center;}

.muted{color:var(--muted-foreground);}

.lead{font-size:18px;line-height:1.7;color:var(--muted-foreground);}

.tag{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.15em;padding:5px 11px;border-radius:99px;background:var(--accent);white-space:nowrap;}

.tag-primary{background:var(--primary);color:var(--primary-foreground);}



/* HERO HOME */

.home-hero{position:relative;min-height:92vh;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;overflow:hidden;}

.home-hero img.bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}

.home-hero .overlay{position:absolute;inset:0;background:linear-gradient(to bottom, rgba(13,13,12,.45), rgba(13,13,12,.35) 40%, rgba(13,13,12,.9));z-index:1;}

.home-hero .content{position:relative;z-index:2;padding:160px 0 60px;}

.home-hero h1{font-size:clamp(2.6rem,8vw,6.5rem);line-height:.92;font-weight:700;}

.home-hero h1 em{font-style:italic;font-weight:300;}

.home-hero .sub{margin-top:28px;font-size:17px;max-width:420px;color:rgba(255,255,255,.82);line-height:1.6;}

@media(max-width:700px){

  .home-hero{min-height:auto;}

  .home-hero .content{padding:110px 0 40px;}

}

.stat-strip{position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.15);background:rgba(13,13,12,.5);}

.stat-strip .grid{grid-template-columns:repeat(4,1fr);gap:0;}

.stat-strip .stat{padding:22px 18px;border-left:1px solid rgba(255,255,255,.12);min-width:0;}

.stat-strip .stat:first-child{border-left:none;}

.stat-num{font-size:2rem;font-weight:700;}

.stat-label{font-size:10px;text-transform:uppercase;letter-spacing:.2em;color:rgba(255,255,255,.6);margin-top:4px;}

@media(max-width:800px){.stat-strip .grid{grid-template-columns:repeat(2,1fr);}.stat-strip .stat:nth-child(2n+1){border-left:none;}}



/* marquee */

.marquee-wrap{overflow:hidden;border-bottom:1px solid var(--border);padding:22px 0;}

.marquee{display:flex;white-space:nowrap;animation:marquee 36s linear infinite;width:max-content;}

.marquee span{font-size:2.4rem;font-weight:700;margin:0 28px;color:rgba(28,27,26,.75);}

.marquee span b{color:var(--primary);margin:0 28px;font-weight:700;}

@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

@media(prefers-reduced-motion: reduce){.marquee{animation:none;}}



/* project tiles */

.proj-feature{position:relative;overflow:hidden;border-radius:4px;aspect-ratio:16/10;display:block;}

.proj-feature img{width:100%;height:100%;object-fit:cover;}

.proj-feature .ov{position:absolute;inset:0;background:linear-gradient(to top, rgba(13,13,12,.85), transparent 60%);}

.proj-feature .info{position:absolute;left:0;bottom:0;right:0;padding:26px;color:#fff;}



.imgcard{border-radius:10px;overflow:hidden;border:1px solid var(--border);background:var(--card);display:flex;flex-direction:column;min-width:0;}

.imgcard img{aspect-ratio:16/10;object-fit:cover;width:100%;}

.imgcard .body{padding:20px;flex:1;display:flex;flex-direction:column;}



/* list row (leistungen home) */

.row-list a{display:grid;grid-template-columns:50px 1fr auto;gap:20px;align-items:center;padding:26px 0;border-bottom:1px solid var(--border);}

.row-list a:hover h3{color:var(--primary);}

.row-list-2col a{grid-template-columns:50px 1fr;border-bottom-color:rgba(247,246,244,.15);}

@media(max-width:640px){

  .row-list a{grid-template-columns:34px 1fr;row-gap:6px;}

  .row-list a > *:nth-child(3){display:none;}

}



/* faq */

details{border-bottom:1px solid var(--border);padding:18px 0;}

details summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;}

details summary::-webkit-details-marker{display:none;}

details summary span{flex-shrink:0;color:var(--primary);transition:transform .2s;}

details[open] summary span{transform:rotate(45deg);}

details p{margin-top:12px;color:var(--muted-foreground);line-height:1.6;}



/* footer */

.site-footer{background:var(--secondary);color:var(--secondary-foreground);}

.footer-cta{border-bottom:1px solid rgba(247,246,244,.1);}

.footer-cta-inner{padding:70px 0;display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;}

.footer-h2{font-size:clamp(1.8rem,4vw,3.4rem);line-height:1;margin-top:18px;}

.dim{color:rgba(247,246,244,.4);}

.footer-cta-actions{display:flex;flex-direction:column;gap:12px;min-width:260px;flex:0 1 320px;}

.footer-cta-actions .btn{white-space:normal;text-align:center;}

.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px;padding:60px 0;}

.footer-col{min-width:0;}

.footer-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;font-size:14px;}

.footer-col a:hover{color:var(--primary);}

.footer-label{font-size:10px;text-transform:uppercase;letter-spacing:.2em;color:rgba(247,246,244,.5);margin-bottom:18px;}

.footer-desc{margin-top:20px;font-size:14px;color:rgba(247,246,244,.65);max-width:280px;line-height:1.6;}

address{font-style:normal;font-size:14px;color:rgba(247,246,244,.8);line-height:1.7;}

.footer-contact-links{display:flex;flex-direction:column;margin-top:10px;}

.footer-contact-links a:hover{color:var(--primary);}

.footer-bottom{border-top:1px solid rgba(247,246,244,.1);}

.footer-bottom-inner{padding:22px 0;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12px;color:rgba(247,246,244,.5);}

.footer-bottom-links{display:flex;gap:24px;flex-wrap:wrap;}

.footer-bottom-links a:hover{color:var(--primary);}

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

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



/* forms */

form.box{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:30px;}

.field{display:block;margin-bottom:18px;min-width:0;}

.field label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;}

.field input,.field textarea,.field select{width:100%;max-width:100%;background:var(--background);border:1px solid var(--border);border-radius:6px;padding:10px 12px;font-size:14px;font-family:inherit;}

.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--primary);}

.checkrow{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--muted-foreground);margin-bottom:18px;}

.checkrow input{margin-top:3px;flex-shrink:0;}

.error{color:#c0392b;font-size:12px;margin-top:4px;display:block;}

.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;align-items:start;}

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



/* misc */

.cta-band{background:var(--secondary);color:var(--secondary-foreground);border-radius:16px;padding:48px;text-align:center;}

.pill{display:inline-flex;padding:9px 18px;border:1px solid var(--border);border-radius:99px;font-size:13px;font-weight:600;white-space:normal;text-align:center;line-height:1.3;}

.pill:hover{border-color:var(--primary);color:var(--primary);}

.filterbtn{padding:9px 16px;border-radius:99px;font-size:13px;font-weight:600;border:1px solid var(--border);background:transparent;cursor:pointer;}

.filterbtn.active{background:var(--primary);border-color:var(--primary);color:var(--primary-foreground);}

.success-box{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:50px;text-align:center;}

.success-icon{width:56px;height:56px;border-radius:99px;background:rgba(242,110,34,.12);color:var(--primary);display:grid;place-items:center;margin:0 auto;font-size:26px;}

.notice{border:1px dashed var(--border);background:var(--accent);border-radius:8px;padding:18px;font-size:13px;}

.iframe-wrap{border-radius:12px;overflow:hidden;border:1px solid var(--border);aspect-ratio:16/8;}

.iframe-wrap iframe{width:100%;height:100%;border:0;}



/* global safety nets */

table{max-width:100%;}

* { word-wrap: break-word; }

.wrap, .grid, .card, section { min-width:0; } 

