:root { color-scheme:light; --ink:#171b1f; --night:#15191d; --night2:#1b2024; --paper:#fff; --linen:#f6f5f2; --gold:#dfc381; --gold-dark:#ac8d51; --muted:#62696c; --line:#e5e5e1; --steel:#c5c8cc; }
    *,*::before,*::after { box-sizing:border-box; }
    html { scroll-behavior:smooth; scroll-padding-top:112px; }
    body { margin:0; font-family:Arial,Helvetica,sans-serif; color:var(--ink); background:var(--paper); -webkit-font-smoothing:antialiased; }
    a { color:inherit; }
    button { font:inherit; }
    button,a { -webkit-tap-highlight-color:transparent; }
    :focus-visible { outline:3px solid #b58c3e; outline-offset:4px; }
    .container { width:min(1152px,calc(100% - 84px)); margin-inline:auto; }
    .navigation { position:absolute; top:20px; inset-inline:0; z-index:20; }
    .nav-inner { min-height:62px; display:flex; align-items:center; gap:28px; padding:10px 16px 10px 24px; background:#202327; border:1px solid #48494a; box-shadow:0 12px 36px #07080923; border-radius:24px; }
    .brand { display:flex; align-items:center; min-width:max-content; text-decoration:none; font-size:20px; font-weight:800; letter-spacing:-1.1px; }
    .brand .seo { color:#f5f5f2; }
    .brand .selbst { color:var(--gold); }
    .brand .brand-period { color:var(--gold); }
    .nav-links { display:flex; align-items:center; justify-content:center; gap:31px; margin:auto; }
    .nav-links a { font-size:12px; font-weight:700; text-decoration:none; color:#dadddf; transition:color .15s; }
    .nav-links a:hover,.nav-links a:focus-visible { color:var(--gold); }
    .nav-cta { min-height:38px; display:inline-flex; align-items:center; justify-content:center; padding:0 19px; border-radius:13px; color:#222019; background:var(--gold); text-decoration:none; font-weight:700; font-size:12px; text-align:center; white-space:nowrap; }
    .nav-cta:hover { background:#e8d29e; }
    .menu-toggle { display:none; background:#292e32; border:1px solid #5e6163; border-radius:11px; padding:10px 13px; color:#f1f1ee; font-size:12px; font-weight:700; cursor:pointer; }
    .hero { position:relative; background:var(--night); color:#f7f7f4; padding:147px 0 70px; overflow:hidden; }
    .hero-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(390px,.95fr); align-items:center; gap:72px; min-height:423px; }
    .hero-copy { position:relative; z-index:1; }
    h1,h2,h3,p { margin-top:0; }
    h1 { font-size:clamp(43px,4.55vw,68px); line-height:1.035; letter-spacing:-.056em; font-weight:760; margin-bottom:27px; }
    .gold { color:var(--gold); }
    .hero-lead { color:#cbd0d2; font-size:16px; line-height:1.72; max-width:490px; margin-bottom:29px; }
    .buttons { display:flex; flex-wrap:wrap; gap:12px; }
    .button { min-height:47px; display:inline-flex; align-items:center; justify-content:center; padding:0 22px; border-radius:18px; font-size:12px; font-weight:700; text-align:center; text-decoration:none; border:1px solid transparent; transition:background-color .16s,border-color .16s; }
    .button.primary { color:#191919; background:var(--gold); border-color:var(--gold); }
    .button.primary:hover { background:#ead5a3; }
    .button.secondary { color:#fff; background:#23282c; border-color:#676b6e; }
    .button.secondary:hover { background:#343a3e; }
    .hero-photo { position:relative; min-height:385px; border-radius:18px; overflow:hidden; border:1px solid #4d5154; background:#242a30; }
    .hero-photo img { width:100%; height:100%; position:absolute; inset:0; display:block; object-fit:cover; object-position:center; }
    .hero-photo::after { content:""; position:absolute; inset:0; box-shadow:inset 0 0 0 1px #ffffff13; pointer-events:none; border-radius:18px; }
    .hero-footer { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:56px; padding-top:22px; border-top:1px solid #3f4142; color:#aeb4b6; font-size:11px; letter-spacing:.015em; }
    .hero-footer span:last-child { color:#c9b787; }
    .section { padding:104px 0; }
    .section-head { display:grid; grid-template-columns:1.1fr .9fr; align-items:start; gap:80px; padding-bottom:42px; }
    h2 { font-size:clamp(34px,3.5vw,49px); letter-spacing:-.046em; line-height:1.1; font-weight:760; margin-bottom:0; }
    .section-head p { max-width:380px; margin:5px 0 0 auto; color:#62676a; line-height:1.75; font-size:15px; }
    .service-list { border-top:1px solid var(--line); }
    .service { display:grid; grid-template-columns:100px minmax(0,.87fr) minmax(0,1.13fr); gap:26px; padding:34px 0; border-bottom:1px solid var(--line); align-items:baseline; }
    .service .number { font-size:14px; color:#a38b61; font-weight:700; font-variant-numeric:tabular-nums; }
    .service h3 { font-size:25px; line-height:1.25; letter-spacing:-.035em; margin:0; font-weight:720; }
    .service p { color:#5f6468; line-height:1.65; font-size:14px; margin:0; max-width:430px; }
    .statement { background:#1a1e22; color:#f7f6f3; padding:88px 0; }
    .statement-inner { display:flex; gap:80px; align-items:end; justify-content:space-between; }
    .statement h2 { max-width:790px; font-size:clamp(35px,4.1vw,59px); }
    .statement p { color:#c0c4c6; max-width:280px; line-height:1.75; font-size:14px; margin:0; }
    .process { background:var(--linen); }
    .process-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:35px; margin-top:51px; }
    .step { padding-top:24px; border-top:1px solid #d1d1ca; }
    .step .count { color:#ad9463; font-size:13px; font-weight:700; margin-bottom:27px; display:block; }
    .step h3 { font-size:23px; letter-spacing:-.035em; margin-bottom:13px; }
    .step p { color:#616668; line-height:1.75; font-size:14px; margin:0; max-width:285px; }
    .questions { background:#fff; padding:98px 0; }
    .questions-inner { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; }
    .questions h2 { font-size:clamp(34px,3.5vw,49px); }
    .faq { border-top:1px solid var(--line); }
    details { border-bottom:1px solid var(--line); }
    summary { font-size:16px; font-weight:700; list-style:none; cursor:pointer; padding:24px 40px 24px 0; position:relative; }
    summary::-webkit-details-marker { display:none; }
    summary::after { content:"+"; font-size:23px; font-weight:400; position:absolute; right:2px; top:17px; color:#777b7d; }
    details[open] summary::after { content:"−"; }
    details p { color:#5d6366; line-height:1.75; font-size:14px; margin:0 20px 25px 0; }
    .contact-band { padding:78px 0 85px; background:#ebebe7; }
    .contact-grid { display:flex; align-items:center; justify-content:space-between; gap:30px; }
    .contact-band h2 { max-width:725px; font-size:clamp(35px,3.8vw,53px); }
    .contact-band p { margin:17px 0 0; color:#60666a; font-size:14px; line-height:1.65; max-width:650px; }
    .contact-band .button { background:var(--night); color:#fff; border-color:var(--night); white-space:nowrap; min-height:49px; }
    .contact-band .button:hover { background:#353b40; }
    footer { background:#15191d; color:#c8ced1; padding:40px 0 32px; }
    .footer-grid { display:flex; justify-content:space-between; gap:25px; align-items:center; }
    .footer-brand { font-size:22px; font-weight:800; letter-spacing:-.05em; color:#fff; }
    .footer-note { margin-top:10px; font-size:12px; color:#abb0b4; }
    .footer-note a { text-decoration:none; border-bottom:1px solid #7f8182; }
    .hc-brand { display:inline-flex; align-items:center; gap:8px; vertical-align:middle; font-weight:800; letter-spacing:.01em; }
    .hc-brand img { width:24px; height:24px; object-fit:contain; }
    .hunter { color:#dfc381; } .closer { color:#d5d9dc; }
    .footer-links { display:flex; gap:24px; flex-wrap:wrap; align-items:center; font-size:12px; }
    .footer-links a { text-decoration:none; }
    .footer-links a:hover { color:#fff; }
    .preview-note { color:#9ea5a9; font-size:11px; margin-top:28px; padding-top:21px; border-top:1px solid #34383b; }
    @media (max-width:1020px) {
      .container { width:min(100% - 52px,1152px); }
      .hero-grid { gap:35px; grid-template-columns:minmax(0,1fr) minmax(280px,.85fr); }
      .nav-links { gap:18px; }
      .section-head { gap:40px; }
      .questions-inner { gap:50px; }
    }
    @media (max-width:760px) {
      .container { width:calc(100% - 40px); }
      .navigation { top:10px; }
      .nav-inner { min-height:56px; border-radius:17px; padding:9px 10px 9px 16px; gap:9px; position:relative; }
      .brand { font-size:19px; }
      .nav-links { display:none; position:absolute; top:calc(100% + 7px); left:0; right:0; margin:0; background:#202327; border:1px solid #474b4d; border-radius:15px; padding:16px 18px; flex-direction:column; align-items:stretch; gap:0; box-shadow:0 16px 20px #0004; }
      .nav-links.is-open { display:flex; }
      .nav-links a { padding:13px 7px; font-size:14px; }
      .nav-cta { margin-left:auto; border-radius:12px; font-size:11px; padding:0 12px; min-height:37px; }
      .menu-toggle { display:block; padding:10px; }
      .hero { padding:110px 0 41px; }
      .hero-grid { grid-template-columns:1fr; gap:32px; min-height:0; }
      h1 { font-size:clamp(42px,9.2vw,60px); margin-bottom:21px; }
      .hero-lead { font-size:14px; margin-bottom:22px; line-height:1.7; }
      .buttons { display:grid; grid-template-columns:1fr; gap:10px; }
      .button { width:100%; border-radius:15px; }
      .hero-photo { min-height:245px; border-radius:15px; }
      .hero-photo::after { border-radius:15px; }
      .hero-footer { display:flex; margin-top:28px; padding-top:19px; font-size:10px; flex-wrap:wrap; }
      .section { padding:69px 0; }
      .section-head { grid-template-columns:1fr; gap:20px; padding-bottom:30px; }
      .section-head p { margin:0; max-width:600px; font-size:14px; }
      .service { grid-template-columns:42px minmax(0,1fr); gap:9px 16px; padding:26px 0; }
      .service .number { grid-row:1 / span 2; padding-top:2px; }
      .service h3 { font-size:21px; }
      .service p { grid-column:2; font-size:13px; }
      .statement { padding:67px 0; }
      .statement-inner { display:block; }
      .statement h2 { font-size:clamp(36px,8vw,51px); }
      .statement p { margin-top:24px; max-width:500px; }
      .process-steps { grid-template-columns:1fr; gap:30px; margin-top:36px; }
      .step .count { margin-bottom:16px; }
      .step p { max-width:530px; }
      .questions { padding:72px 0; }
      .questions-inner { grid-template-columns:1fr; gap:34px; }
      .contact-band { padding:65px 0; }
      .contact-grid { display:block; }
      .contact-band .button { margin-top:27px; width:100%; }
      .footer-grid { display:block; }
      .footer-links { margin-top:24px; }
    }
    @media (max-width:360px) {
      .container { width:calc(100% - 26px); }
      .nav-inner { padding-left:12px; }
      .brand { font-size:17px; }
      .nav-cta { font-size:10px; padding:0 9px; }
      .hero { padding-top:99px; }
      h1 { font-size:39px; }
    }
    @media (prefers-reduced-motion:reduce) { html {scroll-behavior:auto;} *,*::before,*::after {transition:none!important;} }

/* SEO SELBST brand extension: maintain H&C/Wohnmut approved grid and dark footer geometry. */
.webdesign-section { padding:100px 0; background:#f4f3ef; }
.webdesign-grid { display:grid; grid-template-columns:.98fr 1.02fr; gap:70px; align-items:center; }
.webdesign-visual { min-height:405px; overflow:hidden; border-radius:15px; background:#d7d8d6; }
.webdesign-visual img { display:block; width:100%; height:405px; object-fit:cover; }
.webdesign-content h2 { font-size:clamp(34px,3.55vw,49px); margin-bottom:25px; }
.webdesign-content p { font-size:15px; line-height:1.76; color:#545c60; max-width:525px; margin-bottom:19px; }
.webdesign-points { list-style:none; padding:0; margin:19px 0 29px; border-top:1px solid #d1d0cc; }
.webdesign-points li { border-bottom:1px solid #d1d0cc; padding:12px 0; font-size:14px; line-height:1.45; }
.site-footer { padding:0; background:#101215; color:#c2c5c7; font-family:Arial,Helvetica,sans-serif; }
.site-footer .footer-grid { width:min(1210px,calc(100% - 84px)); margin:auto; padding:58px 0 49px; display:grid; grid-template-columns:1.38fr .9fr .88fr .9fr; align-items:start; gap:48px; }
.site-footer .footer-brand { display:inline-block; font-size:22px; text-decoration:none; font-weight:800; line-height:1.2; letter-spacing:-.045em; color:#f8f8f8; }
.site-footer .footer-brand strong { font-weight:800; color:var(--gold); }
.site-footer .footer-intro p { margin:19px 0 12px; max-width:315px; font-size:12px; line-height:1.7; color:#b9bfc3; }
.site-footer .footer-email,.site-footer .footer-cookie { display:block; width:max-content; color:#bbc1c4; font-size:12px; text-decoration:none; margin-top:8px; }
.site-footer .footer-cookie { text-decoration:underline; text-underline-offset:3px; }
.site-footer .footer-parent { border-top:1px solid #373b3f; padding-top:20px; margin-top:22px; max-width:290px; }
.site-footer .footer-parent > span { color:#9fa5a8; font-size:11px; display:block; margin-bottom:6px; }
.site-footer .footer-parent a { display:inline-flex; align-items:center; gap:8px; text-decoration:none; }
.site-footer .footer-parent img { width:35px; height:40px; object-fit:contain; }
.site-footer .footer-parent a span { font-size:11px; font-weight:800; letter-spacing:.025em; }
.site-footer .footer-parent b { color:var(--gold); font-weight:800; }
.site-footer .footer-parent i { font-style:normal; color:#d5d7d9; }
.site-footer .footer-links { display:flex; flex-direction:column; align-items:start; flex-wrap:nowrap; gap:0; margin:0; font-size:12px; }
.site-footer .footer-links h3 { color:var(--gold); font-size:11px; letter-spacing:.075em; text-transform:uppercase; font-weight:700; margin:0 0 18px; }
.site-footer .footer-links a { display:block; color:#bfc3c6; text-decoration:none; margin:0 0 10px; font-size:12px; line-height:1.45; }
.site-footer .footer-links a:hover,.site-footer .footer-links a:focus-visible { color:#fff; }
.site-footer .footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:18px; border-top:1px solid #323538; padding:18px 0; color:#9ea3a5; font-size:11px; }
.site-footer .preview-disclosure { padding:0 0 22px; color:#777f82; font-size:10px; line-height:1.6; }
.legal-hero { background:var(--night); color:#f6f4ef; padding:157px 0 62px; }
.legal-hero h1 { margin:12px 0 16px; font-size:clamp(40px,5vw,64px); }
.legal-hero p { color:#c5c9cb; font-size:15px; line-height:1.7; max-width:760px; margin:0; }
.legal-content { padding:72px 0 95px; }
.legal-inner { max-width:850px; }
.legal-inner h2 { font-size:25px; letter-spacing:-.035em; margin:34px 0 14px; }
.legal-inner h3 { font-size:19px; margin:28px 0 12px; }
.legal-inner p,.legal-inner address,.legal-inner li { font-size:15px; line-height:1.85; color:#3d4448; font-style:normal; }
.legal-inner ul { padding-left:22px; }
.legal-inner a { text-decoration:underline; text-underline-offset:3px; }
.legal-inner .legal-note { padding:20px 24px; border-left:3px solid var(--gold-dark); background:#f6f5f2; color:#4f5457; margin:25px 0; }
.legal-back { display:inline-block; margin-top:34px; font-size:14px; font-weight:700; text-decoration:none; border-bottom:1px solid var(--gold-dark); padding-bottom:5px; }
.web-detail-hero { padding:145px 0 75px; background:#15191d; color:#fff; }
.web-detail-grid { display:grid; grid-template-columns:1fr .91fr; gap:65px; align-items:center; }
.web-detail-grid h1 { font-size:clamp(42px,4.8vw,68px); }
.web-detail-grid p { font-size:15px; color:#c9cdd0; line-height:1.75; max-width:500px; }
.web-detail-grid img { display:block; width:100%; height:420px; object-fit:cover; border-radius:16px; }
@media(max-width:1050px) {
 .site-footer .footer-grid { gap:28px; grid-template-columns:1.1fr .9fr .88fr .88fr; width:calc(100% - 52px); }
 .webdesign-grid,.web-detail-grid { gap:30px; }
}
@media(max-width:760px) {
 .webdesign-section { padding:68px 0; }
 .webdesign-grid { grid-template-columns:1fr; gap:30px; }
 .webdesign-visual,.webdesign-visual img { min-height:240px; height:265px; }
 .site-footer .footer-grid { width:calc(100% - 40px); grid-template-columns:repeat(2,minmax(0,1fr)); gap:38px 24px; padding:51px 0 35px; }
 .site-footer .footer-intro { grid-column:1 / -1; }
 .site-footer .footer-bottom { flex-direction:column; align-items:start; gap:8px; }
 .site-footer .footer-links a { margin-bottom:13px; }
 .legal-hero { padding:111px 0 48px; }
 .legal-content { padding:44px 0 70px; }
 .web-detail-hero { padding:113px 0 60px; }
 .web-detail-grid { grid-template-columns:1fr; gap:28px; }
 .web-detail-grid img { height:280px; }
}
@media(max-width:370px) {
 .site-footer .footer-grid { width:calc(100% - 26px); gap:30px 17px; }
 .site-footer .footer-links a { font-size:11px; }
}