/*
Theme Name: GF Enterprise
Theme URI: https://gfenterprise.net
Author: Sysmak Group
Author URI: https://sysmakgroup.com
Description: Custom WordPress theme for GF Enterprise.
Version: 0.4.7
Text Domain: gf-enterprise
*/


/* =========================================================
   01. GLOBAL VARIABLES
   ========================================================= */

   :root {

    /* Brand colors */
    --gf-blue: #0d63b8;
    --gf-blue-light: #1680df;
    --gf-blue-dark: #073f78;
    --gf-navy: #082b52;

    /* Text colors */
    --gf-text: #132238;
    --gf-muted: #66768a;

    /* UI colors */
    --gf-border: #e4eaf1;
    --gf-soft: #f3f8fd;
    --gf-white: #ffffff;

    /* WhatsApp */
    --gf-green: #25d366;

    /* Main page width */
    --container: 1240px;

    /* Radius */
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 26px;

    /* Shadows */
    --shadow-sm:
        0 8px 28px rgba(10, 53, 96, 0.08);

    --shadow-md:
        0 20px 55px rgba(10, 53, 96, 0.14);
}


/* =========================================================
   02. RESET / GLOBAL
   ========================================================= */

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


html {
    scroll-behavior: smooth;
}


body {

    margin: 0;

    color: var(--gf-text);
    background: var(--gf-white);

    font-family:
        "Poppins",
        "Montserrat",
        Arial,
        Helvetica,
        sans-serif;

    font-size: 16px;
    line-height: 1.6;

    overflow-x: hidden;
}


body,
button,
input,
select,
textarea {

    font-family:
        "Poppins",
        "Montserrat",
        Arial,
        Helvetica,
        sans-serif;
}


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


a {
    color: inherit;
    text-decoration: none;
}


button {
    border: 0;
    font: inherit;
}


svg {
    display: block;
}


/* Main content container */

.container {

    width:
        min(
            calc(100% - 48px),
            var(--container)
        );

    margin-inline: auto;
}


/* Standard page section spacing */

.section {
    padding: 96px 0;
}


/* =========================================================
   03. TYPOGRAPHY
   ========================================================= */

h1,
h2,
h3,
h4,
h5,
h6 {

    margin-top: 0;

    font-family:
        "Poppins",
        "Montserrat",
        Arial,
        sans-serif;

    color: var(--gf-navy);
}


.section-heading {
    margin-bottom: 40px;
}


.section-heading h2 {

    margin: 0 0 10px;

    font-size:
        clamp(
            2rem,
            4vw,
            3rem
        );

    line-height: 1.12;
    font-weight: 700;
    letter-spacing: -0.035em;
}


.section-heading p {

    max-width: 640px;

    margin: 0;

    color: var(--gf-muted);
}


.section-heading-row {

    display: flex;

    justify-content: space-between;
    align-items: flex-end;

    gap: 30px;
}


.section-kicker {

    display: inline-block;

    margin-bottom: 10px;

    color: var(--gf-blue);

    font-size: 0.74rem;
    font-weight: 700;

    letter-spacing: 0.13em;
    text-transform: uppercase;
}


.section-kicker.light {
    color: rgba(255, 255, 255, .72);
}


.centered {
    text-align: center;
}


.centered p {
    margin-inline: auto;
}


.text-link {

    color: var(--gf-blue);

    font-size: .88rem;
    font-weight: 600;
}


.text-link:hover {
    color: var(--gf-blue-dark);
}


/* =========================================================
   04. TOP INFORMATION BAR
   ========================================================= */

.topbar {

    background: var(--gf-navy);

    color:
        rgba(
            255,
            255,
            255,
            .92
        );
}


.topbar-inner {

    min-height: 36px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 30px;
}


.topbar-left,
.topbar-right {

    display: flex;

    align-items: center;

    gap: 24px;
}


.topbar-item {

    display: inline-flex;

    align-items: center;

    gap: 7px;

    font-size: .74rem;
    font-weight: 500;
}


.topbar-item svg {

    width: 14px;
    height: 14px;

    fill: none;

    stroke: currentColor;
    stroke-width: 1.8;
}


.topbar-right {

    font-size: .72rem;
    font-weight: 500;

    letter-spacing: .02em;
}


/* =========================================================
   05. MAIN HEADER
   ========================================================= */

.site-header {

    position: sticky;

    top: 0;

    z-index: 1000;

    background:
        rgba(
            255,
            255,
            255,
            .97
        );

    border-bottom:
        1px solid
        rgba(
            10,
            44,
            80,
            .06
        );

    transition:
        box-shadow .25s ease,
        background .25s ease,
        backdrop-filter .25s ease;
}


/* Header style after scrolling */

.site-header.is-scrolled {

    background:
        rgba(
            255,
            255,
            255,
            .94
        );

    backdrop-filter:
        blur(16px);

    box-shadow:
        0 10px 35px
        rgba(
            10,
            50,
            90,
            .08
        );
}


/* Header horizontal layout */

.header-inner {

    min-height: 96px;

    display: flex;

    align-items: center;

    gap: 30px;
}


/* =========================================================
   06. GF Enterprise logo
   ========================================================= */

/*
 * This is the REAL GF Enterprise PNG logo.
 *
 * Desktop:
 * Default height 60px.
 *
 * Tablet and mobile sizes are controlled
 * later inside RESPONSIVE sections.
 */

.site-brand {

    flex-shrink: 0;

    display: inline-flex;

    align-items: center;
}


.site-logo {

    display: inline-flex;

    align-items: center;
}


.site-logo-image {

    display: block;

    width: auto;

    height: var(--gf-logo-desktop, 60px);

    max-width: 310px;

    object-fit: contain;
}


/* =========================================================
   07. DESKTOP NAVIGATION
   ========================================================= */

.main-nav {

    margin-left: auto;

    display: flex;

    align-items: center;

    gap: 27px;
}


.main-nav a {

    position: relative;

    padding: 34px 0;

    color: #30445b;

    font-size: .84rem;
    font-weight: 500;

    white-space: nowrap;

    transition:
        color .2s ease;
}


/* Animated underline */

.main-nav a::after {

    content: "";

    position: absolute;

    left: 0;
    right: 100%;

    bottom: 24px;

    height: 2px;

    border-radius: 20px;

    background:
        var(--gf-blue);

    transition:
        right .22s ease;
}


.main-nav a:hover,
.main-nav a.active {

    color:
        var(--gf-blue);
}


.main-nav a:hover::after,
.main-nav a.active::after {

    right: 0;
}


/* =========================================================
   08. HEADER "COMMANDER" BUTTON
   ========================================================= */

.header-order-button {

    min-height: 44px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 10px;

    padding: 0 18px;

    border-radius: 10px;

    color: white;

    background:
        var(--gf-blue);

    font-size: .82rem;
    font-weight: 600;

    white-space: nowrap;

    box-shadow:
        0 10px 24px
        rgba(
            13,
            99,
            184,
            .18
        );

    transition:
        background .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}


.header-order-button:hover {

    background:
        var(--gf-blue-light);

    transform:
        translateY(-1px);

    box-shadow:
        0 14px 28px
        rgba(
            13,
            99,
            184,
            .24
        );
}


.header-order-button svg {

    width: 16px;
    height: 16px;

    fill: none;

    stroke: currentColor;
    stroke-width: 1.8;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   09. MOBILE MENU BUTTON
   ========================================================= */

.mobile-menu-toggle {

    display: none;

    width: 44px;
    height: 44px;

    margin-left: auto;

    padding: 9px;

    border-radius: 10px;

    background: transparent;

    cursor: pointer;
}


.mobile-menu-toggle span {

    display: block;

    width: 100%;
    height: 2px;

    margin: 5px 0;

    border-radius: 20px;

    background:
        var(--gf-navy);

    transition:
        transform .2s ease,
        opacity .2s ease;
}


/* =========================================================
   10. GLOBAL BUTTONS
   ========================================================= */

.button {

    min-height: 52px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 10px;

    padding: 0 24px;

    border-radius: 10px;

    font-size: .88rem;
    font-weight: 600;

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        background .22s ease,
        border-color .22s ease;
}


.button:hover {
    transform:
        translateY(-2px);
}


/* Primary button */

.button-primary {

    color: white;

    background:
        linear-gradient(
            135deg,
            var(--gf-blue),
            var(--gf-blue-light)
        );

    box-shadow:
        0 14px 30px
        rgba(
            13,
            99,
            184,
            .24
        );
}


.button-primary:hover {

    box-shadow:
        0 18px 36px
        rgba(
            13,
            99,
            184,
            .30
        );
}


/* Button icons */

.button-primary svg,
.button-ghost svg {

    width: 17px;
    height: 17px;

    fill: none;

    stroke: currentColor;
    stroke-width: 1.8;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* Transparent / light button */

.button-ghost {

    color:
        var(--gf-navy);

    background:
        rgba(
            255,
            255,
            255,
            .84
        );

    border:
        1px solid
        rgba(
            10,
            55,
            100,
            .15
        );

    backdrop-filter:
        blur(8px);
}


.button-ghost:hover {

    border-color:
        rgba(
            13,
            99,
            184,
            .30
        );

    background:
        white;
}


/* Outline button */

.button-outline {

    color:
        var(--gf-blue);

    background:
        white;

    border:
        1px solid
        rgba(
            13,
            99,
            184,
            .30
        );
}


/* WhatsApp button */

.button-whatsapp {

    color: white;

    background:
        var(--gf-green);
}


/* =========================================================
   11. HERO / SLIDESHOW
   ========================================================= */

/*
 * Main slideshow container.
 *
 * Desktop height:
 * 670px.
 */

.hero {

    position: relative;

    height: 670px;

    overflow: hidden;

    background:
        #eaf3fb;
}


.hero-slider {

    position: relative;

    width: 100%;
    height: 100%;
}


/* =========================================================
   12. INDIVIDUAL HERO SLIDES
   ========================================================= */

.hero-slide {

    position: absolute;

    inset: 0;

    display: block;

    opacity: 0;

    visibility: hidden;

    pointer-events: none;

    z-index: 0;

    transition:
        opacity 1.15s
        cubic-bezier(.4, 0, .2, 1),
        visibility 1.15s ease;
}


/*
 * Slide currently being displayed.
 */

.hero-slide.is-active {

    opacity: 1;

    visibility: visible;

    pointer-events: auto;

    z-index: 2;
}


/*
 * Text animation when a slide
 * is entering / leaving.
 */

.hero-slide:not(.is-active)
.hero-copy {

    opacity: 0;

    transform:
        translateY(18px);
}


.hero-slide.is-active
.hero-copy {

    opacity: 1;

    transform:
        translateY(0);

    transition:
        opacity .75s ease .18s,
        transform .75s ease .18s;
}


/* =========================================================
   13. HERO BACKGROUND IMAGES
   ========================================================= */

/*
 * Images come from --hero-image
 * inside front-page.php.
 *
 * Example:
 * hero-printing.png
 * hero-textile.png
 * hero-signage.png
 */

.hero-background {

    position: absolute;

    inset: 0;

    background-image:
        var(--hero-image);

    background-size:
        cover;

    background-repeat:
        no-repeat;

    background-position:
        center center;

    transform:
        scale(1.035);

    transition:
        transform 8s ease,
        opacity 1s ease;
}


/*
 * Very subtle slow zoom effect.
 */

.hero-slide.is-active
.hero-background {

    transform:
        scale(1);
}


/* =========================================================
   14. HERO IMAGE OVERLAY
   ========================================================= */

/*
 * White gradient on left gives
 * enough contrast for hero text.
 */

.hero-shade {

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            90deg,

            rgba(
                255,
                255,
                255,
                .98
            ) 0%,

            rgba(
                255,
                255,
                255,
                .94
            ) 28%,

            rgba(
                255,
                255,
                255,
                .72
            ) 46%,

            rgba(
                255,
                255,
                255,
                .26
            ) 64%,

            rgba(
                255,
                255,
                255,
                .04
            ) 100%
        );
}


/* =========================================================
   15. HERO TEXT
   ========================================================= */

.hero-content {

    position: relative;

    z-index: 3;

    height: 100%;

    display: flex;

    align-items: center;
}


.hero-copy {

    width:
        min(
            610px,
            52%
        );
}


.hero-kicker {

    display: inline-block;

    margin-bottom: 18px;

    color:
        var(--gf-blue);

    font-size: .76rem;
    font-weight: 700;

    letter-spacing: .10em;

    text-transform:
        uppercase;
}


.hero h1,
.hero h2 {

    margin: 0;

    color:
        var(--gf-navy);

    font-size:
        clamp(
            3.2rem,
            5.5vw,
            5.5rem
        );

    font-weight: 700;

    line-height: .98;

    letter-spacing:
        -.055em;
}


.hero-copy > p {

    max-width: 590px;

    margin:
        26px 0 0;

    color:
        #455b72;

    font-size: 1.05rem;

    font-weight: 400;

    line-height: 1.72;
}


.hero-actions {

    display: flex;

    flex-wrap: wrap;

    gap: 14px;

    margin-top: 30px;
}


/* =========================================================
   16. HERO CONTROLS
   Arrows + pagination dots
   ========================================================= */

.hero-controls {

    position: absolute;

    left: 50%;
    bottom: 30px;

    z-index: 8;

    transform:
        translateX(-50%);

    display: flex;

    align-items: center;

    gap: 14px;
}


/* Previous / next buttons */

.slider-arrow {

    width: 44px;
    height: 44px;

    display: grid;

    place-items: center;

    padding: 0;

    border-radius: 999px;

    color:
        var(--gf-blue);

    background:
        rgba(
            255,
            255,
            255,
            .88
        );

    box-shadow:
        0 10px 28px
        rgba(
            10,
            50,
            90,
            .12
        );

    backdrop-filter:
        blur(8px);

    cursor: pointer;

    transition:
        transform .2s ease,
        background .2s ease;
}


.slider-arrow:hover {

    background:
        white;

    transform:
        scale(1.06);
}


.slider-arrow svg {

    width: 20px;
    height: 20px;

    fill: none;

    stroke:
        currentColor;

    stroke-width: 2;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* Pagination dots */

.slider-pagination {

    display: flex;

    align-items: center;

    gap: 8px;
}


.slider-dot {

    width: 8px;
    height: 8px;

    padding: 0;

    border-radius: 999px;

    background:
        rgba(
            13,
            99,
            184,
            .26
        );

    cursor: pointer;

    transition:
        width .25s ease,
        background .25s ease;
}


.slider-dot.is-active {

    width: 28px;

    background:
        var(--gf-blue);
}


/* =========================================================
   17. SERVICES
   ========================================================= */

.services-section {
    background: white;
}


.service-grid {

    display: grid;

    grid-template-columns:
        repeat(
            3,
            1fr
        );

    gap: 22px;
}


.service-card {

    overflow: hidden;

    border:
        1px solid
        var(--gf-border);

    border-radius:
        var(--radius-md);

    background:
        white;

    box-shadow:
        var(--shadow-sm);

    transition:
        transform .28s ease,
        box-shadow .28s ease;
}


.service-card:hover {

    transform:
        translateY(-7px);

    box-shadow:
        var(--shadow-md);
}


.service-image {

    min-height: 180px;

    display: grid;

    place-items: center;

    color:
        rgba(
            255,
            255,
            255,
            .92
        );

    font-size: 1.9rem;
    font-weight: 700;
}


/* Temporary service image backgrounds */

.service-print {

    background:
        linear-gradient(
            145deg,
            #1c78cb,
            #124b80
        );
}


.service-promo {

    background:
        linear-gradient(
            145deg,
            #174a82,
            #246cb1
        );
}


.service-textile {

    background:
        linear-gradient(
            145deg,
            #0d5aa0,
            #0b355e
        );
}


.service-sign {

    background:
        linear-gradient(
            145deg,
            #2b82d1,
            #0e477b
        );
}


.service-embroidery {

    background:
        linear-gradient(
            145deg,
            #143f6b,
            #1c66aa
        );
}


.service-supply {

    background:
        linear-gradient(
            145deg,
            #0f5e9f,
            #0a335b
        );
}


.service-card-body {
    padding: 22px;
}


.service-card h3 {

    margin: 0;

    font-size: 1rem;
    font-weight: 600;
}


.service-card p {

    margin:
        9px 0 0;

    color:
        var(--gf-muted);

    font-size: .84rem;

    line-height: 1.55;
}


/* =========================================================
   18. STATS
   ========================================================= */

.stats-section {

    color: white;

    background:
        linear-gradient(
            100deg,
            var(--gf-blue-dark),
            var(--gf-blue)
        );
}


.stats-grid {

    min-height: 150px;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            1fr
        );

    align-items: center;
}


.stat {

    min-height: 78px;

    display: flex;

    align-items: center;

    gap: 14px;

    padding:
        18px 20px;

    border-right:
        1px solid
        rgba(
            255,
            255,
            255,
            .15
        );
}

.stat > div {
    min-width: 0;
}


.stat:last-child {
    border-right: 0;
}


.stat-icon {

    width: 52px;
    height: 52px;

    flex:
        0 0 52px;

    display: grid;

    place-items: center;

    border-radius: 999px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .48
        );

    font-size: 1.2rem;
}

.stat .stat-icon {
    display: grid;
    margin-top: 0;
    color: white;
}

.stat-icon svg {
    width: 27px;
    height: 27px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}


.stat strong,
.stat > div > span {
    display: block;
}


.stat strong {

    color: white;

    font-size: clamp(1.05rem, 1.7vw, 1.35rem);
    font-weight: 600;
    line-height: 1.25;
}


.stat > div > span {

    margin-top: 4px;

    color:
        rgba(
            255,
            255,
            255,
            .76
        );

    font-size: .8rem;
}


/* =========================================================
   19. PROCESS
   ========================================================= */

.process-section {
    background: white;
}


.process-grid {

    position: relative;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            1fr
        );
}


.process-grid::before {

    content: "";

    position: absolute;

    top: 43px;
    left: 12%;
    right: 12%;

    height: 1px;

    background:
        var(--gf-border);
}


.process-item {

    position: relative;

    z-index: 2;

    padding:
        0 28px;

    text-align: center;
}


.process-icon {

    width: 82px;
    height: 82px;

    margin:
        0 auto 22px;

    display: grid;

    place-items: center;

    border-radius: 999px;

    color:
        var(--gf-blue);

    background:
        #edf6ff;

    border:
        8px solid white;

    box-shadow:
        0 0 0 1px
        rgba(
            13,
            99,
            184,
            .10
        );

    font-size: 1.5rem;
}

.process-icon svg {
    width: 30px;
    height: 30px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}


.process-number {

    position: absolute;

    top: -7px;

    right:
        calc(
            50% - 45px
        );

    width: 22px;
    height: 22px;

    display: grid;

    place-items: center;

    border-radius: 999px;

    color: white;

    background:
        var(--gf-blue);

    font-size: .67rem;
    font-weight: 600;
}


.process-item h3 {

    margin: 0;

    font-size: 1rem;
    font-weight: 600;
}


.process-item p {

    max-width: 230px;

    margin:
        9px auto 0;

    color:
        var(--gf-muted);

    font-size: .84rem;
}


/* =========================================================
   20. WHATSAPP SECTION
   ========================================================= */

.whatsapp-section {

    position: relative;

    overflow: hidden;

    color: white;

    background:
        linear-gradient(
            110deg,
            var(--gf-blue-dark),
            var(--gf-blue)
        );
}


.whatsapp-inner {

    min-height: 330px;

    display: grid;

    grid-template-columns:
        1.2fr .8fr;

    align-items: center;

    gap: 70px;

    padding-top: 60px;
    padding-bottom: 60px;
}


.whatsapp-copy h2 {

    margin: 0;

    color: white;

    font-size:
        clamp(
            2.5rem,
            5vw,
            4rem
        );

    font-weight: 700;

    line-height: 1;

    letter-spacing: -.04em;
}


.whatsapp-copy p {

    margin:
        18px 0 26px;

    color:
        rgba(
            255,
            255,
            255,
            .80
        );

    font-size: 1rem;
}


.support-card {

    padding: 28px;

    display: flex;

    align-items: center;

    gap: 22px;

    border-radius: 22px;

    color:
        var(--gf-text);

    background:
        rgba(
            255,
            255,
            255,
            .96
        );

    box-shadow:
        0 28px 65px
        rgba(
            0,
            0,
            0,
            .15
        );
}


.support-avatar {

    width: 82px;
    height: 82px;

    flex:
        0 0 82px;

    display: grid;

    place-items: center;

    border-radius: 999px;

    color: white;

    background:
        linear-gradient(
            145deg,
            var(--gf-blue),
            var(--gf-blue-dark)
        );

    font-size: 1.5rem;
    font-weight: 700;
}


.support-card span,
.support-card strong {
    display: block;
}


.support-card span {

    color:
        var(--gf-blue);

    font-size: .72rem;
    font-weight: 600;

    text-transform: uppercase;

    letter-spacing: .08em;
}


.support-card strong {

    margin-top: 6px;

    color:
        var(--gf-navy);

    font-size: 1.15rem;

    line-height: 1.35;
}


/* =========================================================
   21. TESTIMONIALS
   ========================================================= */

.testimonials-section {

    background:
        var(--gf-soft);
}


.testimonial-grid {

    display: grid;

    grid-template-columns:
        repeat(
            3,
            1fr
        );

    gap: 22px;
}


.testimonial-card {

    padding: 30px;

    border:
        1px solid
        var(--gf-border);

    border-radius: 18px;

    background: white;

    box-shadow:
        var(--shadow-sm);
}


.quote {

    display: block;

    height: 26px;

    color:
        var(--gf-blue);

    font-size: 2.6rem;

    line-height: 1;
}


.testimonial-card > p {

    margin:
        14px 0 25px;

    color:
        #465c72;

    font-size: .9rem;

    line-height: 1.7;
}


.testimonial-author {

    display: flex;

    align-items: center;

    gap: 12px;
}


.avatar {

    width: 46px;
    height: 46px;

    display: grid;

    place-items: center;

    border-radius: 999px;

    color: white;

    background:
        linear-gradient(
            145deg,
            var(--gf-blue),
            var(--gf-blue-dark)
        );

    font-size: .75rem;
    font-weight: 600;
}


.testimonial-author strong,
.testimonial-author span {
    display: block;
}


.testimonial-author strong {

    font-size: .85rem;
    font-weight: 600;
}


.testimonial-author span {

    margin-top: 2px;

    color:
        var(--gf-muted);

    font-size: .73rem;
}


/* =========================================================
   22. FOOTER
   ========================================================= */

.site-footer {

    color:
        rgba(
            255,
            255,
            255,
            .80
        );

    background:
        #062846;
}


.footer-grid {

    display: grid;

    grid-template-columns:
        1.4fr .8fr 1fr 1fr;

    gap: 60px;

    padding-top: 70px;
    padding-bottom: 55px;
}


.footer-brand p {

    max-width: 330px;

    color:
        rgba(
            255,
            255,
            255,
            .62
        );

    font-size: .84rem;
}


.site-footer h3 {

    margin:
        0 0 18px;

    color: white;

    font-size: .88rem;
    font-weight: 600;
}


.footer-links,
.footer-contact {

    margin: 0;

    padding: 0;

    list-style: none;
}


.footer-links li,
.footer-contact li {

    margin:
        9px 0;

    color:
        rgba(
            255,
            255,
            255,
            .64
        );

    font-size: .8rem;
}


.footer-links a:hover {
    color: white;
}


.footer-bottom {

    border-top:
        1px solid
        rgba(
            255,
            255,
            255,
            .10
        );
}


.footer-bottom-inner {

    min-height: 62px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 20px;

    color:
        rgba(
            255,
            255,
            255,
            .48
        );

    font-size: .72rem;
}


/* =========================================================
   23. FLOATING WHATSAPP BUTTON
   ========================================================= */

.floating-whatsapp {

    position: fixed;

    right: 24px;
    bottom: 24px;

    z-index: 999;

    width: 56px;
    height: 56px;

    display: grid;

    place-items: center;

    border-radius: 999px;

    color: white;

    background:
        var(--gf-green);

    box-shadow:
        0 15px 35px
        rgba(
            37,
            211,
            102,
            .30
        );
}


/* =========================================================
   24. SCROLL REVEAL ANIMATIONS
   ========================================================= */

.reveal {

    opacity: 0;

    transform:
        translateY(22px);

    transition:
        opacity .65s ease
        var(--reveal-delay, 0ms),

        transform .65s ease
        var(--reveal-delay, 0ms);
}


.reveal-visible {

    opacity: 1;

    transform:
        translateY(0);
}


/* =========================================================
   25. RESPONSIVE — SMALL DESKTOP
   Maximum width: 1180px
   ========================================================= */

@media (max-width: 1180px) {

    .main-nav {
        gap: 18px;
    }


    .main-nav a {
        font-size: .78rem;
    }


    .header-order-button {
        padding-inline: 15px;
    }


    .hero {
        height: 620px;
    }


    .hero-copy {
        width: 56%;
    }

}


/* =========================================================
   26. RESPONSIVE — TABLET
   Maximum width: 980px
   ========================================================= */

@media (max-width: 980px) {

    /*
     * Hide thin top bar on tablet/mobile.
     */
    .topbar {
        display: none;
    }


    /*
     * Tablet header height.
     */
    .header-inner {
        min-height: 78px;
    }


    /*
     * TABLET LOGO SIZE
     */
    .site-logo-image {

        width: auto;

        height: var(--gf-logo-tablet, 50px);

        max-width: 240px;
    }


    /*
     * Show hamburger menu.
     */
    .mobile-menu-toggle {
        display: block;
    }


    /*
     * Mobile/tablet dropdown menu.
     */
    .main-nav {

        position: absolute;

        top: 78px;

        left: 20px;
        right: 20px;

        display: none;

        flex-direction: column;

        align-items: stretch;

        gap: 0;

        margin: 0;

        padding: 14px;

        border:
            1px solid
            var(--gf-border);

        border-radius: 16px;

        background:
            rgba(
                255,
                255,
                255,
                .98
            );

        box-shadow:
            var(--shadow-md);
    }


    /*
     * JS adds .is-open.
     */
    .main-nav.is-open {
        display: flex;
    }


    .main-nav a {

        padding:
            12px 14px;

        border-radius: 9px;

        font-size: .88rem;
    }


    .main-nav a::after {
        display: none;
    }


    .main-nav a:hover,
    .main-nav a.active {

        background:
            var(--gf-soft);
    }


    .header-order-button {
        margin-left: 0;
    }


    /*
     * Tablet hero.
     */
    .hero {
        height: 610px;
    }


    .hero-shade {

        background:
            linear-gradient(
                90deg,

                rgba(
                    255,
                    255,
                    255,
                    .98
                ) 0%,

                rgba(
                    255,
                    255,
                    255,
                    .94
                ) 46%,

                rgba(
                    255,
                    255,
                    255,
                    .68
                ) 70%,

                rgba(
                    255,
                    255,
                    255,
                    .30
                ) 100%
            );
    }


    .hero-copy {
        width: 68%;
    }


    /*
     * Services: 2 columns.
     */
    .service-grid {

        grid-template-columns:
            repeat(
                2,
                1fr
            );
    }


    /*
     * Stats: 2 columns.
     */
    .stats-grid {

        grid-template-columns:
            repeat(
                2,
                1fr
            );
    }


    .stat {

        border-right: 0;

        border-bottom:
            1px solid
            rgba(
                255,
                255,
                255,
                .12
            );
    }


    /*
     * Process: 2 columns.
     */
    .process-grid {

        grid-template-columns:
            repeat(
                2,
                1fr
            );

        gap:
            46px 0;
    }


    .process-grid::before {
        display: none;
    }


    /*
     * WhatsApp section.
     */
    .whatsapp-inner {

        grid-template-columns:
            1fr;

        gap: 35px;
    }


    /*
     * Testimonials.
     */
    .testimonial-grid {
        grid-template-columns: 1fr;
    }


    /*
     * Footer.
     */
    .footer-grid {

        grid-template-columns:
            repeat(
                2,
                1fr
            );
    }

}


/* =========================================================
   27. RESPONSIVE — MOBILE
   Maximum width: 680px
   ========================================================= */

@media (max-width: 680px) {

    /*
     * Mobile page margins.
     */
    .container {

        width:
            min(
                calc(100% - 28px),
                var(--container)
            );
    }


    .section {
        padding: 68px 0;
    }


    /*
     * MOBILE HEADER
     */
    .header-inner {

        min-height: 72px;

        gap: 14px;
    }


    /*
     * MOBILE LOGO SIZE
     *
     * Still large enough to clearly show
     * GF Enterprise branding.
     */
    .site-logo-image {

        width: auto;

        height: var(--gf-logo-mobile, 42px);

        max-width: 205px;
    }


    /*
     * Hide desktop order CTA.
     *
     * We keep mobile navigation uncluttered.
     */
    .header-order-button {
        display: none;
    }


    /*
     * Dropdown menu position.
     */
    .main-nav {

        top: 72px;

        left: 14px;
        right: 14px;
    }


    /*
     * MOBILE HERO
     */
    .hero {
        height: 640px;
    }


    /*
     * Reposition hero photographs
     * so important products remain visible.
     */
    .hero-background {

        background-position:
            62% center;
    }


    /*
     * Stronger white overlay on mobile
     * for readable text.
     */
    .hero-shade {

        background:
            linear-gradient(
                90deg,

                rgba(
                    255,
                    255,
                    255,
                    .98
                ) 0%,

                rgba(
                    255,
                    255,
                    255,
                    .95
                ) 62%,

                rgba(
                    255,
                    255,
                    255,
                    .62
                ) 100%
            );
    }


    /*
     * Move hero text upward slightly.
     */
    .hero-content {

        align-items:
            flex-start;

        padding-top:
            90px;
    }


    .hero-copy {

        width: 100%;

        max-width: 94%;
    }


    .hero-kicker {

        margin-bottom: 14px;

        font-size: .68rem;

        letter-spacing: .08em;
    }


    .hero h1,
    .hero h2 {

        font-size:
            clamp(
                2.55rem,
                11vw,
                4rem
            );

        line-height: 1.02;
    }


    .hero-copy > p {

        max-width: 94%;

        margin-top: 20px;

        font-size: .92rem;

        line-height: 1.65;
    }


    /*
     * Hero buttons stack vertically.
     */
    .hero-actions {

        display: grid;

        grid-template-columns:
            1fr;

        width:
            min(
                100%,
                330px
            );

        margin-top: 24px;
    }


    .hero-actions .button {
        width: 100%;
    }


    /*
     * Slider controls closer to bottom.
     */
    .hero-controls {
        bottom: 18px;
    }


    .slider-arrow {

        width: 40px;
        height: 40px;
    }


    /*
     * Section titles.
     */
    .section-heading-row {

        flex-direction:
            column;

        align-items:
            flex-start;
    }


    /*
     * Services: 1 column.
     */
    .service-grid {
        grid-template-columns: 1fr;
    }


    /*
     * Stats: 1 column.
     */
    .stats-grid {
        grid-template-columns: 1fr;
    }


    .stat {

        padding:
            22px 10px;
    }


    /*
     * Process: 1 column.
     */
    .process-grid {
        grid-template-columns: 1fr;
    }


    .process-item {
        padding-inline: 10px;
    }


    /*
     * Support card.
     */
    .support-card {

        flex-direction:
            column;

        align-items:
            flex-start;
    }


    /*
     * Footer: 1 column.
     */
    .footer-grid {

        grid-template-columns:
            1fr;

        gap: 34px;
    }


    .footer-bottom-inner {

        padding:
            18px 0;

        flex-direction:
            column;

        align-items:
            flex-start;
    }

}


/* =========================================================
   28. ACCESSIBILITY — REDUCED MOTION
   ========================================================= */

/*
 * Respect the operating system accessibility preference.
 *
 * This affects CSS animations only.
 * JavaScript slideshow navigation remains functional.
 */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {

        scroll-behavior:
            auto !important;

        animation-duration:
            .01ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            .01ms !important;
    }

}

/* Reference-led homepage refinements. */
.topbar { background: #124b89; }
.topbar-inner { min-height: 38px; }
.topbar-right { gap: 16px; }
.topbar-right a { color: #fff; font-size: .72rem; }
.topbar-right a:hover { text-decoration: underline; }
.topbar-tagline { opacity: .8; }
.header-inner { min-height: 88px; }
.brand-fallback { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; height: var(--gf-logo-desktop, 60px); color: #124b89; line-height: .85; }
.brand-fallback strong { font-size: calc(var(--gf-logo-desktop, 60px) * .64); font-weight: 800; font-style: italic; letter-spacing: -.13em; padding-right: .15em; }
.brand-fallback small { margin-top: 7px; font-size: .8rem; font-weight: 800; letter-spacing: .12em; }
.main-nav { gap: 25px; }
.mobile-nav-order { display: none; }
.hero { height: clamp(520px, 47vw, 690px); }
.hero h1, .hero h2 { font-size: clamp(2.8rem, 4.5vw, 4.6rem); line-height: 1.08; letter-spacing: -.045em; }
.hero-kicker { letter-spacing: .045em; }
.hero-shade { background: linear-gradient(90deg, rgba(255,255,255,.97) 0%, rgba(255,255,255,.88) 30%, rgba(255,255,255,.38) 56%, rgba(255,255,255,0) 79%); }
.services-section { padding-top: 62px; padding-bottom: 58px; }
.service-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; }
.service-card { border: 0; border-radius: 9px; box-shadow: none; background: transparent; }
.service-card:hover { transform: translateY(-4px); box-shadow: none; }
.service-image { height: 150px; min-height: 0; overflow: hidden; border-radius: 7px; background: #e8eef6; }
.service-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.service-card:hover img { transform: scale(1.055); }
.service-gallery { position: relative; isolation: isolate; }
.service-gallery-track { width: 100%; height: 100%; }
.service-gallery-slide { width: 100%; height: 100%; object-fit: cover; }
.service-gallery-slide.is-active { animation: serviceGalleryZoom 4.2s ease-out both; }
.service-gallery-slide[hidden] { display: none; }
@keyframes serviceGalleryZoom { from { transform: scale(1); } to { transform: scale(1.055); } }
.service-gallery-arrow {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255,255,255,.7);
    border-radius: 50%;
    color: #fff;
    background: rgba(5,43,81,.72);
    box-shadow: 0 5px 15px rgba(3,28,54,.2);
    font-size: 1.45rem;
    line-height: 1;
    cursor: pointer;
    opacity: 0;
    transform: translateY(-50%);
    transition: opacity .2s ease, background .2s ease, transform .2s ease;
}
.service-gallery-prev { left: 8px; }
.service-gallery-next { right: 8px; }
.service-card:hover .service-gallery-arrow,
.service-gallery-arrow:focus-visible { opacity: 1; }
.service-gallery-arrow:hover { background: var(--gf-blue); transform: translateY(-50%) scale(1.06); }
.service-gallery-dots { position: absolute; left: 50%; bottom: 8px; z-index: 2; display: flex; gap: 5px; transform: translateX(-50%); }
.service-gallery-dots span { width: 6px; height: 6px; border-radius: 999px; background: rgba(255,255,255,.65); box-shadow: 0 1px 4px rgba(0,20,40,.25); transition: width .2s ease, background .2s ease; }
.service-gallery-dots span.is-active { width: 16px; background: #fff; }
.service-gallery-track { cursor: zoom-in; }
.service-gallery-expand { position: absolute; top: 8px; right: 8px; z-index: 2; width: 30px; height: 30px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; color: #fff; background: rgba(5,43,81,.72); font-size: 1.15rem; cursor: zoom-in; opacity: 0; transition: opacity .2s ease, background .2s ease; }
.service-card:hover .service-gallery-expand, .service-gallery-expand:focus-visible { opacity: 1; }
.service-gallery-expand:hover { background: var(--gf-blue); }
@media (hover: none), (max-width: 680px) {
    .service-gallery-arrow { width: 34px; height: 34px; opacity: 1; }
    .service-gallery-expand { opacity: 1; }
}
.service-lightbox[hidden] { display: none; }
body.service-lightbox-open { overflow: hidden; }
.service-lightbox { position: fixed; inset: 0; z-index: 4000; display: grid; place-items: center; padding: 22px; opacity: 0; transition: opacity .22s ease; }
.service-lightbox.is-open { opacity: 1; }
.service-lightbox-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: rgba(2,17,34,.9); backdrop-filter: blur(8px); cursor: zoom-out; }
.service-lightbox-dialog { position: relative; z-index: 1; width: min(1120px, 96vw); overflow: hidden; border: 1px solid rgba(255,255,255,.22); border-radius: 18px; background: #061c33; box-shadow: 0 30px 90px rgba(0,0,0,.45); transform: translateY(15px) scale(.98); transition: transform .24s ease; }
.service-lightbox.is-open .service-lightbox-dialog { transform: translateY(0) scale(1); }
.service-lightbox-toolbar { min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 8px 12px 8px 20px; color: #fff; }
.service-lightbox-toolbar > div { display: flex; gap: 7px; }
.service-lightbox-toolbar button { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; color: #fff; background: rgba(255,255,255,.08); font-size: 1.15rem; cursor: pointer; }
.service-lightbox-stage { position: relative; height: min(72vh, 720px); display: grid; place-items: center; overflow: auto; background: #03111f; }
.service-lightbox-stage img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; cursor: zoom-in; transform-origin: center; transition: transform .22s ease; }
.service-lightbox-arrow { position: absolute; top: 50%; z-index: 2; width: 46px; height: 46px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; color: #fff; background: rgba(4,42,78,.78); font-size: 2rem; cursor: pointer; transform: translateY(-50%); }
.service-lightbox-arrow.is-prev { left: 16px; }
.service-lightbox-arrow.is-next { right: 16px; }
.service-lightbox-counter { display: block; padding: 10px; color: rgba(255,255,255,.74); text-align: center; font-size: .78rem; }
@media (max-width: 680px) {
    .service-lightbox { padding: 8px; }
    .service-lightbox-dialog { width: 100%; border-radius: 13px; }
    .service-lightbox-stage { height: 68vh; }
    .service-lightbox-arrow { width: 40px; height: 40px; }
    .service-lightbox-arrow.is-prev { left: 8px; }
    .service-lightbox-arrow.is-next { right: 8px; }
    .service-lightbox-toolbar { padding-left: 13px; }
    .service-lightbox-toolbar strong { max-width: 48%; font-size: .78rem; }
}
@media (prefers-reduced-motion: reduce) {
    .service-gallery-slide.is-active { animation: none; }
    .service-lightbox, .service-lightbox-dialog, .service-lightbox-stage img { transition: none; }
}
.service-card-body { padding: 11px 1px 0; }
.service-card h3 { font-size: .85rem; line-height: 1.35; }
.service-card p { margin-top: 4px; font-size: .72rem; line-height: 1.45; }
.stats-section { background: #104b86; }
.whatsapp-section { background: #0c3e72 url('assets/images/contact-support.jpg') center center / cover no-repeat; }
.whatsapp-inner { min-height: 320px; grid-template-columns: minmax(0, 1fr) 260px; align-items: end; gap: 24px; padding-top: 42px; padding-bottom: 30px; }
.whatsapp-copy { position: relative; z-index: 1; align-self: center; max-width: 610px; }
.whatsapp-copy h2 { font-size: clamp(2rem, 3vw, 3.2rem); }
.button-whatsapp img { display: block; width: 20px; height: 20px; flex: 0 0 20px; }
.floating-whatsapp img { display: block; width: 29px; height: 29px; }
.support-card { position: relative; z-index: 1; width: 100%; max-width: 260px; justify-self: end; align-self: end; padding: 20px 22px; border: 1px solid rgba(255,255,255,.75); border-radius: 18px; box-shadow: 0 16px 38px rgba(2,31,63,.18); }
.support-card strong { font-size: 1.02rem; line-height: 1.38; }
.support-avatar { display: none; }
.testimonials-section { background: #fff; }
.site-footer { background: #0b3765; }
.brand-footer img { width: 125px; height: auto; filter: brightness(0) invert(1); }
.content-page { min-height: 55vh; padding: 76px 0 90px; background: #f5f8fc; }
.content-card { max-width: 960px; margin: 0 auto 24px; padding: clamp(28px, 5vw, 64px); border-radius: 16px; background: #fff; box-shadow: 0 12px 45px rgba(12,55,99,.07); }
.content-card h1 { margin: 0 0 24px; color: var(--gf-navy); font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.15; }
.entry-content a, .content-card p a { color: var(--gf-blue); text-decoration: underline; }
.entry-content img { height: auto; border-radius: 8px; }
.entry-content > * + * { margin-top: 1.2em; }

@media (max-width: 1180px) {
    .topbar-tagline { display: none; }
    .service-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
    .service-image { height: 185px; }
}
@media (max-width: 980px) {
    .mobile-nav-order { display: block; }
    .brand-fallback { height: var(--gf-logo-tablet, 50px); }
    .brand-fallback strong { font-size: calc(var(--gf-logo-tablet, 50px) * .64); }
    .hero { height: 610px; }
    .hero-copy { width: min(570px, 70%); }
    .whatsapp-section { background-position: 60% center; }
    .whatsapp-inner { grid-template-columns: 1fr; min-height: 350px; gap: 18px; }
}
@media (max-width: 680px) {
    .brand-fallback { height: var(--gf-logo-mobile, 42px); }
    .brand-fallback strong { font-size: calc(var(--gf-logo-mobile, 42px) * .64); }
    .brand-fallback small { font-size: .68rem; }
    .hero { height: 590px; }
    .hero-copy { width: 100%; }
    .hero-shade { background: linear-gradient(90deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.87) 55%, rgba(255,255,255,.35) 100%); }
    .services-section { padding-top: 50px; padding-bottom: 48px; }
    .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 13px; }
    .service-image { height: 138px; }
    .service-card h3 { font-size: .82rem; }
    .whatsapp-section { background-position: 66% center; }
    .whatsapp-section::before { content: ''; position: absolute; inset: 0; background: rgba(4,35,69,.54); }
    .whatsapp-inner { grid-template-columns: 1fr; gap: 22px; }
    .support-card { justify-self: start; }
}

/* Keep the mobile reading flow and calls to action centered. */
@media (max-width: 680px) {
    .container { width: min(calc(100% - 32px), var(--container)); }
    .header-inner { justify-content: space-between; }
    .site-brand { min-width: 0; }
    .mobile-menu-toggle { flex: 0 0 44px; }
    .main-nav { left: 16px; right: 16px; text-align: center; }
    .main-nav a { text-align: center; }

    .hero { height: 650px; }
    .hero-content { align-items: center; justify-content: center; padding-top: 0; padding-bottom: 42px; }
    .hero-copy { width: 100%; max-width: 520px; margin-inline: auto; text-align: center; }
    .hero-kicker { max-width: 100%; line-height: 1.55; }
    .hero h1, .hero h2 { font-size: clamp(2.2rem, 10vw, 3.6rem); overflow-wrap: anywhere; }
    .hero-copy > p { max-width: 500px; margin: 20px auto 0; }
    .hero-actions { width: min(100%, 330px); margin: 25px auto 0; justify-items: center; }
    .hero-actions .button { min-height: 50px; text-align: center; white-space: normal; }

    .section-heading, .section-heading-row { align-items: center; text-align: center; }
    .section-heading p { margin-inline: auto; }
    .section-heading-row .text-link { align-self: center; text-align: center; }
    .service-card { text-align: center; }
    .service-card-body { padding-inline: 8px; }
    .service-card p { max-width: 260px; margin-inline: auto; }
    .stats-grid { padding-block: 12px; }
    .stat { justify-content: center; text-align: center; flex-direction: column; gap: 8px; }
    .stat:last-child { border-bottom: 0; }
    .process-grid { gap: 38px; }
    .process-item { text-align: center; }

    .whatsapp-inner { justify-items: center; text-align: center; padding-block: 48px; }
    .whatsapp-copy { width: 100%; text-align: center; }
    .whatsapp-copy p { max-width: 360px; margin-inline: auto; }
    .whatsapp-copy .button { width: min(100%, 330px); margin-inline: auto; text-align: center; white-space: normal; }
    .support-card { justify-self: center; align-items: center; max-width: 300px; text-align: center; }

    .testimonial-card { text-align: center; }
    .testimonial-author { justify-content: center; flex-direction: column; text-align: center; }
    .footer-grid { text-align: center; justify-items: center; }
    .footer-grid > div { width: 100%; }
    .footer-brand .brand { display: inline-flex; align-items: center; justify-content: center; gap: 12px; }
    .footer-brand .brand-copy { display: flex; flex-direction: column; align-items: flex-start; text-align: left; }
    .footer-brand p { margin-inline: auto; }
    .footer-bottom-inner { align-items: center; text-align: center; }
    .content-page { padding: 42px 0 60px; }
    .content-card { text-align: center; }
}

@media (max-width: 480px) {
    .hero { height: 680px; }
    .hero h1, .hero h2 { font-size: clamp(2.05rem, 10vw, 2.8rem); }
    .hero-copy > p { font-size: .9rem; line-height: 1.58; }
    .service-grid { grid-template-columns: 1fr; gap: 24px; max-width: 390px; margin-inline: auto; }
    .service-image { height: 205px; }
    .service-card h3 { font-size: 1rem; }
    .service-card p { font-size: .8rem; }
    .floating-whatsapp { width: 50px; height: 50px; right: 16px; bottom: 16px; }
}

/* Order estimate dialog. */
body.gf-order-open { overflow: hidden; }
.gf-order-modal[hidden] { display: none; }
.gf-order-modal {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 22px;
    overflow-y: auto;
    scrollbar-width: none;
    opacity: 0;
    transition: opacity .24s ease;
}
.gf-order-modal::-webkit-scrollbar { display: none; }
.gf-order-modal.is-visible { opacity: 1; }
.gf-order-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(3, 22, 44, .74);
    backdrop-filter: blur(7px);
    opacity: 0;
    transition: opacity .24s ease;
}
.gf-order-modal.is-visible .gf-order-backdrop { opacity: 1; }
.gf-order-dialog {
    position: relative;
    width: min(100%, 860px);
    padding: clamp(25px, 3vw, 38px);
    overflow: visible;
    border: 1px solid rgba(255,255,255,.8);
    border-radius: 24px;
    background: linear-gradient(145deg, #fff 0%, #f7fbff 100%);
    box-shadow: 0 32px 100px rgba(0, 16, 35, .38);
    opacity: 0;
    transform: translateY(20px) scale(.965);
    transition: opacity .24s ease, transform .3s cubic-bezier(.2,.8,.2,1);
}
.gf-order-modal.is-visible .gf-order-dialog { opacity: 1; transform: translateY(0) scale(1); }
.gf-order-close {
    position: absolute;
    top: 15px;
    right: 16px;
    z-index: 2;
    width: 38px;
    height: 38px;
    border: 1px solid #dbe5ef;
    border-radius: 50%;
    background: #fff;
    color: var(--gf-navy);
    box-shadow: 0 5px 18px rgba(8,43,82,.08);
    font-size: 1.55rem;
    line-height: 1;
    cursor: pointer;
    transition: transform .2s ease, background .2s ease;
}
.gf-order-close:hover { background: #edf6ff; transform: rotate(5deg); }
.gf-order-heading {
    display: grid;
    grid-template-columns: 112px minmax(0,1fr);
    align-items: center;
    gap: 23px;
    margin: -4px 38px 23px 0;
    padding-bottom: 20px;
    border-bottom: 1px solid #dce6f0;
}
.gf-order-logo { width: 92px; height: auto; }
.gf-order-eyebrow { display: block; margin-bottom: 4px; color: var(--gf-blue); font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.gf-order-heading h2 { margin: 0 0 5px; color: var(--gf-navy); font-size: clamp(1.65rem, 3vw, 2.25rem); line-height: 1.1; letter-spacing: -.035em; }
.gf-order-heading p { margin: 0; color: var(--gf-muted); font-size: .82rem; }
.gf-order-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px 16px; }
.gf-order-fields { align-items: end; }
.gf-order-fields label { min-width: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; color: var(--gf-navy); font-size: .78rem; font-weight: 650; }
.gf-order-fields label > i, .gf-field-label > i { color: #bd2938; font-style: normal; }
.gf-field-label { display: flex; align-items: center; gap: 7px; color: var(--gf-navy); }
.gf-input-label { min-height: 23px; display: flex; align-items: center; gap: 4px; line-height: 1.25; }
.gf-input-label i { color: #bd2938; font-style: normal; }
.gf-field-label b, .gf-order-divider span {
    width: 23px;
    height: 23px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 23px;
    border-radius: 50%;
    color: #fff;
    background: var(--gf-blue);
    font-size: .7rem;
}
.gf-order-wide { grid-column: 1 / -1; }
.gf-order-fields input, .gf-order-fields select, .gf-order-fields textarea {
    width: 100%;
    min-height: 43px;
    padding: 9px 12px;
    border: 1px solid #cbd9e6;
    border-radius: 9px;
    background: rgba(255,255,255,.96);
    color: var(--gf-text);
    box-shadow: 0 2px 7px rgba(8,43,82,.025);
    font: inherit;
    font-weight: 400;
    transition: border-color .18s ease, box-shadow .18s ease;
}
.gf-order-fields select { cursor: pointer; }
.gf-order-fields textarea { min-height: 78px; resize: vertical; }
.gf-order-fields input:focus, .gf-order-fields select:focus, .gf-order-fields textarea:focus {
    outline: none;
    border-color: var(--gf-blue);
    box-shadow: 0 0 0 3px rgba(13,99,184,.12);
}
.gf-service-hint {
    margin: -5px 0 0;
    padding: 9px 12px;
    border-left: 3px solid #69a9e5;
    border-radius: 0 8px 8px 0;
    color: #536b83;
    background: #eef7ff;
    font-size: .73rem;
    line-height: 1.4;
}
.gf-order-estimate {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    min-height: 59px;
    padding: 8px 15px;
    border: 1px solid #cfe5fa;
    border-radius: 10px;
    background: linear-gradient(135deg, #edf7ff, #e4f2ff);
}
.gf-order-estimate span { color: #57728e; font-size: .68rem; }
.gf-order-estimate strong { color: var(--gf-blue-dark); font-size: .95rem; }
.gf-order-divider { display: flex; align-items: center; gap: 9px; margin: 3px 0 -1px; color: var(--gf-navy); font-size: .78rem; font-weight: 700; }
.gf-order-divider::after { content: ''; height: 1px; flex: 1; background: #dce6f0; }
.gf-order-note { margin: 12px 0 0; color: var(--gf-muted); font-size: .69rem; }
.gf-order-feedback { min-height: 1.35em; margin: 8px 0; color: #146c3d; font-size: .8rem; font-weight: 600; text-align: center; }
.gf-order-feedback.is-error { color: #ad2635; }
.gf-order-submit { width: 100%; min-height: 48px; cursor: pointer; }
.gf-order-submit:disabled { opacity: .6; cursor: wait; }
.gf-order-honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }

@media (max-width: 680px) {
    .gf-order-modal { place-items: start center; padding: 10px; }
    .gf-order-dialog { width: 100%; margin: auto 0; padding: 24px 18px; border-radius: 18px; }
    .gf-order-heading { grid-template-columns: 82px minmax(0,1fr); gap: 14px; margin-right: 31px; padding-bottom: 15px; text-align: left; }
    .gf-order-logo { width: 72px; }
    .gf-order-heading h2 { font-size: 1.45rem; }
    .gf-order-heading p { font-size: .75rem; }
    .gf-order-fields { grid-template-columns: 1fr; gap: 12px; }
    .gf-order-wide { grid-column: auto; }
    .gf-order-estimate { min-height: 58px; text-align: center; }
}
@media (max-width: 420px) {
    .gf-order-heading { grid-template-columns: 1fr; justify-items: center; margin-right: 0; padding-inline: 22px; text-align: center; }
    .gf-order-logo { width: 78px; }
    .gf-order-heading p { display: none; }
    .gf-order-dialog { padding: 21px 15px; }
}

/* Professional footer finish. */
.site-footer {
    position: relative;
    background: linear-gradient(135deg, #082d55 0%, #0a3d70 56%, #082f59 100%);
}
.site-footer::before { content: ''; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, #27a6ef, #0d63b8, #27a6ef); }
.footer-grid { grid-template-columns: 1.35fr .75fr 1fr 1.15fr; gap: clamp(32px, 5vw, 66px); padding-top: 64px; padding-bottom: 52px; }
.footer-brand p { margin: 20px 0 0; line-height: 1.75; }
.site-footer h3 { position: relative; margin-bottom: 24px; font-size: .92rem; letter-spacing: .015em; }
.site-footer h3::after { content: ''; position: absolute; left: 0; bottom: -10px; width: 30px; height: 2px; border-radius: 2px; background: #35a9ef; }
.footer-links li, .footer-contact li { margin: 10px 0; line-height: 1.45; }
.footer-links a, .footer-contact a { transition: color .18s ease, transform .18s ease; }
.footer-links a { display: inline-block; }
.footer-links a:hover, .footer-contact a:hover { color: #fff; transform: translateX(3px); }
.footer-contact li { display: flex; align-items: flex-start; gap: 10px; }
.footer-contact svg { width: 17px; height: 17px; flex: 0 0 17px; margin-top: 2px; fill: none; stroke: #6fc4f5; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.footer-socials { min-height: 34px; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.footer-socials:empty { display: none; }
.footer-socials > a { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; color: #fff; background: rgba(255,255,255,.07); font-size: .65rem; font-weight: 700; text-transform: uppercase; transition: background .18s ease, transform .18s ease; }
.footer-socials > a:hover { background: var(--gf-blue); transform: translateY(-2px); }
.footer-bottom { background: rgba(0,15,31,.15); }
.footer-bottom-inner { min-height: 76px; }
.footer-credit { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; text-align: right; }
.footer-credit strong { color: rgba(255,255,255,.82); font-weight: 600; }
.footer-credit a { color: inherit; font-size: inherit; transition: color .18s ease; }
.footer-credit a:hover { color: #fff; text-decoration: underline; }
@media (max-width: 980px) {
    .footer-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 680px) {
    .footer-grid { grid-template-columns: 1fr; padding-top: 52px; }
    .site-footer h3::after { left: 50%; transform: translateX(-50%); }
    .footer-contact li { justify-content: center; }
    .footer-socials { justify-content: center; }
    .footer-credit { align-items: center; text-align: center; }
}
/* Homepage visual refinement — September 2026 */
:root { --gf-page:#f7faff; --gf-sky:#eaf5ff; --gf-ink:#102c4b; --gf-blue-deep:#08457f; --gf-line:rgba(15,82,145,.12); }
body { background:var(--gf-page); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
.site-header { border-bottom-color:rgba(10,64,117,.08); }
.header-inner { min-height:86px; }
.main-nav a { font-weight:600; letter-spacing:-.01em; }
.header-order-button { border-radius:12px; padding-inline:21px; background:linear-gradient(135deg,#0f72d3,#0a58a9); }
.hero { background:#eaf4fc; }
.hero-copy { position:relative; padding:10px 0; }
.hero-kicker,.section-kicker { font-weight:800; letter-spacing:.12em; }
.hero h1,.hero h2 { max-width:650px; color:#0b315a; }
.hero-copy>p { max-width:540px; color:#3f5870; }
.hero-actions .button { border-radius:12px; }
.services-section { position:relative; overflow:hidden; background:radial-gradient(circle at 4% 6%,rgba(29,130,223,.10),transparent 25rem),linear-gradient(180deg,#fff 0%,#f7fbff 100%); }
.services-section::after { content:""; position:absolute; width:360px; height:360px; right:-170px; bottom:-190px; border:1px solid rgba(17,111,196,.12); border-radius:50%; pointer-events:none; }
.services-section .container { position:relative; z-index:1; }
.section-heading { max-width:720px; }
.section-heading-row { padding-bottom:22px; border-bottom:1px solid var(--gf-line); }
.text-link { display:inline-flex; align-items:center; min-height:42px; padding:0 14px; border:1px solid rgba(13,99,184,.18); border-radius:10px; background:rgba(255,255,255,.72); transition:color .2s ease,background .2s ease,transform .2s ease,border-color .2s ease; }
.text-link:hover { transform:translateY(-2px); border-color:rgba(13,99,184,.38); background:#fff; }
.service-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; }
.service-card { display:flex; flex-direction:column; min-height:100%; overflow:hidden; border:1px solid rgba(12,73,132,.11); border-radius:18px; background:#fff; box-shadow:0 14px 35px rgba(12,70,122,.075); }
.service-card:hover { transform:translateY(-8px); box-shadow:0 22px 48px rgba(12,70,122,.15); }
.service-image { height:222px; border-radius:0; }
.service-card-body { flex:1; padding:20px 21px 22px; }
.service-card h3 { color:var(--gf-ink); font-size:1.03rem; font-weight:700; }
.service-card p { margin-top:7px; font-size:.82rem; line-height:1.65; }
.stats-section { position:relative; overflow:hidden; background:linear-gradient(112deg,#063762 0%,#0d63b8 55%,#0b559c 100%); }
.stats-section::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 11% 50%,rgba(255,255,255,.12),transparent 22rem),radial-gradient(circle at 85% 30%,rgba(100,193,255,.20),transparent 22rem); pointer-events:none; }
.stats-grid { position:relative; min-height:164px; }
.stat { padding:22px 26px; }
.stat-icon { background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.32); }
.process-section { background:#fff; }
.process-item { padding-inline:20px; }
.process-icon { width:88px; height:88px; background:linear-gradient(145deg,#f4faff,#e1f1ff); box-shadow:0 10px 24px rgba(13,99,184,.10),0 0 0 1px rgba(13,99,184,.08); }
.process-item h3 { font-size:1.05rem; }
.whatsapp-section { background-color:#093e71; }
.whatsapp-section::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(4,42,79,.82),rgba(4,42,79,.56) 58%,rgba(4,42,79,.22)); pointer-events:none; }
.whatsapp-inner { position:relative; z-index:1; min-height:360px; padding-top:58px; padding-bottom:48px; }
.button-whatsapp { border-radius:12px; box-shadow:0 14px 28px rgba(5,33,62,.20); }
.support-card { border-radius:18px; background:rgba(255,255,255,.96); }
.testimonials-section { position:relative; background:#f3f8fd; }
.testimonial-grid { gap:26px; }
.testimonial-card { position:relative; border:1px solid rgba(12,73,132,.10); border-radius:18px; box-shadow:0 14px 35px rgba(12,70,122,.06); }
.testimonial-card::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; border-radius:18px 0 0 18px; background:linear-gradient(#2a9be7,#0d63b8); }
.avatar { box-shadow:0 8px 18px rgba(13,99,184,.18); }
.floating-whatsapp { width:60px; height:60px; right:28px; bottom:28px; border:3px solid rgba(255,255,255,.92); box-shadow:0 16px 36px rgba(15,116,61,.34); transition:transform .2s ease,box-shadow .2s ease; }
.floating-whatsapp:hover { transform:translateY(-4px) scale(1.04); box-shadow:0 20px 40px rgba(15,116,61,.42); }
.site-footer { background:linear-gradient(135deg,#062949 0%,#0b477e 60%,#06315a 100%); }
.site-footer::before { height:4px; }
.footer-grid { padding-top:72px; }
.footer-bottom { background:rgba(0,18,38,.20); }
a:focus-visible,button:focus-visible { outline:3px solid rgba(35,149,240,.55); outline-offset:3px; }
@media (max-width:980px) { .service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .service-image { height:215px; } .whatsapp-section::after { background:rgba(4,42,79,.62); } }
@media (max-width:680px) { .section-heading-row { padding-bottom:0; border-bottom:0; } .text-link { margin-top:4px; } .service-grid { grid-template-columns:1fr; max-width:460px; margin-inline:auto; } .service-image { height:235px; } .service-card-body { padding:19px 20px 22px; } .stat { min-height:142px; padding:25px 16px; } .whatsapp-inner { min-height:390px; padding-top:62px; padding-bottom:52px; } .floating-whatsapp { width:54px; height:54px; right:17px; bottom:17px; } }
@media (max-width:420px) { .service-image { height:210px; } }

/* Conversion and trust sections */
.section-heading-row { align-items:center; }
.section-heading-row .text-link { flex:0 0 auto; align-self:center; }

.why-section { background:linear-gradient(135deg,#eff7ff 0%,#fff 62%); }
.why-grid { display:grid; grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr); align-items:center; gap:clamp(42px,8vw,108px); }
.why-copy h2 { max-width:580px; margin:0 0 18px; color:var(--gf-navy); font-size:clamp(2.1rem,4vw,3.65rem); line-height:1.08; letter-spacing:-.04em; }
.why-copy>p { max-width:540px; margin:0 0 28px; color:var(--gf-muted); font-size:1rem; line-height:1.75; }
.why-points { display:grid; gap:14px; }
.why-point { display:flex; align-items:flex-start; gap:17px; padding:20px; border:1px solid rgba(13,99,184,.12); border-radius:15px; background:rgba(255,255,255,.84); box-shadow:0 12px 28px rgba(12,70,122,.055); transition:transform .2s ease,box-shadow .2s ease; }
.why-point:hover { transform:translateX(5px); box-shadow:0 16px 32px rgba(12,70,122,.10); }
.why-point-icon { width:43px; height:43px; flex:0 0 43px; display:grid; place-items:center; border-radius:12px; color:var(--gf-blue); background:#e4f2ff; font-size:.73rem; font-weight:800; }
.why-point h3 { margin:0; color:var(--gf-navy); font-size:1rem; }
.why-point p { margin:4px 0 0; color:var(--gf-muted); font-size:.82rem; line-height:1.55; }

.testimonials-section .section-heading { margin-inline:auto; }
.testimonial-card { display:flex; flex-direction:column; min-height:250px; padding:31px 30px 27px 34px; }
.testimonial-top { display:flex; align-items:center; justify-content:space-between; min-height:28px; }
.testimonial-rating { color:#1680df; font-size:.83rem; letter-spacing:.09em; }
.testimonial-card>.quote { display:none; }
.testimonial-card>p { flex:1; margin-top:18px; font-size:.91rem; }
.testimonial-author { padding-top:16px; border-top:1px solid rgba(13,99,184,.11); }

.service-gallery-track { position:relative; overflow:hidden; }
.service-gallery-slide { position:absolute; inset:0; display:block !important; opacity:0; transform:scale(1.025); transition:opacity .7s ease,transform 1.05s ease; }
.service-gallery-slide.is-active { opacity:1; transform:scale(1); animation:none; }
.service-gallery-slide[hidden] { display:block !important; }

.gf-whatsapp-modal[hidden] { display:none; }
.gf-whatsapp-modal { position:fixed; inset:0; z-index:5000; display:grid; place-items:center; padding:20px; opacity:0; transition:opacity .22s ease; }
.gf-whatsapp-modal.is-visible { opacity:1; }
.gf-whatsapp-backdrop { position:absolute; inset:0; width:100%; height:100%; border:0; background:rgba(2,25,48,.67); backdrop-filter:blur(7px); cursor:pointer; }
.gf-whatsapp-dialog { position:relative; width:min(100%,485px); padding:0 28px 27px; overflow:hidden; border:1px solid rgba(255,255,255,.8); border-radius:22px; background:#fff; box-shadow:0 30px 85px rgba(0,19,42,.32); transform:translateY(16px) scale(.98); transition:transform .25s cubic-bezier(.2,.8,.2,1); }
.gf-whatsapp-modal.is-visible .gf-whatsapp-dialog { transform:translateY(0) scale(1); }
.gf-whatsapp-head { display:flex; align-items:center; gap:13px; margin:0 -28px 23px; padding:22px 54px 22px 28px; color:#fff; background:linear-gradient(135deg,#087b43,#25d366); }
.gf-whatsapp-head img { width:35px; height:35px; }
.gf-whatsapp-head span,.gf-whatsapp-head strong { display:block; }
.gf-whatsapp-head span { color:rgba(255,255,255,.72); font-size:.71rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase; }
.gf-whatsapp-head strong { margin-top:2px; font-size:1.05rem; }
.gf-whatsapp-close { position:absolute; top:16px; right:17px; width:31px; height:31px; padding:0; border:1px solid rgba(255,255,255,.36); border-radius:50%; color:#fff; background:rgba(255,255,255,.12); font-size:1.35rem; line-height:1; cursor:pointer; }
.gf-whatsapp-conversation { margin-bottom:18px; padding:14px 15px; border-radius:4px 13px 13px; color:#35536f; background:#eef7ff; font-size:.82rem; line-height:1.55; }
.gf-whatsapp-conversation p { margin:0; }
.gf-whatsapp-dialog label { display:block; margin:14px 0 6px; color:var(--gf-navy); font-size:.76rem; font-weight:700; }
.gf-whatsapp-dialog input,.gf-whatsapp-dialog textarea { width:100%; border:1px solid #cbd9e6; border-radius:10px; padding:11px 12px; color:var(--gf-text); font:inherit; font-size:.86rem; resize:vertical; }
.gf-whatsapp-dialog input:focus,.gf-whatsapp-dialog textarea:focus { outline:none; border-color:#25b863; box-shadow:0 0 0 3px rgba(37,211,102,.16); }
.gf-whatsapp-send { width:100%; margin-top:18px; border:0; color:#fff; background:linear-gradient(135deg,#078344,#1dc967); cursor:pointer; }
.gf-whatsapp-send:hover { box-shadow:0 14px 25px rgba(14,145,74,.25); }
@media (max-width:980px) { .why-grid { grid-template-columns:1fr; gap:36px; } .why-copy { max-width:680px; } }
@media (max-width:680px) { .section-heading-row .text-link { align-self:center; } .why-copy,.why-copy h2,.why-copy>p { text-align:center; margin-inline:auto; } .why-copy .button { display:flex; width:min(100%,330px); margin-inline:auto; } .why-point { text-align:left; } .gf-whatsapp-dialog { padding:0 19px 20px; border-radius:18px; } .gf-whatsapp-head { margin-inline:-19px; padding-left:19px; } }


/* Refined service gallery viewer */
.service-lightbox {
    padding: clamp(12px, 3vw, 34px);
    background: radial-gradient(circle at 50% 0%, rgba(28,123,210,.18), transparent 36%);
}

.service-lightbox-backdrop {
    background: rgba(1, 18, 34, .88);
}

.service-lightbox-dialog {
    width: min(1040px, 96vw);
    border: 1px solid rgba(132, 197, 244, .25);
    border-radius: 22px;
    background: linear-gradient(145deg, #0b3157, #051d35);
    box-shadow: 0 35px 100px rgba(0,0,0,.55);
}

.service-lightbox-toolbar {
    min-height: 64px;
    padding: 10px 15px 10px 23px;
    border-bottom: 1px solid rgba(173, 218, 250, .15);
    background: linear-gradient(90deg, rgba(18,77,137,.82), rgba(7,39,73,.72));
}

.service-lightbox-toolbar strong {
    overflow: hidden;
    color: #f7fbff;
    font-size: .93rem;
    font-weight: 700;
    letter-spacing: .01em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.service-lightbox-toolbar > div {
    gap: 8px;
}

.service-lightbox-toolbar button {
    width: 38px;
    height: 38px;
    border-color: rgba(255,255,255,.24);
    background: rgba(255,255,255,.10);
    transition: background .18s ease, transform .18s ease;
}

.service-lightbox-toolbar button:hover {
    background: rgba(54, 153, 234, .52);
    transform: translateY(-2px);
}

.service-lightbox-stage {
    height: min(62vh, 650px);
    padding: clamp(18px, 3vw, 32px) clamp(50px, 7vw, 88px);
    background:
        linear-gradient(45deg, rgba(11,57,96,.20) 25%, transparent 25%),
        linear-gradient(-45deg, rgba(11,57,96,.20) 25%, transparent 25%),
        #03182a;
    background-size: 24px 24px;
    background-position: 0 0, 0 12px;
}

.service-lightbox-stage img {
    width: auto;
    max-width: 100%;
    max-height: 100%;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 10px;
    box-shadow: 0 18px 45px rgba(0,0,0,.38);
}

.service-lightbox-arrow {
    width: 48px;
    height: 48px;
    border-color: rgba(151, 211, 255, .60);
    background: rgba(8, 57, 99, .88);
    box-shadow: 0 8px 25px rgba(0,0,0,.26);
    transition: transform .18s ease, background .18s ease;
}

.service-lightbox-arrow:hover {
    background: #1177d1;
    transform: translateY(-50%) scale(1.08);
}

.service-lightbox-counter {
    padding: 12px;
    color: rgba(236,248,255,.80);
    background: #082d50;
    font-weight: 600;
    letter-spacing: .08em;
}

@media (max-width:680px) {
    .service-lightbox-dialog { border-radius:16px; }
    .service-lightbox-toolbar { min-height:58px; padding-left:16px; }
    .service-lightbox-stage { height:min(60vh,560px); padding:16px 47px; }
    .service-lightbox-arrow { width:39px; height:39px; font-size:1.65rem; }
}


/* Keep the services CTA in the upper-right corner of its heading. */
.services-section .section-heading-row { align-items:flex-start; }
.services-section .section-heading-row .text-link { align-self:flex-start; margin-top:0; }
@media (max-width:680px) {
    .services-section .section-heading-row .text-link { align-self:center; margin-top:12px; }
}


/* Project request form: responsive, polished layout */
.gf-order-modal {
    align-items:center;
    padding:clamp(10px,3vw,32px);
    background:radial-gradient(circle at 50% 0%,rgba(39,142,228,.16),transparent 36%);
}

.gf-order-backdrop {
    background:rgba(2,24,47,.78);
}

.gf-order-dialog {
    width:min(920px,100%);
    max-height:calc(100dvh - 24px);
    padding:clamp(24px,4vw,42px);
    overflow:auto;
    overscroll-behavior:contain;
    border:1px solid rgba(207,231,250,.86);
    border-radius:24px;
    background:
        radial-gradient(circle at 100% 0%,rgba(59,153,232,.12),transparent 22rem),
        linear-gradient(145deg,#fff 0%,#f4faff 100%);
    box-shadow:0 30px 90px rgba(0,14,35,.42);
    scrollbar-width:thin;
    scrollbar-color:#9fc9ed transparent;
}

.gf-order-dialog::-webkit-scrollbar { width:7px; }
.gf-order-dialog::-webkit-scrollbar-thumb { border-radius:999px; background:#9fc9ed; }

.gf-order-heading {
    grid-template-columns:100px minmax(0,1fr);
    gap:22px;
    margin:0 42px 26px 0;
    padding:0 0 22px;
    border-bottom:1px solid #d8e7f3;
}

.gf-order-logo {
    width:96px;
    padding:10px;
    border-radius:17px;
    background:linear-gradient(145deg,#edf7ff,#fff);
    box-shadow:0 10px 24px rgba(10,74,132,.09);
}

.gf-order-heading h2 {
    font-size:clamp(1.8rem,3.3vw,2.55rem);
    letter-spacing:-.045em;
}

.gf-order-heading p {
    max-width:580px;
    font-size:.87rem;
    line-height:1.6;
}

.gf-order-assurances {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:13px;
}

.gf-order-assurances span {
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:5px 9px;
    border:1px solid #cae4f8;
    border-radius:999px;
    color:#1765aa;
    background:#eef8ff;
    font-size:.68rem;
    font-weight:700;
}

.gf-order-assurances span::before {
    content:"";
    display:grid;
    place-items:center;
    width:14px;
    height:14px;
    border-radius:50%;
    color:#fff;
    background:#1680df;
    font-size:.58rem;
}

.gf-order-fields {
    gap:16px 18px;
}

.gf-order-fields label {
    gap:7px;
}

.gf-order-fields input,
.gf-order-fields select,
.gf-order-fields textarea {
    min-height:47px;
    border-radius:11px;
    background:#fff;
}

.gf-order-fields textarea {
    min-height:98px;
}

.gf-service-hint {
    margin:0;
    padding:12px 14px;
    border-left-width:4px;
    border-radius:0 10px 10px 0;
    font-size:.77rem;
}

.gf-order-estimate {
    min-height:66px;
    border-radius:12px;
}

.gf-order-estimate strong {
    font-size:1.05rem;
}

.gf-order-divider {
    margin:8px 0 1px;
    font-size:.84rem;
}

.gf-order-note {
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin:17px 0 13px;
    padding:11px 13px;
    border-radius:10px;
    color:#48647f;
    background:#eef7ff;
    font-size:.72rem;
    line-height:1.5;
}

.gf-order-note>span {
    display:grid;
    place-items:center;
    width:18px;
    height:18px;
    flex:0 0 18px;
    border-radius:50%;
    color:#fff;
    background:#1680df;
    font-size:.68rem;
    font-weight:800;
}

.gf-order-submit {
    min-height:54px;
    border-radius:12px;
}

@media (max-width:680px) {
    .gf-order-modal {
        display:block;
        padding:0;
        overflow-y:auto;
    }

    .gf-order-dialog {
        width:100%;
        min-height:100dvh;
        max-height:none;
        margin:0;
        padding:24px 16px 30px;
        border:0;
        border-radius:0;
        overflow:visible;
    }

    .gf-order-close {
        top:16px;
        right:15px;
    }

    .gf-order-heading {
        grid-template-columns:70px minmax(0,1fr);
        gap:13px;
        margin:0 32px 20px 0;
        padding-bottom:18px;
    }

    .gf-order-logo {
        width:70px;
        padding:7px;
        border-radius:12px;
    }

    .gf-order-eyebrow {
        font-size:.61rem;
    }

    .gf-order-heading h2 {
        font-size:clamp(1.47rem,7vw,1.9rem);
        line-height:1.12;
    }

    .gf-order-heading p {
        margin-top:7px;
        font-size:.75rem;
        line-height:1.48;
    }

    .gf-order-assurances {
        gap:5px;
        margin-top:10px;
    }

    .gf-order-assurances span {
        padding:4px 7px;
        font-size:.59rem;
    }

    .gf-order-assurances span::before {
        width:12px;
        height:12px;
        font-size:.5rem;
    }

    .gf-order-fields {
        grid-template-columns:minmax(0,1fr);
        gap:13px;
    }

    .gf-order-fields label,
    .gf-order-wide {
        min-width:0;
        grid-column:auto;
    }

    .gf-order-fields input,
    .gf-order-fields select,
    .gf-order-fields textarea {
        max-width:100%;
        min-width:0;
    }

    .gf-order-estimate {
        min-width:0;
        text-align:left;
    }

    .gf-order-note {
        padding:10px 11px;
        font-size:.69rem;
    }
}

@media (max-width:390px) {
    .gf-order-dialog { padding-inline:13px; }
    .gf-order-heading { grid-template-columns:1fr; justify-items:center; margin-right:0; text-align:center; }
    .gf-order-logo { width:68px; }
    .gf-order-heading p { max-width:295px; }
    .gf-order-assurances { justify-content:center; }
}


/* About section */
.about-section {
    position:relative;
    overflow:hidden;
    background:linear-gradient(135deg,#fff 0%,#eff7ff 100%);
}

.about-section::before {
    content:"";
    position:absolute;
    width:540px;
    height:540px;
    top:-350px;
    right:-230px;
    border:1px solid rgba(20,116,200,.16);
    border-radius:50%;
}

.about-grid {
    position:relative;
    display:grid;
    grid-template-columns:minmax(340px,.88fr) minmax(0,1.12fr);
    align-items:center;
    gap:clamp(42px,8vw,110px);
}

.about-visual {
    position:relative;
    min-height:380px;
    display:grid;
    place-items:center;
    overflow:hidden;
    border-radius:25px;
    background:
        radial-gradient(circle at 75% 15%,rgba(75,165,243,.66),transparent 18rem),
        linear-gradient(135deg,#062f57,#0d67bb);
    box-shadow:0 24px 55px rgba(5,59,111,.20);
}

.about-visual::before,
.about-visual::after {
    content:"";
    position:absolute;
    border:1px solid rgba(255,255,255,.22);
    border-radius:50%;
}

.about-visual::before { width:330px; height:330px; top:-160px; left:-115px; }
.about-visual::after { width:410px; height:410px; right:-220px; bottom:-245px; }

.about-brand-mark {
    position:relative;
    z-index:1;
    color:#fff;
    font-size:clamp(4.8rem,9vw,7.4rem);
    font-weight:800;
    font-style:italic;
    letter-spacing:-.12em;
    text-shadow:0 10px 22px rgba(0,19,43,.22);
}

.about-brand-mark span { color:#7fc7fb; }

.about-visual-card {
    position:absolute;
    z-index:1;
    left:28px;
    right:28px;
    bottom:25px;
    padding:16px 18px;
    border:1px solid rgba(255,255,255,.28);
    border-radius:15px;
    color:#fff;
    background:rgba(255,255,255,.11);
    backdrop-filter:blur(12px);
}

.about-visual-card strong,
.about-visual-card span { display:block; }

.about-visual-card strong { font-size:1rem; }
.about-visual-card span { margin-top:3px; color:rgba(255,255,255,.72); font-size:.72rem; }

.about-copy h2 {
    max-width:600px;
    margin:0 0 17px;
    color:var(--gf-navy);
    font-size:clamp(2.15rem,4vw,3.55rem);
    line-height:1.08;
    letter-spacing:-.04em;
}

.about-copy>p {
    max-width:620px;
    margin:0 0 13px;
    color:var(--gf-muted);
    line-height:1.72;
}

.about-values {
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin:24px 0 22px;
}

.about-values span {
    display:inline-flex;
    align-items:center;
    padding:7px 10px;
    border:1px solid rgba(13,99,184,.14);
    border-radius:999px;
    color:#155f9f;
    background:#f1f8ff;
    font-size:.73rem;
    font-weight:700;
}

.about-values span::before {
    content:"";
    width:15px;
    height:15px;
    display:grid;
    place-items:center;
    margin-right:6px;
    border-radius:50%;
    color:#fff;
    background:#1680df;
    font-size:.57rem;
}

/* Correct small-screen grids and footer alignment. */
@media (max-width:680px) {
    .footer-brand p {
        width:100%;
        max-width:340px;
        text-align:center;
    }

    .stats-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
        padding:0;
    }

    .stat {
        min-height:154px;
        justify-content:center;
        padding:20px 8px;
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.17);
    }

    .stat:nth-child(odd) {
        border-right:1px solid rgba(255,255,255,.17);
    }

    .stat:nth-last-child(-n+2) {
        border-bottom:0;
    }

    .stat-icon {
        width:46px;
        height:46px;
        flex-basis:46px;
    }

    .stat-icon svg { width:23px; height:23px; }
    .stat strong { font-size:1.12rem; }
    .stat>div>span { font-size:.72rem; }

    .process-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:34px 8px;
    }

    .process-item {
        min-width:0;
        padding:0 6px;
    }

    .process-icon {
        width:70px;
        height:70px;
        margin-bottom:14px;
        border-width:5px;
    }

    .process-icon svg { width:26px; height:26px; }
    .process-number { top:-5px; right:calc(50% - 38px); }
    .process-item h3 { font-size:.92rem; }
    .process-item p { margin-top:6px; font-size:.72rem; line-height:1.48; }

    .about-grid {
        grid-template-columns:1fr;
        gap:31px;
    }

    .about-visual {
        min-height:270px;
        max-width:460px;
        width:100%;
        margin-inline:auto;
        border-radius:19px;
    }

    .about-brand-mark { font-size:5.2rem; }
    .about-visual-card { left:17px; right:17px; bottom:17px; padding:13px 14px; }
    .about-copy { text-align:center; }
    .about-copy>p { margin-inline:auto; font-size:.9rem; }
    .about-values { justify-content:center; }
    .about-link { justify-content:center; }
}

@media (max-width:390px) {
    .stat { min-height:146px; }
    .stat>div>span { font-size:.68rem; }
    .process-grid { gap:29px 4px; }
    .process-item p { font-size:.68rem; }
    .about-values span { font-size:.66rem; }
}


/* Large-format printing feature image */
.about-printing-visual {
    display:block;
    isolation:isolate;
    background:#0a3b6b;
}

.about-printing-visual::before,
.about-printing-visual::after {
    content:none;
}

.about-printing-visual>img {
    width:100%;
    height:100%;
    min-height:380px;
    object-fit:cover;
    object-position:center;
}

.about-printing-visual::after {
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    display:block;
    background:linear-gradient(180deg,transparent 45%,rgba(3,28,55,.78) 100%);
}

.about-printing-visual .about-visual-card {
    z-index:2;
    background:rgba(4,41,76,.68);
}

@media (max-width:680px) {
    .about-printing-visual>img {
        min-height:270px;
        object-position:center;
    }
}


/* Five real GF Enterprise service categories */
@media (min-width:981px) {
    .service-grid {
        grid-template-columns:repeat(6,minmax(0,1fr));
    }

    .service-card {
        grid-column:span 2;
    }

    .service-card:nth-child(4),
    .service-card:nth-child(5) {
        grid-column:span 3;
    }
}

.service-card .service-card-body {
    display:flex;
    flex-direction:column;
}

.service-card .service-card-body::after {
    content:"Commande standard ou devis sur mesure";
    display:inline-flex;
    align-items:center;
    align-self:flex-start;
    margin-top:auto;
    padding-top:15px;
    color:#1670bf;
    font-size:.68rem;
    font-weight:700;
    letter-spacing:.02em;
}

.service-card:nth-child(4) .service-card-body::after {
    content:"Formats standards et projets sur mesure";
}

.service-card:nth-child(5) .service-card-body::after {
    content:"Disponible selon le stock";
}

@media (max-width:680px) {
    .service-card .service-card-body::after {
        align-self:center;
    }
}


/* Services heading with PVC board feature */
.solutions-heading {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(270px,360px);
    align-items:center;
    gap:clamp(28px,5vw,68px);
    max-width:none;
    margin-bottom:44px;
    padding-bottom:0;
    border-bottom:0;
}

.solutions-copy {
    max-width:670px;
}

.solutions-copy .text-link {
    margin-top:23px;
}

.solutions-project-link {
    gap:8px;
    font-weight:700;
}

.solutions-project-link span {
    font-size:1.05em;
    transition:transform .2s ease;
}

.solutions-project-link:hover span {
    transform:translateX(3px);
}

.solutions-pvc-feature {
    position:relative;
    margin:0;
    overflow:hidden;
    border:1px solid rgba(13,99,184,.15);
    border-radius:16px;
    background:#eaf4fc;
    box-shadow:0 15px 35px rgba(12,70,122,.10);
}

.solutions-pvc-feature img {
    width:100%;
    aspect-ratio:1.38;
    object-fit:cover;
    object-position:center;
    transition:transform .45s ease;
}

.solutions-pvc-feature:hover img {
    transform:scale(1.035);
}

.solutions-pvc-feature figcaption {
    position:absolute;
    right:11px;
    bottom:11px;
    padding:6px 9px;
    border:1px solid rgba(255,255,255,.34);
    border-radius:7px;
    color:#fff;
    background:rgba(4,44,82,.76);
    backdrop-filter:blur(7px);
    font-size:.67rem;
    font-weight:700;
}

@media (max-width:680px) {
    .solutions-heading {
        grid-template-columns:1fr;
        gap:22px;
        margin-bottom:32px;
        text-align:center;
    }

    .solutions-copy {
        margin-inline:auto;
    }

    .solutions-copy .text-link {
        margin-top:17px;
    }

    .solutions-pvc-feature {
        width:min(100%,390px);
        margin-inline:auto;
        text-align:left;
    }
}


/* Footer location map */
.footer-map {
    position:relative;
    border-top:1px solid rgba(255,255,255,.12);
    background:rgba(1,24,47,.17);
}

.footer-map-inner {
    display:grid;
    grid-template-columns:minmax(220px,.64fr) minmax(0,1.36fr);
    align-items:center;
    gap:clamp(26px,5vw,68px);
    padding-top:42px;
    padding-bottom:42px;
}

.footer-map-kicker {
    display:inline-block;
    margin-bottom:7px;
    color:#71c9f9;
    font-size:.67rem;
    font-weight:800;
    letter-spacing:.12em;
}

.footer-map h2 {
    margin:0 0 11px;
    color:#fff;
    font-size:clamp(1.4rem,2.5vw,2rem);
    letter-spacing:-.03em;
}

.footer-map p {
    margin:0 0 16px;
    color:rgba(255,255,255,.70);
    font-size:.86rem;
    line-height:1.6;
}

.footer-map a {
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:#fff;
    font-size:.77rem;
    font-weight:700;
}

.footer-map a:hover { color:#71c9f9; }

.footer-map-frame {
    min-height:220px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.22);
    border-radius:16px;
    background:#0a3d70;
    box-shadow:0 16px 35px rgba(0,10,24,.20);
}

.footer-map iframe {
    display:block;
    width:100%;
    height:220px;
    border:0;
    filter:saturate(.86) contrast(1.03);
}

@media (max-width:680px) {
    .footer-map-inner {
        grid-template-columns:1fr;
        gap:23px;
        padding-top:38px;
        padding-bottom:38px;
        text-align:center;
    }

    .footer-map-frame,
    .footer-map iframe { min-height:205px; height:205px; }
}


/* Drag the portrait PVC image vertically within its frame. */
.solutions-pvc-feature {
    cursor:grab;
}

.solutions-pvc-feature img[data-pannable-image] {
    touch-action:none;
    user-select:none;
    -webkit-user-drag:none;
    object-position:center 50%;
}

.solutions-pvc-feature::before {
    content:"Glissez pour voir le tableau";
    position:absolute;
    z-index:3;
    top:10px;
    left:10px;
    padding:5px 8px;
    border-radius:999px;
    color:#fff;
    background:rgba(4,44,82,.68);
    backdrop-filter:blur(6px);
    font-size:.61rem;
    font-weight:700;
    pointer-events:none;
    opacity:.9;
    transition:opacity .18s ease;
}

.solutions-pvc-feature:hover::before,
.solutions-pvc-feature.is-panning::before {
    opacity:0;
}

.solutions-pvc-feature.is-panning {
    cursor:grabbing;
}

.solutions-pvc-feature.is-panning img {
    transition:none;
}


/* Keep the footer description precisely centered beneath the logo on phones. */
@media (max-width:680px) {
    .footer-brand {
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:flex-start;
        width:100%;
    }

    .footer-brand .brand-footer {
        display:flex;
        justify-content:center;
        width:100%;
        margin:0 auto;
    }

    .footer-brand p {
        display:block;
        width:min(100%,360px);
        max-width:360px;
        margin:20px auto 0 !important;
        padding:0;
        text-align:center !important;
    }
}


/* GF mobile corrections — 2026-09-13 */
.gf-order-dialog,.gf-whatsapp-dialog{min-width:0;max-width:100%;box-sizing:border-box}
.gf-order-fields>*{min-width:0}
.gf-order-fields input,.gf-order-fields select,.gf-order-fields textarea{min-width:0;max-width:100%;width:100%;box-sizing:border-box}
.gf-order-fields input[type="date"]{appearance:none;-webkit-appearance:none;min-inline-size:0}
.gf-order-fields input[type="date"]::-webkit-date-and-time-value{min-height:1.5em;text-align:left}
.gf-order-assurances span::before,.about-values span::before{content:"";width:6px;height:10px;margin:0 7px 3px 2px;border:solid currentColor;border-width:0 2px 2px 0;border-radius:0;background:none;transform:rotate(45deg);color:#1680df}
.testimonial-rating{display:inline-flex;gap:2px}
@media(max-width:1024px),(pointer:coarse){body input,body select,body textarea{font-size:16px!important}}
@media(max-width:680px){.gf-order-fields{grid-template-columns:minmax(0,1fr)}.gf-order-heading>div{min-width:0}.gf-order-assurances{flex-wrap:wrap}}

/* Mobile focus: override compact control typography before the keyboard opens. */
@media (max-width:1024px), (any-pointer:coarse) {
  html body :is(input,select,textarea):not([type="checkbox"]):not([type="radio"]) {
    font-size:16px!important;
    line-height:1.4;
  }
  html body .gf-order-dialog,html body .gf-whatsapp-dialog {
    transform:none!important;
    transition:opacity .2s ease!important;
  }
}

/* =========================================================
   24. MULTI-PAGE CATALOGUE, SERVICES & PORTFOLIO
   ========================================================= */
.gf-page-shell { overflow: clip; background: #fff; }
.gf-page-hero { position: relative; padding: 112px 0 92px; background: linear-gradient(125deg,#f4f9ff 0%,#fff 49%,#e6f2ff 100%); border-bottom:1px solid #dceafa; }
.gf-page-hero::after { content:""; position:absolute; width:430px; height:430px; right:-180px; top:-230px; border-radius:50%; background:radial-gradient(circle,rgba(22,128,223,.18),transparent 70%); pointer-events:none; }
.gf-page-hero .container { position:relative; z-index:1; max-width:920px; margin-left:max(24px,calc((100vw - var(--container))/2)); }
.gf-page-hero h1,.gf-service-detail-hero h1 { max-width:880px; margin:0 0 18px; font-size:clamp(2.4rem,5.3vw,4.65rem); line-height:1.05; letter-spacing:-.05em; }
.gf-page-hero p { max-width:700px; margin:0; color:var(--gf-muted); font-size:1.1rem; }
.gf-hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.button-ghost-dark { border:1px solid #b9d2ec; background:#fff; color:var(--gf-navy); }
.button-ghost-dark:hover { border-color:var(--gf-blue); color:var(--gf-blue); }
.gf-category-pills { display:flex; flex-wrap:wrap; gap:10px; margin:-12px 0 54px; }
.gf-category-pills a { padding:10px 15px; border:1px solid #d9e6f3; border-radius:999px; color:var(--gf-navy); font-size:.82rem; font-weight:600; background:#fff; transition:.2s; }
.gf-category-pills a:hover,.gf-category-pills a.is-active { border-color:var(--gf-blue); color:#fff; background:var(--gf-blue); }
.gf-service-category { scroll-margin-top:120px; margin:0 0 80px; }
.gf-service-category .section-heading { margin-bottom:24px; }
.gf-service-category .section-heading h2 { font-size:clamp(1.8rem,3vw,2.5rem); }
.gf-service-catalogue-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.gf-service-catalogue-card { display:flex; flex-direction:column; overflow:hidden; border:1px solid #dce7f1; border-radius:18px; background:#fff; box-shadow:0 12px 30px rgba(13,65,114,.06); transition:transform .25s,box-shadow .25s; }
.gf-service-catalogue-card:hover { transform:translateY(-6px); box-shadow:0 22px 43px rgba(13,65,114,.14); }
.gf-service-card-image { display:block; height:220px; background:#eaf3fc; overflow:hidden; }
.gf-service-card-image img { width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.gf-service-catalogue-card:hover .gf-service-card-image img { transform:scale(1.05); }
.gf-service-card-body { display:flex; flex:1; flex-direction:column; align-items:flex-start; padding:22px; }
.gf-card-tag { color:var(--gf-blue); font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.gf-service-card-body h3 { margin:8px 0 9px; font-size:1.2rem; line-height:1.25; }
.gf-service-card-body p { margin:0 0 18px; color:var(--gf-muted); font-size:.88rem; line-height:1.65; }
.gf-price-preview { display:grid; grid-template-columns:auto auto; gap:2px 9px; width:100%; margin-top:auto; padding:12px; border-radius:11px; background:#f3f8fd; }
.gf-price-preview span,.gf-price-preview small { color:var(--gf-muted); font-size:.72rem; }.gf-price-preview strong { color:var(--gf-blue); font-size:.94rem; }.gf-price-preview small { grid-column:1/-1; }
.gf-service-card-body .text-link { margin-top:17px; }
.gf-cta-band { background:linear-gradient(115deg,#062b52,#0e6cc5); color:#fff; padding:58px 0; }
.gf-cta-band .container { display:flex; align-items:center; justify-content:space-between; gap:32px; }.gf-cta-band h2 { margin:0 0 8px; color:#fff; font-size:clamp(1.8rem,3vw,2.7rem); }.gf-cta-band p { margin:0; color:rgba(255,255,255,.77); }.button-white { color:var(--gf-navy); background:#fff; white-space:nowrap; }
.gf-breadcrumb { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:28px; color:#66809a; font-size:.8rem; }.gf-breadcrumb a { color:var(--gf-blue); }
.gf-service-detail-hero { padding:92px 0 76px; background:#f8fbff; }.gf-service-detail-grid { display:grid; grid-template-columns:1.02fr .98fr; align-items:center; gap:60px; }.gf-rich-content { color:#536c84; }.gf-rich-content p { margin-top:0; }.gf-service-main-image { position:relative; margin:0; height:440px; border-radius:28px; overflow:hidden; box-shadow:var(--shadow-md); }.gf-service-main-image img { width:100%; height:100%; object-fit:cover; }.gf-service-points { margin:28px 0 0; padding:0; list-style:none; }.gf-service-points li { position:relative; margin:9px 0; padding-left:25px; color:#31516e; font-size:.92rem; }.gf-service-points li::before { content:"✓"; position:absolute; left:0; color:var(--gf-blue); font-weight:800; }
.gf-configure-section { background:#fff; }.gf-service-configurator { display:grid; grid-template-columns:1.1fr .9fr; gap:36px; padding:30px; border:1px solid #dce8f4; border-radius:24px; background:#fff; box-shadow:var(--shadow-sm); }.gf-config-fields { display:grid; grid-template-columns:1fr 1fr; gap:18px; align-content:start; }.gf-config-fields label { display:grid; gap:7px; color:#294962; font-size:.82rem; font-weight:600; }.gf-config-fields input,.gf-config-fields select,.gf-config-fields textarea { width:100%; min-width:0; padding:13px 14px; border:1px solid #cbdced; border-radius:10px; outline:0; color:var(--gf-text); background:#fff; font:inherit; font-size:.91rem; }.gf-config-fields input:focus,.gf-config-fields select:focus,.gf-config-fields textarea:focus { border-color:var(--gf-blue); box-shadow:0 0 0 3px rgba(13,99,184,.12); }.gf-config-wide { grid-column:1/-1; }.gf-config-feedback { margin:0; min-height:1.5em; color:var(--gf-muted); font-size:.85rem; }.gf-config-feedback.is-error { color:#b42335; }.gf-dimension-preview { display:flex; flex-direction:column; min-height:480px; padding:25px; border-radius:18px; background:linear-gradient(145deg,#e8f3ff,#f8fbff); }.gf-dimension-preview>span { color:var(--gf-blue); font-size:.78rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }.gf-preview-stage { display:grid; flex:1; min-height:300px; place-items:center; padding:24px; }.gf-preview-object { width:min(100%,calc(230px * var(--gf-preview-ratio,1))); aspect-ratio:var(--gf-preview-ratio,1); max-height:250px; overflow:hidden; border:9px solid #fff; border-radius:9px; background:var(--gf-navy); box-shadow:0 18px 30px rgba(11,53,95,.22); transition:width .3s ease,aspect-ratio .3s ease; }.gf-preview-object img { width:100%; height:100%; object-fit:cover; }.gf-preview-meta { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 0; border-top:1px solid #cadeef; color:var(--gf-navy); }.gf-preview-meta strong { font-size:1.05rem; }.gf-preview-meta span { color:var(--gf-blue); font-weight:700; }.gf-dimension-preview small { color:#6d8196; font-size:.74rem; line-height:1.45; }
.gf-service-assurance { background:#f4f9ff; }.gf-service-assurance>.container>div:first-child { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:28px; }.gf-service-assurance h2 { margin:0; font-size:clamp(1.7rem,3vw,2.5rem); }.gf-assurance-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.gf-assurance-grid article { padding:23px; border-radius:15px; background:#fff; border:1px solid #dce7f1; }.gf-assurance-grid b { color:#56a5ea; font-size:1.7rem; }.gf-assurance-grid h3 { margin:9px 0 6px; font-size:1.05rem; }.gf-assurance-grid p { margin:0; color:var(--gf-muted); font-size:.88rem; }
.gf-portfolio-hero { background:linear-gradient(120deg,#071d38 0%,#084b8f 56%,#1280df 100%); }.gf-portfolio-hero h1,.gf-portfolio-hero .section-kicker { color:#fff; }.gf-portfolio-hero p { color:rgba(255,255,255,.8); }.gf-portfolio-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }.gf-portfolio-card { overflow:hidden; border:1px solid #dce8f3; border-radius:18px; background:#fff; box-shadow:0 10px 26px rgba(13,65,114,.07); }.gf-portfolio-image { height:265px; background:#eaf3fc; }.gf-portfolio-image img { width:100%; height:100%; object-fit:cover; }.gf-portfolio-body { padding:21px; }.gf-portfolio-body>span { color:var(--gf-blue); font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }.gf-portfolio-body h2 { margin:8px 0; font-size:1.25rem; }.gf-portfolio-body p { min-height:4.2em; margin:0 0 17px; color:var(--gf-muted); font-size:.87rem; }.gf-portfolio-body>div { display:flex; align-items:center; justify-content:space-between; gap:10px; }.gf-portfolio-body small { color:#6d8295; }.gf-empty-portfolio { grid-column:1/-1; padding:70px 24px; border:1px dashed #bcd2e7; border-radius:18px; text-align:center; background:#f8fbff; }.gf-empty-portfolio h2 { margin:0 0 8px; }.gf-empty-portfolio p { max-width:570px; margin:0 auto 22px; color:var(--gf-muted); }
.gf-simple-page-hero { padding-block:74px; }.gf-simple-page-hero h1 { margin-bottom:0; }.gf-content-page { max-width:1000px; }.gf-content-page .container { max-width:800px; }.gf-content-page h2 { margin-top:36px; font-size:1.65rem; }.gf-content-page .button { margin-top:8px; }
@media (max-width:1000px) { .gf-service-catalogue-grid,.gf-portfolio-grid { grid-template-columns:repeat(2,1fr); }.gf-service-detail-grid,.gf-service-configurator { grid-template-columns:1fr; gap:30px; }.gf-service-main-image { height:350px; }.gf-dimension-preview { min-height:390px; }.gf-page-hero .container { margin-inline:auto; } }
@media (max-width:680px) { .gf-page-hero { padding:68px 0 60px; }.gf-page-hero h1,.gf-service-detail-hero h1 { font-size:2.35rem; }.gf-service-catalogue-grid,.gf-portfolio-grid,.gf-assurance-grid { grid-template-columns:1fr; }.gf-category-pills { flex-wrap:nowrap; overflow:auto; padding-bottom:8px; margin-bottom:36px; }.gf-category-pills a { white-space:nowrap; }.gf-service-category { margin-bottom:58px; }.gf-service-card-image { height:205px; }.gf-cta-band .container,.gf-service-assurance>.container>div:first-child { align-items:flex-start; flex-direction:column; }.gf-service-detail-hero { padding:55px 0; }.gf-service-main-image { height:270px; }.gf-service-configurator { padding:18px; }.gf-config-fields { grid-template-columns:1fr; }.gf-config-wide { grid-column:auto; }.gf-dimension-preview { min-height:365px; }.gf-preview-stage { min-height:225px; }.gf-portfolio-image { height:230px; } }

/* Category-first services and restricted visual management portal. */
.gf-services-univers { background:#fff; }.gf-universe-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }.gf-universe-card { position:relative; display:flex; min-height:315px; overflow:hidden; border-radius:22px; background:#0a3d70 var(--gf-universe-image) center/cover no-repeat; box-shadow:0 17px 38px rgba(7,49,90,.14); isolation:isolate; }.gf-universe-overlay { position:absolute; inset:0; z-index:-1; background:linear-gradient(15deg,rgba(4,29,57,.94),rgba(4,45,83,.2) 73%); }.gf-universe-content { display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; padding:30px; color:#fff; }.gf-universe-content span { color:#a7d7ff; font-size:.75rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }.gf-universe-content h2 { max-width:420px; margin:6px 0 9px; color:#fff; font-size:clamp(1.6rem,2.8vw,2.35rem); line-height:1.1; }.gf-universe-content p { max-width:430px; margin:0 0 20px; color:rgba(255,255,255,.82); font-size:.9rem; }.gf-universe-content b { display:inline-flex; align-items:center; gap:10px; padding:9px 0; color:#fff; font-size:.86rem; }.gf-universe-content i { font-size:1.15rem; font-style:normal; transition:transform .2s; }.gf-universe-card:hover .gf-universe-content i { transform:translateX(5px); }.gf-category-hero { padding-block:88px; }.gf-category-service-grid { grid-template-columns:repeat(3,1fr); }.gf-service-catalogue-card h2 { margin:8px 0 9px; color:var(--gf-navy); font-size:1.2rem; line-height:1.25; }.gf-service-card-action { margin-top:17px; padding:11px 15px; font-size:.82rem; }
.gf-visual-portal .gf-simple-page-hero { background:linear-gradient(120deg,#071f3d,#0d5ca6); }.gf-visual-portal .gf-simple-page-hero h1,.gf-visual-portal .gf-simple-page-hero .section-kicker { color:#fff; }.gf-visual-portal .gf-simple-page-hero p { color:rgba(255,255,255,.78); }.gf-visual-login { max-width:530px; margin:0 auto; padding:32px; border:1px solid #dce8f2; border-radius:20px; box-shadow:var(--shadow-sm); }.gf-visual-login h2 { margin:0 0 8px; }.gf-visual-login p { color:var(--gf-muted); }.gf-visual-login form { display:grid; gap:12px; margin-top:20px; }.gf-visual-login label { display:grid; gap:6px; color:#294962; font-size:.85rem; }.gf-visual-login input { padding:12px; border:1px solid #cbdced; border-radius:9px; }.gf-visual-login input[type=submit] { border:0; background:var(--gf-blue); color:#fff; font-weight:700; cursor:pointer; }.gf-visual-intro { display:flex; align-items:end; justify-content:space-between; gap:25px; margin-bottom:22px; }.gf-visual-intro h2 { margin:0; }.gf-visual-intro p { max-width:620px; margin:0; color:var(--gf-muted); font-size:.88rem; }.gf-visual-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }.gf-visual-card { overflow:hidden; border:1px solid #dce7f1; border-radius:16px; background:#fff; box-shadow:0 8px 22px rgba(13,65,114,.06); }.gf-visual-card>img { width:100%; height:180px; object-fit:cover; background:#eaf3fc; }.gf-visual-card>div { padding:17px; }.gf-visual-card h3 { margin:0 0 12px; font-size:1rem; }.gf-visual-card form { display:grid; gap:10px; }.gf-visual-card label { display:grid; gap:5px; color:#536c84; font-size:.76rem; font-weight:600; }.gf-visual-card input[type=file] { width:100%; max-width:100%; color:#536c84; font-size:.76rem; }.gf-visual-card .button { padding:10px 12px; justify-content:center; font-size:.79rem; }.gf-visual-notice { margin:0 0 22px; padding:12px 15px; border-radius:10px; background:#e8f8f0; color:#137347; font-size:.9rem; }.gf-visual-notice.is-error { background:#fff0f0; color:#af2433; }.gf-portfolio-admin-title { margin-top:64px; }.gf-visual-empty { grid-column:1/-1; padding:38px; border:1px dashed #bbd4e8; border-radius:16px; background:#f8fbff; text-align:center; }.gf-visual-empty h3 { margin:0 0 6px; }.gf-visual-empty p { margin:0; color:var(--gf-muted); }
@media(max-width:900px){.gf-category-service-grid,.gf-visual-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.gf-universe-grid,.gf-category-service-grid,.gf-visual-grid{grid-template-columns:1fr}.gf-universe-card{min-height:260px}.gf-universe-content{padding:23px}.gf-visual-intro{align-items:flex-start;flex-direction:column}.gf-visual-card>img{height:210px}}
.gf-portfolio-create-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:28px;background:#fff;border:1px solid #dce7f3;border-radius:18px;box-shadow:0 10px 30px rgba(13,49,85,.06)}.gf-portfolio-create-form label{display:grid;gap:8px;font-weight:700;color:#173b65}.gf-portfolio-create-form label:nth-of-type(3),.gf-portfolio-create-form label:nth-of-type(4),.gf-portfolio-create-form button{grid-column:1/-1}.gf-portfolio-create-form input,.gf-portfolio-create-form textarea{width:100%;padding:13px;border:1px solid #bfd2e7;border-radius:8px;font:inherit}.gf-portfolio-create-form button{justify-self:start}@media(max-width:640px){.gf-portfolio-create-form{grid-template-columns:1fr;padding:20px}.gf-portfolio-create-form label:nth-of-type(3),.gf-portfolio-create-form label:nth-of-type(4),.gf-portfolio-create-form button{grid-column:auto}}
/* Services redesign: compact editorial hierarchy, rich visual cards and purposeful motion. */
.gf-services-page{background:#f7faff}.gf-services-showcase{position:relative;overflow:hidden;padding:92px 0 84px;background:linear-gradient(125deg,#061f3a 0%,#083b70 50%,#0a75cf 100%);color:#fff}.gf-services-showcase:before{content:"";position:absolute;inset:auto -15vw -70% auto;width:680px;height:680px;border:1px solid rgba(255,255,255,.18);border-radius:50%;box-shadow:0 0 0 75px rgba(255,255,255,.03),0 0 0 150px rgba(255,255,255,.025)}.gf-services-showcase-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:44px}.gf-services-showcase .section-kicker{color:#86c9ff}.gf-services-showcase h1{max-width:670px;margin:13px 0 17px;color:#fff;font-size:clamp(2.7rem,5.4vw,5rem);line-height:.98;letter-spacing:-.065em}.gf-services-showcase-copy>p{max-width:610px;margin:0;color:rgba(255,255,255,.78);font-size:1.04rem;line-height:1.72}.gf-services-showcase .button-primary{box-shadow:0 15px 30px rgba(0,0,0,.17)}.gf-showcase-link{display:inline-flex;align-items:center;gap:11px;padding:12px 5px;color:#fff;font-weight:700}.gf-showcase-link span{font-size:1.25rem}.gf-service-trust{display:flex;flex-wrap:wrap;gap:14px 28px;margin-top:37px;padding-top:20px;border-top:1px solid rgba(255,255,255,.18);color:rgba(255,255,255,.78);font-size:.78rem}.gf-service-trust span{display:inline-flex;align-items:baseline;gap:6px}.gf-service-trust b{color:#fff;font-size:1.08rem}.gf-services-showcase-art{position:relative;min-height:430px}.gf-art-back{position:absolute;inset:27px 25px 18px 67px;border:1px solid rgba(170,220,255,.48);border-radius:30px;transform:rotate(6deg)}.gf-art-photo{position:absolute;overflow:hidden;margin:0;border:8px solid rgba(255,255,255,.96);border-radius:21px;background:#dbeeff;box-shadow:0 28px 52px rgba(0,11,29,.28)}.gf-art-photo img{display:block;width:100%;height:100%;object-fit:cover}.gf-art-photo-main{top:5px;right:12px;width:min(82%,420px);height:380px;animation:gf-photo-drift 6s ease-in-out infinite}.gf-art-photo-small{bottom:0;left:0;width:185px;height:155px;animation:gf-photo-drift 6s ease-in-out 1.1s infinite reverse}.gf-art-badge{position:absolute;z-index:2;right:0;bottom:10px;display:flex;align-items:center;gap:10px;padding:11px 15px 11px 11px;border-radius:13px;background:#fff;color:#092e58;box-shadow:0 16px 30px rgba(0,15,35,.25)}.gf-art-badge span{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:#1278d4;color:#fff;font-weight:800}.gf-art-badge strong{font-size:.75rem;line-height:1.25}@keyframes gf-photo-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}.gf-services-univers{padding-block:82px;background:#f7faff}.gf-univers-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;max-width:1120px;margin:0 auto 32px}.gf-univers-heading h2{max-width:600px;margin:9px 0 0;color:var(--gf-navy);font-size:clamp(2rem,3.6vw,3.3rem);line-height:1.05;letter-spacing:-.045em}.gf-univers-heading p{max-width:365px;margin:0 0 5px;color:#607a94;line-height:1.65}.gf-services-page .gf-universe-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}.gf-services-page .gf-universe-card{min-height:337px;border-radius:17px;box-shadow:0 12px 26px rgba(5,40,76,.13);transform:translateY(0);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}.gf-services-page .gf-universe-card:before{content:"";position:absolute;inset:0;background:inherit;background-position:center;background-size:cover;transition:transform .7s ease;z-index:-2}.gf-services-page .gf-universe-card:hover{transform:translateY(-8px);box-shadow:0 23px 42px rgba(5,40,76,.22)}.gf-services-page .gf-universe-card:hover:before{transform:scale(1.08)}.gf-services-page .gf-universe-overlay{z-index:-1;background:linear-gradient(0deg,rgba(3,23,43,.95),rgba(4,35,67,.09) 76%)}.gf-universe-number{position:absolute;top:17px;right:18px;color:rgba(255,255,255,.82);font-size:.7rem;font-weight:800;letter-spacing:.12em}.gf-services-page .gf-universe-content{padding:25px;transform:translateY(10px);transition:transform .35s ease}.gf-services-page .gf-universe-card:hover .gf-universe-content{transform:translateY(0)}.gf-services-page .gf-universe-content h2{font-size:1.6rem}.gf-services-page .gf-universe-content p{margin-bottom:15px;font-size:.82rem}.gf-services-process{padding:76px 0;background:#082f59;color:#fff}.gf-services-process .section-kicker{color:#8fd3ff}.gf-services-process h2{max-width:550px;margin:10px 0 32px;color:#fff;font-size:clamp(2rem,3.6vw,3.1rem);line-height:1.07;letter-spacing:-.04em}.gf-services-process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.18);border-radius:17px;overflow:hidden}.gf-services-process-grid article{min-height:172px;padding:27px;background:#0a3a6a}.gf-services-process-grid b{color:#76c9ff;font-size:.78rem;letter-spacing:.1em}.gf-services-process-grid h3{margin:14px 0 7px;color:#fff;font-size:1.15rem}.gf-services-process-grid p{margin:0;color:rgba(255,255,255,.7);font-size:.87rem;line-height:1.6}.gf-category-hero{padding:74px 0 58px;background:linear-gradient(118deg,#e8f4ff,#fff)}.gf-category-hero .container{max-width:1050px;margin-inline:auto}.gf-category-service-grid{gap:24px}.gf-service-catalogue-card{border:0;border-radius:18px;box-shadow:0 10px 28px rgba(13,65,114,.09)}.gf-service-card-image{height:238px}.gf-service-card-body{padding:23px}.gf-service-card-body h2{font-size:1.3rem}.gf-service-card-body p{min-height:4.7em}.gf-service-card-action{width:100%;justify-content:center;margin-top:19px}.gf-service-single .gf-service-detail-hero{background:linear-gradient(120deg,#f3f9ff,#fff)}
@media(max-width:980px){.gf-services-showcase-grid{grid-template-columns:1fr}.gf-services-showcase-art{width:min(100%,590px);margin:auto}.gf-services-page .gf-universe-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gf-univers-heading{align-items:flex-start;flex-direction:column;gap:15px}.gf-services-process-grid{grid-template-columns:1fr}.gf-services-process-grid article{min-height:auto}}
@media(max-width:640px){.gf-services-showcase{padding:65px 0 57px}.gf-services-showcase h1{font-size:2.65rem}.gf-services-showcase-art{min-height:310px;margin-top:3px}.gf-art-photo-main{right:6px;width:82%;height:275px;border-width:6px}.gf-art-photo-small{width:132px;height:112px;border-width:5px}.gf-art-back{inset:22px 15px 14px 40px;border-radius:20px}.gf-art-badge{right:0;bottom:0}.gf-service-trust{gap:11px 17px;margin-top:26px}.gf-services-univers{padding-block:58px}.gf-services-page .gf-universe-grid{grid-template-columns:1fr}.gf-services-page .gf-universe-card{min-height:275px}.gf-services-process{padding:57px 0}.gf-services-process-grid article{padding:23px}.gf-category-hero{padding-block:52px}.gf-category-service-grid{gap:17px}.gf-service-card-image{height:215px}}
@media(prefers-reduced-motion:reduce){.gf-art-photo{animation:none}.gf-services-page .gf-universe-card,.gf-services-page .gf-universe-card:before,.gf-services-page .gf-universe-content{transition:none}}
/* Final service page architecture: automatic hero slider + calm category catalogue. */
.gf-services-clean{background:#fff}.gf-services-clean .gf-service-slider{position:relative;height:clamp(470px,56vw,640px);overflow:hidden;background:#062d57}.gf-services-clean .gf-slide{position:absolute;inset:0;display:flex;align-items:center;opacity:0;transform:scale(1.025);transition:opacity .8s ease,transform 5s ease;background-position:center;background-size:cover}.gf-services-clean .gf-slide:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,24,48,.92) 0%,rgba(4,39,75,.72) 43%,rgba(3,30,57,.12) 78%)}.gf-services-clean .gf-slide-content{position:relative;z-index:1;width:100%;color:#fff}.gf-services-clean .gf-slide-content .section-kicker{color:#81ccff}.gf-services-clean .gf-slide h1{max-width:660px;margin:13px 0 16px;color:#fff;font-size:clamp(2.8rem,5.7vw,5.3rem);line-height:.98;letter-spacing:-.065em}.gf-services-clean .gf-slide p{max-width:540px;margin:0 0 28px;color:rgba(255,255,255,.82);font-size:1.03rem;line-height:1.7}.gf-services-clean .gf-slide-one{background-image:url('assets/images/about-large-format-printing.png');animation:gf-slide-one 15s infinite}.gf-services-clean .gf-slide-two{background-image:url('assets/images/service-promotional.jpg');animation:gf-slide-two 15s infinite}.gf-services-clean .gf-slide-three{background-image:url('assets/images/service-pvc-panel-v2.png');animation:gf-slide-three 15s infinite}.gf-services-clean .gf-slider-dots{position:absolute;z-index:3;bottom:28px;left:50%;display:flex;gap:8px;transform:translateX(-50%)}.gf-services-clean .gf-slider-dots span{display:block;width:28px;height:3px;border-radius:999px;background:rgba(255,255,255,.38);animation:gf-dot 15s infinite}.gf-services-clean .gf-slider-dots span:nth-child(2){animation-delay:5s}.gf-services-clean .gf-slider-dots span:nth-child(3){animation-delay:10s}@keyframes gf-slide-one{0%,29%{opacity:1;transform:scale(1)}33%,96%{opacity:0}100%{opacity:1}}@keyframes gf-slide-two{0%,29%{opacity:0}33%,62%{opacity:1;transform:scale(1)}66%,100%{opacity:0}}@keyframes gf-slide-three{0%,62%{opacity:0}66%,95%{opacity:1;transform:scale(1)}100%{opacity:0}}@keyframes gf-dot{0%,29%{background:#fff}33%,100%{background:rgba(255,255,255,.38)}}.gf-service-category-section{padding-block:82px;background:#fff}.gf-category-heading{max-width:710px;margin:0 auto 38px;text-align:center}.gf-category-heading h2{margin:10px 0 12px;color:var(--gf-navy);font-size:clamp(2rem,3.7vw,3.15rem);line-height:1.08;letter-spacing:-.045em}.gf-category-heading p{margin:0;color:#607a94;line-height:1.68}.gf-category-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.gf-category-card{overflow:hidden;border:1px solid #e0eaf3;border-radius:16px;background:#fff;box-shadow:0 8px 26px rgba(12,57,99,.075);transition:box-shadow .25s ease,transform .25s ease}.gf-category-card:hover{transform:translateY(-5px);box-shadow:0 18px 38px rgba(12,57,99,.14)}.gf-category-image{position:relative;display:block;height:212px;overflow:hidden;background:#e9f3fc}.gf-category-image:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(2,30,58,.38),transparent 55%)}.gf-category-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.gf-category-card:hover .gf-category-image img{transform:scale(1.07)}.gf-category-count{position:absolute;z-index:1;top:16px;left:16px;display:grid;place-items:center;width:37px;height:37px;border-radius:50%;background:#fff;color:var(--gf-blue);font-size:.75rem;font-weight:800}.gf-category-card-content{padding:21px 21px 22px}.gf-category-card-content>span{color:#1680df;font-size:.71rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.gf-category-card h3{margin:8px 0 9px;color:var(--gf-navy);font-size:1.32rem;line-height:1.2}.gf-category-card p{min-height:3.8em;margin:0 0 18px;color:#617a93;font-size:.87rem;line-height:1.55}.gf-explorer-link{display:inline-flex;align-items:center;gap:10px;color:#0769c6;font-size:.86rem;font-weight:800}.gf-explorer-link b{font-size:1.12rem;transition:transform .2s}.gf-category-card:hover .gf-explorer-link b{transform:translateX(4px)}.gf-services-bottom-cta{padding:56px 0;background:#083666;color:#fff}.gf-services-bottom-cta .container{display:flex;align-items:center;justify-content:space-between;gap:25px}.gf-services-bottom-cta .section-kicker{color:#91d4ff}.gf-services-bottom-cta h2{margin:8px 0;color:#fff;font-size:clamp(1.7rem,3vw,2.55rem)}.gf-services-bottom-cta p{margin:0;color:rgba(255,255,255,.75)}
@media(max-width:900px){.gf-category-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){.gf-services-clean .gf-service-slider{height:500px}.gf-services-clean .gf-slide:before{background:linear-gradient(90deg,rgba(3,24,48,.9),rgba(3,33,62,.58))}.gf-services-clean .gf-slide h1{font-size:2.75rem}.gf-category-cards{grid-template-columns:1fr;gap:18px}.gf-category-image{height:225px}.gf-service-category-section{padding-block:58px}.gf-services-bottom-cta .container{align-items:flex-start;flex-direction:column}.gf-services-bottom-cta{padding-block:45px}}@media(prefers-reduced-motion:reduce){.gf-services-clean .gf-slide,.gf-services-clean .gf-slider-dots span{animation:none}.gf-services-clean .gf-slide-one{opacity:1}.gf-services-clean .gf-slide-two,.gf-services-clean .gf-slide-three{display:none}}
/* Clean service catalogue layout — replaces previous visual experiments. */
.gf-services-clean{background:#fff}.gf-services-clean .gf-service-slider{height:560px;background:#062f5b}.gf-services-clean .gf-slide{display:none;opacity:1;transform:none;animation:none!important}.gf-services-clean .gf-slide.is-active{display:flex;animation:gf-clean-fade .55s ease both!important}.gf-services-clean .gf-slide:before{background:linear-gradient(90deg,rgba(3,29,56,.91) 0%,rgba(4,42,79,.64) 45%,rgba(5,38,68,.10) 82%)}.gf-services-clean .gf-slide-content{max-width:1240px;margin-inline:auto;padding-inline:0}.gf-services-clean .gf-slide h1{max-width:610px;margin:14px 0 16px;font-size:clamp(2.9rem,5vw,4.8rem);letter-spacing:-.06em}.gf-services-clean .gf-slide p{max-width:515px;margin-bottom:26px;font-size:1rem}.gf-services-clean .gf-slide .button{min-width:190px;justify-content:center}.gf-services-clean .gf-slider-dots span{animation:none!important;transition:background .2s,width .2s}.gf-services-clean .gf-slider-dots span.is-active{width:38px;background:#fff}@keyframes gf-clean-fade{from{opacity:0}to{opacity:1}}.gf-service-category-section{padding:76px 0 88px;background:#f5f8fc}.gf-category-heading{max-width:650px;margin-bottom:36px}.gf-category-heading h2{font-size:clamp(2rem,3.2vw,2.9rem);letter-spacing:-.045em}.gf-category-heading p{font-size:.96rem}.gf-category-cards{grid-template-columns:repeat(3,1fr);gap:20px}.gf-category-card{border:1px solid #e1e8f0;border-radius:12px;box-shadow:none}.gf-category-card:hover{transform:translateY(-4px);box-shadow:0 13px 28px rgba(11,52,91,.12)}.gf-category-image{height:190px}.gf-category-card-content{padding:20px}.gf-category-card-content>span{font-size:.68rem}.gf-category-card h3{margin:7px 0 7px;font-size:1.2rem}.gf-category-card p{min-height:0;margin:0 0 16px;font-size:.84rem}.gf-explorer-link{padding:10px 0;font-size:.82rem}.gf-services-bottom-cta{padding:52px 0}.gf-services-bottom-cta h2{margin:6px 0;font-size:2rem}@media(max-width:1240px){.gf-services-clean .gf-slide-content{padding-inline:24px}}@media(max-width:900px){.gf-category-cards{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.gf-services-clean .gf-service-slider{height:485px}.gf-services-clean .gf-slide-content{padding-inline:22px}.gf-services-clean .gf-slide h1{font-size:2.65rem}.gf-services-clean .gf-slide p{font-size:.94rem}.gf-service-category-section{padding:55px 0}.gf-category-cards{grid-template-columns:1fr;gap:16px}.gf-category-image{height:210px}}