/* ═══════════════════════════════════════════════════════════════════════
   UP Basic Teacher Portal — main.css v2.0
   Mobile-first, fixed drawer, proper icon ratios
═══════════════════════════════════════════════════════════════════════ */

/* ── CSS Variables ─────────────────────────────────────────────────── */
:root{
  --navy:#0D2C54;--blue:#1E88E5;--blue-lt:#42A5F5;--blue-dk:#1565C0;
  --emerald:#43A047;--saffron:#FF9800;--red:#E53935;--purple:#673AB7;
  --teal:#009688;--amber:#F59E0B;--cyan:#00BCD4;
  --pearl:#F5F7FA;--smoke:#EEF1F6;--silver:#CBD5E0;--slate:#718096;
  --ink:#2D3748;--midnight:#1A202C;
  --glass:rgba(255,255,255,.75);--glass-bd:rgba(255,255,255,.5);
  --sh-sm:0 1px 3px rgba(0,0,0,.08);--sh-md:0 4px 16px rgba(0,0,0,.08);
  --sh-lg:0 8px 32px rgba(0,0,0,.12);--sh-blue:0 8px 24px rgba(30,136,229,.28);
  --r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-pill:999px;
  --ease:cubic-bezier(.4,0,.2,1);--t:.25s;
  --fh:'Poppins',sans-serif;--fb:'Inter',sans-serif;--fd:'Noto Sans Devanagari',sans-serif;
  --max-w:1260px;--sidebar-w:300px;
  --mob-nav-h:58px;--navbar-h:62px;
}
[data-theme=dark]{
  --pearl:#0F172A;--smoke:#1E293B;--silver:#334155;--slate:#94A3B8;
  --ink:#E2E8F0;--midnight:#F8FAFC;
  --glass:rgba(15,23,42,.9);--glass-bd:rgba(255,255,255,.08);
}

/* ── Reset ─────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px;-webkit-tap-highlight-color:transparent;overflow-x:hidden;width:100%}
body{font-family:var(--fb);background:var(--pearl);color:var(--ink);
     overflow-x:hidden;line-height:1.6;transition:background .3s,color .3s;
     padding-bottom:var(--mob-nav-h);width:100%;max-width:100vw;position:relative}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%;height:auto}
ul,ol{list-style:none}
button{cursor:pointer;border:none;background:none;font-family:inherit}

/* ── Scrollbar ─────────────────────────────────────────────────────── */
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-thumb{background:var(--blue);border-radius:var(--r-pill)}

/* ── Skip link ─────────────────────────────────────────────────────── */
.skip-link{position:absolute;top:-100%;left:0;padding:8px 16px;
           background:var(--blue);color:#fff;border-radius:0 0 var(--r-sm) 0;
           font-size:.82rem;font-weight:700;z-index:10000}
.skip-link:focus{top:0}

/* ── Progress bar ──────────────────────────────────────────────────── */
.upbt-progress-bar{position:fixed;top:0;left:0;height:3px;
                   background:linear-gradient(90deg,var(--blue),var(--saffron));
                   z-index:9999;width:0;transition:width .1s;pointer-events:none}

/* ── Container ─────────────────────────────────────────────────────── */
.upbt-container{max-width:var(--max-w);margin:0 auto;padding:0 16px}
@media(min-width:640px){.upbt-container{padding:0 20px}}

/* ── TOPBAR (desktop only) ─────────────────────────────────────────── */
.topbar{background:var(--navy);border-bottom:2px solid var(--saffron);padding:5px 0;display:none}
@media(min-width:769px){.topbar{display:block}}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:12px}
.tb-brand{color:rgba(255,255,255,.85);font-size:.72rem;font-family:var(--fd);
          font-weight:600;display:flex;align-items:center;gap:6px}
.tb-links{display:flex;gap:12px;align-items:center}
.tb-links a{font-size:.72rem;color:rgba(255,255,255,.6);transition:color var(--t)}
.tb-links a:hover{color:var(--saffron)}

/* ── TICKER ────────────────────────────────────────────────────────── */
.upbt-ticker{background:var(--red);display:flex;align-items:center;height:34px;overflow:hidden}
.ticker-label{background:rgba(0,0,0,.2);color:#fff;font-size:.7rem;font-weight:700;
              padding:0 12px;height:100%;display:flex;align-items:center;gap:5px;
              white-space:nowrap;font-family:var(--fd);flex-shrink:0;letter-spacing:.05em}
.ticker-track{flex:1;overflow:hidden}
.ticker-scroll{display:flex;white-space:nowrap;animation:upbt-ticker 40s linear infinite}
.ticker-scroll:hover{animation-play-state:paused}
.ticker-item{color:#fff;font-family:var(--fd);font-size:.76rem;
             padding:0 20px;display:inline-flex;align-items:center;gap:5px}
.ticker-item::before{content:'●';font-size:.4rem;opacity:.7}
@keyframes upbt-ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ── NAVBAR ────────────────────────────────────────────────────────── */
.navbar{position:sticky;top:0;z-index:900;
        background:var(--glass);backdrop-filter:blur(20px) saturate(180%);
        -webkit-backdrop-filter:blur(20px);
        border-bottom:1px solid var(--glass-bd);box-shadow:var(--sh-sm);
        transition:box-shadow var(--t)}
.navbar.scrolled{box-shadow:var(--sh-md)}
.navbar-inner{display:flex;align-items:center;justify-content:space-between;
              height:var(--navbar-h);gap:8px}

/* Logo */
.logo{display:flex;align-items:center;gap:10px;flex-shrink:0;text-decoration:none}
.logo-icon{width:38px;height:38px;background:linear-gradient(135deg,var(--blue),var(--navy));
           border-radius:var(--r-sm);display:grid;place-items:center;
           color:#fff;font-size:1.1rem;box-shadow:var(--sh-blue);flex-shrink:0}
.logo-text{line-height:1.2}
.logo-t{font-family:var(--fh);font-weight:800;font-size:.92rem;
        color:var(--navy);letter-spacing:-.02em}
.logo-s{font-size:.58rem;color:var(--slate);font-family:var(--fb)}
[data-theme=dark] .logo-t{color:var(--ink)}

/* Desktop nav links */
.nav-links{display:none;align-items:center;gap:2px}
@media(min-width:1025px){.nav-links{display:flex}}
.nav-links a{padding:6px 10px;border-radius:var(--r-sm);font-size:.8rem;
             font-weight:500;color:var(--ink);transition:all var(--t);
             white-space:nowrap;text-decoration:none}
.nav-links a:hover,.nav-links a.active{background:rgba(30,136,229,.1);color:var(--blue)}

/* Nav actions */
.nav-acts{display:flex;align-items:center;gap:6px}

/* Icon buttons — SQUARE, consistent size */
.ic-btn{width:38px;height:38px;border-radius:var(--r-pill);
        background:var(--smoke);color:var(--slate);
        display:grid;place-items:center;font-size:.9rem;
        transition:all .15s;border:1px solid transparent;
        cursor:pointer;text-decoration:none;position:relative;
        flex-shrink:0}
.ic-btn:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
.ic-btn i{line-height:1;display:block;text-align:center}

/* Notification badge */
.nav-badge{position:absolute;top:2px;right:2px;min-width:16px;height:16px;
           background:var(--red);border-radius:var(--r-pill);font-size:.52rem;
           font-weight:700;color:#fff;display:grid;place-items:center;
           border:2px solid var(--glass);padding:0 3px}

/* User button */
.btn-login{display:inline-flex;align-items:center;gap:7px;padding:8px 16px;
           background:linear-gradient(135deg,var(--blue),var(--blue-dk));
           color:#fff;border-radius:var(--r-pill);font-size:.8rem;
           font-weight:700;box-shadow:var(--sh-blue);transition:all var(--t);
           font-family:var(--fd);text-decoration:none;white-space:nowrap;flex-shrink:0}
.btn-login:hover{transform:translateY(-1px);color:#fff}
.nav-avatar{width:22px;height:22px;border-radius:50%;
            background:rgba(255,255,255,.25);display:grid;
            place-items:center;font-size:.62rem;font-weight:800;
            font-family:var(--fh);flex-shrink:0}
.nav-user-name{display:none}
@media(min-width:480px){.nav-user-name{display:inline}}

/* Hamburger — shown on mobile */
.ham{display:flex;flex-direction:column;gap:5px;width:38px;height:38px;
     align-items:center;justify-content:center;border-radius:var(--r-sm);
     background:var(--smoke);cursor:pointer;border:none;flex-shrink:0}
.ham span{display:block;width:20px;height:2px;background:var(--ink);
          border-radius:2px;transition:all .25s}
@media(min-width:1025px){.ham{display:none}}

/* ── SEARCH OVERLAY ─────────────────────────────────────────────────── */
.search-overlay{position:fixed;inset:0;background:rgba(13,44,84,.85);
                backdrop-filter:blur(12px);z-index:950;
                display:flex;align-items:flex-start;justify-content:center;
                padding-top:80px;opacity:0;pointer-events:none;transition:opacity var(--t)}
.search-overlay.open{opacity:1;pointer-events:all}
.search-box{background:#fff;border-radius:var(--r-xl);width:100%;max-width:620px;
            margin:0 16px;box-shadow:0 20px 60px rgba(0,0,0,.25);overflow:hidden;
            transform:translateY(-20px);transition:transform var(--t)}
.search-overlay.open .search-box{transform:translateY(0)}
.search-input-wrap{display:flex;align-items:center;gap:12px;
                   padding:16px 20px;border-bottom:1px solid var(--smoke)}
.search-input-wrap>i{color:var(--blue);font-size:1rem;flex-shrink:0}
.search-input{flex:1;border:none;outline:none;font-size:1rem;
              font-family:var(--fd);color:var(--ink);background:transparent;width:100%}
.search-suggestions{padding:8px;max-height:320px;overflow-y:auto}
.search-result-item{display:flex;flex-direction:column;gap:2px;padding:9px 10px;
                    border-radius:var(--r-md);text-decoration:none;transition:background .15s}
.search-result-item:hover{background:rgba(30,136,229,.06)}
.sri-type{font-size:.62rem;font-weight:700;color:var(--blue);
          text-transform:uppercase;letter-spacing:.06em}
.sri-title{font-family:var(--fd);font-size:.84rem;font-weight:600;color:var(--ink)}
.sri-date{font-size:.67rem;color:var(--slate);font-family:var(--fd)}
.search-close{position:absolute;top:16px;right:20px;color:rgba(255,255,255,.7);
              font-size:1.3rem;cursor:pointer;background:none;border:none}

/* ── MOBILE DRAWER — LEFT SIDE ──────────────────────────────────────── */
.m-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:998;
           opacity:0;pointer-events:none;transition:opacity .28s;
           backdrop-filter:blur(2px)}
.m-overlay.open{opacity:1;pointer-events:all}

/* Drawer slides in from LEFT */
.m-drawer{position:fixed;top:0;left:-100%;bottom:0;
          width:min(300px,82vw);
          background:var(--pearl);
          z-index:999;overflow-y:auto;overflow-x:hidden;
          transition:left .35s var(--ease);
          box-shadow:6px 0 32px rgba(0,0,0,.18);
          display:flex;flex-direction:column}
.m-drawer.open{left:0}
[data-theme=dark] .m-drawer{background:#0F172A;border-right:1px solid #1E293B}

/* Drawer header */
.m-drawer-head{display:flex;align-items:center;justify-content:space-between;
               padding:16px 16px 12px;border-bottom:1px solid var(--smoke);
               background:linear-gradient(135deg,var(--navy),var(--blue-dk));flex-shrink:0}
.m-drawer-head .logo-t{color:#fff !important}
.m-drawer-head .logo-s{color:rgba(255,255,255,.6) !important}
.m-drawer-head .logo-icon{background:rgba(255,255,255,.15);box-shadow:none}
.m-close{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
         color:rgba(255,255,255,.8);cursor:pointer;background:rgba(255,255,255,.1);
         border:1px solid rgba(255,255,255,.2);font-size:.9rem;flex-shrink:0;
         transition:all .15s}
.m-close:hover{background:rgba(255,255,255,.2);color:#fff}

/* User card in drawer */
.m-user-card{display:flex;align-items:center;gap:12px;
             padding:14px 16px;background:linear-gradient(135deg,rgba(30,136,229,.08),rgba(13,44,84,.05));
             border-bottom:1px solid var(--smoke);flex-shrink:0}
.m-user-av{width:42px;height:42px;border-radius:50%;flex-shrink:0;
           background:linear-gradient(135deg,var(--blue),var(--blue-dk));
           display:grid;place-items:center;color:#fff;
           font-family:var(--fh);font-size:.85rem;font-weight:800}
.m-user-name{font-family:var(--fh);font-size:.88rem;font-weight:700;color:var(--midnight)}
.m-user-sub{font-family:var(--fd);font-size:.68rem;color:var(--slate);margin-top:2px}
[data-theme=dark] .m-user-name{color:var(--ink)}

/* Nav links */
.m-links{flex:1;padding:8px 10px;display:flex;flex-direction:column;gap:2px;overflow-y:auto}
.m-nav-link{display:flex;align-items:center;gap:12px;padding:11px 12px;
            border-radius:var(--r-md);font-family:var(--fd);font-size:.88rem;
            font-weight:500;color:var(--ink);transition:all .15s;text-decoration:none;
            position:relative;min-height:44px} /* min touch target */
.m-nav-link:hover{background:rgba(30,136,229,.08);color:var(--blue)}
.m-nav-active{background:rgba(30,136,229,.1);color:var(--blue);font-weight:700}
.m-nav-active:hover{background:rgba(30,136,229,.15)}

/* Nav icon — square, consistent ratio */
.m-nav-icon{width:34px;height:34px;border-radius:var(--r-sm);
            background:var(--smoke);display:grid;place-items:center;
            font-size:.88rem;flex-shrink:0;transition:all .15s}
.m-nav-link:hover .m-nav-icon,
.m-nav-active .m-nav-icon{background:rgba(30,136,229,.15);color:var(--blue)}
.m-nav-label{flex:1;line-height:1.2}
.m-nav-dot{width:7px;height:7px;background:var(--blue);border-radius:50%;flex-shrink:0}

/* Drawer footer */
.m-drawer-foot{padding:12px 10px;border-top:1px solid var(--smoke);
               display:flex;flex-direction:column;gap:6px;flex-shrink:0}
.m-theme-btn{display:flex;align-items:center;gap:10px;padding:10px 12px;
             border-radius:var(--r-md);font-family:var(--fd);font-size:.84rem;
             color:var(--slate);background:var(--smoke);border:none;cursor:pointer;
             width:100%;text-align:left;transition:all .15s}
.m-theme-btn:hover{background:rgba(30,136,229,.08);color:var(--blue)}
.m-logout-btn,.m-login-btn{display:flex;align-items:center;gap:10px;padding:10px 12px;
                            border-radius:var(--r-md);font-family:var(--fd);
                            font-size:.84rem;font-weight:600;text-decoration:none;
                            transition:all .15s;width:100%}
.m-logout-btn{color:var(--red);background:rgba(229,57,53,.06)}
.m-logout-btn:hover{background:rgba(229,57,53,.1)}
.m-login-btn{color:#fff;background:linear-gradient(135deg,var(--blue),var(--blue-dk));
             justify-content:center}

/* ── TOAST ──────────────────────────────────────────────────────────── */
.upbt-toast-c{position:fixed;bottom:calc(var(--mob-nav-h) + 12px);left:50%;
              transform:translateX(-50%);z-index:9000;
              display:flex;flex-direction:column;gap:7px;align-items:center;pointer-events:none}
.upbt-toast{padding:9px 20px;background:var(--navy);color:#fff;border-radius:var(--r-pill);
            font-size:.82rem;font-family:var(--fd);box-shadow:var(--sh-lg);
            opacity:0;transform:translateY(10px);transition:all .28s;
            white-space:nowrap;pointer-events:all}
.upbt-toast.show{opacity:1;transform:translateY(0)}

/* ── BUTTONS ────────────────────────────────────────────────────────── */
.upbt-btn{display:inline-flex;align-items:center;justify-content:center;
          gap:7px;padding:10px 22px;border-radius:var(--r-pill);
          font-family:var(--fd);font-size:.88rem;font-weight:700;
          transition:all var(--t) var(--ease);cursor:pointer;border:none;
          text-decoration:none;line-height:1}
.upbt-btn-primary{background:linear-gradient(135deg,var(--blue),var(--blue-dk));
                  color:#fff;box-shadow:var(--sh-blue)}
.upbt-btn-primary:hover{transform:translateY(-2px);
                         box-shadow:0 12px 28px rgba(30,136,229,.4);color:#fff}
.upbt-btn-secondary{background:transparent;border:1.5px solid var(--silver);color:var(--ink)}
.upbt-btn-secondary:hover{border-color:var(--blue);color:var(--blue)}

/* ── CARD + BADGE ───────────────────────────────────────────────────── */
.upbt-card{background:var(--glass);backdrop-filter:blur(12px);
           border:1px solid var(--glass-bd);border-radius:var(--r-xl);
           box-shadow:var(--sh-sm);transition:all var(--t) var(--ease)}
.upbt-card:hover{box-shadow:var(--sh-md)}
.upbt-badge{display:inline-block;padding:2px 9px;border-radius:var(--r-pill);
            font-size:.66rem;font-weight:800;letter-spacing:.04em;
            text-transform:uppercase;font-family:var(--fb)}
.upbt-badge-blue{background:rgba(30,136,229,.12);color:var(--blue)}
.upbt-badge-green{background:rgba(67,160,71,.12);color:var(--emerald)}
.upbt-badge-orange{background:rgba(255,152,0,.12);color:var(--saffron)}
.upbt-badge-red{background:rgba(229,57,53,.1);color:var(--red)}
.upbt-badge-new{background:var(--red);color:#fff}

/* ── SECTIONS ───────────────────────────────────────────────────────── */
.upbt-section{padding:48px 0}
.upbt-section-sm{padding:28px 0}
.upbt-section-header{display:flex;align-items:flex-end;justify-content:space-between;
                     margin-bottom:24px;gap:16px;flex-wrap:wrap}
.upbt-section-title{font-family:var(--fh);font-size:clamp(1.2rem,3vw,1.7rem);
                    font-weight:800;color:var(--midnight);letter-spacing:-.02em;line-height:1.2}
[data-theme=dark] .upbt-section-title{color:var(--ink)}
.section-eyebrow{display:inline-flex;align-items:center;gap:5px;
                 background:rgba(30,136,229,.08);border:1px solid rgba(30,136,229,.14);
                 border-radius:var(--r-pill);padding:3px 10px;font-size:.66rem;
                 font-weight:700;color:var(--blue);font-family:var(--fd);
                 letter-spacing:.06em;text-transform:uppercase;margin-bottom:4px}
.upbt-link-all{font-size:.8rem;font-weight:600;color:var(--blue);
               display:inline-flex;align-items:center;gap:5px;padding:6px 14px;
               border:1.5px solid rgba(30,136,229,.22);border-radius:var(--r-pill);
               white-space:nowrap;transition:all var(--t);text-decoration:none}
.upbt-link-all:hover{background:var(--blue);color:#fff;border-color:var(--blue)}

/* ── SIDEBAR ────────────────────────────────────────────────────────── */
.upbt-content-grid{display:grid;grid-template-columns:1fr var(--sidebar-w);
                   gap:24px;align-items:start}
.upbt-sidebar{position:sticky;top:80px;display:flex;flex-direction:column;gap:16px}
.upbt-sidebar-card{background:var(--glass);backdrop-filter:blur(12px);
                   border:1px solid var(--glass-bd);border-radius:var(--r-xl);
                   padding:18px;box-shadow:var(--sh-sm)}
.upbt-sidebar-title{font-family:var(--fh);font-size:.88rem;font-weight:700;
                    color:var(--midnight);margin-bottom:12px;
                    display:flex;align-items:center;gap:7px}
[data-theme=dark] .upbt-sidebar-title{color:var(--ink)}

/* ── FORMS ──────────────────────────────────────────────────────────── */
.upbt-label{font-size:.74rem;font-weight:700;color:var(--slate);
            margin-bottom:6px;display:block;font-family:var(--fd)}
.upbt-input,input.upbt-input,select.upbt-input,textarea.upbt-input{
  width:100%;padding:10px 14px;border:1.5px solid var(--silver);
  border-radius:var(--r-md);font-family:var(--fd);font-size:.88rem;
  color:var(--ink);background:var(--pearl);outline:none;
  transition:border-color var(--t),box-shadow var(--t)}
.upbt-input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(30,136,229,.1)}
textarea.upbt-input{min-height:100px;resize:vertical;line-height:1.65}

/* ── FLASH ──────────────────────────────────────────────────────────── */
.flash-html{padding:10px 14px;border-radius:var(--r-md);font-family:var(--fd);
            font-size:.84rem;margin-bottom:12px}
.flash-success{background:rgba(67,160,71,.08);border:1px solid rgba(67,160,71,.2);color:var(--emerald)}
.flash-error{background:rgba(229,57,53,.08);border:1px solid rgba(229,57,53,.2);color:var(--red)}

/* ── PAGINATION ─────────────────────────────────────────────────────── */
.upbt-pagination{display:flex;align-items:center;justify-content:center;
                 gap:6px;margin-top:28px;flex-wrap:wrap}
.upbt-page-btn{min-width:36px;height:36px;padding:0 10px;border-radius:var(--r-md);
               background:var(--glass);border:1.5px solid var(--silver);
               font-size:.8rem;font-weight:600;color:var(--slate);cursor:pointer;
               transition:all var(--t);display:inline-flex;align-items:center;
               justify-content:center;text-decoration:none}
.upbt-page-btn:hover{background:rgba(30,136,229,.08);border-color:var(--blue);color:var(--blue)}
.upbt-page-btn.active{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:var(--sh-blue)}

/* ── ENTRY CONTENT (article body) ───────────────────────────────────── */
.entry-content{font-family:var(--fd);font-size:.92rem;line-height:1.85;color:var(--ink)}
.entry-content h2{font-family:var(--fh);font-size:1.2rem;font-weight:800;
                  color:var(--midnight);margin:24px 0 10px}
.entry-content h3{font-family:var(--fh);font-size:1rem;font-weight:700;margin:18px 0 8px}
.entry-content p{margin-bottom:14px}
.entry-content ul,.entry-content ol{margin:10px 0 14px 20px;display:flex;flex-direction:column;gap:4px}
.entry-content ul li{list-style:disc}.entry-content ol li{list-style:decimal}
.entry-content a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.entry-content blockquote{border-left:4px solid var(--saffron);background:var(--smoke);
                           padding:12px 16px;border-radius:0 var(--r-md) var(--r-md) 0;
                           margin:16px 0;font-style:italic;color:var(--slate)}
.entry-content table{width:100%;border-collapse:collapse;margin:16px 0;overflow-x:auto;display:block}
.entry-content table th{background:var(--navy);color:#fff;padding:9px 12px;
                         font-family:var(--fd);font-size:.76rem;font-weight:700;text-align:left}
.entry-content table td{padding:8px 12px;border-bottom:1px solid var(--smoke);font-size:.8rem}

/* ── AD SLOTS ───────────────────────────────────────────────────────── */
.upbt-ad-slot{background:var(--smoke);border:2px dashed var(--silver);
              border-radius:var(--r-lg);display:flex;align-items:center;
              justify-content:center;flex-direction:column;gap:4px;
              color:var(--slate);font-size:.76rem;margin:12px 0}
.upbt-ad-banner{height:90px}.upbt-ad-square{height:250px}.upbt-ad-rect{height:120px}

/* ── FOOTER ─────────────────────────────────────────────────────────── */
.upbt-footer{background:var(--midnight);color:rgba(255,255,255,.7);padding:44px 0 0}
.footer-grid{display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;
             gap:28px;margin-bottom:28px}
.footer-brand .logo-t{color:#fff}.footer-brand .logo-s{opacity:.6}
.footer-desc{font-size:.82rem;color:rgba(255,255,255,.5);line-height:1.65;
             font-family:var(--fd);margin-top:8px;margin-bottom:14px}
.footer-social{display:flex;gap:7px}
.footer-social a{width:32px;height:32px;border-radius:50%;
                 background:rgba(255,255,255,.08);display:grid;
                 place-items:center;color:rgba(255,255,255,.6);
                 font-size:.84rem;transition:all .15s;text-decoration:none}
.footer-social a:hover{background:var(--blue);color:#fff;transform:translateY(-2px)}
.footer-col h4{font-family:var(--fh);font-size:.84rem;font-weight:700;
               color:#fff;margin-bottom:12px}
.footer-col ul{display:flex;flex-direction:column;gap:7px}
.footer-col ul a{font-size:.78rem;color:rgba(255,255,255,.5);
                 font-family:var(--fd);transition:color .15s;text-decoration:none}
.footer-col ul a:hover{color:var(--saffron)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding:16px 0;
               display:flex;align-items:center;justify-content:space-between;
               flex-wrap:wrap;gap:8px}
.footer-copyright{font-size:.74rem;color:rgba(255,255,255,.4);font-family:var(--fd)}

/* ── MOBILE BOTTOM NAV ──────────────────────────────────────────────── */
.upbt-mob-nav{display:none;position:fixed;bottom:0;left:0;right:0;
              z-index:850;background:var(--glass);backdrop-filter:blur(20px);
              border-top:1px solid var(--glass-bd);
              height:var(--mob-nav-h);box-shadow:0 -4px 16px rgba(0,0,0,.08)}
.upbt-mob-nav-items{display:flex;height:100%}
.upbt-mob-nav-item{display:flex;flex-direction:column;align-items:center;
                   justify-content:center;gap:3px;flex:1;padding:6px 4px;
                   color:var(--slate);font-size:.58rem;font-family:var(--fd);
                   font-weight:500;text-decoration:none;transition:color var(--t);
                   min-width:0}
.upbt-mob-nav-item.active,.upbt-mob-nav-item:hover{color:var(--blue)}
/* Icon in mobile nav — square consistent size */
.upbt-mob-nav-item i{font-size:1.1rem;line-height:1;display:block;width:24px;
                     height:24px;display:flex;align-items:center;justify-content:center}
.upbt-mob-nav-item span{font-size:.57rem;white-space:nowrap;overflow:hidden;
                        text-overflow:ellipsis;max-width:52px;text-align:center}

/* ── FABs ───────────────────────────────────────────────────────────── */
.upbt-fab-group{position:fixed;bottom:calc(var(--mob-nav-h) + 10px);right:14px;
                z-index:800;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.upbt-fab{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
          font-size:1rem;box-shadow:var(--sh-lg);cursor:pointer;
          transition:all var(--t);border:none;color:#fff;text-decoration:none}
.upbt-fab:hover{transform:scale(1.1)}
.upbt-fab-wa{background:#25D166}.upbt-fab-top{background:var(--blue);font-size:.85rem;opacity:0;pointer-events:none}
.upbt-fab-top.visible{opacity:1;pointer-events:all}

/* ── FADE-UP ANIMATION ──────────────────────────────────────────────── */
.upbt-fade-up{opacity:0;transform:translateY(20px);
              transition:opacity .5s var(--ease),transform .5s var(--ease)}
.upbt-fade-up.visible{opacity:1;transform:translateY(0)}

/* ── RESPONSIVE BREAKPOINTS ─────────────────────────────────────────── */
/* Tablet */
@media(max-width:1024px){
  .upbt-content-grid{grid-template-columns:1fr}
  .upbt-sidebar{position:static}
  .footer-grid{grid-template-columns:1fr 1fr;gap:20px}
}
/* Mobile */
@media(max-width:768px){
  :root{--navbar-h:auto}
  .upbt-mob-nav{display:block}
  .upbt-section{padding:28px 0}
  .footer-grid{grid-template-columns:1fr;gap:20px}
  .topbar{display:none !important}

  /* ── Two-line mobile header ── */
  .navbar-inner{flex-wrap:wrap;height:auto;padding:8px 0;row-gap:8px}
  .logo{order:1;flex:1;min-width:0}
  .logo-t{font-size:.84rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ham{order:2;flex-shrink:0}
  /* Second row: actions take full width */
  .nav-acts{order:3;width:100%;display:flex;justify-content:space-between;
            gap:8px;padding-top:8px;border-top:1px solid var(--smoke)}
  .nav-acts .ic-btn{width:38px;height:38px}
  .btn-login{flex:1;justify-content:center;padding:9px 12px;font-size:.8rem;max-width:none}
  .nav-user-btn{flex:1;justify-content:center}
}
/* Small mobile */
@media(max-width:480px){
  .nav-acts{gap:4px}
  .ic-btn{width:34px;height:34px;font-size:.82rem}
  .btn-login{padding:6px 10px;font-size:.72rem;gap:5px}
}
/* Reduce motion */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}
}