/* AZCLEAN4 (az.com lead, Todd 10-28): no dead space, less clutter, one look. Loaded after azds2c.css; every rule is under html[data-c4]
   (flag AZCLEAN4=on), so AZCLEAN4=off is the AZDS2C look exactly. */

/* ---------- shell ---------- */
/* the token pill sits IN the header row (it hung under the header on every page, and on phones it pushed the radio away) */
html[data-c4] .top-act{display:flex;align-items:center;gap:8px}
html[data-c4] .top-act .az-tok{position:static!important;margin:0!important;min-height:34px!important;padding:0 12px!important;font-size:13px!important;order:0}
html[data-c4] .top-act .az-tok[hidden],html[data-c4] .top-act .az-tok:empty{display:none!important}
@media (max-width:520px){
  html[data-c4] .top-act{gap:2px}
  html[data-c4] .top-act .az-tok{min-height:32px!important;padding:0 9px!important;font-size:12px!important}
  html[data-c4] .top-act .ds2c-th{display:none!important}   /* phones: the theme switch moves to the menu (the drawer keeps every link) */
}
/* one help entry per page: the floating Ask (radio dock) + the "?" on the page title. The many inline "Ask" chips inside cards go. */
html[data-c4] .askb{display:none!important}
/* the band above the footer: content ends, the footer starts (was 72px section + 48px space + 48px padding) */
html[data-c4] .sec-tight{padding:24px 0 40px!important}
html[data-c4] .sec{padding-top:40px!important;padding-bottom:40px!important}
html[data-c4] .foot{margin-top:0!important;padding-top:36px!important}
html[data-c4] .foot .news{margin-top:24px}
@media (min-width:900px){
  html[data-c4] .foot-grid{display:grid!important;grid-template-columns:minmax(240px,1.4fr) repeat(3,minmax(140px,1fr));gap:32px;align-items:start}
}
/* cards: no empty strip at the bottom, one radius, one padding */
html[data-c4] .card{padding:24px!important;border-radius:16px!important}
html[data-c4] .card>:last-child,html[data-c4] .card form>:last-child{margin-bottom:0!important}
html[data-c4] .form-msg:empty{margin:0!important;padding:0!important;min-height:0!important}
html[data-c4] .card .center:last-child{margin-bottom:0!important}
/* readable text width on reading pages */
html[data-c4] .wrap.narrow{max-width:760px!important}
/* page heads: tighter, one rhythm */
html[data-c4] .hero-sm{padding-top:48px!important;padding-bottom:8px!important}
html[data-c4] .hero:not(.hero-home) .lead{margin-bottom:8px}
html[data-c4] .hero .verse{margin-top:8px}
/* buttons: one shape, tap-size on phones */
html[data-c4] .btn{border-radius:999px!important}
@media (max-width:760px){html[data-c4] .btn,html[data-c4] .btn-sm{min-height:44px!important}}

/* ---------- home (the clean search page) ---------- */
html[data-c4] body.azs1-page{min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
html[data-c4] body.azs1-page>main{flex:1 0 auto;min-height:0!important}
html[data-c4] body.azs1-page:has(#tokRadio),html[data-c4] body.azs1-page{padding-bottom:0!important}   /* the radio is hidden on the home: no 84px room for it under the footer */
html[data-c4] .azs1-page .azs1{padding-top:clamp(36px,13vh,140px)!important;padding-bottom:40px!important}
html[data-c4] .azs1-hero{margin:0 0 20px!important}
html[data-c4] .azs1-mark{width:52px!important;height:52px!important;border-radius:14px!important;font-size:19px!important;margin-bottom:14px}
html[data-c4] .azs1-tag{font-size:clamp(26px,3.4vw,38px)!important;line-height:1.15!important;letter-spacing:-.02em;color:var(--s1-ink,#eef3fb)!important;margin:0 auto!important;max-width:760px;text-wrap:balance}
html[data-c4] .azs1-box{max-width:760px;margin-left:auto!important;margin-right:auto!important}
html[data-c4] .azs1-chips{max-width:760px;margin-left:auto;margin-right:auto}
html[data-c4] .azs1-note{margin-top:16px!important}
html[data-c4] .c4-tools{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;max-width:880px;margin:clamp(32px,6vh,56px) auto 0}
html[data-c4] .c4-tools a{display:flex;flex-direction:column;gap:4px;min-height:44px;padding:16px 18px;border-radius:16px;border:1px solid var(--s1-line,rgba(120,200,210,.22));background:rgba(10,22,44,.55);color:var(--s1-ink,#eef3fb);text-decoration:none;font:600 15px/1.3 Inter,system-ui,sans-serif;transition:border-color .15s,background-color .15s}
html[data-c4] .c4-tools a span{color:var(--s1-mute,#9fb0c8);font-weight:400;font-size:13.5px}
html[data-c4] .c4-tools a:hover,html[data-c4] .c4-tools a:focus-visible{border-color:var(--s1-teal,#4fe0c8);background:rgba(14,30,58,.8)}
html[data-c4] .azs1-out:not(:empty)~.c4-tools,html[data-c4] .azs1-out[style*="min-height"]~.c4-tools,html[data-c4] .azs1[data-q]:not([data-q=""]) .c4-tools{display:none!important}
@media (max-width:720px){html[data-c4] .c4-tools{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}html[data-c4] .c4-tools a{padding:14px}}
html[data-c4] .azs1-foot{padding:16px 16px 20px!important}

/* ---------- ask screens (/quick /best /spin /create) ---------- */
/* the engine tiles under the box repeated "Change" (which opens the full picker) and the Create image button */
html[data-c4] .hero-ask .jobpills{display:none!important}
html[data-c4] .hero-home{padding-bottom:16px!important}
html[data-c4] .lean-sec{padding:8px 0 32px!important}

/* ---------- account: two columns on wide screens, the summary on top ---------- */
@media (min-width:1000px){
  html[data-c4] .sec-tight .wrap.narrow:has([data-acct-card]){max-width:1080px!important;display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
  html[data-c4] .wrap.narrow:has([data-acct-card])>*{margin:0!important}
  html[data-c4] .wrap.narrow:has([data-acct-card])>[data-acct-card],html[data-c4] .wrap.narrow:has([data-acct-card])>[data-signin]{grid-column:1/-1}
  html[data-c4] .wrap.narrow:has([data-acct-card])>[data-security-root]:not([hidden]){display:contents}
  html[data-c4] .wrap.narrow:has([data-acct-card])>[data-security-root]>*{margin:0!important}
}

/* ---------- deals ---------- */
html[data-c4] .deal-grid{align-items:stretch}
html[data-c4] .deal-grid>.card{margin:0!important;display:flex;flex-direction:column}
html[data-c4] .deal-grid>.card>.btn{margin-top:auto;align-self:flex-start}
html[data-c4] .card:has(>.news){background:none!important;border:0!important;padding:0!important;box-shadow:none!important}

/* ---------- network ---------- */
html[data-c4] .netstrip .ns-head h2{gap:0}

/* ---------- AZCLEAN5 (walk fixes) ---------- */
html[data-c4] .hero-home h1.h-display{font-size:clamp(34px,5.4vw,56px)!important;line-height:1.08!important;letter-spacing:-.02em}
html[data-c4] .cmp-list{align-content:flex-start;align-items:flex-start}
html[data-c4] .cmp-list>.cmp-e{align-self:flex-start}

/* ---------- AZCLEAN6 ---------- */
/* /account/plan signed in: the plan card fills ~0.3 s after load and pushed the footer down (CLS 0.08 at 1440, 0.13 at 390); hold its filled height */
html[data-c4] [data-plan-card]{min-height:333px}
@media (max-width:600px){html[data-c4] [data-plan-card]{min-height:400px}}
