/*
Theme Name: Favthon Enterprise
Theme URI: https://favthon.co.tz
Author: Favthon Technologies
Author URI: https://favthon.co.tz
Description: A clean, responsive custom WordPress theme for Favthon Enterprise. Built from scratch with Bootstrap 5 as the foundation.
Version: 1.7.9 Stable
Requires at least: 6.8
Tested up to: 6.8
Requires PHP: 8.3
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: favthon-enterprise
Tags: custom-theme, bootstrap, responsive, business, printing
*/

/* ==========================================================================
   CSS VARIABLES
   ========================================================================== */

:root {
    --primary-color: #1A50A0;
    --secondary-color: #0B2E63;
    --accent-color: #FFB000;

    --text-color: #333333;
    --text-light: #6C757D;

    --background-color: #FFFFFF;
    --light-bg: #F8F9FA;
    --border-color: #E5E7EB;

    --font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;

    --container-width: 1320px;

    --transition: all .3s ease;
}

/* ==========================================================================
   RESET
   ========================================================================== */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: var(--font-family);
    font-size: 16px;
    line-height: 1.7;
    color: var(--text-color);
    background: var(--background-color);
    overflow-x: hidden;
}

/* ==========================================================================
   TYPOGRAPHY
   ========================================================================== */

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: 1rem;
    color: var(--secondary-color);
    font-weight: 700;
    line-height: 1.25;
}

p {
    margin-top: 0;
    margin-bottom: 1rem;
}

a {
    color: var(--primary-color);
    text-decoration: none;
    transition: var(--transition);
}

a:hover,
a:focus {
    color: var(--accent-color);
}

/* ==========================================================================
   IMAGES
   ========================================================================== */

img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* ==========================================================================
   LAYOUT
   ========================================================================== */

.site {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.site-main {
    flex: 1;
    padding: 60px 0;
}

.home .site-main {
    padding-top: 0;
}

.container {
    width: 100%;
    max-width: var(--container-width);
    margin: 0 auto;
    padding-left: 15px;
    padding-right: 15px;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.site-header {
    background: #ffffff;
    border-bottom: 1px solid var(--border-color);
    position: sticky;
    top: 0;
    z-index: 999;
}

.site-branding {
    padding: 20px 0;
}

.site-title {
    margin: 0;
    font-size: 1.8rem;
}

.site-title a {
    color: var(--secondary-color);
}

.site-description {
    margin: 5px 0 0;
    color: var(--text-light);
    font-size: 0.95rem;
}

/* ==========================================================================
   NAVIGATION
   ========================================================================== */

.main-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.main-navigation li {
    display: inline-block;
    margin-right: 20px;
}

.main-navigation a {
    display: block;
    padding: 15px 0;
    color: var(--secondary-color);
    font-weight: 600;
}

.main-navigation a:hover {
    color: var(--primary-color);
}

/* ==========================================================================
   CONTENT
   ========================================================================== */

.entry-title {
    margin-bottom: 20px;
}

.entry-content {
    margin-bottom: 40px;
}

/* ==========================================================================
   FOOTER
   ========================================================================== */

.site-footer {
    background: var(--secondary-color);
    color: #ffffff;
    padding: 40px 0;
}

.site-footer a {
    color: #ffffff;
}

.site-footer a:hover {
    color: var(--accent-color);
}

.footer-copy {
    margin: 0;
    text-align: left;
}

/* ==========================================================================
   WORDPRESS DEFAULTS
   ========================================================================== */

.alignleft {
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
}

.alignright {
    float: right;
    margin-left: 20px;
    margin-bottom: 20px;
}

.aligncenter {
    display: block;
    margin: 0 auto 20px;
}

.wp-caption {
    max-width: 100%;
}

.wp-caption-text {
    font-size: 0.9rem;
    color: var(--text-light);
    text-align: center;
    margin-top: 10px;
}

.screen-reader-text {
    position: absolute;
    left: -9999px;
}

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

@media (max-width: 991px) {

    .main-navigation li {
        display: block;
        margin: 0;
    }

    .main-navigation a {
        padding: 10px 0;
    }

    .site-main {
        padding: 40px 0;
    }
}

/* === v1.4.5 Hero Floating Features === */
.hero-section{position:relative;min-height:720px;background-size:cover;background-position:center;}
.hero-features-wrapper{position:relative;margin-top:-70px;z-index:20}
.hero-features{background:#fff;border-radius:18px;box-shadow:0 20px 45px rgba(0,0,0,.12);display:grid;grid-template-columns:repeat(4,1fr);gap:30px;padding:35px 40px}
.feature-item{display:flex;gap:18px;align-items:flex-start}
.feature-icon{width:60px;height:60px;border-radius:50%;background:#0E3A75;color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.feature-item:nth-child(even) .feature-icon{background:#F5A623}
@media(max-width:991px){.hero-features{grid-template-columns:repeat(2,1fr)}}
@media(max-width:576px){.hero-features{grid-template-columns:1fr;margin-top:-40px;padding:25px}}

/* v1.4.6 hero refinement */
.hero-section{min-height:760px;background-position:center center;}
.hero-section:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,22,56,.88) 0%,rgba(5,22,56,.72) 35%,rgba(5,22,56,.15) 70%,transparent 100%);}
.hero-content{position:relative;z-index:2;animation:fadeHero .8s ease;}
@keyframes fadeHero{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.hero-features-wrapper{margin-top:-48px}
.hero-features{padding:26px 34px;border-radius:22px;gap:22px}
.feature-item{transition:.3s ease}
.feature-item:hover{transform:translateY(-6px)}
@media(max-width:767px){
.hero-features-wrapper{margin-top:24px}
.hero-section{padding-bottom:90px;min-height:680px}
.hero-buttons{margin-bottom:30px}
.hero-features{padding:22px;gap:18px}
}


/* ===== Favthon Enterprise v1.4.7 ===== */
.hero-section::before{
    display:none !important;
    content:none !important;
}
.hero-section{
    background-size:cover;
    background-position:center center;
}
.hero-buttons{
    display:flex;
    gap:16px;
    align-items:center;
    flex-wrap:wrap;
}
.hero-buttons .btn,
.hero-buttons a.btn{
    padding:14px 28px;
    min-width:190px;
}
.hero-features{
    border-radius:24px;
    box-shadow:0 18px 50px rgba(0,0,0,.12);
}
.feature-item{
    border-radius:12px;
    padding:8px;
}
.feature-item:hover{
    background:#f8fbff;
}
@media (max-width:767px){
.hero-buttons{
    flex-direction:row !important;
    justify-content:center;
    flex-wrap:nowrap;
    gap:10px;
}
.hero-buttons .btn,
.hero-buttons a.btn{
    min-width:145px;
    width:auto !important;
    padding:11px 14px;
    font-size:14px;
}
.hero-features-wrapper{
    margin-top:36px !important;
}
.hero-section{
    padding-bottom:40px;
}
}


/* ===== Favthon Enterprise v1.4.8 Hero Refresh ===== */
.hero-section{
 min-height:760px;
 background-size:cover;
 background-position:center center;
 background-attachment:fixed;
 position:relative;
}
.hero-section::before{
 content:"";
 position:absolute;
 inset:0;
 background:linear-gradient(90deg,rgba(5,22,56,.20) 0%,rgba(5,22,56,.08) 28%,rgba(0,0,0,0) 55%);
 pointer-events:none;
}
.hero-content{position:relative;z-index:2;animation:favFade .9s ease-out}
@keyframes favFade{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.hero-content h1{font-size:clamp(42px,5vw,64px);line-height:1.08;font-weight:800}
.hero-content p{max-width:620px;font-size:18px;line-height:1.7}
.hero-buttons{display:flex;gap:14px}
.hero-buttons .btn,.hero-buttons a.btn{
 border-radius:50px;
 padding:14px 30px;
 transition:.35s;
 box-shadow:0 10px 24px rgba(0,0,0,.12);
}
.hero-buttons .btn:hover,.hero-buttons a.btn:hover{
 transform:translateY(-3px) scale(1.03);
 box-shadow:0 18px 36px rgba(0,0,0,.18);
}
.hero-features-wrapper{margin-top:-42px}
.hero-features{
 padding:24px 28px;
 border-radius:26px;
 box-shadow:0 22px 55px rgba(0,0,0,.14);
}
.feature-item:hover{
 transform:translateY(-6px);
 transition:.3s;
}
@media(max-width:767px){
.hero-section{
 min-height:640px;
 background-attachment:scroll;
 padding-bottom:30px;
}
.hero-content h1{font-size:36px}
.hero-content p{font-size:16px}
.hero-buttons{
 display:flex;
 flex-direction:row!important;
 justify-content:center;
 align-items:center;
 gap:10px;
 flex-wrap:nowrap;
}
.hero-buttons .btn,.hero-buttons a.btn{
 flex:1;
 min-width:0;
 max-width:170px;
 padding:12px 10px;
 font-size:14px;
 border-radius:40px;
}
.hero-features-wrapper{
 margin-top:42px!important;
}
}

/* v1.5.0 – Header mobile + hero refinements */
@media(max-width:991px){
.top-bar,.header-top,.site-topbar,.top-header,.favthon-topbar{display:none!important;}
.mobile-header-actions{display:flex;align-items:center;gap:12px;margin-left:auto}
.mobile-header-social,.mobile-language-switcher{display:flex!important}
}
@media(max-width:767px){
.hero-buttons,.favthon-hero__buttons{display:flex!important;flex-direction:row!important;justify-content:center;gap:10px;flex-wrap:wrap!important}
.hero-buttons .btn,.hero-buttons a.btn,.favthon-hero__buttons .btn{flex:0 1 auto;max-width:none;min-width:0;padding:12px 18px;font-size:14px;width:auto!important}
}