* {
    box-sizing: border-box;
}
html {
    scroll-behavior: smooth;
}
body {
    margin: 0;
    font-family: "DM Sans", Arial, sans-serif;
    color: #10264b;
    background: #fff;
    line-height: 1.6;
}
a {
    text-decoration: none;
    color: inherit;
}
button {
    font: inherit;
}
.container {
    width: min(1180px, calc(100% - 40px));
    margin: auto;
}
.loader {
    position: fixed;
    inset: 0;
    background: #fff;
    z-index: 9999;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 14px;
    transition: 0.5s;
}
.loader-mark {
    font: 800 35px Manrope;
    color: #073b91;
    letter-spacing: -2px;
}
.loader-line {
    width: 90px;
    height: 2px;
    background: #e7edf7;
    overflow: hidden;
}
.loader-line i {
    display: block;
    width: 40%;
    height: 100%;
    background: #e5b900;
    animation: load 1s infinite;
}
@keyframes load {
    to {
        transform: translateX(250%);
    }
}
.navbar {
    height: 82px;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    right: 0;
    background: rgba(255, 255, 255, 0.91);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(6, 46, 103, 0.08);
    transition: 0.3s;
}
.navbar.scrolled {
    box-shadow: 0 12px 35px rgba(2, 28, 70, 0.12);
}
.nav-wrap {
    height: 100%;
    width: min(1370px, calc(100% - 36px));
    margin: auto;
    display: flex;
    align-items: center;
    gap: 24px;
}
.logo,
.partner {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: max-content;
}
.logo-symbol {
    height: 43px;
    width: 43px;
    border-radius: 13px;
    background: #073d96;
    color: #fff;
    display: grid;
    place-items: center;
    font: 800 25px Manrope;
    transform: skew(-7deg);
}
.logo b {
    font: 800 25px Manrope;
    letter-spacing: -1.5px;
    color: #0c0f15;
}
.logo small,
.partner small {
    display: block;
    font-size: 7px;
    line-height: 1.15;
    color: #66738a;
}
.nav-wrap nav {
    display: flex;
    align-items: center;
    gap: 23px;
    margin: auto;
    font-size: 12px;
    font-weight: 700;
    color: #344663;
}
.nav-wrap nav a {
    padding: 30px 0;
    position: relative;
}
.nav-wrap nav a:after {
    content: "";
    position: absolute;
    bottom: 21px;
    left: 0;
    width: 0;
    height: 2px;
    background: #e5b900;
    transition: 0.25s;
}
.nav-wrap nav a:hover:after {
    width: 100%;
}
.nav-actions {
    display: flex;
    gap: 6px;
}
.nav-btn {
    font-size: 10px;
    font-weight: 800;
    padding: 10px 12px;
    border-radius: 8px;
}
.nav-red {
    background: #df2727;
    color: #fff;
}
.nav-green {
    background: #12a957;
    color: #fff;
}
.nav-outline {
    border: 1px solid #d2dbea;
    color: #123d83;
    background: #fff;
}
.partner {
    border-left: 1px solid #dbe3ef;
    padding-left: 16px;
}
.partner-globe {
    width: 38px;
    height: 38px;
    border: 2px solid #0b449d;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #0b449d;
    font-size: 26px;
}
.partner b {
    font: 800 23px Manrope;
    color: #0a4297;
}
.hamb {
    display: none;
    background: none;
    border: 0;
    margin-left: auto;
}
.hamb i {
    display: block;
    width: 25px;
    height: 2px;
    background: #0a2149;
    margin: 5px;
}
.hero {
    margin-top: 82px;
    min-height: 720px;
    position: relative;
    overflow: hidden;
    color: #fff;
}
.hero-bg {
    position: absolute;
    inset: 0;
    background: url("/images/page_event/dpdsumsel/assets/background-header.png")
        center/cover;
}
.hero-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(1, 20, 57, 0.96),
        rgba(2, 35, 83, 0.72) 48%,
        rgba(3, 45, 106, 0.12)
    );
}
.hero-grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: 70px 70px;
    mask-image: linear-gradient(90deg, #000, transparent 80%);
}
.hero-content {
    min-height: 720px;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 2;
}
.hero-copy {
    max-width: 720px;
    padding-bottom: 30px;
}
.overline,
.kicker {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2px;
    color: #eac52a;
}
.overline {
    display: flex;
    align-items: center;
    gap: 10px;
}
.overline span {
    width: 32px;
    height: 2px;
    background: #eac52a;
}
.hero h1 {
    font: 800 clamp(48px, 6vw, 79px)/0.98 Manrope;
    letter-spacing: -4px;
    margin: 18px 0 20px;
}
.hero h1 span {
    color: #f3c92a;
}
.hero-sub {
    font-size: 17px;
    color: #d8e5fb;
    max-width: 650px;
}
.hero-chips {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin: 25px 0;
}
.hero-chips span {
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.07);
    padding: 8px 11px;
    border-radius: 7px;
    font-size: 9px;
    font-weight: 800;
}
.hero-buttons {
    display: flex;
    gap: 9px;
}
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 17px;
    padding: 14px 20px;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 800;
    transition: 0.25s;
}
.btn b {
    font-size: 17px;
}
.btn-red {
    background: #df2727;
    color: #fff;
    box-shadow: 0 12px 30px rgba(223, 39, 39, 0.25);
}
.btn-red:hover {
    transform: translateY(-3px);
    box-shadow: 0 17px 35px rgba(223, 39, 39, 0.35);
}
.btn-glass {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: #fff;
}
.btn-glass:hover {
    background: #fff;
    color: #073d96;
}
.seat {
    margin-top: 18px;
    font-size: 10px;
    color: #d9e6f9;
    display: flex;
    gap: 8px;
    align-items: center;
}
.seat i {
    width: 7px;
    height: 7px;
    background: #49df7f;
    border-radius: 50%;
    box-shadow: 0 0 0 5px rgba(73, 223, 127, 0.12);
}
.hero-corner {
    position: absolute;
    right: 30px;
    bottom: 28px;
    z-index: 3;
    font-size: 9px;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, 0.55);
}
.hero-corner span {
    color: #e8c329;
    margin: 0 8px;
}
.floating-info {
    position: relative;
    z-index: 10;
    margin-top: -48px;
}
.info-bar {
    background: #fff;
    border: 1px solid #e1e8f3;
    border-radius: 16px;
    box-shadow: 0 20px 55px rgba(4, 41, 93, 0.16);
    min-height: 96px;
    padding: 17px 22px;
    display: flex;
    align-items: center;
    gap: 22px;
}
.info-item small,
.price-mini small {
    display: block;
    font-size: 8px;
    letter-spacing: 1.2px;
    color: #8190a8;
    font-weight: 800;
}
.info-item b {
    font-size: 12px;
}
.divider {
    height: 42px;
    border-left: 1px solid #e3e9f2;
}
.price-mini {
    margin-left: auto;
}
.price-mini strong {
    font: 800 23px Manrope;
    color: #0a4297;
}
.mini-cta {
    background: #e5bb14;
    color: #112b5b;
    font-size: 10px;
    font-weight: 900;
    padding: 13px 17px;
    border-radius: 9px;
}
.section {
    padding: 105px 0;
}
.intro {
    padding-top: 95px;
}
.heading {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 48px;
}
.heading h2 {
    font: 800 clamp(32px, 4.5vw, 51px)/1.08 Manrope;
    letter-spacing: -2px;
    margin: 9px 0 12px;
}
.heading h2 em,
.package-copy h2 em,
.location-copy h2 em,
.city-inner h2 em,
.credibility h2 em,
.investment-inner h2 em,
.faq h2 em,
.final h2 em {
    font-style: normal;
    color: #0a50b4;
}
.heading p {
    font-size: 13px;
    color: #6c7890;
}
.feature-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border: 1px solid #e0e7f1;
    border-radius: 19px;
    overflow: hidden;
}
.feature-grid article {
    position: relative;
    padding: 31px 24px;
    border-right: 1px solid #e0e7f1;
    transition: 0.3s;
}
.feature-grid article:last-child {
    border: 0;
}
.feature-grid article:hover {
    background: #f7faff;
    transform: translateY(-3px);
}
.num {
    position: absolute;
    right: 20px;
    top: 18px;
    color: #bdc8da;
    font: 700 10px Manrope;
}
.feature-icon {
    width: 45px;
    height: 45px;
    background: #edf4ff;
    border-radius: 12px;
    display: grid;
    place-items: center;
    color: #0751b5;
    font-size: 20px;
    font-weight: 900;
}
.feature-grid h3 {
    font: 700 16px Manrope;
    margin: 22px 0 7px;
}
.feature-grid p {
    font-size: 10px;
    color: #6d7a91;
    margin: 0;
}
.dark {
    background: #041b45;
    color: #fff;
    position: relative;
    overflow: hidden;
}
.dark:after {
    content: "";
    position: absolute;
    width: 500px;
    height: 500px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 50%;
    right: -250px;
    top: -220px;
}
.heading.light h2 {
    color: #fff;
}
.heading.light p {
    color: #aebfdb;
}
.heading.light .kicker {
    color: #f1c72c;
}
.timeline {
    max-width: 900px;
    margin: auto;
}
.step {
    display: grid;
    grid-template-columns: 150px 60px 1fr;
    align-items: center;
    min-height: 150px;
}
.step-date {
    text-align: right;
    font: 800 20px Manrope;
    line-height: 1.1;
    color: #fff;
}
.step-date small {
    font-size: 9px;
    color: #a7badb;
    letter-spacing: 1px;
}
.step-line {
    height: 100%;
    position: relative;
    display: flex;
    justify-content: center;
}
.step-line:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    border-left: 1px dashed #6c83aa;
}
.step-line i {
    width: 17px;
    height: 17px;
    background: #0a5dcc;
    border: 4px solid #041b45;
    border-radius: 50%;
    position: relative;
    z-index: 2;
    margin-top: 58px;
    box-shadow: 0 0 0 1px #7290bd;
}
.step-line.gold i {
    background: #e9c126;
}
.step-line.red i {
    background: #df2727;
}
.step > div:last-child {
    padding-left: 15px;
}
.step span {
    font-size: 9px;
    letter-spacing: 1.7px;
    color: #e7c12a;
    font-weight: 900;
}
.step h3 {
    font: 700 20px Manrope;
    margin: 5px 0;
}
.step p {
    margin: 0;
    color: #9db1d2;
    font-size: 11px;
}
.package {
    background: #f6f9fd;
}
.package-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    align-items: stretch;
}
.package-copy {
    padding: 20px 15px;
}
.package-copy h2 {
    font: 800 clamp(38px, 4.5vw, 58px)/1.02 Manrope;
    letter-spacing: -2px;
    margin: 10px 0 15px;
}
.package-copy p {
    max-width: 500px;
    color: #69768e;
    font-size: 13px;
}
.package-price {
    margin: 25px 0;
    padding: 18px 20px;
    border-radius: 14px;
    background: linear-gradient(135deg, #fff7c9, #ffe25a);
    border: 1px solid #f0d354;
    max-width: 440px;
}
.package-price small,
.included-head span {
    font-size: 8px;
    letter-spacing: 1.4px;
    font-weight: 900;
    color: #75621a;
    display: block;
}
.package-price strong {
    display: block;
    font: 800 38px Manrope;
    color: #092f72;
    letter-spacing: -1px;
}
.package-price span {
    font-size: 9px;
    color: #5c5c45;
}
.included {
    background: #fff;
    border: 1px solid #dfe7f2;
    border-radius: 20px;
    padding: 31px;
    box-shadow: 0 15px 40px rgba(5, 42, 92, 0.07);
}
.included-head span {
    color: #0b56b8;
}
.included-head b {
    font: 800 25px Manrope;
    display: block;
    margin: 5px 0 20px;
}
.included ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px;
}
.included li {
    font-size: 11px;
    display: flex;
    gap: 8px;
}
.included li b {
    color: #16a158;
}
.promo {
    margin-top: 24px;
    background: #fff2f2;
    border: 1px solid #ffd6d6;
    border-radius: 11px;
    padding: 13px;
}
.promo strong {
    display: block;
    color: #df2727;
    font-size: 10px;
}
.promo span {
    font-size: 9px;
    color: #727987;
}
.location {
    padding: 0;
    background: #fff;
}
.location-grid {
    display: grid;
    grid-template-columns: 1.25fr 0.75fr;
    min-height: 510px;
}
.hotel-photo {
    position: relative;
    min-height: 510px;
    overflow: hidden;
}
.hotel-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.hotel-photo:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(3, 26, 67, 0.02),
        rgba(3, 26, 67, 0.3)
    );
}
.hotel-photo > span {
    position: absolute;
    z-index: 2;
    left: 30px;
    top: 30px;
    background: #fff;
    color: #123e81;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1.3px;
}
.location-copy {
    padding: 80px 55px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.location-copy h2 {
    font: 800 clamp(38px, 4.5vw, 55px)/1.03 Manrope;
    letter-spacing: -2px;
    margin: 10px 0;
}
.location-copy > p {
    font-size: 13px;
    color: #68768e;
}
.map {
    margin-top: 22px;
    background: #0756b8;
    color: #fff;
    padding: 14px 16px;
    border-radius: 9px;
    font-size: 10px;
    font-weight: 800;
    display: flex;
    justify-content: space-between;
}
.location-copy small {
    font-size: 8px;
    color: #909caf;
    margin-top: 12px;
}
.facilities {
    background: #fff;
}
.facility-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
.facility-grid > div {
    border: 1px solid #e0e7f0;
    border-radius: 16px;
    padding: 26px;
    min-height: 150px;
    transition: 0.25s;
}
.facility-grid > div:hover {
    border-color: #a9c4e9;
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(4, 48, 101, 0.07);
}
.facility-grid span {
    font-size: 9px;
    color: #e1b900;
    font-weight: 900;
}
.facility-grid h3 {
    font: 700 17px Manrope;
    margin: 16px 0 5px;
}
.facility-grid p {
    font-size: 10px;
    color: #748198;
    margin: 0;
}
.city-cta,
.investment {
    position: relative;
    overflow: hidden;
    color: #fff;
}
.city-cta {
    min-height: 500px;
}
.city-bg {
    position: absolute;
    inset: 0;
    background: url("/images/page_event/dpdsumsel/assets/background-jembatan.png")
        center/cover;
}
.city-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(2, 24, 60, 0.93),
        rgba(2, 40, 94, 0.52),
        rgba(2, 28, 66, 0.15)
    );
}
.city-inner {
    min-height: 500px;
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}
.city-inner h2,
.investment-inner h2 {
    font: 800 clamp(38px, 5vw, 61px)/1.03 Manrope;
    letter-spacing: -2.5px;
    margin: 11px 0;
}
.city-inner p,
.investment-inner p {
    font-size: 14px;
    color: #d0ddf3;
}
.limited-card {
    background: #f1c52a;
    color: #082d6c;
    border-radius: 20px;
    padding: 28px 31px;
    min-width: 290px;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.2);
    transform: rotate(-1deg);
}
.limited-card span {
    font-size: 25px;
}
.limited-card small {
    display: block;
    font-size: 8px;
    letter-spacing: 1.4px;
    font-weight: 900;
}
.limited-card b {
    display: block;
    font: 800 23px Manrope;
    margin: 5px 0 18px;
}
.limited-card a {
    display: block;
    background: #062a68;
    color: #fff;
    padding: 12px;
    border-radius: 8px;
    text-align: center;
    font-size: 10px;
    font-weight: 900;
}
.credibility {
    background: #f5f8fc;
}
.credibility-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 70px;
    align-items: center;
}
.credibility h2 {
    font: 800 clamp(35px, 4.2vw, 52px)/1.06 Manrope;
    letter-spacing: -2px;
    margin: 12px 0;
}
.credibility p {
    font-size: 13px;
    color: #6e7a90;
}
.count-card {
    background: #06295f;
    color: #fff;
    border-radius: 19px;
    padding: 31px;
    text-align: center;
    box-shadow: 0 20px 50px rgba(2, 34, 78, 0.17);
}
.count-card > small {
    font-size: 8px;
    letter-spacing: 2px;
    color: #9db5da;
    font-weight: 900;
}
.countdown {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 11px;
    margin: 23px 0;
}
.countdown div {
    min-width: 65px;
}
.countdown b {
    display: block;
    font: 800 33px Manrope;
    color: #f0c62b;
}
.countdown span {
    font-size: 7px;
    letter-spacing: 1px;
    color: #a7bada;
}
.countdown i {
    font-style: normal;
    color: #7791b8;
    font-size: 22px;
}
.count-card p {
    font-size: 9px;
    color: #9eb1ce;
    margin: 0;
}
.investment {
    min-height: 390px;
}
.investment-bg {
    position: absolute;
    inset: 0;
    background: url("/images/page_event/dpdsumsel/assets/background-investasi.png")
        center/cover;
}
.investment-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(1, 20, 54, 0.95),
        rgba(3, 46, 107, 0.67),
        rgba(1, 24, 61, 0.32)
    );
}
.investment-inner {
    position: relative;
    z-index: 2;
    min-height: 390px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}
.investment-right {
    display: flex;
    align-items: center;
    gap: 15px;
}
.investment-right > strong {
    font: 800 27px Manrope;
    color: #f2c72a;
}
.faq {
    background: #fff;
}
.faq-grid {
    display: grid;
    grid-template-columns: 0.75fr 1.25fr;
    gap: 80px;
}
.heading.left {
    text-align: left;
    margin: 0;
}
.faq-list {
    display: grid;
    gap: 8px;
}
.faq-list details {
    border: 1px solid #dfe6f0;
    border-radius: 11px;
    padding: 0 18px;
    background: #fff;
}
.faq-list summary {
    list-style: none;
    cursor: pointer;
    padding: 17px 25px 17px 0;
    font-size: 12px;
    font-weight: 800;
    position: relative;
}
.faq-list summary::-webkit-details-marker {
    display: none;
}
.faq-list summary:after {
    content: "+";
    position: absolute;
    right: 0;
    color: #0756b8;
    font-size: 17px;
}
.faq-list details[open] summary:after {
    content: "−";
}
.faq-list p {
    font-size: 10px;
    color: #6e7b91;
    padding: 0 0 16px;
    margin: 0;
}
.final {
    background: #05265a;
    color: #fff;
    text-align: center;
    padding: 100px 0;
    position: relative;
    overflow: hidden;
}
.final:before {
    content: "";
    position: absolute;
    width: 700px;
    height: 700px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 50%;
    left: -350px;
    top: -400px;
}
.final-inner {
    position: relative;
}
.final h2 {
    font: 800 clamp(38px, 5vw, 60px)/1.04 Manrope;
    letter-spacing: -2.5px;
    margin: 10px 0;
}
.final h2 em {
    color: #f2c72a;
}
.final p {
    font-size: 12px;
    color: #b9cae4;
    margin-bottom: 24px;
}
.final-inner > div {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}
.btn-white {
    background: #fff;
    color: #082e6b;
}
.btn-line-white {
    border: 1px solid rgba(255, 255, 255, 0.4);
    color: #fff;
}
.footer {
    background: #021735;
    color: #a8b9d2;
    padding-top: 55px;
}
.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1.3fr;
    gap: 35px;
    padding-bottom: 45px;
}
.footer-iapi {
    font: 800 39px Manrope;
    color: #fff;
    letter-spacing: -2px;
}
.footer-brand p {
    font-size: 10px;
    line-height: 1.3;
    color: #fff;
}
.footer-brand > span {
    font-size: 8px;
}
.footer-grid > div:not(:first-child) > b {
    font-size: 9px;
    color: #fff;
    letter-spacing: 1.5px;
}
.footer-grid a {
    display: block;
    font-size: 9px;
    margin: 10px 0;
}
.copyright {
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    padding: 16px 0;
    text-align: center;
    font-size: 8px;
}
.top {
    position: fixed;
    z-index: 80;
    right: 18px;
    bottom: 18px;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 50%;
    background: #0756b8;
    color: #fff;
    font-size: 18px;
    opacity: 0;
    visibility: hidden;
    transition: 0.25s;
    cursor: pointer;
    box-shadow: 0 10px 25px rgba(0, 61, 142, 0.3);
}
.top.show {
    opacity: 1;
    visibility: visible;
}
.reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: 0.7s;
}
.reveal.show {
    opacity: 1;
    transform: none;
}
@media (max-width: 1180px) {
    .nav-wrap nav {
        gap: 14px;
    }
    .nav-actions {
        display: none;
    }
    .partner {
        display: none;
    }
    .feature-grid {
        grid-template-columns: 1fr 1fr;
    }
    .feature-grid article:nth-child(2) {
        border-right: 0;
    }
    .feature-grid article:nth-child(-n + 2) {
        border-bottom: 1px solid #e0e7f1;
    }
}
@media (max-width: 850px) {
    .navbar {
        height: 70px;
    }
    .nav-wrap nav {
        display: none;
        position: absolute;
        left: 12px;
        right: 12px;
        top: 70px;
        background: #fff;
        box-shadow: 0 20px 35px rgba(2, 29, 67, 0.13);
        border-radius: 0 0 15px 15px;
        padding: 7px 17px;
        flex-direction: column;
        gap: 0;
        align-items: stretch;
    }
    .nav-wrap nav.open {
        display: flex;
    }
    .nav-wrap nav a {
        padding: 13px 2px;
        border-bottom: 1px solid #edf1f6;
    }
    .nav-wrap nav a:after {
        display: none;
    }
    .hamb {
        display: block;
    }
    .hero {
        margin-top: 70px;
    }
    .hero,
    .hero-content {
        min-height: 700px;
    }
    .hero h1 {
        font-size: 53px;
    }
    .info-bar {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 15px;
    }
    .divider {
        display: none;
    }
    .price-mini {
        margin: 0;
    }
    .mini-cta {
        text-align: center;
    }
    .package-grid,
    .credibility-grid,
    .faq-grid {
        grid-template-columns: 1fr;
    }
    .location-grid {
        grid-template-columns: 1fr;
    }
    .hotel-photo {
        min-height: 370px;
    }
    .location-copy {
        padding: 65px 25px;
    }
    .city-inner,
    .investment-inner {
        padding-top: 65px;
        padding-bottom: 65px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
    }
    .city-cta {
        min-height: 600px;
    }
    .city-inner {
        min-height: 600px;
    }
    .investment {
        min-height: 500px;
    }
    .investment-inner {
        min-height: 500px;
    }
    .investment-right {
        flex-wrap: wrap;
    }
    .faq-grid {
        gap: 35px;
    }
    .footer-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 560px) {
    .container {
        width: calc(100% - 28px);
    }
    .logo small {
        display: none;
    }
    .logo-symbol {
        width: 39px;
        height: 39px;
    }
    .logo b {
        font-size: 22px;
    }
    .hero,
    .hero-content {
        min-height: 760px;
    }
    .hero-content {
        align-items: flex-end;
        padding-bottom: 80px;
    }
    .hero h1 {
        font-size: 42px;
        letter-spacing: -2px;
    }
    .hero-sub {
        font-size: 13px;
    }
    .hero-buttons {
        flex-direction: column;
    }
    .hero-buttons .btn {
        width: 100%;
    }
    .floating-info {
        margin-top: -28px;
    }
    .info-bar {
        grid-template-columns: 1fr;
    }
    .mini-cta {
        width: 100%;
    }
    .feature-grid {
        grid-template-columns: 1fr;
    }
    .feature-grid article {
        border-right: 0 !important;
        border-bottom: 1px solid #e0e7f1;
    }
    .feature-grid article:last-child {
        border-bottom: 0;
    }
    .section {
        padding: 72px 0;
    }
    .step {
        grid-template-columns: 80px 42px 1fr;
        min-height: 145px;
    }
    .step-date {
        font-size: 13px;
    }
    .step h3 {
        font-size: 15px;
    }
    .step p {
        font-size: 9px;
    }
    .package-copy {
        padding: 0;
    }
    .package-price strong {
        font-size: 31px;
    }
    .included {
        padding: 23px;
    }
    .included ul {
        grid-template-columns: 1fr;
    }
    .facility-grid {
        grid-template-columns: 1fr;
    }
    .hotel-photo {
        min-height: 280px;
    }
    .location-copy h2 {
        font-size: 42px;
    }
    .limited-card {
        width: 100%;
        min-width: 0;
    }
    .credibility-grid {
        gap: 30px;
    }
    .countdown {
        gap: 5px;
    }
    .countdown div {
        min-width: 55px;
    }
    .countdown b {
        font-size: 25px;
    }
    .investment-inner h2 {
        font-size: 42px;
    }
    .investment-right {
        width: 100%;
    }
    .investment-right .btn {
        flex: 1;
    }
    .faq-grid {
        gap: 28px;
    }
    .final {
        padding: 75px 0;
    }
    .final h2 {
        font-size: 39px;
    }
    .footer-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }
}

/* === OFFICIAL BRAND LOGOS === */
.logo.logo-iapi {
    display: flex;
    align-items: center;
    width: 215px;
    height: 62px;
    flex: 0 0 215px;
}
.logo.logo-iapi img {
    display: block;
    width: 205px;
    height: 58px;
    object-fit: contain;
    object-position: left center;
}
.partner {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 190px;
    height: 62px;
    padding: 0 0 0 18px;
    margin-left: 2px;
    border-left: 1px solid #dbe3ef;
    flex: 0 0 190px;
}
.partner img {
    display: block;
    width: 172px;
    height: 58px;
    object-fit: contain;
    object-position: center;
}
@media (max-width: 1180px) {
    .logo.logo-iapi {
        width: 180px;
        flex-basis: 180px;
    }
    .logo.logo-iapi img {
        width: 175px;
    }
    .partner {
        width: 155px;
        flex-basis: 155px;
        padding-left: 12px;
    }
    .partner img {
        width: 145px;
    }
}
@media (max-width: 850px) {
    .logo.logo-iapi {
        width: 165px;
        height: 55px;
        flex-basis: 165px;
    }
    .logo.logo-iapi img {
        width: 160px;
        height: 52px;
    }
    .partner {
        display: none;
    }
}
@media (max-width: 560px) {
    .logo.logo-iapi {
        width: 145px;
        flex-basis: 145px;
    }
    .logo.logo-iapi img {
        width: 140px;
        height: 49px;
    }
}

/* =========================================================
   PREMIUM V3 — Corporate Blue / Executive Certification
   Added after the original stylesheet so existing sections
   remain intact while the visual system is upgraded.
   ========================================================= */

:root {
    --brand-blue: #073b8f;
    --brand-blue-2: #0a57b8;
    --brand-blue-3: #0e73d8;
    --brand-deep: #031b43;
    --brand-ink: #0a1f44;
    --brand-soft: #f3f7fc;
    --brand-line: #dce6f2;
    --brand-gold: #ddba28;
    --brand-red: #d9282e;
    --brand-green: #12a55a;
    --shadow-premium: 0 24px 70px rgba(3, 34, 78, 0.13);
}

body {
    color: var(--brand-ink);
    background: #fff;
    overflow-x: hidden;
}

::selection {
    background: rgba(10, 87, 184, 0.18);
    color: var(--brand-deep);
}

.navbar {
    height: 88px;
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid rgba(7, 59, 143, 0.09);
    box-shadow: 0 6px 28px rgba(3, 27, 67, 0.06);
}

.nav-wrap {
    width: min(1440px, calc(100% - 52px));
    gap: 20px;
}

.logo.logo-iapi {
    width: 225px;
    flex: 0 0 225px;
    height: 68px;
}

.logo.logo-iapi img {
    width: 214px;
    height: 62px;
    object-fit: contain;
    object-position: left center;
}

.nav-wrap nav {
    gap: 4px;
    justify-content: center;
}

.nav-wrap nav a {
    padding: 13px 13px;
    border-radius: 8px;
    font-size: 11px;
    color: #304766;
    transition: 0.25s ease;
}

.nav-wrap nav a:hover {
    color: var(--brand-blue);
    background: #f1f6fd;
}

.nav-wrap nav a:after {
    display: none;
}

.nav-actions {
    gap: 7px;
    margin-left: auto;
}

.nav-btn {
    padding: 10px 13px;
    border-radius: 8px;
    border: 1px solid transparent;
    white-space: nowrap;
    transition: 0.25s ease;
}

.nav-btn:hover {
    transform: translateY(-2px);
}

.nav-red {
    background: linear-gradient(135deg, #d9282e, #b91e25);
    box-shadow: 0 8px 20px rgba(217, 40, 46, 0.18);
}

.nav-green {
    background: linear-gradient(135deg, #12a55a, #0d8c4b);
    box-shadow: 0 8px 20px rgba(18, 165, 90, 0.15);
}

.nav-outline {
    border-color: #cfdae9;
    color: #123e81;
}

.partner {
    width: 178px;
    flex: 0 0 178px;
    height: 54px;
    padding-left: 14px;
    border-left: 1px solid #dce5f0;
}

.partner img {
    width: 165px;
    height: 52px;
    object-fit: contain;
}

.hero {
    margin-top: 88px;
    min-height: 750px;
}

.hero-bg {
    transform: scale(1.02);
    filter: saturate(0.92) contrast(1.04);
}

.hero-shade {
    background:
        radial-gradient(
            circle at 78% 32%,
            rgba(25, 115, 220, 0.28),
            transparent 27%
        ),
        linear-gradient(
            90deg,
            rgba(2, 20, 55, 0.97) 0%,
            rgba(3, 37, 87, 0.88) 42%,
            rgba(5, 57, 120, 0.45) 70%,
            rgba(3, 29, 70, 0.12) 100%
        );
}

.hero-grid {
    opacity: 0.55;
}

.hero-content {
    min-height: 750px;
}

.hero-copy {
    max-width: 760px;
    padding-bottom: 40px;
}

.hero-badge {
    width: max-content;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    margin-bottom: 14px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(12px);
    border-radius: 999px;
    color: #f4d85a;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.4px;
}

.hero-badge .pulse {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #4be58a;
    box-shadow: 0 0 0 5px rgba(75, 229, 138, 0.12);
}

.overline {
    color: #f0cd3a;
    letter-spacing: 2.4px;
}

.hero h1 {
    font-size: clamp(50px, 6.2vw, 84px);
    line-height: 0.98;
    letter-spacing: -4.5px;
    margin: 15px 0 23px;
    text-shadow: 0 8px 40px rgba(0, 0, 0, 0.16);
}

.hero h1 span {
    color: #f2cf36;
}

.hero-sub {
    font-size: 17px;
    line-height: 1.7;
    color: #ddeaff;
    max-width: 690px;
}

.hero-trust {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 17px 0 24px;
    color: #bfd2ef;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.4px;
}

.hero-trust span {
    color: #5be28c;
}

.hero-buttons .btn {
    min-height: 49px;
    padding: 14px 22px;
}

.btn-red {
    background: linear-gradient(135deg, #e03236, #c51e27);
}

.btn-glass {
    background: rgba(255, 255, 255, 0.09);
    border-color: rgba(255, 255, 255, 0.28);
    backdrop-filter: blur(10px);
}

.seat {
    color: #c9d9ee;
}

.floating-info {
    margin-top: -54px;
}

.info-bar {
    border-radius: 18px;
    min-height: 105px;
    padding: 19px 24px;
    box-shadow: var(--shadow-premium);
}

.info-item b {
    color: #15355f;
}

.price-mini strong {
    color: var(--brand-blue);
}

.mini-cta {
    background: linear-gradient(135deg, #f1ce37, #ddb31a);
    box-shadow: 0 9px 22px rgba(221, 179, 26, 0.2);
}

.section {
    padding: 115px 0;
}

.heading {
    max-width: 800px;
    margin-bottom: 55px;
}

.heading h2 {
    color: #071e43;
}

.heading h2 em,
.package-copy h2 em,
.location-copy h2 em,
.city-inner h2 em,
.credibility h2 em,
.investment-inner h2 em,
.faq h2 em,
.final h2 em {
    color: var(--brand-blue-2);
}

.feature-grid {
    border: 0;
    gap: 13px;
    overflow: visible;
}

.feature-grid article {
    border: 1px solid var(--brand-line) !important;
    border-radius: 18px;
    background: #fff;
    min-height: 225px;
    box-shadow: 0 12px 35px rgba(3, 39, 84, 0.045);
    overflow: hidden;
}

.feature-grid article:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, var(--brand-blue), #67a9ee);
    transform: scaleX(0);
    transform-origin: left;
    transition: 0.3s;
}

.feature-grid article:hover {
    background: #fff;
    transform: translateY(-7px);
    box-shadow: 0 25px 50px rgba(3, 39, 84, 0.1);
}

.feature-grid article:hover:before {
    transform: scaleX(1);
}

.feature-icon {
    background: #edf5ff;
    color: var(--brand-blue);
    border: 1px solid #d7e7fa;
}

.dark {
    background:
        radial-gradient(
            circle at 88% 12%,
            rgba(14, 115, 216, 0.25),
            transparent 27%
        ),
        linear-gradient(135deg, #031638, #052a62);
}

.dark:after {
    border-color: rgba(123, 175, 235, 0.08);
}

.step-line:before {
    border-color: rgba(155, 184, 220, 0.45);
}

.package {
    background: linear-gradient(180deg, #f4f8fd, #f9fbfe);
}

.package-grid {
    gap: 42px;
}

.package-copy h2 {
    color: #071e43;
}

.package-price {
    background: linear-gradient(135deg, #fffbe7, #f9e57a);
    border-color: #ead05a;
    box-shadow: 0 12px 30px rgba(196, 157, 20, 0.1);
}

.included {
    border-radius: 22px;
    box-shadow: var(--shadow-premium);
    border-color: #dce6f2;
}

.included-head b {
    color: #071e43;
}

.promo {
    background: linear-gradient(135deg, #fff5f5, #fff);
    border-color: #ffd9d9;
}

.location-grid {
    border-radius: 0;
}

.hotel-photo img {
    transition: transform 0.8s ease;
}

.hotel-photo:hover img {
    transform: scale(1.04);
}

.location-copy {
    background: #fff;
}

.map {
    background: linear-gradient(135deg, var(--brand-blue), var(--brand-blue-2));
    box-shadow: 0 12px 25px rgba(7, 59, 143, 0.16);
}

.facility-grid {
    gap: 15px;
}

.facility-grid > div {
    background: #fff;
    border-color: #dfe7f2;
    box-shadow: 0 8px 28px rgba(4, 42, 88, 0.035);
}

.facility-grid > div:hover {
    border-color: #b7d0ef;
    box-shadow: 0 20px 42px rgba(4, 42, 88, 0.1);
}

.city-shade {
    background:
        linear-gradient(
            90deg,
            rgba(2, 20, 53, 0.94),
            rgba(3, 42, 94, 0.66) 52%,
            rgba(2, 27, 66, 0.23)
        ),
        linear-gradient(0deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.08));
}

.limited-card {
    background: linear-gradient(145deg, #f4d03d, #e8bb20);
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.24);
}

.credibility {
    background: #f3f7fc;
}

.count-card {
    background:
        radial-gradient(
            circle at 75% 20%,
            rgba(47, 130, 221, 0.25),
            transparent 32%
        ),
        linear-gradient(135deg, #042052, #073d85);
}

.investment-shade {
    background: linear-gradient(
        90deg,
        rgba(1, 19, 52, 0.95),
        rgba(3, 45, 103, 0.72),
        rgba(1, 24, 61, 0.28)
    );
}

.faq-list details {
    border-color: #dde6f1;
    border-radius: 13px;
    box-shadow: 0 5px 18px rgba(3, 37, 82, 0.025);
    transition: 0.25s;
}

.faq-list details:hover {
    border-color: #b7cde8;
    box-shadow: 0 10px 25px rgba(3, 37, 82, 0.06);
}

.final {
    background:
        radial-gradient(
            circle at 50% -10%,
            rgba(20, 111, 218, 0.28),
            transparent 34%
        ),
        linear-gradient(135deg, #03183a, #06326f);
}

footer {
    background: #02132f;
    color: #aabbd4;
    padding-top: 62px;
}

.footer-grid {
    grid-template-columns: 2.2fr 1fr 1fr 1.2fr;
}

.footer-brand {
    padding-right: 30px;
}

.footer-logos {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 17px;
    min-height: 65px;
}

.footer-logos img {
    display: block;
    width: auto;
    height: 58px;
    object-fit: contain;
    object-position: left center;
}

.footer-logos img:first-child {
    width: 160px;
}

.footer-logos img:last-child {
    width: 150px;
    padding-left: 14px;
    border-left: 1px solid rgba(255, 255, 255, 0.16);
}

.footer-brand p {
    color: #fff;
    max-width: 320px;
    margin: 0 0 8px;
}

.footer-brand > span {
    color: #8196b7;
}

.copyright {
    border-top-color: rgba(255, 255, 255, 0.08);
    color: #7087aa;
}

.top {
    background: linear-gradient(135deg, var(--brand-blue), var(--brand-blue-2));
}

/* subtle reveal polish */
.reveal {
    transition:
        opacity 0.75s ease,
        transform 0.75s cubic-bezier(0.2, 0.75, 0.25, 1);
}

/* Tablet */
@media (max-width: 1180px) {
    .nav-wrap {
        width: min(100% - 30px, 1100px);
        gap: 10px;
    }
    .logo.logo-iapi {
        width: 190px;
        flex-basis: 190px;
    }
    .logo.logo-iapi img {
        width: 184px;
    }
    .nav-wrap nav {
        gap: 0;
    }
    .nav-wrap nav a {
        padding: 11px 8px;
        font-size: 10px;
    }
    .partner {
        width: 145px;
        flex-basis: 145px;
    }
    .partner img {
        width: 135px;
    }
}

/* Mobile */
@media (max-width: 850px) {
    .navbar {
        height: 72px;
    }
    .nav-wrap {
        width: calc(100% - 26px);
    }
    .logo.logo-iapi {
        width: 165px;
        height: 56px;
        flex-basis: 165px;
    }
    .logo.logo-iapi img {
        width: 158px;
        height: 54px;
    }
    .nav-wrap nav {
        top: 72px;
        padding: 9px 14px;
        border: 1px solid #e2eaf3;
        box-shadow: 0 22px 40px rgba(3, 30, 69, 0.15);
    }
    .nav-wrap nav a {
        padding: 13px 4px;
        font-size: 11px;
    }
    .partner {
        display: none;
    }
    .hero {
        margin-top: 72px;
        min-height: 720px;
    }
    .hero-content {
        min-height: 720px;
    }
    .hero-copy {
        padding-bottom: 45px;
    }
    .hero h1 {
        font-size: clamp(43px, 9vw, 62px);
        letter-spacing: -3px;
    }
    .hero-sub {
        font-size: 14px;
    }
    .hero-trust {
        line-height: 1.8;
    }
    .floating-info {
        margin-top: -35px;
    }
    .info-bar {
        grid-template-columns: 1fr 1fr;
        gap: 17px;
    }
    .package-grid,
    .credibility-grid,
    .faq-grid {
        gap: 45px;
    }
    .location-grid {
        min-height: auto;
    }
    .footer-grid {
        grid-template-columns: 1fr 1fr;
    }
}

/* Small phones */
@media (max-width: 560px) {
    .container {
        width: calc(100% - 26px);
    }
    .logo.logo-iapi {
        width: 145px;
        flex-basis: 145px;
    }
    .logo.logo-iapi img {
        width: 140px;
    }
    .hero,
    .hero-content {
        min-height: 735px;
    }
    .hero-content {
        align-items: flex-end;
        padding-bottom: 65px;
    }
    .hero-badge {
        font-size: 7px;
        letter-spacing: 1px;
    }
    .hero h1 {
        font-size: 41px;
        line-height: 1;
        letter-spacing: -2.2px;
    }
    .hero-sub {
        font-size: 12.5px;
    }
    .hero-trust {
        font-size: 8px;
    }
    .hero-buttons .btn {
        width: 100%;
    }
    .floating-info {
        margin-top: -25px;
    }
    .info-bar {
        grid-template-columns: 1fr;
    }
    .section {
        padding: 78px 0;
    }
    .heading h2 {
        letter-spacing: -1.5px;
    }
    .feature-grid article {
        min-height: 205px;
    }
    .step {
        grid-template-columns: 75px 38px 1fr;
    }
    .step h3 {
        font-size: 14px;
    }
    .step p {
        font-size: 9px;
    }
    .included ul {
        grid-template-columns: 1fr;
    }
    .facility-grid {
        grid-template-columns: 1fr;
    }
    .city-inner,
    .investment-inner {
        padding-top: 70px;
        padding-bottom: 70px;
    }
    .limited-card {
        width: 100%;
    }
    .countdown div {
        min-width: 53px;
    }
    .countdown b {
        font-size: 24px;
    }
    .footer-grid {
        grid-template-columns: 1fr;
    }
    .footer-logos img:first-child {
        width: 145px;
    }
    .footer-logos img:last-child {
        width: 135px;
    }
}