/*
Theme Name:   Prime Student Residence
Theme URI:    https://primestudentresidence.co.za
Description:  Custom child theme for Prime Student Residence – Pretoria, South Africa.
Author:       Prime Student Residence
Author URI:   https://primestudentresidence.co.za
Template:     twentytwentyfour
Version:      1.0.0
Text Domain:  prime-student-residence
*/

/* =====================================================
   BRAND COLOURS & VARIABLES
   ===================================================== */
:root {
  --jade-dark:   #2c6b6b;
  --jade-mid:    #3d9a8a;
  --jade-light:  #7ec8c0;
  --jade-pale:   #b2deda;
  --white:       #ffffff;
  --off-white:   #f7f9f9;
  --dark-bg:     #1a2a2a;
  --text-dark:   #1e2d2d;
  --text-mid:    #4a5f5f;
  --text-light:  #7a9494;
  --font-main:   'Cormorant Garamond', Georgia, serif;
  --font-body:   'Inter', 'Segoe UI', sans-serif;
  --font-accent: 'Montserrat', sans-serif;
  --transition:  0.3s ease;
  --radius:      4px;
  --shadow:      0 4px 24px rgba(44,107,107,0.12);
  --shadow-lg:   0 8px 48px rgba(44,107,107,0.18);
}

/* =====================================================
   RESET & BASE
   ===================================================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  font-family: var(--font-body);
  color: var(--text-dark);
  background: var(--white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--jade-mid); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--jade-dark); }
h1, h2, h3, h4, h5 { font-family: var(--font-main); line-height: 1.15; color: var(--text-dark); }
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
section { padding: 100px 0; }

/* BUTTONS */
.btn { display:inline-block; padding:14px 32px; border-radius:var(--radius); font-family:var(--font-accent); font-size:0.85rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; cursor:pointer; border:2px solid transparent; transition:all var(--transition); }
.btn-primary { background:var(--jade-mid); color:var(--white); border-color:var(--jade-mid); }
.btn-primary:hover { background:var(--jade-dark); border-color:var(--jade-dark); color:var(--white); }
.btn-outline { background:transparent; color:var(--jade-mid); border-color:var(--jade-mid); }
.btn-outline:hover { background:var(--jade-mid); color:var(--white); }
.btn-white { background:var(--white); color:var(--jade-dark); border-color:var(--white); }
.btn-white:hover { background:transparent; color:var(--white); border-color:var(--white); }

/* NAVIGATION */
#prime-nav { position:fixed; top:0; left:0; right:0; z-index:1000; padding:0 40px; height:72px; display:flex; align-items:center; justify-content:space-between; background:transparent; transition:background var(--transition),box-shadow var(--transition); }
#prime-nav.scrolled { background:rgba(26,42,42,0.97); backdrop-filter:blur(8px); box-shadow:0 2px 24px rgba(0,0,0,0.2); }
.nav-logo img { height:44px; width:auto; }
.nav-links { display:flex; align-items:center; gap:36px; list-style:none; }
.nav-links a { color:rgba(255,255,255,0.85); font-family:var(--font-accent); font-size:0.78rem; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; }
.nav-links a:hover { color:var(--white); }
.nav-cta { background:var(--jade-mid) !important; color:var(--white) !important; padding:10px 22px; border-radius:var(--radius); font-family:var(--font-accent); font-size:0.78rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; }
.nav-cta:hover { background:var(--jade-dark) !important; }
.nav-hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:4px; }
.nav-hamburger span { display:block; width:26px; height:2px; background:var(--white); border-radius:2px; transition:all var(--transition); }

/* HERO */
#hero { position:relative; min-height:100vh; display:flex; align-items:center; overflow:hidden; background:var(--dark-bg); }
.hero-bg { position:absolute; inset:0; background-image:url('assets/images/hero-bg.jpg'); background-size:cover; background-position:center; opacity:0.45; }
.hero-content { position:relative; z-index:2; padding:160px 0 100px; }
.hero-eyebrow { font-family:var(--font-accent); font-size:0.72rem; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--jade-light); margin-bottom:20px; }
.hero-headline { font-family:var(--font-accent); font-size:clamp(3rem,7vw,6rem); font-weight:700; color:var(--white); line-height:1.0; text-transform:uppercase; margin-bottom:8px; }
.hero-headline .accent { color:var(--jade-light); }
.hero-sub { font-size:1.05rem; color:rgba(255,255,255,0.72); max-width:460px; margin-bottom:48px; line-height:1.7; }
.hero-actions { display:flex; gap:16px; flex-wrap:wrap; }

/* RESIDENCES SECTION */
#residences { background:var(--white); padding:120px 0; }
.section-eyebrow { font-family:var(--font-accent); font-size:0.7rem; font-weight:600; letter-spacing:0.22em; text-transform:uppercase; color:var(--jade-mid); margin-bottom:12px; }
.section-title { font-family:var(--font-main); font-size:clamp(2.4rem,4vw,3.6rem); font-weight:400; color:var(--text-dark); margin-bottom:16px; }
.section-divider { width:48px; height:2px; background:var(--jade-mid); margin:0 0 60px 0; }
.residences-layout { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start; }
.residence-item { display:flex; align-items:center; justify-content:space-between; padding:28px 0; border-bottom:1px solid rgba(44,107,107,0.12); gap:24px; }
.residence-item:first-child { border-top:1px solid rgba(44,107,107,0.12); }
.residence-meta { font-family:var(--font-accent); font-size:0.65rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-light); margin-bottom:6px; }
.residence-name { font-family:var(--font-main); font-size:1.55rem; font-weight:400; color:var(--text-dark); }
.rooms-number { font-family:var(--font-main); font-size:2.4rem; font-weight:600; color:var(--jade-dark); line-height:1; }
.rooms-label { font-family:var(--font-accent); font-size:0.6rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-light); }
.total-number { font-family:var(--font-main); font-size:5rem; font-weight:600; color:var(--jade-dark); line-height:1; }
.total-label { font-family:var(--font-accent); font-size:0.72rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-mid); line-height:1.5; }
.residences-total { display:flex; align-items:baseline; gap:12px; margin-top:40px; padding-top:32px; border-top:2px solid var(--jade-mid); }
.residences-image img { width:100%; height:480px; object-fit:cover; border-radius:var(--radius); box-shadow:var(--shadow-lg); }

/* HORIZON SECTION */
#horizon { background:var(--dark-bg); padding:120px 0; position:relative; overflow:hidden; }
.horizon-layout { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; position:relative; z-index:2; }
#horizon .section-eyebrow { color:var(--jade-light); }
#horizon .section-title { color:var(--white); }
#horizon .section-title .accent { color:var(--jade-light); }
#horizon .section-divider { background:var(--jade-light); }
.horizon-intro { color:rgba(255,255,255,0.65); font-size:0.95rem; line-height:1.8; max-width:420px; margin-bottom:48px; }
.horizon-item { display:flex; justify-content:space-between; align-items:center; padding:28px 0; border-bottom:1px solid rgba(126,200,192,0.15); }
.horizon-item:first-child { border-top:1px solid rgba(126,200,192,0.15); }
.horizon-address { font-family:var(--font-main); font-size:1.8rem; color:var(--white); }
.horizon-rooms-number { font-family:var(--font-main); font-size:3rem; font-weight:700; color:var(--jade-light); line-height:1; }
.horizon-rooms-label { font-family:var(--font-accent); font-size:0.6rem; letter-spacing:0.15em; text-transform:uppercase; color:rgba(255,255,255,0.4); }
.horizon-total { margin-top:48px; padding:32px; border:1px solid rgba(126,200,192,0.2); border-radius:var(--radius); display:flex; align-items:baseline; gap:12px; }
.horizon-total-number { font-family:var(--font-main); font-size:4.5rem; font-weight:700; color:var(--jade-light); line-height:1; }
.horizon-total-label { font-family:var(--font-accent); font-size:0.7rem; letter-spacing:0.15em; text-transform:uppercase; color:rgba(255,255,255,0.5); line-height:1.6; }
.horizon-building-card { background:rgba(126,200,192,0.06); border:1px solid rgba(126,200,192,0.2); border-radius:8px; padding:40px; width:100%; text-align:center; }
.horizon-year { font-family:var(--font-accent); font-size:5rem; font-weight:800; color:rgba(126,200,192,0.25); line-height:1; margin-bottom:16px; }
.horizon-year span { color:var(--jade-light); }
.horizon-tagline { font-family:var(--font-main); font-size:1.5rem; color:var(--white); margin-bottom:12px; }
.horizon-desc { font-size:0.88rem; color:rgba(255,255,255,0.5); line-height:1.7; }

/* PORTAL SECTION */
#portal { background:var(--off-white); padding:120px 0; }
.portal-layout { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start; }
.portal-steps { list-style:none; margin-top:32px; }
.portal-step { display:flex; align-items:flex-start; gap:20px; padding:16px 0; }
.step-icon { width:36px; height:36px; background:var(--jade-mid); border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:2px; }
.step-icon svg { width:16px; height:16px; fill:var(--white); }
.step-text { font-size:0.92rem; color:var(--text-mid); line-height:1.6; }
.step-text strong { color:var(--text-dark); font-weight:600; }
.ticket-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.ticket-card { background:var(--white); border-radius:8px; padding:24px; display:flex; flex-direction:column; align-items:center; gap:12px; box-shadow:0 2px 12px rgba(44,107,107,0.08); cursor:pointer; transition:transform var(--transition),box-shadow var(--transition); border:2px solid transparent; }
.ticket-card:hover { transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--jade-light); }
.ticket-icon { width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center; }
.ticket-icon.electrical { background:#fff3e0; }
.ticket-icon.plumbing { background:#e3f2fd; }
.ticket-icon.general { background:#f3e5f5; }
.ticket-icon.floor { background:#e8f5e9; }
.ticket-icon.security { background:#fce4ec; }
.ticket-icon svg { width:24px; height:24px; }
.ticket-card-label { font-family:var(--font-accent); font-size:0.68rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-mid); }
.ticket-response { font-family:var(--font-accent); font-size:0.65rem; letter-spacing:0.08em; color:var(--text-light); margin-top:24px; }
.ticket-response strong { color:var(--jade-mid); }

/* PROBLEMS CTA */
#problems-cta { background:var(--dark-bg); padding:100px 0; text-align:center; }
.problems-headline { font-family:var(--font-accent); font-size:clamp(2.4rem,5vw,4rem); font-weight:800; color:var(--white); text-transform:uppercase; line-height:1.05; }
.problems-headline .accent { color:var(--jade-light); }

/* FOOTER */
#prime-footer { background:#111f1f; padding:64px 0 40px; color:rgba(255,255,255,0.55); }
.footer-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:60px; padding-bottom:48px; border-bottom:1px solid rgba(255,255,255,0.08); }
.footer-col-title { font-family:var(--font-accent); font-size:0.65rem; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:rgba(255,255,255,0.3); margin-bottom:20px; }
.footer-contact p, .footer-locations p { font-size:0.88rem; line-height:1.9; color:rgba(255,255,255,0.55); }
.footer-contact a { color:var(--jade-light); }
.footer-links { list-style:none; }
.footer-links li { margin-bottom:10px; }
.footer-links a { color:rgba(255,255,255,0.55); font-size:0.88rem; }
.footer-links a:hover { color:var(--jade-light); }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; padding-top:32px; font-size:0.78rem; }
.footer-logo img { height:36px; opacity:0.7; }

/* AUTH FORMS */
.prime-auth-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; background:var(--off-white); padding:120px 24px 60px; }
.prime-auth-box { background:var(--white); border-radius:12px; box-shadow:var(--shadow-lg); padding:56px 48px; width:100%; max-width:500px; }
.prime-auth-logo { text-align:center; margin-bottom:32px; }
.prime-auth-logo img { height:52px; margin:0 auto; }
.prime-auth-title { font-family:var(--font-main); font-size:2rem; text-align:center; margin-bottom:8px; }
.prime-auth-sub { text-align:center; color:var(--text-mid); font-size:0.9rem; margin-bottom:36px; }
.prime-form-group { margin-bottom:20px; }
.prime-form-group label { display:block; font-family:var(--font-accent); font-size:0.72rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-mid); margin-bottom:8px; }
.prime-form-group input, .prime-form-group select, .prime-form-group textarea { width:100%; padding:13px 16px; border:1.5px solid rgba(44,107,107,0.2); border-radius:var(--radius); font-size:0.95rem; font-family:var(--font-body); color:var(--text-dark); background:var(--white); transition:border-color var(--transition),box-shadow var(--transition); outline:none; }
.prime-form-group input:focus, .prime-form-group select:focus, .prime-form-group textarea:focus { border-color:var(--jade-mid); box-shadow:0 0 0 3px rgba(61,154,138,0.1); }
.prime-form-group .prime-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.prime-form-submit { width:100%; margin-top:8px; }
.prime-form-message { padding:12px 16px; border-radius:var(--radius); font-size:0.88rem; margin-bottom:20px; display:none; }
.prime-form-message.success { background:rgba(61,154,138,0.1); color:var(--jade-dark); border:1px solid rgba(61,154,138,0.3); display:block; }
.prime-form-message.error { background:rgba(220,53,69,0.08); color:#c53030; border:1px solid rgba(220,53,69,0.2); display:block; }
.prime-auth-switch { text-align:center; margin-top:24px; font-size:0.88rem; color:var(--text-mid); }
.prime-auth-switch a { color:var(--jade-mid); font-weight:600; }

/* DASHBOARD */
.prime-dashboard-wrap { min-height:100vh; background:var(--off-white); padding:100px 24px 60px; }
.prime-dashboard-header { background:var(--white); border-radius:8px; padding:32px 40px; margin-bottom:32px; display:flex; justify-content:space-between; align-items:center; box-shadow:0 2px 8px rgba(44,107,107,0.06); }
.prime-dashboard-title { font-family:var(--font-main); font-size:1.8rem; color:var(--text-dark); }
.prime-dashboard-title span { color:var(--jade-mid); }
.prime-dashboard-meta { font-size:0.85rem; color:var(--text-light); margin-top:4px; }
.prime-dashboard-grid { display:grid; grid-template-columns:1fr 2fr; gap:28px; }
.prime-card { background:var(--white); border-radius:8px; padding:32px; box-shadow:0 2px 8px rgba(44,107,107,0.06); }
.prime-card-title { font-family:var(--font-accent); font-size:0.7rem; font-weight:700; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-mid); margin-bottom:20px; padding-bottom:16px; border-bottom:2px solid var(--off-white); }
.prime-stat { display:flex; align-items:center; gap:16px; padding:16px 0; border-bottom:1px solid var(--off-white); }
.prime-stat:last-child { border:none; }
.prime-stat-icon { width:42px; height:42px; border-radius:10px; background:rgba(61,154,138,0.1); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.prime-stat-icon svg { width:20px; height:20px; fill:var(--jade-mid); }
.prime-stat-value { font-family:var(--font-main); font-size:1.6rem; font-weight:600; color:var(--text-dark); line-height:1; }
.prime-stat-label { font-size:0.8rem; color:var(--text-light); }
.prime-ticket-table { width:100%; border-collapse:collapse; }
.prime-ticket-table th { text-align:left; font-family:var(--font-accent); font-size:0.65rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-light); padding:0 16px 12px; border-bottom:2px solid var(--off-white); }
.prime-ticket-table td { padding:16px; font-size:0.88rem; color:var(--text-mid); border-bottom:1px solid var(--off-white); vertical-align:middle; }
.prime-ticket-table tr:last-child td { border:none; }
.ticket-number { font-family:var(--font-accent); font-weight:700; color:var(--jade-dark); }
.status-badge { display:inline-block; padding:4px 12px; border-radius:20px; font-family:var(--font-accent); font-size:0.65rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; }
.status-open { background:#fff3cd; color:#856404; }
.status-in_progress { background:#cce5ff; color:#004085; }
.status-closed { background:#d4edda; color:#155724; }

/* RESPONSIVE */
@media (max-width:1024px) {
  .residences-layout, .horizon-layout, .portal-layout { grid-template-columns:1fr; gap:48px; }
  .residences-image { display:none; }
}
@media (max-width:768px) {
  section { padding:72px 0; }
  #prime-nav { padding:0 20px; }
  .nav-links { display:none; }
  .nav-hamburger { display:flex; }
  .footer-grid { grid-template-columns:1fr; gap:32px; }
  .prime-auth-box { padding:40px 28px; }
  .prime-dashboard-grid { grid-template-columns:1fr; }
  .prime-dashboard-header { flex-direction:column; align-items:flex-start; gap:12px; }
  .prime-form-group .prime-row { grid-template-columns:1fr; }
}
