/* Listing Clarity — hospitality advisory visual layer.
   Keeps the proven service flow and removes the youthful agency styling. */
:root {
  --bg: #eef1ee;
  --paper: #fbfcf9;
  --ink: #1f2a25;
  --muted: #66706b;
  --line: #c6cec8;
  --blue: #315261;
  --lime: #dfe7e1;
  --ok: #3f6a52;
  --danger: #8a493f;
  --max: 1220px;
}

html { background: var(--bg); }
body {
  background: var(--bg);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-feature-settings: "kern", "ss01";
}

.shell { width: min(calc(100% - 56px), var(--max)); }
.scroll-progress i { background: #597363; }
.site-header {
  border-color: rgba(31, 42, 37, .14);
  background: rgba(251, 252, 249, .94);
  box-shadow: 0 1px 0 rgba(31, 42, 37, .04);
}
.nav { min-height: 76px; }
.brand { gap: 11px; letter-spacing: -.018em; }
.brand-mark {
  width: 31px;
  height: 31px;
  border-radius: 2px;
  background: #385747;
  color: #fff;
  font-size: 13px;
}
.nav-links { gap: 27px; }
.nav-links a { color: #56615c; font-size: 12px; }
.nav-links a:hover { color: var(--ink); }
.locale-switch {
  border-color: #aeb8b1;
  border-radius: 3px;
  background: transparent;
}
.locale-switch button { border-radius: 1px; }
.locale-switch button[aria-pressed="true"] { background: #e3e8e4; }
.button,
.button-small {
  border-color: #385747;
  border-radius: 3px;
  background: #385747;
  color: #fff;
  box-shadow: none;
}
.button:hover,
.button-small:hover { background: #2e493b; transform: none; }
.text-link { color: #314f43; text-decoration-color: #9aac9f; }

.hero {
  padding: 86px 0 82px;
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(90deg, rgba(255,255,255,.52) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(rgba(255,255,255,.42) 1px, transparent 1px) 0 0 / 80px 80px,
    #eef1ee;
}
.hero-grid { grid-template-columns: .88fr 1.12fr; gap: 72px; }
.eyebrow { gap: 8px; }
.eyebrow span {
  padding: 7px 9px;
  border: 1px solid #aeb8b1;
  border-radius: 2px;
  background: rgba(251,252,249,.8);
  color: #53625a;
  font-size: 9px;
  letter-spacing: .08em;
}
.eyebrow span:last-child { background: #ebe5d9; color: #655944; }
.hero h1 {
  max-width: 680px;
  margin-top: 25px;
  font-size: clamp(50px, 5.15vw, 72px);
  line-height: .99;
  letter-spacing: -.055em;
  font-weight: 660;
}
.lead { max-width: 590px; color: #58645e; font-size: 18px; line-height: 1.65; }
.hero-actions { margin-top: 31px; }
.promise-row {
  margin-top: 42px;
  border-top: 1px solid #aeb8b1;
  border-bottom: 1px solid #aeb8b1;
}
.promise-row span { padding: 17px 19px 17px 0; }
.promise-row span + span { padding-left: 19px; border-color: #bdc5bf; }
.promise-row b { font-size: 14px; }
.promise-row small { color: #717b75; font-size: 9px; letter-spacing: .04em; }
.hero-visual {
  min-height: 590px;
  border: 0;
  border-radius: 3px;
  background: #d9ded9;
  box-shadow: 0 20px 50px rgba(31,42,37,.12);
}
.hero-visual:after {
  content: "REVIEW COPY  /  01";
  position: absolute;
  right: 18px;
  top: 18px;
  padding: 8px 10px;
  border: 1px solid rgba(255,255,255,.7);
  background: rgba(25,38,31,.72);
  color: #fff;
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .1em;
}
.hero-visual > img { min-height: 590px; }
.photo-badge {
  left: 24px;
  bottom: 76px;
  width: min(365px, calc(100% - 48px));
  padding: 18px;
  border: 0;
  border-radius: 2px;
  background: rgba(251,252,249,.96);
  box-shadow: 0 9px 28px rgba(20,30,25,.18);
}
.photo-badge span { color: #385747; }
.photo-badge p { color: #4f5a54; }
.visual-note { background: rgba(28,42,35,.94); }

.trust-strip { border-color: #304139; background: #26362f; color: #e9eeea; }
.trust-strip p + p { border-color: #4e6157; }
.section { padding-block: 92px; }
.section-heading { grid-template-columns: 210px 1fr; gap: 42px; margin-bottom: 43px; }
.section-heading > span { color: #5e6c64; }
.section-heading h2 { font-size: clamp(36px, 3.55vw, 51px); line-height: 1.04; letter-spacing: -.045em; }
.section-heading p { color: #65706a; }

.sample-switcher { border-color: #a9b3ac; border-radius: 3px; background: #f8faf7; }
.sample-switcher button { border-color: #c0c8c2; }
.sample-switcher button > span { border-radius: 2px; }
.sample-switcher button[aria-selected="true"] { background: #31453b; }
.sample-switcher button[aria-selected="true"] > span { border-color: #cbd7cf; background: #cbd7cf; }
.sample-insight { border-color: #acb9b2; border-radius: 3px; background: #dde5e1; }
.sample-insight p { color: #4c5a53; }
.demo-browser,
.review-card,
.copy-rewrite,
.service-grid article,
.method-ledger,
.trust-dossier,
.order-summary,
.order-panel { border-radius: 4px; }
.demo-browser { border-color: #9eaaa3; box-shadow: 0 8px 24px rgba(31,42,37,.08); }
.browser-bar { background: #e9ede9; }
.listing-photo-grid figure { border-radius: 2px; }
.listing-photo-grid figcaption { border-radius: 2px; }
.review-card {
  border-color: #2f4138;
  background: #26362f;
  box-shadow: 8px 8px 0 #aab7af;
}
.review-hero-thumb,
.review-card li img { border-radius: 2px; }
.review-hero-thumb strong {
  width: 44px;
  height: 44px;
  border-radius: 2px;
  background: #d7e0da;
}
.copy-rewrite { border-color: #9daba2; background: #e3e9e5; }
.deliverables { border-color: #adb8b1; background: #e5e9e5; }
.service-grid { gap: 16px; }
.service-grid article,
.service-grid article:nth-child(2),
.service-grid article:nth-child(3) {
  min-height: 285px;
  border-color: #a6b1aa;
  background: #fafbf8;
  box-shadow: none;
}
.service-icon {
  border-radius: 3px;
  background: #dfe7e1;
  color: #324c3e;
}
.service-grid h3 { margin-top: 83px; }
.process-list { border-color: #8f9d95; }
.process-list li { border-color: #c2cac4; }
.process-list li > span { border-radius: 2px; }

.method-section { border-color: #30433a; background: #26362f; }
.method-ledger { border-color: #63756b; }
.method-ledger header,
.method-ledger li { border-color: #53665c; }
.method-ledger header span,
.method-ledger li > b { color: #cbd7cf; }
.method-ledger li > b { border-radius: 2px; }
.trust-dossier {
  border-color: #9aa8a0;
  background: #eef2ef;
  box-shadow: none;
}
.faq-section { border-color: #aab5ae; background: #e5e9e5; }
.faq-list,
.faq-list details { border-color: #9eaaa3; }

.order-section { background: #223129; }
.order-summary { border-color: #61736a; background: #2b3c33; }
.order-summary > p { border-radius: 3px; background: #35483e; }
.order-summary li:before { color: #b9cbbf; }
.order-panel { box-shadow: 0 18px 45px rgba(0,0,0,.16); }
.panel-head { background: #f2f5f2; }
.payment-state { border-radius: 3px; }
input, textarea { border-radius: 3px; background: #fdfefc; }
.check { border-radius: 3px; }
.pay-button {
  border-color: #345443;
  border-radius: 3px;
  background: #3d614e;
  color: #fff;
}
.pay-button:disabled { border-color: #bdc4bf; background: #dfe3df; color: #858d88; }
.floating-order {
  border-color: #6f7f76;
  border-radius: 4px;
  background: rgba(251,252,249,.96);
}
.floating-order > a { border-radius: 3px; background: #385747; }
.floating-order > a i { color: #d9e4dc; }

@media (max-width: 940px) {
  .hero-grid { grid-template-columns: 1fr; gap: 42px; }
}
@media (max-width: 620px) {
  .shell { width: min(calc(100% - 30px), var(--max)); }
  .hero { padding: 52px 0 58px; }
  .hero h1 { font-size: 43px; }
  .hero-visual, .hero-visual > img { min-height: 460px; }
  .section { padding-block: 64px; }
  .section-heading { grid-template-columns: 1fr; }
  .sample-switcher { border-radius: 3px; }
  .sample-switcher button { min-height: 78px; }
  .sample-insight { min-height: 0; }
}
