@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800;900&family=Fraunces:opsz,wght@9..144,700;9..144,800;9..144,900&display=swap'); /* Hypnotic Meditations — Homepage Design System Source of truth: hypnoticmeditations.ai homepage Applied late in as a visual normalization layer. */ :root{ --hm-ink:#111018; --hm-night:#15101e; --hm-night-2:#251633; --hm-purple:#6f3cc3; --hm-purple-2:#9b6ee6; --hm-gold:#e8b64f; --hm-gold-2:#f5d38e; --hm-paper:#ffffff; --hm-soft:#f6f1fb; --hm-cream:#fffaf2; --hm-muted:#6f6878; --hm-line:#e8dff0; --hm-green:#168a58; --hm-green-soft:#eaf7f0; --hm-shadow:0 20px 55px rgba(31,18,45,.11); } html{scroll-behavior:smooth} body{ font-family:'DM Sans',Arial,sans-serif !important; background:var(--hm-paper); color:var(--hm-ink); -webkit-font-smoothing:antialiased; } h1,h2{ font-family:'Fraunces',Georgia,serif !important; letter-spacing:-.04em !important; } h3,h4,h5,h6{font-family:'DM Sans',Arial,sans-serif !important} img{max-width:100%} /* Announcement / urgency bars */ .topbar,.sticky-offer-bar,.vip-banner,.announcement-bar,.promo-bar{ background:#0e0b13 !important; color:#fff !important; border-color:rgba(255,255,255,.08) !important; box-shadow:none !important; } .topbar a,.sticky-offer-bar a,.vip-banner a,.announcement-bar a,.promo-bar a{ color:var(--hm-gold-2) !important; } /* Site navigation */ .hm-nav,.nav,.site-head,header.nav,.site-header{ background:rgba(255,255,255,.95) !important; border-bottom:1px solid rgba(30,20,40,.08) !important; box-shadow:none !important; backdrop-filter:blur(16px); } .hm-nav-logo img,.nav-logo img{height:32px} .hm-nav a,.nav a,.site-head a{font-family:'DM Sans',Arial,sans-serif} /* Hero normalization */ .hero,.page-hero,.product-hero,.collection-hero,.article-hero,.seo-hero{ background: radial-gradient(circle at 82% 18%,rgba(155,110,230,.22),transparent 31%), radial-gradient(circle at 18% 72%,rgba(232,182,79,.12),transparent 28%), linear-gradient(145deg,var(--hm-night) 0%,#21142e 56%,#160f20 100%) !important; color:#fff !important; border-color:rgba(255,255,255,.08) !important; } main > .hero, main > .article-hero, main > .seo-hero, main .hero:first-child{ box-shadow:0 0 0 100vmax var(--hm-night); clip-path:inset(0 -100vmax); } .hero h1,.page-hero h1,.product-hero h1,.collection-hero h1,.article-hero h1,.seo-hero h1{ color:#fff !important; font-family:'Fraunces',Georgia,serif !important; letter-spacing:-.045em !important; line-height:.98 !important; } .hero h1 em,.hero h1 .emphasis,.hero h1 > span, .page-hero h1 em,.product-hero h1 em,.collection-hero h1 em{ color:var(--hm-gold-2) !important; } .hero p,.hero .lead,.hero .dek,.hero .subheadline,.hero .hero-sub, .page-hero p,.product-hero p,.collection-hero p,.article-hero p,.seo-hero p{ color:rgba(255,255,255,.76) !important; } .hero .kicker,.hero .eyebrow,.hero-kicker,.page-hero .kicker,.article-hero .kicker{ color:var(--hm-gold-2) !important; } .hero-media,.product-img,.hero img,.product-hero img{ border-radius:24px !important; box-shadow:0 26px 55px rgba(0,0,0,.28) !important; } /* Buttons / CTAs */ .btn,.button,.cta,.buy-btn,.sales-btn,.goal-rec-btn,.btn-primary,.btn-library,.btn-bundle,.btn-anchor, a[class*="cta"],button[class*="cta"]{ border-radius:999px !important; background:linear-gradient(135deg,var(--hm-gold),#d78f20) !important; color:#201605 !important; border:1px solid transparent !important; box-shadow:0 14px 30px rgba(216,145,33,.24) !important; font-family:'DM Sans',Arial,sans-serif !important; font-weight:900 !important; text-decoration:none !important; } .btn:hover,.button:hover,.cta:hover,.buy-btn:hover,.sales-btn:hover,.btn-primary:hover, a[class*="cta"]:hover,button[class*="cta"]:hover{ transform:translateY(-2px) !important; } .btn-secondary,.secondary,.ghost,.goal-rec-ghost{ background:#fff !important; color:var(--hm-ink) !important; border:1px solid var(--hm-line) !important; box-shadow:none !important; } /* Section backgrounds + typography */ .section.soft,.soft,.wash,.alt-section,.light-section{ background:var(--hm-soft) !important; } .section-title,section h2,.content h2,article h2{ letter-spacing:-.04em !important; } .section-sub,.section-lead,.muted,.dek,.lead-muted{ color:var(--hm-muted) !important; } /* Cards */ .card,.offer,.offer-card,.price-block,.verdict,.toc,.step,.practice-step,.outcome-card,.benefit, .include-card,.review,.testimonial,.testi,.bundle-card,.product-card,.goal-card,.creator-stat, .result-testimonial,.faqitem,.hm-footer-box{ border-radius:20px !important; border-color:var(--hm-line) !important; box-shadow:0 10px 30px rgba(42,25,60,.055); } .card,.verdict,.toc,.practice-step,.outcome-card,.benefit,.include-card,.review,.testimonial,.testi, .product-card,.goal-card,.creator-stat,.faqitem{ background:#fff; } .outcome-icon,.step-icon,.include-icon,.goal-icon-wrap,.section-icon{ border-radius:14px !important; } /* Trust / checks */ .check,.lib-check,.check-icon,.checkmark{ background:var(--hm-green-soft) !important; color:var(--hm-green) !important; border-color:#cfe9da !important; } .checks li:before,.check-list li:before,.benefits li:before{ color:var(--hm-green) !important; } .check-row,.deliverable,.lib-item{ border-radius:14px !important; } .check-row .check,.deliverable .check{ background:var(--hm-green-soft) !important; color:var(--hm-green) !important; } /* Offer / price treatment */ .offer-card,.price-block,.stackhero,.library-card{ border-color:var(--hm-line) !important; box-shadow:var(--hm-shadow) !important; } .price-current,.price,.lib-price,.anchor-price-now{ font-family:'Fraunces',Georgia,serif !important; color:var(--hm-ink) !important; } .save,.bundle-savings,.lib-save{ background:var(--hm-green-soft) !important; color:var(--hm-green) !important; border-radius:999px !important; } /* FAQ */ details{ border-color:var(--hm-line) !important; } summary{ font-family:'DM Sans',Arial,sans-serif !important; font-weight:850 !important; } details[open]{ background:rgba(246,241,251,.42); } /* Article/editorial polish */ article a,main p a,main li a{ text-decoration-color:rgba(111,60,195,.35); text-underline-offset:3px; } blockquote,.sean-story,.fact-note{ border-color:var(--hm-purple) !important; border-radius:18px !important; } figure img{ border-radius:22px !important; } /* Comparison / labels / badges */ .badge,.tag,.pill,.bundle-tag,.hero-kicker,.eyebrow,.section-label{ border-radius:999px !important; } .stars,.nav-stars{color:var(--hm-gold) !important} /* Footer: match homepage/store footer family */ footer:not(.hm-footer-wrap){ background: radial-gradient(circle at top left,rgba(212,146,42,.14),transparent 30%), radial-gradient(circle at top right,rgba(124,58,237,.10),transparent 28%), linear-gradient(180deg,#14110d 0%,#0b0a08 100%) !important; color:#f6f1e8 !important; border-top:1px solid rgba(255,255,255,.08) !important; } footer:not(.hm-footer-wrap) a{color:rgba(255,248,239,.72) !important} footer:not(.hm-footer-wrap) a:hover{color:var(--hm-gold-2) !important} /* Mobile */ @media(max-width:700px){ .hero,.page-hero,.product-hero,.collection-hero,.article-hero,.seo-hero{ padding-top:46px !important; padding-bottom:50px !important; } .hero h1,.page-hero h1,.product-hero h1,.collection-hero h1,.article-hero h1,.seo-hero h1{ font-size:clamp(38px,11.5vw,54px) !important; } .btn,.button,.cta,.buy-btn,.sales-btn,.btn-primary{ min-height:54px; } }