:root{
  --stone:#3B372F;
  --ink:#221E19;
  --paper:#DED6C1;
  --paper-light:#E9E2D0;
  --rust:#8A4A2C;
  --moss:#556248;
  --line: rgba(34,30,25,0.18);
  --paper-shadow: rgba(34,30,25,0.28);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Source Serif 4', serif;
  line-height:1.6;
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important;}
}

.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  letter-spacing:0.18em;
  text-transform:uppercase;
  font-size:0.72rem;
  color:var(--paper-light);
  opacity:0.85;
}
.eyebrow.dark{color:var(--rust);}

h1,h2,h3{
  font-family:'Fraunces', serif;
  font-weight:500;
  margin:0;
}

/* ---------- LANG SWITCH ---------- */
.lang-switch{
  position:fixed;
  top:1.2rem;
  right:1.2rem;
  z-index:20;
  display:flex;
  gap:0.4rem;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem;
  letter-spacing:0.06em;
}
.lang-switch a{
  color:#fff;
  background:rgba(34,30,25,0.45);
  border:1px solid rgba(255,255,255,0.4);
  padding:0.35rem 0.65rem;
  border-radius:2px;
  text-decoration:none;
  backdrop-filter:blur(2px);
}
.lang-switch a.active{
  background:var(--rust);
  border-color:var(--rust);
}

/* ---------- HERO ---------- */
.hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:flex-end;
  background:var(--stone);
  overflow:hidden;
}
.hero img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:grayscale(15%) contrast(1.05);
  opacity:0.62;
}
.hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(34,30,25,0.15) 0%, rgba(34,30,25,0.55) 60%, rgba(20,17,14,0.92) 100%);
}
.hero-content{
  position:relative;
  z-index:2;
  padding:3rem 1.5rem 3.5rem;
  max-width:760px;
  margin:0 auto;
  width:100%;
  color:var(--paper-light);
}
.hero h1{
  font-size:clamp(2.1rem, 6vw, 3.6rem);
  line-height:1.08;
  color:#fff;
  margin:0.6rem 0 1.1rem;
  font-style:italic;
  font-weight:500;
}
.hero p{
  font-size:1.05rem;
  max-width:52ch;
  color:var(--paper-light);
  opacity:0.92;
}
.hero .tag{
  display:inline-block;
  margin-top:1.4rem;
  font-family:'IBM Plex Mono',monospace;
  font-size:0.75rem;
  letter-spacing:0.08em;
  color:var(--rust);
  border:1px solid rgba(138,74,44,0.6);
  padding:0.4rem 0.8rem;
  border-radius:2px;
  background:rgba(138,74,44,0.08);
}
.scroll-cue{
  position:absolute; bottom:1.4rem; left:50%; transform:translateX(-50%);
  z-index:2; width:1px; height:34px; background:rgba(233,226,208,0.5);
}
.scroll-cue::after{
  content:"";
  position:absolute; top:0; left:-3px; width:7px; height:7px;
  border-radius:50%; background:var(--paper-light);
  animation: dropcue 2.2s ease-in-out infinite;
}
@keyframes dropcue{ 0%{top:0; opacity:1;} 90%{opacity:0;} 100%{top:28px; opacity:0;} }

/* ---------- SECTIONS ---------- */
section{
  max-width:760px;
  margin:0 auto;
  padding:4.5rem 1.5rem;
}
.intro p{
  font-size:1.18rem;
  margin:0 0 1.3rem;
}
.intro p:first-of-type::first-letter{
  font-family:'Fraunces', serif;
  font-size:3.6rem;
  float:left;
  line-height:0.8;
  padding-right:0.5rem;
  padding-top:0.35rem;
  font-weight:500;
  color:var(--rust);
}
.intro .lede{
  font-style:italic;
  color:var(--stone);
}

/* ---------- PHOTO LEDGER ---------- */
.ledger{
  max-width:820px;
  margin:0 auto;
  padding:2rem 1.5rem 5rem;
}
.ledger-head{
  text-align:center;
  margin-bottom:3.5rem;
}
.ledger-head h2{
  font-size:1.9rem;
  font-style:italic;
}
.ledger-head .eyebrow{color:var(--rust); opacity:1;}
.ledger-head p{
  max-width:48ch;
  margin:0.9rem auto 0;
  color:var(--stone);
  font-size:0.98rem;
}

.entry{
  position:relative;
  display:grid;
  grid-template-columns:96px 1fr;
  gap:0 1.6rem;
  padding-bottom:3.5rem;
}
.entry:last-child{padding-bottom:0;}
.entry::before{
  content:"";
  position:absolute;
  left:47px;
  top:6px;
  bottom:-3.5rem;
  width:1px;
  background:var(--line);
}
.entry:last-child::before{ display:none; }
.entry-date{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.82rem;
  color:var(--rust);
  text-align:right;
  padding-top:0.3rem;
  position:relative;
}
.entry-date::after{
  content:"";
  position:absolute;
  right:-53px;
  top:0.55rem;
  width:9px; height:9px;
  background:var(--paper);
  border:2px solid var(--rust);
  border-radius:50%;
}
.entry-body figure{margin:0 0 1rem;}
.entry-body img{
  width:100%;
  display:block;
  border-radius:2px;
  box-shadow:0 14px 30px -14px var(--paper-shadow);
}
.entry-body figcaption{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.72rem;
  letter-spacing:0.02em;
  color:var(--stone);
  opacity:0.75;
  margin-top:0.5rem;
}
.entry-body h3{
  font-size:1.25rem;
  font-style:italic;
  margin-bottom:0.6rem;
}
.entry-body p{ margin:0 0 0.9rem; font-size:1rem; }
.custom-note{
  background:var(--paper-light);
  border-left:3px solid var(--moss);
  padding:1rem 1.2rem;
  font-size:0.95rem;
  border-radius:0 3px 3px 0;
}
.custom-note .label{
  display:block;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.68rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--moss);
  margin-bottom:0.4rem;
}
.pending{
  font-size:0.72rem;
  font-family:'IBM Plex Mono', monospace;
  color:var(--rust);
  opacity:0.8;
}

@media (max-width: 560px){
  .entry{ grid-template-columns:56px 1fr; gap:0 1rem; }
  .entry::before{ left:27px; }
  .entry-date::after{ right:-30px; }
  .entry-date{ font-size:0.68rem; }
}

/* ---------- FAMILY ---------- */
.family{
  background:var(--stone);
  color:var(--paper-light);
}
.family-inner{
  max-width:760px;
  margin:0 auto;
  padding:4.5rem 1.5rem;
}
.family h2{
  font-size:1.9rem;
  font-style:italic;
  color:#fff;
  margin-bottom:0.4rem;
}
.family > .family-inner > .eyebrow{ color:var(--rust); opacity:1; }
.person{
  display:grid;
  grid-template-columns:110px 1fr;
  gap:1.4rem;
  padding:1.8rem 0;
  border-top:1px solid rgba(233,226,208,0.18);
}
.person:last-child{ padding-bottom:0; }
.person .years{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.85rem;
  color:var(--rust);
  line-height:1.5;
}
.person h3{
  font-size:1.2rem;
  font-style:italic;
  color:#fff;
  margin-bottom:0.5rem;
}
.person p{ font-size:0.98rem; color:var(--paper-light); opacity:0.92; margin:0; }

/* ---------- CLOSING ---------- */
.closing{
  text-align:center;
  padding:6rem 1.5rem 5rem;
}
.closing blockquote{
  font-family:'Fraunces', serif;
  font-style:italic;
  font-size:clamp(1.4rem, 4vw, 1.9rem);
  max-width:34ch;
  margin:0 auto 1.6rem;
  color:var(--stone);
  line-height:1.4;
}
.closing .sig{
  font-family:'IBM Plex Mono', monospace;
  font-size:0.78rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--rust);
}
.closing .place{
  margin-top:0.4rem;
  font-size:0.85rem;
  color:var(--stone);
  opacity:0.7;
}
footer{
  text-align:center;
  padding:2rem 1.5rem 3rem;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.7rem;
  color:var(--stone);
  opacity:0.55;
  letter-spacing:0.04em;
}

a:focus-visible, button:focus-visible{
  outline:2px solid var(--rust);
  outline-offset:3px;
}

/* ---------- LANDING PAGE ---------- */
.landing-hero{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:var(--stone);
  color:var(--paper-light);
  padding:2rem 1.5rem;
}
.landing-hero .eyebrow{ color:var(--rust); opacity:1; margin-bottom:1rem;}
.landing-hero h1{
  font-size:clamp(2rem, 7vw, 3.4rem);
  color:#fff;
  font-style:italic;
  max-width:16ch;
  margin-bottom:1.2rem;
}
.landing-hero p{
  max-width:46ch;
  font-size:1.05rem;
  opacity:0.9;
  margin-bottom:2.4rem;
}
.house-card{
  display:block;
  max-width:420px;
  width:100%;
  margin:0 auto;
  background:var(--paper-light);
  color:var(--ink);
  text-decoration:none;
  border-radius:4px;
  overflow:hidden;
  box-shadow:0 20px 40px -20px rgba(0,0,0,0.5);
  transition:transform 0.2s ease;
}
.house-card:hover{ transform:translateY(-3px); }
.house-card img{
  width:100%;
  height:220px;
  object-fit:cover;
  display:block;
}
.house-card .house-card-body{
  padding:1.2rem 1.4rem 1.5rem;
  text-align:left;
}
.house-card .house-card-body .eyebrow{ color:var(--rust); opacity:1; }
.house-card h2{
  font-size:1.3rem;
  font-style:italic;
  margin:0.4rem 0 0.4rem;
}
.house-card p{
  font-size:0.9rem;
  color:var(--stone);
  margin:0;
}
.more-houses{
  margin-top:2.2rem;
  font-family:'IBM Plex Mono', monospace;
  font-size:0.75rem;
  color:var(--paper-light);
  opacity:0.6;
}