:root{--paper:#f6f3ed;--ink:#153d32;--muted:#65766e;--line:#dfe4dd;--accent:#2f795b;--panel:#183d34;--soft:#e8efe9;--serif:'Noto Serif SC','Songti SC',Georgia,serif;--sans:'DM Sans','PingFang SC','Microsoft YaHei',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}.page-width{max-width:1018px;margin:0 auto;padding-left:0;padding-right:0}.topbar{border-bottom:1px solid var(--line);background:rgba(246,243,237,.96)}.topbar-inner{align-items:center;display:flex;height:62px;justify-content:space-between;margin:0 auto;max-width:1018px}.logo{font-family:var(--serif);font-size:18px;font-weight:700}.nav{display:flex;gap:30px}.nav a{color:#354e45;font-size:12px}.nav a:hover{color:var(--accent)}.menu-button{display:none;background:none;border:0}.hero{align-items:center;display:grid;gap:70px;grid-template-columns:1fr 272px;min-height:490px;padding-top:54px;padding-bottom:52px}.eyebrow,.section-label{color:var(--accent);font-size:11px;letter-spacing:.04em;margin:0 0 18px}.hero h1,.service h2,.about h2,.writing h2,.contact h2{font-family:var(--serif);font-weight:600;letter-spacing:0;line-height:1.2;margin:0}.hero h1{font-size:52px;max-width:560px}.hero-intro{color:#52655c;font-size:14px;line-height:1.9;margin:23px 0 25px;max-width:510px}.hero-actions{display:flex;gap:12px}.button{align-items:center;border-radius:5px;display:inline-flex;font-size:12px;gap:10px;min-height:41px;padding:0 18px}.button-primary{background:var(--panel);color:#fff}.button-primary:hover{background:var(--accent)}.button-secondary{border:1px solid #ccd6cf;color:var(--ink)}.button-secondary:hover{border-color:var(--accent);color:var(--accent)}.hero-photo{height:410px;overflow:hidden;border-radius:13px}.hero-photo img{height:100%;object-fit:cover;object-position:center 30%;width:100%}.service{align-items:center;background:var(--panel);border-radius:13px;color:#fff;display:grid;gap:44px;grid-template-columns:1fr 220px;min-height:215px;padding:28px 32px}.service-label{background:#b8d5bb;border-radius:20px;color:var(--panel);display:inline-block;font-size:11px;padding:7px 13px}.service h2{font-size:28px;margin-top:14px}.service p{color:#d9e4dc;font-size:12px;line-height:1.75;margin:12px 0;max-width:590px}.service-meta{color:#b8d5bb;font-size:10px;letter-spacing:.12em}.service-link{border-bottom:1px solid #b8d5bb;display:inline-flex;font-size:12px;gap:10px;margin-top:15px;padding-bottom:4px}.service-photo{height:159px;overflow:hidden;border-radius:9px}.service-photo img{height:100%;object-fit:cover;object-position:center 30%;width:100%}.about{align-items:stretch;border:1px solid #dce3dc;border-radius:13px;display:grid;grid-template-columns:1fr 1fr;margin-top:52px;overflow:hidden}.about-copy{padding:54px 42px 50px}.about-copy small{color:var(--accent);font-size:11px}.about h2{font-size:31px;margin:22px 0 20px}.about-copy>p:not(.section-label){color:var(--muted);font-size:13px;line-height:1.85;max-width:390px}.section-label{align-items:center;display:flex;font-size:10px;gap:9px;text-transform:uppercase}.section-label span{background:#66a777;border-radius:50%;display:inline-block;height:8px;width:8px}.button-accent{background:#d7ebca;color:var(--ink);margin-top:10px}.workbench{background:#102a26;color:#f4f8f3;display:flex;flex-direction:column;min-height:330px;padding:24px 25px}.workbench-head{border:1px solid rgba(213,234,218,.18);display:flex;font-family:monospace;font-size:9px;justify-content:space-between;padding:10px 12px}.workbench-head span:last-child{color:#83c99a}.workbench>a{align-items:center;border-bottom:1px solid rgba(213,234,218,.14);display:grid;gap:15px;grid-template-columns:28px 1fr 18px;min-height:67px}.workbench>a:hover{color:#b8d5bb}.work-number{color:#a6cb75;font-family:monospace;font-size:9px}.workbench strong{display:block;font-family:var(--serif);font-size:15px}.workbench small{color:#aabdb2;display:block;font-size:10px;margin-top:4px}.workbench b{font-size:14px;font-weight:400}.workbench-foot{align-items:center;color:#9cb4a6;display:flex;font-size:10px;gap:8px;margin-top:auto}.workbench-foot span{background:#72c48a;border-radius:50%;height:7px;width:7px}.writing{padding-top:65px;padding-bottom:58px}.section-heading{align-items:end;display:flex;justify-content:space-between;margin-bottom:24px}.section-heading h2{font-size:32px}.section-heading>p{color:var(--muted);font-size:12px}.article-list{border-top:1px solid var(--ink)}.article-item{align-items:center;border-bottom:1px solid var(--line);display:grid;gap:16px;grid-template-columns:92px 1fr 20px;min-height:71px}.article-item:hover{background:#edf3ed}.article-date,.article-category{color:var(--muted);font-size:10px}.article-category{color:var(--accent);margin-right:12px}.article-title{font-family:var(--serif);font-size:15px}.article-arrow{color:var(--accent);text-align:right}.loading{color:var(--muted);font-size:12px;padding:22px 0}.contact{border-top:1px solid var(--line);padding-top:58px;padding-bottom:72px}.contact h2{font-size:34px;max-width:560px}.contact-row{display:grid;gap:15px;grid-template-columns:repeat(3,1fr);margin-top:34px}.contact-row>div{border-top:1px solid var(--ink);display:flex;flex-direction:column;gap:8px;padding-top:13px}.contact-row small{color:var(--muted);font-size:10px}.contact-row strong{font-family:var(--serif);font-size:20px}.footer{border-top:1px solid var(--line);color:var(--muted);font-size:10px;padding:21px 0}.footer .page-width{display:flex;justify-content:space-between}

/* Brand avatar and active navigation */
.logo{align-items:center;display:inline-flex;gap:9px}
.logo:before{background-image:url('./assets/suwan-q-avatar-mic-full.jpg');background-color:#fbfaf5;background-position:center;background-repeat:no-repeat;background-size:contain;border-radius:50%;content:'';display:block;height:36px;width:36px}
.nav{align-items:center;gap:6px}
.nav a{border-radius:5px;padding:8px 11px}
.nav a:hover{background:#e3ece4;color:var(--accent)}
.topbar .nav a[aria-current="page"]{background:var(--accent);box-shadow:3px 3px 0 #c7dfc8;color:#fff;font-weight:700}

/* Shared discovery footer */
.footer{padding:0}
.footer .footer-directory{border-bottom:1px solid var(--line);display:block;padding:25px 0 22px}
.footer-directory-row{align-items:center;display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:center;padding:9px 0}
.footer-directory-title{color:var(--ink);font-family:var(--serif);font-size:13px;font-weight:700;line-height:1.7;margin:0}
.footer-directory-links{align-items:center;display:flex;flex-wrap:wrap;gap:6px 21px;justify-content:center}
.footer-directory-links a,.footer-directory-links span{color:#52655c;font-size:11px;line-height:1.8;position:relative}
.footer-directory-links a:after{background:var(--accent);bottom:0;content:'';height:1px;left:0;position:absolute;transform:scaleX(0);transform-origin:left;transition:transform .18s ease;width:100%}
.footer-directory-links a:hover{color:var(--accent)}
.footer-directory-links a:hover:after{transform:scaleX(1)}
.footer .footer-meta{align-items:center;display:flex;justify-content:center;padding:18px 0;text-align:center}