/* Lamea · lamea.ch — Stylesheet
   Farben aus dem Markendossier. Keine externen Ressourcen. */

:root{
  --navy:#1B2A4A;
  --bronze:#8A6A2E;
  --bronze-tief:#82642B; /* Kleintext auf Sand/Elfenbein, WCAG AA */
  --champagne:#D8BC82;
  --ivory:#FBF8F3;
  --sand:#F2EADD;
  --display:Georgia,"Times New Roman",Times,serif;
  --body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --gutter:clamp(1.25rem,5vw,4rem);
  --wrap:78rem;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--ivory);color:var(--navy);
  font-family:var(--body);font-size:clamp(1rem,.96rem + .25vw,1.0625rem);
  line-height:1.65;font-kerning:normal;text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
a:hover{color:var(--bronze-tief)}
:focus-visible{outline:2px solid var(--bronze-tief);outline-offset:3px}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.eyebrow{margin:0;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;color:var(--bronze-tief)}
.rule{width:72px;height:1px;background:var(--champagne);border:0;margin:clamp(1.5rem,4vh,2.25rem) 0}

/* Sprungmarke */
.skip{position:absolute;left:-9999px;top:0;z-index:20;background:var(--navy);color:var(--ivory);
  padding:.75rem 1.125rem;font-size:.875rem;letter-spacing:.08em;text-decoration:none}
.skip:focus{left:1rem;top:1rem;position:fixed;color:var(--ivory)}

/* Kopfzeile */
.site-head{position:sticky;top:0;z-index:10;background:rgba(251,248,243,.94);
  -webkit-backdrop-filter:saturate(140%) blur(8px);backdrop-filter:saturate(140%) blur(8px);
  border-bottom:1px solid rgba(216,188,130,.55)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:1.125rem}
.brand{display:flex;align-items:center;gap:.875rem;text-decoration:none}
.brand img{height:30px;width:30px;object-fit:contain}
.brand span{font-family:var(--display);font-size:1.1875rem;letter-spacing:.34em;line-height:1}
.site-nav{display:flex;align-items:center;gap:clamp(1rem,3vw,2rem);
  font-size:.8125rem;letter-spacing:.16em;text-transform:uppercase}
.site-nav a{text-decoration:none;padding-bottom:2px;border-bottom:1px solid transparent}
.site-nav a:hover{border-bottom-color:var(--bronze-tief)}
.site-nav .sep{width:1px;height:14px;background:rgba(27,42,74,.2)}
.lang{display:flex;align-items:center;gap:.625rem}
.lang [aria-current]{color:var(--bronze-tief)}
.lang a{color:rgba(27,42,74,.55)}

/* Auftakt */
.hero{padding-block:clamp(3rem,12vh,7.5rem) clamp(3rem,9vh,6rem)}
.hero .mark{height:clamp(4.25rem,8vw,6.5rem);width:auto;
  margin:0 0 clamp(1.75rem,4.5vh,2.75rem)}
.hero h1{font-family:var(--display);font-weight:400;
  font-size:clamp(2.1rem,1.3rem + 2.6vw,3.9rem);line-height:1.12;letter-spacing:-.01em;
  margin:clamp(1.25rem,3vh,1.75rem) 0 0;max-width:24ch;text-wrap:pretty}
.hero p.lead{margin:0;max-width:38ch;color:rgba(27,42,74,.86);text-wrap:pretty;
  font-size:clamp(1rem,.96rem + .25vw,1.15rem)}
.button{display:inline-flex;align-items:center;gap:.625rem;margin-top:clamp(1.6rem,4vh,2.4rem);
  padding:.875rem 1.625rem;background:var(--navy);color:var(--ivory);text-decoration:none;
  font-size:.8125rem;letter-spacing:.16em;text-transform:uppercase;
  transition:background .18s ease,color .18s ease}
.button:hover{background:var(--bronze-tief);color:var(--ivory)}

/* Aufenthaltsdauer */
.band{background:var(--sand);border-block:1px solid rgba(216,188,130,.7)}
.band .wrap{padding-block:clamp(2.25rem,6vh,3.75rem)}
.band h2{margin:0 0 clamp(1.375rem,3vh,2rem);font-size:.78rem;font-weight:700;
  letter-spacing:.22em;text-transform:uppercase;color:var(--bronze-tief)}
.band ul{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:clamp(1.5rem,4vw,3rem)}
.band li{border-top:1px solid rgba(130,100,43,.35);padding-top:1rem}
.band b{display:block;font-family:var(--display);font-weight:400;
  font-size:clamp(1.25rem,1.05rem + .6vw,1.6rem);line-height:1.2}
.band small{display:block;margin-top:.5rem;font-size:.9rem;color:rgba(27,42,74,.72)}

/* Leitsatz */
.statement{padding-block:clamp(3.5rem,10vh,7rem) 0}
.statement p{font-family:var(--display);font-size:clamp(1.4rem,1.05rem + 1.5vw,2.3rem);
  line-height:1.38;max-width:30ch;margin:0;text-wrap:pretty}
.statement em{font-style:normal;color:var(--bronze-tief)}

/* Spalten */
.cols{padding-block:clamp(2.5rem,7vh,4.5rem) 0}
.cols .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
  gap:clamp(2rem,4vw,3.5rem);max-width:64rem}
.cols h2{margin:0 0 .875rem;padding-bottom:.75rem;border-bottom:1px solid rgba(130,100,43,.3);
  font-size:.78rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze-tief)}
.cols p{margin:0;max-width:34ch;color:rgba(27,42,74,.88)}

/* Kontakt */
.contact{margin-top:clamp(3.5rem,10vh,7rem);background:var(--navy);color:var(--ivory)}
.contact .wrap{padding-block:clamp(2.75rem,8vh,5rem);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));gap:clamp(1.75rem,5vw,4rem);align-items:start}
.contact h2{margin:0 0 1.125rem;font-size:.78rem;font-weight:700;letter-spacing:.22em;
  text-transform:uppercase;color:var(--champagne)}
.contact .claim{font-family:var(--display);font-size:clamp(1.5rem,1.2rem + 1vw,2rem);
  line-height:1.25;margin:0;max-width:24ch}
.contact .name{font-family:var(--display);font-size:1.4rem;margin:0 0 .25rem}
.contact .role{margin:0 0 1.5rem;font-size:.9rem;letter-spacing:.06em;color:rgba(216,188,130,.9)}
.contact ul{list-style:none;margin:0;padding:0;display:grid;gap:.75rem;font-size:1.05rem}
.contact a{text-decoration:none;border-bottom:1px solid rgba(216,188,130,.5);padding-bottom:2px;
  transition:color .18s ease,border-color .18s ease}
.contact a:hover{color:var(--champagne);border-bottom-color:var(--champagne)}

/* Fusszeile */
.site-foot{border-top:1px solid rgba(27,42,74,.14)}
.site-foot .wrap{padding-block:1.625rem 2.125rem;display:flex;flex-wrap:wrap;
  gap:.625rem 2rem;justify-content:space-between;align-items:center;
  font-size:.84rem;color:rgba(27,42,74,.66)}
.site-foot .note{max-width:46ch}
.site-foot nav{display:flex;gap:1.5rem}
.site-foot a{text-decoration:none;padding-bottom:2px;border-bottom:1px solid transparent}
.site-foot a:hover{border-bottom-color:var(--bronze-tief)}

/* Rechtstexte */
.legal{padding-block:clamp(2.5rem,8vh,5rem) clamp(2rem,6vh,4rem);max-width:44rem}
.legal h1{font-family:var(--display);font-weight:400;font-size:clamp(1.9rem,1.4rem + 1.6vw,2.9rem);
  line-height:1.15;margin:clamp(1rem,2vh,1.5rem) 0 clamp(1.5rem,4vh,2.25rem)}
.legal h2{font-size:.78rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--bronze-tief);margin:clamp(2rem,5vh,2.75rem) 0 .625rem}
.legal p,.legal li{color:rgba(27,42,74,.88);max-width:60ch}
.legal p{margin:0 0 .875rem}
.legal ul{margin:0 0 .875rem;padding-left:1.1rem}
.legal address{font-style:normal}
.legal .back{display:inline-block;margin-top:clamp(2rem,5vh,3rem);font-size:.8125rem;
  letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
  border-bottom:1px solid rgba(130,100,43,.45);padding-bottom:2px}

@media (max-width:34rem){
  .site-nav{gap:.875rem;font-size:.75rem}
  .brand span{letter-spacing:.24em;font-size:1.0625rem}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation:none !important;transition-duration:.01ms !important}
}
@media print{
  .site-head,.skip,.button{display:none}
  body{background:#fff}
  .contact{background:#fff;color:var(--navy)}
}
