/* Lörrach adaptation of the two first Stuttgart Fachportale. Source pages are visual references, not deployed code. */
.topline{display:none}
body.crime{--accent:#aa2637;--muted:#625e61;--soft:#f4f2f0;--dark:#121212;--ink:#161616}
body.work{--accent:#2f86f5;--muted:#4d6173;--soft:#f2f7fb;--dark:#081f38;--ink:#112a45}
.wrap{width:min(100% - 40px,1160px)}
.site-header{position:absolute;z-index:20;inset:0 0 auto;background:transparent;border:0;color:#fff}
.site-header .wrap{width:min(100% - 40px,1280px)}
.header-inner{min-height:82px;padding:0;align-items:center}
.brand{flex-direction:row;align-items:center;gap:12px;min-width:0;color:#fff;white-space:nowrap}
.brand-mark{width:31px;height:31px;flex:none}
.brand-text{display:flex;flex-direction:column}
.brand strong{font:700 1.36rem Georgia,'Times New Roman',serif;text-transform:none;letter-spacing:0}
.brand-text,.brand-text strong{color:#fff}
.brand span span{font-size:.62rem;font-weight:700;color:#e4e8ec;letter-spacing:.13em;margin-top:4px}
.nav{gap:clamp(14px,2vw,31px)}
.nav a{font-size:.87rem;color:#fff;font-weight:700;text-shadow:0 1px 10px rgba(0,0,0,.7)}
.nav .nav-cta{border-radius:10px;padding:14px 19px;text-shadow:none;box-shadow:0 11px 26px -11px rgba(0,0,0,.8)}
.nav .nav-cta svg{display:none;width:22px;height:22px}
.crime .nav .nav-cta{background:linear-gradient(115deg,#76121f,#ad2537,#76121f)}
.work .nav .nav-cta{background:#ec8828;color:#fff}
.hero{position:relative;isolation:isolate;min-height:860px;padding:0;color:#fff;overflow:hidden}
.hero:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none}
.crime .hero{background:#080808 url('burg-roetteln-llez.jpg') center 43%/cover no-repeat}
.crime .hero:before{background:linear-gradient(90deg,rgba(4,4,4,.99) 0%,rgba(7,7,7,.95) 31%,rgba(6,6,6,.65) 58%,rgba(7,7,7,.25) 100%),linear-gradient(0deg,rgba(0,0,0,.82),transparent 60%)}
.work .hero{background:#061a31 url('loerrach-panorama-pierre-likissas.jpg') center 46%/cover no-repeat}
.work .hero:before{background:linear-gradient(90deg,rgba(2,18,37,.98) 0%,rgba(5,28,54,.94) 36%,rgba(7,35,66,.75) 63%,rgba(4,23,44,.55) 100%),linear-gradient(0deg,rgba(2,17,34,.78),transparent 58%)}
.hero .wrap{width:min(100% - 40px,1280px)}
.hero-grid{min-height:860px;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);align-items:center;gap:35px;padding-top:124px;padding-bottom:55px}
.hero-copy{max-width:750px}
.hero h1{max-width:12ch;font-size:clamp(3.5rem,6.15vw,5.35rem);line-height:1.02;font-weight:500;letter-spacing:-.035em;color:#fff;margin:0 0 28px;text-wrap:balance}
.hero .metallic{color:#d43c51;background:linear-gradient(105deg,#d5a4aa,#d73c52 34%,#a82738 70%,#e0a5ae);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero .hero-accent{color:#388dff}
.hero .lead{color:#eff2f6;font-size:1.05rem;line-height:1.65;text-shadow:0 1px 15px rgba(0,0,0,.45);max-width:62ch}
.hero .small-note{color:#e4e8ed;text-shadow:0 1px 12px #000;max-width:64ch}
.hero-actions{margin:24px 0 17px}
.hero-actions .btn{border-radius:11px;min-height:54px;padding:14px 22px;font-size:1rem}
.crime .hero-actions .btn-primary{background:linear-gradient(115deg,#78121d,#b6293b 48%,#831421)}
.work .hero-actions .btn-primary{background:#ec8828}
.hero-actions .btn-outline{border:1.5px solid rgba(255,255,255,.7);color:#fff;background:rgba(0,0,0,.2)}
.hero-actions .btn-outline:hover{background:rgba(255,255,255,.12)}
.crime .hero-intro{font:500 clamp(1.5rem,2.3vw,2rem)/1.28 Georgia,'Times New Roman',serif;color:#fff;margin:25px 0 14px}
.crime .hero-art{height:690px;align-self:end;width:100%;display:flex;align-items:end;justify-content:center}
.crime .hero-art:before{display:none}
.crime .hero-art img{width:auto;max-width:100%;height:100%;aspect-ratio:auto;object-fit:contain;object-position:center bottom;filter:none;mask-image:linear-gradient(#000 0 82%,transparent 99%)}
.choice-panel{border:1px solid rgba(255,255,255,.36);border-radius:18px;background:rgba(35,35,35,.83);backdrop-filter:blur(12px);padding:24px;box-shadow:0 20px 50px rgba(0,0,0,.25);color:#fff}
.choice-label{font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;font-weight:700;color:#edb4bc}
.choice-panel h2{font-size:clamp(1.55rem,2.4vw,2.05rem);color:#fff;letter-spacing:-.015em;margin:7px 0 10px}
.choice-panel p{color:#e7e8e9;font-size:.9rem;line-height:1.5;margin-bottom:17px}
.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.choice-grid a{color:#fff;text-decoration:none;background:rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.27);border-radius:11px;min-height:49px;padding:11px 12px;display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:.86rem;font-weight:700}
.choice-grid a:hover,.choice-grid a:focus-visible{background:rgba(255,255,255,.16);border-color:#fff}
.choice-grid a span{color:#da4a5b;font-size:1.1rem}
.crime .choice-panel{max-width:535px;margin:0 0 4px}
.crime .choice-panel:before{content:'';display:block;width:65px;height:3px;background:#b92d40;position:relative;top:-25px}
.work .choice-panel{max-width:420px;justify-self:end;background:rgba(15,49,82,.87);border-color:rgba(177,211,245,.45)}
.work .choice-label,.work .choice-grid a span{color:#f1a95b}
.work .choice-panel:before{content:'';display:block;width:65px;height:3px;background:#f2a03e;position:relative;top:-25px}
.work .hero-copy{align-self:center}
.work .hero .lead{max-width:58ch}
.work .hero-actions{margin-top:29px}
.section{padding:clamp(70px,7vw,100px) 0}
.section-intro{max-width:760px}
.section h2{font-size:clamp(2.15rem,3.7vw,3.5rem)}
.section-dark{background:var(--dark)}
.crime .section-dark .card{border-color:rgba(255,255,255,.21);border-radius:13px;background:rgba(255,255,255,.06)}
.crime .section-dark .card-number{color:#d44a5a}
.work .section-soft .card{border-radius:14px;border-color:#dce8f4;box-shadow:0 10px 35px -27px rgba(10,38,69,.3)}
.work .section-soft .card-number{color:#2f86f5}
.media-grid img{border-radius:5px}
.faq-list details{padding:20px 0}
.contact-card{border-radius:13px}
.site-footer{background:#0a0c10}
.work .site-footer{background:#071b30}
.crime .site-footer a:hover,.work .site-footer a:hover{color:#fff}
@media(max-width:1160px){.site-header .wrap,.hero .wrap{width:min(100% - 36px,1120px)}.nav{gap:16px}.nav a{font-size:.78rem}.hero-grid{gap:16px}.hero h1{font-size:clamp(3.2rem,6.1vw,4.75rem)}.crime .hero-art{height:610px}}
@media(max-width:900px){.site-header .wrap,.hero .wrap{width:min(100% - 36px,720px)}.header-inner{min-height:70px;display:flex;align-items:center;padding:0}.nav{margin:0}.nav a:not(.nav-cta){display:none}.nav .nav-cta{background:transparent!important;box-shadow:none;padding:9px;color:#fff}.nav .nav-cta svg{display:block}.nav .nav-cta span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.hero,.hero-grid{min-height:0}.hero-grid{display:grid;grid-template-columns:1fr;padding-top:125px;padding-bottom:66px}.hero h1{font-size:clamp(3.15rem,9vw,4.35rem)}.crime .hero-art{display:none}.work .hero-grid{display:flex;flex-direction:column;align-items:stretch;gap:0}.work .hero-copy{display:contents}.work .hero h1{order:1;margin-bottom:26px}.work .hero-grid>.choice-panel{order:2;max-width:100%;width:100%;align-self:stretch;margin-bottom:25px}.work .hero .lead{order:3;margin-bottom:0}.work .hero-actions{order:4}.work .hero .small-note{order:5}.crime .hero{background-position:center 30%}.work .hero{background-position:center 42%}}
@media(max-width:560px){.site-header .wrap,.hero .wrap{width:min(100% - 36px,450px)}.brand strong{font-size:1.19rem}.brand-mark{width:29px;height:29px}.brand span span{font-size:.56rem}.hero-grid{padding-top:118px;padding-bottom:64px}.hero h1{font-size:clamp(2.95rem,12vw,3.7rem);max-width:12ch}.hero .lead{font-size:1rem}.choice-panel{padding:20px;border-radius:16px}.choice-panel h2{font-size:1.6rem}.choice-grid a{font-size:.78rem;min-height:52px;padding:9px}.hero-actions .btn{width:100%}.crime .hero{background-position:53% center}.work .hero{background-position:55% center}.section{padding:65px 0}}