/*
Theme Name: Source Foshan
Theme URI: https://sourcefoshan.com/
Author: Source Foshan
Description: Lightweight, custom theme for Source Foshan.
Version: 1.0.2
Requires at least: 6.6
Requires PHP: 8.1
Text Domain: source-foshan
*/

:root {
  --sf-red: #c8102e;
  --sf-ink: #1f2328;
  --sf-muted: #5f6368;
  --sf-line: #e4e4e4;
  --sf-white: #fff;
  --sf-focus: #0b57d0;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; }
img { display: block; max-width: 100%; }
a, button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--sf-focus) !important;
  outline-offset: 3px;
}
.sf-skip-link {
  position: fixed;
  left: 16px;
  top: -80px;
  z-index: 1000;
  padding: 12px 18px;
  color: #fff;
  background: var(--sf-ink);
}
.sf-skip-link:focus { top: 16px; }
.sf-page { min-width: 0; }
.sf-page [data-screen-label] { min-width: 0 !important; }
.sf-page a { transition: color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s ease; }
.sf-page img { width: 100%; height: 100%; object-fit: cover; }
.sf-page input, .sf-page select, .sf-page textarea { min-height: 44px; }
.sf-page .sf-header { backdrop-filter: saturate(160%) blur(12px); }
.sf-mobile-toggle { display: none; }
.sf-form-status { margin-top: 12px; padding: 12px 14px; border-radius: 6px; font-size: 14px; line-height: 1.45; }
.sf-form-status[aria-live="polite"] { background: #edf7f1; color: #155c34; }
.sf-form-status.sf-error { background: #fff0f1; color: #9f1028; }
.sf-submit[aria-busy="true"] { opacity: .65; pointer-events: none; }

@media (max-width: 1100px) {
  .sf-page [style*="max-width: 1280px"] { padding-left: 28px !important; padding-right: 28px !important; }
  .sf-page h1 { font-size: clamp(42px, 5vw, 58px) !important; }
  .sf-page h2 { font-size: clamp(34px, 4.2vw, 50px) !important; }
  .sf-header__nav { gap: 16px !important; font-size: 14px !important; }
}

@media (max-width: 820px) {
  html { scroll-padding-top: 76px; }
  .sf-page [style*="max-width: 1280px"] { padding-left: 20px !important; padding-right: 20px !important; }
  .sf-page [style*="padding: 130px"],
  .sf-page [style*="padding: 120px"],
  .sf-page [style*="padding: 110px"],
  .sf-page [style*="padding: 100px"] { padding-top: 76px !important; padding-bottom: 76px !important; }
  .sf-page [style*="display: grid"] { grid-template-columns: minmax(0, 1fr) !important; gap: 32px !important; }
  .sf-page [style*="display: grid"] > * { min-width: 0 !important; }
  .sf-page p { max-width: 100% !important; overflow-wrap: anywhere; }
  .sf-page [style*="letter-spacing: 0.18em"][style*="text-transform: uppercase"] {
    max-width: 100% !important;
    font-size: 10.5px !important;
    letter-spacing: .11em !important;
    line-height: 1.5 !important;
  }
  .sf-page [style*="font-size: 58px"],
  .sf-page [style*="font-size: 64px"],
  .sf-page [style*="font-size: 68px"],
  .sf-page [style*="font-size: 72px"] { font-size: clamp(38px, 11vw, 52px) !important; }
  .sf-page [style*="font-size: 44px"],
  .sf-page [style*="font-size: 46px"],
  .sf-page [style*="font-size: 48px"],
  .sf-page [style*="font-size: 52px"] { font-size: clamp(31px, 9vw, 42px) !important; }
  .sf-page [style*="height: 560px"],
  .sf-page [style*="height: 520px"],
  .sf-page [style*="height: 500px"] { height: min(116vw, 520px) !important; }
  .sf-page [style*="height: 430px"],
  .sf-page [style*="height: 420px"],
  .sf-page [style*="height: 400px"],
  .sf-page [style*="height: 380px"] { height: min(90vw, 420px) !important; }
  .sf-page [style*="width: 520px"] { width: 100% !important; }
  .sf-page [style*="left: -28px"] { left: 12px !important; right: 12px !important; }
  .sf-page [style*="position: fixed"][style*="bottom: 28px"] { left: 16px !important; right: 16px !important; bottom: 12px !important; text-align: center; }
  .sf-page [style*="overflow-x: auto"] { scroll-snap-type: x mandatory; }
  .sf-page [style*="overflow-x: auto"] > * { scroll-snap-align: start; }

  .sf-header { height: 72px !important; }
  .sf-header > div { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; height: 69px !important; padding: 0 20px !important; }
  .sf-header > div > a:first-child { min-width: 0; gap: 10px !important; }
  .sf-header > div > a:first-child svg { width: 40px; height: 40px; flex: 0 0 40px; }
  .sf-header > div > a:first-child > span { min-width: 0; }
  .sf-header > div > a:first-child > span > span:first-child { font-size: 17px !important; white-space: nowrap; }
  .sf-header > div > a:first-child > span > span:last-child { font-size: 8px !important; letter-spacing: .2em !important; white-space: nowrap; }
  .sf-header__nav,
  .sf-header__cta { display: none !important; }
  .sf-header.is-open { height: auto !important; }
  .sf-header.is-open > div { height: auto !important; min-height: 69px; flex-wrap: wrap; padding-bottom: 20px !important; }
  .sf-header.is-open .sf-header__nav {
    grid-column: 1 / -1;
    grid-row: 2;
    display: flex !important;
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 2px !important;
    padding-top: 14px;
  }
  .sf-header.is-open .sf-header__nav a { padding: 11px 0 !important; border-bottom: 1px solid var(--sf-line); }
  .sf-header.is-open .sf-header__cta { grid-column: 1 / -1; grid-row: 3; display: block !important; width: 100%; margin-top: 12px; text-align: center; }
  .sf-mobile-toggle {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid var(--sf-line);
    border-radius: 6px;
    color: var(--sf-ink);
    background: #fff;
    font: 700 20px/1 sans-serif;
    cursor: pointer;
  }
  .sf-footer [style*="display: flex"] { flex-wrap: wrap; align-items: flex-start !important; gap: 20px !important; }
  .sf-footer [style*="grid-template-columns"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .sf-page--home [style*="border-top: 1px solid rgb(228, 228, 228)"][style*="padding-top: 22px"] {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0 !important;
    width: 100% !important;
  }
  .sf-page--home [style*="border-top: 1px solid rgb(228, 228, 228)"][style*="padding-top: 22px"] > div {
    min-width: 0 !important;
    padding: 10px 8px !important;
    border-left: 0 !important;
  }
  .sf-page--home [style*="border-top: 1px solid rgb(228, 228, 228)"][style*="padding-top: 22px"] > div:nth-child(even) {
    border-left: 1px solid var(--sf-line) !important;
  }
}

@media (max-width: 520px) {
  .sf-page [style*="display: flex"] { flex-wrap: wrap; }
  .sf-page [style*="padding: 88px"],
  .sf-page [style*="padding: 80px"] { padding-top: 56px !important; padding-bottom: 64px !important; }
  .sf-page [style*="min-width: 240px"],
  .sf-page [style*="min-width: 260px"],
  .sf-page [style*="min-width: 280px"] { min-width: 82vw !important; }
  .sf-footer [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  .sf-footer [style*="align-items: flex-end"] { align-items: flex-start !important; }
}

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