/* TempMy homepage v2 — styles for the .tm-home-* sections in
   resources/views/frontend/index.blade.php. Kept in its own file because
   most of these classes previously had no CSS rule anywhere in the bundle. */

.tm-home-section{
  padding:56px 0;
}

.tm-home-section__head{
  max-width:680px;
  margin:0 auto 32px;
  text-align:center;
}

.tm-home-section__head p{
  color:var(--tm-muted);
}

.tm-home-section__kicker{
  display:inline-flex;
  align-items:center;
  padding:6px 14px;
  margin:0 0 12px;
  border-radius: 14px;
  background:var(--tm-surface-2);
  color:var(--tm-primary);
  font-size:13px;
  font-weight:600;
  letter-spacing:.02em;
}

.tm-home-section__head h2{
  font-family:var(--tm-font-display);
  font-weight:700;
  font-size:28px;
  margin:0 0 12px;
  color:var(--tm-text);
}

/* Hero highlight + CTA row */
.tm-home-highlight{
  color:var(--tm-primary);
}

.tm-home-hero__cta{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:20px;
}

.tm-home-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:13px 22px;
  border-radius:var(--tm-radius-sm);
  font-weight:600;
  font-size:15px;
  line-height:1.2;
  text-decoration:none;
  transition:transform .15s ease, box-shadow .15s ease;
}

.tm-home-btn--primary{
  background:var(--tm-primary);
  color:#fff;
  box-shadow:var(--tm-shadow-sm);
}

.tm-home-btn--primary:hover{
  transform:translateY(-1px);
}

.tm-home-btn--secondary{
  background:var(--tm-surface);
  color:var(--tm-text);
  border:1px solid var(--tm-border);
}

.tm-home-btn--ghost-light{
  background:transparent;
  color:#fff;
  border:1px solid rgba(255,255,255,.35);
}

/* Hero product mockup — frame the embedded live inbox generator like a card */
.tm-home-hero__app{
  margin-top:32px;
  padding:18px;
  border-radius:var(--tm-radius-lg);
  background:var(--tm-surface);
  border:1px solid var(--tm-border);
  box-shadow:var(--tm-shadow-md);
}

/* Feature cards */
.tm-home-card-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
}

@media (min-width: 768px){
  .tm-home-card-grid--eight,
  .tm-home-card-grid--four{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
}

.tm-home-card{
  padding:22px;
  border-radius:var(--tm-radius-md);
  background:var(--tm-surface);
  border:1px solid var(--tm-border);
  box-shadow:var(--tm-shadow-xs);
  transition:transform .15s ease, box-shadow .15s ease;
}

.tm-home-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--tm-shadow-sm);
}

.tm-home-card__icon{
  width:40px;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:var(--tm-radius-sm);
  background:var(--tm-surface-2);
  color:var(--tm-primary);
  margin-bottom:12px;
  font-size:16px;
}

.tm-home-card h3{
  font-size:16px;
  font-weight:700;
  margin:0 0 6px;
  color:var(--tm-text);
}

.tm-home-card p{
  font-size:14px;
  color:var(--tm-muted);
  margin:0;
}

/* How it works */
.tm-home-steps{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
}

@media (min-width: 768px){
  .tm-home-steps{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
}

.tm-home-step{
  text-align:center;
  padding:24px 18px;
  border-radius:var(--tm-radius-md);
  background:var(--tm-surface);
  border:1px solid var(--tm-border);
}

.tm-home-step__num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border-radius:50%;
  background:var(--tm-primary);
  color:#fff;
  font-weight:700;
  margin-bottom:12px;
}

.tm-home-step h3{
  font-size:16px;
  font-weight:700;
  margin:0 0 6px;
}

.tm-home-step p{
  font-size:14px;
  color:var(--tm-muted);
  margin:0;
}

/* Use cases */
.tm-home-chip-grid{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
}

.tm-home-chip-grid span{
  padding:9px 16px;
  border-radius: 14px;
  background:var(--tm-surface-2);
  color:var(--tm-text);
  font-size:14px;
  font-weight:600;
}

/* Popular tools link grid */
.tm-home-link-grid{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
}

.tm-home-link-grid a{
  padding:9px 16px;
  border-radius: 14px;
  border:1px solid var(--tm-border);
  background:var(--tm-surface);
  color:var(--tm-text);
  font-size:14px;
  font-weight:600;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.tm-home-link-grid a:hover{
  transform:translateY(-2px);
  box-shadow:var(--tm-shadow-xs);
  border-color:var(--tm-primary);
}

/* Pricing teaser */
.tm-home-pricing-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  max-width:680px;
  margin:0 auto;
}

@media (min-width: 640px){
  .tm-home-pricing-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

.tm-home-pricing-tier{
  padding:26px;
  border-radius:var(--tm-radius-md);
  background:var(--tm-surface);
  border:1px solid var(--tm-border);
  display:flex;
  flex-direction:column;
}

.tm-home-pricing-tier--pro{
  border-color:var(--tm-primary);
  box-shadow:var(--tm-shadow-sm);
}

.tm-home-pricing-tier h3{
  font-size:18px;
  font-weight:700;
  margin:0 0 14px;
}

.tm-home-pricing-tier__list{
  list-style:none;
  margin:0 0 20px;
  padding:0;
  flex:1;
}

.tm-home-pricing-tier__list li{
  padding:7px 0;
  font-size:14px;
  color:var(--tm-text);
  border-bottom:1px solid var(--tm-border);
}

.tm-home-pricing-tier__list li:last-child{
  border-bottom:none;
}

.tm-home-pricing-tier__cta{
  width:100%;
}

/* FAQ accordion */
.tm-home-faq-list{
  max-width:720px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.tm-home-faq-item{
  border:1px solid var(--tm-border);
  border-radius:var(--tm-radius-sm);
  background:var(--tm-surface);
  padding:4px 18px;
}

.tm-home-faq-item summary{
  list-style:none;
  cursor:pointer;
  padding:14px 24px 14px 0;
  font-weight:600;
  color:var(--tm-text);
  position:relative;
}

.tm-home-faq-item summary::-webkit-details-marker{
  display:none;
}

.tm-home-faq-item summary::after{
  content:"+";
  position:absolute;
  right:0;
  top:14px;
  font-size:18px;
  color:var(--tm-primary);
}

.tm-home-faq-item[open] summary::after{
  content:"–";
}

.tm-home-faq-item p{
  margin:0 0 16px;
  color:var(--tm-muted);
  font-size:14px;
}

/* Final dark CTA block */
.tm-home-final-cta{
  padding:56px 0;
}

.tm-home-final-cta__box{
  max-width:720px;
  margin:0 auto;
  text-align:center;
  padding:48px 28px;
  border-radius:var(--tm-radius-lg);
  background:#0f172a;
  color:#fff;
}

.tm-home-final-cta__box h2{
  font-family:var(--tm-font-display);
  font-weight:700;
  font-size:26px;
  margin:0 0 12px;
}

.tm-home-final-cta__box p{
  color:rgba(255,255,255,.78);
  margin:0 0 24px;
}

.tm-home-final-cta__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  justify-content:center;
}

/* SEO text block */
.tm-home-seo-box{
  max-width:760px;
  margin:0 auto;
  color:var(--tm-muted);
  font-size:14px;
  text-align:center;
}

/* Mobile: full-width, comfortably tappable CTAs + safe spacing */
@media (max-width: 767.98px){
  .tm-home-hero__cta .tm-home-btn,
  .tm-home-final-cta__actions .tm-home-btn,
  .tm-home-pricing-tier__cta{
    width:100%;
  }

  .tm-home-section{
    padding:28px 0;
  }

  .tm-home-section__head{
    margin-bottom:18px;
  }

  .tm-home-section__head h2{
    font-size:22px;
  }

  .tm-home-card-grid{
    grid-template-columns:1fr;
  }

  .tm-home-hero__app{
    margin-top:16px;
    padding:10px;
  }
}


/* TEMPMY_HOME_DESIGN_SYSTEM_V1 */
body.tm-saas .tm-homepage-v2{
  background:linear-gradient(180deg,#FFFFFF 0%,#F8FAFC 52%,#FFFFFF 100%);
}

body.tm-saas .tm-homepage-v2 .tm-home-hero,
body.tm-saas .tm-homepage-v2 .tm-home-section:first-child{
  padding-top:clamp(24px,4vw,48px);
}

body.tm-saas .tm-homepage-v2 h1{
  max-width:820px;
  font-size:clamp(36px,6vw,64px);
  line-height:.98;
  letter-spacing:0;
  font-weight:950;
  color:var(--tm-ds-text,#0F172A);
}

body.tm-saas .tm-homepage-v2 .tm-home-highlight{
  background:linear-gradient(135deg,#2563EB,#06B6D4);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__lead,
body.tm-saas .tm-homepage-v2 .tm-home-hero p{
  max-width:680px;
  color:var(--tm-ds-muted,#64748B);
  font-size:clamp(16px,2vw,19px);
  line-height:1.55;
}

body.tm-saas .tm-homepage-v2 .tm-home-btn{
  min-height:46px;
  border-radius:var(--tm-ds-pill,999px);
  padding:0 20px;
  font-weight:900;
  letter-spacing:0;
  width:auto;
}

body.tm-saas .tm-homepage-v2 .tm-home-btn--primary{
  background:var(--tm-ds-gradient,linear-gradient(135deg,#2563EB,#06B6D4));
  color:#fff;
  box-shadow:0 12px 28px rgba(37,99,235,.20);
}

body.tm-saas .tm-homepage-v2 .tm-home-btn--secondary{
  border-color:var(--tm-ds-border,rgba(15,23,42,.10));
  background:#fff;
  color:var(--tm-ds-text,#0F172A);
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__app{
  border-radius:var(--tm-ds-radius-xl,26px);
  border:1px solid rgba(37,99,235,.14);
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.96));
  box-shadow:0 16px 42px rgba(15,23,42,.10);
}

body.tm-saas .tm-homepage-v2 .tm-home-section__head h2{
  font-size:clamp(24px,3.5vw,36px);
  line-height:1.08;
  letter-spacing:0;
  font-weight:950;
}

body.tm-saas .tm-homepage-v2 .tm-home-section__kicker,
body.tm-saas .tm-homepage-v2 .tm-home-chip-grid span,
body.tm-saas .tm-homepage-v2 .tm-home-link-grid a{
  border:1px solid rgba(37,99,235,.15);
  background:rgba(37,99,235,.07);
  color:#1E40AF;
  border-radius:var(--tm-ds-pill,999px);
  font-weight:850;
}

body.tm-saas .tm-homepage-v2 .tm-home-card,
body.tm-saas .tm-homepage-v2 .tm-home-step,
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier,
body.tm-saas .tm-homepage-v2 .tm-home-faq-item{
  border-radius:var(--tm-ds-radius-lg,22px);
  border:1px solid var(--tm-ds-border,rgba(15,23,42,.10));
  background:#fff;
  box-shadow:var(--tm-ds-shadow-sm,0 10px 24px rgba(15,23,42,.07));
}

body.tm-saas .tm-homepage-v2 .tm-home-card__icon{
  background:linear-gradient(135deg,rgba(37,99,235,.14),rgba(6,182,212,.14));
  color:#2563EB;
}

body.tm-saas .tm-homepage-v2 .tm-home-step__num{
  color:#fff;
  background:var(--tm-ds-gradient,linear-gradient(135deg,#2563EB,#06B6D4));
}

body.tm-saas .tm-homepage-v2 .tm-home-final-cta__box{
  border-radius:var(--tm-ds-radius-lg,22px);
  background:linear-gradient(180deg,#FFFFFF,#F8FAFC);
  color:var(--tm-ds-text,#0F172A);
  border:1px solid var(--tm-ds-border,rgba(15,23,42,.10));
  box-shadow:var(--tm-ds-shadow-sm,0 10px 24px rgba(15,23,42,.07));
}

body.tm-saas .tm-homepage-v2 .tm-home-final-cta__box p{
  color:var(--tm-ds-muted,#64748B);
}

@media (max-width:767.98px){
  body.tm-saas .tm-homepage-v2 .tm-home-hero{padding-top:14px;padding-bottom:22px;}
  body.tm-saas .tm-homepage-v2 .tm-home-section{padding:26px 0;}
  body.tm-saas .tm-homepage-v2 .tm-home-section:first-child{padding-top:16px;}
  body.tm-saas .tm-homepage-v2 .tm-home-hero__grid{gap:14px;margin-bottom:12px;align-items:start;}
  body.tm-saas .tm-homepage-v2 h1{font-size:33px;line-height:1.08;}
  body.tm-saas .tm-homepage-v2 .tm-home-hero__lead,
  body.tm-saas .tm-homepage-v2 .tm-home-hero p{font-size:15px;line-height:1.42;}
  body.tm-saas .tm-homepage-v2 .tm-home-hero__cta{width:100%;gap:8px;margin-top:14px;}
  body.tm-saas .tm-homepage-v2 .tm-home-btn{min-height:42px;padding:0 16px;font-size:14px;}
  body.tm-saas .tm-homepage-v2 .tm-home-hero__app{margin:14px 0 0;padding:6px;border-radius:18px;}
  body.tm-saas .tm-homepage-v2 .tm-home-card,
  body.tm-saas .tm-homepage-v2 .tm-home-step,
  body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier,
  body.tm-saas .tm-homepage-v2 .tm-home-faq-item{border-radius: 14px;box-shadow:var(--tm-ds-shadow-xs,0 1px 2px rgba(15,23,42,.04));}
  body.tm-saas .tm-homepage-v2 .tm-home-card{padding:14px;}
  body.tm-saas .tm-homepage-v2 .tm-home-card__icon{width:34px;height:34px;margin-bottom:9px;}
  body.tm-saas .tm-homepage-v2 .tm-home-card p,
  body.tm-saas .tm-homepage-v2 .tm-home-step p{font-size:13.5px;line-height:1.42;}
  body.tm-saas .tm-homepage-v2 .tm-home-step{padding:14px 12px;}
  body.tm-saas .tm-homepage-v2 .tm-home-step__num{width:28px;height:28px;margin-bottom:8px;}
  body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier{padding:15px;}
  body.tm-saas .tm-homepage-v2 .tm-home-faq-item{padding:2px 14px;}
  body.tm-saas .tm-homepage-v2 .tm-home-faq-item summary{padding:12px 22px 12px 0;}
  body.tm-saas .tm-homepage-v2 .tm-home-final-cta{padding:30px 0;}
  body.tm-saas .tm-homepage-v2 .tm-home-final-cta__box{padding:22px 15px;}
}

/* TEMPMY_HOME_MOBILE_FIRST_V2 */

/* Mobile: collapse badges and CTA buttons so the generator card rises above fold */
@media (max-width:767.98px){
  body.tm-saas .tm-home-hero__badges{display:none !important;}
  body.tm-saas .tm-home-hero__cta{display:none !important;}

  /* Generator card gets a subtle premium border on homepage */
  body.tm-saas.tm-mode-home .tm-home-hero__app{
    border:1.5px solid rgba(37,99,235,.14) !important;
    background:#fff !important;
    box-shadow:0 6px 24px rgba(37,99,235,.09),0 1px 4px rgba(15,23,42,.05) !important;
    border-radius:20px !important;
    padding:12px !important;
  }
}

/* Status indicator — "Inbox active" dot + feature tags (compact homepage mode) */
.tmx-gen-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:5px 8px;
  margin-top:8px;
  margin-bottom:2px;
  font-size:12px;
  line-height:1;
}

.tmx-gen-meta__dot{
  display:inline-block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#10B981;
  box-shadow:0 0 0 3px rgba(16,185,129,.18);
  flex-shrink:0;
  animation:tmGenDotPulse 2.6s ease-in-out infinite;
}

@keyframes tmGenDotPulse{
  0%,100%{box-shadow:0 0 0 3px rgba(16,185,129,.18);}
  50%{box-shadow:0 0 0 5px rgba(16,185,129,.07);}
}

@media (prefers-reduced-motion:reduce){
  .tmx-gen-meta__dot{animation:none !important;}
}

.tmx-gen-meta__status{
  font-weight:700;
  color:#059669;
}

.tmx-gen-meta__sep{
  color:rgba(100,116,139,.3);
}

.tmx-gen-meta__tag{
  display:inline-flex;
  align-items:center;
  padding:2px 7px;
  border-radius: 14px;
  background:rgba(37,99,235,.07);
  border:1px solid rgba(37,99,235,.12);
  color:#1E40AF;
  font-size:10.5px;
  font-weight:700;
  white-space:nowrap;
}

/* Benefit chips below the generator card */
.tm-home-gen-chips{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding:10px 4px 2px;
  justify-content:center;
}

.tm-home-gen-chips span{
  display:inline-flex;
  align-items:center;
  padding:5px 11px;
  border-radius: 14px;
  background:rgba(37,99,235,.06);
  border:1px solid rgba(37,99,235,.11);
  color:#1E40AF;
  font-size:11.5px;
  font-weight:700;
  line-height:1.2;
  white-space:nowrap;
}

/* API developer teaser row, inside the pricing section container */
.tm-home-api-teaser{
  margin:18px auto 0;
  max-width:620px;
  padding:12px 18px;
  border-radius:12px;
  background:rgba(37,99,235,.04);
  border:1px solid rgba(37,99,235,.10);
  text-align:center;
  font-size:13.5px;
  color:#64748B;
  line-height:1.55;
}

.tm-home-api-teaser strong{
  color:#0F172A;
  font-weight:700;
}

.tm-home-api-teaser a{
  color:#2563EB !important;
  font-weight:600;
  text-decoration:none;
}

.tm-home-api-teaser a:hover{
  text-decoration:underline;
}

/* TEMPMY_MOBILE_HERO_NOTE_HIDE_V1 — the mini-card between the hero copy and
   the generator card is redundant on mobile and pushes the generator below fold */
@media (max-width:767.98px){
  .tm-home-hero__note{display:none !important;}
}

/* ── TEMPMY_HERO_LAYOUT_V1 ────────────────────────────────────────────────
   Foundation CSS for homepage hero classes that were referenced in the Blade
   template but had no base definitions, causing the hero to render as an
   unstyled single-column block on all screen sizes.
   ─────────────────────────────────────────────────────────────────────── */

/* Hero section base */
.tm-home-hero{
  padding-bottom:32px;
}

/* Two-column hero grid: [copy] | [mini-card] on desktop; single column on mobile */
.tm-home-hero__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:20px;
  align-items:start;
  margin-bottom:20px;
}

@media (min-width:1024px){
  .tm-home-hero__grid{
    grid-template-columns:minmax(0, 1fr);
    gap:18px;
    align-items:center;
    margin-bottom:18px;
  }
}

.tm-home-hero__note:empty{
  display:none;
}

/* Eyebrow badge: "Free disposable inbox" pill above the h1 */
.tm-home-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:5px 13px 5px 8px;
  margin-bottom:14px;
  border-radius: 14px;
  background:rgba(37,99,235,.07);
  border:1px solid rgba(37,99,235,.15);
  color:#1E40AF;
  font-size:13px;
  font-weight:700;
  line-height:1.3;
}

.tm-home-eyebrow__dot{
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  background:#10B981;
  box-shadow:0 0 0 3px rgba(16,185,129,.18);
}

/* Mini-card: right-column explainer visible on desktop */
.tm-home-mini-card{
  display:flex;
  gap:14px;
  align-items:flex-start;
  padding:20px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(37,99,235,.12);
  box-shadow:0 10px 28px rgba(15,23,42,.08);
}

.tm-home-mini-card__icon{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:rgba(37,99,235,.09);
  color:#2563EB;
  font-size:18px;
}

.tm-home-mini-card strong{
  display:block;
  font-size:15px;
  font-weight:700;
  color:#0f172a;
  margin-bottom:6px;
}

.tm-home-mini-card p{
  font-size:13.5px;
  color:#64748b;
  margin:0;
  line-height:1.5;
}

/* Trust strip on homepage: override the negative margin from tm-trust-layer.css
   which was designed for placement inside/after a hero section. Here the strip
   is the first element in <main>, so negative top margin pushes it into the header gap. */
body.tm-saas.tm-mode-home .tm-trust-strip{
  margin:14px 0 20px;
}

/* ── TEMPMY_SECTION_RHYTHM_V1 ─────────────────────────────────────────────
   Alternating section tinting creates clear visual rhythm on the long
   landing page without adding visual noise.
   ─────────────────────────────────────────────────────────────────────── */

/* Subtle tinted sections for structural contrast */
body.tm-saas .tm-homepage-v2 .tm-home-how,
body.tm-saas .tm-homepage-v2 .tm-home-faq{
  background:rgba(248,250,252,.90);
}

/* Section top dividers — very light ruled lines between sections */
body.tm-saas .tm-homepage-v2 .tm-home-benefits,
body.tm-saas .tm-homepage-v2 .tm-home-how,
body.tm-saas .tm-homepage-v2 .tm-home-pricing,
body.tm-saas .tm-homepage-v2 .tm-home-faq,
body.tm-saas .tm-homepage-v2 .tm-home-final-cta,
body.tm-saas .tm-homepage-v2 .tm-home-seo-text{
  border-top:1px solid rgba(15,23,42,.055);
}

/* Final CTA: restore a strong visual anchor at the end of the page.
   The DESIGN_SYSTEM_V1 override made it light-on-light which loses
   the visual punch a final conversion section needs. */
body.tm-saas .tm-homepage-v2 .tm-home-final-cta{
  background:linear-gradient(135deg,#0f172a 0%,#1e293b 100%);
  border-top:none;
}

body.tm-saas .tm-homepage-v2 .tm-home-final-cta__box{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  color:#fff !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-final-cta__box h2{
  color:#fff !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-final-cta__box p{
  color:rgba(255,255,255,.72) !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-final-cta .tm-home-btn--primary{
  background:linear-gradient(135deg,#2563EB,#06B6D4) !important;
  box-shadow:0 16px 36px rgba(37,99,235,.30) !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-final-cta .tm-home-btn--ghost-light{
  border-color:rgba(255,255,255,.30);
  color:#fff;
}
body.tm-saas .tm-homepage-v2 .tm-home-final-cta .tm-home-btn--ghost-light:hover{
  background:rgba(255,255,255,.10);
}

/* SEO text section: muted but distinct, sits below the dark CTA */
body.tm-saas .tm-homepage-v2 .tm-home-seo-text{
  background:rgba(248,250,252,.80);
  border-top:1px solid rgba(15,23,42,.055);
}

@media (min-width:768px){
  body.tm-saas .tm-homepage-v2 .tm-home-hero__cta .tm-home-btn,
  body.tm-saas .tm-homepage-v2 .tm-home-final-cta__actions .tm-home-btn,
  body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier__cta{
    width:auto;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier__cta{
    align-self:flex-start;
  }
}

/* Hero — subtle top gradient to give the fold area a sense of depth.
   Uses !important to override the generic body.tm-saas .tm-home-hero !important
   rule in tm-brand-refresh.css which applies to all hero sections. */
body.tm-saas .tm-homepage-v2 .tm-home-hero{
  background:linear-gradient(180deg,rgba(239,246,255,.50) 0%,rgba(255,255,255,0) 100%) !important;
}

/* ── TEMPMY_EYEBROW_DOT_PULSE_V1 ─────────────────────────────────────
   The green "online" dot in the eyebrow badge already has the right shape;
   reuse the existing tmGenDotPulse keyframe to make it breathe gently.
   Respects prefers-reduced-motion. */
.tm-home-eyebrow__dot{
  animation:tmGenDotPulse 2.6s ease-in-out infinite;
}
@media (prefers-reduced-motion:reduce){
  .tm-home-eyebrow__dot{ animation:none; }
}

/* ── TEMPMY_HOME_PRICING_PRO_V1 ───────────────────────────────────────
   Pro tier card needs a stronger visual distinction from Free.
   Both cards receive the same white card treatment from DESIGN_SYSTEM_V1;
   adding a blue-tinted gradient background + stronger shadow makes Pro
   read as the recommended option without being loud. */
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier--pro{
  background:linear-gradient(180deg,rgba(239,246,255,.92),rgba(255,255,255,1) 55%) !important;
  border-color:rgba(37,99,235,.28) !important;
  box-shadow:0 14px 40px rgba(37,99,235,.11) !important;
}
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier--pro h3{
  color:#1E40AF;
}

/* ── TEMPMY_FAQ_SUMMARY_WEIGHT_V1 ────────────────────────────────────
   FAQ question text at font-weight 600 is too close to the answer body
   weight, reducing question-answer visual hierarchy. Bump to 700. */
body.tm-saas .tm-homepage-v2 .tm-home-faq-item summary{
  font-weight:700;
}

/* ── TEMPMY_HOME_STEP_NUM_V1 ─────────────────────────────────────────
   How-it-works step numbers were solid blue circles. Upgrading to a
   brand gradient + subtle shadow matches the other gradient elements
   (CTA buttons, card icons) and makes the numbered steps feel more
   intentional. */
body.tm-saas .tm-homepage-v2 .tm-home-step__num{
  background:linear-gradient(135deg,#2563EB,#06B6D4);
  box-shadow:0 4px 12px rgba(37,99,235,.26);
  width:34px;
  height:34px;
  font-size:14px;
  font-weight:800;
}

/* ── TEMPMY_HOME_PRICING_CHECKLIST_V1 ───────────────────────────────
   Pricing feature lists had divider borders but no visual indicator
   that items are "included". A Unicode ✓ as ::before makes each row
   immediately read as a positive feature, not a neutral list item. */
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier__list li{
  padding-left:20px;
  position:relative;
}
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier__list li::before{
  content:"✓";
  position:absolute;
  left:1px;
  top:7px;
  color:#2563EB;
  font-weight:800;
  font-size:13px;
  line-height:1;
}

/* ── TEMPMY_FAQ_CHEVRON_V1 ──────────────────────────────────────────
   Replace the static +/– toggle with an animated FA chevron-down that
   rotates 180° on open. Eliminates the flicker from swapping content
   strings and matches the polish of the rest of the UI. */
body.tm-saas .tm-homepage-v2 .tm-home-faq-item summary::after{
  content:"\f078";
  font-family:"Font Awesome 5 Free";
  font-weight:900;
  font-size:12px;
  top:50%;
  transform:translateY(-50%);
  transition:transform .22s ease;
}
body.tm-saas .tm-homepage-v2 .tm-home-faq-item[open] summary::after{
  content:"\f078";
  transform:translateY(-50%) rotate(180deg);
}
@media (prefers-reduced-motion:reduce){
  body.tm-saas .tm-homepage-v2 .tm-home-faq-item summary::after{
    transition:none;
  }
}
/* TEMPMY_FLATTEN_BATCH_1_HOME */
body.tm-saas .tm-homepage-v2 .tm-home-hero__app{
  padding:0;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-card,
body.tm-saas .tm-homepage-v2 .tm-home-step,
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier,
body.tm-saas .tm-homepage-v2 .tm-home-faq-item{
  border-color:rgba(15,23,42,.065) !important;
  box-shadow:none !important;
  background:rgba(255,255,255,.64) !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-card:hover,
body.tm-saas .tm-homepage-v2 .tm-home-link-grid a:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 28px rgba(15,23,42,.12) !important;
  border-color: rgba(37,99,235,.30) !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier--pro{
  background:rgba(255,255,255,.74) !important;
  border-color:rgba(37,99,235,.16) !important;
  box-shadow:none !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-faq-item{
  padding-left:0;
  padding-right:0;
  border-left:0 !important;
  border-right:0 !important;
  border-radius:0 !important;
}

@media (max-width:767.98px){
  body.tm-saas.tm-mode-home .tm-home-hero__app{
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }
}
/* TEMPMY_FLATTEN_BATCH_2_HOME */
body.tm-saas .tm-homepage-v2 .tm-home-card,
body.tm-saas .tm-homepage-v2 .tm-home-step,
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier{
  background:transparent !important;
  border-color:rgba(15,23,42,.045) !important;
  box-shadow:none !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-card{
  padding:18px 0;
}

body.tm-saas .tm-homepage-v2 .tm-home-step{
  padding:20px 0;
  text-align:left;
}

body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier{
  padding:22px 0;
  border-left:0 !important;
  border-right:0 !important;
  border-radius:0 !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-card__icon{
  width:auto;
  height:auto;
  display:inline-flex;
  margin:0 0 10px;
  border-radius:0;
  background:transparent !important;
  color:#2563EB;
  font-size:17px;
}

body.tm-saas .tm-homepage-v2 .tm-home-step__num{
  width:auto;
  height:auto;
  margin:0 0 10px;
  border-radius:0;
  background:transparent !important;
  box-shadow:none !important;
  color:#2563EB;
  font-size:13px;
  line-height:1;
}

@media (max-width:767.98px){
  body.tm-saas .tm-homepage-v2 .tm-home-card,
  body.tm-saas .tm-homepage-v2 .tm-home-step,
  body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier{
    padding:14px 0;
  }
}
/* TEMPMY_REPAIR_BATCH_1_HOME */
body.tm-saas .tm-homepage-v2 .tm-home-hero__app{
  width:100%;
  max-width:1120px;
  margin:24px auto 0;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox{
  width:100%;
  padding-top:0;
  padding-bottom:0;
  font-size:16px;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox-app{
  width:100%;
  max-width:1120px;
  margin:0 auto;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox-grid{
  display:block !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-card--controls{
  max-width:760px;
  margin:0 auto !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-card__icon{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-card,
body.tm-saas .tm-homepage-v2 .tm-home-step,
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier{
  padding:22px 0;
  min-height:0;
  border-color:rgba(15,23,42,.06) !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-card h3,
body.tm-saas .tm-homepage-v2 .tm-home-step h3,
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier h3{
  font-size:17px;
  line-height:1.25;
}

body.tm-saas .tm-homepage-v2 .tm-home-card p,
body.tm-saas .tm-homepage-v2 .tm-home-step p{
  font-size:14.5px;
  line-height:1.55;
}

body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier__list li{
  font-size:14.5px;
  line-height:1.45;
}

@media (min-width:768px){
  body.tm-saas .tm-homepage-v2 .tm-home-card-grid,
  body.tm-saas .tm-homepage-v2 .tm-home-steps,
  body.tm-saas .tm-homepage-v2 .tm-home-pricing-grid{
    gap:24px;
  }
}

@media (max-width:767.98px){
  body.tm-saas .tm-homepage-v2 .tm-home-hero__app,
  body.tm-saas.tm-mode-home .tm-home-hero__app{
    margin-top:14px;
    padding:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-card,
  body.tm-saas .tm-homepage-v2 .tm-home-step,
  body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier{
    padding:16px 0;
  }
}

/* TEMPMY_HOME_HERO_MOBILE_REFOCUS_V1 */
@media (max-width:767.98px){
  body.tm-saas .tm-homepage-v2 .tm-home-hero__app,
  body.tm-saas.tm-mode-home .tm-home-hero__app{
    max-width:920px;
    padding:16px !important;
    border-radius:22px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox-app{
    max-width:100%;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox-app__top{
    display:none !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox-grid{
    display:block !important;
    gap:0 !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-card--messages{
    display:none !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-card--controls{
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-card--controls .tmx-card__head{
    display:none !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-card--controls .tmx-card__body{
    padding:0 !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-email-copy{
    display:flex !important;
    flex-direction:column;
    align-items:stretch;
    gap:8px;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-email-copy .tmx-email-field{
    width:100%;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-email-input{
    min-height:54px;
    font-size:15px;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-email-copy .tmx-actions{
    display:flex !important;
    width:100%;
    margin:0;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app #tmCopyEmailBtn{
    width:100% !important;
    min-height:46px;
    padding-inline:14px;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-gen-meta{
    margin-top:2px;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-gen-meta__tag{
    display:none;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-thumbzone{
    gap:10px;
    margin-top:8px;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-microcopy{
    margin:0;
    font-size:12.5px;
    line-height:1.45;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-microcopy + .tmx-microcopy{
    display:none;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-home-open-row{
    display:flex;
    flex-direction:column;
    gap:8px;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-home-open-row #tmRefreshBtn{
    display:none !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-home-open-row .tmx-btn{
    width:100%;
  }
}

/* TEMPMY_PRODUCT_UI_REPAIR_20260625 */
body.tm-saas .tm-homepage-v2 .tm-home-hero{
  padding-top:clamp(22px,3.4vw,42px) !important;
  padding-bottom:34px !important;
}
body.tm-saas .tm-homepage-v2 .tm-home-hero__copy{
  max-width:920px;
}
body.tm-saas .tm-homepage-v2 h1{
  max-width:900px;
  font-size:clamp(38px,5.2vw,58px);
  line-height:1.02;
}
body.tm-saas .tm-homepage-v2 .tm-home-hero__subtitle{
  max-width:660px;
}
body.tm-saas .tm-homepage-v2 .tm-home-hero__app,
body.tm-saas.tm-mode-home .tm-home-hero__app{
  max-width:1040px;
  margin:26px auto 0;
  padding:0 !important;
  border-radius:24px !important;
  background:#fff !important;
  border:1px solid rgba(15,23,42,.10) !important;
  box-shadow:0 16px 44px rgba(15,23,42,.09) !important;
}
body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox{
  padding:0 !important;
}
body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox-app{
  border:0 !important;
  border-radius:24px !important;
  box-shadow:none !important;
}
body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox-app__top{
  border-top-left-radius:24px;
  border-top-right-radius:24px;
}
body.tm-saas .tm-homepage-v2 .tm-home-section{
  padding:42px 0;
}
body.tm-saas .tm-homepage-v2 .tm-home-card,
body.tm-saas .tm-homepage-v2 .tm-home-step,
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier,
body.tm-saas .tm-homepage-v2 .tm-home-faq-item{
  box-shadow:none !important;
}
body.tm-saas .tm-homepage-v2 .tm-home-card__icon{
  background:#F8FAFC;
  border:1px solid rgba(15,23,42,.08);
}
@media (max-width:767.98px){
  body.tm-saas .tm-homepage-v2 .tm-home-hero{padding-top:40px !important;padding-bottom:40px !important;}
  body.tm-saas .tm-homepage-v2 h1{font-size:34px;line-height:1.08;}
  body.tm-saas .tm-homepage-v2 .tm-home-hero__subtitle{font-size:15.5px;line-height:1.48;}
  body.tm-saas .tm-homepage-v2 .tm-home-hero__app,
  body.tm-saas.tm-mode-home .tm-home-hero__app{margin-top:12px;padding:0 !important;border-radius:18px !important;}
  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox-app{border-radius:20px !important;}
  body.tm-saas .tm-homepage-v2 .tm-home-section{padding:30px 0;}
}

/* TEMPMY_TRUST_ROW_V1 */
.trust-row{display:flex;flex-wrap:wrap;gap:.4rem .9rem;list-style:none;padding:0;margin:0 0 1rem}
.trust-row li{display:inline-flex;align-items:center;gap:.35rem;font-size:.8rem;color:#64748b}
.trust-row__icon{font-size:.85rem;color:var(--tm-accent,#06B6D4)}

/* TEMPMY_HERO_TIGHT_V1 */
body.tm-saas .tm-homepage-v2 .tm-home-hero__subtitle{
  font-size:1rem;
  color:#475569;
  max-width:34ch;
  margin:0 0 1rem;
}

/* TEMPMY_ADDRESS_NOTE_V1 */
.address-box__note{
  font-size:.75rem;
  color:#64748b;
  margin-top:.75rem;
  text-align:center;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:.3rem;
}
.address-box__link{
  color:var(--tm-primary,#2563EB);
  font-weight:600;
  text-decoration:none;
}
.address-box__link:hover{text-decoration:underline;}

/* TEMPMY_HOME_MOBILE_POLISH_20260626 */
@media (max-width:767.98px){
  body.tm-saas .tm-homepage-v2 .tm-home-section__head p,
  body.tm-saas .tm-homepage-v2 .tm-home-card p,
  body.tm-saas .tm-homepage-v2 .tm-home-step p,
  body.tm-saas .tm-homepage-v2 .tm-home-faq-item p,
  body.tm-saas .tm-homepage-v2 .tm-home-seo-box p,
  body.tm-saas .tm-homepage-v2 .trust-row li,
  body.tm-saas .tm-homepage-v2 .address-box__note,
  body.tm-saas .tm-homepage-v2 .tmx-microcopy,
  body.tm-saas .tm-homepage-v2 .tmx-gen-meta{
    color:#475569 !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-card p,
  body.tm-saas .tm-homepage-v2 .tm-home-step p,
  body.tm-saas .tm-homepage-v2 .tm-home-faq-item p,
  body.tm-saas .tm-homepage-v2 .tm-home-seo-box p{
    font-size:15px;
    line-height:1.6;
  }

  body.tm-saas .tm-homepage-v2 .trust-row li,
  body.tm-saas .tm-homepage-v2 .address-box__note,
  body.tm-saas .tm-homepage-v2 .tmx-microcopy{
    font-size:13px !important;
    line-height:1.45 !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-card--controls .tmx-card__body{
    padding-top:12px !important;
    padding-bottom:12px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-email-copy{
    gap:6px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-thumbzone{
    margin-top:6px !important;
    gap:8px !important;
  }
}

@media (max-width:575.98px){
  html.tm-cookie-visible body.tm-saas.tm-mode-home .tm-footer-premium{
    margin-bottom:0;
  }
}

/* TEMPMY_PLAN_FEATURE_HERO_V1 */
.plan__feature--hero{
  font-size:.95rem;
  padding:.6rem .75rem !important;
  border-radius:.6rem !important;
  background:linear-gradient(135deg,rgba(37,99,235,.08),rgba(6,182,212,.08)) !important;
  border:1px solid rgba(37,99,235,.15) !important;
  margin-bottom:.6rem;
  list-style:none;
}
.plan__feature--hero::before{content:none !important;}

/* TEMPMY_SECTION_EYEBROW_V1 */
body.tm-saas .tm-homepage-v2 .tm-home-section__kicker{
  display:inline-block !important;
  padding:0 !important;
  background:none !important;
  border:none !important;
  border-radius:0 !important;
  font-size:.72rem !important;
  font-weight:700 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  color:var(--tm-accent,#06B6D4) !important;
  margin-bottom:.4rem !important;
}

/* TEMPMY_A11Y_QUALITY_FLOOR_V1 */
@view-transition{navigation:auto;}

:where(a,button,[role="button"]):focus-visible{
  outline:2px solid var(--tm-primary,#2563EB) !important;
  outline-offset:3px;
  border-radius:4px;
}

/* TEMPMY_FULL_VISUAL_REPAIR_20260626 */
body.tm-saas .tm-homepage-v2{
  background:linear-gradient(180deg,#fff 0%,#f8fafc 44%,#fff 100%);
}

body.tm-saas .tm-homepage-v2 .tm-home-hero{
  padding-top:clamp(40px,6vw,80px) !important;
  padding-bottom:clamp(40px,6vw,80px) !important;
  background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__grid{
  margin-bottom:0;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__title{
  max-width:880px;
  margin-bottom:12px;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__subtitle{
  max-width:48ch;
  color:#475569 !important;
}

body.tm-saas .tm-homepage-v2 .trust-row{
  margin-top:14px;
  margin-bottom:0;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__app,
body.tm-saas.tm-mode-home .tm-home-hero__app{
  max-width:1020px;
  margin-top:22px !important;
  overflow:visible;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox-grid{
  gap:18px;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-card--controls .tmx-card__body{
  padding-bottom:16px;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-email-copy{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-email-copy .tmx-actions{
  margin:0;
}

body.tm-saas .tm-homepage-v2 .tm-home-hero__app #tmCopyEmailBtn{
  min-width:132px;
  white-space:nowrap;
}

body.tm-saas .tm-homepage-v2 .tm-home-section{
  position:relative;
  padding:80px 0;
  background:transparent;
}

body.tm-saas .tm-homepage-v2 .tm-home-benefits,
body.tm-saas .tm-homepage-v2 .tm-home-pricing,
body.tm-saas .tm-homepage-v2 .tm-home-seo-text{
  background:#fff;
}

body.tm-saas .tm-homepage-v2 .tm-home-how,
body.tm-saas .tm-homepage-v2 .tm-home-faq{
  background:#f8fafc;
}

body.tm-saas .tm-homepage-v2 .tm-home-section__head{
  margin-bottom:26px;
}

body.tm-saas .tm-homepage-v2 .tm-home-section__head p{
  color:#475569 !important;
  line-height:1.65;
}

body.tm-saas .tm-homepage-v2 .tm-home-card,
body.tm-saas .tm-homepage-v2 .tm-home-step,
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier,
body.tm-saas .tm-homepage-v2 .tm-home-faq-item{
  border-color:rgba(15,23,42,.085) !important;
  box-shadow:0 8px 22px rgba(15,23,42,.045) !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-card p,
body.tm-saas .tm-homepage-v2 .tm-home-step p,
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier li,
body.tm-saas .tm-homepage-v2 .tm-home-faq-item p{
  color:#475569 !important;
  line-height:1.58;
}

body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier{
  min-height:100%;
}

body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier__cta{
  margin-top:auto;
}

body.tm-saas .tm-homepage-v2 .tm-home-faq-item summary{
  min-height:52px;
  display:flex;
  align-items:center;
  padding-top:10px;
  padding-bottom:10px;
}

body.tm-saas .tm-homepage-v2 .tm-home-faq-item summary::after{
  top:50%;
  transform:translateY(-50%);
}

@media (max-width:767.98px){
  body.tm-saas .tm-homepage-v2 .tm-home-hero{
    padding-top:40px !important;
    padding-bottom:40px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__title{
    font-size:32px;
    line-height:1.08;
    margin-bottom:10px;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__subtitle{
    max-width:none;
    margin-bottom:10px;
  }

  body.tm-saas .tm-homepage-v2 .trust-row{
    gap:6px 10px;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app,
  body.tm-saas.tm-mode-home .tm-home-hero__app{
    margin-top:10px !important;
    border-radius:18px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox-app__top{
    padding:9px 10px;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-inbox-grid{
    gap:10px;
    padding:10px;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-email-copy{
    grid-template-columns:1fr;
    gap:8px;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app #tmCopyEmailBtn{
    width:100% !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-section{
    padding:40px 0;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-section__head{
    margin-bottom:18px;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-card,
  body.tm-saas .tm-homepage-v2 .tm-home-step,
  body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier{
    padding:16px;
  }
}

/* TEMPMY_HOVER_CONTRAST_FIX_V1 */
body.tm-saas .tm-homepage-v2 .tm-home-btn--primary:hover{
  background:linear-gradient(135deg,#1D4ED8,#0891B2) !important;
  color:#fff !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-btn--secondary:hover{
  background:#F1F5F9 !important;
  color:#0F172A !important;
  border-color:#CBD5E1 !important;
}

/* ── TEMPMY_MOBILE_REPAIR_20260626 ──────────────────────────────────────────
   Fixes 5 visible mobile issues without touching any backend, routes, or
   architecture. CSS only. File: assets/css/tm-home-v2.css
   ──────────────────────────────────────────────────────────────────────── */

/* 1. COPY BUTTON STATE BUG
   Reinforce the is-copied toggle with higher specificity so nothing in
   tm-inbox-pages.css or bootstrap can accidentally un-hide the wrong label.
   Default: show copy icon + label, hide copied icon + label.
   Copied state: hide copy icon + label, show copied icon + label. */
#tmCopyEmailBtn .tmx-copied-icon,
#tmCopyEmailBtn .tmx-copied-label {
  display: none !important;
}
#tmCopyEmailBtn.is-copied .tmx-copy-icon,
#tmCopyEmailBtn.is-copied .tmx-copy-label {
  display: none !important;
}
#tmCopyEmailBtn.is-copied .tmx-copied-icon,
#tmCopyEmailBtn.is-copied .tmx-copied-label {
  display: inline !important;
}

/* 2. GENERATOR CARD — COMPACT MOBILE
   Tighten internal spacing of the email/copy/action area so all controls
   fit comfortably on 375px–390px iPhone widths. */
@media (max-width: 767.98px) {
  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-card__body {
    padding: 10px 10px 12px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-email-copy {
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-email-field {
    width: 100% !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-email-input {
    min-height: 48px !important;
    font-size: 14px !important;
    padding: 0 10px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-actions {
    width: 100% !important;
    margin: 0 !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app #tmCopyEmailBtn {
    width: 100% !important;
    min-height: 44px !important;
    font-size: 14px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-gen-meta {
    margin-top: 4px !important;
    margin-bottom: 0 !important;
    font-size: 11.5px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-gen-upsell {
    margin: 3px 0 0 !important;
    font-size: 11.5px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-thumbzone {
    margin-top: 6px !important;
    gap: 7px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-microcopy {
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-home-open-row {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
    margin-top: 0 !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-home-open-row .tmx-btn {
    flex: 1 1 calc(50% - 4px) !important;
    min-width: 0 !important;
    font-size: 13px !important;
    padding: 0 8px !important;
    min-height: 40px !important;
    white-space: nowrap !important;
  }

  /* Hide the Refresh button on homepage mobile — redundant with New address */
  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-home-open-row #tmRefreshBtn {
    display: none !important;
  }

  /* 3. MOBILE HERO SPACING — pull generator up, reduce vertical waste */
  body.tm-saas .tm-homepage-v2 .tm-home-hero {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__grid {
    gap: 8px !important;
    margin-bottom: 6px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__title {
    font-size: 28px !important;
    line-height: 1.1 !important;
    margin-bottom: 6px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__subtitle {
    font-size: 14px !important;
    line-height: 1.45 !important;
    margin-bottom: 8px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-eyebrow {
    font-size: 11.5px !important;
    padding: 4px 10px 4px 7px !important;
    margin-bottom: 8px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app,
  body.tm-saas.tm-mode-home .tm-home-hero__app {
    margin-top: 8px !important;
    border-radius: 16px !important;
  }

  /* 4. BOTTOM OVERLAP — safe-area aware padding so buttons aren't hidden
     behind the browser chrome or bottom nav bar. Uses env() with a
     fallback so it degrades gracefully. Kept minimal (not huge). */
  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-home-open-row {
    padding-bottom: max(env(safe-area-inset-bottom, 0px), 4px) !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-card__body {
    padding-bottom: max(calc(env(safe-area-inset-bottom, 0px) + 12px), 12px) !important;
  }

  /* 5. TRUST BULLETS — clean row alignment on narrow widths */
  body.tm-saas .tm-homepage-v2 .trust-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 5px 12px !important;
    margin-top: 10px !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  body.tm-saas .tm-homepage-v2 .trust-row li {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 12px !important;
    color: #475569 !important;
    white-space: nowrap !important;
    line-height: 1.3 !important;
  }

  body.tm-saas .tm-homepage-v2 .trust-row .trust-row__icon {
    font-size: 11px !important;
    color: #06B6D4 !important;
    flex-shrink: 0 !important;
  }
}

/* TEMPMY_PHASE2_POLISH_20260626 */

/* 1. Copy button — green success state */
#tmCopyEmailBtn.is-copied {
  background: linear-gradient(135deg,#059669,#10B981) !important;
  box-shadow: 0 4px 14px rgba(5,150,105,.22) !important;
  border-color: transparent !important;
}

/* 2. Generator card — lighter shadow on mobile */
@media (max-width:767.98px) {
  body.tm-saas .tm-homepage-v2 .tm-home-hero__app,
  body.tm-saas.tm-mode-home .tm-home-hero__app {
    box-shadow: 0 2px 12px rgba(15,23,42,.07) !important;
  }
}

/* 3. Open inbox — primary CTA, stacked above "New address" on mobile */
@media (max-width:767.98px) {
  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-home-open-row {
    flex-direction: column !important;
    gap: 6px !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-home-open-row .tmx-btn {
    flex: 1 0 100% !important;
    min-height: 44px !important;
    justify-content: center !important;
    white-space: nowrap !important;
  }

  /* The anchor (Open inbox) gets primary styling and rises above New address */
  body.tm-saas .tm-homepage-v2 .tm-home-hero__app .tmx-home-open-row a.tmx-btn {
    order: -1 !important;
    background: linear-gradient(135deg,#2563EB,#06B6D4) !important;
    color: #fff !important;
    border-color: transparent !important;
    font-weight: 700 !important;
    font-size: 14px !important;
  }
}

/* 4. Pricing tier cards — restore full card look (border-left/right and radius
   were stripped by FLATTEN_BATCH_2; Free and Pro need to read as distinct cards) */
body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier {
  border: 1px solid rgba(15,23,42,.085) !important;
  border-radius: 14px !important;
  padding: 22px !important;
  background: #fff !important;
}

body.tm-saas .tm-homepage-v2 .tm-home-pricing-tier--pro {
  border-color: rgba(37,99,235,.30) !important;
  background: linear-gradient(180deg,#eff6ff 0%,#fff 60%) !important;
}

/* 5. Benefit and step cards — white card look on mobile so they read as distinct
   items against the section background rather than a borderless list */
@media (max-width:767.98px) {
  body.tm-saas .tm-homepage-v2 .tm-home-card {
    padding: 16px !important;
    background: #fff !important;
    border: 1px solid rgba(15,23,42,.07) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
  }

  body.tm-saas .tm-homepage-v2 .tm-home-step {
    padding: 16px !important;
    background: #fff !important;
    border: 1px solid rgba(15,23,42,.07) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    text-align: left !important;
  }
}

/* TEMPMY_DEAI_TYPOGRAPHY_V1 — remove gradient clip-path text on the hero
   highlight span and pull both H1 and section h2 font-weight back from 950
   to 800. Keeps brand blue; removes the AI-generated landing-page tells. */
body.tm-saas .tm-homepage-v2 .tm-home-highlight{
  background:none !important;
  -webkit-background-clip:unset !important;
  background-clip:unset !important;
  color:var(--tm-primary,#2563EB) !important;
}
body.tm-saas .tm-homepage-v2 h1,
body.tm-saas .tm-homepage-v2 .tm-home-section__head h2{
  font-weight:800 !important;
}


/* TEMPMY_CONVERSION_HOME_V1 */
.tm-conversion-home{
  padding-bottom:24px;
}

.tm-home-shell{
  padding:clamp(16px,3vw,28px) 0 10px;
}

.tm-home-shell__grid{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(280px, 340px);
  gap:24px;
  align-items:start;
}

.tm-home-shell__main,
.tm-home-shell__aside{
  min-width:0;
}

.tm-home-rail{
  display:grid;
  gap:16px;
}

.tm-home-rail--sticky{
  position:sticky;
  top:108px;
}

.tm-home-rail__panel{
  padding:20px;
  border-radius:22px;
  background:var(--tm-surface);
  border:1px solid var(--tm-border);
  box-shadow:var(--tm-shadow-xs);
}

.tm-home-rail__panel--ad{
  background:linear-gradient(180deg, rgba(37,99,235,.06), rgba(6,182,212,.04));
}

.tm-home-rail__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-bottom:10px;
  color:var(--tm-primary);
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.tm-home-rail__panel h2{
  margin:0 0 8px;
  font-size:20px;
  line-height:1.15;
}

.tm-home-rail__panel p{
  margin:0 0 16px;
  color:var(--tm-muted);
}

.tm-home-link-grid--rail{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  justify-content:stretch;
}

.tm-home-link-grid--rail a{
  justify-content:flex-start;
}

.tm-home-rail__bullets{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
}

.tm-home-rail__bullets li{
  position:relative;
  padding-left:18px;
  color:var(--tm-muted);
}

.tm-home-rail__bullets li::before{
  content:"";
  position:absolute;
  left:0;
  top:.6em;
  width:8px;
  height:8px;
  border-radius:999px;
  background:linear-gradient(135deg, #2563EB, #06B6D4);
}

.tm-home-hero__ad{
  margin-top:18px;
  padding:14px;
  border-radius:18px;
  border:1px solid var(--tm-border);
  background:linear-gradient(180deg, rgba(255,255,255,.9), rgba(248,250,252,.92));
}

.tm-home-hero__ad > *{
  max-width:100%;
}

@media (max-width: 991.98px){
  .tm-home-shell__grid{
    grid-template-columns:1fr;
  }

  .tm-home-rail--sticky{
    position:static;
  }

  .tm-home-shell__aside{
    order:-1;
  }
}