*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:'Plus Jakarta Sans',ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#0A1931;background:#F6FAFD;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:'Cormorant Garamond',ui-serif,Georgia,serif;font-weight:600;letter-spacing:-.01em;margin:0;line-height:1.1}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
button{font:inherit;cursor:pointer}
:root{
 --navy:#0A1931;--deep:#1A3D63;--blue:#4A7FA7;--soft:#B3CFE5;--cream:#F6FAFD;--gold:#C9A24B;--gold-light:#E8C977;
 --bg:#F6FAFD;--fg:#0A1931;--card:#fff;--muted:#EAF2FA;--muted-fg:#3D6A93;--border:#DCE7F2;--accent:#4A7FA7;
 --grad:linear-gradient(135deg,#0A1931 0%,#1A3D63 55%,#4A7FA7 100%);
 --shadow-soft:0 12px 30px -12px rgba(10,25,49,.18);
 --shadow-elegant:0 25px 60px -25px rgba(10,25,49,.35);
}
.container{max-width:1200px;margin:0 auto;padding:0 1.25rem}
.top-bar{
 background:var(--navy);
 color:var(--soft);
 font-size:0.82rem;
 padding:10px 0;
 border-bottom:1px solid rgba(232,201,119,0.2);
}
.top-bar-inner{
 display:flex !important;
 justify-content:space-between !important;
 align-items:center !important;
 width:100% !important;
}
.top-bar-contact{
 display:flex !important;
 align-items:center !important;
 gap:20px !important;
 margin-right:auto !important;
}
.top-bar-contact a{
 color:var(--soft);
 text-decoration:none;
 display:inline-flex;
 align-items:center;
 gap:8px;
 line-height:1;
 transition:color 0.2s ease;
}
.top-bar-contact a svg{
 flex-shrink:0;
 opacity:0.85;
}
.top-bar-contact a:hover{color:var(--gold-light)}
.top-bar-note{
 color:var(--gold-light);
 font-weight:500;
 display:inline-flex;
 align-items:center;
 gap:6px;
}
.top-bar-social{
 display:flex !important;
 gap:12px !important;
 align-items:center !important;
 margin-left:auto !important;
}
@media (max-width:768px){
 .top-bar-contact{display:none !important}
 .top-bar-inner{
 display:flex !important;
 justify-content:space-between !important;
 align-items:center !important;
 padding:6px 12px !important;
}
 .top-bar-note{display:none !important}
 .top-bar-inner::before{
 content:"Reviews on ⭐ Trustpilot";
 color:#0b1a30;
 font-size:0.82rem;
 font-weight:700;
 display:flex;
 align-items:center;
 gap:4px;
}
 .top-bar-social{
 display:flex !important;
 gap:10px !important;
 align-items:center !important;
 margin-left:auto !important;
}
}
.site-header{position:sticky;top:0;z-index:40;backdrop-filter:blur(10px);background:rgba(246,250,253,.85);border-bottom:1px solid rgba(220,231,242,.6);box-shadow:0 1px 0 rgba(255,255,255,0.06)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:.65rem}
.brand-mark{width:40px;height:40px;border-radius:12px;background:var(--grad);display:grid;place-items:center;color:#fff;box-shadow:var(--shadow-soft)}
.brand-name{font-family:'Cormorant Garamond',serif;font-size:1.15rem;font-weight:600;color:var(--navy);display:block;line-height:1.1}
.brand-sub{display:block;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted-fg)}
.nav-links{display:none;gap:1.75rem;align-items:center}
.nav-links a{font-size:.9rem;color:rgba(10,25,49,.75);transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:var(--navy);font-weight:600}
.nav-cta{display:none}
.nav-toggle{background:none;border:0;color:var(--navy);padding:.5rem;margin-right:-.5rem}
@media(min-width:1024px){
 .nav-links{display:flex}
 .nav-cta{display:inline-flex}
 .nav-toggle{display:none}
}
.mobile-nav{display:none;border-top:1px solid var(--border);background:#fff;padding:1rem 0}
.mobile-nav.open{display:block}
.mobile-nav a{display:block;padding:.7rem 1.25rem;color:rgba(10,25,49,.85)}
.mobile-nav a.active{color:var(--navy);font-weight:600}
.mobile-nav .btn{margin:.75rem 1.25rem 0;display:flex;justify-content:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.65rem 1.25rem;border-radius:10px;font-weight:600;letter-spacing:0.2px;font-size:.9rem;transition:transform .2s ease,box-shadow .2s ease;border:1px solid transparent;cursor:pointer;text-decoration:none}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--navy);color:#fff}
.btn-primary:hover{background:#142544}
.btn-gold{background:var(--gold-light);color:var(--navy);box-shadow:0 10px 25px -8px rgba(232,184,75,0.6);animation:pulseGlow 2.2s ease-in-out infinite}
.btn-gold:hover{background:#f1d68d}
.btn-outline{background:transparent;border-color:var(--border);color:var(--navy)}
.btn-outline:hover{background:var(--muted)}
.btn-ghost-light{background:transparent;border-color:rgba(255,255,255,.3);color:#fff}
.btn-ghost-light:hover{background:rgba(255,255,255,.1)}
.btn-lg{padding:.85rem 1.6rem;font-size:1rem}
.btn-block{width:100%}
@keyframes pulseGlow{
 0%,100%{box-shadow:0 10px 25px -8px rgba(232,184,75,0.6)}
 50%{box-shadow:0 10px 35px -4px rgba(232,184,75,0.95),0 0 0 6px rgba(232,184,75,0.15)}
}
.hero{position:relative;overflow:hidden;background:var(--grad);color:#fff}
.hero::before{content:"";position:absolute;inset:0;background-image:url(pattern-overlay.svg);background-size:320px;opacity:.07}
.hero-inner{position:relative;display:grid;gap:3rem;align-items:center;padding:5rem 0 6rem}
@media(min-width:1024px){.hero-inner{grid-template-columns:1fr 1fr;padding:7rem 0}}
.badge{display:inline-flex;align-items:center;gap:.4rem;background:rgba(232,184,75,0.08);border:1px solid rgba(232,184,75,0.35);padding:.35rem 1rem;border-radius:999px;font-size:.78rem;letter-spacing:0.2px}
.badge-soft{background:#EAF2FA;color:var(--deep);border:0;padding:.3rem .8rem;border-radius:999px;font-size:.75rem;font-weight:500;display:inline-block}
.hero h1{font-size:clamp(2.25rem,5vw,3.75rem);margin-top:1.25rem;line-height:1.05}
.hero h1 .accent{color:var(--gold-light)}
.hero p.lead{margin-top:1.25rem;max-width:34rem;color:rgba(246,250,253,.85);font-size:1.1rem}
.hero-feats{margin-top:1.5rem;display:grid;gap:.6rem;font-size:.9rem}
@media(min-width:540px){.hero-feats{grid-template-columns:1fr 1fr}}
.hero-feats li{display:flex;align-items:center;gap:.5rem;color:rgba(246,250,253,.9)}
.hero-cta{margin-top:2rem;display:flex;flex-wrap:wrap;gap:.75rem}
.hero-collage{position:relative;min-height:420px;display:grid;z-index:2}
.collage-item{
 position:absolute;overflow:hidden;
 box-shadow:0 20px 45px -15px rgba(0,0,0,0.4);
 border:4px solid rgba(255,255,255,0.85);
 animation:slideInFromRight 0.9s ease-out both;
}
.collage-item img{width:100%;height:100%;object-fit:cover;display:block}
.collage-1{
 top:0;left:4%;width:44%;height:200px;
 border-radius:100px 0 100px 0;
 transform:none;animation-name:slideInFromRight;animation-delay:0.1s;z-index:2;
}
.collage-2{
 top:4%;right:4%;width:44%;height:170px;
 border-radius:100px 100px 100px 0;
 transform:none;animation-name:slideInFromRight;animation-delay:0.3s;z-index:1;
}
.collage-3{
 bottom:4%;left:4%;width:40%;height:170px;
 border-radius:0 100px 100px 100px;
 transform:none;animation-name:slideInFromRight;animation-delay:0.5s;z-index:3;
}
.collage-4{
 bottom:-2%;right:4%;width:46%;height:210px;
 border-radius:100px 0 100px 0;
 transform:none;animation-name:slideInFromRight;animation-delay:0.7s;z-index:2;
}
@keyframes slideInFromRight{from{opacity:0;transform:translateX(120px)}to{opacity:1;transform:translateX(0)}}
.collage-blob{position:absolute;border-radius:50%;filter:blur(2px);z-index:0}
.blob-1{width:90px;height:90px;background:rgba(232,201,119,0.35);top:40%;left:42%}
.blob-2{width:60px;height:60px;background:rgba(179,207,229,0.4);bottom:30%;right:30%}
.hero-badge{
 position:absolute;
 bottom:-3.5rem;
 left:0;
 background:#fff;
 color:var(--navy);
 border-radius:1rem;
 padding:.9rem 1rem;
 box-shadow:var(--shadow-elegant);
 display:flex;
 align-items:center;
 gap:.75rem;
 z-index:10;
}
.avatars{display:flex}
.avatars span{width:36px;height:36px;border-radius:50%;border:2px solid #fff;background:linear-gradient(135deg,#4A7FA7,#1A3D63);color:#fff;display:grid;place-items:center;font-size:.7rem;font-weight:600;margin-left:-8px}
.avatars span:first-child{margin-left:0}
.hero-badge-text{font-size:.78rem}
.hero-badge-text strong{display:block;font-size:.85rem}
.hero-badge-text small{color:var(--muted-fg)}
@media (max-width:768px){
 .hero-collage{min-height:320px}
 .collage-1{width:46%;height:130px}
 .collage-2{width:46%;height:120px}
 .collage-3{width:40%;height:120px}
 .collage-4{width:42%;height:140px}
}
section.section{padding:5.5rem 0}
section.section.muted{background:rgba(234,242,250,.5)}
.section-head{max-width:42rem;margin:0 auto 3rem;text-align:center}
.eyebrow{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--deep);font-weight:600}
.section-head h2{margin-top:.75rem;font-size:clamp(1.75rem,3.5vw,3rem);color:var(--navy)}
.section-head p{margin-top:1rem;color:var(--muted-fg)}
.stats{padding:3.5rem 0;background:#fff;border-bottom:1px solid var(--border)}
.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;text-align:center}
@media(min-width:768px){.stats-grid{grid-template-columns:repeat(4,1fr)}}
.stat-num{font-family:'Cormorant Garamond',serif;font-size:clamp(2rem,4vw,3rem);font-weight:600;background:linear-gradient(135deg,#E8B84B,#C9962E);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat-label{margin-top:.25rem;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-fg)}
.grid{display:grid;gap:1.25rem}
.grid-2{grid-template-columns:1fr}
.grid-3{grid-template-columns:1fr}
.grid-4{grid-template-columns:1fr}
@media(min-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}}
.card{
 background:#fff;
 border:1px solid rgba(220,231,242,.7);
 border-radius:16px;
 padding:1.5rem;
 box-shadow:var(--shadow-soft);
 transition:all 0.35s cubic-bezier(0.4,0,0.2,1);
 cursor:pointer;
}
.card-icon{width:48px;height:48px;border-radius:12px;background:var(--muted);color:var(--accent);display:grid;place-items:center;margin-bottom:1rem}
.card-icon.grad{background:var(--grad);color:#fff}
.card h3{font-size:1.25rem;color:var(--navy)}
.card p{margin-top:.5rem;font-size:.9rem;color:var(--muted-fg)}
.card .meta{margin-top:1.25rem;display:flex;flex-wrap:wrap;gap:.5rem}
.card hr.sep{border:0;border-top:1px solid var(--border);margin:1.25rem 0}
.card-link{display:flex;justify-content:space-between;align-items:center;color:var(--deep);font-size:.9rem;font-weight:500}
.grid .card:hover,
.grid .card:active{
 background-color:#e5be75 !important;
 transform:translateY(-6px) scale(1.02);
 box-shadow:0 10px 25px rgba(229,190,117,0.45),0 0 20px rgba(229,190,117,0.35) !important;
 border-color:#d4ab60 !important;
}
.grid .card:hover h2,
.grid .card:hover h3,
.grid .card:hover p,
.grid .card:hover .tquote,
.grid .card:hover .tname,
.grid .card:hover .trole,
.grid .card:active h2,
.grid .card:active h3,
.grid .card:active p{
 color:#0b1a30 !important;
}
.grid .card:hover .card-icon,
.grid .card:hover svg{
 color:#0b1a30 !important;
 stroke:#0b1a30 !important;
}
.steps{display:grid;gap:2rem;text-align:center}
@media(min-width:640px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.steps{grid-template-columns:repeat(5,1fr)}}
.step-num{width:80px;height:80px;margin:0 auto;border-radius:50%;background:#0b1a30 !important;border:2px solid #d4af37 !important;display:grid;place-items:center;font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:700 !important;color:#d4af37 !important;box-shadow:var(--shadow-soft)}
.step h3{margin-top:1rem;font-size:1.15rem;color:var(--navy)}
.step p{margin-top:.4rem;font-size:.9rem;color:var(--muted-fg)}
.stars{display:flex;gap:2px;color:var(--gold-light)}
.tquote{margin-top:1rem;color:rgba(10,25,49,.85);line-height:1.6;position:relative;padding-left:6px}
.tquote::before{content:"“";font-size:3rem;color:rgba(232,184,75,0.35);position:absolute;left:-14px;top:-22px;font-family:'Cormorant Garamond',serif}
.tauthor{margin-top:1.25rem;display:flex;align-items:center;gap:.75rem}
.tavatar{width:40px;height:40px;border-radius:50%;background:rgba(74,127,167,.15);color:var(--accent);display:grid;place-items:center;font-weight:600}
.tname{font-weight:500;color:var(--navy);font-size:.9rem}
.trole{font-size:.78rem;color:var(--muted-fg)}
.cta-band{padding:5rem 0}
.cta-card{position:relative;overflow:hidden;background:var(--grad);color:#fff;border-radius:24px;padding:3rem;box-shadow:var(--shadow-elegant)}
.cta-card::before{content:"";position:absolute;inset:0;background-image:url(pattern-overlay.svg);background-size:320px;opacity:.08}
.cta-card-inner{position:relative;display:grid;gap:2rem;align-items:center}
@media(min-width:768px){.cta-card{padding:4rem}.cta-card-inner{grid-template-columns:1fr auto}}
.cta-card h2{font-size:clamp(1.75rem,3vw,2.5rem)}
.cta-card p{margin-top:.75rem;color:rgba(255,255,255,.8);max-width:36rem}
.cta-card .cta-buttons{display:flex;flex-wrap:wrap;gap:.75rem}
.site-footer{margin-top:6rem;background:var(--navy);color:rgba(246,250,253,.85)}
.footer-grid{display:grid;gap:2.5rem;padding:4rem 0}
@media(min-width:768px){.footer-grid{grid-template-columns:2fr 1fr 1fr}}
.footer-grid h3{color:#fff;font-size:1.15rem;margin-bottom:1rem}
.footer-grid a:hover{color:#fff}
.footer-grid ul li{margin-bottom:.6rem;font-size:.9rem;color:rgba(246,250,253,.7)}
.footer-brand{display:flex;align-items:center;gap:.75rem;color:#fff}
.footer-brand .brand-mark{background:rgba(255,255,255,.1)}
.footer-brand .brand-name{color:#fff}
.footer-tagline{margin-top:1rem;font-size:.88rem;color:rgba(246,250,253,.7);max-width:28rem}
.footer-contact li{display:flex;gap:.5rem;align-items:flex-start}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:1.25rem 0;font-size:.75rem;color:rgba(246,250,253,.6);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center}
.footer-bottom .links{display:flex;gap:1.25rem}
.wa-float{position:fixed;bottom:1.25rem;right:1.25rem;z-index:50;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#25D366;color:#fff;box-shadow:var(--shadow-elegant);animation:float-y 6s ease-in-out infinite}
.wa-float::after{content:"";position:absolute;inset:0;border-radius:50%;background:rgba(37,211,102,.4);animation:ping 1.8s cubic-bezier(0,0,.2,1) infinite;z-index:-1}
@keyframes float-y{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes ping{75%,100%{transform:scale(1.6);opacity:0}}
@keyframes fade-up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.fade-up{animation:fade-up .7s ease-out both}
.reveal-right{
 opacity:0;
 transform:translateX(80px);
 transition:opacity 0.8s ease-out,transform 0.8s ease-out;
}
.reveal-right.in-view{
 opacity:1;
 transform:translateX(0);
}
@media (max-width:640px){
 .reveal-right{transform:translateX(40px)}
 .container,.hero-inner{padding-left:1.25rem !important;padding-right:1.25rem !important}
}
.lead-modal-overlay{
 display:none;
 position:fixed;
 inset:0;
 background:rgba(10,25,49,0.7);
 backdrop-filter:blur(4px);
 z-index:99999;
 justify-content:center;
 align-items:center;
 padding:1rem;
}
.lead-modal-overlay.active{
 display:flex;
}
.lead-modal-box{
 background:#fff;
 width:100%;
 max-width:480px;
 border-radius:16px;
 padding:2.2rem;
 position:relative;
 box-shadow:0 25px 60px rgba(0,0,0,0.35);
 text-align:center;
 animation:modalPop 0.35s cubic-bezier(0.34,1.56,0.64,1);
}
@keyframes modalPop{
 from{opacity:0;transform:scale(0.9) translateY(15px)}
 to{opacity:1;transform:scale(1) translateY(0)}
}
.lead-modal-close{
 position:absolute;
 top:14px;
 right:16px;
 background:#2a4b6c;
 color:#fff;
 border:0;
 width:30px;
 height:30px;
 border-radius:50%;
 font-size:14px;
 cursor:pointer;
 display:grid;
 place-items:center;
 transition:background 0.2s;
}
.lead-modal-close:hover{background:#1a344d}
.lead-modal-title{
 font-family:'Plus Jakarta Sans',sans-serif;
 font-size:1.85rem;
 font-weight:700;
 color:#111;
 margin-bottom:0.6rem;
}
.lead-modal-desc{
 color:#4a5568;
 font-size:0.95rem;
 line-height:1.45;
 margin-bottom:1.5rem;
}
.lead-modal-form{text-align:left}
.popup-field{margin-bottom:1.1rem}
.popup-field label{
 display:block;
 font-size:0.88rem;
 font-weight:600;
 color:#2d3748;
 margin-bottom:0.35rem;
}
.popup-field input{
 width:100%;
 padding:0.75rem 1rem;
 border:1px solid #cbd5e1;
 border-radius:8px;
 font:inherit;
 box-sizing:border-box;
}
.popup-field input:focus{
 outline:0;
 border-color:#cf863c;
 box-shadow:0 0 0 3px rgba(207,134,60,0.2);
}
.lead-modal-btn{
 width:100%;
 background:#cf863c;
 color:#fff;
 border:0;
 padding:0.85rem;
 font-size:1rem;
 font-weight:700;
 text-transform:uppercase;
 border-radius:8px;
 cursor:pointer;
 box-shadow:0 8px 20px -5px rgba(207,134,60,0.5);
 transition:background 0.2s,transform 0.15s;
}
.lead-modal-btn:hover{
 background:#bb732a;
 transform:translateY(-1px);
}
.signup-page-wrap{
 padding:4.5rem 0 5.5rem;
 background:linear-gradient(135deg,#cadbe9 0%,#b8cfdf 50%,#cadbe9 100%);
 min-height:80vh;
}
.signup-grid{
 display:grid;
 grid-template-columns:1fr;
 gap:3rem;
 align-items:center;
}
@media (min-width:1024px){
 .signup-grid{
 grid-template-columns:1.15fr 0.85fr;
 gap:4rem;
}
}
.signup-info{
 display:flex;
 flex-direction:column;
}
.signup-subtitle{
 font-family:'Cormorant Garamond',Georgia,serif;
 font-size:1.6rem;
 font-style:italic;
 color:#1e3a5f;
 margin-bottom:0.25rem;
}
.signup-main-title{
 font-family:'Plus Jakarta Sans',sans-serif;
 font-size:clamp(2rem,3.5vw,2.75rem);
 font-weight:700;
 color:#0d1b2a;
 line-height:1.2;
 margin-bottom:2.5rem;
}
.signup-feature-list{
 display:flex;
 flex-direction:column;
 gap:2rem;
}
.signup-feature-item{
 display:flex;
 align-items:flex-start;
 gap:1.25rem;
}
.feature-round-icon{
 width:60px;
 height:60px;
 min-width:60px;
 border-radius:50%;
 background:#19647e;
 color:#fff;
 display:grid;
 place-items:center;
 box-shadow:0 8px 18px rgba(25,100,126,0.25);
}
.signup-feature-item .feature-title{
 font-family:'Plus Jakarta Sans',sans-serif;
 font-size:1.15rem;
 font-weight:700;
 color:#0d1b2a;
 margin-bottom:0.35rem;
}
.signup-feature-item p{
 color:#334155;
 font-size:0.95rem;
 line-height:1.45;
}
.minimal-form-card{
 background:#ffffff;
 border-radius:18px;
 padding:2.5rem 2.2rem;
 box-shadow:0 20px 45px rgba(10,25,49,0.15);
}
.minimal-form-card h2{
 font-family:'Plus Jakarta Sans',sans-serif;
 font-size:1.75rem;
 font-weight:700;
 color:#0d1b2a;
 text-align:center;
 margin-bottom:1.75rem;
}
.mini-field{
 margin-bottom:1.2rem;
}
.mini-field label{
 display:block;
 font-size:0.88rem;
 font-weight:600;
 color:#2b3a4a;
 margin-bottom:0.4rem;
}
.mini-field label .req{
 color:#d9534f;
}
.mini-field input,
.mini-field select{
 width:100%;
 padding:0.8rem 1rem;
 border:1px solid #cbd5e1;
 border-radius:8px;
 font-size:0.95rem;
 font-family:inherit;
 background:#ffffff;
 color:#0d1b2a;
 box-sizing:border-box;
 transition:border-color 0.2s,box-shadow 0.2s;
}
.mini-field input:focus,
.mini-field select:focus{
 outline:none;
 border-color:#cf863c;
 box-shadow:0 0 0 3px rgba(207,134,60,0.2);
}
.minimal-submit-btn{
 width:100%;
 background:#cf863c;
 color:#fff;
 border:none;
 padding:0.95rem;
 font-size:1.05rem;
 font-weight:700;
 text-transform:uppercase;
 border-radius:8px;
 cursor:pointer;
 letter-spacing:0.5px;
 box-shadow:0 10px 20px -5px rgba(207,134,60,0.5);
 transition:background 0.2s,transform 0.15s;
 margin-top:0.5rem;
}
.minimal-submit-btn:hover{
 background:#bb732a;
 transform:translateY(-2px);
}
.minimal-form-note{
 font-size:0.78rem;
 color:#64748b;
 text-align:center;
 margin-top:0.9rem;
 line-height:1.4;
}
@media (max-width:640px){
 .signup-page-wrap{
 padding:2.5rem 0 3.5rem;
}
 .minimal-form-card{
 padding:1.8rem 1.4rem;
}
 .signup-main-title{
 margin-bottom:1.8rem;
}
 .signup-feature-list{
 gap:1.4rem;
}
 .feature-round-icon{
 width:50px;
 height:50px;
 min-width:50px;
}
}
.pricing-group-title{
 text-align:center;
 font-family:'Cormorant Garamond',serif;
 font-size:1.85rem;
 font-weight:700;
 color:var(--navy);
 margin-bottom:2rem;
}
.pricing-card{
 text-align:center;
 position:relative;
 overflow:hidden;
 padding:2.2rem 1.6rem;
 border:1px solid rgba(220,231,242,.8);
 border-radius:18px;
}
.pricing-card.featured{
 border:2px solid #1a5336;
}
.plan-tag{
 display:inline-block;
 font-size:0.75rem;
 font-weight:700;
 color:#1a5336;
 margin-bottom:0.5rem;
 text-transform:uppercase;
 letter-spacing:0.5px;
}
.pricing-card h3{
 font-family:'Plus Jakarta Sans',sans-serif;
 font-size:1.15rem;
 font-weight:700;
 color:#0b1a30;
 margin-bottom:0.8rem;
}
.price-val{
 font-family:'Plus Jakarta Sans',sans-serif;
 font-size:2.5rem;
 font-weight:800;
 color:#1a5336;
 line-height:1;
}
.price-sub{
 font-size:0.82rem;
 color:#718096;
 margin-bottom:1.4rem;
 text-transform:capitalize;
}
.plan-feats{
 margin-bottom:1.6rem;
 border-top:1px solid rgba(220,231,242,.6);
 padding-top:1.2rem;
}
.plan-feats p{
 font-size:0.9rem;
 color:#4a5568;
 margin-bottom:0.4rem;
}
.ribbon{
 position:absolute;
 top:0;
 right:0;
 width:100px;
 height:100px;
 overflow:hidden;
 pointer-events:none;
}
.ribbon span{
 position:absolute;
 display:block;
 width:150px;
 padding:6px 0;
 background-color:#1a5336;
 box-shadow:0 5px 10px rgba(0,0,0,0.1);
 color:#fff;
 font-size:11px;
 font-weight:700;
 text-transform:uppercase;
 text-align:center;
 left:-20px;
 top:24px;
 transform:rotate(45deg);
}
.cost-estimator-card{
 background:#ffffff;
 border-radius:20px;
 border:2px solid #1a5336;
 box-shadow:0 20px 45px rgba(10,25,49,0.08);
 overflow:hidden;
}
.estimator-header{
 padding:1.8rem 1.5rem 1rem;
 text-align:center;
}
.estimator-header h2{
 font-family:'Cormorant Garamond',serif;
 font-size:2.1rem;
 color:#0b1a30;
}
.estimator-form{
 padding:1rem 2.2rem 2.2rem;
}
.estimator-field{
 margin-bottom:1.2rem;
}
.estimator-field label{
 display:block;
 font-size:0.88rem;
 font-weight:700;
 color:#1a5336;
 margin-bottom:0.45rem;
}
.estimator-field select{
 width:100%;
 padding:0.8rem 1rem;
 border:1px solid #cbd5e1;
 border-radius:8px;
 font-size:0.95rem;
 font-family:inherit;
 background:#fff;
 color:#0b1a30;
}
.estimator-result-box{
 background:#edf7ed;
 border-radius:12px;
 padding:1.8rem 1rem;
 text-align:center;
 margin-top:1.5rem;
}
.est-result-label{
 font-family:'Cormorant Garamond',serif;
 font-size:1.35rem;
 font-weight:700;
 color:#0b1a30;
}
.est-result-price{
 font-family:'Plus Jakarta Sans',sans-serif;
 font-size:2.2rem;
 font-weight:800;
 color:#1a5336;
 margin-top:0.3rem;
}
.payment-pill-list{
 display:flex;
 flex-wrap:wrap;
 gap:0.75rem;
 justify-content:center;
}
.payment-badge{
 background:#ffffff;
 border:1px solid #cbd5e1;
 padding:0.6rem 1.4rem;
 border-radius:999px;
 font-weight:600;
 font-size:0.9rem;
 color:#1e293b;
 box-shadow:0 4px 12px rgba(0,0,0,0.04);
}
@media (max-width:640px){
 .pricing-card{padding:1.8rem 1.2rem}
 .estimator-form{padding:1rem 1.2rem 1.8rem}
}
.expandable-feat-card{
 cursor:pointer;
 transition:all 0.35s ease;
 position:relative;
 border:1px solid rgba(220,231,242,.8);
 border-radius:16px;
 background:#ffffff;
 padding:1.8rem 1.4rem;
}
.expandable-feat-card:hover{
 transform:translateY(-5px);
 border-color:#d4af37;
 box-shadow:0 12px 30px rgba(212,175,55,0.18);
}
.expandable-feat-card.active{
 border:2px solid #d4af37;
 background:#fffdf5;
 box-shadow:0 15px 35px rgba(212,175,55,0.25);
 transform:scale(1.02);
}
.expandable-feat-card.active .card-icon{
 background:#d4af37;
 color:#ffffff;
}
.feat-details{
 max-height:0;
 overflow:hidden;
 transition:max-height 0.45s ease,opacity 0.35s ease;
 opacity:0;
 border-top:1px dashed rgba(212,175,55,0.4);
 margin-top:0;
 padding-top:0;
}
.expandable-feat-card.active .feat-details{
 max-height:300px;
 opacity:1;
 margin-top:1rem;
 padding-top:0.8rem;
}
.feat-details ul{
 list-style:none;
 padding:0;
 margin:0;
 display:flex;
 flex-direction:column;
 gap:0.55rem;
}
.feat-details li{
 font-size:0.84rem;
 line-height:1.45;
 color:#2d3748;
}
.feat-details li strong{
 color:#0b1a30;
}
.click-hint{
 display:inline-flex;
 align-items:center;
 gap:0.35rem;
 font-size:0.78rem;
 font-weight:700;
 color:#b78a1e;
 margin-top:1rem;
}
.expandable-feat-card.active .click-hint svg{
 transform:rotate(180deg);
}
.classroom-tools-box{
 background:linear-gradient(135deg,#0b1a30 0%,#163056 100%);
 border-radius:20px;
 padding:3rem 2.5rem;
 color:#ffffff;
 display:flex;
 flex-wrap:wrap;
 align-items:center;
 justify-content:space-between;
 gap:2rem;
 box-shadow:0 15px 40px rgba(11,26,48,0.15);
}
.tools-text{
 max-width:580px;
}
.tools-text h2{
 color:#ffffff;
 font-size:2.1rem;
 margin:0.4rem 0 0.8rem;
}
.tools-text p{
 color:#cbd5e1;
 font-size:0.95rem;
 line-height:1.6;
}
.tools-badge-list{
 display:flex;
 flex-direction:column;
 gap:0.75rem;
}
.tech-pill{
 background:rgba(255,255,255,0.1);
 border:1px solid rgba(255,255,255,0.2);
 padding:0.65rem 1.25rem;
 border-radius:50px;
 font-size:0.9rem;
 font-weight:600;
 color:#fceea7;
}
.course-bullet-highlights{
 display:flex;
 flex-direction:column;
 gap:0.3rem;
 margin:0.85rem 0;
 font-size:0.82rem;
 color:#2e7d32;
 font-weight:600;
}
.page-header{
 background:linear-gradient(135deg,#0b1a30 0%,#163056 50%,#2b5c8f 100%) !important;
 padding:4.5rem 0 !important;
 text-align:center !important;
 position:relative !important;
 color:#ffffff !important;
}
.page-header .inner{
 max-width:820px !important;
 margin:0 auto !important;
}
.page-header .eyebrow{
 color:#d4af37 !important;
 font-size:0.88rem !important;
 font-weight:700 !important;
 letter-spacing:2px !important;
 text-transform:uppercase !important;
 margin-bottom:0.8rem !important;
 display:inline-block !important;
}
.page-header h1{
 font-family:'Cormorant Garamond',Georgia,serif !important;
 font-size:3.1rem !important;
 font-weight:600 !important;
 color:#ffffff !important;
 line-height:1.15 !important;
 margin-bottom:1rem !important;
}
.page-header p{
 font-size:1.1rem !important;
 color:#e2e8f0 !important;
 max-width:680px !important;
 margin:0 auto !important;
 line-height:1.6 !important;
}
@media (max-width:768px){
 .page-header{
 padding:3.2rem 1rem !important;
}
 .page-header h1{
 font-size:2.2rem !important;
}
 .page-header p{
 font-size:0.95rem !important;
}
}
.form-wrap{
 background:#ffffff;
 border-radius:20px;
 box-shadow:0 15px 40px rgba(11,26,48,0.07);
 border:1px solid rgba(220,231,242,0.9);
 padding:2.5rem 2rem !important;
}
.app-form .field{
 display:flex;
 flex-direction:column;
 gap:0.5rem;
 margin-bottom:1.4rem;
 text-align:left;
}
.app-form .field label{
 font-size:0.9rem;
 font-weight:600;
 color:#0b1a30;
 letter-spacing:0.3px;
}
.app-form .field input,
.app-form .field textarea{
 width:100% !important;
 box-sizing:border-box !important;
 padding:0.85rem 1.1rem !important;
 border:1.5px solid #cbd5e1 !important;
 border-radius:10px !important;
 font-family:inherit;
 font-size:0.95rem;
 color:#1e293b;
 background:#f8fafc;
 transition:all 0.25s ease;
 outline:none;
}
.app-form .field input:focus,
.app-form .field textarea:focus{
 border-color:#d4af37 !important;
 background:#ffffff;
 box-shadow:0 0 0 4px rgba(212,175,55,0.15) !important;
}
.app-form textarea{
 resize:vertical;
 min-height:120px;
}
.app-form button.btn-block{
 width:100% !important;
 padding:0.95rem 1.5rem !important;
 background:#0b1a30;
 color:#ffffff;
 font-weight:700;
 font-size:1rem;
 border:none;
 border-radius:10px;
 cursor:pointer;
 transition:all 0.3s ease;
 box-shadow:0 8px 20px rgba(11,26,48,0.18);
}
.app-form button.btn-block:hover{
 background:#163056;
 transform:translateY(-2px);
 box-shadow:0 12px 25px rgba(11,26,48,0.25);
}
.accordion-item{
 background:#ffffff;
 border:1px solid rgba(220,231,242,0.9);
 border-radius:14px;
 margin-bottom:1rem;
 overflow:hidden;
 box-shadow:0 4px 14px rgba(11,26,48,0.03);
 transition:all 0.3s ease;
}
.accordion-item:hover{
 border-color:#d4af37;
 box-shadow:0 8px 24px rgba(212,175,55,0.12);
}
.accordion-trigger{
 width:100% !important;
 background:transparent !important;
 border:none !important;
 padding:1.25rem 1.5rem !important;
 display:flex !important;
 justify-content:space-between !important;
 align-items:center !important;
 text-align:left !important;
 cursor:pointer;
 font-family:'Plus Jakarta Sans',sans-serif !important;
 font-size:1.05rem !important;
 font-weight:700 !important;
 color:#0b1a30 !important;
 outline:none;
}
.accordion-trigger span{
 flex:1;
 padding-right:1rem;
}
.accordion-trigger svg{
 flex-shrink:0;
 stroke:#b78a1e !important;
 transition:transform 0.3s ease;
}
.accordion-trigger[aria-expanded="true"] svg{
 transform:rotate(180deg);
}
.accordion-content{
 display:none;
 padding:0 1.5rem 1.35rem 1.5rem;
 font-size:0.95rem;
 line-height:1.7;
 color:#475569;
 border-top:1px solid rgba(220,231,242,0.6);
 padding-top:1rem;
 background:#fafcff;
}
.accordion-content.open,
.accordion-item.active .accordion-content{
 display:block;
}
.blog-card{
 cursor:pointer;
 transition:transform 0.3s ease,box-shadow 0.3s ease,border-color 0.3s ease;
}
.blog-card:hover{
 transform:translateY(-5px);
 border-color:#d4af37 !important;
 box-shadow:0 15px 35px rgba(212,175,55,0.15) !important;
}
.article-modal-overlay{
 display:none;
 position:fixed;
 inset:0;
 background:rgba(11,26,48,0.75);
 backdrop-filter:blur(4px);
 z-index:9999;
 justify-content:center;
 align-items:center;
 padding:1.5rem;
}
.article-modal-content{
 background:#ffffff;
 width:100%;
 max-width:760px;
 max-height:85vh;
 border-radius:18px;
 padding:2.5rem;
 overflow-y:auto;
 position:relative;
 box-shadow:0 25px 60px rgba(0,0,0,0.3);
 animation:modalFadeIn 0.3s ease;
}
@keyframes modalFadeIn{
 from{opacity:0;transform:translateY(20px)}
 to{opacity:1;transform:translateY(0)}
}
.article-close-btn{
 position:absolute;
 top:1.2rem;
 right:1.2rem;
 background:#f1f5f9;
 border:none;
 width:36px;
 height:36px;
 border-radius:50%;
 font-size:1.1rem;
 cursor:pointer;
 color:#475569;
 display:flex;
 align-items:center;
 justify-content:center;
 transition:all 0.2s ease;
}
.article-close-btn:hover{
 background:#e2e8f0;
 color:#0b1a30;
}
@media (max-width:640px){
 .article-modal-content{
 padding:1.8rem 1.2rem;
 max-height:90vh;
}
}
.blog-card{
 position:relative;
 overflow:hidden;
 border-radius:16px;
 border:1px solid rgba(220,231,242,0.9);
 background:#ffffff;
 transition:transform 0.3s ease,box-shadow 0.3s ease,border-color 0.3s ease;
 display:flex;
 flex-direction:column;
}
.blog-card:hover{
 transform:translateY(-5px);
 border-color:#d4af37;
 box-shadow:0 14px 32px rgba(11,26,48,0.08);
}
.blog-card .blog-thumb{
 position:relative;
 width:100%;
 aspect-ratio:16 / 9;
 margin:0;
 padding:0;
 overflow:hidden;
 border-top-left-radius:15px;
 border-top-right-radius:15px;
}
.blog-card .blog-thumb picture,
.blog-card .blog-thumb img{
 width:100% !important;
 height:100% !important;
 object-fit:cover !important;
 display:block !important;
 margin:0 !important;
}
.blog-card .blog-tag{
 position:absolute;
 bottom:12px;
 left:12px;
 background:#ffffff;
 color:#0b1a30;
 font-size:0.76rem;
 font-weight:700;
 padding:4px 10px;
 border-radius:6px;
 box-shadow:0 2px 8px rgba(0,0,0,0.15);
 z-index:2;
}
.blog-card-link-overlay{
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
 z-index:5;
}
@keyframes articleSlideInRight{
 0%{
 opacity:0;
 transform:translateX(50px);
}
 100%{
 opacity:1;
 transform:translateX(0);
}
}
.page-header{
 animation:articleSlideInRight 0.6s cubic-bezier(0.16,1,0.3,1) forwards;
}
article.section{
 animation:articleSlideInRight 0.75s cubic-bezier(0.16,1,0.3,1) 0.1s both;
}
@media (max-width:768px){
 @keyframes articleSlideInRight{
 0%{
 opacity:0;
 transform:translateX(25px);
}
 100%{
 opacity:1;
 transform:translateX(0);
}
}
}
.card.blog-card{
 padding:0 !important;
 overflow:hidden !important;
}
.card.blog-card .blog-thumb{
 margin:0 !important;
 width:100% !important;
 border-radius:0 !important;
 display:block !important;
}
.card.blog-card .blog-thumb picture,
.card.blog-card .blog-thumb img{
 width:100% !important;
 display:block !important;
 border-radius:0 !important;
 margin:0 !important;
}
.card.blog-card .pad{
 padding:1.4rem !important;
}
.lead,.hero-feats li,.blog-card p{
 color:#e2e8f0 !important;
}
.blog-card .pad p{
 color:#334155 !important;
}
.expandable-feat-card .card-icon svg{
 stroke:#0b1a30 !important;
}
.step .step-num,
.steps .step .step-num{
 background-color:#0b1a30 !important;
 color:#d4af37 !important;
 border:2px solid #d4af37 !important;
 font-weight:700 !important;
}
.top-bar-inner{
 display:flex !important;
 justify-content:space-between !important;
 align-items:center !important;
 width:100% !important;
}
.top-bar-contact{
 display:flex !important;
 align-items:center !important;
 gap:20px !important;
 margin-right:auto !important;
}
.top-bar-social{
 display:flex !important;
 gap:12px !important;
 align-items:center !important;
 margin-left:auto !important;
}
@media (max-width:768px){
 .top-bar-contact{
 display:none !important;
}
 .top-bar-inner{
 display:flex !important;
 justify-content:space-between !important;
 align-items:center !important;
 padding:6px 12px !important;
}
 .top-bar-note{
 display:none !important;
}
 .top-bar-inner::before{
 content:"Reviews on ⭐ Trustpilot";
 color:#0b1a30;
 font-size:0.82rem;
 font-weight:700;
 display:flex;
 align-items:center;
 gap:4px;
}
 .top-bar-social{
 display:flex !important;
 gap:10px !important;
 align-items:center !important;
 margin-left:auto !important;
}
}
.hero{
 z-index:1;
}
.hero::after{
 content:"";
 position:absolute;
 bottom:0px;
 left:50%;
 width:100%;
 max-width:550px;
 height:500px;
 background-image:url('collage/hero-image.webp');
 background-size:contain;
 background-repeat:no-repeat;
 background-position:center bottom;
 opacity:0.15;
 mix-blend-mode:screen;
 filter:grayscale(100%);
 z-index:-1;
 pointer-events:none;
 animation:watermarkFloat 6s ease-in-out infinite alternate;
}
@keyframes watermarkFloat{
 0%{transform:translate(-50%,0) scale(1)}
 50%{transform:translate(-50%,-15px) scale(1.03)}
 100%{transform:translate(-50%,0) scale(1)}
}
/* Home page visual direction: separate patterned background, mosque cutout, and calligraphy. */
.hero{background:#eaf5fc url('hero-soft-pattern.webp') center center/cover no-repeat;color:#0b2f57;isolation:isolate}
.hero::before,.hero::after{display:none!important}
.hero-inner{max-width:1320px;grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);gap:clamp(1rem,3vw,3.5rem);min-height:650px;padding:3rem 0 0;align-items:center}
.hero-copy{grid-column:2;grid-row:1;z-index:2;padding:2rem 0 4rem}
.hero-art{grid-column:1;grid-row:1;align-self:end;z-index:1;min-width:0;display:flex;align-items:end;justify-content:center}
.hero-art img{display:block;width:min(100%,590px);height:auto;max-height:635px;object-fit:contain;object-position:bottom;filter:drop-shadow(0 15px 22px rgba(28,82,116,.13))}
.hero .badge{background:#fff9;border:1px solid #90bed9;color:#125283;font-weight:700}
.hero h1{color:#073767;font-size:clamp(2.3rem,4.1vw,4.2rem);line-height:1.06;letter-spacing:-.04em}
.hero h1 .accent{color:#087aac}
.hero p.lead,.hero .lead{color:#395979!important;line-height:1.7;font-size:1.04rem;max-width:39rem}
.hero-feats{grid-template-columns:1fr 1fr;gap:.7rem 1.1rem}
.hero-feats li,.hero .hero-feats li{color:#174a73!important;font-weight:600;line-height:1.5}
.hero-feats svg{flex:none;color:#087aac}
.hero .btn-gold{background:linear-gradient(110deg,#063c70,#078cb9);color:#fff;box-shadow:0 12px 26px rgba(3,85,140,.20);animation:none;border:0}
.hero .btn-gold:hover{background:#07537d}
.hero .btn-ghost-light{background:#fff9;border:1px solid #1e80ae;color:#075387}
.hero .btn-ghost-light:hover{background:#fff}
main>section.section{position:relative;isolation:isolate}
main>section.section::before{content:"";position:absolute;width:clamp(230px,30vw,480px);aspect-ratio:1;background:url('quran-calligraphy-watermark.svg') center/contain no-repeat;opacity:.11;pointer-events:none;z-index:-1;top:2rem;right:max(-7vw,-90px)}
main>section.section:nth-of-type(even)::before{right:auto;left:max(-7vw,-90px);top:4rem;transform:rotate(-11deg)}
main>section.section>.container{position:relative}
@media(max-width:1023px){.hero-inner{min-height:0;gap:0;grid-template-columns:1fr;padding:2.5rem 0 0}.hero-copy{grid-column:1;grid-row:1;padding:1rem 0 0}.hero-art{grid-column:1;grid-row:2;margin-top:1rem}.hero-art img{max-height:500px;width:min(100%,470px)}}
@media(max-width:600px){.hero-inner{padding-top:1.5rem}.hero h1{font-size:clamp(2.15rem,9.5vw,3rem)}.hero p.lead{font-size:1rem}.hero-feats{grid-template-columns:1fr}.hero-art img{max-height:390px;width:min(100%,390px)}.hero-cta .btn{width:100%;justify-content:center}main>section.section::before{width:240px;right:-100px;opacity:.075}}

/* Homepage refinements for the supplied reference sections. */
@media(min-width:1024px){.home-page .hero-inner{grid-template-columns:minmax(0,.98fr) minmax(0,1.02fr)}.home-page .hero-copy{grid-column:1;grid-row:1}.home-page .hero-art{grid-column:2;grid-row:1}}
.home-page main>section.section:nth-of-type(3){background:#f0f7fb url('section-features.webp') center/cover no-repeat}
.home-page main>section.section:nth-of-type(4){background:#eff7fb url('section-courses.webp') center/cover no-repeat}
.home-page main>section.section:nth-of-type(6){background:#eaf8fa url('section-steps.webp') center/cover no-repeat}
.home-page main>section.section:nth-of-type(3)::before,.home-page main>section.section:nth-of-type(4)::before,.home-page main>section.section:nth-of-type(6)::before{opacity:.045}
.home-page .expandable-feat-card,.home-page .course-action-card{position:relative;isolation:isolate;overflow:hidden;background:rgba(255,255,255,.93)}
.home-page .expandable-feat-card>* ,.home-page .course-action-card>*{position:relative}
.home-page .steps .step{position:relative;isolation:isolate;min-height:200px;padding:1rem .5rem;overflow:hidden}
.home-page .cta-band{background:#f3f9fc}
.home-page .cta-card{background:#eaf5fa url('section-trial.webp') center/cover no-repeat;color:#0a365e;box-shadow:0 18px 40px rgba(24,69,103,.12);border:1px solid #d6e9f3}
.home-page .cta-card::before{background:url('quran-calligraphy-watermark.svg') right 8% center/220px no-repeat;opacity:.12}
.home-page .cta-card h2{color:#07345e}
.home-page .cta-card p{color:#365a77}
.home-page .cta-card .btn-gold{background:#0b5a8d;color:#fff;box-shadow:none;animation:none}
.home-page .cta-card .btn-ghost-light{background:#fff9;color:#0c4c79;border:1px solid #478fb7}
.home-page .site-footer{margin-top:0;background:#eaf4fa url('quran-calligraphy-watermark.svg') right 6% center/350px no-repeat;color:#193e5e;border-top:1px solid #d2e8f4}
.home-page .site-footer .footer-brand,.home-page .site-footer .footer-brand .brand-name,.home-page .site-footer h3{color:#093960}
.home-page .site-footer .footer-tagline,.home-page .site-footer ul li,.home-page .site-footer .footer-bottom{color:#335c78}
.home-page .site-footer a{color:#164f77}
.home-page .site-footer a:hover{color:#087fa9}
.home-page .site-footer .footer-social a{background:#fff!important;color:#07598e!important;border:1px solid #b8d9eb;box-shadow:0 3px 9px rgba(27,91,132,.1)}
.home-page .top-bar{background:#eaf5fb;color:#0b4774;border-bottom:1px solid #c9e1ef;padding:8px 0}
.home-page .top-bar-contact a{color:#0b4774;font-weight:650;line-height:1.35}
.home-page .top-bar-contact a:hover{color:#087fac}
.home-page .top-bar-social a{display:grid!important;place-items:center;width:30px;height:30px;flex:none;border-radius:50%;background:#fff;color:#07598e!important;border:1px solid #b6d7e9}
.home-page .top-bar-social a svg{width:16px;height:16px}
.home-page .top-bar-inner::before{display:none!important}
@media(max-width:768px){.home-page .top-bar-contact{display:flex!important;flex-wrap:wrap;gap:5px 13px!important;margin-right:0!important}.home-page .top-bar-inner{align-items:center!important;gap:8px!important}.home-page .top-bar-social{margin-left:0!important}.home-page .top-bar-contact a{font-size:.75rem}.home-page .top-bar-social a{width:28px;height:28px}}
@media(max-width:480px){.home-page .top-bar-inner{flex-direction:column;align-items:flex-start!important}.home-page .top-bar-contact{gap:4px 10px!important}.home-page .top-bar-social{align-self:flex-start;gap:8px!important}.home-page .expandable-feat-card::before,.home-page .course-action-card::before{width:110px;height:110px;opacity:.25}.home-page .cta-card::before{background-size:160px;opacity:.08}}

/* Full scene artwork in each card and the classroom panel. */
.home-page .expandable-feat-card::before,.home-page .course-action-card::before{content:"";position:absolute;right:0;bottom:0;top:auto;width:72%;height:92%;background:var(--scene-art) right bottom/contain no-repeat;opacity:.15;pointer-events:none;z-index:0}
.home-page .expandable-feat-card>*,.home-page .course-action-card>*{position:relative;z-index:1}
.home-page .steps .step::before{display:none}
.home-page .classroom-tools-box{position:relative;isolation:isolate;overflow:hidden;background:#e6f4fa url('section-classroom.webp') center/cover no-repeat;color:#103b60;border:1px solid #c9e5f0;box-shadow:0 14px 32px rgba(28,90,128,.11)}
.home-page .classroom-tools-box::before{content:"";position:absolute;inset:0;background:url('classroom-scene.png') 61% center/auto 104% no-repeat;opacity:.11;z-index:0;pointer-events:none}
.home-page .classroom-tools-box>*{position:relative;z-index:1}
.home-page .classroom-tools-box .eyebrow{color:#2378a7!important}
.home-page .tools-text h2{color:#0a3a63}
.home-page .tools-text p{color:#365e7c}
.home-page .tech-pill{background:rgba(255,255,255,.86);border:1px solid #a6cfe4;color:#0c4b74;box-shadow:0 4px 10px rgba(25,90,135,.07)}
.home-page .steps .step-num,.home-page .step .step-num{background:linear-gradient(145deg,#0d79a8,#0c4674)!important;color:#fff!important;border:2px solid #b9deef!important;box-shadow:0 9px 22px rgba(14,105,156,.20);font-family:'Plus Jakarta Sans',sans-serif;font-size:1.25rem}
@media(max-width:700px){.home-page .classroom-tools-box::before{background-position:right bottom;background-size:260px auto;opacity:.055}.home-page .expandable-feat-card::before,.home-page .course-action-card::before{width:58%;height:75%;opacity:.10}}
.home-page .expandable-feat-card:nth-child(1){--scene-art:url("card-scene-01.png")}
.home-page .expandable-feat-card:nth-child(2){--scene-art:url("card-scene-02.png")}
.home-page .expandable-feat-card:nth-child(3){--scene-art:url("card-scene-03.png")}
.home-page .expandable-feat-card:nth-child(4){--scene-art:url("card-scene-04.png")}
.home-page .expandable-feat-card:nth-child(5){--scene-art:url("card-scene-05.png")}
.home-page .expandable-feat-card:nth-child(6){--scene-art:url("card-scene-06.png")}
.home-page .expandable-feat-card:nth-child(7){--scene-art:url("card-scene-07.png")}
.home-page .expandable-feat-card:nth-child(8){--scene-art:url("card-scene-08.png")}
.home-page .course-action-card:nth-child(1){--scene-art:url("card-scene-09.png")}
.home-page .course-action-card:nth-child(2){--scene-art:url("card-scene-10.png")}
.home-page .course-action-card:nth-child(3){--scene-art:url("card-scene-11.png")}
.home-page .course-action-card:nth-child(4){--scene-art:url("card-scene-12.png")}
.home-page .course-action-card:nth-child(5){--scene-art:url("card-scene-13.png")}
.home-page .course-action-card:nth-child(6){--scene-art:url("card-scene-14.png")}

/* Cohesive light theme shared by every page. Existing card content and layout are retained. */
.site-theme .top-bar{background:#eaf5fb;color:#0b4774;border-bottom:1px solid #c9e1ef;padding:8px 0}
.site-theme .top-bar-contact a{color:#0b4774;font-weight:650;line-height:1.35}
.site-theme .top-bar-contact a:hover{color:#087fac}
.site-theme .top-bar-social a{display:grid!important;place-items:center;width:30px;height:30px;flex:none;border-radius:50%;background:#fff;color:#07598e!important;border:1px solid #b6d7e9}
.site-theme .top-bar-social a svg{width:16px;height:16px}
.site-theme .top-bar-inner::before,.site-theme .top-bar-note{display:none!important}
.site-theme .site-footer{margin-top:0;background:#eaf4fa url('quran-calligraphy-watermark.svg') right 6% center/350px no-repeat;color:#193e5e;border-top:1px solid #d2e8f4}
.site-theme .site-footer .footer-brand,.site-theme .site-footer .footer-brand .brand-name,.site-theme .site-footer h3,.site-theme .site-footer h4{color:#093960}
.site-theme .site-footer .footer-tagline,.site-theme .site-footer ul li,.site-theme .site-footer .footer-bottom{color:#335c78}
.site-theme .site-footer a{color:#164f77}
.site-theme .site-footer a:hover{color:#087fa9}
.site-theme .site-footer .footer-social a{background:#fff!important;color:#07598e!important;border:1px solid #b8d9eb;box-shadow:0 3px 9px rgba(27,91,132,.1)}
@media(max-width:768px){.site-theme .top-bar-contact{display:flex!important;flex-wrap:wrap;gap:5px 13px!important;margin-right:0!important}.site-theme .top-bar-inner{align-items:center!important;gap:8px!important}.site-theme .top-bar-social{margin-left:0!important}.site-theme .top-bar-contact a{font-size:.75rem}.site-theme .top-bar-social a{width:28px;height:28px}}
@media(max-width:480px){.site-theme .top-bar-inner{flex-direction:column;align-items:flex-start!important}.site-theme .top-bar-contact{gap:4px 10px!important}.site-theme .top-bar-social{align-self:flex-start;gap:8px!important}}
.sub-page main{background:#f7fbfd}
.sub-page .page-header{background:#eaf5fb url('hero-soft-pattern.webp') center/cover no-repeat!important;color:#0a365d!important;text-align:left!important;min-height:310px;display:flex;align-items:center;isolation:isolate;overflow:hidden;padding:4.3rem 0!important}
.sub-page .page-header::before{content:"";position:absolute;width:min(35%,380px);aspect-ratio:1;right:max(3vw,20px);bottom:-80px;background:var(--page-art) center/contain no-repeat;opacity:.17;pointer-events:none;z-index:0}
.sub-page .page-header .inner{width:100%;max-width:1200px!important;text-align:left;position:relative;z-index:1}
.sub-page .page-header h1{color:#073767!important;max-width:760px;font-size:clamp(2.15rem,3.5vw,3.5rem)!important;letter-spacing:-.03em}
.sub-page .page-header p{color:#385f7c!important;margin:0!important;max-width:680px!important}
.sub-page .page-header .eyebrow{color:#147cac!important}
.sub-page main>section.section{position:relative;isolation:isolate;background:#f6fbfd url('section-features.webp') center/cover no-repeat}
.sub-page main>section.section:nth-of-type(odd){background:#f2f9fc url('section-courses.webp') center/cover no-repeat}
.sub-page main>section.section.muted{background:#eef8fb url('section-steps.webp') center/cover no-repeat}
.sub-page main>section.section::before{content:"";position:absolute;width:clamp(210px,25vw,380px);aspect-ratio:1;right:-5vw;top:2rem;background:url('quran-calligraphy-watermark.svg') center/contain no-repeat;opacity:.055;z-index:-1;pointer-events:none}
.sub-page main>section.section:nth-of-type(odd)::before{right:auto;left:-5vw}
.sub-page main>section.section>.container{position:relative}
.sub-page .theme-scene-card{position:relative;isolation:isolate;overflow:hidden}
.sub-page .theme-scene-card::before{content:"";position:absolute;right:0;bottom:0;width:65%;height:76%;background:var(--site-scene) right bottom/contain no-repeat;opacity:.13;z-index:0;pointer-events:none}
.sub-page .theme-scene-card>*{position:relative;z-index:1}
.sub-page .pricing-card.featured{border-color:#5ea6c9}
.sub-page .pricing-card .plan-tag,.sub-page .pricing-card .price-val{color:#0c648e}
.sub-page .signup-page-wrap{background:#eaf5fb url('section-trial.webp') center/cover no-repeat}
.sub-page .signup-info,.sub-page .signup-main-title{color:#0b365b}
.sub-page .accordion-item{background:#fff;border-color:#d6eaf3}
@media(max-width:768px){.sub-page .page-header{min-height:0;text-align:center!important;padding:3.4rem 1.25rem!important}.sub-page .page-header .inner{text-align:center}.sub-page .page-header h1,.sub-page .page-header p{max-width:none}.sub-page .page-header p{margin:0 auto!important}.sub-page .page-header::before{right:-65px;bottom:-45px;width:250px;opacity:.075}.sub-page .theme-scene-card::before{opacity:.09;width:58%}}
@keyframes trialInvitation{0%,100%{box-shadow:0 8px 19px rgba(4,91,145,.18);transform:scale(1)}50%{box-shadow:0 10px 26px rgba(4,113,175,.38),0 0 0 6px rgba(42,154,203,.13);transform:scale(1.025)}}
.home-page .hero-cta .btn-gold{animation:trialInvitation 2.6s ease-in-out infinite;transform-origin:center;will-change:transform}
@media(prefers-reduced-motion:reduce){.home-page .hero-cta .btn-gold{animation:none}}
.theme-about{--page-art:url("card-scene-04.png")}
.theme-courses{--page-art:url("card-scene-09.png")}
.theme-pricing{--page-art:url("card-scene-05.png")}
.theme-teachers{--page-art:url("card-scene-01.png")}
.theme-testimonials{--page-art:url("card-scene-03.png")}
.theme-blog{--page-art:url("card-scene-12.png")}
.theme-faq{--page-art:url("card-scene-08.png")}
.theme-contact{--page-art:url("card-scene-03.png")}
.theme-privacy{--page-art:url("card-scene-07.png")}
.theme-terms{--page-art:url("card-scene-14.png")}
.theme-blog-adult-hifz-guide{--page-art:url("card-scene-11.png")}
.theme-blog-child-quran-routine{--page-art:url("card-scene-13.png")}
.theme-blog-daily-duas-for-muslim-kids{--page-art:url("card-scene-13.png")}
.theme-blog-how-to-choose-quran-teacher{--page-art:url("card-scene-01.png")}
.theme-blog-online-vs-inperson-quran{--page-art:url("card-scene-03.png")}
.theme-blog-tajweed-mistakes{--page-art:url("card-scene-10.png")}
.theme-free-trial{--page-art:url("card-scene-06.png")}

/* Soft decoration in cards that already contain a photograph or a form. */
.sub-page .theme-photo-card .pad{position:relative;isolation:isolate;overflow:hidden}
.sub-page .theme-photo-card .pad::before{content:"";position:absolute;right:-12px;bottom:-8px;width:53%;height:95%;background:var(--site-scene) right bottom/contain no-repeat;opacity:.08;pointer-events:none;z-index:0}
.sub-page .theme-photo-card .pad>*{position:relative;z-index:1}
.sub-page .theme-form-card{position:relative;isolation:isolate;overflow:hidden}
.sub-page .theme-form-card::before{content:"";position:absolute;right:-30px;bottom:-25px;width:42%;height:45%;background:var(--site-scene) right bottom/contain no-repeat;opacity:.045;z-index:0;pointer-events:none}
.sub-page .theme-form-card>*{position:relative;z-index:1}
.sub-page .theme-faq-card{position:relative;isolation:isolate;overflow:hidden}
.sub-page .theme-faq-card::before{content:"";position:absolute;right:8px;top:0;width:95px;height:95px;background:var(--site-scene) right center/contain no-repeat;opacity:.055;z-index:0;pointer-events:none}
.sub-page .theme-faq-card>*{position:relative;z-index:1}
.sub-page .page-header{height:auto!important}
