/*
Theme Name: Christian Heusipp Personal
Description: Persönliches WordPress-Theme auf Grundlage des freigegebenen Website-Entwurfs V10.
Version: 1.0.0
Requires PHP: 8.0
Text Domain: christian-heusipp
*/
:root{--navy:#102c46;--blue:#287da0;--sand:#f1f0eb;--yellow:#e7cb69;--ink:#1e3040;--muted:#687684}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--ink);line-height:1.6;background:white}a{color:inherit}.wrap{max-width:1120px;margin:auto;padding:0 26px}.skip{position:absolute;top:-80px;background:white;padding:10px}.skip:focus{top:0}.header{background:var(--navy);color:white;border-bottom:1px solid #ffffff26}.nav{min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{text-decoration:none;letter-spacing:.11em;font-size:17px;font-weight:800;line-height:1.1}.brand span{color:var(--yellow)}.brand small{display:block;font-size:9px;letter-spacing:.24em;font-weight:500;margin-top:9px;color:#b9cbd8}nav{display:flex;gap:26px}nav a{text-decoration:none;font-size:14px;color:#d7e4ed}nav a:hover,nav a:focus{color:var(--yellow)}.menu{display:none;background:none;border:1px solid #ffffff70;border-radius:6px;color:white;padding:8px 12px;cursor:pointer}.hero{background:var(--navy);color:white;overflow:hidden}.hero-inner{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:60px;min-height:550px;padding-top:64px;padding-bottom:74px}.eyebrow{font-size:12px;letter-spacing:.2em;font-weight:800;color:var(--blue);margin:0 0 22px}.hero .eyebrow{color:var(--yellow)}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(58px,7.3vw,103px);letter-spacing:-.065em;line-height:.99;margin-bottom:32px}h1 em{font-style:normal;color:var(--yellow)}.lead{font-size:clamp(18px,2vw,23px);font-weight:700;line-height:1.4}.intro{max-width:520px;color:#c8d7e1}.btn{display:inline-flex;gap:36px;text-decoration:none;background:var(--yellow);color:#142e43;font-weight:800;padding:14px 22px;border-radius:3px;margin-top:20px}.btn:hover{background:#fff}.visual{position:relative}.image-placeholder{height:420px;background:linear-gradient(140deg,#315876,#809ba6 65%,#c5c9be);border:1px solid #ffffff3d;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;letter-spacing:.13em;font-size:12px;font-weight:700}.image-placeholder small{font-size:10px;letter-spacing:0;font-weight:400;margin-top:12px}.visual-label{position:absolute;bottom:-17px;left:20px;background:var(--yellow);color:var(--navy);font-weight:800;font-size:10px;letter-spacing:.13em;padding:13px 15px}.section{padding:100px 0}.two{display:grid;grid-template-columns:1fr 1fr;gap:90px}.section h2{font-size:clamp(32px,4vw,52px);line-height:1.13;letter-spacing:-.045em;margin-bottom:22px}.section p{font-size:17px}.muted{color:var(--muted)!important;font-size:14px!important}.tint{background:var(--sand)}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px}.tiles article{padding:30px;background:white;border-top:4px solid var(--blue)}.tiles span{font-size:12px;color:var(--blue);font-weight:800}.tiles h3{font-size:22px;margin:12px 0}.tiles p{font-size:15px}.blog-head{display:flex;justify-content:space-between;gap:20px;align-items:end}.empty{padding:44px;background:var(--sand);border-left:4px solid var(--yellow)}.empty p{max-width:680px}.contact{background:#e8eff3}footer{background:var(--navy);color:#c4d3df}.foot{min-height:100px;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px}@media(max-width:760px){.nav{min-height:75px;flex-wrap:wrap}.menu{display:block}nav{width:100%;display:none;flex-direction:column;gap:0;padding-bottom:15px}nav.open{display:flex}nav a{padding:9px 0}.hero-inner,.two{grid-template-columns:1fr;gap:32px}.hero-inner{padding-top:56px;padding-bottom:65px}.image-placeholder{height:320px}.section{padding:68px 0}.tiles{grid-template-columns:1fr}.blog-head,.foot{display:block}.foot{padding-top:24px;padding-bottom:24px}.foot span{display:block;margin:8px 0}}
/* Version 5: ruhige Portrait-Integration im ursprünglichen Entwurf */
.portrait-frame{height:440px;overflow:hidden;background:#050708;border:1px solid #ffffff3d;position:relative}
.portrait-frame img{width:100%;height:100%;object-fit:cover;object-position:center 24%;display:block}
.portrait-frame::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(16,44,70,.33),transparent 33%)}
@media(max-width:760px){.portrait-frame{height:380px}.portrait-frame img{object-position:center 20%}}

/* V6: standalone interior pages, retaining V1/V5 visual language */
.page-hero{background:var(--navy);color:white;padding:80px 0 88px}.page-hero .eyebrow{color:var(--yellow)}.page-hero h1{font-size:clamp(42px,6vw,74px);letter-spacing:-.05em;margin-bottom:20px}.page-hero p:last-child{font-size:19px;color:#d0dee7;max-width:720px}.prose{max-width:790px}.prose p{font-size:18px;line-height:1.8}.backlink{display:inline-block;margin-top:25px;color:var(--blue);font-weight:700;text-decoration:none}.backlink:hover{text-decoration:underline}.info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.info-grid article{background:var(--sand);padding:28px;border-top:4px solid var(--blue)}.info-grid h2{font-size:25px}.eyebrow-sm{font-size:12px;color:var(--blue);font-weight:800;letter-spacing:.16em}.notice{background:var(--sand);border-left:4px solid var(--yellow);padding:25px;max-width:790px}.nav .current{color:var(--yellow);text-decoration:underline;text-underline-offset:7px}.footer-links{display:flex;gap:18px;flex-wrap:wrap}.footer-links a:hover{text-decoration:none;color:white}@media(max-width:760px){.page-hero{padding:56px 0}.info-grid{grid-template-columns:1fr}.prose p{font-size:16px}}

/* V8 – Bewusst auf der dunkelblauen V6 aufgebaut; das Inselbild lockert den Einstieg auf. */
.hero-inner{min-height:470px;padding-top:46px;padding-bottom:46px}
.island-feature{background:#fff;padding:30px 0 5px}
.island-feature img{display:block;width:100%;height:clamp(230px,36vw,390px);object-fit:cover;object-position:center 54%;border-radius:3px}
.island-feature p{font-size:11px;letter-spacing:.17em;color:#567283;font-weight:700;margin:12px 0 0}
.section-more{margin-top:22px}
@media(max-width:760px){.hero-inner{padding-top:42px;padding-bottom:48px}.island-feature{padding-top:16px}.island-feature img{height:245px}}

/* V9: Heller, offener Einstieg – dunkle typografische Identität bleibt erhalten. */
:root{--navy:#102c46;--blue:#287da0;--sand:#f5f4f0;--yellow:#e7cb69;--ink:#20374a}
.header{background:#fff;color:var(--navy);border-bottom:1px solid #e4e9e9;border-top:5px solid var(--navy)}
.nav{min-height:78px}
.brand{color:var(--navy)}.brand span{color:var(--navy)}.brand small{color:#657989}
nav a{color:#334f61}nav a:hover,nav a:focus{color:#126b91}
.nav .current{color:var(--navy);text-decoration-color:var(--yellow);text-decoration-thickness:3px}
.menu{border-color:#c4d2d9;color:var(--navy)}
.hero-v9{background:linear-gradient(105deg,#ffffff 10%,#faf9f6 74%,#f2f4f2);color:var(--navy);position:relative}
.hero-v9-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:32px;align-items:center;min-height:560px;padding-top:38px;padding-bottom:0}
.hero-v9-copy{position:relative;z-index:2;padding:36px 0 56px}
.hero-v9 .eyebrow{color:var(--blue);margin-bottom:24px}.eyebrow-dot{color:#bb9b46}
.hero-v9 h1{color:var(--navy);font-size:clamp(64px,6.6vw,98px);line-height:.98;margin-bottom:26px}
.hero-v9 h1 em{color:var(--navy);font-style:normal}
.hero-v9 .lead{color:#283f50;font-size:clamp(18px,1.95vw,23px);max-width:570px}
.hero-v9 .intro{color:#516675;max-width:475px;font-size:17px;line-height:1.65}
.hero-v9-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:28px}
.hero-v9 .btn{margin:0;background:var(--navy);color:#fff;padding:14px 18px;gap:24px;font-size:14px;transition:background .15s}
.hero-v9 .btn:hover{background:#235371;color:#fff}
.hero-v9 .btn-outline{background:transparent;border:1px solid #c0ced4;color:var(--navy)}
.hero-v9 .btn-outline:hover{background:#e9eeed;color:var(--navy)}
.hero-v9-portrait{align-self:end;height:500px;min-width:0;display:flex;justify-content:center;align-items:end;position:relative;isolation:isolate;overflow:hidden}
.portrait-aura{position:absolute;left:15%;right:8%;bottom:0;height:88%;background:radial-gradient(ellipse at 60% 65%,#f2f2ed 0%,#faf9f6 59%,transparent 72%);z-index:-1}
.hero-v9-portrait img{display:block;position:relative;width:auto;max-width:100%;height:500px;object-fit:contain;object-position:center bottom;mix-blend-mode:multiply;mask-image:linear-gradient(to bottom,#000 0%,#000 88%,transparent 100%)}
@media(max-width:760px){
 .header .nav{min-height:68px}.hero-v9-inner{grid-template-columns:1fr;min-height:0;gap:0;padding-top:30px}
 .hero-v9-copy{padding:22px 0 15px}.hero-v9 h1{font-size:clamp(58px,12.5vw,82px);margin-bottom:20px}
 .hero-v9 .intro{font-size:16px}.hero-v9-portrait{height:330px;max-width:370px;margin:0 auto;width:100%}
 .hero-v9-portrait img{height:340px}
}
@media(max-width:430px){.hero-v9-portrait{height:280px}.hero-v9-portrait img{height:300px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* V10: Same calm V9 composition, less landscape imagery, a more defined navy identity. */
:root{--navy:#102c46;--yellow:#e7cb69;--blue:#287da0}
.header{border-top:7px solid var(--navy);border-bottom:1px solid #dce5e9;box-shadow:0 2px 13px rgba(16,44,70,.035)}
.brand{letter-spacing:.095em}.brand span{color:var(--navy)}
.nav .current{border-bottom:2px solid var(--navy);text-decoration:none;padding-bottom:5px}
.header nav a:hover,.header nav a:focus-visible{color:var(--navy);text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:3px;text-underline-offset:6px}
.hero-v10{background:linear-gradient(112deg,#fff 0%,#f9faf9 62%,#edf2f5 100%)}
.hero-v10 .eyebrow{color:var(--navy);display:inline-flex;gap:10px;align-items:center;letter-spacing:.17em}
.hero-v10 .eyebrow:before{content:"";height:3px;width:24px;background:var(--yellow);display:inline-block}
.hero-v10 h1{letter-spacing:-.06em}
.hero-v10 h1 em{position:relative}
.hero-v10 h1 em:after{content:"";position:absolute;left:1px;bottom:-9px;height:4px;width:78px;background:var(--yellow)}
.hero-v10 .btn{border:1px solid var(--navy);border-radius:4px;box-shadow:0 5px 16px rgba(16,44,70,.07)}
.hero-v10 .btn-outline{box-shadow:none;background:#fff;border:1px solid #bacbd4}
.hero-v10 .btn:focus-visible,.header a:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
.hero-v10 .btn-outline:hover{border-color:var(--navy);background:#edf3f7}
.hero-signature{height:14px;background:var(--navy);position:relative}
.hero-signature span{display:block;width:72px;height:4px;position:absolute;left:max(26px,calc((100vw - 1068px)/2));top:0;background:var(--yellow)}
#ueber-mich{padding-top:78px;padding-bottom:82px}
#ueber-mich .eyebrow,#arbeit .eyebrow,#blog .eyebrow,#kontakt .eyebrow{color:var(--navy)}
#arbeit{background:#eef3f6;border-top:1px solid #dce6eb;border-bottom:1px solid #dce6eb}
.tiles article{border-top:4px solid var(--navy);box-shadow:0 6px 24px rgba(16,44,70,.035)}
.tiles span{color:var(--navy)}
.backlink{color:var(--navy);text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:3px;text-underline-offset:5px}
.empty{border-left-color:var(--navy)}
.page-hero{background:var(--navy)}
@media(max-width:760px){.header{border-top-width:5px}.hero-v10 .eyebrow:before{width:16px}.hero-signature{height:10px}#ueber-mich{padding-top:62px;padding-bottom:62px}}

/* WordPress dynamic blog content */
.post-card{padding:30px;background:#fff;border-top:4px solid var(--navy)}.post-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:18px;margin-top:30px}.post-card time,.post-meta{color:var(--muted);font-size:13px}.post-card h3{font-size:24px;margin:12px 0}.post-card a{text-decoration:none}.article-body{max-width:760px;font-size:18px;line-height:1.8}.article-body img{max-width:100%;height:auto}.article-body h2,.article-body h3{margin-top:36px}.wp-block-image img{height:auto}.hero-v9-portrait img{mix-blend-mode:normal}