.mock-ui__preview-devices{gap:.25rem;display:flex}.mock-ui__preview-device{background-color:var(--gray-100,#f1f5f9);width:1.5rem;height:1.5rem;color:var(--gray-400);cursor:pointer;border-radius:.375rem;transition:background-color .15s,color .15s}.mock-ui__preview-device--active{background-color:color-mix(in srgb, var(--color-secondary) 15%, transparent);color:var(--color-secondary)}.mock-ui__preview-devices--showcase .mock-ui__preview-device{gap:.25rem;width:auto;height:auto;padding:.25rem .625rem;font-size:.6875rem;font-weight:600}.mock-ui__card--builder-hero{overflow:hidden}.mock-ui__builder-split{grid-template-columns:1fr;gap:0;min-height:14rem;display:grid}@media (width>=480px){.mock-ui__builder-split{grid-template-columns:1fr 10rem}}.mock-ui__builder-preview{border-right:1px solid var(--gray-100,#f1f5f9);flex-direction:column;gap:0;display:flex;overflow:hidden}.mock-ui__page-hero{background:linear-gradient(135deg, var(--color-secondary-darker), var(--color-secondary), color-mix(in srgb, var(--color-card-mint) 50%, var(--color-secondary)));text-align:center;padding:1.25rem .75rem .875rem;position:relative}.mock-ui__page-hero-overlay{position:relative}.mock-ui__page-hero-title{color:#fff;letter-spacing:.02em;font-size:.9375rem;font-weight:700;font-family:var(--font-serif,Georgia, serif)}.mock-ui__page-hero-subtitle{color:#fffc;letter-spacing:.04em;text-transform:uppercase;margin-block-start:.125rem;font-size:.5625rem}.mock-ui__page-hero-countdown{justify-content:center;margin-block-start:.5rem}.mock-ui__countdown-unit{background-color:#ffffff26;border-radius:.25rem;flex-direction:column;align-items:center;min-width:2rem;padding:.25rem .375rem;display:flex}.mock-ui__countdown-unit strong{color:#fff;font-size:.75rem;font-weight:700;line-height:1}.mock-ui__countdown-unit small{color:#ffffffb3;text-transform:uppercase;letter-spacing:.05em;font-size:.4375rem}.mock-ui__page-section-mini{border-bottom:1px solid var(--gray-50,#f8fafc);padding:.5rem .625rem}.mock-ui__page-section-mini--selected{outline:2px solid var(--color-secondary);outline-offset:-2px;background-color:color-mix(in srgb, var(--color-secondary) 3%, white);border-radius:.125rem}.mock-ui__page-section-title{color:var(--gray-700);text-transform:uppercase;letter-spacing:.04em;margin-block-end:.375rem;font-size:.5625rem;font-weight:700}.mock-ui__page-section-body{gap:.25rem}.mock-ui__page-detail-card{background-color:var(--gray-50,#f8fafc);color:var(--gray-600);border-radius:.25rem;align-items:center;gap:.25rem;padding:.25rem .375rem;font-size:.5rem;display:flex}.mock-ui__page-detail-card svg{color:var(--color-secondary);flex-shrink:0}.mock-ui__page-gallery-grid{grid-template-columns:repeat(4,1fr);gap:.1875rem;display:grid}.mock-ui__page-gallery-img{aspect-ratio:1;background:linear-gradient(135deg, color-mix(in srgb, var(--color-secondary) 12%, var(--gray-100)), color-mix(in srgb, var(--color-card-mint) 25%, var(--gray-100)));border-radius:.1875rem}.mock-ui__page-gallery-img:nth-child(2){background:linear-gradient(135deg, color-mix(in srgb, var(--color-card-blush) 40%, var(--gray-100)), var(--gray-100))}.mock-ui__page-gallery-img:nth-child(3){background:linear-gradient(135deg, var(--gray-100), color-mix(in srgb, var(--color-card-sky) 30%, var(--gray-100)))}.mock-ui__builder-add-line{justify-content:center;align-items:center;padding:.375rem 0;display:flex;position:relative}.mock-ui__builder-add-line:before{content:"";background-color:color-mix(in srgb, var(--color-secondary) 25%, transparent);height:1px;position:absolute;left:.5rem;right:.5rem}.mock-ui__builder-add-btn{background-color:color-mix(in srgb, var(--color-secondary) 12%, white);border:1px solid color-mix(in srgb, var(--color-secondary) 30%, transparent);width:1.125rem;height:1.125rem;color:var(--color-secondary);cursor:pointer;border-radius:50%;position:relative}.mock-ui__builder-editor{background-color:var(--gray-50,#f8fafc);flex-direction:column;gap:.5rem;padding:.5rem;display:none;overflow:hidden}@media (width>=480px){.mock-ui__builder-editor{display:flex}}.mock-ui__editor-section-label{color:var(--color-secondary);text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--gray-200);align-items:center;gap:.25rem;padding-block-end:.375rem;font-size:.625rem;font-weight:700;display:flex}.mock-ui__editor-section-label svg{flex-shrink:0}.mock-ui__editor-field{flex-direction:column;gap:.25rem;display:flex}.mock-ui__editor-field-label{color:var(--gray-500);text-transform:uppercase;letter-spacing:.04em;font-size:.5625rem;font-weight:600}.mock-ui__editor-field-input{border:1px solid var(--gray-200);color:var(--gray-700);background-color:#fff;border-radius:.25rem;padding:.25rem .375rem;font-size:.625rem}.mock-ui__editor-layout-options{gap:.25rem}.mock-ui__editor-layout-opt{border:1px solid var(--gray-200);width:1.75rem;height:1.5rem;color:var(--gray-400);cursor:pointer;background-color:#fff;border-radius:.25rem;transition:border-color .15s,color .15s}.mock-ui__editor-layout-opt--active{border-color:var(--color-secondary);color:var(--color-secondary);background-color:color-mix(in srgb, var(--color-secondary) 6%, white)}.mock-ui__editor-colors{gap:.25rem}.mock-ui__editor-color{cursor:pointer;border-radius:50%;width:1.125rem;height:1.125rem;transition:transform .15s,box-shadow .15s}.mock-ui__editor-color:hover{transform:scale(1.15)}.mock-ui__editor-color--active{box-shadow:0 0 0 2px white, 0 0 0 3px var(--color-secondary)}.mock-ui__editor-toggle-row{padding:.125rem 0}.mock-ui__toggle--on{border-radius:var(--radius-full);background-color:var(--color-secondary);width:1.5rem;height:.875rem;position:relative}.mock-ui__toggle--on:after{content:"";background-color:#fff;border-radius:50%;width:.625rem;height:.625rem;position:absolute;top:.125rem;right:.125rem}.mock-ui__section-icon{background-color:color-mix(in srgb, var(--color-secondary) 10%, transparent);width:2rem;height:2rem;color:var(--color-secondary);border-radius:.5rem;flex-shrink:0}.mock-ui__preview-frame{border:1px solid var(--gray-100,#f1f5f9);background-color:#fff;border-radius:.625rem;flex-direction:column;gap:.5rem;margin-block-start:.5rem;padding:.75rem;display:flex}.mock-ui__preview-section{border-radius:.375rem;padding:.625rem}.mock-ui__preview-section--hero{background:linear-gradient(135deg, color-mix(in srgb, var(--color-secondary) 12%, transparent), color-mix(in srgb, var(--color-card-mint) 30%, transparent));text-align:center;padding:1rem .75rem}.mock-ui__preview-section--content{background-color:var(--gray-50,#f8fafc)}.mock-ui__preview-section--form{background-color:color-mix(in srgb, var(--color-card-blush) 30%, white)}.mock-ui__preview-text-lg{border-radius:var(--radius-full);background-color:color-mix(in srgb, var(--color-secondary) 25%, transparent);width:60%;height:.625rem;margin:0 auto .375rem}.mock-ui__preview-text-md{border-radius:var(--radius-full);background-color:var(--gray-200);width:40%;height:.5rem;margin-block-end:.5rem}.mock-ui__preview-text-sm{border-radius:var(--radius-full);background-color:color-mix(in srgb, var(--color-secondary) 15%, transparent);width:45%;height:.375rem;margin:0 auto}.mock-ui__preview-grid{grid-template-columns:repeat(3,1fr);gap:.375rem;display:grid}.mock-ui__preview-img{aspect-ratio:1;background-color:color-mix(in srgb, var(--color-secondary) 10%, var(--gray-100));border-radius:.25rem}.mock-ui__preview-input{border:1px solid var(--gray-200);background-color:#fff;border-radius:.25rem;height:1rem;margin-block-end:.375rem}.mock-ui__preview-btn{background-color:var(--color-secondary);border-radius:.25rem;width:40%;height:1rem}.mock-ui__undo-btn{background-color:var(--gray-50,#f8fafc);width:1.75rem;height:1.75rem;color:var(--gray-500);cursor:pointer;border-radius:.375rem;transition:background-color .15s,color .15s}.mock-ui__undo-btn:hover{background-color:color-mix(in srgb, var(--color-secondary) 12%, transparent);color:var(--color-secondary)}.mock-ui__domain-row{margin-block-end:.75rem}.mock-ui__domain-label{color:var(--gray-500);text-transform:uppercase;letter-spacing:.05em;margin-block-end:.375rem;font-size:.6875rem;font-weight:600;display:block}.mock-ui__domain-input{background-color:var(--gray-50,#f8fafc);border:1px solid var(--gray-200);color:var(--gray-700);border-radius:.5rem;gap:.5rem;padding:.5rem .75rem;font-size:.8125rem;font-weight:500}.mock-ui__domain-input svg{color:var(--color-secondary);flex-shrink:0}.mock-ui__seo-section{margin-block-end:.75rem}.mock-ui__seo-header{margin-block-end:.375rem}.mock-ui__seo-label{color:var(--gray-700);font-size:.75rem;font-weight:600}.mock-ui__seo-score{color:var(--green-600);font-size:.8125rem;font-weight:700}.mock-ui__setting-row{border:1px solid var(--gray-100,#f1f5f9);border-radius:.5rem;padding:.5rem .75rem}