
:root{
  --red:#891714; --red-dark:#66100E; --red-soft:#A8342F;
  --ink:#221A17; --char:#16110F; --cream:#FBF6EF; --cream-2:#F3E9DC;
  --gold:#C9A227; --muted:#6E6159; --line:#E6D9C8;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--cream);color:var(--ink);
  font:16px/1.7 "Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{margin:0;line-height:1.15;letter-spacing:-.01em}
p{margin:0 0 1em}
.wrap{width:min(1140px,100% - 2.5rem);margin-inline:auto}
.eyebrow{font-size:.74rem;font-weight:800;letter-spacing:.24em;text-transform:uppercase;color:var(--red);margin:0 0 .6rem}
.lead{font-size:1.06rem;color:var(--muted);max-width:66ch}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1.3rem;border-radius:999px;
  font-weight:700;font-size:.95rem;text-decoration:none;border:2px solid transparent;cursor:pointer;transition:.15s}
.btn-red{background:var(--red);color:#fff}.btn-red:hover{background:var(--red-dark)}
.btn-ghost{border-color:rgba(255,255,255,.5);color:#fff}.btn-ghost:hover{background:rgba(255,255,255,.12);border-color:#fff}
.btn-line{border-color:var(--line);background:#fff}.btn-line:hover{border-color:var(--ink)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

header.site{position:sticky;top:0;z-index:40;background:rgba(22,17,15,.95);backdrop-filter:blur(6px);border-bottom:2px solid var(--red)}
.bar{display:flex;align-items:center;gap:1rem;min-height:64px}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none}
.brand img{width:42px;height:42px;border-radius:50%;background:#fff}
.brand b{color:#fff;font-size:1.05rem;letter-spacing:.06em}
.brand small{display:block;color:#C9B9AC;font-size:.6rem;letter-spacing:.28em;text-transform:uppercase}
nav.menu{margin-left:auto;display:flex;gap:.15rem}
nav.menu a{color:#EFE3D8;text-decoration:none;font-size:.85rem;font-weight:700;padding:.5rem .7rem;border-radius:8px}
nav.menu a:hover{background:var(--red);color:#fff}
.tel{margin-left:.4rem;white-space:nowrap}
.lang{display:flex;align-items:center;gap:.1rem;margin-left:.5rem;border:1px solid #4A3630;border-radius:999px;padding:2px}
.lang span,.lang a{font-size:.74rem;font-weight:800;letter-spacing:.06em;padding:.32rem .55rem;border-radius:999px;text-decoration:none;color:#C9B9AC}
.lang .on{background:var(--red);color:#fff}
.lang a:hover{background:#3A2B25;color:#fff}
.nav-toggle{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.burger{display:none}
@media (max-width:900px){
  .tel{display:none}
  .burger{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;margin-left:auto;border:1px solid #4A3630;border-radius:10px;cursor:pointer}
  .burger span{width:22px;height:2px;background:#fff;transition:.2s}
  .nav-toggle:checked + .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle:checked + .burger span:nth-child(2){opacity:0}
  .nav-toggle:checked + .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  nav.menu{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:var(--char);padding:.3rem 0 .7rem;border-bottom:3px solid var(--red)}
  .nav-toggle:checked ~ nav.menu{display:flex}
  nav.menu a{padding:.9rem 1.25rem;border-radius:0;border-bottom:1px solid #2A201C;font-size:.95rem}
}

/* hero */
.hero{position:relative;min-height:min(86vh,720px);display:grid;place-items:center;text-align:center;color:#fff;overflow:hidden}
.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,10,9,.62),rgba(15,10,9,.45) 45%,rgba(15,10,9,.82))}
.hero .in{position:relative;z-index:1;padding:4rem 1.25rem}
.hero .seal{width:132px;height:132px;border-radius:50%;background:#fff;padding:6px;margin:0 auto 1.4rem;box-shadow:0 12px 40px rgba(0,0,0,.4)}
.hero h1{font-size:clamp(2.3rem,6vw,4rem);font-weight:900;text-shadow:0 2px 24px rgba(0,0,0,.4)}
.hero .sub{font-size:.8rem;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);margin-top:.7rem;font-weight:700}
.hero p.k{max-width:54ch;margin:1.2rem auto 0;color:#EFE2D8;font-size:1.06rem}
.hero .acts{display:flex;gap:.7rem;justify-content:center;flex-wrap:wrap;margin-top:1.8rem}

section{padding:clamp(3rem,7vw,5rem) 0}
.sec-head{margin-bottom:2rem}
.sec-head h2{font-size:clamp(1.7rem,3.6vw,2.4rem);font-weight:900}
.alt{background:var(--cream-2)}
.dark{background:var(--char);color:#F2E7DE}
.dark .lead{color:#C6B4A8}.dark .eyebrow{color:var(--gold)}

/* story */
.story{display:grid;grid-template-columns:1.05fr .95fr;gap:2.4rem;align-items:center}
@media (max-width:860px){.story{grid-template-columns:1fr}}
.story img{border-radius:16px;box-shadow:0 18px 40px rgba(34,26,23,.18)}
.since{display:inline-flex;align-items:baseline;gap:.5rem;background:var(--red);color:#fff;border-radius:12px;padding:.5rem .9rem;font-weight:900;font-size:1.5rem;margin-bottom:1rem}
.since small{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;opacity:.85}
.pills{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0;margin:1.4rem 0 0}
.pills li{background:#fff;border:1px solid var(--line);border-radius:999px;padding:.4rem .85rem;font-size:.88rem;font-weight:600}

/* menu */
.cats{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(215px,1fr))}
.cat{position:relative;border:0;padding:0;background:none;cursor:pointer;text-align:left;font:inherit;color:inherit}
.cat .box{background:#fff;border:1px solid var(--line);border-radius:16px;padding:1.6rem 1.3rem;height:100%;
  display:flex;flex-direction:column;gap:.4rem;transition:transform .18s,box-shadow .18s,border-color .18s}
.cat:hover .box,.cat:focus-visible .box{transform:translateY(-4px);box-shadow:0 16px 34px rgba(34,26,23,.12);border-color:var(--red)}
.cat .ic{font-size:1.9rem;line-height:1}
.cat h3{font-size:1.2rem;font-weight:800}
.cat span{font-size:.9rem;color:var(--muted)}
.cat .more{margin-top:auto;font-size:.82rem;font-weight:800;color:var(--red);letter-spacing:.04em}

/* gallery */
.gal{display:grid;gap:.9rem;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.gal button{all:unset;cursor:pointer;border-radius:14px;overflow:hidden;position:relative;display:block;background:#000}
.gal img{width:100%;height:230px;object-fit:cover;transition:transform .35s,opacity .25s}
.gal button:hover img,.gal button:focus-visible img{transform:scale(1.06);opacity:.9}
.gal .cap{position:absolute;left:0;right:0;bottom:0;padding:.7rem .85rem;font-size:.86rem;font-weight:700;color:#fff;
  background:linear-gradient(transparent,rgba(0,0,0,.75))}

/* events */
.ev{display:grid;grid-template-columns:.95fr 1.05fr;gap:2.2rem;align-items:center}
@media (max-width:860px){.ev{grid-template-columns:1fr}}
.ev img{border-radius:16px}
.ev ul{list-style:none;padding:0;margin:1rem 0 0;display:grid;gap:.5rem}
.ev li{padding-left:1.6rem;position:relative}
.ev li::before{content:"✦";position:absolute;left:0;color:var(--gold)}

/* contact */
.cgrid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(215px,1fr))}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:1.2rem 1.3rem}
.dark .card{background:#221A17;border-color:#3A2B25}
.card b{display:block;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:.4rem}
.dark .card b{color:var(--gold)}
.card a{font-weight:700;text-decoration:none}.card a:hover{text-decoration:underline}
.note{font-size:.86rem;color:var(--muted)}
.dark .note{color:#BCA99C}

footer{background:#0F0B0A;color:#A08E82;padding:2.2rem 0;font-size:.86rem}
footer .wrap{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center}
footer img{width:46px;height:46px;border-radius:50%;background:#fff}

/* modal */
dialog.m{border:0;padding:0;border-radius:18px;width:min(920px,94vw);max-height:92vh;background:#fff;color:var(--ink);
  box-shadow:0 30px 80px rgba(0,0,0,.45);overflow:hidden}
dialog.m::backdrop{background:rgba(15,10,9,.75)}
.m-in{display:flex;flex-direction:column;max-height:92vh}
.m-top{display:flex;align-items:center;gap:.8rem;padding:1rem 1.2rem;border-bottom:1px solid var(--line)}
.m-top h2{font-size:1.2rem;font-weight:900;flex:1}
.m-top .sub{display:block;font-size:.78rem;font-weight:700;color:var(--muted)}
.m-x,.m-nav{all:unset;cursor:pointer;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;
  background:var(--cream-2);font-size:1.3rem;font-weight:900}
.m-x:hover,.m-nav:hover{background:var(--line)}
.m-body{overflow:auto;padding:1.2rem}
.m-body img{border-radius:12px;width:100%}
.m-cta{display:flex;gap:.6rem;flex-wrap:wrap;padding:1rem 1.2rem;border-top:1px solid var(--line);background:#FCF9F5}
.dish{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px dashed var(--line);padding:.55rem 0}
.dish b{font-weight:700}
@media (max-width:560px){
  dialog.m{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0}
  .m-in{height:100%;max-height:100dvh}
  .m-cta .btn{flex:1;justify-content:center;font-size:.85rem;padding:.7rem .6rem}
}

@media (max-width:900px){
  .lang{margin-left:auto;order:2}
  .burger{margin-left:.4rem;order:3}
  .brand{order:1}
}
@media (max-width:430px){
  .brand small{display:none}
  .brand b{font-size:1rem}
}
footer .fnote{flex-basis:100%;margin:.4rem 0 0;font-size:.8rem;opacity:.85}
footer .fnote a{color:inherit;text-decoration:underline}
