:root{
    --purple:#7C3AED;
    --purple-2:#A855F7;
    --purple-soft:#EEE3FF;
    --blue-soft:#D8ECFF;
    --text:#090909;
    --muted:#6E6E73;
    --line:#E8D9FF;
    --shadow:0 28px 70px rgba(0,0,0,.08);
    --radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Poppins,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--text);background:#fff;font-size:16px}
a{text-decoration:none;color:inherit}
button,input,textarea,select{font:inherit}
.container{width:min(1200px,calc(100% - 88px));margin-inline:auto}
.narrow{width:min(650px,calc(100% - 40px));margin-inline:auto}
.center{text-align:center}
.pt-0{padding-top:0!important}
.site-header{height:82px;display:flex;align-items:center;background:#fff;position:sticky;top:0;z-index:50}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand img{height:48px;width:auto;display:block;object-fit:contain}
.main-nav{display:flex;align-items:center;gap:48px;font-weight:600;font-size:14px;margin-left:auto}
.main-nav a{transition:.2s;color:#0a0a0a}.main-nav a.active,.main-nav a:hover{color:var(--purple)}
.nav-actions{display:flex;align-items:center;gap:22px}.nav-actions form{margin:0}.nav-toggle{display:none;background:none;border:0;font-size:26px}
.btn{border:0;border-radius:11px;padding:13px 25px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:12px;cursor:pointer;transition:.2s;line-height:1;white-space:nowrap}.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg,var(--purple),#8E43F7);color:#fff;box-shadow:0 14px 28px rgba(124,58,237,.22)}
.btn-outline{border:1.6px solid var(--purple);color:#111;background:#fff}.btn.big{padding:19px 32px;border-radius:14px;font-size:18px}.btn.full{width:100%;margin-top:24px}
.flash{position:fixed;top:86px;left:50%;transform:translateX(-50%);z-index:1000;padding:14px 20px;border-radius:14px;box-shadow:var(--shadow);font-weight:600}.flash-success{background:#ecfdf5;color:#047857}.flash-error{background:#fff1f2;color:#be123c}
.hero-blue{background:var(--blue-soft);padding:75px 0 70px}.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.hero-copy h1{font-size:56px;line-height:1.05;margin:0 0 20px;font-weight:800;letter-spacing:-.04em}.hero-copy h1 span{color:var(--purple)}.hero-copy p{color:#555;max-width:560px;margin:0 0 27px;line-height:1.65;font-weight:500}.hero-btn{padding:18px 30px;border-radius:13px}.hero-visual{min-height:360px;position:relative;display:grid;place-items:center}.bubble{position:absolute;border-radius:50%;background:rgba(124,58,237,.17)}.bubble-one{width:210px;height:210px;right:130px;top:10px;background:rgba(59,130,246,.17)}.bubble-two{width:235px;height:235px;right:30px;bottom:10px}.bubble-three{width:200px;height:200px;left:120px;bottom:60px;background:rgba(59,130,246,.15)}
.phone-card{width:190px;height:300px;background:linear-gradient(155deg,#8B5CF6,#31205f);border-radius:26px;box-shadow:0 35px 65px rgba(74,42,142,.32);position:relative;color:#fff;padding:24px}.tilted{transform:rotate(-14deg)}.phone-top{display:flex;gap:10px;align-items:center}.phone-top span,.mini-avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#ffdb8a,#d66)}.phone-line{height:7px;background:rgba(255,255,255,.35);border-radius:99px;margin-top:45px}.phone-line.short{width:70%;margin-top:18px}.phone-icons{display:flex;gap:12px;margin-top:28px}.phone-icons i{width:22px;height:22px;border-radius:50%;background:#18d36e}.floating-icon{position:absolute;background:#fff;border-radius:18px;box-shadow:var(--shadow);display:grid;place-items:center;font-weight:800;color:#111}.qr{width:88px;height:88px;right:10px;top:130px;font-size:45px}.whats{width:55px;height:55px;right:165px;top:115px;color:#25D366}.share{width:82px;height:82px;left:170px;bottom:55px;font-size:34px}
.logo-strip{background:#faffff;padding:32px 0}.partners{display:flex;justify-content:space-between;align-items:center;gap:25px;color:#111;font-size:22px}.google{background:linear-gradient(90deg,#4285F4,#DB4437,#F4B400,#0F9D58);-webkit-background-clip:text;color:transparent}.monday-dots{color:#e84b9a}
.section{padding:92px 0}.section h1,.section h2{font-size:42px;line-height:1.14;margin:0 0 18px;font-weight:800;letter-spacing:-.035em}.section p{color:var(--muted);line-height:1.6}.eyebrow{display:block;color:var(--purple);font-size:14px;font-weight:700;margin-bottom:22px;text-transform:uppercase;letter-spacing:.02em}.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}.section-copy p{font-size:14px;font-weight:500;max-width:520px}.check-list{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:16px;font-size:13px;font-weight:600}.check-list li::before{content:'✓';display:inline-grid;place-items:center;width:19px;height:19px;border-radius:50%;background:var(--purple-soft);color:var(--purple);margin-right:12px}.radar-card{position:relative;min-height:430px;display:grid;place-items:center}.radar-circle{position:absolute;border-radius:50%;background:rgba(124,58,237,.20)}.r1{width:350px;height:350px}.r2{width:250px;height:250px;background:rgba(124,58,237,.18)}.r3{width:135px;height:135px;background:#fff}.bluetooth{position:relative;width:74px;height:74px;background:linear-gradient(135deg,#8B5CF6,#60A5FA);border-radius:20px;color:#fff;display:grid;place-items:center;font-size:44px;z-index:2;box-shadow:var(--shadow)}.person-chip{position:absolute;z-index:3;background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:12px 18px;display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;min-width:245px;box-shadow:0 20px 40px rgba(124,58,237,.08)}.person-chip span{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#111,#777)}.person-chip b{font-size:13px}.person-chip small{color:var(--purple);font-weight:700}.chip-a{top:20px;left:0}.chip-b{right:10px;top:135px}.chip-c{bottom:30px;right:90px}
.chart-card{width:min(440px,100%);margin:32px auto 0;background:#faf8ff;border-radius:10px;padding:24px;box-shadow:0 8px 22px rgba(124,58,237,.07)}.chart-card strong{font-size:12px}.chart-card svg{width:100%;display:block;margin-top:12px}.chart-labels{display:flex;justify-content:space-between;color:#555;font-size:11px;font-weight:700}.features-mini h2{margin-bottom:50px}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}.feature-grid.compact{gap:18px}.feature-card{border:1.8px solid var(--line);border-radius:10px;padding:31px;background:#fff;min-height:196px}.feature-icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--purple-soft);color:var(--purple);font-size:25px;margin-bottom:25px}.feature-card h3{margin:0 0 12px;font-size:22px;line-height:1.2}.feature-card p{font-size:12px;margin:0;text-transform:capitalize}.feature-cta{margin-top:90px}.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:52px}.step-card{border:1.8px solid var(--line);border-radius:10px;padding:31px}.step-card span{display:block;color:var(--purple);font-weight:800;margin-bottom:25px}.step-card h3{margin:0 0 10px}.step-card p{font-size:12px;margin:0}.cta-claim{padding-top:40px}.claim-form{margin:24px auto 8px;width:min(470px,100%);height:44px;border:1.5px solid #111;border-radius:11px;display:flex;align-items:center;gap:8px;padding:4px;background:#fff}.claim-form span{padding-left:14px;color:#aaa;font-size:13px}.claim-form input{border:0;outline:0;flex:1;min-width:0}.claim-form .btn{height:36px;padding:0 24px;border-radius:9px}.cta-claim small{color:#999}
.page-hero{padding-top:92px;padding-bottom:48px}.page-hero h1{font-size:44px}.page-hero p{font-size:18px;font-weight:500}.story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:70px}.soft-card{background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:45px 38px;min-height:215px}.soft-card h3{color:var(--purple);font-size:22px;margin:0 0 18px}.soft-card p{font-size:14px;margin:0}.team-section{padding-top:20px}.team-section h2{font-size:38px;margin-bottom:48px}.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:60px}.team-card img{width:100%;height:285px;object-fit:cover;border-radius:10px;display:block}.team-card h3{font-size:21px;margin:26px 0 2px}.team-card p{font-weight:600;color:#111;margin:0}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:70px}.stat-card{background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:50px 20px;text-align:center}.stat-card strong{display:block;color:var(--purple);font-size:58px;line-height:1;font-weight:800}.stat-card span{display:block;color:#777;margin-top:20px}
.contact-title{padding-bottom:38px}.contact-card{background:#fff;border-radius:10px;box-shadow:var(--shadow);padding:13px;display:grid;grid-template-columns:430px 1fr;gap:50px}.contact-info{position:relative;overflow:hidden;background:#9B6CF1;color:#fff;border-radius:8px;padding:50px 42px;min-height:650px}.contact-info h2{font-size:29px;margin:0 0 12px;color:#fff}.contact-info p{color:#e7d9ff;font-size:18px}.contact-lines{margin-top:100px;display:grid;gap:44px}.contact-lines div{display:grid;grid-template-columns:28px 1fr;gap:22px;align-items:start}.contact-socials{position:absolute;bottom:38px;left:42px;display:flex;gap:20px}.contact-socials a{width:30px;height:30px;border-radius:50%;background:#2EA7FF;color:#fff;display:grid;place-items:center;font-size:13px}.contact-info .circle{position:absolute;border-radius:50%;background:rgba(255,255,255,.16)}.contact-info .c1{width:145px;height:145px;right:70px;bottom:90px}.contact-info .c2{width:220px;height:220px;right:-80px;bottom:-70px}.contact-form{padding:58px 42px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:40px}.contact-form label,.builder-form label{font-size:12px;font-weight:600;color:#777;display:grid;gap:10px;margin-bottom:35px}.contact-form input,.contact-form textarea,.builder-form input,.builder-form textarea,.builder-form select{border:0;border-bottom:1.6px solid #999;padding:8px 0 12px;outline:0;background:transparent;color:#111}.contact-form textarea,.builder-form textarea{min-height:70px;resize:vertical}.subject-group{margin:10px 0 45px}.subject-group strong{display:block;margin-bottom:18px;font-size:14px}.subject-group label{display:inline-flex;align-items:center;gap:8px;margin:0 22px 10px 0;color:#111}.subject-group input{accent-color:var(--purple)}.send-row{display:flex;justify-content:flex-end}
.auth-page{
    
        transform: scale(.7);
    display: flex;
    align-items: center;
    justify-content: center;

    overflow-y: hidden;
}.auth-card{width:min(670px,calc(100% - 40px));border-radius:28px;background:#fff;box-shadow:0 38px 100px rgba(0,0,0,.12);padding:88px 50px 45px}.auth-card h1{font-size:43px;line-height:1;margin:0;font-weight:800}.auth-card p{font-size:31px;line-height:1.1;margin:10px 0 54px}.auth-card input:not([type=checkbox]){width:100%;height:80px;border:1.5px solid #ddd;border-radius:11px;padding:0 32px;margin-bottom:27px;font-size:18px;outline:0}.forgot{display:inline-block;margin:18px 0 45px;color:#333}.auth-submit{width:100%;height:78px;border-radius:14px;font-size:24px}.auth-switch{text-align:center;margin-top:44px;font-size:18px}.auth-switch a{font-weight:800}.terms{display:flex;align-items:center;gap:18px;margin:10px 0 35px;font-size:17px}.terms input{width:27px;height:27px;accent-color:var(--purple)}.auth-card.signup{padding-top:66px}.auth-card.signup p{margin-bottom:36px}.auth-card.signup input:not([type=checkbox]){height:70px;margin-bottom:26px}
.dashboard-hero{padding-bottom:36px}.dash-header{display:flex;justify-content:space-between;align-items:end;gap:30px}.card-list-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.dashboard-card{border:1.5px solid var(--line);border-radius:18px;padding:24px;background:#fff;box-shadow:0 16px 36px rgba(124,58,237,.05)}.dash-card-top{display:flex;gap:16px;align-items:center}.avatar-letter,.public-card-avatar{display:grid;place-items:center;color:#fff;background:var(--card-color,var(--purple));font-weight:800}.avatar-letter{width:58px;height:58px;border-radius:17px}.dash-card-top h3{margin:0 0 4px}.dash-card-top p{margin:0;font-size:13px}.dash-stats{display:flex;justify-content:space-between;gap:10px;margin:25px 0;color:#777;font-size:13px}.dash-stats b{display:block;color:var(--purple);font-size:22px}.empty-state{grid-column:1/-1;text-align:center;border:1.5px dashed var(--line);border-radius:20px;padding:70px 20px}.builder-grid{display:grid;grid-template-columns:1.45fr .8fr;gap:45px;align-items:start}.builder-form,.live-preview-card{border:1.5px solid var(--line);border-radius:22px;padding:35px;background:#fff;box-shadow:0 18px 45px rgba(124,58,237,.05)}.builder-form h3{margin:20px 0}.builder-actions-row{display:flex;align-items:center;gap:16px;margin-bottom:28px}.toggle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:25px}.toggle-grid label{border:1px solid var(--line);border-radius:12px;padding:14px;margin:0;color:#111;display:flex;align-items:center;gap:10px}.link-row{display:grid;grid-template-columns:160px 1fr 1.5fr;gap:18px;margin-bottom:16px}.preview-phone{background:linear-gradient(150deg,#8B5CF6,#241642);min-height:490px;border-radius:30px;color:#fff;text-align:center;padding:45px 26px;position:sticky;top:110px}.preview-avatar{width:92px;height:92px;border-radius:50%;background:rgba(255,255,255,.25);display:grid;place-items:center;margin:0 auto 25px;font-size:40px;font-weight:800}.preview-phone h2{font-size:28px;margin:0 0 8px}.preview-phone p{color:#ddd}.preview-links{display:flex;justify-content:center;gap:14px;margin-top:35px}.preview-links span{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.18)}.preview-qr{width:130px;height:130px;border-radius:20px;background:#fff;color:#111;display:grid;place-items:center;font-size:70px;margin:50px auto 0}.public-card-page{min-height:calc(100vh - 82px);display:grid;place-items:center;padding:70px 20px;background:#f7f2ff}.public-card{width:min(450px,100%);background:#fff;border-radius:28px;box-shadow:var(--shadow);padding:0 30px 32px;text-align:center;overflow:hidden}.public-card-cover{height:130px;background:linear-gradient(135deg,var(--card-color),#B995FF);margin:0 -30px}.public-card-avatar{width:112px;height:112px;border-radius:50%;border:6px solid #fff;margin:-56px auto 20px;font-size:44px}.public-card h1{margin:0;font-size:32px}.public-card .role{margin-top:8px;color:#555}.public-card .bio{font-size:14px}.public-actions,.public-links{display:grid;gap:12px;margin-top:24px}.public-actions{grid-template-columns:repeat(3,1fr)}.public-actions a,.public-links a{border:1.5px solid var(--line);border-radius:13px;padding:13px;font-weight:700}.public-links a{display:block}.public-qr{margin-top:25px;color:#777}.public-qr div{font-size:90px;color:#111;line-height:1}
.site-footer{background:#cfe7ff;padding:74px 0 26px}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:90px}.footer-logo img{height:56px}.site-footer p{line-height:1.45}.site-footer h3{margin:22px 0 25px}.site-footer a:not(.footer-logo){display:block;margin:0 0 25px;font-weight:600}.socials{display:flex;gap:18px;margin:45px 0 70px}.socials a{width:37px;height:37px;border-radius:50%;display:grid!important;place-items:center;background:var(--purple);color:#fff;margin:0!important}.copyright{font-size:17px}.address{font-weight:600;font-size:18px;color:#111}
@media (max-width:1050px){.feature-grid,.team-grid{grid-template-columns:repeat(2,1fr)}.hero-grid,.split-grid,.contact-card,.builder-grid{grid-template-columns:1fr}.contact-info{min-height:520px}.footer-grid{grid-template-columns:1fr 1fr}.card-list-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.container{width:min(100% - 32px,1200px)}.site-header{height:auto;padding:18px 0}.nav-toggle{display:block}.main-nav{display:none;position:absolute;left:16px;right:16px;top:75px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:20px;gap:18px;flex-direction:column;align-items:flex-start}.main-nav.open{display:flex}.nav-actions{gap:8px}.nav-actions .btn{padding:11px 14px}.hero-copy h1{font-size:40px}.section h1,.section h2{font-size:32px}.hero-grid{gap:30px}.partners{flex-wrap:wrap;font-size:16px}.feature-grid,.story-grid,.team-grid,.stats-grid,.steps-grid,.footer-grid,.card-list-grid,.form-row,.toggle-grid{grid-template-columns:1fr}.story-grid,.stats-grid{gap:25px}.team-card img{height:320px}.contact-form{padding:30px 18px}.contact-info{padding:35px 24px}.subject-group label{display:flex}.auth-card{padding:50px 25px}.auth-card h1{font-size:36px}.auth-card p{font-size:24px}.auth-card input:not([type=checkbox]),.auth-submit{height:62px}.link-row{grid-template-columns:1fr}.public-actions{grid-template-columns:1fr}.footer-grid{gap:30px}.socials{margin-bottom:35px}}

/* Figma image assets */
.figma-hero{overflow:visible;min-height:420px}
.hero-card-img{position:relative;z-index:3;width:min(284px,58vw);height:auto;filter:drop-shadow(0 30px 42px rgba(34,16,94,.22));transform:translateX(4px)}
.hero-float{position:absolute;z-index:4;width:auto;filter:drop-shadow(0 18px 24px rgba(0,0,0,.12))}
.hero-qr{width:91px;right:48px;top:118px}
.hero-whatsapp{width:75px;right:120px;top:206px}
.hero-share{width:89px;left:96px;bottom:72px}
.partner-logos img{display:block;height:30px;width:auto;object-fit:contain;max-width:170px}
.partner-logos{min-height:30px}
.figma-radar .bluetooth-center{position:relative;width:88px;height:88px;border-radius:24px;background:#fff;display:grid;place-items:center;z-index:2;box-shadow:var(--shadow)}
.figma-radar .bluetooth-center img{width:71px;height:68px;display:block}
.figma-radar .person-chip{grid-template-columns:46px 1fr auto;grid-template-rows:auto auto;padding:10px 16px;min-width:255px}
.figma-radar .person-chip img{grid-row:1/3;width:44px;height:44px;border-radius:50%;object-fit:cover}
.figma-radar .person-chip b{align-self:end;font-size:13px;line-height:1}
.figma-radar .person-chip small{align-self:start;font-size:11px;grid-row:1/3;align-self:center}
.figma-radar .person-chip em{grid-column:2/3;font-style:normal;font-size:9px;color:#777;line-height:1.1}
.analytics-graph-img{display:block;width:min(487px,100%);height:auto;margin:34px auto 0;border-radius:8px;box-shadow:0 24px 48px rgba(124,58,237,.10)}

@media (max-width:1050px){
    .figma-hero{min-height:400px}.hero-share{left:18%;bottom:60px}.hero-qr{right:18%;top:90px}.hero-whatsapp{right:25%;top:190px}
}
@media (max-width:760px){
    .figma-hero{min-height:360px}.hero-card-img{width:250px}.hero-qr{width:74px;right:7%;top:72px}.hero-whatsapp{width:62px;right:18%;top:168px}.hero-share{width:72px;left:6%;bottom:55px}
    .partner-logos{justify-content:center;gap:26px}.partner-logos img{height:24px;max-width:135px}
    .figma-radar .person-chip{min-width:220px}.chip-a{left:0}.chip-b{right:0}.chip-c{right:20px}
}






.color_input{
    padding: 2px 7px;
    border-bottom: 0;
    border-radius: 0px;
    background: #8080802e;
}


.builder-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) 420px;
    gap: 42px;
    align-items: start;
}

.builder-form {
    background: #fff;
    border-radius: 28px;
    padding: 34px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.08);
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.builder-form label {
    display: grid;
    gap: 9px;
    font-weight: 600;
    color: #111;
    margin-bottom: 18px;
}

.builder-form input,
.builder-form textarea,
.builder-form select {
    width: 100%;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 15px 16px;
    font: inherit;
    outline: none;
    background: #fff;
}

.builder-form textarea {
    min-height: 120px;
    resize: vertical;
}

.color_input {
    height: 52px;
    padding: 8px !important;
}

.toggle-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin: 18px 0 28px;
}

.toggle-grid label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    border: 1px solid #eee;
    padding: 14px;
    border-radius: 14px;
}

.link-row {
    display: grid;
    grid-template-columns: 150px 1fr 1.4fr 42px;
    gap: 12px;
    margin-bottom: 12px;
}

.link-remove {
    border: 0;
    background: #fee2e2;
    color: #991b1b;
    border-radius: 12px;
    font-size: 22px;
    cursor: pointer;
}

.builder-actions-row {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 22px;
}

.live-preview-card {
    position: sticky;
    top: 30px;
}

.preview-phone {
    --preview-primary: #7C3AED;
    min-height: 610px;
    border-radius: 34px;
    padding: 28px;
    color: #fff;
    background:
        radial-gradient(circle at 85% 12%, rgba(255,255,255,0.25), transparent 28%),
        linear-gradient(145deg, var(--preview-primary), #261064 72%);
    box-shadow: 0 30px 90px rgba(86, 42, 180, 0.35);
    overflow: hidden;
}

.preview-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 38px;
}

.preview-avatar {
    width: 74px;
    height: 74px;
    border-radius: 50%;
    background: #fff;
    color: var(--preview-primary);
    display: grid;
    place-items: center;
    font-size: 34px;
    font-weight: 800;
    border: 4px solid rgba(255,255,255,0.4);
}

.preview-qr-box {
    width: 112px;
    height: 112px;
    background: #fff;
    padding: 8px;
    border-radius: 16px;
    display: grid;
    place-items: center;
}

.preview-qr-box img,
.preview-qr-box canvas {
    width: 96px !important;
    height: 96px !important;
}

.preview-phone h2 {
    font-size: 34px;
    margin: 0 0 6px;
    color: #fff;
}

.preview-role {
    opacity: 0.85;
    margin-bottom: 20px;
}

.preview-bio {
    line-height: 1.7;
    opacity: 0.85;
    min-height: 70px;
}

.preview-links {
    display: flex;
    gap: 12px;
    margin: 24px 0;
}

.preview-links span {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: rgba(255,255,255,0.18);
}

.preview-url-label {
    margin-top: 30px;
    font-size: 13px;
    opacity: 0.7;
}

.preview-url {
    display: block;
    color: #fff;
    opacity: 0.9;
    word-break: break-all;
    margin-top: 8px;
    font-size: 13px;
}

.alert-success {
    background: #dcfce7;
    color: #166534;
    padding: 14px 16px;
    border-radius: 14px;
    margin-bottom: 20px;
}

.alert-error {
    background: #fee2e2;
    color: #991b1b;
    padding: 14px 16px;
    border-radius: 14px;
    margin-bottom: 20px;
}

.dashboard-card {
    display: grid;
    gap: 20px;
}

.dashboard-card small {
    display: block;
    margin-top: 6px;
    color: #666;
    word-break: break-all;
}

.dashboard-qr-wrap {
    display: grid;
    place-items: center;
    gap: 10px;
    background: #fafafa;
    border: 1px solid #eee;
    border-radius: 18px;
    padding: 20px;
}

.dashboard-qr {
    width: 128px;
    height: 128px;
    background: #fff;
    border-radius: 16px;
    padding: 8px;
    display: grid;
    place-items: center;
}

.dashboard-qr img,
.dashboard-qr canvas {
    width: 112px !important;
    height: 112px !important;
}

.dashboard-qr-wrap p {
    margin: 0;
    font-size: 13px;
    color: #666;
}

.dashboard-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.dashboard-actions form {
    margin: 0;
}

.btn-danger {
    background: #ef4444;
    color: #fff;
    border: 1px solid #ef4444;
}

.btn-danger:hover {
    background: #dc2626;
    border-color: #dc2626;
}

@media (max-width: 980px) {
    .builder-grid {
        grid-template-columns: 1fr;
    }

    .live-preview-card {
        position: static;
    }

    .form-row,
    .toggle-grid,
    .link-row {
        grid-template-columns: 1fr;
    }
}





/*************************************************************/
.socials {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 34px;
}

.socials a {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.socials a:hover {
    transform: translateY(-3px);
    opacity: 0.88;
}

.socials img {
    width: 38px;
    height: 38px;
    display: block;
    object-fit: contain;
}





/*************************************************************/

.auth-page-pro {
    min-height: calc(100vh - 90px);
    display: grid;
    place-items: center;
    padding: 70px 24px;
    background:
        radial-gradient(circle at 15% 12%, rgba(124, 58, 237, 0.12), transparent 28%),
        radial-gradient(circle at 88% 18%, rgba(96, 165, 250, 0.14), transparent 26%),
        #ffffff;
}

.auth-shell {
    width: 100%;
    max-width: 1120px;
    display: grid;
    grid-template-columns: 0.95fr 1fr;
    background: #fff;
    border: 1px solid rgba(124, 58, 237, 0.10);
    border-radius: 34px;
    overflow: hidden;
    box-shadow: 0 35px 110px rgba(15, 23, 42, 0.10);
}

.auth-visual {
    position: relative;
    min-height: 680px;
    padding: 42px;
    color: #fff;
    background:
        radial-gradient(circle at 82% 14%, rgba(255,255,255,0.28), transparent 22%),
        radial-gradient(circle at 20% 80%, rgba(255,255,255,0.18), transparent 24%),
        linear-gradient(145deg, #7c3aed, #2a1267 75%);
}

.auth-logo {
    display: inline-flex;
    align-items: center;
    background: rgba(255,255,255,0.96);
    border-radius: 18px;
    padding: 12px 16px;
    box-shadow: 0 14px 40px rgba(0,0,0,0.14);
}

.auth-logo img {
    width: 138px;
    height: auto;
    display: block;
}

.auth-preview-card {
    position: absolute;
    left: 42px;
    right: 42px;
    bottom: 42px;
    background: rgba(255,255,255,0.13);
    border: 1px solid rgba(255,255,255,0.20);
    border-radius: 30px;
    padding: 30px;
    backdrop-filter: blur(18px);
}

.auth-preview-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 36px;
}

.auth-preview-avatar {
    width: 72px;
    height: 72px;
    border-radius: 24px;
    display: grid;
    place-items: center;
    background: #fff;
    color: #7c3aed;
    font-size: 34px;
    font-weight: 900;
}

.auth-preview-qr {
    width: 82px;
    height: 82px;
    border-radius: 18px;
    background:
        linear-gradient(90deg, #111 12px, transparent 12px) 0 0 / 24px 24px,
        linear-gradient(#111 12px, transparent 12px) 0 0 / 24px 24px,
        #fff;
    border: 10px solid #fff;
}

.auth-preview-card h2 {
    color: #fff;
    font-size: 34px;
    margin: 0 0 12px;
}

.auth-preview-card p {
    color: rgba(255,255,255,0.82);
    line-height: 1.7;
    margin: 0;
}

.auth-preview-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}

.auth-preview-pills span {
    border-radius: 999px;
    background: rgba(255,255,255,0.16);
    border: 1px solid rgba(255,255,255,0.20);
    padding: 9px 13px;
    font-size: 13px;
    font-weight: 700;
}

.auth-card-pro {
    width: 100%;
    max-width: none;
    min-height: 680px;
    border-radius: 0;
    box-shadow: none;
    padding: 70px 70px 50px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.auth-head {
    margin-bottom: 34px;
}

.auth-eyebrow {
    color: #7c3aed;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.auth-card-pro h1 {
    font-size: 44px;
    line-height: 1.1;
    margin: 10px 0 10px;
    color: #050505;
}

.auth-card-pro p {
    color: #707070;
    font-size: 17px;
    line-height: 1.6;
    margin: 0;
}

.auth-field {
    display: grid;
    gap: 9px;
    margin-bottom: 18px;
    color: #111;
    font-weight: 700;
}

.auth-field span {
    font-size: 13px;
    color: #555;
}

.auth-card-pro input {
    width: 100%;
    height: 58px;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 0 18px;
    font: inherit;
    outline: none;
    background: #fff;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.auth-card-pro input:focus {
    border-color: #7c3aed;
    box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.10);
}

.auth-password-wrap {
    position: relative;
}

.auth-password-wrap input {
    padding-right: 78px;
}

.auth-password-wrap button {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    border: 0;
    background: #f3e8ff;
    color: #6d28d9;
    font-weight: 800;
    border-radius: 12px;
    padding: 9px 12px;
    cursor: pointer;
}

.terms-pro,
.remember-row {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #444;
    font-weight: 600;
}

.terms-pro {
    margin: 4px 0 24px;
}

.terms-pro input,
.remember-row input {
    width: 18px;
    height: 18px;
    accent-color: #7c3aed;
}

.auth-extra-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 4px 0 24px;
}

.forgot {
    color: #111;
    text-decoration: none;
    font-weight: 700;
}

.forgot:hover {
    color: #7c3aed;
}

.auth-submit {
    width: 100%;
    height: 62px;
    border-radius: 16px;
    font-size: 19px;
    font-weight: 800;
    box-shadow: 0 18px 40px rgba(124, 58, 237, 0.24);
}

.auth-switch {
    margin-top: 28px;
    text-align: center;
    color: #555;
    font-weight: 600;
}

.auth-switch a {
    color: #111;
    font-weight: 900;
    text-decoration: none;
}

.auth-switch a:hover {
    color: #7c3aed;
}

.auth-alert,
.auth-success {
    border-radius: 16px;
    padding: 14px 16px;
    margin-bottom: 22px;
    font-weight: 700;
}

.auth-alert {
    background: #fee2e2;
    color: #991b1b;
}

.auth-success {
    background: #dcfce7;
    color: #166534;
}

.auth-alert ul {
    margin: 8px 0 0;
    padding-left: 20px;
}

@media (max-width: 980px) {
    .auth-shell {
        grid-template-columns: 1fr;
    }

    .auth-visual {
        min-height: 420px;
    }

    .auth-preview-card {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        margin-top: 80px;
    }

    .auth-card-pro {
        min-height: auto;
        padding: 48px 34px;
    }
}

@media (max-width: 560px) {
    .auth-page-pro {
        padding: 36px 16px;
    }

    .auth-visual {
        display: none;
    }

    .auth-shell {
        border-radius: 26px;
    }

    .auth-card-pro {
        padding: 38px 24px;
    }

    .auth-card-pro h1 {
        font-size: 36px;
    }

    .auth-extra-row {
        align-items: flex-start;
        flex-direction: column;
    }
}