/* yongzoon.xyz - Grainy geological archive */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
:root{
    --bg-deep:#0D0D12;--card-surface:#12121C;
    --aurora-teal:#5EC4A8;--aurora-violet:#7B68AE;--aurora-rose:#C4587A;--aurora-gold:#D4A853;
    --text-primary:#C8C3B8;--text-secondary:#8A8578;--grain-base:#1A1A24;
    --border-glow:rgba(110,200,180,0.15);--aurora-intensity:0.15;
}
body{font-family:'EB Garamond',serif;font-weight:400;font-size:clamp(0.95rem,1.1vw,1.15rem);line-height:1.72;color:var(--text-primary);background:var(--bg-deep);overflow-x:hidden;}

/* Grain overlay */
.grain{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:9999;mix-blend-mode:overlay;}

/* Sidebar */
.sidebar{position:fixed;left:0;top:50%;transform:translateY(-50%);width:48px;display:flex;flex-direction:column;align-items:center;gap:24px;z-index:100;padding:16px 0;}
.sidebar-line{position:absolute;top:0;bottom:0;left:50%;width:1px;background:rgba(255,255,255,0.08);z-index:-1;}
.sidebar-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;transition:transform 300ms ease-out;position:relative;}
.sidebar-icon svg{width:32px;height:32px;}
.sidebar-icon:hover{transform:translateY(-4px);}
.sidebar-icon:hover svg polygon,.sidebar-icon:hover svg rect,.sidebar-icon:hover svg line{stroke-opacity:1;}

/* Icon-specific hovers */
.sidebar-icon:hover .icon-archive{transform:rotate(15deg);transition:transform 300ms ease-out;}
.sidebar-icon:hover .icon-structure{transform:scale(1.15);transition:transform 300ms cubic-bezier(0.68,-0.55,0.265,1.55);}
.sidebar-icon:hover .icon-connections::after{content:'';position:absolute;width:32px;height:32px;border:1px solid var(--aurora-teal);border-radius:50%;animation:ripple 600ms ease-out forwards;}
@keyframes ripple{from{transform:scale(1);opacity:0.6;}to{transform:scale(2);opacity:0;}}

/* Masonry layout */
.masonry-wrap{max-width:1000px;margin:0 auto;padding:clamp(40px,8vw,80px) clamp(20px,4vw,40px) 10vh;padding-left:clamp(60px,8vw,80px);column-count:2;column-gap:1.5rem;}

/* Cards */
.card{break-inside:avoid;margin-bottom:1.5rem;padding:clamp(20px,3vw,36px);border:1px solid var(--border-glow);background:rgba(18,18,28,0.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:4px;position:relative;overflow:hidden;opacity:0;transform:translateY(20px);transition:opacity 600ms ease,transform 600ms ease,box-shadow 350ms cubic-bezier(0.25,0.46,0.45,0.94),border-color 350ms ease;}
.card.visible{opacity:1;transform:translateY(0);}

/* Aurora edge accent */
.aurora-edge{position:absolute;top:0;left:0;width:3px;height:100%;background:linear-gradient(180deg,var(--aurora-teal),var(--aurora-violet),var(--aurora-rose),var(--aurora-gold));opacity:var(--aurora-intensity);transition:opacity 350ms ease,width 350ms ease;}

/* Hover-lift */
@media(hover:hover){
    .card:hover{transform:translateY(-6px);box-shadow:0 12px 40px rgba(94,196,168,0.08);border-color:rgba(110,200,180,0.35);}
    .card:hover .aurora-edge{opacity:0.8;width:4px;}
    .card:hover .specimen-tag{color:var(--aurora-teal);}
}

/* Specimen tag */
.specimen-tag{position:absolute;top:12px;right:12px;font-family:'DM Mono',monospace;font-weight:400;font-size:0.8rem;letter-spacing:0.08em;color:var(--text-secondary);transition:color 350ms ease;}

/* Title card */
.card-title{padding:clamp(32px,5vw,56px) clamp(20px,3vw,36px);column-span:all;}
.site-title{font-family:'Cormorant Garamond',serif;font-weight:700;font-size:clamp(2.2rem,5.5vw,4.5rem);letter-spacing:0.04em;line-height:1.15;background:linear-gradient(135deg,#5EC4A8 0%,#7B68AE 40%,#C4587A 70%,#D4A853 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.tld{opacity:0.7;}
.subtitle{font-family:'DM Mono',monospace;font-weight:400;font-size:0.8rem;letter-spacing:0.08em;color:rgba(110,200,180,0.6);margin-top:0.75rem;}

/* Section headings */
.section-heading{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:clamp(1.4rem,3vw,2.2rem);letter-spacing:0.04em;line-height:1.15;text-transform:uppercase;color:var(--text-primary);margin-bottom:1rem;}

/* Text cards */
.card-text p{color:var(--text-primary);margin-bottom:0.75rem;}
.card-text p:last-child{margin-bottom:0;}
.card-text p.secondary{color:var(--text-secondary);font-size:0.95em;}
.card-tall{min-height:320px;}

/* Quote card */
.card-quote blockquote{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:600;font-size:clamp(1.1rem,2vw,1.5rem);color:var(--aurora-gold);line-height:1.55;padding:0.5rem 0;border-top:1px solid rgba(212,168,83,0.15);border-bottom:1px solid rgba(212,168,83,0.15);}

/* Crystal cards */
.card-crystal{display:flex;align-items:center;justify-content:center;padding:clamp(16px,2vw,24px);border-color:transparent;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;}
.crystal-formation{max-width:100%;height:auto;}

/* Crystal pulse animation for deep specimens */
.crystal-pulse polygon{animation:auraPulse 8s ease-in-out infinite;}
@keyframes auraPulse{0%,100%{fill-opacity:0.15;}50%{fill-opacity:0.35;}}

/* Breathing gaps */
.card-breath{display:flex;align-items:center;justify-content:center;padding:1rem;border-color:transparent;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;}
.card-breath svg{width:100%;max-width:200px;}

/* Vein traces */
.card-vein{display:flex;align-items:center;justify-content:center;padding:0.5rem;border-color:transparent;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;}
.vein-trace{width:100%;max-width:300px;height:auto;}

/* Depth-based aurora intensity */
.card[data-depth="shallow"]{--aurora-intensity:0.08;}
.card[data-depth="shallow"] .aurora-edge{opacity:0.08;}
.card[data-depth="mid"]{--aurora-intensity:0.25;border-color:rgba(110,200,180,0.2);}
.card[data-depth="mid"] .aurora-edge{opacity:0.25;width:4px;}
.card[data-depth="deep"]{--aurora-intensity:0.5;border-color:rgba(110,200,180,0.3);}
.card[data-depth="deep"] .aurora-edge{opacity:0.5;width:6px;}

/* Footer */
.site-footer{text-align:center;padding:clamp(40px,8vw,80px);padding-left:48px;}
.site-footer p{font-family:'DM Mono',monospace;font-weight:400;font-size:0.8rem;letter-spacing:0.08em;color:var(--text-secondary);}

/* Tablet */
@media(max-width:900px){
    .masonry-wrap{column-count:1;padding-left:clamp(60px,8vw,80px);}
    .card-title{column-span:none;}
}

/* Mobile */
@media(max-width:600px){
    .sidebar{display:none;}
    .masonry-wrap{padding-left:clamp(20px,4vw,40px);column-count:1;}
    .card{margin-bottom:2rem;}
}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){
    .card{transition:none;}
    .crystal-pulse polygon{animation:none;}
    @media(hover:hover){.card:hover{transform:translateY(-3px);}}
}