/* The presenter stays familiar while each restaurant has its own visual voice. */
.style-control{display:flex;align-items:center;gap:10px;white-space:nowrap;font:700 12px/1.3 'DM Sans',DM,Arial,sans-serif}.style-control select{font:700 14px 'DM Sans',DM,Arial,sans-serif;border:1px solid #ffffff55;border-radius:5px;min-height:42px;padding:8px 32px 8px 12px;color:#fff8e9;background:#373930;cursor:pointer;max-width:190px}.style-control select:focus-visible{outline:3px solid #efc56c;outline-offset:3px}.demo-toolbar{gap:18px}.demo-label{margin-right:6px}.demo-label strong{font-size:13px}.owner-link{margin-left:auto}.owner-style{justify-content:flex-end;margin:0 0 20px;color:#5e675a}.owner-style select{width:auto;color:#29342d;background:#fffdf7;border-color:#d5d5c5}.owner-category-number{font:700 23px Georgia,serif;width:38px;text-align:center;opacity:.6}html[data-restaurant]:not([data-restaurant=mexican]) .owner-header .brand>span{font:700 27px Georgia,serif;border:1px solid currentColor;border-radius:50%;padding:5px 11px}
.section-number{font:700 150px/1 var(--display);color:var(--section-accent);opacity:.12;align-self:flex-end;letter-spacing:-.1em}.category-number{font:700 20px/1 var(--display);opacity:.8}.dialog-category-mark{font:700 32px var(--display);padding:25px;text-align:center}.signature-rail:has(>.signature-card:nth-child(2):last-child){grid-template-columns:1fr 1fr}.signature-rail:has(>.signature-card:only-child){grid-template-columns:minmax(0,560px);justify-content:center}
html[data-restaurant]:not([data-restaurant=mexican]) #restaurant-site .brand-mark{font:700 29px/1 Georgia,serif;width:48px;height:48px;border:1px solid currentColor;display:grid;place-items:center;border-radius:50%}html[data-restaurant]:not([data-restaurant=mexican]) .section-heading{min-height:330px}html[data-restaurant]:not([data-restaurant=mexican]) .section-heading-copy{width:100%}html[data-restaurant]:not([data-restaurant=mexican]) .section-spark{display:none}html[data-restaurant]:not([data-restaurant=mexican]) .button-red:hover{background:var(--cobalt)}html[data-restaurant]:not([data-restaurant=mexican]) .hero-seal{padding:16px;font-size:18px;color:var(--ink)}html[data-restaurant]:not([data-restaurant=mexican]) .story-spark{display:none}html[data-restaurant]:not([data-restaurant=mexican]) .story-photo img{height:400px}html[data-restaurant]:not([data-restaurant=mexican]) .hero-footnote{font-size:12px}html[data-restaurant]:not([data-restaurant=mexican]) .story-photo>span{background:#12281cb0;padding:10px;letter-spacing:.12em;font-size:12px}html[data-restaurant]:not([data-restaurant=mexican]) .brand strong{letter-spacing:-.04em}
/* La Tavola: tall arches, fine rules, wine and olive. */
html[data-restaurant=italian]{--display:Georgia,'Times New Roman',serif}
[data-restaurant=italian] .site-header{border-bottom:1px solid #722b3760;padding-block:30px}
[data-restaurant=italian] .brand strong{font-weight:400;font-size:38px}
[data-restaurant=italian] .welcome{grid-template-columns:.95fr 1.05fr;gap:70px;padding-block:50px 70px}
[data-restaurant=italian] h1{font-weight:400;font-size:clamp(58px,6.2vw,86px);letter-spacing:-.06em;line-height:1.03}
[data-restaurant=italian] h1 em{font-style:italic}
[data-restaurant=italian] .hero-visual picture{border-radius:260px 260px 5px 5px;border:7px solid #faf5e9;outline:1px solid #722b3744}
[data-restaurant=italian] .hero-visual img{height:510px}
[data-restaurant=italian] .hero-seal{left:-30px;bottom:40px;background:#284737;outline-color:#284737;color:#fff9e9!important;border-color:#dfbc6780;font-style:italic;font-weight:400;transform:rotate(-8deg)}
[data-restaurant=italian] .fiesta-stripe{background:transparent;color:var(--red);border-block:1px solid #722b3744;font-family:Georgia,serif;letter-spacing:.2em}
[data-restaurant=italian] .fiesta-stripe b{color:var(--red)}
[data-restaurant=italian] .section-heading{border-radius:130px 130px 0 0;padding-top:65px;text-align:center}
[data-restaurant=italian] .section-heading h2,[data-restaurant=italian] .section-description{margin-inline:auto}
[data-restaurant=italian] .section-number{align-self:center;font-style:italic}
[data-restaurant=italian] .story{background:#284737}
[data-restaurant=italian] .story-photo img{border-radius:50% 50% 4px 4px}
/* Ember & Oak: bold condensed-feeling type, a full-width food photograph. */
[data-restaurant=bbq] .site-header{border-bottom:2px solid #252c27}
[data-restaurant=bbq] h1,[data-restaurant=bbq] h2,[data-restaurant=bbq] .brand strong{font-family:Impact,'Arial Black','DM Sans',sans-serif;text-transform:uppercase;letter-spacing:-.03em}
[data-restaurant=bbq] .welcome{position:relative;isolation:isolate;overflow:hidden;min-height:570px;width:100%;padding:65px max(40px,calc((100% - 1160px)/2));display:flex;align-items:center;background:#20271f}
[data-restaurant=bbq] .welcome-copy{position:relative;z-index:2;max-width:610px}
[data-restaurant=bbq] .hero-visual{position:absolute;inset:0;z-index:-1}
[data-restaurant=bbq] .hero-visual:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#10150feb 0%,#10150fbf 37%,#10150f22 75%)}
[data-restaurant=bbq] .hero-visual picture{border-radius:0;height:100%}
[data-restaurant=bbq] .hero-visual img{height:100%;object-position:70% center}
[data-restaurant=bbq] h1{font-size:clamp(55px,6.3vw,86px);color:#fff4d9;line-height:.97}
[data-restaurant=bbq] h1 em{color:#efb64e}
[data-restaurant=bbq] .welcome .eyebrow,[data-restaurant=bbq] .hero-footnote{color:#efb64e}
[data-restaurant=bbq] #introduction{color:#fff3db;max-width:415px}
[data-restaurant=bbq] .hero-actions .text-link{color:#fff4d9}
[data-restaurant=bbq] .hero-actions .button{background:#efb64e;color:#20271f}
[data-restaurant=bbq] .hero-seal{display:none}
[data-restaurant=bbq] .photo-caption{right:24px;bottom:20px;z-index:2}
[data-restaurant=bbq] .fiesta-stripe{background:#efb64e;color:#262823;letter-spacing:.2em;padding-block:19px;border-bottom:3px solid #262823}
[data-restaurant=bbq] .fiesta-stripe b{color:#9f411d}
[data-restaurant=bbq] .signature-photo,[data-restaurant=bbq] .flip-card,[data-restaurant=bbq] .section-heading,[data-restaurant=bbq] .button{border-radius:0}
[data-restaurant=bbq] .section-heading{border-top:6px solid var(--section-accent)}
[data-restaurant=bbq] .story-photo img{border-radius:0}
[data-restaurant=bbq] .visit{background:#252c27}
/* Salt & Tide: airy blue, an offset panel, and generous white space. */
[data-restaurant=seafood] .site-header{border-bottom:1px solid #12546730}
[data-restaurant=seafood] .brand strong{font-size:34px;font-weight:700}
[data-restaurant=seafood] .welcome{grid-template-columns:1.2fr 1fr;gap:0;padding-block:45px 65px}
[data-restaurant=seafood] .hero-visual{order:-1}
[data-restaurant=seafood] .hero-visual picture{border-radius:6px 6px 140px 6px}
[data-restaurant=seafood] .hero-visual img{height:520px;object-position:45% center}
[data-restaurant=seafood] .welcome-copy{position:relative;background:#f5faf9;padding:36px 0 36px 38px;margin-left:-60px;z-index:2;border-left:5px solid #edc46b}
[data-restaurant=seafood] h1{font-size:clamp(48px,5.1vw,69px);font-weight:700;color:#125467;line-height:1.06}
[data-restaurant=seafood] #introduction{color:#49606a}
[data-restaurant=seafood] .hero-seal{display:none}
[data-restaurant=seafood] .photo-caption{left:18px;right:auto;background:#19394dcc}
[data-restaurant=seafood] .fiesta-stripe{background:#dceeee;color:#125467;letter-spacing:.15em;border-block:1px solid #12546725}
[data-restaurant=seafood] .fiesta-stripe b{color:#125467}
[data-restaurant=seafood] .menu-experience,[data-restaurant=seafood] .category-dock{background:#fff}
[data-restaurant=seafood] .section-heading{border-radius:5px 70px 5px 5px}
[data-restaurant=seafood] .story{background:#19394d}
[data-restaurant=seafood] .story-photo img{border-radius:120px 5px 5px 5px}
/* Sunny Side: cherry-red checks, sunny yellow, and a round breakfast portrait. */
[data-restaurant=diner] .site-header{border-bottom:3px double #b1333280}
[data-restaurant=diner] .brand strong{font-size:32px;letter-spacing:-.05em;font-weight:800}
[data-restaurant=diner] .brand small{letter-spacing:.1em}
[data-restaurant=diner] h1{font-weight:800;font-size:clamp(50px,5.6vw,77px);line-height:1.02}
[data-restaurant=diner] .welcome{gap:50px;padding-block:45px 55px;grid-template-columns:1fr 1.1fr}
[data-restaurant=diner] .hero-visual{padding:13px;background:repeating-conic-gradient(#b13332 0% 25%,#fff9e9 0% 50%) 0 0/26px 26px;border-radius:50%}
[data-restaurant=diner] .hero-visual picture{border-radius:50%;border:8px solid #fff9e9}
[data-restaurant=diner] .hero-visual img{aspect-ratio:1.15;height:auto;object-position:center}
[data-restaurant=diner] .hero-seal{bottom:-4px;left:-15px;outline-color:#fff9e9;border:2px dashed #b13332;background:#f6ca50;transform:rotate(-9deg);color:#b13332!important}
[data-restaurant=diner] .photo-caption{display:none}
[data-restaurant=diner] .hero-actions .button{border-radius:28px}
[data-restaurant=diner] .fiesta-stripe{background:#26716c;color:#fff9e9;border-block:5px solid #f6ca50}
[data-restaurant=diner] .section-heading{border:2px solid var(--section-accent);border-radius:15px}
[data-restaurant=diner] .section-number{font-weight:800}
[data-restaurant=diner] .signature-photo{border:5px solid #f6ca50;border-radius:15px}
[data-restaurant=diner] .story-photo img{border:8px solid #fff9e9;border-radius:18px;transform:rotate(-2deg)}
[data-restaurant=diner] .visit{background:#b13332}
@media(max-width:980px){.demo-toolbar{flex-wrap:wrap;gap:10px 14px}.demo-label{display:none}.style-control{margin-right:auto}.owner-link{margin-left:0}.demo-switch{margin-left:0}.style-control select{max-width:175px}[data-restaurant=italian] .welcome{gap:35px}[data-restaurant=seafood] .welcome-copy{padding-left:25px;margin-left:-35px}[data-restaurant=diner] .welcome{gap:30px}.owner-style{justify-content:flex-start}}
@media(max-width:760px){.style-control{font-size:12px;gap:8px}.style-control select{font-size:14px;min-height:44px}.demo-toolbar{padding:10px 14px}.demo-switch{margin-left:auto}.owner-link{order:0;padding:8px;font-size:13px}.owner-style{margin-bottom:18px;justify-content:space-between}html[data-restaurant]:not([data-restaurant=mexican]) #restaurant-site .brand-mark{width:36px;height:36px;font-size:23px}html[data-restaurant]:not([data-restaurant=mexican]) .brand strong{font-size:27px}html[data-restaurant]:not([data-restaurant=mexican]) .brand small{font-size:9px}html[data-restaurant]:not([data-restaurant=mexican]) .section-heading{min-height:190px;border-radius:6px;padding:25px;text-align:left}html[data-restaurant]:not([data-restaurant=mexican]) .section-heading h2,html[data-restaurant]:not([data-restaurant=mexican]) .section-description{max-width:78%;margin-left:0}html[data-restaurant]:not([data-restaurant=mexican]) .section-heading .section-description{font-size:14px}.section-number{position:absolute;right:12px;bottom:4px;font-size:105px;z-index:-1}.section-heading-copy{z-index:1}.category-link .category-icon{height:29px}.category-number{font-size:18px}.category-rail:has(.category-number){min-height:75px}.category-rail:has(.category-number) .category-link{min-width:100px;justify-content:center;gap:8px}.signature-rail:has(>.signature-card:only-child){display:block}.signature-rail:has(>.signature-card:only-child) .signature-card{width:100%}.signature-rail:has(>.signature-card:nth-child(2):last-child){display:flex}.signature-rail:has(>.signature-card:nth-child(2):last-child) .signature-card{flex-basis:83%}
[data-restaurant=italian] .welcome{grid-template-columns:1fr;gap:30px;padding-block:34px 42px;text-align:center}[data-restaurant=italian] h1{font-size:60px}[data-restaurant=italian] #introduction{margin-inline:auto;font-size:16px}[data-restaurant=italian] .hero-actions{justify-content:center}[data-restaurant=italian] .hero-visual{width:92%;margin:auto}[data-restaurant=italian] .hero-visual img{height:345px}[data-restaurant=italian] .hero-seal{left:auto;right:-8px;bottom:28px;width:92px;height:92px}[data-restaurant=italian] .photo-caption{font-size:11px;max-width:65%;left:12px}
[data-restaurant=bbq] .welcome{min-height:620px;padding:40px 24px;align-items:flex-start}[data-restaurant=bbq] .welcome-copy{max-width:100%}[data-restaurant=bbq] h1{font-size:62px;max-width:350px;margin-top:20px}[data-restaurant=bbq] #introduction{max-width:300px;font-size:16px}[data-restaurant=bbq] .hero-visual:after{background:linear-gradient(180deg,#10150fe8 0%,#10150fba 47%,#10150f33 100%)}[data-restaurant=bbq] .hero-visual img{object-position:62% bottom}[data-restaurant=bbq] .photo-caption{left:24px;bottom:18px;font-size:12px}[data-restaurant=bbq] .fiesta-stripe{font-size:11px;letter-spacing:.1em}
[data-restaurant=seafood] .welcome{display:flex;flex-direction:column;gap:0;padding-block:28px 40px}[data-restaurant=seafood] .hero-visual{width:100%;order:0}[data-restaurant=seafood] .hero-visual img{height:300px}[data-restaurant=seafood] .hero-visual picture{border-radius:5px 5px 85px 5px}[data-restaurant=seafood] .welcome-copy{order:1;margin:-35px 12px 0 0;padding:28px 18px 0;background:#f5faf9;width:calc(100% - 12px)}[data-restaurant=seafood] h1{font-size:48px}[data-restaurant=seafood] #introduction{font-size:16px}[data-restaurant=seafood] .photo-caption{top:12px;bottom:auto;font-size:11px}
[data-restaurant=diner] .welcome{grid-template-columns:1fr;gap:35px;padding-block:32px 40px;text-align:center}[data-restaurant=diner] h1{font-size:55px}[data-restaurant=diner] #introduction{font-size:16px;margin-inline:auto}[data-restaurant=diner] .hero-actions{justify-content:center}[data-restaurant=diner] .hero-visual{width:94%;margin:auto}[data-restaurant=diner] .hero-seal{left:-7px;bottom:0;width:94px;height:94px}[data-restaurant=diner] .hero-visual img{height:auto}[data-restaurant=diner] .fiesta-stripe{font-size:11px}}
@media(max-width:420px){.demo-toolbar{gap:7px 12px}.style-control{width:100%;justify-content:space-between}.style-control select{flex:1;max-width:200px}.demo-switch{margin-left:auto}.demo-switch button{min-height:40px}.owner-link{order:0}.owner-style select{max-width:190px}html[data-restaurant]:not([data-restaurant=mexican]) .brand strong{font-size:23px}html[data-restaurant]:not([data-restaurant=mexican]) .brand small{font-size:8px}[data-restaurant=diner] .brand strong{font-size:23px!important}[data-restaurant=italian] h1{font-size:54px}[data-restaurant=italian] .hero-visual img{height:310px}[data-restaurant=bbq] h1{font-size:55px}[data-restaurant=bbq] .welcome{padding-inline:20px}[data-restaurant=seafood] h1{font-size:43px}[data-restaurant=diner] h1{font-size:48px}}