/* cloud365.io service landing pages (22 Oct 2026, on the v9 styles). Loaded after site.css on /<service>/ pages
   only, and built on its components: the hero grid and photograph (.hero-grid, .hero-media), .btn, .actions,
   .cta-note, the icon tiles (.tile, .tiled, .checks), .ticks, .how-steps, the plans sheet (.plans-sheet), the
   questions grid and accordion (.faq-grid, .faq), the guide cards (.cards), .ledger and .contact. Everything here
   is prefixed .land- so nothing leaks back. */

/* ---------- Hero: v9's two columns, with the answer, the price and three trust rows on the left ---------- */
.land-hero { padding-bottom: clamp(40px, 6vw, 72px); }   /* no price strip hangs over the next band here */
@media (min-width: 980px) {
  .land-hero .hero-grid { align-items: start; }   /* the copy column runs well below the photograph */
  .land-hero .hero-media { margin-top: 58px; }    /* level with the headline: the 44px crumbs row and its 14px gap */
}
.land-hero .crumbs { margin-bottom: 14px; }
.land-hero h1 { max-width: 22ch; }
.land-answer { margin-top: 24px; font-size: var(--fs-lg); line-height: 1.5; color: var(--text); max-width: 58ch; }
.land-price {
  margin-top: 24px; padding-top: 20px; border-top: 1px solid rgba(10, 32, 90, 0.12);
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px;
}
.land-price strong { font-size: var(--fs-price); line-height: 1; letter-spacing: -0.03em; color: var(--ink); font-variant-numeric: tabular-nums; }
.land-price span { font-size: var(--fs-sm); line-height: 1.4; color: var(--muted); max-width: 34ch; }
.land-hero .actions { margin-top: 24px; }
/* Three tiled rows (.tiled .tiled-sm) under a hairline, as the v8 hero carried them. */
.land-trust {
  list-style: none; margin: 32px 0 0; padding: 24px 0 0; border-top: 1px solid rgba(10, 32, 90, 0.12);
  display: grid; gap: 14px; font-size: 0.9375rem; line-height: 1.5; color: var(--text);
}
.land-photo-portrait { object-position: 50% 40%; }   /* the portrait source, cropped to the hero's 5:4 */

/* ---------- Sections: a heading column and a body column, as the consultancy page sets its services ---------- */
.land .section { scroll-margin-top: calc(var(--header-h) + 8px); }
.land-sec .wrap { display: grid; gap: 24px; }
@media (min-width: 900px) {
  .land-sec .wrap { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 72px; align-items: start; }
  .land-head { position: sticky; top: calc(var(--header-h) + 24px); }
}
.land-lead { margin-top: 14px; font-size: var(--fs-base); line-height: 1.55; color: var(--muted); max-width: 44ch; }
.land-lead + .land-lead { margin-top: 10px; }
.land-body > * + * { margin-top: 20px; }
.land-body > p { max-width: 62ch; line-height: 1.6; }
.land-body > p + p { margin-top: 14px; }
.land-body > .price-note { margin-top: 16px; max-width: 70ch; }
.land-body > .price-note + .price-note { margin-top: 8px; }
.land-body > .actions { margin-top: 28px; }
.land-body > .actions + .cta-note { margin-top: 12px; }
.land-body > .ticks { margin-top: 20px; padding-top: 20px; }
.land-ticks-lead { margin-top: 24px; font-weight: 600; color: var(--ink); }
.land-ticks-lead + .ticks { margin-top: 12px; padding-top: 0; border-top: 0; }   /* the lead already follows a rule */
.land-body > .ticks + .price-note { margin-top: 20px; }

/* ---------- Price tables: set like the licence table, a label row over ruled rows of tabular figures ---------- */
.land-table-wrap { border-bottom: 1px solid var(--line); overflow-x: auto; }
.land-table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; line-height: 1.45; }
.land-table th, .land-table td { padding: 14px 12px 14px 0; text-align: left; vertical-align: top; border-top: 1px solid var(--line); }
.land-table th:last-child, .land-table td:last-child { padding-right: 0; }
.land-table thead th { border-top: 0; border-bottom: 1px solid var(--line-strong); padding: 10px 12px 10px 0; font-size: var(--fs-label); font-weight: 500; color: var(--muted); white-space: nowrap; }
.land-table thead th:not(:first-child) { text-align: right; }
.land-table tbody tr:first-child th, .land-table tbody tr:first-child td { border-top: 0; }
.land-table th[scope="row"] { font-weight: 600; color: var(--ink); }
.land-table th[scope="row"] small { display: block; margin-top: 2px; font-size: var(--fs-sm); font-weight: 400; line-height: 1.45; color: var(--muted); }
.land-table td { text-align: right; white-space: nowrap; font-weight: 600; font-size: 1.125rem; color: var(--ink); font-variant-numeric: tabular-nums; }
.land-table td small { display: block; margin-top: 2px; font-size: var(--fs-sm); font-weight: 400; color: var(--muted); white-space: normal; }
/* A price that covers two columns sits across both, with its band named under it. */
.land-table td.is-span { text-align: center; }
@media (max-width: 640px) { .land-table td.is-span small { display: none; } }   /* the phone row already labels it */
.land-table tr.is-highlight th, .land-table tr.is-highlight td { background: var(--tint-blue); }
.land-table tr.is-highlight th { box-shadow: inset 3px 0 0 var(--accent); padding-left: 12px; }
.land-table-plain td { text-align: left; white-space: normal; font-weight: 400; font-size: inherit; color: var(--text); }
.land-table-plain thead th:not(:first-child) { text-align: left; }
.land-table-fixed td small { text-align: right; }
/* Phones: each row becomes a small ruled block with the column heading beside every figure, as guide tables do. */
@media (max-width: 640px) {
  .land-table-wrap { border: 0; overflow: visible; }
  .land-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .land-table thead tr, .land-table thead th { display: block; width: 1px; height: 1px; padding: 0; border: 0; overflow: hidden; }   /* the cells keep no column width */
  .land-table tr { display: block; border: 1px solid var(--line); border-radius: var(--radius-l); overflow: hidden; background: var(--surface); }
  .land-table tr + tr { margin-top: 12px; }
  .land-table th[scope="row"] { display: block; padding: 12px 14px; background: var(--surface-2); border-top: 0; }
  .land-table td { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 10px 14px; border-top: 1px solid var(--line); white-space: normal; }
  .land-table td::before { content: attr(data-label); flex: 0 0 46%; text-align: left; font-size: var(--fs-sm); font-weight: 500; color: var(--muted); }
  .land-table td > span { text-align: right; }
  .land-table-plain td > span { text-align: left; }
  .land-table tr.is-highlight { border-color: var(--accent); }
  .land-table tr.is-highlight td { background: var(--surface); }
  .land-table tr.is-highlight th { box-shadow: inset 3px 0 0 var(--accent); padding-left: 14px; }
}

/* ---------- Support plans: the home page's sheet at full width, under the section intro ---------- */
.land-plans .plan-min { display: block; margin-top: 4px; font-size: var(--fs-sm); color: var(--muted); }
@media (min-width: 900px) {
  .land-plans .plan-for { min-height: 3em; }
}

/* ---------- Tiled lists: the home audit list's rows (.checks); one column unless the list is long ---------- */
.land-tiles .tile { color: var(--ink); }                       /* .checks span would mute the icon with the text */
.land-tiles li > span:last-child { color: var(--text); }       /* a row without a title reads as body text */
.land-tiles li:last-child { border-bottom: 1px solid var(--line); }
@media (min-width: 680px) {
  .land-tiles:not(.two) { grid-template-columns: 1fr; }
  .land-tiles.two li:nth-last-child(2):nth-child(odd) { border-bottom: 1px solid var(--line); }
}

/* ---------- Secondary routes: one ruled link per line, 52px tall ---------- */
.land-links { list-style: none; margin: 0; padding: 0; display: grid; max-width: 62ch; }
.land-links li { border-top: 1px solid var(--line); }
.land-links li:last-child { border-bottom: 1px solid var(--line); }
.land-links a { display: flex; align-items: center; min-height: 52px; padding: 8px 0; font-weight: 600; line-height: 1.4; text-decoration: none; }
.land-links a:hover { text-decoration: underline; }

/* ---------- The closing band ---------- */
.land-close h2 + p { margin-top: 16px; }
.land-close .contact-hours a.mail { display: inline-flex; align-items: center; min-height: 44px; }
.land .how-steps li:first-child { border-top: 0; padding-top: 0; }
.land .ledger { max-width: 34rem; }