}/*
Theme Name:     Twenty Twenty Four Child
Theme URI:      https://yourwebsite.com/
Description:    Child theme for Twentytwentyfour
Author:         Rajesh
Author URI:     https://yourwebsite.com/
Template:       twentytwentyfour
Version:        1.0.0
Text Domain:    twentytwentyfour-child
*/

/* Import parent theme styles (optional, as Hello Elementor doesn’t use CSS much) */
@import url("../twentytwentyfour/style.css");

:root{
--gap: 10px; /* change to 5-10px as you like */
--radius: 16px;
--accent-red: #c92a2a;
--dark-card: #222;
--light-text: #ffffff;
--muted: rgba(255,255,255,0.9);
}

.insurance-section{
margin: 0 auto;
padding: 18px 10px;
color: #111;
}

.insurance-header{
display:flex;
gap: 20px;
align-items:flex-start;
margin-bottom: 18px;
}
.insurance-title{
font-size: 44px;
line-height: 1.02;
font-weight: 300;
margin: 0;
flex: 1 1 60%;
max-width: 60%;
}
.insurance-desc{
flex:1 1 40%;
color: #7b7b7b;
margin: 6px 0 0 0;
font-size: 14px;
max-width: 40%;
}

/* Grid: left column larger, other two equal */
.insurance-grid{
display: grid;
grid-template-columns: 52% 22.0% 22.0%;
grid-auto-rows: 260px; /* equal height for all cells */
gap: 10px;
align-items: stretch;
}

.card{
border-radius: var(--radius);
overflow: hidden;
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
padding: 20px;
height: 100%; /* ensure it fills grid cell */
box-sizing: border-box;
}

/* images stretch to fill their card */
.card-image{
width: 100%;
height: 100%;
display:block;
object-fit: cover;
border-radius: 20px;
}

/* grid positions */
.left-top{ grid-column: 1 / 2; grid-row: 1 / 2; }
.left-bottom{ grid-column: 1 / 2; grid-row: 2 / 3; background: var(--accent-red); color: var(--light-text); }
.middle-top{ grid-column: 2 / 3; grid-row: 1 / 2; background: var(--dark-card); color: var(--light-text); }
.middle-bottom{ grid-column: 2 / 3; grid-row: 2 / 3; background:#f5f5f5; }
.right-top{ grid-column: 3 / 4; grid-row: 1 / 2; background: var(--accent-red); color: var(--light-text); }
.right-bottom{ grid-column: 3 / 4; grid-row: 2 / 3; background: var(--accent-red); color: var(--light-text); }

/* Title & text styling: all titles white */
.card h3{
margin:0 0 8px 0;
font-size: 40px;
font-weight: 600;
line-height:60px;
text-align: center;

color: var(--light-text) !important; /* force white titles */
}
.card p{
margin:0;
font-size: 13px;
color: var(--muted);
}

/* small consistent button */
.small-btn{
display: inline-block;
background: rgba(255,255,255,0.08);
color: var(--light-text);
padding: 8px 14px;
border-radius: 12px;
font-size: 13px;
text-decoration:none;
height:36px;
line-height:18px;
align-self:flex-start;
margin-top:12px;
}

/* If a card uses an image, make text overlay readable (optional) */
.card .overlay-gradient{
position:absolute;
inset:0;
background: linear-gradient(180deg, rgba(0,0,0,0.0) 30%, rgba(0,0,0,0.45) 100%);
pointer-events:none;
}
.contact-btn3 {
position: relative;
width: 80%;
height: 42px;
background: #CF312D;
border-radius: 15.1181px;
border: none;
cursor: pointer;
font-family: inherit;
display: flex;
align-items: center;
justify-content: center;
padding-right: 30px; /* space for arrow */
}
.arrow-box2 {
position: absolute;
width: 36px;
height: 36px;
right: 3px;  /* aligns arrow box on right side */
top: 3px;
background: #501211;
border-radius: 11.3386px;
display: flex;
align-items: center;
justify-content: center;
}
.contact-btn2 {
position: relative;
width: 90%;
height: 42px;
background: #CF312D;
border-radius: 15.1181px;
border: none;
cursor: pointer;
font-family: inherit;
display: flex;
align-items: center;
justify-content: center;
padding-right: 40px; /* space for arrow */
}
.btn-text2 {
font-size: 15px;
font-weight: 600;
color: #fff;
}
.arrow-icon {
width: 24px;
height: 24px;
}
.contact-white-btn {
position: relative;
width: 70%;
height: 42px;
background: #FFFFFF;
border-radius: 15.1181px;
border: none;
cursor: pointer;
font-family: inherit;
display: flex;
align-items: center;
justify-content: center;
padding-right: 40px; /* space for arrow */
}

.btn-black-text {
font-size: 15px;
font-weight: 600;
color: #000;
}

.arrow-box-red {
position: absolute;
width: 36px;
height: 36px;
right: 3px;  /* aligns arrow box on right side */
top: 3px;
background: #CF312D;
border-radius: 11.3386px;
display: flex;
align-items: center;
justify-content: center;
}


/* Responsive: single column stack on small screens */
@media (max-width: 920px){
	.contact-white-btn {width:100%}
.insurance-header{ flex-direction: column; gap: 12px; }
.insurance-title{ font-size: 32px; max-width:100%; }
.insurance-desc{ max-width:100%; }

.insurance-grid{
  grid-template-columns: 1fr;
  grid-auto-rows: 200px;
}
/* ensure each item fills full width */
.left-top, .middle-top, .right-top, .left-bottom, .middle-bottom, .right-bottom{
  grid-column: auto;
  grid-row: auto;
}
.card h3{ font-size: 22px; }
.contact-btn3 {width: 100%!important;}
}

@media (max-width: 420px){
.insurance-section{ padding: 18px 12px; }
.insurance-title{ font-size: 26px; }
.insurance-grid{ grid-auto-rows: 180px; }
}

/*#home-hero{
background: rgba(0, 0, 0, 0.8);
backdrop-filter: blur(25px);
border-radius: 24px;
}*/
.elementor-widget-n-tabs .e-n-tab-title[aria-selected="false"]{background-color:transparent!important}
.home-border-plus-sign {
    position: relative;
}

/* Vertical center line */
.home-border-plus-sign::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    background: rgba(255, 255, 255, 0.15); /* light border like screenshot */
    transform: translateX(-50%);
    pointer-events: none;
}

/* Horizontal center line */
.home-border-plus-sign::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background: rgba(255, 255, 255, 0.15);
    transform: translateY(-50%);
    pointer-events: none;
}