@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/cormorant-500-cyr.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/cormorant-500-lat.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/cormorant-600-cyr.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/cormorant-600-lat.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:500;font-display:swap;src:url('../fonts/cormorant-500i-cyr.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:500;font-display:swap;src:url('../fonts/cormorant-500i-lat.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/sourcesans3-400-cyr.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/sourcesans3-400-lat.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/sourcesans3-600-cyr.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/sourcesans3-600-lat.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/sourcesans3-700-cyr.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/sourcesans3-700-lat.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Marck Script';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/marckscript-400-cyr.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Marck Script';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/marckscript-400-lat.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* =========================================================
   Чика Перо: заједнички стилови (почетна, /meni)

   СЛИКЕ: свако место за слику је <figure class="ph" data-slot="...">
   са <picture data-img="slug"> унутра; изворе уписује
   scripts/image-tools/optimize-images.mjs. Слика прекрива шрафуру.

   ПАЛЕТЕ: подразумевана је зелена/злато. Весна-ина тиркиз/окер
   варијанта се укључује са ?paleta=tirkiz (враћа се са ?paleta=zelena).
   ========================================================= */

:root{
  --bg-deep:#183024; --bg:#22392d; --bg-rgb:24,48,36;
  --line:rgba(201,174,118,.22);
  --accent:#b4955a; --accent-soft:#cdb27c; --accent-ink:#8a6f3c; --accent-rgb:180,149,90;
  --cream:#f2ead9; --paper:#e8ddc6;
  --ink:#2a2922; --ink-soft:#57513f;
  --on-dark:#e9e2d0; --on-dark-soft:#c3bca7;
  --ph-dark:#2b4135; --ph-light:#e2d6bb;

  --serif:"Cormorant Garamond","Cormorant",Georgia,"Times New Roman",serif;
  --sans:"Source Sans 3","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --script:"Marck Script","Cormorant Garamond",cursive;

  --gutter:clamp(20px,5vw,56px);
  --maxw:1220px;
  --header-h:72px;
  --top-inset:env(safe-area-inset-top,0px);

  --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --fibre:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .35' numOctaves='2' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 .45  0 0 0 0 .36  0 0 0 0 .2  0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E");
}
/* Весна: „тиркизна (као тањири и подметачи) и окер“ */
:root[data-palette="tirkiz"]{
  --bg-deep:#11393a; --bg:#1a4a4a; --bg-rgb:17,57,58;
  --line:rgba(214,166,90,.24);
  --accent:#c58f3a; --accent-soft:#dcab5e; --accent-ink:#8f6220; --accent-rgb:197,143,58;
  --cream:#f3ebda; --paper:#eadfc8;
  --on-dark:#e8e4d6; --on-dark-soft:#bcc6bd;
  --ph-dark:#235454; --ph-light:#e4d7ba;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + var(--top-inset) + 12px)}
body{margin:0;background:var(--bg-deep);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.62;overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%}
a{color:inherit}
p{margin:0 0 1em}
h1,h2,h3{font-family:var(--serif);font-weight:500;margin:0}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--accent-soft);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--accent);color:var(--bg-deep);padding:10px 14px;font-weight:600;text-decoration:none}
.skip:focus{top:12px}

.wrap{width:100%;max-width:calc(var(--maxw) + 2 * var(--gutter));margin-inline:auto;
  padding-left:max(var(--gutter),env(safe-area-inset-left,0px));padding-right:max(var(--gutter),env(safe-area-inset-right,0px))}
/* размак између секција (Весна: −25 %; било 60-104 / 64-108) */
.sec{padding-top:clamp(45px,6vw,78px);padding-bottom:clamp(48px,6vw,81px)}

/* ---------- површине ---------- */
.on-dark{position:relative;background:var(--bg);color:var(--on-dark);isolation:isolate}
.on-dark::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(120% 60% at 15% 0%,rgba(255,255,255,.045),transparent 60%),radial-gradient(90% 50% at 100% 100%,rgba(0,0,0,.16),transparent 70%)}
.on-dark::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--noise);background-size:180px;opacity:.07;mix-blend-mode:multiply}
.on-deep{background:var(--bg-deep)}
.on-light{position:relative;background:var(--cream);color:var(--ink);isolation:isolate}
.on-light::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--fibre);background-size:240px;opacity:.10}
.on-light::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--noise);background-size:180px;opacity:.07}

/* ---------- типографија ---------- */
.label{display:flex;align-items:center;gap:12px;margin:0 0 16px;font-size:12.5px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--accent-ink)}
.on-dark .label,.on-deep .label{color:var(--accent-soft)}
.label::after{content:"";flex:0 0 52px;height:1px;background:currentColor;opacity:.7}
.h2{font-size:clamp(32px,4.4vw,48px);line-height:1.08;letter-spacing:-.005em;color:var(--bg)}
.on-dark .h2,.on-deep .h2{color:var(--on-dark)}
.lead{font-size:17px;color:var(--ink-soft);max-width:34em}
.on-dark .lead,.on-deep .lead{color:var(--on-dark-soft)}
.sig{font-family:var(--script);font-size:40px;line-height:1;color:var(--accent-ink);transform:rotate(-4deg);display:inline-block}

/* ---------- дугмад и линкови ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:14px 26px;font-family:var(--sans);font-size:13.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;text-align:center;border-radius:2px;border:1px solid transparent;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.btn-gold{background:var(--accent);color:var(--bg-deep);border-color:var(--accent)}
.btn-gold:hover{background:var(--accent-soft);border-color:var(--accent-soft)}
.btn-line{background:transparent;color:var(--accent-soft);border-color:rgba(var(--accent-rgb),.8)}
.btn-line:hover{background:rgba(var(--accent-rgb),.12)}
.on-light .btn-line{color:var(--bg);border-color:var(--accent)}
.btn-dark{background:var(--bg);color:var(--on-dark);border-color:var(--bg)}
.btn-dark:hover{background:var(--bg-deep)}
.btn-sm{min-height:44px;padding:10px 18px;font-size:12.5px}
.btn-row{display:flex;flex-wrap:wrap;gap:12px}
.textlink{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:13.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink);text-decoration:none}
.on-dark .textlink,.on-deep .textlink{color:var(--accent-soft)}
.textlink svg{width:20px;height:10px;flex:none;transition:transform .2s}
.textlink:hover svg{transform:translateX(3px)}

/* ---------- места за слике ---------- */
.ph{position:relative;margin:0;overflow:hidden;border-radius:2px;aspect-ratio:var(--ar,4/3);background-color:var(--ph-light);
  background-image:repeating-linear-gradient(135deg,transparent 0 13px,rgba(var(--accent-rgb),.16) 13px 14px)}
.on-dark .ph,.on-deep .ph,.hero .ph{background-color:var(--ph-dark);background-image:repeating-linear-gradient(135deg,transparent 0 13px,rgba(var(--accent-rgb),.12) 13px 14px)}
.ph img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover}
.ph-label{position:absolute;left:12px;bottom:12px;max-width:calc(100% - 24px);font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;line-height:1.35;
  color:var(--accent-ink);background:rgba(255,255,255,.55);border:1px dashed rgba(var(--accent-rgb),.7);padding:5px 8px;border-radius:2px}
.on-dark .ph-label,.on-deep .ph-label,.hero .ph-label{color:var(--on-dark-soft);background:rgba(0,0,0,.22);border-color:rgba(var(--accent-rgb),.5)}
.todo{display:inline-block;font-size:15px;color:var(--on-dark-soft);border:1px dashed rgba(var(--accent-rgb),.6);padding:4px 10px;border-radius:2px}
.on-light .todo{color:#7a6a49;background:rgba(255,255,255,.3)}

/* ---------- иконице ---------- */
.ico{width:22px;height:22px;flex:none;color:var(--accent-soft)}
.on-light .ico{color:var(--accent-ink)}

/* =========================================================
   ЗАГЛАВЉЕ
   ========================================================= */
.header{position:sticky;top:0;z-index:50;background:var(--bg-deep);padding-top:var(--top-inset);border-bottom:1px solid var(--line);
  transition:background-color .3s ease,border-color .3s ease}
/* лого је увек у средини заглавља; мени у два дела око њега („О нама  Мени“ | лого | „Галерија  Локација“);
   на мобилном само лого у средини и мени-дугме десно. Висина 72 px, 64 px после скрола; мобилни 56 px. */
.hdr{position:relative;display:flex;align-items:center;justify-content:flex-end;min-height:calc(var(--header-h) - 1px);transition:min-height .2s ease} /* + 1 px ивица = тачно --header-h */
/* лого у заглављу: цео лого као на насловној (logo-light.svg: знак и „кафић и ресторан“ са линијама).
   Десктоп 50 px (стаје и у 72 и у 64 px), мобилни 40 px у заглављу од 56 px. */
.header .brand{position:absolute;left:50%;top:50%;translate:-50% -50%;display:block;line-height:0;text-decoration:none}
.brand-logo{display:block;width:auto;height:50px}
@media (min-width:768px){.header.is-scrolled .hdr{min-height:63px}}
@media (max-width:767px){
  :root{--header-h:56px}
  .header .brand-logo{height:40px}
}
/* насловна: заглавље преко слике. Позадина су два слоја чију провидност прати скрол (site.js):
   .hdr-bg: пуна #183024 и ивица (p 0,4 → 1), .hdr-shade: сенка одозго (обрнуто). Висина 72 → 64 px тек на p = 1 (200 ms). */
.header--overlay{position:fixed;left:0;right:0;background:transparent;border-bottom:0}
.header--overlay .hdr{min-height:var(--header-h)}
@media (min-width:768px){.header--overlay.is-scrolled .hdr{min-height:64px}}
.hdr-bg,.hdr-shade{position:absolute;left:0;right:0;top:0;z-index:-1;pointer-events:none}
.hdr-bg{bottom:0;background:var(--bg-deep);border-bottom:1px solid var(--line);opacity:0}
.hdr-shade{height:140px;background:linear-gradient(180deg,rgba(0,0,0,.45),transparent)}
.header--overlay.menu-open .hdr-bg{opacity:1!important}
.header--overlay.menu-open .hdr-shade{opacity:0!important}
.header.is-measuring .hdr{transition:none!important}
/* лого у заглављу: скривен док лого са насловне путује ка њему; на p = 1 замена у истом фрејму (линк и фокус тек тада) */
.header--overlay .brand{visibility:hidden}
.header--overlay .brand-logo{opacity:0}
.header--overlay.logo-docked .brand{visibility:visible}
.header--overlay.logo-docked .brand-logo{opacity:1!important}
/* мени у два дела: на p = 0 групе стоје једна до друге (средња колона 20 px + 2 × 8 px = обичан размак 36 px);
   како лого стиже, лева иде улево, десна удесно, свака за пола (ширина логоа + 2 × 40 px), само transform (site.js).
   На осталим страницама (без насловне) групе су већ размакнуте око логоа. */
:root{--nav-open:117px} /* пола (ширина лога у заглављу + 2 × 40 px) = (154 + 80) / 2; site.js упише тачну вредност по мери */
.nav-main ul{gap:20px} /* 20 + 2 × 8 = 36 px између речи */
.nav-main .nav-l,.nav-main .nav-r{display:none}
/* десно 8 px мање размак иза последњег слова (.12em), да текст сваке ставке буде тачно у средини свог поља, и лого тачно између „Мени“ и „Галерија“ */
.nav-main a{display:inline-flex;align-items:center;min-height:44px;padding:0 calc(8px - .12em) 0 8px;font-size:14px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--on-dark);text-decoration:none;border-bottom:1px solid transparent}
.nav-main a:hover{color:var(--accent-soft)}
.nav-main .brand{min-height:0;padding:0;border:0} /* лого је линк у навигацији, али без правила за линкове менија */
.nav-main a[aria-current="page"]{color:var(--accent-soft);border-bottom-color:var(--accent)}
/* prefers-reduced-motion: без путовања и скалирања; лого се само претапа на p = 1 */
@media (prefers-reduced-motion:reduce){
  .header,.hdr,.hdr-bg,.hdr-shade{transition:none!important}
  .header--overlay .brand{transition:visibility 0s linear .3s!important}
  .header--overlay.logo-docked .brand{transition:none!important}
  .header--overlay .brand-logo{transition:opacity .3s ease!important}
}
.menu-btn{width:48px;height:48px;margin-right:-8px;display:grid;place-items:center;background:none;border:0;color:var(--accent-soft);cursor:pointer;border-radius:2px}
.menu-btn span{display:block;width:24px;height:1.5px;background:currentColor;position:relative;transition:background-color .25s}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0;width:24px;height:1.5px;background:currentColor;transition:transform .25s}
.menu-btn span::before{top:-7px}.menu-btn span::after{top:7px}
.menu-btn[aria-expanded="true"] span{background:transparent}
.menu-btn[aria-expanded="true"] span::before{transform:translateY(7px) rotate(45deg)}
.menu-btn[aria-expanded="true"] span::after{transform:translateY(-7px) rotate(-45deg)}
.drawer{display:none;border-top:1px solid var(--line);padding-bottom:20px}
.drawer.open{display:block;max-height:calc(100vh - var(--header-h) - var(--top-inset));max-height:calc(100dvh - var(--header-h) - var(--top-inset));overflow-y:auto;overscroll-behavior:contain}
.drawer li a{display:flex;align-items:center;justify-content:space-between;min-height:56px;font-family:var(--serif);font-size:25px;font-weight:500;color:var(--on-dark);text-decoration:none;border-bottom:1px solid var(--line)}
.drawer li a[aria-current="page"]{color:var(--accent-soft)}
.drawer li a::after{content:"";width:7px;height:7px;border-top:1px solid var(--accent);border-right:1px solid var(--accent);transform:rotate(45deg);margin-right:4px}
.drawer .btn-row{margin-top:20px;display:grid;gap:12px}
.drawer .btn{width:100%}
@media (min-width:768px){
  .hdr{justify-content:center}
  .nav-main{display:grid;grid-template-columns:1fr 20px 1fr;align-items:center;width:100%}
  .nav-main .nav-l,.nav-main .nav-r{display:flex}
  .nav-l{grid-column:1;justify-self:end}
  .nav-r{grid-column:3;justify-self:start}
  .header--overlay .nav-l,.header--overlay .nav-r{will-change:transform}
  .header:not(.header--overlay) .nav-l{transform:translateX(calc(-1 * var(--nav-open)))}
  .header:not(.header--overlay) .nav-r{transform:translateX(var(--nav-open))}
  .menu-btn,.drawer,.drawer.open{display:none}
}

/* =========================================================
   НАСЛОВНА: слајдер преко целе ширине, велики лого и два дугмета
   Слајдови: 4,5 s са претапањем од 1,2 s (site.js), без зума. Један заједнички тамни слој
   изнад свих слајдова; на храни нема филтера.
   ========================================================= */
.hero{position:relative;overflow:hidden;display:grid;place-items:center;text-align:center;
  height:90vh;height:90svh;min-height:600px;max-height:960px;background:#0f1f17;color:var(--on-dark)}
/* слојеви: слајдови са заједничким тамним слојем (z 0, свој контекст), садржај преко њих (у реду документа);
   лого (z 60) је у главном контексту, па док путује ка заглављу иде изнад његове позадине */
.hero-slides{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 1.2s ease}
.hero-slide.is-active{opacity:1}
.hero-slide img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%)}
/* мобилни извоз (4:5) је већ исечен око тачке фокуса; --pos-m = где је та тачка у исечку */
@media (max-width:767px){.hero-slide img{object-position:var(--pos-m,50% 50%)}}
/* без зума: слајдови се само претапају (1,2 s), 4,5 s по слајду са претапањем (site.js) */
/* слајд само за мобилни (усправна фотографија): на 768 px и шире не постоји (site.js га ни не учитава) */
@media (min-width:768px){.hero-slide[data-only="mobile"]{display:none}}
.hero-slides::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 60% 55% at 50% 48%,rgba(10,22,16,.62) 0%,rgba(10,22,16,.35) 55%,rgba(10,22,16,.55) 100%)}
.hero-in{position:relative;display:grid;justify-items:center;padding-top:calc(var(--header-h) + var(--top-inset));padding-bottom:56px}
.hero-logo{margin:0;width:clamp(260px,32vw,520px);line-height:0}
/* сенка (на логу, не на фотографији): уска ивица + мек ореол. Лого остаје читљив и на светлим
   слајдовима (мерено на ивици слова: ≥ 3,4:1 на мобилном, ≥ 4,5:1 на десктопу) */
.hero-logo img{display:block;width:100%;height:auto;filter:drop-shadow(0 0 1px rgba(0,0,0,.75)) drop-shadow(0 1px 6px rgba(0,0,0,.55)) drop-shadow(0 2px 24px rgba(0,0,0,.4))}
/* при скролу (site.js): цео лого путује до логоа у заглављу (FLIP, само transform) */
.hero-logo-img{position:relative;z-index:60;transform-origin:0 0;will-change:transform}
.header.menu-open ~ main .hero-logo-img{visibility:hidden}
.hero-logo.is-hidden{opacity:0;visibility:hidden}
@media (prefers-reduced-motion:reduce){
  .hero-logo-img{z-index:auto;will-change:auto}
  .hero-logo{transition:opacity .3s ease!important}
  .hero-logo.is-hidden{transition:opacity .3s ease,visibility 0s linear .3s!important}
}
/* дугмад на насловној: 60 px, најмање 230 px, 16 px размака; изглед: „ГЛАВНА ДУГМАД“ ниже.
   На десктопу бледе у 60 px скрола од тренутка кад им горња ивица стигне до заглавља (site.js пише opacity),
   а стална дугмад (.sticky-cta) у истом тренутку улазе одоздо. Мобилни: једно испод другог, до 320 px. */
.hero-cta{margin-top:40px;gap:16px;justify-content:center}
.hero-cta .btn.btn-cta[data-action]{height:60px;min-height:60px;min-width:230px}
@media (max-width:767px){
  .hero-cta{display:grid;grid-template-columns:minmax(0,1fr);width:100%;max-width:320px}
  .hero-cta .btn.btn-cta[data-action]{width:100%;min-width:0}
}
/* пауза/покрени (WCAG 2.2.2); скривено ако је један слајд или prefers-reduced-motion */
.hero-toggle{position:absolute;right:max(var(--gutter),16px);bottom:18px;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;
  border:1px solid rgba(var(--accent-rgb),.7);background:rgba(0,0,0,.35);color:var(--cream);cursor:pointer}
.hero-toggle:hover{background:rgba(0,0,0,.55)}
.hero-toggle[hidden]{display:none}
.hero-toggle svg{width:16px;height:16px}
.hero-toggle .i-play,.hero-toggle[aria-pressed="true"] .i-pause{display:none}
.hero-toggle[aria-pressed="true"] .i-play{display:block}

/* =========================================================
   О НАМА
   ========================================================= */
.about-grid{display:grid;gap:36px}
.about .lead p:last-child{margin-bottom:0}
.about .sig{margin-top:22px}
.about-photos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.about-photos .ph{--ar:4/5}
@media (min-width:900px){
  .about-grid{grid-template-columns:5fr 7fr;align-items:center;gap:clamp(40px,6vw,88px)}
  .about-photos{gap:16px}
}

/* =========================================================
   ТРАКЕ (јела, галерија): хоризонтални клизач
   ========================================================= */
.sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 32px;margin-bottom:32px}
.sec-head .h2{margin:0}
.sec-head-side{display:flex;align-items:center;gap:18px}
.rail-ctrl{display:flex;gap:8px}
.rail-ctrl[hidden]{display:none}
.rail-btn{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(var(--accent-rgb),.65);background:transparent;color:var(--accent-soft);cursor:pointer;transition:background-color .2s,opacity .2s}
.rail-btn:hover{background:rgba(var(--accent-rgb),.14)}
.rail-btn:disabled{opacity:.35;cursor:default;background:transparent}
.rail-btn svg{width:16px;height:16px}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:min(80%,330px);gap:16px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;
  margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);scroll-padding-inline:var(--gutter);padding-bottom:6px}
.rail::-webkit-scrollbar{display:none}
.rail>li{scroll-snap-align:start}

/* ---------- издвојена јела ---------- */
.dish .ph{--ar:4/3;box-shadow:0 0 0 1px rgba(var(--accent-rgb),.2)}
.dish h3{margin:16px 0 6px;font-size:24px;font-weight:600;line-height:1.15;color:var(--on-dark)}
.dish p{margin:0;font-size:15.5px;line-height:1.5;color:var(--on-dark-soft)}
@media (min-width:1000px){
  .dishes .rail{grid-auto-flow:row;grid-template-columns:repeat(5,1fr);overflow:visible;margin-inline:0;padding-inline:0;gap:20px}
  .dishes .rail>.rail-clone{display:none} /* копије за клизање у круг (site.js) */
}

/* ---------- специјалитет куће ---------- */
.special-grid{display:grid;gap:40px}
/* Весна: специјалитет се издваја. Пуни размак (остале секције −25 %), већа слика у раму */
.special .sec{padding-top:clamp(64px,8.5vw,112px);padding-bottom:clamp(72px,9vw,120px)}
.special .ph{--ar:16/11;outline:1px solid rgba(var(--accent-rgb),.75);outline-offset:10px;box-shadow:0 28px 60px -28px rgba(0,0,0,.55)}
.special .lead{margin-bottom:28px}
.special .h2{font-size:clamp(44px,6.2vw,76px);margin-bottom:18px}
@media (max-width:899px){.special .ph{margin-inline:10px}}
@media (min-width:900px){
  .special-grid{grid-template-columns:4fr 8fr;align-items:center;gap:clamp(48px,6vw,96px)}
}

/* ---------- галерија ---------- */
/* трака у круг: исте слике истим редом, иста висина (360 / мобилни 240 px), ширина по односу страна, 12 px размака.
   .marquee-scroll је прави хоризонтални скрол (без snap-а, који би се борио са кретањем); site.js дода по копију
   низа испред и иза (aria-hidden, alt="", inert) и помера scrollLeft. Бледе ивице (64 / мобилни 32 px) су маска на
   .marquee-view, која се не скролује; оквир фокуса је на .marquee, ван маске. */
.gallery{padding-bottom:clamp(48px,6vw,81px)}
.gallery-head{padding-top:clamp(45px,6vw,78px)}
.marquee{--mq-h:360px;--mq-fade:64px;display:block;outline-offset:4px}
.marquee-view{
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 var(--mq-fade),#000 calc(100% - var(--mq-fade)),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 var(--mq-fade),#000 calc(100% - var(--mq-fade)),transparent)}
.marquee-scroll{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-behavior:auto;scrollbar-width:none}
.marquee-scroll::-webkit-scrollbar{display:none}
/* фокус с тастатуре: оквир око целе траке (на самом скролу би га маска избледела на ивицама) */
.marquee-scroll:focus-visible{outline-offset:-2px}
@supports selector(:has(*)){
  .marquee-scroll:focus-visible{outline:none}
  .marquee:has(.marquee-scroll:focus-visible){outline:2px solid var(--accent-soft)}
}
.marquee-track{display:flex;width:max-content}
.marquee-set{display:flex;gap:12px;padding-right:12px;margin:0}
.marquee-set>li{position:relative;flex:none}
.marquee .ph{height:var(--mq-h);width:auto;aspect-ratio:auto}
.marquee .ph img{position:static;height:100%;width:auto;max-width:none;-webkit-user-drag:none}
/* дугме преко слике оригинала (site.js) отвара увећан приказ; курсор остаје grab (трака се превлачи) */
.marquee-zoom{position:absolute;inset:0;z-index:2;width:100%;height:100%;padding:0;border:0;border-radius:2px;background:none;
  cursor:inherit;-webkit-tap-highlight-color:transparent}
.marquee-zoom:focus-visible{outline:2px solid var(--cream);outline-offset:-5px;box-shadow:inset 0 0 0 7px rgba(0,0,0,.35)}
/* site.js: .is-ready (копије, кретање, превлачење мишем), .is-dragging (миш превлачи) */
.marquee.is-ready .marquee-track{-webkit-user-select:none;user-select:none;will-change:transform}
@media (hover:hover) and (pointer:fine){
  .marquee.is-ready .marquee-scroll{cursor:grab}
  .marquee.is-dragging .marquee-scroll{cursor:grabbing}
}
@media (max-width:767px){.marquee{--mq-h:240px;--mq-fade:32px}}
/* стрелице „Претходна слика“ / „Следећа слика“ само на ≥ 768 px; трака је у круг, па никад нису онемогућене */
@media (max-width:767px){.marquee-ctrl{display:none}}
/* дугме пауза/покрени (WCAG 2.2.2: кретање траје дуже од 5 s), исти изглед као на насловној; само зауставља
   и покреће кретање, превлачење ради у оба стања; уз prefers-reduced-motion нема кретања, па га site.js сакрије */
.marquee-toggle{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;flex:none;
  border:1px solid rgba(var(--accent-rgb),.7);background:rgba(0,0,0,.35);color:var(--cream);cursor:pointer}
.marquee-toggle:hover{background:rgba(0,0,0,.55)}
.marquee-toggle[hidden]{display:none}
.marquee-toggle svg{width:16px;height:16px}
.marquee-toggle .i-play,.marquee-toggle[aria-pressed="true"] .i-pause{display:none}
.marquee-toggle[aria-pressed="true"] .i-play{display:block}

/* ---------- увећан приказ (lightbox, site.js) ---------- */
/* <dialog> преко целог екрана на тамној позадини; слике у скролу са scroll-snap-ом (једна по потезу), бројач горе,
   X горе десно, стрелице са стране на ≥ 768 px. Страница се не скролује док је отворен (html.lb-lock; site.js
   надомести ширину траке за скрол десним паддингом body-ја, да се садржај испод не помери). */
html.lb-lock,html.lb-lock body{overflow:hidden}
.lb{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;
  background:transparent;color:var(--cream);overflow:hidden;overscroll-behavior:contain}
.lb::backdrop{background:rgba(8,12,10,.97)}
.lb[open]{animation:lb-in .18s ease-out}
@keyframes lb-in{from{opacity:0}to{opacity:1}}
.lb-track{display:flex;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior:contain;
  scrollbar-width:none;touch-action:pan-x pinch-zoom;outline:none}
.lb-track::-webkit-scrollbar{display:none}
.lb-slide{flex:0 0 100%;height:100%;display:flex;align-items:center;justify-content:center;padding:68px 16px;
  scroll-snap-align:center;scroll-snap-stop:always}
.lb-slide picture{display:contents}
.lb-slide img{display:block;width:min(100%,(100vh - 136px) * var(--ar,1.3333));height:auto;max-width:none;border-radius:2px;
  -webkit-user-drag:none;-webkit-user-select:none;user-select:none}
@supports (height:100dvh){.lb-slide img{width:min(100%,(100dvh - 136px) * var(--ar,1.3333))}}
.lb-count{position:absolute;top:max(16px,env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%);margin:0;
  line-height:44px;font-size:14px;font-weight:600;letter-spacing:.14em;font-variant-numeric:tabular-nums;color:var(--cream);pointer-events:none}
.lb-btn{position:absolute;width:44px;height:44px;display:grid;place-items:center;padding:0;border-radius:50%;
  border:1px solid rgba(var(--accent-rgb),.7);background:rgba(0,0,0,.35);color:var(--cream);cursor:pointer}
.lb-btn:hover{background:rgba(0,0,0,.6)}
.lb-btn[aria-disabled="true"]{opacity:.3;cursor:default;background:rgba(0,0,0,.35)}
.lb-btn svg{width:16px;height:16px}
.lb-close{top:max(16px,env(safe-area-inset-top,0px));right:max(16px,env(safe-area-inset-right,0px))}
.lb-prev,.lb-next{top:50%;margin-top:-22px}
.lb-prev{left:max(16px,env(safe-area-inset-left,0px))}
.lb-next{right:max(16px,env(safe-area-inset-right,0px))}
@media (min-width:768px){.lb-slide{padding:68px 76px}}
@media (max-width:767px){.lb-prev,.lb-next{display:none}}

/* =========================================================
   РЕЗЕРВАЦИЈА, збијено: текст и фотографија у две колоне (≥ 768), на мобилном фотографија изнад текста.
   Десктоп (≥ 1024): 1fr 1fr, 64 px, текст до 520 px, фотографија 1 / 1 до 520 px уз десну ивицу;
   таблет: исто, 40 px, фотографија 4 / 5; мобилни: фотографија 6 / 5, 24 px до текста, дугмад једно испод другог.
   Кадар 50 % 60 %: у кадру остају и рељеф месеца и округли сто. Размак секције 80 px (таблет 64, мобилни 56).
   ========================================================= */
.reserve .sec{padding-top:56px;padding-bottom:56px}
.reserve-grid{display:grid;gap:24px}
.reserve-photo{order:-1}
.reserve-photo .ph{--ar:6/5}
.reserve-photo .ph img{object-position:50% 60%}
.reserve .lead{margin-bottom:24px}
.reserve .btn .ico{width:18px;height:18px;color:currentColor}
@media (max-width:767px){
  .reserve .btn-row{display:grid;grid-template-columns:minmax(0,1fr)}
  .reserve .btn-row .btn{width:100%}
}
@media (min-width:768px){
  .reserve .sec{padding-top:64px;padding-bottom:64px}
  .reserve-grid{grid-template-columns:1fr 1fr;align-items:center;gap:40px}
  .reserve-text{max-width:520px}
  .reserve-photo{order:0;justify-self:end;width:100%;max-width:520px}
  .reserve-photo .ph{--ar:4/5}
}
@media (min-width:1024px){
  .reserve .sec{padding-top:80px;padding-bottom:80px}
  .reserve-grid{gap:64px}
  .reserve-photo .ph{--ar:1/1}
}

/* =========================================================
   ЛОКАЦИЈА + ПОДНОЖЈЕ (контакт, локација, радно време)
   ========================================================= */
.info{margin:28px 0 0;border-top:1px solid var(--line)}
.info li{display:grid;grid-template-columns:28px 1fr;gap:14px;align-items:start;padding:18px 0;border-bottom:1px solid var(--line)}
.info .ico{margin-top:3px}
.info .k{font-size:12.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-soft);margin-bottom:4px}
.loc-grid{display:grid;gap:32px}
.map-slot{--ar:4/3}
.loc-photo{display:none}
@media (min-width:900px){
  .loc-grid{grid-template-columns:5fr 7fr;align-items:stretch;gap:clamp(32px,4vw,56px)}
  .loc-grid .map-slot{aspect-ratio:auto;height:100%;min-height:420px}
}
@media (min-width:1220px){
  .loc-grid{grid-template-columns:4fr 5fr 3fr}
  .loc-photo{display:block}
  .loc-photo .ph{aspect-ratio:auto;height:100%;min-height:420px}
}

/* =========================================================
   ПОДНОЖЈЕ. Десктоп (≥ 1100): Навигација | Контакт | лого | Радно време | Пратите нас, лого тачно у средини
   (лево и десно по 2,2fr + 2 размака); таблет: лого горе, па 2 × 2; мобилни: лого горе, па две колоне.
   Доле напомена о ценама, © и потпис. Само подаци којих већ има на сајту.
   ========================================================= */
.site-footer{background:var(--bg-deep);color:rgba(233,226,208,.8);padding-top:72px;padding-bottom:calc(32px + env(safe-area-inset-bottom,0px))}
.ft-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 48px;align-items:start}
.ft-brand{grid-column:1/-1;text-align:center}
/* minmax(0, …): исти односи 0,9 / 1,3 / 1,2 / 1,4 / 0,8, али колона не расте због дужег текста, па лого остаје у средини */
@media (min-width:1100px){
  .ft-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr) minmax(max-content,1.2fr) minmax(0,1.4fr) minmax(0,.8fr);column-gap:48px}
  /* средња колона никад ужа од логоа (до ~1230 px би 1,2fr била ужа од 198 px); лево и десно и даље по 2,2fr, па лого остаје у средини.
     Врх знака у равни са словима наслова колона (мерено: слова наслова почињу 1 px ниже од знака) */
  .ft-brand{grid-column:3;grid-row:1;padding-top:1px}
  /* Контакт и Пратите нас уз крај своје траке (текст у њима и даље лево): исти размак лево и десно од логоа,
     а садржај од ивице до ивице. Са свим колонама лево било је 132 px према 60 px око логоа (на 1385 px) */
  .ft-col-end{justify-self:end}
}
.ft-logo{display:inline-block;line-height:0}
.ft-logo img{display:block;height:64px;width:auto} /* цео лого (logo-light.svg), исти као у заглављу и на насловној */
.ft-h{margin:0 0 14px;font-family:var(--sans);font-size:12px;font-weight:600;line-height:1.4;letter-spacing:.16em;text-transform:uppercase;color:#cdb27c}
.ft-text,.ft-hours,.ft-social,.ft-nav{font-family:var(--sans);font-size:15px;line-height:1.6}
.ft-text{display:grid;gap:10px;justify-items:start;font-style:normal}
.site-footer a{color:var(--on-dark);text-decoration:none;text-underline-offset:3px}
.site-footer a:hover{text-decoration:underline}
.ft-hours{display:grid;grid-template-columns:auto auto;justify-content:start;gap:4px 18px;margin:0}
.ft-hours dt{color:rgba(233,226,208,.8)}
.ft-hours dd{margin:0;color:var(--on-dark);font-variant-numeric:tabular-nums}
.ft-social{display:grid;gap:2px;margin:0}
.ft-social a{display:inline-flex;align-items:center;gap:10px;min-height:36px}
.ft-social svg{width:20px;height:20px;flex:none;color:#cdb27c}
.ft-nav{display:grid;gap:0}
.ft-nav a{display:inline-flex;align-items:center;min-height:32px}
.ft-nav a[aria-current="page"]{color:#cdb27c}
.ft-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin-top:56px;padding-top:20px;
  border-top:1px solid rgba(205,178,124,.2);font-size:13px;line-height:1.5;color:rgba(233,226,208,.6)}
.ft-bottom p{margin:0}
.ft-legal{display:flex;flex-wrap:wrap;gap:4px 20px}
.site-footer .ft-legal a{color:inherit}
.site-footer .ft-legal a[href]:hover{color:var(--on-dark)}
/* таблет и десктоп: © лево, напомена о ценама у средини (испод логоа), потпис десно. .ft-legal нестаје из распореда
   (display:contents), па су © и потпис ћелије исте мреже. До 899 px напомена у једном реду не стаје између њих
   са истим ширинама лево и десно: тада она иде у свој ред изнад, у средини */
@media (min-width:768px){
  .ft-bottom{display:grid;grid-template-columns:1fr auto 1fr;align-items:baseline}
  .ft-legal{display:contents}
  .ft-note{grid-area:1/1/2/-1;text-align:center}
  .ft-legal > span{grid-area:2/1;justify-self:start;white-space:nowrap}
  .ft-legal > a{grid-area:2/3;justify-self:end;white-space:nowrap}
}
@media (min-width:900px){
  .ft-note{grid-area:1/2}
  .ft-legal > span{grid-area:1/1}
  .ft-legal > a{grid-area:1/3}
}
@media (max-width:767px){
  /* доле исто колико са стране (.wrap: --gutter), плус безбедна зона */
  .site-footer{padding-top:56px;padding-bottom:calc(var(--gutter) + env(safe-area-inset-bottom,0px))}
  /* мобилни: лого преко целе ширине, па две колоне редом из HTML-а: Навигација | Контакт, Радно време преко обе
     (дан и сати у пола ширине на 360 px не стају у један ред: 214 px према 148 px), Пратите нас у последњем реду.
     Адреса у пола ширине прелази у два реда („Булевар краља / Петра I 22“, &nbsp; у HTML-у) */
  .ft-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}
  .ft-col-hours{grid-column:1/-1}
  .ft-hours dt,.ft-hours dd{white-space:nowrap}
  .ft-bottom{flex-direction:column;margin-top:40px}
  /* © лево, потпис десно у истом реду; кад не стане, потпис прелази у свој ред и остаје десно (margin-left:auto) */
  .ft-legal{flex-direction:row;flex-wrap:wrap;justify-content:space-between}
  .ft-legal a{margin-left:auto}
}

/* =========================================================
   ГЛАВНА ДУГМАД: „Поручи храну“ и „Резервиши сто“ (.btn-cta: насловна, стална дугмад, резервација)
   700, 15 px, .12em, верзал; иконица 18 px (линија 1,75 px, currentColor, aria-hidden) 10 px испред текста.
   Hover/фокус: 1 px навише, сенка 0 10px 24px rgba(0,0,0,.28), боја 6 % светлија (бели слој 6 % испод текста), 150 ms;
   фокус: крем оквир 2 px на 3 px (на крем позадини тамнозелен). Подизање и сенка само где постоји миш (на телефону
   би дугме после додира остало подигнуто).
   .btn.btn-cta[data-action] је јаче од .btn.glf-button које убацује ordering.js; боја текста има !important,
   јер GloriaFood (order-online.css) боји .glf-button у #fff са !important. Иконица не прима клик (циљ је увек дугме).
   ========================================================= */
.btn.btn-cta[data-action]{position:relative;isolation:isolate;gap:10px;padding:0 26px;font-size:15px;font-weight:700;letter-spacing:.12em;line-height:1.2;
  white-space:nowrap;transition:transform .15s ease,box-shadow .15s ease}
.btn-cta::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:#fff;opacity:0;pointer-events:none;transition:opacity .15s ease}
.btn-ico{width:18px;height:18px;flex:none;pointer-events:none}
.btn-cta.btn-gold[data-action],.btn-cta.btn-gold[data-action]:hover,.btn-cta.btn-gold[data-action]:active{background-color:var(--accent);border-color:var(--accent);color:var(--bg-deep)!important}
/* „Резервиши сто“: пуна крем боја и тамнозелен текст (уместо провидног оквира), подједнако видљиво на сваком слајду */
.btn-cta.btn-cream[data-action],.btn-cta.btn-cream[data-action]:hover,.btn-cta.btn-cream[data-action]:active{background-color:var(--cream);border-color:var(--cream);color:var(--bg-deep)!important}
.btn-cta.btn-dark[data-action],.btn-cta.btn-dark[data-action]:hover,.btn-cta.btn-dark[data-action]:active{background-color:var(--bg);border-color:var(--bg);color:var(--on-dark)!important}
@media (hover:hover){
  .btn.btn-cta[data-action]:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(0,0,0,.28)}
  .btn-cta[data-action]:hover::after{opacity:.06}
}
.btn.btn-cta[data-action]:focus-visible{transform:translateY(-1px);box-shadow:0 10px 24px rgba(0,0,0,.28);outline:2px solid var(--cream);outline-offset:3px}
.btn-cta[data-action]:focus-visible::after{opacity:.06}
.on-light .btn.btn-cta[data-action]:focus-visible{outline-color:var(--bg)}

/* =========================================================
   СТАЛНА ДУГМАД: „Поручи храну“ и „Резервиши сто“ (исте класе и data-action као на насловној)
   десктоп (≥ 768): плутајућа трака доле у средини (24 px од дна), дугмад једно поред другог;
   мобилни: трака на дну преко целе ширине. Склањају се над секцијом за резервацију и над подножјем (site.js).
   Скривена прозирношћу/visibility (не display:none), да их GloriaFood види од учитавања (site.js: .is-shown).
   ========================================================= */
.sticky-cta{position:fixed;z-index:40;visibility:hidden;pointer-events:none}
.sticky-cta.is-shown{visibility:visible;pointer-events:auto}
.sticky-cta .btn.btn-cta[data-action]{height:52px;min-height:52px}
@media (min-width:768px){
  /* #183024, ивица 1 px rgba(205,178,124,.35), углови 2 px, 8 px унутра и између дугмади, сенка 0 12px 32px;
     лево „Поручи храну“ (злато), десно „Резервиши сто“ (крем). Улазак: одоздо 16 px уз претапање, 240 ms */
  .sticky-cta{left:50%;bottom:24px;translate:-50% 0;display:flex;gap:8px;padding:8px;background:var(--bg-deep);
    border:1px solid rgba(205,178,124,.35);border-radius:2px;box-shadow:0 12px 32px rgba(0,0,0,.3);
    opacity:0;transform:translateY(16px);
    transition:opacity .24s cubic-bezier(.2,.8,.2,1),transform .24s cubic-bezier(.2,.8,.2,1),visibility 0s linear .24s}
  .sticky-cta.is-shown{opacity:1;transform:none;transition:opacity .24s cubic-bezier(.2,.8,.2,1),transform .24s cubic-bezier(.2,.8,.2,1)}
  .sticky-cta .btn.btn-cta[data-action]{min-width:220px}
}
@media (max-width:767px){
  .sticky-cta{left:0;right:0;bottom:0;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px));
    background:var(--bg-deep);border-top:1px solid rgba(205,178,124,.3);transform:translateY(100%);
    transition:transform .24s cubic-bezier(.2,.8,.2,1),visibility 0s linear .24s}
  .sticky-cta.is-shown{transform:none;transition:transform .24s cubic-bezier(.2,.8,.2,1)}
  /* дугмад као на насловној и у траци на десктопу (злато; „Резервиши сто“ пуна крем боја, #183024 текст),
     без подизања и сенке. Унутрашњи размак 5 px: „Резервиши сто“ са иконицом је 166,5 px, дугме на 390 px је 179 px */
  .sticky-cta .btn.btn-cta[data-action],.sticky-cta .btn.btn-cta[data-action]:hover,.sticky-cta .btn.btn-cta[data-action]:focus-visible{min-width:0;padding:0 5px;transform:none;box-shadow:none}
  /* body без доњег размака за траку: трака се склања чим се подножје појави (site.js), па би тај размак
     остао празан зелен појас испод подножја */
}
/* трака на дну: натпис са иконицом стаје тек од 385 px (дугме = (ширина − 32) / 2 ≥ 166,5 + 2 × 5 px);
   уже: без иконица; испод 340 px ни сам натпис не стаје у 15 px / .12em, па 14 px / .1em */
@media (max-width:384px){.sticky-cta .btn-ico{display:none}}
@media (max-width:339px){.sticky-cta .btn.btn-cta[data-action]{font-size:14px;letter-spacing:.1em}}
/* prefers-reduced-motion: без клизања, само претапање */
@media (prefers-reduced-motion:reduce){
  .sticky-cta{transform:none!important}
  .sticky-cta{opacity:0;transition:opacity .3s ease,visibility 0s linear .3s!important}
  .sticky-cta.is-shown{opacity:1;transition:opacity .3s ease!important}
}

/* =========================================================
   ПОДСТРАНИЦЕ (/meni)
   ========================================================= */
.page-head{padding-top:clamp(36px,5.25vw,66px);padding-bottom:clamp(27px,3.75vw,42px)}
.page-head h1{font-weight:600;font-size:clamp(46px,7vw,80px);line-height:1;letter-spacing:-.01em;color:var(--on-dark)}
.page-head .lead{margin:16px 0 0}

/* ---------- мени (празно стање) ---------- */
.empty{max-width:40em;padding:clamp(32px,5vw,56px);border:1px dashed rgba(var(--accent-rgb),.7);border-radius:2px;background:rgba(255,255,255,.28)}
.empty .h2{margin-bottom:14px}
.empty .lead{margin-bottom:28px}

@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* ---------- локација: адреса, радно време, мапа ---------- */
.info .v{font-style:normal;color:var(--on-dark);line-height:1.5}
.maplink{display:inline-flex;align-items:center;min-height:44px;font-size:14.5px;color:var(--accent-soft);text-underline-offset:3px}
.hours{display:grid;grid-template-columns:auto auto;justify-content:start;gap:4px 20px;margin:0;color:var(--on-dark)}
.hours dt{color:var(--on-dark-soft)}
.hours dd{margin:0;font-variant-numeric:tabular-nums}
.map-slot iframe{position:absolute;inset:0;z-index:1;width:100%;height:100%;border:0}

/* ---------- поручивање / резервација (ordering.js убацује CSS за GloriaFood) ---------- */
/* <button> не наслеђује line-height као <a>; овако дугме изгледа исто као линк */
button.btn{line-height:inherit}
/* напомена о ценама (закон): испод „Отворите јеловник“ на /meni и једном у подножју; ситно и пригушено */
.price-note{margin:10px 0 0;font-size:13px;line-height:1.45;color:var(--ink-soft);text-wrap:balance}
/* трака „Назад на сајт“ изнад прозора за поручивање (#gfOrderFrm, ordering.js) */
.order-bar{position:fixed;top:0;left:0;right:0;z-index:999999;height:calc(56px + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0px);background:var(--bg-deep);border-bottom:1px solid var(--line)}
.order-bar-in{display:flex;align-items:center;justify-content:space-between;gap:16px;height:100%}
.order-bar-logo{display:block;width:auto;height:40px}
@media (max-width:339px){.order-bar-logo{display:none}}
