@import url('local-fonts.css');:root{--ink:#1a2a3c;--muted:#8190a2;--blue:#4657e8;--pale:#eef0ff;--line:#e5eaf1;--bg:#f7f9fd}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',system-ui,sans-serif}
button,input{font:inherit}
button{cursor:pointer}
a{text-decoration:none;color:inherit}
.wrap{max-width:1190px;margin:auto;padding:0 26px}
.nav{height:72px;background:white;border-bottom:1px solid var(--line)}
.nav .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:flex;align-items:center;gap:10px}
.logo{background:var(--blue);color:white;border-radius:11px;height:38px;width:38px;display:grid;place-items:center;font-weight:800;letter-spacing:-1px}
.brand b{display:block;font:800 16px Manrope;letter-spacing:-.5px}
.brand small{display:block;color:#a3aebb;font-size:10px}
.links{display:flex;gap:28px;align-items:center;margin:auto}
.links a{white-space:nowrap;font-size:13px;font-weight:700;color:#6e7b8f}
.links a.current{color:var(--blue)}
.nav-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.nav-actions .btn { white-space: nowrap; padding: 14px 18px; }
.btn{border:1px solid var(--blue);background:var(--blue);color:white;border-radius:10px;padding:12px 17px;font-weight:800;font-size:12px;display:inline-flex;align-items:center;justify-content:center;gap:9px}
.btn:hover{background:#3445d2}
.btn.secondary{background:white;color:var(--ink);border-color:#dfe5ec}
.hero{background:radial-gradient(circle at 80% -25%,#dfe4ff,transparent 40%),linear-gradient(180deg,#fff,#f7f9fd);padding:73px 0 64px}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:58px;align-items:center}
.eyebrow{color:var(--blue);font-size:11px;letter-spacing:1.6px;font-weight:900;text-transform:uppercase}
.hero h1{font:800 clamp(40px,4.8vw,61px)/1.14 Manrope;letter-spacing:-2.4px;margin:17px 0 20px}
.hero h1 span{color:var(--blue)}
.hero p{color:#7d8a9c;line-height:1.8;font-size:15px;max-width:550px}
.search{display:flex;background:white;border:1px solid #dee4f0;border-radius:13px;padding:7px;max-width:500px;margin-top:30px;box-shadow:0 12px 35px #2337650c}
.search input{border:0;outline:none;flex:1;min-width:0;padding:0 15px;color:var(--ink);font-size:13px}
.visual{height:340px;background:linear-gradient(130deg,#4555de,#7380ed);border-radius:28px;position:relative;overflow:hidden;box-shadow:0 25px 70px #4554c92e}
.visual:before{content:'';position:absolute;width:380px;height:380px;border-radius:50%;background:#ffffff18;top:-180px;right:-120px}
.visual:after{content:'';position:absolute;width:290px;height:290px;border-radius:50%;border:45px solid #ffffff13;bottom:-180px;left:-100px}
.visual-card{background:white;border-radius:15px;box-shadow:0 15px 35px #24358140;position:absolute;padding:20px;transform:rotate(-7deg);width:230px;left:55px;top:54px}
.visual-card:nth-child(2){left:auto;right:29px;top:153px;transform:rotate(8deg);width:225px}
.visual-card .emoji{font-size:28px}
.visual-card strong{display:block;font-size:14px;margin:10px 0 5px}
.visual-card small{color:#96a0ad;font-size:11px}
.filters{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 31px}
.filter{border:1px solid #e0e6ef;background:white;color:#758398;border-radius:999px;font-size:12px;font-weight:800;padding:10px 17px}
.filter.active{background:var(--blue);color:white;border-color:var(--blue)}
.section{padding:65px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:25px}
.section-head h2{font:800 28px Manrope;letter-spacing:-1px;margin:9px 0 0}
.section-head p{color:var(--muted);font-size:13px;margin:6px 0 0}
.feature{display:grid;grid-template-columns:.95fr 1.05fr;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:white;box-shadow:0 15px 40px #2035510b}
.feature-art{min-height:330px;background:linear-gradient(145deg,#dce5ff,#b9c6f9);display:grid;place-items:center;position:relative;overflow:hidden}
.feature-art:before{content:'';height:270px;width:270px;background:white;opacity:.25;border-radius:50%;position:absolute;top:-90px;right:-70px}
.feature-emoji{font-size:135px;filter:drop-shadow(0 20px 20px #40518c22);transform:rotate(-8deg)}
.feature-content{padding:43px 46px;display:flex;flex-direction:column;justify-content:center}
.tag{font-size:10px;font-weight:900;color:var(--blue);background:#eff1ff;border-radius:99px;padding:7px 10px;display:inline-block;align-self:flex-start}
.feature h3{font:800 clamp(23px,2.6vw,33px)/1.3 Manrope;letter-spacing:-.9px;margin:16px 0 12px}
.feature p{color:#8290a0;font-size:14px;line-height:1.8;margin:0 0 16px}
.meta{font-size:11px;color:#99a6b4}
.read{font-size:12px;color:var(--blue);font-weight:900;display:inline-flex;gap:9px;align-items:center;margin-top:22px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:19px}
.article{border:1px solid var(--line);background:white;border-radius:18px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 10px 35px #23365008;transition:.2s}
.article:hover{transform:translateY(-4px);box-shadow:0 18px 50px #23365016}
.art{height:182px;display:grid;place-items:center;position:relative;overflow:hidden}
.art span{font-size:77px;filter:drop-shadow(0 15px 15px #1c325016)}
.art.umzug{background:linear-gradient(135deg,#e0e9ff,#cad7fa)}
.art.job{background:linear-gradient(135deg,#d7f5ed,#b8e9d6)}
.art.house{background:linear-gradient(135deg,#fff0d9,#f6d9ab)}
.art.garden{background:linear-gradient(135deg,#e5f3dd,#cfebc6)}
.art.money{background:linear-gradient(135deg,#e7e3ff,#d1c9f8)}
.art.montage{background:linear-gradient(135deg,#e6edf5,#ccdbe9)}
.article-main{padding:22px;display:flex;flex-direction:column;flex:1}
.article h3{font:800 16px/1.5 Manrope;letter-spacing:-.25px;margin:13px 0 9px}
.article p{color:#8793a4;font-size:12px;line-height:1.8;flex:1;margin:0 0 15px}
.article-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #edf0f5;padding-top:15px}
.article-bottom a{font-weight:900;color:var(--blue);font-size:11px}
.cta{background:#e9edff;border-radius:24px;padding:42px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:20px;margin-top:72px}
.cta h2{font:800 25px Manrope;margin:0 0 9px;letter-spacing:-.7px}
.cta p{color:#7382a0;font-size:13px;margin:0;line-height:1.7}
.footer{background:#19293b;color:white;padding:42px 0;margin-top:80px}
.footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:25px}
.footer small{color:#adbac8}
.footer-links{display:flex;gap:24px;font-size:12px;color:#b6c2d0}

@media(max-width:850px){.hero-grid{grid-template-columns:1fr}
.visual{height:240px}
.feature{grid-template-columns:1fr}
.feature-art{min-height:240px}
.grid{grid-template-columns:repeat(2,1fr)}
.links{gap:14px}
}
@media(max-width:620px){.wrap{padding:0 18px}
.hero{padding:48px 0}
.hero h1{font-size:40px;letter-spacing:-1.7px}
.hero p{font-size:14px}
.visual-card{left:20px;top:25px;transform:rotate(-5deg) scale(.85);transform-origin:left top}
.visual-card:nth-child(2){right:7px;top:115px;transform:rotate(7deg) scale(.82);transform-origin:right top}
.section{padding:45px 0}
.feature-content{padding:25px}
.feature-art{min-height:200px}
.feature-emoji{font-size:100px}
.section-head h2{font-size:23px}
.grid{grid-template-columns:1fr}
.art{height:190px}
.cta{grid-template-columns:1fr;padding:28px;margin-top:45px}
.footer .wrap{display:block}
.footer-links{margin-top:20px;gap:15px;flex-wrap:wrap}
}

.filter { text-decoration: none; display: inline-block; }
.article-copy { max-width: 760px; margin-inline: auto; }
.article-copy h2 { margin: 1.5em 0 .4em; }
.article-copy p, .article-copy li { line-height: 1.75; }
.article-copy .feature-art { min-height: 180px; margin-top: 24px; border-radius: 24px; }
.article-copy .cta { margin-top: 36px; }
.search input { min-width: 0; }
@media (max-width: 1050px) {
    .nav { height: auto; padding-block: 12px; }
    .nav .wrap { flex-wrap: wrap; gap: 12px; }
    .nav .links { order: 3; width: 100%; flex-wrap: wrap; gap: 8px 16px; }
}

@media (max-width: 620px) {
    .nav-actions .btn { font-size: 11px; padding: 9px 12px; }
}
