/*
Theme Name: dreams-on-top
Theme URI: https://dreams-on-top.de/
Author: dreams-on-top
Description: Erster WordPress-Prototyp auf Basis des HTML-Entwurfs 2.4. Noch nicht produktionsreif.
Version: 1.3.6
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: dreams-on-top
*/
.dot-copyright{display:inline-block;margin-right:15px}.dot-osm-gate{min-height:350px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;padding:25px;text-align:center;background:#dfe5de;color:#25312a}.dot-osm-load{padding:13px 20px;border:0;background:#252525;color:#fff;font-weight:700;cursor:pointer}.dot-osm-gate iframe{width:100%;height:350px;border:0}.dot-osm-gate:has(iframe){padding:0}.dot-osm-gate:has(iframe) p,.dot-osm-gate:has(iframe) button{display:none}


/* v0.4: zentraler Kontakt-Footer auf allen Seiten */
.dot-shared-footer{background:#080808!important;color:#fff!important;padding:54px 20px 58px!important;text-align:center!important;font-family:Arial,Helvetica,sans-serif!important;font-size:16px!important;line-height:1.6!important}
.dot-shared-footer *{box-sizing:border-box}
.dot-shared-footer h2{color:#fff!important;font-size:clamp(25px,3vw,34px)!important;margin:0 0 15px!important;font-weight:700!important}
.dot-shared-footer .contact-intro{max-width:760px;margin:0 auto 32px!important;color:#e0e0e0!important;line-height:1.65!important}
.dot-shared-footer .contact-grid{max-width:1050px!important;margin:0 auto!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:36px!important;text-align:left!important;align-items:start!important;color:#fff!important}
.dot-shared-footer .contact-grid h3{font-family:'Trebuchet MS',Trebuchet,Arial,sans-serif!important;font-size:24px!important;margin:0 0 5px!important;color:#fff!important}
.dot-shared-footer .owner{margin:0 0 17px!important;color:#fff!important;font-size:16px!important}
.dot-shared-footer address{font-style:normal!important;line-height:1.8!important;color:#fff!important}
.dot-shared-footer p{line-height:1.6!important}
.dot-shared-footer strong{color:#fff!important}
.dot-shared-footer .callout{margin:24px 0!important;padding:22px 15px!important;border:2px solid #fff!important;text-align:center!important;background:transparent!important}
.dot-shared-footer .callout strong{display:block!important;font-size:clamp(25px,3vw,36px)!important;margin-bottom:10px!important}
.dot-shared-footer .callout a{font-family:'Trebuchet MS',Trebuchet,Arial,sans-serif!important;font-weight:700!important;font-size:clamp(25px,3.5vw,40px)!important;text-decoration:none!important;white-space:nowrap!important;color:#fff!important}
.dot-shared-footer a{color:#fff!important}
.dot-shared-footer .email-link{font-weight:700!important;overflow-wrap:anywhere!important}
.dot-shared-footer .map-consent{background:#242424!important;border:1px solid #666!important;padding:22px!important;min-height:270px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;gap:12px!important;color:#fff!important}
.dot-shared-footer .map-consent p{margin:0!important;font-size:14px!important;color:#fff!important}
.dot-shared-footer .map-consent button{cursor:pointer!important;background:#fff!important;color:#111!important;border:1px solid #fff!important;padding:12px 18px!important;font-size:14px!important;font-weight:700!important}
.dot-shared-footer .map-frame{width:100%!important;height:300px!important;border:0!important}
.dot-shared-footer .map-link{display:inline-block!important;margin-top:12px!important;font-size:14px!important}
.dot-shared-footer .legal{margin-top:42px!important;font-size:13px!important;color:#ccc!important}
.dot-shared-footer .legal a{margin:0 10px!important}
@media(max-width:760px){.dot-shared-footer .contact-grid{grid-template-columns:1fr!important;gap:28px!important}.dot-shared-footer .callout a{white-space:normal!important;overflow-wrap:anywhere!important}}

/* 0.7: independent promotional circle on the home hero */
.dot-home-promo-trigger{position:absolute;right:clamp(18px,5vw,80px);bottom:125px;z-index:3;width:190px;height:190px;border-radius:50%;border:4px solid #fff;background:#e87519;color:#fff;font:700 17px/1.25 'Trebuchet MS',Arial,sans-serif;text-align:center;padding:22px;cursor:pointer;box-shadow:0 5px 22px #0008;overflow-wrap:anywhere}
.dot-home-promo-trigger:hover,.dot-home-promo-trigger:focus-visible{background:#c95c08;outline-offset:4px}
.dot-home-promo-dialog{border:0;border-radius:12px;padding:28px;max-width:min(490px,calc(100vw - 32px));width:100%;color:#222;background:#fff;box-shadow:0 12px 45px #0006;text-align:left}
.dot-home-promo-dialog::backdrop{background:#000a}
.dot-home-promo-dialog h2{font:700 24px 'Trebuchet MS',Arial,sans-serif;margin:0 45px 14px 0}
.dot-home-promo-dialog p{line-height:1.5}
.dot-home-promo-close{position:absolute;right:24px;top:24px;background:#222;color:#fff;border:0;font-size:24px;width:36px;height:36px;cursor:pointer}
.dot-home-promo-cta{display:inline-block;margin:20px 0 5px;background:#222;color:#fff;text-decoration:none;padding:12px 17px;font-weight:700}
.dot-home-promo-hint{color:#666;font-size:12px}
@media(max-width:760px){.dot-home-promo-trigger{width:132px;height:132px;right:12px;bottom:105px;font-size:13px;padding:12px}.hero .actions{padding-bottom:10px}}
@media(max-width:400px){.dot-home-promo-trigger{width:112px;height:112px;right:8px;bottom:140px;font-size:12px;padding:9px}}

/* v0.8: optional per-model galleries */
.dot-product-gallery{display:flex;flex-wrap:wrap;gap:9px;margin:12px 0 0}
.dot-gallery-thumb{padding:2px;background:#fff;border:2px solid #ddd;border-radius:6px;cursor:pointer;width:88px;height:68px}
.dot-gallery-thumb[aria-pressed="true"],.dot-gallery-thumb:focus-visible{border-color:#e87519;outline-offset:2px}
.dot-gallery-thumb img{width:100%;height:100%;object-fit:cover;border-radius:3px}
.dot-product-features{margin-top:15px;background:#f7f7f7;border-radius:7px;padding:14px;color:#333}
.dot-product-features[hidden]{display:none}
.dot-product-features ul{margin:8px 0 0;padding-left:20px}

/* 0.9 – matched circle motion and prominent back links */
.dot-home-promo-trigger{transform:rotate(8deg);transition:transform .22s ease,background-color .22s ease}
.dot-home-promo-trigger:hover,.dot-home-promo-trigger:focus-visible{transform:rotate(0deg) scale(1.05)}
.back-link{display:inline-flex!important;align-items:center;gap:8px;padding:13px 19px!important;background:#292929!important;color:#fff!important;border:2px solid #292929;border-radius:5px;text-decoration:none!important;font-weight:700!important;line-height:1.3;transition:background-color .2s ease,border-color .2s ease,color .2s ease}
.back-link:hover,.back-link:focus-visible{background:#e87519!important;border-color:#e87519!important;color:#fff!important}
@media(prefers-reduced-motion:reduce){.dot-home-promo-trigger,.back-link{transition:none}}

/* Version 1.1: einheitliche Interaktionssprache.
   Navigation: weiss (bestehende Template-Regeln).
   Handlungslinks: orange/weiß. Informationsbereiche: dezente Betonung.
   Promo-Badges behalten ihre eigene Drehbewegung. */
:where(.btn,.button-link,.model-link,.portrait-action,.rental-button,.promo-cta,.dot-home-promo-cta,.form-actions button,.map-consent button,.dot-osm-load,.dot-vehicle-link,.back-link){
  transition:background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease;
}
/* Diese Selektoren sind absichtlich spezifisch: Templates besitzen lokale Styles. */
body .btn:hover,body .btn:focus-visible,
body .button-link:hover,body .button-link:focus-visible,
body #kaufen .button-link:hover,body #kaufen .button-link:focus-visible,
body #mieten .button-link:hover,body #mieten .button-link:focus-visible,
body #kaufen .feature .button-link:hover,body #kaufen .feature .button-link:focus-visible,
body .model-link:hover,body .model-link:focus-visible,
body .portrait-panel .portrait-action:hover,body .portrait-panel .portrait-action:focus-visible,
body .rental-button:hover,body .rental-button:focus-visible,
body .promo-dialog .promo-cta:hover,body .promo-dialog .promo-cta:focus-visible,
body .dot-home-promo-cta:hover,body .dot-home-promo-cta:focus-visible,
body .form-actions button:hover,body .form-actions button:focus-visible,
body .map-consent button:hover,body .map-consent button:focus-visible,
body .dot-osm-load:hover,body .dot-osm-load:focus-visible{
  background-color:#e87519!important;
  border-color:#e87519!important;
  color:#fff!important;
}
/* Bestehender Zurück-Button: orange auf Hover, immer weiße Schrift. */
body .back-link:hover,body .back-link:focus-visible{background-color:#e87519!important;border-color:#e87519!important;color:#fff!important}
/* Aufklappbare Daten: nur dezente Kontur/Pfeil, keine Aktionsfarbe als Fläche. */
body details.dot-extra-details{transition:border-color .2s ease,box-shadow .2s ease}
body details.dot-extra-details > summary{transition:color .2s ease}
body details.dot-extra-details > summary:hover,
body details.dot-extra-details > summary:focus-visible{color:#bc5b13}
body details.dot-extra-details:has(> summary:hover),
body details.dot-extra-details:has(> summary:focus-visible){border-color:#e87519}
/* Gleiche Tastatur-Fokusanzeige, auch ohne Mouseover. */
:where(a,button,summary,[role="tab"]):focus-visible{outline:3px solid #e87519;outline-offset:3px}
@media (prefers-reduced-motion:reduce){
  :where(.btn,.button-link,.model-link,.portrait-action,.rental-button,.promo-cta,.dot-home-promo-cta,.form-actions button,.map-consent button,.dot-osm-load,.dot-vehicle-link,.back-link),
  body details.dot-extra-details,body details.dot-extra-details > summary{transition:none!important}
}

/* Version 1.2: home owner, contact CTA, rental navigation */
.dot-home-owner{background:#fff;color:#222;padding:48px 22px 54px}
.dot-home-owner-inner{max-width:1050px;margin:auto;background:#f4f4f4;border:1px solid #ddd;border-radius:7px;padding:30px 35px;display:flex;gap:30px;align-items:center}
.dot-home-owner img{width:150px;height:150px;border-radius:50%;border:3px solid #e87519;object-fit:cover;flex-shrink:0;box-shadow:0 6px 18px #0002}
.dot-owner-eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.13em;color:#666}
.dot-home-owner h2{font:700 clamp(24px,3vw,31px) 'Trebuchet MS',Arial,sans-serif;margin:8px 0 12px}
.dot-home-owner p{line-height:1.6;margin:8px 0;color:#333}
.dot-home-owner .dot-owner-name{font-weight:700;color:#222}
.dot-owner-link{display:inline-block;margin-top:12px;background:#292929;color:#fff;text-decoration:none;padding:12px 17px;font-weight:700}
.dot-owner-link:hover,.dot-owner-link:focus-visible{background:#e87519;color:#fff}
.dot-shared-footer .callout{border:0!important;padding:12px 0!important;text-align:left!important}
.dot-shared-footer .callout .dot-consultation-button{display:inline-block!important;background:#292929!important;color:#fff!important;border:2px solid #292929!important;font:700 16px Arial,sans-serif!important;padding:13px 20px!important;white-space:normal!important;text-decoration:none!important}
.dot-shared-footer .callout .dot-consultation-button:hover,.dot-shared-footer .callout .dot-consultation-button:focus-visible{background:#e87519!important;border-color:#e87519!important}
.dot-shared-footer .callout .dot-consultation-number{display:block;color:#fff;font-size:17px;font-weight:700;margin-top:12px}
.dot-show-phone{display:block;color:#333;font-size:16px;font-weight:700;margin-top:10px}
.dot-rental-intro{background:#171717;color:#fff;text-align:center;padding:62px 20px}
.dot-rental-intro h1{font:700 clamp(35px,5vw,56px) 'Trebuchet MS',Arial,sans-serif;margin:0 0 14px}
.dot-rental-intro p{font-size:19px;margin:0;color:#eee}
@media(max-width:650px){.dot-home-owner-inner{flex-direction:column;text-align:center;padding:24px 20px;gap:15px}.dot-home-owner img{width:160px;height:160px}.dot-shared-footer .callout{text-align:center!important}}

/* v1.2.2: bessere Lesbarkeit in der Modellübersicht */
.highlight .disclaimer{color:#e0e0e0!important;opacity:1!important}
.highlight .price-overview-note{color:#e0e0e0!important;opacity:1!important}

/* 1.2.2: lokal gespeicherte OpenStreetMap-Standortgrafik */
.dot-shared-footer .dot-static-map{display:block;line-height:0;border:1px solid #666;overflow:hidden}
.dot-shared-footer .dot-static-map img{display:block;width:100%;height:auto;aspect-ratio:1125 / 660;object-fit:cover}
.dot-shared-footer .dot-static-map:focus-visible{outline:3px solid #f28b24;outline-offset:3px}

/* Version 1.2.3: Mobile Darstellung Startseite und gemeinsamer Footer */
.dot-shared-footer .contact-grid > div {min-width:0;max-width:100%;}
.dot-shared-footer .dot-static-map {width:100%;max-width:100%;}
.dot-shared-footer .dot-static-map img {max-width:100%;height:auto;}
.dot-home-owner-inner > div {min-width:0;}
@media screen and (max-width:760px) {
  .dot-shared-footer {width:100%!important;max-width:100%!important;padding:38px 18px 42px!important;overflow-wrap:anywhere!important;}
  .dot-shared-footer .contact-grid {display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:26px!important;width:100%!important;max-width:100%!important;}
  .dot-shared-footer .contact-grid > div {min-width:0!important;width:100%!important;}
  .dot-shared-footer .callout a {max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important;}
  .dot-shared-footer .dot-static-map {width:100%!important;max-width:100%!important;}
  .dot-shared-footer .dot-static-map img {width:100%!important;max-width:100%!important;height:auto!important;object-fit:contain!important;}
  .dot-shared-footer .contact-intro {max-width:100%!important;}
  .dot-home-owner {padding:32px 16px 40px!important;}
  .dot-home-owner .dot-home-owner-inner {display:flex!important;flex-direction:column!important;align-items:center!important;gap:18px!important;width:100%!important;max-width:100%!important;padding:24px 18px!important;text-align:center!important;}
  .dot-home-owner .dot-home-owner-inner > img {display:block!important;position:static!important;width:160px!important;height:160px!important;max-width:100%!important;aspect-ratio:1/1!important;object-fit:cover!important;border-radius:50%!important;border:3px solid #e87519!important;flex:0 0 auto!important;margin:0 auto!important;}
  .dot-home-owner .dot-home-owner-inner > div {width:100%!important;max-width:100%!important;min-width:0!important;}
  .dot-home-owner h2 {font-size:clamp(23px,6vw,30px)!important;line-height:1.2!important;}
  .dot-home-owner p {overflow-wrap:anywhere!important;}
}

/* 1.3.3: Consent map can be dismissed; controls remain accessible */
.dot-osm-gate.dot-map-active{position:relative;display:block;padding:0;min-height:350px}
.dot-osm-gate.dot-map-active iframe{display:block;width:100%;height:350px;min-height:350px;border:0}
.dot-osm-gate.dot-map-active .dot-osm-hide{display:block;position:absolute;top:12px;left:12px;z-index:2;padding:10px 13px;background:#fff;color:#222;border:1px solid #777;font-weight:700;cursor:pointer}
.dot-osm-gate .dot-osm-hide[hidden]{display:none!important}
.dot-osm-gate.dot-map-active .dot-osm-load,.dot-osm-gate.dot-map-active p{display:none}
@media(max-width:700px){.dot-osm-gate.dot-map-active iframe{height:300px;min-height:300px}}

/* Version 1.3.4: mobile menu, form text, and full-height OpenStreetMap */
.dot-mobile-menu-toggle{display:none}
@media(max-width:760px){
 header{position:relative;justify-content:space-between!important;align-items:center!important;gap:12px!important}
 header .brand{font-size:clamp(22px,5.6vw,30px)!important;white-space:normal}
 header .dot-mobile-menu-toggle{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;border:1px solid #aaa;background:#111;color:#fff;padding:10px 13px;font-size:16px;font-weight:700;cursor:pointer}
 header nav#dot-main-nav{display:none!important;width:100%;flex-basis:100%;flex-direction:column;gap:7px;margin-top:10px}
 header nav#dot-main-nav.dot-menu-open{display:flex!important}
 header nav#dot-main-nav a{display:block;text-align:left;padding:13px 15px;font-size:15px}
}
/* The privacy sentence is a complete grid row on narrow screens. */
.contact-form-section .form-grid > .form-privacy{grid-column:1/-1;display:block;width:100%;min-width:0;max-width:100%;overflow-wrap:normal;word-break:normal;line-height:1.65}
.contact-form-section .form-grid > .form-privacy a{display:inline;overflow-wrap:break-word}
/* Map fills its whole half of the contact hero; controls remain accessible. */
.contact-map-hero .contact-map-preview.real-map{position:relative;display:block;min-height:350px;align-self:stretch;padding:0}
.contact-map-hero .real-map > .dot-osm-gate.dot-map-active{position:absolute;inset:0;width:100%;height:100%;min-height:0;padding:0}
.contact-map-hero .real-map > .dot-osm-gate.dot-map-active iframe{display:block;width:100%;height:100%!important;min-height:0!important;border:0}
.contact-map-hero .real-map .dot-osm-hide{z-index:3}
@media(max-width:700px){
 .contact-map-hero .contact-map-preview.real-map{min-height:350px}
 .contact-map-hero .real-map > .dot-osm-gate.dot-map-active{position:absolute;inset:0}
}