/* ============================================================
   PRIMEWOOD FENCES — Oakâme-blended UI layer
   Soft rounded media · range index · accordion · discover pills
   Loaded last; overrides earlier sheets.
   ============================================================ */

:root{ --radius:12px; --radius-lg:18px; }

/* ---------- soften media (Oakâme rounded corners) ---------- */
.prow__media,.species,.species__img,.shot,.mosaic figure,
.prod__media .m,.shape__chip,.range__preview{border-radius:var(--radius)}
.feature{border-radius:var(--radius-lg)}
.species{overflow:hidden}
.species__img{border-radius:var(--radius) var(--radius) 0 0}
.media-reveal{border-radius:inherit}
/* ensure radius wins for elements carrying both classes (parent not rounded) */
.shot.media-reveal,.prow__media.media-reveal,.shape__chip.media-reveal{border-radius:var(--radius)}
.lightbox img{border-radius:var(--radius)}
.prow__media .idx{border-radius:100px}
.btn{border-radius:100px}

/* gentle lift on cards */
.species{transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s}
.species:hover{transform:translateY(-4px);box-shadow:0 26px 50px -30px rgba(33,30,24,.45)}

/* ---------- DISCOVER pill (replaces some arrow-links) ---------- */
.discover{display:inline-flex;align-items:center;gap:.6em;height:42px;padding:0 8px 0 20px;
  border:1px solid var(--line);border-radius:100px;font-size:13px;font-weight:600;letter-spacing:.01em;
  color:var(--ink);background:transparent;transition:background .35s,color .35s,border-color .35s}
.discover .d-ar{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;
  background:var(--ink);color:var(--paper);transition:background .35s,transform .45s cubic-bezier(.16,1,.3,1)}
.discover .d-ar svg{width:13px;height:13px}
.discover:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.discover:hover .d-ar{background:var(--paper);color:var(--ink);transform:translateX(3px)}

/* ============================================================
   RANGE INDEX (Oakâme "Nos catégories" hover-reveal)
   ============================================================ */
.range{padding-block:var(--sec);background:var(--paper)}
.range__head{margin-bottom:clamp(32px,5vw,56px)}
.range__head .eyebrow{margin-bottom:18px}
.range__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(36px,6vw,90px);align-items:start}
.range__list{list-style:none}
.range__row{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:22px;
  padding:clamp(20px,2.4vw,30px) 4px;border-top:1px solid var(--line);cursor:pointer;
  transition:padding-left .45s cubic-bezier(.16,1,.3,1),opacity .35s}
.range__list .range__row:last-child{border-bottom:1px solid var(--line)}
.range__row .rn{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--ink-3)}
.range__row .rt{font-family:var(--serif);font-weight:400;font-size:clamp(1.25rem,2.2vw,1.85rem);
  letter-spacing:-0.01em;transition:color .35s}
.range__row .rc{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-3);padding:5px 11px;border:1px solid var(--line);border-radius:100px}
.range__row .rar{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);display:flex;
  align-items:center;justify-content:center;transition:background .4s,border-color .4s,transform .45s cubic-bezier(.16,1,.3,1)}
.range__row .rar svg{width:13px;height:13px;transition:transform .4s}
/* hover / active */
.range__row:hover,.range__row.active{padding-left:18px}
.range__row:hover .rt,.range__row.active .rt{color:var(--wood)}
.range__row:hover .rar,.range__row.active .rar{background:var(--wood);border-color:var(--wood);color:#fff;transform:translateX(2px)}
.range:has(.range__row:hover) .range__row:not(:hover){opacity:.5}

/* sticky preview */
.range__preview{position:sticky;top:120px;aspect-ratio:4/5;overflow:hidden;background:var(--paper-3)}
.range__preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;
  transform:scale(1.06);transition:opacity .6s ease,transform 1.1s cubic-bezier(.16,1,.3,1)}
.range__preview img.show{opacity:1;transform:scale(1)}
.range__preview .rcap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px 22px 20px;color:#fff;
  background:linear-gradient(to top,rgba(18,15,10,.72),rgba(18,15,10,0));pointer-events:none}
.range__preview .rcap .t{font-family:var(--serif);font-size:1.25rem}
.range__preview .rcap .m{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.8);margin-top:5px}

@media (max-width:880px){
  .range__grid{grid-template-columns:1fr}
  .range__preview{display:none}
  .range__row{grid-template-columns:auto 1fr auto}
  .range__row .rc{display:none}
}

/* ============================================================
   ACCORDION (Oakâme expandable info blocks)
   ============================================================ */
.workwith{background:var(--paper-2);padding-block:var(--sec)}
.workwith__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(36px,6vw,90px);align-items:start}
.workwith__intro .eyebrow{margin-bottom:18px}
.workwith__intro p{margin-top:20px;font-size:15.5px;line-height:1.7}
.acc{border-top:1px solid var(--line)}
.acc__item{border-bottom:1px solid var(--line)}
.acc__head{width:100%;background:none;border:0;cursor:pointer;text-align:left;display:flex;align-items:center;
  justify-content:space-between;gap:24px;padding:clamp(22px,2.5vw,30px) 4px;color:var(--ink);font-family:inherit}
.acc__head .at{font-family:var(--serif);font-weight:400;font-size:clamp(1.2rem,2vw,1.6rem);letter-spacing:-0.01em}
.acc__ic{position:relative;width:20px;height:20px;flex:none}
.acc__ic::before,.acc__ic::after{content:"";position:absolute;background:var(--ink);transition:transform .4s cubic-bezier(.16,1,.3,1),opacity .4s}
.acc__ic::before{top:9px;left:0;width:20px;height:1.5px}
.acc__ic::after{top:0;left:9px;width:1.5px;height:20px}
.acc__item.open .acc__ic::after{transform:scaleY(0)}
.acc__item.open .acc__head .at{color:var(--wood)}
.acc__body{overflow:hidden;max-height:0;transition:max-height .5s cubic-bezier(.16,1,.3,1)}
.acc__body p{padding:0 4px clamp(22px,2.4vw,28px);font-size:15px;line-height:1.7;max-width:60ch}
@media (max-width:880px){.workwith__grid{grid-template-columns:1fr;gap:34px}}