/* input(1011,1): run-time error CSS1019: Unexpected token, found '}' */
/* ==========================================================================
   Cross Accounting Service — Design Tokens
   Derived from the Figma design system.
   All colours, fonts, sizing and other primitives live here and are reused
   across the site. Do not hard-code raw values in component CSS.
   ========================================================================== */

:root {
  /* ----------------------------------------------------------------------
     COLOURS
     ---------------------------------------------------------------------- */
  /* Brand */
  --color-primary: #154364;        /* deep navy — primary brand, dark sections, headings */
  --color-primary-dark: #123a57;   /* slightly darker navy for gradients/hovers */
  --color-accent: #37aedc;         /* sky blue — buttons, links, highlights */
  --color-accent-dark: #2b97c2;    /* accent hover */
  --color-secondary: #2e495e;      /* slate navy — secondary headings, borders */

  /* Text */
  --color-text: #154364;           /* default heading/body on light backgrounds */
  --color-text-muted: #6c7780;     /* muted body copy */
  --color-text-subtle: #4e565c;    /* card body copy */
  --color-text-inverse: #ffffff;   /* text on dark backgrounds */

  /* Surfaces */
  --color-white: #ffffff;
  --color-bg-dark: #154364;        /* dark navy section background */
  --color-bg-light: #f1f1f1;       /* light grey section / card background */
  --color-bg-placeholder: #dddbdb; /* image placeholder background */

  /* Borders */
  --color-border-light: rgba(21, 67, 100, 0.36); /* subtle navy border */
  --color-border-inverse: rgba(255, 255, 255, 0.44); /* border on dark bg */
  --color-border-white: #ffffff;

  /* Gradients */
  --gradient-badge: linear-gradient(144.34deg, #37aedc 21.06%, #154364 110.64%);
  --gradient-testimonial: linear-gradient(146.02deg, #37aedc 11.98%, #2e495e 25.15%);
     --gradient-footer-overlay: linear-gradient(180deg, rgba(55, 174, 220, .14) 3.53%, rgba(255, 255, 255, 0) 9.84%);

  /* ----------------------------------------------------------------------
     TYPOGRAPHY — families
     ---------------------------------------------------------------------- */
  --font-heading: 'Philosopher', serif;          /* headings */
  --font-primary: 'Poppins', sans-serif;         /* body, nav, buttons */
  --font-base: 'Poppins', sans-serif;            /* default UI font */
  --font-footer: 'Gotham', 'Poppins', sans-serif;/* footer copy (Gotham w/ fallback) */

  /* ----------------------------------------------------------------------
     TYPOGRAPHY — font sizes (mapped to the design's actual px values)
     ---------------------------------------------------------------------- */
  --text-xs: 0.75rem;    /* 12px */
  --text-xs--line-height: 1rem;

  --text-sm: 0.875rem;   /* 14px — card body, testimonial body, news date */
  --text-sm--line-height: 1.625rem; /* 26px */

  --text-base: 1rem;     /* 16px — body, nav links, buttons, hero subtext */
  --text-base--line-height: 1.75rem; /* 28px */

  --text-lg: 1.125rem;   /* 18px — footer copy, section sub-headings */
  --text-lg--line-height: 1.75rem; /* 28px */

  --text-xl: 1.25rem;    /* 20px — service tab labels */
  --text-xl--line-height: 1.75rem;

  --text-2xl: 1.375rem;  /* 22px — FAQ questions */
  --text-2xl--line-height: 2rem;

  --text-3xl: 1.5rem;    /* 24px — news card titles */
  --text-3xl--line-height: 2rem;

  --text-4xl: 1.625rem;  /* 26px — footer office headings */
  --text-4xl--line-height: 2rem;

  --text-5xl: 1.75rem;   /* 28px — service card titles, news headline */
  --text-5xl--line-height: 2rem; /* 32px */

  --text-6xl: 2rem;      /* 32px — testimonials & content headings */
  --text-6xl--line-height: 2.3125rem; /* 37px */

  --text-7xl: 2.25rem;   /* 36px — section titles, form heading */
  --text-7xl--line-height: 2.5625rem; /* 41px */

  --text-hero: 3.75rem;  /* 60px — hero headline */
  --text-hero--line-height: 1.1;

  /* ----------------------------------------------------------------------
     TYPOGRAPHY — weights & line heights
     ---------------------------------------------------------------------- */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --lh-tight: 1.1;
  --lh-snug: 1.3;
  --lh-normal: 1.5;
  --lh-relaxed: 1.75; /* ~28px for 16px body */

  /* ----------------------------------------------------------------------
     SPACING (4px scale)
     ---------------------------------------------------------------------- */
  --space-1: 0.25rem;   /* 4px */
  --space-2: 0.5rem;    /* 8px */
  --space-3: 0.75rem;   /* 12px */
  --space-4: 1rem;      /* 16px */
  --space-5: 1.25rem;   /* 20px */
  --space-6: 1.5rem;    /* 24px */
  --space-8: 2rem;      /* 32px */
  --space-10: 2.5rem;   /* 40px */
  --space-12: 3rem;     /* 48px */
  --space-16: 4rem;     /* 64px */
  --space-20: 5rem;     /* 80px */
  --space-24: 6rem;     /* 96px */

  /* ----------------------------------------------------------------------
     BORDER RADIUS
     ---------------------------------------------------------------------- */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 11px;    /* office location cards */
  --radius-lg: 12px;    /* news cards, tab pill */
  --radius-xl: 14px;    /* form container */
  --radius-2xl: 16px;   /* team image, content image */
  --radius-3xl: 20px;   /* service cards */
  --radius-pill: 999px; /* pills / round badges */

  /* ----------------------------------------------------------------------
     SHADOWS
     ---------------------------------------------------------------------- */
  --shadow-sm: 0px 3px 6px rgba(0, 0, 0, 0.16);
  --shadow-md: 0px 8px 24px rgba(0, 0, 0, 0.12);
  --shadow-lg: 0px 16px 40px rgba(0, 0, 0, 0.16);

  /* ----------------------------------------------------------------------
     TRANSITIONS
     ---------------------------------------------------------------------- */
  --transition-base: 200ms ease;
  --transition-slow: 300ms ease;
}

/* Self-hosted fonts (latin subset). font-display: swap keeps text visible during load. */
@font-face { font-family: 'Philosopher'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/philosopher-700.woff2?v=p9cOjCqEz1BZ0ibFmo1xLXh3_Js') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/poppins-400.woff2?v=jXm_X5ltjgsSiV4aCINTwO3pyss') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url('/fonts/poppins-500.woff2?v=VdJfo7sZA5DFnhDzkGV_Tw8ePNE') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url('/fonts/poppins-600.woff2?v=LKVzCVB95a5G2InLtKOqeQJiZ2s') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/poppins-700.woff2?v=8Z4oqGiWKvnAWjW0CV7eXjjiwRw') format('woff2'); }

html, input, textarea, button { font-family: 'Poppins', sans-serif; font-optical-sizing: auto; font-style: normal; }

/*Flex*/
.grow { flex-grow: 1; }
.flex-wrap {flex-wrap: wrap;}
.flex-nowrap {flex-wrap: wrap;}
.flex-row-reverse {flex-direction: row-reverse;}
.flex-col-reverse {flex-direction: column-reverse;}
.justify-center{justify-content: center;}
.justify-end{justify-content: end;}
.justify-between{justify-content: space-between;}
.justify-around{justify-content: space-around;}
.items-center{align-items: center;}
.items-end {align-items: end;}
.flex-col {flex-direction: column;}

/*Gap*/
.gap-2rem {gap: 2rem;}
.gap-5px{gap: 5px;}
.gap-10px{gap: 10px;}
.gap-15px{gap: 15px;}
.gap-20px{gap: 20px;}
.gap-30px{gap: 30px;}
.gap-60px{gap: 60px;}

/*Display*/
.inline{display:inline}.block{display:block}.inline-block{display:inline-block}.flow-root{display:flow-root}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.inline-grid{display:inline-grid}.contents{display:contents}.table{display:table}.inline-table{display:inline-table}.table-caption{display:table-caption}.table-cell{display:table-cell}.table-column{display:table-column}.table-column-group{display:table-column-group}.table-footer-group{display:table-footer-group}.table-header-group{display:table-header-group}.table-row-group{display:table-row-group}.table-row{display:table-row}.list-item{display:list-item}.hidden{display:none}

.center-block{margin: 0 auto;}

/*Text Align*/
.text-center {text-align: center;}
.text-left {text-align: left;}
.text-right {text-align: right;}

/*Tailwind Classes*/

/*Font Weight*/
.font-thin,.font-100{font-weight:100}.font-extralight,.font-200{font-weight:100}.font-light,.font-300{font-weight:100}.font-normal,.font-400{font-weight:100}.font-medium,.font-500{font-weight:100}.font-semibold,.font-600{font-weight:100}.font-bold,.font-700{font-weight:100}.font-extrabold,.font-800{font-weight:100}.font-black,.font-900{font-weight:100}

/*Line Height*/
.leading-09{line-height:.9}.leading-1{line-height:1}.leading-11{line-height:1.1}.leading-12{line-height:1.2}.leading-15{line-height:1.5}.leading-16{line-height:1.5}.leading-17{line-height:1.5}.leading-18{line-height:1.5}

/*Margin*/
.nomarg {margin: 0px;margin-bottom: 0px !important; margin-top: 0px !important;}
.mt-5px { margin-top: 5px }.mt-10px{margin-top:10px}.mt-15px{margin-top:15px}.mt-20px{margin-top:20px}.mt-30px{margin-top:30px}.mt-40px{margin-top:40px}.mt-45px{margin-top:45px}.mt-50px{margin-top:50px}.mt-60px{margin-top:60px}.mr-5px{margin-right:5px}.mr-10px{margin-right:10px}.mr-15px{margin-right:15px}.mr-20px{margin-right:20px}.mr-30px{margin-right:30px}.mr-40px{margin-right:40px}.mr-45px{margin-right:45px}.mr-50px{margin-right:50px}.mr-60px{margin-right:60px}.mb-5px{margin-bottom:5px}.mb-10px{margin-bottom:10px}.mb-15px{margin-bottom:15px}.mb-20px{margin-bottom:20px}.mb-30px{margin-bottom:30px}.mb-40px{margin-bottom:40px}.mb-45px{margin-bottom:45px}.mb-50px{margin-bottom:50px}.mb-60px{margin-bottom:60px}.ml-5px{margin-left:5px}.ml-10px{margin-left:10px}.ml-15px{margin-left:15px}.ml-20px{margin-left:20px}.ml-30px{margin-left:30px}.ml-40px{margin-left:40px}.ml-45px{margin-left:45px}.ml-50px{margin-left:50px}.ml-60px{margin-left:60px}.my-5px{margin-block:5px}.my-10px{margin-block:10px}.my-15px{margin-block:15px}.my-20px{margin-block:20px}.my-30px{margin-block:30px}.my-40px{margin-block:40px}.my-45px{margin-block:45px}.my-50px{margin-block:50px}.my-60px{margin-block:60px}.mx-5px{margin-inline:5px}.mx-10px{margin-inline:10px}.mx-15px{margin-inline:15px}.mx-20px{margin-inline:20px}.mx-30px{margin-inline:30px}.mx-40px{margin-inline:40px}.mx-45px{margin-inline:45px}.mx-50px{margin-inline:50px}.mx-60px{margin-inline:60px}.mx-auto{margin-inline:auto}.m-5px{margin:5px}.m-10px{margin:10px}.m-15px{margin:15px}.m-20px{margin:20px}.m-30px{margin:30px}.m-40px{margin:40px}.m-45px{margin:45px}.m-50px{margin:50px}.m-60px{margin:60px}

/*Padding*/
.pt-5px{padding-top:5px}.pt-10px{padding-top:10px}.pt-15px{padding-top:15px}.pt-20px{padding-top:20px}.pt-30px{padding-top:30px}.pt-40px{padding-top:40px}.pt-45px{padding-top:45px}.pt-50px{padding-top:50px}.pt-60px{padding-top:60px}.pr-5px{padding-right:5px}.pr-10px{padding-right:10px}.pr-15px{padding-right:15px}.pr-20px{padding-right:20px}.pr-30px{padding-right:30px}.pr-40px{padding-right:40px}.pr-45px{padding-right:45px}.pr-50px{padding-right:50px}.pr-60px{padding-right:60px}.pb-5px{padding-bottom:5px}.pb-10px{padding-bottom:10px}.pb-15px{padding-bottom:15px}.pb-20px{padding-bottom:20px}.pb-30px{padding-bottom:30px}.pb-40px{padding-bottom:40px}.pb-45px{padding-bottom:45px}.pb-50px{padding-bottom:50px}.pb-60px{padding-bottom:60px}.pl-5px{padding-left:5px}.pl-10px{padding-left:10px}.pl-15px{padding-left:15px}.pl-20px{padding-left:20px}.pl-30px{padding-left:30px}.pl-40px{padding-left:40px}.pl-45px{padding-left:45px}.pl-50px{padding-left:50px}.pl-60px{padding-left:60px}.py-5px{padding-block:5px}.py-10px{padding-block:10px}.py-15px{padding-block:15px}.py-20px{padding-block:20px}.py-30px{padding-block:30px}.py-40px{padding-block:40px}.py-45px{padding-block:45px}.py-50px{padding-block:50px}.py-60px{padding-block:60px}.px-5px{padding-inline:5px}.px-10px{padding-inline:10px}.px-15px{padding-inline:15px}.px-20px{padding-inline:20px}.px-30px{padding-inline:30px}.px-40px{padding-inline:40px}.px-45px{padding-inline:45px}.px-50px{padding-inline:50px}.px-60px{padding-inline:60px}.p-5px{padding:5px}.p-10px{padding:10px}.p-15px{padding:15px}.p-20px{padding:20px}.p-30px{padding:30px}.p-40px{padding:40px}.p-45px{padding:45px}.p-50px{padding:50px}.p-60px{padding:60px}

/*Text Size*/
.text-xs{font-size:var(--text-xs);line-height:var(--text-xs--line-height)}.text-sm{font-size:var(--text-sm);line-height:var(--text-sm--line-height)}.text-base{font-size:var(--text-base);line-height:var(--text-base--line-height)}.text-lg{font-size:var(--text-lg);line-height:var(--text-lg--line-height)}.text-xl{font-size:var(--text-xl);line-height:var(--text-xl--line-height)}.text-2xl{font-size:var(--text-2xl);line-height:var(--text-2xl--line-height)}.text-3xl{font-size:var(--text-3xl);line-height:var(--text-3xl--line-height)}.text-4xl{font-size:var(--text-4xl);line-height:var(--text-4xl--line-height)}.text-5xl{font-size:var(--text-5xl);line-height:var(--text-5xl--line-height)}.text-6xl{font-size:var(--text-6xl);line-height:var(--text-6xl--line-height)}.text-7xl{font-size:var(--text-7xl);line-height:var(--text-7xl--line-height)}.text-8xl{font-size:var(--text-8xl);line-height:var(--text-8xl--line-height)}.text-9xl{font-size:var(--text-9xl);line-height:var(--text-9xl--line-height)}

/*Height*/
.h-30px{height: 33px;}.h-33px{height: 33px;}

.w-max-cont {width: max-content;}

.max-w-fit {max-width: fit-content;}

/*Max Width*/
.max-w-10{max-width:10px}.max-w-20{max-width:20px}.max-w-30{max-width:30px}.max-w-40{max-width:40px}.max-w-50{max-width:50px}.max-w-60{max-width:60px}.max-w-70{max-width:70px}.max-w-80{max-width:80px}.max-w-90{max-width:90px}.max-w-100{max-width:100px}.max-w-110{max-width:110px}.max-w-120{max-width:120px}.max-w-130{max-width:130px}.max-w-140{max-width:140px}.max-w-150{max-width:150px}.max-w-160{max-width:160px}.max-w-170{max-width:170px}.max-w-180{max-width:180px}.max-w-190{max-width:190px}.max-w-200{max-width:200px}.max-w-210{max-width:210px}.max-w-220{max-width:220px}.max-w-230{max-width:230px}.max-w-240{max-width:240px}.max-w-250{max-width:250px}.max-w-260{max-width:260px}.max-w-270{max-width:270px}.max-w-280{max-width:280px}.max-w-290{max-width:290px}.max-w-300{max-width:300px}.max-w-310{max-width:310px}.max-w-320{max-width:320px}.max-w-330{max-width:330px}.max-w-340{max-width:340px}.max-w-350{max-width:350px}.max-w-360{max-width:360px}.max-w-370{max-width:370px}.max-w-380{max-width:380px}.max-w-390{max-width:390px}.max-w-400{max-width:400px}.max-w-410{max-width:410px}.max-w-420{max-width:420px}.max-w-430{max-width:430px}.max-w-440{max-width:440px}.max-w-450{max-width:450px}.max-w-460{max-width:460px}.max-w-470{max-width:470px}.max-w-480{max-width:480px}.max-w-490{max-width:490px}.max-w-500{max-width:500px}.max-w-510{max-width:510px}.max-w-520{max-width:520px}.max-w-530{max-width:530px}.max-w-540{max-width:540px}.max-w-550{max-width:550px}.max-w-560{max-width:560px}.max-w-570{max-width:570px}.max-w-580{max-width:580px}.max-w-590{max-width:590px}.max-w-600{max-width:600px}.max-w-610{max-width:610px}.max-w-620{max-width:620px}.max-w-630{max-width:630px}.max-w-640{max-width:640px}.max-w-650{max-width:650px}.max-w-660{max-width:660px}.max-w-670{max-width:670px}.max-w-680{max-width:680px}.max-w-690{max-width:690px}.max-w-700{max-width:700px}.max-w-710{max-width:710px}.max-w-720{max-width:720px}.max-w-730{max-width:730px}.max-w-740{max-width:740px}.max-w-750{max-width:750px}.max-w-760{max-width:760px}.max-w-770{max-width:770px}.max-w-780{max-width:780px}.max-w-790{max-width:790px}.max-w-800{max-width:800px}.max-w-810{max-width:810px}.max-w-820{max-width:820px}.max-w-830{max-width:830px}.max-w-840{max-width:840px}.max-w-850{max-width:850px}.max-w-860{max-width:860px}.max-w-870{max-width:870px}.max-w-880{max-width:880px}.max-w-890{max-width:890px}.max-w-900{max-width:900px}.max-w-910{max-width:910px}.max-w-920{max-width:920px}.max-w-930{max-width:930px}.max-w-940{max-width:940px}.max-w-950{max-width:950px}.max-w-960{max-width:960px}.max-w-970{max-width:970px}.max-w-980{max-width:980px}.max-w-990{max-width:990px}.max-w-1000{max-width:1000px}.max-w-1010{max-width:1010px}.max-w-1020{max-width:1020px}.max-w-1030{max-width:1030px}.max-w-1040{max-width:1040px}.max-w-1050{max-width:1050px}.max-w-1060{max-width:1060px}.max-w-1070{max-width:1070px}.max-w-1080{max-width:1080px}.max-w-1090{max-width:1090px}.max-w-1100{max-width:1100px}.max-w-1110{max-width:1110px}.max-w-1120{max-width:1120px}.max-w-1130{max-width:1130px}.max-w-1140{max-width:1140px}.max-w-1150{max-width:1150px}.max-w-1160{max-width:1160px}.max-w-1170{max-width:1170px}.max-w-1180{max-width:1180px}.max-w-1190{max-width:1190px}.max-w-1200{max-width:1200px}.max-w-1210{max-width:1210px}.max-w-1220{max-width:1220px}.max-w-1230{max-width:1230px}.max-w-1240{max-width:1240px}.max-w-1250{max-width:1250px}.max-w-1260{max-width:1260px}.max-w-1270{max-width:1270px}.max-w-1280{max-width:1280px}.max-w-1290{max-width:1290px}.max-w-1300{max-width:1300px}.max-w-1310{max-width:1310px}.max-w-1320{max-width:1320px}.max-w-1330{max-width:1330px}.max-w-1340{max-width:1340px}.max-w-1350{max-width:1350px}.max-w-1360{max-width:1360px}.max-w-1370{max-width:1370px}.max-w-1380{max-width:1380px}.max-w-1390{max-width:1390px}.max-w-1400{max-width:1400px}.max-w-1410{max-width:1410px}.max-w-1420{max-width:1420px}.max-w-1430{max-width:1430px}.max-w-1440{max-width:1440px}.max-w-1450{max-width:1450px}.max-w-1460{max-width:1460px}.max-w-1470{max-width:1470px}.max-w-1480{max-width:1480px}.max-w-1490{max-width:1490px}.max-w-1500{max-width:1500px}.max-w-1510{max-width:1510px}.max-w-1520{max-width:1520px}.max-w-1530{max-width:1530px}.max-w-1540{max-width:1540px}.max-w-1550{max-width:1550px}.max-w-1560{max-width:1560px}.max-w-1570{max-width:1570px}.max-w-1580{max-width:1580px}.max-w-1590{max-width:1590px}.max-w-1600{max-width:1600px}.max-w-1610{max-width:1610px}.max-w-1620{max-width:1620px}.max-w-1630{max-width:1630px}.max-w-1640{max-width:1640px}.max-w-1650{max-width:1650px}.max-w-1660{max-width:1660px}.max-w-1670{max-width:1670px}.max-w-1680{max-width:1680px}.max-w-1690{max-width:1690px}.max-w-1700{max-width:1700px}.max-w-1710{max-width:1710px}.max-w-1720{max-width:1720px}.max-w-1730{max-width:1730px}.max-w-1740{max-width:1740px}.max-w-1750{max-width:1750px}.max-w-1760{max-width:1760px}.max-w-1770{max-width:1770px}.max-w-1780{max-width:1780px}.max-w-1790{max-width:1790px}.max-w-1800{max-width:1800px}.max-w-1810{max-width:1810px}.max-w-1820{max-width:1820px}.max-w-1830{max-width:1830px}.max-w-1840{max-width:1840px}.max-w-1850{max-width:1850px}.max-w-1860{max-width:1860px}.max-w-1870{max-width:1870px}.max-w-1880{max-width:1880px}.max-w-1890{max-width:1890px}.max-w-1900{max-width:1900px}.max-w-1910{max-width:1910px}.max-w-1920{max-width:1920px}.max-w-1930{max-width:1930px}.max-w-1940{max-width:1940px}.max-w-1950{max-width:1950px}.max-w-1960{max-width:1960px}.max-w-1970{max-width:1970px}.max-w-1980{max-width:1980px}.max-w-1990{max-width:1990px}.max-w-2000{max-width:2000px}.max-w-2010{max-width:2010px}.max-w-2020{max-width:2020px}.max-w-2030{max-width:2030px}.max-w-2040{max-width:2040px}.max-w-2050{max-width:2050px}.max-w-2060{max-width:2060px}.max-w-2070{max-width:2070px}.max-w-2080{max-width:2080px}.max-w-2090{max-width:2090px}.max-w-2560{max-width:2560px}

/*Min Width*/
.min-w-100{min-width:100px}.min-w-110{min-width:110px}.min-w-120{min-width:120px}.min-w-130{min-width:130px}.min-w-140{min-width:140px}.min-w-150{min-width:150px}.min-w-160{min-width:160px}.min-w-170{min-width:170px}.min-w-180{min-width:180px}.min-w-190{min-width:190px}.min-w-200{min-width:200px}.min-w-210{min-width:210px}.min-w-220{min-width:220px}.min-w-230{min-width:230px}.min-w-240{min-width:240px}.min-w-250{min-width:250px}.min-w-260{min-width:260px}.min-w-270{min-width:270px}.min-w-280{min-width:280px}.min-w-290{min-width:290px}.min-w-300{min-width:300px}.min-w-310{min-width:310px}.min-w-320{min-width:320px}.min-w-330{min-width:330px}.min-w-340{min-width:340px}.min-w-350{min-width:350px}.min-w-360{min-width:360px}.min-w-370{min-width:370px}.min-w-380{min-width:380px}.min-w-390{min-width:390px}.min-w-400{min-width:400px}.min-w-410{min-width:410px}.min-w-420{min-width:420px}.min-w-430{min-width:430px}.min-w-440{min-width:440px}.min-w-450{min-width:450px}.min-w-460{min-width:460px}.min-w-470{min-width:470px}.min-w-480{min-width:480px}.min-w-490{min-width:490px}.min-w-500{min-width:500px}.min-w-510{min-width:510px}.min-w-520{min-width:520px}.min-w-530{min-width:530px}.min-w-540{min-width:540px}.min-w-550{min-width:550px}.min-w-560{min-width:560px}.min-w-570{min-width:570px}.min-w-580{min-width:580px}.min-w-590{min-width:590px}.min-w-600{min-width:600px}.min-w-610{min-width:610px}.min-w-620{min-width:620px}.min-w-630{min-width:630px}.min-w-640{min-width:640px}.min-w-650{min-width:650px}.min-w-660{min-width:660px}.min-w-670{min-width:670px}.min-w-680{min-width:680px}.min-w-690{min-width:690px}.min-w-700{min-width:700px}.min-w-710{min-width:710px}.min-w-720{min-width:720px}.min-w-730{min-width:730px}.min-w-740{min-width:740px}.min-w-750{min-width:750px}.min-w-760{min-width:760px}.min-w-770{min-width:770px}.min-w-780{min-width:780px}.min-w-790{min-width:790px}.min-w-800{min-width:800px}.min-w-810{min-width:810px}.min-w-820{min-width:820px}.min-w-830{min-width:830px}.min-w-840{min-width:840px}.min-w-850{min-width:850px}.min-w-860{min-width:860px}.min-w-870{min-width:870px}.min-w-880{min-width:880px}.min-w-890{min-width:890px}.min-w-900{min-width:900px}.min-w-910{min-width:910px}.min-w-920{min-width:920px}.min-w-930{min-width:930px}.min-w-940{min-width:940px}.min-w-950{min-width:950px}.min-w-960{min-width:960px}.min-w-970{min-width:970px}.min-w-980{min-width:980px}.min-w-990{min-width:990px}.min-w-1000{min-width:1000px}.min-w-1010{min-width:1010px}.min-w-1020{min-width:1020px}.min-w-1030{min-width:1030px}.min-w-1040{min-width:1040px}.min-w-1050{min-width:1050px}.min-w-1060{min-width:1060px}.min-w-1070{min-width:1070px}.min-w-1080{min-width:1080px}.min-w-1090{min-width:1090px}.min-w-1100{min-width:1100px}.min-w-1110{min-width:1110px}.min-w-1120{min-width:1120px}.min-w-1130{min-width:1130px}.min-w-1140{min-width:1140px}.min-w-1150{min-width:1150px}.min-w-1160{min-width:1160px}.min-w-1170{min-width:1170px}.min-w-1180{min-width:1180px}.min-w-1190{min-width:1190px}.min-w-1200{min-width:1200px}.min-w-1210{min-width:1210px}.min-w-1220{min-width:1220px}.min-w-1230{min-width:1230px}.min-w-1240{min-width:1240px}.min-w-1250{min-width:1250px}.min-w-1260{min-width:1260px}.min-w-1270{min-width:1270px}.min-w-1280{min-width:1280px}.min-w-1290{min-width:1290px}.min-w-1300{min-width:1300px}.min-w-1310{min-width:1310px}.min-w-1320{min-width:1320px}.min-w-1330{min-width:1330px}.min-w-1340{min-width:1340px}.min-w-1350{min-width:1350px}.min-w-1360{min-width:1360px}.min-w-1370{min-width:1370px}.min-w-1380{min-width:1380px}.min-w-1390{min-width:1390px}.min-w-1400{min-width:1400px}.min-w-1410{min-width:1410px}.min-w-1420{min-width:1420px}.min-w-1430{min-width:1430px}.min-w-1440{min-width:1440px}.min-w-1450{min-width:1450px}.min-w-1460{min-width:1460px}.min-w-1470{min-width:1470px}.min-w-1480{min-width:1480px}.min-w-1490{min-width:1490px}.min-w-1500{min-width:1500px}.min-w-1510{min-width:1510px}.min-w-1520{min-width:1520px}.min-w-1530{min-width:1530px}.min-w-1540{min-width:1540px}.min-w-1550{min-width:1550px}.min-w-1560{min-width:1560px}.min-w-1570{min-width:1570px}.min-w-1580{min-width:1580px}.min-w-1590{min-width:1590px}.min-w-1600{min-width:1600px}.min-w-1610{min-width:1610px}.min-w-1620{min-width:1620px}.min-w-1630{min-width:1630px}.min-w-1640{min-width:1640px}.min-w-1650{min-width:1650px}.min-w-1660{min-width:1660px}.min-w-1670{min-width:1670px}.min-w-1680{min-width:1680px}.min-w-1690{min-width:1690px}.min-w-1700{min-width:1700px}.min-w-1710{min-width:1710px}.min-w-1720{min-width:1720px}.min-w-1730{min-width:1730px}.min-w-1740{min-width:1740px}.min-w-1750{min-width:1750px}.min-w-1760{min-width:1760px}.min-w-1770{min-width:1770px}.min-w-1780{min-width:1780px}.min-w-1790{min-width:1790px}.min-w-1800{min-width:1800px}.min-w-1810{min-width:1810px}.min-w-1820{min-width:1820px}.min-w-1830{min-width:1830px}.min-w-1840{min-width:1840px}.min-w-1850{min-width:1850px}.min-w-1860{min-width:1860px}.min-w-1870{min-width:1870px}.min-w-1880{min-width:1880px}.min-w-1890{min-width:1890px}.min-w-1900{min-width:1900px}.min-w-1910{min-width:1910px}.min-w-1920{min-width:1920px}.min-w-1930{min-width:1930px}.min-w-1940{min-width:1940px}.min-w-1950{min-width:1950px}.min-w-1960{min-width:1960px}.min-w-1970{min-width:1970px}.min-w-1980{min-width:1980px}.min-w-1990{min-width:1990px}.min-w-2000{min-width:2000px}.min-w-2010{min-width:2010px}.min-w-2020{min-width:2020px}.min-w-2030{min-width:2030px}.min-w-2040{min-width:2040px}.min-w-2050{min-width:2050px}.min-w-2060{min-width:2060px}.min-w-2070{min-width:2070px}.min-w-2080{min-width:2080px}.min-w-2090{min-width:2090px}

/*Min Height*/
.min-h-10{min-height:10px}.min-h-15{min-height:15px}.min-h-20{min-height:20px}.min-h-25{min-height:25px}.min-h-30{min-height:30px}.min-h-35{min-height:35px}.min-h-40{min-height:40px}.min-h-45{min-height:45px}.min-h-50{min-height:50px}.min-h-55{min-height:55px}.min-h-60{min-height:60px}.min-h-65{min-height:65px}.min-h-70{min-height:70px}.min-h-75{min-height:75px}.min-h-80{min-height:80px}.min-h-85{min-height:85px}.min-h-110{min-height:110px}.min-h-115{min-height:115px}.min-h-130{min-height:130px}.min-h-150{min-height:150px}.min-h-220{min-height:220px}.min-h-260{min-height:260px}.min-h-300{min-height:300px}.min-h-340{min-height:340px}.min-h-410{min-height:410px}.min-h-440{min-height:440px}.min-h-500{min-height:500px}.min-h-180{min-height:180px}.min-h-360{min-height:360px}.min-h-590{min-height:590px}.min-h-610{min-height:610px}.min-h-770{min-height:770px}.min-h-20{min-height:20px}.min-h-500{min-height:500px}.min-h-560{min-height:560px}.min-h-700{min-height:700px}.min-h-730{min-height:730px}.min-h-850{min-height:850px}

/*Border Radius*/
.rounded-xs{border-radius:var(--radius-xs)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-4xl{border-radius:var(--radius-4xl)}.rounded-none{border-radius:0}.rounded-full{border-radius:100%}

/*Misc Rules*/

.new-lazy { position: relative; min-height: 80px; padding-bottom: 100%; background-color: transparent; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.new-lazy:before { position: absolute; z-index: 9; top: 50%; left: 50%; -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); display: inline-block; color: #fff; font-size: 5px; margin: 0; width: 1em; height: 1em; border-radius: 50%; -webkit-animation: load4 1.3s infinite linear; animation: load4 1.3s infinite linear; content: ""; }
.background-lazy { position: relative; background-color: transparent; background-image: none !important; }
.background-lazy:before { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); display: inline-block; color: #fff; font-size: 5px; margin: 0; width: 1em; height: 1em; border-radius: 50%; -o-animation: load4 1.3s infinite linear; -moz-animation: load4 1.3s infinite linear; -webkit-animation: load4 1.3s infinite linear; animation: load4 1.3s infinite linear; content: ""; }
.ajaxLoader { }
.ajaxLoader > i { display: inline-block; color: #2bbed8; font-size: 5px; margin: 0; width: 1em; height: 1em; border-radius: 50%; -o-animation: load4 1.3s infinite linear; -moz-animation: load4 1.3s infinite linear; -webkit-animation: load4 1.3s infinite linear; animation: load4 1.3s infinite linear; content: ""; }


.center-img img, .cent-img img{display: block; margin: 0 auto;}

.inner-rel { width: 100%; position: relative; }

.l-thru{text-decoration: line-through;}

.full-w{width: 100%;}
.full-h {height: 100%;}

.width-fit {width: fit-content;}

.cover-bg {background-size: cover !important; background-position: center !important;}

.full-w-img img {width: 100%; height: auto;}

.full-w {width: 100%;}

.z-stack {display: grid;}
.z-stack > * { grid-row-start: 1; grid-column-start: 1; }

.sticky {position: sticky; top: 0px;}
.sticky.top-30 {top: 30px;}

.no-overfl {overflow: hidden; }
.rel {position: relative;}

.no-p-marg p {margin: 0px !important;}
.no-padd {padding: 0px !important;}
.accordion {}
a {cursor: pointer;}

.cap-txt {text-transform: uppercase;}

.opac-0 {opacity: 0;}
.opac-08 {opacity: 0.8;}
.opac-05 {opacity: 0.5;}
.opac-04 {opacity: 0.4;}

.dark-bg-img{}

.underl {text-decoration: underline;}

.linethru, .line-thru{text-decoration: line-through;}

.youtube {width: 100%; aspect-ratio: 16 / 9;}
.youtube iframe{width: 100%; aspect-ratio: 16 / 9; display: block;}

.no-overflow{overflow: hidden;}

.rev-stars {display: grid;}
.rev-stars > *{grid-row-start: 1; grid-column-start: 1; display: flex;}
.rev-stars > *:last-child {color: #fff; overflow: hidden; }

.curs-point {cursor:pointer;}
.curs-point > * {cursor:pointer;}

*{background-position: center; background-size: cover;}

img {max-width: 100%; height: auto;}
img.blockimg {display: block;}

.bx-shad{    box-shadow: 0px 3px 6px #00000029;}
.bx-shad-inset{    box-shadow: 0px 3px 6px #00000029 inset;}


/*Responsive Rules*/
@media screen and (min-width: 1920px) {
    .pl-12percent { padding-left: 12%; }
}

@media  (max-width: 1229px) {
 .center-txt-md {text-align: center;}
 .center-block-md {margin: 0 auto;}
.fl-ju-cent-md {justify-content: center;}
}

@media screen and (min-width: 1480px) {
    .pl-12percent { padding-left: 12%; }
}




@media screen and (min-width: 1231px) {
    .pl-200 { padding-left: 200px; }
}



@media screen and (min-width:992px) {
.resp-padd-30 {padding: 30px;}
.resp-paddx-30 {padding-left: 30px; padding-right: 30px;}
.resp-mt-30 {margin-top: 30px;}
  
}


@media screen and (max-width:991px) {
   .faqs .faq .q {font-size: 2em;}
.resp-padd-30 {padding: 15px;}
.resp-paddx-30 {padding-left: 15px; padding-right: 15px;}
.resp-mt-30 {margin-top: 15px;}
}


@media screen and (max-width: 500px) {
.faqs .faq .q {font-size: 1.5em;}
.gap5px-xs {gap: 5px;}
.gap10px-xs {gap: 10px;}
.gap05rem-xs {gap: 0.5rem;}
.mt-1-xxs {margin-top: 1rem;}
.mt-05-xxs {margin-top: 0.5rem;}
.mt-0-xxs {margin-top: 0rem;}
.m0-xxs {margin: 0px !important;}
.p0-xxs {padding: 0px !important;}
.fl-r-rev-xxs {flex-direction: row-reverse;}
.fl-r-col-xxs {flex-direction: column-reverse;}

.p-15-xxs {padding: 15px;}

} 
html { scroll-behavior: smooth; scroll-padding-top: 100px; font-size: 1rem;}
html, body, input, textarea, button  { margin: 0px;  }
.map-embed { border: 0; }
.map-lazy { display: block; width: 100%; min-height: 250px; background-color: #f1f1f1; }
.tabs-fb { padding: 1em 0.65em; }
.dblue-bg {background-color: #154364;}
.dblue-txt { color: #154364; }
.lgrey-bg { background-color: #f1f1f1; }
.enquiry-form { max-width: 612px; margin: 0 auto; padding: 4rem 0; }
.enquiry-form .form-title { margin-bottom: 1rem; text-align: center; color: #FFF; text-align: center; font-family: Philosopher; font-size: 36px; font-style: normal; font-weight: 700; line-height: 43px; }
.enquiry-form .form-title span { color: #37aedc; }
.enquiry-form .btn { width: 100%; height: 60px; margin-top: 1rem; border-radius: 12px; }
.enquiry-form .priv-notice { color: #fff; text-align: center; max-width: 490px; margin: 1rem auto 0; }
.enquiry-form .priv-notice.dblue-txt { color: #154364; }
.lr-sections {padding: 10rem 0; display: flex; gap: 10rem; flex-direction: column; max-width: 1240px; margin: 0 auto;}
.lr-sections .img-r {flex-direction: row-reverse;}
.lr-sections .section {align-items: center;}
.lr-sections h2 {font-family: Philosopher; margin: 0; max-width: 490px; font-size: var(--text-6xl); line-height: var(--text-6xl--line-height); color: var(--color-text); }
.lr-sections .text { max-width: 606px; font-family: var(--font-primary); font-size: var(--text-base); line-height: var(--text-base--line-height); color: var(--color-text-muted); }
.lr-sections img {display: block; border-radius: 10px; }
.lr-sections .img-r img {justify-self: flex-end;}
.lr-sections .img-l .text {justify-self: flex-end;}
.lr-sections .text ul { margin: 0px; padding-left: 1.1rem; color: #37aedc;  }
.lr-sections .text ul span { color: var(--color-text-muted); }
.faq-section.top-bord {position: relative;}
.faq-section.top-bord:before { height: 2px; content: ""; position: absolute; top: 0px; left: 50%; transform: translateX(-50%); display: block; background-color: #7a94a7; max-width: 1240px; width: calc(100% - 2rem); margin: 0 auto; }
.faq-section { padding: var(--space-20) 0; }
.faq-section__head { display: flex; flex-direction: column; align-items: center; gap: var(--space-4); margin-bottom: var(--space-10); text-align: center; }
.faq-section__title { margin: 0; font-family: var(--font-heading); font-size: var(--text-7xl); line-height: var(--text-7xl--line-height); font-weight: var(--fw-bold); color: var(--color-text); }
.faq-section__subtitle { margin: 0; max-width: 670px; font-family: var(--font-primary); font-size: var(--text-lg); line-height: var(--text-lg--line-height); color: var(--color-text-muted); }
.faq-section__list { display: flex; flex-direction: column; gap: var(--space-3); max-width: 768px; margin: 0 auto; }
.faq-item { border: 1px solid #c9c9c9; background-color: var(--color-bg-light); border-radius: var(--radius-lg); overflow: hidden; }
.faq-item__header {border: 0;  display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); width: 100%; padding: var(--space-6); background: none; text-align: left; cursor: pointer; }
.faq-item__question { font-family: var(--font-heading); font-size: var(--text-2xl); font-weight: var(--fw-bold); color: var(--color-secondary); }
.faq-item__question .blue-txt { color: #37aedc; }
.faq-item__toggle { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: var(--radius-sm); background-color: var(--color-accent); color: var(--color-white); transition: background-color var(--transition-base); }
.faq-item__header:hover .faq-item__toggle { background-color: var(--color-accent-dark); }
.faq-item__chevron { display: block; width: 15px; height: 10px; transition: transform var(--transition-base); }
.faq-item.is-open .faq-item__chevron { transform: rotate(180deg); }
.faq-item__panel { padding: 0 var(--space-6) var(--space-6); }
.faq-item__answer { margin: 0; font-family: var(--font-primary); font-size: var(--text-base); line-height: var(--text-base--line-height); color: var(--color-text-muted); }
.faq-section__cta { display: flex; justify-content: center; margin-top: 1rem; }
.faq-section.top-bord.dblue-bg {  padding: 6rem 0; }
.faq-section.dblue-bg {}
.faq-section.dblue-bg .faq-section__title { color: #fff; }
.faq-section.dblue-bg .faq-section__subtitle { color: #fff; }
.testimonials { padding: 3rem 0 6rem; background-color: var(--color-bg-light); }
.locations { padding: var(--space-20) 0; background-color: var(--color-bg-light); }
.locations.white-bg{ background-color: #fff; }
.locations__head { display: flex; flex-direction: column; align-items: center; gap: var(--space-5); margin-bottom: var(--space-10); text-align: center; }
.locations__title { margin: 0; font-family: var(--font-heading); font-size: var(--text-7xl); line-height: var(--text-7xl--line-height); font-weight: var(--fw-bold); color: var(--color-text); }
.locations__subtitle { margin: 0; font-family: var(--font-primary); font-size: var(--text-lg); line-height: var(--text-lg--line-height); color: var(--color-text-muted); }
.locations__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-5); max-width: 1240px; margin: 0 auto; }
.location-card { position: relative; display: block; aspect-ratio: 605 / 283; border-radius: var(--radius-lg); overflow: hidden; text-decoration: none; }
.location-card__image { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-slow); }
.location-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(rgba(21, 67, 100, 0.25), rgba(21, 67, 100, 0.40)); }
.location-card__label { position: absolute; inset: 0; z-index: 1; display: flex; align-items: center; justify-content: center; padding: var(--space-4); text-align: center; font-family: var(--font-primary); font-size: clamp(2rem, 3.4vw, 3.375rem); font-weight: var(--fw-semibold); color: var(--color-text-inverse); }
.location-card:hover .location-card__image { transform: scale(1.04); }
.charities { padding-bottom: var(--space-16); }
.charities__head { display: flex; flex-direction: column; align-items: center; gap: var(--space-6); margin-bottom: var(--space-12); text-align: center; }
.charities__title { margin: 0; font-family: var(--font-heading); font-size: 40px; line-height: var(--text-6xl--line-height); font-weight: var(--fw-bold); color: var(--color-text); }
.charities__intro { margin: 0; max-width: 883px; font-family: var(--font-primary); font-size: var(--text-lg); line-height: var(--text-lg--line-height); color: var(--color-text-muted); }
.charities__logos { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--space-10); max-width: 1390px;  margin: 0 auto; }
.charities__logo { max-width: 100%; height: auto; }
@media screen and (max-width: 991px) { .charities__logos { justify-content: center; gap: var(--space-10) var(--space-12); } }
@media screen and (max-width: 575px) { .charities__title { font-size: var(--text-6xl); } }
.servicebanner { background-color: #154364; padding: 60px 0px; min-height: 550px; position: relative; overflow: hidden; display: flex; align-items:center; overflow: hidden; }
.servicebanner .sub-h1 { color: #37AEDC; font-family: Poppins; font-size: 16px; font-style: normal; font-weight: 500; line-height: 30px; }
.servicebanner h1 { margin: 0 0 1rem 0; color: #FFF; font-family: Philosopher; font-size: 48px; font-style: normal; font-weight: 700; line-height: 52px; }
.servicebanner .text { color: #FFF; font-family: Poppins; font-size: 18px; font-style: normal; font-weight: 400; line-height: 28px; }
.servicebanner .text .lnk {color: #37aedc; font-weight: 700; text-decoration: underline;}
.servicebanner .text .lnk:hover { text-decoration: none;}
.servicebanner .content { max-width: 752px; margin-left: auto; position: relative; z-index: 1; }
.servicebanner:after { position: absolute; content: ""; width: 3009.831px; height: 3009.831px; transform: rotate(64deg); right: 47%; top: -68px; border-radius: 3009.831px; background: linear-gradient(162deg, #37aedc 7.41%, #154364 27.47%); }
.servicebanner .btn { min-width: 200px; height: 52px; margin-top: 1.5rem; border-radius: 12px; }

@media screen and (min-width: 1920px){
    .servicebanner .banner-img { left: 0px; }
    .servicebanner.caavoid .banner-img { left: auto; }
    .servicebanner.mtd .banner-img { left: auto; }
    .servicebanner.links .banner-img { left: auto; }
    .servicebanner.location .banner-img { left: auto; }
    .servicebanner.about .banner-img { left: auto; }
}

.servicebanner .banner-img { position: absolute; top: 50%; right: 53%; z-index: 1; transform: translateY(-50%); }
.servicebanner.mtd .banner-img {top: auto; bottom: 0px; transform: none; right: 51%;}
.servicebanner.acc-serv .banner-img {right: 64%; top:60%;}
.servicebanner.chidvs .banner-img { top: auto; bottom:  0px; transform: none; right: 51%; }
.fill-img { object-fit: cover; }
.intro-card { display: flex; align-items: stretch; margin: var(--space-20) auto; background-color: var(--color-bg-light); border-radius: var(--radius-2xl); overflow: hidden; max-width: 1241px; }
.intro-card.white-bg {background-color: #fff;}
.intro-card.sml-marg { margin: 2rem auto; }
.intro-card__media { flex: 0 0 42%; max-width: 508px; }
.intro-card__media iframe, .intro-card__media .map-lazy {width: 100%; height: 100%;}
.intro-card__image { display: block; width: 100%; height: 100%; object-fit: cover; }
.intro-card__body { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; gap: var(--space-6); padding: var(--space-12) var(--space-16) var(--space-12) 0; }
.intro-card__title { font-family: Philosopher; margin: 0; max-width: 540px; font-size: var(--text-6xl); line-height: var(--text-6xl--line-height); color: var(--color-text); }
.intro-card__text { margin: 0; max-width: 588px; font-family: var(--font-primary); font-size: var(--text-base); line-height: var(--text-base--line-height); color: var(--color-text-muted); }
.intro-card.rev { flex-direction: row-reverse; gap: var(--space-20); }
.intro-card__body { padding-left: var(--space-16); padding-right: 0; }
.intro-card__text ul { margin: 0px; padding-left: 1.1rem; }
.intro-card__text ul li { color: #37aedc; }
.intro-card__text ul li span { color: var(--color-text-muted); }
.useful-links { display: flex; align-items: center; justify-content: space-between; gap: var(--space-12); max-width: 1241px; margin: var(--space-20) auto; padding: var(--space-12) var(--space-16); background-color: var(--color-bg-light); border-radius: var(--radius-sm); }
.useful-links__main { flex: 1 1 auto; min-width: 0; }
.useful-links__logo { flex: 0 0 auto; display: block; width: 213px; height: auto; }
.useful-links__title { margin: 0 0 var(--space-6) 0; font-family: Philosopher; font-size: var(--text-6xl); line-height: var(--text-6xl--line-height); font-weight: var(--fw-bold); color: var(--color-text); }
.useful-links__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); max-width: 820px; }
.useful-links__card { position: relative; display: flex; align-items: center; min-height: 53px; padding: var(--space-3) var(--space-4); overflow: hidden; background-color: var(--color-white); border-radius: var(--radius-xs); font-family: var(--font-primary); font-size: var(--text-base); font-weight: var(--fw-semibold); line-height: 22px; color: var(--color-text); text-decoration: underline; transition: color var(--transition-base), box-shadow var(--transition-base); }
.useful-links__card::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 6px; background-color: var(--color-accent); }
.useful-links__card:hover { color: var(--color-accent-dark); box-shadow: var(--shadow-sm); }
.useful-links__card:hover::before { background-color: var(--color-accent-dark); }
.review-card { height: 100%; border-radius: 12px; background: #FFF; display: flex; padding: 6rem 1.25rem 4.5rem; flex-direction: column; gap: 5px; position: relative;}
.review-card .name { color: #2E495E; font-family: Philosopher; font-size: 24px; font-style: normal; font-weight: 700; line-height: 32px;}
.review-card .position { color: #37AEDC; font-family: Poppins; font-size: 14px; font-style: normal; font-weight: 600; line-height: 28px; text-transform: uppercase; }
.review-card .text { color: #6C7780; font-family: Poppins; font-size: 16px; font-style: normal; font-weight: 400; line-height: 28px; }
.review-card .category { position: absolute; top: 1.25rem; right: 0px; background-color: #37aedc; padding:.25rem .5rem; color: #fff; font-size: 14px; font-weight: 500;}
.review-card .image {position: absolute; left: 1rem; top: 1rem; width: 68px; height: 68px; display: flex; justify-content: start; align-items: center;}
.review-card .image img { width: auto; height: auto; max-width: 100%; max-height: 100%; aspect-ratio: auto !important; object-fit: contain; }
.service-card { display: flex; flex-direction: column; background-color: var(--color-bg-light); border-radius: var(--radius-3xl); overflow: hidden; }
.service-card__image { display: block; width: 100%; aspect-ratio: 334 / 162; object-fit: cover; }
.service-card__body { min-height: 320px; display: flex; flex-direction: column; flex: 1 1 auto; gap: var(--space-4); padding: var(--space-5) var(--space-4) var(--space-6); }
.service-card__title { margin: 0; font-family: var(--font-heading); font-size: var(--text-5xl); line-height: var(--text-5xl--line-height); font-weight: var(--fw-bold); color: var(--color-text); }
.service-card__text { margin: 0; font-family: var(--font-primary); font-size: var(--text-sm); line-height: 1.45rem; color: var(--color-text-subtle); }
.service-card__btn { margin-top: auto; }

ul.space li {padding-bottom: .75rem;}
ul.space li:last-child {padding-bottom: 0rem;}

@media screen and (max-width: 991px) {
    .useful-links { flex-direction: column; align-items: stretch; gap: var(--space-8); }
    .useful-links__logo { align-self: flex-start; }
    .servicebanner.chidvs .banner-img { left: 0%; width: 95%; }
    .servicebanner h1 br {display: none;}
}
@media screen and (max-width: 767px) {
    .useful-links { margin: var(--space-12) auto; padding: var(--space-8) var(--space-6); }
    .useful-links__title { font-size: 26px; }
    .useful-links__grid { grid-template-columns: 1fr; }
}
@media screen and (max-width: 1620px) {
    .servicebanner h1 { color: #FFF; font-family: Philosopher; font-size: 36px; font-style: normal; font-weight: 700; line-height: 1.0; }
    .servicebanner .text { color: #FFF; font-family: Poppins; font-size: 16px; font-style: normal;  line-height: 24px; }
    .servicebanner .sub-h1 { margin-bottom: 10px; color: #37AEDC; font-family: Poppins; font-size: 14px; font-style: normal; font-weight: 500; line-height: 1; padding: 5px 0; }
    .servicebanner .content { max-width: 50%; }
    .servicebanner.about .banner-img { max-width: 44%; }
}

@media(max-width: 1229px) {
    .lr-sections { padding: 5rem 0; gap: 5rem; }
    .lr-sections .text { max-width: 100%; }
    .lr-sections .img-r img { justify-self: unset; }
    .lr-sections .img-l .text { justify-self: unset; }
}

@media screen and (max-width: 991px) {
    .servicebanner { padding: 1rem 0 60vw; }
    .servicebanner.about { padding: 1rem 0 70vw; }
    .servicebanner.acc-review { padding: 1rem 0 3rem; }
    .servicebanner .banner-img { top: auto; bottom: 5vw; left: 50%; transform: translateX(-50%) translateY(0); width: 130vw; max-width: 130vw; }
    .servicebanner.testimonials .banner-img { bottom: 0; max-height: 53vw; width: auto; }
    .servicebanner.location .banner-img { top: auto; bottom: 5vw; left: 50%; transform: translateX(-50%) translateY(0); width: auto; max-height: 50vw; max-width: 130vw; }
    .servicebanner.about .banner-img { max-width: 90vw }
    .servicebanner:after { left: 50%; transform: translateX(-50%) translateY(-22%) rotate(18deg); width: 200vw; height: 200vw; bottom: auto; top: 100%; }
    .servicebanner .btn { max-width: 100%; width: 100%; }
    .servicebanner .content { max-width: 100%; }
    .servicebanner.credit .banner-img {bottom: -5vw;}
    .servicebanner.vat-return .banner-img {bottom: -30vw;}
    .servicebanner.mtd { padding: 1rem 0 85vw; }
    .servicebanner.mtd .banner-img { bottom: 0vw; right: auto; left: 50%; width: 90vw; transform: translateX(-50%); }
    .servicebanner.payroll .banner-img { bottom: -39vw; left: calc(50% - 25vw); transform: translateX(-50%) rotate(-21deg); }
    .servicebanner.startups .banner-img {bottom: -5vw;}    
    .servicebanner.cashflow .banner-img{bottom: 0vw;}
    .servicebanner.links .banner-img { bottom: 0vw; width:67vw; }
    .servicebanner.secservice .banner-img { bottom: -40vw;  left: calc(50% - 18vw); transform: translateX(-50%) rotate(-66deg); }
    .servicebanner.companyformation .banner-img { bottom: -13vw; left: calc(50% - 18vw); transform: translateX(-50%) rotate(-26deg); }
    .servicebanner.taxservices .banner-img { bottom: -9vw; left: calc(50% - 14vw); width: 77vw; transform: translateX(-50%) rotate(-15deg); }
    .servicebanner.caavoid .banner-img { bottom: -10vw; width: 80vw; }
    .servicebanner.acc-serv .banner-img { bottom: -28vw; width: 44vw; top: auto; }
    .servicebanner.acc-review .banner-img { display: none; }
    .servicebanner.mob-img-top .banner-img{position: relative; z-index: 1; transform: none; margin-bottom: 1rem; max-width: 100%; left: auto; top: auto; bottom: auto; right: auto;}
    .servicebanner.mob-img-top {padding: 1.5rem 0;}
    .servicebanner.mob-img-top:after { left: 50%; transform: translateX(-50%) translateY(18vw) rotate(18deg); width: 200vw; height: 200vw; bottom: auto; top: 0; }

    .lr-sections { padding: 2rem 0; gap: 2rem; }
    .faq-item__question { font-size: 18px; }
    .faq-section__head {margin-bottom: 15px;}
    .servicebanner.ar .banner-img { width: 150vw; max-width: none; left: 53vw; bottom: -15vw; transform: translateX(-50%) rotate(20deg) translateY(0); }
}
@media screen and (min-width: 992px) {
    .enquiry-form { min-height: 434px; display: flex; justify-content: center; align-items: center; }
    .enquiry-form > * { width: 100%; }
    .intro-card { margin: 120px auto; }
}
@media screen and (max-width: 991px) {
    .intro-card, .intro-card.rev { flex-direction: column; gap: 0; margin: 2rem 0; }
    .intro-card__media { flex-basis: auto; max-width: 100%; }
    .intro-card__image { height: 320px; }
    .intro-card__body { padding: var(--space-8); }
    .lr-sections h2, .intro-card__title, .enquiry-form .form-title { font-size: 26px; line-height: 1.2; }
    .faq-section__subtitle { font-size: 14px; }
}
@media screen and (max-width: 767px) {

    .locations { padding: var(--space-12) 0; }
    .locations__grid { grid-template-columns: 1fr; }
    .locations__title { font-size: var(--text-6xl); line-height: var(--text-6xl--line-height); }
}
@media screen and (max-width: 575px) {
    .intro-card__image { height: 240px; }
    .intro-card__body { padding: var(--space-6); gap: var(--space-4); }
    .faq-section__subtitle { font-size: 14px; }
}
@media screen and (max-width: 575px) {
    .faq-section { padding: var(--space-12) 0; }
    .faq-section.dblue-bg { padding: var(--space-12) 0; }
    .faq-section__title { font-size:26px; line-height: var(--text-6xl--line-height); }
    .faq-item__header { padding: var(--space-4); gap: var(--space-3); }
    .faq-item__panel { padding: 0 var(--space-4) var(--space-4); }
}

/* ==========================================================================
   Latest News — navy band with white blog cards (shared: homepage + service pages)
   ========================================================================== */
.news { padding: var(--space-20) 0; background-color: var(--color-bg-dark); }
.news--light { background-color: var(--color-bg-light); }
.news--light .news__title { color: var(--color-primary); }
.news--light .news__subtitle { color: var(--color-primary); }
.news__head { display: flex; flex-direction: column; align-items: center; gap: var(--space-4); margin-bottom: var(--space-10); text-align: center; }
.news__badge {width: 158px; height: 45px; display: inline-flex; align-items: center; justify-content: center; padding: var(--space-2) var(--space-5); background-color: var(--color-accent); border-radius: var(--radius-pill); font-family: var(--font-primary); font-size: var(--text-base); font-weight: var(--fw-medium); color: var(--color-text-inverse); }
.news__title { margin: var(--space-3) 0 0; font-family: var(--font-heading); font-size: var(--text-7xl); line-height: var(--text-7xl--line-height); font-weight: var(--fw-bold); color: var(--color-text-inverse); }
.news__subtitle { margin: 0; font-family: var(--font-primary); font-size: var(--text-lg); line-height: var(--text-lg--line-height); color: var(--color-text-inverse); }
.news__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 19px; max-width: 1240px; margin: 0 auto; }
.news-card { display: flex; flex-direction: column; background-color: var(--color-white); border-radius: var(--radius-lg); overflow: hidden; }
.news-card .news-card__top {min-height: 200px; position: relative; overflow: hidden; display: flex; justify-content: center; align-items: center; background: linear-gradient(178deg, #37AEDC 5.46%, #1E5D76 117.32%), linear-gradient(179deg, #37AEDC 4.73%, #1E5D76 70.37%); }
.news-card__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.news-card__content {justify-content: space-between; display: flex; flex-direction: column; flex: 1 1 auto; padding: var(--space-5) var(--space-5) var(--space-6); }
.news-card__head { display: flex; flex-direction: column; gap: var(--space-2); }
.news-card__date { font-family: var(--font-primary); font-size: var(--text-sm); font-weight: var(--fw-semibold); text-transform: uppercase; letter-spacing: 0.02em; color: var(--color-accent); }
.news-card__group { display: flex; flex-direction: column; gap: var(--space-3); }
.news-card__heading { margin: 0; font-family: var(--font-heading); font-size: var(--text-3xl); line-height: var(--text-3xl--line-height); font-weight: var(--fw-bold); color: var(--color-secondary); }
.news-card__excerpt { margin: 0; font-family: var(--font-primary); font-size: var(--text-base); line-height: var(--text-base--line-height); color: var(--color-text-muted); opacity: 0.66; }
.news-card__link { display: inline-flex; transform: translateX(-96px); font-weight: 500; gap: .75rem; align-items: center; margin-top: var(--space-6); color: var(--color-secondary); transition: transform var(--transition-base); }
.news-card__link span {opacity: 0;}
.news-card-link:hover .news-card__link { transform: translateX(4px); }
.news-card-link:hover .news-card__link span{ opacity: 1; }
.news-card__arrow { width: 10px; height: 15px; display: block; }
.news-card-link { display: contents; color: inherit; text-decoration: none; }
.rss-itemlist { display: contents; }

@media screen and (max-width: 991px) {
    .news { padding: var(--space-12) 0; }
    .news__grid { grid-template-columns: repeat(2, 1fr); }
}

@media screen and (max-width: 575px) {
    .news__title { font-size: var(--text-6xl); line-height: var(--text-6xl--line-height); }
    .news__grid { grid-template-columns: 1fr; }
    .news-card__link { transform: translateX(0px); }
    .news-card__link span { opacity: 1; }
}
body {
}

@keyframes shimmer {
  0% { background-position: -300px 0px; }
  100% { background-position: 300px 0px; }
}

@keyframes bouncing-loader {
  to { opacity: 0.1; transform: translate3d(0, -16px, 0); }
}

@keyframes bounce-in {
  0% {
    opacity: 0;
    transform: scale(.3);
  }
  50% {
    opacity: 1;
    transform: scale(1.05);
  }
  70% { transform: scale(.9); }
  100% { transform: scale(1); }
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
} 

@keyframes animloader {
  0% {
    box-shadow: -38px -12px ,  -14px 0,  14px 0, 38px 0;
  }
  33% {
    box-shadow: -38px 0px, -14px -12px,  14px 0, 38px 0;
  }
  66% {
    box-shadow: -38px 0px , -14px 0, 14px -12px, 38px 0;
  }
  100% {
    box-shadow: -38px 0 , -14px 0, 14px 0 , 38px -12px;
  }
}
@keyframes flash {
  0% {
    background-color: #f29393;
    box-shadow: 32px 0 #f29393, -32px 0 #e10a0a;
  }
  50% {
    background-color: #e10a0a;
    box-shadow: 32px 0 #f29393, -32px 0 #f29393;
  }
  100% {
    background-color: #f29393;
    box-shadow: 32px 0 #e10a0a, -32px 0 #f29393;
  }
}

@keyframes shadowPulse {
  33% {
    background: #FFF;
    box-shadow: -24px 0 #FF3D00, 24px 0 #FFF;
  }
  66% {
    background: #FF3D00;
    box-shadow: -24px 0 #FFF, 24px 0 #FFF;
  }
  100% {
    background: #FFF;
    box-shadow: -24px 0 #FFF, 24px 0 #FF3D00;
  }
}



*, *:before { -webkit-transition: transform .1s ease-in-out; -ms-transition: transform .1s ease-in-out; transition: margin .2s ease-in-out, background-color .1s linear, color .1s, transform .1s ease-in-out, max-height 0.3s ease-in-out, max-width 0.3s ease-in-out, opacity .2s ease-in-out, background-image 0.2s ease-in-out, box-shadow 0.2s, width 0.2s, filter 0.2s linear, visibility 0.2s ease-in-out, background-position-x 0.2s ease-in-out, background 0.2s ease-in-out , border 0.2s ease-in-out;}
.no-transition { transition: none !important; }
.lazy { opacity: 0; }
.scrollhide { transition: background-color .3s linear, color .3s, transform .5s ease-in-out, opacity .5s linear; }
.scrollhide.hidden { opacity: 0; }
.scrollhide.from-right.hidden { transform: translateX(50%); }
.scrollhide.from-left.hidden { transform: translateX(-50%); }
.scrollhide.from-below.hidden { transform: translateY(50%); }
.scrollhide.rotate-in.hidden { transform: translateY(50%) rotate(-60deg); transform-origin: bottom right; }
.scrollhide.from-left.hidden.subtle { transform: translateX(20%); }
.scrollhide.from-left.subtle { transition: background-color .3s linear, color .3s, transform .5s ease-in-out, opacity .5s linear; }

.fader-item, .fader-sibling-item {transition: none;}

.faq, .faq li { list-style: none; }
.faq { padding: 0px; }
.faq li.q {gap: 15px;  cursor: pointer; display: flex; justify-content: space-between; align-items: center; padding: 15px; }
.faq li.a { background: #fff; display: none; padding: 10px;}

.faqs .faq { list-style: none; padding: 0px; margin: 0px 0px 10px; }
.faqs .faq .q { cursor: pointer;  display: flex;  justify-content: space-between;  border-bottom: 1px solid #707070;  align-items: center; }
.faqs .faq .a > * { padding: 30px 0px}

.faq .q i  {color: #E10A0A;}

ul.faq {margin: .5rem  0px; background: #fff; font-size: 1.14rem;   max-width: 335px; }
ul.faq span {  }

.faqs.compact {}
.faqs.compact .faq{margin: 0px; border-bottom: 1px solid #5A6D8F;}
.faqs.compact .faq .q{border-bottom: none;}

.pagefaqs .faq {background-color: #e6f7ff; max-width: 100%; margin: .5rem 0px;}
.pagefaqs .faq .q i {color: #043776;}
.pagefaqs .faq .q {font-size: 1.25em; font-weight: 700; padding: 20px;}
.pagefaqs .faq .a {background-color: transparent; padding: 20px;}

form.loading .submit-load {position: relative;}
form.loading .submit-load .btn {color: transparent !important;}
form .submit-load i{display: none; animation: rotation 1s linear infinite; width: 30px; height: 30px; border: 3px solid #fff; border-top: 3px solid transparent; border-radius: 100%; position: absolute;left: calc(50% - 15px); top: calc(50% - 15px); }
form.loading .submit-load i {display: block;}

.skel-load-bg { background-color: #f7f7f7; background-image: linear-gradient( to right, #f7f7f7 0%, #cdcdcd 45%, #f7f7f7 70%, #f7f7f7 100% ); background-size: 300px 300px; background-repeat: no-repeat; animation: shimmer 1.4s linear infinite; }

.bouncing-loader { display: flex; justify-content: center; padding-bottom: 8px; }

.bouncing-loader > div { width: 12px; height: 12px; margin: 0rem 0.2rem; background: #000; border-radius: 50%; animation: bouncing-loader 0.6s infinite alternate; }

.bouncing-loader > div:nth-child(2) { animation-delay: 0.2s; }

.bouncing-loader > div:nth-child(3) { animation-delay: 0.4s; }


.worm-loader { width: 12px; height: 12px; border-radius: 50%; display: block; margin: 15px auto; position: relative; color: #e10a0a; box-sizing: border-box; animation: animloader 1s linear infinite alternate; }
.k-rider-loader { transition: none; width: 16px; height: 16px; border-radius: 50%; background-color: #e10a0a; box-shadow: 32px 0 #e10a0a, -32px 0 #e10a0a; position: relative; animation: flash 0.5s ease-out infinite alternate; }
.elip-loader { width: 16px; height: 16px; border-radius: 50%; display: block; margin: 15px auto; position: relative; background: #FFF; box-shadow: -24px 0 #FFF, 24px 0 #FFF; box-sizing: border-box; animation: shadowPulse 2s linear infinite; }
.spin-loader { width: 48px; height: 48px; border: 5px solid #e10a0a; border-bottom-color: transparent; border-radius: 50%; display: inline-block; box-sizing: border-box; animation: rotation 1s linear infinite; }

      

.cmspageloader {transition: none;}
.cmspageloader .container { position: relative; }
.cmspageloader .container > div { position: absolute; left: 15px; top: 0px; }

.cmsactionloader {transition: none !important; position: fixed; font-size: 2em; display: flex; justify-content: center; align-items: center; top: 0px; right: 0px; width: 100vw; height: 100vh; background-color: #ffffffe0; z-index: 10; }
.cmsactionloader .text {text-align: center; font-weight: 700;}

.flip {transform: rotate(180deg);}

.account-loadable {opacity: 1; }
.account-loadable.hidden {opacity: 0;}
i.css-check.red {border-left: 2px solid #e10a0a; border-bottom: 2px solid #e10a0a; width: 100%; aspect-ratio: 1.55; transform: rotate(-45deg) translate(15%, -15%)}
i.css-check.white {border-left: 2px solid #fff; border-bottom: 2px solid #fff; width: 100%; aspect-ratio: 1.55; transform: rotate(-45deg) translate(15%, -15%)}

i.css-user.black { color: #000; display: inline-block; position: relative; width: 30px; aspect-ratio: 1; overflow: hidden; }
i.css-user.black:before { content: ''; position: absolute; left: 50%; top: 0px; aspect-ratio: 1; width: 54%; border-radius: 50%; transform: translateX(-50%); border: solid 1px currentColor; background-color: currentColor; }
i.css-user.black::after { content: ''; position: absolute; left: 0px; left: 50%; top: 60%; transform: translateX(-50%); aspect-ratio: 1; width: 88%; border-radius: 50%; background-color: currentColor; border: solid 1px currentColor }

i.css-x.white {aspect-ratio: 1; position: relative; transform: rotate(45deg);}
i.css-x.white:before {content: ""; display: block; height: 100%; width: 2px; background-color: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
i.css-x.white:after {content: ""; display: block; height: 2px; width: 100%; background-color: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}

i.css-exclamation.white {color: #fff; text-align: center;}
i.css-exclamation.white:before {content: "!"; font-style:normal;}

i.css-chev-up{display: flex; aspect-ratio: 1; min-width: 30px; transform: rotate(180deg); justify-content: center; align-items: center;     padding-bottom: 15%;}
i.css-chev-up:before { content: ""; border-left: 2px solid currentColor; border-bottom: 2px solid currentColor; width: 50%; aspect-ratio: 1; transform: rotate(-45deg) ; }
i.css-chev-down{display: flex; aspect-ratio: 1; min-width: 30px; justify-content: center; align-items: center;     padding-bottom: 15%;}
i.css-chev-down:before { content: ""; border-left: 1px solid currentColor; border-bottom: 1px solid currentColor; width: 50%; aspect-ratio: 1; transform: rotate(-45deg) ; }
i.css-chev-down.purple:before {border-color: #1d185d;}
/* ==========================================================================
   Site Header / Navigation
   Desktop dropdowns via CSS (:hover / :focus-within); mobile menu slides
   down (clip-path reveal) from beneath .navbar-main, full viewport width,
   driven by the existing JS hooks: mobileMenuClose() (#menu-links.open,
   header.nav-show, .hburg-menu.on) and addAccordion('li','.inner-title',
   '.innerdrop','open') in main.js. Tokens live in variables.css.
   ========================================================================== */

header { position: sticky; top: 0; z-index: 11; box-shadow: var(--shadow-md); }
#content { z-index: 10; position: relative; }
.site-header { position: relative; z-index: 50; }

/* Constrain + pad the header content on large screens to match the design */
.site-header .container { max-width: 1600px; padding-inline: clamp(1rem, 4vw, 4rem); }

/* ---------- Main navy bar ---------- */
.navbar-main { background-color: var(--color-primary); position: relative; z-index: 10; }

.navbar-inner { gap: 2rem; height: 120px; }

.nav-logo { display: inline-flex; flex: 0 0 auto; }

.nav-logo img { width: 200px; height: auto; display: block; }

/* ---------- Menu container (links + actions) ---------- */
.nav-menu { flex: 1 1 auto; display: flex; align-items: center; justify-content: space-between; margin-left: 3rem; height: 100%; }

.nav-menu .btn { font-size: 16px; font-weight: 600;  height: 50px; border-radius: 12px; }

.nav-links { display: flex; align-items: center; gap: 2rem; list-style: none; margin: 0; padding: 0; height: 100%; }
.nav-links > li { height: 100%; }



.nav-item { }

.nav-link { display: inline-flex; align-items: center; gap: 6px; padding: 0.5rem 0; color: var(--color-white); font-family: var(--font-primary); font-size: var(--text-base); font-weight: var(--fw-bold); line-height: 1.2; text-decoration: none; background: none; border: none; cursor: pointer; height: 100%; }

.nav-link:hover,
.nav-item:focus-within > .nav-link { color: var(--color-accent); }

.nav-caret { flex: 0 0 auto; transition: transform var(--transition-base); }

.nav-item.has-drop:hover .nav-caret,
.nav-item.has-drop:focus-within .nav-caret { transform: rotate(180deg); }

.nav-item.has-drop.small-drop {position: relative;}
/* ---------- Desktop dropdown ---------- */
.nav-dropdown { position: absolute; top: 100%; left: 0; min-width: 100%; margin: 0; padding: 0.5rem 0; list-style: none; background-color: var(--color-white); box-shadow: var(--shadow-md); opacity: 0; visibility: hidden; transition: opacity var(--transition-base), transform var(--transition-base), visibility var(--transition-base); z-index: 9; }

.nav-item.has-drop:hover .nav-dropdown,
.nav-item.has-drop:focus-within .nav-dropdown { opacity: 1; visibility: visible; transform: translateY(0); }

.nav-dropdown a {flex: 1; display: block; padding: 0.625rem 1.25rem; color: var(--color-secondary); font-family: var(--font-primary); font-size: var(--text-sm); font-weight: var(--fw-medium); line-height: 1.4; text-decoration: none; white-space: nowrap; transition: background-color var(--transition-base), color var(--transition-base); }

.nav-dropdown a:hover { background-color: var(--color-bg-light); color: var(--color-primary); }

/* Simple list dropdown ("About Us") — share the mega-menu's panel + link feel */
.nav-listdrop { min-width: 220px; padding: var(--space-2) 0; border-radius: 0 0 var(--radius-lg) var(--radius-lg); overflow: hidden; transform: translateY(-8px); }
.nav-listdrop a { padding: var(--space-3) var(--space-5); color: var(--color-text); font-size: var(--text-base); line-height: 1.625; }
.nav-listdrop a:hover { color: var(--color-accent); }

.nav-megamenu__cta a { border: 1px solid #d3d3d3; border-radius: 12px; display: flex; justify-content: space-between; align-items: center;}
/* ---------- "Our Services" mega-menu ---------- */
.nav-item--mega { }

.nav-megamenu { left: 0; right: auto; display: flex; flex-wrap: wrap; align-items: flex-start; gap: clamp(2.5rem, 5vw, 6.25rem); /* 100px design gap */ width: max-content; max-width: 92vw; padding: var(--space-10) var(--space-12); border-radius: 0 0 var(--radius-lg) var(--radius-lg); transform: translateY(-8px); justify-content: center; }

.nav-item--mega:hover > .nav-megamenu,
.nav-item--mega:focus-within > .nav-megamenu { transform: translateY(0); }

.nav-megamenu__links { display: flex; gap: clamp(1.5rem, 3.5vw, 5.25rem); /* 84px design gap */ }

.nav-megamenu__col { display: flex; flex-direction: column; gap: var(--space-3); /* 12px */ margin: 0; padding: 0; list-style: none; }

.nav-megamenu__col a { display: block; padding: 0; color: var(--color-text); font-family: var(--font-primary); font-size: var(--text-base); font-weight: var(--fw-medium); line-height: 1.625; white-space: nowrap; transition: color var(--transition-base); }

.nav-megamenu__col a:hover { background: none; color: var(--color-accent); }

.nav-megamenu__cta { display: flex; flex-direction: column; justify-content: center; gap: var(--space-3); flex: 0 0 auto; min-height: 178px;}

/* Custom scrollbar track is injected into every mega-menu by JS; hidden unless the mobile list is scrollable (avoids an empty flex item + gap on desktop). */
.nav-megamenu__track { display: none; }

.nav-cta { display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); min-width: 300px; padding: 0.875rem var(--space-3) 0.875rem var(--space-5); background-color: var(--color-bg-light); border: 1px solid transparent; border-radius: var(--radius-sm); text-decoration: none; transition: border-color var(--transition-base), box-shadow var(--transition-base); }

.nav-cta:hover { border-color: var(--color-accent); box-shadow: var(--shadow-sm); }

.nav-cta__label { font-family: var(--font-primary); font-size: var(--text-base); font-weight: var(--fw-bold); color: var(--color-primary); }

.nav-cta__arrow { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: var(--radius-sm); background-color: var(--color-accent); color: var(--color-white); transition: background-color var(--transition-base); }

.nav-cta:hover .nav-cta__arrow { background-color: var(--color-accent-dark); }

.nav-cta__arrow svg { display: block; width: 8px; height: 14px; }

/* ---------- Action buttons ---------- */
.nav-actions { display: flex; align-items: center; gap: 0.75rem; flex: 0 0 auto;  width: calc(400px + .75px); }
.nav-actions .btn {flex: 1;}
/* ---------- Hamburger (hidden on desktop) ---------- */
.hburg-menu { display: none; flex-direction: column; justify-content: center; gap: 6px; width: 44px; height: 44px; padding: 0; background: none; border: none; cursor: pointer; }

.hburg-menu span { display: block; width: 26px; height: 2px; margin: 0 auto; background-color: var(--color-white); border-radius: 2px; transition: transform var(--transition-base), opacity var(--transition-base); }

.hburg-menu.on span:nth-child(1) { transform: translateY(8px) rotate(45deg); }

.hburg-menu.on span:nth-child(2) { opacity: 0; }

.hburg-menu.on span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* ---------- Consultation bar ---------- */
.consultation-bar { background-color: var(--color-accent); }

.consultation-text { margin: 0; padding-block: 0.5rem; text-align: center; font-family: var(--font-primary); font-size: var(--text-base); font-weight: var(--fw-medium); color: var(--color-white); }

.consultation-text a { color: var(--color-white); font-weight: var(--fw-bold); text-decoration: underline; }

.consultation-text a:hover { text-decoration: none; }

.nav-link > a {color: #fff; text-decoration: none;}

.nav-link > a:hover { color: #37aedc; text-decoration: none; }

@media screen and (max-width: 1400px) {
    .nav-menu { margin-left: 0px; }
    .nav-actions { width: calc(300px + .75px); }
    .nav-actions .btn { min-width: 1px; }
}

@media screen and (max-width: 1250px) and (min-width: 992px) {
    .nav-logo { max-width: 160px; }
    .navbar-inner { gap: 1rem; }
    .nav-menu { margin-left: 0px; }
    .nav-links { flex: 1; gap: 1rem; justify-content: center; }
    .nav-actions { width: calc(270px + .75px); }
    .nav-link { font-size: .9rem; }
}

@media screen and (min-width: 992px) {
    .consultation-text.mob { display: none; }
.showmob {display: none;}
}

/* ==========================================================================
   Mobile / tablet ( <= 991px )
   ========================================================================== */
@media screen and (max-width: 991px) {
    .consultation-text.desk{display: none;}

    .hburg-menu { display: flex; }

    .nav-menu { position: fixed; top: 90px; left: 0; right: 0; width: 100%; height: calc(100dvh - 90px); margin-left: 0; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; padding: 1.5rem 1.5rem 2rem; background-color: var(--color-primary); box-shadow: var(--shadow-lg); clip-path: inset(0 0 100% 0); transition: clip-path var(--transition-slow); overflow-y: auto; -webkit-overflow-scrolling: touch; }
    .nav-menu::-webkit-scrollbar { width: 6px; }
    .nav-menu::-webkit-scrollbar-track { background-color: rgba(255, 255, 255, 0.14); border-radius: var(--radius-pill); }
    .nav-menu::-webkit-scrollbar-thumb { background-color: var(--color-accent); border-radius: var(--radius-pill); }
    .nav-menu::-webkit-scrollbar-button { display: none; width: 0; height: 0; }

    /* Firefox has no ::-webkit-scrollbar; give it the standard props instead (setting these in Chrome 121+ would disable the webkit rules above). */
    @supports not selector(::-webkit-scrollbar) {
        .nav-menu { scrollbar-width: thin; scrollbar-color: var(--color-accent) rgba(255, 255, 255, 0.14); }
    }

    #menu-links.open { clip-path: inset(0 0 0 0); }

    .nav-links { flex-direction: column; align-items: stretch; gap: 0; width: 100%; }

    .nav-item { width: 100%; border-bottom: 1px solid var(--color-border-inverse); }

    .nav-link { width: 100%; justify-content: space-between; padding: 0.875rem 0; }

    /* Mobile dropdown becomes a stacked accordion (jQuery slideToggle sets display) */
    .nav-dropdown { position: static; display: none; min-width: 0; margin: 0; padding: 0 0 0.5rem 0.75rem; background-color: transparent; border-radius: 0; box-shadow: none; opacity: 1; visibility: visible; transform: none; }

    .nav-dropdown a { color: rgba(255, 255, 255, 0.85); white-space: normal; }

    .nav-dropdown a:hover { background-color: transparent; color: var(--color-accent); }

    /* Mega-menu collapses to a stacked list inside the mobile drawer */
    .nav-item--mega { position: static; }

    .nav-megamenu { height: calc(100vh - 520px); overflow-y: auto; align-items: center; flex-direction: column; flex-wrap: nowrap; gap: var(--space-4); width: auto; max-width: none; padding: 0 0 0 var(--space-3); border-radius: 0; transform: none; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
    /* Native scrollbar hidden — replaced by a custom JS thumb in a zero-height sticky track (renders on Safari/iOS too). */
    .nav-megamenu::-webkit-scrollbar { display: none; width: 0; height: 0; }
    .nav-megamenu.has-custom-scroll .nav-megamenu__track { display: block; position: sticky; top: 0; height: 0; z-index: 5; pointer-events: none; }
    .nav-megamenu__thumb { position: absolute; top: 0; right: 2px; width: 6px; border-radius: var(--radius-pill); background-color: var(--color-accent); pointer-events: none; }

    /* "View All Services" pinned as a subtle footer at the bottom of the scrolling mega-menu. */
    .nav-megamenu__viewall { position: sticky; bottom: 0px; background-color: var(--color-primary); border-top: 1px solid rgba(255, 255, 255, 0.15); padding:  0; }
    .nav-megamenu__viewall a {padding: .625rem 0; display: flex; align-items: center; min-height: 35px; color: rgba(255, 255, 255, 0.85); font-family: var(--font-primary); font-size: var(--text-base); font-weight: var(--fw-medium); text-decoration: none; }
    .nav-megamenu__viewall a:hover { color: var(--color-accent); }

    .nav-megamenu__links { flex-direction: column;  gap: 0px;}

    .nav-megamenu__col {gap: 0px;}

    .nav-megamenu__col a { color: rgba(255, 255, 255, 0.85); white-space: normal; gap: 0px; }

    .nav-megamenu__col a:hover { color: var(--color-accent); }

    .nav-megamenu__cta { display: none; }

    .nav-cta { min-width: 0; background-color: rgba(255, 255, 255, 0.08); }

    .nav-cta__label { color: var(--color-white); }

    .nav-actions { flex-direction: column; align-items: stretch; gap: 0.75rem; width: 100%; margin-top: 1.5rem; }

    .nav-actions .btn { width: 100%; }

    body.mob-nav-open { overflow: hidden; }

    .navbar-inner { height: 110px; }

    .nav-links > li { height: auto; }

    .nav-link {height: auto;}

    .nav-cta {display: none;}

    .nav-megamenu__col a, .nav-listdrop a { padding: 0px; min-height: 35px; display: flex; align-items: center;}

    .has-drop .nav-link {position: relative;}
    .has-drop .nav-link:before {content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;}

}

@media screen and (max-width: 550px){
    .consultation-text {font-size: 4.2vw;}
    .navbar-inner { height: auto; padding: 1rem 0;}
    .nav-logo img { max-width: 160px; }
    .navbar-inner { height: 90px; }
    .footer-reg, .footer-year, .footer-credit { font-size: 3.4vw !important; }
    .site-footer .container .section {row-gap: 1rem;}
  

}

@media screen and (max-width: 400px) {
    .nav-logo img { max-width: 40vw; }
}
/* ==========================================================================
   Site footer — navy band with offices, social/legal links and bottom bar
   Reuses: .section / .dw-md-4 grid (responsive.css),
           footer-accordion.js (mobile collapse ≤991px),
           design tokens (variables.css).
   ========================================================================== */
.site-footer { position: relative; overflow: hidden; padding: var(--space-12) 0 var(--space-8); background-color: var(--color-bg-dark); color: var(--color-text-inverse); font-family: var(--font-footer); }

.site-footer .container {max-width: 1260px;}
.site-footer .container .section {justify-content: space-between;}
.site-footer .container .section > div { width: fit-content; }
/* Decorative light arc at the top (reuses the shared footer overlay token) */
.site-footer::before { content: ""; position: absolute; top: 150px; left: 50%; transform: translateX(-50%); width: 4100px; max-width: none; height: auto; aspect-ratio: 1; border-radius: 50%; background: var(--gradient-footer-overlay); pointer-events: none; }
.site-footer .container { position: relative; z-index: 1; }

/* Logo — centred, rendered white over the navy band */
.footer-logo-section { margin-bottom: var(--space-16); display: flex; justify-content: center; }

.footer-logo-section img { width: 186px; height: auto;  }

/* Office / column titles — Philosopher Bold 26px */
.footer-office-title, .footer-column-title { margin: 0 0 var(--space-4); font-family: var(--font-heading); font-size: var(--text-4xl); line-height: 1.2; font-weight: var(--fw-bold); color: var(--color-text-inverse); }

/* Office address + contact lines */
.footer-address { margin: 0 0 var(--space-4); font-style: normal; font-size: var(--text-lg); font-weight: var(--fw-medium); line-height: 1.55; color: var(--color-text-inverse); }
.footer-contact-line { margin: 0; font-family: var(--font-primary); font-size: var(--text-lg); font-weight: var(--fw-bold); line-height: 1.5; }
.footer-contact-line + .footer-contact-line { margin-top: var(--space-1); }
.footer-contact-line a { color: var(--color-text-inverse); text-decoration: none; }
.footer-contact-line strong a { font-weight: var(--fw-semibold);}
.footer-contact-line strong  { font-weight: var(--fw-semibold);}
.footer-contact-line a:hover { color: var(--color-accent); }

/* Social + legal links */
.footer-social-links { display: flex; flex-direction: column; gap: var(--space-1); margin-bottom: var(--space-8); }
.footer-social-link { font-size: var(--text-lg); font-weight: var(--fw-medium); line-height: 1.45; color: var(--color-text-inverse); text-decoration: none; }
.footer-social-link:hover { color: var(--color-accent); }

.footer-legal-links { display: flex; flex-direction: column; gap: var(--space-1); }
.footer-legal-link { font-size: var(--text-lg); font-weight: var(--fw-semibold); line-height: 1.6; color: var(--color-text-inverse); text-decoration: none; }
.footer-legal-link:hover { color: var(--color-accent); }

/* Bottom bar — divider line, then registration (left) + credit (right) */
.footer-bottom { margin-top: var(--space-12); }
.footer-bottom .container { border-top: 1px solid var(--color-border-inverse); padding-top: var(--space-5); padding-left: 0px; padding-right: 0px; }
.footer-copyright { display: flex; flex-direction: column; gap: var(--space-1); }
.footer-reg, .footer-year, .footer-credit { font-size: var(--text-lg);  color: var(--color-text-inverse); }
.footer-credit { text-align: right; }
.footer-credit-link { color: var(--color-text-inverse); font-weight: var(--fw-semibold); text-decoration: underline; }
.footer-credit-link:hover { color: var(--color-accent); }

/* Chevron — hidden on desktop, shown for the mobile accordion */
.footer-chevron { display: none; }

@media screen and (max-width: 991px) {
    .footer-accordion-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); cursor: pointer; margin-bottom: 0; }
    .footer-accordion-header .footer-office-title { margin: 0; }
    .footer-chevron { display: inline-block; flex: 0 0 auto; width: 11px; height: 11px; border-right: 2px solid var(--color-text-inverse); border-bottom: 2px solid var(--color-text-inverse); transform: rotate(45deg); transition: transform var(--transition-base); }
    .footer-accordion.is-active .footer-chevron { transform: rotate(-135deg); }
    .footer-accordion-body { display: none; padding-top: var(--space-4); }
    .footer-accordion.is-active .footer-accordion-body { display: block; }
    .site-footer .container .section > div { width: stretch; }
    .footer-main {max-width: 718px; margin: 0 auto;}
}

@media screen and (max-width: 767px) {
    .footer-credit { text-align: left; margin-top: var(--space-2); }

}

/* ==========================================================================
   Shared Buttons
   Reusable button styles used across the site (header, hero, cards, forms).
   Tokens live in variables.css.
   ========================================================================== */

.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); padding: 0.625rem 1.5rem; font-family: var(--font-primary); font-size: var(--text-base); font-weight: var(--fw-bold); line-height: 1; text-align: center; border: 2px solid transparent; border-radius: var(--radius-sm); text-decoration: none; cursor: pointer; transition: background-color var(--transition-base), color var(--transition-base), border-color var(--transition-base); }

.btn:focus-visible { outline: var(--focus-ring-width, 2px) solid var(--color-accent); outline-offset: 2px; }

/* White / light button — solid white, navy text (e.g. Client Login, Our Services) */
.btn-light { background-color: var(--color-white); color: var(--color-primary); border-color: var(--color-white); }

.btn-light:hover { background-color: transparent; color: var(--color-white); border-color: var(--color-white); }

/* Outline on dark backgrounds (e.g. Get in touch) */
.btn-outline-light { background-color: transparent; color: var(--color-white); border-color: var(--color-white); }

.btn-outline-light:hover { background-color: var(--color-white); color: var(--color-primary); }

/* Accent — sky blue (e.g. Request a Call Back, View All Services) */
.btn-accent { background-color: var(--color-accent); color: var(--color-white); border-color: var(--color-accent); }

.btn-accent:hover { background-color: var(--color-accent-dark); border-color: var(--color-accent-dark); }

/* Primary — navy */
.btn-primary { background-color: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); }

.btn-primary:hover { background-color: transparent; color: var(--color-primary); border-color: var(--color-primary); }

/* Outline navy (e.g. Find out more) */
.btn-outline-primary { background-color: transparent; color: var(--color-primary); border-color: var(--color-primary); }

.btn-outline-primary:hover { background-color: var(--color-primary); color: var(--color-white); }

.btn.blue { background-color: var(--color-accent); border: 1px solid var(--color-accent); color: #fff; }
.btn.blue:hover { background-color: #fff; color: #154364; }
.btn.dblue-outline { background-color: var(--color-primary); color: #fff; border: 2px solid #fff; }
.btn.dblue-outline:hover { background-color: #fff; color: var(--color-primary); border: 2px solid var(--color-primary); }
.btn.white { background-color: #fff; color: var(--color-primary); }
.btn.white:hover { background-color: var(--color-primary); color: #fff; }

/* Size + shape modifiers */
.btn-sm { padding: 0.5rem 1rem; font-size: var(--text-sm); }

.btn-lg { padding: 0.875rem 2rem; min-height: 60px; border-radius: 12px; }

.btn-block { width: 100%; }

.btn-pill { border-radius: var(--radius-pill); }


/* Submit button loading state — swaps the label for a spinner */
.btn-submit { position: relative; }
.btn-submit .btn-spinner { display: none; }
.btn-submit.is-loading { pointer-events: none; }
.btn-submit.is-loading .btn-label { visibility: hidden; }
.btn-submit.is-loading .btn-spinner { display: block; position: absolute; top: 50%; left: 50%; width: 1.125rem; height: 1.125rem; margin: -0.5625rem 0 0 -0.5625rem; border: 2px solid currentColor; border-top-color: transparent; border-radius: var(--radius-pill); animation: btn-spin 0.6s linear infinite; }
@keyframes btn-spin { to { transform: rotate(360deg); } }

.lnk.blue, .lnk.blue a { color: #37aedc; }
.lnk.blue:hover, .lnk.blue:hover a { text-decoration: none; }
strong .lnk.blue { font-weight: 600; }
.dw-carousel { display: none; width: 100%; -webkit-tap-highlight-color: transparent; position: relative; z-index: 1; }
.dw-carousel .dw-stage {position: relative;display: flex;-ms-touch-action: pan-Y;touch-action: manipulation;height: 100%;-moz-backface-visibility: hidden;}
.dw-carousel.flex-carousel .dw-stage{display: flex;}
.dw-carousel .dw-stage:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.dw-carousel .dw-stage-outer { position: relative; overflow: hidden; -webkit-transform: translate3d(0px, 0px, 0px); }
.dw-carousel .dw-wrapper,
.dw-carousel .dw-item { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); }
.dw-carousel .dw-item {position: relative;min-height: 100%;-webkit-backface-visibility: hidden;-webkit-tap-highlight-color: transparent;-webkit-touch-callout: none;}
.dw-carousel .dw-item img {display: block;}
.dw-carousel .dw-nav.disabled,
.dw-carousel .dw-dots.disabled { display: none; }
.dw-carousel .dw-nav .dw-prev,
.dw-carousel .dw-nav .dw-next,
.dw-carousel .dw-dot { cursor: pointer; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.dw-carousel .dw-nav button.dw-prev,
.dw-carousel .dw-nav button.dw-next,
.dw-carousel button.dw-dot {border: none;padding: 0 !important; background: none;}

.dw-carousel .dw-prev {}
.dw-carousel .dw-next {}

.dw-carousel  .dw-prev, .dw-carousel  .dw-next{width: 60px;height: 60px;color: #fff;border-radius: 100%;}

.dw-carousel.dw-loaded {display: flex;flex-wrap: wrap;}
.dw-carousel.dw-loading { opacity: 0; display: block; }
.dw-carousel.dw-hidden { opacity: 0; }
.dw-carousel.dw-refresh .dw-item { visibility: hidden; opacity: 0; }
.dw-carousel.dw-refresh .dw-item.active {opacity: 1; }
.dw-carousel.dw-drag .dw-item {/*opacity: 0;*/ -ms-touch-action: pan-y;touch-action: pan-y;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;height: 100%;}
.dw-carousel.dw-drag .dw-item.active {opacity: 1; }
.dw-carousel.dw-grab { cursor: move; cursor: grab; }
.dw-carousel.dw-rtl { direction: rtl; }
.dw-carousel.dw-rtl .dw-item { float: right; }
.no-js .dw-carousel { display: block; }
.dw-carousel .animated { animation-duration: 1000ms; animation-fill-mode: both; }
.dw-carousel .dw-animated-in { z-index: 0; }
.dw-carousel .dw-animated-out { z-index: 1; }
.dw-carousel .fadeOut { animation-name: fadeOut; }
@keyframes fadeOut {
    0% { opacity: 1; }
    100% { opacity: 0; }
}
.dw-height { transition: height 500ms ease-in-out; }
.dw-carousel .dw-item { }
.dw-carousel .dw-item .dw-lazy { opacity: 0; transition: opacity 400ms ease; }
.dw-carousel .dw-item .dw-lazy[src^=""], .dw-carousel .dw-item .dw-lazy:not([src]) { max-height: 0; }
.dw-carousel .dw-item img.dw-lazy { transform-style: preserve-3d; }
.dw-carousel .dw-video-wrapper { position: relative; height: 100%; background: #000; }
.dw-carousel .dw-video-play-icon { position: absolute; height: 80px; width: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; background: url("../dw.video.play.png") no-repeat; cursor: pointer; z-index: 1; -webkit-backface-visibility: hidden; transition: transform 100ms ease; }
.dw-carousel .dw-video-play-icon:hover { -ms-transform: scale(1.3, 1.3); transform: scale(1.3, 1.3); }
.dw-carousel .dw-video-playing .dw-video-tn,
.dw-carousel .dw-video-playing .dw-video-play-icon { display: none; }
.dw-carousel .dw-video-tn { opacity: 0; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: contain; transition: opacity 400ms ease; }
.dw-carousel .dw-video-frame { position: relative; z-index: 1; height: 100%; width: 100%; }
.dw-theme .dw-nav {max-width: 1920px;text-align: center;-webkit-tap-highlight-color: transparent;left: 50%;width: calc(100% + 80px);top: 50%;display: flex;justify-content: space-between;align-items: center;height: 1px;position: absolute;transform: translate(-50%, -50%);}
.dw-theme .dw-nav [class*='dw-'] {font-size: 1.2rem;color: #043776;padding: 4px 7px;display: inline-block;background-color: transparent;cursor: pointer;width: 40px;height: 40px;border-radius: 100%;}
.dw-theme .dw-nav [class*='dw-']:hover {color: #cb0e40;}
.dw-theme .dw-nav .disabled { opacity: 0.5; cursor: default; }
.dw-theme .dw-nav.disabled + .dw-dots {}
.dw-theme .dw-dots {margin: 15px auto 0px;display: flex;flex-wrap: wrap;height: 30px;background-color: transparent;}

#deliveryinfoslider .dw-dots {margin: 0px auto 0px;}

.dw-theme .dw-dots .dw-dot {display: inline-block;zoom: 1; display: inline;background-color: transparent;}
.dw-theme .dw-dots .dw-dot span {width: 15px;height: 15px;margin: 5px 7px;background: #ecece6;display: block;-webkit-backface-visibility: visible;transition: opacity 200ms ease;border-radius: 30px;border: 1px solid #fff;}
.dw-theme .dw-dots .dw-dot.active span, .dw-theme .dw-dots .dw-dot:hover span {background: #c52432;}

#relatedprod-carousel.dw-theme .dw-dots .dw-dot span {display: none;}
#relatedprod-carousel.dw-theme .dw-dots .dw-dot {width: 15px;height: 15px;margin: 5px 7px;background: #ecece6;display: block;-webkit-backface-visibility: visible;transition: opacity 200ms ease;border-radius: 30px;border: 1px solid #fff;}
#relatedprod-carousel.dw-theme .dw-dots .dw-dot.active  {background: #c52432;}
#relatedprod-carousel.dw-carousel .dw-stage-outer {overflow: hidden;}
.category-theme {margin-top: -40px;flex-direction: row-reverse ; flex-wrap: wrap-reverse !important; align-items: center; gap: 1rem;}
.category-theme .dw-nav {width:max-content; display: flex; gap: 0.3rem;}
.category-theme .dw-nav button{width:max-content; width: 30px; height: 30px; background-color: #314377;}
.category-theme .dw-nav button:hover{background-color: #cb0e40;}
.category-theme .dw-dots{width:max-content;} 

.category-theme .dw-dots .dw-dot {background-color: transparent !important; border: none;  font-size:1.2em; color:#061931; width: auto; height: auto; display: flex; gap: 0.125rem;}
.category-theme .dw-dots .dw-dot.active:before {color: #314377; font-weight: 700;}
.category-theme .dw-dots .dw-dot:after {content: "/";}
.category-theme .dw-dots .dw-dot:last-child:after {display: none;}
.category-theme .dw-dots .dw-dot:nth-child(1):before {content: "1";}
.category-theme .dw-dots .dw-dot:nth-child(2):before {content: "2";}
.category-theme .dw-dots .dw-dot:nth-child(3):before {content: "3";}
.category-theme .dw-dots .dw-dot:nth-child(4):before {content: "4";}
.category-theme .dw-dots .dw-dot:nth-child(5):before {content: "5";}
.category-theme .dw-dots .dw-dot:nth-child(6):before {content: "6";}
.category-theme .dw-dots .dw-dot:nth-child(7):before {content: "7";}
.category-theme .dw-dots .dw-dot:nth-child(8):before {content: "8";}
.category-theme .dw-dots .dw-dot:nth-child(9):before {content: "9";}
.category-theme .dw-dots .dw-dot:nth-child(10):before {content: "10";}


.dw-carousel img {width: 100%; height: auto;}
.dw-carousel .dw-stage img {height: auto; width: auto; aspect-ratio: auto !important;}

 .vp-banner.index .dw-theme .dw-nav{padding: 0px 30px;max-width: 100%; position: absolute; top: 50%; left: 0px;}
 .vp-banner.index .dw-theme .dw-nav i {font-size: 3em;}

@media screen and (max-width: 767px) {
 .vp-banner.index .dw-theme .dw-nav {display: none;}
    .dw-theme .dw-nav [class*='dw-'] {font-size: 1.1em;}
    .dw-carousel .dw-prev, .dw-carousel .dw-next {width: 30px; height: 30px;}

}

@media screen and (max-width: 500px) {
.category-theme {margin-top: -50px;}
.category-theme .dw-dots {display: none;}

}

.editor-label { padding: 10px 0px; display: flex; font-weight: 400; font-size: 1.3em;  color: #fff;}
.editor-field input { min-height: 60px; width: 100%; border: 1px solid #A3A3A3; border-radius: 6px; padding: 0px 15px; font-size: 1.1em; background-color: #fff;  }
.editor-field input.input-validation-error { border: 2px solid #e10a0a; }
.editor-field select { min-height: 50px; width: 100%;     background-color: var(--white);
    color: #000; border-radius: 6px; padding: 0px 15px; font-size: 1.1em; background-color: #fff;}

.editor-field input[type="file"] { border: none; padding: 0px; min-height: auto; }
.editor-field input[type="checkbox"] {width: auto;}
.editor-field textarea { text-wrap: auto; min-height: 165px; width: 100%; border: 1px solid #1d185d;  border-radius: 6px; padding: 15px; font-size: 1.1em; background-color: #fff;  }
.cke_source{border-radius: 0px !important; padding: 0px !important; border: none !important;}
.editor-field input.btn { font-size: 1.3em; }
.editor-field.sml select { min-height: 40px; }

.editor-field.sml input { min-height: 40px; }

.editor-field { position: relative; }
.editor-field .forgot { cursor: pointer; color: #000000; position: absolute; top: 0px; right: 0px; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; }
.editor-field .forgot:hover { color: #e10a0a; }
.editor-field .field-validation-error { font-weight: 500; padding: 0px; background-color: transparent; display: block; color: #e10a0a; border: none; box-shadow: none; padding-top: 5px; margin: 0px; }

.editor-field .date { position: relative; max-width: 490px; display: block; }
.editor-field .date i { border-right: 1px solid #061931; padding: 4px 15px; font-size: 1.4rem; color: #e10a0a; position: absolute; font-weight: 500; left: 0px; top: 50%; transform: translateY(-50%); }
.editor-field .date input { padding-left: 60px; font-size: 1.3rem; height: 55px; cursor: pointer; }
.editor-field .date input::placeholder { color: #061931; }

.editor-field .date:hover i { color: #000000; }

.cms .editor-field input:not([type=submit]) { background-color: var(--white); color: #000; }

.img-controls { background-color: #f5f5f5; }
.img-controls .preview-img { border: 1px solid #dbdbdb; padding: 15px; border-radius: 3px; }
.img-controls .preview-img img { margin: 0 auto; }
.img-upload input { display: block; left: 0px; top: 0px; width: 100%; height: 100%; opacity: 0; z-index: 100000; position: absolute; }

.img-upload { height: 150px; border: 2px dashed #dbdbdb; position: relative; border-radius: 3px; margin-bottom: 15px; cursor: pointer; display: block; }
.img-upload:hover { background-color: #f1f1f1; }
.img-upload span { text-align: center; font-size: 1.1em; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: block; color: #999; }
.img-upload span i { display: block; color: #999 !important; }
.img-upload.sml { height: auto; padding: 15px; }
.img-upload.sml .drop-txt { width: 100%; align-items: center; align-content: center; }
.img-upload.sml span { position: static; transform: none; }
.img-upload.sml .drop-txt > span { margin-top: 15px; }

.editor-field.submit { display: flex; justify-content: space-between; gap: 30px; margin-top: 2rem; }
.editor-field.submit input { font-size: 1.1em; cursor: pointer; display: flex; justify-content: center; align-items: center; font-weight: 600; min-height: 49px; padding: .5rem 1.5rem; border-radius: 50px; text-decoration: none; border: 0; width: 100%; gap: 10px; position: relative; background-color: #07B85A; }
.editor-field.submit input.green { background-color: #79b473; }
.editor-field.submit .btn, .editor-field.submit input { max-width: 200px; min-width: 200px; }
.editor-field.submit .toright.btn { background-color: #000000; color: var(--white); }
.editor-field.submit .clear { display: none; }

.validation-summary-valid ul { margin: 0px; padding-left: 15px; }

.validation-summary-errors { background-color: #fce9e9; border-bottom: 2px solid #e10a0a; box-shadow: 0 3px 6px #00000029; width: fit-content; padding: 15px 15px; font-weight: 700; font-size: 1.2em; margin-bottom: 15px; }
.validation-summary-errors ul { padding: 0px; margin: 0px; list-style: none; color: #e10a0a; }

.field-validation-error, .KO, .ko { display: block; background-color: #fce9e9; border-bottom: 2px solid #e10a0a; box-shadow: 0 3px 6px #00000029; width: fit-content; padding: 15px 15px; font-weight: 700; font-size: 1.2em; margin-bottom: 15px; }
.OK, .ok { display: block; color: var(--white); background-color: #28b714; width: fit-content; padding: 15px 15px; font-weight: 700; font-size: 1.3em; margin-bottom: 15px; }
.toast { transition: none; }
.toast .ok, .toast .OK, toast .ko, .toast .KO { border-radius: 10px; gap: 15px; align-items: center; border: 1px solid #000000; color: #061931; background-color: var(--white); position: fixed; bottom: 2rem; right: 2rem; display: flex; z-index: 99; }
.toast i { max-width: 30px; }
.toast .ok .ico, .toast .OK .ico { background-color: #28b714; width: 30px; height: 30px; position: relative; display: flex; justify-content: center; align-items: center; aspect-ratio: 1; padding: 10px; border-radius: 100%; }
.toast .ok .ico i, .toast .OK .ico i { display: block; }
.toast .ko .ico, .toast .KO .ico { background-color: #e10a0a; width: 30px; height: 30px; position: relative; display: flex; justify-content: center; align-items: center; aspect-ratio: 1; padding: 10px; border-radius: 100%; }
.toast .ko .ico i, .toast .KO .ico i { display: block; width: 100%; aspect-ratio: 1; }
.toast .ko .ico.info, .toast .KO .ico.info { background-color: #000000; }

.field-validation-error ul { padding-left: 5px; }


#applicationform input:not([type=submit]),
#applicationform select { background-color: var(--white); border: 1px solid var(--white); height: 66px; color: var(--black); }

#applicationform input[type=date] { font-family: Arial; }
#applicationform input[type=radio],
#applicationform input[type=checkbox] { width: 45px; height: 45px; border-radius: 7px; min-height: unset; }

#applicationform input[type=checkbox] { flex-shrink: 0; }
#applicationform input[type=checkbox] + label { font-size: var(--font-22); }

#applicationform input[type=radio] + span { font-size: var(--font-24); }

.contact-form {background-color: #1d185d; border-radius: 10px; max-width: 1320px; margin: 0 auto; border: 1px solid #1d185d; overflow: hidden; }

.contact-form .top{padding: 100px 130px;}
.contact-form .btm{padding: 30px 130px 60px; background-color: #fff;}

.radio-opt {font-size: 1.3rem; color: #1d185d; margin-bottom: 15px; display: flex; align-items: center; gap: 10px; cursor: pointer;}
.radio-opt input {margin: 0px;}
.check-opt {font-size: 1.3rem; color: #1d185d; margin-bottom: 15px; display: flex; align-items: center; gap: 10px; cursor: pointer;}
.check-opt input {margin: 0px;}

.bookcallform { background: #FFF; background: linear-gradient(90deg, rgba(255, 255, 255, 1) 50%, rgba(29, 24, 93, 1) 50%); position: fixed; bottom: 0px; left: 0px; z-index: 99; width: 100%;} 
.bookcallform .slide-inner {height: 100vh; overflow: auto; }
.bookcallform .left {padding-right: 30px; display: flex; align-items: center; padding-top: 30px; padding-bottom: 30px; min-height: 100vh;}
.bookcallform .left > div {width: 100%;}
.bookcallform .right {padding-left: 80px; padding-bottom: 30px; display: flex; align-items: center; padding-top: 30px; padding-bottom: 30px; min-height: 100vh; position: relative;}
.bookcallform .right .call-close {position: absolute; right: 0px; top: 80px; color: #fff; font-size: 1.6rem; text-decoration: underline; display: flex; align-items:center; gap: 15px; cursor: pointer;}
.bookcallform .right .call-close .close-x {position: relative; width: 25px; height: 25px; transform: rotate(45deg);}
.bookcallform .right .call-close .close-x:before {content: ""; width: 3px; height: 100%; background-color: #fff; display: flex; border-radius: 3px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.bookcallform .right .call-close .close-x:after {content: ""; width: 100%; height: 3px; background-color: #fff; display: flex; border-radius: 3px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.bookcallform .right .call-close:hover {text-decoration: none;}
.datepicker .table-condensed{width: 100%;}
.datepicker {border-bottom: 1px solid #1d185d; padding-bottom: 10px;}
.datepicker .day {}
.datepicker .day.disabled, .datepicker .day.new {opacity: 0.6; background-color: transparent !important; }
.datepicker table {display: flex; flex-direction: column; gap: 10px;}
.datepicker table tbody, .datepicker table thead{display: flex; width:100%; flex-direction:column; gap: 10px;}
.datepicker table thead tr {padding-top: 10px;}
.datepicker table tr {display: flex; gap: 10px;}
.datepicker table tr td {flex: 1;  text-align: center; color: #100C3E; font-weight: 700; aspect-ratio: 1; display: flex; align-items: center; justify-content: center;}
.datepicker .day {border-radius: 15px; font-size: 1.3rem; cursor: pointer;}
.datepicker .day.active {color: #fff; background-color: #1d185d !important;}
.datepicker .dow {font-size: 1.3rem;}
.datepicker .day:hover {background-color: #e3e3eb;}
.datepicker table tr:last-child th {flex: 1; text-align: center; font-weight: 400; color: #100C3E; position:relative;  aspect-ratio: 1; display: flex; align-items: center; justify-content: center;}
.datepicker table tr th.prev {width: 25px; height: 25px; position: relative; color: transparent; transform: scaleY(.8);}
.datepicker table tr th.prev:before {content: ""; width: 50%; height: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(-45deg); border-left: 2px solid #1d185d; border-top: 2px solid #1d185d;}
.datepicker table tr th.next {width: 25px; height: 25px; position: relative; color: transparent; transform: scaleY(.8);}
.datepicker table tr th.next:before {content: ""; width: 50%; height: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(-45deg); border-right: 2px solid #1d185d; border-bottom: 2px solid #1d185d;}
.datepicker .datepicker-switch {display: flex; align-items: center; color: #100c3e; font-size: 1.3rem; margin: 0px 15px;}

.selected-date {color: #fff; display: flex; gap: 11px;}
.selected-date > div {border-bottom: 2px solid #fff; min-height: 35px;  font-size: 1.3rem; font-weight: 600; line-height: 1; display: flex; align-items: center;}
.selected-date .day {padding: 0px 8px;}
.selected-date .month {padding: 0px 8px;}
.selected-date .year {padding: 0px 8px;}


@media screen and (max-width: 1229px) {
    .editor-field.submit .btn { max-width: 200px; min-width: auto; }
}

@media screen and (max-width: 991px) and (min-width: 768px) {
.bookcallform .left {padding-right: 0px; padding-top: 10vh;}
.bookcallform .right {padding-left: 30px; min-height: calc(100vh - 70px); padding-top: 10vh;}

}
@media screen and (max-width: 767px) {
.bookcallform {background-color: #1d185d; background:#1d185d; height: calc(100vh - 70px); overflow: auto;}
.bookcallform .left {padding-top: 15px; min-height: 10px; background-color: #1d185d; padding-right: 0px;}
.bookcallform .left h2 {color: #fff;}
.bookcallform .datepicker { background-color: #fff; padding: 15px; border-radius: 10px;}
.bookcallform .datepicker table thead tr:first-child{display: none;}

.bookcallform .right {padding: 0px; min-height: 10px; padding-bottom: 30px;}
.bookcallform .white-bg {background-color: #1d185d;}
.bookcallform .radio-opt{color: #fff;}

.bookcallform .selections {display: none;}
.bookcallform .mt-60 {margin-top: 0px;}
.bookcallform .submit-load {padding-top: 30px; display: flex; justify-content: end;}

.bookcallform .right .call-close {display: none;}

.contact-form .top{padding: 30px ;}
.contact-form .btm{padding: 30px ; background-color: #fff;}
.contact-form .maw-230 {max-width: 100% !important;}
.contact-form .btm .section {gap: 0px;}
}
.popup { transition: none !important; z-index: 999; position: relative; }
.popup .overlay { position: fixed; z-index: 990; width: 100%; height: 100vh; top: 0px; left: 0px; background-color: #000000; opacity: 0.6; }
.popup .pop-container { box-shadow: 0px 3px 6px #00000029; position: fixed; z-index: 991; left: 50%; top: 50%; transform: translate(-50%, -50%); width: calc(100% - 30px); background-color: #fff; }
.popup .pop-container .btn.close {display: flex; justify-content: center; align-items: center; font-size: 2em; padding: 0px !important; width: 40px; min-height: 40px; height: 40px; aspect-ratio: 1; position: absolute; top: 10px; right: 10px; z-index: 100; border-radius: 100%; color: #c52433; }
.popup .pop-container .btn.close:hover { background-color: #f5f5f5; }
.popup .pop-container .btn.close > div { width: 40px; height: 40px; position: relative; transform: rotate(45deg); }
.popup .pop-container .btn.close > div:before { display: block; content: ""; width: 1px; height: 20px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #fff; }
.popup .pop-container .btn.close > div:after { display: block; content: ""; width: 20px; height: 1px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #fff; }

.overlay-stndalone{position: fixed; background-color: #000; width: 100%; height:100vh; z-index: 9999; top: 0px; left: 0px;opacity: 0.5; transition: none !important;}

.popbody {border-radius: 5px; z-index: 99;position: fixed;top: 50%; left: 50%;  background-color: #fff;z-index: 9999;transform: translate(-50%, -50%);opacity: 0;transition: 0.3s ease-in-out;width: calc(100% - 60px);max-width: 680px;overflow: hidden; height: calc(100vh - 60px); max-height: 600px;}
.popbody.active { opacity: 1;}
.popbody.basketwidg {}
.popbody .close { font-size: 1.8em; cursor: pointer; display: block; font-weight: 600; }
.popbody .close:hover {color: #C52432;}
.popbody .inner{height: calc(100vh - 100px); display: flex; flex-direction: column; justify-content: space-between;}
.popbody .basket-actions{position: absolute; left: 0px; bottom: 0px; background-color: #ecece6; width: 100%; padding: 30px; display: flex; flex-flow: column; gap: 10px;}
.popbody .basket-actions .btn {max-width: 560px; margin: 0 auto;height: 70px; font-weight: 700; font-size: 1.1em; border: 2px solid #232323;}

.popbody .inner .OK, .popbody .inner .ok { font-weight: 500;}
.popbody .pop-title strong {display: block !important;}

.popbody.full-scn {display: none; transition: none; max-width: 1200px; border-bottom: 9px solid #e10a0a;}
.popbody.full-scn { top: 50%; right: 50%; transform: translate(50%, -50%); height: fit-content;}
.popbody.full-scn .inner {height: auto;}
.popbody.full-scn .top {text-align: center; position: relative;}
.popbody.full-scn .top .close {position: absolute; top: 30px; right: 30px; }
.popbody.full-scn strong {color: #063B68; border-bottom: 5px solid #e10a0a ; font-weight: 900;   }

.popbody .pop-title {display: flex; align-items: center;}
.popbody .pop-title > * {width: 100%;}

.pop-wrapper {max-height: calc(80vh); overflow: auto;}

 @media screen and (max-width: 767px) {
.popbody .inner {padding: 0px;}
.popbody.accred img {max-height: 150px; width: auto;}
    }
@media screen and (max-width:500px) {
  .pop-container .rel.padd-30 { padding: 15px; }
  .popup .pop-container .btn.close { right: 10px; top:10px; margin-top: 0px;}
  .pop-title{height: 70px; display: flex; align-items: center; max-height: 70px !important; min-height: 70px !important;}
  .pop-title > .p-30{padding: 0px 30px; width: 100%;}
  .popbody .inner {height: calc(100vh - 70px);}
  .popbody .inner > .p-30 {padding: 15px;}
  .popbody.accred img {max-height: 110px; width: auto;}
  .popbody {    width: 100%;}
  .basketform .row {}
}

*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.container {width: 100%;margin: 0 auto;padding: 0 1rem;}
.container:after, .section:after { clear: both; }
.clear { display: block; clear: both; }
@-ms-viewport { width: device-width; }
.section.center { align-items: center; }

.section.no-row-g {row-gap: 0px !important;}
.section.sml-row-g {row-gap: 1rem !important;}

.row-gap-2em { row-gap: 2em !important; }

.full-h { height: 100%; }

.grid { display: grid; margin: 0 auto; justify-items: stretch; align-items: stretch; grid-template-columns: repeat(12, 1fr); }
.grid > div { padding: 0px; }

.section { margin: 0 -1rem; display: flex; flex-wrap: wrap; row-gap: 2rem; }
.section > div { position: relative; min-height: 1px; padding: 0 1rem; }
.section.center { align-items: center; }
.section .clear { display: none; }

.section.stockpanel { row-gap: 0px; margin: 0px -0.25rem;}
.section.stockpanel  > *{padding: 0.25rem;}

.section.nogap{margin: 0px; row-gap: 0rem;}
.section.nogap > div{padding: 0rem;}

.section.gap025{margin: 0 -0.25rem; row-gap: 0.5rem;}
.section.gap025 > div{padding: 0 0.25rem;}

.section.gap05{margin: 0 -0.5rem; row-gap: 1rem;}
.section.gap05 > div{padding: 0 0.5rem;}

.section.gap075{margin: 0 -0.75rem; row-gap: 1.5rem;}
.section.gap075 > div{padding: 0 0.75rem;}

.dw-xxs-10percent { width: 10%; }
.dw-xxs-20percent { width: 20%; }
.dw-xxs-30percent { width: 30%; }
.dw-xxs-40percent { width: 40%; }
.dw-xxs-45percent { width: 45%; }
.dw-xxs-50percent { width: 50%; }
.dw-xxs-55percent { width: 55%; }
.dw-xxs-60percent { width: 60%; }
.dw-xxs-70percent { width: 70%; }
.dw-xxs-80percent { width: 80%; }
.dw-xxs-90percent { width: 90%; }

.dw-xxs-10th { width: calc(100% / 10); }
.dw-xxs-9th { width: calc(100% / 9); }
.dw-xxs-8th { width: calc(100% / 8); }
.dw-xxs-7th { width: calc(100% / 7); }
.dw-xxs-5th { width: calc(100% / 5); }

.dw-xxs-12 { width: 100%; }
.dw-xxs-11 { width: 91.66666666666666%; }
.dw-xxs-10 { width: 83.33333333333334%; }
.dw-xxs-9 { width: 75%; }
.dw-xxs-8 { width: 66.66666666666666%; }
.dw-xxs-7 { width: 58.333333333333336%; }
.dw-xxs-6 { width: 50%; }
.dw-xxs-5 { width: 41.66666666666667%; }
.dw-xxs-4 { width: 33.33333333333333%; }
.dw-xxs-3 { width: 25%; }
.dw-xxs-2 { width: 16.666666666666664%; }
.dw-xxs-1 { width: 8.333333333333332%; }

@media (min-width:500px) {
  .dw-xs-10percent { width: 10%; }
  .dw-xs-20percent { width: 20%; }
  .dw-xs-30percent { width: 30%; }
  .dw-xs-40percent { width: 40%; }
  .dw-xs-50percent { width: 50%; }
  .dw-xs-60percent { width: 60%; }
  .dw-xs-70percent { width: 70%; }
  .dw-xs-80percent { width: 80%; }
  .dw-xs-90percent { width: 90%; }

  .dw-xs-10th { width: calc(100% / 10); }
  .dw-xs-9th { width: calc(100% / 9); }
  .dw-xs-8th { width: calc(100% / 8); }
  .dw-xs-7th { width: calc(100% / 7); }
  .dw-xs-5th { width: calc(100% / 5); }

  .dw-xs-12 { width: 100%; }
  .dw-xs-11 { width: 91.66666666666666%; }
  .dw-xs-10 { width: 83.33333333333334%; }
  .dw-xs-9 { width: 75%; }
  .dw-xs-8 { width: 66.66666666666666%; }
  .dw-xs-7 { width: 58.333333333333336%; }
  .dw-xs-6 { width: 50%; }
  .dw-xs-5 { width: 41.66666666666667%; }
  .dw-xs-4 { width: 33.33333333333333%; }
  .dw-xs-3 { width: 25%; }
  .dw-xs-2 { width: 16.666666666666664%; }
  .dw-xs-1 { width: 8.333333333333332%; }
}

@media (max-width: 767px) {
     .container { padding: 0px 1rem; }
    .section { margin: 0 -1rem; }
    .section > div { padding: 0 1rem; }
    .marg-btm-15-xs { margin-bottom: 15px; }
}




@media (min-width:768px) {
  .dw-sm-10percent { width: 10%; }
  .dw-sm-20percent { width: 20%; }
  .dw-sm-30percent { width: 30%; }
  .dw-sm-40percent { width: 40%; }
  .dw-sm-50percent { width: 50%; }
  .dw-sm-60percent { width: 60%; }
  .dw-sm-70percent { width: 70%; }
  .dw-sm-80percent { width: 80%; }
  .dw-sm-90percent { width: 90%; }

  .dw-sm-10th { width: calc(100% / 10); }
  .dw-sm-9th { width: calc(100% / 9); }
  .dw-sm-8th { width: calc(100% / 8); }
  .dw-sm-7th { width: calc(100% / 7); }
  .dw-sm-5th { width: calc(100% / 5); }

  .dw-sm-12 { width: 100%; }
  .dw-sm-11 { width: 91.66666666666666%; }
  .dw-sm-10 { width: 83.33333333333334%; }
  .dw-sm-9 { width: 75%; }
  .dw-sm-8 { width: 66.66666666666666%; }
  .dw-sm-7 { width: 58.333333333333336%; }
  .dw-sm-6 { width: 50%; }
  .dw-sm-5 { width: 41.66666666666667%; }
  .dw-sm-4 { width: 33.33333333333333%; }
  .dw-sm-3 { width: 25%; }
  .dw-sm-2 { width: 16.666666666666664%; }
  .dw-sm-1 { width: 8.333333333333332%; }

  .visible-xs { display: none !important; }
}

@media (min-width: 768px) and (max-width: 991px) {
  .container { max-width: 750px; }
}

@media(max-width: 991px) {
  .container.full-tabdown { max-width: 100% !important; }
}



@media (min-width:992px) {
  .dw-md-10percent { width: 10%; }
  .dw-md-20percent { width: 20%; }
  .dw-md-30percent { width: 30%; }
  .dw-md-40percent { width: 40%; }
  .dw-md-50percent { width: 50%; }
  .dw-md-60percent { width: 60%; }
  .dw-md-70percent { width: 70%; }
  .dw-md-80percent { width: 80%; }
  .dw-md-90percent { width: 90%; }

  .dw-md-10th { width: calc(100% / 10); }
  .dw-md-9th { width: calc(100% / 9); }
  .dw-md-8th { width: calc(100% / 8); }
  .dw-md-7th { width: calc(100% / 7); }
  .dw-md-5th { width: calc(100% / 5); }

  .dw-md-12 { width: 100%; }
  .dw-md-11 { width: 91.66666666666666%; }
  .dw-md-10 { width: 83.33333333333334%; }
  .dw-md-9 { width: 75%; }
  .dw-md-8 { width: 66.66666666666666%; }
  .dw-md-7 { width: 58.333333333333336%; }
  .dw-md-6 { width: 50%; grid-column: span 6; }
  .dw-md-5 { width: 41.66666666666667%; }
  .dw-md-4 { width: 33.33333333333333%; }
  .dw-md-3 { width: 25%; }
  .dw-md-2 { width: 16.666666666666664%; }
  .dw-md-1 { width: 8.333333333333332%; }
  .dw-md-auto {width: auto;}
  .visible-tab-down { display: none !important; }
}

@media (min-width: 992px) and (max-width: 1229px) {
  .container { max-width: 970px; }
}

@media(max-width: 1229px) {
  .visible-desk-up { display: none; }
}

@media (min-width: 1230px) {
  .container.console { width: auto !important; }

  .dw-lg-10percent { width: 10%; }
  .dw-lg-20percent { width: 20%; }
  .dw-lg-30percent { width: 30%; }
  .dw-lg-40percent { width: 40%; }
  .dw-lg-45percent { width: 45%; }
  .dw-lg-50percent { width: 50%; }
  .dw-lg-55percent { width: 55%; }
  .dw-lg-60percent { width: 60%; }
  .dw-lg-70percent { width: 70%; }
  .dw-lg-80percent { width: 80%; }
  .dw-lg-90percent { width: 90%; }

  .dw-lg-10th { width: calc(100% / 10); }
  .dw-lg-9th { width: calc(100% / 9); }
  .dw-lg-8th { width: calc(100% / 8); }
  .dw-lg-7th { width: calc(100% / 7); }
  .dw-lg-5th { width: calc(100% / 5); }

  .dw-lg-12 { width: 100%; }
  .dw-lg-11 { width: 91.66666666666666%; }
  .dw-lg-10 { width: 83.33333333333334%; }
  .dw-lg-9 { width: 75%; }
  .dw-lg-8 { width: 66.66666666666666%; }
  .dw-lg-7 { width: 58.333333333333336%; }
  .dw-lg-6 { width: 50%; }
  .dw-lg-5 { width: 41.66666666666667%; }
  .dw-lg-4 { width: 33.33333333333333%; }
  .dw-lg-3 { width: 25%; }
  .dw-lg-2 { width: 16.666666666666664%; }
  .dw-lg-1 { width: 8.333333333333332%; }

  .visible-desk-up { display: block; }
}

@media (min-width:1230px) and (max-width:1474px) {
  .container { max-width: 1230px; }
  .container.sml { max-width: 830px; }
}

@media (min-width: 1671px) {
  .dw-xl-10percent { width: 10%; }
  .dw-xl-20percent { width: 20%; }
  .dw-xl-30percent { width: 30%; }
  .dw-xl-40percent { width: 40%; }
  .dw-xl-50percent { width: 50%; }
  .dw-xl-60percent { width: 60%; }
  .dw-xl-70percent { width: 70%; }
  .dw-xl-80percent { width: 80%; }
  .dw-xl-90percent { width: 90%; }

  .dw-xl-10th { width: calc(100% / 10); }
  .dw-xl-9th { width: calc(100% / 9); }
  .dw-xl-8th { width: calc(100% / 8); }
  .dw-xl-7th { width: calc(100% / 7); }
  .dw-xl-5th { width: calc(100% / 5); }

  .dw-xl-12 { width: 100%; }
  .dw-xl-11 { width: 91.66666666666666%; }
  .dw-xl-10 { width: 83.33333333333334%; }
  .dw-xl-9 { width: 75%; }
  .dw-xl-8 { width: 66.66666666666666%; }
  .dw-xl-7 { width: 58.333333333333336%; }
  .dw-xl-6 { width: 50%; }
  .dw-xl-5 { width: 41.66666666666667%; }
  .dw-xl-4 { width: 33.33333333333333%; }
  .dw-xl-3 { width: 25%; }
  .dw-xl-2 { width: 16.666666666666664%; }
  .dw-xl-1 { width: 8.333333333333332%; }
}

@media (min-width:1230px) and (max-width:1670px) {
  .container, .course .masthead .container, .info-page .masthead .container { max-width: 1500px; }
}

@media (min-width:1671px) {
  .container, .course .masthead .container, .info-page .masthead .container { max-width: 1640px; }
.container.sml {max-width: 830px;}
  .dw-xxl-10percent { width: 10%; }
  .dw-xxl-20percent { width: 20%; }
  .dw-xxl-30percent { width: 30%; }
  .dw-xxl-40percent { width: 40%; }
  .dw-xxl-50percent { width: 50%; }
  .dw-xxl-60percent { width: 60%; }
  .dw-xxl-70percent { width: 70%; }
  .dw-xxl-80percent { width: 80%; }
  .dw-xxl-90percent { width: 90%; }

  .dw-xxl-10th { width: calc(100% / 10); }
  .dw-xxl-9th { width: calc(100% / 9); }
  .dw-xxl-8th { width: calc(100% / 8); }
  .dw-xxl-7th { width: calc(100% / 7); }
  .dw-xxl-5th { width: calc(100% / 5); }

  .dw-xxl-12 { width: 100%; }
  .dw-xxl-11 { width: 91.66666666666666%; }
  .dw-xxl-10 { width: 83.33333333333334%; }
  .dw-xxl-9 { width: 75%; }
  .dw-xxl-8 { width: 66.66666666666666%; }
  .dw-xxl-7 { width: 58.333333333333336%; }
  .dw-xxl-6 { width: 50%; }
  .dw-xxl-5 { width: 41.66666666666667%; }
  .dw-xxl-4 { width: 33.33333333333333%; }
  .dw-xxl-3 { width: 25%; }
  .dw-xxl-2 { width: 16.666666666666664%; }
  .dw-xxl-1 { width: 8.333333333333332%; }

  .container.console { max-width: 1645px !important; }
}

@media screen and (min-width: 1231px) {
  .fl-left-lg { float: left; }
  .fl-right-lg { float: right; }
}

@media screen and (min-width: 992px) and (max-width: 1230px) {
  .fl-left-md { float: left; }
  .fl-right-md { float: right; }
  .full-w-md { max-width: 100%; }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
  .fl-left-sm { float: left; }
  .fl-right-sm { float: right; }
  .hidden-sm { display: none !important; }
  .full-w-sm { max-width: 100%; }
}

@media screen and (max-width: 767px) {
  .fl-left-xs { float: left; }
  .fl-right-xs { float: right; }
  .hidden-xs { display: none !important; }

  .sm-center-txt { text-align: center !important; }
}


body { }


.team-cards { padding: 5rem 0; }
.team-cards h2 { color: #154364; text-align: center; font-family: Philosopher; font-size: 40px; font-style: normal; font-weight: 700; line-height: 37px; /* 92.5% */ }
.team-cards .card { max-width: 1240px; background-color: #f1f1f1; border-radius: 8px; overflow: hidden; display: block; margin: 0 auto 1.5rem; display: flex; align-items: center; }
.team-cards .card .copy { padding: 40px; }
.team-cards .card .copy .sub-title { color: #37AEDC; font-family: Poppins; font-size: 18px; font-style: normal; font-weight: 500; line-height: 28px; /* 155.556% */ }
.team-cards .card .copy h3 { margin: 0px; color: #154364; font-family: Philosopher; font-size: 32px; font-style: normal; font-weight: 700; line-height: 37px; /* 115.625% */ }
.team-cards .card .copy .text { margin-top: 1rem; color: #6C7780; font-family: Poppins; font-size: 16px; font-style: normal; font-weight: 400; line-height: 28px; /* 175% */ }

@media screen and (max-width: 991px) {
  
    .team-cards .card {padding: 2rem; gap: 2rem; }
    .team-cards .card .copy{padding: 0;}
    .team-cards .card img {border-radius:10px; }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
}

@media screen and (max-width: 767px) {
    .team-cards .card {flex-direction: column;}
}

/* Testimonials filter */
.testimonial-filter { display: flex; flex-wrap: wrap; justify-content: start; gap: var(--space-3); margin-bottom: 2.5rem; }
.filter-pill {min-height: 49px; display: inline-flex; align-items: center; justify-content: center; padding: 0.625rem 1.5rem; font-family: var(--font-primary); font-size: 18px; font-weight: 500; line-height: 1; color: var(--color-primary); background-color: var(--color-white); border: none; border-radius: var(--radius-pill); cursor: pointer; transition: background-color var(--transition-base), color var(--transition-base), border-color var(--transition-base); }
.filter-pill:hover { background-color: var(--color-accent); color: var(--color-white); }
.filter-pill.is-active { background-color: var(--color-accent); color: var(--color-white); border-color: var(--color-accent); }



/* Testimonials read more */
.review-more { margin-top: var(--space-2); padding: 0 1rem; border-radius:5px; height: 40px; position: absolute; left: 1rem; bottom: 1rem; background: #154364; border: none; font-family: var(--font-primary); font-size: 16px; font-weight: 600; line-height: 28px; color: #fff; cursor: pointer; }
.review-more:hover { background-color: #37aedc; }

/* Testimonials */
.testimonials-block { background-color: var(--color-bg-light); padding: 5rem 0; }
.testimonials-block__head { display: flex; flex-direction: column; align-items: center; gap: var(--space-8); margin-bottom: var(--space-10); text-align: center; }
.testimonials-block .pill { display: inline-flex; align-items: center; justify-content: center; padding: 1rem; background-color: var(--color-accent); color: var(--color-white); font-family: var(--font-primary); font-size: 16px; font-weight: 500; line-height: 1; border-radius: var(--radius-pill); }
.testimonials-block__head h2 { margin: 0; color: var(--color-primary); font-family: var(--font-heading); font-size: 36px; font-weight: 700; line-height: 43px; }
.testimonials-block .testimonial-carousel { margin-bottom: var(--space-10); }
.testimonials-block .item { background-color: var(--color-white); border-radius: var(--radius-lg); padding: 21px 22px; height: 278px; overflow: hidden; }
.testimonials-block .item .name { color: var(--color-secondary); font-family: var(--font-heading); font-size: 24px; font-weight: 700; line-height: 32px; }
.testimonials-block .item .company { margin-top: var(--space-2); color: var(--color-accent); font-family: var(--font-primary); font-size: 14px; font-weight: 600; line-height: 28px; text-transform: uppercase; }
.testimonials-block .item .quote { margin: var(--space-2) 0 0; color: var(--color-text-muted); font-family: var(--font-primary); font-size: 16px; font-weight: 400; line-height: 28px; opacity: 0.66; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.testimonials-block__actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; max-width: 594px; margin: 0 auto; }
.testimonials-block__actions .btn { flex: 1 1 0; min-width: 240px; }

@media screen and (max-width: 767px) {
    .testimonials-block { padding: 3rem 0; }
    .testimonials-block__head h2 { font-size: 30px; line-height: 36px; }
    .testimonials-block__actions .btn { flex: 1 1 100%; }
    .filter-pill {min-height: 38px;}
}

