.content-shell{width:min(1080px,100% - 40px);margin-inline:auto;padding-bottom:80px}.breadcrumbs{color:var(--muted);padding-block:28px;font-size:.85rem}.breadcrumbs ol{flex-wrap:wrap;align-items:baseline;gap:8px 12px;margin:0;padding:0;list-style:none;display:flex}.breadcrumbs li{gap:12px;display:flex}.breadcrumbs li+li:before{content:"/";color:var(--muted)}.breadcrumbs a:hover{color:var(--accent);text-underline-offset:4px;text-decoration:underline}.content-page h1,.content-page h2,.content-page h3,.related-guides h2,.related-guides h3,.content-cta h2{color:var(--text);text-wrap:balance;font-weight:650}.content-hero{padding-block:48px 64px}.content-hero.with-visual{grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr);align-items:center;gap:56px;display:grid}.content-hero-copy{max-width:780px}.content-hero h1{letter-spacing:-.035em;margin:0 0 24px;font-size:clamp(2.4rem,4.8vw,4.5rem);line-height:1.06}.content-page .eyebrow,.related-guides .eyebrow{color:var(--accent);letter-spacing:.08em;text-transform:uppercase;margin:0 0 16px;font-size:.78rem;font-weight:750}.content-lede{color:var(--muted);font-size:1.15rem;line-height:1.7}.content-lede p{margin:0 0 24px}.content-hero .button{margin-top:8px}.content-hero-visual{justify-content:center;display:flex}.content-hero-visual>figure{flex-direction:column;align-items:center;width:100%;min-width:0;margin:0;display:flex}.content-hero-visual .iphone-device{width:270px}.content-hero-visual .watch-device{width:280px}.content-body{max-width:760px;color:var(--muted);margin-inline:auto;font-size:1.05rem;line-height:1.75}.content-body>section{margin-block:0 52px}.content-body h2,.related-guides h2,.content-cta h2{letter-spacing:-.025em;margin:0 0 20px;font-size:clamp(1.6rem,3vw,2.2rem);line-height:1.2}.content-body h3{margin:28px 0 12px;font-size:1.18rem;line-height:1.4}.content-body p{margin:0 0 20px}.content-body a{color:var(--accent);text-underline-offset:4px;text-decoration:underline}.content-body a:hover{text-decoration-thickness:2px}.content-body strong{color:var(--text);font-weight:650}.content-body ul,.content-body ol{margin:16px 0 24px;padding-left:1.5em}.content-body ul{list-style:outside}.content-body ol{list-style:decimal}.content-body li{margin-bottom:12px;padding-left:5px}.content-body li::marker{color:var(--accent)}.content-body figure{margin:28px 0}.content-page figcaption{max-width:440px;color:var(--muted);text-align:center;margin:16px auto 0;font-size:.85rem;line-height:1.6}.screenshot-pair{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:28px;display:grid}.screenshot-pair figure{min-width:0;margin:0}.widget-preview{border:1px solid var(--line);border-radius:16px;width:100%;height:auto;display:block}.content-hero-visual .widget-preview{max-width:350px}.watch-gallery{justify-items:center}.watch-gallery figure{flex-direction:column;align-items:center;width:100%;display:flex}.watch-gallery .watch-device{width:min(280px,100%)}.content-note{border-left:3px solid var(--accent);background:var(--panel);padding:24px}.content-note>:last-child{margin-bottom:0}.content-body .guide-grid{margin-top:28px}.guide-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}a.guide-card{border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:28px;text-decoration:none;display:block}a.guide-card:hover{border-color:var(--accent);text-decoration:none}.guide-card h2,.guide-card h3{margin:0 0 14px;font-size:1.2rem;line-height:1.4}.guide-card h2 span,.guide-card h3 span{color:var(--accent)}.guide-card p{color:var(--muted);margin:0;font-size:.95rem;line-height:1.65}.related-guides{border-top:1px solid var(--line);margin-top:64px;padding-top:40px}.content-cta{text-align:center;border:1px solid var(--line);border-radius:8px;margin-top:64px;padding:44px}.content-cta p{max-width:580px;color:var(--muted);margin:0 auto 28px;line-height:1.7}@media (width<=900px){.content-hero.with-visual{grid-template-columns:minmax(0,1fr) minmax(0,.7fr);gap:32px}}@media (width<=620px){.content-shell{padding-bottom:48px}.content-hero{padding-block:24px 40px}.content-hero.with-visual,.guide-grid,.screenshot-pair{grid-template-columns:1fr}.content-hero.with-visual{gap:36px}.content-lede{font-size:1.05rem}.content-hero .button{width:100%}.content-body{font-size:1rem}.screenshot-pair{gap:36px}.screenshot-pair .widget-preview{max-width:350px;margin-inline:auto}.related-guides{margin-top:40px}a.guide-card{padding:24px}.content-cta{margin-top:40px;padding:32px 24px}.content-cta .button{width:100%}}
