.header {background:none;}
.newrow {background:none;}

/* Hero Section */
.hero-section {height:450px;background:url('/images/site/newhome/slide.jpg') no-repeat;background-color:#11273f;color:#fff;text-align:center;margin-top:-110px;}

.hero-title {font-size:34px; font-weight:700; margin:0 0 12px 0; letter-spacing:0.5px;}

.hero-subtitle-box {display:inline-block; background-color:#facb01; color:#11273f; font-size:26px; font-weight:800; padding:6px 20px; margin-bottom:22px;}

.hero-text {font-size:18px; margin:0 0 30px 0; font-weight:400;}

.hero-text strong {font-weight:700;}

.hero-buttons {display:flex; justify-content:center; gap:20px; flex-wrap:wrap;}

.btn-yellow {background-color:#facb01; color:#11273f; padding:12px 28px; font-size:18px; font-weight:800; text-decoration:none; display:inline-block; transition:opacity 0.3s ease;}

.btn-yellow:hover {opacity:0.9;}

/* Why Choose Section */
.why-section {display:flex; align-items:center; justify-content:space-between; gap:40px; padding:20px 0 40px 0; font-family:Arial, Helvetica, sans-serif;}

.why-left {flex:0 0 38%;}

.why-title {font-size:32px; font-weight:800; color:#11273f; line-height:1.15; margin:0;}

.why-title span {color:#facb01;}

.why-right {flex:0 0 58%;}

.why-subtitle-small {font-size:15px; color:#444; margin-bottom:25px; line-height:1.4;}

.features-grid {display:flex; justify-content:space-between; gap:15px;}

.feature-item {flex:1;}

.feature-title {font-size:12px; font-weight:800; color:#11273f; display:block; margin-bottom:4px; text-transform:uppercase;}

.feature-desc {font-size:13px; color:#666; margin:0; line-height:1.3;}

/* Adaptación por contenedores (.res720, .res480, .res320) */
.res720 .why-section {gap:30px;}

.res480 .why-section,
.res320 .why-section {flex-direction:column; text-align:center;}

.res480 .why-left, 
.res480 .why-right,
.res320 .why-left, 
.res320 .why-right {flex:0 0 100%;}

.res480 .features-grid,
.res320 .features-grid {flex-direction:column; gap:20px;}

/* Media Queries */
@media (max-width:940px) {
    .hero-section {padding:56px 16px;}
}

@media (max-width:720px) {
    .why-section {gap:30px;}
}

@media (max-width:480px) {
    .why-section {flex-direction:column; text-align:center;}
    .why-left, .why-right {flex:0 0 100%;}
    .features-grid {flex-direction:column; gap:20px;}
    .hero-title {font-size:28px;}
    .hero-subtitle-box {font-size:20px;}
}

@media (max-width:320px) {
    .hero-buttons {flex-direction:column;}
    .btn-yellow {width:100%; text-align:center;}
}