/* =========================================================
   Project: Checco.co.uk | UK Domain Name Landing Page
   Author: Sunny Assist (Giada)
   Last updated: 2026-11-13

   Print layout for the brand concept and domain offer.
   The screen stylesheet is loaded only for screen media.
   ========================================================= */

/* 01 · Page and typography
   ========================================================= */

@font-face {
  font-family: "Open Sans";
  src: url("../fonts/open-sans-regular.woff") format("woff");
  font-weight: 400;
}

@font-face {
  font-family: "Open Sans";
  src: url("../fonts/open-sans-bold.woff") format("woff");
  font-weight: 700;
}

:root {
  --print-sans: "Open Sans", system-ui, sans-serif;
}

@page {
  size: A4;
  margin: 14mm;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: #fff;
  color: #161616;
  font: 10.5pt/1.45 Georgia, "Times New Roman", serif;
}

h1,
h2,
h3,
p,
figure,
dl,
dd {
  margin: 0;
}

h1,
h2,
h3 {
  break-after: avoid;
  line-height: 1.12;
}

h1 {
  font-size: 26pt;
}

h2 {
  font-size: 20pt;
}

h3 {
  font-size: 13pt;
}

p {
  orphans: 3;
  widows: 3;
}

a {
  color: inherit;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

.label {
  margin-bottom: 1.5mm;
  font: 700 8.5pt/1.25 var(--print-sans);
  letter-spacing: .055em;
  text-transform: uppercase;
}

/* 02 · Header and café concept
   ========================================================= */

.skip,
.topline,
.header-nav,
.header-note,
.hero-brand,
.hero .actions,
.hero-menu-link,
.day-card-icon,
.footer-logo,
.footer-top {
  display: none;
}

.site-header {
  margin-bottom: 4mm;
  padding-bottom: 3mm;
  border-bottom: .5pt solid #999;
}

.header-logo {
  display: inline-block;
  width: 34mm;
  font: 700 7.5pt/1.25 var(--print-sans);
  letter-spacing: .08em;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
}

.header-logo img {
  width: 100%;
  margin-bottom: 1mm;
}

.hero-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  align-items: center;
  gap: 5mm;
}

.hero-line {
  margin-top: 2mm;
  font-style: italic;
  font-weight: 700;
}

.hero-detail {
  margin-top: 2mm;
}

.hero-label {
  margin-bottom: 1mm;
  font-weight: 700;
}

.hero-figure figcaption,
.table-figure figcaption,
.logo-grid figcaption,
.details-grid figcaption {
  padding-top: 1mm;
  font-size: 9pt;
}

.table-figure img {
  width: 100%;
}

.ribbon-inner {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3mm;
  margin: 4mm 0 0;
  padding: 2mm 0;
  border-block: .5pt solid #999;
  list-style: none;
}

.ribbon-inner strong,
.details-grid strong {
  display: block;
}

.section {
  padding-block: 4mm;
}

.section + .section {
  border-top: .5pt solid #bbb;
}

.section-intro {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  align-items: end;
  gap: 4mm;
  margin-bottom: 3mm;
  break-inside: avoid;
  break-after: avoid;
}

.story-lead {
  margin-bottom: 1mm;
  font-weight: 700;
}

.day-grid,
.logo-grid,
.details-grid,
.collection-grid {
  display: grid;
  gap: 3mm;
}

.day-grid,
.collection-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.day-grid {
  margin-top: 3mm;
}

.logo-grid,
.details-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.logo-grid img,
.details-grid img {
  width: 100%;
  max-height: 35mm;
  object-fit: contain;
}

.logo-index,
.collection-index {
  margin-right: 1mm;
}

.palette {
  display: flex;
  flex-wrap: wrap;
  gap: 2mm 5mm;
  margin-top: 2mm;
  font-size: 9pt;
}

.detail-heading {
  margin-block: 3mm 2mm;
}

figure,
.day-grid article,
.collection-grid > a,
.offer-card,
.footer-main {
  break-inside: avoid;
}

/* 03 · Domain offer, collection and credits
   ========================================================= */

.sale-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
  gap: 4mm;
}

.sale-lead,
.sale-scope {
  margin-top: 2mm;
}

.offer-card,
.collection-grid > a {
  padding: 2.5mm;
  border: .5pt solid #999;
}

.offer-card dl {
  margin-block: 2mm;
}

.offer-card dl div {
  display: flex;
  justify-content: space-between;
  gap: 2mm;
  border-bottom: .5pt solid #ccc;
}

.offer-card dd {
  font-weight: 700;
}

.offer-buy::after {
  display: block;
  content: attr(href);
  font: 8pt/1.3 var(--print-sans);
  overflow-wrap: anywhere;
}

.collection-grid > a {
  display: block;
  text-decoration: none;
}

.collection-grid strong {
  display: block;
  margin-block: 1mm;
  font-size: 12pt;
}

.collection-link {
  display: block;
  margin-top: 1mm;
  text-decoration: underline;
}

.footer {
  margin-top: 3mm;
  padding-top: 3mm;
  border-top: .5pt solid #999;
  font: 9pt/1.4 var(--print-sans);
  text-align: center;
}

.footer-summary strong {
  display: block;
}

.footer-credit {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1mm 3mm;
  margin-block: 2mm;
}

.footer-crafted svg {
  width: 3mm;
  height: 3mm;
  vertical-align: middle;
}

.footer-notes p + p {
  margin-top: 1mm;
}