/* =========================================================
   Tokens
   ========================================================= */
:root{
  --ink:        #1a1a17;
  --paper:      #f6f5f1;
  --paper-card: #ffffff;
  --red:        #c8102e;
  --red-deep:   #8f0a1f;
  --grey:       #84827a;
  --grey-soft:  #b8b6ac;
  --line:       #dcdad1;
  --green:      #1d7a4c;

  --display: "Archivo", "Arial Narrow", sans-serif;
  --body:    "IBM Plex Sans", "Segoe UI", sans-serif;
  --mono:    "IBM Plex Mono", "Courier New", monospace;

  --maxw: 1180px;
  --gutter: clamp(20px, 5vw, 64px);
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
html{-webkit-font-smoothing:antialiased;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-size:16px;
  line-height:1.55;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
button{font-family:inherit;cursor:pointer;}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:800;letter-spacing:-0.01em;line-height:1.05;}

.skip-link{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--paper);padding:8px 14px;z-index:200;}
.skip-link:focus{left:8px;top:8px;}

:focus-visible{outline:3px solid var(--red);outline-offset:2px;}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter);}

.eyebrow{
  font-family:var(--mono);
  font-size:12.5px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--red);
  display:flex;align-items:center;gap:10px;
  margin-bottom:14px;
}
.eyebrow::before{
  content:"";
  width:7px;height:7px;background:var(--red);
  display:inline-block;
}

.rule{border:none;border-top:1px solid var(--line);margin:0;}

/* =========================================================
   Header
   ========================================================= */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(246,245,241,.92);
  backdrop-filter:saturate(140%) blur(6px);
  border-bottom:1px solid var(--line);
}
.site-header .wrap{
  display:flex;align-items:center;justify-content:space-between;
  height:76px;
}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:800;font-size:18px;letter-spacing:-.01em;white-space:nowrap;flex:none;}
.brand .mark{
  width:14px;height:14px;background:var(--red);
  display:inline-block;flex:none;
}
.brand-name{line-height:1;}

.main-nav{display:flex;align-items:center;gap:30px;}
.main-nav a{font-size:14.5px;font-weight:500;border-bottom:2px solid transparent;padding-bottom:2px;}
.main-nav a:hover{border-color:var(--red);}

.lang-switch{display:flex;border:1px solid var(--ink);font-family:var(--mono);font-size:12.5px;}
.lang-switch a{padding:7px 11px;display:block;}
.lang-switch a.active{background:var(--ink);color:var(--paper);}

.nav-cta{
  font-family:var(--mono);font-size:13px;font-weight:500;
  background:var(--ink);color:var(--paper);
  padding:10px 16px;white-space:nowrap;
}
.nav-cta:hover{background:var(--red);}

.nav-cta-mobile{display:none;}

.header-right{display:flex;align-items:center;gap:18px;}

.nav-toggle{display:none;background:none;border:1px solid var(--ink);width:42px;height:42px;flex:none;}
.nav-toggle span{display:block;width:18px;height:2px;background:var(--ink);margin:4px auto;}

@media (max-width:880px){
  .main-nav{
    position:fixed;inset:76px 0 0 0;background:var(--paper);
    flex-direction:column;align-items:flex-start;padding:28px var(--gutter);gap:22px;
    transform:translateY(-110%);transition:transform .35s ease;
    border-bottom:1px solid var(--line);
  }
  .main-nav.open{transform:translateY(0);}
  .main-nav a{font-size:20px;}
  .nav-cta-mobile{display:block;order:5;margin-top:10px;}
  .nav-toggle{display:block;}
  .header-right .nav-cta{display:none;}
}

/* =========================================================
   Hero
   ========================================================= */
.hero{
  position:relative;
  padding:84px 0 96px;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.hero .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.25fr .9fr;gap:56px;align-items:end;}
.hero-bg-grid{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background-image:
    linear-gradient(to right, var(--line) 1px, transparent 1px);
  background-size: calc(100% / 6) 100%;
  opacity:.5;
}
.hero-title{font-size:clamp(40px,6vw,72px);margin:18px 0 22px;}
.hero-title span{display:block;}
.hero-title .accent{color:var(--red);}
.hero-sub{max-width:46ch;color:#3c3b36;font-size:17.5px;margin-bottom:32px;}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:40px;}

.btn{
  font-family:var(--mono);font-size:14px;font-weight:500;
  padding:14px 22px;border:1px solid var(--ink);display:inline-flex;align-items:center;gap:8px;
}
.btn-primary{background:var(--ink);color:var(--paper);}
.btn-primary:hover{background:var(--red);border-color:var(--red);}
.btn-ghost{background:transparent;color:var(--ink);}
.btn-ghost:hover{border-color:var(--red);color:var(--red-deep);}

.hero-stamp{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--grey);
}
.hero-stamp svg{width:46px;height:46px;flex:none;}

.hero-side{
  border:1px solid var(--ink);background:var(--paper-card);
  padding:22px;
}
.hero-side-head{margin-bottom:14px;}
.hero-side-head .label{font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--grey);}

.fact-list{margin-bottom:18px;}
.fact-list li{
  display:flex;justify-content:space-between;gap:14px;font-size:14.5px;
  padding:11px 0;border-top:1px solid var(--line);
}
.fact-list li:first-child{border-top:none;}
.fact-list li span{color:var(--grey);}
.fact-list li strong{font-weight:700;text-align:right;}

.hero-side-note{
  font-family:var(--mono);font-size:12px;line-height:1.5;color:var(--grey);
  border-top:1px dashed var(--grey-soft);padding-top:14px;margin:0;
}

@media (max-width:880px){
  .hero .wrap{grid-template-columns:1fr;}
}

/* =========================================================
   Section scaffolding
   ========================================================= */
section{padding:96px 0;border-bottom:1px solid var(--line);}
.section-head{max-width:62ch;margin-bottom:48px;}
.section-title{font-size:clamp(28px,3.6vw,40px);}
.section-intro{margin-top:16px;color:#454440;font-size:16.5px;}

/* =========================================================
   Pricing cards
   ========================================================= */
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.card{
  background:var(--paper-card);
  padding:36px;position:relative;display:flex;flex-direction:column;
}
.card-badge-row{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:22px;}
.badge{font-family:var(--mono);font-size:13px;border:1px solid var(--ink);padding:3px 9px;}
.tag{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;background:var(--red);color:#fff;padding:4px 9px;}

.card h3{font-size:24px;margin-bottom:10px;}
.card p.desc{color:#454440;font-size:15px;margin-bottom:24px;}

.price-row{display:flex;align-items:baseline;gap:8px;margin-bottom:6px;}
.price-row .ccy{font-family:var(--mono);font-size:16px;color:var(--grey);}
.price-row .amount{font-family:var(--display);font-size:46px;font-weight:800;}
.price-period{font-family:var(--mono);font-size:12.5px;color:var(--grey);margin-bottom:26px;}

.feature-list{margin-bottom:22px;flex:1;}
.feature-list li{
  display:flex;gap:10px;font-size:14.5px;padding:9px 0;border-top:1px solid var(--line);
}
.feature-list li:first-child{border-top:none;}
.feature-list li::before{content:"—";color:var(--red);flex:none;}

.addon-note{
  font-family:var(--mono);font-size:12.5px;color:var(--grey);
  border-top:1px dashed var(--grey-soft);padding-top:14px;margin-bottom:22px;
}

.card .btn{justify-content:center;width:100%;}

@media (max-width:760px){
  .cards{grid-template-columns:1fr;}
}

/* =========================================================
   Desk sharing section
   ========================================================= */
.desk-panel{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:start;margin-bottom:64px;}
.calendar-note-panel{
  border:1px solid var(--ink);background:var(--paper-card);padding:32px;
  display:flex;flex-direction:column;gap:14px;
}
.calendar-note-panel h3{font-size:22px;}
.calendar-note-panel p{font-size:15px;color:#454440;margin:0;}
.calendar-note-panel .btn{align-self:flex-start;margin-top:6px;}

.filters{display:flex;flex-direction:column;gap:26px;}
.filter-item{display:grid;grid-template-columns:40px 1fr;gap:14px;}
.filter-num{font-family:var(--mono);color:var(--red);font-size:14px;padding-top:2px;}
.filter-item h4{font-size:16.5px;margin-bottom:6px;font-family:var(--body);font-weight:700;}
.filter-item p{font-size:14.5px;color:#454440;margin:0;}

@media (max-width:880px){
  .desk-panel{grid-template-columns:1fr;}
}

/* =========================================================
   Extras
   ========================================================= */
.extras-panel{
  display:grid;grid-template-columns:1.1fr .9fr;gap:50px;
  border:1px solid var(--ink);background:var(--paper-card);padding:46px;
}
.extras-panel h3{font-size:26px;margin-bottom:16px;}
.extras-panel p{color:#454440;margin-bottom:0;}
.extras-list li{display:flex;gap:10px;font-size:15px;padding:10px 0;border-top:1px solid var(--line);}
.extras-list li:first-child{border-top:none;}
.extras-list li::before{content:"§";color:var(--red);font-family:var(--mono);}
.extras-right{display:flex;flex-direction:column;justify-content:space-between;}

@media (max-width:880px){
  .extras-panel{grid-template-columns:1fr;padding:30px;}
}

/* =========================================================
   Location
   ========================================================= */
.location-panel{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:stretch;}
.location-card{border:1px solid var(--ink);background:var(--paper-card);padding:34px;}
.location-card h3{font-size:30px;margin-bottom:4px;}
.location-card .city{font-family:var(--mono);font-size:14px;color:var(--grey);margin-bottom:20px;display:block;}
.location-rows{margin-top:24px;}
.location-rows .row{display:flex;justify-content:space-between;padding:12px 0;border-top:1px solid var(--line);font-size:14.5px;}
.location-rows .row .k{font-family:var(--mono);color:var(--grey);font-size:12.5px;text-transform:uppercase;letter-spacing:.04em;}
.map-frame{border:1px solid var(--ink);overflow:hidden;min-height:320px;}
.map-frame iframe{width:100%;height:100%;min-height:320px;border:0;display:block;filter:grayscale(.15) contrast(1.05);}

@media (max-width:880px){
  .location-panel{grid-template-columns:1fr;}
}

.exterior-photo{
  margin:32px 0 0;border:1px solid var(--ink);background:var(--paper-card);
}
.exterior-photo img{width:100%;height:auto;display:block;max-height:480px;object-fit:cover;}
.exterior-photo figcaption{
  font-family:var(--mono);font-size:12px;color:var(--grey);
  padding:12px 18px;border-top:1px solid var(--line);
}

/* =========================================================
   Contact
   ========================================================= */
.contact-panel{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;}
.contact-form{display:grid;gap:18px;}
.form-row{display:grid;gap:7px;}
.form-row label{font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--grey);}
.form-row input,.form-row select,.form-row textarea{
  font-family:var(--body);font-size:15px;
  border:1px solid var(--ink);background:var(--paper-card);padding:12px 14px;
}
.form-row textarea{min-height:110px;resize:vertical;}
.form-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form-msg{font-family:var(--mono);font-size:13.5px;padding:14px 16px;border:1px solid var(--green);background:#eaf4ee;color:var(--green);}
.form-msg.error{border-color:var(--red);background:#f6e9ea;color:var(--red-deep);}

@media (max-width:760px){
  .contact-panel{grid-template-columns:1fr;}
  .form-grid-2{grid-template-columns:1fr;}
}

/* =========================================================
   Footer
   ========================================================= */
.site-footer{padding:48px 0 36px;border-bottom:none;}
.site-footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;}
.footer-brand{font-family:var(--display);font-weight:800;font-size:16px;}
.footer-tagline{font-family:var(--mono);font-size:12.5px;color:var(--grey);margin-top:6px;}
.footer-links{display:flex;gap:22px;font-size:14px;align-self:center;}
.footer-fine{font-family:var(--mono);font-size:11.5px;color:var(--grey-soft);margin-top:18px;}

/* =========================================================
   Impressum page
   ========================================================= */
.impressum-body{padding:90px 0;max-width:64ch;}
.impressum-body p{margin:0 0 14px;}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  *{transition:none !important;}
}