/* =========================================================
   RM ACELECT ENGINEERING — PREMIUM PUBLIC WEBSITE V1
   Visual/content layer only.
   IMPORTANT: booking field IDs/names and JS hooks are preserved.
   ========================================================= */

:root{
    --rm-blue:#0b4ea2;
    --rm-blue-dark:#073875;
    --rm-blue-deep:#061f45;
    --rm-orange:#f7941d;
    --rm-orange-dark:#d97706;
    --rm-cyan:#35d5e8;
    --ink:#122033;
    --muted:#607086;
    --line:#e3eaf2;
    --soft:#f4f8fc;
    --white:#fff;
    --shadow:0 18px 50px rgba(10,45,90,.10);
    --shadow-lg:0 25px 70px rgba(6,31,69,.15);
    --radius:18px;
}

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

html{scroll-behavior:smooth;scroll-padding-top:85px}

body{
    font-family:"Poppins",Arial,sans-serif;
    color:var(--ink);
    background:#fff;
    line-height:1.7;
    overflow-x:hidden;
}

img{max-width:100%;height:auto}

a{color:inherit}

.container{
    width:min(1180px,92%);
    margin:0 auto;
}

.top-header{
    background:var(--rm-blue-deep);
    color:#fff;
    font-size:12px;
}

.top-contact{
    min-height:42px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
}

.left-contact,.right-contact{
    display:flex;
    align-items:center;
    gap:22px;
    flex-wrap:wrap;
}

.top-header a{
    text-decoration:none;
    color:#fff;
    transition:.2s;
}

.top-header a:hover{color:#8beaf4}

.navbar{
    position:sticky;
    top:0;
    z-index:1000;
    background:rgba(255,255,255,.97);
    backdrop-filter:blur(14px);
    border-bottom:1px solid #e8edf3;
    box-shadow:0 6px 25px rgba(0,0,0,.05);
}

.nav-wrapper{
    min-height:82px;
    display:flex;
    align-items:center;
    gap:26px;
}

.logo{flex:0 0 auto}

.logo img{
    display:block;
    width:105px;
    height:auto;
}

.nav-wrapper ul{
    flex:1;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:4px;
    list-style:none;
}

.nav-wrapper ul a{
    display:block;
    position:relative;
    padding:29px 10px;
    text-decoration:none;
    color:#0a438d;
    font-size:13px;
    font-weight:700;
    white-space:nowrap;
    transition:.2s;
}

.nav-wrapper ul a:hover,
.nav-wrapper ul a.active{color:var(--rm-orange)}

.nav-wrapper ul a::after{
    content:"";
    position:absolute;
    left:10px;
    right:10px;
    bottom:20px;
    height:2px;
    border-radius:3px;
    background:var(--rm-orange);
    transform:scaleX(0);
    transition:.2s;
}

.nav-wrapper ul a:hover::after,
.nav-wrapper ul a.active::after{transform:scaleX(1)}

.book-btn,
.btn-primary,
.btn-secondary,
.primary-small,
.outline-btn,
.whatsapp-large,
.call-large{
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    font-weight:800;
    border-radius:9px;
    transition:.25s ease;
}

.book-btn{
    flex:0 0 auto;
    min-width:120px;
    height:46px;
    padding:0 18px;
    color:#fff!important;
    background:linear-gradient(135deg,var(--rm-orange),#e77900);
    box-shadow:0 10px 25px rgba(247,148,29,.24);
    font-size:13px;
}

.book-btn:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(247,148,29,.32)}

.hero{
    position:relative;
    min-height:620px;
    display:flex;
    align-items:center;
    background:
        linear-gradient(110deg,rgba(5,31,69,.94),rgba(8,67,126,.73)),
        url("../images/optimized/hero-bg.webp") center/cover no-repeat;
    color:#fff;
    overflow:hidden;
}

.hero-overlay{
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 75% 30%,rgba(53,213,232,.18),transparent 34%);
}

.hero-content{
    position:relative;
    z-index:2;
    padding:92px 0 86px;
    max-width:1000px;
}

.hero-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:9px;
    color:#68e2ef;
    font-size:13px;
    font-weight:800;
    letter-spacing:1.2px;
    text-transform:uppercase;
    margin-bottom:18px;
}

.eyebrow-dot{
    width:8px;height:8px;border-radius:50%;
    background:#68e2ef;
    box-shadow:0 0 0 6px rgba(104,226,239,.12);
}

.hero h1{
    max-width:920px;
    font-size:clamp(42px,5vw,68px);
    line-height:1.08;
    letter-spacing:-1.5px;
    margin-bottom:25px;
}

.hero-lead{
    max-width:820px;
    font-size:17px;
    line-height:1.85;
    color:rgba(255,255,255,.9);
}

.hero-buttons{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:31px;
}

.btn-primary,.btn-secondary{
    min-height:52px;
    padding:0 24px;
    font-size:14px;
}

.btn-primary{
    color:#fff;
    background:linear-gradient(135deg,var(--rm-orange),#e77900);
    box-shadow:0 13px 28px rgba(0,0,0,.18);
}

.btn-secondary{
    color:#fff;
    background:#19b957;
    box-shadow:0 13px 28px rgba(0,0,0,.15);
}

.btn-primary:hover,.btn-secondary:hover{transform:translateY(-2px)}

.hero-trust{
    display:flex;
    flex-wrap:wrap;
    gap:12px 25px;
    margin-top:28px;
    font-size:12px;
    color:rgba(255,255,255,.85);
}

.hero-trust i{color:#66e0f2;margin-right:5px}

.trust-strip{
    background:#fff;
    border-bottom:1px solid var(--line);
    box-shadow:0 10px 30px rgba(7,55,117,.06);
}

.trust-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
}

.trust-item{
    min-height:108px;
    display:flex;
    align-items:center;
    gap:13px;
    padding:18px 20px;
    border-right:1px solid var(--line);
}

.trust-item:last-child{border-right:0}

.trust-icon{
    width:44px;height:44px;
    display:grid;place-items:center;
    border-radius:12px;
    color:var(--rm-blue);
    background:#edf5ff;
    font-size:18px;
}

.trust-item strong{display:block;color:var(--rm-blue-dark);font-size:15px}
.trust-item span{display:block;color:var(--muted);font-size:11px}

section{scroll-margin-top:82px}

.why-choose,.services,.brands,.projects,.pricing,.maintenance,.gallery,.testimonials,.faq{
    padding:90px 0;
}

.why-choose,.brands,.gallery,.faq{background:#f5f8fc}

.services,.projects,.pricing,.maintenance,.testimonials{background:#fff}

.section-title{
    max-width:820px;
    margin:0 auto 52px;
    text-align:center;
}

.section-title-light{color:#fff}

.section-kicker{
    display:block;
    color:var(--rm-orange);
    font-size:11px;
    font-weight:900;
    letter-spacing:2px;
    margin-bottom:9px;
}

.section-title h2{
    color:var(--rm-blue-dark);
    font-size:clamp(30px,4vw,43px);
    line-height:1.18;
    letter-spacing:-.6px;
    margin-bottom:15px;
}

.section-title-light h2{color:#fff}

.section-title p{
    color:var(--muted);
    font-size:15px;
    line-height:1.8;
}

.section-title-light p{color:rgba(255,255,255,.78)}

.why-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

.why-card{
    background:#fff;
    padding:31px 27px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:0 12px 35px rgba(7,55,117,.06);
    transition:.25s;
}

.why-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}

.why-card .icon{
    width:50px;height:50px;
    display:grid;place-items:center;
    border-radius:14px;
    background:#edf5ff;
    color:var(--rm-blue);
    font-size:20px;
    margin-bottom:19px;
}

.why-card h3{font-size:18px;color:var(--rm-blue-dark);margin-bottom:10px}
.why-card p{font-size:13px;color:var(--muted);line-height:1.8}

.serve-section{
    padding:90px 0;
    background:linear-gradient(135deg,#061f45,#0b4ea2);
    color:#fff;
}

.serve-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
}

.serve-card{
    padding:27px;
    border:1px solid rgba(255,255,255,.13);
    background:rgba(255,255,255,.07);
    border-radius:16px;
    transition:.25s;
}

.serve-card:hover{background:rgba(255,255,255,.11);transform:translateY(-4px)}

.serve-card i{font-size:24px;color:#67e2ef;margin-bottom:14px}
.serve-card h3{font-size:18px;margin-bottom:7px}
.serve-card p{font-size:13px;color:rgba(255,255,255,.72);line-height:1.75}

.service-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
}

.service-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(7,55,117,.07);
    transition:.3s;
}

.service-card:hover{transform:translateY(-7px);box-shadow:var(--shadow-lg)}

.service-card>img{
    width:100%;
    height:225px;
    display:block;
    object-fit:cover;
}

.service-content{padding:24px}

.service-tag{
    display:inline-block;
    color:var(--rm-blue);
    font-size:9px;
    letter-spacing:1.3px;
    font-weight:900;
    margin-bottom:9px;
}

.service-content h3{font-size:20px;color:var(--rm-blue-dark);margin-bottom:9px}
.service-content p{font-size:13px;color:var(--muted);line-height:1.75;min-height:91px}

.service-btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-top:17px;
    padding:11px 15px;
    border-radius:8px;
    background:#edf5ff;
    color:var(--rm-blue);
    text-decoration:none;
    font-size:12px;
    font-weight:800;
    transition:.2s;
}

.service-btn:hover{background:var(--rm-blue);color:#fff}

.service-advice{
    margin-top:30px;
    display:flex;
    align-items:center;
    gap:17px;
    padding:20px 22px;
    border:1px solid #dbe7f3;
    border-radius:15px;
    background:#f8fbff;
}

.advice-icon{
    width:45px;height:45px;
    display:grid;place-items:center;
    border-radius:50%;
    color:var(--rm-orange);
    background:#fff4e4;
}

.service-advice div:nth-child(2){flex:1}
.service-advice strong{display:block;color:var(--rm-blue-dark);font-size:14px}
.service-advice p{font-size:12px;color:var(--muted);margin-top:2px}

.outline-btn{
    min-height:42px;
    padding:0 15px;
    border:1px solid var(--rm-blue);
    color:var(--rm-blue);
    background:#fff;
    font-size:11px;
}

.outline-btn:hover{background:var(--rm-blue);color:#fff}

.process-section{
    padding:90px 0;
    background:#f7fafc;
}

.process-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:14px;
}

.process-step{
    position:relative;
    padding:25px 20px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:16px;
    text-align:center;
}

.process-step>span{
    position:absolute;
    top:12px;right:13px;
    font-size:10px;font-weight:900;color:#c5d1df;
}

.process-step i{
    width:48px;height:48px;
    display:grid;place-items:center;
    margin:8px auto 14px;
    border-radius:14px;
    color:#fff;
    background:var(--rm-blue);
}

.process-step h3{font-size:15px;color:var(--rm-blue-dark);margin-bottom:7px}
.process-step p{font-size:11px;color:var(--muted);line-height:1.65}

.brand-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
}

.brand-card{
    padding:25px 20px;
    border:1px solid var(--line);
    border-radius:16px;
    background:#fff;
    text-align:center;
    box-shadow:0 8px 24px rgba(7,55,117,.05);
    transition:.25s;
}

.brand-card:hover{transform:translateY(-4px);border-color:#bcd3ec}

.brand-card strong{display:block;color:var(--rm-blue);font-size:21px}
.brand-card span{display:block;color:var(--muted);font-size:11px;margin-top:2px}

.brand-note{text-align:center;color:var(--muted);font-size:12px;margin-top:23px}

.project-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
}

.project-card{
    overflow:hidden;
    border-radius:17px;
    background:#fff;
    border:1px solid var(--line);
    box-shadow:0 10px 28px rgba(7,55,117,.07);
    transition:.3s;
}

.project-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}

.project-card img{display:block;width:100%;height:235px;object-fit:cover}

.project-content{padding:22px}

.project-content span{
    color:var(--rm-orange);
    font-size:10px;
    font-weight:900;
    letter-spacing:.8px;
}

.project-content h3{font-size:19px;color:var(--rm-blue-dark);margin:5px 0 8px}
.project-content p{font-size:12px;color:var(--muted);line-height:1.75}

.section-cta{text-align:center;margin-top:38px;color:var(--muted);font-size:13px}
.primary-small{
    min-height:42px;
    padding:0 17px;
    margin-top:12px;
    color:#fff;
    background:var(--rm-blue);
    font-size:11px;
}
.primary-small:hover{background:var(--rm-blue-dark);transform:translateY(-2px)}

.pricing-note{
    margin-bottom:28px;
    padding:20px 22px;
    border:1px solid #f1d7a8;
    background:#fffaf0;
    border-radius:14px;
}

.pricing-note strong{color:#8a5a00;font-size:13px}
.pricing-note p{color:#735d37;font-size:12px;line-height:1.7;margin-top:5px}

.pricing-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

.pricing-card{
    position:relative;
    padding:29px 25px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:17px;
    box-shadow:0 10px 28px rgba(7,55,117,.06);
}

.featured-price{border:2px solid var(--rm-orange);box-shadow:0 18px 45px rgba(247,148,29,.12)}

.popular-badge{
    position:absolute;
    top:15px;right:15px;
    padding:5px 9px;
    border-radius:20px;
    background:#fff1df;
    color:#a95d00;
    font-size:8px;
    font-weight:900;
    letter-spacing:.8px;
}

.pricing-icon{
    width:48px;height:48px;
    display:grid;place-items:center;
    border-radius:13px;
    background:#edf5ff;
    color:var(--rm-blue);
    font-size:19px;
    margin-bottom:17px;
}

.pricing-card h3{color:var(--rm-blue-dark);font-size:18px}
.price-label{display:block;color:#7b8a9d;font-size:10px;margin-top:7px}
.price{font-size:35px;line-height:1.15;color:var(--rm-blue);font-weight:900;margin:4px 0 15px}
.price-word{font-size:30px}
.pricing-card ul{list-style:none;color:var(--muted);font-size:12px;line-height:2}
.pricing-card li::before{content:"✓";color:#149447;font-weight:900;margin-right:8px}

.maintenance{
    padding-top:65px;
    border-top:1px solid var(--line);
}

.maintenance-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    padding:28px;
    border-radius:18px 18px 0 0;
    background:linear-gradient(135deg,#061f45,#0b4ea2);
    color:#fff;
}

.maintenance-header .service-tag{color:#67e2ef}
.maintenance-header h3{font-size:25px;margin-bottom:3px}
.maintenance-header p{font-size:12px;color:rgba(255,255,255,.72)}

.maintenance-table-wrapper{
    width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
}

.maintenance-table{
    width:100%;
    border-collapse:collapse;
    background:#fff;
    min-width:620px;
}

.maintenance-table th{
    padding:15px;
    background:#0b4ea2;
    color:#fff;
    text-align:center;
    font-size:12px;
}

.maintenance-table th:first-child,.maintenance-table td:first-child{text-align:left}
.maintenance-table th small{font-weight:500;opacity:.8}

.maintenance-table td{
    padding:13px 15px;
    border-bottom:1px solid #e8eef5;
    text-align:center;
    font-size:13px;
    color:#44556a;
}

.maintenance-table tbody tr:hover{background:#f8fbff}

.recommended-col{background:#fff8ed!important;color:#9a5a00!important;font-weight:800}

.maintenance-benefits{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:10px;
    margin-top:20px;
}

.benefit{
    padding:13px 10px;
    text-align:center;
    border:1px solid #dce8f4;
    border-radius:10px;
    background:#f8fbff;
    color:#35536f;
    font-size:10px;
    font-weight:700;
}

.benefit i{color:#15934a;margin-right:5px}

.maintenance-note{
    margin-top:18px;
    padding:17px 19px;
    border-radius:12px;
    background:#f6f9fd;
    border:1px solid var(--line);
    color:var(--muted);
    font-size:12px;
}

.maintenance-note strong{color:var(--rm-blue-dark)}

.gallery-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

.gallery-item{
    position:relative;
    overflow:hidden;
    border-radius:15px;
    background:#fff;
    box-shadow:0 10px 25px rgba(7,55,117,.08);
}

.gallery-item img{
    display:block;
    width:100%;
    height:235px;
    object-fit:cover;
    transition:.35s;
}

.gallery-item:hover img{transform:scale(1.045)}

.gallery-item span{
    position:absolute;
    left:12px;right:12px;bottom:12px;
    padding:9px 11px;
    border-radius:8px;
    background:rgba(6,31,69,.83);
    color:#fff;
    font-size:10px;
    font-weight:700;
}

.review-source-banner{
    display:flex;
    align-items:center;
    gap:14px;
    padding:18px 20px;
    margin-bottom:25px;
    border:1px solid #dce6f0;
    background:#fff;
    border-radius:15px;
    box-shadow:0 8px 25px rgba(7,55,117,.05);
}

.review-source-icon{
    width:45px;height:45px;
    display:grid;place-items:center;
    border-radius:50%;
    background:#f2f5f8;
    color:#4285f4;
    font-size:21px;
}

.review-source-banner div:nth-child(2){flex:1}
.review-source-banner strong{display:block;color:var(--rm-blue-dark);font-size:13px}
.review-source-banner span{display:block;color:var(--muted);font-size:11px}

.testimonial-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

.testimonial-card{
    background:#fff;
    border:1px solid var(--line);
    padding:27px;
    border-radius:16px;
    box-shadow:0 10px 28px rgba(7,55,117,.06);
    transition:.25s;
}

.testimonial-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}

.stars{color:#f7b500;font-size:20px;letter-spacing:2px;margin-bottom:14px}
.testimonial-card p{font-size:12px;color:#56687d;line-height:1.85;margin-bottom:18px}
.testimonial-card h4{font-size:15px;color:var(--rm-blue-dark)}
.testimonial-card span{font-size:10px;color:#8a99a9}

.faq-list{
    max-width:900px;
    margin:0 auto;
}

.faq-item{
    background:#fff;
    border:1px solid var(--line);
    border-radius:12px;
    margin-bottom:10px;
    overflow:hidden;
}

.faq-question{
    width:100%;
    border:0;
    background:#fff;
    color:var(--rm-blue-dark);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:19px 21px;
    text-align:left;
    font-family:inherit;
    font-size:13px;
    font-weight:800;
    cursor:pointer;
}

.faq-question span{color:var(--rm-orange);font-size:20px}
.faq-answer{display:none;padding:0 21px 19px}
.faq-answer p{color:var(--muted);font-size:12px;line-height:1.8}
.faq-item.active .faq-answer{display:block}

.contact{
    padding:90px 0;
    background:linear-gradient(135deg,#061f45,#0b4ea2);
    color:#fff;
}

.contact-grid{
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:28px;
    align-items:start;
}

.contact-info{
    padding:32px 28px;
    border:1px solid rgba(255,255,255,.13);
    background:rgba(255,255,255,.065);
    border-radius:20px;
}

.contact-info-head h3{font-size:27px;margin:6px 0 7px}
.contact-info-head p{font-size:12px;color:rgba(255,255,255,.7);line-height:1.75}

.contact-detail{
    display:flex;
    gap:13px;
    margin-top:22px;
}

.contact-detail>i{
    width:38px;height:38px;
    display:grid;place-items:center;
    flex:0 0 auto;
    border-radius:10px;
    background:rgba(255,255,255,.09);
    color:#67e2ef;
}

.contact-detail strong{display:block;font-size:11px;color:#fff}
.contact-detail span{display:block;color:rgba(255,255,255,.7);font-size:11px;line-height:1.65}
.contact-detail a{color:#fff;text-decoration:none}
.contact-detail a:hover{color:#67e2ef}

.contact-actions{
    display:flex;
    gap:10px;
    margin-top:25px;
}

.whatsapp-large,.call-large{
    min-height:45px;
    padding:0 15px;
    font-size:11px;
}

.whatsapp-large{background:#19b957;color:#fff}
.call-large{background:#fff;color:var(--rm-blue)}

.booking-form{
    position:relative;
    padding:30px;
    background:#fff;
    color:var(--ink);
    border:1px solid #dce6f0;
    border-radius:20px;
    box-shadow:var(--shadow-lg);
}

.booking-intro{
    display:flex;
    gap:13px;
    padding-bottom:22px;
    margin-bottom:22px;
    border-bottom:1px solid var(--line);
}

.form-step{
    width:38px;height:38px;
    display:grid;place-items:center;
    flex:0 0 auto;
    border-radius:10px;
    background:#edf5ff;
    color:var(--rm-blue);
    font-size:10px;
    font-weight:900;
}

.booking-intro h3{font-size:22px;color:var(--rm-blue-dark)}
.booking-intro p{font-size:11px;color:var(--muted);line-height:1.7;margin-top:3px}

.honeypot{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}

.form-section{
    padding:19px 0;
    border-bottom:1px solid #edf1f5;
}

.form-section-title{
    display:flex;
    gap:11px;
    align-items:center;
    margin-bottom:17px;
}

.form-section-title>span{
    width:28px;height:28px;
    display:grid;place-items:center;
    border-radius:8px;
    background:var(--rm-blue);
    color:#fff;
    font-size:9px;
    font-weight:900;
}

.form-section-title strong{display:block;color:var(--rm-blue-dark);font-size:13px}
.form-section-title small{display:block;color:#8997a8;font-size:10px}

.booking-form label{
    display:block;
    margin:12px 0 6px;
    color:#3e5064;
    font-size:10px;
    font-weight:800;
}

.booking-form em{font-style:normal;color:#8794a3;font-weight:500}

.booking-form input[type="text"],
.booking-form input[type="tel"],
.booking-form input[type="email"],
.booking-form input[type="date"],
.booking-form select,
.booking-form textarea{
    width:100%;
    border:1px solid #d9e2ec;
    border-radius:9px;
    background:#fbfdff;
    color:#25364a;
    font-family:inherit;
    font-size:12px;
    padding:12px 13px;
    outline:none;
    transition:.2s;
}

.booking-form textarea{min-height:84px;resize:vertical}

.booking-form input:focus,
.booking-form select:focus,
.booking-form textarea:focus{
    border-color:#72a8dc;
    background:#fff;
    box-shadow:0 0 0 4px rgba(11,78,162,.08);
}

.maintenance-plan-row{margin-top:4px}

.estimate-box{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    margin-top:20px;
    padding:18px;
    border-radius:13px;
    background:linear-gradient(135deg,#edf6ff,#f8fbff);
    border:1px solid #cfe1f2;
}

.estimate-box span{display:block;color:var(--rm-blue-dark);font-size:12px;font-weight:900}
.estimate-box small{display:block;color:#7b8a9d;font-size:9px}
.estimate-box strong{font-size:24px;color:var(--rm-blue)}

.agree{
    display:flex!important;
    align-items:flex-start;
    gap:8px;
    margin:17px 0 7px!important;
    color:#637286!important;
    font-weight:600!important;
}

.agree input{margin-top:3px;accent-color:var(--rm-blue)}
.submit-btn{
    width:100%;
    min-height:52px;
    margin-top:12px;
    border:0;
    border-radius:9px;
    background:linear-gradient(135deg,var(--rm-orange),#e77900);
    color:#fff;
    font-family:inherit;
    font-size:13px;
    font-weight:900;
    cursor:pointer;
    box-shadow:0 12px 25px rgba(247,148,29,.2);
    transition:.25s;
}

.submit-btn:hover{transform:translateY(-2px)}
.submit-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}

#bookingMessage{
    margin-top:12px;
    color:var(--rm-blue-dark);
    font-size:11px;
}

.secure-note{
    margin-top:12px;
    text-align:center;
    color:#8997a8;
    font-size:9px;
}

.site-footer{
    background:#041a38;
    color:#dce7f3;
    padding-top:65px;
}

.footer-grid{
    display:grid;
    grid-template-columns:1.3fr 1fr 1fr 1.1fr;
    gap:35px;
    padding-bottom:45px;
}

.footer-brand img{width:90px;margin-bottom:13px}
.footer-brand h3{font-size:17px;color:#fff;margin-bottom:8px}
.footer-brand p{font-size:11px;line-height:1.75;color:#8fa4bb}
.footer-tagline{color:#67e2ef!important;font-weight:800;margin-top:8px}

.footer-mini-actions{display:flex;gap:8px;margin-top:17px}
.footer-mini-actions a{
    padding:8px 11px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:7px;
    color:#dce7f3;
    text-decoration:none;
    font-size:10px;
}

.footer-links h4,.footer-contact h4{color:#fff;font-size:13px;margin-bottom:15px}
.footer-links a{
    display:block;
    color:#8fa4bb;
    text-decoration:none;
    font-size:11px;
    margin-bottom:8px;
}
.footer-links a:hover{color:#67e2ef}

.footer-contact p{font-size:11px;color:#8fa4bb;line-height:1.8;margin-bottom:10px}
.footer-contact a{color:#dce7f3;text-decoration:none}
.footer-contact a:hover{color:#67e2ef}

.footer-bottom{
    border-top:1px solid rgba(255,255,255,.08);
    padding:17px 0;
}

.footer-bottom .container{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;
}

.footer-bottom p,.footer-bottom a,.footer-bottom span{font-size:9px;color:#71879f;text-decoration:none}
.footer-bottom a:hover{color:#fff}

.mobile-action-bar{display:none}

@media (max-width:992px){
    .nav-wrapper ul a{padding-left:7px;padding-right:7px;font-size:11px}
    .why-grid,.service-grid,.project-grid,.pricing-grid,.testimonial-grid{grid-template-columns:repeat(2,1fr)}
    .serve-grid{grid-template-columns:repeat(2,1fr)}
    .process-grid{grid-template-columns:repeat(3,1fr)}
    .maintenance-benefits{grid-template-columns:repeat(3,1fr)}
    .contact-grid{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:768px){
    body{padding-bottom:67px}
    .top-contact{padding:8px 0;justify-content:center}
    .left-contact,.right-contact{justify-content:center;gap:9px 15px}
    .top-header{font-size:10px}

    .navbar{position:sticky}
    .nav-wrapper{min-height:64px;gap:8px;padding:6px 0}
    .logo img{width:72px}
    .nav-wrapper ul{justify-content:flex-start;overflow-x:auto;scrollbar-width:none;white-space:nowrap}
    .nav-wrapper ul::-webkit-scrollbar{display:none}
    .nav-wrapper ul a{padding:18px 7px;font-size:10px}
    .nav-wrapper ul a::after{bottom:10px;left:7px;right:7px}
    .book-btn{min-width:91px;height:40px;padding:0 9px;font-size:10px}

    .hero{min-height:650px}
    .hero-content{padding:70px 0 60px}
    .hero h1{font-size:38px;letter-spacing:-.6px}
    .hero-lead{font-size:13px}
    .hero-trust{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:10px}

    .trust-grid{grid-template-columns:1fr 1fr}
    .trust-item{min-height:88px;padding:13px;border-bottom:1px solid var(--line)}
    .trust-item:nth-child(2){border-right:0}
    .trust-item:nth-child(3){border-bottom:0}
    .trust-item:nth-child(4){border-right:0;border-bottom:0}
    .trust-item strong{font-size:12px}.trust-item span{font-size:9px}

    .why-choose,.services,.process-section,.brands,.projects,.pricing,.maintenance,.gallery,.testimonials,.faq,.contact{padding:68px 0}
    .section-title{margin-bottom:36px}
    .section-title h2{font-size:30px}
    .section-title p{font-size:13px}

    .why-grid,.service-grid,.project-grid,.pricing-grid,.testimonial-grid{grid-template-columns:1fr}
    .serve-grid{grid-template-columns:1fr}
    .process-grid{grid-template-columns:1fr}
    .brand-grid{grid-template-columns:1fr 1fr}
    .maintenance-benefits{grid-template-columns:1fr 1fr}
    .maintenance-header{align-items:flex-start;flex-direction:column}
    .maintenance-header h3{font-size:22px}
    .review-source-banner{align-items:flex-start;flex-wrap:wrap}
    .review-source-banner .outline-btn{width:100%}
    .service-advice{align-items:flex-start;flex-wrap:wrap}
    .service-advice .outline-btn{width:100%}

    .gallery-grid{grid-template-columns:1fr 1fr}
    .gallery-item img{height:190px}

    .footer-grid{grid-template-columns:1fr;gap:25px}
    .footer-bottom .container{flex-direction:column;text-align:center}

    .mobile-action-bar{
        position:fixed;
        left:0;right:0;bottom:0;
        z-index:1200;
        display:grid;
        grid-template-columns:repeat(3,1fr);
        background:#fff;
        border-top:1px solid #dfe6ee;
        box-shadow:0 -8px 25px rgba(0,0,0,.12);
    }

    .mobile-action-bar a{
        min-height:62px;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:3px;
        text-decoration:none;
        color:var(--rm-blue);
        font-size:9px;
        font-weight:800;
        border-right:1px solid #edf1f5;
    }

    .mobile-action-bar a:last-child{border-right:0;background:var(--rm-orange);color:#fff}
    .mobile-action-bar i{font-size:17px}

    .booking-form{padding:21px}
}

@media (max-width:480px){
    .left-contact span:nth-child(3){display:none}
    .right-contact span:last-child{display:none}
    .nav-wrapper{gap:5px}
    .logo img{width:61px}
    .nav-wrapper ul a{padding-left:6px;padding-right:6px;font-size:9px}
    .book-btn{min-width:76px;font-size:9px}
    .hero{min-height:610px}
    .hero h1{font-size:31px}
    .hero-lead{font-size:12px}
    .hero-buttons{flex-direction:column}
    .btn-primary,.btn-secondary{width:100%}
    .hero-trust{grid-template-columns:1fr;font-size:10px}
    .brand-grid{grid-template-columns:1fr}
    .maintenance-benefits{grid-template-columns:1fr}
    .gallery-grid{grid-template-columns:1fr}
    .gallery-item img{height:225px}
    .contact-actions{flex-direction:column}
}


/* ===== V1.1 readability + button interaction refinement ===== */

.section-title p{
    font-size:16px;
    line-height:1.85;
}

.why-card p,
.serve-card p,
.service-content p,
.project-content p,
.pricing-card li,
.testimonial-card p,
.faq-answer p{
    font-size:14px;
}

.why-card h3,
.serve-card h3{
    font-size:19px;
}

.service-content h3,
.project-content h3{
    font-size:21px;
}

.service-content p{
    min-height:0;
}

.service-btn:hover{
    background:var(--rm-blue-dark);
    color:#fff;
    border-color:var(--rm-blue-dark);
    transform:translateY(-2px);
}

.book-btn:hover{
    color:#fff!important;
    background:var(--rm-orange-dark);
}

.btn-primary:hover,
.submit-btn:hover,
.primary-small:hover{
    color:#fff;
    background:var(--rm-orange-dark);
}

.btn-secondary:hover{
    color:#fff;
    background:#0f9f49;
}

.whatsapp-large:hover{
    color:#fff;
    background:#0f9f49;
    transform:translateY(-2px);
}

.call-large:hover{
    color:var(--rm-blue-dark);
    background:#edf5ff;
    transform:translateY(-2px);
}

.outline-btn:hover{
    color:#fff;
    background:var(--rm-blue);
}

.maintenance-table th{
    font-size:13px;
}

.maintenance-table td{
    font-size:14px;
}

.maintenance-table th small{
    font-size:10px;
}

.benefit{
    font-size:11px;
}

.brand-card span,
.brand-note{
    font-size:12px;
}

.contact-detail span,
.footer-brand p,
.footer-links a,
.footer-contact p{
    font-size:12px;
}

.booking-intro p,
.form-section-title small{
    font-size:12px;
}

.booking-form label{
    font-size:11px;
}

.booking-form input[type="text"],
.booking-form input[type="tel"],
.booking-form input[type="email"],
.booking-form input[type="date"],
.booking-form select,
.booking-form textarea{
    font-size:13px;
}

@media (max-width:768px){
    .section-title p{font-size:14px}
    .why-card p,
    .serve-card p,
    .service-content p,
    .project-content p,
    .pricing-card li,
    .testimonial-card p,
    .faq-answer p{font-size:13px}
    .maintenance-table td{font-size:13px}
}


.maintenance-table th,
.maintenance-table td{
    width:25%;
}

.maintenance-table th:first-child,
.maintenance-table td:first-child{
    width:25%;
}

@media (max-width:768px){
    .maintenance-table{
        min-width:720px;
    }
}

/* ===== V1.2 Premium readability / interaction / booking security ===== */

body{
    font-size:15px;
}

.section-title p,
.contact-info-head p,
.booking-intro p,
.maintenance-note{
    font-size:15px;
    line-height:1.75;
}

.why-card p,
.serve-card p,
.service-content p,
.project-content p,
.testimonial-card p,
.faq-answer p,
.contact-detail span,
.footer-brand p,
.footer-links a,
.footer-contact p{
    font-size:14px;
    line-height:1.7;
}

.why-card h3,
.serve-card h3{
    font-size:18px;
    line-height:1.35;
}

.service-content h3,
.project-content h3{
    font-size:20px;
    line-height:1.35;
}

.footer-links h4,
.footer-contact h4{
    font-size:14px;
    margin-bottom:12px;
}

.footer-bottom{
    font-size:12px;
}

.maintenance-table{
    width:100%;
}

.maintenance-table th,
.maintenance-table td{
    font-size:13px;
    padding:13px 10px;
    text-align:center;
}

.maintenance-table th:first-child,
.maintenance-table td:first-child{
    text-align:left;
}

.maintenance-table th small{
    font-size:10px;
    line-height:1.3;
}

.maintenance-table td:nth-child(2){
    font-weight:700;
    color:#0b4ea2;
}

.maintenance-note{
    font-size:13px;
}

.booking-local-warning{
    margin:12px 0 0;
    padding:11px 13px;
    border:1px solid #f3cf8b;
    background:#fff9eb;
    color:#76530a;
    border-radius:8px;
    line-height:1.55;
}

.booking-local-warning code{
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    font-size:12px;
}

.book-btn:hover,
.btn-primary:hover,
.submit-btn:hover,
.primary-small:hover{
    background:#d96f00;
    color:#fff !important;
    border-color:#d96f00;
    box-shadow:0 8px 20px rgba(217,111,0,.20);
}

.btn-secondary:hover,
.whatsapp-large:hover{
    background:#0d9b48;
    color:#fff !important;
    border-color:#0d9b48;
    box-shadow:0 8px 20px rgba(13,155,72,.18);
}

.service-btn:hover{
    background:#0b4ea2;
    border-color:#0b4ea2;
    color:#fff !important;
    transform:translateY(-2px);
}

.call-large:hover{
    background:#edf5ff;
    color:#0b4ea2 !important;
    border-color:#0b4ea2;
}

@media (max-width: 1100px){
    .maintenance-table-wrapper{
        overflow-x:auto;
    }
    .maintenance-table{
        min-width:850px;
    }
}

@media (max-width:768px){
    body{font-size:14px}
    .section-title p,
    .contact-info-head p,
    .booking-intro p,
    .maintenance-note{
        font-size:14px;
    }
    .why-card p,
    .serve-card p,
    .service-content p,
    .project-content p,
    .testimonial-card p,
    .faq-answer p,
    .contact-detail span,
    .footer-brand p,
    .footer-links a,
    .footer-contact p{
        font-size:13px;
    }
}

/* =========================================================
   RM ACELECT ENGINEERING — V1.3 READABILITY PASS
   Increase small supporting text by one comfortable reading
   size across desktop/tablet while preserving the layout.
   Booking form text is intentionally enlarged for easier use.
   ========================================================= */

/* Global supporting text */
.top-header{font-size:13px}
.nav-wrapper ul a{font-size:14px}
.hero-trust{font-size:13px}
.trust-item span{font-size:13px}
.section-kicker{font-size:12px}

.why-card p{font-size:14px}
.serve-card p{font-size:14px}

.service-tag{font-size:11px}
.service-content p{font-size:14px}
.service-btn{font-size:13px}
.service-advice strong{font-size:15px}
.service-advice p{font-size:13px}
.outline-btn{font-size:12px}

.process-step>span{font-size:11px}
.process-step h3{font-size:16px}
.process-step p{font-size:14px}

.brand-card span{font-size:13px}
.brand-note{font-size:13px}

.project-content span{font-size:11px}
.project-content p{font-size:14px}
.section-cta{font-size:14px}
.primary-small{font-size:12px}

.pricing-note strong{font-size:14px}
.pricing-note p{font-size:13px}
.price-label{font-size:12px}
.pricing-card ul{font-size:13px}
.maintenance-header p{font-size:13px}
.maintenance-table th{font-size:13px}
.maintenance-table tbody td{font-size:14px}
.maintenance-note{font-size:14px}

.review-source-banner strong{font-size:14px}
.review-source-banner span{font-size:12px}
.testimonial-card p{font-size:14px}
.testimonial-card h4{font-size:16px}
.testimonial-card span{font-size:12px}

.faq-question{font-size:15px}
.faq-answer p{font-size:14px}

.contact-info-head p{font-size:14px}
.contact-detail strong{font-size:13px}
.contact-detail span{font-size:13px}
.whatsapp-large,.call-large{font-size:13px}

/* Booking form — larger, more comfortable customer-facing text */
.form-step{font-size:12px}
.booking-intro h3{font-size:24px}
.booking-intro p{font-size:14px}
.form-section-title>span{font-size:11px}
.form-section-title strong{font-size:15px}
.form-section-title small{font-size:12px}
.booking-form label{font-size:13px}
.booking-form input[type="text"],
.booking-form input[type="tel"],
.booking-form input[type="email"],
.booking-form input[type="date"],
.booking-form select,
.booking-form textarea{font-size:14px}
.booking-form textarea{min-height:96px}
.estimate-box span{font-size:13px}
.estimate-box small{font-size:11px}
.estimate-box strong{font-size:26px}
.agree{font-size:13px!important}
.submit-btn{font-size:14px}
#bookingMessage{font-size:13px}
.secure-note{font-size:11px}
.booking-local-warning{font-size:13px}
.booking-local-warning code{font-size:13px}

/* Footer — readable at normal desktop viewing distance */
.footer-brand h3{font-size:18px}
.footer-brand p{font-size:13px}
.footer-mini-actions a{font-size:12px}
.footer-links h4,.footer-contact h4{font-size:15px}
.footer-links a{font-size:13px}
.footer-contact p{font-size:13px}
.footer-bottom p,.footer-bottom a,.footer-bottom span{font-size:12px}

/* Keep the readability upgrade comfortable on smaller screens too. */
@media (max-width:768px){
    .top-header{font-size:12px}
    .nav-wrapper ul a{font-size:11px}
    .hero-trust{font-size:11px}
    .trust-item span{font-size:12px}
    .section-kicker{font-size:12px}
    .why-card p,
    .serve-card p,
    .service-content p,
    .project-content p,
    .testimonial-card p,
    .faq-answer p,
    .contact-detail span,
    .footer-brand p,
    .footer-links a,
    .footer-contact p{font-size:14px}

    .process-step h3{font-size:16px}
    .process-step p{font-size:13px}
    .project-content span,.service-tag{font-size:11px}
    .section-cta{font-size:14px}
    .faq-question{font-size:14px}

    .booking-intro h3{font-size:22px}
    .booking-intro p{font-size:14px}
    .form-section-title strong{font-size:15px}
    .form-section-title small{font-size:12px}
    .booking-form label{font-size:13px}
    .booking-form input[type="text"],
    .booking-form input[type="tel"],
    .booking-form input[type="email"],
    .booking-form input[type="date"],
    .booking-form select,
    .booking-form textarea{font-size:14px}
    .estimate-box span{font-size:13px}
    .estimate-box small{font-size:11px}
    .agree{font-size:13px!important}
    .submit-btn{font-size:14px}
    #bookingMessage{font-size:13px}
    .secure-note{font-size:11px}

    .footer-brand h3{font-size:18px}
    .footer-mini-actions a{font-size:12px}
    .footer-links h4,.footer-contact h4{font-size:15px}
    .footer-bottom p,.footer-bottom a,.footer-bottom span{font-size:12px}
}

/* Final visibility tuning for section introductions and small CTAs */
.section-title p{font-size:16px}
.service-advice p{font-size:14px}
.section-cta{font-size:15px}
.outline-btn{font-size:13px}
.maintenance-table th small{font-size:12px}

@media (max-width:768px){
    .section-title p{font-size:14px}
    .service-advice p{font-size:14px}
    .section-cta{font-size:14px}
    .outline-btn{font-size:12px}
    .maintenance-table th small{font-size:11px}
}


/* =========================================================
   V1.4 LAUNCH POLISH — stable hover states + FAQ + booking
   ========================================================= */

/* Keep CTA hover states decisive and stable — no flicker. */
.book-btn,
.btn-primary,
.submit-btn,
.primary-small,
.service-btn,
.outline-btn,
.btn-secondary,
.whatsapp-large,
.call-large{
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    will-change:transform,background-color,box-shadow;
}

.book-btn:hover,
.book-btn:focus-visible{
    background:var(--rm-orange-dark) !important;
    background-image:none !important;
    color:#fff !important;
    border-color:var(--rm-orange-dark) !important;
    transform:translateY(-2px);
    box-shadow:0 14px 28px rgba(217,119,6,.28);
}

.submit-btn:hover,
.submit-btn:focus-visible{
    background:var(--rm-orange-dark) !important;
    background-image:none !important;
    color:#fff !important;
    border-color:var(--rm-orange-dark) !important;
    transform:translateY(-2px);
    box-shadow:0 14px 28px rgba(217,119,6,.24);
}

.primary-small:hover,
.primary-small:focus-visible{
    background:var(--rm-orange-dark) !important;
    background-image:none !important;
    color:#fff !important;
    transform:translateY(-2px);
    box-shadow:0 10px 22px rgba(217,119,6,.20);
}

.btn-primary:hover,
.btn-primary:focus-visible{
    background:var(--rm-orange-dark) !important;
    background-image:none !important;
    color:#fff !important;
    border-color:var(--rm-orange-dark) !important;
    transform:translateY(-2px);
}

.btn-secondary:hover,
.btn-secondary:focus-visible,
.whatsapp-large:hover,
.whatsapp-large:focus-visible{
    background:#0d9b48 !important;
    background-image:none !important;
    color:#fff !important;
    border-color:#0d9b48 !important;
    transform:translateY(-2px);
}

/* Footer bottom links should read like intentional secondary actions. */
.footer-bottom{
    font-size:14px;
}
.footer-bottom p,
.footer-bottom a,
.footer-bottom span{
    font-size:14px;
    line-height:1.7;
}
.footer-bottom a{
    font-weight:700;
    text-decoration:none;
}
.footer-bottom a:hover,
.footer-bottom a:focus-visible{
    color:#8beaf4 !important;
    text-decoration:underline;
    text-underline-offset:3px;
}

/* FAQ: clearer question/answer hierarchy and easier scanning. */
.faq-question{
    min-height:66px;
    padding:18px 21px;
    font-size:16px;
    line-height:1.45;
}
.faq-answer{
    padding:0 21px 22px;
}
.faq-answer p{
    font-size:15px;
    line-height:1.8;
}
.faq-question span{
    font-size:22px;
    min-width:24px;
    text-align:center;
}

/* Booking form: customer-facing controls get a calm, premium finish. */
#contact .booking-form label{
    font-size:14px;
    line-height:1.45;
}
#contact .booking-form input[type="text"],
#contact .booking-form input[type="tel"],
#contact .booking-form input[type="email"],
#contact .booking-form input[type="date"],
#contact .booking-form select,
#contact .booking-form textarea{
    min-height:52px;
    font-size:15px;
    line-height:1.5;
}
#contact .booking-form textarea{
    min-height:108px;
}
#contact .form-section-title strong{
    font-size:16px;
}
#contact .form-section-title small{
    font-size:13px;
}
#contact .booking-intro p{
    font-size:15px;
    line-height:1.75;
}
#contact .estimate-box span{
    font-size:14px;
}
#contact .estimate-box small{
    font-size:12px;
}
#contact .agree{
    font-size:14px !important;
    line-height:1.6;
}
#contact .submit-btn{
    min-height:56px;
    font-size:15px;
}
#contact .secure-note{
    font-size:12px;
    line-height:1.6;
}

/* Maintenance pricing: make the new Bi-Monthly column visually intentional. */
.maintenance-table th,
.maintenance-table tbody td{
    vertical-align:middle;
}
.maintenance-table th:first-child{
    white-space:nowrap;
}

@media (max-width:768px){
    .footer-bottom,
    .footer-bottom p,
    .footer-bottom a,
    .footer-bottom span{font-size:13px}
    .faq-question{
        min-height:60px;
        padding:16px 17px;
        font-size:15px;
    }
    .faq-answer{padding:0 17px 19px}
    .faq-answer p{font-size:14px}
    #contact .booking-form label{font-size:14px}
    #contact .booking-form input[type="text"],
    #contact .booking-form input[type="tel"],
    #contact .booking-form input[type="email"],
    #contact .booking-form input[type="date"],
    #contact .booking-form select,
    #contact .booking-form textarea{font-size:15px}
    #contact .submit-btn{font-size:15px}
}

/* =========================================================
   V1.5 PREMIUM EXPERIENCE + RESPONSIVE POLISH
   ========================================================= */

/* Stable, obvious CTA hover — colour change only, no jump/flicker. */
.book-btn,
.submit-btn,
.primary-small,
.btn-primary,
.btn-secondary,
.service-btn,
.outline-btn,
.whatsapp-large,
.call-large{
    transition:
        background-color .18s ease,
        border-color .18s ease,
        color .18s ease,
        box-shadow .18s ease,
        opacity .18s ease;
}

.book-btn:hover,
.book-btn:focus-visible{
    background:#c65f00 !important;
    background-image:none !important;
    color:#fff !important;
    border-color:#c65f00 !important;
    transform:none !important;
    box-shadow:0 12px 26px rgba(198,95,0,.30);
}

.submit-btn:hover,
.submit-btn:focus-visible{
    background:#c65f00 !important;
    background-image:none !important;
    color:#fff !important;
    border-color:#c65f00 !important;
    transform:none !important;
    box-shadow:0 12px 26px rgba(198,95,0,.26);
}

.primary-small:hover,
.primary-small:focus-visible,
.btn-primary:hover,
.btn-primary:focus-visible{
    background:#c65f00 !important;
    background-image:none !important;
    color:#fff !important;
    border-color:#c65f00 !important;
    transform:none !important;
    box-shadow:0 10px 22px rgba(198,95,0,.24);
}

.service-btn:hover,
.service-btn:focus-visible{
    background:#073875 !important;
    color:#fff !important;
    border-color:#073875 !important;
    transform:none !important;
    box-shadow:0 8px 20px rgba(7,56,117,.16);
}

.btn-secondary:hover,
.btn-secondary:focus-visible,
.whatsapp-large:hover,
.whatsapp-large:focus-visible{
    background:#0b8f43 !important;
    background-image:none !important;
    color:#fff !important;
    border-color:#0b8f43 !important;
    transform:none !important;
    box-shadow:0 9px 20px rgba(11,143,67,.20);
}

.call-large:hover,
.call-large:focus-visible{
    background:#eaf3ff !important;
    color:var(--rm-blue-dark) !important;
    border-color:#b9d2ed !important;
    transform:none !important;
    box-shadow:0 9px 20px rgba(10,67,141,.12);
}

/* Maintenance table — equal desktop columns and a clean recommended column. */
.maintenance-table{
    width:100%;
    min-width:900px;
    table-layout:fixed;
}

.maintenance-table th,
.maintenance-table td{
    width:19.25%;
    vertical-align:middle;
}

.maintenance-table th:first-child,
.maintenance-table td:first-child{
    width:23%;
}

.maintenance-table th{
    min-height:92px;
    padding:17px 12px;
    line-height:1.45;
}

.maintenance-table th small{
    display:block;
    margin-top:5px;
    line-height:1.35;
}

.maintenance-table .recommended-col{
    position:relative;
    box-shadow:inset 1px 0 #f2dfbf, inset -1px 0 #f2dfbf;
}

.maintenance-table .recommended-col::before{
    content:"MOST POPULAR";
    display:block;
    margin:-7px 0 5px;
    font-size:9px;
    letter-spacing:1px;
    font-weight:900;
    color:#b26b00;
}

.maintenance-table thead .recommended-col{
    padding-top:11px;
}

.maintenance-table tbody td{
    height:50px;
}

.maintenance-table tbody td:nth-child(2){
    font-weight:800;
    color:var(--rm-blue);
}

/* Brand grid: 10 cards sit cleanly on desktop, including the longer MHI name. */
.brand-grid{
    grid-template-columns:repeat(5,1fr);
    gap:18px;
}

.brand-card{
    min-height:126px;
    padding:24px 15px;
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.brand-card strong{
    font-size:20px;
    line-height:1.25;
}

.brand-card span{
    margin-top:8px;
    font-size:13px;
}

.brand-card:nth-child(1) strong{color:#0b4ea2}
.brand-card:nth-child(2) strong{color:#111827}
.brand-card:nth-child(3) strong{color:#0b4ea2}
.brand-card:nth-child(4) strong{color:#0b4ea2}
.brand-card:nth-child(5) strong{color:#c0003d}
.brand-card:nth-child(6) strong{color:#1239a8}
.brand-card:nth-child(7) strong{color:#e30613}
.brand-card:nth-child(8) strong{color:#e30613}
.brand-card:nth-child(9) strong{color:#e30613}
.brand-card.brand-mhi strong{color:#c8102e}

/* Customer connection / reassurance. */
.service-advice{
    margin-top:30px;
    padding:22px 24px;
    border-radius:16px;
    border:1px solid #d8e5f3;
    background:
        linear-gradient(135deg,#f8fbff,#eef6ff);
    box-shadow:0 12px 35px rgba(10,55,100,.07);
}

.service-advice strong{
    font-size:16px;
    color:var(--rm-blue-dark);
}

.service-advice p{
    font-size:14px;
    line-height:1.75;
}

.booking-form{
    box-shadow:0 28px 75px rgba(4,31,70,.20);
}

.booking-next-steps{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
    margin-top:18px;
    padding:14px;
    border:1px solid #dbe7f3;
    border-radius:13px;
    background:#f7faff;
}

.next-step{
    display:flex;
    align-items:flex-start;
    gap:9px;
}

.next-step>span{
    width:26px;
    height:26px;
    flex:0 0 26px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#e8f1ff;
    color:var(--rm-blue);
    font-size:11px;
    font-weight:900;
}

.next-step strong{
    display:block;
    color:var(--rm-blue-dark);
    font-size:12px;
    line-height:1.35;
}

.next-step small{
    display:block;
    margin-top:3px;
    color:var(--muted);
    font-size:11px;
    line-height:1.55;
}

.booking-help-note{
    display:flex;
    gap:11px;
    align-items:flex-start;
    margin-top:12px;
    padding:13px 15px;
    border-radius:11px;
    background:#fff8eb;
    border:1px solid #f3d59b;
    color:#71530f;
}

.booking-help-note>i{
    color:var(--rm-orange-dark);
    margin-top:3px;
}

.booking-help-note strong{
    display:block;
    color:#7b5100;
    font-size:12px;
}

.booking-help-note span{
    display:block;
    margin-top:2px;
    font-size:11px;
    line-height:1.6;
}

/* FAQ feels more like a guided knowledge centre. */
.faq-item{
    transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.faq-item:hover{
    border-color:#cbdced;
    box-shadow:0 10px 28px rgba(9,55,104,.06);
}

.faq-question{
    min-height:62px;
    padding:19px 22px;
}

.faq-question span{
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    flex:0 0 28px;
    border-radius:50%;
    background:#fff3e2;
    font-size:19px;
    line-height:1;
}

.faq-item.active .faq-question span{
    background:var(--rm-orange);
    color:#fff;
}

.faq-answer{
    padding:0 22px 22px;
}

.faq-answer p{
    font-size:14px;
    line-height:1.9;
}

/* Footer service strip gives the site a stronger final customer action. */
.footer-service-strip{
    border-top:1px solid rgba(255,255,255,.08);
    border-bottom:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.025);
}

.footer-service-strip .container{
    min-height:76px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
}

.footer-service-strip strong{
    display:block;
    color:#fff;
    font-size:14px;
}

.footer-service-strip span{
    display:block;
    margin-top:2px;
    color:#8fa4bb;
    font-size:12px;
    line-height:1.6;
}

.footer-service-strip a{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 15px;
    border:1px solid rgba(103,226,239,.35);
    border-radius:9px;
    color:#dffbff;
    text-decoration:none;
    font-size:12px;
    font-weight:800;
    transition:.18s ease;
}

.footer-service-strip a:hover{
    background:#0b4ea2;
    border-color:#0b4ea2;
    color:#fff;
}

/* Accessibility / touch targets. */
button,
a{
    -webkit-tap-highlight-color:transparent;
}

.book-btn:focus-visible,
.submit-btn:focus-visible,
.service-btn:focus-visible,
.primary-small:focus-visible,
.faq-question:focus-visible,
.footer-service-strip a:focus-visible{
    outline:3px solid rgba(53,213,232,.55);
    outline-offset:3px;
}

/* Desktop/tablet navigation toggle is hidden; mobile gets a proper menu. */
.nav-toggle{
    display:none;
    border:0;
    background:#edf4ff;
    color:var(--rm-blue-dark);
    width:42px;
    height:42px;
    border-radius:10px;
    cursor:pointer;
    font-size:18px;
}

@media (max-width:1100px){
    .brand-grid{grid-template-columns:repeat(3,1fr)}
}

@media (max-width:768px){
    .nav-toggle{
        display:grid;
        place-items:center;
        flex:0 0 42px;
    }

    .nav-wrapper{
        position:relative;
        min-height:70px;
    }

    .nav-wrapper ul{
        position:absolute;
        left:0;
        right:0;
        top:calc(100% + 1px);
        display:none;
        flex-direction:column;
        align-items:stretch;
        justify-content:flex-start;
        gap:0;
        max-height:calc(100vh - 80px);
        overflow-y:auto;
        background:#fff;
        border:1px solid #e1e8f0;
        border-top:0;
        box-shadow:0 18px 35px rgba(6,31,69,.13);
        border-radius:0 0 14px 14px;
    }

    .nav-wrapper ul.open{display:flex}

    .nav-wrapper ul a{
        padding:15px 18px;
        font-size:13px;
        border-bottom:1px solid #edf1f5;
    }

    .nav-wrapper ul li:last-child a{border-bottom:0}

    .nav-wrapper ul a::after{
        left:18px;
        right:auto;
        bottom:9px;
        width:30px;
    }

    .nav-wrapper .book-btn{
        margin-left:auto;
        min-width:104px;
        height:42px;
        font-size:11px;
    }

    .brand-grid{
        grid-template-columns:1fr 1fr;
        gap:14px;
    }

    .brand-card{
        min-height:118px;
    }

    .brand-card strong{
        font-size:18px;
    }

    .maintenance-table{
        min-width:900px;
    }

    .booking-next-steps{
        grid-template-columns:1fr;
    }

    .footer-service-strip .container{
        flex-direction:column;
        align-items:flex-start;
        padding:18px 0;
    }

    .footer-service-strip a{
        width:100%;
        justify-content:center;
    }
}

@media (max-width:480px){
    .brand-grid{grid-template-columns:1fr}
    .brand-card{min-height:108px}

    .booking-help-note{
        padding:12px;
    }

    .footer-service-strip span{
        font-size:11px;
    }
}

/* =========================================================
   V1.6 PREMIUM CUSTOMER-CONNECTION PASS
   ========================================================= */

/* Maintenance table: equal visual weight and no squeezed Quarterly corner. */
.maintenance-table{
    min-width:980px;
    table-layout:fixed;
}

.maintenance-table th,
.maintenance-table td{
    width:19.25%;
    box-sizing:border-box;
}

.maintenance-table th:first-child,
.maintenance-table td:first-child{
    width:23%;
}

.maintenance-table th{
    padding:18px 12px 17px;
    min-height:108px;
    line-height:1.35;
}

.maintenance-table th .plan-name{
    display:block;
    font-size:13px;
    font-weight:900;
    white-space:nowrap;
}

.maintenance-table th small{
    display:block;
    margin-top:6px;
    font-size:11px;
    line-height:1.35;
}

.maintenance-table .recommended-col{
    background:#fff8ed !important;
    color:#9a5a00 !important;
    box-shadow:inset 1px 0 #efd9b8,inset -1px 0 #efd9b8;
}

.maintenance-table thead .recommended-col{
    background:#fff7e8 !important;
    color:#8c5400 !important;
    border-top:4px solid #f3a51d;
}

.maintenance-table .plan-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin:7px auto 0;
    padding:4px 8px;
    border-radius:999px;
    background:#f3a51d;
    color:#fff;
    font-size:9px;
    line-height:1;
    font-weight:900;
    letter-spacing:.25px;
    white-space:nowrap;
}

/* Replace the earlier pseudo label which made the recommended header crowded. */
.maintenance-table .recommended-col::before{
    content:none !important;
}

.maintenance-table tbody .recommended-col{
    font-size:14px;
    font-weight:900;
}

/* Customer guidance section. */
.service-guide{
    margin-top:22px;
    padding:25px;
    border:1px solid #d9e6f3;
    border-radius:18px;
    background:linear-gradient(135deg,#f9fcff 0%,#eef6ff 100%);
    box-shadow:0 14px 40px rgba(8,54,105,.07);
}

.service-guide-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:25px;
    margin-bottom:18px;
}

.service-guide-head h3{
    margin:4px 0 6px;
    color:var(--rm-blue-dark);
    font-size:22px;
}

.service-guide-head p{
    max-width:760px;
    margin:0;
    color:var(--muted);
    font-size:14px;
    line-height:1.75;
}

.guide-direct-link{
    flex:0 0 auto;
    color:var(--rm-blue);
    font-size:12px;
    font-weight:900;
    text-decoration:none;
}

.guide-direct-link:hover{color:var(--rm-orange-dark)}

.service-guide-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
}

.guide-card{
    display:flex;
    flex-direction:column;
    min-height:205px;
    padding:18px;
    border:1px solid #dce8f4;
    border-radius:14px;
    background:#fff;
    box-shadow:0 8px 24px rgba(7,55,117,.045);
    transition:border-color .18s ease,box-shadow .18s ease;
}

.guide-card:hover{
    border-color:#b9d2eb;
    box-shadow:0 14px 28px rgba(7,55,117,.10);
}

.guide-icon{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:#eaf3ff;
    color:var(--rm-blue);
    margin-bottom:12px;
}

.guide-card strong{
    color:var(--rm-blue-dark);
    font-size:15px;
    line-height:1.4;
}

.guide-card p{
    margin:5px 0 0;
    color:var(--muted);
    font-size:12px;
    line-height:1.65;
}

.guide-action{
    margin-top:auto;
    padding:9px 0 0;
    border:0;
    background:transparent;
    color:var(--rm-blue);
    text-align:left;
    font-size:11px;
    font-weight:900;
    cursor:pointer;
}

.guide-action:hover{color:var(--rm-orange-dark)}

.service-guide-foot{
    display:flex;
    gap:10px;
    margin-top:14px;
    padding-top:13px;
    border-top:1px solid #dbe6f1;
    color:#5d6f82;
    font-size:11px;
    line-height:1.7;
}

.service-guide-foot i{color:var(--rm-orange);margin-top:3px}

.service-guide-foot strong{color:#324d68}

/* FAQ search bar */
.faq-tools{
    display:flex;
    align-items:center;
    gap:12px;
    max-width:850px;
    margin:0 auto 18px;
    padding:10px 12px;
    border:1px solid #d9e5f0;
    border-radius:12px;
    background:#fff;
    box-shadow:0 8px 25px rgba(7,55,117,.05);
}

.faq-tools label{
    display:inline-flex;
    align-items:center;
    gap:7px;
    flex:0 0 auto;
    color:var(--rm-blue-dark);
    font-size:12px;
    font-weight:900;
}

.faq-tools label i{color:var(--rm-orange)}

.faq-tools input{
    min-width:0;
    flex:1;
    border:0 !important;
    outline:0;
    padding:8px 4px !important;
    background:transparent;
    font-size:13px !important;
    box-shadow:none !important;
}

.faq-tools input::placeholder{color:#9aa9b8}

.faq-tools>span{
    flex:0 0 auto;
    color:#7a8b9d;
    font-size:10px;
    font-weight:700;
    white-space:nowrap;
}

/* More polished mobile behavior */
@media (max-width:1100px){
    .service-guide-grid{grid-template-columns:repeat(2,1fr)}
    .maintenance-table{min-width:980px}
}

@media (max-width:768px){
    .service-guide{
        padding:19px;
        border-radius:15px;
    }

    .service-guide-head{
        align-items:flex-start;
        flex-direction:column;
        gap:9px;
    }

    .service-guide-head h3{font-size:20px}
    .service-guide-head p{font-size:13px}

    .service-guide-grid{grid-template-columns:1fr 1fr}

    .guide-card{
        min-height:190px;
        padding:15px;
    }

    .maintenance-table{
        min-width:980px;
    }

    .maintenance-table th .plan-name{font-size:12px}

    .faq-tools{
        align-items:flex-start;
        flex-wrap:wrap;
        padding:11px 13px;
    }

    .faq-tools label{width:100%}
    .faq-tools input{
        width:100%;
        flex-basis:100%;
        order:2;
    }

    .faq-tools>span{
        order:3;
        margin-left:auto;
    }
}

@media (max-width:480px){
    .service-guide-grid{grid-template-columns:1fr}

    .guide-card{
        min-height:0;
    }

    .guide-action{
        margin-top:14px;
    }
}

/* Respect reduced-motion preferences for a calmer premium experience. */
@media (prefers-reduced-motion:reduce){
    *,*::before,*::after{
        scroll-behavior:auto !important;
        transition-duration:.01ms !important;
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
    }
}


/* =========================================================
   V1.7 FINAL — STABLE CTA HOVER
   Colour/shadow only. No transform, movement or animation.
   ========================================================= */
.book-btn,
.submit-btn,
#contact .submit-btn {
    transform: none !important;
    transition: background-color .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}

.book-btn:hover,
.book-btn:focus-visible {
    background: #d86f00 !important;
    color: #fff !important;
    transform: none !important;
    box-shadow: 0 10px 22px rgba(216,111,0,.22) !important;
}

.submit-btn {
    background: #f7941d !important;
}

.submit-btn:hover,
.submit-btn:focus-visible,
#contact .submit-btn:hover,
#contact .submit-btn:focus-visible {
    background: #d86f00 !important;
    color: #fff !important;
    transform: none !important;
    box-shadow: 0 10px 22px rgba(216,111,0,.22) !important;
}

.book-btn:active,
.submit-btn:active,
#contact .submit-btn:active {
    transform: none !important;
}

/* =========================================================
   V1.7 — MAINTENANCE TABLE
   Equal plan columns with a wider unit-name column.
   ========================================================= */
.maintenance-table {
    width: 100%;
    min-width: 900px;
    table-layout: fixed !important;
}

.maintenance-table th,
.maintenance-table td {
    width: 18.5% !important;
    vertical-align: middle;
}

.maintenance-table th:first-child,
.maintenance-table td:first-child {
    width: 26% !important;
    text-align: left;
}

.maintenance-table th {
    white-space: normal !important;
}

.maintenance-table .plan-name {
    display: block;
    line-height: 1.2;
}

.maintenance-table th small {
    display: block;
    margin-top: 6px;
    font-size: 13px !important;
    line-height: 1.35;
}

.maintenance-table .recommended-col {
    width: 18.5% !important;
}

/* MHI brand identity */
.brand-mhi strong {
    color: #e30613 !important;
}

/* Keep form controls comfortably readable without enlarging the whole form. */
#contact .booking-form label {
    font-size: 14px !important;
}

#contact .booking-form input,
#contact .booking-form select,
#contact .booking-form textarea {
    font-size: 15px !important;
}

#contact .booking-form .form-section-title strong {
    font-size: 16px !important;
}

#contact .booking-form .form-section-title small {
    font-size: 13px !important;
}


/* =========================================================
   V1.9 PREMIUM CONTACT + BOOKING EXPERIENCE
   Front-end only. Existing booking IDs/names/action preserved.
   ========================================================= */

/* Contact area: one clean full-width contact band, then booking. */
#contact .contact-grid{
    grid-template-columns:1fr;
    gap:28px;
    align-items:stretch;
}

#contact .contact-info{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:18px;
    padding:28px;
    align-items:stretch;
}

#contact .contact-info-head{
    grid-column:1 / -1;
    padding-bottom:4px;
}

#contact .contact-info-head h3{
    font-size:28px;
    margin:7px 0 8px;
}

#contact .contact-info-head p{
    max-width:900px;
    font-size:14px;
    line-height:1.7;
}

#contact .contact-detail{
    margin-top:0;
    min-height:92px;
    padding:17px 15px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:14px;
    background:rgba(255,255,255,.045);
}

#contact .contact-detail>i{
    width:40px;
    height:40px;
    border-radius:11px;
}

#contact .contact-detail strong{font-size:12px;margin-bottom:3px}
#contact .contact-detail span{font-size:12px;line-height:1.65}

#contact .contact-actions{
    grid-column:1 / -1;
    justify-content:flex-start;
    margin-top:2px;
}

/* Booking card: wider, calmer and much shorter on desktop. */
#contact .booking-form{
    padding:32px 34px 30px;
}

#contact .booking-intro h3{font-size:24px}
#contact .booking-intro p{font-size:14px;line-height:1.7}

#contact .form-section{
    padding:22px 0;
}

#contact .form-section-title{
    margin-bottom:18px;
}

#contact .form-section-title strong{font-size:15px}
#contact .form-section-title small{font-size:12px;line-height:1.5}

#contact .field-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 18px;
    align-items:start;
}

#contact .field-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
#contact .field-full{grid-column:1 / -1}

#contact .field-group{min-width:0}

#contact .booking-form label{
    font-size:12px;
    margin:12px 0 7px;
}

#contact .booking-form input[type="text"],
#contact .booking-form input[type="tel"],
#contact .booking-form input[type="email"],
#contact .booking-form input[type="date"],
#contact .booking-form select,
#contact .booking-form textarea{
    font-size:14px;
    min-height:48px;
    padding:13px 14px;
}

#contact .booking-form textarea{min-height:100px}

#contact .maintenance-plan-row{
    margin-top:0;
}

#contact .estimate-box{
    margin-top:24px;
    padding:20px 22px;
    border-radius:14px;
}

#contact .estimate-box span{font-size:14px}
#contact .estimate-box small{font-size:12px}
#contact .estimate-box strong{font-size:25px}

#contact .agree{font-size:13px;margin-top:17px}
#contact .secure-note{font-size:11px}

#contact .submit-btn{
    min-height:56px;
    font-size:15px;
    background:var(--rm-orange);
    background-image:none;
    transition:background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;
}

#contact .submit-btn:hover,
#contact .submit-btn:focus-visible{
    background:#0b4ea2 !important;
    background-image:none !important;
    color:#fff !important;
    transform:none !important;
    box-shadow:0 10px 24px rgba(11,78,162,.24);
}

#contact .booking-next-steps{
    margin-top:18px;
}

#contact .booking-help-note{
    margin-top:14px;
}

/* Header Book Service: colour-only hover, no flicker/jump. */
.book-btn:hover,
.book-btn:focus-visible{
    background:#0b4ea2 !important;
    background-image:none !important;
    color:#fff !important;
    border-color:#0b4ea2 !important;
    transform:none !important;
    box-shadow:0 10px 24px rgba(11,78,162,.24) !important;
}

/* Contact action buttons: stable colour transitions. */
#contact .whatsapp-large,
#contact .call-large{
    transition:background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;
}

#contact .whatsapp-large:hover{background:#0b4ea2 !important;color:#fff !important}
#contact .call-large:hover{background:#0b4ea2 !important;color:#fff !important}

/* Tablet */
@media (max-width:1100px){
    #contact .contact-info{grid-template-columns:repeat(3,minmax(0,1fr))}
    #contact .contact-info-head{grid-column:1 / -1}
    #contact .contact-actions{grid-column:1 / -1}
}

/* Mobile: single-column fields and touch-friendly actions. */
@media (max-width:768px){
    #contact .contact-grid{gap:20px}

    #contact .contact-info{
        grid-template-columns:repeat(2,minmax(0,1fr));
        padding:22px 18px;
        gap:12px;
    }

    #contact .contact-info-head,
    #contact .contact-actions{grid-column:1 / -1}

    #contact .contact-info-head h3{font-size:24px}
    #contact .contact-info-head p{font-size:14px}

    #contact .contact-detail{
        min-height:0;
        padding:15px 13px;
    }

    #contact .contact-detail span{font-size:12px}

    #contact .contact-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:10px;
    }

    #contact .whatsapp-large,
    #contact .call-large{width:100%;font-size:12px}

    #contact .booking-form{padding:24px 18px}
    #contact .booking-intro{gap:10px}
    #contact .booking-intro h3{font-size:22px}
    #contact .booking-intro p{font-size:14px}

    #contact .field-grid,
    #contact .field-grid-2{grid-template-columns:1fr;gap:0}
    #contact .field-full{grid-column:auto}

    #contact .booking-form label{font-size:12px}
    #contact .booking-form input[type="text"],
    #contact .booking-form input[type="tel"],
    #contact .booking-form input[type="email"],
    #contact .booking-form input[type="date"],
    #contact .booking-form select,
    #contact .booking-form textarea{font-size:15px;min-height:50px}

    #contact .estimate-box{padding:17px}
    #contact .estimate-box strong{font-size:22px}

    #contact .submit-btn{min-height:56px;font-size:15px}
}

@media (max-width:480px){
    #contact .contact-info{grid-template-columns:1fr}
    #contact .contact-info-head,
    #contact .contact-actions{grid-column:auto}
    #contact .contact-actions{grid-template-columns:1fr}
    #contact .booking-form{padding:21px 15px}
}

@media (prefers-reduced-motion:reduce){
    #contact .submit-btn,
    .book-btn,
    #contact .whatsapp-large,
    #contact .call-large{transition:none !important}
}

/* =========================================================
   RMBMS PUBLIC WEBSITE — CONTACT / BOOKING PREMIUM V5
   Final desktop alignment + readability refinement
   ========================================================= */
@media (min-width:769px){
    .top-header .top-contact{
        width:calc(100% - 36px);
        max-width:1420px;
        min-height:44px;
        margin:0 auto;
        padding:0;
        display:grid;
        grid-template-columns:minmax(0,1fr) minmax(0,auto);
        align-items:center;
        gap:24px;
    }
    .top-header .left-contact,.top-header .right-contact{
        display:flex; align-items:center; flex-wrap:nowrap;
        white-space:nowrap; gap:20px; min-width:0;
    }
    .top-header .right-contact{justify-content:flex-end}
    .top-header{font-size:11px}
    .top-header .top-hours{white-space:nowrap;font-size:11px;font-weight:600}
}
@media (min-width:1101px){
    #contact .contact-info{
        display:grid; grid-template-columns:repeat(6,minmax(0,1fr));
        gap:16px; padding:30px;
    }
    #contact .contact-info-head,#contact .contact-actions{grid-column:1/-1}
    #contact .contact-detail:nth-of-type(2){grid-column:1/span 2}
    #contact .contact-detail:nth-of-type(3){grid-column:3/span 2}
    #contact .contact-detail:nth-of-type(4){grid-column:5/span 2}
    #contact .contact-detail:nth-of-type(5){grid-column:2/span 2}
    #contact .contact-detail:nth-of-type(6){grid-column:4/span 2}
    #contact .contact-detail{
        min-height:128px; margin-top:0; padding:19px 17px;
        align-items:flex-start;
    }
    #contact .contact-detail>i{width:42px;height:42px;flex:0 0 42px;border-radius:11px}
    #contact .contact-detail strong{font-size:13px;line-height:1.4;margin-bottom:6px}
    #contact .contact-detail span,#contact .contact-detail a{font-size:13px;line-height:1.6}
    #contact .contact-email-content{
        min-width:0;display:flex;flex-direction:column;align-items:flex-start;
    }
    #contact .contact-email-content .primary-email,
    #contact .contact-email-content .booking-email{
        display:block; white-space:nowrap; word-break:normal; overflow-wrap:normal;
        color:#fff; font-size:13px; font-weight:800;
    }
    #contact .contact-email-content .email-booking-label{
        display:flex;align-items:center;gap:5px;margin-top:8px;
        color:rgba(255,255,255,.68);font-size:10px;line-height:1.4;
    }
    #contact .contact-email-content .email-booking-label i{color:#67e2ef;font-size:9px}
    #contact .contact-email-content .booking-email{margin-top:2px}
}
#contact .booking-verification{
    width:100%; min-height:72px; margin:20px 0 8px; padding:10px 18px;
    display:flex; align-items:center; justify-content:center; gap:30px;
    box-sizing:border-box; border:1px solid #dbe6ef; border-radius:13px;
    background:linear-gradient(180deg,#fbfdff,#f7fafd);
}
#contact .booking-verification .agree{
    display:flex!important; align-items:center; justify-content:flex-end; gap:9px;
    margin:0!important; min-height:40px; color:#52677d!important;
    font-size:13px!important; font-weight:700!important; line-height:1.45; white-space:nowrap;
}
#contact .booking-verification .agree input{
    width:18px;height:18px;flex:0 0 18px;margin:0!important;accent-color:var(--rm-blue);
}
#contact .booking-verification #turnstileWidget{
    width:300px; min-height:65px; flex:0 0 300px; margin:0!important; padding:0!important;
    display:flex; align-items:center; justify-content:flex-start;
}
#contact .booking-verification #turnstileWidget iframe{display:block}
#contact .secure-note{margin-top:13px;font-size:12px!important;line-height:1.6}
#contact .booking-next-steps{gap:16px;padding:18px 20px}
#contact .next-step>span{width:30px;height:30px;flex:0 0 30px}
#contact .next-step strong{font-size:12px;line-height:1.45}
#contact .next-step small{font-size:10px;line-height:1.55}
#contact .booking-help-note strong{font-size:11px}
#contact .booking-help-note span{font-size:10px;line-height:1.65}
.site-footer p small{font-size:10px;line-height:1.6}
@media (max-width:1100px) and (min-width:769px){
    .top-header .top-contact{width:calc(100% - 28px);gap:14px}
    .top-header .left-contact,.top-header .right-contact{gap:12px;flex-wrap:nowrap}
    .top-header{font-size:10px}.top-header .top-hours{font-size:10px}
    #contact .contact-info{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
    #contact .contact-detail{min-height:120px}
}
@media (max-width:768px){
    #contact .booking-verification{
        flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:12px;
    }
    #contact .booking-verification .agree{justify-content:center;white-space:normal}
    #contact .booking-verification #turnstileWidget{
        width:300px;flex-basis:65px;justify-content:center;
    }
    #contact .contact-email-content .primary-email,
    #contact .contact-email-content .booking-email{
        display:block;font-size:13px;line-height:1.55;white-space:nowrap;
    }
    #contact .contact-email-content .email-booking-label{display:flex;margin-top:5px;font-size:10px}
}
@media (max-width:480px){
    #contact .booking-verification #turnstileWidget{width:100%;max-width:300px}
    #contact .contact-email-content .primary-email,
    #contact .contact-email-content .booking-email{white-space:normal;overflow-wrap:anywhere}
}