@charset 'UTF-8';

/* RESET
======================================================= */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, main {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;text-decoration: none;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
html {font-size: calc(var(--ss)*18vw);}
button {border:0;outline:0;}
* { box-sizing: border-box; outline:none;letter-spacing:var(--ls);}
section[style*="z-index:"] {-webkit-transform: translate3d(0,0,0);}
body {line-height: 1;}
a {color:inherit;}
main section a[href*="faq"] {text-decoration:underline;}
section#page {overflow-x: clip;}
img {max-width:100%;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content:'';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
p { margin-bottom: 1em; }
.center { text-align: center; }
.left { text-align: left; }
.softhide {display:none;}
u {text-decoration:underline;}
iframe {border:0; outline: none; width:100%;}

/* FONT ASSIGNMENT
======================================================= */
body { font:var(--p1); text-align: left; color:var(--navy); background: var(--white);overflow-x: hidden;}
main{overflow: hidden;}
.has-under-banner main, .has-top-banner main{padding-top:calc(var(--header-height) + var(--banner-height));}
b, strong { font-weight:600; }
h1, .h1 {font:var(--h1);}
.h1alt {font:var(--h1alt);}
body.education-hub h1, .h1ed {font:var(--h1ed);}
body.education-hub h2, .h2ed {font:var(--h2ed);}
h2, .h2 {font:var(--h2);}
h3, .h3 {font:var(--h3);}
h4, .h4 {font:var(--h4);}
h5, .h5 {font:var(--h4);}
.hl {font:var(--hl);}
p, .p1 {font:var(--p1);}
strong, b{font-weight: 600;}
.p2 {font:var(--p2);}
.p3 {font:var(--p3);}
.nav {font:var(--nav);}
span.p1 {display:inline-block;}
p.bold{font-weight:600;}
p:last-child{margin-bottom: 0;}

/*utilities*/

.video{line-height:0;}

/* BACKGROUNDS
======================================================= */
.bg-navy{background:var(--navy); color:var(--white)}
.bg-white{background:var(--white); color:var(--navy);}
.bg-blue05{background:var(--blue05); color:var(--navy);}
.bg-green40{background:var(--green40); color:var(--navy);}
.bg-green20{background:var(--green20); color:var(--navy);}
.bg-green05{background:var(--green05); color:var(--navy);}
.bg-grey05{background:var(--grey05); color:var(--navy);}
.bg-pink05{background:var(--pink05); color:var(--navy);}

/* IMG
======================================================= */
img, .img-wrap, .image{line-height:0;}
.cover{object-fit: cover}
.contain{object-fit: contain}

/* FLEX
======================================================= */
.flex{display: flex;}
.flex.reverse{flex-direction: row-reverse;}

.flex-wrap{flex-wrap: wrap;}

.flex-row{flex-direction:row}
.flex-column{flex-direction:column}
.flex-column.reverse{flex-direction:column-reverse}

.jcfe{justify-content: flex-start;}
.jcfe{justify-content: flex-end;}
.jcc{justify-content: center;}
.jcsb{justify-content: space-between;}
.jcse{justify-content: space-evenly;}

.aifs{align-items: flex-start;}
.aife{align-items: flex-end;}
.aic{align-items: center;}
.aisb{align-items: space-between;}

.flex-grow-1{flex-grow: 1;}

@media(min-width:769px){
	/*	Static Spacings */
	.gap-1{gap:var(--spacing-1);}
	.gap-2{gap:var(--spacing-2);}
	.gap-3{gap:var(--spacing-3);}
	.gap-4{gap:var(--spacing-4);}
	.gap-5{gap:var(--spacing-5);}
	.gap-6{gap:var(--spacing-6);}
	.gap-7{gap:var(--spacing-7);}
	.gap-8{gap:var(--spacing-8);}
	.gap-9{gap:var(--spacing-9);}

	/*	Responsive Spacings */
	.gap-r-1{gap:var(--spacing-r-1);}
	.gap-r-2{gap:var(--spacing-r-2);}
	.gap-r-3{gap:var(--spacing-r-3);}
	.gap-r-4{gap:var(--spacing-r-4);}
	.gap-r-5{gap:var(--spacing-r-5);}
	.gap-r-6{gap:var(--spacing-r-6);}
	.gap-r-7{gap:var(--spacing-r-6);}
	
	.flex-1{flex:1 0;}
	.flex-50{flex:50%;}
}

@media(max-width:768px){
	.mob-wrap{flex-wrap: wrap; }
	.mob-flex-column{flex-direction:column !important;}
	.mob-flex-column-r{flex-direction:column-reverse !important;}
	
	.mob-flex-column.mjcfe{justify-content: flex-start;}
	.mob-flex-column.mjcfe{justify-content: flex-end;}
	.mob-flex-column.mjcc{justify-content: center;}
	.mob-flex-column.mjcsb{justify-content: space-between;}

	.mob-flex-column.maifs{align-items: flex-start;}
	.mob-flex-column.maife{align-items: flex-end;}
	.mob-flex-column.maic{align-items: center;}
	.mob-flex-column.maisb{align-items: space-between;}
	
	.mob-flex-column.gap-1 > :not(:last-child){margin-bottom:var(--spacing-1);}
	.mob-flex-column.gap-2 > :not(:last-child){margin-bottom:var(--spacing-2);}
	.mob-flex-column.gap-3 > :not(:last-child){margin-bottom:var(--spacing-3);}
	.mob-flex-column.gap-4 > :not(:last-child){margin-bottom:var(--spacing-4);}
	.mob-flex-column.gap-5 > :not(:last-child){margin-bottom:var(--spacing-5);}
	.mob-flex-column.gap-6 > :not(:last-child){margin-bottom:var(--spacing-6);}
	.mob-flex-column.gap-7 > :not(:last-child){margin-bottom:var(--spacing-7);}
	.mob-flex-column.gap-8 > :not(:last-child){margin-bottom:var(--spacing-8);}
	.mob-flex-column.gap-9 > :not(:last-child){margin-bottom:var(--spacing-9);}

	/*	Responsive Spacings */
	.mob-flex-column.gap-r-1 > :not(:last-child){margin-bottom:var(--spacing-r-1);}
	.mob-flex-column.gap-r-2 > :not(:last-child){margin-bottom:var(--spacing-r-2);}
	.mob-flex-column.gap-r-3 > :not(:last-child){margin-bottom:var(--spacing-r-3);}
	.mob-flex-column.gap-r-4 > :not(:last-child){margin-bottom:var(--spacing-r-4);}
	.mob-flex-column.gap-r-5 > :not(:last-child){margin-bottom:var(--spacing-r-5);}
	.mob-flex-column.gap-r-6 > :not(:last-child){gmargin-bottomap:var(--spacing-r-6);}
	.mob-flex-column.gap-r-7 > :not(:last-child){margin-bottom:var(--spacing-r-6);}
}

/* MARGINS
======================================================= */
.mtauto{margin-top: auto;}
.mlauto{margin-left: auto;}
.mbauto{margin-bottom: auto;}
.mrauto{margin-right: auto;}
.mb-0{margin-bottom:0;}

button, a{cursor: pointer;}
.uc{text-transform: uppercase;}
.ul{text-decoration: underline;}
.w-100{width:100%;}
.h-fc{height:fit-content}
.w-fc{height:fit-content}

/* POSITIONS
======================================================= */
.rel{position:relative;}
.fixed{position:fixed;}
.abs{position:absolute;}


/* BORDER RADIUS
======================================================= */
.br{border-radius:var(--radius);}
.br-s{border-radius:var(--radius-s);}
.br-m{border-radius:var(--radius-m);}
.br-l{border-radius:var(--radius-l);}

/* TEXT
======================================================= */
.text-center{text-align: center;}
.text-left{text-align: left;}
.text-right{text-align: right;}

/* BUTTONS
======================================================= */
.btn{display:flex; align-items:center; border-radius:var(--radius); background:var(--navy); color:var(--white); transition:0.3s opacity; cursor:pointer; height:calc(var(--ss)*48vw); padding:0 var(--spacing-6); width:fit-content; font:var(--btn); letter-spacing:0.0125rem; justify-content: center;}
.btn:hover{opacity:0.7}
.btn.w-100{width:100%;}
.btn.border{border:calc(var(--ss)*1vw) solid var(--navy80);}

.btn-small{padding:0 var(--spacing-4); height:calc(var(--ss)*36vw); font:var(--btn-s);}
.btn-med{ height:calc(var(--ss)*56vw)}
.btn-large{ height:calc(var(--ss)*64vw)}

.btn-white{background:var(--white); color:var(--navy);}
.btn-white.border{border:calc(var(--ss)*1vw) solid var(--black20);}
.btn-pink{background:var(--pink);}
.btn-green20{background:var(--green20); color:var(--navy);}

.btn.disabled,
.btn.disabled:hover{width:100%; background:var(--navy80); color:var(--navy50);}

@media(max-width:768px){
	.btn{width:100%;}
}

/* ICONS
======================================================= */
.icon-before, .icon-after{display:flex; align-items: center; font-weight: 600;}
.icon-before:before, .icon-after:after{content:''; display:block; width:var(--icon-size); height:var(--icon-size); background-position: center; background-size: contain; background-repeat: no-repeat; }
.icon-before:before{ margin-right:var(--spacing-2);}
.icon-after:after{margin-left:var(--spacing-2);}

.icon-unlock:before, .icon-unlock:after{background-image:url('../images/icons/Lock.svg')}
.icon-logout:before, .icon-logout:after{background-image:url('../images/icons/logout.svg')}
.icon-login:before, .icon-login:after{background-image:url('../images/icons/Profile.svg')}
.icon-login-white:before, .icon-login-white:after{background-image:url('../images/icons/Profile-white.svg')}
.icon-info:before, .icon-info:after{background-image:url('../images/icons/info.svg')}
.icon-info-white:before, .icon-info-white:after{background-image:url('../images/icons/Info-white.svg')}
.icon-question:before, .icon-question:after{background-image:url('../images/icons/Question.svg')}
.icon-question-navy:before, .icon-question-navy:after{background-image:url('../images/icons/Question-navy.svg')}
.icon-edit:before, .icon-edit:after{background-image:url('../images/icons/Pen.svg')}
.icon-upload:before, .icon-upload:after{background-image:url('../images/icons/Share.svg')}
.icon-download:before, .icon-download:after{background-image:url('../images/icons/Save.svg')}
.icon-apple:before, .icon-apple:after{background-image:url('../images/icons/Apple.svg')}
.icon-google:before, .icon-google:after{background-image:url('../images/icons/Google.svg')}
.icon-facebook:before, .icon-facebook:after{background-image:url('../images/icons/Facebook.svg')}
.icon-dashboard:before, .icon-dashboard:after{background-image:url('../images/icons/Dashboard.svg')}
.icon-arrow-left:before, .icon-arrow-left:after{background-image:url('../images/icons/Arrow-left.svg')}


/* LISTS
======================================================= */
.checklist{}
.checklist li{padding-left:calc(var(--ss)*37vw);padding-bottom:var(--spacing-6); position:relative;}
.checklist.small-gap li{padding-bottom:var(--spacing-4);}
.checklist li:last-child{padding-bottom:0;}
.checklist li:before{display:block; content:''; position:absolute; width:var(--icon-size); height:var(--icon-size); top:0; left:0;background:var(--navy80) url('../images/icons/Tick.svg') center / contain no-repeat; border-radius:var(--radius-l);}
.checklist li:not(:last-child):after{display:block; content:''; position:absolute; width:calc(var(--ss)*2vw); height:calc(100% - calc(var(--ss)*41vw)); left:calc(var(--ss)*11vw); top:calc(var(--ss)*32.5vw); background:var(--navy80)}
.checklist li h4 + p{margin-top:var(--spacing-1);}


/* VIDEO
======================================================= */
.video{width: 100%; height:100%; overflow:hidden; line-height:0; position:relative;}
.video iframe{ height:101%; width:auto; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); }

@media (min-aspect-ratio: 1 / 1) { 
	.video iframe{ height:auto; width:101%; }
}

@media(max-width:768px){
	.video iframe{ height:auto; width:101%; }
}


/* CIRCLE
======================================================= */
.circle{display:inline-flex; width:var(--spacing-8); height:var(--spacing-8); border-radius:var(--radius-l); background:var(--white); font:var(--circle); align-items: center; justify-content: center; transform:translateY(-10%); padding-top:calc(var(--ss)*4vw);}
.circle[data-risk="excellent"]{background:var(--excellent-light);}
.circle[data-risk="good"]{background:var(--good-light);}
.circle[data-risk="ineligible"]{background:var(--average-light);}
.circle[data-risk="lower"]{background:var(--average-light);}
.circle[data-risk="average"]{background:var(--average-light);}
.circle[data-risk="higher-risk"]{background:var(--higher-light);}
.circle[data-risk="high-risk"]{background:var(--high-light);}

@media(max-width:768px){
	.circle{display:inline-flex; width:var(--spacing-6); height:var(--spacing-6); background:var(--white); align-items: center; justify-content: center; transform:translateY(-7%); padding-top:calc(var(--ss)*4vw);}
}

/* CIRCLE
======================================================= */
.risk-pill{display:flex; height:var(--spacing-8); padding:0 var(--spacing-4); justify-content: center; align-items: center; font:var(--radio); border-radius:var(--radius); text-wrap:nowrap;}
.risk-pill.large{height:var(--spacing-9); padding:0 var(--spacing-5);}

.risk-pill[data-risk="excellent"]{background:var(--excellent-light);}

.risk-pill[data-risk="good"], .risk-pill[data-risk="average"], .risk-pill[data-risk="lower"] {background:var(--good-light);}
.risk-pill[data-risk="average"].moderate {background:var(--average-light);}
.risk-pill[data-risk="higher-risk"], .risk-pill[data-risk="high-risk"], .risk-pill[data-risk="higher"] {background:var(--high-light); /*background:var(--higher-light);*/}


.risk-pill.large[data-risk="excellent"]{background:var(--excellent); color:var(--white)}
.risk-pill.large[data-risk="good"]{background:var(--good);}
.risk-pill.large[data-risk="average"]{background:var(--average);}
.risk-pill.large[data-risk="higher-risk"]{background:var(--higher);}
.risk-pill.large[data-risk="high-risk"]{background:var(--high); color:var(--white)}

.risk-pill[data-risk="higher-risk"]:before,
.risk-pill[data-risk="high-risk"]:before{content:''; display:block; width:var(--icon-size); height:var(--icon-size); background:url('../images/icons/Error.svg') center / contain no-repeat; margin-right:var(--spacing-2);}

.risk-pill.large[data-risk="high-risk"]:before{background-image:url('../images/icons/Error-white.svg');}

@media(max-width:768px){
	.risk-pill{display:flex; height:var(--spacing-7); padding:0 var(--spacing-3);}
	.risk-pill.large{height:var(--spacing-8); padding:0 var(--spacing-4);}
}


/* RISK DIAL
======================================================= */
.risk-dial{position:relative;line-height:0; font-size:0}

.risk-dial .dial{width:calc(var(--ss)*122vw); height:calc(var(--ss)*100vw);}
.risk-dial.large .dial{width:calc(var(--ss)*206vw); height:calc(var(--ss)*169vw); transform: scaleX(-1); }

.risk-dial .pointer{width:calc(var(--ss)*13vw); height:calc(var(--ss)*62vw); object-fit:contain; position:absolute; bottom:calc(var(--ss)*22vw); left:calc(50% - calc(var(--ss)*6.5vw)); transition:0.3s transform; transform:rotate(-79deg); transform-origin:center bottom;}
.risk-dial.large .pointer{width:calc(var(--ss)*22vw); height:calc(var(--ss)*104vw);bottom:calc(var(--ss)*22vw); left:calc(50% - calc(var(--ss)*10vw)); transform:rotate(-67deg);}

.risk-dial[data-risk="excellent"], .risk-dial[data-risk-cnt="excellent"] .pointer{transform:rotate(-79deg);}
.risk-dial[data-risk="good"] .pointer{transform:rotate(-38deg);}
.risk-dial[data-risk="average"] .pointer{transform:rotate(0deg);}
.risk-dial[data-risk="higher-risk"] .pointer{transform:rotate(38deg);}
.risk-dial[data-risk="high-risk"] .pointer{transform:rotate(79deg);}

.risk-dial.large[data-risk="excellent"] .pointer{transform:rotate(67deg);}
.risk-dial.large[data-risk="good"] .pointer{transform:rotate(33deg);}
.risk-dial.large [data-risk="average"] .pointer{transform:rotate(0deg);}
.risk-dial.large[data-risk="higher-risk"] .pointer{transform:rotate(-33deg);}
.risk-dial.large[data-risk="high-risk"] .pointer{transform:rotate(-67deg);}

/* MAIN
======================================================= */
section .inner{padding:0 var(--hpad);}
.site-logo{width:calc(var(--ss)*149vw); height:calc(var(--ss)*60vw); background:url('../images/brand/c4c-logo.png') center / contain no-repeat;}
section .contain-lg{max-width:calc(var(--ss)*671vw); margin:0 auto}
section .contain{max-width:calc(var(--ss)*570vw); margin:0 auto}

/* HEADER
======================================================= */
header{height:var(--header-height); padding:0 var(--hpad); gap:var(--spacing-8);width:100vw; z-index:10002}
header p{font:var(--header);}
.home header{background:var(--white);}
body:not(.home) header .welcome{display:none;}
header .link{font-weight:600;}

header .btn-dashboard:before{content:''; display:block; width:var(--icon-size); height:var(--icon-size); background:url('../images/icons/Dashboard.svg') center / contain no-repeat; margin-right:var(--spacing-2);}

body.results header{background:var(--grey05);}
body.education-hub header{background:var(--green40);}

.intro header .site-logo{background-image:url('../images/brand/c4c-logo-white.png')}
body.education-hub header .site-logo{background-image:url('../images/brand/c4c-logo-navy.png')}
.questionnaire header{display:none;}

@media(max-width:768px){
	header .link{margin-bottom:var(--spacing-1) !important;}
}

/* FOOTER
======================================================= */
footer{padding:var(--spacing-r-5) var(--hpad) var(--spacing-7); border-top:1px solid var(--blue05);}
.footer-top{margin-bottom:var(--spacing-r-5);}
.footer-bottom *{font:var(--footer-legal)}
.footer-top ul + h4{margin-top:var(--spacing-7);}
.footer-top h4,
.footer-top li{margin-bottom:var(--spacing-2);}
.footer-top li a{height:var(--icon-size); display:flex; align-items: center; line-height:1em; font-weight:400;}

footer .socials a{width:var(--icon-size); height:var(--icon-size);}
footer .socials .social-x{background:url('../images/icons/X.svg') center / contain no-repeat;}
footer .socials .social-linkedin{background:url('../images/icons/Linkedin.svg') center / contain no-repeat;}

body.intro footer,
body.questionnaire footer{display:none;}


/* RISK CHECK SHARED
======================================================= */
.risk-check a + h1{margin-top:var(--spacing-2);}


/* HOME HUB
======================================================= */
.home-hub-block{padding:var(--header-height) 0 var(--spacing-r-1);}
.home-hub-block .risk-check{padding:var(--spacing-r-1) var(--spacing-6); height:fit-content;}
.home-hub-block .risk-check h1{margin-bottom:var(--spacing-6); max-width:calc(var(--ss)*435vw)}
.home-hub-block .risk-check ul{margin-bottom:var(--spacing-6);}

.home-hub-block .education-hub-links{padding:var(--spacing-7) var(--spacing-6);}
.home-hub-block .education-hub-links .hub-header{margin-bottom:var(--spacing-5);}
.home-hub-block .education-hub-links a.icon-unlock{font:var(--btn);color:var(--navy60)}
.home-hub-block .education-hub-links .icon-unlockk:not(.locked){display:none;}


.home-hub-block .education-hub-links .hub-card{padding:var(--spacing-5)}
.home-hub-block .education-hub-links .hub-card h2{margin-bottom: var(--spacing-2);}
.home-hub-block .education-hub-links .hub-card .btn{width:100%; margin-top:var(--spacing-5)}
.home-hub-block .education-hub-links .hub-card.locked .btn,
.home-hub-block .education-hub-links .hub-card.locked .btn:hover{width:100%; background:var(--navy80); color:var(--navy50);}
.home-hub-block .education-hub-links .hub-card.locked .btn:before{content:''; display:block; width:var(--icon-size); height:var(--icon-size); background:url('../images/icons/Navy50Lock.svg') center / contain no-repeat; margin-right:var(--spacing-2);}

.home-hub-block .progress-bar{width:100%; height:calc(var(--ss)*36vw);margin-bottom:var(--spacing-6); border-radius:calc(var(--ss)*18vw); overflow:hidden; background:var(--navy80); line-height: 0;}
.home-hub-block .progress-bar .progress{height:calc(var(--ss)*36vw); border-radius:calc(var(--ss)*18vw); transition:0.3s width; background:var(--pink); display:block;}
.home-hub-block .progress-bar .percent{right:var(--spacing-5); top:50%; transform:translateY(-50%); line-height:calc(var(--ss)*16vw); font-weight:600;}

@media(min-width:769px){
	.home-hub-block .education-hub-links .hub-card{width:calc(50% - calc(var(--spacing-4) / 1.99))}
}

/* QUESTIONNAIRE INTRO Page
======================================================= */
.intro-block .img-hero{padding:var(--spacing-5); background-size: cover; background-position: center; background-repeat: no-repeat;}

.intro-block .risk-check{padding:var(--spacing-8) var(--spacing-r-4) var(--spacing-7) var(--spacing-r-5);}
.intro-block .risk-check h1,
.intro-block .risk-check ul {margin-bottom:var(--spacing-5);}
.intro-block .risk-check .btn-large + p{margin-top:var(--spacing-5); margin-bottom: var(--spacing-2);}
.intro-block .risk-check .icon-login{color:var(--navy40); letter-spacing:0.0125rem;}

@media(min-width:769px){
	.intro-block .col{min-height:100vh;}
}

@media(max-width:768px){
	.intro-block .img-hero{padding:var(--hpad); height:calc(var(--ss)*450vw)}
	.intro-block .risk-check{padding:var(--hpad);}
}

/* QUESTIONNAIRE 
======================================================= */
.mycancerrisk-questionnaire header { z-index:-1;}
.questionnaire-block{padding:var(--spacing-6) 0}
.questionnaire-block .progress-wrap button{height:calc(var(--ss)*24vw); width:calc(var(--ss)*24vw);}
.questionnaire-block .prev-group{background:url('../images/icons/Chevron-left.svg') center / contain no-repeat;}
.questionnaire-block .next-group{background:url('../images/icons/Cross.svg') center / contain no-repeat;}

.questionnaire-block .progress{height:calc(var(--ss)*6vw); transition:0.3s all; width:calc(var(--ss)*25vw); background:var(--blue10); border-radius:var(--radius-s); overflow:hidden; line-height:0; font-size:0; }
.questionnaire-block .progress.inactive { background: var(--green); opacity: 0.5; }
.questionnaire-block .progress span{background:var(--green); height:100%; border-radius:var(--radius-s); display:block; width:0%; transition:0.3s all;}

.questionnaire-block .progress.active{flex-grow:1;}

.questionnaire-block .step .text h1,
.questionnaire-block .step .text p{font:var(--question);}
.questionnaire-block .step .text h1{color:var(--navy70);}

.questionnaire-block form{height:calc(100vh - calc(var(--ss)*88vw));}
.questionnaire-block .group,
.questionnaire-block form .step{position:absolute; top:0; left:0; width:100%; height:100%; overflow-y:auto; opacity:0; transition:0.3s opacity; pointer-events:none;}
.questionnaire-block .step{height:fit-content; opacity:0; transition:0.3s opacity;}

.questionnaire-block .group.active,
.questionnaire-block .group.active .step.active{opacity:1; transition:0.3s opacity; pointer-events:all;}
.questionnaire-block .step .text{height:100%; display:flex; flex-direction: column; justify-content: center;}

.questionnaire-block .field,
.questionnaire-block .field-group,
.questionnaire-block .infobox,
.questionnaire-block .step > .btn,
.questionnaire-block .spacer{max-width:calc(var(--ss)*374vw); margin:0 auto; width:100%;}

.questionnaire-block .field:first-child{margin-top:var(--spacing-r-4);}

form .field > label{font:var(--question); text-align: center; display:block; margin-bottom:var(--spacing-5);}
.invalid .field > label { color:var(--pink); }
.error { display:none; }
.invalid .error { display:block; }

form .infobox,
.questionnaire-block .step > .btn{margin-top:var(--spacing-5);}

form .field{margin-bottom:var(--spacing-3) !important;}
form .field.mb-l{margin-bottom:var(--spacing-6) !important;}
/* form .field:last-child{margin-bottom:0 !important;} */

form .field p{text-align: center;}

/*INFOBOX*/
form .infobox{padding:var(--spacing-4); margin-top:var(--spacing-5) !important;}
form .infobox h5{display: flex; align-items: center;margin-bottom:var(--spacing-2)}
form .infobox p{color:var(--navy80); font:var(--p2)}

/*RADIO*/
form .field .radio,
form .field .checkbox{position:relative;}
form .field input[type="radio"],
form .field input[type="checkbox"]{cursor: pointer; position: absolute; top: 0; left: 0; opacity: 0 !important; outline: 0; z-index: -1;}
form .field .radio label,
form .field .checkbox label{width:100%; height:var(--field-height); display:flex; align-items: center; justify-content: center; padding:var(--spacing-2) var(--spacing-4); border:calc(var(--ss)*2vw) solid var(--grey20); border-radius:var(--radius-m); margin-bottom:var(--spacing-2); cursor:pointer; font:var(--radio);}
/* form .field .radio:last-child label,
form .field .checkbox:last-child label{margin-bottom:0;} */
form .field input[type="radio"]:checked + label,
form .field input[type="checkbox"]:checked + label{ border-color: var(--navy); } 

form .field[data-type="toggle"]{width:fit-content; margin:0 auto var(--spacing-6); padding:var(--spacing-2)}
form .field[data-type="toggle"] .radio label{margin:0;border:0; background:transparent; transition:0.3s background; height:calc(var(--ss)*48vw)}
form .field[data-type="toggle"] input[type="radio"]:checked + label{ background: var(--navy80); } 

form .spacer{position:relative; text-align:center; margin:var(--spacing-5) auto;}
form .spacer:before{position:absolute; content:''; display:block; width:100%; height:calc(var(--ss)*1vw); top:calc(50% - calc(var(--ss)*0.5vw)); left:0; right:0; background:var(--navy)}
form .spacer span{background:var(--white);position: relative; padding:0 var(--spacer-4)}
.bg-navy form .spacer:before{background:var(--navy80)}
.bg-navy form .spacer span{color:var(--navy80); background:var(--navy)}

/*INPUT*/
form .field input[type="text"],
form .field input[type="tel"],
form .field input[type="email"],
form .field input[type="date"],
form .field input[type="number"],
form .field input[type="password"],
form .field .dropdown{height:var(--field-height);display:flex;align-items: center; border:0; border-radius: var(--radius-s); background:var(--grey10); width:100%;  padding:var(--spacing-2) var(--spacing-4); font:var(--p1); color:var(--navy); font-weight:600; outline:0;}

form .field.with-append{display:flex; align-items: center;}
form .field.with-append span{margin-left:var(--spacing-3); width:var(--icon-size)}

form .field.fixed-placeholder{position: relative;}
form .field.fixed-placeholder .placeholder{position: absolute; top:var(--spacing-2); left:var(--spacing-4); font-size:calc(var(--ss)*12vw); line-height:calc(var(--ss)*12vw); transition:0.3s all; color:var(--navy80); pointer-events: none;}
form .field.fixed-placeholder input{transition:0.3s padding;}
form .field.fixed-placeholder input:not(:placeholder-shown){padding-top:var(--spacing-4)}
form .field.fixed-placeholder input:placeholder-shown + .placeholder{opacity:0; font:var(--p1); top:calc(50% - calc(var(--ss)*12.5vw))}

/*SELECT*/
form .field select{display:none !important}

form .field .dropdown{position: relative; z-index:1000; cursor:pointer; justify-content: space-between}
form .field .dropdown .default-text span{font-weight:400; color:var(--navy80);}
form .field .dropdown .menu{position: absolute; top:var(--field-height); left:0; right:0; background:var(--white); z-index:10000; overflow:hidden; overflow-y:scroll; height:fit-content; max-height:0px; transition:0.3s all;}
form .field .dropdown.active .menu{/*max-height:calc(var(--ss)*900vw)*/max-height:calc(var(--ss) * 48vw * 5)}
form .field .dropdown .menu li{background:rgba(244,245,247,0.5); cursor: pointer; height:calc(var(--ss)*48vw); display:flex; align-items: center; padding:var(--spacing-2) var(--spacing-4);}
form .field .dropdown .menu li:hover{background:rgba(244,245,247,0.8);}
form .field .dropdown .menu li.selected{background:var(--grey20);}

form .field .dropdown .dropdown-icon{width:var(--icon-size); height:var(--icon-size); background:url('../images/icons/Chevron-down.svg') center / contain no-repeat; transition:0.3s transform;}
form .field .dropdown.active .dropdown-icon{transform:scaleY(-1)}

@media(min-width:769px){
	
}


/*
PLACEHOLDERS :-(
========================================================== */
form .field input::-webkit-input-placeholder { opacity:1; color:var(--navy80) !important; font:var(--p1);}
form .field input::-moz-placeholder { opacity:1; color:var(--navy80) !important; font:var(--p1); padding:inherit; border-radius:inherit;}
form .field input:-ms-input-placeholder { opacity:1; color:var(--navy80) !important; font:var(--p1); padding:inherit; border-radius:inherit;}
form .field input:-moz-placeholder { opacity:1; color:var(--navy80) !important; font:var(--p1); padding:inherit; border-radius:inherit;}
form .field textarea::-webkit-input-placeholder { opacity:1; font:var(--p1); color:var(--navy80) !important; padding:0;}
form .field textarea::-moz-placeholder { opacity:1; font:var(--p1); color:var(--navy80) !important; padding:0; border-radius:inherit;}
form .field textarea:-ms-input-placeholder { opacity:1; font:var(--p1); color:var(--navy80) !important; padding:0; border-radius:inherit;}
form .field textarea:-moz-placeholder { opacity:1; font:var(--p1); color:var(--navy80) !important; padding:0; border-radius:inherit;}


/* RESULTS HERO 
======================================================= */
.results-hero{padding:calc(var(--ss)*131vw) 0 calc(var(--ss)*235vw)}
.results-hero .risk-dial,
.results-hero h1{margin-bottom:var(--spacing-4);}
.results-hero p{max-width:calc(var(--ss)*396vw); color:var(--navy80); font:var(--p2);}


/* RESULTS BLOCK
======================================================= */
.results-block{margin-bottom:calc(var(--ss)*-120vw);}
.results-block .inner{transform:translateY(calc(var(--ss)*-177vw));}
.results-block .card{ padding:var(--spacing-4); border:calc(var(--ss)*1vw) solid var(--black10); }

.results-block .card-left{padding-top:var(--spacing-4);}
.results-block .card-left h3{font:var(--question); margin-bottom:var(--spacing-2);}
.results-block .card-left p{margin-bottom:var(--spacing-6);}
.results-block .card-left .btn{margin-bottom:var(--spacing-4);}
.results-block .card-left a.icon-question{letter-spacing:0.0125rem; color:var(--navy80) }

@media(min-width:769px){
	.results-block{margin-bottom:calc(var(--ss)*-50vw);}
	.results-block .card{width:calc(50% - calc(var(--ss)*8.1vw)); min-height:calc(var(--ss)*375vw);padding:var(--spacing-4) var(--spacing-4) var(--spacing-8) var(--spacing-7);}
	.results-block .card-right{width:calc(var(--ss)*156vw);}
	.results-block .card-left{width:calc(var(--ss)*344vw); padding-top:var(--spacing-7);}
	
}

/* LIFESTYLE BLOCK
======================================================= */
.lifestyle-block{padding:var(--spacing-r-6) 0}

.lifestyle-block .column-left{max-width:calc(var(--ss)*470vw); width:100%;}
.lifestyle-block .column-right{max-width:calc(var(--ss)*664vw); width:100%;}

.lifestyle-block .column-left h2{margin-bottom:var(--spacing-4);}
.lifestyle-block .column-left p{margin-bottom:var(--spacing-6); max-width:calc(var(--ss)*348vw)}

.lifestyle-block .column-left .btn{margin-bottom:var(--spacing-4);}

.lifestyle-block .column-left a.icon-edit{letter-spacing:0.0125rem; color:var(--navy80) }

.lifestyle-overview{padding:var(--spacing-7) var(--spacing-r-1); margin-bottom:var(--spacing-2);}

.lifestyle-block .score-card .your-score{font-weight:600;letter-spacing: 0.07rem;line-height:1em;margin-bottom: 0}
.lifestyle-block .score-card .score{font-weight:700;font-size:calc(var(--ss)*100vw);line-height:1em; margin-bottom:0;}
.lifestyle-block .score-card .out-of{color:var(--navy70); font-weight: 600; font-size:calc(var(--ss)*18vw) }

.breakdown-card{width:100%; padding:var(--spacing-4)}
.breakdown-card p{margin-bottom:0;}
.breakdown-card p.category{font-weight:600; letter-spacing:0.07rem; text-transform: uppercase; margin-bottom:var(--spacing-2);}
.breakdown-card p.value{font-weight:600; font-size: calc(var(--ss)*18vw); color:var(--navy70); line-height:calc(var(--ss)*18vw);}


@media(min-width:769px){
	.breakdown-card{width:calc(50% - calc(var(--ss)*4.1vw))}
}


/* SHARE BLOCK
======================================================= */
.share-block{padding:var(--spacing-r-3) 0;}
.share-block .column-left{max-width:calc(var(--ss)*438vw);}
.share-block h2{margin-bottom:var(--spacing-4);}

@media(max-width:768px){
	.share-block .column-left, .share-block .column-right{width:100%;}
}

/* SAVE BLOCK
======================================================= */
.save-block{padding:var(--spacing-r-5) 0;}
.save-block .column-left{max-width:calc(var(--ss)*371vw);}
.save-block h2{margin-bottom:var(--spacing-2);}

.save-block .column-right{max-width:calc(var(--ss)*566vw);width:100%;}

.save-block form{width:100%;}

.save-block form input{background:var(--white)}

.save-block .btn[type="submit"]{height:calc(var(--ss)*56vw)}

.save-block .btn + .btn{margin-top:var(--spacing-2);}


@media(min-width:769px){
	
}


/* EDUCATION HUB
======================================================= */


/* TABBED HERO
======================================================= */
.tabbed-hero-block{padding:calc(var(--ss)*170vw) 0 var(--spacing-6)}

.tabbed-hero-block .hero-content img{max-width:1; width:100%; height:calc(var(--ss)*410vw); object-fit:cover; border-radius:var(--radius-m)}

.tabbed-hero-block .hero-content .left-column{max-width:calc(var(--ss)*373vw); width:100%;}
.tabbed-hero-block .hero-content .left-column{max-width:calc(var(--ss)*368vw); width:100%;}

.tabbed-hero-block a.icon-arrow-left{ font:var(--p2); line-height:1em; font-weight: 600; color:var(--navy80);margin-bottom:var(--spacing-1);}

.tabbed-hero-block h1{margin-bottom:var(--spacing-4);}

.tabbed-hero-block .hero-tabs{margin-top: var(--spacing-r-4);}

.tabbed-hero-block .hero-tabs .tabs-wrap{padding:var(--spacing-3)}

.tabs-wrap .tab{height:calc(var(--ss)*56vw); display:flex; justify-content: center; align-items:center; width:fit-content; border-radius:var(--radius-l); font:var(--btn); padding:0 var(--spacing-5); transition:0.3s all; color:var(--navy80)}
.tabs-wrap .tab.active{background:var(--navy); color:var(--white);}
.navy-bg .tabs-wrap .tab{color:var(--white);}
.navy-bg .tabs-wrap .tab.active{background:var(--white); color:var(--navy);}

@media(max-width:768px){
	.tabs-wrap .tab{width:50%;}
}


/* MAIN SECTION
======================================================= */
.main-section{padding:var(--spacing-r-4) 0;}
.main-section.has-side-column .main-content{max-width:calc(var(--ss)*763vw);}

.main-section .side-content{max-width:calc(var(--ss)*276vw);}
.main-section .side-content img{height:calc(var(--ss)*170vw); object-fit: cover; margin-bottom:var(--spacing-4);}
.main-section .side-content a span{font:var(--btn);}
.main-section .side-content a:not(:last-child){margin-bottom:var(--spacing-6);}

.main-content section:not(:last-child){margin-bottom:var(--spacing-r-3);}
.main-content section h2{margin-bottom:var(--spacing-4);}

.content-block h2 + .repeatables,
.content-block .copy + .repeatables{margin-top:var(--spacing-6);}

.content-block h2 + h3,
.content-block .copy + h3{margin-top:var(--spacing-7);}

.content-block h3 + .repeatables{margin-top:var(--spacing-4)}

.content-block .repeatables + h3,
.content-block .repeatables + .repeatables{margin-top:var(--spacing-7);}

.content-block .repeatables{counter-reset:repeatable;}

.content-block .text-card{padding:var(--spacing-5) var(--spacing-5) var(--spacing-6); width:100%;}
.content-block .text-card:not(:last-child){margin-bottom:var(--spacing-2)}
.content-block .text-card h3{margin-bottom:var(--spacing-3);}

.content-block .repeatables.type-image-text .text-card{display: flex; align-items: center; padding:var(--spacing-4); }
.content-block .repeatables.type-image-text .text-card img{width:calc(var(--ss)*100vw); height:calc(var(--ss)*100vw); margin-right: var(--spacing-6);}
.content-block .repeatables.type-image-text h4{font:var(--h3)}
.content-block .repeatables.type-image-text .text-card h3 { min-width: 40%; }

.content-block .repeatables.type-numbered-list .text-card{display: flex; align-items: flex-start; padding:var(--spacing-4) var(--spacing-5); }
.content-block .repeatables.type-numbered-list .text-card:before{counter-increment: repeatable; content:counter(repeatable); display:flex; width:calc(var(--ss)*40vw); min-width:calc(var(--ss)*40vw); height:calc(var(--ss)*40vw); background:var(--white); border-radius: var(--radius-l); align-items: center; justify-content: center; font:var(--h4); line-height:1em; margin-right:var(--spacing-3);}

.content-block .repeatables.type-numbered-list .text-card > div{padding-top: var(--spacing-2);}
.content-block .repeatables.type-numbered-list h4 + p{margin-top:var(--spacing-3);}

@media(max-width:768px){
	.content-block .repeatables.type-image-text .text-card{padding:var(--spacing-3); flex-direction: column;  }
	.content-block .repeatables.type-image-text .text-card img{margin-right:0; margin-bottom:var(--spacing-2);}
	
	.content-block .repeatables.type-numbered-list .text-card{padding:var(--spacing-3); flex-direction: column }
	.content-block .repeatables.type-numbered-list .text-card:before{display:flex; width:calc(var(--ss)*30vw); min-width:calc(var(--ss)*30vw); height:calc(var(--ss)*30vw);margin-right:var(--spacing-2);}
	
	.content-block h3 br{display: none;} 
}

@media(min-width:769px){
	.content-block .repeatables.cols-2{gap:var(--spacing-2) var(--spacing-3);}
	.content-block .repeatables.cols-2 .text-card{width:calc(50% - calc(var(--ss)*7vw)); margin-bottom:0;}
}



/* HEADER SELECT (LANGUAGE)
======================================================= */
header .field .dropdown{display:flex;align-items: center; border:0; width:100%; font:var(--p1); color:var(--navy); outline:0;}
header .field select{display:none !important}

header .field .dropdown{position: relative; z-index:1000; cursor:pointer; justify-content: space-between}
header .field .dropdown .default-text span,
header .field .dropdown .default-text{font-weight:600}
header .field .dropdown .menu{position: absolute; top:calc(var(--ss)*26vw); right:0; background:var(--white); z-index:10000; overflow:hidden; height:fit-content; max-height:0px; transition:0.3s all; width:100%; min-width:fit-content;}
header .field .dropdown.active .menu{max-height:calc(var(--ss)*900vw); border:calc(var(--ss)*1vw) solid var(--grey20);}
header .field .dropdown .menu li{background:rgba(244,245,247,0.5); cursor: pointer; display:flex; align-items: center; padding:var(--spacing-2) var(--spacing-4);min-width: max-content;}
header .field .dropdown .menu li:hover{background:rgba(244,245,247,0.8);}
header .field .dropdown .menu li.selected{background:var(--grey20);}

header .field .dropdown .dropdown-icon{width:var(--icon-size); height:var(--icon-size); background:url('../images/icons/Chevron-down.svg') center / contain no-repeat; transition:0.3s transform;}
header .field .dropdown.active .dropdown-icon{transform:scaleY(-1)}
.globe { font-family: "Segoe UI Symbol", "Noto Sans Symbols", sans-serif; }
@media(max-width:768px){
	header .mob-flex-column.gap-8 > :not(:last-child){ margin-bottom:var(--spacing-1);}
	.home-hub-block{padding-top:calc(var(--header-height) + var(--spacing-2))}
	.questionnaire-block { margin-top: calc(var(--header-height) / 1.5); }
}

.loader { transition: 2s filter linear; filter: blur(0); }
.loading { filter: blur(10px); }