
:root{--ink:#26302f;--leaf:#657a66;--clay:#b56f55;--cream:#f6f0e7;--line:#e8e0d5;--paper:#fffdfa}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,sans-serif;line-height:1.7}
a{text-decoration:none;color:inherit}.wrap{width:min(1120px,92%);margin:auto}
header{background:#fff;border-bottom:1px solid var(--line)}.head{display:flex;justify-content:space-between;align-items:center;padding:18px 0}
.logo{font:700 32px Georgia,serif}.logo span{color:var(--clay)}nav{display:flex;gap:18px;font-size:14px;font-weight:700}
.hero{padding:70px 0 50px;background:linear-gradient(135deg,#f5eee5,#fffdfa)}
.hero h1,.article h1,.card h3,.article h2{font-family:Georgia,serif}.hero h1{font-size:clamp(42px,7vw,72px);line-height:1;margin:8px 0 16px}
.kicker{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--leaf);font-weight:800}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding:42px 0}.card{border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#fff}
.card img{width:100%;aspect-ratio:16/9;display:block;object-fit:cover}.pad{padding:18px}.btn{display:inline-block;background:var(--ink);color:#fff;padding:11px 17px;border-radius:999px;font-weight:800}
.article{width:min(820px,92%);margin:46px auto}.article h1{font-size:clamp(38px,6vw,60px);line-height:1.05}.article h2{font-size:30px;margin-top:38px}
.article-hero{border:1px solid var(--line);border-radius:24px;overflow:hidden;margin:24px 0}.article-hero img{width:100%;display:block;aspect-ratio:16/9;object-fit:cover}
.tipbox{background:var(--cream);border-radius:20px;padding:22px;margin:28px 0}.cta{background:#31483c;color:#fff;border-radius:22px;padding:24px;margin:30px 0}.cta a{background:#fff;color:#31483c;padding:11px 17px;border-radius:999px;font-weight:800;display:inline-block}
.share{display:flex;gap:8px;flex-wrap:wrap;border-block:1px solid var(--line);padding:16px 0;margin:28px 0}.share a{border:1px solid var(--line);border-radius:999px;padding:7px 11px;font-size:13px}
footer{background:#26302f;color:#fff;padding:40px 0;margin-top:50px}.bottom{display:none}
@media(max-width:800px){.grid{grid-template-columns:1fr 1fr}nav{display:none}}
@media(max-width:560px){.grid{grid-template-columns:1fr}.bottom{display:block;position:fixed;bottom:12px;left:12px;right:12px;background:#26302f;color:#fff;padding:13px;border-radius:14px;text-align:center;font-weight:800}}

/* Real photo category cards + article share panel */
.card img{width:100%;height:170px;aspect-ratio:auto;object-fit:cover;display:block}
.article-hero{margin:24px 0 28px;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:#fff}
.article-hero img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block}
.share-panel{border:1px solid #e3e8e8;border-radius:24px;padding:24px;margin:24px 0 30px;background:#fff;box-shadow:0 8px 24px rgba(20,45,50,.05)}
.share-panel h3{margin:0 0 18px;font:700 24px Georgia,serif}
.share-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.share-grid a{border:1px solid #d9e1e1;border-radius:16px;padding:13px 14px;background:#fff;text-align:center;font-weight:800}
.share-grid a:hover{background:#f6f9f8}
.category-photo-grid .card{border-radius:10px}
.category-photo-grid .card .pad{padding:14px 16px 16px}
.category-photo-grid .card h3{font-family:Arial,sans-serif;font-size:18px;margin:0 0 8px}
.home-topics-title{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-top:38px}
.home-topics-title h2{font:700 42px Georgia,serif;margin:0}
.home-topics-title a{font-weight:800;color:var(--clay)}
@media(max-width:700px){
  .share-grid{grid-template-columns:1fr 1fr}
  .share-panel{padding:20px}
  .card img{height:155px}
}
