/* Contextual editorial scenes for the six service landing pages. */
.gads-page .service-hero-photo {
    width: 100%;
    height: clamp(170px, 17vw, 250px);
    display: block;
    object-fit: cover;
    object-position: center;
    border: 1px solid rgba(255, 255, 255, .17);
    border-radius: 18px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, .16);
}

.gads-hero-visual .service-hero-photo { margin-bottom: 10px; }
.gads-hero-visual svg { max-height: 510px; }
.seo-hero-visual .service-hero-photo,
.smm-hero-console .service-hero-photo,
.webdev-console .service-hero-photo,
.growth-engine .service-hero-photo { margin-bottom: 22px; }

.gads-page .gads-hero { min-height: 700px; }
.gads-page .gads-hero h1 { font-size: clamp(52px, 5.8vw, 88px); line-height: .96; }
.gads-page .gads-scope-stats { margin-top: 30px; }

.gads-page .service-process-scene { margin: 20px 0 0; min-height: 310px; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr); overflow: hidden; border: 1px solid rgba(255, 255, 255, .11); border-radius: 24px; background: #101a13; }
.gads-page .service-process-scene img { width: 100%; height: 100%; min-height: 310px; display: block; object-fit: cover; object-position: center; }
.gads-page .service-process-scene figcaption { padding: clamp(26px, 3.6vw, 54px); display: flex; flex-direction: column; justify-content: center; gap: 18px; }
.gads-page .service-process-scene figcaption span { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .14em; }
.gads-page .service-process-scene figcaption strong { max-width: 450px; color: #fff; font-size: clamp(26px, 2.6vw, 42px); line-height: 1.07; letter-spacing: -.045em; }

.gads-page .service-module-scene { margin: 30px 0 0; min-height: 290px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); overflow: hidden; border-radius: 22px; background: #101a13; }
.gads-page .service-module-scene img { width: 100%; height: 100%; min-height: 290px; display: block; object-fit: cover; object-position: center; }
.gads-page .service-module-scene figcaption { padding: clamp(28px, 3.5vw, 50px); display: flex; flex-direction: column; justify-content: center; gap: 18px; }
.gads-page .service-module-scene figcaption span { color: var(--accent); font-size: 8px; font-weight: 900; letter-spacing: .13em; }
.gads-page .service-module-scene figcaption strong { max-width: 430px; color: #fff; font-size: clamp(27px, 2.7vw, 42px); line-height: 1.05; letter-spacing: -.045em; }
.gads-page .service-module-scene + .gads-search-tools { margin-top: 26px; }

.gads-page .service-delivery-scene { margin: 34px 0 0; min-height: 290px; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); overflow: hidden; border: 1px solid rgba(12, 18, 14, .12); border-radius: 22px; background: #e8eee6; }
.gads-page .service-delivery-scene img { width: 100%; height: 100%; min-height: 290px; display: block; object-fit: cover; object-position: center; }
.gads-page .service-delivery-scene figcaption { padding: clamp(28px, 3.5vw, 56px); display: flex; flex-direction: column; justify-content: center; gap: 18px; }
.gads-page .service-delivery-scene figcaption span { color: #4e6d09; font-size: 8px; font-weight: 900; letter-spacing: .13em; }
.gads-page .service-delivery-scene figcaption strong { max-width: 440px; color: #151d16; font-size: clamp(27px, 2.7vw, 43px); line-height: 1.04; letter-spacing: -.045em; }
.gads-page .service-delivery-scene + .gads-delivery-grid { margin-top: 28px; }

@media (max-width: 900px) {
    .gads-page .service-process-scene { grid-template-columns: 1fr; }
    .gads-page .service-process-scene img { height: 300px; min-height: 0; }
    .gads-page .service-process-scene figcaption { min-height: 170px; }
    .gads-page .service-module-scene { grid-template-columns: 1fr; }
    .gads-page .service-module-scene img { height: 300px; min-height: 0; }
    .gads-page .service-delivery-scene { grid-template-columns: 1fr; }
    .gads-page .service-delivery-scene img { height: 300px; min-height: 0; }
}

@media (max-width: 720px) {
    .gads-page .service-hero-photo { height: 205px; }
    .gads-page .gads-hero { min-height: 0; }
    .gads-page .gads-hero h1 { font-size: clamp(42px, 11vw, 60px); }
    .gads-page .service-process-scene { border-radius: 18px; }
    .gads-page .service-process-scene img { height: 220px; }
    .gads-page .service-module-scene { border-radius: 18px; }
    .gads-page .service-module-scene img { height: 220px; }
    .gads-page .service-module-scene figcaption { padding: 29px 23px; }
    .gads-page .service-delivery-scene { border-radius: 18px; }
    .gads-page .service-delivery-scene img { height: 220px; }
    .gads-page .service-delivery-scene figcaption { padding: 29px 23px; }
}