/* WestOne (modern) — overlay on BoxChat. Brand teal #006687 + green. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root{
  --brand:#006687; --brand-d:#004d66; --brand-l:#e7f1f4;
  --green:#16a34a; --green-d:#15803d;
  --ink:#1f2933; --sub:#5b6b76; --muted:#f5f8f9; --line:#e3e9ec;
  --shadow:0 6px 24px rgba(16,42,55,.08); --shadow-h:0 14px 40px rgba(0,102,135,.18);
}
body{font-family:'Inter',-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.6;}
h1,h2,h3,h4,.title{font-family:'Lato','Inter',sans-serif;color:var(--ink);letter-spacing:-.01em;}
a{color:var(--brand);} a:hover{color:var(--brand-d);}

/* Buttons */
.btn{border-radius:9px;font-weight:600;padding:.6em 1.25em;border:0;transition:transform .15s,box-shadow .15s,background .15s;}
.btn:hover{transform:translateY(-2px);}
.btn-green,.btn-action,.btn-primary{background:var(--green);color:#fff;box-shadow:0 4px 14px rgba(22,163,74,.3);}
.btn-green:hover,.btn-action:hover,.btn-primary:hover{background:var(--green-d);color:#fff;}
.btn-slider{background:var(--brand);color:#fff;font-size:1.05rem;padding:.7em 1.5em;box-shadow:0 6px 20px rgba(0,102,135,.4);}
.btn-slider:hover{background:var(--brand-d);color:#fff;}
.btn-lg{font-size:1.05rem;}
.btn i{margin-right:.5em;}

/* Nav */
.navbar.navbar-default{background:#fff;border:0;box-shadow:0 2px 14px rgba(16,42,55,.06);}
.navbar-nav>li>a{color:var(--ink);font-weight:500;position:relative;}
.navbar-nav>li>a:hover,.navbar-nav>li.active>a{color:var(--brand);}
.navbar-nav>li>a:after{content:"";position:absolute;left:1em;right:1em;bottom:8px;height:2px;background:var(--brand);transform:scaleX(0);transition:transform .2s;}
.navbar-nav>li>a:hover:after,.navbar-nav>li.active>a:after{transform:scaleX(1);}

/* Hero slider */
#imageslider .imageslideroverlay{background:linear-gradient(120deg,rgba(0,77,102,.78),rgba(0,102,135,.55));}
#imageslider h1{font-weight:800;font-size:3rem;text-shadow:0 2px 18px rgba(0,0,0,.35);}
#imageslider h2{font-weight:400;font-size:1.25rem;opacity:.95;}

/* Sections */
section{padding:72px 0;}
.title{text-align:center;}
h1.title{font-size:2.3rem;font-weight:800;margin-bottom:.3em;}
h2.title{font-size:1.1rem;font-weight:400;color:var(--sub);margin-bottom:2.2rem;}

/* Plan / service cards */
#hostingplans .thumbnail,#hostingplans .caption,.thumbnail{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s;overflow:hidden;}
#hostingplans .thumbnail:hover,.thumbnail:hover{transform:translateY(-6px);box-shadow:var(--shadow-h);}
#hostingplans .price{color:var(--brand);font-size:2.4rem;font-weight:800;margin:.2em 0;}
#hostingplans .price sup{font-size:1.1rem;top:-.7em;} #hostingplans .price small{font-size:.5em;color:var(--sub);font-weight:500;}
#hostingplans .caption img{padding:1.4rem 1.4rem 0;}

/* Why us */
#whyus{background:var(--muted);}
#whyus .fa,#whyus i{color:var(--brand);}

/* Testimonials */
.thumbnail.testimonial{padding:1.6rem;border-radius:14px;}
#testimonial .fa-quote-left,#testimonial .fa{color:var(--brand);}

/* FAQ */
#faq .panel-faq{border:1px solid var(--line);border-radius:12px!important;box-shadow:none;margin-bottom:.7rem;overflow:hidden;}
#faq .panel-faq .panel-heading{background:#fff;transition:background .15s;}
#faq .panel-faq .panel-heading:hover{background:var(--brand-l);}
#faq .panel-title a{color:var(--ink);font-weight:600;}

/* Footer */
footer,#footer{background:#0f2630;color:#cdd9de;}
footer a,#footer a{color:#9fc6d2;} footer a:hover,#footer a:hover{color:#fff;}

@media(max-width:768px){#imageslider h1{font-size:2rem;}section{padding:48px 0;}h1.title{font-size:1.8rem;}}

/* Fix login/auth box centering - override stray width:25% from style.css */
.logincontainer{ width:100%!important; max-width:480px; margin:40px auto 100px auto!important; padding:0 15px; float:none!important; }
@media(max-width:600px){ .logincontainer{ margin:20px auto 40px auto!important; max-width:100%; } }