/* RIVISTA template styles: page-index-diagonal.php */
.dg-hero{position:relative;height:calc(100vh - 96px);min-height:640px;max-height:940px;overflow:hidden;background:var(--ink)}
.dg-pane{position:absolute;inset:0;overflow:hidden}
.dg-pane img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dg-pane.one{clip-path:polygon(0 0,62% 0,38% 100%,0 100%)}
.dg-pane.two{clip-path:polygon(62% 0,100% 0,100% 100%,38% 100%)}
.dg-pane .veil{position:absolute;inset:0;background:rgba(20,19,15,.4);transition:background .5s var(--ease)}
.dg-pane:hover .veil{background:rgba(20,19,15,.18)}
.dg-pane .lbl{position:absolute;z-index:3;color:var(--paper);font-family:var(--display)}
.dg-pane.one .lbl{left:6%;top:50%;transform:translateY(-50%)}
.dg-pane.two .lbl{right:6%;bottom:14%;text-align:right}
.dg-pane .lbl .cat{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;opacity:.85;margin-bottom:10px}
.dg-pane .lbl h3{font-size:clamp(30px,3.6vw,56px);font-weight:700;line-height:.95;letter-spacing:-.03em;margin:0 0 16px}
.dg-pane .lbl h3 i{font-family:var(--serif);font-style:italic;font-weight:400}
.dg-pane .lbl a{display:inline-flex;align-items:center;gap:9px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--paper);border-bottom:1px solid var(--paper);padding-bottom:5px}
.dg-pane .lbl a svg{width:12px;height:12px}
.dg-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:5;text-align:center;color:var(--paper);pointer-events:none;width:100%}
.dg-center .eyebrow{font-family:var(--display);font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;margin-bottom:16px;opacity:.92}
.dg-center h1{font-family:var(--display);font-weight:700;font-size:clamp(44px,6vw,104px);line-height:.9;letter-spacing:-.04em;margin:0;text-shadow:0 2px 40px rgba(0,0,0,.4)}
.dg-center h1 i{font-family:var(--serif);font-style:italic;font-weight:400}
@media(max-width:760px){.dg-hero{height:auto;min-height:0;display:flex;flex-direction:column}.dg-pane{position:relative;clip-path:none!important;height:50vh;inset:auto}.dg-pane.one .lbl,.dg-pane.two .lbl{left:24px;right:24px;bottom:24px;top:auto;transform:none;text-align:left}.dg-center{display:none}}

/* CRAFT III — index-diagonal: Diagonal Drift */
@keyframes dgDrift{from{transform:translate(0,0) scale(1.04)}to{transform:translate(-7px,9px) scale(1.04)}}
.dg-pane.one img{animation:dgDrift 18s cubic-bezier(.22,1,.36,1) infinite alternate}
.dg-pane.two img{animation:dgDrift 18s cubic-bezier(.22,1,.36,1) infinite alternate-reverse}
@media (prefers-reduced-motion: reduce){
  .dg-pane.one img,
  .dg-pane.two img{animation:none;transform:none}
}

/* ============================================================
   index-diagonal · below the hero (dg2-*)
   02 Summer / Winter contrast · 03 Fibre table · products · dual CTA
   ============================================================ */

/* ---- numbered section head ---- */
.dg2-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.62fr);gap:14px clamp(32px,5vw,88px);align-items:end;margin-bottom:clamp(48px,5.5vw,76px)}
.dg2-head .num{grid-column:1;grid-row:1;font-family:var(--display);font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--ink)}
.dg2-head .num .dot{color:var(--terra)}
.dg2-head h2{grid-column:1;grid-row:2;margin:0;font-family:var(--display);font-weight:700;font-size:clamp(38px,5vw,72px);line-height:.94;letter-spacing:-.035em;color:var(--ink)}
.dg2-head h2 i{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em;color:var(--ink-3)}
.dg2-lede{grid-column:2;grid-row:1/3;align-self:end;margin:0;padding-bottom:8px;font-family:var(--sans);font-size:15px;line-height:1.65;color:var(--ink-2);max-width:42ch}

/* ---- 02 · Summer / Winter, divided by a slanted hairline ---- */
.dg2-contrast{padding:clamp(80px,8.5vw,112px) 0 clamp(72px,7vw,104px);background:var(--paper)}
.dg2-cols{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 clamp(112px,13vw,200px);align-items:start}
/* the seam is kept short enough that, at 12deg, both ends stay inside the gutter */
.dg2-seam{position:absolute;left:50%;top:50%;width:1px;height:clamp(360px,36vw,520px);margin-left:-.5px;background:var(--ink);transform:translateY(-50%) rotate(12deg);transform-origin:50% 50%;pointer-events:none}
.dg2-seam::before,.dg2-seam::after{content:"";position:absolute;left:-2px;width:5px;height:5px;border-radius:50%;background:var(--terra)}
.dg2-seam::before{top:-2px}
.dg2-seam::after{bottom:-2px}
.dg2-or{position:absolute;left:50%;top:50%;z-index:1;width:56px;height:56px;margin:-28px 0 0 -28px;display:flex;align-items:center;justify-content:center;border:1px solid var(--ink);border-radius:50%;background:var(--paper);font-family:var(--serif);font-style:italic;font-size:24px;line-height:1;color:var(--ink);pointer-events:none}
.dg2-col{position:relative;min-width:0}
.dg2-summer .dg2-season h3{letter-spacing:-.055em}
.dg2-winter{padding-top:clamp(140px,16vw,220px)}
.dg2-season{margin-bottom:34px}
.dg2-tag{display:flex;align-items:center;gap:10px;margin-bottom:14px;font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3)}
.dg2-tag::before{content:"";width:22px;height:1px;background:var(--terra);flex:none}
.dg2-season h3{margin:0;font-family:var(--display);font-weight:700;font-size:clamp(68px,9.4vw,140px);line-height:.86;letter-spacing:-.05em;color:var(--ink)}
.dg2-season h3 i{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.02em}
.dg2-list{margin:0;padding:0;list-style:none;border-top:1px solid var(--ink)}
.dg2-list li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:0 16px;padding:22px 0 24px;border-bottom:1px solid var(--line)}
.dg2-n{padding-top:6px;font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--ink-3)}
.dg2-list b{display:block;margin-bottom:6px;font-family:var(--display);font-weight:700;font-size:19px;line-height:1.2;letter-spacing:-.015em;color:var(--ink)}
.dg2-list p{margin:0;font-family:var(--sans);font-size:14px;line-height:1.6;color:var(--ink-2);max-width:40ch}
.dg2-winter .dg2-list b{font-family:var(--serif);font-style:italic;font-weight:400;font-size:25px;line-height:1.1;letter-spacing:0}
.dg2-winter .dg2-n{padding-top:8px}
.dg2-list li:hover .dg2-n{color:var(--terra)}

/* ---- 03 · Fibre comparison table ---- */
.dg2-fibres{padding:clamp(80px,8.5vw,112px) 0;background:var(--paper-2);border-top:1px solid var(--line)}
.dg2-table{width:100%;border-collapse:collapse;border-top:1px solid var(--ink)}
.dg2-table th,.dg2-table td{text-align:left;vertical-align:top;padding:30px 28px 32px 0;border-bottom:1px solid var(--line)}
.dg2-table thead th{padding:14px 28px 14px 0;font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap}
.dg2-table thead th:nth-child(1){width:22%}
.dg2-table thead th:nth-child(2){width:15%}
.dg2-table thead th:nth-child(3){width:17%}
.dg2-table thead th:nth-child(4){width:18%}
.dg2-table thead th:nth-child(5){width:28%;padding-right:0}
.dg2-fibre{display:block;font-family:var(--display);font-weight:700;font-size:clamp(28px,2.8vw,40px);line-height:1;letter-spacing:-.035em;color:var(--ink)}
.dg2-origin{display:block;margin-top:12px;font-family:var(--sans);font-size:13px;font-weight:400;line-height:1.5;color:var(--ink-3);max-width:24ch}
.dg2-table td{font-family:var(--sans);font-size:14px;line-height:1.55;color:var(--ink-2)}
.dg2-cell{display:block}
.dg2-val{display:block;margin-bottom:6px;font-family:var(--display);font-weight:700;font-size:20px;line-height:1.1;letter-spacing:-.015em;color:var(--ink)}
.dg2-table td.dg2-best{padding-right:0;font-family:var(--serif);font-style:italic;font-size:22px;line-height:1.3;color:var(--ink)}
.dg2-scale{display:flex;gap:6px;margin:4px 0 12px}
.dg2-pip{width:10px;height:10px;border:1px solid var(--ink);border-radius:50%}
.dg2-pip.dg2-on{background:var(--terra);border-color:var(--terra)}
.dg2-table tbody tr:last-child th,.dg2-table tbody tr:last-child td{border-bottom:1px solid var(--ink)}
.dg2-foot{margin:20px 0 0;font-family:var(--sans);font-size:13px;line-height:1.6;color:var(--ink-3);max-width:70ch}

/* ---- Products shortcode · three even columns on this page ---- */
.rivista-demo-layout .rs-products ul.products.rs-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:48px clamp(20px,2.4vw,36px)}
.rivista-demo-layout .rs-products ul.products.rs-grid li.product>.cgc-shell{width:100%;align-self:stretch}
/* ---- Dual CTA · paper-2 / ink, slanted seam ---- */
.dg2-dual{position:relative;overflow:hidden;background:var(--paper-2);border-top:1px solid var(--line)}
.dg2-halves{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.dg2-half{position:relative;display:flex;flex-direction:column}
.dg2-half-paper{justify-content:flex-start;padding:clamp(80px,8vw,112px) clamp(72px,9vw,140px) clamp(96px,10vw,140px) 0;color:var(--ink)}
.dg2-half-ink{justify-content:flex-end;padding:clamp(120px,13vw,180px) 0 clamp(80px,8vw,112px) clamp(88px,11vw,170px);color:var(--paper)}
.dg2-half-ink::before{content:"";position:absolute;top:-100%;bottom:-100%;left:0;width:100vw;background:var(--ink);transform:rotate(12deg);transform-origin:0 50%;z-index:0}
.dg2-in{position:relative;z-index:1;max-width:520px}
.dg2-eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:20px;font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.dg2-eyebrow::before{content:"";width:22px;height:1px;background:var(--terra);flex:none}
.dg2-half-paper .dg2-eyebrow{color:var(--ink-3)}
.dg2-half-ink .dg2-eyebrow{color:var(--paper-3)}
.dg2-half h2{margin:0 0 34px;font-family:var(--display);font-weight:700;font-size:clamp(38px,4.6vw,66px);line-height:.96;letter-spacing:-.035em;color:inherit}
.dg2-half h2 i{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
.dg2-half-paper h2 i{color:var(--ink-3)}
.dg2-half-ink h2 i{color:var(--paper-3)}
.dg2-arrow{display:inline-flex;align-items:center;gap:10px;padding-bottom:6px;border-bottom:1px solid currentColor;font-family:var(--display);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:inherit;transition:color var(--dur) var(--ease),gap var(--dur) var(--ease),border-color var(--dur) var(--ease)}
.dg2-arrow svg{width:13px;height:13px;flex:none}
.dg2-arrow:hover{gap:16px;color:var(--terra)}
.dg2-half-ink .dg2-arrow:hover{color:var(--paper);border-color:var(--terra)}
.dg2-sides{margin:0 0 36px;padding:0;list-style:none;border-top:1px solid var(--ink);max-width:440px}
.dg2-sides li{display:grid;grid-template-columns:84px minmax(0,1fr);gap:0 16px;align-items:baseline;padding:14px 0 15px;border-bottom:1px solid var(--line)}
.dg2-sides-k{display:flex;align-items:center;gap:8px;font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.dg2-sides li:first-child .dg2-sides-k::before,.dg2-sides li:last-child .dg2-sides-k::before{content:"";width:6px;height:6px;border-radius:50%;flex:none}
.dg2-sides li:first-child .dg2-sides-k::before{background:var(--terra)}
.dg2-sides li:last-child .dg2-sides-k::before{border:1px solid var(--ink)}
.dg2-sides-v{font-family:var(--sans);font-size:15px;line-height:1.45;color:var(--ink)}
.dg2-sides-v i{font-family:var(--serif);font-style:italic;font-size:19px;letter-spacing:0}

/* ---- Hero on phones: headline band first, the two worlds side by side ----
   (mirrors the hero's own 760px breakpoint; hero markup and rules untouched) */
@media(max-width:760px){
  .dg-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 1px;background:var(--paper)}
  .dg-hero .dg-center{display:block;grid-column:1/-1;grid-row:1;position:relative;left:auto;top:auto;transform:none;width:auto;padding:34px 24px 30px;background:var(--ink);text-align:left}
  .dg-hero .dg-center .eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:11px}
  .dg-hero .dg-center .eyebrow::before{content:"";width:22px;height:1px;background:var(--terra);flex:none}
  .dg-hero .dg-center h1{font-size:clamp(52px,16.5vw,84px);text-shadow:none}
  .dg-hero .dg-pane{grid-row:2;height:min(64vh,540px);min-height:380px}
  .dg-hero .dg-pane img{inset:-14px;width:calc(100% + 28px);max-width:none;height:calc(100% + 28px)}
  .dg-hero .dg-pane.one img{object-position:58% 50%}
  .dg-hero .dg-pane.two img{object-position:38% 50%}
  .dg-hero .dg-pane.one .lbl,.dg-hero .dg-pane.two .lbl{left:16px;right:12px;bottom:20px}
  .dg-hero .dg-pane .lbl .cat{font-size:10px;margin-bottom:8px}
  .dg-hero .dg-pane .lbl h3{font-size:26px;margin-bottom:14px}
  .dg-hero .dg-pane .lbl a{font-size:10px;letter-spacing:.1em;gap:7px}
}

/* ---- responsive ---- */
@media(max-width:980px){
  .dg2-head{grid-template-columns:minmax(0,1fr)}
  .dg2-head .num,.dg2-head h2,.dg2-lede{grid-column:1}
  .dg2-lede{grid-row:3;margin-top:10px;padding-bottom:0}
  .dg2-cols{grid-template-columns:minmax(0,1fr);gap:0}
  .dg2-seam,.dg2-or{display:none}
  .dg2-winter{position:relative;margin-top:64px;padding-top:72px}
  .dg2-winter::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--ink);transform:rotate(-3deg)}
  .dg2-table th,.dg2-table td{padding:24px 16px 26px 0}
  .dg2-table thead th{padding:12px 16px 12px 0}
  .dg2-fibre{font-size:26px}
  .dg2-table td.dg2-best{font-size:19px}
  .dg2-half-paper{padding:88px 48px 120px 0}
  .dg2-half-ink{padding:120px 0 88px 72px}
}
@media(max-width:640px){
  .dg2-season h3{font-size:clamp(60px,18vw,84px)}
  .dg2-winter{margin-top:48px;padding-top:56px}
  .dg2-list li{grid-template-columns:32px minmax(0,1fr);gap:0 12px}
  .dg2-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .dg2-table,.dg2-table tbody,.dg2-table tr,.dg2-table th,.dg2-table td{display:block;width:auto}
  .dg2-table tbody tr{padding:28px 0 6px;border-bottom:1px solid var(--line)}
  .dg2-table tbody th{padding:0 0 18px;border-bottom:0}
  .dg2-table td{display:grid;grid-template-columns:78px minmax(0,1fr);gap:12px;padding:14px 0;border-bottom:0;border-top:1px solid var(--line)}
  .dg2-table td::before{content:attr(data-th);padding-top:4px;font-family:var(--display);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
  .dg2-table td.dg2-best{font-size:20px;line-height:1.3}
  .dg2-table tbody tr:last-child{border-bottom:1px solid var(--ink)}
  .dg2-table tbody tr:last-child th,.dg2-table tbody tr:last-child td{border-bottom:0}
  .dg2-halves{grid-template-columns:minmax(0,1fr)}
  .dg2-half-paper{padding:72px 0 80px}
  .dg2-half-ink{padding:96px 0 80px}
  .dg2-half-ink::before{top:0;bottom:-100%;left:-100vw;width:300vw;transform:rotate(-3deg);transform-origin:50% 0}
  .dg2-half h2{margin-bottom:28px}
  .dg2-sides{margin-bottom:30px}
  .dg2-sides li{grid-template-columns:76px minmax(0,1fr);gap:0 12px}
  .rivista-demo-layout .rs-products ul.products.rs-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 16px}
  .rivista-demo-layout .rs-products ul.products.rs-grid li.product:first-child{grid-column:1/-1}
}