/* Public tool showcases: real layouts, readable counts and room to explore. */
.container:has(.feature-site){max-width:1440px;width:100%;padding:36px 48px 64px}.app-frame:has(.feature-site){display:block}.app-frame:has(.feature-site)>.workspace-nav{display:none}
.feature-site,.tool-home{--tool-ink:#15383e;--tool-muted:#617d82;--tool-teal:#087f75;color:var(--tool-ink)}.feature-site [hidden],.tool-home [hidden]{display:none!important}.feature-site h1,.feature-site h2,.feature-site h3{color:var(--tool-ink)}.feature-site a:focus-visible,.tool-home a:focus-visible,.feature-site summary:focus-visible{outline:3px solid #078b80;outline-offset:5px}.feature-site svg,.tool-home svg{flex:none}
.feature-eyebrow{font-size:10px;font-weight:750;letter-spacing:2px;color:#07857e}.tool-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:28px}.tool-section-heading h2{margin:9px 0 12px;font-size:clamp(28px,3.3vw,44px);line-height:1.13;letter-spacing:-1.5px}.tool-section-heading p{max-width:650px;margin:0;color:var(--tool-muted);font-size:14px;line-height:1.8}.tool-section-heading>a{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;font-size:12px;font-weight:650;text-decoration:none}.tool-section-heading>a svg{width:18px;height:18px}
.tool-home{padding:76px 0 18px}.tool-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.tool-card{display:flex;flex-direction:column;min-width:0;border:1px solid #d9e5e5;border-radius:20px;overflow:hidden;background:#fff;text-decoration:none;color:var(--tool-ink);box-shadow:0 4px 20px #12383c04;transition:transform .22s,box-shadow .22s,border-color .22s}.tool-card:hover{transform:translateY(-5px);border-color:#a6ccc4;box-shadow:0 18px 36px #163e3b13}.tool-card-copy{display:flex;flex:1;flex-direction:column;align-items:flex-start;padding:25px 24px 27px}.tool-card-count{display:inline-flex;padding:4px 9px;border:1px solid #d2e8df;border-radius:999px;background:#eef7f2;color:#337167;font-size:10px;font-weight:650}.tool-card-copy h3{margin:13px 0 10px;font-size:23px;line-height:1.2;letter-spacing:-.7px}.tool-card-copy p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 22px;color:var(--tool-muted);font-size:12px;line-height:1.8}.tool-card-link{display:inline-flex;align-items:center;gap:9px;margin-top:auto;padding-top:7px;font-size:11px;font-weight:700;color:#087f75}.tool-card-link svg{width:17px;height:17px;transition:transform .22s}.tool-card:hover .tool-card-link svg{transform:translateX(4px)}
.tool-art{position:relative;isolation:isolate;height:250px;overflow:hidden;background:radial-gradient(ellipse at 90% 0,#cee5d6,transparent 70%),#e7efe9}.tool-colour-sand{background:radial-gradient(ellipse at 15% 0,#f4e6cc,transparent 70%),#e8dfd0}.tool-colour-rose{background:radial-gradient(ellipse at 100% 0,#e9d6f2,transparent 70%),#f2dcd6}.tool-colour-ink{background:radial-gradient(ellipse at 0 0,#387b79,transparent 70%),#142f3a}.tool-colour-plum{background:radial-gradient(ellipse at 100% 0,#b4a8d2,transparent 70%),#ddd8e8}.tool-colour-lilac{background:radial-gradient(ellipse at 20% 0,#e5e0f4,transparent 70%),#d4e7e2}.tool-colour-blue{background:radial-gradient(ellipse at 100% 0,#b9dce5,transparent 70%),#dce8ed}
.tool-art:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(130deg,transparent 0 48%,#ffffff21 48% 48.2%,transparent 48.2% 100%);pointer-events:none}.tool-art-image{position:absolute;display:block;top:24px;left:7%;width:86%;height:198px;object-fit:cover;object-position:top;border:5px solid #ffffffba;border-radius:10px;box-shadow:0 13px 30px #142d3921;transform:rotate(-1deg)}.tool-art-stamp{position:absolute;bottom:10px;left:0;right:0;text-align:center;color:#315a5785;font:600 8px/1.3 system-ui;letter-spacing:1.2px;text-transform:uppercase}.tool-colour-ink .tool-art-stamp{color:#d9f3e3a6}.tool-art-carousels .tool-art-image{top:43px;left:12%;width:76%;height:167px;transform:rotate(-3deg)}.tool-art-back{position:absolute;top:42px;left:13%;width:76%;height:165px;border:4px solid #ffffffa3;border-radius:10px;background:#aac8b9;box-shadow:0 8px 20px #173c3921}.tool-art-back-one{transform:rotate(9deg) translate(15px,-5px);background:#729b98}.tool-art-back-two{transform:rotate(-10deg) translate(-12px,-8px);background:#cfdfcc}.tool-art-cartoons .tool-art-image{top:20px;height:209px;border:3px solid #30323d;border-radius:3px;transform:rotate(2deg);box-shadow:8px 9px 0 #2f34401a}.tool-art-fallback{display:flex;align-items:center;justify-content:center;gap:14px;height:100%;font-size:22px}.tool-art-fallback svg{width:40px;height:40px}
.tool-book{position:absolute;top:24px;width:43%;height:202px;border-radius:2px 9px 9px 2px;box-shadow:0 15px 25px #3f37252e,inset 5px 0 6px #00000010;overflow:hidden;display:flex;flex-direction:column;padding:15px 14px}.tool-book small{font-size:11px;font-weight:900;letter-spacing:1px}.tool-book strong{font-size:22px;line-height:1.02;letter-spacing:-.9px;margin-top:17px}.tool-book>span{margin-top:auto;font-size:5px;letter-spacing:.9px}.tool-book-back{left:12%;background:#e2ebe5;color:#1d4b43;transform:rotate(-12deg)}.tool-book-back small{padding-bottom:6px;border-bottom:1px solid #1d4b4340}.tool-book-front{left:43%;top:32px;background:#efcf39;color:#242927;transform:rotate(8deg)}.tool-book-front small{font-size:12px;letter-spacing:-.5px;border-bottom:3px solid #242927;padding-bottom:3px}.tool-book-front strong{font-size:21px;margin-top:9px}.tool-book-front img{position:absolute;left:9%;width:87%;height:92px;bottom:16px;object-fit:contain;mix-blend-mode:multiply}.tool-book-front>span{font-size:4px}
.tool-home-footer{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:24px;padding:20px 0;border-bottom:1px solid #dce6e6;color:var(--tool-muted);font-size:12px}.tool-home-footer a{display:inline-flex;align-items:center;gap:10px;color:#087f75;font-weight:650;text-decoration:none}.tool-home-footer svg{width:18px;height:18px}
.feature-hub-hero{position:relative;padding:64px 0 72px;background:radial-gradient(ellipse at 95% 30%,#d9eae6,transparent 48%)}.feature-hub-hero h1{margin:24px 0;font-size:clamp(55px,7.5vw,100px);line-height:1.02;letter-spacing:-4px}.feature-hub-hero h1 em{font-style:normal;color:#0b847a}.feature-hub-hero>p{max-width:570px;color:var(--tool-muted);font-size:17px;line-height:1.8}.feature-hub-facts{display:flex;align-items:center;flex-wrap:wrap;gap:30px;margin-top:32px}.feature-hub-facts>span{display:grid;gap:1px;font-size:11px;color:var(--tool-muted);padding-right:28px;border-right:1px solid #cfdedb}.feature-hub-facts strong{color:var(--tool-ink);font-size:31px;letter-spacing:-1px}.feature-site #tools{padding-top:26px;scroll-margin-top:25px}
.feature-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:8px 0 28px;color:var(--tool-muted);font-size:11px}.feature-breadcrumb a{text-decoration:none}.feature-breadcrumb>span:not(:last-child){opacity:.5}.feature-detail-hero{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:70px;padding:28px 0 58px}.feature-detail-hero h1{margin:20px 0;font-size:clamp(41px,5vw,67px);line-height:1.06;letter-spacing:-2.6px}.feature-detail-hero>div>p{max-width:575px;margin:0;color:var(--tool-muted);font-size:16px;line-height:1.85}.feature-hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:22px;margin-top:28px}.feature-text-link{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-size:12px;font-weight:650}.feature-text-link svg{width:16px;height:16px}.feature-hero-count{display:inline-flex;align-items:center;gap:9px;margin-top:27px;font-size:12px;color:var(--tool-muted)}.feature-hero-count strong{display:inline-grid;place-items:center;min-width:37px;height:37px;padding:0 9px;border:1px solid #cee0da;border-radius:10px;background:#edf5f1;color:#17675c;font-size:18px}.feature-detail-hero>.tool-art{height:425px;border-radius:24px;transform:rotate(1deg)}.feature-detail-hero .tool-art-image{top:32px;height:352px}.feature-detail-hero .tool-art-carousels .tool-art-image,.feature-detail-hero .tool-art-back{top:74px;height:272px}.feature-detail-hero .tool-art-cartoons .tool-art-image{top:27px;height:367px}.feature-detail-hero .tool-book{top:40px;height:340px;padding:23px 20px}.feature-detail-hero .tool-book strong{font-size:35px;margin-top:22px}.feature-detail-hero .tool-book small{font-size:19px}.feature-detail-hero .tool-book-front{top:56px}.feature-detail-hero .tool-book-front strong{font-size:34px;margin-top:14px}.feature-detail-hero .tool-book-front img{height:165px;bottom:28px}.feature-detail-hero .tool-book>span{font-size:7px}.feature-detail-hero .tool-art-stamp{bottom:15px}
.feature-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:29px 0 32px;border-top:1px solid #d7e4e0;border-bottom:1px solid #d7e4e0}.feature-benefits>div{display:flex;align-items:flex-start;gap:13px}.feature-benefits>div>span{display:grid;place-items:center;width:28px;height:28px;flex:none;border-radius:50%;background:#e2efe8;color:#078078;font-size:10px;font-weight:700}.feature-benefits p{margin:1px 0 0;font-size:12px;line-height:1.8;color:#536e73}
.feature-workbench{padding:64px 0 0;scroll-margin-top:24px}.feature-preview-heading{display:flex;align-items:center;gap:10px;padding:0 3px 14px;font-size:12px}.feature-preview-heading>span{color:var(--tool-muted)}.feature-preview-heading>strong{font-weight:650}.feature-workbench .ib-live-preview{border-radius:18px;background:white;box-shadow:0 12px 42px #163e3b0a;overflow:hidden;border:1px solid #d4e2df}.feature-workbench .ib-live-viewport{height:600px;min-height:300px}.feature-workbench .ib-live-viewport iframe{height:600px;min-height:300px}.feature-workbench .ib-live-stage:not(.ib-live-fullscreen){height:600px;min-height:300px}.feature-workbench .ib-live-fullscreen .ib-live-viewport,.feature-workbench .ib-live-fullscreen .ib-live-viewport iframe{height:100%}.feature-option-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:32px 0 18px}.feature-option-heading h3{margin:0;font-size:18px;letter-spacing:-.4px}.feature-option-heading>span{font-size:11px;color:var(--tool-muted)}.feature-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.feature-option{display:flex;flex-direction:column;min-width:0;border:1px solid #d6e3df;border-radius:12px;background:white;overflow:hidden;text-decoration:none;color:var(--tool-ink);transition:border-color .15s,box-shadow .15s}.feature-option:hover,.feature-option[aria-current=true]{border-color:#5ba99a;box-shadow:0 0 0 2px #5ba99a25}.feature-option-image{display:grid;place-items:center;height:150px;background:#e9f0eb;overflow:hidden}.feature-option-image img{width:100%;height:100%;object-fit:cover;object-position:top}.feature-option-image>svg{width:50px;height:50px;color:#55877a}.feature-option:nth-child(3n+2) .feature-option-image{background:#ede6d8}.feature-option:nth-child(3n+3) .feature-option-image{background:#e9e1eb}.feature-option>strong{font-size:12px;line-height:1.5;padding:13px 14px 2px}.feature-option>span:last-child{display:flex;align-items:center;gap:8px;padding:5px 14px 14px;font-size:10px;color:#6a827f}.feature-option>span:last-child svg{width:13px;height:13px}.feature-more-options{border:1px solid #d8e4e0;border-radius:12px;padding:0;margin-top:20px}.feature-more-options>summary{padding:17px 20px;font-size:12px;color:#186f63}.feature-more-options>.feature-options{padding:0 18px 20px}
.feature-how{display:grid;grid-template-columns:.9fr 1fr;gap:70px;padding:64px 0;margin-top:50px;border-top:1px solid #d6e3df;border-bottom:1px solid #d6e3df}.feature-how h2{font-size:clamp(30px,3.7vw,44px);line-height:1.15;letter-spacing:-1.5px;margin:12px 0 22px}.feature-how>div>a{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-size:12px;font-weight:650}.feature-how ol{display:grid;gap:20px;padding:0;margin:0;list-style:none;counter-reset:tool-step}.feature-how li{display:flex;align-items:flex-start;gap:15px;padding:10px 0;font-size:14px;line-height:1.8;counter-increment:tool-step}.feature-how li:before{content:"0" counter(tool-step);display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:9px;background:#e5eee8;color:#1a6f62;font-size:11px;font-weight:700}.feature-related{padding-top:56px}.feature-related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.feature-related-grid>a{position:relative;display:flex;flex-direction:column;gap:9px;min-width:0;padding:22px 48px 22px 23px;border:1px solid #d5e3dd;border-radius:14px;background:#fff;text-decoration:none}.feature-related-grid>a>span{font-size:10px;color:var(--tool-muted)}.feature-related-grid strong{color:var(--tool-ink);font-size:17px;letter-spacing:-.4px;line-height:1.3}.feature-related-grid svg{position:absolute;right:20px;top:50%;transform:translateY(-50%);width:17px;height:17px;color:#078578}
.feature-final{display:flex;align-items:center;justify-content:space-between;gap:35px;margin-top:68px;padding:45px 48px;border-radius:24px;background:radial-gradient(ellipse at 90% 10%,#237c6d80,transparent 60%),#14393c;color:#e8f8ee}.feature-final .feature-eyebrow{color:#93d9c3}.feature-final h2{margin:14px 0;font-size:clamp(30px,3.8vw,49px);line-height:1.08;letter-spacing:-1.6px;color:#fff}.feature-final p{font-size:13px;color:#b7d4ce;line-height:1.8;margin:0}.feature-final-actions{display:grid;justify-items:center;gap:18px;flex:none}.feature-final-actions .button{background:#c1e9d5;border-color:#c1e9d5;color:#174c43}.feature-final-actions>a:last-child{color:#d9f0e7;font-size:12px;text-underline-offset:5px}
@media(max-width:1100px){.feature-detail-hero{gap:35px}.feature-detail-hero h1{font-size:48px}.feature-detail-hero>.tool-art{height:365px}.feature-detail-hero .tool-art-image{height:300px}.feature-detail-hero .tool-art-carousels .tool-art-image,.feature-detail-hero .tool-art-back{height:235px;top:62px}.feature-detail-hero .tool-book{height:286px;top:34px;padding:17px 14px}.feature-detail-hero .tool-book-front{top:48px}.feature-detail-hero .tool-book strong{font-size:27px}.feature-detail-hero .tool-book small{font-size:15px}.feature-detail-hero .tool-book-front img{height:140px}.tool-art{height:220px}.tool-art-image{height:174px}.tool-art-carousels .tool-art-image,.tool-art-back{height:144px;top:38px}.tool-art-cartoons .tool-art-image{height:180px}.tool-book{height:177px;padding:12px 10px;top:20px}.tool-book-front{top:29px}.tool-book strong{font-size:18px}.tool-book-front strong{font-size:18px}.tool-book-front img{height:80px}.tool-card-copy{padding:21px 20px 24px}.tool-card-copy h3{font-size:21px}.feature-how{gap:40px}}
@media(max-width:850px){.container:has(.feature-site){padding:25px 26px 44px}.tool-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-art{height:245px}.tool-art-image{height:195px}.tool-art-carousels .tool-art-image,.tool-art-back{height:165px}.tool-art-cartoons .tool-art-image{height:205px}.feature-detail-hero{grid-template-columns:1fr;gap:32px}.feature-detail-hero>div:first-child{max-width:650px}.feature-detail-hero>.tool-art{height:380px;max-width:650px;width:100%;justify-self:center}.feature-detail-hero .tool-art-image{height:320px}.feature-detail-hero .tool-art-carousels .tool-art-image,.feature-detail-hero .tool-art-back{height:250px}.feature-detail-hero .tool-book{height:305px}.feature-benefits{gap:20px}.feature-how{grid-template-columns:1fr}.feature-options{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-final{padding:34px 30px}.feature-related-grid strong{font-size:15px}.feature-related-grid>a{padding:20px 35px 20px 16px}.feature-related-grid svg{right:13px;width:14px}.feature-workbench .ib-live-toolbar{flex-wrap:wrap}}
@media(max-width:600px){.container:has(.feature-site){padding:22px 18px 38px}.tool-section-heading{align-items:flex-start;flex-direction:column;gap:16px}.tool-section-heading h2{font-size:31px}.tool-home{padding-top:48px}.tool-card-grid{grid-template-columns:1fr;gap:20px}.tool-home .tool-card-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:86%;overflow-x:auto;scroll-snap-type:x proximity;gap:15px;padding:0 0 20px;max-width:100%;overscroll-behavior-inline:contain}.tool-home .tool-card{scroll-snap-align:start}.tool-home-footer{flex-direction:column;align-items:flex-start;gap:12px;font-size:11px}.tool-card-copy h3{font-size:23px}.tool-card-copy p{font-size:12px}.tool-art{height:240px}.tool-art-image{height:191px}.tool-art-cartoons .tool-art-image{height:201px}.tool-book{height:196px;padding:14px 12px}.tool-book strong,.tool-book-front strong{font-size:22px}.tool-book-front img{height:88px}.tool-book-front small{font-size:12px}.feature-hub-hero{padding:35px 0 46px}.feature-hub-hero h1{font-size:65px;letter-spacing:-3px}.feature-hub-hero>p{font-size:15px}.feature-hub-facts{gap:18px}.feature-hub-facts>span{padding-right:18px;font-size:10px}.feature-hub-facts>a{flex-basis:100%;justify-content:center}.feature-breadcrumb{gap:9px;font-size:10px;padding-bottom:18px}.feature-detail-hero{padding:20px 0 34px}.feature-detail-hero h1{font-size:43px;letter-spacing:-1.9px}.feature-detail-hero>div>p{font-size:14px}.feature-hero-actions{gap:16px}.feature-hero-actions .button{font-size:12px}.feature-detail-hero>.tool-art{height:280px}.feature-detail-hero .tool-art-image{height:226px;top:25px}.feature-detail-hero .tool-art-carousels .tool-art-image,.feature-detail-hero .tool-art-back{top:48px;height:184px}.feature-detail-hero .tool-art-cartoons .tool-art-image{top:21px;height:236px}.feature-detail-hero .tool-book{height:225px;top:27px;padding:16px 12px}.feature-detail-hero .tool-book-front{top:38px}.feature-detail-hero .tool-book small{font-size:12px}.feature-detail-hero .tool-book strong{font-size:24px;margin-top:14px}.feature-detail-hero .tool-book-front img{height:108px;bottom:22px}.feature-detail-hero .tool-book>span{font-size:5px}.feature-benefits{grid-template-columns:1fr;gap:17px;padding:25px 0}.feature-benefits p{font-size:12px}.feature-workbench{padding-top:40px}.feature-preview-heading{align-items:flex-start;flex-direction:column;gap:3px}.feature-workbench .ib-live-viewport,.feature-workbench .ib-live-viewport iframe,.feature-workbench .ib-live-stage:not(.ib-live-fullscreen){height:490px}.feature-option-heading h3{font-size:17px}.feature-option-image{height:108px}.feature-options{gap:12px}.feature-option>strong{padding:11px 11px 2px;font-size:11px}.feature-option>span:last-child{padding:4px 11px 12px;font-size:9px}.feature-more-options>summary{padding:15px;font-size:11px}.feature-more-options>.feature-options{padding:0 10px 14px}.feature-how{padding:38px 0;margin-top:36px;gap:26px}.feature-how h2{font-size:33px}.feature-how li{font-size:13px}.feature-related-grid{grid-template-columns:1fr;gap:12px}.feature-related-grid>a{padding:20px 45px 20px 20px}.feature-related-grid strong{font-size:18px}.feature-related-grid svg{right:20px;width:18px}.feature-final{flex-direction:column;align-items:flex-start;padding:31px 25px;margin-top:44px;border-radius:18px}.feature-final-actions{justify-items:start}.feature-final h2{font-size:37px}.feature-eyebrow{font-size:9px;letter-spacing:1.6px}}
@media(prefers-reduced-motion:reduce){.tool-card,.tool-card-link svg,.feature-option{transition:none}.tool-card:hover{transform:none}}