/* ============================================
   Et Voilà Maroc — Theme Stylesheet
   French Engineering × Moroccan Craftsmanship
   Version: 2.0.0 (Design System)
   ============================================
   Architecture before marketing.
   Photography before graphics.
   Whitespace before decoration.
   Typography before effects.
   Luxury equals restraint.
   ============================================
   TABLE OF CONTENTS
   ============================================
   1.  DESIGN TOKENS ............. line 16
   2.  GRID SYSTEM ............... line 88
   3.  BASE / RESET .............. line 144
   4.  ACCESSIBILITY ............ line 209
   5.  NAVIGATION ............... line 270
   6.  BUTTONS .................. line 302
   7.  IMAGES ................... line 371
   8.  SEPARATORS ............... line 405
   9.  COLUMNS .................. line 421
   10. HEADINGS ................. line 462
   11. PARAGRAPHS ............... line 493
   12. BREADCRUMBS .............. line 518
   13. PAGINATION ............... line 550
   14. FOOTER ................... line 2629
   15. COVER / HERO ............. line 602
   16. POST GRID / CARDS ....... line 673
   17. PROJECT META ............ line 764
   18. PAGE HEADER .............. line 798
   19. ANIMATIONS ............... line 822
   20. RESPONSIVE ............... line 864
   21. EDITORIAL DESIGN SYSTEM .. line 894
     21a. Asymmetrical Grid ..... line 899
     21b. Split Section ......... line 995
     21c. Dark Section .......... line 1121
     21d. Section Header ........ line 1217
     21e. Feature Showcase ...... line 1267
     21f. Material Gallery ....... line 1349
     21g. Testimonial ........... line 1409
     21h. Timeline .............. line 1466
     21i. Material Card ......... line 1541
     21j. Editorial Gallery ..... line 1605
     21k. Project Showcase ...... line 1659
     21l. Journal Grid .......... line 1774
     21m. Featured Projects ..... line 1856
   22. HEADER ................... line 2208
     22a. Sticky Glass Header ... line 2208
     22b. Submenu/Dropdown ...... line 2468
     22c. Mega Menu ............. line 3052
     22d. Language Switcher ..... line 3184
   23. SERVICE PAGES ........... line 3258
     23a. Service Hero ......... line 3259
     23b. Service Process ...... line 3304
     23c. FAQ Accordion ........ line 3344
     23d. Materials Showcase ... line 3411
     23e. Services Grid ........ line 3484
   24. BRAND COMPONENTS ........ line 3582
     24a. Pillar Cards ......... line 3599
     24b. Market Bridge ........ line 3752
     24c. Compliance Badges ..... line 3648
     24d. Geometric Frame ...... line 3726
   25. HOMEPAGE AUDIT .......... line 3850
     25a. Hero Cinematic ....... line 4030
     25b. Stats Bar ............ line 4094
     25c. Expertise Grid ....... line 4145
     25d. Process Grid ......... line 4188
     25e. Materials Card ....... line 4227
     25f. Certification Grid ... line 4283
     25g. Final CTA ............ line 4320
     25h. Testimonial .......... line 4364
   26. CONTACT FORM ............ line 4389
   27. PRINT STYLES ............ line 3022
   ============================================ */

/* --------------------------------------------
   CSS Custom Properties — Design System
   All tokens. No hardcoded values.
   -------------------------------------------- */
:root {
  /* === SPACING === */
  /* Named scale */
  --etv-space-xs: 0.25rem;
  --etv-space-sm: 0.5rem;
  --etv-space-md: 1rem;
  --etv-space-lg: 1.5rem;
  --etv-space-xl: 2rem;
  --etv-space-2xl: 3rem;
  --etv-space-3xl: 4rem;
  --etv-space-4xl: 6rem;
  --etv-space-5xl: 8rem;
  --etv-space-6xl: 12rem;

  /* Numeric scale (mirrors theme.json spacing presets) */
  --etv-space-10: 0.125rem;  /* 2px */
  --etv-space-20: 0.25rem;   /* 4px */
  --etv-space-30: 0.5rem;    /* 8px */
  --etv-space-40: 1rem;      /* 16px */
  --etv-space-50: 1.5rem;    /* 24px */
  --etv-space-60: 2rem;      /* 32px */
  --etv-space-70: 3rem;      /* 48px */
  --etv-space-80: 4rem;      /* 64px */
  --etv-space-90: 6rem;      /* 96px */
  --etv-space-100: 8rem;     /* 128px */
  --etv-section-gap: clamp(4rem, 8vw, 8rem);
  --etv-gutter: clamp(1.5rem, 4vw, 4rem);
  --etv-header-pad-y: 1.5rem;

  /* === LAYOUT === */
  --etv-content-narrow: 560px;
  --etv-content-default: 720px;
  --etv-content-wide: 1280px;

  /* === TYPOGRAPHY FAMILIES === */
  --etv-font-heading: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --etv-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --etv-font-ui: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --etv-font-display: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  --etv-font-cinzel: 'Cinzel Decorative', Georgia, serif;

  /* === COLORS (Utility — for rgba/alpha cases) === */
  --etv-color-white: #ffffff;
  --etv-color-black: #000000;
  --etv-color-charcoal: #1a1a1a;
  --etv-midnight-rgb: 12, 20, 40;   /* For rgba(var(--etv-midnight-rgb), 0.4) usage */

  /* === BORDER RADIUS === */
  --etv-radius-sm: 2px;
  --etv-radius-md: 4px;
  --etv-radius-lg: 8px;
  --etv-radius-xl: 12px;

  /* === BOX SHADOWS === */
  --etv-shadow-sm: 0 1px 3px rgba(12, 20, 40, 0.06);
  --etv-shadow-md: 0 4px 12px rgba(12, 20, 40, 0.08);
  --etv-shadow-lg: 0 8px 30px rgba(12, 20, 40, 0.12);
  --etv-shadow-xl: 0 12px 40px rgba(12, 20, 40, 0.08);

  /* === OVERLAYS (Opacity helpers) === */
  --etv-overlay-light: rgba(0, 0, 0, 0.04);
  --etv-overlay-mid: rgba(0, 0, 0, 0.06);
  --etv-overlay-glass: rgba(0, 0, 0, 0.08);
  --etv-overlay-white: rgba(255, 255, 255, 0.1);
  --etv-overlay-white-md: rgba(255, 255, 255, 0.15);
  --etv-overlay-dark: rgba(12, 20, 40, 0.4);
  --etv-overlay-dark-strong: rgba(12, 20, 40, 0.7);

  /* === TRANSITIONS === */
  --etv-transition-fast: 200ms ease;
  --etv-transition-base: 400ms ease;
  --etv-transition-slow: 600ms ease;
  --etv-transition-glass: 0.65s ease;

  /* === Z-INDEX === */
  --etv-z-header: 100;
  --etv-z-overlay: 200;
  --etv-z-modal: 300;
}

/* --------------------------------------------
   12-Column Responsive Grid
   Use: .etv-grid on container, .etv-grid__col-{n} on children
   Responsive: etv-grid__col-md-{n}, etv-grid__col-sm-{n}
   -------------------------------------------- */
.etv-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--etv-space-xl);
}

.etv-grid__col-1  { grid-column: span 1; }
.etv-grid__col-2  { grid-column: span 2; }
.etv-grid__col-3  { grid-column: span 3; }
.etv-grid__col-4  { grid-column: span 4; }
.etv-grid__col-5  { grid-column: span 5; }
.etv-grid__col-6  { grid-column: span 6; }
.etv-grid__col-7  { grid-column: span 7; }
.etv-grid__col-8  { grid-column: span 8; }
.etv-grid__col-9  { grid-column: span 9; }
.etv-grid__col-10 { grid-column: span 10; }
.etv-grid__col-11 { grid-column: span 11; }
.etv-grid__col-12 { grid-column: span 12; }

@media (max-width: 1023px) {
  .etv-grid__col-md-1  { grid-column: span 1; }
  .etv-grid__col-md-2  { grid-column: span 2; }
  .etv-grid__col-md-3  { grid-column: span 3; }
  .etv-grid__col-md-4  { grid-column: span 4; }
  .etv-grid__col-md-5  { grid-column: span 5; }
  .etv-grid__col-md-6  { grid-column: span 6; }
  .etv-grid__col-md-7  { grid-column: span 7; }
  .etv-grid__col-md-8  { grid-column: span 8; }
  .etv-grid__col-md-9  { grid-column: span 9; }
  .etv-grid__col-md-10 { grid-column: span 10; }
  .etv-grid__col-md-11 { grid-column: span 11; }
  .etv-grid__col-md-12 { grid-column: span 12; }
}

@media (max-width: 600px) {
  .etv-grid {
    gap: var(--etv-space-lg);
  }

  .etv-grid__col-sm-1  { grid-column: span 1; }
  .etv-grid__col-sm-2  { grid-column: span 2; }
  .etv-grid__col-sm-3  { grid-column: span 3; }
  .etv-grid__col-sm-4  { grid-column: span 4; }
  .etv-grid__col-sm-5  { grid-column: span 5; }
  .etv-grid__col-sm-6  { grid-column: span 6; }
  .etv-grid__col-sm-7  { grid-column: span 7; }
  .etv-grid__col-sm-8  { grid-column: span 8; }
  .etv-grid__col-sm-9  { grid-column: span 9; }
  .etv-grid__col-sm-10 { grid-column: span 10; }
  .etv-grid__col-sm-11 { grid-column: span 11; }
  .etv-grid__col-sm-12 { grid-column: span 12; }
}

/* --------------------------------------------
   Base / Reset
   -------------------------------------------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  padding: 0;
  font-family: var(--etv-font-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* --------------------------------------------
   Page Entrance Animation
   -------------------------------------------- */
@keyframes etv-fade-up {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

body > .wp-site-blocks > main {
  animation: etv-fade-up 0.8s ease-out forwards;
}

/* --------------------------------------------
   Link Hover — refined underline
   -------------------------------------------- */
a {
  transition: color var(--etv-transition-fast), opacity var(--etv-transition-fast);
}

a:not(.wp-block-button__link):not(.wp-block-navigation-item__content):hover {
  opacity: 0.7;
}

/* --------------------------------------------
   Image Hover — subtle scale
   -------------------------------------------- */
.etv-post-card:hover .etv-post-card__image img {
  transform: scale(1.04);
}

/* --------------------------------------------
   Focus Styles — Accessibility
   -------------------------------------------- */
:focus-visible {
  outline: 1px solid var(--wp--preset--color--champagne-gold);
  outline-offset: 2px;
}

:focus:not(:focus-visible) {
  outline: none;
}

/* --------------------------------------------
   Skip Link
   -------------------------------------------- */
.skip-link {
  position: absolute;
  top: -100%;
  left: 0;
  z-index: var(--etv-z-modal);
  padding: var(--etv-space-md) var(--etv-space-xl);
  background: var(--wp--preset--color--midnight-cobalt);
  color: var(--wp--preset--color--warm-white);
  text-decoration: none;
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition: top var(--etv-transition-fast);
}

.skip-link:focus {
  top: 0;
  outline: none;
}

/* --------------------------------------------
   Screen Reader Text
   -------------------------------------------- */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}

/* --------------------------------------------
   Selection
   -------------------------------------------- */
::selection {
  background: var(--wp--preset--color--champagne-gold);
  color: var(--wp--preset--color--midnight-cobalt);
}

/* --------------------------------------------
   Navigation
   -------------------------------------------- */
.wp-block-navigation__container {
  gap: clamp(1.5rem, 2vw, 2rem);
}

.wp-block-navigation-item__content {
  position: relative;
}

.wp-block-navigation-item__content::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--wp--preset--color--champagne-gold);
  transition: width var(--etv-transition-base);
}

.wp-block-navigation-item__content:hover::after,
.wp-block-navigation-item__content:focus::after {
  width: 100%;
}

/* Mobile nav toggle */
.wp-block-navigation__responsive-close {
  background: var(--wp--preset--color--warm-white);
}

/* --------------------------------------------
   Buttons — Style Variants
   -------------------------------------------- */
.wp-block-button.is-style-outline-light .wp-block-button__link {
  border-color: var(--wp--preset--color--warm-white);
  color: var(--wp--preset--color--warm-white);
}

.wp-block-button.is-style-outline-light .wp-block-button__link:hover {
  background: var(--wp--preset--color--warm-white);
  color: var(--wp--preset--color--midnight-cobalt);
}

.wp-block-button.is-style-outline-gold .wp-block-button__link {
  border-color: var(--wp--preset--color--champagne-gold);
  color: var(--wp--preset--color--champagne-gold);
}

.wp-block-button.is-style-outline-gold .wp-block-button__link:hover {
  background: var(--wp--preset--color--champagne-gold);
  color: var(--wp--preset--color--midnight-cobalt);
}

.wp-block-button.is-style-ghost .wp-block-button__link,
.wp-block-button.is-style-ghost-light .wp-block-button__link {
  border-color: transparent;
  background: transparent;
  padding-left: 0;
  padding-right: 0;
}

.wp-block-button.is-style-ghost .wp-block-button__link {
  color: var(--wp--preset--color--midnight-cobalt);
}

.wp-block-button.is-style-ghost .wp-block-button__link:hover {
  background: transparent;
  color: var(--wp--preset--color--champagne-gold);
}

.wp-block-button.is-style-ghost-light .wp-block-button__link {
  color: var(--wp--preset--color--warm-white);
}

.wp-block-button.is-style-ghost-light .wp-block-button__link:hover {
  background: transparent;
  color: var(--wp--preset--color--champagne-gold);
}

/* Premium CTA — solid gold fill, used in header */
.wp-block-button.is-style-premium-cta .wp-block-button__link {
  background: var(--wp--preset--color--champagne-gold);
  color: var(--wp--preset--color--midnight-cobalt);
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.5rem 1.25rem;
  border: 1px solid var(--wp--preset--color--champagne-gold);
  border-radius: 0;
  transition: all var(--etv-transition-base);
}

.wp-block-button.is-style-premium-cta .wp-block-button__link:hover {
  background: transparent;
  color: var(--wp--preset--color--champagne-gold);
}

/* --------------------------------------------
   Images — Block Styles
   -------------------------------------------- */
.wp-block-image.is-style-architectural {
  border: 1px solid var(--etv-overlay-glass);
  padding: var(--etv-space-sm);
  background: var(--wp--preset--color--pure-white);
}

.wp-block-image.is-style-editorial {
  margin-left: calc(-1 * var(--etv-gutter));
  margin-right: calc(-1 * var(--etv-gutter));
  max-width: none;
}

@media (min-width: 1024px) {
  .wp-block-image.is-style-editorial {
    margin-left: calc(-1 * var(--etv-space-3xl));
    margin-right: calc(-1 * var(--etv-space-3xl));
  }
}

.wp-block-image.is-style-gallery-grid {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--etv-radius-sm);
  overflow: hidden;
  transition: opacity var(--etv-transition-fast);
}

.wp-block-image.is-style-gallery-grid:hover {
  opacity: 0.85;
}

/* --------------------------------------------
   Separator Styles
   -------------------------------------------- */
.wp-block-separator.is-style-line-thin {
  height: 1px;
}

.wp-block-separator.is-style-line-thick {
  height: 2px;
}

.wp-block-separator.is-style-line-gold {
  height: 1px;
  background: var(--wp--preset--color--champagne-gold);
}

/* --------------------------------------------
   Columns — Block Styles
   -------------------------------------------- */
.wp-block-columns.is-style-overlap {
  position: relative;
}

.wp-block-columns.is-style-overlap .wp-block-column:last-child {
  margin-top: calc(-1 * var(--etv-space-3xl));
  margin-left: calc(-1 * var(--etv-space-xl));
  z-index: 1;
}

@media (max-width: 781px) {
  .wp-block-columns.is-style-overlap {
    flex-direction: column;
  }

  .wp-block-columns.is-style-overlap .wp-block-column:last-child {
    margin-top: calc(-1 * var(--etv-space-xl));
    margin-left: 0;
  }
}

.wp-block-columns.is-style-stagger .wp-block-column {
  opacity: 0;
  transform: translateY(1.5rem);
  transition: opacity var(--etv-transition-slow), transform var(--etv-transition-slow);
}

.wp-block-columns.is-style-stagger .wp-block-column:nth-child(1) { transition-delay: 0s; }
.wp-block-columns.is-style-stagger .wp-block-column:nth-child(2) { transition-delay: 0.15s; }
.wp-block-columns.is-style-stagger .wp-block-column:nth-child(3) { transition-delay: 0.3s; }
.wp-block-columns.is-style-stagger .wp-block-column:nth-child(4) { transition-delay: 0.45s; }

.wp-block-columns.is-style-stagger.is-visible .wp-block-column,
.wp-block-columns.is-style-stagger.etv-animated .wp-block-column {
  opacity: 1;
  transform: translateY(0);
}

/* --------------------------------------------
   Heading Styles
   -------------------------------------------- */
.wp-block-heading.is-style-display-large {
  font-size: var(--wp--preset--font-size--display);
  line-height: 1;
  letter-spacing: -0.03em;
}

.wp-block-heading.is-style-label {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wp--preset--color--brushed-steel);
}

.wp-block-heading.is-style-section-title {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--h3);
  line-height: 1.15;
  letter-spacing: -0.01em;
}

@media (min-width: 768px) {
  .wp-block-heading.is-style-section-title {
    max-width: 80%;
  }
}

/* --------------------------------------------
   Paragraph Styles
   -------------------------------------------- */
.wp-block-paragraph.is-style-lead {
  font-size: var(--wp--preset--font-size--lead);
  line-height: 1.8;
  color: var(--wp--preset--color--concrete-grey-dark);
}

.wp-block-paragraph.is-style-small-text {
  font-size: var(--wp--preset--font-size--small);
  line-height: 1.6;
  color: var(--wp--preset--color--concrete-grey-dark);
}

.wp-block-paragraph.is-style-editorial {
  font-family: var(--etv-font-display);
  font-size: var(--wp--preset--font-size--lead);
  line-height: 1.8;
  color: var(--wp--preset--color--charcoal);
  max-width: var(--etv-content-narrow);
  margin-left: auto;
  margin-right: auto;
}

/* --------------------------------------------
   Breadcrumbs
   -------------------------------------------- */
.etv-breadcrumbs {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  color: var(--wp--preset--color--concrete-grey-dark);
  letter-spacing: 0.03em;
  padding: var(--etv-space-md) 0;
}

.etv-breadcrumbs a {
  color: var(--wp--preset--color--brushed-steel);
  text-decoration: none;
  transition: color var(--etv-transition-fast);
}

.etv-breadcrumbs a:hover,
.etv-breadcrumbs a:focus {
  color: var(--wp--preset--color--champagne-gold);
}

.etv-breadcrumbs .current {
  color: var(--wp--preset--color--midnight-cobalt);
}

.etv-breadcrumbs span + span::before {
  content: ' / ';
  margin: 0 var(--etv-space-sm);
  color: var(--wp--preset--color--concrete-grey);
}

/* --------------------------------------------
   Pagination
   -------------------------------------------- */
.etv-pagination {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--small);
  padding: var(--etv-space-2xl) 0;
}

.etv-pagination ul {
  display: flex;
  flex-wrap: wrap;
  gap: var(--etv-space-sm);
  list-style: none;
  margin: 0;
  padding: 0;
}

.etv-pagination li {
  margin: 0;
}

.etv-pagination a,
.etv-pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  height: 2.5rem;
  padding: 0 var(--etv-space-sm);
  border: 1px solid var(--wp--preset--color--concrete-grey);
  color: var(--wp--preset--color--charcoal);
  text-decoration: none;
  transition: all var(--etv-transition-fast);
}

.etv-pagination a:hover,
.etv-pagination a:focus {
  border-color: var(--wp--preset--color--midnight-cobalt);
  color: var(--wp--preset--color--midnight-cobalt);
}

.etv-pagination .current {
  border-color: var(--wp--preset--color--midnight-cobalt);
  background: var(--wp--preset--color--midnight-cobalt);
  color: var(--wp--preset--color--warm-white);
}

/* --------------------------------------------
   Footer
   -------------------------------------------- */

/* --------------------------------------------
   Cover Block / Hero
   -------------------------------------------- */
.wp-block-cover {
  min-height: 60vh;
}

.wp-block-cover.alignfull {
  min-height: 80vh;
}

.etv-hero-full {
  min-height: 100vh !important;
}

.etv-hero-content {
  max-width: 48rem;
  margin: 0 auto;
}

.etv-hero-content .wp-block-heading {
  color: var(--wp--preset--color--warm-white);
}

.etv-hero-content p:first-child {
  margin-bottom: 0;
}

/* Hero video cover — full-viewport cinematic backdrop */
.etv-hero-video {
  min-height: 90vh !important;
}

/* Hero background image positioning */
.etv-hero-video .wp-block-cover__image-background {
  object-position: 50% 30% !important;
}

/* The inner block container needs safe horizontal padding */
.etv-hero-video .wp-block-cover__inner-container {
  padding-left: var(--etv-gutter);
  padding-right: var(--etv-gutter);
}

/* Cinematic gradient overlay on hero cover */
.wp-block-cover.etv-hero-full .wp-block-cover__background {
  background: linear-gradient(
    135deg,
    rgba(12, 20, 40, 0.75) 0%,
    rgba(12, 20, 40, 0.3) 40%,
    rgba(12, 20, 40, 0.5) 70%,
    rgba(12, 20, 40, 0.85) 100%
  ) !important;
  opacity: 1 !important;
}

/* Subtle vignette overlay via pseudo-element */
.wp-block-cover.etv-hero-full .wp-block-cover__inner-container {
  position: relative;
  z-index: 2;
}

.wp-block-cover.etv-hero-full::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 50%, rgba(0, 0, 0, 0.4) 100%);
}

/* --------------------------------------------
   Query Loop / Post Grid
   -------------------------------------------- */
.etv-post-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--etv-space-2xl);
}

@media (min-width: 768px) {
  .etv-post-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .etv-post-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Post card — editorial, premium */
.etv-post-card {
  text-decoration: none;
  color: inherit;
  display: block;
  transition: opacity var(--etv-transition-base), transform var(--etv-transition-base);
}

.etv-post-card:hover {
  opacity: 0.9;
  transform: translateY(-2px);
}

.etv-post-card:active {
  transform: translateY(0);
}

.etv-post-card__image {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  margin-bottom: var(--etv-space-lg);
  background: var(--wp--preset--color--concrete-grey);
}

.etv-post-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--etv-transition-slow), opacity var(--etv-transition-base);
}

.etv-post-card:hover .etv-post-card__image img {
  transform: scale(1.04);
}

/* Query loop block image hover — shared with FSE query grids */
.wp-block-post-featured-image {
  overflow: hidden;
}

.wp-block-post-featured-image img {
  transition: transform var(--etv-transition-slow);
}

.wp-block-post-featured-image a:hover img {
  transform: scale(1.04);
}

.etv-post-card__category {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wp--preset--color--champagne-gold);
  margin-bottom: var(--etv-space-sm);
}

.etv-post-card__title {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--h4);
  line-height: 1.2;
  margin-bottom: var(--etv-space-sm);
}

.etv-post-card__excerpt {
  font-size: var(--wp--preset--font-size--body);
  color: var(--wp--preset--color--concrete-grey-dark);
  line-height: 1.6;
}

/* --------------------------------------------
   Project Detail Meta
   -------------------------------------------- */
.etv-project-meta {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--etv-space-xl);
  padding: var(--etv-space-2xl) 0;
  border-top: 1px solid rgba(12, 20, 40, 0.08);
  border-bottom: 1px solid rgba(12, 20, 40, 0.08);
}

@media (min-width: 768px) {
  .etv-project-meta {
    grid-template-columns: repeat(3, 1fr);
  }
}

.etv-project-meta__label {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wp--preset--color--brushed-steel);
  margin-bottom: var(--etv-space-xs);
}

.etv-project-meta__value {
  font-family: var(--etv-font-body);
  font-size: var(--wp--preset--font-size--body);
  color: var(--wp--preset--color--charcoal);
  font-weight: 400;
}

/* --------------------------------------------
   Page Header / Hero
   -------------------------------------------- */
.etv-page-header {
  padding: var(--etv-space-4xl) 0 var(--etv-space-2xl);
}

.etv-page-header__subtitle {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--small);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wp--preset--color--brushed-steel);
  margin-bottom: var(--etv-space-md);
}

.etv-page-header__title {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--hero);
  line-height: 1.05;
  letter-spacing: -0.02em;
  max-width: 80%;
}

/* --------------------------------------------
   Animations — Utility Classes
   -------------------------------------------- */
.etv-fade-in {
  opacity: 0;
  transform: translateY(1rem);
  transition: opacity var(--etv-transition-slow), transform var(--etv-transition-slow);
}

.etv-fade-in.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.etv-reveal {
  clip-path: inset(0 0 100% 0);
  transition: clip-path var(--etv-transition-slow);
}

.etv-reveal.is-visible {
  clip-path: inset(0);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .etv-fade-in,
  .etv-reveal {
    opacity: 1;
    clip-path: none;
    transform: none;
  }
}

/* --------------------------------------------
   Responsive Helpers
   -------------------------------------------- */
@media (max-width: 600px) {
  :root {
    --etv-gutter: 1rem;
    --etv-section-gap: clamp(3rem, 6vw, 4rem);
  }
}

@media (min-width: 601px) and (max-width: 1023px) {
  :root {
    --etv-gutter: clamp(1.5rem, 3vw, 3rem);
  }
}

/* --------------------------------------------
   WordPress Admin Bar Adjustment
   -------------------------------------------- */
.admin-bar .etv-header {
  top: 32px;
}

@media (max-width: 782px) {
  .admin-bar .etv-header {
    top: 46px;
  }
}

/* ============================================
   EDITORIAL DESIGN SYSTEM
   Photography-first, asymmetrical layouts,
   alternating rhythm, luxury whitespace
   ============================================ */

/* --------------------------------------------
   Asymmetrical Grid — editorial showcase
   -------------------------------------------- */
.etv-asymmetrical-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--etv-space-lg);
  grid-auto-rows: 240px;
}

.etv-asymmetrical-grid__item {
  overflow: hidden;
  position: relative;
  background: var(--wp--preset--color--concrete-grey);
}

.etv-asymmetrical-grid__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--etv-transition-slow);
}

.etv-asymmetrical-grid__item:hover img {
  transform: scale(1.05);
}

/* Default layout: tall + square + landscape + square + portrait */
.etv-asymmetrical-grid__item:nth-child(1) {
  grid-column: 1 / 3;
  grid-row: 1 / 4;
}

.etv-asymmetrical-grid__item:nth-child(2) {
  grid-column: 3 / 5;
  grid-row: 1 / 2;
}

.etv-asymmetrical-grid__item:nth-child(3) {
  grid-column: 3 / 5;
  grid-row: 2 / 4;
}

.etv-asymmetrical-grid__item:nth-child(4) {
  grid-column: 1 / 3;
  grid-row: 4 / 6;
}

.etv-asymmetrical-grid__item:nth-child(5) {
  grid-column: 3 / 4;
  grid-row: 4 / 5;
}

.etv-asymmetrical-grid__item:nth-child(6) {
  grid-column: 4 / 5;
  grid-row: 4 / 6;
}

@media (max-width: 1023px) {
  .etv-asymmetrical-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: 200px;
  }

  .etv-asymmetrical-grid__item:nth-child(n) {
    grid-column: 1 !important;
    grid-row: auto !important;
  }
}

/* Alt layout: 2-column wide + 4 small squares */
.etv-asymmetrical-grid.is-style-wide-first .etv-asymmetrical-grid__item:nth-child(1) {
  grid-column: 1 / 5;
  grid-row: 1 / 3;
}

.etv-asymmetrical-grid.is-style-wide-first .etv-asymmetrical-grid__item:nth-child(2) {
  grid-column: 1 / 3;
  grid-row: 3 / 5;
}

.etv-asymmetrical-grid.is-style-wide-first .etv-asymmetrical-grid__item:nth-child(3) {
  grid-column: 3 / 5;
  grid-row: 3 / 4;
}

.etv-asymmetrical-grid.is-style-wide-first .etv-asymmetrical-grid__item:nth-child(4) {
  grid-column: 3 / 4;
  grid-row: 4 / 5;
}

.etv-asymmetrical-grid.is-style-wide-first .etv-asymmetrical-grid__item:nth-child(5) {
  grid-column: 4 / 5;
  grid-row: 4 / 5;
}

/* --------------------------------------------
   Split Section — alternating image/text
   -------------------------------------------- */
.etv-split-section {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--etv-space-4xl);
  align-items: center;
}

.etv-split-section.reverse {
  direction: rtl;
}

.etv-split-section.reverse > * {
  direction: ltr;
}

.etv-split-section__image {
  overflow: hidden;
  position: relative;
  background: var(--wp--preset--color--concrete-grey);
}

.etv-split-section__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--etv-transition-slow);
}

.etv-split-section__image:hover img {
  transform: scale(1.04);
}

.etv-split-section__content {
  padding: var(--etv-space-xl);
}

.etv-split-section__content .etv-split-section__eyebrow {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wp--preset--color--champagne-gold);
  margin-bottom: var(--etv-space-md);
  display: block;
}

.etv-split-section__content h2,
.etv-split-section__content h3 {
  font-family: var(--etv-font-heading);
  font-size: clamp(1.5rem, 3vw, 2.5rem);
  line-height: 1.2;
  margin-bottom: var(--etv-space-lg);
}

.etv-split-section__content p {
  color: var(--wp--preset--color--concrete-grey-dark);
  line-height: 1.8;
  margin-bottom: var(--etv-space-xl);
  font-size: 1rem;
}

@media (max-width: 1023px) {
  .etv-split-section {
    grid-template-columns: 1fr;
    gap: var(--etv-space-xl);
  }

  .etv-split-section.reverse {
    direction: ltr;
  }

  .etv-split-section__image img {
    max-height: 300px;
    object-fit: cover;
  }
}

/* Split section — craftsmanship variant (image-feature) */
.etv-split-section--craft .etv-split-section__image--feature {
  aspect-ratio: 3 / 4;
  position: relative;
}

.etv-split-section--craft .etv-split-section__image--feature img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.etv-split-section--craft .etv-split-section__content h2 {
  font-size: clamp(1.75rem, 3.5vw, 3rem);
  line-height: 1.1;
  letter-spacing: -0.01em;
}

.etv-split-section--craft .etv-split-section__content .is-style-lead {
  font-size: 1.125rem;
  line-height: 1.8;
  color: var(--wp--preset--color--charcoal);
}

@media (max-width: 1023px) {
  .etv-split-section--craft .etv-split-section__image--feature {
    aspect-ratio: 4 / 3;
    max-height: 320px;
  }
}

/* Portrait split (image taller) */
.etv-split-section.is-style-portrait .etv-split-section__image {
  aspect-ratio: 3 / 4;
}

/* Square split */
.etv-split-section.is-style-square .etv-split-section__image {
  aspect-ratio: 1 / 1;
}

/* Landscape split */
.etv-split-section__image:not(.is-style-portrait):not(.is-style-square) {
  aspect-ratio: 4 / 3;
}

/* --------------------------------------------
   Dark Section — contrast rhythm
   -------------------------------------------- */
.etv-dark-section {
  background: var(--wp--preset--color--midnight-cobalt);
  padding: var(--etv-space-5xl) var(--etv-gutter);
  text-align: center;
  color: var(--wp--preset--color--warm-white);
}

.etv-dark-section h2,
.etv-dark-section h3 {
  color: var(--wp--preset--color--warm-white);
  font-family: var(--etv-font-heading);
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.15;
  margin-bottom: var(--etv-space-lg);
}

.etv-dark-section p {
  color: rgba(245, 242, 237, 0.8);
  line-height: 1.8;
  margin-bottom: var(--etv-space-xl);
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.125rem;
}

.etv-dark-section .etv-dark-section__eyebrow {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--wp--preset--color--champagne-gold-light);
  margin-bottom: var(--etv-space-lg);
  display: block;
}

/* Dark section with grid of cards */
.etv-dark-section.is-style-service-grid {
  text-align: left;
}

.etv-dark-section.is-style-service-grid .etv-service-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--etv-space-2xl);
  margin-top: var(--etv-space-4xl);
}

.etv-dark-section.is-style-service-grid .etv-service-grid__item {
  padding: var(--etv-space-xl);
  border: 1px solid rgba(245, 242, 237, 0.1);
  transition: border-color var(--etv-transition-base), transform var(--etv-transition-base);
}

.etv-dark-section.is-style-service-grid .etv-service-grid__item:hover {
  border-color: var(--wp--preset--color--champagne-gold);
  transform: translateY(-4px);
  background: rgba(255, 255, 255, 0.02);
}

.etv-dark-section.is-style-service-grid .etv-service-grid__item h3::after {
  content: '→';
  display: inline-block;
  margin-left: 0.5rem;
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  font-weight: 300;
  color: var(--wp--preset--color--champagne-gold);
}

.etv-dark-section.is-style-service-grid .etv-service-grid__item:hover h3::after {
  opacity: 1;
  transform: translateX(0);
}

.etv-dark-section.is-style-service-grid .etv-service-grid__item h3 {
  font-size: 1.5rem;
  margin-bottom: var(--etv-space-md);
}

.etv-dark-section.is-style-service-grid .etv-service-grid__item p {
  font-size: 0.9375rem;
  margin-bottom: 0;
}

@media (max-width: 1023px) {
  .etv-dark-section.is-style-service-grid .etv-service-grid {
    grid-template-columns: 1fr;
    gap: var(--etv-space-lg);
  }
}

/* --------------------------------------------
   Section Header — editorial style
   -------------------------------------------- */
.etv-section-header {
  text-align: center;
  margin-bottom: var(--etv-space-4xl);
}

.etv-section-header--left {
  text-align: left;
  margin-bottom: var(--etv-space-3xl);
}

.etv-section-header__label {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--wp--preset--color--champagne-gold);
  margin-bottom: var(--etv-space-md);
  display: block;
}

.etv-section-header h2 {
  font-family: var(--etv-font-heading);
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.1;
  margin-bottom: var(--etv-space-lg);
}

.etv-section-header p {
  color: var(--wp--preset--color--concrete-grey-dark);
  max-width: 36rem;
  margin: 0 auto;
  line-height: 1.7;
}

.etv-section-header--left h2 {
  max-width: 48rem;
}

.etv-section-header--left p {
  margin: 0;
  max-width: 36rem;
}

/* --------------------------------------------
   Feature Showcase — image-led alternating service
   ============================================
   Replaces old card grids with editorial composition.
   Image anchors left, content right. Reversed on
   alternating rows for visual rhythm.
   -------------------------------------------- */
.etv-feature-showcase {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--etv-space-4xl);
  align-items: center;
}

.etv-feature-showcase--reverse {
  direction: rtl;
}

.etv-feature-showcase--reverse > * {
  direction: ltr;
}

.etv-feature-showcase__image {
  overflow: hidden;
  background: var(--wp--preset--color--concrete-grey);
  aspect-ratio: 4 / 3;
  position: relative;
}

.etv-feature-showcase__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.etv-feature-showcase:hover .etv-feature-showcase__image img {
  transform: scale(1.04);
}

.etv-feature-showcase__content {
  padding: var(--etv-space-xl) 0;
}

.etv-feature-showcase__content h3 {
  font-family: var(--etv-font-heading);
  font-size: clamp(1.5rem, 3vw, 2.5rem);
  line-height: 1.15;
  margin-bottom: var(--etv-space-md);
  color: var(--wp--preset--color--warm-white);
}

.etv-feature-showcase__content p {
  color: rgba(245, 242, 237, 0.75);
  line-height: 1.8;
  margin-bottom: var(--etv-space-xl);
  font-size: 1rem;
}

.etv-feature-showcase__content .etv-feature-showcase__label {
  font-family: var(--etv-font-heading);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wp--preset--color--champagne-gold-light);
  margin-bottom: var(--etv-space-md);
  display: block;
}

@media (max-width: 1023px) {
  .etv-feature-showcase {
    grid-template-columns: 1fr;
    gap: var(--etv-space-xl);
  }

  .etv-feature-showcase--reverse {
    direction: ltr;
  }

  .etv-feature-showcase__image img {
    max-height: 280px;
    object-fit: cover;
  }
}

/* --------------------------------------------
   Material Gallery — editorial macro grid
   Full-width hero strip + square grid below
   -------------------------------------------- */
.etv-material-gallery {
  display: flex;
  flex-direction: column;
  gap: var(--etv-space-md);
}

.etv-material-gallery__item {
  margin: 0;
  overflow: hidden;
  line-height: 0;
}

.etv-material-gallery__item img {
  width: 100%;
  transition: transform 0.8s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.etv-material-gallery__item:hover img {
  transform: scale(1.04);
}

.etv-material-gallery__item--wide img {
  aspect-ratio: 4 / 1;
  object-fit: cover;
}

.etv-material-gallery__row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--etv-space-md);
}

.etv-material-gallery__row .etv-material-gallery__item img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

@media (max-width: 1023px) {
  .etv-material-gallery__item--wide img {
    aspect-ratio: 3 / 1;
  }

  .etv-material-gallery__row {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .etv-material-gallery__item--wide img {
    aspect-ratio: 2 / 1;
  }

  .etv-material-gallery__row {
    grid-template-columns: 1fr;
  }
}

/* --------------------------------------------
   Testimonial Section
   -------------------------------------------- */
.etv-testimonial {
  background: var(--wp--preset--color--midnight-cobalt);
  padding: var(--etv-space-5xl) var(--etv-gutter);
  color: var(--wp--preset--color--warm-white);
  text-align: center;
}

.etv-testimonial blockquote {
  margin: 0;
  padding: 0;
  border: none;
}

.etv-testimonial__quote {
  font-family: var(--etv-font-display);
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-style: italic;
  line-height: 1.6;
  margin-bottom: var(--etv-space-2xl);
  max-width: 56rem;
  margin-left: auto;
  margin-right: auto;
  color: var(--wp--preset--color--warm-white);
  font-weight: 400;
}

.etv-testimonial__quote::before {
  content: '\201C';
  display: block;
  font-size: 4rem;
  line-height: 0.5;
  color: var(--wp--preset--color--champagne-gold);
  margin-bottom: var(--etv-space-xl);
  opacity: 0.6;
}

.etv-testimonial__attribution {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--small);
  color: rgba(245, 242, 237, 0.7);
  letter-spacing: 0.03em;
}

.etv-testimonial__name {
  font-weight: 600;
  color: var(--wp--preset--color--warm-white);
  display: block;
  margin-bottom: 0.25rem;
}

.etv-testimonial__title {
  display: block;
}

/* --------------------------------------------
   Process Timeline — alternating step-by-step
   -------------------------------------------- */
.etv-timeline {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--etv-space-5xl);
}

.etv-timeline__item {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--etv-space-4xl);
  align-items: center;
}

.etv-timeline__item:nth-child(even) {
  direction: rtl;
}

.etv-timeline__item:nth-child(even) > * {
  direction: ltr;
}

.etv-timeline__step {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--wp--preset--color--champagne-gold);
  margin-bottom: var(--etv-space-md);
  display: block;
}

.etv-timeline__image {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--wp--preset--color--concrete-grey);
}

.etv-timeline__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--etv-transition-slow);
}

.etv-timeline__item:hover .etv-timeline__image img {
  transform: scale(1.04);
}

.etv-timeline__content h3 {
  font-family: var(--etv-font-heading);
  font-size: 1.75rem;
  line-height: 1.2;
  margin-bottom: var(--etv-space-md);
}

.etv-timeline__content p {
  color: var(--wp--preset--color--concrete-grey-dark);
  line-height: 1.8;
  font-size: 1rem;
}

@media (max-width: 1023px) {
  .etv-timeline__item {
    grid-template-columns: 1fr;
    gap: var(--etv-space-xl);
  }

  .etv-timeline__item:nth-child(even) {
    direction: ltr;
  }
}

/* --------------------------------------------
   Material Card — macro photography grid
   -------------------------------------------- */
.etv-material-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--etv-space-lg);
}

@media (max-width: 1023px) {
  .etv-material-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .etv-material-grid {
    grid-template-columns: 1fr;
  }
}

.etv-material-card {
  text-decoration: none;
  color: inherit;
  display: block;
  position: relative;
  overflow: hidden;
  background: var(--wp--preset--color--concrete-grey);
  aspect-ratio: 1;
}

.etv-material-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--etv-transition-slow);
}

.etv-material-card:hover img {
  transform: scale(1.08);
}

.etv-material-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(12, 20, 40, 0.7) 0%, transparent 50%);
  display: flex;
  align-items: flex-end;
  padding: var(--etv-space-lg);
  opacity: 0;
  transition: opacity var(--etv-transition-base);
}

.etv-material-card:hover .etv-material-card__overlay {
  opacity: 1;
}

.etv-material-card__name {
  color: var(--wp--preset--color--warm-white);
  font-family: var(--etv-font-heading);
  font-size: 1.25rem;
  line-height: 1.2;
}

/* --------------------------------------------
   Editorial Gallery — masonry/lightbox
   -------------------------------------------- */
.etv-gallery {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: 300px 300px;
  gap: var(--etv-space-md);
}

.etv-gallery__item {
  overflow: hidden;
  background: var(--wp--preset--color--concrete-grey);
  position: relative;
}

.etv-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--etv-transition-slow);
  cursor: pointer;
}

.etv-gallery__item:hover img {
  transform: scale(1.05);
}

.etv-gallery__item:nth-child(1) {
  grid-row: 1 / 3;
}

.etv-gallery__item:nth-child(4) {
  grid-column: 1 / 4;
}

@media (max-width: 1023px) {
  .etv-gallery {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
  }

  .etv-gallery__item:nth-child(n) {
    grid-column: auto;
    grid-row: auto;
  }
}

@media (max-width: 600px) {
  .etv-gallery {
    grid-template-columns: 1fr;
  }
}

/* --------------------------------------------
   Project Showcase Card — editorial portfolio
   -------------------------------------------- */
.etv-project-showcase {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--etv-space-5xl);
}

.etv-project-showcase__card {
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: var(--etv-space-3xl);
  align-items: center;
  text-decoration: none;
  color: inherit;
}

.etv-project-showcase__card:nth-child(even) {
  direction: rtl;
}

.etv-project-showcase__card:nth-child(even) > * {
  direction: ltr;
}

.etv-project-showcase__image {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--wp--preset--color--concrete-grey);
  position: relative;
}

.etv-project-showcase__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--etv-transition-slow);
}

.etv-project-showcase__card:hover .etv-project-showcase__image img {
  transform: scale(1.05);
}

.etv-project-showcase__info {
  padding: var(--etv-space-xl);
}

.etv-project-showcase__type {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wp--preset--color--champagne-gold);
  margin-bottom: var(--etv-space-md);
  display: block;
}

.etv-project-showcase__title {
  font-family: var(--etv-font-heading);
  font-size: clamp(1.25rem, 2.5vw, 2rem);
  line-height: 1.2;
  margin-bottom: var(--etv-space-md);
}

.etv-project-showcase__description {
  color: var(--wp--preset--color--concrete-grey-dark);
  line-height: 1.7;
  margin-bottom: var(--etv-space-lg);
  font-size: 0.9375rem;
}

.etv-project-showcase__cta {
  display: inline-flex;
  align-items: center;
  gap: var(--etv-space-sm);
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 500;
  color: var(--wp--preset--color--charcoal);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
  transition: color var(--etv-transition-base), border-color var(--etv-transition-base);
}

.etv-project-showcase__card:hover .etv-project-showcase__cta {
  color: var(--wp--preset--color--champagne-gold);
  border-color: var(--wp--preset--color--champagne-gold);
}

.etv-project-showcase__cta::after {
  content: '→';
  transition: transform var(--etv-transition-base);
}

.etv-project-showcase__card:hover .etv-project-showcase__cta::after {
  transform: translateX(4px);
}

@media (max-width: 1023px) {
  .etv-project-showcase__card {
    grid-template-columns: 1fr;
    gap: var(--etv-space-xl);
  }

  .etv-project-showcase__card:nth-child(even) {
    direction: ltr;
  }

  .etv-project-showcase__image {
    max-height: 280px;
  }
}

/* --------------------------------------------
   Journal Preview — 3 editorial cards
   -------------------------------------------- */
.etv-journal-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--etv-space-2xl);
}

@media (max-width: 1023px) {
  .etv-journal-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .etv-journal-grid {
    grid-template-columns: 1fr;
  }
}

.etv-journal-card {
  text-decoration: none;
  color: inherit;
  display: block;
  transition: transform var(--etv-transition-base);
}

.etv-journal-card:hover {
  transform: translateY(-4px);
}

.etv-journal-card__image {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  margin-bottom: var(--etv-space-lg);
  background: var(--wp--preset--color--concrete-grey);
}

.etv-journal-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--etv-transition-slow);
}

.etv-journal-card:hover .etv-journal-card__image img {
  transform: scale(1.05);
}

.etv-journal-card__category {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--wp--preset--color--champagne-gold);
  margin-bottom: var(--etv-space-sm);
  display: block;
}

.etv-journal-card__title {
  font-family: var(--etv-font-heading);
  font-size: 1.375rem;
  line-height: 1.25;
  margin-bottom: var(--etv-space-sm);
}

.etv-journal-card__excerpt {
  font-size: 0.875rem;
  color: var(--wp--preset--color--concrete-grey-dark);
  line-height: 1.6;
  margin-bottom: var(--etv-space-md);
}

.etv-journal-card__date {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  color: var(--wp--preset--color--brushed-steel);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* --------------------------------------------
   Featured Projects — 50/25/25 asymmetric grid
   -------------------------------------------- */
.etv-featured-grid .wp-block-post-template {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 1.5rem;
}

.etv-featured-grid .wp-block-post-template > *:first-child .wp-block-post-featured-image {
  aspect-ratio: 4 / 3;
}

.etv-featured-grid .wp-block-post-template > *:first-child h3 {
  font-size: 1.75rem;
}

.etv-featured-grid .wp-block-post-template > *:not(:first-child) .wp-block-post-featured-image {
  aspect-ratio: 1 / 1;
}

@media (max-width: 1023px) {
  .etv-featured-grid .wp-block-post-template {
    grid-template-columns: 1fr;
  }
  .etv-featured-grid .wp-block-post-template > *:first-child .wp-block-post-featured-image {
    aspect-ratio: 16 / 9;
  }
  .etv-featured-grid .wp-block-post-template > *:not(:first-child) .wp-block-post-featured-image {
    aspect-ratio: 16 / 9;
  }
}

/* --------------------------------------------
   Material Strips — full-width macro texture
   -------------------------------------------- */
.etv-material-strips {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.etv-material-strip {
  margin: 0;
  overflow: hidden;
  line-height: 0;
}

.etv-material-strip img {
  width: 100%;
  aspect-ratio: 4 / 1;
  object-fit: cover;
  transition: transform 0.8s ease;
}

.etv-material-strip:hover img {
  transform: scale(1.03);
}

@media (max-width: 1023px) {
  .etv-material-strip img {
    aspect-ratio: 3 / 1;
  }
}

@media (max-width: 600px) {
  .etv-material-strip img {
    aspect-ratio: 2 / 1;
  }
}

/* --------------------------------------------
   Testimonial — portrait + quote layout
   -------------------------------------------- */
.etv-testimonial-layout {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: var(--etv-space-4xl);
  align-items: center;
  max-width: var(--etv-content-wide);
  margin: 0 auto;
}

.etv-testimonial__portrait {
  margin: 0;
  overflow: hidden;
}

.etv-testimonial__portrait img {
  width: 100%;
  height: 420px;
  object-fit: cover;
}

.etv-testimonial__text {
  text-align: left;
}

.etv-testimonial__text .etv-testimonial__quote {
  text-align: left;
  margin-left: 0;
}

.etv-testimonial__text .etv-testimonial__quote::before {
  text-align: left;
}

.etv-testimonial__text .etv-testimonial__attribution {
  text-align: left;
}

@media (max-width: 1023px) {
  .etv-testimonial-layout {
    grid-template-columns: 1fr;
    gap: var(--etv-space-2xl);
  }
  .etv-testimonial__portrait img {
    height: 300px;
  }
  .etv-testimonial__text {
    text-align: center;
  }
  .etv-testimonial__text .etv-testimonial__quote {
    text-align: center;
  }
  .etv-testimonial__text .etv-testimonial__attribution {
    text-align: center;
  }
}

/* --------------------------------------------
   Hero — immersive full-screen enhanced
   -------------------------------------------- */
.etv-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.etv-hero__background {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.etv-hero__background img,
.etv-hero__background video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.etv-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    135deg,
    rgba(12, 20, 40, 0.7) 0%,
    rgba(12, 20, 40, 0.35) 50%,
    rgba(12, 20, 40, 0.6) 100%
  );
}

.etv-hero__content {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 48rem;
  margin: 0 auto;
  padding: 0 var(--etv-gutter);
}

.etv-hero__eyebrow {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  color: var(--wp--preset--color--champagne-gold-light);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  margin-bottom: var(--etv-space-xl);
  display: block;
}

.etv-hero__eyebrow span {
  display: inline-flex;
  align-items: center;
  gap: var(--etv-space-md);
}

.etv-hero__eyebrow span::before,
.etv-hero__eyebrow span::after {
  content: '';
  width: 2rem;
  height: 1px;
  background: var(--wp--preset--color--champagne-gold);
  opacity: 0.5;
}

.etv-hero__title {
  font-family: var(--etv-font-heading);
  font-size: clamp(2.5rem, 8vw, 6rem);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin-bottom: var(--etv-space-xl);
  color: var(--wp--preset--color--warm-white);
  font-weight: 400;
}

.etv-hero__subtitle {
  font-size: clamp(1rem, 2vw, 1.25rem);
  line-height: 1.8;
  color: rgba(245, 242, 237, 0.8);
  margin-bottom: var(--etv-space-2xl);
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}

.etv-hero__cta {
  display: inline-flex;
  align-items: center;
  gap: var(--etv-space-md);
}

/* Separator */
.etv-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--etv-space-lg);
  color: var(--wp--preset--color--champagne-gold);
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--small);
  text-transform: uppercase;
  letter-spacing: 0.15em;
  margin: var(--etv-space-lg) 0;
}

.etv-divider::before,
.etv-divider::after {
  content: '';
  width: 3rem;
  height: 1px;
  background: var(--wp--preset--color--champagne-gold);
  opacity: 0.4;
}

/* Scroll Indicator */
.etv-scroll-indicator {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(245, 242, 237, 0.5);
  margin-top: var(--etv-space-4xl);
  animation: etv-scroll-pulse 2.4s ease-in-out infinite;
}

@keyframes etv-scroll-pulse {
  0%, 100% { opacity: 0.4; transform: translateY(0); }
  50%      { opacity: 0.8; transform: translateY(4px); }
}

/* Image Caption */
.etv-image-caption {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  color: var(--wp--preset--color--brushed-steel);
  letter-spacing: 0.04em;
  margin-top: var(--etv-space-sm);
  text-align: right;
}

/* --------------------------------------------
   Hero (short variant for sub-pages)
   -------------------------------------------- */
.etv-hero--short {
  min-height: 50vh;
}

.etv-hero--short .etv-hero__title {
  font-size: clamp(2rem, 5vw, 4rem);
}

/* --------------------------------------------
   Section spacing utility
   -------------------------------------------- */
.etv-section {
  padding: var(--etv-section-gap) var(--etv-gutter);
}

.etv-section--sm {
  padding: var(--etv-space-3xl) var(--etv-gutter);
}

.etv-section--lg {
  padding: calc(var(--etv-section-gap) * 1.5) var(--etv-gutter);
}

.etv-section--no-top {
  padding-top: 0;
}

.etv-section--no-bottom {
  padding-bottom: 0;
}

/* --------------------------------------------
   Hero Word Split — editorial text reveal
   -------------------------------------------- */
.etv-hero__title .word {
  display: inline-block;
  white-space: nowrap;
}

/* --------------------------------------------
   Full-width banner CTA
   -------------------------------------------- */
.etv-cta-banner {
  background: linear-gradient(rgba(12, 20, 40, 0.75), rgba(12, 20, 40, 0.75)), var(--wp--preset--color--midnight-cobalt) center / cover no-repeat;
  padding: var(--etv-space-5xl) var(--etv-gutter);
  text-align: center;
  color: var(--wp--preset--color--warm-white);
  position: relative;
}

.etv-cta-banner h2 {
  color: var(--wp--preset--color--warm-white);
  font-family: var(--etv-font-heading);
  font-size: clamp(2rem, 5vw, 4rem);
  line-height: 1.1;
  margin-bottom: var(--etv-space-xl);
  max-width: 48rem;
  margin-left: auto;
  margin-right: auto;
}

.etv-cta-banner p {
  color: rgba(245, 242, 237, 0.8);
  font-size: 1.125rem;
  line-height: 1.8;
  margin-bottom: var(--etv-space-2xl);
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}

/* ============================================
   HEADER — Sticky Transparent → Glass Navigation
   ============================================ */

/* Container */
.etv-header {
  position: sticky;
  top: 0;
  z-index: var(--etv-z-header);
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background var(--etv-transition-glass),
              border-color var(--etv-transition-glass),
              box-shadow var(--etv-transition-glass),
              padding var(--etv-transition-glass),
              filter var(--etv-transition-glass);
}

/* Scrolled state also transitions the inner padding smoothly */
.etv-header.is-scrolled .etv-header__inner {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

/* Glass state (toggled via JS class) */
.etv-header.is-scrolled {
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--etv-overlay-light);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.05);
  --etv-header-pad-y: 0.75rem;  /* triggers compact padding via CSS custom property */
}

/* Scrolled: logo shrinks */
.etv-header.is-scrolled .etv-header__logo img {
  width: 90px !important;
  height: auto;
  transition: width var(--etv-transition-base);
}

/* Scrolled: nav items tighten */
.etv-header.is-scrolled .etv-header__nav a,
.etv-header.is-scrolled .etv-header__nav .wp-block-navigation-item__content {
  color: var(--wp--preset--color--charcoal);
  font-size: 0.75rem;
  letter-spacing: 0.03em;
}

/* Scrolled: submenu toggle matches nav size */
.etv-header.is-scrolled .wp-block-navigation-submenu__toggle {
  color: var(--etv-color-charcoal);
  font-size: 0.75rem;
}

.etv-header.is-scrolled .wp-block-navigation-submenu__toggle:hover {
  color: var(--etv-color-black);
}

/* Scrolled: navigation gap tighter */
.etv-header.is-scrolled .wp-block-navigation__container {
  gap: clamp(1rem, 1.5vw, 1.5rem);
}

/* Scrolled: premium CTA — slight shadow for depth */
.etv-header.is-scrolled .wp-block-button.is-style-premium-cta .wp-block-button__link {
  background: var(--wp--preset--color--midnight-cobalt);
  color: var(--wp--preset--color--warm-white);
  border-color: var(--wp--preset--color--midnight-cobalt);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.etv-header.is-scrolled .wp-block-button.is-style-premium-cta .wp-block-button__link:hover {
  background: transparent;
  color: var(--wp--preset--color--midnight-cobalt);
  border-color: var(--wp--preset--color--midnight-cobalt);
}

/* Scrolled: actions (lang switcher + CTA) gap tighter */
.etv-header.is-scrolled .etv-header__actions {
  gap: var(--etv-space-md);
}

/* Inner flex row */
.etv-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--etv-header-pad-y) clamp(1.5rem, 4vw, 4rem);
  transition: padding var(--etv-transition-glass);
}

/* Logo */
.etv-header__logo {
  flex-shrink: 0;
  line-height: 0;
}

/* On transparent header: logo is white.
   On scrolled glass header: reverts to original. */
.etv-header:not(.is-scrolled) .etv-header__logo .custom-logo {
  filter: brightness(0) invert(1);
}

.etv-header.is-scrolled .etv-header__logo .custom-logo {
  filter: none;
  transition: filter var(--etv-transition-glass);
}

/* Navigation list — WP menu rendered inside */
.etv-header__nav {
  display: flex;
  align-items: center;
  gap: var(--wp--preset--spacing--60, 2rem);
  list-style: none;
  padding: 0;
  margin: 0;
}

.etv-header__nav .wp-block-navigation-item {
  margin: 0;
  padding: 0;
}

.etv-header__nav a,
.etv-header__nav .wp-block-navigation-item__content {
  font-family: var(--etv-font-heading);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  padding: 0.375rem 0;
  position: relative;
  transition: color var(--etv-transition-glass);
}

/* Copper underline */
.etv-header__nav a::after,
.etv-header__nav .wp-block-navigation-item__content::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 1.5px;
  background: var(--wp--preset--color--champagne-gold);
  transition: width 0.35s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.etv-header__nav a:hover,
.etv-header__nav a:focus-visible,
.etv-header__nav .wp-block-navigation-item__content:hover,
.etv-header__nav .wp-block-navigation-item__content:focus-visible {
  color: var(--etv-color-white);
}

.etv-header__nav a:hover::after,
.etv-header__nav a:focus-visible::after,
.etv-header__nav .current-menu-item > a::after,
.etv-header__nav .current-menu-item > .wp-block-navigation-item__content::after,
.etv-header__nav .wp-block-navigation-item__content:hover::after,
.etv-header__nav .wp-block-navigation-item__content:focus-visible::after {
  width: 100%;
}

.etv-header.is-scrolled .etv-header__nav a:hover,
.etv-header.is-scrolled .etv-header__nav a:focus-visible,
.etv-header.is-scrolled .etv-header__nav .wp-block-navigation-item__content:hover,
.etv-header.is-scrolled .etv-header__nav .wp-block-navigation-item__content:focus-visible {
  color: var(--wp--preset--color--midnight-cobalt);
}

/* --------------------------------------------
   Header Right Rail — Lang Switcher + CTA
   -------------------------------------------- */
.etv-header__actions {
  display: flex;
  align-items: center;
  gap: var(--etv-space-xl);
  flex-shrink: 0;
}

/* Header CTA button wrapper */
.etv-header__cta {
  margin: 0;
  opacity: 0;
  animation: etv-fade-header 0.8s ease 0.4s forwards;
}

.etv-header__cta .wp-block-button__link {
  white-space: nowrap;
}

@keyframes etv-fade-header {
  from { opacity: 0; transform: translateY(2px); }
  to   { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .etv-header__cta {
    opacity: 1;
    animation: none;
  }
}

/* Hide old search icon */
.etv-header__search {
  display: none !important;
}

/* Mobile (< 1024px) — hamburger overlay visible */
@media (max-width: 1023px) {
  .etv-header__inner {
    gap: var(--etv-space-md);
  }

  .etv-header__nav {
    font-size: 1.25rem;
  }

  .etv-header__nav .wp-block-navigation__container {
    display: none !important;
  }

  .etv-header__nav .wp-block-navigation__responsive-container-open {
    display: flex !important;
  }

  .etv-header__nav .wp-block-navigation__responsive-container.is-menu-open {
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
  }

  .etv-header__nav .wp-block-navigation__responsive-container a {
    color: var(--etv-color-charcoal) !important;
    font-size: 1.375rem;
    padding: 0.75rem 0;
  }

  .etv-header__nav .wp-block-navigation__responsive-container a:hover {
    color: var(--etv-color-black) !important;
  }

  .etv-header__nav .wp-block-navigation__responsive-container a::after {
    display: none;
  }

  .etv-header__nav .wp-block-navigation__responsive-container-close {
    color: var(--etv-color-charcoal);
  }

  .etv-header__nav .wp-block-navigation__responsive-container {
    overflow-y: auto;
  }
}

/* Desktop (>= 1024px) — desktop nav visible, mobile overlay UI hidden */
@media (min-width: 1024px) {
  .etv-header__nav .wp-block-navigation__responsive-container-open,
  .etv-header__nav .wp-block-navigation__responsive-container-close {
    display: none !important;
  }

  .etv-header__nav .wp-block-navigation__responsive-container {
    display: block !important;
    position: static !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    width: auto !important;
    height: auto !important;
    background: transparent !important;
    overflow: visible !important;
  }

  .etv-header__nav .wp-block-navigation__responsive-container-overlay {
    display: none !important;
  }

  .etv-header__nav .wp-block-navigation__responsive-container-content {
    display: block !important;
    padding: 0 !important;
  }

  .etv-header__nav .wp-block-navigation__container {
    display: flex !important;
  }
}

/* ============================================
   SUBMENU / DROPDOWN — Navigation Submenus
   ============================================ */

/* Submenu container — the dropdown */
.etv-header__nav .wp-block-navigation-submenu {
  position: relative;
}

.etv-header__nav .wp-block-navigation__submenu-container {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 220px;
  background: rgba(255, 255, 255, 0.98);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 8px;
  padding: 0.5rem 0;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
  z-index: 100;
}

/* Show submenu on hover (desktop) */
.etv-header__nav .wp-block-navigation-submenu:hover > .wp-block-navigation__submenu-container,
.etv-header__nav .wp-block-navigation-submenu:focus-within > .wp-block-navigation__submenu-container,
.etv-header__nav .wp-block-navigation-submenu.is-submenu-open > .wp-block-navigation__submenu-container {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Submenu items */
.etv-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item {
  display: block;
  margin: 0;
  padding: 0;
}

.etv-header__nav .wp-block-navigation__submenu-container a,
.etv-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  display: block;
  padding: 0.5rem 1.25rem;
  font-family: var(--etv-font-heading);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: none;
  color: var(--etv-color-charcoal) !important;
  text-decoration: none;
  transition: background var(--etv-transition-fast), color var(--etv-transition-fast);
  white-space: nowrap;
}

.etv-header__nav .wp-block-navigation__submenu-container a:hover,
.etv-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.etv-header__nav .wp-block-navigation__submenu-container a:focus-visible {
  background: var(--etv-overlay-light);
  color: var(--etv-color-black) !important;
}

/* Remove underline effect in submenu */
.etv-header__nav .wp-block-navigation__submenu-container a::after,
.etv-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content::after {
  display: none !important;
}

/* Submenu toggle button (chevron) styling */
.etv-header__nav .wp-block-navigation-submenu__toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.375rem 0;
  font-family: var(--etv-font-heading);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.85);
  background: none;
  border: none;
  cursor: pointer;
  transition: color 0.4s ease;
}

.etv-header__nav .wp-block-navigation-submenu__toggle::after {
  content: '▾';
  font-size: 0.625rem;
  display: inline-block;
  transition: transform 0.3s ease;
}

.etv-header__nav .wp-block-navigation-submenu:hover > .wp-block-navigation-submenu__toggle::after,
.etv-header__nav .wp-block-navigation-submenu.is-submenu-open > .wp-block-navigation-submenu__toggle::after {
  transform: rotate(180deg);
}

/* Submenu on scrolled state */
.etv-header.is-scrolled .wp-block-navigation__submenu-container {
  background: rgba(255, 255, 255, 0.98);
  border-color: var(--etv-overlay-glass);
}

/* Mobile submenu styles */
@media (max-width: 1023px) {
  .etv-header__nav .wp-block-navigation__submenu-container {
    position: static;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    transform: none;
    padding: 0 0 0 1rem;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease, padding 0.35s ease;
  }

  .etv-header__nav .wp-block-navigation-submenu:hover > .wp-block-navigation__submenu-container,
  .etv-header__nav .wp-block-navigation-submenu:focus-within > .wp-block-navigation__submenu-container,
  .etv-header__nav .wp-block-navigation-submenu.is-submenu-open > .wp-block-navigation__submenu-container {
    max-height: 400px;
    padding: 0.5rem 0 0.5rem 1rem;
  }

  .etv-header__nav .wp-block-navigation__submenu-container a,
  .etv-header__nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    font-size: 1.125rem;
    padding: 0.5rem 0.75rem;
    color: var(--etv-color-charcoal) !important;
    white-space: normal;
  }

  .etv-header__nav .wp-block-navigation__submenu-container a:hover {
    background: rgba(0, 0, 0, 0.03);
  }

  .etv-header__nav .wp-block-navigation-submenu__toggle {
    font-size: 1.25rem;
    color: var(--etv-color-charcoal) !important;
    padding: 0.75rem 0;
  }

  .etv-header__nav .wp-block-navigation-submenu__toggle::after {
    font-size: 0.75rem;
    margin-left: auto;
  }
}

/* ============================================
   FOOTER — Redesigned
   Dark editorial footer with watermark typography,
   trust bar, and 4-column navigation grid.
   Midnight-cobalt background throughout.
   ============================================ */

/* Main footer container — dark, overflow hidden for watermark */
.etv-footer {
  position: relative;
  overflow: hidden;
  background-color: var(--wp--preset--color--midnight-cobalt);
  background-image: linear-gradient(
      180deg,
      color-mix(in srgb, var(--wp--preset--color--midnight-cobalt) 88%, transparent),
      color-mix(in srgb, var(--wp--preset--color--midnight-cobalt) 94%, transparent)
    ),
    url('/wp-content/themes/Et-Voila-Maroc-wp-primary/assets/images/footer-background.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: var(--wp--preset--color--warm-white);
}

/* ================================
   WATERMARK — Editorial large type
   ================================ */
.etv-footer__watermark {
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 0 !important;
  pointer-events: none;
  user-select: none;
  opacity: 0.035;
  color: var(--wp--preset--color--warm-white);
  line-height: 0.85;
  text-align: right;
  z-index: 0;
  max-width: 90%;
  letter-spacing: 0.04em;
}

/* ================================
   INNER — Content above watermark
   ================================ */
.etv-footer__inner {
  position: relative;
  z-index: 1;
  max-width: var(--etv-content-wide);
  margin: 0 auto;
}

/* ================================
   GRID — 4-column navigation layout
   ================================ */
.etv-footer__grid {
  gap: var(--etv-space-4xl) var(--etv-space-5xl) !important;
}

/* ================================
   COLUMN — Brand identity
   ================================ */
.etv-footer__col--brand {
  display: flex;
  flex-direction: column;
  gap: var(--etv-space-30);
}

.etv-footer__logo {
  display: block;
  margin-bottom: var(--etv-space-sm);
  opacity: 0.95;
  transition: opacity var(--etv-transition-base);
}

.etv-footer__logo:hover {
  opacity: 1;
}

.etv-footer__tagline {
  font-size: 1.05rem;
  font-weight: 300;
  line-height: 1.5;
  margin: 0;
}

.etv-footer__legal {
  opacity: 0.65;
  font-size: 0.75rem;
  margin: 0;
}

/* ================================
   SOCIAL LINKS — Minimal text labels
   ================================ */
.etv-footer__socials-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: var(--etv-space-20);
  margin-top: var(--etv-space-20);
}

.etv-footer__social-link {
  margin: 0 !important;
}

.etv-footer__social-link a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 2px;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: var(--wp--preset--color--warm-white);
  text-decoration: none;
  transition: all var(--etv-transition-fast);
}

.etv-footer__social-link a:hover {
  border-color: rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.05);
  transform: translateY(-2px);
}

/* ================================
   HEADING — Column titles
   ================================ */
.etv-footer__heading {
  font-family: var(--etv-font-heading);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0 0 var(--etv-space-30) 0;
  color: var(--wp--preset--color--champagne-gold);
}

/* ================================
   NAV — Service & resource links
   ================================ */
.etv-footer__nav {
  display: flex;
  flex-direction: column;
  gap: var(--etv-space-20) !important;
  list-style: none;
  padding: 0;
  margin: 0;
}

.etv-footer__nav li {
  margin: 0;
}

.etv-footer__nav a {
  font-size: 0.85rem;
  line-height: 1.6;
  color: var(--wp--preset--color--warm-white);
  text-decoration: none;
  opacity: 0.75;
  transition: opacity var(--etv-transition-fast);
  display: inline-block;
  position: relative;
  padding-bottom: 1px;
}

.etv-footer__nav a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--wp--preset--color--champagne-gold);
  transition: width var(--etv-transition-fast);
}

.etv-footer__nav a:hover {
  opacity: 1;
}

.etv-footer__nav a:hover::after {
  width: 100%;
}

/* ================================
   CONTACT COLUMN — Phone, email, CTA
   ================================ */
.etv-footer__col--contact p {
  margin: 0;
}

.etv-footer__col--contact a {
  color: var(--wp--preset--color--warm-white);
  text-decoration: none;
  opacity: 0.75;
  transition: opacity var(--etv-transition-fast);
}

.etv-footer__col--contact a:hover {
  opacity: 1;
}

/* ================================
   TRUST BAR — Certification badges row
   ================================ */
.etv-footer__trust-wrapper {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  margin-top: var(--etv-space-20);
}

.etv-footer__trust {
  gap: var(--etv-space-20) !important;
}

.etv-footer__trust .wp-block-column {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 2px;
  padding: var(--etv-space-20) var(--etv-space-20);
  transition: border-color var(--etv-transition-fast);
}

.etv-footer__trust .wp-block-column:hover {
  border-color: var(--wp--preset--color--champagne-gold);
}

.etv-footer__trust .wp-block-column p {
  margin: 0;
  line-height: 1.4;
}

/* ================================
   DIVIDER
   ================================ */
.etv-footer__divider {
  border: none !important;
  height: 1px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  margin: 0 !important;
}

/* ================================
   BOTTOM BAR — Copyright + Legal
   ================================ */
.etv-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: var(--etv-space-30);
  opacity: 0.6;
}

.etv-footer__bottom p {
  margin: 0;
}

.etv-footer__bottom a {
  color: var(--wp--preset--color--warm-white);
  text-decoration: none;
  opacity: 0.7;
  transition: opacity var(--etv-transition-fast);
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  padding-bottom: 1px;
}

.etv-footer__bottom a:hover {
  opacity: 1;
  border-bottom-color: var(--wp--preset--color--champagne-gold);
}

/* ================================
   RESPONSIVE — Tablet
   ================================ */
@media (max-width: 768px) {
  .etv-footer__inner {
    padding-left: var(--etv-gutter) !important;
    padding-right: var(--etv-gutter) !important;
  }

  .etv-footer__grid {
    gap: var(--etv-space-3xl) !important;
  }

  .etv-footer__col--brand {
    order: -1;
  }

  .etv-footer__col--nav,
  .etv-footer__col--contact {
    flex-basis: 45% !important;
  }

  .etv-footer__bottom {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ================================
   RESPONSIVE — Mobile
   ================================ */
@media (max-width: 480px) {
  .etv-footer__grid {
    gap: var(--etv-space-2xl) !important;
  }

  .etv-footer__col--nav,
  .etv-footer__col--contact {
    flex-basis: 100% !important;
  }

  .etv-footer__trust {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--etv-space-20);
  }

  .etv-footer__trust .wp-block-column {
    padding: var(--etv-space-20) var(--etv-space-sm);
  }

  .etv-footer__bottom {
    gap: var(--etv-space-20);
    font-size: 0.65rem;
  }

  .etv-footer__watermark {
    font-size: 5rem !important;
    opacity: 0.025;
  }
}

/* ================================
   SECTION + PARALLAX (unrelated but adjacent)
   ================================ */

/* Subtle parallax on hero background (mobile disabled) */
@media (min-width: 1024px) {
  .etv-header {
    will-change: backdrop-filter;
  }
}


/* ============================================
   Section spacing normalization
   Collapses WordPress FSE default margins.
   Spacing is applied via padding on parent containers.
   !important is used where WP core inline styles
   must be overridden.
   ============================================ */

/* Base sections: zero all margins */
.etv-section,
.etv-hero,
.etv-hero--short,
.etv-home {
  margin: 0 !important;
  margin-block: 0 !important;
}

/* Hero sections: consistent side padding */
.etv-hero,
.etv-hero--short {
  padding-left: var(--etv-gutter) !important;
  padding-right: var(--etv-gutter) !important;
}

/* Collapse vertical margins between adjacent block containers */
.wp-block-group + .wp-block-group,
.wp-block-group + .wp-block-cover,
.wp-block-cover + .wp-block-group,
.wp-block-cover + .wp-block-cover,
.wp-block-columns + .wp-block-group,
.wp-block-group + .wp-block-columns,
.etv-section + *,
.etv-section + .etv-section,
.etv-section + .etv-hero,
.etv-cta-banner + .etv-footer,
.alignfull + .alignfull {
  margin-top: 0 !important;
}

/* Children inside sections: zero top margin */
.etv-section > *,
.etv-hero > *,
.etv-footer > *,
.etv-home > *,
.alignfull > * {
  margin-top: 0 !important;
}

/* Separators: no vertical space */
.wp-block-separator,
.wp-block-separator.alignwide {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* alignfull groups: edge-to-edge padding */
.wp-block-group.alignfull:not(.etv-hero):not(.etv-hero-full):not(.wp-block-cover) {
  padding-left: var(--etv-gutter) !important;
  padding-right: var(--etv-gutter) !important;
}

@media print {
  .etv-header,
  .etv-footer,
  .etv-breadcrumbs,
  .etv-pagination {
    display: none;
  }

  body {
    background: white;
    color: black;
    font-size: 12pt;
  }

  a {
    color: inherit;
    text-decoration: underline;
  }

  img {
    max-width: 100% !important;
    page-break-inside: avoid;
  }
}

/* ============================================
   MEGA MENU — Enhanced Navigation Dropdowns
   ============================================ */

/* Mega menu container — wider, multi-column layout */
.etv-header__nav .wp-block-navigation-submenu.etv-mega-menu {
  position: relative;
}

.etv-header__nav .wp-block-navigation-submenu.etv-mega-menu > .wp-block-navigation__submenu-container {
  width: 640px;
  min-width: auto;
  padding: 1.5rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
  left: 50%;
  transform: translateX(-50%) translateY(6px);
  border-radius: 12px;
}

.etv-header__nav .wp-block-navigation-submenu.etv-mega-menu:hover > .wp-block-navigation__submenu-container,
.etv-header__nav .wp-block-navigation-submenu.etv-mega-menu:focus-within > .wp-block-navigation__submenu-container,
.etv-header__nav .wp-block-navigation-submenu.etv-mega-menu.is-submenu-open > .wp-block-navigation__submenu-container {
  transform: translateX(-50%) translateY(0);
}

.etv-header__nav .wp-block-navigation-submenu.etv-mega-menu .wp-block-navigation__submenu-container .wp-block-navigation-item {
  margin: 0;
}

.etv-header__nav .wp-block-navigation-submenu.etv-mega-menu .wp-block-navigation__submenu-container a,
.etv-header__nav .wp-block-navigation-submenu.etv-mega-menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  padding: 0.625rem 1rem;
  border-radius: 6px;
  white-space: normal;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--etv-color-charcoal) !important;
  position: relative;
}

.etv-header__nav .wp-block-navigation-submenu.etv-mega-menu .wp-block-navigation__submenu-container a:hover,
.etv-header__nav .wp-block-navigation-submenu.etv-mega-menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
  background: rgba(201, 169, 110, 0.08);
  color: var(--wp--preset--color--champagne-gold) !important;
}

/* Mega menu featured section */
.etv-mega-menu-featured {
  grid-column: 1 / -1;
  margin-top: 0.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--etv-overlay-mid);
}

.etv-mega-menu-featured a {
  display: flex !important;
  align-items: center;
  gap: 0.75rem;
  font-weight: 600 !important;
  color: var(--wp--preset--color--champagne-gold) !important;
}

.etv-mega-menu-featured a::after {
  content: '→';
  transition: transform var(--etv-transition-base);
}

.etv-mega-menu-featured a:hover::after {
  transform: translateX(4px);
}

/* Mega menu description text */
.etv-mega-desc {
  font-size: 0.6875rem;
  font-weight: 400;
  color: var(--etv-color-charcoal);
  opacity: 0.45;
  display: block;
  margin-top: 0.125rem;
  line-height: 1.4;
}

.etv-header__nav .wp-block-navigation-submenu.etv-mega-menu .wp-block-navigation__submenu-container a:hover .etv-mega-desc {
  opacity: 0.6;
}

/* Mega menu column groups */
.etv-mega-col {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.etv-mega-col-label {
  font-family: var(--etv-font-heading);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wp--preset--color--brushed-steel);
  padding: 0.25rem 1rem 0.5rem;
  margin: 0;
}

/* Responsive mega menu */
@media (max-width: 1023px) {
  .etv-header__nav .wp-block-navigation-submenu.etv-mega-menu > .wp-block-navigation__submenu-container {
    width: 100%;
    grid-template-columns: 1fr;
    padding: 0.5rem 0;
    left: 0;
    transform: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    border: none;
  }

  .etv-mega-menu-featured {
    display: none;
  }

  .etv-mega-desc {
    display: none;
  }

  .etv-mega-col-label {
    padding: 0.5rem 0.75rem 0.25rem;
    font-size: 0.6875rem;
  }
}

/* ============================================
   LANGUAGE SWITCHER — Redesigned
   ============================================ */
.etv-lang-switcher {
  display: flex;
  align-items: center;
  gap: 0;
  opacity: 0;
  animation: etv-fade-header 0.8s ease 0.3s forwards;
  background: var(--etv-overlay-white);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid var(--etv-overlay-white-md);
  border-radius: var(--etv-radius-md);
  padding: 0.125rem;
}

.etv-lang-switcher__item {
  font-family: var(--etv-font-heading);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--etv-color-white);
  opacity: 0.6;
  cursor: pointer;
  transition: all var(--etv-transition-base);
  margin: 0;
  line-height: 1;
  padding: 0.25rem 0.5rem;
  border-radius: var(--etv-radius-sm);
  border: none;
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.etv-lang-switcher__item:hover,
.etv-lang-switcher__item:focus-visible {
  color: var(--etv-color-white);
  opacity: 1;
  background: var(--etv-overlay-white);
}

.etv-lang-switcher__item.is-active {
  color: var(--wp--preset--color--midnight-cobalt);
  background: var(--wp--preset--color--warm-white);
  font-weight: 600;
}

.etv-lang-switcher__divider {
  display: none;
}

/* Scrolled: dark lang switcher */
.etv-header.is-scrolled .etv-lang-switcher {
  background: var(--etv-overlay-light);
  border-color: var(--etv-overlay-glass);
}

.etv-header.is-scrolled .etv-lang-switcher__item {
  color: var(--etv-color-black);
  opacity: 0.5;
}

.etv-header.is-scrolled .etv-lang-switcher__item:hover,
.etv-header.is-scrolled .etv-lang-switcher__item:focus-visible {
  color: var(--etv-color-black);
  opacity: 1;
  background: var(--etv-overlay-light);
}

.etv-header.is-scrolled .etv-lang-switcher__item.is-active {
  color: var(--wp--preset--color--warm-white);
  background: var(--wp--preset--color--midnight-cobalt);
}

/* ============================================
   SERVICE DETAIL PAGE — Section Styles
   ============================================ */

/* Service Hero */
.etv-service-hero {
  position: relative;
  min-height: 70vh;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.etv-service-hero__content {
  position: relative;
  z-index: 2;
  max-width: var(--etv-content-wide);
  margin: 0 auto;
  padding: var(--etv-space-5xl) var(--etv-gutter);
}

.etv-service-hero__eyebrow {
  font-family: var(--etv-font-heading);
  font-size: var(--wp--preset--font-size--caption);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--wp--preset--color--champagne-gold);
  margin-bottom: var(--etv-space-lg);
  display: block;
}

.etv-service-hero__title {
  font-family: var(--etv-font-heading);
  font-size: clamp(2.5rem, 6vw, 5rem);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin-bottom: var(--etv-space-xl);
  color: var(--wp--preset--color--warm-white);
  font-weight: 400;
}

.etv-service-hero__desc {
  font-size: clamp(1rem, 2vw, 1.25rem);
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.8);
  max-width: 36rem;
  margin-bottom: var(--etv-space-2xl);
}

/* Service Process */
.etv-process {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--etv-space-2xl);
  counter-reset: process-step;
}

.etv-process__step {
  counter-increment: process-step;
  padding: var(--etv-space-2xl) var(--etv-space-xl);
  border-top: 2px solid var(--wp--preset--color--champagne-gold);
  position: relative;
}

.etv-process__step::before {
  content: counter(process-step, decimal-leading-zero);
  font-family: var(--etv-font-heading);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--wp--preset--color--champagne-gold);
  display: block;
  margin-bottom: var(--etv-space-md);
}

.etv-process__step h3 {
  font-family: var(--etv-font-heading);
  font-size: 1.375rem;
  line-height: 1.2;
  margin-bottom: var(--etv-space-md);
}

.etv-process__step p {
  font-size: 0.9375rem;
  color: var(--wp--preset--color--concrete-grey-dark);
  line-height: 1.7;
  margin: 0;
}

/* FAQ Accordion */
.etv-faq {
  max-width: var(--etv-content-default);
  margin: 0 auto;
}

.etv-faq__item {
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  padding: var(--etv-space-lg) 0;
}

.etv-faq__question {
  font-family: var(--etv-font-body);
  font-size: 1.0625rem;
  font-weight: 500;
  line-height: 1.4;
  color: var(--wp--preset--color--charcoal);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--etv-space-lg);
  padding: 0;
  margin: 0;
  background: none;
  border: none;
  width: 100%;
  text-align: left;
  transition: color var(--etv-transition-fast);
}

.etv-faq__question:hover {
  color: var(--wp--preset--color--champagne-gold);
}

.etv-faq__question::after {
  content: '+';
  font-size: 1.25rem;
  font-weight: 300;
  color: var(--wp--preset--color--champagne-gold);
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

.etv-faq__item.is-open .etv-faq__question::after {
  transform: rotate(45deg);
}

.etv-faq__answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease, padding 0.4s ease;
  padding: 0;
}

.etv-faq__item.is-open .etv-faq__answer {
  max-height: 300px;
  padding-top: var(--etv-space-lg);
}

.etv-faq__answer p {
  font-size: 0.9375rem;
  color: var(--wp--preset--color--concrete-grey-dark);
  line-height: 1.7;
  margin: 0;
}

/* Materials Grid */
.etv-materials-showcase {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--etv-space-lg);
}

.etv-materials-showcase__item {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1;
  background: var(--wp--preset--color--concrete-grey);
}

.etv-materials-showcase__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s ease;
}

.etv-materials-showcase__item:hover img {
  transform: scale(1.06);
}

.etv-materials-showcase__label {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: var(--etv-space-lg);
  background: linear-gradient(to top, rgba(12, 20, 40, 0.7), transparent);
  color: var(--wp--preset--color--warm-white);
  font-family: var(--etv-font-heading);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.03em;
}

@media (max-width: 1023px) {
  .etv-materials-showcase {
    grid-template-columns: 1fr 1fr;
  }
}

/* Service CTA Banner */
.etv-service-cta {
  background: var(--wp--preset--color--midnight-cobalt);
  padding: var(--etv-space-5xl) var(--etv-gutter);
  text-align: center;
  color: var(--wp--preset--color--warm-white);
}

.etv-service-cta h2 {
  font-family: var(--etv-font-heading);
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height: 1.1;
  color: var(--wp--preset--color--warm-white);
  margin-bottom: var(--etv-space-lg);
}

.etv-service-cta p {
  color: rgba(255, 255, 255, 0.75);
  font-size: 1.125rem;
  line-height: 1.7;
  margin-bottom: var(--etv-space-2xl);
  max-width: 32rem;
  margin-left: auto;
  margin-right: auto;
}

/* ============================================
   SERVICE OVERVIEW PAGE — Enhanced
   ============================================ */
.etv-services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--etv-space-2xl);
}

.etv-services-grid__card {
  padding: var(--etv-space-2xl);
  background: var(--wp--preset--color--pure-white);
  border: 1px solid rgba(0, 0, 0, 0.06);
  transition: all var(--etv-transition-base);
  text-decoration: none;
  color: inherit;
  display: block;
}

.etv-services-grid__card:hover {
  border-color: var(--wp--preset--color--champagne-gold);
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.06);
}

.etv-services-grid__card h3 {
  font-family: var(--etv-font-heading);
  font-size: 1.5rem;
  line-height: 1.2;
  margin-bottom: var(--etv-space-md);
  transition: color var(--etv-transition-fast);
}

.etv-services-grid__card:hover h3 {
  color: var(--wp--preset--color--champagne-gold);
}

.etv-services-grid__card p {
  font-size: 0.9375rem;
  color: var(--wp--preset--color--concrete-grey-dark);
  line-height: 1.7;
  margin: 0;
}

.etv-services-grid__card .etv-services-grid__label {
  font-family: var(--etv-font-heading);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wp--preset--color--brushed-steel);
  margin-bottom: var(--etv-space-md);
  display: block;
}

@media (max-width: 1023px) {
  .etv-services-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 600px) {
  .etv-services-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================
   RESPONSIVE — Tablet refinements
   ============================================ */
@media (max-width: 1023px) {
  .etv-process {
    grid-template-columns: 1fr;
  }

  .etv-process__step {
    padding: var(--etv-space-xl) var(--etv-space-lg);
  }
}

/* ============================================
   Accessibility — Focus improvements
   ============================================ */
.etv-header__nav a:focus-visible,
.etv-header__nav .wp-block-navigation-item__content:focus-visible,
.etv-header__nav .wp-block-navigation-submenu__toggle:focus-visible {
  outline: 2px solid var(--wp--preset--color--champagne-gold);
  outline-offset: 4px;
  border-radius: 2px;
}

.etv-footer a:focus-visible {
  outline: 2px solid var(--wp--preset--color--champagne-gold);
  outline-offset: 2px;
}

/* ============================================
   VERSION 3.0 — Structural Elegance Identity
   Engineering monograms, geometric frames,
   compliance badges, pillar cards
   ============================================ */

/* --------------------------------------------
   Dark Section Base
   -------------------------------------------- */
.etv-section--dark {
  color: var(--wp--preset--color--warm-white);
}

.etv-section--dark h2,
.etv-section--dark h3,
.etv-section--dark h4 {
  color: var(--wp--preset--color--warm-white);
}

/* --------------------------------------------
   Pillar Cards (Engineering Pillars pattern)
   -------------------------------------------- */
.etv-pillar-card {
  transition: transform var(--etv-transition-base), box-shadow var(--etv-transition-base);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.etv-pillar-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.3);
  border-color: var(--wp--preset--color--champagne-gold);
}

/* --------------------------------------------
   The Bridge — Dark Feature Cards
   -------------------------------------------- */
.etv-card {
  border-radius: var(--etv-radius-md);
  transition: transform var(--etv-transition-base), box-shadow var(--etv-transition-base);
  height: 100%;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.etv-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--etv-shadow-lg);
  border-color: var(--wp--preset--color--champagne-gold);
}

/* Ensure card children fill height for consistent alignment */
.etv-card > * {
  margin-top: 0;
}

.etv-card > * + * {
  margin-top: var(--etv-space-md);
}

/* --------------------------------------------
   Technical Note (Gold left border callout)
   -------------------------------------------- */
.etv-technical-note {
  font-size: 0.95rem;
  line-height: 1.7;
}

/* --------------------------------------------
   Compliance Badge
   -------------------------------------------- */
.etv-compliance-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--etv-space-sm);
  padding: var(--etv-space-xs) var(--etv-space-md);
  font-family: var(--etv-font-body);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border: 1px solid var(--wp--preset--color--champagne-gold);
  border-radius: 2px;
  background: transparent;
  line-height: 1;
}

.etv-compliance-badge--dark {
  border-color: rgba(255, 255, 255, 0.2);
  color: var(--wp--preset--color--warm-white);
}

/* --------------------------------------------
   Footer Compliance Seals
   -------------------------------------------- */
.etv-compliance-seals {
  display: flex;
  flex-wrap: wrap;
  gap: var(--etv-space-sm);
  align-items: flex-start;
}

.etv-compliance-seal {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  border-radius: var(--etv-radius-sm);
  line-height: 1;
  transition: transform var(--etv-transition-base), border-color var(--etv-transition-base);
}

.etv-compliance-seal:hover {
  transform: translateY(-2px);
  border-color: var(--wp--preset--color--champagne-gold) !important;
}

/* --------------------------------------------
   Structural Monogram Placeholder
   -------------------------------------------- */
.etv-monogram {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border: 1px solid var(--wp--preset--color--champagne-gold);
  border-radius: 50%;
  font-family: var(--etv-font-heading);
  font-size: 1.5rem;
  color: var(--wp--preset--color--champagne-gold);
  background: transparent;
}

.etv-monogram--small {
  width: 40px;
  height: 40px;
  font-size: 1rem;
}

.etv-monogram--large {
  width: 96px;
  height: 96px;
  font-size: 2.25rem;
}

/* --------------------------------------------
   Geometric Frame (for images)
   -------------------------------------------- */
.etv-geometric-frame {
  position: relative;
}

.etv-geometric-frame::before {
  content: '';
  position: absolute;
  top: 8px;
  left: 8px;
  right: -8px;
  bottom: -8px;
  border: 1px solid var(--wp--preset--color--champagne-gold);
  pointer-events: none;
  z-index: 1;
}

.etv-geometric-frame--inset::before {
  top: -8px;
  left: -8px;
  right: 8px;
  bottom: 8px;
}

/* --------------------------------------------
   Market Bridge — B2B / B2C Dual Path
   -------------------------------------------- */
.etv-market-bridge {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--etv-space-xl);
}

.etv-market-bridge__path {
  padding: var(--etv-space-3xl);
  border: 1px solid rgba(255, 255, 255, 0.1);
  transition: border-color var(--etv-transition-base);
}

.etv-market-bridge__path:hover {
  border-color: var(--wp--preset--color--champagne-gold);
}

.etv-market-bridge__path h3 {
  margin-top: var(--etv-space-lg);
  margin-bottom: var(--etv-space-md);
}

@media (max-width: 1023px) {
  .etv-market-bridge {
    grid-template-columns: 1fr;
  }

  .etv-market-bridge__path {
    padding: var(--etv-space-xl);
  }
}

/* --------------------------------------------
   Competitive Benchmark Table
   -------------------------------------------- */
.etv-benchmark {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--etv-font-body);
  font-size: 0.875rem;
}

.etv-benchmark th,
.etv-benchmark td {
  padding: var(--etv-space-md) var(--etv-space-lg);
  text-align: left;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.etv-benchmark th {
  font-family: var(--etv-font-heading);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: 0.75rem;
  color: var(--wp--preset--color--champagne-gold);
}

.etv-benchmark .etv-benchmark__highlight {
  color: var(--wp--preset--color--champagne-gold);
  font-weight: 600;
}

/* --------------------------------------------
   Cinzel Decorative display text
   -------------------------------------------- */
.etv-display-cinzel {
  font-family: var(--etv-font-cinzel);
  font-weight: 700;
  letter-spacing: 0.04em;
}

/* --------------------------------------------
   Global Delivery / Export Section
   -------------------------------------------- */
.etv-export-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--etv-space-lg);
}

.etv-export-item {
  text-align: center;
  padding: var(--etv-space-lg);
}

.etv-export-item__label {
  font-family: var(--etv-font-heading);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wp--preset--color--champagne-gold);
  margin-top: var(--etv-space-sm);
}

/* ============================================
   HOMEPAGE AUDIT — New Section Components
   (December 2025 redesign)
   ============================================ */

/* --------------------------------------------
   Hero — Larger CTAs for homepage hero
   -------------------------------------------- */
.etv-hero-video .wp-block-button .wp-block-button__link {
  font-size: var(--wp--preset--font-size--small);
  padding: 0.75rem 2rem;
}

.etv-hero-video .wp-block-button.is-style-ghost-light .wp-block-button__link {
  font-size: var(--wp--preset--font-size--small);
  padding: 0.75rem 0;
}

/* --------------------------------------------
   Card Variations — Ghost / Subtle
   -------------------------------------------- */
.etv-card-ghost {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: var(--wp--preset--spacing--60);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--etv-radius-md);
  transition: border-color var(--etv-transition-base), transform var(--etv-transition-base);
}

.etv-card-ghost:hover {
  border-color: var(--wp--preset--color--champagne-gold);
  transform: translateY(-2px);
}

.etv-card-ghost > * + * {
  margin-top: var(--etv-space-md);
}

/* --------------------------------------------
   Grid Wrappers — Consistent spacing
   Shared by: card-grid, pillar-grid, product-grid,
   benchmark-grid, global-grid (Made in Morocco)
   -------------------------------------------- */
.etv-card-grid,
.etv-pillar-grid,
.etv-product-grid,
.etv-benchmark-grid,
.etv-global-grid {
  gap: var(--etv-space-xl);
}

@media (max-width: 1023px) {
  .etv-card-grid,
  .etv-pillar-grid,
  .etv-product-grid,
  .etv-benchmark-grid,
  .etv-global-grid {
    gap: var(--etv-space-lg);
  }
}

/* --------------------------------------------
   Icon List — Technical certification bullets
   -------------------------------------------- */
.etv-icon-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.etv-icon-list li {
  position: relative;
  padding-left: 1.75rem;
  margin-bottom: var(--etv-space-md);
  line-height: 1.6;
}

.etv-icon-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.5em;
  width: 8px;
  height: 8px;
  background: var(--wp--preset--color--champagne-gold);
  border-radius: 1px;
  transform: rotate(45deg);
}

/* --------------------------------------------
   Product Item — Seven Categories grouping
   -------------------------------------------- */
.etv-product-item {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.etv-product-item p {
  margin-top: var(--etv-space-sm);
}

/* --------------------------------------------
   Trust Bar — CTA trust badges
   -------------------------------------------- */
.etv-trust-bar {
  max-width: 800px;
  margin: 0 auto !important;
  gap: var(--etv-space-lg);
}

.etv-trust-bar .wp-block-column {
  padding: var(--etv-space-md);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--etv-radius-sm);
  text-align: center;
}

.etv-trust-bar .wp-block-column:hover {
  border-color: var(--wp--preset--color--champagne-gold);
}

.etv-trust-bar .wp-block-column p {
  margin: 0;
  line-height: 1.5;
}

@media (max-width: 768px) {
  .etv-trust-bar {
    gap: var(--etv-space-sm);
  }
  .etv-trust-bar .wp-block-column {
    padding: var(--etv-space-sm);
  }
}

/* ============================================
   HOMEPAGE TYPOGRAPHY & READABILITY
   Enhances body text, line-height, paragraph
   width limits, and conversion nudges
   ============================================ */

/* Body text readability — smoother reading experience */
.etv-home .has-inter-font-family {
  line-height: 1.7;
}

/* Content paragraphs: clamp body size for readability */
.etv-home p.has-inter-font-family:not([style*="font-size"]) {
  font-size: clamp(1rem, 1.125vw, 1.125rem);
}

/* Small/caption text stays small — prevents unwanted scaling */
.etv-home p:not([style*="font-size"]).has-small-font-size,
.etv-home p:not([style*="font-size"]).has-caption-font-size {
  font-size: inherit;
}

/* Tight spacing between related content (label + value pairs) */
.etv-home .etv-pillar-card p + p,
.etv-home .etv-product-item p + p {
  margin-top: var(--etv-space-xs);
}

/* Conversion: gold accent on CTA-adjacent copy */
.etv-home .etv-cta-phone {
  color: var(--wp--preset--color--champagne-gold);
  font-weight: 600;
  letter-spacing: 0.04em;
}

/* Section end markers — subtle visual closure */
.etv-section--dark + .etv-section--dark {
  border-top: 1px solid rgba(255, 255, 255, 0.04);
}

/* ============================================
   CINEMATIC HERO — Editorial, left-aligned
   65/35 text/negative space split.
   Uses cover block with overlay.
   ============================================ */

/* Hero container: ensure full viewport height */
.etv-hero--cinematic .wp-block-cover__inner-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 100vh;
  padding-bottom: 4rem; /* room for scroll indicator */
}

/* Eyebrow label — gold, small caps */
.etv-hero__eyebrow {
  display: inline-block;
  margin-bottom: var(--etv-space-30);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  opacity: 0.9;
}

/* Hero title — responsive, lightweight */
.etv-hero__title {
  margin-top: 0;
  margin-bottom: var(--etv-space-40);
  word-spacing: 0.06em;
}

/* Hero subtitle — lightweight, generous line-height */
.etv-hero__subtitle {
  margin-top: 0;
  margin-bottom: 0;
}

/* Hero actions — buttons */
.etv-hero__actions {
  margin-top: var(--etv-space-60);
}

/* Mobile: stack hero to full width */
@media (max-width: 768px) {
  .etv-hero--cinematic .wp-block-cover__inner-container {
    padding-bottom: 3rem;
  }

  .etv-hero__title {
    font-size: clamp(2.2rem, 8vw, 3.5rem) !important;
  }

  .etv-hero__subtitle {
    font-size: 0.95rem !important;
    max-width: none !important;
  }

  .etv-hero__actions {
    flex-direction: column;
    align-items: flex-start;
  }

}

/* ============================================
   REFINED HERO — Centered, editorial, premium
   Overrides cinematic hero for centered layout.
   "L'ART DE CONSTRUIRE L'EXCEPTION"
   Content: centered stack, 600–720px wide.
   ============================================ */

/* Overlay: two-tone gradient (cool shadow → warm depth) */
.etv-hero--refined .wp-block-cover__background {
  background: linear-gradient(
    180deg,
    rgba(8,12,20,0.35) 0%,
    rgba(8,12,20,0.55) 100%
  ) !important;
}

/* Content container: centered, editorial width */
.etv-hero--refined .etv-hero__content--centered {
  text-align: center;
  max-width: 720px;
  margin: 0 auto;
}

/* Eyebrow — gold, spacious caps, centered */
.etv-hero--refined .etv-hero__content--centered .etv-hero__eyebrow {
  margin-bottom: 1.5rem;  /* 24px — eyebrow → title */
  letter-spacing: 0.25em;
}

/* Title — lightweight, tight tracking, editorial */
.etv-hero--refined .etv-hero__content--centered .etv-hero__title {
  line-height: 0.98 !important;
  font-weight: 400;
  margin-bottom: 2rem;  /* 32px — title → paragraph */
  max-width: none;
}

/* Subtitle — generous leading, contained width */
.etv-hero--refined .etv-hero__content--centered .etv-hero__subtitle {
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.6 !important;
  margin-bottom: 0;
}

/* Actions container — centered row, 40px from paragraph */
.etv-hero--refined .etv-hero__actions {
  margin-top: 2.5rem;  /* 40px — paragraph → CTA */
  justify-content: center;
  align-items: center;
}

/* Primary CTA — 52px height, 32px padding */
.etv-hero--refined .etv-hero__actions .wp-block-button.is-style-premium-cta .wp-block-button__link {
  min-height: 52px;
  padding: 0 2rem;
  display: inline-flex;
  align-items: center;
  font-size: 0.8125rem;
}

/* Dynamic block titles (post-title, query-title) inside refined hero */
.etv-hero--refined .etv-hero__content--centered .wp-block-post-title,
.etv-hero--refined .etv-hero__content--centered .wp-block-query-title {
  margin-bottom: 2rem;  /* 32px — title → paragraph */
  max-width: none;
}

/* Dynamic block subtitles (post-excerpt, term-description) inside refined hero */
.etv-hero--refined .etv-hero__content--centered .wp-block-post-excerpt,
.etv-hero--refined .etv-hero__content--centered .wp-block-term-description {
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.6;
  margin-bottom: 0;
}

/* Post excerpt text color fix inside dark hero */
.etv-hero--refined .etv-hero__content--centered .wp-block-post-excerpt {
  color: var(--wp--preset--color--warm-white);
}

/* Search block inside refined hero */
.etv-hero--refined .etv-hero__content--centered .wp-block-search {
  margin-top: 2.5rem;
}

/* Secondary text link — underlined, arrow on hover */
.etv-hero__text-link {
  margin: 0;
}

.etv-hero__text-link a {
  color: var(--wp--preset--color--warm-white);
  text-decoration: none;
  font-weight: 500;
  position: relative;
  transition: color var(--etv-transition-base), border-color var(--etv-transition-base);
  padding-bottom: 2px;
  border-bottom: 1px solid rgba(245, 242, 237, 0.3);
  font-size: 1rem;
}

.etv-hero__text-link a::after {
  content: ' →';
  display: inline;
  transition: margin-left var(--etv-transition-fast);
}

.etv-hero__text-link a:hover,
.etv-hero__text-link a:focus-visible {
  border-bottom-color: var(--wp--preset--color--champagne-gold);
  color: var(--wp--preset--color--champagne-gold);
  outline: none;
}

.etv-hero__text-link a:hover::after {
  margin-left: 4px;
}

/* Focus-visible ring for keyboard users */
.etv-hero__text-link a:focus-visible {
  outline: 2px solid var(--wp--preset--color--champagne-gold);
  outline-offset: 4px;
  border-radius: 2px;
}

/* Responsive: Tablet (≤1024px) */
@media (max-width: 1024px) {
  .etv-hero--refined .etv-hero__content--centered .etv-hero__title {
    font-size: clamp(2.5rem, 6vw, 3.5rem) !important;
  }

  .etv-hero--refined .etv-hero__content--centered .etv-hero__subtitle {
    font-size: clamp(0.95rem, 1.5vw, 1.125rem) !important;
  }
}

/* Responsive: Mobile (≤768px) */
@media (max-width: 768px) {
  .etv-hero--refined .etv-hero__content--centered .etv-hero__title {
    font-size: clamp(2rem, 8vw, 2.5rem) !important;
    line-height: 1.0 !important;
  }

  .etv-hero--refined .etv-hero__content--centered .etv-hero__eyebrow {
    font-size: 0.75rem;
    letter-spacing: 0.2em;
    margin-bottom: 1rem;
  }

  .etv-hero--refined .etv-hero__content--centered .etv-hero__subtitle {
    font-size: 0.95rem !important;
    max-width: none !important;
  }

  .etv-hero--refined .etv-hero__actions {
    flex-direction: column;
    align-items: center;
    margin-top: 2rem;
  }

  .etv-hero--refined .etv-hero__actions .wp-block-button.is-style-premium-cta .wp-block-button__link {
    min-height: 48px;
    padding: 0 1.75rem;
  }
}

/* ============================================
   STATS BAR — "By the Numbers"
   4-column credibility metrics on warm-white.
   ============================================ */

.etv-stats-bar {
  gap: var(--etv-space-40) !important;
  text-align: center;
}

.etv-stats-bar .wp-block-column {
  padding: var(--etv-space-30) var(--etv-space-20);
}

.etv-stats-bar h3 {
  margin: 0 0 var(--etv-space-20) 0;
}

.etv-stats-bar p {
  margin: 0;
  line-height: 1.5;
}

/* Vertical divider between stats (desktop) */
@media (min-width: 769px) {
  .etv-stats-bar .wp-block-column:not(:last-child) {
    border-right: 1px solid rgba(12, 20, 40, 0.08);
  }
}

/* Mobile: 2x2 grid */
@media (max-width: 768px) {
  .etv-stats-bar {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: var(--etv-space-40) !important;
  }

  .etv-stats-bar .wp-block-column:not(:last-child) {
    border-right: none;
  }

  .etv-stats-bar .wp-block-column:nth-child(even) {
    border-right: none;
  }

  .etv-stats-bar .wp-block-column:nth-child(odd) {
    border-right: none;
  }
}

/* ============================================
   EXPERTISE GRID — 2×2 editorial cards
   4 engineering pillars with colour-coded borders.
   ============================================ */

.etv-expertise-grid {
  gap: var(--etv-space-40) !important;
}

.etv-expertise-card {
  display: flex;
  flex-direction: column;
  gap: var(--etv-space-30);
  height: 100%;
  border-radius: 0;
  transition: transform var(--etv-transition-base), box-shadow var(--etv-transition-base);
}

.etv-expertise-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--etv-shadow-lg);
}

.etv-expertise-card h3 {
  margin: 0;
}

.etv-expertise-card p {
  margin: 0;
  flex-grow: 1;
}

.etv-expertise-card .wp-block-buttons {
  margin-top: auto;
}

/* Mobile: single column */
@media (max-width: 768px) {
  .etv-expertise-grid {
    gap: var(--etv-space-30) !important;
  }
}

/* ============================================
   PROCESS GRID — "How We Work"
   4-step horizontal editorial timeline.
   ============================================ */

.etv-process-grid {
  gap: var(--etv-space-40) !important;
}

.etv-process-step {
  display: flex;
  flex-direction: column;
  gap: var(--etv-space-20);
  height: 100%;
}

.etv-process-step p {
  margin: 0;
}

.etv-process-step h3 {
  margin: 0;
}

/* Numbered step: large gold numeral */
.etv-process-step p:first-child {
  margin-bottom: var(--etv-space-20);
}

/* Mobile: stack vertically */
@media (max-width: 768px) {
  .etv-process-grid {
    gap: var(--etv-space-50) !important;
  }

  .etv-process-step {
    padding-right: 0 !important;
  }
}

/* ============================================
   MATERIALS CARD — Highlight card with checklist
   ============================================ */

.etv-materials-card {
  display: flex;
  flex-direction: column;
  gap: var(--etv-space-30);
  height: 100%;
  border-radius: 0;
}

.etv-materials-card h3 {
  margin: 0;
}

.etv-materials-card p {
  margin: 0;
}

/* Checklist — clean, checkmark-style list */
.etv-checklist {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--etv-space-20);
}

.etv-checklist li {
  position: relative;
  padding-left: var(--etv-space-40);
  line-height: 1.8;
}

.etv-checklist li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 0.5rem;
  height: 0.25rem;
  border-left: 1.5px solid var(--wp--preset--color--champagne-gold);
  border-bottom: 1.5px solid var(--wp--preset--color--champagne-gold);
  transform: rotate(-45deg);
}

/* Mobile: stack vertically */
@media (max-width: 768px) {
  .etv-materials-card {
    margin-top: var(--etv-space-40);
  }
}

/* ============================================
   CERTIFICATION GRID — Trust & Compliance
   2×2 badge grid on dark background
   ============================================ */

.etv-cert-grid {
  gap: var(--etv-space-20) !important;
}

.etv-cert-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: var(--etv-space-10);
  border-radius: 2px;
  height: 100%;
  transition: all var(--etv-transition-base);
}

.etv-cert-badge:hover {
  background: rgba(255, 255, 255, 0.03);
  transform: translateY(-2px);
}

.etv-cert-badge p {
  margin: 0;
}

/* Mobile: stack certification columns */
@media (max-width: 768px) {
  .etv-cert-grid {
    gap: var(--etv-space-20) !important;
  }
}

/* ============================================
   FINAL CTA — "Let's Build Something Exceptional"
   Centered conversion section with phone.
   ============================================ */

.etv-cta-final {
  text-align: center;
}

.etv-cta-final h2 {
  margin-top: var(--etv-space-40);
  margin-bottom: var(--etv-space-30);
}

.etv-cta-final p {
  margin: 0;
}

.etv-cta-final .wp-block-buttons {
  margin-top: var(--etv-space-60);
  justify-content: center;
}

/* Phone number — gold, prominent */
.etv-cta-phone {
  margin-top: var(--etv-space-50);
}

.etv-cta-phone p {
  margin: 0;
}

.etv-cta-phone .has-champagne-gold-color {
  letter-spacing: 0.08em;
  font-weight: 500;
}

/* Mobile: stack CTA buttons */
@media (max-width: 768px) {
  .etv-cta-final .wp-block-buttons {
    flex-direction: column;
    align-items: center;
  }
}

/* ============================================
   TESTIMONIAL — Editorial quote styling
   Italic, garamond, gold divider, attribution
   ============================================ */

.etv-home .has-garamond-font-family {
  font-family: var(--etv-font-display);
}

/* ============================================
   THE SECTION — "The Thesis" gold separator
   ============================================ */

.is-style-line-gold {
  border: none !important;
  height: 1px !important;
  background: linear-gradient(
    to right,
    transparent,
    var(--wp--preset--color--champagne-gold),
    transparent
  ) !important;
  width: 120px;
  margin: var(--etv-space-60) auto var(--etv-space-50) !important;
}

/* ============================================
   CONTACT FORM — Luxury form styling
   ============================================ */

.etv-contact-form {
  max-width: 700px;
  margin: 0 auto;
}

.etv-form-label {
  display: block;
  font-family: var(--etv-font-ui);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wp--preset--color--brushed-steel);
  margin-bottom: 0.35rem;
}

.etv-form-input {
  width: 100%;
  padding: 0.75rem 1rem;
  font-family: var(--etv-font-body);
  font-size: 0.95rem;
  color: var(--wp--preset--color--charcoal);
  background-color: var(--wp--preset--color--white);
  border: 1px solid var(--wp--preset--color--concrete-grey);
  border-radius: var(--etv-radius-sm);
  transition: border-color var(--etv-transition-fast), box-shadow var(--etv-transition-fast);
  box-sizing: border-box;
}

.etv-form-input:focus {
  outline: none;
  border-color: var(--wp--preset--color--champagne-gold);
  box-shadow: 0 0 0 2px rgba(193, 160, 104, 0.2);
}

.etv-form-input::placeholder {
  color: var(--wp--preset--color--concrete-grey-dark);
  font-weight: 300;
}

.etv-form-select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236d6d6d' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.5rem;
  cursor: pointer;
}

.etv-form-textarea {
  resize: vertical;
  min-height: 120px;
  line-height: 1.6;
}

.etv-form-result {
  font-family: var(--etv-font-body);
  font-size: 0.9rem;
  line-height: 1.5;
  padding: var(--wp--preset--spacing--40);
  margin-bottom: var(--wp--preset--spacing--50);
  border-radius: var(--etv-radius-md);
}

.etv-form-success {
  background-color: var(--wp--preset--color--champagne-gold-alpha);
  border: 1px solid var(--wp--preset--color--champagne-gold);
}

.etv-form-error {
  background-color: rgba(180, 70, 50, 0.08);
  border: 1px solid rgba(180, 70, 50, 0.3);
}

.etv-contact-form__honeypot {
  position: absolute;
  left: -9999px;
  opacity: 0;
}

.etv-contact-form__row {
  gap: var(--wp--preset--spacing--40);
  margin-bottom: var(--wp--preset--spacing--40);
}

.etv-contact-form__field {
  margin-bottom: var(--wp--preset--spacing--40);
}

.etv-contact-form__field--message {
  margin-bottom: var(--wp--preset--spacing--50);
}

.etv-contact-form__submit {
  min-width: 200px;
}

/* Contact details section */
.etv-contact-details {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--etv-space-60);
}

.etv-contact-card {
  padding: var(--etv-space-50);
  background-color: var(--wp--preset--color--warm-white);
  border: 1px solid var(--wp--preset--color--concrete-grey);
  border-radius: var(--etv-radius-md);
}

@media (max-width: 768px) {
  .etv-contact-details {
    grid-template-columns: 1fr;
  }

  .etv-form-input {
    font-size: 16px; /* Prevent iOS zoom */
  }
}