/* ==========================================================================
   JAIPUR DIGITAL — ABOUT US PAGE
   Typography, spacing and visual hierarchy IDENTICAL to Home Page.
   Uses the same design tokens, scales and conventions as homepage.css
   + typography-refinement.css. No second system — one design language.
   ========================================================================== */

/* ── CONTAINER — Exact same as .hd-container (site-wide standard) ── */
.abt-container {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: var(--hd-space-4);
    padding-left: var(--hd-space-4);
}

@media (min-width: 576px) {
    .abt-container { max-width: 540px; }
}
@media (min-width: 768px) {
    .abt-container { max-width: 720px; padding-right: var(--hd-space-6); padding-left: var(--hd-space-6); }
}
@media (min-width: 1024px) {
    .abt-container { max-width: 960px; }
}
@media (min-width: 1280px) {
    .abt-container { max-width: 1200px; padding-right: var(--hd-space-8); padding-left: var(--hd-space-8); }
}
@media (min-width: 1536px) {
    .abt-container { max-width: 1400px; }
}

/* ==========================================================================
   HERO SECTION
   ========================================================================== */
.abt-hero-section {
    position: relative;
    padding: 64px 0 56px;          /* matches .hp-hero refined padding */
    background: var(--hd-color-bg-primary);
    border-bottom: 1px solid var(--hd-color-surface-border);
}

.abt-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;                     /* matches .hp-hero-inner desktop gap */
    align-items: center;
    min-height: 440px;
}

@media (max-width: 991px) {
    .abt-hero-grid {
        grid-template-columns: 1fr;
        gap: 36px;
        min-height: auto;
    }
}

/* Breadcrumb — same scale as site-wide nav text */
.abt-breadcrumb { margin-bottom: 16px; }

.abt-breadcrumb-list {
    display: flex;
    align-items: center;
    gap: 6px;
    list-style: none;
    padding: 0;
    margin: 0;
    flex-wrap: wrap;
}

.abt-breadcrumb-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;            /* matches .hp-hero-eyebrow scale */
    font-weight: 500;
    color: var(--hd-color-text-muted);
}

.abt-breadcrumb-link {
    color: var(--hd-color-text-muted);
    text-decoration: none;
    transition: color 0.15s ease;
}

.abt-breadcrumb-link:hover { color: var(--hd-color-brand-primary); }

.abt-breadcrumb-sep {
    color: var(--hd-color-text-muted);
    font-size: 0.75rem;
}

.abt-breadcrumb-current {
    color: var(--hd-color-text-primary);
    font-weight: 600;
}

/* Eyebrow / Badge — exact match to .hp-hero-eyebrow (refined) */
.abt-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(37, 99, 235, 0.08);
    border: 1px solid rgba(37, 99, 235, 0.2);
    border-radius: 9999px;
    padding: 5px 12px;             /* matches refined .hp-hero-eyebrow */
    font-size: 0.6875rem;          /* 11px — matches .hp-hero-eyebrow */
    font-weight: 700;
    color: var(--hd-color-brand-primary);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.abt-badge-pulse {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #059669;
    animation: abtPulse 2s infinite;
}

@keyframes abtPulse {
    0%   { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(5, 150, 105, 0.7); }
    70%  { transform: scale(1);    box-shadow: 0 0 0 6px rgba(5, 150, 105, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(5, 150, 105, 0); }
}

/* Hero Title — exact match to .hp-hero-title (refined) */
.abt-hero-title {
    font-size: clamp(2rem, 3.5vw + 0.75rem, 3.25rem); /* identical to .hp-hero-title */
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -0.025em;
    color: var(--hd-color-text-primary);
    margin-bottom: 18px;
}

/* Hero Description — exact match to .hp-hero-desc (refined) */
.abt-hero-desc {
    font-size: clamp(0.9375rem, 0.5vw + 0.875rem, 1.0625rem); /* matches .hp-hero-desc */
    line-height: 1.7;
    color: var(--hd-color-text-secondary);
    margin-bottom: 28px;
    max-width: 560px;
}

/* Hero Action Buttons — exact same as Home Page CTA buttons (refined) */
.abt-hero-actions {
    display: flex;
    align-items: center;
    gap: 12px;                     /* matches refined .hp-hero-actions gap */
    flex-wrap: wrap;
    margin-bottom: 28px;
}

.abt-btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 22px;            /* matches refined .hp-cta-btn-primary */
    background: var(--hd-color-brand-primary);
    color: #ffffff;
    border-radius: 10px;           /* matches refined border-radius */
    font-size: 0.875rem;           /* 14px — matches .hp-cta-btn-primary refined */
    font-weight: 700;
    text-decoration: none;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.3);
    transition: all 0.2s ease;
}

.abt-btn-primary:hover {
    background: var(--hd-color-brand-primary-hover);
    box-shadow: 0 8px 24px rgba(37, 99, 235, 0.4);
    transform: translateY(-2px);
}

.abt-btn-secondary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 20px;            /* matches refined .hp-cta-btn-ghost */
    background: var(--hd-color-bg-tertiary);
    border: 1px solid var(--hd-color-surface-border);
    color: var(--hd-color-text-primary);
    border-radius: 10px;
    font-size: 0.875rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
}

.abt-btn-secondary:hover {
    border-color: var(--hd-color-brand-primary);
    color: var(--hd-color-brand-primary);
    background: rgba(37, 99, 235, 0.04);
    transform: translateY(-1px);
}

/* Hero Highlights Row */
.abt-hero-highlights {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    padding-top: 16px;
    border-top: 1px solid var(--hd-color-surface-border);
}

.abt-highlight-tag {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;            /* matches .hp-hero-badge-pill */
    font-weight: 600;
    color: var(--hd-color-text-muted);
}

/* Right Column Visual Card */
.abt-hero-visual-card {
    background: var(--hd-color-bg-secondary);   /* matches .hp-hero-visual-card */
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 18px;           /* matches refined .hp-hero-visual-card */
    overflow: hidden;
    box-shadow: 0 20px 48px -12px rgba(15, 23, 42, 0.15);
}

.abt-visual-header {
    height: 40px;
    padding: 0 16px;
    background: var(--hd-color-bg-primary);
    border-bottom: 1px solid var(--hd-color-surface-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.abt-visual-dots { display: flex; gap: 6px; }

.abt-visual-dots span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.abt-visual-dots span:nth-child(1) { background: #ef4444; }
.abt-visual-dots span:nth-child(2) { background: #f59e0b; }
.abt-visual-dots span:nth-child(3) { background: #10b981; }

.abt-visual-title {
    font-size: 0.6rem;             /* matches .hp-hero-metric-label scale */
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--hd-color-text-muted);
}

.abt-visual-body {
    padding: 20px;                 /* matches refined .hp-hero-visual-card */
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.abt-visual-stat-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;                     /* matches .hp-hero-metric-row */
}

.abt-vstat-box {
    background: var(--hd-color-bg-tertiary);  /* matches .hp-hero-metric-box */
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 10px;           /* matches refined .hp-hero-metric-box */
    padding: 10px 12px;            /* matches refined padding */
    text-align: center;
}

.abt-vstat-num {
    font-size: 1rem;               /* matches .hp-hero-metric-value refined */
    font-weight: 800;
    color: var(--hd-color-brand-primary);
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.abt-vstat-lbl {
    font-size: 0.575rem;           /* matches .hp-hero-metric-label refined */
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--hd-color-text-muted);
    margin-top: 2px;
}

.abt-visual-stack-box {
    background: var(--hd-color-bg-tertiary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 12px;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.abt-vstack-title {
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--hd-color-text-muted);
    margin-bottom: 2px;
}

.abt-vstack-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.8rem;             /* matches .hp-sol-item-name scale */
    font-weight: 600;
    color: var(--hd-color-text-primary);
}

.abt-dot-green {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #10b981;
    display: inline-block;
    margin-right: 8px;
    flex-shrink: 0;
}

.abt-val {
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: var(--hd-color-brand-primary);
}

.abt-visual-footer {
    padding-top: 10px;
    border-top: 1px solid var(--hd-color-surface-border);
    font-size: 0.6875rem;
    color: var(--hd-color-text-muted);
    text-align: center;
}

/* ==========================================================================
   SHARED SECTION PATTERNS
   Eyebrow, title and desc IDENTICAL to hp-section-eyebrow / hp-section-title
   ========================================================================== */

/* Eyebrow — identical to .hp-section-eyebrow (refined) */
.abt-section-sub {
    display: inline-flex;
    align-items: center;
    background: rgba(37, 99, 235, 0.07);
    border: 1px solid rgba(37, 99, 235, 0.15);
    border-radius: 9999px;
    padding: 4px 12px;
    font-size: 0.6875rem;          /* matches .hp-section-eyebrow refined */
    font-weight: 800;
    color: var(--hd-color-brand-primary);
    letter-spacing: 0.07em;
    text-transform: uppercase;
    margin-bottom: 12px;
}

/* Section Title — identical to .hp-section-title (refined) */
.abt-section-title {
    font-size: clamp(1.375rem, 1.75vw + 0.75rem, 2.125rem); /* matches exactly */
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--hd-color-text-primary);
    line-height: 1.2;
    margin-bottom: 12px;
}

/* Section Description — identical to .hp-section-desc (refined) */
.abt-section-desc {
    font-size: clamp(0.875rem, 0.25vw + 0.8rem, 1rem);  /* matches .hp-section-desc */
    line-height: 1.7;
    color: var(--hd-color-text-secondary);
}

/* Centered header block — mirrors homepage section headers */
.abt-center-header {
    text-align: center;
    max-width: 640px;
    margin: 0 auto 48px auto;
}

/* ==========================================================================
   SECTION SPACING — Matches homepage refined 72px padding
   ========================================================================== */

.abt-overview-section,
.abt-mv-section,
.abt-values-section,
.abt-timeline-section,
.abt-leadership-section,
.abt-why-section,
.abt-tech-section,
.abt-cert-section,
.abt-presence-section,
.abt-faq-section,
.abt-cta-section {
    padding: 72px 0;               /* matches refined --hp-section-pad-y */
}

.abt-stats-section {
    padding: 64px 0;               /* matches refined .hp-stats padding */
}

/* Alternating bg — same pattern as homepage sections */
.abt-hero-section,
.abt-mv-section,
.abt-why-section,
.abt-presence-section,
.abt-cta-section {
    background: var(--hd-color-bg-primary);
}

.abt-overview-section,
.abt-values-section,
.abt-leadership-section,
.abt-tech-section,
.abt-faq-section {
    background: var(--hd-color-bg-secondary);
}

.abt-timeline-section,
.abt-stats-section,
.abt-cert-section {
    background: var(--hd-color-bg-primary);
}

@media (max-width: 991px) {
    .abt-overview-section,
    .abt-mv-section,
    .abt-values-section,
    .abt-timeline-section,
    .abt-leadership-section,
    .abt-why-section,
    .abt-tech-section,
    .abt-cert-section,
    .abt-presence-section,
    .abt-faq-section,
    .abt-cta-section { padding: 56px 0; }

    .abt-stats-section { padding: 48px 0; }
}

@media (max-width: 576px) {
    .abt-overview-section,
    .abt-mv-section,
    .abt-values-section,
    .abt-timeline-section,
    .abt-leadership-section,
    .abt-why-section,
    .abt-tech-section,
    .abt-cert-section,
    .abt-presence-section,
    .abt-faq-section,
    .abt-cta-section { padding: 40px 0; }

    .abt-stats-section { padding: 36px 0; }
}

/* ==========================================================================
   COMPANY OVERVIEW — 2-Column layout
   ========================================================================== */
.abt-overview-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
}

@media (max-width: 991px) {
    .abt-overview-grid { grid-template-columns: 1fr; gap: 32px; }
}

/* Overview card — matches .hp-cap-card style */
.abt-overview-card {
    background: var(--hd-color-bg-primary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 16px;           /* matches .hp-cap-card refined */
    padding: 26px;                 /* matches .hp-cap-card refined */
}

/* Card internal labels */
.abt-card-header-badge {
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--hd-color-brand-primary);
    margin-bottom: 8px;
}

/* Card title — matches .hp-cap-title scale */
.abt-card-title {
    font-size: 0.9375rem;          /* matches .hp-cap-title refined */
    font-weight: 700;
    color: var(--hd-color-text-primary);
    margin-bottom: 6px;
    letter-spacing: -0.01em;
}

/* Card description — matches .hp-cap-desc scale */
.abt-card-desc {
    font-size: 0.8rem;             /* matches .hp-cap-desc refined */
    line-height: 1.6;
    color: var(--hd-color-text-muted);
    margin-bottom: 20px;
}

.abt-card-metrics-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.abt-metric-box {
    background: var(--hd-color-bg-secondary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 10px;
    padding: 12px;
}

.abt-metric-val {
    font-size: 1.125rem;           /* matches .hp-platform-name scale */
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--hd-color-brand-primary);
}

.abt-metric-lbl {
    font-size: 0.675rem;           /* matches .hp-herostat-label refined */
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--hd-color-text-muted);
    margin-top: 2px;
}

/* Overview story text */
.abt-overview-text-block .abt-section-sub { display: inline-flex; }

.abt-story-paragraphs p {
    font-size: clamp(0.875rem, 0.25vw + 0.8rem, 1rem); /* matches .hp-section-desc */
    line-height: 1.7;
    color: var(--hd-color-text-secondary);
    margin-bottom: 12px;
}

/* Pillars — matches .hp-cap-list item pattern */
.abt-pillars-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 20px;
}

@media (max-width: 576px) { .abt-pillars-grid { grid-template-columns: 1fr; } }

.abt-pillar-item { display: flex; gap: 10px; }

.abt-pillar-icon {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: rgba(37, 99, 235, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.abt-pillar-title {
    font-size: 0.8rem;             /* matches .hp-sol-item-name */
    font-weight: 700;
    color: var(--hd-color-text-primary);
    margin-bottom: 2px;
}

.abt-pillar-desc {
    font-size: 0.775rem;           /* matches .hp-cap-list li refined */
    color: var(--hd-color-text-muted);
    line-height: 1.5;
}

/* ==========================================================================
   MISSION & VISION — 2-column cards
   ========================================================================== */
.abt-mv-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

@media (max-width: 991px) { .abt-mv-grid { grid-template-columns: 1fr; } }

.abt-mv-card {
    background: var(--hd-color-bg-secondary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 16px;
    padding: 28px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.abt-mv-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px -8px rgba(15, 23, 42, 0.1);
}

.abt-mv-card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.abt-mv-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.abt-mv-icon.icon-blue  { background: rgba(37, 99, 235, 0.1); border: 1px solid rgba(37, 99, 235, 0.15); }
.abt-mv-icon.icon-purple { background: rgba(124, 58, 237, 0.1); border: 1px solid rgba(124, 58, 237, 0.15); }

/* Mission/Vision card title — matches .hp-platform-name */
.abt-mv-title {
    font-size: 1.125rem;           /* matches .hp-platform-name refined */
    font-weight: 800;
    color: var(--hd-color-text-primary);
    letter-spacing: -0.01em;
}

/* Mission/Vision description — matches .hp-platform-tagline */
.abt-mv-desc {
    font-size: 0.8125rem;          /* matches .hp-platform-tagline */
    line-height: 1.65;
    color: var(--hd-color-text-secondary);
    margin-bottom: 16px;
}

.abt-mv-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.abt-mv-list li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 0.8125rem;          /* matches .hp-cap-list li scale */
    font-weight: 600;
    color: var(--hd-color-text-primary);
    line-height: 1.5;
}

/* ==========================================================================
   CORE VALUES — Auto grid
   ========================================================================== */
.abt-values-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}

/* Values card — matches .hp-cap-card / .hp-why-card */
.abt-value-card {
    background: var(--hd-color-bg-primary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 16px;
    padding: 22px 20px;            /* matches .hp-why-card refined */
    transition: all 0.2s ease;
}

.abt-value-card:hover {
    border-color: var(--hd-color-surface-border-hover);
    box-shadow: 0 12px 28px -8px rgba(15, 23, 42, 0.1);
    transform: translateY(-3px);
}

.abt-value-icon {
    width: 42px;                   /* matches .hp-why-icon refined */
    height: 42px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
}

.abt-value-icon.icon-blue   { background: rgba(37, 99, 235, 0.1);  color: #2563eb; }
.abt-value-icon.icon-cyan   { background: rgba(8, 145, 178, 0.1);  color: #0891b2; }
.abt-value-icon.icon-purple { background: rgba(124, 58, 237, 0.1); color: #7c3aed; }
.abt-value-icon.icon-green  { background: rgba(5, 150, 105, 0.1);  color: #059669; }
.abt-value-icon.icon-amber  { background: rgba(217, 119, 6, 0.1);  color: #d97706; }

/* Value title — matches .hp-why-title refined */
.abt-value-title {
    font-size: 0.875rem;           /* matches .hp-why-title */
    font-weight: 700;
    color: var(--hd-color-text-primary);
    margin-bottom: 6px;
}

/* Value description — matches .hp-why-desc refined */
.abt-value-desc {
    font-size: 0.775rem;           /* matches .hp-why-desc */
    line-height: 1.6;
    color: var(--hd-color-text-muted);
}

/* ==========================================================================
   COMPANY TIMELINE
   ========================================================================== */
.abt-timeline-container {
    position: relative;
    max-width: 820px;
    margin: 0 auto;
}

.abt-timeline-line {
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 1px;
    background: var(--hd-color-surface-border);
    transform: translateX(-50%);
}

@media (max-width: 768px) { .abt-timeline-line { left: 18px; } }

.abt-timeline-list {
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.abt-timeline-node {
    display: flex;
    position: relative;
    width: 100%;
}

.node-left  { justify-content: flex-start;  padding-right: 52%; }
.node-right { justify-content: flex-end;    padding-left:  52%; }

@media (max-width: 768px) {
    .node-left, .node-right {
        padding-left: 44px;
        padding-right: 0;
        justify-content: flex-start;
    }
}

.abt-timeline-marker {
    position: absolute;
    left: 50%;
    top: 18px;
    transform: translateX(-50%);
    z-index: 3;
}

@media (max-width: 768px) { .abt-timeline-marker { left: 18px; } }

.abt-marker-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--hd-color-brand-primary);
    box-shadow: 0 0 0 3px var(--hd-color-bg-primary), 0 0 0 5px var(--hd-color-brand-primary);
}

.abt-timeline-card {
    background: var(--hd-color-bg-secondary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 14px;
    padding: 18px 20px;
    width: 90%;
}

.abt-timeline-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
}

/* Timeline year — matches .hp-herostat-num scale */
.abt-timeline-year {
    font-size: 1rem;
    font-weight: 900;
    letter-spacing: -0.02em;
    color: var(--hd-color-brand-primary);
}

.abt-timeline-badge {
    font-size: 0.575rem;
    font-weight: 800;
    padding: 2px 7px;
    border-radius: 4px;
    background: rgba(37, 99, 235, 0.1);
    color: var(--hd-color-brand-primary);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* Timeline card title — matches .hp-process-step-title */
.abt-timeline-title {
    font-size: 0.875rem;           /* matches .hp-process-step-title */
    font-weight: 700;
    color: var(--hd-color-text-primary);
    margin-bottom: 4px;
}

/* Timeline description — matches .hp-process-step-desc */
.abt-timeline-desc {
    font-size: 0.775rem;           /* matches .hp-process-step-desc */
    line-height: 1.55;
    color: var(--hd-color-text-muted);
}

/* ==========================================================================
   LEADERSHIP
   ========================================================================== */
.abt-leadership-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

@media (max-width: 1024px) {
    .abt-leadership-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 576px) {
    .abt-leadership-grid { grid-template-columns: 1fr; }
}

/* Team card — matches .hp-cap-card pattern */
.abt-team-card {
    background: var(--hd-color-bg-primary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.2s ease;
}

.abt-team-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 36px -10px rgba(15, 23, 42, 0.12);
}

.abt-team-avatar-box {
    position: relative;
    height: 150px;
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.08) 0%, rgba(124, 58, 237, 0.08) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid var(--hd-color-surface-border);
}

.abt-avatar-placeholder { color: var(--hd-color-brand-primary); }

.abt-team-tag {
    position: absolute;
    bottom: 10px;
    left: 12px;
    font-size: 0.575rem;
    font-weight: 800;
    padding: 2px 7px;
    border-radius: 4px;
    background: rgba(15, 23, 42, 0.65);
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.abt-team-content { padding: 20px; }

/* Team member name — matches .hp-platform-name */
.abt-team-name {
    font-size: 1rem;
    font-weight: 800;
    color: var(--hd-color-text-primary);
    letter-spacing: -0.01em;
}

/* Team role — matches .hp-cap-badge scale */
.abt-team-role {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--hd-color-brand-primary);
    margin-bottom: 8px;
}

/* Team bio — matches .hp-platform-tagline */
.abt-team-bio {
    font-size: 0.8125rem;
    line-height: 1.55;
    color: var(--hd-color-text-muted);
    margin-bottom: 14px;
}

.abt-team-social {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.775rem;
    font-weight: 700;
    color: #0284c7;
    text-decoration: none;
}

/* ==========================================================================
   WHY JAIPUR DIGITAL
   ========================================================================== */
.abt-why-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}

/* Why card — identical to .hp-why-card (refined) */
.abt-why-card {
    background: var(--hd-color-bg-secondary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 16px;
    padding: 22px 18px;            /* matches .hp-why-card refined exactly */
}

.abt-why-icon {
    width: 42px;                   /* matches .hp-why-icon refined */
    height: 42px;
    border-radius: 12px;
    background: rgba(37, 99, 235, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
}

.abt-why-title {
    font-size: 0.875rem;           /* matches .hp-why-title refined */
    font-weight: 700;
    color: var(--hd-color-text-primary);
    margin-bottom: 6px;
}

.abt-why-desc {
    font-size: 0.775rem;           /* matches .hp-why-desc refined */
    line-height: 1.6;
    color: var(--hd-color-text-muted);
}

/* ==========================================================================
   TECHNOLOGY EXPERTISE
   ========================================================================== */
.abt-tech-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px;
}

/* Tech card */
.abt-tech-card {
    background: var(--hd-color-bg-primary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 16px;
    padding: 22px;
}

.abt-tech-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
}

.abt-tech-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
}

.dot-blue   { background: #2563eb; }
.dot-cyan   { background: #0891b2; }
.dot-purple { background: #7c3aed; }
.dot-green  { background: #059669; }
.dot-amber  { background: #d97706; }

/* Tech category label — matches .hp-tech-cat-name refined */
.abt-tech-cat {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--hd-color-text-primary);
    letter-spacing: -0.01em;
}

.abt-tech-items-stack {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* Tech pill — matches .hp-tech-block refined */
.abt-tech-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;             /* matches .hp-tech-block refined */
    border-radius: 8px;
    background: var(--hd-color-bg-secondary);
    border: 1px solid var(--hd-color-surface-border);
    font-size: 0.775rem;           /* matches .hp-tech-block scale */
    font-weight: 600;
    color: var(--hd-color-text-primary);
}

.abt-tech-pill svg { color: var(--hd-color-brand-primary); }

/* ==========================================================================
   STATISTICS — matches .hp-stats section
   ========================================================================== */
.abt-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 16px;
}

.abt-stat-card {
    background: var(--hd-color-bg-secondary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 14px;
    padding: 20px;
    text-align: center;
}

/* Stat value — matches .hp-stats-num refined */
.abt-stat-val {
    font-size: clamp(1.75rem, 2.5vw + 0.5rem, 2.625rem); /* matches .hp-stats-num */
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--hd-color-brand-primary);
    line-height: 1.1;
    margin-bottom: 6px;
}

/* Stat label — matches .hp-stats-label refined */
.abt-stat-lbl {
    font-size: 0.775rem;           /* matches .hp-stats-label */
    font-weight: 600;
    color: var(--hd-color-text-primary);
}

.abt-stat-sub {
    font-size: 0.675rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--hd-color-text-muted);
    margin-top: 2px;
}

/* ==========================================================================
   CERTIFICATIONS
   ========================================================================== */
.abt-cert-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}

.abt-cert-card {
    background: var(--hd-color-bg-secondary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 14px;
    padding: 22px;
}

.abt-cert-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.abt-cert-code {
    font-size: 0.6875rem;
    font-weight: 900;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--hd-color-brand-primary);
}

.abt-cert-badge {
    font-size: 0.575rem;
    font-weight: 800;
    padding: 2px 7px;
    border-radius: 4px;
    background: rgba(5, 150, 105, 0.12);
    color: #059669;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.abt-cert-name {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--hd-color-text-primary);
    margin-bottom: 4px;
}

.abt-cert-desc {
    font-size: 0.775rem;
    line-height: 1.55;
    color: var(--hd-color-text-muted);
}

/* ==========================================================================
   GLOBAL PRESENCE
   ========================================================================== */
.abt-presence-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}

.abt-hub-card {
    background: var(--hd-color-bg-secondary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 16px;
    padding: 22px;
}

.abt-hub-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.abt-hub-icon {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: rgba(37, 99, 235, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
}

.abt-hub-tag {
    font-size: 0.575rem;
    font-weight: 800;
    padding: 2px 7px;
    border-radius: 4px;
    background: rgba(37, 99, 235, 0.1);
    color: var(--hd-color-brand-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.abt-hub-city {
    font-size: 1rem;
    font-weight: 800;
    color: var(--hd-color-text-primary);
    letter-spacing: -0.01em;
}

.abt-hub-role {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--hd-color-brand-primary);
    margin-bottom: 14px;
}

.abt-hub-details {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-top: 12px;
    border-top: 1px solid var(--hd-color-surface-border);
}

.abt-hub-detail-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.8125rem;
    color: var(--hd-color-text-muted);
}

.abt-hub-detail-item svg { color: var(--hd-color-brand-primary); flex-shrink: 0; }

/* ==========================================================================
   FAQ ACCORDION
   ========================================================================== */
.abt-faq-accordion-stack {
    max-width: 760px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.abt-faq-card {
    background: var(--hd-color-bg-primary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 12px;
    overflow: hidden;
}

.abt-faq-trigger {
    width: 100%;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: transparent;
    border: none;
    cursor: pointer;
    text-align: left;
    gap: 12px;
}

/* FAQ Question — matches .hp-sol-item-name scale */
.abt-faq-q-text {
    font-size: 0.9375rem;          /* matches site card titles */
    font-weight: 700;
    color: var(--hd-color-text-primary);
    line-height: 1.35;
}

.abt-faq-chevron {
    color: var(--hd-color-text-muted);
    transition: transform 0.25s ease;
    flex-shrink: 0;
}

.abt-faq-trigger.hd-active .abt-faq-chevron {
    transform: rotate(180deg);
    color: var(--hd-color-brand-primary);
}

.abt-faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.abt-faq-a-inner {
    padding: 0 20px 16px 20px;
    font-size: 0.875rem;           /* matches .hp-section-desc scale */
    line-height: 1.7;
    color: var(--hd-color-text-secondary);
    border-top: 1px solid var(--hd-color-surface-border);
    padding-top: 12px;
}

/* ==========================================================================
   FINAL CTA — Light variant (matches homepage section feel)
   ========================================================================== */
.abt-cta-section {
    position: relative;
    overflow: hidden;
    border-top: 1px solid var(--hd-color-surface-border);
}

.abt-cta-bg-glow {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at center, rgba(37, 99, 235, 0.06) 0%, transparent 70%);
    pointer-events: none;
}

.abt-cta-card {
    position: relative;
    background: var(--hd-color-bg-secondary);
    border: 1px solid var(--hd-color-surface-border);
    border-radius: 20px;
    padding: 44px 36px;
    text-align: center;
    max-width: 820px;
    margin: 0 auto;
}

/* CTA Title — matches .hp-cta-title scale but light theme */
.abt-cta-title {
    font-size: clamp(1.5rem, 2.5vw + 0.75rem, 2.375rem); /* matches section heading */
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: -0.025em;
    color: var(--hd-color-text-primary);
    margin-bottom: 12px;
}

/* CTA Description */
.abt-cta-desc {
    font-size: clamp(0.875rem, 0.25vw + 0.8rem, 1rem);  /* matches .hp-section-desc */
    line-height: 1.7;
    color: var(--hd-color-text-secondary);
    margin-bottom: 28px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.abt-cta-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

/* CTA Primary — identical to .hp-cta-btn-primary refined */
.abt-cta-btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 22px;
    background: var(--hd-color-brand-primary);
    color: #ffffff;
    border-radius: 10px;
    font-size: 0.875rem;
    font-weight: 700;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.3);
    transition: all 0.2s ease;
    text-decoration: none;
}

.abt-cta-btn-primary:hover {
    background: var(--hd-color-brand-primary-hover);
    box-shadow: 0 8px 24px rgba(37, 99, 235, 0.4);
    transform: translateY(-2px);
}

/* CTA Secondary */
.abt-cta-btn-secondary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 20px;
    background: var(--hd-color-bg-primary);
    border: 1px solid var(--hd-color-surface-border);
    color: var(--hd-color-text-primary);
    border-radius: 10px;
    font-size: 0.875rem;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.2s ease;
}

.abt-cta-btn-secondary:hover {
    border-color: var(--hd-color-brand-primary);
    color: var(--hd-color-brand-primary);
    transform: translateY(-1px);
}

/* CTA Guarantee badges */
.abt-cta-guarantees {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--hd-color-text-muted);
    flex-wrap: wrap;
}

.abt-cta-guarantees .sep { color: var(--hd-color-surface-border); }
