/*
Theme Name: Holger Harte V8
Description: Klassisches WordPress-Theme der fertigen Holger-Harte-Webseite V8. Lokale Bilder und Schriften; feste Vorlagen. Datenschutz und Bestandssystem vor Veröffentlichung prüfen.
Version: 8.0.3
Requires at least: 5.8
Requires PHP: 7.4
Text Domain: holger-harte-v8
*/
/* WordPress-only integration; original presentation remains in styles.css. */
body.admin-bar .site-header{top:32px}
@media(max-width:782px){body.admin-bar .site-header{top:46px}}
@media(max-width:600px){body.admin-bar .site-header{top:0}}
.hh-wp-content img{height:auto}
.hh-wp-content .wp-block-image img{max-width:100%}
/* Keep long accordion labels inside narrow mobile preview columns. */
@media(max-width:800px){
.competency-list summary{grid-template-columns:35px minmax(0,1fr) 24px}
.competency-list summary>span:nth-child(2){min-width:0;overflow-wrap:anywhere}
}
/* Match the owner-approved competence controls already applied in live Additional CSS. */
#kompetenzen .plus::before, #kompetenzen .plus::after { height: 2px; top: 10.5px; }
/* Position the vertical caption as already approved in live Additional CSS. */
.hero-visual .vertical-note{top:auto;bottom:38px}
/* Same intrinsic ratio and cover alignment as the untouched original portrait.
   A pseudo-element keeps the overlay out of image-viewer selectors and tab order. */
.hero-visual .portrait-frame::after{
content:"";position:absolute;inset:0;pointer-events:none;
background-image:url('assets/hero-ceiling-overlay.svg');
background-size:cover;background-position:50% 36%;background-repeat:no-repeat;
}
/* Match the owner-approved vertical centering already applied in live Additional CSS. */
.education-visual > .image-side-label { top:50%; bottom:auto; height:max-content; transform:translateY(-50%) rotate(180deg); }
/* Preserve the supplied infographic's natural ratio and every edge, including on hover. */
.sample.sample-infographic .sample-image img{aspect-ratio:auto;object-fit:contain;transform:none}
/* The requested contact banner is decorative and has no action. */
#kontakt .contact-email-banner{cursor:default}
#kontakt .contact-email-banner:hover{background:var(--blue)}