/* Heartland Appraisal Group — standalone, self-hosted website */
:root {
  --black: #050505;
  --surface: #0c0b09;
  --gold: #e5af3c;
  --gold-light: #ffe0a1;
  --cream: #f4ead8;
  --line: rgba(219,166,66,.45);
  --white: #f3efea;
}
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--black); color:var(--white); font-family:Georgia,'Times New Roman',serif; }
button, a { -webkit-tap-highlight-color:transparent; }
button { font:inherit; }
a { color:inherit; }
button:focus-visible,a:focus-visible { outline:3px solid var(--gold-light); outline-offset:4px; }
.skip-link { position:absolute; z-index:20; top:-80px; left:12px; padding:10px 18px; color:#000; background:var(--gold-light); }
.skip-link:focus { top:12px; }
.site-shell { min-height:100vh; background:var(--black); overflow:hidden; }
.site-header { height:87px; position:relative; z-index:10; display:flex; align-items:center; justify-content:flex-end; gap:clamp(22px,3vw,52px); padding:0 clamp(30px,3.6vw,65px); border-bottom:1px solid rgba(220,169,72,.12); background:rgba(3,3,3,.94); }
.brand { position:absolute; z-index:12; left:clamp(28px,4.8vw,77px); top:11px; width:clamp(235px,19.6vw,307px); line-height:0; filter:drop-shadow(0 2px 2px rgba(0,0,0,.3)); }
.brand img { display:block; width:100%; height:auto; }
.primary-nav { display:flex; align-items:center; gap:clamp(19px,2.5vw,43px); white-space:nowrap; margin-left:auto; }
.primary-nav a,.primary-nav button { appearance:none; background:none; border:0; margin:0; padding:9px 0; text-decoration:none; color:var(--cream); cursor:pointer; font-family:Georgia,'Times New Roman',serif; text-transform:uppercase; font-size:clamp(11px,.91vw,14px); font-weight:bold; letter-spacing:.13em; transition:color .2s ease; position:relative; }
.primary-nav a:hover,.primary-nav button:hover { color:var(--gold-light); }
.primary-nav a::after,.primary-nav button::after { content:''; position:absolute; height:2px; left:0; bottom:0; width:0; background:var(--gold); transition:width .2s ease; }
.primary-nav a:hover::after,.primary-nav button:hover::after,.primary-nav a[aria-current]::after { width:100%; }
.primary-nav a[aria-current] { color:var(--gold); }
.btn { border:1px solid rgba(255,219,145,.22); display:inline-flex; justify-content:center; align-items:center; gap:26px; color:#150f07; background:linear-gradient(115deg,#d9a434,#f2ca70 53%,#dba73e 100%); padding:16px 24px; font-family:Georgia,'Times New Roman',serif; font-size:13px; letter-spacing:.12em; font-weight:700; text-decoration:none; text-transform:uppercase; transition:filter .2s ease,transform .2s ease; text-align:center; white-space:nowrap; }
.btn:hover { filter:brightness(1.1); transform:translateY(-1px); }
.btn-header { min-height:52px; padding:15px 27px; }
.menu-toggle { display:none; }
.hero { position:relative; isolation:isolate; height:clamp(405px,46.4vh,485px); background:#221911; overflow:hidden; }
.hero-landscape { position:absolute; inset:0; z-index:-2; background:url('assets/sunset-heartland.webp') center 52% / cover no-repeat; }
.hero-shade { position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(0,0,0,.97) 0%,rgba(0,0,0,.83) 18%,rgba(0,0,0,.5) 36%,rgba(0,0,0,.14) 64%,rgba(0,0,0,.04) 100%),linear-gradient(180deg,rgba(0,0,0,.12) 0%,transparent 55%,rgba(0,0,0,.23) 100%); }
.hero-content { position:relative; padding-left:clamp(30px,4.55vw,77px); padding-right:20px; padding-top:clamp(115px,14.5vh,152px); max-width:950px; }
h1 { margin:0; max-width:810px; color:var(--cream); font-size:clamp(49px,4.65vw,80px); line-height:.98; font-weight:500; letter-spacing:-.038em; text-shadow:0 2px 12px rgba(0,0,0,.12); }
h1 span { display:block; background:linear-gradient(95deg,#e2a83c 0%,#fff1c4 76%); color:transparent; -webkit-background-clip:text; background-clip:text; }
.hero p { margin:23px 0 20px 4px; max-width:630px; color:#f1e9dd; font-size:clamp(18px,1.65vw,25px); line-height:1.32; text-shadow:0 1px 4px #000; }
.btn-hero { margin-left:4px; min-height:54px; padding:16px 33px; }
.btn-hero span { font-size:25px; font-weight:400; line-height:0; }
.services { background:radial-gradient(ellipse at 3% 100%,rgba(105,60,19,.18),transparent 33%),var(--black); padding:23px clamp(28px,4.5vw,73px) 16px; }
.section-heading { display:flex; gap:17px; align-items:center; margin-bottom:17px; }
.section-heading h2 { color:var(--gold); font-size:clamp(15px,1.26vw,20px); line-height:1; text-transform:uppercase; letter-spacing:.17em; white-space:nowrap; font-weight:500; margin:0; }
.heading-rule { height:1px; background:var(--gold); flex:1; opacity:.85; }
.service-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:clamp(12px,1.14vw,20px); }
.service-card { min-width:0; min-height:345px; border:1px solid rgba(192,145,64,.31); background:linear-gradient(150deg,#100c08 0%,#020202 77%); display:flex; flex-direction:column; overflow:hidden; transition:border-color .2s ease,transform .2s ease; }
.service-card:hover { border-color:rgba(232,178,78,.8); transform:translateY(-2px); }
.service-photo { height:113px; position:relative; overflow:hidden; flex-shrink:0; }
.service-photo img { display:block; width:100%; height:100%; object-fit:cover; object-position:50% 15%; filter:saturate(.87); }
.service-photo::after { position:absolute; content:''; inset:15% 0 0; background:linear-gradient(0deg,rgba(0,0,0,.75),transparent 90%); }
.card-number { position:absolute; z-index:1; top:8px; left:16px; font-size:51px; line-height:1; color:rgba(244,197,113,.23); }
.service-details { display:flex; flex:1; flex-direction:column; padding:7px clamp(12px,1.45vw,22px) 15px; }
.service-details h3 { margin:0 0 10px; min-height:55px; font-weight:500; font-size:clamp(18px,1.65vw,26px); line-height:1.04; letter-spacing:-.02em; color:#f8f0e7; }
.service-details p { margin:0; font-size:clamp(13.5px,1.06vw,17px); line-height:1.35; color:#dbd8d2; }
.service-more { align-self:flex-start; background:none; border:0; color:var(--gold); text-transform:uppercase; cursor:pointer; padding:10px 0 0; margin-top:auto; font-family:Georgia,'Times New Roman',serif; font-weight:700; font-size:clamp(12px,.98vw,15px); letter-spacing:.045em; }
.service-more span { font-weight:400; font-size:21px; margin-left:7px; vertical-align:-1px; }
.service-more:hover { text-decoration:underline; text-underline-offset:4px; }
.footer-note { display:flex; align-items:center; justify-content:space-between; padding:2px clamp(28px,4.5vw,73px) 9px; color:rgba(224,209,181,.45); font-family:Arial,Helvetica,sans-serif; font-size:10px; letter-spacing:.04em; }
/* Dialogs keep the landing page visually identical to the approved reference. */
dialog { width:min(630px,calc(100vw - 36px)); max-height:min(80vh,800px); padding:0; border:1px solid rgba(229,175,60,.55); background:linear-gradient(145deg,#19150f,#070707 78%); color:var(--cream); box-shadow:0 24px 90px rgba(0,0,0,.85); }
dialog::backdrop { background:rgba(0,0,0,.82); backdrop-filter:blur(5px); }
.dialog-inner { padding:clamp(24px,4vw,49px); }
.dialog-top { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.dialog-eyebrow { color:var(--gold); font:700 12px Arial,sans-serif; text-transform:uppercase; letter-spacing:.2em; }
.dialog-close { appearance:none; color:var(--gold-light); background:transparent; font-size:32px; line-height:1; border:0; cursor:pointer; min-height:44px; min-width:44px; }
dialog h2 { color:var(--cream); font-size:clamp(30px,4vw,46px); line-height:1.06; font-weight:500; letter-spacing:-.03em; margin:16px 0 21px; }
.dialog-content { font-family:Georgia,serif; color:#eee1ce; font-size:17px; line-height:1.65; }
.dialog-content p { margin:0 0 16px; }
.dialog-content a { color:var(--gold-light); text-underline-offset:3px; }
.dialog-content .county-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; list-style:none; margin:18px 0; padding:0; }
.county-list li { border:1px solid var(--line); padding:9px 12px; font-size:15px; }
.dialog-content .contact-row { margin:14px 0; font-size:19px; }
.dialog-content .contact-label { display:block; font:700 11px Arial,sans-serif; text-transform:uppercase; letter-spacing:.16em; color:var(--gold); padding-bottom:4px; }
.dialog-actions { display:flex; margin-top:22px; }
.dialog-cta { font-size:12px; }
@media (max-height:870px) and (min-width:1201px) {
  .site-header { height:78px; }
  .brand { width:250px; }
  .hero { height:clamp(365px,48vh,430px); }
  .hero-content { padding-top:112px; }
  h1 { font-size:clamp(49px,4.5vw,70px); }
  .hero p { margin-top:15px; margin-bottom:15px; }
  .services { padding-top:15px; padding-bottom:10px; }
  .section-heading { margin-bottom:11px; }
  .service-card { min-height:296px; }
  .service-photo { height:95px; }
  .service-details h3 { min-height:42px; }
}
@media (max-width:1200px) {
  .site-header { height:82px; }
  .brand { width:220px; top:8px; }
  .primary-nav { gap:16px; }
  .primary-nav a,.primary-nav button { font-size:11px; letter-spacing:.07em; }
  .btn-header { padding:13px 17px; font-size:10px; }
  .service-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .service-details h3 { min-height:unset; }
  .service-card { min-height:330px; }
  .service-photo { height:148px; }
}
@media (max-width:960px) {
  .site-header { height:83px; justify-content:flex-end; padding:0 24px; gap:15px; }
  .brand { left:20px; width:168px; top:5px; }
  .btn-header { margin-left:auto; margin-right:48px; }
  .menu-toggle { display:flex; flex-direction:column; gap:5px; position:absolute; right:20px; top:19px; width:44px; height:44px; border:1px solid rgba(220,169,72,.45); border-radius:0; background:rgba(0,0,0,.45); align-items:center; justify-content:center; cursor:pointer; z-index:40; }
  .menu-toggle span { width:21px; height:2px; background:var(--gold-light); }
  .primary-nav { display:none; position:absolute; top:83px; left:0; right:0; padding:18px 24px 23px; background:rgba(2,2,2,.98); box-shadow:0 20px 35px rgba(0,0,0,.8); border-bottom:1px solid var(--line); flex-direction:column; align-items:stretch; gap:4px; }
  .primary-nav.is-open { display:flex; }
  .primary-nav a,.primary-nav button { font-size:14px; padding:14px 8px; text-align:left; }
  .hero { height:475px; }
  .hero-content { padding-top:116px; }
  h1 { font-size:clamp(45px,6vw,66px); }
  .hero p { max-width:620px; }
  .service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px) {
  .site-header { height:78px; }
  .brand { width:137px; left:10px; top:5px; }
  .btn-header { margin-right:46px; min-height:41px; padding:9px 9px; font-size:9px; white-space:normal; max-width:146px; line-height:1.2; }
  .menu-toggle { top:17px; right:12px; }
  .primary-nav { top:78px; }
  .hero { height:auto; min-height:590px; }
  .hero-landscape { background-position:63% center; }
  .hero-shade { background:linear-gradient(90deg,rgba(0,0,0,.88) 0,rgba(0,0,0,.49) 80%,rgba(0,0,0,.27)),linear-gradient(180deg,rgba(0,0,0,.2),transparent 70%,rgba(0,0,0,.8)); }
  .hero-content { padding:94px 22px 60px; }
  h1 { font-size:clamp(42px,11vw,60px); line-height:1.04; letter-spacing:-.042em; }
  .hero p { font-size:19px; margin:25px 0 25px; line-height:1.5; }
  .btn-hero { margin:0; font-size:11px; min-height:52px; padding:13px 19px; white-space:normal; }
  .services { padding:32px 20px 21px; }
  .section-heading { gap:10px; margin-bottom:19px; }
  .section-heading h2 { white-space:normal; line-height:1.35; font-size:14px; }
  .service-grid { grid-template-columns:1fr; gap:18px; }
  .service-card { min-height:300px; }
  .service-photo { height:150px; }
  .service-details { padding:13px 18px 17px; }
  .service-details h3 { font-size:24px; }
  .service-details p { font-size:16px; }
  .service-more { font-size:14px; margin-top:18px; }
  .footer-note { flex-direction:column; align-items:flex-start; gap:5px; padding:6px 20px 21px; }
  .dialog-content .county-list { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after {scroll-behavior:auto!important;transition:none!important;} }
