/* ============================================
   YooYoo Media: field-report skin (7 Nov 2026)
   Loaded after styles.css and each page's inline
   styles. White paper, Archivo for words, Courier
   Prime for figures and labels, seal red for marks.
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;600;800&family=Courier+Prime:wght@400;700&family=Noto+Sans+SC:wght@400;700&display=swap');

:root{
  --ink:#141414; --ink-2:#141414; --ink-3:#141414;
  --gold:#B23A2E; --gold-soft:#141414;
  --cream:#FFFFFF; --cream-2:#F4F4F4; --sand:#FFFFFF;
  --charcoal:#141414; --seal:#B23A2E; --seal-dark:#8C2C22;
  --paper-text:#3A3A3A; --off-white:#FFFFFF;
  --grey:#6E6E6E; --rule:#D6D6D6; --hi:#FFF0A3;
  --line-on-ink:rgba(20,20,20,0.14); --line-on-cream:rgba(20,20,20,0.16);
  --f-display:'Archivo', ui-sans-serif, system-ui, Arial, sans-serif;
  --f-body:'Archivo', ui-sans-serif, system-ui, Arial, sans-serif;
  --f-mono:'Courier Prime', 'Courier New', ui-monospace, monospace;
  --f-zh:'Noto Sans SC', 'Archivo', sans-serif;
  --radius:0;
}
body{ background:#fff; color:var(--ink); }
h1,h2,h3,h4{ font-family:var(--f-display); font-weight:800; letter-spacing:-0.01em; }
h1{ letter-spacing:-0.02em; }
.zh, .ledger .zh, .jstep h4 span, .jmore dt span, .platform-card h4 span{ font-family:var(--f-zh); }
::selection{ background:var(--hi); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{ outline:2px solid var(--seal); }

/* marks: eyebrow, labels */
.eyebrow, .eyebrow.on-cream, .mono-tag, .traj-label, .as-label, .as-head, .idx-head, .jrole, .platform-role, .pricing-tag, .service-index, .footer-col h4, .info-block h4, .hero-meta, .card-top .rank, .mrow .num, .legal .updated{
  font-family:var(--f-mono); color:var(--seal); letter-spacing:0.04em; text-transform:uppercase; font-weight:700;
}
.eyebrow{ font-size:13px; }
.eyebrow::before, .eyebrow.on-cream::before{ display:none; }

/* nav */
.site-nav{ background:#fff; border-bottom:1px solid var(--ink); backdrop-filter:none; }
.brand{ font-family:var(--f-display); font-weight:800; color:var(--ink); font-size:19px; }
.nav-links{ color:var(--ink); font-family:var(--f-mono); font-size:14px; }
.nav-links a{ opacity:1; }
.nav-links a:hover, .nav-links a.active{ color:var(--seal); opacity:1; }
.nav-links a.active{ border-bottom:2px solid var(--seal); }
.nav-cta{ border:1.5px solid var(--ink); color:var(--ink); border-radius:0; font-family:var(--f-mono); font-weight:700; letter-spacing:0; }
.nav-cta:hover{ background:var(--ink); color:#fff; }
.nav-toggle{ color:var(--ink); }
@media (max-width:560px){ .nav-links.open{ background:#fff; border-bottom:1px solid var(--ink); } }

/* buttons */
.btn{ border-radius:0; font-family:var(--f-display); font-weight:600; }
.btn-gold{ background:var(--ink); color:#fff; }
.btn-gold:hover{ background:var(--seal); color:#fff; transform:none; }
.btn-outline-ink{ border:1.5px solid var(--ink); color:var(--ink); }
.btn-outline-ink:hover{ border-color:var(--seal); color:var(--seal); }
.btn-outline-charcoal{ border:1.5px solid var(--ink); color:var(--ink); }
.text-link{ border-bottom:1.5px solid var(--seal); color:var(--ink); }

/* sections: everything on paper */
.on-ink, .doctrine, .sample, .faq, .legal, .cta-final, .contact-section, .page-hero, .contact-hero, .logos-strip, .case:nth-child(even){ background:#fff; color:var(--ink); }
.section{ padding:96px 0; border-top:1px solid var(--rule); }
.section-head p, .on-ink .section-head p, .problem-text p, .doctrine-sub, .case-body p, .method-side p, .mrow p, .limits p, .lead p, .read p, .offer p, .faq-item p, .legal p{ color:var(--paper-text); }
.on-ink .section-head h2, .cta-final-inner h2, .photo-band h2, .offer h2, .read h3, .card-top h3, .page-hero h1, .contact-hero h1, .jstep h4, .service-card h3{ color:var(--ink); }
.section-head h2{ font-size:clamp(30px,3.6vw,42px); }

/* hero: paper, big type, the photo as a plate underneath */
.hero{ background:#fff; color:var(--ink); padding:72px 0 0; min-height:0; display:flex; flex-direction:column; align-items:stretch; }
.hero > .hero-inner{ position:static; }
.hero-photo{ position:static; order:2; height:420px; margin:56px 0 0; display:block; border-top:1px solid var(--ink); border-bottom:1px solid var(--ink); }
.hero-photo img{ filter:none !important; object-position:50% 70% !important; }
.hero-shade{ display:none; }
.hero-inner{ flex-direction:column; align-items:flex-start; gap:40px; }
.hero-copy{ max-width:900px !important; position:static; }
.hero-copy h1{ font-size:clamp(44px,6.4vw,92px) !important; line-height:0.98; color:var(--ink); margin-top:22px; letter-spacing:-0.025em; }
.hero-copy h1 .fade{ color:var(--seal); font-style:normal; }
.hero-sub{ color:var(--paper-text) !important; text-shadow:none !important; font-size:18px !important; line-height:1.6 !important; max-width:640px; }
.hero-sub strong{ background:var(--hi); font-weight:600; }
.hero-actions{ margin-top:28px !important; }
.hero-seal{ position:static !important; width:100% !important; margin:0 !important; padding:0 !important; background:none !important; backdrop-filter:none !important; }
.ledger{ display:grid !important; grid-template-columns:repeat(5,1fr); gap:0 !important; width:100% !important; border-top:1px solid var(--ink); text-shadow:none !important; }
.ledger li, .ledger li:last-child{ display:flex !important; flex-direction:column; align-items:flex-start; gap:6px; padding:14px 16px 14px 0 !important; border:0 !important; border-bottom:1px solid var(--ink) !important; }
.ledger li *{ text-shadow:none !important; align-self:flex-start !important; }
.ledger .zh{ font-size:28px !important; color:var(--ink); font-weight:700; align-self:flex-start !important; grid-row:auto !important; }
.ledger .en{ font-family:var(--f-mono); color:var(--seal) !important; font-size:12px !important; letter-spacing:0.04em; text-transform:uppercase; font-weight:700; text-align:left; }
.ledger .job{ color:var(--grey) !important; font-size:13px; text-align:left; }
@media (max-width:860px){
  .hero{ padding-top:40px !important; }
  .hero-photo{ height:260px; margin-top:36px; inset:auto; }
  .ledger{ grid-template-columns:repeat(2,1fr); }
  .ledger li:nth-child(odd){ padding-right:12px !important; }
}

/* stat strip: a row of figures in the margin */
.stat-strip{ background:#fff; border-top:0; border-bottom:1px solid var(--ink); padding:36px 0; }
.stat-num{ font-family:var(--f-mono); font-weight:700; font-size:40px; color:var(--ink); line-height:1; }
.stat-label{ color:var(--grey); font-size:14px; }
.stat-strip .m-dots{ color:var(--ink); }

/* the sample audit: a form, not a card */
.audit-sheet{ background:#fff; border:2px solid var(--ink); border-top-width:2px; border-radius:0; box-shadow:none; position:relative; }
.as-head{ font-size:12px; }
.as-tag{ color:var(--seal); border:2px solid var(--seal); padding:3px 8px; transform:rotate(-3deg); }
.as-score b{ font-family:var(--f-mono); font-weight:700; font-size:72px; }
.as-score span{ color:var(--grey); }
.as-score p{ color:var(--paper-text); }
.as-row i, .as-parts i{ border-radius:0; background:var(--seal); height:10px; }
.as-row i.dim{ background:#C9C9C9; }
.as-row b{ font-family:var(--f-mono); font-weight:700; font-size:22px; }
.as-parts>div b{ font-weight:700; color:var(--ink); }
.as-parts, .as-fix, .as-foot{ border-top:1px solid var(--rule); }
.as-fix ol{ color:var(--ink); }
.as-foot{ color:var(--grey); font-family:var(--f-mono); font-size:12px; }
.sample-list li{ color:var(--ink); }
.sample-list strong{ color:var(--seal); font-weight:700; }

/* why now: the trajectory */
.landlord.on-ink .section-head h2{ max-width:760px; }
.traj-year{ color:var(--grey); font-family:var(--f-mono); }
.traj-bar{ background:var(--seal); height:24px; }
.traj-row.hit .traj-bar{ background:transparent; border:1.5px dashed var(--ink); }
.traj-row.hit .traj-val{ color:var(--seal); }
.traj-val{ font-family:var(--f-mono); font-weight:700; color:var(--ink); font-size:1rem; }
.traj-val em{ color:var(--seal); opacity:1; }
.traj-note{ color:var(--paper-text); font-style:normal; font-size:.95rem; }
.landlord-argument{ background:#fff; border:2px solid var(--ink); }
.landlord-argument p:not(.mono-tag){ color:var(--ink); }
.landlord-argument .fine{ color:var(--grey); }
.callout3 div{ border-top:2px solid var(--ink); }
.callout3 b{ font-family:var(--f-mono); font-weight:700; color:var(--ink); font-size:23px; white-space:nowrap; }
.callout3 span{ color:var(--paper-text); }
.m-tabs button{ color:var(--ink); border:1.5px solid var(--ink); border-radius:0; font-family:var(--f-mono); }
.m-tabs button[aria-selected="true"]{ background:var(--ink); border-color:var(--ink); color:#fff; }

/* photo bands: a plate with a caption, not a poster */
.photo-band, .photo-band.sky-text, .photo-band.short, .photo-band.plain{ background:#fff; color:var(--ink); min-height:0 !important; display:block; border-top:1px solid var(--rule); }
.photo-band img{ position:static !important; height:440px !important; width:100% !important; filter:none !important; object-position:center 45% !important; }
.photo-band::after, .photo-band.sky-text::after, .photo-band.plain::after{ display:none !important; }
.photo-band h2, .photo-band p{ text-shadow:none !important; }
.photo-band-inner, .photo-band.sky-text .photo-band-inner, .photo-band.short .photo-band-inner, .photo-band.short.left .photo-band-inner{ padding:28px 32px 64px !important; max-width:var(--container); margin:0 auto; text-align:left !important; }
.photo-band h2, .photo-band.short h2{ color:var(--ink); max-width:24ch; margin-left:0 !important; font-size:clamp(26px,3.2vw,38px); }
.photo-band p:not(.eyebrow), .photo-band.sky-text p:not(.eyebrow){ color:var(--paper-text) !important; text-shadow:none !important; }
.photo-band .eyebrow, .photo-band.band-sunset .eyebrow, .photo-band.band-abudhabi .eyebrow, .photo-band.short .eyebrow{ color:var(--seal) !important; justify-content:flex-start !important; }
@media (max-width:860px){
  .photo-band img{ height:260px !important; }
  .photo-band-inner, .photo-band.sky-text .photo-band-inner{ padding:20px 20px 48px !important; }
  .photo-band.plain, .photo-band.short:not(.left){ display:block; }
  .photo-band.sky-text{ min-height:0 !important; }
}

/* services: numbered strip */
.services-grid{ border-top:1px solid var(--ink); }
.service-card + .service-card{ border-left:1px solid var(--rule); }
.service-card::before, .service-card + .service-card::before{ background:var(--seal); box-shadow:none; }
.service-card p{ color:var(--paper-text); }
.services .m-dots{ color:var(--ink); }
.js-enh .service-card, .js-enh .service-card + .service-card{ background:#fff; border:1px solid var(--ink); }

/* doctrine */
.doctrine-line{ font-family:var(--f-display); font-weight:800; color:var(--ink); }
.doctrine-line span{ color:var(--seal); font-style:normal; }
.split img{ border:1px solid var(--ink); border-radius:0; }

/* journey */
.journey::before, .journey.on-light::before{ border-top:1.5px dashed var(--ink); }
.journey::after, .journey.on-light::after{ border-color:var(--seal); }
.jstage, .journey.on-light .jstage{ font-family:var(--f-mono); font-weight:700; font-size:15px; color:var(--seal); text-transform:uppercase; letter-spacing:0.04em; height:40px; }
.jdot, .journey.on-light .jdot{ background:#fff; border:2px solid var(--seal); }
.jstep:last-child .jdot, .journey.on-light .jstep:last-child .jdot{ background:var(--seal); box-shadow:none; }
.jstep h4{ font-size:20px; }
.jstep h4 span{ color:var(--grey); }
.jrole{ color:var(--grey); font-weight:400; }
.jmore{ border-top:1px solid var(--rule); }
.jmore summary{ color:var(--ink); font-family:var(--f-mono); }
.jmore summary::before{ color:var(--seal); }
.jmore dt{ color:var(--ink); font-family:var(--f-display); font-weight:700; }
.jmore dd{ color:var(--paper-text); }
.jnote{ color:var(--paper-text); }
@media (max-width:860px){ .journey{ border-left:1.5px dashed var(--ink); } }

/* pricing: a rate card */
.pricing-card{ background:#fff; border:1px solid var(--ink); border-radius:0; }
.pricing-card.featured{ background:#fff; border:2px solid var(--seal); color:var(--ink); }
.pricing-card.featured h3, .pricing-card.featured .price, .pricing-card.featured .price span, .pricing-card.featured li{ color:var(--ink); opacity:1; }
.price{ font-family:var(--f-mono); font-weight:700; }
.price span{ color:var(--grey); }
.pricing-card li::before{ border-radius:0; background:var(--seal); width:7px; height:7px; }
.pricing-note{ color:var(--grey); font-size:14px; }
.pricing .m-dots{ color:var(--ink); }

/* season timeline on paper */
.season, .cta-final .season{ --s-text:var(--ink); --s-mute:var(--grey); --s-track:rgba(20,20,20,.18); --s-build:#E6CFCB; --s-event:var(--seal); }
.season-track i{ border-radius:0; }
.season-meta b{ font-weight:700; }
.cta-final .cta-sub{ color:var(--paper-text); }
.cta-final{ border-top:1px solid var(--rule); }

/* index card (how we work) */
.idx-card{ background:#fff; border:2px solid var(--ink); border-radius:0; color:var(--ink); }
.idx-name{ color:var(--ink); }
.idx-bar{ background:var(--seal); border-radius:0; }
.idx-bar.dim{ background:#C9C9C9; }
.idx-n{ font-family:var(--f-mono); font-weight:700; }
.idx-foot{ color:var(--grey); border-top:1px solid var(--rule); }

/* index page scorecards and figures */
.fig{ border-top:2px solid var(--ink); }
.fig .n{ font-family:var(--f-mono); font-weight:700; }
.fig .l{ color:var(--paper-text); }
.card{ background:#fff; color:var(--ink); border:2px solid var(--ink); border-radius:0; }
.card-top .score{ font-family:var(--f-mono); font-weight:700; color:var(--seal); }
.card-top .score small{ color:var(--grey); }
.comp .cn{ color:var(--ink); }
.comp .cb{ background:#EDEDED; border-radius:0; }
.comp .cb i{ background:var(--seal); }
.comp .cv{ color:var(--ink); font-weight:700; }
.card .note{ color:var(--paper-text); border-top:1px solid var(--rule); }
.mrow{ border-top:1px solid var(--rule); }
.mrow:last-child{ border-bottom:1px solid var(--rule); }
.mrow h4{ font-weight:700; }
.mrow .bands{ color:var(--grey); }
.offer .mail{ color:var(--seal); border-bottom:1.5px solid var(--seal); }

/* case studies */
.case{ border-bottom:1px solid var(--rule); }
.case-stat{ border-top:2px solid var(--ink); }
.case-stat .num{ font-family:var(--f-mono); font-weight:700; }
.case-stat .label{ color:var(--paper-text); }
.logo-row{ color:var(--grey); }
.logos-strip p.sub{ color:var(--paper-text); }

/* page heroes: paper, no photo */
.page-hero, .page-hero.has-photo, .contact-hero{ background:#fff; color:var(--ink); padding:72px 0 48px !important; border-bottom:1px solid var(--ink); }
.page-hero-photo, .contact-hero-photo{ display:none; }
.page-hero.has-photo::after, .contact-hero::after{ display:none; }
.page-hero h1, .contact-hero h1{ font-size:clamp(38px,5vw,64px); letter-spacing:-0.02em; line-height:1.02; }
.page-hero p, .contact-hero p{ color:var(--paper-text); }
.hero-meta{ color:var(--seal); }

/* forms */
.form-card{ background:#fff; border:2px solid var(--ink); border-radius:0; }
.form-card h3{ color:var(--ink); }
.form-card > p, .form-card .fine, .form-status p{ color:var(--paper-text); }
.field label{ color:var(--ink); font-family:var(--f-mono); font-size:13px; }
.field input, .field select, .field textarea{ background:#fff; border:1px solid var(--ink); border-radius:0; color:var(--ink); font-family:var(--f-body); }
.info-block p, .info-block a{ color:var(--paper-text); }
.info-block a:hover{ color:var(--seal); }
.consent{ color:var(--grey); }
.form-status .seal{ border-color:var(--seal); }

/* faq */
.faq-item h3{ font-weight:700; color:var(--ink); }
.js-enh .faq-item{ border-top:1px solid var(--rule); }
.js-enh .m-q::after{ color:var(--seal); }
.js-enh .m-more{ color:var(--ink); border:1.5px solid var(--ink); border-radius:0; font-family:var(--f-mono); }
.m-dots i.on{ background:var(--seal); }

/* the seal */
.seal{ border-color:var(--seal); }
.seal .seal-text{ color:var(--seal); }

/* footer: the one dark surface */
.site-footer{ background:var(--ink); color:rgba(255,255,255,0.72); border-top:0; }
.site-footer .brand{ color:#fff; }
.footer-brand p{ color:rgba(255,255,255,0.72); }
.footer-col h4{ color:#fff; }
.footer-col a, .footer-col p{ color:rgba(255,255,255,0.78); }
.footer-col a:hover{ color:#fff; text-decoration:underline; }
.footer-bottom{ color:rgba(255,255,255,0.5); border-top:1px solid rgba(255,255,255,0.18); font-family:var(--f-mono); }
.footer-bottom a:hover{ color:#fff; }
.footer-top{ border-bottom:0; }

/* sticky call to action on phones */
.sticky-cta{ background:var(--ink) !important; color:#fff !important; border-radius:0 !important; box-shadow:none !important; border:1px solid #fff; font-family:var(--f-mono); }

/* reveal: no float-in; a report does not animate */
.reveal{ opacity:1; transform:none; transition:none; }

/* the tagline */
.eyebrow.tagline{ font-size:20px; letter-spacing:0.06em; border:2px solid var(--seal); display:inline-flex; padding:6px 12px; transform:rotate(-2deg); margin-bottom:6px; }
.tagline-foot{ display:block; font-family:var(--f-mono); font-weight:700; color:#fff; font-size:16px; text-transform:uppercase; letter-spacing:0.06em; margin-bottom:8px; }
