/* Layout of the supplied Efsane reference. All labels and controls remain HTML. */
@font-face{font-family:EfsaneNarrow;src:url('../assets/navigation.ttf') format('truetype');font-weight:200 700;font-display:swap}
.header .nav-wrap{width:auto;margin-inline:4.1vw 3.3vw;max-width:none;min-height:130px;gap:5.6vw;padding-top:10px;align-items:flex-start}
.header .brand{display:block;width:20.64vw;max-width:340px;min-width:175px;flex-shrink:0;mix-blend-mode:screen}
.brand-mark{display:block;width:100%;height:auto;aspect-ratio:317/112}
.header nav{margin:23px 0 0;gap:2vw;font-family:EfsaneNarrow,'Arial Narrow',sans-serif;font-size:clamp(16px,1.33vw,25px);font-weight:300;letter-spacing:.45px;line-height:1.5}
.header nav a{padding:9px 0}
.header nav a[aria-current]:after{display:none}
.header nav a:hover,.header nav a[aria-current]{opacity:1;text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:1px}.header nav a[aria-current]{color:var(--warm)}
.header .nav-order{margin:20px 0 0 auto;gap:14px;padding:7px 15px;min-height:40px;font:400 clamp(14px,1.04vw,18px)/1.5 EfsaneNarrow,'Arial Narrow',sans-serif;letter-spacing:.2px;display:inline-flex;background:#b74e32;color:#fff}
.header .nav-order:hover{background:#963d27}
.nav-order span{font:20px/1 Arial,sans-serif}
.reference-page .header{position:absolute;inset:0 0 auto;width:100%;background:transparent;border:0}
.reference-page .hero{display:block;position:relative;isolation:isolate;padding:0;gap:0;height:40.625vw;min-height:390px;max-height:860px;overflow:hidden;background:radial-gradient(ellipse at 70% 45%,#704826 0,#3d291d 34%,#281b14 70%,#1d140f 100%)}
.reference-page .hero-copy{width:43%;max-width:680px;padding:10.95vw 0 0 4.1vw;z-index:2;position:relative}
.reference-page .hero h1{font-size:7.3vw;line-height:.975;letter-spacing:-.4px;font-weight:400;margin:0 0 .5vw;transform:scaleX(.92);transform-origin:left top;width:110%;white-space:nowrap}
.reference-page .hero h1>span{transform-origin:left center}
.reference-page .hero h1>span:first-child{transform:scaleX(1.03)}
.reference-page .hero h1>span:nth-child(2){transform:scaleX(.985)}
.reference-page .hero h1>span:nth-child(3){transform:scaleX(1.029)}
.reference-page .hero h1{mask-image:url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22190%22%20height%3D%22190%22%20viewBox%3D%220%200%20190%20190%22%3E%3Cfilter%20id%3D%22grain%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22100%25%22%20height%3D%22100%25%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%22.65%22%20numOctaves%3D%223%22%20seed%3D%2212%22%2F%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%201%200%200%200%200%201%200%200%200%200%201%201%200%200%200%200%22%2F%3E%3CfeComponentTransfer%3E%3CfeFuncA%20type%3D%22discrete%22%20tableValues%3D%22.94%20.97%20.995%201%201%201%201%201%22%2F%3E%3C%2FfeComponentTransfer%3E%3C%2Ffilter%3E%3Crect%20width%3D%22190%22%20height%3D%22190%22%20fill%3D%22white%22%20filter%3D%22url(%23grain)%22%2F%3E%3C%2Fsvg%3E');mask-repeat:repeat;mask-size:190px 190px}
.reference-page .hero h1>span:last-child{word-spacing:10px}
.reference-page .hero-description{font:400 clamp(13px,1.63vw,28px)/1.5 Arial,Helvetica,sans-serif;letter-spacing:.36vw;max-width:none;white-space:nowrap}
.reference-page .hero .button-row{margin-top:.75vw;gap:1.8vw;flex-wrap:nowrap}
.reference-page .hero .button{min-height:3.3vw;padding:.38vw 2.05vw;font:300 clamp(14px,1.32vw,23px)/1.6 EfsaneNarrow,'Arial Narrow',sans-serif;letter-spacing:.6px;gap:13px;justify-content:center}
.reference-page .hero .primary{font-weight:400}
.reference-page .hero .primary{min-width:12.35vw}
.reference-page .hero .secondary{min-width:13.35vw;border-color:#ddd}
.reference-page .hero .button span{font:23px/1 Arial,sans-serif}
.reference-page .hero-visual{position:absolute;left:26%;right:0;top:0;width:74%;height:100%;min-height:0;max-width:none;aspect-ratio:auto;background:transparent;z-index:0;overflow:hidden;mix-blend-mode:normal}
.reference-page .hero-scene{inset:auto 0 auto;top:-1.3vw;width:100%;height:46vw}
.reference-page .steam{opacity:.12;top:1%;right:24%;height:50%}
.reference-page .motion-toggle{bottom:8px;right:12px;min-height:28px;padding:4px 7px;background:rgba(40,27,20,.88);border-color:#735235;color:#e5c99f;font:11px/1.4 Arial,sans-serif}
.reference-page .ribbon{border:0}
.reference-page .ribbon .wrap{width:calc(100% - 6.9vw);max-width:none;min-height:3.125vw;display:flex;gap:1.6vw;padding:0;font:400 clamp(10px,.88vw,16px)/1.4 EfsaneNarrow,'Arial Narrow',sans-serif;letter-spacing:.23vw;white-space:nowrap;justify-content:center}
.reference-page .ribbon .wrap:before,.reference-page .ribbon .wrap:after{content:'';display:block;height:1px;background:var(--warm);flex:1}
.reference-page .reference-classics{width:calc(100% - 6.9vw);max-width:none;padding:1vw 0 1.15vw}
.reference-page .classics-heading{display:block;margin:0 0 .48vw;padding-left:.7vw}
.reference-page .classics-heading .eyebrow{margin:0;font:400 clamp(10px,.86vw,16px)/1.2 EfsaneNarrow,'Arial Narrow',sans-serif;letter-spacing:.24vw;color:#b74e32}
.reference-page .food-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:1.2vw}
.reference-page .food-card{position:relative;display:flex;flex-direction:column;height:auto;min-height:0}
.reference-page .food-card+.food-card{border:0;padding-left:0}
.reference-page .food-card+.food-card:before{content:'';position:absolute;left:-.6vw;top:.7vw;bottom:1.4vw;width:1px;background:#d6c4ae}
.reference-page .food-image{position:relative;display:block;width:100%;height:auto;aspect-ratio:1;background:transparent;overflow:hidden;order:1}
.reference-page .food-image .reference-food{display:none}
.reference-page .food-image[data-food]{background-image:url('../assets/food-cutouts-color-v2.png');background-size:300% auto;background-repeat:no-repeat}
.reference-page .food-image[data-food="kebap"]{background-size:300% auto;background-position:0% center}
.reference-page .food-image[data-food="pizza"]{background-size:300% auto;background-position:50% center}
.reference-page .food-image[data-food="durum"]{background-size:300% auto;background-position:100% center}
.reference-page .food-image[data-food="burger"]{background-image:url('../assets/food-burger-color-v1.png');background-size:94% auto;background-position:center;background-repeat:no-repeat}
.reference-food{display:block;width:100%;height:100%;transition:opacity .2s}
.reference-page .food-card-title{position:relative;top:auto;left:auto;display:block;z-index:2;order:0;margin:0 0 .35vw}
.reference-page .food-card-title h3{font:700 clamp(32px,3.2vw,52px)/1.05 'Times New Roman',Times,serif;letter-spacing:-.08vw;color:#39291e}
.reference-page .food-card:hover .food-image{opacity:.86}
.reference-page .food-card:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.reference-page .classics-location{margin-top:-.45vw;min-height:2.5vw;gap:2.7vw;font:400 clamp(11px,.97vw,17px)/1.4 EfsaneNarrow,'Arial Narrow',sans-serif;letter-spacing:.19vw}
.reference-page .classics-location:before,.reference-page .classics-location:after{background:var(--warm)}
.reference-page .classics-location a{min-height:32px;gap:14px;white-space:nowrap}
.location-pin{width:20px;height:25px;flex-shrink:0}
.footer-brand{width:215px;max-width:100%;mix-blend-mode:screen}
.footer-brand .brand-mark{width:100%;height:auto}
@media(min-width:1800px){
 .reference-page .hero-copy{padding-top:190px;padding-left:74px}.reference-page .hero h1{font-size:131px}.reference-page .hero-description{font-size:29px}
}
@media(min-width:741px) and (max-width:1100px){
 .header .nav-wrap{min-height:100px;gap:4vw}.header .brand{min-width:0;width:23vw}.header nav{gap:2vw;margin-top:14px}.header .nav-order{margin-top:17px;padding:5px 11px;min-height:34px}
 .reference-page .hero .button{min-height:34px;padding:5px 13px}.reference-page .hero .button-row{gap:15px;margin-top:10px}
 .reference-page .hero-copy{width:48%}.reference-page .hero-description{letter-spacing:.26vw}
 .reference-page .ribbon .wrap{min-height:39px;letter-spacing:1.7px}.reference-page .reference-classics{padding-top:16px;padding-bottom:20px}
 .reference-page .classics-heading{margin-bottom:9px}.reference-page .classics-heading .eyebrow{letter-spacing:2px}
 .reference-page .classics-location{min-height:42px;letter-spacing:1.5px}
}
@media(max-width:740px){
 .header .nav-wrap{width:calc(100% - 40px);margin-inline:auto;padding-block:8px;min-height:91px;gap:12px;align-items:center}
 .header .brand{width:210px;min-width:0;max-width:calc(100% - 106px)}.header .nav-order{display:none}
 .header .nav-toggle{font:400 16px/1.5 EfsaneNarrow,'Arial Narrow',sans-serif;min-height:44px;padding:8px 13px;border-color:#888;letter-spacing:.5px}
 .header nav{margin:0;padding:14px 20px 20px;gap:0;font-family:EfsaneNarrow,'Arial Narrow',sans-serif}
 .header nav a{font-size:20px;padding:12px 10px}
.reference-page .header{position:sticky;background:#281b14;border-bottom:1px solid #4b3526;inset:auto;top:0}
 .reference-page .hero{display:flex;flex-direction:column;height:auto;min-height:0;max-height:none;padding:0}
 .reference-page .hero-copy{width:100%;max-width:none;padding:27px 20px 14px}
 .reference-page .hero h1{font-size:clamp(48px,15vw,100px);line-height:.99;width:108%;margin-bottom:15px;letter-spacing:0;transform:scaleX(.94)}
 .reference-page .hero h1>span:last-child{word-spacing:4px}
 .reference-page .hero-description{font-size:clamp(13px,4vw,22px);letter-spacing:.55vw;line-height:1.5}
 .reference-page .hero .button-row{gap:13px;margin-top:18px;flex-wrap:wrap}
 .reference-page .hero .button{font-size:16px;min-height:48px;max-width:none;flex:1 1 135px;padding:8px 13px;gap:13px;justify-content:space-between;letter-spacing:.5px}
 .reference-page .hero .button span{font-size:22px}
 .reference-page .hero-visual{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1.22;max-width:620px;align-self:center}
 .reference-page .hero-scene{inset:0;width:100%;height:100%}
 .reference-page .motion-toggle{right:10px;bottom:10px;min-height:44px;padding:8px 10px;font-size:11px}
 .reference-page .ribbon .wrap{width:calc(100% - 32px);min-height:55px;gap:10px;font-size:10px;letter-spacing:1.1px;display:flex;padding:0}
 .reference-page .ribbon .wrap span{white-space:normal;text-align:center;max-width:260px;line-height:1.7}
 .reference-page .ribbon .wrap:before,.reference-page .ribbon .wrap:after{min-width:15px}
 .reference-page .reference-classics{width:calc(100% - 40px);padding:22px 0 30px}
 .reference-page .classics-heading{padding:0;margin-bottom:21px}.reference-page .classics-heading .eyebrow{font-size:12px;letter-spacing:3px}
 .reference-page .food-grid{grid-template-columns:1fr;gap:24px}
 .reference-page .food-card{display:flex;height:auto;aspect-ratio:auto;min-height:0;max-width:470px;width:100%;justify-self:center}
 .reference-page .food-card+.food-card{border:0;border-top:1px solid #d4c2ad;padding:18px 0 0;aspect-ratio:auto}
 .reference-page .food-card+.food-card:before{display:none}
 .reference-page .food-card-title,.reference-page .food-card+.food-card .food-card-title{position:relative;top:auto;left:auto;margin:0 0 8px}
 .reference-page .food-card-title h3{font-size:clamp(34px,9vw,54px);letter-spacing:-1px}
 .reference-page .classics-location{margin-top:22px;gap:12px;min-height:38px;font-size:11px;letter-spacing:1px}
 .reference-page .classics-location a{gap:8px;white-space:normal}.location-pin{width:16px;height:21px}
}