/* EXCELLA GLOBAL - theme styles
   Ported from the FN Global design system. Class prefix .eg-
*/

/* ==== GLOBAL ==== */
/* ============================================================
   GLOBAL DESIGN CONFIGURATION - EXCELLA GLOBAL
   Theme: Light Background with Dark Text
============================================================ */

:root {
    --eg-primary-orange: #ff9700;
    --eg-text-color-dark: #222222; /* Main text color for light bg */
    --eg-text-color-light: #ffffff; /* For dark sections like hero */
    --eg-body-background: #fafafa; /* Light site background */
    --eg-container-width: 1140px;
}

html, body {
    margin: 0;
    padding: 0;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.6;
    color: var(--eg-text-color-dark);
    background-color: var(--eg-body-background);
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0 0 1rem 0;
    font-weight: 700;
    line-height: 1.2;
}

h1 { font-size: clamp(32px, 5vw, 52px); }
h2 { font-size: clamp(26px, 4vw, 36px); }

a { transition: all 0.3s ease; text-decoration: none; }

/* Boxed Container for Normal Sections */
.eg-boxed-content {
    max-width: var(--eg-container-width);
    margin: 0 auto;
    padding: 60px 20px;
    box-sizing: border-box;
}

/* ============================================================
   


/* ==== HEADER ==== */
/* ============================================================
   EXCELLA GLOBAL HEADER v3
   Direct Service Navigation (SEO-optimised, no Hizmetlerimiz)
   Updated: 28 June 2026
============================================================ */

.eg-header-wrapper { width: 100%; position: relative; z-index: 1000; font-family: 'Montserrat', sans-serif; }

/* ---------- TOPBAR ---------- */
.eg-topbar { background-color: #222222; color: #999999; padding: 10px 0; font-size: 13px; border-bottom: 1px solid #333; }
.eg-topbar-inner { max-width: 1400px; margin: 0 auto; padding: 0 40px; display: flex; justify-content: space-between; align-items: center; }
.eg-topbar-left { display: flex; gap: 15px; align-items: center; }
.eg-topbar-left a { color: #999999; text-decoration: none; transition: color 0.3s; display: flex; align-items: center; }
.eg-topbar-left a:hover { color: #ff9700; }
.eg-topbar-left svg { width: 16px; height: 16px; fill: currentColor; }
.eg-topbar-right { display: flex; gap: 20px; align-items: center; }
.eg-topbar-right span, .eg-topbar-right a { color: #999999; text-decoration: none; display: flex; align-items: center; gap: 5px; transition: color 0.3s; }
.eg-topbar-right a:hover { color: #ff9700; }

/* ---------- MAIN NAV ---------- */
.eg-main-nav { background-color: #2a2a2a; padding: 12px 0; position: relative; }
.eg-nav-inner { max-width: 1400px; margin: 0 auto; padding: 0 40px; display: flex; justify-content: space-between; align-items: center; position: relative; }
.eg-logo img { height: 42px; }

/* ---------- DESKTOP MENU ---------- */
.eg-menu { display: flex; gap: 0; list-style: none; margin: 0; padding: 0; align-items: center; }
.eg-menu > li { position: relative; }
.eg-menu > li > a {
    color: #cccccc;
    text-decoration: none;
    font-size: 12.5px;
    font-weight: 500;
    letter-spacing: 0.3px;
    transition: color 0.25s, background 0.25s;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 10px 11px;
    white-space: nowrap;
}
.eg-menu > li > a:hover,
.eg-menu > li:hover > a { color: #ff9700; }

/* Dropdown arrow */
.eg-arr { font-size: 9px; opacity: 0.7; transition: transform 0.25s; display: inline-block; }
.eg-menu > li:hover .eg-arr { transform: rotate(180deg); }

/* ---------- DROPDOWN ---------- */
.eg-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 1px);
    left: 0;
    background: #1e1e1e;
    min-width: 250px;
    padding: 8px 0;
    box-shadow: 0 12px 30px rgba(0,0,0,0.55);
    border-top: 2px solid #ff9700;
    border-radius: 0 0 5px 5px;
    list-style: none;
    margin: 0;
    z-index: 1010;
}
.eg-menu > li:hover .eg-dropdown { display: block; }
.eg-dropdown li a {
    display: flex !important;
    align-items: center;
    gap: 8px;
    color: #bbbbbb !important;
    font-size: 12.5px !important;
    font-weight: 400 !important;
    padding: 9px 18px !important;
    text-decoration: none;
    border-bottom: 1px solid #2a2a2a;
    transition: all 0.2s !important;
    white-space: nowrap;
}
.eg-dropdown li:last-child a { border-bottom: none; }
.eg-dropdown li a::before { content: '›'; color: #ff9700; font-size: 14px; opacity: 0; transition: opacity 0.2s, transform 0.2s; transform: translateX(-4px); }
.eg-dropdown li a:hover { color: #ffffff !important; background: #252525; padding-left: 22px !important; }
.eg-dropdown li a:hover::before { opacity: 1; transform: translateX(0); }

/* Locked sub-pages */
.eg-locked { opacity: 0.45; pointer-events: none; }

/* ---------- ICON BAR ---------- */
.eg-menu-icons { display: flex; gap: 12px; align-items: center; flex-shrink: 0; margin-left: 6px; }
.eg-menu-icons a { color: #cccccc; display: flex; align-items: center; text-decoration: none; transition: color 0.3s; }
.eg-menu-icons svg { width: 20px; height: 20px; fill: currentColor; }
.eg-menu-icons a:hover { color: #ff9700; }
.eg-menu-icons a.eg-mobile-hamburger { display: none !important; }
.eg-menu-icons a.eg-desktop-sidebar-btn { display: flex !important; }

/* ---------- SEARCH BOX ---------- */
.eg-search-box { display: none; position: absolute; top: 100%; right: 40px; background: #1e1e1e; padding: 12px; border-radius: 0 0 5px 5px; box-shadow: 0 10px 20px rgba(0,0,0,0.5); z-index: 1001; margin-top: 12px; border-top: 2px solid #ff9700; }
.eg-search-box.active { display: flex; }
.eg-search-box form { display: flex; }
.eg-search-box input { padding: 9px 12px; border: none; outline: none; width: 210px; font-family: 'Montserrat', sans-serif; font-size: 13px; background: #111; color: #fff; }
.eg-search-box button { padding: 9px 14px; background: #ff9700; color: #000; border: none; cursor: pointer; font-weight: 700; font-family: 'Montserrat', sans-serif; font-size: 13px; }

/* ---------- OFFCANVAS SIDEBAR ---------- */
.eg-sidebar-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.75); z-index: 2000; display: none; opacity: 0; transition: opacity 0.3s; }
.eg-sidebar-overlay.active { display: block; opacity: 1; }
.eg-offcanvas { position: fixed; top: 0; right: -400px; width: 380px; max-width: 100%; height: 100vh; background: #111111; z-index: 2001; transition: right 0.4s ease; overflow-y: auto; box-shadow: -5px 0 30px rgba(0,0,0,0.5); border-left: 2px solid #ff9700; }
.eg-offcanvas.active { right: 0; }
.eg-offcanvas-inner { padding: 40px 30px; }
.eg-offcanvas-close { position: absolute; top: 20px; right: 25px; color: #fff; font-size: 35px; cursor: pointer; text-decoration: none; line-height: 1; transition: 0.3s; }
.eg-offcanvas-close:hover { color: #ff9700; transform: scale(1.1); }
.eg-offcanvas-logo img { height: 40px; margin-bottom: 30px; }
.eg-offcanvas-img { width: 100%; border-radius: 6px; margin-bottom: 25px; box-shadow: 0 10px 20px rgba(0,0,0,0.3); }
.eg-offcanvas-about h3, .eg-offcanvas-form h3 { color: #fff; font-size: 20px; margin: 0 0 15px 0; border-bottom: 1px solid #333; padding-bottom: 10px; font-weight: 600; }
.eg-offcanvas-about p { color: #aaaaaa; font-size: 14px; line-height: 1.7; margin-bottom: 35px; }
.eg-offcanvas-form .wpcf7-form-control-wrap { display: block; margin-bottom: 15px; }
.eg-offcanvas-form .eg-off-input,
.eg-offcanvas-form .eg-off-textarea { width: 100%; background: #1a1a1a; border: 1px solid #333; padding: 12px 15px; color: #fff; font-family: 'Montserrat', sans-serif; font-size: 14px; border-radius: 4px; box-sizing: border-box; transition: 0.3s; }
.eg-offcanvas-form .eg-off-input:focus,
.eg-offcanvas-form .eg-off-textarea:focus { outline: none; border-color: #ff9700; background: #000; }
.eg-offcanvas-form .eg-off-textarea { height: 100px; resize: vertical; }
.eg-offcanvas-form .eg-off-btn { width: 100%; background: #ff9700; color: #000; border: none; padding: 15px; font-weight: 700; font-size: 14px; text-transform: uppercase; cursor: pointer; border-radius: 4px; transition: 0.3s; font-family: 'Montserrat', sans-serif; }
.eg-offcanvas-form .eg-off-btn:hover { background: #fff; color: #000; }
.eg-offcanvas-form .wpcf7-not-valid-tip { color: #ff9700; font-size: 11px; margin-top: 5px; }
.eg-offcanvas-form .wpcf7-response-output { border-radius: 4px; padding: 10px; margin: 10px 0 0 0; font-size: 12px; }

/* ---------- MOBILE ---------- */
@media (max-width: 1100px) {
    .eg-menu > li > a { padding: 10px 8px; font-size: 11.5px; }
}

@media (max-width: 1300px) {
    .eg-topbar-inner { flex-direction: column; gap: 8px; }
    .eg-nav-inner { padding: 0 20px; }
    .eg-menu-icons a.eg-desktop-sidebar-btn { display: none !important; }
    .eg-menu-icons a.eg-mobile-hamburger { display: flex !important; }

    /* Mobile menu wrapper */
    .eg-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: #1e1e1e;
        flex-direction: column;
        padding: 0;
        margin-top: 12px;
        box-shadow: 0 10px 20px rgba(0,0,0,0.5);
        z-index: 999;
        max-height: 80vh;
        overflow-y: auto;
    }
    .eg-menu.active { display: flex; }
    .eg-menu > li { width: 100%; border-bottom: 1px solid #2a2a2a; }

    /* Mobile: parent link */
    .eg-menu > li > a {
        display: flex !important;
        justify-content: space-between;
        padding: 14px 20px !important;
        font-size: 14px !important;
        color: #ffffff !important;
    }

    /* Mobile: dropdown (hidden by default, toggled by JS) */
    .eg-dropdown {
        display: none !important;
        position: static !important;
        width: 100% !important;
        box-shadow: none !important;
        border-top: none !important;
        border-radius: 0 !important;
        background: #161616 !important;
        padding: 4px 0 8px 0 !important;
        min-width: unset !important;
    }
    .eg-menu > li.eg-mob-open .eg-dropdown { display: block !important; }
    .eg-menu > li.eg-mob-open .eg-arr { transform: rotate(180deg); }

    .eg-dropdown li a {
        padding: 10px 20px 10px 30px !important;
        font-size: 13px !important;
        border-bottom-color: #222 !important;
    }
    .eg-dropdown li a:hover { padding-left: 34px !important; }

    .eg-search-box { right: 20px; width: calc(100% - 40px); }
    .eg-search-box input { width: 100%; }
}

/* ==== FOOTER ==== */
/* ============================================================
   GLOBAL FOOTER WITH CF7 SUPPORT (FIXED LAYOUT) & LEGAL LINKS
============================================================ */
.eg-footer-wrapper {
    background: repeating-linear-gradient(-45deg, #282828, #282828 2px, #2b2b2b 2px, #2b2b2b 4px);
    color: #999999;
    font-family: 'Montserrat', sans-serif;
}
.eg-footer-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.eg-footer-top { text-align: center; padding: 60px 0; border-bottom: 1px solid rgba(255,255,255,0.05); }
.eg-footer-top h3 { color: #ff9700; font-size: 22px; font-weight: 300; letter-spacing: 1px; margin-bottom: 15px; text-transform: uppercase; }
.eg-footer-top p { max-width: 800px; margin: 0 auto; font-size: 15px; line-height: 1.8; color: #b3b3b3; }
.eg-footer-middle { display: grid; grid-template-columns: 2fr 1.5fr 1.5fr 1fr; gap: 40px; padding: 60px 0; border-bottom: 1px solid rgba(255,255,255,0.05); }
.eg-footer-col h4 { color: #cccccc; font-size: 16px; font-weight: 400; margin-bottom: 25px; border-bottom: 1px solid rgba(255,255,255,0.1); padding-bottom: 10px; display: inline-block; }
.eg-footer-col p { font-size: 13px; line-height: 1.8; margin-bottom: 20px; }

/* Contact Form 7 Styling for Footer - FORCE INLINE FIX */
.eg-community-form { margin-top: 15px; width: 100%; position: relative; }
.eg-community-form .wpcf7 form { margin: 0; padding: 0; }
.eg-community-form .wpcf7 form p, 
.eg-community-form .eg-community-cf7-flex { 
    display: flex !important; 
    flex-direction: row !important; 
    width: 100% !important; 
    margin: 0 !important; 
    padding: 0 !important;
    align-items: stretch !important;
}
.eg-community-form .wpcf7-form-control-wrap { 
    flex-grow: 1; 
    display: block; 
    margin: 0 !important;
    padding: 0 !important;
}
.eg-community-form input[type="email"] { 
    background-color: #1f1f1f !important; 
    border: 1px solid #333 !important; 
    color: #fff !important; 
    padding: 0 15px !important; 
    font-size: 13px !important; 
    width: 100% !important; 
    height: 45px !important; 
    border-radius: 3px 0 0 3px !important; 
    outline: none !important; 
    box-sizing: border-box !important; 
    margin: 0 !important;
}
.eg-community-form input[type="submit"] { 
    background-color: #ff9700 !important; 
    color: #111 !important; 
    border: none !important; 
    padding: 0 20px !important; 
    cursor: pointer !important; 
    border-radius: 0 3px 3px 0 !important; 
    transition: background 0.3s !important; 
    font-weight: 700 !important; 
    height: 45px !important; 
    box-sizing: border-box !important; 
    margin: 0 !important;
}
.eg-community-form input[type="submit"]:hover { background-color: #e68800 !important; }
.eg-community-form .wpcf7-not-valid-tip { font-size: 11px; margin-top: 4px; position: absolute; color: #ff9700; }
.eg-community-form .wpcf7-response-output { font-size: 12px; margin: 15px 0 0 0 !important; padding: 10px !important; color: #ff9700 !important; border: 1px solid #ff9700 !important; }
.eg-community-form .wpcf7-spinner { display: none !important; } 

/* Rest of the Footer */
.eg-article-list { list-style: none; padding: 0; margin: 0; }
.eg-article-list li { border-bottom: 1px solid rgba(255,255,255,0.05); padding-bottom: 15px; margin-bottom: 15px; }
.eg-article-list li a { color: #ff9700; text-decoration: none; font-size: 14px; font-weight: 600; transition: color 0.3s; display: block; margin-bottom: 5px; }
.eg-article-list li a:hover { color: #ffffff; }
.eg-article-list li span { font-size: 12px; color: #777; }
.eg-tag-wrap { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 30px; }
.eg-tag-wrap a { border: 1px solid rgba(255,255,255,0.1); padding: 5px 12px; font-size: 12px; color: #999; text-decoration: none; border-radius: 3px; transition: all 0.3s; }
.eg-tag-wrap a:hover { border-color: #ff9700; color: #ff9700; }
.eg-download-btn { display: inline-flex; align-items: center; gap: 10px; border: 1px solid rgba(255,255,255,0.2); padding: 10px 20px; color: #fff; text-decoration: none; font-size: 13px; border-radius: 3px; transition: all 0.3s; }
.eg-download-btn:hover { background: rgba(255,151,0,0.1); border-color: #ff9700; color: #ff9700; }
.eg-awesome-icon { width: 60px; height: 60px; border: 1px solid #ff9700; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 15px auto; color: #ff9700; }
.eg-footer-stats { display: grid; grid-template-columns: repeat(4, 1fr); text-align: center; padding: 50px 0; }
.eg-stat-item .eg-stat-icon { width: 60px; height: 60px; border: 1px solid #ff9700; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 15px auto; color: #ff9700; transition: all 0.3s; }
.eg-stat-item:hover .eg-stat-icon { background: #ff9700; color: #111; }
.eg-stat-item h5 { color: #cccccc; font-size: 24px; font-weight: 300; margin: 0 0 5px 0; }
.eg-stat-item p { color: #999999; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; margin: 0; }
.eg-contact-link { color: #cccccc; text-decoration: none; transition: color 0.3s ease; }
.eg-contact-link:hover { color: #ff9700; }

/* Copyright & Legal Links */
.eg-footer-copyright { background-color: #222222; padding: 20px 0; font-size: 12px; color: #777; border-top: 1px solid #111; }
.eg-copyright-inner { max-width: 1200px; margin: 0 auto; padding: 0 20px; display: flex; justify-content: space-between; align-items: center; }
.eg-legal-links a { color: #777; text-decoration: none; transition: color 0.3s; margin-left: 15px; }
.eg-legal-links a:hover { color: #ff9700; }

/* Scroll to Top Button Styling */
#fnScrollTopBtn {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 9999;
    border: none;
    outline: none;
    background-color: #ff9700;
    color: #111;
    cursor: pointer;
    padding: 15px;
    border-radius: 50%;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    transition: all 0.3s ease;
}
#fnScrollTopBtn:hover {
    background-color: #222;
    color: #ff9700;
}
#fnScrollTopBtn svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
    display: block;
}

@media (max-width: 992px) { 
    .eg-footer-middle { grid-template-columns: 1fr 1fr; } 
    .eg-footer-stats { grid-template-columns: 1fr 1fr; gap: 30px; } 
}
@media (max-width: 768px) { 
    .eg-footer-middle { grid-template-columns: 1fr; } 
    .eg-footer-stats { 
        grid-template-columns: repeat(2, 1fr); 
        gap: 20px; 
        padding: 30px 0;
    } 
    .eg-stat-item h5 { font-size: 20px; } 
    #fnScrollTopBtn { bottom: 20px; right: 20px; padding: 12px; }
    .eg-copyright-inner { flex-direction: column; gap: 10px; text-align: center; }
    .eg-legal-links a { margin: 0 10px; }
}

/* ==== THEME ADDITIONS ====
   Styles for markup that did not exist on FN Global: the built-in contact form
   (replacing Contact Form 7), the non-link dropdown entries, the topbar
   location and phone, and a few accessibility affordances. */

/* ---------- skip link ---------- */
.eg-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 3000;
	background: #ff9700;
	color: #111;
	padding: 12px 20px;
	font-weight: 700;
	font-size: 14px;
}
.eg-skip:focus { left: 0; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden; clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

/* ---------- topbar extras ---------- */
.eg-topbar-loc {
	display: flex;
	align-items: center;
	gap: 5px;
	color: #999;
}
.eg-topbar-loc svg { width: 14px; height: 14px; fill: currentColor; }
.eg-topbar-right svg { flex-shrink: 0; }

/* ---------- dropdown toggle ----------
   The arrow used to be a decorative <span> and hover was the only way to open
   a dropdown, so the menu was unreachable on touch and slipped shut whenever
   the pointer drifted off. It is now a real button that pins the menu open. */
button.eg-arr {
	background: none;
	border: 0;
	padding: 6px 6px 6px 2px;
	margin: 0;
	font: inherit;
	font-size: 9px;
	line-height: 1;
	color: inherit;
	opacity: .7;
	cursor: pointer;
	transition: transform .25s, opacity .25s;
	display: inline-flex;
	align-items: center;
	align-self: stretch;
}
button.eg-arr:hover,
button.eg-arr:focus-visible { opacity: 1; color: #ff9700; }
button.eg-arr:focus-visible { outline: 2px solid #ff9700; outline-offset: 2px; }

/* pinned open by click, on any screen size */
.eg-menu > li.eg-open > .eg-dropdown { display: block; }
.eg-menu > li.eg-open > button.eg-arr { transform: rotate(180deg); opacity: 1; color: #ff9700; }
.eg-menu > li.eg-open > a { color: #ff9700; }

/* the top-level item is now a link plus a button side by side */
.eg-menu > li { display: flex; align-items: center; }
.eg-menu > li > a { padding-right: 4px; }

@media (max-width: 1300px) {
	.eg-menu > li { display: block; }
	.eg-menu > li.eg-open .eg-dropdown { display: block !important; }
	.eg-menu > li.eg-open button.eg-arr { transform: rotate(180deg); }
	/* the whole row is the tap target on mobile, so float the arrow right */
	.eg-menu > li.eg-has-drop { position: relative; }
	.eg-menu > li.eg-has-drop > button.eg-arr {
		position: absolute;
		top: 0;
		right: 6px;
		height: 40px;
		padding: 0 14px;
		font-size: 11px;
	}
}

/* ---------- header fit ----------
   The nav needed ~1500px to fit, so it overflowed on any normal laptop. Two
   causes: the logo <img> carries width="290" as an attribute and the CSS only
   set a height, so it reserved 290px for a mark that draws at ~172px; and the
   dropdown toggle buttons added roughly 100px across the bar. */
.eg-logo img {
	height: 38px;
	width: auto;
	display: block;
}

.eg-menu > li > a { padding-left: 9px; padding-right: 3px; }

/* ---------- dropdowns near the right edge ----------
   Every dropdown opens with `left: 0` on its parent item, which pushes the
   panel off the right of the screen for the last few menu items. `.eg-flip`
   anchors those to the right edge of their parent instead. Which items need it
   is worked out in site.js by measuring, not hardcoded to an item count,
   because the menu is client-editable and its length changes. */
.eg-menu > li.eg-flip > .eg-dropdown {
	left: auto;
	right: 0;
}

@media (max-width: 1300px) {
	/* the mobile menu is a full-width accordion, nothing can overflow */
	.eg-menu > li.eg-flip > .eg-dropdown { left: 0; right: auto; }
}

/* ---------- language switcher ---------- */
.eg-langs {
	display: flex;
	align-items: center;
	gap: 2px;
	margin-left: 4px;
}
.eg-lang {
	color: #999;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .06em;
	padding: 3px 7px;
	border-radius: 3px;
	line-height: 1.4;
	transition: color .25s, background .25s;
}
.eg-lang:hover { color: #ff9700; }
.eg-lang.is-current { color: #111; background: #ff9700; }

/* current page in the main menu */
.eg-menu > li.eg-current > a { color: #ff9700; }

/* ---------- dropdown entries with no page yet ----------
   FN Global rendered these as <a href="#" class="fn-locked">, a link that
   looked clickable but went nowhere. Here they are plain text. */
.eg-soon {
	display: flex;
	align-items: center;
	gap: 8px;
	color: #6e6e6e;
	font-size: 12.5px;
	font-weight: 400;
	padding: 9px 18px;
	border-bottom: 1px solid #2a2a2a;
	cursor: default;
}
.eg-dropdown li:last-child .eg-soon { border-bottom: none; }

/* ---------- offcanvas panel ----------
   The panel is parked at right:-400px when closed, which moves it out of sight
   but leaves its links and form fields in the tab order, so a keyboard user
   tabs into a panel they cannot see. visibility:hidden takes it out of the tab
   order while still allowing the slide-in transition. */
.eg-offcanvas { visibility: hidden; }
.eg-offcanvas.active { visibility: visible; }

/* ---------- built-in form ---------- */
.eg-form { display: block; }
.eg-f-input,
.eg-f-textarea {
	width: 100%;
	background: #1a1a1a;
	border: 1px solid #333;
	padding: 12px 15px;
	margin-bottom: 12px;
	color: #fff;
	font-family: 'Montserrat', sans-serif;
	font-size: 14px;
	border-radius: 4px;
	box-sizing: border-box;
	transition: border-color .25s, background .25s;
}
.eg-f-input::placeholder,
.eg-f-textarea::placeholder { color: #777; }
.eg-f-input:focus,
.eg-f-textarea:focus { outline: none; border-color: #ff9700; background: #000; }
.eg-f-textarea { min-height: 110px; resize: vertical; }

.eg-f-btn {
	width: 100%;
	background: #ff9700;
	color: #111;
	border: none;
	padding: 15px;
	font-weight: 700;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: .04em;
	cursor: pointer;
	border-radius: 4px;
	transition: background .25s, color .25s, transform .25s;
	font-family: 'Montserrat', sans-serif;
}
.eg-f-btn:hover { background: #fff; color: #111; transform: translateY(-2px); }

/* the honeypot must be reachable by bots parsing the DOM but invisible and
   unfocusable for people, so it is moved off-screen rather than display:none */
.eg-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.eg-form-note {
	padding: 12px 14px;
	border-radius: 4px;
	font-size: 13px;
	margin: 0 0 14px;
	line-height: 1.55;
}
.eg-form-note--ok { background: rgba(42, 157, 63, .14); border: 1px solid #2a9d3f; color: #7fd68f; }
.eg-form-note--bad { background: rgba(211, 51, 51, .14); border: 1px solid #d33; color: #ff9d9d; }

/* the contact page sits on a light background, so the dark form inputs need
   inverting there */
.eg-form--light .eg-f-input,
.eg-form--light .eg-f-textarea {
	background: #fff;
	border-color: #ddd;
	color: #222;
}
.eg-form--light .eg-f-input::placeholder,
.eg-form--light .eg-f-textarea::placeholder { color: #999; }
.eg-form--light .eg-f-input:focus,
.eg-form--light .eg-f-textarea:focus { background: #fff; border-color: #ff9700; }

/* ---------- footer contact column ---------- */
.eg-footer-contact p { text-align: left; }

/* ---------- scroll to top ----------
   The original toggled inline display from JS. Using a class keeps the styling
   in CSS and lets the button animate instead of snapping in. */
#egScrollTopBtn {
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity .25s, transform .25s, visibility .25s;
}
#egScrollTopBtn.is-visible {
	display: block;
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* ---------- blog, search, single, 404 ----------
   FN Global had no blog templates at all; every URL was a hand-built page.
   These give posts, search results and 404s the same visual language. */
.eg-archive-title,
.eg-single-title {
	font-size: clamp(28px, 4vw, 42px);
	margin-bottom: 8px;
}
.eg-post-meta { color: #888; font-size: 13px; margin-bottom: 22px; }

.eg-post-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 30px;
	margin-top: 30px;
}
.eg-post-card {
	background: #fff;
	border: 1px solid #ececec;
	border-radius: 8px;
	overflow: hidden;
	transition: transform .3s, box-shadow .3s;
}
.eg-post-card:hover { transform: translateY(-5px); box-shadow: 0 14px 30px rgba(0, 0, 0, .09); }
.eg-post-thumb img { width: 100%; height: 200px; object-fit: cover; display: block; }
.eg-post-body { padding: 22px 24px 26px; }
.eg-post-body h2 { font-size: 20px; margin-bottom: 6px; }
.eg-post-body h2 a { color: #222; }
.eg-post-body h2 a:hover { color: #ff9700; }
.eg-post-more { color: #ff9700; font-weight: 600; font-size: 14px; }

.eg-pagination { margin-top: 40px; }
.eg-pagination .page-numbers {
	display: inline-block;
	padding: 8px 14px;
	margin-right: 6px;
	border: 1px solid #e2e2e2;
	border-radius: 4px;
	color: #555;
	font-weight: 600;
	font-size: 14px;
}
.eg-pagination .page-numbers.current,
.eg-pagination .page-numbers:hover { background: #ff9700; border-color: #ff9700; color: #111; }

.eg-single-body { max-width: 780px; }
.eg-single-body p { margin-bottom: 1.2em; }
.eg-single-thumb img { width: 100%; height: auto; border-radius: 8px; margin-bottom: 26px; }

.eg-404 { text-align: center; max-width: 620px; }
.eg-404-search { display: flex; gap: 10px; margin: 26px 0; }
.eg-404-search .eg-f-input { margin-bottom: 0; background: #fff; border-color: #ddd; color: #222; }
.eg-404-search .eg-f-btn { width: auto; padding: 14px 26px; }
.eg-empty { color: #666; }

@media (prefers-reduced-motion: reduce) {
	* { animation-duration: .01ms !important; transition-duration: .01ms !important; }
	html { scroll-behavior: auto !important; }
}