/* CP Featured Duo — CSS scoped to section */
.cp-fd{--cp-fd-bg:#f5f6f8;--cp-fd-heading:#171d30;--cp-fd-text:#616a78;--cp-fd-accent:#346de3;position:relative;isolation:isolate;padding:clamp(52px,6vw,100px) 0;color:var(--cp-fd-heading);font-family:inherit;}
.cp-fd::before{content:"";position:absolute;z-index:-1;inset:0;left:50%;width:100vw;transform:translateX(-50%);background:var(--cp-fd-bg);pointer-events:none}
.cp-fd,.cp-fd *{box-sizing:border-box}
.cp-fd__inner{max-width:1500px;margin:0 auto;padding:0 clamp(14px,3vw,34px)}
.cp-fd__header{margin:0 0 clamp(24px,3vw,38px);max-width:900px}
.cp-fd__eyebrow{font-size:12px;font-weight:750;letter-spacing:.15em;text-transform:uppercase;color:var(--cp-fd-accent);margin:0 0 10px}
.cp-fd__header h2{font-family:inherit;line-height:1.12;letter-spacing:-.025em;font-size:clamp(29px,3.6vw,52px);font-weight:750;color:var(--cp-fd-heading);margin:0 0 12px}
.cp-fd__intro{font-size:clamp(15px,1.2vw,18px);line-height:1.65;color:var(--cp-fd-text);margin:0;max-width:780px}
.cp-fd__grid{display:grid;grid-template-columns:repeat(2,minmax(0,460px));justify-content:center;gap:clamp(16px,2vw,28px);align-items:stretch}
.cp-fd__card{min-width:0;overflow:hidden;border-radius:18px;border:1px solid color-mix(in srgb,var(--cp-fd-heading) 12%,transparent);background:#fff;color:#171d30;display:flex;flex-direction:column;box-shadow:0 10px 28px rgba(21,30,53,.035)}
.cp-fd__media{position:relative;display:block;aspect-ratio:var(--cp-fd-media-ratio,4 / 3);overflow:hidden;background:#f1f1f1;color:inherit;text-decoration:none}
.cp-fd__image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;display:block;transition:opacity .3s ease,transform .45s ease}
.cp-fd__image--hover{opacity:0}
.cp-fd__media:hover .cp-fd__image--hover,.cp-fd__media:focus-visible .cp-fd__image--hover{opacity:1}
.cp-fd__media:hover .cp-fd__image--main,.cp-fd__media:focus-visible .cp-fd__image--main{transform:scale(1.025)}
.cp-fd__media:hover .cp-fd__image--main:has(+ .cp-fd__image--hover),.cp-fd__media:focus-visible .cp-fd__image--main:has(+ .cp-fd__image--hover){opacity:0}
.cp-fd__placeholder{position:absolute;inset:0;background:linear-gradient(120deg,#f0f0f0,#fafafa)}
.cp-fd__image-label{position:absolute;right:18px;bottom:18px;background:#fff;color:#17213a;padding:10px 13px;border-radius:99px;font-size:11px;font-weight:750;letter-spacing:.04em;display:flex;align-items:center;gap:10px}
.cp-fd__image-label span{font-size:16px}
.cp-fd__content{padding:clamp(19px,2vw,28px);flex:1;display:flex;flex-direction:column;gap:20px}
.cp-fd__content-top{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;flex:1}
.cp-fd__content h3{font:inherit;font-size:clamp(22px,2.2vw,31px);line-height:1.2;letter-spacing:-.018em;font-weight:750;color:#171d30;margin:0 0 8px}
.cp-fd__subtitle{font-size:16px;line-height:1.5;font-weight:600;color:#232b3b;margin:0 0 10px}
.cp-fd__detail{font-size:14px;line-height:1.65;color:#656e7d;margin:0}
.cp-fd__price{text-align:right;display:flex;flex-direction:column;gap:4px;white-space:nowrap;font-size:14px;color:#6b7280;flex-shrink:0}
.cp-fd__price span{font-size:11px}
.cp-fd__price strong{font-size:clamp(17px,1.5vw,20px);font-weight:750;color:#171d30}
.cp-fd__price strong *{color:inherit}
.cp-fd__cta{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;border-radius:8px;background:#17191d;color:#fff!important;font-size:13px;font-weight:750;letter-spacing:.03em;padding:16px 20px;text-decoration:none!important;transition:background .2s ease,transform .2s ease}
.cp-fd__cta:hover,.cp-fd__cta:focus-visible{background:var(--cp-fd-accent);color:#fff!important}
.cp-fd__cta span{font-size:19px;line-height:1}
@media(max-width:760px){.cp-fd{padding:48px 0}.cp-fd__inner{padding:0 12px}.cp-fd__grid{grid-template-columns:1fr;gap:18px}.cp-fd__header{margin-bottom:25px}.cp-fd__card{border-radius:13px}.cp-fd__content{padding:18px}.cp-fd__content-top{flex-wrap:wrap;gap:8px}.cp-fd__price{text-align:left}.cp-fd__price strong{font-size:19px}.cp-fd__media{aspect-ratio:var(--cp-fd-media-ratio,4 / 3)}.cp-fd__image-label{bottom:12px;right:12px}.cp-fd__cta{padding:15px 17px}}
@media(prefers-reduced-motion:reduce){.cp-fd__image,.cp-fd__cta{transition:none}}

/* RC2: shared image geometry; preserve source composition and keep both cards symmetrical. */
.cp-fd__media { aspect-ratio:var(--cp-fd-media-ratio,4 / 3); }
.cp-fd__image { object-fit:contain; }
.cp-fd__new-badge {
 position:absolute; top:16px; left:16px; z-index:4; width:83px; height:83px;
 border-radius:50%; background:#D52E32; color:#fff; display:flex;
 align-items:center; justify-content:center; padding:8px; text-align:center;
 font:800 11px/1.15 inherit; font-family:inherit; font-size:11px;
 font-weight:800; letter-spacing:.035em; box-shadow:0 4px 16px rgba(0,0,0,.1);
 pointer-events:none;
}
@media (max-width:760px) { .cp-fd__new-badge {width:66px;height:66px;top:12px;left:12px;font-size:9px;} }

/* RC3: media fully visible, symmetrical and compact; no duplicate image CTA. */
.cp-fd__media {
  width:100%;
  max-height:none;
  height:auto;
  background:#f3f3f3;
}
.cp-fd__image {
  object-fit:contain;
  object-position:50% 50%;
}
.cp-fd__image-label{display:none!important}
.cp-fd__content { gap:14px; }
.cp-fd__content-top { flex:1 1 auto; }
.cp-fd__cta { flex:0 0 auto; min-height:50px; flex-direction:row; }
@media(max-width:760px){
 .cp-fd__media {max-height:none;}
 .cp-fd__content {gap:14px;}
}

/* RC4: portrait-preserving layout without clipped garment hems/sleeves. */
.cp-fd__grid{max-width:calc(920px + clamp(16px,2vw,28px));margin-inline:auto;}
.cp-fd__media{aspect-ratio:var(--cp-fd-media-ratio,3 / 4);height:auto;max-height:none;min-height:0;}
.cp-fd__image{width:100%;height:100%;object-fit:contain;object-position:center center;}
@media(max-width:760px){
 .cp-fd__grid{grid-template-columns:minmax(0,1fr);max-width:520px;margin-inline:auto;}
 .cp-fd__media{max-height:none;}
}


/* RC5 — Editorial overlap: bottom of trousers concealed by the information panel.
   No crop of the actual source photograph; the image remains centered/contained. */
.cp-fd .cp-fd__grid {
  grid-template-columns:repeat(2,minmax(0,510px));
  max-width:calc(1020px + clamp(16px,2vw,28px));
  gap:clamp(16px,2vw,28px);
}
.cp-fd .cp-fd__card {
  overflow:visible;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.cp-fd .cp-fd__media {
  z-index:0;
  isolation:isolate;
  overflow:hidden;
  border-radius:20px;
  background:transparent;
  aspect-ratio:var(--cp-fd-media-ratio,3 / 4);
}
.cp-fd .cp-fd__image { object-fit:contain; object-position:center center; }
.cp-fd .cp-fd__content {
  position:relative;
  z-index:2;
  margin-top:-62px;
  padding:clamp(20px,2vw,28px);
  background:#fff;
  border:1px solid rgba(23,29,48,.10);
  border-radius:22px;
  box-shadow:0 12px 32px rgba(23,29,48,.085);
  flex:1 1 auto;
}
.cp-fd .cp-fd__content-top { flex:1 1 auto; }
.cp-fd .cp-fd__new-badge { z-index:3; }
@media (max-width:760px) {
  .cp-fd .cp-fd__grid {grid-template-columns:minmax(0,1fr);max-width:540px;}
  .cp-fd .cp-fd__content {margin-top:-38px;padding:18px;border-radius:18px;}
  .cp-fd .cp-fd__media {border-radius:17px;}
}

/* RC6: hover image appears only after its first on-demand desktop download completes. */
@media(hover:hover) and (pointer:fine) {
 .cp-fd__media:hover .cp-fd__image--hover:not(.cp-fd__hover-ready),
 .cp-fd__media:focus-visible .cp-fd__image--hover:not(.cp-fd__hover-ready){opacity:0!important}
 .cp-fd__media:hover .cp-fd__image--main:has(+ .cp-fd__image--hover:not(.cp-fd__hover-ready)),
 .cp-fd__media:focus-visible .cp-fd__image--main:has(+ .cp-fd__image--hover:not(.cp-fd__hover-ready)){opacity:1!important}
}
@media(hover:none),(pointer:coarse) { .cp-fd__image--hover{display:none!important} }
