/*
 * FC Minimal – Local @font-face Declarations
 *
 * Weights
 *   100  Thin
 *                  // 200  ExtraLight
 *                  // 300  Light
 *   400  Regular
 *   500  Medium
 *                  // 600  SemiBold
 *   700  Bold
 *                  // 800  ExtraBold
 *                  // 900  Black
 *
 * Format: WOFF2 only (supported by all modern browsers)
 * font-display: swap – show fallback text immediately, swap when ready.
 *
 * Path is relative to this file (assets/css/fonts.css).
 * WOFF2 → fonts/FCMinimal/
 */

@font-face {
    font-family: FC Minimal;
    src: url(./fonts/FCMinimal/font-FCMinimalThin.eot);
    src: url(./fonts/FCMinimal/font-FCMinimalThin.eot?#iefix) format("embedded-opentype"), url(./fonts/FCMinimal/font-FCMinimalThin.woff2) format("woff2"), url(./fonts/FCMinimal/font-FCMinimalThin.woff) format("woff"), url(./fonts/FCMinimal/font-FCMinimalThin.ttf) format("truetype");
    font-weight: 100;
    font-style: normal;
    font-display:swap
}

@font-face {
    font-family: FC Minimal;
    src: url(./fonts/FCMinimal/font-FCMinimalRegular.eot);
    src: url(./fonts/FCMinimal/font-FCMinimalRegular.eot?#iefix) format("embedded-opentype"), url(./fonts/FCMinimal/font-FCMinimalRegular.woff2) format("woff2"), url(./fonts/FCMinimal/font-FCMinimalRegular.woff) format("woff"), url(./fonts/FCMinimal/font-FCMinimalRegular.ttf) format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display:swap
}

@font-face {
    font-family: FC Minimal;
    src: url(./fonts/FCMinimal/font-FCMinimalMedium.eot);
    src: url(./fonts/FCMinimal/font-FCMinimalMedium.eot?#iefix) format("embedded-opentype"), url(./fonts/FCMinimal/font-FCMinimalMedium.woff2) format("woff2"), url(./fonts/FCMinimal/font-FCMinimalMedium.woff) format("woff"), url(./fonts/FCMinimal/font-FCMinimalMedium.ttf) format("truetype");
    font-weight: 500;
    font-style: normal;
    font-display:swap
}


 @font-face {
    font-family: FC Minimal;
    src: url(./fonts/FCMinimal/font-FCMinimalBold.eot);
    src: url(./fonts/FCMinimal/font-FCMinimalBold.eot?#iefix) format("embedded-opentype"), url(./fonts/FCMinimal/font-FCMinimalBold.woff2) format("woff2"), url(./fonts/FCMinimal/font-FCMinimalBold.woff) format("woff"), url(./fonts/FCMinimal/font-FCMinimalBold.ttf) format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display:swap
}

/*
 * Cman Theme – Base Stylesheet
 * Tailwind CSS is loaded via CDN; this file handles global overrides
 * and Tailwind Typography prose customisations.
 *
 * @package Cman
 *
 * │  CUSTOM COLOR PALETTES  (shade 500 = reference colour)              
 * │  iron        │ #777777  │ bg-iron-100 text-iron-800 ring-iron-400
 * │  snow        │ #FFFFFF  │ bg-snow-100 text-snow-800 ring-snow-400
 * │  navy        │ #193F78  │ bg-navy-50  text-navy-900
 * │  forest      │ #00522D  │ bg-forest-50 text-forest-900
 * │  jade        │ #388062  │ bg-jade-50   text-jade-900
 * │  seafoam     │ #77C3A4  │ bg-seafoam-50 text-seafoam-900
 * │  misty       │ #D2EBE1  │ bg-misty-50   text-misty-900
 * │  sapphire    │ #1B3564  │ bg-sapphire-50 text-sapphire-900
 *
 *  All palettes expose shades: 50 100 200 300 400 500 600 700 800 900 950
 *  Prefix with any Tailwind utility: bg- text- border- ring- from- to-
 *  divide- placeholder- shadow- decoration- outline- accent- fill- stroke-
 */

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

body {
    font-family: FC Minimal, ui-sans-serif, system-ui, sans-serif;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
}

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

/* WordPress Alignment Classes */
.alignleft  { float: left;  margin-right: 1.5rem; margin-bottom: 1rem; }
.alignright { float: right; margin-left:  1.5rem; margin-bottom: 1rem; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignwide  { max-width: 110%; margin-left: -5%; }
.alignfull  { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); }
.entry-content .alignfull,
.page-content .alignfull,
article .alignfull {
      width: 100vw !important;
      max-width: 100vw !important;
      margin-left: calc(50% - 50vw) !important;
      margin-right: calc(50% - 50vw) !important;
}


/* Skip Link */
.sr-only {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}
.sr-only:focus {
    all: unset;
}

/* Prose Overrides */
.entry-content a:not(.gm-btn, .gm-badge, .gm-btn-*, .text-*) {
    color: #C18300;  /* gold-500 */
}
.entry-content a:not(.gm-btn, .gm-badge, .gm-btn-*, .text-*) :hover {
    color: #A36B00; /* gold-600 */
}


/* WordPress Generated Classes */
.wp-caption { max-width: 100%; }
.wp-caption-text {
    font-size: 0.85rem;
    color: #6b7280;
    text-align: center;
    margin-top: 0.5rem;
}

/* Search Form */
.search-form {
    display: flex;
    gap: 0.5rem;
}
.search-field {
    flex: 1;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    outline: none;
    transition: border-color 0.2s;
}
.search-field:focus {
    border-color: #0ea5e9;
    box-shadow: 0 0 0 3px rgba(14,165,233,.2);
}
.search-submit {
    background: #0ea5e9;
    color: white;
    border: none;
    border-radius: 0.5rem;
    padding: 0.5rem 1.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}
.search-submit:hover { background: #0284c7; }

/* Pagination */
.cman-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin: 2.5rem 0;
  flex-wrap: wrap;
}

.cman-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0.5rem 0.75rem;
  border-bottom: 1.5px solid #fff;
  color: #16324a;
  font-size: 1rem;
  font-weight: 400;
  text-decoration: none;
  transition: all 0.25s ease;
}

/* Current Page */
.cman-pagination .page-numbers.current {
  border-color: var(--primary-color, #2f6b46);
}

/* Hover (except current page and dots) */
.cman-pagination a.page-numbers:hover {
  color: var(--btn-hover-color, #2f6b46);
}
.cman-pagination .prev,
.cman-pagination .next {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-size: 1rem;
  font-weight: 400;
  color: var(--btn-color, #2f6b46);
  text-decoration: none;
}

/* Previous / Next Buttons (using &larr; &rarr; as text) */
.cman-pagination .prev .prev-icon,
.cman-pagination .next .next-icon {
  font-weight: 700;
  color: #fff;
  background-color: var(--accent-color, #2f6b46);
  border-radius: 50%;
  border-color: transparent;
  margin-bottom: 0.5rem;
  padding: 0 0.75rem;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.cman-pagination .prev:hover,
.cman-pagination .next:hover {
  color: var(--btn-hover-color, #2f6b46);
}
.cman-pagination .prev:hover .prev-icon,
.cman-pagination .next:hover .next-icon {
    background-color: var(--btn-hover-color, #2f6b46);
}

/* Dots ... */
.cman-pagination .dots {
  border: none;
  background: transparent;
  color: #9aa5ac;
  pointer-events: none;
}

/* Responsive */
@media (max-width: 480px) {
  .cman-pagination .page-numbers {
    min-width: 34px;
    height: 34px;
    font-size: 0.8rem;
    padding: 0 0.5rem;
  }
}

/* CSS Custom Properties – Cman Brand Palettes
   These mirror the Tailwind config so colours are available in plain CSS.
   Usage in PHP/CSS: var(--gm-sienna-500), var(--gm-espresso-900), etc.
*/
:root {
    /* iron – 500: #777777 */
    --gm-iron-50:   #F5F5F5;
    --gm-iron-100:  #E0E0E0;
    --gm-iron-200:  #BDBDBD;
    --gm-iron-300:  #9E9E9E;
    --gm-iron-400:  #8A8A8A;
    --gm-iron-500:  #777777;
    --gm-iron-600:  #5E5E5E;
    --gm-iron-700:  #464646;
    --gm-iron-800:  #2E2E2E;
    --gm-iron-900:  #1A1A1A;
    --gm-iron-950:  #0D0D0D;

    /* snow – 500: #FFFFFF */
    --gm-snow-50:   #FFFFFF;
    --gm-snow-100:  #FAFAFA;
    --gm-snow-200:  #F5F5F5;
    --gm-snow-300:  #F0F0F0;
    --gm-snow-400:  #EBEBEB;
    --gm-snow-500:  #FFFFFF;
    --gm-snow-600:  #E8E8E8;
    --gm-snow-700:  #D4D4D4;
    --gm-snow-800:  #ADADAD;
    --gm-snow-900:  #858585;
    --gm-snow-950:  #5C5C5C;

    /* navy – 500: #193F78 */
    --gm-navy-50:   #EBF0F8;
    --gm-navy-100:  #C6D4EC;
    --gm-navy-200:  #9DB4DC;
    --gm-navy-300:  #6E8EC8;
    --gm-navy-400:  #4668A0;
    --gm-navy-500:  #193F78;
    --gm-navy-600:  #133060;
    --gm-navy-700:  #0D2248;
    --gm-navy-800:  #081630;
    --gm-navy-900:  #040C1C;
    --gm-navy-950:  #02060E;

    /* forest – 500: #00522D */
    --gm-forest-50:   #E6F4ED;
    --gm-forest-100:  #C0E3D1;
    --gm-forest-200:  #8FCBB0;
    --gm-forest-300:  #55AD87;
    --gm-forest-400:  #248056;
    --gm-forest-500:  #00522D;
    --gm-forest-600:  #004023;
    --gm-forest-700:  #002E19;
    --gm-forest-800:  #001D10;
    --gm-forest-900:  #000E08;
    --gm-forest-950:  #000704;

    /* jade – 500: #388062 */
    --gm-jade-50:   #EBF4F0;
    --gm-jade-100:  #C8E4D9;
    --gm-jade-200:  #9FCEBB;
    --gm-jade-300:  #72B498;
    --gm-jade-400:  #539A7C;
    --gm-jade-500:  #388062;
    --gm-jade-600:  #2C664E;
    --gm-jade-700:  #1F4C39;
    --gm-jade-800:  #133224;
    --gm-jade-900:  #091A13;
    --gm-jade-950:  #040D09;

    /* seafoam – 500: #77C3A4 */
    --gm-seafoam-50:   #F0FAF6;
    --gm-seafoam-100:  #D5F0E6;
    --gm-seafoam-200:  #B2E2D0;
    --gm-seafoam-300:  #A0D6C0;
    --gm-seafoam-400:  #8BCDB2;
    --gm-seafoam-500:  #77C3A4;
    --gm-seafoam-600:  #5A9C82;
    --gm-seafoam-700:  #3E7060;
    --gm-seafoam-800:  #24433A;
    --gm-seafoam-900:  #10211C;
    --gm-seafoam-950:  #08110E;

    /* misty – 500: #D2EBE1 */
    --gm-misty-50:   #F8FCFA;
    --gm-misty-100:  #F0F8F5;
    --gm-misty-200:  #E6F4EE;
    --gm-misty-300:  #DCEEE7;
    --gm-misty-400:  #D9EDE4;
    --gm-misty-500:  #D2EBE1;
    --gm-misty-600:  #A8CCBA;
    --gm-misty-700:  #73A08A;
    --gm-misty-800:  #435F52;
    --gm-misty-900:  #222F29;
    --gm-misty-950:  #111814;

    /* sapphire – 500: #1B3564 */
    --gm-sapphire-50:   #ECF0F8;
    --gm-sapphire-100:  #C9D4EC;
    --gm-sapphire-200:  #A0B4DC;
    --gm-sapphire-300:  #7090C8;
    --gm-sapphire-400:  #4562A0;
    --gm-sapphire-500:  #1B3564;
    --gm-sapphire-600:  #152A50;
    --gm-sapphire-700:  #0F1E3C;
    --gm-sapphire-800:  #091228;
    --gm-sapphire-900:  #040918;
    --gm-sapphire-950:  #02040C;

    /* Custom Variables for Cman Theme */
    --gm-header-h: 64px; /* default header height (desktop) */
    --gm-topbar-h: 36px; /* default top bar height (desktop) */
    
    /* Container max width for content alignment */
    --container-max-width: 1200px;
    --col-gap: 3rem; 
    --mobile-pad: 1.5rem;
}


/* Sticky Header */
/* Sticky header base – uses fixed positioning so it can animate off-screen */
.gm-header {
    transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Applied by JS when user scrolls down */
.gm-header--hidden {
    transform: translateY(-100%);
}

.gm-header.gm-header--scrolled{
    background: rgba(255, 255, 255, 1);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    padding-top: 0!important;
}
body.home .gm-header.gm-header--at-top .menu-item > a > span,
body.cman-has-hero .gm-header.gm-header--at-top .menu-item > a > span {
    color: #fff!important;
}
body.home .gm-header.gm-header--at-top #gm-search-toggle svg,
body.home .gm-header.gm-header--at-top #gm-nav-modal-toggle svg,
body.cman-has-hero .gm-header.gm-header--at-top #gm-search-toggle svg,
body.cman-has-hero .gm-header.gm-header--at-top #gm-nav-modal-toggle svg {
    stroke: #fff!important;
}

body.cman-has-hero .gm-header.gm-header--at-top .gm-submenu-toggle svg,
body.home .gm-header.gm-header--at-top .gm-submenu-toggle svg {
    stroke: #fff!important;
}

/* Header Logo left (desktop) */
.gm-header--logo-left .gm-header__logo img {
    max-height: 70px;
    width: auto;
}

/* */
@media (max-width: 990px) {
    .gm-header--logo-center.gm-header--at-top {
        padding-top: 0!important;
    }
}

/* Base state – height comes from the h-24 Tailwind class already on
   .gm-header__logo-row in header.php (96px); we only add the
   transition here so the shrink below can animate smoothly. */
.gm-header--logo-left .gm-header__logo-row {
    transition: height .3s ease;
}
/* .gm-header--logo-left .gm-header__logo img {
    opacity: 0;
    animation: logoPop 0.8s ease forwards;
} */ 

/* Applied by JS (adds .gm-header--scrolled) once the user scrolls
   past the offset – shrinks the logo row to 65px and zooms the logo
   down to match */
.gm-header--logo-left.gm-header--scrolled .gm-header__logo-row {
    height: 85px;
}
.gm-header--logo-left.gm-header--scrolled .gm-header__logo img {
    transform: scale(.65); /* zoom effect when collapsed */
    max-width: 120px;
    max-height: 55px;
}

/* Hide the secondary desktop-nav row (border included) when logo is
   centered, based on scroll direction – see .gm-header__nav-row in
   header.php */
.gm-header--logo-left .gm-header__nav-row {
    transition: opacity .25s ease, transform .25s ease;
}
.gm-header--logo-left .gm-header__nav-row.gm-menu--hidden {
    opacity: 0;
    transform: translateY(-8px);
    pointer-events: none;
    height: 12px;
}

/* Header Logo centering (desktop) */
.gm-header--logo-center .gm-header__logo img {
    max-width: none;
    width: auto;
    max-height: 70px;
}

/* Base state – height comes from the h-24 Tailwind class already on
   .gm-header__logo-row in header.php (96px); we only add the
   transition here so the shrink below can animate smoothly. */
.gm-header--logo-center .gm-header__logo-row {
    transition: height .3s ease;
}
.gm-header--logo-center .gm-header__logo img {
    opacity: 0;
    animation: logoPop 0.8s ease forwards;
}

/* Applied by JS (adds .gm-header--scrolled) once the user scrolls
   past the offset – shrinks the logo row to 65px and zooms the logo
   down to match */
.gm-header--logo-center.gm-header--scrolled .gm-header__logo-row {
    height: 85px;
}
.gm-header--logo-center.gm-header--scrolled .gm-header__logo img {
    transform: scale(.65); /* zoom effect when collapsed */
    max-width: none;
    width: auto;
    max-height: 70px;
    margin-top: 8px;
}

/* Hide the secondary desktop-nav row (border included) when logo is
   centered, based on scroll direction – see .gm-header__nav-row in
   header.php */
.gm-header--logo-center .gm-header__nav-row {
    transition: opacity .25s ease, transform .25s ease;
}
.gm-header--logo-center .gm-header__nav-row.gm-menu--hidden {
    opacity: 0;
    transform: translateY(-8px);
    pointer-events: none;
    height: 12px;
}

/* 
   Shrink the logo row and zoom the logo down when the user scrolls
   past the offset (see header.js). This is only applied when the logo
   is centered, so it doesn't affect left-aligned logos. */

@keyframes logoPop {

    0% {
        opacity: 0;
        transform: scale(1.6);
    }

    60% {
        opacity: 1;
        transform: scale(1.08);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }

}

/* Offset page content so it doesn't sit behind the fixed header */
body:not(.cman-has-hero, .home) {
    padding-top: calc(var(--gm-header-h, 64px) + var(--gm-topbar-h, 36px));
}

/* Floating CTA Widget (bottom-right, above back-to-top) */

.gm-cta-float {
    position: fixed;
    /* sit just above the back-to-top button (bottom-6 = 24px, h-10 = 40px, gap 10px) */
    bottom: 82px;
    right: 20px;
    z-index: 9000;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}

/* Collapsible list */
.gm-cta-list {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    /* collapsed */
    max-height: 0;
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
    transition:
        max-height 0.32s cubic-bezier(0.4,0,0.2,1),
        opacity    0.28s ease,
        transform  0.28s ease;
}

/* open state — toggled by JS adding .is-open to .gm-cta-float */
.gm-cta-float.is-open .gm-cta-list {
    max-height: 600px;   /* large enough for all buttons */
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

/* Each button pill */
.gm-cta-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 100px;
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
    color: var( --btn-color, #000);
    background: #fff;
    box-shadow: 0 4px 20px rgba(0,0,0,.18);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
    white-space: nowrap;
    cursor: pointer;
    border: none;
    line-height: 1;
}
.gm-cta-btn:hover {
    transform: translateY(-2px) scale(1.03);
    box-shadow: 0 8px 28px rgba(0,0,0,.22);
    color: #fff;
}
.gm-cta-btn svg {
    flex-shrink: 0;
}

/* Toggle button */
.gm-cta-toggle {
    padding: 12px 12px;
    font-size: 0.9rem;
    transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.gm-cta-toggle:hover {
    transform: translateY(-2px) scale(1.03);
    box-shadow: 0 8px 28px rgba(0,0,0,.22);
}

.gm-cta-btn.gm-cta-toggle svg {
    fill: #fff;
    color: #fff;
}
/* swap icons based on open state */
.gm-cta-toggle .gm-cta-icon-close { display: none; }
.gm-cta-float.is-open .gm-cta-toggle .gm-cta-icon-open  { display: none; }
.gm-cta-float.is-open .gm-cta-toggle .gm-cta-icon-close { display: block; color:#fff; }

/* Colours */
.gm-cta-phone:hover { background: var(--btn-hover-color); }
.gm-cta-line:hover  { background: #06c755; }
.gm-cta-fb:hover    { background: #1877F2; }
.gm-cta-ig:hover    { background: linear-gradient(135deg,#F58529,#DD2A7B,#8134AF,#515BD4); }
.gm-cta-yt:hover    { background: #FF0000; }
.gm-cta-tt:hover    { background: #010101; }

/* Mobile */
@media (max-width: 640px) {
    .gm-cta-float {
        bottom: 76px;
        gap: 8px;
    }
    .gm-cta-btn {
        padding: 11px;
        border-radius: 50%;
    }
    .gm-cta-label {
        display: none;
    }
    .gm-cta-toggle {
        padding: 12px;
    }
}

/* admin-bar */
.gm-header.admin-bar-show {
   top: 32px;
}
@media (max-width: 782px) {
 .gm-header.admin-bar-show {
      top: 46px;
 }
}

/* Top Bar (above header) — phone (left) + custom menu (right) */
.gm-topbar {
    position: fixed;
    top: 0;
    inset-inline: 0;
    z-index: 41; /* above header so it stays visible while header can hide on scroll */
    height: 36px;
    background: #00522D;
    color: #fff;
    font-size: .75rem;
    line-height: 1;
}

.gm-topbar__left,
.gm-topbar__right { display: flex; align-items: center; height: 100%; }

.gm-topbar__phone {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    color: #fff;
    text-decoration: none;
    font-weight: 500;
    letter-spacing: .01em;
    opacity: .95;
    transition: opacity .2s ease;
}
.gm-topbar__phone:hover { opacity: 1; text-decoration: underline; }

.gm-topbar__menu {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    list-style: none;
    margin: 0;
    padding: 0;
}
.gm-topbar__menu a {
    color: #fff;
    text-decoration: none;
    opacity: .9;
    font-weight: 500;
    transition: opacity .2s ease;
}
.gm-topbar__menu a:hover { opacity: 1; text-decoration: underline; }

/* Push header (and its own admin-bar offset) down by the top bar's height
   when the top bar is enabled. */
.gm-header.gm-header--has-topbar {
    top: 36px;
}
.gm-header.gm-header--has-topbar.admin-bar-show {
    top: calc(36px + 32px);
}
@media (max-width: 782px) {
    .gm-header.gm-header--has-topbar.admin-bar-show {
        top: calc(36px + 46px);
    }
}

/* Top bar itself must also respect the WP admin bar offset */
.gm-topbar.admin-bar-show { top: 32px; }
@media (max-width: 782px) {
    .gm-topbar.admin-bar-show { top: 46px; }
}

@media (max-width: 640px) {
    .gm-topbar { height: auto; padding: .5rem 0; }
    .gm-topbar .max-w-7xl { flex-direction: column; gap: .375rem; align-items: flex-start; }
    .gm-topbar__menu { flex-wrap: wrap; gap: .75rem; }
}

/* Anchor offset — prevents fixed header from covering scroll targets */
#about,
#blog,
#promotion,
#review,
#service {
    scroll-margin-top: calc(var(--gm-header-h, 64px) + 12px);
}

/* Scrollspy — active nav link highlight */
/* Active anchor link in desktop + mobile nav */
#site-navigation a.gm-nav-active,
#mobile-menu a.gm-nav-active {
    color: var(--gm-gold, #C18300);
    font-weight: 700;
}

/* Animated underline bar */
#site-navigation a.gm-nav-active > span,
#mobile-menu a.gm-nav-active > span {
    background-image: linear-gradient(90deg, var(--gm-gold, #C18300), var(--gm-gold, #C18300));
    background-repeat: no-repeat;
    background-size: 100% 2px;
    background-position: 0 100%;
}

/* Desktop: underline appears via a bottom border on the <li> */
#site-navigation li.gm-nav-active > a > span {
    background-image: linear-gradient(90deg, var(--gm-gold, #C18300), var(--gm-gold, #C18300));
    background-repeat: no-repeat;
    background-size: 100% 2px;
    background-position: 0 100%;
    padding-bottom: 2px;
}

/* Mobile: left accent bar */
#mobile-menu li.gm-nav-active {
    border-left: 3px solid var(--gm-gold, #C18300);
    padding-left: 8px;
}

/* Desktop Dropdown Sub-menus (#site-navigation)
   Hidden by default, revealed on hover / focus / click-toggle.
   Supports 3 levels: top-level -> sub-menu -> sub-menu (flyout). */
#site-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#site-navigation > ul > li,
#site-navigation .sub-menu li {
    position: relative;
}

/* Parent item: link + caret toggle sit inline together */
#site-navigation .menu-item-has-children > a {
    display: inline-flex;
    align-items: center;
}

.gm-submenu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.1rem;
    height: 1.1rem;
    margin-left: 0.25rem;
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
    color: inherit;
    flex-shrink: 0;
}

.gm-submenu-caret {
    width: 0.6rem;
    height: 0.6rem;
    transition: transform 0.2s ease;
}

/* Nested (level 2+) carets point right by default, since their panel flies out sideways */
#site-navigation .sub-menu .gm-submenu-caret {
    transform: rotate(-90deg);
}

#site-navigation > ul > li.menu-item-has-children:hover > .gm-submenu-toggle .gm-submenu-caret,
#site-navigation > ul > li.menu-item-has-children.gm-submenu-open > .gm-submenu-toggle .gm-submenu-caret {
    transform: rotate(180deg);
}
#site-navigation .sub-menu li.menu-item-has-children:hover > .gm-submenu-toggle .gm-submenu-caret,
#site-navigation .sub-menu li.menu-item-has-children.gm-submenu-open > .gm-submenu-toggle .gm-submenu-caret {
    transform: rotate(90deg);
}

/* Level-1 dropdown panel */
#site-navigation > ul > li > .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 0;
    min-width: 14rem;
    background: #fff;
    border-radius: 0.75rem;
    box-shadow: 0 12px 32px -8px rgba(0, 0, 0, 0.15), 0 4px 12px -4px rgba(0, 0, 0, 0.08);
    padding: 0.4rem;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(6px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
    z-index: 60;
}

/* Level-2 and Level-3 panels fly out to the right of their parent item */
#site-navigation .sub-menu .sub-menu {
    top: -0.4rem;
    left: 100%;
    margin-top: 0;
    margin-left: 0.375rem;
    z-index: 61;
}

/* Reveal on hover, keyboard focus, or click-toggle — at every level */
#site-navigation .menu-item-has-children:hover > .sub-menu,
#site-navigation .menu-item-has-children:focus-within > .sub-menu,
#site-navigation .menu-item-has-children.gm-submenu-open > .sub-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

#site-navigation .sub-menu li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.55rem 0.75rem;
    border-radius: 0.5rem;
    white-space: nowrap;
    text-decoration: none;
    transition: background-color 0.15s ease;
}

#site-navigation .sub-menu li a span {
    font-weight: 400;
    color: #374151!important;
}

#site-navigation .sub-menu li a:hover,
#site-navigation .sub-menu li.gm-submenu-open > a {
    background-color: #f9fafb;
}

#site-navigation .sub-menu li a:hover span,
#site-navigation .sub-menu li.gm-submenu-open > a span {
    color: #111827;
}
/* remove border top */
.header-none-shabow #site-navigation {
    border-top: none!important;
}

/* Modal (mobile) — indent a 3rd nesting level so it stays visually distinct */
.gm-nav-modal__list .sub-menu .sub-menu {
    margin: 0.125rem 0 0.375rem;
    padding-left: 0.85rem;
    border-left-color: rgba(255, 255, 255, 0.08);
}
.gm-nav-modal__list .sub-menu .sub-menu li a {
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.5);
}
.gm-nav-modal__list .sub-menu .sub-menu li a:hover {
    color: #fff;
}

/* Nav-modal active links */
#gm-nav-modal .gm-nav-modal__list a.gm-nav-active {
    color: var(--gm-gold, #C18300);
}

/* Prevent body scroll while modal is open */
body.gm-modal-open {
    overflow: hidden;
}

/* Mobile menu toggle icon swap */
.gm-hamburger,
#menu-toggle {
    position: relative;
}

.gm-hamburger .gm-menu-toggle__icon,
#menu-toggle .gm-menu-toggle__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.gm-hamburger .gm-menu-toggle__icon--close,
#menu-toggle .gm-menu-toggle__icon--close {
    position: absolute;
    inset: 0;
    opacity: 0;
    transform: scale(0.85) rotate(-12deg);
}

.gm-hamburger[aria-expanded="true"] .gm-menu-toggle__icon--open,
#menu-toggle[aria-expanded="true"] .gm-menu-toggle__icon--open {
    opacity: 0;
    transform: scale(0.85) rotate(12deg);
}

.gm-hamburger[aria-expanded="true"] .gm-menu-toggle__icon--close,
#menu-toggle[aria-expanded="true"] .gm-menu-toggle__icon--close {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}

/* Loading Wrap Screen */
#gm-loading-wrap {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    transition: opacity 0.5s ease, visibility 0.5s ease;
}

#gm-loading-wrap.gm-loading--hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.gm-loading-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
}

.gm-loading-logo {
    width: 120px;
    height: auto;
    object-fit: contain;
    animation: gm-logo-pulse 1.8s ease-in-out infinite;
}

@keyframes gm-logo-pulse {
    0%, 100% { opacity: 1;   transform: scale(1);    }
    50%       { opacity: .7; transform: scale(0.95); }
}

/* Three-dot spinner */
.gm-loading-spinner {
    display: flex;
    gap: 8px;
    align-items: center;
}

.gm-loading-spinner span {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--primary-color, #C18300);
    animation: gm-dot-bounce 1.2s ease-in-out infinite;
}

.gm-loading-spinner span:nth-child(2) { animation-delay: 0.2s; }
.gm-loading-spinner span:nth-child(3) { animation-delay: 0.4s; }

@keyframes gm-dot-bounce {
    0%, 80%, 100% { transform: translateY(0);    opacity: .4; }
    40%           { transform: translateY(-10px); opacity: 1;  }
}

/* Header Layout — Logo Center */

/* The secondary nav row (.gm-header__nav-row, wraps #site-navigation)
   hides on scroll-down and reveals on scroll-up independently of the
   header itself — see main.js and the .gm-header__nav-row rules above. */

/* Full-Screen Navigation Modal  (#gm-nav-modal) */

/* Overlay */
.gm-nav-modal {
    position: fixed;
    inset: 0;
    z-index: 9000;
    background: var(--primary-color, #1B3564); /* dark warm espresso */
    overflow-y: auto;
    /* Closed state */
    opacity: 0;
    visibility: hidden;
    transform: translateY(-12px);
    transition:
        opacity    0.3s cubic-bezier(0.4, 0, 0.2, 1),
        visibility 0.3s cubic-bezier(0.4, 0, 0.2, 1),
        transform  0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.gm-nav-modal.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Close button */
.gm-nav-modal__close {
    position: fixed;
    top: 1.25rem;
    right: 1.25rem;
    z-index: 10;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s ease;
}
.gm-nav-modal__close:hover  { background: rgba(255, 255, 255, 0.20); }
.gm-nav-modal__close:focus  { outline: 0; outline-offset: 0; }

/* Admin-bar offset for the close button */
.admin-bar .gm-nav-modal__close        { top: calc(1.25rem + 32px); }
.admin-bar .gm-search-modal__close { top: calc(1.25rem + 32px); }
@media (max-width: 782px) {
    .admin-bar .gm-nav-modal__close    { top: calc(1.25rem + 46px); }
    .admin-bar .gm-search-modal__close { top: calc(1.25rem + 46px); }

}

/* Inner container */
.gm-nav-modal__inner {
    max-width: 80rem;
    margin: 0 auto;
    padding: 5.5rem 1.5rem 3rem;
    width: 100%;
    min-height: 100%;
}

/* 2-column grid */
.gm-nav-modal__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
}
@media (min-width: 1024px) {
    .gm-nav-modal__grid {
        grid-template-columns: 1fr 1fr;
        gap: 6rem;
    }
}

/* Left column — main menu */
.gm-nav-modal__eyebrow {
    color: #fff;
    font-size: 1.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 1.75rem;
}

.gm-nav-modal__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.gm-nav-modal__list > li > a {
    display: block;
    color: #fff;
    font-size: clamp(1.375rem, 3.5vw, 2.25rem);
    font-weight: 400;
    line-height: 1.3;
    text-decoration: none;
    padding: 0.35rem 0;
    transition: color 0.2s ease, transform 0.2s ease;
}
.gm-nav-modal__list > li > a:hover {
    color: rgba(255, 255, 255, 0.65);
    transform: translateX(0.5rem);
}

/* Sub-menu */
.gm-nav-modal__list .sub-menu {
    list-style: none;
    margin: 0.25rem 0 0.5rem;
    padding: 0 0 0 1rem;
    border-left: 2px solid rgba(255, 255, 255, 0.15);
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}
.gm-nav-modal__list .sub-menu li a {
    display: block;
    color: rgba(255, 255, 255, 1);
    font-size: 1.25rem;
    font-weight: 400;
    text-decoration: none;
    padding: 0.25rem 0;
    transition: color 0.2s ease;
}

.gm-nav-modal__list .sub-menu li a:hover { color: #fff; transform: translateX(0.5rem); }

/* Scrollspy active state */
#gm-nav-modal .gm-nav-modal__list > li.gm-nav-active > a,
#gm-nav-modal .gm-nav-modal__list a.gm-nav-active {
    color: var(--gm-gold, #C18300);
}

/* Right column — contact info */
.gm-nav-modal__right {
    padding-top: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
@media (min-width: 1024px) {
    .gm-nav-modal__right {
        border-top: none;
        padding-top: 2.75rem; /* align with menu start (below eyebrow) */
    }
}

.gm-nav-modal__contact-heading {
    color: #fff;
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 0;
}

.gm-nav-modal__contact-tagline {
    color: rgba(255, 255, 255, 0.85);
    font-size: 1.25rem;
    line-height: 1.65;
    margin: 0;
}

/* Contact list (phone, LINE, etc.) */
.gm-nav-modal__contact-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}
.gm-nav-modal__contact-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    color: rgba(255, 255, 255, 0.75);
    font-size: 1rem
}
.gm-nav-modal__contact-list li svg {
    flex-shrink: 0;
    margin-top: 2px;
    color: rgba(255, 255, 255, 0.9);
}
.gm-nav-modal__contact-list li a {
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
    transition: color 0.2s ease;
}
.gm-nav-modal__contact-list li a:hover { color: #fff; }


.gm-nav-modal__footer-menu {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding-top: 1.5rem;
}
.gm-nav-modal__footer-menu a {
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
    font-size: 0.875rem;
    transition: color 0.2s ease;
}
.gm-nav-modal__footer-menu a:hover { color: #fff; }


/* Social icon buttons */
.gm-nav-modal__social {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.625rem;
    margin-top: 1.5rem;
}
.gm-nav-modal__social-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: #fff;
    text-decoration: none;
    transition: background 0.2s ease;
}
.gm-nav-modal__social-btn:hover  { background: rgba(255, 255, 255, 0.20); }
.gm-nav-modal__social-btn svg    { width: 1.0625rem; height: 1.0625rem; }

/* CTA pill button */
.gm-nav-modal__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.75rem;
    background: var(--btn-color, #C18300);
    color: #fff;
    border-radius: 9999px;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s ease;
    align-self: flex-start;
}
.gm-nav-modal__cta:hover  { background: var(--btn-hover-color, #a36b00); color: #fff; }

/* Search Modal */
.gm-search-modal {
    position: fixed;
    inset: 0;
    z-index: 9100;
    background: #fff;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
}
.gm-search-modal.is-open {
    opacity: 1;
    pointer-events: all;
}
.gm-search-modal__close {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    width: 2.5rem;
    height: 2.5rem;
    border: none;
    color: var(--btn-color, #C18300);
    border-radius: 9999px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.375rem;
    line-height: 1;
    transition: background 0.2s;
}
.gm-search-modal__close:hover { border-color: var(--btn-hover-color, #a36b00);; background: rgba(193, 131, 0, 0.08); }
.gm-search-modal__inner {
    width: 100%;
    max-width: 640px;
    text-align: center;
}
.gm-search-modal__label {
    display: block;
    color: rgba(56, 128, 98, 0.55);
    font-size: 0.875rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 1.25rem;
}
.gm-search-modal__form {
    position: relative;
    align-items: center;
    border-bottom: 2px solid rgba(255, 255, 255, 0.30);
    transition: border-color 0.2s;
}
.gm-search-modal__form:focus-within {
    border-color: var(--btn-hover-color, #2f6b46);
}
.gm-search-modal__input {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    color: var(--btn-color, #388062);
    font-size: clamp(1.25rem, 4vw, 2rem);
    padding: 0.75rem 0;
    caret-color: var(--btn-color, #388062);
    border-bottom: 2px solid var(--btn-hover-color, #388062);
}
.gm-search-modal__input::placeholder {
    color: rgba(56, 128, 98, 0.30);
}
.gm-search-modal__submit {
    background: transparent;
    border: none;
    color: var(--btn-color, #388062);
    cursor: pointer;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    transition: color 0.2s;
}
.gm-search-modal__submit:hover { color: var(--btn-hover-color, #2f6b46); }
.gm-search-modal__submit svg {
    width: 1.5rem;
    height: 1.5rem;
}

/* Site Footer  (.gm-footer) */
.gm-footer {
    color: #fff;
    background-color: var(--primary-color, #1B3564);
    background-size: cover;
    background-position: left center;
}

.gm-footer__inner {
    max-width: 80rem;
    margin: 0 auto;
    padding: 3rem 1.5rem 2rem;
}

@media (min-width: 640px)  { .gm-footer__inner { padding: 4rem 2rem 2.5rem; } }
@media (min-width: 1024px) { .gm-footer__inner { padding: 5rem 3rem 3rem; } }

/* Main 2-column grid */
.gm-footer__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
    margin-bottom: 3rem;
}

@media (min-width: 1024px) {
    .gm-footer__grid {
        grid-template-columns: 1fr 1fr;
        gap: 4rem;
    }
}

/* Left brand col */
.gm-footer__logo { display: inline-block; margin-bottom: 1.25rem; }
.gm-footer__logo-img { height: 3.5rem; width: auto; }
.gm-footer__site-name {
    display: block;
    font-size: 1.25rem;
    font-weight: 700;
    color: #fff;
    text-decoration: none;
    margin-bottom: 1.25rem;
}

.gm-footer__company {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}
.gm-footer__company-name {
    font-size: 1.125rem;
    font-weight: 700;
    color: #fff;
    margin: 0;
    letter-spacing: 0.02em;
}
.gm-footer__company-sub {
    color: rgba(255,255,255,0.45);
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    margin: 0;
}

.gm-footer__contact-info {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.gm-footer__contact-row {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
}

.gm-footer__contact-icon {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.gm-footer__contact-link {
    text-decoration: none;
    transition: color 0.2s;
}
.gm-footer__contact-link:hover {
    text-decoration: underline;
 }

/* Social row */
.gm-footer__social {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.gm-footer__social-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 9999px;
    background: rgba(255,255,255,0.08);
    color: #fff;
    text-decoration: none;
    transition: background 0.2s;
}
.gm-footer__social-btn:hover { background: rgba(255,255,255,0.18); }
.gm-footer__social-btn svg { width: 1rem; height: 1rem; }

/* Right col */
.gm-footer__right {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

/* Standards block */
.gm-footer__standards {
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255,255,255,0.10);
}

.gm-footer__standards-heading {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: rgba(255,255,255,0.55);
    margin: 0 0 0.375rem;
}

.gm-footer__standards-sub {
    color: rgba(255,255,255,0.40);
    font-size: 0.75rem;
    margin: 0 0 1.25rem;
    line-height: 1.5;
}

.gm-footer__standards-logos {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.5rem 2rem;
}

.gm-footer__standards-logos img {
    height: 3rem;
    width: auto;
    object-fit: contain;
    filter: brightness(0) invert(1);
    opacity: 0.55;
    transition: opacity 0.3s;
}

.gm-footer__standards-logos img:hover { opacity: 1; }

/* Menus 2-col */
.gm-footer__menus {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}

.gm-footer__menu-title {
    font-size: 1rem;
    font-weight: 400;
    letter-spacing: 0.1em;
    color: rgba(255,255,255,0.55);
    margin: 0 0 1.25rem;
}

.gm-footer__menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.gm-footer__menu-list li { margin: 0; }

.gm-footer__menu-list a {
    text-decoration: none;
    font-size: 1rem;
    transition: color 0.2s;
}
.gm-footer__menu-list a:hover { 
    text-decoration: underline;
}

/* Bottom bar */
.gm-footer__bottom {
    border-top: 1px solid rgba(255,255,255,0.10);
    padding-top: 2rem;
}

.gm-footer__copy {
    color: rgba(255,255,255,0.35);
    font-size: 0.75rem;
    margin: 0;
    text-align: center;
}

@media (min-width: 640px) { .gm-footer__copy { text-align: left; } }


/* cman-hero-breadcrumbs */
.cman-hero-breadcrumbs {
  width: 100%;
  overflow: hidden;
}

.cman-hero-breadcrumbs nav {
  flex-wrap: nowrap !important; 
}

.cman-hero-breadcrumbs nav > * {
  flex-shrink: 0; 
}

.cman-hero-breadcrumbs nav .truncate {
  flex-shrink: 1 !important;
  min-width: 0; 
}

/* cman-breadcrumbs */
.cman-breadcrumbs {
  flex-wrap: nowrap !important; 
  width: 100%;
}

.cman-breadcrumbs > * {
  flex-shrink: 0; 
}

.cman-breadcrumbs .truncate {
  flex-shrink: 1 !important;
  min-width: 0; 
}

/* Default Button */
.text-primary-color {
    color: var(--primary-color, #388062);
}
.bg-btn-color {
    background-color: var(--btn-color, #388062);
}
.bg-btn-hover-color {
    background-color: var(--btn-hover-color, #2f6b46);
}
.accent-color {
    color: var(--accent-color, #388062);
}
.bg-accent-color {
    background-color: var(--accent-color, #388062);
} 
.bg-accent-hover-color {
    background-color: var(--hover-color, #2f6b46);
}
.hover-color {
    color: var(--hover-color, #388062);
}
.bg-hover-color {
    background-color: var(--hover-color, #2f6b46);
}
.bg-soft-color {
    background-color: var(--soft-color, #f5f5f5);
}
.border-primary-color {
    border: 1px solid var(--primary-color, #388062);
}
.btn-accent-color {
    background-color: var(--accent-color, #388062);
}
.btn-accent-color:hover {
    background-color: var(--hover-color, #2f6b46);
    cursor: pointer;
}
.pointer:hover {
    cursor: pointer;
}

/* Share Buttons */

.dman-share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    transition: opacity .2s, transform .1s;
}
.dman-share-btn:hover { opacity: .9; transform: scale(1.08); }



/* Button Read More Color */
.gm-btn-readmore {
  position: relative;
  display: inline-flex;
  width: max-content;
  padding: .6rem .8rem;
  border-bottom: 1px solid var(--btn-color, #388062); 
  color: var(--btn-color, #388062);
  background-color: transparent;
  overflow: hidden;
  z-index: 0;
  text-decoration: none;
  transition: color 0.05s ease;
}

.gm-btn-readmore::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: var(--btn-color, #388062);
  z-index: -1;
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 0.35s ease; 
} 

.gm-btn-readmore:hover::before {
  transform: scaleY(1);
}

.gm-hover-readmore:hover .gm-btn-readmore,
.gm-btn-readmore:hover {
  color: #fff!important;
}
.gm-hover-readmore:hover .gm-btn-readmore::before,
.gm-btn-readmore:hover::before {
  transform: scaleY(1);
}

/* Button Read More White */
.gm-btn-readmore-white {
  position: relative;
  display: inline-flex;
  width: max-content;
  padding: .6rem .8rem;
  border-bottom: 1px solid #ffffff; 
  color: #ffffff;
  background-color: transparent;
  overflow: hidden;
  z-index: 0;
  text-decoration: none;
  transition: color 0.05s ease;
}

.gm-btn-readmore-white::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #ffffff;
  z-index: -1;
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 0.35s ease; 
}

.gm-btn-readmore-white:hover::before {
  transform: scaleY(1);
}
.gm-hover-readmore:hover .gm-btn-readmore-white,
.gm-btn-readmore-white:hover {
  color: var(--btn-color, #388062)!important;
}
.gm-hover-readmore:hover .gm-btn-readmore-white::before,
.gm-btn-readmore-white:hover::before {
  transform: scaleY(1);
}

/* cman-title-page 
   text-3xl md:text-5xl
*/
.cman-title-page {
    font-size: 1.875rem;
    line-height: 2.25rem;
}
@media (min-width: 768px) {
    .cman-title-page {
        font-size: 3rem;
        line-height: 1;;
    }
}

/* Main Content */
#main-content {
    background-color:#f5f5f5!important ;
    overflow: hidden;
}
#main-content.cm-article-page {
    background-color:#ffffff!important ;
}

/* Select Style */
.gm-select-wrapper {
    position: relative;
    user-select: none;
    width: 280px; 
    font-family: FC Minimal, sans-serif;
}
@media (max-width: 768px) {
    .gm-select-wrapper {
        width: 100%; 
    }
    .archive-search-form {
        width: 100%;
    }
}

.gm-select-wrapper select {
    display: none;
}

.gm-select-trigger {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    font-size: 14px;
    font-weight: 400;
    color: #374151;
    background-color: #ffffff;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
}

.gm-select-trigger:hover {
    border-color: #9ca3af;
}

.gm-select-trigger {
    position: relative;
    display: flex;
    align-items: center;
    padding: 14px 50px 14px 16px;
    font-size: 14px;
    font-weight: 400;
    color: #374151;
    background-color: #ffffff;
    border: 0;
    border-radius: 8px;
    cursor: pointer;
    overflow: hidden;
    transition: all 0.2s;
}

.gm-select-trigger:hover {
    border-color: var(--btn-hover-color, #388062);
}

.gm-select-trigger::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 100%;
    background-color: var(--accent-color, #388062);
    border-left: 1px solid var(--accent-color, #388062); 
    
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px;
    
    transition: background-color 0.2s ease; 
}

.gm-select-wrapper.open .gm-select-trigger {
    border-color: var(--btn-hover-color, #388062); 
    box-shadow: 0 0 0 1px var(--btn-hover-color, #388062);
}

.gm-select-wrapper.open .gm-select-trigger::after {
    background-color: var(--btn-color, #388062);
    border-left-color: var(--btn-color, #388062);
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='18 15 12 9 6 15'%3e%3c/polyline%3e%3c/svg%3e");
}

.gm-options {
    position: absolute;
    top: 110%;
    left: 0;
    right: 0;
    background: #ffffff;
    border: 1px solid var(--btn-color, #388062);
    border-radius: 8px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-10px);
    transition: all 0.3s ease;
    z-index: 999;
    max-height: 250px;
    overflow-y: auto;
    padding: 0;
    margin: 0;
    list-style: none;
}

.gm-select-wrapper.open .gm-options {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.gm-option {
    padding: 10px 16px;
    font-size: 14px;
    color: #4b5563;
    cursor: pointer;
    transition: background 0.2s;
}

.gm-option:hover {
    background-color: var(--btn-hover-color, #77C3A4);
    color: #ffffff;
}

.gm-option.selected {
    background-color: var(--btn-color, #388062);
    color: #fff;
    font-weight: 500;
}

/* Background Zoom Effect */
.bg-zoom {
    position: relative;
    overflow: hidden; 
    text-align: center;
}

.bg-zoom > img {
    width: 92%!important;
    height: 100%;
    margin-left: auto!important;
    margin-right: auto!important;
    object-fit: cover; 
}


/* content-left, content-right in two columns */
.content-left, .content-right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 1rem;

}
.content-left {
    padding-left: max(20px, (100vw - var(--container-max-width)) / 2);
    align-items: flex-start;
}

.content-right {
    padding-right: max(20px, (100vw - var(--container-max-width)) / 2);
    max-width: 675px;
    align-items: flex-start;
}

/* content-left, content-right in two full columns */
@media (min-width: 990px) {
    /* เอา > .wp-block-group__inner-container ออกทั้งหมด */
    .transpose-columns > .wp-block-columns {
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 0 !important;
        margin-top: 0 !important;
        display: flex;
        flex-wrap: nowrap;
        gap: 0 !important; 
    }

    .transpose-columns > .wp-block-columns > .wp-block-column {
        width: 50% !important;
        flex-basis: 50% !important;
        margin: 0 !important;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    /* สลับคอลัมน์ซ้ายขวาในแถวคู่ */
    .transpose-columns > .wp-block-columns:nth-child(even) {
        flex-direction: row-reverse;
    }

    /* Image Column 1 */
    .transpose-columns > .wp-block-columns > .wp-block-column:first-child {
        padding: 0 !important;
    }

    /* Content Column 2 (แถวคี่) */
    .transpose-columns > .wp-block-columns:nth-child(odd) > .wp-block-column:last-child {
        padding-right: max(var(--mobile-pad), calc((100vw - var(--container-max-width, 1200px)) / 2));
        padding-left: var(--col-gap);
    }

    /* 2 columns and swap column (แถวคู่ที่สลับแล้ว) */
    .transpose-columns > .wp-block-columns:nth-child(even) > .wp-block-column:last-child {
        padding-left: max(var(--mobile-pad), calc((100vw - var(--container-max-width, 1200px)) / 2));
        padding-right: var(--col-gap);
    }
}

@media (max-width: 989px) {
    .transpose-columns > .wp-block-columns {
        display: flex;
        flex-direction: column; 
        gap: 0 !important;
    }

    .transpose-columns > .wp-block-columns > .wp-block-column {
        width: 100% !important;
        margin: 0 !important;
    }

    /* Padding for mobile */
    /* Image Column 1 */
    .transpose-columns > .wp-block-columns > .wp-block-column:first-child {
        padding: 0 !important;
    }
    
    /* Content Column 2 */
    .transpose-columns > .wp-block-columns > .wp-block-column:last-child {
        padding: var(--mobile-pad) !important;
    }
}

/* ภาพในคอลัมน์แรก */
.transpose-columns > .wp-block-columns > .wp-block-column:first-child img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Reorders two columns and converts to a single column on tablet/mobile layouts (screens below 990px) */
@media (max-width: 1024px) {
    .wp-block-columns.reverse-mobile {
        flex-direction: column-reverse;
    }
    
    .wp-block-columns.reverse-mobile > .wp-block-column {
        width: 100% !important;
        flex-basis: 100% !important;
        margin: 0 !important;
    }
}

/* Remove line breaks in mobile view */
@media (max-width: 1024px) {
  .remove-line-breaks br {
    display: none !important;
  }
  .remove-line-breaks br::before {
    content: " ";
  }
}


/*  Content in the middle post of cm-news, cm-article types ─ */
.cm-the-content{
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 1rem;
    margin-left: auto!important;
    margin-right: auto!important;
}

@media (max-width: 782px) {
    .cm-the-content{
        padding: 0rem;
        max-width: 100%;
    }
}


.cm-the-content p{
    margin: 0 0 1.25rem 0;
    line-height: 1.9;
}
.cm-the-content h1,
.cm-the-content h2,
.cm-the-content h3,
.cm-the-content h4,
.cm-the-content h5,
.cm-the-content h6 {
    margin: 1.5rem 0 .75rem;
    font-weight: 600;
    line-height: 1.3;
}
.cm-the-content h1 { font-size: 2.25rem; }
.cm-the-content h2 { font-size: 1.875rem; }
.cm-the-content h3 { font-size: 1.5rem; }
.cm-the-content h4 { font-size: 1.25rem; }
.cm-the-content h5 { font-size: 1.125rem; }
.cm-the-content h6 { font-size: 1rem; }
.cm-the-content a {
    color: var(--btn-color, #388062);
    text-decoration: underline;
}
.cm-the-content a:hover {
    color: var(--btn-hover-color, #2c6b4f);
    text-decoration: none;
}
.cm-the-content strong {
    font-weight: 600;
}
.cm-the-content ul, .cm-the-content ol {
    margin: 0 0 1.25rem 0;
    padding-left: 1.5rem;
}
.cm-the-content ul li, .cm-the-content ol li {
    margin: 0.5rem 0;
}
.cm-the-content ul li{
    list-style-type: disc;
}
.cm-the-content ol li{
    list-style-type: decimal;
}
.cm-the-content blockquote {
    margin: 1.5rem 0;
    padding: 1rem 1.5rem;
    border-left: 4px solid var(--btn-color, #388062);
    background-color: rgba(56, 128, 98, 0.05);
    font-style: italic;
}
.cm-the-content code {
    background-color: rgba(56, 128, 98, 0.05);
    padding: 0.2rem 0.4rem;
    border-radius: 4px;
    font-family: monospace;
}
.cm-the-content pre {
    background-color: rgba(56, 128, 98, 0.05);
    padding: 1rem;
    border-radius: 4px;
    overflow-x: auto;
}
.cm-the-content img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 1.5rem auto;
}
.cm-the-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
}
.cm-the-content table th, .cm-the-content table td {
    border: 1px solid rgba(56, 128, 98, 0.1);
    padding: 0.5rem;
    text-align: left;
}
.cm-the-content table th {
    background-color: rgba(56, 128, 98, 0.05);
    font-weight: 600;
}
.cm-the-content table tr:nth-child(even) {
    background-color: rgba(56, 128, 98, 0.02);
}

/* Content Product */
.dman-soil-details,
.dman-soil-details td,
.dman-soil-details p,
.dman-soil-details div,
.dman-soil-panel,
.dman-soil-panel td,
.dman-soil-panel p,
.dman-soil-panel div,
.product-details,
.product-details td,
.product-details p,
.product-details div,
.dman-tab-panel,
.dman-tab-panel p,
.dman-tab-panel td,
.dman-tab-panel div {
    line-height: 1.9;
}

/* List with Checkmark Icon */
.cm-list-check-style,
.cm-list-check-style-white {
  list-style-type: none;
  padding-left: 0;
  margin: 0;
}
.cm-list-check-style li,
.cm-list-check-style-white li {
  position: relative;
  padding-left: 32px;
  margin-bottom: 12px;
  line-height: 1.6;
}
.cm-list-check-style li::before,
.cm-list-check-style-white li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px; 
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23193F78' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.cm-list-check-style-white li::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
}


.cm-machinery-machine .wp-block-column{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1rem;
    background-color: #fff;
    border-radius: 1rem;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    padding-top: 1rem;
}
.cm-machinery-machine .wp-block-column > div{ 
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex: 1;
}
.cm-machinery-machine .wp-block-column > div > div { 
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1rem;
}
.cm-machinery-machine .wp-block-column h5{ 
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;  
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    min-height: 3rem; /* Adjust based on your font size and line height */
    font-size: 0.9rem;
}
.cm-machinery-machine .wp-block-column img{
    max-height: 120px;
    width: 100%;
}

/* .wp-block-columns.cm-machinery-machine
   Layout: Mobile: 2 | Tablet: 3 | Desktop: 6
 */

.wp-block-columns.cm-machinery-machine > .wp-block-column {
    flex-basis: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-bottom: 0 !important;
}
 .wp-block-columns.cm-machinery-machine {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1rem !important;
}
@media screen and (min-width: 768px) {
    .wp-block-columns.cm-machinery-machine {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}
@media screen and (min-width: 1024px) {
    .wp-block-columns.cm-machinery-machine {
        grid-template-columns: repeat(6, 1fr) !important;
    }
}
@media screen and (max-width: 767px) {
    .wp-block-columns.cm-machinery-machine {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .wp-block-columns.cm-machinery-machine:not(.is-not-stacked-on-mobile) > .wp-block-column {
        flex-basis: auto !important;
    }
}

/* Accordion Style */
.cm-accordion details{
    margin-bottom: 12px;
}

.cm-accordion summary {
    list-style: none;
    display: flex; 
    align-items: center;
    gap: 16px; 
}

.cm-accordion summary::-webkit-details-marker {
    display: none;
}

.cm-accordion summary::before {
    content: "";
    display: inline-block;
    width: 20px; 
    height: 20px; 
    
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23193F78' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'%3E%3C/polyline%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    
    transition: transform 0.3s ease; 
}

.cm-accordion[open] summary::before,
details.cm-accordion[open] summary::before {
    transform: rotate(90deg);
}

/* Table Style */
.cm-table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
    /* responsive */
    overflow-x: auto;
}
.cm-table table{
    min-width: 700px;
}
.cm-table th, .cm-table td {
    border-bottom: 1px solid rgba(56, 128, 98, 0.1);
    border-right: 0;
    border-left: 0;
    padding: 0.95rem 0.5rem !important;
    cursor: auto;
}

/* - td (1) width 48 and color #333,
    - td (2) width 200 and color #193F78,
    - td (3) width 150 and color #333,
    - td (4) width auto and color #333,
    */
.cm-table-catalog-test table thead tr th:nth-child(1),
.cm-table-catalog-test table tbody tr td:nth-child(1) {
    width: 48px!important;
    color: #333;
    font-weight: 400;
    text-align: center;
}
.cm-table-catalog-test table tbody tr td:nth-child(2),
.cm-table-catalog-test table thead tr th:nth-child(2) {
    width: 200px;
    color: var(--primary-color, #193F78);
    font-weight: 500;
}
.cm-table-catalog-test table tbody tr td:nth-child(3),
.cm-table-catalog-test table thead tr th:nth-child(3) {
    width: 150px;
    color: #333;
    font-weight: 700;
}
.cm-table-catalog-test table tbody tr td:nth-child(4),
.cm-table-catalog-test table thead tr th:nth-child(4)  {
    width: auto;
    color: #333;
    font-weight: 400;
    line-height: 1.5;
}
.cm-table-catalog-test table thead tr th{
    font-weight: 700!important;
    background-color:#E8EDF5;
    color: var(--primary-color, #193F78)!important;
}

/* Responsive Columns for Mobile */
@media (max-width: 781px) {
    .wp-block-columns.cm-col-mb-2 {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 16px !important; 
    }

    .wp-block-columns.cm-col-mb-2 > .wp-block-column {
        flex-basis: calc(50% - 8px) !important;
        width: calc(50% - 8px) !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 0 !important;
    }
}

/* Figure Style */
.figure {
    cursor: pointer;
}

/* WP Block Button */
.wp-block-button .has-background {
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
}
.wp-block-button:hover .has-background {
    opacity: 0.85;
}



/* Consent Cookies Banner */
.gm-cookie-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background-color: #ffffff;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.1);
    transform: translateY(100%);
    opacity: 0;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease;
}

/* State class added by JS when banner should be visible */
.gm-cookie-banner.is-visible {
    transform: translateY(0);
    opacity: 1;
}

.gm-cookie-inner {
    max-width: var(--container-max-width, 1200px);
    margin: 0 auto;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Tablet & Desktop Layout */
@media (min-width: 768px) {
    #gm-cookie-main-view {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.gm-cookie-content {
    flex: 1;
}

.gm-cookie-heading {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--primary-color, #1B3564);
    margin: 0 0 0.5rem 0;
}

.gm-cookie-desc {
    font-size: 0.875rem;
    color: #4b5563;
    line-height: 1.5;
    margin: 0;
}

.gm-cookie-desc a{
    text-decoration: underline;
}

/* Actions & Buttons */
.gm-cookie-actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.gm-cookie-actions-full {
    justify-content: flex-end;
    margin-top: 1rem;
    border-top: 1px solid #e5e7eb;
    padding-top: 1rem;
}

.gm-cookie-btn {
    padding: 0.625rem 1.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
    border: 2px solid transparent;
}

.gm-cookie-btn-solid {
    background-color: var(--btn-color, #388062);
    color: #ffffff;
}

.gm-cookie-btn-solid:hover {
    background-color: var(--btn-hover-color, #2c6b4f);
}

.gm-cookie-btn-outline {
    background-color: transparent;
    border-color: var(--btn-color, #388062);
    color: var(--btn-color, #388062);
}

.gm-cookie-btn-outline:hover {
    background-color: rgba(56, 128, 98, 0.1);
}

/* Toggle Switches for Preferences */
.gm-cookie-options {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 0.5rem;
}

.gm-cookie-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    font-size: 0.875rem;
    color: #374151;
}

.gm-cookie-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}

/* The Toggle Slider */
.gm-cookie-slider {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    background-color: #d1d5db;
    border-radius: 24px;
    transition: 0.3s;
    flex-shrink: 0;
    margin-left: 1rem;
}

.gm-cookie-slider:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    border-radius: 50%;
    transition: 0.3s;
}

/* Checked State */
.gm-cookie-toggle input:checked + .gm-cookie-slider {
    background-color: var(--btn-color, #388062);
}

.gm-cookie-toggle input:checked + .gm-cookie-slider:before {
    transform: translateX(20px);
}

/* Disabled State (For Required Cookies) */
.gm-cookie-toggle input:disabled + .gm-cookie-slider {
    background-color: #9ca3af;
    cursor: not-allowed;
    opacity: 0.7;
}
.gm-cookie-toggle input:disabled ~ .gm-cookie-toggle-label {
    opacity: 0.7;
}
/* Styling for Cookie Options with Descriptions */
.gm-cookie-options {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin-top: 0.5rem;
    max-height: 50vh;
    overflow-y: auto;
    padding-right: 0.5rem;
}

.gm-cookie-option-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    border-bottom: 1px solid #f3f4f6;
    padding-bottom: 1rem;
}

.gm-cookie-option-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.gm-cookie-option-info {
    flex: 1;
}

.gm-cookie-toggle-label {
    display: block;
    font-weight: 600;
    font-size: 0.95rem;
    color: #1f2937;
    margin-bottom: 0.25rem;
}

.gm-cookie-option-desc {
    font-size: 0.8rem;
    color: #6b7280;
    line-height: 1.4;
    margin: 0;
}

/* Adjust toggle container alignment */
.gm-cookie-toggle {
    cursor: pointer;
    position: relative;
    display: inline-block;
    flex-shrink: 0;
    margin-top: 2px;
}

.gm-cookie-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}

.gm-cookie-actions-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid #f3f4f6;
}

.gm-cookie-policy-link {
    font-size: 0.85rem;
    color: #4b5563; 
    text-decoration: underline;
    transition: color 0.2s ease-in-out;
}

.gm-cookie-policy-link:hover {
    color: #111827; 
}

@media (max-width: 480px) {
    .gm-cookie-actions-footer {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }
    
    .gm-cookie-actions-footer .gm-cookie-btn {
        width: 100%;
    }
}



/* Style Default for Gutenberg Blocks */

/* Heading Align Center */
.has-text-align-center {
    text-align: center;
}
.has-text-align-right {
    text-align: right;
}
.has-text-align-left {
    text-align: left;
}
/* Figure Align Center */

.aligncenter {
    display: flex;
    justify-content: center;
    text-align: center;
}
.aligncenter > * {
    margin-left: auto;
    margin-right: auto;
}
.alignright {
    display: flex;
    justify-content: flex-end;

}
.alignleft {
    display: flex;
    justify-content: flex-start;
}

/* Accordion Style */
.wp-block-details summary{
    cursor: pointer;
    padding: 1rem 1rem;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--primary-color, #193F78);
    background: transparent;
    border-radius: 0.5rem;  
    transition: background-color 0.2s ease-in-out;
}
.wp-block-details summary:hover {
    background-color: rgba(56, 128, 98, 0.05);
}
.wp-block-details[open] summary {
    background-color: rgba(56, 128, 98, 0.05);
}
.wp-block-details summary::-webkit-details-marker {
    display: none;
}
.wp-block-details summary::before {
    content: "";
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.5rem;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23193F78' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'%3E%3C/polyline%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    transition: transform 0.3s ease;
}
.wp-block-details[open] summary::before {
    transform: rotate(90deg);
}
.wp-block-details a:not(.wp-block-button__link) {
    color: var(--btn-color, #193F78);
    text-decoration: underline;
}
.wp-block-details a:not(.wp-block-button__link):hover {
    color: var(--btn-hover-color, #2c6b4f);
    text-decoration: none;
}



/* grid-service-lab-page */
.grid-service-lab-page .wp-block-column{
    display: grid;
    gap: 12px;
}
@media (max-width: 767px) {
    .grid-service-lab-page {
        margin-top: 0;
    }
    .grid-service-lab-page .wp-block-column{
        display: grid;
        gap: 12px;
    }
}

/* logo-certificate */
@media (max-width: 767px) {
    .logo-certificate img {
        max-width: 270px!important;
        margin-left: auto!important;
        margin-right: auto!important;
    }
    .logo-certificate .wp-block-column-is-layout-flow{
        display: grid;
        justify-content: center;
    }
}
@media (max-width: 480px) {
    .logo-certificate img {
        max-width: 180px!important;
    }
}