.components-page{padding-bottom:100px;background:radial-gradient(circle at 86% 10%,#d7ff3f14,transparent 25%),linear-gradient(180deg,#ffffff,#f7f9fb 48%,#ffffff)}.components-hero{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;grid-gap:46px;gap:46px;min-height:650px;padding-top:36px}.components-hero h1{margin:14px 0 22px;font-size:clamp(56px,7.2vw,112px);line-height:.83}.components-hero p{max-width:500px;margin:0 0 26px;color:var(--muted);font-size:15px;line-height:1.7}.exploded-pc{position:relative;isolation:isolate;min-height:530px;overflow:hidden;border:1px solid #cbd5e11c;background:radial-gradient(circle at center,#d7ff3f15,transparent 30%),linear-gradient(145deg,#f7f9fb,#ffffff);box-shadow:inset 0 0 70px #ffffff08}.exploded-pc:after,.exploded-pc:before{position:absolute;z-index:-1;inset:11%;border:1px solid #d7ff3f20;content:"";transform:rotate(45deg)}.exploded-pc:after{inset:25%;border-color:#cbd5e113;transform:rotate(-22deg)}.exploded-core{position:absolute;top:50%;left:50%;display:grid;place-items:center;width:160px;height:160px;border:1px solid #d7ff3f88;background:linear-gradient(145deg,#edf1f5,#ffffff);box-shadow:0 0 0 18px #d7ff3f09,0 0 52px #d7ff3f20;transform:translate(-50%,-50%) rotate(45deg)}.exploded-core b,.exploded-core span{transform:rotate(-45deg)}.exploded-core b{font:700 13px var(--display);letter-spacing:.12em}.exploded-core span{margin-top:-42px;color:var(--accent-text);font-size:7px;font-weight:800;letter-spacing:.12em}.exploded-part{position:absolute;z-index:1;display:flex;align-items:center;gap:7px;border:1px solid #cbd5e130;padding:9px 11px;background:#ffffffdc;color:#182230;font-size:9px;font-weight:800;letter-spacing:.1em;text-align:left;cursor:pointer;transition:.22s}.exploded-part i{display:grid;place-items:center;width:18px;height:18px;background:#edf1f5;color:var(--accent-text);font-size:7px;font-style:normal}.exploded-part.active,.exploded-part:focus-visible,.exploded-part:hover{border-color:var(--lime);background:#f7f9fb;box-shadow:0 0 25px #d7ff3f2e;outline:0;transform:translateY(-3px)}.part-0{top:15%;left:4%}.part-1{top:18%;right:4%}.part-2{bottom:17%;left:4%}.part-3{right:4%;bottom:17%}.part-4{top:5%;left:40%}.part-5{bottom:5%;left:42%}.part-6{top:46%;left:8%}.part-7{top:46%;right:8%}.components-section{padding-top:clamp(70px,9vw,124px)}.components-section-head{display:grid;grid-template-columns:1.15fr .85fr;align-items:end;grid-gap:45px;gap:45px;max-width:1120px;margin-bottom:30px}.components-section-head h2{margin:12px 0 0;font-size:clamp(42px,5.6vw,80px);line-height:.84}.components-section-head p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}.component-explorer{grid-template-columns:260px 1fr}.component-explorer,.component-explorer nav{display:grid;grid-gap:1px;gap:1px;background:var(--line)}.component-explorer nav{align-content:start}.component-explorer nav button{border:0;padding:15px;background:#f7f9fb;color:#182230;font-size:10px;font-weight:800;letter-spacing:.1em;text-align:left;cursor:pointer}.component-explorer nav button.active,.component-explorer nav button:hover{background:#f7f9fb;color:var(--accent-text)}.component-explorer article{padding:clamp(27px,4vw,53px);background:linear-gradient(135deg,#edf1f5,#f7f9fb)}.component-explorer article>span{color:var(--accent-text);font-size:9px;font-weight:800;letter-spacing:.12em}.component-explorer h3{margin:17px 0 28px;font-size:clamp(36px,4vw,62px);line-height:.86}.component-explorer dl{display:grid;grid-template-columns:1fr 1fr;grid-gap:0;gap:0;margin:0 0 30px}.component-explorer dl div{min-height:135px;border-top:1px solid #cbd5e118;border-right:1px solid #cbd5e118;padding:18px}.component-explorer dl div:nth-child(2n){border-right:0}.component-explorer dt{color:var(--accent-text);font-size:8px;font-weight:800;letter-spacing:.12em}.component-explorer dd{margin:11px 0 0;color:#182230;font-size:12px;line-height:1.58}.component-category-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:1px;gap:1px;background:var(--line)}.component-category-grid a{display:flex;min-height:220px;flex-direction:column;padding:19px;background:#f7f9fb;transition:.22s}.component-category-grid a:hover{background:#f7f9fb;transform:translateY(-4px)}.component-category-grid span{color:var(--accent-text);font-size:9px;font-weight:800}.component-category-grid h3{margin:28px 0 8px;font:700 28px var(--display);letter-spacing:-.06em}.component-category-grid p{margin:0;color:var(--muted);font-size:11px;line-height:1.55}.component-category-grid b{margin-top:auto;padding-top:18px;color:#182230;font-size:8px;letter-spacing:.1em}.component-flow,.component-guides,.component-mistakes,.component-picks,.components-ai{border:1px solid #cbd5e118;background:#f7f9fb;padding:clamp(25px,4vw,48px)}.component-flow{display:grid;grid-template-columns:1fr 1fr;grid-gap:40px;gap:40px}.component-flow h3,.component-guides h3,.component-mistakes h3,.component-picks h3{margin:10px 0 20px;font-size:clamp(34px,4vw,59px);line-height:.86}.component-flow p,.component-guides p,.component-mistakes p,.component-picks p{color:var(--muted);font-size:12px;line-height:1.65}.component-flow ul{display:grid;grid-gap:1px;gap:1px;margin:0;padding:0;list-style:none;background:var(--line)}.component-flow li{padding:15px;background:#ffffff;color:#182230;font-size:12px;line-height:1.5}.component-guides{margin-top:12px}.component-guides details{border-top:1px solid #cbd5e118;padding:14px 0}.component-guides summary{cursor:pointer;color:#182230;font-size:12px;font-weight:800}.component-guides details p{margin:10px 0 0}.component-mistakes,.component-picks{margin-top:12px}.component-mistakes ul,.component-picks ul{display:grid;grid-gap:1px;gap:1px;margin:20px 0 0;padding:0;list-style:none;background:var(--line)}.component-mistakes li,.component-picks li{padding:14px;background:#ffffff;color:#182230;font-size:12px;line-height:1.55}.components-ai{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-top:12px;border-color:#d7ff3f55;background:linear-gradient(110deg,#edf1f5,#f7f9fb 65%)}.components-ai h2{max-width:740px;margin:12px 0;font-size:clamp(42px,5vw,78px);line-height:.84}.components-ai p{max-width:610px;margin:0;color:#182230;font-size:13px;line-height:1.65}.components-ai .btn{flex:none}@media(max-width:900px){.component-flow,.components-hero{grid-template-columns:1fr}.components-hero{min-height:auto;padding-top:35px}.exploded-pc{min-height:440px}.components-section-head{grid-template-columns:1fr;gap:18px}.component-category-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.components-hero h1{font-size:clamp(52px,15vw,75px)}.exploded-pc{min-height:390px}.exploded-core{width:120px;height:120px}.part-0{top:12%;left:2%}.part-1{top:14%;right:2%}.part-2{bottom:14%;left:2%}.part-3{right:2%;bottom:14%}.part-4{top:3%;left:35%}.part-5{bottom:3%;left:38%}.part-6{top:47%;left:2%}.part-7{top:47%;right:2%}.exploded-part{gap:4px;padding:6px;font-size:7px}.exploded-part i{width:14px;height:14px;font-size:6px}.components-section{padding-top:70px}.component-explorer{grid-template-columns:1fr}.component-explorer nav{grid-template-columns:1fr 1fr}.component-explorer nav button{padding:13px;font-size:8px}.component-explorer dl{grid-template-columns:1fr}.component-explorer dl div,.component-explorer dl div:nth-child(2n){min-height:auto;border-right:0}.component-category-grid{grid-template-columns:1fr}.component-category-grid a{min-height:165px}.components-ai{display:block}.components-ai .btn{margin-top:24px}}.components-together{display:grid;grid-template-columns:1fr 1fr;grid-gap:1px;gap:1px;background:var(--line)}.components-together>div{min-height:390px;padding:clamp(28px,5vw,65px);background:#f7f9fb}.components-lower h2,.components-together h2{margin:13px 0;font-size:clamp(42px,5vw,76px);line-height:.84}.components-together p{max-width:490px;color:var(--muted);font-size:13px;line-height:1.65}.components-together .btn{margin-top:24px}.components-together>div:last-child{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(5,1fr);grid-gap:1px;gap:1px;align-content:center;background:#f7f9fb}.components-together>div:last-child b,.components-together>div:last-child i{display:grid;place-items:center;margin:0;background:#f7f9fb;font-size:10px;font-style:normal;letter-spacing:.1em}.components-together>div:last-child b{color:#182230}.components-together>div:last-child i{color:var(--accent-text);font-size:8px}.components-lower{display:grid;grid-template-columns:1.1fr .9fr;grid-gap:1px;gap:1px;background:var(--line)}.components-lower>div{padding:clamp(25px,4vw,48px);background:#f7f9fb}.components-lower>div:last-child{background:#f7f9fb}.components-lower .accordion{margin-top:25px}.components-lower .accordion-item{border-color:#cbd5e118}.components-lower .accordion-trigger{color:#182230}.components-lower .accordion-content{color:var(--muted)}.component-picks{display:grid;grid-gap:7px;gap:7px;margin-top:24px}.component-picks b{padding:12px;border:1px solid #cbd5e11c;background:#ffffff;color:#182230;font-size:9px;letter-spacing:.1em}.component-mistakes{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:1px;gap:1px;padding:1px;background:var(--line)}.component-mistakes article{min-height:250px;padding:22px;background:#f7f9fb}.component-mistakes article>b{color:var(--accent-text);font-size:9px;letter-spacing:.12em}.component-mistakes article h3{margin:36px 0 11px;font:700 25px var(--display);letter-spacing:-.05em;line-height:.9}.component-mistakes article p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}@media(max-width:900px){.components-lower,.components-together{grid-template-columns:1fr}.components-together>div{min-height:300px}}@media(max-width:600px){.components-together>div{padding:30px 23px}.components-together>div:last-child{min-height:260px}.component-mistakes,.components-lower{grid-template-columns:1fr}.component-mistakes article{min-height:0}.component-mistakes article h3{margin:20px 0 10px}}