@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:500 800;font-display:swap;src:url(type/bricolage-latin.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:'Manrope';font-style:normal;font-weight:400 800;font-display:swap;src:url(type/manrope-latin.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:'Manrope';font-style:normal;font-weight:400 800;font-display:swap;src:url(type/manrope-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Readex Pro';font-style:normal;font-weight:400 700;font-display:swap;src:url(type/readex-arabic.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}

/* =====================================================================
   SITE CHROME — header, type, buttons, footer. Shared with every fair
   page; a fair page adds its own --g-fair-* theme on top of this.
   The calendar is the house page: warm paper, ink, and one red kept for
   the mark, today's date, the primary action and link hover.
   ===================================================================== */
:root{
  --g-red:#D71920; --g-red-ink:#B3131A; --g-red-soft:#FBE9E9;
  --g-paper:#FAF8F4; --g-paper-2:#F2EFE8; --g-white:#FFFFFF;
  --g-ink:#171614; --g-soft:#3E3B36; --g-muted:#726D65; --g-faint:#A8A39A;
  --g-line:#E5E0D6; --g-line-2:#D1CBBF;
  --g-display:"Bricolage Grotesque","Manrope","Readex Pro",system-ui,sans-serif;
  --g-sans:"Manrope","Readex Pro",system-ui,-apple-system,"Segoe UI",sans-serif;
  --g-wrap:1120px; --g-r:12px; --g-r-s:8px;
  --g-head:80px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--g-paper);color:var(--g-ink);font:16px/1.6 var(--g-sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--g-ink)}a:hover{color:var(--g-red-ink)}
img,svg{display:block;max-width:100%}
.wrap{max-width:var(--g-wrap);margin:0 auto;padding:0 16px}
@media(min-width:900px){.wrap{padding:0 32px}}
h1,h2,h3{margin:0;font-family:var(--g-display);font-weight:700;letter-spacing:-.02em;line-height:1.1;font-variation-settings:"opsz" 96}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:focus-visible{outline:2px solid var(--g-red);outline-offset:3px;border-radius:2px}
.cf-eyebrow{display:inline-flex;align-items:center;gap:10px;font:800 11.5px/1 var(--g-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--g-muted)}
.cf-eyebrow::before{content:"";width:18px;height:1.5px;background:var(--g-red);flex:none}
.ar{width:12px;height:12px;flex:none}

/* ---------- header ---------- */
header.top{background:var(--g-paper);border-bottom:1px solid var(--g-line)}
header.top .wrap{display:flex;align-items:center;gap:28px;min-height:var(--g-head)}
/* BRAND: the final emblem (assets/cfg-lockup.svg, 1560×480: red gate, ink lettering, red square dot on Guide). The <img> alt is the accessible name. */
.cf-brand{display:block;flex:none;line-height:0}
.cf-brand img{height:36px;width:auto}
.cf-brand:hover{opacity:.85}
nav.main{display:flex;align-items:center;gap:22px;margin-inline-start:auto;font-size:14.5px;font-weight:600}
nav.main > a{color:var(--g-soft);text-decoration:none;padding:4px 0;border-bottom:1.5px solid transparent}
nav.main > a:hover{color:var(--g-ink)}
nav.main > a[aria-current]{color:var(--g-ink);border-bottom-color:var(--g-ink)}
nav.main a.cta{color:var(--g-ink);border:1.5px solid var(--g-ink);border-radius:var(--g-r-s);padding:8px 14px;font-weight:700;margin-inline-start:6px;transition:background .15s ease,color .15s ease}
nav.main a.cta:hover{background:var(--g-ink);color:var(--g-paper)}
@media(max-width:640px){
  :root{--g-head:64px}
  header.top .wrap{gap:12px}
  .cf-brand img{height:30px}
  nav.main{gap:8px}nav.main > a:not(.cta){display:none}
  nav.main a.cta{padding:7px 11px;font-size:13.5px;white-space:nowrap;margin:0}
}

/* ---------- buttons ---------- */
.cf-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:var(--g-r-s);padding:13px 20px;font:800 15px/1.2 var(--g-sans);text-decoration:none;transition:transform .15s ease,background .15s ease,border-color .15s ease;cursor:pointer}
.cf-btn:active{transform:translateY(1px)}
.cf-btn.primary{background:var(--g-red);color:#fff}.cf-btn.primary:hover{background:var(--g-red-ink);color:#fff}
.cf-btn.ghost{background:var(--g-white);color:var(--g-ink);border:1px solid var(--g-line-2)}.cf-btn.ghost:hover{border-color:var(--g-ink);color:var(--g-ink)}
.cf-btn .chev{width:14px;height:14px;flex:none}

/* selects (calendar head) */
.sel{position:relative;min-width:0}
.sel select{appearance:none;-webkit-appearance:none;width:100%;font:600 14px/1.3 var(--g-sans);color:var(--g-ink);background:var(--g-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4.5 6 8.5 10 4.5' fill='none' stroke='%23171614' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 11px center;border:1px solid var(--g-line-2);border-radius:var(--g-r-s);padding:9px 34px 9px 12px;cursor:pointer;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
.sel select:hover{border-color:var(--g-ink)}
.sel.is-set select{border-color:var(--g-ink);background-color:var(--g-ink);color:var(--g-paper);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4.5 6 8.5 10 4.5' fill='none' stroke='%23FAF8F4' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.sel select option{color:var(--g-ink);background:var(--g-white)}
.exp{display:inline-block;font:800 10px/1 var(--g-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--g-muted);border:1px dashed var(--g-line-2);border-radius:4px;padding:4px 6px 3px;vertical-align:2px;white-space:nowrap}

/* ---------- footer ---------- */
footer{background:var(--g-ink);color:#C9C5BD;font-size:14px;padding:34px 0 38px}
footer .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 48px;align-items:start}
footer p{margin:0 0 10px;max-width:80ch}
footer strong{color:#fff}
footer a{color:#fff}footer a:hover{color:#FFB3B5}
footer .fbrand{display:inline-block;line-height:0;background:#fff;border-radius:8px;padding:8px 12px}
footer .fbrand img{height:30px;width:auto}
footer .small{grid-column:1/-1;font-size:13px;color:#9A958C;border-top:1px solid rgba(255,255,255,.12);padding-top:14px;margin-top:6px;max-width:none}
@media(max-width:760px){footer .wrap{grid-template-columns:1fr}}


/* =====================================================================
   LANGUAGES — header switcher, right-to-left, per-script type.
   ===================================================================== */
.lang{position:relative;flex:none}
/* closed: an outlined box with the globe and the current language code; on phones the globe alone */
.lang summary{list-style:none;display:flex;align-items:center;justify-content:center;gap:7px;height:36px;padding:0 11px;cursor:pointer;
  border:1px solid var(--g-line-2);border-radius:var(--g-r-s);color:var(--g-ink);font:700 13px/1 var(--g-sans);letter-spacing:.03em;user-select:none}
.lang summary::-webkit-details-marker{display:none}
.lang summary:hover,.lang[open] summary{border-color:var(--g-ink)}
.lang summary svg{width:15px;height:15px;flex:none}
/* open: a plain two-column list of language names under a small heading */
.lang .cf-menu{position:absolute;inset-inline-end:0;top:calc(100% + 10px);z-index:30;width:292px;padding:14px 18px 10px;
  background:var(--g-white);border:1px solid var(--g-line);border-radius:var(--g-r-s);box-shadow:0 16px 36px rgba(23,22,20,.10)}
.lang .menu-h{margin:0 0 6px;font:700 11.5px/1.3 var(--g-sans);color:var(--g-muted)}
.lang .cf-menu ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:18px}
.lang .cf-menu a,.lang .cf-menu button{all:unset;box-sizing:border-box;display:block;width:100%;padding:8px 0;cursor:pointer;color:var(--g-ink);font:500 15px/1.3 var(--g-sans)}
.lang .cf-menu a:hover,.lang .cf-menu button:hover{color:var(--g-red-ink)}
.lang .cf-menu [aria-current]{color:var(--g-red);font-weight:700}
/* every name lines up with its column, Arabic and Persian included */
.lang .cf-menu li > *{text-align:left}
[dir=rtl] .lang .cf-menu li > *{text-align:right}
.lang .cf-menu :focus-visible{outline:2px solid var(--g-red);outline-offset:2px}
/* /book/: the booking app's own <select> stays in the page for the app to drive, out of sight */
select.ib{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;inset-inline-end:0;top:0}
.lang .cf-menu.long{width:min(330px,calc(100vw - 32px))}

.cta .s{display:none}
@media(max-width:640px){
  .lang summary{width:36px;padding:0}.lang summary .code{display:none}
  .lang .cf-menu{width:min(292px,calc(100vw - 32px))}
  .cta .l{display:none}.cta .s{display:inline}
}
/* right-to-left: mirror the arrows, keep the date numerals as they are */
[dir=rtl] .ar,[dir=rtl] .chev,[dir=rtl] .mnav .nav svg{transform:scaleX(-1)}
[dir=rtl] .sel select{background-position:left 11px center;padding:9px 12px 9px 34px}
/* Arabic letters join: no tracking, no small caps */
:lang(ar) *,:lang(fa) *{letter-spacing:0!important}
:lang(ar) body,:lang(fa) body{line-height:1.75}

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

/* /book/: a slim footer */
nav.main > a.on{color:var(--g-ink);border-bottom-color:var(--g-ink)}
nav.main > a.cta.on{border-bottom-color:var(--g-ink)}
footer.bk .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
footer.bk p{margin:0}
@media(max-width:640px){.bookpage nav.main a.cta{display:none}}

/* text pages (About) */
main.page{padding:40px 0 72px}
.cf-prose{max-width:720px}
.cf-prose .cf-crumbs{font-size:13.5px;color:var(--g-muted);margin:0 0 18px}.cf-prose .cf-crumbs a{color:inherit}
.cf-prose h1{font-size:clamp(32px,4.4vw,48px);margin:0 0 18px}
.cf-prose h2{font-size:clamp(21px,2.3vw,26px);margin:40px 0 12px}
.cf-prose p{margin:0 0 14px;color:var(--g-soft);font-size:17px;line-height:1.7}
.cf-prose p.lede{font-size:19px;color:var(--g-ink);line-height:1.6}
.cf-prose .exp{display:inline-block;font:800 10px/1 var(--g-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--g-muted);border:1px dashed var(--g-line-2);border-radius:4px;padding:4px 6px 3px;vertical-align:2px}
@media(max-width:640px){main.page{padding:28px 0 56px}.cf-prose p{font-size:16px}.cf-prose p.lede{font-size:17.5px}}
.cf-prose ul.nf{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:8px}
.cf-prose ul.nf li{display:flex;gap:12px;align-items:baseline;font-size:17px}.cf-prose ul.nf li span{color:var(--g-muted);font-size:14px}
