/* ============================================================
   GK DESIGNS — EDITORIAL COMPANY PROFILE
   Print-aware stylesheet. This stylesheet drives both the live
   /profile/ page (web) and its printed export (Save as PDF).
   ============================================================ */

:root{
  --ink:        #0f1115;
  --ink-soft:   #3b3f45;
  --ink-muted:  #6b6258;
  --cream:      #f6efe5;
  --cream-deep: #ebe1cb;
  --gold:       #b27c2c;
  --gold-lt:    #d6a45e;
  --terra:      #9c3a20;
  --terra-soft: #b85b3e;
  --navy:       #142444;
  --green:      #365638;
  --hair:       #d6c9b0;
}

@page{
  size: A4 portrait;
  margin: 0;
}
@page :first{
  margin: 0;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#222}
body{
  color:#f3e8d3;
  font-family: 'Inter','Helvetica Neue',Arial,sans-serif;
  font-size:11pt;
  line-height:1.55;
  letter-spacing:.01em;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.display,.title,.h-serif{
  font-family: 'Fraunces','Times New Roman',Georgia,serif;
  font-feature-settings:"ss01","ss02","ss03","liga";
  font-weight:600;
  letter-spacing:-.01em;
  margin:0;
}
em, .it{ font-style:italic; font-family:'Fraunces',serif; }
.eyebrow{
  display:inline-block;
  font-family:'JetBrains Mono',Consolas,monospace;
  font-size:8pt;
  letter-spacing:.22em;
  text-transform:uppercase;
  font-weight:700;
  color:#d6a45e;
}
.ruler{
  display:block;
  height:1px;
  background:linear-gradient(to right,#d6a45e 0,#d6a45e 50px,transparent 100%);
  margin:8px 0 14px;
  border:0;
}

/* ---------------- PAGE STRUCTURE ---------------- */
.page{
  width:210mm;
  height:297mm;
  padding:18mm 16mm 22mm;
  background:#f6efe5;
  color:#0f1115;
  position:relative;
  overflow:hidden;
  page-break-after: always;
  break-after: page;
}
.page.dark{
  background:#0f1115;
  color:#f3e8d3;
}
.page.cream-deep{ background:#ebe1cb; }
.page.cover{ padding:0; }

.page .chrome{
  position:absolute;
  top:0; left:0; right:0;
  padding:7mm 16mm 5mm;
  background:#0f1115;
  color:#d6a45e;
  font-family:'JetBrains Mono',monospace;
  font-size:7.5pt;
  letter-spacing:.18em;
  text-transform:uppercase;
  height:11mm;
  border-bottom:.4mm solid #d6a45e;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.page .chrome .mono{ color:#d6a45e; font-weight:700; }
.page .chrome .meta{ color:#c4a36f; font-weight:400; text-transform:none; letter-spacing:.04em; font-family:'Inter',sans-serif; font-size:8pt; margin-left:8mm; }
.page .chrome .right{ display:flex; align-items:center; gap:6mm; }
.page .chrome .mark{
  width:7mm; height:7mm; background:#d6a45e; color:#0f1115;
  display:flex; align-items:center; justify-content:center;
  font-family:'Fraunces',serif; font-weight:800; font-size:9pt;
  border-radius:1mm; margin-right:4mm;
}
.page .chrome .ch{
  background:linear-gradient(135deg,#b27c2c,#d6a45e);
  color:#0f1115;
  padding:.6mm 2mm; border-radius:2mm;
  font-weight:700;
}

.page .footer{
  position:absolute;
  left:0; right:0; bottom:0;
  height:9mm;
  background:#0f1115;
  color:#d6a45e;
  padding:3.4mm 16mm 0;
  display:flex; justify-content:space-between; align-items:center;
  font-family:'JetBrains Mono',monospace;
  font-size:7.5pt;
}
.page .footer .credit{ color:#c4a36f; letter-spacing:.1em; }
.page .footer .pn{ color:#ebe1cb; font-weight:700; }

/* ---------------- COVER ---------------- */
.cover-inner{
  position:relative;
  background:#0f1115;
  width:100%;
  height:100%;
  color:#d6a45e;
  overflow:hidden;
}
.cover-inner::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height:152mm;
  background:radial-gradient(ellipse at 50% 60%, #1a1d24 0%, #0a0c10 100%);
}
.cover-eyebrow{
  position:absolute;
  top:18mm; left:16mm; right:16mm;
  display:flex; justify-content:space-between;
  font-family:'JetBrains Mono',monospace;
  font-size:8pt; letter-spacing:.22em; text-transform:uppercase;
  color:#d6a45e;
}
.cover-rule{
  position:absolute;
  top:25mm; left:16mm; right:16mm;
  height:.6mm; background:linear-gradient(to right,#d6a45e 0,#d6a45e 20mm,transparent 30mm,transparent 110mm,#d6a45e 120mm,#d6a45e 100%);
}
.cover-mark{
  position:absolute;
  top:65mm; left:50%; transform:translate(-50%,0);
  width:120mm; height:120mm;
}
.cover-ring{ position:absolute; inset:0; border:1px solid #d6a45e; border-radius:50%; }
.cover-ring.inner{ inset:6mm; border:.6mm solid #b27c2c; }
.cover-gk{
  position:absolute;
  inset:18mm;
  display:flex; align-items:center; justify-content:center;
  font-family:'Fraunces',serif; font-weight:700; font-size:120pt;
  letter-spacing:-.05em;
  color:#e4b254;
  text-shadow:0 1px 0 rgba(178,124,44,.4);
}
.cover-meta{
  position:absolute;
  top:192mm; left:0; right:0;
  text-align:center;
  font-family:'JetBrains Mono',monospace;
  font-size:7.5pt; letter-spacing:.22em;
  color:#9c7c4d;
}
.cover-bottom{
  position:absolute;
  bottom:0; left:0; right:0;
  background:#0a0c10;
  padding:18mm 16mm 16mm;
  color:#d6a45e;
  border-top:.4mm solid #d6a45e;
}
.cover-bottom h1{
  font-family:'Fraunces',serif; font-weight:600;
  font-size:30pt; line-height:1.05;
  letter-spacing:-.022em;
  color:#e4b254;
  margin:0 0 6mm;
}
.cover-bottom .lede{
  font-family:'Fraunces',serif; font-style:italic;
  font-size:11pt;
  color:#ebe1cb;
  margin:0 0 14mm;
  max-width:160mm;
}
.cover-bottom .row{
  display:flex; justify-content:space-between; align-items:center;
  font-family:'JetBrains Mono',monospace;
  font-size:8pt; letter-spacing:.18em;
  color:#c4a36f; text-transform:uppercase;
}
.cover-bottom .row .v{ color:#ebe1cb; }
.cover-bottom .row.right{ text-align:right; }

/* ---------------- SECTIONS ---------------- */
.title-block{
  display:grid;
  grid-template-columns: 30mm 1fr;
  gap:6mm;
  margin:8mm 0 12mm;
}
.title-block .num{
  font-family:'JetBrains Mono',monospace;
  font-weight:700;
  font-size:42pt; line-height:.9;
  color:#b27c2c;
}
.title-block .heading h2{
  font-family:'Fraunces',serif;
  font-size:30pt; line-height:1.05;
  letter-spacing:-.022em;
  font-weight:600;
  margin:0 0 4mm;
}
.title-block .heading .eyebrow{
  margin-bottom:3mm;
  display:block;
}
.title-block .heading .dek{
  font-family:'Fraunces',serif; font-style:italic;
  font-size:11pt;
  color:#3b3f45;
  max-width:120mm;
}

.title-block.subtle{ grid-template-columns: 1fr; gap:0; }
.title-block.subtle .num{ display:none; }
.title-block.subtle .eyebrow{
  margin-bottom:4mm;
}

/* ---------------- STATS GRID ---------------- */
.stats-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:4mm;
  margin:6mm 0;
}
.stat.island{
  background:#0f1115;
  color:#f3e8d3;
  border-radius:2mm;
  padding:8mm 6mm 7mm;
}
.stat .big{
  font-family:'Fraunces',serif;
  font-size:42pt; line-height:.95; font-weight:700;
  letter-spacing:-.02em;
  color:#e4b254;
  margin-bottom:1mm;
}
.stat .lbl{
  font-family:'JetBrains Mono',monospace;
  font-size:7pt; letter-spacing:.2em;
  text-transform:uppercase;
  color:#c4a36f;
  margin-bottom:3mm;
}
.stat .desc{
  font-family:'Inter',sans-serif;
  font-size:8.5pt;
  color:#c4a36f;
  line-height:1.45;
}

/* ---------------- SPLIT COLUMNS ---------------- */
.split{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:8mm;
  margin:6mm 0;
}
.split-3{
  display:grid;
  grid-template-columns: repeat(3,1fr);
  gap:5mm;
}
.split-4{
  display:grid;
  grid-template-columns: repeat(4,1fr);
  gap:5mm;
}

/* ---------------- TILES / CARDS ---------------- */
.tile{
  background:#ebe1cb;
  border-radius:2mm;
  padding:6mm 6mm 5mm;
  border-top:1.2mm solid #b27c2c;
  position:relative;
}
.tile.dark{ background:#0f1115; color:#f3e8d3; border-top-color:#e4b254; }
.tile.dark .meta{ color:#c4a36f; }
.tile.terra{ border-top-color:#9c3a20; }
.tile.navy{  border-top-color:#142444; }
.tile.green{ border-top-color:#365638; }
.tile h4{
  font-family:'Fraunces',serif; font-size:13pt; font-weight:600;
  margin:0 0 2mm;
  letter-spacing:-.01em;
}
.tile .meta{
  font-family:'JetBrains Mono',monospace;
  font-size:7pt; letter-spacing:.2em;
  text-transform:uppercase;
  margin-bottom:4mm;
  color:#b27c2c;
}
.tile p{
  font-size:9pt; line-height:1.55;
  margin:0;
}
.tile.dark p{ color:#c4a36f; }

/* ---------------- INDEX TABLE ---------------- */
.index{ margin-top:6mm; }
.index .row{
  display:grid;
  grid-template-columns: 14mm 100mm 1fr 14mm;
  gap:5mm;
  padding:2.6mm 0;
  border-bottom:.3mm dotted #cbb994;
  align-items:baseline;
}
.index .row:nth-child(even){ background:#ebe1cb; margin:0 -4mm; padding:2.6mm 4mm; border-bottom:.3mm solid transparent; border-radius:1mm;}
.index .row .num{ font-family:'JetBrains Mono',monospace; font-weight:700; font-size:10pt; color:#b27c2c; }
.index .row .title{ font-family:'Fraunces',serif; font-weight:600; font-size:13pt; color:#0f1115; }
.index .row .sub{ font-family:'Fraunces',serif; font-style:italic; font-size:9.5pt; color:#3b3f45; }
.index .row .pn{ font-family:'JetBrains Mono',monospace; font-size:9pt; color:#0f1115; text-align:right; }

/* ---------------- LETTER / DROP CAP ---------------- */
.letter .body{
  font-family:'Fraunces',serif;
  font-size:11.5pt;
  line-height:1.55;
  color:#0f1115;
}
.letter .dropcap{
  font-family:'Fraunces',serif;
  font-weight:700;
  font-size:62pt; line-height:.85;
  float:left;
  margin:4mm 4mm 0 -2mm;
  color:#b27c2c;
}
.letter .sign{
  margin-top:8mm;
  border-top:.4mm solid #0f1115;
  padding-top:3mm;
  width:60mm;
}
.letter .sign .name{
  font-family:'JetBrains Mono',monospace;
  font-weight:700;
  font-size:9.5pt; letter-spacing:.12em;
}
.letter .sign .role{
  font-size:9pt; color:#3b3f45;
}

/* ---------------- TIMELINE ---------------- */
.timeline{
  position:relative;
  height:18mm;
  margin:6mm 0 4mm;
}
.timeline::before{
  content:"";
  position:absolute;
  top:50%; left:1mm; right:1mm;
  height:.4mm; background:#cbb994;
  transform:translateY(-50%);
}
.timeline .dot{
  position:absolute;
  top:50%; transform:translate(-50%,-50%);
  width:3.2mm; height:3.2mm;
  background:#b27c2c; border-radius:50%;
  box-shadow:0 0 0 1.2mm #f6efe5, 0 0 0 1.6mm #b27c2c;
}
.timeline .year{
  position:absolute;
  transform:translate(-50%, 6mm);
  font-family:'JetBrains Mono',monospace;
  font-weight:700; font-size:8pt;
  color:#0f1115;
  white-space:nowrap;
}
.timeline .ev{
  position:absolute;
  transform:translate(-50%, -10mm);
  font-family:'Fraunces',serif; font-style:italic;
  font-size:8pt;
  color:#3b3f45;
  white-space:nowrap;
}

/* ---------------- PROCESS / STEPS ---------------- */
.process{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:3mm;
}

.step{
  background:#0f1115;
  color:#f3e8d3;
  border-radius:2mm;
  padding:5mm 4mm 5mm;
  border-top:1mm solid #d6a45e;
  position:relative;
  min-height:62mm;
}
.step .big{
  position:absolute;
  top:3mm; right:3mm;
  font-family:'Fraunces',serif; font-weight:700;
  font-size:30pt; line-height:.9;
  color:#d6a45e;
}
.step .label{
  font-family:'JetBrains Mono',monospace;
  font-size:7pt; letter-spacing:.18em;
  color:#d6a45e;
  margin-bottom:6mm;
  text-transform:uppercase;
}
.step h4{
  font-family:'Fraunces',serif;
  font-size:14pt; font-weight:600;
  margin:0 0 3mm;
}
.step p{
  font-size:9pt; line-height:1.5;
  color:#c4a36f;
  margin:0;
}

/* ---------------- PULL QUOTE ---------------- */
.pull-quote{
  background:#0f1115;
  color:#d6a45e;
  border-radius:2mm;
  padding:9mm 9mm 8mm;
  position:relative;
  margin:6mm 0;
}
.pull-quote::before{
  content:"\201C";
  position:absolute;
  top:5mm; left:6mm;
  font-family:'Fraunces',serif; font-weight:700;
  font-size:48pt; line-height:.8;
  color:#b27c2c;
}
.pull-quote .q{
  font-family:'Fraunces',serif; font-style:italic;
  font-size:20pt; line-height:1.18;
  color:#e4b254;
  margin:0 0 6mm 12mm;
}
.pull-quote .who{
  font-family:'JetBrains Mono',monospace;
  font-size:8pt; letter-spacing:.18em;
  text-transform:uppercase;
  color:#c4a36f;
  margin:0 0 0 12mm;
}

/* ---------------- IP / FEATURE BOX ---------------- */
.feature-card{
  background:#ebe1cb;
  border-radius:2mm;
  padding:6mm 6mm 5mm;
  margin:4mm 0;
}
.feature-card .row{
  display:grid;
  grid-template-columns:36mm 1fr;
  gap:5mm;
  padding:2mm 0;
  border-bottom:.3mm dotted #cbb994;
}
.feature-card .row:last-child{ border-bottom:0; }
.feature-card .row .k{
  font-family:'JetBrains Mono',monospace;
  font-size:8.5pt; letter-spacing:.14em;
  text-transform:uppercase;
  color:#b27c2c;
  font-weight:700;
}
.feature-card .row .v{ font-size:10pt; }

/* ---------------- HIGHLIGHT BAR ---------------- */
.highlight-bar{
  background:#d6a45e;
  color:#0f1115;
  padding:4mm 6mm;
  border-radius:0;
  text-align:center;
  font-family:'JetBrains Mono',monospace;
  font-weight:700;
  letter-spacing:.18em;
  font-size:8pt;
  text-transform:uppercase;
  margin:3mm 0 0;
}

/* ---------------- FOOTER CONTACT CARDS ---------------- */
.contact-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:5mm;
}
.contact-card{
  background:#0f1115;
  color:#ebe1cb;
  border-radius:2mm;
  padding:7mm 7mm 6mm;
  position:relative;
  overflow:hidden;
}
.contact-card::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height:1.6mm;
  background:linear-gradient(135deg,#b27c2c,#d6a45e);
}
.contact-card .label{
  font-family:'JetBrains Mono',monospace;
  font-size:9pt; letter-spacing:.2em;
  text-transform:uppercase;
  color:#d6a45e;
  font-weight:700;
  margin-bottom:5mm;
}
.contact-card .v{ font-family:'Fraunces',serif; font-size:12pt; line-height:1.4; color:#ebe1cb; }

/* ---------------- IMAGES ---------------- */
.fig{
  width:100%;
  background:#ebe1cb;
  border-radius:2mm;
  overflow:hidden;
}
.fig img{ width:100%; height:100%; object-fit:cover; display:block; }

/* ---------------- BACK MATTE ---------------- */
.matte{
  position:relative;
  overflow:hidden;
  border-radius:2mm;
}
.matte .caption{
  position:absolute;
  left:0; right:0; bottom:0;
  background:linear-gradient(180deg,transparent,rgba(10,12,16,.92));
  color:#ebe1cb;
  padding:14mm 6mm 4mm;
  font-family:'Fraunces',serif;
  font-style:italic;
  font-size:9pt;
}

/* ---------------- SECTION UNDERLINE ---------------- */
.section-rule{
  display:block;
  height:.6mm;
  background:#0f1115;
  margin:4mm 0 6mm;
}

/* ---------------- CONTACT PAGE LAYOUT ---------------- */
.contact-hero h1{
  font-family:'Fraunces',serif;
  font-size:48pt; line-height:1.02;
  letter-spacing:-.03em;
  font-weight:600;
  color:#0f1115;
  margin:8mm 0 6mm;
}
.contact-hero .lede{
  font-family:'Fraunces',serif; font-style:italic;
  font-size:13pt; line-height:1.45;
  color:#3b3f45;
  max-width:170mm;
  margin-bottom:14mm;
}

/* utilities */
.row{ display:flex; align-items:flex-start; gap:5mm; }
.cols-2{ display:grid; grid-template-columns:1fr 1fr; gap:5mm; }
.gap-xs{ gap:2mm; } .gap-s{ gap:4mm; } .gap-m{ gap:6mm; } .gap-l{ gap:9mm; }
.mt-s{ margin-top:4mm;} .mt-m{ margin-top:7mm;} .mt-l{ margin-top:10mm;} .mt-xl{ margin-top:14mm;}
.mb-s{ margin-bottom:4mm;} .mb-m{ margin-bottom:7mm;}
.tight{ line-height:1.18; }
.center{ text-align:center; }
.cta{
  display:inline-block;
  background:linear-gradient(135deg,#b27c2c,#d6a45e);
  color:#fff;
  padding:3.4mm 8mm; border-radius:99mm;
  font-family:'JetBrains Mono',monospace;
  font-size:9pt; letter-spacing:.18em; font-weight:700;
  text-transform:uppercase;
  text-decoration:none;
}

.kicker{
  font-family:'JetBrains Mono',monospace;
  font-size:7pt; letter-spacing:.2em;
  text-transform:uppercase;
  color:#b27c2c;
  font-weight:700;
  margin-bottom:2mm;
  display:block;
}

.tagline{
  font-family:'Fraunces',serif; font-weight:600;
  font-size:64pt; line-height:1; letter-spacing:-.04em;
  color:#0f1115;
  margin:0;
}
.tagline em{ color:#9c3a20; }

.divider{
  height:1px; background:linear-gradient(to right,#d6a45e 0,#d6a45e 56px,transparent 100%);
  margin:7mm 0;
}

.divider.dark{ background:linear-gradient(to right,#e4b254 0,#e4b254 56px,transparent 100%); }

/* page-specific helpers */
.dark .copy{ color:#c4a36f; }
.dark h2, .dark h3, .dark h4{ color:#f3e8d3; }

@media print{
  body{ background:#fff; }
  .page{ box-shadow:none; }
}
.pg-portfolio{padding:14mm 14mm 16mm}
.pg-portfolio .folio-grid{display:grid;grid-template-columns:1fr 1fr;gap:8mm;margin-top:8mm}
.pg-portfolio .folio-cell{background:#ebe1cb;border-radius:6mm;padding:6mm;display:flex;flex-direction:column;gap:3mm;break-inside:avoid}
.pg-portfolio .folio-cell:nth-child(odd){background:#efe6d3}
.pg-portfolio .folio-cell .folio-num{font-family:'JetBrains Mono',monospace;font-size:9pt;letter-spacing:.18em;color:var(--gold);font-weight:700}
.pg-portfolio .folio-cell h3{font-family:'Fraunces',serif;font-weight:600;font-size:20pt;line-height:1.05;margin:0;letter-spacing:-.01em}
.pg-portfolio .folio-cell p{font-family:'Fraunces',serif;font-style:italic;font-size:10pt;line-height:1.4;margin:0;color:var(--ink-soft)}
.pg-portfolio .folio-cell .folio-img{height:60mm;background-color:var(--ink);background-size:cover;background-position:center;border-radius:3mm;margin-top:auto}
