/*
Theme Name: Q-Profi
Theme URI: https://q-profi.example
Author: q-profi
Author URI: https://q-profi.example
Description: Two-track landing page theme for web development & academic support services.
Version: 1.0
Requires at least: 5.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: q-profi
*/

:root{
  --ink:#15181b;
  --paper:#f1ecdf;
  --code:#2f6f62;
  --code-dim:#264f47;
  --academic:#a9762e;
  --academic-dim:#7a5a26;
  --line:#3a3f3c;
  --line-light:#d8cfba;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
html,body{margin:0;padding:0;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;}
img{max-width:100%; display:block;}
section{scroll-margin-top:70px;}

/* ---------- NAV ---------- */
.nav{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem 5vw;
  background:var(--paper);
  border-bottom:1px solid var(--line-light);
}
.nav-mark{
  font-weight:700;
  font-size:.95rem;
  display:flex; align-items:center; gap:.4rem;
  text-decoration:none;
}
.nav-mark span:first-child{font-family:'Courier New',monospace; color:var(--code);}
.nav-mark span:last-child{font-family:Georgia,serif; font-style:italic; color:var(--academic);}
.nav-links{display:flex; gap:1.8rem; font-size:.85rem;}
.nav-links ul{list-style:none; margin:0; padding:0; display:flex; gap:1.8rem;}
.nav-links a{text-decoration:none; opacity:.75; transition:opacity .15s ease;}
.nav-links a:hover{opacity:1;}
@media (max-width:700px){.nav-links{display:none;}}

/* ---------- HERO SPLIT ---------- */
.hero{display:flex; min-height:82vh; position:relative; overflow:hidden; background:url('assets/img/hero-bg.jpg') center/cover no-repeat;}
.hero-half{flex:1; display:flex; flex-direction:column; justify-content:center; padding:6vw 5vw; position:relative;}
.hero-code{background:rgba(21,24,27,.32); color:var(--paper); align-items:flex-end; text-align:right; text-shadow:0 2px 14px rgba(0,0,0,.65);}
.hero-academic{background:rgba(241,236,223,.22); color:var(--ink); align-items:flex-start; text-align:left; text-shadow:0 2px 12px rgba(241,236,223,.85);}
.kicker{font-size:.8rem; letter-spacing:.02em; margin-bottom:1.1rem; opacity:.65;}
.hero-code .kicker{font-family:'Courier New',monospace;}
.hero-academic .kicker{font-family:Georgia,'Times New Roman',serif; font-style:italic;}
.hero-code h1{font-family:'Courier New',Consolas,monospace; font-size:clamp(1.7rem,3.2vw,2.6rem); line-height:1.25; font-weight:700; margin:0 0 1.3rem 0; max-width:20ch;}
.hero-academic h1{font-family:Georgia,'Times New Roman',serif; font-size:clamp(1.8rem,3.4vw,2.8rem); line-height:1.28; font-weight:400; margin:0 0 1.3rem 0; max-width:19ch;}
.hero-half p{max-width:34ch; font-size:.98rem; line-height:1.6; opacity:.8; margin:0 0 1.8rem 0;}
.hero-code p{font-family:'Courier New',monospace; font-size:.85rem;}
.hero-academic p{font-family:Georgia,serif;}
.hero-btn{display:inline-block; padding:.75rem 1.4rem; font-size:.85rem; text-decoration:none; border:1px solid currentColor; transition:background .2s ease, color .2s ease;}
.hero-code .hero-btn{color:var(--paper); font-family:'Courier New',monospace;}
.hero-code .hero-btn:hover{background:var(--paper); color:var(--ink);}
.hero-academic .hero-btn{color:var(--ink); font-family:Georgia,serif;}
.hero-academic .hero-btn:hover{background:var(--ink); color:var(--paper);}
.seam{position:absolute; left:50%; top:0; bottom:0; width:1px; background:var(--line-light); transform:translateX(-50%);}
.seam-mark{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:56px; height:56px; border-radius:50%; background:var(--paper); border:1px solid var(--line-light); display:flex; align-items:center; justify-content:center; overflow:hidden; z-index:2;}
.seam-mark svg{width:38px; height:38px;}
@media (max-width:760px){
  .hero{flex-direction:column; min-height:auto;}
  .hero-half{align-items:flex-start !important; text-align:left !important; padding:12vw 7vw;}
  .seam, .seam-mark{display:none;}
}
.hero-half > *{opacity:0; transform:translateY(14px); animation:rise .7s ease forwards;}
.hero-code > *:nth-child(1){animation-delay:.05s;}
.hero-code > *:nth-child(2){animation-delay:.2s;}
.hero-code > *:nth-child(3){animation-delay:.35s;}
.hero-academic > *:nth-child(1){animation-delay:.25s;}
.hero-academic > *:nth-child(2){animation-delay:.4s;}
.hero-academic > *:nth-child(3){animation-delay:.55s;}
@keyframes rise{to{opacity:1; transform:translateY(0);}}
@media (prefers-reduced-motion:reduce){.hero-half > *{animation:none; opacity:1; transform:none;}}

/* ---------- SECTION HEADERS ---------- */
.section-inner{max-width:1000px; margin:0 auto; padding:5.5rem 6vw;}
.section-head{margin-bottom:2.8rem; max-width:46ch;}
.section-head h2{font-size:clamp(1.4rem,2.4vw,1.9rem); font-weight:600; margin:0 0 .7rem 0;}
.section-head p{font-size:.95rem; line-height:1.6; opacity:.7; margin:0;}

/* ---------- SERVICES ---------- */
.services-grid{display:grid; grid-template-columns:1fr 1fr; gap:3.5rem;}
@media (max-width:760px){.services-grid{grid-template-columns:1fr; gap:3rem;}}
.service-block h3{font-size:1.05rem; font-weight:600; margin:0 0 1.2rem 0; padding-bottom:.8rem; border-bottom:1px solid var(--line-light);}
.service-block.code h3{font-family:'Courier New',monospace; color:var(--code);}
.service-block.academic h3{font-family:Georgia,serif; color:var(--academic);}
.service-list{list-style:none; margin:0; padding:0;}
.service-list li{padding:.7rem 0; border-bottom:1px solid var(--line-light); font-size:.92rem; line-height:1.5;}
.service-list li:last-child{border-bottom:none;}
.service-block.code .service-list{font-family:'Courier New',monospace; font-size:.85rem;}
.service-block.academic .service-list{font-family:Georgia,serif;}

/* ---------- PROCESS ---------- */
.process{background:#e9e2cf;}
.process-steps{display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem;}
@media (max-width:760px){.process-steps{grid-template-columns:1fr;}}
.step{padding-top:1rem; border-top:1px solid var(--line);}
.step h4{font-size:.95rem; font-weight:600; margin:0 0 .5rem 0;}
.step p{font-size:.85rem; line-height:1.55; opacity:.75; margin:0;}

/* ---------- WORK ---------- */
.work-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem;}
@media (max-width:760px){.work-grid{grid-template-columns:1fr;}}
.work-card{border:1px solid var(--line-light); padding:1.4rem; background:var(--paper); display:block; color:inherit; text-decoration:none; transition:border-color .15s ease;}
a.work-card:hover{border-color:var(--ink);}
.work-card .tag{font-size:.72rem; opacity:.6; margin-bottom:.6rem;}
.work-card .tag.code{font-family:'Courier New',monospace; color:var(--code);}
.work-card .tag.academic{font-family:Georgia,serif; color:var(--academic); font-style:italic;}
.work-card h4{margin:0 0 .5rem 0; font-size:1rem;}
.work-card p{margin:0; font-size:.85rem; line-height:1.55; opacity:.75;}
.work-note{margin-top:2rem; font-size:.82rem; opacity:.6; font-style:italic;}

/* ---------- FAQ ---------- */
.faq-item{border-bottom:1px solid var(--line-light); padding:1.2rem 0;}
.faq-item summary{cursor:pointer; font-size:.95rem; font-weight:600; list-style:none; display:flex; justify-content:space-between; align-items:center;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+"; font-weight:400; font-size:1.2rem;}
.faq-item[open] summary::after{content:"\2013";}
.faq-item p{font-size:.88rem; line-height:1.6; opacity:.75; margin:.8rem 0 0 0; max-width:60ch;}

/* ---------- CONTACT ---------- */
.contact{background:var(--ink); color:var(--paper);}
.contact .section-inner{padding:5.5rem 6vw;}
.contact-inner{max-width:640px;}
.contact h2{font-family:Georgia,serif; font-weight:400; font-size:clamp(1.6rem,3vw,2.2rem); margin:0 0 2rem 0;}
.field{margin-bottom:1.4rem;}
.field label{display:block; font-size:.78rem; opacity:.6; margin-bottom:.4rem;}
.field select, .field input, .field textarea{width:100%; background:transparent; border:none; border-bottom:1px solid #4a4f4c; color:var(--paper); font-family:inherit; font-size:1rem; padding:.6rem 0; outline:none;}
.field select{appearance:none; cursor:pointer;}
.field select option{color:#000;}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:1.4rem;}
@media (max-width:600px){.field-row{grid-template-columns:1fr;}}
.route-hint{font-size:.85rem; opacity:.65; margin-top:.6rem; min-height:1.2em;}
.submit-btn{margin-top:1rem; padding:.85rem 1.6rem; background:var(--paper); color:var(--ink); border:none; font-size:.9rem; cursor:pointer;}
.submit-btn:disabled{opacity:.6; cursor:default;}
.form-status{margin-top:1rem; font-size:.85rem;}
.form-status.success{color:#8fd6a0;}
.form-status.error{color:#e08a8a;}

footer.site-footer{padding:2.5rem 6vw; font-size:.8rem; opacity:.55; text-align:left; display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem;}
