:root { --navy: #0a3046; --cyan: #0ca8c9; --paper: #f5f9fb; --line: #d9e6ed; }
* { box-sizing: border-box; }
body { color: var(--navy); font-family: 'Cabin', Arial, sans-serif; line-height: 1.55; }
h1, h2, h3 { font-family: inherit; text-shadow: none; line-height: 1.16; }
h1 { font-size: clamp(2.2rem, 5vw, 4rem); }
h2 { font-size: clamp(1.8rem, 3vw, 2.5rem); }
a:link, a:visited { color: #087c9b; }
a:focus-visible, button:focus-visible { outline: 3px solid var(--cyan); outline-offset: 3px; }
#nav { height: 112px; padding: 0 max(20px, calc((100vw - 1180px)/2)); border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: 0 4px 18px rgba(10,48,70,.06); }
#logo { width: 100px; height: 100px; object-fit: contain; }
#nav ul { gap: clamp(8px, 2vw, 28px); padding: 0; margin: 0; }
#nav ul li { margin: 0; font-size: 1.18rem; font-weight: 600; }
#nav a[aria-current="page"] { color: var(--navy); border-bottom: 0; font-weight: 700; }
footer { height: auto; min-height: 110px; background: var(--navy); color: white; border: 0; gap: 5px; text-align: center; }
footer a:link, footer a:visited { color: #b6eefa; }
.eyebrow { margin: 0 0 10px; color: var(--cyan); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; font-size: .8rem; }
.presentationPic { position: relative; height: min(70vh, 620px); min-height: 490px; justify-content: flex-start; background: var(--navy); }
.presentationPic::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(3,27,42,.9), rgba(3,27,42,.46) 65%, rgba(3,27,42,.1)); }
#pozaPrincipalaLanding { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: none; }
.heroContent { position: relative; z-index: 1; width: min(1180px, calc(100% - 40px)); margin: auto; color: white; }
.heroContent h1 { max-width: 760px; margin: 0 0 16px; padding: 0; color: white; text-align: left; }
.heroContent .heroSubtitle { font-size: clamp(1.35rem, 3vw, 1.75rem); font-weight: 700; margin-bottom: 14px; }
.heroContent > p:not(.eyebrow) { max-width: 560px; font-size: clamp(1.1rem, 2vw, 1.35rem); margin: 0 0 28px; }
.heroContent > .heroSubtitle { max-width: 760px; font-size: clamp(1.35rem, 3vw, 1.75rem); margin-bottom: 14px; }
.heroActions { display: flex; gap: 12px; flex-wrap: wrap; }
.actionButton, .priceButton { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 22px; border-radius: 8px; background: var(--cyan); font-weight: 700; text-align: center; }
.actionButton:link, .actionButton:visited, .priceButton:link, .priceButton:visited { color: #fff; }
.actionButton.secondary { background: white; }
.actionButton.secondary:link, .actionButton.secondary:visited { color: var(--navy); }
#bigContainerOferim { max-width: 1180px; margin: 70px auto; padding: 0 20px; }
#ceofera { margin: 0 0 30px; padding: 0; color: var(--navy); }
.containerOferim { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin: 0; }
.cardWrapper, .card { width: 100%; height: 100%; margin: 0; display: block; }
.card { overflow: hidden; padding: 0 0 20px; background: white; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 8px 24px rgba(10,48,70,.07); font-size: 1rem; }
.card > img, .card #carCarousel { width: 100%; height: 185px; border-radius: 0; }
.card > img { object-fit: cover; }
.card #carCarousel { box-shadow: none; background: transparent; }
.card .slides, .card .car, .card .carImg, .card .carImg img { width: 100%; height: 100%; border-radius: 0; object-fit: cover; }
.card h3 { margin: 20px 20px 10px; font-size: 1.2rem; }
.card ul { margin: 0 20px; padding-left: 20px; }
.card li { margin: 5px 0; }
.documentsSection { background: var(--paper); padding: 56px 20px; }
.documentsInner { max-width: 1180px; margin: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 35px; align-items: center; }
.documentsInner h2 { text-align: left; margin: 0 0 12px; padding: 0; }
.documentsList { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; list-style: none; padding: 0; margin: 0; }
.documentsList li { background: white; border: 1px solid var(--line); border-radius: 10px; padding: 16px; font-weight: 600; }
#contactSiNoutati { width: min(1180px, calc(100% - 40px)); margin: 64px auto; padding: 0; display: block; background: transparent; border: 0; box-shadow: none; }
#sectiuneNoutati { width: 100%; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; text-align: center; }
#sectiuneNoutati h2 { color: var(--navy); }
#sectiuneNoutati > img { display: block; max-width: min(100%, 420px); height: auto; margin: 20px auto; object-fit: contain; border: 0; border-radius: 8px; box-shadow: none; }
.newsStar { display: inline-block; margin: 0 6px; color: var(--cyan); font-size: .7em; vertical-align: 10%; text-shadow: 0 0 10px rgba(12,168,201,.5); animation: newsStarBlink 4s linear infinite; }
@keyframes newsStarBlink { 0%, 49.99% { opacity: 1; } 50%, 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .newsStar { animation: none; } }
.pageBanner { width: 100%; min-height: 160px; margin: 0; padding: 30px 20px; display: flex; align-items: center; background: #e9f3f7; border-top: 3px solid var(--cyan); text-align: left; }
.pageBanner .pageBannerInner { width: min(1180px, 100%); margin: 0 auto; text-align: left; }
.pageBanner .eyebrow { margin: 0 0 8px; }
.pageBanner h1 { max-width: none; margin: 0; padding: 0 0 0 18px; border-left: 4px solid var(--cyan); color: var(--navy); text-align: left; font-family: 'Cabin', Arial, sans-serif; font-size: clamp(2rem, 3.4vw, 2.8rem); font-weight: 800; line-height: 1.2; }
.tariffsPage .priceIntro.pageBanner { margin: 0 0 20px; }
.tariffsPage .carsTitle { margin-bottom: 24px; }
.priceIntro > h1 { margin: 0 0 12px; padding: 0; }
.priceIntro > p:not(.eyebrow) { margin: 0 0 34px; font-size: 1.15rem; }
.priceGrid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 20px; text-align: left; align-items: stretch; }
.priceCard { padding: clamp(24px, 4vw, 42px); border-radius: 16px; border: 1px solid var(--line); background: var(--paper); box-shadow: 0 8px 24px rgba(10,48,70,.06); }
.priceCard.mainPrice { background: white; border: 2px solid var(--cyan); }
.priceCard h2 { text-align: left; font-size: 1.3rem; padding: 0; margin: 0 0 12px; }
.priceValue { margin: 0 0 20px; font-size: clamp(2.8rem, 5vw, 4rem); line-height: 1; font-weight: 800; }
.priceValue span { font-size: 1.1rem; font-weight: 600; }
.priceCard ul { list-style: none; margin: 0 0 26px; padding: 0; }
.priceCard li { padding: 8px 0 8px 28px; position: relative; }
.priceCard li::before { content: '✓'; color: var(--cyan); font-weight: 800; position: absolute; left: 0; }
.carsTitle { margin: 0; }
.carsIntro { margin: 0 auto 26px; padding: 0 20px; text-align: center; }
#carouselWrapper { margin-bottom: 65px; }
#carouselWrapper #carCarousel { width: min(540px, calc(100% - 40px)); box-shadow: 0 8px 24px rgba(10,48,70,.12); }
#carouselWrapper .carImg img { object-fit: cover; }
.tariffLayout { width: min(1220px, calc(100% - 40px)); margin: 0 auto 72px; display: grid; grid-template-columns: minmax(0, 640px) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.tariffLayout #carouselWrapper { width: 100%; margin: 0; }
.tariffLayout #carouselWrapper #carCarousel { width: 100%; }
.tariffAside { background: var(--navy); color: white; border-radius: 16px; padding: clamp(24px, 3vw, 36px); }
.tariffAside h3 { color: white; margin: 0 0 12px; font-size: 1.35rem; }
.tariffAside p { margin: 0; }
.asideEyebrow { color: #73d9ed; text-transform: uppercase; letter-spacing: .1em; font-size: .8rem; font-weight: 700; margin-bottom: 10px !important; }
.extraPrice { color: #fff; font-size: 2.8rem; line-height: 1.1; font-weight: 800; margin-top: 18px !important; }
.extraPrice span { font-size: 1rem; font-weight: 600; white-space: nowrap; }
.announcementPreview { margin-top: 28px; padding-top: 26px; border-top: 1px solid rgba(255,255,255,.25); }
.announcementPreview img { display: block; width: min(100%, 280px); height: 250px; margin: 16px auto; object-fit: contain; background: white; border-radius: 8px; }
.announcementPreview a:link, .announcementPreview a:visited { color: #9de8f4; font-weight: 700; }
#carouselWrapper #carCarousel { height: 620px; }
#carouselWrapper .slides { height: 600px; }
#carouselWrapper .carImg { height: 390px; }
#carouselWrapper .descriereCar { margin: 0; padding: 14px 28px 42px; font-size: 1rem; line-height: 1.45; }
#carouselWrapper .descriereCar b { font-size: 1.2rem; }
#carouselWrapper .detaliiCar { margin: 10px 0 0; padding: 0; }
#carouselWrapper .dotsContainer { bottom: 7px; z-index: 2; }
#carouselWrapper .next, #carouselWrapper .prev { top: 30%; }
.AnunturiTitle { margin-top: 20px; }
.AnunturiWrapper { width: min(500px, calc(100% - 40px)); background: var(--paper); height: auto; padding: 18px; }
.AnunturiCarousel { width: 100%; margin: 0; height: auto; overflow: visible; justify-content: center; }
.AnunturiCarousel .anunturiCard { width: 100%; }
.AnunturiCarousel .anunturiCard:not(:first-child) { display: none; }
.anunturiCard img { width: 100%; height: auto; max-height: 460px; object-fit: contain; box-shadow: none; border: 0; }
@media (max-width: 900px) { .containerOferim { grid-template-columns: repeat(2, minmax(0, 1fr)); } .priceGrid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 1000px) { .tariffLayout { grid-template-columns: 1fr; width: min(640px, calc(100% - 40px)); } .tariffAside { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; } .announcementPreview { margin: 0; padding: 0 0 0 20px; border-top: 0; border-left: 1px solid rgba(255,255,255,.25); } .announcementPreview img { height: 180px; } }
@media (max-width: 520px) { .tariffAside { grid-template-columns: 1fr; } .announcementPreview { margin-top: 20px; padding: 20px 0 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.25); } .tariffLayout { width: calc(100% - 32px); } }
@media (max-width: 680px) { #nav { height: auto; min-height: 88px; padding: 7px 12px; gap: 8px; } #logo { width: 76px; height: 76px; } #nav ul { flex-wrap: wrap; justify-content: flex-end; column-gap: 12px; row-gap: 2px; } #nav ul li { font-size: 1rem; } .presentationPic { min-height: 520px; height: auto; padding: 75px 0; } .heroContent { width: calc(100% - 36px); } .documentsInner, .priceGrid { grid-template-columns: 1fr; } .documentsList { grid-template-columns: 1fr 1fr; } #carouselWrapper #carCarousel { height: 540px; } #carouselWrapper .slides { height: 520px; } #carouselWrapper .carImg { height: 285px; } }
@media (max-width: 380px) { #nav ul li { font-size: .9rem; } #carouselWrapper #carCarousel { height: 525px; } #carouselWrapper .slides { height: 505px; } #carouselWrapper .carImg { height: 240px; } #carouselWrapper .descriereCar { padding-left: 15px; padding-right: 15px; } }
@media (max-width: 480px) { .containerOferim, .documentsList { grid-template-columns: 1fr; } #bigContainerOferim { margin: 48px auto; } .heroActions { flex-direction: column; align-items: stretch; } .pageBanner { min-height: 130px; padding: 22px 16px; } .pageBanner h1 { padding-left: 12px; } #carouselWrapper #carCarousel { width: calc(100% - 32px); } footer { font-size: .9rem; overflow-wrap: anywhere; } }