/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/web-5.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/web-1.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/web-7.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/web-2.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/web-6.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/web-4.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/web-3.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/web-5.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/web-1.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/web-7.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/web-2.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/web-6.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/web-4.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/web-3.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/web-5.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/web-1.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/web-7.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/web-2.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/web-6.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/web-4.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/web-3.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/web-5.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/web-1.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/web-7.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/web-2.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/web-6.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/web-4.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/web-3.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* arabic */
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/web-9.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
/* latin */
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/web-8.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* arabic */
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/web-15.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
/* latin */
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/web-14.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* arabic */
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/web-11.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
/* latin */
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/web-10.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* arabic */
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/assets/fonts/web-13.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
/* latin */
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/assets/fonts/web-12.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── CSS Variables ──────────────────────────────────────────── */
:root {
  /* Colors */
  --primary:        #D4A520;
  --primary-dark:   #B8922A;
  --primary-light:  #FDF6E8;
  --accent:         #D4A520;          /* alias of --primary; retained for legacy refs */
  --secondary:      #1A1A1A;
  --navy:           #0F0F0F;

  /* Background */
  --bg:             #FAFAFA;
  --bg-alt:         #F5F2EC;
  --card-bg:        #FFFFFF;
  --navbar-bg:      rgba(255, 255, 255, 0.95);

  /* Text */
  --text:           #1A1A1A;
  --text-muted:     #5C574E;
  --text-light:     #736C5D;

  /* Border & Shadow */
  --border:         #E5DFD2;
  --shadow-sm:      0 2px 8px rgba(0, 0, 0, 0.06);
  --shadow:         0 6px 24px rgba(0, 0, 0, 0.1);
  --shadow-lg:      0 20px 50px rgba(0, 0, 0, 0.14);
  --shadow-card:    0 4px 16px rgba(0, 0, 0, 0.06);

  /* Radius */
  --radius-sm:      8px;
  --radius:         12px;
  --radius-lg:      20px;
  --radius-full:    9999px;

  /* Motion */
  --transition:     0.3s cubic-bezier(0.4, 0, 0.2, 1);

  /* Layout */
  --navbar-h:       72px;

  /* Gradients */
  --grad-primary:   linear-gradient(135deg, #D4A520 0%, #E8C35D 100%);
  --grad-navy:      linear-gradient(135deg, #0F0F0F 0%, #2A2A2A 100%);
  --grad-hero:      linear-gradient(180deg, #FAFAFA 0%, #F5F0E8 50%, #EDE4CC 100%);
}

/* Dark Theme — true dark with warm undertones to preserve brand */
[data-theme="dark"] {
  /* Color scheme for form controls */
  color-scheme: dark;

  /* Surfaces */
  --bg:             #0F0E0C;
  --bg-alt:         #16140F;
  --card-bg:        #1C1915;
  --navbar-bg:      rgba(15, 14, 12, 0.88);

  /* Text — WCAG AA on dark surfaces */
  --text:           #F5EFE0;
  --text-muted:     #A89F8A;
  --text-light:     #8F866F;

  /* Borders */
  --border:         #2A2620;

  /* Brand — brightened for dark surfaces */
  --primary:        #E5B947;
  --primary-dark:   #C99F2D;
  --primary-light:  rgba(229, 185, 71, 0.14);
  --accent:         #E5B947;

  /* Shadows — deeper on dark */
  --shadow-sm:      0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow:         0 4px 16px rgba(0, 0, 0, 0.5);
  --shadow-lg:      0 16px 48px rgba(0, 0, 0, 0.6);
  --shadow-card:    0 2px 8px rgba(0, 0, 0, 0.4);

  /* Gradients */
  --grad-primary:   linear-gradient(135deg, #E5B947 0%, #C99F2D 100%);
  --grad-hero:      linear-gradient(180deg, #0F0E0C 0%, #16140F 60%, #1C1915 100%);
}

/* ── Font Selection ─────────────────────────────────────────── */
[data-lang="ar"],
[data-lang="ar"] * {
  font-family: 'Tajawal', 'Arial', sans-serif;
}

[data-lang="en"],
[data-lang="en"] * {
  font-family: 'Inter', 'Arial', sans-serif;
}

/* ── Reset ──────────────────────────────────────────────────── */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* Enforce hidden attribute — overrides any display value in author styles */
[hidden] { display: none !important; }

html {
  scroll-behavior: smooth;
  font-size: 16px;
  overflow-x: hidden;
  overflow-y: auto;
  width: 100%;
}

body {
  background-color: var(--bg);
  color: var(--text);
  line-height: 1.7;
  transition: background-color var(--transition), color var(--transition);
  overflow-x: hidden;
  width: 100%;
  position: relative;
}

/* Gold bar moved to navbar::before for overflow safety on mobile */

a {
  color: inherit;
  text-decoration: none;
}

/* Skip Link - Accessibility */
.skip-link {
  position: absolute;
  top: -100px;
  inset-inline-start: 0;
  background: var(--primary);
  color: #fff;
  padding: 12px 24px;
  font-weight: 700;
  z-index: 9999;
  transition: top 0.3s ease;
}

.skip-link:focus {
  top: 0;
  outline: 2px solid var(--text);
  outline-offset: 2px;
}

ul { list-style: none; }

img,
svg { display: block; max-width: 100%; }

button { cursor: pointer; border: none; background: none; font-family: inherit; }

input,
textarea,
select {
  font-family: inherit;
  font-size: 1rem;
}

/* ── Utilities ──────────────────────────────────────────────── */
.container {
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 1.5rem;
}

.section {
  padding-block: 120px;
}

.section-header {
  text-align: center;
  margin-bottom: 64px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}

.section-title {
  font-size: clamp(2rem, 2.5vw, 3rem);
  font-weight: 900;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: var(--text);
  cursor: default;
  transition: color 0.35s ease;
}

.section-title:hover {
  color: var(--primary);
}

.section-desc {
  font-size: 1.15rem;
  color: var(--text-muted);
  max-width: 600px;
  line-height: 1.8;
}

/* ── Badge ──────────────────────────────────────────────────── */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 18px 7px 14px;
  background: transparent;
  color: var(--text-muted);
  font-size: 1.05rem;
  font-weight: 700;
  border-radius: 0;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-inline-start: 4px solid var(--primary);
  transition: background 0.3s ease, padding-inline-start 0.3s ease, letter-spacing 0.3s ease;
  cursor: default;
}

.badge:hover {
  background: var(--primary-light);
  padding-inline-start: 20px;
  letter-spacing: 0.14em;
}

/* ── Buttons ─────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 28px;
  border-radius: var(--radius-full);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  transition: all var(--transition);
  white-space: nowrap;
  position: relative;
  overflow: hidden;
}

.btn--primary {
  background: var(--grad-primary);
  color: #fff;
  box-shadow: 0 6px 20px rgba(212,165,32,0.35);
}

.btn--primary:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 36px rgba(212,165,32,0.45);
}

.btn--outline {
  background: transparent;
  color: var(--primary);
  border: 2px solid var(--primary);
}

.btn--outline:hover {
  background: var(--primary);
  color: #fff;
  transform: translateY(-2px);
}

.btn--ghost {
  background: rgba(255,255,255,0.88);
  color: var(--text);
  border: 2px solid var(--border);
  backdrop-filter: blur(8px);
}

[data-theme="dark"] .btn--ghost {
  background: rgba(28, 25, 21, 0.92);
  color: var(--text);
  border-color: var(--border);
}

[data-theme="dark"] .btn--ghost:hover {
  background: var(--primary-light);
  border-color: var(--primary);
  color: var(--primary);
}

.btn--ghost:hover {
  background: var(--primary-light);
  border-color: var(--primary);
  color: var(--primary);
  transform: translateY(-2px);
}

.btn--full {
  width: 100%;
}

/* ── Navbar ─────────────────────────────────────────────────── */
.navbar {
  position: fixed;
  top: 0;
  inset-inline: 0;
  z-index: 1000;
  height: var(--navbar-h);
  background: var(--navbar-bg);
  border-bottom: 1px solid #E3D5BE;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 4px 16px rgba(17,17,17,0.05);
  transition: background var(--transition), box-shadow var(--transition), border-color var(--transition);
}

.navbar::before {
  content: '';
  position: absolute;
  top: 0;
  inset-inline: 0;
  height: 3px;
  background: var(--grad-primary);
  z-index: 1;
}

.navbar.scrolled {
  background: rgba(255,255,255,0.995);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom-color: #DDC8A5;
  box-shadow: 0 10px 28px rgba(17,17,17,0.08);
}

.navbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}

.navbar__logo {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.navbar__logo-mark {
  width: auto;
  height: 48px;
  max-width: 140px;
  object-fit: contain;
  display: block;
  flex-shrink: 0;
}

.navbar__links {
  display: flex;
  align-items: center;
  gap: 4px;
}

.nav-link {
  padding: 8px 14px;
  border-radius: var(--radius-full);
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--text-muted);
  transition: all var(--transition);
}

.nav-link:hover,
.nav-link.active {
  color: var(--primary);
  background: var(--primary-light);
}

.navbar.scrolled .nav-link:hover,
.navbar.scrolled .nav-link.active {
  color: var(--primary);
  background: var(--primary-light);
}

/* Navbar Actions */
.navbar__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.action-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--radius-full);
  background: var(--bg);
  color: var(--text);
  border: 1.5px solid var(--border);
  transition: all var(--transition);
}

.action-btn:hover {
  background: var(--primary-light);
  color: var(--primary);
  border-color: var(--primary);
  transform: scale(1.05);
}

.action-btn svg {
  width: 18px;
  height: 18px;
}

/* Theme button icons */
[data-theme="light"] .icon-moon { display: none; }
[data-theme="dark"]  .icon-sun { display: none; }

/* Language button */
.lang-btn {
  width: auto;
  padding-inline: 12px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}

/* Hamburger */
.hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  gap: 5px;
  border-radius: var(--radius-sm);
  background: var(--bg);
  border: 1.5px solid var(--border);
}

.hamburger span {
  display: block;
  width: 20px;
  height: 2px;
  background: var(--text);
  border-radius: 2px;
  transition: all var(--transition);
}

.hamburger.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.active span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hamburger.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── Hero ────────────────────────────────────────────────────── */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  background: var(--grad-hero);
  overflow: hidden;
  padding-top: var(--navbar-h);
}

.hero__bg-shapes {
  overflow: hidden;
  position: absolute;
  inset: 0;
  pointer-events: none;
  contain: paint;
}

.shape {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
}

.shape--1 {
  width: 500px;
  height: 500px;
  background: #EBCF98;
  opacity: 0.34;
  top: -150px;
  inset-inline-end: -80px;
  animation: float 10s ease-in-out infinite;
}

.shape--2 {
  width: 400px;
  height: 400px;
  background: #C9901F;
  opacity: 0.12;
  bottom: -100px;
  inset-inline-start: -80px;
  animation: float 12s ease-in-out infinite reverse;
}

@keyframes float {
  0%, 100% { transform: translateY(0) scale(1); }
  50%       { transform: translateY(-30px) scale(1.05); }
}

/* Very subtle bg texture */
.hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(17,17,17,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(17,17,17,0.025) 1px, transparent 1px);
  background-size: 80px 80px;
  pointer-events: none;
  z-index: 0;
}

/* Roads SVG */
.hero__roads {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}

/* ── Hero Inner: split layout ────────────────────────────────── */
.hero__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 60px;
  padding-block: 100px 80px;
  position: relative;
  z-index: 1;
  max-width: 1200px;
  margin-inline: auto;
}

/* Text side */
.hero__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(201,144,31,0.12);
  border: 1px solid rgba(201,144,31,0.3);
  color: var(--primary);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  padding: 6px 14px;
  border-radius: 100px;
}

.hero__eyebrow svg { stroke: var(--primary); flex-shrink: 0; }

.hero__title {
  font-size: clamp(2.4rem, 4.6vw, 4.6rem);
  font-weight: 900;
  color: var(--text);
  line-height: 1.3;
  letter-spacing: -0.03em;
}

.hero__title-accent {
  color: var(--primary);
}

.hero__subtitle {
  font-size: 1.05rem;
  color: var(--text-muted);
  max-width: 460px;
  line-height: 1.85;
}

.hero__cta {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  align-items: center;
}

/* ── Hero Visual Card ────────────────────────────────────────── */
.hero__visual-side {
  position: relative;
  display: flex;
  justify-content: center;
}

.hero__card {
  background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(250,248,245,0.98));
  border: 1px solid rgba(212,165,32,0.15);
  border-radius: 24px;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  width: 100%;
  max-width: 440px;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(212,165,32,0.2);
  animation: heroCardFloat 6s ease-in-out infinite;
}

@keyframes heroCardFloat {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-10px); }
}

.hero__card-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--border);
  background: rgba(201,144,31,0.05);
}

.hero__card-dots {
  display: flex;
  gap: 5px;
}

.hero__card-dots span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(17,17,17,0.12);
}

.hero__card-title {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--text-muted);
  flex: 1;
}

.hero__card-live {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 0.72rem;
  color: var(--primary);
  font-weight: 600;
}

.hero__card-live-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--primary);
  animation: pulse-green 2s ease-in-out infinite;
}

/* Services list */
.hero__card-services {
  padding: 8px 0;
}

.hero__card-service {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid rgba(17,17,17,0.06);
  transition: background var(--transition);
}

.hero__card-service:last-child { border-bottom: none; }
.hero__card-service:hover { background: var(--primary-light); }

.hero__card-service-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: var(--bg-alt);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--text-muted);
}

.hero__card-service-icon svg { stroke: var(--text-muted); }

.hero__card-service-icon--gold {
  background: rgba(201,144,31,0.15);
}

.hero__card-service-icon--gold svg { stroke: var(--primary); }

.hero__card-service-icon--purple {
  background: rgba(201,144,31,0.14);
}

.hero__card-service-icon--purple svg { stroke: var(--primary); }

.hero__card-service-text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.hero__card-service-text strong {
  font-size: 0.88rem;
  color: var(--text);
  font-weight: 600;
}

.hero__card-service-text span {
  font-size: 0.75rem;
  color: var(--text-muted);
}

.hero__card-service-badge {
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--primary);
  background: rgba(201,144,31,0.12);
  border-radius: 100px;
  padding: 2px 9px;
  white-space: nowrap;
  flex-shrink: 0;
}

.hero__card-service-badge--gold {
  color: var(--primary);
  background: rgba(201,144,31,0.12);
}

/* Stats footer */
.hero__card-footer {
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 16px 18px;
  border-top: 1px solid var(--border);
  background: rgba(201,144,31,0.06);
}

.hero__card-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.hero__card-stat strong {
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--primary);
  letter-spacing: -0.02em;
  line-height: 1;
}

.hero__card-stat span {
  font-size: 0.7rem;
  color: var(--text-light);
  white-space: nowrap;
}

.hero__card-stat-divider {
  width: 1px;
  height: 28px;
  background: var(--border);
}

/* Floating badge */
.hero__float-badge {
  position: absolute;
  bottom: -18px;
  inset-inline-start: -24px;
  background: #fff;
  border-radius: 100px;
  padding: 10px 16px;
  display: flex;
  align-items: center;
  gap: 7px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.18);
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
  animation: notifFloat 4s ease-in-out infinite;
}

.hero__float-badge svg { stroke: var(--primary); flex-shrink: 0; }

[data-theme="dark"] .hero__card {
  background: linear-gradient(180deg, rgba(28,25,21,0.98), rgba(22,20,15,0.98));
  border-color: rgba(229,185,71,0.12);
  box-shadow: 0 30px 80px rgba(0,0,0,0.5);
}

[data-theme="dark"] .hero__card-header {
  background: rgba(229,185,71,0.08);
  border-bottom-color: var(--border);
}

[data-theme="dark"] .hero__card-dots span {
  background: rgba(255,255,255,0.15);
}

[data-theme="dark"] .hero__card-service {
  border-bottom-color: rgba(255,255,255,0.06);
}

[data-theme="dark"] .hero__card-service-icon {
  background: var(--bg-alt);
}

[data-theme="dark"] .hero__card-service-icon--gold,
[data-theme="dark"] .hero__card-service-icon--purple {
  background: rgba(229,185,71,0.15);
}

[data-theme="dark"] .hero__card-footer {
  background: rgba(229,185,71,0.08);
  border-top-color: var(--border);
}

[data-theme="dark"] .hero__card-stat-divider {
  background: var(--border);
}

[data-theme="dark"] .hero__float-badge {
  background: var(--card-bg);
  box-shadow: 0 8px 32px rgba(0,0,0,0.4);
  color: var(--text);
}

[data-theme="dark"] .navbar {
  border-bottom-color: var(--border);
  box-shadow: 0 4px 16px rgba(0,0,0,0.3);
}

@keyframes notifFloat {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-6px); }
}

/* Hero Wave */
.hero__wave {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  line-height: 0;
}

.hero__wave svg {
  width: 100%;
  height: 80px;
}

/* ── About ───────────────────────────────────────────────────── */
.about {
  background: var(--bg-alt);
}

.about__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 80px;
}

/* ── Steps Visual (About) ────────────────────────────────────── */
.about__visual {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.steps-visual {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  max-width: 420px;
}

.steps-visual__step {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  position: relative;
}

.steps-visual__num {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--primary-light);
  border: 2px solid var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  font-weight: 800;
  color: var(--primary);
  flex-shrink: 0;
  z-index: 1;
  margin-top: 18px;
}

.steps-visual__num--accent {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}

.steps-visual__connector {
  position: absolute;
  inset-inline-start: 19px;
  top: 58px;
  width: 2px;
  height: calc(100% - 20px);
  background: repeating-linear-gradient(
    to bottom,
    var(--border) 0px,
    var(--border) 5px,
    transparent 5px,
    transparent 10px
  );
}

.steps-visual__step--last .steps-visual__connector {
  display: none;
}

.steps-visual__card {
  flex: 1;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 20px 20px;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-block: 8px;
  box-shadow: var(--shadow-card);
  transition: transform var(--transition), box-shadow var(--transition);
}

.steps-visual__card:hover {
  transform: translateX(-4px);
  box-shadow: var(--shadow);
}

.steps-visual__card--dark {
  background: linear-gradient(180deg, rgba(251,243,226,0.92), rgba(255,255,255,0.96));
  border-color: rgba(201,144,31,0.18);
}

.steps-visual__card--dark .steps-visual__text strong {
  color: var(--text);
}

.steps-visual__card--dark .steps-visual__text p {
  color: var(--text-muted);
}

.steps-visual__icon {
  width: 44px;
  height: 44px;
  border-radius: var(--radius);
  background: var(--primary-light);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--primary);
}

.steps-visual__icon svg { stroke: var(--primary); }

.steps-visual__icon--light {
  background: rgba(201,144,31,0.12);
}

.steps-visual__icon--light svg { stroke: var(--primary); }

.steps-visual__text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.steps-visual__text strong {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text);
}

.steps-visual__text p {
  font-size: 0.82rem;
  color: var(--text-muted);
  line-height: 1.5;
}

.steps-visual__tag {
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--primary);
  background: var(--primary-light);
  border-radius: 100px;
  padding: 3px 10px;
  white-space: nowrap;
  align-self: flex-start;
  flex-shrink: 0;
}

.steps-visual__tag--light {
  background: rgba(17,17,17,0.05);
  color: var(--text);
}

.steps-visual__tag--green {
  background: rgba(201,144,31,0.12);
  color: var(--primary-dark);
}

@keyframes pulse-green {
  0%, 100% { box-shadow: 0 0 0 3px rgba(201,144,31,0.24); }
  50%       { box-shadow: 0 0 0 6px rgba(201,144,31,0.1); }
}

/* About Content */
.about__content {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.about__features {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 8px;
}

.about__download {
  margin-top: 24px;
  align-self: flex-start;
  gap: 10px;
  padding: 14px 28px;
  font-size: 0.95rem;
}

[data-theme="dark"] .about__download {
  border-color: var(--primary);
  color: var(--primary);
}

[data-theme="dark"] .about__download:hover {
  background: var(--primary);
  color: var(--navy);
}

.about__feature {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.about__feature-icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--grad-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}

.about__feature-icon svg {
  width: 16px;
  height: 16px;
  color: #fff;
  stroke: #fff;
}

.about__feature h4 {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 4px;
  color: var(--text);
}

.about__feature p {
  font-size: 0.9rem;
  color: var(--text-muted);
}

/* ── Coverage — transparent route with glass pills ───────────── */
.route {
  overflow-x: auto;
}

.route__frame {
  position: relative;
  min-width: 780px;
}

.route__svg {
  display: block;
  width: 100%;
  height: auto;
}

/* thin dotted route line */
.route__line {
  fill: none;
  stroke: var(--primary);
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-dasharray: 0.1 11;
  opacity: 0.45;
}

/* golden trail showing the bus's traveled path */
.route__trail {
  fill: none;
  stroke: var(--primary);
  stroke-width: 3.5;
  stroke-linecap: round;
  opacity: 0.85;
  filter: drop-shadow(0 0 4px rgba(201, 144, 31, 0.45));
}

.route__dot {
  fill: var(--primary);
  stroke: var(--card-bg);
  stroke-width: 2.5;
  opacity: 0.9;
}

/* pulse ring on the active city's dot */
@keyframes dotRing {
  0%, 100% { stroke-width: 2.5; stroke: var(--card-bg); }
  50%      { stroke-width: 8;   stroke: var(--primary); }
}

.route__frame:has(.city--1:is(:hover,
:focus-visible)) .route__dot:nth-of-type(1),
.route__frame:has(.city--2:is(:hover,
:focus-visible)) .route__dot:nth-of-type(2),
.route__frame:has(.city--3:is(:hover,
:focus-visible)) .route__dot:nth-of-type(3),
.route__frame:has(.city--4:is(:hover,
:focus-visible)) .route__dot:nth-of-type(4),
.route__frame:has(.city--5:is(:hover,
:focus-visible)) .route__dot:nth-of-type(5),
.route__frame:has(.city--6:is(:hover,
:focus-visible)) .route__dot:nth-of-type(6),
.route__frame:has(.city--7:is(:hover,
:focus-visible)) .route__dot:nth-of-type(7) {
  animation: dotRing 1.1s ease-in-out infinite;
}

/* glass city pills */
.city {
  position: absolute;
  left: var(--cx);
  top: var(--cy);
  transform: translate(-50%, calc(-100% - 55px));
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 16px;
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.45);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.65);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.05);
  cursor: pointer;
  white-space: nowrap;
  transition: transform var(--transition), background var(--transition), box-shadow var(--transition), border-color var(--transition);
  z-index: 2;
}

/* connector from pill down to its dot */
.city::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  height: 50px;
  background: var(--primary);
  opacity: 0.45;
  transition: opacity var(--transition);
}

.city__icon {
  color: var(--primary);
  flex-shrink: 0;
  transition: color var(--transition);
}

.city__name {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--text);
  transition: color var(--transition);
}

/* active city: solid gold pill */
.city:is(:hover,
:focus-visible) {
  background: var(--primary);
  border-color: rgba(255, 255, 255, 0.4);
  transform: translate(-50%, calc(-100% - 55px)) scale(1.08);
  box-shadow: 0 10px 26px rgba(201, 144, 31, 0.35);
}

.city:is(:hover,
:focus-visible) .city__name,
.city:is(:hover,
:focus-visible) .city__icon {
  color: #fff;
}

.city:is(:hover,
:focus-visible)::after {
  opacity: 1;
}

[data-theme="dark"] .city {
  background: rgba(18, 24, 36, 0.5);
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
}

[data-theme="dark"] .city:is(:hover,
:focus-visible) {
  background: var(--primary);
}

/* bus — positioned & animated by route-tour.js (works in all browsers) */
.route__bus-art {
  animation: busBob 1.1s ease-in-out infinite;
}

@keyframes busBob {
  0%, 100% { translate: 0 0; }
  50%      { translate: 0 -2px; }
}

@media (prefers-reduced-motion: reduce) {
  .route__bus-art { animation: none; }}

/* ── Services ────────────────────────────────────────────────── */
.services {
  background: var(--bg);
}

.services__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.service-card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  position: relative;
  overflow: hidden;
  transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

.service-card::after {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  top: 0;
  width: 3px;
  height: 0;
  background: var(--grad-primary);
  transition: height 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  border-radius: 0 0 3px 3px;
}

.service-card:hover::after {
  height: 100%;
}

.service-card:hover {
  border-color: rgba(201,144,31,0.35);
  box-shadow: 0 12px 40px rgba(201,144,31,0.1), 0 2px 8px rgba(0,0,0,0.08);
  transform: translateY(-6px);
}

.service-card__icon {
  width: 60px;
  height: 60px;
  background: var(--primary-light);
  border-radius: var(--radius-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  flex-shrink: 0;
  transition: background var(--transition), transform var(--transition);
}

.service-card:hover .service-card__icon {
  background: var(--grad-primary);
  transform: scale(1.08);
}

.service-card:hover .service-card__icon svg {
  stroke: #fff;
}

.service-card__icon svg {
  width: 24px;
  height: 24px;
  stroke: var(--primary);
  transition: stroke var(--transition);
}

.service-card__title {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text);
}

.service-card__desc {
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.7;
}

/* ── Pricing / Subscription Calculator ──────────────────────── */
.pricing {
  background: var(--bg-alt);
}

/* ── Contact ─────────────────────────────────────────────────── */
.contact {
  background: var(--bg);
}

.contact__inner {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 80px;
  align-items: start;
}

.contact__info {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.contact__details {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 8px;
}

.contact__details li {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 0.95rem;
  color: var(--text-muted);
}

.contact__detail-icon {
  width: 44px;
  height: 44px;
  border-radius: var(--radius);
  background: var(--primary-light);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.contact__detail-icon svg {
  width: 18px;
  height: 18px;
  stroke: var(--primary);
}

.contact__detail-info {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  gap: 4px;
  flex-wrap: wrap;
  flex: 1;
}

.contact__detail-info strong,
.contact__detail-value {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.02em;
  vertical-align: baseline;
  line-height: 1.2;
}

.contact__detail-separator {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--primary);
  margin-inline: 4px;
  vertical-align: middle;
  line-height: 1;
}

.contact__detail-label {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-muted);
  margin-inline-end: 4px;
  flex-shrink: 0;
}

.contact__detail-info small {
  font-size: 0.8rem;
  color: var(--text-light);
  font-weight: 500;
}

.contact__map-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 0;
  margin-inline-start: 4px;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--primary);
  text-decoration: none;
  transition: all var(--transition);
  vertical-align: baseline;
  line-height: 1.2;
}

.contact__map-link:hover {
  color: var(--primary-dark);
}

.contact__map-link svg {
  stroke: var(--primary);
  flex-shrink: 0;
  vertical-align: middle;
}

.contact__socials {
  display: flex;
  gap: 12px;
  margin-top: 4px;
}

.social-btn {
  width: 44px;
  height: 44px;
  border-radius: var(--radius);
  background: var(--bg-alt);
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
  transition: all var(--transition);
}

.social-btn:hover {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
  transform: translateY(-2px);
}

.social-btn svg { width: 18px; height: 18px; }

/* Contact Form */
.contact__form-wrap {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 40px;
  box-shadow: var(--shadow);
}

.contact-form {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.form-group label {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
}

.form-group input,
.form-group textarea {
  width: 100%;
  padding: 14px 18px;
  background: var(--bg-alt);
  border: 1.5px solid var(--border);
  border-radius: var(--radius);
  color: var(--text);
  font-size: 1rem;
  transition: all var(--transition);
  resize: vertical;
}

.form-group input:focus,
.form-group textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(201,144,31,0.12);
  background: var(--bg);
}

.form-group input:focus-visible,
.form-group textarea:focus-visible {
  outline: 2.5px solid var(--primary-dark);
  outline-offset: 2px;
}

.form-group input::placeholder,
.form-group textarea::placeholder {
  color: var(--text-light);
}

.contact-form .btn {
  margin-top: 4px;
}

.form-success {
  color: var(--primary-dark);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  min-height: 20px;
  opacity: 0;
  transition: opacity var(--transition);
}

.form-success.visible {
  opacity: 1;
}

/* ── Footer ──────────────────────────────────────────────────── */
.footer {
  background: var(--bg-alt);
  border-top: 1px solid var(--border);
  padding-top: 60px;
}

.footer__inner {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 40px;
  padding-bottom: 48px;
}

.footer__brand {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.footer__trusted-logos {
  display: flex;
  align-items: center;
  gap: 8px;
}

.footer__trusted-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.footer__trusted-label {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
}

.footer__trusted-logos img {
  height: 94px;
  width: auto;
  opacity: 1;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.18));
  transition: transform var(--transition), opacity var(--transition);
}

.footer__trusted-logos img:hover {
  transform: translateY(-2px) scale(1.03);
  opacity: 1;
}

.footer__brand p {
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.8;
  max-width: 280px;
}

.footer__col {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.footer__col h4 {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.02em;
}

.footer__col ul {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer__col ul li a {
  font-size: 0.88rem;
  color: var(--text-muted);
  transition: color var(--transition);
}

.footer__col ul li a:hover {
  color: var(--primary);
}

.footer__bottom {
  border-top: 1px solid var(--border);
  padding-block: 20px;
  text-align: center;
}

.footer__bottom p {
  font-size: 0.85rem;
  color: var(--text-light);
}

/* ══════════════════════════════════════════════════════════════
   SCROLL-TO-TOP BUTTON
   ══════════════════════════════════════════════════════════════ */
#scrollToTop {
  position: fixed;
  bottom: 32px;
  inset-inline-end: 32px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--grad-primary);
  color: #fff;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 20px rgba(201,144,31,0.42);
  z-index: 900;
  opacity: 0;
  transform: translateY(12px) scale(0.85);
  pointer-events: none;
  transition: opacity 0.3s, transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
  will-change: transform, opacity;
}

#scrollToTop.visible {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

#scrollToTop:hover {
  transform: translateY(-4px) scale(1.08);
  box-shadow: 0 8px 28px rgba(201,144,31,0.52);
}

#scrollToTop:active {
  transform: scale(0.94);
}

/* ══════════════════════════════════════════════════════════════
   FOCUS-VISIBLE  (keyboard accessibility)
   ══════════════════════════════════════════════════════════════ */
:focus-visible {
  outline: 2.5px solid var(--primary);
  outline-offset: 3px;
  border-radius: 4px;
}

*:focus:not(:focus-visible) {
  outline: none;
}

/* Button focus state - enhanced visibility */
.btn:focus-visible,
.nav-link:focus-visible {
  outline: 2.5px solid var(--primary);
  outline-offset: 2px;
  box-shadow: 0 0 0 6px rgba(212, 165, 32, 0.25);
}

/* ── Accessibility: Reduced Motion ───────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *,
*::before,
*::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }}

/* ══════════════════════════════════════════════════════════════
   CONTACT FORM — loading button state
   ══════════════════════════════════════════════════════════════ */
.btn.loading {
  position: relative;
  cursor: wait;
  opacity: 0.8;
}

.btn.loading::after {
  content: '';
  position: absolute;
  inset-inline-end: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255,255,255,0.4);
  border-top-color: #fff;
  border-radius: 50%;
  animation: btnSpin 0.7s linear infinite;
}

@keyframes btnSpin {
  to { transform: translateY(-50%) rotate(360deg); }
}

/* ══════════════════════════════════════════════════════════════
    PERFORMANCE HINTS — promoted layers for animated elements
    ══════════════════════════════════════════════════════════════ */
.shape,
.hero__card,
.hero__float-badge {
  will-change: transform;
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* ══════════════════════════════════════════════════════════════
   SELECTION COLOR
   ══════════════════════════════════════════════════════════════ */
::selection {
  background: rgba(201,144,31,0.22);
  color: var(--text);
}

/* Defensive: prevent nested duplicated track from rendering second row */

@keyframes clientsScrollFwd {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ══════════════════════════════════════════════════════════════
   CONTACT TABS
   ══════════════════════════════════════════════════════════════ */
.contact-tabs {
  display: flex;
  gap: 4px;
  background: var(--bg-alt);
  border-radius: var(--radius);
  padding: 4px;
  margin-bottom: 24px;
}

.contact-tab {
  flex: 1;
  padding: 10px 12px;
  border: none;
  border-radius: calc(var(--radius) - 4px);
  background: transparent;
  color: var(--text-muted);
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--transition);
  white-space: nowrap;
}

.contact-tab:hover {
  color: var(--primary);
  background: var(--bg);
}

.contact-tab.active {
  background: var(--card-bg);
  color: var(--primary);
  box-shadow: var(--shadow-sm);
}

.contact-panel {
  animation: fadeSlideIn 0.25s ease;
}

@keyframes fadeSlideIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Re-use contact-form styles for all 3 panels */
.contact-panel .contact-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Select wrapper inside contact forms */
.contact-panel .select-wrap {
  position: relative;
}

.contact-panel .select-wrap::after {
  content: '';
  position: absolute;
  inset-inline-end: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid var(--text-muted);
  pointer-events: none;
}

.contact-panel .select-wrap select {
  width: 100%;
  padding: 12px 16px;
  padding-inline-end: 40px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg);
  color: var(--text);
  font-size: 0.95rem;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  transition: border-color var(--transition);
}

.contact-panel .select-wrap select:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(201,144,31,0.1);
}

.contact-panel .select-wrap select:focus-visible {
  outline: 2.5px solid var(--primary-dark);
  outline-offset: 2px;
}

/* ── prefers-color-scheme auto detection ─────────────────────── */
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) {
    --bg:             #0F0E0C;
    --bg-alt:         #16140F;
    --card-bg:        #1C1915;
    --navbar-bg:      rgba(15, 14, 12, 0.88);
    --text:           #F5EFE0;
    --text-muted:     #A89F8A;
    --text-light:     #8F866F;
    --border:         #2A2620;
    --primary:        #E5B947;
    --primary-dark:   #C99F2D;
    --primary-light:  rgba(229, 185, 71, 0.14);
    --accent:         #E5B947;
    --shadow-sm:      0 1px 2px rgba(0, 0, 0, 0.4);
    --shadow:         0 4px 16px rgba(0, 0, 0, 0.5);
    --shadow-lg:      0 16px 48px rgba(0, 0, 0, 0.6);
    --shadow-card:    0 2px 8px rgba(0, 0, 0, 0.4);
    --grad-primary:   linear-gradient(135deg, #E5B947 0%, #C99F2D 100%);
    --grad-hero:      linear-gradient(180deg, #0F0E0C 0%, #16140F 60%, #1C1915 100%);
  }}

/* ── Scroll Reveal base ──────────────────────────────────────── */
[data-reveal] {
  opacity: 0;
  will-change: opacity, transform;
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
[data-reveal="up"] { transform: translateY(60px); }
[data-reveal="down"] { transform: translateY(-30px); }
[data-reveal="left"] { transform: translateX(-60px); }
[data-reveal="right"] { transform: translateX(60px); }
[data-reveal="zoom"] { transform: scale(0.85); }

[data-reveal].revealed {
  opacity: 1;
  transform: translate(0) scale(1);
}

/* ── Section header reveal — stronger & more cinematic ──────── */
.section-header[data-reveal="up"],
.about__content[data-reveal="left"],
.contact__info .badge,
.contact__info .section-title {
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}

.section-header.revealed .badge {
  animation: badgePop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) 0.1s both;
}

.section-header.revealed .section-title {
  animation: titleSlide 0.7s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both;
}

.section-header.revealed .section-desc {
  animation: titleSlide 0.7s cubic-bezier(0.16, 1, 0.3, 1) 0.35s both;
}

@keyframes badgePop {
  0%   { opacity: 0; transform: translateX(20px) scale(0.85); }
  100% { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes titleSlide {
  0%   { opacity: 0; transform: translateY(30px); }
  100% { opacity: 1; transform: translateY(0); }
}

[data-delay="0"] { transition-delay: 0ms; }
[data-delay="100"] { transition-delay: 100ms; }
[data-delay="150"] { transition-delay: 150ms; }
[data-delay="200"] { transition-delay: 200ms; }
[data-delay="250"] { transition-delay: 250ms; }
[data-delay="300"] { transition-delay: 300ms; }
[data-delay="350"] { transition-delay: 350ms; }
[data-delay="400"] { transition-delay: 400ms; }
[data-delay="500"] { transition-delay: 500ms; }

/* ── Hero entrance (runs on page load, no JS needed) ─────────── */
.hero__eyebrow {
  animation: heroFadeUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.05s both;
}
.hero__content > * {
  animation: heroFadeUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.hero__content .hero__title { animation-delay: 0.2s;  }
.hero__content .hero__subtitle { animation-delay: 0.35s; }
.hero__content .hero__cta { animation-delay: 0.5s;  }

@keyframes heroFadeUp {
  from { opacity: 0; transform: translateY(40px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Badge shimmer ───────────────────────────────────────────── */
.badge {
  position: relative;
  overflow: hidden;
}
.badge::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,0.45) 50%, transparent 60%);
  background-size: 200% 100%;
  background-position: 200% 0;
  animation: badgeShimmer 3s ease-in-out 1s infinite;
}
@keyframes badgeShimmer {
  0%   { background-position: 200% 0; }
  40%  { background-position: -200% 0; }
  100% { background-position: -200% 0; }
}

/* ── Button ripple ───────────────────────────────────────────── */
.btn {
  overflow: hidden;
  position: relative;
}
.ripple-wave {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  transform: scale(0);
  animation: rippleExpand 0.6s linear forwards;
  pointer-events: none;
}
@keyframes rippleExpand {
  to { transform: scale(4); opacity: 0; }
}

/* ── Navbar entrance ─────────────────────────────────────────── */
.navbar {
  animation: navbarDrop 0.6s cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes navbarDrop {
  from { transform: translateY(-100%); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

/* ── Reduced motion override ─────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  [data-reveal],
.hero__content > *,
.hero__eyebrow,
.navbar,
.badge::after {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }}

/* ============================================================
   Dark mode — component-level overrides
   Only patch surfaces/borders/colors that don't auto-adapt via
   CSS variables (e.g. hardcoded gradients, rgba whites, etc).
   ============================================================ */
[data-theme="dark"] body {
  background: var(--bg);
}

[data-theme="dark"] .hero {
  background: var(--grad-hero);
}

[data-theme="dark"] .navbar.scrolled {
  background: var(--navbar-bg);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  border-bottom: 1px solid var(--border);
}

[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select {
  background: var(--bg-alt);
  color: var(--text);
  border-color: var(--border);
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: var(--text-light);
}

[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus {
  border-color: var(--primary);
  background: var(--card-bg);
}

/* Plan cards — featured variant uses a hardcoded gradient */

[data-theme="dark"] .contact__detail-info strong,
[data-theme="dark"] .contact__detail-value {
  color: var(--text);
}

[data-theme="dark"] .contact__detail-separator {
  color: var(--primary);
}

[data-theme="dark"] .contact__detail-label {
  color: var(--text-muted);
}

[data-theme="dark"] .contact__detail-info small {
  color: var(--text-light);
}

[data-theme="dark"] .contact__map-link {
  color: var(--primary);
}

[data-theme="dark"] .contact__map-link:hover {
  color: var(--primary-dark);
}

/* Mobile menu uses hardcoded white in responsive.css */
[data-theme="dark"] .navbar__links {
  background: rgba(28, 25, 21, 0.98) !important;
  border-color: var(--border) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.5) !important;
}

/* Footer trusted logos with white-bg cards */
[data-theme="dark"] .footer__trusted-logos img {
  filter: brightness(0.95) invert(0.92);
}

/* Steps visual cards */
[data-theme="dark"] .steps-visual__card--dark {
  background: #14110D;
}

/* Skip link visibility on dark */
[data-theme="dark"] .skip-link {
  background: var(--primary);
  color: var(--navy);
}

/* ── Tablet: ≤ 1024px ────────────────────────────────────────── */
@media (max-width: 1024px) {

  /* Hero */
  .hero__inner {
    grid-template-columns: 1fr;
    gap: 48px;
    padding-block: 80px 60px;
  }

  .hero__content {
    align-items: center;
    text-align: center;
  }

  .hero__subtitle { margin-inline: auto; }
  .hero__cta { justify-content: center; }

.hero__visual-side { max-width: 440px; margin-inline: auto; }
  .hero__float-badge { inset-inline-start: 0; }

  /* About */
  .about__inner {
    grid-template-columns: 1fr;
    gap: 48px;
    text-align: center;
  }

.about__features {
    text-align: start;
  }

  /* Services */
  .services__grid {
    grid-template-columns: repeat(2, 1fr);
  }

/* Contact */
  .contact__inner {
    grid-template-columns: 1fr;
    gap: 48px;
  }

  /* Footer */
  .footer__inner {
    grid-template-columns: 1fr 1fr;
    gap: 32px;
  }

  .footer__brand {
    grid-column: 1 / -1;
  }

  .footer__trusted-logos {
    flex-wrap: wrap;
  }

  .footer__trusted-row {
    flex-wrap: wrap;
  }}

/* ── Mobile: ≤ 768px ─────────────────────────────────────────── */
@media (max-width: 768px) {

  /* Navbar */
  .hamburger {
    display: flex;
  }

  .navbar__links {
    position: fixed;
    top: var(--navbar-h);
    inset-inline: 0;
    background: rgba(255,255,255,0.995);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid #E3D5BE;
    flex-direction: column;
    align-items: stretch;
    padding: 16px;
    gap: 4px;
    transform: translateY(-120%);
    opacity: 0;
    pointer-events: none;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 14px 34px rgba(17,17,17,0.10);
    z-index: 999;
  }

  .navbar__links.open {
    transform: translateY(0);
    opacity: 1;
    pointer-events: all;
  }

  .nav-link {
    color: var(--text-muted) !important;
    padding: 14px 18px;
    border-radius: var(--radius);
    font-size: 1rem;
    text-align: start;
  }

  .nav-link:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: -2px;
  }

  .nav-link:hover,
.nav-link.active {
    color: var(--primary) !important;
    background: var(--primary-light) !important;
  }

  /* Hero */
  .hero__inner {
    padding-block: 60px 60px;
  }

/* Services */
  .services__grid {
    grid-template-columns: 1fr;
  }

/* Contact form */
  .contact__form-wrap {
    padding: 28px 20px;
  }

  /* About — stack steps vertically tighter */
  .steps-visual__card {
    flex-direction: column;
    align-items: stretch;
    padding: 14px;
  }

.steps-visual__tag {
    align-self: flex-start;
  }

.footer__trusted-logos img {
    height: 70px;
  }

  .footer__trusted-row {
    justify-content: center;
  }

  /* Footer */
  .footer__inner {
    grid-template-columns: 1fr;
  }

  .footer__brand {
    grid-column: auto;
  }

  /* Section spacing */
  .section {
    padding-block: 64px;
  }

  .section-header {
    margin-bottom: 40px;
  }

  /* About — steps card adjustments */
  .steps-visual__card {
    padding: 16px;
    gap: 10px;
  }

  .steps-visual__tag {
    font-size: 0.6rem;
    padding: 3px 8px;
  }

  .steps-visual__num {
    width: 32px;
    height: 32px;
    font-size: 0.85rem;
    margin-top: 14px;
  }

  .steps-visual__connector {
    inset-inline-start: 15px;
    top: 48px;
  }

  .about__feature {
    gap: 10px;
  }

  .about__feature-icon {
    width: 36px;
    height: 36px;
    font-size: 0.9rem;
  }

  .about__download {
    align-self: center;
  }

  .route__frame {
    min-width: 720px;
  }

  .city {
    padding: 6px 12px;
  }

  .city__name {
    font-size: 0.82rem;
  }

  /* Clients — smaller pills */

}

/* ── Small Mobile: ≤ 480px ───────────────────────────────────── */
@media (max-width: 480px) {

  .container {
    padding-inline: 1rem;
  }

  .hero__title {
    font-size: 1.75rem;
  }

  .hero__cta {
    flex-direction: column;
    align-items: stretch;
  }

  .hero__cta .btn {
    width: 100%;
    justify-content: center;
  }

.service-card {
    padding: 28px 20px;
  }

  /* Calculator */

.contact__details li {
    font-size: 0.88rem;
  }

  .section-title {
    font-size: 1.6rem;
  }

/* Buttons — full touch targets */
  .btn {
    min-height: 44px;
  }

/* Hero trusted logos — smaller */
  .hero__float-badge {
    inset-inline-start: 0;
    bottom: -12px;
  }

/* Section spacing — tighter */
  .section {
    padding-block: 48px;
  }

  .section-header {
    margin-bottom: 32px;
  }

  /* About — tighter content */
  .about__feature {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .steps-visual__card {
    flex-direction: column;
    align-items: stretch;
    padding: 12px;
    gap: 8px;
  }

/* Footer — reduce logo height */
  .footer__trusted-logos img {
    height: 50px;
  }}

/* ── Mobile overflow prevention ─────────────────────────────── */
@media (max-width: 768px) {
  .hero__bg-shapes {
    contain: paint;
    overflow: hidden;
  }}

/* ── Very small mobile: ≤ 400px ──────────────────────────────── */
@media (max-width: 400px) {

  .container {
    padding-inline: 0.75rem;
  }

  .hero__title {
    font-size: 1.5rem;
  }

.reg-step {
    min-width: 44px;
  }

  .reg-step__circle {
    width: 30px;
    height: 30px;
  }

  .reg-step__line {
    min-width: 8px;
  }

/* Payment — collapse two-column row */
  }

/* ── Reduced Motion ──────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *,
*::before,
*::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }}

/* ── Contact Tabs ────────────────────────────────────────────── */
@media (max-width: 768px) {
  .contact-tabs {
    gap: 6px;
  }

  .contact-tab {
    font-size: 0.82rem;
    padding: 8px 14px;
  }}

@media (max-width: 480px) {
  .contact-tabs {
    flex-direction: column;
  }

  .contact-tab {
    width: 100%;
    text-align: center;
  }}

/* Shared presentation layer; existing forms and integration contracts are retained. */
:root { --brand-ink: #242b29; --brand-gold: #916b12; }
[data-theme="dark"] { --brand-ink: #f5f1e7; --brand-gold: #e6c468; }
.hero__roads { opacity: .23; }
.hero__content { gap: 22px; }
.hero__title { font-size: clamp(2.1rem, 4vw, 3.7rem); line-height: 1.4; letter-spacing: -.025em; }
.hero__title-accent, .hero__eyebrow { color: var(--brand-gold); }
.hero__subtitle { font-size: 1.1rem; max-width: 36rem; }
.hero__cta .btn { min-height: 50px; }
.btn--primary { color: #242015; }
.hero__trust { display: flex; flex-wrap: wrap; gap: 8px 20px; color: var(--text-muted); font-size: .88rem; }
.hero__trust span::before { content: '✓'; margin-inline-end: 7px; color: var(--brand-gold); font-weight: 800; }
.hero__card { transform: none; }
.hero__card-live-dot { animation: none; }
.hero__card-stat strong { color: var(--brand-gold); }
.journeys { padding-block: 72px; background: var(--bg-alt); }
.journeys__heading { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 32px; }
.journeys__heading .section-title { margin-bottom: 0; }
.journeys__heading p { max-width: 32rem; color: var(--text-muted); line-height: 1.9; }
.journeys__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.journey { padding: 36px; background: var(--card-bg); border: 1px solid var(--border); border-radius: 20px; position: relative; }
.journey__number { display: block; color: var(--brand-gold); font-family: Inter, sans-serif; font-weight: 700; font-size: .85rem; margin-bottom: 20px; }
.journey h3 { font-size: 1.65rem; margin-bottom: 12px; color: var(--brand-ink); }
.journey p { color: var(--text-muted); line-height: 1.9; margin-bottom: 24px; }
.text-link { color: var(--brand-gold); font-weight: 700; text-decoration: underline; text-underline-offset: 6px; }
.text-link:focus-visible, summary:focus-visible { outline: 3px solid var(--brand-gold); outline-offset: 5px; }
.faq { max-width: 880px; margin-inline: auto; }
.faq details { border-bottom: 1px solid var(--border); padding-block: 20px; }
.faq summary { cursor: pointer; font-weight: 700; color: var(--text); line-height: 1.7; }
.faq details p { color: var(--text-muted); line-height: 1.95; padding-top: 14px; }
.service-hero { padding-block: calc(var(--navbar-h) + 64px) 64px; background: var(--bg-alt); }
.service-hero h1 { max-width: 850px; font-size: clamp(2rem, 5vw, 3.5rem); line-height: 1.4; margin-block: 20px; color: var(--brand-ink); }
.service-hero .section-desc { max-width: 700px; margin-bottom: 28px; }
.service-hero .hero__cta { margin-top: 26px; }
.service-body { max-width: 900px; }
.service-body h2 { margin-block: 40px 16px; font-size: 1.8rem; }
.service-body p, .service-body li { line-height: 2; color: var(--text-muted); }
.service-body ul, .service-body ol { padding-inline-start: 24px; list-style: revert; }
.service-body li { margin-block: 8px; }
.service-note { margin-block: 28px; padding: 24px; border-inline-start: 4px solid var(--brand-gold); background: var(--bg-alt); border-radius: 8px; }
.reg-audience-note { max-width: 760px; margin: 20px auto 0; text-align: center; padding-inline: 20px; color: var(--text-muted); }
.about__feature h3 { font-size: 1rem; font-weight: 700; margin-bottom: 4px; color: var(--text); }
@media (max-width: 768px) {
  .hero__inner { padding-block: 42px 50px; gap: 38px; }
  .hero__content { gap: 18px; }
  .hero__title { font-size: clamp(1.85rem, 6.4vw, 2.65rem); }
  .hero__subtitle { font-size: 1rem; line-height: 1.85; }
  .hero__cta { width: 100%; }
  .hero__cta .btn { flex: 0 1 auto; width: 100%; justify-content: center; }
  .hero__trust { justify-content: center; font-size: .82rem; }
  .journeys { padding-block: 48px; }
  .journeys__heading { display: block; }
  .journeys__heading p { margin-top: 16px; }
  .journeys__grid { grid-template-columns: 1fr; }
  .journey { padding: 26px; }
  .service-hero { padding-block: calc(var(--navbar-h) + 40px) 40px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  [data-reveal] { opacity: 1 !important; transform: none !important; }
}

/* WOSOL editorial identity: real fleet imagery, clear routes, restrained gold. */
.editorial-site { --forest:#153c37; --forest-deep:#102d29; --gold:#e1b84d; --paper:#faf8f2; --ink:#183b35; --soft:#5c6963; background:var(--paper); color:var(--ink); }
[data-theme="dark"] .editorial-site { --paper:#132521; --ink:#f5f1e6; --soft:#c2ccc5; --card-bg:#1b302b; --bg:#132521; --bg-alt:#1b302b; --text:#f5f1e6; --text-muted:#c2ccc5; --border:#3c5049; }
.editorial-site .container { width:min(1200px,calc(100% - 64px)); }
.editorial-site .navbar { background:var(--paper); border-top:3px solid var(--gold); border-bottom:1px solid var(--border); box-shadow:none; }
.editorial-site .navbar__inner nav { flex:1; }
.editorial-site .navbar__links { justify-content:center; }
.editorial-site .nav-link { color:var(--soft); font-weight:700; }
.editorial-site .navbar__logo-mark { height:44px; }
[data-theme="dark"] .editorial-site .navbar { background:var(--paper); }
[data-theme="dark"] .editorial-site .navbar__logo-mark,
.editorial-site .footer .navbar__logo-mark { background:#fff; padding:5px; border-radius:4px; }
.editorial-site .btn { border-radius:6px; min-height:52px; padding:14px 24px; font-weight:700; box-shadow:none; font-size:.96rem; text-align:center; justify-content:center; }
.editorial-site .btn--primary { background:var(--gold); color:#19372e; border:1px solid var(--gold); }
.editorial-site .btn--primary:hover { background:#efd084; transform:translateY(-2px); }
.editorial-site .btn--ghost { color:inherit; background:transparent; border:1px solid currentColor; }
.editorial-site .text-link { color:#826211; font-size:1rem; line-height:1.8; display:inline-block; }
[data-theme="dark"] .editorial-site .text-link { color:var(--gold); }
.editorial-site :is(h1,h2,h3) { letter-spacing:-.025em; }
.eyebrow { font-size:.78rem; font-weight:700; letter-spacing:.07em; line-height:1.7; margin-bottom:18px; }
.flagship-hero { margin-top:var(--navbar-h); padding-block:64px 68px; background:var(--forest); color:#fcf9ed; }
.flagship-hero__grid { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.flagship-hero h1 { font-size:clamp(2.8rem,4.6vw,4.4rem); font-weight:800; line-height:1.35; margin-bottom:26px; }
.flagship-hero h1 em { font-style:normal; color:var(--gold); }
.flagship-hero .eyebrow { color:#ecd795; }
.flagship-hero__intro { color:#d9e4dc; font-size:1.12rem; line-height:2; max-width:35rem; }
.action-row { display:flex; gap:12px; flex-wrap:wrap; margin-block:28px; }
.hero-caption { display:flex; flex-wrap:wrap; gap:12px 22px; padding-top:20px; border-top:1px solid #ffffff2b; font-size:.8rem; color:#cbd8d0; line-height:1.8; }
.flagship-hero__photo { position:relative; margin:0; align-self:stretch; min-height:460px; overflow:hidden; border-radius:8px; }
.flagship-hero__photo img { width:100%; height:100%; position:absolute; object-fit:cover; object-position:48% center; }
.flagship-hero__photo::after { content:''; position:absolute; inset:40% 0 0; background:linear-gradient(transparent,#091d19df); }
.flagship-hero__photo figcaption { position:absolute; inset-inline:30px; bottom:30px; z-index:1; }
.flagship-hero__photo figcaption span { display:block; font-size:.72rem; letter-spacing:.12em; margin-bottom:12px; color:#e8d495; }
.flagship-hero__photo figcaption strong { font-size:1.65rem; line-height:1.5; }
.quick-routes { background:#efece3; border-bottom:1px solid #deddd2; }
[data-theme="dark"] .quick-routes { background:#1b302b; border-color:#3c5049; }
.quick-routes__grid { display:grid; grid-template-columns:repeat(3,1fr); }
.quick-routes__grid>a { display:flex; align-items:center; gap:18px; padding:30px 24px; border-inline-end:1px solid #d5d6ca; color:var(--ink); }
.quick-routes__grid>a:last-child { border-inline-end:0; }
.quick-routes__grid>a:hover { background:#e2ddcd; }
[data-theme="dark"] .quick-routes__grid>a:hover { background:#27463c; }
.route-number { font-family:Inter,sans-serif; color:#947a3b; font-size:.75rem; align-self:start; }
.quick-routes small { color:var(--soft); font-size:.72rem; }
.editorial-site .quick-routes h2 { font-size:1.17rem; line-height:1.5; margin:5px 0 0; }
.route-arrow { margin-inline-start:auto; font-size:1.35rem; color:#947a3b; }
[dir="rtl"] .route-arrow { transform:scaleX(-1); }
.editorial-section { padding-block:90px; }
.split-story { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.story-photo { position:relative; }
.story-photo img { width:100%; aspect-ratio:1.12; object-fit:cover; border-radius:6px; }
.photo-label { display:inline-block; position:absolute; bottom:24px; inset-inline-start:24px; color:#fff; background:#153c37ed; padding:10px 16px; font-size:.8rem; }
.story-copy .eyebrow,.section-heading .eyebrow,.faq-layout .eyebrow { color:#8d6d1c; }
.editorial-site h2 { font-size:clamp(1.8rem,3.1vw,2.7rem); line-height:1.5; margin-bottom:20px; font-weight:800; }
.story-copy>p:not(.eyebrow),.section-heading>p { color:var(--soft); font-size:1.05rem; line-height:2; }
.checklist { margin-block:24px; }
.checklist li { display:flex; gap:12px; align-items:baseline; padding-block:10px; border-bottom:1px solid var(--border); color:var(--soft); line-height:1.7; }
.checklist li::before { content:'✓'; color:#8d6d1c; font-weight:800; }
.corporate-section { background:var(--forest-deep); color:#fcf9ed; padding-block:86px; }
.section-heading { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:80px; margin-bottom:40px; }
.corporate-section .eyebrow { color:#e3c773; }
.corporate-section .section-heading>p { color:#cbd8d0; }
.city-stories { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid #ffffff36; border-bottom:1px solid #ffffff36; }
.city-stories article { padding:34px 0; }
.city-stories article+article { padding-inline-start:44px; border-inline-start:1px solid #ffffff36; }
.city-stories article:first-child { padding-inline-end:44px; }
.city-stories h3 { font-size:1.75rem; margin-bottom:14px; }
.city-stories p { color:#cbd8d0; line-height:1.95; margin-bottom:22px; }
.corporate-section .text-link { color:#e7c56d; }
.national-link { display:flex; justify-content:space-between; gap:20px; margin-top:26px; color:#cbd8d0; }
.fleet-gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.fleet-gallery figure { margin:0; }
.fleet-gallery img { width:100%; aspect-ratio:1.5; object-fit:cover; border-radius:5px; }
.fleet-gallery figcaption { padding-top:16px; font-weight:700; }
.process-section { background:#eeeae0; }
[data-theme="dark"] .process-section { background:#1b302b; }
.process-list { display:grid; grid-template-columns:repeat(3,1fr); gap:38px; list-style:none; }
.process-list li { border-top:1px solid #b5bcb0; padding-top:24px; }
.process-list span { color:#8d6d1c; font-family:Inter,sans-serif; font-size:.85rem; }
.process-list h3 { font-size:1.25rem; margin-block:18px 12px; }
.process-list p { color:var(--soft); line-height:1.9; }
.faq-layout { display:grid; grid-template-columns:1fr 1.5fr; gap:70px; }
.editorial-site .faq { width:100%; }
.editorial-site .faq summary { color:var(--ink); font-size:1.05rem; }
.editorial-site .faq p { color:var(--soft); }
.editorial-site .contact { background:#eeeae0; }
[data-theme="dark"] .editorial-site .contact { background:#1b302b; }
.editorial-site .section-title { color:var(--ink); }
.editorial-site .badge { border-radius:4px; color:#826211; background:#e9ddbc; }
.editorial-site .footer { background:var(--forest-deep); color:#e7eee5; padding-top:60px; }
.editorial-site .footer__inner { grid-template-columns:1.2fr 1.3fr 1fr; gap:70px; }
.editorial-site .footer__brand p { color:#bacbc0; line-height:1.9; max-width:340px; margin-block:20px; }
.editorial-site .footer__col h2 { color:#eee3bb; font-size:1.1rem; margin-bottom:20px; }
.editorial-site .footer a { color:#d7e2d9; line-height:1.8; }
.editorial-site .footer__col li { margin-bottom:14px; }
.editorial-site .footer__bottom { display:flex; justify-content:space-between; gap:24px; border-top:1px solid #ffffff25; color:#aabfb1; font-size:.8rem; padding-block:22px; margin-top:42px; }
.editorial-site .service-hero { background:var(--forest); color:#f9f6ec; padding-block:calc(var(--navbar-h) + 55px) 60px; }
.service-hero__grid { display:grid; grid-template-columns:1.15fr 1fr; gap:65px; align-items:center; }
.editorial-site .service-hero h1 { color:#fff9eb; font-size:clamp(2.1rem,3.5vw,3.1rem); line-height:1.45; }
.editorial-site .service-hero .section-desc { color:#d5e1d7; font-size:1.05rem; line-height:2; }
.service-hero .eyebrow { color:#e4c56b; margin-top:30px; }
.breadcrumb { color:#ddc87d; font-size:.8rem; text-decoration:underline; text-underline-offset:5px; }
.service-hero figure { margin:0; }
.service-hero figure img { width:100%; aspect-ratio:1.15; object-fit:cover; border-radius:6px; }
.service-layout { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:75px; align-items:start; }
.editorial-site .service-body { max-width:none; }
.editorial-site .service-body>section { margin-bottom:38px; }
.editorial-site .service-body h2 { font-size:1.7rem; margin-top:0; }
.editorial-site .service-body p { color:var(--soft); font-size:1.05rem; line-height:2.1; }
.service-aside { position:sticky; top:calc(var(--navbar-h) + 25px); padding:28px; background:#eeeae0; border-top:3px solid #d6af47; border-radius:4px; }
[data-theme="dark"] .service-aside { background:#1b302b; }
.editorial-site .service-aside h2 { font-size:1.45rem; }
.service-aside p { color:var(--soft); line-height:1.9; margin-bottom:22px; }
.service-aside .btn { width:100%; margin-bottom:20px; }
.related-services { border-top:1px solid var(--border); margin-top:40px; padding-top:30px; }
.related-services a { display:block!important; margin-bottom:16px; }
.registration-intro { padding-block:calc(var(--navbar-h) + 48px) 42px; background:var(--forest); color:#fff7df; text-align:center; }
.registration-intro h1 { font-size:2.6rem; margin-bottom:16px; }
.registration-intro p:not(.eyebrow) { color:#d4e0d5; max-width:720px; margin:0 auto 20px; line-height:1.9; }
.registration-intro .text-link { color:#ebd18c; }
.editorial-site .reg-main { background:var(--paper); }
.editorial-site .reg-card { border-radius:8px; }
.editorial-site .contact__info-item strong { overflow-wrap:anywhere; }
@media(min-width:769px) and (max-width:1050px) { .editorial-site .nav-link { padding-inline:8px; font-size:.78rem; } .editorial-site .navbar__logo-mark { max-width:100px; } .flagship-hero__grid,.split-story,.section-heading,.service-hero__grid { gap:32px; } .service-layout { gap:36px; grid-template-columns:minmax(0,1fr) 270px; } }
@media(max-width:768px) {
 .editorial-site .container { width:calc(100% - 36px); }
 .editorial-site .navbar__inner nav { flex:0; }
 .editorial-site .navbar__links { background:var(--paper); }
 .flagship-hero { padding-block:38px 36px; }
 .flagship-hero__grid,.split-story,.section-heading,.service-hero__grid,.service-layout,.faq-layout { grid-template-columns:1fr; gap:32px; }
 .flagship-hero h1 { font-size:clamp(2.45rem,8vw,3.5rem); margin-bottom:18px; }
 .flagship-hero__intro { font-size:1rem; line-height:1.95; }
 .flagship-hero__photo { min-height:310px; }
 .flagship-hero__photo img { object-position:center 60%; }
 .flagship-hero__photo figcaption { bottom:24px; inset-inline:24px; }
 .flagship-hero__photo figcaption strong { font-size:1.3rem; }
 .action-row { flex-direction:column; }
 .action-row .btn { width:100%; }
 .hero-caption { font-size:.74rem; }
 .quick-routes__grid { grid-template-columns:1fr; }
 .quick-routes__grid>a { padding:21px 4px; border-inline-end:0; border-bottom:1px solid #c7cbbc; }
 .quick-routes__grid>a:last-child { border-bottom:0; }
 .editorial-section,.corporate-section { padding-block:54px; }
 .editorial-site h2 { font-size:1.95rem; }
 .section-heading { margin-bottom:26px; gap:10px; }
 .story-photo img { aspect-ratio:1.3; }
 .city-stories { grid-template-columns:1fr; }
 .city-stories article { padding:28px 0!important; border-inline-start:0!important; }
 .city-stories article+article { border-top:1px solid #ffffff36; }
 .national-link { flex-direction:column; gap:8px; }
 .fleet-gallery { grid-template-columns:1fr; gap:28px; }
 .process-list { grid-template-columns:1fr; gap:28px; }
 .editorial-site .footer__inner { grid-template-columns:1fr; gap:32px; }
 .editorial-site .footer__brand { grid-column:auto; }
 .editorial-site .footer__bottom { flex-direction:column; gap:10px; }
 .editorial-site .service-hero { padding-block:calc(var(--navbar-h) + 32px) 38px; }
 .editorial-site .service-hero h1 { font-size:2.2rem; }
 .service-hero figure img { aspect-ratio:1.5; }
 .service-aside { position:static; }
 .registration-intro h1 { font-size:2rem; }
}

/* WOSOL 2026: corporate profile-inspired white, charcoal and amber identity. */
.premium-site { --primary:#f1b654; --primary-dark:#f1b654; --accent:#f1b654; --brand-gold:#f1b654; --grad-primary:linear-gradient(#f1b654,#f1b654); }
.premium-site .navbar__logo { width:auto; flex-shrink:0; }
.brand-logo { display:block; height:55.2px; width:76px; color:#f1b654; overflow:visible; }
.brand-blade { transform-origin:240px 94px; animation:brand-weave 3s cubic-bezier(.45,0,.2,1) 1; }
.brand-blade--two { animation-delay:.12s; }
.brand-blade--three { animation-delay:.24s; }
.navbar__logo:hover .brand-blade,.navbar__logo:focus-visible .brand-blade { animation:brand-orbit 2.4s cubic-bezier(.45,0,.2,1) infinite; }
[data-theme="dark"] .brand-logo { background:#fff; border-radius:4px; }
@keyframes brand-weave { 0%,12% { transform:rotate(0) scale(1); } 48% { transform:rotate(180deg) scale(.88); } 88%,100% { transform:rotate(360deg) scale(1); } }
@keyframes brand-orbit { 0% { transform:rotate(0); } 50% { transform:rotate(180deg) scale(.88); } 100% { transform:rotate(360deg); } }
.premium-site .btn--primary:hover { background:var(--gold); filter:brightness(.96); }
@media(max-width:768px) { .brand-logo { height:49.45px; width:68px; } }
@media(prefers-reduced-motion:reduce) { .brand-blade,.navbar__logo:hover .brand-blade,.navbar__logo:focus-visible .brand-blade,.brand-mini-bus { animation:none!important; } }
.premium-site { --forest:#191f25; --forest-deep:#10151b; --gold:#f1b654; --paper:#fff; --ink:#1e242b; --soft:#68717b; --border:#e5e8eb; background:var(--paper); }
[data-theme="dark"] .premium-site { --paper:#141a20; --ink:#f4f5f6; --soft:#b7c0c8; --border:#35404a; --card-bg:#1c242c; --bg:#141a20; --bg-alt:#202a33; }
.premium-site .navbar { border-top:0; background:var(--paper); height:82px; border-bottom:1px solid var(--border); }
.premium-site .navbar__logo-mark { height:48px; }
.premium-site .navbar__inner { gap:30px; }
.premium-site .nav-link { font-size:.91rem; padding-inline:14px; border-radius:4px; }
.premium-site .nav-link:hover { color:var(--ink); background:#f1b65420; }
.premium-site .btn { border-radius:5px; min-height:54px; font-size:.98rem; padding:14px 25px; transition:background .2s,transform .2s; }
.premium-site .btn--primary { background:var(--gold); border-color:var(--gold); color:#20252b; }
.premium-site .btn--ghost { border:1px solid #b5bdc5; color:var(--ink); background:transparent; }
.premium-eyebrow { display:flex; align-items:center; gap:10px; font-size:.77rem; letter-spacing:.06em; font-weight:700; color:#f1b654; margin-bottom:18px; line-height:1.6; }
.premium-eyebrow>span { width:24px; height:2px; background:var(--gold); }
.signature-hero { position:relative; margin-top:82px; min-height:650px; background:#f8f9fa; isolation:isolate; overflow:hidden; }
[data-theme="dark"] .signature-hero { background:#1c242c; }
.signature-hero__art { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:left 62%; z-index:-1; }
.signature-hero__inner { display:flex; justify-content:flex-end; direction:ltr; min-height:650px; align-items:center; padding-block:64px 95px; }
.signature-hero__copy { width:48%; direction:ltr; }
[dir="rtl"] .signature-hero__copy { direction:rtl; }
.signature-hero h1 { font-size:clamp(2.6rem,3.9vw,3.85rem); line-height:1.4; font-weight:800; color:var(--ink); margin-bottom:24px; letter-spacing:-.035em; }
.signature-hero h1 em { font-style:normal; color:#f1b654; }
[data-theme="dark"] .signature-hero h1 em { color:var(--gold); }
.signature-hero__description { max-width:520px; font-size:1.1rem; line-height:2; color:var(--soft); }
.signature-hero .action-row { gap:12px; margin-block:30px 24px; }
.signature-hero__assurance { display:flex; gap:12px; align-items:center; color:var(--soft); font-size:.77rem; line-height:1.8; }
.signature-hero__assurance svg { width:27px; height:27px; color:#f1b654; flex-shrink:0; }
.signature-hero__assurance b { display:block; color:var(--ink); font-weight:600; }
.journey-finder { position:relative; margin-top:-48px; display:grid; grid-template-columns:1.05fr 1.8fr auto; gap:24px; align-items:center; background:var(--paper); border:1px solid var(--border); border-radius:8px; padding:27px 32px; box-shadow:0 18px 55px #18232d13; z-index:2; }
.journey-finder__title { display:flex; gap:16px; align-items:center; }
.journey-finder__title svg { width:34px; height:34px; color:#f1b654; flex-shrink:0; }
.journey-finder__title span { color:var(--soft); font-size:.7rem; letter-spacing:.08em; }
.premium-site .journey-finder h2 { font-size:1.15rem; margin:5px 0 0; white-space:nowrap; }
.journey-finder>label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.journey-finder select { font:inherit; font-size:.92rem; width:100%; padding:17px 14px; border:1px solid var(--border); border-radius:5px; color:var(--ink); background:var(--paper); }
.credentials-strip { padding-block:50px 35px; border-bottom:1px solid var(--border); }
.credentials-strip__grid { display:grid; grid-template-columns:repeat(4,1fr); }
.credentials-strip__grid>div { text-align:center; border-inline-end:1px solid var(--border); }
.credentials-strip__grid>div:last-child { border:0; }
.credentials-strip strong { display:block; font:600 clamp(2rem,3vw,2.9rem)/1.4 Inter,sans-serif; color:var(--ink); }
.credentials-strip span { font-size:.87rem; color:var(--soft); }
.evidence-note { text-align:center; color:var(--soft); font-size:.72rem; margin-top:26px; }
.premium-section { padding-block:90px; }
.premium-heading { display:grid; grid-template-columns:1.1fr 1fr; gap:85px; align-items:end; margin-bottom:40px; }
.premium-site :is(.premium-heading,.campus-story,.corporate-spotlight,.coverage-section,.about-signature,.faq-layout) h2 { font-size:clamp(1.9rem,3.15vw,2.8rem); line-height:1.5; margin:0 0 20px; }
.premium-heading>p,.campus-story p:not(.premium-eyebrow),.corporate-spotlight p:not(.premium-eyebrow),.coverage-section p:not(.premium-eyebrow),.about-signature p:not(.premium-eyebrow) { color:var(--soft); font-size:1.04rem; line-height:2; }
.solutions-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.solution-card { position:relative; display:flex; flex-direction:column; min-height:320px; border:1px solid var(--border); border-radius:7px; padding:30px; color:var(--ink); background:var(--paper); transition:transform .25s,border-color .25s,box-shadow .25s; }
.solution-card:hover { transform:translateY(-6px); border-color:#f1b654; box-shadow:0 18px 35px #18232d10; }
.solution-card__top { display:flex; justify-content:space-between; align-items:center; margin-bottom:32px; }
.solution-index { font:500 .8rem Inter,sans-serif; color:#8e969e; }
.solution-card svg { width:36px; height:36px; color:#f1b654; }
.solution-card h3 { font-size:1.45rem; line-height:1.55; margin-bottom:14px; }
.solution-card p { color:var(--soft); line-height:1.9; font-size:.96rem; }
.solution-card__link { margin-top:auto; padding-top:28px; display:flex; justify-content:space-between; gap:10px; font-size:.92rem; font-weight:700; }
.solution-card__link>span { color:#f1b654; }
[dir="rtl"] .solution-card__link>span { transform:scaleX(-1); }
.campus-story { padding-block:75px; background:#f6f7f9; }
[data-theme="dark"] .campus-story { background:#1d252e; }
.campus-story__grid { display:grid; grid-template-columns:1fr 1fr; gap:85px; align-items:center; }
.campus-story figure { position:relative; margin:0; }
.campus-story figure img { width:100%; aspect-ratio:1.12; object-fit:cover; border-radius:7px; }
.campus-story figure::after { content:''; position:absolute; inset:55% 0 0; background:linear-gradient(transparent,#111b25cc); border-radius:7px; }
.campus-story figcaption { display:flex; gap:8px; align-items:center; position:absolute; bottom:24px; inset-inline-start:24px; z-index:1; color:#fff; font-weight:700; font-size:.86rem; }
.campus-story figcaption svg { width:22px; height:22px; color:var(--gold); }
.campus-story em,.corporate-spotlight em { font-style:normal; color:#f1b654; }
.campus-details { display:flex; gap:22px; margin-block:24px; flex-wrap:wrap; }
.campus-details>span { display:flex; align-items:center; gap:8px; color:var(--soft); font-size:.86rem; }
.campus-details svg { width:23px; height:23px; color:#f1b654; }
.corporate-spotlight { background:#1a222b; color:#fff; position:relative; overflow:hidden; }
.corporate-spotlight::before { content:''; width:350px; height:350px; border:1px solid #ffffff0d; position:absolute; bottom:-220px; inset-inline-start:10%; transform:rotate(35deg); }
.corporate-spotlight__grid { display:grid; grid-template-columns:1.1fr 1fr; gap:90px; align-items:center; }
.corporate-spotlight .premium-eyebrow,.corporate-spotlight em { color:#f1b654; }
.corporate-spotlight p:not(.premium-eyebrow) { color:#bfc9d2; }
.corporate-city-links { display:flex; gap:12px; flex-wrap:wrap; margin-block:26px; }
.city-link { color:#f7f8f9; border:1px solid #ffffff40; padding:8px 20px; border-radius:4px; font-weight:500; }
.city-link:hover { border-color:var(--gold); color:var(--gold); }
.operations-promise article { display:flex; gap:20px; padding-block:25px; border-bottom:1px solid #ffffff21; }
.operations-promise article:last-child { border:0; }
.operations-promise svg { width:35px; height:35px; color:#f1b654; flex-shrink:0; }
.operations-promise h3 { font-size:1.24rem; margin-bottom:10px; }
.operations-promise p { font-size:.96rem!important; line-height:1.9!important; }
.technology-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.technology-grid article { padding:30px 24px; background:#f6f7f9; border-radius:6px; border-top:2px solid #f1b654; }
[data-theme="dark"] .technology-grid article { background:#202a33; }
.technology-grid article>span { display:inline-block; font:600 .78rem Inter,sans-serif; color:#f1b654; margin-bottom:25px; letter-spacing:.08em; }
.technology-grid h3 { font-size:1.2rem; margin-bottom:12px; }
.technology-grid p { color:var(--soft); font-size:.92rem; line-height:1.9; }
.quality-section { background:#faf8f3; }
[data-theme="dark"] .quality-section { background:#1d252e; }
.iso-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.iso-grid article { display:grid; grid-template-columns:auto 1fr; gap:0 24px; padding:30px; border:1px solid #dfdcd2; border-radius:6px; background:var(--paper); }
.iso-mark { grid-row:span 2; display:flex; flex-direction:column; gap:3px; align-items:center; justify-content:center; }
.iso-mark svg { width:40px; height:40px; color:#f1b654; }
.iso-mark span { color:#f1b654; font:600 .7rem Inter,sans-serif; }
.iso-grid h3 { font:600 1.55rem Inter,sans-serif; margin-bottom:8px; direction:ltr; }
.iso-grid h3 small { font-size:.7em; color:#828a91; font-weight:400; }
.iso-grid p { color:var(--soft); font-size:.9rem; line-height:1.7; }
.performance-band { display:grid; grid-template-columns:1.6fr .7fr .7fr; gap:30px; border-top:1px solid #dedbd0; margin-top:42px; padding-top:30px; align-items:center; }
.performance-band h3 { font-size:1.22rem; margin-bottom:10px; }
.performance-band p { color:var(--soft); font-size:.8rem; line-height:1.9; max-width:500px; }
.performance-band strong { display:block; font:600 2.5rem Inter,sans-serif; color:#f1b654; direction:ltr; text-align:center; }
.performance-band span { display:block; color:var(--soft); font-size:.82rem; text-align:center; margin-top:10px; }
.fleet-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; border-bottom:1px solid var(--border); margin-bottom:32px; }
.fleet-tabs button span,.fleet-tabs button small { display:block; }
.fleet-tabs button small { margin-top:8px; font-size:.85rem; font-weight:400; }
.fleet-cars { width:100%; max-width:520px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.fleet-cars figure { display:grid; place-items:center; margin:0; padding:12px; background:#fff; border:1px solid #e4e8e7; border-radius:12px; }
.fleet-panel .fleet-cars img { display:block; width:100%; height:auto; aspect-ratio:auto; object-fit:contain; border-radius:0; }
.fleet-cars figcaption { color:#263238; font-weight:700; text-align:center; margin-top:12px; font-size:.95rem; }
.fleet-panel .fleet-model-note { grid-column:1/-1; font-size:.8rem; margin:0; }
.fleet-panel .image-provenance { margin-top:20px; font-size:.8rem; }
@media(max-width:600px) { .fleet-explorer .fleet-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); } .fleet-cars { gap:10px; } .fleet-cars figure { padding:8px; } }
.fleet-tabs button { background:transparent; color:var(--soft); border:0; border-bottom:3px solid transparent; padding:15px 25px; font:700 .95rem inherit; cursor:pointer; }
.fleet-tabs button[aria-selected="true"] { color:var(--ink); border-color:var(--gold); }
.fleet-tabs button:focus-visible { outline:2px solid #f1b654; outline-offset:3px; }
.fleet-panel { display:grid; grid-template-columns:1.2fr 1fr; gap:75px; align-items:center; }
.fleet-panel[hidden] { display:none; }
.fleet-panel img { width:100%; aspect-ratio:1.6; object-fit:cover; border-radius:6px; }
.fleet-panel h3 { font-size:2rem; line-height:1.5; margin-bottom:18px; }
.fleet-panel p:not(.premium-eyebrow) { color:var(--soft); line-height:2; margin-bottom:24px; }
.coverage-section { padding-block:75px; background:#edf0f3; }
[data-theme="dark"] .coverage-section { background:#202a33; }
.coverage-section__grid { display:grid; grid-template-columns:1fr 1fr; gap:90px; align-items:center; }
.coverage-section .text-link { margin-top:20px; }
.coverage-cities { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.coverage-cities span { display:flex; align-items:center; gap:12px; padding:18px 20px; border:1px solid #d5dce3; border-radius:5px; background:var(--paper); color:var(--ink); }
.coverage-cities svg { width:20px; height:20px; color:#959fa8; }
.coverage-cities .priority-city { border-color:#f1b654; }
.coverage-cities .priority-city svg { color:#f1b654; }
.about-signature { text-align:center; }
.about-signature .premium-eyebrow { justify-content:center; }
.about-signature p:not(.premium-eyebrow) { max-width:820px; margin-inline:auto; }
.about-pillars { display:flex; justify-content:center; flex-wrap:wrap; gap:12px 36px; margin-top:30px; font-weight:700; }
.about-pillars span::before { content:'•'; color:#f1b654; margin-inline-end:12px; }
.premium-site .service-hero { background:linear-gradient(130deg,#19212a,#283644); }
.premium-site .service-hero figure img { border-radius:6px; }
.premium-site .service-hero .btn--ghost { color:#f5f7fa; border-color:#8e9eae; }
.premium-site .service-aside { background:#f4f5f7; border-top-color:var(--gold); }
[data-theme="dark"] .premium-site .service-aside { background:#202a33; }
.premium-site .contact { background:#f5f6f8; }
[data-theme="dark"] .premium-site .contact { background:#202a33; }
.premium-site .registration-intro { background:#1a222b; }
.premium-site .footer { background:#151c24; }
.premium-site .footer__brand .navbar__logo-mark { box-sizing:content-box; padding:8px; height:64px; width:auto; max-width:none; align-self:flex-start; object-fit:contain; border-radius:6px; }
.premium-site .reg-card { box-shadow:0 8px 35px #18232d06; border-color:var(--border); }
.premium-site .contact-form-wrapper { border-radius:7px; box-shadow:0 10px 40px #18232d0c; }
@media(min-width:769px) and (max-width:1100px) {
 .signature-hero h1 { font-size:2.7rem; }
 .signature-hero__copy { width:49%; }
 .signature-hero__inner,.signature-hero { min-height:620px; }
 .premium-site .nav-link { font-size:.78rem; padding-inline:8px; }
 .premium-site .navbar__inner { gap:10px; }
 .journey-finder { gap:15px; padding:24px; }
 .journey-finder__title svg { display:none; }
 .campus-story__grid,.corporate-spotlight__grid,.premium-heading,.coverage-section__grid { gap:40px; }
 .solution-card { padding:24px; }
 .iso-grid article { padding:22px; gap:0 15px; }
}
@media(max-width:768px) {
 .premium-site .navbar { height:72px; }
 .premium-site .navbar__inner { gap:10px; }
 .premium-site .navbar__logo-mark { height:43px; }
 .premium-site .navbar__links { top:72px; }
 .premium-site .nav-link { padding:14px; font-size:.95rem; }
 .signature-hero { margin-top:72px; min-height:0; padding-bottom:325px; }
 .signature-hero__inner { min-height:0; padding-block:38px 25px; }
 .signature-hero__copy { width:100%; }
 .signature-hero h1 { font-size:clamp(2rem,7vw,2.7rem); line-height:1.5; margin-bottom:18px; }
 .signature-hero__description { font-size:.98rem; line-height:1.95; }
 .signature-hero .premium-eyebrow { font-size:.72rem; }
 .signature-hero .action-row { margin-block:22px; }
 .signature-hero__art { top:auto; bottom:0; inset-inline:auto; left:0; width:200%; max-width:none; height:330px; object-fit:cover; object-position:left 70%; }
 .journey-finder { margin-top:-24px; grid-template-columns:1fr; gap:16px; padding:24px; }
 .journey-finder__title { gap:14px; }
 .journey-finder select { font-size:.85rem; padding:15px 10px; }
 .journey-finder__link { width:100%; }
 .credentials-strip { padding-top:38px; }
 .credentials-strip__grid { grid-template-columns:1fr 1fr; gap:25px 0; }
 .credentials-strip__grid>div:nth-child(2) { border:0; }
 .credentials-strip strong { font-size:2.2rem; }
 .credentials-strip span { font-size:.77rem; }
 .premium-section { padding-block:55px; }
 .premium-heading,.solutions-grid,.campus-story__grid,.corporate-spotlight__grid,.fleet-panel,.coverage-section__grid { grid-template-columns:1fr; gap:30px; }
 .premium-heading { gap:12px; margin-bottom:30px; }
 .premium-site :is(.premium-heading,.campus-story,.corporate-spotlight,.coverage-section,.about-signature,.faq-layout) h2 { font-size:1.95rem; line-height:1.55; }
 .premium-heading>p,.campus-story p:not(.premium-eyebrow),.corporate-spotlight p:not(.premium-eyebrow),.coverage-section p:not(.premium-eyebrow),.about-signature p:not(.premium-eyebrow) { font-size:.98rem; }
 .solution-card { min-height:280px; }
 .solution-card__top { margin-bottom:22px; }
 .campus-story { padding-block:55px; }
 .campus-story figure img { aspect-ratio:1.35; }
 .technology-grid { grid-template-columns:1fr 1fr; gap:14px; }
 .technology-grid article { padding:23px 18px; }
 .technology-grid h3 { font-size:1.05rem; }
 .iso-grid { grid-template-columns:1fr; gap:15px; }
 .iso-grid article { padding:25px; }
 .performance-band { grid-template-columns:1fr 1fr; gap:26px; }
 .performance-band>div:first-child { grid-column:1/-1; }
 .performance-band strong { font-size:2.1rem; }
 .fleet-tabs { gap:0; }
 .fleet-tabs button { flex:1; padding:14px 6px; font-size:.82rem; }
 .fleet-panel h3 { font-size:1.6rem; }
 .coverage-section { padding-block:55px; }
 .coverage-cities { gap:10px; }
 .coverage-cities span { padding:14px 12px; gap:8px; font-size:.86rem; }
}
@media(prefers-reduced-motion:reduce) { .solution-card:hover { transform:none; } }

/* Preserve native photo proportions: HTML height attributes must never stretch a fluid image. */
.premium-site .fleet-photo { display:block; width:100%; height:auto; max-width:520px; max-height:none; aspect-ratio:auto; object-fit:contain; margin-inline:auto; }
.premium-site .campus-story figure { max-width:520px; width:100%; justify-self:center; }
.premium-site .campus-story figure::after { inset:65% 0 0; }
.premium-site .service-hero figure { max-width:520px; width:100%; justify-self:center; }
.premium-site .navbar__logo { display:flex; flex-direction:column; gap:0; align-items:center; }
.brand-bus-track { display:block; width:76px; height:21px; overflow:hidden; direction:ltr; }
.brand-mini-bus { display:block; width:54px; height:21px; max-width:none; transform:translateX(11px); animation:brand-bus-arrive 4s ease-out 1; }
.navbar__logo:hover .brand-mini-bus { animation:brand-bus-hover 2.8s ease-in-out 1; }
@keyframes brand-bus-arrive { from { transform:translateX(-52px); opacity:0; } 18% { opacity:1; } to { transform:translateX(11px); opacity:1; } }
@keyframes brand-bus-hover { 0%,100% { transform:translateX(11px); } 50% { transform:translateX(20px); } }
@media(max-width:768px) {
 .premium-site .fleet-photo { max-width:440px; }
 .signature-hero { padding-bottom:clamp(180px,55vw,260px); }
 .signature-hero__art { height:clamp(180px,55vw,260px); }
 .brand-bus-track { width:68px; height:18px; }
 .brand-mini-bus { width:46px; height:18px; }
}
@media(prefers-reduced-motion:reduce) { .brand-mini-bus,.navbar__logo:hover .brand-mini-bus { animation:none!important; } }

/* Independent full-width journey below the navigation, always left to right. */
.premium-site .navbar__logo { display:block; }
.header-route { position:absolute; top:100%; left:0; right:0; height:38px; background:var(--paper); border-bottom:1px solid var(--border); overflow:hidden; direction:ltr; }
.header-route .brand-bus-track { position:absolute; inset:0; width:100%; height:38px; }
.header-route .brand-mini-bus { position:absolute; left:-96px; top:2px; width:96px; height:34px; object-fit:contain; transform:none; animation:header-bus-cross 18s linear infinite; will-change:transform; }
@keyframes header-bus-cross { from { transform:translateX(0); } to { transform:translateX(calc(100vw + 96px)); } }
.header-route.is-paused .brand-mini-bus { animation-play-state:paused; }
.header-route__toggle { position:absolute; right:8px; top:3px; z-index:1; width:32px; height:30px; border-radius:5px; background:var(--paper); border:1px solid var(--border); color:var(--ink); font-size:13px; }
.header-route__toggle:focus-visible { outline:2px solid var(--gold); outline-offset:-3px; }
.premium-site .signature-hero { margin-top:120px; }
.premium-site .service-hero,.premium-site .registration-intro { margin-top:38px; }
.image-provenance { font-size:.72rem; line-height:1.7; color:var(--soft); margin:12px 0 20px; }
.service-hero .image-provenance { color:#bfc9d2; }
@media(max-width:768px) { .premium-site .signature-hero { margin-top:110px; } .premium-site .navbar__links { top:110px; } }
@media(prefers-reduced-motion:reduce) { .header-route .brand-mini-bus { animation:none!important; left:calc(50% - 48px); } .header-route__toggle { display:none; } }

/* Audit: readable text; approved brand gold remains on logos and buttons. */
.premium-site { --primary:var(--ink); --primary-dark:var(--ink); --accent:var(--ink); }
.premium-site :is(.premium-eyebrow,.text-link,.technology-grid article>span,.iso-mark span,.performance-band strong,.signature-hero h1 em,.campus-story em,.solution-index,.iso-grid h3 small) { color:var(--ink); }
.premium-site .corporate-spotlight :is(.premium-eyebrow,em,.text-link),.premium-site .service-hero :is(.eyebrow,.text-link) { color:var(--gold); }
.premium-site .contact-tab[aria-selected="true"] { background:var(--gold); color:#20252b; }
.premium-site :is(a,button,input,select,textarea,summary):focus-visible { outline:3px solid #805200; outline-offset:3px; }
[data-theme="dark"] .premium-site :is(a,button,input,select,textarea,summary):focus-visible { outline-color:var(--gold); }
.secondary-details { margin-block:28px; border-block:1px solid var(--border); }
.secondary-details>summary { padding:24px 4px; font-size:1.2rem; font-weight:700; cursor:pointer; color:var(--ink); }
.secondary-details .container { width:100%; }
.secondary-details .premium-section { padding-block:24px 42px; }
.international-contact { color:var(--ink); line-height:1.8; margin-block:20px; }
.premium-site .eyebrow { color:var(--ink); }
.premium-site .service-hero .eyebrow { color:var(--gold); }
.premium-site .coverage-section p:not(.premium-eyebrow) { color:#505c68; }
[data-theme="dark"] .premium-site .coverage-section p:not(.premium-eyebrow) { color:#c3cbd3; }
.premium-site .footer__bottom p { color:#c3cbd3; }
.premium-site .form-group :is(input,textarea)::placeholder { color:var(--soft); opacity:1; }
.premium-site .contact__map-link { color:var(--ink); }
.premium-site .social-btn { color:var(--ink); background:var(--paper); }
.premium-site .navbar.scrolled { background:var(--paper); }
.premium-site .navbar__links { background:var(--paper); }
.contact__detail-info a { display:inline-block; color:var(--ink); text-decoration:underline; text-underline-offset:4px; }
.contact__detail-info { overflow-wrap:anywhere; }
.premium-site .service-aside { background:var(--paper); border:1px solid var(--border); border-top:3px solid var(--gold); }
.premium-site .service-aside :is(h2,p) { color:var(--ink); }
.premium-site .fleet-cars figure { display:flex; align-items:center; justify-content:center; background:#fff; padding:20px; }
.premium-site .fleet-cars img { width:100%; height:auto; object-fit:contain; }
.measurement-choice { position:fixed; bottom:12px; inset-inline:12px; z-index:11000; max-width:650px; margin:auto; border:1px solid var(--border); background:var(--paper); color:var(--ink); box-shadow:0 4px 24px #0003; border-radius:12px; padding:20px; }
.measurement-choice[hidden] { display:none; }
.measurement-choice p { margin-bottom:12px; }
.measurement-choice button { margin-inline-end:10px; }
.analytics-settings { background:none; border:0; color:inherit; text-decoration:underline; cursor:pointer; font:inherit; }
.motion-paused .brand-blade,.motion-paused .brand-mini-bus { animation-play-state:paused!important; }
@media(max-width:768px) {
 .solutions-grid { gap:16px; }
 .solution-card { min-height:0; padding:22px; }
 .solution-card__top { margin-bottom:12px; }
 .premium-site .contact { padding-block:46px; }
 .premium-site .btn { white-space:normal; text-align:center; }
}

/* One accessible WhatsApp target for both the icon and phone number. */
.premium-site .footer .footer__whatsapp { display:inline-flex; align-items:center; gap:10px; min-height:44px; width:fit-content; padding:4px 8px; margin-inline:-8px; border-radius:8px; text-decoration:none; }
.premium-site .footer__whatsapp svg { width:24px; height:24px; flex:0 0 24px; color:#25d366; }
.premium-site .footer .footer__whatsapp:hover { background:rgba(37,211,102,.10); color:#fff; }
.premium-site .footer__whatsapp:hover span { text-decoration:underline; text-underline-offset:4px; }
.premium-site .footer__whatsapp:focus-visible { outline:2px solid #F1B654; outline-offset:4px; }

/* Service card WhatsApp: icon and number share one touch target. */
.premium-site .service-aside .service-whatsapp { display:flex; align-items:center; gap:10px; width:fit-content; min-height:44px; margin-top:8px; padding:4px 8px; margin-inline:-8px; border-radius:8px; color:var(--ink); font-weight:700; text-decoration:none; }
.premium-site .service-whatsapp svg { width:24px; height:24px; flex:0 0 24px; color:#128c4a; }
[data-theme="dark"] .premium-site .service-whatsapp svg { color:#25d366; }
.premium-site .service-whatsapp:hover { background:rgba(37,211,102,.10); }
.premium-site .service-whatsapp:hover span { text-decoration:underline; text-underline-offset:4px; }
.premium-site .service-whatsapp:focus-visible { outline:2px solid #F1B654; outline-offset:4px; }

.premium-site .footer__whatsapp-list { display:flex; flex-direction:column; align-items:flex-start; gap:4px; }

#transport-services{scroll-margin-top:130px}
#transport-services .section-desc{max-width:780px;margin-bottom:32px}
#transport-services .solutions-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
#transport-services .solution-card{min-width:0;padding:24px}
#transport-services h3{font-size:1.2rem;line-height:1.6}
.service-body #transport-services .solutions-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1000px){#transport-services .solutions-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){#transport-services .solutions-grid,.service-body #transport-services .solutions-grid{grid-template-columns:1fr}}

/* Bounded UI refinement: existing identity and routes retained. */
.premium-site .signature-hero h1{font-size:clamp(2.25rem,3.3vw,3.3rem);line-height:1.45;letter-spacing:-.025em}
.premium-site .signature-hero__description{max-width:48ch;font-size:1.05rem;line-height:1.9}
.premium-site :is(.premium-heading h2,.section-title,.editorial-section h2){font-size:clamp(1.75rem,2.8vw,2.6rem);line-height:1.5}
.premium-site :is(.section-desc,.premium-heading>p){max-width:62ch;line-height:1.85;font-size:1rem}
.premium-site .service-hero .eyebrow{color:#f1b654;font-weight:600;font-size:1rem;line-height:1.7}
#transport-services .solution-card{padding:26px;min-height:290px}
#transport-services .solution-card__top{margin-bottom:20px;gap:12px}
#transport-services .solution-card__top svg{color:var(--ink);width:30px;height:30px;flex-shrink:0}
#transport-services .service-category{font-size:.75rem;font-weight:600;color:var(--soft);padding:5px 9px;border:1px solid var(--border);border-radius:30px}
#transport-services h3{font-size:1.2rem;line-height:1.5;margin-bottom:12px}
#transport-services .solution-card p{font-size:.94rem;line-height:1.8}
#transport-services .service-city-actions{justify-content:flex-start;gap:20px}
.premium-site .contact__inner{align-items:start;gap:56px}
.premium-site .contact__details{display:grid;gap:12px;margin-block:28px}
.premium-site .contact__details li{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--border);margin:0}
.premium-site .contact__detail-info{display:flex;flex-direction:column;align-items:flex-start;gap:7px;line-height:1.65;min-width:0}
.premium-site .contact__detail-label{font-size:.8rem;color:var(--soft);font-weight:600}
.premium-site .contact__detail-info a{font-size:1rem;text-decoration:none;min-height:28px}
.premium-site .contact__detail-info a:hover{text-decoration:underline}
.premium-site .contact__detail-icon{color:var(--ink);background:#f1b65426;flex-shrink:0}
.premium-site .contact__detail-info>span:not(.contact__detail-label){max-width:32ch}
.quote-section{border:0;min-width:0;padding:0;margin:0 0 28px}
.quote-section legend{display:flex;align-items:center;gap:12px;width:100%;font-size:1.1rem;font-weight:700;color:var(--ink);padding:0 0 16px;margin-bottom:20px;border-bottom:1px solid var(--border)}
.step-number{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#f1b6542b;color:var(--ink);font:600 .75rem/1 sans-serif}
.quote-field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.quote-field-grid .form-group{margin:0;min-width:0}
.quote-field-grid .form-group:has(#qt-org),.quote-field-grid .form-group:has(#qt-service),.quote-field-grid .form-group:has(#qt-notes){grid-column:1/-1}
.quote-documents{border:1px solid var(--border);border-radius:10px;margin-bottom:24px;overflow:hidden}
.quote-documents>summary{cursor:pointer;display:flex;gap:10px;align-items:center;padding:18px;font-size:.95rem;font-weight:600;color:var(--ink);list-style:none}
.quote-documents>summary::-webkit-details-marker{display:none}
.quote-documents>summary::after{content:'+';margin-inline-start:auto;font-size:1.25rem}
.quote-documents[open]>summary::after{content:'−'}
.optional-pill{font-size:.75rem;color:var(--soft);font-weight:400}
.quote-attachments{padding:0 18px 18px}
.file-picker{position:relative;display:flex;align-items:center;gap:12px;min-height:52px;border:1px dashed #858e97;border-radius:7px;padding:10px;background:var(--paper);color:var(--ink)}
.file-picker input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:1;padding:0}
.file-picker:focus-within{outline:3px solid #805200;outline-offset:3px}
.file-picker__button{flex-shrink:0;font-size:.82rem;font-weight:600;background:#f1b65430;padding:7px 10px;border-radius:4px}
.file-picker__name{font-size:.8rem;color:var(--soft);overflow-wrap:anywhere;min-width:0}
#quote-file-help{font-size:.8rem;line-height:1.75;color:var(--soft)}
[dir=ltr] .premium-site .signature-hero h1{line-height:1.2;letter-spacing:-.035em}
[dir=ltr] #transport-services h3{line-height:1.4}
@media(max-width:600px){.quote-field-grid{grid-template-columns:1fr}.premium-site .contact__inner{gap:32px}#transport-services .solution-card{min-height:0}.premium-site .signature-hero h1{font-size:2.2rem}.premium-site .contact__form-wrap{padding:22px}.file-picker{flex-wrap:wrap}.premium-site .contact__details li{padding:14px 0}}

/* Contact controls: the number and handset share one telephone target. */
.premium-site .unified-contact__number{display:flex;align-items:center;gap:14px!important;font-size:clamp(1.85rem,3vw,2.4rem)!important;font-weight:800;line-height:1.4;min-height:56px!important;letter-spacing:.015em}
.unified-contact__number svg{width:28px;height:28px;flex-shrink:0}
.contact-phone-list{width:100%}
.contact-phone-row{display:flex;align-items:center;gap:12px;width:100%;max-width:310px}
.premium-site .contact-phone-call{display:flex;align-items:center;gap:12px;min-height:46px!important;padding:4px 0;font-size:1.08rem!important;font-weight:600}
.contact-phone-call svg{width:22px;height:22px;flex-shrink:0}
.premium-site .contact-phone-whatsapp{display:inline-flex;align-items:center;justify-content:center;width:46px;min-height:46px!important;flex-shrink:0;border:1px solid var(--border);border-radius:10px;color:#08783e;background:#eaf8ef;margin-inline-start:auto}
.contact-phone-whatsapp svg{width:25px;height:25px}
.premium-site .contact-phone-whatsapp:hover{background:#d9f3e2}
/* Compact contact groups: matching 44px controls and 22px glyphs. */
.contact-phone-row{width:fit-content;max-width:100%;gap:8px}
.premium-site .contact-phone-call{flex-direction:row-reverse;gap:12px;padding:0;min-height:44px!important}
.contact-phone-call svg{box-sizing:border-box;width:44px;height:44px;padding:10px;border:1px solid var(--border);border-radius:10px;background:var(--paper);flex:0 0 44px}
.premium-site .contact-phone-whatsapp{box-sizing:border-box;width:44px;height:44px;min-height:44px!important;margin-inline-start:0;border-radius:10px}
.contact-phone-whatsapp svg{width:22px;height:22px;flex:0 0 22px}
.premium-site .contact-phone-call:hover svg{background:#f1b65420}
.unified-contact__number{align-items:center}
/* Quiet outline controls: visible glyphs 22px, transparent touch targets 44px. */
.contact-phone-call svg{padding:11px;border:0;background:transparent;stroke-width:1.7}
.premium-site .contact-phone-whatsapp{border:0;background:transparent}
.premium-site .contact-phone-whatsapp:hover{background:#08783e0c}
.premium-site .contact-phone-call:hover svg{background:#20252b08}
.premium-site .contact-phone-call:focus-visible,.premium-site .contact-phone-whatsapp:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:8px}
.unified-contact__number svg{width:22px;height:22px;stroke-width:1.7}
/* International numbers with centered actions and a gold divider. */
.contact-number-grid{display:flex;flex-wrap:wrap;justify-content:center;width:100%;gap:20px 0;margin-top:12px}
.contact-number-group{position:relative;text-align:center;flex:1 1 180px;padding:0 12px;max-width:240px}
.contact-number-group:not(:first-child)::before{content:'';position:absolute;inset-inline-start:0;top:6px;width:1px;height:52px;background:linear-gradient(transparent,#f1b654,transparent)}
.premium-site .contact-international-number{display:inline-block;font-size:1.12rem!important;font-weight:750;white-space:nowrap;letter-spacing:.015em;min-height:32px!important}
.contact-number-actions{display:flex;justify-content:center;align-items:center;gap:4px;margin-top:3px}
.premium-site .contact-channel-icon{display:inline-flex;justify-content:center;align-items:center;width:44px;height:44px;min-height:44px!important;border-radius:50%;color:var(--ink);background:transparent}
.contact-channel-icon svg{width:22px;height:22px;flex-shrink:0}
.premium-site .contact-channel-icon--whatsapp{color:#08783e}
.premium-site .contact-channel-icon:hover{background:#20252b08}
.premium-site .contact-channel-icon:focus-visible,.premium-site .contact-international-number:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
@media(max-width:420px){.contact-number-group{flex-basis:100%;max-width:none}.contact-number-group:not(:first-child)::before{top:-10px;left:calc(50% - 22px);width:44px;height:1px;background:linear-gradient(90deg,transparent,#f1b654,transparent)}}
.contact-number-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.contact-number-group{min-width:0;max-width:none;padding:0 4px}
.premium-site .contact-international-number{font-size:clamp(.9rem,1.3vw,1.12rem)!important;letter-spacing:0}
@media(max-width:600px){.contact-number-grid{grid-template-columns:1fr;gap:20px}.premium-site .contact-international-number{font-size:1.15rem!important}.contact-number-group:not(:first-child)::before{top:-10px;left:calc(50% - 22px);right:auto;width:44px;height:1px;background:linear-gradient(90deg,transparent,#f1b654,transparent)}}
/* Reading, form-state and compact route refinements. */
.premium-site{--soft:#59636e}
[data-theme="dark"] .premium-site{--soft:#c1c9d0}
.premium-site :is(.section-desc,.premium-heading>p,.solution-card p,.international-contact){font-size:1rem;font-weight:500;line-height:1.85}
.premium-site :is(.contact__detail-label,.optional-pill,#quote-file-help,.image-provenance,.file-picker__name){font-size:.875rem;font-weight:500;line-height:1.75}
.premium-site .form-group label{font-size:.95rem;font-weight:600;line-height:1.65}
.premium-site .form-group :is(input,select,textarea){font-size:1rem;line-height:1.6;border:1px solid #8b949d;border-radius:8px;background:var(--paper);color:var(--ink)}
.premium-site .form-group :is(input,select,textarea):focus{outline:2px solid var(--ink);outline-offset:2px;border-color:var(--ink);box-shadow:none}
.premium-site .form-group [aria-invalid=true]{border:2px solid #a32424}
.ui-field-error{display:block;font-size:.875rem;font-weight:600;line-height:1.6;color:#a32424;margin-top:7px}
.ui-field-error[hidden],.ui-form-status[hidden]{display:none}
.ui-form-status{margin-top:16px;padding:14px 16px;border:1px solid var(--border);border-inline-start:4px solid var(--ink);border-radius:8px;line-height:1.75;font-size:.95rem;color:var(--ink);background:var(--paper)}
.ui-form-status[data-state=error]{border-inline-start-color:#a32424}
.ui-form-status[data-state=success]{border-inline-start-color:#08783e}
.contact-form[aria-busy=true] button[type=submit]{cursor:progress;opacity:.75}
.file-picker.has-file{border-style:solid;border-width:2px}.file-picker.has-file .file-picker__name{font-weight:600;color:var(--ink)}
.ui-state-demo{margin-top:16px;font-size:.85rem;color:var(--soft)}
.ui-state-demo summary{cursor:pointer;padding:10px 0}.ui-state-demo button{margin:6px;padding:10px 14px;border:1px solid var(--border);border-radius:6px;background:var(--paper);color:var(--ink);min-height:44px}
[data-theme=dark] .ui-field-error{color:#ffb4ab}[data-theme=dark] .premium-site .form-group [aria-invalid=true]{border-color:#ffb4ab}
.header-route,.header-route .brand-bus-track{height:32px}.header-route .brand-mini-bus{height:31.36px;width:89.6px;top:0px}.header-route__toggle{top:1px;height:28px}
.premium-site .signature-hero{margin-top:114px}.premium-site .service-hero,.premium-site .registration-intro{margin-top:32px}
@media(max-width:768px){.header-route,.header-route .brand-bus-track{height:28px}.header-route .brand-mini-bus{height:26.88px;width:76.16px}.header-route__toggle{top:0;height:27px}.premium-site .signature-hero{margin-top:100px}.premium-site .navbar__links{top:100px}.premium-site .service-hero,.premium-site .registration-intro{margin-top:28px}}
/* Footer QA: one alignment axis, no artificial line-break gaps. */
.premium-site .footer__brand{align-items:flex-start;gap:12px}
.premium-site .footer__brand>br{display:none}
.premium-site .footer__brand>a{align-self:flex-start;display:inline-flex;align-items:center;min-height:44px;width:fit-content;margin:0;font-size:1rem;line-height:1.5}
.premium-site .footer__brand>a[href="tel:920003790"]{font-size:1.65rem;font-weight:750;letter-spacing:.015em}
.premium-site .footer__whatsapp-list{gap:2px;align-items:flex-start}
.premium-site .footer .footer__whatsapp{padding:0;margin:0;gap:10px;font-weight:500}
.premium-site .footer__whatsapp svg{width:22px;height:22px;flex-basis:22px}
.premium-site .footer__brand p{margin:0 0 4px;font-size:.95rem;line-height:1.8}
.premium-site .file-picker input[type=file]{border:0}
/* Review: separate attachments; keep inactive success text out of navigation. */
.premium-site .quote-attachments .form-group{margin-bottom:18px}
.premium-site .quote-attachments .form-group label{display:block;margin-bottom:8px}
.form-success:not(.visible){visibility:hidden}
#contact{scroll-margin-top:120px}
@media(max-width:768px){#contact{scroll-margin-top:104px}}
/* Three homepage paths; service descriptions and destinations stay in the page. */
.home-paths{padding-block:52px 32px}.home-paths__intro{margin-bottom:26px}.home-paths__intro h2{font-size:clamp(1.7rem,2.6vw,2.5rem);line-height:1.5;margin:8px 0}
.home-paths__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.home-path-card{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:28px;border:1px solid var(--border);border-top:3px solid var(--border);border-radius:14px;color:var(--ink);background:var(--paper);text-decoration:none;transition:transform .18s,border-color .18s}
.home-path-card svg{width:32px;height:32px}.home-path-card h3{font-size:1.35rem;line-height:1.5;margin:0}.home-path-card p{font-size:1rem;line-height:1.85;font-weight:500;color:var(--soft);margin:0}.home-path-card>span{margin-top:auto;padding-top:8px;font-weight:700;font-size:.95rem}
.home-path-card--primary{background:#191f25;border-color:#191f25;border-top-color:#f1b654;color:#fff}.home-path-card--primary p{color:#d7dfe5}.home-path-card--primary svg,.home-path-card--primary>span{color:#f1b654}
.home-path-card:hover{transform:translateY(-3px);border-color:#f1b654}.home-path-card:focus-visible{outline:3px solid #805200;outline-offset:4px}
.home-service-group{padding-block:36px;scroll-margin-top:120px;border-top:1px solid var(--border)}.home-service-group>header{display:flex;gap:20px;align-items:flex-start;margin-bottom:26px}.home-service-group>header h2{font-size:1.8rem;line-height:1.5;margin:0 0 8px}.home-service-group>header p{font-size:1rem;color:var(--soft);max-width:68ch;line-height:1.85;margin:0}.path-marker{font-size:1rem;font-weight:700;padding:10px;border-radius:50%;background:#f1b65426;color:var(--ink)}
#university-path .solutions-grid{grid-template-columns:1fr}#university-path .solution-card{min-height:0;max-width:760px;width:100%}
@media(max-width:768px){.home-paths{padding-block:32px 20px}.home-paths__grid{grid-template-columns:1fr;gap:14px}.home-path-card{padding:22px;gap:10px}.home-path-card h3{font-size:1.25rem}.home-service-group>header{gap:12px}.home-service-group>header h2{font-size:1.5rem}.home-service-group{scroll-margin-top:104px}}
@media(prefers-reduced-motion:reduce){.home-path-card{transition:none}.home-path-card:hover{transform:none}}
#paths-title{scroll-margin-top:150px}.home-service-directory{padding-top:32px}.home-service-group .solution-index{display:none}
@media(max-width:768px){#paths-title{scroll-margin-top:120px}}
.home-path-card h3{white-space:nowrap}.premium-site .navbar__links{gap:clamp(12px,1.8vw,26px)}



/* Final layout review */
#sectors-title,#service-confirmation{scroll-margin-top:130px}
.sector-grid li{min-height:86px}
.sector-grid svg{color:#986414}
[data-theme="dark"] .sector-grid svg{color:#f1b654}
.service-body>#service-confirmation{margin-top:40px;padding:24px;border:1px solid var(--border);border-inline-start:3px solid var(--gold);border-radius:8px}
.service-body>#service-confirmation h2{font-size:1.45rem;margin-top:0}
.service-body>#service-confirmation p{margin-bottom:0}
@media(max-width:600px){
 .premium-site .signature-hero h1{font-size:clamp(1.8rem,7.5vw,2.2rem);line-height:1.4}
 .premium-site .signature-hero__description{font-size:1rem;line-height:1.8}
 .sector-grid li{min-height:88px}
 .service-body>#service-confirmation{padding:20px}
}
/* End final layout review */

#quoteForm .form-group[hidden],#quoteForm fieldset[hidden],#quoteForm details[hidden],#quoteForm button[hidden]{display:none!important}
