/*
Theme Name: MGC Academy
Theme URI: https://www.mgcgolfacademy.co.uk/
Author: Minchinhampton Golf Professional Shop & Teaching Academy Ltd
Description: Block theme for Minchinhampton Golf Academy — the professional's shop, coaching, custom fitting and the Performance Putting Centre. Navy and white, built around the club crest.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mgc-academy
Tags: full-site-editing, block-patterns, custom-colors, custom-menu, one-column, wide-blocks
*/

/* ---------------------------------------------------------
   Only what theme.json cannot express. Keep this file small.
   --------------------------------------------------------- */

/* Brand sub-line — echoes the grey italic in the logo lock-up */
.mgc-subline {
  font-family: var(--wp--preset--font-family--display);
  font-style: italic;
  font-weight: 400;
  color: var(--wp--preset--color--grey);
  letter-spacing: 0;
  text-transform: none;
}

/* Letterspaced label */
.mgc-label {
  font-family: var(--wp--preset--font-family--body);
  font-weight: 600;
  font-size: 0.69rem;
  letter-spacing: 0.19em;
  text-transform: uppercase;
}

/* Header ------------------------------------------------- */
.mgc-header { border-bottom: 1px solid var(--wp--preset--color--line); }
.mgc-crest img { height: 78px; width: auto; display: block; }
@media (max-width: 781px) { .mgc-crest img { height: 56px; } }
.mgc-wordmark { line-height: 1.15; }
.mgc-wordmark strong {
  display: block;
  font-family: var(--wp--preset--font-family--display);
  font-weight: 700;
  font-size: 1.16rem;
  color: var(--wp--preset--color--navy);
}
.mgc-header .wp-block-navigation {
  font-family: var(--wp--preset--font-family--body);
  font-weight: 600;
  font-size: 0.77rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.mgc-header .wp-block-navigation a { text-decoration: none; }
.mgc-header .wp-block-navigation .current-menu-item > a {
  box-shadow: inset 0 -2px 0 var(--wp--preset--color--navy);
}

/* Inverted sections -------------------------------------- */
.mgc-invert,
.mgc-invert :where(h1, h2, h3, h4, p, li, td, th, figcaption) { color: #fff; }
.mgc-invert .mgc-subline,
.mgc-invert figcaption { color: #a9c3e2; }
.mgc-invert a { color: #cfdcef; }
.mgc-invert .wp-block-button__link { background: #fff; color: var(--wp--preset--color--navy); }
.mgc-invert .wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent; color: #fff; border-color: rgba(255,255,255,.45);
}

/* Hero with a film behind it ----------------------------- */
.mgc-hero { position: relative; overflow: hidden; isolation: isolate; }
.mgc-hero > video, .mgc-hero > .mgc-hero-media video, .mgc-hero > .mgc-hero-media img {
  position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; margin: 0;
  object-fit: cover; z-index: -2;
}
.mgc-hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(100deg, rgba(12,22,44,.94) 0%, rgba(12,22,44,.82) 44%, rgba(12,22,44,.42) 100%);
}

/* Figures ------------------------------------------------ */
.wp-block-image figcaption {
  font-family: var(--wp--preset--font-family--display);
  font-style: italic;
  font-size: 0.88rem;
  color: var(--wp--preset--color--grey);
  text-align: left;
}
.mgc-cover-4x5 img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }
.mgc-cover-16x10 img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }

/* Price tables ------------------------------------------- */
.wp-block-table.is-style-mgc-price table { border-collapse: collapse; width: 100%; }
.wp-block-table.is-style-mgc-price th {
  background: var(--wp--preset--color--navy);
  color: #b3c4dc;
  font-family: var(--wp--preset--font-family--body);
  font-size: 0.66rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  text-align: left;
  padding: 12px 20px;
  border: none;
}
.wp-block-table.is-style-mgc-price td {
  padding: 14px 20px;
  border: none;
  border-top: 1px solid var(--wp--preset--color--line);
  vertical-align: top;
}
.wp-block-table.is-style-mgc-price tbody tr:nth-child(even) { background: #fafbfe; }
.wp-block-table.is-style-mgc-price td:last-child {
  font-family: var(--wp--preset--font-family--display);
  font-weight: 700;
  color: var(--wp--preset--color--navy);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

/* Numbered steps ----------------------------------------- */
.mgc-steps { counter-reset: mgcstep; }
.mgc-steps > .wp-block-group { counter-increment: mgcstep; position: relative; }
.mgc-steps > .wp-block-group::before {
  content: counter(mgcstep);
  font-family: var(--wp--preset--font-family--display);
  font-weight: 700;
  font-size: 1.3rem;
  color: var(--wp--preset--color--blue-pale);
  position: absolute;
  left: -2.6rem;
  top: 0.15rem;
}
@media (max-width: 781px) {
  .mgc-steps > .wp-block-group { padding-left: 0; }
  .mgc-steps > .wp-block-group::before { position: static; display: block; margin-bottom: 0.2rem; }
}

/* Opening hours pill ------------------------------------- */
.mgc-hours {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: var(--wp--preset--font-family--body);
  font-weight: 600; font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase;
  border: 1px solid var(--wp--preset--color--line);
  border-radius: 999px; padding: 7px 15px; color: var(--wp--preset--color--ink-soft);
  background: #fff;
}
.mgc-hours .mgc-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--wp--preset--color--ink-faint); flex: none; }
.mgc-hours.is-open { border-color: #b6d4bf; background: #f0f7f2; color: #245c37; }
.mgc-hours.is-open .mgc-dot { background: #2f8f5b; }

/* Brand chips -------------------------------------------- */
.mgc-brands { display: flex; flex-wrap: wrap; gap: 10px; }
.mgc-brands span {
  border: 1px solid #c3cddd; border-radius: 2px; padding: 10px 18px;
  font-family: var(--wp--preset--font-family--body);
  font-weight: 700; font-size: 0.78rem; letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--wp--preset--color--navy); background: #fff;
}

/* Footer ------------------------------------------------- */
.mgc-footer { background: var(--wp--preset--color--navy-deep); color: #c8d4e7; }
.mgc-footer :where(p, li, span, td) { color: #c8d4e7; }
.mgc-footer a { color: #c8d4e7; text-decoration: none; }
.mgc-footer a:hover { color: #fff; text-decoration: underline; }
.mgc-footer .mgc-label { color: #a3b8d4; }
.mgc-footer-mark img { max-width: 260px; height: auto; }
.mgc-legal { border-top: 1px solid rgba(255,255,255,.15); color: #a3b8d4; font-size: 0.83rem; }

/* Accessibility ------------------------------------------ */
:where(a, button, input, select, textarea):focus-visible {
  outline: 2px solid var(--wp--preset--color--blue);
  outline-offset: 3px;
}
.screen-reader-text {
  position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%);
  white-space: nowrap;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .mgc-hero > video { display: none; }
}

/* Facility tour tiles ------------------------------------ */
.mgc-vgrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
  margin-top: 2rem;
}
.mgc-vgrid.mgc-vgrid-films { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.mgc-vtile { margin: 0; display: grid; gap: 10px; }
.mgc-vtile video {
  width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block;
  background: var(--wp--preset--color--navy-deep); border-radius: 3px;
}
.mgc-vtile figcaption { display: grid; gap: 1px; }
.mgc-vtile figcaption strong {
  font-family: var(--wp--preset--font-family--display);
  font-weight: 700; font-size: 1rem; color: var(--wp--preset--color--navy);
}
.mgc-vtile figcaption em {
  font-family: var(--wp--preset--font-family--display);
  font-style: italic; font-size: 0.86rem; color: var(--wp--preset--color--grey);
}

/* People -------------------------------------------------- */
.mgc-people {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 22px;
  margin-top: 2.2rem;
}
.mgc-person { margin: 0; display: grid; gap: 10px; align-content: start; }
.mgc-person img {
  width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; border-radius: 3px;
}
.mgc-person figcaption { display: grid; gap: 3px; }
.mgc-person .mgc-role {
  font-family: var(--wp--preset--font-family--display);
  font-style: italic; font-size: 0.88rem; color: var(--wp--preset--color--grey);
}
.mgc-person figcaption strong {
  font-family: var(--wp--preset--font-family--display);
  font-weight: 700; font-size: 1.06rem; color: var(--wp--preset--color--navy);
}
.mgc-person figcaption > span:last-child {
  font-size: 0.9rem; color: var(--wp--preset--color--ink-soft); line-height: 1.55;
}

/* Vimeo embeds ------------------------------------------- */
.mgc-embed { position: relative; padding-top: 56.25%; border-radius: 3px; overflow: hidden; background: var(--wp--preset--color--navy-deep); }
.mgc-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Two-tier header ---------------------------------------- */
.mgc-navrow { border-top: 1px solid var(--wp--preset--color--line); }
.mgc-header .wp-block-navigation { width: 100%; font-size: 0.74rem; letter-spacing: 0.1em; }
.mgc-header .wp-block-navigation .wp-block-navigation__container { width: 100%; gap: 0.4rem 1.1rem; }
@media (max-width: 900px) {
  .mgc-header .wp-block-navigation { justify-content: flex-start; }
  .mgc-navrow { padding-top: 0.6rem !important; padding-bottom: 0.6rem !important; }
}

/* Wide intro blocks read from the left, not centred ------ */
.wp-block-group.alignwide.is-layout-constrained > *:not(.alignwide):not(.alignfull),
.mgc-steps.is-layout-constrained > *:not(.alignwide):not(.alignfull) {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 46rem;
}

/* Wordmark lockup ---------------------------------------- */
.mgc-crest { gap: 1.05rem; }
.mgc-wordmark { line-height: 1.1; }
.mgc-wordmark > * { margin: 0 !important; max-width: none !important; }
.mgc-wordmark .wp-block-site-title {
  font-family: var(--wp--preset--font-family--display);
  font-weight: 700;
  font-size: 1.62rem;
  line-height: 1.05;
  color: var(--wp--preset--color--navy);
  white-space: nowrap;
}
.mgc-wordmark .wp-block-site-title a { color: inherit; text-decoration: none; }
.mgc-wordmark .wp-block-site-tagline {
  font-size: 0.98rem;
  line-height: 1.25;
  margin-top: 0.2rem !important;
  text-wrap: balance;
}
@media (max-width: 600px) {
  .mgc-wordmark .wp-block-site-title { font-size: 1.18rem; }
  .mgc-wordmark .wp-block-site-tagline { font-size: 0.82rem; }
}

/* Buy buttons on the vouchers page ----------------------- */
.mgc-buy {
  display: inline-block;
  font-family: var(--wp--preset--font-family--body);
  font-weight: 600; font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase;
  color: #fff; background: var(--wp--preset--color--navy);
  padding: 11px 20px; border-radius: 2px; text-decoration: none;
  border: 1px solid var(--wp--preset--color--navy);
}
.mgc-buy:hover { background: var(--wp--preset--color--navy-deep); border-color: var(--wp--preset--color--navy-deep); color: #fff; }
.mgc-buy-invert { background: #fff; color: var(--wp--preset--color--navy); border-color: #fff; }
.mgc-buy-invert:hover { background: var(--wp--preset--color--blue-pale); border-color: var(--wp--preset--color--blue-pale); color: var(--wp--preset--color--navy); }
/* Value voucher purchase tiles --------------------------- */
.mgc-value-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  margin-top: 0.9rem;
}
.mgc-value-grid a {
  display: flex; flex-direction: column; gap: 5px; align-items: flex-start;
  background: var(--wp--preset--color--navy);
  border: 1px solid var(--wp--preset--color--navy);
  border-radius: 3px; padding: 16px 18px;
  text-decoration: none;
}
.mgc-value-grid a:hover,
.mgc-value-grid a:focus-visible {
  background: var(--wp--preset--color--navy-deep);
  border-color: var(--wp--preset--color--navy-deep);
}
.mgc-value-amt {
  font-family: var(--wp--preset--font-family--display);
  font-weight: 700; font-size: 1.6rem; line-height: 1; color: #fff;
}
.mgc-value-go {
  font-family: var(--wp--preset--font-family--body);
  font-weight: 600; font-size: 0.63rem; letter-spacing: 0.14em;
  text-transform: uppercase; color: #b9cbe6;
}
.mgc-value-grid a:hover .mgc-value-go { color: #fff; }

/* WooCommerce ------------------------------------------- */
.woocommerce-page main,
.woocommerce main { padding-bottom: var(--wp--preset--spacing--60); }
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error {
  border-top-color: var(--wp--preset--color--navy);
  background: var(--wp--preset--color--stone);
  font-family: var(--wp--preset--font-family--body);
}
.woocommerce .woocommerce-message::before,
.woocommerce .woocommerce-info::before { color: var(--wp--preset--color--navy); }

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--wp--preset--font-family--display);
  font-weight: 700; font-size: 1.02rem; color: var(--wp--preset--color--navy);
}
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price {
  font-family: var(--wp--preset--font-family--display);
  font-weight: 700; color: var(--wp--preset--color--navy);
}
.woocommerce div.product .product_title {
  font-family: var(--wp--preset--font-family--display);
  color: var(--wp--preset--color--navy);
}

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  font-family: var(--wp--preset--font-family--body);
  font-weight: 600; font-size: 0.74rem; letter-spacing: 0.14em; text-transform: uppercase;
  background: var(--wp--preset--color--navy); color: #fff;
  border-radius: 2px; padding: 13px 24px; line-height: 1.2;
}
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
  background: var(--wp--preset--color--navy-deep); color: #fff;
}

.woocommerce table.shop_table,
.woocommerce table.shop_table td,
.woocommerce table.shop_table th { border-color: var(--wp--preset--color--line); }
.woocommerce table.shop_table thead th {
  background: var(--wp--preset--color--navy); color: #b3c4dc;
  font-family: var(--wp--preset--font-family--body);
  font-size: 0.66rem; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700;
  border: none;
}
.woocommerce-checkout h3,
.woocommerce-cart h2,
.woocommerce-checkout h2 {
  font-family: var(--wp--preset--font-family--display);
  color: var(--wp--preset--color--navy);
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text {
  border: 1px solid var(--wp--preset--color--line);
  border-radius: 2px; padding: 11px 13px;
  font-family: var(--wp--preset--font-family--body); font-size: 0.98rem;
}
.woocommerce form .form-row label { font-size: 0.85rem; color: var(--wp--preset--color--ink-soft); }
.woocommerce-checkout #payment { background: var(--wp--preset--color--stone); border-radius: 3px; }
.woocommerce-checkout #payment div.payment_box { background: #fff; border: 1px solid var(--wp--preset--color--line); }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--wp--preset--color--line); }
.woocommerce-terms-and-conditions-wrapper { font-size: 0.92rem; color: var(--wp--preset--color--ink-soft); }
.woocommerce-privacy-policy-text p { font-size: 0.9rem; color: var(--wp--preset--color--ink-faint); }

/* Nothing is posted, so hide any shipping remnants */
.woocommerce-shipping-fields,
.woocommerce-cart .shipping,
.woocommerce-checkout-review-order-table .shipping { display: none !important; }

/* Voucher cards: buy button pinned to the bottom --------- */
.mgc-vcard { display: flex; flex-direction: column; gap: 8px; }
.mgc-vcard-buy { margin: 0 !important; padding-top: 0.9rem; margin-top: auto !important; }

/* Crest in the home page hero ---------------------------- */
.mgc-hero-crest {
  height: 104px; width: auto; display: block;
  margin: 0 0 1.4rem;
}
@media (max-width: 781px) {
  .mgc-hero-crest { height: 74px; margin-bottom: 1.1rem; }
}