/* =========================================================
   ALL PUBLIC PAGES IN ONE FILE  —  design tokens, base, top bar, navbar, footer, floating buttons,
   then one block per page (HOME, COURSES, COURSE DETAIL, ABOUT, CONTACT, CAREERS, BECOME AN INSTRUCTOR,
   CERTIFICATE, VOUCHERS, VOUCHER DETAIL, SIGN IN, CREATE ACCOUNT). Image paths are relative to common/.
   The Instructor Dashboard keeps its own instructor/dashboard.css.
   ========================================================= */
:root{/* ---- Colors (design notes) ---- */
  --primary:#076FE6;          /* main blue */
  --primary-dark:#0562CE;     /* hover shade of primary */
  --navy:#1B4597;
  --dark:#04152C;             /* headings / dark text */
  --yellow:#F2FB00;           /* "New" badge */
  --lime:#C0FB3F;             /* "Featured" badge */
  --light-blue:#E7F3FD;       /* light section backgrounds */
  --lavender:#E7E7FD;
  --mint:#E4FBEB;
  --icon-blue:#1770E5;
  --icon-blue-2:#0668EE;
  --purple:#5A3EF9;
  --green:#04BC5F;
  --text:#4b5563;
  --hero-bg:#EDF6FD;          /* matches baked-in bg of hero image */
  --soft-bg:var(--light-blue);
  --border:var(--icon-blue);

  /* ---- Typography & spacing (design notes) ---- */
  --section-gap:37px;
  --fs-heading:44.3px;        /* Poppins bold */
  --fs-subheading:21px;       /* Poppins semibold */
  --fs-desc:13px;             /* Poppins medium */
  --fs-btn:13px;
  --fs-footer:13px;
  --fs-footer-heading:16px;

  /* ---- Page text scale (same on every page, header/footer excluded) ----
     taken from the Contact page form: Poppins everywhere */
  --fs-tag:13px;              /* small blue uppercase label, 500 */
  --fs-title:30px;            /* section heading, 600 */
  --fs-sub:15px;              /* hero / section description, 400 */
  --fs-card-title:16px;       /* card / item heading, 600 */
  --fs-label:14px;            /* labels, inputs, card text, 500/400 */
  --fs-small:11px;            /* helper text, meta, errors, 400 */
  --fs-btn-lg:16px;           /* page buttons, 500 */}
@media (max-width:576px){
  :root{--fs-heading:32px;--fs-title:24px}
}
*{box-sizing:border-box}
body{font-family:'Poppins',sans-serif;color:var(--dark);background:#fff;overflow-x:hidden}
a{text-decoration:none}
img{max-width:100%}
.btn-primary{background:var(--primary);border-color:var(--primary)}
.btn-primary:hover{background:var(--primary-dark);border-color:var(--primary-dark)}
/* ---------- Top bar ---------- */
.common_topbar{background:var(--light-blue);font-size:10px;padding:8px 0;color:#444}
.common_topbar a{color:#444}
.common_topbar .common_sep{width:1px;height:14px;background:#c9d3e3}
/* ---------- Navbar ---------- */
.common_main_nav{background:#fff;padding:10px 0;box-shadow:0 1px 0 #eef1f6}
.common_main_nav .navbar-brand img{height:32px}
.common_main_nav .nav-link{font-size:10px;color:#333;padding:6px 9px!important}
.common_main_nav .nav-link.active{font-weight:600;color:#000}
.common_main_nav .nav-link:hover{color:var(--primary)}
.common_search_box{border:1px solid #d6dbe4;border-radius:6px;align-items:center;padding-left:10px;height:30px;overflow:hidden;min-width:300px}
.common_search_box i{color:#555;font-size:14px}
.common_search_box input{border:0;outline:0;font-size:9px;flex:1;padding:0 8px;border-right:1px solid #d6dbe4;height:100%}
.common_search_box .btn{font-size:10px;font-weight:600;border-radius:5px;padding:0 12px;height:30px}
.common_nav_actions .bi-heart{color:#e0204c;font-size:20px}
.common_nav_actions .common_cart{position:relative;color:var(--navy);font-size:20px}
.common_nav_actions .common_cart span{position:absolute;top:-4px;right:-7px;background:var(--primary);color:#fff;font-size:8px;width:13px;height:13px;border-radius:50%;display:grid;place-items:center}
/* wishlist heart: number of saved courses, same badge as the cart */
.common_nav_actions .common_icon_link_heart{position:relative}
.common_nav_actions .common_icon_link_heart span{position:absolute;top:-4px;right:-8px;background:var(--primary);color:#fff;font-size:8px;min-width:13px;height:13px;padding:0 3px;border-radius:7px;display:grid;place-items:center;line-height:1}
.common_btn_login{font-size:10px;padding:6px 14px;border-color:#b9c4d6;color:#222}
.common_btn_login:hover{background:var(--primary);color:#fff}
.common_btn_start{font-size:12px;font-weight:500;padding:6px 16px}
/* ---------- Footer ---------- */
.common_footer{padding:36px 0 14px;background:#fff}
.common_footer_logo{height:32px;margin-bottom:12px}
.common_footer .common_about{font-size:10px;color:#444;line-height:1.7;max-width:290px}
.common_socials{display:flex;gap:12px;margin-top:14px}
.common_socials a{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;font-size:14px}
.common_socials .common_fb{color:#1877f2}
.common_socials .common_ig{background:linear-gradient(45deg,#f9a825,#e1306c,#833ab4);color:#fff;border-radius:6px;font-size:12px}
.common_socials .common_yt{color:#ff0000;font-size:17px}
.common_socials .common_in{color:#0a66c2}
.common_footer h6{font-size:13px;font-weight:600;color:var(--navy);margin-bottom:10px}
.common_footer ul{list-style:none;padding:0;margin:0}
.common_footer ul li{margin-bottom:6px}
.common_footer ul a{font-size:10px;color:#444}
.common_footer ul a:hover{color:var(--primary)}
.common_footer .common_small_text{font-size:9px;color:#444}
.common_newsletter{display:flex;border:1px solid #cdd5e1;border-radius:5px;overflow:hidden;height:34px;max-width:212px}
.common_newsletter input{border:0;outline:0;flex:1;font-size:9px;padding:0 12px;min-width:0}
.common_newsletter button{width:34px;background:var(--primary);color:#fff;border:0}
.common_footer_bottom{border-top:1px solid #333;margin-top:30px;padding-top:14px;font-size:9px;color:#444}
.common_footer_bottom a{color:var(--primary)}
@media (min-width:992px){
  .common_col_lg_1_5{flex:0 0 auto;width:12.5%}
}
/* ---------- Responsive ---------- */
@media (max-width:1199px){
  .common_search_box{min-width:0;width:100%}
  .common_nav_actions{margin-top:10px}
  .common_main_nav .nav-link{font-size:13px}
}
/* ---------- Layout fixes to match design ---------- */
@media (min-width:1100px){
  .container{max-width:1060px}
}
@media (min-width:992px) and (max-width:1199px){
  .common_main_nav .navbar-collapse{flex-wrap:nowrap}
  .common_main_nav .nav-link{font-size:9px;padding:6px 5px!important}
  .common_search_box{min-width:0;width:240px}
  .common_nav_actions{margin-top:0;gap:8px!important}
  .common_btn_start{font-size:10px;padding:6px 10px}
  .common_main_nav .navbar-brand{margin-right:10px!important}
  .common_main_nav .navbar-brand img{height:28px}
}
@media (min-width:1200px){
  .common_main_nav .nav-link{font-size:11px}
  .common_search_box{min-width:320px}
}
.common_search_box .btn{flex-shrink:0}
.common_search_box input{min-width:0}
html,body{overflow-x:hidden}
/* ---------- Pixel match with reference design ---------- */
.common_main_nav .navbar-brand img{height:34px}
.common_footer ul li{font-size:10px;line-height:1.5;margin-bottom:4px}
.common_footer h6{margin-bottom:8px}
.common_newsletter{max-width:213px}
@media (min-width:992px){
  .common_main_nav .nav-link,.common_btn_login,.common_btn_start{white-space:nowrap}
  .common_nav_actions{margin-left:14px!important}
  .common_footer .common_f_about{width:31.5%}
  .common_footer .common_f_quick{width:14.3%}
  .common_footer .common_f_cat{width:18%}
  .common_footer .common_f_sup{width:15.8%}
  .common_footer .common_f_news{width:20.4%}
}
@media (min-width:1100px){
  .common_search_box{width:300px;min-width:300px}
  .common_main_nav .nav-link{font-size:9.5px;padding:6px 7px!important}
}
/* ---------- Navbar full width + rounded search ---------- */
.common_search_box{border-radius:8px;padding-right:3px}
.common_search_box .btn{height:24px;border-radius:6px}
@media (min-width:992px){
  .common_main_nav .navbar-collapse{justify-content:space-between}
  .common_main_nav .navbar-nav,.common_nav_actions{flex-shrink:0}
  .common_main_nav .common_search_box{flex:1 1 300px;max-width:560px;margin:0 12px!important}
  .common_nav_actions{margin-left:12px!important}
}
@media (min-width:1600px){
  .common_main_nav .nav-link{font-size:12px;padding:6px 12px!important}
  .common_search_box input{font-size:11px}
  .common_search_box{height:36px}
  .common_search_box .btn{height:30px;font-size:12px}
  .common_btn_login{font-size:12px}
  .common_btn_start{font-size:14px}
  .common_nav_actions{gap:22px!important}
}
.common_main_nav .navbar-brand{flex-shrink:0}
.common_main_nav .navbar-brand img{width:auto}
@media (min-width:992px) and (max-width:1399px){
  .common_main_nav .common_search_box{min-width:200px;flex-basis:200px;margin:0 8px!important}
  .common_nav_actions{gap:10px!important;margin-left:8px!important}
}
.common_main_nav .navbar-collapse{min-width:0}
/* ---------- Topbar + navbar aligned (≈17.5rem / 14.5rem at 1920px) ---------- */
@media (min-width:992px){
  .common_topbar .container-fluid,.common_main_nav .container-fluid,.common_footer .container-fluid{padding-left:max(1.5rem, calc(50% - 704px + 1.5rem))!important;
    padding-right:max(1.5rem, calc(50% - 704px - 1.5rem))!important;}
}
/* ---------- Pill search box ---------- */
.common_search_box{border:1px solid #d6dbe4;border-radius:20px!important;align-items:center;padding-left:10px;height:30px;overflow:hidden}
.common_search_box .btn{border-radius:16px}
@media (min-width:1400px){
  .common_main_nav .common_search_box{min-width:300px}
}
/* ---------- Design tokens applied (FORMAT NOTE) ---------- */
body{color:var(--dark)}
.common_footer{padding-top:var(--section-gap)}
.common_btn_start,.common_btn_login,.common_search_box .btn{font-size:var(--fs-btn)}
.common_footer,.common_footer ul li,.common_footer ul a,.common_footer .common_about,.common_footer .common_small_text,.common_footer_bottom,.common_newsletter input{font-size:var(--fs-footer)}
.common_footer h6{font-size:var(--fs-footer-heading);color:var(--navy)}
.common_topbar .bi-globe2{color:var(--icon-blue-2)!important}
/* ---------- Mobile ---------- */
@media (max-width:991px){
  .common_main_nav .navbar-collapse{padding:10px 0}
  .common_main_nav .nav-link{font-size:14px;padding:8px 4px!important}
  .common_main_nav .common_search_box{width:100%;min-width:0;height:40px;margin:8px 0!important}
  .common_main_nav .common_search_box input{font-size:13px}
  .common_main_nav .common_search_box .btn{height:32px;font-size:13px}
  .common_main_nav .navbar-nav.ms-2{margin-left:0!important}
  .common_nav_actions{flex-wrap:wrap;margin-top:8px}
  .common_nav_actions .btn{font-size:13px;padding:7px 16px}
  .common_footer ul a,.common_footer .common_about,.common_footer .common_small_text{font-size:12px}
  .common_newsletter{max-width:100%}
}
@media (max-width:576px){
  .common_topbar span:first-child{font-size:9px;max-width:55%}
  .common_footer_bottom{justify-content:center!important;text-align:center}
}

/* ---------- Hero text: one style on every page (taken from the Contact hero) ---------- */
.home_page_hero h1,.c-hero h1,.about_page_hero h1,.contact_page_hero h1,.career_page_hero h1,.instructor_page_hero h1,.certificate_page_hero h1,.voucher_page_hero h1,.voucher_detail_page_hero h1,.sign_in_page_hero h1,.create_account_page_hero h1,.common_wave_hero h1{
  font-family:'Poppins',sans-serif!important;font-size:var(--fs-heading)!important;font-weight:700!important;
  line-height:1.1!important;letter-spacing:-.6px!important;color:var(--dark);margin:0 0 18px!important}
.home_page_hero h1 span,.c-hero h1 span,.about_page_hero h1 span,.contact_page_hero h1 span,.career_page_hero h1 span,.instructor_page_hero h1 span,.certificate_page_hero h1 span,.voucher_page_hero h1 span,.voucher_detail_page_hero h1 span,.sign_in_page_hero h1 span,.create_account_page_hero h1 span,.common_wave_hero h1 span{color:var(--primary)}
.home_page_hero .home_page_lead_text,.c-hero-sub,.about_page_hero_sub,.contact_page_hero_sub,.career_page_hero_sub,.instructor_page_hero_sub,.certificate_page_hero_sub,.voucher_page_hero_sub,.voucher_detail_page_hero_sub,.sign_in_page_hero_sub,.create_account_page_hero_sub{
  font-family:'Poppins',sans-serif!important;font-size:var(--fs-sub)!important;font-weight:400!important;
  line-height:1.6!important;color:#4b5563!important;max-width:460px}

/* ---------- Footer: bigger text (sizes from --fs-footer / --fs-footer-heading) ---------- */
.common_footer ul li{margin-bottom:7px;line-height:1.5}
.common_footer h6{margin-bottom:12px}
.common_footer .common_about{max-width:340px}
.common_footer_logo{height:36px}
.common_newsletter{height:40px;max-width:250px}
.common_newsletter button{width:40px;font-size:16px}
.common_socials a{width:28px;height:28px;font-size:18px}
.certificate_page_nl_err{font-size:12px!important}
@media (max-width:991px){
  .common_footer ul a,.common_footer .common_about,.common_footer .common_small_text{font-size:var(--fs-footer)}
}
@media (min-width:992px){.common_footer ul a{white-space:nowrap}}

/* ---------- Navbar with the extra "Vouchers" link: search box gives up space so "Get Started" stays on the header line ---------- */
@media (min-width:992px){
  .common_main_nav .common_search_box{min-width:150px!important;flex-basis:150px}
}
@media (min-width:992px) and (max-width:1399px){
  .common_main_nav .nav-link{padding:6px 6px!important}
}
@media (min-width:1600px){
  .common_main_nav .nav-link{padding:6px 9px!important}
  .common_main_nav .common_search_box{min-width:230px!important}
}

/* =========================================================
   Floating buttons (every page, built by common.js): scroll up/down, AI Assistant, WhatsApp
   ========================================================= */
.common_float{position:fixed;right:22px;bottom:22px;z-index:1050;display:grid;grid-template-columns:auto auto;gap:10px 12px;justify-items:center;align-items:end}
.common_float_btn{width:48px;height:48px;border-radius:50%;border:0;padding:0;display:grid;place-items:center;position:relative;cursor:pointer;
  box-shadow:0 4px 12px rgba(4,21,44,.3);transition:transform .15s}
.common_float_btn:hover{transform:translateY(-2px)}
.common_scroll{grid-column:2;background:#fff;border:3px solid var(--dark);color:var(--dark);font-size:24px;-webkit-text-stroke:1px}
.common_scroll[hidden]{display:none}
.common_wa{grid-column:2;grid-row:2;background:#25D366;color:#fff;font-size:27px}
.common_wa:hover{color:#fff}
#commonChatToggle{grid-column:1;grid-row:2}
/* robot avatar: blue circle, white robot, green "online" dot */
.common_bot{background:linear-gradient(160deg,#2F8BFF,#0B5BD3)}
.common_bot svg{width:76%;height:76%;display:block}
.common_bot b{position:absolute;right:1px;bottom:3px;width:11px;height:11px;border-radius:50%;background:#22C55E;border:2px solid #fff}

/* ---------- AI Assistant box ---------- */
.common_chat{position:absolute;right:60px;bottom:60px;width:300px;max-height:min(520px,calc(100vh - 110px));display:flex;flex-direction:column;
  background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 10px 34px rgba(4,21,44,.32);font-family:'Poppins',sans-serif}
.common_chat[hidden]{display:none}
.common_chat_head{display:flex;align-items:center;gap:10px;padding:12px 12px 12px 14px;color:#fff;flex-shrink:0;
  background:linear-gradient(120deg,#0B5BD3 0 62%,#2F8BFF 62% 80%,#0B5BD3 80%)}
.common_chat_avatar{position:relative;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;border:2px solid rgba(255,255,255,.55)}
.common_chat_avatar b{right:-1px;bottom:0}
.common_chat_title{flex:1;min-width:0;line-height:1.3}
.common_chat_title strong{display:block;font-size:14px;font-weight:600}
.common_chat_title small{display:flex;align-items:center;gap:5px;font-size:10px;opacity:.95}
.common_chat_title small i{width:7px;height:7px;border-radius:50%;background:#4ADE80}
.common_chat_head button{border:0;background:none;color:#fff;font-size:16px;padding:4px 6px;line-height:1;border-radius:6px}
.common_chat_head button:hover{background:rgba(255,255,255,.18)}

.common_chat_body{flex:1;min-height:150px;overflow-y:auto;padding:14px 12px 6px;display:flex;flex-direction:column;gap:10px}
.common_chat_msg{display:flex;gap:8px;align-items:flex-start;max-width:88%}
.common_chat_mini{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;flex-shrink:0}
.common_chat_msg p{margin:0;padding:8px 12px;border-radius:4px 14px 14px 14px;background:#EEF3FA;font-size:12px;line-height:1.5;color:var(--dark);overflow-wrap:anywhere}
.common_chat_msg p a{color:var(--primary);font-weight:500;text-decoration:underline}
.common_chat_msg small{display:block;font-size:9px;color:#6b7280;margin:4px 0 0 4px}
.common_chat_user{align-self:flex-end}
.common_chat_user p{background:var(--primary);color:#fff;border-radius:14px 4px 14px 14px}
.common_chat_user small{text-align:right;margin:4px 4px 0 0}
.common_chat_typing p{display:flex;gap:4px;padding:11px 12px}
.common_chat_typing p i{width:6px;height:6px;border-radius:50%;background:#8a94a6;animation:common_chat_blink 1s infinite}
.common_chat_typing p i:nth-child(2){animation-delay:.15s}
.common_chat_typing p i:nth-child(3){animation-delay:.3s}
@keyframes common_chat_blink{0%,80%,100%{opacity:.3}40%{opacity:1}}

.common_chat_quick{padding:6px 12px 10px;flex-shrink:0}
.common_chat_quick>p{font-size:10px;color:#4b5563;margin:0 0 6px}
.common_chat_quick>div{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.common_chat_quick button{display:flex;align-items:center;gap:8px;text-align:left;background:#fff;border:1px solid #4b6390;border-radius:10px;padding:6px 8px;
  font-size:10.5px;font-weight:500;line-height:1.3;color:var(--dark)}
.common_chat_quick button:hover{border-color:var(--primary);background:#F1F7FE}
.common_chat_quick button>span:nth-child(2){flex:1}
.common_chat_quick button>i{font-size:10px;color:var(--navy);-webkit-text-stroke:.6px}
.common_chat_qicon{width:26px;height:26px;border-radius:6px;display:grid;place-items:center;font-size:15px;flex-shrink:0}
.common_chat_blue{background:#E1EDFD;color:#1B4597}
.common_chat_green{background:#DDF6E6;color:#16A34A}
.common_chat_red{background:#FDE5E5;color:#E5252A}
.common_chat_orange{background:#FEF0D7;color:#F59E0B}

.common_chat_form{display:flex;align-items:center;gap:8px;margin:0 8px 10px;padding:5px 6px 5px 10px;border:1px solid #c6cedb;border-radius:26px;flex-shrink:0}
.common_chat_clip{font-size:17px;color:#4b5563;cursor:pointer;margin:0;line-height:1}
.common_chat_input{flex:1;min-width:0;display:flex;align-items:center;height:32px;border:1px solid #4b6390;border-radius:20px;padding:0 8px 0 12px}
.common_chat_input input{flex:1;min-width:0;border:0;outline:0;background:none;font-size:11px;color:var(--dark)}
.common_chat_input button{border:0;background:none;padding:0;font-size:15px;color:#374151;line-height:1}
.common_chat_send{width:32px;height:32px;border-radius:50%;border:0;background:var(--primary);color:#fff;font-size:14px;display:grid;place-items:center;flex-shrink:0}
.common_chat_send:hover{background:var(--primary-dark)}

@media (max-width:576px){
  .common_float{right:12px;bottom:12px}
  .common_float_btn{width:44px;height:44px}
  .common_chat{position:fixed;right:12px;left:12px;bottom:68px;width:auto;max-height:calc(100vh - 84px)}
}

/* ---------- Mobile / tablet fixes ---------- */
@media (max-width:576px){
  /* room under the footer so the floating buttons do not cover its last line */
  .common_footer{padding-bottom:64px}
}
@media (min-width:992px) and (max-width:1199px){
  /* small laptops / landscape tablets: the navbar has no spare room, so the search box drops its button
     (Enter still searches) and shrinks, which keeps "Get Started" on the screen */
  .common_main_nav .common_search_box{min-width:64px!important;flex:1 1 64px;margin:0 6px!important;padding-right:8px}
  .common_main_nav .common_search_box .btn{display:none}
  .common_main_nav .common_search_box input{border-right:0}
}


/* =========================================================
   HOME PAGE  (header/footer styles live in ../common/common.css)
   ========================================================= */
/* ---------- Hero ---------- */
.home_page_hero{background:var(--hero-bg);padding:50px 0 0;overflow:hidden}
.home_page_hero_text{padding-bottom:40px}
.home_page_hero .home_page_eyebrow{font-size:10px;font-weight:500;color:#333;margin-bottom:6px}
.home_page_hero h1{font-size:46px;font-weight:700;line-height:1;letter-spacing:-1.5px;color:var(--dark)}
.home_page_hero h1 span{color:var(--primary)}
.home_page_hero .home_page_lead_text{font-size:13px;color:#444;line-height:1.8;max-width:420px;margin:26px 0 16px}
.home_page_btn_hero{font-size:13px;padding:9px 20px;border-radius:4px}
.home_page_stats{margin-top:32px}
.home_page_stat{display:flex;align-items:center;gap:10px}
.home_page_stat img{width:42px}
.home_page_stat h5{font-size:15px;margin:0;font-weight:500}
.home_page_stat p{font-size:12px;margin:0;color:#444}
.home_page_hero_img img{display:block;margin-left:auto}
/* ---------- Section headings ---------- */
.home_page_section_title{font-size:21px;font-weight:600;margin-bottom:4px;color:var(--dark)}
.home_page_section_sub{font-size:12px;color:#555;margin:0}
.home_page_view_all{font-size:12px;font-weight:500;color:var(--primary)}
/* ---------- Categories ---------- */
.home_page_categories{padding:22px 0 30px}
.home_page_slider_wrap{position:relative;margin-top:18px}
.home_page_cat_track{display:flex;gap:14px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;padding:2px}
.home_page_cat_track::-webkit-scrollbar{display:none}
.home_page_cat_card{flex:0 0 calc((100% - 98px)/8);min-width:110px;height:102px;border:1.5px solid var(--border);border-radius:5px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#fff;cursor:pointer;transition:.2s}
.home_page_cat_card:hover{box-shadow:0 6px 18px rgba(10,108,229,.18)}
.home_page_cat_card img{width:48px;height:48px;border-radius:50%}
.home_page_cat_card span{font-size:11px;color:#222}
.home_page_slide_btn{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid #ddd;box-shadow:0 3px 8px rgba(0,0,0,.2);z-index:2;display:grid;place-items:center}
.home_page_slide_btn.home_page_prev{left:-18px}
.home_page_slide_btn.home_page_next{right:-18px}
/* ---------- Featured Courses (3D deck) ---------- */
.home_page_featured{padding:24px 0 30px}
.home_page_course_stage{position:relative;height:360px;margin-top:20px}
.home_page_course_deck{position:relative;height:100%}
.home_page_course_card{position:absolute;top:50%;left:50%;width:296px;background:#fff;border:1.5px solid #9fb6d8;border-radius:6px;padding:8px 10px 14px;transition:transform .5s ease,opacity .5s;box-shadow:0 4px 14px rgba(0,0,0,.08)}
.home_page_course_card.home_page_center{border-color:var(--border)}
.home_page_course_card .home_page_badge_tag{display:inline-block;background:var(--yellow);color:var(--dark);font-size:12px;padding:2px 10px;border-radius:4px;margin-bottom:6px}
.home_page_course_card.home_page_center .home_page_badge_tag{background:var(--lime)}
.home_page_course_card .home_page_fav{position:absolute;right:6px;top:10px;background:#fff;border-radius:50%;width:26px;height:26px;display:grid;place-items:center;color:#e0204c;box-shadow:0 1px 4px rgba(0,0,0,.2)}
.home_page_course_card .home_page_thumb{border:1px solid var(--navy);border-radius:4px;overflow:hidden}
.home_page_course_card .home_page_thumb img{width:100%;display:block}
.home_page_course_card h4{font-size:17px;font-weight:500;line-height:1.3;margin:12px 0 8px;color:var(--dark)}
.home_page_course_card .home_page_rating{font-size:14px}
.home_page_course_card .home_page_rating i{color:#f5a623}
.home_page_course_card .home_page_rating small{color:#555}
.home_page_course_card .home_page_meta{display:flex;align-items:center;gap:6px;font-size:14px;color:#555;margin-top:8px}
.home_page_course_card .home_page_meta .bi-clock{color:var(--primary)}
.home_page_course_card .home_page_meta .bi-play-circle-fill{color:var(--primary);font-size:18px}
.home_page_course_card .home_page_cart_btn{position:absolute;right:12px;bottom:14px;width:40px;height:36px;background:var(--primary);color:#fff;border-radius:4px;display:grid;place-items:center;font-size:20px;border:0}
.home_page_stage_btn{position:absolute;top:50%;transform:translateY(-50%);z-index:50;width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid #ddd;box-shadow:0 3px 10px rgba(0,0,0,.25);font-size:18px}
.home_page_stage_btn.home_page_prev{left:-17px}
.home_page_stage_btn.home_page_next{right:-17px}
.home_page_dots{display:flex;justify-content:center;align-items:center;gap:4px;margin-top:10px}
.home_page_dots span{width:6px;height:6px;border-radius:50%;background:#7a8597;cursor:pointer;transition:.3s}
.home_page_dots span.home_page_near{width:9px;height:9px;background:#3d4a60}
.home_page_dots span.home_page_active{width:15px;height:15px;background:var(--primary)}
/* ---------- Become Instructor ---------- */
.home_page_instructor_section{padding:30px 0 36px}
.home_page_instructor_box{position:relative;background:#E4F0FD;border-radius:14px;overflow:hidden;min-height:275px}
.home_page_instructor_box::before{content:"";position:absolute;right:0;top:0;width:200px;height:120px;background:var(--primary);border-bottom-left-radius:100% 60%}
.home_page_instructor_text{padding:40px 36px;position:relative;z-index:1}
.home_page_instructor_text h2{font-size:44px;font-weight:700;line-height:.95;letter-spacing:-1px;color:var(--dark)}
.home_page_instructor_text h2 span{color:var(--navy)}
.home_page_instructor_text p{font-size:13px;color:#333;line-height:1.7;margin:14px 0 24px;max-width:320px}
.home_page_instructor_img{align-self:flex-end}
.home_page_instructor_img img{display:block;margin:0 auto;max-height:275px}
.home_page_benefits{position:relative;z-index:1;background:#fff;border-radius:6px;padding:12px 22px;margin:20px 36px 20px 0;box-shadow:0 2px 12px rgba(0,0,0,.05)}
.home_page_benefit{display:flex;align-items:center;gap:14px;padding:9px 0;font-size:13px;font-weight:500}
.home_page_benefit img{width:32px}
/* ---------- Testimonials ---------- */
.home_page_testimonials{background:var(--soft-bg);padding:34px 0 30px}
.home_page_testi_card{background:#fff;border-radius:6px;padding:12px 16px;display:flex;gap:18px;height:100%;min-height:125px}
.home_page_testi_card>img{width:60px;height:60px;border-radius:50%;flex-shrink:0}
.home_page_testi_card .home_page_quote{font-size:9px;color:#555;line-height:1.7;margin:6px 0 10px}
.home_page_testi_card h6{font-size:12px;margin:0;font-weight:500}
.home_page_testi_card small{font-size:10px;color:#666}
.home_page_testi_card .home_page_stars{color:#f5a623;font-size:11px;letter-spacing:2px;margin-top:2px}
@media (max-width:991px){
  .home_page_hero{text-align:center}
  .home_page_hero .home_page_lead_text{margin-left:auto;margin-right:auto}
  .home_page_stats{justify-content:center}
  .home_page_hero_img img{margin:0 auto}
  .home_page_instructor_text{text-align:center}
  .home_page_instructor_text p{margin-left:auto;margin-right:auto}
  .home_page_benefits{margin:20px}
}
@media (max-width:576px){
  .home_page_hero h1{font-size:32px}
  .home_page_instructor_text h2{font-size:34px}
  .home_page_course_card{width:260px}
  .home_page_slide_btn.home_page_prev,.home_page_stage_btn.home_page_prev{left:-6px}
  .home_page_slide_btn.home_page_next,.home_page_stage_btn.home_page_next{right:-6px}
}
.home_page_hero h1 span{white-space:nowrap}
.home_page_instructor_text h2{white-space:nowrap}
.home_page_hero_text{align-self:center}
@media (min-width:992px){
  .home_page_stats{flex-wrap:nowrap!important}
  .home_page_hero_img img{width:100%;max-width:540px}
}
.home_page_featured{overflow:hidden}
@media (max-width:576px){
  .home_page_hero h1 span{white-space:normal}
  .home_page_instructor_text h2{white-space:normal}
}
@media (min-width:992px){
  .home_page_hero_text{width:53%;padding-left:30px}
  .home_page_hero_img{width:47%;margin-right:-50px}
  .home_page_hero_img img{max-width:520px}
  .home_page_stat p{white-space:nowrap}
  .home_page_instructor_box{margin:0 -27px}
  .home_page_instructor_text{padding-left:36px}
}
.home_page_categories,.home_page_featured,.home_page_instructor_section,.home_page_testimonials{padding:var(--section-gap) 0}
.home_page_hero h1,.home_page_instructor_text h2{font-size:var(--fs-heading);font-weight:700}
.home_page_section_title{font-size:var(--fs-subheading);font-weight:600;color:var(--dark)}
.home_page_section_sub,.home_page_hero .home_page_lead_text,.home_page_instructor_text p{font-size:var(--fs-desc);font-weight:500}
.home_page_btn_hero{font-size:var(--fs-btn)}
.home_page_instructor_text h2 span{color:var(--navy)}
.home_page_course_card .home_page_meta .bi-clock,.home_page_course_card .home_page_meta .bi-play-circle-fill{color:var(--icon-blue)}
.home_page_course_card .home_page_badge_tag{color:var(--dark)}
/* ---------- Mobile ---------- */
@media (max-width:991px){
  .home_page_hero{padding-top:30px}
  .home_page_hero_text,.home_page_hero_img{width:100%;padding-left:12px;margin-right:0}
  .home_page_stats{gap:18px!important}
  .home_page_instructor_box{margin:0}
  .home_page_instructor_img img{max-height:240px}
  .home_page_testi_card .home_page_quote{font-size:12px}
}
@media (max-width:576px){
  .home_page_hero h1{font-size:30px;letter-spacing:-1px}
  .home_page_instructor_text h2{font-size:34px}
  .home_page_hero .home_page_lead_text{font-size:13px}
  .home_page_stats{flex-direction:column;align-items:center}
  .home_page_stat{width:190px}
  .home_page_section_title{font-size:19px}
  .home_page_cat_card{min-width:100px;height:96px}
  .home_page_course_stage{height:340px}
  .home_page_instructor_text{padding:30px 20px 10px}
  .home_page_benefits{margin:10px 16px 20px}
}
@media (max-width:991px){
  .home_page_instructor_box::before{width:90px;height:55px}
}

/* ---------- Page text scale (tokens in common.css, same as other pages) ---------- */
.home_page_hero .home_page_eyebrow{font-size:var(--fs-tag);font-weight:500}
.home_page_hero h1{font-size:var(--fs-heading);font-weight:700}
.home_page_section_title,.home_page_instructor_text h2{font-size:var(--fs-title);font-weight:600}
.home_page_hero .home_page_lead_text,.home_page_section_sub,.home_page_instructor_text p{font-size:var(--fs-sub);font-weight:400}
.home_page_btn_hero{font-size:var(--fs-btn-lg);font-weight:500}
.home_page_stat h5,.home_page_course_card h4,.home_page_testi_card h6{font-size:var(--fs-card-title);font-weight:600}
.home_page_view_all,.home_page_stat p,.home_page_cat_card span,.home_page_benefit,
.home_page_course_card .home_page_rating,.home_page_course_card .home_page_meta,.home_page_testi_card .home_page_quote{font-size:var(--fs-label)}
.home_page_testi_card small,.home_page_course_card .home_page_badge_tag{font-size:var(--fs-small)}

/* ---------- Page width ----------
   every section lines up with the header: left edge = LMS logo, right edge = "Get Started" button
   (same rule as the Course / About / Contact pages) */
@media (min-width:992px){
  .home_page_hero .container,.home_page_categories .container,.home_page_featured .container,
  .home_page_instructor_section .container,.home_page_testimonials .container{
    max-width:none;
    padding-left:max(1.5rem,calc(50% - 680px));
    padding-right:max(1.5rem,calc(50% - 728px));
  }
  .home_page_hero_text{padding-left:12px}
  .home_page_hero_img{margin-right:0}
  .home_page_hero_img img{max-width:580px}
  .home_page_instructor_box{margin:0}
  /* side arrows sit on the edges instead of hanging outside */
  .home_page_slide_btn.home_page_prev{left:-12px}.home_page_slide_btn.home_page_next{right:-12px}
}
/* categories fill the wider row: 8 equal cards */
@media (min-width:1400px){ .home_page_cat_card{height:118px} }


/* =========================================================
   COURSES PAGE  (uses style.css for top bar, navbar, footer)
   Design tokens from the format notes
   ========================================================= */
:root{--tint-blue:#E7F3FD;--tint-purple:#E7E7FD;--tint-green:#E4FBEB}

/* ---------- Hero slider ---------- */
.c-hero{position:relative;background:#EEF6FE;overflow:hidden;min-height:382px;display:flex;align-items:center}
.c-hero-slides{position:absolute;right:0;top:0;height:100%;width:485px;overflow:hidden}
.c-slide{position:absolute;inset:0;display:flex;justify-content:flex-end;opacity:0;transition:opacity 1s ease}
.c-slide.active{opacity:1}
.c-crop{position:relative;height:100%;aspect-ratio:485/382;flex-shrink:0;overflow:hidden}
.c-art{position:absolute;inset:0}
/* full banner: show only its right part (shape + person) */
.c-crop .c-banner{position:absolute;right:0;bottom:0;height:100%;width:auto;max-width:none}
/* slide 1: blue shape with the person cut-out on top */
.c-crop .c-shape{position:absolute;right:0;bottom:0;height:100%;width:auto;max-width:none}
.c-crop .c-person{position:absolute;right:0;bottom:0;height:91%;width:auto;max-width:none}
.c-bg{display:none}
/* ---- wide screens (>=1140px) ----
   text/search use a wider container; the slider is exactly the artwork's width (shape + person),
   anchored to the screen edge, and the hero height is kept low so the whole picture shows */
:root{--c-shape:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAeUAAAF9CAYAAAA6BXBMAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAOdEVYdFNvZnR3YXJlAEZpZ21hnrGWYwAADx9JREFUeAHt3UuSVGd6gOHvP1lARfTANVUIRadWYHbg8gqaXkGjuQLSK0BeAWlvQHgFyCsQvQLLK6DcopseMmlRCCp/58kqLqW65eXcz/MMhAQKBcFAb3z/7aSADjiYvTg4Po6D6In3e3vT6IEi8kFORU/+XIuDlHI/fq+p+H30RIq0/DPtyZ9rxDR6I0+jYovF4pu9gDXtz15NFzkep8gPomJv8vIvd6I3JtEfKfqkL7/bHP3Rp98rosyNyin2l8X+o0XOs+X/MnszzQL0jShzpQ8x/qWMcV+WFQF6TJS51N63Px++yZPvlzGeBgCNEGXOKWM8mew9Xu5DHQYAjRJlVsql6jf5zjLGMXMwBKAdokzcefj35b7x4juHuADaJcojdrpUXTyJWNzr17UZgGES5RE6v1QNQFeI8shYqgboLlEeifI1rpzj++VS9aGlaoBuKoLBK6fjRc7/45oTQLeZlAfs1uzlvSJPnpiOAfrBpDxQtx++elzkwnQM0CMm5YE5nY7Tcu843wsAesWkPCDl3vHpdJwEGaCHTMoD8PnJ6gCgt0zKPedkNcBwmJR7avWt43ynnI7vO1kNMAyi3EMfv3UcMQ0ABsPydc/cefS3J5PJ5McQZIDBMSn3xOlhrsWz5d86WQ0wUCblHrg9+8v908NcrjoBDJkod1y5XJ3y3jNfdQIYPsvXHWW5GmB8TModVJ6utlwNMD6i3DH7D189Lk9XW64GGB/L1x3x4TGQHPl+ADBKotwB5f7xm5x/9BgIwLhZvm7Zp/1jQQYYO1Fukf1jAD5n+bol5f3j5f7xLADgjCg3zP1jAK4iyg06DXL+MSJNAwB+w55yQxzoAuAmotyAOw///siBLgBuIso1K09YR1rMAwBuYE+5Rk5YA7AJUa7B6ZOZ+08i8oMAgDWJcsXKIL/Jt5f7x9mVJwA2IsoV+vCGdThhDcAWHPSqyKc7yIIMwHZEuQKCDEAVRHlHt2Yv73kUBIAqiPIOyiCnXHgUBIBKiPKWBBmAqonyFm7P/nJfkAGomitRG9p/+OpPOeenAQAVMylvYBXkJMgA1EOU1yTIANRNlNdQHuoSZADqJso3+HDKOgCgZqJ8DdeeAGiSKF+hfDpTkAFokihf4sNb1oIMQJNE+Td8XAKAtojyZwQZgDaJ8pmD2YuDnBfPQpABaIkon3mT95dBTvcCAFoiykt3Hv3tSUQ+DABo0eijvP/w1ePlD7MAgJaNOsplkHPK3wUAdMBoo1x+E1mQAeiSUX5Pubz6tMj5+wCADhndpOy1LgC6alRRPr2L7HEQALppVFF+k++UJ62nAQAdNJoou/oEQNeNIspOWgPQB4M/fe2kNQB9MehJ2UlrAPpk0FFeTshPwsEuAHpisFEuD3YtJ+T7AQA9McgoO9gFQB8N7qDX2T7ykwCAnhncpOzFLgD6alBRPnsgZBoA0EODifKt2csH9pEB6LNB7Cmf7SM/DgDosUFMyjkvnoVlawB6rvdRPt1HTvcCAHqu11Fe7iPfs48MwFD0NsoHsxcHRS6eBQAMRG+j/Eve9641AIPSyyiX159S5AcBAAPSuytRrj8BMFS9m5QXObzaBcAg9SrKlq0BGLLeLF9btgZg6HozKVu2BmDoehFly9YAjEHnl68tWwMwFp2flC1bAzAWnY7y7W//et+yNQBj0ekop0l6EgAwEp2N8uknGS1bAzAenYzy6nCXTzICMDKdjPIiW7YGYHw6F+XTO8mL+wEAI9OpKB/MXhwUuXAnGYBR6lSUjxf7j8LhLgBGqjNRdrgLgLHrTJTPXu4CgNHqRJT3v/350MtdAIxdJ6KcJ5PvAwBGrvUol1egwuEuAGg/yq5AAcCpVqPsfWsA+KS1KJ9dgXoQAMBKa1E+uwI1DQBgpZUol1OyK1AAcF4rUfZQCABc1HiUTckAcLnGo2xKBoDLNRplUzIAXK3RKJuSAeBqjUXZlAwA12ssyqZkALheI1E2JQPAzRqJsikZAG5We5RNyQCwntqjnHN+FADAjeqN8uzFwfKv9wMAuFGtUb4Vt8ogTwMAuFGtUS5y4YAXAKyptijfmr18EKZkAFhbbVEu8uRPAQCsrZYo/2728l5EPgwAYG21RPldnrgGBQAbqjzKHgsBgO1UHuWTODkMAGBjlUfZNSgA2E6lUb797V89FgIAW6o0ymlSOOAFAFuqLMrlAS/XoABge9VNyovFgwAAtlZZlHNKXvACgB1UEuX9b38+DAe8AGAnlUR5MdkzJQPAjnaOshe8AKAaO0fZC14AUI2do+wTjQBQjZ2i7G4yAFRnpyjnxcksAIBK7LZ8nYo/BABQia2j7G4yAFRr6yi7mwwA1do6yskBLwCo1FZRtnQNANXbKsqWrgGgeltF2dI1AFRv4yhbugaAemwcZUvXAFCPjaNs6RoA6rFRlC1dA0B9NopyLtL9AABqsVmUU/EvAQDUYu0ol59pTBH3AgCoxdpRPomTwwAAarN2lIs8cRUKAGq0XpRnLw7CVSgAqNVaUb79/vZhAAC1Wm9SnhR/CACgVmtF2SteAFC/G6NcXoUKr3gBQO1ujLKrUADQjBujXGT7yQDQhBujnCMOAwCo3bVR/t3s5b0UcRAAQO2ujfL7k+IwAIBGFDf8qq9CAUBDro2y/WQAaM6VUbafDADNujLKv/p2MgA06soou58MAM26MsrZ05oA0KjLozx7cZAsXwNAoy6Nsu8nA0Dziit+1pQMAA27NMopFR4NAYCGXRrlHNmkDAANuxBlj4YAQDsuRPnd+zQNAKBxF6KcinwYAEDjLu4pp8k/BwDQuAtRdsgLANpxPsqnL3k55AUALTgX5f33e6ZkAGjJuSjnNBFlAGjJ+eXrtJgGANCK30TZyWsAaMv55WsnrwGgNZ+i7OQ1ALTqY5SdvAaAdn2M8slemgYA0JqPUU6LNA0AoDWfopySk9cA0KKPUc4R0wAAWvP5lahpAACtOY2y61AA0LpVlF2HAoD2raK8iMKUDAAtW0U5pTQNAKBVp3vKvg4FAK07i3Lx+wAAWnV2JSrZUwaAln24pzwNAKBVqyjnyCZlAGjZ6elrD4cAQOuK/dmraQAArSvi/ftpAACtKwIA6ITiZC9NAwBoXVGcePcaALqgyMl1KADogiK5owwAnVBkT2wCQCcUKaV/CgCgdYWPUQBAN7inDAAdUfgYBQB0Q5EsXwNAJ1i+BoCOEGUA6Ah7ygDQEcs95RBlAOgAy9cA0BGiDAAdIcoA0BGiDAAdIcoA0BGiDAAdIcoA0BGiDAAdIcoA0BHLKKejAABaZ1IGgI4QZQDoCFEGgI4oP934OgCA1hUpkigDQAdYvgaAjihyXvxfAACtMykDQEeUUT4KAKB1JmUA6IgiF/koAIDWmZQBoCOKyXuTMgB0QRF7e0cBALTO8jUAdERxPP/iKACA1p1NyukoAIBWraLsS1EA0L5VlJNXvQCgdafL1z5KAQCtO4tycRQAQKtWUV5MFvaUAaBlqyjfjvgpAIBWraJ8EhOTMgC0bBXl8gGRHCHMANCij89spkiiDAAt+uzt62xfGQBa9CnK7ioDQKs+RnlROIENAG36GGXXogCgXR+j/I94dxQAQGs+7SnPv37tWhQAtKf4/B+SJWwAaM25KEde/G8AAK04F2UnsAGgPeei7AQ2ALTnXJSdwAaA9pzfU55//ToiHQUA0Ljitz+R8+LPAQA07kKUU072lQGgBRejPDkRZQBowYUoH8d7UQaAFlyI8tlzm8IMAA0rLvvJ5LAXADTu0ih72QsAmndplCcxeR4AQKMujfLx/Isjj4gAQLOKq37BIyIA0Kwro+wREQBo1tVRnqQfAgBozJVRLveVc8TrAAAaUVz7qzn/dwAAjbg2yrnIzwMAaMS1UX4X7+wrA0BDrl++nn/92n1lAGhGceO/kU/sKwNAA26MciqyJWwAaMCNUS6/r+xqFADU7+bl6+W+cvJ9ZQCo3c1RLi3CvjIA1GytKL+dvH0aAECt1puUV1ej4nkAALVZL8olS9gAUKu1o+yrUQBQr7WjXH41KixhA0Bt1l++Xko5/zkAgFpsFOUoiqcBANRioyhbwgaA+mw2KZecwgaAWmwcZQ+JAEA9Np+UPSQCALXYPMolS9gAULmtolwuYfucIwBUa7tJufycY178VwAAldkuykupyJ7dBIAKbR3l4/lXz5dpPgoAoBJbR7lkCRsAqrNTlI+LX+cBAFRipyi7swwA1dktykspnfx7AAA72znK5YGvHPFTAAA72TnKq/9Izl74AoAdVRLl8sCXF74AYDeVRNkLXwCwu2qivLRXxNMAALZWWZT/Mb9bHvZ6HgDAViqLcsn1KADYXqVRPn0P27QMANuoNMqllBz4AoBtVB7l4/ndp65HAcDmKo/y6j+a838EALCRWqLsMREA2FwtUS4fEzEtA8Bm6olymJYBYFO1Rdm0DACbqS/KYVoGgE3UGmXTMgCsr94oh2kZANZVe5RNywCwnvqjHKZlAFhHI1Eup+VJWviCFABco5koL72Z350vfzgKAOBSjUW5lFP+twAALtVolH+df/lD+N4yAFyq0SiXUjqxtwwAl2g8ysfzr56HaRkALmg8yqWU0jeuSAHAea1E+Xj+xZEHRQDgvFaiXPKgCACc11qUV89vpoUrUgBwpr0oR7mMffdpOPQFACutRrm0MC0DwErrUX43v/tT5IVDXwCMXutRLr0t3n0X3sUGYOQ6EeXy0Jd3sQEYu25EObyLDQCdiXLJS18AjFmnoly+9DVJCx+sAGCUOhXl0pv53XlYxgZghDoX5ZJlbADGqJNRtowNwBh1Msoly9gAjE1no1yyjA3AmHQ6ypaxARiTTke5ZBkbgLHofJRLlrEBGINeRLlcxi7SyR8DAAasF1EuHc+/eu4TjwAMWW+iXCo/8bhcxv4pAGCAehXl8hOPRUp/tL8MwBD1K8rhmhQAw9W7KJdW16TsLwMwML2McqncX17+cBQAMBC9jXK5v5xS+lf7ywAMRX+jHKf7y5HyNwEAA9DrKJd+nX/5Q0rZwS8Aeq/3US4dz7/8LryPDUDPDSLKpbfpbfkM51EAQE8NJsoOfgHQd8OJcjj4BUC/DSrKJQe/AOirwUW5tDr45cUvAHpmkFEuvf3Pu7NwIhuAHhlslEtOZAPQJ/8PvTULdvWzZXMAAAAASUVORK5CYII=")}
@media (min-width:1140px){
  /* --h = hero height; banner's right edge lines up with the header's "Get Started" button
     (header content ends at 50% + 728px, see common.css navbar padding) */
  .c-hero{--h:clamp(382px,calc(22.8vw + 122px),540px);height:var(--h)}
  .c-hero-slides{right:max(0px,calc(50% - 728px));width:calc(var(--h) * 485 / 382)}
  .c-bg{display:block;position:absolute;inset:0;background:var(--fill);
    -webkit-mask:var(--c-shape) 0 0/100% 100% no-repeat;mask:var(--c-shape) 0 0/100% 100% no-repeat}
  /* banners carry their own curve + light corners: keep only what is inside the curve */
  .c-crop{-webkit-mask:var(--c-shape) right top/96% 100% no-repeat;mask:var(--c-shape) right top/96% 100% no-repeat}
  .c-crop .c-shape{display:none}
}
@media (min-width:1200px){
  .c-hero .container{max-width:1140px}
}
@media (min-width:1400px){
  .c-hero .container{max-width:1320px}
}
.c-hero-dots{position:absolute;right:24px;bottom:12px;display:flex;gap:6px;z-index:3}
.c-hero-dots button{width:8px;height:8px;border-radius:50%;border:0;padding:0;background:rgba(255,255,255,.55);transition:.3s}
.c-hero-dots button.active{width:22px;border-radius:5px;background:#fff}
.c-hero-text{position:relative;z-index:2;padding:52px 0 44px;max-width:580px}
.c-hero h1{font-size:44.3px;font-weight:700;line-height:1.22;color:var(--dark);margin:0;letter-spacing:-.3px}
.c-hero h1 span{color:var(--primary)}
.c-hero-sub{font-size:21px;font-weight:500;color:#3c4a60;line-height:1.1;margin:10px 0 22px}
.c-search{display:flex;align-items:center;background:#fff;border-radius:8px;height:46px;padding:0 4px 0 18px;box-shadow:0 3px 6px rgba(4,21,44,.35);border:1px solid #d7dce4}
.c-search i{font-size:17px;color:#222}
.c-search input{flex:1;min-width:0;border:0;outline:0;font-size:13px;padding:0 14px;color:#333}
.c-search input::placeholder{color:#555}
.c-search .btn{height:40px;padding:0 24px;font-size:16px;font-weight:500;border-radius:6px;flex-shrink:0}
.popular{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-top:14px}
.popular>span{font-size:12px;color:#3c4a60;margin-right:10px}
.chip{background:#DFE6EF;color:#222;font-size:11px;padding:5px 12px;border-radius:30px;white-space:nowrap}
.chip:hover{background:var(--primary);color:#fff}

/* ---------- All courses ---------- */
.all-courses{padding:var(--section-gap) 0}
.all-courses .section-title{font-size:21px;font-weight:600;color:var(--dark)}
.all-courses .section-sub{font-size:13px;font-weight:500;color:#444}
.results{font-size:13px;color:#444}

.filter-bar{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.btn-filter{height:36px;padding:0 14px;background:var(--tint-blue);border:1px solid #6b7c96;border-radius:4px;font-size:13px;color:#222;display:flex;align-items:center;gap:8px}
.f-search{display:flex;align-items:center;gap:10px;height:36px;border:1px solid #6b7c96;border-radius:4px;padding:0 12px;flex:1;min-width:180px;max-width:230px}
.f-search input{border:0;outline:0;font-size:11px;width:100%}
.f-search i{color:#555}
.f-select{height:36px;width:138px;font-size:12px;border:1px solid #6b7c96;border-radius:4px;color:#222;padding:0 32px 0 14px;cursor:pointer;box-shadow:none!important}
.f-select.f-sm{width:136px}
#fSort{width:184px}
.f-select:focus{border-color:var(--primary)}
.view-toggle{display:flex;gap:4px;background:#EEF3F9;padding:3px;border-radius:4px;margin-left:10px}
.view-toggle button{width:30px;height:28px;border:0;background:transparent;color:var(--navy);border-radius:3px;font-size:15px;display:grid;place-items:center}
.view-toggle button.active{background:var(--primary);color:#fff}

.course-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.c-card{position:relative;border:1.5px solid #dfe5ee;border-radius:6px;padding:8px 8px 10px;background:#fff;transition:box-shadow .25s}
.c-card:hover{box-shadow:0 8px 22px rgba(7,111,230,.14)}
.c-card .fav{position:absolute;right:6px;top:6px;z-index:2;width:22px;height:22px;display:grid;place-items:center;color:#e0204c;font-size:15px;background:#fff;border-radius:50%}
.c-card .fav.on i::before{content:"\f415"}
.c-card .thumb{padding:6px 6px 0 6px;display:block}
.c-card .thumb img{width:100%;display:block}
.c-card .progress-line{height:5px;width:107px;background:#E7EEF7;border-radius:4px;margin:8px 0 12px 8px;overflow:hidden}
.c-card .progress-line span{display:block;height:100%;width:37px;background:var(--navy);border-radius:4px}
.c-card .c-body{padding:0 2px 0 8px}
.c-card h3{font-size:11.6px;font-weight:400;line-height:1.65;color:#222;margin:0 0 6px;letter-spacing:-.1px}
.c-card h3 a{color:inherit}
.c-card .c-foot{display:flex;align-items:center;justify-content:space-between;gap:4px}
.c-card .rate{font-size:12px;color:#222;white-space:nowrap}
.c-card .rate .bi-star-fill{color:#F5A623;font-size:14px}
.c-card .rate small{color:#555;font-size:11px}
.c-card .rate .bi-people-fill{color:var(--navy)}
.c-card .rate .stu{font-size:9px;color:#444}
.c-card .price{font-size:17px;font-weight:500;color:var(--dark);white-space:nowrap}

/* list view */
.course-grid.list{grid-template-columns:1fr}
.course-grid.list .c-card{display:grid;grid-template-columns:260px 1fr;align-items:center;gap:12px}
.course-grid.list .c-card .thumb-wrap{grid-row:span 2}
.course-grid.list .c-card h3{font-size:15px}

.empty{grid-column:1/-1;text-align:center;padding:40px;color:#555;font-size:13px}

.pager{display:flex;justify-content:center;gap:4px;margin-top:22px}
.pager button{width:35px;height:35px;border:1px solid #e3e8ef;background:#fff;border-radius:4px;font-size:15px;color:#222}
.pager button.active{background:var(--primary);border-color:var(--primary);color:#fff}
.pager button:disabled{opacity:.4}
.pager button:not(:disabled):not(.active):hover{border-color:var(--primary);color:var(--primary)}

/* ---------- World stats ---------- */
.world{background:#F6F9FD;padding:var(--section-gap) 0;overflow:hidden}
.world-text h2{font-size:34px;font-weight:700;color:var(--dark);line-height:1.18;letter-spacing:-.3px;margin:0}
.world-text h2 span{font-size:48px;color:var(--primary);line-height:1.1}
.world-text p{font-size:13px;font-weight:500;color:#4b5563;line-height:1.65;max-width:340px;margin:18px 0 26px}
.btn-world{font-size:13px;padding:11px 28px;border-radius:5px;font-weight:500}
.btn-world.outline{border-width:1.5px;color:var(--primary);border-color:var(--primary);background:#fff}
.btn-world.outline:hover{background:var(--primary);color:#fff}
.map-wrap{position:relative;margin-right:-60px}
.map-wrap>img{display:block;width:100%}
.map-stats{position:absolute;left:12%;top:66%;width:82%;padding:10px 0;background:#fff;border:1px solid #6d7f99;border-radius:12px;display:flex;align-items:center;box-shadow:0 4px 14px rgba(4,21,44,.08)}
.m-stat{flex:1;text-align:center;border-right:1px solid #c3ccd8;padding:2px 6px}
.m-stat:last-child{border-right:0}
.m-icon{width:26px;height:26px;border-radius:50%;display:inline-grid;place-items:center;flex-shrink:0}
.m-icon svg{width:15px!important;height:15px!important;display:block}
.m-blue{background:var(--tint-blue);color:var(--primary)}
.m-purple{background:var(--tint-purple);color:var(--purple)}
.m-green{background:var(--tint-green);color:var(--green)}
.m-orange{background:#FFE7CF;color:#F5820B}
.m-stat h5{font-size:14px;font-weight:600;margin:4px 0 0;color:var(--dark)}
.m-stat p{font-size:9px;color:#4b5563;margin:0;white-space:nowrap}

.footer-line{border-top:1px solid #333;margin-top:0}

/* ---------- Responsive ---------- */
@media (max-width:1199px){
  .f-select,.f-select.f-sm,#fSort{width:auto;flex:1;min-width:130px}
  .f-search{max-width:none}
}
@media (max-width:991px){
  .c-hero{flex-direction:column;align-items:stretch}
  .c-hero-slides{position:relative;width:100%;max-width:485px;height:320px;order:2;margin:0 auto}
  .c-slide{justify-content:flex-end}
  .c-hero-text{max-width:none;padding-bottom:20px}
  .course-grid{grid-template-columns:repeat(3,1fr)}
  .map-wrap{margin:30px 0 0}
  .view-toggle{margin-left:auto}
}
@media (max-width:767px){ .course-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:576px){
  .c-hero h1{font-size:30px}
  .c-hero-sub{font-size:16px}
  .c-search .btn{padding:0 14px;font-size:14px}
  .course-grid{grid-template-columns:1fr}
  .course-grid.list .c-card{grid-template-columns:1fr}
  .world-text h2{font-size:28px}
  .world-text h2 span{font-size:38px}
  .map-stats{position:static;width:100%;height:auto;padding:10px 0;margin-top:10px}
  .m-stat p{font-size:10px;white-space:normal}
  .m-icon{width:30px;height:30px}
  .m-icon svg{width:17px!important;height:17px!important}
}

/* ---------- Page width ----------
   every section lines up with the header: left edge = LMS logo, right edge = "Get Started" button
   (same numbers as the top bar / navbar padding in common.css) */
@media (min-width:992px){
  .c-hero .container,.all-courses .container,.world .container{
    max-width:none!important;
    padding-left:max(1.5rem,calc(50% - 680px));
    padding-right:max(1.5rem,calc(50% - 728px));
  }
  .map-wrap{margin-right:0}
}

/* ---------- Page text scale (tokens in common.css, same as other pages) ---------- */
.c-hero h1{font-size:var(--fs-heading);font-weight:700}
.all-courses .section-title,.world-text h2,.world-text h2 span{font-size:var(--fs-title);font-weight:600}
.c-hero-sub,.all-courses .section-sub,.world-text p{font-size:var(--fs-sub);font-weight:400}
.c-search .btn,.btn-world{font-size:var(--fs-btn-lg);font-weight:500}
.c-card .price,.m-stat h5{font-size:var(--fs-card-title);font-weight:600}
.c-search input,.popular>span,.results,.btn-filter,.f-search input,.f-select,.c-card h3,.c-card .rate{font-size:var(--fs-label)}
.c-card h3{font-weight:500}
.chip,.c-card .rate small,.c-card .rate .stu,.m-stat p{font-size:var(--fs-small)}
.c-hero-sub{line-height:1.5}
@media (min-width:1200px){.f-select{width:150px}.f-select.f-sm{width:136px}#fSort{width:190px}}

/* ---------- Mobile / tablet fixes ---------- */
@media (min-width:992px) and (max-width:1199px){ .course-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:991px){ .course-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:576px){ .course-grid{grid-template-columns:minmax(0,1fr)} }


/* =========================================================
   COURSE DETAIL PAGE  (header/footer + design tokens live in ../common/common.css)
   ========================================================= */

/* ---------- Page width: every section lines up with the header ---------- */
@media (min-width:992px){
  .course_detail_page_hero .container,.course_detail_page_main .container{
    max-width:none;
    padding-left:max(1.5rem,calc(50% - 680px));
    padding-right:max(1.5rem,calc(50% - 728px));
  }
}

/* ---------- Hero ---------- */
.course_detail_page_hero{position:relative;background:#F0F7FE}
.course_detail_page_hero_text{padding:20px 0 22px}
.course_detail_page_crumb{font-size:var(--fs-label);color:#374151;margin:0 0 18px}
.course_detail_page_crumb a{color:#374151}
.course_detail_page_crumb a:hover,.course_detail_page_crumb a.course_detail_page_crumb_on{color:var(--primary)}
.course_detail_page_crumb span{margin:0 2px}
.course_detail_page_crumb strong{font-weight:400;color:var(--primary)}
.course_detail_page_badge{display:inline-block;border:1px solid var(--navy);border-radius:8px;color:var(--primary);background:rgba(255,255,255,.5);
  font-size:var(--fs-small);padding:4px 16px;margin-bottom:12px;box-shadow:1px 2px 0 rgba(27,69,151,.55)}
.course_detail_page_hero h1{font-size:38px;font-weight:700;line-height:1;letter-spacing:-.4px;color:var(--dark);max-width:520px;margin:0 0 16px}
.course_detail_page_hero_sub{font-size:12.5px;color:#374151;line-height:1.65;max-width:490px;margin:0 0 10px}
.course_detail_page_status{display:flex;align-items:center;gap:30px;margin-bottom:12px}
.course_detail_page_active{background:#16A34A;color:#fff;font-size:var(--fs-label);padding:2px 14px;border-radius:20px}
.course_detail_page_rating{font-size:13px;color:var(--dark);display:inline-flex;align-items:center;gap:8px}
.course_detail_page_rating i{color:#F59E0B;font-size:17px}
.course_detail_page_meta{display:flex;flex-wrap:wrap;gap:8px 30px;font-size:13px;color:var(--dark)}
.course_detail_page_meta span{display:inline-flex;align-items:center;gap:12px}
.course_detail_page_meta i{font-size:16px;color:var(--primary)}
.course_detail_page_multi{background:linear-gradient(90deg,#076FE6 0 36%,#F5A623 36% 66%,#04BC5F 66%);-webkit-background-clip:text;background-clip:text;color:transparent!important}

/* ---------- Course card picture with the course name printed on it ---------- */
.course_detail_page_thumb{container-type:inline-size;position:relative;aspect-ratio:412/217;border-radius:10px;overflow:hidden;
  background:url(../Course/images/course_detail_page_card.png) center/cover no-repeat}
.course_detail_page_thumb span{position:absolute;left:4.6%;top:50%;transform:translateY(-50%);font-size:7.5cqw;font-weight:600;line-height:1.05;color:#0F2F6E}
.course_detail_page_thumb sup{font-size:.35em;top:-1.4em;font-weight:400}
.course_detail_page_thumb em{font-style:normal;font-weight:400}
.course_detail_page_hero_card{display:none}

@media (min-width:992px){
  /* picture stays inside the header line at its real size (1140 x 356) */
  .course_detail_page_hero{background:#f0f6fd;height:356px;display:flex;align-items:center}
  .course_detail_page_hero::after{content:"";position:absolute;top:0;bottom:0;z-index:0;
    left:max(1.5rem,calc(50% - 680px));right:max(1.5rem,calc(50% - 728px));background:#F0F7FE}
  .course_detail_page_hero::before{content:"";position:absolute;top:0;bottom:0;z-index:1;
    right:max(1.5rem,calc(50% - 728px));width:min(1140px,calc(100% - 2 * max(1.5rem,50% - 704px)));
    background:url(../Course/images/course_detail_page_hero.png) right center/auto 100% no-repeat}
  .course_detail_page_hero .container{position:relative;z-index:2}
  .course_detail_page_hero_text{padding:0 0 0 48px;max-width:calc(100% - 480px)}
  /* sits exactly on the card inside the picture (card = 412 x 217 at 52px from the right, 62px from the top) */
  .course_detail_page_hero_card{display:block;position:absolute;z-index:2;top:62px;width:412px;
    right:calc(max(1.5rem,50% - 728px) + 52px)}
}

/* ---------- Body: info cards + price card ---------- */
.course_detail_page_main{padding:12px 0 calc(var(--section-gap) + 8px)}
.course_detail_page_grid{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}
@media (min-width:992px){
  .course_detail_page_main .container>*{margin-left:36px;margin-right:36px}
  .course_detail_page_grid{grid-template-columns:minmax(0,1fr) 32.7%;align-items:start}
}

.course_detail_page_card{display:flex;gap:22px;align-items:flex-start;background:#fff;border:1px solid #c6cedb;border-radius:6px;padding:10px 14px 12px 12px;margin-bottom:10px;
  box-shadow:2px 3px 3px rgba(4,21,44,.4)}
.course_detail_page_card:last-child{margin-bottom:0}
.course_detail_page_cicon{width:48px;height:48px;border-radius:50%;background:#DCEBFC;display:grid;place-items:center;font-size:24px;color:var(--primary);flex-shrink:0}
.course_detail_page_cicon_green{color:#16A34A;background:#DDF3EC}
.course_detail_page_card h2{font-size:var(--fs-label);font-weight:600;color:var(--dark);margin:9px 0 8px}
.course_detail_page_list{list-style:none;padding:0;margin:0}
.course_detail_page_list li{position:relative;padding-left:24px;font-size:12.5px;color:#4b5563;line-height:1.52}
.course_detail_page_list li::before{content:"\F633";font-family:"bootstrap-icons";position:absolute;left:-2px;top:-1px;font-size:15px;color:#374151}
.course_detail_page_text{font-size:12.5px;color:#4b5563;line-height:1.6;margin:0}
.course_detail_page_card .course_detail_page_text{max-width:580px;padding-bottom:2px}

/* price card */
.course_detail_page_buy{background:#fff;border:1px solid #c6cedb;border-radius:6px;padding:20px 16px 18px;box-shadow:2px 3px 3px rgba(4,21,44,.4)}
.course_detail_page_price{font-size:34px;font-weight:700;color:var(--dark);line-height:1;margin:28px 8px 14px}
.course_detail_page_facts{list-style:none;padding:0 4px 0 8px;margin:0 0 12px}
.course_detail_page_facts li{display:flex;align-items:center;gap:12px;font-size:13px;padding:6px 0}
.course_detail_page_facts i{font-size:17px;color:var(--primary);width:20px}
.course_detail_page_facts span{color:#4b5563}
.course_detail_page_facts strong{margin-left:auto;font-weight:400;color:var(--dark)}
.course_detail_page_btn{width:calc(100% - 10px);margin:0 5px 12px;display:flex;align-items:center;justify-content:center;gap:12px;
  font-size:18px;font-weight:500;padding:11px 16px;border-radius:5px}
.course_detail_page_btn i{font-size:24px}
.course_detail_page_btn_line{border:1px solid var(--primary);color:var(--primary);font-size:var(--fs-btn-lg);padding:10px 16px;background:#fff}
.course_detail_page_btn_line:hover{background:var(--primary);color:#fff}
.course_detail_page_actions{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #4b5563;border-bottom:1px solid #4b5563;margin:16px 5px 0}
.course_detail_page_actions button{border:0;background:none;display:flex;align-items:center;justify-content:center;gap:12px;font-size:13px;color:var(--dark);padding:16px 8px}
.course_detail_page_actions button+button{border-left:1px solid #9aa6b8}
.course_detail_page_actions i{font-size:17px;color:var(--primary)}
.course_detail_page_actions .bi-heart,.course_detail_page_actions .bi-heart-fill{color:#e0204c}
.course_detail_page_guarantee{display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;color:var(--dark);margin:18px 0 0}
.course_detail_page_guarantee i{font-size:18px;color:#16A34A}

/* ---------- Instructor + reviews ---------- */
.course_detail_page_inst{background:#fff;border:1px solid #4b6390;border-radius:6px;padding:16px 24px 18px 14px;margin-top:28px;box-shadow:2px 3px 3px rgba(4,21,44,.4)}
.course_detail_page_inst_head{display:flex;align-items:center;gap:12px}
.course_detail_page_inst_head h2{font-size:24px;font-weight:600;color:var(--dark);margin:0}
.course_detail_page_oicon{width:42px;height:42px;border-radius:50%;border:1px solid var(--navy);display:grid;place-items:center;font-size:24px;color:var(--navy);flex-shrink:0}
.course_detail_page_profile{margin-left:auto;border:1px solid var(--primary);color:var(--primary);font-size:var(--fs-label);font-weight:500;padding:6px 24px;border-radius:5px;
  box-shadow:1px 2px 0 rgba(27,69,151,.45)}
.course_detail_page_profile:hover{background:var(--primary);color:#fff}
.course_detail_page_inst_body{display:flex;gap:20px;align-items:flex-start;padding-left:38px;margin-top:-6px}
.course_detail_page_photo{width:112px;height:112px;border-radius:50%;flex-shrink:0;object-fit:cover}
.course_detail_page_inst_body h3{font-size:17px;font-weight:600;color:var(--dark);margin:4px 0 2px}
.course_detail_page_role{font-size:13px;color:#4b5563;margin:0 0 10px}
.course_detail_page_inst_stats{display:flex;flex-wrap:wrap;gap:6px 26px;font-size:13px;color:#4b5563;margin-bottom:8px}
.course_detail_page_inst_stats span{display:inline-flex;align-items:center;gap:10px}
.course_detail_page_inst_stats i{width:26px;height:26px;border-radius:50%;background:#EAF2FD;display:grid;place-items:center;font-size:14px;color:var(--primary)}
.course_detail_page_inst_stats i.course_detail_page_red{color:#DC2626;background:#FDECEC}
.course_detail_page_inst_stats i.course_detail_page_teal{color:#0EA5A4;background:#E2F6F5}
.course_detail_page_inst_stats i.course_detail_page_gold{color:#F59E0B;background:#FEF3DC}
.course_detail_page_inst_body .course_detail_page_text{max-width:660px;font-size:13px;line-height:1.45}

.course_detail_page_reviews{display:flex;align-items:center;margin-top:44px}
.course_detail_page_score{display:flex;gap:20px;align-items:flex-start;flex:0 0 33%}
.course_detail_page_oicon.course_detail_page_gold{color:#F59E0B;font-size:22px}
.course_detail_page_score h3{font-size:17px;font-weight:600;color:var(--dark);line-height:1;margin:8px 0 18px}
.course_detail_page_big{font-size:22px;font-weight:600;color:var(--dark);line-height:1.1;display:flex;align-items:center;gap:8px}
.course_detail_page_big i,.course_detail_page_stars i{color:#F59E0B}
.course_detail_page_stars{display:flex;gap:2px;font-size:13px;margin:2px 0 4px}
.course_detail_page_score small{font-size:12px;color:#4b5563}
.course_detail_page_bars{flex:1;border-left:1px solid #6b7c96;padding:0 60px 0 36px}
.course_detail_page_bar{display:grid;grid-template-columns:34px 1fr 44px;align-items:center;gap:10px;font-size:12px;color:#374151;padding:1.5px 0}
.course_detail_page_bar i{font-size:10px;color:#F59E0B}
.course_detail_page_bar div{height:6px;border-radius:6px;background:#E3EAF5;overflow:hidden}
.course_detail_page_bar b{display:block;height:100%;min-width:8px;border-radius:6px;background:var(--primary)}
.course_detail_page_bar span:last-child{text-align:right}

/* ---------- Responsive ---------- */
@media (max-width:991px){
  .course_detail_page_hero h1{font-size:32px}
  .course_detail_page_hero_sub,.course_detail_page_hero h1{max-width:none}
  .course_detail_page_buy{max-width:520px}
  .course_detail_page_bars{padding-right:0}
}
@media (max-width:576px){
  .course_detail_page_hero h1{font-size:28px}
  .course_detail_page_card{flex-direction:column;gap:4px}
  .course_detail_page_inst{padding:14px}
  .course_detail_page_inst_body{flex-direction:column;padding-left:0;margin-top:12px}
  .course_detail_page_profile{padding:6px 14px}
  .course_detail_page_reviews{flex-direction:column;align-items:stretch;gap:18px;margin-top:26px}
  .course_detail_page_bars{border-left:0;padding:0}
}

/* ---------- Mobile / tablet fixes ---------- */
@media (max-width:576px){
  .course_detail_page_hero h1{font-size:26px;line-height:1.15}
}


/* =========================================================
   ABOUT PAGE  (header/footer styles live in ../common/common.css)
   ========================================================= */

/* ---------- Page width ----------
   every section lines up with the header: left edge = LMS logo, right edge = "Get Started" button
   (same numbers as the top bar / navbar padding in common.css) */
@media (min-width:992px){
  .about_page_hero .container,.about_page_story .container,.about_page_trusted .container,
  .about_page_mission .container,.about_page_cta_wrap .container,.about_page_testimonials .container{
    max-width:none;
    padding-left:max(1.5rem,calc(50% - 680px));
    padding-right:max(1.5rem,calc(50% - 728px));
  }
}

/* ---------- Shared bits ---------- */
.about_page_tag{font-size:15px;font-weight:500;color:var(--primary);text-transform:uppercase;letter-spacing:.2px;margin-bottom:10px}
.about_page_tag_line{display:flex;align-items:center;gap:10px;color:var(--navy)}
.about_page_tag_line::after{content:"";width:30px;height:2px;background:var(--navy)}
.about_page_title_xl,.about_page_title_lg,.about_page_title_md{font-weight:700;color:var(--dark);letter-spacing:-.5px;margin:0 0 14px}
.about_page_title_xl{font-size:var(--fs-heading);line-height:1.12}
.about_page_title_lg{font-size:36px;line-height:1.15}
.about_page_title_md{font-size:34px;line-height:1.12}
.about_page_title_xl span,.about_page_title_lg span,.about_page_title_md span{color:var(--primary)}
.about_page_lead{font-size:19px;color:#4b5563;line-height:1.7;max-width:460px;margin:0 0 20px}
.about_page_desc{font-size:15px;color:#4b5563;line-height:1.7;max-width:380px;margin:0 0 20px}
.about_page_btn{font-size:14px;font-weight:500;padding:11px 20px;border-radius:5px;display:inline-flex;align-items:center;gap:12px}
.about_page_btn_lg{font-size:16px;padding:13px 20px}
.about_page_btn_sm{font-size:13px;font-weight:500;padding:8px 18px;border-radius:5px}
.about_page_btn_outline{border-width:1.5px;background:#fff;color:var(--primary);border-color:var(--primary)}
.about_page_btn_outline:hover{background:var(--primary);color:#fff}

/* ---------- Hero ---------- */
/* photo (dotted map + learner) is anchored right; the rest of the section uses its edge colour */
.about_page_hero{position:relative;overflow:hidden;background:#EFF7FE;min-height:464px;display:flex;align-items:center}
/* photo sits inside the header's width: its right edge lines up with the "Get Started" button,
   the space beyond it is just the section's background colour (header content ends at 50% + 728px, min 24px gap) */
.about_page_hero::before{content:"";position:absolute;top:0;bottom:0;right:max(24px,calc(50% - 728px));aspect-ratio:1138/464;
  background:url(../About/images/about_page_hero.png) right bottom/cover no-repeat}
.about_page_hero .container{position:relative;z-index:1}
.about_page_hero_text{padding:52px 0 40px;max-width:540px}
.about_page_hero h1{font-size:var(--fs-heading);font-weight:700;line-height:1.26;letter-spacing:-.6px;color:var(--dark);margin:0 0 14px}
.about_page_hero h1 span{color:var(--primary)}
.about_page_hero h1,.about_page_title_xl{white-space:nowrap}
.about_page_hero_sub{font-size:17px;color:#4b5563;line-height:1.55;margin:0 0 36px}
.about_page_hero_stats{display:flex;align-items:center;margin-bottom:22px}
.about_page_hero_stats>div{padding-right:40px}
.about_page_hero_stats>div+div{padding-left:40px;padding-right:0;border-left:1.5px solid #6b7c96}
.about_page_hero_stats h3{font-size:28px;font-weight:500;color:var(--primary);margin:0;line-height:1.2}
.about_page_hero_stats p{font-size:15px;color:#4b5563;margin:0}

/* ---------- Our Story ---------- */
.about_page_story{padding:calc(var(--section-gap) + 30px) 0 var(--section-gap)}
.about_page_checks{list-style:none;padding:0;margin:0 0 30px}
.about_page_checks li{display:flex;align-items:center;gap:12px;font-size:16px;color:#374151;margin-bottom:10px}
.about_page_checks i{font-size:32px;color:var(--primary);line-height:1}
.about_page_story .about_page_title_xl{font-size:40px;line-height:1.1;margin-bottom:16px}
.about_page_story .about_page_checks{margin-bottom:44px}
/* photo edges melt into the white page, as in the design */
.about_page_story_img{display:block;width:541px;max-width:calc(100% + 40px);margin-left:calc(100% - 541px);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 95%,transparent 100%),linear-gradient(180deg,transparent 0,#000 6%,#000 97%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 95%,transparent 100%),linear-gradient(180deg,transparent 0,#000 6%,#000 97%,transparent 100%);
  mask-composite:intersect}

/* ---------- Trusted by ---------- */
.about_page_trusted{background:#F2F7FC;padding:49px 0 48px}
.about_page_trusted .about_page_title_md{font-size:37.5px;line-height:1.1;margin-bottom:16px}
.about_page_trusted .about_page_desc{font-size:16px;line-height:1.56;max-width:362px;margin-bottom:22px}
.about_page_trusted .about_page_btn{font-size:14px;padding:10px 20px;gap:16px}
.about_page_logos{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;max-width:550px;margin-left:auto}
.about_page_logo{background:#fff;border-radius:4px;height:80px;display:flex;align-items:center;justify-content:center;gap:6px;color:#3d3d3d;white-space:nowrap}
.about_page_logo_netflix{font-family:'Bebas Neue','Arial Narrow',sans-serif;font-size:56px;color:#E50914;letter-spacing:.5px;line-height:1;padding-top:6px}
.about_page_logo_youtube{font-family:'Oswald','Arial Narrow',sans-serif;font-size:33px;font-weight:500;letter-spacing:-1px;gap:4px}
.about_page_logo_youtube i{font-size:52px;color:#3d3d3d;line-height:1}
.about_page_logo_google{font-size:42px;font-weight:500;letter-spacing:-1.5px;color:#454545}
.about_page_logo_microsoft{font-size:29px;font-weight:400;letter-spacing:-.8px;color:#3d3d3d;gap:8px}
.about_page_ms_grid{display:grid;grid-template-columns:repeat(2,18px);gap:2px}
.about_page_ms_grid i{width:18px;height:18px;background:#3d3d3d}
.about_page_logo_verizon{font-size:36px;font-weight:700;letter-spacing:-1.5px;color:#3d3d3d}
.about_page_vz_check{font-size:26px;font-weight:400;align-self:flex-start;margin:10px 0 0 -4px;line-height:1}
.about_page_logo_lenovo{font-size:40px;font-weight:700;letter-spacing:-1.5px;color:#3d3d3d}

/* ---------- Mission ---------- */
.about_page_mission{padding:calc(var(--section-gap) + 12px) 0 var(--section-gap)}
.about_page_mission_img{max-width:507px;width:100%}

/* ---------- Start learning CTA ---------- */
.about_page_cta_wrap{padding:0 0 var(--section-gap)}
.about_page_cta{position:relative;overflow:hidden;background:#EBF4FD;border-radius:10px;padding:26px 20px 26px 0;display:flex;align-items:center;gap:18px}
/* soft blobs in the corners */
.about_page_cta::before,.about_page_cta::after{content:"";position:absolute;border-radius:50%;background:#D5E8FC}
.about_page_cta::before{width:120px;height:80px;left:-40px;bottom:-40px}
.about_page_cta::after{width:110px;height:70px;right:-30px;top:-34px}
.about_page_cta_text{flex:1;min-width:0;position:relative;z-index:1}
.about_page_cta_text h2{font-size:28px;font-weight:600;line-height:1.2;color:var(--dark);margin:0 0 6px}
.about_page_cta_text h2 span{color:var(--primary)}
.about_page_cta_text p{font-size:14px;color:#4b5563;line-height:1.2;margin:0 0 20px}

/* globe illustration */
.about_page_globe{position:relative;width:190px;height:170px;flex-shrink:0;margin-left:14px;z-index:1}
.about_page_orbit{position:absolute;inset:18px 0 6px;border:2px dashed #3d8ef0;border-radius:50%;transform:rotate(-12deg)}
.about_page_globe_ball{position:absolute;left:28px;top:4px;width:146px;height:146px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#4DA3FF,#0A5FD1 70%);display:grid;place-items:center;overflow:hidden;box-shadow:inset -10px -12px 20px rgba(0,0,0,.18)}
.about_page_globe_ball i{font-size:150px;color:#4CC46B;line-height:1;margin-top:4px}
.about_page_pin{position:absolute;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:14px;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.15)}
.about_page_pin_yellow{width:auto;height:auto;border:0;box-shadow:none;background:none;color:#F7B500;font-size:36px;left:110px;top:-8px}
.about_page_pin_blue{background:#3D8EF0;left:4px;top:18px}
.about_page_pin_green{background:#34B36B;left:12px;bottom:26px}
.about_page_pin_red{background:#F0544F;right:18px;bottom:30px}

/* stats */
.about_page_cta_stats{display:flex;position:relative;z-index:1}
.about_page_cta_stat{text-align:center;padding:0 16px;border-left:1.5px solid #6b7c96}
.about_page_cta_stat:first-child{border-left:0}
.about_page_cta_stat span{width:52px;height:52px;border-radius:50%;display:inline-grid;place-items:center;font-size:24px}
.about_page_cta_stat h4{font-size:26px;font-weight:600;margin:6px 0 0;line-height:1.1}
.about_page_cta_stat p{font-size:14px;color:#4b5563;margin:0;white-space:nowrap}
.about_page_c_blue span{background:#C9E1FB;color:var(--primary)}.about_page_c_blue h4{color:var(--primary)}
.about_page_c_green span{background:#CDEFD6;color:#11813A}.about_page_c_green h4{color:#11813A}
.about_page_c_red span{background:#FAD4D2;color:#F0544F}.about_page_c_red h4{color:#F0544F}

/* ---------- Testimonials ---------- */
.about_page_testimonials{padding:var(--section-gap) 0 calc(var(--section-gap) + 8px)}
.about_page_testimonials .about_page_title_lg{margin-bottom:26px}
.about_page_testi_viewport{overflow:hidden;padding:2px}
.about_page_testi_track{display:flex;gap:18px;transition:transform .6s ease}
.about_page_testi_card{flex:0 0 calc((100% - 36px) / 3);border:1px solid #1B4597;border-radius:14px;padding:18px 20px 16px;background:#fff;display:flex;flex-direction:column}
.about_page_stars{color:#F5A623;font-size:17px;letter-spacing:3px;margin-bottom:12px}
.about_page_testi_card blockquote{font-size:16px;color:#4b5563;line-height:1.4;margin:0 0 16px;flex:1}
.about_page_testi_person{display:flex;align-items:center;gap:12px}
.about_page_avatar{width:58px;height:58px;border-radius:50%;border:2px solid var(--primary);display:grid;place-items:center;font-weight:600;font-size:18px;color:#fff;flex-shrink:0}
.about_page_testi_person h6{font-size:16px;font-weight:500;color:var(--dark);margin:0 0 2px}
.about_page_testi_person small{font-size:14px;color:var(--primary)}
.about_page_testi_dots{display:flex;justify-content:center;gap:8px;margin-top:26px}
.about_page_testi_dots button{width:10px;height:10px;border-radius:50%;border:0;padding:0;background:#8a95a8;transition:.3s}
.about_page_testi_dots button.about_page_active{background:var(--primary)}

/* ---------- Wide screens: keep the hero text aligned with the header like the other pages ---------- */
@media (min-width:1400px){
}

/* ---------- Responsive ---------- */
@media (max-width:1099px){
  .about_page_cta{flex-wrap:wrap;padding:26px 24px}
  .about_page_globe{margin-left:0}
  .about_page_cta_stats{width:100%;justify-content:center}
}
@media (max-width:991px){
  .about_page_hero{padding-bottom:300px;display:block}
  .about_page_hero::before{top:auto;height:300px;right:0;background-position:75% bottom}
  .about_page_hero_text{max-width:none;padding-bottom:10px}
  .about_page_story_img,.about_page_mission_img{display:block;margin:0 auto}
  .about_page_story_img{max-width:100%;margin-left:auto}
  .about_page_logos{margin:0 auto}
  .about_page_testi_card{flex-basis:calc((100% - 18px) / 2)}
}
@media (max-width:767px){
  .about_page_testi_card{flex-basis:100%}
  .about_page_cta_text{flex-basis:100%}
}
@media (max-width:576px){
  .about_page_hero h1,.about_page_title_xl,.about_page_story .about_page_title_xl{font-size:32px;white-space:normal}
  .about_page_title_lg,.about_page_title_md{font-size:27px}
  .about_page_lead{font-size:16px}
  .about_page_hero_sub{font-size:15px}
  .about_page_hero_stats>div{padding-right:24px}
  .about_page_hero_stats>div+div{padding-left:24px}
  .about_page_logo{height:64px;font-size:22px}
  .about_page_logo_netflix{font-size:34px}
  .about_page_trusted .about_page_title_md{font-size:27px}
  .about_page_logo_youtube{font-size:20px}.about_page_logo_youtube i{font-size:26px}
  .about_page_logo_google,.about_page_logo_lenovo,.about_page_logo_verizon{font-size:24px}
  .about_page_logo_microsoft{font-size:17px}
  .about_page_ms_grid{grid-template-columns:repeat(2,10px)}.about_page_ms_grid i{width:10px;height:10px}
  .about_page_vz_check{font-size:17px;margin-top:8px}
  .about_page_globe{margin:0 auto}
  .about_page_cta_text h2{font-size:22px}
  .about_page_cta_stat{padding:0 10px}
  .about_page_cta_stat span{width:42px;height:42px;font-size:19px}
  .about_page_cta_stat h4{font-size:21px}
  .about_page_cta_stat p{font-size:11px;white-space:normal}
}

/* ---------- Page text scale (tokens in common.css, same as other pages) ---------- */
.about_page_tag{font-size:var(--fs-tag);font-weight:500}
.about_page_hero h1{font-size:var(--fs-heading);font-weight:700}
.about_page_title_xl,.about_page_title_lg,.about_page_title_md,
.about_page_story .about_page_title_xl,.about_page_trusted .about_page_title_md,
.about_page_cta_text h2{font-size:var(--fs-title);font-weight:600}
.about_page_hero_sub,.about_page_lead,.about_page_desc,.about_page_trusted .about_page_desc,
.about_page_cta_text p,.about_page_checks li,.about_page_testi_card blockquote{font-size:var(--fs-sub);font-weight:400}
.about_page_btn,.about_page_btn_lg,.about_page_btn_sm,.about_page_trusted .about_page_btn{font-size:var(--fs-btn-lg);font-weight:500}
.about_page_testi_person h6{font-size:var(--fs-card-title);font-weight:600}
.about_page_hero_stats p,.about_page_cta_stat p,.about_page_testi_person small{font-size:var(--fs-label)}
@media (max-width:576px){.about_page_hero h1,.about_page_title_xl{white-space:normal}}


/* =========================================================
   CONTACT PAGE  (header/footer styles live in ../common/common.css)
   ========================================================= */

/* ---------- Page width ----------
   every section lines up with the header: left edge = LMS logo, right edge = "Get Started" button */
@media (min-width:992px){
  .contact_page_hero .container,.contact_page_quick .container,.contact_page_main .container,
  .contact_page_locations .container,.contact_page_cta_wrap .container{
    max-width:none;
    padding-left:max(1.5rem,calc(50% - 680px));
    padding-right:max(1.5rem,calc(50% - 728px));
  }
}

/* ---------- Shared ---------- */
.contact_page_tag{font-size:12px;font-weight:500;color:var(--primary);text-transform:uppercase;margin:0 0 4px}
.contact_page_btn{font-size:14px;font-weight:500;padding:10px 28px;border-radius:6px;display:inline-flex;align-items:center;gap:12px}
.contact_page_c_blue{background:#E1EEFD;color:var(--primary)}
.contact_page_c_green{background:#DDF6E6;color:#1FAF4B}
.contact_page_c_orange{background:#FFEBD6;color:#F5820B}
.contact_page_c_purple{background:#E7E3FD;color:#6D4AF6}

/* ---------- Hero ---------- */
.contact_page_hero{position:relative;overflow:hidden;background:#EDF5FD;min-height:420px;display:flex;align-items:center}
/* photo sits inside the header's width: right edge lines up with "Get Started" */
.contact_page_hero::before{content:"";position:absolute;bottom:0;top:14px;right:max(0px,calc(50% - 728px));aspect-ratio:450/315;
  background:url(../Contact-us/images/contact_page_hero.png) right bottom/contain no-repeat}
.contact_page_hero .container{position:relative;z-index:1}
.contact_page_hero_text{padding:60px 0 50px;max-width:560px}
.contact_page_hero h1{font-size:var(--fs-heading);font-weight:700;line-height:1.08;letter-spacing:-.5px;color:var(--dark);margin:0 0 18px}
.contact_page_hero h1 span{color:var(--primary)}
.contact_page_hero_sub{font-size:13px;font-weight:500;color:#4b5563;line-height:1.6;max-width:430px;margin:0 0 26px}
.contact_page_features{display:flex;gap:18px}
.contact_page_feature{display:flex;align-items:flex-start;gap:9px}
.contact_page_ficon{width:48px;height:48px;border-radius:50%;background:#fff;border:1.5px solid var(--navy);display:grid;place-items:center;font-size:21px;color:var(--primary);flex-shrink:0;box-shadow:0 2px 6px rgba(4,21,44,.08)}
.contact_page_feature h6{font-size:12px;font-weight:500;color:var(--dark);margin:6px 0 4px}
.contact_page_feature p{font-size:11px;color:#4b5563;line-height:1.35;margin:0;max-width:124px}

/* ---------- Quick contact cards ---------- */
.contact_page_quick{padding:var(--section-gap) 0 0}
.contact_page_cards{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding-bottom:6px}
.contact_page_card{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #d6dbe4;border-radius:10px;padding:14px 10px;min-width:0;color:inherit;
  box-shadow:2px 3px 4px rgba(4,21,44,.45),0 1px 2px rgba(4,21,44,.08);transition:transform .2s,box-shadow .2s}
.contact_page_card:hover{transform:translateY(-2px);box-shadow:3px 6px 10px rgba(4,21,44,.4),0 1px 2px rgba(4,21,44,.08)}
/* thin divider between icon and text */
.contact_page_card>div{flex:1;min-width:0;align-self:stretch;border-left:1px solid #cfd7e3;padding-left:10px;display:flex;flex-direction:column;justify-content:center}
.contact_page_cicon{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-size:20px;flex-shrink:0}
.contact_page_card h6{font-size:13px;font-weight:500;color:var(--dark);margin:0 0 1px}
.contact_page_card strong{display:block;font-size:13px;font-weight:500;color:var(--dark)}
.contact_page_card .contact_page_email{font-size:10px;font-weight:400;overflow-wrap:anywhere}
.contact_page_card small{display:block;font-size:9px;color:#4b5563;line-height:1.45;margin-top:2px}
.contact_page_pill{align-self:flex-start;display:inline-flex;align-items:center;gap:4px;font-size:8px;padding:2px 8px;border-radius:20px;border:1px solid;margin-top:4px}
.contact_page_pill_green{color:#1FAF4B;border-color:#1FAF4B;background:#EAF9EF}
.contact_page_chat_btn.contact_page_pill{align-self:flex-end}
.contact_page_pill_blue{color:var(--primary);border-color:var(--primary);background:#EAF3FE}

/* ---------- Form + info ---------- */
.contact_page_main{padding:var(--section-gap) 0 10px}
.contact_page_box{background:#F8FAFD;border:1.5px solid #D5DEEA;border-radius:12px;padding:28px 30px 30px;height:100%;box-shadow:0 2px 10px rgba(4,21,44,.06)}
.contact_page_box h2{font-size:30px;font-weight:600;color:var(--dark);letter-spacing:-.3px;margin:0 0 4px}
.contact_page_box_sub{font-size:15px;color:#4b5563;margin:0 0 22px}
.contact_page_form_box .contact_page_tag{font-size:13px;margin-bottom:6px}
.contact_page_form_box .row{--bs-gutter-x:28px;--bs-gutter-y:18px}
.contact_page_field label{font-size:14px;font-weight:500;color:var(--dark);margin-bottom:6px}
.contact_page_input{position:relative;display:flex;align-items:center;border:1.5px solid #cfd7e3;border-radius:6px;height:44px;background:#fff}
.contact_page_input:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(7,111,230,.12)}
.contact_page_input input,.contact_page_input select,.contact_page_input textarea{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;font-size:14px;padding:0 36px 0 14px;color:var(--dark)}
.contact_page_input select{cursor:pointer;padding-right:56px}
.contact_page_input select~.contact_page_err_icon{right:34px}
.contact_page_textarea{height:auto}
.contact_page_textarea textarea{height:96px;padding-top:12px;resize:vertical}
.contact_page_cc{display:flex;align-items:center;gap:6px;padding:0 10px;height:100%;border-right:1.5px solid #cfd7e3;font-size:11px;color:#333}
.contact_page_flag{width:22px;height:15px;border-radius:2px}
.contact_page_err_icon{position:absolute;right:12px;top:13px;color:#E5252A;font-size:15px;display:none}
.contact_page_textarea .contact_page_err_icon{top:12px}
.contact_page_err{display:none;font-size:11px;color:#E5252A;background:#FDECEC;border-radius:3px;padding:4px 12px;margin:0}
.contact_page_field.contact_page_invalid .contact_page_input{border-color:#E5252A}
.contact_page_field.contact_page_invalid .contact_page_err,.contact_page_field.contact_page_invalid .contact_page_err_icon{display:block}
.contact_page_msg_foot{display:flex;align-items:flex-start;gap:10px}
.contact_page_msg_foot .contact_page_err{flex:1}
.contact_page_msg_foot span{font-size:13px;color:var(--primary);margin:2px 0 0 auto}
.contact_page_form_box .contact_page_btn{margin-top:26px;font-size:16px;padding:13px 30px;border-radius:8px}
.contact_page_success{display:none;margin:12px 0 0;font-size:12px;color:#11813A;background:#E4FBEB;border-radius:4px;padding:8px 12px}
.contact_page_success.contact_page_show{display:block}

.contact_page_info_row{display:flex;gap:24px;align-items:flex-start;margin-bottom:28px}
.contact_page_iicon{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;font-size:30px;flex-shrink:0}
.contact_page_info_row h6{font-size:16px;font-weight:600;color:var(--dark);margin:2px 0 3px}
.contact_page_info_row p{font-size:15px;color:#4b5563;line-height:1.4;margin:0}
.contact_page_info_row .contact_page_strong{color:var(--dark);font-weight:500}
.contact_page_info_row small{font-size:11px;color:#4b5563}
.contact_page_socials{display:flex;justify-content:center;gap:10px;padding-left:40px;margin-top:4px}
.contact_page_socials a{width:34px;height:34px;border-radius:50%;border:1px solid #cfd7e3;background:#fff;display:grid;place-items:center;font-size:17px;box-shadow:0 1px 3px rgba(4,21,44,.1)}
.contact_page_socials .fb{color:#1877F2}.contact_page_socials .in{color:#0A66C2}.contact_page_socials .yt{color:#FF0000}
.contact_page_socials .ig{color:#E1306C}.contact_page_socials .x{color:#000}

/* ---------- Global locations ---------- */
.contact_page_locations{padding:calc(var(--section-gap) + 10px) 0 var(--section-gap)}
.contact_page_title{font-size:var(--fs-heading);font-weight:600;color:var(--dark);margin:0}
.contact_page_title_sub{font-size:13px;color:#4b5563;margin:0 0 26px}
.contact_page_loc{background:#fff;border:1px solid #EEF2F7;border-radius:14px;padding:10px 10px 12px;box-shadow:0 4px 16px rgba(4,21,44,.08);height:100%;display:flex;flex-direction:column}
.contact_page_map{position:relative;aspect-ratio:295/183;border-radius:8px;overflow:hidden;background:#E7EEF7}
.contact_page_map iframe{width:100%;height:100%;border:0;display:block}
.contact_page_loc_tag{position:absolute;left:6px;top:8px;z-index:1;background:var(--primary);color:#fff;font-size:13px;font-weight:500;padding:6px 18px;border-radius:20px;box-shadow:0 2px 6px rgba(4,21,44,.25)}
.contact_page_loc h3{font-size:21px;font-weight:600;color:var(--dark);margin:16px 0 8px 16px}
.contact_page_loc_addr{display:flex;gap:14px;font-size:13px;color:#4b5563;line-height:1.5;margin:0 0 12px 16px;flex:1}
.contact_page_loc_addr i{font-size:22px;color:var(--primary);line-height:1}
.contact_page_gmaps{display:flex;align-items:center;justify-content:center;gap:10px;background:#EEF4FC;border-radius:10px;padding:10px;font-size:14px;font-weight:600;color:var(--primary)}
.contact_page_gmaps .bi-arrow-right{-webkit-text-stroke:.6px currentColor}
.contact_page_gmaps:hover{background:#E1EEFD}
.contact_page_gpin{font-size:22px;background:linear-gradient(135deg,#EA4335 0 40%,#FBBC04 40% 60%,#34A853 60%);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Still have questions ---------- */
.contact_page_cta_wrap{padding:10px 0 calc(var(--section-gap) + 10px)}
.contact_page_cta{display:flex;align-items:center;gap:40px;background:#EAF3FD;border-radius:4px;padding:26px 36px}
.contact_page_cta>div:first-child{flex:1}
.contact_page_cta h2{font-size:21px;font-weight:600;color:var(--dark);margin:0}
.contact_page_cta p{font-size:13px;color:#4b5563;margin:0}
.contact_page_cta .contact_page_tag{font-size:12px;color:var(--primary);margin-bottom:6px}
.contact_page_cta .contact_page_btn{font-size:15px;padding:10px 24px}
.contact_page_cta_art{position:relative;width:120px;height:76px;flex-shrink:0}
.contact_page_bubble{position:absolute;left:0;top:0;width:56px;height:36px;background:#F7B500;border-radius:8px;display:flex;align-items:center;justify-content:center;gap:5px}
.contact_page_bubble::after{content:"";position:absolute;left:30px;bottom:-8px;border:5px solid transparent;border-top:6px solid #F7B500;border-left-color:#F7B500}
.contact_page_bubble i{width:6px;height:6px;border-radius:50%;background:#fff}
.contact_page_headset{position:absolute;right:0;bottom:-12px;font-size:78px;color:var(--primary);line-height:1}

/* ---------- Responsive ---------- */
@media (max-width:1099px){
  .contact_page_cards{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:991px){
  .contact_page_hero{display:block;padding-bottom:260px}
  .contact_page_hero::before{top:auto;height:260px;right:50%;transform:translateX(50%)}
  .contact_page_hero_text{max-width:none}
  .contact_page_features{flex-wrap:wrap}
  .contact_page_cta{flex-wrap:wrap;gap:20px}
}
@media (max-width:767px){
  .contact_page_cards{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:576px){
  .contact_page_hero h1{font-size:32px}
  .contact_page_title{font-size:30px}
  .contact_page_cards{grid-template-columns:1fr}
  .contact_page_card small,.contact_page_pill{font-size:11px}
  .contact_page_box{padding:18px 16px}
  .contact_page_socials{padding-left:0}
  .contact_page_err,.contact_page_info_row small{font-size:11px}
  .contact_page_cta{padding:22px 18px}
  .contact_page_cta_art{display:none}
}

/* ---------- Page text scale (tokens in common.css, same as other pages) ---------- */
.contact_page_tag,.contact_page_form_box .contact_page_tag,.contact_page_cta .contact_page_tag{font-size:var(--fs-tag);font-weight:500}
.contact_page_hero h1{font-size:var(--fs-heading);font-weight:700}
.contact_page_box h2,.contact_page_title,.contact_page_cta h2{font-size:var(--fs-title);font-weight:600}
.contact_page_hero_sub,.contact_page_box_sub,.contact_page_title_sub,.contact_page_cta p,.contact_page_info_row p{font-size:var(--fs-sub);font-weight:400}
.contact_page_btn,.contact_page_form_box .contact_page_btn,.contact_page_cta .contact_page_btn{font-size:var(--fs-btn-lg);font-weight:500}
.contact_page_feature h6,.contact_page_card h6,.contact_page_info_row h6,.contact_page_loc h3{font-size:var(--fs-card-title);font-weight:600}
.contact_page_card strong,.contact_page_field label,.contact_page_loc_addr,.contact_page_gmaps{font-size:var(--fs-label)}
.contact_page_feature p,.contact_page_card small,.contact_page_card .contact_page_email,.contact_page_pill,
.contact_page_err,.contact_page_info_row small,.contact_page_cc{font-size:var(--fs-small)}
.contact_page_feature h6{white-space:nowrap}.contact_page_feature p{max-width:140px}

/* ---------- Hero text: same as the Careers hero ---------- */
.contact_page_hero h1{font-family:'Poppins',sans-serif;font-size:var(--fs-heading);font-weight:700;line-height:1.1;letter-spacing:-.6px;color:var(--dark);margin:0 0 18px}
.contact_page_hero h1 span{color:var(--primary)}
.contact_page_hero_sub{font-family:'Poppins',sans-serif;font-size:var(--fs-sub);font-weight:400;color:#4b5563;line-height:1.6;max-width:460px;margin:0 0 26px}
@media (min-width:992px){.contact_page_hero::before{right:max(1.5rem,calc(50% - 728px))}}

/* ---------- Mobile / tablet fixes ---------- */
@media (max-width:576px){
  /* "Still have questions?" box: text on top, button under it */
  .contact_page_cta{flex-direction:column;align-items:flex-start}
  .contact_page_cta>div:first-child{flex:none;width:100%}
}


/* =========================================================
   CAREERS PAGE  (header/footer + text scale live in ../common/common.css)
   ========================================================= */

/* ---------- Page width ----------
   every section lines up with the header: left edge = LMS logo, right edge = "Get Started" button */
@media (min-width:992px){
  .career_page_hero .container,.career_page_why .container,.career_page_perks_wrap .container,
  .career_page_positions .container,.career_page_cta_wrap .container{
    max-width:none;
    padding-left:max(1.5rem,calc(50% - 680px));
    padding-right:max(1.5rem,calc(50% - 728px));
  }
}

/* ---------- Shared text (same scale as the other pages) ---------- */
.career_page_tag{font-size:var(--fs-tag);font-weight:500;color:var(--primary);text-transform:uppercase;margin:0 0 4px}
.career_page_title{font-size:var(--fs-title);font-weight:600;color:var(--dark);letter-spacing:-.3px;margin:0 0 6px}
.career_page_title span{color:var(--primary)}
.career_page_sub{font-size:var(--fs-sub);color:#4b5563;line-height:1.6;max-width:420px;margin:0}
.career_page_btn{font-size:var(--fs-btn-lg);font-weight:500;padding:10px 20px;border-radius:5px;display:inline-flex;align-items:center;gap:14px}

/* ---------- Hero ---------- */
.career_page_hero{position:relative;overflow:hidden;background:#EAF4FD;min-height:350px;display:flex;align-items:center}
/* team photo + stats card: right edge lines up with "Get Started" */
.career_page_hero::before{content:"";position:absolute;top:20px;bottom:0;right:max(0px,calc(50% - 728px));aspect-ratio:662/356;
  background:url(../Career%20page/images/career_page_hero.png) right bottom/contain no-repeat}
.career_page_hero .container{position:relative;z-index:1}
.career_page_hero_text{padding:56px 0 50px;max-width:520px}
.career_page_hero h1{font-size:var(--fs-heading);font-weight:700;line-height:1.1;letter-spacing:-.6px;color:var(--dark);margin:0 0 18px}
.career_page_hero h1 span{color:var(--primary)}
.career_page_hero_sub{font-size:var(--fs-sub);color:#4b5563;line-height:1.6;max-width:460px;margin:0 0 26px}

/* ---------- Why join us ---------- */
.career_page_why{padding:calc(var(--section-gap) + 12px) 0 var(--section-gap)}
.career_page_why_img{width:100%;max-width:461px;display:block}
.career_page_why .career_page_sub{margin-bottom:26px}
.career_page_reason{display:flex;align-items:center;gap:22px;margin-bottom:22px}
.career_page_reason:last-child{margin-bottom:0}
.career_page_ricon{width:54px;height:54px;border-radius:6px;background:#E7F3FD;display:grid;place-items:center;font-size:26px;color:var(--primary);flex-shrink:0}
.career_page_reason h6{font-size:var(--fs-card-title);font-weight:600;color:var(--dark);margin:0 0 2px}
.career_page_reason p{font-size:var(--fs-label);color:#4b5563;margin:0}

/* ---------- Perks & benefits ---------- */
.career_page_perks_wrap{padding:0 0 var(--section-gap)}
.career_page_perks_box{background:#F3F8FE;border-radius:6px;padding:24px 24px 16px}
.career_page_perks_box .career_page_sub{margin-bottom:24px}
.career_page_perks{display:grid;grid-template-columns:repeat(4,1fr);gap:14px 16px}
.career_page_perk{background:#E9F2FC;border-radius:6px;min-height:92px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:14px 10px;text-align:center;transition:transform .2s,box-shadow .2s}
.career_page_perk:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(7,111,230,.12)}
.career_page_perk i{font-size:32px;line-height:1}
.career_page_perk span{font-size:var(--fs-label);color:var(--dark)}

/* ---------- Open positions ---------- */
.career_page_positions{padding:var(--section-gap) 0}
.career_page_empty{text-align:center;margin-top:18px}
.career_page_empty_icon{width:92px;height:92px;border-radius:50%;background:#E7F3FD;display:inline-grid;place-items:center;font-size:42px;color:var(--primary);margin-bottom:20px}
.career_page_empty h6{font-size:var(--fs-card-title);font-weight:500;color:#374151;margin:0 0 4px}
.career_page_empty p{font-size:var(--fs-label);color:#4b5563;margin:0}
.career_page_jobs{display:grid;gap:12px;margin-top:22px}
.career_page_job{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid #d6dbe4;border-radius:8px;padding:16px 20px;background:#fff}
.career_page_job h6{font-size:var(--fs-card-title);font-weight:600;color:var(--dark);margin:0 0 4px}
.career_page_job p{font-size:var(--fs-small);color:#4b5563;margin:0}

/* ---------- Start learning CTA (same as the About page) ---------- */
.career_page_cta_wrap{padding:0 0 var(--section-gap)}
.career_page_cta{position:relative;overflow:hidden;background:#EBF4FD;border-radius:10px;padding:26px 20px 26px 0;display:flex;align-items:center;gap:18px}
/* soft blobs in the corners */
.career_page_cta::before,.career_page_cta::after{content:"";position:absolute;border-radius:50%;background:#D5E8FC}
.career_page_cta::before{width:120px;height:80px;left:-40px;bottom:-40px}
.career_page_cta::after{width:110px;height:70px;right:-30px;top:-34px}
.career_page_cta_text{flex:1;min-width:0;position:relative;z-index:1}
.career_page_cta_text h2{font-size:28px;font-weight:600;line-height:1.2;color:var(--dark);margin:0 0 6px}
.career_page_cta_text h2 span{color:var(--primary)}
.career_page_cta_text p{font-size:14px;color:#4b5563;line-height:1.2;margin:0 0 20px}

/* globe illustration */
.career_page_globe{position:relative;width:190px;height:170px;flex-shrink:0;margin-left:14px;z-index:1}
.career_page_orbit{position:absolute;inset:18px 0 6px;border:2px dashed #3d8ef0;border-radius:50%;transform:rotate(-12deg)}
.career_page_globe_ball{position:absolute;left:28px;top:4px;width:146px;height:146px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#4DA3FF,#0A5FD1 70%);display:grid;place-items:center;overflow:hidden;box-shadow:inset -10px -12px 20px rgba(0,0,0,.18)}
.career_page_globe_ball i{font-size:150px;color:#4CC46B;line-height:1;margin-top:4px}
.career_page_pin{position:absolute;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:14px;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.15)}
.career_page_pin_yellow{width:auto;height:auto;border:0;box-shadow:none;background:none;color:#F7B500;font-size:36px;left:110px;top:-8px}
.career_page_pin_blue{background:#3D8EF0;left:4px;top:18px}
.career_page_pin_green{background:#34B36B;left:12px;bottom:26px}
.career_page_pin_red{background:#F0544F;right:18px;bottom:30px}

/* stats */
.career_page_cta_stats{display:flex;position:relative;z-index:1}
.career_page_cta_stat{text-align:center;padding:0 16px;border-left:1.5px solid #6b7c96}
.career_page_cta_stat:first-child{border-left:0}
.career_page_cta_stat span{width:52px;height:52px;border-radius:50%;display:inline-grid;place-items:center;font-size:24px}
.career_page_cta_stat h4{font-size:26px;font-weight:600;margin:6px 0 0;line-height:1.1}
.career_page_cta_stat p{font-size:14px;color:#4b5563;margin:0;white-space:nowrap}
.career_page_c_blue span{background:#C9E1FB;color:var(--primary)}.career_page_c_blue h4{color:var(--primary)}
.career_page_c_green span{background:#CDEFD6;color:#11813A}.career_page_c_green h4{color:#11813A}
.career_page_c_red span{background:#FAD4D2;color:#F0544F}.career_page_c_red h4{color:#F0544F}
.career_page_btn_sm{padding:8px 18px;border-radius:5px}
.career_page_btn_outline{border-width:1.5px;background:#fff;color:var(--primary);border-color:var(--primary)}
.career_page_btn_outline:hover{background:var(--primary);color:#fff}

/* ---------- Responsive ---------- */
@media (max-width:1199px){
  .career_page_cta{flex-wrap:wrap;padding:26px 24px}
  .career_page_globe{margin-left:0}
  .career_page_cta_stats{width:100%;justify-content:center}
}
@media (max-width:991px){
  .career_page_hero{display:block;padding-bottom:280px}
  .career_page_hero::before{top:auto;height:280px;right:50%;transform:translateX(50%);max-width:100%}
  .career_page_hero_text{max-width:none;padding-bottom:10px}
  .career_page_why_img{margin:0 auto}
  .career_page_perks{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:576px){
  .career_page_hero::before{height:190px}
  .career_page_hero{padding-bottom:190px}
  .career_page_perks{grid-template-columns:1fr 1fr;gap:10px}
  .career_page_perk span{font-size:12px}
  .career_page_job{flex-direction:column;align-items:flex-start}
  .career_page_globe{margin:0 auto}
  .career_page_cta_text h2{font-size:22px}
  .career_page_cta_stat{padding:0 10px}
  .career_page_cta_stat span{width:42px;height:42px;font-size:19px}
  .career_page_cta_stat h4{font-size:21px}
  .career_page_cta_stat p{font-size:11px;white-space:normal}
}

/* CTA text scale (same as About) */
.career_page_cta_text h2{font-size:var(--fs-title);font-weight:600}
.career_page_cta_text p{font-size:var(--fs-sub)}
.career_page_btn_sm{font-size:var(--fs-btn-lg);font-weight:500}
.career_page_cta_stat p{font-size:var(--fs-label)}

/* hero photo stays to the right of the text (never under it) */
@media (min-width:992px){
  .career_page_hero::before{aspect-ratio:auto;left:calc(max(1.5rem,50% - 680px) + 540px);right:max(1.5rem,calc(50% - 728px))}
  .career_page_hero h1{white-space:nowrap}
}
@media (max-width:767px){ .career_page_cta_text{flex-basis:100%} }

/* taller hero */
.career_page_hero{min-height:440px}
.career_page_hero_text{padding:70px 0 64px}

/* ---------- Why join us: image + text sit together in the middle, like the design ---------- */
@media (min-width:992px){
  .career_page_why_row{justify-content:center;flex-wrap:nowrap;--bs-gutter-x:30px}
  .career_page_why_text{max-width:420px}
}
.career_page_why{padding:calc(var(--section-gap) + 8px) 0 var(--section-gap)}
.career_page_why_img{max-width:347px;border-radius:6px}
.career_page_why .career_page_title{margin-bottom:4px}
.career_page_why .career_page_sub{max-width:300px;margin-bottom:22px;font-size:13px;line-height:1.5}
.career_page_reason{gap:20px;margin-bottom:16px}
.career_page_ricon{width:42px;height:42px;border-radius:5px;background:#E4F0FD;font-size:22px}
.career_page_reason h6{font-size:14px;margin-bottom:0}
.career_page_reason p{font-size:12px}
/* multi-colour icons like the design */
.career_page_ic_chart{background:linear-gradient(90deg,#076FE6 0 36%,#F5A623 36% 66%,#04BC5F 66%);-webkit-background-clip:text;background-clip:text;color:transparent}
.career_page_ic_team{background:linear-gradient(90deg,#04BC5F 0 30%,#076FE6 30% 70%,#F5820B 70%);-webkit-background-clip:text;background-clip:text;color:transparent}
.career_page_ic_laptop{color:#1B4597}
@media (min-width:992px){.career_page_why_text{max-width:470px}}
.career_page_why .career_page_sub{max-width:350px}

/* ---------- Why join us: image fills the left half, text the right half (edges = header) ---------- */
@media (min-width:992px){
  .career_page_why_row{justify-content:space-between;--bs-gutter-x:48px}
  .career_page_why_row>.col-lg-auto:first-child{flex:0 0 52%;max-width:52%}
  .career_page_why_text{flex:0 0 48%;max-width:48%!important}
  .career_page_why_img{width:100%;max-width:none;border-radius:8px}
  .career_page_why .career_page_sub{max-width:420px;font-size:var(--fs-sub)}
  .career_page_reason{margin-bottom:22px}
  .career_page_ricon{width:54px;height:54px;font-size:26px}
  .career_page_reason h6{font-size:var(--fs-card-title)}
  .career_page_reason p{font-size:var(--fs-label)}
}


/* =========================================================
   BECOME AN INSTRUCTOR PAGE  (header/footer, hero text + text scale live in ../common/common.css)
   ========================================================= */

/* ---------- Page width: every section lines up with the header ---------- */
@media (min-width:992px){
  .instructor_page_hero .container,.instructor_page_why .container,.instructor_page_how_wrap .container,
  .instructor_page_meet .container,.instructor_page_stories .container,.instructor_page_cta_wrap .container{
    max-width:none;
    padding-left:max(1.5rem,calc(50% - 680px));
    padding-right:max(1.5rem,calc(50% - 728px));
  }
}

/* ---------- Shared text (same scale as the other pages) ---------- */
.instructor_page_tag{font-size:var(--fs-tag);font-weight:500;color:var(--primary);text-transform:uppercase;margin:0 0 4px}
.instructor_page_title{font-size:var(--fs-title);font-weight:600;color:var(--dark);letter-spacing:-.3px;margin:0 0 4px}
.instructor_page_title span{color:var(--primary)}
.instructor_page_sub{font-size:var(--fs-sub);color:#4b5563;margin:0}
.instructor_page_btn{font-size:var(--fs-btn-lg);font-weight:500;padding:10px 20px;border-radius:5px;display:inline-flex;align-items:center;gap:14px}

/* ---------- Hero ---------- */
.instructor_page_hero{position:relative;overflow:hidden;background:#E9F3FD;min-height:470px;display:flex;align-items:center}
/* photo + stats card: right edge lines up with "Get Started", never under the text */
.instructor_page_hero::before{content:"";position:absolute;top:14px;bottom:0;right:max(0px,calc(50% - 728px));aspect-ratio:564/491;
  background:url(../BecomeInstructor/images/instructor_page_hero.png) right bottom/contain no-repeat}
.instructor_page_hero .container{position:relative;z-index:1}
.instructor_page_hero_text{padding:44px 0 40px;max-width:560px}
.instructor_page_crumb{display:flex;align-items:center;gap:10px;font-size:var(--fs-small);color:#374151;margin:0 0 26px}
.instructor_page_crumb i{font-size:14px;color:var(--primary)}
.instructor_page_hero h1{white-space:nowrap}
.instructor_page_hero_feats{display:flex;gap:30px;margin:26px 0 36px}
.instructor_page_hero_feats>div{text-align:center;font-size:var(--fs-label);color:#374151;line-height:1.25}
.instructor_page_hero_feats span{width:58px;height:58px;border-radius:50%;background:#fff;display:grid;place-items:center;margin:0 auto 10px;font-size:28px;color:var(--primary);box-shadow:0 2px 8px rgba(4,21,44,.08)}
.instructor_page_hero_actions{display:flex;align-items:center;gap:30px;flex-wrap:wrap}
.instructor_page_login{font-size:var(--fs-label);font-weight:500;color:var(--primary)}
.instructor_page_login:hover{text-decoration:underline}

/* ---------- Why teach ---------- */
.instructor_page_why{padding:calc(var(--section-gap) + 8px) 0 var(--section-gap)}
.instructor_page_why_grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:22px}
.instructor_page_why_card{border:1px solid #d6dbe4;border-radius:8px;padding:18px 22px 22px;background:#fff;
  box-shadow:2px 3px 4px rgba(4,21,44,.4),0 1px 2px rgba(4,21,44,.08);transition:transform .2s}
.instructor_page_why_card:hover{transform:translateY(-3px)}
.instructor_page_why_icon{width:46px;height:46px;border-radius:50%;background:#E7F3FD;display:grid;place-items:center;font-size:22px;color:var(--primary);margin-bottom:14px}
.instructor_page_why_card:nth-child(2) .instructor_page_why_icon{color:#F5A623}
.instructor_page_why_card h6{font-size:var(--fs-card-title);font-weight:600;color:var(--dark);margin:0 0 6px}
.instructor_page_why_card p{font-size:var(--fs-label);color:#4b5563;line-height:1.45;margin:0;max-width:170px}

/* ---------- How it works ---------- */
.instructor_page_how_wrap{padding:6px 0 var(--section-gap)}
.instructor_page_how{background:#EAF3FD;border-radius:8px;padding:26px 30px 28px}
.instructor_page_steps{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-top:26px}
.instructor_page_step{flex:1;text-align:center}
.instructor_page_step_icon{width:84px;height:84px;border-radius:50%;background:#fff;display:inline-grid;place-items:center;font-size:36px;margin-bottom:18px;box-shadow:0 2px 8px rgba(4,21,44,.06)}
.instructor_page_s_blue{color:var(--primary)}
.instructor_page_s_green{color:#16A34A}
.instructor_page_s_mix{color:var(--primary)}
.instructor_page_step h6{font-size:var(--fs-card-title);font-weight:600;color:var(--dark);margin:0 0 4px}
.instructor_page_step p{font-size:var(--fs-label);color:#4b5563;line-height:1.45;margin:0 auto;max-width:170px}
.instructor_page_step_arrow{font-size:22px;color:var(--primary);margin-top:30px}

/* ---------- Meet our instructors ---------- */
.instructor_page_meet{padding:var(--section-gap) 0}
.instructor_page_view_all{font-size:var(--fs-label);font-weight:500;color:var(--primary);display:inline-flex;gap:8px;margin-bottom:4px}
.instructor_page_inst_grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:22px}
.instructor_page_inst{position:relative;text-align:center;background:#fff;border:1px solid #d6dbe4;border-radius:8px;padding:16px 16px 12px;
  box-shadow:0 3px 8px rgba(4,21,44,.14);transition:transform .2s,box-shadow .2s}
.instructor_page_inst:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(7,111,230,.16)}
.instructor_page_inst img{width:106px;height:106px;border-radius:50%;display:block;margin:0 auto 10px}
.instructor_page_inst_go{position:absolute;right:14px;top:14px;width:24px;height:24px;border-radius:50%;background:#EAF3FD;display:grid;place-items:center;font-size:13px;color:var(--primary)}
.instructor_page_inst h6{font-size:var(--fs-card-title);font-weight:600;color:var(--dark);margin:0 0 2px}
.instructor_page_inst_role{font-size:var(--fs-label);color:#4b5563;margin:0 0 6px}
.instructor_page_inst_rate{font-size:var(--fs-small);color:#4b5563;margin:0 0 14px}
.instructor_page_inst_rate i{color:#F5A623;font-size:15px}
.instructor_page_inst_rate strong{font-size:var(--fs-card-title);color:var(--dark);font-weight:600}
.instructor_page_inst_stats{display:flex;border-top:0;padding-top:4px}
.instructor_page_inst_stats>div{flex:1;display:flex;align-items:center;justify-content:center;gap:10px}
.instructor_page_inst_stats>div+div{border-left:1.5px solid #6b7c96}
.instructor_page_inst_stats i{font-size:20px;color:var(--primary)}
.instructor_page_inst_stats span{text-align:left;font-size:9px;color:#4b5563;line-height:1.1}
.instructor_page_inst_stats strong{display:block;font-size:var(--fs-card-title);font-weight:600;color:var(--dark)}

/* ---------- Instructor stories ---------- */
.instructor_page_stories{background:#EAF3FD;padding:calc(var(--section-gap) - 4px) 0 var(--section-gap)}
.instructor_page_story_slider{position:relative;margin-top:22px}
.instructor_page_story_view{overflow:hidden;padding:2px}
.instructor_page_story_track{display:flex;gap:14px;transition:transform .5s ease}
.instructor_page_story{flex:0 0 calc((100% - 28px) / 3);background:#fff;border-radius:6px;padding:16px 30px 18px}
.instructor_page_quote_mark{display:block;font-size:40px;line-height:.8;color:var(--primary);margin-bottom:10px;transform:scaleX(-1);width:max-content}
.instructor_page_story blockquote{font-size:var(--fs-label);color:#4b5563;line-height:1.6;margin:0 0 14px;min-height:68px}
.instructor_page_story_person{display:flex;align-items:center;gap:10px}
.instructor_page_story_person img{width:48px;height:48px;border-radius:50%;border:2px solid var(--primary);object-fit:cover}
.instructor_page_story_person h6{font-size:var(--fs-card-title);font-weight:600;color:var(--dark);margin:0}
.instructor_page_story_person small{font-size:var(--fs-small);color:#4b5563}
.instructor_page_story_btn{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid #d6dbe4;box-shadow:0 3px 8px rgba(0,0,0,.2);display:grid;place-items:center;font-size:18px}
.instructor_page_prev{left:-22px}.instructor_page_next{right:-22px}

/* ---------- Ready CTA ---------- */
.instructor_page_cta_wrap{padding:var(--section-gap) 0 calc(var(--section-gap) + 8px)}
.instructor_page_cta{display:flex;align-items:center;justify-content:space-between;gap:30px;background:#EAF3FD;border-radius:8px;padding:26px 44px}
.instructor_page_cta h2{font-size:var(--fs-title);font-weight:600;color:var(--dark);margin:0 0 6px}
.instructor_page_cta h2 span{color:var(--primary)}
.instructor_page_cta p{font-size:var(--fs-sub);color:#4b5563;line-height:1.55;max-width:380px;margin:0}

/* ---------- Responsive ---------- */
@media (max-width:1099px){
  .instructor_page_why_grid,.instructor_page_inst_grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:991px){
  .instructor_page_hero{display:block;padding-bottom:340px}
  .instructor_page_hero::before{top:auto;height:340px;right:50%;transform:translateX(50%);max-width:100%}
  .instructor_page_hero_text{max-width:none;padding-bottom:10px}
  .instructor_page_steps{flex-wrap:wrap}
  .instructor_page_step{flex:0 0 45%}
  .instructor_page_step_arrow{display:none}
  .instructor_page_story{flex-basis:calc((100% - 14px) / 2)}
  .instructor_page_prev{left:-6px}.instructor_page_next{right:-6px}
  .instructor_page_cta{flex-direction:column;align-items:flex-start}
}
@media (max-width:767px){ .instructor_page_story{flex-basis:100%} }
@media (max-width:576px){
  .instructor_page_hero h1{white-space:normal}
  .instructor_page_hero{padding-bottom:280px}
  .instructor_page_hero::before{height:280px}
  .instructor_page_hero_feats{gap:18px}
  .instructor_page_why_grid,.instructor_page_inst_grid{grid-template-columns:1fr}
  .instructor_page_step{flex-basis:100%}
  .instructor_page_how,.instructor_page_cta{padding:22px 18px}
}

/* instructor card: less empty space on the sides, stats fill the card width */
.instructor_page_inst{padding:16px 10px 12px}
.instructor_page_inst_stats{padding:6px 4px 0}
.instructor_page_inst_stats>div{justify-content:center;gap:8px;padding:0 6px}
.instructor_page_inst_stats i{font-size:24px}
.instructor_page_inst_stats span{font-size:var(--fs-small)}
.instructor_page_inst_stats strong{font-size:18px}
.instructor_page_inst img{width:120px;height:120px}
.instructor_page_inst_role{font-size:var(--fs-sub)}


/* =========================================================
   CERTIFICATE VERIFICATION PAGE  (header/footer, hero text + text scale live in ../common/common.css)
   ========================================================= */

/* ---------- Page width: lines up with the header ---------- */
@media (min-width:992px){
  .certificate_page_hero .container{
    max-width:none;
    padding-left:max(1.5rem,calc(50% - 680px));
    padding-right:max(1.5rem,calc(50% - 728px));
  }
}

/* ---------- Hero: full-width photo, text on the light left side ---------- */
.certificate_page_hero{position:relative;min-height:450px;display:flex;align-items:center;
  background:#EEF1F4 url(../Certificate%20Verfications/images/certificate_page_hero.png) right center/cover no-repeat}
/* soft white fade behind the text so it stays readable on any screen width */
.certificate_page_hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(246,248,250,.92) 0,rgba(246,248,250,.75) 35%,rgba(246,248,250,0) 55%)}
.certificate_page_hero .container{position:relative;z-index:1}
.certificate_page_hero_text{padding:56px 0 50px;max-width:580px}
.certificate_page_tag{font-size:var(--fs-tag);font-weight:500;color:var(--primary);text-transform:uppercase;margin:0 0 8px}
.certificate_page_hero h1{white-space:nowrap}
.certificate_page_hero_sub{max-width:360px!important}

/* search box */
.certificate_page_box{background:rgba(255,255,255,.95);border-radius:6px;padding:12px 12px;margin:24px 0 28px 12px;max-width:520px;box-shadow:0 2px 10px rgba(4,21,44,.06)}
.certificate_page_row{display:flex;gap:8px}
.certificate_page_input{flex:1;min-width:0;display:flex;align-items:center;gap:10px;height:38px;border:1.5px solid #cfd7e3;border-radius:4px;padding:0 10px 0 14px;background:#fff}
.certificate_page_input:focus-within{border-color:var(--primary)}
.certificate_page_input>i{font-size:15px;color:#555}
.certificate_page_input input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:var(--fs-label);color:var(--dark)}
.certificate_page_clear{display:none;border:0;background:none;padding:0;font-size:17px;color:#E5252A;line-height:1}
.certificate_page_clear.certificate_page_show{display:block}
.certificate_page_input.certificate_page_invalid{border-color:#E5252A;background:#FDECEC}
.certificate_page_input.certificate_page_invalid>i{color:#E5252A}
.certificate_page_btn{font-size:var(--fs-btn-lg);font-weight:500;padding:0 30px;height:38px;border-radius:4px;flex-shrink:0}
.certificate_page_msg{display:none;margin:8px 0 0;font-size:var(--fs-small);color:#E5252A}
.certificate_page_msg.certificate_page_show{display:flex;align-items:center;gap:6px}
.certificate_page_msg i{font-size:16px}
.certificate_page_found{display:flex;gap:12px;align-items:flex-start;margin-top:10px;padding:10px 12px;background:#E4FBEB;border-radius:4px}
.certificate_page_found>i{font-size:26px;color:#16A34A;line-height:1}
.certificate_page_found h6{font-size:var(--fs-label);font-weight:600;color:#11813A;margin:0 0 2px}
.certificate_page_found p{font-size:var(--fs-small);color:#374151;margin:0}
.certificate_page_found small{font-size:var(--fs-small);color:#4b5563}

/* trust row */
.certificate_page_trust{display:flex;align-items:center;margin-left:12px}
.certificate_page_trust>div{display:flex;align-items:center;gap:14px;font-size:var(--fs-small);color:#374151;line-height:1.7;padding:0 14px}
.certificate_page_trust>div:first-child{padding-left:0}
.certificate_page_trust>div+div{border-left:1.5px solid #6b7c96}
.certificate_page_ticon{width:48px;height:48px;border-radius:50%;background:#fff;border:1px solid #d6dbe4;display:grid;place-items:center;font-size:24px;flex-shrink:0;box-shadow:0 2px 6px rgba(4,21,44,.08)}
.certificate_page_t_gold{color:#E0A526}
.certificate_page_t_blue{color:var(--primary)}
.certificate_page_t_mix{color:#16A34A}

/* footer newsletter error (design shows it) */
.certificate_page_nl_err{display:none;margin:6px 0 0;font-size:9px;color:#E5252A;align-items:center;gap:5px}
.certificate_page_nl_err.certificate_page_show{display:flex}
.common_newsletter.certificate_page_nl_invalid{border-color:#E5252A;background:#FDECEC}
.common_newsletter.certificate_page_nl_invalid input{background:transparent}

/* ---------- Responsive ---------- */
@media (max-width:991px){
  .certificate_page_hero{background-position:70% center}
  .certificate_page_hero::before{background:rgba(246,248,250,.85)}
}
@media (max-width:576px){
  .certificate_page_hero h1{white-space:normal}
  .certificate_page_box,.certificate_page_trust{margin-left:0}
  .certificate_page_row{flex-direction:column}
  .certificate_page_btn{height:40px}
  .certificate_page_trust{flex-direction:column;align-items:flex-start;gap:12px}
  .certificate_page_trust>div{padding:0!important;border:0!important}
}

/* ---------- Exact design: photo fills the whole hero, footer stays at the bottom ---------- */
.certificate_page_body{min-height:100vh;display:flex;flex-direction:column}
.certificate_page_hero{flex:1;min-height:450px;background:#EEF1F4 url(../Certificate%20Verfications/images/certificate_page_hero.png) 70% center/cover no-repeat}
.certificate_page_hero::before{background:linear-gradient(90deg,rgba(246,248,250,.9) 0,rgba(246,248,250,.7) 30%,rgba(246,248,250,0) 50%)}
@media (min-width:1400px){.certificate_page_hero{background-position:right center}}

/* search box: rounded + lined up with the text */
.certificate_page_box{margin:24px 0 28px 0;border-radius:12px;padding:12px 14px}
.certificate_page_input{border-radius:8px;height:42px}
.certificate_page_btn{border-radius:8px;height:42px}
.certificate_page_found{border-radius:8px}
.certificate_page_trust{margin-left:0}

/* ---------- Photo sits inside the header line (logo → Get Started); outside it is the Contact hero's light blue ---------- */
@media (min-width:992px){
  .certificate_page_hero{background:#EDF5FD}
  .certificate_page_hero::after{content:"";position:absolute;top:0;bottom:0;
    left:max(1.5rem,calc(50% - 680px));right:max(1.5rem,calc(50% - 728px));
    background:#EEF1F4 url(../Certificate%20Verfications/images/certificate_page_hero.png) right center/cover no-repeat}
  .certificate_page_hero::before{z-index:1;left:max(1.5rem,calc(50% - 680px));right:max(1.5rem,calc(50% - 728px))}
  .certificate_page_hero .container{z-index:2}
  /* text gets a little inner space from the photo's left edge */
  .certificate_page_hero_text{padding-left:36px}
}

/* ---------- Mobile / tablet fixes ---------- */
@media (max-width:991px){
  /* text sits on the photo here, so the photo is faded almost to white to keep the text readable */
  .certificate_page_hero{background-position:85% center}
  .certificate_page_hero::before{background:rgba(246,248,250,.9)}
}


/* =========================================================
   VOUCHERS PAGE  (header/footer, hero text + text scale live in ../common/common.css)
   ========================================================= */

/* ---------- Page width: every section lines up with the header ---------- */
@media (min-width:992px){
  .voucher_page_hero .container,.voucher_page_cats_wrap .container,.voucher_page_invest_wrap .container{
    max-width:none;
    padding-left:max(1.5rem,calc(50% - 680px));
    padding-right:max(1.5rem,calc(50% - 728px));
  }
}

/* ---------- Hero ---------- */
.voucher_page_hero{position:relative;overflow:hidden;background:#EAF3FD;min-height:346px;display:flex;align-items:center}
/* voucher cards image: right edge lines up with "Get Started" */
.voucher_page_hero::before{content:"";position:absolute;top:20px;bottom:10px;right:max(0px,calc(50% - 728px));aspect-ratio:548/330;
  background:url(../Vouchers/images/voucher_page_hero.png) right center/contain no-repeat}
.voucher_page_hero .container{position:relative;z-index:1}
.voucher_page_hero_text{padding:40px 0 50px;max-width:540px}
.voucher_page_crumb{font-size:var(--fs-label);color:#374151;margin:0 0 22px}
.voucher_page_crumb a{color:#374151}
.voucher_page_crumb a:hover{color:var(--primary)}
.voucher_page_crumb span{margin:0 4px}
.voucher_page_crumb strong{font-weight:400;color:var(--primary)}
.voucher_page_trust{display:flex;gap:34px;margin-top:30px}
.voucher_page_trust>div{display:flex;align-items:center;gap:14px;font-size:var(--fs-label);color:var(--dark);line-height:1.6}
.voucher_page_ticon{width:54px;height:54px;border-radius:50%;background:#DCEBFC;display:grid;place-items:center;font-size:26px;color:var(--primary);flex-shrink:0}

/* ---------- Voucher categories ---------- */
.voucher_page_cats_wrap{padding:calc(var(--section-gap) + 4px) 0 var(--section-gap)}
.voucher_page_cats_box{border:1px solid #d6dbe4;border-radius:12px;padding:22px 20px 20px;background:#fff;
  box-shadow:2px 3px 4px rgba(4,21,44,.45),0 1px 2px rgba(4,21,44,.08)}
.voucher_page_title{font-size:var(--fs-title);font-weight:600;color:var(--dark);margin:0}
.voucher_page_view_all{font-size:var(--fs-label);font-weight:500;color:var(--primary);display:inline-flex;gap:8px}
.voucher_page_cats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:20px}
.voucher_page_cat{display:flex;flex-direction:column;border:1px solid #d6dbe4;border-radius:6px;padding:18px 18px 22px;background:#fff;color:inherit;
  box-shadow:2px 3px 4px rgba(4,21,44,.45),0 1px 2px rgba(4,21,44,.08);transition:transform .2s,box-shadow .2s}
a.voucher_page_cat:hover{transform:translateY(-3px);box-shadow:3px 8px 14px rgba(7,111,230,.22)}
.voucher_page_logo{height:110px;display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.voucher_page_logo_svg{height:84px;width:auto}
.voucher_page_ms{display:flex;align-items:center;gap:10px;font-size:32px;color:#737373;letter-spacing:-.5px}
.voucher_page_ms_grid{display:grid;grid-template-columns:repeat(2,17px);gap:2px}
.voucher_page_ms_grid i{width:17px;height:17px}
.voucher_page_cat h3{font-size:var(--fs-card-title);font-weight:600;color:var(--dark);margin:0 0 10px}
.voucher_page_cat p{font-size:var(--fs-label);color:#4b5563;line-height:1.6;margin:0 0 20px;flex:1}
.voucher_page_explore{font-size:var(--fs-card-title);color:var(--primary);display:inline-flex;align-items:center;gap:12px}
a.voucher_page_cat:hover .voucher_page_explore i{transform:translateX(3px)}
.voucher_page_explore i{transition:transform .2s}

.voucher_page_soon{border:1.5px dashed #6b8ed6;background:#F5F9FE;align-items:center;text-align:center;box-shadow:none}
.voucher_page_soon_icon{width:74px;height:74px;border-radius:50%;background:#E2EEFC;display:grid;place-items:center;font-size:36px;color:var(--primary);margin:14px 0 20px}
.voucher_page_soon h3{font-size:20px;line-height:1.2}
.voucher_page_soon p{flex:0 0 auto}
.voucher_page_notify{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;max-width:200px;height:48px;border:1px solid #9fb6d8;border-radius:6px;background:#EAF3FD;
  font-size:var(--fs-card-title);font-weight:600;color:var(--navy);box-shadow:2px 3px 4px rgba(4,21,44,.3);transition:.2s}
.voucher_page_notify i{font-size:20px;color:var(--primary)}
.voucher_page_notify:hover{background:var(--primary);color:#fff}
.voucher_page_notify:hover i{color:#fff}
.voucher_page_notify.voucher_page_notified{background:#E4FBEB;border-color:#34B36B;color:#11813A;cursor:default}
.voucher_page_notify.voucher_page_notified i{color:#16A34A}

/* ---------- Invest in your future ---------- */
.voucher_page_invest_wrap{padding:0 0 calc(var(--section-gap) + 8px)}
.voucher_page_invest{border-radius:14px;padding:38px 48px 36px;min-height:230px;
  background:#EEF4FB url(../Vouchers/images/voucher_page_invest.png) right center/auto 100% no-repeat}
.voucher_page_invest h2{font-size:var(--fs-title);font-weight:600;color:var(--dark);margin:0 0 8px}
.voucher_page_invest h2 span{color:var(--navy)}
.voucher_page_invest p{font-size:var(--fs-sub);color:#4b5563;line-height:1.6;max-width:420px;margin:0 0 22px}
.voucher_page_btn{font-size:var(--fs-btn-lg);font-weight:500;padding:11px 22px;border-radius:6px;display:inline-flex;align-items:center;gap:14px}

/* ---------- Responsive ---------- */
@media (max-width:1099px){ .voucher_page_cats{grid-template-columns:repeat(2,1fr)} }
@media (max-width:991px){
  .voucher_page_hero{display:block;padding-bottom:250px}
  .voucher_page_hero::before{top:auto;height:240px;right:50%;transform:translateX(50%);max-width:100%}
  .voucher_page_hero_text{max-width:none;padding-bottom:10px}
  .voucher_page_trust{flex-wrap:wrap;gap:18px}
  .voucher_page_invest{background-size:cover;background-position:70% center}
  .voucher_page_invest>*{position:relative}
  .voucher_page_invest{position:relative}
  .voucher_page_invest::before{content:"";position:absolute;inset:0;border-radius:14px;background:rgba(238,244,251,.85)}
}
@media (max-width:576px){
  .voucher_page_cats{grid-template-columns:1fr}
  .voucher_page_cats_box{padding:18px 14px}
  .voucher_page_invest{padding:26px 20px}
  .voucher_page_hero{padding-bottom:200px}
  .voucher_page_hero::before{height:190px}
}

/* taller hero */
@media (min-width:992px){
  .voucher_page_hero{min-height:440px}
  .voucher_page_hero_text{padding:56px 0 64px}
  .voucher_page_hero::before{top:28px;bottom:20px}
}


/* =========================================================
   VOUCHER DETAIL PAGE  (header/footer, hero text + text scale live in ../common/common.css)
   ========================================================= */

/* ---------- Page width: every section lines up with the header ---------- */
@media (min-width:992px){
  .voucher_detail_page_hero .container,.voucher_detail_page_main .container{
    max-width:none;
    padding-left:max(1.5rem,calc(50% - 680px));
    padding-right:max(1.5rem,calc(50% - 728px));
  }
}

/* ---------- Hero: full-width background image (badge on the right) ---------- */
.voucher_detail_page_hero{position:relative;min-height:417px;display:flex;align-items:center;
  background:#EEF5FD url(../Vouchers/images/voucher_detail_page_hero.png) right center/cover no-repeat}
.voucher_detail_page_hero_text{padding:32px 0 26px;max-width:560px}
.voucher_detail_page_crumb{font-size:var(--fs-label);color:#374151;margin:0 0 20px}
.voucher_detail_page_crumb a{color:#374151}
.voucher_detail_page_crumb a:hover{color:var(--primary)}
.voucher_detail_page_crumb span{margin:0 3px}
.voucher_detail_page_crumb strong{font-weight:400;color:var(--primary)}
.voucher_detail_page_badge{display:inline-block;background:#DDEBFB;color:var(--primary);font-size:var(--fs-small);padding:4px 12px;border-radius:4px;margin-bottom:14px}
.voucher_detail_page_btn{font-size:var(--fs-btn-lg);font-weight:500;padding:11px 28px;border-radius:5px;display:inline-flex;align-items:center;gap:14px}
.voucher_detail_page_btn i{font-size:20px}
.voucher_detail_page_trust{display:inline-flex;gap:30px;margin-top:26px;background:rgba(255,255,255,.55);border-radius:6px;padding:8px 20px 8px 16px}
.voucher_detail_page_trust>div{display:flex;align-items:center;gap:12px;font-size:var(--fs-small);color:var(--dark);line-height:1.6}
.voucher_detail_page_ticon{width:46px;height:46px;border-radius:50%;background:#DCEBFC;display:grid;place-items:center;font-size:22px;color:var(--primary);flex-shrink:0}

/* ---------- Tabs ---------- */
.voucher_detail_page_main{padding:0 0 calc(var(--section-gap) + 8px)}
.voucher_detail_page_tabs{display:flex;background:#fff;border:1px solid #d6dbe4;border-radius:0 0 6px 6px;
  box-shadow:2px 3px 4px rgba(4,21,44,.45),0 1px 2px rgba(4,21,44,.08);margin-bottom:22px;overflow-x:auto}
.voucher_detail_page_tab{flex:0 0 auto;display:flex;align-items:center;gap:12px;border:0;background:none;padding:12px 38px;
  font-size:var(--fs-sub);color:#374151;border-bottom:4px solid transparent;white-space:nowrap}
.voucher_detail_page_tab i{font-size:22px;color:#4b5563}
.voucher_detail_page_tab:hover{color:var(--primary)}
.voucher_detail_page_tab.voucher_detail_page_active{color:var(--primary);border-bottom-color:var(--primary);font-weight:500}
.voucher_detail_page_tab.voucher_detail_page_active i{color:var(--primary)}

.voucher_detail_page_panel{display:none}
.voucher_detail_page_panel.voucher_detail_page_show{display:block}

/* ---------- Cards ---------- */
.voucher_detail_page_card{display:flex;gap:24px;align-items:flex-start;background:#fff;border:1px solid #d6dbe4;border-radius:6px;padding:12px 20px 18px;margin:0 12px 44px;
  box-shadow:2px 3px 4px rgba(4,21,44,.45),0 1px 2px rgba(4,21,44,.08)}
.voucher_detail_page_panel .voucher_detail_page_card:last-child{margin-bottom:0}
.voucher_detail_page_cicon{width:58px;height:58px;border-radius:50%;border:1.5px solid var(--navy);display:grid;place-items:center;font-size:28px;color:var(--primary);flex-shrink:0;margin-top:0}
.voucher_detail_page_cicon_green{color:#16A34A}
.voucher_detail_page_multi{background:linear-gradient(90deg,#076FE6 0 36%,#F5A623 36% 66%,#04BC5F 66%);-webkit-background-clip:text;background-clip:text;color:transparent}
.voucher_detail_page_card h2{font-size:20px;font-weight:600;color:var(--dark);margin:16px 0 8px}
.voucher_detail_page_text{font-size:var(--fs-label);color:#4b5563;line-height:1.55;max-width:660px;margin:0}

.voucher_detail_page_chips{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px;max-width:820px}
.voucher_detail_page_chip{display:inline-flex;align-items:center;gap:12px;border:1px solid #9fb6d8;border-radius:30px;padding:6px 16px 6px 10px;
  font-size:var(--fs-label);color:var(--dark);box-shadow:2px 3px 4px rgba(4,21,44,.35)}
.voucher_detail_page_chip i{font-size:18px;color:var(--primary)}

.voucher_detail_page_details{display:grid;grid-template-columns:1fr 1fr;margin-top:6px}
.voucher_detail_page_details>div+div{border-left:1.5px solid #6b7c96;padding-left:24px}
.voucher_detail_page_drow{display:grid;grid-template-columns:22px 150px 1fr;gap:10px;align-items:start;font-size:var(--fs-label);padding:6px 0}
.voucher_detail_page_details>div+div .voucher_detail_page_drow{grid-template-columns:22px 180px 1fr}
.voucher_detail_page_drow i{font-size:18px;line-height:1.2}
.voucher_detail_page_dkey{color:var(--dark)}
.voucher_detail_page_dval{color:#4b5563}
.voucher_detail_page_vd_blue{color:var(--primary)}
.voucher_detail_page_vd_red{color:#DC2626}
.voucher_detail_page_vd_green{color:#16A34A}
.voucher_detail_page_vd_dark{color:var(--navy)}

/* ---------- Buy Now / Career Paths / Resources: one outlined box with a blue round icon ---------- */
.voucher_detail_page_box{background:#fff;border:1px solid #4b6390;border-radius:8px;padding:16px 22px 40px;margin:8px 4px 0}
.voucher_detail_page_box_shadow{border-color:#d6dbe4;box-shadow:2px 3px 4px rgba(4,21,44,.45),0 1px 2px rgba(4,21,44,.08);padding-bottom:22px}
.voucher_detail_page_box_head{display:flex;align-items:center;gap:16px;margin-bottom:14px}
.voucher_detail_page_box_head_top{align-items:flex-start}
.voucher_detail_page_box_head h2{font-size:20px;font-weight:600;color:var(--dark);margin:0}
.voucher_detail_page_box_head_top h2{margin:12px 0 10px}
.voucher_detail_page_box_head .voucher_detail_page_text{max-width:none;line-height:1.6}
.voucher_detail_page_hicon{width:48px;height:48px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;font-size:24px;flex-shrink:0}
.voucher_detail_page_count{margin-left:auto;font-size:var(--fs-label);color:#374151}

/* Buy Now: product row */
.voucher_detail_page_product{display:flex;align-items:center;gap:16px;border:1px solid #4b6390;border-radius:8px;padding:16px 18px 14px 16px}
.voucher_detail_page_picon{width:70px;height:70px;border-radius:50%;background:#DCEBFC;color:var(--primary);display:grid;place-items:center;font-size:40px;flex-shrink:0}
.voucher_detail_page_pinfo{flex:1;min-width:0}
.voucher_detail_page_pinfo h3{font-size:var(--fs-sub);font-weight:600;color:var(--dark);margin:0 0 10px}
.voucher_detail_page_pinfo a{font-size:var(--fs-label);color:var(--primary);display:inline-flex;align-items:center;gap:14px}
.voucher_detail_page_pinfo a i{font-size:12px;-webkit-text-stroke:1px}
.voucher_detail_page_pprice{display:flex;flex-direction:column;align-items:flex-end;margin-right:8px}
.voucher_detail_page_old{font-size:var(--fs-sub);color:#374151;text-decoration:line-through;line-height:1.2}
.voucher_detail_page_price{font-size:24px;font-weight:600;color:var(--dark);line-height:1.5}
.voucher_detail_page_save{background:#CDF3DA;color:#11813A;font-size:var(--fs-label);font-weight:500;padding:1px 10px;border-radius:3px}
.voucher_detail_page_added{display:none;margin:12px 0 0;font-size:var(--fs-label);color:#11813A}
.voucher_detail_page_added.voucher_detail_page_show{display:block}

/* Career Path: 6 starting roles -> Security+ -> 8 next roles, joined by lines */
.voucher_detail_page_path{--line:#5b6b85;display:grid;grid-template-columns:250fr 100px 240fr 118px 236fr;align-items:center;padding:0 36px 0 40px;margin-top:4px}
.voucher_detail_page_path_from,.voucher_detail_page_path_to{position:relative;display:flex;flex-direction:column}
.voucher_detail_page_path_from{grid-column:1;gap:10px}
.voucher_detail_page_path_mid{grid-column:3}
.voucher_detail_page_path_to{grid-column:5;gap:8px}
.voucher_detail_page_node{position:relative;height:50px;display:flex;align-items:center;justify-content:center;text-align:center;
  background:#EEF4FD;border:1px solid #6f8fc4;border-radius:4px;box-shadow:1px 2px 0 #2c4270;
  font-size:var(--fs-sub);font-weight:500;color:var(--dark);padding:0 8px}
.voucher_detail_page_path_to .voucher_detail_page_node{height:44px;font-size:var(--fs-label)}
.voucher_detail_page_path_mid{position:relative;height:178px;border-radius:6px;background:linear-gradient(180deg,#1F74E4,#0B2F80);color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.voucher_detail_page_path_mid i{font-size:32px;line-height:1;margin-bottom:10px}
.voucher_detail_page_path_mid strong{font-size:22px;font-weight:500;line-height:1.2}
.voucher_detail_page_path_mid strong::after{content:"";display:block;width:100px;height:1px;background:#fff;margin:10px auto 14px}
.voucher_detail_page_path_mid span{font-size:var(--fs-sub);font-weight:500}
@media (min-width:992px){
  /* left: each role -> vertical line -> arrow into the blue box */
  .voucher_detail_page_path_from .voucher_detail_page_node::after{content:"";position:absolute;left:100%;top:50%;width:51px;border-top:1.5px solid var(--line)}
  .voucher_detail_page_path_from::after{content:"";position:absolute;left:calc(100% + 50px);top:25px;bottom:25px;border-left:1.5px solid var(--line)}
  .voucher_detail_page_path_mid::before{content:"";position:absolute;right:calc(100% + 16px);top:50%;width:34px;border-top:1.5px solid var(--line)}
  .voucher_detail_page_path_mid::after{content:"";position:absolute;right:calc(100% + 6px);top:50%;transform:translateY(-50%);
    border:7px solid transparent;border-left:12px solid var(--line);border-right:0}
  /* right: blue box -> vertical line -> arrow into each role */
  .voucher_detail_page_path_to::after{content:"";position:absolute;left:-118px;top:50%;width:52px;border-top:1.5px solid var(--line)}
  .voucher_detail_page_path_to::before{content:"";position:absolute;left:-67px;top:22px;bottom:22px;border-left:1.5px solid var(--line)}
  .voucher_detail_page_path_to .voucher_detail_page_node::before{content:"";position:absolute;left:-67px;top:50%;width:50px;border-top:1.5px solid var(--line)}
  .voucher_detail_page_path_to .voucher_detail_page_node::after{content:"";position:absolute;left:-18px;top:50%;transform:translateY(-50%);
    border:5px solid transparent;border-left:8px solid var(--line);border-right:0}
}

/* Resources: video + text */
.voucher_detail_page_resource{display:flex;align-items:center;gap:42px;border:1px solid #4b6390;border-radius:8px;padding:9px 16px;margin-top:20px}
.voucher_detail_page_video{flex:0 0 55.5%;max-width:564px;display:block;border-radius:10px;overflow:hidden;line-height:0}
.voucher_detail_page_video img{width:100%;display:block}
.voucher_detail_page_video{aspect-ratio:561/285;background:#000}
.voucher_detail_page_video iframe{width:100%;height:100%;border:0;display:block}
.voucher_detail_page_rinfo{flex:1;min-width:0}
.voucher_detail_page_rinfo h3{font-size:20px;font-weight:600;color:var(--dark);line-height:1.45;max-width:300px;margin:0 0 10px}
.voucher_detail_page_rinfo .voucher_detail_page_text{max-width:320px;line-height:1.65}
.voucher_detail_page_yt{display:inline-flex;align-items:center;gap:12px;margin-top:20px;border:1px solid var(--primary);border-radius:5px;
  padding:9px 18px;font-size:var(--fs-sub);font-weight:500;color:var(--primary)}
.voucher_detail_page_yt .bi-youtube{font-size:28px;line-height:1;color:#FF0000}
.voucher_detail_page_yt .bi-box-arrow-up-right{font-size:18px}
.voucher_detail_page_yt:hover{background:#F1F7FE}

/* ---------- Responsive ---------- */
@media (max-width:991px){
  .voucher_detail_page_hero{background-position:65% center}
  .voucher_detail_page_hero::before{content:"";position:absolute;inset:0;background:rgba(238,245,253,.8)}
  .voucher_detail_page_hero .container{position:relative}
  .voucher_detail_page_details{grid-template-columns:1fr}
  .voucher_detail_page_details>div+div{border-left:0;padding-left:0}
  .voucher_detail_page_tab{padding:12px 20px}
  .voucher_detail_page_path{grid-template-columns:1fr;gap:22px;padding:0}
  .voucher_detail_page_path_from,.voucher_detail_page_path_mid,.voucher_detail_page_path_to{grid-column:1}
  .voucher_detail_page_resource{flex-direction:column;align-items:stretch;gap:18px;padding:12px}
  .voucher_detail_page_video{flex:none;max-width:none}
  .voucher_detail_page_rinfo h3,.voucher_detail_page_rinfo .voucher_detail_page_text{max-width:none}
}
@media (max-width:576px){
  .voucher_detail_page_card{flex-direction:column;gap:8px;margin:0 0 24px}
  .voucher_detail_page_card h2{margin-top:4px}
  .voucher_detail_page_trust{flex-direction:column;gap:10px}
  .voucher_detail_page_box{padding:14px 14px 22px;margin:8px 0 0}
  .voucher_detail_page_product{flex-wrap:wrap}
  .voucher_detail_page_pprice{align-items:flex-start;margin:0}
  .voucher_detail_page_picon{width:54px;height:54px;font-size:28px}
  .voucher_detail_page_drow,.voucher_detail_page_details>div+div .voucher_detail_page_drow{grid-template-columns:22px 1fr}
  .voucher_detail_page_dval{grid-column:2}
}

/* ---------- Exact design: photo stays inside the header line at its real size ---------- */
@media (min-width:992px){
  .voucher_detail_page_hero{background:#EDF5FD;height:417px;min-height:0}
  .voucher_detail_page_hero::after{content:"";position:absolute;top:0;bottom:0;
    left:max(1.5rem,calc(50% - 680px));right:max(1.5rem,calc(50% - 728px));
    background:linear-gradient(90deg,#F4F9FE,#ECF5FD) ;z-index:0}
  .voucher_detail_page_hero::before{content:"";position:absolute;top:0;bottom:0;z-index:1;
    right:max(1.5rem,calc(50% - 728px));width:min(1140px,calc(100% - 2 * max(1.5rem,50% - 704px)));
    background:url(../Vouchers/images/voucher_detail_page_hero.png) right center/auto 100% no-repeat}
  .voucher_detail_page_hero .container{position:relative;z-index:2}
  .voucher_detail_page_hero_text{padding:26px 0 22px 60px;max-width:640px}
  /* tabs + cards line up with the hero text box */
  .voucher_detail_page_tabs{margin:0 0 22px;border-radius:0 0 6px 6px}
  .voucher_detail_page_card{margin-left:14px;margin-right:14px}
}
/* trust items: three separate small cards */
.voucher_detail_page_trust{display:flex;flex-wrap:wrap;gap:12px;padding:0;background:none}
.voucher_detail_page_trust>div{font-size:13px;background:#fff;border:1px solid #d6dbe4;border-radius:8px;padding:8px 18px 8px 10px;
  box-shadow:0 2px 6px rgba(4,21,44,.08)}
.voucher_detail_page_ticon{width:44px;height:44px;font-size:22px}

/* ---------- Mobile / tablet fixes ---------- */
@media (max-width:991px){
  /* badge picture moves under the text instead of sitting behind it */
  .voucher_detail_page_hero{display:block;min-height:0;padding-bottom:210px;background:#EEF5FD url(../Vouchers/images/voucher_detail_page_hero.png) right bottom/auto 210px no-repeat}
  .voucher_detail_page_hero::before{display:none}
}


/* =========================================================
   SIGN IN PAGE  (header/footer, hero text + text scale live in ../common/common.css)
   ========================================================= */

/* ---------- Page width: lines up with the header ---------- */
@media (min-width:992px){
  .sign_in_page_hero .container{
    max-width:none;
    padding-left:max(1.5rem,calc(50% - 680px));
    padding-right:max(1.5rem,calc(50% - 728px));
  }
}

/* ---------- Hero: text | photo on blue circles | sign-in card ---------- */
.sign_in_page_hero{background:#EDF5FD;overflow:hidden;margin-bottom:90px}
.sign_in_page_grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;padding:32px 0}
.sign_in_page_art{display:none}

/* left text */
.sign_in_page_tag{display:flex;align-items:center;gap:6px;font-size:var(--fs-tag);color:var(--primary);margin:0 0 6px}
.sign_in_page_tag::after{content:"";width:42px;border-top:1px solid var(--primary)}
.sign_in_page_hero .sign_in_page_hero_text h1{line-height:1!important;margin:0 0 8px!important}
.sign_in_page_hero_sub{max-width:320px!important;line-height:1.45!important;margin:0 0 18px}
.sign_in_page_feats{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:20px}
.sign_in_page_feats li{display:flex;align-items:center;gap:14px}
.sign_in_page_ficon{width:42px;height:42px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:22px;color:var(--primary);flex-shrink:0;
  box-shadow:0 1px 4px rgba(4,21,44,.1)}
.sign_in_page_multi{background:linear-gradient(90deg,#076FE6 0 36%,#F5A623 36% 66%,#04BC5F 66%);-webkit-background-clip:text;background-clip:text;color:transparent}
.sign_in_page_red{color:#E5392A}
.sign_in_page_feats h3{font-size:var(--fs-label);font-weight:500;color:var(--dark);margin:0 0 2px}
.sign_in_page_feats p{font-size:12.5px;color:#4b5563;margin:0}

/* sign-in card */
.sign_in_page_card{background:#fff;border:1px solid #9aa6b8;border-radius:10px;padding:26px 24px 20px;text-align:center;
  box-shadow:2px 3px 4px rgba(4,21,44,.45),0 1px 2px rgba(4,21,44,.08)}
.sign_in_page_card_tag{font-size:12px;color:var(--primary);margin:0 0 4px}
.sign_in_page_card h2{font-size:22px;font-weight:600;color:var(--dark);line-height:1.2;margin:0 0 2px}
.sign_in_page_card_sub{font-size:var(--fs-small);color:#4b5563;margin:0 0 22px}
.sign_in_page_form{text-align:left}
.sign_in_page_field{margin-bottom:14px}
.sign_in_page_label{display:flex;justify-content:space-between;align-items:flex-end;font-size:var(--fs-small);margin-bottom:3px}
.sign_in_page_label label{color:var(--dark);margin:0}
.sign_in_page_label label sup{color:#E5252A;font-size:1em;top:-.25em}
.sign_in_page_label a{color:var(--primary)}
.sign_in_page_label a:hover,.sign_in_page_alt a:hover{text-decoration:underline}
.sign_in_page_input{display:flex;align-items:center;gap:10px;height:36px;border:1px solid #9aa6b8;border-radius:6px;padding:0 12px;background:#fff}
.sign_in_page_input:focus-within{border-color:var(--primary)}
.sign_in_page_input>i{font-size:15px;color:#374151}
.sign_in_page_input input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:12px;color:var(--dark)}
.sign_in_page_input input::placeholder{color:#8a94a6}
.sign_in_page_eye{border:0;background:none;padding:0;font-size:16px;color:#374151;line-height:1}
.sign_in_page_input.sign_in_page_invalid{border-color:#E5252A;background:#FDECEC}
.sign_in_page_err{display:none;font-size:var(--fs-small);color:#E5252A;margin:4px 0 0}
.sign_in_page_err.sign_in_page_show{display:block}
.sign_in_page_btn{width:100%;height:36px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:6px;font-size:var(--fs-label);font-weight:500;padding:0 16px;margin-top:20px}
.sign_in_page_or{display:flex;align-items:center;gap:10px;font-size:10px;color:#374151;margin:10px 0}
.sign_in_page_or::before,.sign_in_page_or::after{content:"";flex:1;border-top:1px solid #4b5563}
.sign_in_page_google{margin-top:0;background:#fff;border:1px solid #4b6390;color:var(--dark);font-size:12px}
.sign_in_page_google:hover{background:#F1F7FE;border-color:var(--primary);color:var(--dark)}
.sign_in_page_google svg{width:16px;height:16px}
.sign_in_page_alt{font-size:var(--fs-small);color:#374151;text-align:center;margin:24px 0 0}
.sign_in_page_alt a{color:var(--primary)}
.sign_in_page_ok{display:none;font-size:var(--fs-small);color:#11813A;background:#E4FBEB;border-radius:6px;padding:8px 12px;margin:12px 0 0;text-align:center}
.sign_in_page_ok.sign_in_page_show{display:block}

/* line above the footer (design shows it on this page) */
.sign_in_page_body .common_footer{padding-top:0}
.sign_in_page_body .common_footer .container-fluid::before{content:"";display:block;border-top:1px solid #6b7c96;margin-bottom:var(--section-gap)}

/* ---------- Desktop: three columns ---------- */
@media (min-width:992px){
  .sign_in_page_grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr) minmax(0,1.2fr);gap:0;padding:0 24px 0 36px;min-height:438px}
  .sign_in_page_hero_text{align-self:center;padding:30px 0;position:relative;z-index:1}
  /* photo stands on the bottom edge, two blue circles behind it */
  .sign_in_page_art{display:block;position:relative;align-self:end;justify-self:center;width:calc(100% + 40px);max-width:440px;margin:18px 0 0 -40px}
  .sign_in_page_art::before,.sign_in_page_art::after{content:"";position:absolute;border-radius:50%;aspect-ratio:1}
  .sign_in_page_art::before{left:2%;top:18%;width:71%;background:#0B5BD3}
  .sign_in_page_art::after{left:44%;top:32%;width:56%;background:#AFCBF5}
  .sign_in_page_art img{position:relative;z-index:1;display:block;width:100%}
  .sign_in_page_card{align-self:center;justify-self:end;width:100%;max-width:470px;margin:22px 0 14px;padding:30px 46px 22px;position:relative;z-index:2}
}
@media (min-width:992px) and (max-width:1199px){
  .sign_in_page_hero{--fs-heading:32px}
  .sign_in_page_grid{padding:0}
  .sign_in_page_card{padding:26px 24px 20px}
}
@media (max-width:991px){
  .sign_in_page_hero{margin-bottom:50px}
  .sign_in_page_card{max-width:480px}
}


/* =========================================================
   CREATE ACCOUNT PAGE  (header/footer, hero text + text scale live in ../common/common.css)
   ========================================================= */

/* ---------- Page width: lines up with the header ---------- */
@media (min-width:992px){
  .create_account_page_hero .container{
    max-width:none;
    padding-left:max(1.5rem,calc(50% - 680px));
    padding-right:max(1.5rem,calc(50% - 728px));
  }
}

/* ---------- Hero: text | create account card ---------- */
.create_account_page_hero{background:#EDF5FD;margin-bottom:60px}
.create_account_page_grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;padding:32px 0}

/* left text */
.create_account_page_tag{display:flex;align-items:center;gap:8px;font-size:var(--fs-tag);color:var(--primary);text-transform:uppercase;margin:0 0 8px}
.create_account_page_tag::after{content:"";width:42px;border-top:1px solid var(--primary)}
.create_account_page_hero .create_account_page_hero_text h1{line-height:1!important;max-width:300px;margin:0 0 10px!important}
.create_account_page_hero_sub{max-width:270px!important;line-height:1.5!important;margin:0 0 24px}
.create_account_page_feats{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:20px}
.create_account_page_feats li{display:flex;align-items:flex-start;gap:14px}
.create_account_page_ficon{width:42px;height:42px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:22px;color:var(--primary);flex-shrink:0;
  box-shadow:0 1px 4px rgba(4,21,44,.1)}
.create_account_page_multi{background:linear-gradient(90deg,#076FE6 0 36%,#F5A623 36% 66%,#04BC5F 66%);-webkit-background-clip:text;background-clip:text;color:transparent}
.create_account_page_red{color:#E5392A}
.create_account_page_feats h3{font-size:var(--fs-label);font-weight:500;color:var(--dark);margin:4px 0 2px}
.create_account_page_feats p{font-size:12.5px;color:#4b5563;line-height:1.7;max-width:220px;margin:0}

/* create account card */
.create_account_page_card{background:#fff;border-radius:12px;padding:26px 22px 14px;box-shadow:3px 4px 5px rgba(4,21,44,.5),0 1px 3px rgba(4,21,44,.1)}
.create_account_page_card h2{font-size:26px;font-weight:600;color:var(--dark);line-height:1;margin:0 0 2px}
.create_account_page_card_sub{font-size:var(--fs-small);color:#4b5563;margin:0 0 12px}
.create_account_page_row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);gap:0 8px}
.create_account_page_field{margin-bottom:10px}
.create_account_page_field>label{display:block;font-size:var(--fs-small);color:var(--dark);margin:0 0 3px}
.create_account_page_field sup{color:#E5252A;font-size:1em;top:-.25em}
.create_account_page_input{display:flex;align-items:center;gap:10px;height:34px;border:1px solid #9aa6b8;border-radius:5px;padding:0 10px 0 12px;background:#fff}
.create_account_page_input:focus-within{border-color:var(--primary)}
.create_account_page_input>i{font-size:15px;color:#374151}
.create_account_page_input input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:var(--fs-small);color:var(--dark)}
.create_account_page_input input::placeholder{color:#8a94a6}
.create_account_page_eye{border:0;background:none;padding:0;font-size:16px;color:#374151;line-height:1}
/* phone: flag + country code */
.create_account_page_phone{padding-left:0;gap:6px;overflow:hidden}
.create_account_page_cc{display:flex;align-items:center;gap:3px;align-self:stretch;padding:0 5px 0 8px;background:#EEF1F5;font-size:9px;color:#374151;white-space:nowrap}
.create_account_page_cc i{font-size:8px}
.create_account_page_flag{width:17px;height:12px;border-radius:1px}
/* states: green when filled correctly, red with a message when not */
.create_account_page_input.create_account_page_valid{border-color:#22A650}
.create_account_page_input.create_account_page_invalid{border-color:#E5252A;background:#FDECEC}
.create_account_page_phone.create_account_page_invalid input{color:#E5252A}
.create_account_page_input>.create_account_page_err_icon{display:none;font-size:14px;color:#E5252A}
.create_account_page_input.create_account_page_invalid>.create_account_page_err_icon{display:block}
/* message under the field: small red "!" + text */
.create_account_page_err{display:none;align-items:flex-start;gap:4px;font-size:8.5px;color:#E5252A;line-height:1.35;margin:4px 0 0 4px}
.create_account_page_err.create_account_page_show{display:flex}
.create_account_page_err i{font-size:8px;line-height:1.45;flex-shrink:0}

/* terms */
.create_account_page_terms{margin:2px 0 14px}
.create_account_page_terms label{display:flex;align-items:center;gap:6px;font-size:8.5px;color:#374151;margin:0 0 0 4px;cursor:pointer}
.create_account_page_terms input{width:11px;height:11px;accent-color:var(--primary);margin:0;flex-shrink:0}
.create_account_page_terms a{color:var(--primary);text-decoration:underline}
.create_account_page_terms a+a{text-decoration:none}

/* code (captcha) */
.create_account_page_captcha{display:grid;grid-template-columns:minmax(0,176px) minmax(0,150px);gap:4px;align-items:center}
.create_account_page_code{border:0;padding:0;background:none;line-height:0;border-radius:3px;overflow:hidden}
.create_account_page_code canvas{width:100%;height:38px;display:block}

/* buttons */
.create_account_page_btn{width:100%;height:34px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:6px;font-size:var(--fs-label);font-weight:500;padding:0 16px;margin-top:14px}
.create_account_page_or{display:flex;align-items:center;gap:10px;font-size:10px;color:#374151;margin:4px 16px 2px}
.create_account_page_or::before,.create_account_page_or::after{content:"";flex:1;border-top:1px solid #c9d3e3}
.create_account_page_google{margin-top:0;background:#fff;border:1px solid #9aa6b8;color:var(--dark);font-size:12px;font-weight:400}
.create_account_page_google:hover{background:#F1F7FE;border-color:var(--primary);color:var(--dark)}
.create_account_page_google svg{width:16px;height:16px}
.create_account_page_ok{display:none;font-size:var(--fs-small);color:#11813A;background:#E4FBEB;border-radius:6px;padding:8px 12px;margin:10px 0 0;text-align:center}
.create_account_page_ok.create_account_page_show{display:block}
.create_account_page_alt{font-size:10px;color:#374151;text-align:center;margin:12px 0 0}
.create_account_page_alt a{color:var(--primary);text-decoration:underline}

/* line above the footer (design shows it on this page) */
.create_account_page_body .common_footer{padding-top:0}
.create_account_page_body .common_footer .container-fluid::before{content:"";display:block;border-top:1px solid #6b7c96;margin-bottom:var(--section-gap)}

/* ---------- Desktop: text left, card right ---------- */
@media (min-width:992px){
  .create_account_page_grid{grid-template-columns:minmax(0,1fr) minmax(0,470px);gap:40px;padding:26px 90px 30px 76px;min-height:527px}
  .create_account_page_hero_text{padding-top:16px}
  .create_account_page_card{align-self:start;padding:30px 32px 16px}
}
@media (min-width:992px) and (max-width:1199px){
  .create_account_page_grid{padding:26px 0 30px;gap:24px}
}
@media (max-width:991px){
  .create_account_page_hero .create_account_page_hero_text h1,.create_account_page_hero_sub,.create_account_page_feats p{max-width:none!important}
  .create_account_page_card{max-width:520px}
}
@media (max-width:420px){
  .create_account_page_row{grid-template-columns:minmax(0,1fr)}
}


/* =========================================================
   SHARED: WAVE HERO + HELP BOX  —  Terms, Privacy, FAQ, Shopping Cart, Gift Course (and the student banner art)
   ========================================================= */
.common_wave_hero{position:relative;overflow:hidden;background:#EEF5FD url(images/common_wave_hero.svg) center/cover no-repeat}
.common_wave_hero .container{position:relative;z-index:1}
.common_wave_hero_center{text-align:center;padding:42px 0 30px;min-height:180px;display:flex;align-items:center}
.common_wave_hero_center .container{max-width:760px}
.common_wave_hero_left{padding:44px 0 50px;min-height:206px}
.common_wave_hero h1{margin:0 0 8px!important}
.common_wave_hero_sub{font-size:var(--fs-sub);color:#6b7280;line-height:1.5;margin:0 auto;max-width:520px}
.common_wave_hero_left .common_wave_hero_sub{margin:0;font-size:18px;max-width:600px}
.common_wave_hero_back{position:absolute;top:22px;right:0;display:inline-flex;align-items:center;gap:8px;font-size:var(--fs-label);color:var(--primary)}
.common_wave_hero_back:hover{color:var(--primary-dark)}

/* "Need help?" / "Still have questions?" box */
.common_help_box{display:flex;align-items:center;gap:22px;background:#EAF3FD;border-radius:6px;padding:16px 18px}
.common_help_icon{width:52px;height:52px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:28px;color:var(--primary);flex-shrink:0;box-shadow:0 4px 12px rgba(7,111,230,.12)}
.common_help_box h2{font-size:20px;font-weight:600;color:var(--dark);margin:0 0 2px}
.common_help_box p{font-size:13px;color:#6b7280;margin:0}
.common_help_box>div{flex:1;min-width:0}
.common_help_btn{display:inline-flex;align-items:center;gap:10px;font-size:var(--fs-label);font-weight:500;padding:9px 18px;border-radius:6px;white-space:nowrap}
.common_help_btn .bi-chevron-right{font-size:11px;-webkit-text-stroke:.6px}

/* framed card used by the new pages (same frame as the Course Detail cards) */
.common_frame{background:#fff;border:1px solid #8fa0bd;border-radius:6px;box-shadow:2px 3px 4px rgba(4,21,44,.35)}

@media (max-width:767px){
  .common_wave_hero_back{position:static;margin-bottom:10px}
  .common_wave_hero_left{padding:26px 0 32px;min-height:0}
  .common_wave_hero_left .common_wave_hero_sub{font-size:15px}
  .common_help_box{flex-wrap:wrap;gap:14px}
  .common_help_btn{width:100%;justify-content:center}
}

/* =========================================================
   TERMS & CONDITIONS / PRIVACY POLICY PAGES  (prefix legal_page_)
   ========================================================= */
.legal_page_main{padding:14px 0 calc(var(--section-gap) + 10px)}
.legal_page_main .container{max-width:1200px}
@media (min-width:992px){.legal_page_main .container{max-width:min(1170px,82vw)}}
.legal_page_grid{display:grid;grid-template-columns:252px minmax(0,1fr);gap:12px;align-items:start}
.legal_page_toc{position:sticky;top:90px;min-height:420px;padding:10px 0 16px}
.legal_page_toc h6{font-size:12px;font-weight:500;color:#6b7280;text-transform:uppercase;letter-spacing:.02em;margin:6px 16px 10px}
.legal_page_toc a{position:relative;display:flex;align-items:center;gap:14px;padding:8px 16px;font-size:12px;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.legal_page_toc a i{font-size:15px;color:#55657E;width:18px;text-align:center}
.legal_page_toc a:hover{color:var(--primary)}
.legal_page_toc a.active{background:#E7F3FD;color:var(--primary)}
.legal_page_toc a.active::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--primary)}
.legal_page_toc a.active i{color:var(--primary)}
.legal_page_card{padding:12px 20px 26px;min-height:420px}
.legal_page_head{display:flex;align-items:center;gap:16px;padding-bottom:12px;border-bottom:1px solid #9aa6b8;margin-bottom:12px}
.legal_page_head_icon{width:52px;height:52px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;font-size:24px;flex-shrink:0}
.legal_page_head h1{font-size:22px;font-weight:600;color:var(--dark);margin:0}
.legal_page_head p{font-size:11px;color:#6b7280;margin:2px 0 0}
.legal_page_intro{font-size:12px;color:#6b7280;line-height:1.6;margin:0 0 10px}
.legal_page_intro p{margin:0 0 6px}
.legal_page_list{display:flex;flex-direction:column;gap:6px;padding-top:6px}
.legal_page_item{border:1px solid #d3dbe7;border-radius:4px;box-shadow:0 2px 3px rgba(4,21,44,.18);background:#fff;scroll-margin-top:100px}
.legal_page_q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;border:0;background:none;text-align:left;padding:5px 12px;font-size:12px;font-weight:500;color:var(--dark)}
.legal_page_q i{font-size:12px;color:#6b7280;transition:transform .2s}
.legal_page_item.open .legal_page_q i{transform:rotate(180deg);color:var(--primary)}
.legal_page_a{display:none;padding:2px 14px 12px;font-size:12.5px;line-height:1.65;color:#4b5563;border-top:1px solid #eef1f6}
.legal_page_item.open .legal_page_a{display:block}
.legal_page_a p{margin:8px 0}
.legal_page_a ul,.legal_page_a ol{padding-left:20px;margin:6px 0}
.legal_page_a a{color:var(--primary);text-decoration:underline}
.legal_page_help{margin-top:12px}
@media (max-width:991px){
  .legal_page_grid{grid-template-columns:1fr}
  .legal_page_toc{position:static;min-height:0;display:flex;flex-wrap:wrap;gap:2px;padding:10px}
  .legal_page_toc h6{width:100%;margin:2px 6px 6px}
  .legal_page_toc a{padding:6px 10px}
  .legal_page_toc a.active::before{display:none}
  .legal_page_card{min-height:0}
}

/* =========================================================
   FAQ PAGE  (prefix faq_page_)
   ========================================================= */
.faq_page_main{padding:12px 0 calc(var(--section-gap) + 10px)}
.faq_page_main .container{max-width:910px}
@media (min-width:992px){.faq_page_main .container{max-width:min(890px,64vw)}}
.faq_page_item{border:1px solid #9aa6b8;border-radius:8px;box-shadow:2px 3px 4px rgba(4,21,44,.3);background:#fff;margin-bottom:12px}
.faq_page_q{width:100%;display:flex;align-items:center;gap:22px;border:0;background:none;text-align:left;padding:12px 26px 12px 18px}
.faq_page_num{width:40px;height:40px;border-radius:50%;background:#E7F3FD;color:var(--primary);display:grid;place-items:center;font-size:22px;flex-shrink:0}
.faq_page_q span:nth-child(2){flex:1;font-size:20px;font-weight:500;color:var(--dark);line-height:1.3}
.faq_page_q i{font-size:18px;color:#6b7280;-webkit-text-stroke:.5px;transition:transform .2s}
.faq_page_item.open .faq_page_q i{transform:rotate(180deg);color:var(--primary)}
.faq_page_item.open .faq_page_q span:nth-child(2){padding-bottom:6px;border-bottom:1px solid #9aa6b8}
.faq_page_a{display:none;padding:4px 26px 24px 80px;font-size:15px;line-height:1.6;color:#6b7280}
.faq_page_item.open .faq_page_a{display:block}
.faq_page_help{margin-top:56px}
.faq_page_empty{text-align:center;color:#6b7280;padding:40px 0}
@media (max-width:576px){
  .faq_page_q{gap:12px;padding:10px 14px}
  .faq_page_num{width:32px;height:32px;font-size:16px}
  .faq_page_q span:nth-child(2){font-size:16px}
  .faq_page_a{padding:2px 16px 18px;font-size:14px}
  .faq_page_help{margin-top:30px}
}

/* =========================================================
   SHOPPING CART PAGE  (prefix cart_page_)
   ========================================================= */
.cart_page_main{padding:30px 0 calc(var(--section-gap) + 10px)}
@media (min-width:992px){
  .cart_page_main .container,.cart_page_hero .container,.gift_page_main .container,.gift_page_hero .container{max-width:min(1270px,88vw)}
}
.cart_page_grid{display:grid;grid-template-columns:minmax(0,1fr) 385px;gap:22px;align-items:start}
.cart_page_item{display:flex;align-items:center;gap:22px;padding:16px 26px 16px 18px;margin-bottom:14px;border-radius:8px}
.cart_page_thumb{width:200px;height:120px;border-radius:6px;overflow:hidden;flex-shrink:0;background:#E7F3FD}
.cart_page_thumb img{width:100%;height:100%;object-fit:cover}
.cart_page_info{flex:1;min-width:0}
.cart_page_badge{display:inline-block;font-size:11px;font-weight:500;padding:3px 10px;border-radius:20px;margin-bottom:6px}
.cart_page_badge_green{background:#DDF5E6;color:#0F7A43}
.cart_page_badge_blue{background:#E7F3FD;color:var(--primary)}
.cart_page_info h2{font-size:18px;font-weight:500;color:var(--dark);line-height:1.35;margin:0 0 8px}
.cart_page_info h2 a{color:inherit}
.cart_page_info h2 a:hover{color:var(--primary)}
.cart_page_inst{display:flex;align-items:center;gap:8px;font-size:13px;color:#6b7280;margin:0}
.cart_page_inst i{font-size:16px}
.cart_page_side{display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:16px;align-self:stretch;padding:4px 0}
.cart_page_price{font-size:26px;font-weight:600;color:var(--primary);line-height:1}
.cart_page_price del{display:block;font-size:13px;font-weight:400;color:#9ca3af;text-align:right;margin-top:4px}
.cart_page_remove{width:38px;height:38px;border:0;border-radius:6px;background:#FDE2E2;color:#E11D2E;display:grid;place-items:center;font-size:18px}
.cart_page_remove:hover{background:#FBC9C9;color:#E11D2E}
.cart_page_empty{text-align:center;padding:44px 20px}
.cart_page_empty i{font-size:48px;color:#b8c7dc}
.cart_page_empty h2{font-size:22px;font-weight:600;color:var(--dark);margin:10px 0 6px}
.cart_page_empty p{color:#6b7280;margin:0 0 18px}

/* order summary */
.cart_page_summary{padding:20px 22px 24px;border-radius:8px}
.cart_page_summary h2{font-size:20px;font-weight:500;color:var(--dark);margin:0 0 20px}
.cart_page_row{display:flex;justify-content:space-between;font-size:14px;color:#6b7280;margin-bottom:12px}
.cart_page_row span:last-child{color:var(--dark)}
.cart_page_total{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #9aa6b8;padding-top:16px;margin:4px 0 16px}
.cart_page_total span:first-child{font-size:18px;font-weight:600;color:var(--dark)}
.cart_page_total span:last-child{font-size:26px;font-weight:600;color:var(--primary)}
.cart_page_coupon{display:flex;gap:8px;margin-bottom:16px}
.cart_page_coupon input{flex:1;min-width:0;border:1px solid #9aa6b8;border-radius:6px;padding:8px 14px;font-size:14px}
.cart_page_coupon input:focus{outline:0;border-color:var(--primary)}
.cart_page_coupon button{border:0;border-radius:6px;background:var(--dark);color:#fff;font-size:16px;font-weight:500;padding:8px 20px}
.cart_page_coupon_ok{font-size:12px;color:#0F7A43;margin:-8px 0 12px}
.cart_page_gift{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--dark);margin-bottom:18px;cursor:pointer}
.cart_page_gift input{width:16px;height:16px}
.cart_page_checkout{width:100%;font-size:var(--fs-label);font-weight:500;padding:11px 16px;border-radius:6px;display:flex;align-items:center;justify-content:center;gap:4px}

/* you may also like */
.cart_page_more{margin-top:20px}
.cart_page_more_head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.cart_page_more_head h2{font-size:22px;font-weight:500;color:var(--dark);margin:0}
.cart_page_more_head a{font-size:13px;color:var(--primary)}
.cart_page_cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.cart_page_card{padding:10px 10px 12px;border-radius:8px;display:flex;flex-direction:column}
.cart_page_card_thumb{position:relative;height:96px;border-radius:6px;overflow:hidden;background:#FFF4E2;display:block}
.cart_page_card_thumb img{width:100%;height:100%;object-fit:cover}
.cart_page_heart{position:absolute;top:6px;right:6px;width:28px;height:28px;border:0;border-radius:50%;background:rgba(255,255,255,.9);display:grid;place-items:center;font-size:14px;color:var(--dark)}
.cart_page_heart .bi-heart-fill{color:#e0204c}
.cart_page_card h3{font-size:15px;font-weight:400;color:var(--dark);text-align:center;line-height:1.35;margin:12px 4px 10px;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cart_page_card h3 a{color:inherit}
.cart_page_card_foot{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding:0 4px}
.cart_page_card_foot strong{font-size:20px;font-weight:600;color:var(--primary)}
.cart_page_card_cart{width:38px;height:34px;border-radius:6px;background:#E7F3FD;color:var(--primary);display:grid;place-items:center;font-size:18px}
.cart_page_card_cart:hover{background:var(--primary);color:#fff}
@media (max-width:991px){.cart_page_cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:991px){.cart_page_grid{grid-template-columns:1fr}}
@media (max-width:576px){
  .cart_page_item{flex-wrap:wrap;padding:14px;gap:14px}
  .cart_page_thumb{width:100%;height:160px}
  .cart_page_side{flex-direction:row;align-items:center;width:100%}
  .cart_page_cards{grid-template-columns:1fr}
}

/* =========================================================
   GIFT COURSE PAGE  (prefix gift_page_)
   ========================================================= */
.gift_page_main{padding:30px 0 calc(var(--section-gap) + 10px)}
.gift_page_grid{display:grid;grid-template-columns:minmax(0,1fr) 335px;gap:36px;align-items:start}
.gift_page_box{background:#fff;border:1px solid #9aa6b8;border-radius:6px;padding:16px 22px 22px;margin-bottom:14px}
.gift_page_box_head{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.gift_page_box_icon{width:36px;height:36px;border-radius:50%;background:#E7F3FD;color:var(--primary);display:grid;place-items:center;font-size:18px}
.gift_page_box_head h2{font-size:17px;font-weight:600;color:var(--dark);margin:0}
.gift_page_label{font-size:14px;color:var(--dark);margin-bottom:6px;display:block}
.gift_page_input{width:100%;border:1px solid #9aa6b8;border-radius:6px;padding:9px 14px;font-size:14px;color:var(--dark);background:#fff}
.gift_page_input:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 3px rgba(7,111,230,.12)}
.gift_page_input.is-invalid{border-color:#E11D2E}
.gift_page_err{font-size:12px;color:#E11D2E;margin-top:4px}
textarea.gift_page_input{min-height:80px;resize:vertical}
.gift_page_method{display:flex;align-items:center;gap:18px;border:1px solid #9aa6b8;border-radius:6px;padding:8px 18px;margin-bottom:8px;cursor:pointer}
.gift_page_method:last-child{margin-bottom:0}
.gift_page_method.active{background:#EAF3FD;border-color:var(--primary)}
.gift_page_method input{position:absolute;opacity:0;pointer-events:none}
.gift_page_logo{width:64px;text-align:center;font-size:18px;font-weight:700;color:#635BFF;flex-shrink:0}
.gift_page_logo img{max-width:64px;max-height:28px}
.gift_page_logo i{font-size:26px;color:var(--dark)}
.gift_page_method strong{display:block;font-size:14px;font-weight:500;color:var(--dark)}
.gift_page_method small{display:block;font-size:13px;color:#6b7280}
.gift_page_method>div{flex:1;min-width:0}
.gift_page_radio{width:20px;height:20px;border-radius:50%;border:2px solid #6b7280;flex-shrink:0;position:relative}
.gift_page_method.active .gift_page_radio{border-color:var(--primary)}
.gift_page_method.active .gift_page_radio::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--primary)}

.gift_page_summary{padding:20px 22px 22px;border-radius:8px}
.gift_page_summary h2{font-size:15px;font-weight:500;color:var(--dark);margin:0 0 16px}
.gift_page_course{display:flex;gap:14px;align-items:center;margin-bottom:12px}
.gift_page_course img{width:140px;height:86px;object-fit:cover;border-radius:6px;flex-shrink:0;background:#E7F3FD}
.gift_page_course h3{font-size:15px;font-weight:500;color:var(--dark);line-height:1.35;margin:0 0 4px}
.gift_page_course strong{font-size:18px;font-weight:600;color:var(--primary)}
.gift_page_rows{border-top:1px solid #9aa6b8;padding-top:14px;margin-top:6px}
.gift_page_total{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #9aa6b8;padding-top:14px;margin:6px 0 16px}
.gift_page_total span:first-child{font-size:18px;font-weight:600;color:var(--dark)}
.gift_page_total span:last-child{font-size:22px;font-weight:600;color:var(--primary)}
.gift_page_pay{width:100%;font-size:var(--fs-label);font-weight:500;padding:11px 16px;border-radius:6px;display:flex;align-items:center;justify-content:center;gap:10px}

.gift_page_banner{position:relative;overflow:hidden;display:flex;align-items:center;gap:28px;background:linear-gradient(90deg,#EEF5FD,#F6FAFE);border-radius:6px;padding:14px 26px;margin-top:14px;min-height:96px}
.gift_page_banner_gift{font-size:62px;color:var(--primary);line-height:1;flex-shrink:0;position:relative}
.gift_page_banner_gift::after{content:"";position:absolute;top:6px;right:-10px;width:12px;height:12px;border-top:2px solid #F43F5E;border-right:2px solid #F43F5E;transform:rotate(-20deg)}
.gift_page_banner h2{font-size:20px;font-weight:500;color:var(--dark);margin:0 0 4px}
.gift_page_banner p{font-size:13px;color:#6b7280;margin:0;max-width:360px}
.gift_page_banner_leaf{position:absolute;right:20px;bottom:-6px;width:120px;height:110px}
@media (max-width:991px){.gift_page_grid{grid-template-columns:1fr}}
@media (max-width:576px){
  .gift_page_box{padding:14px}
  .gift_page_course img{width:100px;height:64px}
  .gift_page_banner{padding:14px 16px;gap:16px}
  .gift_page_banner_gift{font-size:44px}
  .gift_page_banner_leaf{display:none}
}

/* =========================================================
   STUDENT DASHBOARD  (prefix student_dashboard_page_)
   ========================================================= */
.student_dashboard_page{padding:4px 0 calc(var(--section-gap) + 10px)}
.student_dashboard_page>.container{max-width:1270px}
@media (min-width:992px){.student_dashboard_page>.container{max-width:min(1260px,88vw)}}
.student_dashboard_page_profile{border:1px solid #8fa0bd;border-radius:10px;overflow:hidden;background:#fff;margin-bottom:22px}
.student_dashboard_page_banner{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:118px;padding:16px 40px 0 70px;
  background:#EEF5FD url(images/common_wave_hero.svg) center/cover no-repeat;border-bottom:1px solid #8fa0bd}
.student_dashboard_page_who{display:flex;align-items:center;gap:18px;transform:translateY(22px)}
.student_dashboard_page_avatar{position:relative;width:84px;height:84px;flex-shrink:0}
.student_dashboard_page_avatar img,.student_dashboard_page_avatar>span{width:84px;height:84px;border-radius:50%;object-fit:cover;border:3px solid var(--primary);background:#DCEBFC;
  display:grid;place-items:center;font-size:30px;font-weight:600;color:var(--navy)}
.student_dashboard_page_camera{position:absolute;right:-2px;bottom:2px;width:26px;height:26px;border-radius:50%;background:var(--primary);color:#fff;border:2px solid #fff;
  display:grid;place-items:center;font-size:12px;cursor:pointer}
.student_dashboard_page_camera input{display:none}
.student_dashboard_page_who h1{font-size:18px;font-weight:600;color:var(--dark);margin:0 0 8px}
.student_dashboard_page_role{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:500;color:var(--primary);background:#DCEBFC;border-radius:6px;padding:4px 10px}
.student_dashboard_page_balance{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:#0F7A43;background:#CFF3E3;border-radius:20px;padding:8px 18px;margin-top:20px}
.student_dashboard_page_balance i{font-size:20px;color:#14B47A}
.student_dashboard_page_tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding:0 18px;margin:0;list-style:none}
.student_dashboard_page_tabs::-webkit-scrollbar{display:none}
.student_dashboard_page_tab{display:flex;align-items:center;gap:8px;white-space:nowrap;border:0;background:none;padding:18px 12px 14px;font-size:12.5px;color:#374151;border-bottom:3px solid transparent}
.student_dashboard_page_tab i{font-size:14px;color:#55657E}
.student_dashboard_page_tab:hover,.student_dashboard_page_tab.active{color:var(--primary)}
.student_dashboard_page_tab.active{border-bottom-color:var(--primary)}
.student_dashboard_page_tab.active i{color:var(--primary)}

.student_dashboard_page_title{font-size:28px;font-weight:600;color:var(--dark);margin:0}
.student_dashboard_page_welcome{font-size:15px;color:#6b7280;margin:0 0 14px}
.student_dashboard_page_stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px}
.student_dashboard_page_stat{display:flex;align-items:center;gap:20px;padding:14px 18px;border-radius:6px;min-height:96px}
.student_dashboard_page_sicon{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;font-size:30px;flex-shrink:0}
.student_dashboard_page_s_blue{background:#DCEBFC;color:var(--primary)}
.student_dashboard_page_s_purple{background:#EDE6FE;color:#7C3AED}
.student_dashboard_page_s_green{background:#DDF5E6;color:#16A34A}
.student_dashboard_page_s_orange{background:#FDE5D8;color:#EA580C}
.student_dashboard_page_stat strong{display:block;font-size:24px;font-weight:600;color:var(--dark);line-height:1.1}
.student_dashboard_page_stat small{font-size:13px;color:#4b5563}
.student_dashboard_page_learning{padding:18px 26px 24px;border-radius:6px;margin:0 -28px}
.student_dashboard_page_learning_head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.student_dashboard_page_learning_head h2{font-size:18px;font-weight:500;color:var(--dark);margin:0}
.student_dashboard_page_learning_head a{font-size:13px;color:var(--primary)}
.student_dashboard_page_courses{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.student_dashboard_page_course{display:flex;gap:16px;padding:0 14px 0 0;border-radius:6px;overflow:hidden}
.student_dashboard_page_course_img{width:165px;min-height:100px;flex-shrink:0;background:#E7F3FD}
.student_dashboard_page_course_img img{width:100%;height:100%;object-fit:cover}
.student_dashboard_page_course_body{flex:1;min-width:0;padding:12px 0}
.student_dashboard_page_course h3{font-size:14px;font-weight:500;color:var(--dark);margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.student_dashboard_page_course small{font-size:11px;color:#6b7280}
.student_dashboard_page_progress{display:flex;align-items:center;gap:14px;margin:6px 0 10px}
.student_dashboard_page_progress div{flex:1;height:6px;background:#E3EAF4;border-radius:3px;overflow:hidden}
.student_dashboard_page_progress b{display:block;height:100%;background:var(--primary);border-radius:3px}
.student_dashboard_page_progress span{font-size:12px;color:var(--dark)}
.student_dashboard_page_course_foot{display:flex;justify-content:space-between;align-items:center;gap:10px}
.student_dashboard_page_continue{display:inline-flex;align-items:center;gap:8px;font-size:12px;padding:5px 14px;border-radius:3px}
.student_dashboard_page_state{font-size:11px;color:#16A34A;white-space:nowrap}
.student_dashboard_page_state_done{color:var(--primary)}
.student_dashboard_page_empty{text-align:center;color:#6b7280;padding:30px 0}
@media (max-width:1199px){.student_dashboard_page_learning{margin:0}}
@media (max-width:991px){
  .student_dashboard_page_stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .student_dashboard_page_courses{grid-template-columns:1fr}
}
@media (max-width:576px){
  .student_dashboard_page_banner{flex-wrap:wrap;padding:14px 16px 0}
  .student_dashboard_page_who{transform:none}
  .student_dashboard_page_balance{margin:0 0 12px}
  .student_dashboard_page_stats{grid-template-columns:1fr}
  .student_dashboard_page_learning{padding:16px}
  .student_dashboard_page_course{flex-direction:column;padding:0}
  .student_dashboard_page_course_img{width:100%;height:140px}
  .student_dashboard_page_course_body{padding:0 14px 14px}
}

/* =========================================================
   WISHLIST PAGE  (prefix wishlist_page_; the cards reuse the Shopping Cart "You may also like" card)
   ========================================================= */
.wishlist_page_main{padding:30px 0 calc(var(--section-gap) + 10px)}
@media (min-width:992px){.wishlist_page_main .container,.wishlist_page_hero .container{max-width:min(1270px,88vw)}}
.wishlist_page_grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.wishlist_page_grid .cart_page_card_thumb{height:130px}
.wishlist_page_inst{display:flex;align-items:center;justify-content:center;gap:6px;font-size:12px;color:#6b7280;margin:-4px 0 10px}
.wishlist_page_rating{display:inline-flex;align-items:center;gap:3px;color:#F5A623;font-size:12px}
.wishlist_page_rating span{color:#4b5563}
.wishlist_page_card_gone{opacity:0;transform:scale(.96);transition:opacity .25s,transform .25s}
.wishlist_page_empty{text-align:center;padding:44px 20px}
.wishlist_page_empty i{font-size:48px;color:#b8c7dc}
.wishlist_page_empty h2{font-size:22px;font-weight:600;color:var(--dark);margin:10px 0 6px}
.wishlist_page_empty p{color:#6b7280;margin:0 0 18px}
.wishlist_page_pages{display:flex;justify-content:center;margin-top:22px}
@media (max-width:1199px){.wishlist_page_grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:991px){.wishlist_page_grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:576px){.wishlist_page_grid{grid-template-columns:1fr}.wishlist_page_grid .cart_page_card_thumb{height:170px}}

/* =========================================================
   FORGOT / RESET PASSWORD PAGES  (prefix password_page_; layout and fields reuse the SIGN IN PAGE block)
   ========================================================= */
.password_page_meter{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:8px 2px 0}
.password_page_meter b{height:4px;border-radius:2px;background:#E3EAF4;transition:background .2s}
.password_page_meter[data-level="1"] b:nth-child(-n+1){background:#E11D2E}
.password_page_meter[data-level="2"] b:nth-child(-n+2){background:#F59E0B}
.password_page_meter[data-level="3"] b:nth-child(-n+3){background:#3B82F6}
.password_page_meter[data-level="4"] b{background:#16A34A}
.password_page_strength{font-size:var(--fs-small);color:#6b7280;margin:4px 2px 0;min-height:14px}
.sign_in_page_alt a i{font-size:12px;margin-right:4px}

/* =========================================================
   PHONES (every page)  —  no hero pictures, easier form fields, sliders whose arrows do not cover the content
   Keep this block last so it wins over the page blocks above.
   ========================================================= */
@media (max-width:767px){
  /* ---------- Hero: text only, the picture is hidden ---------- */
  .home_page_hero_img,.c-hero-slides,.c-hero-dots{display:none}
  .about_page_hero::before,.contact_page_hero::before,.career_page_hero::before,.instructor_page_hero::before,
  .voucher_page_hero::before,.certificate_page_hero::before{display:none}
  .about_page_hero,.contact_page_hero,.career_page_hero,.instructor_page_hero,.voucher_page_hero,.voucher_detail_page_hero{padding-bottom:0;min-height:0}
  .certificate_page_hero{background:#EDF5FD;min-height:0}
  .voucher_detail_page_hero{background:#EEF5FD}
  .c-hero{min-height:0}
  /* the text block closes the hero now, so it needs its own space at the bottom */
  .about_page_hero_text,.career_page_hero_text,.instructor_page_hero_text,.voucher_page_hero_text{padding-top:36px;padding-bottom:36px}
  .contact_page_hero_text{padding:36px 0}

  /* ---------- Sliders ---------- */
  /* Home categories: arrows get their own lane beside the cards */
  .home_page_slider_wrap{padding:0 30px}
  .home_page_slide_btn{width:32px;height:32px}
  .home_page_slide_btn.home_page_prev{left:-6px}
  .home_page_slide_btn.home_page_next{right:-6px}
  /* Home featured courses: one card at a time (side cards are hidden by common.js), arrows beside it */
  .home_page_stage_btn{width:36px;height:36px;font-size:16px}
  /* Instructor stories: arrows move under the card so they never cover the quote */
  .instructor_page_story_slider{padding-bottom:58px}
  .instructor_page_story_btn{top:auto;bottom:0;transform:none}
  .instructor_page_prev{left:calc(50% - 52px)}
  .instructor_page_next{right:calc(50% - 52px)}

  /* ---------- Form fields: taller boxes, readable text ---------- */
  .sign_in_page_input,.create_account_page_input{height:42px}
  .sign_in_page_input input,.create_account_page_input input{font-size:14px}
  .sign_in_page_label,.create_account_page_field>label{font-size:13px;margin-bottom:5px}
  .sign_in_page_btn,.create_account_page_btn{height:44px}
  .sign_in_page_google,.create_account_page_google{font-size:14px}
  .sign_in_page_err,.sign_in_page_alt,.sign_in_page_card_sub,.sign_in_page_or,
  .create_account_page_alt,.create_account_page_card_sub,.create_account_page_or{font-size:12px}
  .create_account_page_err{font-size:11px}
  .create_account_page_err i{font-size:11px}
  .create_account_page_field{margin-bottom:14px}
  .create_account_page_terms label{font-size:12px;line-height:1.4;align-items:flex-start;gap:8px;margin-left:0}
  .create_account_page_terms input{width:15px;height:15px;margin-top:1px}
  .create_account_page_cc{font-size:12px;padding:0 8px 0 10px}
  .create_account_page_flag{width:20px;height:14px}
  .create_account_page_captcha{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:8px}
  .create_account_page_code canvas{height:42px}
  .create_account_page_or{margin:8px 16px}
}
@media (max-width:576px){
  /* Certificate search: the row is stacked here, so the field must keep its own height */
  .certificate_page_input{flex:none}
  /* Courses filters: one card per row on phones, so the grid / list switch is not needed */
  .view-toggle{display:none}
  .f-search{flex:1 1 60%}
  .f-select,.f-select.f-sm,#fSort{flex:1 1 calc(50% - 6px);min-width:0}
}
@media (max-width:767px){
  /* Navbar menu: no search box on phones (!important beats Bootstrap's d-flex on the form) */
  .common_main_nav .common_search_box{display:none!important}
}

/* =========================================================
   DESIGN MATCH (2 Oct)  —  sizes re-checked against the Figma pictures of Terms, Privacy, FAQ,
   Shopping Cart, Gift Course and Student Dashboard (the first versions were about 20% larger)
   ========================================================= */
/* wave hero: lower, with a smaller centred heading (Terms / Privacy / FAQ) */
.common_wave_hero_center{padding:30px 0 22px;min-height:142px}
.common_wave_hero_center h1{font-size:36px!important}
.common_wave_hero_center .common_wave_hero_sub{font-size:14px;max-width:450px}
.common_wave_hero_left{padding:36px 0 40px;min-height:162px}
.common_wave_hero_left h1{font-size:41px!important}
.common_wave_hero_left .common_wave_hero_sub{font-size:17px}

/* Terms / Privacy */
@media (min-width:992px){.legal_page_grid{grid-template-columns:200px minmax(0,1fr)}}
.legal_page_toc h6{font-size:11px}
.legal_page_toc a{font-size:11px;gap:12px;padding:7px 14px;white-space:normal;line-height:1.35}
.legal_page_toc a i{font-size:14px}
.legal_page_head_icon{width:44px;height:44px;font-size:20px}
.legal_page_head h1{font-size:19px}
.legal_page_intro{font-size:11px}
.legal_page_q{font-size:11.5px;padding:4px 12px}

/* FAQ */
.faq_page_item{margin-bottom:11px}
.faq_page_q{gap:20px;padding:10px 22px 10px 16px}
.faq_page_num{width:32px;height:32px;font-size:20px}
.faq_page_q span:nth-child(2){font-size:16px}
.faq_page_q i{font-size:15px}
.faq_page_a{padding:4px 22px 20px 68px;font-size:13px}

/* Shopping Cart */
@media (min-width:992px){.cart_page_grid{grid-template-columns:minmax(0,1fr) 305px;gap:18px}}
.cart_page_item{gap:18px;padding:14px 22px 14px 16px}
.cart_page_thumb{width:158px;height:95px}
.cart_page_info h2{font-size:16px}
.cart_page_price{font-size:22px}
.cart_page_summary{padding:18px 20px 22px}
.cart_page_summary h2{font-size:16px;margin-bottom:16px}
.cart_page_row{font-size:12.5px}
.cart_page_total span:first-child{font-size:15px}
.cart_page_total span:last-child{font-size:22px}
.cart_page_coupon input{font-size:12.5px}
.cart_page_coupon button{font-size:15px;padding:7px 18px}
.cart_page_gift{font-size:12.5px}
.cart_page_checkout{font-size:12.5px;padding:9px 14px}
.cart_page_more_head h2{font-size:19px}
.cart_page_card h3{font-size:13px}
.cart_page_card_foot strong{font-size:17px}

/* Gift Course */
.gift_page_box_head h2{font-size:15px}
.gift_page_label{font-size:13px}
.gift_page_input{padding:8px 14px;font-size:13px}
.gift_page_method{padding:7px 18px}
.gift_page_course h3{font-size:14px}
.gift_page_total span:first-child{font-size:17px}
.gift_page_total span:last-child{font-size:20px}

/* Student Dashboard: smaller banner, and all 10 tabs on one line (they still scroll on smaller screens) */
.student_dashboard_page_banner{min-height:94px;padding:12px 40px 0 56px}
.student_dashboard_page_who{transform:translateY(18px)}
.student_dashboard_page_avatar,.student_dashboard_page_avatar img,.student_dashboard_page_avatar>span{width:66px;height:66px}
.student_dashboard_page_avatar>span{font-size:24px}
.student_dashboard_page_who h1{font-size:15px;margin-bottom:6px}
.student_dashboard_page_balance{font-size:12px;padding:6px 14px;margin-top:14px}
.student_dashboard_page_balance i{font-size:17px}
@media (min-width:992px){
  .student_dashboard_page_tabs{justify-content:space-between;padding:0 14px}
  .student_dashboard_page_tab{padding:14px 6px 12px;font-size:11px;gap:6px}
  .student_dashboard_page_tab i{font-size:12px}
}
.student_dashboard_page_title{font-size:24px}
.student_dashboard_page_welcome{font-size:13px}
.student_dashboard_page_stat{min-height:78px;padding:12px 16px;gap:16px}
.student_dashboard_page_sicon{width:52px;height:52px;font-size:24px}
.student_dashboard_page_stat strong{font-size:20px}
.student_dashboard_page_stat small{font-size:11px}
.student_dashboard_page_learning_head h2{font-size:16px}

@media (max-width:576px){
  .common_wave_hero_center h1,.common_wave_hero_left h1{font-size:30px!important}
  .student_dashboard_page_banner{padding:12px 16px 0}
  .cart_page_thumb{width:100%;height:auto}
}

/* Student portal (2 Oct design): the area under the header is light grey, the cards stay white;
   a thin line separates it from the footer. Also the older student pages (body.student_portal_body). */
.student_dashboard_page,.student_portal_body main{background:#F1F3F7}
.student_dashboard_page,.student_portal_body main{border-bottom:1px solid #8fa0bd}
.student_dashboard_page{padding-top:10px}
.student_dashboard_page_profile{box-shadow:0 1px 3px rgba(4,21,44,.08)}

/* Student portal top (2 Oct design): a wave band under the header, the profile card sits over it;
   the card itself is plain (no waves inside), the tabs are inside the card with no line above them */
.student_dashboard_page{position:relative;padding-top:40px}
.student_dashboard_page::before{content:"";position:absolute;left:0;right:0;top:0;height:143px;background:#EEF5FD url(images/common_wave_hero.svg) center/cover no-repeat}
.student_dashboard_page>.container{position:relative}
.student_dashboard_page_profile{background:#F8FAFD;border-radius:12px;box-shadow:0 2px 6px rgba(4,21,44,.06)}
.student_dashboard_page_banner{background:none;border-bottom:0;min-height:0;padding:22px 32px 0 30px;align-items:center}
.student_dashboard_page_who{transform:none;gap:16px}
.student_dashboard_page_avatar,.student_dashboard_page_avatar img,.student_dashboard_page_avatar>span{width:84px;height:84px}
.student_dashboard_page_avatar img,.student_dashboard_page_avatar>span{border:2px solid var(--primary);padding:3px;background-clip:content-box;background-color:#DCEBFC}
.student_dashboard_page_avatar>span{font-size:28px}
.student_dashboard_page_who h1{font-size:17px;font-weight:600;margin-bottom:6px}
.student_dashboard_page_role{font-size:11px;padding:4px 12px;border-radius:12px}
.student_dashboard_page_balance{margin-top:0;font-size:12.5px;padding:8px 18px}
.student_dashboard_page_tabs{margin-top:6px}
.student_dashboard_page_tab{padding-top:10px}
@media (max-width:576px){
  .student_dashboard_page{padding-top:20px}
  .student_dashboard_page::before{height:100px}
  .student_dashboard_page_banner{padding:16px 16px 0}
  .student_dashboard_page_balance{margin:10px 0 0}
}