@import url("file-dna.css");

.workflow-section {
    display: grid;
    grid-template-columns: .78fr 1.22fr;
    gap: 5vw;
    background: #0e1214;
}

.workflow-copy {
    align-self: center;
}

.workflow-shot {
    margin: 0;
    padding: 10px;
    background: #080a0b;
    border: 1px solid #30383b;
    border-radius: 14px;
    box-shadow: 0 32px 80px #0008;
}

.workflow-shot img,
.library-section img {
    width: 100%;
    display: block;
    border-radius: 7px;
}

.workflow-shot figcaption {
    padding: 9px 4px 0;
    color: #758085;
    font-size: 11px;
}

.preset-list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 26px;
}

.preset-list span {
    padding: 7px 10px;
    border: 1px solid #2d3b40;
    border-radius: 5px;
    background: #151b1e;
    color: #aab5b9;
    font-size: 11px;
}

.node-strip {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 8px;
    overflow: auto;
    padding: 20px;
    background: linear-gradient(90deg, #151b1e, #101416);
    border: 1px solid #2a3337;
    border-radius: 8px;
}

.node-strip span {
    white-space: nowrap;
    padding: 9px 12px;
    border: 1px solid #246a74;
    border-radius: 5px;
    background: #182326;
    color: var(--cyan);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
}

.node-strip i {
    min-width: 30px;
    height: 1px;
    background: #526064;
}

.library-section {
    display: grid;
    grid-template-columns: 1.35fr .75fr;
    gap: 6vw;
    align-items: center;
}

.library-section figure {
    margin: 0;
    padding: 10px;
    background: #080a0b;
    border: 1px solid #30383b;
    border-radius: 14px;
}

.library-section ul {
    padding-left: 18px;
    color: #b4bdc1;
}

@media (max-width: 1050px) {
    .workflow-section,
    .library-section {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .workflow-section,
    .library-section {
        padding-left: 20px;
        padding-right: 20px;
    }

    .node-strip {
        padding: 12px;
    }
}

/* RealDepth unified website shell for the File DNA product page. */
.file-dna-page{
    --bg:#05070b;
    --panel:#0d121a;
    --panel2:#111823;
    --line:rgba(255,255,255,.11);
    --text:#f6f8fb;
    --muted:#9ca8b7;
    --blue:#4fc3ff;
    --cyan:#39e4d3;
    --green:#55e58b;
    background:
        radial-gradient(circle at 74% 8%,rgba(157,108,255,.14),transparent 30%),
        radial-gradient(circle at 14% 64%,rgba(57,228,211,.08),transparent 38%),
        #05070b;
}
.file-dna-page .site-header{
    background:rgba(5,7,11,.9);
    border-bottom-color:rgba(255,255,255,.11);
    backdrop-filter:blur(22px) saturate(140%);
}
.file-dna-page .hero{
    min-height:820px;
    padding-top:156px;
    background:
        radial-gradient(circle at 78% 28%,rgba(57,228,211,.1),transparent 30%),
        radial-gradient(circle at 35% 8%,rgba(157,108,255,.11),transparent 34%),
        linear-gradient(180deg,rgba(5,7,11,.1),#05070b 96%);
}
.file-dna-page .hero h1,
.file-dna-page .section h2,
.file-dna-page .health-section h2,
.file-dna-page .documentation h2,
.file-dna-page .cta h2{
    font-family:"Manrope",Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    letter-spacing:-.055em;
}
.file-dna-page .button{
    border-radius:999px;
}
.file-dna-page .button.primary{
    background:linear-gradient(135deg,#7451ee,#9d68ff);
    border-color:transparent;
    box-shadow:0 14px 36px rgba(122,76,238,.3);
}
.file-dna-page .hero-shot,
.file-dna-page .module-grid article,
.file-dna-page .preview-widget,
.file-dna-page .health-widget,
.file-dna-page .doc-card,
.file-dna-page .recovery figure,
.file-dna-page .security figure,
.file-dna-page .library-section figure{
    border-color:rgba(255,255,255,.11);
    background:linear-gradient(145deg,rgba(16,23,34,.9),rgba(7,11,17,.94));
    box-shadow:0 28px 90px rgba(0,0,0,.28);
}
.file-dna-page .metrics article{
    background:rgba(12,18,27,.74);
    border-color:rgba(255,255,255,.09);
}
.file-dna-page .section,
.file-dna-page .health-section,
.file-dna-page .documentation{
    border-top-color:rgba(255,255,255,.09);
}
.file-dna-page .cta{
    background:
        radial-gradient(circle at 50% 100%,rgba(57,228,211,.12),transparent 45%),
        #05070b;
}
.file-dna-page footer{
    background:#05070b;
    border-top-color:rgba(255,255,255,.11);
}
@media(max-width:1050px){
    .file-dna-page .site-nav{
        display:none;
    }
    .file-dna-page.menu-open .site-nav{
        display:flex;
    }
}
@media(max-width:650px){
    .file-dna-page .hero{
        padding-top:120px;
    }
}