.qvn-page{ --qvn-green:#0d4436; --qvn-dark:#082f27; --qvn-soft:#edf6f2; --qvn-gold:#d5ae3f; --qvn-gold-soft:#fbf6e7; --qvn-text:#344640; --qvn-muted:#687771; --qvn-border:#dce8e3; --qvn-red:#b52e38; --qvn-red-soft:#fff0f1; --qvn-rule-green:#237a57; --qvn-rule-green-soft:#eaf7f0; --qvn-white:#fff; color:var(--qvn-text); background:#fff; font-family:inherit; line-height:1.75; overflow:hidden; } .qvn-page *, .qvn-page *::before, .qvn-page *::after{ box-sizing:border-box; } .qvn-page a{ text-decoration:none; } .qvn-wrap{ width:min(1180px,calc(100% - 40px)); margin-inline:auto; } .qvn-page h1, .qvn-page h2, .qvn-page h3{ color:var(--qvn-dark); font-family:Georgia,"Times New Roman",serif; line-height:1.2; } .qvn-hero{ position:relative; padding:92px 0 84px; color:#fff; background: radial-gradient(circle at 88% 12%,rgba(213,174,63,.22),transparent 27%), radial-gradient(circle at 8% 90%,rgba(255,255,255,.08),transparent 24%), linear-gradient(135deg,var(--qvn-dark),var(--qvn-green)); } .qvn-hero::after{ position:absolute; right:-110px; bottom:-160px; width:360px; height:360px; border:1px solid rgba(255,255,255,.11); border-radius:50%; content:""; } .qvn-hero-content{ position:relative; z-index:1; max-width:920px; margin:auto; text-align:center; } .qvn-eyebrow{ display:inline-flex; align-items:center; gap:10px; margin-bottom:18px; color:#f1d477; font-size:13px; font-weight:900; letter-spacing:1.5px; text-transform:uppercase; } .qvn-eyebrow::before, .qvn-eyebrow::after{ width:28px; height:1px; background:#f1d477; content:""; } .qvn-page h1{ max-width:900px; margin:0 auto 22px; color:#fff; font-size:clamp(38px,5vw,66px); letter-spacing:-1.3px; } .qvn-hero-text{ max-width:790px; margin:0 auto 30px; color:rgba(255,255,255,.87); font-size:18px; } .qvn-actions{ display:flex; flex-wrap:wrap; justify-content:center; gap:13px; } .qvn-btn{ display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:13px 25px; border:1px solid transparent; border-radius:10px; font-weight:900; transition:transform .2s ease,background .2s ease; } .qvn-btn:hover{ transform:translateY(-2px); } .qvn-btn-primary{ color:var(--qvn-dark); background:var(--qvn-gold); } .qvn-btn-primary:hover{ color:var(--qvn-dark); background:#e3bd50; } .qvn-btn-outline{ color:#fff; border-color:rgba(255,255,255,.55); } .qvn-btn-outline:hover{ color:#fff; background:rgba(255,255,255,.08); } .qvn-trust{ position:relative; z-index:2; display:grid; grid-template-columns:repeat(4,1fr); width:min(1060px,calc(100% - 40px)); margin:-31px auto 0; overflow:hidden; border:1px solid var(--qvn-border); border-radius:16px; background:#fff; box-shadow:0 15px 40px rgba(8,47,39,.1); } .qvn-trust-item{ padding:22px 15px; color:var(--qvn-dark); text-align:center; font-weight:900; } .qvn-trust-item:not(:last-child){ border-right:1px solid var(--qvn-border); } .qvn-section{ padding:82px 0; } .qvn-section-soft{ background:#f7faf9; } .qvn-section-dark{ color:#fff; background:var(--qvn-dark); } .qvn-heading{ max-width:790px; margin:0 auto 44px; text-align:center; } .qvn-label{ display:block; margin-bottom:10px; color:#a67d18; font-size:13px; font-weight:900; letter-spacing:1.4px; text-transform:uppercase; } .qvn-heading h2{ margin:0 0 15px; font-size:clamp(31px,4vw,48px); } .qvn-heading p{ margin:0; color:var(--qvn-muted); font-size:17px; } .qvn-intro{ display:grid; grid-template-columns:1.05fr .95fr; gap:28px; } .qvn-intro-card, .qvn-foundation-card{ padding:36px; border-radius:20px; } .qvn-intro-card{ border:1px solid var(--qvn-border); background:#fff; box-shadow:0 12px 32px rgba(8,47,39,.06); } .qvn-intro-card h2{ margin:0 0 17px; font-size:38px; } .qvn-intro-card p{ margin:0 0 14px; } .qvn-intro-card p:last-child{ margin-bottom:0; } .qvn-foundation-card{ color:#fff; background:linear-gradient(145deg,var(--qvn-green),var(--qvn-dark)); } .qvn-foundation-card span{ display:block; margin-bottom:12px; color:#f1d477; font-size:12px; font-weight:900; letter-spacing:1.3px; text-transform:uppercase; } .qvn-foundation-card h3{ margin:0 0 15px; color:#fff; font-size:29px; } .qvn-foundation-card p{ margin:0; color:rgba(255,255,255,.84); } .qvn-kit-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; } .qvn-kit-card{ padding:27px 23px; border:1px solid var(--qvn-border); border-radius:17px; background:#fff; } .qvn-kit-number{ display:flex; align-items:center; justify-content:center; width:43px; height:43px; margin-bottom:17px; border-radius:50%; color:var(--qvn-dark); background:var(--qvn-gold-soft); font-weight:900; } .qvn-kit-card h3{ margin:0 0 9px; font-size:22px; } .qvn-kit-card p{ margin:0; color:var(--qvn-muted); font-size:15px; } .qvn-colour-system{ display:grid; grid-template-columns:1.08fr .92fr; gap:28px; align-items:stretch; } .qvn-colour-intro{ padding:36px; border:1px solid var(--qvn-border); border-radius:20px; background:#fff; box-shadow:0 12px 32px rgba(8,47,39,.06); } .qvn-colour-intro h2{ margin:0 0 16px; font-size:38px; } .qvn-colour-intro p{ margin:0 0 14px; } .qvn-colour-intro p:last-child{ margin-bottom:0; } .qvn-colour-keys{ display:grid; gap:16px; } .qvn-colour-key{ display:grid; grid-template-columns:68px 1fr; gap:18px; align-items:center; padding:27px; border-radius:18px; } .qvn-colour-key-red{ border:1px solid #f0cbd0; background:var(--qvn-red-soft); } .qvn-colour-key-green{ border:1px solid #c9e7d7; background:var(--qvn-rule-green-soft); } .qvn-colour-swatch{ display:flex; align-items:center; justify-content:center; width:68px; height:68px; border-radius:17px; color:#fff; font-size:14px; font-weight:900; text-align:center; } .qvn-red-swatch{ background:var(--qvn-red); } .qvn-green-swatch{ background:var(--qvn-rule-green); } .qvn-colour-key h3{ margin:0 0 6px; font-size:24px; } .qvn-colour-key p{ margin:0; color:var(--qvn-muted); font-size:15px; } .qvn-accessibility-note{ margin-top:22px; padding:20px 23px; border-left:5px solid var(--qvn-gold); border-radius:10px; background:var(--qvn-gold-soft); } .qvn-accessibility-note strong{ color:var(--qvn-dark); } .qvn-lesson-flow{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; } .qvn-flow-card{ position:relative; padding:27px 22px; border:1px solid rgba(255,255,255,.12); border-radius:16px; background:rgba(255,255,255,.06); } .qvn-flow-card strong{ display:block; margin-bottom:9px; color:#f1d477; font-size:13px; letter-spacing:.8px; text-transform:uppercase; } .qvn-flow-card h3{ margin:0 0 9px; color:#fff; font-size:22px; } .qvn-flow-card p{ margin:0; color:rgba(255,255,255,.74); font-size:15px; } .qvn-section-dark .qvn-heading h2{ color:#fff; } .qvn-section-dark .qvn-heading p{ color:rgba(255,255,255,.72); } .qvn-curriculum-stage{ margin-bottom:28px; padding:30px; border:1px solid var(--qvn-border); border-radius:20px; background:#fff; } .qvn-curriculum-stage:last-child{ margin-bottom:0; } .qvn-stage-heading{ display:flex; align-items:center; gap:18px; margin-bottom:23px; } .qvn-stage-number{ display:flex; flex:0 0 50px; align-items:center; justify-content:center; width:50px; height:50px; border-radius:14px; color:#fff; background:var(--qvn-green); font-weight:900; } .qvn-stage-heading h3{ margin:0 0 4px; font-size:27px; } .qvn-stage-heading p{ margin:0; color:var(--qvn-muted); } .qvn-lessons{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; } .qvn-lesson{ display:grid; grid-template-columns:46px 1fr; gap:14px; align-items:start; padding:19px; border:1px solid var(--qvn-border); border-radius:13px; background:#fafcfb; } .qvn-lesson-no{ display:flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:11px; color:var(--qvn-dark); background:var(--qvn-gold-soft); font-weight:900; } .qvn-lesson h3{ margin:0 0 5px; font-size:20px; } .qvn-lesson p{ margin:0; color:var(--qvn-muted); font-size:14px; } .qvn-mastery-note{ margin-top:24px; padding:24px 27px; border-left:5px solid var(--qvn-gold); border-radius:10px; background:var(--qvn-soft); } .qvn-mastery-note strong{ color:var(--qvn-dark); } .qvn-audience-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; } .qvn-audience{ padding:28px 23px; border:1px solid var(--qvn-border); border-radius:17px; background:#fff; } .qvn-audience h3{ margin:0 0 10px; font-size:22px; } .qvn-audience p{ margin:0; color:var(--qvn-muted); font-size:15px; } .qvn-outcomes{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; } .qvn-outcome{ position:relative; padding:21px 22px 21px 58px; border:1px solid var(--qvn-border); border-radius:14px; background:#fff; } .qvn-outcome::before{ position:absolute; top:22px; left:21px; display:flex; align-items:center; justify-content:center; width:25px; height:25px; border-radius:50%; color:#fff; background:var(--qvn-green); content:"✓"; font-size:13px; font-weight:900; } .qvn-outcome strong{ display:block; margin-bottom:3px; color:var(--qvn-dark); } .qvn-outcome span{ color:var(--qvn-muted); font-size:14px; } .qvn-trial{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; } .qvn-trial-card{ padding:27px; border:1px solid var(--qvn-border); border-radius:17px; background:#fff; } .qvn-trial-card span{ display:inline-block; margin-bottom:13px; padding:5px 12px; border-radius:30px; color:var(--qvn-dark); background:var(--qvn-gold-soft); font-size:13px; font-weight:900; } .qvn-trial-card h3{ margin:0 0 9px; font-size:23px; } .qvn-trial-card p{ margin:0; color:var(--qvn-muted); } .qvn-flexible-note{ margin:18px 0 0; color:var(--qvn-muted); text-align:center; font-size:14px; } .qvn-faq{ max-width:900px; margin:auto; } .qvn-faq details{ margin-bottom:12px; border:1px solid var(--qvn-border); border-radius:13px; background:#fff; } .qvn-faq summary{ padding:19px 22px; color:var(--qvn-dark); font-weight:900; cursor:pointer; list-style:none; } .qvn-faq summary::-webkit-details-marker{ display:none; } .qvn-faq summary::after{ float:right; color:#a67d18; content:"+"; font-size:22px; } .qvn-faq details[open] summary::after{ content:"−"; } .qvn-faq details p{ margin:0; padding:0 22px 20px; color:var(--qvn-muted); } .qvn-final{ padding:78px 0; color:#fff; text-align:center; background: radial-gradient(circle at 15% 20%,rgba(213,174,63,.18),transparent 25%), linear-gradient(135deg,var(--qvn-dark),var(--qvn-green)); } .qvn-final h2{ max-width:800px; margin:0 auto 16px; color:#fff; font-size:clamp(32px,4vw,48px); } .qvn-final p{ max-width:720px; margin:0 auto 27px; color:rgba(255,255,255,.8); font-size:17px; } .qvn-policy{ margin-top:23px; color:rgba(255,255,255,.65); font-size:13px; } .qvn-policy a{ color:#f1d477; font-weight:700; } @media(max-width:1000px){ .qvn-trust, .qvn-kit-grid, .qvn-lesson-flow, .qvn-audience-grid{ grid-template-columns:repeat(2,1fr); } .qvn-intro, .qvn-colour-system{ grid-template-columns:1fr; } .qvn-trust-item:nth-child(2){ border-right:0; } .qvn-trust-item:nth-child(-n+2){ border-bottom:1px solid var(--qvn-border); } } @media(max-width:767px){ .qvn-wrap{ width:min(100% - 26px,1180px); } .qvn-hero{ padding:69px 0 66px; } .qvn-hero-text{ font-size:16px; } .qvn-btn{ width:100%; } .qvn-section{ padding:62px 0; } .qvn-trust, .qvn-kit-grid, .qvn-lesson-flow, .qvn-lessons, .qvn-audience-grid, .qvn-outcomes, .qvn-trial{ grid-template-columns:1fr; } .qvn-trust-item{ border-right:0 !important; border-bottom:1px solid var(--qvn-border); } .qvn-trust-item:last-child{ border-bottom:0; } .qvn-intro-card, .qvn-foundation-card, .qvn-colour-intro, .qvn-curriculum-stage{ padding:26px 22px; } .qvn-intro-card h2, .qvn-colour-intro h2{ font-size:31px; } .qvn-colour-key{ grid-template-columns:55px 1fr; padding:21px; } .qvn-colour-swatch{ width:55px; height:55px; border-radius:14px; font-size:12px; } .qvn-stage-heading{ align-items:flex-start; } .qvn-stage-heading h3{ font-size:23px; } } @media(prefers-reduced-motion:reduce){ .qvn-page *, .qvn-page *::before, .qvn-page *::after{ transition:none !important; } }