/* ============================================================
   Habib Education — page-specific styles
   (Extracted from inline <style> blocks in the HTML prototypes
    for universities.html, language-centers.html, contact.html)
============================================================ */

/* ---- University Archive ---- */
.arch-filters{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:22px 24px;box-shadow:var(--sh-sm);margin-bottom:28px;}
.arch-filters .fg{display:flex;flex-direction:column;gap:7px;}
.arch-filters label{font-family:var(--font-head);font-weight:600;font-size:13px;color:var(--ink-2);}
.arch-filters select{min-width:190px;padding:11px 14px;border:1.5px solid var(--line);border-radius:var(--r-md);font-family:var(--font-body);font-size:15px;color:var(--ink);background:#fff;}
.arch-filters select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px var(--teal-50);}
.arch-filters .spacer{flex:1;}
.arch-count{font-family:var(--font-head);font-size:15px;color:var(--slate);white-space:nowrap;}
#arch-reset{font-family:var(--font-head);font-weight:600;font-size:14px;color:var(--brand);padding:11px 8px;}
#arch-reset:hover{text-decoration:underline;}
#arch-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.arch-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-sm);transition:.25s;display:flex;flex-direction:column;}
.arch-card:hover{box-shadow:var(--sh-lg);transform:translateY(-4px);border-color:var(--teal-100);}
.arch-img{height:190px;position:relative;}
.arch-body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1;}
.arch-top{display:flex;align-items:center;gap:13px;}
.arch-top h3{font-size:17.5px;line-height:1.25;}
.arch-top .loc{color:var(--slate);font-size:13.5px;display:flex;align-items:center;gap:5px;margin-top:3px;}
.arch-tag{color:var(--ink-2);font-size:15px;margin-top:14px;line-height:1.5;}
.arch-meta{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap;}
.arch-foot{margin-top:auto;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line-2);}
.arch-prog{font-family:var(--font-head);font-size:14px;color:var(--slate);}
.arch-prog b{color:var(--ink);font-size:16px;}

/* ---- Language Center Archive ---- */
#lc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.lc-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:30px 26px;box-shadow:var(--sh-sm);transition:.25s;display:flex;flex-direction:column;gap:14px;}
.lc-card:hover{box-shadow:var(--sh-lg);transform:translateY(-4px);border-color:var(--teal-100);}
.lc-logo{width:66px;height:66px;border-radius:16px;display:grid;place-items:center;background:#fff;border:1px solid var(--line);color:var(--brand);font-family:var(--font-head);font-weight:800;font-size:21px;box-shadow:var(--sh-sm);}
.lc-card h3{font-size:19px;}
.lc-card p{color:var(--ink-2);font-size:15px;line-height:1.55;}

/* ---- Contact page ---- */
.contact-grid{display:grid;grid-template-columns:380px 1fr;gap:40px;align-items:start;}
.ci-list{display:flex;flex-direction:column;gap:16px;}
.ci-item{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:20px 22px;box-shadow:var(--sh-sm);transition:.2s;}
.ci-item:hover{box-shadow:var(--sh-md);border-color:var(--teal-100);}
.ci-ic{width:48px;height:48px;border-radius:13px;flex:none;display:grid;place-items:center;background:var(--teal-50);color:var(--brand);}
.ci-ic svg{width:23px;height:23px;}
.ci-item h4{font-size:15px;margin-bottom:3px;}
.ci-item p,.ci-item a{color:var(--slate);font-size:15px;line-height:1.5;}
.ci-item a:hover{color:var(--brand);}
.map-box{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);box-shadow:var(--sh-sm);height:300px;margin-bottom:28px;}
.map-box iframe{width:100%;height:100%;border:0;display:block;}
.form-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:32px;box-shadow:var(--sh-sm);}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form-success{display:none;text-align:center;padding:36px 20px;}
.form-success.show{display:block;}
.form-success .ok{width:64px;height:64px;border-radius:50%;background:var(--green-soft);color:var(--green);display:grid;place-items:center;margin:0 auto 16px;}
.form-success .ok svg{width:32px;height:32px;}

/* ---- Blog layout ---- */
.blog-layout{display:grid;grid-template-columns:1fr 360px;gap:40px;align-items:start;}

/* ---- Blog post ---- */
.post-hero{max-width:760px;margin:0 auto;padding-bottom:36px;text-align:center;}
.post-hero h1{font-size:40px;margin-top:14px;}
.post-byline{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--slate);font-size:15px;margin-top:16px;flex-wrap:wrap;}
.post-byline .av{width:32px;height:32px;border-radius:50%;background:var(--gradient-teal);color:#fff;display:grid;place-items:center;font-family:var(--font-head);font-weight:700;font-size:14px;}
.dot2{width:4px;height:4px;border-radius:50%;background:var(--muted);display:inline-block;}
.post-feat{height:400px;border-radius:var(--r-xl);overflow:hidden;margin-top:0;}
.post-wrap{max-width:1100px;display:grid;grid-template-columns:1fr 320px;gap:52px;align-items:start;margin-top:0;}
.prose{font-size:17px;line-height:1.75;color:var(--ink-2);}
.prose h2{font-size:27px;margin:40px 0 14px;color:var(--ink);}
.prose p{margin:0 0 20px;}
.prose ul{padding-left:0;list-style:none;display:flex;flex-direction:column;gap:10px;margin:0 0 20px;}
.prose ul li{display:flex;gap:10px;align-items:flex-start;}
.prose ul li svg{flex:none;margin-top:3px;color:var(--green);}
.prose blockquote{border-left:4px solid var(--brand);margin:28px 0;padding:16px 24px;background:var(--teal-50);border-radius:0 var(--r-md) var(--r-md) 0;font-style:italic;color:var(--ink-2);}
.share-bar{display:flex;align-items:center;gap:12px;padding:24px 0;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);margin:36px 0;font-family:var(--font-head);font-weight:600;font-size:14px;color:var(--slate);}
.share-bar a{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);display:grid;place-items:center;color:var(--slate);transition:.18s;}
.share-bar a:hover{color:var(--brand);border-color:var(--brand);}
.share-bar svg{width:18px;height:18px;}
.related{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:16px;}

/* ---- Search form ---- */
.search-box{display:flex;gap:8px;margin-top:6px;}
.search-box input{flex:1;padding:10px 14px;border:1.5px solid var(--line);border-radius:var(--r-pill);font-family:var(--font-body);font-size:15px;}
.search-box input:focus{outline:none;border-color:var(--brand);}
.search-box button{width:40px;height:40px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;}
.search-box svg{width:17px;height:17px;}

/* ---- Responsive ---- */
@media(max-width:980px){
  #arch-grid{grid-template-columns:repeat(2,1fr);}
  #lc-grid{grid-template-columns:repeat(2,1fr);}
  .contact-grid{grid-template-columns:1fr;}
  .blog-layout{grid-template-columns:1fr;}
  .post-wrap{grid-template-columns:1fr;}
  .related{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:640px){
  #arch-grid{grid-template-columns:1fr;}
  #lc-grid{grid-template-columns:1fr;}
  .arch-filters{padding:16px 18px; gap:12px;}
  .arch-filters select{min-width:0;width:100%;}
  .arch-filters .fg{width:100%;}
  .form-row{grid-template-columns:1fr;}
  .form-card{padding:22px 18px;}
  .related{grid-template-columns:1fr;}
  .post-hero h1{font-size:26px;}
  .post-feat{height:200px;}
  .blog-layout{gap:28px;}
  .prose{font-size:16px;}
  .prose h2{font-size:22px;}
}