/* Finishing details shared by the Atelier and Sapphire landings.
   Quiet by design: nothing here changes layout, and all motion stops under prefers-reduced-motion. */
:root{--finish-ease:cubic-bezier(.22,1,.36,1)}

/* Typography: even headline rags, fewer orphans, proper kerning and figures. */
h1,h2,h3,h4{text-wrap:balance;font-kerning:normal}
p,li,small{text-wrap:pretty}
body{text-rendering:optimizeLegibility;-webkit-tap-highlight-color:transparent}
[class*="price"],.pricing-card,time{font-variant-numeric:tabular-nums}

/* Selection and caret carry the theme instead of browser blue. */
::selection{background:#101214;color:#f5f4ef}
[data-landing-theme="sapphire"] ::selection{background:var(--hr-color-lime);color:#062840}
input,textarea{caret-color:currentColor}

/* One consistent keyboard focus ring. */
:where(a,button,summary,[tabindex]):focus-visible{outline:2px solid #101214;outline-offset:3px}
[data-landing-theme="sapphire"] :where(a,button,summary,[tabindex]):focus-visible{outline-color:var(--hr-color-lime)}

/* Primary buttons: a lit top edge, a soft lift on hover, a firm press. */
.book,.cta-dark{transition:transform .5s var(--finish-ease),box-shadow .5s var(--finish-ease),background-color .3s ease,scale var(--hr-motion-duration-release,180ms) var(--hr-motion-easing-settle,cubic-bezier(.16,1,.3,1))}
html:not([data-landing-theme="sapphire"]) .book,
html:not([data-landing-theme="sapphire"]) .cta-dark{box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 1px 2px rgba(16,18,20,.22),0 8px 24px rgba(16,18,20,.08)}
[data-landing-theme="sapphire"] .book,
[data-landing-theme="sapphire"] .cta-dark{box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(58,90,0,.18),var(--hr-shadow-primary)}
.book span,.cta-dark span,.explore span{display:inline-block;transition:transform .5s var(--finish-ease)}
@media(hover:hover) and (pointer:fine){
 .book:hover,.cta-dark:hover{transform:translateY(-1px)}
 html:not([data-landing-theme="sapphire"]) .book:hover,
 html:not([data-landing-theme="sapphire"]) .cta-dark:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 2px 4px rgba(16,18,20,.2),0 14px 34px rgba(16,18,20,.16)}
 [data-landing-theme="sapphire"] .book:hover,
 [data-landing-theme="sapphire"] .cta-dark:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -1px 0 rgba(58,90,0,.18),0 12px 34px rgba(184,255,0,.28)}
 .book:hover span,.cta-dark:hover span,.explore:hover span{transform:translateX(calc(4px * var(--hr-dir,1)))}
}
.book:active,.cta-dark:active{transform:translateY(0);scale:var(--hr-press-scale,.97);transition-duration:var(--hr-motion-duration-press,90ms);transition-timing-function:ease-out}

/* Every control answers on touch-down, not on release (the tap flash above is off). The separate `scale`
   property composes with hover lifts and selected offsets instead of replacing them; it returns on the
   settle curve. Cards press less than controls. Under reduced motion the scale tokens resolve to 1 and a
   short dim takes over (block at the end). */
:where(.pricing-switch button,.pricing-calc-stepper button,.pricing-cta,.journey-tab,.mobile-menu-toggle,.landing-themes summary,.landing-themes-menu button,.app-nav button,.segment button,.day,.shift-option,.save-shift,.back-btn,.weekbar button,.app-avatar){transition:scale var(--hr-motion-duration-release,180ms) var(--hr-motion-easing-settle,cubic-bezier(.16,1,.3,1))}
.pricing-switch button:active,.pricing-calc-stepper button:not(:disabled):active,.pricing-cta:active,.journey-links a:active,.journey-tab:active,.mobile-menu-toggle:active,.landing-themes summary:active,.landing-themes-menu button:active,
.quick-grid button:active,.more-list button:active,.demo-action:active,.app-nav button:active,.segment button:active,.day:active,.shift-option:active,.save-shift:active,.back-btn:active,.weekbar button:active,.app-avatar:active{scale:var(--hr-press-scale,.97);transition-duration:var(--hr-motion-duration-press,90ms);transition-timing-function:ease-out}
/* A card does not press when the press belongs to a link or button inside it. */
.audience-card:active:not(:has(a:active)),.pricing-grid-companies .pricing-card:active:not(:has(button:active)){scale:var(--hr-press-scale-card,.985);transition-duration:var(--hr-motion-duration-press,90ms);transition-timing-function:ease-out}

/* Secondary links draw their underline instead of snapping. */
.direct-link{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .6s var(--finish-ease),color .3s ease}
@media(hover:hover) and (pointer:fine){.direct-link:hover{background-size:100% 1px;color:inherit}}

/* The play control answers the pointer. */
.watch-icon{transition:transform .5s var(--finish-ease),border-color .3s ease,background-color .3s ease}
@media(hover:hover) and (pointer:fine){.watch:hover .watch-icon{transform:scale(1.06);border-color:currentColor}}

/* Sapphire glass: a specular top edge on the floating header, and fine film grain on the hero
   so the gradients read as material rather than flat fills. */
[data-landing-theme="sapphire"] header{box-shadow:var(--hr-shadow-glass),inset 0 1px 0 rgba(255,255,255,.18)}
[data-landing-theme="sapphire"] .hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.05;mix-blend-mode:soft-light;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
[data-landing-theme="sapphire"] .hero>*{position:relative;z-index:2}

@media(prefers-reduced-motion:reduce){
 .book,.cta-dark,.book span,.cta-dark span,.explore span,.direct-link,.watch-icon{transition:none}
 .book:hover,.cta-dark:hover,.book:active,.cta-dark:active,.watch:hover .watch-icon,.book:hover span,.cta-dark:hover span,.explore:hover span{transform:none}
 /* Nothing scales: the press is an instant dim that fades back on release. */
 .book:active,.cta-dark:active,.pricing-switch button:active,.pricing-calc-stepper button:not(:disabled):active,.pricing-cta:active,.journey-links a:active,.journey-tab:active,.mobile-menu-toggle:active,.landing-themes summary:active,.landing-themes-menu button:active,
 .quick-grid button:active,.more-list button:active,.demo-action:active,.app-nav button:active,.segment button:active,.day:active,.shift-option:active,.save-shift:active,.back-btn:active,.weekbar button:active,.app-avatar:active{opacity:var(--hr-press-opacity,.7);transition-duration:0s!important}
 .audience-card:active:not(:has(a:active)),.pricing-grid-companies .pricing-card:active:not(:has(button:active)){opacity:var(--hr-press-opacity,.7);transition-duration:0s!important}
}