/* PRODUCTS INDEX V3 ------------------------------------------------------- */
.products-compare-v3{--pc-paper:#f2efe7;--pc-ink:#18231d;--pc-green:#10362b;--pc-line:#bdc2bb;--pc-warm:#b69b58;scroll-behavior:smooth;}
.products-compare-v3 .products-hero-v3{
  background:var(--pc-paper);color:var(--pc-ink);
  padding:clamp(52px,6vw,84px) clamp(28px,5vw,82px) 0;
  border-bottom:1px solid #c3c7c0;
}
.products-hero-copy-v3{max-width:850px;padding-bottom:clamp(34px,4.5vw,56px);}
.products-hero-copy-v3 h1{
  margin:10px 0 18px;max-width:760px;
  font-size:clamp(48px,5vw,72px);line-height:.94;letter-spacing:-.045em;color:#15221b;
}
.products-hero-copy-v3 p{margin:0;max-width:700px;font-size:16px;line-height:1.62;color:#647069;}

/* A continuous index rail rather than six boxed cards. */
.portfolio-index-v3{
  position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));
  margin:0 clamp(-82px,-5vw,-28px);padding:0 clamp(28px,5vw,82px);
  border-top:1px solid #bbc0b9;
}
.portfolio-index-v3:after{content:"";position:absolute;left:clamp(28px,5vw,82px);right:clamp(28px,5vw,82px);bottom:0;height:1px;background:#c4c8c2;}
.portfolio-index-v3 a{
  position:relative;min-width:0;padding:16px 14px 17px 0;text-decoration:none;color:#1c2922;
  display:grid;grid-template-columns:26px 1fr;grid-template-rows:auto auto;column-gap:7px;align-content:center;
}
.portfolio-index-v3 a+a{padding-left:14px;}
.portfolio-index-v3 a:before{
  content:"";position:absolute;left:0;right:14px;bottom:0;height:2px;background:var(--pc-warm);
  transform:scaleX(0);transform-origin:left;transition:transform .38s cubic-bezier(.2,.72,.18,1);
  z-index:1;
}
.portfolio-index-v3 a+a:before{left:14px;}
.portfolio-index-v3 span{grid-row:1/3;font:9px ui-monospace,SFMono-Regular,Menlo,monospace;color:#7d8680;transition:transform .36s cubic-bezier(.2,.72,.18,1),color .28s ease;}
.portfolio-index-v3 strong{font-size:13px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.portfolio-index-v3 small{margin-top:3px;font:8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.055em;text-transform:uppercase;color:#808983;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
@media (hover:hover){
  .portfolio-index-v3 a:hover:before{transform:scaleX(1)}
  .portfolio-index-v3 a:hover span{transform:translateX(3px);color:#725f34}
}

.portfolio-compare-v3{
  background:linear-gradient(115deg,#0d2b23,#12382d 58%,#0f3027);color:#f3f6f2;
  padding:clamp(58px,6.5vw,92px) clamp(28px,5vw,82px) clamp(62px,7vw,100px);
  scroll-margin-top:90px;
}
.compare-head-v3{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(360px,1.2fr);gap:clamp(40px,7vw,110px);align-items:end;margin-bottom:30px;}
.compare-head-v3 .kicker{color:#aab7ae}.compare-head-v3 h2{margin:8px 0 0;font-size:clamp(38px,4vw,58px);line-height:.98;letter-spacing:-.04em;color:#f7f8f5;}
.compare-head-v3 p{margin:0;justify-self:end;max-width:650px;font-size:14px;line-height:1.65;color:#bdc9c1;}
.compare-scroll-v3{overflow-x:auto;scrollbar-width:thin;padding-bottom:2px;}
.compare-matrix-v3{min-width:1390px;border-top:1px solid rgba(255,255,255,.24);}
.compare-header-v3,.compare-row-v3{display:grid;grid-template-columns:minmax(275px,1.32fr) minmax(165px,.72fr) minmax(205px,.86fr) minmax(115px,.48fr) minmax(220px,.92fr) minmax(225px,.96fr) 20px;gap:18px;align-items:center;}
.compare-header-v3{min-height:48px;border-bottom:1px solid rgba(255,255,255,.22);font:8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:#91a197;}
.compare-row-v3{
  position:relative;min-height:88px;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.15);
  color:#e6ede8;text-decoration:none;transition:background-color .36s ease;
}
.compare-row-v3:before{content:"";position:absolute;left:-14px;top:0;bottom:0;width:2px;background:#b9a260;transform:scaleY(0);transform-origin:center;transition:transform .34s cubic-bezier(.2,.72,.18,1);}
.compare-row-v3>span{font-size:12px;line-height:1.45;color:#c4cfc8;}
.compare-product-v3{display:grid!important;grid-template-columns:28px 1fr;gap:11px;align-items:center;color:#f4f7f3!important;}
.compare-product-v3>b{font:9px ui-monospace,SFMono-Regular,Menlo,monospace;color:#b9a566;font-weight:500;transition:transform .34s cubic-bezier(.2,.72,.18,1);}
.compare-product-v3 strong{display:block;font-size:16px;line-height:1.2;}
.compare-product-v3 small{display:block;margin-top:4px;font:8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.055em;text-transform:uppercase;color:#8fa097;}
.compare-row-v3 i{font-style:normal;font-size:17px;color:#aab8ae;transition:transform .34s cubic-bezier(.2,.72,.18,1),color .25s ease;}
@media (hover:hover){
  .compare-row-v3:hover{background:rgba(255,255,255,.033)}
  .compare-row-v3:hover:before{transform:scaleY(1)}
  .compare-row-v3:hover .compare-product-v3>b{transform:translateX(4px)}
  .compare-row-v3:hover i{transform:translate(3px,-2px);color:#d6c884}
}

.products-next-v3{background:#ebe6dc;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #bec3bc;border-bottom:1px solid #bec3bc;padding:0 clamp(28px,5vw,82px);}
.products-next-v3 a{min-height:92px;padding:17px 22px 16px 0;color:#1c2922;text-decoration:none;border-right:1px solid #c4c8c2;display:grid;align-content:center;gap:4px;}
.products-next-v3 a+a{padding-left:22px}.products-next-v3 a:last-child{border-right:0}.products-next-v3 small{font:8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:#7b847e}.products-next-v3 strong{font-size:17px}.products-next-v3 span{font-size:10px;color:#5d6962;transition:transform .3s ease;}@media (hover:hover){.products-next-v3 a:hover span{transform:translateX(3px)}}

@media (max-width:980px){
  .portfolio-index-v3{grid-template-columns:repeat(3,1fr)}
  .portfolio-index-v3 a:nth-child(-n+3){border-bottom:1px solid #c4c8c2}
  .compare-head-v3{grid-template-columns:1fr;gap:18px}.compare-head-v3 p{justify-self:start}
  .products-next-v3{grid-template-columns:1fr;padding:0 28px}.products-next-v3 a,.products-next-v3 a+a{padding-left:0;border-right:0;border-bottom:1px solid #c4c8c2}.products-next-v3 a:last-child{border-bottom:0}
}
@media (max-width:620px){
  .products-hero-copy-v3 h1{font-size:46px}.products-hero-copy-v3 p{font-size:15px}
  .portfolio-index-v3{grid-template-columns:repeat(2,1fr)}
  .portfolio-index-v3 a:nth-child(-n+4){border-bottom:1px solid #c4c8c2}
  .portfolio-index-v3 a:nth-child(3){border-bottom:1px solid #c4c8c2}
}

.compare-apps-v6{font-size:11px!important;line-height:1.45!important;color:#d4ddd7!important;}

/* Comparison-page next actions: same choreography as individual product pages,
   different light-at-rest color treatment. */
.products-next-v3 a{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  grid-template-columns:1fr auto!important;
  grid-template-rows:auto auto auto!important;
  gap:4px 18px!important;
  transition:color .32s ease,background-color .32s ease!important;
}
.products-next-v3 a:before{
  content:"";
  position:absolute;
  inset:0;
  background:#174437;
  transform:translateY(102%);
  transition:transform .42s cubic-bezier(.16,.76,.18,1);
  z-index:-1;
}
.products-next-v3 a small,
.products-next-v3 a strong,
.products-next-v3 a .next-detail-v6{grid-column:1;}
.products-next-v3 a i{
  grid-column:2;
  grid-row:1/4;
  align-self:center;
  font-style:normal;
  font-size:18px;
  color:#34483e;
  transition:transform .35s cubic-bezier(.2,.75,.2,1),color .3s ease;
}
.products-next-v3 a small{transition:color .3s ease;}
.products-next-v3 a .next-detail-v6{transition:color .3s ease!important;transform:none!important;}
@media (hover:hover){
  .products-next-v3 a:hover{color:#f5f7f3;}
  .products-next-v3 a:hover:before{transform:translateY(0);}
  .products-next-v3 a:hover small{color:#c6d4cb;}
  .products-next-v3 a:hover .next-detail-v6{color:#d4ded8!important;transform:none!important;}
  .products-next-v3 a:hover i{transform:translate(5px,-4px);color:#f4f7f3;}
}

/* V7: let each next-action anchor own the full visual cell so the hover sweep
   reaches edge-to-edge. Content alignment stays inset inside the cells. */
.products-next-v3{
  padding:0!important;
}
.products-next-v3 a{
  padding-top:17px!important;
  padding-bottom:16px!important;
  padding-right:clamp(24px,2.5vw,42px)!important;
  padding-left:clamp(24px,2.5vw,42px)!important;
}
.products-next-v3 a:first-child{
  padding-left:clamp(28px,5vw,82px)!important;
}
.products-next-v3 a:last-child{
  padding-right:clamp(28px,5vw,82px)!important;
}
@media (max-width:980px){
  .products-next-v3{padding:0!important;}
  .products-next-v3 a,
  .products-next-v3 a+a{
    padding-left:28px!important;
    padding-right:28px!important;
  }
}