/*
Theme Name: Arhitektura
Theme URI: https://arhitektura.webtest-am.com
Author: Aleksandar
Author URI: https://arhitektura.webtest-am.com
Description: Arhitektura – luksuzni dizajn enterijera, OnePage tema.
Version: 1.3.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: arhitektura
Tags: one-page, luxury, architecture
*/

/* ============================================================
   CSS CUSTOM PROPERTIES  (overridden dynamically via Customizer)
   ============================================================ */
:root {
  /* Boje */
  --arh-dark:       #0e0e10;
  --arh-cream:      #f5f1ea;
  --arh-beige:      #f3f3f3;
  --arh-green:      #314f41;
  --arh-gold:       #c9b289;
  --arh-gold-cta:   #8b6f47;
  --arh-text:       #5a564f;
  --arh-border:     #d9d9d9;
  --arh-navbar-bg:  #f5f1ea;
  --arh-navbar-h:   65px;
  --arh-section-bg: #f5f1ea;

  /* Tipografija */
  --arh-font-body-family:    "Avenir-Book", "Avenir", Arial, sans-serif;
  --arh-font-heading-family: "CormorantGaramond-Regular", "Cormorant Garamond", Georgia, serif;
  --arh-font-body-size:      16px;
  --arh-font-service-desc:   16px;
  --arh-font-label-size:     8px;
  --arh-font-nav-size:       8px;
  --arh-font-cta-size:       10px;
  --arh-font-body-lh:        1.6;
  --arh-font-letter-spacing: 0.3px;
}

/* ============================================================
   RESET & BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  background: #ffffff;
  color: var(--arh-text);
  font-family: var(--arh-font-body-family);
  font-size: var(--arh-font-body-size);
  line-height: var(--arh-font-body-lh);
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; }
a { text-decoration: none; color: inherit; }

/* Offset each anchored section so sticky navbar doesn't cover it */
section[id], footer[id] {
  scroll-margin-top: var(--arh-navbar-h);
}

/* ============================================================
   TYPOGRAPHY HELPERS
   ============================================================ */
.arh-label {
  font-family: var(--arh-font-body-family);
  font-size: var(--arh-font-label-size);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--arh-dark);
  margin-bottom: .5rem;
  display: block;
}

.arh-heading-mixed {
  font-size: clamp(32px, 5vw, 52px);
  line-height: 1.15;
  font-weight: 400;
  margin-bottom: 1.25rem;
}
.arh-heading-mixed .word-green {
  color: var(--arh-green);
  font-family: var(--arh-font-heading-family);
}
.arh-heading-mixed .word-gold-italic {
  color: var(--arh-gold);
  font-family: var(--arh-font-heading-family);
  font-style: italic;
}

.arh-body-text {
  font-family: var(--arh-font-body-family);
  font-size: var(--arh-font-body-size);
  line-height: var(--arh-font-body-lh);
  letter-spacing: var(--arh-font-letter-spacing);
  color: var(--arh-text);
}

/* Headings typed via the admin WYSIWYG "format" dropdown (H2/H3/H4) */
.arh-body-text h2,
.arh-body-text h3,
.arh-body-text h4 {
  font-family: var(--arh-font-heading-family);
  font-style: normal;
  color: var(--arh-green);
  line-height: 1.25;
  margin: 1.5rem 0 .5rem;
}
.arh-body-text h2 { font-size: 28px; }
.arh-body-text h3 { font-size: 22px; }
.arh-body-text h4 { font-size: 18px; }
.arh-body-text > :first-child { margin-top: 0; }

.arh-small-caps {
  font-family: "Avenir-Heavy", "Avenir", sans-serif;
  font-size: 8px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--arh-text);
}

.arh-cta-link {
  font-family: var(--arh-font-body-family);
  font-size: var(--arh-font-cta-size);
  letter-spacing: 2px;
  color: var(--arh-gold-cta);
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: color .2s;
}
.arh-cta-link::after { content: "→"; font-size: 14px; line-height: 1; }
.arh-cta-link:hover  { color: var(--arh-green); }

/* ============================================================
   VIDEO BACKGROUND & OVERLAY
   ============================================================ */

/* Full-cover video background (hero section) */
.arh-bg-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  pointer-events: none;
}

/* Semi-transparent overlay (hero + img-frame) */
.arh-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

/* Ensure hero content sits above video / overlay */
.arh-hero .arh-hero-line,
.arh-hero .arh-hero-inner { position: relative; z-index: 2; }

/* img-frame already has overflow:hidden; position:relative needed for overlay */
.arh-img-frame { position: relative; }

/* Font Awesome service icon */
.arh-service-icon-fa {
  font-size: 26px;
  color: var(--arh-gold);
  margin-bottom: 1rem;
  display: block;
  line-height: 1;
}

/* ============================================================
   NAVBAR — split layout:  Left menu | Logo | Right menu
   ============================================================ */
.arh-navbar {
  background: var(--arh-navbar-bg);
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1030;
  transition: box-shadow .3s;
}
.arh-navbar.scrolled {
  box-shadow: 0 2px 16px rgba(80,69,50,.15);
}

/* Inner flex row fills the full navbar height */
.arh-nav-inner {
  display: flex;
  align-items: center;
  height: var(--arh-navbar-h);
  gap: .5rem;
}

/* Logo — centered anchor */
.arh-nav-logo {
  flex-shrink: 0;
  text-decoration: none;
  color: var(--arh-green);
  font-family: "Avenir-Heavy", "Avenir", sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 1.25rem;
  white-space: nowrap;
}
.arh-nav-logo img,
.arh-nav-logo .custom-logo {
  height: 40px;
  width: auto;
  display: block;
}

/* Left half — align links to the right (toward logo) */
.arh-nav-left {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
}

/* Right half — align links to the left (toward logo) */
.arh-nav-right {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
}

/* <ul> produced by wp_nav_menu */
.arh-nav-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
}
.arh-nav-menu li { position: relative; }
.arh-nav-menu li a {
  font-family: var(--arh-font-body-family);
  font-size: var(--arh-font-nav-size);
  letter-spacing: 2px;
  color: var(--arh-dark);
  text-transform: uppercase;
  padding: .35rem .9rem;
  display: block;
  white-space: nowrap;
  transition: color .2s;
  text-decoration: none;
}
.arh-nav-menu li a:hover,
.arh-nav-menu li.current-menu-item > a,
.arh-nav-menu li.active > a { color: var(--arh-green); }

/* ── Hamburger button (mobile only) ─────────────────────────── */
.arh-hamburger {
  background: none;
  border: none;
  cursor: pointer;
  padding: .4rem;
  margin-left: auto;        /* push to far right on mobile */
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  flex-shrink: 0;
}
.arh-hamburger span {
  display: block;
  width: 22px;
  height: 1.5px;
  background: var(--arh-green);
  transition: transform .28s ease, opacity .28s ease;
}
/* Animated X when open */
.arh-hamburger.is-open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.arh-hamburger.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.arh-hamburger.is-open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* ── Mobile drawer ───────────────────────────────────────────── */
.arh-nav-mobile {
  background: var(--arh-navbar-bg);
  overflow: hidden;
  max-height: 0;
  transition: max-height .35s cubic-bezier(.4,0,.2,1),
              border-color .35s;
  border-top: 1px solid transparent;
}
.arh-nav-mobile.is-open {
  max-height: 500px;
  border-top-color: var(--arh-border);
}
.arh-nav-mobile .container {
  padding-top: .75rem;
  padding-bottom: 1rem;
}
/* Stack items vertically */
.arh-nav-mobile .arh-nav-menu {
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}
.arh-nav-mobile .arh-nav-menu + .arh-nav-menu {
  border-top: 1px solid var(--arh-border);
  margin-top: .25rem;
  padding-top: .25rem;
}
.arh-nav-mobile .arh-nav-menu li a {
  padding: .5rem 0;
}

/* ============================================================
   HERO
   ============================================================ */
.arh-hero {
  background: var(--arh-dark);
  min-height: 100svh;
  padding-top: var(--arh-navbar-h);
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}
.arh-hero-line {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 140px;
  width: 1px;
  background: rgba(255,255,255,.15);
  transform: translateX(-50%);
}
.arh-hero-inner {
  width: 100%;
  padding-bottom: clamp(48px, 7vw, 88px);
  text-align: center;
}
.arh-hero-tagline {
  font-family: "Avenir-Black", "Avenir", sans-serif;
  font-size: 8px;
  letter-spacing: 3px;
  color: var(--arh-gold);
  font-weight: 900;
  margin-bottom: .75rem;
}
.arh-hero-title {
  font-family: var(--arh-font-heading-family);
  font-size: clamp(36px, 5.5vw, 52px);
  line-height: 1.25;
  color: #ffffff;
  font-weight: 500;
  margin-bottom: 1rem;
}
.arh-hero-subtitle {
  font-family: "Avenir-Heavy", "Avenir", sans-serif;
  font-size: 8px;
  letter-spacing: 2px;
  color: var(--arh-cream);
}

/* ============================================================
   SECTION: O NAMA
   ============================================================ */
.arh-onama {
  background: var(--arh-section-bg);
  padding: 4rem 0;
  border-top: 1px solid var(--arh-border);
  border-bottom: 1px solid var(--arh-border);
  position: relative;
  overflow: hidden;
}
/* Watermark signature behind the O Nama content */
.arh-onama-watermark {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: clamp(240px, 36vw, 516px);
  height: auto;
  pointer-events: none;
  user-select: none;
  z-index: 0;
}
/* Keep text content above watermark */
.arh-onama .container { position: relative; z-index: 1; }
.arh-author {
  font-family: "CormorantGaramond-Italic", "Cormorant Garamond", Georgia, serif;
  font-size: 14px;
  letter-spacing: .3px;
  color: var(--arh-text);
  font-style: italic;
  margin-top: 1.25rem;
}

/* ── Rich body text (WYSIWYG content) ─────────────────────────
   The "O nama" / "O metodi" bodies are longer, formatted copy
   (paragraphs, bold sub-headings, bullet list, highlighted words)
   instead of a single uppercase block — style them as readable
   running text. Both sections share these rules. */
.arh-onama .arh-body-text,
.arh-metoda .arh-body-text {
  text-align: left;
  text-transform: none;
  letter-spacing: normal;
  font-size: 16px;
  line-height: 1.85;
}

.arh-onama .arh-body-text p,
.arh-metoda .arh-body-text p {
  margin: 0 0 1.1rem;
}
.arh-onama .arh-body-text p:last-child,
.arh-metoda .arh-body-text p:last-child {
  margin-bottom: 0;
}

/* Hide stray <br> the editor/nl2br leaves between block elements
   (direct children of the wrapper or of its empty <div> groups) —
   real line breaks typed inside a paragraph are left untouched. */
.arh-onama .arh-body-text > br,
.arh-onama .arh-body-text div > br,
.arh-onama .arh-body-text ul > br,
.arh-metoda .arh-body-text > br,
.arh-metoda .arh-body-text div > br,
.arh-metoda .arh-body-text ul > br {
  display: none;
}

/* Bold italic sub-headings ("O metodi", "Kako radimo" …) */
.arh-onama .arh-body-text strong,
.arh-metoda .arh-body-text strong {
  display: inline-block;
  font-family: var(--arh-font-heading-family);
  font-style: normal;
  font-size: 20px;
  font-weight: 600;
  color: var(--arh-green);
  letter-spacing: .3px;
  margin: 1.5rem 0 .5rem;
}
.arh-onama .arh-body-text p:has(> strong:only-child),
.arh-metoda .arh-body-text p:has(> strong:only-child) {
  margin-bottom: .5rem;
}

/* Gold highlighted phrase */
.arh-onama .arh-body-text .x_word-gold-italic,
.arh-onama .arh-body-text .word-gold-italic,
.arh-metoda .arh-body-text .x_word-gold-italic,
.arh-metoda .arh-body-text .word-gold-italic {
  color: var(--arh-gold);
  font-style: italic;
}

/* Benefits list */
.arh-onama .arh-body-text ul,
.arh-metoda .arh-body-text ul {
  list-style: none;
  margin: 0 0 1.25rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .6rem;
  text-align: left;
}
.arh-onama .arh-body-text ul li,
.arh-metoda .arh-body-text ul li {
  position: relative;
  padding-left: 1.4rem;
}
.arh-onama .arh-body-text ul li::before,
.arh-metoda .arh-body-text ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .5em;
  width: 6px;
  height: 6px;
  background: var(--arh-gold);
  border-radius: 50%;
}

/* Empty wrapper <div>s left by the pasted markup shouldn't add gaps */
.arh-onama .arh-body-text div:empty,
.arh-metoda .arh-body-text div:empty {
  display: none;
}

/* ============================================================
   SECTION: O METODI  (image column + text column)
   ============================================================ */
.arh-metoda {
  padding: 4.5rem 0;
  border-bottom: 1px solid var(--arh-border);
  position: relative;
  overflow: hidden;
}
.arh-metoda--bg-cream       { background: var(--arh-section-bg); }
.arh-metoda--bg-white       { background: #ffffff; }
.arh-metoda--bg-transparent { background: transparent; }

/* ── Image frame ─────────────────────────────────────────── */
.arh-metoda-frame {
  position: relative;
  width: 100%;
  border-radius: 16px;
  border: 2px solid var(--arh-gold);
  overflow: hidden;
}
.arh-metoda-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* "Auto" ratio — image keeps its natural proportions */
.arh-metoda-frame:not([style*="aspect-ratio"]) img {
  height: auto;
}

/* ── Text column ─────────────────────────────────────────── */
.arh-metoda-content {
  text-align: left;
}
.arh-metoda-content .arh-label {
  text-align: left;
}
.arh-metoda-content .arh-heading-mixed {
  font-size: clamp(30px, 3.8vw, 46px);
  margin-bottom: 1.5rem;
}
/* First sub-heading shouldn't push the text away from the title */
.arh-metoda .arh-body-text > :first-child strong,
.arh-metoda .arh-body-text > div:first-child p:first-child strong {
  margin-top: 0;
}

/* ── Tablet & phone — image stacks above the text ─────────── */
@media (max-width: 991px) {
  .arh-metoda { padding: 2.5rem 0; }
  /* Only frames with a chosen ratio are flattened — "original
     proportions" stays untouched. */
  .arh-metoda-frame[style*="aspect-ratio"] { aspect-ratio: 4 / 3 !important; }
}
@media (max-width: 576px) {
  .arh-metoda { padding: 2rem 0; }
  .arh-metoda-content .arh-heading-mixed { margin-bottom: 1rem; }
}

/* ============================================================
   SECTION: USLUGE
   ============================================================ */
.arh-services {
  background: var(--arh-section-bg);
  padding: 3rem 0 1rem;
}
.arh-services .arh-heading-mixed {
  margin-bottom: 2.5rem;
}
.arh-service-card {
  padding: 2rem 1.25rem;
}
/* No vertical dividers between service columns */
/* No horizontal divider between service rows */
.arh-service-row { border-bottom: none !important; }
.arh-service-icon {
  width: 45px;
  height: 45px;
  margin-bottom: 1rem;
  object-fit: contain;
}
.arh-service-title {
  font-family: var(--arh-font-body-family);
  font-size: var(--arh-font-cta-size);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--arh-gold-cta);
  margin-bottom: .6rem;
}
/* Service card body text has its own size control */
.arh-service-card .arh-body-text {
  font-size: var(--arh-font-service-desc);
}
.arh-services-divider {
  height: 1px;
  background: var(--arh-border);
  margin: 0;
}

/* ============================================================
   SECTION: HERO IMAGE
   ============================================================ */
.arh-hero-img-section {
  background: var(--arh-section-bg);
  padding: 3rem 0 4rem;
  overflow: visible; /* allow deco image to protrude */
}
.arh-img-section-wrap {
  position: relative; /* anchor for deco image */
}
.arh-img-frame {
  border-radius: 16px;
  border: 2px solid var(--arh-gold);
  overflow: hidden;
  width: 100%;
  aspect-ratio: 21 / 8;
  position: relative; /* for overlay */
}
.arh-img-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Decorative image — right side of frame */
.arh-deco-img {
  position: absolute;
  right: -250px;
  bottom: -40px;
  width: clamp(400px, 30vw, 895px);
  height: auto;
  z-index: 5;
  pointer-events: none;
  display: block;
}

/* ============================================================
   MOBILE OPTIMIZATIONS — tablet & phone (≤ 991px)
   ============================================================ */
@media (max-width: 991px) {

  /* ── Featured photo frame: +30% taller (21/8 → 2/1 ratio) ── */
  .arh-img-frame { aspect-ratio: 2 / 1; }

  /* ── Deco plant: reposition to stay visible (don't hide) ──── */
  .arh-deco-img {
    display: block;
    right: -10px;
    bottom: -14px;
    width: clamp(100px, 30vw, 190px);
  }

  /* ── Section padding — trim excess whitespace ─────────────── */
  .arh-onama            { padding: 2.5rem 0; }
  .arh-services         { padding: 1.75rem 0 0.5rem; }
  .arh-hero-img-section { padding: 1.75rem 0 2.5rem; }
  .arh-portfolio        { padding: 3rem 0 1.5rem; }
  .arh-novosti          { padding: 3rem 0; }
  .arh-newsletter       { padding: 2rem 0 2.5rem; }
  .arh-footer           { padding: 2.5rem 0 1.5rem; }

  /* ── Portfolio fan — less vertical breathing room ─────────── */
  .arh-portfolio-gallery { padding: 40px 12px 20px; }

  /* ── Service cards — tighter on tablet ───────────────────── */
  .arh-service-card { padding: 1.5rem 1rem; }

  /* ── Footer grid: reduce row gap ─────────────────────────── */
  .arh-footer .row.gy-5 { --bs-gutter-y: 2rem !important; }
}

/* ============================================================
   SMALL PHONES (≤ 576px) — further refinements
   ============================================================ */
@media (max-width: 576px) {

  /* Even taller frame on small phones */
  .arh-img-frame { aspect-ratio: 4 / 3; }

  /* Deco plant smaller so it doesn't overlap the frame badly */
  .arh-deco-img {
    right: -6px;
    bottom: -10px;
    width: clamp(72px, 26vw, 130px);
  }

  /* Extra section trim on phones */
  .arh-onama      { padding: 2rem 0; }
  .arh-portfolio  { padding: 2.25rem 0 1rem; }
  .arh-novosti    { padding: 2.25rem 0; }
  .arh-footer     { padding: 2rem 0 1rem; }

  /* Newsletter box inner padding */
  .arh-newsletter-box { padding: 1.75rem 1.25rem !important; }

  /* Service card padding on small phones */
  .arh-service-card { padding: 1.25rem .75rem; }

  /* Portfolio fan — less top space on tiny screen */
  .arh-portfolio-gallery { padding: 32px 8px 16px; }
}

/* ============================================================
   SECTION: PORTFOLIO
   ============================================================ */
.arh-portfolio {
  background: var(--arh-section-bg);
  padding: 5rem 0 3rem;
}

/* Intro copy — multiple paragraphs, now wrapped in <p> via wpautop() */
.arh-portfolio .arh-body-text {
  line-height: 1.85;
}
.arh-portfolio .arh-body-text p {
  margin: 0 0 1.1rem;
}
.arh-portfolio .arh-body-text p:last-child {
  margin-bottom: 0;
}

/* ── Gallery — staggered straight layout (Figma-exact) ─────────
 *
 * Each image keeps its own width/height and a top offset (margin-top)
 * measured from the top of the row. Images are NOT rotated.
 * The whole thing scales with the --s custom property per breakpoint.
 *
 * Figma values (left→right):
 *   1: 180×277, top +119   4px gaps, total width 1166px, centered
 *   2: 240×498, top +73
 *   3: 306×470, top  0   (tallest, highest)
 *   4: 252×390, top +114
 *   5: 172×259, top +73
 */
.arh-portfolio-gallery {
  --s: .50;                  /* scale factor — overridden at breakpoints */
  display: flex;
  gap: 4px;
  align-items: flex-start;   /* stagger comes from per-image margin-top */
  justify-content: center;
  overflow-x: auto;
  overflow-y: visible;
  padding: 20px 16px 36px;
  scrollbar-width: none;
}
.arh-portfolio-gallery::-webkit-scrollbar { display: none; }

.port-img {
  border-radius: 8px;
  border: 1px solid var(--arh-gold);
  object-fit: cover;
  flex-shrink: 0;
  display: block;
  box-shadow: 0 6px 24px rgba(0,0,0,.10);
  width:      calc(var(--w)  * var(--s) * 1px);
  height:     calc(var(--h)  * var(--s) * 1px);
  margin-top: calc(var(--mt) * var(--s) * 1px);
}
.port-img:nth-child(1) { --w: 180; --h: 277; --mt: 119; }
.port-img:nth-child(2) { --w: 240; --h: 498; --mt:  73; }
.port-img:nth-child(3) { --w: 306; --h: 470; --mt:   0; }
.port-img:nth-child(4) { --w: 252; --h: 390; --mt: 114; }
.port-img:nth-child(5) { --w: 172; --h: 259; --mt:  73; }

/* Scale up per breakpoint */
@media (min-width: 576px)  { .arh-portfolio-gallery { --s: .60; } }
@media (min-width: 768px)  { .arh-portfolio-gallery { --s: .74; } }
@media (min-width: 992px)  { .arh-portfolio-gallery { --s: .88; } }
@media (min-width: 1200px) {
  .arh-portfolio-gallery { --s: 1; overflow-x: visible; }
}

/* ============================================================
   SECTION: NOVOSTI
   ============================================================ */
.arh-novosti {
  background: var(--arh-section-bg);
  padding: 5rem 0;
}
.arh-news-card {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--arh-gold);
  aspect-ratio: 4/5;
  display: block;
}
.arh-news-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.arh-news-card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(49,79,65,.92) 0%, rgba(49,79,65,.55) 60%, transparent 100%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 1.5rem;
  opacity: 0;
  transition: opacity .35s ease;
}
.arh-news-card:hover .arh-news-card-overlay { opacity: 1; }
.arh-news-card-title {
  font-family: "Avenir-Book", "Avenir", sans-serif;
  font-size: 18px;
  line-height: 28px;
  color: #f3f3f3;
  margin-bottom: .25rem;
}
.arh-news-card-cta {
  font-family: "Avenir-Heavy", "Avenir", sans-serif;
  font-size: 10px;
  letter-spacing: 2px;
  color: var(--arh-gold);
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.arh-news-card-cta::after { content: "→"; }

/* ============================================================
   SECTION: NEWSLETTER BANNER
   ============================================================ */
.arh-newsletter {
  background: var(--arh-section-bg);
  padding: 3rem 0 4rem;
}
.arh-newsletter-box {
  background: var(--arh-green);
  border-radius: 8px;
  padding: clamp(2rem, 5vw, 3.5rem) clamp(1.5rem, 5vw, 4rem);
  box-shadow: 0 6px 24px rgba(0,0,0,.1);
}
.arh-nl-heading {
  font-size: clamp(28px, 4vw, 52px);
  line-height: 1.1;
  font-weight: 400;
  margin-bottom: 1rem;
}
.arh-nl-heading .word-white {
  color: #f3f3f3;
  font-family: var(--arh-font-heading-family);
}
.arh-nl-heading .word-gold-italic {
  color: var(--arh-gold);
  font-family: var(--arh-font-heading-family);
  font-style: italic;
}
.arh-nl-desc {
  color: #f3f3f3;
  font-family: "Avenir-Book", "Avenir", sans-serif;
  font-size: 12px;
  line-height: 17px;
  letter-spacing: .3px;
  margin-bottom: 0;
}
.arh-btn-primary {
  background: #f3f3f3;
  color: var(--arh-dark);
  font-family: "Avenir-Roman", "Avenir", sans-serif;
  font-size: 8px;
  letter-spacing: 2px;
  text-transform: uppercase;
  border-radius: 30px;
  padding: .75rem 2rem;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background .2s;
  display: inline-block;
}
.arh-btn-primary:hover { background: #e0ddd8; color: var(--arh-dark); }
.arh-btn-secondary {
  background: transparent;
  color: #f3f3f3;
  font-family: "Avenir-Roman", "Avenir", sans-serif;
  font-size: 8px;
  letter-spacing: 2px;
  text-transform: uppercase;
  border-radius: 30px;
  padding: .75rem 2rem;
  border: .5px solid #f3f3f3;
  cursor: pointer;
  white-space: nowrap;
  transition: background .2s;
  display: inline-block;
}
.arh-btn-secondary:hover { background: rgba(255,255,255,.1); color: #f3f3f3; }

/* ============================================================
   FOOTER
   ============================================================ */
.arh-footer {
  background: var(--arh-section-bg);
  border-top: 1px solid var(--arh-border);
  padding: 4rem 0 2rem;
}
.arh-footer-col-label {
  font-family: "Avenir-Black", "Avenir", sans-serif;
  font-size: 8px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--arh-gold-cta);
  font-weight: 900;
  margin-bottom: .85rem;
  display: block;
}
.arh-footer-links a {
  display: block;
  font-family: "Avenir-Light", "Avenir", sans-serif;
  font-size: 10px;
  line-height: 1.8;
  letter-spacing: .3px;
  color: var(--arh-text);
  transition: color .2s;
}
.arh-footer-links a:hover { color: var(--arh-green); }
/* wp_nav_menu output inside footer-links */
.arh-footer-nav-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.arh-footer-nav-list li { padding: 0; margin: 0; }
.arh-footer-nav-list li a {
  display: block;
  font-family: "Avenir-Light", "Avenir", sans-serif;
  font-size: 10px;
  line-height: 1.8;
  letter-spacing: .3px;
  color: var(--arh-text);
  transition: color .2s;
  text-decoration: none;
}
.arh-footer-nav-list li a:hover,
.arh-footer-nav-list li.current-menu-item > a { color: var(--arh-green); }
.arh-footer-desc {
  font-family: "CormorantGaramond-Italic", "Cormorant Garamond", Georgia, serif;
  font-size: 10px;
  line-height: 14px;
  letter-spacing: .3px;
  color: var(--arh-text);
  font-style: italic;
}
/* Signature image in footer */
.arh-footer-signature {
  display: block;
  max-width: 160px;
  height: auto;
  margin: .75rem 0 .5rem auto;
  margin-right: 15px;
  opacity: .85;
}

.arh-footer-contact {
  font-family: "Avenir-Light", "Avenir", sans-serif;
  font-size: 10px;
  line-height: 1.8;
  letter-spacing: .3px;
  color: var(--arh-text);
}
.arh-footer-contact .letter {
  font-family: "CormorantGaramond-Regular", "Cormorant Garamond", Georgia, serif;
  font-size: 14px;
  line-height: 24px;
}
.arh-footer-contact a:hover { color: var(--arh-green); }

/* Footer newsletter */
.arh-footer-nl-wrap { border-bottom: .5px solid var(--arh-gold); display: flex; align-items: center; }
.arh-footer-nl-input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  font-family: "Avenir-Light", "Avenir", sans-serif;
  font-size: 10px;
  letter-spacing: .3px;
  color: var(--arh-text);
  padding: .3rem 0;
}
.arh-footer-nl-input::placeholder { color: rgba(90,86,79,.42); }
.arh-footer-nl-btn {
  font-family: "Avenir-Black", "Avenir", sans-serif;
  font-size: 6px;
  letter-spacing: 2px;
  color: var(--arh-gold);
  background: none;
  border: none;
  padding: .3rem 0 .3rem .5rem;
  text-transform: uppercase;
  cursor: pointer;
  font-weight: 900;
  flex-shrink: 0;
  transition: color .2s;
}
.arh-footer-nl-btn:hover { color: var(--arh-green); }

/* Social icons */
.arh-socials { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 1rem; }
.arh-socials a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid var(--arh-gold);
  color: var(--arh-gold-cta);
  font-size: 12px;
  transition: background .2s, color .2s;
}
.arh-socials a:hover { background: var(--arh-gold); color: #fff; }

/* ============================================================
   SINGLE POST
   ============================================================ */

/* ── Hero ──────────────────────────────────────────────────── */
.arh-post-hero {
  background: var(--arh-dark);
  min-height: 52vh;
  padding-top: var(--arh-navbar-h);
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}
.arh-post-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.arh-post-hero-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.arh-post-hero-inner {
  position: relative;
  z-index: 2;
  padding-bottom: clamp(2.5rem, 5vw, 4.5rem);
  text-align: center;
}
.arh-post-cat {
  display: inline-block;
  font-family: var(--arh-font-body-family);
  font-size: 8px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--arh-gold);
  margin-bottom: 1rem;
}
.arh-post-title {
  font-family: var(--arh-font-heading-family);
  font-size: clamp(28px, 4.5vw, 52px);
  line-height: 1.2;
  color: #fff;
  font-weight: 500;
  margin-bottom: 1.25rem;
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
}
/* No featured image — use cream style */
.arh-post-hero:not(.has-thumb) {
  background: var(--arh-section-bg);
  border-bottom: 1px solid var(--arh-border);
}
.arh-post-hero:not(.has-thumb) .arh-post-cat { color: var(--arh-gold-cta); }
.arh-post-hero:not(.has-thumb) .arh-post-title { color: var(--arh-green); }
.arh-post-hero:not(.has-thumb) .arh-post-meta  { color: var(--arh-text); }

.arh-post-meta {
  font-family: var(--arh-font-body-family);
  font-size: 8px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--arh-cream);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  flex-wrap: wrap;
}
.arh-post-meta-dot { color: var(--arh-gold); }

/* ── Body ──────────────────────────────────────────────────── */
.arh-post-body {
  background: var(--arh-section-bg);
  padding: 4rem 0 5rem;
}
.arh-post-back {
  display: inline-block;
  font-family: var(--arh-font-body-family);
  font-size: 8px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--arh-gold-cta);
  margin-bottom: 2.5rem;
  transition: color .2s;
  text-decoration: none;
}
.arh-post-back:hover { color: var(--arh-green); }

/* Content typography */
.arh-post-content {
  font-family: var(--arh-font-body-family);
  font-size: 15px;
  line-height: 1.8;
  letter-spacing: .2px;
  color: var(--arh-text);
}
.arh-post-content p  { margin-bottom: 1.4rem; }
.arh-post-content h2 {
  font-family: var(--arh-font-heading-family);
  font-size: clamp(22px, 3vw, 32px);
  color: var(--arh-green);
  font-weight: 400;
  margin: 2.5rem 0 1rem;
}
.arh-post-content h3 {
  font-family: var(--arh-font-body-family);
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--arh-dark);
  margin: 2rem 0 .75rem;
}
.arh-post-content img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  border: 1px solid var(--arh-gold);
  margin: 1.5rem 0;
  display: block;
}
.arh-post-content blockquote {
  border-left: 2px solid var(--arh-gold);
  margin: 2rem 0;
  padding: 1rem 1.5rem;
  font-family: var(--arh-font-heading-family);
  font-style: italic;
  font-size: clamp(18px, 2.5vw, 24px);
  color: var(--arh-green);
  line-height: 1.4;
  background: rgba(201,178,137,.07);
  border-radius: 0 6px 6px 0;
}
.arh-post-content blockquote p { margin-bottom: 0; }
.arh-post-content ul, .arh-post-content ol {
  padding-left: 1.25rem;
  margin-bottom: 1.4rem;
}
.arh-post-content li { margin-bottom: .4rem; }
.arh-post-content a {
  color: var(--arh-gold-cta);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color .2s;
}
.arh-post-content a:hover { color: var(--arh-green); }

/* Tags */
.arh-post-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 2.5rem;
}
.arh-post-tag {
  font-family: var(--arh-font-body-family);
  font-size: 8px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--arh-text);
  border: 1px solid var(--arh-border);
  border-radius: 30px;
  padding: .3rem .9rem;
  text-decoration: none;
  transition: border-color .2s, color .2s;
}
.arh-post-tag:hover { border-color: var(--arh-gold); color: var(--arh-green); }

/* Divider */
.arh-post-divider {
  border: none;
  border-top: 1px solid var(--arh-border);
  margin: 2.5rem 0;
}

/* Prev / Next nav */
.arh-post-nav {
  display: flex;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.arh-post-nav-item {
  flex: 1;
  min-width: 140px;
  display: flex;
  flex-direction: column;
  gap: .4rem;
  text-decoration: none;
}
.arh-post-nav-right { text-align: right; }
.arh-post-nav-dir {
  font-family: var(--arh-font-body-family);
  font-size: 8px;
  letter-spacing: 2px;
  color: var(--arh-gold-cta);
  text-transform: uppercase;
  transition: color .2s;
}
.arh-post-nav-item:hover .arh-post-nav-dir { color: var(--arh-green); }
.arh-post-nav-name {
  font-family: var(--arh-font-heading-family);
  font-size: 17px;
  color: var(--arh-green);
  line-height: 1.3;
}

/* ── Related posts ─────────────────────────────────────────── */
.arh-post-related {
  background: var(--arh-section-bg);
  border-top: 1px solid var(--arh-border);
  padding: 4rem 0 5rem;
}

/* Copyright */
.arh-copyright {
  text-align: center;
  font-family: "Avenir-LightOblique", "Avenir", sans-serif;
  font-size: 8px;
  letter-spacing: .3px;
  color: var(--arh-gold-cta);
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--arh-border);
}


/* ════════════════════════════════════════════════════════════
   CONSULTATION PAGE
   ════════════════════════════════════════════════════════════ */

/* ── Hero ──────────────────────────────────────────────────── */
.arh-consultation-page .arh-navbar { background: var(--arh-navbar-bg); }

.arh-consult-hero {
  background: var(--arh-dark);
  padding: calc(var(--arh-navbar-h) + 4rem) 0 4.5rem;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.arh-consult-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 60% 40%, rgba(201,178,137,.08) 0%, transparent 70%);
  pointer-events: none;
}
.arh-consult-hero-inner { position: relative; z-index: 1; }
.arh-consult-hero-title {
  font-family: var(--arh-font-heading-family);
  font-size: clamp(34px, 6vw, 68px);
  font-weight: 400;
  color: var(--arh-cream);
  line-height: 1.15;
  margin: .75rem 0 1.25rem;
}
.arh-consult-hero-title em { color: var(--arh-gold); font-style: italic; }
.arh-consult-hero-sub {
  font-family: var(--arh-font-body-family);
  font-size: 14px;
  letter-spacing: .3px;
  line-height: 1.7;
  color: rgba(245,241,234,.65);
  max-width: 520px;
  margin: 0 auto;
}

/* ── Section wrap ──────────────────────────────────────────── */
.arh-consult-section {
  background: var(--arh-section-bg);
  padding: 4rem 0 6rem;
}

/* ── Form card ─────────────────────────────────────────────── */
.arh-consult-form-wrap {
  max-width: 760px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid var(--arh-border);
  border-radius: 12px;
  padding: 2.5rem 2rem 3rem;
  box-shadow: 0 6px 40px rgba(14,14,16,.06);
}
@media (min-width: 576px) {
  .arh-consult-form-wrap { padding: 3rem 3rem 3.5rem; }
}
@media (min-width: 768px) {
  .arh-consult-form-wrap { padding: 3.5rem 4rem 4rem; }
}

/* ── Error / Success ───────────────────────────────────────── */
.arh-consult-error {
  background: rgba(180,60,60,.07);
  border: 1px solid rgba(180,60,60,.3);
  border-radius: 6px;
  padding: .9rem 1.2rem;
  font-family: var(--arh-font-body-family);
  font-size: 13px;
  color: #a04040;
  margin-bottom: 2rem;
}
.arh-consult-success {
  text-align: center;
  padding: 2rem 0 1rem;
}
.arh-consult-success-icon {
  font-size: 32px;
  color: var(--arh-gold);
  margin-bottom: 1.25rem;
  display: block;
}
.arh-consult-success-title {
  font-family: var(--arh-font-heading-family);
  font-size: clamp(26px, 4vw, 40px);
  font-weight: 400;
  color: var(--arh-green);
  line-height: 1.2;
  margin: .75rem 0 1.5rem;
}
.arh-consult-success-title em { color: var(--arh-gold); font-style: italic; }
.arh-consult-success-text {
  font-family: var(--arh-font-body-family);
  font-size: 14px;
  line-height: 1.8;
  color: var(--arh-text);
  max-width: 480px;
  margin: 0 auto;
}

/* ── Progress bar ──────────────────────────────────────────── */
.arh-progress {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 3rem;
  gap: 0;
}
.arh-progress-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .4rem;
  flex-shrink: 0;
}
.arh-progress-dot {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1.5px solid var(--arh-border);
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .3s, border-color .3s;
}
.arh-progress-dot span {
  font-family: var(--arh-font-body-family);
  font-size: 11px;
  letter-spacing: 0;
  color: var(--arh-text);
  opacity: .5;
  transition: color .3s, opacity .3s;
}
.arh-progress-label {
  font-family: var(--arh-font-body-family);
  font-size: 8px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--arh-text);
  opacity: .4;
  transition: opacity .3s, color .3s;
  white-space: nowrap;
}
.arh-progress-line {
  flex: 1;
  height: 1px;
  background: var(--arh-border);
  min-width: 24px;
  max-width: 80px;
  margin-bottom: 22px;
  transition: background .4s;
}
/* Active step */
.arh-progress-step.active .arh-progress-dot {
  background: var(--arh-gold);
  border-color: var(--arh-gold);
}
.arh-progress-step.active .arh-progress-dot span {
  color: #fff;
  opacity: 1;
}
.arh-progress-step.active .arh-progress-label {
  color: var(--arh-green);
  opacity: 1;
}
/* Completed step */
.arh-progress-step.completed .arh-progress-dot {
  background: var(--arh-green);
  border-color: var(--arh-green);
}
.arh-progress-step.completed .arh-progress-dot span {
  color: #fff;
  opacity: 1;
}
.arh-progress-step.completed .arh-progress-label {
  color: var(--arh-green);
  opacity: .7;
}
.arh-progress-line.completed { background: var(--arh-green); }

/* ── Steps ─────────────────────────────────────────────────── */
.arh-form-step {
  display: none;
  animation: arhStepIn .28s ease both;
}
.arh-form-step.active { display: block; }

@keyframes arhStepIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

.arh-form-step-header { margin-bottom: 2rem; }
.arh-form-step-num {
  font-family: var(--arh-font-body-family);
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--arh-gold-cta);
  margin-bottom: .5rem;
}
.arh-form-step-title {
  font-family: var(--arh-font-heading-family);
  font-size: clamp(22px, 3.5vw, 34px);
  font-weight: 400;
  color: var(--arh-green);
  margin: 0 0 .6rem;
}
.arh-form-step-desc {
  font-family: var(--arh-font-body-family);
  font-size: 13px;
  line-height: 1.7;
  color: var(--arh-text);
  opacity: .75;
  margin: 0;
}

/* ── Form elements ─────────────────────────────────────────── */
.arh-form-group {
  margin-bottom: 1.5rem;
}
.arh-form-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}
@media (min-width: 576px) {
  .arh-form-row { grid-template-columns: 1fr 1fr; gap: 0 1.5rem; }
}
.arh-form-group--sm { max-width: 180px; }

.arh-form-label {
  display: block;
  font-family: var(--arh-font-body-family);
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--arh-dark);
  margin-bottom: .55rem;
}
.arh-form-label--section {
  font-size: 10px;
  color: var(--arh-green);
  letter-spacing: 2.5px;
  display: block;
  margin-bottom: .3rem;
}
.arh-form-sublabel {
  display: block;
  font-family: var(--arh-font-body-family);
  font-size: 12px;
  line-height: 1.5;
  color: var(--arh-text);
  opacity: .7;
  margin-bottom: .85rem;
}
.arh-req { color: var(--arh-gold-cta); }

.arh-form-input,
.arh-form-select,
.arh-form-textarea {
  width: 100%;
  font-family: var(--arh-font-body-family);
  font-size: 14px;
  color: var(--arh-dark);
  background: var(--arh-section-bg);
  border: 1px solid var(--arh-border);
  border-radius: 6px;
  padding: .75rem 1rem;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  -webkit-appearance: none;
  appearance: none;
}
.arh-form-input:focus,
.arh-form-select:focus,
.arh-form-textarea:focus {
  border-color: var(--arh-gold);
  box-shadow: 0 0 0 3px rgba(201,178,137,.15);
}
.arh-form-input.arh-field-error,
.arh-form-select.arh-field-error,
.arh-form-textarea.arh-field-error {
  border-color: #c0392b;
  box-shadow: 0 0 0 3px rgba(192,57,43,.1);
}
.arh-form-input--sm { max-width: 120px; }
.arh-form-textarea { resize: vertical; min-height: 130px; line-height: 1.65; }

.arh-select-wrap { position: relative; }
.arh-select-wrap::after {
  content: '▾';
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--arh-gold-cta);
  pointer-events: none;
  font-size: 12px;
}
.arh-form-select { padding-right: 2.5rem; cursor: pointer; }

/* ── Checkboxes ────────────────────────────────────────────── */
.arh-check-grid {
  display: flex;
  flex-direction: column;
  gap: .6rem;
}
.arh-check-grid--lg { gap: .75rem; }
.arh-check-label {
  display: flex;
  align-items: flex-start;
  gap: .7rem;
  cursor: pointer;
  font-family: var(--arh-font-body-family);
  font-size: 13px;
  line-height: 1.5;
  color: var(--arh-text);
}
.arh-check-label input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.arh-check-box {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border: 1.5px solid var(--arh-border);
  border-radius: 3px;
  background: #fff;
  margin-top: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .2s, border-color .2s;
}
.arh-check-box::after {
  content: '';
  display: block;
  width: 5px;
  height: 9px;
  border: 1.5px solid #fff;
  border-top: none;
  border-left: none;
  transform: rotate(45deg) translate(-1px, -1px);
  opacity: 0;
  transition: opacity .15s;
}
.arh-check-label input:checked ~ .arh-check-box {
  background: var(--arh-green);
  border-color: var(--arh-green);
}
.arh-check-label input:checked ~ .arh-check-box::after { opacity: 1; }

/* Card variant for intentions */
.arh-check-label--card {
  background: var(--arh-section-bg);
  border: 1px solid var(--arh-border);
  border-radius: 8px;
  padding: .75rem 1rem;
  align-items: flex-start;
  transition: border-color .2s;
}
.arh-check-label--card:hover { border-color: var(--arh-gold); }
.arh-check-label--card input:checked ~ .arh-check-box { background: var(--arh-green); border-color: var(--arh-green); }
.arh-check-label--card > span:last-child {
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.arh-check-label--card strong {
  font-family: var(--arh-font-body-family);
  font-size: 12px;
  font-weight: 600;
  color: var(--arh-dark);
  letter-spacing: .3px;
}
.arh-check-label--card em {
  font-family: var(--arh-font-body-family);
  font-size: 11px;
  font-style: normal;
  color: var(--arh-text);
  opacity: .6;
}

/* ── Radio buttons ─────────────────────────────────────────── */
.arh-radio-group {
  display: flex;
  flex-direction: column;
  gap: .55rem;
  margin-top: .5rem;
}
.arh-radio-label {
  display: flex;
  align-items: center;
  gap: .65rem;
  cursor: pointer;
  font-family: var(--arh-font-body-family);
  font-size: 13px;
  color: var(--arh-text);
}
.arh-radio-label input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.arh-radio-dot {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1.5px solid var(--arh-border);
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color .2s;
}
.arh-radio-dot::after {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--arh-green);
  opacity: 0;
  transition: opacity .15s;
}
.arh-radio-label input:checked ~ .arh-radio-dot {
  border-color: var(--arh-green);
}
.arh-radio-label input:checked ~ .arh-radio-dot::after { opacity: 1; }

/* ── Navigation buttons ────────────────────────────────────── */
.arh-form-nav {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 2.25rem;
}
.arh-form-nav--right { justify-content: flex-end; }
.arh-form-nav--submit { flex-wrap: wrap; }

.arh-consult-btn-next,
.arh-consult-btn-submit {
  display: inline-flex;
  align-items: center;
  font-family: var(--arh-font-body-family);
  font-size: 9px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: #fff;
  background: var(--arh-green);
  border: none;
  border-radius: 0;
  padding: .85rem 2rem;
  cursor: pointer;
  text-decoration: none;
  transition: background .25s, color .25s;
}
.arh-consult-btn-next:hover,
.arh-consult-btn-submit:hover {
  background: var(--arh-gold);
  color: var(--arh-dark);
}
.arh-consult-btn-submit {
  background: var(--arh-gold);
  color: var(--arh-dark);
  font-size: 9px;
  letter-spacing: 3px;
  padding: 1rem 2.5rem;
}
.arh-consult-btn-submit:hover {
  background: var(--arh-green);
  color: #fff;
}

.arh-consult-btn-back {
  background: none;
  border: 1px solid var(--arh-border);
  color: var(--arh-text);
  font-family: var(--arh-font-body-family);
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: .85rem 1.5rem;
  cursor: pointer;
  border-radius: 0;
  transition: border-color .2s, color .2s;
}
.arh-consult-btn-back:hover {
  border-color: var(--arh-green);
  color: var(--arh-green);
}

/* ── Privacy note ──────────────────────────────────────────── */
.arh-form-privacy {
  font-family: var(--arh-font-body-family);
  font-size: 10px;
  line-height: 1.6;
  letter-spacing: .2px;
  color: var(--arh-text);
  opacity: .5;
  text-align: center;
  margin-top: 1.25rem;
  margin-bottom: 0;
}

/* ── Mobile tweaks ─────────────────────────────────────────── */
@media (max-width: 575px) {
  .arh-progress-label { display: none; }
  .arh-progress-line  { min-width: 16px; }
  .arh-form-nav--submit { flex-direction: column; align-items: stretch; }
  .arh-consult-btn-submit { text-align: center; justify-content: center; }
}


/* ════════════════════════════════════════════════════════════
   FOUNDERS SECTION
   ════════════════════════════════════════════════════════════ */
.arh-founders {
  padding: 100px 0 80px;
  background: var(--arh-cream);
  position: relative;
  overflow: hidden;
}
.arh-founders::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 40% at 10% 50%, rgba(196,164,101,.06) 0%, transparent 70%),
    radial-gradient(ellipse 50% 40% at 90% 50%, rgba(49,79,65,.05)   0%, transparent 70%);
  pointer-events: none;
}

/* ── Founder card ── */
.arh-founder-card {
  text-align: center;
  padding: 2rem 1.5rem 2.25rem;
  background: #fff;
  border: 1px solid rgba(196,164,101,.22);
  border-radius: 2px;
  position: relative;
  transition: box-shadow .3s, transform .3s;
}
.arh-founder-card::before {
  content: '';
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: 60px; height: 2px;
  background: linear-gradient(90deg, var(--arh-gold), transparent);
}
.arh-founder-card:hover {
  box-shadow: 0 12px 40px rgba(49,79,65,.10);
  transform: translateY(-4px);
}

/* ── Portrait ── */
.arh-founder-img-wrap {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto 1.5rem;
  border: 3px solid rgba(196,164,101,.35);
}
.arh-founder-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.arh-founder-img-placeholder {
  background: linear-gradient(135deg, var(--arh-green), #1e3028);
  display: flex;
  align-items: center;
  justify-content: center;
}
.arh-founder-img-placeholder span {
  font-family: var(--arh-font-heading-family);
  font-size: 3rem;
  color: var(--arh-gold);
  line-height: 1;
  font-style: italic;
}

/* ── Text ── */
.arh-founder-name {
  font-family: var(--arh-font-heading-family);
  font-size: clamp(1.15rem, 2.5vw, 1.4rem);
  font-weight: 400;
  color: var(--arh-green);
  letter-spacing: .04em;
  margin: 0 0 .35rem;
  font-style: italic;
}
.arh-founder-role {
  font-family: var(--arh-font-body-family);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--arh-gold);
  margin: 0 0 1.1rem;
}
.arh-founder-desc {
  font-family: var(--arh-font-body-family);
  font-size: 14px;
  line-height: 1.75;
  color: var(--arh-text);
  margin: 0;
  text-align: left;
}

/* ── Closing line ── */
.arh-founders-closing {
  margin: 3.5rem auto 0;
  max-width: 540px;
  font-family: var(--arh-font-heading-family);
  font-size: clamp(1rem, 2vw, 1.25rem);
  font-style: italic;
  color: var(--arh-green);
  opacity: .75;
  text-align: center;
  padding: 1.5rem;
  border-top: 1px solid rgba(196,164,101,.3);
  border-bottom: 1px solid rgba(196,164,101,.3);
}

@media (max-width: 767px) {
  .arh-founders { padding: 64px 0 56px; }
  .arh-founder-card { padding: 1.5rem 1.25rem 1.75rem; }
  .arh-founder-img-wrap { width: 120px; height: 120px; }
}

/* ============================================================
   PAGE: PRE / POSLE  (template-prepost.php)
   ============================================================ */

/* ── Hero ──────────────────────────────────────────────────── */
.arh-pp-hero {
  background: var(--arh-dark);
  padding: calc(var(--arh-navbar-h) + 4rem) 0 4rem;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.arh-pp-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 60% 40%, rgba(201,178,137,.10) 0%, transparent 70%);
  pointer-events: none;
}
.arh-pp-hero-inner { position: relative; z-index: 1; }
.arh-pp-hero-label { color: var(--arh-gold); }
.arh-pp-hero-title {
  font-family: var(--arh-font-heading-family);
  font-size: clamp(32px, 5.4vw, 62px);
  font-weight: 400;
  line-height: 1.15;
  margin: .75rem auto 1.5rem;
  max-width: 16em;
}
.arh-pp-hero-title .word-cream      { color: var(--arh-cream); }
.arh-pp-hero-title .word-gold-italic {
  color: var(--arh-gold);
  font-family: var(--arh-font-heading-family);
  font-style: italic;
}
.arh-pp-hero-intro {
  font-family: var(--arh-font-body-family);
  font-size: 15px;
  line-height: 1.85;
  color: rgba(245,241,234,.7);
  max-width: 780px;
  margin: 0 auto;
}
.arh-pp-hero-intro p:last-child { margin-bottom: 0; }

/* ── Case studies ──────────────────────────────────────────── */
.arh-pp-section {
  background: var(--arh-section-bg);
  padding: 4.5rem 0 2rem;
}
.arh-pp-case {
  padding-bottom: 4.5rem;
  margin-bottom: 4.5rem;
  border-bottom: 1px solid var(--arh-border);
}
.arh-pp-case:last-child { border-bottom: none; }

/* Everything inside a case lines up in one centred editorial column */
.arh-pp-case-head,
.arh-pp-media,
.arh-pp-text {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

.arh-pp-case-head {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  margin-bottom: 2rem;
}
.arh-pp-num {
  font-family: var(--arh-font-heading-family);
  font-size: clamp(30px, 4vw, 46px);
  line-height: 1;
  color: var(--arh-gold);
  opacity: .55;
  flex: 0 0 auto;
}
.arh-pp-case-title {
  font-size: clamp(22px, 2.6vw, 34px);
  line-height: 1.25;
  font-weight: 400;
  margin: 0;
}
.arh-pp-case-title .word-green {
  color: var(--arh-green);
  font-family: var(--arh-font-heading-family);
}
.arh-pp-case-title .word-gold-italic {
  color: var(--arh-gold);
  font-family: var(--arh-font-heading-family);
  font-style: italic;
}

/* ── Photo pair ────────────────────────────────────────────── */
.arh-pp-media { margin-bottom: 2.25rem; }
.arh-pp-shots {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
/* A lone photo doesn't need the full pair width */
.arh-pp-shots--single {
  grid-template-columns: 1fr;
  max-width: 560px;
  margin: 0 auto;
}
.arh-pp-shot { margin: 0; }
.arh-pp-frame {
  position: relative;
  aspect-ratio: 3 / 4;
  border-radius: 12px;
  border: 2px solid var(--arh-gold);
  overflow: hidden;
}
.arh-pp-shots--single .arh-pp-frame { aspect-ratio: 4 / 5; }
.arh-pp-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.arh-pp-tag {
  position: absolute;
  top: 10px;
  left: 10px;
  font-family: var(--arh-font-body-family);
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: .35rem .7rem;
  border-radius: 999px;
  backdrop-filter: blur(4px);
}
.arh-pp-tag--before {
  background: rgba(14,14,16,.62);
  color: var(--arh-cream);
}
.arh-pp-tag--after {
  background: rgba(201,178,137,.9);
  color: var(--arh-dark);
}
.arh-pp-caption {
  font-family: var(--arh-font-heading-family);
  font-style: italic;
  font-size: 14px;
  color: var(--arh-text);
  opacity: .8;
  margin: .85rem 0 0;
  text-align: center;
}

/* ── Case body copy — same rich-text treatment as the homepage ── */
.arh-pp-text .arh-body-text {
  text-align: left;
  font-size: 16px;
  line-height: 1.85;
  /* Shorter measure than the photos above it, flush to the same left edge */
  max-width: 780px;
}
.arh-pp-text .arh-body-text p { margin: 0 0 1.1rem; }
.arh-pp-text .arh-body-text p:last-child { margin-bottom: 0; }
.arh-pp-text .arh-body-text > :first-child { margin-top: 0; }

/* Bold lines act as sub-headings */
.arh-pp-text .arh-body-text strong {
  display: inline-block;
  font-family: var(--arh-font-heading-family);
  font-style: normal;
  font-size: 20px;
  font-weight: 600;
  color: var(--arh-green);
  letter-spacing: .3px;
  margin: 1.5rem 0 .5rem;
}
.arh-pp-text .arh-body-text p:has(> strong:only-child) { margin-bottom: .5rem; }

/* Bullet list — gold dots, matching the About section */
.arh-pp-text .arh-body-text ul {
  list-style: none;
  margin: 0 0 1.25rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .6rem;
}
.arh-pp-text .arh-body-text ul li {
  position: relative;
  padding-left: 1.4rem;
}
.arh-pp-text .arh-body-text ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .5em;
  width: 6px;
  height: 6px;
  background: var(--arh-gold);
  border-radius: 50%;
}

/* ── Closing CTA ───────────────────────────────────────────── */
.arh-pp-cta {
  background: var(--arh-dark);
  padding: 4rem 0;
}
.arh-pp-cta .arh-heading-mixed { margin-bottom: 1rem; }
.arh-pp-cta .word-cream        { color: var(--arh-cream); font-family: var(--arh-font-heading-family); }
.arh-pp-cta-desc {
  font-family: var(--arh-font-body-family);
  font-size: 15px;
  line-height: 1.8;
  color: rgba(245,241,234,.7);
  max-width: 620px;
  margin: 0 auto 1.75rem;
}
.arh-pp-cta-btn {
  display: inline-block;
  font-family: var(--arh-font-body-family);
  font-size: var(--arh-font-cta-size);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--arh-dark);
  background: var(--arh-gold);
  padding: .95rem 2.2rem;
  border-radius: 999px;
  transition: background .25s, transform .25s;
}
.arh-pp-cta-btn:hover {
  background: var(--arh-cream);
  transform: translateY(-2px);
}

/* ── Tablet & phone ────────────────────────────────────────── */
@media (max-width: 991px) {
  .arh-pp-hero    { padding: calc(var(--arh-navbar-h) + 2.5rem) 0 2.5rem; }
  .arh-pp-section { padding: 2.5rem 0 1rem; }
  .arh-pp-case    { padding-bottom: 2.5rem; margin-bottom: 2.5rem; }
  .arh-pp-case-head { margin-bottom: 1.25rem; gap: .75rem; }
  .arh-pp-cta     { padding: 2.5rem 0; }
}
/* Phones: side-by-side portraits get too small to read — stack them,
   the PRE / POSLE tags still tell the two apart. */
@media (max-width: 767.98px) {
  .arh-pp-shots {
    grid-template-columns: 1fr;
    gap: 14px;
    max-width: 460px;
    margin: 0 auto;
  }
  .arh-pp-frame { aspect-ratio: 4 / 5; }
}
@media (max-width: 576px) {
  .arh-pp-tag { font-size: 8px; padding: .3rem .55rem; letter-spacing: 1.5px; }
}
