/* Melb E-Bike Guide — magazine theme (source: /workspace/sites/_design/ebike/style.css, applied by ebike_design.py) */
:root{--ink:#14181d;--ink2:#3b4450;--mute:#6b7480;--line:#e5e2dc;--bg:#faf8f4;--card:#fff;--accent:#c2562b;--accent-d:#9e4220;--green:#2f5d50;--r:14px;--sh:0 1px 2px rgba(20,24,29,.06),0 8px 24px rgba(20,24,29,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.7 "Inter",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent-d);text-underline-offset:3px}a:hover{color:var(--accent)}
h1,h2,h3{font-family:"Fraunces",Georgia,serif;font-weight:700;line-height:1.15;letter-spacing:-.015em;color:var(--ink)}
h1{font-size:clamp(2rem,4.5vw,3.3rem);margin:.3em 0 .35em}h2{font-size:clamp(1.45rem,2.6vw,2rem);margin:2.2em 0 .6em}h3{font-size:1.2rem;margin:.2em 0 .4em}
.wrap{max-width:1180px;margin:0 auto;padding:0 22px}
/* header */
header{position:sticky;top:0;z-index:50;background:rgba(250,248,244,.92);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:68px;flex-wrap:wrap}
.logo{font:700 1.45rem/1 "Fraunces",Georgia,serif;color:var(--ink);text-decoration:none;letter-spacing:-.02em}
.logo span{color:var(--accent);font-style:italic;margin:0 .12em}
nav{display:flex;gap:1.4rem;flex-wrap:wrap}
nav a{color:var(--ink2);text-decoration:none;font:600 .82rem/1 "Inter",sans-serif;letter-spacing:.08em;text-transform:uppercase;padding:.5rem 0;border-bottom:2px solid transparent}
nav a:hover{color:var(--ink);border-color:var(--accent)}
/* hero */
.hero{position:relative;min-height:min(78vh,680px);display:flex;align-items:flex-end;color:#fff;background:#222 center/cover no-repeat;overflow:hidden}
.hero .hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:0}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 30%,rgba(10,12,14,.78) 100%);pointer-events:none;z-index:1}
.hero .wrap{position:relative;z-index:2;padding-bottom:4.5rem;width:100%;pointer-events:auto}
.hero h1{color:#fff;max-width:15ch;font-size:clamp(2.4rem,6vw,4.6rem);text-shadow:0 2px 30px rgba(0,0,0,.35)}
.hero p{max-width:56ch;font-size:1.2rem;color:#f1ede6}
.sticker,.tag,.kicker{display:inline-block;font:700 .72rem/1 "Inter",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);}
.hero .sticker{background:var(--accent);color:#fff;padding:.55rem .8rem;border-radius:999px}
.btn{display:inline-block;margin-top:.8rem;background:var(--accent);color:#fff!important;text-decoration:none;font-weight:600;padding:.95rem 1.5rem;border-radius:999px;box-shadow:0 6px 20px rgba(194,86,43,.35);transition:transform .15s,background .15s}
.btn:hover{background:var(--accent-d);transform:translateY(-1px)}
.photo-credit{position:absolute;right:14px;bottom:10px;z-index:2;font-size:.7rem;color:rgba(255,255,255,.7)}
main.wrap{padding-top:1rem;padding-bottom:4rem}
.lead{font-size:1.15rem;color:var(--ink2);max-width:65ch;margin-top:-.2rem}
/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:28px;margin:1.4rem 0 2rem}
.card{display:flex;flex-direction:column;background:var(--card);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--sh);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-4px);box-shadow:0 2px 4px rgba(0,0,0,.06),0 18px 40px rgba(20,24,29,.14);color:var(--ink)}
.card .thumb{aspect-ratio:16/10;overflow:hidden;background:#ddd}
.card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.card:hover .thumb img{transform:scale(1.05)}
.card .tag{margin:1.2rem 1.4rem 0}
.card h3{margin:.55rem 1.4rem .5rem;font-size:1.28rem}
.card p{margin:0 1.4rem 1.5rem;color:var(--mute);font-size:.96rem;line-height:1.6}
.grid>.card:first-child:nth-last-child(n+4){grid-column:1/-1;flex-direction:row}
.grid>.card:first-child:nth-last-child(n+4) .thumb{flex:1.4;aspect-ratio:auto;min-height:360px}
.grid>.card:first-child:nth-last-child(n+4) .body{flex:1;align-self:center;padding:1.5rem .5rem}
.grid>.card:first-child:nth-last-child(n+4) h3{font-size:clamp(1.5rem,2.6vw,2.2rem)}
/* article */
article{max-width:760px;margin:0 auto;padding:3rem 22px 4rem}
article>.tag{margin-top:.5rem}
article h1{font-size:clamp(2.1rem,4.6vw,3.2rem)}
.meta{color:var(--mute);font-size:.9rem;letter-spacing:.02em}
.feature{margin:1.8rem -60px 2rem;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh)}
.feature img{width:100%;aspect-ratio:16/9;object-fit:cover}
.feature figcaption{background:#fff;padding:.6rem 1rem;font-size:.8rem;color:var(--mute)}
article p,article li{color:#262c33}
article ul,article ol{padding-left:1.3rem}article li{margin:.35rem 0}
article h2{padding-top:.4rem;border-top:1px solid var(--line)}
article table{width:100%;border-collapse:collapse;font-size:.95rem;margin:1.2rem 0;background:#fff;border-radius:10px;overflow:hidden;box-shadow:var(--sh)}
th,td{padding:.7rem .9rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{background:#f2eee7;font-weight:600}
blockquote{margin:1.5rem 0;padding:.2rem 1.4rem;border-left:4px solid var(--accent);font-family:"Fraunces",serif;font-size:1.2rem;color:var(--ink2)}
.disc{background:#f2eee7;border-radius:10px;padding:.8rem 1rem;font-size:.85rem;color:var(--ink2)}
.warn{background:#fff4ec;border:1px solid #f1cdb6;border-left:4px solid var(--accent);border-radius:10px;padding:1rem 1.2rem}
.src{font-size:.88rem;color:var(--mute)}
/* affiliate */
.aff{background:#fff;border:1px solid var(--line);border-left:4px solid var(--green);border-radius:12px;padding:1rem 1.2rem;margin:1.4rem 0;box-shadow:var(--sh);font-size:.95rem}
.aff a{display:inline-block;margin-left:.3rem;background:var(--green);color:#fff;text-decoration:none;padding:.4rem .85rem;border-radius:999px;font-weight:600;font-size:.85rem}
a[href^="#AFF-"]{outline:2px dashed #d33;outline-offset:3px}
.ad{border:1px dashed #cfc8bc;color:#9a9286;background:repeating-linear-gradient(45deg,#f6f3ee 0 10px,#f1ede6 10px 20px);border-radius:10px;padding:1rem;text-align:center;font-size:.78rem;letter-spacing:.04em;margin:1.5rem 0}
/* owner photo placeholders */
.photo-placeholder{margin:1.6rem 0}
.photo-placeholder .ph-box{aspect-ratio:16/9;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;text-align:center;padding:1rem;border-radius:var(--r);border:2px dashed #bdb5a8;color:#7a7266;font:600 .78rem/1.4 "Inter",sans-serif;letter-spacing:.12em;text-transform:uppercase;background:radial-gradient(circle at 50% 40%,#fff 0,#efebe4 70%)}
.photo-placeholder .ph-box::before{content:"";width:46px;height:46px;opacity:.55;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237a7266' stroke-width='1.6'%3E%3Crect x='3' y='6' width='18' height='14' rx='2'/%3E%3Ccircle cx='12' cy='13' r='4'/%3E%3Cpath d='M8 6l1.5-2h5L16 6'/%3E%3C/svg%3E")}
.photo-placeholder figcaption{font-size:.82rem;color:var(--mute);margin-top:.45rem;font-style:italic}
.wrap>.photo-placeholder{max-width:760px;margin:2rem auto}
/* gallery (owner photos) */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.gallery figure{margin:0;border-radius:12px;overflow:hidden;box-shadow:var(--sh)}.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover}
/* footer */
footer{background:#14181d;color:#b9c0c8;padding:3.2rem 0;font-size:.9rem;margin-top:3rem}
footer a{color:#fff}footer .flogo{display:block;font:700 1.4rem "Fraunces",serif;color:#fff;margin-bottom:.6rem}
@media(max-width:820px){.feature{margin:1.5rem 0}.grid>.card:first-child:nth-last-child(n+4){flex-direction:column}.grid>.card:first-child:nth-last-child(n+4) .thumb{min-height:0;aspect-ratio:16/10}nav{gap:.9rem}header .wrap{padding-top:.6rem;padding-bottom:.6rem}.hero{min-height:560px}}