/*
Theme Name: Cheap and Good Dawn
Description: Reproduces the Shopify Dawn look of cheapandgood.sg (white, #121212, Assistant).
Version: 1.0.1
Text Domain: cheapandgood-dawn
*/
:root{--fg:#121212;--muted:rgba(18,18,18,.75);--line:rgba(18,18,18,.12);--bg:#fff;--alt:#f3f3f3;--w:1200px;--narrow:72rem}
*{box-sizing:border-box}
html{font-size:62.5%}
body{margin:0;background:var(--bg);color:var(--muted);font:400 1.6rem/1.8 Assistant,sans-serif;letter-spacing:.06rem}
@media(min-width:750px){body{font-size:1.8rem}}
h1,h2,h3,h4{color:var(--fg);font-weight:400;letter-spacing:.06rem;line-height:1.3}
a{color:var(--fg)}
img{max-width:100%;height:auto}
.page-width{max-width:var(--w);margin:0 auto;padding:0 1.5rem}
@media(min-width:750px){.page-width{padding:0 5rem}}
.narrow{max-width:var(--narrow);margin:0 auto;padding:0 1.5rem}
.skip-link{position:absolute;left:-999px}.skip-link:focus{left:1rem;top:1rem;background:#fff;padding:1rem;z-index:9}
.site-header{border-bottom:1px solid var(--line)}
.site-header__inner{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding-top:1.2rem;padding-bottom:1.2rem}
.site-logo img{width:110px;display:block}
@media(min-width:750px){.site-logo img{width:150px}}
.main-nav{flex:1}
.main-nav ul{list-style:none;display:flex;gap:2.4rem;margin:0;padding:0}
.main-nav a{text-decoration:none;color:var(--muted);font-size:1.5rem}.main-nav a:hover{color:var(--fg);text-decoration:underline}
.header-search input{border:1px solid var(--fg);padding:.6rem 1rem;font:inherit;font-size:1.4rem;width:16rem}
@media(max-width:749px){.main-nav{display:none}.header-search input{width:11rem}}
.banner{position:relative;min-height:30rem;display:flex;align-items:center;justify-content:center;text-align:center;background:center/cover no-repeat}
.banner:before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.4)}
.banner__box{position:relative;padding:4rem 1.5rem}.banner__box h2{color:#fff;font-size:4rem;margin:0 0 2rem}
@media(min-width:750px){.banner{min-height:42rem}.banner__box h2{font-size:5.2rem}}
.button{display:inline-block;padding:1.2rem 3rem;background:var(--fg);color:#fff;text-decoration:none;font-size:1.5rem;letter-spacing:.1rem;border:1px solid var(--fg)}
.button--secondary{background:transparent;color:var(--fg)}.banner .button{background:#fff;color:var(--fg);border-color:#fff}
.section{padding:3.6rem 1.5rem}@media(min-width:750px){.section{padding:5rem}}
.section__title{font-size:2.4rem;margin:0 0 2.4rem}@media(min-width:750px){.section__title{font-size:3rem}}
.section__subtitle{margin:-1.6rem 0 2.4rem}
.view-all{text-align:center;margin-top:3rem}
.blog-grid{display:grid;gap:3rem 1.6rem;grid-template-columns:1fr}
@media(min-width:750px){.blog-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:990px){.blog-grid{grid-template-columns:repeat(3,1fr)}.blog-grid--4{grid-template-columns:repeat(4,1fr)}}
.article-card__media{display:block;aspect-ratio:3/2;overflow:hidden;background:var(--alt);margin-bottom:1.2rem}
.article-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.article-card:hover .article-card__media img{transform:scale(1.03)}
.article-card__title{font-size:1.8rem;margin:0 0 .6rem}.article-card__title a{text-decoration:none}.article-card:hover .article-card__title a{text-decoration:underline}
.article-card__meta{font-size:1.3rem;margin-bottom:.4rem}
.article-card__excerpt{font-size:1.5rem;line-height:1.6;margin:0}
.page-heading{text-align:center;padding:4rem 0 3rem}.page-heading h1{font-size:4rem;margin:0}
.pagination{text-align:center;margin:4rem 0}.pagination .page-numbers{display:inline-block;padding:.4rem 1rem;text-decoration:none}.pagination .current{border-bottom:1px solid var(--fg);color:var(--fg)}
.article-hero{max-width:var(--w);margin:0 auto}.article-hero img{width:100%;max-height:60rem;object-fit:cover;display:block}
.article-header{padding-top:3rem}.article-header h1{font-size:3rem;margin:0 0 1rem}
@media(min-width:750px){.article-header h1{font-size:4rem}}
.article-meta{font-size:1.4rem;text-transform:uppercase;letter-spacing:.13rem;margin-bottom:3rem}
.article-content{padding-bottom:4rem}.article-content h2{font-size:2.6rem}.article-content h3{font-size:2.1rem}
.article-content table{border-collapse:collapse;width:100%;display:block;overflow-x:auto}.article-content td,.article-content th{border:1px solid var(--line);padding:.6rem 1rem}
.article-back{text-align:center;padding:2rem 0 5rem}
.site-footer{border-top:1px solid var(--line);padding:4rem 0;font-size:1.3rem}
.site-footer__inner{display:flex;flex-wrap:wrap;gap:1.6rem 3rem;justify-content:space-between;align-items:center}
.footer-nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:2rem;margin:0;padding:0}.footer-nav a{color:var(--muted)}