/* ==========================================================================
   PRUFORA — Elementor Widget Design System
   Same tokens/components as the approved HTML prototype, but every custom
   class and CSS variable is namespaced with "pew-" so this plugin can never
   leak styles into (or clash with) the site's theme or other page builders.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400;1,9..144,500&family=Inter:wght@300;400;500;600&display=swap');

.pew-root{
  --pew-sand:        #F6F1E7;
  --pew-sand-deep:   #EFE7D8;
  --pew-taupe:       #B7A98F;
  --pew-featured-bg: #B7A98F;  /* "Most Chosen" plan card background — independent of --pew-taupe elsewhere */
  --pew-taupe-soft:  #DDD3C0;
  --pew-bark:        #5B4A36;
  --pew-bark-deep:   #3A2E20;
  --pew-ink:         #2A2119;
  --pew-ink-soft:    #6E6355;
  --pew-gold:        #B7902F;
  --pew-line:        #DED3BF;
  --pew-white:       #FFFDF9;
  --pew-surface:     #FFFDF9;  /* card / modal / input backgrounds */
  --pew-btn-text:    #FFFDF9;  /* text color on solid/dark buttons */
  --pew-btn-hover:   #3A2E20;  /* solid/dark button HOVER background — independent of heading color */
  --pew-success:     #4C6B4F;
  --pew-danger:      #9A4A3B;
  --pew-paused:      #9C7E3E;
  --pew-font-display: "Fraunces", "Times New Roman", serif;
  --pew-font-body: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
  --pew-radius-s: 4px; --pew-radius-m: 8px; --pew-radius-l: 18px;
  --pew-ease: cubic-bezier(.22,.61,.36,1);

  font-family: var(--pew-font-body);
  color: var(--pew-ink);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
.pew-root *, .pew-root *::before, .pew-root *::after{ box-sizing:border-box; }
.pew-root img{ max-width:100%; display:block; }
.pew-root a{ color:inherit; text-decoration:none; }
.pew-root ul{ margin:0; padding:0; list-style:none; }
.pew-root button{ font-family:inherit; cursor:pointer; }
.pew-root input, .pew-root select, .pew-root textarea{ font-family:inherit; font-size:1rem; }
.pew-root h1,.pew-root h2,.pew-root h3,.pew-root h4{
  font-family: var(--pew-font-display); color: var(--pew-bark-deep);
  font-weight:500; line-height:1.15; letter-spacing:-0.01em; margin:0 0 .4em;
}
@media (prefers-reduced-motion: reduce){ .pew-root *{ animation-duration:.01ms !important; transition-duration:.01ms !important; } }

.pew-eyebrow{
  font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--pew-ink-soft);
  font-weight:600; display:inline-flex; align-items:center; gap:.6em;
}
.pew-eyebrow::before{ content:""; width:20px; height:1px; background:var(--pew-gold); display:inline-block; }
.pew-muted{ color:var(--pew-ink-soft); }
.pew-row{ display:flex; align-items:center; }
.pew-between{ justify-content:space-between; }
.pew-wrap{ flex-wrap:wrap; }
.pew-gap-8{gap:8px;} .pew-gap-12{gap:12px;} .pew-gap-16{gap:16px;} .pew-gap-24{gap:24px;}
.pew-stack{ display:flex; flex-direction:column; }
.pew-text-center{ text-align:center; }

/* ---- Buttons ---- */
.pew-root .pew-btn{
  display:inline-flex !important; align-items:center; justify-content:center; gap:.6em;
  padding:14px 28px !important; border-radius:999px !important; border:1px solid transparent !important;
  font-size:.9rem !important; font-weight:500 !important; letter-spacing:.02em; font-family:var(--pew-font-body) !important;
  line-height:1.3 !important; text-decoration:none !important; box-shadow:none !important;
  transition:transform .3s var(--pew-ease), background .3s, color .3s, border-color .3s;
}
.pew-root .pew-btn:active{ transform:scale(.97); }
.pew-root .pew-btn-primary{ background:var(--pew-bark) !important; color:var(--pew-btn-text) !important; border-color:var(--pew-bark) !important; }
.pew-root .pew-btn-primary:hover{ background:var(--pew-btn-hover) !important; border-color:var(--pew-btn-hover) !important; color:var(--pew-btn-text) !important; }
.pew-root .pew-btn-outline{ background:transparent !important; border-color:var(--pew-bark) !important; color:var(--pew-bark) !important; }
.pew-root .pew-btn-outline:hover{ background:var(--pew-bark) !important; color:var(--pew-btn-text) !important; }
.pew-root .pew-btn-ghost{ background:transparent !important; color:var(--pew-ink) !important; border-color:var(--pew-line) !important; }
.pew-root .pew-btn-danger{ background:transparent !important; color:var(--pew-danger) !important; border-color:var(--pew-danger) !important; }
.pew-root .pew-btn-danger:hover{ background:var(--pew-danger) !important; color:var(--pew-btn-text) !important; }
.pew-root .pew-btn-sm{ padding:8px 18px !important; font-size:.8rem !important; }
.pew-root .pew-btn-block{ width:100%; }
.pew-root .pew-btn[disabled]{ opacity:.45; pointer-events:none; }

/* ---- Cards / plans ---- */
.pew-root .pew-card{ background:var(--pew-surface) !important; border:1px solid var(--pew-line) !important; border-radius:var(--pew-radius-l) !important; padding:28px; box-shadow:none !important; }
.pew-root .pew-plan-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; list-style:none !important; padding-left:0 !important; max-width:100%; }
.pew-root .pew-plan-card{
  min-width:0;
  background:var(--pew-sand-deep) !important; border:1px solid var(--pew-line) !important; border-radius:var(--pew-radius-l) !important;
  padding:34px 26px; text-align:center; position:relative; display:flex; flex-direction:column;
  box-shadow:none !important; transition:transform .35s var(--pew-ease), box-shadow .35s var(--pew-ease);
}
.pew-root .pew-plan-card:hover{ transform:translateY(-5px); box-shadow:0 26px 50px -26px rgba(58,46,32,.35) !important; }
.pew-root .pew-plan-card.pew-featured{ background:var(--pew-featured-bg) !important; color:var(--pew-bark-deep) !important; }
.pew-root .pew-plan-card.pew-selected{ box-shadow:0 0 0 2px var(--pew-bark) !important; }
.pew-root .pew-plan-tag{
  position:absolute; top:-12px; left:50%; transform:translateX(-50%); background:var(--pew-bark) !important; color:var(--pew-sand) !important;
  font-size:.62rem !important; letter-spacing:.14em; text-transform:uppercase; padding:5px 14px !important; border-radius:999px !important; font-weight:600 !important;
}
.pew-root .pew-plan-price{ font-family:var(--pew-font-display) !important; font-size:2.3rem; margin:8px 0 2px; color:var(--pew-bark-deep) !important; }
.pew-root .pew-plan-price span{ font-family:var(--pew-font-body) !important; font-size:.85rem; font-weight:500; color:var(--pew-ink-soft) !important; }
.pew-root .pew-plan-includes{ text-align:left; margin:18px 0 22px; font-size:.86rem; list-style:none !important; padding-left:0 !important; }
.pew-root .pew-plan-includes li{ display:flex; gap:8px; margin-bottom:8px; list-style:none !important; }
.pew-root .pew-plan-includes li::before{ content:"\2726" !important; color:var(--pew-gold) !important; font-size:.65rem; margin-top:4px; font-family:initial !important; }
.pew-root .pew-plan-includes li::marker{ content:none !important; }

/* ---- Badges ---- */
.pew-badge{
  display:inline-flex; align-items:center; gap:6px; font-size:.68rem; font-weight:600;
  letter-spacing:.05em; text-transform:uppercase; padding:4px 11px; border-radius:999px;
}
.pew-badge::before{ content:""; width:6px;height:6px;border-radius:50%; background:currentColor; }
.pew-badge-active{ background:rgba(76,107,79,.12); color:var(--pew-success); }
.pew-badge-paused{ background:rgba(156,126,62,.14); color:var(--pew-paused); }
.pew-badge-cancelled{ background:rgba(154,74,59,.12); color:var(--pew-danger); }
.pew-badge-pending{ background:rgba(110,99,85,.12); color:var(--pew-ink-soft); }

/* ---- Forms ---- */
.pew-field{ margin-bottom:18px; }
.pew-field label{ display:block; font-size:.68rem; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:var(--pew-ink-soft); margin-bottom:7px; }
.pew-field input, .pew-field select, .pew-field textarea{
  width:100%; padding:13px 15px; border-radius:var(--pew-radius-m); border:1px solid var(--pew-line);
  background:var(--pew-surface); color:var(--pew-ink); transition:border-color .2s, box-shadow .2s;
}
.pew-field input:focus, .pew-field select:focus, .pew-field textarea:focus{ border-color:var(--pew-bark); box-shadow:0 0 0 3px rgba(91,74,54,.12); outline:none; }
.pew-field-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:560px){ .pew-field-row{ grid-template-columns:1fr; } }
.pew-checkbox-row{ display:flex; gap:8px; font-size:.83rem; color:var(--pew-ink-soft); align-items:flex-start; }
.pew-error-text{ color:var(--pew-danger); font-size:.82rem; margin-top:8px; }
.pew-success-text{ color:var(--pew-success); font-size:.85rem; margin-top:10px; }

/* Honeypot: kept in the tab order out of sight rather than display:none,
   since some bots specifically skip display:none fields to look legitimate. */
.pew-root .pew-hp-field{ position:absolute !important; left:-9999px !important; top:auto; width:1px; height:1px; overflow:hidden; }

/* ---- Tabs ---- */
.pew-tabs{ display:flex; gap:4px; border-bottom:1px solid var(--pew-line); overflow-x:auto; }
.pew-tab-btn{ background:none; border:none; padding:13px 18px; font-size:.85rem; font-weight:500; color:var(--pew-ink-soft); border-bottom:2px solid transparent; margin-bottom:-1px; white-space:nowrap; }
.pew-tab-btn.pew-active{ color:var(--pew-bark-deep); border-color:var(--pew-bark); font-weight:600; }
.pew-tab-panel{ display:none; }
.pew-tab-panel.pew-active{ display:block; }

/* ---- Modal ---- */
.pew-modal-overlay{
  position:fixed; inset:0; background:rgba(42,33,25,.55); display:flex; align-items:center; justify-content:center;
  z-index:100000; padding:20px; opacity:0; pointer-events:none; transition:opacity .25s var(--pew-ease);
}
.pew-modal-overlay.pew-open{ opacity:1; pointer-events:auto; }
.pew-modal{ background:var(--pew-surface); border-radius:var(--pew-radius-l); max-width:440px; width:100%; padding:32px; max-height:85vh; overflow-y:auto; transform:translateY(12px); transition:transform .3s var(--pew-ease); }
.pew-modal-overlay.pew-open .pew-modal{ transform:translateY(0); }
.pew-modal-close{ float:right; background:none; border:none; font-size:1.2rem; color:var(--pew-ink-soft); }
.pew-option-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 15px; border:1px solid var(--pew-line); border-radius:var(--pew-radius-m); margin-bottom:9px; cursor:pointer; }
.pew-option-row.pew-selected{ border-color:var(--pew-bark); background:var(--pew-sand-deep); }
.pew-modal-actions{ display:flex; gap:10px; margin-top:20px; }

/* ---- Table ---- */
.pew-table-wrap{ overflow-x:auto; border:1px solid var(--pew-line); border-radius:var(--pew-radius-m); background:var(--pew-surface); }
.pew-data-table{ width:100%; border-collapse:collapse; font-size:.85rem; }
.pew-data-table th{ text-align:left; padding:12px 14px; font-size:.66rem; letter-spacing:.06em; text-transform:uppercase; color:var(--pew-ink-soft); border-bottom:1px solid var(--pew-line); }
.pew-data-table td{ padding:14px; border-bottom:1px solid var(--pew-line); }

/* ---- Toast ---- */
#pew-toast-stack{ position:fixed; bottom:24px; right:24px; z-index:100001; display:flex; flex-direction:column; gap:10px; align-items:flex-end; }
.pew-toast{ background:var(--pew-bark-deep); color:var(--pew-sand); padding:13px 20px; border-radius:999px; font-size:.83rem; box-shadow:0 16px 34px -14px rgba(0,0,0,.4); }
.pew-toast::before{ content:"✦ "; color:var(--pew-gold); }

/* ---- Loyalty bar ---- */
.pew-bar-track{ height:8px; border-radius:8px; background:var(--pew-sand-deep); overflow:hidden; }
.pew-bar-fill{ display:block; height:100%; background:var(--pew-gold); transition:width .5s var(--pew-ease); }

/* ---- Sticky summary ---- */
.pew-sticky-summary{ position:sticky; top:24px; background:var(--pew-surface); border:1px solid var(--pew-line); border-radius:var(--pew-radius-l); padding:26px; }

.pew-empty-state{ text-align:center; padding:50px 18px; color:var(--pew-ink-soft); }
.pew-empty-state .pew-glyph{ font-size:2rem; color:var(--pew-gold); margin-bottom:12px; }

.pew-reed-divider{ display:flex; align-items:center; justify-content:center; gap:10px; margin:32px 0; }
.pew-reed-divider span{ width:1px; height:30px; background:linear-gradient(var(--pew-line), transparent); transform:rotate(8deg); }
.pew-reed-divider span:nth-child(2){ height:46px; transform:rotate(-6deg); background:linear-gradient(var(--pew-gold), transparent); }

.pew-loader-line{ height:2px; background:var(--pew-line); border-radius:2px; overflow:hidden; }
.pew-loader-line span{ display:block; height:100%; width:0%; background:var(--pew-bark); transition:width 1.2s ease; }

/* ---- Testimonials ---- */
.pew-root .pew-testimonial-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; list-style:none !important; padding-left:0 !important; max-width:100%; }
.pew-root .pew-testimonial-card{
  min-width:0;
  background:var(--pew-sand-deep) !important; border:1px solid var(--pew-line) !important; border-radius:var(--pew-radius-l) !important;
  padding:32px 30px; display:flex; flex-direction:column; box-shadow:none !important;
  transition:transform .35s var(--pew-ease), box-shadow .35s var(--pew-ease);
}
.pew-root .pew-testimonial-card:hover{ transform:translateY(-4px); box-shadow:0 24px 46px -26px rgba(58,46,32,.3) !important; }
.pew-root .pew-testimonial-stars{ color:var(--pew-gold) !important; letter-spacing:3px; font-size:.95rem; line-height:1; }
.pew-root .pew-testimonial-quote{ margin:18px 0 26px; color:var(--pew-ink) !important; font-size:.96rem; line-height:1.65; flex-grow:1; }
.pew-root .pew-testimonial-footer{ display:flex; align-items:center; gap:12px; margin-top:auto; }
.pew-root .pew-testimonial-avatar{
  width:44px; height:44px; border-radius:50% !important; flex-shrink:0; overflow:hidden;
  background:var(--pew-taupe-soft) !important; color:var(--pew-bark-deep) !important;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--pew-font-display) !important; font-size:.9rem; font-weight:600; letter-spacing:.02em;
}
.pew-root .pew-testimonial-avatar img{ width:100%; height:100%; object-fit:cover; }
.pew-root .pew-testimonial-name{ font-family:var(--pew-font-display) !important; color:var(--pew-bark-deep) !important; font-size:1.02rem; line-height:1.25; }
.pew-root .pew-testimonial-date{ font-size:.76rem; color:var(--pew-ink-soft) !important; margin-top:2px; }

/* ---- Reusable responsive 2-column layout ----
   Any desktop ratio (1fr 1fr, 1.4fr 1fr, 1.3fr 1fr, etc.) can be set inline
   via the --pew-2col-ratio custom property — that's just data, not a layout
   property, so it can never block the mobile override below the way a
   directly-inlined grid-template-columns would. */
.pew-root .pew-responsive-2col{ display:grid; grid-template-columns:var(--pew-2col-ratio, 1fr 1fr); max-width:100%; }
@media (max-width:640px){
  .pew-root .pew-responsive-2col{ grid-template-columns:1fr !important; }
}

/* ---- Mobile swipeable slider (opt-in, Plans & Testimonials widgets) ----
   Applied when the "Swipeable slider on mobile" switcher is on. Pure CSS
   scroll-snap — no JS carousel library needed, works with native touch
   swipe on any phone. The next card peeking in from the right edge is the
   visual cue that there's more to swipe. */
@media (max-width: 767px){
  .pew-root .pew-plan-grid.pew-mobile-slider,
  .pew-root .pew-testimonial-grid.pew-mobile-slider{
    display:flex !important;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x mandatory;
    padding-bottom:6px;
    scrollbar-width:none;
    -ms-overflow-style:none;
  }
  .pew-root .pew-plan-grid.pew-mobile-slider::-webkit-scrollbar,
  .pew-root .pew-testimonial-grid.pew-mobile-slider::-webkit-scrollbar{ display:none; height:0; }
  .pew-root .pew-plan-grid.pew-mobile-slider > .pew-plan-card,
  .pew-root .pew-testimonial-grid.pew-mobile-slider > .pew-testimonial-card{
    flex:0 0 86%;
    scroll-snap-align:center;
  }
}

/* Section heading used by widgets with a "Heading" text control — a real
   class (not an inline style) so the Typography style control can actually
   override the font-size; inline styles would otherwise always win. */
.pew-root .pew-section-heading{ font-size:clamp(1.7rem,3vw,2.4rem); margin-top:12px; }

/* ---- Accordion (FAQ) ---- */
.pew-root .pew-accordion-group{ margin-bottom:36px; }
.pew-root .pew-accordion-group-label{
  font-size:.7rem !important; text-transform:uppercase; letter-spacing:.1em; color:var(--pew-ink-soft) !important;
  font-weight:600; margin-bottom:10px; font-family:var(--pew-font-body) !important;
}
.pew-root .pew-accordion-item{ border-bottom:1px solid var(--pew-line) !important; list-style:none !important; max-width:100% !important; box-sizing:border-box !important; }
.pew-root .pew-accordion-head{
  width:100% !important; max-width:100% !important; background:none !important; border:none !important; text-align:left !important; cursor:pointer;
  display:flex !important; justify-content:space-between !important; align-items:center !important; gap:16px; box-sizing:border-box !important;
  white-space:normal !important; word-break:normal !important;
  padding:20px 4px !important; font-family:var(--pew-font-display) !important; font-size:1.02rem; color:var(--pew-bark-deep) !important;
}
.pew-root .pew-accordion-head .pew-q-text{
  display:block !important; flex:1 1 auto !important; min-width:0 !important; width:auto !important; max-width:100% !important;
  white-space:normal !important; overflow-wrap:anywhere !important; word-break:break-word !important;
}
.pew-root .pew-accordion-head .pew-plus{ font-size:1.2rem; color:var(--pew-ink-soft) !important; transition:transform .35s var(--pew-ease); flex-shrink:0 !important; flex-grow:0 !important; }
.pew-root .pew-accordion-item.pew-open .pew-accordion-head .pew-plus{ transform:rotate(45deg); color:var(--pew-bark) !important; }
.pew-root .pew-accordion-body{ max-height:0; overflow:hidden; transition:max-height .4s var(--pew-ease); }
.pew-root .pew-accordion-item.pew-open .pew-accordion-body{ max-height:1200px; }
.pew-root .pew-accordion-answer{ padding:0 4px 20px; color:var(--pew-ink-soft) !important; max-width:70ch; }
.pew-root .pew-accordion-answer p{ margin:0 0 12px; color:inherit; }
.pew-root .pew-accordion-answer p:last-child{ margin-bottom:0; }
.pew-root .pew-accordion-answer ul, .pew-root .pew-accordion-answer ol{ margin:0 0 12px; padding-left:20px; list-style:revert; }
.pew-root .pew-accordion-answer li{ list-style:revert; margin-bottom:4px; }
.pew-root .pew-accordion-answer a{ color:var(--pew-bark) !important; text-decoration:underline; }
.pew-root .pew-accordion-answer strong{ color:var(--pew-ink) !important; font-weight:600; }

/* ---- Image Marquee ---- */
.pew-root .pew-marquee-wrap{ overflow:hidden; width:100%; }
.pew-root .pew-marquee-track{ display:flex; width:max-content; animation-name:pew-marquee-scroll; animation-timing-function:linear; animation-iteration-count:infinite; }
.pew-root .pew-marquee-track.pew-marquee-paused:hover{ animation-play-state:paused; }
.pew-root .pew-marquee-item{ flex-shrink:0; height:100%; }
.pew-root .pew-marquee-item img{ display:block; height:100%; width:auto; object-fit:cover; border-radius:var(--pew-radius-m) !important; }
@keyframes pew-marquee-scroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
