/* Shared inner-page styling for the expanded service catalogue and gallery. */
.service-hero,
.service-catalog-wrap,
.gallery-wrap,
.service-section,
.service-gallery-teaser,
.inner-cta {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    margin-top: 15px;
}
.service-hero {
    min-height: 560px;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: flex-end;
    isolation: isolate;
}
.service-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(5, 14, 27, .96) 0%, rgba(8, 20, 37, .82) 46%, rgba(8, 20, 37, .28) 100%);
    z-index: -1;
}
.service-hero::after {
    content: "";
    position: absolute;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    background: rgba(13, 110, 253, .26);
    filter: blur(90px);
    right: -80px;
    top: -100px;
    z-index: -1;
}
.service-hero-content { padding: 80px 64px; max-width: 820px; color: #fff; }
.service-eyebrow,
.catalog-kicker,
.gallery-kicker {
    display: inline-block;
    color: #4f8cff;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 700;
    font-size: 12px;
    margin-bottom: 18px;
}
.service-hero h1 { color: #fff; font-size: clamp(3rem, 6vw, 6.3rem); line-height: .95; letter-spacing: -4px; margin-bottom: 25px; }
.service-hero p { color: #d8e1ed; font-size: 18px; line-height: 1.8; max-width: 720px; }
.service-hero-pills { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.service-hero-pills span { border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.08); color: #fff; padding: 9px 14px; border-radius: 999px; font-size: 13px; backdrop-filter: blur(8px); }
.service-hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.service-state-btn { display:inline-flex; align-items:center; gap:12px; padding:14px 22px; border-radius:999px; font-weight:700; transition:.3s ease; }
.service-state-btn.primary { background:#fff; color:#0f172a; }
.service-state-btn.secondary { border:1px solid rgba(255,255,255,.26); color:#fff; background:rgba(255,255,255,.06); }
.service-state-btn:hover { transform:translateY(-3px); }

.service-section { background:#f5f7fb; padding:90px 60px; }
.service-section h2,
.service-gallery-teaser h2,
.service-catalog-wrap h1,
.gallery-wrap h1 { letter-spacing:-2px; }
.service-section .lead-copy { font-size:18px; line-height:1.8; color:#596579; max-width:760px; }
.service-feature-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:14px; margin-top:45px; }
.service-feature-card { background:#fff; border:1px solid #e7ebf1; border-radius:16px; padding:28px; min-height:170px; transition:.35s ease; }
.service-feature-card:hover { transform:translateY(-8px); border-color:#0d6efd; box-shadow:0 18px 45px rgba(15,23,42,.09); }
.service-feature-card .num { display:block; color:#dc3545; font-weight:800; font-size:12px; margin-bottom:28px; }
.service-feature-card h5 { font-size:20px; margin:0; }
.service-secondary-image { margin-top:45px; border-radius:18px; overflow:hidden; background:#0f172a; max-height:520px; }
.service-secondary-image img { width:100%; height:100%; max-height:520px; object-fit:cover; display:block; }

.service-gallery-teaser { background:#0f172a; padding:90px 60px; color:#fff; }
.service-gallery-teaser h2 { color:#fff; }
.service-gallery-teaser p { color:#94a3b8; }
.service-mini-gallery { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:35px; }
.service-mini-shot { height:300px; overflow:hidden; border-radius:14px; position:relative; background:#172033; }
.service-mini-shot img { width:100%; height:auto; min-height:100%; display:block; transition:transform 5s linear; }
.service-mini-shot:hover img { transform:translateY(var(--mini-shift, 0px)); }

.inner-cta { background:linear-gradient(-45deg,#dc3545,#1e293b,#0d6efd,#0f172a); background-size:400% 400%; animation:stateGradient 12s ease infinite; padding:75px 60px; color:#fff; }
.inner-cta h2 { color:#fff; font-size:clamp(2.4rem,4vw,4.3rem); }
.inner-cta p { color:#dbe6f4; font-size:17px; }
@keyframes stateGradient { 0%{background-position:0 50%} 50%{background-position:100% 50%} 100%{background-position:0 50%} }

.service-catalog-wrap { background:#0f172a; padding:90px 60px; color:#fff; }
.service-catalog-wrap::before { content:""; position:absolute; width:430px; height:430px; left:-170px; top:-170px; border-radius:50%; background:rgba(220,53,69,.25); filter:blur(100px); }
.service-catalog-wrap::after { content:""; position:absolute; width:500px; height:500px; right:-180px; bottom:-180px; border-radius:50%; background:rgba(13,110,253,.28); filter:blur(110px); }
.service-catalog-head,.service-groups { position:relative; z-index:2; }
.service-catalog-wrap h1 { color:#fff; font-size:clamp(3rem,6vw,6rem); }
.service-catalog-wrap .intro { color:#a9b5c7; font-size:18px; line-height:1.8; max-width:850px; }
.service-group { margin-top:55px; }
.service-group-title { color:#fff; font-size:24px; margin-bottom:20px; display:flex; align-items:center; gap:14px; }
.service-group-title::before { content:""; width:34px; height:2px; background:#dc3545; }
.catalog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.catalog-card { position:relative; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.035); border-radius:18px; padding:28px; min-height:220px; transition:.35s ease; overflow:hidden; }
.catalog-card:hover { transform:translateY(-8px); border-color:rgba(79,140,255,.55); background:rgba(255,255,255,.065); }
.catalog-card .catalog-card-icon { width:50px;height:50px;border-radius:13px;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:#fff;margin-bottom:30px; }
.catalog-card h4 { color:#fff; font-size:21px; margin-bottom:10px; }
.catalog-card p { color:#94a3b8; font-size:14px; line-height:1.7; margin:0 0 28px; }
.catalog-card .arrow { position:absolute; right:24px; bottom:24px; color:#4f8cff; transform:rotate(-35deg); transition:.3s ease; }
.catalog-card:hover .arrow { transform:rotate(0); }
.catalog-card > a { position:absolute; inset:0; z-index:3; }

.gallery-wrap { background:#f5f7fb; padding:90px 55px; }
.gallery-wrap h1 { font-size:clamp(3rem,6vw,6rem); color:#0f172a; }
.gallery-intro { max-width:820px; color:#637083; font-size:18px; line-height:1.8; }
.gallery-filters { display:flex; flex-wrap:wrap; gap:10px; margin:35px 0 40px; }
.gallery-filter { border:1px solid #dce2ea; background:#fff; color:#243044; padding:10px 16px; border-radius:999px; font-size:13px; font-weight:700; cursor:pointer; transition:.25s ease; }
.gallery-filter:hover,.gallery-filter.is-active { background:#0f172a; border-color:#0f172a; color:#fff; }
.gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.gallery-card { background:#fff; border-radius:18px; overflow:hidden; border:1px solid #e5eaf1; box-shadow:0 10px 35px rgba(15,23,42,.05); transition:.35s ease; }
.gallery-card:hover { transform:translateY(-7px); box-shadow:0 22px 48px rgba(15,23,42,.12); }
.gallery-shot { height:430px; overflow:hidden; background:#e8edf3; position:relative; }
.gallery-shot::after { content:"Scroll preview"; position:absolute; right:12px; bottom:12px; padding:7px 10px; background:rgba(15,23,42,.76); color:#fff; border-radius:999px; font-size:10px; letter-spacing:.5px; pointer-events:none; }
.gallery-shot img { width:100%; height:auto; min-height:100%; display:block; transform:translateY(0); transition:transform 6s linear; will-change:transform; }
.gallery-card:hover .gallery-shot img,.gallery-card.is-scrolling .gallery-shot img { transform:translateY(var(--gallery-shift,0px)); }
.gallery-card-meta { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:17px 18px; }
.gallery-card-meta span { font-size:12px; color:#7c8798; text-transform:uppercase; letter-spacing:1px; }
.gallery-card-meta strong { color:#0f172a; font-size:15px; }
.gallery-empty { display:none; text-align:center; padding:60px 20px; color:#677489; }

@media (max-width: 1199px) {
    .service-feature-grid,.service-mini-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .catalog-grid,.gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 767px) {
    .service-hero { min-height:620px; }
    .service-hero::before { background:linear-gradient(180deg,rgba(5,14,27,.7),rgba(5,14,27,.98) 68%); }
    .service-hero-content,.service-section,.service-gallery-teaser,.inner-cta,.service-catalog-wrap,.gallery-wrap { padding:55px 22px; }
    .service-hero h1 { letter-spacing:-2px; }
    .service-feature-grid,.service-mini-gallery,.catalog-grid,.gallery-grid { grid-template-columns:1fr; }
    .service-mini-shot { height:260px; }
    .gallery-shot { height:390px; }
}
