/* Start custom CSS for html, class: .elementor-element-f3a7bda *//* =========================
HEADER
========================= */

.site-header{
position:fixed;
top:0;
left:0;
width:100%;
z-index:9999;
background:#000000;
padding:22px 30px;
}

.header-inner{
max-width:1200px;
margin:0 auto;
display:flex;
align-items:center;
justify-content:space-between;
}

/* Logo */

.header-logo{
font-family:Inter, sans-serif;
font-size:22px;
font-weight:900;
letter-spacing:-0.5px;
color:#ffffff;
}

/* CTA Button */

.header-cta{
background:#ff3b8d;
color:#ffffff;
padding:14px 34px;
border-radius:50px;
text-decoration:none;
font-weight:700;
font-size:14px;
transition:0.3s ease;
}

.header-cta:hover{
background:#e63278;
transform:translateY(-2px);
box-shadow:0 10px 30px rgba(255,59,141,0.4);
}

/* Mobile */

@media(max-width:600px){

.site-header{
padding:18px 20px;
}

.header-logo{
font-size:18px;
}

.header-cta{
padding:12px 26px;
font-size:13px;
}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9a380c6 *//* =========================
HEADER
========================= */

.site-header{
position:fixed;
top:0;
left:0;
width:100%;
z-index:9999;
background:#000000;
padding:22px 30px;
}

.header-inner{
max-width:1200px;
margin:0 auto;
display:flex;
align-items:center;
justify-content:space-between;
}

.header-logo{
font-family:Inter, sans-serif;
font-size:22px;
font-weight:900;
letter-spacing:-0.5px;
color:#ffffff;
}

.header-cta{
background:#ff3b8d;
color:#ffffff;
padding:14px 34px;
border-radius:50px;
text-decoration:none;
font-weight:700;
font-size:14px;
transition:0.3s ease;
}

.header-cta:hover{
background:#e63278;
transform:translateY(-2px);
box-shadow:0 10px 30px rgba(255,59,141,0.4);
}

/* =========================
HERO – SALES ENGLISH
========================= */

.sales-hero{
background:#ffffff;
padding:220px 30px 160px;
}

.sales-hero-inner{
max-width:1200px;
margin:0 auto;
display:grid;
grid-template-columns:1.1fr 0.9fr;
gap:80px;
align-items:center;
}

/* Left */

.sales-hero-left{
animation:fadeUp 1s ease forwards;
}

/* Headline */

.sales-hero-left h1{
font-family:Inter, sans-serif;
font-size:clamp(40px,6vw,74px);
font-weight:900;
line-height:1;
margin-bottom:18px;
color:#000000;
}

/* Red word */

.red-word{
color:#e63946;
}

/* Subtext */

.sales-hero-sub{
font-size:22px;
max-width:620px;
margin-bottom:24px;
opacity:0.8;
line-height:1.6;
}

/* Outcome statements */

.sales-hero-points{
display:flex;
flex-direction:column;
gap:18px;
margin-bottom:50px;
max-width:420px;
}

.hero-bullet{
font-size:22px;
font-weight:700;
color:#000000;
opacity:0;
transform:translateY(20px);
animation:bulletFade 0.8s ease forwards;
}

.hero-bullet:nth-child(1){animation-delay:0.3s;}
.hero-bullet:nth-child(2){animation-delay:0.6s;}
.hero-bullet:nth-child(3){animation-delay:0.9s;}

/* CTA */

.sales-hero-cta{
display:inline-block;
background:#ff3b8d;
color:#ffffff;
padding:18px 44px;
border-radius:50px;
text-decoration:none;
font-weight:700;
font-size:16px;
transition:0.3s ease;
}

.sales-hero-cta:hover{
background:#e63278;
transform:translateY(-3px);
box-shadow:0 15px 40px rgba(255,59,141,0.4);
}

/* Right Image */

.sales-hero-image{
width:100%;
height:520px;
border-radius:28px;
background:url("https://www.smoothenglishcompany.com/wp-content/uploads/2026/01/ChatGPT-Image-Jan-30-2026-11_19_38-AM.jpg") center / cover no-repeat;
box-shadow:0 40px 80px rgba(0,0,0,0.25);
animation:floatSoft 6s ease-in-out infinite;
}

/* Animations */

@keyframes fadeUp{
from{opacity:0;transform:translateY(40px);}
to{opacity:1;transform:translateY(0);}
}

@keyframes floatSoft{
0%{transform:translateY(0);}
50%{transform:translateY(-12px);}
100%{transform:translateY(0);}
}

@keyframes bulletFade{
from{opacity:0;transform:translateY(20px);}
to{opacity:1;transform:translateY(0);}
}

/* Mobile */

@media(max-width:900px){

.sales-hero-inner{
grid-template-columns:1fr;
gap:50px;
}

.sales-hero-image{
height:380px;
}

}
/* =========================
SOFT PINK GLOW WORD
========================= */

.red-word{
color:#ff2fa4;
text-shadow:
0 0 3px rgba(255,47,164,0.6),
0 0 8px rgba(255,47,164,0.6);
animation:pinkGlowPulse 2.5s ease-in-out infinite;
}

@keyframes pinkGlowPulse{
0%{
text-shadow:
0 0 2px rgba(255,47,164,0.4),
0 0 6px rgba(255,47,164,0.4);
}
50%{
text-shadow:
0 0 4px rgba(255,47,164,0.9),
0 0 10px rgba(255,47,164,0.9);
}
100%{
text-shadow:
0 0 2px rgba(255,47,164,0.4),
0 0 6px rgba(255,47,164,0.4);
}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-defe5ad *//* =========================
COMPARISON SECTION
========================= */

.comparison-section{
background:#ffffff;
padding:160px 30px;
}

.comparison-title{
max-width:900px;
margin:0 auto 80px;
font-family:Inter, sans-serif;
font-size:clamp(36px,5vw,56px);
font-weight:900;
text-align:center;
color:#000000;
}

/* Grid */

.comparison-grid{
max-width:1000px;
margin:0 auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:60px;
}

/* Cards */

.comparison-card{
padding:60px 50px;
border-radius:32px;
background:#f7f7f7;
box-shadow:0 30px 70px rgba(0,0,0,0.08);
transition:0.4s ease;
}

.comparison-card:hover{
transform:translateY(-10px);
box-shadow:0 40px 90px rgba(0,0,0,0.12);
}

/* Titles */

.comparison-card h3{
font-size:26px;
font-weight:800;
margin-bottom:30px;
color:#000000;
}

/* Lists */

.comparison-card ul{
list-style:none;
padding:0;
margin:0 0 30px;
}

.comparison-card li{
font-size:18px;
line-height:1.6;
margin-bottom:14px;
position:relative;
padding-left:28px;
color:#000000;
}

.comparison-card li::before{
content:"–";
position:absolute;
left:0;
top:0;
color:#e63946;
font-weight:700;
}

/* Result text */

.comparison-result{
font-size:18px;
font-weight:600;
opacity:0.75;
}

.comparison-result.strong{
opacity:1;
}

/* Highlight Smooth Card */

.smooth{
background:#000000;
color:#ffffff;
}

.smooth h3,
.smooth li,
.smooth .comparison-result{
color:#ffffff;
}

.smooth li::before{
color:#ff3b8d;
}

/* Mobile */

@media(max-width:900px){

.comparison-grid{
grid-template-columns:1fr;
gap:40px;
}

.comparison-card{
padding:40px 30px;
}

}
/* Fix last sentence in FIRST comparison card */

.comparison-card:not(.smooth) .comparison-result{
color:#000000;
opacity:1;
}
.glow-pink:hover{
box-shadow:
0 0 0 1px rgba(255,47,164,0.4),
0 20px 60px rgba(0,0,0,0.35),
0 0 30px rgba(255,47,164,0.35);
}
/* =========================
PINK GLOW CARD HOVER
========================= */

.glow-card{
position:relative;
transition:0.4s ease;
}

.glow-card:hover{
transform:translateY(-10px);
box-shadow:
0 0 0 1px rgba(255,47,164,0.45),
0 25px 70px rgba(0,0,0,0.35),
0 0 35px rgba(255,47,164,0.45);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-cf5b788 *//* =========================
HYBRID MODEL SECTION
========================= */

.hybrid-section{
background:#ffffff;
padding:160px 30px;
}

/* Title */

.hybrid-title{
max-width:900px;
margin:0 auto 90px;
font-family:Inter, sans-serif;
font-size:clamp(36px,5vw,56px);
font-weight:900;
text-align:center;
color:#000000;
}

/* Grid */

.hybrid-grid{
max-width:1100px;
margin:0 auto;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:50px;
}

/* Card Base */

.hybrid-step{
min-height:320px;
padding:52px 42px;
border-radius:28px;
display:flex;
flex-direction:column;
justify-content:flex-start;
transition:0.4s ease;
}

/* LIGHT CARDS (1 & 3) */

.hybrid-step:nth-child(1),
.hybrid-step:nth-child(3){
background:linear-gradient(135deg,#ffffff 0%,#ffe1f0 100%);
color:#000000;
box-shadow:
inset 0 0 30px rgba(255,47,164,0.18),
0 30px 70px rgba(0,0,0,0.18);
}

/* DARK CARDS (2 & 4) */

.hybrid-step:nth-child(2),
.hybrid-step:nth-child(4){
background:#000000;
color:#ffffff;
}

/* Pink Number */

.hybrid-number{
display:block;
font-size:14px;
font-weight:800;
letter-spacing:1px;
margin-bottom:18px;
color:#ff2fa4;
animation:pinkGlow 2.5s ease-in-out infinite;
}

/* Titles */

.hybrid-step h3{
font-size:22px;
font-weight:800;
margin-bottom:14px;
}

/* Text */

.hybrid-step p{
font-size:17px;
line-height:1.6;
opacity:0.9;
}

/* Text Color Control */

.hybrid-step:nth-child(1) h3,
.hybrid-step:nth-child(1) p,
.hybrid-step:nth-child(3) h3,
.hybrid-step:nth-child(3) p{
color:#000000;
}

.hybrid-step:nth-child(2) h3,
.hybrid-step:nth-child(2) p,
.hybrid-step:nth-child(4) h3,
.hybrid-step:nth-child(4) p{
color:#ffffff;
}

/* Hover */

.hybrid-step:hover{
transform:translateY(-14px) scale(1.03);
}

/* Light Card Hover Glow */

.hybrid-step:nth-child(1):hover,
.hybrid-step:nth-child(3):hover{
box-shadow:
inset 0 0 45px rgba(255,47,164,0.35),
0 45px 100px rgba(0,0,0,0.35);
}

/* Dark Card Hover Glow */

.hybrid-step:nth-child(2):hover,
.hybrid-step:nth-child(4):hover{
box-shadow:
0 0 0 1px rgba(255,47,164,0.3),
0 45px 100px rgba(0,0,0,0.4);
}

/* Pink Glow Animation */

@keyframes pinkGlow{
0%{
text-shadow:
0 0 4px rgba(255,47,164,0.4),
0 0 8px rgba(255,47,164,0.4);
}
50%{
text-shadow:
0 0 8px rgba(255,47,164,0.9),
0 0 16px rgba(255,47,164,0.9);
}
100%{
text-shadow:
0 0 4px rgba(255,47,164,0.4),
0 0 8px rgba(255,47,164,0.4);
}
}

/* Responsive */

@media(max-width:1000px){

.hybrid-grid{
grid-template-columns:repeat(2,1fr);
gap:40px;
}

.hybrid-step{
min-height:300px;
}

}

@media(max-width:600px){

.hybrid-grid{
grid-template-columns:1fr;
}

.hybrid-step{
padding:42px 32px;
min-height:auto;
}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9b0b5ab *//* =========================
AUTHORITY SECTION
========================= */

.authority-section{
background:#ffffff;
padding:140px 30px;
}

.authority-grid{
max-width:1200px;
margin:0 auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:70px;
align-items:center; /* centers text with image */
}

/* Image */

.authority-image{
width:100%;
height:520px;
border-radius:32px;
background:url("https://www.smoothenglishcompany.com/wp-content/uploads/2026/01/webstie-7.jpg") center / cover no-repeat;
box-shadow:0 40px 80px rgba(0,0,0,0.25);
}

/* Content */

.authority-content{
max-width:520px;
}

.authority-content h2{
font-family:Inter, sans-serif;
font-size:clamp(34px,5vw,52px);
font-weight:900;
line-height:1.1;
margin-bottom:24px;
color:#000000;
}

.authority-content p{
font-size:18px;
line-height:1.65;
margin-bottom:16px;
opacity:0.85;
color:#000000;
}



/* Mobile */

@media(max-width:900px){

.authority-grid{
grid-template-columns:1fr;
gap:50px;
}

.authority-image{
height:380px;
}

.authority-content{
max-width:100%;
}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-61c06dc *//* =========================
PRICING SECTION
========================= */

.pricing-section{
background:#ffffff;
padding:160px 30px;
}

/* Title */

.pricing-title{
max-width:900px;
margin:0 auto 80px;
font-family:Inter, sans-serif;
font-size:clamp(36px,5vw,56px);
font-weight:900;
text-align:center;
color:#000000;
}

/* Grid */

.pricing-grid{
max-width:1100px;
margin:0 auto;
display:grid;
grid-template-columns:repeat(3,1fr);
gap:50px;
}

/* Card Base */

.pricing-card{
background:#000000;
padding:60px 45px;
border-radius:32px;
box-shadow:0 30px 70px rgba(0,0,0,0.12);
transition:0.4s ease;
position:relative;
display:flex;
flex-direction:column;
color:#ffffff;
border:1px solid rgba(255,255,255,0.12);
}

.pricing-card:hover{
transform:translateY(-14px);
box-shadow:0 40px 100px rgba(0,0,0,0.35);
}

/* Highlight Middle Tier */

.pricing-card.highlight{
border:2px solid #ff3b8d;
box-shadow:0 40px 120px rgba(255,59,141,0.35);
}

/* Tier Titles */

.pricing-card h3{
font-size:30px;
font-weight:900;
margin-bottom:10px;
}

/* Gold */

.pricing-card:nth-child(1) h3{
color:#FFD84D;
}

/* Diamond */

.pricing-card:nth-child(2) h3{
color:#9BD3FF;
}

/* Platinum */

.pricing-card:nth-child(3) h3{
color:#E5E4E2;
}

/* Sub */

.pricing-sub{
font-size:16px;
opacity:0.75;
margin-bottom:28px;
}

/* List */

.pricing-card ul{
list-style:none;
padding:0;
margin:0 0 30px;
}

.pricing-card li{
position:relative;
padding-left:26px;
margin-bottom:14px;
line-height:1.5;
}

.pricing-card li::before{
content:"•";
position:absolute;
left:0;
top:0;
color:#ff3b8d;
font-size:22px;
}

/* Result Line */

.pricing-result{
font-weight:600;
margin-bottom:30px;
}

/* CTA */

.pricing-cta{
margin-top:auto;
align-self:center;

background:#ff3b8d;
color:#ffffff;
padding:14px 40px;
border-radius:50px;
text-decoration:none;
font-weight:700;
transition:0.3s ease;
}

.pricing-cta:hover{
background:#e63278;
transform:translateY(-3px);
}

/* Badge */

.pricing-badge{
position:absolute;
top:-18px;
right:30px;
background:#ff3b8d;
color:#ffffff;
padding:8px 22px;
border-radius:30px;
font-size:13px;
font-weight:700;
}

/* Responsive */

@media(max-width:900px){

.pricing-grid{
grid-template-columns:1fr;
gap:40px;
}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-02c420d *//* =========================
FINAL CTA SECTION
========================= */

.final-cta-section{
background:#000000;
padding:180px 30px 200px; /* extra bottom padding */
text-align:center;
}

.final-cta-inner{
max-width:900px;
margin:0 auto;
}

.final-cta-inner h2{
font-family:Inter, sans-serif;
font-size:clamp(36px,5vw,60px);
font-weight:900;
line-height:1.1;
margin-bottom:30px;
color:#ffffff;
}

.final-cta-inner p{
font-size:20px;
line-height:1.6;
margin-bottom:60px;
opacity:0.85;
color:#ffffff;
}

/* Button */

.final-cta-button{
display:inline-block;
background:#ff3b8d;
color:#ffffff;
padding:18px 52px;
border-radius:50px;
text-decoration:none;
font-weight:700;
font-size:16px;
transition:0.3s ease;
}

.final-cta-button:hover{
background:#e63278;
transform:translateY(-3px);
box-shadow:0 15px 40px rgba(255,59,141,0.4);
}

/* Mobile */

@media(max-width:600px){

.final-cta-section{
padding:140px 24px 160px;
}

.final-cta-inner p{
font-size:18px;
}

}
.final-cta-section{
margin-bottom:120px;
}
/* =========================
FINAL CTA SECTION
========================= */

.final-cta-section{
background:#000000;
padding:180px 30px;
text-align:center;
min-height:100vh;
display:flex;
align-items:center;
}

.final-cta-inner{
max-width:900px;
margin:0 auto;
width:100%;
}

.final-cta-inner h2{
font-family:Inter, sans-serif;
font-size:clamp(36px,5vw,60px);
font-weight:900;
line-height:1.1;
margin-bottom:30px;
color:#ffffff;
}

.final-cta-inner p{
font-size:20px;
line-height:1.6;
margin-bottom:50px;
opacity:0.8;
color:#ffffff;
}

/* Button */

.final-cta-button{
display:inline-block;
background:#ff3b8d;
color:#ffffff;
padding:18px 50px;
border-radius:50px;
text-decoration:none;
font-weight:700;
font-size:16px;
transition:0.3s ease;
}

.final-cta-button:hover{
background:#e63278;
transform:translateY(-3px);
box-shadow:0 15px 40px rgba(255,59,141,0.4);
}/* End custom CSS */