@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{--yellow:#f2c94c;--black:#111111;--ink:#171717;--muted:#66615a;--paper:#f7f6f2;--white:#fff;--line:#dfddd6}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:"DM Sans",Arial,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}
.site-header{height:76px;padding:0 clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;background:var(--black);color:#fff;border-bottom:1px solid #292929}
.brand{display:inline-flex;align-items:center;gap:11px;font-family:"Space Grotesk",sans-serif;font-weight:700;letter-spacing:.09em}.brand-mark{width:34px;height:34px;display:grid;place-items:center;background:var(--yellow);color:var(--black);font-weight:800;border-radius:8px}
nav{display:flex;gap:28px}nav a,.footer-links a{color:#d7d5ce;font-weight:600}nav a:hover,.footer-links a:hover{color:var(--yellow)}
main{overflow:hidden}.hero{padding:clamp(76px,11vw,140px) clamp(20px,7vw,100px) 110px;background:radial-gradient(circle at 82% 24%,rgba(242,201,76,.2),transparent 25%),var(--black);color:#fff;position:relative}
.hero::after{content:"";position:absolute;right:-80px;bottom:-130px;width:360px;height:360px;border:2px solid rgba(242,201,76,.2);border-radius:50%}
.eyebrow{margin:0 0 12px;color:var(--yellow);font-size:.76rem;font-weight:800;letter-spacing:.16em}.hero h1{margin:0;max-width:900px;font-family:"Space Grotesk",sans-serif;font-size:clamp(3.2rem,8vw,7.2rem);line-height:.94;letter-spacing:-.055em}.hero h1 span{color:var(--yellow)}
.hero-copy{max-width:660px;margin:28px 0 34px;color:#cfcfc9;font-size:clamp(1rem,1.8vw,1.2rem)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:13px;min-height:48px;padding:0 19px;border:2px solid var(--yellow);border-radius:9px;background:var(--yellow);color:var(--black);font-weight:800;transition:transform .16s ease,background .16s ease,color .16s ease}.button:hover{transform:translateY(-2px)}
.button.dark{background:var(--black);color:#fff}.button.dark:hover{background:var(--yellow);color:var(--black)}.button.disabled{background:transparent;border-color:var(--line);color:#aaa;cursor:default}
.tools-section{padding:90px clamp(20px,7vw,100px);max-width:1280px;margin:auto}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:34px}.section-heading h2,.about h2{margin:0;font-family:"Space Grotesk",sans-serif;font-size:clamp(2.3rem,5vw,4.2rem);line-height:1;letter-spacing:-.04em}.section-heading>p{max-width:310px;color:var(--muted);margin:0 0 3px}
.tool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.tool-card{min-height:350px;padding:28px;display:flex;gap:22px;border:1px solid var(--line);border-radius:16px;background:var(--white);box-shadow:0 10px 35px rgba(17,17,17,.05)}.tool-card.featured{border-top:5px solid var(--yellow)}.tool-card.coming-soon{background:#efeee9}
.tool-icon{flex:0 0 54px;width:54px;height:54px;display:grid;place-items:center;border-radius:12px;background:var(--yellow);color:var(--black);font-family:"Space Grotesk",sans-serif;font-weight:800}.tool-icon.muted{background:var(--black);color:var(--yellow);font-size:1.7rem}
.tool-body{flex:1}.tool-tag{margin-bottom:10px;color:#77736c;font-size:.72rem;font-weight:800;letter-spacing:.13em}.tool-body h3{margin:0 0 10px;font-family:"Space Grotesk",sans-serif;font-size:1.65rem;line-height:1.15}.tool-body p{color:var(--muted);margin:0 0 25px;max-width:560px}
.about{margin:0 auto;padding:82px clamp(20px,7vw,100px);max-width:1280px;display:grid;grid-template-columns:1fr 1fr;gap:70px;border-top:1px solid var(--line)}.about p:last-child{color:var(--muted);font-size:1.08rem;margin-top:0}
footer{padding:32px clamp(20px,7vw,100px);background:var(--black);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:25px}footer div:first-child{display:flex;flex-direction:column}footer strong{font-family:"Space Grotesk",sans-serif;letter-spacing:.08em}footer span{color:#9f9d96;font-size:.9rem}.footer-links{display:flex;gap:22px;font-size:.9rem}
@media(max-width:760px){.site-header{height:68px}nav{gap:15px;font-size:.9rem}.hero{padding-top:75px;padding-bottom:85px}.tool-grid,.about{grid-template-columns:1fr}.section-heading{display:block}.section-heading>p{margin-top:18px}.tool-card{min-height:auto;flex-direction:column}.about{gap:25px}footer{align-items:flex-start;flex-direction:column}}