

:root {
    --night: #0f0d0b;
    --coal: #17130f;
    --line: #2b231b;
    --ivory: #ede6da;
    --ash: #a79a87;
    --bronze: #c47a32;
    --amber: #f2b85e;
    --umber: #8a4a20;
    --metal: linear-gradient(135deg, #f2b85e 0%, #c47a32 50%, #8a4a20 100%);
    --display: "Bodoni 72", Didot, "Bodoni MT", "Playfair Display", Georgia, serif;
    --text: Georgia, "Times New Roman", "Noto Serif", serif;
    --wrap: 1180px;
    --gutter: clamp(20px, 4vw, 48px);
}

* { box-sizing: border-box; }

html { background: var(--night); color: var(--ivory); }

body {
    margin: 0;
    font: 17px/1.6 var(--text);
    background: var(--night);
    color: var(--ivory);
    -webkit-font-smoothing: antialiased;
}


body > header,
body > nav,
body > main,
body > footer {
    max-width: calc(var(--wrap) + var(--gutter) * 2);
    margin-inline: auto;
    padding-left: var(--gutter);
    padding-right: var(--gutter);
}

a { color: var(--amber); text-decoration: none; }
a:hover { color: var(--ivory); }
a:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; }

h1, h2, h3 { font-family: var(--display); font-weight: 400; line-height: 1.15; margin: 0; }
h1 { font-size: clamp(30px, 4vw, 46px); letter-spacing: .02em; }
h2 { font-size: clamp(22px, 2.6vw, 30px); }
h3 { font-size: 20px; }

p { margin: 0 0 1em; max-width: 68ch; }
img { display: block; max-width: 100%; height: auto; }
small { display: block; color: var(--ash); font-size: 14px; }
data { font-variant-numeric: tabular-nums; }
figure { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
dl { display: grid; grid-template-columns: max-content 1fr; gap: 8px 28px; margin: 0; max-width: 60ch; }
dt { color: var(--ash); }
dd { margin: 0; }



[itemtype$="WPHeader"] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--line);
}
[itemtype$="WPHeader"] > a { display: block; flex: 0 1 280px; min-width: 0; }

[itemtype$="WPHeader"] svg { display: block; width: 100%; height: auto; max-width: 240px; }


[itemtype$="SiteNavigationElement"] { display: flex; flex-wrap: wrap; gap: 6px 24px; }
[itemtype$="SiteNavigationElement"] a {
    color: var(--ash);
    font-size: 13px;
    letter-spacing: .14em;
    text-transform: uppercase;
    white-space: nowrap;
}
[itemtype$="SiteNavigationElement"] a:hover,
[itemtype$="SiteNavigationElement"] a[aria-current] { color: var(--amber); }


body > [itemtype$="SiteNavigationElement"] {
    padding-top: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--line);
    background: var(--coal);
    box-shadow: 0 0 0 100vmax var(--coal);
    clip-path: inset(0 -100vmax);
    gap: 10px 26px;
}
body > [itemtype$="SiteNavigationElement"] a { text-transform: none; letter-spacing: .02em; font-size: 15px; }
body > [itemtype$="SiteNavigationElement"] a data { color: var(--bronze); margin-left: 5px; font-size: 13px; }
body > [itemtype$="SiteNavigationElement"] a:last-child { color: var(--bronze); letter-spacing: .06em; }



[itemprop="mainContentOfPage"] {
    padding-top: 44px;
    padding-bottom: 80px;
}
[itemprop="mainContentOfPage"] > h1 { margin-bottom: 18px; }
[itemprop="mainContentOfPage"] > h1::after {
    content: "";
    display: block;
    width: 72px;
    height: 2px;
    margin-top: 14px;
    background: var(--metal);
}
[itemprop="description"] { color: var(--ivory); }
[itemprop="abstract"] { color: var(--ash); letter-spacing: .04em; margin-bottom: 32px; }
[itemprop="abstract"] data { color: var(--amber); }

[itemtype$="BreadcrumbList"] { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 26px; font-size: 14px; color: var(--ash); }
[itemtype$="BreadcrumbList"] [itemtype$="ListItem"] + [itemtype$="ListItem"]::before { content: "·"; margin-right: 8px; color: var(--umber); }
[itemtype$="BreadcrumbList"] a { color: var(--ash); }
[itemtype$="BreadcrumbList"] a:hover { color: var(--amber); }



[itemprop="mainContentOfPage"] > h2 { margin: 44px 0 20px; }



ul[itemtype$="ItemList"] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(176px, 100%), 1fr));
    gap: 28px 20px;
    margin: 0 0 8px;
}
[itemtype$="ItemList"] [itemtype$="Person"] a { display: block; color: inherit; }
[itemtype$="ItemList"] figure > img,
[itemtype$="ItemList"] figure > span {
    display: block;
    width: 100%;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    background: var(--coal);
    filter: saturate(.92);
    transition: filter .18s ease;
}
[itemtype$="ItemList"] a:hover figure > img { filter: saturate(1.05) brightness(1.06); }
[itemtype$="ItemList"] figcaption { padding-top: 12px; }

[itemtype$="ItemList"] figcaption [itemprop="disambiguatingDescription"] {
    display: block;
    margin-bottom: 4px;
    padding-left: 9px;
    border-left: 2px solid var(--amber);
    color: var(--bronze);
    font-family: var(--text);
    font-size: 11px;
    letter-spacing: .22em;
    text-transform: uppercase;
    line-height: 1.4;
}
[itemtype$="ItemList"] figcaption [itemprop="name"] {
    display: block;
    font-family: var(--display);
    font-size: 21px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ivory);
}
[itemtype$="ItemList"] a:hover figcaption [itemprop="name"] { color: var(--amber); }

[itemtype$="ItemList"] figcaption data { display: inline-block; margin-top: 5px; color: var(--ash); font-size: 14px; letter-spacing: .04em; }
[itemtype$="ItemList"] figcaption data + data { margin-left: 12px; color: var(--amber); }


div[itemtype$="ItemList"] > h2 { margin: 36px 0 6px; color: var(--ash); font-size: 15px; letter-spacing: .18em; text-transform: uppercase; font-family: var(--text); }
div[itemtype$="ItemList"] > p { margin: 0 0 16px; }
div[itemtype$="ItemList"] > ul {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr));
    gap: 18px 28px;
}
[itemtype$="City"] { border-top: 1px solid var(--line); padding-top: 10px; }
[itemtype$="City"] a { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; color: var(--ivory); font-family: var(--display); font-size: 20px; }
[itemtype$="City"] a:hover { color: var(--amber); }
[itemtype$="City"] data { color: var(--bronze); font-family: var(--text); font-size: 14px; }
[itemtype$="City"] p { margin: 8px 0 0; color: var(--ash); font-size: 15px; }



[itemprop="mainContentOfPage"] > nav[itemtype$="SiteNavigationElement"] { margin-top: 44px; align-items: center; gap: 10px; }
[itemprop="mainContentOfPage"] > nav[itemtype$="SiteNavigationElement"] a {
    font-size: 15px;
    letter-spacing: normal;
    text-transform: none;
    padding: 6px 14px;
    border: 1px solid var(--line);
    border-radius: 6px;
    color: var(--ivory);
}
[itemprop="mainContentOfPage"] > nav[itemtype$="SiteNavigationElement"] a:hover { border-color: var(--amber); color: var(--amber); }

[itemprop="mainContentOfPage"] > nav[itemtype$="SiteNavigationElement"] data {
    padding: 6px 14px;
    border-radius: 6px;
    background: var(--metal);
    color: var(--night);
    font-size: 15px;
    font-weight: 600;
}
[itemprop="mainContentOfPage"] > nav[itemtype$="SiteNavigationElement"] span[aria-hidden] { color: var(--ash); padding: 0 2px; }


[itemtype$="FAQPage"] { margin-top: 64px; max-width: 72ch; }
[itemtype$="Question"] { padding: 22px 0; border-top: 1px solid var(--line); }
[itemtype$="Question"] h2 { font-size: 22px; margin: 0 0 10px; }
[itemprop="acceptedAnswer"] p { margin: 0; color: var(--ash); }



article[itemtype$="Person"] h1 data { color: var(--amber); font-size: .6em; margin-left: .3em; }


[itemtype$="ImageGallery"] {
    display: flex;
    gap: 14px;
    margin: 28px 0 0;
    padding-bottom: 4px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}
[itemtype$="ImageGallery"]::-webkit-scrollbar { display: none; }
[itemtype$="ImageGallery"] a { flex: 0 0 clamp(240px, 32vw, 330px); scroll-snap-align: start; }
[itemtype$="ImageGallery"] img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }

article[itemtype$="Person"] > nav[itemtype$="SiteNavigationElement"] { gap: 8px; margin-top: 12px; }
article[itemtype$="Person"] > nav img { width: 54px; height: 72px; object-fit: cover; opacity: .55; }
article[itemtype$="Person"] > nav a:hover img { opacity: 1; }

[itemprop="contactPoint"] { display: flex; flex-wrap: wrap; gap: 14px; margin: 32px 0; max-width: none; }
[itemprop="contactPoint"] a {
    display: inline-block;
    padding: 14px 26px;
    border: 1px solid var(--bronze);
    color: var(--amber);
    letter-spacing: .1em;
    text-transform: uppercase;
    font-size: 14px;
}
[itemprop="contactPoint"] a:first-child { background: var(--metal); color: var(--night); border-color: transparent; }
[itemprop="contactPoint"] a:hover { color: var(--ivory); border-color: var(--amber); }
[itemprop="contactPoint"] a:first-child:hover { color: var(--night); filter: brightness(1.08); }


[itemtype$="ImageGallery"] a[itemtype$="VideoObject"] {
    position: relative;
    display: block;
    background: linear-gradient(135deg, var(--coal), var(--umber));
}
[itemtype$="ImageGallery"] a[itemtype$="VideoObject"] img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }

[itemtype$="ImageGallery"] a[itemtype$="VideoObject"] span {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 68px; height: 68px; border-radius: 50%;
    background: rgba(15, 13, 11, .6); border: 2px solid var(--amber);
    display: flex; align-items: center; justify-content: center;
}
[itemtype$="ImageGallery"] a[itemtype$="VideoObject"] span::before {
    content: ""; margin-left: 5px; border-style: solid; border-width: 12px 0 12px 19px;
    border-color: transparent transparent transparent var(--amber);
}


article[itemtype$="Person"] > nav a[itemtype$="VideoObject"] { position: relative; }
article[itemtype$="Person"] > nav a[itemtype$="VideoObject"]:not(:has(img)) {
    background: linear-gradient(135deg, var(--coal), var(--umber));
}
article[itemtype$="Person"] > nav a[itemtype$="VideoObject"]::after {
    content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-45%, -50%);
    border-style: solid; border-width: 7px 0 7px 11px;
    border-color: transparent transparent transparent var(--amber);
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .7));
}


[role="dialog"][aria-label="Видеоплеер"] {
    position: fixed; inset: 0; z-index: 100; background: rgba(15, 13, 11, .88);
    display: flex; align-items: center; justify-content: center; padding: 24px;
}
[role="dialog"][aria-label="Видеоплеер"][hidden] { display: none; }
[role="dialog"][aria-label="Видеоплеер"] > div { position: relative; display: inline-block; max-width: 92vw; max-height: 88vh; }
[role="dialog"][aria-label="Видеоплеер"] video { display: block; max-width: 92vw; max-height: 88vh; background: #000; }
[role="dialog"][aria-label="Видеоплеер"] button {
    position: absolute; top: -44px; right: 0; border: 1px solid var(--bronze); background: var(--metal);
    color: var(--night); letter-spacing: .1em; text-transform: uppercase; font-size: 13px;
    padding: 8px 18px; cursor: pointer;
}
[role="dialog"][aria-label="Видеоплеер"] button:hover { filter: brightness(1.08); }

article[itemtype$="Person"] section { margin-top: 40px; }
article[itemtype$="Person"] section h2 { margin-bottom: 14px; }
[itemprop="knowsAbout"] { display: flex; flex-wrap: wrap; gap: 8px; max-width: none; }
[itemprop="knowsAbout"] span { padding: 5px 12px; border: 1px solid var(--line); color: var(--ash); font-size: 15px; }

[itemtype$="Review"] { margin: 0 0 22px; padding-left: 18px; border-left: 2px solid var(--umber); }
[itemtype$="Review"] footer { color: var(--ash); font-size: 14px; }
[itemtype$="Review"] [itemprop="comment"] { color: var(--ash); padding-left: 18px; }



section[itemtype$="WebPageElement"] { max-width: 560px; margin: 24px auto; text-align: center; }
section[itemtype$="WebPageElement"] img { margin: 0 auto 24px; }
section[itemtype$="WebPageElement"] h1::after { margin-left: auto; margin-right: auto; }
section[itemtype$="WebPageElement"] p { margin: 0 auto 28px; }
section[itemtype$="WebPageElement"] > a {
    display: inline-block;
    margin: 0 8px 18px;
    padding: 14px 30px;
    background: var(--metal);
    color: var(--night);
    letter-spacing: .1em;
    text-transform: uppercase;
    font-size: 14px;
}
section[itemtype$="WebPageElement"] > a + small + a,
section[itemtype$="WebPageElement"] > a + a { background: none; color: var(--ash); border: 1px solid var(--line); }
section[itemtype$="WebPageElement"] small { margin-bottom: 24px; }


article[itemtype$="WebPageElement"] { max-width: 68ch; }
article[itemtype$="WebPageElement"] h2 { margin: 36px 0 10px; font-size: 22px; }
article[itemtype$="WebPageElement"] p { color: var(--ash); }
article[itemtype$="WebPageElement"] [itemprop="description"] { color: var(--ivory); }



[itemtype$="WPFooter"] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px 32px;
    padding-top: 28px;
    padding-bottom: 44px;
    border-top: 1px solid var(--line);
    color: var(--ash);
    font-size: 14px;
}
[itemtype$="WPFooter"] p { margin: 0; }



@media (max-width: 640px) {
    body { font-size: 16px; }
    [itemtype$="WPHeader"] { flex-wrap: wrap; gap: 14px; padding-top: 16px; padding-bottom: 16px; }
    [itemtype$="WPHeader"] > a { flex-basis: 200px; }
    [itemprop="mainContentOfPage"] { padding-top: 32px; padding-bottom: 56px; }
    ul[itemtype$="ItemList"] { grid-template-columns: repeat(auto-fill, minmax(min(150px, 100%), 1fr)); gap: 24px 16px; }
    [itemtype$="ItemList"] figcaption [itemprop="name"] { font-size: 18px; }
    [itemtype$="ImageGallery"] a { flex-basis: 78%; }
    [itemprop="contactPoint"] a { flex: 1 1 100%; text-align: center; }
    [itemtype$="WPFooter"] { flex-direction: column; }
}
