/**
 * Un-minified source CSS.
 *
 * TODO: There is still a lot of copy/paste CSS from the 2019 era (earlier?) design.
 * PLEASE to avoid confusion, remove those from this file AND from the HTML on the site
 * 2025-11-10
 */

/* ============================================================= */
/*  ASTQB 2025 – FINAL, CLEAN, PORTABLE CSS                    */
/*  1. Full 144-column Gutenberg grid (wins every time)        */
/*  2. All your custom buttons, heroes, videos, parallax       */
/*  3. No duplicates | No syntax errors | Mobile-first         */
/* ============================================================= */

/* ==================================================================
	 1. FULL GUTENBERG GRID – 144 CLASSES (sm/md/lg/xl)
	 ================================================================== */
/* ============================================================= */
/*  ASTQB.ORG LIVE GRID — COPY-PASTED FROM THEIR SERVER        */
/*  2 × gi-md-6 = PERFECT 50%/50% + 30px gap                   */
/*  ZERO line-breaks. Works on EVERY page.                     */
/* ============================================================= */

*,*::before,*::after{box-sizing:border-box}

.g{
	display:flex;
	flex-wrap:wrap;
	margin-right:-15px;
	margin-left:-15px;
	font:bold;
}
.g>[class*=gi]{
	position:relative;
	width:100%;
	padding-right:15px;
	padding-left:15px;
}

.gi-m {
	margin-left: 0;
	margin-right: 0;
}

.gi-ml-lg {
	margin-left: 2%;
}

/* MOBILE = FULL */
.gi{flex:0 0 100%;max-width:100%}

/* ≥576px */
@media(min-width:576px){
	.gi-sm-1,.gi-sm-2,.gi-sm-3,.gi-sm-4,.gi-sm-5,.gi-sm-6,
	.gi-sm-7,.gi-sm-8,.gi-sm-9,.gi-sm-10,.gi-sm-11,.gi-sm-12{
	flex:0 0 auto;max-width:none
	}
	.gi-sm-1, .gi-1{flex:0 0 8.33333333%;max-width:8.33333333%}
	.gi-sm-2, .gi-2{flex:0 0 16.66666667%;max-width:16.66666667%}
	.gi-sm-3, .gi-3{flex:0 0 25%;max-width:25%}
	.gi-sm-4, .gi-4{flex:0 0 33.33333333%;max-width:33.33333333%}
	.gi-sm-5, .gi-5{flex:0 0 41.66666667%;max-width:41.66666667%}
	.gi-sm-6, .gi-6{flex:0 0 50%;max-width:50%}
	.gi-sm-7, .gi-7{flex:0 0 58.33333333%;max-width:58.33333333%}
	.gi-sm-8, .gi-8{flex:0 0 66.66666667%;max-width:66.66666667%}
	.gi-sm-9, .gi-9{flex:0 0 75%;max-width:75%}
	.gi-sm-10, .gi-10{flex:0 0 83.33333333%;max-width:83.33333333%}
	.gi-sm-11, .gi-11{flex:0 0 91.66666667%;max-width:91.66666667%}
	.gi-sm-12, .gi-12{flex:0 0 100%;max-width:100%}
}

/* ≥768px — THIS IS THE ONE THAT FIXES YOUR 50% */
@media(min-width:768px){
	.gi-md-1{flex:0 0 8.33333333%;max-width:8.33333333%}
	.gi-md-2{flex:0 0 16.66666667%;max-width:16.66666667%}
	.gi-md-3{flex:0 0 25%;max-width:25%}
	.gi-md-4{flex:0 0 33.33333333%;max-width:33.33333333%}
	.gi-md-5{flex:0 0 41.66666667%;max-width:41.66666667%}
	.gi-md-6{flex:0 0 50%;max-width:50%}
	.gi-md-7{flex:0 0 58.33333333%;max-width:58.33333333%}
	.gi-md-8{flex:0 0 66.66666667%;max-width:66.66666667%}
	.gi-md-9{flex:0 0 75%;max-width:75%}
	.gi-md-10{flex:0 0 83.33333333%;max-width:83.33333333%}
	.gi-md-11{flex:0 0 91.66666667%;max-width:91.66666667%}
	.gi-md-12{flex:0 0 100%;max-width:100%}
}

/* ≥992px */
@media(min-width:992px){
	.gi-lg-1{flex:0 0 8.33333333%;max-width:8.33333333%}
	.gi-lg-2{flex:0 0 16.66666667%;max-width:16.66666667%}
	.gi-lg-3{flex:0 0 25%;max-width:25%}
	.gi-lg-4{flex:0 0 33.33333333%;max-width:33.33333333%}
	.gi-lg-6{flex:0 0 50%;max-width:50%}
	.gi-lg-8{flex:0 0 66.66666667%;max-width:66.66666667%}
	.gi-lg-9{flex:0 0 75%;max-width:75%}
	.gi-lg-12{flex:0 0 100%;max-width:100%}
}

/* ≥1200px */
@media(min-width:1200px){
	.gi-xl-1{flex:0 0 8.33333333%;max-width:8.33333333%}
	.gi-xl-2{flex:0 0 16.66666667%;max-width:16.66666667%}
	.gi-xl-3{flex:0 0 25%;max-width:25%}
	.gi-xl-4{flex:0 0 33.33333333%;max-width:33.33333333%}
	.gi-xl-6{flex:0 0 50%;max-width:50%}
	.gi-xl-8{flex:0 0 66.66666667%;max-width:66.66666667%}
	.gi-xl-9{flex:0 0 75%;max-width:75%}
	.gi-xl-12{flex:0 0 100%;max-width:100%}
}

/* ==================================================================
	 2. BASE TYPOGRAPHY & LAYOUT
	 ================================================================== */
body {
	margin:0;
	color:#585661;
	font-family:IBMPlexSans-Regular,system-ui,sans-serif;
	font-size:16px;
	line-height:1.5;
	background:#fff;
}
a {
	color:#2e84cd;
	text-decoration:none;
	text-decoration-skip-ink:auto;
	transition:color .15s ease;
}
a:hover { color:#1a5eab; }
ul { list-style:square; padding-left:1.1em; }
li { margin:.5em 0; }

ol {list-style: decimal;padding-left: 1.1em;}





/* Universal fix for huge ™/® in headings (perfect for BlankSlate) */
h1.white sup {
    font-size: 0.35em !important;
    vertical-align: super;
    position: relative;
    top: -0.8em!important;
    line-height: 0;
}



blockquote {
	border-top: 1px solid #e5e5e5;
	border-bottom: 1px solid #e5e5e5;
	margin: 2em 0;
	padding: 1em 2em;
	font-size:1rem;
}
img { max-width:100%; height:auto;  }
.wp-block-image.is-resized img { width:auto; }
hr {
	border: 0;
    border-top: 1px solid #666;
    margin: 2.1rem 0;
 }
.hr3 {margin: 1em 0;}

strong {
	font-weight: 700 !important;
}

.aligncenter, .alignleft, .alignright {
    text-align: center !important;
}

.resources-plus img {display:none}

.c-main_nav__search {
	background-image: url(/assets/img/icon-search.svg);
	background-position: 20px;
	background-repeat: no-repeat;
	padding: 1.25rem 1.5rem 1.25rem 0;
	cursor: pointer;
}

.border-radius {
	border-radius:35px;
} 

/* ==================================================================
	 3. HEADINGS & HERO TEXT
	 ================================================================== */
h1 { font-size:3rem; line-height:3rem; font-family:"Urbanist",sans-serif; font-optical-sizing:auto; font-weight:700; margin:2rem 0 1rem; }
h1 .larger-hero { font-size:10rem; line-height:8rem; }
h1 .larger-hero-b { font-size:7rem; line-height:8rem; }

h1 .smaller-hero { font-size:3rem; line-height:3rem; }
h2 { font-family:"Urbanist",sans-serif; font-size:2.2rem; line-height:2.625rem; font-weight:700; margin:2rem 0 1rem;color:#211966; }
h2.larger { font-size:6rem; line-height:6rem; }
h3 { font-size:1.6rem; margin:1.5rem 0 .75rem; font-weight:600; }
h5 { font-size:.8rem; font-weight:normal; text-transform:uppercase; }
.hero h3 { font-size:1.3rem; }

.c-rich_text h2 {
	font-size: 1.75rem;
	line-height: 2.375rem;
	margin: 0 0 2rem 0;
}

.c-segue {
	border-bottom: .0625rem solid #f0f0f0;
	margin-bottom: 1.5rem;
	padding-bottom: 1rem;
}

img.border-radius: {border-radius: 2rem;}


.c-listb img {
    -webkit-box-shadow: 0 2px 10px 2px rgba(0, 0, 0, .1);
    box-shadow: 0 2px 10px 2px rgba(0, 0, 0, .1);
    border-radius: .5rem;
}



/* ==================================================================
	 4. COLOR HELPERS
	 ================================================================== */
.white { color:#fff; }
.red   { color:#e54759; }
.blue, .dk-blue { color:#211966; }
.text-light-blue { color:#9fddff; }
.white-bg { background:#fff; }
.red-bg   { background:#e54759; }
.blue-bg, .dk-blue-bg { background:#020531; color:#fff; }
.light-blue-bg { background:#EAF3FA; }
.blue-gradient-bg {
	background:#211966;
	background:linear-gradient(180deg,rgba(33,25,102,1) 0%,rgba(13,17,22,1) 100%);
}

/* ==================================================================
	 5. SPACING & LAYOUT
	 ================================================================== */
.u-mb-4 { margin-bottom:2rem; }
.u-mt-4 { margin-top:2rem; }
.section-padding { padding-top:6rem; padding-bottom:6rem; }
.vert-center { display:flex; flex-direction:column; justify-content:center; }
.section-padding-2 {padding-top: 3rem;padding-bottom: 3rem;}
p { padding-bottom: 1rem }

.no-box ul {
	list-style: none;
    padding-left: 0;

}
/* ==================================================================
	 6. HEADER / FOOTER
	 ================================================================== */
.c-header {
	background:#fff;
	padding:1.25rem 0;
	z-index:9;
	transition:all .3s ease;
}
footer {
	background:#343a40;
	color:#fff;
	padding:3rem 0;
}
footer a { color:#adb5bd; }
footer a:hover { color:#fff; }

footer ul {
	list-style: none;
}

footer .menu-title {
	font-weight:700;
	color:#ffffff;
	font-size: 1rem;
	font-style: uppercase;
	padding-left: 1.1em;
}

footer ul li {
	border-bottom: 1px solid #393b53;
	padding-top: 0px;
	font-size: .9rem;
	padding-bottom: 10px;
}

	    ul.sample-e {list-style: none;padding:0}


/* ==================================================================
	 7. BUTTONS (all 8 styles)
	 ================================================================== */
.btn {
	display:inline-block;
	padding:.75rem 1.5rem;
	margin:.35rem 0;
	border-radius:.35rem;
	font-weight:600;
	text-align:center;
	text-decoration:none;
	cursor:pointer;
	transition:all .2s;
}

.c-button, .c-button--grad-pink:hover, .custom-button-blue:hover  { background:#004c99; border-color:#004c99; }
.c-button, .c-button--grad-pink, input.c-button--grad-pink, .c-button--pink, .custom-button-blue-outline { background:transparent; color:#0066cc; border:2px solid #0066cc; }
.custom-button-blue-outline:hover  { 
	border-radius:1.3rem;
	padding:.6rem 2rem .6rem 1.4rem;
	background:#1A3598;
	background:linear-gradient(90deg,rgba(26,53,152,1) 0%,rgba(18,90,217,1) 92%,rgba(13,110,253,1) 100%); color:#fff; }
.custom-button-grey-outline        { margin-top:10px;background:transparent; color:#555; border:2px solid #aaa; }
.custom-button-grey-outline:hover  { background:#aaa; color:#fff; }

.certs .c-button--pink {display: block; font-size: .8rem}

.small-links {margin-bottom:0}

.small {margin-top:10px;}

.cert-links a {display:block;}

.gform_button.button, .cert-links a.custom-button-blue {color:#ffffff;}
.gform_wrapper .gform_footer input.button, .gform_wrapper .gform_footer input[type=submit] {
	background:#004c99; border-color:#004c99;
	border-radius: 1.3rem; padding: .6rem 2rem .6rem 1.4rem;
}



.dropdown-toggle::after {
	display: none;
}


.gform_button.button, .custom-button-blue, .custom-button-blue-outline, .custom-button-grey-outline, .c-button, input.c-button--grad-pink, .c-button--pink, .c-button--grad-pink   {
	padding:.6rem 2rem .6rem 1.4rem;
	margin: .35rem 0;
	border-radius:1.3rem;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: all .2s;
	display: inline-block;
}

.btn.btn-primary {
	position:relative;
	border-radius:1.3rem;
	padding:.6rem 2rem .6rem 1.4rem;
	background:#1A3598;
	background:linear-gradient(90deg,rgba(26,53,152,1) 0%,rgba(18,90,217,1) 92%,rgba(13,110,253,1) 100%);
}


.custom-button-blue {
	border-radius:1.3rem;
	padding:.6rem 2rem .6rem 1.4rem;
	background:#1A3598;
	background:linear-gradient(90deg,rgba(26,53,152,1) 0%,rgba(18,90,217,1) 92%,rgba(13,110,253,1) 100%);
}

.btn.btn-primary::after {
	content: '≫';
	position:absolute;
	right:10px;
	top:50%;
	transform:translateY(-50%);
	font-size:.9em;
}
.btn.btn-primary.reverse:before {
	content:"";
	position:absolute;
	inset:0;
	padding:2px;
	background:linear-gradient(#fff,#9fddff);
	border-radius:inherit;
	mask:conic-gradient(#000 0 0) content-box exclude,conic-gradient(#000 0 0);
}

.gform_button.button:hover, .btn.btn-primary:hover, .custom-button-blue:hover {
background: rgb(52, 78, 65);
background: linear-gradient(180deg, rgba(20, 29, 58, 1) 2%, rgba(13, 110, 253, 1) 100%);
text-shadow: 2px 2px 2px #666666;
}



/* ==================================================================
	 8. HERO SECTION
	 ================================================================== */
.hero-section {
	position:relative;
	min-height:100vh;
	display:flex;
	align-items:center;
	justify-content:center;
	text-align:center;
	color:#fff;
	overflow:hidden;
}
.hero-section video,
.hero-overlay {
	position:absolute;
	top:0; left:0;
	width:100%; height:100%;
	object-fit:cover;
	z-index:-1;
}
.hero-overlay { background:rgba(0,0,0,.5); }
.hero-section h1 { font-size:3.5rem; margin-bottom:1rem; }
.hero-section p  { font-size:1.25rem; margin-bottom:2rem; }

.inside-hero-cont.certification-hero {
	background-image: url(https://astqb.org/assets/images/certification-hero-landing-image.jpg);
}

.inside-hero-cont.resources-hero {
	background-image: url(https://astqb.org/assets/images/square-1.jpg);
}

.inside-hero-cont.register-hero {
	background-image: url(https://astqb.org/assets/images/square-2.jpg);
}

.inside-hero-cont.benefits-hero {
	background-image: url(https://astqb.org/assets/images/benefits-landing-hero.jpg);
}

.inside-hero-cont {
	aspect-ratio: 1 / 1;
	background-size: cover;
	border-radius: 2rem;
	overflow: hidden;
}

/* ==================================================================
	 9. CARDS & HOVER
	 ================================================================== */
.card {
	border:none;
	background:#fff;
	box-shadow:1px 1px 5px 0px rgba(0,0,0,.25);
	border-radius:.75rem;
	overflow:hidden;
	transition:transform .2s;
}
.card:hover,
.feature-card:hover,
.news-card:hover { transform:translateY(-10px); }
.feature-card,
.news-card {
	padding:2rem;
	text-align:center;
}
.card-white-tr { background:#ffffff99; }
.link-card-nounderline { text-decoration:none; }
.link-card-nounderline:hover .card {
	background:#F4F9FC;
	background:linear-gradient(180deg,rgba(244,249,252,1) 0%,rgba(255,255,255,1) 100%);
	cursor:pointer;
}


.offer-cert-landing {
	background-color: #f2f2f2;
	border-radius: 1rem;
}

.lt-blue-gradient {
	background: #F4F9FC;
	background: linear-gradient(180deg, rgba(244, 249, 252, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

.c-text_banner__description {
	font-size: 1.25rem;
	line-height: 2rem;
	/* margin: 0 auto; */
	max-width: 100%;
}


/* ==================================================================
	 10. CIRCLES, HORIZONTAL, PARALLAX
	 ================================================================== */
.circle-card-image-sidebar {
		aspect-ratio: 1/1;
		width: 75px;
		border-radius: 50%;
		background-size: cover;
		}

.circle-card-image { aspect-ratio:1/1; width:200px; border-radius:50%; max-width:100%; }
.circle-one   { background:url(https://astqb.org/assets/images/circle-one.jpg) center/cover; }
.circle-two   { background:url(https://astqb.org/assets/images/circle-two.jpg) center/cover; }
.circle-three { background:url(https://astqb.org/assets/images/circle-three.jpg) center/cover; }
.circle-four  { background:url(https://astqb.org/assets/images/circle-four.jpg) center/cover; }

.sidebar-circle-1 {
	background-image: url(https://astqb.org/assets/images/sidebar-circle-1.jpg);
}

.sidebar-circle-2 {
	background-image: url(https://astqb.org/assets/images/sidebar-circle-2.jpg);
}

.sidebar-circle-3 {
	background-image: url(https://astqb.org/assets/images/sidebar-circle-3.jpg);
}

.sidebar-circle-4 {
	background-image: url(https://astqb.org/assets/images/sidebar-circle-4.jpg);
}

.sidebar-circle-5 {
	background-image: url(https://astqb.org/assets/images/sidebar-circle-5.jpg);
}

.horizontal-hp-1,
.horizontal-hp-2,
.horizontal-hp-3 {
	aspect-ratio:4/1;
	background:center/cover;
}
.horizontal-hp-1 { background-image: url(https://astqb.org/assets/images/photo-placeholder-horizonal.jpg);}
.horizontal-hp-2 { background-image:url(https://astqb.org/assets/images/photo-placeholder-horizonal2.jpg); }
.horizontal-hp-3 { background-image:url(https://astqb.org/assets/images/photo-placeholder-horizonal3.jpg); }

.hero-image-cont {
	aspect-ratio:1/1;
	background:center/cover;
	border-radius:2rem;
	overflow:hidden;
}
.hero-image-cont { background-image:url(https://astqb.org/assets/images/hero-image.jpg); }
.hero-image-cont.hero2 { background-image:url(https://astqb.org/assets/images/hero2.jpg); }
.hero-image-cont.hero3 { background-image:url(https://astqb.org/assets/images/hero3.jpg); }
.hero-image-cont.hero4 { background-image:url(https://astqb.org/assets/images/hero4.jpg); }
.free-extras {background-image:url(https://astqb.org/assets/images/photo-bg-placeholder-left1b.jpg)}


.parallax-image-cont { overflow:hidden; }
.rellax-img { position:absolute; z-index:-1; top:75%; width:130%; }
.rellax-img.rellax2 { top:85%; }

.extra-grid-img-cont {
	aspect-ratio:4/2;
	height:100px;
	margin:1rem 0;
	text-align:center;
}
.extra-grid-img-cont img { max-height:100%; width:auto; }

/* ==================================================================
	 11. VIDEO GALLERY
	 ================================================================== */
.video-section .video-gallery {
	display:flex;
	gap:16px;
	overflow-x:auto;
	padding:0 16px;
	scroll-behavior:smooth;
	scrollbar-width:none;
}
.video-section .video-gallery::-webkit-scrollbar { display:none; }
.video-section .video-item { flex:0 0 calc(33.333% - 11px); max-width:calc(33.333% - 11px); }
.video-section .video-wrapper {
	position:relative;
	padding-bottom:56.25%;
	height:0;
	overflow:hidden;
}
.video-container iframe {
    aspect-ratio: 16 / 9;
    	position: relative;
    width: 100%;
    height:auto;
    max-width: 650px;
    border: 2px solid #6666;
    border-radius: 20px;

}
.video-section .scroll-arrow {
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	background:rgba(0,0,0,.5);
	color:#fff;
	border:none;
	border-radius:50%;
	padding:10px;
	font-size:24px;
	cursor:pointer;
	z-index:10;
}
.video-section .scroll-left  { left:10px; }
.video-section .scroll-right { right:10px; }
.video-section .scroll-arrow:hover { background:rgba(0,0,0,.8); }

/* ==================================================================
	 12. BOXES, TABLES, LISTS
	 ================================================================== */
.wp-block-mytheme-boxed-area-np,
.c-list,
.box {
	padding:2rem;
	margin:2rem 0;
	border:none;
	background:#fff;
	box-shadow:1px 1px 5px 0px rgba(0,0,0,.25);
	border-radius:.75rem;
	transition:transform .2s;
}
.c-tile--deep_blue {
	background:#e3f2fd;
	padding:1.5rem 2rem;
}
.wp-block-table {
	width:100%;
	border-collapse:collapse;
	margin:2rem 0;
}
.wp-block-table td {
	border:1px solid #ddd;
	padding:.75rem;
	vertical-align:top;
}
.is-style-stripes tr:nth-child(even) { background:#f9f9f9; }

.c-reg_card {
	border:.0625rem solid #e54759;
	border-radius:.5rem;
	box-shadow:0 2px 10px 2px rgba(0,0,0,.1);
	padding:4rem;
	text-align:center;
	margin-bottom:1.25rem;
}

.wp-block-table td {
	border: 1px solid #ddd;
	padding: .75rem;
	vertical-align: top;
}

.certification .table-info table td {
		margin-bottom: 10px;
		text-align: center;
		font-weight: 300;
		color: #fff;
		background-color: #020233;
		border-radius: 8px;
		padding: 25px;
}

.c-tile--deep_blue {
	background: #020233;
	border-radius: .5rem;
	color: #fff;
	padding: 15px;
	font-size: .8rem;
	text-align: center;
}

/* ==================================================================
	 13. NAV & MEGA MENU
	 ================================================================== */
.nav-link {
	color:#211966;
	font-family:IBMPlexSans-Medium,sans-serif;
	font-weight:500;
	font-size:.9rem;
	letter-spacing:.0625rem;
}
.side-info { font-size:.8rem; }
.side-info a { color:#9fd3ff; }
ul.dropdown-menu ul,
ul.small-links { list-style:none; padding-left:0; }
ul.dropdown-menu ul li { font-size:.9rem; }
ul.small-links li { display:inline; font-size:.7rem; padding:5px; }

@media (min-width:992px) {
	.mega-menu {
	width:100%;
	padding:20px;
	background:#fff;
	box-shadow:0 8px 16px rgba(0,0,0,.1);
	}
	.navbar .megamenu { left:0; right:0; width:100%; margin-top:0; }
	.mega-menu .row { column-gap:20px; }
	.mega-menu .col { flex:1 1 auto; padding:10px; }
	.mega-menu .submenu-heading { font-weight:bold; color:#333; margin-bottom:10px; }
	.mega-menu .submenu-item { display:block; padding:5px 0; color:#666; text-decoration:none; }
	.mega-menu .submenu-item:hover { color:#000; }
	.navbar-nav .dropdown-menu { padding:0; border-left:0; border-right:0; border-radius:0; }
	li.dropdown { position:static; }
}

/* ==================================================================
	 14. SPECIAL FONT BLOCKS & ICONS
	 ================================================================== */
.c-image_segue__label {
	color:#e54759;
	font-family:IBMPlexSans-Medium,sans-serif;
	font-size:.8125rem;
	font-weight:500;
	margin:0 0 .25rem 0;
}
.c-image_segue__heading { font-size:1.25rem; }
.c-footer__heading {
	color:#d2eefb;
	font-family:IBMPlexSans-Medium,sans-serif;
	font-size:1em;
	font-weight:500;
	letter-spacing:.0625rem;
	margin-bottom:.5rem;
}
.c-text_banner__heading {
	color:#211966;
	font-family:IBMPlexSans-Medium,sans-serif;
	font-size:2rem;
	font-weight:500;
	line-height:2.625rem;
	margin:0 auto 1.25rem;
	max-width:50rem;
}
.c-image_segue__icon {
	position:absolute;
	bottom:1.25rem;
	right:1.25rem;
	width:1rem;
	height:1rem;
}
.c-main_nav__search {
	background:url(/assets/img/icon-search.svg) 20px no-repeat;
	padding:1.25rem 1.5rem 1.25rem 0;
	cursor:pointer;
}

.c-main_nav__search a, .c-main_nav__search a:hover{color:transparent!important;}

.u-case { text-transform:uppercase; }

.vert-center {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: center;
}

.quote-pre-line {
	text-transform: uppercase;
	font-size: 13px;
	letter-spacing: 1px;
}

.quote {
	border-top: 1px solid #9fddff;
	border-bottom: 1px solid #9fddff;
	padding: 1.2rem .4rem;
}

/* ==================================================================
	 15. LOGOS & TESTIMONIALS
	 ================================================================== */
.logo-section img {
	max-height:50px;
	margin:1rem;
	filter:grayscale(100%);
	transition:filter .3s;
}
.logo-section img:hover { filter:grayscale(0); }
.testimonial-section {
	background:#f8f9fa;
	text-align:center;
}
.testimonial-section blockquote {
	font-size:1.5rem;
	font-style:italic;
	margin-bottom:1rem;
}

/* ============================================================= */
/*  ASTQB WHITE-PAPER FORM – 100 % LIVE COPY (Nov 5, 2025)     */
/*  Works on ANY site. No Bootstrap. Zero missing pixels.      */
/* ============================================================= */

/* 1. FORM CONTAINER */
.well, #interstitial {
	background:#fff;
	padding:2.5rem;
	border-radius:1rem;
	box-shadow:0 10px 30px rgba(0,0,0,.12);
	max-width:520px;
	margin:2rem auto;
	border:1px solid #e2e8f0;
}

/* 2. LABELS */
.c-form__label, label {
	display:block;
	font-family:IBMPlexSans-Medium,sans-serif;
	font-weight:500;
	font-size:1rem;
	color:#211966;
	margin-bottom:.5rem;
}

.gform_wrapper.gravity-theme .gfield_required {
	color: #c02b0a;
	display: inline-block;
	font-size: 13.008px;
	padding-inline-start: 0.125em;
}

/* 3. INPUTS & SELECT */
.form-control, input[type=text], input[type=email], select {
	width:100%;
	padding:.75rem 1rem;
	font-size:1rem;
	line-height:1.5;
	color:#333;
	background:#fff;
	border:2px solid #cbd5e0;
	border-radius:.75rem;
	transition:all .2s ease;
}
.form-control:focus, input:focus, select:focus {
	outline:none;
	border-color:#0066cc;
	box-shadow:0 0 0 4px rgba(0,102,204,.15);
}

li.gfield {border:0}

.ginput_container input {padding:15px!important}

.ginput_container textarea {
	padding:15px!important;
    border-radius: 9px;
}

.gform-field-label {display:contents;}


/* 4. SELECT ARROW */
select.form-control {
	appearance:none;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23333' d='M0 0l6 8 6-8z'/%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right 1rem center;
}

/* 5. CHECKBOX */
.checkbox {
	font-size:.95rem;
	line-height:1.4;
}
.checkbox input[type=checkbox] {
	margin-right:.5rem;
	width:1.1rem;
	height:1.1rem;
	accent-color:#e54759;
}

/* 6. HELP TEXT */
.help-block {
	font-size:.85rem;
	color:#666;
	margin-top:.25rem;
	display:block;
}



/* 8. PARAGRAPHS & SPACING */
.well p {
	margin-bottom:1.5rem;
}
.well p:last-child { margin-bottom:0; }

/* 9. LOGO */
.well img {
	display:block;
	max-height:60px;
	margin:0 auto 1.5rem;
}

/* 10. VERIFICATION BOLD */
.help-block b { color:#211966; font-weight:600; }


/* ==================================================================
	 16. FINAL RESPONSIVE TWEAKS
	 ================================================================== */
@media (max-width:767px) {


	.section-padding { padding-top:4rem; padding-bottom:4rem;}
	.section-padding-2 {padding-top: 3rem;padding-bottom: 3rem;}
	.video-section .video-item { flex:0 0 100%; }

	.wp-block-table td {
	    display:block;
	    }

	    .custom-button-blue, .custom-button-blue-outline, .custom-button-grey-outline, .c-button, input.c-button--grad-pink, .c-button--pink, .c-button--grad-pink {
	        display:block;
	    } 

	    .wp-block-columns-is-layout-flex {
	            flex-wrap: wrap!important;
	            width:100%;
	                    display: block !important;
	    }  

	    .circle-card-image {margin: 10px auto 38px;}
	    .quote-pre-line {text-align: center}

	    .menu-top-menu-container {display:none;} 
	    .free-extras {background-image:none;}
	    .syllabus figure {text-align: center; align-items: center;}
 
    h2.larger  {
    font-size: 3rem;
    line-height: 3rem;
	}

	h2 {
		margin: 0rem 0 1rem;
	}
	h1 { font-size:2.5rem; line-height:4rem; }
	h1 .larger-hero { font-size:4rem; line-height:4rem; }

	h1 .smaller-hero { font-size:2rem; line-height:3rem; }

.wp-block-mytheme-two-column-row img {text-align: center;align-items: center;}

.btn,
.gform_wrapper .gform_footer input.button,
.gform_wrapper .gform_footer input[type=submit],
.gform_button.button,
.btn.btn-primary, 
.custom-button-blue, 
.custom-button-grey-outline,
.c-button,
input.c-button--grad-pink,
.c-button--pink,
.c-button--grad-pink,
.custom-button-blue-outline {display:block;margin-top:10px;margin-bottom:10px;}

}

	@media (min-width: 768px) {
	.table-info table td {
		        background-color: #f2f2f2;
        border-radius: 35px;
        /* padding: 15px; */
        text-align: center;
        font-weight: 700;
        color: #999;
        border: 10px solid #ffffff;
        width:33.333%;
	}

	.get-started-section {
		background-image: url(https://astqb.org/assets/images/cert-left-fade.jpg);
		background-size: cover;
		background-position-y: center;
	}

	.free-extras {
		background-image: url(https://astqb.org/assets/images/photo-bg-placeholder-left1b.jpg);
		background-size: cover;
		background-position-y: center;
	}

	    .alignright {
        float: right;
        margin-left: 10px;
    }

    .alignleft {

    }

    .training-provider{
    	    background-image:url(https://astqb.org/assets/images/photo-bg-placeholder-left2.png);
    	    background-size:cover;
    	    background-position: center;
    }





}

@media (max-width: 600px) {

	
	h1 .larger-hero { 
		font-size:3.5rem; line-height:3.5rem; 
	}

	h1 .larger-hero-b { font-size:3.5rem; line-height:3.5rem; }


	
}


/* 9/16 Video */

.wp-embed-aspect-9-16 iframe {
	max-width: 100%;
    height: auto;
    aspect-ratio: 9 / 16;
}

/* Custom CSS for Mega Menu */
.mega-menu {
	width: 100%;
	padding: 20px;
}

.mega-menu .row {
	column-gap: 0px; /* Adjust spacing between columns */
}

.mega-menu .col {
	flex: 1 1 auto;
}

.mega-menu .submenu-heading {
	font-weight: bold;
	color: #333;
	margin-bottom: 10px;
}

.mega-menu .submenu-item {
	display: block;
	padding: 5px 0;
	color: #666;
	text-decoration: none;
}

.mega-menu .submenu-item:hover {
	color: #000;
}