:root{
  --oya-olive:#5D6A56;
  --oya-sage:#ABB5A5;
  --oya-ink:#40433D;
  --oya-grey:#5E5955;
  --oya-white:#FFFFFF;
  --oya-tile:#FAFAFA;
  --oya-line:rgba(64,67,61,.18);
  --max:1240px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--oya-white);
  color:var(--oya-ink);
  font-family:"Source Sans Pro",Arial,sans-serif;
  font-weight:300;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
button{font:inherit}
img{max-width:100%;display:block}
.wrap{width:min(calc(100% - 48px),var(--max));margin:0 auto}

.header{
  position:sticky;top:0;z-index:50;
  background:rgba(250,250,250,.96);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(64,67,61,.08);
}
.header__inner{
  min-height:88px;
  display:grid;
  grid-template-columns:180px 1fr auto auto;
  align-items:center;
  gap:34px;
}
.header__brand img{width:138px;height:auto}
.nav{
  justify-self:center;
  display:flex;
  align-items:center;
  gap:34px;
}
.nav a,.button{
  font-size:12px;
  font-weight:400;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.nav a{position:relative;padding:30px 0}
.nav a:after{
  content:"";
  position:absolute;left:0;right:100%;bottom:22px;
  height:1px;background:var(--oya-olive);
  transition:right .2s ease;
}
.nav a:hover:after{right:0}

.lang-switch{
  justify-self:end;
  display:flex;
  align-items:center;
  gap:8px;
  font-size:11px;
  font-weight:400;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.lang-switch a{
  color:rgba(64,67,61,.52);
  transition:color .2s ease;
}
.lang-switch a:hover,
.lang-switch a.active{
  color:var(--oya-ink);
}
.lang-switch__sep{
  color:rgba(64,67,61,.24);
}

.nav-toggle{display:none;border:0;background:none;padding:10px}
.nav-toggle span{display:block;width:25px;height:1px;background:var(--oya-ink);margin:6px 0}

.button{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 22px;
  border:1px solid transparent;
  transition:.2s ease;
}
.button--olive{background:var(--oya-olive);color:#fff}
.button--olive:hover{background:var(--oya-ink)}
.button--light{background:#fff;color:var(--oya-ink)}
.button--light:hover{background:var(--oya-tile)}
.header__cta{justify-self:end}

.kicker{
  margin:0 0 18px;
  font-size:12px;
  font-weight:400;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.kicker--light{color:rgba(255,255,255,.88)}

h1,h2,h3,p{margin-top:0}
h1,h2{
  font-weight:300;
  letter-spacing:-.025em;
  line-height:1.02;
}
h1{
  margin:0;
  color:#fff;
  font-size:clamp(58px,8vw,116px);
}
h2{font-size:clamp(39px,5vw,68px)}
h3{font-weight:400}

.hero{
  background:var(--oya-olive);
  color:#fff;
  overflow:hidden;
}
.hero__grid{
  min-height:720px;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:60px;
  align-items:center;
}
.hero__copy{padding:90px 0}
.hero__lead{
  max-width:520px;
  margin:30px 0 34px;
  font-size:20px;
  line-height:1.5;
}
.hero__lead em{
  display:block;
  margin-top:6px;
  color:rgba(255,255,255,.72);
  font-weight:300;
}
.hero__art{
  min-width:0;
  display:flex;
  justify-content:center;
  align-items:center;
}
.hero__art img{
  width:min(100%,560px);
  opacity:.96;
}

.statement{
  background:var(--oya-sage);
  padding:110px 0;
}
.statement__grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:90px;
  align-items:start;
}
.statement__text{
  max-width:570px;
  padding-top:40px;
  font-size:19px;
}
.english{
  font-style:italic;
  font-weight:300;
  color:var(--oya-grey);
}
.statement__text .english{margin-top:30px}

.apartments{padding:110px 0;background:#fff}
.section-head{
  margin-bottom:52px;
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:40px;
}
.section-head h2{margin-bottom:0}
.section-head__aside{margin:0 0 8px}
.apartment-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}
.apartment-card{
  background:var(--oya-tile);
  border:1px solid rgba(64,67,61,.08);
  min-width:0;
}
.apartment-card a{display:block;height:100%}
.apartment-card__image{
  position:relative;
  aspect-ratio:4/3;
  overflow:hidden;
  background-color:var(--oya-sage);
  background-size:cover;
  background-position:center;
}
.apartment-card__image:after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(93,106,86,.04),rgba(93,106,86,.20));
}
.apartment-card__image span{
  position:absolute;right:18px;bottom:14px;z-index:2;
  color:#fff;font-size:13px;font-weight:400;letter-spacing:.12em;
}
.apartment-card__content{padding:25px 24px 28px}
.location{
  margin-bottom:10px;
  font-size:10px;
  font-weight:400;
  letter-spacing:.12em;
}
.apartment-card h3{
  margin-bottom:8px;
  font-size:26px;
  font-weight:300;
}
.apartment-card__content>p:not(.location){
  min-height:48px;
  color:var(--oya-grey);
}
.card-link{
  display:inline-block;
  margin-top:12px;
  font-size:11px;
  font-weight:400;
  letter-spacing:.1em;
}
.apartment-card:hover .card-link{color:var(--oya-olive)}
.apartment-card:hover .apartment-card__image{filter:saturate(.9)}
.apartment-card--wide{grid-column:span 1}

/*
  Final apartment photography:
  Upload your images into /assets using these exact filenames.
  Until then, the OYA sage CI background remains visible.
*/
.photo--parkside-suite{background-image:linear-gradient(rgba(171,181,165,.10),rgba(171,181,165,.10)),url("assets/cozy-parkside-suite.jpg")}
.photo--parkside-residence{background-image:linear-gradient(rgba(171,181,165,.10),rgba(171,181,165,.10)),url("assets/spacious-parkside-residence.jpg")}
.photo--prestige{background-image:linear-gradient(rgba(171,181,165,.10),rgba(171,181,165,.10)),url("assets/prestige.jpg")}
.photo--suite147{background-image:linear-gradient(rgba(171,181,165,.10),rgba(171,181,165,.10)),url("assets/suite147.jpg")}
.photo--luxus-suite{background-image:linear-gradient(rgba(171,181,165,.10),rgba(171,181,165,.10)),url("assets/luxus-suite.jpg")}
.photo--luxe-loft{background-image:linear-gradient(rgba(171,181,165,.10),rgba(171,181,165,.10)),url("assets/luxe-loft.jpg")}
.photo--f61{background-image:linear-gradient(rgba(171,181,165,.10),rgba(171,181,165,.10)),url("assets/f61.jpg")}

.locations{
  background:var(--oya-olive);
  color:#fff;
  padding:110px 0;
}
.section-head--light .english{color:rgba(255,255,255,.65)}
.location-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid rgba(255,255,255,.22);
}
.location-grid article{
  min-height:310px;
  padding:30px 32px 20px 0;
  border-right:1px solid rgba(255,255,255,.22);
}
.location-grid article+article{padding-left:32px}
.location-grid article:last-child{border-right:0}
.location-grid span{
  font-size:11px;
  letter-spacing:.12em;
  color:rgba(255,255,255,.62);
}
.location-grid h3{
  margin:82px 0 14px;
  font-size:31px;
  font-weight:300;
}
.location-grid p{color:rgba(255,255,255,.78)}

.details{
  padding:110px 0;
  background:var(--oya-sage);
}
.details__grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:90px;
}
.details__list{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-top:1px solid var(--oya-line);
}
.details__list>div{
  min-height:210px;
  padding:26px 28px 26px 0;
  border-bottom:1px solid var(--oya-line);
}
.details__list>div:nth-child(even){
  padding-left:28px;
  border-left:1px solid var(--oya-line);
}
.details__list span{
  font-size:11px;
  letter-spacing:.1em;
  color:var(--oya-grey);
}
.details__list h3{
  margin:50px 0 10px;
  font-size:17px;
  letter-spacing:.07em;
}
.details__list p{margin:0;color:var(--oya-grey)}

.faq{padding:110px 0;background:var(--oya-tile)}
.faq__grid{
  display:grid;
  grid-template-columns:.65fr 1.35fr;
  gap:90px;
}
.faq__list{border-top:1px solid var(--oya-line)}
details{border-bottom:1px solid var(--oya-line)}
summary{
  cursor:pointer;
  list-style:none;
  padding:25px 0;
  font-size:18px;
  font-weight:400;
}
summary::-webkit-details-marker{display:none}
details p{max-width:700px;margin:-5px 0 28px;color:var(--oya-grey)}

.booking{
  background:var(--oya-olive);
  color:#fff;
  padding:90px 0;
}
.booking__inner{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:50px;
}
.booking h2{margin:0}
.booking__action{text-align:right}
.booking__action .english{color:rgba(255,255,255,.68);margin-bottom:16px}

.footer{
  background:var(--oya-sage);
  padding:70px 0 28px;
}
.footer__grid{
  display:grid;
  grid-template-columns:1.5fr .8fr .8fr 1fr;
  gap:50px;
}
.footer__logo{width:120px;margin-bottom:22px}
.footer__grid h3{
  margin:0 0 18px;
  font-size:11px;
  font-weight:400;
  letter-spacing:.12em;
}
.footer__grid a{
  display:block;
  margin:8px 0;
  font-size:14px;
}
.footer__grid p{
  font-size:11px;
  letter-spacing:.12em;
}
.footer__bottom{
  margin-top:60px;
  padding-top:20px;
  border-top:1px solid var(--oya-line);
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:11px;
  color:var(--oya-grey);
}

@media (max-width:960px){
  .header__inner{grid-template-columns:150px 1fr auto auto}
  .header__cta{display:none}
  .lang-switch{grid-column:3;grid-row:1}
  .nav-toggle{display:block;justify-self:end;grid-column:4;grid-row:1}
  .nav{
    display:none;
    position:absolute;top:82px;left:0;right:0;
    background:var(--oya-tile);
    flex-direction:column;align-items:stretch;gap:0;
    padding:0 24px 18px;
    border-bottom:1px solid var(--oya-line);
  }
  .nav.open{display:flex}
  .nav a{padding:16px 0;border-top:1px solid var(--oya-line)}
  .nav a:after{display:none}
  .hero__grid{min-height:640px;grid-template-columns:1fr .75fr;gap:20px}
  .statement__grid,.details__grid,.faq__grid{grid-template-columns:1fr;gap:45px}
  .statement__text{padding-top:0}
  .apartment-grid{grid-template-columns:repeat(2,1fr)}
  .location-grid{grid-template-columns:1fr}
  .location-grid article,.location-grid article+article{
    min-height:auto;padding:28px 0 35px;border-right:0;border-bottom:1px solid rgba(255,255,255,.22)
  }
  .location-grid h3{margin:36px 0 12px}
  .footer__grid{grid-template-columns:1fr 1fr}
}

@media (max-width:680px){
  .wrap{width:min(calc(100% - 30px),var(--max))}
  .header__inner{min-height:70px}
  .header__brand img{width:112px}
  .nav{top:70px}
  .hero__grid{
    min-height:0;
    grid-template-columns:1fr;
    padding:72px 0 55px;
  }
  .hero__copy{padding:0}
  .hero__art{margin-top:25px}
  .hero__art img{width:88%}
  h1{font-size:58px}
  h2{font-size:39px}
  .hero__lead{font-size:17px}
  .statement,.apartments,.locations,.details,.faq{padding:76px 0}
  .statement__grid{gap:35px}
  .section-head{display:block;margin-bottom:34px}
  .section-head__aside{margin-top:14px}
  .apartment-grid{grid-template-columns:1fr}
  .apartment-card a{
    display:grid;
    grid-template-columns:42% 58%;
  }
  .apartment-card__image{aspect-ratio:auto;min-height:205px}
  .apartment-card__content{padding:21px 18px}
  .apartment-card h3{font-size:22px}
  .apartment-card__content>p:not(.location){min-height:0;font-size:14px}
  .details__list{grid-template-columns:1fr}
  .details__list>div,.details__list>div:nth-child(even){
    padding:24px 0;border-left:0;
  }
  .details__list h3{margin:30px 0 8px}
  .booking__inner{display:block}
  .booking__action{text-align:left;margin-top:35px}
  .footer__grid{grid-template-columns:1fr 1fr;gap:35px 25px}
  .footer__bottom{flex-direction:column}
}

@media (max-width:680px){
  .lang-switch{gap:6px;font-size:10px}
}

/* Guesty Booking Engine search bar */
.guesty-search-wrap{
  position:relative;
  z-index:10;
  background:var(--oya-tile);
  border-bottom:1px solid rgba(64,67,61,.10);
  padding:24px 0 28px;
}
.guesty-search-wrap .wrap{
  min-width:0;
}
.guesty-search-wrap #search-widget_IO312PWQ{
  width:100%;
  min-height:64px;
}
@media (max-width:680px){
  .guesty-search-wrap{
    padding:18px 0 22px;
  }
}