/* Zebra's own look, taken from @zebra__restaurant on Instagram (Nov 2026): black ground, rough black and white zebra
   stripes, coral red and turquoise lettering, tall condensed capitals, real photos of sinia on wooden boards.
   Loaded after site.css on Zebra's pages only. Other restaurants keep their own colour. */
:root{
  --paper:#0B0B0B; --paper-2:#141414; --card:#161616; --line:#2A2A2A; --line-2:#3A3A3A;
  --ink:#FFFFFF; --ink-2:#E2E2E2; --ink-3:#A8A8A8;
  --coral:#EE4B50; --coral-btn:#D7353B; --coral-2:#FF6B70; --turq:#4CD4DC; --turq-soft:rgba(76,212,220,.12);
  --forest:#D7353B; --forest-2:#4CD4DC; --forest-soft:rgba(238,75,80,.14);
  --saffron:#EE4B50; --saffron-2:#FF6B70; --saffron-soft:rgba(238,75,80,.14); --brass:#4CD4DC;
  --ok:#5BE38A; --ok-soft:rgba(48,209,88,.14); --warn:#FFB340; --warn-soft:rgba(255,159,10,.14); --bad:#FF6B70; --bad-soft:rgba(255,69,58,.14);
  --display:"Archivo","Arial Narrow","Roboto Condensed",sans-serif; --ui:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mark-cut:#0B0B0B;
  --stripes:repeating-linear-gradient(100deg,#0B0B0B 0 9px,#F2F2F2 9px 15px,#0B0B0B 15px 22px,#F2F2F2 22px 26px);
}
body{background:var(--paper);color:var(--ink);font-stretch:100%}
a{color:var(--turq)} a:hover{color:#8FE7EC}
::selection{background:var(--coral);color:#fff}
:focus-visible{outline-color:var(--turq)}

/* the lettering: tall condensed capitals, like their posters */
h1,h2{font-family:var(--display);font-stretch:68%;font-weight:900;text-transform:uppercase;letter-spacing:.005em;font-variation-settings:normal;line-height:.95}
h1{font-size:clamp(52px,9vw,104px)}
h2{font-size:clamp(36px,5.4vw,60px)}
h3{font-family:var(--display);font-stretch:85%;font-weight:800;letter-spacing:0;font-variation-settings:normal}
h1 .underline{color:var(--coral);text-decoration:none;background:none}
h1 .underline::after,h1 .underline::before{display:none}
.eyebrow{color:var(--turq);font-weight:700}
.eyebrow::before{background:var(--coral)}
.lede,.muted{color:var(--ink-2)}

/* a strip of zebra hide under the header and above the footer */
.hd{background:rgba(11,11,11,.94)!important;border-bottom:0!important;box-shadow:none!important;position:sticky}
.hd::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:8px;background:var(--stripes);pointer-events:none}
.ft{position:relative;background:#000!important;margin-top:40px}
.ft::before{content:"";position:absolute;left:0;right:0;top:-8px;height:8px;background:var(--stripes)}
.brand,.brand__w{color:#fff}
.brand__w{font-family:var(--display);font-stretch:75%;font-weight:900;letter-spacing:.12em}
.brand__w small{color:var(--ink-3);letter-spacing:.14em}
.nav a{color:var(--ink-2)} .nav a:hover,.nav a[aria-current]{color:#fff}
.nav a[aria-current]{box-shadow:inset 0 -3px 0 var(--coral)}
.lang{color:var(--ink-2)}
.burger{color:#fff}

/* buttons: coral like "ANDIKA", white outline for the rest */
.btn{border-color:var(--line-2);color:#fff;background:transparent;font-weight:700}
.btn:hover{border-color:#fff;background:rgba(255,255,255,.06);color:#fff}
.btn--pri{background:var(--coral-btn);border-color:var(--coral-btn);color:#fff}
.btn--pri:hover{background:#BF2B31;border-color:#BF2B31;color:#fff}
.btn--wa{border-color:#25D366;color:#5BE38A} .btn--wa:hover{background:#1DA851;border-color:#1DA851;color:#fff}

/* open / closed pill */
.st{background:transparent;border-color:var(--line-2);color:#fff}
.st--open{border-color:rgba(91,227,138,.5);color:#5BE38A}
.st--closed{border-color:rgba(255,107,112,.5);color:var(--coral-2)}

/* surfaces */
.card,.dish,.item,.faq,.note,.visit,.way,.week,.map,.facts > *,.cols > *,.mhead,.mbar{background:var(--card);border-color:var(--line);color:var(--ink)}
.facts,.ways{border-color:var(--line)}
.chip{background:var(--paper-2);border-color:var(--line-2);color:var(--ink-2)}
.chip--soldout{color:var(--coral-2)}
.item__price,.dish b,.price{color:#fff}
.hero__img{border-radius:18px;overflow:hidden}
.hero__img figcaption{background:rgba(0,0,0,.72)}
.msearch input{background:var(--card);color:#fff;border-color:var(--line-2)}
.msearch input::placeholder{color:var(--ink-3)}
.cats a,.cats button{background:transparent;border-color:var(--line-2);color:var(--ink-2)}
.cats a:hover,.cats [aria-current],.cats .is-on{background:#fff;color:#000;border-color:#fff}
.mcat__h{border-color:#fff}
.mbar{background:rgba(11,11,11,.96)!important}
.note--ok{background:var(--ok-soft);color:#BFF5D0;border-color:transparent}
.note--warn{background:var(--warn-soft);color:#FFE0B0;border-color:transparent}
.ft p,.ft address,.ft li,.hrs dt{color:#BDBDBD}
.map__pin b{background:var(--coral-btn)}
.tour{background:#000}

/* the hero: a zebra hide frame behind the photo, as on their posts */
.hero__img{box-shadow:0 0 0 8px #0B0B0B,0 0 0 14px #F2F2F2,0 30px 80px -20px rgba(0,0,0,.9)}
.sec__h h2::after{content:"";display:block;width:64px;height:6px;margin-top:12px;background:var(--stripes);border-radius:2px}
