/* ==========================================================================
   Indian Bonesetting — site-wide design system (Claude, 2026-09-19)
   Extends the course page's visual language (#ib-course) to the whole site.
   Additive layer: does not fight the existing Additional CSS.
   ========================================================================== */

:root{
  --ib-teal:#236b75;
  --ib-teal-dark:#184d55;
  --ib-cta:#e07a3f;
  --ib-cta-dark:#c9652d;
  --ib-ink:#2b2b2b;
  --ib-muted:#5d6b6e;
  --ib-line:#e4e9ea;
  --ib-soft:#f4f7f7;
  --ib-white:#fff;
  --ib-serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --ib-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --ib-shadow:0 1px 3px rgba(24,77,85,.06),0 6px 20px rgba(24,77,85,.06);
  --ib-shadow-lg:0 2px 6px rgba(24,77,85,.10),0 12px 34px rgba(24,77,85,.10);
  --ib-radius:14px;
  --ib-measure:720px;
}

/* ---------- 1. Typography ------------------------------------------------ */
/* The Fonts Plugin used to force "Libre Baskerville" !important across
   body/#content/.entry-content, which meant every rule here needed !important
   to win. That was fixed at source on 2026-09-19 by clearing its body, headings
   and inputs font settings in the Customizer, so these rules are now plain. */
body,
.entry-content,
.entry-content p,
.entry-content li,
.widget,
#site-footer,
.woocommerce,
input,textarea,select,button{
  font-family:var(--ib-sans);
  color:var(--ib-ink);
  -webkit-font-smoothing:antialiased;
}
body{font-size:17px; line-height:1.65;}
.entry-content p,
.entry-content li{font-size:18px; line-height:1.7;}

/* font-family keeps !important here: a bare h2 selector loses to the theme's
   own .entry-content h2 rule (verified — H2s fell back to Inter without it).
   H1 wins on its own via .entry-title, but the shared rule needs the flag. */
h1,h2,h3,h4,h5,h6,
.entry-title,.archive-title,.widget-title,
.woocommerce-loop-product__title,.product_title{
  font-family:var(--ib-serif) !important;
  color:var(--ib-teal);
  font-weight:600;
  line-height:1.2;
  letter-spacing:-.005em;
}

/* Modular scale — replaces the 64px black slab */
.singular .entry-title,.archive-title{font-size:clamp(32px,4.2vw,44px); margin:0 0 .5em;}
.entry-content h2{font-size:clamp(24px,3vw,31px); margin:2.2em 0 .6em;}
.entry-content h3{font-size:clamp(19px,2.2vw,22px);  margin:1.8em 0 .5em;}
.entry-content h4{font-size:18px; margin:1.6em 0 .4em;}
.entry-content p{margin:0 0 1.15em;}
.entry-content strong{color:var(--ib-teal-dark);}

/* Readable measure: ~70 characters for PROSE (articles, legal, guides).
   Deliberately NOT applied to the homepage — a landing page needs its
   full-width sections to breathe, and squeezing them to article width
   makes the sales page look thin. */
.single .entry-content > *:not(.alignwide):not(.alignfull):not(.wp-block-group),
body.page:not(.home):not(.page-id-589):not(.woocommerce-page) .entry-content > *:not(.alignwide):not(.alignfull):not(.wp-block-group){
  max-width:var(--ib-measure);
  margin-left:auto; margin-right:auto;
}
.single .entry-header .entry-header-inner,
body.page:not(.home):not(.page-id-589) .entry-header .entry-header-inner{max-width:var(--ib-measure);}

/* Landing page: bigger section headings, wider rhythm */
.home .entry-content h2{font-size:clamp(30px,3.4vw,39px); margin:1.9em 0 .6em;}
.home .entry-content h3{font-size:clamp(20px,2.4vw,24px);}
.home .entry-content > .wp-block-group{padding-top:8px; padding-bottom:8px;}

/* ---------- 2. Links ----------------------------------------------------- */
.entry-content a:not(.wp-block-button__link):not(.button){
  color:var(--ib-cta);
  text-decoration:none;
  border-bottom:1px solid rgba(224,122,63,.35);
  transition:border-color .15s ease,color .15s ease;
}
.entry-content a:not(.wp-block-button__link):not(.button):hover{
  color:var(--ib-cta-dark);
  border-bottom-color:var(--ib-cta-dark);
}
:focus-visible{outline:3px solid var(--ib-cta); outline-offset:2px; border-radius:4px;}

/* ---------- 3. Buttons --------------------------------------------------- */
.wp-block-button__link,
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.wc-block-components-button,
input[type=submit],.wpforms-submit{
  background-color:var(--ib-cta) !important;
  border:1px solid var(--ib-cta) !important;
  color:#fff !important;
  font-family:var(--ib-sans) !important;
  font-weight:600 !important;
  font-size:16px !important;
  letter-spacing:.01em;
  border-radius:8px !important;
  padding:13px 30px !important;
  box-shadow:0 4px 14px rgba(224,122,63,.28);
  transition:background-color .15s ease,transform .08s ease,box-shadow .15s ease;
}
.wp-block-button__link:hover,
.woocommerce a.button:hover,.woocommerce button.button:hover,
.woocommerce input.button:hover,.wc-block-components-button:hover,
input[type=submit]:hover,.wpforms-submit:hover{
  background-color:var(--ib-cta-dark) !important;
  border-color:var(--ib-cta-dark) !important;
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(224,122,63,.34);
}
.wp-block-button.is-style-outline .wp-block-button__link{
  background:transparent !important; color:var(--ib-teal) !important;
  border:1.5px solid var(--ib-teal) !important; box-shadow:none;
}

/* ---------- 4. Editorial furniture --------------------------------------- */
.entry-content blockquote{
  border-left:3px solid var(--ib-cta);
  background:var(--ib-soft);
  margin:2em auto; padding:20px 26px;
  border-radius:0 10px 10px 0;
  font-style:normal; color:var(--ib-teal-dark);
}
.entry-content blockquote p:last-child{margin-bottom:0;}
.entry-content ul,.entry-content ol{margin:0 auto 1.3em; padding-left:1.35em;}
.entry-content li{margin:.35em 0;}
.entry-content li::marker{color:var(--ib-cta);}
.entry-content hr,.wp-block-separator{
  border:0; height:1px; background:var(--ib-line); max-width:var(--ib-measure); margin:2.6em auto;
}
.entry-content img,.wp-block-image img{border-radius:10px;}
.entry-content figcaption,.wp-block-image figcaption{
  color:var(--ib-muted); font-size:14px; text-align:center; margin-top:.6em;
}
.entry-content table{
  width:100%; border-collapse:collapse; font-size:15px; margin:1.8em auto;
}
.entry-content th,.entry-content td{
  border:1px solid var(--ib-line); padding:10px 14px; text-align:left;
}
.entry-content th{background:var(--ib-soft); color:var(--ib-teal-dark); font-weight:600;}

/* Category eyebrow above article titles */
.post .entry-categories,.post .entry-categories a{
  font-family:var(--ib-sans); font-size:12px; font-weight:700;
  letter-spacing:.09em; text-transform:uppercase;
  color:var(--ib-muted); border:0;
}
.post-meta,.entry-meta,.post-meta-wrapper{
  font-family:var(--ib-sans); font-size:14px; color:var(--ib-muted);
}

/* ---------- 5. Header & navigation --------------------------------------- */
#site-header{border-bottom:1px solid var(--ib-line); background:var(--ib-white);}
.primary-menu > li > a{
  font-family:var(--ib-sans) !important; font-size:15px; font-weight:600;
  color:var(--ib-teal) !important; letter-spacing:.01em;
}
.primary-menu > li > a:hover{color:var(--ib-cta) !important;}
.primary-menu > li.current-menu-item > a{
  color:var(--ib-cta) !important; box-shadow:inset 0 -2px 0 var(--ib-cta);
}

/* ---------- 6. Footer ---------------------------------------------------- */
#site-footer{
  background:var(--ib-teal-dark) !important; color:rgba(255,255,255,.82) !important;
  font-size:15px; border-top:0;
}
#site-footer a,.footer-menu a,.footer-widgets a{color:#fff !important; border:0;}
#site-footer a:hover{color:var(--ib-cta) !important;}
#site-footer h2,#site-footer h3,#site-footer .widget-title{color:#fff !important;}

/* ---------- 7. Cards / groups -------------------------------------------- */
.entry-content .wp-block-group.has-white-background-color,
.ib-card{
  background:var(--ib-white); border:1px solid var(--ib-line);
  border-radius:var(--ib-radius); box-shadow:var(--ib-shadow);
  padding:28px 32px;
}

/* ---------- 8. WooCommerce ------------------------------------------------ */
.woocommerce ul.products li.product{
  background:var(--ib-white); border:1px solid var(--ib-line);
  border-radius:var(--ib-radius); box-shadow:var(--ib-shadow);
  padding:18px; transition:box-shadow .18s ease,transform .18s ease;
}
.woocommerce ul.products li.product:hover{box-shadow:var(--ib-shadow-lg); transform:translateY(-2px);}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:18px; margin:.6em 0 .3em;}
.woocommerce .price,.woocommerce div.product p.price,.woocommerce div.product span.price{
  color:var(--ib-teal-dark) !important; font-family:var(--ib-sans); font-weight:700; font-size:22px;
}
/* The theme renders the product H1 at 20px while its own H2 is 30px —
   an inverted hierarchy. Restore the title as the dominant element. */
.woocommerce div.product .product_title,
.product_title.entry-title,
.woocommerce .product_title{
  font-size:clamp(30px,3.4vw,37px) !important;
  margin:0 0 .3em !important;
  line-height:1.15;
}
.woocommerce div.product .woocommerce-tabs h2,
.woocommerce div.product .summary h2{font-size:22px !important;}
.woocommerce-tabs ul.tabs li{border-radius:8px 8px 0 0 !important; border-color:var(--ib-line) !important;}
.woocommerce-tabs ul.tabs li a{font-family:var(--ib-sans) !important; font-weight:600 !important; color:var(--ib-teal) !important;}
.woocommerce-message,.woocommerce-info,.woocommerce-error{
  border-top-color:var(--ib-teal) !important; background:var(--ib-soft);
  border-radius:8px; font-family:var(--ib-sans);
}
.woocommerce-message::before,.woocommerce-info::before{color:var(--ib-teal) !important;}

/* Account / checkout forms */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page input[type=text],.woocommerce-page input[type=email],
.woocommerce-page input[type=password],.woocommerce-page input[type=tel]{
  border:1px solid var(--ib-line) !important; border-radius:8px !important;
  padding:11px 13px !important; font-family:var(--ib-sans) !important; font-size:16px !important;
  background:#fff; transition:border-color .15s ease,box-shadow .15s ease;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce-page input:focus,.woocommerce form .form-row select:focus{
  border-color:var(--ib-teal) !important; box-shadow:0 0 0 3px rgba(35,107,117,.12) !important; outline:none;
}
.woocommerce form .form-row label{
  font-family:var(--ib-sans); font-size:14px; font-weight:600; color:var(--ib-teal-dark);
}
.woocommerce-MyAccount-navigation ul{list-style:none; margin:0; padding:0;}
.woocommerce-MyAccount-navigation li{border-bottom:1px solid var(--ib-line);}
.woocommerce-MyAccount-navigation li a{
  display:block; padding:11px 4px; font-family:var(--ib-sans);
  font-weight:600; color:var(--ib-teal); border:0;
}
.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation li a:hover{color:var(--ib-cta);}

/* ---------- 9. Chrome / floating widgets --------------------------------- */
/* The site-wide slider belongs on the homepage, not on every article */
body:not(.home) #n2-ss-2,
body:not(.home) .featured-media{display:none !important;}

/* Currency switcher: dock it discreetly instead of floating over the text */
.woo-multi-currency.wmc-sidebar{
  top:auto !important; bottom:20px !important;
  box-shadow:var(--ib-shadow) !important; border-radius:8px !important; overflow:hidden;
}
.woo-multi-currency .wmc-currency{font-family:var(--ib-sans) !important; font-size:12px !important;}

/* ---------- 10. Responsive ----------------------------------------------- */
@media (max-width:782px){
  body{font-size:16px;}
  .singular .entry-title,.archive-title{font-size:28px;}
  .entry-content h2{font-size:22px;}
  .entry-content{padding-bottom:72px;}
  .wp-block-button__link,.woocommerce a.button,.woocommerce button.button{
    padding:12px 22px !important; font-size:15px !important;
  }
}

/* ---------- 11. Course page scale correction -----------------------------
   The site sets html{font-size:62.5%} (root = 10px), so every rem on page 589
   rendered at 62.5% of its intended size: module headings at 7.2px instead of
   11.5px, the hero H1 at 22px instead of 35px. These restore the course page to
   the scale it was designed at. !important is required because the page's own
   <style> block sits in the body and would otherwise win the cascade.
   -------------------------------------------------------------------------- */
#ib-course .ib-pb-title{font-size:18px !important;}
#ib-course .ib-pb-label{font-size:13px !important;}
#ib-course .ib-hero h1{font-size:35px !important;}
#ib-course .ib-hero p{font-size:18px !important;}
#ib-course .ib-toc-title{font-size:12px !important;}
#ib-course .ib-module h3{font-size:12px !important;}
#ib-course .ib-navlist a{font-size:14px !important;}
#ib-course .kicker{font-size:12px !important;}
#ib-course .lesson h2{font-size:27px !important;}
#ib-course .lesson h3{font-size:18px !important;}
#ib-course .lead{font-size:17px !important;}
#ib-course figcaption{font-size:14px !important;}
#ib-course .complete-btn{font-size:15px !important;}
#ib-course .mini-card h4{font-size:17px !important;}
#ib-course .mini-card p{font-size:15px !important;}
#ib-course .flow-num{font-size:22px !important;}
#ib-course .flow-step h4{font-size:16px !important;}
#ib-course .flow-step p{font-size:14px !important;}
#ib-course .tech-card .tech-name{font-size:15px !important;}
#ib-course .stepper li::before{font-size:15px !important;}
#ib-course .video-note{font-size:14px !important;}
#ib-course .name-field label{font-size:14px !important;}
#ib-course .name-field input{font-size:16px !important;}
#ib-course .certificate .cert-kicker{font-size:13px !important;}
#ib-course .certificate h2{font-size:32px !important;}
#ib-course .certificate .cert-name{font-size:30px !important;}
#ib-course .certificate .cert-course{font-size:18px !important;}
#ib-course .cert-footer .sig .line{font-size:14px !important;}
#ib-course .cert-footer .sig strong{font-size:16px !important;}
#ib-course .print-btn{font-size:15px !important;}
#ib-course .ib-footer{font-size:14px !important;}

/* ---------- 12. Product page: short description --------------------------
   Paired with the semantic markup in product 345's short description.
   The .woocommerce-product-details__short-description selectors are needed
   because that block sits outside .entry-content, so section 1 misses it
   and the Fonts Plugin's Libre Baskerville still wins there. */
.woocommerce-product-details__short-description,
.woocommerce-product-details__short-description p,
.woocommerce-product-details__short-description li,
.ib-prod,.ib-prod p,.ib-prod li{
  font-family:var(--ib-sans) !important;
  font-style:normal !important;
}
.ib-prod .ib-prod-lead{
  font-size:18px; line-height:1.6; color:var(--ib-muted); margin:0 0 20px;
}
.ib-prod .ib-prod-list{list-style:none; margin:0 0 22px; padding:0;}
.ib-prod .ib-prod-list li{
  position:relative; padding-left:32px; margin:0 0 13px;
  font-size:16px; line-height:1.6; color:var(--ib-ink);
}
.ib-prod .ib-prod-list li::before{
  content:"\2713";
  position:absolute; left:0; top:1px;
  width:21px; height:21px; line-height:21px; text-align:center;
  border-radius:50%; background:var(--ib-soft); color:var(--ib-teal);
  font-size:12px; font-weight:700;
}
.ib-prod .ib-prod-list li strong{color:var(--ib-teal-dark);}
.ib-prod .ib-prod-access{
  background:var(--ib-soft);
  border:1px solid var(--ib-line); border-left:3px solid var(--ib-cta);
  border-radius:0 10px 10px 0;
  padding:16px 20px; margin:0;
  font-size:15px; line-height:1.6; color:var(--ib-ink);
}
.ib-prod .ib-prod-access strong{color:var(--ib-teal-dark);}

/* ---------- 13. Homepage (landing) ---------------------------------------
   The enrol section uses [product_page id="345"], which embeds the ENTIRE
   product page — including a second <h1> ("Online Bonesetting Course") and a
   duplicate copy of the long description. The section already carries its own
   H2 ("Enroll for the online course"), so the embedded title is redundant and
   the duplicate H1 is an SEO problem. Hide both; keep image, price, buttons. */
/* PRE-EXISTING BUG (not introduced here): the site's Customizer rule
   `.home .entry-title{display:none}` also matches the embedded product title,
   because WooCommerce gives it BOTH classes: "product_title entry-title".
   Result: the homepage has been rendering with ZERO visible H1s. Restore this
   one as the homepage's H1 — "Online Bonesetting Course" is the right H1 for a
   course sales page — while the theme's "Reset your body" stays hidden. */
.home .woocommerce div.product .product_title{
  display:block !important;
  font-size:24px !important;
  margin:0 0 .35em !important;
  color:var(--ib-teal);
}

/* Section rhythm between landing sections */
.home .ib-landing > h2{margin-top:2.4em;}
.home .ib-landing > h2:first-child{margin-top:0;}

/* FAQ accordion */
.home details{
  border:1px solid var(--ib-line); border-radius:10px;
  padding:14px 18px; margin:0 0 10px; background:var(--ib-white);
  transition:box-shadow .15s ease;
}
.home details[open]{box-shadow:var(--ib-shadow);}
.home summary{
  cursor:pointer; font-weight:600; color:var(--ib-teal-dark);
  font-family:var(--ib-sans) !important; font-size:16px;
  list-style:none; position:relative; padding-right:26px;
}
.home summary::-webkit-details-marker{display:none;}
.home summary::after{
  content:"+"; position:absolute; right:0; top:-1px;
  color:var(--ib-cta); font-weight:700; font-size:19px; line-height:1;
}
.home details[open] summary::after{content:"\2212";}
.home details p{margin-top:12px; font-size:16px; color:var(--ib-muted);}

/* ---------- 14. Guides index --------------------------------------------
   /guides/ renders a core Latest Posts block: bare links plus excerpt text
   with no separation, so 15 guides read as one wall. Give each entry a card. */
.wp-block-latest-posts__list{
  list-style:none !important; margin:30px auto !important; padding:0 !important;
  display:grid; gap:14px;
}
.wp-block-latest-posts__list li{
  background:var(--ib-white); border:1px solid var(--ib-line);
  border-radius:12px; padding:20px 24px; margin:0 !important;
  transition:box-shadow .18s ease,transform .18s ease,border-color .18s ease;
}
.wp-block-latest-posts__list li:hover{
  box-shadow:var(--ib-shadow); transform:translateY(-2px); border-color:#cfdcde;
}
.wp-block-latest-posts__post-title{
  display:block; font-family:var(--ib-serif) !important;
  font-size:19px !important; font-weight:600;
  color:var(--ib-teal) !important; border:0 !important; margin:0 0 7px;
}
.wp-block-latest-posts__list li:hover .wp-block-latest-posts__post-title{
  color:var(--ib-cta) !important;
}
.wp-block-latest-posts__post-excerpt{
  font-size:15px !important; line-height:1.6 !important;
  color:var(--ib-muted) !important; margin:0 !important;
}

/* ---------- 15. Legal pages ---------------------------------------------
   Terms / Privacy / Refund are long prose. Section 1 already gives them the
   readable measure; these add scannability so they do not read as a wall. */
.page-id-314 .entry-content h2,
.page-id-198 .entry-content h2,
.page-id-461 .entry-content h2{
  font-size:21px !important; margin:2em 0 .5em;
  padding-bottom:7px; border-bottom:1px solid var(--ib-line);
}
.page-id-314 .entry-content p,
.page-id-198 .entry-content p,
.page-id-461 .entry-content p{font-size:16px !important; line-height:1.72;}

/* ---------- 16. Guide article CTA ----------------------------------------
   Styles the card appended by the "Guide article CTA" PHP snippet. The
   !important flags override section 1's .entry-content h2/p/a rules, which
   would otherwise impose article margins and an underline on the button. */
.ib-guide-cta{
  max-width:720px; margin:48px auto 8px; padding:32px 36px;
  background:var(--ib-soft); border:1px solid var(--ib-line);
  border-radius:14px; text-align:center;
}
.ib-guide-cta-kicker{
  font-family:var(--ib-sans); font-size:12px !important; font-weight:700;
  letter-spacing:.11em; text-transform:uppercase; color:var(--ib-muted);
  margin:0 0 10px !important;
}
.ib-guide-cta-title{
  font-family:var(--ib-serif) !important; color:var(--ib-teal);
  font-size:26px !important; margin:0 0 12px !important; line-height:1.2;
}
.ib-guide-cta-text{
  font-size:16px !important; line-height:1.65; color:var(--ib-muted);
  margin:0 auto 22px !important; max-width:52ch;
}
.ib-guide-cta-actions{margin:0 !important;}
.ib-guide-cta-btn{
  display:inline-block; padding:13px 32px;
  background:var(--ib-cta); color:#fff !important;
  border-radius:8px; text-decoration:none; border:0 !important;
  font-family:var(--ib-sans); font-weight:600; font-size:16px;
  box-shadow:0 4px 14px rgba(224,122,63,.28);
  transition:background-color .15s ease,transform .08s ease;
}
.ib-guide-cta-btn:hover{
  background:var(--ib-cta-dark); color:#fff !important; transform:translateY(-1px);
}
