:root{--ink:#2f241b;--muted:#756a5b;--line:#2f241b29;--panel:#fffce1d1;--panel-strong:#fffce1;--shadow:0 24px 70px #2f241b29;--radius:8px;--base:#fffce1;--soft:#fff;--accent-color:#ffbe91}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--ink);background:var(--base);margin:0;font-family:Arial,Helvetica,sans-serif}main{--accent:var(--accent-color);--accent-soft:var(--soft);--paper:var(--base);--guide:var(--soft);--eyebrow:var(--ink);--page-bg:var(--base);--page-section:var(--base);--page-alt:var(--soft);--nav-bg:#fffce1e0;--hero-background:linear-gradient(180deg, #fffce1f5, #cfebffa8), repeating-linear-gradient(0deg, transparent 0 23px, #2f241b0f 23px 24px), repeating-linear-gradient(90deg, transparent 0 23px, #2f241b0f 23px 24px);--steps-background:var(--soft);background:var(--page-bg);min-height:100vh}a{color:inherit;text-decoration:none}button,input{font:inherit}.site-nav{z-index:10;border-bottom:1px solid var(--line);background:var(--nav-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);justify-content:space-between;align-items:center;gap:24px;padding:14px clamp(18px,4vw,48px);display:flex;position:sticky;top:0}.brand,.nav-links{align-items:center;display:flex}.brand{gap:10px;font-weight:800}.brand-mark{border:2px solid var(--ink);background:var(--base);object-fit:cover;border-radius:6px;width:34px;height:34px;box-shadow:inset -3px -3px #00000014}.nav-links{gap:8px}.nav-links a{color:var(--muted);border-radius:6px;padding:9px 12px;font-size:14px}.nav-links a:hover{background:color-mix(in srgb, var(--accent) 28%, transparent);color:var(--ink)}.nav-cta{border:2px solid var(--ink);background:var(--accent);white-space:nowrap;border-radius:6px;justify-content:center;align-items:center;min-height:40px;padding:0 14px;font-size:14px;font-weight:800;display:inline-flex;box-shadow:inset -3px -3px #00000024}.hero{background:var(--hero-background);flex-direction:column;align-items:center;gap:clamp(24px,4vw,42px);min-height:auto;padding:clamp(28px,5vw,72px) clamp(18px,4vw,48px);display:flex}.hero-copy{text-align:center;min-width:0;max-width:900px}.eyebrow,.panel-kicker{color:var(--eyebrow);letter-spacing:0;text-transform:uppercase;margin:0 0 12px;font-size:13px;font-weight:800}h1,h2,h3,p{overflow-wrap:anywhere}h1{letter-spacing:0;max-width:100%;margin:0;font-size:clamp(48px,8vw,108px);line-height:.9}h2{letter-spacing:0;margin:0 0 18px;font-size:clamp(28px,4vw,54px);line-height:1}h3{margin:0 0 10px;font-size:19px;line-height:1.2}.subtitle{max-width:620px;color:var(--muted);margin:22px auto;font-size:clamp(18px,2vw,22px);line-height:1.55}.hero-social-proof{color:var(--ink);justify-content:center;align-items:center;gap:12px;margin-bottom:22px;font-size:15px;display:inline-flex}.avatar-train{display:flex}.avatar-train img{border:2px solid var(--paper);background:var(--accent);object-fit:cover;border-radius:50%;width:34px;height:34px;margin-left:-8px;display:block;box-shadow:inset -4px -4px #00000024}.avatar-train img:first-child{margin-left:0}.primary-cta,.download-button{border:2px solid var(--ink);background:var(--accent);min-height:48px;color:var(--ink);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;padding:0 18px;font-weight:800;display:inline-flex;box-shadow:inset -4px -4px #00000024}.generator-shell{border:2px solid var(--ink);border-radius:var(--radius);background:var(--paper);width:min(1180px,100%);min-width:0;max-width:100%;box-shadow:var(--shadow);overflow:hidden}.tool-grid{grid-template-columns:280px minmax(0,1fr);min-width:0;min-height:590px;display:grid}.control-panel,.preview-panel{min-width:0;padding:22px}.control-panel{border-right:2px solid var(--ink);background:var(--base);flex-direction:column;gap:16px;display:flex}.panel-head h2,.preview-head h2{margin:0;font-size:22px;line-height:1.1}.segmented,.quick-sizes{flex-wrap:wrap;gap:8px;display:flex}.segmented button,.quick-sizes button{border:1px solid var(--line);background:var(--base);min-height:36px;color:var(--ink);cursor:pointer;border-radius:6px;font-weight:700}.quick-sizes button{padding:0 10px}.segmented{width:100%;border:0;min-inline-size:0;margin:0;padding:0}.segmented legend{width:100%;color:var(--muted);margin-bottom:8px;font-size:13px;font-weight:800}.segmented button{text-transform:capitalize;flex:1;min-width:0}.segmented button.active,.quick-sizes button:hover{border-color:var(--ink);background:var(--accent)}.field{gap:8px;display:grid}.field-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.field-heading strong{color:var(--ink);font-size:13px}.field span,.stat-row span{color:var(--muted);font-size:13px;font-weight:800}.field input[type=number]{border:2px solid var(--ink);background:var(--base);border-radius:6px;width:100%;min-width:0;min-height:44px;padding:0 12px}.field input[type=range]{width:100%;accent-color:var(--accent)}.slider-field input[type=range]{cursor:pointer;min-height:28px}.slider-field input[type=number]{max-width:110px}.toggles{grid-template-columns:1fr 1fr;gap:8px;display:grid}.toggles label{border:1px solid var(--line);background:var(--base);border-radius:6px;align-items:center;gap:8px;min-height:38px;padding:0 10px;font-size:13px;font-weight:700;display:flex}.stat-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.stat-row div{border:1px solid var(--line);background:var(--base);border-radius:6px;padding:12px}.stat-row strong{margin-top:5px;font-size:20px;display:block}.download-button{background:var(--accent);width:100%}.download-actions{gap:8px;display:grid}.download-button.secondary{background:var(--guide)}.preview-panel{background:var(--soft);flex-direction:column;min-width:0;display:flex}.preview-head{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px;display:flex}.preview-head span{border:1px solid var(--line);background:var(--base);border-radius:6px;flex:none;padding:8px 10px;font-size:13px;font-weight:800}.grid-viewport{justify-content:center;align-items:center;width:100%;max-width:100%;min-height:260px;max-height:min(640px,70vh);margin:auto 0;display:flex;overflow:auto}.circle-grid{aspect-ratio:1;background:var(--base);flex:none;min-width:0;max-width:100%;display:grid;position:relative}.circle-grid span{background:var(--base);min-width:0;min-height:0}.circle-grid.with-grid span{border-right:1px solid var(--guide);border-bottom:1px solid var(--guide)}.circle-grid span.active{background:var(--accent);box-shadow:inset -2px -2px #00000024}.circle-grid.with-guides span.guide{outline-offset:-1px;outline:1px solid #2f241b6b}.section{background:var(--page-section);text-align:center;padding:clamp(48px,7vw,92px) clamp(18px,4vw,48px)}.section:nth-of-type(2n){background:var(--page-alt)}.section>p,.section>h2{max-width:920px;margin-left:auto;margin-right:auto}.section p{color:var(--muted);font-size:17px;line-height:1.7}.feature-lede{max-width:860px;margin:0 auto}.intro{padding-top:60px}.feature-grid,.step-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px;display:grid}.feature-grid article,.step-row article,.faq-list details{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel-strong)}.feature-grid article,.step-row article{padding:22px}.feature-grid article{flex-direction:column;display:flex}.feature-media{aspect-ratio:1;border:2px solid var(--ink);background:var(--base);border-radius:6px;width:100%;margin-bottom:18px;overflow:hidden}.feature-media img{object-fit:contain;width:100%;height:100%;display:block}.feature-grid.compact{grid-template-columns:repeat(3,minmax(0,1fr))}.size-table-wrap{border:2px solid var(--ink);border-radius:var(--radius);background:var(--panel-strong);max-width:1120px;box-shadow:var(--shadow);margin:28px auto 0;overflow-x:auto}.size-table{border-collapse:collapse;width:100%;min-width:760px}.size-table th,.size-table td{border-bottom:1px solid var(--line);text-align:left;vertical-align:top;padding:16px 18px}.size-table th{background:var(--soft);color:var(--ink);text-transform:uppercase;font-size:13px}.size-table tbody tr:nth-child(2n){background:#cfebff6b}.size-table td{color:var(--muted);font-size:15px;line-height:1.55}.size-table td:first-child{color:var(--ink);white-space:nowrap;font-weight:800}.size-table tr:last-child td{border-bottom:0}.howto{background:var(--steps-background)}.howto-heading{max-width:920px;margin:0 auto}.howto-heading h2{margin-bottom:0}.howto-layout{grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);align-items:start;gap:clamp(24px,5vw,64px);margin-top:30px;display:grid}.howto-layout.single{grid-template-columns:1fr;max-width:980px;margin-left:auto;margin-right:auto}.howto-steps{gap:12px;margin-top:0;display:grid}.howto-steps article{border:1px solid var(--line);border-radius:var(--radius);background:var(--base);padding:18px 20px}.howto-steps h3{margin-bottom:6px}.howto-steps p{margin:0}.feature-grid,.step-row,.faq-list,.howto-steps,.testimonial-viewport{text-align:left}.howto-media{border:2px solid var(--ink);border-radius:var(--radius);background:var(--base);min-width:0;box-shadow:var(--shadow);overflow:hidden}.howto-media img{width:100%;height:auto;display:block}.testimonials{background:var(--steps-background);overflow:hidden}.related-generators{background:var(--page-section)}.related-grid{text-align:left;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:1120px;margin:28px auto 0;display:grid}.related-card{border:2px solid var(--ink);border-radius:var(--radius);background:var(--base);min-height:180px;padding:22px;display:block;box-shadow:inset -4px -4px #00000014}.related-card:hover{background:var(--accent)}.related-card span{color:var(--muted);text-transform:uppercase;margin-bottom:16px;font-size:13px;font-weight:800;display:inline-block}.related-card h3{margin-bottom:12px}.related-card p{margin:0;font-size:15px}.testimonial-heading{max-width:920px;margin:0 auto}.testimonial-heading p:last-child{margin:0}.testimonial-viewport{width:100%;margin-top:30px;overflow:hidden}.testimonial-track{width:max-content;animation:52s linear infinite testimonial-scroll;display:flex}.testimonial-viewport:hover .testimonial-track{animation-play-state:paused}.testimonial-set{align-items:stretch;gap:16px;padding-right:16px;display:flex}.testimonial-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel-strong);flex-direction:column;flex:0 0 488px;gap:16px;width:488px;padding:22px;display:flex}.testimonial-user{align-items:center;gap:12px;display:flex}.testimonial-user img{border:2px solid var(--ink);background:var(--accent);object-fit:cover;border-radius:50%;width:52px;height:52px}.testimonial-user h3{margin:0 0 4px}.testimonial-user span,.testimonial-card strong{color:var(--eyebrow);font-size:13px;font-weight:800}.testimonial-card p{margin:0}.testimonial-card strong{margin-top:auto}.testimonial-rating{color:var(--accent);letter-spacing:0;text-shadow:0 1px 0 var(--ink);font-size:18px}@keyframes testimonial-scroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.steps{background:var(--steps-background)}.faq-list{gap:12px;max-width:920px;margin:24px auto 0;display:grid}.faq-list details{text-align:left;background:#fff;border:2px solid #0000;padding:18px 20px;box-shadow:0 12px 34px #2f241b14}.faq-list summary{cursor:pointer;font-weight:800}.faq-list details[open]{border-color:var(--accent)}.faq-list details[open] summary{color:var(--ink)}.faq-list p{margin-bottom:0}.faq-list a{color:var(--ink);font-weight:800;text-decoration:underline}.site-footer{border-top:1px solid var(--line);background:var(--ink);color:var(--base);grid-template-columns:minmax(220px,.9fr) minmax(0,1.8fr);align-items:start;gap:clamp(28px,5vw,72px);padding:44px clamp(18px,4vw,48px);display:grid}.site-footer p{margin:8px 0 0;font-size:13px;line-height:1.6}.footer-brand strong{margin-bottom:10px;font-size:20px;display:block}.footer-columns{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;display:grid}.site-footer nav{gap:10px;display:grid}.site-footer h2{color:var(--accent);text-transform:uppercase;margin:0 0 4px;font-size:13px;line-height:1.2}.site-footer a{color:var(--base);opacity:.86;font-size:13px;font-weight:700}.site-footer a:hover{opacity:1;text-decoration:underline}.content-page{background:var(--hero-background);min-height:62vh;padding:clamp(48px,8vw,104px) clamp(18px,4vw,48px)}.content-page>*{max-width:840px}.content-page h1{font-size:clamp(42px,7vw,82px)}.content-page h2{margin-top:34px;font-size:clamp(24px,3vw,38px)}.content-page p{color:var(--muted);font-size:18px;line-height:1.75}.content-page a{color:var(--ink);font-weight:800;text-decoration:underline}.blog-index{min-height:auto}.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:1120px;margin-top:34px;display:grid}.blog-card{border:2px solid var(--ink);border-radius:var(--radius);background:#fff;padding:22px;text-decoration:none;display:block;box-shadow:inset -4px -4px #00000014}.blog-card:hover,.blog-cta:hover{background:var(--accent)}.blog-card span{color:var(--muted);text-transform:uppercase;margin-bottom:14px;font-size:13px;font-weight:800;display:inline-block}.blog-card h2{margin-bottom:12px;font-size:clamp(24px,3vw,34px);line-height:1.08}.blog-card p{margin:0;font-size:16px}.blog-post{min-height:auto}.blog-post>section{margin-top:34px}.blog-post h1{max-width:980px}.blog-post h2,.blog-post p{max-width:760px}.blog-cta{border:2px solid var(--ink);background:#fff;border-radius:6px;justify-content:center;align-items:center;min-height:44px;margin-top:12px;padding:0 16px;text-decoration:none;display:inline-flex;box-shadow:inset -3px -3px #0000001a}@media (max-width:1100px){h1{max-width:14ch}.generator-shell{width:100%}}@media (max-width:780px){.site-nav{align-items:flex-start}.nav-links{display:none}.hero{padding-top:28px;display:flex;overflow:hidden}.hero-copy{width:100%}.generator-shell{width:100%;margin-top:22px}.tool-grid{grid-template-columns:1fr;width:100%}.control-panel{border-right:0;border-bottom:2px solid var(--ink);width:100%}.preview-panel{width:100%}.feature-grid,.step-row,.feature-grid.compact,.howto-layout,.related-grid,.blog-grid{grid-template-columns:1fr}.testimonial-card{flex-basis:min(488px,100vw - 44px);width:min(488px,100vw - 44px)}.segmented{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.segmented legend{grid-column:1/-1}.segmented button{width:100%}}@media (max-width:520px){.hero,.section{padding-left:14px;padding-right:14px}.hero-copy,.generator-shell{max-width:360px}h1{font-size:46px}.control-panel,.preview-panel{padding:16px}.toggles,.stat-row{grid-template-columns:1fr}.preview-head{display:block}.preview-head span{margin-top:12px;display:inline-block}.site-footer,.footer-columns{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.testimonial-track{animation:none}.testimonial-viewport{overflow-x:auto}}
