/* Olsen Concrete motion layer. Brand red #c1272d. Enhancements only: if JS never runs,
   nothing is hidden. All motion is disabled under prefers-reduced-motion. */

:root{ --olsen-red:#c1272d; --olsen-ink:#0a0a0a; }

/* 1. Scroll progress bar ------------------------------------------------ */
#olsen-progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:100000;
  background:linear-gradient(90deg,#c1272d,#e4463c);box-shadow:0 0 8px rgba(193,39,45,.6);
  transition:width .08s linear;will-change:width}

/* 2. Scroll-reveal (only applied once JS tags elements) ----------------- */
html.olsen-fx-on .olsen-reveal{opacity:0;transform:translateY(26px);
  transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);
  will-change:opacity,transform}
html.olsen-fx-on .olsen-reveal.is-in{opacity:1;transform:none}
/* stagger children within a grid */
html.olsen-fx-on .olsen-reveal.d1{transition-delay:.08s}
html.olsen-fx-on .olsen-reveal.d2{transition-delay:.16s}
html.olsen-fx-on .olsen-reveal.d3{transition-delay:.24s}
html.olsen-fx-on .olsen-reveal.d4{transition-delay:.32s}

/* 3. Hero entrance + troweled-concrete light sweep --------------------- */
html.olsen-fx-on .olsenllc-hero-inner>*{animation:olsen-rise .9s both}
html.olsen-fx-on .olsenllc-hero-inner>*:nth-child(2){animation-delay:.12s}
html.olsen-fx-on .olsenllc-hero-inner>*:nth-child(3){animation-delay:.24s}
html.olsen-fx-on .olsenllc-hero-inner>*:nth-child(4){animation-delay:.36s}
@keyframes olsen-rise{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
/* a slow light sweep across the hero, like sheen moving over fresh-troweled concrete */
.olsenllc-hero{position:relative;overflow:hidden}
html.olsen-fx-on .olsenllc-hero::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.10) 48%,rgba(255,255,255,.18) 50%,rgba(255,255,255,.10) 52%,transparent 65%);
  transform:translateX(-120%);animation:olsen-sheen 7s ease-in-out 1.2s infinite}
@keyframes olsen-sheen{0%{transform:translateX(-120%)}55%{transform:translateX(120%)}100%{transform:translateX(120%)}}
html.olsen-fx-on .olsenllc-hero-inner{position:relative;z-index:2}

/* 4. Buttons: shine sweep + lift on hover (desktop) -------------------- */
.olsenllc-btn{position:relative;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease}
@media(hover:hover) and (pointer:fine){
  .olsenllc-btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(193,39,45,.28)}
  .olsenllc-btn::before{content:"";position:absolute;top:0;left:-75%;width:50%;height:100%;
    background:linear-gradient(120deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);transition:left .6s ease}
  .olsenllc-btn:hover::before{left:130%}
}

/* 5. Cards: lift + accent on hover (desktop) --------------------------- */
.olsenllc-cardgrid-item,.olsenllc-area-card,.olsenllc-review{transition:transform .22s ease,box-shadow .22s ease}
@media(hover:hover) and (pointer:fine){
  .olsenllc-cardgrid-item:hover,.olsenllc-area-card:hover,.olsenllc-review:hover{
    transform:translateY(-6px);box-shadow:0 16px 40px rgba(10,10,10,.14)}
  .olsenllc-cardgrid-item:hover .olsenllc-cardgrid-index{color:var(--olsen-red);transition:color .22s ease}
  .olsenllc-cardgrid-item:hover .olsenllc-arrow{transform:translateX(6px);transition:transform .22s ease}
}

/* 6. Sticky-header condense on scroll ---------------------------------- */
.olsenllc-hdr{transition:box-shadow .25s ease,padding .25s ease,background-color .25s ease}
html.olsen-scrolled .olsenllc-hdr{box-shadow:0 6px 24px rgba(10,10,10,.12)}

/* 7. Count-up: hold at 0 only while armed by JS ------------------------ */
html.olsen-fx-on .olsenllc-count.olsen-armed{opacity:.35}
html.olsen-fx-on .olsenllc-count.olsen-done{opacity:1;transition:opacity .3s ease}

@media (prefers-reduced-motion: reduce){
  #olsen-progress{display:none}
  html.olsen-fx-on .olsen-reveal,
  html.olsen-fx-on .olsenllc-hero-inner>*{opacity:1!important;transform:none!important;animation:none!important}
  html.olsen-fx-on .olsenllc-hero::after{display:none}
  .olsenllc-btn,.olsenllc-cardgrid-item,.olsenllc-area-card,.olsenllc-review{transition:none}
  html.olsen-fx-on .olsenllc-count.olsen-armed{opacity:1}
}
