/* Hericom foundation. Load after template and page tweaks. No vendor edits. */
:root {
  --color-background: #080f1f;
  --color-surface: #101827;
  --color-surface-raised: #15233b;
  --color-primary: #c6231c;
  --color-primary-hover: #a91d17;
  --color-accent: #3978f6;
  --color-highlight: #38bdf8;
  --color-text: #f8fafc;
  --color-muted: #a8b3c5;
  --color-border: rgba(168, 179, 197, .22);
  --color-paper: #f8fafc;
  --color-ink: #15233b;
  --color-body: #475569;
  --font-body: 'Manrope', sans-serif;
  --font-display: 'Syne', sans-serif;
  --radius-card: 18px;
  --radius-button: 8px;
  --shadow-card: 0 16px 48px rgba(8, 15, 31, .09);
  --container-width: 1200px;
  --spacing-section: clamp(64px, 7vw, 112px);
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --transition-fast: 160ms;
  --transition-normal: 280ms;
  --transition-slow: 500ms;
  /* Keep legacy theme semantics: white is white; black remains dark ink. */
  --pitoon-base: var(--color-primary);
  --pitoon-base-rgb: 198, 35, 28;
  --pitoon-black: var(--color-background);
  --pitoon-black-rgb: 8, 15, 31;
  --pitoon-gray: var(--color-body);
  --pitoon-gray-rgb: 71, 85, 105;
  --pitoon-primary: #f1f5f9;
  --pitoon-primary-rgb: 241, 245, 249;
  --pitoon-bdr-color: #dce3ec;
  --pitoon-bdr-color-rgb: 220, 227, 236;
  --pitoon-border: var(--pitoon-bdr-color);
}
body { font-family: var(--font-body); font-size: 16px; line-height: 1.8; color: var(--color-body); background: var(--color-paper); }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-display); }
img { max-width: 100%; }
::selection { background: var(--color-accent); color: #fff; }
:where(a, button, input, textarea, select, [tabindex]):focus-visible {
  outline: 3px solid var(--color-highlight); outline-offset: 4px;
  box-shadow: 0 0 0 6px var(--color-background);
}
.skip-link { position: fixed; top: 12px; left: 12px; z-index: 10001; padding: 12px 20px; background: var(--color-paper); color: var(--color-ink); border-radius: var(--radius-button); transform: translateY(-180%); }
.skip-link:focus { transform: translateY(0); }
#main-content { scroll-margin-top: 120px; }
.section-title { margin-bottom: clamp(28px, 4vw, 48px); }
.section-title__title { font-size: clamp(2rem, 3.8vw, 3.5rem); line-height: 1.14; letter-spacing: -.035em; text-wrap: balance; }
.section-title__tagline { font-size: 12px; letter-spacing: .16em; font-weight: 800; }
.thm-btn { border-radius: var(--radius-button); padding: 16px 28px; min-height: 48px; font-weight: 800; line-height: 1.5; background: var(--color-primary); color: #fff; transition: background-color var(--transition-fast), box-shadow var(--transition-fast); }
.thm-btn:before, .thm-btn:after { background: var(--color-primary-hover); }
.thm-btn:hover { color: #fff; box-shadow: 0 8px 24px rgba(198, 35, 28, .22); }
/* Dark framing, with light editorial content for long-form readability. */
.main-menu__wrapper, .stricky-header { background: var(--color-background); }
.main-menu__wrapper-bg { opacity: .12; }
.main-header__top-inner { background: var(--color-surface); }
.main-header__contact-list li .text p,
.main-header__contact-list li .text p a,
.main-header__top-menu li a, .main-header__social-title { color: var(--color-muted); }
.main-menu .main-menu__list > li > a,
.stricky-header .main-menu__list > li > a { color: var(--color-text); }
.main-menu .main-menu__list > li.current > a,
.main-menu .main-menu__list > li > a:hover,
.stricky-header .main-menu__list > li.current > a { color: var(--color-highlight); }
.main-menu .main-menu__list li ul,
.stricky-header .main-menu__list li ul { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px; box-shadow: var(--shadow-card); }
.main-menu .main-menu__list li ul li > a,
.stricky-header .main-menu__list li ul li > a { color: var(--color-text); }
.main-menu .main-menu__list li:focus-within > ul,
.stricky-header .main-menu__list li:focus-within > ul { opacity: 1; visibility: visible; transform: translateY(0); }
.main-menu__call-number h5 a, .main-menu__call-sub-title { color: var(--color-text); }
.mobile-nav__content { background: var(--color-background); }
.mobile-nav__container .main-menu__list li a { min-height: 44px; }
.main-slider { background: var(--color-background); }
.main-slider__content { isolation: isolate; }
.main-slider__content::before { background: linear-gradient(115deg, rgba(8, 15, 31, .85), rgba(16, 24, 39, .55)); border-color: var(--color-border); box-shadow: 0 24px 80px rgba(0, 0, 0, .15); }
.main-slider__title { font-size: clamp(3rem, 6.5vw, 6.5rem); line-height: 1.04; letter-spacing: -.045em; }
/* Existing page tweaks use !important for these two text sizes. */
.main-slider__sub-title { font-size: clamp(.8rem, 1.4vw, 1rem) !important; letter-spacing: .14em; text-transform: uppercase; }
.main-slider__text { font-size: clamp(1rem, 1.6vw, 1.2rem) !important; max-width: 58ch; }
.page-header { background: var(--color-background); }
.page-header__inner h2 { font-size: clamp(2.5rem, 5vw, 4.5rem); line-height: 1.12; letter-spacing: -.035em; }
.services-one, .about-one, .about-four, .services-page, .contact-page, .project-one { padding-top: var(--spacing-section); padding-bottom: var(--spacing-section); }
.services-one__single, .services-page__single, .team-two__single,
.testimonial-one__single, .project-one__single { border-radius: var(--radius-card); box-shadow: var(--shadow-card); }
.services-one__single { border: 1px solid var(--pitoon-bdr-color); background: #fff; }
.services-one__title a:hover, .services-page__title a:hover { color: var(--color-primary); }
.about-one__img img, .about-four__img img, .contact__img img { border-radius: var(--radius-card); }
.contact__form-input-box input[type], .contact__form-input-box textarea,
.contact-page__input-box input[type], .contact-page__input-box textarea {
  border: 1px solid var(--pitoon-bdr-color); border-radius: var(--radius-button);
  background: #fff; color: var(--color-ink); font-size: 16px;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.contact__form-input-box input:focus, .contact__form-input-box textarea:focus,
.contact-page__input-box input:focus, .contact-page__input-box textarea:focus { border-color: var(--color-accent); }
.contact__form-input-box textarea, .contact-page__input-box textarea { min-height: 160px; }
.contact-form-validated label.error { color: #a91d17; font-size: 14px; }
.site-footer { background: radial-gradient(ellipse at 85% 0, rgba(57,120,246,.12), transparent 50%), var(--color-background); }
.site-footer__bg { opacity: .08; }
.footer-widget__title { font-size: 20px; letter-spacing: -.02em; }
.footer-widget__about-text, .footer-widget__explore-list li a,
.footer-widget__contact-list li p, .footer-widget__contact-list li p a,
.footer-widget__contact-text, .footer-widget__newsletter-text,
.footer-widget__newsletter-form .checked-box label,
.site-footer__bottom-text { color: var(--color-muted); }
.site-footer a:hover { color: var(--color-highlight); }
.site-footer__bottom { border-top: 1px solid var(--color-border); }
.cntech-shine { background: var(--color-surface-raised); box-shadow: none; }
.cntech-shine::after { animation: none; opacity: 0; }
/* Preserve Bootstrap/Pitoon breakpoints: 576, 768, 992, 1200, 1400px. */
@media (min-width: 1200px) {
  .container { max-width: var(--container-width); }
  .main-menu__wrapper-inner { flex-wrap: nowrap; gap: 24px; padding-inline: clamp(24px, 3vw, 60px); }
  .main-menu__left { width: auto; flex: 1; min-width: 0; margin-right: 0; flex-wrap: nowrap; gap: 32px; }
  .main-menu__logo { margin-right: 0; padding-block: 24px; flex-shrink: 0; }
  .main-menu__main-menu-box { flex: 1; padding-left: 0; }
  .main-menu__list { padding-right: 0; gap: 20px; }
  .main-menu .main-menu__list > li + li, .stricky-header .main-menu__list > li + li { margin-left: 0; }
}
@media (max-width: 767px) {
  .main-slider__content { max-width: 100%; }
  .main-slider__content::before { inset-inline: -8px; }
  .main-slider__title { font-size: clamp(2.5rem, 11vw, 4rem); }
  .contact-page__points .content h4 { overflow-wrap: anywhere; }
  .site-footer__bottom-inner { gap: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .wow { visibility: visible !important; }
  .main-slider__image { transform: none !important; }
}
/* Remove the legacy half-second visibility delay so keyboard focus can enter. */
.mobile-nav__wrapper.expanded .mobile-nav__content {
  transition: opacity var(--transition-normal), transform var(--transition-normal);
}
