/* Services-only interaction layer. Global site.css is untouched. */
.services-hover-page{overflow-x:hidden;background:#050505}
.services-hover-page [data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .75s cubic-bezier(.22,.8,.2,1)}
.services-hover-page [data-reveal].is-visible{opacity:1;transform:none}
#servicesHeader.is-scrolled{background:rgba(5,5,5,.88);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.06)}
.services-mobile-nav{display:none}

.services-interactive{padding-bottom:8rem}
.service-list{border-top:1px solid rgba(255,255,255,.10)}
.service-group{border-bottom:1px solid rgba(255,255,255,.10)}
.service-group-hitbox{position:relative}
.service-trigger{width:100%;border:0;background:transparent;color:inherit;text-align:left;padding:58px 0 52px;display:flex;align-items:center;justify-content:space-between;gap:24px;cursor:pointer}
.service-trigger:focus-visible{outline:2px solid #e03030;outline-offset:-2px}
.service-title{display:block;font-family:var(--font-heading);font-size:clamp(4rem,10.5vw,9.5rem);font-weight:700;line-height:.78;letter-spacing:-.065em;color:#626262;transition:color .32s ease,transform .42s cubic-bezier(.22,.8,.2,1),text-shadow .32s ease}
.service-copy{display:block;margin-top:18px;max-width:560px;color:#777;font-size:15px;line-height:1.7;transition:color .32s ease}
.service-plus{width:50px;height:50px;flex:0 0 auto;border:1px solid #2c2c2c;border-radius:50%;display:grid;place-items:center;color:#e03030;font-size:28px;font-weight:300;transition:all .32s ease}

/* Desktop: hover over the whole group opens the dropdown. The hitbox contains the cards, so moving from heading to cards keeps them open. */
.service-group:hover .service-title,.service-group.is-open .service-title{color:#e03030;transform:translateX(7px);text-shadow:0 0 28px rgba(224,48,48,.16)}
.service-group:hover .service-copy,.service-group.is-open .service-copy{color:#a0a0a0}
.service-group:hover .service-plus,.service-group.is-open .service-plus{background:#e03030;border-color:#e03030;color:#050505;transform:rotate(45deg)}

.service-dropdown{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s cubic-bezier(.22,.8,.2,1)}
.service-group:hover .service-dropdown,.service-group.is-open .service-dropdown{grid-template-rows:1fr}
.service-dropdown>div{min-height:0;overflow:hidden}
.service-card-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:0 0 54px}
.service-card-row-3{grid-template-columns:repeat(3,minmax(0,1fr));max-width:76%}
.service-card{position:relative;display:block;overflow:hidden;aspect-ratio:1/.68;min-height:240px;border:1px solid #252525;background:#0a0a0a;color:#fff;border-radius:2px;isolation:isolate;transform:translateY(-18px);opacity:0;transition:transform .55s cubic-bezier(.22,.8,.2,1),opacity .55s ease,border-color .35s ease,box-shadow .35s ease}
.service-group:hover .service-card,.service-group.is-open .service-card{transform:none;opacity:1}
.service-group:hover .service-card:nth-child(1),.service-group.is-open .service-card:nth-child(1){transition-delay:.03s}
.service-group:hover .service-card:nth-child(2),.service-group.is-open .service-card:nth-child(2){transition-delay:.09s}
.service-group:hover .service-card:nth-child(3),.service-group.is-open .service-card:nth-child(3){transition-delay:.15s}
.service-group:hover .service-card:nth-child(4),.service-group.is-open .service-card:nth-child(4){transition-delay:.21s}
.service-card:hover{transform:translateY(-6px)!important;border-color:rgba(224,48,48,.72);box-shadow:0 24px 55px rgba(0,0,0,.55)}
.card-art,.card-overlay{position:absolute;inset:0}
.card-art{background-size:cover;background-position:center;transition:transform .65s cubic-bezier(.22,.8,.2,1),filter .65s ease}
.service-card:hover .card-art{transform:scale(1.09);filter:saturate(1.15) contrast(1.05)}
.card-overlay{background:linear-gradient(180deg,rgba(0,0,0,.10),rgba(0,0,0,.28) 35%,rgba(0,0,0,.92) 100%),radial-gradient(circle at 50% 45%,rgba(224,48,48,.10),transparent 52%);transition:background .35s ease}
.service-card:hover .card-overlay{background:linear-gradient(180deg,rgba(224,48,48,.07),rgba(0,0,0,.26) 35%,rgba(0,0,0,.92) 100%),radial-gradient(circle at 50% 45%,rgba(224,48,48,.26),transparent 52%)}
.card-number{position:absolute;z-index:2;left:15px;top:13px;color:#c9a84c;font:500 11px/1 var(--font-heading);letter-spacing:.2em}
.card-arrow{position:absolute;z-index:2;right:13px;top:11px;width:38px;height:38px;border:1px solid rgba(255,255,255,.22);border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.18);color:#fff;font-size:16px;transition:all .32s ease}
.service-card:hover .card-arrow{background:#e03030;border-color:#e03030;color:#050505;transform:rotate(0)}
.card-text{position:absolute;z-index:2;left:18px;right:18px;bottom:18px;display:flex;flex-direction:column;align-items:center;text-align:center;transform:translateY(8px);transition:transform .32s ease}
.service-card:hover .card-text{transform:none}
.card-text b{font:600 clamp(1.1rem,1.7vw,1.55rem)/1.05 var(--font-heading);letter-spacing:-.02em}
.card-text small{margin-top:7px;color:#b0b0b0;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}

.card-create-1{background:radial-gradient(circle at 45% 35%,rgba(224,48,48,.95),transparent 23%),linear-gradient(135deg,#2c0707,#080808 56%,#32120e)}
.card-create-2{background:radial-gradient(circle at 65% 42%,rgba(255,106,77,.8),transparent 24%),linear-gradient(140deg,#090909,#43130f 55%,#080808)}
.card-create-3{background:radial-gradient(circle at 50% 34%,rgba(205,52,59,.88),transparent 28%),linear-gradient(160deg,#190708,#090909 60%,#2a110e)}
.card-create-4{background:radial-gradient(circle at 30% 44%,rgba(225,48,48,.82),transparent 28%),linear-gradient(130deg,#0a0a0a,#331814 58%,#070707)}
.card-shoot-1{background:radial-gradient(circle at 50% 40%,rgba(220,199,156,.5),transparent 28%),linear-gradient(155deg,#1a1a1a,#3e2f1b 58%,#080808)}
.card-shoot-2{background:radial-gradient(circle at 65% 35%,rgba(255,214,192,.5),transparent 24%),linear-gradient(145deg,#211013,#4a2b27 58%,#100808)}
.card-shoot-3{background:radial-gradient(circle at 43% 31%,rgba(245,214,187,.54),transparent 24%),linear-gradient(135deg,#201818,#41191e 58%,#0b0b0b)}
.card-design-1{background:radial-gradient(circle at 51% 42%,rgba(201,168,76,.48),transparent 25%),linear-gradient(145deg,#101010,#3b2e12 56%,#070707)}
.card-design-2{background:radial-gradient(circle at 63% 35%,rgba(201,168,76,.56),transparent 21%),linear-gradient(135deg,#090909,#2b231d 60%,#060606)}
.card-design-3{background:radial-gradient(circle at 51% 40%,rgba(224,48,48,.58),transparent 23%),linear-gradient(155deg,#0d0d0d,#281313 60%,#070707)}

@media(max-width:1100px){.service-card-row{grid-template-columns:repeat(2,minmax(0,1fr))}.service-card-row-3{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}}
@media(max-width:767px){
  .services-mobile-nav{display:grid;max-height:0;overflow:hidden;background:rgba(5,5,5,.98);border-top:1px solid rgba(255,255,255,.05);transition:max-height .35s ease}
  .services-mobile-nav.is-open{max-height:320px}
  .services-mobile-nav a{padding:16px 24px;color:#aaa;border-bottom:1px solid rgba(255,255,255,.06);font-family:var(--font-heading);font-size:13px;text-transform:uppercase;letter-spacing:.14em}
  .service-trigger{padding:48px 0 42px}
  .service-title{font-size:clamp(3.4rem,16vw,5.6rem)}
  .service-copy{max-width:90%;font-size:13px;line-height:1.6}
  .service-plus{width:44px;height:44px;font-size:24px}
  .service-card-row,.service-card-row-3{grid-template-columns:1fr;max-width:none;gap:12px;padding-bottom:38px}
  .service-card{min-height:230px;aspect-ratio:1/.8}
}