@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Source+Serif+4:ital,opsz,wght@0,8..60,500;0,8..60,600;1,8..60,500&display=swap');

/*General Section css Start here*/
nav {
	/* background-color: #36b5e9; */
	background-color: #fff;
	padding: 6px 52px !important;
	box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

a {
	text-decoration: none !important;
	color: #000;
}

a:hover {
	color: #000;
}

.btn-primary {
	background-color: #009DDC !important;
	color: white;
	border: none !important;
}

.btn-primary:focus {
	box-shadow: none !important;
}

.btn-secondary:focus {
	box-shadow: none !important;
}


.text-height {
	line-height: 1.8 !important;
}

.theme-bg-color1 {
	background-color: #009DDC;
}

.theme-bg-color2 {
	background-color: #fff;
}

.theme-color1 {
	color: #009DDC;
}

.position-rel {
	position: relative;
	top: 5rem;
}

.header-bg-img {
	/* background-image: url('../images/home-slider-bg-img1.png'); 
  		background-color: #cccccc; */
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
	/* position: absolute;
  		top: 0px; */
	width: 100%;
}

.section-title h2::before {
	content: "";
	position: absolute;
	display: block;
	width: 130px;
	height: 4px;
	background: #ddd;
	top: 100px;
	left: calc(50% - 60px);
}

.section-title h2::after {
	content: "";
	position: absolute;
	display: block;
	width: 50px;
	height: 6px;
	background: #009DDC;
	top: 99px;
	left: calc(50% - 22px);
}

.section-title1 h2::before {
	content: "";
	position: absolute;
	display: block;
	width: 130px;
	height: 4px;
	background: #ddd;
	top: 100px;
	left: calc(50% - 60px);
}

.section-title1 h2::after {
	content: "";
	position: absolute;
	display: block;
	width: 50px;
	height: 6px;
	background: #fff;
	top: 99px;
	left: calc(50% - 22px);
}

hr {
	border: 0;
	clear: both;
	display: block;
	width: 100%;
	background-color: #8679790f;
	height: 2px;
}

.btn-m-w {
	min-width: 90px;
}

.circular_image {
	width: 130px;
	height: 130px;
	background-color: #009DDC;
	border-radius: 50%;
	overflow: hidden;
	margin-top: -50px !important;
}

.circular_image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.btn-group-sm>.btn,
.btn-sm {
	padding: 0.25rem 0.5rem;
	font-size: .875rem;
	line-height: 1.5;
	border-radius: 0.1rem !important;
}

/*General Section css end here*/

/*this css use of font family start here*/
.segoe-regular {
	font-family: 'Montserrat';
}

.segoe-semibold {
	font-family: 'Montserrat';
	font-weight: 600;
}

.segoe-bold {
	font-family: 'Montserrat';
	font-weight: 700;
}

@font-face {
	font-family: "Kruti Dev 010";
	src: url(../font/Kruti_Dev_010.ttf);
}

@font-face {
	font-family: "Kruti Dev 100";
	src: url(../font/Kruti_Dev_100.ttf);
}

/*font family end here*/

/*------------This Css Use Of Header Section Start Here------------ */
#headerNavbar .navbar-dark ul li {
	margin-right: 30px;
}

#headerNavbar .navbar .active a {
	border-bottom: 3px solid #fff;
}

#headerNavbar .navbar .dropdown-menu .dropwon-active a {
	background: #009DDC !important;
	color: white;
	font-size: 16px;
	font-family: segoe-semibold;
}

#headerNavbar #dropItem {
	margin-right: 0px !important;
	font-size: 16px;
	font-family: segoe-semibold;
}

#headerNavbar .logo {
	width: 100% !important;
	border-radius: 12px;
	height: 58px;
}

#headerNavbar .helpline-no {
	background-color: #009DDC;
	color: #ffff;
	border-radius: 20px;
	padding: 10px 20px;
	font-size: 14px !important;
}

#headerNavbar .navbar-dark .navbar-nav .nav-link {
	color: #000000;
	font-size: 18px;
	font-family: segoe-semibold;
}

/* #headerNavbar .navbar-dark .navbar-nav .nav-link:hover{
        color: #000000 ;
    } */
#headerNavbar .nav-item::after {
	content: '';
	display: block;
	width: 0px;
	height: 2px;
	background: #fff;
}

#headerNavbar .nav-item:hover::after {
	width: 100%;
}

#headerNavbar .badge-danger {
	color: #fff;
	background-color: #dc3545;
	border-radius: 50px;
	position: absolute;
	/* left: -17px; */
	right: 13px;
	top: 45px;
	font-size: 10px;
	padding: 4px 6px;
}

#headerNavbar .login-menu .nav-link {
	color: rgb(255 255 255);
	font-size: 18px;
	font-family: segoe-semibold;
}

/*------------This Css End Of Header Section End Here------------ */

/*------------This Css Use Of Home Page Start Here------------ */
#Hero {
	position: relative;
	top: 100px;
}

#Hero .header-headding {
	font-size: 50px;
	color: #fff;
	text-shadow: 0px 2px 2px rgb(75 23 23 / 62%);
}

#Hero .header-button {
	width: 19%;
	color: black;
	background-color: #fff;
	padding: 11px;
	border-radius: 6px;
	box-shadow: rgb(99 99 99 / 44%) 0px 2px 8px 0px;
}

#Hero .header-button:hover {
	color: black;
	background-color: #ffffffcc;
}

#Hero .motivational-button,
.current-affairs-button {
	width: 18%;
	background-color: #BEF2A4;
	padding: 10px 30px 10px 30px;
	font-size: 19px;
	border-radius: 10px;
	box-shadow: rgb(99 99 99 / 44%) 0px 2px 8px 0px;
}

#Hero .box-div {
	background-image: url('../images/home-images/box-bg-img.png');
	background-color: #ffffff;
	background-position: top right;
	background-repeat: no-repeat;
	background-size: contain;
	top: 20px;
	box-shadow: rgb(99 99 99 / 44%) 0px 2px 8px 0px;
	width: 100%;
	border-radius: 19px;
}

#Hero .box-div-img {
	width: 80%;
}

#Hero .box-div-headding {
	width: 90%;
	word-break: break-all;
	font-size: 22px;
}

#Hero .box-headding {
	font-size: 22px !important;
}

/*#Hero .box-div-btn{
		border-radius: 6px;
    	border: none;
    	font-size: 14px;
    	padding: 5px 20px 5px 20px;
	}*/

#studentReview {
	background-image: url('../images/home-images/student-review-bg-img.png');
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
}

#studentReview .student-proflie {
	display: inline-block;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	text-align: center;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	border: 5px solid #009DDC;
}

.owl-carousel .owl-stage {
	display: flex;
}

#studentReview .item {
	background-color: white;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	border-radius: 15px;
	border-bottom: 6px solid #009DDC;
	height: 100%;
}

#studentReview .blog .carousel-indicators {
	left: 0;
	top: auto;
	bottom: -60px;
}

#studentReview .blog .carousel-indicators li {
	background: #fff;
	border-radius: 50%;
	width: 9px;
	height: 9px;
}

#studentReview .blog .carousel-indicators .active {
	background: #009DDC;
}

#studentReview .owl-prev .owl-next {
	display: none;
}

#studentReview .owl-theme .owl-nav [class*=owl-]:hover {
	display: none;
}

/*------------This Css End Of Home Page------------ */

/*------------This Css Use Of About Us Page Start Here------------ */
#aboutUs .para-txt {
	background-color: #F8F9FA;
	text-align: center;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	border-radius: 10px;
}

/*------------This Css End Of About Us  Page------------ */

/*------------This Css Use Of Contact Us Page Start Here------------ */
#contactUs .div-box {
	background-color: #fff;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	border-radius: 10px;
}

#contactUs .div-box-label {
	padding: 5px;
	padding-left: 35px;
	padding-right: 35px;
	width: 50%;
	border-radius: 0px 0px 20px 20px;
}

#contactUs .div-box-label-txt {
	font-size: 18px;
	text-align: center;
	color: #fff;
}

/*------------This Css End Of Contact Us  Page------------ */


/*------------This Css Use Of Follow Us Page Start Here------------ */
#followUs .bg-img {
	background-image: url('../images/followUs-bg-img.png');
	background-color: #cccccc;
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
	width: 100%;
}

#followUs .icon-box {
	background-color: #009DDC;
	width: 100px;
	padding: 30px;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	border-radius: 10px;
}

#followUs .icon {
	font-size: 45px;
	color: #fff;
}

/*------------This Css End Of Follow Us Page------------ */

/*------------This Css Use Of AttempTest Page Start Here------------ */
#attemptTest .panel-default {
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	border: 5px solid #009DDC;
	border-radius: 20px;
	border-bottom: 30px solid #009DDC;
}

#attemptTest .panel-heading {
	border-radius: 16px 16px 0px 0px;
	border: none;
}

#attemptTest ol li {
	padding-bottom: 20px;
}

/*------------This Css End Of AttempTest Page ------------ */

/*------------This Css Use Of Motivatinal Page Start Here------------ */
#Motivational .quotes-box {
	word-wrap: break-word;
	color: #fff;
	border-radius: 20px 0px 20px 0px;
}

#Motivational .quotes-box-color1 {
	background-color: #FF2C55;
}

#Motivational .quotes-box-color2 {
	background-color: #FF8C65;
}

#Motivational .panel-default {
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

#Motivational .panel-heading {
	background-color: #F8F9FA;
	font-size: 80px;
	color: #00000078;
}

#Motivational .panel-body {
	color: blue;
	word-wrap: break-word;
	font-size: 14px;
}

/*------------This Css End Of Motivatinal Page ------------ */

/*------------This Css Use Of Current Affairs Page Start Here------------ */
#currentAffairs .panel-default {
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

#currentAffairs .panel-heading {
	background-color: #F8F9FA;
	font-size: 80px;
	color: #00000078;
}

#currentAffairs .panel-body {
	color: blue;
	word-wrap: break-word;
	font-size: 14px;
}

/*------------This Css End Of Current Affairs Page ------------ */

/*------------This Css Use Of Test Category Page Start Here------------ */
#testCategory .card {
	width: 100%;
	border-radius: 18px;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

#testCategory .card-bg-img {
	background-image: url('../images/test-series-img/bg-img1.png');
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
}

#testCategory .category-circular-image {
	width: 150px;
	height: 150px;
	border-radius: 50%;
	overflow: hidden;
	background-color: white;
	display: inline-block;
	vertical-align: middle;
}

#testCategory .category-circular-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#testCategory .card-body {
	border-radius: 0px 0px 18px 18px;
}

#testCategory .card-text {
	font-size: 15px;
	text-align: center;
}

/*------------This Css End Of Test Category Page------------ */

/*------------This Css Use Of Test Series Page Start Here------------ */
#testSeries .card {
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	border-bottom: 10px solid #009DDC;
	border-radius: 10px
}

/*#testSeries .card-img{
		width: 100%;margin-top: -50px !important;
	}*/

#testSeries ul {
	list-style-type: none;
}

#testSeries ul li {
	border: none;
}

#testSeries li:before {
	color: #009ddc;
	content: "\f00c";
	font-family: FontAwesome;
	display: inline-block;
	padding-right: 10px;
	width: var(--icon-space);
}

#testSeries .price-txt {
	font-size: 1.4rem;
}

#testSeriesVideoPDF .panel-default {
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

#testSeriesVideoPDF .panel-heading {
	background-color: #F8F9FA;
	font-size: 80px;
	color: #00000078;
}

#testSeriesVideoPDF .panel-body {
	color: blue;
	word-wrap: break-word;
	font-size: 14px;
}

#testSeriesVideoPDF .cursor-event {
	pointer-events: none;
}

/*this css use of test exam schedule label showing start here*/
#testSeriesVideoPDF .panel::before {
	position: absolute;
	top: 16px;
	right: 10px;
	content: '';
	background: #98a0d7;
	height: 33px;
	width: 30px;
	transform: rotate(51deg);
	z-index: -1;
}

#testSeriesVideoPDF .panel::after {
	position: absolute;
	content: attr(data-label);
	top: 10px;
	right: 2px;
	width: 4rem;
	background: #009DDC;
	color: white;
	text-align: center;
	font-family: 'Roboto', sans-serif;
	box-shadow: 4px 4px 15px rgba(26, 35, 126, 0.2);
	border-radius: 20px 0px 0px 20px;
	font-size: 12px;
	font-weight: bold;
	padding: 3px;
}

#testSeriesVideoPDF .badge-primary {
	position: relative;
	top: 2.5rem;
	z-index: 1;
	float: right;
	padding: 8px;
	background-color: #ffffffd1;
	color: #000;
	border-radius: 10px 0px 0px 10px;
}

/*this css end of test exam schedule label showing*/
/*------------This Css End Of Test Series Page------------ */

/*------------This Css Use Of Test Exam Schedule Page Start Here------------ */
#testExamSchedule {
	background-image: url('../images/test-series-img/bg-img2.jpg');
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
}

#testExamSchedule .card {
	box-shadow: rgb(99 99 99 / 55%) 0px 2px 8px 0px;
	border-radius: 10px;
	border: none;
}

#testExamSchedule .label-div {
	padding: 10px;
	padding-left: 35px;
	padding-right: 35px;
	width: 60%;
	border-radius: 0px 0px 20px 20px;
}

#testExamSchedule .label-txt {
	font-size: 18px;
	text-align: center;
	color: #fff;
}

#testExamSchedule .text1 {
	color: #0000007d;
	font-size: 16px;
}

#testExamSchedule .text2 {
	color: #000000;
	font-size: 17px;
}

#testExamSchedule .btn-enable {
	display: none;
}

/*------------This Css End Of Test Exam Schedule Page------------ */

/*------------This Css Use Of Combo Packge Page Start Here------------ */
#comboPackage .price-txt {
	font-size: 1.4rem;
}

#comboPackage .card {
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	border-bottom: 10px solid #009DDC;
	border-radius: 10px
}

/*#comboPackage .card-img{
		width: 100%;margin-top: -50px !important;
	}*/

#comboPackage ol {
	list-style-type: none;
	padding-left: 0px;
}

#comboPackage ul li {
	border: none;
}

#comboPackage ul li b {
	font-size: 15px;
}

#comboPackage li:before {
	color: blue;
	content: "\f00c";
	/* FontAwesome Unicode */
	font-family: FontAwesome;
	display: inline-block;
	padding-right: 10px;
	width: var(--icon-space);
}

/*------------This Css End Of Combo Packge Page------------ */

/*------------This Css Use Of Latest Exam News Page Start Here------------ */
#latestExamNews .panel-default {
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

#latestExamNews .panel-heading {
	background-color: #F8F9FA;
	font-size: 80px;
	color: #00000078;
}

#latestExamNews .panel-body {
	color: blue;
	word-wrap: break-word;
	font-size: 14px;
}

/*------------This Css End Of Latest Exam News Page------------ */

/*------------This Css Use Of Profile Details and profile update form Page Start Here------------ */
#profileDetails .pro-cir-img-div {
	width: 160px;
	height: 160px;
	background-color: #009DDC;
	border-radius: 50%;
	overflow: hidden;
	margin-top: -70px !important;
	border: 4px solid white;
}

#profileDetails .pro-cir-img-div img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#profileDetails .proflie-edit-icon {
	display: inline-block;
	border-radius: 50px;
	box-shadow: 0 0 2px black;
	padding: 0.2em 0.6em;
	color: #fff;
	position: absolute;
	left: 8rem;
	top: 50px;
	background-color: #009DDC;
}

/*------------This Css End Of Profile Details and profile update form Page------------ */


/*------------This Css Use Of My Order Page Start Here------------ */
#myOrder .img-cir-div {
	width: 50px;
	height: 50px;
	background-color: #009DDC;
	border-radius: 50%;
	overflow: hidden;
}

#myOrder .cir-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#myOrder .card {
	box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}

/*------------This Css End Of My Order Page------------ */

/*------------This Css Use Of Open Notification Model in Header Page Start Here------------ */
#Notifications .modal.right .modal-dialog {
	position: fixed;
	margin: auto;
	width: 30% !important;
	height: 100%;
	-webkit-transform: translate3d(0%, 0, 0);
	-ms-transform: translate3d(0%, 0, 0);
	-o-transform: translate3d(0%, 0, 0);
	transform: translate3d(0%, 0, 0);
}

#Notifications .modal.right .modal-content {
	height: 100%;
	overflow-y: auto;
}

#Notifications .modal.right .modal-body {
	padding: 15px 15px 80px;
	background-color: #F8F9FA;
}

#Notifications .modal.right.fade .modal-dialog {
	right: 0px;
	-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
	-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
	-o-transition: opacity 0.3s linear, right 0.3s ease-out;
	transition: opacity 0.3s linear, right 0.3s ease-out;
}

#Notifications .modal.right.fade.in .modal-dialog {
	right: 0;
}

#Notifications .modal-content {
	border-radius: 0;
	border: none;
}

#Notifications .modal-header {
	border-bottom-color: #EEEEEE;
	background-color: #009DDC;
	color: #fff;
}

#Notifications .toast {
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	padding: 20px;
}

/*------------This Css End Of Open Notification Model in Header Page------------ */

/*------------This Css Use Of Footer Page Start Here------------ */
#footerSection {
	padding-top: 1px;
	box-shadow: rgb(99 99 99 / 44%) 0px 2px 8px 0px;
	background-color: white;
}

#footerSection .footer-logo {
	border-radius: 12px;
}

#footerSection .footer-paragraph {
	font-size: 15px;
}

#footerSection .footer-icon {
	border-radius: 10px;
	background-color: #009DDC;
	margin-left: 9px;
}

#footerSection ul.footer-ul {
	list-style-type: none;
	padding: 0px;
}

#footerSection ul.footer-ul li {
	margin-top: 15px;
}

#footerSection .footer-heading {
	color: #009DDC;
	margin-bottom: 25px;
	font-family: 'Montserrat';
}

#footerSection .footer-link {
	color: black;
}

#footerSection .footer-link:hover {
	text-decoration: none;
	color: #009DDC;
}

#footerSection .footer-copyright {
	background-color: #009DDC;
	height: 32px;
}

#footerSection .footer-feedback-txt {
	color: #000;
}

#footerSection .footer-feedback-txt:hover {
	text-decoration: none;
	color: #009DDC;
}


/*------------This Css End Of Footer Page End Here------------ */


.home-section {
	margin-top: 20rem;
}

/* Social Media Brand Colors & Hover Effects */
.social-icon-wrapper {
	transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease !important;
}

.social-icon-wrapper:hover {
	transform: scale(1.15) translateY(-3px) !important;
}

.social-facebook {
	background-color: #1877F2 !important;
}

.social-facebook:hover {
	box-shadow: 0 4px 15px rgba(24, 119, 242, 0.6) !important;
}

.social-instagram {
	background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%) !important;
}

.social-instagram:hover {
	box-shadow: 0 4px 15px rgba(214, 36, 159, 0.6) !important;
}

.social-youtube {
	background-color: #FF0000 !important;
}

.social-youtube:hover {
	box-shadow: 0 4px 15px rgba(255, 0, 0, 0.6) !important;
}

.social-twitter {
	background-color: #000000 !important;
}

.social-twitter:hover {
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.6) !important;
}

/* ==================== EDITORIAL THEME STYLES ==================== */

/* Fonts imported at the top of the stylesheet */

:root {
    --ocbt-navy: #14263d;
    --ocbt-wine: #7d2638;
    --ocbt-gold: #a57d3e;
    --ocbt-ink: #181714;
    --ocbt-paper: #fbfaf7;
    --ocbt-cream: #f1ede5;
    --ocbt-muted: #6f706d;
    --ocbt-line: #d8d5cf;
    --ocbt-white: #fff;
}

html { scroll-behavior: smooth; }
body {
    padding-top: 72px;
    background: var(--ocbt-paper) !important;
    color: var(--ocbt-ink);
    font-family: Manrope, Arial, sans-serif !important;
    -webkit-font-smoothing: antialiased;
}
body, button, input, select, textarea { letter-spacing: 0; }
a { color: inherit; }
.container { max-width: 1220px; }
.theme-color1, .text-primary { color: var(--ocbt-wine) !important; }
.theme-bg-color1, .bg-primary { background-color: var(--ocbt-wine) !important; }
.theme-bg-color2 { background-color: var(--ocbt-cream) !important; }

/* Shared masthead and navigation */
#headerNavbar .media-query-padding { padding: 0 !important; }
#headerNavbar .ocbt-navbar {
    min-height: 72px;
    padding: 8px max(22px, calc((100vw - 1220px) / 2));
    margin: 0;
    background: #fff !important;
    border: 0;
    border-bottom: 1px solid var(--ocbt-navy);
    box-shadow: 0 8px 24px rgba(20,38,61,.05);
}
.ocbt-wordmark { display: grid !important; min-width: 145px; padding: 0 !important; line-height: 1; }
.ocbt-wordmark strong { color: var(--ocbt-navy); font: 600 27px/.9 "Source Serif 4", Georgia, serif; }
.ocbt-wordmark strong span { color: var(--ocbt-wine); }
.ocbt-wordmark small { margin-top: 7px; color: var(--ocbt-gold); font-size: 7px; font-weight: 800; text-transform: uppercase; }
#headerNavbar .navbar-nav { align-items: center; }
#headerNavbar .nav-link {
    padding: 10px 9px !important;
    color: var(--ocbt-navy) !important;
    font-size: 10px !important;
    font-weight: 800;
    text-transform: uppercase;
    white-space: nowrap;
    border-bottom: 2px solid transparent;
}
#headerNavbar .nav-item.active > .nav-link,
#headerNavbar .nav-link:hover { color: var(--ocbt-wine) !important; border-bottom-color: var(--ocbt-wine); }
#headerNavbar .login-menu { list-style: none; }
#headerNavbar .ocbt-login-link { margin-left: 7px; padding: 10px 15px !important; color: #fff !important; background: var(--ocbt-wine); border-radius: 999px; border: 0 !important; }
#headerNavbar .dropdown-menu { margin-top: 0; padding: 7px; border: 1px solid var(--ocbt-line) !important; border-radius: 4px; box-shadow: 0 12px 28px rgba(20,38,61,.12) !important; }
#headerNavbar .dropdown-item { padding: 9px 11px; color: var(--ocbt-navy); font-size: 11px; border-radius: 3px; }
#headerNavbar .dropdown-item:hover { background: var(--ocbt-cream); color: var(--ocbt-wine); }
.header-search-container { max-width: 245px !important; margin: 0 12px !important; }
.search-input-group { height: 38px; border-color: var(--ocbt-line) !important; border-radius: 999px !important; background: #fff !important; }
.search-input-group:focus-within { border-color: var(--ocbt-wine) !important; box-shadow: 0 0 0 3px rgba(125,38,56,.1) !important; }
.form-control-search { font-family: Manrope, Arial, sans-serif !important; font-size: 11px !important; }
.search-results-dropdown { border-radius: 4px !important; border-color: var(--ocbt-line) !important; }

/* Homepage */
.ocbt-home { overflow: hidden; }
.ocbt-edition-bar { height: 36px; display: flex; align-items: center; border-bottom: 1px solid var(--ocbt-line); background: #fff; }
.ocbt-edition-bar .container { display: flex; justify-content: space-between; color: var(--ocbt-muted); font-size: 9px; text-transform: uppercase; }
.ocbt-edition-bar strong { color: var(--ocbt-gold); }
.ocbt-edition-bar a { color: var(--ocbt-wine); font-weight: 800; }
.ocbt-ticker { min-height: 40px; display: flex; align-items: center; overflow: hidden; border-bottom: 1px solid var(--ocbt-line); background: var(--ocbt-cream); }
.ocbt-ticker[hidden] { display: none; }
.ocbt-ticker .container { display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: center; overflow: hidden; }
.ocbt-ticker strong { color: var(--ocbt-wine); font-size: 9px; font-weight: 900; text-transform: uppercase; white-space: nowrap; }
.ocbt-ticker-window { overflow: hidden; color: #4d4d49; font: italic 12px "Source Serif 4", Georgia, serif; white-space: nowrap; }
.ocbt-ticker-window span { display: inline-block; min-width: 100%; padding-left: 100%; animation: ocbt-ticker-scroll 24s linear infinite; }
.ocbt-ticker:hover .ocbt-ticker-window span { animation-play-state: paused; }
@keyframes ocbt-ticker-scroll { to { transform: translateX(-100%); } }
.ocbt-lead { position: relative; min-height: min(670px, calc(100vh - 108px)); display: flex; align-items: flex-end; background-color: var(--ocbt-navy); background-image: var(--lead-image); background-position: center; background-size: cover; color: #fff; }
.ocbt-lead-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,22,36,.94) 0%, rgba(10,22,36,.72) 48%, rgba(10,22,36,.18) 100%); }
.ocbt-lead-content { position: relative; z-index: 1; padding-top: 80px; padding-bottom: 70px; }
.ocbt-kicker { margin: 0 0 14px; color: #dfc596 !important; font-size: 9px !important; font-weight: 900; text-transform: uppercase; }
.ocbt-lead h1 { max-width: 800px; margin: 0 0 14px; color: #fff; font: 500 68px/.98 "Source Serif 4", Georgia, serif; }
.ocbt-lead .ocbt-lead-headline { max-width: 760px; margin: 0 0 12px; color: #fff; font: 500 27px/1.15 "Source Serif 4", Georgia, serif; }
.ocbt-lead-content > p:not(.ocbt-kicker) { max-width: 650px; color: #dbe1e7; font: italic 16px/1.65 "Source Serif 4", Georgia, serif; }
.ocbt-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 28px; }
.ocbt-button { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; padding: 0 18px; border: 1px solid transparent; border-radius: 999px; font-size: 9px; font-weight: 900; text-transform: uppercase; }
.ocbt-button:hover { text-decoration: none; transform: translateY(-1px); }
.ocbt-button-primary { background: var(--ocbt-wine); color: #fff !important; }
.ocbt-button-light { background: #fff; color: var(--ocbt-navy) !important; border-color: var(--ocbt-line); }
.ocbt-text-action { min-height: 42px; display: inline-flex; align-items: center; padding: 0 8px; color: #fff !important; border-bottom: 1px solid rgba(255,255,255,.7); font-size: 9px; font-weight: 900; text-transform: uppercase; }
.ocbt-text-action:hover { color: #dfc596 !important; text-decoration: none; border-color: #dfc596; }
.ocbt-text-action-dark { color: var(--ocbt-wine) !important; border-color: var(--ocbt-wine); }
.ocbt-text-action-dark:hover { color: var(--ocbt-navy) !important; border-color: var(--ocbt-navy); }
.ocbt-module-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 0; padding: 0; border-bottom: 1px solid var(--ocbt-navy); }
.ocbt-module { min-height: 126px; display: grid; grid-template-columns: auto 1fr; gap: 13px; padding: 24px 18px; border-right: 1px solid var(--ocbt-line); border-top: 1px solid var(--ocbt-navy); background: var(--ocbt-paper); }
.ocbt-module:nth-child(4n) { border-right: 0; }
.ocbt-module:hover { background: #fff; text-decoration: none; }
.ocbt-module > span { color: var(--ocbt-gold); font: italic 22px "Source Serif 4", Georgia, serif; }
.ocbt-module strong { display: block; color: var(--ocbt-navy); font: 600 18px "Source Serif 4", Georgia, serif; }
.ocbt-module small { display: block; margin-top: 6px; color: var(--ocbt-muted); font-size: 9px; line-height: 1.5; }
.ocbt-managed-promotions { padding-top: 30px; padding-bottom: 30px; }
.ocbt-managed-promotion { overflow: hidden; border: 1px solid var(--ocbt-line); border-radius: 6px; }
.ocbt-managed-promotion + .ocbt-managed-promotion { margin-top: 18px; }
.ocbt-managed-promotion img { max-width: 100%; height: auto; }
.ocbt-banner-carousel { overflow: hidden; border: 1px solid var(--ocbt-line); border-radius: 6px; background: #fff; }
.ocbt-banner-carousel img { width: 100%; aspect-ratio: 3 / 1; display: block; object-fit: cover; }
.ocbt-banner-carousel .carousel-control-prev,
.ocbt-banner-carousel .carousel-control-next { width: 52px; background: rgba(20,38,61,.35); }
.ocbt-section { padding: 78px 0; }
.ocbt-introduction { background: #fff; border-bottom: 1px solid var(--ocbt-line); }
.ocbt-introduction-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 55px; align-items: center; }
.ocbt-introduction h2, .ocbt-refer h2 { margin: 0 0 18px; color: var(--ocbt-navy); font: 500 46px/1.04 "Source Serif 4", Georgia, serif; }
.ocbt-introduction p:not(.ocbt-kicker), .ocbt-refer p:not(.ocbt-kicker) { max-width: 590px; color: var(--ocbt-muted); font-size: 11px; line-height: 1.75; }
.ocbt-introduction video { width: 100%; aspect-ratio: 16 / 9; display: block; object-fit: cover; background: var(--ocbt-navy); }
.ocbt-section-head { position: relative; margin-bottom: 34px; padding-top: 14px; border-top: 4px solid var(--ocbt-navy); }
.ocbt-section-head > p { margin: 0 0 10px; color: var(--ocbt-wine); font-size: 9px; font-weight: 900; text-transform: uppercase; }
.ocbt-section-head h2, .ocbt-faq h2, .ocbt-live h2 { max-width: 790px; margin: 0; color: var(--ocbt-navy); font: 500 50px/1.02 "Source Serif 4", Georgia, serif; }
.ocbt-section-head > a { position: absolute; right: 0; bottom: 7px; color: var(--ocbt-wine); font-size: 9px; font-weight: 900; text-transform: uppercase; }
.ocbt-affairs { background: var(--ocbt-cream); border-top: 1px solid var(--ocbt-line); border-bottom: 1px solid var(--ocbt-line); }
.ocbt-story-grid { display: grid; grid-template-columns: 1.25fr .75fr .75fr; }
.ocbt-story { min-height: 210px; padding: 22px; border-right: 1px solid #cec8bd; border-bottom: 1px solid #cec8bd; }
.ocbt-story:nth-child(3) { border-right: 0; }
.ocbt-story:nth-child(n+4) { min-height: 170px; }
.ocbt-story > span { color: var(--ocbt-gold); font: italic 20px "Source Serif 4", Georgia, serif; }
.ocbt-story > p { margin: 6px 0; color: var(--ocbt-wine); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.ocbt-story h3 { margin: 8px 0; color: var(--ocbt-navy); font: 600 20px/1.2 "Source Serif 4", Georgia, serif; }
.ocbt-story-featured { grid-row: span 2; padding-left: 0; }
.ocbt-story-featured h3 { font-size: 33px; }
.ocbt-story > div { color: var(--ocbt-muted); font-size: 10px; line-height: 1.65; }
.ocbt-story > a, .ocbt-text-link { display: inline-block; margin-top: 15px; color: var(--ocbt-wine); font-size: 9px; font-weight: 900; text-transform: uppercase; }
.ocbt-practice-grid { display: grid; grid-template-columns: 1fr 1fr; }
.ocbt-practice-panel { min-height: 450px; display: flex; flex-direction: column; padding: 38px; border: 1px solid var(--ocbt-line); background: #fff; }
.ocbt-practice-panel + .ocbt-practice-panel { border-left: 0; }
.ocbt-practice-panel h3 { max-width: 430px; margin: 12px 0; color: var(--ocbt-navy); font: 500 38px/1.05 "Source Serif 4", Georgia, serif; }
.ocbt-practice-panel > p:not(.ocbt-kicker) { color: var(--ocbt-muted); font-size: 11px; line-height: 1.7; }
.ocbt-practice-list { display: grid; margin-top: auto; border-top: 1px solid var(--ocbt-line); }
.ocbt-practice-list a { display: flex; justify-content: space-between; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--ocbt-line); }
.ocbt-practice-list strong { color: var(--ocbt-navy); font: 500 14px "Source Serif 4", Georgia, serif; }
.ocbt-practice-list span { color: var(--ocbt-muted); font-size: 8px; }
.ocbt-practice-dark { background: var(--ocbt-navy); border-color: var(--ocbt-navy); }
.ocbt-practice-dark h3 { color: #fff; }
.ocbt-practice-dark > p:not(.ocbt-kicker) { color: #b7c1cc; }
.ocbt-practice-dark .ocbt-text-link { color: #dfc596; }
.ocbt-dialogue { display: grid; gap: 10px; margin-top: auto; }
.ocbt-dialogue span { width: 78%; padding: 13px; border: 1px solid #536478; color: #d9e0e6; font: italic 12px "Source Serif 4", Georgia, serif; }
.ocbt-dialogue span:last-child { margin-left: auto; background: #fff; color: var(--ocbt-navy); }
.ocbt-knowledge { background: #fff; border-top: 1px solid var(--ocbt-line); }
.ocbt-article-grid { display: grid; grid-template-columns: 1.3fr .7fr .7fr; }
.ocbt-article { padding: 23px; border-top: 1px solid var(--ocbt-line); border-right: 1px solid var(--ocbt-line); }
.ocbt-article:nth-child(3) { border-right: 0; }
.ocbt-article > p { color: var(--ocbt-wine); font-size: 8px; font-weight: 900; text-transform: uppercase; }
.ocbt-article h3 { color: var(--ocbt-navy); font: 600 20px/1.2 "Source Serif 4", Georgia, serif; }
.ocbt-article-featured { grid-row: span 2; padding-left: 0; border-top: 5px solid var(--ocbt-navy); }
.ocbt-article-featured h3 { font-size: 35px; }
.ocbt-article > div { color: var(--ocbt-muted); font-size: 10px; line-height: 1.7; }
.ocbt-article footer { display: flex; justify-content: space-between; margin-top: 20px; padding-top: 12px; border-top: 1px solid var(--ocbt-line); color: #888; font-size: 8px; }
.ocbt-article footer a { color: var(--ocbt-wine); font-weight: 900; text-transform: uppercase; }
.ocbt-refer { background: var(--ocbt-paper); border-top: 1px solid var(--ocbt-line); }
.ocbt-refer-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 55px; align-items: center; }
.ocbt-refer img { width: 100%; aspect-ratio: 16 / 10; display: block; object-fit: cover; }
.ocbt-refer .ocbt-button { margin-top: 14px; }
.ocbt-live { background: var(--ocbt-navy); color: #fff; }
.ocbt-live-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 70px; align-items: center; }
.ocbt-live h2 { color: #fff; }
.ocbt-live header > p:not(.ocbt-kicker) { color: #b7c1cc; font-size: 11px; line-height: 1.7; }
.ocbt-live-list { border-top: 1px solid #405164; }
.ocbt-live-list > a { display: grid; grid-template-columns: 45px 1fr auto; gap: 14px; align-items: center; padding: 20px 0; border-bottom: 1px solid #405164; }
.ocbt-live-list > a:hover { text-decoration: none; }
.ocbt-live-list span { color: #dfc596; font-size: 9px; }
.ocbt-live-list strong { color: #fff; font: 500 19px "Source Serif 4", Georgia, serif; }
.ocbt-live-list small { color: #9eabb7; font-size: 8px; text-transform: uppercase; }
.ocbt-review-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ocbt-line); border-bottom: 1px solid var(--ocbt-line); }
.ocbt-review-grid figure { margin: 0; padding: 27px; border-right: 1px solid var(--ocbt-line); }
.ocbt-review-grid figure:last-child { border-right: 0; }
.ocbt-review-grid blockquote { min-height: 110px; color: var(--ocbt-navy); font: italic 17px/1.5 "Source Serif 4", Georgia, serif; }
.ocbt-review-grid figcaption { display: grid; border-top: 1px solid var(--ocbt-line); padding-top: 12px; }
.ocbt-review-grid strong { color: var(--ocbt-wine); font-size: 10px; }
.ocbt-review-grid span { color: var(--ocbt-muted); font-size: 8px; }
.ocbt-faq { background: var(--ocbt-cream); }
.ocbt-faq-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: 70px; }
.ocbt-faq header > p:not(.ocbt-kicker) { color: var(--ocbt-muted); font-size: 11px; }
.ocbt-faq details { border-top: 1px solid #cbc5bb; }
.ocbt-faq details:last-child { border-bottom: 1px solid #cbc5bb; }
.ocbt-faq summary { position: relative; padding: 18px 40px 18px 0; color: var(--ocbt-navy); font: 600 17px "Source Serif 4", Georgia, serif; cursor: pointer; list-style: none; }
.ocbt-faq summary::after { content: '+'; position: absolute; right: 5px; color: var(--ocbt-wine); font: 500 22px Georgia, serif; }
.ocbt-faq details[open] summary::after { content: '−'; }
.ocbt-faq details > p { padding-right: 35px; color: var(--ocbt-muted); font-size: 11px; line-height: 1.7; }
.ocbt-empty { padding: 28px; border: 1px solid var(--ocbt-line); color: var(--ocbt-muted); font: italic 15px "Source Serif 4", Georgia, serif; text-align: center; }
.ocbt-empty-dark { border-color: #405164; color: #b7c1cc; }

/* Shared legacy PHP page surfaces */
body > section:not(#headerNavbar):not(#footerSection),
body > main:not(.ocbt-home),
body > .container:not(.ocbt-module-grid):not(.ocbt-managed-promotions) { color: var(--ocbt-ink); }
body h1, body h2, body h3, body h4, body h5 { letter-spacing: 0; }
body h1, body h2 { color: var(--ocbt-navy); font-family: "Source Serif 4", Georgia, serif; font-weight: 600; }
.card, .panel, .modal-content, .div-box, .para-txt, .toast, .faq-item {
    border: 1px solid var(--ocbt-line) !important;
    border-radius: 6px !important;
    background: #fff !important;
    box-shadow: none !important;
}
.card-header, .panel-heading, .modal-header { color: var(--ocbt-navy) !important; background: #fff !important; border-bottom: 1px solid var(--ocbt-line) !important; }
.card-img-top, .card img, .panel img { max-width: 100%; object-fit: cover; }
.btn { border-radius: 999px !important; font-size: 11px; font-weight: 800; }
.btn-primary, .header-button, .mini-button { background: var(--ocbt-wine) !important; border-color: var(--ocbt-wine) !important; color: #fff !important; box-shadow: none !important; }
.btn-secondary { background: var(--ocbt-navy) !important; border-color: var(--ocbt-navy) !important; }
.form-control, .custom-select { min-height: 42px; border: 1px solid #c9c6bf; border-radius: 4px !important; box-shadow: none !important; }
.form-control:focus, .custom-select:focus { border-color: var(--ocbt-wine); box-shadow: 0 0 0 3px rgba(125,38,56,.1) !important; }
.table-responsive { border: 1px solid var(--ocbt-line); background: #fff; }
.table thead th { background: var(--ocbt-navy); color: #fff; border-color: #35475a; font-size: 10px; text-transform: uppercase; }
.table td { border-color: #e5e2dc; vertical-align: middle; }
.pagination .page-link { color: var(--ocbt-navy); border-color: var(--ocbt-line); }
.pagination .active .page-link { background: var(--ocbt-wine); border-color: var(--ocbt-wine); }
#aboutUs, #contactUs, #currentAffairs, #testCategory, #testSeries, #testExamSchedule, #comboPackage, #latestExamNews, #profileDetails, #myOrder, #Motivational, #attemptTest, #calculatorsPage, #knowledgeCenter, #typingTest, #englishPractice, #liveClasses { min-height: 65vh; padding-top: 45px; padding-bottom: 55px; }

/* Footer and policy navigation */
#footerSection { margin-top: 60px !important; padding: 1px 0 0; background: var(--ocbt-navy) !important; color: #d9e0e6; box-shadow: none !important; }
#footerSection .footer-heading { color: #d8bd8e !important; font: 600 16px "Source Serif 4", Georgia, serif !important; }
#footerSection .footer-link, #footerSection p, #footerSection span { color: #aab5c0 !important; font-size: 10px; line-height: 1.7; }
#footerSection .footer-link:hover { color: #fff !important; }
#footerSection .footer-logo { filter: brightness(0) invert(1); }
#footerSection .footer-icon { width: 36px; height: 36px; margin: 0 7px 0 0; padding: 0; display: grid; place-items: center; border: 1px solid #435367; border-radius: 50% !important; background: transparent !important; }
#footerSection .footer-icon i { width: auto !important; padding: 0 !important; font-size: 16px !important; }
#footerSection .footer-copyright { height: auto; padding: 10px 0; background: #0c1b2c !important; border-top: 1px solid #35475a; }
#footerSection .footer-copyright p { margin: 0; color: #8493a1 !important; font-size: 8px; text-transform: uppercase; }
.whatsapp-float { width: 50px !important; height: 50px !important; bottom: 18px !important; box-shadow: 0 5px 15px rgba(0,0,0,.18) !important; }

@media (max-width: 1100px) {
    .header-search-container { display: none; }
    #headerNavbar .nav-link { padding-left: 6px !important; padding-right: 6px !important; }
    .ocbt-story-grid, .ocbt-article-grid { grid-template-columns: 1fr 1fr; }
    .ocbt-story-featured, .ocbt-article-featured { grid-row: auto; grid-column: span 2; padding-left: 22px; }
    .ocbt-introduction-grid, .ocbt-refer-grid { gap: 32px; }
    .ocbt-live-grid { gap: 35px; }
}

@media (max-width: 767px) {
    body { padding-top: 60px; }
    #headerNavbar .ocbt-navbar { min-height: 60px; padding: 7px 14px; }
    .ocbt-wordmark strong { font-size: 24px; }
    #headerNavbar .navbar-toggler { width: 38px; height: 38px; padding: 0; border: 1px solid var(--ocbt-line); border-radius: 50%; }
    #headerNavbar .navbar-toggler-icon { filter: invert(1); }
    #headerNavbar .navbar-collapse { max-height: calc(100vh - 60px); overflow-y: auto; margin: 7px -14px -7px; padding: 12px 15px 18px; background: #fff; border-top: 1px solid var(--ocbt-line); }
    #headerNavbar .navbar-nav { align-items: stretch; }
    #headerNavbar .nav-link { padding: 12px 3px !important; border-bottom: 1px solid #ece9e3; }
    #headerNavbar .ocbt-login-link { margin: 8px 0 0; padding: 12px 16px !important; text-align: center; }
    .ocbt-edition-bar strong, .ocbt-edition-bar a { display: none; }
    .ocbt-edition-bar .container { justify-content: center; }
    .ocbt-ticker .container { grid-template-columns: 1fr; gap: 2px; padding-top: 7px; padding-bottom: 7px; }
    .ocbt-ticker-window span { animation-duration: 18s; }
    .ocbt-lead { min-height: 570px; background-position: 58% center; }
    .ocbt-lead-overlay { background: linear-gradient(0deg, rgba(10,22,36,.96) 0%, rgba(10,22,36,.65) 70%, rgba(10,22,36,.15) 100%); }
    .ocbt-lead-content { padding-top: 100px; padding-bottom: 42px; }
    .ocbt-lead h1 { font-size: 42px; }
    .ocbt-lead .ocbt-lead-headline { font-size: 24px; }
    .ocbt-lead-content > p:not(.ocbt-kicker) { font-size: 14px; }
    .ocbt-managed-promotions { width: 100%; padding: 14px 0; }
    .ocbt-managed-promotion, .ocbt-banner-carousel { border-right: 0; border-left: 0; border-radius: 0; }
    .ocbt-banner-carousel img { min-height: 150px; object-fit: cover; }
    .ocbt-module-grid { grid-template-columns: 1fr 1fr; }
    .ocbt-module { min-height: 118px; padding: 18px 12px; }
    .ocbt-module:nth-child(odd) { border-right: 1px solid var(--ocbt-line); }
    .ocbt-module:nth-child(even) { border-right: 0; }
    .ocbt-module strong { font-size: 16px; }
    .ocbt-section { padding: 58px 0; }
    .ocbt-section-head h2, .ocbt-faq h2, .ocbt-live h2 { font-size: 36px; }
    .ocbt-section-head > a { position: static; display: inline-block; margin-top: 15px; }
    .ocbt-story-grid, .ocbt-article-grid, .ocbt-practice-grid, .ocbt-introduction-grid, .ocbt-refer-grid, .ocbt-live-grid, .ocbt-faq-grid, .ocbt-review-grid { grid-template-columns: 1fr; }
    .ocbt-introduction h2, .ocbt-refer h2 { font-size: 34px; }
    .ocbt-introduction video { order: -1; }
    .ocbt-story-featured, .ocbt-article-featured { grid-column: auto; padding-left: 20px; }
    .ocbt-story { border-right: 0; }
    .ocbt-story-featured h3, .ocbt-article-featured h3 { font-size: 29px; }
    .ocbt-practice-panel { min-height: 420px; padding: 26px 21px; }
    .ocbt-practice-panel + .ocbt-practice-panel { border-left: 1px solid var(--ocbt-navy); border-top: 0; }
    .ocbt-practice-panel h3 { font-size: 32px; }
    .ocbt-article { border-right: 0; }
    .ocbt-live-list { margin-top: 15px; }
    .ocbt-live-list > a { grid-template-columns: 32px 1fr; }
    .ocbt-live-list small { grid-column: 2; }
    .ocbt-review-grid figure { border-right: 0; border-bottom: 1px solid var(--ocbt-line); }
    .ocbt-review-grid blockquote { min-height: auto; }
    #footerSection .row.mt-5 { margin-top: 25px !important; }
    #footerSection [class*='col-lg-'] { margin-bottom: 25px; padding-left: 15px !important; }
}

@media (max-width: 390px) {
    .ocbt-module-grid { grid-template-columns: 1fr; }
    .ocbt-module { border-right: 0 !important; }
    .ocbt-actions { display: grid; }
    .ocbt-button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .ocbt-ticker-window span { padding-left: 0; animation: none; }
    .ocbt-button:hover { transform: none; }
}

/* =====================================================
   HOMEPAGE NEWSPAPER LAYOUT  (hp-*)
   ===================================================== */
.hp-utility{height:34px;background:var(--ocbt-navy);color:#dce2e8;font-size:10px;letter-spacing:.08em;text-transform:uppercase;}
.hp-utility-inner{height:34px;display:flex;align-items:center;justify-content:space-between;}
.hp-utility strong{color:#d6b77e;}
.hp-utility-links{display:flex;gap:19px;}
.hp-utility a:hover{color:#fff;text-decoration:none;}
.hp-ticker{border-bottom:1px solid var(--ocbt-line);}
.hp-lead-wrap{padding:38px 0 50px;border-bottom:1px solid var(--ocbt-line);background:#fff;}
.hp-lead-grid{display:grid;grid-template-columns:.68fr 1.62fr .8fr;align-items:start;}
.hp-lead-col{padding:0 25px;border-right:1px solid var(--ocbt-line);}
.hp-lead-col:first-child{padding-left:0;}
.hp-lead-col:last-child{padding-right:0;border-right:0;}
.hp-col-head{border-top:4px solid var(--ocbt-navy);border-bottom:1px solid var(--ocbt-line);padding:10px 0 9px;margin-bottom:5px;font-size:9px;font-weight:900;letter-spacing:.15em;text-transform:uppercase;color:var(--ocbt-navy);}
.hp-most-read{padding:17px 0;border-bottom:1px solid var(--ocbt-line);}
.hp-most-read:last-child{border-bottom:0;}
.hp-most-read small{color:var(--ocbt-wine);font-size:9px;font-weight:850;letter-spacing:.1em;text-transform:uppercase;}
.hp-most-read h3{font:500 17px/1.25 "Source Serif 4",Georgia,serif;margin:8px 0;color:var(--ocbt-navy);}
.hp-most-read span{font-size:9px;color:#8c8d89;}
.hp-lead-story{text-align:center;}
.hp-lead-category{color:var(--ocbt-wine);font-size:9px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;}
.hp-lead-story h1{font:500 clamp(38px,4vw,60px)/.98 "Source Serif 4",Georgia,serif;letter-spacing:-.045em;color:var(--ocbt-navy);margin:15px auto 16px;max-width:700px;}
.hp-lead-deck{font:italic 15px/1.55 "Source Serif 4",Georgia,serif;color:#5d5d59;max-width:600px;margin:0 auto 23px;}
.hp-lead-art{height:270px;background-color:var(--ocbt-navy);background-image:var(--lead-image);background-position:center;background-size:cover;position:relative;overflow:hidden;display:grid;place-items:center;border-radius:6px;}
.hp-lead-art-overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,22,36,.82) 0%,rgba(10,22,36,.35) 100%);}
.hp-art-emblem{width:110px;height:110px;border:1px solid rgba(255,255,255,.5);border-radius:50%;display:grid;place-items:center;font:italic 34px "Source Serif 4",Georgia,serif;color:#fff;position:relative;z-index:1;}
.hp-lead-meta{display:flex;justify-content:space-between;margin-top:12px;color:#858681;font-size:9px;}
.hp-lead-meta b{color:var(--ocbt-wine);letter-spacing:.08em;}
.hp-briefing-head{border-top:4px solid var(--ocbt-wine);border-bottom:1px solid var(--ocbt-line);padding:10px 0;display:flex;justify-content:space-between;align-items:center;}
.hp-briefing-head strong{font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--ocbt-wine);}
.hp-briefing-head span{font:italic 11px "Source Serif 4",Georgia,serif;color:var(--ocbt-muted);}
.hp-brief-feature{padding:18px 0;border-bottom:1px solid var(--ocbt-line);}
.hp-brief-monogram{height:108px;background:var(--ocbt-navy);display:grid;place-items:center;color:#d9bd8d;font:italic 29px "Source Serif 4",Georgia,serif;margin-bottom:14px;border-radius:4px;}
.hp-brief-feature small{font-size:8px;color:var(--ocbt-wine);font-weight:900;text-transform:uppercase;letter-spacing:.12em;}
.hp-brief-feature h3{font:500 20px/1.2 "Source Serif 4",Georgia,serif;color:var(--ocbt-navy);margin:8px 0 9px;}
.hp-brief-feature p{font-size:10px;line-height:1.6;color:var(--ocbt-muted);margin:0;}
.hp-brief-link{display:flex;gap:10px;padding:13px 0;border-bottom:1px solid var(--ocbt-line);text-decoration:none;color:inherit;}
.hp-brief-link:hover{text-decoration:none;background:var(--ocbt-cream);}
.hp-brief-link b{font:500 15px "Source Serif 4",Georgia,serif;color:var(--ocbt-gold);}
.hp-brief-link span{font:500 13px/1.3 "Source Serif 4",Georgia,serif;color:var(--ocbt-navy);}
.hp-brief-button{display:block;text-align:center;margin-top:16px;background:var(--ocbt-navy);color:#fff !important;padding:12px;font-size:9px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;border-radius:999px;text-decoration:none;}
.hp-brief-button:hover{background:var(--ocbt-wine);text-decoration:none;}
.hp-services-wrap{border-top:1px solid var(--ocbt-navy);border-bottom:1px solid var(--ocbt-navy);background:var(--ocbt-paper);}
.hp-services-grid{display:grid;grid-template-columns:repeat(4,1fr);}
.hp-service{min-height:120px;display:grid;grid-template-columns:auto 1fr;gap:14px;padding:22px 20px;border-right:1px solid var(--ocbt-line);background:var(--ocbt-paper);color:inherit;text-decoration:none;align-items:start;border-top:1px solid var(--ocbt-line);}
.hp-service:nth-child(4n){border-right:0;}
.hp-service:nth-child(-n+4){border-top:0;}
.hp-service:hover{background:#fff;text-decoration:none;}
.hp-service-no{font:italic 22px "Source Serif 4",Georgia,serif;color:var(--ocbt-gold);}
.hp-service strong{display:block;font:500 17px "Source Serif 4",Georgia,serif;color:var(--ocbt-navy);margin-bottom:5px;}
.hp-service small{font-size:10px;line-height:1.5;color:var(--ocbt-muted);}
.hp-section-rule{display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:center;margin-bottom:28px;}
.hp-section-rule::before,.hp-section-rule::after{content:'';height:1px;background:var(--ocbt-navy);}
.hp-section-rule span{font-size:9px;font-weight:900;letter-spacing:.2em;color:var(--ocbt-wine);text-transform:uppercase;}
.hp-section-head-center{text-align:center;max-width:780px;margin:0 auto 36px;}
.hp-section-head-center h2{font:500 clamp(34px,3.5vw,50px)/1 "Source Serif 4",Georgia,serif;color:var(--ocbt-navy);letter-spacing:-.04em;margin:0 0 14px;}
.hp-section-head-center p{font:italic 14px/1.65 "Source Serif 4",Georgia,serif;color:var(--ocbt-muted);margin:0;}
.hp-section-affairs{background:var(--ocbt-cream);border-top:1px solid var(--ocbt-line);border-bottom:1px solid var(--ocbt-line);}
.hp-affairs-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:34px;}
.hp-affairs-main{background:#fff;border:1px solid var(--ocbt-line);border-radius:6px;padding:26px;}
.hp-affairs-main-top{display:flex;justify-content:space-between;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--ocbt-wine);font-weight:900;}
.hp-affairs-main h3{font:500 31px/1.12 "Source Serif 4",Georgia,serif;color:var(--ocbt-navy);margin:20px 0 14px;}
.hp-affairs-main p{font-size:12px;line-height:1.7;color:var(--ocbt-muted);margin-bottom:24px;}
.hp-tag-latest {
	background: var(--ocbt-wine);
	color: #fff !important;
	font-size: 9px;
	font-weight: 900;
	padding: 4px 8px;
	border-radius: 4px;
	text-transform: uppercase;
	letter-spacing: .05em;
	display: inline-block;
	margin-right: 12px;
}
.hp-affair-date-badge {
	color: var(--ocbt-muted);
	font-size: 11px;
	font-weight: 600;
	text-transform: none;
	letter-spacing: normal;
}
.hp-affairs-desc-html {
	font-size: 13px;
	line-height: 1.7;
	color: var(--ocbt-navy);
	margin-top: 15px;
	margin-bottom: 24px;
	max-height: 240px;
	overflow: hidden;
	position: relative;
}
.hp-affairs-desc-html::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 60px;
	background: linear-gradient(transparent, #fff);
}
.hp-read-full-link {
	color: var(--ocbt-wine) !important;
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .1em;
	text-transform: uppercase;
	text-decoration: none !important;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	transition: color 0.2s ease;
	margin-top: 10px;
}
.hp-read-full-link:hover {
	color: var(--ocbt-navy) !important;
}
.hp-key-points{border-top:1px solid var(--ocbt-line);display:grid;grid-template-columns:repeat(3,1fr);}
.hp-key-point{padding:18px 14px 4px 0;border-right:1px solid var(--ocbt-line);margin-right:14px;}
.hp-key-point:last-child{border:0;margin:0;}
.hp-key-point b{display:block;font:500 21px "Source Serif 4",Georgia,serif;color:var(--ocbt-wine);}
.hp-key-point span{font-size:9px;line-height:1.4;color:var(--ocbt-muted);}
.hp-affairs-list{display:grid;align-content:start;}
.hp-affair-row{display:grid;grid-template-columns:52px 1fr;gap:16px;padding:0 0 20px;margin-bottom:20px;border-bottom:1px solid #cfcac1;}
.hp-affair-row:last-child{margin:0;}
.hp-affair-index{width:52px;height:52px;border:1px solid var(--ocbt-gold);display:grid;place-items:center;font:italic 19px "Source Serif 4",Georgia,serif;color:var(--ocbt-gold);flex-shrink:0;}
.hp-affair-copy small{font-size:8px;color:var(--ocbt-wine);font-weight:900;text-transform:uppercase;letter-spacing:.12em;}
.hp-affair-copy h3{font:500 18px/1.25 "Source Serif 4",Georgia,serif;color:var(--ocbt-navy);margin:7px 0;}
.hp-affair-copy span{font-size:9px;color:#888985;}
.hp-section-practice{background:var(--ocbt-paper);}
.hp-practice-grid{display:grid;grid-template-columns:1fr 1fr;}
.hp-practice-panel{border:1px solid var(--ocbt-line);padding:33px;min-height:380px;display:flex;flex-direction:column;background:#fff;}
.hp-practice-panel+.hp-practice-panel{border-left:0;}
.hp-practice-dark{background:var(--ocbt-navy) !important;color:#fff;border-color:var(--ocbt-navy) !important;}
.hp-panel-label{font-size:9px;font-weight:900;letter-spacing:.15em;text-transform:uppercase;color:var(--ocbt-wine);}
.hp-practice-dark .hp-panel-label{color:#d8bd8e;}
.hp-practice-panel h3{font:500 32px/1.05 "Source Serif 4",Georgia,serif;color:var(--ocbt-navy);margin:22px 0 11px;max-width:400px;}
.hp-practice-dark h3{color:#fff;}
.hp-practice-panel>p{font-size:11px;line-height:1.7;color:var(--ocbt-muted);max-width:430px;margin:0;}
.hp-practice-dark>p{color:#afbac5;}
.hp-typing-data{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ocbt-line);margin-top:auto;}
.hp-data{padding:18px 13px 0 0;border-right:1px solid var(--ocbt-line);margin-right:13px;}
.hp-data:last-child{border:0;}
.hp-data strong{display:block;font:500 26px "Source Serif 4",Georgia,serif;color:var(--ocbt-navy);}
.hp-data small{font-size:8px;color:var(--ocbt-muted);letter-spacing:.08em;text-transform:uppercase;}
.hp-dialogue{margin-top:auto;display:grid;gap:9px;}
.hp-bubble{width:78%;border:1px solid rgba(255,255,255,.25);padding:12px 14px;font:italic 12px/1.5 "Source Serif 4",Georgia,serif;color:#d9e0e6;}
.hp-bubble:last-child{margin-left:auto;background:#fff;color:var(--ocbt-navy);border-color:#fff;}
.hp-panel-link{font-size:9px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;margin-top:20px;color:var(--ocbt-wine);text-decoration:none;}
.hp-panel-link:hover{color:var(--ocbt-navy);text-decoration:none;}
.hp-practice-dark .hp-panel-link{color:#d8bd8e;}
.hp-practice-dark .hp-panel-link:hover{color:#fff;}
.hp-section-knowledge{background:#fff;border-top:1px solid var(--ocbt-line);}
.hp-knowledge-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:34px;}
.hp-article-feature{border-top:5px solid var(--ocbt-navy);padding-top:22px;}
.hp-article-feature small{font-size:8px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--ocbt-wine);}
.hp-article-feature h3{font:500 35px/1.08 "Source Serif 4",Georgia,serif;color:var(--ocbt-navy);margin:14px 0;}
.hp-article-feature p{font:italic 14px/1.65 "Source Serif 4",Georgia,serif;color:var(--ocbt-muted);max-width:680px;margin:0 0 22px;}
.hp-article-footer{border-top:1px solid var(--ocbt-line);padding-top:14px;display:flex;justify-content:space-between;font-size:9px;color:#888985;}
.hp-article-footer a{color:var(--ocbt-wine);font-weight:900;}
.hp-article-side{border-left:1px solid var(--ocbt-line);padding-left:28px;}
.hp-article-side-title{font-size:9px;font-weight:900;letter-spacing:.15em;text-transform:uppercase;color:var(--ocbt-navy);border-top:5px solid var(--ocbt-wine);padding:11px 0;border-bottom:1px solid var(--ocbt-line);}
.hp-article-item{padding:18px 0;border-bottom:1px solid var(--ocbt-line);}
.hp-article-item small{font-size:8px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--ocbt-wine);}
.hp-article-item h3{font:500 17px/1.25 "Source Serif 4",Georgia,serif;color:var(--ocbt-navy);margin:7px 0;}
.hp-article-item h3 a{color:inherit;text-decoration:none;}
.hp-article-item h3 a:hover{color:var(--ocbt-wine);}
.hp-article-item span{font-size:9px;color:#8c8d89;}
.hp-topics{display:grid;grid-template-columns:repeat(5,1fr);margin-top:34px;border-top:1px solid var(--ocbt-line);border-bottom:1px solid var(--ocbt-line);}
.hp-topic{padding:18px;text-align:center;border-right:1px solid var(--ocbt-line);text-decoration:none;color:inherit;}
.hp-topic:last-child{border:0;}
.hp-topic:hover{background:var(--ocbt-cream);text-decoration:none;}
.hp-topic strong{display:block;font:500 14px "Source Serif 4",Georgia,serif;color:var(--ocbt-navy);}
.hp-topic small{font-size:8px;color:var(--ocbt-gold);letter-spacing:.1em;text-transform:uppercase;}
.hp-newsletter{padding:0;}
.hp-newsletter-box{background:var(--ocbt-wine);color:#fff;padding:42px 46px;display:grid;grid-template-columns:1fr 420px;gap:40px;align-items:center;}
.hp-newsletter-box h2{font:500 30px "Source Serif 4",Georgia,serif;margin:0 0 8px;color:#fff;}
.hp-newsletter-box>div>p{font:italic 12px "Source Serif 4",Georgia,serif;color:#e3cbd0;margin:0;}
.hp-mail-form{background:#fff;padding:5px;display:flex;border-radius:999px;overflow:hidden;}
.hp-mail-form input{border:0;outline:0;flex:1;min-width:0;padding:0 12px;font-size:11px;background:transparent;font-family:Manrope,Arial,sans-serif;}
.hp-mail-form button{height:42px;border:0;background:var(--ocbt-navy);color:#fff;padding:0 18px;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;cursor:pointer;}
.hp-mail-form button:hover{background:var(--ocbt-ink);}
.hp-section-faq{background:var(--ocbt-cream);}
.hp-faq-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:70px;}
.hp-faq-grid header h2{font:500 clamp(28px,3vw,42px)/1 "Source Serif 4",Georgia,serif;color:var(--ocbt-navy);margin:14px 0;}
.hp-faq-grid header>p:not(.hp-panel-label){color:var(--ocbt-muted);font-size:11px;}
.hp-faq-item{border-top:1px solid #cbc5bb;}
.hp-faq-item:last-child{border-bottom:1px solid #cbc5bb;}
.hp-faq-item summary{position:relative;padding:18px 40px 18px 0;color:var(--ocbt-navy);font:600 16px "Source Serif 4",Georgia,serif;cursor:pointer;list-style:none;}
.hp-faq-item summary::after{content:'+';position:absolute;right:5px;color:var(--ocbt-wine);font:500 22px Georgia,serif;}
.hp-faq-item[open] summary::after{content:'−';}
.hp-faq-item>p{padding-right:35px;color:var(--ocbt-muted);font-size:11px;line-height:1.7;}
@media(max-width:1100px){.hp-lead-grid{grid-template-columns:1fr 1fr;}.hp-most-read-col{display:none;}.hp-lead-story{padding-left:0;}.hp-affairs-grid,.hp-knowledge-grid{grid-template-columns:1fr;}.hp-article-side{border-left:0;padding-left:0;}.hp-newsletter-box{grid-template-columns:1fr;}}
@media(max-width:767px){.hp-lead-grid{grid-template-columns:1fr;}.hp-lead-col{padding:0;border-right:0;}.hp-briefing-col{margin-top:28px;}.hp-services-grid{grid-template-columns:repeat(2,1fr);}.hp-service:nth-child(2n){border-right:0;}.hp-practice-grid{grid-template-columns:1fr;}.hp-practice-panel+.hp-practice-panel{border-left:1px solid var(--ocbt-navy);border-top:0;}.hp-topics{grid-template-columns:repeat(2,1fr);}.hp-topic:nth-child(2n){border-right:0;}.hp-topic{border-bottom:1px solid var(--ocbt-line);}.hp-newsletter-box{padding:30px 22px;}.hp-mail-form{flex-direction:column;border-radius:6px;background:transparent;padding:0;gap:8px;}.hp-mail-form input{height:43px;padding:0 14px;background:#fff;border-radius:999px;}.hp-mail-form button{height:43px;}.hp-faq-grid{grid-template-columns:1fr;gap:30px;}.hp-key-points{grid-template-columns:1fr;}.hp-key-point{border-right:0;border-bottom:1px solid var(--ocbt-line);margin:0;}.hp-affairs-grid{grid-template-columns:1fr;}}
/* =====================================================
   HOMEPAGE EDITORIAL MASTHEAD  (hp-masthead / hp-nav-shell)
   Matches homepage-demo1.html header exactly
   ===================================================== */

/* --- Masthead --- */
.hp-masthead {
    padding: 20px 0 17px;
    border-bottom: 1px solid var(--ocbt-line);
    background: #fff;
}
.hp-masthead-row {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
}
.hp-weather {
    font: italic 13px "Source Serif 4", Georgia, serif;
    color: var(--ocbt-muted);
}
.hp-wordmark {
    text-align: center;
    text-decoration: none;
    display: block;
}
.hp-wordmark strong {
    display: block;
    font: 500 42px/.9 "Source Serif 4", Georgia, "Times New Roman", serif;
    letter-spacing: -.055em;
    color: var(--ocbt-navy);
}
.hp-wordmark strong i {
    font-style: normal;
    color: var(--ocbt-wine);
}
.hp-wordmark small {
    display: block;
    margin-top: 10px;
    font-size: 9px;
    letter-spacing: .27em;
    text-transform: uppercase;
    color: var(--ocbt-gold);
    font-weight: 800;
    font-family: Manrope, Arial, sans-serif;
}
.hp-masthead-actions {
    justify-self: end;
    display: flex;
    gap: 8px;
    align-items: center;
}
.hp-search-btn {
    width: 39px;
    height: 39px;
    border: 1px solid var(--ocbt-line);
    border-radius: 50%;
    background: #fff;
    cursor: pointer;
    font-size: 18px;
    color: var(--ocbt-navy);
    display: grid;
    place-items: center;
    line-height: 1;
}
.hp-search-btn:hover { background: var(--ocbt-cream); }
.hp-signin-btn {
    height: 39px;
    padding: 0 18px;
    display: flex;
    align-items: center;
    background: var(--ocbt-wine);
    color: #fff !important;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 999px;
}
.hp-signin-btn:hover { background: var(--ocbt-navy); text-decoration: none; }

/* --- Editorial nav shell --- */
.hp-nav-shell {
    background: #fff;
    border-bottom: 1px solid var(--ocbt-navy);
    box-shadow: 0 8px 24px rgba(20,38,61,.05);
    position: sticky;
    top: 0;
    z-index: 100;
}
.hp-nav-row {
    height: 49px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 34px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .055em;
    text-transform: uppercase;
}
.hp-nav-row a {
    height: 49px;
    display: flex;
    align-items: center;
    color: var(--ocbt-navy);
    text-decoration: none;
    border-bottom: 3px solid transparent;
    white-space: nowrap;
}
.hp-nav-row a:hover { color: var(--ocbt-wine); border-bottom-color: var(--ocbt-wine); text-decoration: none; }

/* --- Edition line (ticker) --- */
.hp-edition-line {
    height: 37px;
    border-bottom: 1px solid var(--ocbt-line);
    display: flex;
    align-items: center;
    overflow: hidden;
    white-space: nowrap;
    background: var(--ocbt-paper);
}
.hp-edition-line .container {
    display: flex;
    align-items: center;
    gap: 21px;
    overflow: hidden;
}
.hp-edition-label {
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .14em;
    color: var(--ocbt-wine);
    text-transform: uppercase;
    flex-shrink: 0;
}
.hp-edition-item {
    font: italic 12px "Source Serif 4", Georgia, serif;
    color: #4c4b47;
    white-space: nowrap;
}
.hp-edition-item::after {
    content: "◆";
    font-size: 5px;
    color: var(--ocbt-gold);
    margin-left: 21px;
    vertical-align: middle;
}

/* --- Override: remove the hp-utility inside <main> on homepage --- */
.ocbt-home > .hp-utility { display: none; }

/* --- Responsive masthead --- */
@media (max-width: 767px) {
    .hp-masthead-row { grid-template-columns: 1fr auto; }
    .hp-weather { display: none; }
    .hp-wordmark { text-align: left; }
    .hp-wordmark strong { font-size: 32px; }
    .hp-search-btn { display: none; }
    .hp-nav-shell { display: none; }
    .hp-nav-row { gap: 18px; overflow-x: auto; justify-content: flex-start; padding: 0 16px; }
}
/* =====================================================
   HOMEPAGE REFINEMENTS: LOGO, LARGE SEARCH & SECTIONS
   ===================================================== */
.hp-brand-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    gap: 14px;
}
.hp-header-logo {
    height: 48px;
    width: auto;
    object-fit: contain;
}
.hp-masthead-row {
    display: grid;
    grid-template-columns: 320px 1fr 320px;
    align-items: center;
    gap: 20px;
}
.hp-search-box {
    position: relative;
    border-bottom: 2px solid var(--ocbt-line);
    display: flex;
    align-items: center;
    padding-bottom: 4px;
    transition: border-color 0.3s;
    width: 100%;
}
.hp-search-box:focus-within {
    border-color: var(--ocbt-wine);
}
.hp-search-input {
    border: 0;
    outline: 0;
    background: transparent;
    width: 100%;
    font-size: 13px;
    font-weight: 500;
    color: var(--ocbt-navy);
    padding-right: 24px;
    font-family: inherit;
}
.hp-search-icon {
    position: absolute;
    right: 4px;
    font-size: 16px;
    color: var(--ocbt-muted);
    pointer-events: none;
}
.hp-search-box:focus-within .hp-search-icon {
    color: var(--ocbt-wine);
}

/* Sections for Test Series, Live Courses and Study Material */
.hp-tests-grid, .hp-courses-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 20px;
}
.hp-test-card, .hp-course-card {
    background: #fff;
    border: 1px solid var(--ocbt-line);
    border-radius: 6px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    transition: transform 0.2s, box-shadow 0.2s;
}
.hp-test-card:hover, .hp-course-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(20,38,61,0.06);
}
.hp-test-badge, .hp-course-time {
    font-size: 8px;
    font-weight: 900;
    color: var(--ocbt-wine);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    margin-bottom: 8px;
}
.hp-test-card h3, .hp-course-card h3 {
    font: 500 20px/1.2 "Source Serif 4", Georgia, serif;
    color: var(--ocbt-navy);
    margin: 0 0 10px 0;
}
.hp-test-card p, .hp-course-card p {
    font-size: 11px;
    line-height: 1.6;
    color: var(--ocbt-muted);
    margin: 0 0 20px 0;
    flex-grow: 1;
}
.hp-test-link, .hp-course-link {
    font-size: 9px;
    font-weight: 900;
    color: var(--ocbt-wine);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    text-decoration: none;
    margin-top: auto;
}
.hp-test-link:hover, .hp-course-link:hover {
    color: var(--ocbt-navy);
}

.hp-material-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 20px;
}
.hp-material-card {
    background: #fff;
    border: 1px solid var(--ocbt-line);
    border-radius: 6px;
    padding: 22px;
    display: flex;
    flex-direction: column;
    transition: transform 0.2s, box-shadow 0.2s;
}
.hp-material-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(20,38,61,0.06);
}
.hp-material-icon {
    font-size: 28px;
    margin-bottom: 12px;
}
.hp-material-card h3 {
    font: 500 17px/1.25 "Source Serif 4", Georgia, serif;
    color: var(--ocbt-navy);
    margin: 0 0 8px 0;
}
.hp-material-card p {
    font-size: 10px;
    line-height: 1.5;
    color: var(--ocbt-muted);
    margin: 0 0 16px 0;
    flex-grow: 1;
}
.hp-material-link {
    font-size: 9px;
    font-weight: 900;
    color: var(--ocbt-wine);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    text-decoration: none;
    margin-top: auto;
}
.hp-material-link:hover {
    color: var(--ocbt-navy);
}

@media (max-width: 1100px) {
    .hp-masthead-row {
        grid-template-columns: 1fr auto;
    }
    .hp-masthead-search-container {
        grid-column: span 2;
        order: 3;
        margin: 10px 0 0 0;
        max-width: 100%;
    }
    .hp-tests-grid, .hp-courses-grid {
        grid-template-columns: 1fr 1fr;
    }
    .hp-material-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 767px) {
    .hp-tests-grid, .hp-courses-grid {
        grid-template-columns: 1fr;
    }
    .hp-material-grid {
        grid-template-columns: 1fr;
    }
}
/* =====================================================
   HOMEPAGE FINAL REFINEMENTS & BRANDING ADJUSTMENTS
   ===================================================== */
.hp-brand-wrap {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    gap: 0 !important;
}
.hp-brand-top {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}
.hp-brand-top strong {
    font: 500 42px/.9 "Source Serif 4", Georgia, "Times New Roman", serif !important;
    letter-spacing: -.055em !important;
    color: var(--ocbt-navy) !important;
}
.hp-brand-top strong i {
    font-style: normal !important;
    color: var(--ocbt-wine) !important;
}
.hp-header-logo {
    height: 38px !important;
    width: auto !important;
    object-fit: contain !important;
}
.hp-brand-subtitle {
    display: block !important;
    margin-top: 6px !important;
    font-size: 9px !important;
    letter-spacing: .27em !important;
    text-transform: uppercase !important;
    color: var(--ocbt-gold) !important;
    font-weight: 800 !important;
    font-family: Manrope, Arial, sans-serif !important;
    text-align: center !important;
}

/* Thicker / darker line-based search */
.hp-search-box {
    border-bottom: 2.5px solid var(--ocbt-navy) !important;
}
.hp-search-box:focus-within {
    border-color: var(--ocbt-wine) !important;
}
.hp-search-input {
    font-weight: 600 !important;
    color: var(--ocbt-navy) !important;
}
.hp-search-icon {
    color: var(--ocbt-navy) !important;
}

/* Footer Grid & Columns Adjustments */
#footerSection .row.mt-5 {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
}
#footerSection .col-lg-2 {
    flex: 1 1 auto !important;
    min-width: 160px !important;
    margin-bottom: 20px !important;
}
#footerSection .col-lg-2:first-child {
    flex: 0 0 28% !important;
    min-width: 250px !important;
}
#footerSection .footer-link, 
#footerSection p, 
#footerSection span, 
#footerSection li,
#footerSection .footer-paragraph,
#footerSection .theme-color1 {
    color: #aab5c0 !important;
    font-size: 12.5px !important;
    line-height: 1.75 !important;
}
#footerSection .footer-heading {
    font-size: 16px !important;
    font-weight: 600 !important;
    margin-bottom: 18px !important;
}
#footerSection .footer-ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: grid !important;
    gap: 9px !important;
}

/* Footer Social Icons Brand Colors */
#footerSection .footer-icon.social-facebook {
    background: #1877f2 !important;
    border-color: #1877f2 !important;
}
#footerSection .footer-icon.social-instagram {
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%) !important;
    border-color: #d6249f !important;
}
#footerSection .footer-icon.social-youtube {
    background: #ff0000 !important;
    border-color: #ff0000 !important;
}
#footerSection .footer-icon.social-twitter {
    background: #000000 !important;
    border-color: #000000 !important;
}
#footerSection .footer-icon a i {
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    line-height: 1 !important;
    font-size: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
/* Bottom inline links layout */
.footer-bottom-links {
    color: #4b5d72 !important;
    font-size: 13px !important;
    font-family: Manrope, Arial, sans-serif !important;
    margin-bottom: 10px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px !important;
    align-items: center !important;
}
.footer-bottom-links a {
    color: #aab5c0 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: color 0.2s !important;
}
.footer-bottom-links a:hover {
    color: #fff !important;
    text-decoration: underline !important;
}
.text-white-50 {
    color: rgba(255, 255, 255, 0.5) !important;
}
/* Force footer columns on a single line using CSS Grid */
#footerSection .row.mt-5 {
    display: grid !important;
    grid-template-columns: 28% 13% 15% 15% 15% 14% !important;
    gap: 0 !important;
    width: 100% !important;
}
#footerSection .col-lg-2 {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    padding: 0 10px !important;
    margin-bottom: 0 !important;
}

@media (max-width: 991px) {
    #footerSection .row.mt-5 {
        grid-template-columns: 1fr 1fr !important;
        gap: 20px !important;
    }
    #footerSection .col-lg-2 {
        padding: 0 !important;
    }
}
@media (max-width: 575px) {
    #footerSection .row.mt-5 {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}
/* White circle background for footer logo */
#footerSection .footer-logo {
    background-color: #ffffff !important;
    border-radius: 50% !important;
    padding: 8px !important;
    width: 54px !important;
    height: 54px !important;
    object-fit: contain !important;
    display: inline-block !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15) !important;
}

/* Footer bottom copyright bar layout */
.footer-copyright-bar {
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
    padding: 20px 0 !important;
    margin-top: 40px !important;
}
.footer-copyright-inner {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
}
.footer-bottom-links {
    margin-bottom: 0 !important;
    display: flex !important;
    gap: 12px !important;
    align-items: center !important;
}
.hp-link-sep {
    color: #4b5d72 !important;
    font-size: 13px !important;
}
.footer-copyright-text {
    margin: 0 !important;
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 12.5px !important;
}
@media (max-width: 767px) {
    .footer-copyright-inner {
        flex-direction: column !important;
        text-align: center !important;
    }
}
/* Restore original colored logo inside the white circle */
#footerSection .footer-logo {
    filter: none !important;
}
/* Compact Subpage Header Refinements */
.hp-compact-header-sub {
    background: #ffffff !important;
    border-bottom: 2px solid var(--ocbt-navy) !important;
    box-shadow: 0 4px 12px rgba(20,38,61,0.05) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10000 !important;
    padding: 10px 0 !important;
}
.hp-compact-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
    padding: 0 20px !important;
}
.hp-nav-shell-sub {
    display: flex !important;
    gap: 18px !important;
}
.hp-nav-shell-sub a {
    font-family: Manrope, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: var(--ocbt-navy) !important;
    text-decoration: none !important;
    transition: color 0.2s !important;
}
.hp-nav-shell-sub a:hover, .hp-nav-shell-sub a.active {
    color: var(--ocbt-wine) !important;
}
.hp-compact-actions {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
}
.hp-search-box-sub {
    display: flex !important;
    align-items: center !important;
    border-bottom: 1.5px solid var(--ocbt-navy) !important;
    padding-bottom: 2px !important;
    width: 150px !important;
}
.hp-search-input-sub {
    border: none !important;
    outline: none !important;
    background: transparent !important;
    font-size: 12px !important;
    font-family: Manrope, Arial, sans-serif !important;
    font-weight: 600 !important;
    color: var(--ocbt-navy) !important;
    width: 100% !important;
}
.hp-search-box-sub .hp-search-icon {
    font-size: 14px !important;
    color: var(--ocbt-navy) !important;
}
.hp-lang-toggle-sub {
    font-family: Manrope, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: var(--ocbt-navy) !important;
    text-decoration: none !important;
    transition: color 0.2s !important;
}
.hp-lang-toggle-sub:hover {
    color: var(--ocbt-wine) !important;
}
.hp-signin-btn-sub {
    font-family: Manrope, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: #fff !important;
    background: var(--ocbt-navy) !important;
    border: 1px solid var(--ocbt-navy) !important;
    padding: 6px 14px !important;
    border-radius: 2px !important;
    text-decoration: none !important;
    transition: background 0.2s, color 0.2s !important;
}
.hp-signin-btn-sub:hover {
    background: var(--ocbt-wine) !important;
    border-color: var(--ocbt-wine) !important;
    color: #fff !important;
}

/* Typing Section on Homepage PHP */
.hp-section-typing {
	background: var(--ocbt-paper);
	border-top: 1px solid var(--ocbt-line);
	border-bottom: 1px solid var(--ocbt-line);
	padding: 40px 0 60px;
}
.hp-section-typing .hp-section-rule,
.hp-section-spoken .hp-section-rule {
	margin-bottom: 20px;
}
.hp-typing-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 30px;
}
.hp-typing-header h2 {
	font: 600 32px/1.12 "Source Serif 4", Georgia, serif;
	color: var(--ocbt-navy);
	margin: 0;
}
.hp-typing-header-link {
	font-family: Manrope, Arial, sans-serif;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ocbt-wine) !important;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.hp-typing-header-link:hover {
	color: var(--ocbt-navy) !important;
}
.hp-typing-card {
	background: #fff;
	border: 1px solid var(--ocbt-line);
	border-radius: 8px;
	overflow: hidden;
	display: grid;
	grid-template-columns: 1.2fr 0.8fr;
	min-height: 480px;
}
.hp-typing-card-left {
	padding: 40px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.hp-typing-card-right {
	background: #f0f2f5;
	overflow: hidden;
	display: flex;
	align-items: stretch;
	justify-content: center;
	border-left: 1px solid var(--ocbt-line);
	min-height: 460px;
}
.hp-typing-card-right img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top left;
	display: block;
}
.hp-badge-skill {
	background: var(--ocbt-wine);
	color: #fff !important;
	font-size: 9px;
	font-weight: 900;
	padding: 4px 8px;
	border-radius: 4px;
	text-transform: uppercase;
	letter-spacing: .05em;
	display: inline-block;
	margin-right: 12px;
}
.hp-badge-label {
	color: var(--ocbt-muted);
	font-size: 11px;
	font-weight: 600;
}
.hp-typing-card-left h3 {
	font: 700 28px/1.2 "Source Serif 4", Georgia, serif;
	color: var(--ocbt-wine);
	margin: 20px 0 14px;
}
.hp-typing-card-left p {
	font-size: 13px;
	line-height: 1.7;
	color: var(--ocbt-muted);
	margin-bottom: 24px;
}
.hp-latest-attempt-box {
	background: #f8fafc;
	border: 1px solid var(--ocbt-line);
	border-radius: 8px;
	padding: 16px;
	margin-bottom: 20px;
}
.hp-latest-attempt-header {
	font-size: 10px;
	font-weight: 800;
	text-transform: uppercase;
	color: var(--ocbt-wine);
	margin-bottom: 12px;
	letter-spacing: 0.05em;
}
.hp-metrics-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 12px;
	align-items: center;
	text-align: center;
}
.hp-metric-col {
	border-left: 1px solid var(--ocbt-line);
	padding-left: 8px;
}
.hp-metric-col:first-child {
	border-left: none;
	padding-left: 0;
}
.hp-metric-val {
	font-size: 18px;
	font-weight: 800;
	color: var(--ocbt-navy);
}
.hp-metric-val.val-green {
	color: #10b981;
}
.hp-metric-val.val-red {
	color: #ef4444;
}
.hp-metric-val span {
	font-size: 10px;
	color: var(--ocbt-muted);
	font-weight: 600;
}
.hp-metric-label {
	font-size: 9px;
	color: var(--ocbt-muted);
	text-transform: uppercase;
	font-weight: 700;
	margin-top: 2px;
}
.hp-start-test-btn {
	color: var(--ocbt-wine) !important;
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .1em;
	text-transform: uppercase;
	text-decoration: none !important;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	transition: color 0.2s ease;
}
.hp-start-test-btn:hover {
	color: var(--ocbt-navy) !important;
}

/* Spoken English Section on Homepage PHP */
.hp-section-spoken {
	background: var(--ocbt-cream);
	border-top: 1px solid var(--ocbt-line);
	border-bottom: 1px solid var(--ocbt-line);
	padding: 40px 0 60px;
}
.hp-spoken-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
}
.hp-spoken-header h2 {
	font: 600 32px/1.12 "Source Serif 4", Georgia, serif;
	color: var(--ocbt-navy);
	margin: 0;
}
.hp-spoken-header-link {
	font-family: Manrope, Arial, sans-serif;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ocbt-wine) !important;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.hp-spoken-header-link:hover {
	color: var(--ocbt-navy) !important;
}

/* Split layout matching student portal */
.hp-spoken-split {
	display: grid;
	grid-template-columns: 1.2fr 0.8fr;
	background: #fff;
	border: 1px solid var(--ocbt-line);
	border-radius: 4px;
	overflow: hidden;
	min-height: 360px;
}
.hp-spoken-featured {
	padding: 32px 36px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	color: var(--ocbt-navy);
	text-decoration: none !important;
	border-right: 1px solid var(--ocbt-line);
	transition: background 0.2s;
}
.hp-spoken-featured:hover {
	background: #fafaf9;
}
.hp-spoken-featured-meta {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 16px;
}
.hp-spoken-featured h3 {
	font: 600 26px/1.2 "Source Serif 4", Georgia, serif;
	color: var(--ocbt-wine);
	margin: 0 0 12px;
}
.hp-spoken-featured p {
	font-size: 13px;
	line-height: 1.7;
	color: var(--ocbt-muted);
	margin: 0 0 24px;
}
.hp-spoken-learn-link {
	font-family: Manrope, Arial, sans-serif;
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ocbt-wine) !important;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.hp-spoken-sidebar {
	display: flex;
	flex-direction: column;
}
.hp-spoken-sidebar-header {
	font-family: Manrope, Arial, sans-serif;
	font-size: 10px;
	font-weight: 900;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ocbt-muted);
	padding: 18px 24px 12px;
	border-bottom: 1px solid var(--ocbt-line);
}
.hp-spoken-sidebar-list {
	display: flex;
	flex-direction: column;
}
.hp-spoken-sidebar-item {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 14px 24px;
	border-bottom: 1px solid var(--ocbt-line);
	text-decoration: none !important;
	color: var(--ocbt-navy) !important;
	transition: background 0.15s;
}
.hp-spoken-sidebar-item:hover {
	background: #f8fafc;
}
.hp-spoken-item-no {
	font-family: Manrope, Arial, sans-serif;
	font-size: 9px;
	font-weight: 900;
	letter-spacing: .05em;
	background: var(--ocbt-navy);
	color: #fff;
	padding: 3px 7px;
	border-radius: 3px;
	white-space: nowrap;
	flex-shrink: 0;
}
.hp-spoken-item-title {
	font-size: 13px;
	font-weight: 600;
	color: var(--ocbt-navy);
	line-height: 1.4;
}

/* student-split-featured-tag reused in spoken */
.hp-spoken-featured-meta .student-split-featured-tag {
	background: var(--ocbt-wine);
	color: #fff !important;
	font-family: Manrope, Arial, sans-serif;
	font-size: 9px;
	font-weight: 900;
	padding: 3px 8px;
	border-radius: 3px;
	text-transform: uppercase;
	letter-spacing: .05em;
}
.hp-spoken-featured-meta .student-split-featured-date {
	font-family: Manrope, Arial, sans-serif;
	font-size: 11px;
	font-weight: 600;
	color: var(--ocbt-muted);
}

@media (max-width: 991px) {
	.hp-typing-card {
		grid-template-columns: 1fr;
	}
	.hp-spoken-split {
		grid-template-columns: 1fr;
	}
	.hp-typing-card-right {
		border-left: none;
		border-top: 1px solid var(--ocbt-line);
		height: 300px;
	}
	.hp-spoken-featured {
		border-right: none;
		border-bottom: 1px solid var(--ocbt-line);
	}
}
@media (max-width: 767px) {
	.hp-metrics-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 16px;
	}
	.hp-metric-col {
		border-left: none;
		padding-left: 0;
	}
}
@media (max-width: 767px) {
	.hp-metrics-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 16px;
	}
	.hp-metric-col {
		border-left: none;
		padding-left: 0;
	}
}