/* The Social Planet — Static CSS (replaces Tailwind CDN) */
/* Generated from used utility classes across index.html, pricing.html, contact.html */

/* ===== RESET ===== */
*,::after,::before{box-sizing:border-box;border:0 solid #e5e7eb;margin:0;padding:0}
html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;scroll-behavior:smooth;background-color:#faf9fe;}
body{line-height:inherit}
img,svg{display:block;max-width:100%;vertical-align:middle}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-size:inherit;font-weight:inherit}
ol,ul{list-style:none}
button{cursor:pointer;background:transparent}
table{border-collapse:collapse}
textarea{resize:vertical}
::placeholder{color:rgba(var(--on-surface)/0.4)}

/* ===== CSS VARIABLES ===== */
:root{
  --surface:250 249 254;--surface-container-lowest:255 255 255;--surface-container-low:244 243 248;
  --surface-container:238 237 243;--surface-dim:218 217 223;
  --on-surface:26 27 31;--on-surface-variant:70 70 74;--outline-variant:199 198 202;
  --primary:1 1 2;--on-primary:255 255 255;--primary-container:28 28 30;
  --accent:10 132 255;--accent-soft:232 241 255;--background:250 249 254;
}

/* ===== LAYOUT ===== */
.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}
.top-0{top:0}.left-0{left:0}.left-1\/2{left:50%}.right-0{right:0}.bottom-0{bottom:0}
.-top-3{top:-0.75rem}.-top-4{top:-1rem}
.-translate-x-1\/2{transform:translateX(-50%)}
.z-10{z-index:10}.z-50{z-index:50}
.overflow-hidden{overflow:hidden}

.flex{display:flex}.inline-flex{display:inline-flex}
.hidden{display:none}.block{display:block}.grid{display:grid}

.flex-col{flex-direction:column}.flex-1{flex:1 1 0%}.flex-grow{flex-grow:1}
.flex-wrap{flex-wrap:wrap}
.items-center{align-items:center}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}
.justify-between{justify-content:space-between}.justify-center{justify-content:center}
.self-start{align-self:flex-start}.self-end{align-self:flex-end}

.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.col-span-2{grid-column:span 2/span 2}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.gap-1{gap:0.25rem}.gap-2{gap:0.5rem}.gap-2\.5{gap:0.625rem}.gap-3{gap:0.75rem}
.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}
.gap-10{gap:2.5rem}.gap-12{gap:3rem}.gap-16{gap:4rem}
.gap-gutter{gap:24px}

.w-full{width:100%}.w-6{width:1.5rem}.w-7{width:1.75rem}.w-8{width:2rem}.w-9{width:2.25rem}
.w-12{width:3rem}.w-14{width:3.5rem}
.h-6{height:1.5rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-9{height:2.25rem}
.h-12{height:3rem}.h-14{height:3.5rem}.h-20{height:5rem}.h-full{height:100%}.h-px{height:1px}
.min-h-\[720px\]{min-height:720px}.min-h-screen{min-height:100vh}
.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}
.max-w-4xl{max-width:56rem}.max-w-container-max{max-width:1200px}
.max-w-\[680px\]{max-width:680px}
.mx-auto{margin-left:auto;margin-right:auto}.mx-4{margin-left:1rem;margin-right:1rem}
.object-contain{object-fit:contain}

/* ===== SPACING ===== */
.p-1{padding:0.25rem}.p-8{padding:2rem}.p-10{padding:2.5rem}
.px-2{padding-left:0.5rem;padding-right:0.5rem}.px-3{padding-left:0.75rem;padding-right:0.75rem}
.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}
.px-7{padding-left:1.75rem;padding-right:1.75rem}.px-8{padding-left:2rem;padding-right:2rem}
.px-9{padding-left:2.25rem;padding-right:2.25rem}
.px-margin-mobile{padding-left:20px;padding-right:20px}
.py-0\.5{padding-top:0.125rem;padding-bottom:0.125rem}.py-1{padding-top:0.25rem;padding-bottom:0.25rem}
.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.py-2\.5{padding-top:0.625rem;padding-bottom:0.625rem}
.py-3{padding-top:0.75rem;padding-bottom:0.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}
.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.py-16{padding-top:4rem;padding-bottom:4rem}.py-24{padding-top:6rem;padding-bottom:6rem}
.py-32{padding-top:8rem;padding-bottom:8rem}
.pt-2{padding-top:0.5rem}.pt-3{padding-top:0.75rem}.pt-4{padding-top:1rem}
.pt-32{padding-top:8rem}
.pb-0{padding-bottom:0}.pb-1{padding-bottom:0.25rem}.pb-2{padding-bottom:0.5rem}
.pb-4{padding-bottom:1rem}.pb-12{padding-bottom:3rem}.pb-24{padding-bottom:6rem}
.mb-1{margin-bottom:0.25rem}.mb-2{margin-bottom:0.5rem}.mb-3{margin-bottom:0.75rem}
.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}
.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}
.mb-14{margin-bottom:3.5rem}.mb-16{margin-bottom:4rem}
.mt-2{margin-top:0.5rem}.mt-3{margin-top:0.75rem}.mt-5{margin-top:1.25rem}
.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}
.mt-12{margin-top:3rem}.mt-20{margin-top:5rem}.mt-32{margin-top:8rem}
.mt-0\.5{margin-top:0.125rem}
.space-y-1>*+*{margin-top:0.25rem}.space-y-3>*+*{margin-top:0.75rem}
.space-y-5>*+*{margin-top:1.25rem}.space-y-6>*+*{margin-top:1.5rem}
.space-y-10>*+*{margin-top:2.5rem}.space-y-14>*+*{margin-top:3.5rem}

/* ===== TYPOGRAPHY ===== */
.text-xs{font-size:0.75rem;line-height:1rem}.text-sm{font-size:0.875rem;line-height:1.25rem}
.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}
.text-\[17px\]{font-size:17px}.text-\[18px\]{font-size:18px}
.text-\[34px\]{font-size:34px}.text-\[40px\]{font-size:40px}
.font-bold{font-weight:700}
.leading-none{line-height:1}.leading-relaxed{line-height:1.625}
.tracking-tight{letter-spacing:-0.025em}.tracking-normal{letter-spacing:0}
.tracking-\[0\.2em\]{letter-spacing:0.2em}
.text-center{text-align:center}
.normal-case{text-transform:none}
.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.resize-none{resize:none}
.appearance-none{-webkit-appearance:none;appearance:none}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ===== COLORS ===== */
.bg-background{background-color:rgb(var(--background))}
.bg-surface{background-color:rgb(var(--surface))}
.bg-surface-container-lowest{background-color:rgb(var(--surface-container-lowest))}
.bg-primary{background-color:rgb(var(--primary))}
.bg-accent-soft{background-color:rgb(var(--accent-soft))}
.bg-transparent{background-color:transparent}
.bg-white{background-color:#fff}
.bg-on-surface\/5{background-color:rgba(var(--on-surface)/0.05)}

.text-primary{color:rgb(var(--primary))}
.text-on-primary{color:rgb(var(--on-primary))}
.text-on-surface{color:rgb(var(--on-surface))}
.text-on-surface-variant{color:rgb(var(--on-surface-variant))}
.text-on-surface-variant\/70{color:rgba(var(--on-surface-variant)/0.7)}
.text-accent{color:rgb(var(--accent))}
.text-white{color:#fff}
.text-red-500{color:#ef4444}
.text-green-600{color:#16a34a}

.border-primary{border-color:rgb(var(--primary))}
.border-accent\/30{border-color:rgba(var(--accent)/0.3)}
.border-on-surface\/5{border-color:rgba(var(--on-surface)/0.05)}
.border-on-surface\/10{border-color:rgba(var(--on-surface)/0.10)}
.border-on-surface\/15{border-color:rgba(var(--on-surface)/0.15)}
.border-0{border-width:0}.border{border-width:1px}
.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}

.opacity-30{opacity:0.3}.opacity-40{opacity:0.4}.opacity-60{opacity:0.6}
.shadow-sm{box-shadow:0 1px 2px rgba(0,0,0,0.05)}
.shadow-md{box-shadow:0 4px 6px -1px rgba(0,0,0,0.1)}
.shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,0.1)}
.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,0.25)}
.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,0.1)}
.shadow-on-surface\/5{--tw-shadow-color:rgba(var(--on-surface)/0.05);box-shadow:0 25px 50px -12px var(--tw-shadow-color)}

/* ===== BORDERS & RADIUS ===== */
.rounded-full{border-radius:9999px}.rounded-2xl{border-radius:1.5rem}
.rounded-xl{border-radius:1rem}.rounded-lg{border-radius:0.75rem}
.rounded-\[28px\]{border-radius:28px}

/* ===== TRANSITIONS ===== */
.transition-all{transition-property:all;transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-duration:150ms}
.transition-colors{transition-property:color,background-color,border-color;transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-duration:150ms}
.duration-300{transition-duration:300ms}.duration-500{transition-duration:500ms}

/* ===== FORMS ===== */
.focus\:ring-0:focus{box-shadow:none}
.focus\:border-accent:focus{border-color:rgb(var(--accent))}
.focus\:outline-none:focus{outline:none}
.placeholder\:text-on-surface\/20::placeholder{color:rgba(var(--on-surface)/0.2)}
.placeholder\:text-on-surface\/25::placeholder{color:rgba(var(--on-surface)/0.25)}
.selection\:bg-accent-soft::selection{background-color:rgb(var(--accent-soft))}
.selection\:text-accent::selection{color:rgb(var(--accent))}
input,select,textarea{background-color:transparent}

/* ===== HOVER STATES ===== */
.hover\:text-primary:hover{color:rgb(var(--primary))}
.hover\:text-accent:hover{color:rgb(var(--accent))}
.hover\:text-on-primary:hover{color:rgb(var(--on-primary))}
.hover\:bg-primary:hover{background-color:rgb(var(--primary))}
.hover\:shadow-xl:hover{box-shadow:0 20px 25px -5px rgba(0,0,0,0.1)}
.hover\:gap-3:hover{gap:0.75rem}

/* ===== RESPONSIVE ===== */
@media (min-width:640px){
  .sm\:flex-row{flex-direction:row}
}
@media (min-width:768px){
  .md\:py-32{padding-top:8rem;padding-bottom:8rem}
  .md\:py-4{padding-top:1rem;padding-bottom:1rem}
  .md\:mb-16{margin-bottom:4rem}
  .md\:mb-6{margin-bottom:1.5rem}
  .md\:gap-10{gap:2.5rem}
  .md\:text-xl{font-size:1.25rem;line-height:1.75rem}
  .md\:flex{display:flex}
  .md\:hidden{display:none}
  .md\:inline-flex{display:inline-flex}
  .md\:flex-row{flex-direction:row}
  .md\:items-end{align-items:flex-end}
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .md\:col-span-1{grid-column:span 1/span 1}
  .md\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}
  .md\:col-span-4{grid-column:span 4/span 4}
  .md\:col-span-12{grid-column:span 12/span 12}
  .md\:p-14{padding:3.5rem}.md\:p-16{padding:4rem}
  .md\:px-margin-desktop{padding-left:64px;padding-right:64px}
  .md\:scale-105{transform:scale(1.05)}
  .md\:text-center{text-align:center}
  .md\:block{display:block}
}
@media (min-width:1024px){
  .lg\:grid-cols-12{grid-template-columns:repeat(12,minmax(0,1fr))}
  .lg\:col-span-5{grid-column:span 5/span 5}
  .lg\:col-span-7{grid-column:span 7/span 7}
  .lg\:pl-8{padding-left:2rem}
}

/* ===== SCROLL ===== */
.scroll-smooth{scroll-behavior:smooth}
.scroll-mt-28{scroll-margin-top:7rem}

/* ===== ANIMATION ===== */
.animate-pulse{animation:pulse 2s cubic-bezier(0.4,0,0.6,1) infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}