@charset "UTF-8";
  @import url("https://fonts.googleapis.com/css2?family=Syne:wght@600;700;800&family=Inter:wght@400;500;600&display=swap"); :root {
--navy:        #1A2B4A;
--navy-dark:   #0F1D33;
--navy-mid:    #243558;
--orange:      #E8600A;
--orange-light:#F5843A;
--orange-pale: #FEF0E6;
--white:       #FFFFFF;
--gray-50:     #F7F8FA;
--gray-100:    #ECEEF2;
--gray-200:    #D4D8E0;
--gray-400:    #9199AA;
--gray-600:    #5A6273;
--gray-900:    #1C2028;
--font-heading: 'Syne', system-ui, sans-serif;
--font-body:    'Inter', system-ui, sans-serif;
--radius-sm:   6px;
--radius-md:   12px;
--radius-lg:   18px;
--radius-xl:   28px;
--shadow-card: 0 2px 12px rgba(26,43,74,0.08);
--shadow-hover:0 6px 24px rgba(26,43,74,0.14);
--container:   1200px;
--gap:         clamp(1.5rem, 4vw, 3rem);
--section-y:   clamp(3rem, 8vw, 6rem);
} *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
font-family: var(--font-body);
color: var(--gray-900);
background: var(--white);
line-height: 1.7;
-webkit-font-smoothing: antialiased;
}
img, video { max-width: 100%; height: auto; display: block; }
a { color: var(--orange); text-decoration: none; transition: color .2s; }
a:hover { color: var(--orange-light); }
ul, ol { list-style: none; } h1, h2, h3, h4, h5, h6 {
font-family: var(--font-heading);
color: var(--navy);
line-height: 1.2;
font-weight: 700; white-space: normal;
overflow-wrap: break-word;
word-break: normal;
}
h1 { font-size: clamp(2rem, 5vw, 3.5rem); }
h2 { font-size: clamp(1.6rem, 3.5vw, 2.5rem); }
h3 { font-size: clamp(1.25rem, 2.5vw, 1.75rem); }
h4 { font-size: 1.2rem; }
h5 { font-size: 1rem; }
p { margin-bottom: 1rem; color: var(--gray-600); }
p:last-child { margin-bottom: 0; }
.lead {
font-size: 1.2rem;
color: var(--gray-600);
line-height: 1.7;
} .container {
max-width: var(--container);
margin: 0 auto;
padding: 0 clamp(1rem, 4vw, 2rem);
}
.container--narrow { max-width: 800px; }
.container--wide   { max-width: 1400px; }
.section { padding: var(--section-y) 0; }
.section--gray { background: var(--gray-50); }
.section--navy { background: var(--navy); }
.section--navy-dark { background: var(--navy-dark); }
.grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--gap); }
.grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--gap); }
.grid-4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1.5rem; } .grid-usp {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: var(--gap);
}
@media (max-width: 860px) {
.grid-usp { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
.grid-usp { grid-template-columns: 1fr; }
}
.flex-center { display: flex; align-items: center; justify-content: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }
.text-center { text-align: center; }
.text-white { color: var(--white) !important; }
.text-orange { color: var(--orange); }
.text-muted { color: var(--gray-400); }
.mt-0 { margin-top: 0; }
.mb-0 { margin-bottom: 0; }
.mt-sm { margin-top: 1rem; }
.mt-md { margin-top: 2rem; }
.mt-lg { margin-top: 3rem; }
.mb-sm { margin-bottom: 1rem; }
.mb-md { margin-bottom: 2rem; }
.mb-lg { margin-bottom: 3rem; } .btn {
display: inline-flex;
align-items: center;
gap: .5rem;
padding: .75rem 1.75rem;
border-radius: var(--radius-md);
font-family: var(--font-body);
font-size: .95rem;
font-weight: 600;
cursor: pointer;
border: 2px solid transparent;
transition: all .2s ease;
text-decoration: none;
line-height: 1;
white-space: nowrap;
}
.btn--primary {
background: var(--orange);
color: var(--white);
border-color: var(--orange);
}
.btn--primary:hover {
background: var(--orange-light);
border-color: var(--orange-light);
color: var(--white);
transform: translateY(-1px);
box-shadow: 0 4px 16px rgba(232,96,10,.35);
}
.btn--outline {
background: transparent;
color: var(--navy);
border-color: var(--navy);
}
.btn--outline:hover {
background: var(--navy);
color: var(--white);
transform: translateY(-1px);
}
.btn--outline-white {
background: transparent;
color: var(--white);
border-color: var(--white);
}
.btn--outline-white:hover {
background: var(--white);
color: var(--navy);
}
.btn--lg { padding: 1rem 2.5rem; font-size: 1.05rem; }
.btn--sm { padding: .5rem 1.25rem; font-size: .875rem; } .site-header {
position: sticky;
top: 0;
z-index: 100;
background: rgba(26,43,74,0.97);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
border-bottom: 1px solid rgba(255,255,255,0.08);
}
.site-header__inner {
display: flex;
align-items: center;
justify-content: space-between;
min-height: 68px;
gap: 1rem;
}
.site-logo {
display: flex;
align-items: center;
gap: .55rem;
text-decoration: none;
flex-shrink: 0;
}
.site-logo__mark {
width: 30px;
height: 30px;
background: var(--orange);
border-radius: var(--radius-sm);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.site-logo__mark svg { width: 17px; height: 17px; fill: var(--white); }
.site-logo__text {
font-family: var(--font-heading);
font-size: 1.1rem;
font-weight: 800;
color: var(--white);
letter-spacing: -.02em;
white-space: nowrap;
}
.site-logo__text span { color: var(--orange); }
.site-nav {
display: flex;
align-items: center;
gap: .1rem;
flex-wrap: wrap; flex-shrink: 1;
min-width: 0;
}
.site-nav a {
color: rgba(255,255,255,0.8);
font-size: .85rem;
font-weight: 500;
padding: .5rem .65rem;
border-radius: var(--radius-sm);
transition: all .15s;
text-decoration: none;
white-space: nowrap;
}
.site-nav a:hover,
.site-nav a.current-menu-item {
color: var(--white);
background: rgba(255,255,255,0.1);
}
.site-header__cta {
display: flex;
align-items: center;
gap: .4rem;
flex-shrink: 0;
flex-wrap: nowrap;
} .site-header__cta .btn {
white-space: nowrap;
padding: .45rem .85rem;
font-size: .8rem;
gap: .35rem;
}
.site-header__cta .btn svg {
width: 14px !important;
height: 14px !important;
}
.hamburger {
display: none;
flex-direction: column;
gap: 5px;
cursor: pointer;
padding: .5rem;
background: none;
border: none;
}
.hamburger span {
display: block;
width: 22px;
height: 2px;
background: var(--white);
border-radius: 2px;
transition: all .3s;
} .hero {
background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy) 60%, var(--navy-mid) 100%);
padding: clamp(4rem, 10vw, 8rem) 0;
position: relative;
overflow: hidden;
}
.hero::before {
content: '';
position: absolute;
top: -50%;
right: -20%;
width: 600px;
height: 600px;
background: radial-gradient(circle, rgba(232,96,10,0.12) 0%, transparent 70%);
pointer-events: none;
}
.hero::after {
content: '';
position: absolute;
bottom: -30%;
left: -10%;
width: 400px;
height: 400px;
background: radial-gradient(circle, rgba(255,255,255,0.04) 0%, transparent 70%);
pointer-events: none;
}
.hero__inner {
display: grid;
grid-template-columns: 1fr 1fr;
gap: clamp(2rem, 6vw, 5rem);
align-items: center;
position: relative;
z-index: 1;
}
.hero__eyebrow {
display: inline-flex;
align-items: center;
gap: .5rem;
background: rgba(232,96,10,0.15);
border: 1px solid rgba(232,96,10,0.3);
color: var(--orange-light);
font-size: .8rem;
font-weight: 600;
letter-spacing: .08em;
text-transform: uppercase;
padding: .35rem .875rem;
border-radius: 100px;
margin-bottom: 1.5rem;
}
.hero__title {
color: var(--white); font-size: clamp(1.9rem, 3.2vw + 1rem, 3.25rem);
font-weight: 800;
line-height: 1.15;
margin-bottom: 1.25rem; overflow-wrap: normal;
word-break: keep-all;
hyphens: none;
}
.hero__title em {
color: var(--orange);
font-style: normal;
}
.hero__desc {
color: rgba(255,255,255,0.7);
font-size: 1.1rem;
line-height: 1.7;
margin-bottom: 2rem;
}
.hero__actions { display: flex; gap: 1rem; flex-wrap: wrap; }
.hero__stats {
display: flex;
gap: 1.25rem;
margin-top: 2.5rem;
padding-top: 2rem;
border-top: 1px solid rgba(255,255,255,0.1);
}
.hero__stat { min-width: 0;
}
.hero__stat-num {
font-family: var(--font-heading); font-size: clamp(1.35rem, 2vw + .7rem, 1.85rem);
font-weight: 800;
color: var(--white);
line-height: 1.05; white-space: nowrap;
}
.hero__stat-label {
font-size: .75rem;
color: rgba(255,255,255,0.5);
margin-top: .3rem;
line-height: 1.4;
}
.hero__visual {
position: relative;
display: flex;
justify-content: center;
}
.hero__badge-wrap {
background: rgba(255,255,255,0.05);
border: 1px solid rgba(255,255,255,0.1);
border-radius: var(--radius-xl);
padding: 2.5rem 2rem;
width: 100%;
max-width: 400px;
}
.hero__badge-icon {
width: 64px;
height: 64px;
background: var(--orange);
border-radius: var(--radius-md);
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1.5rem;
}
.hero__badge-icon svg { width: 32px; height: 32px; fill: none; stroke: var(--white); stroke-width: 1.5; }
.hero__badge-title {
font-family: var(--font-heading);
color: var(--white);
font-size: 1.3rem;
font-weight: 700;
margin-bottom: .5rem;
}
.hero__badge-meta { color: rgba(255,255,255,0.5); font-size: .85rem; margin-bottom: 1.25rem; }
.hero__progress-bar {
height: 6px;
background: rgba(255,255,255,0.1);
border-radius: 100px;
overflow: hidden;
margin-bottom: .5rem;
}
.hero__progress-fill {
height: 100%;
background: var(--orange);
border-radius: 100px;
width: 0;
animation: fillBar 1.2s 0.5s ease-out forwards;
}
@keyframes fillBar { to { width: 72%; } }
.hero__progress-label { color: rgba(255,255,255,0.4); font-size: .75rem; } .section-header {
max-width: 640px;
margin-bottom: clamp(2rem, 5vw, 3.5rem);
}
.section-header--center {
text-align: center;
margin-left: auto;
margin-right: auto;
}
.section-eyebrow {
display: inline-block;
font-size: .75rem;
font-weight: 600;
letter-spacing: .1em;
text-transform: uppercase;
color: var(--orange);
margin-bottom: .75rem;
}
.section-title { margin-bottom: .75rem; }
.section-desc { color: var(--gray-600); font-size: 1.05rem; } .course-card {
background: var(--white);
border: 1px solid var(--gray-100);
border-radius: var(--radius-lg);
overflow: hidden;
transition: all .3s ease;
display: flex;
flex-direction: column;
text-decoration: none;
color: inherit;
position: relative;
}
.course-card:hover {
box-shadow: var(--shadow-hover);
transform: translateY(-4px);
border-color: var(--gray-200);
color: inherit;
}
.course-card:hover .course-card__progress-fill {
width: 100%;
opacity: .3;
}
.course-card__thumb {
position: relative;
aspect-ratio: 16/9;
background: var(--gray-100);
overflow: hidden;
}
.course-card__thumb img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .4s ease;
}
.course-card:hover .course-card__thumb img { transform: scale(1.04); }
.course-card__badge {
position: absolute;
top: .875rem;
left: .875rem;
background: var(--orange);
color: var(--white);
font-size: .7rem;
font-weight: 700;
letter-spacing: .06em;
text-transform: uppercase;
padding: .3rem .7rem;
border-radius: 100px;
}
.course-card__body {
padding: 1.5rem;
display: flex;
flex-direction: column;
flex: 1;
}
.course-card__category {
font-size: .75rem;
font-weight: 600;
color: var(--orange);
letter-spacing: .06em;
text-transform: uppercase;
margin-bottom: .5rem;
}
.course-card__title {
font-family: var(--font-heading);
font-size: 1.1rem;
font-weight: 700;
color: var(--navy);
margin-bottom: .75rem;
line-height: 1.35; white-space: normal;
overflow-wrap: break-word;
word-break: normal;
overflow: visible;
}
.course-card__excerpt {
font-size: .875rem;
color: var(--gray-600);
line-height: 1.6;
margin-bottom: 1.25rem;
flex: 1;
}
.course-card__meta {
display: flex;
align-items: center;
gap: 1rem;
font-size: .8rem;
color: var(--gray-400);
margin-bottom: 1.25rem;
}
.course-card__meta-item {
display: flex;
align-items: center;
gap: .35rem;
}
.course-card__meta-item svg {
width: 14px;
height: 14px;
flex-shrink: 0;
stroke: currentColor;
fill: none;
}
.course-card__footer {
display: flex;
align-items: center;
justify-content: space-between;
padding-top: 1rem;
border-top: 1px solid var(--gray-100);
}
.course-card__price {
font-family: var(--font-heading);
font-size: 1.3rem;
font-weight: 800;
color: var(--navy);
}
.course-card__price--free { color: var(--orange); } .course-card__progress-fill {
position: absolute;
bottom: 0;
left: 0;
height: 3px;
background: var(--orange);
width: 0;
opacity: 0;
transition: width .6s ease, opacity .3s ease;
} .feature-item {
display: flex;
gap: 1.25rem;
align-items: flex-start;
}
.feature-item__icon {
width: 48px;
height: 48px;
background: var(--orange-pale);
border-radius: var(--radius-md);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.feature-item__icon svg {
width: 22px;
height: 22px;
stroke: var(--orange);
fill: none;
stroke-width: 1.75;
}
.feature-item__title {
font-size: 1rem;
font-weight: 600;
color: var(--navy);
margin-bottom: .35rem;
}
.feature-item__desc {
font-size: .875rem;
color: var(--gray-600);
line-height: 1.6;
} .step-item {
display: grid;
grid-template-columns: 48px 1fr;
gap: 1rem;
align-items: flex-start;
}
.step-num {
width: 48px;
height: 48px;
background: var(--navy);
color: var(--white);
font-family: var(--font-heading);
font-size: 1.1rem;
font-weight: 800;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
} .testimonial-card {
background: var(--white);
border: 1px solid var(--gray-100);
border-radius: var(--radius-lg);
padding: 1.75rem;
position: relative;
}
.testimonial-card__quote {
font-size: .9375rem;
color: var(--gray-600);
line-height: 1.7;
margin-bottom: 1.25rem;
}
.testimonial-card__quote::before {
content: '"';
font-family: var(--font-heading);
font-size: 3rem;
color: var(--orange);
line-height: .5;
display: block;
margin-bottom: .5rem;
}
.testimonial-card__author {
display: flex;
align-items: center;
gap: .875rem;
}
.testimonial-card__avatar {
width: 40px;
height: 40px;
border-radius: 50%;
background: var(--navy);
color: var(--white);
font-weight: 600;
font-size: .875rem;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.testimonial-card__name {
font-weight: 600;
font-size: .9rem;
color: var(--navy);
}
.testimonial-card__role {
font-size: .8rem;
color: var(--gray-400);
}
.stars { color: var(--orange); font-size: .9rem; letter-spacing: .1em; margin-bottom: .5rem; } .cta-banner {
background: var(--navy);
border-radius: var(--radius-xl);
padding: clamp(2.5rem, 6vw, 4rem) clamp(1.5rem, 5vw, 4rem);
display: grid;
grid-template-columns: 1fr auto;
gap: 2rem;
align-items: center;
}
.cta-banner__title {
color: var(--white);
font-size: clamp(1.5rem, 3vw, 2rem);
margin-bottom: .5rem;
}
.cta-banner__desc { color: rgba(255,255,255,.6); margin: 0; }
.cta-banner__actions { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; } .course-hero {
background: var(--navy-dark);
padding: clamp(3rem, 6vw, 5rem) 0 0;
}
.course-hero__inner {
display: grid;
grid-template-columns: 1fr 380px;
gap: 3rem;
align-items: start;
}
.course-hero__breadcrumb {
display: flex;
align-items: center;
gap: .5rem;
font-size: .8rem;
color: rgba(255,255,255,.5);
margin-bottom: 1.5rem;
}
.course-hero__breadcrumb a { color: rgba(255,255,255,.5); }
.course-hero__breadcrumb a:hover { color: var(--orange); }
.course-hero__breadcrumb svg { width: 12px; height: 12px; stroke: currentColor; fill: none; }
.course-hero__category {
font-size: .75rem;
font-weight: 600;
letter-spacing: .1em;
text-transform: uppercase;
color: var(--orange);
margin-bottom: .75rem;
}
.course-hero__title { color: var(--white); margin-bottom: 1rem; }
.course-hero__meta {
display: flex;
flex-wrap: wrap;
gap: 1.25rem;
margin-bottom: 1.5rem;
font-size: .875rem;
color: rgba(255,255,255,.6);
}
.course-hero__meta-item {
display: flex;
align-items: center;
gap: .4rem;
}
.course-hero__meta-item svg {
width: 15px;
height: 15px;
stroke: var(--orange);
fill: none;
}
.course-hero__desc { color: rgba(255,255,255,.7); font-size: 1rem; line-height: 1.7; } .course-buy-card {
background: var(--white);
border-radius: var(--radius-lg);
overflow: hidden;
box-shadow: 0 8px 32px rgba(0,0,0,.25);
position: sticky;
top: 88px;
}
.course-buy-card__thumb {
aspect-ratio: 16/9;
background: var(--gray-100);
overflow: hidden;
}
.course-buy-card__thumb img {
width: 100%;
height: 100%;
object-fit: cover;
}
.course-buy-card__body { padding: 1.5rem; }
.course-buy-card__price {
font-family: var(--font-heading);
font-size: 2rem;
font-weight: 800;
color: var(--navy);
margin-bottom: .25rem;
}
.course-buy-card__price--free { color: var(--orange); }
.course-buy-card__price-note { font-size: .8rem; color: var(--gray-400); margin-bottom: 1.25rem; }
.course-buy-card .btn { width: 100%; justify-content: center; margin-bottom: .75rem; }
.course-buy-card__includes { margin-top: 1.25rem; }
.course-buy-card__includes-title {
font-weight: 600;
font-size: .85rem;
color: var(--navy);
margin-bottom: .75rem;
text-transform: uppercase;
letter-spacing: .06em;
}
.course-buy-card__includes li {
display: flex;
align-items: center;
gap: .6rem;
font-size: .85rem;
color: var(--gray-600);
padding: .4rem 0;
border-bottom: 1px solid var(--gray-100);
}
.course-buy-card__includes li:last-child { border-bottom: none; }
.course-buy-card__includes svg {
width: 15px;
height: 15px;
stroke: var(--orange);
fill: none;
flex-shrink: 0;
} .course-tabs {
background: var(--white);
padding: 3rem 0;
}
.course-tabs__nav {
display: flex;
gap: 0;
border-bottom: 2px solid var(--gray-100);
margin-bottom: 2.5rem;
overflow-x: auto;
}
.course-tabs__btn {
padding: .875rem 1.5rem;
font-weight: 600;
font-size: .9rem;
color: var(--gray-400);
background: none;
border: none;
border-bottom: 2px solid transparent;
margin-bottom: -2px;
cursor: pointer;
white-space: nowrap;
transition: all .2s;
font-family: var(--font-body);
}
.course-tabs__btn:hover { color: var(--navy); }
.course-tabs__btn.active { color: var(--orange); border-bottom-color: var(--orange); }
.course-tabs__panel { display: none; }
.course-tabs__panel.active { display: block; } .curriculum-section { margin-bottom: 1rem; }
.curriculum-section__header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1rem 1.25rem;
background: var(--gray-50);
border: 1px solid var(--gray-100);
border-radius: var(--radius-md);
cursor: pointer;
transition: background .15s;
}
.curriculum-section__header:hover { background: var(--gray-100); }
.curriculum-section__header.open { border-radius: var(--radius-md) var(--radius-md) 0 0; }
.curriculum-section__title {
font-weight: 600;
font-size: .95rem;
color: var(--navy);
}
.curriculum-section__count {
font-size: .8rem;
color: var(--gray-400);
}
.curriculum-section__chevron {
width: 18px;
height: 18px;
stroke: var(--gray-400);
fill: none;
transition: transform .3s;
}
.curriculum-section__header.open .curriculum-section__chevron { transform: rotate(180deg); }
.curriculum-lessons {
border: 1px solid var(--gray-100);
border-top: none;
border-radius: 0 0 var(--radius-md) var(--radius-md);
display: none;
}
.curriculum-lessons.open { display: block; }
.curriculum-lesson {
display: flex;
align-items: center;
gap: 1rem;
padding: .875rem 1.25rem;
border-bottom: 1px solid var(--gray-50);
font-size: .875rem;
}
.curriculum-lesson:last-child { border-bottom: none; }
.curriculum-lesson__icon {
width: 28px;
height: 28px;
border-radius: 50%;
background: var(--orange-pale);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.curriculum-lesson__icon svg {
width: 13px;
height: 13px;
stroke: var(--orange);
fill: none;
}
.curriculum-lesson__title { flex: 1; color: var(--gray-600); }
.curriculum-lesson__duration { color: var(--gray-400); font-size: .8rem; } .about-hero {
background: var(--navy);
padding: clamp(4rem, 8vw, 7rem) 0;
text-align: center;
}
.about-hero__title { color: var(--white); }
.about-hero__desc { color: rgba(255,255,255,.7); max-width: 600px; margin: 1rem auto 0; font-size: 1.1rem; }
.stats-bar {
background: var(--orange);
padding: 2.5rem 0;
}
.stats-bar__inner {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 1rem;
text-align: center;
}
.stats-bar__num {
font-family: var(--font-heading);
font-size: 2.25rem;
font-weight: 800;
color: var(--white);
line-height: 1;
margin-bottom: .25rem;
}
.stats-bar__label { font-size: .85rem; color: rgba(255,255,255,.75); font-weight: 500; }
.team-card {
text-align: center;
}
.team-card__photo {
width: 100px;
height: 100px;
border-radius: 50%;
background: var(--navy);
color: var(--white);
font-family: var(--font-heading);
font-size: 1.5rem;
font-weight: 700;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 1rem;
overflow: hidden;
}
.team-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.team-card__name { font-size: 1.1rem; font-weight: 700; color: var(--navy); margin-bottom: .25rem; }
.team-card__role { font-size: .875rem; color: var(--gray-400); } .cert-item {
display: flex;
align-items: center;
gap: 1rem;
padding: 1.25rem;
background: var(--white);
border: 1px solid var(--gray-100);
border-radius: var(--radius-md);
}
.cert-item__icon {
width: 48px;
height: 48px;
background: var(--orange-pale);
border-radius: var(--radius-md);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.cert-item__icon svg { width: 24px; height: 24px; stroke: var(--orange); fill: none; }
.cert-item__name { font-weight: 600; color: var(--navy); font-size: .95rem; }
.cert-item__issuer { font-size: .8rem; color: var(--gray-400); } .contact-hero {
background: var(--navy);
padding: clamp(3rem, 6vw, 5rem) 0;
text-align: center;
}
.contact-hero__title { color: var(--white); }
.contact-hero__desc { color: rgba(255,255,255,.65); margin: .75rem auto 0; max-width: 520px; }
.contact-grid {
display: grid;
grid-template-columns: 1fr 2fr;
gap: 3rem;
align-items: start;
}
.contact-info { display: flex; flex-direction: column; gap: 1.5rem; }
.contact-info-item {
display: flex;
gap: 1rem;
align-items: flex-start;
}
.contact-info-item__icon {
width: 44px;
height: 44px;
background: var(--orange-pale);
border-radius: var(--radius-md);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.contact-info-item__icon svg {
width: 20px;
height: 20px;
stroke: var(--orange);
fill: none;
}
.contact-info-item__label {
font-size: .8rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: .07em;
color: var(--gray-400);
margin-bottom: .3rem;
}
.contact-info-item__value {
font-weight: 600;
color: var(--navy);
font-size: .95rem;
}
.contact-form-wrap {
background: var(--white);
border: 1px solid var(--gray-100);
border-radius: var(--radius-lg);
padding: 2.5rem;
} .form-group { margin-bottom: 1.25rem; }
.form-label {
display: block;
font-size: .85rem;
font-weight: 600;
color: var(--navy);
margin-bottom: .4rem;
}
.form-control {
width: 100%;
padding: .75rem 1rem;
border: 1.5px solid var(--gray-200);
border-radius: var(--radius-sm);
font-family: var(--font-body);
font-size: .95rem;
color: var(--gray-900);
background: var(--white);
transition: border-color .2s;
appearance: none;
}
.form-control:focus {
outline: none;
border-color: var(--orange);
box-shadow: 0 0 0 3px rgba(232,96,10,.12);
}
.form-control::placeholder { color: var(--gray-400); }
textarea.form-control { resize: vertical; min-height: 140px; }
select.form-control { cursor: pointer; }
.form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; } .woocommerce-form input[type="email"],
.woocommerce-form input[type="text"],
.woocommerce-form input[type="password"],
.woocommerce-form textarea,
.sensei-login-form input {
width: 100%;
padding: .75rem 1rem;
border: 1.5px solid var(--gray-200);
border-radius: var(--radius-sm);
font-family: var(--font-body);
font-size: .95rem;
color: var(--gray-900);
background: var(--white);
transition: border-color .2s;
}
.woocommerce-form input:focus,
.sensei-login-form input:focus {
outline: none;
border-color: var(--orange);
box-shadow: 0 0 0 3px rgba(232,96,10,.12);
}
.woocommerce input.button,
.woocommerce button.button,
.woocommerce-page input.button,
.woocommerce-page button.button, .sensei-complete-lesson-button,
.complete-lesson,
a.complete-lesson,
button.complete-lesson,
.sensei-stop-lesson,
.lesson-complete-link,
.sensei-lesson-buttons a,
.sensei-lesson-actions a,
.sensei-lesson-actions button,
#sensei-complete-lesson,
a[href*="lesson_complete"],
input[name="quiz_complete"],
.sensei-complete-lesson,
.wp-block-sensei-lms-lesson-actions a,
.wp-block-sensei-lms-lesson-actions button {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: .5rem !important;
padding: .875rem 2rem !important;
border-radius: var(--radius-md) !important;
font-family: var(--font-body) !important;
font-size: 1rem !important;
font-weight: 700 !important;
cursor: pointer !important;
border: 2px solid var(--orange) !important;
background: var(--orange) !important;
color: var(--white) !important;
transition: all .2s ease !important;
text-decoration: none !important;
box-shadow: none !important;
outline: none !important;
}
.sensei-complete-lesson-button:hover,
.complete-lesson:hover,
a.complete-lesson:hover,
button.complete-lesson:hover,
.sensei-lesson-buttons a:hover,
.sensei-lesson-actions a:hover,
.sensei-lesson-actions button:hover,
.wp-block-sensei-lms-lesson-actions a:hover,
.wp-block-sensei-lms-lesson-actions button:hover {
background: var(--orange-light) !important;
border-color: var(--orange-light) !important;
transform: translateY(-1px) !important;
box-shadow: 0 4px 16px rgba(232,96,10,.35) !important;
color: var(--white) !important;
}
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-error,
.woocommerce .woocommerce-info {
border-top-color: var(--orange);
border-radius: var(--radius-md);
} .sensei-course-progress { margin: 1.5rem 0; }
.sensei-course-progress-bar {
height: 8px;
background: var(--gray-100);
border-radius: 100px;
overflow: hidden;
}
.sensei-course-progress-bar-inner {
height: 100%;
background: var(--orange);
border-radius: 100px;
transition: width .6s ease;
} .legal-page {
padding: 3rem 0 5rem;
}
.legal-page__header {
padding: 3rem 0 2rem;
border-bottom: 1px solid var(--gray-100);
margin-bottom: 3rem;
}
.legal-page__title { color: var(--navy); }
.legal-page__meta { font-size: .875rem; color: var(--gray-400); margin-top: .5rem; }
.legal-content h2 {
font-size: 1.3rem;
margin: 2.5rem 0 .875rem;
color: var(--navy);
padding-bottom: .5rem;
border-bottom: 1px solid var(--gray-100);
}
.legal-content h3 {
font-size: 1.05rem;
margin: 1.75rem 0 .5rem;
color: var(--navy-mid);
}
.legal-content p { color: var(--gray-600); margin-bottom: 1rem; line-height: 1.8; }
.legal-content ul, .legal-content ol {
margin: .75rem 0 1.25rem 1.5rem;
list-style: disc;
}
.legal-content li { color: var(--gray-600); margin-bottom: .4rem; line-height: 1.7; }
.legal-content a { color: var(--orange); }
.legal-content a:hover { text-decoration: underline; }
.legal-content table {
width: 100%;
border-collapse: collapse;
margin: 1.25rem 0;
font-size: .875rem;
}
.legal-content th {
background: var(--gray-50);
font-weight: 600;
color: var(--navy);
padding: .75rem 1rem;
text-align: left;
border: 1px solid var(--gray-200);
}
.legal-content td {
padding: .75rem 1rem;
border: 1px solid var(--gray-200);
color: var(--gray-600);
} .site-footer {
background: var(--navy-dark);
color: rgba(255,255,255,.65);
padding: clamp(3rem, 6vw, 5rem) 0 0;
}
.site-footer__grid {
display: grid;
grid-template-columns: 1.5fr 2fr 1fr;
gap: 3rem;
padding-bottom: 3rem;
border-bottom: 1px solid rgba(255,255,255,.08);
} .site-footer__col--courses {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1.5rem;
align-items: start;
} .site-footer__col--courses-right { padding-top: 2.1rem; }
.site-footer__brand .site-logo { margin-bottom: 1rem; }
.site-footer__tagline { font-size: .875rem; line-height: 1.7; }
.site-footer__col-title {
font-family: var(--font-heading);
font-size: .85rem;
font-weight: 700;
color: var(--white);
text-transform: uppercase;
letter-spacing: .1em;
margin-bottom: 1.25rem;
}
.site-footer__links { display: flex; flex-direction: column; gap: .5rem; }
.site-footer__links a {
color: rgba(255,255,255,.5);
font-size: .875rem;
text-decoration: none;
transition: color .15s;
}
.site-footer__links a:hover { color: var(--white); }
.site-footer__newsletter p { font-size: .875rem; margin-bottom: 1rem; }
.newsletter-form { display: flex; gap: .5rem; }
.newsletter-form input {
flex: 1;
padding: .65rem .875rem;
background: rgba(255,255,255,.08);
border: 1px solid rgba(255,255,255,.15);
border-radius: var(--radius-sm);
color: var(--white);
font-size: .875rem;
font-family: var(--font-body);
}
.newsletter-form input::placeholder { color: rgba(255,255,255,.3); }
.newsletter-form input:focus { outline: none; border-color: var(--orange); }
.newsletter-form button {
padding: .65rem 1.25rem;
background: var(--orange);
color: var(--white);
border: none;
border-radius: var(--radius-sm);
font-weight: 600;
font-size: .875rem;
cursor: pointer;
font-family: var(--font-body);
transition: background .2s;
}
.newsletter-form button:hover { background: var(--orange-light); }
.site-footer__bottom {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1.5rem 0;
font-size: .8rem;
color: rgba(255,255,255,.35);
flex-wrap: wrap;
gap: .75rem;
}
.site-footer__bottom-links { display: flex; gap: 1.5rem; }
.site-footer__bottom-links a {
color: rgba(255,255,255,.35);
text-decoration: none;
transition: color .15s;
}
.site-footer__bottom-links a:hover { color: rgba(255,255,255,.65); } .mobile-nav {
display: none;
position: fixed;
inset: 0;
background: var(--navy-dark);
z-index: 200;
padding: 2rem;
flex-direction: column;
gap: 1.5rem;
}
.mobile-nav.open { display: flex; }
.mobile-nav__close {
align-self: flex-end;
background: none;
border: none;
color: var(--white);
cursor: pointer;
padding: .5rem;
}
.mobile-nav__links { display: flex; flex-direction: column; gap: .75rem; }
.mobile-nav__links a {
color: var(--white);
font-size: 1.5rem;
font-family: var(--font-heading);
font-weight: 700;
text-decoration: none;
padding: .5rem 0;
border-bottom: 1px solid rgba(255,255,255,.08);
} @media (max-width: 1024px) {
.site-footer__grid { grid-template-columns: 1fr 1fr; }
.course-hero__inner { grid-template-columns: 1fr; }
.course-buy-card { position: static; }
.contact-grid { grid-template-columns: 1fr; }
.cta-banner { grid-template-columns: 1fr; text-align: center; }
.cta-banner__actions { justify-content: center; }
}
@media (max-width: 768px) {
.hero__inner { grid-template-columns: 1fr; }
.hero__visual { display: none; }
.hero__stats { gap: 1.25rem; }
.site-nav { display: none; }
.site-header__cta .btn--outline-white { display: none; }
.hamburger { display: flex; }
.stats-bar__inner { grid-template-columns: repeat(2, 1fr); }
.site-footer__grid { grid-template-columns: 1fr; }
.form-grid-2 { grid-template-columns: 1fr; }
} .wp-block-group { margin: 0; }
.alignwide { max-width: calc(var(--container) + 4rem); }
.alignfull { max-width: 100%; }
.woocommerce-breadcrumb { font-size: .875rem; color: var(--gray-400); margin-bottom: 1.5rem; }
.woocommerce-breadcrumb a { color: var(--gray-400); }
.sensei-breadcrumb { font-size: .875rem; color: var(--gray-400); margin-bottom: 1.5rem; }
.entry-content { max-width: 760px; }
.entry-content p { color: var(--gray-600); line-height: 1.8; margin-bottom: 1.25rem; }
.entry-content ul, .entry-content ol { margin: .75rem 0 1.25rem 1.5rem; list-style: disc; }
.entry-content li { color: var(--gray-600); margin-bottom: .4rem; }
.entry-content h2, .entry-content h3 { margin-top: 2rem; margin-bottom: .75rem; } .entry-content.entry-content--wc { max-width: 100%; }
.section--wc { padding-top: 2.5rem; padding-bottom: 4rem; }  nav svg, button svg, a svg, .btn svg,
.breadcrumb svg, .site-nav svg, .site-logo svg,
.course-card__meta-item svg,
.feature-item__icon svg,
.contact-info-item__icon svg,
.cert-item__icon svg,
.curriculum-lesson__icon svg,
.course-buy-card__includes svg,
.course-hero__meta-item svg,
.footer-icon,
.hero__eyebrow svg {
width: 16px !important;
height: 16px !important;
flex-shrink: 0;
display: inline-block;
vertical-align: middle;
} .breadcrumb-sep {
width: 12px !important;
height: 12px !important;
opacity: .5;
display: inline-block;
vertical-align: middle;
} .btn svg { width: 18px !important; height: 18px !important; } .feature-item__icon svg,
.contact-info-item__icon svg,
.cert-item__icon svg,
.course-buy-card__includes svg,
.course-hero__meta-item svg,
.curriculum-lesson__icon svg {
width: 20px !important;
height: 20px !important;
} .hero__badge-icon svg {
width: 32px !important;
height: 32px !important;
} .site-logo__mark svg {
width: 20px !important;
height: 20px !important;
}  .woocommerce-account .woocommerce,
.woocommerce-page.woocommerce-account .woocommerce {
display: flex;
flex-direction: row;
gap: 2.5rem;
align-items: flex-start;
max-width: 100%;
} .woocommerce-account .woocommerce-MyAccount-navigation {
background: var(--gray-50);
border: 1px solid var(--gray-100);
border-radius: var(--radius-lg);
overflow: hidden;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
list-style: none;
margin: 0;
padding: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li {
border-bottom: 1px solid var(--gray-100);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child {
border-bottom: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
display: block;
padding: .75rem 1.25rem;
color: var(--gray-600);
font-size: .9rem;
font-weight: 500;
text-decoration: none;
transition: all .15s;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
background: var(--orange-pale);
color: var(--orange);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
font-weight: 600;
border-left: 3px solid var(--orange);
} .woocommerce-account .woocommerce-MyAccount-content {
min-width: 0;
background: var(--white);
border: 1px solid var(--gray-100);
border-radius: var(--radius-lg);
padding: 1.75rem 2rem;
}
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 {
font-size: 1.3rem;
color: var(--navy);
margin-bottom: 1.25rem;
padding-bottom: .75rem;
border-bottom: 1px solid var(--gray-100);
}
.woocommerce-account .woocommerce-MyAccount-content p {
color: var(--gray-600);
font-size: .95rem;
line-height: 1.75;
margin-bottom: 1rem;
}
.woocommerce-account .woocommerce-MyAccount-content p:last-child {
margin-bottom: 0;
}
.woocommerce-account .woocommerce-MyAccount-content p a {
color: var(--orange);
font-weight: 600;
text-decoration: none;
}
.woocommerce-account .woocommerce-MyAccount-content p a:hover {
color: var(--orange-light);
text-decoration: underline;
}
.woocommerce-account .woocommerce-MyAccount-content strong {
color: var(--navy);
} .woocommerce-account .woocommerce-notices-wrapper:not(:empty) {
margin-bottom: 1.5rem;
} .woocommerce-account table.woocommerce-orders-table,
.woocommerce-account table.shop_table {
width: 100%;
border-collapse: collapse;
font-size: .9rem;
}
.woocommerce-account table.woocommerce-orders-table th,
.woocommerce-account table.shop_table th {
background: var(--gray-50);
padding: .75rem 1rem;
text-align: left;
font-weight: 600;
color: var(--navy);
border-bottom: 2px solid var(--gray-200);
font-size: .8rem;
text-transform: uppercase;
letter-spacing: .05em;
}
.woocommerce-account table.woocommerce-orders-table td,
.woocommerce-account table.shop_table td {
padding: .875rem 1rem;
border-bottom: 1px solid var(--gray-100);
color: var(--gray-600);
}
.woocommerce-account table.woocommerce-orders-table tr:last-child td,
.woocommerce-account table.shop_table tr:last-child td {
border-bottom: none;
} .woocommerce-account .woocommerce-MyAccount-content > p:first-child {
background: var(--orange-pale);
border: 1px solid rgba(232,96,10,.2);
border-radius: var(--radius-md);
padding: 1rem 1.25rem;
font-size: .9rem;
color: var(--gray-600);
margin-bottom: 1.5rem;
} .woocommerce-cart .woocommerce,
.woocommerce-checkout .woocommerce {
max-width: 100%;
}
.woocommerce table.shop_table {
width: 100%;
border-collapse: collapse;
margin-bottom: 2rem;
}
.woocommerce table.shop_table th {
background: var(--gray-50);
padding: .875rem 1rem;
text-align: left;
font-weight: 600;
font-size: .8rem;
text-transform: uppercase;
letter-spacing: .05em;
color: var(--navy);
border-bottom: 2px solid var(--gray-200);
}
.woocommerce table.shop_table td {
padding: 1rem;
border-bottom: 1px solid var(--gray-100);
vertical-align: middle;
} .woocommerce-checkout .woocommerce .col2-set {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2rem;
align-items: start;
} .woocommerce .cart_totals,
.woocommerce-page .cart_totals {
background: var(--gray-50);
border: 1px solid var(--gray-100);
border-radius: var(--radius-lg);
padding: 1.5rem;
margin-top: 2rem;
}
.woocommerce .cart_totals h2 {
font-size: 1.2rem;
margin-bottom: 1rem;
color: var(--navy);
} .woocommerce-message,
.woocommerce-error,
.woocommerce-info {
border-radius: var(--radius-md);
padding: 1rem 1.25rem;
margin-bottom: 1.5rem;
font-size: .9rem;
list-style: none;
}
.woocommerce-message { background: #EAF3DE; color: #3B6D11; border: 1px solid #97C459; }
.woocommerce-error   { background: #FCEBEB; color: #A32D2D; border: 1px solid #F09595; }
.woocommerce-info    { background: var(--orange-pale); color: var(--orange); border: 1px solid rgba(232,96,10,.3); } @media (max-width: 768px) {
.woocommerce-account .woocommerce,
.woocommerce-page.woocommerce-account .woocommerce {
flex-direction: column;
}
.woocommerce-checkout .woocommerce .col2-set {
grid-template-columns: 1fr;
}
} .bhp-product-page { background: var(--white); } .product-breadcrumb {
display: flex;
align-items: center;
gap: .4rem;
flex-wrap: wrap;
font-size: .8rem;
color: var(--gray-400);
padding: 1.75rem 0 0;
margin-bottom: 1.5rem;
}
.product-breadcrumb a { color: var(--gray-400); text-decoration: none; }
.product-breadcrumb a:hover { color: var(--orange); }
.product-breadcrumb .bc-sep { opacity: .5; }
.product-hero { padding: 0 0 3rem; } .bhp-product-layout {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 3rem;
align-items: start;
} .bhp-product-gallery {}
.bhp-gallery-main {
border: 1px solid var(--gray-100);
border-radius: var(--radius-lg);
overflow: hidden;
background: var(--gray-50);
aspect-ratio: 4/3;
display: flex;
align-items: center;
justify-content: center;
}
.bhp-gallery-img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.bhp-gallery-placeholder {
flex-direction: column;
gap: .75rem;
}
.bhp-gallery-placeholder__inner {
display: flex;
flex-direction: column;
align-items: center;
gap: .75rem;
color: var(--gray-400);
font-size: .875rem;
}
.bhp-gallery-thumbs {
display: flex;
gap: .5rem;
margin-top: .75rem;
flex-wrap: wrap;
}
.bhp-gallery-thumb {
width: 64px;
height: 64px;
border: 2px solid var(--gray-100);
border-radius: var(--radius-sm);
overflow: hidden;
cursor: pointer;
transition: border-color .2s;
}
.bhp-gallery-thumb img { width: 100%; height: 100%; object-fit: cover; }
.bhp-gallery-thumb:hover { border-color: var(--gray-400); }
.bhp-gallery-thumb.active { border-color: var(--orange); } .bhp-product-info {}
.bhp-product-cats {
font-size: .75rem;
font-weight: 600;
letter-spacing: .1em;
text-transform: uppercase;
color: var(--orange);
margin-bottom: .6rem;
}
.bhp-product-cats a { color: var(--orange); text-decoration: none; }
.bhp-product-title {
font-family: var(--font-heading);
font-size: clamp(1.6rem, 3vw, 2.25rem);
font-weight: 800;
color: var(--navy);
line-height: 1.2;
margin-bottom: 1rem;
}
.bhp-product-excerpt {
color: var(--gray-600);
font-size: .975rem;
line-height: 1.7;
margin-bottom: 1.25rem;
padding-bottom: 1.25rem;
border-bottom: 1px solid var(--gray-100);
}
.bhp-product-excerpt p { color: inherit; margin-bottom: .5rem; } .bhp-product-price {
margin-bottom: 1.25rem;
}
.bhp-product-price .woocommerce-Price-amount,
.bhp-product-price .amount {
font-family: var(--font-heading);
font-size: 2rem;
font-weight: 800;
color: var(--navy);
line-height: 1;
}
.bhp-product-price del .amount { color: var(--gray-400); font-size: 1.2rem; }
.bhp-product-price ins { text-decoration: none; }
.bhp-product-price ins .amount { color: var(--orange); }
.bhp-product-price__vat {
display: block;
font-size: .78rem;
color: var(--gray-400);
margin-top: .25rem;
} .bhp-product-buy {
margin-bottom: 1.5rem;
} .bhp-product-buy .woocommerce-product-rating,
.bhp-product-buy .price:first-child,
.bhp-product-buy .woocommerce-product-details__short-description,
.bhp-product-buy p.price { display: none !important; } .bhp-product-buy form.cart {
display: flex;
gap: .75rem;
align-items: center;
flex-wrap: wrap;
margin: 0 0 1rem;
} .bhp-product-buy .quantity { display: flex; align-items: center; }
.bhp-product-buy input[type="number"].qty,
.bhp-product-buy input.qty {
width: 72px;
height: 52px;
padding: .5rem .75rem;
border: 1.5px solid var(--gray-200);
border-radius: var(--radius-sm);
font-family: var(--font-body);
font-size: 1rem;
font-weight: 600;
text-align: center;
color: var(--navy);
background: var(--white);
-moz-appearance: textfield;
}
.bhp-product-buy input.qty::-webkit-outer-spin-button,
.bhp-product-buy input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.bhp-product-buy input.qty:focus {
outline: none;
border-color: var(--orange);
box-shadow: 0 0 0 3px rgba(232,96,10,.12);
} .bhp-product-buy button.single_add_to_cart_button,
.bhp-product-buy a.single_add_to_cart_button {
flex: 1;
display: inline-flex !important;
align-items: center;
justify-content: center;
gap: .5rem;
padding: .875rem 2rem;
min-height: 52px;
background: var(--orange) !important;
color: var(--white) !important;
border: none !important;
border-radius: var(--radius-md) !important;
font-family: var(--font-body) !important;
font-size: 1rem !important;
font-weight: 700 !important;
cursor: pointer;
transition: all .2s ease;
text-decoration: none;
white-space: nowrap;
letter-spacing: .01em;
}
.bhp-product-buy button.single_add_to_cart_button:hover,
.bhp-product-buy a.single_add_to_cart_button:hover {
background: var(--orange-light) !important;
transform: translateY(-1px);
box-shadow: 0 4px 16px rgba(232,96,10,.35);
} .bhp-product-buy .sensei-course-enrolment-actions a,
.bhp-product-buy .sensei-enrolment-button,
.bhp-product-buy .woocommerce-form-coupon-toggle,
.bhp-product-buy a.button:not(.product_type_simple) {
display: inline-flex;
align-items: center;
justify-content: center;
padding: .875rem 2rem;
background: var(--orange);
color: var(--white) !important;
border-radius: var(--radius-md);
font-weight: 700;
font-size: 1rem;
text-decoration: none;
transition: all .2s ease;
width: 100%;
}
.bhp-product-buy .sensei-course-enrolment-actions a:hover { background: var(--orange-light); } .bhp-product-perks {
list-style: none;
padding: 1.25rem;
margin: 0 0 1rem;
background: var(--gray-50);
border: 1px solid var(--gray-100);
border-radius: var(--radius-md);
display: flex;
flex-direction: column;
gap: .5rem;
}
.bhp-product-perks li {
display: flex;
align-items: center;
gap: .6rem;
font-size: .875rem;
color: var(--gray-600);
}
.bhp-product-perks svg {
flex-shrink: 0;
color: var(--orange);
} .product-tabs-section {
background: var(--white);
border-top: 1px solid var(--gray-100);
padding: 0 0 4rem;
}
.product-tabs-inner { padding-top: 2.5rem; } .course-meta-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: 1rem;
margin-bottom: 1.5rem;
}
.course-meta-item {
display: flex;
gap: .75rem;
align-items: center;
background: var(--gray-50);
border: 1px solid var(--gray-100);
border-radius: var(--radius-md);
padding: .875rem 1rem;
}
.course-meta-item__icon {
width: 36px;
height: 36px;
background: var(--orange-pale);
border-radius: var(--radius-sm);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
color: var(--orange);
}
.course-meta-item__icon svg {
width: 18px !important;
height: 18px !important;
stroke: var(--orange);
}
.course-meta-item__label {
font-size: .7rem;
text-transform: uppercase;
letter-spacing: .06em;
color: var(--gray-400);
margin-bottom: .15rem;
}
.course-meta-item__val {
font-weight: 600;
color: var(--navy);
font-size: .9rem;
} @media (max-width: 900px) {
.bhp-product-layout { grid-template-columns: 1fr; }
}  .bhp-purchase-mode {
margin-bottom: 1rem;
}
.bhp-mode-switch {
display: grid;
grid-template-columns: 1fr 1fr;
gap: .5rem;
margin-bottom: .75rem;
}
.bhp-mode-option {
position: relative;
cursor: pointer;
}
.bhp-mode-radio {
position: absolute;
opacity: 0;
width: 1px;
height: 1px;
pointer-events: none;
}
.bhp-mode-option__inner {
display: flex;
align-items: center;
justify-content: center;
gap: .45rem;
padding: .7rem .75rem;
border: 1.5px solid var(--gray-200);
border-radius: var(--radius-md);
font-size: .85rem;
font-weight: 600;
color: var(--gray-600);
background: var(--white);
transition: all .15s ease;
text-align: center;
}
.bhp-mode-option__inner svg {
flex-shrink: 0;
color: var(--gray-400);
transition: color .15s ease;
}
.bhp-mode-radio:checked + .bhp-mode-option__inner {
border-color: var(--orange);
background: var(--orange-pale);
color: var(--orange);
}
.bhp-mode-radio:checked + .bhp-mode-option__inner svg {
color: var(--orange);
}
.bhp-mode-radio:focus-visible + .bhp-mode-option__inner {
outline: 2px solid var(--orange);
outline-offset: 2px;
}
.bhp-mode-option:hover .bhp-mode-option__inner {
border-color: var(--gray-400);
}
.bhp-mode-radio:checked + .bhp-mode-option__inner:hover {
border-color: var(--orange);
} .bhp-seats-selector {
background: var(--orange-pale);
border: 1px solid rgba(232,96,10,.2);
border-radius: var(--radius-md);
padding: 1rem 1.25rem;
margin-bottom: 1rem;
}
.bhp-seats-selector__label {
display: flex;
align-items: center;
gap: .5rem;
font-weight: 600;
font-size: .9rem;
color: var(--navy);
margin-bottom: .35rem;
}
.bhp-seats-selector__label svg { color: var(--orange); flex-shrink: 0; }
.bhp-seats-selector__hint {
font-size: .8rem;
color: var(--gray-600);
margin-bottom: .75rem;
}
.bhp-seats-selector__total {
font-size: .9rem;
color: var(--gray-600);
padding-top: .75rem;
border-top: 1px solid rgba(232,96,10,.2);
}
.bhp-seats-selector__total strong {
font-family: var(--font-heading);
color: var(--navy);
font-size: 1.1rem;
} .bhp-join-card {
background: var(--white);
border: 1px solid var(--gray-100);
border-radius: var(--radius-xl);
padding: clamp(2rem, 5vw, 3rem);
text-align: center;
box-shadow: var(--shadow-card);
}
.bhp-join-card h1 {
font-size: clamp(1.4rem, 3vw, 1.8rem);
margin-bottom: .75rem;
}
.bhp-join-card p {
margin-bottom: 1.5rem;
color: var(--gray-600);
}
.bhp-join-card__icon {
width: 56px;
height: 56px;
background: var(--orange-pale);
color: var(--orange);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 1.25rem;
}
.bhp-join-card--error .bhp-join-card__icon,
.bhp-join-card__icon--error {
background: #FCEBEB;
color: #A32D2D;
}
.bhp-join-card__badge {
display: inline-flex;
align-items: center;
gap: .5rem;
background: var(--gray-50);
border-radius: 100px;
padding: .4rem 1rem;
font-size: .8rem;
font-weight: 600;
color: var(--navy);
margin-bottom: 1.25rem;
}
.bhp-join-card__badge svg { width: 16px !important; height: 16px !important; color: var(--orange); }
.bhp-join-card__course {
font-size: 1.05rem;
font-weight: 600;
color: var(--orange);
margin-bottom: 1.5rem !important;
}
.bhp-join-card__info {
background: var(--gray-50);
border-radius: var(--radius-md);
padding: 1rem;
font-size: .875rem;
color: var(--gray-600);
margin-bottom: 1.5rem;
text-align: left;
}
.bhp-join-form { text-align: left; }
.bhp-join-form .form-group { margin-bottom: 1.1rem; } .bhp-groups-list {
display: flex;
flex-direction: column;
gap: 1rem;
}
.bhp-group-card {
display: flex;
align-items: center;
gap: 1.5rem;
background: var(--white);
border: 1px solid var(--gray-100);
border-radius: var(--radius-lg);
padding: 1.5rem;
text-decoration: none;
transition: all .2s;
}
.bhp-group-card:hover {
border-color: var(--orange);
box-shadow: var(--shadow-card);
transform: translateY(-2px);
}
.bhp-group-card__main { flex: 1; min-width: 0; }
.bhp-group-card__title {
font-weight: 700;
color: var(--navy);
font-size: 1.05rem;
margin-bottom: .2rem;
}
.bhp-group-card__company {
font-size: .8rem;
color: var(--gray-400);
margin-bottom: .75rem;
}
.bhp-group-card__bar {
height: 6px;
background: var(--gray-100);
border-radius: 100px;
overflow: hidden;
margin-bottom: .5rem;
}
.bhp-group-card__bar-fill {
height: 100%;
background: var(--orange);
border-radius: 100px;
}
.bhp-group-card__stats {
font-size: .8rem;
color: var(--gray-600);
}
.bhp-group-card__arrow {
color: var(--gray-400);
flex-shrink: 0;
}
.bhp-group-card:hover .bhp-group-card__arrow { color: var(--orange); } .bhp-back-link {
display: inline-flex;
align-items: center;
gap: .4rem;
font-size: .85rem;
color: var(--gray-400);
text-decoration: none;
margin-bottom: 1.25rem;
}
.bhp-back-link:hover { color: var(--orange); }
.bhp-group-actions {
display: flex;
gap: .75rem;
flex-wrap: wrap;
margin-bottom: 1.5rem;
}
.bhp-bulk-invite-form {
background: var(--gray-50);
border: 1px solid var(--gray-100);
border-radius: var(--radius-lg);
padding: 1.5rem;
margin-bottom: 1.5rem;
}
.bhp-bulk-invite-form textarea.form-control { font-family: var(--font-body); } .bhp-seats-table-wrap {
overflow-x: auto;
border: 1px solid var(--gray-100);
border-radius: var(--radius-lg);
}
.bhp-seats-table {
width: 100%;
border-collapse: collapse;
font-size: .875rem;
min-width: 640px;
}
.bhp-seats-table th {
background: var(--gray-50);
padding: .75rem 1rem;
text-align: left;
font-weight: 600;
font-size: .75rem;
text-transform: uppercase;
letter-spacing: .05em;
color: var(--navy);
border-bottom: 2px solid var(--gray-200);
white-space: nowrap;
}
.bhp-seats-table td {
padding: .875rem 1rem;
border-bottom: 1px solid var(--gray-100);
color: var(--gray-600);
vertical-align: middle;
}
.bhp-seats-table tr:last-child td { border-bottom: none; }
.bhp-seats-table tr:hover td { background: var(--gray-50); } .bhp-badge {
display: inline-block;
padding: .25rem .7rem;
border-radius: 100px;
font-size: .75rem;
font-weight: 600;
white-space: nowrap;
}
.bhp-badge--gray   { background: var(--gray-100); color: var(--gray-400); }
.bhp-badge--orange { background: var(--orange-pale); color: var(--orange); }
.bhp-badge--green  { background: #EAF3DE; color: #3B6D11; } .bhp-mini-bar {
width: 60px;
height: 5px;
background: var(--gray-100);
border-radius: 100px;
overflow: hidden;
display: inline-block;
vertical-align: middle;
margin-right: .4rem;
}
.bhp-mini-bar__fill {
height: 100%;
background: var(--orange);
border-radius: 100px;
} .bhp-seat-actions { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
.bhp-link-btn {
background: none;
border: none;
color: var(--orange);
font-size: .8rem;
font-weight: 600;
cursor: pointer;
padding: 0;
font-family: var(--font-body);
text-decoration: underline;
text-underline-offset: 2px;
}
.bhp-link-btn:hover { color: var(--orange-light); }
.bhp-link-btn--danger { color: #A32D2D; }
.bhp-link-btn--danger:hover { color: #C44; } .bhp-single-invite-overlay {
position: fixed;
inset: 0;
background: rgba(15,29,51,.6);
z-index: 300;
align-items: center;
justify-content: center;
padding: 1.5rem;
}
.bhp-single-invite-box {
background: var(--white);
border-radius: var(--radius-lg);
padding: 2rem;
width: 100%;
max-width: 400px;
}
.bhp-single-invite-box h3 {
font-size: 1.15rem;
margin-bottom: 1.25rem;
} @media (max-width: 600px) {
.bhp-group-card { flex-direction: column; align-items: stretch; gap: .75rem; }
.bhp-group-card__arrow { display: none; }
.bhp-group-actions { flex-direction: column; }
.bhp-group-actions .btn { width: 100%; justify-content: center; }
} .bhp-course-buy-form {
margin-bottom: .75rem;
}
.bhp-course-buy-form form.cart {
display: flex;
flex-direction: column;
gap: .75rem;
margin: 0;
}
.bhp-course-buy-form .quantity {
width: 100%;
}
.bhp-course-buy-form input.qty {
width: 100%;
height: 50px;
padding: .5rem .75rem;
border: 1.5px solid var(--gray-200);
border-radius: var(--radius-sm);
font-family: var(--font-body);
font-size: 1rem;
font-weight: 600;
text-align: center;
color: var(--navy);
background: var(--white);
}
.bhp-course-buy-form input.qty:focus {
outline: none;
border-color: var(--orange);
box-shadow: 0 0 0 3px rgba(232,96,10,.12);
}
.bhp-course-buy-form button.single_add_to_cart_button,
.bhp-course-buy-form a.single_add_to_cart_button {
width: 100%;
display: inline-flex !important;
align-items: center;
justify-content: center;
gap: .5rem;
padding: .875rem 1.5rem;
min-height: 50px;
background: var(--orange) !important;
color: var(--white) !important;
border: none !important;
border-radius: var(--radius-md) !important;
font-family: var(--font-body) !important;
font-size: 1rem !important;
font-weight: 700 !important;
cursor: pointer;
transition: all .2s ease;
text-decoration: none;
white-space: nowrap;
}
.bhp-course-buy-form button.single_add_to_cart_button:hover,
.bhp-course-buy-form a.single_add_to_cart_button:hover {
background: var(--orange-light) !important;
transform: translateY(-1px);
box-shadow: 0 4px 16px rgba(232,96,10,.35);
} .bhp-course-buy-form .bhp-seats-selector {
margin-bottom: 0;
}
.bhp-course-buy-form .bhp-seats-selector__hint {
font-size: .75rem;
}
.bhp-course-buy-form .bhp-seats-selector__total {
font-size: .85rem;
}
.bhp-course-buy-form .bhp-seats-selector__total strong {
font-size: 1rem;
} .bhp-course-buy-form .bhp-mode-switch {
grid-template-columns: 1fr;
}
.bhp-course-buy-form .bhp-mode-option__inner {
justify-content: flex-start;
padding: .65rem .9rem;
}  body.woocommerce-account .woocommerce > div:not(.woocommerce-notices-wrapper) {
box-sizing: border-box !important;
}
body.woocommerce-account .woocommerce {
display: flex !important;
flex-direction: row !important;
gap: 2.5rem !important;
align-items: flex-start !important;
width: 100% !important;
max-width: 100% !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation {
width: 240px !important;
min-width: 240px !important;
max-width: 240px !important;
flex-shrink: 0 !important;
}
body.woocommerce-account .woocommerce-MyAccount-content {
width: 100% !important;
min-width: 0 !important;
max-width: none !important;
flex: 1 1 auto !important;
} body.woocommerce-account .woocommerce-MyAccount-content > * {
max-width: 100% !important;
}
@media (max-width: 768px) {
body.woocommerce-account .woocommerce {
flex-direction: column !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation {
width: 100% !important;
min-width: 100% !important;
max-width: 100% !important;
}
}  .bhp-checkout-grid {
display: grid;
grid-template-columns: 1fr 380px;
gap: 3rem;
align-items: start;
max-width: 100%;
}
.bhp-checkout-form {
min-width: 0;
}
.bhp-checkout-summary {
position: sticky;
top: 90px;
}
.bhp-checkout-summary__title {
font-size: 1.1rem !important;
color: var(--navy) !important;
font-weight: 700 !important;
margin: 0 0 .75rem !important;
padding-bottom: .75rem !important;
border-bottom: 1px solid var(--gray-100) !important;
}
#order_review {
background: var(--white);
border: 1px solid var(--gray-100);
border-radius: var(--radius-lg);
padding: 1.5rem;
overflow: hidden;
} .woocommerce-checkout .form-row {
margin-bottom: 1rem !important;
padding: 0 !important;
}
.woocommerce-checkout .form-row label {
display: block !important;
font-size: .85rem !important;
font-weight: 600 !important;
color: var(--navy) !important;
margin-bottom: .35rem !important;
}
.woocommerce-checkout .form-row .required { color: var(--orange) !important; }
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row input[type="email"],
.woocommerce-checkout .form-row input[type="tel"],
.woocommerce-checkout .form-row input[type="number"],
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea {
width: 100% !important;
padding: .75rem 1rem !important;
border: 1.5px solid var(--gray-200) !important;
border-radius: var(--radius-sm) !important;
font-family: var(--font-body) !important;
font-size: .9rem !important;
color: var(--gray-900, #111) !important;
background: var(--white) !important;
box-sizing: border-box !important;
height: auto !important;
display: block !important;
}
.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row select:focus {
outline: none !important;
border-color: var(--orange) !important;
box-shadow: 0 0 0 3px rgba(232,96,10,.12) !important;
} .woocommerce-checkout .form-row-first { float: left !important; width: calc(50% - .5rem) !important; clear: left !important; }
.woocommerce-checkout .form-row-last  { float: right !important; width: calc(50% - .5rem) !important; }
.woocommerce-checkout .form-row-wide  { clear: both !important; width: 100% !important; float: none !important; }
.woocommerce-billing-fields__field-wrapper { overflow: hidden; } .woocommerce-billing-fields > h3,
.woocommerce-shipping-fields > h3,
.woocommerce-additional-fields > h3 {
font-size: 1.1rem !important;
color: var(--navy) !important;
font-weight: 700 !important;
padding-bottom: .75rem !important;
border-bottom: 1px solid var(--gray-100) !important;
margin: 1.75rem 0 1.25rem !important;
}
.woocommerce-billing-fields > h3 { margin-top: 0 !important; } #bhp-invoice-section {
margin-top: 1.5rem;
padding-top: 1.5rem;
border-top: 1px solid var(--gray-100);
}
#bhp-invoice-section h3 {
font-size: 1.1rem !important;
color: var(--navy) !important;
font-weight: 700 !important;
padding-bottom: .75rem !important;
border-bottom: 1px solid var(--gray-100) !important;
margin: 0 0 1.25rem !important;
} #payment {
background: var(--gray-50) !important;
border: 1px solid var(--gray-100) !important;
border-radius: var(--radius-lg) !important;
padding: 1.5rem !important;
margin-top: 1.5rem !important;
}
#payment .wc_payment_methods {
list-style: none !important;
margin: 0 0 1rem !important;
padding: 0 !important;
}
#payment .wc_payment_methods li {
padding: 1rem 1.25rem !important;
background: var(--white) !important;
border: 1.5px solid var(--gray-200) !important;
border-radius: var(--radius-md) !important;
margin-bottom: .5rem !important;
}
#payment .wc_payment_methods label { font-weight: 600; color: var(--navy); cursor: pointer; }
#payment .payment_box {
background: transparent !important;
border: none !important;
padding: .5rem 0 0 !important;
font-size: .875rem !important;
color: var(--gray-600) !important;
}
#payment .woocommerce-privacy-policy-text {
font-size: .8rem;
color: var(--gray-400);
margin: 1rem 0;
} #payment .woocommerce-form__label-for-checkbox {
display: flex !important;
align-items: flex-start !important;
gap: .6rem !important;
font-size: .875rem !important;
color: var(--gray-600) !important;
font-weight: 400 !important;
cursor: pointer !important;
margin-bottom: 1.25rem !important;
}
#payment input#terms {
width: 16px !important; height: 16px !important;
flex-shrink: 0 !important;
margin-top: 2px !important;
accent-color: var(--orange) !important;
} #place_order {
display: block !important;
width: 100% !important;
padding: 1rem 2rem !important;
background: var(--orange) !important;
color: var(--white) !important;
border: none !important;
border-radius: var(--radius-md) !important;
font-family: var(--font-body) !important;
font-size: 1rem !important;
font-weight: 700 !important;
cursor: pointer !important;
transition: all .2s !important;
letter-spacing: .02em !important;
}
#place_order:hover {
background: var(--orange-light) !important;
transform: translateY(-1px) !important;
box-shadow: 0 4px 16px rgba(232,96,10,.35) !important;
} @media (max-width: 900px) {
.bhp-checkout-grid {
grid-template-columns: 1fr;
}
.bhp-checkout-summary { position: static; }
.woocommerce-checkout .form-row-first,
.woocommerce-checkout .form-row-last {
float: none !important;
width: 100% !important;
clear: both !important;
}
}