/* Schriften lokal gehostet (DSGVO: keine Verbindung zu Google) */
@font-face{font-family:"Playfair Display";font-weight:400;font-style:normal;font-display:swap;src:url(/fonts/playfair-display-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Playfair Display";font-weight:400;font-style:italic;font-display:swap;src:url(/fonts/playfair-display-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:Montserrat;font-weight:400;font-display:swap;src:url(/fonts/montserrat-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Montserrat;font-weight:500;font-display:swap;src:url(/fonts/montserrat-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Montserrat;font-weight:600;font-display:swap;src:url(/fonts/montserrat-latin-600-normal.woff2) format("woff2")}

:root{
  --ink:#2E2629;
  --muted:#7C7276;
  --line:#EFE7EA;
  --blush:#FBF3F4;
  --pastel:linear-gradient(100deg,#FDE2D6 0%,#F9D3E0 45%,#E3DAF7 100%);
  --red:#1A1718;
  --green:#25A55F;
  box-sizing:border-box;
  padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{background:#fff;scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:#fff;color:var(--ink);font:400 1rem/1.75 Montserrat,"Helvetica Neue",Arial,sans-serif;padding-bottom:78px}
img,video{max-width:100%;display:block;height:auto}
a{color:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}
h1,h2,h3{font-family:"Playfair Display",Georgia,serif;font-weight:400;line-height:1.1;margin:0}
h2{font-size:clamp(2.1rem,7.5vw,3.4rem);margin-bottom:1.25rem}
h2 i,h1 i{font-style:italic}
.eyebrow{display:block;font-size:.75rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;margin-bottom:1rem;color:var(--muted)}
.wrap{max-width:72rem;margin:0 auto;padding:0 1.5rem}
section{padding:5rem 0}
svg.i{width:1.1em;height:1.1em;flex:none}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;padding:1rem 1.6rem;border-radius:999px;font:600 .95rem/1 Montserrat,Arial,sans-serif;letter-spacing:.04em;text-decoration:none;white-space:nowrap;transition:transform .2s}
.btn:hover{transform:translateY(-2px)}
.btn-call{background:#FFC72C;color:#1A1718}
.btn-wa{background:var(--green);color:#fff}
.btn-line{border:1.5px solid currentColor}

/* Header */
header{position:absolute;inset:0 0 auto;z-index:10;color:#fff;padding-top:env(safe-area-inset-top,0px)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:78px;gap:1rem}
.logo{font-family:"Playfair Display",Georgia,serif;font-style:italic;font-size:1.9rem;line-height:1;text-decoration:none}

/* Hero mit Bilderwechsel (später durch Video ersetzbar) */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;color:#fff;padding:0;overflow:hidden}
.slides,.slides img,.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.slides img{opacity:0;animation:show 18s infinite}
.slides img:nth-child(1){animation-delay:0s}
.slides img:nth-child(2){animation-delay:6s}
.slides img:nth-child(3){animation-delay:12s}
@keyframes show{0%{opacity:0;transform:scale(1.08)}6%{opacity:1}33%{opacity:1}40%{opacity:0;transform:scale(1)}100%{opacity:0}}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(46,38,41,.35) 0%,rgba(46,38,41,0) 30%,rgba(46,38,41,.1) 50%,rgba(46,38,41,.6) 100%)}
.hero .wrap{position:relative;z-index:2;width:100%;padding-bottom:3rem}
.hero .eyebrow{color:#fff;opacity:.9}
.hero h1{font-size:clamp(3rem,13vw,6.5rem);line-height:1}
.hero p{font-size:1.05rem;max-width:30ch;margin:1rem 0 1.75rem}
.hero .btns{display:flex;flex-wrap:wrap;gap:.7rem}
.badge{position:absolute;z-index:3;right:1.25rem;top:6.5rem;width:7rem;height:7rem;border-radius:50%;background:var(--red);color:#fff;display:grid;place-content:center;text-align:center;line-height:1.05;transform:rotate(8deg)}
.badge b{font-family:"Playfair Display",Georgia,serif;font-weight:400;font-size:2rem}
.badge span{font-size:.72rem;font-weight:600;letter-spacing:.06em}

@media (prefers-reduced-motion:reduce){.slides img{animation:none}.slides img:first-child{opacity:1}html{scroll-behavior:auto}}

/* Intro */
.intro{text-align:center;padding:6rem 0 5rem}
.intro .quote{font-family:"Playfair Display",Georgia,serif;font-size:clamp(1.75rem,6vw,2.9rem);line-height:1.3;max-width:24em;margin:0 auto}
.intro .quote i{font-style:italic}
.intro .sig{margin-top:1.75rem;font-size:.75rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}

/* Leistungen: Bildkacheln wie der Header */
.services{padding:0}
.services-head{padding:0 0 2.5rem;text-align:center}
.tiles{display:flex;gap:3px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.tiles::-webkit-scrollbar{display:none}
.tiles img{flex:0 0 72%;width:72%;aspect-ratio:4/5;object-fit:cover;scroll-snap-align:start}
.svc{list-style:none;margin:0 auto;padding:3.5rem 1.5rem 0;max-width:62rem;display:grid}
.svc a{display:block;padding:1.4rem 0;border-bottom:1px solid var(--line);text-decoration:none}
.svc li:first-child a{border-top:1px solid var(--line)}
.svc h3{font-size:1.55rem}
.svc span{display:block;margin-top:.2rem;color:var(--muted);font-size:.95rem}
.svc a h3{transition:color .2s}
.svc a:hover h3{color:var(--muted)}

/* Über Ewa */
.about{padding:0;display:grid}
.about img{width:100%;height:100%;min-height:70vh;object-fit:cover}
.about .text{padding:4.5rem 1.5rem;max-width:34rem;margin:0 auto;align-self:center}
.about p{color:var(--muted);margin:0 0 1.25rem}
.facts{display:flex;gap:3rem;margin:2rem 0}
.facts b{display:block;font-family:"Playfair Display",Georgia,serif;font-weight:400;font-size:2.6rem;line-height:1;color:var(--ink)}
.facts span{font-size:.8rem;letter-spacing:.06em;color:var(--muted)}
.facts .red b{color:var(--red)}
.textlink{font-weight:600;font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;border-bottom:1.5px solid var(--ink);padding-bottom:.25rem}

/* Studio wie Header */
.studio{position:relative;padding:0;color:#fff}
.studio img{width:100%;height:90vh;min-height:460px;max-height:860px;object-fit:cover}
.studio::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(46,38,41,.55))}
.studio .wrap{position:absolute;left:0;right:0;bottom:3rem;z-index:2}
.studio .eyebrow{color:#fff}
.studio p{margin:0;max-width:30ch}

/* Kontakt */
.contact{text-align:center;padding:6rem 0}
.contact .num{display:inline-block;font-family:"Playfair Display",Georgia,serif;font-size:clamp(2.4rem,10vw,4.5rem);line-height:1.1;text-decoration:none;margin:.25rem 0 1.75rem;white-space:nowrap}
.contact .btns{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center}
.info{display:grid;gap:2rem;margin-top:4rem;padding-top:3rem;border-top:1px solid var(--line)}
.info h3{font-size:1.4rem;margin-bottom:.4rem}
.info p{margin:0;color:var(--muted)}

/* FAQ */
.faq{padding:0 0 6rem}
.faq .wrap{max-width:46rem}
.faq h2{text-align:center;margin-bottom:2rem}
details{border-bottom:1px solid var(--line);padding:1.3rem 0}
details:first-of-type{border-top:1px solid var(--line)}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;font-family:"Playfair Display",Georgia,serif;font-size:1.3rem;line-height:1.3}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:Montserrat,sans-serif;font-weight:400}
details[open] summary::after{content:"–"}
details p{margin:.6rem 0 0;color:var(--muted)}

footer{padding:3rem 0;text-align:center;color:var(--muted);font-size:.85rem;border-top:1px solid var(--line)}
footer .logo{display:block;color:var(--ink);font-size:2.2rem;margin-bottom:.75rem}
footer nav{display:flex;justify-content:center;gap:1.5rem;margin-top:.75rem}

.callbar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-template-columns:1fr 1fr;gap:.5rem;padding:.6rem .75rem;padding-bottom:calc(.6rem + env(safe-area-inset-bottom,0px));background:#fff;box-shadow:0 -4px 20px rgba(46,38,41,.08)}
.callbar .btn{padding:.9rem .5rem}
.wa-float{display:none}

@media (min-width:860px){
  body{padding-bottom:0}
  .callbar{display:none}
  .hero .wrap{padding-bottom:5rem}
  .badge{right:4rem;top:auto;bottom:5rem;width:9rem;height:9rem}
  .badge b{font-size:2.6rem}
  .intro{padding:9rem 0 7rem}
  .tiles{display:grid;grid-template-columns:repeat(5,1fr);overflow:visible}
  .tiles img{width:100%}
  .svc{grid-template-columns:1fr 1fr;column-gap:4rem}
  .svc li:nth-child(2) a{border-top:1px solid var(--line)}
  .about{grid-template-columns:1fr 1fr;margin-top:8rem}
  .about img{min-height:90vh}
  .about .text{padding:4rem}
  .contact{padding:9rem 0 7rem}
  .info{grid-template-columns:repeat(3,1fr);text-align:center}
  .wa-float{display:grid;place-items:center;position:fixed;right:1.75rem;bottom:1.75rem;z-index:20;width:3.6rem;height:3.6rem;border-radius:50%;background:var(--green);color:#fff;box-shadow:0 6px 20px rgba(0,0,0,.15)}
  .wa-float svg{width:1.7rem;height:1.7rem}
}

/* ---------- Navigation ---------- */
header .btn{padding:.65rem 1rem;font-size:.85rem}
.mainnav{display:none;gap:2.4rem;align-items:center;font-family:"Playfair Display",Georgia,serif;font-size:1.2rem}
.mainnav > a,.dd > a{position:relative;text-decoration:none;padding:.4rem 0;opacity:.85;transition:opacity .2s}
.mainnav > a::after,.dd > a::after{content:"";position:absolute;left:0;right:0;bottom:.1rem;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .25s}
.dd > a::after{right:1.1rem}
.mainnav > a:hover,.dd:hover > a,.dd:focus-within > a,.mainnav a[aria-current="page"],.dd > a.active{opacity:1}
.mainnav > a:hover::after,.dd:hover > a::after,.dd > a.active::after{transform:scaleX(1)}
.chev{display:inline-block;margin-left:.3rem;font-size:.75em;transform:translateY(-.12em)}
.dd{position:relative}
.dd-menu{position:absolute;left:-1.5rem;top:calc(100% + .6rem);width:max-content;background:#fff;color:var(--ink);padding:1.1rem 1.5rem;border-radius:4px;box-shadow:0 18px 40px rgba(46,38,41,.16);opacity:0;visibility:hidden;transform:translateY(6px);transition:.2s}
.dd-menu::before{content:"";position:absolute;left:0;right:0;top:-.8rem;height:.8rem}
.dd:hover .dd-menu,.dd:focus-within .dd-menu{opacity:1;visibility:visible;transform:none}
.dd-menu a{display:block;padding:.35rem 0;text-decoration:none;font-size:1.15rem;white-space:nowrap;color:var(--muted);transition:color .2s}
.dd-menu a:hover,.dd-menu a[aria-current="page"]{color:var(--ink)}
.dd-menu a[aria-current="page"] .lbl{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.hd-actions{display:flex;align-items:center;gap:.6rem}
.hd-tel span{display:none}
.hd-tel{width:2.75rem;height:2.75rem;padding:0!important}
.burger{width:2.75rem;height:2.75rem;border:0;background:transparent;color:inherit;display:grid;place-content:center;gap:6px;cursor:pointer}
.burger span{display:block;width:24px;height:1.5px;background:currentColor}
.mmenu{position:fixed;inset:0;z-index:50;background:#fff;color:var(--ink);display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top,0px) + 1.25rem) 1.5rem calc(env(safe-area-inset-bottom,0px) + 1.5rem);overflow-y:auto}
.mmenu[hidden]{display:none}
.mmenu-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}
.mmenu-close{width:2.75rem;height:2.75rem;border:0;background:none;font-size:2rem;line-height:1;cursor:pointer;color:inherit}
.mmenu nav a{display:block;font-family:"Playfair Display",Georgia,serif;font-size:1.9rem;line-height:1.2;padding:.45rem 0;text-decoration:none}
.mmenu nav .sub a{font-size:1.25rem;padding:.35rem 0 .35rem 1rem;color:var(--muted)}
.mmenu nav .sub a[aria-current="page"]{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.mmenu .btns{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-top:auto;padding-top:2rem}
body.plain header{position:relative;color:var(--ink);border-bottom:1px solid var(--line)}

/* ---------- Unterseiten ---------- */
.hero.sub{min-height:68svh}
.hero.sub > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero.sub h1{font-size:clamp(2.8rem,11vw,5.5rem)}
.crumbs{font-size:.8rem;color:var(--muted);padding:1.5rem 0 0}
.crumbs a{text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.lead-sec{padding:4rem 0 3rem}
.lead-sec p{font-family:"Playfair Display",Georgia,serif;font-size:clamp(1.4rem,4.8vw,2rem);line-height:1.45;max-width:30em;margin:0}
.prices{padding:3rem 0}
.ptable{width:100%;border-collapse:collapse;max-width:52rem}
.ptable th,.ptable td{text-align:left;padding:1.1rem 0;border-bottom:1px solid var(--line);vertical-align:baseline}
.ptable tr:first-child th,.ptable tr:first-child td{border-top:1px solid var(--line)}
.ptable th{font-family:"Playfair Display",Georgia,serif;font-weight:400;font-size:1.3rem}
.ptable td{color:var(--muted);font-size:.9rem;padding-left:1rem;white-space:nowrap}
.ptable td.price{color:var(--ink);font-weight:600;font-size:1.05rem;text-align:right}
.pnote{font-size:.85rem;color:var(--muted);margin:1rem 0 0}
.steps{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;gap:2rem}
.steps li{counter-increment:s;padding-top:1.25rem;border-top:1px solid var(--line)}
.steps li::before{content:counter(s);display:block;font-family:"Playfair Display",Georgia,serif;font-style:italic;font-size:2.4rem;line-height:1;margin-bottom:.6rem}
.steps h3{font-size:1.3rem;margin-bottom:.3rem}
.steps p{margin:0;color:var(--muted)}
.trio{display:flex;gap:3px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-top:4rem}
.trio::-webkit-scrollbar{display:none}
.trio img{flex:0 0 72%;width:72%;aspect-ratio:4/5;object-fit:cover;scroll-snap-align:start}
.related{padding:4rem 0}
.related .svc{padding:0;max-width:none}
.cta{background:var(--blush);text-align:center;padding:5rem 0}
.cta .num{display:inline-block;font-family:"Playfair Display",Georgia,serif;font-size:clamp(2.2rem,9vw,4rem);line-height:1.1;text-decoration:none;margin:.25rem 0 1.5rem;white-space:nowrap}
.cta .btns{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center}
.faq-sub{padding:4rem 0}
.faq-sub .wrap{max-width:46rem}

/* ---------- Rechtliches / 404 ---------- */
.legal{padding:4rem 0 6rem}
.legal .wrap{max-width:46rem}
.legal h1{font-size:clamp(2.4rem,8vw,3.6rem);margin-bottom:2rem}
.legal h2{font-size:1.5rem;margin:2.5rem 0 .75rem}
.legal p,.legal li{color:var(--muted)}
.todo{background:#FFF6D6;color:var(--ink);padding:.15rem .4rem}
.notfound{text-align:center;padding:8rem 0}
.notfound h1{font-size:clamp(3rem,12vw,6rem);margin-bottom:1rem}

@media (min-width:860px){
  .mainnav{display:flex}
  .burger{display:none}
  .hd-tel{width:auto;height:auto;padding:.65rem 1rem!important}
  .hd-tel span{display:inline}
  .steps{grid-template-columns:repeat(4,1fr)}
  .trio{display:grid;grid-template-columns:repeat(3,1fr);overflow:visible}
  .trio img{width:100%}
  .lead-sec{padding:6rem 0 4rem}
}