
:root{
  --rw-blue:#1d304d;
  --rw-blue2:#1d304d;
  --rw-text:#1f2a33;
  --rw-accent:#cca13f;
  --rw-border:#c9d2dc;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; font-family:'Adobe Garamond Pro', Garamond, 'EB Garamond', Georgia, serif; color:var(--rw-text); background:#e9edf1; }
a{ color:var(--rw-blue2); text-decoration:none; }
a:hover{ text-decoration:underline; }

.page{
  max-width:1100px;
  margin:18px auto;
  background:#fff;
  border:1px solid var(--rw-border);
  box-shadow:0 2px 6px rgba(0,0,0,.12);
}
.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 18px;
  background:linear-gradient(#ffffff,#f1f4f7);
  border-bottom:1px solid var(--rw-border);
}
.brand{ display:flex; align-items:center; gap:12px; }
.brand img{ height:52px; width:auto; display:block; }
.brand .claim{ font-size:12px; color:#5a6b7c; }

.contact-mini{ text-align:right; font-size:12px; color:#3b4a58; }
.contact-mini strong{ display:block; color:var(--rw-blue); font-size:13px; }
.badge{
  display:inline-block; margin-top:6px; padding:4px 8px;
  border:1px solid var(--rw-border);
  background:linear-gradient(#fff,#f5f6f7);
  border-radius:3px; color:#3b4a58;
}

.nav{
  background:linear-gradient(#2b4466, var(--rw-blue));
  border-top:1px solid #0a1e33;
  border-bottom:1px solid #0a1e33;
}
.nav ul{ list-style:none; margin:0; padding:0 10px; display:flex; flex-wrap:wrap; }
.nav a{
  display:block; padding:12px 14px; color:#fff; font-size:14px;
  border-right:1px solid rgba(255,255,255,.12);
  text-shadow:0 1px 0 rgba(0,0,0,.35);
}
.nav a:hover, .nav a.active{ background:linear-gradient(#2b4466, var(--rw-blue)); text-decoration:none; }

.hero{ position:relative; border-bottom:1px solid var(--rw-border); }
.hero img{ width:100%; display:block; }
.hero .hero-overlay{
  position:absolute; left:22px; bottom:18px;
  background:rgba(255,255,255,.88);
  border:1px solid var(--rw-border);
  padding:14px 16px; border-radius:3px; max-width:520px;
}
.hero h1{ margin:0 0 6px 0; font-size:22px; color:var(--rw-blue); }
.hero p{ margin:0 0 10px 0; font-size:13px; color:#3b4a58; line-height:1.35; }
.btn{
  display:inline-block; padding:8px 12px;
  border:1px solid #0a1e33;
  background:linear-gradient(#2b4466, var(--rw-blue));
  color:#fff; border-radius:3px; font-size:13px; margin-right:8px;
}
.btn.secondary{ background:linear-gradient(#d6b15a, var(--rw-accent)); border-color:#b48a2a; }
.btn:hover{ filter:brightness(1.05); text-decoration:none; }

.content{ padding:18px; }
.grid3{ display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; }
.card{
  border:1px solid var(--rw-border);
  background:linear-gradient(#ffffff,#f6f7f8);
  border-radius:3px; padding:12px;
}
.card h3{ margin:0 0 6px 0; font-size:16px; color:var(--rw-blue); }
.card p{ margin:0; font-size:13px; line-height:1.35; color:#3b4a58; }
.card .small{ font-size:12px; color:#6a7886; margin-top:8px; }

.hr{ height:1px; background:var(--rw-border); border:0; margin:18px 0; }

.two-col{ display:grid; grid-template-columns: 300px 1fr; gap:16px; align-items:start; }
.portrait{ border:1px solid var(--rw-border); background:#fff; padding:10px; border-radius:3px; }
.portrait .ph{
  height:260px; border:1px solid var(--rw-border);
  background:linear-gradient(#f3f5f7,#dfe6ee);
  display:flex; align-items:center; justify-content:center;
  color:#6a7886; font-size:12px; text-align:center;
}
.kicker{
  color:var(--rw-accent); font-weight:700; font-size:12px;
  text-transform:uppercase; letter-spacing:.04em;
}

.listing{ display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; }
.property{ border:1px solid var(--rw-border); border-radius:3px; overflow:hidden; background:#fff; }
.property .img{
  height:120px; background:linear-gradient(#e9eef4,#cfd9e4);
  border-bottom:1px solid var(--rw-border);
  display:flex; align-items:center; justify-content:center;
  color:#6a7886; font-size:12px;
}
.property .body{ padding:10px; }
.property .title{ font-weight:700; color:var(--rw-blue); margin:0 0 6px 0; font-size:14px; }
.meta{ font-size:12px; color:#566574; line-height:1.35; }

.footer{
  display:grid; grid-template-columns: 1.2fr 1fr 1fr; gap:12px;
  padding:16px 18px;
  background:linear-gradient(#f6f7f8,#eceff2);
  border-top:1px solid var(--rw-border);
  font-size:12px; color:#4a5a68;
}
.footer h4{ margin:0 0 6px 0; font-size:12px; color:var(--rw-blue); text-transform:uppercase; letter-spacing:.04em; }
.footer a{ color:var(--rw-blue2); }

.copy{
  padding:10px 18px; font-size:11px; color:#667685;
  background:#f7f9fb; border-top:1px solid var(--rw-border);
  display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap;
}

.form-row{ margin-bottom:10px; }
label{ display:block; font-size:12px; color:#4a5a68; margin-bottom:4px; }
input, textarea{
  width:100%; border:1px solid var(--rw-border);
  padding:8px; border-radius:3px; font-size:13px;
}
textarea{ min-height:120px; resize:vertical; }

.notice{
  border:1px solid #f0d5d8;
  background:linear-gradient(#fff,#fff6f7);
  padding:10px 12px; border-radius:3px;
  color:#6b2b34; font-size:12px;
}

@media (max-width: 980px){
  .page{ margin:0; border-left:0; border-right:0; }
  .grid3{ grid-template-columns:1fr; }
  .two-col{ grid-template-columns:1fr; }
  .listing{ grid-template-columns:1fr; }
  .contact-mini{ display:none; }
}


/* Flyer-inspired tweaks */
.topbar{ background:#ffffff; border-bottom:0; }
.nav{ background:var(--rw-blue); }
.nav a:hover, .nav a.active{ background:#2b4466; }

.hero{ background:#fff; }
.hero::after{ display:none; }
.hero .hero-overlay{ background:rgba(255,255,255,0.92); border-radius:6px; }

.quote{ font-style:italic; color:var(--rw-blue); font-size:18px; line-height:1.35; margin:0; }
.quote small{ display:block; margin-top:6px; font-style:normal; font-size:13px; color:#3b4a58; }

.kicker{ color:var(--rw-blue); }
.footer{ background:var(--rw-blue); color:#ffffff; }
.footer h4{ color:#ffffff; }
.footer a{ color:#ffffff; text-decoration:underline; }
.copy{ background:#0f243f; color:#d9e3ee; border-top:1px solid rgba(255,255,255,.18); }


/* Hero sizing fix: prevent tall images from creating huge header */
.hero{
  position:relative;
  height:360px;
  overflow:hidden;
}
.hero img{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:360px;
  object-fit:cover;
}
.hero .hero-overlay{
  position:absolute;
  left:22px;
  bottom:18px;
  z-index:2;
}
.hero::after{ display:none; }


/* =========================
   AVA – Subtle Disturbance
   ========================= */

.ava-active {
  animation: avaShift 0.35s ease-in-out;
}

@keyframes avaShift {
  0% { transform: translateX(0); }
  25% { transform: translateX(-1px); }
  50% { transform: translateX(1px); }
  100% { transform: translateX(0); }
}

.ava-message{
  color:#1d304d;
  font-style:italic;
  letter-spacing:0.4px;
  opacity:0;
  transition: opacity 1.6s ease;
  margin-top:10px;
}

.ava-message.visible{
  opacity:1;
}

.rw-portrait{
  transition: filter 700ms ease, transform 700ms ease;
}

body.ava-portrait .rw-portrait{
  filter: brightness(0.86) contrast(1.08) saturate(0.78);
  transform: translateY(1px);
}


/* =========================
   AVA – Stronger (but still subtle)
   ========================= */

body.ava-portrait .rw-portrait{
  filter: brightness(0.78) contrast(1.12) saturate(0.65) hue-rotate(-8deg);
}

body.ava-triggered{
  cursor: default;
}

body.ava-triggered::before{
  content:\"\";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:0.16;
  background:
    repeating-linear-gradient(
      to bottom,
      rgba(29,48,77,0.0) 0px,
      rgba(29,48,77,0.0) 3px,
      rgba(29,48,77,0.6) 4px
    );
  mix-blend-mode:multiply;
  z-index:9998;
}

body.ava-triggered::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:0;
  background:rgba(255,255,255,0.72);
  z-index:9999;
  animation: avaFlicker 6s infinite;
}

@keyframes avaFlicker{
  0%, 78%, 100% { opacity:0; }
  79% { opacity:0.08; }
  80% { opacity:0; }
  82% { opacity:0.14; }
  83% { opacity:0; }
  90% { opacity:0.06; }
  91% { opacity:0; }
}
  93% { opacity:0.06; }
  94% { opacity:0; }
  95% { opacity:0.10; }
  96% { opacity:0; }
}

.ava-message{
  border-left:4px solid #cca13f;
  padding-left:10px;
  margin-top:14px;
}

.ava-glitchword{
  position:relative;
  display:inline-block;
}
.ava-glitchword::after{
  content:attr(data-ava);
  position:absolute;
  left:0;
  top:0;
  opacity:0;
  color:#1d304d;
  text-decoration:underline;
  animation: avaWordBlink 5.5s infinite;
}
@keyframes avaWordBlink{
  0%, 78%, 100% { opacity:0; transform:translateY(0); }
  79% { opacity:0.65; transform:translateY(-1px); }
  80% { opacity:0; }
  81% { opacity:0.65; transform:translateY(1px); }
  82% { opacity:0; }
}



/* =========================
   AVA – Avatar overlays / swaps
   ========================= */
.portrait-wrap{ position:relative; }
.portrait-wrap img{ display:block; width:100%; height:auto; }
.portrait-wrap .ava-avatar{
  position:absolute; inset:0;
  opacity:0;
  transition: opacity 420ms ease;
  filter: contrast(1.05) saturate(0.85);
}
.portrait-wrap.ava-show .ava-avatar{ opacity:1; }
.portrait-wrap.ava-show .rw-portrait{ opacity:0; }

.ava-peek{
  position:fixed;
  right:18px; bottom:18px;
  width:120px; height:120px;
  border-radius:6px;
  overflow:hidden;
  border:1px solid rgba(29,48,77,0.35);
  box-shadow: 0 10px 22px rgba(0,0,0,0.18);
  opacity:0;
  transform: translateY(10px);
  transition: opacity 420ms ease, transform 420ms ease;
  z-index:9997;
  background:#fff;
}
.ava-peek img{ width:100%; height:100%; object-fit:cover; }
.ava-peek.on{ opacity:0.92; transform: translateY(0); }
.ava-peek .cap{
  position:absolute;
  left:0; right:0; bottom:0;
  padding:6px 8px;
  font-size:11px;
  background:rgba(255,255,255,0.86);
  color:#1d304d;
  border-top:1px solid rgba(29,48,77,0.18);
  letter-spacing:0.2px;
}

/* Smooth fade-out for "other references" on Objekt 19 */
.ava-fade{
  transition: opacity 0.65s ease, max-height 0.65s ease, margin 0.65s ease, padding 0.65s ease;
  opacity:0;
  max-height:0 !important;
  overflow:hidden !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}


/* AVA – Flicker during portrait swap */
.portrait-wrap.ava-show{
  animation: avaFlickerSwap 0.85s linear;
}
@keyframes avaFlickerSwap{
  0%{ filter:none; }
  8%{ filter:contrast(1.1) brightness(0.95); }
  16%{ filter:none; }
  24%{ filter:contrast(1.08) brightness(0.92); }
  32%{ filter:none; }
  40%{ filter:contrast(1.12) brightness(0.96); }
  100%{ filter:none; }
}


/* AVA – Enhanced Flicker */
.portrait-wrap.ava-show{
  animation: avaFlickerSwapStrong 0.9s linear;
}
@keyframes avaFlickerSwapStrong{
  0%{ opacity:1; }
  10%{ opacity:0.2; }
  18%{ opacity:1; }
  26%{ opacity:0.3; }
  34%{ opacity:1; }
  42%{ opacity:0.15; }
  60%{ opacity:1; }
  100%{ opacity:1; }
}




/* AVA – Strike-through (delayed) */
.ava-strike-target{
  text-decoration: none;
  transition: opacity 250ms ease;
}
.ava-strike-target.ava-strike-applied{
  text-decoration: line-through;
  opacity: 0.75;
}
