/* ── Reset & base ─────────────────────────────────────── */
    *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
    html { scroll-behavior: smooth; }

    :root {
      --cream:  #FAF4E4;
      --yellow: #FEB801;
      --red:    #BF3232;
      --black:  #000000;
      --gray:   #797979;
    }

    body {
      font-family: 'Rubik', sans-serif;
      background-color: var(--cream);
      overflow-x: hidden;
    }

    img { display: block; max-width: 100%; }
    a   { text-decoration: none; color: inherit; }

    .center{
      margin: 0 auto;
      width: 70%;
      max-width: 1200px;
    }

    .wave{
      width: 100%;
    }

    .wave-mobile{
      width: 100%;
      display: none;
    }
    @media (max-width: 640px) {
      .wave-mobile { display: block; }
      .wave { display: none; }
    }
    /* ── TOP BANNER ───────────────────────────────────────── */
    .top-banner {
      position: relative;
      z-index: 20;
      line-height: 0;
    }
    .top-banner-bg {
      width: 100%;
      display: block;
    }
    .top-banner-bg--mobile { display: none; }
    @media (max-width: 640px) {
      .top-banner-bg--desktop { display: none; }
      .top-banner-bg--mobile  { display: block; }
    }
    .top-banner-text {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      /* push text up into the red area, above the wave (~40% from top) */
      padding-bottom: 1rem;
    }
    .top-banner-text p {
      font-family: 'Rubik', sans-serif;
      font-weight: 700;
      font-size: 14px;
      color: var(--cream);
      letter-spacing: 0.8px;
      text-transform: uppercase;
      line-height: 24px;
    }

    /* ── NAVBAR ───────────────────────────────────────────── */
    .navbar-bg {
      background: var(--red);
      padding: 1rem 0rem;
      /* position: fixed; */
      top: 0;
      left: 0;
      right: 0;
      z-index: 1000;
    }

     .navbar-bg-white {
      background: var(--cream);
      padding: 1rem 0rem;
      /* position: fixed; */
      top: 0;
      left: 0;
      right: 0;
      z-index: 1000;
    }

    .herop{
      color: var(--cream);
    }
    .navbar {
      position: relative;
      background: var(--cream);
      border-radius: 0.5rem;
      padding: 0.5rem 2rem 0.5rem 0.5rem;
      max-width: 1440px;
      margin: 0 auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border: 2px solid var(--black);
      box-shadow: 0 4px 0 var(--black);
      max-width: 1200px;
    }
    .navbar-logo {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .navbar-logo img {
      height: 56px;
      width: auto;
    }
    .navbar-nav {
      display: flex;
      align-items: center;
      gap: 2rem;
    }
    .navbar-nav a {
      font-family: 'Rubik', sans-serif;
      font-weight: 500;
      font-size: 16px;
      color: var(--black);
      transition: color 0.2s ease;
    }

    .navbar-nav a:hover {
      color: var(--yellow);
    }

    /* ── COUNTRIES DROPDOWN ─────────────────────────────── */
    .nav-dropdown { position: relative; }
    .nav-dropdown-trigger {
      font-family: 'Rubik', sans-serif;
      font-weight: 500;
      font-size: 16px;
      color: var(--black);
      background: none;
      border: none;
      cursor: pointer;
      padding: 0;
      display: flex;
      align-items: center;
      gap: 4px;
    }
    
    .nav-dropdown-trigger:hover {
         color: var(--yellow);
         transition: 0.2s ease-in-out;
     }

    .nav-dropdown-arrow {
      font-size: 11px;
      display: inline-block;
      transition: transform 0.2s ease;
    }
    .nav-dropdown.open .nav-dropdown-arrow { transform: rotate(180deg); }
    .nav-dropdown-menu {
      position: absolute;
      top: calc(100% + 32px);
      left: 0;
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 12px;
      box-shadow: 0 6px 0 var(--black);
      min-width: 320px;
      max-height: 70vh;
      overflow-y: auto;
      z-index: 300;
      display: none;
      flex-direction: column;
    }
    .nav-dropdown.open .nav-dropdown-menu { display: flex; }
    .nav-dropdown-menu a {
      display: flex;
      flex-direction: column;
      gap: 2px;
      padding: 14px 24px;
      white-space: nowrap;
      border-bottom: 1px solid black;
    }
    .nav-dropdown-menu a:last-child { border-bottom: none; }
    .nav-dropdown-menu a:hover { background: rgba(0,0,0,0.04); }
    .dd-url {
      font-family: 'Rubik', sans-serif;
      font-weight: 700;
      font-size: 17px;
      color: var(--red);
    }
    .dd-country {
      font-family: 'Rubik', sans-serif;
      font-weight: 400;
      font-size: 14px;
      color: #241C16;
    }
    .navbar-actions {
      display: none;
      align-items: center;
      gap: 18px;
    }
    .navbar-actions img {
      width: 22px;
      height: 22px;
      cursor: pointer;
      object-fit: contain;
    }
    .hamburger {
      display: none;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 5px;
      cursor: pointer;
      padding: 4px;
      background: none;
      border: none;
      width: 32px;
      height: 32px;
    }
    .hamburger-bar {
      display: block;
      width: 24px;
      height: 2px;
      background: var(--black);
      border-radius: 2px;
      transition: opacity 0.15s ease;
    }
    .hamburger-close {
      display: none;
      font-size: 22px;
      font-weight: 400;
      color: var(--black);
      line-height: 1;
    }
    /* Swap to close icon when open */
    .hamburger.is-open .hamburger-bar   { display: none; }
    .hamburger.is-open .hamburger-close { display: block; }

    /* ── HERO ─────────────────────────────────────────────── */
    .hero {
      background: var(--red);
      position: relative;
      overflow: hidden;
    }
    .hero-bg { display: none; }
    .hero-inner {
      position: relative;
      z-index: 2;
      margin: 0 auto;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 64px;
      padding: 40px 0px 0px 0px;
    }
    .hero-text {
      display: flex;
      flex-direction: column;
      gap: 32px;
      max-width: 543px;
    }
    .hero-title {
      
font-family: 'Dela Gothic One', sans-serif;
font-size: clamp(36px, 5vw, 56px);
color: var(--cream);
line-height: 1;
text-transform: uppercase;

/* -webkit-text-stroke: 1px #000; borde negro */
/* text-shadow: 0 4px 0 #000; lo que ya tenías */
    }
    .hero-sub {
      display: flex;
      flex-direction: column;
      gap: 0;
    }
    .hero-sub p {
      font-family: 'Rubik', sans-serif;
      font-size: clamp(15px, 1.8vw, 20px);
      font-weight: 400;
      color: var(--cream);
      line-height: 1.25;
    }
    .btn-hero {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 12px 32px;
      height: 56px;
      background: var(--yellow);
      border: 2px solid var(--black);
      border-radius: 8px;
      box-shadow: 0 6px 0 var(--black);
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 16px;
      color: var(--black);
      text-transform: capitalize;
      white-space: nowrap;
      align-self: flex-start;
      transition: transform 0.1s ease, box-shadow 0.1s ease;

    }


    .btn-hero:hover {
      transform: translateY(3px);
      box-shadow: 0 3px 0 var(--black);
    }
    .hero-mascot {
      position: relative;
      flex-shrink: 0;
      width: clamp(220px, 28vw, 388px);
      aspect-ratio: 322 / 341;
      align-self: flex-end;
    }
    .hero-mascot img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: contain;
    }

    /* Wavy bottom edge of hero */
    .hero-wave {
      position: absolute;
      bottom: -2px;
      left: 0;
      right: 0;
      line-height: 0;
      z-index: 3;
    }
    .hero-wave img {
      width: 100%;
      display: block;
    }

    /* ── WE ARE GLOBAL ────────────────────────────────────── */
    .global-section {
      background: var(--cream);
      padding: 40px 24px 60px;
      text-align: center;
    }
    .global-inner {
      max-width: 780px;
      margin: 0 auto;
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    .global-section h2 {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: clamp(32px, 5vw, 52px);
      color: #241C16;
      margin-bottom: 16px;
    }
    .global-section .subtitle {
      font-size: 16px;
      color: var(--black);
      max-width: 520px;
      margin: 0 auto 40px;
      line-height: 1.25;
    }

    /* Map wrapper — keeps aspect ratio 723:364 */
    .global-map-wrap {
      position: relative;
      width: 100%;
      padding-bottom: 50.35%; /* 364/723 */
      isolation: isolate;
    }
    .global-map-img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      pointer-events: none;
    }

    /* ── PIN BUTTONS ──────────────────────────────────────── */
    .map-pin-btn {
      position: absolute;
      background: none;
      border: none;
      cursor: pointer;
      padding: 0;
      transform: translate(-50%, -50%);
      z-index: 2;
    }
    .pin-dot {
      display: block;
      border-radius: 50%;
      background: var(--red);
      border: 2px solid #fff;
      box-shadow: 0 2px 5px rgba(0,0,0,0.35);
      transition: transform 0.15s ease;
    }
    .pin-dot--lg, .pin-dot--sm { width: 13px; height: 13px; }
    .map-pin-btn:hover,
    .map-pin-btn:focus-visible,
    .map-pin-btn.pin-open { z-index: 100; }
    .map-pin-btn:hover .pin-dot,
    .map-pin-btn:focus-visible .pin-dot { transform: scale(1.4); }

    /* ── COUNTRY POPUP CARD ───────────────────────────────── */
    .pin-card {
      position: absolute;
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 12px;
      box-shadow: 0 6px 0 var(--black);
      padding: 12px 16px;
      white-space: nowrap;
      text-align: left;
      pointer-events: none;
      opacity: 0;
      transition: opacity 0.15s ease, transform 0.15s ease;
      z-index: 200;
    }
    .map-pin-btn:hover .pin-card,
    .map-pin-btn:focus-visible .pin-card {
      opacity: 1;
      pointer-events: auto;
    }
    .pin-card strong {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 14px;
      font-weight: 400;
      display: block;
      color: var(--black);
      margin-bottom: 3px;
      line-height: 1.4;
    }
    .pin-card a {
      font-family: 'Rubik', sans-serif;
      font-size: 13px;
      color: var(--red);
      text-decoration: underline;
    }

    /* Card opens to the right */
    .popup-right .pin-card {
      left: calc(100% + 8px);
      top: 50%;
      transform: translateY(calc(-50% + 6px));
    }
    .map-pin-btn.popup-right:hover .pin-card,
    .map-pin-btn.popup-right:focus-visible .pin-card { transform: translateY(-50%); }

    /* Card opens to the left */
    .popup-left .pin-card {
      right: calc(100% + 8px);
      top: 50%;
      transform: translateY(calc(-50% + 6px));
    }
    .map-pin-btn.popup-left:hover .pin-card,
    .map-pin-btn.popup-left:focus-visible .pin-card { transform: translateY(-50%); }

    /* Card opens below */
    .popup-below .pin-card {
      top: calc(100% + 8px);
      left: 50%;
      transform: translateX(-50%) translateY(6px);
    }
    .map-pin-btn.popup-below:hover .pin-card,
    .map-pin-btn.popup-below:focus-visible .pin-card { transform: translateX(-50%) translateY(0); }

    /* Mobile tap-to-open: .pin-open mirrors hover state */
    .map-pin-btn.pin-open .pin-dot { transform: scale(1.4); }
    .map-pin-btn.pin-open .pin-card { opacity: 1; pointer-events: auto; }
    .map-pin-btn.popup-right.pin-open .pin-card  { transform: translateY(-50%); }
    .map-pin-btn.popup-left.pin-open  .pin-card  { transform: translateY(-50%); }
    .map-pin-btn.popup-below.pin-open .pin-card  { transform: translateX(-50%) translateY(0); }

    /* Mascot inside the map, bottom-right */
    .global-mascot-map {
      position: absolute;
      right: 20%;
      bottom: -6%;
      width: 23%;
      aspect-ratio: 168 / 178;
    }
    .global-mascot-map img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: contain;
    }

    .btn-primary {
      display: inline-block;
      margin-top: 44px;
      padding: 16px 40px;
      background: var(--yellow);
      border: 2px solid var(--black);
      border-radius: 8px;
      box-shadow: 0 6px 0 var(--black);
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 16px;
      color: var(--black);
      cursor: pointer;
      transition: transform 0.1s ease, box-shadow 0.1s ease;
    }
    .btn-primary:hover {
      transform: translateY(3px);
      box-shadow: 0 3px 0 var(--black);
    }

    /* ── B2B CLIENTS CAROUSEL ─────────────────────────────── */
    .clients-section {
      background: var(--cream);
      padding: 40px 0 40px;
    }
    .clients-section h2 {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: clamp(28px, 4vw, 42px);
      text-align: center;
      color: var(--black);
      margin-bottom: 36px;
    }
    .carousel-track-wrapper {
      overflow: hidden;
      position: relative;
    }
    .carousel-track {
      display: flex;
      gap: 1rem;
      padding: 0 190px 16px;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      scroll-behavior: smooth;
      scrollbar-width: none;
      -ms-overflow-style: none;
    }
    .carousel-track::-webkit-scrollbar { display: none; }

    .client-card {
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 12px;
      box-shadow: 0 6px 0 var(--black);
      padding: 24px;
      min-width: 300px;
      max-width: 300px;
      flex-shrink: 0;
      scroll-snap-align: start;
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    .client-card-img {
      width: 100%;
      aspect-ratio: 1;
      border-radius: 8px;
      overflow: hidden;
      background: #f5f5f5;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .client-card-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .client-name {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 16px;
      text-transform: uppercase;
      color: var(--black);
    }
    .client-desc {
      font-size: 14px;
      font-weight: 500;
      line-height: 1.5;
      color: var(--black);
    }

    /* Carousel controls */
    .carousel-controls {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 24px;
      margin-top: 32px;
    }
    .carousel-arrow {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      background: var(--yellow);
      border: 2px solid var(--black);
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: transform 0.1s ease;
      flex-shrink: 0;
    }
    .carousel-arrow:hover { transform: scale(1.05); }
    .arrow-icon { width: 16px; height: 16px; display: block; }
    .carousel-dots {
      display: flex;
      gap: 8px;
      align-items: center;
    }
    .dot {
      width: 12px;
      height: 12px;
      border-radius: 50%;
      border: 1.5px solid black;
      background-color: var(--cream);
      cursor: pointer;
      transition: background 0.2s;
    }
    .dot.active {
      background: var(--yellow);
      border-color: var(--black);
    }

    /* ── B2B CTA ──────────────────────────────────────────── */
    .b2b-section {
      background: var(--red);
      display: flex;
      gap: 40px;
      align-items: flex-start;
      padding-bottom: 2rem;
    }

    .b2b-inner{
      display: flex;
      justify-content: space-between;
      gap: 40px;
      padding: 64px 0px 0px 0px;
    }
    .b2b-left {
      width: 356px;
      flex: 1;
      flex-shrink: 0;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 32px;
    }
    .b2b-title {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: clamp(28px, 3.5vw, 42px);
      color: var(--cream);
      line-height: 1.1;
    }
    .b2b-mascot {
      width: 280px;
      height: 280px;
      position: relative;
    }
    .b2b-mascot img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: contain;
    }
    .b2b-right {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 32px;
    }
    .form-group {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .form-label {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 16px;
      color: var(--cream);
      letter-spacing: -0.3px;
      margin-top: 1rem;
    }
    .form-input {
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 8px;
      box-shadow: 0 6px 0 var(--black);
      padding: 12px 16px;
      font-family: 'Rubik', sans-serif;
      font-size: 16px;
      color: var(--gray);
      width: 100%;
      outline: none;
      font-weight: 400;
    }
    .form-input:focus {
      color: var(--black);
    }
    .form-textarea {
      height: 160px;
      resize: none;
      margin-bottom: 2rem;
    }
    .btn-submit {
      background: var(--yellow);
      border: 2px solid var(--black);
      border-radius: 8px;
      box-shadow: 0 6px 0 var(--black);
      padding: 16px;
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 16px;
      color: var(--black);
      text-align: center;
      width: 100%;
      cursor: pointer;
      transition: transform 0.1s ease, box-shadow 0.1s ease;
      border: 2px solid var(--black);
    }
    .btn-submit:hover {
      transform: translateY(3px);
      box-shadow: 0 3px 0 var(--black);
    }

    /* ── FOOTER ───────────────────────────────────────────── */

    .footer {
      background: var(--cream);
    }
    .footer-inner {
      max-width: 1200px;
      margin: 0 auto;
      display: flex;
      flex-direction: column;
      gap: 40px;
      padding: 40px 0px;
    }

    /* Top columns */
    .footer-cols {
      display: grid;
      grid-template-columns: 1fr 1fr 2fr;
      gap: 40px;
    }
    .footer-col h3 {
      font-weight: 700;
      font-size: 16px;
      margin-bottom: 24px;
    }
    .footer-col ul {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 24px;
    }
    .footer-col ul li a,
    .footer-col ul li {
      font-size: 16px;
      color: var(--black);
      cursor: pointer;
    }
    .footer-col ul li a:hover { text-decoration: underline; }

    /* Email column */
    .footer-email-label {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 16px;
      color: var(--black);
      letter-spacing: -0.3px;
      margin-bottom: 12px;
    }
    .footer-email-row {
      display: flex;
      gap: 10px;
    }
    .footer-email-input {
      flex: 1;
      min-width: 0;
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 8px;
      box-shadow: 0 6px 0 var(--black);
      padding: 12px 16px;
      font-family: 'Rubik', sans-serif;
      font-size: 16px;
      color: var(--gray);
      outline: none;
    }
    .footer-email-btn {
      background: var(--yellow);
      border: 2px solid var(--black);
      border-radius: 8px;
      box-shadow: 0 6px 0 var(--black);
      padding: 12px 18px;
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 16px;
      color: var(--black);
      cursor: pointer;
      white-space: nowrap;
      transition: transform 0.1s ease, box-shadow 0.1s ease;
    }
    .footer-email-btn:hover {
      transform: translateY(3px);
      box-shadow: 0 3px 0 var(--black);
    }

    .footer-social {
      display: flex;
      gap: 16px;
      align-items: center;
      margin-top: 20px;
    }
    .footer-social img {
      width: 24px;
      height: 24px;
      object-fit: contain;
    }

    /* Address grid */
    .footer-logo-row {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 4px;
    }
    .footer-logo-icon {
      width: 60px;
      height: auto;
    }

    .footer-addresses {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
      align-items: start;
    }
    .footer-address h4 {
      font-weight: 600;
      font-size: 16px;
      margin-bottom: 4px;
    }
    .footer-address p,
    .footer-address a {
      font-size: 16px;
      line-height: 1.5;
      color: var(--black);
    }
    .footer-address a {
      text-decoration: underline;
      display: block;
    }

    /* Divider + credits */
    .footer-divider {
      border: none;
      border-top: 1px solid var(--black);
    }
    .footer-credits {
      display: flex;
      justify-content: center;
      align-items: center;
      flex-wrap: wrap;
      gap: 16px;
    }
    .footer-credits p {
      font-size: 14px;
      color: var(--black);
    }
    .footer-legal {
      display: flex;
      gap: 32px;
      flex-wrap: wrap;
    }
    .footer-legal a {
      font-size: 14px;
      color: var(--black);
      text-decoration: underline;
    }



  /* /////////OUR STORY///////////////////////////////// */

  .content-inner{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 56px;
  }

  .sub-title{
    font-family: 'Dela Gothic One', sans-serif;
  }

  .text .text-title{
    margin-bottom: 1rem;
  }

  .content-inner-inverse h2{
      font-size: 2rem;
      margin-bottom: 2rem;
    }

  .content-inner-inverse{
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: center;
    gap: 56px;
  }

  .content{
    background-color: var(--red);
    color: var(--cream);
  }

   .text-group h2{
    margin-bottom: 2rem;
   }

  .img-content{
     flex: 1;
    }

  .text-group{
    flex: 1;
  }

  .padding{
    padding: 40px 0px 0px 0px;
  }

  /* /////////OWNERS LIST///////////////////////////////// */

  .owners{
    background-color: var(--black);
    padding: 40px 0px;
  }

  .owners h2 {
    text-align: center;
    font-size: 2rem;
    color: var(--cream);
    padding-bottom: 2rem;
  }

  .owners-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
  }

  @media (max-width: 640px) {
    .owners-list {
      grid-template-columns: repeat(2, 1fr);
      gap: 16px;
    }
  }

  .owner-card{
    background-color: var(--cream);
    border: 2px solid var(--black);
    border-radius: 12px;
    box-shadow: 0 6px 0 var(--black);
    padding: 1rem;
  }

  .owner-img{
      border: 2px solid black;
      border-radius: 8px;
      margin-bottom: 0.5rem;
    }

    .owner-card h3{
          font-family: 'Dela Gothic One', sans-serif;
          font-size: 1.25rem;
          margin-bottom: 0.5rem;
        }

         .owner-card p{
          font-size: 1rem;
          color: var(--black);
          margin-bottom: 1rem;
        }


    .links span{
      display: flex;
      gap: 12px;
    }




    /* ── AMAZING RESULTS ────────────────────────────────────── */
    .results-section {
      background: var(--cream);
      padding: 72px 0px;
    }

    .results-inner {
      display: flex;
      gap: 48px;
      align-items: flex-start;
    }

    .results-title {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 33.18px;
      font-weight: 400;
      color: var(--black);
      line-height: normal;
      width: 356px;
      flex-shrink: 0;
    }

    .results-grid {
      flex: 1;
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 1fr 1fr;
      gap: 24px;
      height: 314px;
    }

    .results-card {
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 12px;
      box-shadow: 0 6px 0 var(--black);
      padding: 16px 24px;
      display: flex;
      flex-direction: column;
      gap: 4px;
      justify-content: center;
    }

    .results-stat {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 36px;
      font-weight: 400;
      color: var(--black);
      text-transform: uppercase;
      line-height: normal;
    }

    .results-desc {
      font-family: 'Rubik', sans-serif;
      font-size: 16px;
      font-weight: 500;
      color: var(--black);
      line-height: 1.5;
    }

    /* ── LICENSING ──────────────────────────────────────────── */
    .licensing-section {
      background: var(--cream);
      padding: 40px 0 36px;
    }
    
    .licensing-section h1 {
        font-family: 'Dela Gothic One', sans-serif;
        font-size: 39.81px;
        font-weight: 400;
        color: var(--black);
        line-height: normal;
        margin-bottom: 40px;
      }

    .licensing-inner {
      position: relative;
      display: flex;
      justify-content: flex-end;
      align-items: center;
    }

    .licensing-mascot {
      position: absolute;
      left: -6rem;
      bottom: 0;
      width: 379px;
      height: 348px;
      pointer-events: none;
    }

    .licensing-mascot img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: contain;
    }

    .licensing-box {
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 12px;
      box-shadow: 0 4px 0 var(--black);
      padding: 32px;
      width: 788px;
      display: flex;
      flex-direction: column;
      gap: 24px;
    }

    .licensing-title {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 32px;
      font-weight: 400;
      color: var(--black);
      line-height: 1.2;
    }

    .licensing-body {
      font-family: 'Rubik', sans-serif;
      font-size: 16px;
      font-weight: 400;
      color: var(--black);
      line-height: 1.4;
    }

    /* ── WE KNOW LICENSING GAMES ────────────────────────────── */
    .lgg-section {
      padding: 64px 0 80px;
      background: var(--cream);
    }

    .lgg-inner {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 16px;
      margin-bottom: 48px;
    }

    .lgg-title {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 33px;
      color: var(--black);
      text-align: center;
      line-height: 1.2;
    }

    .lgg-subtitle {
      font-family: 'Rubik', sans-serif;
      font-size: 16px;
      color: var(--black);
      text-align: center;
      max-width: 664px;
      line-height: 1.5;
    }

    .lgg-track {
      display: flex;
      gap: 24px;
      overflow-x: hidden;
      scrollbar-width: none;
      padding-bottom: 1rem;
    }

    .lgg-track::-webkit-scrollbar { display: none; }

    .lgg-card {
      flex: 1 0 0;
      min-height: 409px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 16px;
      border: 2px solid var(--black);
      border-radius: 12px;
      box-shadow: 0 6px 0 var(--black);
      padding: 20px 20px 28px;
    }

    .lgg-card--red    { background: #bf3232; }
    .lgg-card--purple { background: #744ea6; }
    .lgg-card--green  { background: #02910c; }

    .lgg-card-img {
      width: 216px;
      height: 216px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .lgg-card-img img {
      max-width: 100%;
      max-height: 100%;
      object-fit: contain;
      filter: drop-shadow(0 4px 20px rgba(0,0,0,0.3));
    }

    .lgg-card-text {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .lgg-card-name {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 22px;
      color: var(--cream);
      line-height: 1.2;
    }

    .lgg-card-desc {
      font-family: 'Rubik', sans-serif;
      font-size: 15px;
      color: var(--cream);
      line-height: 1.4;
    }

    .lgg-controls {
      display: none;
    }

    /* ── WHAT WE CAN DO ─────────────────────────────────────── */
    .wedo-section {
      background: var(--cream);
    }

    .wedo-title {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 33.18px;
      font-weight: 400;
      color: var(--black);
      line-height: normal;
      margin-bottom: 24px;
    }

    .wedo-track {
      display: flex;
      gap: 24px;
      overflow-x: auto;
      scroll-behavior: smooth;
      scrollbar-width: none;
      -ms-overflow-style: none;
      padding: 0px 0px 1rem 0px;
    }
    .wedo-track::-webkit-scrollbar { display: none; }

    .wedo-card {
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 12px;
      box-shadow: 0 6px 0 var(--black);
      padding: 20px;
      min-width: 337px;
      max-width: 337px;
      flex-shrink: 0;
      scroll-snap-align: start;
      display: flex;
      flex-direction: column;
      gap: 16px;

    }

    .wedo-icon {
      width: 37px;
      height: 37px;
      object-fit: contain;
      display: block;
    }

    .wedo-card-title {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 16px;
      font-weight: 400;
      color: var(--black);
      text-transform: uppercase;
      line-height: normal;
      width: 100%;
    }

    .wedo-card-body {
      font-family: 'Rubik', sans-serif;
      font-size: 16px;
      font-weight: 500;
      color: var(--black);
      line-height: 1.5;
      width: 100%;
    }

    /* ── OFFICES CAROUSEL ───────────────────────────────────── */
    /* ── PARTNERS SCROLL ─────────────────────────────────── */
    .partners-section {
      background: var(--cream);
      padding: 40px 0;
      overflow: hidden;
    }

    .partners-section h2 {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 39px;
      font-weight: 400;
      color: var(--black);
      line-height: normal;
      text-align: center;
      margin-bottom: 40px;
    }

    .partners-track {
      display: flex;
      gap: 64px;
      overflow-x: auto;
      scroll-behavior: auto;
      scrollbar-width: none;
      -ms-overflow-style: none;
      align-items: center;
      padding: 8px 0;
    }

    .partners-track::-webkit-scrollbar { display: none; }

    .partner-card {
      flex-shrink: 0;
      height: 80px;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0.8;
      transition: opacity 0.2s;
    }

    .partner-card:hover { opacity: 1; }

    .partner-card img {
      height: 100%;
      width: auto;
      max-width: 180px;
      object-fit: contain;
      display: block;
    }

    .offices-section {
      background: var(--cream);
    }

    .offices-track {
      display: flex;
      gap: 24px;
      padding: 0 190px 6px;
      overflow-x: auto;
      scroll-behavior: auto;
      scrollbar-width: none;
      -ms-overflow-style: none;
    }
    .offices-track::-webkit-scrollbar { display: none; }

    .office-card {
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 12px;
      box-shadow: 0 6px 0 var(--black);
      padding: 20px;
      min-width: 337px;
      max-width: 337px;
      height: 251px;
      flex-shrink: 0;
      scroll-snap-align: start;
      display: flex;
      flex-direction: column;
      gap: 24px;
      justify-content: center;
    }

    .office-card-flag {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 6px;
    }

    .office-flag-img {
      width: 24px;
      height: 24px;
      object-fit: contain;
      display: inline-block;
      border: 1px solid var(--black);
      border-radius: 100%;
    }

    .office-card-name {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 20px;
      font-weight: 400;
      color: var(--black);
      text-transform: uppercase;
      white-space: nowrap;
      line-height: normal;
    }

    .office-card-address {
      font-family: 'Rubik', sans-serif;
      font-size: 14px;
      font-weight: 500;
      color: var(--black);
      text-align: center;
      line-height: 1.5;
      flex: 1;
    }


    .office-card-email {
      font-family: 'Rubik', sans-serif;
      font-size: 16px;
      font-weight: 700;
      color: var(--black);
      text-align: center;
      text-decoration: underline;
      display: block;
    }

    /* ── CONTACT PAGE ───────────────────────────────────────── */
    .contact-section {
      background: var(--cream);
      padding: 72px 0 60px;
    }

    .contact-inner {
      display: flex;
      gap: 40px;
      align-items: flex-start;
    }

    .contact-left {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
    }

    .contact-title {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 39.81px;
      font-weight: 400;
      color: var(--black);
      line-height: normal;
    }

    .contact-mascot {
      width: 100%;
      max-width: 517px;
      height: auto;
      display: block;
      margin-top: 24px;
    }

    .contact-form {
      display: flex;
      flex-direction: column;
      gap: 40px;
      width: 480px;
      flex-shrink: 0;
    }

    .contact-field {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .contact-label {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 16px;
      font-weight: 400;
      color: var(--black);
      letter-spacing: -0.32px;
      line-height: 1.2;
    }

    .contact-input {
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 8px;
      box-shadow: 0 6px 0 var(--black);
      padding: 12px 16px;
      font-family: 'Rubik', sans-serif;
      font-size: 16px;
      font-weight: 400;
      color: var(--gray);
      width: 100%;
      outline: none;
    }

    .contact-input:focus { color: var(--black); }

    .contact-textarea {
      height: 174px;
      resize: none;
    }

    .contact-success {
      display: none;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 16px;
      flex: 1;
      text-align: center;
      padding: 48px 32px;
      background-color: var(--cream);
      border: 2px solid var(--black);
      border-radius: 16px;
      box-shadow: 0 6px 0 var(--black);
    }

    .contact-success-icon {
      width: 72px;
      height: 72px;
      border-radius: 50%;
      background: var(--yellow);
      border: 2px solid var(--black);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 32px;
      font-weight: 700;
    }

    .contact-success-title {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 28px;
    }

    .contact-success-text {
      font-size: 16px;
      max-width: 300px;
    }

    .b2b-left p{
      color: var(--cream);
    }


    /* ── COMPANY PAGE ───────────────────────────────────────── */

    .company-content{
      display: flex;
      padding: 40px 0px 0px 0px;
    }

      .company-content h1{
          flex: 1;
        }

              .company-content p{
                flex: 1;
              }


      













    /* ── CAREERS JOBS ────────────────────────────────────── */
    .careers-jobs {
      padding: 36px 0 64px;
      background: var(--cream);
    }

    .careers-jobs-inner {
      display: flex;
      flex-direction: column;
      gap: 48px;
    }

    .careers-jobs-heading {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 28px;
      color: var(--black);
      line-height: 1.1;
      font-weight: 400;
    }

    .careers-jobs-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 24px;
    }

    .job-card {
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 12px;
      box-shadow: 0 6px 0 var(--black);
      padding: 20px;
      display: flex;
      flex-direction: column;
      gap: 20px;
      justify-content: space-between;
    }

    .job-card-content {
      display: flex;
      flex-direction: column;
      gap: 16px;
    }

    .job-card-title {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 20px;
      color: var(--black);
      font-weight: 400;
      line-height: 1.2;
    }

    .job-card-desc {
      font-family: 'Rubik', sans-serif;
      font-weight: 500;
      font-size: 16px;
      color: var(--black);
      line-height: 1.5;
    }

    .job-card-meta {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      gap: 4px 16px;
      align-items: center;
    }

    .job-meta-item {
      display: flex;
      align-items: center;
      gap: 8px;
      font-family: 'Rubik', sans-serif;
      font-weight: 500;
      font-size: 16px;
      color: var(--black);
      line-height: 1.5;
      white-space: nowrap;
    }

    .job-meta-icon {
      width: 16px;
      height: 16px;
      flex-shrink: 0;
    }

    .job-apply-btn {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 16px;
      color: var(--black);
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 8px;
      box-shadow: 0 6px 0 var(--black);
      height: 56px;
      width: 100%;
      cursor: pointer;
      line-height: 1.5;
      transition: box-shadow 0.1s, transform 0.1s;
    }

    .job-apply-btn:hover {
      transition: 0.2s ease-in-out;
      background-color: var(--yellow);
    }

    .job-apply-btn:active {
      box-shadow: 0 2px 0 var(--black);
      transform: translateY(4px);
    }

    /* ── CAREERS HERO ────────────────────────────────────── */
    .careers-hero {
      padding: 60px 0 48px;
      background: var(--cream);
    }

    .careers-hero-inner {
      display: flex;
      gap: 40px;
      align-items: flex-start;
    }

    .careers-hero-left {
      flex: 1 0 0;
      display: flex;
      flex-direction: column;
      gap: 32px;
      align-items: center;
      justify-content: flex-end;
    }

    .careers-hero-heading {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 40px;
      color: #241C16;
      line-height: 1.2;
      font-weight: 400;
      width: 100%;
    }

    .careers-hero-mascot {
      position: relative;
      width: 166px;
      height: 200px;
      flex-shrink: 0;
    }

    .careers-hero-mascot img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: contain;
    }

    .careers-hero-right {
      flex: 1 0 0;
      display: flex;
      align-items: flex-start;
      padding-top: 8px;
    }

    .careers-hero-body {
      font-family: 'Rubik', sans-serif;
      font-size: 16px;
      color: var(--black);
      line-height: 1.25;
    }

    .careers-hero-body strong {
      font-weight: 700;
    }

    /* ── BOARD INTRO ─────────────────────────────────────── */
    .board-intro {
      position: relative;
      overflow: hidden;
      background: var(--cream);
      /* Section height matches desktop bg image ratio: 496/1626 ≈ 30.5% of its rendered width.
         Image is 112.9% of viewport → section = ~34.4vw tall */
      height: clamp(360px, 30.5vw, 500px);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    /* bg image elements */
    .board-intro-bg {
      position: absolute;
      pointer-events: none;
      top: 50%;
      transform: translateY(-50%);
    }

    /* Desktop: Figma places it width=1626px on 1440px canvas, left=-76px */
    .board-intro-bg--desktop {
      width: 112.9%;
      display: block;
    }

    .board-intro-bg--mobile {
      display: none;
    }

    .board-intro-inner {
      position: relative;
      z-index: 2;
      width: 100%;
      display: flex;
      justify-content: center;
      padding: 0 24px;
    }

    .board-intro-box {
      background: var(--cream);
      border: 2px solid var(--black);
      border-radius: 12px;
      box-shadow: 0 6px 0 var(--black);
      padding: 32px;
      width: 630px;
      flex-shrink: 0;
      display: flex;
      flex-direction: column;
      gap: 32px;
    }

    .board-intro-heading {
      position: relative;
      padding-left: 83px;
    }

    .board-intro-mascot {
      position: absolute;
      left: 0;
      top: -3px;
      width: 97px;
      height: 118px;
    }

    .board-intro-mascot img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: contain;
    }

    .board-intro-title {
      font-family: 'Dela Gothic One', sans-serif;
      font-size: 56px;
      font-weight: 400;
      font-style: normal;
      line-height: 1;
      color: var(--black);
    }

    .board-intro-body {
      font-family: 'Rubik', sans-serif;
      font-size: 16px;
      line-height: 1.25;
      color: var(--black);
    }

    .board-intro-body strong {
      font-weight: 700;
    }

    /* ── RESPONSIVE ───────────────────────────────────────── */
    @media (max-width: 1200px) {
      .carousel-track { padding: 0 40px 16px; }
      /* .b2b-section    { padding: 60px 60px; } */
      /* .footer         { padding: 0 40px 60px; } */
    }

    @media (max-width: 900px) {


    .center{
      margin: 0 auto;
      width: 90%;
    }

      .navbar-nav {
        display: none;
        flex-direction: column;
        position: absolute;
        top: calc(100% + 12px);
        background: var(--cream);
        border: 2px solid var(--black);
        border-radius: 0.5rem;
        box-shadow: 0 6px 0 var(--black);
        z-index: 200;
        gap: 0;
        left: 0rem;
        width: 100%;
      }
      .navbar-nav.nav-open { display: flex; }
      .navbar-nav > a {
        padding: 14px 24px;
        font-size: 17px;
        border-bottom: 1px solid black;
        width: 100%;
      }
      .navbar-nav > a:last-child { border-bottom: none; }
      .navbar-actions { display: flex; }
      .hamburger { display: flex; }

      .hero-inner { 
        padding-bottom: 2rem;
        gap: 32px; 
      }

      .hero-mascot { width: clamp(180px, 40vw, 300px); }

      /* Countries dropdown inside mobile menu — expands inline */
      .nav-dropdown { width: 100%; }
      .nav-dropdown-trigger {
        width: 100%;
        justify-content: space-between;
        padding: 14px 24px;
        font-size: 17px;
        border-bottom: 1px solid black;
      }
      .nav-dropdown-menu {
        position: static;
        border: none;
        border-radius: 0;
        box-shadow: none;
        padding: 0;
        background: rgba(0,0,0,0.03);
        max-height: 40vh;
        overflow-y: auto;
        border-bottom: 1px solid black;
      }
      .nav-dropdown-menu a { padding: 11px 32px; }
      .dd-url  { font-size: 15px; }
      .dd-country { font-size: 13px; }


      .b2b-section {
        flex-direction: column;
        padding: 24px 0px;
        /* padding: 40px 24px; */
      }
      .b2b-left { width: 100%; flex-direction: row; align-items: center; }
      .b2b-mascot { width: 200px; height: 200px; }

      .footer-cols { grid-template-columns: 1fr 1fr; }
      .footer-addresses { grid-template-columns: 1fr 1fr; }
      .footer { padding: 0 24px 60px; }

              .b2b-inner{
          flex-direction: column;
      justify-content: center;
    }
    }

    @media (max-width: 640px) {

          .navbar-logo img {
      height: 48px;
      width: auto;
    }



      .hero-inner { flex-direction: column; align-items: flex-start;  gap: 24px; }
      .hero-mascot { width: 220px; align-self: center; }

      /* ///////CAREERS HERO mobile///// */
      .careers-hero {
        padding: 40px 0 8px;
      }

      .careers-hero-inner {
        flex-direction: column;
        gap: 16px;
      }

      .careers-hero-left {
        align-items: flex-start;
        gap: 0;
        width: 100%;
      }

      .careers-hero-heading {
        font-size: 36px;
        letter-spacing: -0.72px;
      }

      .careers-hero-mascot {
        display: none;
      }

      .careers-hero-right {
        width: 100%;
        padding-top: 0;
      }

      /* ///////CAREERS JOBS mobile///// */
      .careers-jobs {
        padding: 40px 0 48px;
      }

      .careers-jobs {
        padding: 40px 16px 48px;
      }

      .careers-jobs-inner {
        gap: 24px;
        width: 100%;
        max-width: 100%;
      }

      .careers-jobs-heading {
        font-size: 24px;
        line-height: 1.2;
      }

      .careers-jobs-grid {
        grid-template-columns: 1fr;
        width: 100%;
      }

      .job-card {
        min-width: 0;
      }

      .job-card-content {
        gap: 12px;
        min-width: 0;
      }

      .job-meta-item {
        white-space: normal;
      }

      .navbar { padding:0.25rem 0.8rem 0.25rem 0.25rem;}

      .navbar-actions {
            display: block;
          }

      /* All cards hidden except corners */
      .carousel-track { padding: 0 16px 16px; }
      .client-card    { min-width: 260px; max-width: 260px; }

      .b2b-left { flex-direction: column; }
      .b2b-mascot { width: 160px; height: 160px; display: none; }

      .footer-cols       { grid-template-columns: 1fr; }
      .footer-addresses  { grid-template-columns: 1fr; }
      .footer-credits    { flex-direction: column; align-items: flex-start; }
      .footer-legal      { gap: 16px; }
      .footer            { padding: 0 16px 40px; }
      .footer-inner{
        gap: 24px;
      }
      .footer-inner.center { width: 100%; padding: 40px 0px; }

        .b2b-inner{
          flex-direction: column;
      justify-content: center;
      padding: 0;
    }

    /* ///////OFFICES CAROUSEL mobile///////////////////// */

    .offices-track {
      padding: 0 16px 6px;
      gap: 16px;
    }

    .office-card {
      min-width: 266px;
      max-width: 266px;
      padding: 16px;
      gap: 12px;
    }

    .office-flag-img { display: block; }

    /* ///////LICENSING mobile////////////////////////// */

    .licensing-section {
      padding: 40px 0 0 8px;
    }

    .licensing-inner {
      flex-direction: column;
      justify-content: flex-start;
      align-items: stretch;
      padding-top: 140px;
      position: relative;
    }

    .licensing-mascot {
      position: absolute;
      left: 0;
      top: 12px;
      width: 228px;
      height: 210px;
      bottom: auto;
      z-index: 0;
    }

    .licensing-box {
      width: 100%;
      padding: 20px;
      gap: 16px;
      position: relative;
      z-index: 1;
    }

    .licensing-title {
      font-size: 28px;
    }

    /* ///////RESULTS + WEDO mobile///////////////////// */

    .results-section {
      padding: 24px 0 32px;
    }

    .results-inner {
      flex-direction: column;
      gap: 24px;
    }

    .results-title {
      width: 100%;
      font-size: 32px;
      text-align: left;
    }

    .results-grid {
      width: 100%;
      height: 300px;
      grid-template-rows: 1fr 1fr;
    }

    .results-card {
      padding: 16px;
    }

    .results-stat { font-size: 26px; }

    .results-desc { font-size: 13px; }

    .wedo-section{
      margin: 40px 0px 0px 0px;
    }

    .wedo-title {
      font-size: 32px;
      line-height: 2rem;
    }

    .wedo-track {
      padding: 0 16px 12px 0px;
      gap: 16px;
    }

    .wedo-card {
      min-width: 280px;
      max-width: 280px;
      padding: 16px;
    }

    /* ///////CONTACT mobile///////////////////////////// */

    .contact-section {
      padding: 24px 0 8px;
    }

    .contact-inner {
      flex-direction: column;
    }

    .contact-left {
      width: 100%;
    }

    .contact-mascot {
      display: none;
    }

    .contact-form {
      width: 100%;
      gap: 24px;
    }

    .contact-title {
      font-size: 36px;
    }

    /* ///////BOARD INTRO mobile///////////////////////////// */

    .company-content{
      flex-direction: column;
      gap: 1rem;
      padding: 0rem;
      margin-bottom: 1rem;
    }

    .board-intro {
      /* Mobile: stack bg image on top, box below */
      height: auto;
      flex-direction: column;
      align-items: stretch;
      justify-content: flex-start;
      padding-top: 0;
      padding-bottom: 18rem;
    }

    /* Mobile bg: full width, natural height (400×224 ratio = 56%) */
    .board-intro-bg--desktop { display: none; }
    .board-intro-bg--mobile {
      display: block;
      position: relative;
      top: auto;
      left: auto;
      transform: none;
      width: 100%;
      height: auto;
    }

    .board-intro-inner {
      padding: 16px 16px 8px;
      position: absolute;
      top: 4rem;
    }

    .board-intro-box {
      width: 100%;
      padding: 20px;
    }

    .board-intro-title {
      font-size: 24px;
      margin-left: 1rem;
    }

    .board-intro-heading {
      padding-left: 48px;
    }

    .board-intro-mascot {
      width: 52px;
      height: 64px;
      top: -0.5px;
    }

    /* ///////OUR STORY///////////////////////////////////// */

    .content-inner{
      flex-direction: column;
      padding: 40px 0px 0px 0px;
    }

    .content-inner-inverse{
      flex-direction: column;
      padding: 40px 0px 0px 0px;
    }

    /* ///////OWNER///////////////////////////////////// */

    .owner-card{
      padding: 0.8rem;
    }

    .b2b-inner .btn-hero {
        width: 100%;
      }

    /* ///////LGG mobile///////////////////////////// */

    .lgg-section {
      padding: 40px 0 0px 0px;
    }

    .lgg-inner {
      align-items: flex-start;
      margin-bottom: 24px;
    }

    .lgg-title {
      font-size: 28px;
      text-align: left;
    }

    .lgg-subtitle {
      text-align: left;
    }

    .lgg-track {
      overflow-x: auto;
      scroll-behavior: auto;
      gap: 16px;
      padding: 0 16px 12px 0;
    }

    .lgg-card {
      flex: 0 0 300px;
      min-width: 300px;
      max-width: 300px;
      min-height: 380px;
      justify-content: center;
    }

    .lgg-card-img {
      width: 180px;
      height: 180px;
    }


    .lgg-controls {
      display: flex;
    }

     .offices-section {
      margin-top: 40px;
    }

     .office-card-name {
      font-family: 'Dela Gothic One', sans-serif;
      text-align: center;
      font-size: 16px;
      font-weight: 400;
      color: var(--black);
      text-transform: uppercase;
      white-space: wrap;
      line-height: normal;
    }

    }