/* CV Factory – shared styles for guide pages, blog and legal pages */
:root {
  --green:#4caf3c; --blue:#2196c8; --red:#e8192c; --purple:#9c27b0; --orange:#f57c00;
  --yellow:#ffc107; --cyan:#00bcd4; --light:#f8f9fa; --dark:#1a1a2e; --text:#2d3436; --muted:#636e72;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Nunito',sans-serif; color:var(--text); background:white; line-height:1.75; overflow-x:hidden; }
a { color:var(--blue); }
img { max-width:100%; }

.strip { height:5px; background:linear-gradient(90deg,var(--red),var(--orange),var(--yellow),var(--green),var(--cyan),var(--blue),var(--purple)); }

/* HEADER */
.site-header { position:sticky; top:0; z-index:100; background:rgba(255,255,255,0.97); backdrop-filter:blur(10px); box-shadow:0 2px 20px rgba(0,0,0,0.07); display:flex; align-items:center; gap:1.2rem; padding:0 5%; height:68px; }
.logo-link { display:flex; align-items:center; gap:0.6rem; text-decoration:none; color:var(--dark); font-weight:800; font-size:1.05rem; margin-right:auto; }
.logo-link img { height:44px; width:44px; border-radius:8px; }
.site-nav { display:flex; align-items:center; gap:1.5rem; }
.site-nav a { text-decoration:none; color:var(--text); font-weight:700; font-size:0.88rem; }
.site-nav a:hover, .site-nav a[aria-current="page"] { color:var(--blue); }
.nav-cta { background:linear-gradient(135deg,var(--blue),var(--green)); color:white!important; padding:0.45rem 1.3rem; border-radius:50px; font-weight:800!important; }
.currency-switcher { display:flex; gap:0.3rem; background:#f0f4f8; border-radius:50px; padding:4px; }
.cur-btn { border:none; background:transparent; cursor:pointer; font-family:'Nunito',sans-serif; font-weight:700; font-size:0.76rem; padding:4px 10px; border-radius:50px; color:var(--muted); }
.cur-btn.active { background:white; color:var(--blue); box-shadow:0 2px 8px rgba(0,0,0,0.1); }
.nav-toggle { display:none; background:none; border:none; font-size:1.6rem; cursor:pointer; color:var(--dark); line-height:1; }

/* PAGE HERO */
.page-hero { background:linear-gradient(160deg,#f0f9ff 0%,#fff8f0 50%,#f0fff4 100%); padding:3.5rem 5% 3rem; text-align:center; }
.breadcrumb { font-size:0.8rem; color:var(--muted); margin-bottom:1rem; }
.breadcrumb a { color:var(--muted); text-decoration:none; }
.breadcrumb a:hover { color:var(--blue); }
.page-hero h1 { font-family:'Bebas Neue',sans-serif; font-size:clamp(2.4rem,6vw,4.2rem); letter-spacing:2px; line-height:1.05; color:var(--dark); max-width:900px; margin:0 auto 1rem; }
.page-hero .lead { font-size:1.1rem; color:var(--muted); max-width:680px; margin:0 auto 1.8rem; }
.hero-btns { display:flex; gap:0.8rem; justify-content:center; flex-wrap:wrap; }
.btn { display:inline-block; text-decoration:none; font-weight:800; border-radius:50px; padding:0.8rem 1.9rem; font-size:0.95rem; transition:transform 0.2s; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { background:linear-gradient(135deg,var(--red),var(--orange)); color:white; box-shadow:0 8px 25px rgba(232,25,44,0.25); }
.btn-outline { border:2.5px solid var(--blue); color:var(--blue); }
.meta { font-size:0.85rem; color:var(--muted); }

/* CONTENT */
.content { max-width:760px; margin:0 auto; padding:3rem 5% 1rem; }
.content h2 { font-size:1.6rem; font-weight:800; color:var(--dark); line-height:1.3; margin:2.4rem 0 0.8rem; }
.content h3 { font-size:1.15rem; font-weight:800; color:var(--dark); margin:1.6rem 0 0.4rem; }
.content p { margin-bottom:1rem; font-size:1.02rem; }
.content ul, .content ol { margin:0 0 1.1rem 1.3rem; }
.content li { margin-bottom:0.45rem; font-size:1.02rem; }
.content strong { color:var(--dark); }
.content table { width:100%; border-collapse:collapse; margin:0.5rem 0 1.4rem; font-size:0.93rem; }
.content th, .content td { text-align:left; padding:0.65rem 0.7rem; border-bottom:1px solid #e8ecef; vertical-align:top; }
.content th { background:var(--light); font-weight:800; color:var(--dark); }
.table-wrap { overflow-x:auto; }
.callout { background:rgba(33,150,200,0.07); border-left:4px solid var(--blue); border-radius:10px; padding:1.1rem 1.3rem; margin:1.4rem 0; }
.callout p:last-child { margin-bottom:0; }
.tick-list { list-style:none; margin-left:0!important; }
.tick-list li { padding-left:1.7rem; position:relative; }
.tick-list li::before { content:'✓'; position:absolute; left:0; color:var(--green); font-weight:800; }
.cross-list { list-style:none; margin-left:0!important; }
.cross-list li { padding-left:1.7rem; position:relative; }
.cross-list li::before { content:'✕'; position:absolute; left:0; color:var(--red); font-weight:800; }

/* PACKAGE CARDS (guide pages) */
.mini-pkgs { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin:1.2rem 0 1.6rem; }
.mini-pkg { border:2px solid #e8ecef; border-radius:16px; padding:1.3rem 1.2rem; display:flex; flex-direction:column; position:relative; }
.mini-pkg.recommended { border-color:var(--blue); box-shadow:0 8px 30px rgba(33,150,200,0.15); }
.mini-pkg .rec { position:absolute; top:-12px; left:1rem; background:linear-gradient(135deg,var(--blue),var(--purple)); color:white; font-size:0.68rem; font-weight:800; letter-spacing:1px; text-transform:uppercase; padding:0.2rem 0.7rem; border-radius:50px; }
.mini-pkg h3 { margin:0 0 0.3rem!important; font-size:1rem!important; }
.mini-pkg .price { font-family:'Bebas Neue',sans-serif; font-size:2rem; color:var(--dark); line-height:1.1; }
.mini-pkg .note { font-size:0.8rem; color:var(--muted); margin-bottom:0.6rem; }
.mini-pkg ul { list-style:none; margin:0 0 1rem!important; font-size:0.86rem; flex:1; }
.mini-pkg li { font-size:0.86rem!important; margin-bottom:0.25rem!important; padding-left:1.2rem; position:relative; }
.mini-pkg li::before { content:'✓'; position:absolute; left:0; color:var(--green); font-weight:800; }
.mini-pkg a { text-align:center; text-decoration:none; font-weight:800; font-size:0.88rem; border-radius:10px; padding:0.6rem; background:var(--dark); color:white; }
.mini-pkg.recommended a { background:linear-gradient(135deg,var(--blue),var(--green)); }

/* CTA BOX */
.cta-box { background:linear-gradient(135deg,var(--dark),#2d3561); color:white; border-radius:20px; padding:2.2rem 2rem; text-align:center; margin:2.5rem 0; }
.cta-box h2 { color:white!important; margin:0 0 0.5rem!important; font-family:'Bebas Neue',sans-serif; font-size:2.2rem!important; letter-spacing:1.5px; font-weight:400!important; }
.cta-box p { opacity:0.8; margin-bottom:1.3rem!important; }

/* FAQ (details/summary – works without JavaScript) */
.faq details { border-bottom:1px solid #edf2f7; padding:0.2rem 0; }
.faq summary { cursor:pointer; font-weight:700; color:var(--dark); padding:0.9rem 0; list-style:none; display:flex; justify-content:space-between; gap:1rem; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:'+'; color:var(--blue); font-size:1.3rem; line-height:1; transition:transform 0.2s; }
.faq details[open] summary::after { transform:rotate(45deg); }
.faq details p { color:var(--muted); padding-bottom:0.9rem; margin:0; }

/* RELATED / BLOG CARDS */
.related { max-width:1100px; margin:1rem auto 3rem; padding:0 5%; }
.related h2 { font-size:1.4rem; font-weight:800; color:var(--dark); margin-bottom:1rem; text-align:center; }
.card-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1.3rem; }
.card { display:flex; flex-direction:column; background:white; border-radius:18px; box-shadow:0 4px 20px rgba(0,0,0,0.07); padding:1.6rem 1.5rem; text-decoration:none; color:var(--text); transition:transform 0.25s,box-shadow 0.25s; border-top:4px solid var(--blue); }
.card:hover { transform:translateY(-5px); box-shadow:0 14px 36px rgba(0,0,0,0.12); }
.card.c-green { border-top-color:var(--green); } .card.c-purple { border-top-color:var(--purple); } .card.c-orange { border-top-color:var(--orange); }
.card .tag { font-size:0.7rem; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; color:var(--blue); margin-bottom:0.5rem; }
.card h3 { font-size:1.12rem; font-weight:800; color:var(--dark); line-height:1.35; margin-bottom:0.5rem; }
.card p { font-size:0.9rem; color:var(--muted); flex:1; margin-bottom:0.8rem; }
.card .more { font-weight:800; font-size:0.86rem; color:var(--blue); }
.blog-list { max-width:1100px; margin:0 auto; padding:3rem 5%; }

/* ARTICLE */
.article-meta { display:flex; gap:0.6rem 1.2rem; justify-content:center; flex-wrap:wrap; font-size:0.85rem; color:var(--muted); }
.toc { background:var(--light); border-radius:12px; padding:1rem 1.3rem; margin-bottom:1.5rem; }
.toc strong { display:block; font-size:0.85rem; text-transform:uppercase; letter-spacing:1px; margin-bottom:0.3rem; }
.toc ol { margin-bottom:0!important; }
.toc li { font-size:0.93rem!important; margin-bottom:0.2rem!important; }
.toc a { text-decoration:none; font-weight:700; }

/* FOOTER */
.site-footer { background:var(--dark); color:white; padding:50px 5% 26px; margin-top:2rem; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:2.5rem; max-width:1200px; margin:0 auto 2.5rem; }
.footer-brand img { height:56px; width:56px; background:white; padding:5px; border-radius:12px; margin-bottom:0.8rem; }
.footer-brand p { color:rgba(255,255,255,0.55); font-size:0.88rem; line-height:1.7; }
.site-footer h4 { font-weight:800; margin-bottom:0.9rem; font-size:0.8rem; letter-spacing:1px; text-transform:uppercase; color:rgba(255,255,255,0.5); }
.site-footer ul { list-style:none; }
.site-footer li { margin-bottom:0.45rem; }
.site-footer a { color:rgba(255,255,255,0.75); text-decoration:none; font-size:0.88rem; }
.site-footer a:hover { color:var(--cyan); }
.footer-bottom { border-top:1px solid rgba(255,255,255,0.08); padding-top:1.3rem; max-width:1200px; margin:0 auto; color:rgba(255,255,255,0.4); font-size:0.82rem; }

/* RESPONSIVE */
@media (max-width:900px) {
  .mini-pkgs { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:820px) {
  .nav-toggle { display:block; }
  .site-nav { display:none; position:absolute; top:68px; left:0; right:0; flex-direction:column; gap:0; background:white; box-shadow:0 12px 24px rgba(0,0,0,0.1); padding:0.4rem 5% 1rem; }
  .site-nav.open { display:flex; }
  .site-nav a { width:100%; text-align:center; padding:0.75rem 0; border-bottom:1px solid #f0f4f8; }
  .site-nav a.nav-cta { width:auto; margin-top:0.7rem; padding:0.5rem 1.6rem; border:none; }
  .logo-link span { display:none; }
  .cur-btn { padding:4px 8px; font-size:0.72rem; }
}
@media (max-width:480px) { .footer-grid { grid-template-columns:1fr; } .cta-box { padding:1.8rem 1.2rem; } }
