*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden}
body{background:#0b3551;color:#fff}

.hero{
  position:relative;
  width:100vw;
  height:100vh;
  height:100dvh;
  min-height:520px;
  overflow:hidden;
  background:url("hero.jpg") center center/cover no-repeat;
}

/* NO frosted panels, NO backdrop filters, NO translucent boxes */
.lamore{
  position:absolute;
  z-index:2;
  top:4.5vh;
  left:4.2vw;
  right:4.2vw;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-family:"Arial Narrow","Helvetica Neue Condensed","Roboto Condensed",Impact,sans-serif;
  font-stretch:condensed;
  font-size:clamp(78px,12.2vw,198px);
  font-weight:700;
  line-height:.82;
  color:#fff;
  background:none;
  text-shadow:none;
}

.copy{
  position:absolute;
  z-index:3;
  left:50%;
  top:65%;
  transform:translate(-50%,-50%);
  width:min(900px,88vw);
  text-align:center;
  background:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  box-shadow:none;
}

h1{
  margin:0 0 22px;
  font-family:"Arial Narrow","Helvetica Neue Condensed","Roboto Condensed",Impact,sans-serif;
  font-stretch:condensed;
  font-size:clamp(44px,4.8vw,76px);
  font-weight:400;
  letter-spacing:.055em;
  line-height:1;
  color:#fff;
  background:none;
}

p{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(18px,1.6vw,26px);
  line-height:1.42;
  font-weight:400;
  color:#fff;
  background:none;
  text-shadow:0 1px 8px rgba(0,0,0,.18);
}

.rule{
  width:68px;
  height:1px;
  background:#fff;
  margin:44px auto 24px;
}

.instagram{
  display:inline-block;
  position:relative;
  z-index:20;
  color:#fff;
  background:none;
  text-decoration:none;
  padding:15px 18px;
  font-family:"Helvetica Neue",Arial,sans-serif;
  font-size:clamp(11px,.95vw,15px);
  font-weight:600;
  letter-spacing:.17em;
  cursor:pointer;
  border:1px solid transparent;
  -webkit-tap-highlight-color:rgba(255,255,255,.15);
}
.instagram i{font-style:normal;margin:0 12px}
.instagram b{font-weight:400}
.instagram:hover,.instagram:focus-visible{border-color:rgba(255,255,255,.8);outline:none}

@media(max-width:700px){
  .hero{background-position:58% center}
  .lamore{
    top:4vh;
    left:5vw;
    right:5vw;
    font-size:clamp(42px,13.4vw,66px);
    font-weight:700;
  }
  .copy{top:64%;width:90vw}
  h1{font-size:clamp(32px,8.8vw,44px);margin-bottom:17px;letter-spacing:.045em}
  p{font-size:clamp(15px,4.1vw,18px);line-height:1.38}
  .desktop{display:none}
  .rule{width:46px;margin:30px auto 16px}
  .instagram{font-size:clamp(9.5px,2.9vw,12px);letter-spacing:.10em;padding:16px 7px}
  .instagram i{margin:0 5px}
}
@media(max-height:650px) and (max-width:700px){
  .copy{top:61%}
  .rule{margin:19px auto 9px}
}
/* FINAL: text floats directly over photo; absolutely no frosted panels */
.lamore,.copy,h1,p,.rule,.instagram{
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  box-shadow:none !important;
}
.lamore,.copy,h1,p,.instagram{background:transparent !important;}
