/* ============================================================
   CLINIC MANAGER PHARMACY
============================================================ */

.pharmacy-page {
    overflow: hidden;
}


/* ============================================================
   HERO
============================================================ */

.pharmacy-hero {
    position: relative;

    min-height: 900px;

    padding:
        180px 0
        115px;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            #fbfcfd 0%,
            #f3f9fa 55%,
            #edf7fb 100%
        );
}


.pharmacy-hero-grid {
    position: absolute;
    inset: 0;

    opacity: .45;

    background-image:
        linear-gradient(
            rgba(25,60,90,.045) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(25,60,90,.045) 1px,
            transparent 1px
        );

    background-size:
        80px 80px;
}


.pharmacy-hero-layout {
    position: relative;

    display: grid;

    grid-template-columns:
        .86fr 1.14fr;

    gap:
        clamp(60px, 8vw, 120px);

    align-items: center;
}


.pharmacy-product-label {
    margin-bottom: 24px;

    color: #247cff;

    font-size: .8rem;
    font-weight: 750;
}


.pharmacy-hero h1 {
    max-width: 760px;

    margin: 0;

    color: #101820;

    font-size:
        clamp(4rem, 7vw, 7.1rem);

    font-weight: 760;

    line-height: .89;

    letter-spacing: -.075em;
}


.pharmacy-hero h1 em {
    display: block;

    color: #24a2b8;

    font-family: Georgia, serif;

    font-weight: 400;

    letter-spacing: -.055em;
}


.pharmacy-hero-lead {
    max-width: 600px;

    margin:
        34px 0 0;

    color: #68747e;

    font-size:
        clamp(1rem, 1.3vw, 1.2rem);

    line-height: 1.75;
}


.pharmacy-hero-actions {
    margin-top: 38px;

    display: flex;
    align-items: center;

    gap: 28px;

    flex-wrap: wrap;
}


.pharmacy-hero-features {
    margin-top: 48px;

    display: flex;
    flex-wrap: wrap;

    gap: 9px;
}


.pharmacy-hero-features span {
    padding:
        9px 13px;

    display: inline-flex;
    align-items: center;

    gap: 7px;

    border:
        1px solid
        rgba(15,23,42,.08);

    border-radius: 999px;

    color: #66727c;

    background:
        rgba(255,255,255,.67);

    font-size: .67rem;
}


.pharmacy-hero-features i {
    color: #1d9db3;
}


/* ============================================================
   HERO STOCK CARD
============================================================ */

.pharmacy-hero-visual {
    position: relative;
}


.pharmacy-stock-card {
    padding: 29px;

    border:
        1px solid
        rgba(255,255,255,.9);

    border-radius: 28px;

    background:
        rgba(255,255,255,.96);

    box-shadow:
        0 35px 100px
        rgba(25,55,80,.17);

    transform:
        perspective(1400px)
        rotateY(-4deg);
}


.pharmacy-card-head {
    padding-bottom: 22px;

    display: flex;
    justify-content: space-between;

    border-bottom:
        1px solid
        rgba(15,23,42,.08);
}


.pharmacy-card-head small {
    display: block;

    color: #86919a;

    font-size: .61rem;
}


.pharmacy-card-head strong {
    display: block;

    margin-top: 4px;

    color: #101820;

    font-size: 1.18rem;
}


.pharmacy-status {
    padding:
        7px 10px;

    display: flex;
    align-items: center;

    gap: 6px;

    border-radius: 999px;

    color: #24865b;

    background:
        rgba(47,183,120,.1);

    font-size: .57rem;
    font-weight: 750;
}


.pharmacy-status i {
    font-size: .4rem;
}


.pharmacy-item {
    padding:
        22px 0;

    display: grid;

    grid-template-columns:
        48px 1fr auto;

    gap: 13px;

    align-items: center;
}


.pharmacy-item-icon {
    width: 46px;
    height: 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    color: #1b9eb6;

    background:
        rgba(36,184,207,.09);

    font-size: 1.25rem;
}


.pharmacy-item-copy small,
.pharmacy-item-balance small {
    display: block;

    color: #89939b;

    font-size: .59rem;
}


.pharmacy-item-copy strong {
    color: #17212a;

    font-size: .8rem;
}


.pharmacy-item-balance {
    text-align: right;
}


.pharmacy-item-balance strong {
    color: #101820;

    font-size: 1.5rem;
}


.pharmacy-dashboard-grid {
    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap: 8px;
}


.pharmacy-dash-item {
    position: relative;

    min-height: 120px;

    padding: 17px;

    border-radius: 14px;

    background: #f6f8fa;
}


.pharmacy-dash-item i {
    position: absolute;

    right: 16px;
    top: 16px;

    color: #1d9fb6;

    font-size: 1.05rem;
}


.pharmacy-dash-item span {
    display: block;

    color: #89949d;

    font-size: .59rem;
}


.pharmacy-dash-item strong {
    display: block;

    margin-top: 27px;

    color: #17212a;

    font-size: 1.5rem;
}


.pharmacy-dash-alert {
    background:
        rgba(235,94,94,.06);
}


.pharmacy-dash-alert i,
.pharmacy-dash-alert strong {
    color: #d55454;
}


.pharmacy-variance {
    margin-top: 9px;

    padding: 16px 18px;

    display: flex;
    justify-content: space-between;

    align-items: center;

    border-radius: 14px;

    background:
        rgba(235,94,94,.08);
}


.pharmacy-variance small {
    display: block;

    color: #a17b7b;

    font-size: .56rem;
}


.pharmacy-variance strong {
    color: #873f3f;

    font-size: .72rem;
}


.pharmacy-variance > span {
    color: #d65050;

    font-size: 1.45rem;

    font-weight: 750;
}


.pharmacy-float {
    position: absolute;

    padding:
        14px 17px;

    display: flex;
    align-items: center;

    gap: 11px;

    border-radius: 16px;

    background:
        rgba(255,255,255,.93);

    box-shadow:
        0 20px 45px
        rgba(20,40,60,.14);

    backdrop-filter:
        blur(15px);
}


.pharmacy-float > i {
    color: #1d9fb6;

    font-size: 1.2rem;
}


.pharmacy-float strong {
    display: block;

    color: #101820;

    font-size: .68rem;
}


.pharmacy-float small {
    color: #7c8790;

    font-size: .58rem;
}


.pharmacy-float-one {
    left: -45px;
    bottom: 60px;
}


.pharmacy-float-two {
    right: -35px;
    top: 65px;
}


/* ============================================================
   INTRO
============================================================ */

.pharmacy-intro-grid {
    display: grid;

    grid-template-columns:
        1.2fr .8fr;

    gap: 100px;

    align-items: end;
}


.pharmacy-intro-copy p {
    margin: 0;

    color: #69747e;

    line-height: 1.8;
}


.pharmacy-intro-copy
.pharmacy-intro-lead {
    margin-bottom: 20px;

    color: #101820;

    font-size: 1.3rem;

    font-weight: 550;
}


/* ============================================================
   WORKFLOW
============================================================ */

.pharmacy-workflow {
    padding: 125px 0;

    color: #fff;

    background: #101820;
}


.pharmacy-workflow-header {
    max-width: 830px;
}


.pharmacy-workflow-header h2 {
    margin: 0;

    font-size:
        clamp(3.4rem, 6vw, 6.4rem);

    line-height: .92;

    letter-spacing: -.07em;
}


.pharmacy-workflow-header p {
    max-width: 560px;

    margin-top: 27px;

    color:
        rgba(255,255,255,.5);

    line-height: 1.75;
}


.pharmacy-flow {
    margin-top: 80px;

    display: grid;

    grid-template-columns:
        repeat(6, 1fr);

    gap: 9px;
}


.pharmacy-flow-step {
    min-height: 300px;

    padding: 25px;

    display: flex;
    flex-direction: column;

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius: 18px;

    background:
        rgba(255,255,255,.035);
}


.pharmacy-flow-step > span {
    color:
        rgba(255,255,255,.32);

    font-size: .6rem;

    letter-spacing: .13em;
}


.pharmacy-flow-icon {
    width: 46px;
    height: 46px;

    margin-top: 28px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    color: #85e3ed;

    background:
        rgba(36,184,207,.09);

    font-size: 1.1rem;
}


.pharmacy-flow-step h3 {
    margin:
        auto 0 12px;

    font-size: 1.3rem;

    letter-spacing: -.04em;
}


.pharmacy-flow-step p {
    margin: 0;

    color:
        rgba(255,255,255,.47);

    font-size: .7rem;

    line-height: 1.65;
}


/* ============================================================
   STOCKTAKE
============================================================ */

.stocktake-section {
    background: #f5f8fa;
}


.stocktake-layout {
    display: grid;

    grid-template-columns:
        .92fr 1.08fr;

    gap: 100px;

    align-items: center;
}


.stocktake-product {
    padding: 32px;

    border-radius: 27px;

    background: #fff;

    box-shadow:
        0 30px 80px
        rgba(25,50,70,.11);
}


.stocktake-product-head {
    display: flex;
    align-items: center;

    gap: 13px;
}


.stocktake-pill-icon {
    width: 46px;
    height: 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    color: #1d9fb6;

    background:
        rgba(36,184,207,.09);

    font-size: 1.2rem;
}


.stocktake-product-head small {
    display: block;

    color: #8b969e;

    font-size: .6rem;
}


.stocktake-product-head strong {
    color: #101820;
}


.stocktake-math {
    margin-top: 35px;

    display: grid;

    grid-template-columns:
        1fr auto 1fr auto 1fr;

    gap: 14px;

    align-items: center;
}


.stocktake-math > div {
    padding: 17px;

    border-radius: 14px;

    background: #f5f8fa;

    text-align: center;
}


.stocktake-math span {
    display: block;

    color: #7f8b94;

    font-size: .59rem;
}


.stocktake-math strong {
    display: block;

    margin-top: 6px;

    color: #101820;

    font-size: 1.8rem;
}


.stocktake-expected {
    background:
        rgba(36,124,255,.08) !important;
}


.stocktake-divider {
    height: 1px;

    margin:
        28px 0;

    background:
        rgba(15,23,42,.08);
}


.stocktake-count {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 10px;
}


.stocktake-count > div {
    padding: 20px;

    border-radius: 14px;

    background: #f5f8fa;
}


.stocktake-count span {
    display: block;

    color: #7f8b94;

    font-size: .59rem;
}


.stocktake-count strong {
    display: block;

    margin-top: 6px;

    color: #101820;

    font-size: 1.8rem;
}


.stocktake-count
.stocktake-variance {
    background:
        rgba(224,77,77,.08);
}


.stocktake-count
.stocktake-variance strong {
    color: #d95050;
}


.stocktake-warning {
    margin-top: 12px;

    padding: 17px;

    display: flex;
    align-items: center;

    gap: 12px;

    border-radius: 14px;

    background:
        rgba(239,174,62,.08);
}


.stocktake-warning > i {
    color: #e8a63d;

    font-size: 1.3rem;
}


.stocktake-warning strong {
    display: block;

    color: #745522;

    font-size: .7rem;
}


.stocktake-warning small {
    color: #857868;

    font-size: .59rem;
}


/* ============================================================
   TRANSFER
============================================================ */

.transfer-section {
    padding:
        130px 0;

    color: #fff;

    background:
        linear-gradient(
            135deg,
            #176ee6,
            #17a1b9
        );
}


.transfer-header {
    max-width: 850px;
}


.transfer-header h2 {
    margin: 0;

    font-size:
        clamp(3.5rem, 6vw, 6.3rem);

    line-height: .92;

    letter-spacing: -.07em;
}


.transfer-header p {
    max-width: 600px;

    margin-top: 26px;

    color:
        rgba(255,255,255,.68);

    line-height: 1.8;
}


.transfer-map {
    margin-top: 80px;

    display: grid;

    grid-template-columns:
        1fr 1.3fr 1fr;

    align-items: center;

    gap: 25px;
}


.transfer-location {
    min-height: 220px;

    padding: 30px;

    display: flex;
    flex-direction: column;

    border:
        1px solid
        rgba(255,255,255,.17);

    border-radius: 20px;

    background:
        rgba(255,255,255,.09);

    backdrop-filter: blur(15px);
}


.transfer-location-icon {
    width: 48px;
    height: 48px;

    margin-bottom: auto;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    background:
        rgba(255,255,255,.12);

    font-size: 1.2rem;
}


.transfer-location small {
    color:
        rgba(255,255,255,.43);

    font-size: .55rem;

    letter-spacing: .12em;
}


.transfer-location strong {
    margin-top: 6px;

    font-size: 1.1rem;
}


.transfer-location span {
    margin-top: 5px;

    color:
        rgba(255,255,255,.55);

    font-size: .63rem;
}


.transfer-route {
    position: relative;

    height: 70px;
}


.transfer-route-line {
    position: absolute;

    left: 0;
    right: 0;
    top: 50%;

    height: 2px;

    background:
        rgba(255,255,255,.2);
}


.transfer-moving-stock {
    position: absolute;

    top: 50%;
    left: 0;

    width: 45px;
    height: 45px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    color: #176ee6;

    background: #fff;

    box-shadow:
        0 10px 30px
        rgba(0,0,0,.15);

    transform:
        translateY(-50%);

    animation:
        pharmacyTransfer 3.2s
        ease-in-out infinite;
}


@keyframes pharmacyTransfer {

    0% {
        left: 0;
    }

    50% {
        left:
            calc(100% - 45px);
    }

    100% {
        left: 0;
    }

}


.transfer-nav {
    margin-top: 55px;

    padding:
        18px 22px;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 13px;

    border:
        1px solid
        rgba(255,255,255,.14);

    border-radius: 14px;

    background:
        rgba(255,255,255,.07);

    color:
        rgba(255,255,255,.6);

    font-size: .7rem;
}


.transfer-nav strong {
    color: #fff;
}


/* ============================================================
   AUTOMATIC TRANSFER
============================================================ */

.automatic-transfer {
    background: #fff;
}


.auto-transfer-steps {
    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 13px;
}


.auto-transfer-step {
    min-height: 390px;

    padding: 30px;

    display: flex;
    flex-direction: column;

    border:
        1px solid
        rgba(15,23,42,.08);

    border-radius: 22px;

    background: #f5f8fa;
}


.auto-transfer-featured {
    color: #fff;

    background:
        linear-gradient(
            145deg,
            #176ee6,
            #1ca2b9
        );
}


.auto-step-number {
    color: #8c979f;

    font-size: .61rem;

    letter-spacing: .12em;
}


.auto-transfer-featured
.auto-step-number {
    color:
        rgba(255,255,255,.5);
}


.auto-step-icon {
    width: 49px;
    height: 49px;

    margin-top: 30px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    color: #1b9db3;

    background: #fff;

    font-size: 1.15rem;
}


.auto-transfer-step h3 {
    margin:
        auto 0 14px;

    font-size: 1.5rem;

    letter-spacing: -.04em;
}


.auto-transfer-step p {
    margin: 0;

    color: #6e7982;

    font-size: .75rem;

    line-height: 1.7;
}


.auto-transfer-featured p {
    color:
        rgba(255,255,255,.66);
}


/* ============================================================
   PRICE UPDATE
============================================================ */

.price-update-section {
    padding:
        130px 0;

    color: #fff;

    background: #101820;
}


.price-update-layout {
    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 100px;

    align-items: center;
}


.price-update-copy h2 {
    margin: 0;

    font-size:
        clamp(3.4rem, 5.5vw, 5.8rem);

    line-height: .94;

    letter-spacing: -.07em;
}


.price-update-copy p {
    max-width: 580px;

    margin:
        25px 0 0;

    color:
        rgba(255,255,255,.55);

    line-height: 1.8;
}


.price-file,
.price-system {
    padding: 22px;

    display: flex;
    align-items: center;

    gap: 15px;

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius: 17px;

    background:
        rgba(255,255,255,.04);
}


.price-file-icon {
    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    color: #84e3ed;

    background:
        rgba(36,184,207,.1);

    font-size: 1.25rem;
}


.price-file small,
.price-system small {
    display: block;

    color:
        rgba(255,255,255,.38);

    font-size: .57rem;
}


.price-file strong,
.price-system strong {
    display: block;

    margin-top: 3px;

    font-size: .76rem;
}


.price-file span {
    color:
        rgba(255,255,255,.48);

    font-size: .58rem;
}


.price-update-arrow {
    height: 75px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex-direction: column;

    gap: 5px;

    color: #69d8e5;
}


.price-update-arrow span {
    width: 1px;
    height: 45px;

    background:
        linear-gradient(
            #247cff,
            #24b8cf
        );
}


.price-system {
    justify-content: space-between;
}


.price-update-status {
    padding:
        7px 10px;

    display: flex;
    align-items: center;

    gap: 6px;

    border-radius: 999px;

    color: #72e2aa;

    background:
        rgba(60,190,125,.1);

    font-size: .59rem;
}


/* ============================================================
   CORRECTIONS
============================================================ */

.pharmacy-corrections {
    padding:
        130px 0;

    color: #fff;

    background:
        linear-gradient(
            135deg,
            #17232c,
            #101820
        );
}


.pharmacy-correction-header {
    max-width: 850px;
}


.pharmacy-correction-header h2 {
    margin: 0;

    font-size:
        clamp(3.5rem, 6vw, 6.3rem);

    line-height: .92;

    letter-spacing: -.07em;
}


.pharmacy-correction-header p {
    max-width: 620px;

    margin-top: 27px;

    color:
        rgba(255,255,255,.52);

    line-height: 1.8;
}


.pharmacy-correction-flow {
    margin-top: 80px;

    display: grid;

    grid-template-columns:
        1fr auto
        1fr auto
        1fr;

    gap: 22px;

    align-items: center;
}


.pharmacy-correction-flow article {
    min-height: 315px;

    padding: 30px;

    display: flex;
    flex-direction: column;

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius: 21px;

    background:
        rgba(255,255,255,.04);
}


.pharmacy-correction-flow article > span {
    color:
        rgba(255,255,255,.35);

    font-size: .61rem;
}


.pharmacy-correction-icon {
    width: 48px;
    height: 48px;

    margin-top: 30px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    color: #84e3ed;

    background:
        rgba(36,184,207,.1);

    font-size: 1.15rem;
}


.pharmacy-cancel-card
.pharmacy-correction-icon {
    color: #ff8181;

    background:
        rgba(255,80,80,.1);
}


.pharmacy-rebill-card
.pharmacy-correction-icon {
    color: #73e0aa;

    background:
        rgba(60,190,125,.1);
}


.pharmacy-correction-flow h3 {
    margin:
        auto 0 12px;

    font-size: 1.5rem;
}


.pharmacy-correction-flow p {
    margin: 0;

    color:
        rgba(255,255,255,.5);

    font-size: .74rem;

    line-height: 1.65;
}


.correction-route-arrow {
    color:
        rgba(255,255,255,.24);
}


/* ============================================================
   ORDERING
============================================================ */

.pharmacy-orders {
    background: #f5f8fa;
}


.order-layout {
    display: grid;

    grid-template-columns:
        .9fr 1.1fr;

    gap: 100px;

    align-items: center;
}


.order-navigation {
    margin-top: 40px;

    display: flex;
    align-items: center;

    flex-wrap: wrap;

    gap: 10px;

    color: #7b8790;

    font-size: .7rem;
}


.order-navigation span,
.order-navigation strong {
    padding:
        8px 11px;

    border-radius: 9px;

    background: #fff;
}


.order-navigation strong {
    color: #247cff;
}


.order-card {
    padding: 30px;

    border-radius: 25px;

    background: #fff;

    box-shadow:
        0 30px 80px
        rgba(25,50,70,.11);
}


.order-card-head {
    padding-bottom: 22px;

    display: flex;
    justify-content: space-between;

    border-bottom:
        1px solid
        rgba(15,23,42,.08);
}


.order-card-head small {
    display: block;

    color: #8a959d;

    font-size: .59rem;
}


.order-card-head strong {
    color: #101820;
}


.order-card-head i {
    color: #1d9fb6;

    font-size: 1.4rem;
}


.order-row {
    padding:
        18px 0;

    display: flex;
    justify-content: space-between;

    border-bottom:
        1px solid
        rgba(15,23,42,.07);
}


.order-row span {
    display: block;

    color: #26343e;

    font-size: .72rem;
}


.order-row small {
    color: #89949d;

    font-size: .57rem;
}


.order-row strong {
    color: #101820;
}


.order-submit {
    margin-top: 19px;

    padding: 17px;

    display: flex;
    justify-content: space-between;

    border-radius: 13px;

    background:
        rgba(46,183,121,.08);
}


.order-submit span {
    color: #6e7c75;

    font-size: .67rem;
}


.order-submit strong {
    color: #278459;

    font-size: .7rem;
}


/* ============================================================
   CONNECTED
============================================================ */

.pharmacy-connected {
    padding:
        130px 0;

    color: #fff;

    background: #101820;
}


.pharmacy-connected-header {
    max-width: 800px;
}


.pharmacy-connected-header h2 {
    margin: 0;

    font-size:
        clamp(3.4rem, 5.5vw, 5.9rem);

    line-height: .93;

    letter-spacing: -.07em;
}


.pharmacy-connected-header p {
    max-width: 560px;

    margin-top: 25px;

    color:
        rgba(255,255,255,.5);

    line-height: 1.75;
}


.pharmacy-connected-flow {
    margin-top: 75px;

    display: grid;

    grid-template-columns:
        1fr 65px
        1fr 65px
        1fr 65px
        1fr 65px
        1fr;

    align-items: center;
}


.pharmacy-connected-item {
    min-height: 145px;

    padding: 20px;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    gap: 13px;

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius: 17px;

    background:
        rgba(255,255,255,.035);

    text-align: center;
}


.pharmacy-connected-item i {
    color: #7ce0ea;

    font-size: 1.35rem;
}


.pharmacy-connected-item span {
    color:
        rgba(255,255,255,.65);

    font-size: .7rem;
}


.pharmacy-connected-main {
    border-color:
        rgba(36,184,207,.35);

    background:
        linear-gradient(
            135deg,
            rgba(36,124,255,.2),
            rgba(36,184,207,.1)
        );
}


.pharmacy-connected-line {
    position: relative;

    height: 2px;

    overflow: hidden;

    background:
        rgba(255,255,255,.1);
}


.pharmacy-connected-line span {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            #247cff,
            #24b8cf
        );

    transform-origin: left center;

    animation:
        pharmacyFlowLine
        2.5s ease-in-out infinite;
}


@keyframes pharmacyFlowLine {

    0% {
        transform:
            scaleX(0);
    }

    50%,
    100% {
        transform:
            scaleX(1);
    }

}


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

.pharmacy-cta {
    position: relative;

    padding:
        145px 0;

    overflow: hidden;

    color: #fff;

    background:
        linear-gradient(
            135deg,
            #176ee6,
            #19a0b8
        );
}


.pharmacy-cta-grid {
    position: absolute;
    inset: 0;

    opacity: .08;

    background-image:
        linear-gradient(
            rgba(255,255,255,.25) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.25) 1px,
            transparent 1px
        );

    background-size:
        80px 80px;
}


.pharmacy-cta-inner {
    position: relative;

    max-width: 900px;
}


.pharmacy-cta-inner h2 {
    margin: 0;

    font-size:
        clamp(3.6rem, 6vw, 6.5rem);

    line-height: .91;

    letter-spacing: -.075em;
}


.pharmacy-cta-inner p {
    max-width: 580px;

    margin:
        30px 0 38px;

    color:
        rgba(255,255,255,.72);

    line-height: 1.75;
}


/* ============================================================
   RESPONSIVE
============================================================ */

@media (max-width: 1100px) {

    .pharmacy-hero-layout,
    .pharmacy-intro-grid,
    .stocktake-layout,
    .price-update-layout,
    .order-layout {
        grid-template-columns: 1fr;
    }


    .pharmacy-stock-card {
        transform: none;
    }


    .pharmacy-intro-grid {
        gap: 35px;
    }


    .pharmacy-flow {
        grid-template-columns:
            repeat(3, 1fr);
    }


    .auto-transfer-steps {
        grid-template-columns:
            repeat(2, 1fr);
    }


    .pharmacy-connected-flow {
        grid-template-columns:
            repeat(5, 1fr);

        gap: 10px;
    }


    .pharmacy-connected-line {
        display: none;
    }

}


@media (max-width: 750px) {

    .pharmacy-hero {
        min-height: 0;

        padding:
            145px 0 85px;
    }


    .pharmacy-hero h1 {
        font-size:
            clamp(3.5rem, 16vw, 5.2rem);
    }


    .pharmacy-float-two {
        display: none;
    }


    .pharmacy-float-one {
        left: 10px;
        bottom: 10px;
    }


    .pharmacy-flow,
    .auto-transfer-steps {
        grid-template-columns: 1fr;
    }


    .stocktake-math {
        grid-template-columns: 1fr;
    }


    .stocktake-math > i {
        transform:
            rotate(90deg);

        text-align: center;
    }


    .transfer-map {
        grid-template-columns: 1fr;
    }


    .transfer-route {
        height: 100px;

        width: 2px;

        margin-inline: auto;
    }


    .transfer-route-line {
        top: 0;
        bottom: 0;
        left: 0;

        width: 2px;
        height: 100%;
    }


    .transfer-moving-stock {
        left: 50%;

        animation: none;

        transform:
            translate(-50%, 30px);
    }


    .transfer-nav {
        align-items: flex-start;

        flex-direction: column;
    }


    .pharmacy-correction-flow {
        grid-template-columns: 1fr;
    }


    .correction-route-arrow {
        text-align: center;

        transform:
            rotate(90deg);
    }


    .pharmacy-connected-flow {
        grid-template-columns:
            repeat(2, 1fr);
    }

}