/*
Theme Name: Saudi Riders
Theme URI: https://ksaudiriders.com
Author: Saudi Riders
Description: Static WordPress theme for Saudi Riders.
Version: 1.0.0
Text Domain: saudi-riders
*/
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700;800&family=Montserrat:wght@600;700;800;900&display=swap");

    :root {
      --green-900: #062f22;
      --green-800: #083d2c;
      --green-700: #0d5a3f;
      --green-100: #edf6f1;
      --gold: #d7b34a;
      --gold-2: #f1d36f;
      --black: #111513;
      --text: #17231d;
      --muted: #65736d;
      --line: #e5ebe8;
      --white: #ffffff;
      --soft: #f7f8f6;
      --shadow: 0 22px 60px rgba(10, 35, 25, 0.12);
      --radius-lg: 28px;
      --radius-md: 20px;
      --radius-sm: 14px;
      --container: 1180px;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      font-family: "IBM Plex Sans Arabic", "Tahoma", "Arial", sans-serif;
      background: var(--soft);
      color: var(--text);
      line-height: 1.8;
      font-weight: 500;
      overflow-x: hidden;
    }

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

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

    .container {
      width: min(var(--container), calc(100% - 40px));
      margin-inline: auto;
    }

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      border: 0;
      border-radius: 999px;
      padding: 13px 24px;
      font-weight: 800;
      cursor: pointer;
      transition: 0.25s ease;
      font-size: 15px;
      white-space: nowrap;
    }

    .btn-primary {
      color: #1c1708;
      background: linear-gradient(135deg, var(--gold), var(--gold-2));
      box-shadow: 0 14px 28px rgba(215, 179, 74, 0.25);
    }

    .btn-primary:hover {
      transform: translateY(-3px);
      box-shadow: 0 18px 36px rgba(215, 179, 74, 0.34);
    }

    .btn-outline {
      color: var(--white);
      border: 1px solid rgba(255,255,255,0.45);
      background: rgba(255,255,255,0.08);
      backdrop-filter: blur(12px);
    }

    .btn-outline:hover {
      background: rgba(255,255,255,0.16);
      transform: translateY(-3px);
    }

    .eyebrow {
      color: var(--gold);
      font-weight: 900;
      letter-spacing: 0;
      margin-bottom: 8px;
      display: inline-flex;
      align-items: center;
      gap: 10px;
    }

    .eyebrow::before {
      content: "";
      width: 34px;
      height: 2px;
      background: var(--gold);
      display: inline-block;
      border-radius: 30px;
    }

    .section {
      padding: 88px 0;
    }

    .section-head {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 24px;
      margin-bottom: 34px;
    }

    .section-head h2,
    .section-title {
      font-size: clamp(28px, 4vw, 46px);
      line-height: 1.25;
      color: var(--green-900);
      letter-spacing: 0;
      font-weight: 800;
    }

    .section-head p {
      max-width: 620px;
      color: var(--muted);
      font-size: 17px;
    }

    /* Top bar */
    .topbar {
      background: var(--green-900);
      color: rgba(255,255,255,0.82);
      font-size: 13px;
      padding: 8px 0;
    }

    .topbar .container {
      display: flex;
      justify-content: space-between;
      gap: 16px;
      align-items: center;
    }

    .topbar span {
      display: inline-flex;
      align-items: center;
      gap: 8px;
    }

    /* Header */
    .header {
      position: sticky;
      top: 0;
      z-index: 50;
      background: rgba(255,255,255,0.92);
      backdrop-filter: blur(16px);
      border-bottom: 1px solid rgba(229,235,232,0.85);
    }

    .nav {
      height: 82px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 22px;
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      min-width: max-content;
    }

    .brand-mark {
      width: 58px;
      height: 58px;
      border-radius: 18px;
      display: grid;
      place-items: center;
      background:
        radial-gradient(circle at 35% 30%, rgba(241,211,111,0.7), transparent 34%),
        linear-gradient(135deg, #0a3b2b, #111513);
      color: var(--gold-2);
      box-shadow: var(--shadow);
      font-size: 26px;
      border: 1px solid rgba(215,179,74,0.45);
    }

    .brand img {
      width: 140px;
      height: auto;
      object-fit: contain;
    }

    .brand-logo {
      width: 92px;
      height: 92px;
      object-fit: contain;
      flex: 0 0 auto;
    }

    .brand-text strong {
      display: block;
      font-family: "Montserrat", "Arial", sans-serif;
      color: var(--black);
      font-size: 20px;
      line-height: 1.1;
      letter-spacing: 0;
      font-weight: 900;
    }

    .brand-text small {
      color: var(--green-700);
      font-weight: 800;
      font-size: 12px;
    }

    .menu {
      display: flex;
      align-items: center;
      gap: 22px;
      list-style: none;
      color: #25342d;
      font-weight: 800;
      font-size: 14px;
    }

    .menu a {
      position: relative;
      transition: 0.2s ease;
    }

    .menu a::after {
      content: "";
      position: absolute;
      right: 0;
      bottom: -9px;
      width: 0;
      height: 2px;
      background: var(--gold);
      transition: 0.25s ease;
    }

    .menu a:hover {
      color: var(--green-700);
    }

    .menu a:hover::after {
      width: 100%;
    }

    .mobile-toggle {
      display: none;
      width: 44px;
      height: 44px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: var(--white);
      color: var(--green-900);
      font-size: 22px;
      cursor: pointer;
    }

    /* Hero */
    .hero {
      min-height: 740px;
      position: relative;
      isolation: isolate;
      overflow: hidden;
      color: var(--white);
      background:
        linear-gradient(90deg, rgba(3,35,25,0.98) 0%, rgba(4,42,30,0.91) 44%, rgba(5,38,29,0.35) 76%),
        url("https://images.unsplash.com/photo-1558981806-ec527fa84c39?auto=format&fit=crop&w=1800&q=80") center/cover no-repeat;
    }

    .hero::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 18% 30%, rgba(215,179,74,0.20), transparent 25%),
        radial-gradient(circle at 92% 18%, rgba(255,255,255,0.08), transparent 22%),
        linear-gradient(180deg, transparent 70%, rgba(247,248,246,1) 100%);
      z-index: -1;
    }

    .hero::after {
      content: "";
      position: absolute;
      left: -170px;
      top: 70px;
      width: 520px;
      height: 520px;
      border-radius: 50%;
      border: 1px solid rgba(215,179,74,0.18);
      box-shadow: inset 0 0 0 18px rgba(255,255,255,0.02);
      z-index: -1;
    }

    .hero-grid {
      min-height: 740px;
      display: grid;
      grid-template-columns: 0.95fr 1.05fr;
      align-items: center;
      gap: 42px;
    }

    .hero-content {
      padding-top: 40px;
      max-width: 700px;
    }

    .hero-badge {
      display: inline-flex;
      gap: 10px;
      align-items: center;
      background: rgba(255,255,255,0.10);
      border: 1px solid rgba(255,255,255,0.20);
      color: rgba(255,255,255,0.86);
      padding: 8px 14px;
      border-radius: 999px;
      font-weight: 800;
      backdrop-filter: blur(12px);
      margin-bottom: 22px;
    }

    .hero h1 {
      font-size: clamp(42px, 7vw, 78px);
      line-height: 1.12;
      letter-spacing: 0;
      margin-bottom: 24px;
      font-weight: 800;
    }

    .hero h1 span {
      color: var(--gold-2);
    }

    .hero p {
      color: rgba(255,255,255,0.86);
      font-size: 18px;
      max-width: 660px;
      margin-bottom: 30px;
    }

    .hero-actions {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
    }

    .hero-card {
      align-self: end;
      margin-bottom: 78px;
      background: rgba(255,255,255,0.10);
      border: 1px solid rgba(255,255,255,0.18);
      backdrop-filter: blur(16px);
      border-radius: var(--radius-lg);
      padding: 22px;
      max-width: 390px;
      margin-inline-start: auto;
      box-shadow: 0 30px 80px rgba(0,0,0,0.25);
    }

    .hero-card-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      margin-bottom: 14px;
    }

    .hero-card h3 {
      font-size: 22px;
    }

    .countdown {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 10px;
      margin-top: 18px;
    }

    .countdown div {
      background: rgba(255,255,255,0.12);
      border: 1px solid rgba(255,255,255,0.12);
      border-radius: 16px;
      padding: 10px 8px;
      text-align: center;
    }

    .countdown strong {
      display: block;
      color: var(--gold-2);
      font-size: 20px;
      line-height: 1.1;
    }

    .countdown small {
      color: rgba(255,255,255,0.72);
      font-size: 11px;
    }

    /* Stats */
    .stats-wrap {
      margin-top: -60px;
      position: relative;
      z-index: 5;
    }

    .stats {
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      box-shadow: var(--shadow);
      padding: 24px;
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
    }

    .stat {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 15px;
      border-radius: 22px;
      background: linear-gradient(180deg, #fff, #fbfcfb);
      border: 1px solid rgba(229,235,232,0.8);
    }

    .stat-icon {
      width: 52px;
      height: 52px;
      border-radius: 18px;
      display: grid;
      place-items: center;
      background: var(--green-100);
      color: var(--green-800);
      font-size: 24px;
    }

    .stat strong {
      display: block;
      color: var(--green-900);
      font-size: 26px;
      line-height: 1.1;
      direction: ltr;
      text-align: right;
    }

    .stat span {
      color: var(--muted);
      font-size: 13px;
      font-weight: 800;
    }

    /* About */
    .about-grid {
      display: grid;
      grid-template-columns: 1fr 1.02fr;
      gap: 54px;
      align-items: center;
    }

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

    .photo {
      min-height: 210px;
      border-radius: var(--radius-md);
      overflow: hidden;
      background-size: cover;
      background-position: center;
      box-shadow: var(--shadow);
      position: relative;
      isolation: isolate;
    }

    #wpadminbar .photo {
      min-height: auto;
      box-shadow: none;
      position: static;
    }

    #wpadminbar .photo::after {
      display: none;
    }

    .photo::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, transparent 45%, rgba(0,0,0,0.45));
    }

    .photo:first-child {
      grid-row: span 2;
      min-height: 435px;
      background-image:
        linear-gradient(rgba(6,47,34,0.06), rgba(6,47,34,0.18)),
        url("assets/images/about/HB4gAT6XsAAfLNX.jpg");
    }

    .photo:nth-child(2) {
      background-image:
        linear-gradient(rgba(6,47,34,0.08), rgba(6,47,34,0.20)),
        url("assets/images/about/HB4gAUCWQAASjHf.jpg");
    }

    .photo:nth-child(3) {
      background-image:
        linear-gradient(rgba(6,47,34,0.08), rgba(6,47,34,0.20)),
        url("assets/images/about/HB4gAUCXgAAfc-o.jpg");
    }

    .about-content p {
      color: var(--muted);
      font-size: 17px;
      margin-top: 16px;
    }

    .about-points {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
      margin-top: 26px;
    }

    .point {
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: 18px;
      padding: 16px;
      font-weight: 900;
      color: var(--green-800);
      display: flex;
      gap: 10px;
      align-items: center;
    }

    .point span {
      color: var(--gold);
      font-size: 20px;
    }

    /* Video Intro */
    .video-intro {
      background: var(--white);
      padding-top: 0;
    }

    .video-frame {
      position: relative;
      overflow: hidden;
      width: 100%;
      aspect-ratio: 16 / 9;
      border-radius: var(--radius-lg);
      background: var(--black);
      border: 1px solid var(--line);
      box-shadow: var(--shadow);
    }

    .video-frame iframe {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      border: 0;
    }

    /* About Page */
    .about-page {
      --green-950: #041f17;
      --gold-soft: #f3d977;
    }

    .about-page .about-hero {
      min-height: 640px;
      display: grid;
      align-items: center;
      color: var(--white);
      position: relative;
      isolation: isolate;
      overflow: hidden;
      background:
        linear-gradient(90deg, rgba(4,31,23,0.98), rgba(6,47,34,0.88) 48%, rgba(6,47,34,0.35)),
        url("https://images.unsplash.com/photo-1558981806-ec527fa84c39?auto=format&fit=crop&w=1800&q=85") center/cover no-repeat;
    }

    .about-page .about-hero::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 18% 22%, rgba(215,179,74,0.22), transparent 24%),
        radial-gradient(circle at 82% 78%, rgba(255,255,255,0.09), transparent 26%);
      z-index: -1;
    }

    .about-page .about-hero::after {
      content: "";
      position: absolute;
      left: -160px;
      top: 80px;
      width: 520px;
      height: 520px;
      border: 1px solid rgba(215,179,74,0.18);
      border-radius: 50%;
      box-shadow: inset 0 0 0 22px rgba(255,255,255,0.025);
      z-index: -1;
    }

    .about-page .hero-content {
      max-width: 820px;
      padding: 110px 0;
    }

    .about-page .brand-word {
      color: var(--gold-soft);
      font-weight: 900;
      letter-spacing: 0;
      margin-bottom: 12px;
      font-size: 18px;
    }

    .about-page .about-hero h1 {
      font-size: clamp(42px, 7vw, 86px);
      line-height: 1.1;
      margin-bottom: 24px;
      letter-spacing: 0;
    }

    .about-page .about-hero p {
      color: rgba(255,255,255,0.86);
      font-size: 19px;
      max-width: 780px;
      margin-top: 16px;
    }

    .about-page .hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
      align-items: center;
      margin-top: 34px;
    }

    .about-page .ghost-label {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: rgba(255,255,255,0.78);
      font-weight: 800;
    }

    .about-page .ghost-label span {
      width: 38px;
      height: 38px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      border: 1px solid rgba(255,255,255,0.28);
      background: rgba(255,255,255,0.08);
    }

    .about-page .stats-wrap {
      margin-top: -68px;
      position: relative;
      z-index: 5;
    }

    .about-page .stats {
      background: rgba(255,255,255,0.96);
      border: 1px solid rgba(228,235,231,0.9);
      border-radius: var(--radius-lg);
      box-shadow: var(--shadow);
      padding: 26px;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
      backdrop-filter: blur(14px);
    }

    .about-page .stat {
      background: linear-gradient(180deg, #ffffff, #fbfcfb);
      border: 1px solid var(--line);
      border-radius: 26px;
      padding: 28px 22px;
      text-align: center;
      position: relative;
      overflow: hidden;
    }

    .about-page .stat::before {
      content: "";
      position: absolute;
      top: -70px;
      left: -70px;
      width: 150px;
      height: 150px;
      background: rgba(215,179,74,0.10);
      border-radius: 50%;
    }

    .about-page .stat strong {
      display: block;
      color: var(--green-900);
      font-size: clamp(34px, 5vw, 52px);
      line-height: 1.1;
      direction: ltr;
      font-weight: 900;
      margin-bottom: 8px;
    }

    .about-page .stat span {
      color: var(--muted);
      font-size: 16px;
      font-weight: 900;
    }

    .about-page .join-strip {
      padding: 70px 0 20px;
    }

    .about-page .join-box {
      border-radius: var(--radius-lg);
      background:
        linear-gradient(90deg, rgba(237,246,241,0.96), rgba(255,255,255,0.92)),
        url("https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=1400&q=80") center/cover no-repeat;
      border: 1px solid var(--line);
      box-shadow: var(--shadow);
      padding: 44px;
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: center;
      gap: 30px;
      overflow: hidden;
      position: relative;
    }

    .about-page .join-box::after {
      content: "SAUDI RIDERS";
      position: absolute;
      left: 28px;
      bottom: -18px;
      font-size: clamp(44px, 9vw, 110px);
      line-height: 1;
      font-weight: 900;
      color: rgba(6,47,34,0.055);
      direction: ltr;
      pointer-events: none;
    }

    .about-page .join-box h2 {
      color: var(--green-900);
      font-size: clamp(30px, 4vw, 50px);
      line-height: 1.25;
      margin-bottom: 6px;
    }

    .about-page .join-box p {
      color: var(--muted);
      font-weight: 800;
    }

    .about-page .beliefs {
      background:
        radial-gradient(circle at 12% 14%, rgba(215,179,74,0.12), transparent 22%),
        linear-gradient(180deg, #ffffff, #f3f7f4);
    }

    .about-page .beliefs-head {
      text-align: center;
      max-width: 740px;
      margin: 0 auto 42px;
    }

    .about-page .beliefs-head .brand-word {
      color: var(--gold);
    }

    .about-page .beliefs-head h2 {
      color: var(--green-900);
      font-size: clamp(34px, 5vw, 60px);
      line-height: 1.2;
      margin-bottom: 14px;
    }

    .about-page .beliefs-head p {
      color: var(--muted);
      font-size: 17px;
    }

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

    .about-page .belief-card {
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 34px;
      box-shadow: 0 18px 50px rgba(10,35,25,0.08);
      position: relative;
      overflow: hidden;
      transition: 0.25s ease;
      min-height: 370px;
    }

    .about-page .belief-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 26px 70px rgba(10,35,25,0.13);
    }

    .about-page .belief-card::before {
      content: "";
      position: absolute;
      inset: 0;
      background: radial-gradient(circle at 10% 8%, rgba(215,179,74,0.13), transparent 26%);
      pointer-events: none;
    }

    .about-page .belief-icon {
      width: 66px;
      height: 66px;
      border-radius: 23px;
      display: grid;
      place-items: center;
      background: var(--green-900);
      color: var(--gold-soft);
      font-size: 30px;
      margin-bottom: 22px;
      position: relative;
      z-index: 1;
    }

    .about-page .belief-card h3 {
      color: var(--green-900);
      font-size: 28px;
      line-height: 1.25;
      margin-bottom: 14px;
      position: relative;
      z-index: 1;
    }

    .about-page .belief-card p {
      color: var(--muted);
      font-size: 16px;
      position: relative;
      z-index: 1;
    }

    .about-page .belief-card.featured {
      background:
        linear-gradient(160deg, rgba(6,47,34,0.97), rgba(10,69,50,0.94)),
        url("https://images.unsplash.com/photo-1558981033-0f0309284409?auto=format&fit=crop&w=900&q=80") center/cover;
      color: var(--white);
      border-color: rgba(215,179,74,0.28);
    }

    .about-page .belief-card.featured h3,
    .about-page .belief-card.featured p {
      color: var(--white);
    }

    .about-page .belief-card.featured p {
      color: rgba(255,255,255,0.78);
    }

    .about-page .belief-card.featured .belief-icon {
      background: rgba(255,255,255,0.12);
      border: 1px solid rgba(255,255,255,0.18);
    }

    /* Vision Mission */
    .vm {
      background:
        radial-gradient(circle at 15% 30%, rgba(215,179,74,0.12), transparent 22%),
        linear-gradient(180deg, #ffffff, #f3f7f4);
    }

    .vm-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 24px;
    }

    .vm-card {
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 34px;
      box-shadow: var(--shadow);
      position: relative;
      overflow: hidden;
    }

    .vm-card::before {
      content: "";
      position: absolute;
      top: -70px;
      left: -70px;
      width: 180px;
      height: 180px;
      border-radius: 50%;
      background: rgba(215,179,74,0.12);
    }

    .vm-icon {
      width: 66px;
      height: 66px;
      border-radius: 22px;
      display: grid;
      place-items: center;
      background: var(--green-900);
      color: var(--gold-2);
      font-size: 30px;
      margin-bottom: 20px;
    }

    .vm-card h3 {
      color: var(--green-900);
      font-size: 28px;
      margin-bottom: 10px;
    }

    .vm-card p {
      color: var(--muted);
      font-size: 17px;
    }

    /* Team */
    .team {
      color: var(--white);
      background:
        radial-gradient(circle at 22% 16%, rgba(215,179,74,0.14), transparent 20%),
        linear-gradient(135deg, rgba(4,43,31,0.96), rgba(6,47,34,0.96)),
        url("https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=1600&q=80") center/cover fixed;
      position: relative;
      overflow: hidden;
    }

    .team .section-title {
      color: var(--white);
    }

    .team-grid {
      display: grid;
      grid-template-columns: 0.9fr 1.1fr;
      gap: 42px;
      align-items: center;
    }

    .team-text p {
      color: rgba(255,255,255,0.78);
      margin-top: 14px;
      font-size: 17px;
    }

    .members {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
    }

    .member {
      min-height: 290px;
      border-radius: 24px;
      overflow: hidden;
      background:
        linear-gradient(180deg, transparent 35%, rgba(0,0,0,0.76)),
        url("assets/images/crew1.jpg") center/cover;
      border: 1px solid rgba(255,255,255,0.18);
      display: flex;
      align-items: end;
      padding: 18px;
      box-shadow: 0 20px 50px rgba(0,0,0,0.25);
    }

    .member:nth-child(2) {
      background:
        linear-gradient(180deg, transparent 35%, rgba(0,0,0,0.76)),
        url("assets/images/crew2.jpg") center/cover;
    }

    .member h4 {
      font-size: 17px;
    }

    .member span {
      color: var(--gold-2);
      font-size: 12px;
      font-weight: 900;
    }

    /* Cards */
    .cards {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
    }

    .card {
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      overflow: hidden;
      box-shadow: 0 18px 45px rgba(10, 35, 25, 0.08);
      transition: 0.25s ease;
    }

    .card:hover {
      transform: translateY(-7px);
      box-shadow: 0 24px 60px rgba(10, 35, 25, 0.14);
    }

    .card-img {
      height: 210px;
      background:
        linear-gradient(180deg, transparent 40%, rgba(0,0,0,0.48)),
        url("https://images.unsplash.com/photo-1558981806-ec527fa84c39?auto=format&fit=crop&w=800&q=80") center/cover;
      position: relative;
    }

    .cards .card:nth-child(2) .card-img {
      background:
        linear-gradient(180deg, transparent 40%, rgba(0,0,0,0.48)),
        url("https://images.unsplash.com/photo-1558981033-0f0309284409?auto=format&fit=crop&w=800&q=80") center/cover;
    }

    .cards .card:nth-child(3) .card-img {
      background:
        linear-gradient(180deg, transparent 40%, rgba(0,0,0,0.48)),
        url("https://images.unsplash.com/photo-1519750783826-e2420f4d687f?auto=format&fit=crop&w=800&q=80") center/cover;
    }

    .date {
      position: absolute;
      top: 16px;
      right: 16px;
      background: var(--green-900);
      color: var(--white);
      border-radius: 16px;
      width: 62px;
      height: 62px;
      display: grid;
      place-items: center;
      text-align: center;
      line-height: 1.1;
      font-weight: 900;
      border: 1px solid rgba(255,255,255,0.16);
    }

    .date small {
      display: block;
      color: var(--gold-2);
      font-size: 10px;
    }

    .card-body {
      padding: 24px;
    }

    .tag {
      display: inline-flex;
      color: var(--green-800);
      background: var(--green-100);
      padding: 5px 10px;
      border-radius: 999px;
      font-size: 12px;
      font-weight: 900;
      margin-bottom: 12px;
    }

    .card h3 {
      color: var(--green-900);
      font-size: 21px;
      margin-bottom: 10px;
      line-height: 1.45;
    }

    .card p {
      color: var(--muted);
      font-size: 15px;
    }

    .events {
      background: var(--soft);
    }

    .news {
      background: var(--white);
    }

    .news-layout {
      display: grid;
      grid-template-columns: 0.75fr 1.25fr;
      gap: 28px;
      align-items: start;
    }

    .news-feature {
      background:
        linear-gradient(180deg, rgba(6,47,34,0.20), rgba(6,47,34,0.86)),
        url("https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=900&q=80") center/cover;
      border-radius: var(--radius-lg);
      color: var(--white);
      min-height: 440px;
      padding: 32px;
      display: flex;
      flex-direction: column;
      justify-content: end;
      box-shadow: var(--shadow);
    }

    .news-feature h3 {
      font-size: 30px;
      margin-bottom: 10px;
    }

    .news-feature p {
      color: rgba(255,255,255,0.82);
    }

    .news-list {
      display: grid;
      gap: 16px;
    }

    .news-item {
      display: grid;
      grid-template-columns: 170px 1fr;
      gap: 18px;
      background: #fff;
      border: 1px solid var(--line);
      border-radius: 24px;
      padding: 14px;
      align-items: center;
      transition: 0.25s ease;
    }

    .news-item:hover {
      transform: translateX(-5px);
      box-shadow: 0 16px 40px rgba(10,35,25,0.09);
    }

    .news-thumb {
      height: 126px;
      border-radius: 18px;
      background:
        linear-gradient(180deg, transparent, rgba(0,0,0,0.36)),
        url("https://images.unsplash.com/photo-1558981403-c5f9899a28bc?auto=format&fit=crop&w=600&q=80") center/cover;
    }

    .news-item:nth-child(2) .news-thumb {
      background:
        linear-gradient(180deg, transparent, rgba(0,0,0,0.36)),
        url("https://images.unsplash.com/photo-1571637012906-bf4c57f8d522?auto=format&fit=crop&w=600&q=80") center/cover;
    }

    .news-item:nth-child(3) .news-thumb {
      background:
        linear-gradient(180deg, transparent, rgba(0,0,0,0.36)),
        url("https://images.unsplash.com/photo-1532298229144-0ec0c57515c7?auto=format&fit=crop&w=600&q=80") center/cover;
    }

    .news-item h3 {
      color: var(--green-900);
      font-size: 20px;
      margin-bottom: 6px;
    }

    .news-item p {
      color: var(--muted);
      font-size: 14px;
    }

    /* CTA */
    .cta {
      padding: 70px 0;
      background:
        linear-gradient(90deg, rgba(6,47,34,0.96), rgba(6,47,34,0.78)),
        url("https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=1600&q=80") center/cover;
      color: var(--white);
    }

    .cta-box {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 30px;
      align-items: center;
    }

    .cta h2 {
      font-size: clamp(30px, 5vw, 52px);
      line-height: 1.2;
      margin-bottom: 12px;
    }

    .cta p {
      color: rgba(255,255,255,0.82);
      max-width: 850px;
      font-size: 17px;
    }

    /* Footer */
    .footer {
      background: #101412;
      color: rgba(255,255,255,0.78);
      padding: 70px 0 24px;
    }

    .footer-grid {
      display: grid;
      grid-template-columns: 1.25fr 0.75fr 0.75fr 0.9fr;
      gap: 34px;
      padding-bottom: 42px;
      border-bottom: 1px solid rgba(255,255,255,0.10);
    }

    .footer h3 {
      color: var(--white);
      font-size: 18px;
      margin-bottom: 16px;
    }

    .footer p,
    .footer li {
      color: rgba(255,255,255,0.68);
      font-size: 14px;
    }

    .footer ul {
      list-style: none;
      display: grid;
      gap: 8px;
    }

    .footer a:hover {
      color: var(--gold-2);
    }

    .social {
      display: flex;
      gap: 10px;
      margin-top: 18px;
      flex-wrap: wrap;
    }

    .social a {
      width: 40px;
      height: 40px;
      border-radius: 14px;
      background: rgba(255,255,255,0.08);
      display: grid;
      place-items: center;
      border: 1px solid rgba(255,255,255,0.10);
      transition: 0.25s ease;
      font-size: 18px;
    }

    .social a:hover {
      background: var(--gold);
      color: var(--black);
      transform: translateY(-4px);
    }

    .copy {
      padding-top: 24px;
      display: flex;
      justify-content: space-between;
      gap: 16px;
      color: rgba(255,255,255,0.5);
      font-size: 13px;
    }

    /* Mobile */
    @media (max-width: 1100px) {
      .menu,
      .nav > .btn {
        display: none;
      }

      .mobile-toggle {
        display: grid;
        place-items: center;
      }

      .menu.is-open {
        position: absolute;
        top: 82px;
        right: 20px;
        left: 20px;
        display: grid;
        gap: 0;
        background: var(--white);
        border: 1px solid var(--line);
        border-radius: 22px;
        box-shadow: var(--shadow);
        padding: 12px;
      }

      .menu.is-open li a {
        display: block;
        padding: 12px;
        border-radius: 14px;
      }

      .menu.is-open li a:hover {
        background: var(--green-100);
      }

      .hero-grid,
      .about-grid,
      .team-grid,
      .news-layout,
      .cta-box {
        grid-template-columns: 1fr;
      }

      .hero-card {
        margin-inline-start: 0;
        margin-bottom: 40px;
      }

      .stats,
      .cards,
      .members,
      .footer-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .vm-grid {
        grid-template-columns: 1fr;
      }

      .about-page .stats,
      .about-page .beliefs-grid,
      .about-page .join-box {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 720px) {
      .container {
        width: min(100% - 26px, var(--container));
      }

      .topbar .container {
        align-items: flex-start;
        flex-direction: column;
      }

      .nav {
        height: 72px;
      }

      .brand-mark {
        width: 48px;
        height: 48px;
      }

      .brand-logo {
        width: 72px;
        height: 72px;
      }

      .brand-text strong {
        font-size: 17px;
      }

      .menu.is-open {
        top: 72px;
      }

      .hero,
      .hero-grid {
        min-height: auto;
      }

      .hero {
        padding: 72px 0 120px;
      }

      .hero-content {
        padding-top: 0;
      }

      .hero-card {
        margin-top: 32px;
      }

      .stats-wrap {
        margin-top: -72px;
      }

      .stats,
      .cards,
      .members,
      .footer-grid,
      .about-points,
      .photo-grid {
        grid-template-columns: 1fr;
      }

      .photo:first-child {
        min-height: 280px;
      }

      .section {
        padding: 62px 0;
      }

      .section-head {
        display: block;
      }

      .section-head p {
        margin-top: 10px;
      }

      .news-item {
        grid-template-columns: 1fr;
      }

      .copy {
        flex-direction: column;
      }

      .hero-actions .btn,
      .cta .btn {
        width: 100%;
      }

      .about-page .about-hero {
        min-height: auto;
      }

      .about-page .hero-content {
        padding: 78px 0 120px;
      }

      .about-page .about-hero p {
        font-size: 16px;
      }

      .about-page .stats-wrap {
        margin-top: -86px;
      }

      .about-page .join-box,
      .about-page .belief-card {
        padding: 26px;
      }

      .about-page .hero-actions .btn,
      .about-page .join-box .btn {
        width: 100%;
      }
    }

    /* ==========================================================================
       Single News Page Styles
       ========================================================================== */

    /* Hero */
    .news-hero {
      min-height: 620px;
      display: grid;
      align-items: center;
      color: var(--white);
      position: relative;
      isolation: isolate;
      overflow: hidden;
      background:
        linear-gradient(90deg, rgba(4,31,23,0.98), rgba(6,47,34,0.88) 52%, rgba(6,47,34,0.30)),
        url("https://images.unsplash.com/photo-1558981033-0f0309284409?auto=format&fit=crop&w=1800&q=85") center/cover no-repeat;
    }

    .news-hero::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 18% 22%, rgba(215,179,74,0.22), transparent 24%),
        radial-gradient(circle at 82% 78%, rgba(255,255,255,0.09), transparent 26%);
      z-index: -1;
    }

    .news-hero::after {
      content: "NEWS";
      position: absolute;
      left: 24px;
      bottom: -18px;
      font-size: clamp(64px, 13vw, 170px);
      font-weight: 900;
      line-height: 1;
      color: rgba(255,255,255,0.055);
      direction: ltr;
      z-index: -1;
      pointer-events: none;
    }

    .news-hero .hero-content {
      max-width: 900px;
      padding: 90px 0;
    }

    .news-hero h1 {
      font-size: clamp(38px, 6vw, 78px);
      line-height: 1.18;
      margin-bottom: 22px;
      letter-spacing: -2px;
      max-width: 980px;
    }

    .news-hero p {
      color: rgba(255,255,255,0.84);
      font-size: 18px;
      max-width: 790px;
    }

    .news-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 26px;
    }

    .news-meta span {
      background: rgba(255,255,255,0.11);
      border: 1px solid rgba(255,255,255,0.16);
      color: rgba(255,255,255,0.86);
      border-radius: 999px;
      padding: 8px 13px;
      font-weight: 900;
      font-size: 13px;
      backdrop-filter: blur(12px);
    }

    /* Article */
    .article-wrap {
      margin-top: -76px;
      position: relative;
      z-index: 5;
    }

    .article-layout {
      display: grid;
      grid-template-columns: 1.12fr 0.88fr;
      gap: 28px;
      align-items: start;
    }

    .article-card {
      background: var(--white);
      border: 1px solid rgba(228,235,231,0.9);
      border-radius: var(--radius-lg);
      box-shadow: var(--shadow);
      overflow: hidden;
    }

    .main-image {
      height: 440px;
      background:
        linear-gradient(180deg, transparent 40%, rgba(4,31,23,0.72)),
        url("https://images.unsplash.com/photo-1558981033-0f0309284409?auto=format&fit=crop&w=1400&q=85") center/cover;
      position: relative;
    }

    .image-tag {
      position: absolute;
      right: 22px;
      bottom: 22px;
      background: var(--green-900);
      color: var(--gold-soft);
      border-radius: 999px;
      padding: 8px 14px;
      font-size: 13px;
      font-weight: 900;
      border: 1px solid rgba(215,179,74,0.20);
    }

    .article-content {
      padding: 42px;
    }

    .article-content h2 {
      color: var(--green-900);
      font-size: clamp(28px, 4vw, 46px);
      line-height: 1.25;
      margin-bottom: 18px;
    }

    .article-content p {
      color: var(--muted);
      font-size: 17px;
      margin-bottom: 18px;
    }

    .article-content blockquote {
      margin: 32px 0;
      padding: 28px;
      border-radius: var(--radius-md);
      background: var(--green-100);
      color: var(--green-900);
      border-right: 5px solid var(--gold);
      font-weight: 900;
      font-size: 20px;
      line-height: 1.8;
      position: relative;
    }

    .article-content ul {
      list-style: none;
      display: grid;
      gap: 12px;
      margin: 24px 0;
    }

    .article-content li {
      color: var(--green-900);
      background: #fbfcfb;
      border: 1px solid var(--line);
      border-radius: 18px;
      padding: 13px 16px;
      font-weight: 800;
      display: flex;
      gap: 10px;
      align-items: flex-start;
    }

    .article-content li i {
      color: var(--gold);
      margin-top: 5px;
      flex: 0 0 auto;
    }

    .share-row {
      margin-top: 32px;
      padding-top: 26px;
      border-top: 1px solid var(--line);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      flex-wrap: wrap;
    }

    .share-row strong {
      color: var(--green-900);
    }

    .social {
      display: flex;
      gap: 9px;
      flex-wrap: wrap;
    }

    .social a {
      width: 42px;
      height: 42px;
      display: grid;
      place-items: center;
      border-radius: 15px;
      border: 1px solid var(--line);
      background: var(--soft);
      color: var(--green-900);
      font-weight: 900;
      transition: 0.25s ease;
    }

    .social a:hover {
      background: var(--green-900);
      color: var(--gold-soft);
      transform: translateY(-4px);
    }

    /* Sidebar */
    .side-panel {
      display: grid;
      gap: 22px;
      position: sticky;
      top: 24px;
    }

    .side-card {
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 28px;
      box-shadow: 0 18px 50px rgba(10,35,25,0.08);
    }

    .side-card.dark {
      color: var(--white);
      background:
        linear-gradient(160deg, rgba(6,47,34,0.98), rgba(10,69,50,0.94)),
        url("https://images.unsplash.com/photo-1532298229144-0ec0c57515c7?auto=format&fit=crop&w=800&q=85") center/cover;
      border-color: rgba(215,179,74,0.20);
    }

    .side-card h3 {
      color: var(--green-900);
      font-size: 26px;
      line-height: 1.3;
      margin-bottom: 14px;
    }

    .side-card.dark h3 {
      color: var(--white);
    }

    .side-card p {
      color: var(--muted);
      font-size: 15px;
      margin-bottom: 18px;
    }

    .side-card.dark p {
      color: rgba(255,255,255,0.76);
    }

    .info-list {
      display: grid;
      gap: 12px;
    }

    .info-item {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      padding: 14px;
      border-radius: 18px;
      background: var(--green-100);
      color: var(--green-900);
    }

    .info-item span {
      color: var(--gold);
      font-size: 18px;
      flex: 0 0 auto;
    }

    .info-item strong {
      display: block;
      line-height: 1.35;
    }

    .info-item small {
      color: var(--muted);
      font-weight: 800;
    }

    .related-list {
      display: grid;
      gap: 14px;
    }

    .related-item {
      display: grid;
      grid-template-columns: 82px 1fr;
      gap: 12px;
      align-items: center;
    }

    .related-thumb {
      height: 74px;
      border-radius: 18px;
      background:
        linear-gradient(180deg, transparent 40%, rgba(4,31,23,0.54)),
        url("https://images.unsplash.com/photo-1558981403-c5f9899a28bc?auto=format&fit=crop&w=400&q=85") center/cover;
    }

    .related-item:nth-child(2) .related-thumb {
      background:
        linear-gradient(180deg, transparent 40%, rgba(4,31,23,0.54)),
        url("https://images.unsplash.com/photo-1571637012906-bf4c57f8d522?auto=format&fit=crop&w=400&q=85") center/cover;
    }

    .related-item:nth-child(3) .related-thumb {
      background:
        linear-gradient(180deg, transparent 40%, rgba(4,31,23,0.54)),
        url("https://images.unsplash.com/photo-1519750783826-e2420f4d687f?auto=format&fit=crop&w=400&q=85") center/cover;
    }

    .related-item h4 {
      color: var(--green-900);
      font-size: 15px;
      line-height: 1.45;
      margin-bottom: 2px;
    }

    .related-item small {
      color: var(--muted);
      font-weight: 800;
      font-size: 12px;
    }

    .back-section {
      padding: 0 0 90px;
      background: #ffffff;
    }

    .back-box {
      border-radius: var(--radius-lg);
      padding: 42px;
      color: var(--white);
      background:
        linear-gradient(90deg, rgba(4,31,23,0.96), rgba(6,47,34,0.82)),
        url("https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=1500&q=85") center/cover no-repeat;
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: center;
      gap: 30px;
      box-shadow: var(--shadow);
    }

    .back-box h2 {
      font-size: clamp(28px, 4vw, 48px);
      line-height: 1.25;
      margin-bottom: 8px;
    }

    .back-box p {
      color: rgba(255,255,255,0.76);
      max-width: 760px;
    }

    @media (max-width: 1050px) {
      .article-layout,
      .back-box {
        grid-template-columns: 1fr;
      }

      .side-panel {
        position: static;
      }
    }

    @media (max-width: 700px) {
      .news-hero {
        min-height: auto;
      }

      .news-hero .hero-content {
        padding: 72px 0 120px;
      }

      .news-hero p {
        font-size: 16px;
      }

      .article-wrap {
        margin-top: -88px;
      }

      .main-image {
        height: 300px;
      }

      .article-content,
      .side-card,
      .back-box {
        padding: 26px;
      }

      .article-content p {
        font-size: 16px;
      }

      .related-item {
        grid-template-columns: 1fr;
      }

      .related-thumb {
        height: 160px;
      }
    }

    /* WooCommerce */
    .sr-cart-link {
      width: 46px;
      height: 46px;
      display: grid;
      place-items: center;
      position: relative;
      flex: 0 0 auto;
      border: 1px solid var(--line);
      border-radius: 16px;
      background: var(--white);
      color: var(--green-900);
      transition: 0.25s ease;
    }

    .sr-cart-link:hover {
      background: var(--green-900);
      color: var(--gold-2);
      transform: translateY(-3px);
    }

    .sr-cart-count {
      min-width: 20px;
      height: 20px;
      padding: 0 6px;
      display: inline-grid;
      place-items: center;
      position: absolute;
      top: -7px;
      left: -7px;
      border-radius: 999px;
      background: linear-gradient(135deg, var(--gold), var(--gold-2));
      color: #1c1708;
      font-size: 11px;
      font-weight: 900;
      line-height: 1;
      box-shadow: 0 10px 22px rgba(215,179,74,0.28);
    }

    .sr-woo-page {
      background: var(--soft);
    }

    .sr-woo-page .container {
      width: min(1160px, calc(100% - 40px));
      margin-inline: auto;
    }

    .sr-woo-hero {
      min-height: 380px;
      display: grid;
      align-items: center;
      color: var(--white);
      position: relative;
      isolation: isolate;
      overflow: hidden;
      background:
        linear-gradient(90deg, rgba(4,31,23,0.98), rgba(6,47,34,0.88) 52%, rgba(6,47,34,0.30)),
        url("https://images.unsplash.com/photo-1558981806-ec527fa84c39?auto=format&fit=crop&w=1800&q=85") center/cover no-repeat;
    }

    .sr-woo-hero::after {
      content: "STORE";
      position: absolute;
      left: 24px;
      bottom: -18px;
      font-size: clamp(64px, 13vw, 170px);
      font-weight: 900;
      line-height: 1;
      color: rgba(255,255,255,0.055);
      direction: ltr;
      z-index: -1;
      pointer-events: none;
    }

    .sr-woo-hero-content {
      max-width: 850px;
      padding: 88px 0;
    }

    .sr-woo-hero .brand-word {
      color: var(--gold-2);
      font-weight: 900;
      letter-spacing: 1px;
      margin-bottom: 12px;
      font-size: 18px;
      direction: ltr;
      text-align: right;
    }

    .sr-woo-hero h1 {
      font-size: clamp(40px, 7vw, 78px);
      line-height: 1.12;
      margin-bottom: 18px;
      letter-spacing: 0;
      font-weight: 900;
    }

    .sr-woo-hero-text,
    .sr-woo-hero-text p {
      color: rgba(255,255,255,0.84);
      font-size: 18px;
      max-width: 760px;
      margin: 0;
    }

    .sr-woo-content {
      padding: 86px 0 96px;
    }

    .sr-woo-toolbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      margin-bottom: 30px;
      padding: 16px;
      border: 1px solid var(--line);
      border-radius: var(--radius-md);
      background: var(--white);
      box-shadow: 0 14px 34px rgba(10,35,25,0.06);
    }

    .woocommerce .woocommerce-result-count,
    .woocommerce-page .woocommerce-result-count,
    .woocommerce .woocommerce-ordering {
      margin: 0;
    }

    .woocommerce .woocommerce-result-count {
      color: var(--muted);
      font-weight: 800;
    }

    .woocommerce .woocommerce-ordering select,
    .woocommerce form .form-row input.input-text,
    .woocommerce form .form-row textarea,
    .woocommerce form .form-row select,
    .woocommerce .quantity .qty,
    .woocommerce input[type="text"],
    .woocommerce input[type="email"],
    .woocommerce input[type="tel"],
    .woocommerce input[type="password"],
    .woocommerce input[type="number"] {
      min-height: 48px;
      border: 1px solid var(--line);
      border-radius: 16px;
      background: var(--white);
      color: var(--text);
      padding: 10px 14px;
      font-family: inherit;
      font-weight: 700;
      outline: none;
      transition: 0.2s ease;
    }

    .woocommerce form .form-row textarea {
      min-height: 130px;
    }

    .woocommerce .woocommerce-ordering select:focus,
    .woocommerce form .form-row input.input-text:focus,
    .woocommerce form .form-row textarea:focus,
    .woocommerce form .form-row select:focus,
    .woocommerce input:focus {
      border-color: var(--gold);
      box-shadow: 0 0 0 4px rgba(215,179,74,0.16);
    }

    .woocommerce ul.products {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 24px;
      margin: 0;
    }

    .woocommerce ul.products::before,
    .woocommerce ul.products::after {
      display: none;
    }

    .woocommerce ul.products li.product,
    .woocommerce-page ul.products li.product,
    .woocommerce ul.products[class*="columns-"] li.product,
    .woocommerce-page ul.products[class*="columns-"] li.product {
      width: auto;
      float: none;
      clear: none;
      margin: 0;
      padding: 0 0 24px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      background: var(--white);
      box-shadow: 0 18px 45px rgba(10,35,25,0.08);
      text-align: right;
      transition: 0.25s ease;
    }

    .woocommerce ul.products li.product:hover {
      transform: translateY(-7px);
      box-shadow: 0 24px 60px rgba(10,35,25,0.14);
    }

    .woocommerce ul.products li.product a img {
      width: 100%;
      height: 245px;
      object-fit: cover;
      margin: 0 0 22px;
      background: var(--green-100);
    }

    .woocommerce ul.products li.product .woocommerce-loop-product__title {
      padding: 0 22px;
      margin: 0 0 8px;
      color: var(--green-900);
      font-size: 21px;
      line-height: 1.45;
      font-weight: 900;
    }

    .woocommerce ul.products li.product .price {
      display: block;
      padding: 0 22px;
      margin: 0 0 16px;
      color: var(--green-800);
      font-size: 17px;
      font-weight: 900;
    }

    .woocommerce ul.products li.product .price del {
      color: var(--muted);
      opacity: 0.7;
    }

    .woocommerce ul.products li.product .price ins {
      text-decoration: none;
    }

    .woocommerce span.onsale {
      min-width: auto;
      min-height: auto;
      padding: 7px 12px;
      top: 16px;
      right: 16px;
      left: auto;
      border-radius: 999px;
      background: var(--green-900);
      color: var(--gold-2);
      line-height: 1;
      font-size: 12px;
      font-weight: 900;
    }

    .woocommerce a.button,
    .woocommerce button.button,
    .woocommerce input.button,
    .woocommerce #respond input#submit,
    .woocommerce a.button.alt,
    .woocommerce button.button.alt,
    .woocommerce input.button.alt {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      min-height: 48px;
      margin: 0;
      border: 0;
      border-radius: 999px;
      padding: 13px 24px;
      background: linear-gradient(135deg, var(--gold), var(--gold-2));
      color: #1c1708;
      font-family: inherit;
      font-size: 15px;
      font-weight: 900;
      line-height: 1.1;
      box-shadow: 0 14px 28px rgba(215,179,74,0.25);
      transition: 0.25s ease;
    }

    .woocommerce ul.products li.product .button {
      margin: 0 22px;
    }

    .woocommerce a.button:hover,
    .woocommerce button.button:hover,
    .woocommerce input.button:hover,
    .woocommerce #respond input#submit:hover,
    .woocommerce a.button.alt:hover,
    .woocommerce button.button.alt:hover,
    .woocommerce input.button.alt:hover {
      background: linear-gradient(135deg, var(--gold), var(--gold-2));
      color: #1c1708;
      transform: translateY(-3px);
      box-shadow: 0 18px 36px rgba(215,179,74,0.34);
    }

    .woocommerce div.product {
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 28px;
      box-shadow: var(--shadow);
    }

    .woocommerce div.product div.images,
    .woocommerce div.product div.summary {
      margin-bottom: 0;
    }

    .woocommerce div.product div.images img {
      border-radius: var(--radius-md);
      background: var(--green-100);
    }

    .woocommerce div.product .product_title {
      color: var(--green-900);
      font-size: clamp(30px, 4vw, 48px);
      line-height: 1.25;
      font-weight: 900;
      margin-bottom: 12px;
    }

    .woocommerce div.product p.price,
    .woocommerce div.product span.price {
      color: var(--green-800);
      font-size: 26px;
      font-weight: 900;
    }

    .woocommerce div.product form.cart {
      display: flex;
      align-items: center;
      gap: 12px;
      flex-wrap: wrap;
      margin: 28px 0;
    }

    .woocommerce .quantity .qty {
      width: 88px;
      text-align: center;
    }

    .woocommerce div.product .woocommerce-tabs {
      padding-top: 60px !important;
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs {
      padding: 0;
      margin: 0;
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs::before,
    .woocommerce div.product .woocommerce-tabs ul.tabs li::before,
    .woocommerce div.product .woocommerce-tabs ul.tabs li::after {
      display: none;
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs li {
      border: 1px solid var(--line);
      border-radius: 999px;
      background: var(--green-100);
      margin: 0;
      padding: 0;
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs li a {
      padding: 10px 18px;
      color: var(--green-900);
      font-weight: 900;
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs li.active {
      background: var(--green-900);
      border-color: var(--green-900);
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
      color: var(--gold-2);
    }

    .woocommerce div.product .woocommerce-tabs .panel {
      margin: 18px 0 0;
      padding: 28px;
      border: 1px solid var(--line);
      border-radius: var(--radius-md);
      background: #fbfcfb;
      color: var(--muted);
    }

    .woocommerce div.product .woocommerce-tabs .panel h2,
    .woocommerce .related.products h2,
    .woocommerce .upsells.products h2 {
      color: var(--green-900);
      font-size: 28px;
      line-height: 1.35;
      margin-bottom: 14px;
      font-weight: 900;
    }

    .woocommerce table.shop_table {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      background: var(--white);
      box-shadow: 0 18px 45px rgba(10,35,25,0.08);
    }

    .woocommerce table.shop_table th,
    .woocommerce table.shop_table td {
      border-color: var(--line);
      padding: 16px;
      text-align: right;
    }

    .woocommerce table.shop_table th {
      color: var(--green-900);
      font-weight: 900;
      background: var(--green-100);
    }

    .woocommerce-cart .cart-collaterals .cart_totals,
    .woocommerce-checkout #payment,
    .woocommerce .woocommerce-customer-details address,
    .woocommerce form.checkout_coupon,
    .woocommerce form.login,
    .woocommerce form.register,
    .woocommerce .woocommerce-MyAccount-navigation,
    .woocommerce .woocommerce-MyAccount-content {
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      background: var(--white);
      padding: 26px;
      box-shadow: 0 18px 45px rgba(10,35,25,0.08);
    }

    .woocommerce-checkout #payment {
      background: var(--white);
    }

    .woocommerce-checkout #payment div.payment_box {
      background: var(--green-100);
      color: var(--green-900);
      border-radius: var(--radius-md);
    }

    .woocommerce-checkout #payment div.payment_box::before {
      border-bottom-color: var(--green-100);
    }

    .woocommerce-message,
    .woocommerce-info,
    .woocommerce-error {
      border-top: 0;
      border-right: 5px solid var(--gold);
      border-radius: var(--radius-md);
      background: var(--white);
      color: var(--green-900);
      box-shadow: 0 14px 34px rgba(10,35,25,0.08);
    }

    .woocommerce-message::before,
    .woocommerce-info::before {
      color: var(--gold);
    }

    .woocommerce-error::before {
      color: #b42318;
    }

    .woocommerce nav.woocommerce-pagination ul {
      border: 0;
      display: flex;
      justify-content: center;
      gap: 8px;
    }

    .woocommerce nav.woocommerce-pagination ul li {
      border: 0;
    }

    .woocommerce nav.woocommerce-pagination ul li a,
    .woocommerce nav.woocommerce-pagination ul li span {
      min-width: 42px;
      height: 42px;
      display: grid;
      place-items: center;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: var(--white);
      color: var(--green-900);
      font-weight: 900;
    }

    .woocommerce nav.woocommerce-pagination ul li span.current,
    .woocommerce nav.woocommerce-pagination ul li a:hover {
      background: var(--green-900);
      color: var(--gold-2);
    }

    @media (max-width: 1050px) {
      .woocommerce ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 760px) {
      .sr-cart-link {
        width: 42px;
        height: 42px;
        border-radius: 14px;
      }

      .sr-woo-hero {
        min-height: auto;
      }

      .sr-woo-hero-content {
        padding: 72px 0;
      }

      .sr-woo-toolbar {
        align-items: stretch;
        flex-direction: column;
      }

      .woocommerce ul.products {
        grid-template-columns: 1fr;
      }

      .woocommerce ul.products li.product a img {
        height: 220px;
      }

      .woocommerce div.product {
        padding: 18px;
      }

      .woocommerce div.product form.cart {
        align-items: stretch;
        flex-direction: column;
      }

      .woocommerce .quantity .qty,
      .woocommerce div.product form.cart .button {
        width: 100%;
      }

      .woocommerce table.shop_table_responsive tr td,
      .woocommerce-page table.shop_table_responsive tr td {
        text-align: left !important;
      }

      .woocommerce table.shop_table_responsive tr td::before,
      .woocommerce-page table.shop_table_responsive tr td::before {
        float: right;
        color: var(--green-900);
        font-weight: 900;
      }
    }