/* ==========================================================================
   SALMAST Atelier / Precision Gallery — reference-led homepage redesign
   Brandbook palette only: #2e3e44 / #b59357 / #fdf4e3 / black / white.
   This layer intentionally follows the production stylesheet so the redesign
   stays reversible and does not disturb catalogue or modal logic.
   ========================================================================== */

:root {
  --atelier-blue: #2e3e44;
  --atelier-blue-deep: #2e3e44;
  --atelier-blue-night: #2e3e44;
  --atelier-gold: #b59357;
  --atelier-gold-light: #b59357;
  --atelier-beige: #fdf4e3;
  --atelier-cream: #ffffff;
  --atelier-rule: rgba(253, 244, 227, 0.22);
  --atelier-rule-dark: rgba(46, 62, 68, 0.2);
  --content-max: 1440px;
  --section-y: clamp(88px, 8vw, 132px);
  --radius: 2px;
  --radius-lg: 4px;
}

html { scroll-padding-top: 88px; }

body {
  background: var(--atelier-beige);
  letter-spacing: 0;
}

main > section:not(.hero) > .section-inner {
  max-width: var(--content-max);
}

.section-heading {
  max-width: 840px;
  margin-bottom: clamp(44px, 5vw, 76px);
}

.section-heading h2 {
  max-width: 13ch;
  font-size: clamp(46px, 6vw, 88px);
  font-weight: 500;
  line-height: 0.98;
  letter-spacing: -0.045em;
}

:root[lang="hy"] .section-heading h2,
:root[lang="hy"] .calculator-copy h2,
:root[lang="hy"] .process-card h3 {
  line-height: 1.18;
  letter-spacing: -0.035em;
}

:root[lang="hy"] .calculator-copy h2 {
  max-width: 10ch;
  font-size: clamp(44px, 4.4vw, 64px);
  line-height: 1.22;
}

/* The Latin mask reveal clips the lower extents of Armenian glyphs in some
   Chromium builds. Keep the parent reveal, but render Armenian headings whole. */
:root[lang="hy"].reveal-ready [data-reveal="heading"] h2 {
  clip-path: none !important;
  transform: none !important;
}

.section-heading > p:last-child {
  max-width: 58ch;
  margin-top: 22px;
  font-size: clamp(16px, 1.35vw, 20px);
  line-height: 1.6;
}

.eyebrow,
.hero-kicker {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.34em;
}

.primary-btn,
.secondary-btn,
.header-cta {
  min-height: 52px;
  border-radius: 999px;
  touch-action: manipulation;
}

/* Header — dark precision rail, visually continuous with the cinematic hero. */
.site-header {
  min-height: 88px;
  padding-block: 14px;
  background: rgba(46, 62, 68, 0.97);
  border-bottom: 1px solid rgba(253, 244, 227, 0.16);
  box-shadow: none;
  backdrop-filter: blur(18px);
}

.site-header.header-scrolled {
  background: rgba(46, 62, 68, 0.985);
  border-bottom-color: rgba(181, 147, 87, 0.25);
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.2);
}

.site-header .brand-logo {
  width: clamp(144px, 11vw, 174px);
  max-height: 54px;
}

.site-header .main-nav > a {
  color: rgba(253, 244, 227, 0.76);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.site-header .main-nav > a:hover,
.site-header .main-nav > a:focus-visible { color: var(--atelier-beige); }

.site-header .header-contact,
.site-header .header-contact > span { color: rgba(253, 244, 227, 0.78); }

.site-header .header-contact:hover > span { color: var(--atelier-gold-light); }

.site-header .lang-dropdown__trigger,
.site-header .theme-toggle,
.site-header .nav-toggle {
  color: var(--atelier-beige);
  border-color: rgba(253, 244, 227, 0.28);
  background: transparent;
}

.site-header .lang-dropdown__trigger:hover,
.site-header .lang-dropdown.is-open .lang-dropdown__trigger,
.site-header .theme-toggle:hover {
  color: var(--atelier-blue-deep);
  border-color: var(--atelier-gold-light);
  background: var(--atelier-gold-light);
}

.site-header .nav-toggle span { background: var(--atelier-beige); }

.site-header .header-cta {
  background: var(--atelier-gold);
  color: #2e3e44;
  border-color: var(--atelier-gold);
}

.site-header .header-cta:hover,
.site-header .header-cta:focus-visible {
  background: var(--atelier-gold-light);
  color: #2e3e44;
}

/* Hero — one full-bleed visual, restrained copy, technical facts rail. */
.hero {
  width: 100%;
  max-width: none;
  min-height: calc(100svh - 88px);
  margin: 0;
  padding: clamp(118px, 16vh, 190px) var(--gutter) clamp(28px, 4vw, 52px);
  isolation: isolate;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.34fr);
  grid-template-areas:
    "copy stage"
    "facts facts";
  align-content: end;
  align-items: end;
  column-gap: clamp(36px, 6vw, 96px);
  row-gap: clamp(52px, 8vh, 92px);
  color: var(--atelier-beige);
  background: var(--atelier-blue-night);
}

.hero::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.86) 0%, rgba(0, 0, 0, 0.62) 40%, rgba(0, 0, 0, 0.18) 72%, rgba(0, 0, 0, 0.32) 100%),
    linear-gradient(0deg, rgba(0, 0, 0, 0.84) 0%, rgba(0, 0, 0, 0.08) 50%, rgba(0, 0, 0, 0.24) 100%);
}

.hero::after {
  content: "SALMAST";
  position: absolute;
  z-index: 1;
  right: -0.025em;
  bottom: clamp(116px, 14vw, 186px);
  color: transparent;
  font-family: var(--font-display);
  font-size: clamp(96px, 17vw, 280px);
  font-weight: 600;
  line-height: 0.75;
  letter-spacing: 0.045em;
  -webkit-text-stroke: 1px rgba(253, 244, 227, 0.11);
  pointer-events: none;
  white-space: nowrap;
}

.hero-media {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  overflow: hidden;
  transform: none !important;
}

.hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
  border: 0;
  background: linear-gradient(115deg, rgba(46, 62, 68, 0.12), transparent 55%);
  opacity: 1;
}

.hero-main {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center 44%;
  border-radius: 0;
  box-shadow: none;
  background: var(--atelier-blue-night);
}

.hero-small { display: none; }

.hero-copy {
  position: relative;
  z-index: 2;
  grid-area: copy;
  align-self: end;
  max-width: 900px;
}

.hero-kicker {
  color: var(--atelier-gold-light);
}

.hero-copy h1 {
  max-width: 10.5ch;
  margin-top: 24px;
  color: var(--atelier-beige);
  font-size: clamp(54px, 7.3vw, 112px);
  font-weight: 500;
  line-height: 0.91;
  letter-spacing: -0.055em;
  text-wrap: balance;
}

:root[lang="hy"] .hero-copy h1 {
  max-width: 12ch;
  font-size: clamp(50px, 6.7vw, 102px);
  line-height: 0.98;
  letter-spacing: -0.045em;
}

.hero-lead {
  max-width: 58ch;
  margin-top: 28px;
  color: rgba(253, 244, 227, 0.8);
  font-size: clamp(16px, 1.25vw, 19px);
  line-height: 1.6;
}

.hero-actions {
  width: min(100%, 640px);
  margin-top: 34px;
  gap: 12px;
}

.hero-actions .primary-btn {
  background: var(--atelier-gold);
  color: #2e3e44;
  border-color: var(--atelier-gold);
  box-shadow: none;
}

.hero-actions .primary-btn:hover,
.hero-actions .primary-btn:focus-visible {
  background: var(--atelier-gold-light);
  color: #2e3e44;
  border-color: var(--atelier-gold-light);
}

.hero-actions .secondary-btn {
  color: var(--atelier-beige);
  border-color: rgba(253, 244, 227, 0.46);
  background: rgba(46, 62, 68, 0.2);
  backdrop-filter: blur(8px);
}

.hero-actions .secondary-btn:hover,
.hero-actions .secondary-btn:focus-visible {
  color: var(--atelier-blue-night);
  border-color: var(--atelier-beige);
  background: var(--atelier-beige);
}

.hero-trust {
  margin-top: 24px;
  color: rgba(253, 244, 227, 0.72);
}

.hero-trust:hover { color: var(--atelier-beige); }
.hero-trust__rating { color: var(--atelier-gold-light); }
.hero-trust__text::before { background: rgba(253, 244, 227, 0.36); }

.hero-stage-mark {
  position: relative;
  z-index: 2;
  grid-area: stage;
  align-self: end;
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 18px;
  padding-bottom: 10px;
  color: rgba(253, 244, 227, 0.72);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.24em;
  white-space: nowrap;
}

.hero-stage-mark span:first-child {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  color: var(--atelier-gold-light);
  border: 1px solid rgba(181, 147, 87, 0.62);
  border-radius: 50%;
}

.hero-facts {
  position: relative;
  z-index: 2;
  grid-area: facts;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  background: rgba(46, 62, 68, 0.7);
  border: 1px solid rgba(253, 244, 227, 0.2);
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: blur(14px);
}

.hero-facts > div {
  min-height: 118px;
  padding: clamp(20px, 2.1vw, 30px);
  gap: 8px;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.hero-facts > div + div { border-left: 1px solid rgba(253, 244, 227, 0.18); }

.hero-facts > div::before {
  width: 34px;
  height: 1px;
  background: var(--atelier-gold-light);
}

.hero-facts > div::after {
  top: 20px;
  right: 22px;
  color: var(--atelier-gold-light);
}

.hero-facts dt,
.hero-facts .hero-fact__title { color: var(--atelier-beige); }

.hero-facts dt { font-size: clamp(34px, 3vw, 50px); }

.hero-facts .hero-fact__title {
  max-width: 16ch;
  font-size: clamp(24px, 2.25vw, 36px);
}

.hero-facts dd {
  color: rgba(253, 244, 227, 0.7);
  font-size: 13px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* Reviews — remove generic card shells; use type, rules, and measured rhythm. */
.reviews-section {
  color: var(--atelier-beige);
  background: var(--atelier-blue);
  border-top: 1px solid rgba(253, 244, 227, 0.12);
}

.reviews-section .section-heading h2,
.reviews-section .section-heading > p:last-child { color: var(--atelier-beige); }

.reviews-section .section-heading > p:last-child { color: rgba(253, 244, 227, 0.68); }

.reviews-section .eyebrow,
.reviews-section .review-stat__star { color: var(--atelier-gold-light); }

.reviews-section .eyebrow::before { background: var(--atelier-gold); }

.reviews-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin-bottom: clamp(48px, 6vw, 84px);
  padding: 0;
  background: transparent;
  border: 0;
  border-block: 1px solid rgba(253, 244, 227, 0.24);
  border-radius: 0;
  box-shadow: none;
}

.review-stat {
  min-height: 170px;
  padding: clamp(28px, 3.5vw, 48px);
  align-content: center;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.review-stat + .review-stat { border-left: 1px solid rgba(253, 244, 227, 0.2); }

.review-stat strong {
  color: var(--atelier-beige);
  font-size: clamp(48px, 5.6vw, 82px);
  font-weight: 500;
  letter-spacing: -0.05em;
}

.review-stat > span {
  max-width: 24ch;
  color: rgba(253, 244, 227, 0.68);
  font-size: 13px;
  line-height: 1.45;
}

.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-top: 1px solid rgba(253, 244, 227, 0.22);
  border-radius: 0;
  box-shadow: none;
}

.testimonial-card {
  min-height: 350px;
  margin: 0;
  padding: clamp(34px, 4vw, 58px);
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.testimonial-card + .testimonial-card { border-left: 1px solid rgba(253, 244, 227, 0.2); }

.testimonial-card:hover { border-color: rgba(253, 244, 227, 0.2); box-shadow: none; }

.testimonial-card::before {
  color: var(--atelier-gold-light);
  font-size: 64px;
  font-weight: 400;
}

.testimonial-card__quote {
  max-width: 57ch;
  color: rgba(253, 244, 227, 0.9);
  font-size: clamp(16px, 1.45vw, 20px);
  line-height: 1.62;
}

.testimonial-card__meta { border-top-color: rgba(253, 244, 227, 0.2); }
.testimonial-card__name { color: var(--atelier-beige); }
.testimonial-card__src { color: var(--atelier-gold-light); }

.reviews-platforms {
  margin-top: 0;
  padding-top: 26px;
  border-top-color: rgba(253, 244, 227, 0.16);
}

.reviews-platforms__label { color: rgba(253, 244, 227, 0.6); }

.reviews-platforms a {
  color: rgba(253, 244, 227, 0.8);
  border-color: rgba(253, 244, 227, 0.26);
}

.reviews-platforms a:hover,
.reviews-platforms a:focus-visible {
  color: var(--atelier-blue-deep);
  border-color: var(--atelier-gold-light);
  background: var(--atelier-gold-light);
}

.reviews-section .section-cta .primary-btn {
  color: var(--atelier-blue-deep);
  background: var(--atelier-gold);
  border-color: var(--atelier-gold);
}

/* Portfolio — 12-column editorial mosaic with image-led project stories. */
.portfolio-section {
  color: var(--atelier-beige);
  background: var(--atelier-blue-deep);
  border-block: 1px solid rgba(253, 244, 227, 0.12);
}

.portfolio-section::before {
  content: "SELECTED / 12";
  position: absolute;
  top: clamp(40px, 5vw, 72px);
  right: var(--gutter);
  color: rgba(253, 244, 227, 0.46);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.24em;
}

.portfolio-section .section-heading h2 { color: var(--atelier-beige); }
.portfolio-section .section-heading > p:last-child { color: rgba(253, 244, 227, 0.66); }
.portfolio-section .eyebrow { color: var(--atelier-gold-light); }
.portfolio-section .eyebrow::before { background: var(--atelier-gold); }

.portfolio-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(12px, 1.4vw, 20px);
}

.portfolio-item { grid-column: span 4; min-width: 0; }
.portfolio-item:nth-child(1),
.portfolio-item:nth-child(7),
.portfolio-item:nth-child(11) { grid-column: span 7; }
.portfolio-item:nth-child(2),
.portfolio-item:nth-child(8),
.portfolio-item:nth-child(12) { grid-column: span 5; }

.portfolio-card {
  position: relative;
  isolation: isolate;
  min-height: clamp(390px, 38vw, 560px);
  overflow: hidden;
  background: #2e3e44;
  border: 1px solid rgba(253, 244, 227, 0.16);
  border-radius: 0;
  box-shadow: none;
  transform: none;
}

.portfolio-item:nth-child(1) .portfolio-card,
.portfolio-item:nth-child(7) .portfolio-card,
.portfolio-item:nth-child(11) .portfolio-card {
  min-height: clamp(470px, 47vw, 680px);
}

.portfolio-card:hover,
.portfolio-card:focus-visible {
  border-color: rgba(181, 147, 87, 0.72);
  box-shadow: none;
  transform: none;
}

.portfolio-card__media {
  position: absolute;
  z-index: 0;
  inset: 0;
  overflow: hidden;
}

.portfolio-card__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.28) 48%, rgba(0, 0, 0, 0.04) 72%);
  pointer-events: none;
}

.portfolio-card__media img {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
  filter: none;
  transition: transform 0.8s var(--ease), filter 0.8s var(--ease);
}

.portfolio-card:hover .portfolio-card__media img,
.portfolio-card:focus-visible .portfolio-card__media img {
  filter: none;
  transform: scale(1.035);
}

.portfolio-card__body {
  position: relative;
  z-index: 2;
  margin-top: auto;
  gap: 10px;
  width: 100%;
  padding: clamp(24px, 3vw, 42px);
}

.portfolio-card__body h3 {
  color: var(--atelier-beige);
  font-size: clamp(23px, 2.4vw, 36px);
  font-weight: 500;
  letter-spacing: -0.035em;
}

.portfolio-card__body > p {
  color: var(--atelier-gold-light);
  font-size: 11px;
  letter-spacing: 0.16em;
}

.portfolio-card__count,
.portfolio-card__zoom {
  z-index: 3;
  background: rgba(46, 62, 68, 0.76);
  border: 1px solid rgba(253, 244, 227, 0.22);
  backdrop-filter: blur(8px);
}

.portfolio-card__rail,
.portfolio-item.has-rail::before { display: none !important; }

.portfolio-section .portfolio-actions { margin-top: clamp(38px, 5vw, 72px); }

.portfolio-section .primary-btn {
  color: var(--atelier-blue-deep);
  background: var(--atelier-gold);
  border-color: var(--atelier-gold);
  box-shadow: none;
}

/* Process — vertical route, alternating stages, one scroll-led narrative. */
.process-section {
  color: var(--atelier-beige);
  background: var(--atelier-blue);
  border-bottom: 1px solid rgba(253, 244, 227, 0.12);
}

.process-heading {
  max-width: 900px;
  margin-inline: auto;
}

.process-heading h2 { max-width: none; color: var(--atelier-beige); }
.process-heading > p:last-child { max-width: 55ch; color: rgba(253, 244, 227, 0.68); }
.process-heading .eyebrow { color: var(--atelier-gold-light); }

.process-journey {
  --route-gap: clamp(24px, 4vw, 52px);
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 120px minmax(0, 1fr);
  grid-template-rows: repeat(4, auto);
  gap: clamp(80px, 9vw, 132px) var(--route-gap);
  align-items: center;
  padding: clamp(38px, 5vw, 76px) 0;
  background: transparent;
  border: 0;
  border-block: 1px solid rgba(253, 244, 227, 0.2);
  border-radius: 0;
  box-shadow: none;
}

.process-journey__path {
  position: absolute;
  z-index: 0;
  top: clamp(38px, 5vw, 76px);
  bottom: clamp(38px, 5vw, 76px);
  left: 50%;
  width: 120px;
  height: auto;
  overflow: visible;
  pointer-events: none;
  transform: translateX(-50%);
}

.process-journey__path-track,
.process-journey__path-progress { stroke-width: 1.25; }

.process-journey__path-track {
  stroke: rgba(253, 244, 227, 0.2);
  stroke-dasharray: 0.009 0.012;
}

.process-journey__path-progress { stroke: var(--atelier-gold-light); }

.process-card {
  position: relative;
  z-index: 1;
  min-width: 0;
  text-align: left;
}

.process-card:nth-of-type(odd) { grid-column: 1; }
.process-card:nth-of-type(even) { grid-column: 3; }
.process-card:nth-of-type(1) { grid-row: 1; }
.process-card:nth-of-type(2) { grid-row: 2; }
.process-card:nth-of-type(3) { grid-row: 3; }
.process-card:nth-of-type(4) { grid-row: 4; }

.process-card__media {
  position: relative;
  margin-top: 0;
  overflow: visible;
}

.process-card__media img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border: 1px solid rgba(253, 244, 227, 0.16);
  border-radius: 0;
  box-shadow: none;
  filter: none;
}

.process-card.is-passed .process-card__media img {
  filter: none;
  box-shadow: none;
}

.process-card__media span {
  top: 50%;
  width: 54px;
  height: 54px;
  color: var(--atelier-blue-night);
  background: var(--atelier-gold-light);
  border: 6px solid var(--atelier-blue);
  border-radius: 50%;
}

.process-card:nth-of-type(odd) .process-card__media span {
  right: calc((var(--route-gap) + 60px) * -1);
  left: auto;
  translate: 50% -50%;
}

.process-card:nth-of-type(even) .process-card__media span {
  left: calc((var(--route-gap) + 60px) * -1);
  translate: -50% -50%;
}

.process-card h3 {
  margin-top: 24px;
  color: var(--atelier-beige);
  font-size: clamp(28px, 3vw, 46px);
  font-weight: 500;
  letter-spacing: -0.04em;
}

.process-card p {
  max-width: 42ch;
  margin: 14px 0 0;
  color: rgba(253, 244, 227, 0.66);
  font-size: 16px;
  line-height: 1.65;
}

.process-cta { justify-content: center; }

.process-cta .primary-btn {
  color: var(--atelier-blue-deep);
  background: var(--atelier-gold);
  border-color: var(--atelier-gold);
}

/* Estimate — architectural two-column brief with a blue precision form. */
.calculator-section {
  color: var(--atelier-blue-deep);
  background: var(--atelier-beige);
  border: 0;
}

.calculator-section > .section-inner {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(28px, 4vw, 64px);
  align-items: start;
}

.calculator-copy {
  grid-column: 1 / span 4;
  grid-row: 1;
  position: sticky;
  top: 130px;
}

.calculator-copy .eyebrow { color: #2e3e44; }
.calculator-copy h2 {
  max-width: 8ch;
  margin-top: 18px;
  color: var(--atelier-blue-deep);
  font-size: clamp(48px, 5.2vw, 78px);
  font-weight: 500;
  line-height: 0.98;
  letter-spacing: -0.05em;
}

.calculator-copy > p {
  max-width: 40ch;
  color: rgba(46, 62, 68, 0.72);
  font-size: 17px;
  line-height: 1.65;
}

.calculator-form {
  grid-column: 5 / -1;
  grid-row: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  padding: clamp(30px, 4vw, 56px);
  background: var(--atelier-blue);
  border: 1px solid rgba(46, 62, 68, 0.28);
  border-radius: 0;
  box-shadow: none;
}

.calculator-form input[type="text"],
.calculator-form input[type="tel"],
.calculator-form textarea,
.calculator-form select,
.calculator-form .style-option__card,
.calculator-form .attachment-field__control {
  min-height: 54px;
  color: var(--atelier-blue-deep);
  background: var(--atelier-cream);
  border-color: rgba(181, 147, 87, 0.5);
  border-radius: 0;
}

.calculator-form textarea { min-height: 142px; }

.calculator-form input:focus,
.calculator-form textarea:focus,
.calculator-form select:focus {
  border-color: var(--atelier-gold-light);
  box-shadow: 0 0 0 3px rgba(181, 147, 87, 0.22);
}

.calculator-form .style-option__card:hover,
.calculator-form .style-option input:focus-visible + .style-option__card {
  border-color: var(--atelier-gold-light);
}

.calculator-form .style-option input:checked + .style-option__card {
  color: var(--atelier-beige);
  background: var(--atelier-blue-deep);
  border-color: var(--atelier-gold-light);
}

.calculator-form .option-group {
  border-radius: 0;
  border-color: rgba(253, 244, 227, 0.22);
}

.calculator-form > .primary-btn {
  color: var(--atelier-blue-night);
  background: var(--atelier-gold);
  border-color: var(--atelier-gold);
}
.zigzag-brand { color: var(--atelier-beige); }

/* FAQ + showroom — quieter light chapters after the dark narrative. */
.faq-section,
.contact-section { background: var(--atelier-beige); }

.faq-list details {
  background: transparent;
  border: 0;
  border-top: 1px solid var(--atelier-rule-dark);
  border-radius: 0;
  box-shadow: none;
}

.faq-list details:last-child { border-bottom: 1px solid var(--atelier-rule-dark); }

.faq-list summary {
  min-height: 76px;
  padding-inline: 0 48px;
  font-size: clamp(19px, 2vw, 28px);
}

.faq-list details p { padding-inline: 0; }

.contact-photo,
.contact-map,
.contact-map iframe {
  border-radius: 0;
  box-shadow: none;
}

.contact-photo { border: 1px solid rgba(46, 62, 68, 0.16); }
.contact-map { border: 1px solid rgba(46, 62, 68, 0.16); }

/* Footer — structured sitemap, oversized quiet wordmark. */
.site-footer {
  position: relative;
  overflow: hidden;
  padding-block: 0;
  color: var(--atelier-beige);
  background: var(--atelier-blue-night);
  border-top: 1px solid rgba(253, 244, 227, 0.14);
}

.site-footer__inner {
  position: relative;
  z-index: 1;
  max-width: var(--content-max);
  padding-top: clamp(64px, 8vw, 118px);
  padding-bottom: clamp(150px, 18vw, 250px);
  column-gap: clamp(40px, 7vw, 110px);
}

.site-footer__inner::before {
  left: var(--gutter);
  right: var(--gutter);
  background: linear-gradient(90deg, var(--atelier-gold), rgba(181, 147, 87, 0.15) 46%, transparent);
}

.site-footer__inner::after {
  content: "SALMAST";
  position: absolute;
  z-index: -1;
  right: var(--gutter);
  bottom: -0.03em;
  color: transparent;
  font-family: var(--font-display);
  font-size: clamp(84px, 17vw, 250px);
  font-weight: 600;
  line-height: 0.8;
  letter-spacing: 0.055em;
  -webkit-text-stroke: 1px rgba(253, 244, 227, 0.13);
  white-space: nowrap;
}

.site-footer__brand { max-width: 390px; }
.site-footer .brand-logo { width: clamp(180px, 15vw, 240px); }
.site-footer__brand p { max-width: 36ch; font-size: 15px; line-height: 1.65; }

.site-footer__nav {
  padding-left: clamp(20px, 3vw, 42px);
  border-left: 1px solid rgba(253, 244, 227, 0.16);
}

.site-footer__nav a,
.site-footer__contact a,
.site-footer__contact span { color: rgba(253, 244, 227, 0.72); }

.site-footer__nav a { min-height: 32px; letter-spacing: 0.04em; }
.site-footer__legal { border-top-color: rgba(253, 244, 227, 0.15); }

/* Dark theme keeps the same identity, only the light chapters change tone. */

/* Responsive chapters. */
@media (max-width: 1080px) {
  :root { --section-y: clamp(72px, 9vw, 104px); }

  .hero {
    grid-template-columns: 1fr;
    grid-template-areas:
      "copy"
      "facts";
  }

  .hero-stage-mark { display: none; }

  .process-journey {
    grid-template-columns: minmax(0, 1fr) 90px minmax(0, 1fr);
  }

  .process-journey__path { display: block; width: 90px; }

  .process-card:nth-of-type(odd) .process-card__media span {
    right: calc((var(--route-gap) + 45px) * -1);
  }

  .process-card:nth-of-type(even) .process-card__media span {
    left: calc((var(--route-gap) + 45px) * -1);
  }

  .portfolio-item { grid-column: span 6; }
  .portfolio-item:nth-child(1),
  .portfolio-item:nth-child(7),
  .portfolio-item:nth-child(11) { grid-column: span 7; }
  .portfolio-item:nth-child(2),
  .portfolio-item:nth-child(8),
  .portfolio-item:nth-child(12) { grid-column: span 5; }

  .calculator-copy { grid-column: 1 / span 5; }
  .calculator-form { grid-column: 6 / -1; }
}

@media (max-width: 900px) {
  html { scroll-padding-top: 78px; }

  .site-header { min-height: 78px; }

  .site-header .main-nav {
    top: 78px;
    height: calc(100dvh - 78px);
    background: var(--atelier-blue-deep);
  }

  .site-header .main-nav > a {
    color: var(--atelier-beige);
    border-bottom-color: rgba(253, 244, 227, 0.16);
  }

  .hero {
    min-height: calc(100svh - 78px);
    padding-top: clamp(108px, 17vh, 156px);
    padding-bottom: 28px;
    row-gap: 54px;
  }

  .hero::before {
    background:
      linear-gradient(0deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.52) 58%, rgba(0, 0, 0, 0.2) 100%),
      linear-gradient(90deg, rgba(0, 0, 0, 0.54), rgba(0, 0, 0, 0.08));
  }

  .hero-main { object-position: 58% center; }

  .hero-copy h1,
  :root[lang="hy"] .hero-copy h1 { max-width: 12ch; }

  .calculator-section > .section-inner { grid-template-columns: 1fr; }

  .calculator-copy,
  .calculator-form {
    grid-column: 1;
    grid-row: auto;
  }

  .calculator-copy {
    position: static;
    max-width: 680px;
  }

  .calculator-copy h2 { max-width: 10ch; }

  .process-journey {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    gap: 64px;
    padding-block: 38px;
  }

  .process-journey__path { display: none; }

  .process-card,
  .process-card:nth-of-type(odd),
  .process-card:nth-of-type(even),
  .process-card:nth-of-type(1),
  .process-card:nth-of-type(2),
  .process-card:nth-of-type(3),
  .process-card:nth-of-type(4) {
    grid-column: 1;
    grid-row: auto;
  }

  .process-card__media span,
  .process-card:nth-of-type(odd) .process-card__media span,
  .process-card:nth-of-type(even) .process-card__media span {
    top: 18px;
    right: auto;
    left: 18px;
    translate: 0 0;
    border-width: 4px;
  }
}

@media (max-width: 720px) {
  :root {
    --section-y: 68px;
    --gutter: 20px;
  }

  main > section:not(.hero) { padding-block: var(--section-y); }

  .section-heading { margin-bottom: 38px; }

  .section-heading h2 {
    max-width: 12ch;
    font-size: clamp(38px, 12vw, 58px);
    line-height: 1;
  }

  :root[lang="hy"] .section-heading h2 {
    max-width: 100%;
    font-size: clamp(36px, 10.5vw, 42px);
    line-height: 1.18;
    overflow-wrap: normal;
    word-break: normal;
  }

  .section-heading > p:last-child {
    margin-top: 18px;
    font-size: 16px;
  }

  .hero {
    min-height: 820px;
    padding: 102px var(--gutter) 20px;
    align-content: end;
    row-gap: 42px;
  }

  .hero::after {
    right: -36px;
    bottom: 218px;
    font-size: clamp(82px, 30vw, 128px);
  }

  .hero-copy h1,
  :root[lang="hy"] .hero-copy h1 {
    max-width: 12ch;
    margin-top: 18px;
    font-size: clamp(43px, 13vw, 62px);
    line-height: 0.98;
  }

  .hero-lead {
    margin-top: 20px;
    font-size: 16px;
    line-height: 1.52;
  }

  .hero-actions { margin-top: 24px; }

  .hero-actions .primary-btn,
  .hero-actions .secondary-btn {
    min-height: 52px;
    padding-inline: 44px;
  }

  .hero-trust { font-size: 13px; }

  .hero-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hero-facts > div {
    min-height: 104px;
    padding: 18px;
  }

  .hero-facts > div + div { border-left: 1px solid rgba(253, 244, 227, 0.18); }
  .hero-facts > div:nth-child(3) {
    grid-column: 1 / -1;
    min-height: 92px;
    border-top: 1px solid rgba(253, 244, 227, 0.18);
    border-left: 0;
  }

  .hero-facts dt { font-size: 32px; }
  .hero-facts .hero-fact__title { max-width: 17ch; font-size: 24px; }
  .hero-facts dd { font-size: 10px; }

  .reviews-stats,
  .testimonials-grid { grid-template-columns: 1fr; }

  .review-stat {
    min-height: 130px;
    padding: 26px 0;
  }

  .review-stat + .review-stat {
    border-top: 1px solid rgba(253, 244, 227, 0.2);
    border-left: 0;
  }

  .testimonial-card {
    min-height: 0;
    padding: 34px 0;
  }

  .testimonial-card + .testimonial-card {
    border-top: 1px solid rgba(253, 244, 227, 0.2);
    border-left: 0;
  }

  .reviews-platforms { gap: 8px; }
  .reviews-platforms__label { width: 100%; }

  .portfolio-section::before { display: none; }

  .portfolio-grid { grid-template-columns: 1fr; gap: 14px; }

  .portfolio-item,
  .portfolio-item:nth-child(1),
  .portfolio-item:nth-child(2),
  .portfolio-item:nth-child(7),
  .portfolio-item:nth-child(8),
  .portfolio-item:nth-child(11),
  .portfolio-item:nth-child(12) { grid-column: 1; }

  .portfolio-card,
  .portfolio-item:nth-child(1) .portfolio-card,
  .portfolio-item:nth-child(7) .portfolio-card,
  .portfolio-item:nth-child(11) .portfolio-card { min-height: 420px; }

  .portfolio-card__body { padding: 24px; }

  .process-heading { text-align: left; }
  .process-heading .eyebrow { justify-content: flex-start; }
  .process-heading .eyebrow::before { display: block; }
  .process-heading > p:last-child { margin-inline: 0; }

  .process-journey {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    gap: 58px;
    padding-block: 34px;
  }

  .process-journey__path { display: none; }

  .process-card,
  .process-card:nth-of-type(odd),
  .process-card:nth-of-type(even),
  .process-card:nth-of-type(1),
  .process-card:nth-of-type(2),
  .process-card:nth-of-type(3),
  .process-card:nth-of-type(4) {
    grid-column: 1;
    grid-row: auto;
  }

  .process-card__media span,
  .process-card:nth-of-type(odd) .process-card__media span,
  .process-card:nth-of-type(even) .process-card__media span {
    top: 18px;
    right: auto;
    left: 18px;
    width: 50px;
    height: 50px;
    translate: 0 0;
    border-width: 4px;
  }

  .process-card h3 { font-size: 32px; }

  .calculator-copy h2 { font-size: clamp(42px, 12vw, 58px); }

  :root[lang="hy"] .calculator-copy h2 {
    max-width: none;
    font-size: clamp(40px, 11.5vw, 46px);
    line-height: 1.22;
    overflow-wrap: normal;
    word-break: normal;
  }

  .calculator-form {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 24px 18px;
  }

  .site-footer__inner {
    padding-top: 56px;
    padding-bottom: 124px;
  }

  .site-footer__nav {
    padding-top: 22px;
    padding-left: 0;
    border-top: 1px solid rgba(253, 244, 227, 0.16);
    border-left: 0;
  }

  .site-footer__inner::after {
    right: 10px;
    font-size: clamp(62px, 23vw, 104px);
  }
}

@media (max-width: 420px) {
  :root { --gutter: 18px; }

  .hero { min-height: 780px; padding-top: 84px; }
  .hero-copy h1,
  :root[lang="hy"] .hero-copy h1 { font-size: clamp(40px, 12.5vw, 52px); }
  .hero-lead { font-size: 15px; }
  .hero-facts > div { padding: 16px; }
  .hero-facts > div::after { top: 14px; right: 14px; }
  .hero-facts .hero-fact__title { font-size: 22px; }
  .portfolio-card { min-height: 380px; }
}

@media (prefers-reduced-motion: reduce) {
  .portfolio-card__media img,
  .site-header,
  .hero-media,
  .process-card__media img { transition: none !important; }

  .portfolio-card:hover .portfolio-card__media img,
  .portfolio-card:focus-visible .portfolio-card__media img { transform: none; }
}
