/* ══════════════════════════════════════════════
   BUSINESS BILDSPRACHE · LIGHT EDITORIAL
   Sandra Seibt · Premium Photography
══════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400;1,600&family=Inter:wght@300;400;500&family=Bebas+Neue&display=swap');

:root {
  /* ── Sandra Seibt · Warme Brauntöne ── */
  --bg:        #FAF7F2;   /* Sehr helles Creme             */
  --bg-2:      #F2EBE0;   /* Warmes Beige · Sektionen      */
  --bg-3:      #EAE0D4;   /* Etwas dunkler · Tiefe         */
  --surface:   #E8DDD0;   /* Sanftes Taupe · Karten        */
  --surface-2: #DDD0C0;   /* Etwas dunkler                 */
  --bg-dark:   #2A1E14;   /* Tiefes Espresso · Kontrast    */
  --bg-dark-2: #3A2A1C;   /* Etwas heller · Dark Sections  */
  --border:    rgba(42,30,20,0.10);
  --border-2:  rgba(42,30,20,0.18);

  /* Bordeaux · Akzentfarbe Buttons & Links */
  --gold:      #7D3348;
  --gold-lt:   #A85A70;
  --gold-dark: #5C1F32;
  --gold-pale: rgba(125,51,72,0.10);
  --gold-glow: rgba(125,51,72,0.15);

  /* Soft Gold · Linien, Icons, Mini-Details */
  --terra:     #D6C3A3;
  --terra-lt:  #E8D8BC;

  --ink:       #2A1E14;   /* Tiefes Espresso · sehr gut lesbar */
  --white:     #2A1E14;
  --white-2:   rgba(42,30,20,0.65);
  --white-3:   rgba(42,30,20,0.42);
  --white-4:   rgba(42,30,20,0.08);

  --f-serif:  'Cormorant Garamond', Georgia, serif;
  --f-sans:   'Inter', system-ui, sans-serif;
  --f-display:'Bebas Neue', sans-serif;

  --ease:     cubic-bezier(.16,1,.3,1);
  --ease-in:  cubic-bezier(.4,0,1,1);
  --trans:    .6s var(--ease);
}

*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }

html { scroll-behavior:smooth; }

body {
  background:var(--bg);
  color:var(--white);
  font-family:var(--f-sans);
  font-weight:300;
  line-height:1.7;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

/* ── NOISE OVERLAY ───────────────────────── */
body::before {
  content:'';
  position:fixed;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity:.03;
  pointer-events:none;
  z-index:999;
}

/* ── CURSOR ──────────────────────────────── */
.cursor {
  position:fixed;width:8px;height:8px;
  background:var(--gold);border-radius:50%;
  pointer-events:none;z-index:9999;
  transform:translate(-50%,-50%);
  transition:transform .1s, width .3s var(--ease), height .3s var(--ease), opacity .3s;
  mix-blend-mode:normal;
}
.cursor-ring {
  position:fixed;width:36px;height:36px;
  border:1px solid rgba(196,147,58,.5);
  border-radius:50%;pointer-events:none;z-index:9998;
  transform:translate(-50%,-50%);
  transition:transform .25s var(--ease), width .4s var(--ease), height .4s var(--ease), border-color .3s, opacity .3s;
}
body:hover .cursor { opacity:1; }

/* ── NAV ─────────────────────────────────── */
nav {
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:2rem 3.5rem;
  display:flex;align-items:center;justify-content:space-between;
  transition:background .5s, padding .5s;
}
nav.scrolled {
  background:rgba(250,248,243,0.94);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  padding:1.2rem 3.5rem;
  border-bottom:1px solid var(--border);
}
.nav-logo {
  font-family:var(--f-serif);
  font-size:1.15rem;
  font-weight:300;
  letter-spacing:.15em;
  color:var(--white);
  text-decoration:none;
  text-transform:uppercase;
}
.nav-logo span { color:var(--gold); }
.nav-links {
  display:flex;gap:2.5rem;list-style:none;
}
.nav-links a {
  font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--white-2);text-decoration:none;
  transition:color .3s;
}
.nav-links a:hover { color:var(--gold); }
.nav-cta {
  font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;
  border:1px solid var(--gold);color:var(--gold);
  padding:.6rem 1.4rem;text-decoration:none;
  transition:background .3s, color .3s;
}
.nav-cta:hover { background:var(--gold);color:var(--bg); }

/* ── HERO ────────────────────────────────── */
.hero {
  height:100vh;min-height:700px;
  display:grid;place-items:center;
  position:relative;overflow:hidden;
}
.hero-bg {
  position:absolute;inset:0;
  background:radial-gradient(ellipse 80% 60% at 70% 50%, rgba(196,147,58,.10) 0%, transparent 60%),
             radial-gradient(ellipse 50% 80% at 20% 80%, rgba(196,147,58,.06) 0%, transparent 50%);
}
.hero-line-v {
  position:absolute;top:0;bottom:0;left:50%;
  width:1px;background:var(--border);
  transform:scaleY(0);transform-origin:top;
  animation:lineGrow 1.4s var(--ease) .3s forwards;
}
.hero-line-h {
  position:absolute;left:0;right:0;top:50%;
  height:1px;background:var(--border);
  transform:scaleX(0);transform-origin:left;
  animation:lineGrow 1.4s var(--ease) .6s forwards;
}
@keyframes lineGrow { to { transform:scale(1); } }

.hero-content {
  position:relative;z-index:5;
  text-align:center;padding:0 2rem;
  max-width:1100px;
}
.hero-eyebrow {
  font-size:.72rem;letter-spacing:.25em;text-transform:uppercase;
  color:var(--gold);margin-bottom:2.5rem;
  opacity:0;animation:fadeUp .8s var(--ease) .8s forwards;
}
.hero-title {
  font-family:var(--f-serif);
  font-size:clamp(2.4rem, 5vw, 4.8rem);
  font-weight:300;line-height:1.15;
  letter-spacing:-.01em;
  margin-bottom:2.5rem;
  overflow:visible;
  padding-bottom:0.15em;
}
.hero-title .line {
  display:block;overflow:hidden;
  padding-bottom:.12em;margin-bottom:-.12em;
}
.hero-title .line-inner {
  display:block;
  opacity:0;transform:translateY(100%);
  animation:slideUp .9s var(--ease) forwards;
}
.hero-title .line:nth-child(1) .line-inner { animation-delay:.9s; }
.hero-title .line:nth-child(2) .line-inner { animation-delay:1.05s; }
.hero-title .line:nth-child(3) .line-inner { animation-delay:1.2s; }
.hero-title em { font-style:italic;color:var(--gold); }
@keyframes slideUp { to { opacity:1;transform:translateY(0); } }
@keyframes fadeUp  { to { opacity:1;transform:translateY(0); } }

.hero-sub {
  font-size:1rem;color:var(--white-2);
  max-width:540px;margin:0 auto 3rem;
  opacity:0;animation:fadeUp .8s var(--ease) 1.4s forwards;
}
.hero-actions {
  display:flex;gap:1.5rem;justify-content:center;align-items:center;
  opacity:0;animation:fadeUp .8s var(--ease) 1.6s forwards;
}
.btn-ghost {
  font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid var(--border-2);color:var(--white);
  padding:.9rem 2.2rem;text-decoration:none;
  transition:border-color .3s, color .3s;
}
.btn-ghost:hover { border-color:var(--gold);color:var(--gold); }
.btn-fill {
  font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;
  background:var(--gold);color:var(--bg);
  padding:.9rem 2.2rem;text-decoration:none;border-radius:2rem;
  transition:background .3s, transform .3s;
}
.btn-fill:hover { background:var(--gold-dark);transform:translateY(-2px); }

.hero-scroll {
  position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:.6rem;
  opacity:0;animation:fadeUp .8s var(--ease) 2s forwards;
}
.hero-scroll span {
  font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:var(--white-3);
}
.scroll-bar {
  width:1px;height:48px;background:var(--border-2);
  position:relative;overflow:hidden;
}
.scroll-bar::after {
  content:'';position:absolute;inset:0;
  background:var(--gold);transform:translateY(-100%);
  animation:scrollBar 1.8s var(--ease) 2.2s infinite;
}
@keyframes scrollBar {
  0%   { transform:translateY(-100%); }
  50%  { transform:translateY(0); }
  100% { transform:translateY(100%); }
}

/* ── TICKER ──────────────────────────────── */
.ticker {
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding:1.1rem 0;overflow:hidden;
  background:var(--surface);
}
.ticker-track {
  display:flex;width:max-content;
  animation:ticker 28s linear infinite;
}
.ticker-inner {
  display:flex;align-items:center;gap:3rem;
  padding-right:3rem;white-space:nowrap;
}
.ticker-inner span {
  font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--white-3);
}
.ticker-inner em {
  color:var(--gold);font-style:normal;font-size:.7rem;
}
@keyframes ticker { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ── SECTION BASE ────────────────────────── */
.section { padding:8rem 0; }
.container { max-width:1240px;margin:0 auto;padding:0 3.5rem; }
.label-sm {
  font-size:.68rem;letter-spacing:.25em;text-transform:uppercase;
  color:var(--gold);margin-bottom:1.8rem;display:block;
}
.section-num {
  font-family:var(--f-display);
  font-size:clamp(5rem,10vw,9rem);
  color:var(--white-4);line-height:1;
  display:block;margin-bottom:-2rem;
}

/* ── METHODE ─────────────────────────────── */
.methode { background:var(--bg-2); }
.methode-top {
  display:grid;grid-template-columns:1fr 1fr;
  gap:4rem;align-items:end;margin-bottom:6rem;
}
.methode-h {
  font-family:var(--f-serif);
  font-size:clamp(2.8rem,5vw,4.5rem);
  font-weight:300;line-height:1.1;
}
.methode-h em { font-style:italic;color:var(--gold); }
.methode-intro {
  color:var(--white-2);font-size:1.05rem;line-height:1.8;
  padding-top:1rem;
}

.steps {
  display:grid;grid-template-columns:repeat(5,1fr);
  gap:1rem;border-top:none;
}
.step-item {
  padding:2.5rem 1.8rem;
  border-right:none;
  border:1px solid var(--border);
  border-radius:2rem;
  position:relative;
  transition:background .4s;
}
.step-item:last-child { border-right:none; }
.step-item:hover { background:var(--surface); }
.step-n {
  font-family:var(--f-display);font-size:3rem;
  color:var(--gold);opacity:.4;line-height:1;
  margin-bottom:1.5rem;
  transition:opacity .3s;
}
.step-item:hover .step-n { opacity:1; }
.step-h {
  font-family:var(--f-serif);font-size:1.2rem;
  font-weight:400;margin-bottom:.8rem;
  color:var(--white);
}
.step-p { font-size:.88rem;color:var(--white-2);line-height:1.7; }

/* ── FÜR WEN ─────────────────────────────── */
.fuer-wen { background:var(--bg); }
.fw-top {
  text-align:center;margin-bottom:5rem;
}
.fw-h {
  font-family:var(--f-serif);
  font-size:clamp(2.8rem,5vw,4.5rem);
  font-weight:300;line-height:1.1;
}
.fw-h em { font-style:italic;color:var(--gold); }
.fw-sub {
  color:var(--white-2);max-width:540px;margin:1.5rem auto 0;
  font-size:1rem;
}

.fw-cards {
  display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;
  background:transparent;
  border:none;
}
.fw-card {
  background:var(--bg);padding:3rem 2rem;
  transition:background .4s;
  position:relative;overflow:hidden;
  border-radius:2rem;
  border:1px solid var(--border);
}
.fw-card::before {
  content:'';position:absolute;bottom:0;left:0;right:0;
  height:2px;background:var(--gold);
  transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease);
}
.fw-card:hover { background:var(--surface); }
.fw-card:hover::before { transform:scaleX(1); }
.fw-num {
  font-family:var(--f-display);font-size:4rem;
  color:var(--white-4);line-height:1;margin-bottom:1.5rem;
}
.fw-card h4 {
  font-family:var(--f-serif);font-size:1.3rem;
  font-weight:400;margin-bottom:1rem;
  color:var(--white);
}
.fw-card p { font-size:.9rem;color:var(--white-2);line-height:1.7; }

/* ── STATEMENT ───────────────────────────── */
.statement {
  background:var(--surface);
  padding:7rem 0;text-align:center;
  position:relative;overflow:hidden;
}
.statement::before {
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 60% 100% at 50% 50%, rgba(196,147,58,.09) 0%, transparent 70%);
}
.statement-q {
  font-family:var(--f-serif);
  font-size:clamp(1.6rem,3.5vw,3rem);
  font-weight:300;line-height:1.4;
  max-width:900px;margin:0 auto;
  position:relative;z-index:1;
}
.statement-q em { font-style:italic;color:var(--gold); }
.statement-author {
  margin-top:2.5rem;font-size:.78rem;
  letter-spacing:.15em;text-transform:uppercase;
  color:var(--white-3);
}

/* ── PORTFOLIO ───────────────────────────── */
.portfolio { background:var(--bg-2); }
.pf-top {
  display:flex;align-items:flex-end;justify-content:space-between;
  margin-bottom:3.5rem;
}
.pf-h {
  font-family:var(--f-serif);
  font-size:clamp(2.8rem,5vw,4.2rem);
  font-weight:300;line-height:1.1;
}
.pf-h em { font-style:italic;color:var(--gold); }

.pf-grid {
  display:grid;
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: 340px 280px;
  gap:1rem;
}
.pf-item {
  position:relative;overflow:hidden;
  background:var(--surface);
  border-radius:1.8rem;
}
.pf-item img {
  width:100%;height:100%;object-fit:cover;
  filter:brightness(.85) saturate(.9);
  transition:transform .8s var(--ease), filter .5s;
}
.pf-item:hover img { transform:scale(1.06);filter:brightness(.7) saturate(1); }
.pf-item-info {
  position:absolute;bottom:0;left:0;right:0;
  padding:1.5rem;
  background:linear-gradient(to top, rgba(30,18,8,.85) 0%, transparent 100%);
  transform:translateY(10px);opacity:0;
  transition:opacity .4s, transform .4s var(--ease);
}
.pf-item:hover .pf-item-info { opacity:1;transform:translateY(0); }
.pf-item-info small {
  font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);display:block;margin-bottom:.3rem;
}
.pf-item-info h4 { font-family:var(--f-serif);font-weight:400;font-size:1.1rem; }
.pf-item:first-child { grid-row:span 2; }
.pf-label {
  position:absolute;top:.8rem;left:.8rem;
  background:rgba(255,255,255,.88);backdrop-filter:blur(10px);
  border-radius:2rem;padding:.22rem .75rem;
  font-size:.45rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gold);border:1px solid rgba(125,51,72,.18);
  pointer-events:none;
}

/* ── TESTIMONIALS ────────────────────────── */
.testi { background:var(--bg); }
.testi-h {
  font-family:var(--f-serif);
  font-size:clamp(2.4rem,4vw,3.5rem);
  font-weight:300;margin-bottom:4rem;
  text-align:center;
}
.testi-h em { font-style:italic;color:var(--gold); }
.testi-grid {
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1rem;background:transparent;border:none;
}
.testi-card {
  background:var(--bg);padding:3rem;
  position:relative;transition:background .4s;
  border-radius:2rem;
  border:1px solid var(--border);
}
.testi-card:hover { background:var(--surface); }
.testi-card::before {
  content:'"';
  font-family:var(--f-serif);font-size:6rem;
  color:var(--gold);opacity:.15;
  position:absolute;top:1.5rem;right:2rem;
  line-height:1;
}
.testi-stars { color:var(--gold);font-size:.85rem;margin-bottom:1.5rem; }
.testi-card p { font-family:var(--f-serif);font-size:1.05rem;line-height:1.8;color:var(--white-2);margin-bottom:2rem;font-style:italic; }
.testi-who { display:flex;align-items:center;gap:1rem; }
.testi-av {
  width:40px;height:40px;border-radius:50%;
  background:var(--gold-pale);border:1px solid var(--gold);
  display:grid;place-items:center;
  font-size:.75rem;color:var(--gold);font-weight:500;
  flex-shrink:0;
}
.testi-who strong { display:block;font-size:.9rem;font-weight:400;color:var(--white); }
.testi-who span { font-size:.78rem;color:var(--white-3); }

/* ── ÜBER MICH ───────────────────────────── */
.ueber { background:var(--surface); }
.ueber-grid {
  display:grid;grid-template-columns:1fr 1fr;
  gap:6rem;align-items:center;
}
.ueber-img {
  position:relative;
  aspect-ratio:3/4;max-height:600px;
  overflow:hidden;
  border-radius:2.2rem;
}
.ueber-img img { width:100%;height:100%;object-fit:cover;object-position:center top; }
.ueber-img::after {
  content:'';position:absolute;inset:0;
  border:1px solid var(--border-2);pointer-events:none;
}
.ueber-img-frame {
  position:absolute;bottom:-1.5rem;right:-1.5rem;
  width:60%;height:60%;
  border:1px solid var(--gold);opacity:.3;pointer-events:none;
}
.ueber-text { padding:2rem 0; }
.ueber-h {
  font-family:var(--f-serif);
  font-size:clamp(2.4rem,4vw,3.5rem);
  font-weight:300;line-height:1.15;
  margin-bottom:2rem;
}
.ueber-h em { font-style:italic;color:var(--gold); }
.ueber-p { color:var(--white-2);line-height:1.85;margin-bottom:1.4rem; }
.ueber-tags { display:flex;flex-wrap:wrap;gap:.6rem;margin:2rem 0; }
.ueber-tag {
  font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid var(--border-2);color:var(--white-3);
  padding:.4rem 1rem;
}

/* ── CTA ─────────────────────────────────── */
.cta-section {
  padding:10rem 0;text-align:center;
  background:var(--bg-2);position:relative;overflow:hidden;
}
.cta-section::before {
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 70% 80% at 50% 50%, rgba(196,147,58,.10) 0%, transparent 65%);
}
.cta-big {
  font-family:var(--f-serif);
  font-size:clamp(3rem,7vw,7rem);
  font-weight:300;line-height:1.05;
  max-width:900px;margin:0 auto 3rem;
  position:relative;z-index:1;
}
.cta-big em { font-style:italic;color:var(--gold); }
.cta-sub {
  color:var(--white-2);max-width:480px;margin:0 auto 3rem;
  position:relative;z-index:1;
}
.cta-actions { position:relative;z-index:1;display:flex;justify-content:center;gap:1.5rem; }

/* ── FOOTER ──────────────────────────────── */
footer {
  background:var(--bg);
  border-top:1px solid var(--border);
  padding:3rem 0;
}
.footer-inner {
  display:flex;align-items:center;justify-content:space-between;
}
.footer-logo { font-family:var(--f-serif);font-size:1rem;letter-spacing:.12em;color:var(--white-2); }
.footer-logo span { color:var(--gold); }
.footer-links { display:flex;gap:2rem; }
.footer-links a { font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--white-3);text-decoration:none;transition:color .3s; }
.footer-links a:hover { color:var(--gold); }
.footer-copy { font-size:.72rem;color:var(--white-3); }

/* ── REVEAL ANIMATIONS ───────────────────── */
.r { opacity:1;transform:translateY(0);transition:opacity .9s var(--ease), transform .9s var(--ease); }
.r.visible { opacity:1;transform:translateY(0); }
.r-left { opacity:1;transform:translateX(0);transition:opacity .9s var(--ease), transform .9s var(--ease); }
.r-left.visible { opacity:1;transform:translateX(0); }
.r-right { opacity:1;transform:translateX(0);transition:opacity .9s var(--ease), transform .9s var(--ease); }
.r-right.visible { opacity:1;transform:translateX(0); }

/* ── RESPONSIVE ──────────────────────────── */
@media(max-width:1024px) {
  .steps { grid-template-columns:repeat(3,1fr); }
  .pf-grid { grid-template-columns:1fr 1fr;grid-template-rows:auto; }
  .pf-item:first-child { grid-row:auto; }
  .ueber-grid { grid-template-columns:1fr;gap:3rem; }
  .ueber-img { max-height:400px; }
}
@media(max-width:768px) {
  nav { padding:1.5rem 1.5rem; }
  nav.scrolled { padding:1rem 1.5rem; }
  .nav-links { display:none; }
  .container { padding:0 1.5rem; }
  .section { padding:5rem 0; }
  .methode-top { grid-template-columns:1fr; }
  .steps { grid-template-columns:1fr 1fr; }
  .fw-cards { grid-template-columns:1fr 1fr; }
  .testi-grid { grid-template-columns:1fr; }
  .pf-grid { grid-template-columns:1fr; }
  .footer-inner { flex-direction:column;gap:1.5rem;text-align:center; }
}

/* ══ HAMBURGER & MOBILE MENU ══════════════ */
.nav-hamburger { display:none; }
.mobile-menu { display:none;position:fixed;inset:0;z-index:98;background:var(--bg);padding:5rem 2rem 3rem;flex-direction:column;overflow-y:auto; }
.mobile-menu.open { display:flex; }
.mobile-menu ul { list-style:none;display:flex;flex-direction:column;gap:1.8rem;margin-bottom:2rem; }
.mobile-menu ul a { font-family:var(--f-serif);font-size:1.8rem;font-weight:300;color:var(--white);text-decoration:none; }

@media(max-width:768px) {
  .nav-hamburger { display:flex;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:.5rem;z-index:101;position:relative; }
  .nav-hamburger span { display:block;width:24px;height:1.5px;background:var(--gold);transition:all .3s; }
  .nav-hamburger.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
  .nav-hamburger.open span:nth-child(2) { opacity:0; }
  .nav-hamburger.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }
  .nav-links { display:none !important; }
  .nav-cta { display:none !important; }
  .cursor, .cursor-ring { display:none !important; }
  nav { padding:1.2rem 1.5rem !important; }
  .container { padding:0 1.2rem !important; }
  .section { padding:4rem 0 !important; }
  .hero-actions { flex-direction:column !important;align-items:stretch !important;gap:1rem; }
  .btn-ghost, .btn-fill { text-align:center;display:block; }
  .steps { grid-template-columns:1fr !important; }
  .fw-cards { grid-template-columns:1fr !important; }
  .testi-grid { grid-template-columns:1fr !important; }
  .pf-grid { grid-template-columns:1fr !important;grid-template-rows:auto !important; }
  .pf-item { height:260px; }
  .pf-item:first-child { grid-row:auto !important; }
  .ueber-grid { grid-template-columns:1fr !important;gap:2rem; }
  .methode-top { grid-template-columns:1fr !important; }
  .footer-inner { flex-direction:column !important;gap:1.5rem;text-align:center; }
  .cta-actions { flex-direction:column !important;align-items:center; }
}

/* ══ HAMBURGER & MOBILE MENU ══════════════ */
.nav-hamburger { display:none; }
.mobile-menu { display:none;position:fixed;inset:0;z-index:98;background:var(--bg);padding:5rem 2rem 3rem;flex-direction:column;overflow-y:auto; }
.mobile-menu.open { display:flex; }
.mobile-menu ul { list-style:none;display:flex;flex-direction:column;gap:1.8rem;margin-bottom:2rem; }
.mobile-menu ul a { font-family:var(--f-serif);font-size:1.8rem;font-weight:300;color:var(--white);text-decoration:none; }

/* ══ COMPREHENSIVE MOBILE ══════════════════ */
@media(max-width:768px) {
  .nav-hamburger { display:flex;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:.5rem;z-index:101;position:relative; }
  .nav-hamburger span { display:block;width:24px;height:1.5px;background:var(--gold);transition:all .3s; }
  .nav-hamburger.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
  .nav-hamburger.open span:nth-child(2) { opacity:0; }
  .nav-hamburger.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }
  .nav-links { display:none !important; }
  .nav-cta { display:none !important; }
  .cursor, .cursor-ring { display:none !important; }
  nav { padding:1.2rem 1.5rem !important; }
  .container { padding:0 1.2rem !important; }
  .section { padding:4rem 0 !important; }
  .hero { grid-template-columns:1fr !important;min-height:100svh;padding:7rem 1.5rem 4rem !important;display:flex !important;flex-direction:column;align-items:center;justify-content:center; }
  .hero-content { padding:0 !important;text-align:center;max-width:100% !important; }
  .hero > div:last-of-type { display:none !important; }
  .hero-title { font-size:clamp(2rem,8vw,3rem) !important; }
  .hero-actions { flex-direction:column !important;align-items:stretch !important;gap:1rem; }
  .btn-ghost, .btn-fill { text-align:center;display:block;width:100%; }
  .page-hero { padding:8rem 0 3rem !important; }
  .page-hero-h { font-size:clamp(2rem,7vw,3rem) !important; }
  .steps { grid-template-columns:1fr !important; }
  .fw-cards { grid-template-columns:1fr !important; }
  .testi-grid { grid-template-columns:1fr !important; }
  .pf-grid { grid-template-columns:1fr !important;grid-template-rows:auto !important; }
  .pf-item { height:260px; }
  .pf-item:first-child { grid-row:auto !important; }
  .ueber-grid { grid-template-columns:1fr !important;gap:2rem; }
  .methode-top { grid-template-columns:1fr !important; }
  .k-grid { grid-template-columns:1fr !important;gap:2rem !important; }
  .l-card { grid-template-columns:1fr !important;gap:2rem !important;padding:2rem !important; }
  .l-card:nth-child(even) .l-card-img { order:0 !important; }
  .m-intro-grid { grid-template-columns:1fr !important; }
  .m-step-full { grid-template-columns:1fr !important; }
  .m-why-grid { grid-template-columns:1fr !important; }
  .u-story-grid { grid-template-columns:1fr !important;gap:2rem !important; }
  .u-values-grid { grid-template-columns:1fr !important; }
  .u-facts-grid { grid-template-columns:1fr 1fr !important; }
  .form-row { grid-template-columns:1fr !important; }
  .pf-masonry { columns:1 !important; }
  .footer-inner { flex-direction:column !important;gap:1.5rem;text-align:center; }
  .footer-links { flex-wrap:wrap;justify-content:center; }
  .cta-actions { flex-direction:column !important;align-items:center; }
  .btn-row { flex-direction:column !important;align-items:center; }
  .cta-big { font-size:clamp(2rem,8vw,3rem) !important; }
  .u-img { max-height:350px !important; }
  .u-img-deco { display:none; }
  .ticker { overflow:hidden; }
}

@media(max-width:480px) {
  .hero-title { font-size:clamp(1.8rem,7vw,2.5rem) !important; }
  nav { padding:1rem !important; }
  .testi-card { padding:1.5rem !important; }
  .k-form { padding:1.5rem !important; }
}

/* ══ HAMBURGER & MOBILE MENU ══════════════ */
.nav-hamburger { display:none; }
.mobile-menu {
  display:none;position:fixed;top:0;left:0;right:0;bottom:0;z-index:99;
  background:var(--bg);padding:5rem 2rem 3rem;
  flex-direction:column;overflow-y:auto;
}
.mobile-menu.open { display:flex; }
.mobile-menu ul { list-style:none;display:flex;flex-direction:column;gap:1.8rem;margin-bottom:2rem; }
.mobile-menu ul a { font-family:var(--f-serif);font-size:1.8rem;font-weight:300;color:var(--white);text-decoration:none; }

@media(max-width:768px) {
  .nav-hamburger { display:flex;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:.5rem;z-index:101;position:relative; }
  .nav-hamburger span { display:block;width:24px;height:1.5px;background:var(--gold);transition:all .3s; }
  .nav-hamburger.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
  .nav-hamburger.open span:nth-child(2) { opacity:0; }
  .nav-hamburger.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }
  .nav-links { display:none !important; }
  .nav-cta { display:none !important; }
  .cursor, .cursor-ring { display:none !important; }
  nav { padding:1.2rem 1.5rem !important; }
  .container { padding:0 1.2rem !important; }
  .section { padding:4rem 0 !important; }
  .hero { grid-template-columns:1fr !important;padding:7rem 1.5rem 4rem !important;display:flex !important;flex-direction:column;align-items:center;justify-content:center;min-height:100svh; }
  .hero-content { padding:2rem 0 0 0 !important;text-align:center;max-width:100% !important; }
  .hero > div:nth-child(3) { display:none !important; }
  .hero-title { font-size:clamp(2rem,8vw,3rem) !important; }
  .hero-actions { flex-direction:column !important;align-items:stretch !important;gap:1rem; }
  .btn-ghost, .btn-fill { text-align:center !important;display:block !important;width:100% !important; }
  .page-hero { padding:8rem 0 3rem !important; }
  .page-hero-h { font-size:clamp(2rem,7vw,3rem) !important; }
  .steps { grid-template-columns:1fr !important; }
  .fw-cards { grid-template-columns:1fr !important; }
  .testi-grid { grid-template-columns:1fr !important; }
  .pf-grid { grid-template-columns:1fr !important;grid-template-rows:auto !important; }
  .pf-item { height:260px; }
  .pf-item:first-child { grid-row:auto !important; }
  .ueber-grid { grid-template-columns:1fr !important;gap:2rem; }
  .methode-top { grid-template-columns:1fr !important; }
  .k-grid { grid-template-columns:1fr !important;gap:2rem !important; }
  .l-card { grid-template-columns:1fr !important;gap:2rem !important;padding:2rem !important; }
  .l-card:nth-child(even) .l-card-img { order:0 !important; }
  .m-intro-grid { grid-template-columns:1fr !important; }
  .m-step-full { grid-template-columns:1fr !important; }
  .m-why-grid { grid-template-columns:1fr !important; }
  .u-story-grid { grid-template-columns:1fr !important;gap:2rem !important; }
  .u-values-grid { grid-template-columns:1fr !important; }
  .u-facts-grid { grid-template-columns:1fr 1fr !important; }
  .form-row { grid-template-columns:1fr !important; }
  .pf-masonry { columns:1 !important; }
  .footer-inner { flex-direction:column !important;gap:1.5rem;text-align:center; }
  .footer-links { flex-wrap:wrap;justify-content:center; }
  .cta-actions { flex-direction:column !important;align-items:center; }
  .btn-row { flex-direction:column !important;align-items:center; }
  .cta-big { font-size:clamp(2rem,8vw,3rem) !important; }
  .u-img { max-height:350px !important; }
  .u-img-deco { display:none; }
  .ticker { overflow:hidden; }
}

@media(max-width:480px) {
  .hero-title { font-size:clamp(1.8rem,7vw,2.5rem) !important; }
  nav { padding:1rem !important; }
  .testi-card { padding:1.5rem !important; }
  .k-form { padding:1.5rem !important; }
}

/* ══ CSS-ONLY HAMBURGER (no JS needed) ══════ */
#menu-toggle { display:none; }

.nav-hamburger {
  display:none;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
  padding:.5rem;
  z-index:101;
  position:relative;
}
.nav-hamburger span {
  display:block;
  width:24px;
  height:2px;
  background:var(--gold);
  transition:all .3s;
}

@media(max-width:768px) {
  .nav-hamburger { display:flex; }
  .nav-links { display:none !important; }
  .nav-cta { display:none !important; }
  
  /* Mobile menu hidden by default */
  .mobile-menu {
    display:none;
    position:fixed;
    inset:0;
    z-index:99;
    background:var(--bg);
    padding:5rem 2rem 3rem;
    flex-direction:column;
    overflow-y:auto;
  }
  
  /* Show menu when checkbox is checked */
  #menu-toggle:checked ~ .mobile-menu { display:flex !important; }
  
  /* Animate hamburger to X when checked */
  #menu-toggle:checked ~ nav .nav-hamburger span:nth-child(1),
  #menu-toggle:checked + nav .nav-hamburger span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
  #menu-toggle:checked ~ nav .nav-hamburger span:nth-child(2),
  #menu-toggle:checked + nav .nav-hamburger span:nth-child(2) { opacity:0; }
  #menu-toggle:checked ~ nav .nav-hamburger span:nth-child(3),
  #menu-toggle:checked + nav .nav-hamburger span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
}

/* ══ SPECIFIC MOBILE FIXES ══════════════════ */
@media(max-width:768px) {
  /* 3 comparison boxes - stack vertically */
  .comparison-grid {
    grid-template-columns: 1fr !important;
  }
  
  /* Hero image - show below text on mobile */
  .hero > div:last-child {
    display:flex !important;
    justify-content:center;
    padding:0 1.5rem 2rem !important;
  }
  .hero > div:last-child > div {
    max-width:280px !important;
    margin:0 auto !important;
  }
  
  /* Portfolio image text - make more readable */
  .pf-item-info {
    opacity:1 !important;
    transform:translateY(0) !important;
    background:linear-gradient(to top,rgba(20,10,5,.9) 0%,transparent 100%) !important;
  }
  .pf-label {
    font-size:.55rem !important;
  }
}

/* Fix comparison boxes on mobile */
@media(max-width:768px) {
  .comparison-grid {
    grid-template-columns: 1fr !important;
    overflow: visible !important;
  }
}

/* Fix 3 Bild-Karten on mobile */
@media(max-width:768px) {
  .bild-karten {
    grid-template-columns: 1fr !important;
  }
  .bild-karten > div {
    aspect-ratio: 4/3 !important;
  }
}

/* ══ BILD-KARTEN ══════════════════════════ */
.bild-karte {
  border-radius:1.4rem;
  overflow:hidden;
  background:var(--bg);
  border:1px solid var(--border);
}
.bild-karte-img {
  aspect-ratio:4/3;
  overflow:hidden;
}
.bild-karte-img img {
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .7s;
}
.bild-karte:hover .bild-karte-img img { transform:scale(1.04); }
.bild-karte-text {
  padding:1.2rem 1.5rem 1.5rem;
}
.bild-karte-text span {
  font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);display:block;margin-bottom:.4rem;
}
.bild-karte-text p {
  font-family:var(--f-serif);font-size:1.2rem;font-style:italic;
  color:var(--white);line-height:1.3;margin-bottom:.5rem;
}
.bild-karte-text small {
  font-size:.78rem;color:var(--white-2);line-height:1.6;display:block;
}

@media(max-width:768px) {
  .bild-karten { grid-template-columns:1fr !important; }
}