/* Snellville Urology: warm, provider-first. White ground, soft sage accent. System fonts. */
:root{--bg:#fff;--ink:#22302a;--muted:#55635b;--sage:#4c6b57;--sage-d:#3b5645;--sage-50:#f3f7f4;--sage-100:#e3ece6;--line:#dbe4de;--warm:#fbf8f3;--alert:#8a2c1d;--alert-bg:#fdf3f1;
--serif:"Iowan Old Style","Palatino Linotype",Palatino,Charter,Georgia,serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--r:14px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:1.0625rem/1.65 var(--sans)}
a{color:var(--sage-d);text-underline-offset:.2em}
a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--sage);outline-offset:3px;border-radius:6px}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.2;color:var(--ink);letter-spacing:-.005em}
h1{font-size:clamp(2rem,4.2vw,3.1rem);margin:.2em 0 .4em}
h2{font-size:clamp(1.45rem,2.6vw,1.95rem);margin:1.6em 0 .5em}
h3{font-size:1.2rem;margin:.2em 0 .25em}
.h-small{font-size:1.1rem;margin:0 0 .5rem}
p{margin:.55em 0 .9em}
.wrap{width:min(1140px,calc(100% - 2.5rem));margin-inline:auto}
.skip{position:absolute;left:-9999px}.skip:focus{left:1rem;top:1rem;background:#fff;padding:.6rem 1rem;z-index:9;border:2px solid var(--sage)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.small{font-size:.92rem;color:var(--muted)}
.eyebrow{font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--sage);font-weight:600;margin:0}
.lede{font-size:1.18rem;color:var(--muted);max-width:44em}
/* top line + header */
.topline{background:var(--sage-50);border-bottom:1px solid var(--line);font-size:.9rem}
.topline-in{display:flex;justify-content:space-between;gap:1rem;padding:.4rem 0}
.topline a{font-weight:600;text-decoration:none}
.site-head{border-bottom:1px solid var(--line);background:#fff}
.head-in{display:flex;align-items:center;gap:1.25rem;padding:.8rem 0;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink);margin-right:auto}
.brand-mark{width:2.3rem;height:2.3rem;border-radius:50%;background:var(--sage);color:#fff;display:grid;place-items:center;font:600 1.15rem var(--serif)}
.brand-txt{display:flex;flex-direction:column;line-height:1.15}.brand-txt strong{font:600 1.15rem var(--serif)}.brand-txt small{color:var(--muted);font-size:.8rem}
.nav{list-style:none;display:flex;flex-wrap:wrap;gap:.2rem .9rem;margin:0;padding:0;font-size:.95rem}
.nav a{text-decoration:none;color:var(--ink);padding:.25rem 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current]{border-bottom-color:var(--sage)}
/* buttons */
.btn{display:inline-block;background:var(--sage);color:#fff;text-decoration:none;font-weight:600;padding:.75rem 1.3rem;border-radius:999px;border:2px solid var(--sage)}
.btn:hover{background:var(--sage-d);border-color:var(--sage-d);color:#fff}
.btn-ghost{background:#fff;color:var(--sage-d)}.btn-ghost:hover{background:var(--sage-50);color:var(--ink)}
.btn-sm{padding:.5rem 1rem;font-size:.95rem}
.txtlink{font-weight:600}
.hero-act,.band-act{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center;margin-top:1.2rem}
/* hero */
.hero{padding:3.2rem 0 1.6rem}
.hero h1{max-width:16em}
.hero-g{background:linear-gradient(#fff,var(--sage-50))}
/* doctor grid */
.docs-sec{padding:1.4rem 0 2.4rem}
.sec-head{display:grid;grid-template-columns:1fr 1.2fr;gap:2rem;align-items:end}
.sec-head h2{margin-top:.4em}
.doc-grid{list-style:none;margin:1.2rem 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.doc-grid-2{grid-template-columns:repeat(2,1fr)}
.doc{display:block;padding:1.15rem;border:1px solid var(--line);border-radius:var(--r);background:#fff}
.doc:hover{border-color:var(--sage)}
.mono{flex:none;width:3.6rem;height:3.6rem;border-radius:50%;background:var(--sage-100);color:var(--sage-d);display:grid;place-items:center;font:600 1.2rem var(--serif);border:2px solid #fff;box-shadow:0 0 0 2px var(--sage-100)}
.doc-big .mono{width:4.4rem;height:4.4rem;font-size:1.4rem}
.doc h3{font-size:1.12rem}
.role{margin:0 0 .4rem;color:var(--muted);font-size:.93rem}
.tags{margin:0 0 .4rem}
.tag{display:inline-block;font-size:.78rem;font-weight:600;color:var(--sage-d);background:var(--sage-50);border:1px solid var(--sage-100);border-radius:999px;padding:.05rem .55rem;margin-right:.25rem}
.also{font-size:.88rem;color:var(--muted);margin:.2rem 0 .4rem}
.doc .txtlink{font-size:.93rem}
.apps{border-top:1px solid var(--line);padding-top:.8rem}
.apps summary{cursor:pointer;font-weight:600;color:var(--sage-d)}
.app-list{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem 1.4rem}
.app-list li{display:flex;flex-direction:column;padding:.45rem 0;border-bottom:1px dashed var(--line)}
.app-list span{font-size:.86rem;color:var(--muted)}
.more{font-weight:600}
/* lead topic */
.lead-topic{background:var(--warm);border-block:1px solid #efe8dc;padding:2.4rem 0}
.lt-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:2.4rem}
.lt-main h2{margin-top:.3em}
.lt-side{background:#fff;border:1px solid #efe8dc;border-radius:var(--r);padding:1.3rem 1.4rem}
.ticks{padding-left:1.1rem}.ticks li{margin:.35rem 0}.ticks li::marker{color:var(--sage)}
/* care tiles */
.care-sec{padding:1rem 0 1.5rem}
.care-grid{list-style:none;padding:0;margin:1rem 0;display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem}
.care-grid-wide{grid-template-columns:repeat(2,1fr)}
.care-grid a{display:flex;flex-direction:column;gap:.25rem;height:100%;padding:1rem 1.1rem;border-radius:var(--r);border:1px solid var(--line);text-decoration:none;color:var(--ink);border-left:4px solid var(--sage)}
.care-grid a:hover{background:var(--sage-50)}
.care-grid strong{font-family:var(--serif);font-size:1.08rem}.care-grid span{color:var(--muted);font-size:.93rem}
/* journey */
.journey{padding:1.2rem 0 2rem}
.j-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:2.4rem;align-items:start}
.steps{list-style:none;padding:0;margin:2rem 0 0;counter-reset:s}
.steps li{display:flex;gap:.9rem;align-items:flex-start;padding:.75rem 0;border-bottom:1px solid var(--line)}
.steps span{flex:none;width:2rem;height:2rem;border-radius:50%;border:2px solid var(--sage);color:var(--sage-d);display:grid;place-items:center;font-weight:700}
/* offices */
.offices{padding:.5rem 0 1.5rem}
.o-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0}
.o-card{border:1px solid var(--line);border-radius:var(--r);padding:1.2rem 1.3rem}
address{font-style:normal;margin:.3rem 0 .6rem}
/* guides list */
.guides-sec{padding:.5rem 0 2rem}
.g-list{list-style:none;padding:0;margin:0;columns:2;column-gap:2rem}
.g-list li{break-inside:avoid;padding:.6rem 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column}
.g-list a{font-family:var(--serif);font-size:1.08rem}.g-list span{font-size:.88rem;color:var(--muted)}
/* band */
.band{background:var(--sage-50);border-top:1px solid var(--line);padding:2rem 0;margin-top:2rem}
.band-in{display:grid;grid-template-columns:1.2fr 1fr;gap:1.5rem;align-items:center}
.band h2{margin:.1em 0 .3em}
.backlink{margin-top:1.4rem}
/* inner pages */
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;padding:.9rem 0 0;margin:0;font-size:.88rem;color:var(--muted)}
.crumbs li+li::before{content:"/";margin-right:.4rem;color:var(--line)}
.page-head{padding:1.4rem 0 1rem;border-bottom:1px solid var(--line);margin-bottom:1rem}
.two-col{display:grid;grid-template-columns:1fr 300px;gap:2.4rem;align-items:start}
.nap-card{position:sticky;top:1rem;border:1px solid var(--line);border-top:4px solid var(--sage);border-radius:var(--r);padding:1.2rem;margin-top:1.6rem;background:#fff}
.article{max-width:760px}
.article section h2{margin-top:1.4em}
.er{background:var(--alert-bg);border-left:4px solid var(--alert);padding:.8rem 1rem;border-radius:8px;margin:1.2rem 0;color:#3c1a14}
.au-more{margin-top:2rem;padding-top:1rem;border-top:1px solid var(--line);font-size:.95rem}
.related{margin-top:1.6rem}.related ul{padding-left:1.1rem}
details{border-bottom:1px solid var(--line);padding:.55rem 0}
summary{cursor:pointer;font-weight:600}
.guide .byline{color:var(--muted);font-size:.93rem}
.toc{background:var(--sage-50);border:1px solid var(--line);border-radius:var(--r);padding:.8rem 1.1rem;margin:1rem 0}
.toc ol{margin:.5rem 0 .2rem;padding-left:1.3rem;font-size:.95rem}
.qa h2{font-size:1.3rem}
.g-cta{border:1px solid var(--sage-100);background:var(--sage-50);border-radius:var(--r);padding:1rem 1.2rem;margin:2rem 0 1rem}
.towns{width:100%;border-collapse:collapse;margin:.6rem 0 1rem}
.towns th,.towns td{text-align:left;padding:.6rem .7rem;border-bottom:1px solid var(--line);vertical-align:top}
.towns thead th{background:var(--sage-50);font-size:.9rem}
/* footer */
.site-foot{border-top:1px solid var(--line);margin-top:2.5rem;padding:2rem 0 2.4rem;font-size:.95rem}
.foot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.ft{font-family:var(--serif);font-weight:600;margin:0 0 .3rem}
.flinks{list-style:none;padding:0;margin:0}.flinks li{margin:.25rem 0}
@media (max-width:900px){
 .doc-grid,.app-list{grid-template-columns:1fr 1fr}.care-grid{grid-template-columns:1fr 1fr}
 .sec-head,.lt-grid,.j-grid,.band-in,.two-col{grid-template-columns:1fr}.sec-head{gap:0}.foot-grid{grid-template-columns:1fr 1fr}
 .nap-card{position:static}
}
@media (max-width:600px){
 body{font-size:1rem}
 .doc-grid,.doc-grid-2,.app-list,.care-grid,.care-grid-wide,.o-grid,.foot-grid{grid-template-columns:1fr}
 .g-list{columns:1}
 .nav{gap:.1rem .8rem;font-size:.9rem}
 .head-in>.btn{display:none}
 .topline-in span{display:none}
 .hero{padding:2rem 0 1rem}
}

.doc-fig{margin:0;display:flex;gap:1rem;align-items:flex-start}
.doc-body{min-width:0}
.ph{flex:none;width:5.5rem;height:5.5rem;border-radius:50%;object-fit:cover;object-position:50% 22%;background:var(--sage-100);border:2px solid #fff;box-shadow:0 0 0 2px var(--sage-100)}
.doc-big .ph{width:6.75rem;height:6.75rem}
.team-strip{list-style:none;margin:1rem 0 .4rem;padding:0;display:flex;flex-wrap:wrap;gap:1rem}
.team-strip li{width:7.5rem;text-align:center;font-size:.88rem;line-height:1.3}
.team-strip figure{margin:0}.team-strip .ph{width:5.5rem;height:5.5rem;display:block;margin:0 auto .4rem}
.team-strip .mono{margin:0 auto .4rem}
@media (max-width:640px){.ph{width:4.75rem;height:4.75rem}.doc-big .ph{width:5.5rem;height:5.5rem}}
