.widget-page #int-hero {position: relative;z-index: 1;background-color: var(--primary);padding: 6rem 0;text-align: center;color: white;}.widget-page #int-hero p {max-width: 40rem;}.widget-page #int-hero #home-h {font-size: 2.5rem;line-height: 1.2;margin-bottom: 2rem;color: white;max-width: 800px;margin-left: auto;margin-right: auto;}.widget-page #int-hero picture {position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: -1;}.widget-page #int-hero picture::after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.5));}.widget-page #int-hero picture img {width: 100%;height: 100%;object-fit: cover;}.widget-page .widget-demo-section {padding: 4rem 0;background-color: var(--light);}.widget-page .widget-demo-section .cs-container {width: 100%;max-width: 1200px;margin: 0 auto;padding: 0 1rem;text-align: center;}.widget-page .widget-demo-section .cs-content {max-width: 800px;margin: 0 auto 3rem;text-align: center;}.widget-page .widget-demo-section .widget-demo {max-width: 800px;margin: 0 auto;padding: 2rem;background: var(--white);border-radius: 8px;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);text-align: center;}.widget-page .widget-demo-section .widget-demo #tint-widget-container {width: 100%;max-width: 600px;margin: 0 auto;text-align: left;}.widget-page .widget-demo-section .widget-demo #tint-widget {width: 100%;max-width: 600px;margin: 0 auto;text-align: left;}.widget-page .widget-demo-section .widget-demo .tint-widget {width: 100%;max-width: 600px;margin: 0 auto;text-align: left;}.widget-page .widget-demo-section .widget-demo .building-container {width: 100%;max-width: 600px;margin: 0 auto;text-align: left;}.widget-page .widget-demo-section .widget-demo .controls {width: 100%;max-width: 600px;margin: 0 auto;text-align: left;}.widget-page .widget-demo-section .widget-demo .attribution {width: 100%;text-align: center;margin-top: 1rem;}.widget-page .widget-features {padding: 4rem 0;}.widget-page .widget-features .cs-container {width: 100%;max-width: 1200px;margin: 0 auto;padding: 0 1rem;text-align: center;}.widget-page .widget-features .cs-content {max-width: 800px;margin: 0 auto 3rem;text-align: center;}.widget-page .widget-features .cs-flex {display: grid;grid-template-columns: repeat(3, 1fr);gap: 2rem;max-width: 1200px;margin: 0 auto;text-align: center;}.widget-page .widget-features .cs-card {background: var(--white);border-radius: 8px;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);transition: transform 0.3s ease;text-align: center;}.widget-page .widget-features .cs-card:hover {transform: translateY(-5px);}.widget-page .widget-features .cs-card .cs-card-inner {padding: 2rem;text-align: center;}.widget-page .widget-features .cs-card .cs-h3 {color: var(--primary);margin-bottom: 1rem;text-align: center;}.widget-page .widget-features .cs-card .cs-list {list-style: none;padding: 0;margin: 0;text-align: center;}.widget-page .widget-features .cs-card .cs-list li {padding: 0.5rem 0;border-bottom: 1px solid var(--light);text-align: center;}.widget-page .widget-features .cs-card .cs-list li:last-child {border-bottom: none;}.widget-page .widget-technical {padding: 4rem 0;background-color: var(--light);}.widget-page .widget-technical .cs-container {width: 100%;max-width: 1200px;margin: 0 auto;padding: 0 1rem;text-align: center;}.widget-page .widget-technical .cs-content {max-width: 800px;margin: 0 auto 3rem;text-align: center;}.widget-page .widget-technical .cs-flex {display: grid;grid-template-columns: repeat(3, 1fr);gap: 2rem;max-width: 1200px;margin: 0 auto;text-align: center;}.widget-page .widget-technical .cs-card {background: var(--white);border-radius: 8px;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);transition: transform 0.3s ease;text-align: center;}.widget-page .widget-technical .cs-card:hover {transform: translateY(-5px);}.widget-page .widget-technical .cs-card .cs-card-inner {padding: 2rem;text-align: center;}.widget-page .widget-technical .cs-card .cs-h3 {color: var(--primary);margin-bottom: 1rem;text-align: center;}.widget-page .widget-technical .cs-card .cs-list {list-style: none;padding: 0;margin: 0;text-align: center;}.widget-page .widget-technical .cs-card .cs-list li {padding: 0.5rem 0;border-bottom: 1px solid var(--light);text-align: center;}.widget-page .widget-technical .cs-card .cs-list li:last-child {border-bottom: none;}.widget-page .widget-pricing {padding: 4rem 0;background-color: var(--light);}.widget-page .widget-pricing .cs-container {width: 100%;max-width: 1200px;margin: 0 auto;padding: 0 1rem;text-align: center;}.widget-page .widget-pricing .cs-content {max-width: 800px;margin: 0 auto 3rem;text-align: center;}.widget-page .widget-pricing .cs-flex {display: flex;justify-content: center;max-width: 600px;margin: 0 auto;text-align: center;}.widget-page .widget-pricing .cs-card {background: white;border-radius: 8px;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);transition: transform 0.3s ease;text-align: center;display: flex;flex-direction: column;align-items: center;width: 100%;max-width: 500px;}.widget-page .widget-pricing .cs-card:hover {transform: translateY(-5px);}.widget-page .widget-pricing .cs-card .cs-card-inner {padding: 2rem;text-align: center;width: 100%;display: flex;flex-direction: column;align-items: center;}.widget-page .widget-pricing .cs-card .cs-h3 {color: var(--primary);margin-bottom: 1.5rem;text-align: center;width: 100%;}.widget-page .widget-pricing .cs-card .cs-total-cost {text-align: center;margin-bottom: 2rem;padding: 1.5rem;background: var(--light);border-radius: 8px;width: 100%;display: flex;flex-direction: column;align-items: center;}.widget-page .widget-pricing .cs-card .cs-cost-breakdown {display: flex;align-items: center;justify-content: center;gap: 0.75rem;margin-bottom: 0.5rem;text-align: center;width: 100%;}.widget-page .widget-pricing .cs-card .cs-price {font-size: 2rem;font-weight: bold;color: var(--primary);text-align: center;}.widget-page .widget-pricing .cs-card .cs-label {font-size: 1rem;color: var(--text);text-align: center;}.widget-page .widget-pricing .cs-card .cs-plus {font-size: 1.5rem;color: var(--text);opacity: 0.8;text-align: center;}.widget-page .widget-pricing .cs-card .cs-total-note {font-size: 1.1rem;color: var(--primary);font-weight: bold;margin: 0;padding-top: 1rem;border-top: 1px solid #eee;text-align: center;width: 100%;}.widget-page .widget-pricing .cs-card .cs-list {list-style: none;padding: 0;margin: 0 0 2rem 0;text-align: center;width: 100%;}.widget-page .widget-pricing .cs-card .cs-list li {padding: 0.5rem 0;border-bottom: 1px solid var(--light);text-align: center;width: 100%;color: var(--text);}.widget-page .widget-pricing .cs-card .cs-list li:last-child {border-bottom: none;}.widget-page .widget-pricing .cs-card .cs-note {background: var(--light);padding: 1rem;border-radius: 8px;margin-bottom: 1.5rem;text-align: center;font-size: 0.9rem;width: 100%;display: flex;flex-direction: column;align-items: center;}.widget-page .widget-pricing .cs-card .cs-note strong {color: var(--primary);display: block;margin-bottom: 0.5rem;text-align: center;width: 100%;}.widget-page .widget-pricing .cs-card .cs-button-solid {margin-top: auto;background: var(--primary);color: white;padding: 1rem 2rem;border-radius: 4px;text-decoration: none;transition: background-color 0.3s ease;}.widget-page .widget-pricing .cs-card .cs-button-solid:hover {background: var(--primaryDark);}.widget-page .widget-cta {padding: 4rem 0;background-color: var(--primary);color: white;text-align: center;}.widget-page .widget-cta .cs-container {width: 100%;max-width: 1200px;margin: 0 auto;padding: 0 1rem;text-align: center;}.widget-page .widget-cta .cs-content {max-width: 800px;margin: 0 auto;text-align: center;}.widget-page .widget-cta .cs-title {margin-bottom: 1rem;color: white;text-align: center;}.widget-page .widget-cta .cs-text {margin-bottom: 2rem;font-size: 1.1rem;color: white;text-align: center;}.widget-page .widget-cta .cs-button-solid {background: white;color: var(--primary);padding: 1rem 2rem;border-radius: 4px;text-decoration: none;transition: background-color 0.3s ease;text-align: center;display: inline-block;}.widget-page .widget-cta .cs-button-solid:hover {background: var(--light);}@media (max-width: 768px) {.widget-page #int-hero {padding: 4rem 0;}.widget-page #int-hero #home-h {font-size: 2rem;padding: 0 1rem;}.widget-page .widget-features .cs-flex, .widget-page .widget-technical .cs-flex {grid-template-columns: 1fr;}.widget-page .widget-pricing .cs-flex {grid-template-columns: 1fr;}.widget-page .widget-demo {padding: 1rem;}}.widget-config {padding: 4rem 0;background-color: var(--light);}.widget-config .cs-container {width: 100%;max-width: 1200px;margin: 0 auto;padding: 0 1rem;text-align: center;}.widget-config .cs-content {max-width: 800px;margin: 0 auto 3rem;text-align: center;}.widget-config .cs-flex {display: grid;grid-template-columns: 1fr 1fr;gap: 2rem;max-width: 1200px;margin: 0 auto;text-align: left;}.widget-config .config-form {background: white;padding: 2rem;border-radius: 8px;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);}.widget-config .config-form .form-group {margin-bottom: 1.5rem;}.widget-config .config-form .form-group label {display: block;margin-bottom: 0.5rem;color: var(--text);font-weight: 500;}.widget-config .config-form .cs-input {width: 100%;padding: 0.75rem;border: 1px solid var(--light);border-radius: 4px;font-size: 1rem;color: var(--text);background: white;}.widget-config .config-form .cs-input:focus {outline: none;border-color: var(--primary);}.widget-config .config-form .toggle-switch {position: relative;display: inline-block;width: 60px;height: 34px;}.widget-config .config-form .toggle-switch input {opacity: 0;width: 0;height: 0;}.widget-config .config-form .toggle-switch input:checked + .toggle-slider {background-color: var(--primary);}.widget-config .config-form .toggle-switch input:checked + .toggle-slider:before {transform: translateX(26px);}.widget-config .config-form .toggle-switch .toggle-slider {position: absolute;cursor: pointer;top: 0;left: 0;right: 0;bottom: 0;background-color: #ccc;transition: 0.4s;border-radius: 34px;}.widget-config .config-form .toggle-switch .toggle-slider:before {position: absolute;content: "";height: 26px;width: 26px;left: 4px;bottom: 4px;background-color: white;transition: 0.4s;border-radius: 50%;}.widget-config .config-form .color-picker input[type=color] {width: 100%;height: 40px;padding: 0;border: none;border-radius: 4px;cursor: pointer;}.widget-config .config-form .cs-button-solid {width: 100%;margin-top: 1rem;}.widget-config .config-preview {background: white;padding: 2rem;border-radius: 8px;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);}.widget-config .config-preview h3 {color: var(--primary);margin-bottom: 1.5rem;text-align: center;}.widget-config .config-preview #config-widget-container {width: 100%;max-width: 500px;margin: 0 auto;}@media (max-width: 768px) {.widget-config .cs-flex {grid-template-columns: 1fr;}}.tint-widget {width: 100%;max-width: 600px;margin: 0 auto;background: white;border-radius: 8px;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);padding: 20px;}.tint-preview {width: 100%;height: 300px;background-size: cover;background-position: center;border-radius: 4px;margin-bottom: 20px;position: relative;overflow: hidden;--tint-color: #000000;--tint-opacity: 0.3;transition: background-image 0.3s ease;}.tint-preview::after {content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-color: var(--tint-color);opacity: var(--tint-opacity);transition: all 0.3s ease;}.tint-controls {padding: 15px 0;border-top: 1px solid #eee;}.tint-controls input[type=range] {width: 100%;height: 6px;background: #ddd;border-radius: 3px;outline: none;-webkit-appearance: none;}.tint-controls input[type=range]::-webkit-slider-thumb {-webkit-appearance: none;width: 20px;height: 20px;background: var(--primary);border-radius: 50%;cursor: pointer;transition: background 0.3s ease;}.tint-controls input[type=range]::-webkit-slider-thumb:hover {background: var(--primaryDark);}.tint-labels {display: flex;justify-content: space-between;margin-top: 0.5rem;font-size: 0.9rem;color: #666;}.tint-attribution {text-align: center;font-size: 0.9rem;color: #666;margin-top: 15px;padding-top: 15px;border-top: 1px solid #eee;}.widget-pricing, .widget-showcase, .widget-concept {padding: clamp(5rem, 10vh, 10rem) 1rem;position: relative;}.widget-pricing .cs-container, .widget-showcase .cs-container, .widget-concept .cs-container {width: 100%;max-width: var(--container-width);margin: auto;padding: 0 1rem;}.widget-pricing .cs-content, .widget-showcase .cs-content, .widget-concept .cs-content {max-width: 800px;margin: 0 auto 5rem;text-align: center;display: flex;flex-direction: column;align-items: center;}.widget-pricing .cs-content .cs-title, .widget-showcase .cs-content .cs-title, .widget-concept .cs-content .cs-title {margin-bottom: 2rem;width: 100%;}.widget-pricing .cs-content .cs-text, .widget-showcase .cs-content .cs-text, .widget-concept .cs-content .cs-text {max-width: 600px;margin: 0 auto;}.widget-concept {background-color: #fff;}.widget-concept .cs-flex {display: grid;grid-template-columns: repeat(3, 1fr);gap: 2rem;max-width: 1200px;margin: auto;}.widget-concept .cs-box {text-align: center;padding: 2rem;background: #f8f9fa;border-radius: 8px;transition: transform 0.3s ease;}.widget-concept .cs-box:hover {transform: translateY(-5px);}.widget-showcase {background-color: var(--primary);color: #fff;}.widget-showcase .cs-title, .widget-showcase .cs-text, .widget-showcase .cs-topper, .widget-showcase .cs-h3 {color: #fff;}.widget-showcase .widget-demo {max-width: 1000px;margin: 0 auto 3rem;padding: 2rem;background: #fff;border-radius: 12px;box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);}.widget-showcase .widget-features {max-width: 600px;margin: 0 auto;text-align: center;}.widget-showcase .cs-list {list-style: none;padding: 0;margin: 1.5rem 0;display: grid;grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));gap: 1rem;}.widget-showcase .cs-list li {color: #fff;padding: 0.5rem 1rem;background: rgba(255, 255, 255, 0.1);border-radius: 4px;}.widget-pricing {background-color: #fff;}.widget-pricing .cs-flex {display: grid;grid-template-columns: repeat(2, 1fr);gap: 2rem;max-width: 1000px;margin: auto;}.widget-pricing .cs-card {text-align: center;padding: 1rem;}.widget-pricing .cs-card-inner {padding: 2rem;background: #f8f9fa;border-radius: 8px;transition: transform 0.3s ease;}.widget-pricing .cs-card-inner:hover {transform: translateY(-5px);box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);}.widget-pricing .cs-card .cs-total-cost {margin: 2rem 0;padding: 1.5rem;background: white;border-radius: 8px;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);}.widget-pricing .cs-card .cs-cost-breakdown {display: flex;align-items: center;justify-content: center;gap: 0.75rem;margin-bottom: 1rem;}.widget-pricing .cs-card .cs-cost-breakdown .cs-price {font-size: 2rem;font-weight: bold;color: var(--primary);}.widget-pricing .cs-card .cs-cost-breakdown .cs-label {color: #666;font-size: 1rem;}.widget-pricing .cs-card .cs-cost-breakdown .cs-plus {font-size: 1.5rem;font-weight: bold;color: var(--primary);opacity: 0.8;}.widget-pricing .cs-card .cs-total-note {font-size: 1.1rem;font-weight: 500;color: var(--primary);margin: 0;padding-top: 1rem;border-top: 1px solid #eee;}.widget-pricing .cs-price {display: block;font-size: 2rem;font-weight: bold;color: var(--primary);margin: 1rem 0;}.widget-pricing .cs-list {list-style: none;padding: 0;margin: 1.5rem 0;}.widget-pricing .cs-list li {margin: 0.75rem 0;color: #666;}.widget-pricing .cs-note {margin: 1.5rem 0;padding: 1rem;background: #e9ecef;border-radius: 4px;border-left: 4px solid var(--primary);text-align: left;}.widget-pricing .cs-note strong {color: var(--primary);display: block;margin-bottom: 0.5rem;}.widget-pricing .cs-button-solid {display: inline-block;margin-top: 1rem;padding: 0.75rem 2rem;background: var(--primary);color: #fff;text-decoration: none;border-radius: 4px;transition: background 0.3s ease;}.widget-pricing .cs-button-solid:hover {background: var(--primaryDark);}@media (max-width: 768px) {.widget-concept .cs-flex {grid-template-columns: 1fr;}.widget-pricing .cs-flex {display: flex;flex-direction: column;align-items: center;gap: 2rem;max-width: 500px;margin: 0 auto;padding: 0 1rem;}.widget-pricing .cs-card {width: 100%;max-width: 500px;margin: 0 auto;padding: 0;}.widget-pricing .cs-content {padding: 0 1rem;}.widget-showcase .widget-demo {padding: 1rem;}.widget-showcase .cs-list {grid-template-columns: 1fr;}.cs-card .cs-pricing-block {flex-direction: column;gap: 1rem;}.cs-card .cs-plus-symbol {transform: rotate(90deg);}}