/* ============================================================
   THEME 03 — WARM / HANDWERKLICH
   ------------------------------------------------------------
   Erdtöne, Rundbögen, organische Formen, weiche Schatten und
   eine warme Serife mit kursiven Akzenten. Gemütlich, aber
   edel — wie geöltes Holz bei Abendlicht.
   ============================================================ */

body[data-theme="warm"] {
  /* --- Tokens --- */
  --c-bg:         #f7efe3;
  --c-surface:    #ecdfc9;
  --c-ink:        #38291c;
  --c-ink-soft:   #8a7158;
  --c-accent:     #b65c33;
  --c-accent-ink: #fdf8ef;
  --c-line:       #ddcbB0;
  --c-deep:       #5d4631;          /* dunkles Holz für Footer/Kontakt */

  --font-display: "Fraunces", serif;
  --font-body:    "Karla", sans-serif;

  --radius-img:   1.4rem;
  --btn-radius:   999px;
  --container:    1360px;
  --ease:         cubic-bezier(.25, .8, .3, 1);
  --dur:          1s;

  --warm-shadow:  0 24px 48px -20px rgba(80, 52, 28, .35);

  font-size: 16.5px;
}
/* feines Papierkorn über allem */
body[data-theme="warm"]::after {
  content: ""; position: fixed; inset: 0; z-index: 950;
  pointer-events: none; opacity: .05; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
body[data-theme="warm"] h1 em, body[data-theme="warm"] h2 em {
  font-style: italic; font-weight: 340; color: var(--c-accent);
}

/* Reveals: weiches Aufsteigen mit leichtem Skalieren */
body[data-theme="warm"] [data-reveal] { transform: translateY(34px) scale(.985); }
body[data-theme="warm"] [data-reveal].is-revealed { transform: none; }

/* ---------- Header ---------- */
body[data-theme="warm"] .site-header {
  background: color-mix(in srgb, var(--c-bg) 85%, transparent);
  backdrop-filter: blur(10px);
}
body[data-theme="warm"] .site-header.is-scrolled { box-shadow: 0 10px 30px -18px rgba(80, 52, 28, .4); }
body[data-theme="warm"] .brand__name { font-weight: 600; font-size: 1.25rem; }
body[data-theme="warm"] .main-nav__link { font-size: .9rem; }
body[data-theme="warm"] .main-nav__link::after {
  content: ""; position: absolute; left: 50%; bottom: -2px;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--c-accent);
  transform: translateX(-50%) scale(0);
  transition: transform .3s var(--ease);
}
body[data-theme="warm"] .main-nav__link:hover::after { transform: translateX(-50%) scale(1); }
body[data-theme="warm"] .theme-btn { border-radius: 999px; }
body[data-theme="warm"] .theme-btn:not([aria-pressed="true"]):hover { background: var(--c-surface); }

/* ---------- Hero: Rundbogen & Blob ---------- */
body[data-theme="warm"] .hero {
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
}
/* organischer Blob hinter dem Bild */
body[data-theme="warm"] .hero__deco {
  position: absolute; right: -6%; top: 12%;
  width: clamp(320px, 46vw, 720px); aspect-ratio: 1;
  background: radial-gradient(circle at 35% 30%, #e8c79a, #d9a86c 65%, #cf9858);
  border-radius: 58% 42% 55% 45% / 45% 52% 48% 55%;
  opacity: .5; filter: blur(2px);
  animation: warm-blob 16s ease-in-out infinite alternate;
}
@keyframes warm-blob {
  from { border-radius: 58% 42% 55% 45% / 45% 52% 48% 55%; transform: rotate(0deg); }
  to   { border-radius: 45% 55% 44% 56% / 55% 45% 58% 42%; transform: rotate(10deg); }
}
body[data-theme="warm"] .hero__inner { position: relative; z-index: 2; }
body[data-theme="warm"] .hero__kicker {
  display: inline-flex; align-items: center; gap: .7em;
  font-size: .8rem; letter-spacing: .2em; text-transform: uppercase;
  color: var(--c-accent); font-weight: 700;
  margin-bottom: 1.6rem;
}
/* kleine geschwungene Linie als Ornament */
body[data-theme="warm"] .hero__kicker::before {
  content: ""; width: 42px; height: 2px;
  background: var(--c-accent); border-radius: 2px; flex: none;
}
body[data-theme="warm"] .hero__title {
  font-size: clamp(3.4rem, 7.5vw, 6.8rem);
  font-weight: 420;
  line-height: 1.02; letter-spacing: -.015em;
  font-variation-settings: "opsz" 120;
}
body[data-theme="warm"] .hero__line { display: inline; }
body[data-theme="warm"] .hero__line:nth-child(3) .hero__word {
  font-style: italic; font-weight: 320; color: var(--c-accent);
}
body[data-theme="warm"] .hero__claim {
  margin-top: 1.8rem;
  font-size: 1.1rem; max-width: 42ch; color: var(--c-ink-soft);
}
body[data-theme="warm"] .hero__actions { margin-top: 2rem; }

/* Bild als Rundbogen-Fenster */
body[data-theme="warm"] .hero__media {
  position: relative; z-index: 2;
  aspect-ratio: 4 / 5;
  border-radius: 999px 999px var(--radius-img) var(--radius-img);
  overflow: hidden;
  box-shadow: var(--warm-shadow);
  border: 8px solid #fdf8ef;
}
body[data-theme="warm"] .hero__media img {
  transition: transform 8s ease;
  transform: scale(1.06);
}
body[data-theme="warm"] .hero__media.is-revealed img { transform: scale(1); }
body[data-theme="warm"] .hero__media-caption {
  position: absolute; bottom: 1rem; left: 50%; transform: translateX(-50%);
  background: rgba(253, 248, 239, .9);
  padding: .45em 1.1em; border-radius: 999px;
  font-size: .72rem; letter-spacing: .08em; white-space: nowrap;
}
body[data-theme="warm"] .hero__scroll-hint { left: 50%; transform: translateX(-50%); }

/* ---------- Buttons ---------- */
body[data-theme="warm"] .btn { font-weight: 700; font-size: .9rem; padding: 1em 2em; }
body[data-theme="warm"] .btn--primary {
  background: var(--c-accent); color: var(--c-accent-ink);
  box-shadow: 0 14px 28px -12px rgba(182, 92, 51, .65);
}
body[data-theme="warm"] .btn--primary:hover { transform: translateY(-3px); background: #a04e28; }
body[data-theme="warm"] .btn--ghost { border-color: var(--c-ink); }
body[data-theme="warm"] .btn--ghost:hover { background: var(--c-ink); color: var(--c-bg); }

/* ---------- Sektionsköpfe: zentriert, mit Ornament ---------- */
body[data-theme="warm"] .section-head {
  text-align: center;
  display: grid; justify-items: center;
}
body[data-theme="warm"] .section-head__index { display: none; }
body[data-theme="warm"] .section-head__label {
  font-size: .78rem; letter-spacing: .24em; text-transform: uppercase;
  color: var(--c-accent); font-weight: 700;
}
body[data-theme="warm"] .section-head__title {
  font-size: clamp(2.4rem, 5vw, 4.2rem);
  font-weight: 420; margin-top: .4em;
  font-variation-settings: "opsz" 100;
}
body[data-theme="warm"] .section-head__desc { margin-top: 1em; }
/* Maserungs-Ornament unter dem Titel */
body[data-theme="warm"] .section-head::after {
  content: ""; width: 90px; height: 14px; margin-top: 1.4rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='14' viewBox='0 0 90 14' fill='none'%3E%3Cpath d='M2 7 C 16 1, 30 13, 45 7 S 74 1, 88 7' stroke='%23b65c33' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
}

/* ---------- Leistungen: weiche Karten ---------- */
body[data-theme="warm"] .services__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(1.2rem, 2.5vw, 2rem);
}
body[data-theme="warm"] .service-card {
  background: #fdf8ef;
  border-radius: var(--radius-img);
  padding: 2.2rem 1.8rem;
  display: flex; flex-direction: column; gap: 1rem;
  box-shadow: 0 16px 36px -24px rgba(80, 52, 28, .4);
  transition: transform .45s var(--ease), box-shadow .45s var(--ease);
}
body[data-theme="warm"] .service-card:nth-child(even) { margin-top: 2rem; }
body[data-theme="warm"] .service-card:hover {
  transform: translateY(-8px) rotate(-.5deg);
  box-shadow: var(--warm-shadow);
}
body[data-theme="warm"] .service-card__index { display: none; }
body[data-theme="warm"] .service-card__icon {
  width: 58px; height: 58px; padding: 12px;
  color: var(--c-accent-ink);
  background: var(--c-accent);
  border-radius: 50% 50% 50% 12px;
}
body[data-theme="warm"] .service-card__title { font-size: 1.35rem; font-weight: 500; }
body[data-theme="warm"] .service-card__text { font-size: .92rem; color: var(--c-ink-soft); flex: 1; }
body[data-theme="warm"] .service-card__link {
  font-weight: 700; font-size: .85rem; color: var(--c-accent);
  display: inline-flex; gap: .45em; align-items: center;
}
body[data-theme="warm"] .service-card__link .arrow { transition: transform .3s var(--ease); }
body[data-theme="warm"] .service-card__link:hover .arrow { transform: translateX(5px); }

/* ---------- Projekte: organisches Mosaik ---------- */
body[data-theme="warm"] .projects__grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: clamp(1.5rem, 3.5vw, 3rem);
  align-items: start;
}
body[data-theme="warm"] .project:nth-child(3n+1) { grid-column: span 3; }
body[data-theme="warm"] .project:nth-child(3n+2) { grid-column: span 3; margin-top: 3.5rem; }
body[data-theme="warm"] .project:nth-child(3n)   { grid-column: 2 / span 4; }
body[data-theme="warm"] .project__media {
  border-radius: var(--radius-img);
  box-shadow: 0 18px 40px -24px rgba(80, 52, 28, .45);
}
body[data-theme="warm"] .project:nth-child(odd) .project__media {
  border-radius: 999px 999px var(--radius-img) var(--radius-img);
}
body[data-theme="warm"] .project__media { aspect-ratio: 4 / 5; }
body[data-theme="warm"] .project:nth-child(3n) .project__media { aspect-ratio: 16 / 10; }
body[data-theme="warm"] .project__media img {
  transition: transform 1.2s var(--ease);
}
body[data-theme="warm"] .project:hover .project__media img { transform: scale(1.05); }
body[data-theme="warm"] .project__meta {
  text-align: center; margin-top: 1.1rem;
  justify-items: center;
}
body[data-theme="warm"] .project__title { font-size: 1.3rem; font-weight: 480; }
body[data-theme="warm"] .project__cat { font-style: italic; font-family: var(--font-display); }
body[data-theme="warm"] .project__year { font-size: .72rem; letter-spacing: .18em; }

/* ---------- Werkstatt: warmes Doppelportät ---------- */
body[data-theme="warm"] .about__layout {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: clamp(2.5rem, 6vw, 6rem);
  align-items: center;
}
body[data-theme="warm"] .about__media { position: relative; }
body[data-theme="warm"] .about__fig--1 {
  aspect-ratio: 3 / 4;
  border-radius: 999px 999px var(--radius-img) var(--radius-img);
  box-shadow: var(--warm-shadow);
}
body[data-theme="warm"] .about__fig--2 {
  position: absolute; right: -8%; bottom: -10%;
  width: 52%; aspect-ratio: 1;
  border-radius: 50%;
  border: 8px solid var(--c-bg);
  box-shadow: var(--warm-shadow);
}
body[data-theme="warm"] .about__lead {
  font-family: var(--font-display);
  font-size: clamp(1.4rem, 2.4vw, 1.9rem);
  font-weight: 420; line-height: 1.35;
  margin-bottom: 1em;
}
body[data-theme="warm"] .about__quote { margin: 2rem 0; text-align: left; }
body[data-theme="warm"] .about__quote p {
  font-family: var(--font-display); font-style: italic;
  font-size: 1.5rem; font-weight: 350; line-height: 1.3;
  color: var(--c-accent);
  margin-bottom: .4em;
}
body[data-theme="warm"] .about__stats {
  grid-template-columns: repeat(4, auto);
  justify-content: start; gap: 1rem 2.6rem;
  margin-top: 2.4rem;
}
body[data-theme="warm"] .stat__value { font-weight: 500; color: var(--c-accent); }

/* ---------- Kontakt: dunkler, warmer Block ---------- */
body[data-theme="warm"] .contact {
  max-width: min(var(--container), calc(100% - 2.5rem));
  background: var(--c-deep);
  color: #f3e8d8;
  border-radius: calc(var(--radius-img) * 1.6);
  padding: clamp(3.5rem, 7vw, 6.5rem) clamp(1.5rem, 6vw, 6rem);
  margin-block: clamp(2rem, 5vw, 4rem);
  text-align: center;
  position: relative; overflow: hidden;
}
/* dezente Maserung im Hintergrund */
body[data-theme="warm"] .contact::before {
  content: ""; position: absolute; inset: 0; opacity: .08;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='280' viewBox='0 0 420 280' fill='none' stroke='%23f3e8d8' stroke-width='1.5'%3E%3Cpath d='M-20 40 C 120 20, 300 60, 440 40'/%3E%3Cpath d='M-20 90 C 120 70, 300 110, 440 90'/%3E%3Cpath d='M-20 140 C 120 120, 300 160, 440 140'/%3E%3Cpath d='M-20 190 C 120 170, 300 210, 440 190'/%3E%3Cpath d='M-20 240 C 120 220, 300 260, 440 240'/%3E%3Cellipse cx='210' cy='140' rx='46' ry='22'/%3E%3Cellipse cx='210' cy='140' rx='24' ry='10'/%3E%3C/svg%3E");
}
body[data-theme="warm"] .contact__layout { position: relative; display: grid; justify-items: center; }
body[data-theme="warm"] .section-head--contact .section-head__label { color: #e8c79a; }
body[data-theme="warm"] .section-head--contact { margin-bottom: 1rem; }
body[data-theme="warm"] .section-head--contact::after { display: none; }
body[data-theme="warm"] .contact__title {
  font-size: clamp(2.6rem, 6vw, 5rem);
  font-weight: 400; max-width: 16ch;
}
body[data-theme="warm"] .contact__desc { margin-top: 1.2em; max-width: 48ch; color: #d9c6ab; }
body[data-theme="warm"] .contact__actions { margin-top: 2rem; justify-content: center; }
body[data-theme="warm"] .contact .btn--primary { background: #e8c79a; color: var(--c-deep); box-shadow: none; }
body[data-theme="warm"] .contact .btn--primary:hover { background: #f3dcb8; }
body[data-theme="warm"] .contact .btn--ghost { border-color: #e8c79a; color: #e8c79a; }
body[data-theme="warm"] .contact .btn--ghost:hover { background: #e8c79a; color: var(--c-deep); }
body[data-theme="warm"] .contact__details {
  margin-top: 3rem;
  grid-template-columns: repeat(4, auto);
  gap: 2.5rem; font-size: .9rem;
}
body[data-theme="warm"] .contact__detail-label { color: #e8c79a; }

/* ---------- Footer ---------- */
body[data-theme="warm"] .site-footer { background: var(--c-bg); }
body[data-theme="warm"] .footer__nav a:hover,
body[data-theme="warm"] .footer__legal a:hover { color: var(--c-accent); }

/* ---------- Responsive ---------- */
@media (max-width: 1000px) {
  body[data-theme="warm"] .services__grid { grid-template-columns: repeat(2, 1fr); }
  body[data-theme="warm"] .service-card:nth-child(even) { margin-top: 0; }
}
@media (max-width: 900px) {
  body[data-theme="warm"] .hero { grid-template-columns: 1fr; text-align: center; }
  body[data-theme="warm"] .hero__kicker { justify-content: center; }
  body[data-theme="warm"] .hero__claim { margin-inline: auto; }
  body[data-theme="warm"] .hero__actions { justify-content: center; }
  body[data-theme="warm"] .hero__media { max-width: 420px; margin: 2.5rem auto 0; }
  body[data-theme="warm"] .about__layout { grid-template-columns: 1fr; }
  body[data-theme="warm"] .about__media { max-width: 440px; margin-inline: auto; }
  body[data-theme="warm"] .projects__grid > .project {
    grid-column: 1 / -1 !important; margin-top: 0 !important;
  }
  body[data-theme="warm"] .contact__details { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
}
@media (max-width: 640px) {
  body[data-theme="warm"] .services__grid { grid-template-columns: 1fr; }
  body[data-theme="warm"] .about__stats { grid-template-columns: repeat(2, 1fr); }
  body[data-theme="warm"] .contact__details { grid-template-columns: 1fr; }
}
