/* Wellness Empire Gym — front-end theme styles
   Palette: black #0B0B0C · surface #151517 · gold #F2C230/#C6900F · red #E11B2E · white #F5F5F6 */

:root{
  --weg-black:#0B0B0C; --weg-surface:#151517; --weg-surface-2:#1E1E22;
  --weg-line:#2b2b30; --weg-white:#F5F5F6; --weg-muted:#9A9AA2;
  --weg-gold:#F2C230; --weg-gold-deep:#C6900F; --weg-red:#E11B2E; --weg-red-deep:#B01020;
  --weg-gold-grad:linear-gradient(135deg,#F7D65A 0%,#E8B10E 45%,#C6900F 100%);
}

/* Border-box everywhere: without this, width:100% + padding overflows the viewport
   (a full-width CTA measured 336px inside a 320px phone). */
*, *::before, *::after{ box-sizing:border-box; }

body{ background:var(--weg-black); color:var(--weg-white); }
a{ color:var(--weg-gold); }
::selection{ background:var(--weg-gold); color:#141416; }

/* ---------- HERO ---------- */
.weg-hero{
  position:relative; overflow:hidden;
  padding:clamp(3.5rem,3rem+6vw,8rem) clamp(1.25rem,4vw,3rem);
  background:
    radial-gradient(120% 120% at 85% 10%, rgba(225,27,46,.35) 0%, rgba(225,27,46,0) 45%),
    linear-gradient(180deg,#141416 0%, #0B0B0C 70%);
}
.weg-hero::after{ /* red diagonal shard, echoing the flyer */
  content:""; position:absolute; inset:0 -20% 0 55%;
  background:linear-gradient(115deg, transparent 45%, rgba(225,27,46,.18) 46%, rgba(225,27,46,0) 72%);
  transform:skewX(-12deg); pointer-events:none;
}
.weg-hero__inner{ position:relative; max-width:1200px; margin:0 auto; }
.weg-hero__eyebrow{
  display:inline-block; font-family:Oswald,sans-serif; text-transform:uppercase;
  letter-spacing:.22em; font-size:.8rem; color:var(--weg-gold); margin-bottom:1rem;
  border-left:3px solid var(--weg-red); padding-left:.7rem;
}
.weg-hero__title{
  font-family:Oswald,sans-serif; font-weight:700; text-transform:uppercase;
  line-height:.98; letter-spacing:-.01em; margin:0 0 1.1rem;
  font-size:clamp(2.6rem,1.4rem+6vw,6rem); max-width:16ch;
}
.weg-hero__title em{ color:var(--weg-gold); font-style:italic; }
.weg-hero__sub{ color:var(--weg-muted); font-size:1.15rem; max-width:44ch; margin:0 0 2rem; }
.weg-btn{
  display:inline-block; font-family:Oswald,sans-serif; font-weight:700; text-transform:uppercase;
  letter-spacing:.05em; text-decoration:none; cursor:pointer; border:0; border-radius:10px;
  padding:.95rem 2rem; min-height:48px; font-size:1rem; color:#141416; background:var(--weg-gold-grad);
  box-shadow:0 10px 30px -12px rgba(242,194,48,.6); transition:transform .15s ease, box-shadow .15s ease;
}
.weg-btn:hover{ transform:translateY(-2px); box-shadow:0 16px 34px -12px rgba(242,194,48,.75); color:#141416; }
.weg-btn--ghost{ background:transparent; color:var(--weg-white); border:2px solid var(--weg-line); box-shadow:none; }
.weg-btn--ghost:hover{ border-color:var(--weg-gold); color:var(--weg-gold); }

/* ---------- SECTION SHELL ---------- */
.weg-section{ max-width:1200px; margin:0 auto; padding:clamp(3rem,2rem+4vw,6rem) clamp(1.25rem,4vw,3rem); }
.weg-section__flag{
  display:inline-block; background:var(--weg-red); color:#fff; font-family:Oswald,sans-serif;
  font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:.6rem 1.4rem;
  border-radius:8px; font-size:clamp(1.1rem,.9rem+1vw,1.6rem); margin-bottom:2rem;
}

/* ---------- PRICING ---------- */
.weg-cat{ margin:0 0 3rem; }
.weg-cat__title{
  font-family:Oswald,sans-serif; text-transform:uppercase; letter-spacing:.02em;
  font-size:clamp(1.3rem,1rem+1.4vw,2rem); margin:0 0 1.4rem;
}
.weg-cat__title span{
  background:var(--weg-red); color:#fff; padding:.45rem 1.1rem; border-radius:8px;
  box-shadow:0 8px 24px -14px rgba(225,27,46,.9);
}
.weg-cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr)); gap:1.1rem; }
.weg-card{
  position:relative; background:linear-gradient(180deg,#17171a,#111113);
  border:1px solid var(--weg-line); border-radius:16px; padding:1.5rem 1.4rem 1.4rem;
  display:flex; flex-direction:column; gap:.9rem; transition:border-color .2s ease, transform .2s ease;
}
.weg-card:hover{ border-color:var(--weg-gold-deep); transform:translateY(-3px); }
.weg-card.is-featured{ border-color:var(--weg-gold); box-shadow:0 0 0 1px var(--weg-gold) inset, 0 20px 50px -30px rgba(242,194,48,.6); }
.weg-card__flag{
  position:absolute; top:-11px; right:16px; background:var(--weg-gold-grad); color:#141416;
  font-family:Oswald,sans-serif; font-weight:700; text-transform:uppercase; font-size:.7rem;
  letter-spacing:.08em; padding:.25rem .7rem; border-radius:999px;
}
.weg-card__name{ font-family:Oswald,sans-serif; font-weight:600; text-transform:uppercase; font-size:1.15rem; margin:0; line-height:1.15; }
.weg-card__desc{ color:var(--weg-muted); font-size:.92rem; margin:0; }
.weg-card__meta{ display:flex; align-items:center; gap:.5rem; margin-top:auto; flex-wrap:wrap; }
.weg-pill{ font-family:Oswald,sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:.02em; padding:.4rem .8rem; border-radius:8px; font-size:.9rem; white-space:nowrap; }
.weg-pill--time{ background:var(--weg-surface-2); color:var(--weg-muted); }
.weg-pill--price{ background:var(--weg-red); color:#fff; font-size:1rem; }
.weg-join{
  margin-top:.4rem; width:100%; min-height:46px; font-size:1rem; text-align:center; text-decoration:none; cursor:pointer; border:0;
  font-family:Oswald,sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:.05em;
  padding:.8rem 1rem; border-radius:10px; color:#141416; background:var(--weg-gold-grad);
  transition:filter .15s ease, transform .15s ease;
}
.weg-join:hover{ filter:brightness(1.06); transform:translateY(-1px); color:#141416; }

/* ---------- FEATURES ---------- */
.weg-features{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr)); gap:1rem; }
.weg-feature{ background:var(--weg-surface); border:1px solid var(--weg-line); border-radius:12px; padding:1.3rem 1rem; text-align:center; }
.weg-feature svg{ width:30px; height:30px; color:var(--weg-gold); margin-bottom:.6rem; }
.weg-feature b{ display:block; font-family:Oswald,sans-serif; text-transform:uppercase; letter-spacing:.03em; font-size:.95rem; }

/* ---------- CTA BAND ---------- */
.weg-cta{ text-align:center; padding:clamp(2.5rem,2rem+3vw,4.5rem) 1.25rem; background:
  radial-gradient(120% 120% at 50% 0%, rgba(225,27,46,.28), transparent 55%), #0B0B0C; border-top:1px solid var(--weg-line); }
.weg-cta h2{ font-family:Oswald,sans-serif; text-transform:uppercase; font-size:clamp(1.4rem,1rem+2.4vw,2.6rem); margin:0; }
.weg-cta h2 em{ color:var(--weg-gold); font-style:italic; }

/* ---------- MODAL ---------- */
.weg-modal{ position:fixed; inset:0; background:rgba(6,6,8,.78); display:flex; align-items:flex-start; justify-content:center; padding:1rem; z-index:9999; overflow-y:auto; -webkit-overflow-scrolling:touch; }
.weg-modal__card{
  width:min(420px,100%); margin:auto;
  /* Must stay reachable when the on-screen keyboard opens: cap height and scroll inside. */
  max-height:calc(100dvh - 2rem); overflow-y:auto; overscroll-behavior:contain;
  background:var(--weg-surface); border:1px solid var(--weg-line); border-top:4px solid var(--weg-gold);
  border-radius:16px; padding:1.6rem; position:relative;
}
@supports not (height: 100dvh){ .weg-modal__card{ max-height:calc(100vh - 2rem); } }
.weg-modal__card h3{ font-family:Oswald,sans-serif; text-transform:uppercase; margin:0 0 .2rem; }
.weg-modal__price{ color:var(--weg-gold); font-family:Oswald,sans-serif; font-size:1.5rem; margin:0 0 1rem; }
.weg-modal__card label{ display:block; font-size:.85rem; color:var(--weg-muted); margin:.7rem 0 0; }
.weg-modal__card input{ width:100%; margin-top:.3rem; padding:.75rem .8rem; border-radius:8px; border:1px solid var(--weg-line); background:#0f0f11; color:var(--weg-white); font-size:16px; }
.weg-modal__card input[type=checkbox]{ width:auto; min-width:20px; min-height:20px; }
.weg-modal__pay{ margin-top:1.2rem; width:100%; min-height:48px; font-size:1rem; border:0; cursor:pointer; padding:.85rem; border-radius:10px; font-family:Oswald,sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:#141416; background:var(--weg-gold-grad); }
.weg-modal__close{ position:absolute; top:.35rem; right:.35rem; width:44px; height:44px; display:flex; align-items:center; justify-content:center; background:0; border:0; color:var(--weg-muted); font-size:1.6rem; line-height:1; cursor:pointer; }
.weg-modal__apply{ min-height:44px; font-size:.95rem; border:0; border-radius:8px; cursor:pointer; background:var(--weg-surface-2); color:var(--weg-white); }
.weg-modal__msg{ margin:.9rem 0 0; font-size:.9rem; color:var(--weg-gold); min-height:1.2em; }

/* ---------- BLOG / CONTENT READABILITY ---------- */
.wp-block-post-title, .entry-title a{ color:var(--weg-white); }
.weg-post-card{ background:var(--weg-surface); border:1px solid var(--weg-line); border-radius:14px; overflow:hidden; }
.weg-post-card img{ width:100%; height:auto; display:block; }
.weg-prose{ color:#e7e7ea; }
.weg-prose a{ color:var(--weg-gold); text-underline-offset:3px; }

/* ---------- A11Y ---------- */
:where(a,button,input,.weg-join):focus-visible{ outline:3px solid var(--weg-gold); outline-offset:2px; }
@media (prefers-reduced-motion: reduce){ *{ transition:none !important; } }

.weg-card__vat{ font-size:.72rem; color:var(--weg-muted); text-transform:uppercase; letter-spacing:.04em; }

/* Member self-service status check */
.weg-statuscheck{ width:100%; max-width:420px; background:var(--weg-surface); border:1px solid var(--weg-line); border-radius:14px; padding:1.4rem; display:flex; flex-direction:column; gap:.6rem; }
.weg-statuscheck label{ font-size:.85rem; color:var(--weg-muted); display:flex; flex-direction:column; gap:.3rem; }
.weg-statuscheck input{ padding:.75rem .8rem; border-radius:8px; border:1px solid var(--weg-line); background:#0f0f11; color:var(--weg-white); font-size:16px; }
.weg-statuscheck .weg-join{ margin-top:.6rem; }
.weg-sc-result{ margin-top:.4rem; font-size:.9rem; color:var(--weg-gold); min-height:1.2em; }

/* ---------- RESPONSIVE ----------
   The layout is fluid by default (clamp + auto-fill grids). These breakpoints
   handle the cases fluid sizing alone gets wrong on real devices. */

/* Never allow sideways scrolling on any screen. */
/* No overflow-x guard on html/body deliberately. Setting overflow-x there turns the
   root into a scroll container, which makes window.scrollY report 0 and breaks scroll
   restoration. Sideways overflow is prevented at source instead (border-box sizing,
   min() grid tracks, wrapping pills), verified in-browser from 320px to 1440px.
   Only the hero clips, because its decorative shard intentionally extends past the edge. */
html, body{ max-width:100%; }
img, svg, video, iframe{ max-width:100%; height:auto; }
.weg-prose table{ display:block; width:100%; overflow-x:auto; }
.weg-card__name, .weg-hero__title, .weg-cta h2{ overflow-wrap:break-word; }
/* Long unbroken strings (URLs, pasted references) must not push the layout wide. */
.weg-prose, .weg-prose p, .weg-prose li, .weg-prose a, .weg-card__desc, .weg-sc-result, .weg-modal__msg{
  overflow-wrap:anywhere; word-break:break-word;
}
.wp-block-embed, .wp-block-embed iframe{ max-width:100%; }

/* Tablet and below (<= 1024px) */
@media (max-width: 1024px){
  .weg-hero{ padding-left:1.5rem; padding-right:1.5rem; }
  .weg-hero__title{ max-width:20ch; }
}

/* Large phone / small tablet (<= 782px, matches the WP admin bar breakpoint) */
@media (max-width: 782px){
  .weg-hero::after{ opacity:.6; }            /* red shard softened so text stays legible */
  .weg-hero__sub{ font-size:1.05rem; max-width:100%; }
  .weg-btn{ display:block; width:100%; text-align:center; }  /* full-width primary CTA */
  .weg-section__flag{ font-size:1.05rem; padding:.5rem 1rem; }
  .weg-cat__title span{ display:inline-block; }
  .weg-features{ grid-template-columns:repeat(2,1fr); }
}

/* Phone (<= 480px) */
@media (max-width: 480px){
  .weg-hero{ padding-top:2.75rem; padding-bottom:2.75rem; }
  .weg-hero__title{ font-size:clamp(2.1rem,1.2rem+5.5vw,3rem); max-width:100%; }
  .weg-hero__eyebrow{ font-size:.72rem; letter-spacing:.16em; }
  .weg-card{ padding:1.25rem 1.1rem 1.15rem; }
  .weg-pill--price{ font-size:.95rem; }
  .weg-modal__card{ padding:1.25rem 1.1rem; border-radius:14px; }
  .weg-modal{ padding:.5rem; }
}

/* Very small phones (<= 360px): keep the feature strip readable rather than cramped */
@media (max-width: 360px){
  .weg-features{ grid-template-columns:1fr; }
  .weg-section{ padding-left:1rem; padding-right:1rem; }
}

/* Short screens (phones in landscape): the modal must still scroll to the Pay button */
@media (max-height: 560px){
  .weg-modal{ align-items:flex-start; }
  .weg-modal__card{ max-height:calc(100dvh - 1rem); }
}

/* Header: stack the nav + Join button cleanly on small screens */
@media (max-width: 600px){
  .weg-header{ gap:.5rem; }
  .weg-header .wp-block-site-logo img{ max-width:130px; height:auto; }
}

/* Comfortable tap targets everywhere on touch devices */
@media (pointer: coarse){
  .weg-join, .weg-btn, .weg-modal__pay, .weg-sc-btn{ min-height:48px; }
}

/* Print: members sometimes print a receipt/confirmation page */
@media print{
  .weg-modal, .weg-hero::after{ display:none !important; }
  body{ background:#fff; color:#000; }
  .weg-card{ border:1px solid #999; break-inside:avoid; }
}

/* Style WordPress core's own block-theme skip link to match the brand. */
.skip-link.screen-reader-text:focus{ background:var(--weg-gold); color:#141416; border-radius:8px; padding:.7rem 1.1rem; font-weight:700; text-decoration:none; z-index:100000; }

/* Background scroll lock while the checkout is open (prevents the page sliding
   behind the modal on phones). */
body.weg-modal-open{ position:fixed; width:100%; overflow:hidden; }

/* ---------- GYM PAGE SECTIONS (patterns) ---------- */

/* Opening hours */
.weg-hours{ max-width:620px; border:1px solid var(--weg-line); border-radius:14px; overflow:hidden; }
.weg-hours__row{ display:flex; justify-content:space-between; gap:1rem; align-items:center;
  padding:.95rem 1.2rem; border-bottom:1px solid var(--weg-line); background:var(--weg-surface); }
.weg-hours__row:last-child{ border-bottom:0; }
.weg-hours__row span{ color:var(--weg-muted); }
.weg-hours__row b{ font-family:Oswald,sans-serif; letter-spacing:.02em; }

/* Trainers */
.weg-team{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr)); gap:1.1rem; }
.weg-trainer{ background:var(--weg-surface); border:1px solid var(--weg-line); border-radius:16px; padding:1.3rem; }
.weg-trainer__photo{ aspect-ratio:4/3; border-radius:12px; margin-bottom:1rem;
  background:linear-gradient(135deg,#1d1d21,#121214); border:1px dashed var(--weg-line); }
.weg-trainer__name{ font-family:Oswald,sans-serif; text-transform:uppercase; font-size:1.15rem; margin:0 0 .2rem; }
.weg-trainer__role{ display:inline-block; color:var(--weg-gold); font-size:.82rem;
  text-transform:uppercase; letter-spacing:.06em; margin-bottom:.6rem; }
.weg-trainer__bio{ color:var(--weg-muted); font-size:.92rem; margin:0; }

/* Testimonials */
.weg-quotes{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr)); gap:1.1rem; }
.weg-quote{ margin:0; background:var(--weg-surface); border:1px solid var(--weg-line);
  border-left:4px solid var(--weg-gold); border-radius:14px; padding:1.4rem; }
.weg-quote blockquote{ margin:0; }
.weg-quote p{ margin:0 0 .9rem; font-size:1.02rem; }
.weg-quote figcaption{ color:var(--weg-gold); font-family:Oswald,sans-serif;
  text-transform:uppercase; letter-spacing:.05em; font-size:.82rem; }

/* FAQ */
.weg-faq{ max-width:760px; }
.weg-faq__item{ border:1px solid var(--weg-line); border-radius:12px; background:var(--weg-surface);
  margin-bottom:.7rem; padding:0 1.2rem; }
.weg-faq__item summary{ cursor:pointer; list-style:none; padding:1.05rem 0;
  font-family:Oswald,sans-serif; text-transform:uppercase; letter-spacing:.02em;
  font-size:1rem; display:flex; justify-content:space-between; align-items:center; gap:1rem; min-height:48px; }
.weg-faq__item summary::-webkit-details-marker{ display:none; }
.weg-faq__item summary::after{ content:"+"; color:var(--weg-gold); font-size:1.5rem; line-height:1; flex:0 0 auto; }
.weg-faq__item[open] summary::after{ content:"\2212"; }
.weg-faq__item p{ margin:0 0 1.1rem; color:var(--weg-muted); }

/* Contact */
.weg-contact{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr)); gap:1.1rem; }
.weg-contact__block{ background:var(--weg-surface); border:1px solid var(--weg-line); border-radius:14px; padding:1.4rem; }
.weg-contact__block h3{ font-family:Oswald,sans-serif; text-transform:uppercase; font-size:1rem;
  letter-spacing:.05em; color:var(--weg-gold); margin:0 0 .6rem; }
.weg-contact__block p{ margin:0 0 .6rem; color:var(--weg-muted); }
.weg-contact__block a{ color:var(--weg-white); }
.weg-contact__block a:hover{ color:var(--weg-gold); }