/*
  Outdoor lighting hub — design tokens for l-service-hub.html components.

  Loaded after corporate-services-hub-tokens.css (service-hub-v3, process, cta, etc.).
  Without these, service-detail-v1/v2 and gallery layouts collapse (missing CSS variables).
*/

:root {
  /* service-detail-v1-service-detail — Figma 267:852 / 289:221 */
  --fs-service-detail-v1-title: 3.375rem;
  --fs-service-detail-v1-title-mobile: 1.5rem;
  --lh-service-detail-v1-title: 3.375rem;
  --lh-service-detail-v1-title-mobile: 1.8125rem;
  --fs-service-detail-v1-body: 1.125rem;
  --lh-service-detail-v1-body: 1.875rem;
  --ls-service-detail-v1: -0.02em;
  --fs-service-detail-v1-breadcrumb: 1.125rem;
  --fs-service-detail-v1-breadcrumb-mobile: 0.75rem;
  --lh-service-detail-v1-breadcrumb: 1.875rem;
  --service-detail-v1-pad-y: 7.5rem;
  --service-detail-v1-pad-y-mobile: 3.5rem;
  --service-detail-v1-copy-w: 44rem;
  --service-detail-v1-body-w: 37.875rem;
  --service-detail-v1-media-w: 61.375rem;
  --service-detail-v1-media-h: 61.3125rem;
  --service-detail-v1-col-gap: 0.875rem;
  --service-detail-v1-stack-gap: 2rem;
  --service-detail-v1-stack-gap-desktop: 1.5rem;
  --service-detail-v1-content-gap-mobile: 1.25rem;
  --service-detail-v1-text-gap: 1.5rem;
  --service-detail-v1-lighting-pad-y: 8.75rem;
  --service-detail-v1-lighting-band-h: 55.0625rem;
  --service-detail-v1-lighting-content-h: 34.1875rem;

  /* service-detail-v2-service-detail — Figma 267:868 / 497:15 */
  --fs-service-detail-v2-title: 3.375rem;
  --fs-service-detail-v2-title-mobile: 1.5rem;
  --lh-service-detail-v2-title: 3.375rem;
  --lh-service-detail-v2-title-mobile: 1.8125rem;
  --fs-service-detail-v2-intro: 1.125rem;
  --lh-service-detail-v2-intro: 1.875rem;
  --ls-service-detail-v2: -0.02em;
  --fs-service-detail-v2-card-title: 1.5rem;
  --lh-service-detail-v2-card-title: 2.25rem;
  --fs-service-detail-v2-card-title-mobile: 1.125rem;
  --lh-service-detail-v2-card-title-mobile: 1.875rem;
  --fs-service-detail-v2-card-body: 1rem;
  --lh-service-detail-v2-card-body: 1.25rem;
  --fs-service-detail-v2-note: 0.75rem;
  --color-service-detail-v2-note: #a6a6a6;
  --service-detail-v2-pad-y: 7.5rem;
  --service-detail-v2-pad-y-mobile: 3.5rem;
  --service-detail-v2-stack-gap: 2rem;
  --service-detail-v2-intro-gap: 2rem;
  --service-detail-v2-intro-gap-mobile: 1.5rem;
  --service-detail-v2-card-h: 48.75rem;
  --service-detail-v2-card-copy-w: 23.9375rem;
  --service-detail-v2-card-copy-gap: 0.9375rem;
  --service-detail-v2-card-pad-x: 2.5rem;
  --service-detail-v2-card-pad-y: 3.75rem;
  --service-detail-v2-card-media-h-mobile: 14.25rem;
  --service-detail-v2-card-body-h-mobile: 13.625rem;
  --service-detail-v2-card-pad-mobile: 1.5rem;
  --service-detail-v2-card-copy-gap-mobile: 0.5rem;
  --service-detail-v2-card-copy-w-mobile: 12.875rem;
  --service-detail-v2-note-w: 51.5625rem;
  --service-detail-v2-title-w-mobile: 16.375rem;
  --shadow-service-detail-v2-card: 0 4px 20px 0 rgba(0, 0, 0, 0.05);

  /* service-detail-v3 — aliases (base tokens in corporate-services-hub-tokens.css) */
  --color-service-detail-v3-icon: var(--color-service-hub-v3-icon);
  --fs-service-detail-v3-title: var(--fs-service-hub-v3-title);
  --fs-service-detail-v3-title-mobile: var(--fs-service-hub-v3-title-mobile);
  --lh-service-detail-v3-title: var(--lh-service-hub-v3-title);
  --lh-service-detail-v3-title-mobile: var(--lh-service-hub-v3-title-mobile);
  --fs-service-detail-v3-intro: var(--fs-service-hub-v3-intro);
  --lh-service-detail-v3-intro: var(--lh-service-hub-v3-intro);
  --ls-service-detail-v3: var(--ls-service-hub-v3);
  --fs-service-detail-v3-card-title: var(--fs-service-hub-v3-card-title);
  --lh-service-detail-v3-card-title: var(--lh-service-hub-v3-card-title);
  --fs-service-detail-v3-card-body: var(--fs-service-hub-v3-card-body);
  --lh-service-detail-v3-card-body: var(--lh-service-hub-v3-card-body);
  --service-detail-v3-pad-y: var(--service-hub-v3-pad-y);
  --service-detail-v3-pad-y-mobile: var(--service-hub-v3-pad-y-mobile);
  --service-detail-v3-header-max: var(--service-hub-v3-header-max);
  --service-detail-v3-intro-max: var(--service-hub-v3-intro-max);
  --service-detail-v3-cards-gap: var(--service-hub-v3-cards-gap);
  --service-detail-v3-card-w: var(--service-hub-v3-card-w);
  --service-detail-v3-card-w-mobile: var(--service-hub-v3-card-w-mobile);
  --service-detail-v3-card-h: var(--service-hub-v3-card-h);
  --service-detail-v3-card-h-mobile: var(--service-hub-v3-card-h-mobile);
  --service-detail-v3-card-pad: var(--service-hub-v3-card-pad);
  --service-detail-v3-card-pad-mobile: var(--service-hub-v3-card-pad-mobile);
  --service-detail-v3-card-gap: var(--service-hub-v3-card-gap);
  --service-detail-v3-card-gap-mobile: var(--service-hub-v3-card-gap-mobile);
  --service-detail-v3-card-text-max: var(--service-hub-v3-card-text-max);
  --service-detail-v3-icon: var(--service-hub-v3-icon);
  --service-detail-v3-icon-mobile: var(--service-hub-v3-icon-mobile);
  --service-detail-v3-cta-pad-y: var(--service-hub-v3-cta-pad-y);
  --service-detail-v3-cta-pad-x: var(--service-hub-v3-cta-pad-x);
  --radius-service-detail-v3-card-mobile: 0.625rem;
  --shadow-service-detail-v3-card: var(--shadow-service-hub-v3-card);
  --shadow-service-detail-v3-card-mobile: var(--shadow-service-hub-v3-card-mobile);

  /* service-gallery-service-page-detail — Figma 278:989 / 292:359 */
  --fs-service-gallery-title: 3.375rem;
  --fs-service-gallery-title-mobile: 1.5rem;
  --lh-service-gallery-title: 3.375rem;
  --lh-service-gallery-title-mobile: 1.8125rem;
  --fs-service-gallery-intro: 1.125rem;
  --lh-service-gallery-intro: 1.875rem;
  --ls-service-gallery: -0.02em;
  --service-gallery-pad-y: 7.5rem;
  --service-gallery-pad-y-mobile: 3.5rem;
  --service-gallery-header-max: 93.6875rem;
  --service-gallery-intro-max: 60.8125rem;
  --service-gallery-gap-x: 1.5rem;
  --service-gallery-gap-y: 1.5625rem;
  --service-gallery-gap-mobile: 0.5rem;
  --shadow-service-gallery-item-mobile: 0 4px 50px 0 rgba(0, 0, 0, 0.08);

  /*
    service-gallery-lighting-service-template — Figma 292:806 (desktop only).
    Copied from the HTML kit tokens.css. These were missing, so the lighting
    service gallery had no thumb sizes, gaps, or padding on WordPress.
  */
  --service-gallery-lighting-pad-y: 8.75rem; /* 140px */
  --service-gallery-lighting-stack-gap: 3.75rem; /* 60px — header / photos / thumbs */
  --service-gallery-lighting-header-gap: 2rem; /* 32px — title → intro */
  --service-gallery-lighting-intro-w: 26.1875rem; /* 419px */
  --service-gallery-lighting-thumb-w: 18.3125rem; /* 293px */
  --service-gallery-lighting-thumb-h: 13rem; /* 208px */
  --service-gallery-lighting-thumb-w-mobile: 9.25rem; /* 148px */
  --service-gallery-lighting-thumb-h-mobile: 6.5625rem; /* 105px */
  --service-gallery-lighting-thumb-gap: 2.5rem; /* 40px */
  --service-gallery-lighting-nav-gap: 2.25rem; /* 36px — arrow ↔ thumbs */
  --service-gallery-lighting-nav-size: 3.25rem; /* 52px */
  --service-gallery-lighting-nav-size-mobile: 2rem; /* 32px */
  --service-gallery-lighting-thumbs-max: 112.5625rem; /* 1801px — arrows + 5 thumbs */
}
