/*
Theme Name: iWasGonna
Theme URI: https://www.iwasgonna.com
Author: iWasGonna
Description: Lean block theme for the iWasGonna site. Built from Site Design Spec v2. Palette, fonts, type scale and buttons live in theme.json. Section patterns live under Patterns > iWasGonna Sections.
Version: 0.1.11
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: iwg
*/

/* ---- base ---- */
.wp-site-blocks>*{margin-block-start:0}
body{-webkit-font-smoothing:antialiased}
a:focus-visible,.wp-block-button__link:focus-visible{outline:3px solid #FFB199;outline-offset:3px}

/* ---- header ---- */
.iwg-header{background:var(--wp--preset--color--navy);min-height:84px;padding:0 24px;color:#fff}
.iwg-header .wp-block-navigation a{color:#fff;font-size:17px;font-weight:500;text-decoration:none}
.iwg-header .wp-block-navigation a:hover{text-decoration:underline;text-underline-offset:6px}
.iwg-header .wp-block-navigation__responsive-container-open,
.iwg-header .wp-block-navigation__responsive-container-close{color:#fff}
.iwg-header .wp-block-navigation__responsive-container.is-menu-open{background:var(--wp--preset--color--navy);color:#fff}
.iwg-nav-btn .wp-block-button__link{font-size:16px;padding:14px 20px}

/* ---- footer ---- */
.iwg-footer{background:var(--wp--preset--color--footer-navy);color:#fff;padding:48px 24px}
.iwg-footer a{color:#fff;font-size:15px;line-height:1.4;text-decoration:none}
.iwg-footer a:hover{text-decoration:underline}
.iwg-footer p{font-size:15px;color:rgba(255,255,255,.75);margin:0}

/* ---- sections ---- */
.iwg-section{padding:112px 24px}
.iwg-section>*+*{margin-block-start:24px}
.iwg-section>.wp-block-buttons,.iwg-section>.wp-block-columns{margin-block-start:40px}
.iwg-section>.wp-block-columns+.wp-block-columns{margin-block-start:24px}
.iwg-section .wp-block-heading{margin-block-end:0}
.iwg-navy{background:var(--wp--preset--color--navy);color:#fff;border-bottom:3px solid var(--wp--preset--color--orange)}
.iwg-hero,.iwg-cta{background:linear-gradient(160deg,var(--wp--preset--color--navy) 0%,var(--wp--preset--color--navy-lift) 100%);color:#fff;border-bottom:3px solid var(--wp--preset--color--orange)}
.iwg-hero{padding:104px 24px 96px}
.iwg-cta{padding:120px 24px;text-align:center}
.iwg-hero>*+*,.iwg-cta>*+*{margin-block-start:24px}
.iwg-hero .wp-block-buttons,.iwg-cta .wp-block-buttons{margin-block-start:36px}
.iwg-strip{padding:28px 24px;text-align:center;border-bottom:1px solid var(--wp--preset--color--cream-border)}
.iwg-strip p{margin:0;color:var(--wp--preset--color--muted)}
.iwg-cream{background:var(--wp--preset--color--cream)}
.iwg-white{background:#fff}
.iwg-hero .iwg-sub{max-width:620px}
.iwg-lead{max-width:720px}
.iwg-navy h1,.iwg-navy h2,.iwg-navy h3,.iwg-hero h1,.iwg-cta h2{color:#fff}
.iwg-eyebrow{text-transform:uppercase;letter-spacing:.12em;font-weight:700;color:var(--wp--preset--color--orange-on-light);margin:0}
.iwg-navy .iwg-eyebrow,.iwg-hero .iwg-eyebrow,.iwg-cta .iwg-eyebrow{color:var(--wp--preset--color--orange)}

/* ---- buttons (default = primary orange, set in theme.json) ---- */
.wp-block-button__link{transition:filter .15s,background .15s,border-color .15s}
.wp-block-button__link:hover{filter:brightness(.92)}
.wp-block-button.is-style-iwg-navy .wp-block-button__link{background:var(--wp--preset--color--navy);color:#fff;font-size:17px;padding:16px 22px}
.wp-block-button.is-style-iwg-navy .wp-block-button__link:hover{background:var(--wp--preset--color--navy-card);filter:none}
.wp-block-button.is-style-iwg-ghost .wp-block-button__link{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.4)}
.wp-block-button.is-style-iwg-ghost .wp-block-button__link:hover{border-color:#fff;filter:none}
.wp-block-button.is-style-iwg-ghost-dark .wp-block-button__link{background:transparent;color:var(--wp--preset--color--navy);border:2px solid var(--wp--preset--color--navy)}
.wp-block-button.is-style-iwg-ghost-dark .wp-block-button__link:hover{filter:none;background:rgba(11,29,58,.06)}
.iwg-cta .wp-block-buttons{justify-content:center}

/* ---- icon badge ---- */
.iwg-badge{flex:none;width:56px;height:56px;border-radius:50%;border:2px solid var(--wp--preset--color--orange);background:rgba(224,72,35,.10);color:var(--wp--preset--color--orange);display:flex;align-items:center;justify-content:center}
.iwg-badge svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---- cards ---- */
.iwg-card{border-radius:20px;padding:32px;height:100%;box-sizing:border-box}
.iwg-card>*+*{margin-block-start:16px}
.iwg-card.on-navy{background:var(--wp--preset--color--navy-card);color:#fff}
.iwg-card.on-navy h3{color:#fff}
.iwg-card.on-light{background:#fff;border:1px solid var(--wp--preset--color--cream-border)}

/* ---- routing rows ---- */
.iwg-rows{border-top:2px solid var(--wp--preset--color--navy)}
.iwg-row{border-bottom:1px solid var(--wp--preset--color--rule);padding:28px 0;gap:24px}
.iwg-row .iwg-row-text{flex:1 1 320px}
.iwg-row .iwg-row-text>*+*{margin-block-start:8px}

/* ---- mobile ---- */
@media (max-width:640px){
  .iwg-section{padding:56px 20px}
  .iwg-hero{padding:48px 20px}
  .iwg-cta{padding:56px 20px}
  .iwg-header{min-height:64px;padding:0 20px}
  .iwg-badge{width:48px;height:48px}
  .iwg-badge svg{width:24px;height:24px}
  .wp-block-buttons{flex-direction:column;gap:12px}
  .wp-block-buttons .wp-block-button,.wp-block-buttons .wp-block-button__link{width:100%;text-align:center;box-sizing:border-box}
  .iwg-nav-btn{display:none}
  .iwg-row{flex-direction:column;align-items:flex-start}
}

/* ================= Side Hustle member shell (v0.1.3) =================
   Shared member look: white header, light blue-grey page, white cards.
   Used by templates "Side Hustle Member", "... with Maverick rail", "... Sign-in".
   Dashboard panels are NOT part of the shell; pages build their own layout. */
.sh-header,.sh-footer,.sh-main,.sh-rail{--sh-bg:var(--wp--preset--color--sh-bg);--sh-line:var(--wp--preset--color--sh-line);--sh-navy:var(--wp--preset--color--navy)}
.sh-header{background:#fff;border-bottom:1px solid var(--sh-line);min-height:72px;padding:0 24px;gap:24px;position:sticky;top:0;z-index:40}
.sh-brand{font-family:'Inter Tight',sans-serif;font-weight:800;font-size:28px;line-height:1;letter-spacing:-.03em;text-decoration:none;white-space:nowrap}
.sh-brand-iwg{color:var(--sh-navy)}
.sh-brand-sh{color:var(--wp--preset--color--orange)}
.sh-brand:hover{text-decoration:none}
.sh-link{font-weight:600;color:var(--sh-navy);text-decoration:none}
.sh-link:hover{text-decoration:underline;text-underline-offset:5px}
.sh-nav{flex:1 1 auto}
.sh-nav .wp-block-navigation-item__content{position:relative;display:block;padding:25px 14px 22px;font-family:'Instrument Sans',sans-serif;font-size:17px;font-weight:600;color:var(--sh-navy);text-decoration:none;border-bottom:3px solid transparent}
.sh-nav .wp-block-navigation-item__content:hover{color:var(--wp--preset--color--orange-on-light)}
.sh-nav .current-menu-item>.wp-block-navigation-item__content,.sh-nav .wp-block-navigation-item__content[aria-current=page]{border-bottom-color:var(--wp--preset--color--orange)}
.sh-nav .wp-block-navigation__responsive-container.is-menu-open{background:#fff;padding:24px}
.sh-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{padding:14px 0;border-bottom:1px solid var(--sh-line)}
/* member menu (shortcode [iwg_member_menu]) */
.sh-user{position:relative}
.sh-user summary{list-style:none;display:flex;align-items:center;gap:10px;cursor:pointer;padding:6px 8px;border-radius:12px}
.sh-user summary::-webkit-details-marker{display:none}
.sh-user summary:hover{background:var(--sh-bg)}
.sh-user summary:focus-visible{outline:3px solid #FFB199;outline-offset:2px}
.sh-avatar img{display:block;width:40px;height:40px;border-radius:50%;object-fit:cover}
.sh-user-name{font-family:'Inter Tight',sans-serif;font-weight:700;font-size:16px;color:var(--sh-navy);line-height:1.1}
.sh-user summary::after{content:"";width:8px;height:8px;border-right:2px solid var(--wp--preset--color--muted);border-bottom:2px solid var(--wp--preset--color--muted);transform:rotate(45deg);margin:-4px 2px 0 2px}
.sh-user[open] summary::after{transform:rotate(-135deg);margin-top:4px}
.sh-user-pop{position:absolute;right:0;top:calc(100% + 8px);min-width:200px;background:#fff;border:1px solid var(--sh-line);border-radius:14px;box-shadow:0 10px 30px rgba(11,29,58,.14);padding:8px;z-index:60}
.sh-user-pop a{display:block;padding:12px 14px;border-radius:10px;font-weight:600;color:var(--sh-navy);text-decoration:none}
.sh-user-pop a:hover{background:var(--sh-bg)}
.sh-login{font-weight:700;color:#fff;background:var(--wp--preset--color--orange);padding:12px 20px;border-radius:10px;text-decoration:none}
/* page area */
.sh-main{background:var(--sh-bg);padding:24px 24px 56px;min-height:60vh}
.sh-wrap{max-width:1400px;margin:0 auto;display:block}
.sh-wrap.sh-has-rail{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
.sh-content>*+*{margin-block-start:24px}
.sh-content h1,.sh-content h2{color:var(--sh-navy)}
/* shared card look any member page can use */
.sh-card{background:#fff;border:1px solid var(--sh-line);border-radius:16px;padding:24px;box-shadow:0 1px 2px rgba(11,29,58,.05),0 6px 18px rgba(11,29,58,.04);box-sizing:border-box}
.sh-card>*+*{margin-block-start:12px}
.sh-card h2,.sh-card h3{margin:0;color:var(--sh-navy)}
.sh-eyebrow{font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--wp--preset--color--orange-on-light);margin:0}
.sh-page-head h1{font-size:clamp(2rem,3.4vw,2.75rem);letter-spacing:-.03em}
.sh-page-head p{color:var(--wp--preset--color--muted);max-width:720px;font-size:19px}
.sh-paths{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.sh-page-head>*+*{margin-block-start:10px}
.sh-path{position:relative;display:flex;flex-direction:column;gap:6px;transition:transform .15s,box-shadow .15s}
.sh-path h3 a{text-decoration:none;color:var(--sh-navy)}
.sh-path h3 a::after{content:"";position:absolute;inset:0;border-radius:16px}
.sh-path h3 a:focus-visible{outline:none}
.sh-path:focus-within{outline:3px solid #FFB199;outline-offset:3px}
.sh-path:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(11,29,58,.10)}
.sh-path h3{font-size:20px}
.sh-path p{margin:0;color:var(--wp--preset--color--muted);font-size:17px}
/* Maverick rail (collapsible, optional template) */
.sh-rail-wrap{position:sticky;top:96px}
.sh-rail{background:#fff;border:1px solid var(--sh-line);border-radius:16px;box-shadow:0 1px 2px rgba(11,29,58,.05),0 6px 18px rgba(11,29,58,.04);overflow:hidden}
.sh-rail-head{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px;cursor:pointer}
.sh-rail-head::-webkit-details-marker{display:none}
.sh-rail-head:focus-visible{outline:3px solid #FFB199;outline-offset:-3px}
.sh-rail-title{display:flex;align-items:center;gap:10px;font-family:'Inter Tight',sans-serif;font-weight:800;font-size:22px;color:var(--sh-navy)}
.sh-rail-title svg{color:var(--wp--preset--color--orange)}
.sh-rail-chev{width:10px;height:10px;border-right:2px solid var(--wp--preset--color--muted);border-bottom:2px solid var(--wp--preset--color--muted);transform:rotate(-135deg);margin-top:4px}
.sh-rail:not([open]) .sh-rail-chev{transform:rotate(45deg);margin-top:-4px}
.sh-rail-body{padding:0 20px 22px;color:var(--wp--preset--color--slate)}
.sh-rail-body>*+*{margin-block-start:10px}
.sh-rail-hello{font-family:'Inter Tight',sans-serif;font-weight:800;font-size:24px;color:var(--sh-navy)}
/* footer */
.sh-footer{background:#fff;border-top:1px solid var(--sh-line);padding:22px 24px;gap:16px}
.sh-footer-copy{font-size:15px;color:var(--wp--preset--color--muted)}
.sh-footer-nav .wp-block-navigation-item__content{font-size:15px;color:var(--wp--preset--color--muted);text-decoration:none}
.sh-footer-nav .wp-block-navigation-item__content:hover{color:var(--sh-navy);text-decoration:underline}
@media (max-width:900px){.sh-paths{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.sh-paths{grid-template-columns:minmax(0,1fr)}}
@media (max-width:1100px){
  .sh-wrap.sh-has-rail{grid-template-columns:minmax(0,1fr)}
  .sh-rail-wrap{position:static;order:2}
}
@media (max-width:640px){
  .sh-header{padding:0 16px;min-height:64px;gap:12px}
  .sh-brand{font-size:22px}
  .sh-user-name{display:none}
  .sh-user summary::after{display:none}
  .sh-main{padding:16px 16px 40px}
  .sh-footer{flex-direction:column;align-items:flex-start}
}

/* ================= v0.1.4 visual upgrade (CSS only, no new JavaScript) =================
   Header alignment, buttons v2, callout styles, card polish, hero atmosphere,
   scroll reveal, FAQ, sticky CTA. Everything motion-related is gated by
   prefers-reduced-motion. The H1 is never faded (protects LCP). */

/* ---- type polish ---- */
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}

/* ---- header: inner row lines up with the 1160px content column ----
   Pure CSS on the existing .iwg-header class, so it also works if the header
   was edited in the Site Editor (as long as the class is kept). */
.iwg-header{padding-inline:max(24px,calc((100% - 1160px)/2))}
@media (max-width:640px){.iwg-header{padding-inline:20px}}

/* ---- constrained-layout fix: narrow text blocks stay on the left edge of the 1160px column ---- */
.iwg-hero .iwg-sub,.iwg-section .iwg-lead{margin-left:max(0px,calc((100% - 1160px)/2))!important;margin-right:auto!important}

/* ---- eyebrow rule ---- */
.iwg-eyebrow::before{content:"";display:inline-block;width:28px;height:2px;margin-right:12px;vertical-align:middle;background:currentColor;opacity:.9}
.iwg-cta .iwg-eyebrow::before{display:none}

/* ---- buttons v2 ---- */
.wp-block-button:not([class*="is-style-iwg-"]):not(.iwg-nav-btn) .wp-block-button__link{box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 8px 18px -8px rgba(224,72,35,.65)}
.wp-block-button.is-style-iwg-navy .wp-block-button__link{box-shadow:0 8px 18px -10px rgba(11,29,58,.7)}
.wp-block-button.is-style-iwg-ghost .wp-block-button__link:hover{background:rgba(255,255,255,.08)}
.wp-block-button__link:active{filter:brightness(.88)}
.wp-block-button__link:focus-visible{outline:3px solid #FFB199;outline-offset:3px}

/* Arrow: add the class iwg-arrow to a button (Advanced > Additional CSS class) */
.iwg-arrow .wp-block-button__link::after{content:"\2192";display:inline-block;margin-left:10px;font-weight:700}

/* Text-link button style: Styles > "Link (underline)" */
.wp-block-button.is-style-iwg-link .wp-block-button__link{background:transparent;color:var(--wp--preset--color--navy);padding:4px 0;border-radius:0;box-shadow:none;font-size:17px;background-image:linear-gradient(currentColor,currentColor);background-repeat:no-repeat;background-position:0 100%;background-size:100% 2px}
.wp-block-button.is-style-iwg-link .wp-block-button__link:hover{filter:none;color:var(--wp--preset--color--orange-on-light)}
.iwg-navy .is-style-iwg-link .wp-block-button__link,.iwg-hero .is-style-iwg-link .wp-block-button__link,.iwg-cta .is-style-iwg-link .wp-block-button__link{color:#fff}
.iwg-navy .is-style-iwg-link .wp-block-button__link:hover,.iwg-hero .is-style-iwg-link .wp-block-button__link:hover,.iwg-cta .is-style-iwg-link .wp-block-button__link:hover{color:#FFB199}

@media (prefers-reduced-motion:no-preference){
  .wp-block-button__link{transition:transform .18s ease,box-shadow .18s ease,filter .15s,background .15s,border-color .15s,color .15s}
  .wp-block-button:not(.iwg-nav-btn) .wp-block-button__link:hover{transform:translateY(-2px)}
  .wp-block-button:not(.iwg-nav-btn) .wp-block-button__link:active{transform:translateY(0)}
  .iwg-arrow .wp-block-button__link::after{transition:transform .18s ease}
  .iwg-arrow .wp-block-button__link:hover::after{transform:translateX(5px)}
  .wp-block-button.is-style-iwg-link .wp-block-button__link{transition:background-size .2s ease,color .15s}
  .wp-block-button.is-style-iwg-link .wp-block-button__link:hover{transform:none;background-size:100% 4px}
}

/* ---- callouts (Group block > Styles) ---- */
.wp-block-group[class*="is-style-iwg-callout"]{position:relative;box-sizing:border-box;padding:28px 32px}
.wp-block-group[class*="is-style-iwg-callout"]::before{display:block;margin-bottom:10px;font-family:'Inter Tight',sans-serif;font-size:.8125rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.wp-block-group[class*="is-style-iwg-callout"]>*+*{margin-block-start:12px}
.wp-block-group[class*="is-style-iwg-callout"] :where(p,h2,h3,h4){max-width:760px}
/* Key point */
.wp-block-group.is-style-iwg-callout{background:var(--wp--preset--color--cream);border-left:6px solid var(--wp--preset--color--orange);border-radius:0 16px 16px 0}
.wp-block-group.is-style-iwg-callout::before{content:"Key point";color:var(--wp--preset--color--orange-on-light)}
/* Honest limit */
.wp-block-group.is-style-iwg-callout-limit{background:#fff;border:2px dashed rgba(11,29,58,.35);border-radius:16px}
.wp-block-group.is-style-iwg-callout-limit::before{content:"Honest limit";color:var(--wp--preset--color--muted)}
/* Decision box */
.wp-block-group.is-style-iwg-callout-decision{background:var(--wp--preset--color--navy);color:#fff;border-radius:16px;border-top:4px solid var(--wp--preset--color--orange)}
.wp-block-group.is-style-iwg-callout-decision::before{content:"Decision box";color:var(--wp--preset--color--orange)}
.wp-block-group.is-style-iwg-callout-decision :where(h2,h3,h4,p,li,a){color:#fff}
/* On navy sections */
.iwg-navy .wp-block-group.is-style-iwg-callout,.iwg-hero .wp-block-group.is-style-iwg-callout{background:rgba(255,255,255,.07);color:#fff}
.iwg-navy .wp-block-group.is-style-iwg-callout::before{color:var(--wp--preset--color--orange)}
.iwg-navy .wp-block-group.is-style-iwg-callout :where(h2,h3,h4,p,li,a){color:#fff}
.iwg-navy .wp-block-group.is-style-iwg-callout-limit{background:transparent;border-color:rgba(255,255,255,.4);color:#fff}
.iwg-navy .wp-block-group.is-style-iwg-callout-limit::before{color:rgba(255,255,255,.75)}
.iwg-navy .wp-block-group.is-style-iwg-callout-limit :where(h2,h3,h4,p,li,a){color:#fff}
.iwg-navy .wp-block-group.is-style-iwg-callout-decision{background:var(--wp--preset--color--navy-card)}

/* ---- cards: accent tab, hover lift, optional step numbers ---- */
.iwg-card{position:relative;overflow:hidden}
.iwg-card::before{content:"";position:absolute;top:0;left:32px;width:48px;height:4px;border-radius:0 0 4px 4px;background:var(--wp--preset--color--orange)}
.iwg-card.on-light{box-shadow:0 1px 2px rgba(11,29,58,.04),0 10px 28px -18px rgba(11,29,58,.25)}
.iwg-card.on-navy{box-shadow:0 12px 30px -20px rgba(0,0,0,.6)}
.iwg-steps{counter-reset:iwgstep}
.iwg-steps .iwg-card{counter-increment:iwgstep}
.iwg-steps .iwg-card::after{content:counter(iwgstep,decimal-leading-zero);position:absolute;top:18px;right:26px;font:800 44px/1 'Inter Tight',sans-serif;letter-spacing:-.03em;color:rgba(224,72,35,.22)}
@media (prefers-reduced-motion:no-preference){
  .iwg-card{transition:transform .22s ease,box-shadow .22s ease}
  .iwg-card::before{transition:width .3s ease}
  .iwg-card:hover{transform:translateY(-4px)}
  .iwg-card:hover::before{width:calc(100% - 64px)}
  .iwg-card.on-light:hover{box-shadow:0 2px 4px rgba(11,29,58,.05),0 22px 40px -20px rgba(11,29,58,.35)}
}

/* ---- hero / CTA / navy atmosphere ----
   .iwg-v24-hero is the class already carried by the existing Custom HTML pages,
   so they pick this up with no page edits. */
.iwg-hero,.iwg-cta,.iwg-v24-hero,div.hero:has(>.in){position:relative;isolation:isolate;overflow:hidden}
.iwg-hero::before,.iwg-cta::before,.iwg-v24-hero::before,div.hero:has(>.in)::before{content:"";position:absolute;inset:-15%;z-index:-1;pointer-events:none;background:radial-gradient(45% 55% at 82% 18%,rgba(224,72,35,.38),transparent 65%),radial-gradient(50% 60% at 8% 105%,rgba(60,110,200,.30),transparent 65%)}
.iwg-hero::after,.iwg-cta::after,.iwg-v24-hero::after,div.hero:has(>.in)::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px) 0 0/56px 56px,linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px) 0 0/56px 56px;-webkit-mask-image:radial-gradient(70% 90% at 80% 20%,#000 0%,transparent 75%);mask-image:radial-gradient(70% 90% at 80% 20%,#000 0%,transparent 75%)}
@media (max-width:640px){
  .iwg-hero::after,.iwg-cta::after,.iwg-v24-hero::after,div.hero:has(>.in)::after{background-size:40px 40px}
}
@media (prefers-reduced-motion:no-preference){
  .iwg-hero::before,.iwg-cta::before,.iwg-v24-hero::before,div.hero:has(>.in)::before{animation:iwgdrift 22s ease-in-out infinite alternate}
  @keyframes iwgdrift{from{transform:translate3d(-2%,-1%,0)}to{transform:translate3d(2%,1.5%,0)}}
  /* Entrance: everything except the H1 (the H1 is the LCP element, never faded) */
  .iwg-hero>:not(h1),.iwg-v24-shell>:not(h1){animation:iwgrise .7s cubic-bezier(.2,.7,.2,1) both}
  .iwg-hero>:nth-child(2),.iwg-v24-shell>:nth-child(2){animation-delay:.05s}
  .iwg-hero>:nth-child(3),.iwg-v24-shell>:nth-child(3){animation-delay:.12s}
  .iwg-hero>:nth-child(4),.iwg-v24-shell>:nth-child(4){animation-delay:.2s}
  @keyframes iwgrise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
}

/* ---- hero right-hand panel (legacy hero pages): reaches the same right edge as the content below ----
   Attaches to the 1160px hero shell (.wrap or .iwg-v24-shell inside .iwg-v24-hero). Decorative only, hidden under 1000px. */
:is(.iwg-v24-hero :is(.wrap,.iwg-v24-shell),div.hero>.in){position:relative}
@media (min-width:1180px){
  :is(.iwg-v24-hero :is(.wrap,.iwg-v24-shell),div.hero>.in)::after{content:"";position:absolute;z-index:-1;right:0;top:50%;transform:translateY(-50%);width:min(340px,30%);aspect-ratio:400/360;border-radius:24px;border:1px solid rgba(255,255,255,.14);background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 400 360%22 fill=%22none%22%3E%3Cg stroke=%22%23fff%22 stroke-opacity=%22.22%22 stroke-width=%221.5%22%3E%3Cpath d=%22M200 180L70 70M200 180L330 60M200 180L60 270M200 180L342 282M200 180L200 322M200 180L200 40%22/%3E%3C/g%3E%3Cg stroke=%22%23fff%22 stroke-opacity=%22.1%22 stroke-width=%221%22%3E%3Cpath d=%22M70 70L200 40L330 60L342 282L200 322L60 270Z%22/%3E%3C/g%3E%3Ccircle cx=%22200%22 cy=%22180%22 r=%2230%22 stroke=%22%23E04823%22 stroke-opacity=%22.45%22 stroke-width=%221.5%22/%3E%3Ccircle cx=%22200%22 cy=%22180%22 r=%2214%22 fill=%22%23E04823%22/%3E%3Cg fill=%22%23fff%22 fill-opacity=%22.85%22%3E%3Ccircle cx=%2270%22 cy=%2270%22 r=%227%22/%3E%3Ccircle cx=%22330%22 cy=%2260%22 r=%227%22/%3E%3Ccircle cx=%2260%22 cy=%22270%22 r=%227%22/%3E%3Ccircle cx=%22342%22 cy=%22282%22 r=%227%22/%3E%3Ccircle cx=%22200%22 cy=%22322%22 r=%227%22/%3E%3Ccircle cx=%22200%22 cy=%2240%22 r=%227%22/%3E%3C/g%3E%3C/svg%3E") center/86% no-repeat,linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.015));box-shadow:0 30px 60px -30px rgba(0,0,0,.55);pointer-events:none}
}

/* ---- scroll reveal (no JavaScript; browsers without support just show everything) ---- */
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .iwg-section .iwg-card,.iwg-row,.iwg-reveal{animation:iwgreveal linear backwards;animation-timeline:view();animation-range:entry 0% entry 40%}
    @keyframes iwgreveal{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
  }
}

/* ---- FAQ: core Details block, or any <details> inside .iwg-faq ---- */
.wp-block-details,.iwg-faq details{border-top:1px solid var(--wp--preset--color--rule);padding:0}
.wp-block-details:last-of-type,.iwg-faq details:last-of-type{border-bottom:1px solid var(--wp--preset--color--rule)}
.wp-block-details summary,.iwg-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;font-family:'Inter Tight',sans-serif;font-weight:700;font-size:1.25rem;line-height:1.25;letter-spacing:-.01em;color:var(--wp--preset--color--navy)}
.wp-block-details summary::-webkit-details-marker,.iwg-faq summary::-webkit-details-marker{display:none}
.wp-block-details summary::after,.iwg-faq summary::after{content:"+";flex:none;width:36px;height:36px;border-radius:50%;border:2px solid var(--wp--preset--color--orange);color:var(--wp--preset--color--orange);display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1}
.wp-block-details[open] summary::after,.iwg-faq details[open] summary::after{content:"\2212";background:var(--wp--preset--color--orange);color:#fff}
.wp-block-details summary:focus-visible,.iwg-faq summary:focus-visible{outline:3px solid #FFB199;outline-offset:3px}
.wp-block-details>:not(summary),.iwg-faq details>:not(summary){padding-bottom:22px;max-width:760px}

/* ---- sticky CTA pill: place the "IWG Sticky CTA" pattern once on a page ----
   Hidden until the visitor has scrolled; needs scroll-driven animation support
   (otherwise it stays hidden, which is safe). */
.iwg-sticky-cta{display:none}
@supports (animation-timeline:scroll()){
  @media (prefers-reduced-motion:no-preference){
    .iwg-sticky-cta{display:flex;position:fixed;left:50%;bottom:20px;z-index:45;transform:translateX(-50%);align-items:center;gap:20px;padding:10px 10px 10px 24px;border-radius:999px;background:var(--wp--preset--color--navy);color:#fff;box-shadow:0 12px 30px -8px rgba(7,20,39,.55);opacity:0;pointer-events:none;animation:iwgsticky linear both;animation-timeline:scroll(root);animation-range:700px 900px}
    @keyframes iwgsticky{to{opacity:1;pointer-events:auto}}
    .iwg-sticky-cta p{margin:0;font-weight:600;color:#fff}
    .iwg-sticky-cta .wp-block-buttons{margin:0}
    .iwg-sticky-cta .wp-block-button__link{padding:12px 20px;font-size:16px}
  }
}
@media (max-width:640px){.iwg-sticky-cta{display:none!important}}

/* ---- Side Hustle isolation (v0.1.4): member pages keep their 0.1.3 look ---- */
.sh-main h1,.sh-main h2,.sh-main h3,.sh-main p{text-wrap:wrap}
.sh-main .wp-block-button__link,.sh-main .wp-block-button__link:hover,.sh-main .wp-block-button__link:active{box-shadow:none!important;transform:none!important}

/* ================= v0.1.5: real-content hero panel + panel rules =================
   Use on the few pages where the right side should say something. Markup (inside the 1160px hero shell):
   <aside class="iwg-hero-panel" aria-label="..."><p class="iwg-hero-panel-label">...</p><ol><li>...</li><li class="is-none">...</li></ol></aside> */
/* The decorative panel steps aside when the hero has a photo, a real panel, or the opt-out class. */
.iwg-v24-hero:is(:has(img),:has(.iwg-hero-panel),.iwg-no-panel) :is(.wrap,.iwg-v24-shell)::after{display:none}
.iwg-hero-panel{box-sizing:border-box;margin-top:8px;padding:26px 28px;border-radius:24px;border:1px solid rgba(255,255,255,.16);background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.025));box-shadow:0 30px 60px -30px rgba(0,0,0,.55)}
.iwg-hero-panel-label{margin:0 0 16px;font:800 .8125rem/1.2 'Inter Tight',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#FF9A7D}
.iwg-hero-panel ol{list-style:none;margin:0;padding:0;position:relative}
.iwg-hero-panel ol::before{content:"";position:absolute;left:9px;top:12px;bottom:12px;width:2px;background:rgba(255,255,255,.2)}
.iwg-hero-panel li{position:relative;margin:0;padding:9px 0 9px 36px;font:700 1.125rem/1.25 'Inter Tight',sans-serif;letter-spacing:-.01em;color:#fff}
.iwg-hero-panel li::before{content:"";position:absolute;left:0;top:50%;width:20px;height:20px;margin-top:-10px;box-sizing:border-box;border-radius:50%;background:#0B1D3A;border:2px solid rgba(255,255,255,.75)}
.iwg-hero-panel li.is-none{margin-top:10px;padding:12px 14px 12px 50px;border:2px dashed rgba(255,255,255,.4);border-radius:12px}
.iwg-hero-panel li.is-none::before{left:14px;background:#E04823;border-color:#E04823}
@media (min-width:1180px){
  :is(.iwg-v24-hero :is(.wrap,.iwg-v24-shell),div.hero>.in,.iwg-hero.iwg-navy>.iwg-wrap)>.iwg-hero-panel{position:absolute;right:0;top:50%;transform:translateY(-50%);z-index:0;width:min(360px,30%);margin-top:0}
}

/* ---- v0.1.6: older hero structures (div.hero > .in) get the same panel rules ---- */
div.hero:has(>.in):is(:has(img),:has(.iwg-hero-panel),.iwg-no-panel)>.in::after{display:none}

/* 0.1.7: Quick Start hero hosts the real panel only (no decorative panel) */
.iwg-hero.iwg-navy>.iwg-wrap:has(>.iwg-hero-panel){position:relative}

/* 0.1.9: type scale reduced (hero 60px, cta 52, h2-band 44, h2 38, h3-card 24, h3-row 21, sub 21, eyebrow 14, small 14 at desktop). Values in theme.json. */
/* 0.1.9: legacy Custom HTML heroes (.iwg-v24-hero) set their own sizes in per-page CSS (ID-scoped). Make them follow the theme scale. :not(#a):not(#b) lifts specificity above page ID selectors without editing any page. */
.iwg-v24-hero h1.iwg-v24-title:not(#a):not(#b){font-size:var(--wp--preset--font-size--hero)!important}
.iwg-v24-hero .iwg-v24-subhead:not(#a):not(#b){font-size:var(--wp--preset--font-size--sub)!important}
.iwg-v24-hero .iwg-v24-eyebrow:not(#a):not(#b){font-size:var(--wp--preset--font-size--eyebrow)!important}
/* 0.1.10: finish the 60px H1 on the two legacy hero layouts 0.1.9 missed. Page CSS is ID-scoped, so :not(#a):not(#b) lifts specificity. */
.iwg-hero.iwg-navy>.iwg-wrap>h1:not(#a):not(#b),div.hero>.in>h1:not(#a):not(#b){font-size:var(--wp--preset--font-size--hero)!important}
/* Small Business: at 60px the headline fits on one line and runs into the hero card, so give it the old two-line shape. */
#iwg-business-ai-small-business div.hero>.in>h1:not(#a):not(#b){max-width:760px!important}
/* Quick Start: single-line headline now reaches the hero card, so seat the card lower. */
@media(min-width:1180px){#iwg-quick-start .iwg-hero.iwg-navy>.iwg-wrap>.iwg-hero-panel:not(#b){top:calc(50% + 44px)}}
/* 0.1.10: /business-ai-consulting/ hero - two-line H1 (break after "The right AI.") so it clears the card */
#iwg-consulting .iwg-v24-hero h1.iwg-v24-title:not(#a):not(#b){max-width:760px!important}
#iwg-consulting .iwg-v24-hero h1.iwg-v24-title>span:not(#a):not(#b){display:block}