/* Concise phone layouts. Full copy stays available on wider screens. */
[data-copy-compact],.process-step-symbol,.mobile-services{display:none}
.contact-body h2>[data-copy-wide]{color:inherit}
.contact-body h2 [data-copy-wide]>span{color:#e7dfff}

@media(max-width:760px){
  [data-copy-wide]{display:none!important}
  [data-copy-compact]{display:block}

  /* One clear introduction; the featured project appears in the portfolio below. */
  .section{padding-block:88px}
  .section-head{margin-bottom:36px}
  .section-head h2,.ability-heading h2{font-size:32px;line-height:1.17;letter-spacing:-1px;max-width:20ch}
  .studio-intro{padding-top:40px}
  .studio-intro h1{margin:0 0 25px;line-height:1.22}
  .studio-intro .intro-description p{max-width:34ch;font-size:17px;line-height:1.7;color:#b5c2db}
  .studio-intro .intro-lower{margin-bottom:0}
  .studio-intro .intro-actions{margin-top:28px;gap:16px}
  .studio-intro .intro-actions>span{font-size:14px;line-height:1.65;color:#a2b2cf}
  .studio-intro .workbench{display:none}
  .intro-flow-map{opacity:.32}
  .intro-aura{opacity:.6}
  .studio-marquee--directions{margin-top:88px}

  /* Focused service disclosures replace the long phone illustration feed. */
  .ability-heading{margin-bottom:36px}
  .ability-stories{display:none}
  .mobile-services{display:block;margin-bottom:48px;border-top:1px solid #6c7a9e40}
  .service-disclosure{border-bottom:1px solid #6c7a9e40}
  .service-disclosure>summary{display:grid;grid-template-columns:38px minmax(0,1fr) 20px;align-items:center;gap:14px;min-height:86px;padding:22px 0;list-style:none;cursor:pointer;touch-action:manipulation;color:#dce5f7}
  .service-disclosure>summary::-webkit-details-marker{display:none}
  .service-disclosure>summary::marker{content:""}
  .service-disclosure>summary:focus-visible{outline:2px solid #a6adff;outline-offset:5px;border-radius:8px}
  .service-disclosure-icon{display:grid;place-items:center;width:38px;height:38px;border:1px solid #8293c338;border-radius:12px;background:linear-gradient(135deg,#4769ba16,#7755b916);color:#aabcf3}
  .service-disclosure-icon>svg{width:20px;height:20px}
  .service-disclosure-title{font-size:18px;font-weight:500;line-height:1.4;letter-spacing:-.2px}
  .service-disclosure-toggle{width:20px;height:20px;color:#91a0bf;transition:transform .22s,color .22s}
  .service-disclosure[open]>summary{color:#f1f3ff}
  .service-disclosure[open] .service-disclosure-icon{border-color:#9b98e37a;background:linear-gradient(135deg,#4769ba30,#7755b930);color:#d5d4ff}
  .service-disclosure[open] .service-disclosure-toggle{transform:rotate(45deg);color:#c1b5ff}
  .service-disclosure-body{padding:0 0 28px}
  .service-disclosure-body>p{margin:0 0 23px;font-size:16px;line-height:1.75;color:#a7b7d1}
  .service-disclosure-tasks{display:grid;gap:12px;margin:0;padding:0;list-style:none}
  .service-disclosure-tasks>li{display:grid;grid-template-columns:18px minmax(0,1fr);align-items:start;gap:10px;font-size:15px;line-height:1.65;color:#c1cde5}
  .service-disclosure-tasks>li>svg{width:18px;height:18px;margin-top:3px;color:#aca7ef}
  .service-disclosure-result{display:flex;align-items:flex-start;gap:10px;margin-top:23px;padding-top:20px;border-top:1px solid #7184b32b}
  .service-disclosure-result>svg{width:17px;height:17px;flex-shrink:0;margin-top:4px;color:#a9b8fa}
  .service-disclosure-result>p{margin:0;font-size:15px;line-height:1.7;color:#ceceff}
  .service-disclosure-proof{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:48px;margin-top:18px;padding-block:8px;font-size:14px;line-height:1.6;color:#b9c3ff}
  .service-disclosure-proof>.icon{width:18px;height:18px;flex-shrink:0}
  .service-disclosure[open] .service-disclosure-body{animation:service-disclosure-enter .22s ease-out}

  .ability-assurance{padding:46px 0}
  .ability-assurance-inner{display:block}
  .ability-assurance-symbol{justify-content:flex-start;gap:0;padding:0;margin:0 0 22px}
  .ability-assurance-symbol>.icon{width:28px;height:28px}
  .ability-assurance-symbol>.icon:not(:first-child){display:none}
  .ability-assurance h3{max-width:24ch;font-size:27px;line-height:1.25;letter-spacing:-.7px;margin-bottom:18px}
  .ability-assurance p{font-size:16px;line-height:1.75;max-width:38ch}
  .ability-contact{display:block;padding-top:28px}
  .ability-contact>p{display:none}
  .ability-contact>a{justify-content:space-between;margin:0;min-height:48px;font-size:16px}

  /* Keep project previews generous, with only the result below each image. */
  .projects-section .projects-grid{grid-template-columns:minmax(0,1fr);gap:64px}
  .projects-section .project-content,.projects-section .project-featured .project-content{display:block;padding:24px 0 0}
  .projects-section .project-heading,.projects-section .project-featured .project-heading{margin-bottom:12px;align-items:center}
  .projects-section .project-heading h3,.projects-section .project-featured .project-heading h3{font-size:28px;line-height:1.2;letter-spacing:-.7px}
  .projects-section .project-heading>.icon{width:22px;height:22px}
  .projects-section .project-content>p,.projects-section .project-featured .project-content>p{max-width:37ch;font-size:16px;line-height:1.7;color:#aab8d1}
  .projects-section .project-stage.stage-card,.projects-section .project-featured .project-stage.stage-card{padding:16px}
  .projects-section .project-stage-vectra.stage-card{padding:14px}

  /* Four short steps form a single readable vertical route. */
  .process-grid{grid-template-columns:minmax(0,1fr);gap:30px;margin-top:0}
  .process-step{position:relative;display:grid;grid-template-columns:38px minmax(0,1fr);column-gap:16px;row-gap:7px}
  .process-step:not(:last-child):before{content:"";position:absolute;left:18px;top:46px;bottom:-21px;width:1px;background:linear-gradient(#7889c14d,#7889c11f)}
  .process-step-symbol{display:grid;place-items:center;grid-column:1;grid-row:1/3;width:38px;height:38px;border:1px solid #7684bb45;border-radius:12px;background:#1c2234;color:#b6b9ff}
  .process-step-symbol>.icon{width:20px;height:20px}
  .process-step h3{grid-column:2;margin:2px 0 0;font-size:20px;line-height:1.35;letter-spacing:-.3px}
  .process-step p{grid-column:2;max-width:32ch;margin:0;font-size:15px;line-height:1.7;color:#a4b2cc}
  .process-note{display:flex;align-items:flex-start;gap:10px;margin-top:36px;padding:0;border:0;border-radius:0;background:none}
  .process-note>.icon{margin-top:3px;flex-shrink:0}
  .process-note p{max-width:30ch;flex:1;font-size:14px;line-height:1.7}
  .process-note a{display:none}

  .faq-layout{display:block}
  .faq-intro p{display:none}
  .faq-list{margin-top:32px}
  .faq-item summary{min-height:74px;padding-block:20px;font-size:16px;line-height:1.5;gap:16px}
  .faq-item summary>.icon{width:19px;height:19px}
  .faq-answer{padding:0 0 24px}
  .faq-answer p{font-size:15px;line-height:1.8}

  /* One contact action, a writing prompt and the actual availability. */
  .contact-section{padding-top:0;padding-bottom:64px}
  .contact-panel{padding:30px 23px 24px;border-radius:20px}
  .contact-body{padding:0 0 26px}
  .contact-body h2{max-width:14ch;font-size:32px;line-height:1.15;letter-spacing:-1px}
  .contact-body h2>[data-copy-compact]{color:inherit}
  .contact-body p{max-width:32ch;margin-top:20px;font-size:16px;line-height:1.7}
  .contact-start{gap:18px;padding-bottom:24px}
  .contact-start>.button{min-height:54px;font-size:16px;line-height:1.5;padding:14px 16px}
  .contact-start>p{font-size:15px;line-height:1.6;color:#dedfff}
  .contact-bottom{padding-top:20px;gap:0}
  .contact-bottom .contact-handle,.contact-bottom .copy-contact{display:none}
  .contact-bottom>p{flex-basis:100%;font-size:13px;line-height:1.7;gap:9px}
  .contact-note{padding-top:17px;font-size:14px;line-height:1.7}
  .footer-main>.footer-positioning{display:none}

  /* Case pages keep the full story and screenshots, with more room between them. */
  .case-hero{padding-top:32px}
  .case-subtitle{font-size:16px;line-height:1.75;margin-block:24px 28px}
  .case-story{padding-block:80px}
  .story-sidebar{margin-bottom:40px}
  .story-content>article{margin-bottom:42px}
  .story-content h3{font-size:24px;line-height:1.25;margin-bottom:16px}
  .story-content p{font-size:16px;line-height:1.8}
  .case-features-grid{gap:34px 22px}
  .case-features-grid h3{font-size:18px;line-height:1.35}
  .case-features-grid p{font-size:15px;line-height:1.75}
  .portfolio-gallery .screen-stories,.gallery-portrait .screen-stories{gap:56px}
  .portfolio-gallery .screen-story-note h3{font-size:24px;margin-bottom:14px}
  .portfolio-gallery .screen-story-note>p{font-size:16px;line-height:1.75}
}

@media(max-width:360px){
  .service-disclosure>summary{gap:12px}
  .service-disclosure-title{font-size:17px}
  .contact-panel{padding-inline:20px}
  .contact-body h2{font-size:30px}
}

@keyframes service-disclosure-enter{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.service-disclosure-toggle{transition:none}.service-disclosure[open] .service-disclosure-body{animation:none}}
