/* =====================================================================
   OmniFit Performance - shared site styles (source: site/site.css)
   Design system: Navy #0a1628 / #0f1f3a / #152a4a, Gold #c9a84c / #e0c872,
   Playfair Display headings, Montserrat body; the header logo is an inline SVG.
   Page-scoped CSS stays with each page (moved into its <head> by build.py).
   The footer CSS from pages/footer.html is appended to this file by build.py.
   ===================================================================== */
:root{
  --omni-navy:#0a1628;
  --omni-navy-mid:#0f1f3a;
  --omni-navy-light:#152a4a;
  --omni-gold:#c9a84c;
  --omni-gold-light:#e0c872;
  --omni-maroon:#7b1e2b;
  --omni-white:#ffffff;
  --omni-font-body:'Montserrat',system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --omni-font-heading:'Playfair Display','Times New Roman',serif;
}
html{-webkit-text-size-adjust:100%;}
body{margin:0;background:var(--omni-navy);color:var(--omni-white);font-family:var(--omni-font-body);line-height:1.6;-webkit-font-smoothing:antialiased;}
main{display:block;}
/* Squarespace clipped each page section horizontally. Decorative elements
   authored against that (the 500px hero glow on the territory pages, the
   step row on 4S Ranch at phone widths) poke past a 390px viewport without
   it. overflow-x:clip restores that clipping without creating a scroll
   container, so position:sticky elements inside pages keep working. */
main{overflow-x:clip;}

/* ===== Announcement bar (copy and link live in site/nav.html) ===== */
.site-announce{position:relative;background:var(--omni-maroon);color:#fff;font-family:var(--omni-font-body);font-size:13px;font-weight:600;line-height:1.45;text-align:center;padding:10px 48px;}
.site-announce[hidden]{display:none;}
.site-announce__link,.site-announce__link:link,.site-announce__link:visited{color:#fff;text-decoration:none;}
.site-announce__link:hover,.site-announce__link:focus{color:#fff;text-decoration:underline;text-underline-offset:3px;}
.site-announce__close{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:0;padding:6px;cursor:pointer;line-height:0;}
.site-announce__close svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;display:block;}
.site-announce__close:hover svg{stroke:var(--omni-gold-light);}

/* ===== Site header ===== */
.site-header{position:sticky;top:0;z-index:1000;background:#fff;border-bottom:1px solid rgba(10,22,40,.08);}
.site-header__inner{max-width:1380px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:36px;}
.site-logo,.site-logo:link,.site-logo:visited{display:inline-flex;align-items:center;text-decoration:none;flex-shrink:0;}
/* Logo: the inline SVG in site/nav.html (viewBox 844x242, generated from
   site/img/logo.svg). Sized by height, the width follows the aspect ratio. */
.site-logo .omni-logo{display:block;height:54px;width:auto;aspect-ratio:844/242;overflow:visible;}
.site-logo .omni-logo__spin{transform-box:fill-box;transform-origin:50% 48.74%;transition:transform .9s cubic-bezier(.22,1,.36,1);}
.site-logo .omni-logo__f-hop{transition:transform .5s cubic-bezier(.34,1.56,.64,1);}
@media (prefers-reduced-motion:no-preference){
  /* hover / keyboard focus: the ring turns once, the F hops (transitions, so they ease back) */
  .site-logo:hover .omni-logo__spin,.site-logo:focus-visible .omni-logo__spin{transform:rotate(360deg);}
  .site-logo:hover .omni-logo__f-hop,.site-logo:focus-visible .omni-logo__f-hop{transform:translateY(-22px);}
  /* intro, once per browser session (html.omni-logo-intro is set by the inline
     script in site/nav.html on the session's first page view). Translate values
     are SVG user units: 242 units = the logo's rendered height. */
  html.omni-logo-intro .omni-logo__ring{stroke-dasharray:1 1.1;animation:omni-logo-ring .85s cubic-bezier(.65,0,.35,1) both;}
  html.omni-logo-intro .omni-logo__f{transform-box:fill-box;transform-origin:50% 50%;animation:omni-logo-pop .55s cubic-bezier(.34,1.56,.64,1) .62s both;}
  html.omni-logo-intro .omni-logo__name .omni-logo__ch{animation:omni-logo-rise .6s cubic-bezier(.22,1,.36,1) calc(.4s + var(--i,0)*60ms) both;}
  html.omni-logo-intro .omni-logo__rule{transform-box:fill-box;transform-origin:0 50%;animation:omni-logo-rule .55s cubic-bezier(.22,1,.36,1) .95s both;}
  html.omni-logo-intro .omni-logo__perf .omni-logo__ch{animation:omni-logo-fade .45s ease-out calc(1.05s + var(--i,0)*30ms) both;}
}
@keyframes omni-logo-ring{from{stroke-dashoffset:1;}to{stroke-dashoffset:0;}}
@keyframes omni-logo-pop{from{opacity:0;transform:scale(.4) rotate(-14deg);}to{opacity:1;transform:none;}}
@keyframes omni-logo-rise{from{opacity:0;transform:translateY(44px);}to{opacity:1;transform:none;}}
@keyframes omni-logo-rule{from{transform:scaleX(0);}to{transform:none;}}
@keyframes omni-logo-fade{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}

/* ===== Primary nav: two rows + dropdowns ===== */
.site-nav{display:flex;align-items:center;flex:1 1 auto;gap:24px;min-width:0;}
.site-nav__rows{display:flex;flex-direction:column;gap:2px;}
.site-nav__row{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:2px;}
.site-nav__row>li{position:relative;}
.site-nav a,.site-nav a:link,.site-nav a:visited,.site-nav .site-nav__trigger{font-family:var(--omni-font-body);font-size:13px;font-weight:600;letter-spacing:.3px;color:var(--omni-navy);text-decoration:none;background:none;border:0;padding:6px 10px;cursor:pointer;display:inline-flex;align-items:center;gap:5px;line-height:1.2;white-space:nowrap;transition:color .2s ease;}
.site-nav a:hover,.site-nav a:focus,.site-nav .site-nav__trigger:hover,.site-nav .site-nav__trigger:focus{color:var(--omni-gold);}
.site-nav .site-nav__trigger svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s ease;}
.site-nav .has-menu.is-open>.site-nav__trigger svg{transform:rotate(180deg);}
/* active page */
.site-nav a[aria-current="page"],.site-nav .has-menu.is-active>.site-nav__trigger{text-decoration:underline;text-decoration-color:var(--omni-gold);text-decoration-thickness:2px;text-underline-offset:6px;}
/* dropdown panels */
.site-nav__menu{list-style:none;margin:0;padding:8px 0;display:none;position:absolute;top:100%;left:0;min-width:260px;background:#fff;border:1px solid rgba(10,22,40,.1);border-radius:10px;box-shadow:0 12px 32px rgba(10,22,40,.14);z-index:1001;}
.site-nav__menu li a,.site-nav__menu li a:link,.site-nav__menu li a:visited{display:block;padding:9px 18px;font-weight:500;}
.site-nav .has-menu.is-open>.site-nav__menu{display:block;}
@media (hover:hover) and (min-width:1100px){
  .site-nav .has-menu:hover>.site-nav__menu{display:block;}
}
/* right side: social icons + text CTA */
.site-nav__aside{margin-left:auto;display:flex;align-items:center;gap:12px;flex-shrink:0;}
.site-nav .site-nav__social,.site-nav a.site-nav__social{padding:6px;}
.site-nav .site-nav__social svg{width:22px;height:22px;fill:none;stroke:var(--omni-gold);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;display:block;transition:stroke .2s ease;}
.site-nav .site-nav__social:hover svg,.site-nav .site-nav__social:focus svg{stroke:var(--omni-gold-light);}
.site-nav a.site-nav__cta,.site-nav a.site-nav__cta:link,.site-nav a.site-nav__cta:visited{color:var(--omni-gold);font-weight:700;font-size:12px;letter-spacing:1.2px;text-transform:uppercase;padding:6px 0;margin-left:6px;border-bottom:2px solid transparent;transition:color .2s ease,border-color .2s ease;}
.site-nav a.site-nav__cta:hover,.site-nav a.site-nav__cta:focus{color:var(--omni-navy);border-bottom-color:var(--omni-gold);}
/* hamburger */
.site-nav-toggle{display:none;flex-shrink:0;margin-left:auto;background:none;border:1px solid rgba(10,22,40,.15);border-radius:8px;padding:8px;cursor:pointer;line-height:0;}
.site-nav-toggle svg{width:22px;height:22px;fill:none;stroke:var(--omni-navy);stroke-width:1.8;stroke-linecap:round;display:block;}
.site-nav-toggle .site-nav-toggle__close{display:none;}
.site-nav-toggle[aria-expanded="true"] .site-nav-toggle__open{display:none;}
.site-nav-toggle[aria-expanded="true"] .site-nav-toggle__close{display:block;}

/* mobile / tablet: hamburger + full-height drawer, same items.
   Breakpoint 1100: with the web fonts loaded the two-row desktop nav plus
   the CTA needs ~1070px, so at 1024-1099px it overflowed the header. */
@media (max-width:1099px){
  .site-header__inner{padding:10px 20px;gap:16px;}
  /* 44px tall logo = 153px wide, so logo + hamburger fit at 320px */
  .site-logo,.site-logo:link,.site-logo:visited{flex:0 1 auto;min-width:0;}
  .site-logo .omni-logo{height:44px;}
  .site-nav-toggle{display:block;}
  .site-nav{display:none;position:fixed;left:0;right:0;top:0;bottom:0;background:#fff;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:8px 20px 48px;flex-direction:column;align-items:stretch;gap:0;z-index:999;}
  .site-nav.is-open{display:flex;}
  body.site-nav-open{overflow:hidden;}
  .site-nav__rows{gap:0;}
  .site-nav__row{flex-direction:column;align-items:stretch;gap:0;}
  .site-nav__row>li{border-bottom:1px solid rgba(10,22,40,.08);}
  .site-nav a,.site-nav a:link,.site-nav a:visited,.site-nav .site-nav__trigger{display:flex;width:100%;justify-content:space-between;padding:16px 4px;font-size:15px;white-space:normal;text-align:left;}
  .site-nav a[aria-current="page"],.site-nav .has-menu.is-active>.site-nav__trigger{text-underline-offset:5px;}
  .site-nav__menu{position:static;min-width:0;border:0;box-shadow:none;border-radius:0;padding:0 0 8px 16px;}
  .site-nav__menu li a,.site-nav__menu li a:link,.site-nav__menu li a:visited{padding:12px 4px;font-size:14px;}
  .site-nav__aside{margin:20px 0 0;flex-wrap:wrap;gap:16px;}
  .site-nav .site-nav__social,.site-nav a.site-nav__social{width:auto;padding:6px;}
  .site-nav a.site-nav__cta,.site-nav a.site-nav__cta:link,.site-nav a.site-nav__cta:visited{width:auto;display:inline-flex;padding:8px 0;margin:0;}
}

/* ===== Emoji replacements =====
   build.py swaps every emoji in the pages for one of the gold line SVGs in
   site/icons.py. 1em so each icon takes the size the emoji had. */
svg.omni-icon{width:1em;height:1em;fill:none;stroke:var(--omni-gold);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;display:inline-block;vertical-align:-0.125em;flex-shrink:0;}

/* ===== Plain text pages (terms-and-conditions was a Squarespace TEXT page,
   so it carries no CSS of its own; this gives it the design system) ===== */
.omni-text-page{max-width:820px;margin:0 auto;padding:64px 24px 80px;font-family:var(--omni-font-body);font-size:16px;line-height:1.75;color:rgba(255,255,255,.8);}
.omni-text-page h1{font-family:var(--omni-font-heading);font-size:clamp(32px,5vw,48px);font-weight:700;line-height:1.15;color:var(--omni-white);margin:0 0 16px;letter-spacing:-.5px;}
.omni-text-page h2{font-family:var(--omni-font-heading);font-size:clamp(22px,3vw,28px);font-weight:700;color:var(--omni-white);margin:40px 0 12px;}
.omni-text-page h3{font-family:var(--omni-font-heading);font-size:19px;font-weight:600;color:var(--omni-gold);margin:24px 0 8px;}
.omni-text-page p{margin:0 0 16px;}
.omni-text-page ul{margin:0 0 16px;padding-left:22px;}
.omni-text-page li{margin:6px 0;}
.omni-text-page a{color:var(--omni-gold);}
.omni-text-page a:hover{color:var(--omni-gold-light);}

/* ===== Homepage FAQ section (pages/home-5.html) =====
   Authored for a light Squarespace section: navy headings and dark body
   text with no background of its own. On the navy site body it would be
   unreadable, so the section gets the white background it was designed on. */
#omni-faq{background:#ffffff;}

/* ===== Footer (source: pages/footer.html) ===== */
#omnifit-footer{
    --omni-navy:#0a1628;
    --omni-navy-deep:#0f1f3a;
    --omni-gold:#c9a84c;
    --omni-gold-hover:#e0c872;
    --omni-text:#f5f7fb;
    --omni-muted:#c7d2e0;
    --body-font:'Montserrat', system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

    background:linear-gradient(180deg, var(--omni-navy), var(--omni-navy-deep));
    color:var(--omni-text);
    font-family:var(--body-font);
    font-size:16px;
    contain:layout style;
  }
  #omnifit-footer a{color:var(--omni-gold);text-decoration:none;}
  #omnifit-footer a:hover,
  #omnifit-footer a:focus{color:var(--omni-gold-hover);text-decoration:underline;}
  #omnifit-footer .wrap{max-width:1200px;margin:0 auto;padding:40px 20px;}

  /* ===== CTA ===== */
  #omnifit-footer .footer-cta{
    display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;margin-bottom:36px;
  }
  #omnifit-footer .footer-cta h3{
    margin:0;
    font-family:'Playfair Display','Times New Roman',serif;
    font-size:clamp(20px,3.6vw,28px);
    font-weight:700;
    color:var(--omni-gold);
  }
  #omnifit-footer .footer-cta p{margin:0;color:var(--omni-muted);}
  #omnifit-footer .footer-cta .btn{
    display:inline-block;
    padding:12px 22px;
    border-radius:10px;
    font-weight:700;
    background:var(--omni-gold);
    color:var(--omni-navy) !important;
    text-decoration:none;
    transition:background .25s ease, transform .1s ease;
  }
  #omnifit-footer .footer-cta .btn:hover{background:var(--omni-gold-hover);transform:translateY(-1px);text-decoration:none;}

  /* ===== Grid ===== */
  #omnifit-footer .footer-grid{
    display:grid;gap:28px;align-items:flex-start;
    grid-template-columns:1.1fr 1fr 1fr;
  }
  #omnifit-footer .footer-card h4{
    margin:0 0 10px;
    font-size:18px;
    font-weight:700;
    letter-spacing:.3px;
    color:var(--omni-gold);
  }
  #omnifit-footer .footer-card p{margin:6px 0;color:var(--omni-muted);}
  #omnifit-footer .footer-card ul{list-style:none;padding:0;margin:8px 0;}
  #omnifit-footer .footer-card li{margin:8px 0;display:flex;align-items:center;gap:10px;}
  #omnifit-footer .footer-card svg{height:20px;width:20px;stroke:var(--omni-gold);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;transition:stroke .2s ease;}
  #omnifit-footer .footer-card a:hover svg{stroke:var(--omni-gold-hover);}
  #omnifit-footer .footer-card a span{color:var(--omni-gold);}
  #omnifit-footer .footer-card a:hover span{color:var(--omni-gold-hover);}

  /* ===== Copyright ===== */
  #omnifit-footer .footer-copy{
    margin-top:28px;
    text-align:center;
    color:var(--omni-muted);
    font-size:14px;
  }

  @media(max-width:800px){
    #omnifit-footer .footer-grid{grid-template-columns:1fr;gap:32px;}
    #omnifit-footer .footer-cta h3{font-size:22px;}
  }
