/* American cocktail lounge, 1970s */
@import url('https://fonts.googleapis.com/css2?family=Russo+One&family=Yeseva+One&display=swap');
:root{--bg:#382219;--paper:#f5e5c5;--yellow:#eeb24f;--muted:#d3b99b;--rust:#a43c20;--orange:#cb622d}
body{background:var(--paper);color:var(--bg)}
header{height:106px;margin:0 5%;padding:0;border-bottom:4px double #8e6042}
.logo{font-family:'Yeseva One',Georgia,serif;font-weight:400;font-size:58px;letter-spacing:-5px;color:var(--rust)}
.logo span{color:var(--rust);font-size:26px;margin-top:5px}
nav{font-weight:600;font-size:14px}
nav a:hover,.text-link:hover{color:var(--rust)}
.header-book{border:2px solid var(--bg);border-radius:40px;font-weight:600}
.hero{min-height:730px;grid-template-columns:1.15fr 1fr;padding:48px 6% 62px;gap:5%;position:relative;border-bottom:9px solid var(--rust);box-shadow:0 8px 0 var(--orange),0 16px 0 var(--yellow);margin-bottom:16px}
.hero-copy{padding:14px 0 0}
.eyebrow{font-size:12px;letter-spacing:2px;font-weight:700}
.hero .eyebrow{color:#805239;border-top:1px solid #b4936c;border-bottom:1px solid #b4936c;padding:12px 0;margin-bottom:27px}
h1{font-family:'Yeseva One',Georgia,serif;font-size:clamp(60px,6.4vw,98px);font-weight:400;letter-spacing:-.06em;line-height:1.04;color:var(--rust);text-shadow:2px 3px 0 #e8c994;margin-bottom:24px}
h1 em{color:var(--bg)}
.intro{color:#6a4732;font-size:18px;line-height:1.7}
.button{background:var(--rust);color:var(--paper);border:2px solid var(--bg);border-radius:40px;box-shadow:4px 5px 0 var(--bg);padding:17px 25px}
.button:hover{transform:translate(-1px,-2px)}
.text-link{font-weight:600}
.hero-bottom{color:#805239;font-size:12px;letter-spacing:1px;padding-top:32px}
.hero-bottom span:last-child{max-width:150px;text-align:right;line-height:1.5}
.hero-photo{min-height:610px;border-radius:240px 240px 18px 18px;border:8px solid var(--bg);outline:2px solid #b67541;outline-offset:7px;box-shadow:14px 15px 0 #dfc59a;overflow:visible;background:var(--bg)}
.hero-photo>img{border-radius:230px 230px 10px 10px;object-position:50% 52%;filter:sepia(.2) saturate(.85)}
.photo-label{top:48px;left:20px;right:20px;flex-direction:column;align-items:center;color:var(--paper);text-shadow:0 2px 5px #000}
.photo-label>span:first-child{font-family:'Yeseva One',Georgia,serif;font-size:82px;letter-spacing:-5px;font-weight:400}
.photo-label>span:last-child{display:block;font-size:12px;text-align:center;letter-spacing:3px;line-height:1.6;margin-top:10px}
.roundel{bottom:25px;right:-28px;background:var(--yellow);border:4px double var(--bg);outline:5px solid var(--yellow);color:var(--bg);width:128px;height:128px;transform:rotate(9deg)}
.ticker{background:var(--bg);color:var(--paper);border:0;padding:22px 0;font-family:'Yeseva One',Georgia,serif;font-size:20px;letter-spacing:1px;word-spacing:25px}
.section{padding:85px 7%}
h2{font-family:'Yeseva One',Georgia,serif;font-size:clamp(35px,4.1vw,62px);font-weight:400;letter-spacing:-.045em;line-height:1.13}
h2 span{color:var(--rust)}
.about{background:#eab353;color:var(--bg);grid-template-columns:1fr 2.4fr;border-bottom:3px solid var(--bg)}
.about-text{color:#593820;font-size:17px}
.tags span{border:1px solid #8b5b2c;border-radius:0;padding:10px 14px;font-size:14px}
.menu{margin:45px 5%;padding:55px 5%;border:7px double #936139;border-radius:140px 140px 12px 12px;background:#faedd5;box-shadow:0 10px 0 #dec7a4}
.menu .section-top{padding:20px 0 0}
.menu h2{color:var(--rust)}
.section-top>p,.menu-foot p{color:#70503b}
.menu-tabs button{border:2px solid #b38d61;font-weight:600;border-radius:6px}
.menu-tabs button[aria-selected=true]{background:var(--rust);border-color:var(--rust);color:var(--paper)}
.menu-list>div{border-bottom:1px dashed #af8e63;padding:26px 0}
.menu-list h3{font-family:'Yeseva One',Georgia,serif;font-weight:400;font-size:27px;letter-spacing:-.4px}
.menu-list span{color:#725238}
.music{background:var(--rust);color:var(--paper);border-top:12px solid #cb622d;border-bottom:12px solid #cb622d;margin-top:55px;position:relative}
.music .eyebrow{color:#f3c481}
.music h2{font-size:clamp(39px,4.5vw,69px)}
.music h2 em{color:#f3bd68}
.music-heading{grid-template-columns:1.7fr 1fr}
.music-heading p{color:#f5dfc2}
.dark{background:var(--paper);color:var(--rust);border-color:#48251b;box-shadow:4px 5px 0 #48251b}
.music-footer{border-color:#d99368;color:#f2c899;letter-spacing:2px}
.visit{background:var(--bg);color:var(--paper);border-top:7px solid #eab353}
.visit h2{color:var(--yellow)}
.visit h3{font-family:'Yeseva One',Georgia,serif;font-size:32px;font-weight:400}
.visit .text-link:hover{color:var(--yellow)}
.contact a{color:var(--yellow)}
footer{background:var(--bg);margin:0;padding:35px 7%;border-color:#805739}
footer .logo,footer .logo span{color:var(--yellow)}
footer>span{color:var(--muted)}
a:focus-visible,button:focus-visible{outline:3px solid #147a88;outline-offset:6px}
@media(max-width:1000px){.hero{gap:4%;padding-left:5%;padding-right:5%}h1{font-size:67px}.hero-photo{min-height:590px}.hero-bottom span:last-child{display:none}.actions{flex-direction:column;align-items:start;gap:22px}.music-heading{gap:35px}}
@media(max-width:800px){header{height:92px}.hero{padding-top:35px;min-height:640px}h1{font-size:57px}.hero-photo{min-height:540px}.photo-label>span:first-child{font-size:62px}.hero .eyebrow{font-size:11px}.about{grid-template-columns:1fr}.menu{border-radius:80px 80px 12px 12px}.section{padding:60px 6%}.menu{padding:45px 6%}.music-heading{grid-template-columns:1fr 1fr}.roundel{width:110px;height:110px;right:-15px}.intro{font-size:16px}}
@media(max-width:560px){header{margin:0 6%;padding:0;height:90px}.logo{font-size:46px}.logo span{font-size:21px;margin-left:7px}nav{font-size:13px;gap:17px}.hero{grid-template-columns:1fr;padding:25px 7% 45px;gap:38px}.hero-copy{padding:0}h1{font-size:clamp(56px,13.5vw,76px)}.hero .eyebrow{font-size:11px;letter-spacing:1.4px}.actions{flex-direction:row;align-items:center;gap:20px}.hero-photo{min-height:460px;margin:0 10px;border-width:6px;border-radius:180px 180px 12px 12px;outline-offset:5px;box-shadow:9px 10px 0 #dfc59a}.hero-photo>img{border-radius:172px 172px 7px 7px}.hero-photo .photo-label{top:28px;left:15px;right:15px}.photo-label>span:first-child{font-size:64px}.roundel{bottom:20px;right:-14px}.hero-bottom{padding-top:25px}.intro{font-size:17px}.section{padding:50px 7%}h2{font-size:38px}.about-text{font-size:16px}.menu{margin:28px 4%;padding:36px 7%;border-radius:65px 65px 10px 10px;border-width:6px}.menu .section-top{padding-top:10px}.menu h2{font-size:34px}.menu-list h3{font-size:23px}.menu-list>div{padding:22px 0}.music{margin-top:30px}.music-heading{grid-template-columns:1fr;gap:20px}.music h2{font-size:40px}.visit h3{font-size:29px}.button{padding:16px 19px}.ticker{font-size:16px}footer{padding:30px 7%}footer>span{font-size:11px}.hero-bottom span:last-child{display:block;font-size:10px}.music-footer{font-size:11px}}
@media(max-width:360px){nav{gap:11px;font-size:12px}h1{font-size:53px}.button{font-size:13px;padding:15px}.actions{gap:15px}.menu h2{font-size:30px}}
