/* OrganicMetric — iOS App Development page */

:root{
  --ios-ink:#0b1020;
  --ios-muted:#687386;
  --ios-line:#e6eaf1;
  --ios-pale:#f6f8fc;
  --ios-blue:#2f7cff;
  --ios-violet:#6548ff;
  --ios-lime:#c9ff4a;
  --ios-navy:#0b1225;
}

.om-ios{
  font-family:'DM Sans',sans-serif;
  color:var(--ios-ink);
  background:#fff;
  overflow:hidden;
}
.om-ios *{box-sizing:border-box}
.om-ios a{text-decoration:none;color:inherit}
.om-ios button{font-family:inherit}
.om-ios h1,.om-ios h2,.om-ios h3{font-family:'Space Grotesk',sans-serif}
.om-ios-wrap{max-width:1180px;margin:0 auto;padding:0 28px}

.ios-hero{
  padding:122px 0 76px;
  background:
    radial-gradient(circle at 76% 42%,rgba(47,124,255,.13),transparent 28%),
    radial-gradient(circle at 89% 18%,rgba(101,72,255,.10),transparent 25%),
    linear-gradient(135deg,#fff 0%,#fbfcff 58%,#f3f1ff 100%);
  border-bottom:1px solid var(--ios-line);
}
.ios-hero-grid{display:grid;grid-template-columns:.94fr 1.06fr;gap:48px;align-items:center}
.ios-breadcrumb{display:flex;gap:9px;align-items:center;color:#7c8697;font-size:11px;margin-bottom:28px}
.ios-breadcrumb a:hover{color:var(--ios-blue)}
.ios-kicker{font-size:10px;font-weight:900;letter-spacing:1.7px;text-transform:uppercase;color:var(--ios-blue)}
.ios-kicker.light{color:var(--ios-lime)}
.ios-hero h1{font-size:clamp(46px,5.2vw,72px);line-height:.99;letter-spacing:-3.8px;margin:14px 0 22px;max-width:690px}
.ios-hero h1 em{font-style:normal;color:var(--ios-blue)}
.ios-lead{font-size:17px;line-height:1.75;color:var(--ios-muted);max-width:610px;margin:0}
.ios-check-list{display:grid;gap:10px;margin:24px 0 0}
.ios-check-list span{display:flex;align-items:center;gap:10px;font-size:12px;color:#556175}
.ios-check-list i{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:#eafbd0;color:#356500;font-size:10px;font-style:normal;font-weight:900}
.ios-actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:28px}
.ios-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:0;border-radius:12px;padding:14px 19px;background:linear-gradient(135deg,var(--ios-blue),var(--ios-violet));color:#fff;font-size:12px;font-weight:800;cursor:pointer;box-shadow:0 14px 30px rgba(47,124,255,.20)}
.ios-btn:hover{transform:translateY(-1px)}
.ios-btn-light{background:#fff;color:var(--ios-ink);border:1px solid var(--ios-line);box-shadow:none}
.ios-hero-note{display:flex;align-items:center;gap:8px;margin-top:20px;color:#8992a2;font-size:10px}
.ios-note-dot{width:7px;height:7px;border-radius:50%;background:var(--ios-lime);box-shadow:0 0 0 4px rgba(201,255,74,.18)}

.ios-hero-visual{min-height:560px;position:relative;display:grid;place-items:center}
.ios-orbit{position:absolute;border-radius:50%;border:1px solid rgba(47,124,255,.13)}
.ios-orbit-one{width:470px;height:470px}
.ios-orbit-two{width:610px;height:610px;border-color:rgba(101,72,255,.08)}
.ios-device{position:absolute;filter:drop-shadow(0 30px 45px rgba(11,16,32,.18));transition:transform .4s}
.ios-device-front{z-index:3;transform:rotate(4deg) translate(36px,2px)}
.ios-device-back{z-index:2;transform:rotate(-13deg) translate(-122px,34px)}
.ios-device-frame{padding:8px;border-radius:40px;background:linear-gradient(145deg,#f9fbff,#b9c1ce);box-shadow:inset 0 0 0 1px rgba(0,0,0,.14)}
.ios-device-front .ios-device-frame{width:245px;height:500px}
.ios-device-back .ios-device-frame{width:220px;height:455px}
.ios-screen{width:100%;height:100%;border-radius:34px;overflow:hidden;position:relative;padding:20px 16px}
.ios-screen-front{background:linear-gradient(160deg,#14233f,#0b1020 68%,#31246b);color:#fff}
.ios-screen-back{background:linear-gradient(160deg,#eff6ff,#e8e5ff);color:#11182a}
.ios-notch{position:absolute;top:0;left:50%;transform:translateX(-50%);width:92px;height:22px;border-radius:0 0 14px 14px;background:#080d19}
.ios-status{display:flex;justify-content:space-between;font-size:7px;font-weight:700;opacity:.75}
.ios-status.light{margin-top:3px}
.ios-app-label{font-size:8px;font-weight:900;letter-spacing:1.5px;color:var(--ios-blue);margin-top:26px}
.ios-app-top{display:flex;justify-content:space-between;align-items:center;margin-top:30px;font-size:8px;color:#b9c4d8}
.ios-screen-title{font:500 24px/1.05 'Space Grotesk',sans-serif;letter-spacing:-1px;margin-top:15px}
.ios-screen-title strong{font-weight:700;color:#72a7ff}
.ios-screen-back .ios-screen-title{font-size:21px}
.ios-screen-back .ios-screen-title strong{color:#6148ff}
.ios-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:23px}
.ios-action-grid>div{min-height:78px;padding:11px;border:1px solid rgba(255,255,255,.11);border-radius:14px;background:rgba(255,255,255,.07);backdrop-filter:blur(10px)}
.ios-action-grid span{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:#2f7cff;font-size:12px;margin-bottom:8px}
.ios-action-grid b{display:block;font-size:8px}
.ios-action-grid small{display:block;color:#9aa7bc;font-size:6px;margin-top:3px}
.ios-bottom-card{margin-top:10px;padding:12px;border-radius:15px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08)}
.ios-bottom-card>div{display:flex;justify-content:space-between;color:#aab6ca;font-size:6px}
.ios-bottom-card>div b{color:#70a5ff}
.ios-bottom-card>strong{display:block;font:700 27px 'Space Grotesk';margin-top:8px}
.ios-bottom-card>small{font-size:6px;color:#9aa7bc}
.ios-chart{height:100px;display:flex;align-items:end;gap:7px;margin:22px 0 13px;padding:0 5px}
.ios-chart span{flex:1;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,#674cff,#b1a4ff)}
.ios-mini-card{padding:12px;border-radius:13px;background:#fff;box-shadow:0 12px 28px rgba(53,49,111,.12)}
.ios-mini-card b{font-size:7px;color:#697388;display:block}
.ios-mini-card strong{font:700 22px 'Space Grotesk';display:block;margin-top:3px;color:#16203a}
.ios-float-card{position:absolute;z-index:5;display:flex;align-items:center;gap:10px;padding:12px 14px;background:rgba(255,255,255,.94);border:1px solid rgba(230,234,241,.95);border-radius:16px;box-shadow:0 18px 45px rgba(18,25,48,.12);backdrop-filter:blur(14px)}
.ios-float-card b{display:block;font:700 11px 'Space Grotesk'}
.ios-float-card small{display:block;color:#7c8697;font-size:8px;margin-top:2px}
.ios-float-icon{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:#edf3ff;color:var(--ios-blue);font-weight:900}
.ios-float-swift{left:3%;bottom:105px}
.ios-float-secure{right:2%;top:92px}
.ios-device-front:hover{transform:rotate(2deg) translate(36px,-5px)}
.ios-device-back:hover{transform:rotate(-10deg) translate(-122px,28px)}

.ios-section{padding:88px 0}
.ios-value-section{padding:54px 0;border-bottom:1px solid var(--ios-line)}
.ios-value-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
.ios-value-card{text-align:center;padding:12px 18px}
.ios-value-icon{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;margin:0 auto 16px;background:#f0ebff;color:#7a58ff;font-size:18px}
.ios-value-icon.green{background:#eafbd9;color:#1bb36a}
.ios-value-icon.blue{background:#eaf2ff;color:var(--ios-blue)}
.ios-value-icon.purple{background:#f2ecff;color:#7655ff}
.ios-value-card h3{font-size:16px;margin:0 0 7px}
.ios-value-card p{font-size:11px;line-height:1.6;color:var(--ios-muted);max-width:210px;margin:0 auto}

.ios-pale{background:var(--ios-pale)}
.ios-section-head{display:flex;justify-content:space-between;gap:45px;align-items:end;margin-bottom:36px}
.ios-section-head h2{font-size:clamp(34px,4.2vw,53px);line-height:1.02;letter-spacing:-2.7px;margin:9px 0 0;max-width:730px}
.ios-section-head>p{max-width:410px;margin:0;color:var(--ios-muted);font-size:12px;line-height:1.7}
.ios-process-box{padding:30px;border:1px solid #e0e6f0;border-radius:28px;background:linear-gradient(135deg,#f2f6ff,#f8f5ff)}
.ios-process-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:11px}
.ios-process-card{background:#fff;border:1px solid #e4e8ef;border-radius:18px;padding:19px;min-height:235px;position:relative;box-shadow:0 12px 30px rgba(18,25,48,.035)}
.ios-step{position:absolute;right:14px;top:13px;color:#8a94a6;font-size:9px;font-weight:900}
.ios-process-icon{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:#edf3ff;color:var(--ios-blue);font-weight:900;margin-bottom:25px}
.ios-process-card h3{font-size:17px;margin:0 0 8px}
.ios-process-card p{font-size:10px;line-height:1.6;color:var(--ios-muted);margin:0}
.ios-flow{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;margin-top:25px;color:#667286;font-size:10px;font-weight:800}
.ios-flow b{color:#a6afbd}

.ios-build-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:15px}
.ios-build-card{border:1px solid var(--ios-line);border-radius:23px;overflow:hidden;background:#fff}
.ios-build-large{grid-row:span 2;display:grid;grid-template-rows:1.08fr auto}
.ios-build-art{min-height:270px;position:relative;overflow:hidden;background:linear-gradient(145deg,#f0f6ff,#f5f1ff)}
.ios-build-card:not(.ios-build-large) .ios-build-art{min-height:205px}
.ios-build-copy{padding:23px}
.ios-card-label{font-size:9px;font-weight:900;letter-spacing:1.4px;color:var(--ios-blue)}
.ios-build-copy h3{font-size:22px;letter-spacing:-1px;margin:8px 0 8px}
.ios-build-copy p{font-size:11px;line-height:1.65;color:var(--ios-muted);margin:0}
.ios-tag-row{display:flex;gap:7px;flex-wrap:wrap;margin-top:15px}
.ios-tag-row span{padding:7px 9px;border-radius:999px;background:#f3f6fb;color:#5f6a7d;font-size:9px}
.analytics-art:before{content:"";position:absolute;width:330px;height:330px;border-radius:50%;background:radial-gradient(circle,rgba(47,124,255,.18),transparent 68%);left:15%;top:-40px}
.mini-phone{position:absolute;left:17%;bottom:-28px;width:170px;height:255px;border-radius:28px;background:#11182a;padding:6px;box-shadow:0 25px 45px rgba(22,31,56,.24);transform:rotate(-7deg)}
.mini-phone:after{content:"";position:absolute;top:5px;left:50%;transform:translateX(-50%);width:55px;height:13px;border-radius:0 0 9px 9px;background:#080d18}
.mini-phone-top{height:26px}
.mini-phone-title{font:700 16px 'Space Grotesk';color:#fff;padding:8px 12px}
.mini-bars{height:110px;display:flex;align-items:end;gap:7px;padding:10px 12px}
.mini-bars i{flex:1;border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,#74aaff,#624bff)}
.mini-bars i:nth-child(1){height:35%}.mini-bars i:nth-child(2){height:55%}.mini-bars i:nth-child(3){height:46%}.mini-bars i:nth-child(4){height:75%}.mini-bars i:nth-child(5){height:92%}
.mini-line{height:1px;background:rgba(255,255,255,.14);margin:0 12px}
.mini-data-card{position:absolute;right:13%;top:53px;padding:15px 17px;border-radius:15px;background:#fff;box-shadow:0 18px 38px rgba(27,35,56,.12);min-width:140px}
.mini-data-card small{display:block;color:#7d8797;font-size:8px}.mini-data-card b{display:block;font:700 23px 'Space Grotesk';margin:4px 0}.mini-data-card span{font-size:8px;color:#18a866;font-weight:800}
.commerce-art{background:linear-gradient(145deg,#fff5ed,#f4efff);display:grid;place-items:center}
.mini-commerce{width:180px;background:#fff;border-radius:18px;padding:12px;box-shadow:0 18px 40px rgba(40,32,60,.12);transform:rotate(4deg)}
.commerce-img{display:block;height:82px;border-radius:12px;background:linear-gradient(135deg,#ffcc9e,#8d7aff);margin-bottom:10px}
.mini-commerce b{display:block;font:700 11px 'Space Grotesk'}.mini-commerce small{display:block;color:#818b9c;font-size:7px;margin-top:3px}.mini-commerce button{margin-top:10px;border:0;border-radius:8px;padding:7px 11px;background:#121a2d;color:#fff;font-size:8px}
.service-art{background:linear-gradient(145deg,#effcff,#eef3ff)}
.service-map{position:absolute;inset:22px 18px 70px;border-radius:17px;background:radial-gradient(circle at 30% 25%,#fff 0 7%,transparent 8%),repeating-linear-gradient(135deg,rgba(47,124,255,.08) 0 2px,transparent 2px 17px);border:1px solid #dfe8f4}
.service-map span{position:absolute;left:33%;top:35%;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#2f7cff;color:#fff;font-size:8px;box-shadow:0 0 0 8px rgba(47,124,255,.12)}
.service-map i{position:absolute;right:20%;top:55%;width:10px;height:10px;border-radius:50%;background:#c9ff4a;box-shadow:0 0 0 7px rgba(201,255,74,.18)}
.service-map b{position:absolute;left:13px;bottom:13px;font-size:8px;color:#536075}
.service-request{position:absolute;left:18%;right:18%;bottom:19px;background:#fff;border-radius:13px;padding:11px 13px;box-shadow:0 15px 30px rgba(33,48,70,.12)}
.service-request strong{display:block;font-size:9px}.service-request small{display:block;color:#7c8697;font-size:7px;margin-top:2px}.service-request button{margin-top:7px;border:0;border-radius:7px;background:#2f7cff;color:#fff;padding:6px 10px;font-size:7px}

.ios-dark{background:var(--ios-navy);color:#fff}
.ios-dark-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:55px;align-items:center}
.ios-dark h2{font-size:clamp(38px,4.5vw,58px);line-height:1.02;letter-spacing:-2.9px;margin:10px 0 17px}
.ios-dark-copy>p{color:#aeb8c9;font-size:13px;line-height:1.75;max-width:540px}
.ios-dark-checks{display:grid;gap:11px;margin:25px 0}
.ios-dark-checks div{display:flex;gap:10px;align-items:flex-start;color:#d9dfeb;font-size:12px}
.ios-dark-checks i{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:var(--ios-lime);color:#10162a;font-size:10px;font-style:normal;font-weight:900;flex:0 0 18px}
.ios-tech-visual{min-height:440px;position:relative;display:grid;place-items:center}
.tech-orb{width:350px;height:350px;border-radius:50%;background:radial-gradient(circle,#273e70 0%,#161f38 48%,transparent 70%);filter:blur(1px)}
.tech-app-icon{position:absolute;width:145px;height:145px;border-radius:34px;background:linear-gradient(145deg,#6e59ff,#2f7cff);box-shadow:0 30px 70px rgba(47,124,255,.30),inset 0 1px 0 rgba(255,255,255,.3);display:grid;place-items:center;transform:rotate(-7deg)}
.tech-app-icon span{font:500 74px 'Space Grotesk';color:#fff;transform:rotate(7deg)}
.tech-chip{position:absolute;min-width:145px;padding:12px 14px;border-radius:15px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.11);backdrop-filter:blur(12px)}
.tech-chip b{display:block;font:700 12px 'Space Grotesk';color:#fff}.tech-chip small{display:block;color:#8f9bb1;font-size:8px;margin-top:2px}
.chip-swift{left:5%;top:56px}.chip-ui{right:4%;top:92px}.chip-api{left:9%;bottom:68px}.chip-test{right:8%;bottom:48px}

.ios-industry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ios-industry-grid article{display:flex;align-items:center;gap:11px;padding:15px;border-radius:17px;background:#fff;border:1px solid #e1e6ef;box-shadow:0 10px 25px rgba(18,25,48,.03)}
.ios-industry-grid article>span{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:#edf3ff;color:var(--ios-blue);font-weight:900}
.ios-industry-grid h3{font:700 13px 'Space Grotesk';margin:0}.ios-industry-grid small{display:block;color:#7b8596;font-size:8px;line-height:1.4;margin-top:3px}

.ios-cta-wrap{padding-top:0;padding-bottom:20px}
.ios-cta{min-height:330px;border-radius:27px;overflow:hidden;background:linear-gradient(120deg,#0c1429,#151e38 52%,#25205a);position:relative;display:grid;grid-template-columns:1fr .55fr;align-items:center;padding:46px 48px;color:#fff}
.ios-cta:before{content:"";position:absolute;width:480px;height:480px;border-radius:50%;right:-120px;top:-120px;background:radial-gradient(circle,rgba(47,124,255,.25),transparent 68%)}
.ios-cta-copy{position:relative;z-index:2;max-width:630px}
.ios-cta h2{font-size:clamp(35px,4vw,52px);line-height:1.02;letter-spacing:-2.5px;margin:9px 0 13px}
.ios-cta p{color:#aeb8c9;font-size:12px;line-height:1.7;max-width:520px}
.ios-cta-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.ios-btn-white{background:#fff;color:#11182a;box-shadow:none}
.ios-btn-outline{background:transparent;border:1px solid rgba(255,255,255,.24);color:#fff;box-shadow:none}
.ios-cta-device{height:270px;position:relative;z-index:1;display:grid;place-items:end center}
.cta-phone{width:190px;height:300px;border-radius:30px 30px 0 0;background:linear-gradient(160deg,#eaf1ff,#7370d6);padding:42px 19px 18px;transform:rotate(9deg) translateY(48px);box-shadow:0 25px 60px rgba(0,0,0,.3);position:relative}
.cta-phone:before{content:"";position:absolute;inset:7px;border-radius:24px 24px 0 0;background:linear-gradient(160deg,#10182b,#20254e)}
.cta-phone>*{position:relative;z-index:2}
.cta-phone-notch{position:absolute!important;top:8px;left:50%;transform:translateX(-50%);width:68px;height:16px;border-radius:0 0 9px 9px;background:#080d18}
.cta-small{display:block;color:#8ea0c0;font-size:8px;margin-bottom:16px}.cta-phone strong{display:block;color:#fff;font:700 25px/1.02 'Space Grotesk';letter-spacing:-1px}.cta-pill{display:inline-block;margin-top:28px;background:#2f7cff;color:#fff;padding:8px 11px;border-radius:9px;font-size:7px}

.ios-faq-section{padding-top:60px}
.ios-faq{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.ios-faq details{border:1px solid var(--ios-line);border-radius:15px;padding:17px 18px;background:#fff}
.ios-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:15px;font-size:12px;font-weight:800}
.ios-faq summary::-webkit-details-marker{display:none}
.ios-faq summary:after{content:'+';color:var(--ios-blue);font-size:18px;line-height:1}
.ios-faq details[open] summary:after{content:'−'}
.ios-faq details p{font-size:11px;line-height:1.7;color:var(--ios-muted);margin:12px 0 0}

.ios-modal[hidden]{display:none}
.ios-modal{position:fixed;inset:0;z-index:3000;display:grid;place-items:center;padding:18px}
.ios-modal-backdrop{position:absolute;inset:0;background:rgba(7,12,25,.62);backdrop-filter:blur(8px)}
.ios-modal-card{position:relative;width:min(850px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:25px;box-shadow:0 35px 100px rgba(0,0,0,.28);padding:28px}
.ios-modal-head{display:flex;justify-content:space-between;gap:25px;margin-bottom:22px}
.ios-modal-head h2{font:700 30px/1.05 'Space Grotesk';letter-spacing:-1.4px;margin:8px 0}
.ios-modal-head p{font-size:11px;color:var(--ios-muted);line-height:1.6;margin:0;max-width:560px}
.ios-modal-close{border:0;background:#f3f5f8;width:38px;height:38px;border-radius:11px;font-size:22px;color:#596477;cursor:pointer;flex:0 0 38px}
.ios-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ios-form-grid label{display:grid;gap:7px}
.ios-form-grid label.ios-form-full{grid-column:1/-1}
.ios-form-grid label>span{font-size:10px;font-weight:800;color:#485467}
.ios-form-grid label>span b{color:#d33b57}
.ios-form-grid input,.ios-form-grid select,.ios-form-grid textarea{width:100%;border:1px solid #dfe4eb;background:#fafbfd;border-radius:12px;padding:12px 13px;outline:0;font:500 12px 'DM Sans',sans-serif;color:var(--ios-ink)}
.ios-form-grid textarea{resize:vertical;min-height:120px}
.ios-form-grid input:focus,.ios-form-grid select:focus,.ios-form-grid textarea:focus{border-color:var(--ios-blue);box-shadow:0 0 0 4px rgba(47,124,255,.09);background:#fff}
.ios-form-grid input:invalid:not(:placeholder-shown),.ios-form-grid select:invalid,.ios-form-grid textarea:invalid:not(:placeholder-shown){border-color:#e0a2ad}
.ios-form-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:18px;padding-top:18px;border-top:1px solid #edf0f4}
.ios-form-bottom small{font-size:9px;color:#8791a1;line-height:1.5}
.ios-submit{border:0;border-radius:12px;background:linear-gradient(135deg,var(--ios-blue),var(--ios-violet));color:#fff;padding:13px 17px;font:800 12px 'DM Sans',sans-serif;cursor:pointer;white-space:nowrap}
.ios-form-success{display:none;margin-top:15px;padding:13px 15px;border-radius:13px;background:#effbdc;border:1px solid #d8f29f;color:#2d4311;font-size:11px;line-height:1.6}
.ios-form-success.show{display:block}

@media(max-width:1050px){
  .ios-hero-grid,.ios-dark-grid{grid-template-columns:1fr;gap:20px}
  .ios-hero-copy{max-width:760px}
  .ios-hero-visual{min-height:580px}
  .ios-process-grid{grid-template-columns:repeat(3,1fr)}
  .ios-process-card:nth-child(4),.ios-process-card:nth-child(5){min-height:205px}
  .ios-industry-grid{grid-template-columns:repeat(2,1fr)}
  .ios-tech-visual{min-height:380px}
}
@media(max-width:720px){
  .om-ios-wrap{padding:0 17px}
  .ios-hero{padding:98px 0 45px}
  .ios-hero h1{font-size:43px;letter-spacing:-2.6px}
  .ios-lead{font-size:14px}
  .ios-actions{flex-direction:column}
  .ios-btn{width:100%}
  .ios-hero-visual{min-height:455px;transform:scale(.84);transform-origin:center top;margin-bottom:-60px}
  .ios-device-front .ios-device-frame{width:210px;height:430px}
  .ios-device-back .ios-device-frame{width:190px;height:395px}
  .ios-device-back{transform:rotate(-13deg) translate(-105px,25px)}
  .ios-device-front{transform:rotate(4deg) translate(22px,0)}
  .ios-float-swift{left:0;bottom:70px}.ios-float-secure{right:0;top:50px}
  .ios-section{padding:62px 0}
  .ios-value-grid{grid-template-columns:1fr 1fr;gap:22px 8px}
  .ios-section-head{display:block;margin-bottom:25px}
  .ios-section-head>p{margin-top:15px}
  .ios-process-box{padding:17px;border-radius:22px}
  .ios-process-grid{grid-template-columns:1fr 1fr}
  .ios-process-card{min-height:210px}
  .ios-process-card:last-child{grid-column:1/-1}
  .ios-flow{gap:8px}
  .ios-build-grid{grid-template-columns:1fr}
  .ios-build-large{grid-row:auto}
  .ios-build-art,.ios-build-card:not(.ios-build-large) .ios-build-art{min-height:230px}
  .ios-tech-visual{min-height:340px;transform:scale(.9)}
  .ios-industry-grid{grid-template-columns:1fr}
  .ios-cta{grid-template-columns:1fr;padding:34px 25px;min-height:480px}
  .ios-cta-device{height:190px}
  .cta-phone{transform:rotate(9deg) translateY(80px);width:155px;height:245px}
  .cta-phone strong{font-size:20px}
  .ios-faq{grid-template-columns:1fr}
  .ios-modal-card{padding:22px 17px;border-radius:20px}
  .ios-form-grid{grid-template-columns:1fr}
  .ios-form-grid label.ios-form-full{grid-column:auto}
  .ios-form-bottom{align-items:stretch;flex-direction:column}
  .ios-submit{width:100%}
}


/* =========================================================
   IOS PAGE READABILITY + LAYOUT FIX
   Keep page typography aligned with OrganicMetric service pages.
   ========================================================= */

.om-ios {
  font-size: 14px;
  line-height: 1.6;
}

/* Body copy: 14px minimum on normal readable content */
.om-ios p,
.om-ios li,
.om-ios .ios-check-list span,
.om-ios .ios-hero-note,
.om-ios .ios-value-card p,
.om-ios .ios-section-head > p,
.om-ios .ios-process-card p,
.om-ios .ios-build-copy p,
.om-ios .ios-dark-copy > p,
.om-ios .ios-dark-checks div,
.om-ios .ios-industry-grid small,
.om-ios .ios-faq details p,
.om-ios .ios-cta p {
  font-size: 14px;
  line-height: 1.65;
}

/* Keep small UI labels intentionally compact */
.om-ios .ios-kicker,
.om-ios .ios-card-label {
  font-size: 11px;
  line-height: 1.3;
}

.om-ios .ios-breadcrumb {
  font-size: 12px;
}

.om-ios .ios-hero h1 {
  font-size: clamp(48px, 5vw, 70px);
  line-height: 1.02;
  letter-spacing: -3px;
  max-width: 650px;
}

.om-ios .ios-lead {
  font-size: 17px;
  line-height: 1.7;
  max-width: 625px;
}

.om-ios .ios-check-list {
  gap: 12px;
}

.om-ios .ios-check-list span {
  color: #4f5c70;
}

/* =========================================================
   VALUE SECTION
   ========================================================= */

.om-ios .ios-value-section {
  padding: 62px 0;
}

.om-ios .ios-value-grid {
  gap: 24px;
}

.om-ios .ios-value-card {
  padding: 10px 22px;
}

.om-ios .ios-value-card h3 {
  font-size: 18px;
  margin-bottom: 9px;
}

.om-ios .ios-value-card p {
  max-width: 245px;
}

/* =========================================================
   PROCESS — more breathing room + readable cards
   ========================================================= */

.om-ios .ios-process-box {
  padding: 34px;
}

.om-ios .ios-process-grid {
  gap: 14px;
}

.om-ios .ios-process-card {
  min-height: 250px;
  padding: 22px;
}

.om-ios .ios-process-card h3 {
  font-size: 18px;
  margin-bottom: 10px;
}

.om-ios .ios-process-card p {
  color: #667286;
}

.om-ios .ios-process-icon {
  width: 42px;
  height: 42px;
  margin-bottom: 30px;
}

/* =========================================================
   WHAT WE BUILD — replace awkward tall masonry with
   balanced three-card layout
   ========================================================= */

.om-ios .ios-build-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.om-ios .ios-build-large {
  grid-row: auto;
  display: flex;
  flex-direction: column;
}

.om-ios .ios-build-art,
.om-ios .ios-build-card:not(.ios-build-large) .ios-build-art {
  min-height: 245px;
  height: 245px;
}

.om-ios .ios-build-copy {
  padding: 25px;
}

.om-ios .ios-build-copy h3 {
  font-size: 23px;
  line-height: 1.15;
  margin: 9px 0 10px;
}

.om-ios .ios-build-copy p {
  min-height: 72px;
}

/* Give the first visual a stronger composition */
.om-ios .analytics-art {
  display: block;
}

.om-ios .mini-phone {
  left: 18%;
  bottom: 20px;
  width: 155px;
  height: 220px;
}

.om-ios .mini-data-card {
  right: 11%;
  top: 44px;
}

/* =========================================================
   DARK WHY SECTION
   ========================================================= */

.om-ios .ios-dark {
  padding: 96px 0;
}

.om-ios .ios-dark h2 {
  max-width: 570px;
}

.om-ios .ios-dark-copy > p {
  max-width: 590px;
}

.om-ios .ios-dark-checks {
  gap: 13px;
}

.om-ios .ios-dark-checks div {
  color: #d8dfeb;
}

/* =========================================================
   INDUSTRIES — larger, cleaner cards
   ========================================================= */

.om-ios .ios-industry-grid {
  gap: 14px;
}

.om-ios .ios-industry-grid article {
  min-height: 78px;
  padding: 17px;
}

.om-ios .ios-industry-grid h3 {
  font-size: 15px;
}

.om-ios .ios-industry-grid small {
  font-size: 12px;
  line-height: 1.45;
}

/* =========================================================
   CTA
   ========================================================= */

.om-ios .ios-cta {
  min-height: 350px;
  padding: 52px;
}

.om-ios .ios-cta h2 {
  font-size: clamp(38px, 4vw, 54px);
}

.om-ios .ios-cta p {
  font-size: 14px;
  max-width: 560px;
}

/* =========================================================
   FAQ
   ========================================================= */

.om-ios .ios-faq {
  gap: 13px;
}

.om-ios .ios-faq details {
  padding: 20px 21px;
}

.om-ios .ios-faq summary {
  font-size: 14px;
  line-height: 1.45;
}

.om-ios .ios-faq details p {
  font-size: 14px;
}

/* =========================================================
   BUTTONS
   ========================================================= */

.om-ios .ios-btn,
.om-ios .ios-submit {
  font-size: 14px;
  min-height: 48px;
}

/* =========================================================
   MODAL FORM
   ========================================================= */

.om-ios .ios-modal-head h2 {
  font-size: 34px;
}

.om-ios .ios-modal-head p {
  font-size: 14px;
}

.om-ios .ios-form-grid label > span {
  font-size: 12px;
}

.om-ios .ios-form-grid input,
.om-ios .ios-form-grid select,
.om-ios .ios-form-grid textarea {
  font-size: 14px;
  min-height: 48px;
}

.om-ios .ios-form-bottom small {
  font-size: 12px;
}

/* =========================================================
   DESKTOP WIDTH / BALANCE
   ========================================================= */

@media (min-width: 1200px) {
  .om-ios-wrap {
    max-width: 1240px;
  }

  .om-ios .ios-hero {
    padding-top: 118px;
    padding-bottom: 84px;
  }

  .om-ios .ios-hero-visual {
    min-height: 600px;
  }
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {
  .om-ios .ios-build-grid {
    grid-template-columns: 1fr 1fr;
  }

  .om-ios .ios-build-card:last-child {
    grid-column: 1 / -1;
  }
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 720px) {
  .om-ios {
    font-size: 14px;
  }

  .om-ios .ios-hero {
    padding-top: 88px;
  }

  .om-ios .ios-hero h1 {
    font-size: 44px;
    letter-spacing: -2.5px;
  }

  .om-ios .ios-lead {
    font-size: 16px;
  }

  .om-ios .ios-value-grid {
    grid-template-columns: 1fr 1fr;
  }

  .om-ios .ios-process-grid {
    grid-template-columns: 1fr;
  }

  .om-ios .ios-process-card,
  .om-ios .ios-process-card:nth-child(4),
  .om-ios .ios-process-card:nth-child(5) {
    min-height: auto;
  }

  .om-ios .ios-build-grid {
    grid-template-columns: 1fr;
  }

  .om-ios .ios-build-card:last-child {
    grid-column: auto;
  }

  .om-ios .ios-build-art,
  .om-ios .ios-build-card:not(.ios-build-large) .ios-build-art {
    min-height: 230px;
    height: 230px;
  }

  .om-ios .ios-build-copy p {
    min-height: 0;
  }

  .om-ios .ios-section-head h2 {
    font-size: 36px;
    letter-spacing: -2px;
  }

  .om-ios .ios-section-head > p {
    font-size: 14px;
  }

  .om-ios .ios-cta {
    padding: 34px 24px;
  }
}

/* =========================================================
   ORGANICMETRIC iOS — FINAL RESPONSIVE LAYOUT FIX
   This section intentionally overrides the older masonry
   rules without requiring any HTML changes.
   ========================================================= */

.om-ios,
.om-ios * {
  box-sizing: border-box;
}

.om-ios {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

.om-ios-wrap {
  width: 100%;
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto;
}

/* ---------------------------------------------------------
   WHAT WE BUILD — DESKTOP
   Three cards. No masonry. No row spanning.
   --------------------------------------------------------- */

.om-ios .ios-build-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: auto !important;
  gap: 18px !important;
  align-items: stretch !important;
}

.om-ios .ios-build-grid > .ios-build-card,
.om-ios .ios-build-grid > .ios-build-large {
  grid-column: auto !important;
  grid-row: auto !important;
  min-width: 0 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-self: stretch !important;
}

.om-ios .ios-build-grid > .ios-build-card .ios-build-art,
.om-ios .ios-build-grid > .ios-build-large .ios-build-art {
  flex: 0 0 250px !important;
  width: 100% !important;
  min-height: 250px !important;
  height: 250px !important;
  position: relative;
  overflow: hidden;
}

.om-ios .ios-build-grid > .ios-build-card .ios-build-copy,
.om-ios .ios-build-grid > .ios-build-large .ios-build-copy {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  width: 100% !important;
  padding: 24px !important;
  display: flex !important;
  flex-direction: column !important;
}

.om-ios .ios-build-grid > .ios-build-card .ios-build-copy h3,
.om-ios .ios-build-grid > .ios-build-large .ios-build-copy h3 {
  margin: 9px 0 9px;
}

.om-ios .ios-build-grid > .ios-build-card .ios-build-copy p,
.om-ios .ios-build-grid > .ios-build-large .ios-build-copy p {
  margin: 0;
  min-height: 0 !important;
}

.om-ios .ios-build-grid > .ios-build-large .ios-tag-row {
  margin-top: 15px !important;
}

/* Analytics / phone artwork */
.om-ios .analytics-art {
  position: relative;
  isolation: isolate;
}

.om-ios .analytics-art::before {
  z-index: 0;
}

.om-ios .analytics-art .mini-phone {
  z-index: 2;
  left: 17%;
  bottom: 10px;
  width: 155px;
  height: 225px;
}

.om-ios .analytics-art .mini-data-card {
  z-index: 3;
  right: 9%;
  top: 34px;
}

/* Commerce artwork */
.om-ios .commerce-art {
  display: grid;
  place-items: center;
}

.om-ios .commerce-art .mini-commerce {
  position: relative;
  z-index: 2;
  width: 180px;
  max-width: calc(100% - 60px);
}

/* Service artwork */
.om-ios .service-art {
  position: relative;
}

.om-ios .service-art .service-map {
  z-index: 1;
}

.om-ios .service-art .service-request {
  z-index: 3;
}

/* ---------------------------------------------------------
   TABLET — 2 + 1 balanced cards
   --------------------------------------------------------- */

@media (max-width: 1050px) {
  .om-ios .ios-build-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .om-ios .ios-build-grid > .ios-build-card:last-child,
  .om-ios .ios-build-grid > .ios-build-large:last-child {
    grid-column: 1 / -1 !important;
  }

  .om-ios .ios-build-grid > .ios-build-card .ios-build-art,
  .om-ios .ios-build-grid > .ios-build-large .ios-build-art {
    flex-basis: 235px !important;
    min-height: 235px !important;
    height: 235px !important;
  }
}

/* ---------------------------------------------------------
   MOBILE — one card per row, no stretching
   --------------------------------------------------------- */

@media (max-width: 720px) {
  .om-ios {
    overflow-x: clip;
  }

  .om-ios-wrap {
    width: 100%;
    max-width: 100%;
    padding-left: 17px;
    padding-right: 17px;
  }

  .om-ios .ios-build-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-rows: auto !important;
    gap: 16px !important;
  }

  .om-ios .ios-build-grid > .ios-build-card,
  .om-ios .ios-build-grid > .ios-build-large {
    grid-column: auto !important;
    grid-row: auto !important;
    width: 100% !important;
    height: auto !important;
  }

  .om-ios .ios-build-grid > .ios-build-card .ios-build-art,
  .om-ios .ios-build-grid > .ios-build-large .ios-build-art {
    flex-basis: 225px !important;
    min-height: 225px !important;
    height: 225px !important;
  }

  .om-ios .ios-build-grid > .ios-build-card .ios-build-copy,
  .om-ios .ios-build-grid > .ios-build-large .ios-build-copy {
    padding: 21px !important;
  }

  .om-ios .analytics-art .mini-phone {
    left: 12%;
    bottom: 8px;
    width: 145px;
    height: 210px;
  }

  .om-ios .analytics-art .mini-data-card {
    right: 7%;
    top: 28px;
  }

  .om-ios .commerce-art .mini-commerce {
    width: 170px;
    max-width: calc(100% - 48px);
  }

  .om-ios .service-art .service-map {
    inset: 18px 15px 66px;
  }

  .om-ios .service-art .service-request {
    left: 14%;
    right: 14%;
    bottom: 14px;
  }
}

/* ---------------------------------------------------------
   SMALL PHONES
   --------------------------------------------------------- */

@media (max-width: 420px) {
  .om-ios-wrap {
    padding-left: 14px;
    padding-right: 14px;
  }

  .om-ios .ios-build-grid {
    gap: 14px !important;
  }

  .om-ios .ios-build-grid > .ios-build-card .ios-build-art,
  .om-ios .ios-build-grid > .ios-build-large .ios-build-art {
    flex-basis: 210px !important;
    min-height: 210px !important;
    height: 210px !important;
  }

  .om-ios .ios-build-grid > .ios-build-card .ios-build-copy,
  .om-ios .ios-build-grid > .ios-build-large .ios-build-copy {
    padding: 19px !important;
  }

  .om-ios .analytics-art .mini-phone {
    left: 9%;
    width: 138px;
    height: 198px;
  }

  .om-ios .analytics-art .mini-data-card {
    right: 5%;
    top: 25px;
  }

  .om-ios .commerce-art .mini-commerce {
    width: 160px;
  }

  .om-ios .service-art .service-request {
    left: 11%;
    right: 11%;
  }
}

/* ---------------------------------------------------------
   Responsive section headings / cards safety
   --------------------------------------------------------- */

@media (max-width: 720px) {
  .om-ios .ios-section-head,
  .om-ios .ios-section-head > div,
  .om-ios .ios-build-card,
  .om-ios .ios-build-copy {
    min-width: 0;
  }

  .om-ios .ios-section-head h2,
  .om-ios .ios-build-copy h3 {
    overflow-wrap: anywhere;
  }

  .om-ios img,
  .om-ios svg,
  .om-ios canvas,
  .om-ios video {
    max-width: 100%;
  }
}

/* =========================================================
   END FINAL IOS RESPONSIVE LAYOUT FIX
   ========================================================= */
/* =========================================================
   ORGANICMETRIC iOS — WHY CHOOSE / TECHNOLOGY REDESIGN
   Version: 2026-09-14
   This block is intentionally scoped to .om-ios-why so it
   cannot be distorted by the older .ios-dark/.ios-tech rules.
   ========================================================= */

.om-ios .om-ios-why{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:104px 0 108px;
  color:#fff;
  background:
    radial-gradient(circle at 76% 48%, rgba(47,124,255,.13), transparent 27%),
    radial-gradient(circle at 91% 76%, rgba(101,72,255,.12), transparent 25%),
    linear-gradient(135deg,#071022 0%,#0b1429 52%,#0b1125 100%);
}

.om-ios .om-ios-why::before{
  content:"";
  position:absolute;
  width:720px;
  height:720px;
  right:-300px;
  top:-330px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(47,124,255,.10),transparent 67%);
  pointer-events:none;
}

.om-ios .om-ios-why::after{
  content:"";
  position:absolute;
  width:520px;
  height:520px;
  left:-320px;
  bottom:-350px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(101,72,255,.09),transparent 68%);
  pointer-events:none;
}

.om-ios .om-ios-why-inner{
  position:relative;
  z-index:2;
}

.om-ios .om-ios-why-grid{
  display:grid;
  grid-template-columns:minmax(0,.91fr) minmax(0,1.09fr);
  gap:54px;
  align-items:center;
}

/* ---------- LEFT COPY ---------- */

.om-ios .om-ios-why-copy{
  position:relative;
  z-index:5;
  max-width:620px;
}

.om-ios .om-ios-why-kicker{
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-bottom:15px;
  color:var(--ios-lime);
  font-size:11px;
  line-height:1.3;
  font-weight:900;
  letter-spacing:1.8px;
  text-transform:uppercase;
}

.om-ios .om-ios-why-kicker::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--ios-lime);
  box-shadow:0 0 0 5px rgba(201,255,74,.10),0 0 18px rgba(201,255,74,.35);
}

.om-ios .om-ios-why-copy h2{
  max-width:610px;
  margin:0 0 20px;
  color:#fff;
  font:700 clamp(43px,4.65vw,67px)/.99 'Space Grotesk',sans-serif;
  letter-spacing:-3.5px;
}

.om-ios .om-ios-why-copy h2 span{
  display:inline;
  color:#4b82ff;
  background:linear-gradient(90deg,#4c86ff 0%,#6d52ff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.om-ios .om-ios-why-intro{
  max-width:570px;
  margin:0;
  color:#aeb9cc;
  font-size:15px;
  line-height:1.72;
}

.om-ios .om-ios-why-checks{
  display:grid;
  gap:12px;
  margin:27px 0 29px;
}

.om-ios .om-ios-why-checks > div{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
  color:#dbe2ee;
  font-size:13px;
  line-height:1.45;
}

.om-ios .om-ios-why-checks i{
  flex:0 0 20px;
  width:20px;
  height:20px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--ios-lime);
  color:#0b1225;
  font-size:11px;
  font-style:normal;
  font-weight:900;
  box-shadow:0 0 0 4px rgba(201,255,74,.06);
}

.om-ios .om-ios-why-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  min-height:54px;
  padding:15px 22px;
  border:0;
  border-radius:14px;
  color:#fff;
  background:linear-gradient(135deg,#2f7cff 0%,#6748ff 100%);
  box-shadow:0 18px 40px rgba(47,124,255,.24);
  font:800 14px 'DM Sans',sans-serif;
  cursor:pointer;
  transition:transform .25s ease,box-shadow .25s ease;
}

.om-ios .om-ios-why-btn b{
  font-size:19px;
  line-height:1;
  font-weight:500;
  transition:transform .25s ease;
}

.om-ios .om-ios-why-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 23px 50px rgba(47,124,255,.31);
}

.om-ios .om-ios-why-btn:hover b{
  transform:translateX(4px);
}

/* ---------- RIGHT VISUAL ---------- */

.om-ios .om-ios-why-visual{
  position:relative;
  min-height:590px;
  isolation:isolate;
  display:block;
  overflow:visible;
}

.om-ios .om-ios-why-glow{
  position:absolute;
  z-index:0;
  width:470px;
  height:470px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:
    radial-gradient(circle,
      rgba(69,115,255,.25) 0%,
      rgba(71,76,202,.16) 34%,
      rgba(32,46,96,.10) 52%,
      transparent 72%);
  filter:blur(5px);
  pointer-events:none;
}

.om-ios .om-ios-why-orbit{
  position:absolute;
  z-index:1;
  left:50%;
  top:50%;
  border-radius:50%;
  pointer-events:none;
  transform:translate(-50%,-50%) rotate(-14deg);
}

.om-ios .om-ios-why-orbit.orbit-a{
  width:470px;
  height:470px;
  border:1px solid rgba(65,131,255,.36);
  box-shadow:0 0 40px rgba(47,124,255,.06);
}

.om-ios .om-ios-why-orbit.orbit-b{
  width:570px;
  height:390px;
  border:1px solid rgba(111,79,255,.26);
  transform:translate(-50%,-50%) rotate(23deg);
}

.om-ios .om-ios-why-orbit-dot{
  position:absolute;
  z-index:2;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#3f83ff;
  box-shadow:0 0 0 5px rgba(63,131,255,.10),0 0 22px rgba(63,131,255,.72);
  pointer-events:none;
}

.om-ios .om-ios-why-orbit-dot.dot-a{
  left:18%;
  top:50%;
}

.om-ios .om-ios-why-orbit-dot.dot-b{
  right:11%;
  top:24%;
  background:#7359ff;
  box-shadow:0 0 0 5px rgba(115,89,255,.10),0 0 22px rgba(115,89,255,.72);
}

.om-ios .om-ios-why-orbit-dot.dot-c{
  right:24%;
  bottom:8%;
  width:7px;
  height:7px;
  background:var(--ios-lime);
  box-shadow:0 0 0 5px rgba(201,255,74,.08),0 0 18px rgba(201,255,74,.55);
}

/* ---------- CSS IPHONES ---------- */

.om-ios .om-ios-why-phone{
  position:absolute;
  z-index:4;
  transform-origin:center center;
  filter:drop-shadow(0 35px 45px rgba(0,0,0,.34));
  will-change:transform;
}

.om-ios .om-ios-why-phone-shell{
  position:relative;
  padding:7px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:43px;
  background:linear-gradient(145deg,#fafcff 0%,#b4bdcb 52%,#68758a 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.40),
    inset 0 -4px 9px rgba(0,0,0,.18),
    0 0 0 1px rgba(0,0,0,.32);
}

.om-ios .om-ios-why-phone-screen{
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
  border-radius:36px;
  padding:22px 17px 18px;
}

.om-ios .om-ios-why-phone.phone-back{
  left:15%;
  top:84px;
  width:238px;
  height:488px;
  transform:rotate(-9deg);
  z-index:3;
}

.om-ios .om-ios-why-phone.phone-front{
  right:10%;
  top:66px;
  width:272px;
  height:555px;
  transform:rotate(5deg);
  z-index:5;
}

.om-ios .om-ios-why-phone.phone-back:hover{
  transform:rotate(-7deg) translate(-4px,-5px);
}

.om-ios .om-ios-why-phone.phone-front:hover{
  transform:rotate(3deg) translate(4px,-7px);
}

/* Rear analytics phone */

.om-ios .analytics-screen{
  color:#172139;
  background:
    radial-gradient(circle at 85% 15%,rgba(101,72,255,.13),transparent 26%),
    linear-gradient(160deg,#f7fbff 0%,#edf3ff 55%,#ebe8ff 100%);
}

.om-ios .analytics-screen::after{
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  bottom:13px;
  height:1px;
  background:rgba(70,85,115,.08);
}

.om-ios .why-status{
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#5d6a80;
  font-size:7px;
  line-height:1;
  font-weight:800;
}

.om-ios .why-status.light{
  color:#dce5f7;
}

.om-ios .why-app-title{
  margin-top:24px;
}

.om-ios .why-app-title small{
  display:block;
  margin-bottom:4px;
  color:#2f7cff;
  font-size:7px;
  font-weight:900;
  letter-spacing:1.6px;
}

.om-ios .why-app-title strong{
  display:block;
  color:#172139;
  font:700 17px/1.1 'Space Grotesk',sans-serif;
  letter-spacing:-.5px;
}

.om-ios .why-growth-number{
  margin-top:20px;
  color:#162039;
  font:700 30px/1 'Space Grotesk',sans-serif;
  letter-spacing:-1.5px;
}

.om-ios .why-growth-number small{
  display:block;
  margin-top:6px;
  color:#77849a;
  font:500 8px 'DM Sans',sans-serif;
  letter-spacing:0;
}

.om-ios .why-chart{
  height:96px;
  display:flex;
  align-items:flex-end;
  gap:7px;
  margin-top:15px;
  padding:0 3px;
}

.om-ios .why-chart i{
  flex:1;
  min-width:0;
  border-radius:6px 6px 2px 2px;
  background:linear-gradient(180deg,#5f86ff 0%,#6548ff 100%);
  box-shadow:0 5px 14px rgba(78,95,225,.12);
}

.om-ios .why-metric-list{
  display:grid;
  gap:7px;
  margin-top:14px;
}

.om-ios .why-metric-list > div{
  position:relative;
  min-height:43px;
  padding:7px 9px 7px 32px;
  border:1px solid rgba(114,131,163,.13);
  border-radius:11px;
  background:rgba(255,255,255,.78);
  box-shadow:0 7px 18px rgba(30,48,82,.06);
}

.om-ios .metric-icon{
  position:absolute;
  left:8px;
  top:9px;
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  border-radius:6px;
  color:#fff;
  background:#2f7cff;
  font-size:8px;
  font-weight:900;
}

.om-ios .why-metric-list > div:nth-child(2) .metric-icon{
  background:#7256ff;
}

.om-ios .why-metric-list > div:nth-child(3) .metric-icon{
  background:#25b978;
}

.om-ios .why-metric-list small{
  display:block;
  color:#78859a;
  font-size:6px;
  line-height:1;
}

.om-ios .why-metric-list b{
  display:block;
  margin-top:3px;
  color:#1a2439;
  font:700 8px 'Space Grotesk',sans-serif;
}

/* Front business phone */

.om-ios .app-screen{
  color:#fff;
  background:
    radial-gradient(circle at 90% 0%,rgba(100,78,255,.30),transparent 28%),
    linear-gradient(160deg,#172847 0%,#0d1527 55%,#28205b 100%);
}

.om-ios .why-notch{
  position:absolute;
  z-index:5;
  left:50%;
  top:0;
  width:102px;
  height:24px;
  transform:translateX(-50%);
  border-radius:0 0 15px 15px;
  background:#070c17;
}

.om-ios .app-screen .why-status{
  position:relative;
  z-index:6;
  color:#e6edf8;
}

.om-ios .why-greeting{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:30px;
  color:#aebbd0;
  font-size:8px;
}

.om-ios .why-greeting b{
  color:#78a7ff;
  font-size:17px;
  font-weight:500;
}

.om-ios .app-screen h3{
  margin:20px 0 18px;
  color:#fff;
  font:600 29px/1.03 'Space Grotesk',sans-serif;
  letter-spacing:-1.3px;
}

.om-ios .app-screen h3 em{
  font-style:normal;
  color:#6e83ff;
  background:linear-gradient(90deg,#6fa4ff,#8964ff);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.om-ios .why-app-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}

.om-ios .why-app-grid > div{
  min-height:83px;
  padding:11px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:rgba(255,255,255,.065);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(10px);
}

.om-ios .why-app-grid strong{
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  margin-bottom:9px;
  border-radius:8px;
  color:#fff;
  background:linear-gradient(135deg,#2f7cff,#6650ff);
  font-size:11px;
}

.om-ios .why-app-grid > div:nth-child(2) strong{
  background:linear-gradient(135deg,#6c52ff,#8b62ff);
}

.om-ios .why-app-grid > div:nth-child(3) strong{
  background:linear-gradient(135deg,#388dff,#4c7bff);
}

.om-ios .why-app-grid > div:nth-child(4) strong{
  background:linear-gradient(135deg,#5c60ff,#8a54ff);
}

.om-ios .why-app-grid b{
  display:block;
  color:#f4f7fc;
  font-size:8px;
}

.om-ios .why-app-grid small{
  display:block;
  margin-top:3px;
  color:#94a2b9;
  font-size:6px;
}

.om-ios .why-activity{
  margin-top:11px;
  padding:11px 12px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:14px;
  background:rgba(255,255,255,.055);
}

.om-ios .why-activity > div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#9eacc2;
  font-size:7px;
}

.om-ios .why-activity > div b{
  color:#75a4ff;
  font-size:7px;
}

.om-ios .why-activity p{
  display:flex;
  align-items:center;
  gap:9px;
  margin:11px 0 0;
}

.om-ios .why-activity p i{
  flex:0 0 25px;
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  border-radius:8px;
  color:#17253e;
  background:var(--ios-lime);
  font-size:9px;
  font-style:normal;
  font-weight:900;
}

.om-ios .why-activity p:nth-child(3) i{
  background:#6d60ff;
  color:#fff;
}

.om-ios .why-activity p span{
  display:block;
}

.om-ios .why-activity p b{
  display:block;
  color:#edf2fa;
  font-size:7px;
}

.om-ios .why-activity p small{
  display:block;
  margin-top:2px;
  color:#7f8da6;
  font-size:6px;
}

/* ---------- FLOATING BADGES ---------- */

.om-ios .om-ios-why-badge{
  position:absolute;
  z-index:8;
  display:flex;
  align-items:center;
  gap:11px;
  min-width:185px;
  padding:13px 15px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:17px;
  background:rgba(19,29,50,.86);
  box-shadow:0 22px 45px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(16px);
}

.om-ios .om-ios-why-badge b{
  display:block;
  color:#fff;
  font:700 12px 'Space Grotesk',sans-serif;
}

.om-ios .om-ios-why-badge small{
  display:block;
  margin-top:3px;
  color:#8795ac;
  font-size:7px;
}

.om-ios .om-ios-why-badge .badge-icon{
  flex:0 0 37px;
  width:37px;
  height:37px;
  display:grid;
  place-items:center;
  border-radius:11px;
  color:#fff;
  background:linear-gradient(135deg,#2f7cff,#704cff);
  box-shadow:0 8px 20px rgba(47,124,255,.20);
  font:800 15px 'Space Grotesk',sans-serif;
}

.om-ios .om-ios-why-badge.badge-store .badge-icon{
  background:linear-gradient(135deg,#2f8cff,#614cff);
}

.om-ios .om-ios-why-badge.badge-swift{
  left:1%;
  top:35px;
}

.om-ios .om-ios-why-badge.badge-store{
  right:-1%;
  top:270px;
}

/* ---------- NOTE ---------- */

.om-ios .om-ios-why-note{
  position:absolute;
  z-index:7;
  right:4%;
  bottom:23px;
  display:flex;
  align-items:center;
  gap:10px;
  color:#b5bfd0;
}

.om-ios .om-ios-why-note > span{
  width:43px;
  height:30px;
  display:grid;
  place-items:center;
  color:#7e6aff;
  font-size:25px;
  transform:rotate(-12deg);
}

.om-ios .om-ios-why-note p{
  margin:0;
  color:#aeb8ca;
  font:500 12px/1.35 'Space Grotesk',sans-serif;
  letter-spacing:-.2px;
}

/* ---------- ACCESSIBILITY / REDUCED MOTION ---------- */

@media (prefers-reduced-motion:reduce){
  .om-ios .om-ios-why-phone,
  .om-ios .om-ios-why-btn,
  .om-ios .om-ios-why-btn b{
    transition:none !important;
  }
}

/* ---------- LARGE DESKTOP ---------- */

@media (min-width:1200px){
  .om-ios .om-ios-why{
    padding-top:112px;
    padding-bottom:116px;
  }

  .om-ios .om-ios-why-grid{
    gap:62px;
  }

  .om-ios .om-ios-why-visual{
    min-height:620px;
  }

  .om-ios .om-ios-why-phone.phone-back{
    left:13%;
    top:88px;
  }

  .om-ios .om-ios-why-phone.phone-front{
    right:9%;
    top:67px;
  }

  .om-ios .om-ios-why-badge.badge-swift{
    left:0;
    top:28px;
  }

  .om-ios .om-ios-why-badge.badge-store{
    right:-2%;
    top:282px;
  }
}

/* ---------- TABLET ---------- */

@media (max-width:1050px){
  .om-ios .om-ios-why{
    padding:82px 0 88px;
  }

  .om-ios .om-ios-why-grid{
    grid-template-columns:1fr;
    gap:30px;
  }

  .om-ios .om-ios-why-copy{
    max-width:760px;
  }

  .om-ios .om-ios-why-copy h2{
    max-width:700px;
    font-size:clamp(43px,6vw,62px);
  }

  .om-ios .om-ios-why-visual{
    width:min(760px,100%);
    min-height:575px;
    margin:0 auto;
  }

  .om-ios .om-ios-why-phone.phone-back{
    left:22%;
  }

  .om-ios .om-ios-why-phone.phone-front{
    right:18%;
  }

  .om-ios .om-ios-why-badge.badge-swift{
    left:7%;
  }

  .om-ios .om-ios-why-badge.badge-store{
    right:5%;
  }
}

/* ---------- MOBILE ---------- */

@media (max-width:720px){
  .om-ios .om-ios-why{
    padding:68px 0 70px;
  }

  .om-ios .om-ios-why-grid{
    gap:14px;
  }

  .om-ios .om-ios-why-kicker{
    font-size:10px;
    letter-spacing:1.5px;
  }

  .om-ios .om-ios-why-copy h2{
    max-width:100%;
    margin-bottom:17px;
    font-size:clamp(39px,11vw,52px);
    letter-spacing:-2.5px;
  }

  .om-ios .om-ios-why-intro{
    font-size:14px;
    line-height:1.68;
  }

  .om-ios .om-ios-why-checks{
    gap:10px;
    margin:23px 0 25px;
  }

  .om-ios .om-ios-why-checks > div{
    align-items:flex-start;
    font-size:12px;
  }

  .om-ios .om-ios-why-checks i{
    margin-top:1px;
  }

  .om-ios .om-ios-why-btn{
    width:100%;
    min-height:51px;
    font-size:13px;
  }

  .om-ios .om-ios-why-visual{
    min-height:475px;
    margin-top:8px;
    transform:none;
  }

  .om-ios .om-ios-why-glow{
    width:350px;
    height:350px;
  }

  .om-ios .om-ios-why-orbit.orbit-a{
    width:350px;
    height:350px;
  }

  .om-ios .om-ios-why-orbit.orbit-b{
    width:420px;
    height:300px;
  }

  .om-ios .om-ios-why-phone.phone-back{
    left:8%;
    top:77px;
    width:174px;
    height:356px;
    transform:rotate(-9deg);
  }

  .om-ios .om-ios-why-phone.phone-front{
    right:5%;
    top:54px;
    width:202px;
    height:412px;
    transform:rotate(5deg);
  }

  .om-ios .om-ios-why-phone.phone-back:hover{
    transform:rotate(-9deg);
  }

  .om-ios .om-ios-why-phone.phone-front:hover{
    transform:rotate(5deg);
  }

  .om-ios .om-ios-why-phone-shell{
    padding:5px;
    border-radius:31px;
  }

  .om-ios .om-ios-why-phone-screen{
    border-radius:26px;
    padding:15px 11px 12px;
  }

  .om-ios .why-app-title{
    margin-top:18px;
  }

  .om-ios .why-app-title strong{
    font-size:13px;
  }

  .om-ios .why-growth-number{
    margin-top:14px;
    font-size:22px;
  }

  .om-ios .why-chart{
    height:70px;
    gap:4px;
    margin-top:10px;
  }

  .om-ios .why-metric-list{
    gap:5px;
    margin-top:9px;
  }

  .om-ios .why-metric-list > div{
    min-height:32px;
    padding:5px 6px 5px 24px;
  }

  .om-ios .metric-icon{
    left:6px;
    top:6px;
    width:14px;
    height:14px;
    border-radius:4px;
    font-size:6px;
  }

  .om-ios .why-metric-list small{
    font-size:5px;
  }

  .om-ios .why-metric-list b{
    margin-top:2px;
    font-size:6px;
  }

  .om-ios .why-greeting{
    margin-top:22px;
    font-size:6px;
  }

  .om-ios .why-greeting b{
    font-size:13px;
  }

  .om-ios .app-screen h3{
    margin:13px 0 12px;
    font-size:21px;
    letter-spacing:-1px;
  }

  .om-ios .why-app-grid{
    gap:6px;
  }

  .om-ios .why-app-grid > div{
    min-height:61px;
    padding:7px;
    border-radius:9px;
  }

  .om-ios .why-app-grid strong{
    width:19px;
    height:19px;
    margin-bottom:5px;
    border-radius:6px;
    font-size:8px;
  }

  .om-ios .why-app-grid b{
    font-size:6px;
  }

  .om-ios .why-app-grid small{
    font-size:4.5px;
  }

  .om-ios .why-activity{
    margin-top:7px;
    padding:7px;
    border-radius:9px;
  }

  .om-ios .why-activity > div,
  .om-ios .why-activity > div b{
    font-size:5px;
  }

  .om-ios .why-activity p{
    gap:5px;
    margin-top:6px;
  }

  .om-ios .why-activity p i{
    flex-basis:18px;
    width:18px;
    height:18px;
    border-radius:5px;
    font-size:6px;
  }

  .om-ios .why-activity p b{
    font-size:5px;
  }

  .om-ios .why-activity p small{
    margin-top:1px;
    font-size:4px;
  }

  .om-ios .om-ios-why-badge{
    min-width:0;
    padding:8px 10px;
    gap:7px;
    border-radius:12px;
  }

  .om-ios .om-ios-why-badge .badge-icon{
    flex-basis:27px;
    width:27px;
    height:27px;
    border-radius:8px;
    font-size:11px;
  }

  .om-ios .om-ios-why-badge b{
    font-size:8px;
  }

  .om-ios .om-ios-why-badge small{
    margin-top:1px;
    font-size:5px;
  }

  .om-ios .om-ios-why-badge.badge-swift{
    left:0;
    top:25px;
  }

  .om-ios .om-ios-why-badge.badge-store{
    right:0;
    top:235px;
  }

  .om-ios .om-ios-why-note{
    right:1%;
    bottom:5px;
  }

  .om-ios .om-ios-why-note > span{
    width:28px;
    font-size:18px;
  }

  .om-ios .om-ios-why-note p{
    font-size:8px;
  }

  .om-ios .om-ios-why-orbit-dot{
    width:7px;
    height:7px;
  }
}

/* ---------- SMALL MOBILE ---------- */

@media (max-width:420px){
  .om-ios .om-ios-why{
    padding-top:60px;
  }

  .om-ios .om-ios-why-copy h2{
    font-size:38px;
    letter-spacing:-2.2px;
  }

  .om-ios .om-ios-why-intro{
    font-size:13px;
  }

  .om-ios .om-ios-why-checks > div{
    font-size:11px;
  }

  .om-ios .om-ios-why-visual{
    min-height:425px;
  }

  .om-ios .om-ios-why-phone.phone-back{
    left:3%;
    top:72px;
    width:158px;
    height:323px;
  }

  .om-ios .om-ios-why-phone.phone-front{
    right:1%;
    top:49px;
    width:184px;
    height:375px;
  }

  .om-ios .om-ios-why-badge.badge-swift{
    top:17px;
  }

  .om-ios .om-ios-why-badge.badge-store{
    top:215px;
  }

  .om-ios .om-ios-why-note{
    bottom:0;
  }
}

/* =========================================================
   FINAL CTA BALANCE FIX
   Gives the right visual column more width and keeps the
   CTA phone comfortably inside the section.
   ========================================================= */

.om-ios .ios-cta{
  grid-template-columns:minmax(0, 1.05fr) minmax(380px, .95fr) !important;
  gap:32px !important;
}

.om-ios .ios-cta-copy{
  max-width:680px !important;
}

.om-ios .ios-cta-device{
  width:100% !important;
  min-width:0 !important;
  height:300px !important;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
}

.om-ios .cta-phone{
  width:205px !important;
  height:320px !important;
  transform:rotate(9deg) translateY(50px) !important;
}

@media (min-width:1200px){
  .om-ios .ios-cta{
    grid-template-columns:52% 48% !important;
    gap:20px !important;
    padding-left:48px !important;
    padding-right:38px !important;
  }

  .om-ios .ios-cta-device{
    min-height:300px !important;
  }
}

@media (max-width:900px){
  .om-ios .ios-cta{
    grid-template-columns:1fr !important;
    gap:20px !important;
  }

  .om-ios .ios-cta-device{
    height:230px !important;
  }

  .om-ios .cta-phone{
    width:175px !important;
    height:280px !important;
    transform:rotate(9deg) translateY(65px) !important;
  }
}

@media (max-width:600px){
  .om-ios .ios-cta{
    padding:34px 22px !important;
    min-height:500px !important;
  }

  .om-ios .ios-cta-device{
    height:205px !important;
  }

  .om-ios .cta-phone{
    width:155px !important;
    height:245px !important;
    transform:rotate(9deg) translateY(78px) !important;
  }

  .om-ios .cta-phone strong{
    font-size:20px !important;
  }
}


/* =========================================================
   ORGANICMETRIC iOS — ANDROID CTA MATCH
   Exact structural sizing/spacing match to the Android
   development page CTA. This is intentionally appended last
   so it overrides all previous iOS CTA balance experiments.
   ========================================================= */

/* Desktop: same dimensions and proportions as Android CTA */
.om-ios .ios-cta-wrap {
  padding-top: 0 !important;
  padding-bottom: 26px !important;
}

.om-ios .ios-cta {
  position: relative !important;
  display: grid !important;
  min-height: 350px !important;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 0.48fr) !important;
  align-items: center !important;
  gap: 0 !important;
  overflow: hidden !important;
  padding: 50px 52px !important;
  border-radius: 27px !important;
  color: #fff !important;
  background:
    radial-gradient(
      circle at 85% 45%,
      rgba(61, 94, 255, 0.22),
      transparent 32%
    ),
    linear-gradient(
      120deg,
      #0c1429,
      #151e38 52%,
      #25205a
    ) !important;
}

.om-ios .ios-cta::before {
  content: "" !important;
  position: absolute !important;
  top: -170px !important;
  right: -100px !important;
  width: 500px !important;
  height: 500px !important;
  border-radius: 50% !important;
  background:
    radial-gradient(
      circle,
      rgba(47, 124, 255, 0.22),
      transparent 68%
    ) !important;
}

.om-ios .ios-cta-copy {
  position: relative !important;
  z-index: 2 !important;
  max-width: 650px !important;
}

.om-ios .ios-cta h2 {
  max-width: 650px !important;
  margin: 10px 0 14px !important;
  color: #fff !important;
  font-size: clamp(38px, 4.1vw, 54px) !important;
  line-height: 1.02 !important;
  letter-spacing: -2.8px !important;
}

.om-ios .ios-cta p {
  max-width: 570px !important;
  margin: 0 !important;
  color: #aeb8c9 !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
}

.om-ios .ios-cta-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 23px !important;
}

.om-ios .ios-btn-white {
  color: #11182a !important;
  background: #fff !important;
  box-shadow: none !important;
}

.om-ios .ios-btn-outline {
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
  background: transparent !important;
  box-shadow: none !important;
}

.om-ios .ios-cta-device {
  position: relative !important;
  z-index: 2 !important;
  width: auto !important;
  min-width: 0 !important;
  height: 300px !important;
  min-height: 0 !important;
  display: grid !important;
  place-items: end center !important;
}

.om-ios .cta-phone {
  position: relative !important;
  width: 195px !important;
  height: 315px !important;
  padding: 44px 20px 18px !important;
  border-radius: 32px 32px 0 0 !important;
  background: linear-gradient(160deg, #eaf1ff, #7370d6) !important;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.3) !important;
  transform: rotate(9deg) translateY(50px) !important;
}

.om-ios .cta-phone::before {
  content: "" !important;
  position: absolute !important;
  inset: 7px !important;
  border-radius: 25px 25px 0 0 !important;
  background: linear-gradient(160deg, #10182b, #20254e) !important;
}

.om-ios .cta-phone > * {
  position: relative !important;
  z-index: 2 !important;
}

.om-ios .cta-phone-notch {
  position: absolute !important;
  top: 8px !important;
  left: 50% !important;
  width: 70px !important;
  height: 16px !important;
  border-radius: 0 0 9px 9px !important;
  background: #080d18 !important;
  transform: translateX(-50%) !important;
}

.om-ios .cta-small {
  display: block !important;
  margin-bottom: 16px !important;
  color: #8ea0c0 !important;
  font-size: 10px !important;
  line-height: 1.3 !important;
}

.om-ios .cta-phone strong {
  display: block !important;
  color: #fff !important;
  font: 700 25px/1.02 "Space Grotesk", sans-serif !important;
  letter-spacing: -1px !important;
}

.om-ios .cta-pill {
  display: inline-block !important;
  margin-top: 28px !important;
  padding: 8px 11px !important;
  border-radius: 9px !important;
  color: #fff !important;
  background: #2f7cff !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
}

/* Keep the iOS CTA inside the same normal page container as Android.
   Do NOT stretch this section to an artificial 1765px width. */
@media (min-width: 1051px) {
  .om-ios .ios-cta-wrap {
    width: auto !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Tablet */
@media (max-width: 1050px) {
  .om-ios .ios-cta {
    grid-template-columns: 1fr !important;
    min-height: 510px !important;
    padding: 42px 40px !important;
  }

  .om-ios .ios-cta-device {
    height: 250px !important;
  }
}

/* Mobile: same proportions/behaviour as Android */
@media (max-width: 720px) {
  .om-ios .ios-cta {
    grid-template-columns: 1fr !important;
    min-height: 510px !important;
    padding: 34px 24px !important;
  }

  .om-ios .ios-cta h2 {
    font-size: 39px !important;
    letter-spacing: -2.2px !important;
  }

  .om-ios .ios-cta p {
    font-size: 14px !important;
  }

  .om-ios .ios-cta-actions {
    flex-direction: column !important;
  }

  .om-ios .ios-cta-actions .ios-btn {
    width: 100% !important;
  }

  .om-ios .ios-cta-device {
    height: 185px !important;
  }

  .om-ios .cta-phone {
    width: 155px !important;
    height: 250px !important;
    transform: rotate(9deg) translateY(72px) !important;
  }

  .om-ios .cta-phone strong {
    font-size: 20px !important;
  }
}