/*
Theme Name: Real Estate Solo
Theme URI: https://estate-solo.com
Author: Real Estate Solo
Description: Editorial WordPress theme for Real Estate Solo Resources.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.1
Text Domain: real-estate-solo
*/

:root {
  --res-paper: #fffdf8;
  --res-surface: #f6f3ec;
  --res-ink: #46515e;
  --res-deep: #26313c;
  --res-muted: #68737e;
  --res-lime: #d5f46c;
  --res-coral: #ff7a59;
  --res-sage: #b8c5a8;
  --res-sand: #e9dfd1;
  --res-line: rgba(38, 49, 60, .15);
  --res-shell: min(1240px, calc(100vw - 56px));
  --res-radius: 24px;
  --res-ease: cubic-bezier(.22, .75, .18, 1);
}

* { box-sizing: border-box; }
html { overflow-x: clip; scroll-behavior: smooth; }
body { margin: 0; overflow-x: clip; color: var(--res-ink); background: var(--res-paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; }
button, input, textarea { font: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-weight: 560; letter-spacing: -.052em; line-height: .98; }
.res-shell { width: var(--res-shell); margin-inline: auto; }
.res-skip { position: fixed; z-index: 1000; left: 16px; top: -100px; padding: 11px 16px; color: var(--res-deep); background: var(--res-lime); border-radius: 10px; }
.res-skip:focus { top: 16px; }
:focus-visible { outline: 3px solid var(--res-coral); outline-offset: 4px; }

.res-header { position: absolute; z-index: 100; top: 0; left: 0; width: 100%; color: var(--res-paper); background: var(--res-ink); border-bottom: 1px solid rgba(255,253,248,.18); }
.admin-bar .res-header { top: 32px; }
.res-header-inner { min-height: 83px; display: flex; align-items: center; gap: 24px; }
.res-brand { min-width: 255px; display: inline-flex; align-items: center; gap: 11px; }
.res-brand-symbol { width: 34px; height: 34px; padding: 6px; display: grid; grid-template-columns: 1fr 1fr; gap: 3px; background: rgba(255,255,255,.08); border-radius: 10px; }
.res-brand-symbol i { display: block; border-radius: 2px; }
.res-brand-symbol i:nth-child(1) { background: var(--res-lime); }
.res-brand-symbol i:nth-child(2) { background: var(--res-coral); border-radius: 2px 7px 2px 2px; }
.res-brand-symbol i:nth-child(3) { background: var(--res-surface); border-radius: 2px 2px 2px 7px; }
.res-brand-symbol i:nth-child(4) { background: var(--res-sage); }
.res-brand-copy { display: grid; line-height: 1.05; }
.res-brand-copy strong { color: var(--res-paper); font-size: 13px; font-weight: 760; letter-spacing: -.025em; }
.res-brand-copy small { margin-top: 5px; color: rgba(255,253,248,.58); font-size: 8px; font-weight: 700; letter-spacing: .1em; }
.res-brand-prefix { font-weight: 560; opacity: .64; }
.res-brand-highlight { color: var(--res-lime); font-weight: 820; }
.res-desktop-nav { margin-left: auto; display: flex; align-items: center; gap: 27px; color: rgba(255,255,255,.82); font-size: 13px; font-weight: 650; }
.res-desktop-nav a { padding: 28px 0; }
.res-desktop-nav a[aria-current="page"] { color: var(--res-lime); }
.res-actions { display: flex; align-items: center; gap: 15px; }
.res-contact { color: rgba(255,255,255,.82); font-size: 14px; font-weight: 700; }
.res-button { min-height: 42px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; color: var(--res-deep); background: var(--res-lime); border-radius: 999px; font-size: 14px; font-weight: 750; transition: transform 180ms var(--res-ease); }
.res-button:hover { transform: translateY(-2px); }
.res-mobile-menu { display: none; }

.res-hero { padding: 190px 0 115px; color: var(--res-deep); background: var(--res-lime); }
.res-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 24px; color: var(--res-coral); font-size: 11px; font-weight: 780; letter-spacing: .12em; text-transform: uppercase; }
.res-eyebrow::before { content: ""; width: 18px; height: 2px; background: currentColor; }
.res-hero h1 { max-width: 980px; margin-bottom: 28px; font-size: clamp(3.9rem, 8.2vw, 8.25rem); }
.res-hero p { max-width: 720px; margin: 0; color: rgba(38,49,60,.76); font-size: clamp(1.1rem, 1.55vw, 1.35rem); line-height: 1.55; letter-spacing: -.015em; }

.res-index { padding: 112px 0 120px; }
.res-categories { margin-bottom: 55px; display: flex; flex-wrap: wrap; gap: 7px; }
.res-categories a { padding: 7px 11px; color: var(--res-muted); border: 1px solid var(--res-line); border-radius: 8px; font-size: 9px; }
.res-categories a:first-child, .res-categories a[aria-current="page"] { color: var(--res-paper); background: var(--res-ink); border-color: var(--res-ink); }
.res-post-list { border-top: 1px solid var(--res-line); }
.res-post-card { padding: 42px 0; display: grid; grid-template-columns: 60px 1fr 55px; gap: 30px; align-items: center; border-bottom: 1px solid var(--res-line); }
.res-post-number { color: var(--res-coral); font-size: 9px; font-weight: 760; }
.res-post-meta { color: var(--res-coral); font-size: 9px; font-weight: 740; letter-spacing: .09em; text-transform: uppercase; }
.res-post-card h2 { max-width: 930px; margin: 12px 0; font-size: clamp(2rem, 3.7vw, 4rem); }
.res-post-card h2 a:hover { color: var(--res-deep); }
.res-post-card p { max-width: 720px; margin-bottom: 16px; color: var(--res-muted); }
.res-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.res-tags span { padding: 4px 7px; background: var(--res-surface); border-radius: 5px; font-size: 8px; }
.res-round-arrow { width: 46px; height: 46px; display: grid; place-items: center; color: var(--res-paper); background: var(--res-ink); border-radius: 13px; transition: transform 180ms var(--res-ease); }
.res-round-arrow:hover { transform: translate(2px,-2px); }
.res-empty { padding: 70px 0; color: var(--res-muted); font-size: 18px; }
.nav-links { padding-top: 48px; display: flex; justify-content: space-between; gap: 20px; }
.nav-links a { font-weight: 730; }

.res-article-hero { padding: 170px 0 100px; background: var(--res-surface); }
.res-breadcrumbs { margin-bottom: 45px; display: flex; flex-wrap: wrap; gap: 8px; color: var(--res-muted); font-size: 9px; }
.res-breadcrumbs a { text-decoration: underline; }
.res-article-head { display: grid; grid-template-columns: 1fr 310px; gap: 7vw; align-items: end; }
.res-article-hero h1 { margin-bottom: 27px; font-size: clamp(3.8rem, 7.2vw, 7.7rem); }
.res-article-deck { max-width: 760px; color: var(--res-muted); font-size: clamp(1.1rem, 1.55vw, 1.35rem); }
.res-article-meta { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 18px; color: var(--res-muted); font-size: 9px; }
.res-article-art { position: relative; overflow: hidden; min-height: 420px; padding: 25px; display: flex; flex-direction: column; justify-content: space-between; background: var(--res-coral); border-radius: 32px; box-shadow: 0 24px 58px rgba(38,49,60,.12); }
.res-article-art::before { content: ""; position: absolute; width: 80%; height: 70%; right: -20%; bottom: -10%; background: rgba(255,255,255,.55); border-radius: 150px 0 0 0; }
.res-article-art span, .res-article-art strong { position: relative; z-index: 1; }
.res-article-art span { font-size: 9px; font-weight: 760; letter-spacing: .1em; text-transform: uppercase; }
.res-article-art strong { font-size: 23px; line-height: 1.12; }
.res-article-layout { padding: 100px 0; display: grid; grid-template-columns: 230px minmax(0, 720px); gap: 8vw; justify-content: center; }
.res-article-aside { position: sticky; top: 40px; height: max-content; padding-top: 16px; border-top: 1px solid var(--res-line); }
.res-article-aside span { font-size: 9px; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.res-article-aside p { margin: 9px 0; color: var(--res-muted); font-size: 10px; }
.res-article-aside a { display: block; margin-top: 25px; color: #9f421f; font-size: 10px; font-weight: 730; }
.res-article-body { font-size: 19px; line-height: 1.8; }
.res-article-body > *:first-child { margin-top: 0; }
.res-article-body h2 { margin: 62px 0 20px; font-size: 43px; }
.res-article-body h3 { margin: 38px 0 16px; font-size: 27px; }
.res-article-body a { color: #9f421f; text-decoration: underline; }
.res-article-body blockquote { margin: 35px 0; padding: 24px 28px; background: var(--res-surface); border-left: 3px solid var(--res-coral); }
.res-article-body ul, .res-article-body ol { padding-left: 24px; }
.res-article-body figure { margin: 42px 0; }
.res-article-body figcaption { margin-top: 8px; color: var(--res-muted); font-size: 12px; }
.res-cta { width: var(--res-shell); margin: 0 auto 72px; padding: 64px; color: var(--res-paper); background: var(--res-ink); border-radius: 30px; }
.res-cta h2 { max-width: 780px; margin-bottom: 22px; font-size: clamp(2.7rem, 5vw, 5rem); }
.res-cta p { max-width: 650px; color: rgba(255,253,248,.68); }
.res-cta .res-button { margin-top: 18px; }

.res-footer { margin-top: 0; padding: 80px 0 30px; color: var(--res-paper); background: var(--res-ink); }
.res-footer-lead { padding-bottom: 55px; display: flex; justify-content: space-between; align-items: end; border-bottom: 1px solid rgba(255,255,255,.18); }
.res-footer-lead p { max-width: 430px; margin: 0; font-size: 28px; font-weight: 550; letter-spacing: -.045em; }
.res-footer-grid { padding: 45px 0; display: grid; grid-template-columns: repeat(4,1fr); gap: 35px; }
.res-footer-grid h2 { margin-bottom: 15px; color: var(--res-paper); font-size: 9px; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.res-footer-grid a { display: block; padding: 4px 0; color: var(--res-paper); opacity: .72; font-size: 11px; }
.res-footer-grid a:hover { opacity: 1; }
.res-footer-bottom { padding-top: 20px; display: flex; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.18); color: rgba(255,255,255,.7); font-size: 9px; }

@media (max-width: 1080px) {
  :root { --res-shell: min(100% - 40px, 940px); }
  .res-desktop-nav { display: none; }
  .res-actions { margin-left: auto; }
  .res-mobile-menu { position: relative; display: block; }
  .res-mobile-menu summary { width: 42px; height: 42px; display: grid; place-content: center; gap: 6px; list-style: none; cursor: pointer; border: 1px solid rgba(255,253,248,.25); border-radius: 12px; }
  .res-mobile-menu summary::-webkit-details-marker { display: none; }
  .res-mobile-menu summary span { width: 17px; height: 1px; background: var(--res-paper); }
  .res-mobile-menu[open] summary { background: var(--res-lime); border-color: var(--res-lime); }
  .res-mobile-menu[open] summary span { background: var(--res-deep); }
  .res-mobile-menu nav { position: absolute; top: 52px; right: 0; width: 290px; max-height: calc(100vh - 100px); overflow-y: auto; padding: 13px; display: grid; color: var(--res-ink); background: var(--res-paper); border: 1px solid var(--res-line); border-radius: 16px; box-shadow: 0 28px 70px rgba(25,34,45,.22); }
  .res-mobile-menu nav small { padding: 12px 10px 5px; border-left: 3px solid var(--res-coral); font-size: 8px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
  .res-mobile-menu nav a { padding: 10px; border-bottom: 1px solid var(--res-line); font-size: 12px; }
}

@media (max-width: 780px) {
  :root { --res-shell: calc(100% - 30px); }
  .admin-bar .res-header { top: 46px; }
  .res-header-inner { min-height: 74px; }
  .res-brand { min-width: 0; }
  .res-brand-copy { display: none; }
  .res-contact { display: none; }
  .res-hero { padding: 145px 0 90px; }
  .res-hero h1 { font-size: clamp(3.4rem, 16vw, 5.5rem); }
  .res-index { padding: 82px 0 94px; }
  .res-post-card { grid-template-columns: 35px 1fr; gap: 16px; }
  .res-round-arrow { display: none; }
  .res-article-hero { padding: 135px 0 80px; }
  .res-article-head { grid-template-columns: 1fr; }
  .res-article-hero h1 { font-size: clamp(3.2rem, 14vw, 5rem); }
  .res-article-art { min-height: 330px; }
  .res-article-layout { padding: 70px 0; grid-template-columns: 1fr; gap: 35px; }
  .res-article-aside { position: static; }
  .res-cta { margin-bottom: 40px; padding: 38px 24px; }
  .res-footer-lead { align-items: start; flex-direction: column; gap: 40px; }
  .res-footer-grid { grid-template-columns: 1fr 1fr; }
  .res-footer-bottom { gap: 15px; flex-direction: column; }
}

@media (max-width: 430px) {
  .res-footer-grid { grid-template-columns: 1fr; }
  .res-article-meta { flex-direction: column; gap: 4px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
