:root { --ink: #0d1b2a; --slate: #183247; --orange: #f5a623; --paper: #f4f1ea; --line: rgba(13, 27, 42, .18); }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: Arial, Helvetica, sans-serif; }
main { max-width: 1440px; margin: 0 auto; }
.hero { min-height: 690px; padding: 34px clamp(24px, 6vw, 92px) 42px; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; color: white; background: radial-gradient(circle at 88% 100%, #31546c 0, transparent 27%), linear-gradient(125deg, #0a1521 0%, #0d1b2a 55%, #183247 100%); }
.hero::after { content: ""; position: absolute; width: 64vw; height: 64vw; max-width: 870px; max-height: 870px; right: -25vw; top: -23vw; border: 1px solid rgba(245,166,35,.38); border-radius: 50%; box-shadow: 0 0 0 28px rgba(245,166,35,.05), 0 0 0 56px rgba(245,166,35,.035); }
.hero__topline, .hero__content, .hero__note { position: relative; z-index: 1; }
.hero__topline { display: flex; justify-content: space-between; align-items: center; letter-spacing: .09em; text-transform: uppercase; font-size: .82rem; font-weight: 700; }
.hero__topline p { margin: 0; color: #cbd7df; }
.brand { display: block; width: clamp(260px, 34vw, 430px); line-height: 0; text-decoration: none; filter: drop-shadow(0 4px 8px rgba(0,0,0,.25)); }
.brand img { width: 100%; height: auto; }
.hero__content { margin: 72px 0; max-width: 760px; }
.eyebrow { color: var(--orange); letter-spacing: .15em; font-weight: 700; font-size: .75rem; margin: 0 0 20px; }
h1, h2 { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; letter-spacing: -.045em; margin: 0; line-height: .96; }
h1 { font-size: clamp(3.8rem, 9vw, 8.5rem); } h1 em { color: var(--orange); font-weight: 400; }
.intro { max-width: 510px; margin: 34px 0; color: #dae2e7; font-size: 1.12rem; line-height: 1.6; }
.call { display: inline-flex; align-items: center; gap: 22px; border-bottom: 2px solid var(--orange); padding: 0 0 10px; color: white; text-decoration: none; font-size: 1.1rem; font-weight: 700; }.call span { color: var(--orange); font-size: 1.5rem; }
.hero__note { display: flex; align-items: center; gap: 9px; color: #cbd7df; font-size: .88rem; text-decoration: none; }.hero__note span { width: 9px; height: 9px; border-radius: 50%; background: var(--orange); }
.showcase { padding: clamp(60px, 8vw, 110px) clamp(24px, 6vw, 92px); }.section-heading { margin-bottom: 35px; }.section-heading h2 { font-size: clamp(3.1rem, 6vw, 5.8rem); }
.slider { position: relative; }.slider__viewport { position: relative; aspect-ratio: 16 / 9; min-height: 340px; overflow: hidden; background: var(--ink); }.slide { display: none; position: absolute; inset: 0; margin: 0; }.slide.is-active { display: block; animation: slide-in .45s ease both; }.slide img { width: 100%; height: 100%; display: block; object-fit: cover; }.slide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.72), transparent 53%); }.slide figcaption { position: absolute; z-index: 1; left: clamp(22px, 4vw, 54px); bottom: clamp(24px, 4vw, 50px); color: white; text-shadow: 0 1px 10px #000; }.slide figcaption strong { display: block; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(1.8rem, 4vw, 3.5rem); font-weight: 400; letter-spacing: -.04em; }.slide figcaption span { display: block; margin-top: 8px; font-size: 1rem; }@keyframes slide-in { from { opacity: .2; transform: scale(1.015); } to { opacity: 1; transform: scale(1); } }
.slider__controls { display: flex; justify-content: center; align-items: center; gap: 18px; margin-top: 21px; }.slider__button { width: 46px; height: 46px; border: 1px solid var(--ink); background: transparent; color: var(--ink); cursor: pointer; font-size: 1.35rem; }.slider__button:hover, .slider__button:focus-visible { background: var(--ink); color: white; }.slider__dots { display: flex; gap: 9px; }.slider__dot { width: 10px; height: 10px; padding: 0; border: 0; border-radius: 50%; background: #a4a6a3; cursor: pointer; }.slider__dot[aria-selected="true"] { background: var(--orange); transform: scale(1.3); }
.contact { padding: clamp(60px, 9vw, 130px) clamp(24px, 6vw, 92px); display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(50px, 8vw, 120px); }.contact h2 { font-size: clamp(3.1rem, 6vw, 5.8rem); }.contact__right { display: grid; gap: 48px; }.contact address { display: grid; gap: 18px; font-style: normal; }.contact a { color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--line); padding-bottom: 18px; font-size: 1.08rem; line-height: 1.5; }.contact a:first-child { color: var(--slate); font-size: clamp(1.8rem, 3vw, 3rem); font-weight: 700; }.contact a span { color: #c07500; }
.contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }.contact-form label { display: grid; gap: 8px; color: var(--slate); font-size: .88rem; font-weight: 700; }.contact-form label:nth-of-type(3), .contact-form label:nth-of-type(4), .contact-form button, .form-status { grid-column: 1 / -1; }.contact-form label span { color: #69757d; font-weight: 400; }.contact-form input, .contact-form textarea { width: 100%; border: 1px solid #b7bbb8; border-radius: 0; background: #fbfaf6; color: var(--ink); padding: 13px; font: inherit; font-size: 1rem; }.contact-form textarea { resize: vertical; }.contact-form input:focus, .contact-form textarea:focus { outline: 2px solid var(--orange); outline-offset: 1px; }.contact-form button { border: 0; background: var(--ink); color: white; padding: 16px 18px; cursor: pointer; font: inherit; font-weight: 700; text-align: left; }.contact-form button:hover, .contact-form button:focus-visible { background: var(--slate); }.contact-form button span { color: var(--orange); float: right; font-size: 1.3rem; }.form-status { margin: 0; color: #126239; font-weight: 700; }.website-field { position: absolute; left: -10000px; }
.map { height: min(58vw, 560px); min-height: 360px; background: var(--slate); }.map iframe { width: 100%; height: 100%; border: 0; display: block; }
footer { max-width: 1440px; margin: 0 auto; padding: 24px clamp(24px, 6vw, 92px); border-top: 1px solid var(--line); font-size: .75rem; color: #5e6a72; letter-spacing: .08em; text-transform: uppercase; }
@media (max-width: 720px) { .hero { min-height: 640px; }.hero__topline p { display: none; }.hero__content { margin: 56px 0; }.brand { width: min(78vw, 360px); }.slider__viewport { aspect-ratio: 4 / 3; min-height: 280px; }.contact { grid-template-columns: 1fr; gap: 45px; }.contact address { gap: 13px; }.contact-form { grid-template-columns: 1fr; }.contact-form label { grid-column: 1 / -1; }.map { min-height: 330px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.slide.is-active { animation: none; } }

/* Modern visual system */
:root { --ink: #172535; --slate: #102746; --orange: #ffca0a; --paper: #f4f6f8; --line: #dbe1e8; }
body { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.hero { min-height: 720px; background: #102746; isolation: isolate; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .16; background-image: linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(to bottom, black, transparent 85%); }
.hero::after { width: min(62vw, 770px); aspect-ratio: 1; height: auto; right: -13vw; bottom: -42vw; background: var(--orange); opacity: .96; }
.hero__topline p { padding: 10px 14px; border: 1px solid rgba(255,255,255,.25); border-radius: 99px; color: rgba(255,255,255,.9); font-size: .77rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.brand { width: clamp(275px, 34vw, 455px); padding: 10px 14px; background: white; border-radius: 8px; box-shadow: 0 12px 35px rgba(0,0,0,.15); }
h1, h2 { font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-weight: 850; letter-spacing: -.065em; line-height: .94; } h1 { max-width: 710px; font-size: clamp(3.6rem, 8.5vw, 7.7rem); } h1 em { color: var(--orange); font-style: normal; }
.call { padding: 15px 20px; border-radius: 6px; background: var(--orange); color: #102746; font-weight: 900; }.call:hover { background: #ffe061; transform: translateY(-1px); }
.hero__note { color: white; font-weight: 700; }.hero__note span { background: var(--orange); box-shadow: 0 0 0 5px rgba(255,202,10,.2); }
.showcase { padding: clamp(68px, 9vw, 130px) clamp(24px, 6vw, 96px); background: white; }.section-heading { display: flex; align-items: end; justify-content: space-between; }.section-heading h2, .contact h2 { color: #102746; font-size: clamp(2.7rem, 5.5vw, 5.5rem); }
.slider { padding: 12px; border: 1px solid var(--line); border-radius: 18px; background: white; box-shadow: 0 22px 50px rgba(16,39,70,.08); }.slider__viewport { min-height: 380px; aspect-ratio: 16 / 8; border-radius: 10px; }.slide.is-active { animation: modern-slide-in .4s ease both; }.slide::after { background: linear-gradient(90deg, rgba(5,18,34,.8) 0%, rgba(5,18,34,.25) 54%, transparent 80%); }.slide figcaption { left: clamp(24px, 5vw, 64px); bottom: clamp(24px, 5vw, 58px); max-width: 440px; }.slide figcaption strong { font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: clamp(1.85rem, 4.2vw, 3.75rem); font-weight: 850; letter-spacing: -.055em; }.slide figcaption span { margin-top: 13px; color: #dce5ee; font-size: 1.03rem; }.slider__controls { justify-content: space-between; padding: 14px 4px 2px; }.slider__button { width: 48px; height: 48px; border: 1px solid var(--line); border-radius: 50%; background: white; color: #102746; }.slider__button:hover, .slider__button:focus-visible { border-color: #102746; background: #102746; color: white; }.slider__dot[aria-selected="true"] { width: 32px; border-radius: 99px; background: var(--orange); }@keyframes modern-slide-in { from { opacity: .25; transform: scale(1.018); } to { opacity: 1; transform: scale(1); } }
.contact { grid-template-columns: .78fr 1.22fr; background: #f4f6f8; }.contact__right { gap: 40px; }.contact address { display: flex; flex-wrap: wrap; gap: 10px 28px; }.contact a { color: #102746; font-weight: 700; }.contact a:first-child { letter-spacing: -.05em; }.contact a:last-child { width: 100%; color: #647386; font-weight: 500; }.contact-form { padding: clamp(20px, 3vw, 34px); border: 1px solid var(--line); border-radius: 14px; background: white; }.contact-form input, .contact-form textarea { border-color: var(--line); border-radius: 5px; background: #fbfcfd; }.contact-form button { border-radius: 5px; background: #102746; font-weight: 850; }.contact-form button:hover, .contact-form button:focus-visible { background: #1b3c65; }.contact-form button span { color: var(--orange); }.map iframe { filter: saturate(.84) contrast(1.05); }footer { background: #102746; color: #b9c6d4; font-weight: 700; }
@media (max-width: 720px) { .hero { min-height: 670px; }.hero::after { width: 120vw; right: -45vw; bottom: -35vw; }.hero__topline p { display: none; }.brand { width: min(84vw, 385px); }.section-heading { display: block; }.slider { padding: 8px; border-radius: 13px; }.slider__viewport { min-height: 300px; aspect-ratio: 4 / 3; }.slide::after { background: linear-gradient(0deg, rgba(5,18,34,.78), transparent 68%); }.contact { grid-template-columns: 1fr; }.map { min-height: 330px; } }

/* Lighter, calmer surface treatment */
body { background: #fff; }.hero { min-height: 570px; color: #102746; background: #fff; border-bottom: 1px solid var(--line); }.hero::before, .hero::after { display: none; }.hero__topline p { border-color: var(--line); color: #647386; }.hero__content { margin: 45px 0; }.eyebrow { color: #b27e00; } h1 { max-width: 760px; color: #102746; font-size: clamp(3.25rem, 7.2vw, 6.6rem); } h1 em { color: #d69e00; }.intro { color: #647386; }.call { background: #102746; color: #fff; }.call:hover { background: #1b3c65; color: #fff; }.call span { color: var(--orange); }.hero__note { color: #647386; }.hero__note span { background: var(--orange); box-shadow: 0 0 0 5px rgba(255,202,10,.18); }.showcase { padding-top: clamp(55px, 7vw, 95px); }.slider { box-shadow: none; }.slide::after { background: linear-gradient(90deg, rgba(5,18,34,.56) 0%, rgba(5,18,34,.12) 54%, transparent 80%); }.contact { background: #fff; padding-top: clamp(60px, 7vw, 100px); padding-bottom: clamp(60px, 7vw, 100px); }.contact-form { box-shadow: none; }.map { height: min(44vw, 470px); min-height: 320px; }footer { background: #f4f6f8; color: #647386; }
@media (max-width: 720px) { .hero { min-height: 550px; }.hero__content { margin: 42px 0; }.slide::after { background: linear-gradient(0deg, rgba(5,18,34,.62), transparent 68%); } }

/* Compact typography and user-provided original PROMEX logo. */
.brand { width: min(52vw, 360px); display: block; }
.brand img { display: block; width: 100%; height: auto; }
.hero { min-height: 480px; padding-top: 24px; padding-bottom: 28px; }
.hero__content { margin: 28px 0; max-width: 600px; }
h1 { max-width: 620px; font-size: clamp(2.45rem, 5.2vw, 4.8rem); line-height: .98; }
.eyebrow { margin-bottom: 12px; font-size: .68rem; }
.intro { max-width: 530px; margin: 18px 0 22px; font-size: 1rem; line-height: 1.5; }
.call { gap: 14px; padding: 10px 14px; border-bottom: 0; border-radius: 7px; font-size: .98rem; }
.call span { font-size: 1.1rem; }
.hero__note { font-size: .8rem; }
.showcase { padding-top: clamp(42px, 6vw, 72px); padding-bottom: clamp(48px, 6vw, 80px); }
.section-heading { margin-bottom: 22px; }
.section-heading h2, .contact h2 { font-size: clamp(2.05rem, 4.2vw, 3.8rem); line-height: 1; }
.slider__viewport { min-height: 320px; }
.slide figcaption strong { font-size: clamp(1.45rem, 3.3vw, 2.65rem); }
.slide figcaption span { margin-top: 7px; font-size: .92rem; }
.slider__controls { margin-top: 12px; padding-top: 8px; }
.contact { gap: clamp(35px, 5vw, 72px); padding-top: clamp(48px, 6vw, 80px); padding-bottom: clamp(48px, 6vw, 80px); }
.contact__right { gap: 30px; }
.contact address { gap: 10px; }
.contact a { padding-bottom: 10px; font-size: .98rem; }
.contact a:first-child { font-size: clamp(1.45rem, 2.4vw, 2.2rem); }
@media (max-width: 720px) { .brand { width: min(62vw, 310px); }.hero { min-height: 440px; }.hero__content { margin: 30px 0; }.hero__note { display: none; }.slider__viewport { min-height: 270px; } }

/* Final compact one-page order: brand, headline, carousel, contact, map. */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.hero { min-height: 0; display: block; padding: 24px clamp(24px, 6vw, 92px) 38px; }
.hero__topline { display: block; }
.brand { width: min(48vw, 340px); }
.hero__content { max-width: none; margin: 36px 0 0; }
.hero h1 { width: 100%; max-width: none; margin: 0; font-size: clamp(2.9rem, 8.6vw, 8rem); letter-spacing: -.075em; }
.showcase { padding: 0 clamp(24px, 6vw, 92px) clamp(48px, 6vw, 80px); }
.section-heading { display: none; }
.slider { padding: 10px; }
.contact { display: block; padding: clamp(48px, 6vw, 80px) clamp(24px, 6vw, 92px); border-top: 1px solid var(--line); }
.contact h2 { margin: 0 0 32px; font-size: clamp(2rem, 4.2vw, 3.5rem); }
.contact__right { display: grid; grid-template-columns: minmax(230px, .52fr) minmax(0, 1fr); column-gap: clamp(36px, 7vw, 112px); row-gap: 30px; }
.contact address { align-content: start; }
.contact-form { align-self: start; }
.contact .map { grid-column: 1 / -1; height: min(37vw, 390px); min-height: 285px; margin-top: 8px; border: 1px solid var(--line); }
.contact .map iframe { width: 100%; height: 100%; border: 0; display: block; }
@media (max-width: 720px) { .hero { padding-top: 20px; padding-bottom: 26px; }.brand { width: min(68vw, 320px); }.hero__content { margin-top: 25px; }.hero h1 { font-size: clamp(2.55rem, 12vw, 4.4rem); }.showcase { padding-left: 16px; padding-right: 16px; }.slider { border-radius: 0; border-left: 0; border-right: 0; }.contact { padding-top: 45px; }.contact__right { grid-template-columns: 1fr; }.contact .map { min-height: 270px; } }

/* Aligned compact contact grid: heading and details first, form and map side-by-side. */
.hero h1 { font-size: clamp(2.65rem, 6vw, 5.7rem); }
.brand { padding: 0; background: transparent; border-radius: 0; box-shadow: none; filter: none; }
.contact { display: block; }
.contact__heading { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(0, 1.1fr); gap: clamp(34px, 7vw, 110px); align-items: start; margin-bottom: 34px; }
.contact h2 { margin: 0; font-size: clamp(2rem, 3.7vw, 3.15rem); letter-spacing: -.055em; }
.contact address.contact__details { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; font-style: normal; }
.contact__details a { margin: 0; padding: 0 0 12px; border-bottom: 1px solid var(--line); color: #102746; font-size: 1rem; font-weight: 650; line-height: 1.4; }
.contact__details a:first-child { font-size: clamp(1.65rem, 2.7vw, 2.6rem); letter-spacing: -.05em; }
.contact__details a:last-child { color: #647386; font-weight: 500; }
.contact__content { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; gap: clamp(28px, 4vw, 64px); }
.contact .map { grid-column: auto; width: 100%; height: auto; min-height: 430px; margin: 0; }
@media (max-width: 720px) { .hero h1 { font-size: clamp(2.45rem, 10vw, 4.2rem); }.contact__heading, .contact__content { grid-template-columns: 1fr; gap: 24px; }.contact__heading { margin-bottom: 26px; }.contact__details { grid-template-columns: 1fr; }.contact__details a:last-child { grid-column: auto; }.contact .map { min-height: 290px; } }

/* Remove the empty vertical bands between logo, headline, carousel and contact. */
.hero { padding-top: 16px; padding-bottom: 14px; }
.brand { width: min(42vw, 300px); }
.hero__content { margin-top: 8px; }
.hero h1 { line-height: .92; }
.showcase { padding-top: 0; padding-bottom: 24px; }
.slider__controls { margin-top: 8px; padding-top: 4px; }
.contact { padding-top: 28px; padding-bottom: 48px; }
.contact__heading { margin-bottom: 22px; }
@media (max-width: 720px) { .hero { padding-top: 12px; padding-bottom: 10px; }.brand { width: min(60vw, 270px); }.hero__content { margin-top: 6px; }.showcase { padding-bottom: 18px; }.contact { padding-top: 25px; padding-bottom: 36px; } }

footer a { color: inherit; margin-left: 18px; }
.map { position: relative; background: #f4f6f8; }
.map__consent { min-height: inherit; height: 100%; display: grid; place-content: center; gap: 12px; padding: 26px; text-align: center; color: #647386; }
.map__consent p { margin: 0; }
.map__load, .cookie-banner button { border: 0; border-radius: 5px; background: #102746; color: #fff; padding: 11px 15px; font: inherit; font-weight: 700; cursor: pointer; }
.map__load { justify-self: center; }
.cookie-banner { position: fixed; z-index: 20; right: 22px; bottom: 22px; width: min(460px, calc(100% - 32px)); padding: 20px; border: 1px solid #d8dfe6; border-radius: 10px; background: #fff; box-shadow: 0 16px 44px rgba(16,39,70,.2); color: #102746; }
.cookie-banner p { margin: 0; font-size: .9rem; line-height: 1.5; }
.cookie-banner a { color: inherit; font-weight: 700; }
.cookie-banner__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.cookie-banner__secondary { color: #102746 !important; background: #f1f4f7 !important; }
@media (max-width: 720px) { .cookie-banner { right: 16px; bottom: 16px; padding: 16px; }.cookie-banner__actions { display: grid; grid-template-columns: 1fr; } footer a { display: inline-block; margin: 8px 0 0; } }

.policy { max-width: 850px; margin: 0 auto; padding: clamp(36px, 7vw, 90px) 24px; color: #102746; }
.policy h1 { max-width: none; margin: 20px 0 10px; font-size: clamp(2.3rem, 6vw, 4.4rem); }
.policy h2 { margin: 38px 0 12px; font-size: 1.45rem; }
.policy p { max-width: 760px; line-height: 1.65; }
.policy a { color: #102746; }
.policy__back { font-weight: 700; text-decoration: none; }
.policy__updated { color: #647386; font-size: .9rem; }
.policy table { width: 100%; margin: 18px 0; border-collapse: collapse; font-size: .92rem; }
.policy th, .policy td { padding: 12px; border: 1px solid #d8dfe6; text-align: left; vertical-align: top; }
.policy th { background: #f1f4f7; }
.policy code { font-size: .86em; overflow-wrap: anywhere; }
@media (max-width: 720px) { .policy table { display: block; overflow-x: auto; } }