/* Photo-led directions: details are revealed on explicit click, including touch. */
#services-spectrum [hidden]{display:none!important}
#services-spectrum[data-services-layout]:not([data-services-layout=original]) .hn-service-spectrum__intro{padding:56px 24px 32px}
#services-spectrum[data-services-layout]:not([data-services-layout=original]) .hn-service-spectrum__title{max-width:1100px;font-size:clamp(36px,4vw,56px);line-height:1.08}
.omf-directions{padding:0 clamp(20px,2.2vw,40px) 64px;--direction-gap:20px;--direction-radius:28px}
.omf-directions__eyebrow{font:400 12px/1.4 Jost,sans-serif;letter-spacing:.07em;text-transform:uppercase;color:#818378;margin:0 0 18px;text-wrap:balance}
.omf-directions__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,clamp(240px,20vw,300px));gap:var(--direction-gap)}
.omf-direction{position:relative;isolation:isolate;overflow:hidden;min-width:0;border-radius:var(--direction-radius);background:#e9e7df;color:white;box-sizing:border-box}
.omf-direction--face,.omf-direction--body{grid-row:span 2}.omf-direction--cosmetology{grid-column:span 2}
.omf-direction__image{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .6s ease}
.omf-direction--face .omf-direction__image{object-position:52% center}.omf-direction--body .omf-direction__image{object-position:48% center}.omf-direction--cosmetology .omf-direction__image{object-position:center 48%}
.omf-direction::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#17241955,transparent 40%);transition:background .25s}
.omf-direction__top{position:relative;z-index:3;padding:26px 26px 0;pointer-events:none}
.omf-direction h3{margin:0;color:inherit;font:400 clamp(21px,1.8vw,27px)/1.16 Jost,sans-serif;text-transform:none;letter-spacing:-.015em;text-wrap:balance;text-shadow:0 1px 8px #0003}
.omf-direction h3[contenteditable=true]{pointer-events:auto}
.omf-direction__toggle{position:absolute;inset:0;z-index:2;border:0;border-radius:inherit;background:transparent;cursor:pointer;color:#344231}
.omf-direction__toggle::after{content:'›';position:absolute;bottom:24px;right:24px;width:44px;height:44px;border-radius:50%;background:white;display:grid;place-items:center;font:32px/1 Arial,sans-serif;transition:transform .2s}
.omf-direction__toggle:focus-visible{outline:3px solid #b88b66;outline-offset:-5px}
.omf-direction.is-open::before{background:#f5f3ebf5}
.omf-direction.is-open{color:#283c2d}.omf-direction.is-open h3{text-shadow:none}.omf-direction.is-open .omf-direction__toggle::after{content:'×';font-size:25px;background:#e5e8dc}
.omf-direction__bottom{position:absolute;z-index:3;top:100px;left:26px;right:26px;bottom:82px;overflow:auto;scrollbar-width:thin;scrollbar-color:#a6ae98 transparent;animation:details-in .2s ease}
.omf-direction__services{display:grid;gap:2px;list-style:none;margin:0;padding:0}
.omf-direction__services li{margin:0;padding:0;min-width:0}
.omf-direction__services a{display:block;padding:7px 0;color:#283c2d!important;font:400 17px/1.3 Jost,sans-serif;text-wrap:pretty;text-decoration:none;border-bottom:1px solid #283c2d18}
.omf-direction__services a:hover{text-decoration:underline;text-underline-offset:4px}.omf-direction__services a:focus-visible,.omf-direction__cta:focus-visible{outline:2px solid #304321;outline-offset:-2px}
.omf-direction__cta{display:flex;align-items:center;gap:12px;color:#304321!important;text-decoration:none;font:500 14px Jost,sans-serif;padding-top:16px}
.omf-direction__arrow{font:20px Arial,sans-serif}.omf-direction__cta:hover{text-decoration:underline}
[data-services-layout=grid] .omf-directions__grid{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(2,360px)}
[data-services-layout=grid] .omf-direction{grid-column:span 2;grid-row:auto}[data-services-layout=grid] .omf-direction--figure,[data-services-layout=grid] .omf-direction--care{grid-column:span 3}
@keyframes details-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(hover:hover){.omf-direction:not(.is-open):hover .omf-direction__image{transform:scale(1.025)}.omf-direction:not(.is-open):hover .omf-direction__toggle::after{transform:translateX(3px)}}
@media(max-width:1000px){.omf-directions__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,320px)}.omf-direction--face,.omf-direction--body{grid-row:auto}.omf-direction--cosmetology{grid-column:span 2}[data-services-layout=grid] .omf-directions__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,340px)}[data-services-layout=grid] .omf-direction{grid-column:auto}[data-services-layout=grid] .omf-direction--care{grid-column:span 2}}
@media(max-width:620px){.omf-directions{padding:0 16px 48px}.omf-directions__grid,[data-services-layout=grid] .omf-directions__grid{grid-template-columns:1fr;grid-template-rows:none;grid-auto-rows:340px;gap:16px}.omf-direction,[data-services-layout=grid] .omf-direction,[data-services-layout=grid] .omf-direction--care{grid-column:auto;grid-row:auto}.omf-direction__top{padding:24px 24px 0}.omf-direction h3{font-size:26px;max-width:290px}.omf-direction__bottom{left:24px;right:24px;top:92px;bottom:78px}.omf-direction__services a{font-size:17px}.omf-direction__image{object-position:center 45%}#services-spectrum[data-services-layout]:not([data-services-layout=original]) .hn-service-spectrum__intro{padding:44px 18px 28px}}
@media(prefers-reduced-motion:reduce){.omf-direction__image,.omf-direction__toggle::after{transition:none}.omf-direction__bottom{animation:none}}
/* Compact cards with a short preview, full list available by click. */
.omf-directions__grid{grid-template-rows:repeat(2,240px)}
.omf-direction__preview{position:absolute;left:26px;right:78px;bottom:26px;pointer-events:none;display:grid;gap:4px;font:400 15px/1.3 Jost,sans-serif;text-shadow:0 1px 5px #0005}
.omf-direction__preview small{font-size:12px;margin-top:8px;opacity:.85}
.omf-direction::before{background:linear-gradient(180deg,#17241950,#17241908 35%,#17241912 50%,#172419a3)}
[data-services-layout=grid] .omf-directions__grid{grid-template-rows:repeat(2,280px)}
@media(max-width:1000px){.omf-directions__grid{grid-template-rows:repeat(3,270px)}[data-services-layout=grid] .omf-directions__grid{grid-template-rows:repeat(3,280px)}}
@media(max-width:620px){.omf-directions__grid,[data-services-layout=grid] .omf-directions__grid{grid-template-rows:none;grid-auto-rows:280px}.omf-direction__preview{left:24px;bottom:24px;font-size:16px}}
.omf-direction.is-open .omf-direction__bottom{top:78px;bottom:24px;right:82px}@media(max-width:620px){.omf-direction.is-open .omf-direction__bottom{top:96px;bottom:24px}}

/* The complete lists remain readable when JavaScript is unavailable. */
.omf-direction:not(.is-enhanced){min-height:620px;color:#283c2d}
.omf-direction:not(.is-enhanced)::before{background:#f5f3ebf5}
.omf-direction:not(.is-enhanced) .omf-direction__bottom{bottom:24px;right:26px}
.omf-directions__grid:has(.omf-direction:not(.is-enhanced)){grid-template-rows:auto}
.omf-direction h3{scroll-margin-top:150px}

/* Larger service labels; use the full card width above the round control. */
.omf-direction__preview{font-size:18px;line-height:1.3;right:26px}
.omf-direction__preview>span,.omf-direction__services a{word-break:normal;overflow-wrap:normal;hyphens:none;text-wrap:pretty}
.omf-direction__preview small{font-size:13px;padding-right:56px}
.omf-direction__services a{font-size:18px}
@media(max-width:620px){.omf-direction__preview{right:24px;font-size:18px}}

/* Direction card entrance: driven by the existing reveal IntersectionObserver. */
.omf-direction.next-reveal{opacity:0;transform:translateY(20px) scale(.985);transform-origin:center bottom;transition:opacity .6s ease var(--reveal-delay,0ms),transform .7s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms)}
.omf-direction.next-reveal:nth-child(2){--reveal-delay:70ms}
.omf-direction.next-reveal:nth-child(3){--reveal-delay:140ms}
.omf-direction.next-reveal:nth-child(4){--reveal-delay:210ms}
.omf-direction.next-reveal:nth-child(5){--reveal-delay:280ms}
.omf-direction.next-reveal.is-revealed{opacity:1;transform:none}
@media(max-width:620px){.omf-direction.next-reveal:nth-child(n){--reveal-delay:0ms;transform:translateY(16px)}.omf-direction.next-reveal.is-revealed{transform:none}}
@media(prefers-reduced-motion:reduce){.omf-direction.next-reveal{opacity:1!important;transform:none!important;transition:none!important}}