/* Eigentum am Markt — gemeinsames Stylesheet
   Dezent, modern, hochwertig. Farbwelt Grün / Messing / warmes Weiß. */

/* Schriften lokal (DSGVO): Cormorant Garamond + Inter, SIL Open Font License 1.1, Zeichensatz Latin */
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500 600;font-display:swap;
  src:url("fonts/cormorant-garamond.woff2") format("woff2");}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;
  src:url("fonts/cormorant-garamond-italic.woff2") format("woff2");}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 600;font-display:swap;
  src:url("fonts/inter.woff2") format("woff2");}

:root{
  --bg:#FBFAF7;         /* warmes Weiß, Grundfläche */
  --paper:#F2EDE4;      /* dezentes Creme für ruhige Sektionen */
  --ink:#1a1a17;        /* fast Schwarz, warm */
  --green:#0C4A38;      /* Royal Green, Akzent */
  --green-deep:#093026; /* tiefes Grün, Fußzeile */
  --brass:#A98F5B;      /* Messing, sparsam */
  --brass-soft:#c8b78f; /* helles Messing für Linien */
  --grau:#7c7970;       /* Fließtext gedämpft */
  --hair:rgba(26,26,23,.10);
  --serif:"Cormorant Garamond","Georgia",serif;
  --sans:"Inter","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;color:var(--ink);background:var(--bg);font-family:var(--sans);
  font-size:17px;line-height:1.75;font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
a{color:inherit;}
img{max-width:100%;}
.wrap{max-width:1180px;margin:0 auto;padding:0 40px;}
.measure{max-width:660px;}

h1,h2,h3{font-family:var(--serif);font-weight:500;margin:0;letter-spacing:.004em;}
h1{font-size:clamp(46px,7vw,86px);line-height:1.02;}
h2{font-size:clamp(30px,4vw,46px);line-height:1.12;}
h3{font-size:24px;line-height:1.2;}
p{margin:0;}

.kicker{font:600 11px/1 var(--sans);letter-spacing:.34em;text-transform:uppercase;color:var(--brass);}
.rule{width:44px;height:1px;background:var(--brass);border:0;margin:26px 0;}
.rule.c{margin-left:auto;margin-right:auto;}
.lead-p{font-size:19px;line-height:1.8;color:#38362f;margin-top:24px;font-weight:400;max-width:680px;}
.lead-p + .lead-p{margin-top:18px;}
.center{text-align:center;}
.center .rule{margin-left:auto;margin-right:auto;}
.center .lead-p{margin-left:auto;margin-right:auto;max-width:660px;}

/* Buttons — schlank, hochwertig */
.btn{display:inline-block;font:600 11px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;
  padding:17px 32px;text-decoration:none;border:1px solid var(--brass);color:var(--ink);
  background:transparent;transition:background .3s,color .3s,border-color .3s;}
.btn:hover{background:var(--brass);color:#fff;border-color:var(--brass);}
.btn.brass{background:var(--brass);color:#fff;}
.btn.brass:hover{background:#96794a;border-color:#96794a;}
.btn.light{border-color:rgba(255,255,255,.55);color:#fff;}
.btn.light:hover{background:#fff;color:var(--ink);border-color:#fff;}

/* Navigation */
.topnav{position:absolute;top:0;left:0;right:0;z-index:6;}
.topnav .wrap{display:flex;justify-content:space-between;align-items:center;padding:30px 40px;}
.topnav a{text-decoration:none;color:#fff;}
.topnav .brand{font-family:var(--serif);font-size:21px;font-weight:500;letter-spacing:.10em;}
.topnav .links a{margin-left:30px;font:600 11px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.82);transition:color .3s;}
.topnav .links a:hover,.topnav .links a.active{color:#fff;}
/* Navigation auf hellem Seitenkopf (Wohnungsseiten, Impressum, Datenschutz) */
.topnav.on-light a{color:var(--ink);}
.topnav.on-light .links a{color:rgba(26,26,23,.62);}
.topnav.on-light .links a:hover,.topnav.on-light .links a.active{color:var(--green);}

/* Hero (Start + Objekte) */
.hero{position:relative;min-height:92vh;display:flex;align-items:flex-end;color:#fff;overflow:hidden;}
.hero .bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.02);}
.hero .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,48,38,.22) 0%,rgba(9,48,38,.30) 40%,rgba(9,48,38,.86) 100%);}
.hero .wrap{position:relative;padding-bottom:76px;padding-top:120px;}
.hero .kicker{color:var(--brass-soft);}
.hero h1{margin:20px 0 0;}
.hero .lead{font-size:21px;font-weight:400;line-height:1.6;max-width:600px;margin:22px 0 0;color:rgba(255,255,255,.92);}
.hero .addr{font:600 11px var(--sans);letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.72);margin-top:10px;}
.hero .cta-row{margin-top:34px;display:flex;gap:16px;flex-wrap:wrap;}
.hero.object{min-height:74vh;}

/* Sektionen */
section{padding:112px 0;border-top:1px solid var(--hair);}
section:first-of-type{border-top:0;}
.paper{background:var(--paper);}
.head-c{max-width:720px;margin:0 auto;text-align:center;}
.head-c h2{margin-top:14px;}

/* Objektkarten (Start) */
.cards2{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:64px;}
.acard{background:#fff;border:1px solid var(--hair);transition:border-color .3s,box-shadow .3s;overflow:hidden;}
.acard:hover{border-color:var(--brass-soft);box-shadow:0 24px 60px rgba(9,48,38,.10);}
.acard img{width:100%;height:300px;object-fit:cover;display:block;}
.acard .in{padding:36px 38px 40px;}
.acard .code{font:600 11px var(--sans);letter-spacing:.20em;color:var(--brass);text-transform:uppercase;}
.acard h3{margin:14px 0 14px;}
.acard p{font-size:16px;color:var(--grau);line-height:1.7;}
.acard .facts{margin-top:20px;padding-top:16px;border-top:1px solid var(--hair);font:500 13px var(--sans);letter-spacing:.02em;color:#2a2a24;}
.acard .go{display:inline-block;margin-top:24px;font:600 11px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--green);text-decoration:none;border-bottom:1px solid var(--brass);padding-bottom:5px;transition:color .3s;}
.acard .go:hover{color:var(--brass);}
.soon-tag{display:inline-block;font:600 9px var(--sans);letter-spacing:.20em;text-transform:uppercase;color:var(--brass);border:1px solid var(--brass-soft);padding:4px 9px;vertical-align:middle;margin-left:12px;}
.notify{font-size:14px;color:var(--grau);margin-top:16px;}
.notify a{color:var(--green);border-bottom:1px solid var(--brass);text-decoration:none;}

/* Zitat */
.quote{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(26px,3.4vw,38px);line-height:1.34;color:var(--green);max-width:860px;margin:64px auto;text-align:center;}
.quote .rule{margin:0 auto 28px;}

/* Bild / Luftaufnahme */
.figure{margin-top:60px;}
.figure img{width:100%;height:auto;display:block;}
.figure figcaption{font:400 13px var(--sans);color:var(--grau);text-align:center;margin-top:14px;letter-spacing:.02em;}

/* Merkmale */
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 40px;margin-top:60px;}
.feat.two{grid-template-columns:repeat(2,1fr);}
.f{border-top:1px solid var(--brass-soft);padding-top:20px;}
.f .h{font-family:var(--serif);font-size:23px;font-weight:500;line-height:1.2;}
.f p{font-size:15.5px;color:var(--grau);margin-top:10px;line-height:1.7;}

/* Galerie */
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.gal img{width:100%;height:260px;object-fit:cover;display:block;}

/* Datenblatt */
.data{width:100%;border-collapse:collapse;margin-top:48px;}
.data tr{border-bottom:1px solid var(--hair);}
.data tr:first-child{border-top:1px solid var(--hair);}
.data th{text-align:left;vertical-align:top;width:30%;padding:20px 24px 20px 0;
  font:600 10.5px var(--sans);letter-spacing:.20em;text-transform:uppercase;color:var(--brass);}
.data td{padding:20px 0;font-size:16.5px;color:#2c2b25;vertical-align:top;line-height:1.6;}

/* Wohnungstabelle */
h3.sub{font:600 11px var(--sans);letter-spacing:.20em;text-transform:uppercase;color:var(--grau);margin:40px 0 10px;}
table.wl{width:100%;border-collapse:collapse;font-size:16px;}
table.wl th,table.wl td{text-align:left;padding:18px 8px;border-bottom:1px solid var(--hair);vertical-align:middle;}
table.wl th{font:600 10.5px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--grau);border-bottom:1px solid var(--ink);}
td.r,th.r{text-align:right;}
.flae{font-variant-numeric:tabular-nums;color:#2c2b25;white-space:nowrap;}
.wnr{font-size:17px;font-weight:600;color:var(--green);text-decoration:none;}
.wnr:hover{color:var(--brass);}
table.wl tr:hover td{background:var(--bg);}
.klein{font-size:13.5px;color:var(--grau);margin-top:20px;line-height:1.6;}
.req{display:inline-block;font:600 10.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--green);text-decoration:none;border:1px solid var(--brass-soft);padding:8px 14px;transition:.3s;white-space:nowrap;}
.req:hover{background:var(--brass);color:#fff;border-color:var(--brass);}
.reqg{display:inline-block;font:600 10.5px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#fff;text-decoration:none;background:var(--green);padding:9px 15px;transition:.3s;white-space:nowrap;}
.reqg:hover{background:var(--green-deep);}

/* Wohnungsseite: Kopf + Plan + Geschwister */
.phead{background:var(--paper);padding:120px 0 70px;}
.phead .back{display:inline-block;margin-bottom:24px;font:600 10.5px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--green);text-decoration:none;border-bottom:1px solid var(--brass);padding-bottom:4px;}
.phead .kicker{margin-bottom:16px;}
.phead h1{font-size:clamp(40px,5.4vw,66px);}
.phead .sub{font-size:19px;color:#38362f;margin-top:16px;letter-spacing:.01em;}
.planwrap{margin:0 auto;text-align:center;max-width:760px;}
.planwrap img{width:100%;display:block;background:#fff;border:1px solid var(--hair);}
.planwrap figcaption{font:400 13px var(--sans);color:var(--grau);margin-top:14px;letter-spacing:.02em;}
.sib{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px;}
.sib a{font:600 12.5px var(--sans);letter-spacing:.04em;text-decoration:none;color:var(--green);border:1px solid var(--hair);padding:11px 17px;background:#fff;transition:border-color .3s;}
.sib a:hover{border-color:var(--brass);}
.sib a.cur{background:var(--green);color:#fff;border-color:var(--green);}

/* Coming soon / Kontakt */
.soon{background:var(--paper);}
.soon .measure{margin:0;}
.cta{background:var(--green);color:#fff;text-align:center;}
.cta .kicker{color:var(--brass-soft);}
.cta h2{color:#fff;margin-top:16px;}
.cta p{font-size:18px;color:rgba(255,255,255,.9);margin:22px auto 0;max-width:560px;line-height:1.7;}
.cta .wrap > .btn{margin-top:30px;}
.cta .contact-line{margin-top:22px;font-size:14px;letter-spacing:.04em;color:rgba(255,255,255,.68);}
.cta .contact-line a{text-decoration:none;border-bottom:1px solid rgba(255,255,255,.28);transition:color .3s,border-color .3s;}
.cta .contact-line a:hover{color:#fff;border-color:var(--brass-soft);}

/* Rechtstexte (Impressum, Datenschutz) */
.prose{max-width:720px;}
.prose h2{font-size:30px;margin:56px 0 0;}
.prose h2:first-child{margin-top:0;}
.prose h3{font:600 11px var(--sans);letter-spacing:.20em;text-transform:uppercase;color:var(--brass);margin:32px 0 0;}
.prose p,.prose li{font-size:16.5px;line-height:1.75;color:#38362f;}
.prose p{margin-top:14px;}
.prose ul{margin:14px 0 0;padding-left:20px;}
.prose li + li{margin-top:6px;}
.prose a{color:var(--green);text-decoration:none;border-bottom:1px solid var(--brass-soft);}
.prose a:hover{color:var(--brass);}
.prose .stand{font-size:13.5px;color:var(--grau);margin-top:56px;}

/* Fußzeile */
footer{background:var(--green-deep);color:rgba(255,255,255,.68);font:400 13px var(--sans);padding:40px 0;letter-spacing:.02em;}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;}
footer a{text-decoration:none;border-bottom:1px solid rgba(255,255,255,.22);transition:color .3s,border-color .3s;}
footer a:hover{color:#fff;border-color:var(--brass-soft);}

@media(max-width:820px){
  .wrap{padding:0 24px;}
  .topnav .wrap{padding:20px 24px;flex-wrap:wrap;row-gap:12px;}
  .topnav .links{display:flex;flex-wrap:wrap;gap:8px 16px;width:100%;}
  .topnav .links a{margin-left:0;font-size:10px;letter-spacing:.12em;}
  .phead{padding-top:150px;}
  section{padding:76px 0;}
  .cards2,.feat,.feat.two,.gal{grid-template-columns:1fr;}
  /* Datenblatt: Beschriftung über dem Wert statt daneben */
  .data,.data tbody,.data tr,.data th,.data td{display:block;width:auto;}
  .data tr{padding:16px 0;}
  .data th{padding:0 0 6px;}
  .data td{padding:0;}
  .hero .wrap{padding-top:150px;padding-bottom:56px;}
  .hero .veil{background:linear-gradient(180deg,rgba(9,48,38,.50) 0%,rgba(9,48,38,.52) 40%,rgba(9,48,38,.88) 100%);}
  .kicker{line-height:1.6;}
  /* Wohnungstabelle: Spalte „Grundriss“ ausblenden (Nummer verlinkt bereits), notfalls nur die Tabelle scrollen */
  table.wl{display:block;overflow-x:auto;font-size:15px;}
  table.wl tbody{display:table;width:100%;}
  table.wl th,table.wl td{padding:14px 6px;}
  table.wl th:nth-child(4),table.wl td:nth-child(4){display:none;}
  .reqg{padding:8px 11px;letter-spacing:.1em;}
}

/* ===== COMING SOON (vorübergehend) =====================================
   Seite bleibt im Hintergrund sichtbar, ausgegraut, darüber eine Ebene mit
   „Coming soon“. Zum Freischalten: diesen Block bis zum Ende löschen und in
   allen Seiten den Stylesheet-Parameter ?v=… erhöhen (Cache). */
:root{--cs-size:clamp(58px,11vw,150px);}
html{overflow:hidden;}
body > *{filter:grayscale(1);opacity:.32;pointer-events:none;user-select:none;}
html::before{content:"";position:fixed;inset:0;z-index:1000;
  background:radial-gradient(ellipse at center,rgba(251,250,247,.92) 0%,rgba(251,250,247,.78) 50%,rgba(251,250,247,.6) 100%);}
body::before{content:"Eigentum am Markt · St. Johanner Markt";position:fixed;left:0;right:0;z-index:1001;
  top:calc(50% - var(--cs-size) * .5 - 44px);padding:0 24px 0 calc(24px + .34em);text-align:center;
  font:600 12px/1.6 var(--sans);letter-spacing:.34em;text-transform:uppercase;color:var(--brass);}
body::after{content:"Coming soon";position:fixed;left:0;right:0;top:50%;transform:translateY(-50%);z-index:1001;
  padding:0 16px;text-align:center;font-family:var(--serif);font-weight:500;font-size:var(--cs-size);
  line-height:1;letter-spacing:.005em;color:var(--green);}
html::after{content:"";position:fixed;left:50%;width:44px;height:1px;margin-left:-22px;z-index:1001;
  top:calc(50% + var(--cs-size) * .5 + 30px);background:var(--brass);}
@media(max-width:820px){
  body::before{content:"Eigentum am Markt";}
}
/* ===== Ende COMING SOON ===== */
