/* ============================================================================
   Revenue Department Service — style.css
   Original corporate design system.
   Palette: navy structure, white/light-grey surfaces, restrained rosewood accent.
   ========================================================================== */

:root {
    --navy:        #002d62;   /* dark navigation / footer            */
    --blue:        #00599c;   /* primary action                      */
    --blue-dark:   #024a80;   /* primary hover                       */
    --ink:         #1B1B1B;   /* body text                           */
    --muted:       #5b6470;   /* secondary text                      */
    --border:      #e5e5e5;   /* hairlines                           */
    --gray:        #f5f6f8;   /* section background                  */
    --gray-2:      #eef1f5;   /* alt surface                         */
    --rosewood:    #9a4f3f;   /* brand accent — used sparingly       */
    --rosewood-2:  #b56a50;
    --white:       #ffffff;

    --radius:      10px;
    --radius-sm:   6px;
    --shadow-sm:   0 1px 2px rgba(16, 24, 40, .06);
    --shadow:      0 4px 16px rgba(16, 24, 40, .08);
    --shadow-lg:   0 12px 32px rgba(16, 24, 40, .12);

    --font-body:   'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-head:   'Source Serif 4', Georgia, 'Times New Roman', serif;

    --container:   1180px;
}

/* ---------------------------------------------------------------- base ---- */
* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    font-family: var(--font-body);
    color: var(--ink);
    background: var(--white);
    line-height: 1.65;
    font-size: 1rem;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5 {
    font-family: var(--font-head);
    color: var(--ink);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.01em;
        text-transform: capitalize;
}

p { color: var(--muted); }

a { color: var(--blue); text-decoration: none; transition: color .15s ease; }
a:hover { color: var(--blue-dark); }

.container { max-width: var(--container); }

/* Consistent section rhythm */
.section { padding: 84px 0; }
.section-sm { padding: 56px 0; }
.bg-gray { background: var(--gray); }
.bg-navy { background: var(--navy); color: #dbe4f0; }

/* Skip link */
.skip-link {
    position: absolute; top: 8px; left: 8px; z-index: 2000;
    background: var(--navy); color: #fff; padding: 8px 16px; border-radius: var(--radius-sm);
}

/* ------------------------------------------------------------- eyebrow ---- */
.eyebrow {
    display: inline-flex; align-items: center; gap: 10px;
    font-family: var(--font-body);
    font-size: .78rem; font-weight: 600; letter-spacing: .12em;
    text-transform: uppercase; color: var(--rosewood); margin-bottom: 14px;
}
.eyebrow::before {
    content: ""; width: 26px; height: 2px; background: var(--rosewood); display: inline-block;
}
.section-head { max-width: 680px; }
.section-head.center { margin: 0 auto; text-align: center; }
.section-head.center .eyebrow { justify-content: center; }
.section-title {font-size: clamp(1.7rem, 3vw, 2.4rem);margin-bottom: 12px;text-transform: capitalize;}
.section-lead { font-size: 1.08rem; color: var(--muted); }

/* ---------------------------------------------------------------- topbar -- */
.topbar {
    background: var(--navy);
    color: #cdd8e8;
    font-size: .85rem;
    padding: 7px 0;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.topbar-link {
    color: #cdd8e8; display: inline-flex; align-items: center; gap: 7px;
    text-decoration: none; border: 0; background: none; font-size: .85rem;
}
.topbar-link:hover { color: #fff; }
.topbar .dropdown-menu { font-size: .9rem; }

/* --------------------------------------------------------------- navbar --- */
.site-nav {
    background: var(--blue);
    padding: 14px 0;
    box-shadow: var(--shadow-sm);
    position: sticky; top: 0; z-index: 1030;
}
.brand-logo {width: 9rem;display: block;}
.site-nav .navbar-nav .nav-link {
    color: rgba(255, 255, 255, .9);
    font-weight: 500; font-size: .96rem;
    padding: 8px 14px; border-radius: var(--radius-sm);
    transition: background .15s ease, color .15s ease;
}
.site-nav .navbar-nav .nav-link:hover,
.site-nav .navbar-nav .nav-link.active { color: #fff; background: rgba(255, 255, 255, .12); }
.site-nav .navbar-toggler {
    border: 1px solid rgba(255, 255, 255, .4); color: #fff; font-size: 1.4rem; padding: 4px 10px;
}
.site-nav .navbar-toggler:focus { box-shadow: 0 0 0 3px rgba(255, 255, 255, .3); }
.site-nav .dropdown-menu { border: 1px solid var(--border); box-shadow: var(--shadow); border-radius: var(--radius-sm); }
.site-nav .dropdown-item.active,
.site-nav .dropdown-item:active { background: var(--blue); }

.nav-signin { border-color: rgba(255, 255, 255, .7); color: #fff; font-weight: 600; }
.nav-signin:hover { background: #fff; color: var(--navy); border-color: #fff; }

/* ---------------------------------------------------------------- buttons - */
.btn { font-weight: 600; border-radius: var(--radius-sm); padding: 11px 22px; transition: all .15s ease;text-transform: capitalize; }
.btn-lg { padding: 14px 28px; font-size: 1.02rem; }
.btn-primary { background: var(--blue); border-color: var(--blue); }
.btn-primary:hover { background: var(--blue-dark); border-color: var(--blue-dark); transform: translateY(-1px); }
.btn-navy { background: var(--navy); border-color: var(--navy); color: #fff; }
.btn-navy:hover { background: #001f47; color: #fff; transform: translateY(-1px); }
.btn-accent { background: var(--rosewood); border-color: var(--rosewood); color: #fff; }
.btn-accent:hover { background: #874334; border-color: #874334; color: #fff; transform: translateY(-1px); }
.btn-outline-navy { border: 1.5px solid var(--navy); color: var(--navy); background: transparent; }
.btn-outline-navy:hover { background: var(--navy); color: #fff; }
.btn-ghost { border: 1.5px solid var(--border); color: var(--ink); background: #fff; }
.btn-ghost:hover { border-color: var(--navy); color: var(--navy); }

/* ------------------------------------------------------------------ hero -- */
.hero {
    background: var(--gray);
    border-bottom: 1px solid var(--border);
    padding: 84px 0;
    position: relative; overflow: hidden;
}
.hero-title {
    font-size: clamp(2.1rem, 4.4vw, 3.35rem);
    line-height: 1.08; margin-bottom: 20px;
}
.hero-title .accent { color: var(--blue); }
.hero-lead {font-size: 1.125rem;color: var(--muted);margin-bottom: 28px;}
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 26px; }
.hero-checks { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 24px; max-width: 460px; }
.hero-checks li { display: flex; align-items: center; gap: 10px; font-weight: 500; color: var(--ink); font-size: .96rem; }
.hero-checks i { color: var(--blue); font-size: 1.1rem; }

/* Hero visual card cluster (abstract, original — no stock illustration) */
.hero-visual { position: relative; min-height: 380px; }
.hero-card {
    background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
    box-shadow: var(--shadow); padding: 20px 22px;
}
.hero-card--main { position: relative; z-index: 2; }
.hero-card--float {
    position: absolute; z-index: 3; box-shadow: var(--shadow-lg);
    display: flex; align-items: center; gap: 12px; padding: 14px 18px;
}
.hero-card--float.top-right { top: -20px; right: -14px; }
.hero-card--float.bottom-left { bottom: -6px; left: -14px; }
.hero-card .stat-row { display: flex; justify-content: space-between; align-items: baseline; padding: 10px 0; border-bottom: 1px solid var(--border); }
.hero-card .stat-row:last-child { border-bottom: 0; }
.hero-card .stat-label { color: var(--muted); font-size: .9rem; }
.hero-card .stat-value { font-family: var(--font-head); font-weight: 700; color: var(--ink); }
.hero-card .stat-value.pos { color: #1f7a4d; }
.hero-badge { width: 42px; height: 42px; border-radius: 10px; background: rgba(0, 89, 156, .1); color: var(--blue); display: grid; place-items: center; font-size: 1.3rem; flex: none; }
.hero-badge.rose { background: rgba(154, 79, 63, .12); color: var(--rosewood); }

/* ---------------------------------------------------------------- trust --- */
.trust-bar { border-bottom: 1px solid var(--border); background: #fff; }
.trust-item { display: flex; align-items: center; gap: 12px; padding: 22px 0; }
.trust-item i { font-size: 1.5rem; color: var(--blue); }
.trust-item strong { display: block; font-size: .98rem; color: var(--ink); }
.trust-item span { font-size: .86rem; color: var(--muted); }

/* --------------------------------------------------------------- cards ---- */
.feature-card, .service-card {
    background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
    padding: 30px 28px; height: 100%;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.feature-card:hover, .service-card:hover {
    transform: translateY(-4px); box-shadow: var(--shadow); border-color: #d5dae2;
}
.card-icon {
    width: 52px; height: 52px; border-radius: 12px;
    background: rgba(0, 89, 156, .09); color: var(--blue);
    display: grid; place-items: center; font-size: 1.5rem; margin-bottom: 18px;
}
.service-card .card-icon { background: rgba(0, 45, 98, .07); color: var(--navy); }
.feature-card h3, .service-card h3 { font-size: 1.2rem; margin-bottom: 10px; }
.feature-card p, .service-card p { font-size: .96rem; margin-bottom: 16px; }
.card-link { font-weight: 600; font-size: .92rem; display: inline-flex; align-items: center; gap: 6px; }
.card-link i { transition: transform .15s ease; }
.card-link:hover i { transform: translateX(3px); }

/* --------------------------------------------------------- why choose us -- */
.why-list { list-style: none; padding: 0; margin: 0; }
.why-list li { display: flex; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--border); }
.why-list li:last-child { border-bottom: 0; }
.why-icon { flex: none; width: 44px; height: 44px; border-radius: 10px; background: rgba(154, 79, 63, .1); color: var(--rosewood); display: grid; place-items: center; font-size: 1.25rem; }
.why-list h3 { font-size: 1.08rem; margin-bottom: 4px; }
.why-list p { margin: 0; font-size: .94rem; }
.why-panel { background: var(--navy); border-radius: var(--radius); padding: 40px; color: #dbe4f0; }
.why-panel h2 { color: #fff; }
.why-panel .stat { display: flex; align-items: baseline; gap: 10px; padding: 14px 0; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.why-panel .stat:last-child { border-bottom: 0; }
.why-panel .stat b { font-family: var(--font-head); font-size: 2rem; color: #fff; line-height: 1; }
.why-panel .stat span { color: #b7c4d6;     font-size: 14px;
    text-transform: capitalize; }

/* -------------------------------------------------------- how it works ---- */
.step { text-align: left; padding: 8px 0; }
.step-num {
    font-family: var(--font-head); font-size: 1.05rem; font-weight: 700;
    width: 44px; height: 44px; border-radius: 50%;
    border: 1.5px solid var(--blue); color: var(--blue);
    display: grid; place-items: center; margin-bottom: 16px;
}
.step h3 { font-size: 1.14rem; margin-bottom: 8px; }
.step p { font-size: .95rem; }
.step-line { position: relative; }
@media (min-width: 992px) {
    .step-line::after {
        content: ""; position: absolute; top: 22px; left: 60px; right: -40%;
        height: 1.5px; background: var(--border);
    }
    .step-line:last-child::after { display: none; }
}

/* ---------------------------------------------------------------- accordion */
.accordion-item { border: 1px solid var(--border); border-radius: var(--radius-sm) !important; margin-bottom: 12px; overflow: hidden; }
.accordion-button {
    font-family: var(--font-head); font-weight: 600; font-size: 1.05rem; color: var(--ink);
    padding: 20px 22px; background: #fff;
}
.accordion-button:not(.collapsed) { color: var(--navy); background: var(--gray); box-shadow: none; }
.accordion-button:focus { box-shadow: 0 0 0 3px rgba(0, 89, 156, .2); border-color: var(--blue); }
.accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='%23002d62' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
}
.accordion-body {padding: 12px 22px 22px;color: var(--muted);font-size: .97rem;}

/* ------------------------------------------------------------------ CTA ---- */
.cta {
    background: var(--navy);
    border-radius: 14px;
    padding: 56px;
    color: #fff;
    position: relative; overflow: hidden;
}
.cta::after {
    content: ""; position: absolute; right: -60px; top: -60px;
    width: 240px; height: 240px; border-radius: 50%;
    background: rgba(255, 255, 255, .04);
}
.cta h2 { color: #fff; font-size: clamp(1.6rem, 3vw, 2.2rem); }
.cta p { color: #b7c4d6; font-size: 1.08rem; }

/* --------------------------------------------------------------- articles - */
.article-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; height: 100%; transition: box-shadow .18s ease, transform .18s ease; }
.article-card:hover { box-shadow: var(--shadow); transform: translateY(-3px); }
.article-thumb { height: 8px; background: var(--blue); }
.article-thumb.rose { background: var(--rosewood); }
.article-thumb.navy { background: var(--navy); }
.article-body { padding: 26px 24px; }
.article-tag { font-size: .74rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--rosewood); }
.article-body h3 { font-size: 1.16rem; margin: 10px 0; }
.article-body p { font-size: .94rem; margin-bottom: 14px; }
.article-meta { font-size: .82rem; color: var(--muted); }

/* -------------------------------------------------------- contact banner -- */
.contact-banner { background: var(--gray); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.contact-banner .inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; padding: 40px 0; }

/* ---------------------------------------------------------------- page hero */
.page-hero { background: var(--navy); color: #fff; padding: 66px 0; }
.page-hero .eyebrow { color: #e0b4a6; }
.page-hero .eyebrow::before { background: #e0b4a6; }
.page-hero h1 { color: #fff; font-size: clamp(2rem, 4vw, 2.9rem); margin-bottom: 12px; }
.page-hero p { color: #b7c4d6; font-size: 1.12rem; margin: 0; }
.breadcrumb-bar { background: var(--gray); border-bottom: 1px solid var(--border); padding: 12px 0; }
.breadcrumb { margin: 0; font-size: .88rem; }
.breadcrumb a { color: var(--muted); }
.breadcrumb .active { color: var(--ink); }

/* ---------------------------------------------------------------- prose --- */
.prose h2 {font-size: 1.6rem;margin: 0px 0 14px;}
.prose h3 { font-size: 1.24rem; margin: 26px 0 10px; }
.prose p { margin-bottom: 16px; font-size: 1.02rem; color: #3a3f47; }
.prose ul { padding-left: 0; list-style: none; margin-bottom: 20px; }
.prose ul li { position: relative; padding-left: 30px; margin-bottom: 10px; color: #3a3f47; }
.prose ul li::before { content: "\F26E"; font-family: "bootstrap-icons"; position: absolute; left: 0; top: 1px; color: var(--blue); }

.value-card { background: #fff; border: 1px solid var(--border); border-left: 3px solid var(--rosewood); border-radius: var(--radius-sm); padding: 24px; height: 100%; }
.value-card h3 { font-size: 1.14rem; margin-bottom: 8px; }
.value-card p { margin: 0; font-size: .95rem; }

/* ---------------------------------------------------------------- forms --- */
.form-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 40px; }
.form-label { font-weight: 600; font-size: .9rem; color: var(--ink); margin-bottom: 6px; }
.form-control, .form-select {
    border: 1px solid var(--border); border-radius: var(--radius-sm);
    padding: 11px 14px; font-size: .97rem; color: var(--ink);
}
.form-control:focus, .form-select:focus {
    border-color: var(--blue); box-shadow: 0 0 0 3px rgba(0, 89, 156, .15);
}
.input-group-text { background: var(--gray); border: 1px solid var(--border); color: var(--muted); }
.form-check-input:checked { background-color: var(--blue); border-color: var(--blue); }
.form-check-input:focus { box-shadow: 0 0 0 3px rgba(0, 89, 156, .15); }
.auth-wrap { min-height: 70vh; display: flex; align-items: center; padding: 60px 0; background: var(--gray); }
.auth-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 40px; }
.auth-logo { height: 40px; margin-bottom: 20px; }
.auth-aside { background: var(--navy); color: #dbe4f0; border-radius: var(--radius); padding: 40px; height: 100%; }
.auth-aside h2 { color: #fff; }
.auth-aside .aside-list { list-style: none; padding: 0; margin: 22px 0 0; }
.auth-aside .aside-list li { display: flex; gap: 12px; padding: 10px 0; }
.auth-aside .aside-list i { color: #e0b4a6; font-size: 1.15rem; }
.password-toggle { cursor: pointer; }

/* ---------------------------------------------------------------- alerts -- */
.alert { border-radius: var(--radius-sm); border: 1px solid transparent; font-size: .95rem; }
.alert-success { background: #e8f5ee; border-color: #b7dfc7; color: #1f6b42; }
.alert-danger { background: #fdecec; border-color: #f4c7c7; color: #a52222; }

/* ------------------------------------------------------------ contact info */
.contact-info-card {background: var(--gray);border: 1px solid var(--border);border-radius: var(--radius);padding: 28px;}
.contact-info-card ul { list-style: none; padding: 0; margin: 0; }
.contact-info-card li { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--border); }
.contact-info-card li:last-child { border-bottom: 0; }
.contact-info-card i { color: var(--blue); font-size: 1.3rem; flex: none; }
.contact-info-card strong {display: block;color: var(--ink);font-size: .95rem;text-transform: capitalize;}
.contact-info-card span, .contact-info-card a { color: var(--muted); font-size: .92rem; }
.map-embed { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; height: 100%; min-height: 320px; }
.map-embed iframe { width: 100%; height: 100%; min-height: 320px; border: 0; display: block; }

/* --------------------------------------------------------------- footer --- */
.site-footer { background: var(--gray); border-top: 1px solid var(--border); padding: 64px 0 0; margin-top: 0; }
.footer-logo {margin-bottom: 18px;width: 12rem;}
.footer-about { font-size: .92rem; color: var(--muted); max-width: 340px; }
.footer-disclaimer-inline { font-size: .82rem; color: var(--muted); background: #fff; border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 12px 14px; margin-top: 16px; }
.footer-disclaimer-inline i { color: var(--rosewood); margin-right: 4px; }
.footer-heading { font-family: var(--font-body); font-size: .82rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ink); margin-bottom: 16px; }
.footer-links, .footer-contact { list-style: none; padding: 0; margin: 0; }
.footer-links li { margin-bottom: 10px; }
.footer-links a { color: var(--muted); font-size: .92rem; }
.footer-links a:hover { color: var(--navy); }
.footer-contact li { display: flex; gap: 10px; margin-bottom: 12px; font-size: .9rem; color: var(--muted); }
.footer-contact i { color: var(--blue); margin-top: 3px; }
.footer-contact a { color: var(--muted); }
.footer-contact a:hover { color: var(--navy); }
.footer-bottom { border-top: 1px solid var(--border); margin-top: 48px; padding: 20px 0; font-size: .86rem; color: var(--muted); }
.footer-legal { list-style: none; display: flex; gap: 20px; padding: 0; }
.footer-legal a { color: var(--muted); }
.footer-legal a:hover { color: var(--navy); }

/* ------------------------------------------------------------ back to top - */
.back-to-top {
    position: fixed; right: 22px; bottom: 22px; z-index: 1040;
    width: 46px; height: 46px; border-radius: 50%; border: 0;
    background: var(--navy); color: #fff; font-size: 1.2rem;
    box-shadow: var(--shadow); opacity: 0; visibility: hidden;
    transition: opacity .2s ease, transform .2s ease;
}
.back-to-top.show { opacity: 1; visibility: visible; }
.back-to-top:hover { transform: translateY(-3px); }

/* ---------------------------------------------------------------- focus --- */
a:focus-visible, button:focus-visible, .btn:focus-visible,
.form-control:focus-visible, .accordion-button:focus-visible {
    outline: 3px solid rgba(0, 89, 156, .35); outline-offset: 2px;
}
.abtPanel .stat b {
    font-size: 18px;
}

.abtPanel .stat {
    flex-direction: column;
}

.bannerImg {
    width: 40rem;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);

}
@media (max-width: 1366.98px) {
.bannerImg {
        right: 0;
    width: 33rem;
    right: 2rem;
}
}
/* ------------------------------------------------------------ responsive -- */
@media (max-width: 991.98px) {
    .section { padding: 60px 0; }
    .hero { padding: 56px 0; }
    .hero-visual { min-height: auto; margin-top: 40px; }
    .hero-card--float.top-right {top: -4rem;right: 0;}
    .hero-card--float.bottom-left { bottom: -10px; left: 0; }
    .cta { padding: 40px 28px; }
    .why-panel { margin-top: 28px; }
    .site-nav .navbar-nav { padding-top: 12px; }
    .site-nav .navbar-nav .nav-link { padding: 10px 12px; }
    .nav-signin, .nav-signup { display: inline-block; width: auto; }
    .bannerImg {
    width: 25rem;
}
.bannerImg {
    display: none;
}
}

@media (max-width: 575.98px) {
    .hero-checks { grid-template-columns: 1fr; }
    .form-card, .auth-card { padding: 26px 20px; }
    .cta { padding: 32px 22px; }
    .footer-legal { flex-wrap: wrap; gap: 12px; }
    .site-nav {
        padding: 4px 0;
    }
.brand-logo {
    width: 8rem;
}
.footer-logo {
    width: 9rem;
}
.footer-bottom {
    text-align: center;
    margin-top: 1rem;
}

.footer-bottom ul {
    justify-content: center;
}

.footer-bottom .container {
    justify-content: center !important;
}
.hero-lead , .page-hero p{
    font-size: 1rem;
}

.btn {
    width: 100%;
    font-size: 14px;
    padding: 12px;
}
.prose h2 {
    margin-top: 0;
}
.prose p , p ,.prose ul li{
    font-size: 14px !important;
}
.section {
    padding: 30px 0;
}

.section-sm {
    padding: 20px 0;
}
}

/* --------------------------------------------------------- reduced motion - */
@media (prefers-reduced-motion: reduce) {
    * { animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}
.contact-info-card .btn {
    color: #fff;
}
@media (min-width: 992px) {
    .navbar .dropdown:hover > .dropdown-menu {
        display: block;
        margin-top: 0;
    }

    .navbar .dropdown-menu {
        display: none;
    }
}

.section-sm .btn.btn-accent.btn-lg {
    position: relative;
    z-index: 1;
}