/*
Theme Name: Crystal Cave
Theme URI: https://example.com/moban48
Author: Geode Lab
Description: A subterranean amethyst-cavern WordPress theme with faceted gem shapes, prismatic refractions, and a violet-and-lilac glow.
Version: 1.0
License: GPL-2.0-or-later
Text Domain: crystalcave
*/

:root{
    --cc-cave:#1e1b4b;
    --cc-cave-deep:#0f0d33;
    --cc-amethyst:#7c3aed;
    --cc-amethyst-deep:#5b21b6;
    --cc-lilac:#c4b5fd;
    --cc-light:#ede9fe;
    --cc-ink:#1c1740;
    --cc-fog:#a5a0d8;
    --cc-display:'Spectral',serif;
    --cc-body:'Inter',system-ui,-apple-system,sans-serif;
    --cc-prism:linear-gradient(135deg,#7c3aed 0%, #c4b5fd 35%, #f0abfc 65%, #7c3aed 100%);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
    font-family:var(--cc-body);color:#2c2456;background:var(--cc-light);line-height:1.65;
    -webkit-font-smoothing:antialiased;
    background-image:
        radial-gradient(900px 500px at 110% -10%, rgba(124,58,237,.20), transparent 60%),
        radial-gradient(800px 600px at -10% 80%, rgba(196,181,253,.30), transparent 60%);
    background-attachment:fixed;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--cc-amethyst);text-decoration:none}
a:hover{color:var(--cc-amethyst-deep)}

.cc-container{max-width:1240px;margin:0 auto;padding:0 24px}

/* Top crystal lattice */
.cc-lattice{
    height:6px;background:var(--cc-prism);background-size:200% 100%;
    animation:cc-shift 9s linear infinite;
}
@keyframes cc-shift{from{background-position:0 0}to{background-position:200% 0}}

/* Header */
.cc-header{
    position:sticky;top:0;z-index:50;
    background:rgba(237,233,254,.78);backdrop-filter:saturate(160%) blur(12px);
    border-bottom:1px solid rgba(124,58,237,.18);
}
.cc-header-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 0;gap:24px}
.cc-logo{
    display:inline-flex;align-items:center;gap:12px;
    font-family:var(--cc-display);color:var(--cc-cave);font-size:30px;font-weight:600;letter-spacing:.01em;
}
.cc-logo-gem{
    width:32px;height:32px;display:inline-block;
    background:var(--cc-prism);
    clip-path:polygon(50% 0,100% 35%,82% 100%,18% 100%,0 35%);
    filter:drop-shadow(0 6px 14px rgba(124,58,237,.4));
}
.cc-logo i{color:var(--cc-amethyst);font-style:italic;font-weight:500}
.cc-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cc-nav a{
    color:var(--cc-cave);font-weight:500;font-size:14px;letter-spacing:.02em;
    padding:10px 14px;border-radius:999px;position:relative;
}
.cc-nav a:not(.cc-cta):hover{background:rgba(124,58,237,.12);color:var(--cc-amethyst-deep)}
.cc-cta{
    background:var(--cc-cave);color:#ede9fe !important;padding:11px 22px !important;font-weight:600;
    box-shadow:0 0 0 2px rgba(196,181,253,.5);
    background-image:linear-gradient(135deg,#1e1b4b 0%,#5b21b6 100%);
}
.cc-cta:hover{background:var(--cc-amethyst);color:#fff !important}

/* Hero */
.cc-hero{position:relative;padding:100px 0 80px;overflow:hidden;color:#fff}
.cc-hero-bg{
    position:absolute;inset:0;z-index:0;
    background:
        radial-gradient(circle at 20% 30%, rgba(196,181,253,.55), transparent 35%),
        radial-gradient(circle at 80% 70%, rgba(124,58,237,.65), transparent 40%),
        linear-gradient(160deg,#1e1b4b 0%, #2e1065 60%, #4c1d95 100%);
}
.cc-hero-bg:before{
    /* faceted polygons */
    content:"";position:absolute;inset:0;
    background:
        linear-gradient(135deg,transparent 49.5%, rgba(255,255,255,.06) 50%, transparent 50.5%) 0 0/180px 180px,
        linear-gradient(45deg,transparent 49.5%, rgba(255,255,255,.06) 50%, transparent 50.5%) 0 0/220px 220px;
}
.cc-hero-bg:after{
    content:"";position:absolute;inset:0;
    background-image:
        radial-gradient(2px 2px at 12% 20%, #fff 99%, transparent 100%),
        radial-gradient(2px 2px at 78% 32%, #fff 99%, transparent 100%),
        radial-gradient(2px 2px at 24% 78%, #fff 99%, transparent 100%),
        radial-gradient(2px 2px at 67% 88%, #fff 99%, transparent 100%),
        radial-gradient(1.5px 1.5px at 90% 14%, #fff 99%, transparent 100%);
    opacity:.7;animation:cc-twinkle 4s ease-in-out infinite alternate;
}
@keyframes cc-twinkle{from{opacity:.35}to{opacity:.85}}
.cc-hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center}
.cc-eyebrow{
    display:inline-flex;align-items:center;gap:10px;padding:8px 14px;
    background:rgba(196,181,253,.18);border:1px solid rgba(196,181,253,.4);border-radius:999px;
    font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--cc-lilac);font-weight:600;
}
.cc-eyebrow:before{content:"";width:8px;height:8px;background:var(--cc-lilac);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.cc-hero h1{
    font-family:var(--cc-display);font-weight:500;
    font-size:clamp(48px,7.5vw,108px);line-height:1;color:#fff;margin:18px 0 18px;letter-spacing:-.5px;
}
.cc-hero h1 em{
    font-style:italic;
    background:linear-gradient(135deg,#c4b5fd 0%,#f0abfc 50%, #67e8f9 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
}
.cc-hero p{color:#d8d4ff;max-width:540px;font-size:18px;margin:0 0 28px}
.cc-hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.cc-btn{
    display:inline-flex;align-items:center;gap:10px;
    padding:15px 26px;font-weight:600;letter-spacing:.04em;
    background:#fff;color:var(--cc-cave);border-radius:999px;
    box-shadow:0 12px 40px -8px rgba(124,58,237,.5);
}
.cc-btn:hover{background:var(--cc-lilac);color:#fff}
.cc-btn-ghost{
    background:transparent;color:#fff;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.5);
}
.cc-btn-ghost:hover{background:rgba(255,255,255,.12);color:#fff}

/* Geode card */
.cc-geode{
    position:relative;padding:30px;border-radius:18px;
    background:rgba(15,13,51,.72);backdrop-filter:blur(8px);
    border:1px solid rgba(196,181,253,.3);
    color:#ede9fe;
    box-shadow:0 30px 60px -20px rgba(15,13,51,.7),inset 0 0 0 1px rgba(196,181,253,.08);
}
.cc-geode:before{
    content:"";position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;border-radius:18px;
    background:var(--cc-prism);background-size:200% 100%;
    animation:cc-shift 8s linear infinite;
    z-index:-1;filter:blur(20px);opacity:.55;
}
.cc-geode h3{
    font-family:var(--cc-display);font-style:italic;font-weight:500;font-size:26px;color:#ede9fe;margin:0 0 16px;
}
.cc-geode ul{list-style:none;padding:0;margin:0}
.cc-geode li{
    display:flex;justify-content:space-between;align-items:center;
    padding:14px 0;border-bottom:1px solid rgba(196,181,253,.18);gap:18px;
}
.cc-geode li:last-child{border-bottom:0}
.cc-geode small{display:block;color:var(--cc-fog);font-size:11px;letter-spacing:.2em;text-transform:uppercase;margin-top:3px}
.cc-odds{
    background:rgba(196,181,253,.16);color:var(--cc-lilac);
    padding:6px 14px;border-radius:6px;font-weight:600;font-size:18px;
    font-family:var(--cc-display);
}

/* Main */
.cc-main{padding:70px 0}
.cc-layout{display:grid;grid-template-columns:1fr 320px;gap:48px}
.cc-section-head{
    display:flex;align-items:flex-end;justify-content:space-between;gap:22px;margin-bottom:30px;
    padding-bottom:18px;
    border-bottom:1px solid rgba(124,58,237,.22);
}
.cc-section-head h2{
    font-family:var(--cc-display);font-weight:500;color:var(--cc-cave);font-size:46px;line-height:1;margin:0;
}
.cc-section-head h2 em{font-style:italic;color:var(--cc-amethyst)}
.cc-section-sub{color:#7c6dba;font-size:12px;letter-spacing:.28em;text-transform:uppercase}
.cc-link{
    color:var(--cc-amethyst-deep);font-weight:600;letter-spacing:.04em;font-size:14px;
    background:rgba(124,58,237,.1);padding:9px 16px;border-radius:999px;
}
.cc-link:hover{background:var(--cc-amethyst);color:#fff}

/* Cards as faceted gems */
.cc-feed{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.cc-card{
    position:relative;background:#fff;border-radius:14px;overflow:hidden;
    box-shadow:0 18px 40px -22px rgba(30,27,75,.4);
    border:1px solid rgba(124,58,237,.12);
    animation:cc-rise .9s ease both;animation-delay:var(--cc-d,0ms);
    transition:transform .4s ease,box-shadow .4s ease;
}
.cc-card:hover{transform:translateY(-4px);box-shadow:0 30px 60px -20px rgba(124,58,237,.35)}
@keyframes cc-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.cc-card-thumb{display:block;aspect-ratio:16/10;overflow:hidden;background:#1e1b4b;position:relative}
.cc-card-thumb:after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,transparent 60%, rgba(15,13,51,.55) 100%);
    pointer-events:none;
}
.cc-card-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .9s ease}
.cc-card:hover .cc-card-thumb img{transform:scale(1.06)}
.cc-card-tag{
    position:absolute;left:14px;top:14px;z-index:2;
    background:rgba(255,255,255,.92);color:var(--cc-amethyst-deep);font-weight:600;
    font-size:11px;letter-spacing:.18em;text-transform:uppercase;padding:6px 12px;border-radius:999px;
}
.cc-card-fb{
    width:100%;height:100%;display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg,#1e1b4b 0%,#5b21b6 50%,#7c3aed 100%);
    color:#ede9fe;font-family:var(--cc-display);font-size:60px;font-style:italic;
}
.cc-card-body{padding:20px 22px 24px}
.cc-card-meta{
    color:#7c6dba;font-size:12px;letter-spacing:.16em;text-transform:uppercase;
    display:flex;gap:10px;align-items:center;margin-bottom:10px;
}
.cc-card h3{
    font-family:var(--cc-display);font-weight:500;color:var(--cc-cave);font-size:24px;line-height:1.2;margin:0 0 10px;
}
.cc-card h3 a{color:inherit}
.cc-card h3 a:hover{color:var(--cc-amethyst)}
.cc-card p{color:#5a4f8f;margin:0 0 14px;font-size:14.5px}
.cc-card-link{
    color:var(--cc-amethyst-deep);font-weight:600;font-size:13px;display:inline-flex;align-items:center;gap:6px;
    border-bottom:1px solid var(--cc-amethyst);padding-bottom:2px;
}

/* Sidebar */
.cc-sidebar{display:flex;flex-direction:column;gap:24px}
.cc-widget{
    background:#fff;border:1px solid rgba(124,58,237,.16);border-radius:14px;padding:22px;
    box-shadow:0 14px 30px -20px rgba(30,27,75,.3);
}
.cc-widget h3{font-family:var(--cc-display);font-weight:500;color:var(--cc-cave);font-size:22px;margin:0 0 12px}
.cc-widget ul{list-style:none;padding:0;margin:0}
.cc-widget li{padding:8px 0;border-bottom:1px dashed rgba(124,58,237,.18);font-size:14px}
.cc-widget li:last-child{border-bottom:0}
.cc-widget a{color:var(--cc-cave)}
.cc-widget a:hover{color:var(--cc-amethyst)}
.cc-widget-prism{
    background:linear-gradient(160deg,#1e1b4b 0%,#5b21b6 60%,#7c3aed 100%);
    color:#ede9fe;border:0;
}
.cc-widget-prism h3{color:#fff}
.cc-widget-prism p{color:#d8d4ff;font-size:14px}

/* Crumb */
.cc-crumb{
    color:#7c6dba;font-size:12px;letter-spacing:.18em;text-transform:uppercase;
    display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:30px 0 14px;
}
.cc-crumb a{color:var(--cc-cave)}
.cc-crumb span{color:var(--cc-amethyst)}

/* Article */
.cc-article{
    background:#fff;border:1px solid rgba(124,58,237,.16);padding:48px;border-radius:18px;
    box-shadow:0 20px 50px -28px rgba(30,27,75,.35);
}
.cc-article h1{
    font-family:var(--cc-display);font-weight:500;color:var(--cc-cave);
    font-size:clamp(34px,5vw,58px);line-height:1.05;margin:8px 0 16px;
}
.cc-article-meta{color:#7c6dba;font-size:12px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:22px}
.cc-article-feature{margin:24px 0 30px;border-radius:14px;overflow:hidden}
.cc-content{font-size:17px;line-height:1.8;color:#3a2f72}
.cc-content p{margin:0 0 18px}
.cc-content h2{font-family:var(--cc-display);font-size:34px;margin:34px 0 14px;color:var(--cc-cave)}
.cc-content h3{font-family:var(--cc-display);font-size:26px;margin:24px 0 10px;color:var(--cc-amethyst-deep)}
.cc-content blockquote{
    border-left:4px solid var(--cc-amethyst);background:#f5f3ff;padding:18px 22px;border-radius:8px;
    margin:24px 0;font-family:var(--cc-display);font-style:italic;font-size:20px;color:var(--cc-cave);
}
.cc-content a{color:var(--cc-amethyst-deep);border-bottom:1px solid var(--cc-amethyst)}

/* Related */
.cc-related{margin-top:54px}
.cc-related h2{font-family:var(--cc-display);font-style:italic;color:var(--cc-cave);font-size:32px;margin:0 0 18px}
.cc-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}

/* Pager */
.cc-pager{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:42px}
.cc-pager a,.cc-pager span{
    background:#fff;border:1px solid rgba(124,58,237,.18);color:var(--cc-cave);padding:11px 16px;border-radius:999px;font-weight:600;font-size:13px;
}
.cc-pager .current{background:var(--cc-amethyst);color:#fff;border-color:var(--cc-amethyst)}

/* Comments */
.cc-comments{margin-top:50px;background:#fff;border:1px solid rgba(124,58,237,.16);padding:28px;border-radius:16px}
.cc-comments h2,.cc-comments h3{font-family:var(--cc-display);color:var(--cc-cave)}
.cc-comments .comment{border-bottom:1px dashed rgba(124,58,237,.2);padding:16px 0}
.cc-comments input[type=text],.cc-comments input[type=email],.cc-comments input[type=url],.cc-comments textarea{
    width:100%;padding:14px 16px;background:#f5f3ff;color:var(--cc-cave);border:1px solid rgba(124,58,237,.2);border-radius:8px;font-family:inherit;font-size:14px;
}
.cc-comments input[type=submit]{
    background:var(--cc-amethyst);color:#fff;border:0;padding:14px 26px;border-radius:999px;font-weight:600;cursor:pointer;
}

/* 404 */
.cc-404{padding:120px 0;text-align:center}
.cc-404 .cc-glyph{
    font-family:var(--cc-display);font-style:italic;font-size:240px;line-height:1;
    background:var(--cc-prism);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.cc-404 h1{font-family:var(--cc-display);color:var(--cc-cave);font-size:46px;margin:0 0 14px}
.cc-404 p{color:#7c6dba;max-width:520px;margin:0 auto 24px}

/* Footer */
.cc-footer{
    background:linear-gradient(180deg,#1e1b4b 0%,#0f0d33 100%);color:#cdc7f3;padding:64px 0 26px;margin-top:60px;position:relative;
}
.cc-footer:before{
    content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--cc-prism);background-size:200% 100%;animation:cc-shift 9s linear infinite;
}
.cc-foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px}
.cc-foot-grid h4{font-family:var(--cc-display);color:#fff;font-size:22px;margin:0 0 14px;font-weight:500}
.cc-foot-grid ul{list-style:none;margin:0;padding:0}
.cc-foot-grid li{padding:6px 0;font-size:13.5px}
.cc-foot-grid a{color:#cdc7f3}
.cc-foot-grid a:hover{color:#fff}
.cc-foot-brand p{color:#a5a0d8;font-size:14px;max-width:340px}
.cc-foot-bottom{
    margin-top:42px;border-top:1px solid rgba(196,181,253,.18);padding-top:22px;
    display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
    font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:#a5a0d8;
}

@media (max-width:980px){
    .cc-hero-grid,.cc-layout{grid-template-columns:1fr;gap:36px}
    .cc-feed,.cc-related-grid{grid-template-columns:1fr 1fr}
    .cc-foot-grid{grid-template-columns:1fr 1fr}
    .cc-section-head h2{font-size:36px}
}
@media (max-width:560px){
    .cc-feed,.cc-related-grid,.cc-foot-grid{grid-template-columns:1fr}
    .cc-article{padding:26px}
}