/* The four sector pages (Domestic, Agriculture, Commercial, Maritime), 29 Oct 2026. Linked from
   trjones-sectors/*.html only, after trj.css, with its own ?v= (SECTOR_CSS_V in scripts/lib/domestic.mjs).
   Bump that when this file changes. Same palette and type as about.css so the redesigned pages match. */

.trj-sector {
  --dm-red: #EE2D26;
  --dm-red-btn: #C9261F;
  --dm-red-dark: #B8201A;
  --dm-ink: #1A1A1A;
  --dm-grey: #555555;
  --dm-line: #E6E1D8;
  --dm-cream: #FAF8F4;
  --dm-dark: #171513;
  --dm-serif: var(--trj-font-head);
  color: var(--dm-ink);
  font-family: var(--trj-font-body);
}
.trj-sector *, .trj-sector *::before, .trj-sector *::after { box-sizing: border-box; }
.trj-sector p, .trj-sector li { font-size: 17px; line-height: 1.6; }
.trj-sector p { margin: 0 0 1em; }
.trj-sector h1, .trj-sector h2, .trj-sector h3 { font-family: var(--dm-serif); font-weight: 400; margin: 0; }
.trj-dm-wrap { max-width: 1170px; margin: 0 auto; padding: 0 20px; }

.trj-dm-eyebrow {
  font-size: 13px !important; line-height: 1.3 !important; letter-spacing: .22em; text-transform: uppercase;
  font-weight: 700; margin: 0 0 14px !important;
}
.trj-dm-eyebrow-red { color: var(--dm-red-dark); }

/* Buttons and text links */
.trj-dm-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 12px 26px; border: 2px solid var(--dm-red-btn); border-radius: 2px;
  background: var(--dm-red-btn); color: #FFFFFF !important; text-decoration: none !important;
  font-size: 15px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; line-height: 1.2;
  white-space: nowrap;
}
.trj-dm-btn:hover { background: var(--dm-red-dark); border-color: var(--dm-red-dark); }
.trj-dm-btn:focus-visible, .trj-sector a:focus-visible { outline: 3px solid #FCD209; outline-offset: 3px; }
.trj-dm-btn-ghost { background: transparent; border-color: #FFFFFF; }
.trj-dm-btn-ghost:hover { background: #FFFFFF; border-color: #FFFFFF; color: var(--dm-ink) !important; }
.trj-dm-ico { flex: none; }
.trj-sector a:not(.trj-dm-btn) { color: var(--dm-red-dark); text-decoration: underline; text-underline-offset: 2px; }
.trj-dm-more { font-weight: 700; text-decoration: none !important; }
.trj-dm-more:hover { text-decoration: underline !important; }

/* 1. Hero */
.trj-dm-hero { position: relative; z-index: 0; isolation: isolate; overflow: hidden; background: var(--dm-dark); color: #FFFFFF; border-bottom: 5px solid var(--dm-red); }
/* Full-bleed photo behind the text, under a dark tint (heavier on the text side). */
.trj-dm-hero::after { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(23, 21, 19, .74); }
.trj-dm-hero-in { display: grid; gap: 28px; padding-top: 44px; padding-bottom: 48px; }
.trj-dm-hero-text { position: relative; z-index: 2; max-width: 620px; text-shadow: 0 1px 2px rgba(0, 0, 0, .35); }
.trj-dm-hero .trj-dm-eyebrow { color: #D8D1C4; }
.trj-dm-hero h1 { font-size: 38px; line-height: 1.1; color: #FFFFFF; }
.trj-dm-rule { display: block; width: 64px; height: 3px; background: var(--dm-red); margin: 20px 0; }
.trj-sector .trj-dm-lede { font-size: 18px; line-height: 1.55; color: #ECE7DE; max-width: 32em; margin-bottom: 26px; }
.trj-sector .trj-dm-hero a:not(.trj-dm-btn) { color: #FFFFFF; }
.trj-dm-cta { display: flex; flex-wrap: wrap; gap: 14px; margin: 0 0 18px !important; }
.trj-sector .trj-dm-call { color: #D8D1C4; font-size: 16px; margin: 0; }
.trj-sector .trj-dm-call a { font-weight: 700; white-space: nowrap; }
.trj-dm-hero-photo { position: absolute; inset: 0; z-index: 0; margin: 0; }
.trj-dm-hero-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 70% 50%; }

/* 2. What we offer: three cards */
.trj-dm-offer { background: var(--dm-cream); padding: 40px 0 44px; }
.trj-dm-offer h2 { font-size: 30px; line-height: 1.15; margin-bottom: 26px; max-width: 18em; }
.trj-dm-cards { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px; }
.trj-dm-card {
  background: #FFFFFF; border: 1px solid var(--dm-line); border-top: 4px solid var(--dm-red);
  padding: 24px 24px 22px; display: flex; flex-direction: column;
}
.trj-dm-card-ico { color: var(--dm-red); display: block; margin-bottom: 12px; }
.trj-dm-card-ico svg { display: block; }
.trj-dm-card h3 { font-size: 24px; line-height: 1.2; margin-bottom: 14px; }
.trj-dm-card ul { list-style: none; margin: 0 0 18px; padding: 0; flex: 1; }
.trj-dm-card ul li { position: relative; padding: 8px 0 8px 26px; border-top: 1px solid #F0ECE5; margin: 0; }
.trj-dm-card ul li:first-child { border-top: 0; }
.trj-dm-card ul li::before {
  content: ""; position: absolute; left: 2px; top: 15px; width: 12px; height: 7px;
  border-left: 2.5px solid var(--dm-red); border-bottom: 2.5px solid var(--dm-red); transform: rotate(-45deg);
}
.trj-sector .trj-dm-card-foot { margin: 0; font-size: 16px; }

/* 3. Run out band: yellow, to match the home trust strip */
.trj-dm-runout { background: #FCD209; color: var(--dm-ink); }
.trj-dm-runout-in { display: grid; gap: 20px; padding-top: 32px; padding-bottom: 32px; }
.trj-dm-runout h2 { font-size: 28px; line-height: 1.15; margin-bottom: 10px; }
.trj-dm-runout p { margin: 0; max-width: 40em; }
.trj-sector .trj-dm-runout a.trj-dm-more { color: var(--dm-ink); }
.trj-dm-runout-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; }

/* 4. Reputation */
.trj-dm-rep { border-bottom: 1px solid var(--dm-line); }
.trj-dm-rep-in { display: grid; gap: 18px; padding-top: 40px; padding-bottom: 40px; }
.trj-dm-rep h2 { font-size: 28px; line-height: 1.2; }
.trj-dm-rep p:last-child { margin-bottom: 0; }

/* 5. Closing band */
.trj-dm-close {
  color: #FFFFFF;
  background: linear-gradient(rgba(16, 15, 14, .86), rgba(16, 15, 14, .86)), #171513 url(/images/headers/trucks2/header-767.jpg) center / cover no-repeat;
}
.trj-dm-close-in { padding-top: 48px; padding-bottom: 48px; display: grid; gap: 26px; }
.trj-dm-close .trj-dm-eyebrow { color: #E4DED3; }
.trj-dm-close h2 { font-size: 30px; line-height: 1.15; color: #FFFFFF; margin-bottom: 14px; }
.trj-sector .trj-dm-close-text { color: #ECE7DE; margin: 0; }
.trj-sector .trj-dm-close a:not(.trj-dm-btn) { color: #FFFFFF; font-weight: 700; white-space: nowrap; }
.trj-dm-close-cta { display: flex; flex-wrap: wrap; gap: 14px; margin: 0 !important; }

@media (max-width: 479px) {
  .trj-dm-btn { width: 100%; }
  .trj-dm-cta, .trj-dm-close-cta { flex-direction: column; }
}

@media (min-width: 768px) {
  .trj-dm-wrap { padding: 0 32px; }
  .trj-dm-hero-in { align-items: center; min-height: 440px; padding-top: 64px; padding-bottom: 64px; }
  .trj-dm-hero::after { background: linear-gradient(90deg, rgba(23, 21, 19, .92) 0%, rgba(23, 21, 19, .82) 45%, rgba(23, 21, 19, .35) 100%); }
  .trj-dm-hero h1 { font-size: 46px; }
  .trj-dm-offer { padding: 56px 0 60px; }
  .trj-dm-offer h2 { font-size: 36px; }
  .trj-dm-runout-in { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 40px; padding-top: 40px; padding-bottom: 40px; }
  .trj-dm-rep-in { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px; align-items: start; padding-top: 52px; padding-bottom: 52px; }
  .trj-dm-rep h2 { font-size: 32px; }
  .trj-dm-close { background-image: linear-gradient(rgba(16, 15, 14, .84), rgba(16, 15, 14, .84)), url(/images/headers/trucks2/header1599.jpg); }
  .trj-dm-close-in { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 40px; padding-top: 64px; padding-bottom: 64px; }
  .trj-dm-close h2 { font-size: 36px; }
}

@media (min-width: 992px) {
  .trj-dm-hero h1 { font-size: 54px; }
  .trj-dm-hero-in { min-height: 500px; }
  .trj-dm-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
}

/* Agriculture: product tiles */
.trj-dm-products { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.trj-dm-products li { margin: 0; }
.trj-sector .trj-dm-products a {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 76px; padding: 18px 20px;
  background: #FFFFFF; border: 1px solid var(--dm-line); border-top: 4px solid var(--dm-red);
  font-family: var(--dm-serif); font-size: 21px; line-height: 1.2; color: var(--dm-ink); text-decoration: none;
}
.trj-sector .trj-dm-products a:hover { border-color: var(--dm-red); }
.trj-dm-products-go { color: var(--dm-red-dark); font-family: var(--trj-font-body); }

/* Commercial: projects row */
.trj-dm-projects { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.trj-dm-projects li { margin: 0; background: #FFFFFF; border: 1px solid var(--dm-line); border-top: 4px solid var(--dm-red); padding: 22px 22px 20px; }
.trj-dm-projects-when { display: block; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; font-weight: 700; color: var(--dm-red-dark); margin-bottom: 8px; }
.trj-dm-projects h3 { font-size: 26px; line-height: 1.15; margin-bottom: 8px !important; }
.trj-sector .trj-dm-projects p { margin: 0; color: var(--dm-grey); font-size: 16px; }
.trj-sector .trj-dm-links { display: flex; flex-wrap: wrap; gap: 10px 28px; margin: 0; }

/* Maritime: card body text */
.trj-sector .trj-dm-card-body { flex: 1; margin: 0 0 18px; }

@media (min-width: 600px) {
  .trj-dm-products { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .trj-dm-projects { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 992px) {
  .trj-dm-products { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .trj-dm-projects { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
  .trj-dm-cards.trj-dm-cards-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 900px; }
}

/* Fuels: wide two-card rows and a white second section */
.trj-dm-offer-white { background: #FFFFFF; }
@media (min-width: 992px) {
  .trj-dm-cards.trj-dm-cards-wide { max-width: none; }
}
/* Side-by-side rows are equal height, site-wide (Owen, 30 Oct 2026). Grid rows stretch every card to
   the tallest; the card is a flex column, so its body grows and any foot link sits on the card's
   bottom edge and lines up across the row. One column (phones) has no row to match, so no forced
   height. .trj-dm-cards-top once let short cards stop at their content: now it matches the rest. */
.trj-dm-cards, .trj-dm-cards-top, .trj-dm-projects, .trj-dm-steps, .trj-dm-products { align-items: stretch; }
.trj-dm-card { box-sizing: border-box; height: 100%; }
.trj-sector .trj-dm-card > .trj-dm-card-foot:last-child { margin-top: auto; }
.trj-sector .trj-dm-products a { box-sizing: border-box; height: 100%; }

/* Content pages (lib/pages.mjs): text beside a photo */
.trj-dm-split { background: #FFFFFF; }
.trj-dm-split-cream { background: var(--dm-cream); }
.trj-dm-split-in { display: grid; gap: 26px; padding-top: 40px; padding-bottom: 40px; }
.trj-dm-split h2 { font-size: 28px; line-height: 1.2; margin-bottom: 16px; }
.trj-dm-split-text { max-width: 44em; }
.trj-dm-split-text p:last-child { margin-bottom: 0; }
.trj-dm-split-photo { margin: 0; justify-self: start; background: #FFFFFF; padding: 8px; border: 1px solid var(--dm-line); max-width: 100%; }
.trj-dm-split-photo img { display: block; max-width: 100%; height: auto; }

/* Big-number strip */
.trj-dm-stats { background: var(--dm-dark); color: #FFFFFF; }
.trj-dm-stats ul { list-style: none; margin: 0; padding: 26px 0; display: grid; gap: 18px; }
.trj-dm-stats li { margin: 0; display: flex; flex-direction: column; gap: 4px; }
.trj-dm-stats li::before { content: ""; display: block; width: 40px; height: 3px; background: var(--dm-red); margin-bottom: 10px; }
.trj-dm-stat-n { font-family: var(--dm-serif); font-size: 32px; line-height: 1.1; }
.trj-sector .trj-dm-stat-l { font-size: 15px; color: #D8D1C4; line-height: 1.4; }

/* Numbered steps */
.trj-dm-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.trj-dm-steps li { margin: 0; background: #FFFFFF; border: 1px solid var(--dm-line); padding: 22px 22px 20px; }
.trj-dm-step-n {
  display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%;
  background: var(--dm-red-btn); color: #FFFFFF; font-weight: 700; font-size: 18px; margin-bottom: 12px;
}
.trj-dm-steps h3 { font-size: 23px; line-height: 1.2; margin-bottom: 8px !important; }
.trj-sector .trj-dm-steps p { margin: 0; }
.trj-sector .trj-dm-runout a:not(.trj-dm-btn) { color: var(--dm-ink); font-weight: 700; }

@media (min-width: 768px) {
  .trj-dm-split-in { grid-template-columns: minmax(0, 1fr) auto; gap: 48px; align-items: center; padding-top: 56px; padding-bottom: 56px; }
  .trj-dm-split h2 { font-size: 32px; }
  .trj-dm-split-photo { justify-self: end; }
  .trj-dm-stats ul { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; padding: 32px 0; }
  .trj-dm-stat-n { font-size: 38px; }
  .trj-dm-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
}

/* Contact page: details beside the (unchanged) form */
.trj-dm-contact { background: var(--dm-cream); }
.trj-dm-contact-in { display: grid; gap: 32px; padding-top: 40px; padding-bottom: 48px; }
.trj-dm-contact-details h2 { font-size: 28px; line-height: 1.2; margin-bottom: 18px; }
.trj-dm-contact-details ul { list-style: none; margin: 0; padding: 0; background: #FFFFFF; border: 1px solid var(--dm-line); border-top: 4px solid var(--dm-red); }
.trj-dm-contact-details li { display: flex; gap: 16px; margin: 0; padding: 20px 22px; border-top: 1px solid #F0ECE5; }
.trj-dm-contact-details li:first-child { border-top: 0; }
.trj-dm-contact-ico { color: var(--dm-red); flex: none; }
.trj-dm-contact-ico svg { display: block; width: 32px; height: 32px; }
.trj-dm-contact-details h3 { font-family: var(--trj-font-body) !important; font-size: 13px; letter-spacing: .18em; text-transform: uppercase; font-weight: 700 !important; color: var(--dm-grey); margin-bottom: 6px !important; }
.trj-sector .trj-dm-contact-details li p { margin: 0; }
.trj-sector .trj-dm-contact-emerg { margin: 18px 0 0; }
@media (min-width: 992px) {
  .trj-dm-contact-in { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 56px; align-items: start; padding-top: 56px; padding-bottom: 64px; }
}
.trj-dm-form-h { font-size: 28px; line-height: 1.2; margin: 0 0 18px; }
.trj-dm-contact-form { scroll-margin-top: 20px; }

/* One-family headings (29 Oct 2026): heavy Franklin, like the logo. Sizes trimmed a touch because
   the heavy sans sets larger than the serif did. */
.trj-sector h1, .trj-sector h2, .trj-sector h3 { font-weight: var(--trj-head-weight, 800); letter-spacing: var(--trj-head-track, -0.005em); }
.trj-sector h3 { font-weight: 700; }

/* Express Ordering page (30 Oct 2026): numbered how-to beside the open payment form. */
.trj-dm-howto { list-style: none; margin: 0; padding: 0; background: #FFFFFF; border: 1px solid var(--dm-line); border-top: 4px solid var(--dm-red); }
.trj-dm-howto li { display: flex; gap: 16px; margin: 0; padding: 20px 22px; border-top: 1px solid #F0ECE5; }
.trj-dm-howto li:first-child { border-top: 0; }
.trj-dm-howto .trj-dm-step-n { flex: none; margin: 0; width: 34px; height: 34px; font-size: 16px; }
.trj-dm-howto h3 { font-size: 19px; line-height: 1.25; margin: 4px 0 4px !important; }
.trj-sector .trj-dm-howto p { margin: 0; font-size: 16px; }
.trj-sector .trj-dm-min { margin: 16px 0 0; font-weight: 700; }
.trj-sector .trj-dm-aside { margin: 10px 0 0; font-size: 16px; color: var(--dm-grey); }
.trj-dm-express .trj-pay-panel { margin: 0; max-width: none; }
.trj-dm-howto h3 { text-transform: none !important; letter-spacing: 0 !important; color: var(--dm-ink) !important; font-family: var(--trj-font-head) !important; }

/* Order pages on phones: the form first, How it works after it (30 Oct 2026). */
@media (max-width: 991px) { .trj-dm-express .trj-dm-contact-form { order: -1; } }

/* Newsletter and small print pages (lib/legal.mjs, 30 Oct 2026). */
.trj-dm-hero-plain::after { display: none; }
.trj-dm-hero-plain .trj-dm-hero-in { min-height: 0 !important; padding-top: 40px; padding-bottom: 40px; }
.trj-lg { background: var(--dm-cream); }
.trj-lg-in { display: grid; gap: 28px; padding-top: 36px; padding-bottom: 52px; }
.trj-lg-prose { background: #FFFFFF; border: 1px solid var(--dm-line); border-radius: 4px; padding: 26px 24px; max-width: 760px; }
.trj-lg-prose p, .trj-lg-prose li { font-size: 16px; line-height: 1.7; }
.trj-lg-prose h3, .trj-lg-prose h4 { font-size: 20px !important; line-height: 1.3; margin: 26px 0 8px !important; }
.trj-lg-prose ul, .trj-lg-prose ol { padding-left: 22px; margin: 0 0 1em; }
.trj-lg-prose > *:first-child { margin-top: 0 !important; }
.trj-lg-prose a { color: var(--dm-red-dark); }
.trj-lg-aside { display: grid; gap: 16px; align-content: start; }
.trj-lg-card { background: #FFFFFF; border: 1px solid var(--dm-line); border-top: 4px solid var(--dm-red); padding: 20px 22px; }
.trj-lg-card h2 { font-size: 13px !important; letter-spacing: .18em; text-transform: uppercase; font-family: var(--trj-font-body) !important; color: var(--dm-grey); margin: 0 0 12px !important; }
.trj-lg-card ul { list-style: none; margin: 0; padding: 0; }
.trj-lg-card li { margin: 0; border-top: 1px solid #F0ECE5; }
.trj-lg-card li:first-child { border-top: 0; }
.trj-lg-card li a { display: block; padding: 9px 0; font-weight: 700; color: var(--dm-ink); text-decoration: none; }
.trj-lg-card li a:hover, .trj-lg-card a[aria-current="page"] { color: var(--dm-red-dark); }
.trj-lg-card a[aria-current="page"] { text-decoration: underline; text-underline-offset: 3px; }
.trj-sector .trj-lg-card p { margin: 0 0 8px; font-size: 16px; }
.trj-lg-card p a { display: inline-flex; align-items: center; gap: 10px; color: var(--dm-ink); text-decoration: none; font-weight: 700; }
.trj-lg-ico { color: var(--dm-red); }
.trj-lg-news { padding-top: 36px; padding-bottom: 52px; max-width: 760px; }
@media (min-width: 992px) {
  .trj-lg-in { grid-template-columns: minmax(0, 1fr) 300px; gap: 40px; align-items: start; }
  .trj-lg-prose { padding: 36px 40px; }
  .trj-lg-aside { position: sticky; top: 20px; }
}
/* Word-pasted inline sizes in the privacy and small print text: use the page's reading size. */
.trj-lg-prose [style] { font-size: inherit !important; line-height: inherit !important; font-family: inherit !important; }
.trj-lg-prose p:empty, .trj-lg-prose p:has(> br:only-child) { display: none; }
.trj-sector .trj-lg-card li a { text-decoration: none; }
.trj-sector .trj-lg-card li a[aria-current="page"] { text-decoration: underline; }
.trj-sector .trj-lg-card p a { text-decoration: none; }
.trj-lg-prose p, .trj-lg-prose li, .trj-lg-prose span, .trj-lg-prose strong, .trj-lg-prose a { font-size: 16px !important; line-height: 1.7 !important; }
.trj-lg-prose p { margin: 0 0 14px !important; }
.trj-lg-prose sup { font-size: 70% !important; line-height: 0 !important; }
.trj-lg-prose, .trj-lg-prose *:not(sup) { font-size: 16px !important; line-height: 1.7 !important; }
.trj-lg-prose div { margin: 0 0 14px; }

/* Closing call bands in navy to sit with the navy footer (30 Oct 2026); photo heroes stay near-black. */
.trj-dm-close { background: linear-gradient(rgba(23, 21, 19, .9), rgba(23, 21, 19, .9)), #1A1A1A url(/images/headers/trucks2/header-767.jpg) center / cover no-repeat; }
.trj-dm-close .trj-dm-eyebrow { color: #D8D1C4; }
.trj-sector .trj-dm-close-text { color: #ECE7DE; }
@media (min-width: 768px) { .trj-dm-close { background-image: linear-gradient(rgba(23, 21, 19, .88), rgba(23, 21, 19, .88)), url(/images/headers/trucks2/header1599.jpg); } }

/* Delivery map (Owen, 30 Oct 2026): no frame, rounded with a soft shadow. */
.trj-dm-split-photo:has(img[src*="delivery-map.jpg"]) { padding: 0; border: 0; background: none; border-radius: 8px; overflow: hidden; box-shadow: 0 8px 24px rgba(0, 0, 0, .12); }