/*
Theme Name: Schröder Scan & BIM
Theme URI: https://www.laserscanning-rhein-main.de/
Author: Vermessungsbüro Schröder
Description: Landingpage für Laserscanning und BIM-Modellierung mit Projektkalkulator.
Version: 1.0.0
Text Domain: schroeder-scan-bim
*/

:root { --red:#ea002a; --ink:#16181d; --slate:#434750; --mist:#f4f5f6; --line:#d9dce0; --paper:#fff; --teal:#88dad3; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Arial", "Helvetica Neue", sans-serif; line-height:1.55; }
a { color:inherit; text-decoration:none; }
.site-shell { overflow:hidden; }
.container { width:min(1180px, calc(100% - 48px)); margin:0 auto; }
.site-header { position:absolute; z-index:20; top:0; inset-inline:0; color:#fff; border-bottom:1px solid rgba(255,255,255,.16); }
.header-row { min-height:82px; display:flex; align-items:center; justify-content:space-between; gap:28px; }
.brand { display:flex; align-items:center; gap:12px; font-size:13px; font-weight:700; letter-spacing:.025em; }
.brand-mark { width:34px; height:34px; background:var(--red); border-radius:6px; position:relative; display:grid; place-items:center; font-size:21px; font-weight:400; }
.brand-mark:after { content:""; position:absolute; inset:7px; border:1px solid rgba(255,255,255,.4); border-radius:2px; }
.brand strong { display:block; font-size:15px; letter-spacing:.08em; text-transform:uppercase; }
.brand span { display:block; font-size:11px; color:rgba(255,255,255,.72); }
.nav { display:flex; align-items:center; gap:29px; font-size:14px; font-weight:700; }
.nav a { color:rgba(255,255,255,.78); transition:color .2s; }
.nav a:hover { color:#fff; }
.nav .nav-cta { padding:9px 14px; color:#fff; border:1px solid rgba(255,255,255,.55); border-radius:3px; }
.hero { min-height:740px; color:white; position:relative; display:flex; align-items:flex-end; padding:155px 0 84px; background:radial-gradient(circle at 79% 39%, rgba(234,0,42,.72) 0 1%, transparent 1.5%), radial-gradient(circle at 75% 40%, rgba(234,0,42,.35) 0 2px, transparent 2.6%), linear-gradient(115deg, #101318 0%, #20262d 52%, #121519 100%); }
.hero:before { content:""; position:absolute; inset:0; opacity:.3; background-image:linear-gradient(90deg, transparent 49.85%, rgba(136,218,211,.4) 50%, transparent 50.15%), linear-gradient(0deg, transparent 49.85%, rgba(136,218,211,.32) 50%, transparent 50.15%); background-size:72px 72px; transform:perspective(380px) rotateX(54deg) scale(1.6); transform-origin:50% 100%; }
.hero:after { content:""; position:absolute; right:-16vw; top:8%; width:63vw; height:63vw; border-radius:50%; border:1px solid rgba(136,218,211,.33); box-shadow:0 0 0 70px rgba(136,218,211,.05), 0 0 0 140px rgba(136,218,211,.04), 0 0 0 210px rgba(136,218,211,.025); }
.hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:1.25fr .75fr; align-items:end; gap:60px; }
.eyebrow { display:inline-flex; align-items:center; gap:9px; text-transform:uppercase; letter-spacing:.16em; font-size:11px; font-weight:700; color:var(--teal); }
.eyebrow:before { content:""; display:block; width:23px; height:2px; background:var(--red); }
h1,h2,h3,p { margin-top:0; }
h1 { max-width:780px; margin:18px 0 25px; font-size:clamp(47px, 6.1vw, 82px); line-height:.99; letter-spacing:-.06em; }
.hero-copy { font-size:18px; max-width:570px; color:rgba(255,255,255,.8); }
.button { display:inline-flex; justify-content:center; align-items:center; min-height:48px; padding:0 23px; border:0; font:700 13px inherit; text-transform:uppercase; letter-spacing:.08em; cursor:pointer; transition:transform .2s, background .2s; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--red); color:#fff; }
.button-light { background:#fff; color:var(--ink); }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:31px; }
.hero-note { position:relative; padding:28px; border-left:2px solid var(--red); background:rgba(255,255,255,.06); backdrop-filter:blur(5px); }
.hero-note b { display:block; font-size:13px; text-transform:uppercase; letter-spacing:.1em; margin-bottom:9px; }
.hero-note p { color:rgba(255,255,255,.7); margin:0; font-size:14px; }
.intro { padding:108px 0; }
.intro-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:85px; }
.section-label { font-size:12px; color:var(--red); text-transform:uppercase; font-weight:700; letter-spacing:.13em; }
h2 { font-size:clamp(32px, 4.2vw, 55px); letter-spacing:-.05em; line-height:1.04; margin:12px 0 20px; }
.intro-text { padding-top:30px; font-size:18px; color:#535861; }
.benefits { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); margin-top:40px; }
.benefit { min-height:188px; background:#fff; padding:25px; }
.benefit-no { font-size:12px; color:var(--red); font-weight:700; }
.benefit h3 { margin:29px 0 7px; font-size:18px; }
.benefit p { margin:0; font-size:14px; color:#5b6068; }
.process { color:#fff; padding:100px 0; background:#1d2229; }
.process-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; }
.process h2 { color:#fff; }
.process-lead { color:rgba(255,255,255,.67); font-size:17px; }
.steps { border-top:1px solid rgba(255,255,255,.2); }
.step { display:grid; grid-template-columns:62px 1fr; padding:21px 0; border-bottom:1px solid rgba(255,255,255,.2); }
.step span { color:var(--red); font-size:13px; font-weight:700; }
.step h3 { font-size:18px; margin:0 0 4px; }
.step p { color:rgba(255,255,255,.62); font-size:14px; margin:0; }
.calculator { padding:110px 0; background:var(--mist); }
.calc-heading { display:grid; grid-template-columns:1fr .75fr; gap:70px; align-items:end; margin-bottom:39px; }
.calc-heading p { color:#5b6068; margin:0; }
.calc-layout { display:grid; grid-template-columns:1.07fr .93fr; background:#fff; box-shadow:0 16px 65px rgba(20,25,32,.11); }
.calc-form { padding:40px; }
.calc-form h3 { margin:0 0 26px; font-size:23px; letter-spacing:-.03em; }
.field { margin-bottom:21px; }
.field-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field-grid .field { min-width:0; }
.field-grid--metrics { grid-template-columns:1.25fr 1fr 1fr; align-items:end; }
.field-grid--metrics .field { display:flex; flex-direction:column; }
.field-grid--metrics .field label { height:36px; min-height:36px; }
.field-grid--metrics .field input { margin-top:auto; }
.field label { display:block; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; margin-bottom:7px; }
.field input,.field select { appearance:none; width:100%; min-height:50px; padding:0 14px; background:#fff; border:1px solid #cfd3d8; border-radius:0; color:var(--ink); font:16px inherit; }
.field select { background:linear-gradient(45deg,transparent 50%,#3c4047 50%) calc(100% - 20px) 22px/7px 7px no-repeat,linear-gradient(135deg,#3c4047 50%,transparent 50%) calc(100% - 14px) 22px/7px 7px no-repeat; }
.field-description { margin:7px 0 0; color:#686d74; font-size:12px; line-height:1.4; }
.special-options { margin:0 0 21px; padding:17px; border:1px solid #cfd3d8; background:#fafafa; }
.special-options[hidden], .check-option[hidden] { display:none !important; }
.special-options-title { display:block; margin-bottom:10px; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.check-option { display:flex; gap:10px; align-items:flex-start; padding:9px 0; cursor:pointer; }
.check-option + .check-option { border-top:1px solid #dfe2e5; }
.check-option input { appearance:auto; width:17px; height:17px; min-height:0; margin:2px 0 0; accent-color:var(--red); }
.check-option b { display:block; font-size:14px; }
.check-option small { display:block; margin-top:2px; color:#686d74; font-size:12px; }
.model-standard-note { margin:0 0 21px; padding:17px; border-left:3px solid var(--red); background:#f7f7f8; }
.model-standard-note[hidden] { display:none !important; }
.model-standard-note b { display:block; font-size:13px; text-transform:uppercase; letter-spacing:.08em; }
.model-standard-note p { margin:7px 0 0; color:#535861; font-size:13px; line-height:1.5; }
.address-search { display:flex; gap:8px; }
.address-search input { min-width:0; }
.search-address { flex:0 0 auto; min-height:50px; padding:0 15px; background:var(--ink); color:#fff; border:0; cursor:pointer; font-weight:700; }
.map-wrap { height:285px; margin:0 0 22px; position:relative; background:#e4e9e9; }
#project-map { height:100%; width:100%; }
.project-poi { background:transparent; border:0; }
.project-poi__pin { display:block; width:34px; height:34px; border:4px solid #fff; border-radius:50% 50% 50% 0; background:var(--red); box-shadow:0 3px 11px rgba(0,0,0,.35); transform:rotate(-45deg); }
.project-poi__pin:after { content:""; display:block; width:10px; height:10px; margin:8px; border-radius:50%; background:#fff; }
.map-tip { position:absolute; z-index:500; left:12px; bottom:12px; padding:7px 10px; background:rgba(22,24,29,.89); color:#fff; font-size:12px; pointer-events:none; }
.calc-form small { display:block; margin-top:11px; color:#686d74; font-size:12px; }
.estimate { padding:40px; background:var(--ink); color:#fff; display:flex; flex-direction:column; }
.estimate .section-label { color:var(--teal); }
.estimate h3 { font-size:28px; line-height:1.12; margin:11px 0 29px; letter-spacing:-.04em; }
.estimate-empty { color:rgba(255,255,255,.63); max-width:330px; }
.price { font-size:53px; letter-spacing:-.06em; font-weight:700; margin:11px 0 4px; }
.price-note { font-size:13px; color:rgba(255,255,255,.6); margin:0 0 28px; }
.price-breakdown { margin:0; padding:0; list-style:none; border-top:1px solid rgba(255,255,255,.17); }
.price-breakdown li { display:flex; justify-content:space-between; gap:16px; padding:13px 0; border-bottom:1px solid rgba(255,255,255,.17); font-size:14px; color:rgba(255,255,255,.78); }
.price-breakdown b { color:#fff; font-weight:700; }
.estimate-footer { margin-top:auto; padding-top:26px; font-size:12px; color:rgba(255,255,255,.55); }
.formula { padding:28px 0 0; font-size:13px; color:#666b73; }
.site-footer { padding:36px 0; background:#111419; color:rgba(255,255,255,.65); font-size:13px; }
.footer-row { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.footer-row b { color:#fff; }
@media (max-width:800px) { .container{width:min(100% - 32px, 1180px)} .site-header{position:relative;background:var(--ink)} .header-row{min-height:70px}.nav{display:none}.hero{min-height:620px;padding:100px 0 58px}.hero-grid,.intro-grid,.process-grid,.calc-heading,.calc-layout,.field-grid,.field-grid--metrics{grid-template-columns:1fr;gap:32px}.field-grid{gap:0}.hero-note{display:none}.intro,.calculator{padding:72px 0}.process{padding:70px 0}.calc-form,.estimate{padding:27px}.calc-heading{margin-bottom:29px}.benefits{margin-top:25px}.footer-row{align-items:flex-start;flex-direction:column}.address-search{flex-direction:column}.search-address{width:100%} }
