*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Times New Roman',sans-serif;color:#333;overflow-x:hidden;background:#fff;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}
ul{list-style:none;}

/* ══════════ TOPBAR ══════════ */
#topbar{
  background:#C48037;color:#fff;
  padding:10.5px 50px;
  display:flex;align-items:center;justify-content:space-between;
  font-size:13.5px;
}
.tb-contacts{display:flex;gap:30px;align-items:center;}
.tb-contacts span{display:flex;align-items:center;gap:8px;}
.tb-contacts i{font-size:13px;}
.tb-book{
  background:#fff;color:#3b3834;
  padding:8px 28px;border-radius:3px;
  font-weight:700;font-size:13px;
  border:2px solid #fff;transition:all .2s;
}
.tb-book:hover{background:transparent;color:#fff;}

/* ══════════ HEADER ══════════ */
#header{
  background:#fff;padding:0 50px;height:88px;
  display:flex;align-items:center;justify-content:space-between;
  box-shadow:0 2px 10px rgba(0,0,0,.08);
  position:sticky;top:0;z-index:9999;
}
.logo img{height:74px;width:auto;object-fit:contain;}
.logo-text-fallback{display:none;flex-direction:column;}
.logo-text-fallback strong{font-family:'EB Garamond',serif;font-size:20px;color:#c8831a;}
.logo-text-fallback span{font-size:10px;color:#999;letter-spacing:2px;text-transform:uppercase;}

nav>ul{display:flex;align-items:center;}
nav>ul>li{position:relative;}
nav>ul>li>a{
  font-family:"DM Sans",Sans-serif;
  display:block;padding:0 6px;height:88px;line-height:88px;
  font-size:13px;font-weight:400;color:#000;white-space:nowrap;transition:color .2s;
}
nav>ul>li>a:hover{color:#c8831a;}
nav>ul>li:hover>.sub{display:block;}
.sub{
  display:none;position:absolute;top:100%;left:0;
  background:#fff;min-width:185px;
  box-shadow:0 6px 20px rgba(0,0,0,.1);
  border-top:3px solid #c8831a;z-index:9999;
}
.sub li a{
  display:block;padding:11px 16px;font-size:13px;color:#444;
  border-bottom:1px solid #f5f5f5;transition:background .15s,color .15s;
}
.sub li a:hover{background:#fff8f0;color:#c8831a;}
.hdr-right{display:flex;align-items:center;gap:8px;}
.social-icon{
  width:34px;height:34px;border-radius:5px;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:15px;transition:opacity .2s;
}
.social-icon:hover{opacity:.8;}
.si-fb{background:#1877f2;}
.si-ig{background:linear-gradient(45deg,#f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);}
.hamburger{display:none;font-size:22px;cursor:pointer;color:#c8831a;margin-left:10px;}

/* ══════════ MOB NAV ══════════ */
#mobnav{
  display:none;position:fixed;inset:0;
  background:#fff;z-index:99998;
  flex-direction:column;padding:80px 30px;overflow-y:auto;
}
#mobnav.open{display:flex;}
.mob-close{position:absolute;top:20px;right:24px;font-size:26px;cursor:pointer;color:#c8831a;}
#mobnav ul li{border-bottom:1px solid #f0f0f0;}
#mobnav ul li a{display:block;padding:13px 0;font-size:16px;font-weight:600;color:#333;}
#mobnav ul li a:hover{color:#c8831a;}

/* ══════════ HERO BANNER ══════════ */
#hero-banner{
  position:relative;width:100%;height:320px;overflow:hidden;
}

#hero-banner .hb-body{
  position:relative;z-index:2;height:100%;
  display:flex;flex-direction:column;
  justify-content:flex-end;
  padding:0 60px 44px;
}
#hero-banner .hb-body h1{
  font-family:'EB Garamond',serif;
  font-size:38px;font-weight:400;color:#fff;
  margin-bottom:14px;line-height:1.2;
}
#hero-banner .hb-bar{width:60px;height:2px;background:#fff;}

/* ══════════ GOLDEN SECTION ══════════ */
#dep-section{background:#C48037;padding:65px 80px;}
.dep-inner{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr;
  gap:70px;align-items:center;
}
.dep-text h2{
  font-family:'EB Garamond',serif;
  font-size:32px;font-weight:400;color:#1a1a1a;
  margin-bottom:26px;line-height:1.3;
}
.dep-text p{font-size:15.5px;color:#1a1a1a;line-height:1.85;margin-bottom:20px;}
.dep-text p.notice{font-size:15px;font-weight:700;color:#1a1a1a;line-height:1.75;margin-bottom:20px;text-transform:uppercase;}
.dep-img img{width:100%;height:440px;object-fit:cover;display:block;border-radius:4px;}

/* ══════════ CONTACT + FORM — desktop: form overlaps left image ══════════ */
#contact-section{
  background:#fff;
  padding:70px 0 80px;
  overflow:hidden;
}
.contact-outer{
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:flex-start;
  position:relative;
}

/* LEFT */
.contact-left{
  padding:0 0 50px 80px;
  position:relative;
  z-index:1;
}
.contact-left .cl-img{
  width:100%;height:490px;
  object-fit:cover;border-radius:4px;
  margin-bottom:28px;display:block;
}
.contact-left .cl-info{
  display:flex;flex-direction:column;gap:12px;
  margin-bottom:20px;padding-right:20px;
}
.contact-left .cl-info .ci-row{
  display:flex;align-items:flex-start;gap:12px;
  font-size:14.5px;color:#444;line-height:1.6;
}
.contact-left .cl-info .ci-row i{color:#c8831a;font-size:15px;flex-shrink:0;margin-top:2px;}
.contact-left .cl-socials{display:flex;gap:8px;margin-top:8px;}
.contact-left .cl-socials a{
  width:34px;height:34px;border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:15px;
}
.cl-socials .s-fb{background:#1877f2;}
.cl-socials .s-ig{background:linear-gradient(45deg,#f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);}

/* RIGHT — pulled left to overlap image */
.contact-right{
  position:relative;z-index:2;
  margin-left:-80px;
  padding:0 80px 0 0;
}
.contact-right .cr-title{
  font-family:'Times New Roman',serif;
  font-size:28px;font-weight:700;color:#1a1a1a;
  margin-bottom:12px;line-height:1.35;
  margin-left:110px;
}
.contact-right .cr-bar{
  width:50px;height:2px;background:#c8831a;
  margin-bottom:16px;margin-left:110px;
}
.contact-right .cr-desc{
      font-family:'Times New Roman',serif;

  font-size:17px;color:#000000;line-height:1.8;
  margin-bottom:24px;margin-left:110px;
}

/* Form card */
.dep-form{
  background:#BEABAC;
  border-radius:6px;
  padding:26px 26px 30px;
  box-shadow:-10px 10px 50px rgba(0,0,0,.20);
}
.dep-form .cf-label{
  display:block;font-size:13px;font-weight:700;
  color:111010;margin-bottom:5px;
}
.dep-form .cf-label .req{color:#ff6b6b;margin-left:2px;}
.dep-form .cf-inp,
.dep-form .cf-area{
  width:100%;padding:12px 14px;
  border:none;border-radius:4px;
  font-size:14px;font-family:'Open Sans',sans-serif;
  outline:none;color:#333;background:#fff;
  margin-bottom:14px;
}
.dep-form .cf-area{height:120px;resize:vertical;margin-bottom:16px;}
.dep-form .cf-row{
  display:grid;grid-template-columns:1fr 1fr;gap:14px;
  margin-bottom:14px;
}
.dep-form .cf-row .cf-inp{margin-bottom:0;}
.dep-form .cf-submit{
  background:#c8831a;color:#fff;
  border:none;padding:13px 30px;border-radius:4px;
  font-size:14px;font-weight:700;
  cursor:pointer;font-family:'Open Sans',sans-serif;
  transition:background .2s;margin-top:4px;
}
.dep-form .cf-submit:hover{background:#b07015;}

/* ══════════ FOOTER ══════════ */
#footer{background:#ffffff;padding:65px 60px 0;}
.ft-grid{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:2fr 1fr 1.2fr 1.4fr;
  gap:40px;padding-bottom:50px;
}
.ft-logo img{height:68px;margin-bottom:14px;}
.ft-logo-name{font-family:'EB Garamond',serif;font-size:21px;color:#000000;font-weight:700;margin-bottom:12px;}
.ft-brand-desc{font-size:17px;line-height:1.85;color:#000000;}
.ft-socials{display:flex;gap:10px;margin-top:18px;}
.ft-socials a{
  width:36px;height:36px;border-radius:50%;
  background:rgba(0,0,0,.07);
  display:flex;align-items:center;justify-content:center;
  color:#000000;font-size:14px;transition:background .2s;
}
.ft-socials a:hover{background:#c8831a;color:#fff;}
.ft-col h4{font-family:'EB Garamond',serif;font-size:22px;color:#000000;font-weight:700;margin-bottom:18px;}
.ft-col ul li{margin-bottom:10px;}
.ft-col ul li a{font-size:17px;color:#000000;display:flex;align-items:center;gap:7px;transition:color .2s;}
.ft-col ul li a:hover{color:#c8831a;}
.ft-col ul li a i{color:#c8831a;font-size:10px;}
.ft-ci{display:flex;gap:10px;align-items:flex-start;margin-bottom:13px;font-size:17px;color:#000000;line-height:1.6;}
.ft-ci i{color:#c8831a;flex-shrink:0;margin-top:3px;font-size:14px;}
.nl-form{display:flex;margin-top:14px;}
.nl-form input{flex:1;padding:11px 13px;border:1px solid #ddd;border-radius:4px 0 0 4px;font-size:13px;outline:none;font-family:'Open Sans',sans-serif;}
.nl-form button{background:#c8831a;color:#fff;border:none;padding:11px 18px;border-radius:0 4px 4px 0;font-weight:700;font-size:13px;cursor:pointer;transition:background .2s;}
.nl-form button:hover{background:#b07015;}
.ft-bottom{
  background:#2a2c2d;
  border-top:1px solid rgba(255,255,255,.1);
  padding:20px 119px;
  display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:10px;
  font-size:17px;color:rgba(255,255,255,.4);
}
.ft-bottom a{color:#c8831a;}

/* ══════════ WHATSAPP ══════════ */
.wa{
  position:fixed;bottom:26px;right:26px;
  background:#25d366;color:#fff;
  width:56px;height:56px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:28px;box-shadow:0 4px 18px rgba(0,0,0,.22);
  z-index:99999;transition:transform .2s;
}
.wa:hover{transform:scale(1.1);}

/* ══════════════════════════════════════
   RESPONSIVE — TABLET (max 1050px)
═══════════════════════════════════════ */
@media(max-width:1050px){
  /* Golden section */
  #dep-section{padding:50px 40px;}
  .dep-inner{gap:40px;}

  /* Contact overlap — reduce overlap amount */
  .contact-left{padding-left:40px;}
  .contact-right{
    margin-left:-50px;
    padding-right:40px;
  }
  .contact-right .cr-title{margin-left:60px;}
  .contact-right .cr-bar{margin-left:60px;}
  .contact-right .cr-desc{margin-left:60px;}

  /* Footer */
  .ft-grid{grid-template-columns:1fr 1fr;}
  .ft-bottom{padding:20px 40px;}
}

/* ══════════════════════════════════════
   RESPONSIVE — MOBILE (max 860px)
═══════════════════════════════════════ */
@media(max-width:860px){
  /* Header */
  nav{display:none;}
  .hamburger{display:block;}
  #header{padding:0 18px;}

  /* Topbar */
  #topbar{padding:10px 18px;font-size:12px;flex-wrap:wrap;gap:6px;}
  .tb-contacts{gap:12px;flex-wrap:wrap;}

  /* Hero */
  #hero-banner{height:220px;}
  #hero-banner .hb-body{padding:0 24px 30px;}
  #hero-banner .hb-body h1{font-size:26px;}

  /* Golden section */
  #dep-section{padding:40px 24px;}
  .dep-inner{grid-template-columns:1fr;gap:28px;}
  .dep-img img{height:260px;}

  /* Contact section — REMOVE overlap, stack vertically */
  #contact-section{padding:40px 24px 60px;overflow:visible;}
  .contact-outer{
    grid-template-columns:1fr;
    gap:0;
  }
  .contact-left{
    padding:0 0 30px 0;
    z-index:1;
  }
  .contact-left .cl-img{height:260px;}
  .contact-left .cl-info{padding-right:0;}

  /* Right col — reset all overlap styles */
  .contact-right{
    margin-left:0;
    padding:0;
    z-index:1;
    box-shadow:none;
  }
  .contact-right .cr-title{
    margin-left:0;
    font-size:24px;
  }
  .contact-right .cr-bar{margin-left:0;}
  .contact-right .cr-desc{margin-left:0;}
  .dep-form{box-shadow:0 4px 20px rgba(0,0,0,.12);}

  /* Footer */
  #footer{padding:50px 24px 0;}
  .ft-grid{grid-template-columns:1fr 1fr;gap:28px;}
  .ft-bottom{padding:20px 24px;font-size:12px;}
}

/* ══════════════════════════════════════
   RESPONSIVE — SMALL MOBILE (max 560px)
═══════════════════════════════════════ */
@media(max-width:560px){
  /* Topbar stack */
  #topbar{flex-direction:column;align-items:flex-start;gap:6px;}
  .tb-contacts{flex-direction:column;gap:4px;}

  /* Hero */
  #hero-banner{height:190px;}
  #hero-banner .hb-body h1{font-size:22px;}

  /* Golden */
  #dep-section{padding:36px 18px;}
  .dep-text h2{font-size:24px;}
  .dep-img img{height:210px;}

  /* Contact */
  #contact-section{padding:36px 18px 50px;}
  .contact-left .cl-img{height:210px;}
  .contact-right .cr-title{font-size:21px;}

  /* Form date/time row stacks */
  .dep-form .cf-row{grid-template-columns:1fr;}

  /* Footer */
  .ft-grid{grid-template-columns:1fr;}
  .ft-bottom{
    flex-direction:column;
    text-align:center;
    padding:20px 16px;
    font-size:11px;
  }
}