*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;background:#f5f7fb;color:#0b1533}button,input,select{font:inherit}.hidden{display:none!important}.primary{background:linear-gradient(135deg,#2563eb,#4f46e5);color:white;border:0;border-radius:14px;padding:13px 18px;font-weight:850;cursor:pointer;text-decoration:none;display:inline-block;text-align:center;box-shadow:0 12px 30px rgba(37,99,235,.25)}.primary:hover{transform:translateY(-1px);box-shadow:0 16px 38px rgba(37,99,235,.32)}.primary.big,.ghost.big{padding:16px 22px;border-radius:16px;font-size:16px}.ghost{background:white;color:#17213a;border:1px solid #dbe3ef;border-radius:14px;padding:13px 18px;cursor:pointer}.ghost.dark{background:rgba(255,255,255,.08);color:white;border-color:rgba(255,255,255,.22)}.danger{background:#ef4444;color:white;border:0;border-radius:12px;padding:13px 16px;font-weight:800;cursor:pointer}.hint{font-size:13px;color:#64748b}.brand-mark{width:48px;height:48px;border-radius:16px;background:linear-gradient(135deg,#78dbff,#7c3aed);display:grid;place-items:center;color:#06112d;font-weight:950;font-size:22px}.marketing-screen{min-height:100vh;background:radial-gradient(circle at 10% 10%,rgba(96,165,250,.25),transparent 28%),radial-gradient(circle at 82% 20%,rgba(124,58,237,.22),transparent 30%),linear-gradient(135deg,#07111f,#101b35 45%,#172554);color:white;overflow:hidden}.marketing-nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 48px;max-width:1280px;margin:auto}.logo-row{display:flex;align-items:center;gap:12px;font-size:20px}.marketing-links{display:flex;align-items:center;gap:16px}.marketing-links a{color:#dbeafe;text-decoration:none;font-weight:700}.hero{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;max-width:1280px;margin:auto;padding:70px 48px 90px}.eyebrow,.section-heading span{display:inline-flex;padding:8px 12px;border:1px solid rgba(255,255,255,.22);border-radius:999px;color:#bfdbfe;background:rgba(255,255,255,.06);font-weight:800;font-size:13px}.hero h1{font-size:68px;line-height:.95;letter-spacing:-3px;margin:22px 0}.hero-lead{font-size:20px;line-height:1.65;color:#cbd5e1;max-width:690px}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:30px 0}.trust-row{display:flex;gap:10px;flex-wrap:wrap;color:#dbeafe}.trust-row span{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);padding:9px 12px;border-radius:999px}.hero-product{position:relative}.product-window{background:rgba(255,255,255,.11);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.18);border-radius:34px;padding:18px;box-shadow:0 30px 90px rgba(0,0,0,.35)}.window-top{display:flex;align-items:center;gap:8px;margin-bottom:16px}.window-top span{width:12px;height:12px;border-radius:50%;background:#93c5fd}.window-top span:nth-child(2){background:#c4b5fd}.window-top span:nth-child(3){background:#34d399}.window-top b{margin-left:auto;color:#e0e7ff}.fake-toolbar{display:flex;justify-content:space-between;gap:10px;background:white;color:#334155;border-radius:18px;padding:14px;margin-bottom:14px}.fake-toolbar button{border:0;background:#2563eb;color:white;border-radius:12px;padding:10px 14px;font-weight:800}.fake-folders{display:grid;grid-template-columns:1fr 1fr;gap:14px}.fake-folders article{background:white;color:#0f172a;border-radius:22px;padding:14px}.fake-grid-img{height:150px;border-radius:16px;background:linear-gradient(135deg,#bfdbfe,#7c3aed)}.fake-grid-img.second{background:linear-gradient(135deg,#fef3c7,#f97316)}.fake-folders h3{margin:12px 0 4px}.fake-folders p{color:#64748b;margin:0}.share-preview{margin-top:14px;background:#ecfeff;color:#0f172a;border-radius:20px;padding:16px;display:flex;justify-content:space-between;gap:10px}.share-preview span{color:#2563eb}.feature-section,.pricing-section{max-width:1280px;margin:auto;padding:76px 48px}.section-heading{text-align:center;margin-bottom:34px}.section-heading h2{font-size:44px;letter-spacing:-1.5px;margin:16px 0 0}.feature-cards,.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.feature-cards article,.price-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:28px;padding:28px;box-shadow:0 20px 60px rgba(0,0,0,.16)}.feature-cards .icon{font-size:30px;width:58px;height:58px;border-radius:18px;background:rgba(255,255,255,.13);display:grid;place-items:center}.feature-cards p,.price-card p{color:#cbd5e1;line-height:1.6}.price-card strong{display:block;font-size:42px;margin:18px 0}.price-card strong span{font-size:16px;color:#cbd5e1}.price-card ul{line-height:2;color:#dbeafe}.price-card.featured{background:linear-gradient(180deg,rgba(37,99,235,.42),rgba(255,255,255,.08));position:relative;transform:translateY(-10px)}.badge{position:absolute;right:22px;top:22px;background:#fef3c7;color:#92400e;border-radius:999px;padding:7px 11px;font-weight:900;font-size:12px}.pricing-cta{text-align:center;margin-top:28px}.auth-screen{min-height:100vh;display:grid;grid-template-columns:minmax(320px,520px) 1fr;gap:34px;align-items:center;padding:48px;background:radial-gradient(circle at top left,#dbeafe,transparent 34%),linear-gradient(135deg,#f8fbff,#eef4ff)}.auth-card{background:white;border:1px solid #e5e7eb;border-radius:28px;padding:30px;box-shadow:0 18px 55px rgba(15,23,42,.1)}.back-link{border:0;background:transparent;color:#2563eb;font-weight:800;cursor:pointer;margin-bottom:18px}.auth-brand{display:flex;gap:14px;align-items:center;margin-bottom:24px}.auth-brand h1{margin:0;font-size:32px}.auth-brand p{margin:6px 0 0;color:#64748b}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;background:#f1f5f9;border-radius:14px;padding:4px;margin-bottom:18px}.auth-tabs button{border:0;background:transparent;padding:12px;border-radius:12px;font-weight:800;cursor:pointer;color:#475569}.auth-tabs button.active{background:white;color:#14213d;box-shadow:0 6px 20px rgba(15,23,42,.06)}.auth-form{display:grid;gap:14px}.auth-form label,.form-grid label,.edit-fields label{font-size:13px;color:#4b5563;font-weight:800}.auth-form input,.form-grid input,.form-grid select,select,input,.edit-fields input,.edit-fields select{width:100%;padding:12px 13px;border:1px solid #d9dee8;border-radius:12px;background:white;font-size:15px;margin-top:7px}.auth-side{max-width:560px}.auth-side h2{font-size:44px;line-height:1.05;margin:0 0 18px}.auth-side ol{line-height:2;font-size:20px;color:#334155}.app{display:flex;min-height:100vh}.sidebar{width:280px;background:#101827;color:white;padding:24px;display:flex;flex-direction:column;gap:14px;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:12px;margin-bottom:20px}.brand span{display:block;color:#9ca3af;font-size:13px}.nav{background:transparent;border:0;color:#d1d5db;text-align:left;padding:13px 14px;border-radius:12px;cursor:pointer;font-size:15px}.nav:hover,.nav.active{background:#263244;color:white}.storage-card{margin-top:auto;background:#1f2937;border:1px solid #374151;border-radius:18px;padding:16px;color:#d1d5db}.small{font-size:12px;color:#9ca3af}.storage-line{font-weight:800;margin-top:6px}.bar{height:8px;background:#374151;border-radius:20px;overflow:hidden;margin:12px 0}.bar span{display:block;height:100%;width:0%;background:#54a0ff;border-radius:20px}.logout{background:#263244;border:1px solid #3b475a;color:white;border-radius:12px;padding:12px;cursor:pointer}main{flex:1;padding:32px}.topbar{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:24px}.topbar h1{margin:0;font-size:34px}.topbar p{margin:8px 0 0;color:#5b667a}.user-pill{background:white;border:1px solid #e5e7eb;border-radius:16px;padding:12px 14px;min-width:230px}.user-pill span{display:block;color:#64748b;font-size:13px;margin-top:4px}.onboarding-card{background:linear-gradient(135deg,#eff6ff,#eef2ff);border:1px solid #bfdbfe;border-radius:26px;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.onboarding-card span{font-weight:900;color:#2563eb;font-size:13px;text-transform:uppercase}.onboarding-card h2{margin:6px 0}.onboarding-card p{color:#526072}.view{display:none}.view.active{display:block}.toolbar{display:grid;grid-template-columns:1fr 220px auto;gap:12px;margin-bottom:16px}.quick-tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}.tag-chip{border:1px solid #d9dee8;background:white;padding:8px 12px;border-radius:999px;cursor:pointer;color:#374151}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}.small-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.card,.folder-card{background:white;border:1px solid #e5e7eb;border-radius:22px;overflow:hidden;box-shadow:0 8px 30px rgba(15,23,42,.05);cursor:pointer;transition:.15s}.card:hover,.folder-card:hover{transform:translateY(-3px);box-shadow:0 12px 35px rgba(15,23,42,.1)}.thumb{height:180px;background:#e5e7eb;display:block;width:100%;object-fit:cover}.card-body,.folder-body{padding:14px}.card h3,.folder-body h3{font-size:16px;margin:0 0 7px}.meta,.folder-body p{font-size:13px;color:#6b7280;margin-bottom:10px}.tags{display:flex;gap:6px;flex-wrap:wrap}.tag{font-size:12px;background:#edf2ff;color:#1d4ed8;border-radius:999px;padding:5px 8px}.empty{background:white;border:1px dashed #cbd5e1;border-radius:22px;padding:50px;text-align:center;margin-top:10px}.panel{background:white;border:1px solid #e5e7eb;border-radius:24px;padding:24px;margin-bottom:20px;box-shadow:0 8px 30px rgba(15,23,42,.04)}.panel h2{margin-top:0}.panel p{color:#5b667a}.hero-share-panel{background:linear-gradient(135deg,#ffffff,#eff6ff)}.upload-box{position:relative;border:2px dashed #b9c4d6;border-radius:22px;padding:32px;background:#f8fbff;text-align:center;margin:20px 0}.upload-box.drag{border-color:#2563eb;background:#eff6ff}.upload-box input{position:absolute;inset:0;opacity:0;cursor:pointer}.upload-box strong{display:block;font-size:20px}.upload-box span{display:block;color:#6b7280;margin-top:6px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:18px 0}.share-result{margin-top:18px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:16px;padding:16px}.modal{position:fixed;inset:0;background:rgba(15,23,42,.72);display:grid;place-items:center;padding:24px;z-index:10}.modal-card{background:white;border-radius:24px;max-width:980px;width:100%;overflow:hidden;display:grid;grid-template-columns:1.1fr .9fr;position:relative}.modal-card img{width:100%;height:560px;object-fit:cover;background:#e5e7eb}.modal-content{padding:24px;overflow:auto;max-height:90vh}.modal-content .link-button{margin:12px 0;display:block}.close{position:absolute;right:14px;top:12px;border:0;background:#111827;color:white;border-radius:50%;width:34px;height:34px;font-size:22px;cursor:pointer}.folder-header{display:flex;align-items:center;gap:16px;margin:12px 0 18px}.folder-header h2{margin:0;font-size:24px}.folder-header p{margin:4px 0 0;color:#6b7280}.folder-preview{height:170px;background:#e5e7eb;display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px}.folder-preview img{width:100%;height:100%;object-fit:cover;background:#dbe3ef}.folder-preview .placeholder{display:grid;place-items:center;background:linear-gradient(135deg,#edf2ff,#f8fafc);color:#64748b;font-weight:900;font-size:28px}.account-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.account-grid div{background:#f8fafc;border:1px solid #e5e7eb;border-radius:16px;padding:16px}.account-grid span{display:block;color:#64748b;font-size:13px;margin-bottom:8px}.account-grid strong{word-break:break-word}.manage-list{display:grid;gap:10px}.manage-row,.manage-image-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;background:#f8fafc;border:1px solid #e5e7eb;border-radius:16px;padding:14px}.manage-row-actions{display:flex;gap:8px;flex-wrap:wrap}.manage-row input{max-width:260px}.manage-image-list{display:grid;gap:10px;margin-top:18px}.manage-image-row{grid-template-columns:auto 70px 1fr auto}.manage-image-row img{width:70px;height:58px;object-fit:cover;border-radius:10px}.bulk-box{background:#f8fafc;border:1px solid #e5e7eb;border-radius:18px;padding:16px}.edit-fields{display:grid;gap:10px;margin:14px 0;padding:14px;background:#f8fafc;border:1px solid #e5e7eb;border-radius:16px}.share-page{min-height:100vh;background:radial-gradient(circle at top left,#dbeafe,transparent 35%),linear-gradient(135deg,#f8fbff,#eef4ff);padding:32px}.share-shell{max-width:1180px;margin:auto}.share-hero{background:linear-gradient(135deg,#0f172a,#1e3a8a);color:white;border-radius:34px;padding:38px;margin-bottom:24px;box-shadow:0 24px 70px rgba(15,23,42,.18)}.share-hero span{color:#bfdbfe;font-weight:800}.share-hero h1{font-size:46px;margin:10px 0}.share-hero p{color:#dbeafe;font-size:18px}.share-toolbar{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:18px}.share-toolbar .rights{background:white;border:1px solid #dbe3ef;border-radius:16px;padding:14px;color:#334155}.download-all{background:#0f172a;color:white;border:0;border-radius:14px;padding:13px 16px;font-weight:850}@media(max-width:900px){.marketing-nav{padding:18px 20px}.marketing-links a{display:none}.hero,.feature-cards,.pricing-grid,.auth-screen{grid-template-columns:1fr}.hero{padding:36px 20px}.hero h1{font-size:44px}.feature-section,.pricing-section{padding:50px 20px}.fake-folders{grid-template-columns:1fr}.share-preview{display:block}.app{display:block}.sidebar{width:auto;height:auto;position:relative}.topbar,.toolbar,.onboarding-card{display:block}.toolbar>*{margin-bottom:10px}.form-grid,.modal-card,.account-grid{grid-template-columns:1fr}.modal-card img{height:300px}main{padding:20px}.grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.folder-header{display:block}.folder-header button{margin-bottom:12px}.manage-image-row,.manage-row{grid-template-columns:1fr}.manage-image-row img{width:100%;height:160px}.share-hero h1{font-size:34px}.share-toolbar{display:block}.share-toolbar>*{margin-bottom:10px}}
/* Mediakansio branding */
.site-logo{
display:block;
max-width:100%;
height:auto;
}
.hero-logo{
width: 320px;
}
.auth-logo{
width: 220px;
border-radius: 18px;
box-shadow: 0 16px 40px rgba(37,99,235,.14);
}
.sidebar-logo{
width: 56px;
min-width: 56px;
border-radius: 14px;
box-shadow: 0 10px 24px rgba(37,99,235,.14);
}
.share-logo{
width: 220px;
margin-bottom: 14px;
border-radius: 18px;
box-shadow: 0 16px 40px rgba(37,99,235,.12);
}
.logo-row{
display:flex;
align-items:center;
}
.auth-brand{
gap:18px;
}
.brand{
align-items:center;
gap:14px;
}
.share-hero{
display:flex;
flex-direction:column;
align-items:flex-start;
}
@media (max-width: 780px){
.hero-logo{ width: 240px; }
.auth-logo{ width: 180px; }
.share-logo{ width: 180px; }
}
/* Stripe Billing */
.subscription-banner{
display:flex;
justify-content:space-between;
align-items:center;
gap:18px;
background:linear-gradient(135deg,#fff7ed,#fffbeb);
border:1px solid #fed7aa;
border-radius:22px;
padding:18px 20px;
margin-bottom:22px;
box-shadow:0 8px 30px rgba(245,158,11,.10);
}
.subscription-banner p{margin:6px 0 0;color:#7c2d12;}
.billing-status-panel{background:linear-gradient(135deg,#ffffff,#f8fbff);}
.billing-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;}
.billing-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:18px;}
.billing-plan{border:1px solid #e5e7eb;border-radius:22px;padding:20px;background:#fff;box-shadow:0 8px 30px rgba(15,23,42,.05);}
.billing-plan.current{border-color:#14b8a6;box-shadow:0 14px 36px rgba(20,184,166,.14);}
.billing-plan h3{font-size:24px;margin:12px 0 8px;}
.billing-plan strong{font-size:28px;display:block;margin-bottom:12px;}
.billing-plan ul{padding-left:20px;color:#475569;line-height:1.8;}
.billing-plan .badge.muted{background:#e2e8f0;color:#334155;}
.billing-plan button{width:100%;margin-top:10px;}
@media(max-width:900px){.billing-plans{grid-template-columns:1fr}.subscription-banner{display:block}.subscription-banner button{margin-top:12px;width:100%;}}
.contact-panel a,
.site-footer a {
color: inherit;
font-weight: 700;
text-decoration: underline;
text-underline-offset: 3px;
}
.site-footer {
margin: 24px 0 0;
padding: 18px 28px;
display: flex;
gap: 16px;
justify-content: center;
flex-wrap: wrap;
color: rgba(255,255,255,.78);
font-size: 14px;
}
.security-section {
padding-top: 72px;
}
.trust-cards, .admin-stats {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
gap: 16px;
}
.trust-cards article, .admin-stats article {
background: rgba(255,255,255,.08);
border: 1px solid rgba(255,255,255,.12);
border-radius: 18px;
padding: 20px;
box-shadow: 0 18px 40px rgba(15,23,42,.16);
}
.trust-cards strong, .admin-stats strong {
display: block;
font-size: 24px;
margin-bottom: 6px;
}
.admin-stats {
margin-bottom: 18px;
}
.admin-stats article {
background: var(--panel, #fff);
}
.admin-stats span {
color: var(--muted, #64748b);
font-size: 13px;
}
.vat-note{margin:-10px 0 12px!important;color:#cbd5e1!important;font-size:13px;font-weight:800}.legal-page{max-width:920px;margin:40px auto;padding:24px}.legal-card{background:#fff;border:1px solid #e5e7eb;border-radius:24px;padding:32px;box-shadow:0 8px 30px rgba(15,23,42,.05)}.legal-card h1{margin-top:0}.legal-card h2{margin-top:28px}.legal-card p,.legal-card li{line-height:1.65;color:#334155}.legal-card a{color:#2563eb;font-weight:800}
.seo-guide-section .text-link{display:inline-block;margin-top:10px;color:#bfdbfe;font-weight:900;text-decoration:none}.seo-guide-section .text-link:hover{text-decoration:underline}.site-footer{gap:14px;flex-wrap:wrap}