:root{
  --navy:#1f2f52;
  --heading:#22396a;
  --blue:#0070c0;
  --orange:#ff7518;
  --footer:#00305e;
  --bg:#fafafa;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px;-webkit-text-size-adjust:100%}
body{font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:#1e2b4a;overflow-x:hidden}
img,video{max-width:100%;height:auto}
.nb-container{max-width:1000px}
@media (min-width:1200px){.site-header .nb-container{max-width:1180px}}

/* ---------- Buttons: hover = white bg, orange text, orange border ---------- */
.btn-nb,.btn-nb-orange{
  font-weight:700;letter-spacing:.5px;border-radius:4px;border:2px solid transparent;
  padding:.55rem 1.6rem;transition:all .25s ease;
}
.btn-nb{background:var(--blue);color:#fff;border-color:var(--blue)}
.btn-nb-orange{background:var(--orange);color:#fff;border-color:var(--orange)}
.btn-nb:hover,.btn-nb:focus,.btn-nb:active,
.btn-nb-orange:hover,.btn-nb-orange:focus,.btn-nb-orange:active,
.quick-enquiry:hover{
  background:#fff!important;color:var(--orange)!important;border-color:var(--orange)!important;
}

/* ---------- Header ---------- */
.site-header{background:#fff;
    /* position:sticky;
    top:0;
    z-index:1030; */
    box-shadow:0 1px 4px rgba(0,0,0,.08)}
.navbar{padding:.35rem 0}
.logo{height:72px;width:auto;max-width:100%;display:block}
.navbar .nav-link{
  color:#1f2f52;font-size:.9rem;font-weight:500;text-transform:uppercase;padding:.5rem 1rem;transition:color .2s;
}
.navbar .nav-link:hover,.navbar .nav-link.active{color:var(--orange)}

/* ---------- Hero carousel ---------- */
.hero{height:clamp(420px,52vw,500px);background:#bfe0f5}
.hero .carousel-inner,.hero .carousel-item{height:100%}
.hero .carousel-item{
  background-repeat:no-repeat;background-color:#a9d4ee;
  background-position:center;
}
.slide-1{background-image:url(assets/hero-1.webp),linear-gradient(90deg,#b7dcf2,#a6d0e8 45%,#b5d8a8 70%,#9cc77d)}
.slide-1,.slide-2,.slide-3{
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat;
}
.slide-2{background-image:url(assets/slide2.webp),linear-gradient(90deg,#1f2f52,#2f4a7a 50%,#4c8a3a)}
.slide-3{background-image:url(assets/slide3.webp),linear-gradient(90deg,#2d4263,#3c5a7a 55%,#7aa86a)}
.hero-wrap{height:100%;position:relative}
.hero-card{
  position:absolute;left:40%;top:50%;transform:translateY(-50%);
  width:min(640px,92%);margin-left:-60px;
  background:rgba(255,255,255,.82);border-radius:12px;padding:30px 34px 34px;text-align:right;
  font-family:'Hind',Arial,sans-serif;
}
.hero-card h1{color:var(--blue);font-size:clamp(1.5rem,3.2vw,2.35rem);font-weight:700;text-align:center;margin-bottom:1rem}
.hero-card p{color:#1f2f52;font-size:clamp(1rem,1.8vw,1.15rem);font-weight:600;line-height:1.5;margin-bottom:1.1rem}
.hero .carousel-control-prev,.hero .carousel-control-next{width:6%;opacity:1}
.hero .carousel-control-prev i,.hero .carousel-control-next i{color:var(--orange);font-size:2.6rem;text-shadow:0 0 6px rgba(255,255,255,.7);transition:transform .2s}
.hero .carousel-control-prev:hover i,.hero .carousel-control-next:hover i{transform:scale(1.2)}

/* ---------- Offer strip ---------- */
.offer-strip{background:var(--blue);padding:16px 0}
.offer-text{color:#fff;font-weight:700;font-size:1.05rem}
.offer-strip .btn{padding:.5rem 1.4rem;font-weight:700}

/* ---------- Intro ---------- */
.intro{padding:56px 0 50px;background:var(--bg)}
.intro-title{color:var(--blue);font-size:clamp(1.4rem,3vw,1.9rem);font-weight:700;margin-bottom:1.2rem;font-family:'Hind',Arial,sans-serif}
.intro-hi{font-family:'Hind',Arial,sans-serif;font-weight:600;font-size:clamp(1rem,2vw,1.15rem);max-width:700px;margin:0 auto 1.4rem}
.intro-en{font-weight:700;font-size:1rem;max-width:660px;margin:0 auto}

/* ---------- Projects ---------- */
.project{padding:62px 0;color:#fff}
.project-navy{background:var(--navy);margin-top:100px;padding-bottom:70px}
.project-orange{background-color:rgba(255, 116, 28, 1);margin-top:130px}
.project h3{font-size:clamp(1.3rem,2.4vw,1.6rem);font-weight:700;margin-bottom:1rem}
.project p{font-weight:700;font-size:1rem;line-height:1.55}
.project ul{font-weight:700;line-height:1.55;padding-left:1.3rem;margin-bottom:1.4rem}
.project li{margin-bottom:.15rem}
.project-navy .project-copy{padding-left:30px}
.house-frame{position:relative;margin:-62px 0}
.house-frame img{display:block;width:100%;height:auto;
  /* border:6px solid #fff;background:#fff */} 
.frame-left,.frame-right{margin:0}
#projects,#price{position:relative}
.frame1{position:absolute;top:-7%;left:10%}
.frame2{position:absolute;top:-8%;right:8%}

/* ---------- Benefits ---------- */
.benefits{
  padding:56px 0 50px;position:relative;
  background-color:#c8a469;background-repeat:no-repeat;
  background-image:url(assets/image-2.webp),linear-gradient(180deg,#e7d6b0,#d9a85c 45%,#b3762c);
  background-size:cover !important;
  background-position:center !important;
}
.benefits h2{text-align:center;color:var(--heading);font-weight:700;font-size:clamp(1.5rem,3vw,2rem);margin-bottom:1.6rem;font-family:'Hind',Arial,sans-serif}
.benefit-card{background:rgba(255,255,255,.88);border-radius:16px;padding:32px 36px 22px;font-family:'Hind',Arial,sans-serif}
.benefit-card ul{color:var(--heading);font-weight:600;font-size:clamp(1rem,1.8vw,1.1rem);line-height:1.6;padding-left:1.1rem}
.benefit-card li{margin-bottom:.45rem}

/* ---------- Explore ---------- */
.explore{padding:50px 0 60px;background:var(--bg)}
.explore h2,.blog h2{text-align:center;font-weight:700;margin-bottom:2.6rem}
.explore h2{color:var(--heading);font-size:clamp(1.5rem,3vw,1.9rem)}
.gallery-grid{
  display:grid;grid-template-columns:minmax(0,300px) 1fr 1fr;grid-template-rows:295px 250px;gap:15px;
}
.g-item{position:relative;display:block;overflow:hidden;color:#fff;text-decoration:none}
.g-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.g-item:hover img{transform:scale(1.06)}
.g-item span{position:absolute;left:0;right:0;bottom:0;padding:18px 8px 12px;text-align:center;font-weight:700;font-size:1.05rem;text-shadow:0 1px 4px rgba(0,0,0,.8);background:linear-gradient(transparent,rgba(0,0,0,.35))}
.g-tall{grid-row:1 / span 2}
.g-wide{grid-column:2 / span 2}
.g-wide span{top:auto}

/* ---------- Testimonials ---------- */
.testimonials{
  padding:70px 0 60px;color:#fff;min-height:445px;
  background-color:#33466a;background-repeat:no-repeat;
  background-image:url(assets/image.webp),linear-gradient(90deg,#2c3d5a,#42536f 50%,#3d4a66);
  background-size:cover !important;
  background-position:center !important;
  position:relative;
}
.testimonials::before{content:"";position:absolute;inset:0;background:rgba(15,25,50,.45)}
.testimonials .container{position:relative}
.testimonials h2{font-weight:700;font-size:clamp(1.5rem,3vw,1.9rem)}
.testimonials h5{font-weight:700;font-size:1.1rem}
.t-item{padding-top:30px}
.t-item i{color:var(--orange);font-size:2.4rem;line-height:1;display:block}
.t-item p{font-size:.95rem;margin:.6rem auto 2rem;max-width:230px}
.t-item strong{font-size:.9rem}

/* ---------- Blog ---------- */
.blog{padding:48px 0 50px;background:var(--bg)}
.blog h2{color:#003366;font-size:clamp(1.5rem,3vw,1.9rem)}
.blog-row{border:0}
.blog-card{display:block;background:#fff;border:1px solid #ddd;color:#222;text-decoration:none;height:100%;transition:box-shadow .25s,transform .25s}
.blog-card:hover{box-shadow:0 8px 20px rgba(0,0,0,.15);color:grey}
.blog-card img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.blog-card h4{font-size:clamp(1.1rem,2vw,1.35rem);font-weight:700;padding:22px 16px 40px;margin:0;line-height:1.35}

/* ---------- Footer ---------- */
.site-footer{background:var(--footer);color:#fff;padding:26px 0;font-size:.8rem}
.social a{color:#fff;font-size:1.3rem;margin:0 8px;transition:color .2s}
/* .social a:hover{color:var(--orange)} */
.powered{color:#9aa7bd;text-decoration:none}
/* .powered:hover{color:var(--orange)} */

/* ---------- Quick Enquiry tab ---------- */
.quick-enquiry{
  position:fixed;right:0;top:70%;transform:translateY(-50%);z-index:1040;
  writing-mode:vertical-rl;text-orientation:mixed;
  background:rgba(255,91,20,1);color:#fff;border:2px solid var(--orange);
  font-weight:700;font-size:1rem;letter-spacing:.5px;padding:8px 7px;border-radius:4px 0 0 4px;
  transition:all .25s;
}
.modal-header{background:var(--navy);color:#fff}
.modal-header .btn-close{filter:invert(1)}

/* =====================================================
   RESPONSIVE
   ===================================================== */

/* ---------- Large desktops (>=1400px) ---------- */
@media (min-width:1400px){
  .hero{height:540px}
}

/* ---------- Small laptops (992px - 1199px) ---------- */
@media (min-width:992px) and (max-width:1199.98px){
  .hero-card{left:36%;width:60%;margin-left:0;padding:24px 26px 28px}
  .gallery-grid{grid-template-columns:minmax(0,240px) 1fr 1fr;grid-template-rows:260px 230px}
  .frame1{left:6%}
  .frame2{right:5%}
}

/* ---------- Tablets & below (<=991px) ---------- */
@media (max-width:991.98px){
  .logo{height:56px}

  /* mobile menu */
  .navbar-collapse{
    background:#fff;padding:.5rem 0 1rem;border-top:1px solid #eee;
    max-height:calc(100vh - 80px);overflow-y:auto;
  }
  .navbar .nav-link{padding:.65rem 1rem;border-bottom:1px solid #f1f1f1}
  .navbar .btn{margin:.75rem 1rem 0}

  /* hero */
  .hero{height:auto;min-height:0}
  .hero .carousel-inner,.hero .carousel-item{height:auto;min-height:440px}
  .hero-wrap{min-height:440px;display:flex;align-items:center;justify-content:center;padding:40px 0}
  .hero-card{
    position:relative;left:auto;top:auto;transform:none;margin:0 auto;width:92%;
    max-width:640px;padding:26px 24px 28px;text-align:center;
  }
  .hero .carousel-control-prev,.hero .carousel-control-next{width:10%}
  .hero .carousel-control-prev i,.hero .carousel-control-next i{font-size:2rem}

  /* offer strip */
  .offer-strip .container,.offer-strip .nb-container{text-align:center}
  .offer-text{text-align:center;margin-bottom:.75rem}

  .intro{padding:40px 0 36px}

  /* projects: remove absolute overlap frames and large offsets */
  .project{padding:40px 0}
  .project-navy,.project-orange{margin-top:0;padding-bottom:40px}
  .project-navy .project-copy{padding-left:12px}
  .frame1,.frame2{position:static;top:auto;left:auto;right:auto}
  .house-frame{margin:0 0 28px}
  .frame-left,.frame-right{margin:0 0 28px;clip-path:none}
  .house-frame img{max-width:100%}

  .benefits{padding:40px 0}
  .benefit-card{padding:24px 22px 14px}

  .explore{padding:40px 0 48px}
  .explore h2,.blog h2{margin-bottom:1.8rem}
  .gallery-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:12px}
  .g-tall,.g-wide{grid-row:auto;grid-column:auto}
  .g-item{height:220px}
  .g-wide{grid-column:1 / span 2}

  .testimonials{padding:50px 0 40px;min-height:0}
  .t-item{padding-top:18px}
  .t-item p{max-width:420px}

  .blog{padding:36px 0 40px}
  .blog-card h4{padding:16px 14px 26px}

  .site-footer .row>*{text-align:center!important;margin-bottom:.5rem}
}

/* ---------- Large phones (<=767px) ---------- */
@media (max-width:767.98px){
  .hero .carousel-inner,.hero .carousel-item,.hero-wrap{min-height:400px}
  .hero-card{padding:22px 18px 24px}
  .project h3,.project p,.project ul{text-align:left}
  .project .row{row-gap:1.5rem}
  .benefit-card ul{padding-left:1rem}
  .g-item{height:200px}
  .quick-enquiry{top:60%;font-size:.9rem;padding:7px 6px}
}

/* ---------- Phones (<=575px) ---------- */
@media (max-width:575.98px){
  .logo{height:48px}
  .intro-title{font-size:1.4rem}
  .offer-text{font-size:.95rem}
  .hero .carousel-control-prev,.hero .carousel-control-next{display:none}
  .hero-card{width:94%}
  .btn-nb,.btn-nb-orange{padding:.5rem 1.2rem}
  .gallery-grid{grid-template-columns:1fr}
  .g-wide{grid-column:auto}
  .g-item{height:210px}
  .benefit-card{padding:20px 16px 10px;border-radius:12px}
  .blog-card h4{font-size:1.1rem}
  .social a{margin:0 6px}
}

/* ---------- Very small phones (<=360px) ---------- */
@media (max-width:360px){
  .logo{height:42px}
  .hero-card h1{font-size:1.3rem}
  .hero-card p{font-size:.95rem}
  .project{padding:32px 0}
}

/* ---------- Landscape phones (short viewports) ---------- */
@media (max-height:480px) and (orientation:landscape){
  .hero .carousel-inner,.hero .carousel-item,.hero-wrap{min-height:0}
  .navbar-collapse{max-height:70vh}
  .quick-enquiry{top:55%}
}

/* ---------- Respect reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important;animation:none!important}
}



         /* About */

         
    :root {
      --blue: #0070c0;
      --navy: #002e5d;
      --orange: #ff5a14;
      --ink: #1f2d4d;
      --bg: #fafafa;
    }
    body {
      font-family: Arial, Helvetica, sans-serif;
      background: var(--bg);
      color: var(--ink);
    }

    /* ---------- Intro ---------- */
    .about-intro { padding: 30px 0 50px; text-align: center; }
    .about-intro h1 {
      color: var(--blue);
      font-weight: 700;
      font-size: 2.4rem;
      margin-bottom: 6px;
    }
    .about-intro .sub { font-weight: 700; font-size: 1.05rem; margin-bottom: 40px; }
    .about-intro p {
      font-weight: 700;
      font-size: 1.05rem;
      line-height: 1.7;
      max-width: 960px;
      margin: 0 auto 22px;
    }

    /* ---------- Feature blocks ---------- */
    .about-features { max-width: 980px; margin: 0 auto; padding: 0 12px; }
    .feature { margin-bottom: 40px; }
    .feature .img-col img {
      width: 100%;
      height: 400px;
      object-fit: cover;
      display: block;
    }
    .feature .text-box {
      color: #fff;
      padding: 30px 30px 30px 60px;
    }
    .feature .text-box h3 { font-size: 1.6rem; font-weight: 700; margin-bottom: 20px; }
    .feature .text-box p  { font-size: 1rem; font-weight: 700; line-height: 1.5; margin: 0; }

    .bg-navy   { background: var(--navy); }
    .bg-orange { background: var(--orange); }

    /* Desktop: text box sits beside the image, vertically centred */
    @media (min-width: 768px) {
      .feature .row { align-items: center; }
      .feature .img-col { width: 46%; }
      .feature .text-col { width: 54%; }
      .feature.reverse .img-col  { order: 2; }
      .feature.reverse .text-col { order: 1; }
      .feature.reverse .text-box { padding: 30px; }
    }

    /* Mobile: stack */
    @media (max-width: 767.98px) {
      .feature .img-col img { height: 260px; }
      .feature .text-box { padding: 24px; }
      .about-intro h1 { font-size: 1.9rem; }
    }



      /* Projects */

    :root {
      --blue: #0070c0;
      --navy: #002e5d;
      --orange: #ff5a14;
      --ink: #1f2d4d;
      --bg: #fafafa;
    }
    body {
      font-family: Arial, Helvetica, sans-serif;
      background: var(--bg);
      color: var(--ink);
    }

    /* ---------- Intro ---------- */
    .projects-intro { padding: 30px 0 50px; text-align: center; }
    .projects-intro h1 {
      color: var(--blue);
      font-weight: 700;
      font-size: 2.4rem;
      margin-bottom: 18px;
    }
    .projects-intro .sub {
      font-weight: 700;
      font-size: 1.05rem;
      margin-bottom: 30px;
    }
    .projects-intro p {
      font-weight: 700;
      font-size: 1.05rem;
      line-height: 1.6;
      max-width: 860px;
      margin: 0 auto;
    }

    /* ---------- Project cards ---------- */
    .projects-list { padding-bottom: 60px; }
    .project-item { text-align: center; margin-bottom: 40px; }
    .project-item img {
      width: 100%;
      max-width: 300px;
      height: 290px;
      object-fit: cover;
      display: block;
      margin: 0 auto 28px;
    }
    .project-item h3 {
      font-size: 1.6rem;
      font-weight: 700;
      margin-bottom: 8px;
    }
    .project-item p {
      font-size: 1.05rem;
      font-weight: 700;
      line-height: 1.4;
      max-width: 300px;
      margin: 0 auto;
    }
    

    @media (max-width: 767.98px) {
      .projects-intro h1 { font-size: 1.9rem; }
      .project-item img { height: 240px; }
    }


    /* price Section */

    
    :root {
      --blue: #0070c0;
      --navy: #002e5d;
      --orange: #ff5a14;
      --ink: #1f2d4d;
      --bg: #fafafa;
    }
    body {
      font-family: Arial, Helvetica, sans-serif;
      background: var(--bg);
      color: var(--ink);
    }

    /* ---------- Intro ---------- */
    .price-intro { padding: 30px 0 70px; text-align: center; }
    .price-intro h1 {
      color: var(--blue);
      font-weight: 700;
      font-size: 2.4rem;
      margin-bottom: 8px;
    }
    .price-intro p {
      font-weight: 700;
      font-size: 1.05rem;
      line-height: 1.55;
      max-width: 700px;
      margin: 0 auto;
    }

    /* ---------- Price cards ---------- */
    .price-list { padding-bottom: 60px; }
    .price-wrap { max-width: 980px; margin: 0 auto; padding: 0 12px; }
    .price-item img {
      width: 100%;
      max-width: 300px;
      height: 290px;
      object-fit: cover;
      display: block;
      margin-bottom: 28px;
    }
    .price-item h3 {
      font-size: 1.6rem;
      font-weight: 700;
      margin-bottom: 8px;
    }
    .price-item ul {
      font-weight: 700;
      font-size: 1.05rem;
      line-height: 1.45;
      padding-left: 30px;
      margin-bottom: 30px;
    }
    .btn-request {
      background: var(--blue);
      color: #fff;
      font-weight: 700;
      font-size: 0.95rem;
      letter-spacing: 0.8px;
      padding: 12px 12px;
      border-radius: 2px;
      border: 0;
    }
    .btn-request:hover,
    .btn-request:focus { background: #ffffff; color: #ff7518; border:1px solid #ff7518; }

    /* Desktop: second card is pushed to the right edge */
    @media (min-width: 768px) {
      .price-item.right { display: flex; flex-direction: column; align-items: flex-end; }
      .price-item.right .inner { width: 300px; }
    }

    @media (max-width: 767.98px) {
      .price-intro h1 { font-size: 1.9rem; }
      .price-item { margin-bottom: 40px; }
      .price-item img { height: 240px; }
    }
  

    /* maxell green */

 
    :root {
      --blue: #0070c0;
      --navy: #002e5d;
      --orange: #ff5a14;
      --ink: #1f2d4d;
      --bg: #fafafa;
    }
    body {
      font-family: Arial, Helvetica, sans-serif;
      background: var(--bg);
      color: var(--ink);
      font-weight: 700;
    }
    ul { margin-bottom: 0; }

    /* ---------- Section 1: project intro ---------- */
    .project-intro { padding: 50px 0; }
    .project-intro .wrap { max-width: 980px; margin: 0 auto; padding: 0 12px; }
    .project-intro img {
      width: 100%;
      max-width: 450px;
      height: 436px;
      object-fit: cover;
      display: block;
    }
    .project-intro h1 {
      font-size: 2rem;
      font-weight: 700;
      margin-bottom: 14px;
    }
    .project-intro p  { font-size: 1.05rem; line-height: 1.55; margin-bottom: 16px; }
    .project-intro li { font-size: 1.05rem; line-height: 1.45; }

    /* ---------- Section 2: unique features ---------- */
    .features {
      background:
        linear-gradient(rgba(0, 46, 93, 0.78), rgba(0, 46, 93, 0.78)),
        url("assets/background.webp") center / cover no-repeat;
      color: #fff;
      padding: 50px 0 40px;
    }
    .features h2 {
      font-size: 1.7rem;
      font-weight: 700;
      text-align: center;
      margin-bottom: 40px;
    }
    .features .wrap { max-width: 980px; margin: 0 auto; padding: 0 12px; }
    .features li { font-size: 1.05rem; line-height: 2; }

    /* ---------- Section 3: distance + landmarks ---------- */
    .details { padding: 50px 0; }
    .details .wrap { max-width: 1160px; margin: 0 auto; padding: 0 12px; }
    .details h3 {
      font-size: 1.7rem;
      font-weight: 700;
      line-height: 1.35;
      margin-bottom: 18px;
    }
    .details p  { font-size: 1.05rem; line-height: 1.5; margin-bottom: 10px; }
    .details li { font-size: 1.05rem; line-height: 1.45; }

    /* ---------- Section 4: map / layout / price plan ---------- */
    .docs { background: var(--navy); color: #fff; padding: 85px 0 60px; }
    .docs .wrap { max-width: 1000px; margin: 0 auto; padding: 0 12px; }
    .docs .doc-item { text-align: center; margin-bottom: 30px; }
    .docs .doc-item a { display: block; }
    .docs .doc-item img {
      width: 100%;
      height: 312px;
      object-fit: cover;
      object-position: top;
      background: #fff;
      display: block;
    }
    .docs .doc-item h5 { font-size: 1.05rem; font-weight: 700; margin: 18px 0 0; }

    @media (max-width: 767.98px) {
      .project-intro img { height: 300px; margin-bottom: 24px; }
      .project-intro h1 { font-size: 1.7rem; }
      .details h3 { font-size: 1.4rem; }
      .docs { padding: 50px 0 30px; }
    }
  

    /* contact section */

 :root {
      --blue: #0070c0;
      --blue-hover: #5aa3dc;   /* lighter blue on hover: slightly white, still clearly blue */
      --navy: #002e5d;
      --orange: #ff5a14;
      --ink: #1f2d4d;
      --field: #2b3350;
      --bg: #fafafa;
    }
    body {
      font-family: Arial, Helvetica, sans-serif;
      background: var(--bg);
      color: var(--ink);
      font-weight: 700;
    }

    /* ---------- Intro ---------- */
    .contact-intro { padding: 30px 0 0; text-align: center; }
    .contact-intro h1 {
      color: var(--blue);
      font-size: 2.4rem;
      font-weight: 700;
      margin-bottom: 8px;
    }
    .contact-intro p { font-size: 1.05rem; margin: 0; }

    .touch-title {
      text-align: center;
      font-size: 1.9rem;
      font-weight: 700;
      margin: 75px 0 60px;
    }

    /* ---------- Contact area ---------- */
    .contact-area { padding-bottom: 50px; }
    .contact-wrap { max-width: 980px; margin: 0 auto; padding: 0 12px; }

    .info-block h4 { font-size: 1.15rem; font-weight: 700; margin-bottom: 14px; }
    .info-block p  { font-size: 1.05rem; line-height: 1.5; margin-bottom: 36px; }

    /* Contact page icons only (does not affect the footer) */
.contact-area .contact-social {
  display: flex;
  gap: 6px;
  margin-top: 40px;
}
.contact-area .contact-social a.contact-social-link {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #000;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  text-decoration: none;
}
.contact-area .contact-social a.contact-social-link:hover {
  background: #333;
  color: #fff;
}
    /* ---------- Form ---------- */
    .contact-form label.lbl {
      font-size: 0.9rem;
      font-weight: 700;
      margin-bottom: 8px;
      display: block;
    }
    .contact-form .form-control {
      border: 2px solid var(--field);
      border-radius: 0;
      background: #fff;
      height: 44px;
      box-shadow: none;
    }
    .contact-form textarea.form-control { height: 88px; resize: vertical; }
    .contact-form .form-control:focus { border-color: var(--blue); box-shadow: none; }
    .contact-form .field { margin-bottom: 22px; }

    .check-row { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 24px; }
    .check-row input[type="checkbox"] {
      width: 18px;
      height: 18px;
      margin-top: 2px;
      flex-shrink: 0;
      accent-color: var(--blue);
      border: 2px solid var(--field);
    }
    .check-row label { font-size: 0.9rem; line-height: 1.2; }

    .btn-submit {
      background: var(--blue);
      color: #fff;
      font-weight: 700;
      border: 0;
      border-radius: 2px;
      width: 142px;
      height: 40px;
      transition: background 0.2s ease;
    }
    .btn-submit:hover,
    .btn-submit:focus { background: var(--blue-hover); color: #fff; }

    @media (max-width: 767.98px) {
      .contact-intro h1 { font-size: 1.9rem; }
      .touch-title { margin: 45px 0 35px; font-size: 1.6rem; }
      .info-block { margin-bottom: 30px; }
    }


    /* documentation */

    :root {
      --blue: #0070c0;
      --navy: #002e5d;
      --ink: #1f2d4d;
      --bg: #fafafa;
    }
    body {
      font-family: Arial, Helvetica, sans-serif;
      background: var(--bg);
      color: var(--ink);
      font-weight: 700;
    }

    /* ---------- Intro ---------- */
    .docs-intro { padding: 30px 0 70px; text-align: center; }
    .docs-intro h1 {
      color: var(--blue);
      font-size: 2.4rem;
      font-weight: 700;
      margin-bottom: 8px;
    }
    .docs-intro p { font-size: 1.05rem; margin: 0; }

    /* ---------- Document cards ---------- */
    .docs-list { padding-bottom: 60px; }
    .docs-wrap { max-width: 980px; margin: 0 auto; padding: 0 12px; }

    .doc-card img {
      width: 100%;
      max-width: 300px;
      height: 290px;
      object-fit: cover;
      display: block;
      margin-bottom: 26px;
    }
    .doc-card h3 {
      font-size: 1.6rem;
      font-weight: 700;
      margin-bottom: 20px;
    }
    .doc-links a { display: block; font-size: 1.05rem; margin-bottom: 12px; }

    /* Desktop: second card is pushed to the right edge */
    @media (min-width: 768px) {
      .doc-card.right { display: flex; justify-content: flex-end; }
      .doc-card.right .inner { width: 300px; }
    }

    /* ---------- Links: same colour in every state (no change after click) ---------- */
    .docs-list a.doc-link,
    .docs-list a.doc-link:link,
    .docs-list a.doc-link:visited,
    .docs-list a.doc-link:hover,
    .docs-list a.doc-link:active,
    .docs-list a.doc-link:focus {
      text-decoration: none;
      outline: none;
    }

    /* Heading links stay dark */
    .docs-list a.doc-link.heading-link,
    .docs-list a.doc-link.heading-link:link,
    .docs-list a.doc-link.heading-link:visited,
    .docs-list a.doc-link.heading-link:hover,
    .docs-list a.doc-link.heading-link:active,
    .docs-list a.doc-link.heading-link:focus { color: var(--ink); }

    /* Booking Form / Company Registration stay blue */
    .docs-list a.doc-link.file-link,
    .docs-list a.doc-link.file-link:link,
    .docs-list a.doc-link.file-link:visited,
    .docs-list a.doc-link.file-link:hover,
    .docs-list a.doc-link.file-link:active,
    .docs-list a.doc-link.file-link:focus { color: var(--blue); }

    @media (max-width: 767.98px) {
      .docs-intro h1 { font-size: 1.9rem; }
      .doc-card { margin-bottom: 40px; }
      .doc-card img { height: 240px; }
    }

  .card-2 h1{
    font-size: 50px;
  }
  .card-3{text-align: left
    ;}
.card-3 h1{
  font-size: 30px;
  text-align: left;
}
    .slide3-ul{
      text-align: left;
    }


    /* gallery section */
  
    :root{
      --blue:#0070c0;
      --ink:#1f2d4d;
      --bg:#fafafa;
    }
    body{font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--ink)}

    /* ---------- Intro ---------- */
    .gallery-intro{padding:30px 0 40px;text-align:center}
    .gallery-intro h1{color:var(--blue);font-weight:700;font-size:2.4rem;margin-bottom:10px}
    .gallery-intro p{font-weight:700;font-size:1.05rem;line-height:1.5;max-width:700px;margin:0 auto}

    /* ---------- Masonry grid (3 columns) ---------- */
    .gallery-wrap{max-width:980px;margin:0 auto;padding:0 12px 70px}
    .gallery-masonry{column-count:3;column-gap:14px}
    .g-card{
      break-inside:avoid;margin-bottom:14px;
      background:#fff;border:1px solid #e3e3e3;padding:6px 6px 0;
    }
    .g-img{
      position:relative;display:block;overflow:hidden;cursor:pointer;
      background:#fff;border:0;padding:0;width:100%;
    }
    .g-img img{width:100%;height:auto;display:block}

    /* hover: image turns white */
    .g-img::after{
      content:"";position:absolute;inset:0;background:#fff;
      opacity:0;transition:opacity .3s ease;pointer-events:none;
    }
    .g-img:hover::after,
    .g-img:focus-visible::after{opacity:.35}

    /* zoom icon shown on the white hover */
    .g-img i{
      position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
      font-size:2rem;color:var(--blue);z-index:2;opacity:0;transition:opacity .3s ease;
      pointer-events:none;
    }
    .g-img:hover i,.g-img:focus-visible i{opacity:1}

    .g-card h5{
      font-size:.8rem;font-weight:700;text-align:center;margin:0;padding:10px 4px 12px;
    }

    /* ---------- Lightbox ---------- */
    #lightbox .modal-content{background:transparent;border:0}
    #lightbox .modal-body{padding:0;text-align:center;position:relative}
    #lightbox img{
      max-width:100%;max-height:85vh;width:auto;height:auto;
      border:6px solid #fff;background:#fff;
    }
    #lightbox .lb-caption{color:#fff;font-weight:700;margin-top:10px}
    #lightbox .lb-close{
      position:absolute;top:-38px;right:0;background:none;border:0;
      color:#fff;font-size:2rem;line-height:1;
    }
    .lb-nav{
      position:fixed;top:50%;transform:translateY(-50%);z-index:1060;
      background:rgba(255,255,255,.2);border:0;color:#fff;
      width:44px;height:44px;border-radius:50%;font-size:1.4rem;
      display:flex;align-items:center;justify-content:center;transition:background .2s;
    }
    .lb-nav:hover{background:rgba(255,255,255,.45)}
    .lb-prev{left:16px}
    .lb-next{right:16px}

    /* ---------- Responsive ---------- */
    @media (max-width:991.98px){
      .gallery-masonry{column-count:2}
    }
    @media (max-width:575.98px){
      .gallery-intro h1{font-size:1.9rem}
      .gallery-masonry{column-count:1}
      .lb-prev{left:6px}
      .lb-next{right:6px}
    }