/* GenieHouse — export redesign */
@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&family=DM+Sans:wght@400;500;600;700&display=swap");
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
.geniehouse_body{
--navy:#2A235F;
--navy2:#1F1A4F;
--sky:#21B1E9;
--sky-bright:#59CFFF;
--orange:#FC8912;
--orange2:#F47C00;
--purple:#433A89;
--blue:#21B1E9;
--gold:#FC8912;
--white:#FFFFFF;
--off:#F7F9FC;
--text:#2A235F;
--muted:#606A82;
--line:#E7ECF3;
--grad-hero:linear-gradient(135deg,#1F1A4F 0%,#433A89 100%);
--grad-dark:linear-gradient(135deg,#1F1A4F 0%,#433A89 100%);
--grad-cyan:linear-gradient(135deg,#1AA5DE 0%,#59CFFF 100%);
--grad-orange:linear-gradient(135deg,#F47C00 0%,#FFB347 100%);
--grad-neutral:linear-gradient(135deg,#FFFFFF 0%,#EEF3F8 100%);
--r:24px;
--r-sm:8px;
--r-full:999px;
}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.geniehouse_body{font-family:'DM Sans',sans-serif;color:var(--text);background:#fff;overflow-x:hidden}
.geniehouse_body h1,.geniehouse_body h2,.geniehouse_body h3,.geniehouse_body h4,.geniehouse_body h5{font-family:'Nunito','DM Sans',Arial,sans-serif}
.geniehouse_body h2,.geniehouse_body h3,.geniehouse_body h4,.geniehouse_body h5{line-height:1.2}
.geniehouse_body .hero-h1{line-height:1.08}
.geniehouse_body a{text-decoration:none;color:inherit}
.geniehouse_body img{max-width:100%;height:auto;display:block}
.geniehouse_body section{position:relative}
/* ── UTILITIES ── */
.container{max-width:1280px;margin:0 auto;padding:0 64px}
.tag{display:inline-flex;align-items:center;gap:6px;background:var(--orange);color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.75rem;padding:4px 14px;border-radius:99px;letter-spacing:.04em;text-transform:uppercase}
.tag.blue{background:var(--sky)}
.tag.navy{background:var(--navy)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:1rem;padding:14px 28px;border-radius:99px;cursor:pointer;border:none;transition:transform .15s,box-shadow .15s;white-space:nowrap}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.18)}
.btn-primary{background:var(--orange);color:#fff;box-shadow:0 4px 16px rgba(249,115,22,.4)}
.btn-primary:hover{background:var(--orange2)}
.btn-outline{background:rgba(255,255,255,.15);color:#fff;border:2px solid rgba(255,255,255,.7);backdrop-filter:blur(4px)}
.btn-outline:hover{background:rgba(255,255,255,.25)}
.btn-navy{background:var(--navy);color:#fff}
.btn-lg{font-size:1.125rem;padding:17px 36px}
.section-title{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:900;line-height:1.15}
.section-sub{font-size:1.05rem;color:var(--muted);margin-top:10px;line-height:1.6}
/* ── STICKY NAV ── */
#nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(42,35,95,.96);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.12);box-shadow:0 8px 28px rgba(31,26,79,.18)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:8px 64px;max-width:1280px;margin:0 auto;gap:24px}
.nav-logo{display:flex;align-items:center;gap:10px}
.logo-badge{display:flex;flex-direction:column;align-items:center;line-height:1}
.logo-badge .badge-tag{background:var(--orange);color:var(--navy);font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:.6rem;padding:2px 10px;border-radius:99px;letter-spacing:.08em}
.logo-badge .logo-study{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1.35rem;color:#fff;letter-spacing:-.01em}
.logo-badge .logo-hub{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1.35rem;color:var(--sky-bright);letter-spacing:-.01em}
.nav-links{display:flex;align-items:center;gap:24px}
.nav-links a{color:rgba(255,255,255,.8);font-weight:600;font-size:.9rem;transition:color .15s}
.nav-links a:hover{color:#fff}
.nav-cta{background:var(--orange);color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.9rem;padding:10px 22px;border-radius:99px;white-space:nowrap;transition:background .15s,transform .15s}
.nav-cta:hover{background:var(--orange2);transform:translateY(-1px)}
@media(max-width:768px){
.nav-links{display:none}
.logo-badge .logo-study,.logo-badge .logo-hub{font-size:1.15rem}
}
/* ── HERO ── */
#hero{background:var(--grad-hero);padding:100px 0 60px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.hero-left{}
.hero-eyebrow{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.hero-h1{font-size:clamp(2rem,5vw,3rem);font-weight:900;color:#fff;line-height:1.1;margin-bottom:16px}
.hero-h1 span{color:var(--sky-bright)}
.hero-sub{font-size:1.05rem;color:rgba(255,255,255,.85);line-height:1.65;margin-bottom:28px}
.hero-ctarow{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:36px}
.hero-stats{display:flex;gap:0;flex-wrap:wrap;margin-top:8px}
.hero-stat{display:flex;flex-direction:column;align-items:flex-start;padding:0 20px;border-left:2px solid rgba(255,255,255,.25)}.hero-stat:first-child{padding-left:0;border-left:none}
.hero-stat-icon{font-size:1.1rem}
.hero-stat-label{color:rgba(255,255,255,.55);font-size:.68rem;font-weight:600;font-family:'Nunito','DM Sans',Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase;margin-bottom:2px}.hero-stat-text{color:#fff;font-size:1rem;font-weight:800;font-family:'Nunito','DM Sans',Arial,sans-serif;line-height:1.2}
.hero-right{position:relative}
.hero-kv{border-radius:20px;box-shadow:0 24px 64px rgba(0,0,0,.35);width:100%}
@media(max-width:800px){
.hero-grid{grid-template-columns:1fr}
.hero-right{order:-1}
#hero{padding:90px 0 50px}
}
/* ── TRUST STRIP ── */
#trust{background:#fff;border-bottom:1px solid #E8EEF8}
.trust-stats-row{padding:28px 0;border-bottom:1px solid #EEF2FB}
.trust-inner{display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:nowrap}
.trust-item{display:flex;align-items:center;gap:10px;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.9rem;color:var(--navy);padding:0 28px}
.trust-icon{font-size:1.4rem}
.trust-divider{width:1px;height:36px;background:#D1DCF0;flex-shrink:0}
.trust-stat-number{font-size:1.5rem;color:var(--blue);font-weight:900}
/* PLE highlight band */
.trust-ple-band{background:linear-gradient(135deg,rgba(26,86,219,.06) 0%,rgba(123,47,190,.07) 100%);padding:18px 0}
.trust-ple-inner{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap}
.trust-ple-logo{width:36px;height:36px;border-radius:50%;background:var(--grad-hero);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.trust-ple-logo svg{width:18px;height:18px}
.trust-ple-title{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1.05rem;color:var(--blue);margin-bottom:2px}
.trust-ple-desc{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:600;font-size:.82rem;color:var(--muted);line-height:1.4}
.trust-ple-pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.trust-ple-pill{background:#fff;border:1.5px solid #C7D9F5;border-radius:99px;padding:4px 14px;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:700;font-size:.78rem;color:var(--navy)}
@media (max-width: 900px) {
.trust-inner {
flex-wrap: wrap;
justify-content: center;
gap: 8px 0;
}
.trust-item {
flex: 1 1 calc(50% - 8px);
min-width: 200px;
padding: 12px 16px;
box-sizing: border-box;
}
.trust-divider {
display: none;
}
}
@media (max-width: 640px) {
.trust-stats-row {
padding: 20px 0;
border-bottom: none;
}
.trust-inner {
flex-direction: column;
align-items: stretch;
gap: 0;
}
.trust-item {
flex: none;
width: 100%;
min-width: 0;
padding: 14px 16px;
gap: 12px;
border-bottom: none;
}
.trust-divider {
display: none;
}
.trust-item > div:not(.trust-icon) {
flex: 1;
min-width: 0;
}
.trust-item > div:not(.trust-icon) > div:last-child {
font-size: 0.82rem;
line-height: 1.45;
}
.trust-stat-number {
font-size: 1.35rem;
line-height: 1.2;
}
.trust-ple-inner {
flex-direction: column;
align-items: flex-start;
text-align: left;
gap: 12px;
}
.trust-ple-pills {
justify-content: flex-start;
}
}
/* ── PROBLEM HOOK ── */
#problem{background:var(--off);padding:72px 0}
.problem-inner{max-width:800px;margin:0 auto;text-align:center}
.problem-q{font-size:clamp(1.5rem,3.5vw,2.2rem);font-weight:900;color:var(--navy);line-height:1.3;margin-bottom:16px}
.problem-a{font-size:1.1rem;color:var(--muted);line-height:1.7}
.problem-answer{background:var(--grad-hero);border-radius:var(--r);padding:28px 36px;color:#fff}
.problem-answer h3{font-size:1.6rem;font-weight:900;margin-bottom:8px}
.problem-answer p{font-size:1rem;opacity:.9;line-height:1.6}
/* ── COMPARISON TABLE ── */
#compare{padding:80px 0;background:#fff}
.compare-title{text-align:center;margin-bottom:48px}
.compare-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0;border-radius:var(--r);overflow:hidden;box-shadow:0 8px 40px rgba(10,36,99,.12)}
.compare-col{}
.compare-head{padding:24px 20px;text-align:center;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1rem}
.compare-head.bad{background:#F1F5F9;color:var(--muted)}
.compare-head.good{background:var(--grad-hero);color:#fff}
.compare-head .emoji{font-size:1.8rem;display:block;margin-bottom:6px}
.compare-row{display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid #E8EEF8}
.compare-cell{padding:16px 20px;font-size:.9rem;line-height:1.5;display:flex;align-items:flex-start;gap:8px}
.compare-cell.bad{background:#FAFBFD;color:var(--muted)}
.compare-cell.good{background:linear-gradient(135deg,rgba(26,86,219,.04),rgba(123,47,190,.04));color:var(--text);font-weight:600}
.compare-cell .cell-icon{flex-shrink:0;margin-top:1px;font-size:.9rem}
.compare-footer{grid-column:1/-1;background:var(--grad-hero);padding:20px;text-align:center}
.compare-footer a{color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:1rem;display:inline-flex;align-items:center;gap:8px}
@media(max-width:640px){
.compare-grid,.compare-row{grid-template-columns:1fr}
.compare-col:first-child .compare-head.bad,.compare-col:nth-child(2) .compare-head.bad{display:none}
.compare-col:first-child .compare-cell.bad,.compare-col:nth-child(2) .compare-cell.bad{display:none}
}
/* ── DAILY MULTIPLIER ── */
#multiplier{background:var(--grad-dark);padding:80px 0;overflow:hidden}
.multiplier-inner{text-align:center;max-width:860px;margin:0 auto}
.multiplier-eyebrow{color:var(--sky-bright);font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.9rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:16px}
.multiplier-h2{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:900;color:#fff;margin-bottom:12px;line-height:1.2}
.multiplier-h2 span{color:var(--sky-bright)}
.multiplier-sub{color:rgba(255,255,255,.75);font-size:1.05rem;margin-bottom:44px;line-height:1.6}
.testimonials-row{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.tcard{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:var(--r);padding:24px;text-align:left;backdrop-filter:blur(4px)}
.tcard-quote{color:rgba(255,255,255,.9);font-size:.95rem;line-height:1.65;margin-bottom:16px;font-style:italic}
.tcard-result{display:inline-flex;align-items:center;gap:6px;background:rgba(56,189,248,.2);border:1px solid rgba(56,189,248,.3);border-radius:99px;padding:4px 12px;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.8rem;color:var(--sky-bright);margin-bottom:16px}
.tcard-author{color:rgba(255,255,255,.6);font-size:.82rem;font-weight:600}
.tcard-source{font-size:.75rem;color:rgba(255,255,255,.4);margin-top:4px}
.stars{color:#F59E0B;font-size:.9rem;margin-bottom:8px}
@media(max-width:768px){.testimonials-row{grid-template-columns:1fr}}
/* ── HOW A DAY WORKS ── */
#howday{padding:80px 0;background:var(--off)}
.howday-title{text-align:center;margin-bottom:52px}
.timeline{position:relative;max-width:900px;margin:0 auto}
.timeline::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:3px;background:linear-gradient(to bottom,var(--blue),var(--purple));transform:translateX(-50%);border-radius:99px}
.tl-item{display:grid;grid-template-columns:1fr 60px 1fr;gap:0;align-items:center;margin-bottom:28px;position:relative}
.tl-item.right .tl-content{order:3;text-align:left;padding-left:32px}
.tl-item.right .tl-dot{order:2}
.tl-item.right .tl-empty{order:1}
.tl-item.left .tl-content{order:1;text-align:right;padding-right:32px}
.tl-item.left .tl-dot{order:2}
.tl-item.left .tl-empty{order:3}
.tl-dot{display:flex;flex-direction:column;align-items:center;gap:4px;z-index:2}
.tl-time{background:var(--navy);color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:.75rem;padding:4px 10px;border-radius:99px;white-space:nowrap;box-shadow:0 2px 8px rgba(10,36,99,.3)}
.tl-circle{width:20px;height:20px;border-radius:50%;background:var(--orange);border:3px solid #fff;box-shadow:0 2px 8px rgba(249,115,22,.4)}
.tl-content{}
.tl-card{background:#fff;border-radius:var(--r-sm);padding:16px 20px;box-shadow:0 4px 16px rgba(10,36,99,.08);border:1px solid #E8EEF8}
.tl-card h4{font-size:1rem;font-weight:800;color:var(--navy);margin-bottom:4px}
.tl-card p{font-size:.85rem;color:var(--muted);line-height:1.5}
.tl-card .tl-icon{font-size:1.4rem;margin-bottom:6px}
.tl-empty{}
@media(max-width:640px){
.timeline::before{left:24px}
.tl-item{grid-template-columns:48px 1fr}
.tl-item.right .tl-content,.tl-item.left .tl-content{order:2;text-align:left;padding-left:24px;padding-right:0}
.tl-item.right .tl-dot,.tl-item.left .tl-dot{order:1}
.tl-item.right .tl-empty,.tl-item.left .tl-empty{display:none}
}
/* ── WHAT YOU GET (5 HUBS) ── */
#programme{padding:80px 0;background:#fff}
.prog-title{text-align:center;margin-bottom:48px}
.hubs-grid{display:flex;flex-wrap:wrap;gap:20px;justify-content:center}
.hub-card{background:var(--off);border-radius:var(--r);padding:28px 24px;border:2px solid transparent;transition:border-color .2s,box-shadow .2s;position:relative;overflow:hidden;flex:0 0 calc(33.33% - 14px);min-width:220px;max-width:340px;box-sizing:border-box}
.hub-card:hover{border-color:var(--sky);box-shadow:0 8px 32px rgba(62,146,204,.15)}
.hub-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px}
.hub-card:nth-child(1)::before{background:var(--blue)}
.hub-card:nth-child(2)::before{background:var(--orange)}
.hub-card:nth-child(3)::before{background:var(--purple)}
.hub-card:nth-child(4)::before{background:#10B981}
.hub-card:nth-child(5)::before{background:#F59E0B}
.hub-name{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1.05rem;color:var(--navy);margin-bottom:8px}
.hub-desc{font-size:.88rem;color:var(--muted);line-height:1.6}
.subjects-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.subject-chip{display:inline-flex;align-items:center;gap:5px;background:var(--off);border:1.5px solid #B8CCE8;border-radius:99px;padding:5px 14px;font-size:.8rem;font-weight:800;color:var(--navy);font-family:'Nunito','DM Sans',Arial,sans-serif}
/* ── CENTRE PHOTOS ── */
#photos{padding:80px 0;background:var(--off)}
.photos-title{text-align:center;margin-bottom:40px}
.photos-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.photo-item{border-radius:var(--r);overflow:hidden;position:relative}
.photo-item img{width:100%;height:280px;object-fit:cover;transition:transform .4s}
.photo-item:hover img{transform:scale(1.04)}
.photo-caption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(10,36,99,.8));color:#fff;padding:20px 16px 14px;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:700;font-size:.9rem}
@media(max-width:600px){.photos-grid{grid-template-columns:1fr}}
/* ── PLP PROOF ── */
#plp{padding:80px 0;background:#fff;overflow:hidden}
.plp-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.plp-left h2{font-size:clamp(1.8rem,4vw,2.4rem);font-weight:900;color:var(--navy);margin-bottom:16px}
.plp-left p{font-size:1rem;color:var(--muted);line-height:1.7;margin-bottom:24px}
.plp-points{display:flex;flex-direction:column;gap:14px}
.plp-point{display:flex;align-items:flex-start;gap:12px}
.plp-point-icon{width:36px;height:36px;border-radius:50%;background:var(--grad-hero);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.9rem;color:#fff}
.plp-point-text h4{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.95rem;color:var(--navy)}
.plp-point-text p{font-size:.85rem;color:var(--muted);margin-top:2px}
.plp-right{}
.plp-mockup{background:#fff;border-radius:20px;padding:0;box-shadow:0 24px 64px rgba(10,36,99,.18);overflow:hidden;border:1px solid #E0E9F5}
.plp-mock-header{background:var(--navy);padding:16px 22px;display:flex;align-items:center;justify-content:space-between}
.plp-mock-hname{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1rem;color:#fff}
.plp-mock-hmeta{font-size:.72rem;color:rgba(255,255,255,.6);font-weight:600}
.plp-mock-body{padding:18px 22px}
.plp-mock-section-label{display:inline-flex;background:var(--navy);color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.62rem;padding:3px 10px;border-radius:4px;letter-spacing:.05em;text-transform:uppercase;margin-bottom:6px}
.plp-mock-section-title{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1rem;color:var(--navy);margin-bottom:14px}
.plp-topic-row{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.plp-topic-name{font-size:.74rem;font-weight:700;color:var(--navy);width:140px;flex-shrink:0}
.plp-topic-bar-bg{flex:1;background:#F0F6FF;border-radius:99px;height:7px;overflow:hidden}
.plp-topic-fill{height:100%;border-radius:99px}
.plp-fill-critical{background:#EF4444;width:23%}
.plp-fill-critical-zero{background:#EF4444;width:3%}
.plp-fill-moderate{background:#F97316;width:42%}
.plp-fill-developing{background:#F59E0B;width:62%}
.plp-fill-strong{background:#10B981;width:80%}
.plp-fill-strong2{background:#10B981;width:83%}
.plp-topic-pct{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:.72rem;width:30px;text-align:right;flex-shrink:0}
.plp-topic-badge{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:700;font-size:.6rem;padding:2px 8px;border-radius:99px;flex-shrink:0}
.badge-critical{background:#FEE2E2;color:#DC2626}
.badge-moderate{background:#FEF3C7;color:#D97706}
.badge-strong{background:#D1FAE5;color:#059669}
.plp-legend{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.plp-legend-item{display:flex;align-items:center;gap:4px;font-size:.62rem;font-weight:600;color:var(--muted)}
.plp-legend-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.plp-divider{height:1px;background:#F0F6FF;margin:14px 0}
.plp-goals-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}
.plp-goal-card{border-radius:8px;padding:10px 12px;border:1px solid}
.plp-goal-critical{background:#FFF5F5;border-color:#FECACA}
.plp-goal-moderate{background:#FFFBEB;border-color:#FDE68A}
.plp-goal-name{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.72rem;margin-bottom:4px}
.plp-goal-target{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:.78rem;color:var(--orange)}
.plp-goal-desc{font-size:.66rem;color:var(--muted);line-height:1.4;margin-top:3px}
.plp-caption{color:var(--muted);font-size:.72rem;text-align:center;padding:10px 22px 14px;font-style:italic;border-top:1px solid #F0F6FF}
@media(max-width:768px){
.plp-grid{grid-template-columns:1fr}
.plp-right{order:-1}
}
/* ── PRICING ── */
#pricing{padding:80px 0;background:var(--off)}
.pricing-title{text-align:center;margin-bottom:16px}
.pricing-sub{text-align:center;font-size:1.05rem;color:var(--muted);margin-bottom:48px}
.pricing-cards{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:820px;margin:0 auto 40px}
.p-card{background:#fff;border-radius:var(--r);padding:36px 32px;border:2px solid #E8EEF8;position:relative;box-shadow:0 4px 20px rgba(10,36,99,.06)}
.p-card.featured{border-color:var(--orange);box-shadow:0 8px 40px rgba(249,115,22,.2)}
.p-card-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--orange);color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:.8rem;padding:4px 18px;border-radius:99px;white-space:nowrap}
.p-card-label{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.85rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
.p-card-price{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:2.8rem;color:var(--navy);line-height:1}
.p-card-price span{font-size:1rem;font-weight:600;color:var(--muted)}
.p-card-desc{font-size:.88rem;color:var(--muted);margin:12px 0 20px;line-height:1.5}
.p-features{list-style:none;display:flex;flex-direction:column;gap:10px}
.p-features li{display:flex;align-items:flex-start;gap:10px;font-size:.9rem;color:var(--text)}
.p-features li::before{content:'✓';color:var(--blue);font-weight:900;font-size:1rem;flex-shrink:0}
.pricing-note{max-width:820px;margin:0 auto;background:#fff;border-radius:var(--r-sm);padding:20px 24px;border:1px solid #E8EEF8;font-size:.88rem;color:var(--muted);line-height:1.6}
.pricing-note strong{color:var(--navy)}
.pricing-cta-row{text-align:center;margin-top:32px}
@media(max-width:600px){.pricing-cards{grid-template-columns:1fr}}
/* ── STRENGTH ANALYSIS (3-STEP) ── */
#strength{padding:80px 0;background:var(--grad-hero);overflow:hidden;scroll-margin-top:72px}
#visitForm{scroll-margin-top:88px}
.strength-inner{text-align:center;max-width:800px;margin:0 auto}
.strength-inner h2{color:#fff;font-size:clamp(1.8rem,4vw,2.6rem);font-weight:900;margin-bottom:12px}
.strength-inner .section-sub{color:rgba(255,255,255,.8)}
.steps-row{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:48px 0 36px}
.step-card{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:var(--r);padding:28px 20px;backdrop-filter:blur(4px);position:relative}
.step-num{position:absolute;top:-16px;left:50%;transform:translateX(-50%);width:32px;height:32px;border-radius:50%;background:var(--orange);color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1rem;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(249,115,22,.4)}
.step-icon{font-size:2rem;margin-bottom:14px}
.step-card h3{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1.05rem;color:#fff;margin-bottom:8px}
.step-card p{font-size:.88rem;color:rgba(255,255,255,.75);line-height:1.6}
.strength-cta{display:inline-flex;flex-direction:column;align-items:center;gap:8px}
.strength-small{font-size:.82rem;color:rgba(255,255,255,.6)}
@media(max-width:640px){.steps-row{grid-template-columns:1fr}}
/* ── LOCATIONS ── */
#locations{padding:80px 0;background:#fff}
.loc-title{text-align:center;margin-bottom:12px}
.loc-sub{text-align:center;font-size:1rem;color:var(--muted);margin-bottom:40px}
.loc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-bottom:40px}
.loc-card{border-radius:var(--r);border:2px solid #E8EEF8;padding:24px;transition:border-color .2s,box-shadow .2s;position:relative}
.loc-card:hover{border-color:var(--sky);box-shadow:0 8px 24px rgba(62,146,204,.12)}
.loc-card-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}
.loc-name{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1.05rem;color:var(--navy)}
.loc-badge{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.7rem;background:rgba(249,115,22,.1);color:var(--orange);border:1px solid rgba(249,115,22,.2);border-radius:99px;padding:3px 10px;white-space:nowrap}
.loc-addr{font-size:.82rem;color:var(--muted);margin-bottom:8px;line-height:1.5}
.loc-mrt{display:flex;align-items:center;gap:6px;font-size:.82rem;color:var(--text);font-weight:600;margin-bottom:14px}
.loc-mrt-icon{background:#EEF2FF;color:var(--blue);width:20px;height:20px;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:900}
.loc-openhouse{background:linear-gradient(135deg,rgba(26,86,219,.06),rgba(123,47,190,.06));border-radius:var(--r-sm);padding:10px 14px;font-size:.8rem}
.loc-openhouse strong{color:var(--navy);font-family:'Nunito','DM Sans',Arial,sans-serif}
.loc-openhouse span{color:var(--muted)}
.loc-openhouse-coming{color:var(--orange);font-weight:700}
.loc-cta-row{text-align:center}
/* ── FAQ ── */
#faq{padding:80px 0;background:var(--off)}
.faq-title{text-align:center;margin-bottom:48px}
.faq-list{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.faq-item{background:#fff;border-radius:var(--r-sm);border:1px solid #E8EEF8;overflow:hidden}
.faq-q{width:100%;text-align:left;background:none;border:none;cursor:pointer;padding:20px 24px;display:flex;justify-content:space-between;align-items:center;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:1rem;color:var(--navy);gap:16px}
.faq-q:hover{color:var(--blue)}
.faq-arrow{flex-shrink:0;width:24px;height:24px;border-radius:50%;background:var(--off);display:flex;align-items:center;justify-content:center;font-size:.75rem;transition:transform .2s,background .2s;color:var(--blue)}
.faq-item.open .faq-arrow{transform:rotate(180deg);background:var(--blue);color:#fff}
.faq-a{display:none;padding:0 24px 20px;font-size:.93rem;color:var(--muted);line-height:1.7;border-top:1px solid #F1F5F9}
.faq-item.open .faq-a{display:block}
/* ── FINAL CTA ── */
#final-cta{padding:80px 0;background:var(--grad-dark);overflow:hidden;text-align:center}
.fcta-inner{max-width:720px;margin:0 auto}
.fcta-inner h2{color:#fff;font-size:clamp(2rem,5vw,3rem);font-weight:900;margin-bottom:16px;line-height:1.1}
.fcta-inner h2 span{color:var(--sky-bright)}
.fcta-inner p{color:rgba(255,255,255,.8);font-size:1.05rem;margin-bottom:36px;line-height:1.65}
.fcta-row{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-bottom:24px}
.fcta-note{font-size:.85rem;color:rgba(255,255,255,.5)}
/* ── WHATSAPP FLOAT ── */
.wa-float{position:fixed;bottom:28px;right:28px;z-index:999;width:52px;height:52px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(37,211,102,.4);transition:transform .15s;text-decoration:none}
.wa-float:hover{transform:scale(1.1)}
.wa-float svg{width:26px;height:26px;fill:#fff}
/* ── SCROLL ANIMATIONS ── */
.fade-up{opacity:0;transform:translateY(30px);transition:opacity .6s,transform .6s}
.fade-up.visible{opacity:1;transform:none}
/* trust icon shapes */
.trust-icon{width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-size:0}
.trust-star{background:linear-gradient(135deg,#F59E0B,#EA580C)}
.trust-bar{background:linear-gradient(135deg,#1A56DB,#3E92CC)}
.trust-loc{background:linear-gradient(135deg,#7B2FBE,#A855F7)}
.trust-book{background:linear-gradient(135deg,#F97316,#EA580C)}
.trust-star::after,.trust-bar::after,.trust-loc::after,.trust-book::after{
content:'';display:block;width:20px;height:20px;
background:url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10' cy='10' r='5'/%3E%3C/svg%3E") center/contain no-repeat
}
/* number step icons */
.tl-card .tl-icon{width:38px;height:38px;border-radius:50%;background:var(--grad-hero);color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-bottom:0}
/* hub icon container */
.hub-icon{width:64px;height:64px;border-radius:50%;background:var(--grad-hero);display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
/* plp icon container */
.plp-point-icon{width:38px;height:38px;border-radius:50%;background:var(--grad-hero);display:flex;align-items:center;justify-content:center;flex-shrink:0}
/* video hero */
video.hero-kv{display:block;width:100%;border-radius:20px;box-shadow:0 24px 64px rgba(0,0,0,.35);object-fit:cover}
/* loc-mrt SVG icon */
.loc-mrt-icon-svg{display:inline-flex;align-items:center;justify-content:center;background:#EEF2FF;border-radius:4px;padding:2px;width:24px;height:24px;flex-shrink:0}
.mrt-svg{display:block}
/* step icon numbers */
.step-icon{width:48px;height:48px;border-radius:50%;background:var(--grad-hero);color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1.3rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin:0 auto 12px}
/* ── video wrap + custom controls ── */
.video-wrap{position:relative;border-radius:20px;overflow:hidden;box-shadow:0 24px 64px rgba(0,0,0,.35)}
.hero-kv{border-radius:0;box-shadow:none;width:100%;display:block;object-fit:cover}
.vid-controls{position:absolute;bottom:0;left:0;right:0;padding:32px 14px 14px;background:linear-gradient(transparent,rgba(0,0,0,.55));display:flex;align-items:center;gap:10px;opacity:0;transition:opacity .25s}
.video-wrap:hover .vid-controls{opacity:1}
.vid-progress-wrap{flex:1;display:flex;align-items:center}
.vid-progress-bg{position:relative;width:100%;height:4px;background:rgba(255,255,255,.3);border-radius:99px;cursor:pointer}
.vid-progress-fill{position:absolute;top:0;left:0;height:100%;background:#fff;border-radius:99px;pointer-events:none;transition:width .1s linear}
.vid-scrubber{position:absolute;top:50%;left:0;transform:translateY(-50%);width:100%;height:18px;opacity:0;cursor:pointer;margin:0;padding:0;appearance:none;-webkit-appearance:none;background:transparent}
.vid-sound-btn{background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.4);border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;flex-shrink:0;transition:background .15s;backdrop-filter:blur(4px)}
.vid-sound-btn:hover{background:rgba(255,255,255,.35)}
@media(max-width:800px){.vid-controls{opacity:1}}
/* ── HOW A DAY WORKS - sticky two-panel ── */
#howday{background:var(--off)}
.howday-scroll-outer{display:flex;align-items:stretch}
.howday-sticky{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:center}
.howday-left{padding:60px 48px 60px 60px;display:flex;flex-direction:column;justify-content:center;border-right:1px solid #E0E9F5}
.howday-right{padding:60px 60px 60px 48px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px}
.howday-timeline-strip{position:relative;margin-top:36px;width:100%}
.howday-tl-line{position:absolute;top:7px;left:0;right:0;height:3px;background:#D1DCF0;border-radius:99px;z-index:0}
.howday-tl-fill{height:100%;background:var(--grad-hero);border-radius:99px;transition:width .4s ease;width:0%}
.howday-tl-dots{position:relative;display:flex;justify-content:space-between;z-index:1}
.howday-tl-step{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer}
.howday-tl-dot{width:16px;height:16px;border-radius:50%;background:#D1DCF0;border:3px solid #fff;box-shadow:0 0 0 2px #D1DCF0;transition:all .3s;flex-shrink:0}
.howday-tl-step.active .howday-tl-dot{background:var(--blue);box-shadow:0 0 0 3px rgba(26,86,219,.2)}
.howday-tl-step.done .howday-tl-dot{background:var(--sky);box-shadow:0 0 0 2px rgba(62,146,204,.2)}
.howday-tl-time{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:.72rem;color:var(--navy);white-space:nowrap;opacity:.5;transition:opacity .3s}
.howday-tl-label{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:700;font-size:.68rem;color:var(--muted);white-space:nowrap;opacity:.5;transition:opacity .3s}
.howday-tl-step.active .howday-tl-time,.howday-tl-step.active .howday-tl-label{opacity:1;color:var(--navy)}
.howday-tl-step.done .howday-tl-time,.howday-tl-step.done .howday-tl-label{opacity:.75}
.howday-card{width:100%;max-width:420px;background:#fff;border-radius:20px;box-shadow:0 12px 48px rgba(10,36,99,.1);overflow:hidden;transition:transform .35s ease,opacity .35s ease}
.howday-card.exit-left{transform:translateX(-40px);opacity:0}
.howday-card.exit-right{transform:translateX(40px);opacity:0}
.howday-card-inner{padding:36px}
.howday-step-num{width:44px;height:44px;border-radius:50%;background:var(--grad-hero);color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1.15rem;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.howday-time-pill{display:inline-flex;background:var(--navy);color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.78rem;padding:4px 14px;border-radius:99px;margin-bottom:16px}
.howday-card-title{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1.35rem;color:var(--navy);margin-bottom:10px}
.howday-card-desc{font-size:.95rem;color:var(--muted);line-height:1.65}
.howday-nav{display:flex;align-items:center;gap:16px}
.howday-btn{width:44px;height:44px;border-radius:50%;border:2px solid var(--navy);background:transparent;color:var(--navy);font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.howday-btn:hover{background:var(--navy);color:#fff}
.howday-btn:disabled{opacity:.3;cursor:default}
.howday-counter{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.95rem;color:var(--muted);min-width:48px;text-align:center}
@media(max-width:800px){
.howday-scroll-outer{}
.howday-sticky{position:static;grid-template-columns:1fr;padding:40px 0}
.howday-left{padding:0 24px 32px;border-right:none;border-bottom:1px solid #E0E9F5}
.howday-right{padding:32px 24px}
.howday-card{max-width:100%}
}
/* KV floating badge */
.hero-right{position:relative}
.kv-badge-wrap{position:absolute;top:-18px;right:-20px;z-index:10;filter:drop-shadow(0 8px 20px rgba(0,0,0,.3));transform:rotate(3deg)}
.kv-badge{background:#13B9E8;color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1.05rem;padding:13px 28px;border-radius:99px;white-space:nowrap;border:3px solid rgba(255,255,255,.95);letter-spacing:.01em;display:inline-block}
.kv-badge span{color:#FFF3D6;text-shadow:0 1px 3px rgba(0,0,0,.2)}
@media(max-width:800px){.kv-badge-wrap{top:-14px;right:16px}}
/* ── GENIEBOOK ECOSYSTEM ── */
#ecosystem{background:var(--grad-dark);padding:80px 0;position:relative;overflow:hidden}
#ecosystem::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Ccircle fill='%23ffffff' fill-opacity='0.03' cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/svg%3E");pointer-events:none}
.eco-header{text-align:center;margin-bottom:52px}
.eco-header .tag{background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(4px)}
.eco-header h2{color:#fff;margin-top:14px;font-size:clamp(1.9rem,4vw,2.6rem);font-weight:900}
.eco-header p{color:rgba(255,255,255,.65);margin-top:10px;font-size:1rem;line-height:1.65;max-width:580px;margin-left:auto;margin-right:auto}
.eco-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.eco-card{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:28px 24px 24px;display:flex;flex-direction:column;gap:0;transition:background .2s,transform .2s,border-color .2s}
.eco-card:hover{background:rgba(255,255,255,.13);transform:translateY(-4px);border-color:rgba(255,255,255,.22)}
.eco-card-icon{width:52px;height:52px;border-radius:15px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;flex-shrink:0}
.eco-icon-class{background:linear-gradient(135deg,#3E92CC 0%,#1A56DB 100%)}
.eco-icon-smart{background:linear-gradient(135deg,#7B2FBE 0%,#4C1D95 100%)}
.eco-icon-ask{background:linear-gradient(135deg,#F97316 0%,#DC2626 100%)}
.eco-icon-bubble{background:linear-gradient(135deg,#06B6D4 0%,#0891B2 100%)}
.eco-card-tag{display:inline-flex;background:rgba(255,255,255,.1);border-radius:99px;padding:3px 11px;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:700;font-size:.7rem;color:rgba(255,255,255,.65);margin-bottom:12px;border:1px solid rgba(255,255,255,.1);width:fit-content}
.eco-card-name{font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:900;font-size:1.2rem;color:#fff;margin-bottom:8px;line-height:1.2}
.eco-card-name span{color:var(--sky-bright)}
.eco-card-desc{font-size:.87rem;color:rgba(255,255,255,.65);line-height:1.6;flex:1}
.eco-bubble-cta{margin-top:16px;display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,#06B6D4,#7B2FBE);color:#fff;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:800;font-size:.8rem;padding:7px 16px;border-radius:99px;width:fit-content}
.eco-bubble-gifts{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}
.eco-bubble-gift{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:6px;padding:3px 9px;font-family:'Nunito','DM Sans',Arial,sans-serif;font-weight:700;font-size:.68rem;color:rgba(255,255,255,.6)}
@media(max-width:860px){.eco-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.eco-grid{grid-template-columns:1fr}}
/* ===== Site integration overrides ===== */
.geniehouse_page #body_container.geniehouse_body {
background: #fff !important;
background-image: none !important;
max-width: none !important;
padding: 0 !important;
margin: 0 !important;
}
.geniehouse_page #footer_container {
font-family: 'DM Sans', sans-serif;
padding: 0 !important;
margin: 0 !important;
max-width: none !important;
width: 100% !important;
font-size: 16px !important;
line-height: 1.5 !important;
color: #fff !important;
}
.geniehouse_page #footer_container footer {
display: block !important;
width: 100% !important;
box-sizing: border-box !important;
background: #17133F !important;
padding: 64px 0 32px !important;
margin: 0 !important;
color: #fff !important;
}
.geniehouse_page #footer_container .footer-inner {
display: grid !important;
grid-template-columns: 2fr 1fr 1fr !important;
gap: 64px !important;
margin-bottom: 36px !important;
align-items: start !important;
}
.geniehouse_page #footer_container .footer-brand p {
font-size: 0.85rem !important;
color: rgba(255, 255, 255, 0.5) !important;
line-height: 1.6 !important;
margin: 0 !important;
}
.geniehouse_page #footer_container .footer-col h4 {
font-family: 'Nunito', 'DM Sans', Arial, sans-serif !important;
font-weight: 800 !important;
font-size: 0.85rem !important;
color: rgba(255, 255, 255, 0.5) !important;
text-transform: uppercase !important;
letter-spacing: 0.08em !important;
margin: 0 0 14px !important;
}
.geniehouse_page #footer_container .footer-col ul {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
display: flex !important;
flex-direction: column !important;
gap: 8px !important;
}
.geniehouse_page #footer_container .footer-col ul li a {
font-size: 0.88rem !important;
color: rgba(255, 255, 255, 0.6) !important;
text-decoration: none !important;
transition: color 0.15s ease !important;
}
.geniehouse_page #footer_container .footer-col ul li a:hover {
color: #fff !important;
}
.geniehouse_page #footer_container .footer-bottom {
border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
padding-top: 20px !important;
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
flex-wrap: wrap !important;
gap: 12px !important;
}
.geniehouse_page #footer_container .footer-bottom p {
font-size: 0.8rem !important;
color: rgba(255, 255, 255, 0.35) !important;
margin: 0 !important;
max-width: 720px !important;
}
.geniehouse_page #footer_container .footer-socials {
display: flex !important;
gap: 12px !important;
align-items: center !important;
}
.geniehouse_page #footer_container .social-btn {
width: 40px !important;
height: 40px !important;
border-radius: 12px !important;
background: rgba(255, 255, 255, 0.1) !important;
color: rgba(255, 255, 255, 0.6) !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
font-size: 1rem !important;
text-decoration: none !important;
transition: background 0.15s ease, color 0.15s ease !important;
}
.geniehouse_page #footer_container .social-btn:hover {
background: var(--orange) !important;
color: #fff !important;
}
.geniehouse_page #footer_container .footer-logo-img {
width: 180px !important;
height: auto !important;
margin-bottom: 24px !important;
filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.2)) !important;
}
@media (max-width: 800px) {
.geniehouse_page #footer_container .footer-inner {
grid-template-columns: 1fr !important;
gap: 32px !important;
}
.geniehouse_page #footer_container .footer-bottom {
flex-direction: column !important;
text-align: center !important;
}
}
/* Strength section — homepage form (not export glass form) */
.sh_strength_form_wrap {
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 20px;
padding: 36px;
max-width: 520px;
margin: 40px auto 0;
backdrop-filter: blur(8px);
}
.sh_strength_form_title {
font-family: "DM Sans", Arial, sans-serif !important;
font-weight: 800;
font-size: 1rem;
color: #fff;
margin-bottom: 20px;
text-align: center;
}
.sh_visit_form {
max-width: 100%;
margin: 0;
display: grid;
gap: 16px;
text-align: left;
}
.sh_visit_form .form_group { width: 100%; }
.sh_form_label {
display: block;
color: #fff;
font-family: "DM Sans", Arial, sans-serif !important;
font-size: 18px;
font-weight: 400;
line-height: normal;
margin-bottom: 8px;
}
.sh_form_input_wrap {
width: 100%;
height: 48px;
border-radius: 8px;
border: 1px solid #cfd7e5;
background: #f2f3f3;
padding: 0;
display: flex;
align-items: center;
box-sizing: border-box;
}
.sh_form_input {
width: 100%;
height: 100%;
border: 0;
background: transparent;
outline: none;
color: #1E3D34;
font-family: "DM Sans", Arial, sans-serif !important;
font-size: 18px;
font-weight: 400;
line-height: normal;
padding: 0 12px;
margin: 0;
-webkit-appearance: none;
appearance: none;
}
.sh_form_input::placeholder { color: #7E8F69; opacity: 1; }
.sh_form_select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
cursor: pointer;
background-image: url('data:image/svg+xml,');
background-size: 13px;
background-repeat: no-repeat;
background-position: right 16px center;
padding-right: 44px !important;
}
.sh_form_select.placeholder { color: #7E8F69; }
.sh_form_phone_wrap {
position: relative;
padding: 0;
background-image: url('data:image/svg+xml,');
background-size: 13px;
background-repeat: no-repeat;
background-position: left 53px center;
}
.sh_form_phone_wrap .phone_country_select {
-webkit-appearance: none;
appearance: none;
border: 0;
padding: 0 !important;
flex-grow: unset !important;
}
.sh_form_phone_wrap .select2-container {
position: absolute;
top: 0;
width: 70px !important;
vertical-align: top !important;
padding: 0;
z-index: 1;
}
.sh_form_phone_wrap .select2-container > * { width: 100%; line-height: 48px; }
.sh_form_phone_wrap .select2-container .select2-selection {
border: 0 !important;
background: transparent !important;
height: auto !important;
}
.sh_form_phone_wrap .select2-selection__rendered {
font-family: "DM Sans", Arial, sans-serif !important;
font-weight: 700;
color: #1E3D34 !important;
text-align: center;
line-height: unset !important;
font-size: 16px;
padding: 0 8px 0 0 !important;
}
.sh_form_phone_wrap .select2-container--default .select2-selection__arrow { display: none !important; }
.sh_form_phone_input { padding: 0 12px 0 72px !important; }
/* Let the actual control fill the white field surface; keep focus on the wrapper. */
.geniehouse_body #visitForm .sh_form_input:focus,
.geniehouse_body #visitForm .sh_form_input:focus-visible,
.geniehouse_body #visitForm .select2-selection:focus,
.geniehouse_body #visitForm .select2-selection:focus-visible {
outline: none !important;
box-shadow: none !important;
}
.geniehouse_body #visitForm .sh_form_input_wrap:focus-within {
border-color: var(--mint);
box-shadow: 0 0 0 2px rgba(167, 200, 180, .18);
}
/* Select2 country dropdown — header_footer_cta.css is not loaded on GenieHouse */
body.geniehouse_page .select2-container .detail_country {
display: inline-block;
vertical-align: middle;
font-family: "DM Sans", Arial, sans-serif !important;
font-size: 16px;
line-height: 1.3;
}
body.geniehouse_page .select2-container .detail_country .country_code {
color: #6b7280;
}
body.geniehouse_page .select2-container .img_flag {
display: inline-block;
vertical-align: middle;
margin-right: 8px;
width: 24px;
height: 16px;
background: url("../../../../images/gb/flags.png") no-repeat 0 0;
background-size: cover;
}
body.geniehouse_page .select2-container .country_choices {
display: flex;
align-items: center;
gap: 8px;
}
body.geniehouse_page .select2-container .select2-dropdown {
top: 0;
left: -9px !important;
width: 294px !important;
border-radius: 8px !important;
overflow: hidden;
z-index: 10001;
border: none;
box-shadow: 0 12px 32px rgba(42, 35, 95, 0.18);
}
body.geniehouse_page .select2-container .select2-search__field {
font-size: 16px !important;
font-family: "DM Sans", Arial, sans-serif !important;
font-weight: 400;
color: var(--navy);
border-radius: 8px !important;
padding: 8px 10px !important;
}
body.geniehouse_page .select2-container .select2-results__option {
font-family: "DM Sans", Arial, sans-serif !important;
font-size: 16px;
padding: 10px 12px;
}
.sh_visit_form .form_group.input_error .sh_form_input_wrap { border-color: #f39123; }
.sh_visit_form .form_group.input_error .sh_form_phone_wrap {
background-image: url('data:image/svg+xml,');
}
.sh_visit_form .form_group.input_error #select2-country_id_lp-container { color: #f77767 !important; }
.sh_visit_form .form_group .input_error_msg {
display: none;
color: #ffe0e0;
font-size: 15px;
line-height: 18px;
padding-top: 9px;
text-align: left;
font-weight: 600;
font-family: "DM Sans", Arial, sans-serif !important;
}
.sh_visit_form .form_group.input_error .input_error_msg { display: block; }
.sh_form_submit_btn {
width: 100%;
height: auto;
padding: 16px;
border: 0;
border-radius: 12px;
background: var(--orange);
box-shadow: none;
display: flex;
align-items: center;
justify-content: center;
gap: 0;
cursor: pointer;
overflow: hidden;
margin-top: 4px;
font-family: 'Nunito', 'DM Sans', Arial, sans-serif !important;
font-weight: 900;
font-size: 1rem;
color: #fff;
-webkit-appearance: none;
appearance: none;
transition: background 0.15s ease;
}
.sh_form_submit_btn:hover:not(.disable_button_submit) {
background: var(--orange2);
}
.sh_form_submit_btn .button_text {
color: #fff;
font-family: 'Nunito', 'DM Sans', Arial, sans-serif !important;
font-size: 1rem;
font-weight: 900;
line-height: normal;
}
.sh_form_submit_btn.disable_button_submit { opacity: 0.75; pointer-events: none; }
.button_disable { display: none !important; }
.sh_form_submit_btn .button_loading:not(.button_disable) {
display: inline !important;
color: #fff;
font-weight: 900;
font-family: 'Nunito', 'DM Sans', Arial, sans-serif !important;
font-size: 1rem;
}
.sh_form_submit_btn .button_text.button_disable { display: none !important; }
.sh_form_thanks {
text-align: center;
padding: 20px 0;
}
.sh_form_thanks_title {
font-family: 'Nunito', 'DM Sans', Arial, sans-serif !important;
font-weight: 900;
font-size: 1.3rem;
color: #fff;
margin: 0 0 8px;
}
.sh_form_thanks_copy {
color: rgba(255, 255, 255, 0.75);
font-size: 0.9rem;
line-height: 1.6;
margin: 0;
}
.sh_form_thanks_wa {
display: inline-flex;
align-items: center;
gap: 8px;
margin-top: 16px;
background: rgba(255, 255, 255, 0.15);
border: 1px solid rgba(255, 255, 255, 0.3);
color: #fff;
padding: 10px 22px;
border-radius: 99px;
font-family: 'Nunito', 'DM Sans', Arial, sans-serif !important;
font-weight: 800;
font-size: 0.9rem;
text-decoration: none;
transition: background 0.15s ease;
}
.sh_form_thanks_wa:hover {
background: rgba(255, 255, 255, 0.22);
color: #fff;
}
/* .geniehouse_body a { color: inherit } beats .sh_form_thanks_wa without higher specificity */
.geniehouse_body a.sh_form_thanks_wa,
.geniehouse_body a.sh_form_thanks_wa:hover,
.geniehouse_body a.sh_form_thanks_wa:focus,
.geniehouse_body a.sh_form_thanks_wa:visited {
color: #fff !important;
}
.geniehouse_body a.sh_form_thanks_wa i,
.geniehouse_body a.sh_form_thanks_wa i::before {
color: #fff !important;
}
.geniehouse_body .sh_form_label,
.geniehouse_body .sh_form_input,
.geniehouse_body .sh_visit_form .input_error_msg {
font-family: "DM Sans", Arial, sans-serif !important;
}
/* Typography sync with index_new_2 / CF preview:
Nunito = display/UI chrome, DM Sans = body copy.
Override site css/sg/style.css body{font-weight:500}. */
body.geniehouse_page,
.geniehouse_body {
font-family: 'DM Sans', sans-serif !important;
font-weight: 400 !important;
}
.geniehouse_body p,
.geniehouse_body li,
.geniehouse_body a,
.geniehouse_body button,
.geniehouse_body input,
.geniehouse_body select,
.geniehouse_body textarea,
.geniehouse_body .section-sub,
.geniehouse_body .hero-sub,
.geniehouse_body .hub-desc,
.geniehouse_body .faq-a,
.geniehouse_body .plp-left p,
.geniehouse_body .eco-card-desc,
.geniehouse_body .step-card p,
.geniehouse_body .tcard-quote,
.geniehouse_body .review-copy,
.geniehouse_body .loc-addr,
.geniehouse_body .compare-cell,
.geniehouse_body .problem-a,
.geniehouse_body .nav-links a,
.geniehouse_body .howday-card-desc,
.geniehouse_body .p-card-desc,
.geniehouse_body .pricing-sub,
.geniehouse_body .pricing-note,
.geniehouse_body .multiplier-sub,
.geniehouse_body .fcta-inner p {
font-family: 'DM Sans', sans-serif !important;
font-weight: 400 !important;
}
/* GenieHouse column in compare — match index_new_3 (.compare-cell.good { font-weight:600 }) */
.geniehouse_body #compare .compare-cell.good {
font-weight: 600 !important;
}
.geniehouse_body .nav-links a {
font-weight: 700 !important;
}
.geniehouse_body .btn,
.geniehouse_body .nav-cta,
.geniehouse_body .faq-q,
.geniehouse_body button.faq-q {
font-weight: 800 !important;
}
.geniehouse_body h1,
.geniehouse_body h2,
.geniehouse_body h3,
.geniehouse_body h4,
.geniehouse_body h5,
.geniehouse_body .section-title,
.geniehouse_body .hero-h1,
.geniehouse_body .tag,
.geniehouse_body .btn,
.geniehouse_body .nav-cta,
.geniehouse_body .logo-badge .badge-tag,
.geniehouse_body .logo-badge .logo-study,
.geniehouse_body .logo-badge .logo-hub,
.geniehouse_body .faq-q,
.geniehouse_body .hub-name,
.geniehouse_body .loc-name,
.geniehouse_body .review-name,
.geniehouse_body .howday-card-title,
.geniehouse_body .p-card-price,
.geniehouse_body .compare-head,
.geniehouse_body .trust-ple-title,
.geniehouse_body .trust-stat-number,
.geniehouse_body .trust-ple-pill {
font-family: 'Nunito', sans-serif !important;
}
/* CF/export: letter-spacing only on display headings — not tags/UI chrome */
.geniehouse_body h1,
.geniehouse_body h2,
.geniehouse_body h3,
.geniehouse_body h4,
.geniehouse_body h5,
.geniehouse_body .section-title,
.geniehouse_body .hero-h1 {
letter-spacing: -0.015em;
line-height: 1.2;
}
.geniehouse_body .hero-h1 {
line-height: 1.08;
}
.geniehouse_body .tag,
.geniehouse_body .btn,
.geniehouse_body .nav-cta,
.geniehouse_body .faq-q,
.geniehouse_body .hub-name,
.geniehouse_body .loc-name,
.geniehouse_body .review-name,
.geniehouse_body .p-card-price,
.geniehouse_body .compare-head,
.geniehouse_body .trust-ple-title,
.geniehouse_body .trust-stat-number {
letter-spacing: normal;
}
.geniehouse_body .tag {
letter-spacing: 0.04em;
}
.geniehouse_body .hero-sub {
font-size: 1.075rem;
line-height: 1.65;
}
.geniehouse_body .section-sub {
line-height: 1.6;
}
.geniehouse_body .btn {
font-family: 'Nunito', sans-serif !important;
letter-spacing: 0;
}
/* sg/style.css sets button { all: unset } — restore interactive controls */
.geniehouse_body button.faq-q {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
width: 100% !important;
box-sizing: border-box !important;
padding: 20px 24px !important;
text-align: left !important;
cursor: pointer !important;
gap: 16px !important;
background: transparent !important;
border: none !important;
font-family: 'Nunito', 'DM Sans', Arial, sans-serif !important;
font-weight: 800 !important;
font-size: 1rem !important;
color: var(--navy) !important;
}
.geniehouse_body button.faq-q:hover {
color: var(--blue) !important;
}
.geniehouse_body .faq-arrow {
display: flex !important;
flex-shrink: 0 !important;
width: 24px !important;
height: 24px !important;
min-width: 24px !important;
min-height: 24px !important;
border-radius: 50% !important;
background: var(--off) !important;
align-items: center !important;
justify-content: center !important;
line-height: 1 !important;
transition: transform 0.2s, background 0.2s, color 0.2s !important;
color: var(--blue) !important;
}
.geniehouse_body .faq-arrow svg {
display: block !important;
width: 12px !important;
height: 8px !important;
flex-shrink: 0 !important;
}
.geniehouse_body .faq-item.open .faq-arrow {
transform: rotate(180deg) !important;
background: var(--blue) !important;
color: #fff !important;
}
.geniehouse_body button.howday-btn:disabled {
opacity: 1 !important;
cursor: pointer !important;
}
.geniehouse_body button.vid-sound-btn {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 36px !important;
height: 36px !important;
min-width: 36px !important;
min-height: 36px !important;
border-radius: 50% !important;
border: 1px solid rgba(255, 255, 255, 0.4) !important;
background: rgba(255, 255, 255, 0.2) !important;
color: #fff !important;
cursor: pointer !important;
box-sizing: border-box !important;
flex-shrink: 0 !important;
}
.geniehouse_body a.btn,
.geniehouse_body a.nav-cta {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
box-sizing: border-box !important;
}
.geniehouse_body a.btn-primary,
.geniehouse_body a.btn.btn-primary,
.geniehouse_body a.btn.btn-primary.btn-lg,
.geniehouse_body a.nav-cta,
.geniehouse_body a.btn-navy,
.geniehouse_body a.btn.btn-navy,
.geniehouse_body a.btn-outline,
.geniehouse_body a.btn.btn-outline {
color: #fff !important;
}
.geniehouse_body a.btn-primary:hover,
.geniehouse_body a.btn.btn-primary:hover,
.geniehouse_body a.nav-cta:hover,
.geniehouse_body a.btn-navy:hover,
.geniehouse_body a.btn-outline:hover,
.geniehouse_body a.btn.btn-outline:hover {
color: #fff !important;
}
.geniehouse_body .hub-icon {
width: 64px !important;
height: 64px !important;
border-radius: 50% !important;
background: var(--grad-hero) !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin: 0 auto 16px !important;
}
#programme .hub-icon {
margin: 0 0 16px !important;
}
.geniehouse_body .plp-point-icon {
width: 42px !important;
height: 42px !important;
min-width: 42px !important;
border-radius: 50% !important;
background: var(--grad-cyan) !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
flex-shrink: 0 !important;
padding: 9px !important;
box-sizing: border-box !important;
overflow: hidden !important;
}
.geniehouse_body .plp-point-icon img {
display: block !important;
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
}
.geniehouse_body #pricing .btn.btn-outline {
background: transparent !important;
color: var(--navy) !important;
border: 2px solid var(--navy) !important;
}
.geniehouse_body #pricing .btn.btn-outline:hover {
color: var(--navy) !important;
}
.geniehouse_body .sh_form_submit_btn {
display: flex !important;
align-items: center !important;
justify-content: center !important;
box-sizing: border-box !important;
width: 100% !important;
border: 0 !important;
border-radius: 12px !important;
background: var(--orange) !important;
box-shadow: none !important;
padding: 16px !important;
gap: 0 !important;
cursor: pointer !important;
font-family: 'Nunito', 'DM Sans', Arial, sans-serif !important;
font-weight: 900 !important;
font-size: 1rem !important;
color: #fff !important;
transform: none !important;
transition: background 0.15s ease !important;
-webkit-appearance: none !important;
appearance: none !important;
}
.geniehouse_body .sh_form_submit_btn:hover:not(.disable_button_submit) {
background: var(--orange2) !important;
transform: none !important;
box-shadow: none !important;
}
.geniehouse_body .sh_form_submit_btn .button_text,
.geniehouse_body .sh_form_submit_btn .button_loading:not(.button_disable) {
font-family: 'Nunito', 'DM Sans', Arial, sans-serif !important;
font-weight: 900 !important;
font-size: 1rem !important;
color: #fff !important;
}
/* ===== index_new_1 refinements ===== */
.nav-logo-link{display:flex;align-items:center;padding:4px 0}
.nav-logo-img{display:block;width:142px;height:auto;filter:drop-shadow(0 4px 10px rgba(0,0,0,.16))}
.nav-links{gap:32px}
.nav-links a{font-family:'DM Sans',sans-serif;font-weight:700;color:rgba(255,255,255,.82)}
.nav-links a:hover{color:var(--sky-bright)}
.nav-cta{border-radius:12px;background:var(--orange);padding:12px 20px;display:inline-flex;align-items:center;gap:8px;box-shadow:0 8px 20px rgba(252,137,18,.28)}
.nav-cta:hover{background:var(--orange2)}
/* Hero */
#hero{padding:160px 0 96px;background:radial-gradient(circle at 82% 18%,rgba(89,207,255,.22),transparent 28%),radial-gradient(circle at 8% 92%,rgba(252,137,18,.14),transparent 25%),var(--grad-hero)}
.hero-grid{gap:64px}
.hero-h1{font-size:clamp(2.4rem,5vw,4.25rem);max-width:760px}
.hero-h1 span{color:var(--sky-bright)}
.hero-sub{font-family:'DM Sans',sans-serif;font-size:1.075rem;max-width:680px}
.hero-eyebrow{gap:8px;margin-bottom:24px}
.hero-ctarow{gap:16px;margin-bottom:32px}
.video-wrap,.hero-kv{border-radius:32px}
.video-wrap{border:4px solid rgba(255,255,255,.18);box-shadow:0 28px 70px rgba(14,11,45,.38);background:var(--navy2)}
.kv-badge{background:var(--grad-orange);border-color:#fff;padding:12px 24px;color:#fff}
.kv-badge span{color:#fff}
/* Core components */
.tag{gap:8px;padding:8px 16px;border-radius:var(--r-full);background:var(--orange);font-size:.75rem}
.tag.blue{background:var(--grad-cyan)}
.tag.navy{background:var(--navy)}
.btn{gap:10px;padding:14px 28px;border-radius:12px;font-family:'Nunito',sans-serif;box-shadow:none}
.btn-primary{background:var(--orange);box-shadow:0 8px 22px rgba(252,137,18,.28)}
.btn-primary:hover{background:var(--orange2)}
.btn-navy{background:var(--navy)}
.btn-outline{border-radius:12px}
.section-sub{font-family:'DM Sans',sans-serif;margin-top:12px}
/* Light surfaces and cards */
#problem,#howday,#photos,#pricing,#faq{background:var(--off)}
.problem-answer,.compare-grid,.tcard,.tl-card,.hub-card,.photo-item,.plp-mockup,.p-card,.step-card,.loc-card,.faq-item,.howday-card,.eco-card{border-radius:24px}
.problem-answer{background:var(--grad-dark);padding:32px 48px}
.compare-grid{box-shadow:0 18px 54px rgba(42,35,95,.12)}
.compare-footer{background:var(--grad-dark)}
.compare-head.good{background:var(--sky);color:#fff}
.compare-cell.good{background:rgba(33,177,233,.055)}
.compare-cell{gap:12px;padding:20px 24px}
.cell-icon{font-size:1.05rem;margin-top:2px}
.cell-icon.check{color:var(--sky)}
.cell-icon.cross{color:#A8B0C0}
.cell-icon.neutral,.cell-icon.weak{color:#8A94A8}
/* Trust */
.trust-stats-row{padding:32px 0}
.trust-item{gap:12px;padding:0 32px}
.trust-icon{width:48px;height:48px;background:var(--grad-cyan)!important;color:#fff;font-size:1.15rem}
.trust-icon::after{display:none!important}
.trust-icon-bar{background:var(--grad-dark)!important}
.trust-loc{background:var(--grad-orange)!important}
.trust-ple-band{background:var(--grad-neutral)}
.trust-ple-logo{width:44px;height:44px;background:var(--grad-dark);color:#fff;font-size:1rem}
.trust-ple-pill{padding:8px 16px;border-color:#CFEAF6}
.trust-stat-number{color:var(--navy)}
/* Ecosystem and dark sections */
#ecosystem,#multiplier,#strength,#final-cta{background:radial-gradient(circle at 90% 10%,rgba(89,207,255,.16),transparent 30%),var(--grad-dark)}
.eco-grid{gap:24px}
.eco-card{padding:32px;background:rgba(255,255,255,.08)}
.eco-card-icon{width:56px;height:56px;border-radius:16px;color:#fff;font-size:1.25rem}
.eco-icon-class{background:var(--grad-cyan)}
.eco-icon-smart{background:var(--grad-dark);border:1px solid rgba(255,255,255,.16)}
.eco-icon-bubble{background:var(--grad-orange)}
.eco-bubble-gift{border-radius:var(--r-full)}
.eco-bubble-cta{background:var(--orange);border-radius:12px;gap:8px}
.stars{display:flex;gap:4px;color:var(--orange);font-size:.85rem}
.tcard-result{color:var(--sky-bright);border-color:rgba(89,207,255,.28);background:rgba(33,177,233,.14)}
/* Timeline */
.howday-left{padding:64px 56px 64px 64px}
.howday-right{padding:64px 64px 64px 56px}
.howday-card-inner{padding:40px}
.howday-step-num,.plp-point-icon,.step-icon{background:var(--grad-cyan)}
.howday-time-pill{background:var(--navy);padding:8px 16px}
.howday-btn{border-radius:12px;border-color:var(--navy)}
.howday-tl-fill{background:var(--grad-cyan)}
.howday-tl-step.active .howday-tl-dot{background:var(--sky)}
/* Programme cards */
.hubs-grid{gap:24px}
.hub-card{padding:32px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 30px rgba(42,35,95,.06)}
.hub-card:hover{border-color:var(--sky);box-shadow:0 16px 42px rgba(33,177,233,.14)}
.hub-card:nth-child(1)::before,.hub-card:nth-child(4)::before{background:var(--navy)}
.hub-card:nth-child(2)::before,.hub-card:nth-child(5)::before{background:var(--orange)}
.hub-card:nth-child(3)::before{background:var(--sky)}
.hub-icon{width:64px;height:64px;background:var(--grad-cyan);color:#fff;font-size:1.4rem}
.hub-card:nth-child(2) .hub-icon,.hub-card:nth-child(5) .hub-icon{background:var(--grad-orange)}
.hub-card:nth-child(1) .hub-icon,.hub-card:nth-child(4) .hub-icon{background:var(--grad-dark)}
.subject-chip{padding:8px 14px;border-color:#CFEAF6;background:#F5FCFF}
/* PLP, pricing, locations and form */
.plp-point-icon{color:#fff;font-size:.95rem}
.plp-mock-header{background:var(--navy)}
.p-card{padding:40px 32px;border-color:var(--line)}
.p-card.featured{border-color:var(--orange);box-shadow:0 16px 42px rgba(252,137,18,.18)}
.p-card-badge{border-radius:var(--r-full);background:var(--orange)}
.loc-badge{border-radius:var(--r-full)}
.p-features li::before{font-family:'Font Awesome 6 Free';font-weight:900;content:'\f00c';color:var(--sky)}
.loc-grid{gap:24px}
.loc-card{padding:32px;border-color:var(--line)}
.loc-card:hover{border-color:var(--sky);box-shadow:0 14px 36px rgba(33,177,233,.12)}
.loc-mrt-icon-svg{width:32px;height:32px;border-radius:8px;background:#EFFAFF;color:var(--navy)}
.loc-mrt-icon-svg i{font-size:.85rem}
.form-success-icon{font-size:2.75rem;color:var(--sky-bright);margin-bottom:16px}
/* FAQ, footer and utility icons */
.faq-list{gap:16px}
.faq-item{border-color:var(--line)}
.faq-q{padding:24px 28px}
.faq-arrow{border-radius:8px;background:#EFFAFF;color:var(--navy)}
.faq-item.open .faq-arrow{background:var(--sky);color:#fff}
footer{background:#17133F;padding:64px 0 32px}
.footer-inner{grid-template-columns:2fr 1fr 1fr;gap:64px}
.footer-logo-img{width:180px;height:auto;margin-bottom:24px;filter:drop-shadow(0 6px 14px rgba(0,0,0,.2))}
.social-btn{border-radius:12px;width:40px;height:40px;font-size:1rem}
.wa-float{width:56px;height:56px;font-size:1.7rem}
.wa-float svg{display:none}
.wa-float i{color:#2A235F;line-height:1}
.geniehouse_page a.wa-float,
.geniehouse_page a.wa-float:hover,
.geniehouse_page a.wa-float:focus,
.geniehouse_page a.wa-float:visited {
color: #2A235F !important;
}
.geniehouse_page a.wa-float i,
.geniehouse_page a.wa-float i::before {
color: #2A235F !important;
}
.vid-sound-btn{font-size:1rem}
@media(max-width:1024px){
.container{padding-left:48px;padding-right:48px}
.nav-inner{padding-left:48px;padding-right:48px}
#problem,#compare,#multiplier,#programme,#photos,#plp,#pricing,#strength,#locations,#faq,#final-cta,#ecosystem{padding-top:48px;padding-bottom:48px}
.hero-grid{gap:48px}
#hero {padding:128px 0 64px}
}
@media(max-width:800px){
.container{padding-left:24px;padding-right:24px}
.nav-inner{padding:8px 24px}
.nav-logo-img{width:124px}
#hero{padding:144px 0 64px}
.hero-grid{gap:40px}
.howday-left,.howday-right{padding-left:24px;padding-right:24px}
.trust-inner{flex-wrap:wrap;gap:24px}
.trust-divider{display:none}
.trust-item{padding:0 12px}
.footer-inner{grid-template-columns:1fr;gap:32px}
}
@media(max-width:560px){
.container{padding-left:22px;padding-right:22px}
.nav-inner{padding-left:20px;padding-right:20px}
.nav-logo-img{width:112px}
.nav-cta{padding:10px 12px;font-size:.78rem}
#hero{padding:132px 0 48px}
#problem,#compare,#multiplier,#programme,#photos,#plp,#pricing,#strength,#locations,#faq,#final-cta,#ecosystem{padding-top:32px;padding-bottom:32px}
.hero-h1{font-size:2.45rem}
.hero-stat{padding:0 12px}
.problem-answer,.eco-card,.hub-card,.p-card,.loc-card,.howday-card-inner{padding:24px}
.compare-cell{padding:16px 20px}
.footer-logo-img{width:160px}
}
/* ===== Requested layout refinement — 6 Aug 2026 ===== */
/* Smaller navigation logo and pill CTA */
.nav-inner{padding-top:6px;padding-bottom:6px}
.nav-logo-img{width:108px}
.nav-cta{border-radius:var(--r-full);padding:11px 22px;gap:0}
/* Smaller hero title and single-row pill actions */
.hero-h1{font-size:clamp(2.2rem,4.15vw,3.55rem);line-height:1.08}
.hero-ctarow{display:flex;flex-wrap:nowrap;align-items:center;gap:12px}
.hero-ctarow .btn{border-radius:var(--r-full);white-space:nowrap;gap:0}
.btn,.btn-outline{border-radius:var(--r-full)}
/* Centred ecosystem band with a relevant icon on every item */
.trust-ple-band{padding:28px 0}
.trust-ple-inner{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px}
.trust-ple-title{margin:0;font-size:1.1rem}
.trust-ple-pills{justify-content:center;align-items:center;gap:10px;margin-top:0}
.trust-ple-pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#fff;box-shadow:0 4px 16px rgba(42,35,95,.06)}
.trust-ple-pill i{color:var(--sky);font-size:.85rem}
/* Ecosystem screenshot thumbnails */
.eco-grid{align-items:stretch}
.eco-card{overflow:hidden;padding:20px 20px 28px}
.eco-card-media{width:100%;aspect-ratio:16/10;border-radius:20px;overflow:hidden;margin-bottom:24px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14)}
.eco-card-media img{display:block;width:100%;height:100%;object-fit:cover}
.eco-card-name,.eco-card-desc{margin-left:8px;margin-right:8px}
/* Screenshot-inspired parent review cards */
#multiplier{background:linear-gradient(180deg,#F4F7FB 0%,#EEF3F8 100%)}
.multiplier-inner{max-width:none}
.multiplier-eyebrow{color:var(--orange)}
.multiplier-h2{color:var(--navy)}
.multiplier-h2 span{color:var(--sky)}
.multiplier-sub{color:var(--muted);max-width:720px;margin-left:auto;margin-right:auto}
.review-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;text-align:left}
.review-card{position:relative;display:flex;flex-direction:column;min-height:390px;background:#fff;border-radius:36px;padding:32px;box-shadow:0 14px 42px rgba(42,35,95,.09);border:1px solid rgba(42,35,95,.07);overflow:hidden}
.review-top{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;margin-bottom:26px}
.review-avatar{width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Nunito',sans-serif;font-size:1.15rem;font-weight:900;border:5px solid #F4F6FA;flex-shrink:0}
.review-name{font-family:'Nunito',sans-serif;font-size:1.35rem;font-weight:900;color:var(--navy);line-height:1.15;margin-bottom:8px}
.review-rating{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.review-stars{display:inline-flex;gap:3px;color:#FFB800;font-size:.92rem}
.review-date{color:#B1B6C2;font-size:.88rem}
.review-quote-mark{font-family:Georgia,serif;font-size:7.5rem;line-height:.55;color:#F2F4FB;font-weight:900;transform:translateY(-4px);user-select:none}
.review-result{display:inline-flex;align-self:flex-start;background:#EFFAFF;color:var(--navy);border:1px solid #CDEEF9;border-radius:var(--r-full);padding:7px 14px;font-family:'Nunito',sans-serif;font-size:.78rem;font-weight:900;margin-bottom:18px}
.review-copy{font-size:1.08rem;line-height:1.7;color:#555761;margin:0 0 28px;flex:1}
.review-source{font-size:.82rem;font-weight:700;letter-spacing:.01em;color:#B1B4BE;text-transform:uppercase}
/* Align How A Day Works to the same page grid */
#howday{padding:96px 0}
.howday-container{max-width:1280px}
.howday-scroll-outer{width:100%}
.howday-sticky{overflow:hidden;border-radius:32px;background:#fff;box-shadow:0 16px 46px rgba(42,35,95,.08);border:1px solid var(--line)}
.howday-left{padding:64px 56px}
.howday-right{padding:64px 56px}
/* Programme bento grid — no decorative top bars */
.hubs-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:stretch}
.hub-card{max-width:none;min-width:0;min-height:220px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;overflow:hidden;background:linear-gradient(145deg,#FFFFFF 0%,#F8FBFE 100%)}
.hub-card::before{display:none!important}
.hub-icon{margin:0 0 20px;width:56px;height:56px}
.hub-card-1{grid-column:span 7;min-height:260px;background:linear-gradient(145deg,#F1FAFF 0%,#FFFFFF 72%)}
.hub-card-2{grid-column:span 5;min-height:260px;background:linear-gradient(145deg,#FFF7ED 0%,#FFFFFF 72%)}
.hub-card-3,.hub-card-4,.hub-card-5{grid-column:span 4}
.hub-card-4{background:linear-gradient(145deg,#F6F3FF 0%,#FFFFFF 75%)}
.hub-card-5{background:linear-gradient(145deg,#FFF7ED 0%,#FFFFFF 75%)}
.subjects-row{margin-top:auto;padding-top:18px}
/* PLP CTA */
#plp .plp-left .btn-primary{background:var(--orange);color:#fff;border-radius:var(--r-full);box-shadow:0 8px 22px rgba(252,137,18,.25)}
#plp .plp-left .btn-primary:hover{background:var(--orange2)}
@media(max-width:1024px){
.nav-logo-img{width:100px}
.review-grid{grid-template-columns:1fr 1fr}
.review-card:last-child{grid-column:1/-1}
.hub-card-1,.hub-card-2{grid-column:span 6}
.hub-card-3,.hub-card-4{grid-column:span 6}
.hub-card-5{grid-column:1/-1}
#howday{padding:48px 0}
}
@media(max-width:800px){
.nav-logo-img{width:92px}
.hero-h1{font-size:clamp(2.05rem,8vw,3rem)}
.hero-ctarow{flex-wrap:wrap}
.review-grid{grid-template-columns:1fr}
.review-card:last-child{grid-column:auto}
.howday-sticky{border-radius:24px}
.howday-left,.howday-right{padding:40px 32px}
.hub-card-1,.hub-card-2,.hub-card-3,.hub-card-4,.hub-card-5{grid-column:1/-1;min-height:auto}
}
@media(max-width:560px){
.nav-logo-img{width:86px}
.nav-cta{padding:9px 14px}
.hero-ctarow{display:grid;grid-template-columns:1fr;gap:10px}
.hero-ctarow .btn{width:100%}
.review-card{padding:24px;border-radius:28px;min-height:0}
.review-avatar{width:60px;height:60px}
.review-name{font-size:1.12rem}
.review-quote-mark{font-size:6rem}
.review-copy{font-size:1rem}
#howday{padding:32px 0}
.howday-left,.howday-right{padding:32px 24px}
}
/* ===== Refinement requested — 6 Aug 2026, review + trust + howday ===== */
:root{
--subject-science:#615E9B;
--subject-english:#71C5E8;
--subject-maths:#FFAA4D;
--subject-chinese:#C6579A;
}
/* Trust ecosystem: consistent title-to-pill spacing and centred page margins */
.trust-ple-band{padding:28px 0}
.trust-ple-inner{width:100%;gap:0}
.trust-ple-inner>div{
width:100%;
max-width:1120px;
margin:0 auto;
display:flex;
flex-direction:column;
align-items:center;
gap:16px;
}
.trust-ple-title{
margin:0;
padding:0 16px;
text-align:center;
line-height:1.35;
}
.trust-ple-pills{
width:100%;
margin:0;
padding:0 8px;
justify-content:center;
align-items:center;
column-gap:10px;
row-gap:12px;
}
.trust-ple-pill{
margin:0;
padding:8px 16px;
line-height:1.25;
}
/* Reviews: decorative quote in the background and compact inline reviewer meta */
#multiplier .multiplier-h2{margin-top:0}
.review-card::after{
content:'”';
position:absolute;
top:24px;
right:26px;
z-index:0;
font-family:Georgia,serif;
font-size:8.5rem;
line-height:.62;
color:#F1F4FA;
font-weight:900;
pointer-events:none;
user-select:none;
}
.review-top{
position:relative;
z-index:1;
display:grid;
grid-template-columns:auto minmax(0,1fr);
align-items:center;
gap:16px;
margin-bottom:24px;
}
.review-meta{
min-width:0;
display:flex;
align-items:center;
column-gap:12px;
row-gap:6px;
flex-wrap:wrap;
}
.review-name{
display:inline-flex;
align-items:center;
margin:0;
white-space:nowrap;
}
.review-rating{
display:inline-flex;
align-items:center;
gap:10px;
flex-wrap:nowrap;
}
.review-result,
.review-copy,
.review-source{position:relative;z-index:1}
.review-result{
border:0;
color:#fff;
box-shadow:none;
}
.review-result.subject-science{background:var(--subject-science)}
.review-result.subject-maths{background:var(--subject-maths)}
.review-result.subject-chinese{background:var(--subject-chinese)}
/* How a day works: remove the outer card wrapper; keep the two-column section clean */
#howday .howday-sticky{
overflow:visible;
border-radius:0;
background:transparent;
box-shadow:none;
border:0;
}
#howday .howday-left{
border-right:1px solid var(--line);
}
#howday .howday-left>.tag{
align-self:flex-start;
width:max-content;
max-width:100%;
margin-bottom:16px!important;
padding:8px 16px;
border-radius:var(--r-full);
line-height:1.2;
}
@media(max-width:800px){
.trust-ple-inner>div{gap:14px}
.trust-ple-title{padding:0}
.trust-ple-pills{padding:0}
.review-meta{display:block}
.review-name{display:block;margin-bottom:6px}
.review-card::after{top:20px;right:20px;font-size:7rem}
#howday .howday-left{
border-right:0;
border-bottom:1px solid var(--line);
}
}
/* ===== Refinement requested — 6 Aug 2026, compact reviews + product logos + vertical day flow ===== */
/* Compact review typography */
.review-card{
min-height:350px;
padding:28px;
}
.review-top{
gap:12px;
margin-bottom:18px;
}
.review-avatar{
width:60px;
height:60px;
border-width:4px;
font-size:.95rem;
}
.review-name{
font-size:1.08rem;
}
.review-stars{
gap:2px;
font-size:.76rem;
}
.review-date{
font-size:.76rem;
}
.review-result{
padding:6px 12px;
margin-bottom:14px;
font-size:.7rem;
}
.review-copy{
margin-bottom:20px;
font-size:.93rem;
line-height:1.6;
}
.review-source{
font-size:.72rem;
}
.review-card::after{
top:20px;
right:22px;
font-size:7rem;
}
/* Use supplied product wordmarks as the ecosystem card names */
.eco-card-name{
min-height:42px;
display:flex;
align-items:center;
margin-top:0;
margin-bottom:12px;
}
.eco-card-name-image{
display:block;
width:auto;
max-width:84%;
max-height:36px;
object-fit:contain;
object-position:left center;
}
.eco-card-name-image-bubble{
max-height:34px;
}
/* How a day works: vertical flow — introduction and timeline above the active detail */
#howday .howday-sticky{
display:grid;
grid-template-columns:minmax(0,1fr);
gap:40px;
align-items:start;
padding:0;
}
#howday .howday-left{
width:100%;
padding:0;
border-right:0;
border-bottom:0;
text-align:center;
align-items:center;
}
#howday .howday-left>.tag{
align-self:center;
}
#howday .howday-left .section-sub{
max-width:720px;
margin-left:auto;
margin-right:auto;
}
#howday .howday-timeline-strip{
width:100%;
max-width:760px;
margin:36px auto 0;
}
#howday .howday-right{
width:100%;
padding:0;
align-items:center;
}
#howday .howday-card{
width:100%;
max-width:760px;
}
#howday .howday-nav{
justify-content:center;
}
@media(max-width:800px){
.review-card{padding:24px;min-height:0}
.review-avatar{width:56px;height:56px}
.review-copy{font-size:.9rem}
#howday .howday-sticky{gap:28px;padding:0}
#howday .howday-left,
#howday .howday-right{padding:0;border:0}
#howday .howday-timeline-strip{margin-top:28px}
}
/* ===== Refinement requested — 6 Aug 2026, auto-sliding day cards + supplied PLP icons ===== */
#howday .howday-card{
height:270px;
min-height:270px;
transform:translateX(0);
opacity:1;
will-change:transform,opacity;
}
#howday .howday-card-inner{
height:100%;
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:center;
}
#howday .howday-time-pill{
background:var(--grad-cyan)!important;
color:#fff;
margin-bottom:18px;
box-shadow:0 7px 18px rgba(33,177,233,.24);
}
#howday .howday-nav{
display:flex;
justify-content:center;
align-items:center;
gap:8px;
margin-top:0;
}
#howday .howday-btn{
width:36px !important;
height:36px !important;
min-width:36px !important;
min-height:36px !important;
border:0 !important;
border-radius:50% !important;
background:rgba(33,177,233,.11) !important;
color:var(--navy) !important;
font-size:.78rem !important;
box-shadow:none !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
cursor:pointer !important;
}
#howday .howday-btn:hover,
#howday .howday-btn:focus-visible{
background:var(--grad-cyan) !important;
color:#fff !important;
outline:none !important;
}
#howday .howday-btn:disabled{opacity:1;cursor:pointer}
#howday .howday-card.is-leaving-left{animation:howday-out-left .28s ease forwards}
#howday .howday-card.is-leaving-right{animation:howday-out-right .28s ease forwards}
#howday .howday-card.is-entering-left{animation:howday-in-left .38s cubic-bezier(.2,.75,.25,1) forwards}
#howday .howday-card.is-entering-right{animation:howday-in-right .38s cubic-bezier(.2,.75,.25,1) forwards}
@keyframes howday-out-left{
from{transform:translateX(0);opacity:1}
to{transform:translateX(-52px);opacity:0}
}
@keyframes howday-out-right{
from{transform:translateX(0);opacity:1}
to{transform:translateX(52px);opacity:0}
}
@keyframes howday-in-left{
from{transform:translateX(-52px);opacity:0}
to{transform:translateX(0);opacity:1}
}
@keyframes howday-in-right{
from{transform:translateX(52px);opacity:0}
to{transform:translateX(0);opacity:1}
}
.plp-point-icon{
width:42px;
height:42px;
padding:9px;
}
.plp-point-icon img{
display:block;
width:100%;
height:100%;
object-fit:contain;
}
.plp-icon-2 img{
filter:brightness(0) invert(1);
}
@media(max-width:560px){
#howday .howday-card{height:300px;min-height:300px}
#howday .howday-card-inner{padding:24px}
}
@media(prefers-reduced-motion:reduce){
#howday .howday-card{animation:none!important;transition:none!important}
}
/* ===== Refinement requested — 6 Aug 2026, palette, comparison, programme and form ===== */
/* Non-clickable pills use navy/cyan, keeping orange exclusive to primary actions. */
.tag{
background:var(--navy);
color:#fff;
}
.tag.blue{
background:var(--sky);
color:#fff;
}
#hero .tag:not(.blue){
background:#fff;
color:var(--navy);
}
#ecosystem .tag,
#strength .tag,
#final-cta .tag{
background:var(--sky);
color:#fff;
}
.kv-badge{
background:var(--grad-cyan);
}
.p-card-badge{
background:var(--navy);
}
.loc-badge{
background:rgba(33,177,233,.12)!important;
color:var(--navy)!important;
border-color:rgba(33,177,233,.28)!important;
flex:0 1 auto;
max-width:100%;
box-sizing:border-box;
line-height:1.25;
}
#locations .loc-card-top{
display:flex;
justify-content:space-between;
align-items:flex-start;
flex-wrap:wrap;
gap:8px 12px;
min-width:0;
}
#locations .loc-name{
min-width:0;
flex:1 1 auto;
}
#locations .loc-badge{
/* Keep pill on its own row when the card is too narrow (3-col ~900–1200). */
white-space:normal;
}
/* Enrolling badge: match index_new_3 computed polish (soft sky + navy),
not the leftover orange inline styles on the Century card. */
#locations .loc-card .loc-badge,
#locations .loc-badge{
background:rgba(33,177,233,.12) !important;
color:var(--navy) !important;
border:1px solid rgba(33,177,233,.28) !important;
}
/* 3-col desktop and 2-col tablet: stack name + Enrolling badge to prevent overlap */
@media(max-width:1200px){
#locations .loc-card-top{
flex-direction:column;
align-items:flex-start;
gap:8px;
}
#locations .loc-badge{
white-space:nowrap;
max-width:100%;
}
}
@media(max-width:640px){
#locations .loc-card-top{
flex-direction:row;
flex-wrap:wrap;
align-items:center;
gap:8px 12px;
}
#locations .loc-name{
flex:0 1 auto;
}
#locations .loc-badge{
white-space:nowrap;
line-height:1.25;
}
}
/* Match the problem statement to the standard section-title scale. */
#problem .problem-q{
font-size:clamp(1.8rem,4vw,2.6rem);
font-weight:900;
line-height:1.15;
letter-spacing:-.015em;
color:var(--navy);
margin-bottom:16px;
}
/* Comparison: one consistent neutral treatment and a solid GenieHouse header. */
.compare-head.bad,
.compare-cell.bad{
background:#F1F5F9;
}
.compare-head.good{
background:var(--sky);
color:#fff;
}
.compare-cell.good{
background:#F1FAFD;
}
/* Ecosystem product sequence is GenieSmart, GenieClass, Bubble Store. */
.eco-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
}
@media(max-width:860px){
.eco-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
.eco-grid{grid-template-columns:1fr}
}
/* Reviews: use a softer Font Awesome quote symbol and position it slightly lower. */
.review-card::after{
content:'\f10e';
top:38px;
right:28px;
font-family:'Font Awesome 6 Free';
font-weight:900;
font-size:4.6rem;
line-height:1;
color:rgba(33,177,233,.09);
transform:rotate(-4deg);
}
/* Secondary palette is intentionally scoped to the Programme section only. */
#programme{
--programme-blue:#204999;
--programme-green:#54B87E;
--programme-light-blue:#476DB3;
--programme-light-grey:#F2F3F3;
--programme-yellow:#FED00F;
--programme-violet:#926FB0;
background:var(--programme-light-grey);
}
#programme .hub-card{
border:0;
box-shadow:none;
color:#fff;
background:none;
}
#programme .hub-card:hover{
border:0;
transform:translateY(-4px);
box-shadow:0 18px 38px rgba(32,73,153,.16);
}
#programme .hub-card-1{background:var(--programme-blue)}
#programme .hub-card-2{background:var(--programme-green)}
#programme .hub-card-3{background:var(--programme-light-blue)}
#programme .hub-card-4{background:var(--programme-violet)}
#programme .hub-card-5{
background:var(--programme-yellow);
color:var(--navy);
}
#programme .hub-name,
#programme .hub-desc{
color:inherit;
}
#programme .hub-icon{
background:rgba(255,255,255,.18)!important;
color:#fff;
}
#programme .hub-card-5 .hub-icon{
background:rgba(42,35,95,.10)!important;
color:var(--navy);
}
#programme .subject-chip{
background:rgba(255,255,255,.16);
border-color:rgba(255,255,255,.34);
color:#fff;
}
#programme .hub-card-5 .subject-chip{
background:rgba(42,35,95,.08);
border-color:rgba(42,35,95,.18);
color:var(--navy);
}
/* Locations: exactly three cards per row on desktop. */
#locations .loc-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
}
@media(max-width:900px){
#locations .loc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
#locations .loc-grid{grid-template-columns:minmax(0,1fr)}
}
/* Pricing card CTAs — match export (navy outline, no forced white text) */
.geniehouse_page #pricing .btn.btn-primary {
color: #fff !important;
}
.geniehouse_page #pricing .btn.btn-outline {
background: transparent !important;
color: var(--navy) !important;
border: 2px solid var(--navy) !important;
backdrop-filter: none !important;
}
.geniehouse_page #pricing .btn.btn-outline:hover {
background: rgba(42, 35, 95, 0.06) !important;
color: var(--navy) !important;
transform: none !important;
box-shadow: none !important;
}
.geniehouse_page #pricing .btn.btn-outline i {
margin-right: 8px;
}
.geniehouse_page #locations .loc-cta-row .btn.btn-primary,
.geniehouse_page #locations .loc-cta-row .btn.btn-primary:hover {
color: #fff !important;
background: var(--orange) !important;
}
.geniehouse_page #locations .loc-cta-row .btn.btn-primary:hover {
background: var(--orange2) !important;
}
.geniehouse_page #locations .loc-cta-row .btn.btn-primary i,
.geniehouse_page #locations .loc-cta-row .btn.btn-primary i::before {
color: #fff !important;
}
.geniehouse_page #locations .loc-cta-row .btn.btn-primary i {
margin-right: 8px;
}
/* ===== index_new_2 delta (Option 2) ===== */
/* === from early refinement: section pills + compare logo === */
/* ===== Refinement requested: section pills, review quote and pricing badge ===== */
/* Section label pills use the GenieHouse supporting colour. */
#problem .tag,
#howday .tag,
#programme .tag,
#photos .tag,
#plp .tag,
#pricing .tag,
#strength .tag,
#locations .tag,
#faq .tag,
#final-cta .tag{
background:var(--sky);
color:#fff;
border-color:transparent;
}
/* The ecosystem label uses a translucent glass treatment on the dark section. */
#ecosystem .tag{
background:rgba(255,255,255,.12);
color:#fff;
border:1px solid rgba(255,255,255,.30);
box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 8px 24px rgba(0,0,0,.08);
-webkit-backdrop-filter:blur(12px);
backdrop-filter:blur(12px);
}
/* index_new_3 cascade: palette refinement wins over glass — solid sky pill */
#ecosystem .tag{
background:var(--sky);
color:#fff;
border:1px solid transparent;
box-shadow:none;
-webkit-backdrop-filter:none;
backdrop-filter:none;
}
/* Lift the decorative quote slightly without affecting card layout. */
.review-card::after{
top:26px;
}
/* Give every PLP topic label the same width so all progress bars align. */
#plp .plp-topic-name{
width:176px;
white-space:nowrap;
}
#plp .plp-topic-name.sentence-transformation{
font-size:.70rem;
}
#plp .plp-goal-name.sentence-transformation{
white-space:nowrap;
}
/* Match the Founding Member badge to the orange primary CTA. */
.p-card-badge{
background:var(--orange);
color:#fff;
}
@media(max-width:640px){
.review-card::after{top:24px}
#plp .plp-topic-name{
width:160px;
}
#plp .plp-topic-name.sentence-transformation{
font-size:.66rem;
}
}
/* Ecosystem UI screenshots use relative image files placed beside this HTML file. */
.eco-card-media img{object-position:center top}
/* Comparison table: GenieHouse wordmark */
.compare-head.good{
display:flex;
align-items:center;
justify-content:center;
min-height:96px;
}
.compare-geniehouse-logo{
display:block;
width:auto;
height:auto;
max-width:150px;
max-height:76px;
object-fit:contain;
}
@media(max-width:640px){
.compare-head.good{min-height:84px}
.compare-geniehouse-logo{max-width:130px;max-height:66px}
}
/* ===== Refinement requested: 6 Aug 2026, comparison, ecosystem, reviews and pricing ===== */
/* Give the neutral table headers a slightly stronger grey than the body rows. */
.compare-head.bad{
background:#E2E8F0;
}
.compare-cell.bad{
background:#F1F5F9;
}
/* Place each ecosystem wordmark above its UI thumbnail and centre it. */
.eco-card-name{
order:1;
width:100%;
min-height:0;
justify-content:center;
text-align:center;
margin:0 0 16px;
}
.eco-card-name-image{
margin:0 auto;
object-position:center center;
}
.eco-card-media{
order:2;
}
.eco-card-desc{
order:3;
}
/* Raise the decorative quote by a further 24 px. */
.review-card::after{
top:14px;
}
/* Match the founding-rate pill to the featured card's orange border. */
.p-card.featured .p-card-badge{
background:var(--orange);
}
@media(max-width:640px){
.review-card::after{top:10px}
}
/* === comparison-header-sizing-v17 === */
/* Comparison header: GenieHouse wordmark with matching header heights. */
.compare-head{
height:118px;
min-height:118px;
display:flex;
align-items:center;
justify-content:center;
padding:24px 20px;
}
.compare-geniehouse-logo{
display:block;
width:auto;
height:70px;
max-width:180px;
max-height:none;
object-fit:contain;
}
@media(max-width:640px){
.compare-head,
.compare-head.good{
height:118px;
min-height:118px;
}
.compare-geniehouse-logo{
height:70px;
max-width:180px;
max-height:none;
}
}
/* === ecosystem-product-thumbnails-and-pretty-wrap-v19 === */
/* Ecosystem product thumbnails: match the supplied 940 × 856 artwork ratio. */
#ecosystem .eco-card-media{
width:100%;
aspect-ratio:940 / 856;
margin-bottom:24px;
background:transparent;
border:0;
outline:0;
box-shadow:none;
border-radius:0;
overflow:hidden;
}
#ecosystem .eco-card-media img{
width:100%;
height:100%;
display:block;
object-fit:cover;
object-position:center top;
border:0;
outline:0;
box-shadow:none;
}
#ecosystem .eco-card-media picture{
display:block;
width:100%;
height:100%;
}
/* Improve responsive line endings and reduce orphaned final words. */
:is(h1,h2,h3,h4,h5,h6,p,li,blockquote,figcaption,label,.section-title,.section-sub,.hero-sub,.eco-card-desc,.review-copy,.review-source,.hub-desc,.plp-point-text,.howday-card-desc,.loc-addr,.faq-a,.p-card-desc,.pricing-sub,.problem-a,.problem-answer,.multiplier-sub,.fcta-inner p){
text-wrap:pretty;
}
/* === mobile-responsive-audit-fixes-v20 === */
/* Mobile responsive audit fixes that prevent page-level overflow while keeping intentional internal scrolling. */
body.geniehouse_page{
width:100%;
max-width:100%;
overflow-x:clip;
}
.container,
.nav-inner,
.hero-grid,
.compare-grid,
.review-grid,
.howday-sticky,
.hubs-grid,
.eco-grid,
.photos-grid,
.plp-grid,
.pricing-cards,
.steps-row,
.loc-grid,
.footer-inner{
min-width:0;
}
.hero-left,.hero-right,
.plp-left,.plp-right,
.howday-left,.howday-right,
.eco-card,.hub-card,.review-card,.p-card,.loc-card{
min-width:0;
max-width:100%;
}
/* Tablet ecosystem: avoid three cramped cards. */
@media (max-width:900px) and (min-width:641px){
#ecosystem .eco-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
#ecosystem .eco-card:last-child{
grid-column:1/-1;
width:calc(50% - 12px);
justify-self:center;
}
}
@media(max-width:640px){
/* Consistent mobile page gutters. */
.container{padding-left:20px;padding-right:20px}
/* Navigation stays inside narrow 320–390px viewports. */
#nav{width:100%;max-width:100vw}
.nav-inner{
width:100%;
max-width:none;
padding:6px 16px;
gap:12px;
}
.nav-logo,.nav-logo-link{flex:0 0 auto;min-width:0}
.nav-logo-img{width:82px;max-width:82px}
.nav-cta{
flex:0 0 auto;
max-width:calc(100vw - 126px);
padding:9px 12px;
font-size:.75rem;
line-height:1.1;
white-space:nowrap;
}
/* Hero: compact title, full-width actions and a balanced 2×2 stat grid. */
#hero{padding-top:112px}
.hero-h1{font-size:clamp(2rem,10.5vw,2.45rem)}
.hero-sub{font-size:1rem}
.hero-ctarow .btn{
width:100%;
max-width:100%;
white-space:normal;
text-align:center;
line-height:1.25;
}
.hero-stats{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
width:100%;
row-gap:18px;
}
.hero-stat{
min-width:0;
padding:0 12px;
border-left:1px solid rgba(255,255,255,.25);
}
.hero-stat:nth-child(odd){padding-left:0;border-left:0}
.hero-stat-text{font-size:.95rem}
/* Comparison stays readable as a contained swipeable 3-column table. */
#compare .compare-grid{
display:grid;
grid-template-columns:repeat(3,minmax(180px,1fr));
width:100%;
max-width:100%;
overflow-x:auto;
overflow-y:hidden;
overscroll-behavior-inline:contain;
-webkit-overflow-scrolling:touch;
scroll-snap-type:x proximity;
scrollbar-width:thin;
}
#compare .compare-col{display:block;scroll-snap-align:start}
#compare .compare-head,
#compare .compare-head.good{
display:flex!important;
height:108px;
min-height:108px;
padding:18px 14px;
font-size:.86rem;
}
#compare .compare-geniehouse-logo{height:64px;max-width:155px}
#compare .compare-row{display:contents!important}
#compare .compare-cell{
display:flex!important;
min-width:0;
padding:16px 14px;
font-size:.82rem;
}
/* How-a-day timeline: same width as card, no endpoint overflow, simpler labels. */
#howday .howday-scroll-outer,
#howday .howday-sticky,
#howday .howday-left,
#howday .howday-right,
#howday .howday-timeline-strip,
#howday .howday-card{
width:100%;
max-width:100%;
min-width:0;
}
#howday .howday-tl-dots{
display:grid;
grid-template-columns:repeat(6,minmax(0,1fr));
width:100%;
}
#howday .howday-tl-step{min-width:0;gap:5px}
#howday .howday-tl-time{
font-size:.61rem;
white-space:nowrap;
}
#howday .howday-tl-label{display:none}
#howday .howday-tl-line{
left:calc(100% / 12);
right:calc(100% / 12);
}
#howday .howday-card{height:310px;min-height:310px}
#howday .howday-card-inner{padding:24px}
/* PLP: remove min-content expansion and reflow the dense mock-up. */
#plp .plp-grid{
grid-template-columns:minmax(0,1fr);
gap:32px;
}
#plp .plp-left,
#plp .plp-right,
#plp .plp-mockup{
width:100%;
max-width:100%;
min-width:0;
}
#plp .plp-left .btn-primary{
width:100%;
max-width:100%;
white-space:normal;
text-align:center;
line-height:1.3;
padding-left:18px;
padding-right:18px;
}
#plp .plp-mock-header{gap:10px;padding:14px 16px}
#plp .plp-mock-header>div{min-width:0}
#plp .plp-mock-hname{font-size:.92rem}
#plp .plp-mock-hmeta{font-size:.66rem}
#plp .plp-mock-body{padding:16px}
#plp .plp-topic-row{
display:grid;
grid-template-columns:minmax(0,1fr) auto;
gap:5px 10px;
align-items:center;
margin-bottom:12px;
}
#plp .plp-topic-name,
#plp .plp-topic-name.sentence-transformation{
grid-column:1;
grid-row:1;
width:auto!important;
min-width:0;
max-width:100%;
white-space:nowrap!important;
overflow:hidden;
text-overflow:ellipsis;
font-size:.7rem;
}
#plp .plp-topic-pct{
grid-column:2;
grid-row:1;
width:auto;
}
#plp .plp-topic-bar-bg{
grid-column:1/-1;
grid-row:2;
width:100%;
}
#plp .plp-topic-badge{display:none}
#plp .plp-goals-row{grid-template-columns:1fr}
#plp .plp-goal-name.sentence-transformation{white-space:nowrap}
/* Pricing and forms remain inside the viewport. */
.p-card-badge{
max-width:calc(100% - 24px);
text-align:center;
white-space:normal;
line-height:1.2;
font-size:.7rem;
}
.p-card [style*="min-width:180px"]{
min-width:0!important;
width:100%;
flex-basis:100%!important;
}
#visitForm{width:100%;max-width:100%;padding:24px!important}
/* Long location CTA no longer creates horizontal page scroll. */
#locations .loc-cta-row{width:100%;max-width:100%;min-width:0}
#locations .loc-cta-row .btn{
width:100%;
max-width:100%;
white-space:normal;
text-align:center;
line-height:1.25;
padding-left:18px;
padding-right:18px;
}
.faq-q{padding:20px;min-width:0}
.faq-q>span:first-child{min-width:0}
.wa-float{
width:48px;
height:48px;
right:16px;
bottom:16px;
font-size:1.35rem;
}
}
@media(max-width:360px){
.container{padding-left:16px;padding-right:16px}
.nav-inner{padding-left:14px;padding-right:14px;gap:10px}
.nav-logo-img{width:76px;max-width:76px}
.nav-cta{max-width:calc(100vw - 112px);padding:8px 10px;font-size:.7rem}
.hero-h1{font-size:2rem}
.hero-eyebrow .tag{padding-left:12px;padding-right:12px;font-size:.68rem}
#compare .compare-grid{grid-template-columns:repeat(3,minmax(170px,1fr))}
#howday .howday-tl-time{font-size:.56rem}
#howday .howday-card{height:320px;min-height:320px}
#plp .plp-mock-header>div:last-child{display:none}
#plp .plp-mock-body{padding:14px}
#plp .plp-goal-card{padding:12px}
.review-card{padding:20px}
.review-card::after{right:14px}
.p-card{padding-left:20px;padding-right:20px}
#visitForm{padding:20px!important}
}
/* === mobile-responsive-polish-v20b === */
/* Keep the comparison CTA outside the swipeable table. */
#compare .compare-grid{border-radius:24px 24px 0 0}
#compare .compare-footer{
width:100%;
border-radius:0 0 24px 24px;
}
#compare .compare-footer a{
justify-content:center;
text-align:center;
text-wrap:balance;
}
@media(max-width:640px){
#compare .compare-footer{padding:18px 16px}
#compare .compare-footer a{font-size:.92rem;line-height:1.3}
#plp .plp-left .btn-primary,
#locations .loc-cta-row .btn{
font-size:.95rem;
text-wrap:balance;
}
}
/* === responsive-alignment-fixes-v21 === */
/* Tablet and mobile trust statistics: align content to the left. */
@media(max-width:800px){
#trust .trust-inner{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
justify-content:stretch;
align-items:start;
gap:20px 24px;
width:100%;
}
#trust .trust-item{
width:100%;
min-width:0;
padding:0;
justify-content:flex-start;
align-items:center;
text-align:left;
}
#trust .trust-item>div{min-width:0;text-align:left}
}
@media(max-width:560px){
#trust .trust-inner{grid-template-columns:minmax(0,1fr);gap:18px}
}
/* Keep the comparison CTA arrow attached directly after “child”. */
#compare .compare-footer-tail{
display:inline-flex;
align-items:center;
gap:8px;
white-space:nowrap;
}
/* On small screens, the comparison scroller opens on the GenieHouse column. */
@media(max-width:640px){
#compare .compare-grid{scroll-snap-type:x mandatory}
#compare .compare-head.good{scroll-snap-align:end}
}
/* === interactive-location-map-v22 === */
/* Interactive Google Maps campus viewer. */
#locations .loc-card{
cursor:pointer;
user-select:none;
}
#locations .loc-card:focus-visible{
outline:3px solid rgba(33,177,233,.35);
outline-offset:4px;
}
#locations .loc-card.is-active{
border-color:var(--sky)!important;
background:linear-gradient(145deg,rgba(33,177,233,.10),rgba(255,255,255,.98))!important;
box-shadow:0 14px 36px rgba(33,177,233,.16);
}
.location-map{
width:100%;
margin:0 0 40px;
padding:24px;
border:1px solid var(--line,#E2E8F0);
border-radius:24px;
background:#fff;
box-shadow:0 14px 42px rgba(42,35,95,.08);
scroll-margin-top:88px;
}
.location-map-header{
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:24px;
margin-bottom:20px;
}
.location-map-heading{min-width:0}
.location-map-kicker{
display:block;
margin-bottom:5px;
color:var(--sky);
font-family:'Nunito',sans-serif;
font-size:.72rem;
font-weight:900;
letter-spacing:.08em;
text-transform:uppercase;
}
.location-map h3{
margin:0 0 4px;
color:var(--navy);
font-size:1.45rem;
font-weight:900;
}
.location-map p{
margin:0;
color:var(--muted);
font-size:.9rem;
line-height:1.5;
text-wrap:pretty;
}
.location-map-frame{
position:relative;
width:100%;
aspect-ratio:16 / 8;
overflow:hidden;
border-radius:18px;
background:#EAF4F9;
}
.location-map-frame iframe{
position:absolute;
inset:0;
width:100%;
height:100%;
border:0;
}
.location-map-frame iframe.is-inactive{
/* Keep visible to the browser so Google Maps can finish loading while covered. */
opacity:0;
pointer-events:none;
z-index:0;
}
.location-map-frame iframe.is-active{
opacity:1;
pointer-events:auto;
z-index:1;
}
@media(max-width:700px){
.location-map{padding:16px;border-radius:20px;margin-bottom:32px}
.location-map-header{align-items:flex-start;flex-direction:column;gap:14px;margin-bottom:16px}
.location-map-frame{aspect-ratio:1 / 1;border-radius:16px}
}
/* === global-pretty-wrap-v23 === */
/* Use browser-aware line wrapping throughout the page while preserving the hero title's intentional composition. */
body.geniehouse_page{
text-wrap:pretty;
}
.hero-h1,
.hero-h1 *{
text-wrap:wrap;
}
/* === requested-polish-v24 === */
/* Stronger separation between the fixed navigation and the hero gradient. */
#nav{
background:rgba(13,10,48,.98);
border-bottom-color:rgba(255,255,255,.16);
box-shadow:0 10px 30px rgba(7,5,30,.28);
}
/* Preserve the desktop right alignment of the regular price. */
#pricing .p-card-regular-price{
text-align:right;
}
/* On mobile, align the crossed-out $780/month block with the main price. */
@media(max-width:640px){
#pricing .p-card-regular-price{
width:100%;
text-align:left;
}
}
/* Hero sentence wraps from index_new_2 */
.hero-sub{text-wrap:pretty}
.hero-sub .hero-sentence{white-space:nowrap}
@media(max-width:640px){
.hero-sub .hero-sentence{white-space:normal}
}
/* Hide trust dividers when trust-inner becomes grid */
@media(max-width:800px){
#trust .trust-divider{display:none}
}
/* Active location dashed Century Square still readable when selected */
#locations .loc-card.is-active[style*="dashed"]{
border-style:solid!important;
}
/* Compare GenieHouse header — match index_new_2 / design preview.
Beat .geniehouse_body img{height:auto} so logo stays 70px on sky header. */
.geniehouse_body #compare .compare-head.good{
background:var(--sky);
color:#fff;
display:flex;
align-items:center;
justify-content:center;
height:118px;
min-height:118px;
padding:24px 20px;
}
.geniehouse_body #compare .compare-head.good .compare-geniehouse-logo{
display:block;
width:auto;
height:70px;
max-width:180px;
max-height:none;
object-fit:contain;
}
@media(max-width:640px){
.geniehouse_body #compare .compare-head.good{
height:108px;
min-height:108px;
padding:18px 14px;
}
.geniehouse_body #compare .compare-head.good .compare-geniehouse-logo{
height:64px;
max-width:155px;
}
}
/* ===== Typography size/line-height sync (index_new_2 / CF preview) ===== */
.geniehouse_body .hero-h1{
font-size:clamp(2.2rem,4.15vw,3.55rem);
}
@media(max-width:640px){
.geniehouse_body .hero-h1{font-size:clamp(2.05rem,8vw,3rem)}
.geniehouse_body .hero-sub{font-size:1rem;line-height:1.6}
}
/* Review cards — CF final polish (.93rem copy / 1.08rem name) */
.geniehouse_body .review-name{
font-family:'Nunito',sans-serif !important;
font-size:1.08rem !important;
font-weight:900 !important;
line-height:1.15;
letter-spacing:normal;
}
.geniehouse_body .review-copy{
font-family:'DM Sans',sans-serif !important;
font-weight:400 !important;
font-size:.93rem !important;
line-height:1.6 !important;
}
.geniehouse_body .review-source{
font-size:.72rem;
font-weight:700;
letter-spacing:.01em;
}
.geniehouse_body .review-date{font-size:.76rem}
.geniehouse_body .review-stars{font-size:.76rem}
@media(max-width:800px){
.geniehouse_body .review-copy{font-size:.9rem !important}
}
/* Trust strip — match CF trust-nav-polish-v27 */
.geniehouse_body .trust-item > div > div{
font-family:'Nunito',sans-serif !important;
font-size:1rem;
line-height:1.3;
}
.geniehouse_body .trust-stat-number{
font-size:1rem !important;
font-weight:900;
line-height:1.3;
margin-bottom:2px;
}
.geniehouse_body .trust-item > div > div:not(.trust-stat-number){
font-weight:700;
}
.geniehouse_body .trust-ple-title{
font-size:1.28rem !important;
line-height:1.35;
font-family:'Nunito',sans-serif !important;
}
.geniehouse_body .trust-ple-pill{
font-size:.92rem !important;
line-height:1.35;
font-family:'Nunito',sans-serif !important;
}
.geniehouse_body .trust-ple-pill i{font-size:1rem !important}
@media(max-width:768px){
.geniehouse_body .trust-item > div > div,
.geniehouse_body .trust-stat-number{font-size:.96rem !important}
.geniehouse_body .trust-ple-title{font-size:1.16rem !important}
.geniehouse_body .trust-ple-pill{font-size:.88rem !important}
}
/* PLP points — match CF computed (desktop ~1.08rem / .94rem) */
.geniehouse_body #plp .plp-point-text h4{
font-family:'Nunito',sans-serif !important;
font-size:1.08rem;
line-height:1.35;
letter-spacing:-0.015em;
margin-bottom:4px;
}
.geniehouse_body #plp .plp-point-text p{
font-family:'DM Sans',sans-serif !important;
font-weight:400 !important;
font-size:.94rem;
line-height:1.6;
margin-top:0;
}
@media(max-width:640px){
.geniehouse_body #plp .plp-point-text h4{font-size:1rem}
.geniehouse_body #plp .plp-point-text p{font-size:.9rem}
}
/* Compare / eco / faq body rhythm */
.geniehouse_body .compare-cell{
font-family:'DM Sans',sans-serif !important;
line-height:1.5;
}
.geniehouse_body .eco-card-desc{
font-family:'DM Sans',sans-serif !important;
line-height:1.6;
}
.geniehouse_body .faq-a{
font-family:'DM Sans',sans-serif !important;
line-height:1.7;
}
.geniehouse_body .hub-desc{
font-family:'DM Sans',sans-serif !important;
line-height:1.6;
}
.geniehouse_body .loc-addr{
font-family:'DM Sans',sans-serif !important;
line-height:1.5;
}
.geniehouse_body .problem-a{
font-family:'DM Sans',sans-serif !important;
line-height:1.7;
}
/* ===== Nav layout sync with CF preview =====
Logo left; links + CTA grouped on the right. Mobile hamburger dropdown. */
.geniehouse_body .nav-inner{
justify-content:flex-start;
}
.geniehouse_body .nav-actions{
position:relative;
display:flex;
align-items:center;
justify-content:flex-end;
gap:24px;
margin-left:auto;
min-width:0;
}
.geniehouse_body .nav-actions .nav-links{
display:flex;
align-items:center;
justify-content:flex-end;
gap:32px;
}
.geniehouse_body .nav-menu-toggle{
display:none;
box-sizing:border-box;
width:44px;
height:44px;
flex:0 0 44px;
align-items:center;
justify-content:center;
margin:0;
padding:0;
border:0;
border-radius:12px;
background:rgba(255,255,255,.12);
color:#fff;
cursor:pointer;
font-size:1.05rem;
line-height:1;
transition:background .2s ease,transform .2s ease;
}
.geniehouse_body .nav-menu-toggle:hover{
background:rgba(255,255,255,.2);
}
.geniehouse_body .nav-menu-toggle:active{
transform:scale(.96);
}
.geniehouse_body .nav-menu-toggle:focus-visible{
outline:3px solid rgba(89,207,255,.45);
outline-offset:3px;
}
.geniehouse_body .nav-menu-toggle i{
display:inline-block;
line-height:1;
color:#fff;
}
@media(max-width:768px){
.geniehouse_body .nav-inner{overflow:visible}
.geniehouse_body .nav-actions{gap:10px}
.geniehouse_body .nav-actions .nav-cta{
max-width:none !important;
flex:0 0 auto;
}
.geniehouse_body .nav-menu-toggle{display:inline-flex !important}
.geniehouse_body .nav-actions .nav-links{
display:none !important;
position:absolute;
top:calc(100% + 12px);
right:0;
z-index:120;
width:min(260px,calc(100vw - 32px));
padding:10px;
flex-direction:column;
align-items:stretch;
gap:4px;
border-radius:20px;
background:rgba(13,10,48,.99);
box-shadow:0 18px 48px rgba(7,5,30,.35);
backdrop-filter:blur(16px);
-webkit-backdrop-filter:blur(16px);
}
.geniehouse_body .nav-actions .nav-links.is-open{
display:flex !important;
}
.geniehouse_body .nav-actions .nav-links a{
display:block;
width:100%;
padding:12px 14px;
border-radius:12px;
color:#fff;
text-align:left;
font-weight:700 !important;
}
.geniehouse_body .nav-actions .nav-links a:hover,
.geniehouse_body .nav-actions .nav-links a:focus-visible{
background:rgba(255,255,255,.1);
color:var(--sky-bright);
outline:none;
}
}
@media(max-width:360px){
.geniehouse_body .nav-actions{gap:8px}
.geniehouse_body .nav-menu-toggle{
width:40px;
height:40px;
flex-basis:40px;
border-radius:10px;
}
.geniehouse_body .nav-actions .nav-cta{
padding:8px 10px;
font-size:.7rem;
}
}
/* Allow hero CTAs to wrap/share width on narrow desktop (801–1120)
so they do not overflow into the video column (CF preview polish). */
@media (min-width:801px) and (max-width:1120px){
.geniehouse_body .hero-grid{
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}
.geniehouse_body .hero-left,
.geniehouse_body .hero-right{
min-width:0;
max-width:100%;
}
.geniehouse_body .hero-ctarow{
align-items:stretch;
min-width:0;
}
.geniehouse_body .hero-ctarow .btn,
.geniehouse_body .hero-ctarow a.btn{
flex:1 1 0;
min-width:0;
padding-left:20px;
padding-right:20px;
white-space:normal !important;
text-align:center;
line-height:1.2;
min-height:56px;
}
}
/* ===== index_new_3 responsive polish (v27–v38) ===== */
/* v27 — remove nav divider (trust type already synced above) */
#nav{
border-bottom:none !important;
}
/* v28 — map radius + top scroll cue (nav hamburger already present) */
.location-map{
border-radius:var(--r,24px) !important;
}
@media(max-width:700px){
.location-map{border-radius:var(--r,24px) !important}
}
.top-scroll-cue{
position:fixed;
left:50%;
bottom:24px;
z-index:95;
width:54px;
min-width:54px;
height:72px;
padding:8px 0 6px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:5px;
color:#fff;
background:rgba(13,10,48,.52);
border:1px solid rgba(255,255,255,.28);
border-radius:999px;
box-shadow:0 10px 32px rgba(7,5,30,.24);
backdrop-filter:blur(12px);
-webkit-backdrop-filter:blur(12px);
cursor:pointer;
opacity:1;
visibility:visible;
transform:translate(-50%,0);
transition:opacity .25s ease,visibility .25s ease,transform .25s ease,background .2s ease;
animation:scrollCueFloat 2.2s ease-in-out infinite;
}
.top-scroll-cue:hover,
.top-scroll-cue:focus-visible{
background:rgba(13,10,48,.78);
outline:3px solid rgba(113,197,232,.45);
outline-offset:3px;
}
.top-scroll-cue.is-hidden{
opacity:0;
visibility:hidden;
pointer-events:none;
transform:translate(-50%,14px);
animation:none;
}
.top-scroll-cue-mouse{
position:relative;
width:21px;
height:31px;
border:2px solid currentColor;
border-radius:999px;
flex:0 0 auto;
}
.top-scroll-cue-wheel{
position:absolute;
left:50%;
top:6px;
width:3px;
height:7px;
border-radius:999px;
background:currentColor;
transform:translateX(-50%);
animation:scrollCueWheel 1.6s ease-in-out infinite;
}
.top-scroll-cue-arrow{
font-size:.72rem;
line-height:1;
animation:scrollCueArrow 1.6s ease-in-out infinite;
}
@keyframes scrollCueFloat{
0%,100%{transform:translate(-50%,0)}
50%{transform:translate(-50%,-7px)}
}
@keyframes scrollCueWheel{
0%{opacity:0;transform:translate(-50%,0)}
30%{opacity:1}
75%{opacity:0;transform:translate(-50%,10px)}
100%{opacity:0;transform:translate(-50%,10px)}
}
@keyframes scrollCueArrow{
0%,100%{opacity:.45;transform:translateY(-1px)}
50%{opacity:1;transform:translateY(3px)}
}
@media(max-width:768px){
.top-scroll-cue{
bottom:16px;
width:48px;
min-width:48px;
height:64px;
}
.top-scroll-cue-mouse{width:19px;height:28px}
}
@media(prefers-reduced-motion:reduce){
.top-scroll-cue,
.top-scroll-cue-wheel,
.top-scroll-cue-arrow{animation:none !important}
}
/* v30 — PLP feature list scale + FAQ open state */
#plp .plp-points{
gap:20px;
}
#plp .plp-point{
gap:16px;
}
#plp .plp-point-icon{
width:50px;
height:50px;
padding:11px;
}
#faq .faq-item{
overflow:hidden;
background-clip:padding-box;
transition:border-color .2s ease,box-shadow .2s ease;
}
#faq .faq-item.open{
border-color:#BFE7F5;
box-shadow:0 10px 30px rgba(42,35,95,.08);
}
#faq .faq-a{
border-top:0 !important;
padding:0 28px 24px;
}
#faq .faq-item.open .faq-q{
padding-bottom:16px;
}
@media(max-width:640px){
#plp .plp-points{gap:18px}
#plp .plp-point{gap:14px}
#plp .plp-point-icon{
width:46px;
height:46px;
padding:10px;
}
#faq .faq-a{padding:0 22px 22px}
}
/* v31 + v32 compare divider */
#compare .compare-head.compare-bad-divider,
#compare .compare-cell.compare-bad-divider{
border-left:1px solid rgba(148,163,184,.28);
}
#compare .compare-head.compare-bad-divider{
white-space:nowrap;
font-size:clamp(.84rem,1.15vw,1rem);
line-height:1.25;
}
@media(max-width:640px){
#compare .compare-grid{
grid-template-columns:repeat(3,minmax(250px,1fr));
}
#compare .compare-head.compare-bad-divider{
font-size:.82rem;
}
}
@media(max-width:360px){
#compare .compare-grid{
grid-template-columns:repeat(3,minmax(235px,1fr));
}
}
/* v32 — hero CTA + review container queries */
.hero-left{
container-type:inline-size;
}
.review-card{
container-type:inline-size;
}
@container (max-width:560px){
.hero-ctarow{
display:grid;
grid-template-columns:1fr;
gap:10px;
width:100%;
}
.hero-ctarow .btn{
width:100%;
max-width:100%;
min-width:0;
white-space:normal;
text-align:center;
line-height:1.25;
}
}
@container (max-width:410px){
.review-meta{
display:block;
min-width:0;
}
.review-name{
display:block;
margin:0 0 6px;
white-space:normal;
}
.review-rating{
display:flex;
flex-wrap:wrap;
row-gap:4px;
}
}
/* v33 — vertically centre review meta */
.review-top .review-meta{
align-self:center;
justify-self:stretch;
min-height:100%;
justify-content:center;
}
@container (max-width:410px){
.review-top .review-meta{
align-self:center;
min-height:auto;
}
}
/* v34 — keep avatar + meta horizontal on smallest cards */
.review-card .review-top{
grid-template-columns:auto minmax(0,1fr) !important;
align-items:center !important;
}
@container (max-width:300px){
.review-card .review-top{
grid-template-columns:auto minmax(0,1fr) !important;
align-items:center !important;
gap:10px;
}
.review-card .review-avatar{
width:48px;
height:48px;
border-width:3px;
font-size:.82rem;
}
.review-card .review-meta{
align-self:center;
min-width:0;
}
}
/* v35 — wide desktop hero CTAs stay one row */
@media (min-width:1121px){
.hero-ctarow{
display:flex !important;
flex-direction:row;
flex-wrap:nowrap !important;
align-items:center;
width:auto;
gap:12px;
}
.hero-ctarow .btn{
flex:0 0 auto;
width:auto !important;
max-width:none;
min-width:0;
white-space:nowrap !important;
text-align:center;
}
}
/* v36 — fluid hero stats */
.hero-stats{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
width:100%;
gap:0;
align-items:start;
}
.hero-stat{
min-width:0;
padding:0 16px;
border-left:1px solid rgba(255,255,255,.24);
}
.hero-stat:first-child{
padding-left:0;
border-left:0;
}
.hero-stat-label,
.hero-stat-text{
max-width:100%;
}
@container (max-width:500px){
.hero-stats{
grid-template-columns:repeat(2,minmax(0,1fr));
row-gap:20px;
}
.hero-stat{padding:0 16px}
.hero-stat:nth-child(odd){
padding-left:0;
border-left:0;
}
}
@media (min-width:641px) and (max-width:800px){
.hero-stats{
grid-template-columns:repeat(4,minmax(0,1fr));
row-gap:0;
}
.hero-stat{
padding:0 16px;
border-left:1px solid rgba(255,255,255,.24);
}
.hero-stat:first-child{
padding-left:0;
border-left:0;
}
}
@media (max-width:640px){
.hero-stats{
grid-template-columns:repeat(2,minmax(0,1fr));
row-gap:18px;
}
.hero-stat{padding:0 12px}
.hero-stat:nth-child(odd){
padding-left:0;
border-left:0;
}
}
/* v37 — wide desktop natural-width stats */
@media (min-width:1121px){
.hero-stats{
display:flex !important;
flex-wrap:nowrap;
align-items:flex-start;
justify-content:flex-start;
width:max-content;
max-width:100%;
}
.hero-stat{
flex:0 0 auto;
width:auto;
min-width:max-content;
padding-left:18px;
padding-right:18px;
}
.hero-stat:first-child{padding-left:0}
.hero-stat:last-child{padding-right:0}
}
/* v38 — tighter section padding on wide desktop */
@media (min-width:1025px){
#problem,
#compare,
#multiplier,
#programme,
#photos,
#plp,
#pricing,
#strength,
#locations,
#faq,
#final-cta,
#ecosystem,
#howday{
padding-top:64px !important;
padding-bottom:64px !important;
}
}
/* ===== index_new_4 detail2 — palette + howday spacing (v40–v43) ===== */
/* v40 — primary brand palette tokens + semantic aliases */
.geniehouse_body{
/* Orange */
--orange-dark:#E57B41;
--orange-main:#F7941E;
--orange-bright:#F6C483;
--orange-light:#FFE2BF;
--orange-faded:#FFF7EA;
/* Primary / Sky Blue */
--sky-dark:#1B769D;
--sky-main:#27AAE1;
--sky-shade:#43BDF2;
--sky-bright:#89D7F8;
--sky-light:#C8EBFA;
--sky-faded:#E8F8FF;
/* Primary / Navy Blue */
--navy-dark:#16133E;
--navy-main:#262262;
--navy-shade:#3E3A6E;
--navy-bright:#6660B9;
--navy-light:#8F8AD1;
--navy-faded:#CECDF2;
/* Existing semantic aliases */
--navy:var(--navy-main);
--navy2:var(--navy-dark);
--sky:var(--sky-main);
--orange:var(--orange-main);
--orange2:var(--orange-dark);
--purple:var(--navy-shade);
--blue:var(--sky-main);
--gold:var(--orange-main);
--text:var(--navy-main);
--grad-hero:linear-gradient(135deg,var(--navy-dark) 0%,var(--navy-shade) 100%);
--grad-dark:linear-gradient(135deg,var(--navy-dark) 0%,var(--navy-main) 100%);
--grad-cyan:linear-gradient(135deg,var(--sky-dark) 0%,var(--sky-shade) 100%);
--grad-orange:linear-gradient(135deg,var(--orange-dark) 0%,var(--orange-bright) 100%);
}
/* Hardcoded moderate-gap orange → new brand orange */
.plp-fill-moderate{background:#F7941E}
/* v41 — brighter sky blue gradient */
.geniehouse_body{
--grad-cyan:linear-gradient(
135deg,
var(--sky-main) 0%,
var(--sky-shade) 48%,
var(--sky-bright) 100%
);
}
.howday-time-pill,
.trust-ple-logo{
background:var(--grad-cyan) !important;
}
/* v42 — brighter navy gradients + hero brand glows */
.geniehouse_body{
--grad-hero:linear-gradient(
135deg,
var(--navy-main) 0%,
var(--navy-shade) 52%,
var(--navy-bright) 100%
);
--grad-dark:linear-gradient(
135deg,
var(--navy-main) 0%,
var(--navy-shade) 58%,
var(--navy-bright) 100%
);
}
#hero{
background:
radial-gradient(circle at 82% 18%,rgba(137,215,248,.22),transparent 28%),
radial-gradient(circle at 8% 92%,rgba(247,148,30,.14),transparent 25%),
var(--grad-hero) !important;
}
/* v43 — softer video shadow; narrower howday active card */
.video-wrap{
box-shadow:0 28px 70px rgba(14,11,45,.22) !important;
}
#howday .howday-timeline-strip{
max-width:760px;
}
#howday .howday-card{
max-width:640px;
}
@media(max-width:800px){
#howday .howday-card{
max-width:100%;
}
}
/* Strength step 1: two-line label on desktop/tablet; one line on mobile */
#strength .step-card:first-child h3{
line-height:1.2;
}
@media(max-width:768px){
#strength .step-card:first-child h3 .sh-cta-break{display:none}
}
/* ===== GBLSFB-3137 — PLP preview mock + mobile spacing ===== */
.plp-fill-developing{background:#27AAE1;width:48%}
.plp-fill-developing-mid{background:#27AAE1;width:55%}
#plp .plp-fill-moderate{background:#43BDF2;width:68%}
#plp .plp-fill-strong{background:#16B983;width:84%}
#plp .badge-developing{background:#E8F8FF;color:#188fbe}
#plp .badge-moderate{background:#E8F8FF;color:#188fbe}
#plp .badge-strong{background:#DFF7ED;color:#0e9f70}
#plp .plp-pct-sky{color:#27AAE1}
#plp .plp-pct-green{color:#16B983}
#plp .plp-mockup{
max-width:546px;
margin-left:auto;
border-radius:23px;
box-shadow:0 20px 48px rgba(35,45,75,.12);
border:0;
}
@media(max-width:768px){
#plp .plp-right{
display:flex;
justify-content:center;
}
#plp .plp-mockup{
margin-left:auto;
margin-right:auto;
}
}
@media (min-width:769px) and (max-width:930px){
#plp .plp-goals-row{
grid-template-columns:1fr;
}
}
#plp .plp-mock-header{
flex-direction:column;
justify-content:center;
align-items:center;
text-align:center;
padding:20px 24px 18px;
}
#plp .plp-mock-header>div{
width:100%;
}
#plp .plp-mock-header>div:last-child{
display:block;
}
#plp .plp-mock-hname{
font-size:16px;
line-height:1.25;
letter-spacing:-.01em;
}
#plp .plp-mock-hmeta{
margin-top:5px;
font-size:12px;
line-height:1.45;
color:rgba(255,255,255,.78);
font-weight:700;
}
#plp .plp-mock-body{padding:24px 22px 20px}
#plp .plp-mock-section-kicker{
display:block;
margin:0 0 4px;
font-size:11px;
line-height:1.2;
font-weight:900;
text-transform:uppercase;
letter-spacing:.06em;
color:var(--navy);
text-align:center;
}
#plp .plp-focus-section .plp-mock-section-kicker{color:#27AAE1}
#plp .plp-mock-section-title{
margin:0 0 16px;
font-size:16px;
line-height:1.25;
text-align:center;
letter-spacing:-.01em;
}
#plp .plp-mock-body > .plp-mock-section-title{margin-bottom:18px}
#plp .plp-legend{
gap:14px;
justify-content:center;
margin-bottom:18px;
color:#65718c;
font-size:9.5px;
line-height:1.35;
font-weight:800;
}
#plp .plp-legend-item{gap:5px}
#plp .plp-topic-rows{
display:flex;
flex-direction:column;
gap:12px;
}
#plp .plp-topic-row{
display:grid;
grid-template-columns:minmax(0,176px) 1fr 38px 62px;
align-items:center;
gap:10px;
margin-bottom:0;
font-size:11px;
line-height:1.3;
}
#plp .plp-topic-name{
width:auto;
font-weight:900;
color:#1E3D34;
white-space:nowrap;
line-height:1.3;
}
#plp .plp-topic-bar-bg{
height:8px;
background:#EDF2FB;
}
#plp .plp-topic-pct{
width:auto;
text-align:right;
font-size:10px;
line-height:1.2;
}
#plp .plp-topic-badge{
justify-self:end;
width:62px;
text-align:center;
padding:5px 8px;
font-size:8px;
line-height:1.15;
font-weight:900;
}
#plp .plp-focus-section{
margin-top:18px;
padding:20px 18px 18px;
border-radius:16px;
background:#E8F8FF;
}
#plp .plp-focus-section .plp-mock-section-title{margin-bottom:16px}
#plp .plp-goals-row{
gap:12px;
margin-top:0;
}
#plp .plp-goal-card{
min-height:104px;
padding:14px 16px;
border-radius:12px;
background:#fff;
box-shadow:0 6px 16px rgba(39,170,225,.06);
}
#plp .plp-goal-developing{
background:#fff;
border-color:#BFE7F8;
}
#plp .plp-goal-developing .plp-goal-name{
margin-bottom:5px;
font-size:11px;
line-height:1.35;
color:var(--navy);
font-weight:900;
}
#plp .plp-goal-developing .plp-goal-target{
margin-bottom:8px;
font-size:11px;
line-height:1.3;
color:#27AAE1;
font-weight:900;
}
#plp .plp-goal-desc{
margin:0;
color:#65718c;
font-size:9.8px;
line-height:1.55;
font-weight:600;
}
#plp .plp-caption{
padding:14px 20px 16px;
color:#6c7692;
font-size:10px;
line-height:1.45;
font-weight:600;
border-top-color:#EDF0F6;
}
@media(max-width:620px){
#plp .plp-mock-header{padding:18px 18px 16px}
#plp .plp-mock-body{padding:22px 16px 18px}
#plp .plp-goals-row{grid-template-columns:1fr}
#plp .plp-focus-section{padding:18px 14px 14px}
}
@media(max-width:430px){
#plp .plp-mock-hname{font-size:14px}
#plp .plp-mock-hmeta{font-size:11px}
#plp .plp-topic-name{font-size:10px}
#plp .plp-legend{gap:10px}
}
@media(max-width:640px){
/* #multiplier{padding-bottom:28px !important} */
/* #howday{padding-top:28px !important} */
#compare .compare-title{margin-bottom:24px}
#plp .plp-topic-row{
display:grid;
grid-template-columns:minmax(0,1fr) auto auto;
gap:6px 8px;
align-items:center;
margin-bottom:0;
}
#plp .plp-topic-name,
#plp .plp-topic-name.sentence-transformation{
grid-column:1;
grid-row:1;
}
#plp .plp-topic-pct{
grid-column:2;
grid-row:1;
font-size:11px;
}
#plp .plp-topic-badge{
display:inline-block;
grid-column:3;
grid-row:1;
width:auto;
padding:4px 8px;
font-size:8px;
}
#plp .plp-topic-bar-bg{
grid-column:1/-1;
grid-row:2;
}
#plp .plp-goal-desc{
font-size:12px;
line-height:1.45;
}
#plp .plp-goal-card{min-height:0}
#ecosystem .eco-card-name{
margin-bottom:8px !important;
min-height:0;
}
#ecosystem .eco-card-media{
margin-bottom:14px;
}
#ecosystem .eco-card-media--mobile-shot{
aspect-ratio:940 / 721;
}
}
/* ===== GenieHouse rebrand — 31 Aug 2026 ===== */
/* 60% neutral surfaces, 30% primary greens, 10% warm supporting accents. */
body.geniehouse_page,
.geniehouse_body{
--forest:#1E3D34;
--oak:#B08A4E;
--oak-hover:#C1A35F;
--deep-teal:#264D4D;
--sage:#7E8F69;
--terracotta:#C46A4A;
--stone:#6F736F;
--soft-beige:#E6DCC6;
--charcoal:#2B2B2B;
--warm-taupe:#BF8476;
--light-taupe:#B8AA95;
--ivory:#F4F1E8;
--off-white:#F2F0EF;
--lilac:#B98FC3;
--mint:#A7C8B4;
--sand:#DBC3A5;
--slate-blue:#546B77;
--mustard:#D4A22D;
--dusky-blue:#3D6070;
--olive:#7A884B;
--blush:#DDAEAA;
--navy-dark:var(--forest);
--navy-main:var(--forest);
--navy-shade:var(--deep-teal);
--navy-bright:var(--sage);
--navy-light:var(--mint);
--navy-faded:var(--soft-beige);
--sky-dark:var(--deep-teal);
--sky-main:var(--deep-teal);
--sky-shade:var(--sage);
--sky-bright:var(--soft-beige);
--sky-light:var(--mint);
--sky-faded:var(--ivory);
--orange-dark:var(--terracotta);
--orange-main:var(--oak);
--orange-bright:var(--mustard);
--orange-light:var(--sand);
--orange-faded:var(--ivory);
--navy:var(--forest);
--navy2:var(--deep-teal);
--sky:var(--deep-teal);
--orange:var(--oak);
--orange2:var(--terracotta);
--purple:var(--sage);
--blue:var(--deep-teal);
--gold:var(--oak);
--white:#FFFFFF;
--off:var(--ivory);
--text:var(--charcoal);
--muted:var(--stone);
--line:var(--soft-beige);
--grad-hero:linear-gradient(135deg,var(--forest) 0%,var(--deep-teal) 100%);
--grad-dark:linear-gradient(135deg,var(--forest) 0%,var(--deep-teal) 100%);
--grad-cyan:linear-gradient(135deg,var(--deep-teal) 0%,var(--sage) 58%,var(--mint) 100%);
--grad-orange:linear-gradient(135deg,var(--oak) 0%,var(--terracotta) 100%);
--grad-neutral:linear-gradient(135deg,var(--off-white) 0%,var(--ivory) 100%);
color:var(--charcoal);
background:var(--off-white);
}
/* Responsive placements for the official GenieHouse logo asset. */
.geniehouse-logo{
display:block;
width:auto;
max-width:100%;
height:auto;
object-fit:contain;
}
.geniehouse-logo--nav{width:190px;max-height:64px}
.geniehouse-logo--compare{width:194px;max-height:76px;margin:0 auto}
.geniehouse-logo--footer{width:214px;max-height:84px;margin-bottom:24px}
/* Primary structure and 60% neutral balancing surfaces. */
.geniehouse_body #nav{
background:rgba(30,61,52,.98) !important;
box-shadow:0 10px 30px rgba(30,61,52,.24);
}
.geniehouse_page .geniehouse_body #nav .nav-inner{
height:82px;
min-height:82px;
}
@media(max-width:768px){
.geniehouse_page .geniehouse_body .nav-menu-toggle{
background:rgba(167,200,180,.18) !important;
border:1px solid rgba(167,200,180,.38);
color:var(--ivory) !important;
}
.geniehouse_page .geniehouse_body .nav-menu-toggle:hover{
background:var(--deep-teal) !important;
}
.geniehouse_page .geniehouse_body .nav-menu-toggle:focus-visible{
outline-color:var(--mint) !important;
}
.geniehouse_page .geniehouse_body .nav-menu-toggle i{
color:var(--ivory) !important;
}
.geniehouse_page .geniehouse_body .nav-actions .nav-links{
background:rgba(30,61,52,.99) !important;
border:1px solid rgba(167,200,180,.25);
box-shadow:0 18px 48px rgba(30,61,52,.35);
}
.geniehouse_page .geniehouse_body .nav-actions .nav-links a{
color:var(--ivory) !important;
}
.geniehouse_page .geniehouse_body .nav-actions .nav-links a:hover,
.geniehouse_page .geniehouse_body .nav-actions .nav-links a:focus-visible{
background:rgba(167,200,180,.18) !important;
color:var(--soft-beige) !important;
}
}
.geniehouse_body #hero{
background:
radial-gradient(circle at 82% 18%,rgba(200,224,207,.32),transparent 30%),
radial-gradient(circle at 8% 92%,rgba(167,200,180,.22),transparent 27%),
linear-gradient(120deg,#31584B 0%,#4F715F 58%,var(--sage) 100%) !important;
}
.geniehouse_body #trust,
.geniehouse_body #compare,
.geniehouse_body #plp,
.geniehouse_body #locations{background:var(--off-white)}
.geniehouse_body #problem,
.geniehouse_body #howday,
.geniehouse_body #photos,
.geniehouse_body #pricing,
.geniehouse_body #faq{background:var(--off-white)}
.geniehouse_body #ecosystem{
background:#2A2761 !important;
}
.geniehouse_body #strength,
.geniehouse_body #final-cta{
background:
radial-gradient(circle at 90% 10%,rgba(167,200,180,.14),transparent 30%),
var(--grad-dark) !important;
}
/* Keep section headings on-brand even when earlier component rules set navy. */
.geniehouse_page .geniehouse_body .section-title,
.geniehouse_page .geniehouse_body #problem .problem-q,
.geniehouse_page .geniehouse_body #plp .plp-left > h2{
color:var(--forest) !important;
}
.geniehouse_page .geniehouse_body #ecosystem .eco-header h2,
.geniehouse_page .geniehouse_body #strength h2,
.geniehouse_page .geniehouse_body #final-cta h2{
color:var(--ivory) !important;
}
/* Match the parent testimonials section to the Five Learning Hubs surface. */
.geniehouse_body #multiplier{background:var(--off-white) !important}
.geniehouse_body #multiplier .multiplier-h2{color:var(--forest) !important}
.geniehouse_body #multiplier .multiplier-h2 span{color:var(--deep-teal) !important}
.geniehouse_body #multiplier .multiplier-sub{color:var(--stone) !important}
/* Primary actions use Warm Oak; hover uses the lighter Oak variant. */
.geniehouse_body .btn-primary,
.geniehouse_body a.btn-primary,
.geniehouse_body a.btn.btn-primary,
.geniehouse_body a.btn.btn-primary.btn-lg,
.geniehouse_body .nav-cta,
.geniehouse_body a.nav-cta,
.geniehouse_body .sh_form_submit_btn,
.geniehouse_body .sh_form_thanks_wa,
.geniehouse_body a.sh_form_thanks_wa,
.geniehouse_page #pricing .btn.btn-primary,
.geniehouse_page #locations .loc-cta-row .btn.btn-primary{
background:var(--oak) !important;
color:#fff !important;
box-shadow:0 8px 22px rgba(176,138,78,.24);
}
.geniehouse_body .btn-primary:hover,
.geniehouse_body a.btn-primary:hover,
.geniehouse_body a.btn.btn-primary.btn-lg:hover,
.geniehouse_body .nav-cta:hover,
.geniehouse_body a.nav-cta:hover,
.geniehouse_body .sh_form_submit_btn:hover,
.geniehouse_body .sh_form_thanks_wa:hover,
.geniehouse_body a.sh_form_thanks_wa:hover,
.geniehouse_page #pricing .btn.btn-primary:hover,
.geniehouse_page #locations .loc-cta-row .btn.btn-primary:hover{
background:var(--oak-hover) !important;
color:#fff !important;
}
.geniehouse_body .sh_form_submit_btn .button_text,
.geniehouse_body .sh_form_submit_btn .button_loading:not(.button_disable){color:#fff !important}
.geniehouse_body .sh_form_submit_btn:hover .button_text,
.geniehouse_body .sh_form_submit_btn:hover .button_loading:not(.button_disable){color:#fff !important}
.geniehouse_page #locations .loc-cta-row .btn.btn-primary i,
.geniehouse_page #locations .loc-cta-row .btn.btn-primary i::before{color:#fff !important}
.geniehouse_page #locations .loc-cta-row .btn.btn-primary:hover i,
.geniehouse_page #locations .loc-cta-row .btn.btn-primary:hover i::before{color:#fff !important}
/* Exact CTA selectors prevent older component rules from winning on hover. */
.geniehouse_page .geniehouse_body #hero a.btn.btn-primary.btn-lg:hover,
.geniehouse_page .geniehouse_body #visitForm .sh_form_submit_btn:hover:not(:disabled){
background:#C1A35F !important;
color:#fff !important;
}
.geniehouse_page .geniehouse_body #visitForm .sh_form_submit_btn:hover:not(:disabled) .button_text,
.geniehouse_page .geniehouse_body #visitForm .sh_form_submit_btn:hover:not(:disabled) .button_loading:not(.button_disable){color:#fff !important}
/* Primary-action accessibility and interaction consistency. */
.geniehouse_body a.sh_form_thanks_wa{font-weight:800 !important}
.geniehouse_body .btn-primary:focus-visible,
.geniehouse_body .nav-cta:focus-visible,
.geniehouse_body .sh_form_submit_btn:focus-visible,
.geniehouse_body .sh_form_thanks_wa:focus-visible{
outline:3px solid #fff !important;
outline-offset:2px;
box-shadow:0 0 0 5px var(--forest),0 8px 22px rgba(176,138,78,.24) !important;
}
@media(max-width:640px){
.geniehouse_body .nav-cta{min-height:44px;padding-top:10px;padding-bottom:10px}
}
/* Supporting highlights stay within the green family; accents remain at 10%. */
.geniehouse_body .tag,
.geniehouse_body .tag.blue,
.geniehouse_body #ecosystem .tag,
.geniehouse_body #strength .tag,
.geniehouse_body #final-cta .tag{
background:var(--deep-teal);
color:var(--ivory);
}
.geniehouse_body #hero .tag:not(.blue){background:var(--ivory);color:var(--forest)}
.geniehouse_body .p-card-badge,
.geniehouse_body .step-num{background:var(--oak)}
.geniehouse_body .p-card-badge{color:#fff !important}
.geniehouse_body .step-num{color:var(--forest)}
.geniehouse_body #strength .step-num{color:var(--ivory) !important}
.geniehouse_body #ecosystem .tag{
background:var(--mustard) !important;
color:var(--forest) !important;
border-color:var(--mustard) !important;
}
.geniehouse_body section:not(#hero) .tag,
.geniehouse_body section:not(#hero) .tag.blue{
background:var(--terracotta) !important;
color:var(--off-white) !important;
border-color:var(--terracotta) !important;
box-shadow:none;
}
.geniehouse_body .howday-time-pill,
.geniehouse_body .trust-ple-logo{background:var(--grad-cyan) !important}
.geniehouse_body .kv-badge{
background:linear-gradient(135deg,var(--forest) 0%,#173b32 100%) !important;
border-color:var(--soft-beige) !important;
}
.geniehouse_body .hero-h1 span,
.geniehouse_body .multiplier-h2 span,
.geniehouse_body .fcta-inner h2 span{color:var(--soft-beige)}
.geniehouse_body .trust-stat-number,
.geniehouse_body .trust-ple-title,
.geniehouse_body .location-map-kicker{color:var(--deep-teal)}
.geniehouse_body .trust-ple-band{background:rgba(167,200,180,.20)}
.geniehouse_body .trust-ple-pill{border-color:var(--mint);color:var(--forest)}
/* Cards, comparison and programme accents. */
.geniehouse_body .compare-head.bad{
background:#D9D9D9 !important;
color:var(--charcoal) !important;
}
.geniehouse_body .compare-cell.bad{
background:#EAE7E5 !important;
color:var(--charcoal) !important;
}
.geniehouse_body #compare .compare-cell.bad .cell-icon{color:var(--stone) !important}
.geniehouse_body #compare .compare-head.good{background:var(--forest);color:var(--ivory)}
.geniehouse_body .compare-cell.good{background:rgba(167,200,180,.22)}
.geniehouse_body .compare-footer{background:var(--deep-teal)}
.geniehouse_body #photos .photo-caption{
background:linear-gradient(180deg,rgba(30,61,52,0) 0%,rgba(30,61,52,.92) 100%);
}
.geniehouse_body .compare-row,
.geniehouse_body .p-card,
.geniehouse_body .pricing-note,
.geniehouse_body .faq-item,
.geniehouse_body .tl-card,
.geniehouse_body .location-map{border-color:var(--soft-beige)}
.geniehouse_body .review-card::after{color:rgba(126,143,105,.14)}
.geniehouse_body .review-avatar{color:var(--forest) !important}
.geniehouse_body .review-card:nth-child(1) .review-avatar{background:var(--mint) !important}
.geniehouse_body .review-card:nth-child(2) .review-avatar{background:var(--sand) !important}
.geniehouse_body .review-card:nth-child(3) .review-avatar{background:var(--blush) !important}
.geniehouse_body #programme{
--programme-blue:var(--forest);
--programme-green:var(--sage);
--programme-light-blue:var(--deep-teal);
--programme-light-grey:var(--off-white);
--programme-yellow:var(--oak);
--programme-violet:var(--terracotta);
background:var(--off-white);
}
.geniehouse_body #programme .hub-card-5,
.geniehouse_body #programme .hub-card-5 .hub-icon,
.geniehouse_body #programme .hub-card-5 .hub-name,
.geniehouse_body #programme .hub-card-5 .hub-desc,
.geniehouse_body #programme .hub-card-5 .hub-icon i,
.geniehouse_body #programme .hub-card-5 .subject-chip{color:#fff !important}
/* PLP preview and location states use the supporting palette. */
.geniehouse_body #plp .plp-mock-header{background:var(--forest)}
.geniehouse_body #plp .plp-fill-developing,
.geniehouse_body #plp .plp-fill-developing-mid{background:var(--sage)}
.geniehouse_body #plp .plp-fill-moderate{background:var(--oak)}
.geniehouse_body #plp .plp-fill-strong{background:var(--deep-teal)}
.geniehouse_body #plp .badge-developing{background:var(--mint);color:var(--forest)}
.geniehouse_body #plp .badge-moderate{background:var(--sand);color:var(--forest)}
.geniehouse_body #plp .badge-strong{background:var(--soft-beige);color:var(--deep-teal)}
.geniehouse_body #plp .plp-pct-sky{color:var(--sage)}
.geniehouse_body #plp .plp-pct-green{color:var(--deep-teal)}
.geniehouse_body #plp .plp-focus-section{background:rgba(167,200,180,.24)}
.geniehouse_body #plp .plp-goal-developing{border-color:var(--mint)}
.geniehouse_body #plp .plp-goal-developing .plp-goal-target{color:var(--deep-teal)}
.geniehouse_body #plp .plp-legend-item:nth-child(1) .plp-legend-dot{background:var(--sage) !important}
.geniehouse_body #plp .plp-legend-item:nth-child(2) .plp-legend-dot{background:var(--oak) !important}
.geniehouse_body #plp .plp-legend-item:nth-child(3) .plp-legend-dot{background:var(--deep-teal) !important}
.geniehouse_body #locations .loc-card:hover,
.geniehouse_body #locations .loc-card.is-active{border-color:var(--sage) !important}
.geniehouse_body #locations .loc-card.is-active{
background:linear-gradient(145deg,rgba(167,200,180,.28),rgba(244,241,232,.98)) !important;
box-shadow:0 14px 36px rgba(30,61,52,.12);
}
.geniehouse_body #locations .loc-card[style*="dashed"]{
background:linear-gradient(135deg,rgba(176,138,78,.08),rgba(167,200,180,.10)) !important;
}
.geniehouse_body #locations .loc-badge{
background:var(--soft-beige) !important;
color:var(--forest) !important;
border-color:var(--sand) !important;
}
.geniehouse_body #faq .faq-item.open{border-color:var(--mint)}
.geniehouse_body #faq .faq-q:hover{color:var(--deep-teal)}
.geniehouse_body #faq .faq-item.open .faq-arrow{background:var(--deep-teal)}
.geniehouse_body #faq .faq-item.open .faq-q{color:var(--oak) !important}
.geniehouse_page #footer_container footer{background:var(--forest) !important}
.geniehouse_page #footer_container .footer-col h4{color:var(--soft-beige) !important}
.geniehouse_page #footer_container .footer-col a:hover{color:var(--sand) !important}
.geniehouse_body .top-scroll-cue{
background:linear-gradient(135deg,var(--forest) 0%,var(--sage) 100%);
color:var(--off-white);
border-color:var(--mint);
box-shadow:0 10px 32px rgba(30,61,52,.28);
}
.geniehouse_body .top-scroll-cue:hover,
.geniehouse_body .top-scroll-cue:focus-visible{
background:linear-gradient(135deg,var(--deep-teal) 0%,var(--sage) 100%);
outline-color:var(--mint);
}
/* Mobile schedule card wraps the tallest activity instead of using a fixed height. */
@media(max-width:640px){
.geniehouse_body #howday .howday-card{
height:auto;
min-height:0;
}
}
/* Polished page motion: directional reveals, staggered groups and smooth accordions. */
.geniehouse_body .fade-up{
--reveal-delay:0ms;
opacity:0;
transform:translate3d(0,24px,0) scale(.99);
transition:
opacity .62s cubic-bezier(.22,.7,.24,1) var(--reveal-delay),
transform .7s cubic-bezier(.22,.7,.24,1) var(--reveal-delay);
}
.geniehouse_body .fade-up.reveal-left{
transform:translate3d(-28px,0,0) scale(.99);
}
.geniehouse_body .fade-up.reveal-right{
transform:translate3d(28px,0,0) scale(.99);
}
.geniehouse_body .fade-up.visible{
opacity:1;
transform:translate3d(0,0,0) scale(1);
}
.geniehouse_body .reveal-stagger-item{
opacity:0;
transform:translate3d(0,16px,0) scale(.985);
}
.geniehouse_body .reveal-stagger.visible .reveal-stagger-item{
animation:geniehouse-stagger-in .52s cubic-bezier(.22,.7,.24,1) both;
animation-delay:calc(var(--reveal-delay) + (var(--reveal-item-index) * 70ms));
}
@keyframes geniehouse-stagger-in{
to{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
.geniehouse_body #howday .howday-card.is-entering-left .howday-time-pill,
.geniehouse_body #howday .howday-card.is-entering-right .howday-time-pill,
.geniehouse_body #howday .howday-card.is-entering-left .howday-card-title,
.geniehouse_body #howday .howday-card.is-entering-right .howday-card-title,
.geniehouse_body #howday .howday-card.is-entering-left .howday-card-desc,
.geniehouse_body #howday .howday-card.is-entering-right .howday-card-desc{
animation:geniehouse-card-content-in .28s cubic-bezier(.22,.7,.24,1) both;
}
.geniehouse_body #howday .howday-card.is-entering-left .howday-card-title,
.geniehouse_body #howday .howday-card.is-entering-right .howday-card-title{animation-delay:60ms}
.geniehouse_body #howday .howday-card.is-entering-left .howday-card-desc,
.geniehouse_body #howday .howday-card.is-entering-right .howday-card-desc{animation-delay:100ms}
@keyframes geniehouse-card-content-in{
from{opacity:0;transform:translate3d(0,10px,0)}
to{opacity:1;transform:translate3d(0,0,0)}
}
.geniehouse_body #faq .faq-q{
transition:color .2s ease,padding .36s cubic-bezier(.22,.7,.24,1);
}
.geniehouse_body #faq .faq-a{
display:block;
max-height:0;
overflow:hidden;
opacity:0;
transform:translate3d(0,-6px,0);
padding:0 28px;
transition:
max-height .42s cubic-bezier(.22,.7,.24,1),
opacity .28s ease,
transform .36s cubic-bezier(.22,.7,.24,1),
padding-bottom .36s cubic-bezier(.22,.7,.24,1);
}
.geniehouse_body #faq .faq-item.open .faq-a{
max-height:var(--faq-answer-height,420px);
opacity:1;
transform:none;
padding-bottom:24px;
}
@media(max-width:640px){
.geniehouse_body .fade-up{transform:translate3d(0,18px,0) scale(.995)}
.geniehouse_body .fade-up.reveal-left{transform:translate3d(-18px,0,0) scale(.995)}
.geniehouse_body .fade-up.reveal-right{transform:translate3d(18px,0,0) scale(.995)}
.geniehouse_body .fade-up.visible{transform:translate3d(0,0,0) scale(1)}
.geniehouse_body #faq .faq-a{padding-left:22px;padding-right:22px}
}
@media(prefers-reduced-motion:reduce){
.geniehouse_body .fade-up,
.geniehouse_body .reveal-stagger-item{
opacity:1!important;
transform:none!important;
transition:none!important;
animation:none!important;
}
.geniehouse_body #faq .faq-q,
.geniehouse_body #faq .faq-a,
.geniehouse_body #howday .howday-card,
.geniehouse_body #howday .howday-card *{
transition:none!important;
animation:none!important;
}
}
/* Replace pure-white foreground text with the warmer Off White neutral. */
.geniehouse_page .geniehouse_body :is(
.nav-links a,
.nav-menu-toggle,
.nav-menu-toggle i,
.hero-h1,
.hero-sub,
.hero-stat-label,
.hero-stat-text,
.btn-primary,
.btn-outline,
.nav-cta,
.problem-answer,
.compare-head.good,
.compare-footer a,
.tl-time,
.photo-caption,
.plp-point-icon,
.plp-mock-hname,
.plp-mock-hmeta,
.plp-mock-section-label,
.p-card-badge,
.strength-inner h2,
.strength-inner .section-sub,
.step-num,
.step-card h3,
.step-card p,
.strength-small,
.fcta-inner h2,
.fcta-inner p,
.fcta-note,
.tl-icon,
.step-icon,
.vid-sound-btn,
.howday-step-num,
.howday-time-pill,
.howday-btn:hover,
.kv-badge,
.eco-header h2,
.eco-header p,
.eco-card-tag,
.eco-card-name,
.eco-card-desc,
.eco-bubble-cta,
.eco-bubble-gift,
.trust-icon,
.trust-ple-logo,
.hub-icon,
.hub-card .hub-name,
.hub-card .hub-desc,
.hub-card .subject-chip,
.faq-item.open .faq-arrow,
.sh_form_submit_btn,
.sh_form_submit_btn .button_text,
.sh_form_submit_btn .button_loading:not(.button_disable),
.sh_form_thanks_wa
){color:var(--off-white) !important}
.geniehouse_page #footer_container :is(
.footer-brand p,
.footer-col a,
.footer-bottom p,
.social-btn,
.social-btn i
){color:var(--off-white) !important}
@media(max-width:640px){
.geniehouse-logo--nav{width:150px;max-height:50px}
.geniehouse-logo--compare{width:164px;max-height:66px}
.geniehouse-logo--footer{width:184px;max-height:74px}
}
@media(max-width:768px){
.geniehouse_page .geniehouse_body #nav .nav-inner{
height:72px;
min-height:72px;
}
}
@media(max-width:560px){
.geniehouse_page .geniehouse_body #pricing .p-card.featured{
padding-top:36px;
}
}
/* Adjacent sections on the same surface share one gap instead of stacking two. */
.geniehouse_body{
--same-surface-section-half-gap:32px;
}
.geniehouse_body #problem,
.geniehouse_body #multiplier,
.geniehouse_body #howday,
.geniehouse_body #programme,
.geniehouse_body #photos,
.geniehouse_body #plp,
.geniehouse_body #locations{
padding-bottom:var(--same-surface-section-half-gap) !important;
}
.geniehouse_body #compare,
.geniehouse_body #howday,
.geniehouse_body #programme,
.geniehouse_body #photos,
.geniehouse_body #plp,
.geniehouse_body #pricing,
.geniehouse_body #faq{
padding-top:var(--same-surface-section-half-gap) !important;
}
@media(max-width:1024px){
.geniehouse_body{--same-surface-section-half-gap:24px}
}
@media(max-width:560px){
.geniehouse_body{--same-surface-section-half-gap:16px}
}
/* Screenshot feedback — clearer mobile hierarchy and supporting pricing/location copy. */
.geniehouse_body .p-card-tax{
font-size:.82em;
font-weight:700;
white-space:nowrap;
}
.geniehouse_body .loc-sub{
display:flex;
flex-direction:row;
flex-wrap:wrap;
align-items:center;
justify-content:center;
gap:4px 8px;
line-height:1.5;
}
.geniehouse_body .loc-sub p{margin:0}
@media(max-width:640px){
.geniehouse_body #compare .compare-title .section-title{
font-size:2.15rem;
line-height:1.12;
}
.geniehouse_body .loc-sub{
flex-direction:column;
flex-wrap:nowrap;
gap:6px;
}
}
/* Screenshot feedback — Warm Oak and secondary accents. */
.geniehouse_body #compare .compare-cell.good .cell-icon.check{
color:var(--oak) !important;
}
.geniehouse_body #plp .plp-point-icon{
background:linear-gradient(135deg,var(--forest) 0%,var(--sage) 100%) !important;
}
.geniehouse_body #pricing .p-features li::before{
color:var(--oak) !important;
}
.geniehouse_body .trust-ple-pill i{
color:var(--oak) !important;
}
.geniehouse_body #faq .faq-item.open .faq-arrow{
background:linear-gradient(135deg,var(--forest) 0%,var(--sage) 100%) !important;
}
.geniehouse_body #multiplier .multiplier-h2 span{
color:var(--oak) !important;
}
.geniehouse_body #compare .compare-footer{
background:linear-gradient(120deg,var(--forest) 0%,var(--deep-teal) 56%,var(--sage) 100%);
}
.geniehouse_body #plp .plp-focus-section .plp-mock-section-kicker{
color:var(--terracotta) !important;
}
.geniehouse_body #plp .plp-goal-developing{
border-color:var(--sand);
}
.geniehouse_body #plp .plp-goal-developing .plp-goal-target{
color:var(--oak) !important;
}
.geniehouse_body #pricing .p-card.featured{
padding-top:50px;
}
.geniehouse_body #pricing .p-card.featured .p-card-badge{
top:-20px;
left:50%;
transform:translateX(-50%);
width:max-content;
max-width:calc(100% - 32px);
padding:10px 26px;
font-size:.9rem;
line-height:1.25;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
}
@media(max-width:640px){
.geniehouse_body #pricing .p-card.featured{
padding-top:48px;
}
.geniehouse_body #pricing .p-card.featured .p-card-badge{
top:-18px;
max-width:calc(100% - 28px);
padding:9px 20px;
font-size:.86rem;
}
.geniehouse_body .trust-ple-pills{
display:grid;
grid-template-columns:minmax(0,1fr);
width:100%;
max-width:220px;
margin-left:auto;
margin-right:auto;
}
.geniehouse_body .trust-ple-pill{
display:grid;
grid-template-columns:24px minmax(0,1fr);
align-items:center;
column-gap:8px;
width:100%;
text-align:left;
}
.geniehouse_body .trust-ple-pill i{
grid-column:1;
justify-self:start;
}
.geniehouse_body .trust-ple-pill > span{
grid-column:2;
text-align:left;
}
/* Intro copy should sit closer to its content than the 32px section gap. */
.geniehouse_body #hero .hero-sub{
margin-bottom:24px;
}
.geniehouse_body #ecosystem .eco-header,
.geniehouse_body #programme .prog-title,
.geniehouse_body #photos .photos-title,
.geniehouse_body #pricing .pricing-sub,
.geniehouse_body #locations .loc-sub,
.geniehouse_body #faq .faq-title{
margin-bottom:24px;
}
.geniehouse_body #pricing .pricing-sub{
margin-bottom:42px;
}
.geniehouse_body #multiplier .multiplier-sub{
margin-bottom:24px;
}
.geniehouse_body #howday .howday-timeline-strip{
margin-top:24px;
}
.geniehouse_body #strength .strength-inner > .section-sub{
margin-bottom:0 !important;
}
.geniehouse_body #strength .steps-row{
margin-top:24px;
}
}
/* Benefit separators stay attached to their row and never become orphans. */
.geniehouse_body .strength-benefits{
display:flex;
align-items:center;
justify-content:center;
flex-wrap:nowrap;
margin-top:14px;
}
.geniehouse_body .strength-benefits .strength-small{
white-space:nowrap;
}
.geniehouse_body .strength-benefit-divider{
margin:0 20px;
color:var(--off-white);
opacity:1;
}
@media(max-width:640px){
.geniehouse_body .strength-benefits{
display:grid;
grid-template-columns:auto auto auto;
align-items:center;
justify-content:center;
row-gap:14px;
}
.geniehouse_body .strength-benefit-divider{
margin:0 14px;
}
.geniehouse_body .strength-benefit-divider:nth-of-type(4){
display:none;
}
.geniehouse_body .strength-benefits .strength-small:last-child{
grid-column:1 / -1;
text-align:center;
}
}
/* Hero and navigation palette refinement — 1 Sep 2026. */
.geniehouse_page .geniehouse_body #nav{
background:var(--off-white) !important;
border-bottom:none !important;
box-shadow:0 10px 30px rgba(30,61,52,.22) !important;
}
.geniehouse_page .geniehouse_body #nav .nav-links a{
color:var(--forest) !important;
}
.geniehouse_page .geniehouse_body #nav .nav-links a:hover,
.geniehouse_page .geniehouse_body #nav .nav-links a:focus-visible{
color:var(--oak) !important;
}
.geniehouse_page .geniehouse_body #hero{
background:
radial-gradient(circle at 82% 18%,rgba(167,200,180,.24),transparent 31%),
radial-gradient(circle at 10% 92%,rgba(126,143,105,.16),transparent 28%),
linear-gradient(120deg,var(--forest) 0%,#31584B 58%,var(--sage) 100%) !important;
}
.geniehouse_page .geniehouse_body #hero .hero-eyebrow .tag.blue{
background:var(--terracotta) !important;
border-color:var(--terracotta) !important;
color:var(--off-white) !important;
box-shadow:none !important;
}
@media(max-width:768px){
.geniehouse_page .geniehouse_body #nav .nav-menu-toggle{
background:rgba(30,61,52,.08) !important;
border-color:rgba(30,61,52,.28) !important;
color:var(--forest) !important;
}
.geniehouse_page .geniehouse_body #nav .nav-menu-toggle i{
color:var(--forest) !important;
}
.geniehouse_page .geniehouse_body #nav .nav-menu-toggle:hover{
background:var(--forest) !important;
}
.geniehouse_page .geniehouse_body #nav .nav-menu-toggle:hover i{
color:var(--off-white) !important;
}
.geniehouse_page .geniehouse_body #nav .nav-menu-toggle:focus-visible{
outline-color:var(--forest) !important;
}
.geniehouse_page .geniehouse_body #nav .nav-actions .nav-links{
background:var(--off-white) !important;
border-color:rgba(30,61,52,.2) !important;
box-shadow:0 18px 48px rgba(30,61,52,.24) !important;
}
.geniehouse_page .geniehouse_body #nav .nav-actions .nav-links a{
color:var(--forest) !important;
}
.geniehouse_page .geniehouse_body #nav .nav-actions .nav-links a:hover,
.geniehouse_page .geniehouse_body #nav .nav-actions .nav-links a:focus-visible{
background:rgba(176,138,78,.12) !important;
color:var(--oak) !important;
}
}