/* WordPress-only corrections, loaded after main.css (the comp stylesheet,
   which ships verbatim). Nothing here restyles the design. */

/* Skip link: hidden until focused (the comp has none). */
.skip-link{position:absolute;left:-9999px;top:0;z-index:1000;background:var(--green-dark);color:#fff;padding:12px 18px;font-family:var(--ui);font-weight:700}
.skip-link:focus{left:12px;top:12px}

/* <main> wraps the page body; the comp had none. */
main#content{display:block}

/* Admin bar on a logged-in visit: the fixed header sits under the utility bar
   (top:42px) and docks to the top once scrolled; shift both by the admin bar. */
body.admin-bar .header{top:74px}
body.admin-bar .header.scrolled{top:32px}
@media (max-width:782px){body.admin-bar .header{top:88px}body.admin-bar .header.scrolled{top:46px}}

/* Imported blog posts carry core block markup the comp never had. */
.post figure, .post .wp-block-image{margin:30px 0}
.post figure img, .post .wp-block-image img{width:100%;height:auto;border-radius:10px}
.post figcaption, .post .wp-element-caption{font-size:14px;color:var(--muted);margin-top:8px;text-align:left}
.post ul, .post ol{margin:0 0 18px 1.2em}
.post li{margin-bottom:6px}

/* Blog paging. */
.pager{margin-top:34px}
.pager ul{list-style:none;display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.pager a, .pager span{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 14px;border-radius:6px;background:#fff;border:var(--hairline);font-family:var(--ui);font-weight:700}
.pager .current{background:var(--green-dark);color:#fff}

/* Honeypot and Turnstile inside the comp's two-column form grid. */
.inq__form .cf-turnstile{grid-column:1/-1}

/* Shop link on (Customizer > Online pro shop URL): six nav items instead of
   five pushed Book a Tee Time ~40px off-screen between 1081 and 1140px
   (measured 2026-10-07). Tighten only in that band, only when Shop is shown. */
@media (min-width:1081px) and (max-width:1199px){
  body.has-shop .nav__link{padding-left:8px;padding-right:8px}
  body.has-shop .header .container{gap:18px}
}

/* inc/images.php wraps theme images in <picture> for WebP. display:contents keeps
   the <img> laid out exactly as the comp had it (grid/flex child, absolute fill). */
picture{display:contents}
/* With display:contents the <source> tags become grid items themselves (a
   24px phantom row in the W&V header, measured 2026-10-07). They render
   nothing; hiding them does not affect which file the browser picks. */
picture > source{display:none}
