html {
  font-size: 16px;
}

body.almaty-guide-site {
  margin: 0;
  max-width: none;
  color: #102a43;
  background: #fcfdfc;
}

body.almaty-guide-site .site-header {
  background: rgba(255, 255, 255, 0.97);
  border-bottom: 1px solid rgba(16, 42, 67, 0.08);
}

body.almaty-guide-site .topline {
  padding: 9px 0;
  color: #fff;
  background: #102a43;
  font-size: 0.74rem;
  text-align: center;
}

.almaty-main {
  min-height: 50vh;
  overflow: clip;
}

/*
 * GeneratePress adds a legacy inner wrapper to rendered Group blocks. Keep it
 * layout-transparent so the native Gutenberg groups still participate in the
 * Grid/Flex layouts defined by the Almaty design system. This also neutralizes
 * GeneratePress' default padding on every nested group without affecting the
 * block editor or non-project content.
 */
.almaty-main .wp-block-group > .wp-block-group__inner-container {
  display: contents;
  max-width: none;
  margin: 0;
  padding: 0;
}

.almaty-main > .wp-block-group,
.almaty-main > .wp-block-cover,
.almaty-main > .wp-block-html {
  margin-block: 0;
}

.desktop-nav .almaty-menu,
.mobile-menu .almaty-mobile-list,
.mobile-menu .almaty-menu {
  display: contents;
  margin: 0;
  padding: 0;
  list-style: none;
}

.desktop-nav .almaty-menu li,
.mobile-menu .almaty-mobile-list li,
.mobile-menu .almaty-menu li {
  margin: 0;
}

.desktop-nav .almaty-menu a {
  opacity: 0.76;
}

.mobile-menu nav .almaty-mobile-list,
.mobile-menu nav .almaty-menu {
  display: grid;
}

.mobile-menu nav .almaty-mobile-list a,
.mobile-menu nav .almaty-menu a {
  display: block;
}

body.admin-bar .article-aside {
  top: 56px;
}

.wp-block-image img {
  border-radius: 18px;
}

.navigation.pagination {
  margin-top: 40px;
}

.nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.page-numbers {
  min-width: 42px;
  min-height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid #cbd7d1;
  border-radius: 999px;
}

.page-numbers.current {
  color: #fff;
  background: #102a43;
}

.source-note {
  display: grid;
  gap: 8px;
  margin: 20px 0 42px;
  padding: 24px;
  border: 1px solid #d6e2dc;
  border-radius: 18px;
  background: #f3f8f5;
}

.source-note strong {
  color: #102a43;
}

.source-note a {
  font-weight: 750;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.source-note small {
  color: #64778a;
}

/* Native Gutenberg content architecture. */
.breadcrumb-line,
.article-meta,
.fact-card p,
.info-row p,
.source-note p,
.aside-nav p,
.aside-note,
.hub-stat p,
.guide-float p,
.guide-category p,
.guide-check p,
.guide-destination-copy p {
  margin: 0;
}

.breadcrumb-line {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.article-lead {
  margin-top: 0;
  color: #102a43 !important;
  font-size: 1.25rem !important;
  line-height: 1.65 !important;
}

.article-quote p {
  margin: 0;
  color: inherit !important;
  font: inherit !important;
  line-height: inherit !important;
}

.fact-label {
  margin-bottom: 8px !important;
  color: #64778a !important;
  font-size: 0.7rem !important;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.fact-value {
  color: #102a43 !important;
  line-height: 1.35 !important;
}

.info-label {
  font-size: 0.82rem !important;
}

.info-value {
  color: #4f6271 !important;
}

.source-review {
  color: #64778a !important;
  font-size: 0.8rem !important;
  line-height: 1.55 !important;
}

.aside-note {
  color: #526b61 !important;
  font-size: 0.82rem !important;
  line-height: 1.55 !important;
}

.guide-actions .wp-block-button__link,
.hub-callout .wp-block-button__link,
.guide-cta .wp-block-button__link {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 0 22px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-weight: 750;
}

.guide-actions .button-primary .wp-block-button__link {
  color: #fff;
  background: #ff6542;
}

.guide-actions .button-secondary .wp-block-button__link,
.hub-callout .button-secondary .wp-block-button__link {
  border-color: #b9c8c1;
  color: #102a43;
  background: rgba(255, 255, 255, 0.72);
}

.guide-cta .wp-block-button__link {
  color: #102a43;
  background: #fff;
}

.guide-category-title {
  margin: 0;
  font-size: 1rem;
  line-height: 1.35;
}

.guide-category-description {
  margin-top: 4px !important;
  color: #64778a;
  font-size: 0.82rem;
}

.guide-category-icon {
  margin-bottom: 40px !important;
}

.guide-category-icon span {
  margin-bottom: 0;
}

.guide-float-title {
  font-size: 1.02rem;
}

.guide-float-text {
  margin-top: 4px !important;
  color: #64778a;
  font-size: 0.82rem;
}

.guide-destination-label {
  color: #d5e1e8;
  font-size: 0.82rem;
}

.guide-check-number {
  flex: 0 0 auto;
}

.guide-check-text {
  color: #102a43;
}

.hub-card-label {
  color: #64778a;
  font-size: 0.82rem;
}

.hub-stat-value {
  color: #102a43;
  font-size: 2rem;
  line-height: 1.1;
}

.hub-stat-label {
  margin-top: 20px !important;
  color: #64778a;
  font-size: 0.78rem;
}

.guide-visual > .wp-block-image,
.guide-travel-grid > .wp-block-image,
.guide-destination > .wp-block-image,
.hub-card > .wp-block-image {
  margin: 0;
}

.editor-styles-wrapper .wrap {
  width: 100%;
  max-width: 1180px;
}

.editor-styles-wrapper .article-aside {
  position: static;
}

.editor-styles-wrapper .subpage-hero,
.editor-styles-wrapper .article-shell,
.editor-styles-wrapper .guide-section,
.editor-styles-wrapper .hub-section {
  border-radius: 8px;
  outline: 1px dashed rgba(16, 42, 67, 0.14);
  outline-offset: -1px;
}

.screen-reader-text:focus {
  clip: auto !important;
  width: auto;
  height: auto;
}

@media (max-width: 760px) {
  body.almaty-guide-site .site-header {
    position: relative;
  }

  .mobile-menu nav {
    border: 1px solid #dbe4df;
  }
}


/* Homepage — Gutenberg adaptations (2026-07-21). */
.guide-hero h1 em {
  font-style: normal;
  color: #ff6542;
}

.guide-hero-lead {
  max-width: 540px;
  margin: 26px 0 30px;
  color: #64778a;
  font-size: 1.06rem;
}

p.section-heading-link {
  margin: 0;
}

.guide-travel-lead {
  color: #64778a;
}

.guide-check .guide-check-number {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 50%;
  color: #fff;
  background: #ff6542;
  font-size: 0.75rem;
}

.guide-story-lead {
  max-width: 760px;
  color: #64778a;
  font-size: 1.1rem;
}


/* Footer menus — Gutenberg adaptations (2026-07-21). */
.footer-links ul.footer-menu {
  margin: 0;
  padding: 0;
  list-style: none;
  display: contents;
}

.footer-links li {
  margin: 0;
}

.footer-links li a {
  display: block;
}


/* Block library page (2026-07-21). */
p.library-label {
  margin: 46px 0 14px;
  padding-top: 16px;
  border-top: 2px dashed #b8c9c1;
  color: #8a9aa8;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}


/* ==========================================================================
   Micro-fixes 2026-07-21
   ========================================================================== */

/* --- 1. Category card icons -------------------------------------------------
   The icon is drawn by the card itself from an `icon-*` class, so editors
   cannot delete or garble it. To change an icon, edit the card's
   Advanced → Additional CSS class and swap the icon-* name. */

.guide-category[class*="icon-"]::before {
  content: "";
  display: block;
  width: 46px;
  height: 46px;
  margin-bottom: 40px;
  border-radius: 50%;
  background-color: #102a43;
  background-image: var(--almaty-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}

.icon-explore {
  --almaty-icon: url("data:image/svg+xml,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'><circle%20cx='12'%20cy='12'%20r='10'/><polygon%20points='16.24%207.76%2014.12%2014.12%207.76%2016.24%209.88%209.88%2016.24%207.76'/></svg>");
}

.icon-mountain {
  --almaty-icon: url("data:image/svg+xml,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'><path%20d='m8%203%204%208%205-5%205%2015H2L8%203z'/></svg>");
}

.icon-travel {
  --almaty-icon: url("data:image/svg+xml,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'><path%20d='M17.8%2019.2%2016%2011l3.5-3.5C21%206%2021.5%204%2021%203c-1-.5-3%200-4.5%201.5L13%208%204.8%206.2c-.5-.1-.9.1-1.1.5l-.3.5c-.2.5-.1%201%20.3%201.3L9%2012l-2%203H4l-1%201%203%202%202%203%201-1v-3l3-2%203.5%205.3c.3.4.8.5%201.3.3l.5-.2c.4-.3.6-.7.5-1.2z'/></svg>");
}

.icon-culture {
  --almaty-icon: url("data:image/svg+xml,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'><path%20d='M12%207v14'/><path%20d='M3%2018a1%201%200%200%201-1-1V4a1%201%200%200%201%201-1h5a4%204%200%200%201%204%204%204%204%200%200%201%204-4h5a1%201%200%200%201%201%201v13a1%201%200%200%201-1%201h-6a3%203%200%200%200-3%203%203%203%200%200%200-3-3z'/></svg>");
}

.icon-compass {
  --almaty-icon: url("data:image/svg+xml,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'><circle%20cx='12'%20cy='12'%20r='10'/><polygon%20points='16.24%207.76%2014.12%2014.12%207.76%2016.24%209.88%209.88%2016.24%207.76'/></svg>");
}

.icon-ticket {
  --almaty-icon: url("data:image/svg+xml,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'><path%20d='M2%209a3%203%200%200%201%200%206v2a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2v-2a3%203%200%200%201%200-6V7a2%202%200%200%200-2-2H4a2%202%200%200%200-2%202Z'/><path%20d='M13%205v2'/><path%20d='M13%2017v2'/><path%20d='M13%2011v2'/></svg>");
}

.icon-bed {
  --almaty-icon: url("data:image/svg+xml,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'><path%20d='M2%204v16'/><path%20d='M2%208h18a2%202%200%200%201%202%202v10'/><path%20d='M2%2017h20'/><path%20d='M6%208v9'/></svg>");
}

.icon-utensils {
  --almaty-icon: url("data:image/svg+xml,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'><path%20d='M3%202v7c0%201.1.9%202%202%202h4a2%202%200%200%200%202-2V2'/><path%20d='M7%202v20'/><path%20d='M21%2015V2a5%205%200%200%200-5%205v6c0%201.1.9%202%202%202h3Zm0%200v7'/></svg>");
}

/* --- 2. Buttons -------------------------------------------------------------
   concepts.css targets `.button-primary` on the element itself, but the block
   editor puts that class on the wrapper <div> and the styled element is the
   inner <a>. Keep the wrapper transparent and style the link, everywhere —
   not only inside .guide-actions. */

.almaty-main .wp-block-button.button-primary,
.almaty-main .wp-block-button.button-secondary,
.guide .wp-block-button.button-primary,
.guide .wp-block-button.button-secondary {
  background: none;
  border-radius: 0;
}

.almaty-main .wp-block-button__link {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 0 22px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-weight: 750;
  transition: transform 180ms ease, background 180ms ease, color 180ms ease;
}

.almaty-main .button-primary .wp-block-button__link {
  color: #fff;
  background: #ff6542;
}

.almaty-main .button-secondary .wp-block-button__link {
  border-color: #b9c8c1;
  color: #102a43;
  background: rgba(255, 255, 255, 0.72);
}

.almaty-main .guide-cta .wp-block-button__link {
  color: #102a43;
  background: #fff;
}

.almaty-main .wp-block-button__link:hover {
  transform: translateY(-1px);
}
