/* ═══════════════════════════════════════════════════════════════
   RH MEDIA – rh-master.css   (final)
   Loaded after style.css. !important where needed.
   Single source of truth. No patches needed after this.
═══════════════════════════════════════════════════════════════ */

/* ── TOKENS ─────────────────────────────────────────────── */
:root {
  --nav-h:   72px;
  --gold:    #c8a45a;
  --gold2:   #dbb96e;
  --r:       8px;
  --ease:    cubic-bezier(.4,0,.2,1);
  /* light mode surface palette */
  --lbg:     #f6f7f9;
  --lbg2:    #eef0f3;
  --lbg3:    #e5e8ed;
  --ltx:     #0f1218;
  --ltx2:    #3a4154;
  --ltx3:    #6b7385;
  --lbr:     rgba(0,0,0,.10);
  --lbr2:    rgba(0,0,0,.16);
  --lshadow: 0 4px 24px rgba(0,0,0,.08);
}
@media (max-width:900px) { :root { --nav-h: 62px; } }

/* ── BODY ──────────────────────────────────────────────── */
body { padding-top: var(--nav-h) !important; overflow-x: hidden; }
body.home-page { padding-top: 0 !important; }
@media (max-width:900px) { body.home-page { padding-top: var(--nav-h) !important; } }

/* ═══════════════════════════════════════════════════════════════
   NAV — The ONE definitive rule set.
   NEVER use translateY. NEVER use opacity:0.
   The nav is ALWAYS position:fixed and ALWAYS in the DOM.
   Background changes on scroll. That is all.
═══════════════════════════════════════════════════════════════ */
#nav {
  /* Physical position – locked */
  position: fixed !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  z-index: 99000 !important;
  height: var(--nav-h) !important;
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 clamp(16px,5vw,64px) !important;

  /* ALWAYS VISIBLE – these three never change */
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
  pointer-events: auto !important;

  /* Default background (subpages + scrolled homepage) */
  background: rgba(11,13,17,.91) !important;
  backdrop-filter: blur(22px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(130%) !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
  box-shadow: 0 2px 24px rgba(0,0,0,.22) !important;
  transition: background .36s var(--ease),
              border-color .36s var(--ease),
              box-shadow .36s var(--ease) !important;
  will-change: background, box-shadow;
}

/* Scrolled state (glass, strong) */
#nav.scrolled {
  background: rgba(11,13,17,.96) !important;
  border-bottom-color: rgba(255,255,255,.09) !important;
  box-shadow: 0 4px 40px rgba(0,0,0,.32) !important;
}

/* Homepage at very top: transparent BACKGROUND only.
   Nav itself stays physical, visible, clickable. */
body.home-page #nav.at-top {
  background: rgba(11,13,17,.0) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
}

/* KILL every old rule from style.css that hides the nav.
   These selectors match anything style.css could produce. */
#nav.home-top,
body.home-page #nav.home-top,
body.home-page #nav.home-top:not(.scrolled),
body.home-page #nav[class*="home-top"] {
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
  visibility: visible !important;
}

/* Light mode nav */
[data-theme="light"] #nav {
  background: rgba(246,247,249,.94) !important;
  border-bottom-color: rgba(0,0,0,.08) !important;
  box-shadow: 0 2px 20px rgba(0,0,0,.07) !important;
}
[data-theme="light"] #nav.scrolled {
  background: rgba(246,247,249,.98) !important;
  border-bottom-color: rgba(0,0,0,.10) !important;
  box-shadow: 0 4px 28px rgba(0,0,0,.09) !important;
}
[data-theme="light"] body.home-page #nav.at-top {
  background: rgba(246,247,249,.0) !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
}
[data-theme="light"] .nav-link,
[data-theme="light"] .nav-menu a { color: var(--ltx2) !important; }
[data-theme="light"] .nav-link.active,
[data-theme="light"] .nav-link:hover,
[data-theme="light"] .nav-menu a:hover { color: var(--ltx) !important; }

/* ── NAV LOGO ──────────────────────────────────────────── */
#nav-logo, [data-logo] {
  height: clamp(36px,4.8vw,56px) !important;
  max-width: min(250px,40vw) !important;
  object-fit: contain !important; flex-shrink: 0 !important;
  transition: opacity .2s, transform .2s !important;
  filter: drop-shadow(0 2px 12px rgba(0,0,0,.2)) !important;
}
#nav-logo:hover { opacity: .82 !important; transform: scale(.97) !important; }
@media (max-width:600px) { #nav-logo { height: 34px !important; max-width: 160px !important; } }
.foot-logo {
  height: clamp(42px,5.5vw,66px) !important;
  max-width: min(200px,52vw) !important;
  object-fit: contain !important; display: block !important;
}
@media (max-width:700px) { .foot-logo { margin: 0 auto !important; } }

/* ── THEME TOGGLE – SVG icons ──────────────────────────── */
.thm-ico { display: none !important; }
.thm-wrap {
  display: flex !important; align-items: center !important;
  gap: 5px !important; padding: 4px 8px !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.05) !important;
}
[data-theme="light"] .thm-wrap {
  border-color: rgba(0,0,0,.12) !important;
  background: rgba(0,0,0,.04) !important;
}
.thm-icon-sun, .thm-icon-moon {
  width: 15px !important; height: 15px !important; flex-shrink: 0;
  display: flex !important; align-items: center; justify-content: center;
  opacity: .38; transition: opacity .25s;
}
.thm-icon-sun svg, .thm-icon-moon svg {
  width: 14px !important; height: 14px !important;
  fill: none !important; stroke: currentColor !important; stroke-width: 1.8 !important;
}
[data-theme="light"] .thm-icon-sun  { opacity: .88; }
[data-theme="light"] .thm-icon-sun svg  { color: var(--gold2); stroke-width: 2.1; }
[data-theme="dark"]  .thm-icon-moon { opacity: .88; }
[data-theme="dark"]  .thm-icon-moon svg { color: var(--gold); stroke-width: 2.1; }
#thm-btn {
  width: 42px !important; height: 23px !important; border-radius: 999px !important;
  border: none !important; background: rgba(255,255,255,.12) !important;
  position: relative !important; cursor: pointer !important; flex-shrink: 0 !important;
}
[data-theme="light"] #thm-btn { background: rgba(0,0,0,.1) !important; }
#thm-btn::after {
  content: '' !important; position: absolute !important;
  top: 3px !important; left: 3px !important;
  width: 17px !important; height: 17px !important; border-radius: 50% !important;
  background: var(--gold) !important;
  box-shadow: 0 1px 5px rgba(0,0,0,.22) !important;
  transition: left .24s var(--ease) !important;
}
[data-theme="light"] #thm-btn::after { left: 22px !important; }

/* ═══════════════════════════════════════════════════════════════
   COOKIE BANNER – Always exactly viewport-centered
═══════════════════════════════════════════════════════════════ */
#cookie-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999990 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px !important;
  background: rgba(5,6,8,.55) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}
#cookie-overlay.hidden { display: none !important; }
#cookie-box {
  background: #14171e;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 14px;
  padding: clamp(22px,4vw,36px);
  max-width: 460px; width: 100%;
  box-shadow: 0 32px 80px rgba(0,0,0,.58);
  animation: cookiePop .28s cubic-bezier(.16,1,.3,1) forwards;
}
@keyframes cookiePop {
  from { opacity:0; transform: scale(.94) translateY(12px); }
  to   { opacity:1; transform: none; }
}
[data-theme="light"] #cookie-box {
  background: #fff;
  border-color: rgba(0,0,0,.10);
  box-shadow: 0 24px 60px rgba(0,0,0,.15);
}
#cookie-box h3 { font-size: 17px; font-weight: 700; margin: 0 0 9px; color: #f0f2f6; }
#cookie-box p  { font-size: 13px; line-height: 1.66; color: #8a92a5; margin: 0 0 18px; }
[data-theme="light"] #cookie-box h3 { color: #0f1218; }
[data-theme="light"] #cookie-box p  { color: #4a5166; }
.cookie-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.cookie-btn {
  padding: 10px 18px; border-radius: 7px; font-size: 13px; font-weight: 600;
  cursor: pointer; border: none; font-family: inherit; flex: 1; min-width: 110px;
  transition: opacity .18s, transform .18s;
}
.cookie-btn:hover { opacity: .86; transform: translateY(-1px); }
.cookie-btn-all { background: #f0f2f6; color: #0f1218; }
.cookie-btn-ess { background: rgba(255,255,255,.07); color: #8a92a5; border: 1px solid rgba(255,255,255,.12) !important; }
[data-theme="light"] .cookie-btn-all { background: #0f1218; color: #fff; }
[data-theme="light"] .cookie-btn-ess { background: rgba(0,0,0,.05); color: #4a5166; border-color: rgba(0,0,0,.12) !important; }

/* ═══════════════════════════════════════════════════════════════
   ALL MODALS – Always viewport-centered
═══════════════════════════════════════════════════════════════ */
#ref-modal {
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important; height: 100% !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: max(16px,2.5vw) !important;
  z-index: 99999 !important;
  background: rgba(5,6,8,.88) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  overflow: hidden !important;
}
#ref-modal.open {
  display: flex !important;
  animation: modalBgIn .22s ease forwards !important;
}
@keyframes modalBgIn { from{opacity:0} to{opacity:1} }
.ref-modal-inner {
  position: relative !important;
  margin: 0 auto !important;
  width: min(860px,calc(100vw - 24px)) !important;
  max-height: min(90vh,840px) !important;
  overflow-y: auto !important;
  border-radius: 12px !important;
  background: var(--bg2,#131519) !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  box-shadow: 0 32px 80px rgba(0,0,0,.65) !important;
  animation: modalIn .28s cubic-bezier(.16,1,.3,1) forwards !important;
}
@keyframes modalIn { from{opacity:0;transform:scale(.94) translateY(14px)} to{opacity:1;transform:none} }
.ref-modal-close {
  position: absolute !important; top:12px !important; right:12px !important; z-index:2 !important;
  width:36px !important; height:36px !important; border-radius:50% !important;
  background:rgba(10,12,16,.82) !important; border:1px solid rgba(255,255,255,.14) !important;
  color:rgba(255,255,255,.8) !important; font-size:18px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  cursor:pointer !important; line-height:1 !important;
  transition:background .2s, color .2s !important;
}
.ref-modal-close:hover { background:rgba(255,255,255,.16) !important; color:#fff !important; }
.ref-modal-video { width:100% !important; aspect-ratio:16/9 !important; background:#000 !important; display:block !important; border-radius:12px 12px 0 0 !important; }
.ref-modal-media { width:100% !important; display:block !important; border-radius:12px 12px 0 0 !important; max-height:56vh !important; object-fit:contain !important; background:#07080a !important; }
body.modal-open { overflow:hidden !important; }

/* ═══════════════════════════════════════════════════════════════
   HERO
═══════════════════════════════════════════════════════════════ */
/* Ken Burns + cinematic bg */
#hero-bg {
  filter: brightness(.3) saturate(.6) contrast(1.06) !important;
  animation: kenBurns 30s ease-out forwards !important;
}
@keyframes kenBurns {
  0%   { transform: scale(1.08) translate(0, 0); }
  100% { transform: scale(1.01) translate(-0.8%, 0.4%); }
}
[data-theme="light"] #hero-bg { filter: brightness(.76) saturate(.72) !important; }
@media (prefers-reduced-motion:reduce) { #hero-bg { animation: none !important; } }

/* Hero logo – BIGGER */
#hero-logo {
  width: clamp(200px,30vw,360px) !important;
  height: auto !important;
  margin-bottom: clamp(20px,3vw,36px) !important;
  filter: drop-shadow(0 6px 36px rgba(0,0,0,.45)) !important;
  animation: heroLogoIn 1.8s cubic-bezier(.16,1,.3,1) both !important;
}
@keyframes heroLogoIn {
  from { opacity:0; transform: scale(.88) translateY(14px); }
  to   { opacity:1; transform: none; }
}

/* h-tag pill */
.h-tag {
  display: inline-flex !important; align-items: center !important; gap: 7px !important;
  padding: 5px 16px !important;
  border: 1px solid rgba(200,164,90,.28) !important;
  border-radius: 99px !important;
  background: rgba(200,164,90,.07) !important;
  font-size: clamp(9px,1.1vw,11px) !important; letter-spacing: .22em !important;
  font-weight: 500 !important; color: var(--gold2) !important;
  -webkit-text-fill-color: var(--gold2) !important;
  margin-bottom: clamp(16px,2.5vw,26px) !important;
}
.h-tag::before {
  content: ''; width: 5px; height: 5px; border-radius: 50%;
  background: var(--gold2); flex-shrink: 0;
  animation: dotPulse 2.2s ease-in-out infinite;
}
@keyframes dotPulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.3;transform:scale(.5)} }
@media (prefers-reduced-motion:reduce) { .h-tag::before { animation: none; } }

/* h-title: shimmer dark / plain black light */
.h-title {
  font-size: clamp(28px,5.2vw,62px) !important;
  font-weight: 800 !important;
  letter-spacing: -.034em !important; line-height: 1.06 !important;
  background: linear-gradient(138deg,
    var(--tx,#e2e4e9) 0%,
    var(--tx,#e2e4e9) 40%,
    rgba(219,185,110,.88) 58%,
    var(--tx,#e2e4e9) 84%) !important;
  background-size: 200% auto !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  animation: titleShimmer 9s ease-in-out infinite alternate !important;
}
@keyframes titleShimmer { 0%{background-position:0%} 100%{background-position:100%} }
@media (prefers-reduced-motion:reduce) { .h-title { animation: none !important; } }

/* LIGHT MODE: plain, readable */
[data-theme="light"] .h-title {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #0d1118 !important;
  color: #0d1118 !important;
  animation: none !important;
}
[data-theme="light"] .h-sub {
  color: #2e3448 !important;
  -webkit-text-fill-color: #2e3448 !important;
}
[data-theme="light"] .h-tag {
  color: #7a5e20 !important;
  -webkit-text-fill-color: #7a5e20 !important;
}
[data-theme="light"] .btn-primary {
  background: #0e1220 !important;
  color: #fff !important;
}
.h-sub { font-size: clamp(14px,1.6vw,17px) !important; color: var(--tx2) !important; -webkit-text-fill-color: var(--tx2) !important; }

/* Scroll indicator */
.scue { position: absolute !important; bottom: clamp(20px,4vh,40px) !important; left: 50% !important; transform: translateX(-50%) !important; }

/* ═══════════════════════════════════════════════════════════════
   LIGHT MODE – clean, modern, Apple/DJI-inspired
═══════════════════════════════════════════════════════════════ */
[data-theme="light"] {
  --bg:  var(--lbg) !important;
  --bg2: var(--lbg2) !important;
  --bg3: var(--lbg3) !important;
  --tx:  var(--ltx) !important;
  --tx2: var(--ltx2) !important;
  --tx3: var(--ltx3) !important;
  --br:  var(--lbr) !important;
  --br2: var(--lbr2) !important;
}
[data-theme="light"] body { background: var(--lbg) !important; color: var(--ltx) !important; }
[data-theme="light"] .page-hero { background: linear-gradient(180deg, #fff 0%, var(--lbg2) 100%) !important; }
[data-theme="light"] .sec-title { color: var(--ltx) !important; -webkit-text-fill-color: var(--ltx) !important; }
[data-theme="light"] .sec-sub   { color: var(--ltx2) !important; }
[data-theme="light"] .sec-label { color: var(--ltx3) !important; }
[data-theme="light"] footer { background: #f0f2f6 !important; }
[data-theme="light"] .foot-tag, [data-theme="light"] .foot-ci { color: #6b7385 !important; }
[data-theme="light"] .foot-links a { color: #3a4154 !important; }
[data-theme="light"] .foot-copy { color: #6b7385 !important; }
[data-theme="light"] .foot-legal a { color: #6b7385 !important; }
[data-theme="light"] .card,
[data-theme="light"] .teaser-card,
[data-theme="light"] .pc,
[data-theme="light"] .web-ref { background: #fff !important; border-color: rgba(0,0,0,.09) !important; }
[data-theme="light"] .field input,
[data-theme="light"] .field textarea,
[data-theme="light"] .field select { background: #fff !important; border-color: rgba(0,0,0,.14) !important; color: var(--ltx) !important; }
[data-theme="light"] .field input:focus,
[data-theme="light"] .field textarea:focus { border-color: var(--gold) !important; box-shadow: 0 0 0 3px rgba(200,164,90,.12) !important; }
[data-theme="light"] .pb-img { filter: brightness(.72) saturate(.74) !important; }
[data-theme="light"] .k-note { background: #fff !important; }

/* ═══════════════════════════════════════════════════════════════
   TEASER CARDS
═══════════════════════════════════════════════════════════════ */
.teaser-grid {
  display: grid !important;
  grid-template-columns: repeat(2,1fr) !important;
  gap: 0 !important;
  background: transparent !important;
  border: 1px solid var(--br,rgba(255,255,255,.07)) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
.teaser-card {
  background: linear-gradient(148deg,var(--bg2,#131519),var(--bg3,#1a1d22)) !important;
  border-right: 1px solid var(--br,rgba(255,255,255,.07)) !important;
  border-bottom: 2px solid transparent !important;
  transition: background .24s, border-color .24s, transform .24s var(--ease), box-shadow .24s !important;
  position: relative !important; overflow: hidden !important;
}
.teaser-card:nth-child(even) { border-right: none !important; }
.teaser-card:nth-child(n+3) { border-top: 1px solid var(--br,rgba(255,255,255,.07)) !important; }
.teaser-card:hover {
  border-bottom-color: var(--gold) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.14) !important;
  z-index: 1 !important;
}
.t-icon svg { stroke: var(--gold2) !important; }

/* ═══════════════════════════════════════════════════════════════
   BUTTONS
═══════════════════════════════════════════════════════════════ */
.btn { position: relative !important; overflow: hidden !important; }
.btn::before {
  content: '' !important; position: absolute !important; inset: 0 !important;
  background: linear-gradient(115deg,transparent 28%,rgba(255,255,255,.18) 50%,transparent 72%) !important;
  transform: translateX(-120%) !important;
  transition: transform .6s var(--ease) !important;
}
.btn:hover::before { transform: translateX(120%) !important; }
.btn-primary:hover { transform: translateY(-2px) !important; box-shadow: 0 8px 26px rgba(0,0,0,.22) !important; }
.btn-outline:hover { transform: translateY(-2px) !important; }

/* ═══════════════════════════════════════════════════════════════
   REVEAL ANIMATIONS
═══════════════════════════════════════════════════════════════ */
.rv { opacity:0; will-change:opacity,transform; }
.rv-up   { transform: translateY(20px); }
.rv-left { transform: translateX(-20px); }
.rv-right{ transform: translateX(20px); }
.rv-fade { transform: none; }
@keyframes rvUp  { to{opacity:1;transform:translateY(0)} }
@keyframes rvLft { to{opacity:1;transform:translateX(0)} }
@keyframes rvRgt { to{opacity:1;transform:translateX(0)} }
@keyframes rvFd  { to{opacity:1} }
.rv.go.rv-up   { animation: rvUp  .65s cubic-bezier(.16,1,.3,1) forwards; }
.rv.go.rv-left { animation: rvLft .65s cubic-bezier(.16,1,.3,1) forwards; }
.rv.go.rv-right{ animation: rvRgt .65s cubic-bezier(.16,1,.3,1) forwards; }
.rv.go.rv-fade { animation: rvFd  .52s ease forwards; }
.rv.done { opacity:1 !important; transform:none !important; animation:none !important; }
.d1{animation-delay:.07s}.d2{animation-delay:.14s}.d3{animation-delay:.21s}.d4{animation-delay:.28s}

/* ═══════════════════════════════════════════════════════════════
   PAGE TRANSITION
═══════════════════════════════════════════════════════════════ */
body.page-fade { animation: pageFadeIn .3s ease forwards; }
@keyframes pageFadeIn { from{opacity:0;transform:translateY(4px)} to{opacity:1;transform:none} }

/* ═══════════════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════════════ */
.foot-admin-link { opacity:.42 !important; font-size:12px !important; transition:opacity .2s !important; }
.foot-admin-link:hover { opacity:1 !important; }

/* ═══════════════════════════════════════════════════════════════
   MOBILE – complete centering
═══════════════════════════════════════════════════════════════ */
@media (max-width:700px) {
  #hero-c { align-items:center !important; text-align:center !important; padding:0 18px !important; }
  .h-btns { flex-direction:column !important; align-items:center !important; width:100% !important; gap:10px !important; }
  .h-btns .btn { width:min(290px,88vw) !important; justify-content:center !important; }
  .stats { grid-template-columns:repeat(2,1fr) !important; }
  .stat:nth-child(even) { border-right:none !important; }
  .stat:nth-child(n+3) { border-top:1px solid var(--br) !important; }
  .teaser-grid { grid-template-columns:1fr !important; border-radius:10px !important; }
  .teaser-card { border-right:none !important; }
  .teaser-card:nth-child(n+2) { border-top:1px solid var(--br) !important; }
  .about-grid { grid-template-columns:1fr !important; }
  .about-img { width:min(180px,52vw) !important; aspect-ratio:1/1 !important; margin:0 auto !important; }
  .sec-label,.sec-title { text-align:center !important; }
  .sec-sub { text-align:center !important; margin:0 auto !important; }
  .page-hero-label,.page-hero-title { text-align:center !important; }
  .page-hero-sub { text-align:center !important; margin:0 auto !important; }
  .ref-filters { justify-content:center !important; }
  .svc-row { grid-template-columns:1fr !important; padding:18px !important; }
  .svc-meta { flex-direction:row !important; align-items:center !important; gap:10px !important; }
  .svc-ref { max-width:100% !important; }
  .ub-grid { grid-template-columns:1fr !important; }
  .ub-photo { width:min(170px,52vw) !important; margin:0 auto !important; }
  .ub-name,.ub-role { text-align:center !important; }
  .ub-div { margin:0 auto 18px !important; }
  .ub-chips { justify-content:center !important; flex-wrap:wrap !important; }
  .k-grid { grid-template-columns:1fr !important; }
  .k-info { align-items:center !important; text-align:center !important; }
  .k-soc { justify-content:center !important; }
  .p-tabs { flex-direction:column !important; }
  .ptab { text-align:left !important; border-bottom:none !important; border-left:2px solid transparent !important; }
  .ptab.on { border-left-color:var(--gold) !important; }
  .calc-opts { flex-direction:column !important; }
  .copt { width:100% !important; }
  .calc-ft { flex-direction:column !important; align-items:stretch !important; }
  .calc-actions .btn { width:100% !important; justify-content:center !important; }
  .foot-grid { grid-template-columns:1fr !important; gap:24px !important; text-align:center !important; }
  .foot-links { align-items:center !important; }
  .foot-ci { justify-content:center !important; }
  .foot-bar { flex-direction:column !important; align-items:center !important; }
  .foot-legal { justify-content:center !important; }
  .proj-grid { grid-template-columns:1fr !important; }
  .proj-card.wide,.proj-card.narrow { grid-column:span 1 !important; min-height:185px !important; }
  .web-ref { grid-template-columns:1fr !important; }
  .price-grid { grid-template-columns:1fr 1fr !important; }
}
@media (max-width:420px) {
  .h-title { font-size:clamp(24px,8vw,34px) !important; }
  .price-grid { grid-template-columns:1fr !important; }
  .gear-grid { grid-template-columns:1fr !important; }
}

/* ── SAFE AREA (notch phones) ────────────────────────────── */
@supports (padding:env(safe-area-inset-left)) {
  #nav {
    padding-left:  max(clamp(16px,5vw,64px), env(safe-area-inset-left)) !important;
    padding-right: max(clamp(16px,5vw,64px), env(safe-area-inset-right)) !important;
  }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.001ms !important; transition-duration:.001ms !important; }
  .h-title { animation:none !important; }
}


/* ═══════════════════════════════════════════════════════════════
   RH MEDIA v20 STABILISIERUNG – harte finale Overrides
   Zweck: Cookie/Referenz-Popups viewport-zentriert, Navbar wirklich fixed,
   kein Body-Transform, keine alten Patch-Konflikte.
═══════════════════════════════════════════════════════════════ */

/* Body nie transformieren – transformierte Eltern können fixed-Elemente beeinflussen */
html, body {
  width: 100% !important;
  min-height: 100% !important;
  overflow-x: clip !important;
}
body.page-fade {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

/* NAVBAR: wirklich fixed, immer oberste Ebene, nie weggescrollt */
#nav,
header#nav,
.site-header,
.navbar {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: auto !important;
  z-index: 2147483000 !important;
  transform: translate3d(0,0,0) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  will-change: background, box-shadow !important;
  contain: none !important;
}

/* Startseite oben: nur Hintergrund transparent, aber Navbar selbst bleibt vorhanden */
body.home-page #nav.at-top {
  background: linear-gradient(180deg, rgba(8,10,14,.36), rgba(8,10,14,.04)) !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
}
[data-theme="light"] body.home-page #nav.at-top {
  background: linear-gradient(180deg, rgba(255,255,255,.60), rgba(255,255,255,.10)) !important;
}

/* Lightmode Navbar bewusst hell */
[data-theme="light"] #nav,
[data-theme="light"] #nav.scrolled {
  background: rgba(255,255,255,.86) !important;
  color: #0f1218 !important;
  backdrop-filter: blur(22px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(140%) !important;
  border-bottom: 1px solid rgba(15,18,24,.10) !important;
  box-shadow: 0 8px 32px rgba(15,18,24,.08) !important;
}

/* Vollbild-Overlay-Grundregel für Cookie + Referenzen */
#cookie-overlay,
#ref-modal {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  z-index: 2147483640 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
  margin: 0 !important;
  transform: none !important;
  overflow: hidden !important;
  isolation: isolate !important;
}
#cookie-overlay.hidden,
#ref-modal:not(.open) {
  display: none !important;
}

/* Hintergrund wirklich über GANZEN Bildschirm */
#cookie-overlay {
  background: rgba(4,6,10,.66) !important;
  backdrop-filter: blur(14px) saturate(115%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(115%) !important;
}
#ref-modal {
  background: rgba(4,6,10,.78) !important;
  backdrop-filter: blur(14px) saturate(115%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(115%) !important;
}

/* Popup selbst */
#cookie-box {
  position: relative !important;
  margin: 0 !important;
  width: min(92vw, 560px) !important;
  max-height: min(86vh, 680px) !important;
  overflow: auto !important;
  transform: none !important;
  border-radius: 22px !important;
  padding: clamp(24px, 4vw, 38px) !important;
}
#cookie-box h3 {
  font-size: clamp(18px, 2vw, 24px) !important;
  letter-spacing: -.02em !important;
}

/* Referenzmodal exakt im Viewport */
.ref-modal-inner {
  position: relative !important;
  margin: 0 !important;
  width: min(920px, calc(100vw - 32px)) !important;
  max-height: calc(100dvh - 48px) !important;
  overflow: auto !important;
  transform: none !important;
}

/* Scroll sperren, wenn ein Modal offen ist */
body.modal-open {
  overflow: hidden !important;
  touch-action: none !important;
}

/* Preiskarten etwas gleichmäßiger */
.price-grid,
.pricing-grid,
.packages-grid {
  align-items: stretch !important;
}
.pc,
.price-card,
.package-card {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}
.pc .btn,
.price-card .btn,
.package-card .btn {
  margin-top: auto !important;
}

/* Kontakt im Lightmode cleaner */
[data-theme="light"] .contact-card,
[data-theme="light"] .k-note,
[data-theme="light"] .k-form,
[data-theme="light"] form,
[data-theme="light"] .field {
  background-clip: padding-box !important;
}
[data-theme="light"] .k-note,
[data-theme="light"] .contact-card {
  background: rgba(255,255,255,.82) !important;
  border: 1px solid rgba(15,18,24,.08) !important;
  box-shadow: 0 18px 42px rgba(15,18,24,.06) !important;
  padding: clamp(18px, 3vw, 28px) !important;
  border-radius: 18px !important;
}

/* Hero Logo noch präsenter */
#hero-logo {
  width: clamp(230px, 34vw, 420px) !important;
}

/* Weniger ruckelige Bildbewegung */
.pb-img {
  will-change: transform !important;
  transform: translate3d(0,0,0) !important;
}


/* ═══════════════════════════════════════════════════════════════
   RH MEDIA v21 – feedback polish
   Fixes: readable hero badge, cookie design, contact light mode,
   prices, references, website logos, service image strip.
════════════════════════════════════════════════════════════════ */

/* Hero badge readable in light mode */
[data-theme="light"] .h-tag {
  background: rgba(255,255,255,.72) !important;
  border-color: rgba(110,82,28,.32) !important;
  color: #5c4317 !important;
  -webkit-text-fill-color: #5c4317 !important;
  box-shadow: 0 8px 28px rgba(15,18,24,.08) !important;
  backdrop-filter: blur(12px) !important;
}
[data-theme="light"] .h-tag::before { background:#8b6b26 !important; }

/* Cookie popup – quieter, balanced, nicer buttons */
#cookie-box {
  width: min(92vw, 620px) !important;
  border-radius: 24px !important;
  padding: clamp(28px,4.4vw,44px) !important;
  background:
    radial-gradient(circle at 15% 0%, rgba(200,164,90,.16), transparent 34%),
    linear-gradient(180deg, rgba(24,27,34,.98), rgba(15,17,23,.98)) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  box-shadow: 0 34px 110px rgba(0,0,0,.68) !important;
}
#cookie-box h3 { font-size: clamp(24px,3vw,34px) !important; letter-spacing:-.035em !important; margin-bottom:12px !important; }
#cookie-box p { font-size: clamp(14px,1.35vw,16px) !important; line-height:1.75 !important; max-width: 48ch !important; }
.cookie-btns { display:grid !important; grid-template-columns: 1fr 1fr !important; gap:12px !important; margin-top:22px !important; }
.cookie-btn { min-height:48px !important; border-radius:12px !important; font-size:14px !important; }
.cookie-btn-all { background:#f2f3f6 !important; color:#11151d !important; }
.cookie-btn-ess, .cookie-btn-essential { background:rgba(255,255,255,.08) !important; color:#e9edf5 !important; border:1px solid rgba(255,255,255,.14) !important; }
[data-theme="light"] #cookie-box {
  background:
    radial-gradient(circle at 15% 0%, rgba(200,164,90,.14), transparent 35%),
    linear-gradient(180deg,#ffffff,#f4f5f8) !important;
  border-color: rgba(15,18,24,.10) !important;
  box-shadow: 0 32px 90px rgba(15,18,24,.18) !important;
}
[data-theme="light"] .cookie-btn-all { background:#0e1220 !important; color:#fff !important; }
[data-theme="light"] .cookie-btn-ess, [data-theme="light"] .cookie-btn-essential { background:rgba(15,18,24,.055) !important; color:#1c2230 !important; border-color:rgba(15,18,24,.11) !important; }
@media(max-width:520px){ .cookie-btns{grid-template-columns:1fr !important;} }

/* Contact light mode – remove stripe-looking text boxes */
[data-theme="light"] .k-info > div:not(.k-note),
[data-theme="light"] .k-form {
  background: rgba(255,255,255,.78) !important;
  border: 1px solid rgba(15,18,24,.075) !important;
  box-shadow: 0 18px 50px rgba(15,18,24,.055) !important;
  border-radius: 18px !important;
  padding: clamp(18px,2.4vw,26px) !important;
}
[data-theme="light"] .k-info { gap:14px !important; }
[data-theme="light"] .k-note { margin-top: 8px !important; }
[data-theme="light"] .field input,
[data-theme="light"] .field textarea,
[data-theme="light"] .field select {
  background: rgba(255,255,255,.92) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75) !important;
}

/* Prices – stronger, even, less empty, better euro */
.price-grid { grid-template-columns: repeat(auto-fit, minmax(230px,1fr)) !important; gap:18px !important; }
.pc {
  min-height: 220px !important;
  padding: clamp(22px,3vw,32px) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(200,164,90,.08), transparent 42%),
    linear-gradient(180deg,var(--bg2),var(--bg3)) !important;
  box-shadow: 0 14px 42px rgba(0,0,0,.16) !important;
}
[data-theme="light"] .pc {
  background: #fff !important;
  box-shadow: 0 18px 46px rgba(15,18,24,.075) !important;
}
.pc-name { font-size: 16px !important; font-weight: 700 !important; letter-spacing:-.018em !important; margin-bottom:8px !important; }
.pc-desc { font-size: 13px !important; line-height:1.55 !important; min-height: 44px !important; margin-bottom:22px !important; }
.pc-price { font-size: clamp(42px,5vw,64px) !important; line-height:.95 !important; color: var(--gold2) !important; margin-top:auto !important; display:flex !important; align-items:flex-end !important; gap:6px !important; }
.pc-price::after { content:'€'; font-size:.34em; line-height:1.3; color:var(--tx2); font-weight:650; margin-left:1px; }
.pc-unit { display:none !important; }
.pc-badge { border-radius:99px !important; padding:4px 9px !important; width:max-content !important; }
.p-note { border-radius:16px !important; padding:16px 20px !important; }

/* References – calmer card grid */
.proj-grid { display:grid !important; grid-template-columns: repeat(auto-fit, minmax(270px,1fr)) !important; gap:16px !important; margin-bottom:16px !important; }
.proj-card, .proj-card.wide, .proj-card.narrow { grid-column: auto !important; min-height: clamp(230px,28vw,360px) !important; border-radius:18px !important; overflow:hidden !important; box-shadow:0 20px 55px rgba(0,0,0,.22) !important; }
.proj-card:hover { transform: translateY(-4px) !important; }
.proj-img { filter: brightness(.78) saturate(.86) !important; }
.proj-card:hover .proj-img { filter: brightness(.48) saturate(.95) !important; transform:scale(1.045) !important; }
.proj-always { padding:20px !important; background:linear-gradient(180deg,transparent,rgba(0,0,0,.72)) !important; }
.proj-name { font-size: clamp(15px,1.5vw,19px) !important; }

/* Website refs – logo image if present, fallback if not */
.web-ref { border-radius:18px !important; overflow:hidden !important; margin-bottom:18px !important; }
.web-ref-preview { min-height:170px !important; }
.web-logo-screen { display:flex !important; align-items:center !important; justify-content:center !important; padding:18px !important; }
.web-logo-img { max-width:72% !important; max-height:86px !important; object-fit:contain !important; display:block; filter: drop-shadow(0 8px 22px rgba(0,0,0,.18)); }
.web-logo-fallback { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:var(--tx3); font-size:12px; letter-spacing:.08em; text-transform:uppercase; opacity:.72; }
.web-logo-img:not([style*="display: none"]) + .web-logo-fallback { display:none !important; }
[data-theme="light"] .web-ref-preview { background:linear-gradient(180deg,#fff,#eef1f6) !important; }

/* Service background block – no strange glow/text over image */
.pb { min-height: 270px !important; background: linear-gradient(135deg, rgba(16,18,24,.94), rgba(33,29,21,.92)) !important; }
.pb-img { opacity:.36 !important; filter: brightness(.62) saturate(.72) blur(.2px) !important; }
.pb-title { color:#f6f7fa !important; text-shadow:none !important; letter-spacing:-.025em !important; }
[data-theme="light"] .pb { background: linear-gradient(135deg,#f0f2f6,#e5e8ed) !important; }
[data-theme="light"] .pb-img { opacity:.22 !important; filter: brightness(1.05) saturate(.65) blur(.3px) !important; }
[data-theme="light"] .pb-title { color:#11151d !important; text-shadow:none !important; }

/* Über mich – cleaner CV/profiling */
.ub-cv-row { grid-template-columns: 130px 1fr !important; }
.gear-box, .ub-cv { border-radius:18px !important; }
.gear-item { font-weight:600 !important; }
@media(max-width:640px){ .ub-cv-row{grid-template-columns:1fr !important; gap:4px !important;} }

/* ═══════════════════════════════════════════════════════════════
   RH MEDIA v22 – final user feedback refinements
═══════════════════════════════════════════════════════════════ */

/* Theme switch: light = sun, dark = moon */
[data-theme="light"] .thm-icon-sun { opacity: .9 !important; }
[data-theme="light"] .thm-icon-sun svg { color: var(--gold) !important; stroke-width: 2.1 !important; }
[data-theme="light"] .thm-icon-moon { opacity: .32 !important; }
[data-theme="dark"] .thm-icon-moon { opacity: .9 !important; }
[data-theme="dark"] .thm-icon-moon svg { color: var(--gold2) !important; stroke-width: 2.1 !important; }
[data-theme="dark"] .thm-icon-sun { opacity: .32 !important; }
#thm-btn::after { left: 22px !important; }
[data-theme="light"] #thm-btn::after { left: 3px !important; }

/* Cookie modal: softer, clearer and more trustworthy */
#cookie-box {
  max-width: 560px !important;
  background: linear-gradient(155deg, rgba(24,27,35,.98), rgba(15,17,23,.98)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 22px !important;
  padding: clamp(26px,4.4vw,44px) !important;
}
#cookie-box h3 { font-size: clamp(25px,3.5vw,34px) !important; letter-spacing: -.035em !important; margin-bottom: 16px !important; }
#cookie-box p { font-size: 15px !important; line-height: 1.75 !important; color: rgba(230,234,244,.72) !important; }
#cookie-box a { color: var(--gold2) !important; text-decoration: none !important; border-bottom: 1px solid rgba(219,185,110,.35) !important; }
.cookie-btns { gap: 12px !important; margin-top: 22px !important; }
.cookie-btn { border-radius: 12px !important; padding: 13px 18px !important; font-size: 14px !important; }
.cookie-btn-all { background: #f3f5f9 !important; color: #10141f !important; }
.cookie-btn-essential, .cookie-btn-ess { background: rgba(255,255,255,.08) !important; color: rgba(240,243,249,.78) !important; border: 1px solid rgba(255,255,255,.12) !important; }
[data-theme="light"] #cookie-box { background: rgba(255,255,255,.96) !important; border-color: rgba(13,17,24,.1) !important; box-shadow: 0 28px 80px rgba(13,17,24,.18) !important; }
[data-theme="light"] #cookie-box p { color: #495164 !important; }
[data-theme="light"] .cookie-btn-all { background: #111827 !important; color: #fff !important; }
[data-theme="light"] .cookie-btn-essential, [data-theme="light"] .cookie-btn-ess { background: rgba(17,24,39,.06) !important; color: #384152 !important; border-color: rgba(17,24,39,.12) !important; }

/* Parallax sections: ensure image is visible and text stays clean */
.pb { min-height: clamp(320px,38vw,520px) !important; position: relative !important; overflow: hidden !important; }
.pb-img { position: absolute !important; inset: -8% 0 !important; background-size: cover !important; background-position: center !important; filter: brightness(.48) saturate(.78) !important; }
.pb-overlay { position: relative !important; z-index: 2 !important; min-height: inherit !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important; padding: 40px 20px !important; }
.pb-title { color: #fff !important; text-shadow: none !important; -webkit-text-fill-color: #fff !important; }
[data-theme="light"] .pb-img { filter: brightness(.72) saturate(.82) contrast(.98) !important; }
[data-theme="light"] .pb-title { color: #111827 !important; -webkit-text-fill-color: #111827 !important; text-shadow: none !important; }
[data-theme="light"] .pb::after { content:''; position:absolute; inset:0; background:rgba(246,247,249,.24); z-index:1; }

/* Reference cards: light mode readability */
[data-theme="light"] .proj-card::after { background: linear-gradient(to top, rgba(255,255,255,.92), rgba(255,255,255,.28) 46%, transparent) !important; }
[data-theme="light"] .proj-title { color: #0d1118 !important; text-shadow: none !important; }
[data-theme="light"] .proj-cat { color: #7a5e20 !important; text-shadow: none !important; }
[data-theme="light"] .proj-card { box-shadow: 0 10px 32px rgba(13,17,24,.08) !important; }

/* Contact page social links */
.k-socials { padding: 18px 22px !important; border-radius: 14px !important; border: 1px solid var(--br) !important; background: rgba(255,255,255,.045) !important; }
.social-grid { display:grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 10px !important; margin-top: 12px !important; }
.social-grid a { display:flex !important; align-items:center !important; justify-content:center !important; min-height: 42px !important; border-radius: 10px !important; border: 1px solid var(--br) !important; background: rgba(255,255,255,.055) !important; color: var(--tx) !important; text-decoration:none !important; font-weight: 650 !important; transition: transform .18s, border-color .18s, background .18s !important; }
.social-grid a:hover { transform: translateY(-2px) !important; border-color: rgba(200,164,90,.45) !important; background: rgba(200,164,90,.08) !important; }
[data-theme="light"] .k-socials, [data-theme="light"] .social-grid a { background: #fff !important; border-color: rgba(17,24,39,.1) !important; }
@media (max-width:520px){ .social-grid { grid-template-columns: 1fr !important; } }

/* Start stats light mode: less sterile */
[data-theme="light"] .stats { background: linear-gradient(180deg,#fff,#f3f5f8) !important; border-top:1px solid rgba(17,24,39,.08) !important; border-bottom:1px solid rgba(17,24,39,.08) !important; }
[data-theme="light"] .stat { border-color: rgba(17,24,39,.08) !important; }
[data-theme="light"] .stat-v { color: #0d1118 !important; }
[data-theme="light"] .stat-k { color: #5d667a !important; }

/* Slightly richer price card feel */
.pc { min-height: 220px !important; display:flex !important; flex-direction:column !important; justify-content:space-between !important; }
.p-price { display:flex !important; align-items:flex-end !important; gap: 6px !important; line-height: .9 !important; }
.p-price::after { content:'€'; font-size: 18px !important; font-weight: 700 !important; opacity: .8 !important; padding-bottom: 8px !important; }
.p-price .euro, .p-price small { display:none !important; }



/* ═══════════════════════════════════════════════════════════════
   RH MEDIA v23 – final tiny polish
═══════════════════════════════════════════════════════════════ */

/* Theme switch corrected: dark = moon side, light = sun side */
.thm-wrap { flex-direction: row !important; }
[data-theme="dark"] .thm-icon-moon { opacity: .92 !important; }
[data-theme="dark"] .thm-icon-moon svg { color: var(--gold2) !important; stroke-width: 2.1 !important; }
[data-theme="dark"] .thm-icon-sun { opacity: .28 !important; }
[data-theme="light"] .thm-icon-sun { opacity: .92 !important; }
[data-theme="light"] .thm-icon-sun svg { color: var(--gold) !important; stroke-width: 2.1 !important; }
[data-theme="light"] .thm-icon-moon { opacity: .28 !important; }
#thm-btn::after { left: 22px !important; }
[data-theme="light"] #thm-btn::after { left: 3px !important; }

/* Hero: no cropped letters, no accidental gold shimmer on the word "bewegen" */
#hero-logo {
  width: clamp(245px, 32vw, 430px) !important;
  margin-bottom: clamp(18px, 2.5vw, 30px) !important;
}
.h-title {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #f4f6fb !important;
  color: #f4f6fb !important;
  animation: none !important;
  line-height: 1.12 !important;
  padding: 0 .04em .08em !important;
  overflow: visible !important;
  text-shadow: 0 8px 42px rgba(0,0,0,.42) !important;
}
[data-theme="light"] .h-title {
  -webkit-text-fill-color: #0b101b !important;
  color: #0b101b !important;
  text-shadow: none !important;
}

/* Start highlights: less sterile in light mode */
.stats { min-height: 132px !important; }
.stat-v { letter-spacing: -.055em !important; }
.stat-k { letter-spacing: .18em !important; }
[data-theme="light"] .stats {
  background: linear-gradient(180deg,#f7f8fb 0%,#eef1f6 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75), inset 0 -1px 0 rgba(17,24,39,.06) !important;
}

/* References: make light-mode titles readable on every card */
.proj-card::after {
  content:'' !important;
  position:absolute !important;
  inset:0 !important;
  background: linear-gradient(to top, rgba(0,0,0,.82) 0%, rgba(0,0,0,.45) 38%, rgba(0,0,0,.10) 68%, transparent 100%) !important;
  pointer-events:none !important;
}
.proj-always { z-index:2 !important; }
.proj-name, .proj-title { color:#fff !important; -webkit-text-fill-color:#fff !important; text-shadow:0 2px 12px rgba(0,0,0,.55) !important; }
.proj-cat { color:var(--gold2) !important; text-shadow:0 2px 10px rgba(0,0,0,.45) !important; }
[data-theme="light"] .proj-card::after {
  background: linear-gradient(to top, rgba(0,0,0,.72) 0%, rgba(0,0,0,.38) 42%, rgba(0,0,0,.08) 72%, transparent 100%) !important;
}
[data-theme="light"] .proj-name,
[data-theme="light"] .proj-title { color:#fff !important; -webkit-text-fill-color:#fff !important; text-shadow:0 2px 12px rgba(0,0,0,.50) !important; }
[data-theme="light"] .proj-cat { color:#f0cc7a !important; text-shadow:0 2px 10px rgba(0,0,0,.45) !important; }

/* About: gold heading first, info text below – cleaner hierarchy */
.ub-cv-row {
  display: block !important;
  padding: 20px 28px !important;
}
.ub-cv-year {
  display: block !important;
  color: var(--gold2) !important;
  font-weight: 750 !important;
  margin-bottom: 6px !important;
  line-height: 1.25 !important;
}
.ub-cv-text {
  display: block !important;
  color: var(--tx2) !important;
  line-height: 1.55 !important;
  max-width: 860px !important;
}
[data-theme="light"] .ub-cv-text { color:#3a4154 !important; }

/* Parallax sections: make the Leistung CTA calmer and more premium */
.pb-title { font-weight: 760 !important; letter-spacing: -.028em !important; }
[data-theme="light"] .pb::after { background: linear-gradient(180deg,rgba(246,247,249,.16),rgba(246,247,249,.42)) !important; }
[data-theme="light"] .pb-title { color:#101520 !important; -webkit-text-fill-color:#101520 !important; }

/* Mobile: center content where a personal one-column layout benefits from centering */
@media (max-width:700px) {
  #hero-logo { width: min(260px, 66vw) !important; }
  .h-title { text-align:center !important; padding-bottom:.12em !important; }
  .ub-name, .ub-role, .ub-text, .ub-text p { text-align:center !important; }
  .ub-div { margin-left:auto !important; margin-right:auto !important; }
  .ub-chips, .ub-cv, .gear-box { text-align:center !important; }
  .ub-cv-row { padding: 18px 18px !important; }
  .ub-cv-year, .ub-cv-text { text-align:center !important; margin-left:auto !important; margin-right:auto !important; }
  .gear-grid { grid-template-columns:1fr !important; }
  .gear-item { justify-content:center !important; text-align:center !important; }
  .proj-name, .proj-title, .proj-cat { text-align:left !important; }
}


/* RH v24 final tiny fixes */
.h-title { padding-bottom: .08em !important; overflow: visible !important; }
#hero-logo { width: clamp(240px,34vw,430px) !important; }
[data-theme="dark"] .h-title { background:none !important; -webkit-text-fill-color:#f1f3f8 !important; color:#f1f3f8 !important; animation:none !important; }
[data-theme="dark"] .h-title br + * { color:#f1f3f8 !important; }
.stat-v { white-space: nowrap !important; }
.stat-k { white-space: normal !important; }
@media (max-width:700px){ .stats{grid-template-columns:1fr 1fr !important}.stat-v{font-size:clamp(26px,8vw,44px)!important}.stat-k{font-size:10px!important} }

/* Referenzen: readable in light mode */
[data-theme="light"] .proj-card::after,
[data-theme="light"] .proj-card .proj-overlay,
[data-theme="light"] .proj-card .proj-info { background: linear-gradient(180deg, transparent 0%, rgba(255,255,255,.30) 28%, rgba(255,255,255,.90) 100%) !important; }
[data-theme="light"] .proj-title, [data-theme="light"] .proj-card h3 { color:#0d1118 !important; text-shadow:0 1px 8px rgba(255,255,255,.75) !important; }
[data-theme="light"] .proj-cat, [data-theme="light"] .proj-card .proj-label { color:#6f571d !important; text-shadow:0 1px 8px rgba(255,255,255,.65) !important; }
[data-theme="light"] .proj-card .chip, [data-theme="light"] .proj-card .chip-acc { color:#34280e !important; background:rgba(200,164,90,.20)!important; }

/* CTA / parallax breaks: less tall, clearer image */
.pb { min-height: clamp(260px, 38vh, 430px) !important; }
.pb .pb-img, .pb-img { filter: brightness(.55) saturate(.8) !important; }
[data-theme="light"] .pb .pb-img, [data-theme="light"] .pb-img { filter: brightness(.86) saturate(.86) contrast(.96) !important; }
.pb-title { text-shadow:0 2px 18px rgba(0,0,0,.65) !important; }
[data-theme="light"] .pb-title { color:#111722 !important; text-shadow:0 1px 12px rgba(255,255,255,.75) !important; }

/* Leistungen cards copy */
.t-desc, .svc-desc { color:var(--tx2) !important; }
[data-theme="light"] .t-desc, [data-theme="light"] .svc-desc { color:#3a4154 !important; }

/* Über mich profile rows: title over text */
.profile-row, .ub-profile-row, .ub-list-row { display:grid !important; grid-template-columns: 1fr !important; gap:6px !important; }
.profile-row span, .ub-profile-row span, .ub-list-row span, .profile-row b, .ub-profile-row b, .ub-list-row b { color:var(--gold2)!important; font-weight:700!important; }
.profile-row div, .ub-profile-row div, .ub-list-row div { color:var(--tx2)!important; }

@media (max-width:700px){
  .ub-text, .ub-text p, .ub-name, .ub-role, .about-grid p, .about-grid .sec-title { text-align:center !important; }
  .ub-profile-row, .profile-row, .ub-list-row { text-align:center !important; }
  .svc-body, .svc-body p, .svc-points { text-align:center !important; }
  .svc-points { list-style-position: inside !important; padding-left:0 !important; }
}

/* ═══════════════════════════════════════════════════════════════
   V25 MOBILE MENU FINAL FIX
   - one logo only
   - one close button only
   - better mobile spacing
   - legal cookie buttons
═══════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  #mobile-menu {
    position: fixed !important;
    inset: 0 !important;
    z-index: 999999 !important;
    background: rgba(4,5,8,.72) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    padding: max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom)) !important;
    overflow-y: auto !important;
  }

  #mobile-menu:not(.open) {
    opacity: 0 !important;
    pointer-events: none !important;
    visibility: hidden !important;
  }

  #mobile-menu.open {
    opacity: 1 !important;
    pointer-events: auto !important;
    visibility: visible !important;
  }

  /* hide the hamburger/X from the fixed navbar while menu is open */
  #hbg.open {
    opacity: 0 !important;
    pointer-events: none !important;
    visibility: hidden !important;
  }

  .mm-panel {
    position: relative !important;
    inset: auto !important;
    width: min(100%, 520px) !important;
    min-height: auto !important;
    margin: 0 auto !important;
    padding: clamp(20px, 5vw, 30px) !important;
    border-radius: 24px !important;
    background: rgba(15,17,23,.98) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: 0 28px 80px rgba(0,0,0,.55) !important;
    transform: translateY(10px) scale(.985) !important;
    transition: transform .28s cubic-bezier(.16,1,.3,1), opacity .22s ease !important;
  }

  #mobile-menu.open .mm-panel {
    transform: none !important;
  }

  [data-theme="light"] .mm-panel {
    background: rgba(250,251,253,.98) !important;
    border-color: rgba(0,0,0,.12) !important;
    box-shadow: 0 28px 80px rgba(20,23,32,.20) !important;
  }

  .mm-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    padding-bottom: 20px !important;
    margin-bottom: 18px !important;
    border-bottom: 1px solid rgba(255,255,255,.10) !important;
  }

  [data-theme="light"] .mm-head {
    border-bottom-color: rgba(0,0,0,.10) !important;
  }

  .mm-logo {
    display: block !important;
    height: 54px !important;
    width: auto !important;
    max-width: 190px !important;
    object-fit: contain !important;
    margin: 0 !important;
  }

  /* close button: only the modal close button stays visible */
  .mm-close {
    appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    border-radius: 50% !important;
    border: 1px solid rgba(200,164,90,.55) !important;
    background: rgba(255,255,255,.035) !important;
    color: var(--gold2) !important;
    font-size: 31px !important;
    line-height: 1 !important;
    font-weight: 300 !important;
    padding: 0 0 4px !important;
    box-shadow: none !important;
  }

  .mm-close::before,
  .mm-close::after {
    content: none !important;
    display: none !important;
  }

  .mm-links {
    display: grid !important;
    gap: 8px !important;
    margin: 0 0 18px !important;
  }

  #mobile-menu .mm-links a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 58px !important;
    padding: 0 18px !important;
    border-radius: 16px !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    color: rgba(232,235,242,.62) !important;
    font-size: clamp(25px, 7vw, 34px) !important;
    font-weight: 650 !important;
    letter-spacing: -.035em !important;
    text-decoration: none !important;
  }

  [data-theme="light"] #mobile-menu .mm-links a {
    color: rgba(15,18,24,.62) !important;
  }

  #mobile-menu .mm-links a::after {
    content: '→' !important;
    position: static !important;
    opacity: .5 !important;
    transform: none !important;
    font-size: .78em !important;
    color: currentColor !important;
    border: 0 !important;
    background: none !important;
    width: auto !important;
    height: auto !important;
  }

  #mobile-menu .mm-links a.active,
  #mobile-menu .mm-links a:hover {
    background: rgba(255,255,255,.055) !important;
    border-color: rgba(255,255,255,.06) !important;
    color: #fff !important;
  }

  [data-theme="light"] #mobile-menu .mm-links a.active,
  [data-theme="light"] #mobile-menu .mm-links a:hover {
    background: rgba(0,0,0,.055) !important;
    border-color: rgba(0,0,0,.07) !important;
    color: #0f1218 !important;
  }

  .mm-cta {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 62px !important;
    margin-top: 16px !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #e6c879, #c9a258) !important;
    color: #10131a !important;
    font-size: clamp(20px, 5.8vw, 26px) !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    letter-spacing: -.02em !important;
    box-shadow: 0 16px 34px rgba(200,164,90,.16) !important;
  }

  .mm-legal {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
    margin-top: 18px !important;
  }

  .mm-legal a,
  .mm-legal button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 44px !important;
    padding: 0 10px !important;
    border-radius: 13px !important;
    border: 1px solid rgba(255,255,255,.11) !important;
    background: rgba(255,255,255,.03) !important;
    color: rgba(232,235,242,.66) !important;
    font: 650 14px/1.1 system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    text-decoration: none !important;
    cursor: pointer !important;
  }

  [data-theme="light"] .mm-legal a,
  [data-theme="light"] .mm-legal button {
    border-color: rgba(0,0,0,.10) !important;
    background: rgba(0,0,0,.035) !important;
    color: rgba(15,18,24,.68) !important;
  }
}

@media (max-width: 390px) {
  .mm-panel { padding: 18px !important; border-radius: 20px !important; }
  .mm-logo { height: 46px !important; max-width: 160px !important; }
  .mm-close { width: 42px !important; height: 42px !important; min-width: 42px !important; }
  #mobile-menu .mm-links a { min-height: 52px !important; font-size: 25px !important; }
  .mm-cta { min-height: 56px !important; font-size: 20px !important; }
  .mm-legal { gap: 7px !important; }
  .mm-legal a, .mm-legal button { min-height: 40px !important; font-size: 12px !important; }
}