﻿/* ─── RESET ─────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: var(--rmxts1-body-font, 'Almarai', sans-serif); overflow-x: hidden; }
a { text-decoration: none; color: inherit; }
button { background: none; border: none; cursor: pointer; padding: 0; }
img { display: block; border: none; }
svg { display: block; }

/* ─── BANNER ─────────────────────────────────────────────────────────── */
#site-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--banner-bg, var(--rmxts1-accent));
  height: 42px;
  padding: 0 56px;
  position: relative;
}
.banner-text {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--banner-color, #000);
  text-align: center;
}
.banner-close {
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 20px;
  color: var(--banner-color, #000);
  line-height: 1;
  cursor: pointer;
}

/* ─── HEADER ─────────────────────────────────────────────────────────── */
#site-header {
  position: relative;
  z-index: 100;
  background: var(--header-bg, #fff);
  border-top: 1px solid var(--header-color, #000);
  border-bottom: 1px solid var(--header-color, #000);
}

/* header-inner is a full-height flex row — children can stretch to full height */
.header-inner {
  display: flex;
  align-items: stretch;        /* children fill 75px height */
  height: 75px;
  padding: 0 0 0 32px;         /* right padding handled by btn */
}

/* Logo — vertically centred inside stretch container */
.header-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  margin-right: auto;          /* push nav + btn to the right */
}
.logo-boujee {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 45px;
  letter-spacing: -0.05em;
  color: #000;
  line-height: 1;
  text-transform: uppercase;
}
.logo-lemon {
  font-family: 'Pinyon Script', cursive;
  font-size: 30px;
  color: #1d1d1d;
  line-height: 1;
}

/* Logo image variants */
.logo-img--mobile { display: none; }
.logo-img img, .overlay-logo-img img { display: block; }

/* Desktop nav — vertically centred */
.header-nav {
  display: flex;
  align-items: center;
  padding: 0 40px;
}
/* WordPress outputs ul > li > a */
.header-nav .header-nav-list {
  display: flex;
  align-items: center;
  gap: 48px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.header-nav .header-nav-list li { margin: 0; }
.header-nav .header-nav-list li a {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--header-color, #000);
  white-space: nowrap;
  transition: color 0.3s;
}
.header-nav .header-nav-list li a:hover { color: #c5b0a2; }

/* ── + / menu button ──────────────────────────────────────────────── */
.header-menu-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  width: 75px;
  flex-shrink: 0;
  border-left: 1px solid #000;
  cursor: pointer;
}
.header-menu-btn .plus {
  position: relative;
  width: 26px;
  height: 26px;
  flex-shrink: 0;
}
.header-menu-btn .plus::before,
.header-menu-btn .plus::after {
  content: '';
  position: absolute;
  background: #000;
}
.header-menu-btn .plus::before {
  width: 26px;
  height: 2px;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.header-menu-btn .plus::after {
  width: 2px;
  height: 26px;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}

/* ─── OVERLAY MENU ───────────────────────────────────────────────────── */
#overlay-menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background: var(--overlay-bg, #000);
  display: flex;
  flex-direction: column;
  padding: 30px 40px 44px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  overflow-y: auto;
}
#overlay-menu.is-open {
  opacity: 1;
  pointer-events: all;
}

/* Top: logo + close button */
.overlay-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 40px;
  flex-shrink: 0;
}
.overlay-logo-text {
  display: flex;
  align-items: center;
  gap: 10px;
}
.overlay-logo {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 45px;
  letter-spacing: -0.05em;
  color: var(--overlay-color, #fff);
  text-transform: uppercase;
  line-height: 1;
}
.overlay-logo-secondary {
  font-family: 'Pinyon Script', cursive;
  font-size: 30px;
  color: var(--overlay-color, #fff);
  line-height: 1;
}
.overlay-close {
  font-size: 22px;
  color: var(--overlay-color, #fff);
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
}

/* Nav: left border line + links */
.overlay-nav {
  flex: 1;
  border-left: 1.5px solid #555;
  padding-left: 32px;
  display: flex;
  align-items: flex-start;
}
/* WordPress outputs ul > li > a */
.overlay-nav-list {
  display: flex;
  flex-direction: column;
  gap: 36px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.overlay-nav-list li { margin: 0; }
.overlay-nav-list li a {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 30px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--overlay-color, #fff);
  line-height: 1;
  display: block;
  transition: color 0.25s;
}
.overlay-nav-list li a:hover { color: #c5b0a2; }

/* Bottom: FOLLOW US + line + social icons */
.overlay-bottom {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 48px;
  flex-shrink: 0;
}
.overlay-follow {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--overlay-color, #fff);
  white-space: nowrap;
}
.overlay-line {
  flex: 1;
  height: 1.5px;
  background: #555;
  min-width: 30px;
}
.overlay-socials {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}
.overlay-socials a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
}
.overlay-socials a svg {
  width: 22px;
  height: 22px;
  fill: var(--overlay-social-clr, var(--rmxts1-accent));
  display: block;
}

/* ─── FOOTER ─────────────────────────────────────────────────────────── */
#site-footer {
  background: var(--footer-bg, #000);
  color: var(--footer-text, #fff);
}

/* Main three-column section */
.footer-main {
  display: flex;
  align-items: flex-start;
  padding: 56px 140px 56px 80px;
}

/* Left: brand */
.footer-brand { flex: 0 0 220px; margin-right: 140px; }
.footer-logo {
  display: block;
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 48px;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: #fff;
  line-height: 1;
  margin-bottom: 12px;
}
.footer-sub-text {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.55;
  color: #fff;
  margin-bottom: 26px;
}
.footer-sub-text strong {
  font-weight: 700;
  color: #fff;
}
.footer-sub-btn {
  display: block;
  width: 180px;
  background: var(--footer-accent, var(--rmxts1-accent));
  color: #000;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 15px 0;
  text-align: center;
  border: none;
  cursor: pointer;
  line-height: 1;
}
.footer-sub-btn:hover { filter: brightness(0.92); }

/* Middle: nav */
.footer-nav {
  flex: 0 0 auto;
  display: flex;
  gap: 80px;
  margin-right: auto; /* fills remaining space, pushing social to the right */
}
.footer-nav-col {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.footer-nav-col a {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #fff;
  transition: color 0.2s;
}
.footer-nav-col a:hover { color: #c5b0a2; }

/* Right: social */
.footer-social {
  flex: 0 0 200px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.footer-stay {
  font-family: 'Pinyon Script', cursive;
  font-size: 38px;
  color: #fff;
  line-height: 1.2;
  margin-bottom: 18px;
}
.footer-socials {
  display: flex;
  align-items: center;
  gap: 22px;
  margin-bottom: 26px;
}
.footer-socials a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
}
.footer-socials a svg {
  width: 26px;
  height: 26px;
  fill: #fff;
  display: block;
}
.footer-contact {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #fff;
  transition: color 0.2s;
}
.footer-contact:hover { color: #c5b0a2; }

/* Photo strip — gap:6px + dark background = visible separators between images */
.footer-photos {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  background: #000;
  border-top: 1px solid var(--footer-border, #ffffff);
  border-bottom: 1px solid var(--footer-border, #ffffff);
  padding: 20px 0;
}
.footer-photo {
  width: 100%;
  height: 215px;
  object-fit: cover;
  display: block;
}

/* Bottom bar — grid keeps arrow exactly centered regardless of side-text widths */
.footer-bottom {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 16px 40px;
}
.footer-copyright {
  font-family: 'Roboto', sans-serif;
  font-size: 11px;
  font-weight: 400;
  color: #fff;
  letter-spacing: 0.02em;
}
.footer-scroll-top {
  font-size: 22px;
  color: var(--footer-accent, var(--rmxts1-accent));
  background: none;
  border: none;
  cursor: pointer;
  line-height: 1;
  padding: 4px 12px;
  transition: opacity 0.2s;
}
.footer-scroll-top:hover { opacity: 0.7; }
.footer-site-credit {
  font-family: 'Roboto', sans-serif;
  font-size: 11px;
  font-weight: 400;
  color: #fff;
  letter-spacing: 0.02em;
  text-align: right;
  transition: color 0.2s;
}
.footer-site-credit:hover { color: #fff; }

/* ─── SUBSCRIBE POPUP ────────────────────────────────────────────────── */
#subscribe-popup {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(860px, 94vw);
  height: min(520px, 90vh);
  display: flex;
  background: var(--popup-bg, var(--rmxts1-accent));
  z-index: 10000;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
#subscribe-popup.is-open {
  opacity: 1;
  pointer-events: all;
  visibility: visible;
}
#subscribe-bg {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  z-index: 9999;
  display: none;
}
#subscribe-bg.is-active { display: block; }

/* × close — top-right, matches reference size */
.subscribe-close {
  position: absolute;
  top: 20px;
  right: 24px;
  font-size: 32px;
  font-weight: 300;
  color: #000;
  background: none;
  border: none;
  cursor: pointer;
  line-height: 1;
  z-index: 2;
  transition: opacity 0.2s;
}
.subscribe-close:hover { opacity: 0.5; }

/* Left: image sits inside yellow gap (padding shows yellow around the photo) */
.subscribe-left {
  width: 45%;
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  align-self: stretch;
  padding: 36px 0 36px 36px;
}
.subscribe-img {
  flex: 1;
  min-width: 0;
  object-fit: cover;
  filter: grayscale(100%);
  display: block;
}
.subscribe-vert {
  width: 32px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #000;
  white-space: nowrap;
  overflow: hidden;
}

/* Right: content — top aligned, matches reference */
.subscribe-right {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
  padding: 52px 48px 40px;
}
.subscribe-heading {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 46px;
  color: #000;
  line-height: 1.1;
  margin-bottom: 22px;
}
.subscribe-body {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: #000;
  line-height: 1.6;
  max-width: 340px;
  text-align: center;
}

/* ─── TABLET / SMALL LAPTOP (768px – 1099px) ────────────────────────── */
@media (min-width: 768px) and (max-width: 1099px) {

  /* Header: drop desktop nav, keep logo + hamburger */
  .header-nav { display: none; }
  .header-inner { padding: 0 0 0 24px; }

  /* Footer: brand takes full width on its own row; nav + social share next row */
  .footer-main {
    flex-wrap: wrap;
    padding: 48px 40px;
    row-gap: 44px;
    column-gap: 0;
  }
  .footer-brand {
    flex: 0 0 100%;
    margin-right: 0;
  }
  .footer-nav {
    flex: 1;
    gap: 48px;
    margin-right: auto;
  }
  .footer-social {
    flex: 0 0 auto;
  }
  .footer-stay { font-size: 32px; }

  /* Photo strip stays 7-column grid on tablet */
  .footer-photo { height: 160px; }

  /* Subscribe popup: stays side-by-side but a bit narrower */
  #subscribe-popup { width: min(94vw, 720px); }
}

/* ─── MOBILE (≤ 767px) ───────────────────────────────────────────────── */
@media (max-width: 767px) {
  /* Banner */
  #site-banner { height: 36px; padding: 0 48px; }
  .banner-text { font-size: 10.5px; letter-spacing: 0.06em; }
  .banner-close { right: 16px; font-size: 17px; }

  /* Header */
  .header-inner { height: 68px; padding: 0 0 0 16px; }
  .logo-boujee { font-size: 36px; }
  .logo-lemon  { font-size: 22px; }

  /* Hide desktop nav on mobile */
  .header-nav { display: none; }

  /* Keep + button but without big width */
  .header-menu-btn { width: 60px; }

  /* Logo image responsive switching */
  .logo-img--desktop { display: none; }
  .logo-img--mobile  { display: block; }

  /* Overlay adjustments */
  #overlay-menu { padding: 24px 24px 36px; }
  .overlay-logo  { font-size: 32px; }
  .overlay-nav-list li a { font-size: 22px; }
  .overlay-nav-list { gap: 28px; }
  .overlay-bottom { margin-top: 36px; }
  .overlay-socials a svg { width: 20px; height: 20px; }

  /* Footer */
  .footer-main {
    flex-direction: column;
    justify-content: flex-start;
    padding: 48px 28px 52px;
    gap: 52px;
  }
  .footer-brand { flex: none; width: 100%; max-width: 100%; }
  .footer-logo { font-size: 64px; letter-spacing: -0.05em; margin-bottom: 16px; }
  .footer-sub-text { font-size: 20px; line-height: 1.5; margin-bottom: 32px; }
  .footer-sub-btn { width: 220px; padding: 17px 0; font-size: 14px; }
  .footer-nav { gap: 48px; }
  .footer-nav-col { gap: 30px; }
  .footer-nav-col a { font-size: 15px; letter-spacing: 0.05em; }
  .footer-social { flex: none; width: 100%; }
  .footer-stay { font-size: 42px; margin-bottom: 24px; }
  .footer-socials { gap: 32px; margin-bottom: 32px; }
  .footer-socials a { width: 40px; height: 40px; }
  .footer-socials a svg { width: 36px; height: 36px; }
  .footer-contact { font-size: 15px; letter-spacing: 0.05em; }

  /* Photo strip: 2 images visible, swipe horizontally — footer itself never scrolls */
  .footer-photos {
    display: flex;
    grid-template-columns: unset;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    scroll-padding: 0;
    touch-action: pan-x;
  }
  .footer-photos::-webkit-scrollbar { display: none; }
  .footer-photo {
    flex: 0 0 calc(50% - 1px);
    min-width: calc(50% - 1px);
    height: 200px;
    scroll-snap-align: start;
  }

  /* Bottom bar */
  .footer-bottom { padding: 14px 20px; grid-template-columns: 1fr auto 1fr; }
  .footer-copyright { font-size: 10.5px; }
  .footer-site-credit { font-size: 10.5px; }

  /* Subscribe popup: stack vertically */
  #subscribe-popup {
    flex-direction: column;
    height: min(90vh, 580px);
    width: min(94vw, 440px);
  }
  .subscribe-left { width: 100%; height: 220px; }
  .subscribe-vert { display: none; }
  .subscribe-right { padding: 32px 28px; justify-content: center; align-items: center; text-align: center; }
  .subscribe-heading { font-size: 30px; margin-bottom: 14px; }
  .subscribe-body { font-size: 14px; text-align: center; }
}

/* ─── HOME TABS — MISSION/VISION/VALUES (Section 4) ─────────────────────── */

.home-tabs { background: #fff; border-bottom: 1px solid #000; }

/* ══ DESKTOP ══ */
.htabs-mobile { display: none; }
.htabs-desktop {
  display: flex;
  height: 721px;          /* JSON block height */
}

/* Image col — 40% */
.htabs-img-col {
  width: 40%;
  flex-shrink: 0;
  position: relative;
}
.htabs-img {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.6s;
}
.htabs-img.is-active { opacity: 1; }
.htabs-img img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Main zone — right of image, position:relative for absolute children */
.htabs-main {
  flex: 1;
  position: relative;
  border-left: 1px solid #000;   /* divider at x:437 (tabs_view-1_13) */
}

/* Active label — JSON: center x:471.5 = 34.5px from main left; center y:450 */
.htabs-active-label {
  position: absolute;
  left: 34px;
  top: 450px;
  transform: translate(-50%, -50%) rotate(-90deg);
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0;         /* st-d-subheading: letter-spacing:0em */
  text-transform: uppercase;
  color: #000;
  white-space: nowrap;
  pointer-events: none;
}

/* Content panels — JSON: x:550=113px from main left, y:169, w:435 */
.htabs-panel {
  position: absolute;
  top: 300px;
  left: 113px;
  width: 435px;
  opacity: 0;
  transition: opacity 0.5s;
  pointer-events: none;
}
.htabs-panel.is-active { opacity: 1; pointer-events: auto; }

/* Shared typography — exact values from Showit global CSS */
.htabs-heading {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 40px;
  line-height: 1.1;
  letter-spacing: -0.05em;   /* st-d-heading */
  text-transform: uppercase;
  color: rgba(29,29,29,1);   /* st-d-heading color */
  margin: 0;
}
.htabs-heading b { font-weight: 700; }
.htabs-subtitle {
  font-family: 'Almarai', sans-serif;
  font-weight: 700;
  font-size: 27px;
  line-height: 1.1;          /* tabs_view-1_9-text */
  letter-spacing: 0;
  color: #000;
  margin: 38px 0 0;
}
.htabs-body {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.5;          /* st-d-paragraph */
  letter-spacing: 0;
  text-align: justify;       /* st-d-paragraph */
  color: #000;
  margin: 42px 0 0;
}

/* Sidebar — JSON: 49px (VISION) + 52px (VALUES) = 101px total, pinned right */
.htabs-sidebar {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 101px;
  border-left: 1px solid #000;
  display: flex;
}
.htabs-tab-btn {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 16px 0 40px;       /* + icon at top:16px (JSON y:16), label at bottom */
  background: none;
  border: none;
  border-left: 1px solid #000;
  cursor: pointer;
}
.htabs-tab-btn:first-child { border-left: none; }
.htabs-tab-btn.is-active { display: none; }
.htabs-tab-btn:hover .htabs-tab-label { opacity: 0.65; }

.htabs-plus-icon { width: 24px; height: 24px; color: #000; }

.htabs-tab-label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;           /* st-d-subheading: 14px */
  letter-spacing: 0;         /* st-d-subheading: 0em */
  text-transform: uppercase;
  color: #000;
  white-space: nowrap;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

/* ══ MOBILE ══ */
@media (max-width: 767px) {
  .htabs-desktop { display: none; }
  .htabs-mobile  { display: block; }

  /* Image — JSON m: w:327 h:285, full width */
  .htabs-m-img-col {
    position: relative;
    width: 100%;
    height: 285px;
  }
  .htabs-m-img-col .htabs-img { position: absolute; inset: 0; }

  /* Accordion items */
  .htabs-m-tab {
    border-top: 1px solid #000;
  }
  .htabs-m-tab-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 14px 23px;   /* JSON m left:23 */
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
  }
  .htabs-m-tab-name {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;         /* st-d-subheading: 14px */
    letter-spacing: 0;
    text-transform: uppercase;
    color: #000;
  }
  .htabs-m-tab-header .htabs-plus-icon { width: 20px; height: 20px; flex-shrink: 0; }

  /* Content area — hidden by default */
  .htabs-m-tab-content {
    display: none;
    padding: 0 23px 40px;
  }
  .htabs-m-tab.is-active .htabs-m-tab-content { display: block; }

  /* Mobile typography — exact JSON m values */
  .htabs-heading { font-size: 25px; line-height: 1.1; letter-spacing: -0.05em; color: #000; }
  .htabs-subtitle { font-size: 22px; line-height: 1.1; letter-spacing: 0; margin-top: 20px; }
  .htabs-body { font-size: 14px; line-height: 1.5; letter-spacing: 0.03em; text-align: justify; margin-top: 16px; }
}

/* ── Tabs: tablet — keep desktop layout with fixed height ── */
@media (min-width: 768px) and (max-width: 1099px) {
  .htabs-desktop { height: 560px; }
  .htabs-panel { top: 230px; left: 60px; width: auto; right: 110px; }
  .htabs-active-label { top: 350px; left: 34px; }
  .htabs-heading  { font-size: 28px; }
  .htabs-subtitle { font-size: 18px; margin-top: 20px; }
  .htabs-body     { font-size: 13px; margin-top: 16px; }
}

/* ─── HOME SERVICES LIST (Section 5) ────────────────────────────────────── */
/* JSON: bg var(--rmxts1-accent), h:627px desktop / 567px mobile */

.home-services-list {
  background: var(--rmxts1-accent, var(--rmxts1-accent));
  color: #000;
}
.hsvs-wrap {
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-bottom: 44px;
}

/* Label — JSON services_14: y:24, x:77, st-d-subheading */
.hsvs-label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #000;
  margin: 0;
  padding: 44px 77px 0;
  line-height: 1;
}

.hsvs-list {
  list-style: none;
  margin: 44px 0 0;
  padding: 0;
  width: 100%;
}
.hsvs-row { border-top: 1px solid #000; }

.hsvs-row-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 26px 77px;
  text-decoration: none;
  color: #000;
  transition: color 0.5s;
}

/* Rows 1 & 3 — JSON: Almarai 400 45px. Hover → Oswald 600 underline */
.hsvs-row:nth-child(odd) .hsvs-name {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
}
.hsvs-row:nth-child(odd) .hsvs-row-link:hover .hsvs-name {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  text-decoration: underline;
}

/* Rows 2 & 4 — JSON: no font specified (uses Oswald 600 default in Showit). Hover → white */
.hsvs-row:nth-child(even) .hsvs-name {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
}
.hsvs-row:nth-child(even) .hsvs-row-link:hover { color: #fff; }

.hsvs-name {
  font-size: 45px;
  line-height: 1;
  letter-spacing: 0;
  color: inherit;
  text-transform: uppercase;
}

/* Arrow icon — JSON w:33 h:37, ↗ diagonal */
.hsvs-arrow-icon {
  width: 33px;
  height: 37px;
  flex-shrink: 0;
  color: inherit;
}

.hsvs-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 44px;
  margin-left: 96px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: uppercase;
  text-decoration: none;
  color: #000;
  transition: color 0.5s;
}
.hsvs-cta:hover { color: rgba(197,176,162,1); }
.hsvs-cta .hsvs-arrow-icon { width: 20px; height: 20px; }

/* ── Mobile — JSON m h:567 ── */
@media (max-width: 767px) {
  .home-services-list { height: auto; min-height: 567px; }
  .hsvs-wrap { padding: 0; }
  .hsvs-label { text-align: right; padding: 21px 16px 0; }
  .hsvs-row-link { padding: 10px 16px; }
  .hsvs-list { margin-top: 55px; }
  /* JSON m: services_13 26px, services_10 30px, services_7 26px, services_4 30px */
  .hsvs-row:nth-child(odd) .hsvs-name  { font-size: 26px; line-height: 1.3; }
  .hsvs-row:nth-child(even) .hsvs-name { font-size: 30px; line-height: 1.3; }
  .hsvs-arrow-icon { width: 24px; height: 28px; }
  .hsvs-cta { margin-left: 16px; margin-top: 30px; }
}

/* ── Services List: tablet ── */
@media (min-width: 768px) and (max-width: 1099px) {
  .hsvs-label { padding: 32px 40px 0; }
  .hsvs-row-link { padding: 18px 40px; }
  .hsvs-name { font-size: 32px; }
  .hsvs-cta { margin-left: 54px; }
}

/* ─── HOME TWO-COLUMN-IMAGES (Section 6) ────────────────────────────────── */

.home-twocol {
  background: #000;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}
.htc-inner {
  display: flex;
  height: 602px;
}
.htc-col {
  flex: 0 0 50%;
  position: relative;
  overflow: hidden;
}
.htc-col--left  { border-right: 1px solid #000; }
.htc-img-wrap {
  display: block;
  width: 100%;
  height: 100%;
}
.htc-img {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: 50% 50%;
  opacity: 1;
  transition: opacity 0.5s;
}
.htc-img-wrap:hover .htc-img { opacity: 0.4; }

@media (max-width: 767px) {
  .home-twocol { background: rgba(255,252,248,1); border-top: none; }
  .htc-inner { flex-direction: column; height: 650px; }
  .htc-col { flex: 0 0 325px; }
  .htc-col--left { border-right: none; border-bottom: 1px solid #000; }
}

/* ── Two-col images: tablet ── */
@media (min-width: 768px) and (max-width: 1099px) {
  .htc-inner { height: 420px; }
}

/* ─── HOME LOGOS (Section 7) ────────────────────────────────────────────── */

.home-logos {
  background: #fff;
  border-bottom: 1px solid #000;
}
.hlog-row {
  display: flex;
  align-items: center;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  cursor: grab;
  padding: 46px 0;
  gap: 0;
}
.hlog-row::-webkit-scrollbar { display: none; }
.hlog-row.is-dragging { cursor: grabbing; user-select: none; }
.hlog-item {
  flex: 0 0 25%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 30px;
}
.hlog-item img {
  max-height: 52px;
  width: auto;
  display: block;
  object-fit: contain;
  pointer-events: none;
}

@media (max-width: 767px) {
  .hlog-row { padding: 36px 0; }
  .hlog-item { flex: 0 0 50%; padding: 0 20px; }
  .hlog-item img { max-height: 38px; }
}

/* ── Logos: tablet ── */
@media (min-width: 768px) and (max-width: 1099px) {
  .hlog-item { flex: 0 0 33.333%; }
}

/* ─── HOME TESTIMONIALS (Section 8) ─────────────────────────────────────── */

.home-testimonials {
  background: #000;
  min-height: 762px;
  overflow: hidden;
}
.htst-inner {
  max-width: 1200px;
  margin: 0 auto;
  height: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 102px;
}
/* Title — JSON: Oswald 600 65px, letter-spacing:-0.05em (inherits st-d-title) */
.htst-title {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 65px;
  letter-spacing: -0.05em;
  color: #fff;
  text-align: center;
  text-transform: uppercase;
  line-height: 1;
  margin: 0;
  padding-top: 102px;
}
.htst-slider-wrap {
  position: relative;
  width: 100%;
  flex: 1;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 40px;
}
/* Arrows — JSON w:53 h:52, yellow var(--rmxts1-accent), hover white, centered vertically */
.htst-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 53px;
  height: 52px;
  color: var(--rmxts1-accent, var(--rmxts1-accent));
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  transition: color 0.5s;
  z-index: 2;
  flex-shrink: 0;
}
.htst-arrow:hover { color: #fff; }
.htst-arrow--prev { left: 0; }
.htst-arrow--next { right: 0; }
.htst-arrow svg { width: 100%; height: 100%; }
/* Track — fixed min-height prevents section jump between short and long slides */
.htst-track { width: 573px; min-height: 380px; }
.htst-slide {
  display: none;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.htst-slide.is-active { display: flex; }
/* Open quote — JSON fill:rgba(239,234,230,1), w:154 h:86 */
.htst-open-quote {
  display: block;
  font-family: Georgia, serif;
  font-size: 120px;
  line-height: 0.6;
  color: rgba(239,234,230,1);
  margin-bottom: 20px;
}
/* Photo — JSON w:153 h:162, bg-pos 20% 20% */
.htst-photo {
  width: 153px;
  height: 162px;
  overflow: hidden;
  margin-bottom: 24px;
}
.htst-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 20% 20%;
}
/* Quote — JSON font-size:34px, Oswald 400/600, uppercase, line-height:1.4 */
.htst-quote {
  font-family: 'Oswald', sans-serif;
  font-weight: 400;
  font-size: 34px;
  line-height: 1.4;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: #fff;
  margin: 0 0 24px;
}
.htst-quote strong { font-weight: 600; }
/* Body — JSON font-size:18px, Almarai 400, line-height:1.7 */
.htst-body {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.7;
  color: #fff;
  margin: 0 0 32px;
}
/* Author — JSON Roboto 700 14px uppercase white */
.htst-author {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #fff;
  margin: 0;
}

/* Mobile arrows row — hidden on desktop */
.htst-arrows-m {
  display: none;
}

/* ── Mobile ── */
@media (max-width: 767px) {
  .home-testimonials { min-height: 0; padding-bottom: 80px; }
  .htst-inner { padding-bottom: 0; }
  .htst-title { font-size: 38px; padding-top: 70px; }
  .htst-slider-wrap { padding-top: 20px; }
  /* Hide desktop absolute arrows on mobile */
  .htst-arrow { display: none; }
  .htst-track { width: calc(100% - 48px); }
  .htst-open-quote { font-size: 80px; }
  .htst-quote { font-size: 24px; }
  .htst-body { font-size: 16px; }
  /* Mobile arrows: visible row, centered, below content */
  .htst-arrows-m {
    display: flex;
    justify-content: center;
    gap: 24px;
    margin-top: 36px;
  }
  .htst-arrow-m {
    width: 50px;
    height: 50px;
    color: var(--rmxts1-accent, var(--rmxts1-accent));
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    transition: color 0.5s;
  }
  .htst-arrow-m:hover { color: #fff; }
  .htst-arrow-m svg { width: 100%; height: 100%; }
}

/* ── Testimonials: tablet ── */
@media (min-width: 768px) and (max-width: 1099px) {
  .home-testimonials { min-height: 0; padding-bottom: 80px; }
  .htst-inner { padding-bottom: 0; }
  .htst-title { font-size: 48px; padding-top: 70px; }
  .htst-track { width: calc(100% - 140px); min-height: 320px; }
  .htst-quote { font-size: 26px; }
  .htst-body  { font-size: 16px; }
}

/* ─── HOME MEET THE FOUNDER (Section 9) ─────────────────────────────────── */

/* JSON: white bg, d h:706px, m h:996px */
.home-meet-founder {
  background: #fff;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}
.hmtf-inner {
  display: flex;
  height: 706px;
}

/* Left col: ~57.8% of 1200px canvas (x:0 to x:694) */
.hmtf-text {
  flex: 0 0 57.8%;
  padding: 26px 60px 40px 200px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid #000;
  position: relative;
}

/* Label _10 — x:39 y:26, Roboto 700 14px uppercase */
.hmtf-label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #000;
  margin: 0;
}

/* Star icon _9 — x:50 y:89 w:61 h:55 */
.hmtf-star {
  display: block;
  width: 44px;
  height: 40px;
  margin-top: 40px;              /* y:89 - y:26 - label ~14px = ~49px */
}
.hmtf-star-icon { width: 100%; height: 100%; }

/* Heading _8 — x:126 y:157, Almarai 400 40px uppercase line-height:1.1 letter-spacing:-0.05em */
.hmtf-heading {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 40px;
  line-height: 1.1;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: rgba(29,29,29,1);
  margin: 28px 0 0;
  padding-left: 87px;            /* x:126 - x:39 = 87px indent */
}
.hmtf-heading strong {
  font-weight: 700;
}

/* Subtitle _7 — x:126 y:315, Almarai 700 27px line-height:1.1 (NOT uppercase) */
.hmtf-subtitle {
  font-family: 'Almarai', sans-serif;
  font-weight: 700;
  font-size: 27px;
  line-height: 1.1;
  letter-spacing: 0;
  color: #000;
  margin: 26px 0 0;
  padding-left: 87px;
}

/* Body _6 — x:126 y:411, Almarai 400 15px line-height:1.5 */
.hmtf-body {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.5;
  letter-spacing: 0;
  color: #000;
  margin: 22px 0 0;
  padding-left: 87px;
  max-width: 414px;
}

/* CTA _5+_4 — x:127 y:580, Roboto 700 13px, horizontal → arrow */
.hmtf-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: auto;
  padding-left: 87px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0;
  text-transform: uppercase;
  text-decoration: none;
  color: #000;
  transition: color 0.5s;
}
.hmtf-cta:hover { color: rgba(197,176,162,1); }
.hmtf-arrow-icon { width: 33px; height: 20px; flex-shrink: 0; }

/* Right image col — x:694 w:505 h:706, gs:{"s":50} */
.hmtf-img-col {
  flex: 1;
  overflow: hidden;
}
.hmtf-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  filter: grayscale(50%);
  display: block;
}

/* ── Mobile — JSON m h:996px ── */
@media (max-width: 767px) {
  .home-meet-founder { border-top: none; }
  .hmtf-inner { flex-direction: column; height: auto; }
  /* Image at top: m x:-1 y:-1 w:323 h:352 → full viewport width */
  .hmtf-img-col { width: 100%; height: 352px; flex: none; order: -1; }
  .hmtf-text {
    flex: none;
    border-right: none;
    border-top: 1px solid #000;
    padding: 20px 22px 50px 22px;
  }
  /* On mobile label and icon are side by side, icon on right */
  .hmtf-label { font-size: 14px; }
  .hmtf-star { margin-top: 8px; width: 36px; height: 32px; }
  /* All indented elements: remove padding-left on mobile (full width text) */
  .hmtf-heading { padding-left: 0; font-size: 40px; margin-top: 20px; }
  .hmtf-subtitle { padding-left: 0; font-size: 22px; margin-top: 16px; }
  .hmtf-body { padding-left: 0; font-size: 14px; margin-top: 16px; max-width: 100%; }
  .hmtf-cta { padding-left: 0; margin-top: 32px; }
}

/* ── Meet the Founder: tablet ── */
@media (min-width: 768px) and (max-width: 1099px) {
  .hmtf-inner { height: auto; min-height: 520px; }
  .hmtf-text { padding: 26px 30px 40px 40px; }
  .hmtf-heading  { padding-left: 0; font-size: 30px; }
  .hmtf-subtitle { padding-left: 0; font-size: 20px; }
  .hmtf-body     { padding-left: 0; max-width: 100%; font-size: 14px; }
  .hmtf-cta      { padding-left: 0; }
}

/* ─── HOME CALL-TO-ACTION FREEBIE (Section 10) ──────────────────────────── */

/* bg image + dark overlay 25% opacity + parallax */
.home-cta-freebie {
  position: relative;
  height: 649px;
  background-color: #000;
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;   /* parallax */
  overflow: hidden;
}
.home-cta-freebie::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.75);  /* bgOpacity:25 → overlay 75% dark */
  z-index: 0;
}
.hcta-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  height: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

/* Left phone column — JSON: _6 frame x:167 w:344, left zone x:0 to x:511 */
.hcta-phone {
  flex: 0 0 42.6%;
  position: relative;
  height: 100%;
}
/* Frame wrap = _6 dimensions: w:344 h:506, positioned at x:167 y:72 within column */
.hcta-phone-wrap {
  position: absolute;
  left: 167px;       /* JSON _6 x:167 */
  top: 72px;         /* JSON _6 y:72 */
  width: 344px;      /* JSON _6 w:344 */
  height: 506px;     /* JSON _6 h:506 */
}
/* _7 screen photo: offset inside frame: left=87 top=73, w:169 h:358 — above frame */
.hcta-phone-screen {
  position: absolute;
  left: 87px;
  top: 73px;
  width: 169px;
  height: 358px;
  object-fit: cover;
  border-radius: 17px;
  filter: grayscale(50%);
  z-index: 2;
}
/* _8 top phone bar: left=126 top=62, w:91 h:21 — on top of screen */
.hcta-phone-bar {
  position: absolute;
  left: 126px;
  top: 62px;
  width: 91px;
  height: 21px;
  object-fit: contain;
  z-index: 3;
}
/* _6 frame PNG: fills wrap, behind screen so outline shows around edges */
.hcta-phone-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(2px 2px 5px rgba(0,0,0,0.5));
  z-index: 1;
}

/* Right text column — JSON: x:511 → right 57.5% */
.hcta-text {
  flex: 1;
  padding-left: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0;
}

/* _5 label — white, Roboto 700 14px uppercase */
.hcta-label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #fff;
  margin: 0 0 26px;
}

/* _4 heading — white, 56px, Oswald 600 uppercase */
.hcta-heading {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 56px;
  line-height: 1.0;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: #fff;
  margin: 0 0 26px;
  max-width: 541px;
}

/* _3 body — white, Almarai 400 27px line-height:1.3 */
.hcta-body {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 27px;
  line-height: 1.3;
  letter-spacing: 0;
  color: #fff;
  margin: 0 0 36px;
  max-width: 640px;
}

/* _0+_2+_1 CTA button — yellow var(--rmxts1-accent), 2px solid #000, 13px */
.hcta-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--rmxts1-accent, var(--rmxts1-accent));
  border: 2px solid #000;
  padding: 0 20px;
  height: 44px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0;
  text-transform: uppercase;
  text-decoration: none;
  color: #000;
  transition: background 0.3s;
  width: fit-content;
}
.hcta-btn:hover { background: #fff; }
.hcta-arrow-icon { width: 28px; height: 20px; flex-shrink: 0; }

/* ── CTA Freebie: tablet — scale phone down, center in column ── */
@media (min-width: 768px) and (max-width: 1099px) {
  .hcta-phone { flex: 0 0 40%; }
  .hcta-phone-wrap {
    width: 240px;
    height: 353px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }
  .hcta-phone-screen {
    left: 61px;
    top: 51px;
    width: 118px;
    height: 250px;
  }
  .hcta-phone-bar { left: 88px; top: 43px; width: 64px; height: 15px; }
  .hcta-heading { font-size: 40px; max-width: 100%; }
  .hcta-body    { font-size: 20px; max-width: 100%; }
  .hcta-text    { padding-left: 16px; }
}

/* ── Mobile — JSON m h:833, bg sedona-508.jpg, bgOpacity:30 ── */
@media (max-width: 767px) {
  .home-cta-freebie {
    height: 833px;
    background-attachment: scroll;  /* no fixed parallax on mobile */
  }
  .hcta-inner {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 0 0 40px;
    max-width: 100%;
  }
  /* Phone at top — right-aligned on mobile */
  .hcta-phone {
    flex: none;
    width: 100%;
    height: 370px;
    overflow: visible;
    display: flex;
    justify-content: flex-start;
  }
  /* Mobile wrap = frame dimensions */
  .hcta-phone-wrap {
    width: 236px;   /* _6 m: w:236 */
    height: 349px;  /* _6 m: h:349 */
    margin-left: 31px;
    margin-top: 50px;
    top: auto;
    left: auto;
  }
  /* Mobile screen: scale offsets proportionally (87/344*236=60, 73/506*349=50) */
  .hcta-phone-screen {
    left: 60px;
    top: 50px;
    width: 116px;  /* 169/344*236 */
    height: 246px; /* 358/506*349 */
  }
  .hcta-phone-bar { left: 86px; top: 42px; width: 69px; height: 18px; }
  .hcta-phone-frame { width: 100%; height: 100%; }
  /* Text below phone */
  .hcta-text { padding-left: 31px; padding-right: 22px; }
  .hcta-heading { font-size: 39px; max-width: 100%; }  /* _4 m: 39px */
  .hcta-body { font-size: 22px; max-width: 100%; }     /* _3 m: 22px */
  .hcta-label { margin-bottom: 16px; }
}

/* ─── HOME SERVICES 3-COL (Section 3) ───────────────────────────────────── */

.home-services-3col {
  background: #000;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  height: 400px;
  overflow: hidden;
}

.s3col-grid {
  display: grid;
  grid-template-columns: 30% 40% 30%;
  height: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

/* White vertical dividers between columns */
.s3col-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 40px;
  position: relative;
}
.s3col-col + .s3col-col::before {
  content: '';
  position: absolute;
  left: 0; top: 0;
  width: 1px; height: 100%;
  background: #fff;
}

.s3col-icon {
  width: 25px;
  height: 25px;
  flex-shrink: 0;
}
.s3col-icon svg { width: 100%; height: 100%; }

.s3col-label {
  font-family: 'Almarai', sans-serif;
  font-size: 28px;
  font-weight: 400;
  color: #fff;
  text-align: center;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: -0.05em;
  transition: color 0.4s;
  padding: 0;
  max-width: 261px;
}
.s3col-label:hover { color: var(--rmxts1-accent, var(--rmxts1-accent)); }
.s3col-label b { font-weight: 700; }

/* Tablet */
@media (min-width: 768px) and (max-width: 1099px) {
  .home-services-3col { height: auto; padding: 60px 0; }
  .s3col-label { font-size: 22px; padding: 0 16px; }
}

/* Mobile: stack vertically, horizontal dividers */
@media (max-width: 767px) {
  .home-services-3col { height: auto; border-top: none; border-bottom: none; }
  .s3col-grid { grid-template-columns: 1fr; }

  .s3col-col {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
    padding: 52px 32px;
  }
  /* horizontal dividers on mobile */
  .s3col-col + .s3col-col::before {
    top: 0; left: 0;
    width: 100%; height: 1px;
  }
  .s3col-icon { width: 23px; height: 23px; flex-shrink: 0; }
  .s3col-label { font-size: 28px; text-align: center; padding: 0; max-width: 204px; }
}

/* ─── HOME MARQUEE (Section 2) ──────────────────────────────────────────── */

/* Section: yellow bg, 61px desktop / 41px mobile, black top+bottom border */
.home-marquee {
  background: var(--rmxts1-accent, var(--rmxts1-accent));
  height: 61px;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  overflow: hidden;
  display: flex;
  align-items: center;
}

/* Track: two identical inner divs side by side; animating -50% loops seamlessly */
.marquee-track {
  display: flex;
  white-space: nowrap;
  animation: marquee-scroll 60s linear infinite;
  will-change: transform;
}

/* Each inner must be wide enough to fill beyond any viewport */
.marquee-inner {
  flex-shrink: 0;
  font-family: 'Oswald', sans-serif;
  font-size: 22px;
  font-weight: 600;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
  padding-right: 0;
}
.marquee-inner em { font-style: normal; }

@keyframes marquee-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* Mobile: shorter strip, no border (border spacing not in this design) */
@media (max-width: 767px) {
  .home-marquee { height: 41px; border-top: none; border-bottom: none; }
}

/* ─── HOME HERO (Section 1 — welcome) ───────────────────────────────────── */

/* Section: black base, exact canvas height from JSON */
.home-hero {
  position: relative;
  height: 759px;
  background: #000;
  overflow: hidden;
}

/* Images sit at 0.6 opacity on the black bg — this IS the dark overlay effect */
.hero-slides {
  position: absolute;
  inset: 0;
  opacity: 0.6;
  z-index: 0;
}
.hero-slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1.2s ease;
}
.hero-slide.is-active { opacity: 1; }

/* Inner: max-width 1200px centred; all content positioned within */
.hero-inner {
  position: relative;
  z-index: 1;
  max-width: 1200px;
  margin: 0 auto;
  height: 100%;
}

/* Pinyon Script M — x:22 y:143 from JSON, font-size:190px */
.hero-script-m {
  position: absolute;
  left: 22px;
  top: 143px;
  font-family: 'Pinyon Script', cursive;
  font-size: 190px;
  font-weight: 400;
  color: #fff;
  line-height: 1;
  z-index: 2;
  pointer-events: none;
  white-space: nowrap;
}

/* Headline block — x:116 y:160 from JSON */
.hero-headline {
  position: absolute;
  left: 116px;
  top: 160px;
  z-index: 1;
}
.hero-title-line {
  font-family: 'Oswald', sans-serif;
  font-size: 125px;
  font-weight: 600;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: -0.05em;
  line-height: 1;
  display: block;
}

/* Row 2: AGENCY + FOR pill inline */
.hero-title-agency {
  display: flex;
  align-items: center;
  gap: 48px;
}

/* FOR pill — 154×56px, border-radius:32px, white border, transparent bg */
.hero-for-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 154px;
  height: 56px;
  border: 2px solid #fff;
  border-radius: 32px;
  background: transparent;
  font-family: 'Almarai', sans-serif;
  font-size: 38px;
  font-weight: 300;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0;
  line-height: 1;
  padding: 0 20px;
}

/* Scroll indicator — yellow bar, black border, at bottom-left */
/* Visual after rotation: 191px wide × 44px tall, at left:116 from JSON */
.hero-scroll {
  position: absolute;
  left: 116px;
  bottom: 144px; /* 759 - 615 (bar bottom) = 144px */
  display: flex;
  align-items: center;
  gap: 10px;
  width: 191px;
  height: 44px;
  background: var(--rmxts1-accent, var(--rmxts1-accent));
  border: 2px solid #000;
  padding: 0 12px;
}
.hero-scroll-label {
  flex: 1;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 13px;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #000;
  text-align: center;
}
.hero-scroll-arrow {
  width: 20px;
  height: 14px;
  flex-shrink: 0;
}

/* ── Hero: tablet (768–1099px) ── */
@media (min-width: 768px) and (max-width: 1099px) {
  .home-hero { height: 600px; }

  .hero-script-m {
    font-size: 130px;
    left: 3%;
    top: 120px;
  }

  .hero-headline { left: 8%; top: 130px; }
  .hero-title-line { font-size: 86px; }
  .hero-for-pill  { font-size: 28px; min-width: 110px; height: 42px; border-radius: 24px; }
  .hero-title-agency { gap: 32px; }

  .hero-scroll { left: 8%; bottom: 100px; }
}

/* ── Hero: mobile (≤767px) — values from JSON m:{} coords ── */
@media (max-width: 767px) {
  .home-hero { height: 460px; }

  /* JSON: m:{x:-19,y:97,w:126,h:80} font-size:72px */
  .hero-script-m {
    font-size: 72px;
    left: -19px;
    top: 97px;
  }

  /* JSON: m:{x:18,y:108} font-size:45px */
  .hero-headline { left: 18px; top: 108px; }
  .hero-title-line { font-size: 45px; }

  /* JSON: m:{x:160,y:158,w:86,h:38} font-size:20px */
  .hero-for-pill {
    font-size: 20px;
    min-width: 86px;
    height: 38px;
    border-radius: 20px;
    padding: 0 14px;
  }
  .hero-title-agency { gap: 20px; }

  /* JSON: m:{x:19,y:263,w:164,h:45} — anchored from top so height changes don't shift it */
  .hero-scroll {
    left: 19px;
    top: 263px;
    bottom: auto;
    width: 164px;
    height: 45px;
  }
}


/* ============================================================
   ABOUT PAGE
   ============================================================ */

/* ── Section 1: Meet the Founder ─────────────────────────── */
/* JSON canvas: 1200px  d:{h:783}  m:{h:953}                 */

.about-founder {
  position: relative;
  background: #ffffff;
  overflow: hidden;
}

/* Yellow strip — full viewport height, right edge            */
/* JSON: d:{x:938,y:1,w:290,h:782}  290/1200 = 24.17%        */
.about-founder__strip {
  position: absolute;
  left: calc(50% + 338px);
  right: 0;
  top: 0;
  bottom: 0;
  background: var(--rmxts1-accent);
  pointer-events: none;
}

/* Inner wrapper — caps layout at 1200px and centres it      */
.about-founder__inner {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  min-height: 783px;
}

/* Founder photo — absolute inside the 1200px inner           */
/* JSON: d:{x:745,y:144,w:355,h:496}                          */
.about-founder__photo {
  position: absolute;
  left: 62.08%;         /* 745 / 1200 */
  top: 144px;
  width: 29.58%;        /* 355 / 1200 */
  aspect-ratio: 355 / 496;
  object-fit: cover;
  display: block;
}

/* Text column — left side of the 1200px inner                */
/* JSON: leftmost x:39, content width ends ~x:600             */
.about-founder__content {
  position: relative;
  z-index: 1;
  padding: 26px 0 60px 39px;
  max-width: 660px;     /* fits content up to x:660, photo starts at x:745 */
}

/* JSON: _8  d:{x:39,y:26,w:368,h:30}
   Roboto 700 14px uppercase letter-spacing:0                 */
.amtf-label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0;
  color: #000000;
  margin: 0;
  line-height: 1;
}

/* JSON: _7  d:{x:50,y:89,w:61,h:55}                         */
.amtf-star-wrap {
  display: block;
  margin-top: 36px;
  color: #000000;
  line-height: 0;
}
.amtf-star-wrap svg {
  width: 61px;
  height: 55px;
}

/* JSON: _6  d:{x:62,y:154,w:537,h:100}
   st-d-title: Oswald 600 95px uppercase letter-spacing:-0.05em line-height:1 */
.amtf-title {
  margin-top: 14px;
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 95px;
  line-height: 1;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: #000000;
}

/* JSON: _5  d:{x:70,y:275,w:530,h:141}
   Almarai 400 40px uppercase letter-spacing:-0.05em line-height:1.1 */
.amtf-heading {
  margin-top: 28px;
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 40px;
  line-height: 1.1;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: rgba(29,29,29,1);
}
.amtf-heading strong { font-weight: 700; }

/* JSON: _4  d:{x:70,y:444,w:490,h:68}  Almarai 700 27px     */
.amtf-bold {
  margin-top: 32px;
  font-family: 'Almarai', sans-serif;
  font-weight: 700;
  font-size: 27px;
  line-height: 1.1;
  color: #000000;
}

/* JSON: _3  d:{x:70,y:532,w:490,h:97}  Almarai 400 15px     */
.amtf-body {
  margin-top: 22px;
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.5;
  text-align: justify;
  color: #000000;
}

/* ── Tablet 768–1099px ──────────────────────────────────── */
@media (min-width: 768px) and (max-width: 1099px) {
  .about-founder__inner { min-height: 620px; }
  .about-founder__photo { top: 80px; }
  .about-founder__content { max-width: 520px; }
  .amtf-title   { font-size: 68px; }
  .amtf-heading { font-size: 28px; }
  .amtf-bold    { font-size: 22px; }
}

/* ── Mobile ≤767px ──────────────────────────────────────── */
/* JSON: m:{h:953}                                           */
@media (max-width: 767px) {
  .about-founder { overflow: hidden; }

  /* Full-width top yellow band  JSON: m:{x:-1,y:0,w:330,h:197} */
  .about-founder__strip {
    width: 100%;
    height: 197px;
    right: auto;
    left: 0;
    bottom: auto;
  }

  /* padding-top pushes content below the photo (29+283+8=320) */
  .about-founder__inner {
    min-height: 953px;
    padding-top: 320px;
    padding-bottom: 40px;
  }

  /* Photo — centred on mobile */
  .about-founder__photo {
    left: 50%;
    transform: translateX(-50%);
    top: 29px;
    width: 200px;
    aspect-ratio: 200 / 283;
    z-index: 0;
  }

  /* Content flows in normal doc-flow below the padding-top */
  .about-founder__content {
    position: relative;
    z-index: 1;
    padding: 0 22px 0 22px;
    margin-top: 0;
    max-width: 100%;
  }

  .amtf-label { text-align: center; width: 100%; font-size: 13px; margin-top: 18px; }

  .amtf-star-wrap {
    margin-top: 10px;
    display: flex;
    justify-content: flex-start;
  }

  /* JSON: m:_6  st-m-title Oswald 600 45px */
  .amtf-title {
    font-size: 45px;
    margin-top: 10px;
  }

  /* JSON: m:_5  Almarai 400 25px */
  .amtf-heading {
    font-size: 25px;
    margin-top: 16px;
  }

  /* JSON: m:_4  Almarai 700 22px */
  .amtf-bold {
    font-size: 22px;
    margin-top: 20px;
  }

  /* JSON: m:_3  Almarai 400 14px */
  .amtf-body { font-size: 14px; }
}


/* ── Section 2: Team ──────────────────────────────────────────────────────
   JSON canvas 1200px  d:{h:1134, bg:rgba(239,234,230,1)}  m:{h:1461}
   ────────────────────────────────────────────────────────────────────── */

.about-team {
  background: rgba(239,234,230,1);
}

.about-team__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 78px 80px 90px;
}

/* ── Heading ──────────────────────────────────────────────────────────── */
/* team_19: Pinyon Script 150px   team_18: Oswald 600 95px               */
/* Script M overlays the Oswald M visually                                */

.team-hdr {
  text-align: center;
  margin-bottom: 60px;
}

.team-hdr__inner {
  display: inline-flex;
  align-items: flex-start;
  line-height: 1;
  position: relative;
}

/* JSON: team_19  font-size:150px  Pinyon Script */
.team-hdr__script {
  font-family: 'Pinyon Script', cursive;
  font-weight: 400;
  font-size: 150px;
  line-height: 0.82;
  color: #000000;
  position: relative;
  z-index: 1;
  margin-right: -50px;    /* overlap onto first letter of title */
  pointer-events: none;
}

/* JSON: team_18  Oswald 600 95px  no text override → st-d-title */
.team-hdr__title {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 95px;
  line-height: 1;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: #000000;
  position: relative;
  z-index: 0;
  padding-top: 20px;      /* team_18 y:100 vs team_19 y:78 = 22px offset */
}

/* ── Cards row — two cards centered with gap ─────────────────────────── */
/* JSON: card1 x:161, card2 x:718, each w:343  → gap=214px in 1200canvas */
/* Using CSS grid for bulletproof centering                               */

.team-cards {
  display: grid;
  grid-template-columns: 343px 343px;
  gap: 200px;
  justify-content: center;
}

/* ── Single card ──────────────────────────────────────────────────────── */

.team-card {
  width: 343px;
}

/* Frame wrapper: role text overflows left so overflow:visible needed    */
/* JSON: d:{w:343, h:440}                                                 */
.team-card__frame-wrap {
  position: relative;
  width: 343px;
  height: 440px;
  overflow: visible;
}

/* 2px solid black border  JSON: border-width:2px border-color:#000      */
.team-card__border {
  position: absolute;
  inset: 0;
  border: 2px solid #000000;
  pointer-events: none;
  z-index: 1;
}

/* Photo: 10px right, 11px down offset  JSON: d:{w:322,h:418}            */
.team-card__img-wrap {
  position: absolute;
  top: 11px;
  left: 10px;
  width: 322px;
  height: 418px;
  overflow: hidden;
}

/* JSON: hover opacity:0.9 transition:0.5s */
.team-card__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity 0.5s;
}
.team-card__img:hover { opacity: 0.9; }

/* Role — rotated vertical, left of card                                 */
/* JSON: d:{a:-90, h:18} → Roboto 700 11px uppercase                     */
.team-card__role {
  position: absolute;
left: -14px;
    bottom: 121px;
  transform: translateX(-100%) rotate(-90deg);
  transform-origin: right bottom;
  white-space: nowrap;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: #000000;
}

/* Name  JSON: Almarai 400 40px centered  d:{y:751, h:56}               */
.team-card__name {
  margin-top: 20px;
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 40px;
  line-height: 1.1;
  letter-spacing: -0.05em;
  text-align: center;
  color: #000000;
}

/* Bio  JSON: Almarai 400 15px left  d:{y:828, h:95}                     */
.team-card__bio {
  margin-top: 14px;
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.5;
  text-align: left;
  color: #000000;
}

/* Footer  JSON: d:{y:946}                                               */
.team-card__footer {
  margin-top: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Contact  JSON: Pinyon Script 33px                                     */
.team-card__contact {
  font-family: 'Pinyon Script', cursive;
  font-weight: 400;
  font-size: 33px;
  line-height: 1;
  color: #000000;
  text-decoration: none;
  white-space: nowrap;
  transition: opacity 0.3s;
}
.team-card__contact:hover { opacity: 0.6; }

/* Social icons  JSON: d:{w:37,h:37} fill:#000                          */
.team-card__socials {
  display: flex;
  gap: 6px;
  align-items: center;
}
.team-card__socials a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 37px;
  height: 37px;
  transition: opacity 0.5s;
}
.team-card__socials a:hover { opacity: 0.6; }
.team-card__socials svg {
  width: 37px;
  height: 37px;
  fill: #000000;
}

/* ── Tablet 768–1099px ────────────────────────────────────────────────── */
@media (min-width: 768px) and (max-width: 1099px) {
  .about-team__inner  { padding: 60px 40px 70px; }
  .team-hdr__script   { font-size: 100px; margin-right: -36px; }
  .team-hdr__title    { font-size: 68px; padding-top: 14px; }
  .team-cards         { grid-template-columns: 280px 280px; gap: 50px; }
  .team-card          { width: 280px; }
  .team-card__frame-wrap { width: 280px; height: 360px; }
  .team-card__img-wrap   { width: 263px; height: 342px; }
  .team-card__name    { font-size: 30px; }
}

/* ── Mobile ≤767px ────────────────────────────────────────────────────── */
/* JSON: m:{h:1461}  cards stack, role text horizontal below frame        */
@media (max-width: 767px) {
  .about-team__inner { padding: 43px 22px 60px; }

  /* Heading  JSON: m:{team_19 font-size:72px, team_18 text-align:center} */
  .team-hdr          { margin-bottom: 36px; }
  .team-hdr__script  { font-size: 72px; line-height: 0.82; margin-right: -26px; }
  .team-hdr__title   { font-size: 45px; padding-top: 10px; }

  /* Cards stack vertically */
  .team-cards {
    grid-template-columns: 287px;
    gap: 50px;
  }
  .team-card { width: 287px; }

  /* Frame  JSON: m:{w:287, h:340, border:1px}                          */
  .team-card__frame-wrap { width: 287px; height: 340px; }
  .team-card__border     { border-width: 1px; }

  /* Photo  JSON: m:{offset 11px right, 12px down, w:266, h:317}        */
  .team-card__img-wrap { top: 12px; left: 11px; width: 266px; height: 317px; }

  /* Role: horizontal below frame, no rotation                          */
  /* JSON: m:{a:0, x:28, y:480}                                         */
  .team-card__role {
    position: static;
    transform: none;
    display: block;
    margin-top: 12px;
    letter-spacing: 0.1em;
  }

  /* Name  JSON: m:{text-align:center}                                  */
  .team-card__name { font-size: 28px; margin-top: 10px; }

  /* Bio  JSON: m:{font-size:13px}                                      */
  .team-card__bio  { font-size: 13px; margin-top: 12px; }

  .team-card__footer  { margin-top: 14px; }
  .team-card__contact { font-size: 28px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   ABOUT PAGE — Section 3: What We Are About
   JSON: d:{h:450,bg:#fff}  m:{h:950,bg:#fff}
   ═══════════════════════════════════════════════════════════════════════ */

.about-wwaa {
  background: #ffffff;
  padding-top: 60px;
  padding-bottom: 60px;
  border-bottom: 1px solid #000000;
}

.about-wwaa__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 21px;
}

/* ── Header: line + label + line ──────────────────────────────────────── */
/* JSON: _7 {left:445,top:16,w:310,h:17} Roboto 700 14px subheading      */
/* JSON: _8 line left side, _6 line right side                            */

.wwaa-hdr {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 0;
  margin-bottom: 28px;
}


.wwaa-hdr__line {
  flex: 1;
  height: 1px;
  background: #000000;
}

.wwaa-hdr__label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #000000;
  white-space: nowrap;
}

/* ── Three boxes ─────────────────────────────────────────────────────── */
/* JSON: boxes w:366-377px each, h:377px, gap ~24px, 1px solid #000      */

.wwaa-boxes {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 24px;
}

.wwaa-box {
  border: 1px solid #000000;
  height: 377px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

/* JSON: _4 bg:rgba(246,243,236,1) */
.wwaa-box--1 { background: rgba(246,243,236,1); }

/* JSON: _2 bg:rgba(239,234,230,1) */
.wwaa-box--2 { background: rgba(239,234,230,1); }

/* JSON: _0 bg: accent color */
.wwaa-box--3 { background: var(--rmxts1-accent); }

/* JSON: _1/_3/_5 font-size:34px uppercase center — Almarai */
.wwaa-box p {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 34px;
  line-height: 1.15;
  text-transform: uppercase;
  text-align: center;
  color: #000000;
  margin: 0;
}

.wwaa-box p strong {
  font-weight: 700;
}

.wwaa-box__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: inherit;
}
.wwaa-box__link p { margin: 0; }

/* ── Mobile ≤767px ────────────────────────────────────────────────────── */
/* JSON: m:{h:950} boxes stack vertically, each 275×275px                */

@media (max-width: 767px) {
  .about-wwaa__inner {
    padding: 20px 22px 30px;
  }

  .wwaa-boxes {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  /* JSON: m: w:275, h:275 */
  .wwaa-box {
    height: 275px;
    padding: 20px;
  }

  .wwaa-box p {
    font-size: 26px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   SERVICES PAGE
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Section 1: Intro ─────────────────────────────────────────────────
   JSON: d:{h:484, bg:#000, bgImage:laura-chouette, bgOpacity:77}
   Single element: Oswald 95px uppercase yellow, rotated 330deg (-30deg)
   ──────────────────────────────────────────────────────────────────── */

.svc-intro {
  position: relative;
  height: 484px;
  background: #000000;
  overflow: hidden;
}

/* Background image at 77% opacity over black */
.svc-intro__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  opacity: 0.77;
}

/* Text container — oversized, centered, rotated -30deg */
/* JSON: d:{x:-140,y:-238,w:1421,h:1096,a:330}          */
.svc-intro__text-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 200vw;
  transform: translate(-50%, -50%) rotate(-30deg);
  pointer-events: none;
  z-index: 1;
}

/* JSON: st-d-title Oswald 600 95px, color:var(--rmxts1-accent), lh:1.4 */
.svc-intro__text {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 95px;
  line-height: 1.4;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: var(--rmxts1-accent);
  text-align: justify;
  margin: 0;
  white-space: normal;
  word-break: break-word;
}

/* ── Mobile ≤767px — JSON: m:{h:287, lh:1.3} ─────────────────────── */
@media (max-width: 767px) {
  .svc-intro       { height: 287px; }
  .svc-intro__text { font-size: 45px; line-height: 1.3; }
}




/* ─── SERVICES: THREE PACKAGES ───────────────────────────────────────── */
/* JSON: d{h:820, bg:#fff} top border 1px, 3 cols each 1/3 viewport       */
.svc-pkgs {
  background: #fff;
  border-top: 1px solid #000;
}
/* Header: full-width block element — border-bottom spans edge to edge    */
.svc-pkgs__hdr {
  text-align: center;
  padding: 96px 24px 56px;
  border-bottom: 1px solid #000;
}
/* JSON: _15 subheading style Roboto 700 14px uppercase */
.svc-pkgs__label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #000;
  margin-bottom: 6px;
}
/* JSON: _14 st-d-title + font-size:55px override */
.svc-pkgs__title {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 55px;
  line-height: 1;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: #000;
}


/* Grid — constrained to 1200px, cards centered                          */
/* JSON: 3 cards at x:66/477/883 each 247px wide in 1200px canvas        */
.svc-pkgs__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  max-width: 1200px;
  margin: 0 auto;
}
.svc-pkgs__col {
  border-left: 1px solid #000;
  padding: 44px 20px 60px;
  display: flex;
  justify-content: center;
}
.svc-pkgs__col--first { border-left: none; }

/* Card — JSON: 247px wide */
.svc-pkgs__card {
  width: 247px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Image — JSON: 247×239px, hover opacity:0.6 */
.svc-pkgs__img-wrap {
  display: block;
  width: 247px;
  height: 239px;
  overflow: hidden;
  flex-shrink: 0;
}
.svc-pkgs__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.5s;
}
.svc-pkgs__img-wrap:hover .svc-pkgs__img { opacity: 0.6; }

/* Card title — JSON: Oswald 600 font-size:26px */
.svc-pkgs__card-title {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 26px;
  text-transform: uppercase;
  text-align: center;
  color: #000;
  margin-top: 28px;
}

/* Card desc — JSON: st-d-paragraph Almarai 400 15px */
.svc-pkgs__card-desc {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.6;
  text-align: center;
  color: #000;
  margin-top: 10px;
}

/* Arrow link — JSON: 57×54px circle-arrow, rotated 90° to point DOWN */
.svc-pkgs__arrow {
  display: block;
  width: 57px;
  height: 57px;
  margin-top: 24px;
  color: #000;
  transition: opacity 0.5s;
}
.svc-pkgs__arrow:hover { opacity: 0.7; }
.svc-pkgs__arrow svg { width: 100%; height: 100%; fill: #000; }

/* ── Mobile ≤767px — JSON: m{h:1592} stack cards vertically              */
@media (max-width: 767px) {
  .svc-pkgs__hdr { padding: 52px 24px 36px; }
  .svc-pkgs__title { font-size: 43px; }
  .svc-pkgs__grid { grid-template-columns: 1fr; border-top: none; }
  .svc-pkgs__col  { border-left: none; border-top: 1px solid #000; padding: 40px 0; }
  .svc-pkgs__col--first { border-top: none; }
  .svc-pkgs__card { width: 235px; }
  .svc-pkgs__img-wrap { width: 235px; height: 212px; }
  .svc-pkgs__arrow { width: 50px; height: 50px; }
}


/* ─── SERVICES: PACKAGE SECTIONS (01 / 02 / 03) ─────────────────────── */
/* Shared layout: 2-col grid, text ~58% + image 389px                    */

/* Package-01: light beige bg */
.svc-pkg--01 { background: rgba(246,243,236,1); border-top: 1px solid #000; overflow: hidden; }
/* Package-02: medium beige bg */
.svc-pkg--02 { background: rgba(239,234,230,1); border-top: 1px solid #000; }
/* Package-03: yellow accent bg, white inner box */
.svc-pkg--03 { background: var(--rmxts1-accent); border-top: 1px solid #000; overflow: hidden; }

/* Inner 2-col layout — text + image */
/* JSON: text col x:84-519 (~580px), image 389×573 at x:698             */
.svc-pkg__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 389px;
  gap: 60px;
  align-items: start;
  padding: 80px 56px 80px 84px;
}
/* pkg-02: image first (left), text second (right) */
.svc-pkg__inner--flip {
  grid-template-columns: 389px 1fr;
  padding: 80px 84px 80px 0;
}

/* Text column */
.svc-pkg__text { display: flex; flex-direction: column; }

/* Decorative number — JSON: Pinyon Script 400, large */
.svc-pkg__num {
  font-family: 'Pinyon Script', cursive;
  font-weight: 400;
  font-size: 80px;
  line-height: 0.9;
  color: #000;
  display: block;
  margin-bottom: 8px;
}

/* Package title — JSON: Oswald 600 font-size:55px */
.svc-pkg__title {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 55px;
  line-height: 1;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: #000;
  margin-bottom: 24px;
}

/* Description — JSON: Almarai 400 font-size:24px */
.svc-pkg__desc {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.4;
  color: #000;
  margin-bottom: 24px;
}

/* Includes label */
.svc-pkg__includes-label {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 15px;
  color: #000;
  margin-bottom: 0;
  border-top: 1px solid #000;
  padding-top: 12px;
}

/* Features list — each item has top divider + star icon */
.svc-pkg__features {
  list-style: none;
  margin: 0;
  padding: 0;
}
.svc-pkg__feature {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 0;
  border-bottom: 1px solid #000;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #000;
}
.svc-pkg__star { flex-shrink: 0; width: 20px; height: 20px; display: flex; }
.svc-pkg__star svg { fill: #000; }

/* CTA row — price left, BOOK NOW right */
.svc-pkg__cta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 24px;
  padding-top: 4px;
}
.svc-pkg__price-block { display: flex; align-items: baseline; gap: 10px; }

/* Price — JSON: font-size:40px (Oswald) */
.svc-pkg__price {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 40px;
  line-height: 1;
  color: #000;
}

/* Starting at — JSON: st-d-subheading Roboto 700 14px uppercase */
.svc-pkg__price-label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #000;
}

/* BOOK NOW button — JSON: text 13px + yellow strip + arrow              */
.svc-pkg__book {
  display: inline-flex;
  align-items: center;
  gap: 0;
  cursor: pointer;
  transition: opacity 0.5s;
}
.svc-pkg__book:hover { opacity: 0.7; }
.svc-pkg__book-text {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #000;
  padding-right: 14px;
}
/* Strip hidden by default (package sections have no strip) */
.svc-pkg__book-strip { display: none; }

/* Strip visible — JSON: 44×191px yellow rect, 2px border (process section) */
.svc-pkg__book--strip .svc-pkg__book-text { padding-right: 24px; }
.svc-pkg__book--strip .svc-pkg__book-strip {
  display: block;
  width: 44px;
  height: 120px;
  background: var(--rmxts1-accent);
  border: 2px solid #000;
  flex-shrink: 0;
}
.svc-pkg__book--strip .svc-pkg__book-arrow { margin-left: 24px; }

/* Arrow — plain icon, no box */
.svc-pkg__book-arrow {
  display: flex;
  align-items: center;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  margin-left: 8px;
}
.svc-pkg__book-arrow svg { fill: #000; width: 100%; height: 100%; }

/* Light (dark bg) variant — text/arrow in cream, strip stays yellow */
.svc-pkg__book--light .svc-pkg__book-text { color: rgba(246,243,236,1); }
.svc-pkg__book--light .svc-pkg__book-arrow svg { fill: rgba(246,243,236,1); }

/* Package-02 corner decorative image — JSON: x:1053 y:299 w:248 h:365    */
/* Positioned inside .svc-pkg__inner--flip (max-width:1200px positioning ctx) */
.svc-pkg--02 { overflow: hidden; }
.svc-pkg02__corner {
  position: absolute;
  right: -101px;   /* 1200-(1053+248)= -101px → matches original canvas position */
  top: 299px;      /* matches original y:299 from section top */
  width: 248px;
  height: 365px;
  object-fit: cover;
  object-position: 50% 50%;
  display: block;
  pointer-events: none;
  z-index: 1;
}

/* Image — JSON: 389×573px */
.svc-pkg__img-side { flex-shrink: 0; }
.svc-pkg__img {
  width: 389px;
  height: 573px;
  object-fit: cover;
  display: block;
}
/* VIP: image contained within white box, never touches the border        */
.svc-pkg--03 .svc-pkg__img-side {
  align-self: center;
}
.svc-pkg--03 .svc-pkg__img {
  width: 389px;
  height: 500px;
  object-fit: cover;
  display: block;
}

/* Package-03 — yellow outer, white inner box                             */
/* JSON: outer bg accent, inner white box 1128×864 with 2px border       */
/* JSON: outer yellow wrapper — white box at x:36 y:81 w:1128 in 1200px canvas */
.svc-pkg03__outer {
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 36px 88px;
  position: relative;
}
/* JSON: package-03_3 star icon at x:1126 y:54 w:61 h:55 fill:#000 */
.svc-pkg03__star {
  position: absolute;
  right: 13px;
  top: 54px;
  width: 61px;
  height: 55px;
  pointer-events: none;
}
.svc-pkg03__star svg { fill: #000; width: 100%; height: 100%; }
.svc-pkg03__box {
  background: #fff;
  border: 2px solid #000;
  max-width: 1128px;
  margin: 0 auto;
}
.svc-pkg--03 .svc-pkg__inner {
  max-width: none;
  padding: 80px 60px 80px 84px;
  align-items: center;
}

/* ── Tablet 768–1024px ───────────────────────────────────────────────── */
@media (max-width: 1024px) and (min-width: 768px) {
  .svc-pkg__inner {
    grid-template-columns: 1fr 300px;
    padding: 60px 40px 60px 48px;
    gap: 40px;
  }
  .svc-pkg__inner--flip {
    grid-template-columns: 300px 1fr;
    padding: 60px 48px 60px 0;
  }
  .svc-pkg__img { width: 300px; height: 440px; }
  .svc-pkg__title { font-size: 44px; }
  .svc-pkg__desc  { font-size: 20px; }
  .svc-pkg03__outer { padding: 60px 24px; }
  .svc-pkg--03 .svc-pkg__inner { padding: 60px 40px; }
  .svc-pkg--03 .svc-pkg__img  { width: 300px; height: 420px; }
  .svc-process__steps { gap: 28px; }
  .svc-process__step-num { font-size: 52px; }
  .svc-process__step-title { font-size: 20px; }
  .svc-process__inner { padding: 0 32px 60px; }
  .svc-cta__heading { font-size: 64px; }
}

/* ── Mobile ≤767px ───────────────────────────────────────────────────── */
@media (max-width: 767px) {
  .svc-pkg__inner,
  .svc-pkg__inner--flip {
    grid-template-columns: 1fr;
    padding: 48px 20px;
    gap: 32px;
  }
  .svc-pkg__inner--flip .svc-pkg__img-side { order: -1; }
  .svc-pkg__img { width: 100%; height: 260px; }
  .svc-pkg__num  { font-size: 56px; }
  .svc-pkg__title { font-size: 34px; }
  .svc-pkg__desc  { font-size: 17px; }
  .svc-pkg__price { font-size: 30px; }
  .svc-pkg__cta-row { flex-direction: column; align-items: flex-start; gap: 16px; }
  .svc-pkg03__outer { padding: 24px 16px; }
  .svc-pkg--03 .svc-pkg__inner { padding: 32px 20px; }
  .svc-pkg--03 .svc-pkg__img  { width: 100%; height: 240px; }
  .svc-pkg03__star { display: none; }
}


/* ─── SERVICES: PROCESS ──────────────────────────────────────────────── */
/* JSON: bg #000, d:660px m:1055px */
.svc-process {
  background: #000;
  border-top: 1px solid #000;
  padding: 80px 0 0;
}
.svc-process__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 56px 80px;
}

/* Heading — JSON: process_20 Roboto 700 14px uppercase, cream */
.svc-process__label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(246,243,236,1);
  text-align: center;
  margin-bottom: 60px;
}

/* 3-col steps grid */
.svc-process__steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 48px;
  margin-bottom: 60px;
}

/* Each step */
.svc-process__step-top {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 16px;
}

/* Big number — JSON: st-d-title overridden to 70px → Oswald 600 70px cream */
.svc-process__step-num {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 70px;
  line-height: 1;
  text-transform: uppercase;
  color: rgba(246,243,236,1);
  flex-shrink: 0;
}

/* Short vertical decorative line between number and title — JSON: h:66px */
.svc-process__step-title-wrap { display: flex; flex-direction: column; }
.svc-process__step-line-short {
  display: block;
  width: 1px;
  height: 50px;
  background: rgba(246,243,236,1);
  flex-shrink: 0;
  align-self: center;
}

/* Step title — JSON: st-d-heading 24px → Almarai 400 24px, letter-spacing -0.05em */
.svc-process__step-title {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.1;
  letter-spacing: -0.05em;
  color: rgba(246,243,236,1);
}

/* Divider line between title and description */
.svc-process__step-divider {
  height: 1px;
  background: rgba(246,243,236,1);
  margin: 14px 0;
}

/* Description — JSON: st-d-paragraph 15px justify → Almarai 400 15px justify */
.svc-process__step-desc {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.5;
  text-align: justify;
  color: rgba(246,243,236,1);
}

/* CTA row at bottom — centered */
.svc-process__cta {
  border-top: 1px solid rgba(100,100,100,0.3);
  padding-top: 40px;
  display: flex;
  justify-content: center;
}

/* ── Mobile ≤767px ──────────────────────────────────────────────────── */
@media (max-width: 767px) {
  .svc-process { padding: 48px 0 0; }
  .svc-process__inner { padding: 0 20px 48px; }
  .svc-process__steps { grid-template-columns: 1fr; gap: 36px; margin-bottom: 40px; }
  .svc-process__step-num { font-size: 52px; }
  .svc-process__step-title { font-size: 19px; }
  .svc-process__label { margin-bottom: 36px; }
}


/* ─── SERVICES: CTA ──────────────────────────────────────────────────── */
/* JSON: bg rgba(246,243,236,1), d:690px m:474px */
.svc-cta {
  background: rgba(246,243,236,1);
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}
.svc-cta__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 100px 56px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 690px;
  text-align: center;
}

/* Heading wrap — centered block */
.svc-cta__heading-wrap {
  max-width: 820px;
  margin: 0 auto 48px;
  text-align: center;
}

/* Pinyon Script initial — inline so baseline aligns naturally with Oswald */
.svc-cta__initial {
  font-family: 'Pinyon Script', cursive;
  font-weight: 400;
  font-size: 150px;
  line-height: 0.78;
  color: #000;
  display: inline;
  vertical-align: -0.05em;
  text-transform: none;
}

/* Main heading — JSON: st-d-title Oswald 600 95px uppercase */
.svc-cta__heading {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 95px;
  line-height: 1;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: #000;
  display: inline;
}

.svc-cta__btn-wrap { display: flex; justify-content: center; }

/* CTA GET STARTED button — JSON: yellow rect 191×44px, text+arrow inside */
.svc-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 20px;
  background: var(--rmxts1-accent);
  border: 2px solid #000;
  padding: 0 28px;
  height: 44px;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.3s;
}
.svc-cta-btn:hover { opacity: 0.8; }
.svc-cta-btn__text {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #000;
}
.svc-cta-btn__arrow {
  display: flex;
  align-items: center;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
}
.svc-cta-btn__arrow svg { fill: #000; width: 100%; height: 100%; }
/* Light variant for dark bg (process section) */
.svc-cta-btn--light .svc-cta-btn__text { color: rgba(246,243,236,1); }
.svc-cta-btn--light .svc-cta-btn__arrow svg { fill: rgba(246,243,236,1); }

/* ── Mobile ≤767px ──────────────────────────────────────────────────── */
@media (max-width: 767px) {
  .svc-cta__inner { padding: 60px 20px; min-height: 474px; }
  .svc-cta__heading-wrap { max-width: 100%; }
  .svc-cta__heading { font-size: 44px; }
  .svc-cta__initial { font-size: 88px; }
}


/* =============================================================================
   CONTACT PAGE
   JSON source: Contact-Local/index.html
   ============================================================================= */

/* ── Hero ── */
/* JSON: d:400px m:200px — bg sedona-435.jpg cover center */
/* JSON: d:400px m:200px — bg-attachment:fixed for parallax */
.ctc-hero {
  height: 400px;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  border-top: 1px solid #000;
}

/* ── Contact Form Section ── */
/* JSON: d:830px m:711px — bg var(--rmxts1-accent) */
.ctc-form {
  background: var(--rmxts1-accent);
  border-top: 1px solid #000;
  padding: 80px 24px 100px;
}
.ctc-form__inner {
  max-width: 820px;
  margin: 0 auto;
  text-align: center;
}
.ctc-form__heading-wrap {
  display: inline-block;
  text-align: left;
  margin-bottom: 56px;
}
/* JSON: sie-contact-form_2 — Pinyon Script 150px inline before heading */
/* R sits inline so baseline naturally aligns with Oswald EADY */
.ctc-form__initial {
  font-family: 'Pinyon Script', cursive;
  font-weight: 400;
  font-size: 150px;
  color: #000;
  line-height: 0.78;
  display: inline;
  vertical-align: -0.05em;
  text-transform: none;
}
/* JSON: sie-contact-form_1 — Oswald 600 95px upper -0.05em lh:1 */
.ctc-form__heading {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 95px;
  text-transform: uppercase;
  letter-spacing: -0.05em;
  line-height: 1;
  color: #000;
  display: inline;
}

/* Gravity Forms placeholder area */
.ctc-form__area {
  min-height: 340px;
  text-align: left;
}

/* ── Opt-in Section ── */
/* JSON: d:656px m:815px — bg rgba(246,243,236,1) */
/* Yellow diagonal shape lives on the section as ::after so it bleeds full-width */
.ctc-optin {
  background: rgba(246,243,236,1);
  border-top: 1px solid #000;
  overflow: hidden;
  position: relative;
}
/* JSON: yellow rotated rect — narrow zone, rightmost ~25%, steep diagonal cut */
.ctc-optin::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--rmxts1-accent);
  clip-path: polygon(76% 0%, 100% 0%, 100% 100%, 62% 100%);
  z-index: 0;
  pointer-events: none;
}
.ctc-optin__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 656px;
  position: relative;
  z-index: 1;
}

/* Left text column — JSON: text x:238 on 1200px canvas */
.ctc-optin__text {
  padding: 162px 40px 80px 200px;
}
/* JSON: st-d-subheading — Roboto 700 14px uppercase */
.ctc-optin__label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #000;
  margin-bottom: 26px; /* JSON: gap label→heading = 26px */
}
/* JSON: st-d-heading — Almarai 400 40px -0.05em lh:1.1 */
.ctc-optin__heading {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 40px;
  letter-spacing: -0.05em;
  line-height: 1.1;
  color: #000;
  margin-bottom: 20px;
}
/* JSON: st-d-paragraph — Almarai 400 15px lh:1.5 */
.ctc-optin__body {
  font-family: 'Almarai', sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: #000;
  margin-bottom: 32px;
}
/* JSON: email-opt-in-form_3 rotated → visual 217×46 — 1px border yellow bg */
.ctc-optin__btn {
  display: inline-flex;
  align-items: center;
  height: 40px;
  background: var(--rmxts1-accent);
  border: 1px solid #000;
  text-decoration: none;
}
.ctc-optin__btn-text {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  color: #000;
  padding: 0 14px;
}
.ctc-optin__btn-strip {
  width: 1px;
  align-self: stretch;
  background: #000;
  flex-shrink: 0;
}
.ctc-optin__btn-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 100%;
  transform: rotate(90deg); /* JSON: a:90 → arrow points down */
  flex-shrink: 0;
}
.ctc-optin__btn-arrow svg { fill: #000; width: 16px; height: 16px; }

/* Right visual column */
.ctc-optin__visual {
  position: relative;
}

/* Tablet mockup */
/* JSON: frame 283×417 at x:694 y:120 | screen 258×358 offset +12,+20 */
.ctc-optin__img-wrap {
  position: relative;
  z-index: 1;
  padding-top: 120px;
  display: flex;
  justify-content: center;
}
.ctc-optin__tablet {
  position: relative;
  width: 283px;
  height: 417px;
  flex-shrink: 0;
}
/* Screen photo sits behind the frame PNG */
.ctc-optin__tablet-screen {
  position: absolute;
  top: 20px;
  left: 12px;
  width: 258px;
  height: 358px;
  border-radius: 8px;
  object-fit: cover;
  z-index: 1;
}
/* Tablet frame PNG (transparent cutout for screen) sits on top */
.ctc-optin__tablet-frame {
  position: absolute;
  top: 0;
  left: 0;
  width: 283px;
  height: 417px;
  z-index: 2;
}

/* ── Tablet 768–1024px ────────────────────────────────────────────── */
@media (max-width: 1024px) and (min-width: 768px) {
  .ctc-form__heading { font-size: 64px; }
  .ctc-form__initial { font-size: 110px; }
  .ctc-optin__text   { padding: 80px 24px 60px 60px; }
  .ctc-optin__heading { font-size: 30px; }
  .ctc-optin__tablet { width: 220px; height: 324px; }
  .ctc-optin__tablet-screen { width: 200px; height: 278px; top: 16px; left: 10px; }
  .ctc-optin__tablet-frame  { width: 220px; height: 324px; }
  .ctc-optin__img-wrap { padding-top: 80px; }
}

/* ── Mobile ≤767px ───────────────────────────────────────────────── */
@media (max-width: 767px) {
  .ctc-hero { height: 200px; background-attachment: scroll; }

  .ctc-form { padding: 50px 24px 60px; }
  .ctc-form__heading { font-size: 30px; }
  .ctc-form__initial { font-size: 72px; }
  .ctc-form__heading-wrap { margin-bottom: 36px; }
  .ctc-form__area { min-height: 480px; }

  .ctc-optin::after { clip-path: polygon(0% 80%, 100% 30%, 100% 100%, 0% 100%); }
  .ctc-optin__inner { grid-template-columns: 1fr; }
  .ctc-optin__text  { padding: 50px 20px 40px; }
  .ctc-optin__heading { font-size: 35px; }
  .ctc-optin__visual { min-height: 400px; }
  .ctc-optin__img-wrap { padding-top: 40px; justify-content: center; }
  .ctc-optin__tablet { width: 220px; height: 324px; }
  .ctc-optin__tablet-screen { width: 196px; height: 260px; top: 16px; left: 12px; }
  .ctc-optin__tablet-frame  { width: 220px; height: 324px; }
}


/* =============================================================================
   CASE STUDIES / PORTFOLIO PAGE
   JSON source: Portfolio-Local/index.html
   ============================================================================= */

/* ── Intro Section ── */
/* JSON: block intro — d:643px m:538px — bg: rgba(246,243,236,1) */
.pf-intro {
  background: rgba(246,243,236,1);
  border-top: 1px solid #000;
  min-height: 643px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px 24px;
}
.pf-intro__inner {
  max-width: 639px;
  width: 100%;
  text-align: center;
}
/* JSON: intro_3 Pinyon 150px + intro_2 Oswald 95px — inline, same baseline */
/* title-wrap is inline-block so text-align:center on parent centers the whole group */
.pf-intro__title-wrap {
  display: inline-block;
  margin-bottom: 30px;
  text-align: left;
}
.pf-intro__title {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 95px;
  text-transform: uppercase;
  letter-spacing: -0.05em;
  line-height: 1;
  color: #000;
  display: inline;
}
.pf-intro__initial {
  font-family: 'Pinyon Script', cursive;
  font-weight: 400;
  font-size: 150px;
  line-height: 0.78;
  color: #000;
  display: inline;
  vertical-align: -0.05em;
  text-transform: none;
}
/* JSON: intro_1 — Almarai 400 40px uppercase center lh:1.1 -0.05em */
.pf-intro__subheading {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 40px;
  text-transform: uppercase;
  letter-spacing: -0.05em;
  line-height: 1.1;
  color: #000;
  margin-bottom: 28px;
}
.pf-intro__subheading strong {
  font-weight: 700;
}
/* JSON: intro_0 — Almarai 400 15px justify lh:1.5 */
.pf-intro__body {
  font-family: 'Almarai', sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: #000;
  text-align: justify;
  max-width: 501px;
  margin: 0 auto;
}

/* ── Portfolio Grid ── */
/* JSON: two-columns × 3 — d:602px each, bg:#000 — 2 images per row */
.pf-grid {
  border-top: 1px solid #000;
}
.pf-grid__row {
  display: grid;
  grid-template-columns: 1fr 1px 1fr;
  height: 602px;
  background: #000;
  border-bottom: 1px solid #000;
}
.pf-grid__col {
  overflow: hidden;
  height: 100%;
  cursor: pointer;
}
.pf-grid__link {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.pf-grid__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}
.pf-grid__col:hover .pf-grid__img {
  transform: scale(1.05);
}
/* JSON: two-columns_2 — vertical 1px separator line */
.pf-grid__divider {
  width: 1px;
  background: #000;
  height: 100%;
  flex-shrink: 0;
}

/* ── Dark CTA variant (portfolio page) ── */
/* JSON: call-to-action — d:690px bg:#000 — white text, yellow button */
.svc-cta--dark {
  background: #000;
}
.svc-cta--dark .svc-cta__initial {
  color: #fff;
}
.svc-cta--dark .svc-cta__heading {
  color: #fff;
}

/* ── Tablet 768–1024px ────────────────────────────────────────────── */
@media (max-width: 1024px) and (min-width: 768px) {
  .pf-intro { min-height: 500px; }
  .pf-intro__title { font-size: 72px; }
  .pf-intro__initial { font-size: 115px; }
  .pf-intro__subheading { font-size: 30px; }
  .pf-grid__row { height: 420px; }
}

/* ── Mobile ≤767px ───────────────────────────────────────────────── */
@media (max-width: 767px) {
  /* JSON: m:538px — same bg color on mobile */
  .pf-intro { min-height: 538px; padding: 60px 20px; }
  .pf-intro__title-wrap { margin-bottom: 20px; }
  .pf-intro__title { font-size: 45px; }
  .pf-intro__initial { font-size: 72px; vertical-align: -0.08em; }
  .pf-intro__subheading { font-size: 25px; }
  .pf-intro__body { font-size: 14px; text-align: left; }

  /* JSON: m:650px — stacks to single column, cream bg */
  .pf-grid__row {
    grid-template-columns: 1fr;
    height: auto;
    background: rgba(255,252,248,1);
  }
  .pf-grid__col { height: 325px; }
  .pf-grid__divider { display: none; }
}


/* =============================================================================
   SINGLE PORTFOLIO PAGE
   JSON source: Single Project Duplicate-Local/index.html
   ============================================================================= */

/* ── Title / Hero ── */
.spf-title {
  min-height: 523px;
  background: #000;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid #000;
  position: relative;
}
.spf-title::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.55);
}
.spf-title__inner {
  position: relative;
  z-index: 1;
  max-width: 606px;
  text-align: center;
  padding: 0 24px;
}
.spf-title__heading {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 95px;
  text-transform: uppercase;
  letter-spacing: -0.05em;
  line-height: 1;
  color: #fff;
}

/* ── Details ── */
.spf-details {
  background: #fff;
  border-top: 1px solid #000;
  padding: 60px 0 80px;
}
.spf-details__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 60px;
}
.spf-details__back-wrap { margin-bottom: 80px; }
.spf-details__back {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(29,29,29,1);
  padding: 12px 24px;
  text-decoration: none;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #000;
  transition: background 0.2s;
}
.spf-details__back:hover { background: rgba(0,0,0,0.05); }
.spf-details__back-icon { width: 18px; height: 18px; flex-shrink: 0; display: flex; }
.spf-details__back-icon svg { width: 100%; height: 100%; fill: #000; }
.spf-details__cols {
  display: grid;
  grid-template-columns: 1fr 1px 1fr;
  gap: 0 60px;
  align-items: start;
}
.spf-details__divider { background: #000; align-self: stretch; }
.spf-details__heading {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 40px;
  letter-spacing: -0.05em;
  line-height: 1.1;
  color: #000;
  margin-bottom: 28px;
}
.spf-details__body {
  font-family: 'Almarai', sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: #000;
  text-align: justify;
}
.spf-details__services-label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #000;
  margin-bottom: 16px;
}
.spf-details__services { list-style: none; padding: 0; margin: 0; }
.spf-details__services li {
  font-family: 'Almarai', sans-serif;
  font-size: 15px;
  line-height: 1.8;
  color: #000;
  padding-left: 18px;
  position: relative;
}
.spf-details__services li::before { content: '+'; position: absolute; left: 0; font-weight: 700; }

/* ── Mood Board ── */
/* JSON canvas: 1200×965px — all positions are % of those original dimensions */
.spf-moodboard {
  background: rgba(246,243,236,1);
  border-top: 1px solid #000;
  padding: 0 0 80px;
  overflow: hidden;
}
/* Heading lives INSIDE the canvas, absolutely positioned at JSON y:84 / 965 = 8.7% */
.spf-moodboard__heading {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 65px;
  text-transform: uppercase;
  letter-spacing: -0.05em;
  text-align: center;
  color: #000;
  position: absolute;
  left: 9.67%; top: 8.7%; width: 80.75%;
  margin: 0;
  z-index: 5;
}
.spf-moodboard__canvas {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  height: 965px;
}
.spf-moodboard__backdrop {
  position: absolute;
  left: 17.7%; top: 27.9%;
  width: 49.1%; height: 51.2%;
  background: #000;
  z-index: 1;
}
.spf-moodboard__img { position: absolute; object-fit: cover; z-index: 2; }
/* x/y/w/h ÷ 1200 or 965 to get % */
.spf-moodboard__img--6 { left: 59.7%; top: 20.0%; width: 18.25%; height: 24.6%; }
.spf-moodboard__img--5 { left: 20.9%; top: 21.9%; width: 11.7%;  height: 20.0%; }
.spf-moodboard__img--2 { left: 22.8%; top: 31.9%; width: 24.6%;  height: 43.7%; }
.spf-moodboard__img--1 { left: 42.1%; top: 24.5%; width: 25.9%;  height: 46.4%; z-index: 3; }
.spf-moodboard__img--4 { left: 57.6%; top: 55.2%; width: 19.7%;  height: 32.6%; z-index: 3; }
.spf-moodboard__img--3 { left: 37.3%; top: 67.2%; width: 13.9%;  height: 17.0%; z-index: 4; }
.spf-moodboard__swatches {
  position: absolute;
  left: 74.6%; top: 24.5%;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.spf-moodboard__swatch { width: 120px; height: 40px; border: 1px solid rgba(0,0,0,0.15); }
.spf-moodboard__palette-label {
  position: absolute;
  left: -10px; top: 51.9%;
  transform: translateX(-100%) rotate(-90deg);
  transform-origin: right center;
  font-family: 'Roboto', sans-serif;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(29,29,29,1);
  white-space: nowrap;
  z-index: 2;
}

/* ── Gallery Grid ── */
/* JSON: gallery_0 — 2-col grid, container padding:25px, 4px gap between images */
.spf-gallery {
  background: rgba(246,243,236,1);
  border-top: 1px solid #000;
  padding: 0;
}
.spf-gallery__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 25px;
}
/* 2-column grid — matches Showit gallery layout */
.spf-gallery__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.spf-gallery__item { overflow: hidden; cursor: pointer; }
/* Last odd item spans both columns */
.spf-gallery__item--full { grid-column: 1 / -1; }
.spf-gallery__img {
  width: 100%;
  height: 360px;
  object-fit: cover;
  display: block;
}
.spf-gallery__item--full .spf-gallery__img { height: 500px; }

/* ── Testimonial ── */
.spf-testimonial { background: #000; border-top: none; padding: 80px 24px; }
.spf-testimonial__panel {
  background: transparent;
  max-width: 1054px;
  margin: 0 auto;
  padding: 0;
  text-align: center;
}
.spf-testimonial__quote-mark { width: 80px; margin: 0 auto 28px; opacity: 0.25; }
.spf-testimonial__quote-mark svg { width: 100%; }
.spf-testimonial__quote {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 34px;
  text-transform: uppercase;
  line-height: 1.4;
  letter-spacing: -0.03em;
  color: #fff;
  margin-bottom: 24px;
}
.spf-testimonial__cite {
  font-family: 'Almarai', sans-serif;
  font-size: 18px;
  font-style: normal;
  line-height: 1.7;
  color: rgba(255,255,255,0.7);
  display: block;
}

/* ── Client Spotlight ── */
/* JSON: 1200×790px canvas, content at x:52, divider at x:603 */
.spf-spotlight { background: #fff; border-top: 1px solid #000; }
.spf-spotlight__inner { display: grid; grid-template-columns: 1fr 1px 1fr; min-height: 790px; }
.spf-spotlight__divider { background: #000; }
/* content starts at y:215 → padding-top:215px; bottom leaves 48px (790-742) */
.spf-spotlight__left { padding: 215px 40px 48px 52px; }
.spf-spotlight__heading {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 40px;
  letter-spacing: -0.05em;
  line-height: 1.1;
  color: rgba(29,29,29,1);
  margin-bottom: 22px;
}
.spf-spotlight__heading strong { font-weight: 700; }
.spf-spotlight__body {
  font-family: 'Almarai', sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: #000;
  text-align: justify;
  margin-bottom: 34px;
}
.spf-spotlight__rule { height: 1px; background: #000; margin-bottom: 24px; }
.spf-spotlight__label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0;
  color: #000;
  margin-bottom: 10px;
}
.spf-spotlight__item {
  font-family: 'Almarai', sans-serif;
  font-size: 15px;
  font-style: italic;
  line-height: 1.5;
  color: #000;
  margin-bottom: 34px;
}
.spf-spotlight__right { overflow: hidden; }
.spf-spotlight__photo { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ── Tablet 768–1024px ──────────────────────────────────────────────── */
@media (max-width: 1024px) and (min-width: 768px) {
  .spf-title { min-height: 360px; }
  .spf-title__heading { font-size: 64px; }
  .spf-details__heading { font-size: 30px; }
  .spf-moodboard__heading { font-size: 48px; }
  .spf-moodboard__canvas { height: 720px; }
  .spf-gallery__inner { padding: 20px; }
  .spf-gallery__img { height: 280px; }
  .spf-testimonial { padding: 60px 24px; }
  .spf-testimonial__quote { font-size: 26px; }
  .spf-spotlight__heading { font-size: 30px; }
  .spf-spotlight__left { padding: 120px 40px 48px 48px; }
}

/* ── Mobile ≤767px ─────────────────────────────────────────────────── */
@media (max-width: 767px) {
  .spf-title { min-height: 200px; }
  .spf-title__heading { font-size: 45px; }

  .spf-details { padding: 40px 0 60px; }
  .spf-details__inner { padding: 0 20px; }
  .spf-details__back-wrap { margin-bottom: 40px; }
  .spf-details__cols { grid-template-columns: 1fr; gap: 40px 0; }
  .spf-details__divider { height: 1px; width: 100%; }
  .spf-details__heading { font-size: 25px; }

  .spf-moodboard { padding: 0 0 40px; }
  .spf-moodboard__canvas {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    height: auto;
    position: static;
    max-width: none;
  }
  .spf-moodboard__heading {
    grid-column: 1 / -1;
    position: static !important;
    left: auto !important; top: auto !important;
    width: auto !important;
    font-size: 28px;
    text-align: center;
    margin: 24px 16px 12px;
    z-index: auto;
  }
  .spf-moodboard__backdrop, .spf-moodboard__palette-label { display: none; }
  .spf-moodboard__img {
    position: static !important;
    left: auto !important; top: auto !important;
    width: 100% !important; height: 160px !important;
    display: block;
    object-fit: cover;
  }
  .spf-moodboard__swatches {
    grid-column: 1 / -1;
    position: static !important;
    left: auto !important; top: auto !important;
    flex-direction: row;
    justify-content: center;
    margin: 12px 0 0;
    padding: 0 16px;
  }
  .spf-moodboard__swatch { width: 60px; height: 32px; }

  .spf-gallery__inner { padding: 12px; }
  .spf-gallery__grid { grid-template-columns: 1fr 1fr; gap: 4px; }
  .spf-gallery__img { height: 160px; }
  .spf-gallery__item--full .spf-gallery__img { height: 200px; }

  .spf-testimonial { padding: 50px 20px; }
  .spf-testimonial__quote { font-size: 22px; }
  .spf-testimonial__cite { font-size: 14px; }

  /* Mobile: image on top, text below (Showit m: image at y:22) */
  .spf-spotlight__inner { grid-template-columns: 1fr; grid-template-rows: 380px auto; }
  .spf-spotlight__right { height: 380px; order: -1; }
  .spf-spotlight__divider { display: none; }
  .spf-spotlight__left { padding: 40px 24px 40px; }
  .spf-spotlight__heading { font-size: 26px; }
  .spf-spotlight__body { font-size: 14px; text-align: left; }
}

/* ══════════════════════════════════════════════════════════════════════
   GALLERY LIGHTBOX
   ══════════════════════════════════════════════════════════════════════ */
.spf-lightbox {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.94);
  z-index: 9999;
  align-items: center;
  justify-content: center;
}
.spf-lightbox.is-open { display: flex; }
.spf-lightbox__img-wrap {
  max-width: 90vw;
  max-height: 85vh;
  display: flex;
  align-items: center;
  justify-content: center;
}
.spf-lightbox__img {
  max-width: 90vw;
  max-height: 85vh;
  object-fit: contain;
  display: block;
  user-select: none;
}
.spf-lightbox__close {
  position: absolute;
  top: 20px;
  right: 28px;
  background: none;
  border: none;
  color: #fff;
  font-size: 48px;
  line-height: 1;
  cursor: pointer;
  opacity: 0.7;
  padding: 0;
  transition: opacity 0.2s;
}
.spf-lightbox__close:hover { opacity: 1; }
.spf-lightbox__prev,
.spf-lightbox__next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: #fff;
  font-size: 64px;
  line-height: 1;
  cursor: pointer;
  opacity: 0.6;
  padding: 16px 20px;
  transition: opacity 0.2s;
}
.spf-lightbox__prev:hover,
.spf-lightbox__next:hover { opacity: 1; }
.spf-lightbox__prev { left: 8px; }
.spf-lightbox__next { right: 8px; }
.spf-lightbox__counter {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255,255,255,0.55);
  font-family: 'Almarai', sans-serif;
  font-size: 13px;
  letter-spacing: 0.05em;
  white-space: nowrap;
}
@media (max-width: 767px) {
  .spf-lightbox__prev,
  .spf-lightbox__next { font-size: 40px; padding: 10px 14px; }
  .spf-lightbox__close { font-size: 36px; right: 16px; top: 14px; }
}

/* ══════════════════════════════════════════════════════════════════════
   BLOG ARCHIVE — home.php
   ══════════════════════════════════════════════════════════════════════ */

/* ── Featured hero (black, d:780px) ─────────────────────────────────── */
.blg-hero {
  background: #000;
  overflow: hidden;
}
.blg-hero__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 58% 42%;
  height: 776px; /* same as post-layout-1 */
}
/* Match post-layout-1 exactly: section 776px, image padding 112px top/bottom */
.blg-hero__left {
  padding: 112px 0 112px 41px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.blg-hero__box {
  position: relative;
  width: 100%;
  max-width: 554px;
  border-left: 1px solid rgba(255,255,255,0.9);
  border-right: 1px solid rgba(255,255,255,0.9);
  border-bottom: 2px solid rgba(255,255,255,0.9);
  padding: 44px 48px 52px;
  display: flex;
  flex-direction: column;
  align-items: center; /* center all children */
  flex: 1;
}
/* Top border: 29% each side, gap in middle for label (161/554 = 29%) */
.blg-hero__box::before,
.blg-hero__box::after {
  content: '';
  position: absolute;
  top: 0;
  height: 2px;
  width: 29%;
  background: rgba(255,255,255,0.9);
}
.blg-hero__box::before { left: 0; }
.blg-hero__box::after  { right: 0; }
.blg-hero__label {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: #000;
  padding: 0 20px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0;
  color: rgba(255,255,255,1);
  white-space: nowrap;
}
/* Showit wraps title in <b> → Almarai effectively bold */
.blg-hero__title {
  font-family: 'Almarai', sans-serif;
  font-weight: 700;
  font-size: 38px;
  line-height: 1.1;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  text-align: center;
  color: #fff;
  margin-bottom: 28px;
}
.blg-hero__excerpt {
  font-family: 'Almarai', sans-serif;
  font-size: 24px;
  line-height: 1.4;
  text-align: center;
  color: rgba(255,255,255,0.85);
  margin-bottom: 40px;
}
.blg-hero__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 219px;
  height: 54px;
  background: var(--rmxts1-accent);
  border: 2px solid #000;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0;
  color: #000;
  transition: opacity 0.2s;
}
.blg-hero__btn:hover { opacity: 0.85; }
/* Image right column: same padding as post rows (112px top/bottom) */
.blg-hero__right {
  padding: 112px 0;
  overflow: hidden;
}
.blg-hero__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

/* ── Category bar (yellow bg) ────────────────────────────────────────── */
.blg-cats {
  background: var(--rmxts1-accent);
  padding: 0;
}
.blg-cats__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  height: 56px;
  padding: 0 40px;
  gap: 24px;
  flex-wrap: wrap;
}
.blg-cats__label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #000;
  white-space: nowrap;
}
.blg-cats__divider {
  width: 1px;
  height: 22px;
  background: rgba(0,0,0,0.25);
  flex-shrink: 0;
}
.blg-cats__nav {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.blg-cats__link {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #000;
  transition: opacity 0.2s;
}
.blg-cats__link:hover { opacity: 0.55; }

/* ── READ THE LATEST divider ─────────────────────────────────────────── */
.blg-divider {
  background: rgba(246,243,236,1);
  padding: 28px 40px;
}
.blg-divider__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 24px;
}
.blg-divider__label {
  font-family: 'Almarai', sans-serif;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #000;
  white-space: nowrap;
}
.blg-divider__line {
  flex: 1;
  height: 1px;
  background: rgba(0,0,0,0.2);
}

/* ── Post rows ────────────────────────────────────────────────────────── */
.blg-post { overflow: hidden; }
.blg-post--light { background: #fff; }
.blg-post--cream { background: rgba(246,243,236,1); }

/* post-layout-1 (white): image left 505/1200=42%, text right */
.blg-post__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 42% 58%;
  height: 776px; /* d:776px from JSON */
}
/* post-layout-2 (cream): image right, text left — flip via order */
.blg-post--cream .blg-post__inner {
  grid-template-columns: 58% 42%;
  height: 728px; /* d:728px from JSON */
}
/* Image column: JSON has image at y:112 height:553 in 776px section = 112px top+bottom gap */
.blg-post__img-col {
  overflow: hidden;
  padding: 112px 0; /* matches JSON y:112 top, ~111px bottom */
}
.blg-post--cream .blg-post__img-col {
  padding: 88px 0; /* matches JSON y:88 top, ~87px bottom in 728px section */
  order: 2;
}
.blg-post--cream .blg-post__text-col { order: 1; }

.blg-post__img-link { display: block; width: 100%; height: 100%; }
.blg-post__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 50%;
  display: block;
  transition: transform 0.5s ease;
}
.blg-post__img-col:hover .blg-post__img { transform: scale(1.03); }
.blg-post__text-col {
  padding: 115px 56px 80px 70px; /* top:115 matches category y:115 from JSON */
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.blg-post--cream .blg-post__text-col {
  padding: 88px 70px 80px 98px; /* top:88 matches category y:88 in layout-2 */
}
.blg-post__cat {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0;
  color: #000;
  margin-bottom: 24px;
}
/* st-d-heading: Almarai 400 45px, line-height 1.1, letter-spacing -0.05em, NO uppercase */
.blg-post__title {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 45px;
  line-height: 1.1;
  letter-spacing: -0.05em;
  color: rgba(29,29,29,1);
  margin-bottom: 24px;
}
.blg-post__title a { color: inherit; }
.blg-post__title a:hover { opacity: 0.7; }
/* st-d-paragraph: Almarai 400 15px, line-height 1.5, justify */
.blg-post__excerpt {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.5;
  text-align: justify;
  color: #000;
  margin-bottom: 28px;
  flex: none;
}
/* READ MORE button: yellow rectangle 219×54, 2px black border */
.blg-post__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 219px;
  height: 54px;
  background: var(--rmxts1-accent);
  border: 2px solid #000;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0;
  color: #000;
  transition: opacity 0.2s;
  flex-shrink: 0;
}
.blg-post__btn:hover { opacity: 0.75; }

/* ── Older / Newer pagination ────────────────────────────────────────── */
.blg-page-nav {
  background: rgba(246,243,236,1);
  padding: 0;
}
.blg-page-nav__inner {
  max-width: 1200px;
  margin: 0 auto;
  height: 77px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 48px;
}
.blg-page-nav__older a,
.blg-page-nav__newer a {
  font-family: 'Almarai', sans-serif;
  font-size: 15px;
  font-weight: 400;
  color: #000;
  transition: opacity 0.2s;
}
.blg-page-nav__older a:hover,
.blg-page-nav__newer a:hover { opacity: 0.55; }

/* empty state */
.blg-empty {
  background: rgba(246,243,236,1);
  padding: 80px 40px;
  text-align: center;
  font-family: 'Almarai', sans-serif;
  font-size: 18px;
  color: #000;
}

/* ── Guide CTA (cream, d:392px) ──────────────────────────────────────── */
/* Exact JSON layout: laptop left (60-397), text middle (421-850), arrow+btn right (835-1200) */
.blg-guide {
  background: rgba(246,243,236,1);
  border-top: 1px solid rgba(0,0,0,0.1);
  height: 392px;
  overflow: hidden;
}
.blg-guide__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 420px 1fr 280px;
  height: 392px;
  position: relative;
}
/* Laptop column */
.blg-guide__laptop-col {
  position: relative;
  padding-left: 60px;
  display: flex;
  align-items: center;
}
.blg-guide__laptop-wrap {
  position: relative;
  width: 337px;
  height: 252px;
}
/* Screen image: sits inside laptop at relative positions from JSON:
   frame x:60 y:65 w:337 h:252 → screen x:101 y:106 w:253 h:159
   relative: left=(101-60)/337=12.2%, top=(106-65)/252=16.3%, w=253/337=75.1%, h=159/252=63.1% */
.blg-guide__screen {
  position: absolute;
  top: 16.3%;
  left: 12.2%;
  width: 75.1%;
  height: 63.1%;
  object-fit: cover;
  display: block;
  z-index: 0;
}
.blg-guide__laptop-frame {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
/* Text column: st-d-heading = Almarai 400 40px, line-height 1.1, NO uppercase */
.blg-guide__text-col {
  padding: 104px 24px 0 0;
}
.blg-guide__heading {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 40px;
  line-height: 1.1;
  letter-spacing: -0.05em;
  color: rgba(29,29,29,1);
  margin-bottom: 16px;
}
.blg-guide__body {
  font-family: 'Almarai', sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: #000;
}
/* Button column: arrow at top, yellow button below */
.blg-guide__btn-col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding-top: 84px;
  gap: 0;
}
/* Arrow image: 96×96, rotated 16deg, positioned before button */
.blg-guide__arrow {
  width: 96px;
  height: 96px;
  object-fit: contain;
  transform: rotate(16deg);
  display: block;
  margin-bottom: -8px;
  margin-left: 60px;
}
/* Yellow bordered rectangle button 219×54 */
.blg-guide__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 219px;
  height: 54px;
  background: var(--rmxts1-accent);
  border: 2px solid #000;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0;
  color: #000;
  transition: opacity 0.2s;
}
.blg-guide__btn:hover { opacity: 0.75; }

/* ── Blog Opt-in (cream, diagonal, d:656px) ──────────────────────────── */
/* Mirrors contact page ctc-optin styles — uses blg-optin__ prefix */
.blg-optin {
  background: rgba(246,243,236,1);
  overflow: hidden;
  position: relative;
  min-height: 656px;
}
.blg-optin::before {
  content: '';
  position: absolute;
  width: 700px;
  height: 700px;
  background: var(--rmxts1-accent);
  top: 50%;
  right: -80px;
  transform: translateY(-50%) rotate(45deg);
  z-index: 0;
}
.blg-optin__inner {
  position: relative;
  z-index: 1;
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 380px;
  align-items: center;
  min-height: 656px;
  padding: 60px 40px;
  gap: 40px;
}
.blg-optin__label {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #000;
  margin-bottom: 12px;
}
.blg-optin__heading {
  font-family: 'Oswald', sans-serif;
  font-weight: 600;
  font-size: 38px;
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  color: #000;
  margin-bottom: 20px;
}
.blg-optin__body {
  font-family: 'Almarai', sans-serif;
  font-size: 15px;
  line-height: 1.65;
  color: #000;
  max-width: 400px;
  margin-bottom: 32px;
}
.blg-optin__btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #000;
  transition: opacity 0.2s;
}
.blg-optin__btn:hover { opacity: 0.55; }
.blg-optin__btn-strip {
  display: inline-block;
  width: 36px;
  height: 1px;
  background: #000;
}
.blg-optin__btn-arrow svg { width: 16px; height: 16px; fill: currentColor; }
.blg-optin__visual { position: relative; height: 100%; display: flex; align-items: center; justify-content: center; }
.blg-optin__img-wrap { position: relative; }
.blg-optin__tablet { position: relative; width: 260px; }
.blg-optin__tablet-screen {
  position: absolute;
  top: 8%;
  left: 6%;
  width: 88%;
  height: 76%;
  object-fit: cover;
}
.blg-optin__tablet-frame { width: 100%; position: relative; z-index: 1; }

/* ══════════════════════════════════════════════════════════════════════
   SINGLE BLOG POST — single.php
   ══════════════════════════════════════════════════════════════════════ */
.sng-title {
  min-height: 520px;
  background: #000 no-repeat center center / cover;
  position: relative;
  display: flex;
  align-items: flex-end;
  padding: 0 0 64px;
}
.sng-title__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.7) 100%);
}
.sng-title__inner {
  position: relative;
  z-index: 1;
  max-width: 880px;
  margin: 0 auto;
  width: 100%;
  padding: 0 40px;
}
/* st-d-subheading: Roboto 700 14px uppercase letter-spacing:0 */
.sng-title__cat {
  display: inline-block;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0;
  color: var(--rmxts1-accent);
  margin-bottom: 16px;
}
.sng-title__cat:hover { opacity: 0.8; }
/* st-d-heading: Almarai 400 40px, line-height 1.1, letter-spacing -0.05em — hero gets slight bump to 45px */
.sng-title__heading {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 45px;
  line-height: 1.1;
  letter-spacing: -0.05em;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 20px;
}
/* st-d-paragraph: Almarai 400 15px */
.sng-title__date {
  font-family: 'Almarai', sans-serif;
  font-size: 15px;
  color: rgba(255,255,255,0.6);
  letter-spacing: 0;
}
.sng-content {
  background: #fff;
  padding: 72px 0 80px;
}
.sng-content__inner {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 40px;
  font-family: 'Almarai', sans-serif;
  font-size: 15px;   /* st-d-paragraph: 15px */
  line-height: 1.5;  /* st-d-paragraph: 1.5 */
  color: rgba(0,0,0,1);
}
/* st-d-heading: Almarai 400 40px, line-height 1.1, letter-spacing -0.05em, NO uppercase */
.sng-content__inner h1,
.sng-content__inner h2 {
  font-family: 'Almarai', sans-serif;
  font-weight: 400;
  font-size: 40px;
  line-height: 1.1;
  letter-spacing: -0.05em;
  text-transform: none;
  color: rgba(29,29,29,1);
  margin: 48px 0 16px;
}
.sng-content__inner h1 { font-size: 40px; }
.sng-content__inner h2 { font-size: 40px; }
/* st-d-subheading: Roboto 700 14px uppercase letter-spacing:0 */
.sng-content__inner h3 {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0;
  line-height: 1.2;
  color: #000;
  margin: 32px 0 12px;
}
.sng-content__inner p { margin-bottom: 24px; }
.sng-content__inner ul,
.sng-content__inner ol { margin: 0 0 24px 24px; }
.sng-content__inner li { margin-bottom: 8px; }
.sng-content__inner a { color: #000; text-decoration: underline; }
.sng-content__inner a:hover { opacity: 0.6; }
.sng-content__inner img { max-width: 100%; height: auto; margin: 32px 0; }
.sng-content__inner blockquote {
  border-left: 3px solid var(--rmxts1-accent);
  margin: 32px 0;
  padding: 12px 0 12px 24px;
  font-style: italic;
  font-size: 20px;
  color: #000;
}
.sng-back {
  background: rgba(246,243,236,1);
  padding: 28px 0;
  border-top: 1px solid rgba(0,0,0,0.1);
}
.sng-back__inner {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 40px;
}
.sng-back__link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #000;
  transition: opacity 0.2s;
}
.sng-back__link svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 28; }
.sng-back__link:hover { opacity: 0.55; }

/* ── Blog responsive: tablet 768–1024px ─────────────────────────────── */
@media (max-width: 1024px) and (min-width: 768px) {
  .blg-hero__inner { grid-template-columns: 60% 40%; }
  .blg-hero__title { font-size: 38px; }
  .blg-hero__left { padding: 60px 32px; }
  .blg-hero__box { padding: 36px 36px 48px; }

  .blg-post__inner { height: 560px; }
  .blg-post--cream .blg-post__inner { height: 520px; }
  .blg-post__img-col { padding: 80px 0; }
  .blg-post--cream .blg-post__img-col { padding: 64px 0; }
  .blg-post__text-col { padding: 60px 40px 40px 48px; }
  .blg-post--cream .blg-post__text-col { padding: 60px 48px 40px 40px; }
  .blg-post__title { font-size: 32px; }

  .blg-guide { height: auto; }
  .blg-guide__inner { grid-template-columns: 300px 1fr 220px; height: auto; padding: 40px 32px; }
  .blg-guide__laptop-col { padding-left: 0; }
  .blg-guide__laptop-wrap { width: 260px; height: 194px; }
  .blg-guide__text-col { padding: 0; }
  .blg-guide__heading { font-size: 28px; }
  .blg-guide__btn-col { padding-top: 0; justify-content: center; }

  .sng-title__heading { font-size: 36px; }
}

/* ── Blog responsive: mobile ≤767px ─────────────────────────────────── */
@media (max-width: 767px) {
  /* Hero */
  .blg-hero__inner { grid-template-columns: 1fr; min-height: auto; }
  .blg-hero__right { height: 260px; order: -1; padding: 0; }
  .blg-hero__left { padding: 32px 20px; }
  .blg-hero__box { padding: 32px 24px 40px; }
  .blg-hero__title { font-size: 28px; }
  .blg-hero__excerpt { font-size: 14px; }

  /* Category bar */
  .blg-cats__inner { height: auto; padding: 14px 20px; gap: 12px; }
  .blg-cats__divider { display: none; }
  .blg-cats__nav { gap: 12px; }

  /* Divider */
  .blg-divider { padding: 20px; }

  /* Post rows — stack vertically, image on top */
  .blg-post__inner,
  .blg-post--cream .blg-post__inner {
    grid-template-columns: 1fr;
    height: auto;
  }
  .blg-post__img-col,
  .blg-post--cream .blg-post__img-col { padding: 0; height: 280px; order: -1 !important; }
  .blg-post--cream .blg-post__text-col { order: 1 !important; }
  .blg-post__text-col,
  .blg-post--cream .blg-post__text-col { padding: 32px 20px 40px; }
  .blg-post__title { font-size: 26px; flex: none; }
  .blg-post__excerpt { font-size: 14px; }
  .blg-post__btn { width: 180px; height: 48px; font-size: 13px; }

  /* Pagination */
  .blg-page-nav__inner { padding: 0 20px; }

  /* Guide — stack vertically */
  .blg-guide { height: auto; }
  .blg-guide__inner { grid-template-columns: 1fr; height: auto; padding: 40px 20px; gap: 24px; }
  .blg-guide__laptop-col { padding-left: 0; justify-content: center; }
  .blg-guide__laptop-wrap { width: 240px; height: 180px; }
  .blg-guide__text-col { padding: 0; }
  .blg-guide__heading { font-size: 26px; }
  .blg-guide__btn-col { flex-direction: row; align-items: center; padding-top: 0; gap: 16px; }
  .blg-guide__arrow { width: 60px; height: 60px; margin: 0; transform: rotate(90deg); }

  /* Single post */
  .sng-title { min-height: 320px; padding: 0 0 40px; }
  .sng-title__inner { padding: 0 20px; }
  .sng-title__heading { font-size: 28px; }
  .sng-content { padding: 40px 0 60px; }
  .sng-content__inner { padding: 0 20px; }
  .sng-content__inner h1,
  .sng-content__inner h2 { font-size: 26px; }
  .sng-back__inner { padding: 0 20px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   OPT-IN / FREEBIE PAGE  (prefix: opt-)
   JSON: sib-contact-form — 864px — canvas 1200px
   Title (sie_9): left:187 width:827 → spans both columns, text-align:center
   Label (sie_10): left:406 → right area, text-align:center
   Subheading (sie_8): left:545 text-align:left
   Body (sie_7): left:545 text-align:justify
   Button (sie_3): 46×217 rotated -90° → displayed 217×46 yellow var(--rmxts1-accent) 1px #000
   Tablet (sie_1): left:190 top:289 width:284 height:419 → yellow left column
   Screen (sie_2): offset 6%/4%/89%/86% inside tablet, border-radius:10px
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Section: cream bg + yellow strip via ::before ───────────────────── */
.opt-section {
    position: relative;
    overflow: hidden;
    background: rgba(246,243,236,1);
}

/* Yellow strip: 327px in 1200px canvas, full-bleed left */
.opt-section::before {
    content: '';
    position: absolute;
    top: 0; left: 0; bottom: 0;
    width: calc(50vw - 273px);
    background: var(--rmxts1-accent);
    z-index: 0;
}

/* ── Row 1: label + title — full width, centered in 1200px canvas ────── */
.opt-top {
    position: relative;
    z-index: 1;
    padding: 72px 0 0;
    text-align: center;
}

/* Label — "FREEBIE ALERT" — Roboto 700 14px uppercase center */
.opt-label {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    line-height: 1.2;
    color: rgba(0,0,0,1);
    text-align: center;
    margin: 0 0 8px;
}

/* Title — Oswald 600 95px uppercase center (sie_9-text: text-align:center) */
.opt-title {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 95px;
    text-transform: uppercase;
    letter-spacing: -0.05em;
    line-height: 1;
    color: rgba(0,0,0,1);
    text-align: center;
    margin: 0;
}

/* ── Row 2: two columns — yellow left (tablet) | cream right (content) ─ */
/* Left col = same 327px-in-1200px formula; right col = rest */
.opt-bottom {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: calc(50vw - 273px) 1fr;
    min-height: 580px;
    max-width: 1200px;
    margin: 0 auto;
}

/* Left: inside yellow strip — tablet centered */
.opt-bottom__left {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px 32px 80px;
}

/* Right: cream (from section bg) — content starts at ~545px = 45.4% of 1200 */
.opt-bottom__right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 48px 80px 80px 56px;
}

/* Tablet frame + screen overlay */
.opt-tablet__wrap {
    position: relative;
    width: 284px;
    height: 419px;
    flex-shrink: 0;
}

.opt-tablet__frame {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.opt-tablet__screen {
    position: absolute;
    left: 6%;
    top: 4%;
    width: 89%;
    height: 86%;
    object-fit: cover;
    border-radius: 10px;
    z-index: 1;
}

/* Subheading — Almarai 400 40px left (sie_8-text: text-align:left) */
.opt-subheading {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 40px;
    letter-spacing: -0.05em;
    line-height: 1.1;
    color: rgba(29,29,29,1);
    text-align: left;
    margin: 0 0 16px;
}

/* Body — Almarai 400 15px justify (sie_7-text: text-align:justify) */
.opt-body {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 1.5;
    letter-spacing: 0;
    color: rgba(0,0,0,1);
    text-align: justify;
    margin: 0 0 28px;
    max-width: 456px;
}

/* Download button — 217×46px yellow rect, 1px black border */
.opt-btn {
    display: inline-flex;
    align-items: stretch;
    width: 217px;
    height: 46px;
    background: var(--rmxts1-accent);
    border: 1px solid rgba(0,0,0,1);
    text-decoration: none;
    cursor: pointer;
    flex-shrink: 0;
}

.opt-btn__text {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(0,0,0,1);
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.opt-btn__divider {
    width: 1px;
    background: rgba(0,0,0,1);
    flex-shrink: 0;
    align-self: stretch;
}

.opt-btn__icon {
    width: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.opt-btn__icon svg {
    width: 20px;
    height: 20px;
    fill: rgba(0,0,0,1);
    transform: rotate(90deg);
}

/* ── Opt-in responsive: tablet ≤1024px ───────────────────────────────── */
@media (max-width: 1024px) {
    .opt-title { font-size: 72px; }
    .opt-subheading { font-size: 32px; }
    .opt-tablet__wrap { width: 240px; height: 355px; }
    .opt-bottom__right { padding: 40px 48px 64px 48px; }
}

/* ── Opt-in responsive: mobile ≤767px ────────────────────────────────── */
@media (max-width: 767px) {
    /* Stack vertically — yellow top block, cream bottom */
    .opt-section::before { width: 100%; bottom: auto; height: 460px; }

    .opt-top { padding: 48px 20px 0; text-align: left; }
    .opt-label { text-align: left; }
    .opt-title { font-size: 50px; text-align: left; }

    .opt-bottom { grid-template-columns: 1fr; min-height: auto; max-width: 100%; }
    .opt-bottom__left { padding: 32px 20px 48px; }
    .opt-tablet__wrap { width: 224px; height: 330px; }

    .opt-bottom__right { padding: 40px 20px 60px; }
    .opt-subheading { font-size: 28px; }
    .opt-body { max-width: 100%; }
    .opt-btn { width: 185px; height: 41px; }
    .opt-btn__icon { width: 38px; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   SHOP PAGE  (prefix: shp-)
   Canvas: 1200px  Hero: 289px  Grid bg: #fff
   Card image: 365x365 in 367x367 yellow var(--rmxts1-accent) border:1px #000
   Card gap: 22px  Left pad: 29px
   Title: Almarai 400 24px center  Price: Roboto 700 14px uppercase center
   DETAILS: Mattone 400 9px uppercase letter-spacing:0.3em rgba(60,58,56,1)
   Hover: image opacity->0.1, DETAILS opacity->1 (both 0.5s)
   Badge: black circle 76x76, white 12px text
   ═══════════════════════════════════════════════════════════════════════════ */

@font-face {
    font-family: 'Mattone';
    src: url('/staticdesign/boujeelemon.showit.site/Shop-Local/assets/mattone-150.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* ── Hero: sib-shop-category-heading 289px white ─────────────────────── */
.shp-hero {
    background: #fff;
    height: 289px;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.shp-hero__inner {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    padding: 50px 40px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.shp-hero__label {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    line-height: 1.2;
    color: rgba(0,0,0,1);
    text-align: center;
    margin: 0 0 16px;
}

.shp-hero__title {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 95px;
    text-transform: uppercase;
    letter-spacing: -0.05em;
    line-height: 1;
    color: rgba(0,0,0,1);
    text-align: center;
    margin: 0;
}

/* ── Grid section ─────────────────────────────────────────────────────── */
.shp-grid {
    background: #fff;
    padding-bottom: 80px;
}

.shp-grid__header {
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 40px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.shp-grid__label {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    line-height: 1.2;
    color: rgba(0,0,0,1);
    text-align: center;
    margin: 0;
    height: 46px;
    display: flex;
    align-items: center;
}

/* Decorative line — shop_0: 56px tall stroke rgba(29,29,29,1) */
.shp-grid__line {
    display: block;
    width: 1px;
    height: 56px;
    background: rgba(29,29,29,1);
    margin: 15px auto 0;
}

.shp-grid__wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 43px 29px 0;
}

.shp-grid__inner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

/* ── Product card ─────────────────────────────────────────────────────── */

.shp-card__img-wrap {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    text-decoration: none;
    overflow: hidden;
}

.shp-card__bg {
    position: absolute;
    inset: 0;
    background: var(--rmxts1-accent);
    border: 1px solid rgba(0,0,0,1);
    z-index: 0;
}

.shp-card__img {
    position: absolute;
    inset: 2px;
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    object-fit: cover;
    z-index: 3;
    transition: opacity 0.5s ease;
}

.shp-card__overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

/* DETAILS — Mattone 400 9px uppercase letter-spacing:0.3em rgba(60,58,56,1) */
.shp-card__details {
    font-family: 'Mattone', serif;
    font-weight: 400;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    color: rgba(60,58,56,1);
    line-height: 4.4;
}

.shp-card__img-wrap:hover .shp-card__img     { opacity: 0.1; }
.shp-card__img-wrap:hover .shp-card__overlay { opacity: 1; }

/* Best seller badge — black circle 76x76, white 12px */
.shp-card__badge {
    position: absolute;
    top: -10px;
    left: -10px;
    width: 76px;
    height: 76px;
    border-radius: 50%;
    background: rgba(0,0,0,1);
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.shp-card__badge span {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 12px;
    color: rgba(255,255,255,1);
    text-transform: uppercase;
    line-height: 1.2;
}

/* Card meta */
.shp-card__meta {
    padding: 13px 0 0;
    text-align: center;
}

/* Title — Almarai 400 24px center (sie_4-text font-size:24px override) */
.shp-card__title {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 24px;
    line-height: 1.1;
    letter-spacing: -0.05em;
    color: rgba(29,29,29,1);
    text-align: center;
    margin: 0 0 11px;
}

.shp-card__title a { color: inherit; text-decoration: none; }
.shp-card__title a:hover { text-decoration: underline; }

/* Price — Roboto 700 14px uppercase center (st-d-subheading) */
.shp-card__price {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(0,0,0,1);
    text-align: center;
    margin: 0;
}

.shp-card__price ins { text-decoration: none; }

.shp-empty {
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    color: rgba(0,0,0,0.5);
    grid-column: 1 / -1;
    text-align: center;
    padding: 60px 0;
}

/* ── Pagination ───────────────────────────────────────────────────────── */
.shp-pagination {
    max-width: 1200px;
    margin: 40px auto 0;
    padding: 0 29px;
}

.shp-pagination__inner {
    display: flex;
    justify-content: space-between;
}

.shp-pagination__inner a {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    color: rgba(0,0,0,1);
    text-decoration: none;
}

.shp-pagination__inner a:hover { text-decoration: underline; }

/* ── Responsive: tablet <=1024px ─────────────────────────────────────── */
@media (max-width: 1024px) {
    .shp-hero { height: auto; min-height: 240px; }
    .shp-hero__inner { padding-top: 40px; padding-bottom: 40px; }
    .shp-hero__title { font-size: 72px; }
    .shp-grid__wrap { padding: 40px 20px 0; }
    .shp-grid__inner { gap: 16px; }
    .shp-card__title { font-size: 20px; }
}

/* ── Responsive: mobile <=767px ──────────────────────────────────────── */
@media (max-width: 767px) {
    .shp-hero { height: auto; min-height: 200px; }
    .shp-hero__inner { padding: 40px 20px; }
    .shp-hero__title { font-size: 45px; }
    .shp-grid__header { padding: 24px 20px 0; }
    .shp-grid__wrap { padding: 32px 20px 0; }
    .shp-grid__inner { grid-template-columns: 1fr; gap: 32px; max-width: 320px; margin: 0 auto; }
    .shp-card__title { font-size: 18px; }
    .shp-pagination { padding: 0 20px; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   SINGLE PRODUCT PAGE  (prefix: prd-)
   Canvas: 1200px

   Details: 1178px desktop / 751px mobile — bg:#fff
   Gallery: 748px desktop / 412px mobile  — bg:var(--rmxts1-accent)
   Features: 1547px desktop / 1041px mobile — bg:#fff
   You-might-like: 1354px desktop / 822px mobile — bg:rgba(246,243,236,1)
   ═══════════════════════════════════════════════════════════════════════════ */


/* ── 1. DETAILS section ──────────────────────────────────────────────────── */
/*
 * Image:       left:66  top:94  w:436  h:583
 * Title:       left:600 top:133 font-size:45px Almarai 400
 * Desc:        left:600 top:204 st-d-paragraph 15px justify
 * Feat label:  left:600 top:385 Roboto 700 14px uppercase
 * Feat 2-col:  left:600 / left:901  top:419
 * Price:       left:600 top:594 40px Almarai 400
 * Buy btn:     left:897 top:599 191×44 yellow border:2px #000
 */

.prd-details {
    background: #fff;
    min-height: 1178px;
    position: relative;
    overflow: hidden;
}

/* Top border line (_1) */
.prd-details::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: rgba(29,29,29,1);
}

.prd-details__container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px 0 66px;
}

/* Back-to-shop: left:66 top:41 — Roboto 700 14px uppercase */
.prd-details__topbar {
    padding-top: 41px;
    padding-bottom: 0;
}

.prd-details__back {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(0,0,0,1);
    text-decoration: none;
    line-height: 1.2;
}

.prd-details__back:hover {
    text-decoration: underline;
}

/* Two-column grid: 436px image | gap 98px | 1fr info */
/* Left edge: 66px padding from container; image col: 436px; gap: 98px; right pad ~40px  */
.prd-details__inner {
    display: grid;
    grid-template-columns: 436px 1fr;
    column-gap: 98px;
    padding-top: 53px; /* top:94 – topbar ~41px = 53 */
    padding-bottom: 80px;
    align-items: start;
}

/* Product image — 436×583 */
.prd-details__img-col {
    width: 436px;
}

.prd-details__img {
    display: block;
    width: 436px;
    height: 583px;
    object-fit: cover;
}

/* Info column */
.prd-details__info-col {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* Title: font-size:45px Almarai 400 left-aligned (override st-d-heading center) */
.prd-details__title {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 45px;
    line-height: 1.1;
    letter-spacing: -0.05em;
    color: rgba(29,29,29,1);
    text-align: left;
    margin: 0 0 32px;
}

/* Description: Almarai 400 15px justify */
.prd-details__desc {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 1.6;
    color: rgba(29,29,29,1);
    text-align: justify;
    margin: 0 0 24px;
}

.prd-details__desc p {
    margin: 0;
}

/* "product features" label — Roboto 700 14px uppercase */
/* Spacer: top:385 – top:204 – desc height ~126 = 55px above label */
.prd-details__feat-label {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(0,0,0,1);
    margin: 55px 0 14px;
}

/* Feature columns: 2-col mini grid matching left:600 and left:901 in canvas */
/* Left col w:259, gap 42px, right col w:259 */
.prd-details__feats {
    display: grid;
    grid-template-columns: 259px 1fr;
    column-gap: 42px;
    margin: 0 0 32px;
}

.prd-details__feat-col {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 1.6;
    color: rgba(29,29,29,1);
    text-align: left;
}

.prd-details__feat-col p { margin: 0; }

/* Buy row: price + button on same row */
.prd-details__buy-row {
    display: flex;
    align-items: center;
    gap: 49px; /* gap between price (ends ~848) and button (starts ~897): 897-848=49 */
    margin-top: 16px;
}

/* Price: Almarai 400 40px */
.prd-details__price {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 40px;
    line-height: 1;
    letter-spacing: -0.05em;
    color: rgba(29,29,29,1);
}

.prd-details__price ins {
    text-decoration: none;
}

/* Buy button: 191×44 yellow border:2px #000 — flex row: text | divider | arrow */
.prd-details__btn {
    display: inline-flex;
    align-items: stretch;
    width: 191px;
    height: 44px;
    background: var(--rmxts1-accent);
    border: 2px solid rgba(0,0,0,1);
    text-decoration: none;
    flex-shrink: 0;
}

.prd-details__btn-text {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(0,0,0,1);
    line-height: 3;
    padding: 0 8px;
}

.prd-details__btn-divider {
    display: block;
    width: 1px;
    background: rgba(0,0,0,1);
    flex-shrink: 0;
}

.prd-details__btn-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    flex-shrink: 0;
}

.prd-details__btn-icon svg {
    width: 18px;
    height: 18px;
    color: rgba(0,0,0,1);
}


/* ── 2. GALLERY section ──────────────────────────────────────────────────── */
/*
 * Desktop: 748px — bg:var(--rmxts1-accent)
 * Label "Examples": left:11 top:71 — Roboto 700 14px uppercase
 * Top border line at y:79
 * Gallery strip: top:120 full-width height:480 — horizontal slider
 * Nav rect: bottom-right 137×46 white bg 1px #000 border
 *   left arrow | 1px divider | right arrow
 */

.prd-gallery {
    background: var(--rmxts1-accent);
    min-height: 748px;
    position: relative;
    overflow: hidden;
}

/* Top border line at y:79 */
.prd-gallery::before {
    content: '';
    position: absolute;
    top: 79px;
    left: 0;
    right: 0;
    height: 1px;
    background: rgba(29,29,29,1);
    z-index: 1;
}

/* "Examples" label: left:11 top:71 */
.prd-gallery__header {
    position: absolute;
    top: 71px;
    left: 0;
    right: 0;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 0 0 11px;
    z-index: 2;
}

.prd-gallery__label {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
    line-height: 1.2;
}

/* Gallery slider: starts at y:120, height:480 */
.prd-gallery__slider-wrap {
    position: absolute;
    top: 120px;
    left: 0;
    right: 0;
    height: 480px;
    overflow: hidden;
}

.prd-gallery__track {
    display: flex;
    height: 100%;
    transition: transform 0.4s ease;
    will-change: transform;
}

.prd-gallery__slide {
    flex: 0 0 100%;
    height: 100%;
}

.prd-gallery__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Nav: bottom-right of section — 137px wide × 46px tall, white bg, 1px #000 border */
/* In canvas: left:1096 of 1200 → right side. top:588 */
.prd-gallery__nav {
    position: absolute;
    bottom: calc(748px - 588px - 46px); /* = 114px from bottom */
    right: calc(1200px - 1096px - 137px); /* = -33px... let's use right:0 aligned */
    right: 0;
    bottom: 110px;
    display: flex;
    align-items: stretch;
    width: 137px;
    height: 46px;
    background: rgba(255,255,255,1);
    border: 1px solid rgba(0,0,0,1);
    z-index: 5;
}

.prd-gallery__prev,
.prd-gallery__next {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    color: rgba(0,0,0,1);
    transition: background 0.2s;
}

.prd-gallery__prev:hover,
.prd-gallery__next:hover {
    background: rgba(0,0,0,0.05);
}

.prd-gallery__nav-divider {
    display: block;
    width: 1px;
    background: rgba(0,0,0,1);
    flex-shrink: 0;
}


/* ── 3. FEATURES section ─────────────────────────────────────────────────── */
/*
 * Desktop: 1547px — bg:#fff — canvas:1200px
 * _15 heading: left:231 top:122 w:741 h:100 — uppercase center
 * _0  vertical divider: x:600 y:265–915 (h:650) rgba(29,29,29,1)
 * _1  horizontal div 1: y:479 w:900 from x:150
 * _2  horizontal div 2: y:700 w:900 from x:150
 * Feature title: Roboto 700 14px uppercase center
 * Feature body:  Almarai 400 15px center
 * Left col: x:140–590  Right col: x:610–1060
 */

.prd-features {
    background: #fff;
    min-height: 1547px;
    padding-bottom: 80px;
}

.prd-features__container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
}

/* Section heading: top:122, centered, uppercase — Almarai 400 40px */
.prd-features__heading {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 40px;
    line-height: 1.2;
    letter-spacing: -0.05em;
    text-transform: uppercase;
    text-align: center;
    color: rgba(29,29,29,1);
    margin: 0;
    padding-top: 122px;
    padding-bottom: 20px; /* space before grid starts at ~y:265 */
}

/* Feature grid: 2 cols with center vertical divider */
/* Left col occupies x:140–590 of 1200 canvas, right: x:610–1060 */
/* In 1200px container: left edge = 140–40(padding)=100px, right edge = 1060–40=1020px */
.prd-features__grid {
    padding: 0;
    margin-top: 20px;
}

/* Each row: 3 columns — left | 1px divider | right */
.prd-features__row {
    display: grid;
    grid-template-columns: 1fr 1px 1fr;
    column-gap: 0;
    padding: 50px 0;
    position: relative;
}

/* Horizontal border between rows (_1 at y:479, _2 at y:700) */
.prd-features__row--bordered {
    border-bottom: 1px solid rgba(29,29,29,1);
}

/* Vertical divider column */
.prd-features__vdivider {
    background: rgba(29,29,29,1);
    width: 1px;
    min-height: 100%;
}

/* Feature cell */
.prd-features__cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 0 50px;
}

/* Feature title: Roboto 700 14px uppercase center */
.prd-features__feat-title {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
    text-align: center;
    margin: 0 0 16px;
}

/* Feature body: Almarai 400 15px center */
.prd-features__feat-body {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    line-height: 1.6;
    color: rgba(29,29,29,1);
    text-align: center;
    margin: 0;
}


/* ── 4. YOU MIGHT LIKE section ───────────────────────────────────────────── */
/*
 * Desktop: 1354px — bg:rgba(246,243,236,1)
 * _19 heading: w:1161 h:73 — uppercase center — Almarai 400 40px
 * Same shp-card grid (3 cols) with DETAILS hover
 */

.prd-yml {
    background: rgba(246,243,236,1);
    min-height: 1354px;
    padding-bottom: 80px;
}

.prd-yml__container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
}

/* Heading: "You Might Also Like" uppercase center Almarai 400 40px */
.prd-yml__heading {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 40px;
    line-height: 1.2;
    letter-spacing: -0.05em;
    text-transform: uppercase;
    text-align: center;
    color: rgba(29,29,29,1);
    margin: 0;
    padding-top: 80px;
    padding-bottom: 40px;
}

/* Grid: same 3-col layout as shop */
.prd-yml__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

/* Card bg is transparent in you-might-like (_yml card bg: rgba(255,252,248,0)) */
.prd-yml__card .shp-card__bg {
    background: rgba(255,252,248,0);
}

/* Mobile price in yml uses Mattone 9px per JSON */
.prd-yml__price {
    font-family: 'Mattone', serif;
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    color: rgba(29,29,29,1);
    line-height: 1.2;
}


/* ── Responsive: tablet <=1024px ─────────────────────────────────────────── */
@media (max-width: 1024px) {

    /* Details */
    .prd-details { min-height: auto; }
    .prd-details__container { padding-left: 40px; }
    .prd-details__inner { column-gap: 48px; padding-top: 40px; }
    .prd-details__img-col { width: 320px; }
    .prd-details__img { width: 320px; height: 428px; }
    .prd-details__title { font-size: 36px; }
    .prd-details__price { font-size: 32px; }

    /* Gallery */
    .prd-gallery { min-height: 600px; }
    .prd-gallery__slider-wrap { top: 110px; height: 380px; }

    /* Features */
    .prd-features { min-height: auto; }
    .prd-features__heading { font-size: 32px; padding-top: 80px; }
    .prd-features__cell { padding: 0 30px; }

    /* YML */
    .prd-yml { min-height: auto; }
    .prd-yml__heading { font-size: 32px; }
}


/* ── Responsive: mobile <=767px ──────────────────────────────────────────── */
@media (max-width: 767px) {

    /* Details: stacked layout */
    .prd-details { min-height: 751px; }
    .prd-details__container { padding: 0 20px; }
    .prd-details__topbar { padding-top: 24px; }
    .prd-details__inner {
        grid-template-columns: 1fr;
        column-gap: 0;
        padding-top: 24px;
    }
    .prd-details__img-col { width: 100%; }
    .prd-details__img { width: 100%; height: auto; aspect-ratio: 436/583; }
    .prd-details__info-col { margin-top: 32px; }
    .prd-details__title { font-size: 30px; }
    .prd-details__price { font-size: 30px; }
    .prd-details__feats { grid-template-columns: 1fr 1fr; column-gap: 16px; }
    .prd-details__buy-row { flex-wrap: wrap; gap: 16px; }
    .prd-details__feat-label { margin-top: 24px; }

    /* Gallery */
    .prd-gallery { min-height: 412px; }
    .prd-gallery__slider-wrap { top: 100px; height: 260px; }
    .prd-gallery__nav {
        width: 100px;
        height: 36px;
        bottom: 20px;
    }

    /* Features */
    .prd-features { min-height: 1041px; }
    .prd-features__container { padding: 0 20px; }
    .prd-features__heading { font-size: 28px; padding-top: 60px; }
    .prd-features__row {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        gap: 24px;
        padding: 32px 0;
    }
    .prd-features__vdivider {
        width: 100%;
        height: 1px;
        min-height: 0;
    }
    .prd-features__cell { padding: 0; }

    /* You might like */
    .prd-yml { min-height: 822px; }
    .prd-yml__container { padding: 0 20px; }
    .prd-yml__heading { font-size: 28px; padding-top: 48px; }
    .prd-yml__grid { grid-template-columns: 1fr; gap: 32px; max-width: 320px; margin: 0 auto; }
    .prd-yml__price {
        font-family: 'Mattone', serif;
        font-size: 9px;
        text-transform: uppercase;
        letter-spacing: 0.3em;
    }
}

/* ═══════════════════════════════════════════════════════════════════════════
   PRODUCT PAGE — CORRECTIONS (override earlier prd- rules)
   Gallery: proper horizontal drag/swipe strip
   Product image: consistent sizing
   You-might-like: no min-height (section only renders when products exist)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Product image: consistent fixed sizing ──────────────────────────────── */
.prd-details__img-col {
    width: 436px;
    flex-shrink: 0;
}
.prd-details__img {
    display: block;
    width: 436px;
    height: 583px;
    object-fit: cover;
    object-position: center top;
}

/* ── Gallery: full rewrite ───────────────────────────────────────────────── */

.prd-gallery {
    background: var(--rmxts1-accent);
    overflow: hidden;
    padding: 71px 0 60px;
    min-height: 0; /* let content drive height */
}

/* Remove old absolute ::before — replace with inline header-line */
.prd-gallery::before { display: none; }

/* Header: label flush-left at left:11, line extends full-width at y:79 */
.prd-gallery__header {
    position: static;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0 0 0 11px;
    margin-bottom: 41px; /* strip starts at ~y:120 from section top; 71+41=112 ≈ 120 */
}

.prd-gallery__label {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
    line-height: 1;
    white-space: nowrap;
    flex-shrink: 0;
}

/* The horizontal line that extends from the label to the right edge */
.prd-gallery__header-line {
    display: block;
    flex: 1;
    height: 1px;
    background: rgba(29,29,29,1);
}

/* ── Horizontal drag/swipe strip ── */
.prd-gallery__strip {
    display: flex;
    gap: 6px;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
    /* Remove old slider-wrap absolute styles */
    position: static;
    height: 480px;
    width: 100%;
}
.prd-gallery__strip::-webkit-scrollbar { display: none; }
.prd-gallery__strip--grabbing { cursor: grabbing; }

/* Remove old slider-wrap absolute element entirely */
.prd-gallery__slider-wrap { display: none; }

.prd-gallery__slide {
    flex: 0 0 auto;
    width: 420px;      /* ~2.8 visible in 1200px container */
    height: 480px;
    scroll-snap-align: start;
    overflow: hidden;
}

.prd-gallery__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    pointer-events: none; /* prevent native image drag interfering */
}

/* ── Nav: [←][|][→] white 137×46 right-aligned below strip ── */
.prd-gallery__nav-wrap {
    display: flex;
    align-items: stretch;
    width: 137px;
    height: 46px;
    background: rgba(255,255,255,1);
    border: 1px solid rgba(0,0,0,1);
    margin: 24px 0 0 auto; /* push to right edge */
    /* Remove old absolute nav positioning */
    position: static;
}

/* Hide old nav (absolute-positioned) */
.prd-gallery__nav { display: none; }

.prd-gallery__btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    color: rgba(0,0,0,1);
    transition: background 0.15s;
}
.prd-gallery__btn:hover { background: rgba(0,0,0,0.06); }
.prd-gallery__btn svg { pointer-events: none; }

.prd-gallery__nav-divider {
    display: block;
    width: 1px;
    background: rgba(0,0,0,1);
    flex-shrink: 0;
}

/* ── You-might-like: no forced min-height (section absent = no gap) ── */
.prd-yml {
    background: rgba(246,243,236,1);
    min-height: 0;
    padding-bottom: 80px;
}

/* ── Responsive overrides ────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .prd-details__img-col { width: 300px; }
    .prd-details__img     { width: 300px; height: 401px; }
    .prd-gallery__slide   { width: 320px; height: 380px; }
    .prd-gallery__strip   { height: 380px; }
}

@media (max-width: 767px) {
    .prd-details__img-col { width: 100%; }
    .prd-details__img     { width: 100%; height: auto; aspect-ratio: 436 / 583; }
    .prd-gallery__slide   { width: 260px; height: 300px; }
    .prd-gallery__strip   { height: 300px; }
    .prd-gallery          { padding: 40px 0 40px; }
    .prd-gallery__header  { padding-left: 16px; margin-bottom: 24px; }
    .prd-gallery__nav-wrap { margin-right: 16px; }
    .prd-yml__grid        { grid-template-columns: 1fr; gap: 32px; max-width: 320px; margin: 0 auto; }
    .prd-yml__heading     { font-size: 28px; padding-top: 48px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   PRODUCT PAGE — FIX 2
   Remove min-heights causing blank white spaces
   Swiper gallery styles
   Fix yml price font
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Kill the forced min-heights that create blank spaces ─────────────────── */
.prd-details  { min-height: 0; }
.prd-features { min-height: 0; padding-bottom: 60px; }
.prd-yml      { min-height: 0; }

/* ── Gallery: Swiper-based strip ─────────────────────────────────────────── */
.prd-gallery {
    background: var(--rmxts1-accent);
    overflow: hidden;
    padding: 71px 0 40px;
    min-height: 0;
}

.prd-gallery::before { display: none; } /* remove old absolute border */

.prd-gallery__header {
    position: static;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0 0 0 11px;
    margin-bottom: 41px; /* aligns strip start to ~y:120 from section top */
}

.prd-gallery__header-line {
    display: block;
    flex: 1;
    height: 1px;
    background: rgba(29,29,29,1);
}

/* Swiper container: full-width, no overflow clip so edges bleed */
.prd-gallery__swiper {
    width: 100%;
    overflow: visible; /* let slides peek at edges */
    height: 480px;
}

/* Clip only the strip area, not the whole section */
.prd-gallery__swiper-clip {
    overflow: hidden;
}

/* Each slide: fixed width, full strip height */
.prd-gallery .swiper-wrapper { align-items: stretch; }

.prd-gallery__slide {
    width: 420px !important; /* Swiper respects width when slidesPerView:'auto' */
    height: 480px;
    flex-shrink: 0;
}

.prd-gallery__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    pointer-events: none;
    user-select: none;
}

/* Hide old scroll-based strip elements */
.prd-gallery__strip,
.prd-gallery__slider-wrap,
.prd-gallery__track,
.prd-gallery__nav { display: none; }

/* Nav wrap: [←][|][→] white 137×46 right-aligned */
.prd-gallery__nav-wrap {
    position: static;
    display: flex;
    align-items: stretch;
    width: 137px;
    height: 46px;
    background: rgba(255,255,255,1);
    border: 1px solid rgba(0,0,0,1);
    margin: 20px 0 0 auto;
}

.prd-gallery__btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    color: rgba(0,0,0,1);
    transition: background 0.15s;
    /* Override Swiper disabled state */
    opacity: 1 !important;
}
.prd-gallery__btn:hover { background: rgba(0,0,0,0.06); }
.prd-gallery__btn.swiper-button-disabled { opacity: 0.35 !important; }

.prd-gallery__nav-divider {
    display: block;
    width: 1px;
    background: rgba(0,0,0,1);
    flex-shrink: 0;
}

/* ── You might also like: fix price font ─────────────────────────────────── */
/* Override the 9px Mattone — use same Roboto 14px as shop grid */
.prd-yml__price,
.prd-yml .shp-card__price {
    font-family: 'Roboto', sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    letter-spacing: 0 !important;
    color: rgba(0,0,0,1) !important;
    text-align: center !important;
}

/* ── Features section: remove internal padding that adds blank space ───────── */
.prd-features__heading { padding-top: 80px; }
.prd-features__grid { margin-top: 0; }
.prd-features__row { padding: 40px 0; }

/* ── Details section: remove bottom space between content and gallery ──────── */
.prd-details { padding-bottom: 0; }
.prd-details__container { padding-bottom: 60px; }

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .prd-gallery__swiper { height: 380px; }
    .prd-gallery__slide  { width: 320px !important; height: 380px; }
}

@media (max-width: 767px) {
    .prd-gallery { padding: 40px 0 32px; }
    .prd-gallery__header { padding-left: 16px; margin-bottom: 20px; }
    .prd-gallery__swiper { height: 280px; }
    .prd-gallery__slide  { width: 240px !important; height: 280px; }
    .prd-gallery__nav-wrap { margin-right: 16px; }
    .prd-features__heading { font-size: 24px; padding-top: 48px; }
    .prd-features__row { padding: 28px 0; }
}

/* ── You might also like: border always visible (no yellow fill) ─────────── */
.prd-yml__card .shp-card__bg {
    background: transparent;
    border: 1px solid rgba(0,0,0,1);
}

/* ── yml cards: inset box-shadow so border never gets clipped ─────────────── */
.prd-yml__card .shp-card__img-wrap {
    box-shadow: inset 0 0 0 1px rgba(0,0,0,1);
}
.prd-yml__card .shp-card__bg {
    background: transparent;
    border: none;
}

/* ═══════════════════════════════════════════════════════════════════════════
   FIX 3 — three issues
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1. yml border: pseudo-element at z-index:10, always on top of image ─── */
.prd-yml__card .shp-card__img-wrap {
    box-shadow: none;
}
.prd-yml__card .shp-card__bg {
    background: transparent !important;
    border: none !important;
}
.prd-yml__card .shp-card__img-wrap::after {
    content: '';
    position: absolute;
    inset: 0;
    border: 1px solid rgba(0,0,0,1);
    z-index: 10;
    pointer-events: none;
}

/* ── 2. Gallery slides: force consistent height regardless of image ratio ─── */
.prd-gallery__slide {
    height: 480px !important;
    overflow: hidden;
}
.prd-gallery__img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}

/* ── 3. Footer photos: !important overrides WooCommerce img { height:auto } ─ */
.footer-photo {
    height: 215px !important;
    width: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

@media (max-width: 1024px) {
    .prd-gallery__slide { height: 380px !important; }
}
@media (max-width: 767px) {
    .prd-gallery__slide { height: 280px !important; }
    .footer-photo { height: 160px !important; }
}

/* ── All shp-cards: ::after border always on top, never clipped ──────────── */
.shp-card__img-wrap::after {
    content: '';
    position: absolute;
    inset: 0;
    border: 1px solid rgba(0,0,0,1);
    z-index: 10;
    pointer-events: none;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ARCHIVE / CATEGORY / TAG  (prefix: arc-)
   Reuses blg- post-row cards + blg- CSS, adds archive header
   ═══════════════════════════════════════════════════════════════════════════ */

.arc-hero {
    background: #fff;
    border-bottom: 1px solid rgba(29,29,29,0.12);
    padding: 60px 40px 48px;
    text-align: center;
}

.arc-hero__inner {
    max-width: 800px;
    margin: 0 auto;
}

.arc-hero__label {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(0,0,0,0.45);
    margin: 0 0 12px;
}

.arc-hero__title {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 72px;
    text-transform: uppercase;
    letter-spacing: -0.04em;
    line-height: 1;
    color: rgba(0,0,0,1);
    margin: 0 0 16px;
}

.arc-hero__desc {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.6;
    color: rgba(29,29,29,0.7);
    margin: 0;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}

/* Posts list reuses blg-post rows — no extra wrapper needed */
.arc-posts { }

/* Empty state */
.arc-empty {
    max-width: 600px;
    margin: 80px auto;
    text-align: center;
    font-family: 'Almarai', sans-serif;
    font-size: 18px;
    color: rgba(29,29,29,0.6);
    padding: 0 40px;
}

.arc-empty__link {
    display: inline-block;
    margin-top: 20px;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(0,0,0,1);
    text-decoration: none;
}
.arc-empty__link:hover { text-decoration: underline; }

/* Pagination */
.arc-pagination {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 40px 60px;
}

.arc-pagination__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.arc-pagination__inner a {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(0,0,0,1);
    text-decoration: none;
}
.arc-pagination__inner a:hover { text-decoration: underline; }

/* Responsive */
@media (max-width: 767px) {
    .arc-hero { padding: 40px 20px 32px; }
    .arc-hero__title { font-size: 42px; }
    .arc-pagination { padding: 32px 20px 48px; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   ACCENT COLOR  — replace all hardcoded var(--rmxts1-accent) / var(--rmxts1-accent)
   with var(--rmxts1-accent) set dynamically in header.php
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Opt-in page ── */
.opt-section::before                { background: var(--rmxts1-accent); }
.opt-btn                            { background: var(--rmxts1-accent); }

/* ── Shop grid card background ── */
.shp-card__bg                       { background: var(--rmxts1-accent); }

/* ── Product: buy button + gallery section ── */
.prd-details__btn                   { background: var(--rmxts1-accent); }
.prd-gallery                        { background: var(--rmxts1-accent); }

/* ── Blog hero box accent strip ── */
.blg-hero__box::before,
.blg-hero__box::after               { background: var(--rmxts1-accent); }

/* ── Read More / CTA buttons across blog ── */
.blg-post__btn,
.blg-hero__btn                      { background: var(--rmxts1-accent); }

/* ── Home page yellow backgrounds (full-bleed strips) ── */
.home-hero::before,
.home-about::before,
.home-services::before              { background: var(--rmxts1-accent); }

/* ── Contact optin section ── */
.contact-optin,
.contact-optin__cta                 { background: var(--rmxts1-accent); }

/* ── Any remaining inline yellow bg utility ── */
[style*="248,249,111"],
[style*="f8f96f"]                   { background-color: var(--rmxts1-accent) !important; }

/* ── Blog hero box lines: restore white (these sit on black bg, not accent) ─ */
.blg-hero__box::before,
.blg-hero__box::after { background: rgba(255,255,255,0.9) !important; }

/* ═══════════════════════════════════════════════════════════════════════════
   WOOCOMMERCE PAGES — Cart · Checkout · My Account
   Fonts: Oswald (headings) · Almarai (body) · Roboto (labels/buttons)
   Color: var(--rmxts1-accent) for all accent elements
   Max-width: 1200px centered
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Shared WC page wrapper ─────────────────────────────────────────────── */
.wc-cart,
.wc-checkout,
.wc-account {
    background: #fff;
    min-height: 60vh;
}

/* WooCommerce notices */
.woocommerce-notices-wrapper,
.wc-cart .woocommerce-error,
.wc-cart .woocommerce-message,
.wc-cart .woocommerce-info,
.wc-checkout .woocommerce-error,
.wc-checkout .woocommerce-message {
    max-width: 1200px;
    margin: 0 auto;
    padding: 16px 40px;
    list-style: none;
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
}

.woocommerce-message { color: #3a6b35; background: #f0faf0; border-left: 4px solid #3a6b35; }
.woocommerce-error   { color: #a94442; background: #fdf2f2; border-left: 4px solid #a94442; }
.woocommerce-info    { color: #31708f; background: #f0f8ff; border-left: 4px solid #31708f; }

/* Shared page header */
.wc-cart__header,
.wc-checkout__header,
.wc-account__header {
    border-bottom: 1px solid rgba(29,29,29,0.1);
    padding: 48px 40px 36px;
}

.wc-cart__header-inner,
.wc-checkout__header-inner,
.wc-account__header-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
}

.wc-cart__title,
.wc-checkout__title,
.wc-account__title {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 56px;
    text-transform: uppercase;
    letter-spacing: -0.04em;
    line-height: 1;
    color: rgba(0,0,0,1);
    margin: 0;
}

.wc-cart__continue,
.wc-checkout__back {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgba(0,0,0,0.5);
    text-decoration: none;
}
.wc-cart__continue:hover,
.wc-checkout__back:hover { color: rgba(0,0,0,1); }


/* ═══════════════════════════════════════════════════════════════════════════
   CART PAGE
   ═══════════════════════════════════════════════════════════════════════════ */

.wc-cart__form {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
}

/* Items table */
.wc-cart__items {
    width: 100%;
    margin-top: 32px;
}

.wc-cart__row {
    display: grid;
    grid-template-columns: 2.5fr 1fr 1fr 1fr 40px;
    align-items: center;
    gap: 16px;
    padding: 18px 0;
    border-bottom: 1px solid rgba(29,29,29,0.1);
}

.wc-cart__row--head {
    border-bottom: 2px solid rgba(0,0,0,1);
    padding-bottom: 12px;
}

.wc-cart__col {
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
    color: rgba(29,29,29,1);
}

.wc-cart__row--head .wc-cart__col {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 12px;
    color: rgba(0,0,0,0.5);
}

/* Product cell */
.wc-cart__product {
    display: flex;
    align-items: center;
    gap: 20px;
}

.wc-cart__thumb-link img,
.wc-cart__product img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    display: block;
    flex-shrink: 0;
    border: 1px solid rgba(0,0,0,0.08);
}

.wc-cart__product-name {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: rgba(0,0,0,1);
    text-decoration: none;
    line-height: 1.3;
    display: block;
}
.wc-cart__product-name:hover { text-decoration: underline; }

/* Price / subtotal */
.wc-cart__col--price,
.wc-cart__col--subtotal {
    font-family: 'Almarai', sans-serif;
    font-size: 16px;
    font-weight: 400;
}

.wc-cart__col--subtotal { font-weight: 600; }

/* Qty input */
.wc-cart__col--qty .quantity { display: flex; align-items: center; gap: 0; }

.wc-cart__col--qty .qty {
    width: 64px;
    height: 40px;
    border: 1px solid rgba(0,0,0,0.2);
    text-align: center;
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    padding: 0 8px;
    background: #fff;
    border-radius: 0;
    -moz-appearance: textfield;
}
.wc-cart__col--qty .qty::-webkit-inner-spin-button { -webkit-appearance: none; }

/* Remove button */
.wc-cart__remove {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    font-size: 14px;
    color: rgba(0,0,0,0.4);
    text-decoration: none;
    transition: color 0.2s;
    border: 1px solid transparent;
}
.wc-cart__remove:hover { color: rgba(0,0,0,1); border-color: rgba(0,0,0,0.2); }

/* Cart actions row */
.wc-cart__actions {
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 40px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}

.wc-cart__coupon {
    display: flex;
    align-items: center;
    gap: 0;
}

.wc-cart__coupon-input {
    height: 44px;
    width: 220px;
    border: 1px solid rgba(0,0,0,0.2);
    border-right: none;
    padding: 0 16px;
    font-family: 'Almarai', sans-serif;
    font-size: 14px;
    outline: none;
}
.wc-cart__coupon-input:focus { border-color: rgba(0,0,0,0.5); }

.wc-cart__coupon-btn {
    height: 44px;
    padding: 0 20px;
    background: rgba(0,0,0,1);
    color: #fff;
    border: none;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: opacity 0.2s;
}
.wc-cart__coupon-btn:hover { opacity: 0.8; }

.wc-cart__update-btn {
    height: 44px;
    padding: 0 24px;
    background: transparent;
    color: rgba(0,0,0,1);
    border: 1px solid rgba(0,0,0,0.3);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.2s;
}
.wc-cart__update-btn:hover { background: rgba(0,0,0,1); color: #fff; border-color: rgba(0,0,0,1); }

/* Cart totals */
.wc-cart__totals-wrap {
    max-width: 1200px;
    margin: 40px auto 60px;
    padding: 0 40px;
    display: flex;
    justify-content: flex-end;
}

.wc-cart__totals-inner {
    width: 420px;
    max-width: 100%;
}

/* WC cart_totals generated block */
.cart_totals h2,
.cart-collaterals h2 {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 20px;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    margin: 0 0 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid rgba(0,0,0,1);
}

.cart_totals .shop_table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
}

.cart_totals .shop_table th,
.cart_totals .shop_table td {
    padding: 12px 0;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    text-align: left;
}

.cart_totals .shop_table th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgba(0,0,0,0.5);
    width: 40%;
}

.cart_totals .order-total td,
.cart_totals .order-total th {
    font-size: 18px;
    font-weight: 700;
    color: rgba(0,0,0,1);
    border-bottom: none;
    padding-top: 16px;
}

.wc-proceed-to-checkout .checkout-button,
.cart_totals .checkout-button {
    display: block;
    width: 100%;
    height: 52px;
    background: var(--rmxts1-accent);
    color: rgba(0,0,0,1);
    border: 2px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-decoration: none;
    text-align: center;
    line-height: 50px;
    margin-top: 20px;
    transition: opacity 0.2s;
}
.wc-proceed-to-checkout .checkout-button:hover { opacity: 0.85; }

/* Empty cart */
.wc-cart__empty {
    max-width: 600px;
    margin: 80px auto;
    text-align: center;
    padding: 0 40px;
    font-family: 'Almarai', sans-serif;
    font-size: 18px;
    color: rgba(0,0,0,0.5);
}

.wc-cart__empty .return-to-shop a {
    display: inline-block;
    margin-top: 24px;
    padding: 0 32px;
    height: 48px;
    line-height: 48px;
    background: var(--rmxts1-accent);
    border: 2px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(0,0,0,1);
    text-decoration: none;
}


/* ═══════════════════════════════════════════════════════════════════════════
   CHECKOUT PAGE
   ═══════════════════════════════════════════════════════════════════════════ */

.wc-checkout__form {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px 60px;
}

.wc-checkout__body {
    display: grid;
    grid-template-columns: 1fr 440px;
    gap: 60px;
    margin-top: 40px;
    align-items: start;
}

/* Left: billing/shipping */
.wc-checkout__left h3,
.wc-checkout__notes h3 {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 20px;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    margin: 0 0 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid rgba(0,0,0,1);
}

/* WC form fields */
.woocommerce-billing-fields .form-row,
.woocommerce-shipping-fields .form-row,
.woocommerce-additional-fields .form-row {
    margin: 0 0 16px;
}

.woocommerce-billing-fields .form-row label,
.woocommerce-shipping-fields .form-row label,
.woocommerce-additional-fields .form-row label {
    display: block;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(0,0,0,0.6);
    margin-bottom: 6px;
}

.woocommerce-billing-fields .form-row .input-text,
.woocommerce-shipping-fields .form-row .input-text,
.woocommerce-billing-fields .form-row select,
.woocommerce-shipping-fields .form-row select,
.woocommerce-additional-fields .form-row textarea,
.woocommerce-billing-fields .woocommerce-input-wrapper input,
.woocommerce-billing-fields .woocommerce-input-wrapper select,
.woocommerce-shipping-fields .woocommerce-input-wrapper input,
.woocommerce-shipping-fields .woocommerce-input-wrapper select {
    width: 100%;
    height: 48px;
    border: 1px solid rgba(0,0,0,0.2);
    padding: 0 16px;
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    color: rgba(0,0,0,1);
    background: #fff;
    outline: none;
    border-radius: 0;
    -webkit-appearance: none;
    appearance: none;
    transition: border-color 0.2s;
}

.woocommerce-additional-fields .form-row textarea {
    height: 120px;
    padding: 14px 16px;
    resize: vertical;
}

.woocommerce-billing-fields .woocommerce-input-wrapper input:focus,
.woocommerce-shipping-fields .woocommerce-input-wrapper input:focus,
.woocommerce-billing-fields .form-row .input-text:focus,
.woocommerce-shipping-fields .form-row .input-text:focus {
    border-color: rgba(0,0,0,0.6);
}

/* Half-width fields side-by-side */
.woocommerce-billing-fields .form-row-first,
.woocommerce-billing-fields .form-row-last,
.woocommerce-shipping-fields .form-row-first,
.woocommerce-shipping-fields .form-row-last {
    width: calc(50% - 8px);
    display: inline-block;
    vertical-align: top;
}
.woocommerce-billing-fields .form-row-first,
.woocommerce-shipping-fields .form-row-first { margin-right: 16px; }

/* Checkbox rows */
.woocommerce-billing-fields .form-row input[type="checkbox"],
.woocommerce-shipping-fields .form-row input[type="checkbox"] {
    width: auto;
    height: auto;
    margin-right: 8px;
    accent-color: var(--rmxts1-accent);
}

/* Right: order summary */
.wc-checkout__right {
    background: rgba(246,243,236,1);
    padding: 32px;
}

.wc-checkout__summary-title {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 20px;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    margin: 0 0 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid rgba(0,0,0,1);
}

/* Order review table */
.woocommerce-checkout-review-order-table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Almarai', sans-serif;
    font-size: 14px;
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
    padding: 10px 0;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    vertical-align: top;
}

.woocommerce-checkout-review-order-table th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(0,0,0,0.5);
}

.woocommerce-checkout-review-order-table .order-total td,
.woocommerce-checkout-review-order-table .order-total th {
    font-size: 16px;
    font-weight: 700;
    color: rgba(0,0,0,1);
    border-bottom: none;
    padding-top: 14px;
}

/* Payment section */
#payment {
    margin-top: 24px;
}

#payment .wc_payment_methods {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
}

#payment .wc_payment_methods li label {
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 10px;
}

#payment .wc_payment_methods li {
    padding: 12px 0;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

#payment input[type="radio"] { accent-color: var(--rmxts1-accent); }

#payment .payment_box {
    background: rgba(0,0,0,0.04);
    padding: 14px;
    margin-top: 10px;
    font-family: 'Almarai', sans-serif;
    font-size: 14px;
    color: rgba(0,0,0,0.7);
}

/* Place order button */
#payment #place_order {
    display: block;
    width: 100%;
    height: 52px;
    background: var(--rmxts1-accent);
    color: rgba(0,0,0,1);
    border: 2px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    cursor: pointer;
    transition: opacity 0.2s;
}
#payment #place_order:hover { opacity: 0.85; }

/* Terms */
.woocommerce-terms-and-conditions-wrapper {
    font-family: 'Almarai', sans-serif;
    font-size: 13px;
    color: rgba(0,0,0,0.6);
    margin-bottom: 16px;
}

.woocommerce-terms-and-conditions-wrapper a { color: rgba(0,0,0,1); }

/* Thank you page */
.wc-checkout .woocommerce-order {
    max-width: 1200px;
    margin: 60px auto;
    padding: 0 40px;
    font-family: 'Almarai', sans-serif;
}

.wc-checkout .woocommerce-order h2 {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 28px;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    margin: 0 0 20px;
}


/* ═══════════════════════════════════════════════════════════════════════════
   MY ACCOUNT PAGE
   ═══════════════════════════════════════════════════════════════════════════ */

.wc-account__header {
    padding-bottom: 32px;
}

.wc-account__welcome {
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    color: rgba(0,0,0,0.5);
    margin: 0;
}

.wc-account__body {
    max-width: 1200px;
    margin: 0 auto;
    padding: 48px 40px 80px;
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 60px;
    align-items: start;
}

/* Sidebar nav */
.wc-account__sidebar .woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
    border-top: 2px solid rgba(0,0,0,1);
}

.wc-account__sidebar .woocommerce-MyAccount-navigation ul li {
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

.wc-account__sidebar .woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 14px 0;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: rgba(0,0,0,0.5);
    text-decoration: none;
    transition: color 0.2s;
}

.wc-account__sidebar .woocommerce-MyAccount-navigation ul li a:hover,
.wc-account__sidebar .woocommerce-MyAccount-navigation ul li.is-active a {
    color: rgba(0,0,0,1);
}

.wc-account__sidebar .woocommerce-MyAccount-navigation ul li.is-active {
    border-left: 3px solid var(--rmxts1-accent);
    padding-left: 12px;
}

/* Account content area */
.wc-account__content {
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    color: rgba(29,29,29,1);
    line-height: 1.6;
}

.wc-account__content h2,
.wc-account__content h3 {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    margin: 0 0 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

.wc-account__content h2 { font-size: 24px; }
.wc-account__content h3 { font-size: 18px; }

/* Orders table */
.wc-account__content .woocommerce-orders-table,
.wc-account__content .shop_table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.wc-account__content .woocommerce-orders-table th,
.wc-account__content .shop_table th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(0,0,0,0.5);
    padding: 10px 12px 10px 0;
    border-bottom: 2px solid rgba(0,0,0,1);
    text-align: left;
}

.wc-account__content .woocommerce-orders-table td,
.wc-account__content .shop_table td {
    padding: 14px 12px 14px 0;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    vertical-align: middle;
}

.wc-account__content .woocommerce-orders-table .button,
.wc-account__content .shop_table .button,
.wc-account__content a.button,
.wc-account__content button.button {
    display: inline-block;
    padding: 8px 18px;
    background: var(--rmxts1-accent);
    color: rgba(0,0,0,1);
    border: 1px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-decoration: none;
    cursor: pointer;
    transition: opacity 0.2s;
}
.wc-account__content a.button:hover { opacity: 0.85; }

/* Account forms (edit account, address) */
.wc-account__content .woocommerce-EditAccountForm .form-row,
.wc-account__content .woocommerce-address-fields .form-row,
.wc-account__content .edit-account .form-row {
    margin-bottom: 16px;
}

.wc-account__content .form-row label {
    display: block;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(0,0,0,0.6);
    margin-bottom: 6px;
}

.wc-account__content .form-row .input-text,
.wc-account__content .form-row input[type="text"],
.wc-account__content .form-row input[type="email"],
.wc-account__content .form-row input[type="password"],
.wc-account__content .form-row input[type="tel"],
.wc-account__content .form-row select,
.wc-account__content .woocommerce-input-wrapper input {
    width: 100%;
    max-width: 480px;
    height: 48px;
    border: 1px solid rgba(0,0,0,0.2);
    padding: 0 16px;
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    outline: none;
    border-radius: 0;
    -webkit-appearance: none;
    transition: border-color 0.2s;
}
.wc-account__content .form-row .input-text:focus { border-color: rgba(0,0,0,0.6); }

.wc-account__content .woocommerce-Button,
.wc-account__content input[type="submit"],
.wc-account__content .save {
    display: inline-block;
    height: 48px;
    padding: 0 32px;
    background: var(--rmxts1-accent);
    color: rgba(0,0,0,1);
    border: 2px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    text-decoration: none;
    margin-top: 8px;
    transition: opacity 0.2s;
}
.wc-account__content input[type="submit"]:hover { opacity: 0.85; }

/* Dashboard welcome text */
.woocommerce-MyAccount-content p {
    margin-bottom: 16px;
}

.woocommerce-MyAccount-content p a {
    color: rgba(0,0,0,1);
    font-weight: 700;
}


/* ── Responsive: tablet ≤1024px ─────────────────────────────────────────── */
@media (max-width: 1024px) {
    .wc-cart__title,
    .wc-checkout__title,
    .wc-account__title { font-size: 42px; }

    .wc-checkout__body { grid-template-columns: 1fr; gap: 40px; }
    .wc-checkout__right { padding: 24px; }

    .wc-account__body { grid-template-columns: 180px 1fr; gap: 40px; }
}

/* ── Responsive: mobile ≤767px ──────────────────────────────────────────── */
@media (max-width: 767px) {
    .wc-cart__header,
    .wc-checkout__header,
    .wc-account__header { padding: 32px 20px 24px; }

    .wc-cart__title,
    .wc-checkout__title,
    .wc-account__title { font-size: 32px; }

    /* Cart: hide header row, use data-label for mobile labels */
    .wc-cart__form { padding: 0 20px; }
    .wc-cart__row--head { display: none; }
    .wc-cart__row--item {
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 20px 0;
    }

    .wc-cart__col::before {
        content: attr(data-label) ': ';
        font-family: 'Roboto', sans-serif;
        font-weight: 700;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: rgba(0,0,0,0.45);
        margin-right: 4px;
    }

    .wc-cart__col--product::before { display: none; }
    .wc-cart__product { flex-direction: row; }

    .wc-cart__actions { padding: 20px 20px 0; flex-direction: column; align-items: flex-start; }
    .wc-cart__coupon-input { width: 180px; }

    .wc-cart__totals-wrap { padding: 0 20px; margin-bottom: 40px; }
    .wc-cart__totals-inner { width: 100%; }

    .wc-checkout__form { padding: 0 20px 40px; }
    .wc-checkout__body { margin-top: 24px; }
    .woocommerce-billing-fields .form-row-first,
    .woocommerce-billing-fields .form-row-last,
    .woocommerce-shipping-fields .form-row-first,
    .woocommerce-shipping-fields .form-row-last { width: 100%; display: block; margin-right: 0; }

    .wc-account__body { grid-template-columns: 1fr; gap: 32px; padding: 32px 20px 48px; }
    .wc-account__sidebar .woocommerce-MyAccount-navigation ul { display: flex; flex-wrap: wrap; border-top: none; gap: 0; }
    .wc-account__sidebar .woocommerce-MyAccount-navigation ul li { border-bottom: none; width: 50%; }
    .wc-account__sidebar .woocommerce-MyAccount-navigation ul li a { padding: 10px 0; font-size: 12px; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   WOOCOMMERCE BLOCKS — Cart / Checkout / Account (block editor versions)
   Max-width 1200px containment + full branding override
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── WC Blocks color tokens ─────────────────────────────────────────────── */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout,
.wc-block-cart,
.wc-block-checkout {
    --wc-blocks-color-primary:      var(--rmxts1-accent);
    --wc-blocks-color-primary-dark: rgba(0,0,0,1);
    --wc-blocks-color-secondary:    rgba(0,0,0,1);
    --wc-blocks-border-color:       rgba(0,0,0,0.15);
    --wc-blocks-border-radius:      0px;
}

/* ── Max-width containment ──────────────────────────────────────────────── */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
    padding-top: 0 !important;
    box-sizing: border-box !important;
}

/* ── Headings ────────────────────────────────────────────────────────────── */
.wc-block-cart h2,
.wc-block-cart h3,
.wc-block-checkout h2,
.wc-block-checkout h3,
.wp-block-woocommerce-cart h2,
.wp-block-woocommerce-checkout h2 {
    font-family: 'Oswald', sans-serif !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: -0.02em !important;
}

/* ── Form inputs ─────────────────────────────────────────────────────────── */
.wc-block-components-text-input input,
.wc-block-components-select select,
.wc-block-components-country-input input,
.wc-block-components-state-input input,
.wc-block-components-address-form input,
.wc-block-components-address-form select {
    border: 1px solid rgba(0,0,0,0.2) !important;
    border-radius: 0 !important;
    font-family: 'Almarai', sans-serif !important;
    font-size: 15px !important;
    height: 48px !important;
    color: rgba(29,29,29,1) !important;
    background: #fff !important;
}

.wc-block-components-text-input input:focus,
.wc-block-components-select select:focus {
    border-color: rgba(0,0,0,0.6) !important;
    outline: none !important;
    box-shadow: none !important;
}

.wc-block-components-text-input label,
.wc-block-components-select label {
    font-family: 'Roboto', sans-serif !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: rgba(0,0,0,0.55) !important;
}

/* ── ALL block buttons — accent bg, black border ─────────────────────────── */
.wc-block-components-button:not(.is-link):not(.wc-block-components-button--link),
.wc-block-cart__submit-container .wc-block-components-button,
.wc-block-components-checkout-place-order-button__button,
.wc-block-components-totals-coupon__button,
.wc-block-checkout__payment-method .wc-block-components-button {
    background-color: var(--rmxts1-accent) !important;
    color: rgba(0,0,0,1) !important;
    border: 2px solid rgba(0,0,0,1) !important;
    border-radius: 0 !important;
    font-family: 'Roboto', sans-serif !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    min-height: 48px !important;
    padding: 0 28px !important;
    box-shadow: none !important;
    transition: opacity 0.2s !important;
}

.wc-block-components-button:not(.is-link):hover {
    background-color: var(--rmxts1-accent) !important;
    opacity: 0.85 !important;
}

/* Proceed to checkout — full width */
.wc-block-cart__submit-container .wc-block-components-button {
    width: 100% !important;
    display: block !important;
    text-align: center !important;
    height: 52px !important;
}

/* Place order — full width */
.wc-block-components-checkout-place-order-button,
.wc-block-components-checkout-place-order-button__button {
    width: 100% !important;
    display: block !important;
    height: 52px !important;
}

/* Link-style secondary buttons unchanged */
.wc-block-components-button.is-link,
.wc-block-components-button--link {
    background: transparent !important;
    border: none !important;
    color: rgba(0,0,0,0.6) !important;
    font-size: 13px !important;
    padding: 0 !important;
    min-height: auto !important;
}

/* ── Cart table ──────────────────────────────────────────────────────────── */
.wc-block-cart.wc-block-cart--is-side-by-side { gap: 40px; }

.wc-block-cart-items__header {
    font-family: 'Roboto', sans-serif !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: rgba(0,0,0,0.5) !important;
    border-bottom: 2px solid rgba(0,0,0,1) !important;
    padding-bottom: 10px !important;
}

.wc-block-cart-items td,
.wc-block-cart-items th {
    padding: 16px 0 !important;
    border-color: rgba(0,0,0,0.08) !important;
    font-family: 'Almarai', sans-serif !important;
    font-size: 15px !important;
}

.wc-block-cart-item__product-name a {
    font-family: 'Almarai', sans-serif !important;
    font-size: 16px !important;
    color: rgba(0,0,0,1) !important;
    font-weight: 400 !important;
}

.wc-block-components-quantity-selector {
    border: 1px solid rgba(0,0,0,0.2) !important;
    border-radius: 0 !important;
}

.wc-block-components-quantity-selector__value {
    font-family: 'Almarai', sans-serif !important;
    font-size: 15px !important;
}

.wc-block-cart-item__remove-link a {
    font-family: 'Roboto', sans-serif !important;
    font-size: 12px !important;
    color: rgba(0,0,0,0.4) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
}

/* ── Totals / order summary sidebar ─────────────────────────────────────── */
.wc-block-components-totals-wrapper,
.wc-block-cart__totals,
.wc-block-checkout__sidebar .wc-block-components-panel {
    background: rgba(246,243,236,1) !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 28px !important;
}

.wc-block-components-totals-item {
    font-family: 'Almarai', sans-serif !important;
    font-size: 15px !important;
    border-color: rgba(0,0,0,0.08) !important;
    padding: 12px 0 !important;
}

.wc-block-components-totals-item__label {
    font-family: 'Roboto', sans-serif !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    color: rgba(0,0,0,0.5) !important;
}

.wc-block-components-totals-footer-item,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
    font-family: 'Oswald', sans-serif !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    color: rgba(0,0,0,1) !important;
    text-transform: uppercase !important;
}

/* Coupon input */
.wc-block-components-totals-coupon__form input {
    border: 1px solid rgba(0,0,0,0.2) !important;
    border-radius: 0 !important;
    font-family: 'Almarai', sans-serif !important;
    font-size: 14px !important;
    height: 44px !important;
    padding: 0 14px !important;
}

/* ── Checkout sidebar ────────────────────────────────────────────────────── */
.wp-block-woocommerce-checkout-order-summary-block,
.wc-block-checkout__sidebar {
    background: rgba(246,243,236,1) !important;
}

.wc-block-checkout__sidebar .wc-block-components-panel__content {
    background: rgba(246,243,236,1) !important;
}

/* ── Payment section ────────────────────────────────────────────────────── */
.wc-block-checkout__payment-method {
    border: 1px solid rgba(0,0,0,0.1) !important;
    border-radius: 0 !important;
    font-family: 'Almarai', sans-serif !important;
}

.wc-block-components-radio-control__label {
    font-family: 'Almarai', sans-serif !important;
    font-size: 15px !important;
}

/* ── Notices ─────────────────────────────────────────────────────────────── */
.wc-block-components-notice-banner {
    border-radius: 0 !important;
    font-family: 'Almarai', sans-serif !important;
    font-size: 14px !important;
}

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 1080px) {
    .wp-block-woocommerce-cart,
    .wp-block-woocommerce-checkout {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
}

@media (max-width: 767px) {
    .wp-block-woocommerce-cart,
    .wp-block-woocommerce-checkout {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .wc-block-cart.wc-block-cart--is-side-by-side {
        flex-direction: column !important;
        gap: 24px !important;
    }

    .wc-block-components-totals-footer-item {
        font-size: 18px !important;
    }
}

/* ── page.php wrapper ───────────────────────────────────────────────────── */
.page-body {
    padding-top: 48px;
    padding-bottom: 0;
    min-height: 40vh;
}

/* Give WC block pages breathing room from nav */
.woocommerce-cart .page-body,
.woocommerce-checkout .page-body,
.woocommerce-account .page-body {
    padding-top: 0;
}

/* ═══════════════════════════════════════════════════════════════════════════
   WC PAGES v2 — Cart · Checkout · My Account  (rmxts- prefix)
   Classic PHP shortcode rendering — full design from scratch
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Shared page wrapper ─────────────────────────────────────────────────── */
.wc-page-wrap {
    background: #fff;
    min-height: 60vh;
}

.wc-page-wrap .woocommerce-notices-wrapper,
.wc-page-wrap .woocommerce-error,
.wc-page-wrap .woocommerce-message,
.wc-page-wrap .woocommerce-info {
    max-width: 1200px;
    margin: 0 auto;
    padding: 14px 40px;
    font-family: 'Almarai', sans-serif;
    font-size: 14px;
    list-style: none;
}

.wc-page-wrap .woocommerce-message { background: #f0faf0; border-left: 4px solid #3a6b35; color: #3a6b35; }
.wc-page-wrap .woocommerce-error   { background: #fdf2f2; border-left: 4px solid #c0392b; color: #c0392b; }
.wc-page-wrap .woocommerce-info    { background: #f0f8ff; border-left: 4px solid #2980b9; color: #2980b9; }

/* ── Shared button ───────────────────────────────────────────────────────── */
.rmxts-btn {
    display: inline-block;
    height: 50px;
    padding: 0 32px;
    line-height: 46px;
    background: var(--rmxts1-accent);
    color: rgba(0,0,0,1);
    border: 2px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-decoration: none;
    cursor: pointer;
    transition: opacity 0.2s;
}
.rmxts-btn:hover { opacity: 0.8; }


/* ═══════════════════════════════════════════════════════════════════════════
   CART
   ═══════════════════════════════════════════════════════════════════════════ */

.rmxts-cart { background: #fff; }

/* Head */
.rmxts-cart__head {
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding: 52px 0 36px;
}

.rmxts-cart__head-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
}

.rmxts-cart__heading {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 52px;
    text-transform: uppercase;
    letter-spacing: -0.04em;
    line-height: 1;
    color: rgba(0,0,0,1);
    margin: 0;
}

.rmxts-cart__count {
    font-size: 22px;
    font-weight: 400;
    opacity: 0.45;
    letter-spacing: 0;
}

.rmxts-cart__back {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(0,0,0,0.45);
    text-decoration: none;
    white-space: nowrap;
}
.rmxts-cart__back:hover { color: rgba(0,0,0,1); }

/* Empty state */
.rmxts-cart__empty {
    max-width: 480px;
    margin: 80px auto;
    padding: 0 40px;
    text-align: center;
}

.rmxts-cart__empty p {
    font-family: 'Almarai', sans-serif;
    font-size: 18px;
    color: rgba(0,0,0,0.45);
    margin: 0 0 28px;
}

/* Body: main + sidebar */
.rmxts-cart__body {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px 80px;
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 60px;
    align-items: start;
    padding-top: 40px;
}

/* Main column */
.rmxts-cart__main { min-width: 0; }

/* Table headers */
.rmxts-cart__table-head {
    display: grid;
    grid-template-columns: 1fr 110px 140px 110px 36px;
    gap: 12px;
    padding-bottom: 14px;
    border-bottom: 2px solid rgba(0,0,0,1);
    margin-bottom: 4px;
}

.rct-col {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: rgba(0,0,0,0.4);
}

.rct-col--price,
.rct-col--sub  { text-align: right; }
.rct-col--qty  { text-align: center; }
.rct-col--del  { text-align: center; }

/* Item rows */
.rmxts-cart__item {
    display: grid;
    grid-template-columns: 1fr 110px 140px 110px 36px;
    gap: 12px;
    align-items: center;
    padding: 20px 0;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

/* Product cell */
.rmxts-cart__product {
    display: flex;
    align-items: center;
    gap: 18px;
}

.rmxts-cart__thumb,
.rmxts-cart__thumb img {
    width: 90px;
    height: 90px;
    object-fit: cover;
    display: block;
    flex-shrink: 0;
    border: 1px solid rgba(0,0,0,0.08);
    text-decoration: none;
}

.rmxts-cart__name {
    font-family: 'Almarai', sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: rgba(0,0,0,1);
    text-decoration: none;
    line-height: 1.35;
    display: block;
}
.rmxts-cart__name:hover { text-decoration: underline; }

.rmxts-cart__info .variation dt,
.rmxts-cart__info .variation dd {
    font-family: 'Almarai', sans-serif;
    font-size: 13px;
    color: rgba(0,0,0,0.5);
}

/* Price / subtotal cells */
.rct-col--price .amount,
.rct-col--sub .amount {
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    color: rgba(0,0,0,1);
    float: right;
}

/* Quantity input */
.rct-col--qty { display: flex; justify-content: center; }

.rct-col--qty .quantity { display: flex; align-items: stretch; }

.rct-col--qty .qty {
    width: 56px;
    height: 40px;
    border: 1px solid rgba(0,0,0,0.2);
    text-align: center;
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    padding: 0;
    background: #fff;
    -moz-appearance: textfield;
    border-radius: 0;
}
.rct-col--qty .qty:focus { border-color: rgba(0,0,0,0.5); outline: none; }
.rct-col--qty .qty::-webkit-inner-spin-button { -webkit-appearance: none; }

/* Remove button */
.rmxts-cart__remove {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 13px;
    color: rgba(0,0,0,0.3);
    text-decoration: none;
    border: 1px solid rgba(0,0,0,0.12);
    transition: all 0.18s;
    margin: 0 auto;
}
.rmxts-cart__remove:hover { color: rgba(0,0,0,1); border-color: rgba(0,0,0,0.5); }

/* Actions row */
.rmxts-cart__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding-top: 24px;
}

.rmxts-cart__coupon { display: flex; gap: 0; }

.rmxts-cart__coupon-input {
    height: 46px;
    width: 200px;
    border: 1px solid rgba(0,0,0,0.2);
    border-right: none;
    padding: 0 16px;
    font-family: 'Almarai', sans-serif;
    font-size: 14px;
    outline: none;
    border-radius: 0;
}
.rmxts-cart__coupon-input:focus { border-color: rgba(0,0,0,0.5); }

.rmxts-cart__coupon-btn {
    height: 46px;
    padding: 0 20px;
    background: rgba(0,0,0,1);
    color: #fff;
    border: none;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    cursor: pointer;
    transition: opacity 0.2s;
    border-radius: 0;
}
.rmxts-cart__coupon-btn:hover { opacity: 0.75; }

.rmxts-cart__update {
    height: 46px;
    padding: 0 22px;
    background: transparent;
    color: rgba(0,0,0,0.6);
    border: 1px solid rgba(0,0,0,0.25);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    cursor: pointer;
    transition: all 0.18s;
    border-radius: 0;
}
.rmxts-cart__update:hover { border-color: rgba(0,0,0,1); color: rgba(0,0,0,1); }

/* ── Cart totals sidebar (WooCommerce-generated) ─────────────────────────── */
.rmxts-cart__sidebar .cart_totals { position: sticky; top: 24px; }

.rmxts-cart__sidebar .cart_totals h2 {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 22px;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    margin: 0 0 20px;
    padding-bottom: 14px;
    border-bottom: 2px solid rgba(0,0,0,1);
}

.rmxts-cart__sidebar .shop_table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 0;
}

.rmxts-cart__sidebar .shop_table th,
.rmxts-cart__sidebar .shop_table td {
    padding: 13px 0;
    border-bottom: 1px solid rgba(0,0,0,0.07);
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    vertical-align: middle;
}

.rmxts-cart__sidebar .shop_table th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(0,0,0,0.45);
    text-align: left;
    width: 40%;
}

.rmxts-cart__sidebar .shop_table td { text-align: right; }

.rmxts-cart__sidebar .order-total td,
.rmxts-cart__sidebar .order-total th {
    border-bottom: none;
    padding-top: 18px;
    font-weight: 700;
}

.rmxts-cart__sidebar .order-total .amount {
    font-family: 'Oswald', sans-serif;
    font-size: 26px;
    font-weight: 600;
}

.rmxts-cart__sidebar .order-total th {
    font-family: 'Oswald', sans-serif;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    color: rgba(0,0,0,1);
    letter-spacing: -0.01em;
}

/* Shipping methods */
.rmxts-cart__sidebar .shipping-calculator-button,
.rmxts-cart__sidebar .woocommerce-shipping-destination {
    font-family: 'Almarai', sans-serif;
    font-size: 13px;
    color: rgba(0,0,0,0.5);
}

/* Proceed to checkout button */
.rmxts-cart__sidebar .wc-proceed-to-checkout { margin-top: 24px; }

.rmxts-cart__sidebar .wc-proceed-to-checkout .checkout-button,
.rmxts-cart__sidebar .checkout-button {
    display: block;
    width: 100%;
    height: 52px;
    line-height: 48px;
    text-align: center;
    background: var(--rmxts1-accent);
    color: rgba(0,0,0,1);
    border: 2px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-decoration: none;
    transition: opacity 0.2s;
}
.rmxts-cart__sidebar .checkout-button:hover { opacity: 0.8; }

/* Coupon applied tag */
.rmxts-cart__sidebar .cart-discount td,
.rmxts-cart__sidebar .cart-discount th { color: #3a6b35; }

.rmxts-cart__sidebar .woocommerce-remove-coupon {
    font-size: 11px;
    color: rgba(0,0,0,0.4);
    margin-left: 6px;
}


/* ═══════════════════════════════════════════════════════════════════════════
   CHECKOUT
   ═══════════════════════════════════════════════════════════════════════════ */

.rmxts-checkout { background: #fff; }

/* Head */
.rmxts-checkout__head {
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding: 52px 0 36px;
}

.rmxts-checkout__head-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
}

.rmxts-checkout__heading {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 52px;
    text-transform: uppercase;
    letter-spacing: -0.04em;
    line-height: 1;
    color: rgba(0,0,0,1);
    margin: 0;
}

/* Steps breadcrumb */
.rmxts-checkout__steps {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.rmxts-checkout__step { color: rgba(0,0,0,0.3); text-decoration: none; }
.rmxts-checkout__step--done { color: rgba(0,0,0,0.6); text-decoration: underline; }
.rmxts-checkout__step--active { color: rgba(0,0,0,1); font-weight: 700; }
.rmxts-checkout__step-sep { color: rgba(0,0,0,0.2); }

/* Form body */
.rmxts-checkout__form {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px 80px;
}

.rmxts-checkout__body {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 60px;
    align-items: start;
    padding-top: 44px;
}

/* ── Left column ─────────────────────────────────────────────────────────── */
.rmxts-checkout__left h3,
.rmxts-checkout__notes h3 {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 20px;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    margin: 0 0 22px;
    padding-bottom: 14px;
    border-bottom: 2px solid rgba(0,0,0,1);
}

.rmxts-checkout__notes { margin-top: 32px; }

/* All WooCommerce form rows inside checkout */
.rmxts-checkout__left .form-row,
.rmxts-checkout__left .woocommerce-address-fields .form-row {
    margin: 0 0 18px;
    padding: 0;
}

.rmxts-checkout__left .form-row label,
.rmxts-checkout__left .woocommerce-address-fields .form-row label {
    display: block;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: rgba(0,0,0,0.5);
    margin-bottom: 7px;
}

.rmxts-checkout__left .woocommerce-input-wrapper input,
.rmxts-checkout__left .woocommerce-input-wrapper select,
.rmxts-checkout__left .woocommerce-input-wrapper textarea,
.rmxts-checkout__left .form-row .input-text,
.rmxts-checkout__left .form-row select {
    width: 100%;
    height: 48px;
    border: 1px solid rgba(0,0,0,0.18);
    padding: 0 16px;
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    color: rgba(0,0,0,1);
    background: #fff;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    transition: border-color 0.18s;
}

.rmxts-checkout__left .woocommerce-input-wrapper textarea,
.rmxts-checkout__left .form-row textarea {
    height: 120px;
    padding: 14px 16px;
    resize: vertical;
}

.rmxts-checkout__left .woocommerce-input-wrapper input:focus,
.rmxts-checkout__left .form-row .input-text:focus,
.rmxts-checkout__left .form-row select:focus {
    border-color: rgba(0,0,0,0.55);
}

/* Half-width side-by-side */
.rmxts-checkout__left .form-row-first,
.rmxts-checkout__left .form-row-last {
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 9px);
}
.rmxts-checkout__left .form-row-first { margin-right: 18px; }

/* Select arrow */
.rmxts-checkout__left .woocommerce-input-wrapper { position: relative; }

.rmxts-checkout__left select + span.select2 { display: none !important; }

/* Login notice */
.rmxts-checkout__login-notice {
    background: rgba(246,243,236,1);
    padding: 20px 24px;
    margin-bottom: 32px;
    font-family: 'Almarai', sans-serif;
    font-size: 14px;
}

.rmxts-checkout__login-notice p { margin: 0 0 12px; }

/* ── Right column ────────────────────────────────────────────────────────── */
.rmxts-checkout__right {
    position: sticky;
    top: 24px;
}

.rmxts-checkout__summary-heading {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 20px;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    margin: 0 0 22px;
    padding-bottom: 14px;
    border-bottom: 2px solid rgba(0,0,0,1);
}

/* Order review table */
.woocommerce-checkout-review-order-table {
    width: 100%;
    border-collapse: collapse;
}

.woocommerce-checkout-review-order-table thead th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(0,0,0,0.4);
    padding: 0 0 12px;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    text-align: left;
}

.woocommerce-checkout-review-order-table thead th:last-child { text-align: right; }

.woocommerce-checkout-review-order-table tbody tr td,
.woocommerce-checkout-review-order-table tfoot tr td,
.woocommerce-checkout-review-order-table tfoot tr th {
    padding: 12px 0;
    border-bottom: 1px solid rgba(0,0,0,0.07);
    font-family: 'Almarai', sans-serif;
    font-size: 14px;
    vertical-align: middle;
}

.woocommerce-checkout-review-order-table tfoot tr th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(0,0,0,0.4);
    text-align: left;
}

.woocommerce-checkout-review-order-table tfoot .order-total td,
.woocommerce-checkout-review-order-table tfoot .order-total th {
    border-bottom: none;
    padding-top: 16px;
    font-size: 16px;
    font-weight: 700;
    color: rgba(0,0,0,1);
}

.woocommerce-checkout-review-order-table tfoot .order-total td {
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    text-align: right;
}

.woocommerce-checkout-review-order-table tfoot .order-total th {
    font-family: 'Oswald', sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    color: rgba(0,0,0,1);
}

.woocommerce-checkout-review-order-table td.product-name { font-weight: 400; }
.woocommerce-checkout-review-order-table td.product-total { text-align: right; }

/* Payment section */
#payment {
    background: rgba(246,243,236,1);
    padding: 24px;
    margin-top: 24px;
}

#payment ul.payment_methods {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding-bottom: 16px;
}

#payment ul.payment_methods li {
    padding: 10px 0;
    border-top: 1px solid rgba(0,0,0,0.07);
}
#payment ul.payment_methods li:first-child { border-top: none; }

#payment ul.payment_methods label {
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 10px;
}

#payment .payment_box {
    background: rgba(0,0,0,0.04);
    padding: 14px 16px;
    margin-top: 10px;
    font-family: 'Almarai', sans-serif;
    font-size: 13px;
    color: rgba(0,0,0,0.65);
}

#payment input[type="radio"] { accent-color: var(--rmxts1-accent); flex-shrink: 0; }

/* Place order button */
#payment #place_order {
    display: block;
    width: 100%;
    height: 54px;
    background: var(--rmxts1-accent);
    color: rgba(0,0,0,1);
    border: 2px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    cursor: pointer;
    border-radius: 0;
    transition: opacity 0.2s;
}
#payment #place_order:hover { opacity: 0.8; }

/* Terms */
.woocommerce-terms-and-conditions-wrapper {
    margin: 0 0 16px;
    font-family: 'Almarai', sans-serif;
    font-size: 13px;
    color: rgba(0,0,0,0.55);
}

.woocommerce-terms-and-conditions-wrapper a { color: rgba(0,0,0,1); }


/* ═══════════════════════════════════════════════════════════════════════════
   MY ACCOUNT
   ═══════════════════════════════════════════════════════════════════════════ */

.rmxts-account { background: #fff; }

/* Head */
.rmxts-account__head {
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding: 52px 0 36px;
}

.rmxts-account__head-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
}

.rmxts-account__heading {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 52px;
    text-transform: uppercase;
    letter-spacing: -0.04em;
    line-height: 1;
    color: rgba(0,0,0,1);
    margin: 0;
}

.rmxts-account__welcome {
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    color: rgba(0,0,0,0.45);
    margin: 0;
}

/* Body layout */
.rmxts-account__body {
    max-width: 1200px;
    margin: 0 auto;
    padding: 52px 40px 80px;
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 64px;
    align-items: start;
}

/* Sidebar nav — WooCommerce generates .woocommerce-MyAccount-navigation */
.rmxts-account__nav .woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
    border-top: 2px solid rgba(0,0,0,1);
}

.rmxts-account__nav .woocommerce-MyAccount-navigation li {
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

.rmxts-account__nav .woocommerce-MyAccount-navigation li a {
    display: block;
    padding: 14px 12px 14px 0;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: rgba(0,0,0,0.45);
    text-decoration: none;
    transition: color 0.18s, padding-left 0.18s;
}

.rmxts-account__nav .woocommerce-MyAccount-navigation li a:hover {
    color: rgba(0,0,0,1);
    padding-left: 6px;
}

.rmxts-account__nav .woocommerce-MyAccount-navigation li.is-active a,
.rmxts-account__nav .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--is-active a {
    color: rgba(0,0,0,1);
    border-left: 3px solid var(--rmxts1-accent);
    padding-left: 10px;
}

/* ── Account content area ────────────────────────────────────────────────── */
.rmxts-account__content {
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    color: rgba(29,29,29,1);
    line-height: 1.6;
    min-width: 0;
}

.rmxts-account__content p { margin: 0 0 14px; }

.rmxts-account__content h2 {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 26px;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    margin: 0 0 22px;
    padding-bottom: 14px;
    border-bottom: 2px solid rgba(0,0,0,1);
}

.rmxts-account__content h3 {
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
    font-size: 18px;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    margin: 28px 0 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

/* Orders table */
.rmxts-account__content .woocommerce-orders-table,
.rmxts-account__content .shop_table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.rmxts-account__content .woocommerce-orders-table th,
.rmxts-account__content .shop_table th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: rgba(0,0,0,0.4);
    padding: 0 0 12px;
    border-bottom: 2px solid rgba(0,0,0,1);
    text-align: left;
}

.rmxts-account__content .woocommerce-orders-table td,
.rmxts-account__content .shop_table td {
    padding: 14px 0;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    vertical-align: middle;
}

.rmxts-account__content .woocommerce-orders-table__cell-order-actions .button,
.rmxts-account__content .shop_table .button,
.rmxts-account__content a.button {
    display: inline-block;
    padding: 8px 16px;
    background: var(--rmxts1-accent);
    color: rgba(0,0,0,1);
    border: 1px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-decoration: none;
    transition: opacity 0.18s;
}
.rmxts-account__content a.button:hover { opacity: 0.8; }

/* Order status badge */
.rmxts-account__content .woocommerce-order-status {
    font-family: 'Roboto', sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 4px 10px;
    background: rgba(0,0,0,0.06);
    color: rgba(0,0,0,0.7);
}

/* Account forms */
.rmxts-account__content .woocommerce-EditAccountForm .form-row,
.rmxts-account__content .woocommerce-address-fields .form-row,
.rmxts-account__content .edit-account .form-row {
    margin: 0 0 18px;
}

.rmxts-account__content .form-row label {
    display: block;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: rgba(0,0,0,0.5);
    margin-bottom: 7px;
}

.rmxts-account__content .form-row .input-text,
.rmxts-account__content .form-row input[type="text"],
.rmxts-account__content .form-row input[type="email"],
.rmxts-account__content .form-row input[type="password"],
.rmxts-account__content .form-row input[type="tel"],
.rmxts-account__content .form-row select,
.rmxts-account__content .woocommerce-input-wrapper input {
    width: 100%;
    max-width: 460px;
    height: 48px;
    border: 1px solid rgba(0,0,0,0.18);
    padding: 0 16px;
    font-family: 'Almarai', sans-serif;
    font-size: 15px;
    color: rgba(0,0,0,1);
    background: #fff;
    border-radius: 0;
    -webkit-appearance: none;
    outline: none;
    transition: border-color 0.18s;
}
.rmxts-account__content .form-row .input-text:focus { border-color: rgba(0,0,0,0.55); }

.rmxts-account__content input[type="submit"],
.rmxts-account__content .woocommerce-Button,
.rmxts-account__content button.button,
.rmxts-account__content .save {
    display: inline-block;
    height: 50px;
    padding: 0 32px;
    line-height: 46px;
    background: var(--rmxts1-accent);
    color: rgba(0,0,0,1);
    border: 2px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    cursor: pointer;
    text-decoration: none;
    margin-top: 10px;
    border-radius: 0;
    transition: opacity 0.2s;
}
.rmxts-account__content input[type="submit"]:hover { opacity: 0.8; }

/* Logout link */
.rmxts-account__nav .woocommerce-MyAccount-navigation-link--customer-logout a {
    color: rgba(0,0,0,0.35) !important;
    font-size: 11px !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════════════════ */

@media (max-width: 1080px) {
    .rmxts-cart__body,
    .rmxts-checkout__form .rmxts-checkout__body,
    .rmxts-account__body {
        gap: 40px;
    }

    .rmxts-cart__body { grid-template-columns: 1fr 320px; }
    .rmxts-checkout__body { grid-template-columns: 1fr 360px; }
    .rmxts-account__body { grid-template-columns: 190px 1fr; }
}

@media (max-width: 900px) {
    .rmxts-cart__body,
    .rmxts-checkout__body {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .rmxts-cart__sidebar .cart_totals { position: static; }
    .rmxts-checkout__right { position: static; }
}

@media (max-width: 767px) {
    /* Headings */
    .rmxts-cart__heading,
    .rmxts-checkout__heading,
    .rmxts-account__heading { font-size: 36px; }

    /* Padding */
    .rmxts-cart__head,
    .rmxts-checkout__head,
    .rmxts-account__head { padding: 36px 0 24px; }

    .rmxts-cart__head-inner,
    .rmxts-checkout__head-inner,
    .rmxts-account__head-inner { padding: 0 20px; }

    .rmxts-cart__body { padding: 24px 20px 48px; }

    .rmxts-checkout__form { padding: 0 20px 48px; }
    .rmxts-checkout__body { padding-top: 28px; }

    .rmxts-account__body { grid-template-columns: 1fr; padding: 28px 20px 48px; gap: 28px; }

    /* Cart: hide column headers, use data-label on mobile */
    .rmxts-cart__table-head { display: none; }

    .rmxts-cart__item {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 22px 0;
    }

    .rct-col--price::before { content: attr(data-label) ': '; font-family: 'Roboto', sans-serif; font-weight: 700; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: rgba(0,0,0,0.4); }
    .rct-col--qty::before   { content: attr(data-label) ': '; font-family: 'Roboto', sans-serif; font-weight: 700; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: rgba(0,0,0,0.4); }
    .rct-col--sub::before   { content: attr(data-label) ': '; font-family: 'Roboto', sans-serif; font-weight: 700; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: rgba(0,0,0,0.4); }

    .rct-col--price,
    .rct-col--sub { text-align: left; }
    .rct-col--price .amount,
    .rct-col--sub .amount { float: none; }

    .rct-col--qty { justify-content: flex-start; }
    .rct-col--del { display: none; }
    .rmxts-cart__info { position: relative; }
    .rmxts-cart__remove { position: absolute; top: 0; right: 0; }

    /* Checkout: all fields full width */
    .rmxts-checkout__left .form-row-first,
    .rmxts-checkout__left .form-row-last {
        width: 100%;
        display: block;
        margin-right: 0;
    }

    /* Account: sidebar becomes horizontal */
    .rmxts-account__nav .woocommerce-MyAccount-navigation ul {
        display: flex;
        flex-wrap: wrap;
        border-top: none;
        gap: 0;
    }

    .rmxts-account__nav .woocommerce-MyAccount-navigation li {
        border-bottom: none;
        width: 50%;
    }

    .rmxts-account__nav .woocommerce-MyAccount-navigation li a {
        padding: 10px 8px;
        font-size: 11px;
        border-bottom: 2px solid transparent;
    }

    .rmxts-account__nav .woocommerce-MyAccount-navigation li.is-active a,
    .rmxts-account__nav .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--is-active a {
        border-left: none;
        border-bottom: 2px solid var(--rmxts1-accent);
        padding-left: 8px;
    }

    /* Steps on checkout */
    .rmxts-checkout__steps { font-size: 11px; gap: 6px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   WC PAGES v3 — Cart / Checkout / My Account / Thank You
   Matches site design language exactly.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Page wrapper ────────────────────────────────────────────────────────── */
.wc-page-wrap { background: #fff; }

/* WooCommerce notices */
.wc-page-wrap .woocommerce-notices-wrapper ul,
.wc-page-wrap .woocommerce-message,
.wc-page-wrap .woocommerce-error,
.wc-page-wrap .woocommerce-info {
    max-width: 1200px;
    margin: 0 auto 0;
    padding: 12px 40px;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 14px;
    list-style: none;
    border-top: none;
    border-right: none;
    border-bottom: none;
}

/* ─────────────────────────────────────────────────────────────────────────
   SHARED: page heading strip
   ───────────────────────────────────────────────────────────────────────── */
.rmxts-cart__head,
.rmxts-checkout__head,
.rmxts-account__head {
    padding: 56px 0 40px;
    border-bottom: 1px solid rgba(29,29,29,0.12);
}

.rmxts-cart__head-inner,
.rmxts-checkout__head-inner,
.rmxts-account__head-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.rmxts-cart__heading,
.rmxts-checkout__heading,
.rmxts-account__heading {
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    font-size: 72px;
    text-transform: uppercase;
    letter-spacing: -0.05em;
    line-height: 1;
    color: rgba(29,29,29,1);
    margin: 0;
}

.rmxts-cart__count {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 18px;
    letter-spacing: 0;
    color: rgba(29,29,29,0.4);
}

.rmxts-cart__back,
.rmxts-checkout__back {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
    text-decoration: none;
}
.rmxts-cart__back:hover,
.rmxts-checkout__back:hover { text-decoration: underline; }

/* ─────────────────────────────────────────────────────────────────────────
   CART
   ───────────────────────────────────────────────────────────────────────── */

.rmxts-cart__body {
    max-width: 1200px;
    margin: 0 auto;
    padding: 48px 40px 80px;
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 64px;
    align-items: start;
}

/* Empty cart */
.rmxts-cart__empty {
    max-width: 1200px;
    margin: 0 auto;
    padding: 80px 40px;
    text-align: center;
}
.rmxts-cart__empty p {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 18px;
    color: rgba(29,29,29,0.45);
    margin: 0 0 32px;
}
.rmxts-cart__empty .rmxts-btn {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
}

/* Column headers */
.rmxts-cart__table-head {
    display: grid;
    grid-template-columns: 1fr 100px 130px 100px 32px;
    gap: 8px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(29,29,29,1);
}

.rct-col {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
}
.rct-col--price,
.rct-col--sub  { text-align: right; }
.rct-col--qty  { text-align: center; }

/* Item row */
.rmxts-cart__item {
    display: grid;
    grid-template-columns: 1fr 100px 130px 100px 32px;
    gap: 8px;
    align-items: center;
    padding: 24px 0;
    border-bottom: 1px solid rgba(29,29,29,0.1);
}

.rmxts-cart__product {
    display: flex;
    align-items: center;
    gap: 20px;
}

.rmxts-cart__thumb,
.rmxts-cart__thumb img {
    display: block;
    width: 88px;
    height: 88px;
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid rgba(0,0,0,0.08);
    text-decoration: none;
}

.rmxts-cart__name {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.3;
    color: rgba(29,29,29,1);
    text-decoration: none;
    display: block;
}
.rmxts-cart__name:hover { text-decoration: underline; }

.rct-col--price,
.rct-col--sub {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: rgba(29,29,29,1);
    text-align: right;
}
.rct-col--sub { font-weight: 700; }

/* Quantity */
.rct-col--qty {
    display: flex;
    justify-content: center;
}
.rct-col--qty .quantity { display: flex; align-items: stretch; }
.rct-col--qty .qty {
    width: 60px;
    height: 40px;
    border: 1px solid rgba(29,29,29,0.25);
    text-align: center;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    background: #fff;
    border-radius: 0;
    -moz-appearance: textfield;
}
.rct-col--qty .qty::-webkit-inner-spin-button { -webkit-appearance: none; }
.rct-col--qty .qty:focus { outline: none; border-color: rgba(29,29,29,0.6); }

/* Remove */
.rmxts-cart__remove {
    display: block;
    width: 32px;
    height: 32px;
    line-height: 30px;
    text-align: center;
    font-size: 12px;
    color: rgba(29,29,29,0.35);
    text-decoration: none;
    border: 1px solid rgba(29,29,29,0.15);
    transition: all 0.2s;
}
.rmxts-cart__remove:hover { color: rgba(29,29,29,1); border-color: rgba(29,29,29,0.5); }

/* Actions */
.rmxts-cart__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding-top: 20px;
}

.rmxts-cart__coupon { display: flex; }

.rmxts-cart__coupon-input {
    height: 44px;
    width: 180px;
    border: 1px solid rgba(29,29,29,0.25);
    border-right: none;
    padding: 0 14px;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    outline: none;
}
.rmxts-cart__coupon-input:focus { border-color: rgba(29,29,29,0.6); }
.rmxts-cart__coupon-input::placeholder { color: rgba(29,29,29,0.35); }

.rmxts-cart__coupon-btn,
.rmxts-cart__update {
    height: 44px;
    padding: 0 20px;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0;
    border: none;
    cursor: pointer;
}

.rmxts-cart__coupon-btn {
    background: rgba(29,29,29,1);
    color: #fff;
}
.rmxts-cart__coupon-btn:hover { opacity: 0.75; }

.rmxts-cart__update {
    background: transparent;
    color: rgba(29,29,29,1);
    border: 1px solid rgba(29,29,29,0.25);
}
.rmxts-cart__update:hover { border-color: rgba(29,29,29,1); }

/* ── Totals sidebar — WC-generated HTML ─────────────────────────────────── */
.rmxts-cart__sidebar { position: sticky; top: 20px; }

/* Override WC defaults */
.rmxts-cart__sidebar .cart_totals h2,
.rmxts-cart__sidebar .cart-collaterals h2 {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
    margin: 0 0 20px;
    padding: 0 0 14px;
    border-bottom: 1px solid rgba(29,29,29,1);
}

.rmxts-cart__sidebar .shop_table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
}

.rmxts-cart__sidebar .shop_table th,
.rmxts-cart__sidebar .shop_table td {
    padding: 14px 0;
    border-bottom: 1px solid rgba(29,29,29,0.1);
    text-align: left;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: rgba(29,29,29,1);
    background: none;
}

.rmxts-cart__sidebar .shop_table th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    width: 50%;
}

.rmxts-cart__sidebar .shop_table td { text-align: right; }

.rmxts-cart__sidebar .order-total td,
.rmxts-cart__sidebar .order-total th {
    border-bottom: none;
    padding-top: 20px;
}

.rmxts-cart__sidebar .order-total th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
}

.rmxts-cart__sidebar .order-total .amount,
.rmxts-cart__sidebar .order-total td {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 32px;
    letter-spacing: -0.04em;
    color: rgba(29,29,29,1);
    text-align: right;
}

/* Proceed to checkout button */
.rmxts-cart__sidebar .wc-proceed-to-checkout { margin-top: 24px; }

.rmxts-cart__sidebar .checkout-button,
.rmxts-cart__sidebar .wc-proceed-to-checkout a.checkout-button {
    display: block;
    width: 100%;
    height: 44px;
    line-height: 40px;
    text-align: center;
    background: var(--rmxts1-accent) !important;
    color: rgba(0,0,0,1) !important;
    border: 2px solid rgba(0,0,0,1) !important;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0;
    text-decoration: none;
}
.rmxts-cart__sidebar .checkout-button:hover { opacity: 0.85; }

.rmxts-cart__sidebar .woocommerce-shipping-calculator,
.rmxts-cart__sidebar .shipping-calculator-button {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 13px;
    color: rgba(29,29,29,0.5);
}

/* ─────────────────────────────────────────────────────────────────────────
   CHECKOUT
   ───────────────────────────────────────────────────────────────────────── */

/* Steps */
.rmxts-checkout__steps {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
}
.rmxts-checkout__step      { color: rgba(29,29,29,0.3); text-decoration: none; }
.rmxts-checkout__step--done{ color: rgba(29,29,29,0.6); text-decoration: underline; }
.rmxts-checkout__step--active { color: rgba(29,29,29,1); }
.rmxts-checkout__step-sep  { color: rgba(29,29,29,0.2); font-weight: 400; }

/* Form container */
.rmxts-checkout__form {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px 80px;
}

.rmxts-checkout__body {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 64px;
    align-items: start;
    padding-top: 48px;
}

/* Section headings inside checkout */
.rmxts-checkout__left h3,
.rmxts-checkout__notes h3 {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
    margin: 0 0 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(29,29,29,1);
}

.rmxts-checkout__notes { margin-top: 32px; }
.rmxts-checkout__login-notice {
    background: rgba(246,243,236,1);
    padding: 16px 20px;
    margin-bottom: 28px;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: rgba(29,29,29,1);
}

/* Form fields */
.rmxts-checkout__left .form-row { margin: 0 0 16px; }

.rmxts-checkout__left .form-row label {
    display: block;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
    margin-bottom: 8px;
}

.rmxts-checkout__left .form-row .required { color: rgba(29,29,29,0.4); }

.rmxts-checkout__left .woocommerce-input-wrapper input,
.rmxts-checkout__left .woocommerce-input-wrapper select,
.rmxts-checkout__left .woocommerce-input-wrapper textarea,
.rmxts-checkout__left .form-row .input-text,
.rmxts-checkout__left .form-row select {
    display: block;
    width: 100%;
    height: 48px;
    border: 1px solid rgba(29,29,29,0.2);
    padding: 0 16px;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: rgba(29,29,29,1);
    background: #fff;
    border-radius: 0;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
    box-shadow: none;
    transition: border-color 0.15s;
}

.rmxts-checkout__left .woocommerce-input-wrapper textarea {
    height: 100px;
    padding: 12px 16px;
    resize: vertical;
}

.rmxts-checkout__left .woocommerce-input-wrapper input:focus,
.rmxts-checkout__left .form-row .input-text:focus,
.rmxts-checkout__left .form-row select:focus {
    border-color: rgba(29,29,29,0.6);
}

/* Half-width rows */
.rmxts-checkout__left .form-row-first,
.rmxts-checkout__left .form-row-last {
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 8px);
}
.rmxts-checkout__left .form-row-first { margin-right: 16px; }

/* ── Right sidebar ───────────────────────────────────────────────────────── */
.rmxts-checkout__right { position: sticky; top: 20px; }

.rmxts-checkout__summary-heading {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
    margin: 0 0 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(29,29,29,1);
}

/* Order review table */
.woocommerce-checkout-review-order-table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
}

.woocommerce-checkout-review-order-table th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
    padding: 0 0 12px;
    border-bottom: 1px solid rgba(29,29,29,0.15);
    text-align: left;
}
.woocommerce-checkout-review-order-table th:last-child { text-align: right; }

.woocommerce-checkout-review-order-table td {
    padding: 12px 0;
    border-bottom: 1px solid rgba(29,29,29,0.08);
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: rgba(29,29,29,1);
    vertical-align: middle;
}

.woocommerce-checkout-review-order-table .product-total { text-align: right; }

.woocommerce-checkout-review-order-table tfoot th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(29,29,29,0.08);
    padding: 12px 0;
    color: rgba(29,29,29,0.55);
}

.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td {
    border-bottom: none;
    padding-top: 18px;
    color: rgba(29,29,29,1);
}

.woocommerce-checkout-review-order-table .order-total td {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 28px;
    letter-spacing: -0.04em;
    text-align: right;
}

/* Payment */
#payment {
    background: rgba(246,243,236,1);
    padding: 20px 20px 20px;
    margin-top: 20px;
}

#payment ul.payment_methods {
    list-style: none;
    padding: 0;
    margin: 0 0 16px;
    border-bottom: 1px solid rgba(29,29,29,0.1);
    padding-bottom: 12px;
}

#payment ul.payment_methods li {
    padding: 10px 0;
    border-top: 1px solid rgba(29,29,29,0.08);
}
#payment ul.payment_methods li:first-child { border-top: none; }

#payment ul.payment_methods label {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 10px;
}

#payment .payment_box {
    padding: 12px;
    margin-top: 8px;
    background: rgba(29,29,29,0.04);
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: rgba(29,29,29,0.65);
}

/* Place order */
#payment #place_order {
    display: block;
    width: 100%;
    height: 44px;
    background: var(--rmxts1-accent);
    color: rgba(0,0,0,1);
    border: 2px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0;
    cursor: pointer;
    border-radius: 0;
}
#payment #place_order:hover { opacity: 0.85; }

.woocommerce-terms-and-conditions-wrapper {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 13px;
    color: rgba(29,29,29,0.55);
    margin: 0 0 12px;
}
.woocommerce-terms-and-conditions-wrapper a { color: rgba(29,29,29,1); }

/* ─────────────────────────────────────────────────────────────────────────
   THANK YOU / ORDER RECEIVED
   ───────────────────────────────────────────────────────────────────────── */

.wc-page-wrap .woocommerce-order {
    max-width: 780px;
    margin: 0 auto;
    padding: 64px 40px 80px;
}

.wc-page-wrap .woocommerce-order p.woocommerce-thankyou-order-received {
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    font-size: 48px;
    text-transform: uppercase;
    letter-spacing: -0.04em;
    line-height: 1.1;
    color: rgba(29,29,29,1);
    margin: 0 0 32px;
}

.wc-page-wrap .woocommerce-order-overview {
    list-style: none;
    padding: 0;
    margin: 0 0 40px;
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    border-top: 1px solid rgba(29,29,29,1);
    border-bottom: 1px solid rgba(29,29,29,0.1);
}

.wc-page-wrap .woocommerce-order-overview li {
    flex: 1;
    padding: 20px 24px 20px 0;
    border-right: 1px solid rgba(29,29,29,0.1);
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: rgba(29,29,29,0.55);
}
.wc-page-wrap .woocommerce-order-overview li:last-child { border-right: none; }

.wc-page-wrap .woocommerce-order-overview li strong {
    display: block;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 18px;
    color: rgba(29,29,29,1);
    margin-top: 4px;
}

.wc-page-wrap .woocommerce-order h2 {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
    margin: 32px 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(29,29,29,1);
}

.wc-page-wrap .woocommerce-table--order-details,
.wc-page-wrap .woocommerce-order-details .woocommerce-table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
}

.wc-page-wrap .woocommerce-table th,
.wc-page-wrap .woocommerce-table td {
    padding: 12px 0;
    border-bottom: 1px solid rgba(29,29,29,0.08);
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    color: rgba(29,29,29,1);
    text-align: left;
}

.wc-page-wrap .woocommerce-table th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    color: rgba(29,29,29,0.45);
}

.wc-page-wrap .woocommerce-table .product-total { text-align: right; }

/* Customer address */
.wc-page-wrap address {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: rgba(29,29,29,1);
    font-style: normal;
    line-height: 1.7;
}

/* ─────────────────────────────────────────────────────────────────────────
   MY ACCOUNT
   ───────────────────────────────────────────────────────────────────────── */

.rmxts-account__welcome {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: rgba(29,29,29,0.45);
    margin: 0;
}

.rmxts-account__body {
    max-width: 1200px;
    margin: 0 auto;
    padding: 52px 40px 80px;
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 64px;
    align-items: start;
}

/* Sidebar nav */
.rmxts-account__nav .woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
    border-top: 1px solid rgba(29,29,29,1);
}

.rmxts-account__nav .woocommerce-MyAccount-navigation li {
    border-bottom: 1px solid rgba(29,29,29,0.1);
}

.rmxts-account__nav .woocommerce-MyAccount-navigation li a {
    display: block;
    padding: 14px 0;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,0.4);
    text-decoration: none;
    transition: color 0.15s;
}
.rmxts-account__nav .woocommerce-MyAccount-navigation li a:hover { color: rgba(29,29,29,1); }

.rmxts-account__nav .woocommerce-MyAccount-navigation li.is-active a,
.rmxts-account__nav .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--is-active a {
    color: rgba(29,29,29,1);
    padding-left: 10px;
    border-left: 3px solid var(--rmxts1-accent);
}

/* Content */
.rmxts-account__content {
    min-width: 0;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: rgba(29,29,29,1);
    line-height: 1.6;
}

.rmxts-account__content p { margin: 0 0 14px; }

.rmxts-account__content p a {
    color: rgba(29,29,29,1);
    font-weight: 700;
}

.rmxts-account__content h2 {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    margin: 0 0 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(29,29,29,1);
    color: rgba(29,29,29,1);
}

.rmxts-account__content h3 {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    margin: 28px 0 14px;
    color: rgba(29,29,29,1);
}

/* Orders table */
.rmxts-account__content .woocommerce-orders-table,
.rmxts-account__content .shop_table {
    width: 100%;
    border-collapse: collapse;
}

.rmxts-account__content .woocommerce-orders-table th,
.rmxts-account__content .shop_table th {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,0.45);
    padding: 0 0 12px;
    border-bottom: 1px solid rgba(29,29,29,1);
    text-align: left;
}

.rmxts-account__content .woocommerce-orders-table td,
.rmxts-account__content .shop_table td {
    padding: 14px 0;
    border-bottom: 1px solid rgba(29,29,29,0.08);
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    vertical-align: middle;
}

.rmxts-account__content a.button,
.rmxts-account__content .button {
    display: inline-block;
    height: 36px;
    line-height: 32px;
    padding: 0 16px;
    background: var(--rmxts1-accent);
    color: rgba(0,0,0,1);
    border: 2px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0;
    text-decoration: none;
}
.rmxts-account__content a.button:hover { opacity: 0.85; }

/* Forms */
.rmxts-account__content .form-row { margin: 0 0 16px; }

.rmxts-account__content .form-row label {
    display: block;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,0.55);
    margin-bottom: 8px;
}

.rmxts-account__content .form-row .input-text,
.rmxts-account__content .form-row input[type="text"],
.rmxts-account__content .form-row input[type="email"],
.rmxts-account__content .form-row input[type="password"],
.rmxts-account__content .woocommerce-input-wrapper input {
    width: 100%;
    max-width: 440px;
    height: 48px;
    border: 1px solid rgba(29,29,29,0.2);
    padding: 0 16px;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: rgba(29,29,29,1);
    background: #fff;
    border-radius: 0;
    outline: none;
    transition: border-color 0.15s;
}
.rmxts-account__content .form-row .input-text:focus { border-color: rgba(29,29,29,0.6); }

.rmxts-account__content input[type="submit"],
.rmxts-account__content button.woocommerce-Button {
    height: 44px;
    padding: 0 28px;
    background: var(--rmxts1-accent);
    color: rgba(0,0,0,1);
    border: 2px solid rgba(0,0,0,1);
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0;
    cursor: pointer;
    border-radius: 0;
    margin-top: 8px;
}
.rmxts-account__content input[type="submit"]:hover { opacity: 0.85; }

/* ─────────────────────────────────────────────────────────────────────────
   RESPONSIVE
   ───────────────────────────────────────────────────────────────────────── */

@media (max-width: 960px) {
    .rmxts-cart__body { grid-template-columns: 1fr; gap: 40px; }
    .rmxts-cart__sidebar { position: static; }

    .rmxts-checkout__body { grid-template-columns: 1fr; gap: 40px; }
    .rmxts-checkout__right { position: static; }

    .rmxts-account__body { grid-template-columns: 160px 1fr; gap: 40px; }
}

@media (max-width: 767px) {
    .rmxts-cart__heading,
    .rmxts-checkout__heading,
    .rmxts-account__heading { font-size: 40px; }

    .rmxts-cart__head,
    .rmxts-checkout__head,
    .rmxts-account__head { padding: 32px 0 24px; }

    .rmxts-cart__head-inner,
    .rmxts-checkout__head-inner,
    .rmxts-account__head-inner { padding: 0 20px; }

    .rmxts-cart__body { padding: 24px 20px 48px; }
    .rmxts-checkout__form { padding: 0 20px 48px; }
    .rmxts-account__body { grid-template-columns: 1fr; padding: 24px 20px 48px; gap: 24px; }

    /* Cart mobile: collapse table */
    .rmxts-cart__table-head { display: none; }
    .rmxts-cart__item {
        grid-template-columns: 88px 1fr;
        grid-template-rows: auto auto auto;
        gap: 6px 16px;
        padding: 20px 0;
    }
    .rct-col--product { grid-column: 1 / 3; }
    .rct-col--price::before { content: 'Price: '; font-family: 'Roboto', sans-serif; font-weight: 700; font-size: 12px; text-transform: uppercase; }
    .rct-col--sub::before   { content: 'Total: '; font-family: 'Roboto', sans-serif; font-weight: 700; font-size: 12px; text-transform: uppercase; }
    .rct-col--del { display: none; }

    /* Checkout half-width → full */
    .rmxts-checkout__left .form-row-first,
    .rmxts-checkout__left .form-row-last { width: 100%; display: block; margin-right: 0; }

    /* Account: sidebar wraps */
    .rmxts-account__nav .woocommerce-MyAccount-navigation ul { display: flex; flex-wrap: wrap; border-top: none; }
    .rmxts-account__nav .woocommerce-MyAccount-navigation li { width: 50%; border-bottom: none; border-top: 1px solid rgba(29,29,29,0.1); }
    .rmxts-account__nav .woocommerce-MyAccount-navigation li a { font-size: 12px; padding: 10px 4px; }

    .wc-page-wrap .woocommerce-order { padding: 40px 20px 48px; }
    .wc-page-wrap .woocommerce-order-overview { flex-direction: column; gap: 0; }
    .wc-page-wrap .woocommerce-order-overview li { border-right: none; border-bottom: 1px solid rgba(29,29,29,0.1); }
}

/* fix: checkout button text alignment */
.rmxts-cart__sidebar .checkout-button,
.rmxts-cart__sidebar .wc-proceed-to-checkout a.checkout-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* ── WC pages: font + spacing reset (only inside .wc-page-wrap) ─────────── */
.wc-page-wrap *,
.wc-page-wrap *::before,
.wc-page-wrap *::after {
    box-sizing: border-box;
}

.wc-page-wrap,
.wc-page-wrap p,
.wc-page-wrap span,
.wc-page-wrap li,
.wc-page-wrap td,
.wc-page-wrap th,
.wc-page-wrap a,
.wc-page-wrap label,
.wc-page-wrap input,
.wc-page-wrap select,
.wc-page-wrap textarea,
.wc-page-wrap button {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: rgba(29,29,29,1);
    line-height: 1.5;
    margin: 0;
}

.wc-page-wrap h1,
.wc-page-wrap h2,
.wc-page-wrap h3,
.wc-page-wrap h4 {
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    color: rgba(29,29,29,1);
    margin: 0;
    line-height: 1;
}

/* Roboto 700 only where explicitly needed */
.rct-col,
.rmxts-cart__back,
.rmxts-cart__sidebar .cart_totals h2,
.rmxts-cart__sidebar .shop_table th,
.rmxts-cart__coupon-btn,
.rmxts-cart__update,
.rmxts-cart__sidebar .checkout-button,
.rmxts-checkout__back,
.rmxts-checkout__steps,
.rmxts-checkout__left .form-row label,
.rmxts-checkout__left h3,
.rmxts-checkout__notes h3,
.rmxts-checkout__summary-heading,
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table tfoot th,
#payment #place_order,
.rmxts-account__nav .woocommerce-MyAccount-navigation li a,
.rmxts-account__content h2,
.rmxts-account__content h3,
.rmxts-account__content .shop_table th,
.rmxts-account__content .woocommerce-orders-table th,
.rmxts-account__content a.button,
.rmxts-account__content input[type="submit"] {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0;
}

/* Page headings stay Oswald 400 large */
.rmxts-cart__heading,
.rmxts-checkout__heading,
.rmxts-account__heading {
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    font-size: 64px;
    text-transform: uppercase;
    letter-spacing: -0.04em;
    line-height: 1;
}

/* Price totals — large Almarai 400 */
.rmxts-cart__sidebar .order-total td,
.rmxts-cart__sidebar .order-total .amount,
.woocommerce-checkout-review-order-table .order-total td {
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 28px;
    letter-spacing: -0.03em;
}

/* ── Checkout spacing fix (scoped to .wc-page-wrap only) ────────────────── */
.wc-page-wrap .woocommerce-billing-fields,
.wc-page-wrap .woocommerce-shipping-fields,
.wc-page-wrap .woocommerce-additional-fields {
    margin-bottom: 32px;
}

.wc-page-wrap .woocommerce-billing-fields h3,
.wc-page-wrap .woocommerce-shipping-fields h3,
.wc-page-wrap .woocommerce-additional-fields h3 {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,1);
    margin: 0 0 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(29,29,29,1);
}

.wc-page-wrap .form-row {
    margin-bottom: 16px;
}

.wc-page-wrap .form-row label {
    display: block;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0;
    color: rgba(29,29,29,0.6);
    margin-bottom: 8px;
}

.wc-page-wrap .form-row .input-text,
.wc-page-wrap .form-row input[type="text"],
.wc-page-wrap .form-row input[type="email"],
.wc-page-wrap .form-row input[type="tel"],
.wc-page-wrap .form-row input[type="password"],
.wc-page-wrap .form-row select,
.wc-page-wrap .form-row textarea {
    display: block;
    width: 100%;
    height: 48px;
    border: 1px solid rgba(29,29,29,0.2);
    padding: 0 16px;
    font-family: 'Almarai', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: rgba(29,29,29,1);
    background: #fff;
    border-radius: 0;
    -webkit-appearance: none;
    outline: none;
    transition: border-color 0.15s;
}

.wc-page-wrap .form-row textarea {
    height: 110px;
    padding: 14px 16px;
    resize: vertical;
}

.wc-page-wrap .form-row .input-text:focus,
.wc-page-wrap .form-row input:focus,
.wc-page-wrap .form-row select:focus {
    border-color: rgba(29,29,29,0.55);
}

.wc-page-wrap .form-row-first,
.wc-page-wrap .form-row-last {
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 8px);
}
.wc-page-wrap .form-row-first { margin-right: 16px; }

.wc-page-wrap #customer_details { margin-bottom: 8px; }
