/* Start custom CSS for html, class: .elementor-element-da61db9 *//* =====================================================
MODERN LIC TERM INSURANCE LANDING SECTION
===================================================== */
.lic-hero-section,
.lic-hero-section * {
box-sizing: border-box;
}
/* =====================================================
MAIN SECTION
===================================================== */
.lic-hero-section {
width: 100%;
position: relative;
overflow: hidden;
background:
radial-gradient(
circle at 15% 20%,
rgba(55, 125, 205, 0.25),
transparent 35%
),
linear-gradient(
135deg,
#123d68 0%,
#1d5488 50%,
#174a7c 100%
);
padding: 70px 5% 80px;
font-family:
Arial,
Helvetica,
sans-serif;
color: #ffffff;
}
/* Decorative circles */
.lic-hero-section::before {
content: "";
position: absolute;
width: 450px;
height: 450px;
border-radius: 50%;
background:
rgba(255,255,255,0.035);
top: -220px;
left: -160px;
pointer-events: none;
}
.lic-hero-section::after {
content: "";
position: absolute;
width: 500px;
height: 500px;
border-radius: 50%;
border: 1px solid rgba(255,255,255,0.06);
right: -260px;
bottom: -250px;
pointer-events: none;
}
/* =====================================================
CONTAINER
===================================================== */
.lic-main-container {
width: 100%;
max-width: 1180px;
margin: 0 auto;
display: grid;
grid-template-columns:
minmax(0, 1.05fr)
minmax(400px, 0.95fr);
gap: 75px;
position: relative;
z-index: 2;
align-items: center;
}
/* =====================================================
LEFT CONTENT
===================================================== */
.lic-left-content {
padding: 15px 0;
}
/* =====================================================
TOP BADGE
===================================================== */
.lic-top-badge {
display: inline-flex;
align-items: center;
gap: 9px;
padding: 8px 15px;
border-radius: 50px;
background:
rgba(255,255,255,0.10);
border:
1px solid rgba(255,255,255,0.16);
color: #dcecff;
font-size: 13px;
font-weight: 600;
margin-bottom: 24px;
backdrop-filter: blur(10px);
}
.lic-top-badge span {
width: 19px;
height: 19px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: #f2c75c;
color: #173e68;
font-size: 12px;
font-weight: 900;
}
/* =====================================================
HEADING
===================================================== */
.lic-left-content h1 {
margin: 0;
max-width: 650px;
color: #ffffff;
font-size: clamp(
38px,
4vw,
58px
);
line-height: 1.08;
letter-spacing: -1.5px;
font-weight: 800;
}
.lic-left-content h1 span {
display: block;
color: #f6d36b;
}
/* =====================================================
DESCRIPTION
===================================================== */
.lic-hero-description {
max-width: 560px;
margin: 23px 0 22px;
color: #d9e8f6;
font-size: 16px;
line-height: 1.7;
}
/* =====================================================
PRICE
===================================================== */
.lic-price-text {
display: inline-flex;
align-items: center;
gap: 8px;
margin: 0 0 42px;
color: #ffffff;
font-size: 18px;
font-weight: 500;
}
.lic-price-text strong {
position: relative;
color: #173e68;
background: #f6d36b;
padding: 8px 14px;
border-radius: 9px;
font-size: 21px;
font-weight: 800;
box-shadow:
0 7px 20px
rgba(0,0,0,0.15);
}
/* =====================================================
BENEFITS TITLE
===================================================== */
.lic-benefits-title {
position: relative;
margin-bottom: 20px;
color: #ffffff;
font-size: 18px;
font-weight: 700;
}
.lic-benefits-title::after {
content: "";
display: block;
width: 45px;
height: 3px;
margin-top: 8px;
border-radius: 10px;
background: #f6d36b;
}
/* =====================================================
BENEFITS GRID
===================================================== */
.lic-benefits-grid {
display: grid;
grid-template-columns:
repeat(3, 1fr);
gap: 15px;
}
/* =====================================================
BENEFIT CARD
===================================================== */
.lic-benefit-card {
min-width: 0;
padding: 20px 17px;
border-radius: 17px;
background:
rgba(255,255,255,0.075);
border:
1px solid
rgba(255,255,255,0.10);
transition:
transform 0.25s ease,
background 0.25s ease;
backdrop-filter: blur(8px);
}
.lic-benefit-card:hover {
transform: translateY(-5px);
background:
rgba(255,255,255,0.12);
}
/* =====================================================
BENEFIT ICON
===================================================== */
.lic-icon {
width: 42px;
height: 42px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 14px;
border-radius: 12px;
background:
rgba(246,211,107,0.14);
border:
1px solid
rgba(246,211,107,0.20);
color: #f6d36b;
font-size: 22px;
}
.lic-benefit-card h3 {
margin: 0 0 8px;
color: #ffffff;
font-size: 16px;
line-height: 1.25;
font-weight: 700;
}
.lic-benefit-card p {
margin: 0;
color: #c8d9e9;
font-size: 11px;
line-height: 1.5;
}
/* =====================================================
STATS
===================================================== */
.lic-stats-row {
display: grid;
grid-template-columns:
repeat(3, 1fr);
gap: 15px;
margin-top: 24px;
padding-top: 22px;
border-top:
1px solid
rgba(255,255,255,0.12);
}
.lic-stat-item {
display: flex;
align-items: center;
gap: 11px;
min-width: 0;
}
.lic-stat-icon,
.lic-laurel {
flex-shrink: 0;
}
.lic-stat-icon {
color: #f6d36b;
font-size: 25px;
font-weight: 700;
}
.lic-laurel {
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border:
1.5px solid
rgba(246,211,107,0.70);
border-radius: 50%;
color: #f6d36b;
font-size: 16px;
}
.lic-stat-number {
color: #ffffff;
font-size: 15px;
font-weight: 800;
white-space: nowrap;
}
.lic-stat-text {
margin-top: 3px;
color: #bcd0e3;
font-size: 10px;
line-height: 1.3;
}
/* =====================================================
TRUST LINE
===================================================== */
.lic-trust-line {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 9px;
margin-top: 27px;
color: #d5e5f3;
font-size: 12px;
font-weight: 600;
}
.lic-trust-line span {
color: #f6d36b;
font-weight: 900;
}
/* =====================================================
FORM CARD
===================================================== */
.lic-form-card {
width: 100%;
background: #ffffff;
border:
1px solid
rgba(255,255,255,0.5);
border-radius: 28px;
padding: 32px;
color: #202b36;
box-shadow:
0 25px 70px
rgba(0,0,0,0.22);
position: relative;
}
/* Gold top line */
.lic-form-card::before {
content: "";
position: absolute;
left: 35px;
right: 35px;
top: 0;
height: 4px;
border-radius:
0 0 10px 10px;
background:
linear-gradient(
90deg,
#d9ad3f,
#f6d36b,
#d9ad3f
);
}
/* =====================================================
FORM HEADER
===================================================== */
.lic-form-top {
display: flex;
align-items: center;
gap: 14px;
margin-bottom: 18px;
}
.lic-form-icon {
width: 48px;
height: 48px;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
border-radius: 14px;
background:
#eaf3fc;
color: #225487;
font-size: 22px;
font-weight: 800;
}
.lic-form-card h2 {
margin: 0;
color: #183d63;
font-size: 22px;
line-height: 1.25;
font-weight: 800;
}
.lic-form-top p {
margin: 5px 0 0;
color: #71808e;
font-size: 12px;
line-height: 1.4;
}
/* =====================================================
PROGRESS
===================================================== */
.lic-form-progress {
display: flex;
gap: 5px;
margin-bottom: 22px;
}
.lic-form-progress span {
height: 3px;
flex: 1;
border-radius: 5px;
background: #e7edf3;
}
.lic-form-progress span:first-child {
background: #286cc2;
}
/* =====================================================
SECTION HEADINGS
===================================================== */
.lic-form-section-title {
display: flex;
align-items: center;
gap: 9px;
margin-top: 20px;
margin-bottom: 14px;
padding-bottom: 9px;
border-bottom:
1px solid #e5ebf1;
color: #225487;
font-size: 14px;
font-weight: 800;
}
.lic-form-section-title:first-of-type {
margin-top: 0;
}
.lic-form-section-title span {
width: 26px;
height: 26px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
background: #edf4fb;
color: #286cc2;
font-size: 10px;
font-weight: 800;
}
/* =====================================================
FORM GROUP
===================================================== */
.lic-form-group {
margin-bottom: 15px;
}
.lic-form-group label {
display: block;
margin-bottom: 6px;
padding-left: 2px;
color: #536271;
font-size: 12px;
font-weight: 700;
}
/* =====================================================
INPUT + SELECT
===================================================== */
.lic-form-group input,
.lic-form-group select {
width: 100%;
height: 54px;
border:
1px solid #d9e0e7;
border-radius: 13px;
padding:
0 15px;
outline: none;
background: #ffffff;
color: #273542;
font-family:
Arial,
Helvetica,
sans-serif;
font-size: 14px;
transition:
border-color 0.2s ease,
box-shadow 0.2s ease,
background 0.2s ease;
}
.lic-form-group input::placeholder {
color: #9aa5af;
}
.lic-form-group input:focus,
.lic-form-group select:focus {
border-color: #286cc2;
background: #fbfdff;
box-shadow:
0 0 0 3px
rgba(40,108,194,0.09);
}
/* =====================================================
SELECT
===================================================== */
.lic-form-group select {
cursor: pointer;
appearance: auto;
-webkit-appearance: auto;
}
.lic-form-group select:invalid {
color: #9aa5af;
}
.lic-form-group select option {
color: #273542;
background: #ffffff;
}
/* =====================================================
MOBILE INPUT
===================================================== */
.lic-mobile-input {
height: 54px;
display: flex;
align-items: center;
overflow: hidden;
border:
1px solid #d9e0e7;
border-radius: 13px;
background: #ffffff;
transition:
border-color 0.2s ease,
box-shadow 0.2s ease;
}
.lic-mobile-input:focus-within {
border-color: #286cc2;
box-shadow:
0 0 0 3px
rgba(40,108,194,0.09);
}
.lic-country-code {
height: 100%;
display: flex;
align-items: center;
padding:
0 13px;
border-right:
1px solid #e1e6eb;
color: #394957;
font-size: 13px;
font-weight: 700;
white-space: nowrap;
}
.lic-mobile-input input {
height: 100% !important;
border: none !important;
border-radius: 0 !important;
box-shadow: none !important;
background: transparent !important;
}
/* =====================================================
NO SPAM
===================================================== */
.lic-no-spam {
display: flex;
align-items: center;
gap: 10px;
margin:
-2px 0 15px;
padding:
10px 12px;
border-radius: 10px;
background: #f2f6f9;
color: #687683;
font-size: 11px;
line-height: 1.45;
}
.lic-no-spam span {
font-size: 17px;
flex-shrink: 0;
}
.lic-no-spam strong {
color: #435464;
}
/* =====================================================
DATE
===================================================== */
.lic-form-group input[type="date"] {
color: #273542;
cursor: pointer;
}
/* =====================================================
CALLBACK BUTTON
===================================================== */
.lic-callback-btn {
width: 100%;
min-height: 62px;
margin-top: 8px;
border: none;
border-radius: 14px;
background:
linear-gradient(
135deg,
#286fc4,
#174f8a
);
color: #ffffff;
font-size: 17px;
font-weight: 800;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
box-shadow:
0 9px 22px
rgba(35,102,177,0.25);
transition:
transform 0.2s ease,
box-shadow 0.2s ease,
opacity 0.2s ease;
}
.lic-callback-btn:hover {
transform: translateY(-2px);
box-shadow:
0 13px 27px
rgba(35,102,177,0.32);
}
.lic-callback-btn:active {
transform: translateY(0);
}
.lic-callback-btn:disabled {
opacity: 0.65;
cursor: not-allowed;
transform: none;
}
.lic-button-arrow {
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background:
rgba(255,255,255,0.16);
font-size: 19px;
}
/* =====================================================
FORM MESSAGE
===================================================== */
#form-message {
text-align: center;
margin-top: 13px;
font-size: 13px;
line-height: 1.5;
}
/* =====================================================
EXPERT TEXT
===================================================== */
.lic-expert-text {
display: flex;
justify-content: center;
align-items: center;
gap: 6px;
margin-top: 17px;
color: #657482;
font-size: 12px;
font-weight: 600;
text-align: center;
}
.lic-expert-text span {
color: #219653;
font-weight: 900;
}
/* =====================================================
DISCLAIMER
===================================================== */
.lic-disclaimer {
margin-top: 12px;
color: #8a949d;
font-size: 10px;
line-height: 1.6;
text-align: center;
}
.lic-disclaimer a {
color: #225487;
font-weight: 700;
text-decoration: none;
}
.lic-disclaimer a:hover {
text-decoration: underline;
}
/* =====================================================
TABLET
===================================================== */
@media (max-width: 1050px) {
.lic-hero-section {
padding:
55px 4%
65px;
}
.lic-main-container {
grid-template-columns:
1fr 1fr;
gap: 35px;
}
.lic-left-content h1 {
font-size: 42px;
}
.lic-form-card {
padding: 27px;
}
.lic-benefit-card {
padding: 16px 13px;
}
.lic-benefit-card h3 {
font-size: 14px;
}
.lic-benefit-card p {
font-size: 10px;
}
.lic-stat-number {
font-size: 13px;
}
}
/* =====================================================
MOBILE
===================================================== */
@media (max-width: 767px) {
.lic-hero-section {
padding:
35px 16px
45px;
overflow: hidden;
}
.lic-main-container {
width: 100%;
display: flex;
flex-direction: column;
gap: 35px;
align-items: stretch;
}
/* LEFT */
.lic-left-content {
width: 100%;
padding: 0;
}
.lic-top-badge {
margin-bottom: 18px;
font-size: 11px;
padding:
7px 12px;
}
.lic-left-content h1 {
font-size: 34px;
line-height: 1.12;
letter-spacing: -0.8px;
}
.lic-hero-description {
margin:
17px 0;
font-size: 14px;
line-height: 1.6;
}
.lic-price-text {
margin-bottom: 30px;
font-size: 15px;
flex-wrap: wrap;
}
.lic-price-text strong {
font-size: 18px;
padding:
7px 11px;
}
/* BENEFITS */
.lic-benefits-title {
font-size: 16px;
margin-bottom: 17px;
}
.lic-benefits-grid {
grid-template-columns:
repeat(2, 1fr);
gap: 11px;
}
.lic-benefit-card {
padding: 15px 12px;
border-radius: 14px;
}
.lic-benefit-card:last-child {
grid-column:
span 2;
}
.lic-icon {
width: 36px;
height: 36px;
margin-bottom: 10px;
font-size: 19px;
border-radius: 10px;
}
.lic-benefit-card h3 {
font-size: 14px;
line-height: 1.25;
}
.lic-benefit-card p {
font-size: 10px;
line-height: 1.4;
}
/* STATS */
.lic-stats-row {
grid-template-columns:
1fr;
gap: 12px;
margin-top: 20px;
padding-top: 18px;
}
.lic-stat-item {
padding:
10px 12px;
border-radius: 12px;
background:
rgba(255,255,255,0.055);
}
.lic-stat-number {
font-size: 14px;
}
.lic-stat-text {
font-size: 10px;
}
.lic-trust-line {
gap: 7px;
margin-top: 18px;
font-size: 10px;
}
/* FORM */
.lic-form-card {
width: 100%;
padding:
26px 18px;
border-radius: 21px;
}
.lic-form-card::before {
left: 25px;
right: 25px;
}
.lic-form-top {
align-items: flex-start;
gap: 11px;
}
.lic-form-icon {
width: 42px;
height: 42px;
border-radius: 11px;
font-size: 18px;
}
.lic-form-card h2 {
font-size: 19px;
}
.lic-form-top p {
font-size: 11px;
line-height: 1.45;
}
.lic-form-progress {
margin-bottom: 19px;
}
.lic-form-section-title {
font-size: 13px;
margin-top: 18px;
margin-bottom: 12px;
}
.lic-form-group {
margin-bottom: 14px;
}
.lic-form-group label {
font-size: 11px;
margin-bottom: 5px;
}
.lic-form-group input,
.lic-form-group select {
height: 52px;
border-radius: 12px;
padding:
0 13px;
font-size: 14px;
}
.lic-mobile-input {
height: 52px;
border-radius: 12px;
}
.lic-country-code {
padding:
0 10px;
font-size: 12px;
}
.lic-no-spam {
font-size: 10px;
padding:
9px 10px;
}
.lic-callback-btn {
min-height: 58px;
border-radius: 13px;
font-size: 16px;
}
.lic-expert-text {
font-size: 11px;
line-height: 1.4;
}
.lic-disclaimer {
font-size: 9px;
padding:
0 5px;
}
}
/* =====================================================
SMALL MOBILE
===================================================== */
@media (max-width: 380px) {
.lic-hero-section {
padding:
28px 12px
40px;
}
.lic-left-content h1 {
font-size: 29px;
}
.lic-hero-description {
font-size: 13px;
}
.lic-benefits-grid {
gap: 8px;
}
.lic-benefit-card {
padding:
13px 10px;
}
.lic-benefit-card h3 {
font-size: 13px;
}
.lic-form-card {
padding:
23px 14px;
}
.lic-form-card h2 {
font-size: 18px;
}
}
/* =====================================================
FORM-ONLY LAYOUT OVERRIDES
Left-side promotional content removed.
===================================================== */
.lic-hero-section {
min-height: 100vh;
padding: 40px 20px;
display: flex;
align-items: center;
justify-content: center;
}
.lic-main-container {
display: flex;
width: 100%;
max-width: 720px;
margin: 0 auto;
justify-content: center;
align-items: center;
gap: 0;
}
.lic-left-content {
display: none !important;
}
.lic-form-card {
width: 100%;
max-width: 650px;
margin: 0 auto;
}
@media (max-width: 767px) {
.lic-hero-section {
min-height: 100vh;
padding: 24px 14px;
}
.lic-main-container {
display: flex;
width: 100%;
max-width: 100%;
gap: 0;
}
.lic-form-card {
width: 100%;
max-width: 100%;
padding: 26px 18px;
}
}/* End custom CSS */