/* ==========================================================
   CRAFTAGENT V20.52.0 – GEWERKE-SEITEN & SEO-FEINSCHLIFF
   Gemeinsame, spät geladene Oberfläche für alle Gewerbeseiten.
   Die Gewerkefarbe bleibt bewusst ein Akzent (ca. 10 %).
   ========================================================== */

.trade-page{
  --trade-accent:#0A56B4;
  --trade-accent-rgb:10,86,180;
  --trade-accent-text:#6CB6FF;
  --trade-navy:#05111a;
  --trade-navy-soft:#0b1d2b;
  --trade-ink:#102f42;
  --trade-copy:#5e7687;
  --trade-line:#dce8f0;
  --trade-surface:#ffffff;
  --trade-surface-soft:#f2f7fa;
  min-width:320px;
  color:var(--trade-ink);
  background:var(--trade-surface);
}

.trade-page[data-trade-page="shk"]{
  --trade-accent:#0A56B4;
  --trade-accent-rgb:10,86,180;
  --trade-accent-text:#6CB6FF;
}

.trade-page[data-trade-page="elektro"]{
  --trade-accent:#C62828;
  --trade-accent-rgb:198,40,40;
  --trade-accent-text:#FF7A80;
}

.trade-page[data-trade-page="klima"]{
  --trade-accent:#70D7FF;
  --trade-accent-rgb:112,215,255;
  --trade-accent-text:#8DE0FF;
}

.trade-page[data-trade-page="maler"]{
  --trade-accent:#6B5CA5;
  --trade-accent-rgb:107,92,165;
  --trade-accent-text:#B7A8F0;
}

.trade-page[data-trade-page="maurer"]{
  --trade-accent:#B5523B;
  --trade-accent-rgb:181,82,59;
  --trade-accent-text:#F08B72;
}

.trade-page[data-trade-page="bodenleger"]{
  --trade-accent:#8B5E3C;
  --trade-accent-rgb:139,94,60;
  --trade-accent-text:#DFA77B;
}

.trade-page[data-trade-page="fliesenleger"]{
  --trade-accent:#2E6E6A;
  --trade-accent-rgb:46,110,106;
  --trade-accent-text:#7ED3CD;
}

.trade-page .container{
  width:min(1320px,calc(100% - 48px));
}

.trade-skip-link{
  position:fixed;
  z-index:1000;
  top:12px;
  left:12px;
  padding:11px 15px;
  border-radius:10px;
  color:#fff;
  background:#0A56B4;
  font-size:14px;
  font-weight:800;
  transform:translateY(-160%);
  transition:transform .18s ease;
}

.trade-skip-link:focus{
  transform:translateY(0);
}

.trade-page :where(a,button,summary):focus-visible{
  outline:3px solid #0A56B4;
  outline-offset:4px;
}

.trade-page :where(.site-header,.trade-hero,.trade-price-bridge,.trade-final,.site-footer)
  :where(a,button,summary):focus-visible{
  outline-color:#70D7FF;
}

/* Header */

.trade-page .site-header{
  position:sticky;
  top:0;
  z-index:100;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:rgba(5,17,26,.9);
  box-shadow:0 12px 35px rgba(0,0,0,.12);
  backdrop-filter:blur(18px) saturate(125%);
  -webkit-backdrop-filter:blur(18px) saturate(125%);
}

.trade-page .nav{
  min-height:82px;
  gap:24px;
}

.trade-page .brand{
  display:flex;
  align-items:center;
  min-height:48px;
  padding:5px 12px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:11px;
  background:rgba(255,255,255,.98);
  box-shadow:0 8px 24px rgba(0,0,0,.16);
}

.trade-page .brand img{
  width:142px;
  max-height:38px;
}

.trade-page .main-nav{
  gap:24px;
}

.trade-page .main-nav a{
  position:relative;
  color:#9fb3c1;
  font-size:13px;
  font-weight:750;
}

.trade-page .main-nav a::after{
  position:absolute;
  right:50%;
  bottom:-9px;
  left:50%;
  height:2px;
  border-radius:999px;
  background:var(--trade-accent);
  content:"";
  transition:left .18s ease,right .18s ease;
}

.trade-page .main-nav a:hover,
.trade-page .main-nav a:focus-visible{
  color:#fff;
}

.trade-page .main-nav a:hover::after,
.trade-page .main-nav a:focus-visible::after{
  right:0;
  left:0;
}

.trade-page .button{
  border:1px solid transparent;
  border-radius:12px;
  background:linear-gradient(135deg,#1477cd,#0A56B4);
  box-shadow:0 12px 28px rgba(10,86,180,.24);
}

.trade-page .button:hover{
  box-shadow:0 16px 34px rgba(10,86,180,.31);
}

.trade-page .button-secondary{
  border-color:rgba(255,255,255,.2);
  color:#eaf3f8;
  background:rgba(255,255,255,.07);
  box-shadow:none;
}

.trade-page .button-secondary:hover{
  border-color:rgba(255,255,255,.38);
  background:rgba(255,255,255,.12);
  box-shadow:none;
}

/* Hero */

.trade-page .trade-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:720px;
  padding:88px 0 82px;
  background:
    radial-gradient(circle at 82% 18%,rgba(var(--trade-accent-rgb),.26),transparent 30%),
    radial-gradient(circle at 13% 92%,rgba(10,86,180,.18),transparent 28%),
    linear-gradient(135deg,#05111a 0%,#081824 55%,#0b1d2b 100%);
}

.trade-page .trade-hero::before{
  position:absolute;
  z-index:-1;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:64px 64px;
  content:"";
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.72),transparent 92%);
}

.trade-page .trade-hero::after{
  position:absolute;
  z-index:-1;
  top:14%;
  right:-180px;
  width:520px;
  height:520px;
  border:1px solid rgba(var(--trade-accent-rgb),.2);
  border-radius:50%;
  box-shadow:
    0 0 0 70px rgba(var(--trade-accent-rgb),.035),
    0 0 0 145px rgba(var(--trade-accent-rgb),.022);
  content:"";
}

.trade-page .trade-hero > .container{
  position:relative;
  width:min(1320px,calc(100% - 48px)) !important;
  max-width:1320px !important;
}

.trade-page .trade-hero-grid{
  grid-template-columns:minmax(0,1.02fr) minmax(500px,.98fr) !important;
  gap:72px !important;
}

.trade-page .trade-hero-copy{
  max-width:690px !important;
}

.trade-page .trade-breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:9px;
  margin-bottom:27px !important;
  color:#748b9a;
  font-size:13px;
}

.trade-page .trade-breadcrumb a{
  color:#bcd0dc;
}

.trade-page .trade-breadcrumb a:hover{
  color:#fff;
}

.trade-page .trade-breadcrumb [aria-current="page"]{
  color:#8fa5b3;
}

.trade-page .trade-hero-copy .eyebrow{
  color:var(--trade-accent-text);
}

.trade-page .trade-hero-copy h1{
  max-width:710px !important;
  margin:20px 0 24px !important;
  color:#f7fbfd;
  font-size:clamp(48px,3.7vw,64px) !important;
  line-height:1.035 !important;
  letter-spacing:-.047em !important;
  text-wrap:balance;
}

.trade-page .trade-hero-copy > p{
  max-width:665px !important;
  color:#a8bdca;
  font-size:18px !important;
  line-height:1.72 !important;
}

.trade-page .trade-hero-copy .hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px !important;
}

.trade-proof-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px 19px;
  margin:25px 0 0;
  padding:21px 0 0;
  border-top:1px solid rgba(255,255,255,.1);
  list-style:none;
}

.trade-proof-list li{
  position:relative;
  padding-left:18px;
  color:#8fa7b6;
  font-size:12px;
  font-weight:700;
}

.trade-proof-list li::before{
  position:absolute;
  top:.54em;
  left:0;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#2edb88;
  box-shadow:0 0 0 4px rgba(46,219,136,.1);
  content:"";
}

.trade-page .trade-product{
  max-width:570px !important;
  border:1px solid rgba(255,255,255,.15);
  border-radius:26px !important;
  background:#fff;
  box-shadow:0 36px 90px rgba(0,0,0,.32) !important;
}

.trade-page .trade-product-top{
  min-height:74px !important;
  border-color:#dfe9ef;
  background:#f7fafc;
}

.trade-page .trade-product-brand img{
  width:104px !important;
}

.trade-page .trade-product-main{
  min-height:440px !important;
}

.trade-page .trade-assistant-panel{
  min-height:440px !important;
  background:
    radial-gradient(circle at 76% 18%,rgba(var(--trade-accent-rgb),.52),transparent 34%),
    linear-gradient(150deg,#071722 0%,#0b2434 58%,#0e3145 100%) !important;
}

.trade-page .trade-assistant-panel::after{
  position:absolute;
  right:-42px;
  bottom:92px;
  width:155px;
  height:155px;
  border:1px solid rgba(var(--trade-accent-rgb),.3);
  border-radius:50%;
  content:"";
}

.trade-page .trade-assistant-panel > *{
  position:relative;
  z-index:1;
}

.trade-page .trade-assistant-panel img{
  z-index:2;
  filter:drop-shadow(0 20px 24px rgba(0,0,0,.2));
}

.trade-page .trade-interface{
  padding:29px 24px 26px !important;
}

.trade-page .trade-wave,
.trade-page .trade-service-icon{
  color:var(--trade-ink);
  background:rgba(var(--trade-accent-rgb),.13);
}

.trade-page .trade-interface-kicker,
.trade-page .trade-benefit-number,
.trade-page .trade-link-card span:last-child{
  color:#0A56B4;
}

.trade-page .trade-service-mini-card{
  border-color:#dfe8ee;
  background:#fbfdfe;
}

/* Inhaltsbereiche */

.trade-page .trade-section{
  padding:92px 0;
  background:#fff;
}

.trade-page .trade-section-soft{
  background:var(--trade-surface-soft);
}

.trade-page .trade-section-heading{
  max-width:820px;
  margin-bottom:42px;
}

.trade-page .trade-section-heading h2,
.trade-page .trade-support-copy h2{
  color:var(--trade-ink);
  font-size:clamp(35px,3.4vw,50px);
  letter-spacing:-.04em;
  text-wrap:balance;
}

.trade-page .trade-section-heading p,
.trade-page .trade-support-copy > p{
  color:var(--trade-copy);
  font-size:17px;
  line-height:1.72;
}

.trade-page .trade-section .eyebrow{
  color:#0A56B4;
}

.trade-page .trade-service-grid{
  gap:18px;
}

.trade-page .trade-service-card,
.trade-page .trade-benefit,
.trade-page .trade-question-box,
.trade-page .trade-link-card{
  border-color:var(--trade-line);
  background:rgba(255,255,255,.94);
  box-shadow:0 18px 48px rgba(18,48,66,.06);
}

.trade-page .trade-service-card,
.trade-page .trade-benefit{
  position:relative;
  overflow:hidden;
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}

.trade-page .trade-service-card::before,
.trade-page .trade-benefit::before{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:3px;
  background:linear-gradient(90deg,var(--trade-accent),transparent 68%);
  content:"";
  opacity:.72;
}

.trade-page .trade-service-card:hover,
.trade-page .trade-benefit:hover{
  border-color:rgba(var(--trade-accent-rgb),.28);
  box-shadow:0 24px 58px rgba(18,48,66,.1);
  transform:translateY(-3px);
}

.trade-page .trade-service-card h3,
.trade-page .trade-benefit h3,
.trade-page .trade-question-box-title{
  color:var(--trade-ink);
}

.trade-page .trade-service-card p,
.trade-page .trade-benefit p,
.trade-page .trade-question{
  color:var(--trade-copy);
}

.trade-page .trade-question::before{
  color:#0A56B4;
}

.trade-page .trade-link-card{
  min-height:80px;
  border-radius:17px;
}

.trade-page .trade-link-card:hover{
  border-color:rgba(var(--trade-accent-rgb),.34);
}

/* Preisbrücke */

.trade-price-bridge{
  position:relative;
  overflow:hidden;
  padding:84px 0;
  color:#f7fbfd;
  background:
    radial-gradient(circle at 86% 18%,rgba(var(--trade-accent-rgb),.22),transparent 31%),
    linear-gradient(135deg,#071722 0%,#0b1d2b 100%);
}

.trade-price-bridge::before{
  position:absolute;
  inset:0;
  background-image:linear-gradient(90deg,rgba(255,255,255,.024) 1px,transparent 1px);
  background-size:74px 100%;
  content:"";
}

.trade-price-layout{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(390px,.86fr);
  gap:64px;
  align-items:center;
}

.trade-price-copy h2{
  max-width:650px;
  margin:13px 0 18px;
  color:#fff;
  font-size:clamp(36px,3.8vw,52px);
  line-height:1.06;
  letter-spacing:-.042em;
  text-wrap:balance;
}

.trade-price-copy p{
  max-width:640px;
  margin:0;
  color:#9eb3c0;
  font-size:17px;
  line-height:1.72;
}

.trade-price-copy .eyebrow{
  color:#70D7FF;
}

.trade-price-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:15px 20px;
  margin-top:27px;
}

.trade-price-text-link{
  color:#c4d5df;
  font-size:14px;
  font-weight:800;
}

.trade-price-text-link:hover{
  color:#fff;
}

.trade-price-options{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.trade-price-note{
  margin:13px 2px 0;
  color:#849aa8;
  font-size:11px;
  line-height:1.55;
}

.trade-price-option{
  min-height:178px;
  padding:23px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:20px;
  background:rgba(255,255,255,.055);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}

.trade-price-option.is-plus{
  border-color:rgba(112,215,255,.32);
  background:linear-gradient(145deg,rgba(10,86,180,.24),rgba(255,255,255,.055));
}

.trade-price-option > span{
  display:block;
  margin-bottom:18px;
  color:#79cfff;
  font-size:10px;
  font-weight:900;
  letter-spacing:.14em;
}

.trade-price-option strong{
  display:block;
  color:#fff;
  font-size:25px;
  line-height:1.08;
}

.trade-price-option small{
  display:block;
  margin-top:9px;
  color:#8fa6b4;
  font-size:12px;
  line-height:1.5;
}

/* FAQ, Abschluss und Footer */

.trade-page .trade-faq details{
  border-color:var(--trade-line);
  border-radius:17px;
  box-shadow:0 10px 32px rgba(18,48,66,.045);
}

.trade-page .trade-faq summary{
  position:relative;
  padding:22px 58px 22px 24px;
  color:var(--trade-ink);
  list-style:none;
}

.trade-page .trade-faq summary::-webkit-details-marker{
  display:none;
}

.trade-page .trade-faq summary::after{
  position:absolute;
  top:50%;
  right:22px;
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:9px;
  color:#0A56B4;
  background:#edf5fd;
  content:"+";
  font-size:18px;
  transform:translateY(-50%);
}

.trade-page .trade-faq details[open] summary::after{
  content:"–";
}

.trade-page .trade-final{
  position:relative;
  overflow:hidden;
  padding:90px 0;
  background:
    radial-gradient(circle at 50% 125%,rgba(var(--trade-accent-rgb),.27),transparent 38%),
    linear-gradient(135deg,#05111a,#0a2231);
}

.trade-final-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:12px;
}

.trade-page .trade-final .button{
  color:#fff;
  background:linear-gradient(135deg,#1477cd,#0A56B4);
}

.trade-page .trade-final .button-secondary{
  color:#dceaf2;
  background:rgba(255,255,255,.06);
}

.trade-page .site-footer{
  border-top:1px solid rgba(255,255,255,.08);
  background:#040d14;
}

.trade-page .footer-brand > a{
  display:inline-flex;
  padding:6px 11px;
  border-radius:10px;
  background:#fff;
}

.trade-page .footer-brand img{
  width:132px;
  max-height:36px;
}

/* Responsive */

@media(max-width:1100px){
  .trade-page .trade-hero{
    min-height:0;
  }

  .trade-page .trade-hero-grid{
    grid-template-columns:1fr !important;
    gap:48px !important;
  }

  .trade-page .trade-hero-copy{
    max-width:800px !important;
  }

  .trade-page .trade-product{
    justify-self:center !important;
    width:100%;
    max-width:700px !important;
  }

  .trade-price-layout{
    grid-template-columns:1fr;
    gap:38px;
  }

  .trade-price-options{
    max-width:680px;
  }
}

@media(max-width:980px){
  .trade-page .nav{
    justify-content:space-between;
  }

  .trade-page .nav > .button{
    display:inline-flex;
    min-height:40px;
    padding:0 15px;
    font-size:12px;
  }
}

@media(max-width:700px){
  .trade-page .container,
  .trade-page .trade-hero > .container{
    width:calc(100% - 32px) !important;
  }

  .trade-page .site-header{
    position:sticky;
  }

  .trade-page .nav{
    min-height:66px;
    padding:7px 0;
  }

  .trade-page .brand{
    min-height:42px;
    padding:4px 8px;
  }

  .trade-page .brand img{
    width:116px;
    max-height:32px;
  }

  .trade-page .nav > .button{
    min-height:40px;
    padding:0 12px;
    white-space:nowrap;
  }

  .trade-page .trade-hero{
    padding:54px 0 58px !important;
  }

  .trade-page .trade-hero::after{
    top:120px;
    right:-300px;
  }

  .trade-page .trade-hero-grid{
    gap:37px !important;
  }

  .trade-page .trade-breadcrumb{
    margin-bottom:21px !important;
    font-size:12px;
  }

  .trade-page .trade-hero-copy h1{
    margin-top:17px !important;
    font-size:clamp(36px,10.6vw,46px) !important;
    line-height:1.045 !important;
    text-wrap:pretty;
  }

  .trade-page .trade-hero-copy > p{
    font-size:16px !important;
    line-height:1.66 !important;
  }

  .trade-page .trade-hero-copy .hero-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .trade-page .trade-hero-copy .hero-actions .button{
    width:100%;
  }

  .trade-proof-list{
    display:grid;
    gap:9px;
    padding-top:19px;
  }

  .trade-page .trade-product{
    border-radius:21px !important;
  }

  .trade-page .trade-product-main{
    grid-template-columns:1fr !important;
  }

  .trade-page .trade-assistant-panel{
    min-height:325px !important;
  }

  .trade-page .trade-assistant-panel img{
    width:78% !important;
    height:240px !important;
  }

  .trade-page .trade-interface{
    padding:23px 19px 24px !important;
  }

  .trade-page .trade-section{
    padding:66px 0;
  }

  .trade-page .trade-section-heading h2,
  .trade-page .trade-support-copy h2{
    font-size:clamp(32px,9vw,39px);
  }

  .trade-page .trade-service-card,
  .trade-page .trade-benefit,
  .trade-page .trade-question-box{
    padding:24px;
    border-radius:18px;
  }

  .trade-price-bridge{
    padding:66px 0;
  }

  .trade-price-options{
    grid-template-columns:1fr;
  }

  .trade-price-option{
    min-height:0;
  }

  .trade-price-actions{
    display:grid;
    align-items:stretch;
  }

  .trade-price-actions .button{
    width:100%;
  }

  .trade-price-text-link{
    padding:8px 0;
    text-align:center;
  }

  .trade-page .trade-final{
    padding:68px 0;
  }

  .trade-final-actions{
    display:grid;
  }

  .trade-final-actions .button{
    width:100%;
  }
}

@media(max-width:390px){
  .trade-page .container,
  .trade-page .trade-hero > .container{
    width:calc(100% - 24px) !important;
  }

  .trade-page .nav > .button{
    padding:0 10px;
    font-size:11px;
  }

  .trade-page .trade-service-mini{
    grid-template-columns:1fr !important;
  }
}

@media(prefers-reduced-motion:reduce){
  .trade-page *,
  .trade-page *::before,
  .trade-page *::after{
    scroll-behavior:auto !important;
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
  }
}

/* ==========================================================
   CRAFTAGENT V20.56.0 – SIEBEN WEITERE GEWERKE
   ========================================================== */

.trade-page[data-trade-page="dachdecker"]{
  --trade-accent:#B45309;
  --trade-accent-rgb:180,83,9;
  --trade-accent-text:#F5B76B;
}

.trade-page[data-trade-page="tischler"]{
  --trade-accent:#8B5E3C;
  --trade-accent-rgb:139,94,60;
  --trade-accent-text:#DFA77B;
}

.trade-page[data-trade-page="galabau"]{
  --trade-accent:#3F7D44;
  --trade-accent-rgb:63,125,68;
  --trade-accent-text:#86D58C;
}

.trade-page[data-trade-page="trockenbau"]{
  --trade-accent:#64748B;
  --trade-accent-rgb:100,116,139;
  --trade-accent-text:#B8C6D8;
}

.trade-page[data-trade-page="fenster-tueren-rollladen"]{
  --trade-accent:#2563EB;
  --trade-accent-rgb:37,99,235;
  --trade-accent-text:#80B2FF;
}

.trade-page[data-trade-page="gebaeudereinigung"]{
  --trade-accent:#0E7490;
  --trade-accent-rgb:14,116,144;
  --trade-accent-text:#63D1ED;
}

.trade-page[data-trade-page="geruestbauer"]{
  --trade-accent:#D97706;
  --trade-accent-rgb:217,119,6;
  --trade-accent-text:#FFB95E;
}