/*
Theme Name: IPO Alarm GMP
Theme URI: https://t.me/ipo_Alarm
Author: IPO Alarm
Author URI: https://t.me/ipo_Alarm
Description: Responsive IPO GMP landing page theme with ticker, GMP tables, IPO content, FAQs and Telegram CTAs.
Version: 1.4.0
License: GNU General Public License v2 or later
Text Domain: ipo-alarm-gmp
*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');
*{box-sizing:border-box}
body{margin:0;font-family:Poppins,Arial,sans-serif;color:#111;background:#fff}
a{color:inherit;text-decoration:none}
.wrap{max-width:1536px;margin:auto;padding:0 64px}
header{background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.18);position:sticky;top:0;z-index:100}
.head{height:72px;display:flex;align-items:center;justify-content:space-between}
.brand{font-size:29px;font-style:italic;font-weight:800;letter-spacing:-1.4px;display:flex;align-items:center}
.brand b{color:#39b54a} .chart{display:inline-block;width:38px;height:36px;margin-left:5px;position:relative}
.chart:before{content:"";position:absolute;left:2px;bottom:4px;width:29px;height:23px;border-bottom:4px solid #39b54a;border-left:4px solid #39b54a;transform:skewY(-27deg)}
.chart:after{content:"";position:absolute;right:0;top:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:17px solid #39b54a;transform:rotate(8deg)}
.apply{background:#38b449;color:#fff;padding:9px 15px;border-radius:8px;font-weight:700;box-shadow:0 3px 8px #bbb}
.hamb{display:none;font-size:26px;border:0;background:none}
nav{height:57px;border-top:1px solid #e9e9e9;display:flex;align-items:center;justify-content:space-between;font-weight:600}
nav a{padding:16px 12px} nav a:first-child{color:#35ae45}
.tickerOuter{background:#fff;padding-top:12px}
.ticker{border:1px solid #d9d9d9;height:45px;display:flex;overflow:hidden;align-items:center}
.tickerLabel{height:45px;background:#37b442;color:#fff;display:flex;align-items:center;padding:0 18px;font-weight:700;white-space:nowrap}
.tickerTrack{display:flex;gap:34px;white-space:nowrap;padding:0 18px;font-weight:600;animation:scroll 30s linear infinite}
.up{color:#20a53a} .down{color:#d73535}
@keyframes scroll{to{transform:translateX(-50%)}}
main{padding-top:72px}
.grid{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:36px;align-items:start}
article h1{font-size:38px;line-height:1.25;margin:0 0 20px;letter-spacing:-.6px}
.meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:#1768bf;font-size:16px}
.avatar{width:26px;height:26px;border-radius:50%;background:#d5d5d5;display:inline-grid;place-items:center;font-size:11px;color:#555}
.dark{color:#111}
.social{display:flex;gap:18px;margin:25px 0 18px;align-items:center;flex-wrap:wrap}
.social span{display:flex;gap:7px;align-items:center}
.round{width:23px;height:23px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:12px}
.wa{background:#40c55a} .gg{background:#4285f4} .tg{background:#55acee}
article p{font-size:17px;line-height:1.75;margin:0 0 20px}
article h2{font-size:29px;line-height:1.25;margin:34px 0 14px}
article h3{font-size:21px;margin:26px 0 8px}
article ul{padding-left:22px} article li{font-size:16px;line-height:1.7;margin:6px 0}
.sidebar{border:1px solid #a9bfd5}
.sideTitle{background:#367bbb;color:#fff;padding:11px 16px;font-weight:700;font-size:17px}
.sideBody{padding:10px 16px} .sideBody a{display:block;color:#1768bf;padding:4px 0;font-size:16px}
.tablebox{overflow:auto;border:1px solid #ddd;margin:12px 0 20px}
table{border-collapse:collapse;width:100%;min-width:940px;font-size:14px}
th,td{border:1px solid #ddd;padding:11px 10px;text-align:left}
th{background:#f1f1f1;font-weight:700} td:first-child{color:#1768bf;font-weight:600}
.note{border-left:4px solid #39b54a;background:#f5fff6;padding:14px 16px;font-size:14px;line-height:1.6;margin:18px 0}
.author{border:1px solid #ddd;padding:18px;display:flex;gap:15px;align-items:flex-start;margin:35px 0}
.authorPic{width:70px;height:70px;border-radius:50%;background:#e6e6e6;display:grid;place-items:center;font-weight:700}
.faq{border-top:1px solid #ddd;padding-top:8px}
.faq h3{margin-top:24px}
footer{margin-top:50px;background:#f5f5f5;border-top:1px solid #ddd;padding:30px 0;font-size:14px;color:#555}
@media(max-width:900px){
 .wrap{padding:0 13px}
 header{box-shadow:0 2px 6px rgba(0,0,0,.26)}
 .head{height:72px}
 .hamb{display:block;margin-right:20px}
 .headLeft{display:flex;align-items:center}
 .brand{font-size:25px}
 .chart{width:34px;height:32px}
 nav{display:none}
 .tickerOuter{padding-top:16px}
 .ticker{height:50px}
 .tickerLabel{height:49px;padding:0 17px}
 .tickerTrack{gap:30px}
 main{padding-top:238px}
 .grid{grid-template-columns:1fr;gap:0}
 .sidebar{display:none}
 article h1{font-size:29px;line-height:1.35;margin-bottom:23px}
 .meta{font-size:14px;gap:8px}
 .social{gap:14px;font-size:15px}
 article p{font-size:17px;line-height:1.72}
 article h2{font-size:25px}
 .apply{padding:8px 13px}
}

/* WordPress theme additions */
body.admin-bar header {
    top: 32px;
}
@media screen and (max-width: 782px) {
    body.admin-bar header {
        top: 46px;
    }
}


/* ===== Mobile fixed header + ticker fixes ===== */
:root{
  --desktop-header-h:129px;
  --mobile-header-h:72px;
  --mobile-ticker-h:50px;
}

/* Keep the full site header fixed */
header{
  position:fixed !important;
  top:0;
  left:0;
  right:0;
  width:100%;
  z-index:9999;
}

/* Desktop ticker sits directly below fixed header */
.tickerOuter{
  position:fixed;
  top:129px;
  left:0;
  right:0;
  z-index:9990;
  background:#fff;
  padding-top:12px;
}

/* Push desktop content below fixed header + ticker */
main{
  padding-top:245px !important;
}

/* Prevent ticker text from spilling over the green label */
.ticker{
  position:relative;
  overflow:hidden !important;
  background:#fff;
}

.tickerLabel{
  position:relative;
  z-index:3;
  flex:0 0 auto;
  min-width:max-content;
}

.tickerTrack{
  min-width:max-content;
  will-change:transform;
}

/* WordPress admin bar support */
body.admin-bar header{
  top:32px !important;
}
body.admin-bar .tickerOuter{
  top:161px;
}

@media(max-width:900px){

  html,body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
  }

  .wrap{
    width:100%;
    max-width:100%;
    padding-left:12px !important;
    padding-right:12px !important;
  }

  header{
    height:72px;
  }

  .head{
    height:72px !important;
    min-height:72px !important;
    padding:0;
  }

  .headLeft{
    min-width:0;
    gap:8px;
  }

  .hamb{
    display:block !important;
    margin:0 10px 0 0 !important;
    padding:4px 2px !important;
    line-height:1;
    font-size:25px !important;
    flex:0 0 auto;
  }

  .brand{
    font-size:22px !important;
    line-height:1;
    white-space:nowrap;
    min-width:0;
    transform:scale(.98);
    transform-origin:left center;
  }

  .chart{
    width:31px !important;
    height:29px !important;
    margin-left:3px !important;
  }

  .apply{
    font-size:15px !important;
    padding:8px 12px !important;
    border-radius:8px !important;
    white-space:nowrap;
    flex:0 0 auto;
  }

  nav{
    display:none !important;
  }

  /* Fixed ticker exactly under mobile header */
  .tickerOuter{
    position:fixed !important;
    top:72px !important;
    left:0;
    right:0;
    width:100%;
    z-index:9990;
    padding:8px 12px 0 !important;
    background:#fff;
  }

  .tickerOuter .wrap{
    padding:0 !important;
  }

  .ticker{
    width:100%;
    height:50px !important;
    min-height:50px;
    border:1px solid #d6d6d6;
    overflow:hidden !important;
    display:flex;
    align-items:center;
  }

  .tickerLabel{
    height:49px !important;
    min-height:49px;
    padding:0 14px !important;
    font-size:15px;
    flex:0 0 auto;
    display:flex;
    align-items:center;
    background:#37b442;
    z-index:4;
  }

  .tickerTrack{
    display:flex;
    align-items:center;
    gap:30px !important;
    padding:0 18px !important;
    font-size:14px;
    line-height:1;
    animation:mobileTicker 32s linear infinite !important;
    flex:0 0 auto;
  }

  .tickerTrack span{
    display:inline-flex;
    align-items:center;
    gap:4px;
    white-space:nowrap;
  }

  @keyframes mobileTicker{
    from{transform:translateX(0)}
    to{transform:translateX(-50%)}
  }

  /* Main article starts below header + ticker */
  main{
    padding-top:155px !important;
  }

  .grid{
    display:block !important;
    width:100%;
  }

  article{
    width:100%;
    min-width:0;
  }

  article h1{
    font-size:27px !important;
    line-height:1.32 !important;
    overflow-wrap:anywhere;
  }

  .meta{
    font-size:13px !important;
    gap:7px !important;
  }

  .social{
    font-size:14px !important;
    gap:12px !important;
  }

  article p,
  article li{
    overflow-wrap:anywhere;
    word-break:normal;
  }

  .tablebox{
    width:100%;
    max-width:100%;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch;
  }

  table{
    min-width:900px !important;
  }

  .sidebar{
    display:none !important;
  }

  footer{
    overflow:hidden;
  }

  body.admin-bar header{
    top:46px !important;
  }

  body.admin-bar .tickerOuter{
    top:118px !important;
  }
}


/* ===== Telegram click targets ===== */
.telegram-click,
.telegram-row,
.hook-link{
  cursor:pointer;
}

.hook-link{
  transition:color .18s ease;
}

.hook-link:hover{
  color:#2fae42;
}

.telegram-row{
  transition:background-color .18s ease, transform .18s ease;
}

.telegram-row:hover{
  background:#f5fff6;
}

.fascinate-summary{
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.fascinate-summary:hover{
  border-color:#39b54a !important;
  box-shadow:0 4px 14px rgba(57,181,74,.14);
}

.social .telegram-click{
  padding:5px 8px;
  border-radius:7px;
  transition:background .18s ease;
}

.social .telegram-click:hover{
  background:#f2f7ff;
}

.ticker-click{
  cursor:pointer;
}

.telegram-click:focus-visible,
.telegram-row:focus-visible,
.hook-link:focus-visible{
  outline:2px solid #39b54a;
  outline-offset:3px;
}



/* ===== FINAL MOBILE RESPONSIVE HARDENING ===== */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}

img, svg, video, iframe {
  max-width: 100%;
  height: auto;
}

header {
  width: 100%;
}

.tickerOuter,
.ticker,
.tickerViewport,
.tickerTrack {
  max-width: 100%;
}

@media (max-width: 900px) {
  :root {
    --mobile-header-height: 72px;
    --mobile-ticker-height: 50px;
    --mobile-fixed-stack: 130px;
  }

  body {
    padding: 0;
    margin: 0;
    overflow-x: hidden;
  }

  header {
    position: fixed !important;
    top: 0 !important;
    left: 0;
    right: 0;
    height: var(--mobile-header-height);
    z-index: 10000;
    background: #fff;
  }

  .head {
    height: var(--mobile-header-height) !important;
    min-height: var(--mobile-header-height) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px;
  }

  .headLeft {
    display: flex !important;
    align-items: center !important;
    min-width: 0;
    flex: 1 1 auto;
  }

  .hamb {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    margin-right: 8px !important;
    padding: 0 !important;
  }

  .brand {
    font-size: 21px !important;
    white-space: nowrap;
    min-width: 0;
    transform: none !important;
  }

  .brand .chart,
  .chart {
    width: 28px !important;
    height: 27px !important;
    margin-left: 2px !important;
  }

  .apply {
    flex: 0 0 auto;
    font-size: 14px !important;
    line-height: 1.2;
    padding: 9px 11px !important;
    white-space: nowrap;
  }

  nav {
    display: none !important;
  }

  .tickerOuter {
    position: fixed !important;
    top: var(--mobile-header-height) !important;
    left: 0;
    right: 0;
    z-index: 9999;
    background: #fff;
    padding: 8px 12px 0 !important;
    height: calc(var(--mobile-ticker-height) + 8px);
  }

  .tickerOuter .wrap {
    padding: 0 !important;
  }

  .ticker {
    width: 100%;
    height: var(--mobile-ticker-height) !important;
    min-height: var(--mobile-ticker-height) !important;
    display: flex !important;
    align-items: stretch !important;
    overflow: hidden !important;
    border: 1px solid #d9d9d9;
    background: #fff;
  }

  .tickerLabel {
    position: relative !important;
    z-index: 5 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 142px;
    height: 100% !important;
    padding: 0 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start;
    white-space: nowrap;
    font-size: 14px !important;
    background: #37b442 !important;
    color: #fff !important;
    overflow: hidden !important;
  }

  /* Separate clipped viewport prevents moving text from ever passing under label */
  .tickerViewport {
    position: relative !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
    height: 100%;
    background: #fff;
  }

  .tickerTrack {
    position: absolute !important;
    left: 0;
    top: 0;
    height: 100%;
    display: flex !important;
    align-items: center !important;
    gap: 28px !important;
    padding: 0 18px !important;
    white-space: nowrap !important;
    min-width: max-content !important;
    width: max-content !important;
    font-size: 14px !important;
    line-height: 1 !important;
    will-change: transform;
  }

  main {
    padding-top: 165px !important;
  }

  .wrap {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .grid {
    display: block !important;
    width: 100% !important;
  }

  article {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  article h1 {
    font-size: clamp(26px, 7vw, 31px) !important;
    line-height: 1.28 !important;
    letter-spacing: -0.4px !important;
    margin-bottom: 18px !important;
    overflow-wrap: anywhere;
  }

  article h2 {
    font-size: clamp(22px, 6vw, 27px) !important;
    line-height: 1.3 !important;
    overflow-wrap: anywhere;
  }

  article h3 {
    font-size: 19px !important;
    line-height: 1.35 !important;
  }

  article p,
  article li {
    font-size: 16px !important;
    line-height: 1.7 !important;
    overflow-wrap: anywhere;
  }

  .meta {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 7px 9px !important;
    font-size: 13px !important;
  }

  .social {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 18px 0 !important;
  }

  .social span,
  .social a {
    font-size: 14px !important;
    min-height: 36px;
    display: inline-flex !important;
    align-items: center !important;
  }

  .fascinate-summary {
    font-size: 14px !important;
    line-height: 1.75 !important;
    padding: 13px !important;
    overflow-wrap: anywhere;
  }

  .tablebox {
    width: calc(100vw - 28px) !important;
    max-width: calc(100vw - 28px) !important;
    overflow-x: auto !important;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .tablebox table {
    min-width: 900px !important;
    width: max-content !important;
    max-width: none !important;
  }

  .tablebox th,
  .tablebox td {
    padding: 10px 9px !important;
    font-size: 13px !important;
    white-space: normal;
    vertical-align: top;
  }

  .sidebar {
    display: none !important;
  }

  .author {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  footer {
    margin-top: 32px !important;
  }

  body.admin-bar header {
    top: 46px !important;
  }

  body.admin-bar .tickerOuter {
    top: 118px !important;
  }
}

@media (max-width: 420px) {
  .tickerLabel {
    min-width: 132px !important;
    padding: 0 11px !important;
    font-size: 13px !important;
  }

  .tickerTrack {
    font-size: 13px !important;
    gap: 24px !important;
    padding-left: 14px !important;
  }

  .brand {
    font-size: 19px !important;
  }

  .apply {
    font-size: 13px !important;
    padding: 8px 10px !important;
  }

  main {
    padding-top: 160px !important;
  }
}