/* FiHosts Frontend Redesign v1.0
 * Visual direction: enterprise infrastructure / hosting, inspired by the information architecture
 * of established infrastructure providers while retaining FiHosts' own brand identity.
 */
:root{
  --fh-navy:#071a35;
  --fh-navy-2:#0b2347;
  --fh-blue:#1267e8;
  --fh-cyan:#22b8ff;
  --fh-ink:#14213d;
  --fh-muted:#65748b;
  --fh-line:#e5edf7;
  --fh-soft:#f5f9ff;
  --fh-white:#fff;
  --fh-radius:14px;
  --fh-shadow:0 18px 48px rgba(13,42,82,.10);
}
html{scroll-behavior:smooth}
body.lagom{color:var(--fh-ink);background:#fff}
body.lagom a{transition:color .18s ease,background-color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease}

/* Header / navigation */
.app-nav{box-shadow:0 1px 0 rgba(12,31,59,.08);position:relative;z-index:40}
.app-nav-header{background:var(--fh-navy)!important;border:0!important}
.app-nav-header .container{min-height:42px}
.app-nav-header,.app-nav-header a,.app-nav-header .btn,.app-nav-header .dropdown-toggle{color:rgba(255,255,255,.88)!important}
.app-nav-header a:hover{color:#fff!important}
.app-nav-menu{background:#fff!important;border:0!important;box-shadow:0 8px 24px rgba(6,30,66,.06)}
.app-nav-menu .menu-primary>li>a{font-weight:650;color:#22324c!important;letter-spacing:.005em}
.app-nav-menu .menu-primary>li>a:hover,.app-nav-menu .menu-primary>li.active>a{color:var(--fh-blue)!important;background:transparent!important}
.app-nav-menu .menu-primary>li.active>a:after{content:"";position:absolute;left:18px;right:18px;bottom:0;height:3px;border-radius:6px 6px 0 0;background:linear-gradient(90deg,var(--fh-blue),var(--fh-cyan))}
.app-nav-menu .menu-primary>li>a{position:relative}
.app-nav-menu .dropdown-menu{border:1px solid var(--fh-line)!important;border-radius:12px!important;box-shadow:0 18px 45px rgba(9,37,78,.14)!important;overflow:hidden}
.app-nav-toggle .icon-bar{background:#fff!important}

/* Global typography */
.site .section-title,.main-header .main-header-title{color:#10213d;letter-spacing:-.025em;font-weight:800}
.site .section-subtitle{color:var(--fh-muted);line-height:1.7}
.main-header{background:linear-gradient(180deg,#f6faff 0%,#fff 100%);border-bottom:1px solid var(--fh-line)}

/* Buttons */
.btn-primary{background:linear-gradient(135deg,var(--fh-blue),#0a8bf0)!important;border-color:transparent!important;box-shadow:0 9px 24px rgba(18,103,232,.22);font-weight:700}
.btn-primary:hover,.btn-primary:focus{transform:translateY(-1px);box-shadow:0 13px 28px rgba(18,103,232,.30)!important}
.btn-primary-faded{background:#edf5ff!important;color:var(--fh-blue)!important;border-color:#dbeaff!important;font-weight:700}

/* Common panels / client area */
.panel,.card,.list-group-item,.package{border-color:var(--fh-line)!important}
.panel,.card{border-radius:var(--fh-radius)!important;box-shadow:0 10px 30px rgba(13,42,82,.055)}
.form-control{border-radius:10px!important;border-color:#d8e3f0!important;box-shadow:none!important}
.form-control:focus{border-color:#82b8ff!important;box-shadow:0 0 0 3px rgba(18,103,232,.10)!important}

/* Footer */
.main-footer,.footer{background:var(--fh-navy)!important;color:rgba(255,255,255,.72)!important}
.main-footer .footer-title,.main-footer h4,.main-footer h5,.footer h4,.footer h5{color:#fff!important}
.main-footer a,.footer a{color:rgba(255,255,255,.70)!important}
.main-footer a:hover,.footer a:hover{color:#fff!important}
.footer-bottom{background:#05142b!important;border-top:1px solid rgba(255,255,255,.08)!important}
.footer-copyright{color:rgba(255,255,255,.62)!important}

/* Small utilities */
.fh-kicker{display:inline-flex;align-items:center;gap:8px;font-size:12px;line-height:1;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--fh-blue)}
.fh-kicker:before{content:"";width:24px;height:2px;background:linear-gradient(90deg,var(--fh-blue),var(--fh-cyan));border-radius:9px}

@media(max-width:991px){
  .app-nav-menu .menu-primary>li.active>a:after{display:none}
  .app-nav-menu{box-shadow:none}
}
