/* ==========================================================================
   Komponenten
   ========================================================================== */

/* Buttons */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;padding:.95em 1.6em;background:var(--pine);color:var(--porcelain);border:1px solid var(--pine);border-radius:var(--r);font-weight:580;font-size:.9688rem;line-height:1.1;overflow:hidden;isolation:isolate;transition:color .35s,border-color .35s;white-space:nowrap}
.btn::before{content:"";position:absolute;inset:0;background:var(--night);transform:translateY(101%);transition:transform .45s var(--ease);z-index:-1}
.btn:hover::before,.btn:focus-visible::before{transform:none}
.btn--light{background:var(--porcelain);color:var(--night);border-color:var(--porcelain)}
.btn--light::before{background:var(--ice)}
.btn--ghost{background:transparent;color:inherit;border-color:currentColor}
.btn--ghost::before{background:var(--fg)}
.btn--ghost:hover{color:var(--bg)}
.btn--sm{padding:.7em 1.15em;font-size:.9rem}
.btn--block{display:flex;width:100%}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn-row{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem}
.site-header.is-over .btn--header::before{background:var(--ice)}

/* Medien */
.media{position:relative;overflow:hidden;aspect-ratio:var(--ar,3/2);background:linear-gradient(135deg,#d6dbd2,#bcc5bb);border-radius:var(--r)}
.media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.is-dark .media{background:linear-gradient(135deg,#34524C,#1f302c)}
img.is-missing{visibility:hidden}
.has-missing{background:linear-gradient(135deg,#2d4640,#1d2523)}
.gfx{position:absolute;max-width:none;height:auto;pointer-events:none;user-select:none}
.gfx.is-missing{display:none}

/* Filter */
.filters{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;padding-block:1.5rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:1rem}
.chip{padding:.55em 1.15em;border:1px solid var(--mineral-d);border-radius:var(--r);font-size:.9375rem;font-weight:540;background:transparent;transition:background-color .25s,color .25s,border-color .25s}
.chip:hover{border-color:var(--pine)}
.chip.is-active{background:var(--pine);border-color:var(--pine);color:var(--porcelain)}
.filters__count{margin-left:auto;font-size:.875rem;color:var(--muted)}

/* Akkordeon */
.acc{border-top:1px solid var(--line)}
.acc__item{border-bottom:1px solid var(--line)}
.acc__btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:1.35rem 0;text-align:left;font-family:var(--f-display);font-stretch:80%;font-size:clamp(1.2rem,2vw,1.6rem);font-weight:430;line-height:1.2}
.acc__btn .icon{width:1.35rem;height:1.35rem;transition:transform .35s var(--ease)}
.acc__btn[aria-expanded="true"] .icon{transform:rotate(45deg)}
.acc__btn:hover span{text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:1px}
.acc__panel{padding:0 3rem 1.75rem 0;animation:accIn .4s var(--ease)}
.acc__panel p{color:var(--fg);max-width:44rem}
@keyframes accIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* Formulare */
.form__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem 1.5rem}
.field{display:flex;flex-direction:column;gap:.45rem;margin-top:1.25rem}
.form__grid .field{margin-top:0}
.form__grid+.field{margin-top:1.25rem}
.field label,.field__label{font-weight:580;font-size:.9688rem}
.opt-tag{font-weight:400;color:var(--muted);font-size:.85rem;margin-left:.3rem}
input[type=text],input[type=email],input[type=tel],input[type=date],select,textarea{width:100%;background:var(--paper);border:1px solid var(--mineral-d);border-radius:var(--r);padding:.85rem 1rem;line-height:1.4;transition:border-color .25s,box-shadow .25s}
textarea{resize:vertical;min-height:7rem}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 1.25rem) 1.35rem,calc(100% - .9rem) 1.35rem;background-size:.4rem .4rem;background-repeat:no-repeat;padding-right:2.5rem}
input:hover,select:hover,textarea:hover{border-color:var(--pine)}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--pine);outline-offset:1px;border-color:var(--pine)}
.field.has-error input,.field.has-error select,.field.has-error textarea{border-color:var(--err);box-shadow:inset 3px 0 0 var(--err)}
.field__err{color:var(--err);font-size:.9rem;font-weight:540}
.field__hint{font-size:.875rem;color:var(--muted)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.check{display:flex;gap:.75rem;align-items:flex-start;cursor:pointer;font-size:.97rem;line-height:1.5}
.check input{appearance:none;flex:none;width:1.3rem;height:1.3rem;margin-top:.15rem;border:1.5px solid var(--pine);border-radius:var(--r);background:var(--paper);display:grid;place-content:center;cursor:pointer}
.check input::after{content:"";width:.6rem;height:.35rem;border-left:2px solid var(--porcelain);border-bottom:2px solid var(--porcelain);transform:rotate(-45deg) scale(0);transition:transform .2s var(--ease);margin-top:-.1rem}
.check input:checked{background:var(--pine)}
.check input:checked::after{transform:rotate(-45deg) scale(1)}
.check a{text-decoration:underline;text-underline-offset:.2em}
.check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin:1.5rem 0}
.check--tile{border:1px solid var(--mineral-d);border-radius:var(--r);padding:1rem 1.1rem;transition:border-color .25s,background .25s;background:var(--paper)}
.check--tile:hover{border-color:var(--pine)}
.check--tile:has(input:checked){border-color:var(--pine);background:#E3E8E1}
.check--tile small{display:block;color:var(--muted);font-size:.875rem}
.check--tile strong{font-weight:600}

/* Auswahlkacheln (Radio) */
.choice-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.choice-row--inline{grid-template-columns:repeat(2,minmax(0,1fr))}
.choice{position:relative;display:block;cursor:pointer}
.choice input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.choice__box{display:flex;flex-direction:column;gap:.15rem;height:100%;padding:1rem 1.1rem;border:1px solid var(--mineral-d);border-radius:var(--r);background:var(--paper);transition:background .3s,color .3s,border-color .3s}
.choice__box small{font-size:.85rem;color:var(--muted);transition:color .3s}
.choice:hover .choice__box{border-color:var(--pine)}
.choice input:checked+.choice__box{background:var(--pine);color:var(--porcelain);border-color:var(--pine)}
.choice input:checked+.choice__box small{color:#C9D3CE}
.choice input:focus-visible+.choice__box{outline:2px solid var(--pine);outline-offset:3px}

/* Preis- und Leistungstabellen (keine Karten) */
.ptable{border-top:1px solid var(--line);margin-top:2rem}
.ptable__row{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,5fr) minmax(7rem,2fr);gap:1.5rem;align-items:baseline;padding:1.4rem 0;border-bottom:1px solid var(--line);transition:background .3s,padding .35s var(--ease)}
.ptable__row:hover{background:rgba(207,212,203,.45);padding-inline:1rem}
.ptable__row h3{font-family:var(--f-display);font-stretch:80%;font-size:1.4rem;font-weight:440;line-height:1.15}
.ptable__row a:hover{text-decoration:underline;text-underline-offset:.2em}
.ptable__row p{color:var(--muted);max-width:none}
.ptable__price{font-family:var(--f-display);font-stretch:80%;font-size:1.5rem;font-weight:460;color:var(--fg)!important;text-align:right}
@media (max-width:760px){.ptable__row{grid-template-columns:1fr auto}.ptable__row p:nth-child(2){grid-column:1/-1;order:3}.ptable__price{font-size:1.25rem}}

/* Hinweisbox */
.notice{border-left:3px solid var(--ice);background:var(--mineral);padding:1rem 1.25rem;margin-bottom:1.5rem;max-width:46rem;font-size:.97rem}

/* Modal */
.modal{border:0;padding:0;background:var(--porcelain);color:var(--night);width:min(36rem,calc(100vw - 2rem));border-radius:var(--r);box-shadow:0 40px 80px -20px rgba(0,0,0,.5);--focus:var(--pine)}
.modal[open]{animation:modalIn .45s var(--ease)}
.modal::backdrop{background:rgba(29,37,35,.65);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
@keyframes modalIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.modal__body{padding:clamp(1.5rem,4vw,2.5rem);position:relative}
.modal__close{position:absolute;right:.75rem;top:.75rem;width:2.5rem;height:2.5rem;display:grid;place-items:center}
.modal__title{font-family:var(--f-display);font-stretch:75%;font-weight:420;font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.02;margin-right:2rem}
.modal__content{margin-top:1rem}
.modal__content p{margin-top:.8rem}
.modal__summary-title{margin-top:1.4rem!important;font-weight:620}
.modal__summary{display:grid;grid-template-columns:minmax(7.5rem,.8fr) minmax(0,1.6fr);gap:.55rem 1rem;margin-top:.75rem;padding-top:1rem;border-top:1px solid var(--line);font-size:.94rem}
.modal__summary dt{color:var(--muted)}
.modal__summary dd{margin:0;overflow-wrap:anywhere}
.modal__content pre{white-space:pre-wrap;background:var(--paper);border:1px solid var(--mineral-d);padding:1rem;font-family:inherit;font-size:.9rem;max-height:12rem;overflow:auto;margin-top:1rem}
.modal__actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.5rem}

/* Cookie-Banner */
.consent{position:fixed;left:max(1rem,env(safe-area-inset-left));bottom:max(1rem,env(safe-area-inset-bottom));z-index:180;width:min(27rem,calc(100vw - 2rem));background:var(--night);color:var(--porcelain);padding:1.4rem;border-radius:var(--r);box-shadow:0 20px 50px -10px rgba(0,0,0,.45);--focus:var(--ice);animation:modalIn .5s var(--ease)}
.consent__title{font-family:var(--f-display);font-stretch:80%;font-size:1.4rem;line-height:1.1;font-weight:480}
.consent__text{font-size:.9rem;color:#CED6D2;margin-top:.6rem;line-height:1.5}
.consent__text a{text-decoration:underline;text-underline-offset:.2em;color:#fff}
.consent__actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.consent .btn{background:var(--porcelain);color:var(--night);border-color:var(--porcelain);flex:1 1 auto}
.consent .btn::before{background:var(--ice)}
.consent .btn--ghost{background:transparent;color:var(--porcelain);border-color:rgba(240,241,236,.7)}
.consent .btn--ghost::before{background:var(--porcelain)}
.consent .btn--ghost:hover{color:var(--night)}

/* Schalter (Cookie-Seite) */
.cset{display:grid;grid-template-columns:1fr auto;gap:2rem;padding:1.75rem 0;border-bottom:1px solid var(--line);align-items:start}
.cset:first-child{border-top:1px solid var(--line)}
.cset p{color:var(--muted);margin-top:.4rem}
.switch{position:relative;display:inline-block;width:3.4rem;height:1.9rem;flex:none}
.switch input{position:absolute;inset:0;opacity:0;margin:0;width:100%;height:100%;cursor:pointer}
.switch__ui{position:absolute;inset:0;background:var(--mineral-d);border-radius:2rem;transition:background .3s;pointer-events:none}
.switch__ui::after{content:"";position:absolute;left:.25rem;top:.25rem;width:1.4rem;height:1.4rem;background:var(--porcelain);border-radius:50%;transition:transform .35s var(--ease)}
.switch input:checked+.switch__ui{background:var(--pine)}
.switch input:checked+.switch__ui::after{transform:translateX(1.5rem)}
.switch input:disabled{cursor:not-allowed}
.switch input:disabled+.switch__ui{opacity:.7}
.switch input:focus-visible+.switch__ui{outline:2px solid var(--pine);outline-offset:3px}
.consent-form .btn-row{margin-top:2rem}

/* Material-Atlas: Querschnitt */
.xsec{display:flex;flex-direction:column;gap:3px;height:22rem}
.xsec__layer{flex:1;display:flex;align-items:center;padding:0 1.25rem;background:var(--tone);color:var(--night);text-align:left;font-weight:600;position:relative;min-height:2.6rem;transition:transform .4s var(--ease),box-shadow .3s}
.xsec__layer:nth-child(n+3){color:var(--porcelain)}
.xsec__layer:hover{transform:translateX(.35rem)}
.xsec__layer.is-active{transform:translateX(.9rem);box-shadow:-.9rem 0 0 var(--night)}
.xsec__layer:focus-visible{outline:2px solid var(--night);outline-offset:2px}
.xsec__desc{animation:accIn .4s var(--ease)}
.xsec__desc p{margin-top:.6rem}

/* Zitate (nur bei echten Stimmen) */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:2rem;margin-top:2rem}
.quote blockquote p{font-family:var(--f-display);font-stretch:80%;font-size:1.5rem;line-height:1.2}
.quote figcaption{margin-top:1rem;color:var(--muted);font-size:.9rem}

/* Zusammenfassung im Formular */
.summary{margin-top:2rem;padding:1.5rem;background:var(--mineral);border-radius:var(--r)}
.summary dl{display:grid;grid-template-columns:minmax(8rem,1fr) 3fr;gap:.5rem 1.5rem;margin-top:.8rem;font-size:.97rem}
.summary dt{color:var(--muted);font-weight:540}
.summary dd{overflow-wrap:anywhere}
@media (max-width:760px){
  .form__grid,.check-grid,.choice-row{grid-template-columns:1fr}
  .choice-row--inline{grid-template-columns:1fr 1fr}
  .summary dl{grid-template-columns:1fr}
  .filters__count{margin-left:0;width:100%}
}