/* ==========================================================================
   HEAD CSS  —  imreallynotasalesperson.com
   Everything below used to live in the footer box, at roughly byte 105,000
   of a 117,000-byte document. The browser painted the page first and then
   applied these rules, so the document height changed AFTER first paint:
   measured at 393x852, the homepage went 9,074px -> 6,062px and
   /privacy-policy/ went 9,683px -> 10,938px. Chrome for iOS sets its
   toolbar inset at first paint and loses it when the document resizes
   afterwards, which is what hid the top ~109px of every page.

   Additional CSS renders inside <head>, immediately before </head>, so
   these rules now apply on the FIRST frame and the height never changes.

   The two @import lines must stay at the very top - @import is only valid
   before other rules.

   NOTE ON DEPLOYS: the app stylesheet is content-hashed, so the second
   @import filename changes on every build. Update it here whenever you
   upload a new index-*.css.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500&display=swap');
@import url('https://imreallynotasalesperson.com/wp-content/uploads/2026/09/index-C0RkxAL_.css');

/* ---- React app page only ----
   Scoped with :has(#root) so the full-bleed treatment does NOT leak onto the
   native WordPress legal pages, which have no #root and need normal padding. */
body:has(#root) #root { width: 100%; }
body:has(#root) .entry-content,
body:has(#root) .wp-block-post-content,
body:has(#root) .is-layout-flow { padding: 0 !important; max-width: 100% !important; }

/* ---- Native legal pages ---- */
body:has(.inras-legal) { background: #F4F1ED; }
body:has(.inras-legal) .wp-site-blocks > header,
body:has(.inras-legal) .wp-site-blocks > footer { display: none; }
/* The block theme prints the page title itself; the page HTML carries its own
   styled <h1>, so suppress the theme's to avoid showing the title twice. */
body:has(.inras-legal) .wp-block-post-title,
body:has(.inras-legal) .entry-title { display: none; }

/* The block theme constrains and offsets anything inside its content
   container. Let the wrapper run full width and let .inras-legal do the
   centring itself, so the measure is ours rather than the theme's. */
body:has(.inras-legal) .wp-site-blocks,
body:has(.inras-legal) .wp-site-blocks > *,
body:has(.inras-legal) .entry-content,
body:has(.inras-legal) .wp-block-post-content,
body:has(.inras-legal) .is-layout-constrained,
body:has(.inras-legal) .is-layout-flow,
body:has(.inras-legal) main,
body:has(.inras-legal) .wp-block-group {
  max-width: 100% !important;
  width: auto !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.inras-legal {
  max-width: 720px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
  box-sizing: border-box;
  padding: 72px 24px 96px;
  font-family: 'Jost', system-ui, -apple-system, sans-serif;
  font-weight: 300; font-size: 16px; line-height: 1.9; color: #3D3630;
  -webkit-font-smoothing: antialiased;
}
@media (min-width: 768px) { .inras-legal { padding: 112px 32px 128px; } }

/* The theme sizes paragraphs inside its content area; restate ours so the
   measure and the rhythm stay the same as the rest of the site. */
.inras-legal p,
.inras-legal li { font-size: 16px; line-height: 1.9; }

/* WordPress auto-links the bare site URL in the meta block, and a URL is one
   unbreakable token — at 360px it pushed the page 83px wide. Long email
   addresses in the body have the same shape, so allow breaking anywhere. */
.inras-legal,
.inras-legal * { overflow-wrap: anywhere; }
.inras-legal > * { max-width: none; margin-left: 0; margin-right: 0; }

.inras-legal__home {
  display: inline-block; margin-bottom: 56px;
  font-size: 10px; letter-spacing: .22em; text-transform: uppercase;
  color: rgba(0,0,0,.45); text-decoration: none; font-weight: 400;
}
.inras-legal__home:hover { color: #1A1A1A; }

.inras-legal__title {
  font-family: 'Playfair Display', Georgia, serif; font-weight: 500;
  font-size: 34px; line-height: 1.15; letter-spacing: -.02em;
  color: #1A1A1A; margin: 0 0 18px;
}
@media (min-width: 768px) { .inras-legal__title { font-size: 44px; } }

.inras-legal__meta {
  font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
  color: #9A8B7A; line-height: 2.1; margin: 0 0 56px; font-weight: 400;
}

.inras-legal h2 {
  font-family: 'Playfair Display', Georgia, serif; font-weight: 500;
  font-size: 23px; line-height: 1.3; letter-spacing: -.01em;
  color: #1A1A1A; margin: 52px 0 16px;
}
.inras-legal h3 {
  font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
  font-weight: 500; color: #9A8B7A; margin: 34px 0 12px;
}
.inras-legal p { margin: 0 0 20px; }
.inras-legal ul { margin: 0 0 24px; padding-left: 22px; list-style: none; }
.inras-legal li { position: relative; margin-bottom: 11px; }
.inras-legal li::before {
  content: ""; position: absolute; left: -18px; top: .82em;
  width: 5px; height: 1px; background: #9A8B7A;
}
.inras-legal a { color: #1A1A1A; text-decoration: underline; text-underline-offset: 3px; }
.inras-legal__contact { line-height: 1.85; }

.inras-legal__tablewrap { overflow-x: auto; margin: 0 0 28px; }
.inras-legal table { width: 100%; border-collapse: collapse; font-size: 14px; }
.inras-legal th {
  text-align: left; font-size: 10px; letter-spacing: .16em; text-transform: uppercase;
  font-weight: 500; color: #9A8B7A; padding: 0 14px 10px 0;
  border-bottom: 1px solid rgba(0,0,0,.14); white-space: nowrap;
}
.inras-legal td {
  padding: 13px 14px 13px 0; vertical-align: top;
  border-bottom: 1px solid rgba(0,0,0,.07); line-height: 1.65;
}

.inras-legal__nav {
  margin-top: 72px; padding-top: 26px; border-top: 1px solid rgba(0,0,0,.12);
  display: flex; flex-wrap: wrap; gap: 22px;
}
.inras-legal__nav a {
  font-size: 9px; letter-spacing: .2em; text-transform: uppercase;
  color: rgba(0,0,0,.38); text-decoration: none;
}
.inras-legal__nav a:hover { color: rgba(0,0,0,.75); }