/* ORIGO V8.3.0 — mobile-first app shell for the public website */
:root{
  --origo-app-bg:#f2f2ee;
  --origo-app-surface:#ffffff;
  --origo-app-ink:#0b0c0f;
  --origo-app-muted:#6d727c;
  --origo-app-line:#dddcd6;
  --origo-app-accent:#5b7cff;
  --origo-app-nav-height:72px;
}
.mobile-app-nav{display:none}
@media(max-width:820px){
  html{scroll-padding-top:72px}
  body{background:var(--origo-app-bg);padding-bottom:calc(var(--origo-app-nav-height) + env(safe-area-inset-bottom));overflow-x:hidden}
  body.menu-open{overflow:hidden}
  .shell{width:calc(100% - 24px)}

  /* Compact app top bar */
  .header{top:0;z-index:1000;background:rgba(246,246,242,.96)!important;border-bottom:1px solid rgba(11,12,15,.08);backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important}
  .header-inner{height:64px;gap:10px}
  .logo-wrap{width:44px;height:44px;border-radius:13px;box-shadow:none;border:1px solid #dddcd6;background:#fff}
  .logo-wrap img{width:54px;max-width:none}
  .nav{display:none!important}
  .menu{display:none!important}
  .header-cta{margin-left:auto;min-height:42px;padding:10px 15px;border-radius:13px;font-size:12px;box-shadow:none}
  .header-cta:hover{transform:none;box-shadow:none}
  .header-cta-full{display:none}
  .header-cta-short{display:inline}
  .mobile-nav{display:none!important}

  /* Bottom tab bar */
  .mobile-app-nav{position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:1200;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));min-height:64px;padding:7px;border:1px solid rgba(18,20,24,.12);border-radius:21px;background:rgba(16,18,22,.96);box-shadow:0 18px 55px rgba(0,0,0,.28);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
  .mobile-app-nav a{min-width:0;display:grid;place-items:center;align-content:center;gap:3px;border-radius:15px;color:#9ea4af;text-decoration:none;font-size:9px;font-weight:800;letter-spacing:.01em;line-height:1.1;transition:.18s}
  .mobile-app-nav svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .mobile-app-nav a.is-active,.mobile-app-nav a:active{background:#fff;color:#0b0c0f}

  /* Global mobile content rhythm */
  main{min-width:0}
  .section,.analysis,.ob-section,.ob-analysis,.ob-booking-focus{padding:64px 0!important}
  .section-head,.booking-intro{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  .section-head h2,.booking-intro h1{font-size:clamp(35px,10.5vw,48px)!important;line-height:.98!important;letter-spacing:-.05em!important}
  .section-head p,.booking-intro p{font-size:15px!important;line-height:1.55!important}
  .problem-card,.service-card,.analysis-panel,.ob-step,.ob-analysis-panel,.ob-board,.ob-why-grid article,.ob-faq-list article{border-radius:20px!important}
  .btn{min-height:48px;border-radius:14px;padding:13px 17px}
  input,select,textarea{font-size:16px!important}

  /* Home becomes a stack of app screens/cards */
  .ob-hero{padding:12px 0 12px!important;background:var(--origo-app-bg)!important}
  .ob-hero-shell{width:calc(100% - 16px)!important;padding:7px!important;border-radius:25px!important;background:#deddd7!important}
  .ob-hero-grid{gap:7px!important}
  .ob-hero-copy{padding:30px 21px 28px!important;border-radius:19px!important;min-height:auto!important}
  .ob-hero-copy h1{font-size:clamp(43px,13vw,61px)!important}
  .ob-hero-booking{padding:18px!important;border-radius:19px!important;min-height:auto!important}
  .ob-session-list{display:flex!important;overflow-x:auto!important;gap:8px!important;scroll-snap-type:x mandatory;padding-bottom:2px;scrollbar-width:none}
  .ob-session-list::-webkit-scrollbar{display:none}
  .ob-session{min-width:82%!important;scroll-snap-align:start}
  .ob-strip-grid{width:calc(100% - 24px)!important;border-radius:18px;overflow:hidden;margin:0 auto;box-shadow:0 8px 28px rgba(0,0,0,.06)}
  .ob-step{box-shadow:0 8px 30px rgba(0,0,0,.05)}
  .ob-board-services{display:flex!important;overflow-x:auto;gap:8px;scrollbar-width:none}
  .ob-board-services::-webkit-scrollbar{display:none}
  .ob-board-services>div{min-width:150px;flex:0 0 auto!important}

  /* Booking flow */
  .booking-page{padding-top:20px!important;padding-bottom:35px!important}
  .booking-intro{margin-bottom:17px!important}
  .booking-progress{position:sticky;top:70px;z-index:40;padding:6px!important;margin:0 auto 10px!important;border-radius:16px;background:rgba(242,242,238,.93);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
  .booking-app{border-radius:22px!important;box-shadow:0 14px 45px rgba(0,0,0,.08)}
  .booking-services{padding:15px 10px!important}
  .booking-service-list{display:flex!important;grid-template-columns:none!important;overflow-x:auto!important;gap:8px!important;padding:0 0 2px!important;scroll-snap-type:x mandatory!important;scrollbar-width:none}
  .booking-service-list::-webkit-scrollbar{display:none}
  .booking-service{min-width:72%!important;scroll-snap-align:start!important;text-align:left!important;padding:15px!important}
  .booking-service-top{align-items:flex-start!important;flex-direction:row!important;justify-content:space-between!important}
  .booking-service-top>span{align-items:flex-start!important}
  .booking-service p{display:block!important;font-size:11px!important;line-height:1.4!important;margin-top:9px!important}
  .booking-calendar{padding:17px 10px 24px!important}
  .calendar-head{position:sticky;top:124px;z-index:20;background:#fff;padding:4px 0 9px}
  .calendar-day{min-height:44px!important;border-radius:11px!important}
  .slot-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .slot-button{min-height:48px!important;border-radius:12px!important}
  .booking-form-panel{padding-top:18px!important}
  .booking-form-section{padding:16px 12px!important;border-radius:17px!important}
  .booking-form input,.booking-form select,.booking-form textarea{min-height:49px;border-radius:13px!important}
  .booking-pay-row{position:sticky;bottom:calc(var(--origo-app-nav-height) + 10px + env(safe-area-inset-bottom));z-index:35;padding:10px!important;margin:6px -4px 0!important;border:1px solid #d8d7d0;border-radius:17px;background:rgba(255,255,255,.96);box-shadow:0 13px 34px rgba(0,0,0,.14);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}
  .booking-mobile-dock,.mobile-booking-bar{bottom:calc(var(--origo-app-nav-height) + 17px + env(safe-area-inset-bottom))!important;z-index:1100!important}

  /* Footer and safe areas */
  .footer{padding-bottom:calc(32px + var(--origo-app-nav-height) + env(safe-area-inset-bottom))!important}
  .footer-brand img{max-width:130px}
}
@media(max-width:390px){
  .mobile-app-nav{left:6px;right:6px;bottom:calc(6px + env(safe-area-inset-bottom));padding:6px}
  .mobile-app-nav a{font-size:8px}
  .mobile-app-nav svg{width:19px;height:19px}
  .booking-service{min-width:84%!important}
}
@media(display-mode:standalone) and (max-width:820px){
  .header{padding-top:env(safe-area-inset-top)}
  .header-inner{height:60px}
}
@media(max-width:900px){body.app-keyboard-open .mobile-app-nav,body.app-keyboard-open .booking-mobile-dock,body.app-keyboard-open .mobile-booking-bar{display:none!important}}