/*
Theme Name: Athulkrishna Portfolio Home
Theme URI: https://example.com
Author: Athulkrishna P S
Author URI: https://example.com
Description: A single-page dark-minimalist cybersecurity/tech portfolio home page, with a built-in maintenance banner. Upload as-is via Appearance > Themes > Add New > Upload Theme.
Version: 1.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: athulkrishna-portfolio-home
*/


  :root{
    --banner-h:42px;
    --bg:#0A0B0F;
    --bg-alt:#0F1117;
    --bg-card:#13151C;
    --border:rgba(255,255,255,0.08);
    --border-hover:rgba(34,211,238,0.35);
    --text:#F2F3F5;
    --text-muted:#9AA1AC;
    --text-faint:#5C6270;
    --cyan:#22D3EE;
    --blue:#3B82F6;
    --gradient:linear-gradient(120deg,var(--cyan),var(--blue));
    --radius:14px;
    --ease:cubic-bezier(.16,1,.3,1);
    --shadow:0 20px 60px -20px rgba(0,0,0,0.6);
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--bg);color:var(--text);font-family:'Inter',sans-serif;line-height:1.65;
    -webkit-font-smoothing:antialiased;overflow-x:hidden;
  }
  h1,h2,h3,h4{font-family:'Space Grotesk',sans-serif;font-weight:600;line-height:1.2;letter-spacing:-0.01em;}
  a{color:inherit;text-decoration:none;}
  ul{list-style:none;}
  img{max-width:100%;display:block;}
  button{font-family:inherit;cursor:pointer;}
  .container{max-width:1160px;margin:0 auto;padding:0 24px;}
  section{padding:110px 0;position:relative;}
  .text-muted{color:var(--text-muted);}
  .gradient-text{background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent;}

  .eyebrow{
    display:inline-flex;align-items:center;gap:10px;font-family:'JetBrains Mono',monospace;
    font-size:12.5px;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;color:var(--cyan);
    margin-bottom:18px;
  }
  .eyebrow::before{content:"//";color:var(--text-faint);}
  .section-head{max-width:640px;margin-bottom:56px;}
  .section-head h2{font-size:clamp(26px,3.6vw,38px);margin-bottom:14px;}
  .section-head p{color:var(--text-muted);font-size:16.5px;}

  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    padding:15px 30px;border-radius:9px;font-weight:600;font-size:14.5px;
    transition:all .35s var(--ease);white-space:nowrap;font-family:'Inter',sans-serif;
  }
  .btn-primary{background:var(--gradient);color:#04070d;}
  .btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 30px -10px rgba(34,211,238,0.45);}
  .btn-outline{background:transparent;color:var(--text);border:1px solid var(--border);}
  .btn-outline:hover{border-color:var(--cyan);color:var(--cyan);transform:translateY(-2px);}

  /* ===== MAINTENANCE BANNER ===== */
  .maintenance-banner{
    position:fixed;top:0;left:0;right:0;z-index:1001;height:42px;
    background:var(--gradient);color:#04070d;
    display:flex;align-items:center;justify-content:center;gap:8px;
    font-family:'JetBrains Mono',monospace;font-size:12.5px;font-weight:600;letter-spacing:.02em;
    padding:0 16px;text-align:center;
  }
  .maintenance-banner svg{width:15px;height:15px;flex-shrink:0;}
  @media(max-width:600px){.maintenance-banner{font-size:11px;height:auto;padding:8px 14px;line-height:1.4;}}

  /* ===== HEADER ===== */
  header{
    position:fixed;top:var(--banner-h);left:0;right:0;z-index:1000;padding:22px 0;transition:all .4s var(--ease);
    border-bottom:1px solid transparent;
  }
  header.scrolled{
    padding:14px 0;background:rgba(10,11,15,0.75);backdrop-filter:blur(16px) saturate(160%);
    -webkit-backdrop-filter:blur(16px) saturate(160%);border-bottom:1px solid var(--border);
  }
  header .container{display:flex;align-items:center;justify-content:space-between;}
  .logo{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:19px;color:var(--text);display:flex;align-items:center;gap:8px;}
  .logo .dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px 2px rgba(34,211,238,0.6);}
  .nav-links{display:flex;gap:34px;align-items:center;}
  .nav-links a{font-size:14px;font-weight:500;color:var(--text-muted);position:relative;padding:4px 0;transition:color .3s;font-family:'JetBrains Mono',monospace;}
  .nav-links a:hover,.nav-links a.current{color:var(--cyan);}
  .nav-links a.current::before{content:"";position:absolute;left:-14px;top:50%;transform:translateY(-50%);width:5px;height:5px;border-radius:50%;background:var(--cyan);}
  .header-right{display:flex;align-items:center;gap:20px;}
  .menu-toggle{display:none;flex-direction:column;gap:5px;width:24px;cursor:pointer;z-index:1100;}
  .menu-toggle span{height:2px;width:100%;background:var(--text);border-radius:2px;transition:all .3s var(--ease);}

  @media(max-width:900px){
    .nav-links{
      position:fixed;top:0;right:-100%;width:78%;max-width:320px;height:100vh;
      background:var(--bg-alt);flex-direction:column;justify-content:center;gap:30px;
      transition:right .45s var(--ease);border-left:1px solid var(--border);
    }
    .nav-links.open{right:0;}
    .menu-toggle{display:flex;}
  }

  /* ===== HERO ===== */
  .hero{padding:calc(190px + var(--banner-h)) 0 100px;position:relative;overflow:hidden;}
  .hero::before{
    content:"";position:absolute;top:-20%;right:-10%;width:600px;height:600px;border-radius:50%;
    background:radial-gradient(circle,rgba(34,211,238,0.12),transparent 70%);pointer-events:none;
  }
  .hero-grid{
    position:absolute;inset:0;
    background-image:linear-gradient(var(--border) 1px, transparent 1px),linear-gradient(90deg, var(--border) 1px, transparent 1px);
    background-size:56px 56px;mask-image:radial-gradient(ellipse 70% 60% at 60% 30%, black, transparent);
    -webkit-mask-image:radial-gradient(ellipse 70% 60% at 60% 30%, black, transparent);
    opacity:0.5;pointer-events:none;
  }
  .hero .container{position:relative;display:grid;grid-template-columns:1.15fr 0.85fr;gap:56px;align-items:center;}
  .hero-content h1{font-size:clamp(34px,4.8vw,54px);margin-bottom:20px;}
  .hero-sub{font-size:18px;color:var(--text-muted);max-width:560px;margin-bottom:34px;}
  .hero-cta{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:44px;}
  .hero-tags{display:flex;flex-wrap:wrap;gap:10px;}
  .hero-tags span{
    padding:8px 14px;border-radius:100px;border:1px solid var(--border);font-family:'JetBrains Mono',monospace;
    font-size:12.5px;color:var(--text-muted);
  }
  .hero-panel{
    background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:26px;
    font-family:'JetBrains Mono',monospace;font-size:13px;box-shadow:var(--shadow);
  }
  .hero-panel .panel-head{display:flex;gap:6px;margin-bottom:18px;}
  .hero-panel .panel-head span{width:10px;height:10px;border-radius:50%;background:var(--text-faint);}
  .hero-panel .panel-line{color:var(--text-muted);margin-bottom:8px;}
  .hero-panel .panel-line .k{color:var(--cyan);}
  .hero-panel .panel-line .v{color:var(--text);}
  @media(max-width:900px){
    .hero .container{grid-template-columns:1fr;gap:44px;}
    .hero{padding:calc(150px + var(--banner-h)) 0 70px;}
  }

  /* ===== CARDS ===== */
  .card{
    background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);
    padding:30px;transition:all .4s var(--ease);
  }
  .card:hover{border-color:var(--border-hover);transform:translateY(-4px);}
  .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
  @media(max-width:900px){.grid-3{grid-template-columns:1fr;}}
  .highlight-card{display:flex;flex-direction:column;gap:12px;}
  .highlight-icon{
    width:44px;height:44px;border-radius:10px;background:rgba(34,211,238,0.1);color:var(--cyan);
    display:flex;align-items:center;justify-content:center;
  }
  .highlight-icon svg{width:22px;height:22px;}
  .highlight-card h3{font-size:16.5px;}
  .highlight-card p{color:var(--text-muted);font-size:14px;}

  /* ===== CTA BANNER ===== */
  .cta-banner{
    background:var(--bg-card);border:1px solid var(--border);border-radius:20px;padding:56px;text-align:center;
    position:relative;overflow:hidden;
  }
  .cta-banner::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(34,211,238,0.08),transparent 60%);}
  .cta-banner h3{font-size:clamp(22px,3vw,30px);margin-bottom:24px;position:relative;}
  .cta-banner .btn{position:relative;}

  /* ===== FOOTER ===== */
  footer{border-top:1px solid var(--border);padding:64px 0 0;margin-top:60px;}
  .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:48px;padding-bottom:48px;}
  .footer-logo{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:19px;margin-bottom:10px;display:flex;align-items:center;gap:8px;}
  .footer-text{color:var(--text-faint);font-size:13.5px;max-width:300px;margin-bottom:20px;}
  .footer-col h4{font-size:13px;margin-bottom:18px;color:var(--text-muted);font-family:'JetBrains Mono',monospace;text-transform:uppercase;letter-spacing:.05em;}
  .footer-col ul li{margin-bottom:12px;}
  .footer-col ul li a{color:var(--text-faint);font-size:14px;transition:color .3s;}
  .footer-col ul li a:hover{color:var(--cyan);}
  .social-row{display:flex;gap:12px;}
  .social-row a{
    width:42px;height:42px;border-radius:9px;border:1px solid var(--border);display:flex;align-items:center;
    justify-content:center;transition:all .3s var(--ease);
  }
  .social-row a:hover{border-color:var(--cyan);color:var(--cyan);transform:translateY(-3px);}
  .social-row svg{width:18px;height:18px;}
  .footer-bottom{border-top:1px solid var(--border);padding:22px 0;text-align:center;color:var(--text-faint);font-size:12.5px;font-family:'JetBrains Mono',monospace;}
  @media(max-width:800px){.footer-grid{grid-template-columns:1fr;gap:32px;}}

  .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
  .reveal.in{opacity:1;transform:translateY(0);}

  @media (prefers-reduced-motion: reduce){
    *{animation:none!important;transition:none!important;}
    html{scroll-behavior:auto;}
  }
