/* Shared phone layout. Brand colours always come from sais-palettes.css. */
.footer-disclosure > summary,
.sais-contact-disclosure > summary { list-style: none; }
.footer-disclosure > summary::-webkit-details-marker,
.sais-contact-disclosure > summary::-webkit-details-marker { display: none; }
@media (min-width: 701px) {
  .footer-disclosure > summary,
  .sais-contact-disclosure > summary { pointer-events: none; }
}

@media (max-width: 700px) {
  body:is(.sais-layout-home,.sais-layout-page) {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }
  body:is(.sais-layout-home,.sais-layout-page) .wrap { width: calc(100% - 32px); padding-inline: 0; }
  body:is(.sais-layout-home,.sais-layout-page) :is(.section,.cosmos-section) { padding-block: 36px; }
  body:is(.sais-layout-home,.sais-layout-page) :is(.reveal,.reveal-part) { opacity: 1 !important; transform: none !important; filter: none !important; animation: none !important; transition: none !important; }
  body:is(.sais-layout-home,.sais-layout-page) :is(h1,h2,h3,p,strong,a) { word-break: normal; overflow-wrap: normal; hyphens: none; }
  body:is(.sais-layout-home,.sais-layout-page) :is(.section-head,.section-heading) { margin-bottom: 22px; }
  body:is(.sais-layout-home,.sais-layout-page) .section-head :is(.t-h2,.t-display) { font-size: clamp(1.65rem,7vw,2.3rem); line-height: 1.15; }
  body:is(.sais-layout-home,.sais-layout-page) .topbar .nav { width: calc(100% - 24px); min-height: 54px; padding: 6px 12px; }
  body:is(.sais-layout-home,.sais-layout-page) .nav > .brand { order: 0; }
  body:is(.sais-layout-home,.sais-layout-page) .nav > .lang { order: 1; margin-left: auto; margin-right: 4px; }
  body:is(.sais-layout-home,.sais-layout-page) #menuButton { order: 2; min-width: 40px; min-height: 40px; }
  body:is(.sais-layout-home,.sais-layout-page) .nav-links { max-height: calc(100dvh - 90px); overflow-y: auto; padding: 12px; }
  body:is(.sais-layout-home,.sais-layout-page) .nav-links a:not(.nav-cta) { display: flex; align-items: center; min-height: 44px; padding: 10px 12px; font-size: 15px; }

  /* Phones play the same palette-baked footage as desktop. */
  body.sais-layout-home .cosmos-hero__layout { height: auto; min-height: 450px; border-radius: 0 22px 0 22px; display: flex; flex-direction: column; justify-content: space-between; gap: 74px; }
  body.sais-layout-home .cosmos-hero__copy { display: contents; }
  body.sais-layout-home .hero-title-panel { position: relative; width: 100%; padding: 25px 20px; }
  body.sais-layout-home .hero-action-panel { position: relative; width: 92%; align-self: flex-end; padding: 20px; }
  body.sais-layout-home .cosmos-hero h1 { font-size: clamp(1.45rem,7.4vw,2.4rem); line-height: 1.12; }
  body.sais-layout-home .cosmos-hero h1 span { overflow-wrap: normal; word-break: normal; }
  html[lang="ka"] body.sais-layout-home .cosmos-hero h1 { font-size: clamp(1.18rem,6.1vw,2.1rem); }
  body.sais-layout-page .page-head { width: calc(100% - 24px); margin-top: 10px; border-radius: 0 22px 0 22px; }
  body.sais-layout-page .page-head__inner { padding: 26px 20px; }
  body.sais-layout-page .page-head__aside { margin-top: 64px; padding: 20px; }
  body.sais-layout-page .page-head .t-h1 { font-size: clamp(1.8rem,8vw,2.8rem); }
  html[lang="ka"] body.sais-layout-page .page-head .t-h1 { font-size: clamp(1.35rem,5.8vw,2.15rem); }
  body.page-legal.sais-layout-page .page-head .t-h1 { font-size: clamp(1.15rem,5.2vw,1.7rem); }
  html[lang="ka"] body.page-legal.sais-layout-page .page-head .t-h1 { font-size: clamp(.85rem,4.15vw,1.6rem); }

  /* A smaller rail shows the next project and leaves space around the section. */
  body:is(.sais-layout-home,.page-about) .works-grid { gap: 12px; padding: 0 16px 12px; scroll-padding-inline: 16px; }
  body:is(.sais-layout-home,.page-about) .work-card { flex: 0 0 min(64vw,265px); padding: 8px; min-height: 0; border-radius: 18px; }
  body:is(.sais-layout-home,.page-about) .work-card__media { aspect-ratio: 16 / 9; border-radius: 12px; }
  body:is(.sais-layout-home,.page-about) .work-card__meta { margin: 12px 5px 7px; gap: 6px; }
  body:is(.sais-layout-home,.page-about) .work-card__meta h3 { font-size: 18px; line-height: 1.2; }
  body:is(.sais-layout-home,.page-about) .work-card p { margin: 0 5px 14px; font-size: 13px; line-height: 1.45; }
  body:is(.sais-layout-home,.page-about) .work-card__visit { flex-wrap: wrap; gap: 6px; margin: 0 5px 3px; padding-top: 10px; font-size: 12px; }
  body.page-projects .bento--scroll { grid-auto-columns: min(64vw,265px); gap: 12px; }
  body.page-projects .bento--scroll .bento__item { min-height: 0; padding: 16px; border-radius: 20px; }
  body.page-projects .bento--scroll .bento__title { font-size: 21px; }
  body.page-projects .bento--scroll .bento__sub { font-size: 13px; line-height: 1.45; }
  body.page-projects .bento--scroll .bento__shot { height: 160px; min-height: 0; margin-top: 14px; }
  body.page-projects .bento--scroll .bento__shot img { width: 100%; height: 100%; max-height: none; object-fit: cover; object-position: top; }

  /* One column makes every connector point to the next numbered stage. */
  body.sais-layout-home .process-grid,
  body.page-services .service-process .process-grid { grid-template-columns: minmax(0,1fr); gap: 22px; }
  body.sais-layout-home .process-step,
  body.page-services .service-process .process-step { display: grid; grid-template-columns: 38px minmax(0,1fr) 76px; align-items: center; column-gap: 10px; min-height: 150px; padding: 22px 18px; border-radius: 20px; }
  body.sais-layout-home .process-step__top,
  body.page-services .service-process .process-step__top { grid-column: 1; grid-row: 1; align-self: start; padding-top: 3px; font-size: 13px; }
  body.sais-layout-home .process-step__art,
  body.page-services .service-process .process-step__art { grid-column: 3; grid-row: 1; width: 76px; height: 90px; margin: 0; }
  body.sais-layout-home .process-step__copy,
  body.page-services .service-process .process-step__copy { grid-column: 2; grid-row: 1; gap: 8px; margin: 0; }
  body.sais-layout-home .process-step__copy strong,
  body.page-services .service-process .process-step__copy strong { font-size: 20px; line-height: 1.2; }
  body.sais-layout-home .process-step__copy > span,
  body.page-services .service-process .process-step__copy > span { font-size: 13px; line-height: 1.45; }
  body.sais-layout-home .process-step:not(:last-child) .process-step__arrow,
  body.page-services .service-process .process-step:not(:last-child) .process-step__arrow { display: grid; top: auto; right: auto; bottom: -28px; left: 32px; width: 34px; height: 34px; transform: rotate(90deg); border-width: 3px; font-size: 20px; }
  body.sais-layout-home .process-step:last-child .process-step__arrow,
  body.page-services .service-process .process-step:last-child .process-step__arrow { top: auto; right: auto; bottom: 14px; left: 21px; width: 32px; height: 32px; transform: none; }

  /* One joined form card, a compact coloured heading, comfortable full-width fields. */
  body.sais-layout-home .cosmos-contact__layout,
  body.sais-layout-page .sais-form-layout { display: grid; grid-template-columns: minmax(0,1fr); gap: 0; padding: 0; overflow: hidden; border: 1px solid rgba(9,9,9,.08); border-radius: 24px; background: var(--cd-paper); }
  body.sais-layout-home .cosmos-contact__copy,
  body.sais-layout-page .sais-form-intro,
  body.page-contact.sais-layout-page .sais-form-intro--contact { min-height: 0; padding: 26px 22px; border-radius: 0; gap: 12px; justify-content: flex-start; }
  body.sais-layout-home .cosmos-contact__copy::before,
  body.sais-layout-page .sais-form-intro::before { width: 120px; left: auto; right: -34px; top: -25px; opacity: .4; }
  body.sais-layout-home .cosmos-contact h2,
  body.sais-layout-page .sais-form-intro .t-h2,
  body.page-contact.sais-layout-page .sais-form-intro--contact .t-h2 { max-width: none; font-size: 28px; line-height: 1.18; }
  html[lang="ka"] body.sais-layout-home .cosmos-contact h2,
  html[lang="ka"] body.sais-layout-page .sais-form-intro .t-h2 { font-size: 25px; }
  body.sais-layout-home .cosmos-contact__copy .cosmos-lead,
  body.sais-layout-page .sais-form-intro :is(.t-body,.t-small) { max-width: none; font-size: 14px; line-height: 1.5; }
  body.sais-layout-page .sais-form-intro .section-kicker { font-size: 11px; letter-spacing: .06em; }
  body.sais-layout-home .cosmos-contact .form-grid,
  body.sais-layout-page .sais-form-panel { padding: 22px; border: 0; border-radius: 0; background: var(--cd-paper); }
  body.sais-layout-page .sais-form-panel .form-grid { padding: 0; }
  body.sais-layout-home .cosmos-contact .form-grid,
  body.sais-layout-page .sais-form-panel .form-grid { grid-template-columns: minmax(0,1fr); gap: 18px; }
  body:is(.sais-layout-home,.sais-layout-page) .form-grid .span-2 { grid-column: 1 / -1; }
  body.sais-layout-home .cosmos-contact .label,
  body.sais-layout-page .sais-form-panel .label { font-size: 13px; line-height: 1.4; font-weight: 650; }
  body.sais-layout-home .cosmos-contact :is(.input,.select,.textarea),
  body.sais-layout-page .sais-form-panel :is(.input,.select,.textarea) { width: 100%; min-width: 0; min-height: 50px; padding: 13px 14px; border-radius: 12px; border: 1px solid rgba(9,9,9,.12); background-color: #efefeb; font-size: 16px; line-height: 1.45; }
  body.sais-layout-home .cosmos-contact .select,
  body.sais-layout-page .sais-form-panel .select { padding-right: 34px; text-overflow: ellipsis; }
  body.sais-layout-home .cosmos-contact .textarea,
  body.sais-layout-page .sais-form-panel .textarea { min-height: 118px; }
  body.sais-layout-home .cosmos-contact .check,
  body.sais-layout-page .sais-form-panel .check { align-items: flex-start; gap: 10px; font-size: 12px; line-height: 1.5; }
  body:is(.sais-layout-home,.sais-layout-page) .check input { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 2px; accent-color: var(--cd-orange); }
  body.sais-layout-home .cosmos-contact .btn-row,
  body.sais-layout-page .sais-form-panel .btn-row { display: grid; grid-template-columns: 1fr; gap: 12px; text-align: center; }
  body.sais-layout-home .cosmos-contact .btn-row .btn,
  body.sais-layout-page .sais-form-panel .btn-row .btn { width: 100%; min-height: 50px; font-size: 15px; }
  body.page-contact .sais-form-intro__details { padding-top: 8px; }
  body.page-contact.sais-layout-page .sais-form-intro__details-title { display: block; margin: 0; font-size: 13px; font-weight: 550; }
  .sais-contact-disclosure > summary { display: flex; justify-content: space-between; align-items: center; min-height: 44px; border-top: 1px solid rgba(255,255,255,.3); cursor: pointer; }
  .sais-contact-disclosure > summary::after { content: "+"; color: #fff; font-size: 22px; }
  .sais-contact-disclosure[open] > summary::after { content: "−"; }
  body.page-contact .sais-form-intro .plain-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 14px; }
  body.page-contact .sais-form-intro .plain-item:last-child { grid-column: 1 / -1; }
  body.page-contact .sais-form-intro .plain-item { padding-block: 10px; }
  body.page-contact .sais-form-intro .plain-item :is(h3,p) { font-size: 12px; }

  body.page-about .about-story { padding: 24px; }
  body.page-about .about-story__index { margin-bottom: 24px; }
  body.page-about .about-story .t-h2 { max-width: none; font-size: 30px; }
  body.page-about .about-story p { font-size: 14px; line-height: 1.6; }
  body.page-about .about-side-card { padding: 24px; }
  body.page-about .about-belief { gap: 8px; padding: 16px; }
  body.page-services .bento__item { padding: 20px; }
  body.page-services .bento__title { font-size: 24px; }
  body.page-services .service-includes { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  body.page-services .service-include__art { height: 120px; }
  body.page-services .service-include__copy { padding: 16px; }
  body.page-services .service-include__copy h3 { font-size: 17px; }
  body.page-services .service-include__copy p { font-size: 13px; line-height: 1.45; }
  body.page-contact .contact-faq-inner { width: calc(100% - 32px); }
  body.page-contact .contact-faq-heading .t-display { font-size: 30px; }

  /* Mobile footer navigation expands on demand instead of taking a full screen. */
  body:is(.sais-layout-home,.sais-layout-page) .footer { min-height: 0; height: auto; padding: 30px 0 24px; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
  body:is(.sais-layout-home,.sais-layout-page) .footer::before,
  body:is(.sais-layout-home,.sais-layout-page) .footer::after { display: none; }
  body:is(.sais-layout-home,.sais-layout-page) .footer__grid { grid-template-columns: minmax(0,1fr); gap: 0; padding-bottom: 14px; }
  body:is(.sais-layout-home,.sais-layout-page) .footer__grid > :first-child { padding-bottom: 20px; }
  body:is(.sais-layout-home,.sais-layout-page) .footer .brand-logo { width: auto; height: 25px; }
  body:is(.sais-layout-home,.sais-layout-page) .footer__about { max-width: none; margin-top: 12px; font-size: 12px; line-height: 1.5; }
  body:is(.sais-layout-home,.sais-layout-page) .footer__col { border-top: 1px solid rgba(255,255,255,.15); }
  .footer-disclosure > summary { display: flex; justify-content: space-between; align-items: center; min-height: 48px; cursor: pointer; }
  .footer-disclosure > summary::after { content: "+"; color: var(--cd-soft-accent); font-size: 22px; }
  .footer-disclosure[open] > summary::after { content: "−"; }
  body:is(.sais-layout-home,.sais-layout-page) .footer__col h3 { margin: 0; font-size: 14px; font-weight: 650; }
  body:is(.sais-layout-home,.sais-layout-page) .footer__col ul { padding: 0 0 14px; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 12px; }
  body:is(.sais-layout-home,.sais-layout-page) .footer__col a { min-height: 44px; font-size: 12px; line-height: 1.4; }
  body:is(.sais-layout-home,.sais-layout-page) .footer__legal { padding-top: 14px; font-size: 10px; line-height: 1.6; }
  body:is(.sais-layout-home,.sais-layout-page) .footer__bottom { padding-top: 12px; gap: 6px; font-size: 10px; }
  body:is(.sais-layout-home,.sais-layout-page) .footer__bottom nav { width: 100%; gap: 0 16px; }
  body:is(.sais-layout-home,.sais-layout-page) .footer__bottom a { display: inline-flex; align-items: center; min-height: 36px; }

  /* Keep the assistant reachable without covering the form or project content. */
  body:is(.sais-layout-home,.sais-layout-page) .sa-bubble { max-width: 180px; padding: 10px 12px; margin-bottom: 24px; font-size: 12px; }
  body.sais-phone-form-focus .sa-dock { visibility: hidden; pointer-events: none; }
  body.sais-phone-form-visible .sa-bubble { display: none; }
}

@media (max-width: 380px) {
  body.page-services .service-includes { grid-template-columns: minmax(0,1fr); }
  body.page-services .service-include { display: grid; grid-template-columns: 90px minmax(0,1fr); }
  body.page-services .service-include__art { height: 100%; min-height: 128px; }
  body.page-services .service-include__art img { width: 100%; max-height: 110px; }
  body.sais-layout-home .process-step,
  body.page-services .service-process .process-step { grid-template-columns: 27px minmax(0,1fr) 60px; column-gap: 8px; padding-inline: 16px; }
  body.sais-layout-home .process-step__art,
  body.page-services .service-process .process-step__art { width: 60px; }
  body.sais-layout-home .process-step__copy strong,
  body.page-services .service-process .process-step__copy strong { font-size: 18px; }
}

/* Tablet connectors follow a snake with stage 3 below stage 2. */
@media (min-width: 701px) and (max-width: 1100px) {
  body.sais-layout-home .process-step:nth-child(3),
  body.page-services .service-process .process-step:nth-child(3) { grid-column: 2; grid-row: 2; }
  body.sais-layout-home .process-step:nth-child(4),
  body.page-services .service-process .process-step:nth-child(4) { grid-column: 1; grid-row: 2; }
  body.sais-layout-home .process-step:nth-child(3) .process-step__arrow,
  body.page-services .service-process .process-step:nth-child(3) .process-step__arrow { left: -34px; right: auto; transform: translateY(-50%) rotate(180deg); }
}
