/* =========================================================
   Durondal CV Terminal — main.css
   ========================================================= */

:root{
	--bg:            #0a0e0c;
	--bg-soft:       #0d1310;
	--card:          #0e1512;
	--card-border:   rgba(52, 211, 153, 0.16);
	--card-border-hover: rgba(52, 211, 153, 0.32);
	--green:         #2fe6a4;
	--green-soft:    rgba(47, 230, 164, 0.12);
	--green-bright:  #3dffb0;
	--text-main:     #f2f5f3;
	--text-body:     #9aa5a0;
	--text-dim:      #6c7873;
	--track:         #182420;
	--radius-lg:     16px;
	--radius-md:     12px;
	--radius-sm:     8px;
	--font-mono:     'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
	--font-sans:     'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--maxw:          1180px;
}

html,body{ background:var(--bg); }
body{
	color:var(--text-body);
	font-family:var(--font-sans);
	font-size:18px;
	line-height:1.5;
	margin:0;
}
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
img{ max-width:100%; display:block; }

.dcv-wrap{
	max-width:var(--maxw);
	margin:0 auto;
	padding:22px 24px 28px;
}

.dcv-icon{ width:20px; height:20px; flex-shrink:0; }

/* ---------- Header / hero ---------- */
.dcv-hero{
	display:flex;
	justify-content:space-between;
	align-items:flex-start;
	gap:20px;
	flex-wrap:wrap;
	margin-bottom:16px;
}
.dcv-hero-left{
	display:flex;
	gap:16px;
	flex-wrap:wrap;
	align-items:center;
}
.dcv-avatar{
	position:relative;
	width:74px;
	height:74px;
	flex-shrink:0;
	border-radius:11px;
	border:2px solid var(--card-border-hover);
	background:var(--bg-soft);
	display:flex;
	align-items:center;
	justify-content:center;
	overflow:hidden;
}
.dcv-avatar img{ width:100%; height:100%; object-fit:cover; }
.dcv-avatar .dcv-icon{ width:30px; height:30px; color:var(--text-dim); }
.dcv-avatar-badge{
	position:absolute;
	bottom:-4px;
	right:-4px;
	width:22px;
	height:22px;
	border-radius:50%;
	background:var(--green);
	color:#04140c;
	display:flex;
	align-items:center;
	justify-content:center;
	font-family:var(--font-mono);
	font-weight:800;
	font-size:9px;
	box-shadow:0 0 0 3px var(--bg);
}

.dcv-identity{ max-width:600px; }
.dcv-name{
	font-family:var(--font-sans);
	font-weight:800;
	font-size:28px;
	color:var(--text-main);
	margin:0 0 7px;
	letter-spacing:-0.3px;
}
.dcv-name .accent{ color:var(--green); }
.dcv-username{
	color:var(--text-dim);
	font-family:var(--font-mono);
	font-weight:500;
	font-size:0.55em;
	letter-spacing:0;
}

.dcv-badges{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
}
.dcv-badge{
	display:inline-flex;
	align-items:center;
	gap:6px;
	padding:4px 11px;
	border-radius:999px;
	border:1px solid var(--card-border-hover);
	color:var(--green);
	font-size:15px;
	font-weight:600;
	background:transparent;
}
.dcv-badge .dcv-icon{ width:13px; height:13px; }

.dcv-hero-right{
	display:flex;
	flex-direction:column;
	align-items:flex-end;
	gap:18px;
}
.dcv-download-btn{
	display:inline-flex;
	align-items:center;
	gap:8px;
	background:var(--green);
	color:#04140c;
	font-weight:700;
	font-size:16px;
	border:none;
	border-radius:8px;
	padding:8px 16px;
	cursor:pointer;
	font-family:var(--font-sans);
	transition:transform .15s ease, background .15s ease;
}
.dcv-download-btn:hover{ background:var(--green-bright); transform:translateY(-1px); }
.dcv-download-btn .dcv-icon{ width:15px; height:15px; }

.dcv-socials{ display:flex; gap:10px; }
.dcv-social-link{
	position:relative;
	width:50px;
	height:50px;
	border-radius:50%;
	border:1px solid var(--card-border-hover);
	display:flex;
	align-items:center;
	justify-content:center;
	color:var(--green);
	transition:background .15s ease, border-color .15s ease;
}
.dcv-social-link:hover{ background:var(--green-soft); border-color:var(--green); }
.dcv-social-link .dcv-icon{ width:25px; height:25px; }
.dcv-social-img{ width:28px; height:28px; object-fit:contain; display:block; }

/* Tooltip on hover, naming the site */
.dcv-social-link[data-tooltip]::after{
	content:attr(data-tooltip);
	position:absolute;
	bottom:calc(100% + 8px);
	left:50%;
	transform:translateX(-50%) translateY(4px);
	background:var(--card);
	border:1px solid var(--card-border-hover);
	color:var(--text-main);
	font-size:11px;
	font-weight:600;
	white-space:nowrap;
	padding:4px 9px;
	border-radius:6px;
	opacity:0;
	pointer-events:none;
	transition:opacity .15s ease, transform .15s ease;
	z-index:10;
}
.dcv-social-link[data-tooltip]:hover::after{
	opacity:1;
	transform:translateX(-50%) translateY(0);
}

/* ---------- Section heading ---------- */
.dcv-section{ margin-bottom:12px; }
.dcv-section-title{
	display:flex;
	align-items:center;
	gap:7px;
	font-size:16px;
	font-weight:800;
	color:var(--text-main);
	margin:0 0 7px;
	text-transform:uppercase;
	letter-spacing:0.03em;
}
.dcv-section-title .dcv-icon{ width:14.5px; height:14.5px; color:var(--green); }

.dcv-card{
	background:var(--card);
	border:1px solid var(--card-border);
	border-radius:10px;
	padding:12px 15px;
}

/* ---------- Skills — percentage progress bar ---------- */
.dcv-skill-row{ margin-bottom:7px; }
.dcv-skill-row:last-child{ margin-bottom:0; }
.dcv-skill-head{
	display:flex;
	justify-content:space-between;
	font-size:14.5px;
	margin-bottom:3px;
	gap:8px;
}
.dcv-skill-head .name{ color:#dbe3df; }
.dcv-skill-head .pct{ color:var(--green); font-weight:600; font-family:var(--font-mono); flex-shrink:0; }

.dcv-track{
	width:100%;
	height:5px;
	border-radius:999px;
	background:var(--track);
	overflow:hidden;
}
.dcv-fill{
	height:100%;
	border-radius:999px;
	background:linear-gradient(90deg, var(--green) 0%, var(--green-bright) 100%);
}

/* ---------- Experience (no dropdown — always expanded) ---------- */
.dcv-exp-item{
	display:flex;
	gap:11px;
	background:var(--card);
	border:1px solid var(--card-border);
	border-radius:10px;
	padding:10px 15px;
	margin-bottom:7px;
}
.dcv-exp-item:last-child{ margin-bottom:0; }
.dcv-exp-icon{
	width:30px;
	height:30px;
	border-radius:8px;
	background:var(--green-soft);
	color:var(--green);
	display:flex;
	align-items:center;
	justify-content:center;
	flex-shrink:0;
}
.dcv-exp-icon .dcv-icon{ width:15px; height:15px; }
.dcv-exp-body{ flex:1; min-width:0; }
.dcv-exp-title{ font-size:16.5px; font-weight:700; color:var(--text-main); margin:0 0 1px; }
.dcv-exp-company{ color:var(--green); font-size:14.5px; font-weight:600; }
.dcv-exp-dates{ color:var(--text-dim); font-size:13.5px; margin-left:6px; }
.dcv-exp-desc{
	margin-top:6px;
	padding-top:6px;
	border-top:1px solid var(--card-border);
	color:var(--text-body);
	font-size:14.5px;
	line-height:1.5;
}

/* ---------- Certifications / Education ---------- */
.dcv-list-item{
	display:flex;
	gap:9px;
	padding:7px 0;
	border-bottom:1px solid var(--card-border);
}
.dcv-list-item:last-child{ border-bottom:none; padding-bottom:0; }
.dcv-list-item:first-child{ padding-top:0; }
.dcv-list-dot{
	width:6px; height:6px;
	border-radius:50%;
	background:var(--green);
	margin-top:6px;
	flex-shrink:0;
}
.dcv-list-title{ color:var(--text-main); font-weight:700; font-size:14.5px; margin:0 0 1px; }
.dcv-list-sub{ color:var(--green); font-weight:600; font-size:14px; }
.dcv-list-meta{ color:var(--text-dim); font-size:13.5px; }

/* ---------- CV body layout: 1/3 sidebar + 2/3 main ---------- */
.dcv-cv-layout{
	display:grid;
	grid-template-columns:minmax(0, 1fr) minmax(0, 2fr);
	gap:14px;
	align-items:start;
}
@media (max-width:820px){
	.dcv-cv-layout{ grid-template-columns:1fr; }
}

.dcv-sidebar .dcv-section,
.dcv-main .dcv-section{ margin-bottom:10px; }
.dcv-sidebar .dcv-section:last-child,
.dcv-main .dcv-section:last-child{ margin-bottom:0; }

.dcv-sidebar .dcv-card{ padding:9px 11px; }

.dcv-contact-list{ display:flex; flex-direction:column; gap:5px; }
.dcv-contact-list .dcv-contact-item{ display:flex; align-items:center; font-size:14px; gap:6px; color:var(--text-body); }
.dcv-contact-list .dcv-contact-item .dcv-icon{ width:13px; height:13px; color:var(--green); }

.dcv-sidebar .dcv-list-item{ padding:5px 0; gap:5px; }
.dcv-edu-item .dcv-list-sub{ display:block; margin:1px 0; }

.dcv-summary-text{ font-size:14.5px; color:var(--text-body); line-height:1.5; margin:0; }

/* ---------- Responsive ---------- */
@media (max-width:760px){
	.dcv-hero{ flex-direction:column; }
	.dcv-hero-right{ align-items:flex-start; width:100%; }
	.dcv-name{ font-size:22px; }
	.dcv-exp-dates{ display:block; margin-left:0; }
}
