/* Bounded 01-04 review. Keep the selected layouts and original assets intact. */
body[data-hero-scene="hidden-current"] .site-header {
  min-height: 66px;
  padding: 10px 12px;
  gap: 12px;
  align-items: center;
}
body[data-hero-scene="hidden-current"] .site-header .brand { padding-left: 0; }
body[data-hero-scene="hidden-current"] .site-header > .button { margin-right: 0; flex: none; }
body[data-hero-scene="hidden-current"] .site-header .nav-links { margin-left: 70px; }
.site-header .nav-toggle { display: none; }
.hc-note { left: 61%; top: 72%; width: 17%; padding: 20px 17px; text-align: left; }
.hc-note-label { margin-bottom: 10px; }
#top .hc-note p { text-wrap: balance; line-height: 1.5; }
/* User-requested brand arrow: straight stem, softly curved head tips. */
.editorial-arrow {
  display: block;
  flex: none;
  width: 28px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 220ms cubic-bezier(.22,1,.36,1);
}
#main #for-you.pain-section {
  scroll-margin-top: 110px;
  background:
    linear-gradient(rgb(250 239 221 / .3), rgb(250 239 221 / .3)),
    #f5e7d2 url("imgs/generated/dari-hero-hidden-current-20261012/background/DARI-HERO-SEC-HIDDEN-CURRENT-20261012-BG.webp") center / cover no-repeat;
}
/* Unscoped gesture rules also work on Safari versions without CSS @scope. */
#main #for-you .card-track {
  touch-action: pan-x pan-y pinch-zoom;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: none;
  padding-bottom: 88px;
}
#main #for-you .card-track.is-dragging { cursor: grabbing; user-select: none; }
#main #for-you .card-glint { width: 11px; height: 11px; opacity: 1; }
#main #for-you .slider-arrow { width: 28px; height: 21px; stroke-width: 1.2; }
#main #for-you .card-face-wine { clip-path: inset(0 var(--reveal-right,100%) 0 var(--reveal-left,0%)); }
.hc-current-window { opacity: 0; transition: opacity 1600ms cubic-bezier(.22,1,.36,1); }
.hc-scene.is-light-ready .hc-current-window { opacity: .28; }
#main #for-you .icon-button {
  width: 48px;
  height: 48px;
  border-color: rgb(143 98 49 / .4);
  background: rgb(255 248 232 / .5);
}
#main #for-you .slider-controls { grid-template-columns: 48px 38px minmax(60px,1fr) 48px; }
#main #modes .modes-background img,
#main #modes .figma-background {
  filter: blur(1.4px);
  transform: scale(1.006);
}
#main #modes, #main #work { scroll-margin-top: 110px; }
#main #work.approach-section { position: relative; isolation: isolate; }
#main #work .approach-grid { position: relative; z-index: 1; }
#main #work .process-map::before { content: none; }
#main #work > .approach-current {
  position: absolute;
  z-index: 0;
  top: 9%;
  left: -8%;
  width: 116%;
  height: 85%;
  max-width: none;
  object-fit: cover;
  pointer-events: none;
  opacity: .23;
  filter: saturate(.38) blur(7px);
  mask-image: linear-gradient(transparent, black 18% 80%, transparent);
  -webkit-mask-image: linear-gradient(transparent, black 18% 80%, transparent);
}
#main #work > .approach-video {
  position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%;
  object-fit: cover; pointer-events: none; opacity: 0; mix-blend-mode: soft-light;
  filter: saturate(.45) blur(4px); transition: opacity 1800ms ease;
  mask-image: linear-gradient(transparent,black 20% 80%,transparent);
  -webkit-mask-image: linear-gradient(transparent,black 20% 80%,transparent);
}
#main #work > .approach-video.is-ready { opacity: .38; }
body.hc-reference-scene .site-header, body.hc-reference-scene .hc-copy, body.hc-reference-scene .hc-note { visibility: hidden; }
@media (hover:hover) {
  .hc-cta:hover .editorial-arrow { transform: translate(2px,-1px); }
  #main #for-you .icon-button:hover { background: #fff8ed; border-color: #986f3e; }
}
@media (min-width:901px) {
  body[data-hero-scene="hidden-current"] .site-header .nav-links { display: flex; }
}
@media (max-width:900px) {
  body[data-hero-scene="hidden-current"] .site-header { top: 20px; left: 24px; right: 24px; min-height:60px; padding: 8px; display: grid; grid-template-columns:78px minmax(0,1fr) 78px; color:#f7e3ca; }
  body[data-hero-scene="hidden-current"] .site-header:not(.is-scrolled) { color:#f7e3ca; background:transparent; border-color:transparent; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
  body[data-hero-scene="hidden-current"] .site-header .brand { grid-column:2; grid-row:1; justify-self:center; margin:0; color:inherit; }
  body[data-hero-scene="hidden-current"] .site-header > .button { grid-column:3; grid-row:1; justify-self:end; min-height:44px; height:44px; padding:0 15px; }
  body[data-hero-scene="hidden-current"] .nav-toggle {
    display: grid; place-items: center; flex: none; width: 44px; height: 44px;
    padding: 10px; border: 0; color: #f7e3ca; background: transparent; grid-column:1; grid-row:1;
  }
  body[data-hero-scene="hidden-current"] .site-header.is-scrolled .nav-toggle { color: #f7e3ca; }
  body[data-hero-scene="hidden-current"] .nav-toggle-bars { display: block; position: relative; width: 20px; height: 14px; }
  body[data-hero-scene="hidden-current"] .nav-toggle-bars span { display: block; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: currentColor; transition: transform 180ms ease, opacity 180ms ease; }
  body[data-hero-scene="hidden-current"] .nav-toggle-bars span:nth-child(2) { top: 6px; }
  body[data-hero-scene="hidden-current"] .nav-toggle-bars span:nth-child(3) { top: 12px; }
  body[data-hero-scene="hidden-current"] .site-header.nav-open .nav-toggle-bars span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  body[data-hero-scene="hidden-current"] .site-header.nav-open .nav-toggle-bars span:nth-child(2) { opacity: 0; }
  body[data-hero-scene="hidden-current"] .site-header.nav-open .nav-toggle-bars span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
  body[data-hero-scene="hidden-current"] .site-header .nav-links {
    position: absolute; display: grid; top: calc(100% + 8px); left: 0; right: 0;
    width: auto; margin: 0; padding: 18px; gap: 0;
    border: 1px solid rgb(185 144 88 / .35); border-radius: 18px;
    background: #3a0317; color: #f7e3ca; box-shadow: 0 16px 32px rgb(58 3 23 / .18);
    opacity: 1; visibility: hidden; pointer-events: none;
    transform-origin: center top;
    transform: translateY(-8px) scale(.97);
    clip-path: inset(0 0 100% 0 round 18px);
    transition: clip-path 420ms cubic-bezier(.32,.72,0,1), transform 420ms cubic-bezier(.32,.72,0,1), visibility 0s 420ms;
  }
  body[data-hero-scene="hidden-current"] .site-header.nav-open .nav-links {
    visibility: visible; pointer-events: auto; transform: none;
    clip-path: inset(0 0 0 0 round 18px); transition-delay: 0s;
  }
  body[data-hero-scene="hidden-current"] .site-header .nav-links a { display: flex; align-items: center; min-height: 44px; font-size: 12px; }
  .mobile-apply { display: none !important; }
  .hc-visual { order:0; height:auto; aspect-ratio:752 / 800; margin-bottom:-28px; background:#383026; mask-image:linear-gradient(black 0 77%,transparent 100%); -webkit-mask-image:linear-gradient(black 0 77%,transparent 100%); }
  .hc-visual .hc-layer { top:0; left:0; width:100%; height:100%; }
  .hc-visual .hc-wine { display:none; }
  .hc-portrait > img { object-fit:cover; object-position:center top; }
  .hc-current-window { left:auto; right:0; top:38%; width:17%; height:62%; }
  .hc-copy { order:1; padding:32px 26px 42px; }
  #top .hc-copy h1 { font-size:36px; line-height:1.08; }
  .hc-note { position:absolute; top:calc((100vw - 28px) * .73); left:24px; width:190px; min-height:0; margin:0; padding:12px 14px; color:#f7e3ca; background:rgb(58 3 23 / .36); border-radius:14px; }
  .hc-note-label { color:#dabd89; }
  #top .hc-note p { font-size:15px; text-wrap:balance; }
  .hc-scene.is-light-ready .hc-current-window { opacity:.07; }
  .hc-current { transform:scale(1.015); }
  #main #work > .approach-current { top:8%; left:-40%; width:180%; height:88%; opacity:.16; object-fit:fill; }
}
@media (prefers-reduced-motion:reduce) {
  body[data-hero-scene="hidden-current"] .site-header .nav-links { transition:none; }
}
@media (max-width:380px) {
  body[data-hero-scene="hidden-current"] .site-header { left:22px; right:22px; gap:4px; padding-inline:8px; grid-template-columns:68px minmax(0,1fr) 68px; }
  body[data-hero-scene="hidden-current"] .site-header > .button { padding-inline: 17px; }
}
@media (prefers-reduced-motion:reduce) {
  .editorial-arrow, body[data-hero-scene="hidden-current"] .nav-toggle-bars span { transition: none; }
  .hc-current-window { transition:none; }
  #main #work > .approach-video { display:none; }
}
