:root{
  --primary: #1d365e;
  --primary2: #0a4372;
  --accent: #dcab90;
  --dark: #13161c;
  --light: #f5f6f8;
  --white: #ffffff;
  --shadow: 0 18px 60px rgba(0,0,0,.18);
  --radius: 22px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#141823;background:var(--light);scroll-behavior:smooth}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
p{line-height:1.65}
.container{width:min(1120px, 92vw);margin:0 auto}

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:14px 18px; border-radius:999px; font-weight:700;
  background:linear-gradient(135deg,var(--primary),var(--primary2));
  color:var(--white); border:1px solid rgba(255,255,255,.15);
  box-shadow:0 12px 32px rgba(29,54,94,.22);
  transition:transform .18s ease, filter .18s ease, box-shadow .18s ease;
}
.btn:hover{transform:translateY(-1px); filter:brightness(1.02); box-shadow:0 16px 40px rgba(29,54,94,.28)}
.btn:active{transform:translateY(0)}
.btn--ghost{background:rgba(255,255,255,.12); color:var(--white); border:1px solid rgba(255,255,255,.25); box-shadow:none}
.btn--small{padding:10px 14px; font-size:.92rem}

.topbar{
  position:sticky; top:0; z-index:50;
  background:rgba(245,246,248,.72); backdrop-filter: blur(10px);
  border-bottom:1px solid rgba(19,22,28,.06);
}
.topbar__inner{display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 0}
.brand{display:flex; align-items:center; gap:10px}
.brand__logo{width:38px;height:38px;border-radius:12px; box-shadow:0 10px 25px rgba(0,0,0,.10)}
.brand__text{display:flex; flex-direction:column; line-height:1}
.brand__text strong{font-size:.98rem}
.brand__text span{font-size:.86rem; opacity:.75; font-style:italic}

.nav{display:flex; align-items:center; gap:16px}
.nav a{font-weight:600; opacity:.82}
.nav a:hover{opacity:1}
.navtoggle{display:none; width:44px; height:44px; border-radius:14px; border:1px solid rgba(19,22,28,.10); background:rgba(255,255,255,.6)}
.navtoggle span{display:block; height:2px; margin:6px 10px; background:var(--dark); border-radius:5px}

.mobilemenu{
  display:none; flex-direction:column; gap:10px;
  padding:10px 0 16px; border-top:1px solid rgba(19,22,28,.06);
}
.mobilemenu a{padding:10px 0; font-weight:700}

.hero{position:relative; min-height:86vh; display:grid; align-items:center; overflow:hidden; background:var(--dark)}
.hero__bg{position:absolute; inset:0}
.hero__bg img{width:100%; height:100%; object-fit:cover; object-position:center}
.hero__overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(1000px 420px at 18% 30%, rgba(220,171,144,.35), transparent 55%),
    radial-gradient(900px 460px at 80% 10%, rgba(10,67,114,.55), transparent 55%),
    linear-gradient(180deg, rgba(19,22,28,.72) 0%, rgba(19,22,28,.80) 55%, rgba(19,22,28,.90) 100%);
}

.hero__content{position:relative; padding:72px 0 54px; color:var(--white)}
.hero__badge{display:inline-flex; align-items:center; gap:10px; padding:10px 14px; border-radius:999px;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18); width:fit-content;
}
.dot{width:9px;height:9px;border-radius:50%; background:var(--accent); box-shadow:0 0 0 6px rgba(220,171,144,.16)}

h1{font-size:clamp(2.1rem, 4.2vw, 3.4rem); margin:16px 0 10px; letter-spacing:-.02em}
.text-accent{color:var(--accent)}
.lead{font-size:1.1rem; opacity:.9; max-width:52ch}

.hero__cta{display:flex; flex-wrap:wrap; gap:12px; margin:18px 0 24px}
.hero__stats{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; margin-top:22px}
.stat{padding:14px 14px; border-radius:18px; background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.16)}
.stat__k{font-weight:800; letter-spacing:.02em}
.stat__v{opacity:.88; font-size:.95rem; margin-top:4px}

.section{padding:78px 0}
.section--alt{background:#ffffff}
.section__head{max-width:72ch; margin-bottom:26px}
.section__head h2{font-size:clamp(1.6rem, 2.4vw, 2.2rem); margin:0 0 8px}
.section__head p{margin:0; opacity:.8}

.grid{display:grid; gap:16px}
.grid--3{grid-template-columns:repeat(3, minmax(0,1fr))}
.grid--2{grid-template-columns:repeat(2, minmax(0,1fr))}

.card{
  background:#fff; border:1px solid rgba(19,22,28,.08);
  border-radius:var(--radius); padding:22px; box-shadow:0 10px 34px rgba(0,0,0,.06);
}
.card h3{margin:0 0 8px}
.card p{margin:0 0 14px; opacity:.85}
.card--soft{background:linear-gradient(180deg,#ffffff 0%, #fbfbfc 100%)}

.check{padding-left:18px; margin:0}
.check li{margin:8px 0; opacity:.9}

.pillrow{display:flex; flex-wrap:wrap; gap:10px; margin-top:16px}
.pill{padding:10px 12px; border-radius:999px; border:1px solid rgba(19,22,28,.10); background:rgba(29,54,94,.06); font-weight:700; font-size:.92rem}

.split{display:grid; grid-template-columns:1.15fr .85fr; gap:18px; align-items:start}
.lead2{font-size:1.08rem; opacity:.85; margin-top:10px}

.steps{display:grid; gap:10px; margin-top:18px}
.step{display:flex; gap:12px; padding:14px; border-radius:18px; border:1px solid rgba(19,22,28,.08); background:rgba(245,246,248,.55)}
.step__n{width:34px; height:34px; border-radius:12px; background:linear-gradient(135deg,var(--primary),var(--primary2)); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:900
}
.step h4{margin:0 0 4px}
.step p{margin:0; opacity:.85}

.cta-inline{display:flex; gap:12px; flex-wrap:wrap; margin-top:16px}
.cta-inline .btn--ghost{background:rgba(29,54,94,.08); color:var(--primary); border-color:rgba(29,54,94,.14)}

.gallerypanel{border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); background:linear-gradient(180deg, rgba(29,54,94,.94), rgba(19,22,28,.92)); color:#fff; border:1px solid rgba(255,255,255,.12)}
.gallerypanel__top{padding:22px}
.tag{display:inline-flex; padding:8px 12px; border-radius:999px; background:rgba(220,171,144,.18); border:1px solid rgba(220,171,144,.28); color:var(--accent); font-weight:800; width:fit-content}
.gallerypanel h3{margin:10px 0 6px}
.gallerypanel p{margin:0; opacity:.9}

.thumbgrid{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:10px; padding:0 22px 18px}
.thumb{border:0; padding:0; border-radius:16px; overflow:hidden; cursor:pointer; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14);
  transition:transform .15s ease, filter .15s ease;
}
.thumb:hover{transform:translateY(-1px); filter:brightness(1.05)}
.thumb img{width:100%; height:100%; object-fit:cover; aspect-ratio:1/1}

.note{padding:0 22px 22px; opacity:.85; font-size:.92rem}

.video{border-radius:var(--radius); overflow:hidden; border:1px solid rgba(19,22,28,.08); box-shadow:0 14px 45px rgba(0,0,0,.08)}
.video iframe{width:100%; height:min(62vh, 560px)}

.card__row{display:flex; gap:14px; align-items:flex-start}
.icon{width:44px; height:44px; border-radius:16px; display:flex; align-items:center; justify-content:center; font-weight:900;
  background:linear-gradient(135deg,var(--primary),var(--primary2)); color:#fff; flex:0 0 auto
}
.link{display:inline-block; margin-top:8px; font-weight:800; color:var(--primary)}
.fbembed{margin-top:14px; border-radius:18px; overflow:hidden; border:1px solid rgba(19,22,28,.08)}
.fbembed iframe{width:100%; height:420px}

.igbox{margin-top:14px; border-radius:18px; overflow:hidden; border:1px solid rgba(19,22,28,.08); background:rgba(29,54,94,.06)}
.igbox__inner{display:flex; gap:14px; padding:14px; align-items:center}
.igbox__inner img{width:110px; height:110px; border-radius:18px; object-fit:cover}
.igbox__title{font-weight:900}
.igbox__desc{opacity:.85; margin:6px 0 10px}

.contact{display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start}
.infocard{background:#fff; border:1px solid rgba(19,22,28,.08); border-radius:var(--radius); padding:20px; box-shadow:0 12px 40px rgba(0,0,0,.06)}
.infocard h3{margin:0 0 12px}
.info{display:grid; grid-template-columns:120px 1fr; gap:10px; padding:10px 0; border-bottom:1px dashed rgba(19,22,28,.10)}
.info:last-child{border-bottom:0}
.info__k{font-weight:800; opacity:.75}
.info__v a{font-weight:800; color:var(--primary)}
.mini-cta{display:flex; flex-wrap:wrap; gap:10px; margin-top:14px}
.mini-cta .btn--ghost{background:rgba(29,54,94,.08); color:var(--primary); border-color:rgba(29,54,94,.14)}

.map{margin-top:14px; border-radius:var(--radius); overflow:hidden; border:1px solid rgba(19,22,28,.08); box-shadow:0 12px 40px rgba(0,0,0,.06)}
.map iframe{width:100%; height:320px; border:0}

.form{background:#fff; border:1px solid rgba(19,22,28,.08); border-radius:var(--radius); padding:22px; box-shadow:0 12px 40px rgba(0,0,0,.06)}
label{display:block; font-weight:800; font-size:.95rem}
input,textarea{
  width:100%; padding:12px 12px; margin-top:8px; border-radius:16px;
  border:1px solid rgba(19,22,28,.14); background:#fff; font:inherit;
}
textarea{resize:vertical}
.form__row{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.form__actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}
.form__note{margin:12px 0 0; opacity:.72; font-size:.92rem}

.footer{background:var(--dark); color:#fff}
.footer__inner{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:26px 0}
.footer__brand{display:flex; gap:12px; align-items:center}
.footer__brand img{width:44px;height:44px;border-radius:16px}
.footer__title{font-weight:900}
.footer__sub{opacity:.75; font-size:.94rem; margin-top:2px}
.footer__links{display:flex; gap:14px; flex-wrap:wrap; opacity:.9; font-weight:700}
.footer__bottom{border-top:1px solid rgba(255,255,255,.12); padding:14px 0; color:rgba(255,255,255,.82)}
.footer__bottom a{color:#fff; font-weight:800}

.wa-float{
  position:fixed; right:18px; bottom:18px; width:58px; height:58px;
  border-radius:18px; background:linear-gradient(135deg,#25D366,#128C7E);
  box-shadow:0 18px 44px rgba(0,0,0,.25); display:grid; place-items:center;
  z-index:60; border:1px solid rgba(255,255,255,.2)
}
.wa-float svg{width:30px; height:30px; fill:#fff}

.lightbox{position:fixed; inset:0; background:rgba(0,0,0,.76); display:none; align-items:center; justify-content:center; padding:22px; z-index:80}
.lightbox.is-open{display:flex}
.lightbox__img{max-width:min(980px, 92vw); max-height:82vh; border-radius:22px; box-shadow:0 18px 60px rgba(0,0,0,.5)}
.lightbox__close{position:absolute; top:14px; right:14px; width:46px; height:46px; border-radius:16px; border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.12); color:#fff; font-size:28px; cursor:pointer
}

.reveal{opacity:0; transform:translateY(14px); transition:opacity .65s ease, transform .65s ease}
.reveal.is-visible{opacity:1; transform:none}

@media (max-width: 980px){
  .grid--3{grid-template-columns:1fr}
  .grid--2{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .hero__stats{grid-template-columns:1fr}
  .contact{grid-template-columns:1fr}
  .thumbgrid{grid-template-columns:repeat(4, minmax(0,1fr))}
  .nav{display:none}
  .navtoggle{display:block}
  .mobilemenu{display:flex}
  .mobilemenu[aria-hidden="true"]{display:none}
}
@media (max-width: 520px){
  .thumbgrid{grid-template-columns:repeat(2, minmax(0,1fr))}
  .form__row{grid-template-columns:1fr}
  .hero__content{padding:64px 0 40px}
}


/* --- Added for blog + media updates --- */
.socialmini{display:flex; gap:10px; align-items:center}
.iconbtn{width:38px;height:38px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);transition:transform .15s ease, background .15s ease}
.iconbtn:hover{transform:translateY(-1px);background:rgba(255,255,255,.18)}
.iconbtn svg{width:18px;height:18px;fill:#fff;opacity:.95}

.mobilemenu__social{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.mobilemenu__social a{opacity:.9}

.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width: 860px){
  .grid--2{grid-template-columns:1fr}
  .socialmini{display:none}
}

.callout{background:rgba(255,255,255,.82); border:1px solid rgba(0,0,0,.06); border-radius:var(--radius); padding:22px; box-shadow:0 12px 30px rgba(0,0,0,.08)}
.callout p{margin:0 0 12px 0; line-height:1.7}
.callout p:last-child{margin-bottom:0}

.link{display:inline-flex; gap:8px; align-items:center; color:var(--primary); font-weight:800; text-decoration:none}
.link:hover{text-decoration:underline}

.muted{opacity:.85}

.blogpanel{margin-top:22px; background:rgba(255,255,255,.82); border:1px solid rgba(0,0,0,.06); border-radius:var(--radius); padding:22px; box-shadow:0 12px 30px rgba(0,0,0,.08)}
.blogpanel__top{display:flex; flex-direction:column; gap:6px; margin-bottom:14px}
.filters{display:flex; gap:10px; flex-wrap:wrap; margin:12px 0 16px}
.chip{border:1px solid rgba(0,0,0,.12); background:#fff; padding:10px 12px; border-radius:999px; font-weight:800; cursor:pointer}
.chip.is-active{background:linear-gradient(135deg,var(--primary),var(--primary2)); color:#fff; border-color:rgba(255,255,255,.25)}
.postgrid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px}
@media (max-width: 980px){ .postgrid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width: 620px){ .postgrid{grid-template-columns:1fr;} }

.postcard{background:#fff; border:1px solid rgba(0,0,0,.06); border-radius:18px; overflow:hidden; box-shadow:0 10px 26px rgba(0,0,0,.08); display:flex; flex-direction:column}
.postcard__img{height:160px; overflow:hidden}
.postcard__img img{width:100%; height:100%; object-fit:cover}
.postcard__body{padding:14px}
.postcard__meta{display:flex; gap:10px; flex-wrap:wrap; font-size:12px; opacity:.75; margin-bottom:8px}
.postcard__title{font-size:16px; margin:0 0 8px 0}
.postcard__excerpt{margin:0 0 10px 0; line-height:1.6; opacity:.9}
.postcard__actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:auto; padding:0 14px 14px}
.postcard__actions a{font-weight:800; text-decoration:none}
.postcard__actions a:hover{text-decoration:underline}

.note{margin-top:14px; padding:14px 16px; border-radius:16px; background:rgba(0,0,0,.04); border:1px dashed rgba(0,0,0,.14); line-height:1.6}
