/*
Theme Name: Sven Hermann 2026
Theme URI: https://www.it-s-hermann.de/
Description: Minimaler Child-Theme-Layer für die persönliche Webpräsenz von Sven Hermann. Parent: Twenty Twenty-Five.
Author: Sven Hermann
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.9
Tested up to: 6.9
Requires PHP: 8.1
License: GPL-2.0-or-later
Text Domain: sven-hermann-2026
*/

:root {
  --sh-bg: #f6f3ef;
  --sh-panel: rgba(255,255,255,.78);
  --sh-panel-strong: #ffffff;
  --sh-text: #151515;
  --sh-muted: #65605b;
  --sh-line: rgba(20,20,20,.12);
  --sh-accent: #862321;
  --sh-accent-2: #243b61;
  --sh-radius: 28px;
  --sh-shadow: 0 24px 70px rgba(32, 29, 27, .10);
  --sh-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --sh-heading-font: "Space Grotesk", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
html { scroll-behavior: smooth; }
body { background: var(--sh-bg); color: var(--sh-text); font-family: var(--sh-font); }
.wp-site-blocks { padding: 0 !important; }
.sh-site {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 22px clamp(16px, 4vw, 56px) 42px;
  box-sizing: border-box;
}
.wp-site-blocks,
.entry-content,
.wp-block-post-content {
  max-width: none !important;
}

.wp-block-post-content > .sh-site {
  max-width: none !important;
  width: 100% !important;
}
.sh-site a { color: var(--sh-text); text-decoration-thickness: .08em; text-underline-offset: .22em; }
.sh-site a:hover { color: var(--sh-accent); }
.sh-nav { display:flex; align-items:center; justify-content:space-between; gap:22px; padding: 14px 0 28px; }
.sh-brand { margin:0; }
.sh-brand, .sh-brand a { display:flex; flex-direction:column; text-decoration:none; line-height:1.05; }
.sh-brand span { font-weight:800; letter-spacing:-.04em; font-size: clamp(1.15rem, 2vw, 1.6rem); }
.sh-brand small { color: var(--sh-muted); font-size:.82rem; margin-top:6px; }
.sh-links { display:flex; gap: 10px; flex-wrap:wrap; justify-content:flex-end; }
.sh-links a, .sh-footer-links a { text-decoration:none; border:1px solid var(--sh-line); border-radius:999px; padding:9px 14px; background: rgba(255,255,255,.54); }
.sh-links a:hover, .sh-footer-links a:hover { background:#fff; border-color: rgba(134,35,33,.34); }
.sh-hero, .sh-page-hero { border:1px solid var(--sh-line); border-radius: calc(var(--sh-radius) + 12px); background: radial-gradient(circle at 12% 18%, rgba(134,35,33,.16), transparent 28%), radial-gradient(circle at 85% 22%, rgba(36,59,97,.14), transparent 34%), linear-gradient(135deg, rgba(255,255,255,.92), rgba(255,255,255,.54)); box-shadow: var(--sh-shadow); overflow:hidden; }
.sh-hero { display:grid; grid-template-columns: minmax(0,1.3fr) minmax(280px,.7fr); gap: 28px; padding: clamp(30px, 6vw, 74px); min-height: 560px; align-items:end; }
.sh-page-hero { padding: clamp(30px, 6vw, 72px); margin-bottom: 24px; }
.sh-kicker, .sh-meta { text-transform:uppercase; letter-spacing:.14em; font-size:.74rem; font-weight:800; color: var(--sh-accent); margin:0 0 12px; }
.sh-hero h1,
.sh-page-hero h1 {
  font-size: clamp(2.4rem, 6.5vw, 5.2rem);
  line-height: .9;
  letter-spacing: -.075em;
  margin: 0;
  max-width: 800px;
}
.sh-page-hero h1 { font-size: clamp(2.9rem, 8vw, 6rem); max-width: 960px; }
.sh-subtitle { margin: 20px 0 0; font-size: clamp(1.15rem, 3vw, 2.1rem); font-weight: 700; letter-spacing:-.045em; color: var(--sh-accent-2); }
.sh-lead { font-size: clamp(1.12rem, 2.2vw, 1.45rem); line-height:1.55; color: var(--sh-muted); max-width: 760px; margin: 24px 0 0; }
.sh-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-top: 34px; }
.sh-button, .sh-link-button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; border-radius:999px; text-decoration:none !important; font-weight:800; }
.sh-button > .wp-block-button__link, .sh-button:not(.wp-block-button) { padding: 14px 18px; border-radius:999px; background: var(--sh-text); color:#fff !important; border:1px solid var(--sh-text); text-decoration:none !important; font-weight:800; }
.sh-button > .wp-block-button__link:hover, .sh-button:not(.wp-block-button):hover { background: var(--sh-accent); color:#fff !important; }
.sh-button-secondary > .wp-block-button__link, .sh-button-secondary:not(.wp-block-button) { background:#fff; color: var(--sh-text) !important; border-color: var(--sh-line); }
.sh-link-button > .wp-block-button__link, .sh-link-button:not(.wp-block-button) { padding: 14px 18px; background: transparent; color: var(--sh-text) !important; border:0; text-decoration:none !important; font-weight:800; }
.sh-hero-panel { align-self: stretch; display:flex; flex-direction:column; justify-content:flex-end; min-height: 360px; padding: 28px; border-radius: var(--sh-radius); background: rgba(255,255,255,.62); border:1px solid rgba(255,255,255,.8); position:relative; overflow:hidden; }
.sh-hero-panel h2 { font-size: clamp(1.45rem, 3vw, 2.15rem); line-height:1.06; letter-spacing:-.06em; margin: 10px 0 0; }
.sh-hero-panel p { color: var(--sh-muted); margin: 0; }
.sh-orb { position:absolute; width: 210px; aspect-ratio:1; border-radius:50%; background: conic-gradient(from 180deg, rgba(134,35,33,.9), rgba(36,59,97,.7), rgba(234,180,90,.7), rgba(134,35,33,.9)); filter: blur(.2px); top: 28px; right: -54px; opacity: .78; }
.sh-section { margin-top: 24px; }
.sh-grid-2, .sh-grid-3 { display:grid; gap: 18px; }
.sh-grid-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.sh-grid-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.sh-card, .sh-band, .sh-logo-card, .sh-project, .sh-legal { background: var(--sh-panel); border:1px solid var(--sh-line); border-radius: var(--sh-radius); box-shadow: 0 10px 28px rgba(32,29,27,.05); }
.sh-card { padding: 26px; min-height: 220px; }
.sh-card h2, .sh-card h3, .sh-project h2, .sh-legal h2, .sh-section-head h2 { letter-spacing:-.055em; line-height:1.06; margin: 0 0 14px; }
.sh-card p, .sh-project p, .sh-legal p, .sh-legal li { color: var(--sh-muted); line-height:1.65; }
.sh-large { grid-column: span 1; }
.sh-image-card { padding:0; overflow:hidden; }
.sh-image-card img { width:100%; height: 280px; object-fit:cover; display:block; }
.sh-image-card div { padding: 24px; }
.sh-band { display:grid; grid-template-columns:.8fr 1.2fr; gap: 30px; padding: clamp(26px, 5vw, 46px); align-items:center; }
.sh-band h2 { font-size: clamp(2.2rem, 5vw, 4rem); margin:0; letter-spacing:-.075em; line-height:.95; }
.sh-band p { color: var(--sh-muted); font-size:1.08rem; line-height:1.65; margin:0; }
.sh-logo-row { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
.sh-logo-card { padding: 22px; display:flex; align-items:center; justify-content:space-between; gap:18px; min-height: 140px; }
.sh-logo-card img { max-width: 160px; max-height: 90px; object-fit: contain; }
.sh-logo-card span { color: var(--sh-muted); font-weight: 750; }
.sh-section-head { margin-bottom: 18px; }
.sh-timeline { display:grid; gap: 12px; }
.sh-timeline article { display:grid; grid-template-columns: 130px 1fr; gap: 18px; padding: 22px; border:1px solid var(--sh-line); border-radius: 22px; background: rgba(255,255,255,.62); }
.sh-timeline time { color: var(--sh-accent); font-weight: 850; }
.sh-timeline p { margin:.35rem 0 0; color: var(--sh-muted); }
.sh-projects { display:grid; gap: 18px; }
.sh-project { display:grid; grid-template-columns: 280px 1fr; overflow:hidden; align-items:stretch; }
.sh-project img { width:100%; height:100%; min-height: 240px; object-fit:cover; background:#fff; }
.sh-project > .wp-block-group, .sh-project > div:not(.wp-block-group) { padding: 28px; }
.sh-project .sh-tags { padding: 0; }
.sh-tags { display:flex; gap:8px; flex-wrap:wrap; margin-top: 18px; }
.sh-tags span { border:1px solid var(--sh-line); border-radius:999px; padding: 6px 10px; color: var(--sh-muted); font-size:.84rem; background: rgba(255,255,255,.58); }
.sh-note { border-left: 4px solid var(--sh-accent); padding-left: 16px; }
.sh-legal { padding: clamp(26px, 5vw, 58px); max-width: 920px; margin-left:auto; margin-right:auto; }
.sh-legal h1 { font-size: clamp(2.6rem, 7vw, 5rem); letter-spacing:-.075em; line-height:.95; margin:0 0 28px; }
.sh-legal h2 { margin-top: 34px; }
.sh-legal h3 { margin-top: 24px; }
.sh-legal address { font-style:normal; line-height:1.7; margin: 18px 0; }
.sh-legal hr { border:0; border-top:1px solid var(--sh-line); margin: 32px 0; }
.sh-footer { display:flex; justify-content:space-between; gap:22px; align-items:center; margin-top: 34px; padding: 24px 0 8px; color: var(--sh-muted);   white-space: nowrap;}
.sh-footer strong { color: var(--sh-text); }
.sh-footer-links { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
@media (max-width: 900px) {
  .sh-hero, .sh-grid-2, .sh-grid-3, .sh-band, .sh-logo-row, .sh-project { grid-template-columns: 1fr; }
  .sh-nav, .sh-footer { align-items:flex-start; flex-direction:column;   white-space: nowrap;}
  .sh-links, .sh-footer-links { justify-content:flex-start; }
  .sh-project img { height: 230px; }
}
@media (max-width: 560px) {
  .sh-site { width: min(100% - 20px, 1180px); padding-top: 12px; }
  .sh-hero, .sh-page-hero { border-radius: 24px; padding: 24px; min-height:auto; }
  .sh-hero-panel { min-height: 260px; }
  .sh-card, .sh-project div { padding: 20px; }
  .sh-timeline article { grid-template-columns: 1fr; }
}


/* Gutenberg block markup compatibility */
.sh-nav .sh-links p, .sh-footer-links p, .sh-tags { margin: 0; display:flex; gap:8px; flex-wrap:wrap; }
.sh-nav .sh-links p { gap:10px; justify-content:flex-end; }
.sh-footer-links p { justify-content:flex-end; }
.sh-hero > .wp-block-column, .sh-grid-2 > .wp-block-column, .sh-grid-3 > .wp-block-column, .sh-logo-row > .wp-block-column { margin: 0; }
.sh-image-card .wp-block-image, .sh-project .wp-block-image, .sh-logo-card .wp-block-image { margin:0; }
.sh-image-card > .wp-block-group { padding:24px; }
.sh-timeline article.wp-block-group { display:grid; grid-template-columns:130px 1fr; gap:18px; padding:22px; border:1px solid var(--sh-line); border-radius:22px; background:rgba(255,255,255,.62); }
.sh-timeline article.wp-block-group p { margin:0; }
.sh-timeline article.wp-block-group p + p { margin-top:.35rem; color:var(--sh-muted); }
.sh-timeline time { color: var(--sh-accent); font-weight:850; }
.sh-project-body { padding: 28px; }
.sh-project-body > *:first-child { margin-top:0; }
.sh-tags span { border:1px solid var(--sh-line); border-radius:999px; padding:6px 10px; color:var(--sh-muted); font-size:.84rem; background:rgba(255,255,255,.58); }
.sh-hero h1,
.sh-page-hero h1,
.sh-legal h1 {
  font-family: var(--sh-heading-font);
}
.sh-logo-card .wp-block-image img { max-width:160px; max-height:90px; object-fit:contain; }
body .wp-site-blocks,
body .entry-content,
body .wp-block-post-content {
  width: 100% !important;
  max-width: none !important;
}

body .wp-block-post-content > .alignfull.sh-site,
body .entry-content > .alignfull.sh-site,
body .sh-site {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box;
}

body .sh-site {
  padding-left: clamp(16px, 4vw, 56px);
  padding-right: clamp(16px, 4vw, 56px);
}
/* Navigation volle Breite */

.sh-nav.alignfull,
.wp-block-group.alignfull.sh-nav {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box;
}

.sh-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 22px clamp(16px, 4vw, 56px);
}

.sh-brand {
  margin: 0;
}

.sh-brand a {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  color: inherit;
  text-decoration: none;
}

.sh-brand span {
  font-weight: 750;
  letter-spacing: -0.03em;
  line-height: 1;
}

.sh-brand small {
  font-size: 0.82rem;
  color: rgba(20, 20, 20, 0.62);
  line-height: 1.35;
}

.sh-links {
  margin: 0;
}

.sh-links p {
  display: flex;
  align-items: center;
  gap: 18px;
  margin: 0;
}

.sh-links a {
  color: inherit;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.95rem;
}

.sh-links a:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

@media (max-width: 720px) {
  .sh-nav {
    align-items: flex-start;
    flex-direction: column;
  }

  .sh-links p {
    flex-wrap: wrap;
    gap: 12px 16px;
  }
}
@media (max-width: 480px) {
  .sh-hero h1,
  .sh-page-hero h1 {
    font-size: clamp(1.8rem, 8.8vw, 2.65rem);
    line-height: 1;
    letter-spacing: -.04em;
  }
}

/* Tablet/iPad: Header wirklich volle Viewport-Breite */
@media (min-width: 721px) and (max-width: 1366px) {
  body {
    overflow-x: hidden;
  }

  body .sh-site > .sh-nav,
  body .sh-nav.alignfull,
  body .wp-block-group.alignfull.sh-nav {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: clamp(16px, 4vw, 56px);
    padding-right: clamp(16px, 4vw, 56px);
    box-sizing: border-box;
  }

  body .sh-nav {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  body .sh-links {
    margin-left: auto;
  }

  body .sh-links p {
    justify-content: flex-end;
  }
}
