/*
Theme Name: HarimTech Security
Theme URI: https://harimtech.ir
Author: Farzad Roozbahani
Author URI: https://feris.ir
Description: تم حرفه‌ای حریم تِک — راهکارهای امنیت الکترونیک
Version: 2.6.2
Requires at least: 5.8
Requires PHP: 7.4
Text Domain: harimtech
License: Proprietary
*/

/* ═══════════════════════════════════════
   DESIGN TOKENS — HarimTech
═══════════════════════════════════════ */
:root {
  /* Brand colors */
  --red:      #B01920;
  --red-dark: #8F1913;
  --red-deep: #50120F;
  --red-lite: #FF4A52;
  --red-glow: rgba(176,25,32,.18);

  /* Backgrounds */
  --bg:       #0D0D0D;
  --bg2:      #141414;
  --bg3:      #1A1A1A;
  --bg4:      #232323;
  --card:     rgba(255,255,255,.035);
  --card-h:   rgba(255,255,255,.06);

  /* Borders */
  --border:   rgba(255,255,255,.07);
  --border-r: rgba(176,25,32,.3);

  /* Text */
  --text:     #F5F5F5;
  --text2:    #A8A8A8;
  --text3:    #666;

  /* UI */
  --r-sm:   6px;
  --r-md:   10px;
  --r-lg:   16px;
  --r-xl:   24px;
  --r-full: 999px;
  --shadow: 0 8px 32px rgba(0,0,0,.4);
  --shadow-r: 0 8px 32px rgba(176,25,32,.25);
  --trans:  all .22s cubic-bezier(.22,1,.36,1);
  --gap:    24px;
  --font:   'Vazirmatn', Tahoma, Arial, sans-serif;
  --header-h: 64px;
  --pre-h:    40px;
}

/* Light mode */
body.light-mode {
  --bg:    #F5F5F5;
  --bg2:   #EBEBEB;
  --bg3:   #E0E0E0;
  --bg4:   #D5D5D5;
  --card:  rgba(0,0,0,.04);
  --card-h:rgba(0,0,0,.07);
  --border:rgba(0,0,0,.08);
  --text:  #1A1A1A;
  --text2: #555;
  --text3: #888;
}

/* ═══ RESET ═══ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;font-size:16px;overflow-x:hidden;}
body{
  font-family:var(--font);
  background:var(--bg);
  color:var(--text);
  direction:rtl;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  max-width:100vw;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
button{cursor:pointer;border:none;background:none;font-family:inherit;}
input,textarea,select{font-family:inherit;}

/* ═══ TYPOGRAPHY ═══ */
.ht-h1{font-size:clamp(2rem,5vw,3.5rem);font-weight:900;line-height:1.2;}
.ht-h2{font-size:clamp(1.5rem,3.5vw,2.5rem);font-weight:800;line-height:1.3;}
.ht-h3{font-size:clamp(1.1rem,2.5vw,1.6rem);font-weight:700;line-height:1.4;}
.ht-h4{font-size:1rem;font-weight:700;}
.ht-lead{font-size:1.1rem;color:var(--text2);line-height:1.85;}
.ht-label{
  font-size:.72rem;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--red-lite);
  display:block;margin-bottom:10px;
}
.ht-body{color:var(--text2);line-height:1.9;}

/* ═══ LAYOUT ═══ */
.ht-container{
  width:100%;max-width:1280px;
  margin:0 auto;padding:0 24px;
}
.ht-section{padding:80px 0;}
.ht-section--sm{padding:48px 0;}
.ht-section--alt{background:var(--bg2);}
.ht-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);}
.ht-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);}
.ht-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);}
.ht-flex{display:flex;align-items:center;gap:var(--gap);}
.ht-center{text-align:center;}

/* ═══ BUTTONS ═══ */
.ht-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 28px;border-radius:var(--r-full);
  font-size:.88rem;font-weight:700;
  transition:var(--trans);cursor:pointer;border:none;
}
.ht-btn--primary{
  background:var(--red);color:#fff;
  box-shadow:0 4px 20px rgba(176,25,32,.35);
}
.ht-btn--primary:hover{background:var(--red-lite);box-shadow:0 6px 28px rgba(255,74,82,.4);transform:translateY(-2px);}
.ht-btn--outline{
  background:transparent;color:var(--red-lite);
  border:1.5px solid var(--red);
}
.ht-btn--outline:hover{background:var(--red-glow);border-color:var(--red-lite);}
.ht-btn--ghost{
  background:var(--card);color:var(--text2);
  border:1px solid var(--border);
}
.ht-btn--ghost:hover{background:var(--card-h);color:var(--text);}
.ht-btn--sm{padding:8px 18px;font-size:.8rem;}
.ht-btn--lg{padding:16px 40px;font-size:1rem;}

/* ═══ CARDS ═══ */
.ht-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--r-xl);
  padding:28px;
  transition:var(--trans);
  position:relative;overflow:hidden;
}
.ht-card:hover{
  background:var(--card-h);
  border-color:var(--border-r);
  transform:translateY(-4px);
  box-shadow:var(--shadow-r);
}
.ht-card::before{
  content:'';position:absolute;
  top:0;right:0;left:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--red),transparent);
  opacity:0;transition:var(--trans);
}
.ht-card:hover::before{opacity:1;}

/* ═══ BADGES ═══ */
.ht-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 12px;border-radius:var(--r-full);
  font-size:.75rem;font-weight:700;
  background:var(--red-glow);color:var(--red-lite);
  border:1px solid rgba(176,25,32,.3);
}

/* ═══ SECTION HEADER ═══ */
.ht-section-header{margin-bottom:48px;}
.ht-section-header.ht-center .ht-h2{margin:8px 0;}
.ht-divider{
  width:48px;height:3px;
  background:linear-gradient(90deg,var(--red),var(--red-lite));
  border-radius:2px;margin:16px 0;
}
.ht-center .ht-divider{margin:16px auto;}

/* ═══ PRE-HEADER ═══ */
.ht-prehead{
  background:var(--bg4);
  height:var(--pre-h);
  display:flex;align-items:center;
  border-bottom:1px solid var(--border);
  font-size:.78rem;color:var(--text3);
}
.ht-prehead__inner{
  display:flex;align-items:center;justify-content:space-between;
  width:100%;
}
.ht-prehead__consult{
  display:flex;align-items:center;gap:6px;color:var(--text2);
}
.ht-prehead__consult a{color:var(--red-lite);font-weight:700;}
.ht-prehead__socials{display:flex;align-items:center;gap:10px;}
.ht-prehead__social{
  width:26px;height:26px;
  display:flex;align-items:center;justify-content:center;
  border-radius:var(--r-sm);background:var(--card);
  font-size:.85rem;transition:var(--trans);color:var(--text2);
}
.ht-prehead__social:hover{background:var(--red);color:#fff;}

/* ═══ HEADER ═══ */
.ht-header{
  height:var(--header-h);
  background:rgba(13,13,13,.92);
  backdrop-filter:blur(20px) saturate(160%);
  -webkit-backdrop-filter:blur(20px) saturate(160%);
  border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:900;
  transition:background .3s, border-color .3s, box-shadow .3s;
}
body.light-mode .ht-header{
  background:rgba(245,245,245,.95);
  border-bottom-color:rgba(0,0,0,.08);
}
.ht-header.scrolled{
  box-shadow:0 4px 24px rgba(0,0,0,.5);
  border-bottom-color:rgba(176,25,32,.2);
}
.ht-navbar{
  height:var(--header-h);
  display:flex;align-items:center;
  justify-content:space-between;gap:24px;
}
.ht-logo{display:flex;align-items:center;text-decoration:none;flex-shrink:0;}
.ht-logo img{height:38px;width:auto;}

/* Nav */
.ht-nav{display:flex;align-items:center;gap:4px;flex:1;justify-content:center;}
.ht-nav__item{position:relative;}
.ht-nav__link{
  display:flex;align-items:center;gap:4px;
  padding:8px 14px;border-radius:var(--r-md);
  font-size:.86rem;font-weight:600;color:var(--text2);
  transition:var(--trans);white-space:nowrap;
}
.ht-nav__link:hover,.ht-nav__link--active{color:var(--text);background:var(--card);}
.ht-nav__link--active{color:var(--red-lite);}

/* Nav dropdown */
.ht-nav__item.has-sub:hover > .ht-dropdown{display:block;}
.ht-dropdown{
  display:none;
  position:absolute;top:calc(100% + 8px);right:0;
  min-width:220px;
  background:rgba(20,20,20,.95);
  backdrop-filter:blur(24px);
  border:1px solid var(--border);
  border-radius:var(--r-lg);
  padding:8px;z-index:500;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.ht-dropdown::before{
  content:'';position:absolute;
  top:-8px;right:0;left:0;height:8px;
}
.ht-drop-link{
  display:flex;align-items:center;gap:10px;
  padding:9px 12px;border-radius:var(--r-md);
  font-size:.84rem;color:var(--text2);
  transition:var(--trans);
}
.ht-drop-link:hover{background:var(--red-glow);color:var(--red-lite);}

/* Header actions */
.ht-header__actions{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.ht-search-btn,.ht-theme-toggle,.ht-mobile-toggle{
  width:38px;height:38px;
  display:flex;align-items:center;justify-content:center;
  border-radius:var(--r-md);
  background:var(--card);color:var(--text2);
  font-size:1rem;transition:var(--trans);
}
.ht-search-btn:hover,.ht-theme-toggle:hover,.ht-mobile-toggle:hover{
  background:var(--red-glow);color:var(--red-lite);
}
.ht-mobile-toggle{display:none;}

/* ═══ SEARCH OVERLAY — Redesigned ═══ */
.ht-search-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.7);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  z-index: 1000;
  align-items: flex-start;
  justify-content: center;
  padding-top: 80px;
}
.ht-search-overlay.open { display: flex; }
.ht-search-box {
  width: 100%;
  max-width: 680px;
  background: var(--bg3);
  border: 1px solid var(--border-r);
  border-radius: var(--r-xl);
  padding: 6px 6px 6px 16px;
  display: flex;
  gap: 10px;
  align-items: center;
  box-shadow: 0 24px 64px rgba(0,0,0,.5), 0 0 0 1px rgba(176,25,32,.2);
}
.ht-search-box form { flex: 1; display: flex; align-items: center; gap: 10px; }
.ht-search-input {
  flex: 1;
  background: none;
  border: none;
  outline: none;
  font-size: 1.05rem;
  color: var(--text);
  font-family: var(--font);
  padding: 10px 0;
}
.ht-search-input::placeholder { color: var(--text3); }
.ht-search-submit {
  background: var(--red);
  color: #fff;
  border: none;
  border-radius: var(--r-lg);
  padding: 10px 20px;
  font-family: var(--font);
  font-weight: 700;
  font-size: .88rem;
  cursor: pointer;
  transition: var(--trans);
  white-space: nowrap;
}
.ht-search-submit:hover { background: var(--red-lite); }
.ht-search-close-btn {
  width: 38px; height: 38px;
  border-radius: var(--r-md);
  background: var(--card);
  border: 1px solid var(--border);
  color: var(--text3);
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem; cursor: pointer;
  transition: var(--trans); flex-shrink: 0;
}
.ht-search-close-btn:hover { background: var(--red-glow); color: var(--red-lite); border-color: var(--border-r); }
/* Search hint */
.ht-search-hint {
  margin-top: 12px;
  text-align: center;
  font-size: .75rem;
  color: rgba(255,255,255,.3);
}

/* Mobile menu */
.ht-mobile-menu{
  display:none;position:fixed;inset:0;top:calc(var(--pre-h) + var(--header-h));
  background:var(--bg2);z-index:800;
  padding:16px;overflow-y:auto;
}
.ht-mobile-menu.open{display:block;}
.mob-link{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;border-radius:var(--r-md);
  color:var(--text2);font-size:.9rem;font-weight:600;
  transition:var(--trans);
}
.mob-link:hover,.mob-item.active>.mob-link{color:var(--red-lite);}
.mob-toggle{opacity:.4;transition:transform .2s;font-size:.8rem;}
.mob-item.open>.mob-link .mob-toggle{transform:rotate(90deg);opacity:.8;}
.mob-sub{display:none;padding-right:12px;border-right:2px solid var(--border-r);margin:2px 12px 6px;}
.mob-item.open>.mob-sub{display:block;}

/* ═══ HERO SLIDER ═══ */
.ht-hero{position:relative;overflow:hidden;min-height:90vh;display:flex;align-items:center;}
.ht-hero__slides{position:relative;width:100%;min-height:90vh;}
.ht-hero__slide{
  position:absolute;inset:0;
  display:flex;align-items:center;
  opacity:0;transition:opacity .7s ease;pointer-events:none;
}
.ht-hero__slide.active{opacity:1;pointer-events:auto;}
.ht-hero__slide.active a.ht-hero__slide-link{pointer-events:auto;}
.ht-hero__slide-link{
  position:absolute;inset:0;z-index:0;
  display:block;
}
.ht-hero__bg{
  position:absolute;inset:0;
  background-size:cover;background-position:center;
  z-index:0;
}
.ht-hero__bg video{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;z-index:0;
}
.ht-hero__overlay{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(135deg,rgba(13,13,13,.85) 0%,rgba(80,18,15,.3) 100%);
}
.ht-hero__content{
  position:relative;z-index:2;
  max-width:680px;
}
.ht-hero__badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 16px;border-radius:var(--r-full);
  background:var(--red-glow);border:1px solid rgba(176,25,32,.4);
  font-size:.78rem;font-weight:700;color:var(--red-lite);
  margin-bottom:20px;
}
.ht-hero__title{
  font-size:clamp(2rem,5.5vw,3.8rem);
  font-weight:900;line-height:1.2;
  margin-bottom:18px;
  color:#fff;
}
.ht-hero__title span{color:var(--red-lite);}
.ht-hero__desc{
  font-size:1.05rem;color:rgba(255,255,255,.75);
  line-height:1.85;margin-bottom:28px;
}
.ht-hero__actions{display:flex;gap:12px;flex-wrap:wrap;}
.ht-hero__nav{
  position:absolute;bottom:32px;right:50%;
  transform:translateX(50%);
  display:flex;align-items:center;gap:8px;z-index:3;
}
.ht-hero__dot{
  width:8px;height:8px;border-radius:50%;
  background:rgba(255,255,255,.3);
  transition:var(--trans);cursor:pointer;border:none;
}
.ht-hero__dot.active{background:var(--red-lite);width:24px;border-radius:4px;}
.ht-hero__arrows{
  position:absolute;top:50%;transform:translateY(-50%);
  display:flex;justify-content:space-between;
  width:100%;padding:0 16px;z-index:3;pointer-events:none;
}
.ht-hero__arrow{
  width:44px;height:44px;border-radius:50%;
  background:rgba(176,25,32,.3);backdrop-filter:blur(8px);
  color:#fff;font-size:1.1rem;
  display:flex;align-items:center;justify-content:center;
  pointer-events:auto;transition:var(--trans);
}
.ht-hero__arrow:hover{background:var(--red);}

/* ═══ WHY US SECTION ═══ */
.ht-why__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:20px;
}
.ht-why-item{
  display:flex;gap:16px;align-items:flex-start;
  padding:20px;border-radius:var(--r-lg);
  border:1px solid var(--border);
  background:var(--card);
  transition:var(--trans);
}
.ht-why-item:hover{border-color:var(--border-r);background:var(--card-h);}
.ht-why-item__icon{
  width:48px;height:48px;flex-shrink:0;
  border-radius:var(--r-md);
  background:var(--red-glow);
  display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;color:var(--red-lite);
}
.ht-why-item__title{font-size:.92rem;font-weight:700;margin-bottom:6px;}
.ht-why-item__text{font-size:.82rem;color:var(--text2);line-height:1.7;}

/* ═══ STATS ═══ */
.ht-stats{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;background:var(--border);
  border:1px solid var(--border);border-radius:var(--r-xl);
  overflow:hidden;
}
.ht-stat{
  background:var(--bg2);padding:32px 24px;
  text-align:center;transition:var(--trans);
}
.ht-stat:hover{background:var(--bg3);}
.ht-stat__num{
  font-size:2.4rem;font-weight:900;
  color:var(--red-lite);display:block;line-height:1;
  margin-bottom:8px;
}
.ht-stat__label{font-size:.82rem;color:var(--text3);}

/* ═══ SERVICE SLIDER ═══ */
.ht-slider{position:relative;overflow:hidden;}
.ht-slider__track{
  display:flex;gap:20px;
  transition:transform .45s cubic-bezier(.22,1,.36,1);
}
.ht-slider__nav{
  display:flex;justify-content:center;gap:10px;
  margin-top:28px;
}
.ht-slider__arrow{
  width:40px;height:40px;border-radius:50%;
  background:var(--card);border:1px solid var(--border);
  color:var(--text2);display:flex;align-items:center;justify-content:center;
  transition:var(--trans);font-size:.9rem;
}
.ht-slider__arrow:hover{background:var(--red);border-color:var(--red);color:#fff;}
.ht-slider__dots{display:flex;gap:6px;align-items:center;}
.ht-slider__dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--border);transition:var(--trans);
}
.ht-slider__dot.active{background:var(--red-lite);width:18px;border-radius:3px;}

/* Service card */
.ht-service-card{
  flex:0 0 calc(33.333% - 14px);
  min-width:0;
}
.ht-service-card__img{
  aspect-ratio:16/9;border-radius:var(--r-lg);
  overflow:hidden;margin-bottom:16px;
  background:var(--bg3);
  position:relative;
}
.ht-service-card__img img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .4s ease;
}
.ht-service-card:hover .ht-service-card__img img{transform:scale(1.05);}
.ht-service-card__icon{
  position:absolute;top:12px;right:12px;
  width:36px;height:36px;border-radius:var(--r-md);
  background:var(--red);
  display:flex;align-items:center;justify-content:center;
  font-size:1rem;color:#fff;
}
.ht-service-card__title{font-size:.95rem;font-weight:700;margin-bottom:6px;}
.ht-service-card__text{font-size:.8rem;color:var(--text2);line-height:1.7;}
.ht-service-card__link{
  display:inline-flex;align-items:center;gap:4px;
  font-size:.78rem;color:var(--red-lite);margin-top:10px;
  font-weight:700;
}

/* Project card */
.ht-project-card{flex:0 0 calc(33.333% - 14px);min-width:0;}
.ht-project-card__img{
  aspect-ratio:4/3;border-radius:var(--r-lg);
  overflow:hidden;position:relative;
  background:var(--bg3);
}
.ht-project-card__img img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
.ht-project-card:hover .ht-project-card__img img{transform:scale(1.06);}
.ht-project-card__overlay{
  position:absolute;inset:0;
  background:linear-gradient(0deg,rgba(13,13,13,.9) 0%,transparent 50%);
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:20px;opacity:0;transition:var(--trans);
}
.ht-project-card:hover .ht-project-card__overlay{opacity:1;}
.ht-project-card__meta{margin-top:12px;}
.ht-project-card__title{font-size:.9rem;font-weight:700;}
.ht-project-card__cat{font-size:.75rem;color:var(--red-lite);}

/* Testimonial card */
.ht-testimonial-card{
  flex:0 0 calc(50% - 10px);min-width:0;
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--r-xl);padding:28px;
  transition:var(--trans);
}
.ht-testimonial-card:hover{border-color:var(--border-r);}
.ht-testimonial-card__stars{color:var(--red-lite);font-size:.9rem;margin-bottom:14px;}
.ht-testimonial-card__text{
  font-size:.88rem;color:var(--text2);line-height:1.85;
  margin-bottom:20px;font-style:italic;
}
.ht-testimonial-card__author{display:flex;align-items:center;gap:12px;}
.ht-testimonial-card__avatar{
  width:44px;height:44px;border-radius:50%;
  object-fit:cover;border:2px solid var(--red);
  flex-shrink:0;background:var(--bg3);
}
.ht-testimonial-card__name{font-size:.88rem;font-weight:700;}
.ht-testimonial-card__company{font-size:.75rem;color:var(--text3);}

/* ═══ CLIENTS MARQUEE ═══ */
.ht-marquee-wrap{
  overflow:hidden;position:relative;padding:8px 0;
}
.ht-marquee-wrap::before,.ht-marquee-wrap::after{
  content:'';position:absolute;top:0;bottom:0;width:120px;z-index:2;pointer-events:none;
}
.ht-marquee-wrap::before{right:0;background:linear-gradient(to left,var(--bg),transparent);}
.ht-marquee-wrap::after{left:0;background:linear-gradient(to right,var(--bg),transparent);}
.ht-marquee{display:flex;gap:20px;width:max-content;will-change:transform;}
.ht-marquee__item{
  flex-shrink:0;width:150px;height:80px;
  display:flex;align-items:center;justify-content:center;
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--r-lg);padding:12px;
  transition:var(--trans);
}
.ht-marquee__item:hover{border-color:var(--border-r);background:var(--red-glow);}
.ht-marquee__item img{
  max-width:100%;max-height:48px;
  object-fit:contain;filter:grayscale(1) brightness(1.5);
  transition:var(--trans);
}
.ht-marquee__item:hover img{filter:none;}

/* ═══ BLOG ═══ */
.ht-post-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden;transition:var(--trans);}
.ht-post-card:hover{border-color:var(--border-r);transform:translateY(-4px);box-shadow:var(--shadow-r);}
.ht-post-card__img{aspect-ratio:16/9;overflow:hidden;background:var(--bg3);}
.ht-post-card__img img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
.ht-post-card:hover .ht-post-card__img img{transform:scale(1.04);}
.ht-post-card__body{padding:20px;}
.ht-post-card__cat{font-size:.72rem;font-weight:700;color:var(--red-lite);text-transform:uppercase;letter-spacing:.06em;}
.ht-post-card__title{font-size:.95rem;font-weight:700;margin:8px 0;line-height:1.5;}
.ht-post-card__excerpt{font-size:.8rem;color:var(--text2);line-height:1.7;margin-bottom:14px;}
.ht-post-card__meta{
  display:flex;align-items:center;justify-content:space-between;
  font-size:.72rem;color:var(--text3);
  border-top:1px solid var(--border);padding-top:12px;margin-top:12px;
}
.ht-read-time{display:flex;align-items:center;gap:4px;}

/* ═══ FOOTER ═══ */
.ht-footer{background:var(--bg4);border-top:1px solid var(--border);}
.ht-footer__main{padding:56px 0 40px;display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:40px;}
.ht-footer__logo{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.ht-footer__logo img{height:36px;width:auto;}
.ht-footer__desc{font-size:.82rem;color:var(--text3);line-height:1.8;margin-bottom:20px;}
.ht-footer__keywords{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px;}
.ht-footer__kw{
  font-size:.7rem;padding:3px 10px;
  border-radius:var(--r-full);
  background:var(--card);border:1px solid var(--border);
  color:var(--text3);text-decoration:none;transition:var(--trans);
}
.ht-footer__kw:hover{border-color:var(--border-r);color:var(--red-lite);}
.ht-footer__socials{display:flex;gap:8px;}
.ht-footer__social{
  width:34px;height:34px;border-radius:var(--r-md);
  background:var(--card);border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;
  font-size:.9rem;color:var(--text3);transition:var(--trans);
}
.ht-footer__social:hover{background:var(--red);border-color:var(--red);color:#fff;}
.ht-footer__col h4{font-size:.88rem;font-weight:700;margin-bottom:16px;color:var(--text);}
.ht-footer__links{list-style:none;display:flex;flex-direction:column;gap:8px;}
.ht-footer__links a{font-size:.82rem;color:var(--text3);transition:var(--trans);}
.ht-footer__links a:hover{color:var(--red-lite);padding-right:4px;}
.ht-footer__contact-item{display:flex;align-items:flex-start;gap:8px;margin-bottom:10px;}
.ht-footer__contact-icon{color:var(--red-lite);margin-top:2px;flex-shrink:0;}
.ht-footer__contact-text{font-size:.82rem;color:var(--text3);line-height:1.6;}
.ht-footer__contact-text a{color:var(--text2);}
.ht-footer__contact-text a:hover{color:var(--red-lite);}
.ht-footer__bottom{
  border-top:1px solid var(--border);
  padding:16px 0;
  display:flex;align-items:center;justify-content:space-between;
  font-size:.75rem;color:var(--text3);
}
.ht-footer__dev a{color:var(--red-lite);font-weight:700;}
.ht-footer__dev a:hover{color:var(--text);}

/* ═══ ANIMATIONS ═══ */
.anim{opacity:0;transform:translateY(24px);transition:opacity .55s cubic-bezier(.22,1,.36,1),transform .55s cubic-bezier(.22,1,.36,1);}
.anim.visible{opacity:1;transform:translateY(0);}
.anim-left{opacity:0;transform:translateX(28px);transition:opacity .6s cubic-bezier(.22,1,.36,1),transform .6s cubic-bezier(.22,1,.36,1);}
.anim-left.visible{opacity:1;transform:translateX(0);}
.anim-right{opacity:0;transform:translateX(-28px);transition:opacity .6s cubic-bezier(.22,1,.36,1),transform .6s cubic-bezier(.22,1,.36,1);}
.anim-right.visible{opacity:1;transform:translateX(0);}
.anim-scale{opacity:0;transform:scale(.88);transition:opacity .45s cubic-bezier(.34,1.56,.64,1),transform .45s cubic-bezier(.34,1.56,.64,1);}
.anim-scale.visible{opacity:1;transform:scale(1);}
.anim-d1{transition-delay:.05s;}.anim-d2{transition-delay:.1s;}.anim-d3{transition-delay:.15s;}.anim-d4{transition-delay:.2s;}.anim-d5{transition-delay:.25s;}.anim-d6{transition-delay:.3s;}

/* ═══ BREADCRUMB ═══ */
.ht-breadcrumb{display:flex;align-items:center;gap:6px;font-size:.78rem;color:var(--text3);padding:12px 0;}
.ht-breadcrumb a{color:var(--text3);transition:var(--trans);}
.ht-breadcrumb a:hover{color:var(--red-lite);}
.ht-breadcrumb__sep{opacity:.4;}

/* ═══ SINGLE ARTICLE ═══ */
.ht-article{max-width:780px;}
.ht-article__header{margin-bottom:32px;}
.ht-article__hero{aspect-ratio:16/7;border-radius:var(--r-xl);overflow:hidden;margin-bottom:32px;}
.ht-article__hero img{width:100%;height:100%;object-fit:cover;}
.ht-article__toc{
  background:var(--bg3);border:1px solid var(--border);
  border-radius:var(--r-lg);padding:20px;margin-bottom:28px;
}
.ht-article__toc h4{font-size:.85rem;font-weight:700;margin-bottom:12px;}
.ht-article__toc ul{list-style:none;display:flex;flex-direction:column;gap:6px;}
.ht-article__toc a{font-size:.82rem;color:var(--text2);transition:var(--trans);}
.ht-article__toc a:hover{color:var(--red-lite);}
.ht-article__body{font-size:.92rem;line-height:2;color:var(--text2);}
.ht-article__body h2,.ht-article__body h3{color:var(--text);margin:32px 0 14px;}
.ht-article__body p{margin-bottom:18px;}
.ht-article__body img{border-radius:var(--r-lg);margin:20px 0;}

/* Sidebar */
.ht-sidebar{position:sticky;top:calc(var(--pre-h)+var(--header-h)+24px);}
.ht-sidebar__widget{background:var(--card);border:1px solid var(--border);border-radius:var(--r-xl);padding:20px;margin-bottom:20px;}
.ht-sidebar__widget h4{font-size:.85rem;font-weight:700;margin-bottom:14px;}
.ht-sidebar__post{display:flex;gap:10px;align-items:flex-start;margin-bottom:12px;}
.ht-sidebar__post img{width:56px;height:42px;border-radius:var(--r-sm);object-fit:cover;flex-shrink:0;}
.ht-sidebar__post-title{font-size:.78rem;font-weight:600;line-height:1.5;color:var(--text2);}
.ht-sidebar__post-title:hover{color:var(--red-lite);}
.ht-sidebar__banner{border-radius:var(--r-lg);overflow:hidden;display:block;}
.ht-sidebar__banner img{width:100%;transition:var(--trans);}
.ht-sidebar__banner:hover img{transform:scale(1.02);}

/* ═══ RESPONSIVE ═══ */
@media(max-width:1024px){
  .ht-grid-4{grid-template-columns:repeat(2,1fr);}
  .ht-footer__main{grid-template-columns:1fr 1fr;gap:28px;}
  .ht-service-card{flex:0 0 calc(50% - 10px);}
  .ht-project-card{flex:0 0 calc(50% - 10px);}
}
@media(max-width:768px){
  .ht-nav{display:none;}
  .ht-mobile-toggle{display:flex;}
  .ht-prehead__consult span:not(.ht-prehead__consult a){display:none;}
  .ht-grid-2,.ht-grid-3{grid-template-columns:1fr;}
  .ht-stats{grid-template-columns:repeat(2,1fr);}
  .ht-hero{min-height:75vh;}
  .ht-hero__slides{min-height:75vh;}
  .ht-testimonial-card{flex:0 0 100%;}
  .ht-section{padding:56px 0;}
}
@media(max-width:600px){
  .ht-footer__main{grid-template-columns:1fr;}
  .ht-service-card,.ht-project-card{flex:0 0 calc(85vw);}
  .ht-stats{grid-template-columns:1fr 1fr;}
  .ht-grid-4{grid-template-columns:1fr 1fr;}
  .ht-hero__title{font-size:1.8rem;}
  .ht-container{padding:0 16px;}
}

/* ═══ PRE-HEADER SLOGAN ═══ */
.ht-prehead__slogan {
  font-size: .75rem;
  color: var(--red-lite);
  font-weight: 600;
  letter-spacing: .03em;
  display: none;
}
@media(min-width:900px) { .ht-prehead__slogan { display: block; } }
.ht-prehead__label { color: var(--text3); }

/* ═══ HEADER REDESIGN ═══ */
.ht-header {
  background: rgba(13,13,13,.96) !important;
  border-bottom: 1px solid rgba(176,25,32,.15) !important;
}
/* Light mode header */
body.light-mode .ht-header {
  background: rgba(245,245,245,.97) !important;
  border-bottom-color: rgba(176,25,32,.2) !important;
  box-shadow: 0 2px 20px rgba(0,0,0,.08);
}
body.light-mode .ht-nav__link { color: #444; }
body.light-mode .ht-nav__link:hover { background: rgba(176,25,32,.06); color: #B01920; }
body.light-mode .ht-search-btn,
body.light-mode .ht-theme-toggle,
body.light-mode .ht-mobile-toggle { background: rgba(0,0,0,.06); color: #555; }

/* Header CTA button */
.ht-header__cta {
  font-size: .8rem !important;
  padding: 9px 18px !important;
  white-space: nowrap;
}
@media(max-width:960px) { .ht-header__cta { display: none; } }

/* ═══ MOBILE MENU REDESIGN ═══ */
.ht-mobile-menu {
  padding: 16px;
  border-top: 2px solid var(--red);
}
.mob-menu-wrap { display: flex; flex-direction: column; gap: 2px; }
.mob-footer {
  padding: 16px;
  border-top: 1px solid var(--border);
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* ═══ SERVICE CARD — SQUARE IMAGE ═══ */
.ht-service-card__img { aspect-ratio: 1 / 1 !important; }

/* ═══ TESTIMONIAL — AUTHOR FIRST ═══ */
.ht-testimonial-card { display: flex; flex-direction: column; }
.ht-testimonial-card__author { order: -1; margin-bottom: 16px; }
.ht-testimonial-card__stars { order: 1; margin-top: 12px; margin-bottom: 0; }
.ht-testimonial-card__text  { order: 2; margin-bottom: 0; }

/* ═══ HEADER ACTIVE STATE ═══ */
body.light-mode .ht-mobile-menu {
  background: #F5F5F5;
  border-top-color: var(--red);
}
body.light-mode .mob-link { color: #444; }
body.light-mode .mob-link:hover { color: var(--red); }

/* ═══ FORM INPUTS ═══ */
.ht-input {
  width: 100%;
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 12px 14px;
  color: var(--text);
  font-family: var(--font);
  font-size: .88rem;
  outline: none;
  transition: var(--trans);
}
.ht-input:focus { border-color: var(--red); box-shadow: 0 0 0 3px rgba(176,25,32,.1); }
.ht-input::placeholder { color: var(--text3); }
.ht-form-success { background: rgba(34,197,94,.1); border: 1px solid rgba(34,197,94,.3); color: #22C55E; }
.ht-form-error   { background: rgba(239,68,68,.1);  border: 1px solid rgba(239,68,68,.3);  color: #EF4444; }
body.light-mode .ht-input { background: #fff; border-color: #ddd; color: #1A1A1A; }

/* ═══ PREHEAD SLOGAN ═══ */
.ht-prehead__slogan {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-size: .72rem;
  color: var(--text2);
  font-weight: 600;
  letter-spacing: .03em;
  white-space: nowrap;
  pointer-events: none;
}
.ht-prehead__label { display: inline; }
@media(max-width:900px) {
  .ht-prehead__slogan { display: none; }
  .ht-prehead__label  { display: none; }
}

/* ═══ HEADER REDESIGN ═══ */
.ht-header-logo-text {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}
.ht-header-logo-name {
  font-size: .9rem;
  font-weight: 900;
  color: var(--text);
}
.ht-header-logo-sub {
  font-size: .62rem;
  color: var(--text3);
  letter-spacing: .04em;
}
body.light-mode .ht-header-logo-name { color: var(--text); }

/* Nav active indicator */
.ht-nav__link--active {
  color: var(--red-lite) !important;
  background: var(--red-glow) !important;
}
.ht-nav__link--active::after {
  content: '';
  position: absolute;
  bottom: -2px;
  right: 12px;
  left: 12px;
  height: 2px;
  background: var(--red-lite);
  border-radius: 1px;
}
.ht-nav__item { position: relative; }

/* CTA button in nav */
.ht-nav__cta {
  background: var(--red) !important;
  color: #fff !important;
  border-radius: var(--r-full) !important;
  padding: 8px 18px !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 16px rgba(176,25,32,.3);
  transition: var(--trans);
}
.ht-nav__cta:hover {
  background: var(--red-lite) !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(255,74,82,.4);
}

/* Service card square image */
.ht-service-card__img {
  aspect-ratio: 1/1 !important;
}

/* Testimonial card redesign */
.ht-testimonial-card__author-top {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
}

/* Light mode header fix */
body.light-mode .ht-navbar { color: var(--text); }
body.light-mode .ht-nav__link { color: var(--text2); }
body.light-mode .ht-nav__link:hover { color: var(--text); background: rgba(0,0,0,.05); }
body.light-mode .ht-search-btn,
body.light-mode .ht-theme-toggle,
body.light-mode .ht-mobile-toggle {
  background: rgba(0,0,0,.06);
  color: var(--text2);
}
body.light-mode .ht-header.scrolled {
  box-shadow: 0 4px 24px rgba(0,0,0,.1);
}

/* ═══ PRE-HEADER SLOGAN ═══ */
.ht-prehead__slogan {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: .78rem;
  color: var(--text2);
  font-weight: 500;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.ht-prehead__inner { position: relative; }
@media (max-width: 768px) {
  .ht-prehead__slogan { display: none; }
}

/* ═══ HEADER — LIGHT MODE FIX ═══ */
body.light-mode .ht-header {
  background: rgba(245,245,245,.95);
  border-bottom-color: rgba(0,0,0,.08);
}
body.light-mode .ht-header.scrolled {
  box-shadow: 0 4px 24px rgba(0,0,0,.12);
}
body.light-mode .ht-nav__link { color: #444; }
body.light-mode .ht-nav__link:hover { color: #111; background: rgba(0,0,0,.05); }
body.light-mode .ht-search-btn,
body.light-mode .ht-theme-toggle,
body.light-mode .ht-mobile-toggle {
  background: rgba(0,0,0,.06);
  color: #555;
}
body.light-mode .ht-dropdown {
  background: rgba(245,245,245,.98);
  border-color: rgba(0,0,0,.1);
}
body.light-mode .ht-prehead {
  background: #E8E8E8;
  border-bottom-color: rgba(0,0,0,.1);
}

/* ═══ SERVICE CARD — keep natural ratio ═══ */
.ht-service-card__img { aspect-ratio: 16/9; }

/* ═══ TESTIMONIAL — AUTHOR FIRST ═══ */
.ht-testimonial-card {
  display: flex;
  flex-direction: column;
}
.ht-testimonial-card__author { order: -1; margin-bottom: 16px; }
.ht-testimonial-card__stars  { order: 0; margin-bottom: 10px; }
.ht-testimonial-card__text   { order: 1; margin-bottom: 0; }

/* ═══ HEADER REDESIGN — More polished ═══ */
.ht-header {
  box-shadow: 0 1px 0 rgba(255,255,255,.04);
}
.ht-nav__link {
  position: relative;
}
.ht-nav__link::after {
  content: '';
  position: absolute;
  bottom: 4px;
  right: 14px;
  left: 14px;
  height: 2px;
  background: var(--red-lite);
  border-radius: 2px;
  transform: scaleX(0);
  transition: transform .2s ease;
}
.ht-nav__link:hover::after,
.ht-nav__link--active::after {
  transform: scaleX(1);
}
.ht-nav__link--active {
  color: var(--text) !important;
}
.ht-logo img {
  transition: opacity .2s;
}
.ht-logo:hover img { opacity: .85; }

/* CTA button in nav */
.ht-nav__cta {
  background: var(--red);
  color: #fff !important;
  border-radius: var(--r-full);
  padding: 8px 18px !important;
  font-weight: 700;
}
.ht-nav__cta:hover { background: var(--red-lite); }
.ht-nav__cta::after { display: none; }

/* ═══ SEARCH MODAL — Beautiful ═══ */
.ht-search-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.75);
  backdrop-filter: blur(8px);
  z-index: 1000;
  align-items: flex-start;
  justify-content: center;
  padding-top: 15vh;
}
.ht-search-overlay.open { display: flex; }

.ht-search-modal {
  width: 100%;
  max-width: 680px;
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: 0 32px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(176,25,32,.15);
  animation: searchModalIn .25s cubic-bezier(.22,1,.36,1);
}
@keyframes searchModalIn {
  from { opacity:0; transform:translateY(-20px) scale(.97); }
  to   { opacity:1; transform:translateY(0) scale(1); }
}
.ht-search-modal__header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
}
.ht-search-modal__icon { font-size: 1.1rem; opacity: .6; }
.ht-search-modal__title {
  font-size: .82rem;
  font-weight: 600;
  color: var(--text3);
  flex: 1;
}
.ht-search-modal__close {
  width: 32px; height: 32px;
  border-radius: var(--r-md);
  background: var(--card);
  color: var(--text3);
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--trans);
  cursor: pointer;
}
.ht-search-modal__close:hover { background: var(--red-glow); color: var(--red-lite); }

.ht-search-form { padding: 16px; }
.ht-search-input-wrap {
  display: flex;
  gap: 8px;
  background: var(--bg3);
  border: 1.5px solid var(--border);
  border-radius: var(--r-lg);
  padding: 4px 4px 4px 12px;
  transition: border-color .2s;
}
.ht-search-input-wrap:focus-within {
  border-color: var(--red);
  box-shadow: 0 0 0 3px rgba(176,25,32,.12);
}
.ht-search-input {
  flex: 1;
  background: none;
  border: none;
  outline: none;
  font-size: 1rem;
  color: var(--text);
  font-family: var(--font);
  padding: 10px 0;
  min-width: 0;
}
.ht-search-input::placeholder { color: var(--text3); }
.ht-search-submit {
  background: var(--red);
  color: #fff;
  border: none;
  border-radius: var(--r-md);
  padding: 10px 20px;
  font-family: var(--font);
  font-size: .85rem;
  font-weight: 700;
  cursor: pointer;
  transition: var(--trans);
  white-space: nowrap;
}
.ht-search-submit:hover { background: var(--red-lite); }

.ht-search-quick { padding: 0 16px 16px; }
.ht-search-quick__label {
  font-size: .72rem;
  color: var(--text3);
  margin-bottom: 10px;
  font-weight: 600;
}
.ht-search-quick__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.ht-search-quick__tag {
  font-size: .75rem;
  padding: 5px 12px;
  border-radius: var(--r-full);
  background: var(--card);
  border: 1px solid var(--border);
  color: var(--text2);
  transition: var(--trans);
}
.ht-search-quick__tag:hover {
  background: var(--red-glow);
  border-color: rgba(176,25,32,.3);
  color: var(--red-lite);
}

/* Light mode search */
body.light-mode .ht-search-modal {
  background: #fff;
  border-color: rgba(0,0,0,.1);
}
body.light-mode .ht-search-input-wrap { background: #f5f5f5; }
body.light-mode .ht-search-input { color: #111; }
body.light-mode .ht-search-quick__tag { background: #f0f0f0; border-color: #ddd; color: #555; }

/* ═══ SVG ICONS ═══ */
.ht-icon {
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}
.ht-icon--sm { width: 16px; height: 16px; }
.ht-icon--lg { width: 28px; height: 28px; }
.ht-icon--xl { width: 40px; height: 40px; }

/* Theme toggle: show correct icon */
.ht-icon--moon { display: none; }
body.light-mode .ht-icon--sun  { display: none; }
body.light-mode .ht-icon--moon { display: inline-block; }

/* Mobile toggle: show correct icon */
.ht-icon--close { display: none; }
body.menu-open .ht-icon--menu  { display: none; }
body.menu-open .ht-icon--close { display: inline-block; }

/* ═══ PAGE HERO ═══ */
.ht-page-hero {
  background: var(--bg2);
  border-bottom: 1px solid var(--border);
  padding: 48px 0 52px;
  position: relative;
  overflow: hidden;
}
.ht-page-hero::before {
  content: '';
  position: absolute;
  top: -40%;
  left: -10%;
  width: 500px; height: 500px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(176,25,32,.08) 0%, transparent 70%);
  pointer-events: none;
}

/* ═══ FORM ELEMENTS ═══ */
.ht-form-group { display: flex; flex-direction: column; gap: 6px; }
.ht-form-label { font-size: .82rem; font-weight: 600; color: var(--text2); }
.ht-form-input {
  background: var(--bg3);
  border: 1.5px solid var(--border);
  border-radius: var(--r-md);
  padding: 11px 14px;
  color: var(--text);
  font-family: var(--font);
  font-size: .88rem;
  transition: border-color .2s, box-shadow .2s;
  width: 100%;
}
.ht-form-input:focus {
  outline: none;
  border-color: var(--red);
  box-shadow: 0 0 0 3px rgba(176,25,32,.1);
}
.ht-form-input::placeholder { color: var(--text3); }
textarea.ht-form-input { resize: vertical; min-height: 80px; }
select.ht-form-input { cursor: pointer; }

.ht-file-label {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 14px;
  background: var(--bg3);
  border: 1.5px dashed var(--border);
  border-radius: var(--r-md);
  cursor: pointer;
  font-size: .85rem;
  color: var(--text3);
  transition: var(--trans);
}
.ht-file-label:hover {
  border-color: var(--red);
  color: var(--text2);
}
.ht-form-msg {
  padding: 12px 16px;
  border-radius: var(--r-md);
  font-size: .85rem;
  font-weight: 600;
}
.ht-form-msg.success { background: rgba(34,197,94,.1); color: #22c55e; border: 1px solid rgba(34,197,94,.2); }
.ht-form-msg.error   { background: rgba(239,68,68,.1);  color: #ef4444;  border: 1px solid rgba(239,68,68,.2); }

/* ═══ CONTACT INFO ═══ */
.ht-contact-info-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--border);
  color: var(--text);
  text-decoration: none;
  transition: var(--trans);
}
.ht-contact-info-row:hover { color: var(--red-lite); }
.ht-contact-info-icon {
  width: 34px; height: 34px;
  border-radius: var(--r-md);
  background: var(--red-glow);
  color: var(--red-lite);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.ht-contact-info-label { font-size: .72rem; color: var(--text3); margin-bottom: 2px; }
.ht-contact-info-val   { font-size: .88rem; font-weight: 600; }

/* ═══ SERVICE ROW ═══ */
.ht-service-row { transition: var(--trans); }
.ht-service-row:hover { border-color: var(--border-r) !important; }
@media(max-width:768px) {
  .ht-service-row { grid-template-columns: 1fr !important; }
  .ht-service-row > div[style*="order:1"] { order: 1 !important; }
  .ht-service-row > div[style*="order:2"] { order: 2 !important; }
}

/* ═══ PRODUCT TABS ═══ */
.ht-product-tabs {
  display: flex;
  gap: 4px;
  border-bottom: 2px solid var(--border);
  margin-bottom: 28px;
}
.ht-tab-btn {
  padding: 10px 22px;
  font-family: var(--font);
  font-size: .88rem;
  font-weight: 600;
  color: var(--text3);
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  cursor: pointer;
  transition: var(--trans);
}
.ht-tab-btn:hover { color: var(--text); }
.ht-tab-btn.active { color: var(--red-lite); border-bottom-color: var(--red-lite); }
.ht-tab-content { display: none; }
.ht-tab-content.active { display: block; }

/* ═══ MARQUEE FIX ═══ */
.ht-marquee__item {
  flex-direction: column;
  gap: 8px;
  width: 160px;
  height: auto;
  min-height: 100px;
  padding: 16px 12px;
}
.ht-marquee__item img {
  max-height: 52px;
  max-width: 120px;
}
.ht-marquee__name {
  font-size: .72rem;
  color: var(--text3);
  text-align: center;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 130px;
}

/* ═══ SERVICE CARD ICON REMOVED ═══ */
.ht-service-card__icon { display: none; }

/* ═══ SCREENSHOT PLACEHOLDER ═══ */
</style>

/* ═══ MARQUEE V2 FIX ═══ */
.ht-marquee__item {
  flex-shrink: 0;
  width: 180px !important;
  min-height: 110px !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 14px;
}
.ht-marquee__item img {
  max-height: 56px;
  max-width: 140px;
  object-fit: contain;
  width: auto;
}
.ht-marquee__name {
  font-size: .74rem;
  color: var(--text2);
  text-align: center;
  font-weight: 600;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  max-width: 155px;
  line-height: 1.4;
  word-break: keep-all;
}

/* ═══ TESTIMONIAL CARD - no stars ═══ */
.ht-testimonial-card__stars { display: none; }

/* ═══ LICENSE CARDS ═══ */
.ht-license-card {
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  overflow: hidden;
  transition: var(--trans);
}
.ht-license-card:hover {
  border-color: var(--border-r);
  transform: translateY(-4px);
  box-shadow: var(--shadow-r);
}
.ht-license-card:hover .ht-lic-img {
  transform: scale(1.03);
}
@media (max-width: 768px) {
  #ht-licenses-grid { grid-template-columns: repeat(2,1fr) !important; }
}
@media (max-width: 480px) {
  #ht-licenses-grid { grid-template-columns: 1fr !important; }
}

/* ═══════════════════════════════════
   MARQUEE — Pure CSS infinite loop
   Works by translating -50% (one set width)
   since track = 2 identical sets side by side
═══════════════════════════════════ */
.ht-marquee-wrap {
  overflow: hidden;
  position: relative;
  padding: 8px 0;
  /* Fade edges */
  -webkit-mask: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
  mask: linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
}
.ht-marquee {
  display: flex;
  /* CRITICAL: force LTR so flex items go left→right regardless of page dir */
  direction: ltr;
  /* width must be auto to grow with content */
  width: max-content;
  will-change: transform;
  animation: ht-marquee-scroll 35s linear infinite;
}
.ht-marquee:hover { animation-play-state: paused; }
.ht-marquee__set {
  display: flex;
  flex-direction: row;
  flex-shrink: 0;
  /* direction must also be LTR inside set */
  direction: ltr;
}
/* 
 * translateX(-50%) moves exactly one set width 
 * because track = Set1 + Set2 (identical), total = 2x set width
 * so -50% of total = -1x set width = seamless reset point
 */
@keyframes ht-marquee-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.ht-marquee__item {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 170px;
  min-height: 110px;
  padding: 16px 12px;
  margin: 0 8px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  transition: border-color .2s;
}
.ht-marquee__item:hover { border-color: var(--border-r); }
.ht-marquee__item img {
  max-height: 54px;
  max-width: 130px;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(1) brightness(1.4);
  transition: filter .3s;
}
.ht-marquee__item:hover img { filter: none; }
.ht-marquee__name {
  font-size: .72rem;
  color: var(--text2);
  font-weight: 600;
  text-align: center;
  line-height: 1.4;
  white-space: normal;
  word-break: keep-all;
  max-width: 145px;
}

@media (max-width: 600px) {
  .ht-marquee__item { width: 130px; min-height: 90px; }
  .ht-marquee__item img { max-height: 40px; }
  .ht-marquee { animation-duration: 20s; }
}

/* ═══ MARQUEE v3 — JS-driven ═══ */
.ht-marquee-wrap {
  overflow: hidden;
  position: relative;
  padding: 4px 0;
  -webkit-mask: linear-gradient(to right, transparent 0%, black 6%, black 94%, transparent 100%);
  mask: linear-gradient(to right, transparent 0%, black 6%, black 94%, transparent 100%);
}
#ht-clients-marquee {
  display: flex;
  direction: ltr;
  will-change: transform;
  /* No CSS animation - pure JS RAF */
}
#ht-clients-marquee:hover .ht-marquee__item { border-color: var(--border); }
.ht-marquee__item {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 160px;
  min-height: 110px;
  padding: 16px 12px;
  margin: 0 8px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
}
.ht-marquee__item img {
  max-height: 52px;
  max-width: 120px;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(1) brightness(1.4);
  transition: filter .25s;
}
.ht-marquee__item:hover img { filter: none; }
.ht-marquee__name {
  font-size: .72rem;
  color: var(--text2);
  font-weight: 600;
  text-align: center;
  line-height: 1.4;
  white-space: normal;
  word-break: keep-all;
  max-width: 136px;
}

/* ═══ CAREERS ARCHIVE LAYOUT ═══ */
.ht-career-layout {
  display: grid;
  /* Benefits sidebar = 320px, main content = rest */
  grid-template-columns: 320px 1fr;
  gap: 40px;
  align-items: start;
}
/* Benefits is second in HTML but first visually */
.ht-career-layout > div:last-child  { order: 1; }
.ht-career-layout > div:first-child { order: 2; }
@media (max-width: 960px) {
  .ht-career-layout {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .ht-career-layout > div:last-child  { order: 1; position:static!important; }
  .ht-career-layout > div:first-child { order: 2; }
}

/* ═══ CAREER SINGLE — Mobile ═══ */
@media (max-width: 600px) {
  .ht-career-content .ht-container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  /* Top header box */
  .career-pg > div:first-child .ht-container > div:first-child {
    flex-wrap: wrap;
    gap: 12px;
  }
  .career-pg > div:first-child h1 {
    font-size: 1.1rem !important;
    text-align: center;
  }
  /* Meta boxes - stack on mobile */
  .career-pg > div:nth-child(2) .ht-container > div {
    flex-direction: column;
  }
  .career-pg > div:nth-child(2) .ht-container > div > div {
    border: none !important;
    border-bottom: 1px solid var(--border) !important;
    padding: 12px 16px !important;
  }
}

/* careers sidebar-first handled in layout CSS above */

/* ═══ CAREER INACTIVE STYLING ═══ */
.career-inactive .career-pg > div:first-child {
  opacity: 0.6;
  filter: grayscale(0.7);
}
/* Inactive badge in single */
.ht-career-inactive-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--bg3);
  color: var(--text3);
  border: 1px solid var(--border);
  padding: 4px 12px;
  border-radius: var(--r-full);
  font-size: .75rem;
  font-weight: 600;
  margin-top: 8px;
}