/* =========================================================
   Město v dialogu — page compositions (homepage v1).
   Built on the Entangle Base framework: colors/fonts come from
   theme.json presets via the base token layer (--color-*, --font-*,
   --container, --gutter). Ported from the AMOS design (index.html).
   Skipped in v1 (later via entangle plugins): events, newsletter,
   kompas.
   ========================================================= */

:root {
  /* design-specific derivative not in the shared palette */
  --color-muted: #6B6756;
}

html { scroll-behavior: smooth; }
body { overflow-x: clip; }
::selection { background: var(--color-brand); color: #fff; }

.wrap { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }

.kicker{font:600 .72rem/1.2 var(--font-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--color-muted);}
  .shead{display:flex;align-items:baseline;justify-content:space-between;gap:20px;
    border-top:1px solid var(--color-ink);padding-top:16px;margin-bottom:clamp(28px,4vw,44px);}
  .shead .idx{font:italic 400 1.05rem var(--font-serif);color:var(--color-brand);}
  h2{font:400 clamp(34px,4.8vw,58px)/1.04 var(--font-serif);letter-spacing:-.01em;margin:0 0 18px;}
  /* size comes from the block's font-size preset (Body M) selected in the sidebar */
  .lead{color:var(--color-ink-soft);max-width:46rem;margin:0;}

  .btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;border:0;cursor:pointer;
    font:600 .95rem var(--font-sans);border-radius:999px;padding:.9em 1.5em;transition:transform .16s ease,background .16s ease,color .16s ease;}
  .btn svg{width:1em;height:1em;}
  .btn-accent{background:var(--color-brand);color:#fff;}
  .btn-accent:hover{background:var(--color-brand-deep);transform:translateY(-2px);}
  .btn-ghost{background:transparent;color:var(--color-ink);border:1.5px solid var(--color-ink);}
  .btn-ghost:hover{background:var(--color-ink);color:var(--color-bg);transform:translateY(-2px);}
  .btn-sm{padding:.6em 1.1em;font-size:.86rem;}
  .tlink{font-weight:600;color:var(--color-brand-deep);border-bottom:1px solid var(--color-brand-deep);transition:.15s;padding:.06em .14em;margin:-.06em -.14em;border-radius:3px;}
  .tlink:hover{background:var(--color-brand);color:#fff;border-color:var(--color-brand);}

  /* header — entangle/site-header block (classic menu), 1:1 s předlohou (AMOS) */
  .site-header{position:sticky;top:0;z-index:50;padding-block:0;background:rgba(247,244,237,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--color-rule);}
  .site-header.is-stuck{padding-block:0;box-shadow:0 6px 24px rgba(28,57,187,.10);}
  .site-header__inner{display:flex;align-items:center;gap:22px;height:72px;}
  .brand{display:flex;align-items:center;gap:10px;font:400 1.55rem/1 var(--font-serif);letter-spacing:-.01em;white-space:nowrap;color:var(--color-ink);}
  .brand em{font-style:italic;color:inherit;}
  .brand__mark{width:38px;height:38px;flex:none;color:var(--color-brand);transition:transform .35s cubic-bezier(.2,.7,.3,1.4);}
  .brand__mark svg{width:100%;height:100%;display:block;}
  .brand:hover .brand__mark{transform:rotate(-8deg) scale(1.08);}
  .site-header .nav{display:flex;align-items:center;flex:1;margin-left:40px;}
  .nav__list{display:flex;align-items:center;gap:26px;margin:0;padding:0;list-style:none;font-weight:500;font-size:.95rem;color:var(--color-ink-soft);}
  .nav__list > .menu-item{position:relative;margin:0;}
  .nav__list > .menu-item > a{position:relative;display:inline-block;padding:6px 0;color:inherit;font:500 .95rem/1.2 var(--font-sans);letter-spacing:0;}
  /* animated underline: top-level simple items only (not dropdown parents, not submenu items) */
  .nav__list > .menu-item:not(.menu-item-has-children) > a::after{content:"";position:absolute;left:0;right:100%;bottom:2px;height:1px;background:var(--color-ink);transition:right .22s ease;}
  .nav__list > .menu-item:not(.menu-item-has-children) > a:hover::after{right:0;}
  /* dropdown parent: the chevron is an inline SVG inside the link (rendered by the block);
     the link is a flex row → text + chevron side by side, nothing to misposition */
  .nav__list > .menu-item-has-children > a{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;}
  .nav__list > .menu-item-has-children > a::after{content:none;}
  /* hover bridge so the submenu doesn't close in the gap */
  .nav__list > .menu-item-has-children::after{content:"";position:absolute;left:50%;transform:translateX(-50%);top:100%;width:170px;height:20px;}
  .nav__list .sub-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);margin-top:12px;min-width:230px;background:var(--color-bg-alt);border:1px solid var(--color-rule);border-radius:12px;padding:8px;box-shadow:0 24px 48px -28px rgba(22,21,17,.35);list-style:none;opacity:0;visibility:hidden;transition:opacity .18s ease,visibility .18s ease,transform .18s ease;z-index:60;}
  .nav__list > .menu-item-has-children:hover > .sub-menu,
  .nav__list > .menu-item-has-children:focus-within > .sub-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
  .nav__list .sub-menu a{display:block;padding:10px 14px;border-radius:8px;font:400 1.1rem var(--font-serif);color:var(--color-ink);text-decoration:none;}
  .nav__list .sub-menu a::after{content:none;}
  .nav__list .sub-menu a:hover{background:var(--color-bg);color:var(--color-brand);}
  .site-header__actions{margin-left:auto;display:flex;align-items:center;gap:10px;}
  .site-header__cta.btn{padding:.6em 1.1em;font-size:.86rem;}
  /* burger (mobile only) */
  .nav__toggle{display:none;margin-left:auto;width:46px;height:46px;flex:none;align-items:center;justify-content:center;border:1.5px solid var(--color-ink);border-radius:999px;background:transparent;color:var(--color-ink);cursor:pointer;}
  .nav__toggle svg{width:20px;height:20px;}
  @media(max-width:1000px){
    .site-header .nav{display:none;}
    .nav__toggle{display:inline-flex;}
  }
  /* fullscreen mobile menu (base .menu-overlay, reskinned blue).
     Padding 0 → the top bar aligns exactly with the 72px header (no jump);
     the overlay itself scrolls (no nested list scrollbars), x-overflow hidden. */
  .menu-overlay{background:var(--color-brand);color:#fff;padding:0;overflow-x:hidden;}
  .menu-overlay__top{flex:none;height:72px;width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--gutter);}
  .menu-overlay__nav{flex:1 1 auto;justify-content:flex-start;margin-block:0;width:100%;max-width:var(--container);margin-inline:auto;padding:0 var(--gutter);}
  .menu-overlay .overlay__close{width:46px;height:46px;}
  .menu-overlay .brand,.menu-overlay .brand__mark{color:#fff;}
  .menu-overlay .brand__mark circle{fill:var(--color-brand)!important;}
  .menu-overlay .overlay__close{border:1.5px solid rgba(255,255,255,.55);color:#fff;}
  .menu-overlay__list{counter-reset:mnav;display:flex;flex-direction:column;margin:clamp(14px,4.5vh,40px) 0 0;padding:0;list-style:none;}
  .menu-overlay__list > .menu-item > a{display:flex;align-items:baseline;gap:18px;padding:clamp(13px,2.6vh,21px) 0;border-bottom:1px solid rgba(255,255,255,.2);color:#fff;font:400 clamp(27px,6.6vw,40px)/1.04 var(--font-serif);letter-spacing:-.015em;}
  .menu-overlay__list > .menu-item > a::before{counter-increment:mnav;content:counter(mnav,decimal-leading-zero);position:static;transform:none;opacity:1;font:600 .7rem var(--font-sans);letter-spacing:.16em;color:rgba(255,255,255,.72);}
  /* dropdown parent in the mobile menu: the inline SVG chevron sits on the right;
     submenu collapses and toggles on click (ui.js) */
  .menu-overlay__list > .menu-item-has-children > a .nav__chevron{margin-left:auto;align-self:center;width:20px;height:20px;}
  .menu-overlay__list .sub-menu{display:none;margin:8px 0 18px;padding:0 0 0 48px;list-style:none;}
  .menu-overlay__list > .menu-item-has-children.is-open > .sub-menu{display:block;}
  .menu-overlay__list .sub-menu a{display:block;padding:10px 0;border-bottom:0;color:#fff;opacity:.85;font:400 clamp(19px,4.4vw,24px) var(--font-serif);}
  .menu-overlay__foot{margin:auto auto 0;width:100%;max-width:var(--container);padding:22px var(--gutter) max(26px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px;}
  .menu-overlay__foot .site-header__actions{margin:0;flex-direction:column;align-items:stretch;gap:10px;width:100%;}
  .menu-overlay__foot .site-header__cta{margin:0;justify-content:center;font-size:1rem;padding:1em 1.5em;}
  .menu-overlay__foot .site-header__cta.btn-accent{background:#fff;color:var(--color-brand-deep);}
  .menu-overlay__foot .site-header__cta.btn-accent:hover{background:var(--color-bg);color:var(--color-brand-deep);}
  .menu-overlay__foot .site-header__cta.btn-ghost{border:1.5px solid rgba(255,255,255,.6);color:#fff;background:transparent;}
  .menu-overlay__foot .site-header__cta.btn-ghost:hover{background:#fff;color:var(--color-brand-deep);}


  /* hero */
  .hero{padding:clamp(56px,7.5vw,108px) 0 clamp(34px,4.5vw,56px);}
  .hero h1{font:400 clamp(38px,5.6vw,78px)/1.05 var(--font-serif);letter-spacing:-.015em;margin:0 0 clamp(18px,2.2vw,28px);max-width:19ch;}
  @media(min-width:1001px){.hero h1{max-width:none;}.hero h1 .hl2{display:block;}}
  .hero-sub{font-size:clamp(1.05rem,1.4vw,1.22rem);color:var(--color-ink-soft);max-width:44rem;margin:0 0 clamp(30px,3.6vw,44px);}
  .hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:clamp(34px,5vw,60px);}
  .btn-lg{padding:1.05em 1.8em;font-size:1.06rem;}
  .cta-line{flex:1;height:1px;background:var(--color-rule);min-width:40px;align-self:center;}
  .hero-loc{display:inline-flex;align-items:center;gap:10px;font:600 .95rem var(--font-sans);color:var(--color-ink);}
  .hero-loc .live{width:9px;height:9px;border-radius:50%;background:var(--color-brand);flex:none;animation:livep 2.4s ease-out infinite;}
  @keyframes livep{0%{box-shadow:0 0 0 0 rgba(28,57,187,.35);}70%{box-shadow:0 0 0 8px rgba(28,57,187,0);}100%{box-shadow:0 0 0 0 rgba(28,57,187,0);}}
  .hero-loc small{font:500 .95rem var(--font-sans);color:var(--color-muted);}
  /* .sec top gap now lives on each section's block instance (style.spacing.padding.top,
     spacing|90; #proc uses spacing|70) so it is visible/tunable in the editor's Rozměry. */


  /* formats carousel */
  .fcar-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:30px;}
  .fcar-head .lead{margin:0;}

  /* ============================================================
     entangle/cards v2 — SETTINGS-DRIVEN (layout, icon size, tag colour +
     font sizes, takeaway / read-more visibility, hover) via modifier classes.
     Nothing keyed on a per-grid className. */
  .cards { --card-icon-size: 54px; }
  .cards .card__icon { width: var(--card-icon-size,54px); height: var(--card-icon-size,54px); margin-bottom: 16px; object-fit: contain; }
  .cards--icon-tint .card__icon { filter: url(#ico); } /* duotone brand tint; toggle "Tónovat ikony" turns it off */
  /* grid */
  .cards--grid { display: grid; gap: 14px; }
  .cards--cols-1 { grid-template-columns: 1fr; }
  .cards--cols-2 { grid-template-columns: repeat(2,1fr); }
  .cards--cols-3 { grid-template-columns: repeat(3,1fr); }
  .cards--cols-4 { grid-template-columns: repeat(4,1fr); }
  @media (max-width:1000px) { .cards--cols-3, .cards--cols-4 { grid-template-columns: repeat(2,1fr); } }
  @media (max-width:620px) { .cards--grid { grid-template-columns: 1fr; } }
  /* full-bleed carousel: first card aligns to the container left, arrows to its right */
  .cards--carousel { position: relative; display: block; margin-top: 30px;
    --carousel-inset: clamp(24px, calc((100vw - var(--container))/2 + var(--gutter)), 50vw); }
  .cards--carousel .cards__track { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x proximity; scroll-behavior: smooth;
    scrollbar-width: none; -ms-overflow-style: none; padding: 4px 0 10px 0; margin-left: 0; }
  /* A carousel placed directly in the section (outside .wrap) is full-bleed: shift the track so
     the first card lines up with the container's left edge. A carousel inside .wrap (container
     width) stays at 0 and is left-aligned to its own box. */
  .sec > .cards--carousel .cards__track { margin-left: var(--carousel-inset); }
  .cards--carousel .cards__track::-webkit-scrollbar { display: none; }
  /* Carousel card width follows the "columns" setting: exactly N cards fill the container,
     any extra cards overflow (→ arrows). Clamped so cards never get too narrow. */
  .cards--carousel .card { flex: 0 0 max(240px, calc((min(100vw, var(--container)) - 2 * var(--gutter) - (var(--cards-cols, 3) - 1) * 14px) / var(--cards-cols, 3))); scroll-snap-align: start; }
  .cards--carousel .arrow-group { display: flex; justify-content: flex-end; gap: 12px; margin: 0 0 18px 0; }
  .sec > .cards--carousel .arrow-group { margin-right: var(--carousel-inset); }
  .cards--carousel .arrow-btn { background: transparent; border: 1.5px solid var(--color-ink); color: var(--color-ink);
    transition: background .16s ease, color .16s ease, transform .16s ease; }
  .cards--carousel .arrow-btn:hover { background: var(--color-ink); color: var(--color-bg); transform: translateY(-2px); }
  /* no overflow → view.js disables both arrows → hide the whole arrow row (incl. its margin) */
  .cards--carousel .arrow-btn:disabled { display: none; }
  .cards--carousel .arrow-group:has( .arrow-btn:disabled ) { display: none; }
  /* base card (sizes for tag/title/text come from the block's font-size presets) */
  .cards .card { display: flex; flex-direction: column; background: var(--color-bg-alt); border: 1px solid var(--color-rule); border-radius: 14px; padding: 26px 24px; transition: transform .16s ease, border-color .16s ease; }
  .cards a.card { text-decoration: none; color: inherit; }
  .cards .card__tag { display: block; font-family: var(--font-sans); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--color-ink-soft); margin-bottom: 14px; }
  .cards .card__title { display: block; font-family: var(--font-serif); font-weight: 400; line-height: 1.14; letter-spacing: -.01em; margin: 0 0 10px; }
  .cards .card__meta { margin: 0 0 12px; font-family: var(--font-sans); font-size: .8125rem; letter-spacing: .01em; color: var(--color-ink-soft); }
  .cards .card__text { margin: 0; color: var(--color-ink-soft); }
  .cards .card__take { margin-top: auto; padding-top: 14px; border-top: 1px dashed var(--color-rule); line-height: 1.35; font-size: .9375rem; }
  .cards .card__take b { font-family: var(--font-sans); font-weight: 700; color: var(--color-ink); }
  .cards .card__take b::after { content: ": "; }
  .cards .card__take span { font-family: var(--font-sans); color: var(--color-ink-soft); }
  .cards .card__more { margin-top: 12px; align-self: flex-start; font-weight: 400; color: var(--color-brand-deep); border-bottom: 1px solid var(--color-brand-deep); }
  /* hover */
  .cards--hover-lift .card:hover { transform: translateY(-3px); }
  .cards--hover-lift-brand .card:hover { transform: translateY(-3px); border-color: var(--color-brand); }
  .cards--hover-lift-brand .card:hover .card__more { color: var(--color-brand); border-color: var(--color-brand); }

  /* Quiz on its own page sits in .page-body.container, which already provides
     the page gutter — the quiz plugin's own inline padding would double-indent
     it (narrower than the header). Drop it so the quiz aligns with the content. */
  .single-entangle_quiz .entangle-quiz.entangle-container { padding-inline: 0; }

  /* AI dialogy */
  .ai{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,4vw,56px);align-items:start;}
  .ai-photo{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--color-rule);}
  .ai-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 12%;}
  .ai-photo figcaption{position:absolute;left:12px;bottom:12px;background:rgba(247,244,237,.92);
    border:1px solid var(--color-rule);border-radius:999px;padding:.45em 1em;font-size:.76rem;font-weight:600;}
  /* .roles / .role: top margin, dividers (borders) and padding now live on the block
     instances (native, editable in Border + Rozměry). .role__head is a native flex row. */
  .role__head{column-gap:18px;}
  .role__name{margin:0;font:400 1.35rem var(--font-serif);}
  .role__desc{margin:6px 0 0;color:var(--color-muted);font-size:.9rem;}
  .badge{margin:0;font:600 .68rem var(--font-sans);letter-spacing:.12em;text-transform:uppercase;border-radius:999px;padding:.45em .9em;white-space:nowrap;}
  .badge.on{background:var(--color-brand);color:#fff;}
  .badge.soon{border:1px solid var(--color-rule-solid);color:var(--color-muted);}
  .ai-note{display:flex;gap:10px;align-items:flex-start;margin-top:18px;color:var(--color-muted);font-size:.86rem;max-width:34rem;}
  .ai-note svg{width:17px;height:17px;flex:none;margin-top:2px;color:var(--color-brand-deep);}
  .ai .btn{margin-top:22px;}

  /* mozaika */
  .vmosaic{column-count:3;column-gap:16px;}
  .vnote{break-inside:avoid;margin:0 0 16px;background:var(--color-bg-alt);border:1px solid var(--color-rule);border-radius:14px;padding:22px 24px;}
  .vnote .q{display:block;font:400 2.4rem/0.6 var(--font-serif);color:var(--color-brand);height:.55em;}
  .vnote p{margin:10px 0 0;font:italic 400 1.22rem/1.4 var(--font-serif);}
  .vnote figcaption{margin-top:14px;font:600 .78rem var(--font-sans);color:var(--color-muted);}

  .plist{display:flex;flex-wrap:wrap;gap:8px 26px;margin-top:26px;align-items:center;}
  .plist span{font:600 .82rem var(--font-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--color-muted);}

  /* final */
  .final{text-align:center;} /* top/bottom gap on the block instance (spacing|90 / spacing|80) */
  /* .final h2 now uses the "display" (H1) font-size preset + padding-bottom on the instance */
  .final .hero-cta{justify-content:center;margin:0;}

  /* footer — structure is NATIVE blocks (parts/footer.html: columns + heading + list +
     image + paragraphs). The top rule (light --color-rule) and the footer's vertical
     padding live on the block instance (editor Border + Rozměry). Only skin here. */
  .ftr-grid{gap:clamp(24px,3vw,40px);margin:0;}
  .ftr__title{font:600 .72rem var(--font-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--color-muted);margin:0 0 14px;}
  .ftr p{color:var(--color-ink-soft);font-size:.93rem;margin:0;max-width:30rem;}
  .ftr ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
  .ftr ul a{font-size:.95rem;color:var(--color-ink-soft);}
  .ftr ul a:hover{color:var(--color-brand-deep);}
  .funding{border-top:1px solid var(--color-rule);padding-top:24px;margin-top:clamp(28px,4vw,44px);display:flex;flex-wrap:wrap;align-items:center;gap:18px;}
  .euflag{width:64px;height:43px;border-radius:4px;background:#003399;flex:none;display:flex;align-items:center;justify-content:center;}
  .euflag::after{content:"★ ★ ★\A★ ★ ★";white-space:pre;color:#FFCC00;font-size:6.4px;line-height:7.4px;text-align:center;letter-spacing:1px;}
  .lg{height:43px;padding:0 13px;border:1px solid var(--color-rule);border-radius:6px;background:var(--color-bg-alt);
    display:flex;align-items:center;font:700 .74rem var(--font-sans);color:var(--color-ink-soft);}
  .ftr .funding__note{color:var(--color-muted);font-size:.8rem;max-width:34rem;line-height:1.5;margin:0;}
  .legal{border-top:1px solid var(--color-rule);padding:20px 0 30px;display:flex;flex-wrap:wrap;gap:8px 28px;
    justify-content:space-between;color:var(--color-muted);font-size:.8rem;}

  @media(max-width:1000px){
    .cta-line{display:none;}
    .ai{grid-template-columns:1fr;}
    .ai-photo img{aspect-ratio:16/10;}
    .vmosaic{column-count:2;}
    .ftr-grid{grid-template-columns:1fr 1fr;}
  }
  @media(max-width:620px){
    .ptrack img{height:170px;}
    .vmosaic{column-count:1;}
    .ftr-grid{grid-template-columns:1fr;}
    .btn-lg{font-size:.95rem;padding:.9em 1.5em;}
    .hero-cta{gap:10px;}
    .hero-loc{flex-wrap:wrap;flex-basis:100%;margin-top:26px;row-gap:2px;}
    .hero-loc small{flex-basis:100%;padding-left:19px;}
  }
  .logolink{margin:0;flex:none;}
  .logolink img{height:46px;width:auto;max-width:100%;}

/* =========================================================
   v2 — adapters for native blocks (the content is now real
   Gutenberg blocks; these map the framework block markup onto
   the design).
   ========================================================= */

/* --- sections built as core groups --- */
/* font-size comes from each heading's preset (section-title / display) chosen in the sidebar */
.sec h2, .final h2 { font-weight: 400; font-family: var(--font-serif); line-height: 1.04; letter-spacing: -.01em; margin: 0 0 18px; }
/* Accent color now comes from the editor's inline text-color format (<mark has-brand-color>),
   not from CSS — headings are black by default; only the highlighted accent is blue. */
.sec h2 em, .final h2 em, .wp-block-entangle-hero h1 em, .wp-block-entangle-hero-cta h1 em { font-style: italic; }
/* Only typography here — the rule (top border), its padding and the gap to the title
   live on the block instance (editor Border + Rozměry panels), see the section kickers. */
.shead-kicker { font: 600 .72rem/1.2 var(--font-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--color-muted); }
.sec-more { margin: 30px 0 0; font-size: 1.02rem; color: var(--color-ink-soft); }
.sec-more a { font-weight: 600; color: var(--color-brand-deep); border-bottom: 1px solid var(--color-brand-deep); }
.sec-more a:hover { background: var(--color-brand); color: #fff; border-color: var(--color-brand); }

/* --- entangle/hero-cta block (design hero: heading + lead + 1–2 CTA + status line) ---
   Markup reuses the ported design classes (.hero / .hero-sub / .hero-cta / .btn* /
   .cta-line / .hero-loc). Zero the frame here (also beats base's `.home .hero`); the
   TOP gap is set on the block INSTANCE (style.spacing.padding.top) so it is visible
   and tunable in the editor's Rozměry panel instead of being hidden in CSS. */
.wp-block-entangle-hero-cta.hero { padding: 0; }
.wp-block-entangle-hero-cta h1 { text-wrap: balance; }

/* --- core buttons in the design pill style (override base's square pills) --- */
.wp-block-button__link.wp-element-button {
	border-radius: 999px;
	border: 0;
	background-color: var(--color-brand);
	color: #fff;
	font: 600 .95rem var(--font-sans);
	letter-spacing: 0;
	text-transform: none;
	padding: .9em 1.5em;
	transition: transform .16s ease, background .16s ease, color .16s ease;
}
.wp-block-button__link.wp-element-button:hover { background-color: var(--color-brand-deep); color: #fff; transform: translateY(-2px); }
.is-style-outline .wp-block-button__link.wp-element-button,
.is-style-outline > .wp-block-button__link.wp-element-button { background: transparent; color: var(--color-ink); border: 1.5px solid var(--color-ink); }
.is-style-outline .wp-block-button__link.wp-element-button:hover { background: var(--color-ink); color: var(--color-bg); }
.hero-cta.wp-block-buttons { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 0; }
.btn-lg .wp-block-button__link.wp-element-button { padding: 1.05em 1.8em; font-size: 1.06rem; }


/* --- programs head (heading/lead + carousel nav) --- */
.fcar-head .wp-block-heading { margin-bottom: 18px; }

/* --- AI dialogy via core columns --- */
.ai.wp-block-columns { gap: clamp(28px, 4vw, 56px); align-items: flex-start; }
.ai .ai-photo img { border-radius: 12px; border: 1px solid var(--color-rule); width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center 12%; }
@media (max-width: 1000px) { .ai .ai-photo img { aspect-ratio: 16/10; } }


/* =========================================================
   photo-marquee skin (immediately below the hero).
   ========================================================= */
/* photo-marquee: the site skin (duotone, radii, heights). Bottom gap → block instance (spacing|60). */
.wp-block-entangle-photo-marquee .photo-marquee__item { border-radius: 12px; border: 1px solid var(--color-rule); background: var(--color-bg-alt); }
.wp-block-entangle-photo-marquee img { height: clamp(200px, 24vw, 300px); aspect-ratio: 3/2; filter: url(#duo) saturate(1.08) contrast(1.03); }
.wp-block-entangle-photo-marquee .photo-marquee__item--tall img { aspect-ratio: 4/5; }
@media (max-width: 620px) { .wp-block-entangle-photo-marquee img { height: 170px; } }


/* (Event-detail layout moved to the entangle-events plugin: assets/css/event-single.css.) */