:root{
  --green-dark:#004515;
  --green:#006b25;
  --blue:#06195a;
  --white:#ffffff;
  --page-bg:#f7f2e7;
}

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html{
  width:100%;
  min-height:100%;
  scroll-behavior:smooth;
}

body{
  min-height:100vh;
  font-family:'Inter', Arial, Helvetica, sans-serif;
  background:var(--page-bg);
  color:var(--blue);
  overflow-x:hidden;
}

.construction-page{
  width:100%;
  min-height:100vh;
  display:flex;
  justify-content:center;
  align-items:flex-start;
  background:var(--page-bg);
}

.reference-layout{
  position:relative;
  width:100%;
  max-width:1086px;
  margin:0 auto;
  line-height:0;
  background:#fff;
  box-shadow:0 18px 50px rgba(0,0,0,.10);
}

.reference-image{
  display:block;
  width:100%;
  height:auto;
  max-width:1086px;
  object-fit:contain;
  user-select:none;
  -webkit-user-drag:none;
}

.seo-content{
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;
}

@media (min-width:1087px){
  body{
    background:linear-gradient(180deg,#f8f3e8 0%,#fff 48%,#f8f3e8 100%);
  }

  .reference-layout{
    min-height:1448px;
  }
}

@media (max-width:767px){
  .construction-page{
    align-items:flex-start;
  }

  .reference-layout{
    width:100%;
    max-width:none;
    box-shadow:none;
  }

  .reference-image{
    width:100%;
    max-width:none;
  }
}