/*
  The Bar Ellington room. Master brand only, from the media kit:
  near black room, Sign Gold voice, cream text, Poiret One display,
  Cormorant Garamond body. Every selector is scoped with the be prefix.
  Poiret One is never bold and never tracked under .14em.
*/
@font-face{font-family:"Poiret One";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/poiret-one-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/cormorant-garamond-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/cormorant-garamond-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url("fonts/cormorant-garamond-latin-500-italic.woff2") format("woff2")}

.be-room{
  --be-gold:#C9A84C;--be-deep-gold:#8A7333;--be-cream:#F3EAD2;--be-muted:#B8A97E;
  --be-black:#0C0A08;--be-brown-1:#1B160C;--be-brown-2:#2A2110;--be-brown-3:#3A2F18;
  --be-display:"Poiret One","Avenir Next","Helvetica Neue",Arial,sans-serif;
  --be-body:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  background:var(--be-black);
}
.be-room *,.be-room *::before,.be-room *::after{box-sizing:border-box}
.be-room body{margin:0;background:var(--be-black);color:var(--be-cream);font-family:var(--be-body);font-weight:400;font-size:20px;line-height:1.5;-webkit-font-smoothing:antialiased}
:where(.be-room) :where(h1,h2,h3,p,ul,figure){margin:0}
:where(.be-room) ul{padding:0;list-style:none}
.be-room img{display:block;max-width:100%;height:auto}
.be-room :focus-visible{outline:2px solid var(--be-gold);outline-offset:4px}
.be-skip{position:absolute;left:16px;top:-80px;z-index:10;background:var(--be-gold);color:var(--be-black);padding:12px 18px;font-family:var(--be-display);letter-spacing:.14em;text-transform:uppercase;font-size:14px;text-decoration:none}
.be-skip:focus{top:16px}

.be-wrap{max-width:1120px;margin:0 auto;padding:0 24px}

/* The stage set: the Deco sunburst, drawn in code, as the kit draws it. */
.be-hero{display:flex;align-items:center;justify-content:center;min-height:88vh;padding:56px 20px;text-align:center;
  background:
   repeating-conic-gradient(from 262deg at 50% -12%, rgba(214,178,94,.13) 0deg 3.5deg, rgba(10,10,11,0) 3.5deg 11deg),
   radial-gradient(ellipse 130% 70% at 50% -10%, #26200f 0%, #121006 46%, #0c0a08 78%)}
/* Content sits on the scrim, never raw on the scene. */
.be-scrim{width:min(680px,100%);padding:44px 24px 40px;background:rgba(12,10,8,.78);border:1px solid var(--be-brown-3)}
.be-mark{width:132px;height:132px;margin:0 auto 20px}
.be-room h1{font-family:var(--be-display);font-weight:400;font-size:34px;line-height:1.15;letter-spacing:.22em;text-indent:.22em;text-transform:uppercase;color:var(--be-gold)}
.be-line{font-style:italic;font-weight:500;font-size:24px;color:var(--be-muted);margin-top:12px}
.be-status{font-family:var(--be-display);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--be-cream);margin-top:30px;padding-top:22px;border-top:1px solid var(--be-brown-3)}
.be-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:22px}
.be-btn{display:inline-block;padding:15px 28px;border:1px solid var(--be-gold);background:var(--be-gold);color:var(--be-black);font-family:var(--be-display);font-size:15px;letter-spacing:.18em;text-indent:.18em;text-transform:uppercase;text-decoration:none}
.be-btn:hover{background:var(--be-cream);border-color:var(--be-cream)}

.be-section{padding:72px 0;border-top:1px solid var(--be-brown-2)}
.be-kicker{font-family:var(--be-display);font-size:13px;letter-spacing:.24em;text-transform:uppercase;color:var(--be-muted)}
.be-room h2{font-family:var(--be-display);font-weight:400;font-size:26px;line-height:1.25;letter-spacing:.16em;text-transform:uppercase;color:var(--be-gold);margin:12px 0 34px}

.be-photos{display:grid;gap:22px}
.be-photos figure{background:var(--be-brown-1);border:1px solid var(--be-brown-3)}
.be-photos img{width:100%}
.be-photos figcaption{padding:14px 16px 16px;font-family:var(--be-display);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--be-cream)}

.be-things{display:grid;gap:0;border-bottom:1px solid var(--be-brown-3)}
.be-things li{padding:24px 0;border-top:1px solid var(--be-brown-3)}
.be-things h3{font-family:var(--be-display);font-weight:400;font-size:18px;letter-spacing:.16em;text-transform:uppercase;color:var(--be-gold)}
.be-things p{margin-top:8px;color:var(--be-cream);max-width:26em}

@media (min-width:768px){
  .be-wrap{padding:0 40px}
  .be-scrim{padding:60px 48px 54px}
  .be-mark{width:168px;height:168px}
  .be-room h1{font-size:54px}
  .be-line{font-size:28px}
  .be-section{padding:104px 0}
  .be-room h2{font-size:34px}
  .be-photos{grid-template-columns:repeat(3,1fr)}
  .be-things{grid-template-columns:1fr 1fr;column-gap:56px}
}
@media (min-width:1200px){
  .be-room h1{font-size:64px}
  .be-things{grid-template-columns:repeat(4,1fr);column-gap:40px}
}
