/* ==========================================================================
   ALTMEZ — HOMEPAGE
   Styling only. Every section is built from standard Gutenberg / Kadence
   blocks carrying an `altmez-*` className, so the page stays fully editable.
   ========================================================================== */

.home .content-area,
.page-template-default.home .entry-content { --altmez-flow: 0; }

/* Homepage sections run edge to edge; the inner container handles the gutter */
.altmez-home .wp-block-group.alignfull { margin-inline: 0; }

/* --------------------------------------------------------------------------
   0. Gutenberg button variants
   The homepage uses native core/button blocks so everything stays editable.
   Each block carries an `is-*` className that maps onto the ALTMEZ button
   system here, rather than hard-coding colours into the block attributes.
   -------------------------------------------------------------------------- */
.altmez-btn-row { display: flex; flex-wrap: wrap; gap: var(--altmez-space-3); }
.altmez-btn-row .wp-block-button { margin: 0; }

.altmez-btn-row .wp-block-button__link {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--altmez-space-2);
  min-block-size: 48px;
  padding: 12px 24px;
  border: 1.5px solid transparent;
  border-radius: var(--altmez-radius-pill);
  font-family: var(--altmez-font);
  font-size: var(--altmez-fs-sm);
  font-weight: var(--altmez-fw-medium);
  line-height: 1.2;
  text-decoration: none;
  transition: background var(--altmez-dur) var(--altmez-ease),
              color var(--altmez-dur) var(--altmez-ease),
              border-color var(--altmez-dur) var(--altmez-ease),
              transform var(--altmez-dur) var(--altmez-ease);
}
.altmez-btn-row .wp-block-button__link:active { transform: translateY(1px); }

.altmez-btn-row .is-lg .wp-block-button__link { min-block-size: 56px; padding: 15px 32px; font-size: var(--altmez-fs-body); }

.altmez-btn-row .is-accent .wp-block-button__link {
  background: var(--altmez-accent); border-color: var(--altmez-accent);
  color: var(--altmez-dark); font-weight: var(--altmez-fw-bold);
}
.altmez-btn-row .is-accent .wp-block-button__link:hover {
  background: var(--altmez-accent-600); border-color: var(--altmez-accent-600); color: var(--altmez-dark);
}

.altmez-btn-row .is-dark .wp-block-button__link {
  background: var(--altmez-dark); border-color: var(--altmez-dark); color: var(--altmez-on-dark);
}
.altmez-btn-row .is-dark .wp-block-button__link:hover { background: var(--altmez-dark-2); border-color: var(--altmez-dark-2); }

.altmez-btn-row .is-outline .wp-block-button__link {
  background: transparent; border-color: var(--altmez-border-strong); color: var(--altmez-text);
}
.altmez-btn-row .is-outline .wp-block-button__link:hover {
  background: var(--altmez-dark); border-color: var(--altmez-dark); color: var(--altmez-on-dark);
}

.altmez-btn-row .is-ghost-light .wp-block-button__link {
  background: transparent; border-color: rgba(255, 255, 255, .35); color: var(--altmez-on-dark);
}
.altmez-btn-row .is-ghost-light .wp-block-button__link:hover {
  background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .6); color: var(--altmez-on-dark);
}

.altmez-btn-row .is-light .wp-block-button__link {
  background: #fff; border-color: #fff; color: var(--altmez-dark); font-weight: var(--altmez-fw-bold);
}
.altmez-btn-row .is-light .wp-block-button__link:hover {
  background: var(--altmez-dark); border-color: var(--altmez-dark); color: #fff;
}

/* --------------------------------------------------------------------------
   1. HERO
   -------------------------------------------------------------------------- */
.altmez-hero {
  position: relative;
  isolation: isolate;
  background: var(--altmez-dark);
  color: var(--altmez-on-dark);
  overflow: hidden;
  padding-block: clamp(48px, 6vw, 88px);
}
.altmez-hero::before {
  content: "";
  position: absolute; inset: 0; z-index: -1;
  background:
    radial-gradient(90% 120% at 88% 8%, rgba(255, 199, 25, .16) 0%, transparent 58%),
    linear-gradient(180deg, var(--altmez-dark) 0%, var(--altmez-dark-2) 100%);
}

.altmez-hero__inner {
  display: grid;
  align-items: center;
  gap: clamp(32px, 4vw, 56px);
  grid-template-columns: 1fr;
}
@media (min-width: 992px) {
  .altmez-hero__inner { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); }
}

.altmez-hero__eyebrow {
  display: inline-flex; align-items: center; gap: var(--altmez-space-2);
  margin-block-end: var(--altmez-space-4);
  padding: 6px 16px;
  border-radius: var(--altmez-radius-pill);
  background: rgba(255, 199, 25, .12);
  border: 1px solid rgba(255, 199, 25, .32);
  color: var(--altmez-accent);
  font-size: var(--altmez-fs-xs);
  font-weight: var(--altmez-fw-medium);
}

.altmez-hero h1,
.altmez-hero .altmez-hero__title {
  margin: 0 0 var(--altmez-space-5);
  color: var(--altmez-on-dark);
  font-size: var(--altmez-fs-h1);
  font-weight: var(--altmez-fw-black);
  line-height: 1.25;
  letter-spacing: -.015em;
  text-wrap: balance;
}
.altmez-hero__title mark,
.altmez-hero__title .altmez-hl {
  background: none;
  color: var(--altmez-accent);
}

.altmez-hero__lede {
  margin: 0 0 var(--altmez-space-6);
  max-inline-size: 56ch;
  color: var(--altmez-on-dark-muted);
  font-size: clamp(1rem, .95rem + .35vw, 1.1875rem);
  line-height: 1.9;
}

.altmez-hero__actions {
  display: flex; flex-wrap: wrap; gap: var(--altmez-space-3);
  margin-block-end: var(--altmez-space-7);
}
.altmez-hero__actions .wp-block-button__link { margin: 0; }

/* Trust points under the hero copy */
.altmez-hero__points {
  display: grid;
  gap: var(--altmez-space-3) var(--altmez-space-5);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
  margin: 0; padding: 0; list-style: none;
}
.altmez-hero__points li {
  display: flex; align-items: center; gap: var(--altmez-space-2);
  color: var(--altmez-on-dark);
  font-size: var(--altmez-fs-sm);
  line-height: 1.6;
}
.altmez-hero__points li::before {
  content: "✓";
  flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  inline-size: 22px; block-size: 22px;
  border-radius: 50%;
  background: rgba(255, 199, 25, .16);
  color: var(--altmez-accent);
  font-size: .75rem; font-weight: var(--altmez-fw-bold);
}

/* Hero visual — 5-slide real-project carousel */
.altmez-hero__media { position: relative; }
.altmez-hero__media figure { margin: 0; }

.altmez-hero__carousel {
  position: relative;
  aspect-ratio: var(--altmez-ratio-feature);   /* fixed box → zero CLS */
  border-radius: var(--altmez-radius-lg);
  overflow: hidden;
  box-shadow: var(--altmez-shadow-lg);
  background: var(--altmez-dark-2);
  isolation: isolate;
}

.altmez-hero__carousel figure {
  position: absolute;
  inset: 0;
  margin: 0;
}
.altmez-hero__carousel img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  display: block;
}

/*
 * Without JS the stack simply shows the last painted slide, so the box is
 * never empty. Once altmez-carousel.js adds `is-enhanced`, only `.is-active`
 * is visible and the rest fade underneath it.
 */
.altmez-hero__carousel.is-enhanced figure {
  opacity: 0;
  transition: opacity 550ms var(--altmez-ease);
  will-change: opacity;
}
.altmez-hero__carousel.is-enhanced figure.is-active { opacity: 1; }

/* Very slight drift on the active slide — premium, not a slideshow effect */
.altmez-hero__carousel.is-enhanced img { transform: scale(1.015); transition: transform 2.6s linear; }
.altmez-hero__carousel.is-enhanced figure.is-active img { transform: scale(1.055); }

/* Gradient so the dots stay legible over a bright photo */
.altmez-hero__carousel.is-enhanced::after {
  content: "";
  position: absolute; inset-inline: 0; inset-block-end: 0;
  block-size: 84px;
  background: linear-gradient(to top, rgba(16, 21, 28, .55), transparent);
  pointer-events: none;
  z-index: 1;
}

.altmez-hero__dots {
  position: absolute;
  inset-block-end: 14px;
  inset-inline: 0;
  z-index: 2;
  display: flex;
  justify-content: center;
  gap: var(--altmez-space-2);
}
.altmez-hero__dot {
  inline-size: 26px;
  block-size: 4px;
  padding: 0;
  border: 0;
  border-radius: var(--altmez-radius-pill);
  background: rgba(255, 255, 255, .42);
  cursor: pointer;
  transition: background var(--altmez-dur) var(--altmez-ease), inline-size var(--altmez-dur) var(--altmez-ease);
}
.altmez-hero__dot[aria-selected="true"] { background: var(--altmez-accent); inline-size: 40px; }
.altmez-hero__dot:hover { background: rgba(255, 255, 255, .75); }

/* The dot row is only 4px tall; give it a real hit area on touch devices. */
@media (pointer: coarse) {
  .altmez-hero__dot { position: relative; }
  .altmez-hero__dot::before { content: ""; position: absolute; inset: -18px -6px; }
}

@media (prefers-reduced-motion: reduce) {
  .altmez-hero__carousel.is-enhanced figure { transition: none; }
  .altmez-hero__carousel.is-enhanced img,
  .altmez-hero__carousel.is-enhanced figure.is-active img { transform: none; transition: none; }
}

@media (max-width: 991px) {
  .altmez-hero__media { order: -1; }
  .altmez-hero__carousel { aspect-ratio: var(--altmez-ratio-wide); }
}

/* --------------------------------------------------------------------------
   2. TRUST STRIP
   -------------------------------------------------------------------------- */
.altmez-trust {
  background: var(--altmez-bg);
  border-block-end: 1px solid var(--altmez-border);
  padding-block: clamp(24px, 3vw, 40px);
}
.altmez-trust__grid {
  display: grid;
  gap: var(--altmez-space-5);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
  text-align: center;
}
.altmez-trust__item { display: grid; gap: var(--altmez-space-1); justify-items: center; }
.altmez-trust__num {
  font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem);
  font-weight: var(--altmez-fw-black);
  color: var(--altmez-text-strong);
  line-height: 1.2;
}
.altmez-trust__label { font-size: var(--altmez-fs-sm); color: var(--altmez-muted); line-height: 1.5; }

/* --------------------------------------------------------------------------
   3. SERVICES
   -------------------------------------------------------------------------- */
.altmez-services { background: var(--altmez-bg-soft); padding-block: var(--altmez-section); }

/* Service card — built from a core/group so it stays editable */
.altmez-scard {
  display: flex; flex-direction: column;
  block-size: 100%;
  background: var(--altmez-card);
  border: 1px solid var(--altmez-border);
  border-radius: var(--altmez-radius);
  overflow: hidden;
  box-shadow: var(--altmez-shadow-xs);
  transition: box-shadow var(--altmez-dur) var(--altmez-ease),
              transform var(--altmez-dur) var(--altmez-ease),
              border-color var(--altmez-dur) var(--altmez-ease);
}
.altmez-scard:hover { box-shadow: var(--altmez-shadow); transform: translateY(-4px); border-color: var(--altmez-border-strong); }

/* NOTE: descendant selectors, not `>`. WordPress nests block children inside
   `.wp-block-group__inner-container`; that wrapper is made `display:contents`
   so it disappears from the *box* tree, but it still sits in the *DOM* tree,
   so a child combinator from `.altmez-scard` would never match. */
.altmez-scard figure.wp-block-image {
  margin: 0;
  aspect-ratio: var(--altmez-ratio-card);
  overflow: hidden;
  background: var(--altmez-bg-soft-2);
}
.altmez-scard figure.wp-block-image a { display: block; block-size: 100%; }
.altmez-scard figure.wp-block-image img {
  inline-size: 100%; block-size: 100%;
  object-fit: cover;
  transition: transform .45s var(--altmez-ease);
}
.altmez-scard:hover figure.wp-block-image img { transform: scale(1.06); }

.altmez-scard h3,
.altmez-scard p,
.altmez-scard .wp-block-buttons { padding-inline: var(--altmez-space-5); }

.altmez-scard h3 {
  margin: var(--altmez-space-5) 0 var(--altmez-space-2);
  font-size: var(--altmez-fs-h4);
  font-weight: var(--altmez-fw-bold);
  line-height: 1.45;
}
.altmez-scard h3 a { text-decoration: none; color: inherit; }
.altmez-scard h3 a:hover { color: var(--altmez-muted); }
.altmez-scard p {
  margin: 0 0 var(--altmez-space-5);
  color: var(--altmez-muted);
  font-size: var(--altmez-fs-sm);
  line-height: 1.8;
}
.altmez-scard .wp-block-buttons { margin: auto 0 var(--altmez-space-5); }
.altmez-scard .wp-block-button__link {
  padding: 9px 18px;
  font-size: var(--altmez-fs-xs);
  font-weight: var(--altmez-fw-medium);
  border-radius: var(--altmez-radius-pill);
  background: transparent;
  border: 1.5px solid var(--altmez-border-strong);
  color: var(--altmez-text);
}
.altmez-scard .wp-block-button__link:hover { background: var(--altmez-dark); border-color: var(--altmez-dark); color: var(--altmez-on-dark); }

/* --------------------------------------------------------------------------
   4. WHY ALTMEZ
   -------------------------------------------------------------------------- */
.altmez-why { background: var(--altmez-bg); padding-block: var(--altmez-section); }
.altmez-wcard {
  display: flex; flex-direction: column; gap: var(--altmez-space-3);
  block-size: 100%;
  padding: var(--altmez-space-6);
  background: var(--altmez-card-soft);
  border: 1px solid var(--altmez-border);
  border-radius: var(--altmez-radius);
}
.altmez-wcard h3 {
  margin: 0;
  font-size: var(--altmez-fs-h4);
  font-weight: var(--altmez-fw-bold);
}
.altmez-wcard h3::before {
  content: "";
  display: block;
  inline-size: 40px; block-size: 4px;
  margin-block-end: var(--altmez-space-4);
  border-radius: var(--altmez-radius-pill);
  background: var(--altmez-accent);
}
.altmez-wcard p { margin: 0; color: var(--altmez-muted); font-size: var(--altmez-fs-sm); line-height: 1.85; }

/* --------------------------------------------------------------------------
   5. PROJECTS
   -------------------------------------------------------------------------- */
.altmez-projects { background: var(--altmez-dark); color: var(--altmez-on-dark); padding-block: var(--altmez-section); }
.altmez-projects .altmez-sechead__title { color: var(--altmez-on-dark); }
.altmez-projects .altmez-sechead__sub,
.altmez-projects .altmez-sechead__eyebrow { color: var(--altmez-on-dark-muted); }

/*
 * Editorial grid, not random masonry: a fixed 12-column frame with a repeating
 * 7-tile rhythm (feature · standard · standard · wide · standard · standard ·
 * tall). Every tile still snaps to the same column lines, so it reads as a
 * designed portfolio rather than a Pinterest wall — and it stays predictable
 * no matter how many photos are added.
 */
.altmez-pgrid { display: grid; gap: var(--altmez-grid-gap); grid-template-columns: 1fr; }

@media (min-width: 600px) {
  .altmez-pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
  .altmez-pgrid { grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-flow: dense; }

  /* default tile: 3 of 12 → four across */
  .altmez-pgrid .altmez-ptile { grid-column: span 3; }

  /* rhythm: every 7th tile starting at 1 is a 6-wide feature */
  .altmez-pgrid .altmez-ptile:nth-child(7n + 1) { grid-column: span 6; grid-row: span 2; }
  .altmez-pgrid .altmez-ptile:nth-child(7n + 1) figure img { aspect-ratio: var(--altmez-ratio-feature); block-size: 100%; }

  /* the two beside the feature */
  .altmez-pgrid .altmez-ptile:nth-child(7n + 2),
  .altmez-pgrid .altmez-ptile:nth-child(7n + 3) { grid-column: span 3; }

  /* a wide band to break the rhythm */
  .altmez-pgrid .altmez-ptile:nth-child(7n + 4) { grid-column: span 6; }
  .altmez-pgrid .altmez-ptile:nth-child(7n + 4) figure img { aspect-ratio: 2 / 1; }
}

@media (min-width: 1400px) {
  /* one more column of breathing room on very wide screens */
  .altmez-pgrid .altmez-ptile:nth-child(7n + 1) { grid-column: span 6; }
}

.altmez-ptile {
  position: relative;
  border-radius: var(--altmez-radius);
  overflow: hidden;
  background: var(--altmez-dark-2);
  isolation: isolate;
}
.altmez-ptile figure { margin: 0; block-size: 100%; }
.altmez-ptile figure img {
  inline-size: 100%; block-size: 100%;
  aspect-ratio: var(--altmez-ratio-card);
  object-fit: cover;
  transition: transform .5s var(--altmez-ease);
}
.altmez-ptile:hover figure img { transform: scale(1.05); }
.altmez-ptile figcaption {
  position: absolute; inset-inline: 0; inset-block-end: 0;
  margin: 0;
  padding: var(--altmez-space-7) var(--altmez-space-5) var(--altmez-space-4);
  background: linear-gradient(to top, rgba(16, 21, 28, .92) 0%, rgba(16, 21, 28, .55) 55%, transparent 100%);
  color: var(--altmez-on-dark);
  font-size: var(--altmez-fs-sm);
  font-weight: var(--altmez-fw-medium);
  line-height: 1.6;
  text-align: start;
}

.altmez-projects__foot { margin-block-start: var(--altmez-space-7); display: flex; justify-content: center; }

/* --------------------------------------------------------------------------
   5b. SITE FOOTAGE — two real project videos
   -------------------------------------------------------------------------- */
.altmez-videos { background: var(--altmez-dark-2); color: var(--altmez-on-dark); padding-block: var(--altmez-section); }
.altmez-videos .altmez-sechead__title { color: var(--altmez-on-dark); }
.altmez-videos .altmez-sechead__sub,
.altmez-videos .altmez-sechead__eyebrow { color: var(--altmez-on-dark-muted); }

.altmez-vgrid {
  display: grid;
  gap: var(--altmez-grid-gap);
  grid-template-columns: 1fr;
}
@media (min-width: 860px) {
  .altmez-vgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/*
 * MUST stay `column`. As a row flex container the <figcaption> became a flex
 * sibling of <video> and collapsed to a ~42px column, rendering the Arabic
 * caption one character per line. Column keeps the caption below the video at
 * full width, which is also the correct reading order for a figure.
 */
.altmez-vgrid figure.wp-block-video {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  background: var(--altmez-dark);
  border: 1px solid var(--altmez-dark-3);
  border-radius: var(--altmez-radius);
  overflow: hidden;
}

/* Portrait clips are common here; keep the natural ratio but cap the height so
   a 9:16 video can never run 1500px down the page. Same rule as the article
   template, kept consistent deliberately. */
.altmez-vgrid figure.wp-block-video video {
  display: block;
  inline-size: auto;
  max-inline-size: 100%;
  block-size: auto;
  max-block-size: min(70vh, 620px);
}

.altmez-vgrid figcaption,
.altmez-vgrid .wp-element-caption {
  inline-size: 100%;            /* never let the caption shrink-to-fit */
  min-inline-size: 0;
  padding: var(--altmez-space-3) var(--altmez-space-4);
  margin: 0;
  color: var(--altmez-on-dark-muted);
  font-size: var(--altmez-fs-xs);
  line-height: 1.7;
  text-align: center;
  overflow-wrap: break-word;
}

/* --------------------------------------------------------------------------
   6. PROCESS
   -------------------------------------------------------------------------- */
.altmez-process { background: var(--altmez-bg-soft); padding-block: var(--altmez-section); }
.altmez-steps {
  display: grid;
  gap: var(--altmez-grid-gap);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  counter-reset: altmez-step;
}
.altmez-step {
  position: relative;
  block-size: 100%;
  padding: var(--altmez-space-6);
  background: var(--altmez-card);
  border: 1px solid var(--altmez-border);
  border-radius: var(--altmez-radius);
}
.altmez-step h3 { margin: 0 0 var(--altmez-space-2); font-size: var(--altmez-fs-h4); font-weight: var(--altmez-fw-bold); }
.altmez-step h3::before {
  counter-increment: altmez-step;
  content: counter(altmez-step);
  display: flex; align-items: center; justify-content: center;
  inline-size: 42px; block-size: 42px;
  margin-block-end: var(--altmez-space-4);
  border-radius: var(--altmez-radius-sm);
  background: var(--altmez-accent);
  color: var(--altmez-dark);
  font-size: 1.125rem;
  font-weight: var(--altmez-fw-black);
}
.altmez-step p { margin: 0; color: var(--altmez-muted); font-size: var(--altmez-fs-sm); line-height: 1.85; }

/* --------------------------------------------------------------------------
   7. LATEST ARTICLES (core/query block)
   -------------------------------------------------------------------------- */
.altmez-posts { background: var(--altmez-bg); padding-block: var(--altmez-section); }

.altmez-posts .wp-block-post-template {
  display: grid;
  gap: var(--altmez-grid-gap);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  margin: 0; padding: 0; list-style: none;
}
.altmez-posts .wp-block-post-template > li {
  display: flex; flex-direction: column;
  block-size: 100%;
  background: var(--altmez-card);
  border: 1px solid var(--altmez-border);
  border-radius: var(--altmez-radius);
  overflow: hidden;
  box-shadow: var(--altmez-shadow-xs);
  transition: box-shadow var(--altmez-dur) var(--altmez-ease), transform var(--altmez-dur) var(--altmez-ease);
}
.altmez-posts .wp-block-post-template > li:hover { box-shadow: var(--altmez-shadow); transform: translateY(-3px); }

.altmez-posts .wp-block-post-featured-image { margin: 0; aspect-ratio: var(--altmez-ratio-card); overflow: hidden; background: var(--altmez-bg-soft-2); }
.altmez-posts .wp-block-post-featured-image img { inline-size: 100%; block-size: 100%; object-fit: cover; transition: transform .45s var(--altmez-ease); }
.altmez-posts .wp-block-post-template > li:hover .wp-block-post-featured-image img { transform: scale(1.05); }

.altmez-posts .wp-block-post-terms,
.altmez-posts .wp-block-post-title,
.altmez-posts .wp-block-post-excerpt,
.altmez-posts .wp-block-post-date { padding-inline: var(--altmez-space-5); }

.altmez-posts .wp-block-post-terms {
  margin: var(--altmez-space-5) 0 var(--altmez-space-3);
  font-size: var(--altmez-fs-xs);
}
.altmez-posts .wp-block-post-terms a {
  display: inline-block;
  padding: 3px 11px;
  border-radius: var(--altmez-radius-pill);
  background: var(--altmez-accent-soft);
  border: 1px solid var(--altmez-accent-line);
  color: var(--altmez-text);
  text-decoration: none;
}
.altmez-posts .wp-block-post-terms a:hover { background: var(--altmez-accent); }

.altmez-posts .wp-block-post-title {
  margin: 0 0 var(--altmez-space-3);
  font-size: var(--altmez-fs-h4);
  font-weight: var(--altmez-fw-bold);
  line-height: 1.5;
}
.altmez-posts .wp-block-post-title a { text-decoration: none; color: inherit; }
.altmez-posts .wp-block-post-title a:hover { color: var(--altmez-muted); }

.altmez-posts .wp-block-post-excerpt {
  margin: 0 0 var(--altmez-space-4);
  color: var(--altmez-muted);
  font-size: var(--altmez-fs-sm);
  line-height: 1.8;
}
.altmez-posts .wp-block-post-excerpt__more-text { margin: 0; }
.altmez-posts .wp-block-post-excerpt__more-link {
  font-size: var(--altmez-fs-sm); font-weight: var(--altmez-fw-medium);
  color: var(--altmez-text); text-decoration: none;
}
.altmez-posts .wp-block-post-excerpt__more-link:hover { text-decoration: underline; }

.altmez-posts .wp-block-post-date {
  margin: auto 0 var(--altmez-space-5);
  padding-block-start: var(--altmez-space-2);
  color: var(--altmez-muted-2);
  font-size: var(--altmez-fs-xs);
}

.altmez-posts__foot { margin-block-start: var(--altmez-space-7); display: flex; justify-content: center; }

/* --------------------------------------------------------------------------
   8. CLOSING CTA
   -------------------------------------------------------------------------- */
.altmez-cta {
  background: var(--altmez-accent);
  color: var(--altmez-dark);
  padding-block: var(--altmez-section);
}
.altmez-cta__inner {
  display: grid;
  gap: var(--altmez-space-6);
  align-items: center;
  grid-template-columns: 1fr;
  text-align: center;
  justify-items: center;
}
@media (min-width: 900px) {
  .altmez-cta__inner { grid-template-columns: minmax(0, 1fr) auto; text-align: start; justify-items: start; }
}
.altmez-cta h2 { margin: 0 0 var(--altmez-space-3); color: var(--altmez-dark); font-size: var(--altmez-fs-h2); font-weight: var(--altmez-fw-black); }
.altmez-cta p  { margin: 0; color: rgba(16, 21, 28, .78); font-size: var(--altmez-fs-body); max-inline-size: 60ch; }
.altmez-cta__actions { display: flex; flex-wrap: wrap; gap: var(--altmez-space-3); }
.altmez-cta__actions .altmez-btn { --_bg: var(--altmez-dark); --_fg: var(--altmez-on-dark); --_bd: var(--altmez-dark); }
.altmez-cta__actions .altmez-btn--whatsapp { --_bg: #fff; --_fg: var(--altmez-dark); --_bd: #fff; }
.altmez-cta__actions .altmez-btn--whatsapp:hover { --_bg: var(--altmez-dark); --_fg: #fff; --_bd: var(--altmez-dark); }