/* Site-wide Qurbani Centre redesign rollout. Astra remains only as the
   compatibility/template layer for WooCommerce and stored page content. */
body:not(.home){background:var(--color-background);color:var(--color-text);font-family:Inter,Arial,sans-serif}
body:not(.home) #ast-desktop-header,body:not(.home) #ast-mobile-header,body:not(.home) header.site-header,body:not(.home) footer.site-footer{display:none!important}
body:not(.home) .site-content{background:var(--color-background)}
body:not(.home) .ast-container{width:min(100% - 40px,1200px);max-width:1200px;padding:0}
body:not(.home) #primary{margin:0;padding:clamp(42px,7vw,88px) 0;width:100%}
/* QC design audit (28 Sep 2026): element-level defaults are wrapped in :where()
   so they carry element-only specificity. Previously `body:not(.home) a` and
   `body:not(.home) h2` outranked header/footer component rules, turning the
   header CTA text and utility links emerald and the footer headings ink-on-ink. */
:where(body:not(.home)) .entry-content,:where(body:not(.home)) .entry-summary{color:var(--color-text)}
:where(body:not(.home)) :is(h1,h2,h3,h4){font-family:Fraunces,Georgia,serif;color:var(--color-text);letter-spacing:-.025em}
:where(body:not(.home)) a{color:var(--color-link)}
:where(body:not(.home)) a:hover{color:var(--color-link-hover)}
.qc-sitewide-shell{position:relative;z-index:100}
.qc-sitewide-shell .qc-brand,.qc-sitewide-footer .qc-brand{gap:0}

/* Campaign and institutional pages retain their governed content while using
   the approved shell, measure, spacing and surface system. */
.page:not(.home) article.page{background:transparent}
.page:not(.home) .entry-header{margin-bottom:30px}
.page:not(.home) .entry-title{font-size:clamp(2.5rem,6vw,4.75rem);line-height:.98}
/* #primary has no top padding on trust pages, so the former negative margin
   pulled the local page navigation underneath the header at >768px. */
.qc6{margin-top:0}
.qc6-local{border-radius:0 0 var(--radius-md) var(--radius-md)}
.qc6-hero{isolation:isolate;min-height:380px;display:flex;align-items:center}
.qc6-main{padding-bottom:clamp(64px,9vw,112px)}

/* Trust-first WooCommerce product presentation. Functional forms and server
   validation stay owned by the approved booking plugin. */
.single-product #primary{padding-top:clamp(38px,6vw,72px)}
.single-product div.product{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(34px,6vw,76px);align-items:start}
.single-product div.product .woocommerce-product-gallery{width:100%!important;float:none!important;margin:0!important;min-height:520px;border:1px solid var(--color-border);border-radius:var(--radius-xl);background:var(--color-surface-subtle);display:grid;place-items:center;overflow:hidden}
.single-product div.product .summary{width:100%!important;float:none!important;margin:0!important;padding:clamp(6px,2vw,24px) 0}
.single-product .product_title{font-size:clamp(2.5rem,5vw,4.4rem)!important;line-height:1!important;margin:.25em 0!important}
.single-product .price{font-family:Fraunces,Georgia,serif;color:var(--color-brand-primary)!important;font-size:clamp(1.7rem,3vw,2.35rem)!important;font-weight:700}
.single-product .woocommerce-product-details__short-description{font-size:1.05rem;color:var(--color-text-muted);max-width:62ch}
.single-product .qc-booking-panel,.single-product form.cart{background:var(--color-surface);border:1px solid var(--color-border);border-left:4px solid var(--color-brand-secondary);border-radius:var(--radius-lg);padding:clamp(20px,3vw,32px);box-shadow:var(--shadow-sm)}
.single-product .woocommerce-tabs{grid-column:1/-1;margin-top:26px;padding-top:36px;border-top:1px solid var(--color-border)}
.single-product .woocommerce-tabs ul.tabs{padding:0!important}
.single-product .woocommerce-tabs ul.tabs:before{border-color:var(--color-border)!important}
.single-product .woocommerce-tabs ul.tabs li{background:transparent!important;border:0!important}
.single-product .woocommerce-breadcrumb{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted)}

/* Transaction pages share the same editorial container and surface language. */
.woocommerce-cart .entry-content,.woocommerce-checkout .entry-content,.page-id-35 .entry-content{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:clamp(22px,5vw,52px);box-shadow:var(--shadow-sm)}
.woocommerce-cart table.shop_table,.woocommerce-checkout table.shop_table{border-color:var(--color-border);border-radius:var(--radius-md)}
.woocommerce-cart .cart_totals,.woocommerce-checkout #order_review{background:var(--color-surface-subtle);border-color:var(--color-border)}
.woocommerce .button,.woocommerce button.button,.woocommerce input.button{min-height:48px;border-radius:var(--radius-md)!important;background:var(--color-brand-primary)!important;color:#fff!important;font-family:Inter,Arial,sans-serif!important;font-weight:700!important}
.woocommerce .button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover{background:var(--color-brand-primary-hover)!important}
.qc-track-booking{max-width:900px}

/* Strict 44px hit areas for compact native WooCommerce controls. Text remains
   at its normal size; only the interactive box grows. */
.woocommerce-cart-form .product-remove a,
.woocommerce-cart-form .product-thumbnail a,
.woocommerce-cart-form .product-name a,
.woocommerce-form-coupon-toggle .showcoupon,
.woocommerce-privacy-policy-text .woocommerce-privacy-policy-link{
 display:inline-flex;min-width:44px;min-height:44px;align-items:center
}
.woocommerce-cart-form .product-remove a{justify-content:center}
.woocommerce-form-coupon-toggle .showcoupon,
.woocommerce-privacy-policy-text .woocommerce-privacy-policy-link{padding-block:10px}

/* Keep a familiar 20px indicator inside a measured 44px control. */
#payment input[type="radio"],
#payment input[type="checkbox"]{
 appearance:none;-webkit-appearance:none;position:relative;box-sizing:border-box;
 width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;
 margin:0 8px 0 0!important;border:0!important;background:transparent!important;
 display:inline-grid;place-content:center;flex:0 0 44px
}
#payment input[type="radio"]:before,
#payment input[type="checkbox"]:before{
 content:"";display:block;width:20px;height:20px;box-sizing:border-box;
 border:2px solid var(--color-brand-secondary);background:var(--color-surface)
}
#payment input[type="radio"]:before{border-radius:50%}
#payment input[type="checkbox"]:before{border-radius:4px}
#payment input[type="radio"]:checked:after{
 content:"";position:absolute;left:17px;top:17px;width:10px;height:10px;
 border-radius:50%;background:var(--color-brand-secondary)
}
#payment input[type="checkbox"]:checked:after{
 content:"";position:absolute;left:16px;top:14px;width:11px;height:7px;
 border-left:3px solid var(--color-brand-secondary);border-bottom:3px solid var(--color-brand-secondary);
 transform:rotate(-45deg)
}
#payment input[type="radio"]:focus-visible,
#payment input[type="checkbox"]:focus-visible{outline:3px solid var(--color-focus)!important;outline-offset:1px}

/* Direct support route. It promises support only, not confirmation, media,
   evidence delivery or fulfilment updates. */
.qc-whatsapp-support{position:fixed;right:18px;bottom:18px;z-index:90;display:inline-flex;min-width:44px;min-height:44px;align-items:center;justify-content:center;gap:9px;padding:9px 14px 9px 9px;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:var(--color-brand-secondary);color:var(--color-surface)!important;box-shadow:0 10px 28px color-mix(in srgb,var(--color-brand-secondary) 24%,transparent);font-family:Inter,Arial,sans-serif;font-size:.78rem;font-weight:700;line-height:1;text-decoration:none!important}
.qc-whatsapp-support:hover{background:color-mix(in srgb,var(--color-brand-secondary) 82%,var(--color-text));color:var(--color-surface)!important;transform:translateY(-1px)}
.qc-whatsapp-support:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}
.qc-whatsapp-support__mark{display:grid;width:26px;height:26px;place-items:center;border:1px solid rgba(255,255,255,.48);border-radius:50%;font-size:.72rem;font-weight:800}

@media(max-width:900px){
 body:not(.home) .ast-container{width:min(100% - 28px,1200px)}
 .single-product div.product{grid-template-columns:1fr}
 .single-product div.product .woocommerce-product-gallery{min-height:340px}
}
@media(max-width:520px){
	.qc-whatsapp-support{right:14px;bottom:14px;width:48px;height:48px;padding:0}
	.qc-whatsapp-support__label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
	.qc-whatsapp-support__mark{width:28px;height:28px}
 body:not(.home) #primary{padding:34px 0 56px}
 .single-product div.product .woocommerce-product-gallery{min-height:260px}
 .woocommerce-cart .entry-content,.woocommerce-checkout .entry-content,.page-id-35 .entry-content{padding:18px}
}

/* ============================================================
   QC MOBILE SURFACE REPAIR — shared product and inner-page treatment

   The rollout used a fixed-height gallery plus an Astra content surface,
   gallery surface and form surface on the same narrow product route.  On a
   phone that read as one continuous white panel (and made a no-image gallery
   needlessly tall).  The page/root containers are structural, not cards:
   they now expose the ivory canvas.  The booking form remains the single
   intentional functional grouping.
   ============================================================ */
.page:not(.home) #primary > .ast-container > article,
.single-product #primary,
.single-product #primary > .ast-container,
.single-product #primary > .ast-container > article,
.single-product div.product{
 background:transparent;
 border:0;
 border-radius:0;
 box-shadow:none;
}
.single-product div.product .woocommerce-product-gallery{
 min-height:0;
 padding:0;
 background:var(--color-surface-subtle);
 box-shadow:none;
}
.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--without-images{
 height:136px!important;
 min-height:136px!important;
 padding:18px;
 aspect-ratio:auto!important;
 padding-bottom:18px!important;
 border-style:dashed;
 border-radius:var(--radius-lg);
}
.single-product .woocommerce-product-gallery__wrapper,
.single-product .woocommerce-product-gallery__image,
.single-product .woocommerce-product-gallery__image img{
 width:100%;
 height:auto;
}
.single-product .woocommerce-product-gallery__image img{
 display:block;
 object-fit:contain;
}
.single-product .qc-booking-panel,
.single-product form.cart{
 margin-top:clamp(24px,4vw,36px);
 border-left-width:3px;
 box-shadow:none;
}
.single-product .woocommerce-tabs{
 margin-top:clamp(34px,6vw,56px);
 padding-top:clamp(28px,5vw,44px);
}

/* Match the homepage footer navigation colour exactly.  This is deliberately
   nav-only: contact and support links retain their component-specific colour. */
body:not(.home) .qc-sitewide-footer nav a,
body:not(.home) .qc-sitewide-footer nav a:visited{
 color:rgba(255,255,255,.72);
}
body:not(.home) .qc-sitewide-footer nav a:hover,
body:not(.home) .qc-sitewide-footer nav a:active{
 color:var(--color-surface);
}
body:not(.home) .qc-sitewide-footer nav a:focus-visible{
 color:var(--color-surface);
 outline:3px solid var(--color-accent);
 outline-offset:3px;
}

@media(max-width:767px){
 .single-product #primary > .ast-container{width:min(100% - 40px,1200px)}
 .single-product div.product{gap:28px}
 .single-product div.product .summary{padding:0}
 .single-product .product_title{
  margin:.3em 0 .42em!important;
  font-size:clamp(30px,8vw,36px)!important;
  line-height:1.08!important;
 }
 .single-product .price{margin-block:0 20px!important;font-size:24px!important;line-height:1.2!important}
 .single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--with-images{border-radius:var(--radius-lg)}
 .single-product .qc-booking-panel,
 .single-product form.cart{padding:20px}
 /* The fixed support control remains reachable, but clears the mobile
    purchase/sticky-bar zone instead of sitting over it. */
 .single-product .qc-whatsapp-support{
  display:inline-flex;
  right:14px;
  bottom:82px;
 }
}

/* ============================================================
   QC HEADING ALIGNMENT — shared content typography

   Headings arrive from Astra, WooCommerce, governed pages and article
   content, so the rule belongs on their shared content roots rather than in
   individual templates. `text-align-last:auto` keeps the final line natural;
   on a one-line heading justification has no visible effect.  Navigation,
   controls and footer labels are intentionally outside this scope.
   ============================================================ */
:is(main, #primary, .entry-content, .qc6-main, .qc-knowledge-hub) :is(h1,h2,h3,h4,h5,h6):not(.qc-footer h1):not(.qc-footer h2):not(.qc-footer h3):not(.qc-footer h4):not(.qc-footer h5):not(.qc-footer h6){
 text-align:justify;
 text-align-last:auto;
 overflow-wrap:anywhere;
 hyphens:auto;
 max-width:100%;
}
@media(max-width:767px){
 :is(main, #primary, .entry-content, .qc6-main, .qc-knowledge-hub) :is(h1,h2,h3,h4,h5,h6){
  line-height:clamp(1.12,1.2,1.3);
  margin-inline:0;
 }
}

/* ============================================================
   QC CONTENT ALIGNMENT CORRECTION

   Headings are scanning anchors and must stay left-aligned.  Running copy is
   justified inside real content roots only; this deliberately excludes the
   site shell, navigation, labels, controls and compact UI metadata.  The
   final line remains natural through text-align-last:auto.
   ============================================================ */
:is(main, #primary, .entry-content, .qc6-main, .qc-knowledge-hub) :is(h1,h2,h3,h4,h5,h6),
:is(.faq-item .q, [class*="faq"] :is(summary, .question, .faq-question)){
 text-align:left!important;
 text-align-last:auto;
}
:is(main, #primary, .entry-content, .qc6-main, .qc-knowledge-hub) :is(p, li, blockquote, figcaption, .faq-item .a, .faq-answer, [class*="faq"] .answer):not([class*="eyebrow"]):not([class*="label"]):not([class*="kicker"]):not([class*="badge"]):not([class*="meta"]):not([class*="price"]):not([class*="button"]):not([class*="btn"]):not([class*="notice"]):not([class*="breadcrumb"]):not([class*="screen-reader"]){
 text-align:justify!important;
 text-align-last:auto;
 text-justify:inter-word;
 overflow-wrap:break-word;
 hyphens:auto;
}
@media(max-width:599px){
 :is(main, #primary, .entry-content, .qc6-main, .qc-knowledge-hub) :is(p, li, blockquote, figcaption, .faq-item .a, .faq-answer, [class*="faq"] .answer){
  -webkit-hyphens:manual;
  hyphens:manual;
 }
}