/* Shared mobile system for all public Profile pages */
.menu-toggle{display:none}

@media (max-width:900px){
  html{overflow-x:hidden}
  body{overflow-x:hidden}
  .container{width:min(100% - 32px,1280px)!important}

  header .header-inner{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 46px!important;
    align-items:center!important;
    gap:10px!important;
    min-height:76px!important;
    padding:9px 0!important;
  }
  header .site-brand{
    width:fit-content!important;
    max-width:100%!important;
    height:54px!important;
    min-height:54px!important;
    flex:0 1 auto!important;
    padding:8px 12px!important;
    justify-self:start;
  }
  header .site-brand .logo{display:inline-flex!important;width:max-content;max-width:100%;gap:9px!important}
  header .site-brand .logo-icon{height:29px!important}
  header .site-brand .logo-text{width:auto!important;max-width:min(170px,calc(100vw - 155px))!important;height:22px!important;object-fit:contain}

  .menu-toggle{
    grid-column:2;
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    padding:0;
    border:1px solid rgba(255,255,255,.3);
    border-radius:10px;
    background:rgba(7,21,39,.82)!important;
    color:#fff;
    cursor:pointer;
    position:relative;
    z-index:1001;
    transition:background-color .25s ease,border-color .25s ease,color .25s ease;
  }
  .menu-toggle-box{position:relative;width:20px;height:14px}
  .menu-toggle-box::before,.menu-toggle-box::after,.menu-toggle-box span{
    content:"";
    position:absolute;
    left:0;
    width:20px;
    height:2px;
    border-radius:2px;
    background:currentColor;
    transition:transform .25s ease,top .25s ease,opacity .2s ease;
  }
  .menu-toggle-box::before{top:0}
  .menu-toggle-box span{top:6px}
  .menu-toggle-box::after{top:12px}
  header.menu-open .menu-toggle-box::before{top:6px;transform:rotate(45deg)}
  header.menu-open .menu-toggle-box span{opacity:0}
  header.menu-open .menu-toggle-box::after{top:6px;transform:rotate(-45deg)}

  header .nav-box{
    grid-column:1/-1!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:0!important;
    width:100%!important;
    min-height:0!important;
    max-height:0;
    padding:0!important;
    overflow:hidden;
    border:0!important;
    border-radius:14px!important;
    background:rgba(255,255,255,.985)!important;
    box-shadow:0 18px 40px rgba(7,21,39,.18)!important;
    opacity:0;
    transform:translateY(-8px);
    pointer-events:none;
    transition:max-height .35s ease,opacity .22s ease,transform .28s ease,padding .28s ease!important;
  }
  header.menu-open .nav-box{
    max-height:430px;
    padding:8px!important;
    opacity:1;
    transform:none;
    pointer-events:auto;
  }
  header .nav-box a{
    display:flex!important;
    align-items:center!important;
    min-width:0;
    min-height:46px!important;
    height:auto!important;
    padding:9px 12px!important;
    border-bottom:1px solid #e7edf2;
    color:#0b1f36!important;
    font-size:11px!important;
    line-height:1.35;
    white-space:normal!important;
  }
  header .nav-box a:nth-last-child(-n+2){border-bottom:0}
  header .nav-box a::after{left:12px!important;right:auto!important;bottom:5px!important;width:0!important;height:2px!important}
  header .nav-box a.active::after{width:24px!important}
  header.scrolled .menu-toggle{border-color:#d7e0e8!important;background:#fff!important;color:#0b1f36!important}

  .hero{min-width:0}
  .hero h1{max-width:100%!important;overflow-wrap:normal;word-break:normal;white-space:normal!important}
  img{max-width:100%;height:auto}
  .btn,.btn-secondary,.apply-btn{max-width:100%;text-align:center}
  .cta-panel .btn{width:auto!important;min-width:max-content;white-space:nowrap}
  .footer-grid{grid-template-columns:1fr 1fr!important}
}

@media (max-width:600px){
  .container{width:min(100% - 28px,1280px)!important}
  header .site-brand{width:fit-content!important;max-width:100%!important;flex-basis:auto!important}
  header .site-brand .logo-text{max-width:min(150px,calc(100vw - 150px))!important}
  header .nav-box{grid-template-columns:1fr!important}
  header .nav-box a,header .nav-box a:nth-last-child(-n+2){border-bottom:1px solid #e7edf2}
  header .nav-box a:last-child{border-bottom:0}
  header.menu-open .nav-box{max-height:620px}

  .hero h1{font-size:clamp(38px,12vw,52px)!important;line-height:1.05!important}
  .hero p{font-size:15px!important;line-height:1.7!important}
  main section{padding-top:58px;padding-bottom:58px}
  .section-title{font-size:clamp(30px,9vw,40px)!important}
  .section-sub{font-size:15px!important}
  .footer-grid{grid-template-columns:1fr!important}
  .footer-hero{font-size:23px!important;line-height:1.35}

  /* Home */
  .hero-shell{grid-template-columns:1fr!important;padding-top:110px!important;padding-bottom:50px!important}
  .hero-content{transform:none!important;text-align:left!important}
  .hero-content .hero-actions{flex-direction:column;align-items:stretch}
  .service-showcase{min-width:0!important;padding:22px!important}
  .showcase-window{min-height:300px!important}
  .showcase-slide h2{font-size:28px!important}
  .showcase-slide p{min-height:0!important}
  .editorial-head,.about-intro,.executive-grid,.outcome-banner{grid-template-columns:1fr!important}
  .about-visuals,.principles,.pillars-grid,.why-cakra-grid,.roadmap-timeline{grid-template-columns:1fr!important}
  .pillar-card{min-height:245px!important}
  .outcome-pillars{flex-direction:column}
  .outcome-pillars span{padding-top:10px}
  .roadmap-phase{min-height:190px!important;border-right:0!important}

  /* About */
  .identity-grid,.direction-grid{grid-template-columns:1fr!important}
  .identity-platform{padding:28px!important}
  .mission-commitments{grid-template-columns:1fr!important}
  .mission-commitments li{min-height:120px!important;border-right:0!important;border-bottom:1px solid var(--line)}
  .philosophy-journey{display:grid!important;grid-template-columns:1fr 1fr!important;overflow:visible!important}
  .journey-step{min-height:125px!important;flex:auto!important}
  .comparison-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .comparison-table{min-width:620px}

  /* Services */
  .services-grid{grid-template-columns:1fr!important}
  .detail-card,.detail-card.is-open,.detail-card:nth-child(even){display:block!important}
  .detail-card::before{min-height:220px!important}
  .detail-head{padding:24px 22px 12px!important}
  .detail-card>p,.detail-card.is-open>p{padding:0 22px 18px!important}
  .detail-card>.detail-grid,.detail-card.is-open>.detail-grid{grid-template-columns:1fr!important;padding:0 22px 22px!important}
  .process-grid{grid-auto-columns:84vw!important}
  .knowledge-callout{width:100%!important}

  /* Industries */
  .sector-stat{min-height:260px!important}
  .client-matrix-intro{min-height:270px!important}
  .client-card{grid-template-columns:32px 1fr!important}
  .client-card p{grid-column:2!important}
  .proof-copy,.proof-status{padding:30px 24px!important}

  /* Cakra-X */
  .hero-grid{grid-template-columns:1fr!important;gap:10px!important;padding-top:120px!important}
  .orbit-stage{min-height:310px!important}
  .intro-note,.capability-grid{grid-template-columns:1fr!important}
  .statement-grid{align-items:flex-start!important;flex-direction:column!important}

  /* Career and contact forms */
  .layout{grid-template-columns:1fr!important}
  .row{grid-template-columns:1fr!important}
  .card,.side,.jobs{padding:24px!important}
  input,select,textarea{font-size:16px!important}
  .cta-panel{align-items:flex-start!important;flex-direction:column!important}
}

@media (prefers-reduced-motion:reduce){
  .menu-toggle-box::before,.menu-toggle-box::after,.menu-toggle-box span,header .nav-box{transition:none!important}
}
