/* ─── HOME PAGE STYLES ─── */

/* Hero */
.hero { padding: clamp(160px, 22vh, 240px) 0 clamp(80px, 10vh, 120px); }
.hero__eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 0.78rem; font-weight: 600; letter-spacing: 0.07em; text-transform: uppercase;
    color: var(--accent); margin-bottom: 24px;
    opacity: 0; animation: fadeUp 0.8s 0.2s forwards;
}
.hero__eyebrow::before { content: ''; width: 28px; height: 2px; background: var(--accent); border-radius: 1px; }
.hero__title {
    font-family: var(--font-display); font-size: clamp(2.6rem, 5.5vw, 4.6rem);
    line-height: 1.08; font-weight: 400; margin-bottom: 24px; max-width: 780px;
    opacity: 0; animation: fadeUp 0.8s 0.35s forwards;
}
.hero__title em { font-style: italic; color: var(--accent); text-shadow: 0 0 60px var(--accent-glow), 0 0 120px rgba(122,216,255,0.1); }
.hero__subtitle {
    font-size: clamp(1rem, 1.4vw, 1.15rem); color: var(--ink-muted); max-width: 540px;
    line-height: 1.7; margin-bottom: 36px; opacity: 0; animation: fadeUp 0.8s 0.5s forwards;
}
.hero__actions { display: flex; gap: 14px; flex-wrap: wrap; opacity: 0; animation: fadeUp 0.8s 0.65s forwards; }
.hero__metrics {
    display: flex; gap: 48px; margin-top: 56px; padding-top: 36px;
    border-top: 1px solid var(--border); opacity: 0; animation: fadeUp 0.8s 0.8s forwards;
}
.hero__metric-value { font-family: var(--font-display); font-size: 2.4rem; line-height: 1; color: var(--accent); }
.hero__metric-label { font-size: 0.83rem; color: var(--ink-muted); margin-top: 5px; font-weight: 500; }

/* Industries */
.industries { padding: 48px 0; border-top: 1px solid var(--border-light); }
.industries__label { text-align: center; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 28px; }
.industries__list { display: flex; align-items: center; justify-content: center; gap: clamp(24px, 4vw, 56px); flex-wrap: wrap; }
.industries__item { font-family: var(--font-display); font-size: 1.2rem; color: var(--ink-muted); opacity: 0.8; white-space: nowrap; font-style: italic; transition: opacity 0.3s; }
.industries__item:hover { opacity: 0.9; }

/* Value grid */
.value-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 56px; }
.value-card__num { font-family: var(--font-display); font-size: 3.5rem; line-height: 1; color: rgba(255,255,255,0.09); position: absolute; top: 16px; right: 24px; }
.value-card__title { font-family: var(--font-display); font-size: 1.35rem; line-height: 1.25; margin-bottom: 10px; }
.value-card__text { color: var(--ink-muted); line-height: 1.7; font-size: 0.93rem; }
.card { position: relative; overflow: hidden; }

/* Services */
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 48px; }
.service-card {
    display: block; padding: 32px 24px; border-radius: var(--radius);
    background: var(--card-bg); border: 1px solid var(--card-border);
    transition: all 0.35s cubic-bezier(0.16,1,0.3,1);
    text-decoration: none; color: var(--ink); backdrop-filter: blur(12px);
}
.service-card:hover { transform: translateY(-5px); box-shadow: 0 12px 40px rgba(122,216,255,0.08); border-color: rgba(122,216,255,0.2); color: var(--ink); }
.service-card__icon { width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.3rem; margin-bottom: 18px; background: var(--accent-soft); }
.service-card__title { font-weight: 700; font-size: 1rem; margin-bottom: 8px; }
.service-card__text { font-size: 0.87rem; color: var(--ink-muted); line-height: 1.6; margin-bottom: 14px; }
.service-card__tags { display: flex; gap: 5px; flex-wrap: wrap; }
.service-card__tag { font-size: 0.7rem; font-weight: 600; padding: 3px 9px; border-radius: 100px; background: var(--accent-soft); color: var(--accent); }

/* Cases */
.cases-list { margin-top: 48px; display: flex; flex-direction: column; gap: 20px; }
.case {
    display: grid; grid-template-columns: 1fr 1.1fr; border-radius: 20px; overflow: hidden;
    background: var(--card-bg); border: 1px solid var(--card-border);
    transition: all 0.4s cubic-bezier(0.16,1,0.3,1);
    text-decoration: none; color: var(--ink);
}
.case:hover { transform: translateY(-4px); box-shadow: 0 20px 60px rgba(122,216,255,0.06); color: var(--ink); }
.case__visual { padding: 44px 36px; display: flex; flex-direction: column; justify-content: center; }
.case__visual-label { font-size: 0.68rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255,255,255,0.55); margin-bottom: 14px; }
.case__visual-name { font-family: var(--font-display); font-size: 2rem; color: white; line-height: 1.15; margin-bottom: 18px; }
.case__visual-metrics { display: flex; gap: 22px; flex-wrap: wrap; }
.case__metric { color: rgba(255,255,255,0.9); }
.case__metric-val { font-size: 1.3rem; font-weight: 700; display: block; line-height: 1.2; }
.case__metric-lbl { font-size: 0.72rem; opacity: 0.65; }
.case__info { padding: 40px 36px; }
.case__desc { font-size: 0.92rem; color: var(--ink-muted); line-height: 1.7; margin-top: 14px; margin-bottom: 20px; }
.case__tech { display: flex; gap: 5px; flex-wrap: wrap; }
.case__tech-tag { font-size: 0.7rem; font-weight: 600; padding: 4px 10px; border-radius: 100px; background: var(--surface-warm); color: var(--ink-muted); }

/* Process */
.process-steps { display: grid; grid-template-columns: repeat(4,1fr); gap: 2px; margin-top: 48px; border-radius: 20px; overflow: hidden; }
.process-step { background: var(--card-bg); padding: 36px 24px; position: relative; backdrop-filter: blur(12px); }
.process-step::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--accent), var(--accent2)); opacity: 0; transition: opacity 0.3s; }
.process-step:hover::before { opacity: 1; }
.process-step__num { font-family: var(--font-display); font-size: 2.2rem; color: rgba(255,255,255,0.2); margin-bottom: 14px; }
.process-step__title { font-weight: 700; font-size: 0.95rem; margin-bottom: 5px; }
.process-step__time { font-size: 0.78rem; color: var(--accent); font-weight: 600; margin-bottom: 12px; }
.process-step__list { list-style: none; display: flex; flex-direction: column; gap: 7px; }
.process-step__list li { font-size: 0.83rem; color: var(--ink-muted); padding-left: 16px; position: relative; }
.process-step__list li::before { content: ''; position: absolute; left: 0; top: 7px; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); }

/* FAQ */
.faq-list { margin-top: 40px; display: flex; flex-direction: column; gap: 12px; }
.faq-item {
    background: var(--card-bg); border: 1px solid var(--card-border); border-radius: var(--radius);
    backdrop-filter: blur(12px); overflow: hidden;
}
.faq-q {
    padding: 20px 24px; cursor: pointer; font-weight: 600; font-size: 0.95rem;
    list-style: none; display: flex; justify-content: space-between; align-items: center;
    transition: color 0.2s;
}
.faq-q:hover { color: var(--accent); }
.faq-q::-webkit-details-marker { display: none; }
.faq-q::after { content: '+'; font-size: 1.3rem; color: var(--accent); font-weight: 300; transition: transform 0.3s; }
.faq-item[open] .faq-q::after { transform: rotate(45deg); }
.faq-a { padding: 0 24px 20px; color: var(--ink-muted); line-height: 1.7; font-size: 0.92rem; }

/* Responsive */
@media (max-width: 1024px) {
    .value-grid { grid-template-columns: 1fr; gap: 16px; }
    .services-grid { grid-template-columns: 1fr 1fr; }
    .process-steps { grid-template-columns: 1fr 1fr; }
    .case { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
    .hero__metrics { flex-direction: column; gap: 20px; }
    .services-grid { grid-template-columns: 1fr; }
    .process-steps { grid-template-columns: 1fr; }
    .case__visual { padding: 32px 24px; }
    .case__info { padding: 28px 24px; }
}
@media (max-width: 480px) {
    .hero__title { font-size: 2.1rem; }
    .hero__actions { flex-direction: column; }
}
