:root { --ink:#17191d; --muted:#656575; --line:#d3cfe0; --violet:#6758df; --pink:#ff9db0; --blue:#a8ddff; --cream:#faf7f0; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
.shell { width:min(1180px,calc(100% - 40px)); margin-inline:auto; }
.eyebrow { margin:0 0 12px; font-size:.77rem; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
.hero { overflow:hidden; border-bottom:2px solid var(--ink); background:linear-gradient(145deg,#f1edff,#fff6f3 64%,#eef8ff); }
.hero-grid { min-height:530px; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr); align-items:center; gap:54px; padding-block:48px; }
.hero-copy { position:relative; z-index:1; }
.hero h1 { margin:0; font-size:clamp(3.5rem,6.4vw,6.25rem); line-height:.92; letter-spacing:-.075em; }
.hero h1 em { color:var(--violet); font-style:normal; }
.hero-lead { max-width:650px; margin:24px 0 0; color:var(--muted); font-size:1.16rem; line-height:1.55; }
.hero-link { display:inline-flex; align-items:center; gap:10px; margin-top:24px; padding:12px 17px; border:2px solid var(--ink); border-radius:999px; color:var(--ink); background:#fff; box-shadow:4px 4px 0 var(--ink); font-weight:850; text-decoration:none; }
.hero-link:hover { transform:translate(-1px,-1px); box-shadow:6px 6px 0 var(--ink); }
.hero-art { position:relative; width:min(100%,390px); height:430px; margin:0 auto; display:flex; align-items:flex-end; justify-content:center; isolation:isolate; }
.hero-art::before { content:""; position:absolute; inset:38px -18px 18px 8px; z-index:-1; border:2px solid rgba(103,88,223,.38); border-radius:49% 51% 46% 54%/56% 43% 57% 44%; background:rgba(255,255,255,.43); transform:rotate(5deg); }
.hero-art img { display:block; width:auto; max-width:100%; height:100%; object-fit:contain; object-position:center bottom; filter:drop-shadow(8px 11px 0 rgba(23,25,29,.12)); }
.art-note { position:absolute; z-index:2; padding:9px 13px 8px; border:2px solid var(--ink); border-radius:999px; background:#fff; font-size:.69rem; font-weight:950; letter-spacing:.14em; box-shadow:3px 3px 0 var(--ink); }
.art-note-one { top:52px; right:-10px; transform:rotate(7deg); }
.art-note-two { bottom:48px; left:-17px; background:#c9f5e8; transform:rotate(-7deg); }
.tools-section { padding:82px 0 90px; background:#fff; border-bottom:2px solid var(--ink); }
.section-heading,.about-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:65px; align-items:end; }
.section-heading h2,.about-grid h2 { max-width:650px; margin:0; font-size:clamp(2.35rem,5vw,4.8rem); line-height:.98; letter-spacing:-.06em; }
.section-heading > p,.about-grid > div:last-child { color:var(--muted); line-height:1.65; }
.tool-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:48px; }
.tool-card { position:relative; min-height:330px; display:flex; flex-direction:column; border:2px solid var(--ink); border-radius:19px; padding:28px; color:inherit; background:#fff; box-shadow:5px 5px 0 var(--ink); text-decoration:none; transition:transform .18s ease,box-shadow .18s ease; }
.tool-card:hover { transform:translate(-2px,-2px); box-shadow:8px 8px 0 var(--ink); }
.tool-card.featured { background:#f0edff; }
.number { position:absolute; top:24px; right:25px; color:#bbb5c8; font-size:2rem; font-weight:950; }
.tag { margin:5px 60px 45px 0; color:var(--violet); font-size:.7rem; font-weight:900; letter-spacing:.12em; }
.tool-card h3 { margin:0; font-size:clamp(1.8rem,3vw,2.6rem); letter-spacing:-.04em; }
.tool-card p { margin:14px 0 30px; color:var(--muted); line-height:1.55; }
.tool-card b { margin-top:auto; text-decoration:underline; text-underline-offset:4px; }
.about-section { padding:85px 0; }
.about-grid { align-items:start; }
.about-grid p { margin-top:0; }
a:focus-visible { outline:3px solid #1686df; outline-offset:3px; }
@media(max-width:760px){.shell{width:calc(100% - 28px)}.hero-grid{min-height:auto;grid-template-columns:1fr;gap:24px;padding-block:42px 34px}.hero h1{font-size:clamp(3.2rem,15vw,5.3rem)}.hero-art{height:330px;width:min(86vw,340px)}.tool-grid,.section-heading,.about-grid{grid-template-columns:1fr}.section-heading{gap:18px}.tool-card{min-height:285px}.about-grid{gap:24px}}
@media(max-width:480px){.nav-links>a:not(.nav-pill){display:none}.shell{width:calc(100% - 24px)}.hero-grid{padding-block:32px 26px;gap:14px}.hero h1{font-size:3.3rem}.hero-lead{margin-top:18px;font-size:1.02rem}.hero-link{margin-top:18px}.hero-art{height:270px;width:min(84vw,300px)}.hero-art::before{inset:32px -8px 12px 8px}.art-note-one{top:30px;right:-4px}.art-note-two{bottom:33px;left:-3px}.tools-section{padding-block:58px 65px}.tool-grid{margin-top:34px}.tool-card{min-height:260px;padding:22px;border-radius:16px}.tag{margin-bottom:34px}.about-section{padding-block:58px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition-duration:.01ms!important}}