/* =========================================================
   röner : design – Projektseite /projekte/
   Dateien: projekte/rd-projekte.php · .css · .js
   1) Tokens   2) Native Elementor-Sektionen (Klassen am Container/Widget)
   3) Shortcode [roener_projekte] (alles unter .rdp gekapselt)
   ========================================================= */

:root{
  --rdp-wine:var(--e-global-color-accent,#802349);
  --rdp-wine-dark:var(--e-global-color-3b5cfab,#54162F);
  --rdp-blue:var(--e-global-color-primary,#8798A5);
  --rdp-blue-strong:#5E717E;          /* Grau-Blau, kontraststark für Kleintext */
  --rdp-ink:#22323D;
  --rdp-text:#333A40;
  --rdp-muted:#5A646C;
  --rdp-line:#D9D5D3;
  --rdp-line-cool:var(--e-global-color-secondary,#C0CAD3);
  --rdp-surface:var(--e-global-color-c8f781c,#F7F5F5);
  --rdp-font:"The Sans","TheSans",system-ui,-apple-system,"Segoe UI",sans-serif;
}

/* ---------- 2) Native Sektionen ---------- */

/* Hero */
.elementor .e-con.e-flex.rdp-hero{--padding-top:clamp(40px,6vw,88px);--padding-bottom:clamp(40px,5vw,72px);--row-gap:0px;--gap:0px;font-family:var(--rdp-font)}
.elementor .rdp-hero .rdp-display .elementor-heading-title{font-family:var(--rdp-font);font-size:clamp(76px,11vw,160px);line-height:.85;font-weight:800;letter-spacing:-.02em;color:var(--rdp-blue);margin:0;text-transform:lowercase}
.elementor .rdp-hero .rdp-lead{margin-top:clamp(20px,3vw,32px);max-width:760px}
.elementor .rdp-hero .rdp-lead,.elementor .rdp-hero .rdp-lead p{font-family:var(--rdp-font);font-size:clamp(20px,2.1vw,27px);line-height:1.4;font-weight:300;color:var(--rdp-ink)}
.elementor .rdp-hero .rdp-lead p{margin:0}
.elementor .rdp-hero .rdp-lead strong{font-weight:600}

/* Buttons (Elementor-Button-Widget mit Klasse rdp-btn + rdp-btn--primary / --secondary) */
.elementor .e-con.e-flex.rdp-ctas{--display:flex;--flex-direction:row;--flex-wrap:wrap;--row-gap:12px;--column-gap:12px;--gap:12px;margin-top:32px}
.elementor .rdp-btn .elementor-button{font-family:var(--rdp-font);font-size:17px;font-weight:600;line-height:1;min-height:48px;padding:15px 24px;border-radius:2px;display:inline-flex;align-items:center;text-transform:none;letter-spacing:0;transition:background-color .2s,color .2s,border-color .2s}
.elementor .rdp-btn--primary .elementor-button{background:var(--rdp-wine);color:#fff;border:1.5px solid var(--rdp-wine)}
.elementor .rdp-btn--primary .elementor-button:hover,.elementor .rdp-btn--primary .elementor-button:focus-visible{background:var(--rdp-wine-dark);border-color:var(--rdp-wine-dark);color:#fff}
.elementor .rdp-btn--secondary .elementor-button{background:transparent;color:var(--rdp-ink);border:1.5px solid var(--rdp-ink)}
.elementor .rdp-btn--secondary .elementor-button:hover,.elementor .rdp-btn--secondary .elementor-button:focus-visible{background:var(--rdp-ink);color:#fff}
.elementor .rdp-btn .elementor-button:focus-visible,.elementor .rdp-link a:focus-visible,.elementor .rdp a:focus-visible{outline:2px solid var(--rdp-wine);outline-offset:3px}

/* USP-Leiste */
.elementor .e-con.e-flex.rdp-usp{--display:grid;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));--row-gap:24px;--column-gap:32px;gap:24px 32px;margin-top:clamp(40px,5vw,64px);padding-top:28px;border-top:1px solid var(--rdp-line-cool)}
.elementor .e-con.e-flex.rdp-usp > .e-con{--row-gap:4px;--gap:4px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px}
.elementor .rdp-usp .rdp-usp-title .elementor-heading-title{font-family:var(--rdp-font);font-size:21px;line-height:1.25;font-weight:800;color:var(--rdp-wine);margin:0;text-transform:none}
.elementor .rdp-usp .rdp-usp-text,.elementor .rdp-usp .rdp-usp-text p{font-family:var(--rdp-font);font-size:16px;line-height:1.45;font-weight:300;color:var(--rdp-muted);margin:0}

/* Projekte-Sektion (Hintergrund) */
.elementor .e-con.e-flex.rdp-projekte{background:var(--rdp-surface);border-top:1px solid var(--rdp-line);--padding-top:clamp(40px,5vw,64px);--padding-bottom:clamp(56px,7vw,96px);scroll-margin-top:96px}

/* Leistungsfelder */
.elementor .e-con.e-flex.rdp-felder{scroll-margin-top:96px;--padding-top:clamp(56px,7vw,96px);--padding-bottom:clamp(56px,7vw,96px);--row-gap:40px;--gap:40px}
.elementor .e-con.e-flex.rdp-felder-head{--display:flex;--flex-direction:row;--flex-wrap:wrap;--align-items:flex-end;--justify-content:space-between;--row-gap:16px;--column-gap:32px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px}
.elementor .e-con.e-flex.rdp-felder-intro{--row-gap:16px;--gap:16px;max-width:640px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px}
.elementor .rdp-felder .rdp-display--h2 .elementor-heading-title{font-family:var(--rdp-font);font-size:clamp(44px,6vw,84px);line-height:.9;font-weight:800;letter-spacing:-.02em;color:var(--rdp-blue);margin:0;text-transform:lowercase}
.elementor .rdp-felder .rdp-felder-text,.elementor .rdp-felder .rdp-felder-text p{font-family:var(--rdp-font);font-size:19px;line-height:1.5;font-weight:300;color:var(--rdp-text);margin:0}
.elementor .e-con.e-flex.rdp-felder-grid{--display:grid;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));--row-gap:24px;--column-gap:24px;gap:24px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px}
.elementor .e-con.e-flex.rdp-feld{--display:flex;--flex-direction:column;--row-gap:16px;--gap:16px;--padding-top:28px;--padding-bottom:20px;--padding-left:28px;--padding-right:28px;padding:28px 28px 20px;background:var(--rdp-surface);border-top:3px solid var(--rdp-wine)}
.elementor .e-con.e-flex.rdp-feld.rdp-feld--alt{border-top-color:var(--rdp-blue)}
.elementor .rdp-feld .rdp-feld-title .elementor-heading-title{font-family:var(--rdp-font);font-size:23px;line-height:1.2;font-weight:800;color:var(--rdp-ink);margin:0;text-transform:lowercase}
.elementor .rdp-feld .rdp-feld-list ul{margin:0;padding:0 0 0 18px}
.elementor .rdp-feld .rdp-feld-list,.elementor .rdp-feld .rdp-feld-list li{font-family:var(--rdp-font);font-size:16px;line-height:1.7;font-weight:300;color:var(--rdp-text)}
.elementor .e-con.rdp-feld > .elementor-widget.rdp-feld-preis{margin-top:auto;margin-block-start:auto}
.elementor .rdp-feld .rdp-feld-preis,.elementor .rdp-feld .rdp-feld-preis p{font-family:var(--rdp-font);font-size:15px;line-height:1.3;font-weight:300;color:var(--rdp-muted);margin:0}
.elementor .rdp-feld .rdp-feld-preis strong{font-size:22px;font-weight:800;color:var(--rdp-ink)}

/* Textlinks mit Pfeil (Button-Widget mit Klasse rdp-link) */
.elementor .rdp-link .elementor-button{background:none;border:0;padding:0;min-height:44px;display:inline-flex;align-items:center;font-family:var(--rdp-font);font-size:16px;font-weight:600;color:var(--rdp-wine);text-transform:none;letter-spacing:0;border-radius:0}
.elementor .rdp-link .elementor-button:hover{background:none;color:var(--rdp-wine-dark);text-decoration:underline;text-underline-offset:4px}
.elementor .rdp-link--lg .elementor-button{font-size:17px}

/* ---------- 3) Shortcode [roener_projekte] ---------- */
.rdp{font-family:var(--rdp-font);color:var(--rdp-text)}
.rdp *,.rdp *::before,.rdp *::after{box-sizing:border-box}
.rdp-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 24px;margin-bottom:20px}
.rdp-title{margin:0;font-family:var(--rdp-font);font-size:clamp(26px,2.6vw,34px);line-height:1.15;font-weight:800;color:var(--rdp-ink);text-transform:lowercase}


.rdp-grid{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:clamp(24px,3vw,40px) 32px}
.rdp-card{margin:0;padding:0;display:flex}
.rdp a.rdp-card-link,.rdp a.rdp-card-link *{text-decoration:none}
.rdp a.rdp-card-link{display:flex;flex-direction:column;width:100%;background:#fff;border:1px solid var(--rdp-line);color:inherit;text-decoration:none;transition:border-color .2s,box-shadow .2s}
.rdp-card-link:hover{border-color:var(--rdp-blue);box-shadow:0 10px 30px -18px rgba(34,50,61,.45)}
.rdp-media{aspect-ratio:4/3;overflow:hidden;background:var(--rdp-line)}
.rdp-media .rdp-img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.rdp-card-link:hover .rdp-img{transform:scale(1.03)}
.rdp-body{display:flex;flex-direction:column;gap:10px;flex-grow:1;padding:20px 22px 22px}
.rdp-branche{margin:0;font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--rdp-muted)}
.rdp-name{margin:0;font-family:var(--rdp-font);font-size:23px;line-height:1.2;font-weight:800;color:var(--rdp-ink);text-transform:lowercase}
.rdp-kurz{margin:0;font-size:16px;line-height:1.5;font-weight:300;color:var(--rdp-text)}
.rdp-scope{margin-top:4px}
.rdp-scope-n{display:none;margin:0 0 12px;font-size:15px;font-weight:600;color:var(--rdp-wine)}
.rdp-tags{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.rdp-tag{margin:0;font-size:13px;line-height:1.3;padding:4px 10px;border:1px solid var(--rdp-line-cool);border-radius:999px;color:var(--rdp-ink);text-transform:lowercase}
.rdp-tag--extra{display:none}
.rdp-tag--more{border-color:transparent;color:var(--rdp-muted);padding-left:4px}
.rdp-more{margin-top:auto;padding-top:10px;font-size:16px;font-weight:600;color:var(--rdp-wine)}
.rdp a.rdp-card-link:hover .rdp-more{text-decoration:underline;text-underline-offset:4px}

/* Featured: erster sichtbarer Treffer, volle Breite, Bild links */
.rdp-card.is-featured{grid-column:1 / -1}
.rdp-card.is-featured .rdp-card-link{flex-direction:row;flex-wrap:wrap}
.rdp-card.is-featured .rdp-media{flex:1 1 520px;min-width:0}
.rdp-card.is-featured .rdp-body{flex:1 1 380px;min-width:0;padding:clamp(24px,3.5vw,48px);gap:16px}
.rdp-card.is-featured .rdp-branche{font-size:14px}
.rdp-card.is-featured .rdp-name{font-size:clamp(28px,3vw,40px);line-height:1.1}
.rdp-card.is-featured .rdp-kurz{font-size:18px;line-height:1.55}
.rdp-card.is-featured .rdp-scope{border-top:1px solid var(--rdp-line);padding-top:16px}
.rdp-card.is-featured .rdp-scope-n{display:block}
.rdp-card.is-featured .rdp-tag{font-size:14px;padding:5px 12px}
.rdp-card.is-featured .rdp-tag--extra{display:block}
.rdp-card.is-featured .rdp-tag--more{display:none}
.rdp-card.is-featured .rdp-more{font-size:17px}

@media (max-width:767px){
  .rdp-grid{grid-template-columns:1fr;margin-top:28px}
  .rdp-card.is-featured .rdp-media{flex-basis:100%}
  .rdp-card.is-featured .rdp-body{flex-basis:100%}
}
@media (prefers-reduced-motion:reduce){
  .rdp *,.rdp-btn .elementor-button{transition:none!important}
  .rdp-card-link:hover .rdp-img{transform:none}
}

/* Sprungziel „projekt anfragen“ (Formular im globalen Footer) nicht unter dem Sticky-Header */
#fluentform_3{scroll-margin-top:140px}