* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

/* ============HERO SECTION */
.eb-hero {
    --gold: #C8A84E;
    --green: #1F6B3A;
    --ink: #141414;
    background: linear-gradient(135deg, #0f2e1c 0%, #1F6B3A 100%);
    color: #fff;
    position: relative;
    overflow: hidden;
}

/* decorative gradient shapes */
.eb-hero::after,
.eb-hero::before {
    content: "";
    position: absolute;
    border-radius: 50%;
    filter:blur(100px);
    opacity: 0.18;
    z-index: 0;
}
.eb-hero::before {
    width: 420px;
    height: 420px;
    background: var(--gold);
    top: -120px;
    left: -120px;
}
.eb-hero::after {
    width: 380px;
    height: 380px;
    background: #2a9250;
    bottom: -140px;
    right: -140px;
}

.eb-hero .wrap {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
    padding: clamp(80px,14vh,140px) 20px;
    display: grid;
    gap: 40px;
    grid-template-columns: 1fr;
}
@media(min-width:860px) {
    .eb-hero .wrap {
        grid-template-columns: 1.1fr 0.9fr;
        align-items: center;
    }
}

/* left column */
.eb-hero .eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-weight: 700;
    color: var(--gold);
    font-size: 0.9rem;
    margin-bottom: 0.8rem;
    display: inline-block;
    position: relative;
}
.eb-hero .eyebrow::after {
    content: "";
    display: block;
    height: 3px;
    background: var(--gold);
    margin-top: 0.4rem;
    width: 40px;
    animation: slideLine 2.4s ease-in-out infinite;
}
@keyframes slideLine {
    0%,
    100% {
        transform: scaleX(0);
        transform-origin: left;
    }
    50% {
        transform: scaleX(1);
        transform-origin: left;
    }
}

.eb-hero h1 {
    font-family: "Playfair Display",serif;
    font-weight: 700;
    font-size: clamp(2.2rem,4.8vw,3.4rem);
    line-height: 1.12;
    margin: 0 0 0.8rem;
}
.eb-hero .lead {
    max-width: 55ch;
    font-size: clamp(1rem,1.4vw,1.2rem);
    line-height: 1.6;
    color: #f0f0f0;
}

/* buttons */
.cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 1.6rem;
}
.eb-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 14px 26px;
    border-radius: 999px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    font-size: 1rem;
}
.eb-btn--gold {
    background: var(--gold);
    color: #1b1b1b;
}
.eb-btn--gold:hover {
    transform: translateY(-2px);
    filter:brightness(1.05);
}
.eb-btn--outline {
    border: 2px solid #fff;
    color: #fff;
}
.eb-btn--outline:hover {
    background: rgba(255,255,255,.1);
    transform: translateY(-2px);
}

/* right column: decorative card */
.eb-hero .card {
    background: rgba(255,255,255,.05);
    backdrop-filter:blur(8px);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 18px;
    padding: 30px;
    text-align: center;
    box-shadow: 0 20px 40px rgba(0,0,0,.25);
    animation: fadeInUp 1.2s ease both;
}
.eb-hero .card h3 {
    font-family: "Playfair Display",serif;
    font-size: 1.6rem;
    margin: 0 0 0.6rem;
}
.eb-hero .card p {
    color: #e6e6e6;
    font-size: 1rem;
    margin: 0;
}
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@media(max-width:860px) {
    .eb-hero .wrap {
        text-align: center;
    }
    .cta-row {
        justify-content: center;
    }
}

/* ==============BOOKING FORM */
.eb-consult {
    background: radial-gradient(1200px 600px at 85% -10%, rgba(233,165,28,.25), transparent 60%), radial-gradient(800px 400px at 5% 110%, rgba(31,107,58,.25), transparent 60%), linear-gradient(180deg, #0A0D13, #0A0C10 60%, #0A0D13);
    font-family: "Ubuntu", serif;
}

.wrap {
    max-width: 1120px;
    margin: 0 auto;
    padding: clamp(20px,3vw,36px);
}

/* Shell + Hero Ribbon */
.eb-consult .shell {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius);
    border: 1px solid rgba(0,0,0,.06);
    background: #C8A84E;
    box-shadow: var(--shadow);
}
.eb-consult .shell::before {
    content: "";
    position: absolute;
    inset: -30% -10% auto -10%;
    height: 58%;
    background: linear-gradient(120deg, rgba(31,107,58,.12), rgba(200,168,78,.16));
    transform: skewY(-6deg);
    filter:saturate(105%);
}
.eb-consult .shell::after {
    content: "";
    position: absolute;
    top: 0;
    right: -12%;
    width: 38%;
    height: 38%;
    background: radial-gradient(60% 60% at 60% 40%, rgba(200,168,78,.28), rgba(31,107,58,.0) 70%);
    filter:blur(6px);
}

/* Header row */
.eb-consult .header {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: clamp(16px,3vw,28px);
    align-items: center;
    padding: clamp(24px,4vw,44px);
}
.eb-logo {
    width: clamp(150px, 22vw, 240px);
    height: auto;
    display: block;
    filter: drop-shadow(0 8px 18px rgba(0,0,0,.06));
}
.eb-consult .eyebrow {
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #1F6B3A;
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 1.5rem;
}
.eb-consult h2 {
    margin: 0.35rem 0 0.6rem;
    font-size: clamp(1.8rem,4vw,2.7rem);
    line-height: 1.1;
    color: #C8A84E;
    text-transform: capitalize;
    letter-spacing: 0.14em;
}
.eb-consult .lead {
    color: var(--muted);
    font-size: clamp(1rem,1.7vw,1.2rem);
    max-width: 62ch;
    letter-spacing: 0.14em;
}

.eb-consult .cta-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 12px;
}
.eb-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    border-radius: 999px;
    padding: 14px 22px;
    font-weight: 700;
    text-decoration: none;
    border: 2px solid transparent;
    transition: 0.2s;
}
.eb-btn svg {
    width: 18px;
    height: 18px;
}
.eb-btn--primary {
    background: var(--green);
    color: #fff;
    letter-spacing: 0.14em;
}
.eb-btn--primary:hover {
    filter:brightness(.96)
}

/* Right quick facts card */
.eb-consult .card {
    background: var(--card);
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 16px;
    padding: 18px;
    display: grid;
    gap: 12px;
}
.kicker {
    font-size: 1.2rem;
    font-weight: 700;
    color: #C8A84E;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.mini {
    display: flex;
    gap: 8px;
    align-items: center;
    color: rgb(207, 230, 245) !important;
    font-size: 0.95rem;
    letter-spacing: 1px;
}

.minii {
    display: flex;
    gap: 8px;
    align-items: center;
    color: rgb(207, 230, 245)!important;
    font-size: 0.95rem;
    letter-spacing: 1px;
}

.tick {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: var(--gold);
    font-size: 1rem;
}

/* Highlights + form */
.grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(12,1fr);
    padding: 0 clamp(20px,3vw,44px) clamp(20px,3vw,32px);
}
.tile {
    grid-column: span 4;
    background: var(--card);
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 16px;
    padding: 16px;
}
.tile h3 {
    margin: 0.25rem 0 0.35rem;
    font-size: 1.05rem;
    letter-spacing: 1px;
    color: #1F6B3A;
}
.muted {
    color: rgb(207, 230, 245);
    letter-spacing: 1px;
}
.list {
    margin: 0.3rem 0 0 1.1rem;
    letter-spacing: 1px;
}
.list li {
    margin: 0.22rem 0;
    letter-spacing: 1px;
    color: #1F6B3A;
}

.form {
    grid-column: span 12;
    background: linear-gradient(90deg, rgba(31,107,58,.10), rgba(200,168,78,.10));
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 16px;
    padding: 18px;
    display: grid;
    gap: 12px;
}
label {
    font-weight: 700;
    font-size: 0.92rem;
}
input,
select,
textarea {
    width: 100%;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,.12);
    background: #fff;
    font: 500 1rem/1.2 "Ubuntu",sans-serif;
}
input:focus,
select:focus,
textarea:focus {
    outline: none;
    box-shadow: var(--ring);
    border-color: transparent;
}
.row {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(12,1fr);
}
.col-6 {
    grid-column: span 6;
}
.col-12 {
    grid-column: span 12;
}

/* Steps */
.steps {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(12,1fr);
}
.step {
    grid-column: span 3;
    background: #fff;
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 14px;
    padding: 14px;
}
.badge {
    display: inline-block;
    background: var(--gold);
    color: #fff;
    font-weight: 800;
    font-size: 0.85rem;
    padding: 0.22rem 0.55rem;
    border-radius: 999px;
}

/* Responsive */
@media (max-width:980px) {
    .eb-consult .header {
        grid-template-columns: 1fr;
    }
    .tile {
        grid-column: span 6;
    }
    .step {
        grid-column: span 6;
    }

    .eyebrow {
        margin-bottom: 1.5rem;
    }


    .eb-consult h2 {
        font-size: clamp(1.5rem,5vw,2.2rem);
    }
   
    .eb-consult .lead {
        margin: 0 auto;
        max-width: 42ch !important;
    }
    .eb-btn {
        font-size: 0.9rem;
        padding: 12px 20px;
    }
}


@media (max-width:560px) {
    .col-6,
    .step,
    .tile {
        grid-column: span 12;
    }
}

/* Optional dark-mode logo swap */
@media (prefers-color-scheme: dark) {
    .eb-consult .shell {
        background: #0f1010;
    }
    .eb-consult .shell::before {
        background: linear-gradient(120deg, rgba(31,107,58,.20), rgba(200,168,78,.22));
    }
}

/* ==============CONTACT FORM */
:root {
    --gold: #E9A51C;
    /* EliteBook gold */
    --green: #1F6B3A;
    /* EliteBook rich green */
    --ink: #0E0F10;
    --card: #0f1520cc;
    --muted: #94a3b8;
    --bg: radial-gradient(1200px 600px at 85% -10%, rgba(233,165,28,.25), transparent 60%), radial-gradient(800px 400px at 5% 110%, rgba(31,107,58,.25), transparent 60%), linear-gradient(180deg, #0A0D13, #0A0C10 60%, #0A0D13);
}
.contact-wrap {
    padding: clamp(48px, 8vw, 96px) 20px;
    background: var(--bg);
    font-family: "Ubuntu", serif;
}
.contact-inner {
    max-width: 1100px;
    margin: 0 auto;
}
.contact-head {
    text-align: center;
    margin-bottom: 32px;
}
.eyebroww {
    letter-spacing: 0.2em;
    text-transform: uppercase;
    font-size: 0.8rem;
    color: #1F6B3A !important;
    margin-bottom: 0.25rem;
}
.contact-head h2 {
    font-size: clamp(1.6rem, 3.5vw, 2.3rem);
    margin: 0 0 0.5rem;
    font-weight: 700;
    color: #C8A84E;
    letter-spacing: 2px;
}
.contact-head .sub {
    color: rgb(207, 230, 245);
    max-width: 70ch;
    margin: 0 auto;
    letter-spacing: 1.5px !important;
    line-height: 2;
    margin-bottom: 5rem;
}

.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 24px;
}
@media (max-width: 900px) {
    .contact-grid {
        grid-template-columns: 1fr;
    }
}

.form,
.info {
    background: clamp(20px, 2vw, 28px) solid transparent;
    border-radius: 20px;
    padding: clamp(18px, 2.5vw, 28px);
    backdrop-filter: blur(8px);
    background: linear-gradient(180deg, rgba(16,22,34,.8), rgba(13,18,28,.7));
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 30px 60px rgba(0,0,0,.35);
    display: flex;
    flex-direction: column;
}

.info .list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 16px;
    margin-top: 5rem;
    letter-spacing: 2px;
    padding-bottom: 2rem;
}
.info svg {
    width: 22px;
    height: 22px;
    margin-right: 10px;
    fill: #9fb3c8;
}
.info li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #d7e0ea;
    padding-bottom: 1.5rem;
}
.social {
    margin-top: 18px;
    display: flex;
    gap: 12px;
}
.social a {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 12px;
    transition: transform 0.2s ease, border-color 0.2s ease;
}
.social a:hover {
    transform: translateY(-2px);
    border-color: var(--gold);
}
.social svg {
    width: 18px;
    height: 18px;
    fill: #cbd5e1;
}

.form h3 {
    margin: 0 0 12px;
    font-size: 1.25rem;
}
.row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
@media (max-width: 640px) {
    .row {
        grid-template-columns: 1fr;
    }

}

#contactTitle {
    font-size: 2.5rem;
    color: #C8A84E;
    letter-spacing: 2px;
    margin-bottom: 2rem;
}

.field {
    display: grid;
    gap: 6px;
}
.field label {
    font-size: 0.9rem;
    color: #cbd5e1;
}
.field input,
.field select,
.field textarea {
    width: 100%;
    background: #0b0f18;
    color: #e2e8f0;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
    padding: 12px 14px;
    font-size: 1rem;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.field input:focus,
.field select:focus,
.field textarea:focus {
    border-color: var(--gold);
    box-shadow: 0 0 0 4px rgba(233,165,28,.15);
}
.hp {
    position: absolute;
    left: -9999px;
    opacity: 0;
}
.consentt {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-top: 4px;
    color: #dbe6f3;
    font-size: 0.95rem;
}
.consentt input {
    margin-top: 2px;
}
.err {
    color: #ff6b6b;
    font-size: 0.85rem;
    min-height: 1.1em;
}
.btn {
    margin-top: 8px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border: 0;
    cursor: pointer;
    padding: 12px 18px;
    border-radius: 14px;
    font-weight: 600;
    color: #0a0c10;
    background: linear-gradient(135deg, var(--gold), #ffd36a);
    box-shadow: 0 10px 24px rgba(233,165,28,.25);
    transition: transform 0.15s ease, filter 0.2s ease;
}
.btn:hover {
    transform: translateY(-1px);
    filter: brightness(1.02);
}
.btn:active {
    transform: translateY(0);
}

.spinner {
    width: 18px;
    height: 18px;
    stroke: #0a0c10;
    fill: none;
    stroke-width: 3;
    display: none;
}
.btn.loading .spinner {
    display: block;
    animation: spin 1s linear infinite;
}
.btn.loading .txt {
    opacity: 0.6;
}
@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

.msg {
    margin: 10px 0 0;
    color: #cde4d4;
}
.noscript {
    margin-top: 10px;
    color: #f1f5f9;
}
a {
    color: #d9b651;
}

@media screen and (min-width: 320px) {
     .footer-brand .logo {
      display: flex;
      justify-content: center;
  }

    .logo-img {
      width: min(250px, 45vw);
      margin-bottom: 4rem;
  }

  .footer-col h4 {
      margin-bottom: -1rem;

  }

  .footer-list {
      margin-bottom: 2rem;
  }
}