/* ==========================================================================
   DIAMOND KING — Content pages: about, wholesale, delivery, contacts
   ========================================================================== */

.pg-hero .breadcrumbs + .eyebrow{ margin-top:var(--sp-24); }
.pg-hero-actions{ display:flex; flex-wrap:wrap; gap:var(--sp-12); margin-top:var(--sp-32); }
@media (max-width:600px){ .pg-hero-actions .btn{ flex:1 1 100%; } }

.pg-head{ display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); align-items:end; gap:var(--sp-16) var(--sp-64); margin-bottom:var(--sp-48); }
.pg-head .section-lead{ margin-top:0; }
@media (max-width:900px){ .pg-head{ grid-template-columns:1fr; margin-bottom:var(--sp-32); } }

/* ---- Steps (a real sequence) ---- */
.steps{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--paper-line); border:1px solid var(--paper-line); }
.step{ position:relative; padding:var(--sp-32) var(--sp-24); background:var(--paper-0); }
.step::after{ content:''; position:absolute; left:0; top:0; width:100%; height:2px; background:var(--accent-600); transform:scaleX(0); transform-origin:left; transition:transform var(--dur-slow) var(--ease-out); }
.step:hover::after{ transform:scaleX(1); }
.step-num{ display:block; font-family:var(--font-display); font-weight:800; font-size:4.5rem; line-height:.8; color:transparent; -webkit-text-stroke:1px var(--paper-line-strong); transition:-webkit-text-stroke-color var(--dur-base); }
.step:hover .step-num{ -webkit-text-stroke-color:var(--accent-600); }
.step h3{ margin-top:var(--sp-32); font-size:1.625rem; color:var(--ink-950); }
.step p{ margin-top:var(--sp-8); color:var(--steel-600); }
@media (max-width:900px){ .steps{ grid-template-columns:1fr; } .step h3{ margin-top:var(--sp-16); } .step-num{ font-size:3.25rem; } }

/* ---- Split: copy + form ---- */
.split{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,560px); gap:var(--sp-64); align-items:start; }
@media (max-width:1199px){ .split{ grid-template-columns:1fr; gap:var(--sp-48); } .split .form-card{ max-width:720px; } }
.split-title{ margin-top:var(--sp-16); font-size:var(--fs-h2); }
.split-lead{ margin-top:var(--sp-16); max-width:52ch; font-size:var(--fs-body-lg); color:var(--steel-200); }
.section-paper .split-lead,.section-paper-alt .split-lead{ color:var(--steel-600); }

.form-card{ padding:var(--sp-32); background:var(--graphite-900); color:var(--white); border-top:2px solid var(--accent-600); }
.form-card--paper{ background:var(--paper-50); color:var(--ink-950); border-top-color:var(--ink-950); }
.form-card-title{ margin-bottom:var(--sp-24); font-size:var(--fs-h3); }
.form-card--paper .form-success-text{ color:var(--steel-600); }
@media (max-width:600px){ .form-card{ padding:var(--sp-24) var(--sp-16); } }

.ticks{ margin-top:var(--sp-32); border-top:1px solid var(--graphite-line); }
.ticks li{ display:grid; grid-template-columns:28px minmax(0,1fr); gap:var(--sp-12); padding:var(--sp-16) 0; border-bottom:1px solid var(--graphite-line); color:var(--steel-400); }
.ticks li > span svg{ width:22px; height:22px; color:var(--accent-500); }
.ticks strong{ display:block; margin-bottom:2px; font-weight:600; color:var(--white); }

/* ---- Price-list datasheet ---- */
.ds-wrap{ overflow-x:auto; border:1px solid var(--paper-line); background:var(--paper-0); }
.ds-table{ width:100%; min-width:720px; border-collapse:collapse; }
.ds-table th{ padding:14px 16px; text-align:left; font-family:var(--font-mono); font-weight:500; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--steel-500); background:var(--paper-50); border-bottom:1px solid var(--paper-line); white-space:nowrap; }
.ds-table td{ padding:12px 16px; border-bottom:1px solid var(--paper-line); color:var(--ink-950); vertical-align:middle; }
.ds-table tbody tr{ transition:background-color var(--dur-fast); }
.ds-table tbody tr:hover{ background:var(--paper-50); }
.ds-table tr:last-child td{ border-bottom:0; }
.ds-table .r{ text-align:right; }
.ds-num{ font-family:var(--font-mono); font-size:14px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.ds-cat{ display:flex; align-items:center; gap:14px; font-family:var(--font-display); font-weight:600; font-size:1.125rem; letter-spacing:.03em; text-transform:uppercase; }
.ds-cat-icon{ width:40px; height:40px; flex-shrink:0; display:grid; place-items:center; background:var(--graphite-950); color:var(--steel-200); }
.ds-cat-icon svg{ width:28px; height:28px; }
.ds-cat small{ display:block; font-family:var(--font-mono); font-weight:400; font-size:11px; letter-spacing:.04em; color:var(--steel-500); }
.ds-link{ display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; color:var(--ink-950); transition:color var(--dur-fast), transform var(--dur-fast); }
.ds-link svg{ width:20px; height:20px; }
tr:hover .ds-link{ color:var(--accent-600); transform:translateX(3px); }
.ds-req{ font-family:var(--font-mono); font-size:12px; color:var(--accent-600); white-space:nowrap; }
.ds-foot td{ font-weight:600; background:var(--paper-50); }

.note{ margin-top:var(--sp-24); padding:var(--sp-16) var(--sp-24); border-left:3px solid var(--accent-600); background:var(--paper-50); color:var(--steel-600); }
.section-paper-alt .note{ background:var(--paper-0); }
.note b{ color:var(--ink-950); }

/* ---- About: bento ---- */
.bento{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-auto-rows:minmax(200px,auto); gap:12px; }
.bento-card{ position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; gap:var(--sp-16); padding:var(--sp-24); background:var(--graphite-900); border:1px solid var(--graphite-line); color:var(--white); }
.bento-k{ font-family:var(--font-mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--steel-400); }
.bento-v{ font-family:var(--font-display); font-weight:800; font-size:clamp(3rem, 2rem + 3vw, 5rem); line-height:.85; font-variant-numeric:tabular-nums; }
.bento-v small{ font-size:.45em; font-weight:700; color:var(--steel-200); }
.bento-t{ font-size:.9375rem; color:var(--steel-400); }
.bento-logo{ grid-column:span 2; grid-row:span 2; align-items:center; justify-content:center; background:var(--graphite-950); }
.bento-logo img{ width:min(78%, 440px); height:auto; }
.bento-logo .bento-k{ position:absolute; left:var(--sp-24); bottom:var(--sp-24); }
.bento-photo{ grid-column:span 2; grid-row:span 2; padding:0; justify-content:flex-end; }
.bento-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:70% 50%; transition:transform 1.2s var(--ease-out); }
.bento-photo::after{ content:''; position:absolute; inset:0; background:linear-gradient(to top, rgba(8,9,10,.92) 18%, rgba(8,9,10,0) 60%); }
.bento-photo:hover img{ transform:scale(1.05); }
.bento-photo-body{ position:relative; z-index:1; padding:var(--sp-24); }
.bento-photo-title{ margin-top:8px; font-family:var(--font-display); font-weight:700; font-size:1.75rem; line-height:1; text-transform:uppercase; }
.bento-wide{ grid-column:span 2; }
.bento-fits{ display:flex; flex-wrap:wrap; gap:6px; }
.bento-fits li{ padding:6px 10px; border:1px solid var(--graphite-line-strong); font-family:var(--font-mono); font-size:13px; color:var(--steel-200); }
.bento-accent{ background:var(--accent-600); border-color:var(--accent-600); }
.bento-accent .bento-k,.bento-accent .bento-t{ color:rgba(255,255,255,.85); }
@media (max-width:1023px){ .bento{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px){
  .bento{ grid-auto-rows:minmax(150px,auto); gap:8px; }
  .bento-card{ padding:var(--sp-16); }
  .bento-logo,.bento-photo{ grid-row:span 1; min-height:240px; }
  .bento-wide{ grid-column:1 / -1; }
}

/* ---- About: directions list ---- */
.dirs{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:var(--sp-48); border-top:2px solid var(--ink-950); }
.dir{ display:grid; grid-template-columns:56px minmax(0,1fr) auto; align-items:center; gap:var(--sp-16); padding:var(--sp-16) 0; border-bottom:1px solid var(--paper-line-strong); color:var(--ink-950); }
.dir-num{ font-family:var(--font-display); font-weight:800; font-size:2.25rem; line-height:1; color:transparent; -webkit-text-stroke:1px var(--steel-500); transition:-webkit-text-stroke-color var(--dur-base); }
.dir-name{ display:block; font-family:var(--font-display); font-weight:700; font-size:1.375rem; line-height:1.05; text-transform:uppercase; }
.dir-desc{ display:block; margin-top:4px; font-size:.875rem; color:var(--steel-600); }
.dir-meta{ display:flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:12px; color:var(--steel-600); white-space:nowrap; }
.dir-meta svg{ width:18px; height:18px; transition:transform var(--dur-base) var(--ease-out); }
.dir:hover .dir-num{ -webkit-text-stroke-color:var(--accent-600); }
.dir:hover .dir-meta svg{ transform:translateX(4px); color:var(--accent-600); }
@media (max-width:900px){ .dirs{ grid-template-columns:1fr; } }
@media (max-width:480px){ .dir{ grid-template-columns:44px minmax(0,1fr); } .dir-meta{ grid-column:2; } .dir-num{ font-size:1.75rem; } }

/* ---- Principles ---- */
.principles{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-16); }
.principle{ --notch:16px; padding:var(--sp-32) var(--sp-24); background:var(--paper-0); border-top:2px solid var(--ink-950); }
.principle-icon{ width:28px; height:28px; color:var(--accent-600); }
.principle-icon svg{ width:100%; height:100%; }
.principle h3{ margin-top:var(--sp-24); font-size:1.5rem; color:var(--ink-950); }
.principle p{ margin-top:var(--sp-8); color:var(--steel-600); }
@media (max-width:900px){ .principles{ grid-template-columns:1fr; } }

/* ---- Contacts ---- */
.contact-list{ margin-top:var(--sp-32); border-top:1px solid var(--paper-line-strong); }
.contact-row{ display:grid; grid-template-columns:44px minmax(0,1fr); align-items:center; gap:var(--sp-16); padding:var(--sp-16) 0; border-bottom:1px solid var(--paper-line-strong); }
.contact-ico{ width:44px; height:44px; display:grid; place-items:center; background:var(--ink-950); color:var(--white); }
.contact-ico svg{ width:20px; height:20px; }
.contact-k{ display:block; font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--steel-500); }
.contact-v{ display:block; margin-top:2px; font-family:var(--font-display); font-weight:600; font-size:1.375rem; letter-spacing:.02em; color:var(--ink-950); }
a.contact-v:hover{ color:var(--accent-600); }
.quick-links{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-12); margin-top:var(--sp-32); }
.quick-link{ --notch:12px; display:flex; flex-direction:column; justify-content:space-between; gap:var(--sp-24); min-height:128px; padding:var(--sp-16); background:var(--graphite-950); color:var(--white); text-align:left; transition:background-color var(--dur-base) var(--ease-out); }
.quick-link svg{ width:24px; height:24px; color:var(--steel-200); }
.quick-link span{ font-family:var(--font-display); font-weight:600; font-size:1.125rem; line-height:1.05; letter-spacing:.03em; text-transform:uppercase; }
.quick-link:hover{ background:var(--accent-600); }
.quick-link:hover svg{ color:var(--white); }
@media (max-width:600px){ .quick-links{ grid-template-columns:1fr; } .quick-link{ min-height:0; flex-direction:row; align-items:center; } }

/* ---- Info cards (delivery) ---- */
.info-cards{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--sp-16); }
.info-card{ padding:var(--sp-32); background:var(--paper-0); border-top:2px solid var(--ink-950); }
.info-card h3{ display:flex; align-items:center; gap:12px; font-size:1.75rem; color:var(--ink-950); }
.info-card h3 svg{ width:26px; height:26px; color:var(--accent-600); }
.info-card ul{ margin-top:var(--sp-16); }
.info-card li{ position:relative; padding:10px 0 10px 22px; border-bottom:1px solid var(--paper-line); color:var(--steel-600); }
.info-card li:last-child{ border-bottom:0; }
.info-card li::before{ content:''; position:absolute; left:0; top:19px; width:10px; height:2px; background:var(--accent-600); }
.info-card li b{ color:var(--ink-950); font-weight:600; }
@media (max-width:900px){ .info-cards{ grid-template-columns:1fr; } .info-card{ padding:var(--sp-24); } }

/* ---- Page CTA ---- */
.page-cta{ padding-block:var(--sp-64); border-top:1px solid var(--graphite-line); }
.page-cta-inner{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--sp-24); }
.page-cta h2{ font-size:var(--fs-h2); }
.page-cta p{ margin-top:var(--sp-8); color:var(--steel-400); }
.page-cta-actions{ display:flex; flex-wrap:wrap; gap:var(--sp-12); }
@media (max-width:600px){ .page-cta-actions .btn{ flex:1 1 100%; } }