/* Business Adverts - site styles (design A: classifieds) */
:root{--blue:#0b5bd3;--blue-dark:#08408f;--ink:#111;--text:#333;--muted:#5f5f5f;--line:#111;--soft:#fbfaf7;--hl:#dbe8ff;--rule:#d8d4c8;
--head:Oswald,Impact,"Arial Narrow Bold","Arial Narrow",sans-serif;--body:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
*{box-sizing:border-box}
body{margin:0;font-family:var(--body);color:var(--ink);background:var(--soft);line-height:1.55;font-size:16px}
a{color:var(--ink)}a:hover{color:var(--blue)}
img{max-width:100%}
h1,h2{font-family:var(--head);text-transform:uppercase;letter-spacing:.01em;line-height:1.05;color:var(--ink);font-weight:700}
h3{line-height:1.2}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.pad{padding-top:40px;padding-bottom:48px}
.skip{position:absolute;left:-9999px}.skip:focus{left:10px;top:10px;background:#fff;padding:8px 12px;z-index:10}

/* header */
.top{background:#fff;border-bottom:3px solid var(--line)}
.bar{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between;padding-top:14px;padding-bottom:14px}
.logo{text-decoration:none;font-family:var(--head);font-weight:700;font-size:32px;line-height:1;letter-spacing:.01em}
.logo .b1{color:var(--blue)}.logo .b2{color:var(--ink)}
.nav{display:flex;flex-wrap:wrap;gap:6px 20px;align-items:center;font-size:15px;font-weight:500}
.nav a{text-decoration:none}
.btn{display:inline-block;background:var(--ink);color:#fff !important;text-decoration:none;padding:10px 16px;font-weight:700;border:0;cursor:pointer;font-size:15px;font-family:inherit;line-height:1.3}
.btn:hover{background:#333}
.btn.hl{background:var(--hl);color:var(--ink) !important;padding:15px 24px;font-size:17px;border:2px solid var(--ink)}
.btn.light{background:var(--hl);color:var(--ink) !important}
.btn.green{background:#15803d}
.crumbs{font-size:14px;color:var(--muted);padding-top:14px}.crumbs a{color:var(--muted)}

/* hero */
.hero{background:var(--hl);border-bottom:3px solid var(--line)}
.heroin{padding-top:52px;padding-bottom:46px;display:flex;flex-wrap:wrap;gap:30px;align-items:flex-end;justify-content:space-between}
.hero .txt{flex:1 1 520px}
.hero .kicker{margin:0 0 10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:13px}
.hero h1{margin:0 0 14px;font-size:clamp(38px,6vw,60px)}
.hero p.lead{margin:0;font-size:18px;max-width:520px}
.search{flex:1 1 360px;display:flex;flex-direction:column;gap:10px;background:#fff;border:3px solid var(--line);padding:18px}
.search label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:700;text-transform:uppercase}
.search input{padding:12px;border:2px solid var(--line);font-size:16px;font-family:inherit;background:#fff;color:var(--ink)}
.search button{min-height:50px;font-size:17px}
.pagehead{background:var(--hl);border-bottom:3px solid var(--line)}
.pagehead .wrap{padding-top:26px;padding-bottom:26px}
.pagehead h1{margin:0 0 6px;font-size:clamp(28px,4vw,42px)}
.pagehead p{margin:0;max-width:780px}

/* sections */
.sec{padding-top:44px;padding-bottom:12px}
.sechead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:10px;border-bottom:2px solid var(--line);padding-bottom:10px;margin-bottom:22px}
.sechead h2{margin:0;font-size:32px}
.sechead a{font-weight:700}
.grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.links{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0 28px}
.links a{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--rule);text-decoration:none;font-weight:500}
.links small{color:var(--muted);font-weight:400}
.letters{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 18px}
.letters a{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border:2px solid var(--line);background:#fff;text-decoration:none;font-weight:700}
.letters a:hover,.letters a.on{background:var(--ink);color:#fff}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips a{padding:7px 12px;border:2px solid var(--line);background:#fff;text-decoration:none;font-size:14px;font-weight:600}
.chips a:hover{background:var(--hl)}
.chips small{color:var(--muted);font-weight:400}

/* advert cards */
.card{background:#fff;border:2px solid var(--line);display:flex;flex-direction:column}
.card .pic{height:170px;background:#ece9e1;display:flex;align-items:center;justify-content:center;border-bottom:2px solid var(--line);overflow:hidden;text-decoration:none}
.card .pic img{width:100%;height:100%;object-fit:contain;background:#fff}
.card .ph{font-family:var(--head);font-size:56px;color:#a7a294}
.card .body{padding:14px 16px 16px;min-width:0}
.tag{display:inline-block;background:var(--hl);font-size:12px;font-weight:700;padding:2px 8px;text-transform:uppercase}
.badge{display:inline-block;background:var(--ink);color:#fff;font-size:12px;font-weight:700;padding:2px 8px}
.card h3{margin:8px 0 4px;font-size:19px}
.card h3 a{text-decoration:none}
.card .meta{margin:0 0 6px;font-size:14px;color:var(--muted)}
.card .desc{margin:0;font-size:14px;color:var(--text)}
.layout{display:flex;flex-wrap:wrap;gap:28px;padding-top:26px;padding-bottom:30px;align-items:flex-start}
.layout .mainc{flex:999 1 560px;min-width:0}
.layout .side{flex:1 1 260px;min-width:0}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.box{border:2px solid var(--line);padding:16px 18px;background:#fff;margin-bottom:16px}
.box h2,.box h3{margin:0 0 10px;font-size:20px}
.box ul{list-style:none;margin:0;padding:0}.box li{padding:4px 0;font-size:15px}
.box li a{text-decoration:none}.box li small{color:var(--muted)}
.empty{padding:22px;border:2px dashed var(--line);background:#fff}
.hint{font-size:14px;color:var(--muted);margin-top:4px}
.pager{display:flex;gap:16px;align-items:center;justify-content:center;margin:26px 0 8px;font-size:15px}
.pager a{padding:8px 14px;border:2px solid var(--line);background:#fff;text-decoration:none;font-weight:600}

/* advert page */
.biz{display:flex;flex-wrap:wrap;gap:28px;padding-top:24px;padding-bottom:30px;align-items:flex-start}
.biz .mainc{flex:999 1 560px;min-width:0}.biz .side{flex:1 1 300px;min-width:0}
.bizhead{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.bizhead .logoimg{width:120px;height:120px;border:2px solid var(--line);object-fit:contain;background:#fff}
.bizhead h1{margin:6px 0;font-size:clamp(28px,4vw,40px)}
.bizhead .meta{margin:0;color:var(--muted)}
.about{white-space:pre-line;font-size:16px;color:var(--text)}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin:20px 0}
.gallery img{width:100%;height:150px;object-fit:cover;border:2px solid var(--line)}
.facts{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;font-size:15px}
.facts dt{color:var(--muted)}.facts dd{margin:0;word-break:break-word}
.video{position:relative;padding-top:56.25%;overflow:hidden;margin:18px 0;border:2px solid var(--line)}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* forms + text pages */
.prose{max-width:820px}
.prose h2{margin:28px 0 8px;font-size:26px}.prose h3{margin:20px 0 6px;font-size:18px}
.prose p,.prose li{color:var(--text)}
.form label{display:block;font-weight:700;margin:14px 0 5px}
.form input[type=text],.form input[type=email],.form input[type=url],.form input[type=tel],.form input[type=password],.form select,.form textarea{width:100%;padding:11px 12px;border:2px solid var(--line);font-size:16px;font-family:inherit;background:#fff;color:var(--ink)}
.form textarea{min-height:200px}
.msg{background:#ecfdf5;border:2px solid #15803d;padding:12px 14px;margin-bottom:16px}
.err{background:#fef2f2;border:2px solid #b91c1c;padding:12px 14px;margin-bottom:16px}
.warn{background:#fffbeb;border:2px solid #b45309;padding:12px 14px;margin-bottom:16px}
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:20px 0}
.tier{border:2px solid var(--line);padding:20px;background:#fff}
.tier.best{background:var(--hl);border-width:3px}
.tier .price{font-family:var(--head);font-size:34px;margin:6px 0}
.tier ul{padding-left:18px;margin:10px 0 0;color:var(--text)}

/* call to action + footer */
.cta{background:var(--ink);color:#fff;padding:34px;margin:40px 0 50px;display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between}
.cta h2{margin:0 0 6px;font-size:32px;color:#fff}.cta p{margin:0;color:#d4d4d4;max-width:640px}
.foot{background:#fff;border-top:3px solid var(--line);font-size:14px}
.footin{padding-top:26px;padding-bottom:26px;display:flex;flex-wrap:wrap;gap:14px 24px;justify-content:space-between}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 18px}

@media(max-width:640px){
 .card .pic{height:150px}
 .nav{gap:6px 14px;font-size:14px}
 .heroin{padding-top:34px;padding-bottom:34px}
 .logo{font-size:26px}
}