/* ==========================================================================
   bear & elephant – Corporate Design für WordPress-Blöcke
   CI-Farben: Terrakotta #cb674c · Blau #6c95b0 · Sand #dbd7d3 · Dunkelbraun #3d362a
   Barrierearme Ableitungen (WCAG AA): Terrakotta dunkel #a9523a · Blau dunkel #3f6784
   ========================================================================== */
:root{
  --be-terra:#cb674c; --be-terra-dark:#a9523a; --be-terra-deep:#8f4430; --be-terra-light:#e08a70;
  --be-blue:#6c95b0; --be-blue-dark:#3f6784; --be-blue-light:#9fc0d6;
  --be-sand:#dbd7d3; --be-sand-light:#efece8; --be-cream:#f8f6f3;
  --be-brown:#3d362a; --be-brown-deep:#2b2519; --be-white:#fff;
  --be-radius:18px; --be-shadow:0 10px 30px -12px rgba(61,54,42,.25);
  --be-content:1140px;
  --be-font:'Poppins',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
}

/* ---------- Hausschrift seitenweit ---------- */
body{font-family:var(--be-font);}
body :is(h1,h2,h3,h4,h5,h6,p,li,dt,dd,a,button,input,select,textarea,label,blockquote,figcaption,td,th,summary,
.wp-block-site-title,.wp-block-navigation-item__content,.wp-block-button__link,.menu-item a,.site-title){font-family:var(--be-font)!important;}
html{overflow-x:clip;} body{overflow-x:clip;}

/* ---------- Titel des Themes auf be-Seiten ausblenden (eigene H1 im Hero) ---------- */
body.be-page.be-hide-title :is(.entry-header,.page-header,.ast-archive-description,header.entry-header,.wp-block-post-title,.page-title-wrapper,.hostinger-page-title){display:none!important;}
body.be-page .entry-content > .be-section:first-child,
body.be-page .wp-block-post-content > .be-section:first-child{margin-top:0;}

/* ---------- Sektionen ---------- */
.be-section{
  --wp--style--global--content-size:var(--be-content);
  --wp--style--global--wide-size:1280px;
  position:relative; box-sizing:border-box;
  padding:clamp(56px,8vw,112px) clamp(20px,4vw,40px);
  color:var(--be-brown); background:var(--be-white);
  font-family:var(--be-font); font-size:1.0625rem; line-height:1.7;
}
.be-section > *{max-width:var(--be-content); margin-left:auto!important; margin-right:auto!important;}
body.be-page .be-section.alignfull{width:100vw; max-width:100vw; margin-left:calc(50% - 50vw)!important; margin-right:calc(50% - 50vw)!important;}
:is(.entry-content,.wp-block-post-content,.editor-styles-wrapper) > .be-section{margin-top:0!important; margin-bottom:0!important;}
.be-section + .be-section{margin-top:0!important;}

.be-section :is(h1,h2,h3){color:inherit; font-family:var(--be-font); letter-spacing:-.01em; line-height:1.2;}
.be-section h2{font-size:clamp(1.75rem,3.2vw,2.6rem); font-weight:600; margin:0 0 .6em;}
.be-section h3{font-size:clamp(1.15rem,1.6vw,1.3rem); font-weight:600; margin:0 0 .5em;}
.be-section p{margin:0 0 1em;}
.be-section a{color:var(--be-terra-dark); text-decoration-thickness:1px; text-underline-offset:3px;}
.be-section a:hover{color:var(--be-brown);}
.be-section :focus-visible{outline:3px solid var(--be-blue); outline-offset:3px; border-radius:6px;}

.be-eyebrow{font-size:.8rem!important; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--be-terra-dark); margin-bottom:.9em!important; display:flex; align-items:center; gap:.7em;}
.be-eyebrow::before{content:""; width:28px; height:2px; background:currentColor; display:inline-block;}
.be-intro{font-size:1.15rem; max-width:760px!important; margin-left:max(0px, calc((100% - var(--be-content))/2))!important; color:#5a5142;}
.be-lead{font-size:clamp(1.08rem,1.5vw,1.25rem); line-height:1.65;}
.be-center{text-align:center; justify-content:center;}

/* Hintergründe */
.be-sand, .is-style-be-sand{background:var(--be-sand-light)!important;}
.be-dark, .is-style-be-dark{background:var(--be-brown)!important; color:var(--be-sand)!important;}
.be-dark :is(h1,h2,h3), .is-style-be-dark :is(h1,h2,h3){color:#fff;}
.be-dark .be-eyebrow, .be-hero .be-eyebrow, .be-cta .be-eyebrow{color:var(--be-terra-light);}
.be-dark a:not(.wp-block-button__link), .be-hero a:not(.wp-block-button__link){color:var(--be-terra-light);}
.be-dark .be-intro{color:var(--be-sand);}

/* ---------- Hero ---------- */
.be-hero, .is-style-be-hero{
  background:
    radial-gradient(ellipse 60% 70% at 100% 0%, rgba(108,149,176,.28), transparent 60%),
    radial-gradient(ellipse 50% 60% at 0% 100%, rgba(203,103,76,.22), transparent 60%),
    var(--be-brown)!important;
  color:var(--be-sand)!important; overflow:hidden;
  padding-top:clamp(80px,12vw,160px)!important; padding-bottom:clamp(72px,10vw,140px)!important;
}
.be-hero::after{
  content:"&"; position:absolute; right:-.05em; bottom:-.28em; font-family:var(--be-font); font-weight:600;
  font-size:clamp(16rem,38vw,34rem); line-height:1; color:var(--be-terra); opacity:.10; pointer-events:none;
}
.be-hero > *{position:relative; z-index:1;}
.be-hero .be-hero-title, .be-hero h1{color:#fff; font-size:clamp(2.1rem,5.2vw,4rem); font-weight:600; line-height:1.1; margin:0 0 .5em; max-width:900px!important; margin-left:0!important;}
.be-hero .be-lead{max-width:760px!important; margin-left:0!important; color:#ece8e3;}
.be-hero .wp-block-buttons{margin-top:2rem; justify-content:flex-start; max-width:var(--be-content);}
.be-hero-claim{margin-top:2.6rem!important; font-size:1.2rem; font-weight:600; color:var(--be-terra-light); border-left:3px solid var(--be-terra); padding-left:1rem; margin-left:0!important;}
.be-hero > :is(.be-eyebrow,.be-hero-title,.be-lead,.wp-block-buttons,.be-hero-claim){margin-left:max(0px, calc((100% - var(--be-content))/2))!important;}

/* ---------- Buttons ---------- */
.be-section .wp-block-buttons{gap:.8rem; margin-top:1.4rem;}
.be-btn .wp-block-button__link, .is-style-be-primary .wp-block-button__link{
  background:var(--be-terra-dark); color:#fff!important; border:2px solid var(--be-terra-dark);
  border-radius:999px; padding:.85em 1.6em; font-weight:600; font-size:1rem; line-height:1.3;
  text-decoration:none!important; transition:background .2s,border-color .2s,color .2s,transform .2s;
}
.be-btn .wp-block-button__link:hover{background:var(--be-terra-deep); border-color:var(--be-terra-deep); transform:translateY(-1px);}
.be-btn-outline .wp-block-button__link, .is-style-be-outline .wp-block-button__link{background:transparent; color:var(--be-brown)!important; border-color:var(--be-brown);}
.be-btn-outline .wp-block-button__link:hover{background:var(--be-brown); color:#fff!important; border-color:var(--be-brown);}
.be-btn-outline-light .wp-block-button__link{background:transparent; color:#fff!important; border-color:rgba(255,255,255,.75);}
.be-btn-outline-light .wp-block-button__link:hover{background:#fff; color:var(--be-brown)!important; border-color:#fff;}
.be-btn-light .wp-block-button__link{background:#fff; color:var(--be-terra-deep)!important; border-color:#fff;}
.be-btn-light .wp-block-button__link:hover{background:var(--be-brown); color:#fff!important; border-color:var(--be-brown);}

/* ---------- Spalten / Karten ---------- */
.be-section .wp-block-columns{gap:clamp(20px,2.5vw,32px); margin-bottom:clamp(20px,2.5vw,32px);}
.be-section .wp-block-columns:last-child{margin-bottom:0;}
.be-split .wp-block-columns{align-items:center; gap:clamp(28px,5vw,72px);}
.be-cards .wp-block-column{display:flex;}
.be-card{
  flex:1; box-sizing:border-box; background:var(--be-cream); border-radius:var(--be-radius);
  padding:clamp(24px,2.6vw,34px); border:1px solid rgba(61,54,42,.08); position:relative;
  transition:transform .25s, box-shadow .25s;
}
.be-card > *{max-width:none!important;}
.be-card::before{content:""; position:absolute; left:clamp(24px,2.6vw,34px); top:0; width:44px; height:4px; background:var(--be-terra); border-radius:0 0 4px 4px;}
.be-sand .be-card{background:#fff;}
.be-dark .be-card{background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.12);}
.be-dark .be-card h3{color:#fff;}
.be-card-blue::before{background:var(--be-blue);}
.be-card p:last-child{margin-bottom:0;}
.be-card-kicker{font-size:.75rem!important; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--be-blue-dark); margin:.4em 0 .6em!important;}
.be-dark .be-card-kicker{color:var(--be-blue-light);}
.be-card-link{margin-top:auto!important; padding-top:.6em; font-weight:600;}
.be-card-link a{text-decoration:none; color:var(--be-terra-dark);}
.be-cards-links .be-card{display:flex; flex-direction:column;}
.be-cards-links .be-card:hover{transform:translateY(-4px); box-shadow:var(--be-shadow);}

/* ---------- Schritte ---------- */
.be-steps .wp-block-column{display:flex;}
.be-step{flex:1; border-top:2px solid var(--be-sand); padding-top:1.4rem;}
.be-step > *{max-width:none!important;}
.be-step-no{font-size:2.6rem!important; font-weight:600; line-height:1; color:var(--be-terra); margin-bottom:.4em!important;}
.be-dark .be-step{border-color:rgba(255,255,255,.2);}

/* ---------- Claim-Band ---------- */
.be-claim, .is-style-be-claim{background:var(--be-terra)!important; color:#fff!important; text-align:center; padding-top:clamp(56px,7vw,96px)!important; padding-bottom:clamp(56px,7vw,96px)!important;}
.be-claim-text{font-size:clamp(1.6rem,3.6vw,2.7rem)!important; font-weight:600; line-height:1.25; max-width:900px!important; margin-bottom:.5em!important;}
.be-claim-sub{font-size:1.2rem!important; font-weight:600; opacity:1; margin-bottom:0!important;}

/* ---------- CTA ---------- */
.be-cta, .is-style-be-cta{background:var(--be-terra-dark)!important; color:#fff!important; text-align:center;}
.be-cta h2{color:#fff!important;}
.be-cta .be-lead{max-width:720px!important; color:#fff;}
.be-cta .wp-block-buttons{justify-content:center;}

/* ---------- Faktenbox ---------- */
.be-facts{background:#fff; border-radius:var(--be-radius); padding:clamp(24px,3vw,40px); border-left:6px solid var(--be-blue); box-shadow:var(--be-shadow); box-sizing:border-box;}
.be-facts > *{max-width:none!important;}
.be-facts-title{font-size:1.35rem!important; margin-bottom:1em!important;}
.be-facts-list{list-style:none; margin:0; padding:0;}
.be-facts-list li{padding:.65em 0; border-bottom:1px solid rgba(61,54,42,.1);}
.be-facts-list li:last-child{border-bottom:0;}
.be-facts-list strong{display:block; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--be-blue-dark); font-weight:600;}
.be-dark .be-facts{color:var(--be-brown);}
.be-dark .be-facts h2{color:var(--be-brown);}
.be-dark .be-facts a{color:var(--be-terra-dark);}

/* ---------- Checkliste ---------- */
.be-checklist{list-style:none; margin:0; padding:0;}
.be-checklist li{position:relative; padding:.55em 0 .55em 2.2em; border-bottom:1px solid rgba(61,54,42,.08);}
.be-checklist li::before{content:""; position:absolute; left:0; top:.8em; width:1.3em; height:1.3em; border-radius:50%;
  background:var(--be-terra) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/70% no-repeat;}

/* ---------- Zitat ---------- */
.be-quote{border-left:4px solid var(--be-terra); padding:.4rem 0 .4rem 1.6rem;}
.be-quote > *{max-width:none!important;}
.be-quote-text{font-size:clamp(1.2rem,2vw,1.5rem)!important; line-height:1.5; font-weight:500; color:#fff;}
.be-quote-cite{font-size:.9rem!important; color:var(--be-terra-light); font-weight:600;}

/* ---------- FAQ ---------- */
.be-faq .wp-block-details{border-bottom:1px solid rgba(61,54,42,.15); padding:0; margin:0 auto!important;}
.be-faq .wp-block-details:first-of-type{border-top:1px solid rgba(61,54,42,.15);}
.be-faq .wp-block-details summary{list-style:none; cursor:pointer; font-weight:600; font-size:1.1rem; padding:1.2rem 3rem 1.2rem 0; position:relative;}
.be-faq .wp-block-details summary::-webkit-details-marker{display:none;}
.be-faq .wp-block-details summary::after{content:"+"; position:absolute; right:.4rem; top:50%; transform:translateY(-50%); width:1.9rem; height:1.9rem; border-radius:50%; background:var(--be-sand-light); color:var(--be-terra-dark); display:grid; place-items:center; font-size:1.3rem; font-weight:500; transition:transform .2s;}
.be-faq .wp-block-details[open] summary::after{content:"–";}
.be-faq .wp-block-details > :not(summary){padding-right:3rem; color:#4b4336;}
.be-faq .wp-block-details[open]{padding-bottom:.8rem;}
.be-faq + .be-faq{padding-top:0!important;}

/* ---------- Mobil ---------- */
@media (max-width:781px){
  .be-section{font-size:1rem;}
  .be-hero::after{font-size:18rem; opacity:.08;}
  .be-hero > :is(.be-eyebrow,.be-hero-title,.be-lead,.wp-block-buttons,.be-hero-claim){margin-left:0!important;}
  .be-section .wp-block-buttons{flex-direction:column; align-items:stretch;}
  .be-section .wp-block-button, .be-section .wp-block-button__link{width:100%; text-align:center; box-sizing:border-box;}
  .be-faq .wp-block-details > :not(summary){padding-right:0;}
}
@media (prefers-reduced-motion:reduce){ .be-section *{transition:none!important;} }

/* ---------- Editor: Sektionen sichtbar machen ---------- */
.editor-styles-wrapper .be-section{margin-left:0; margin-right:0;}

/* ---------- Robustheit gegenüber Theme-/Layout-Regeln (constrained layout) ---------- */
.be-section .be-card.be-card > *, .be-section .be-step.be-step > *, .be-section .be-facts.be-facts > *, .be-section .be-quote.be-quote > *{margin-left:0!important; margin-right:0!important; max-width:none!important;}
.be-section.be-section > p.be-intro{margin-left:max(0px, calc((100% - var(--be-content))/2))!important; margin-right:auto!important;}
.be-hero.be-hero > :is(.be-eyebrow,.be-hero-title,.be-lead,.wp-block-buttons,.be-hero-claim){margin-left:max(0px, calc((100% - var(--be-content))/2))!important; margin-right:auto!important;}
.be-cta.be-cta > .be-lead, .be-claim.be-claim > *{margin-left:auto!important; margin-right:auto!important;}
.be-section .be-card.be-card{padding:clamp(24px,2.6vw,34px)!important;}
.be-section .be-facts.be-facts{padding:clamp(24px,3vw,40px)!important;}
/* Abstand zwischen Theme-Kopf und erster Sektion entfernen */
body.be-page :is(main,#main,.site-main,#primary,.content-area,.site-content,#content){margin-top:0!important; padding-top:0!important;}
body.be-page.be-hide-title main .wp-block-group:has(> .wp-block-post-title){display:none!important;}
body.be-page :is(.entry-content,.wp-block-post-content){margin-top:0!important; padding-top:0!important; padding-left:0!important; padding-right:0!important;}
body.be-page footer.wp-block-template-part{margin-top:0!important;}
@media (max-width:781px){
  .be-section.be-section > p.be-intro, .be-hero.be-hero > :is(.be-eyebrow,.be-hero-title,.be-lead,.wp-block-buttons,.be-hero-claim){margin-left:0!important;}
}
