/*
 BETCRAFT_BRIGHT_LUXURY_V1

 Bright luxury design system.

 Legacy feature markers intentionally retained:
 BETCRAFT_PREMIUM_EFFECTS_V1
 BETCRAFT_CONTACT_ICONS_UI_V1
 BETCRAFT_CONTACT_DIRECT_LINKS_V1
*/

@import url('https://fonts.googleapis.com/css2?family=Anuphan:wght@300;400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');


:root {
    --page:
        #f7f4ee;

    --page-soft:
        #fbfaf7;

    --paper:
        rgba(255,255,255,.82);

    --paper-solid:
        #ffffff;

    --text:
        #273342;

    --heading:
        #172338;

    --muted:
        #6f7988;

    --gold:
        #ba8c37;

    --gold-deep:
        #936820;

    --champagne:
        #efe0bb;

    --blue:
        #4169d8;

    --blue-soft:
        #e9efff;

    --line:
        rgba(91,79,55,.13);

    --line-strong:
        rgba(186,140,55,.26);

    --shadow:
        0 25px 70px
        rgba(54,62,77,.10);

    --shadow-soft:
        0 12px 36px
        rgba(54,62,77,.07);

    --radius:
        24px;

    --radius-lg:
        34px;

    --container:
        min(
            1180px,
            calc(100% - 40px)
        );

    --ease:
        cubic-bezier(.22,1,.36,1);
}


*,
*::before,
*::after {
    box-sizing:
        border-box;
}


html {
    scroll-behavior:
        smooth;

    background:
        var(--page);
}


body {
    margin: 0;

    min-height:
        100vh;

    overflow-x:
        hidden;

    color:
        var(--text);

    font-family:
        "Anuphan",
        "Segoe UI",
        sans-serif;

    line-height:
        1.7;

    background:
        radial-gradient(
            circle at 8% 8%,
            rgba(239,224,187,.62),
            transparent 30rem
        ),
        radial-gradient(
            circle at 95% 12%,
            rgba(215,225,255,.70),
            transparent 34rem
        ),
        linear-gradient(
            180deg,
            #fbfaf7 0%,
            #f7f4ee 46%,
            #faf8f3 100%
        );
}


img {
    display:
        block;

    max-width:
        100%;
}


a {
    color:
        inherit;
}


button,
a {
    -webkit-tap-highlight-color:
        transparent;
}


.container {
    width:
        var(--container);

    margin-inline:
        auto;
}


/* =========================================================
   HEADER
   ========================================================= */

.site-header {
    position:
        sticky;

    top:
        0;

    z-index:
        100;

    border-bottom:
        1px solid
        rgba(74,85,103,.08);

    background:
        rgba(251,250,247,.80);

    backdrop-filter:
        blur(22px);

    transition:
        background .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


.site-header.is-scrolled {
    background:
        rgba(255,255,255,.94);

    border-color:
        var(--line);

    box-shadow:
        0 12px 40px
        rgba(53,61,78,.075);
}


.nav {
    min-height:
        78px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        24px;
}


.brand {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        12px;

    text-decoration:
        none;
}


.brand-logo {
    width:
        47px;

    height:
        47px;

    object-fit:
        cover;

    border-radius:
        16px;

    border:
        1px solid
        rgba(186,140,55,.24);

    box-shadow:
        0 10px 28px
        rgba(61,67,80,.10);

    transition:
        transform .5s var(--ease);
}


.brand:hover .brand-logo {
    transform:
        translateY(-2px)
        rotate(-2deg);
}


.brand-copy {
    line-height:
        1.05;
}


.brand-copy strong {
    display:
        block;

    color:
        var(--heading);

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        16px;

    font-weight:
        800;

    letter-spacing:
        .035em;
}


.brand-copy span {
    display:
        block;

    margin-top:
        5px;

    color:
        #9b7b41;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        7px;

    font-weight:
        700;

    letter-spacing:
        .18em;
}


.nav-links {
    display:
        flex;

    align-items:
        center;

    gap:
        21px;
}


.nav-links a {
    position:
        relative;

    padding:
        10px 0;

    color:
        #566273;

    text-decoration:
        none;

    font-size:
        13px;

    font-weight:
        600;

    transition:
        color .25s ease;
}


.nav-links a::after {
    content:
        "";

    position:
        absolute;

    left:
        0;

    right:
        0;

    bottom:
        4px;

    height:
        1px;

    transform:
        scaleX(0);

    background:
        linear-gradient(
            90deg,
            var(--gold),
            var(--blue)
        );

    transition:
        transform .35s var(--ease);
}


.nav-links a:hover {
    color:
        var(--heading);
}


.nav-links a:hover::after {
    transform:
        scaleX(1);
}


.menu-button {
    display:
        none;

    width:
        46px;

    height:
        46px;

    border:
        1px solid
        var(--line);

    border-radius:
        14px;

    color:
        var(--heading);

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

    box-shadow:
        var(--shadow-soft);

    font-size:
        21px;

    cursor:
        pointer;
}


/* =========================================================
   TYPE
   ========================================================= */

.eyebrow {
    color:
        var(--gold-deep);

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        10px;

    font-weight:
        800;

    letter-spacing:
        .16em;

    text-transform:
        uppercase;
}


h1,
h2,
h3 {
    margin-top:
        0;

    color:
        var(--heading);

    text-wrap:
        balance;
}


h1 {
    margin-bottom:
        22px;

    font-size:
        clamp(
            46px,
            6vw,
            78px
        );

    font-weight:
        600;

    line-height:
        1.05;

    letter-spacing:
        -.048em;
}


h1 span {
    display:
        block;

    margin-top:
        7px;

    color:
        var(--gold-deep);

    font-weight:
        500;
}


h2 {
    margin-bottom:
        13px;

    font-size:
        clamp(
            31px,
            4vw,
            51px
        );

    font-weight:
        600;

    line-height:
        1.15;

    letter-spacing:
        -.032em;
}


h3 {
    margin-bottom:
        8px;

    font-size:
        20px;

    font-weight:
        600;

    line-height:
        1.35;
}


p {
    color:
        var(--muted);
}


.text-link {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        8px;

    color:
        var(--heading);

    text-decoration:
        none;

    font-size:
        13px;

    font-weight:
        650;

    border-bottom:
        1px solid
        rgba(23,35,56,.22);
}


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

.btn {
    position:
        relative;

    overflow:
        hidden;

    min-height:
        52px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        12px 24px;

    border:
        1px solid
        var(--heading);

    border-radius:
        999px;

    color:
        #fff;

    text-decoration:
        none;

    background:
        linear-gradient(
            135deg,
            #1c2a40,
            #304464
        );

    font-size:
        13px;

    font-weight:
        650;

    box-shadow:
        0 12px 32px
        rgba(34,49,72,.16);

    transition:
        transform .3s var(--ease),
        box-shadow .3s ease,
        filter .3s ease;
}


.btn::before {
    content:
        "";

    position:
        absolute;

    top:
        -130%;

    left:
        -50%;

    width:
        25%;

    height:
        360%;

    transform:
        rotate(18deg);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.65),
            transparent
        );

    transition:
        left .8s var(--ease);
}


.btn:hover {
    transform:
        translateY(-3px);

    box-shadow:
        0 18px 42px
        rgba(34,49,72,.20);
}


.btn:hover::before {
    left:
        130%;
}


.btn-outline {
    color:
        var(--heading);

    border-color:
        rgba(32,46,68,.18);

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

    box-shadow:
        var(--shadow-soft);
}


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

.hero {
    position:
        relative;

    overflow:
        hidden;

    padding:
        92px 0 96px;
}


.bright-hero::before {
    content:
        "";

    position:
        absolute;

    width:
        620px;

    height:
        620px;

    right:
        -180px;

    top:
        -210px;

    border-radius:
        50%;

    background:
        radial-gradient(
            circle,
            rgba(218,227,255,.92),
            rgba(239,224,187,.30) 42%,
            transparent 72%
        );

    filter:
        blur(4px);

    animation:
        brightFloat
        9s
        ease-in-out
        infinite alternate;
}


@keyframes brightFloat {

    from {
        transform:
            translate3d(
                -15px,
                -8px,
                0
            )
            scale(.96);
    }

    to {
        transform:
            translate3d(
                25px,
                22px,
                0
            )
            scale(1.06);
    }

}


.hero-grid {
    position:
        relative;

    z-index:
        2;

    display:
        grid;

    grid-template-columns:
        minmax(0,.92fr)
        minmax(480px,1.08fr);

    align-items:
        center;

    gap:
        58px;
}


.hero-lead {
    max-width:
        680px;

    margin:
        0;

    font-size:
        clamp(
            16px,
            1.7vw,
            19px
        );

    line-height:
        1.8;
}


.hero-actions {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        11px;

    margin-top:
        30px;
}


.hero-trust {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        9px;

    margin-top:
        27px;
}


.hero-trust span {
    padding:
        7px 11px;

    border:
        1px solid
        rgba(87,98,116,.12);

    border-radius:
        999px;

    color:
        #6f7885;

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

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        9px;

    font-weight:
        700;

    letter-spacing:
        .05em;
}


.hero-cover-wrap {
    position:
        relative;

    overflow:
        visible;

    padding:
        12px;

    border:
        1px solid
        rgba(110,117,130,.12);

    border-radius:
        30px;

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

    box-shadow:
        0 38px 100px
        rgba(57,65,80,.16);

    backdrop-filter:
        blur(15px);

    transition:
        transform .8s var(--ease),
        box-shadow .8s ease;
}


.hero-cover-wrap:hover {
    transform:
        translateY(-6px)
        rotateX(.4deg)
        rotateY(-.4deg);

    box-shadow:
        0 46px 120px
        rgba(57,65,80,.19);
}


.hero-frame-top {
    height:
        34px;

    display:
        flex;

    align-items:
        center;

    gap:
        6px;

    padding:
        0 5px 10px;
}


.hero-frame-top span {
    width:
        7px;

    height:
        7px;

    border-radius:
        50%;

    background:
        #d7c8a5;
}


.hero-frame-top span:nth-child(2) {
    background:
        #c5d0ee;
}


.hero-frame-top span:nth-child(3) {
    background:
        #d8d9dc;
}


.hero-frame-top strong {
    margin-left:
        auto;

    color:
        #9b9387;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        7px;

    letter-spacing:
        .13em;
}


.hero-cover {
    width:
        100%;

    aspect-ratio:
        1942 / 809;

    object-fit:
        cover;

    border-radius:
        20px;
}


.hero-floating {
    position:
        absolute;

    display:
        flex;

    align-items:
        center;

    gap:
        9px;

    padding:
        10px 13px;

    border:
        1px solid
        rgba(85,95,112,.11);

    border-radius:
        14px;

    color:
        var(--heading);

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

    box-shadow:
        var(--shadow-soft);

    backdrop-filter:
        blur(14px);

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        9px;
}


.hero-floating span {
    color:
        var(--gold-deep);

    font-weight:
        800;
}


.hero-floating-one {
    left:
        -27px;

    bottom:
        64px;
}


.hero-floating-two {
    right:
        -22px;

    top:
        83px;
}


/* =========================================================
   SECTIONS
   ========================================================= */

section {
    position:
        relative;

    padding:
        76px 0;
}


.section-head {
    display:
        flex;

    justify-content:
        space-between;

    align-items:
        end;

    gap:
        26px;

    margin-bottom:
        30px;
}


.section-head p {
    max-width:
        700px;

    margin:
        0;
}


.centered-head {
    justify-content:
        center;

    text-align:
        center;
}


.centered-head p {
    margin-inline:
        auto;
}


/* =========================================================
   GENERIC CARDS
   ========================================================= */

.card,
.market-card,
.visual-card,
.gallery-item,
.feature {
    border:
        1px solid
        var(--line);

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

    box-shadow:
        var(--shadow-soft);

    backdrop-filter:
        blur(12px);

    transition:
        transform .55s var(--ease),
        box-shadow .55s ease,
        border-color .55s ease;
}


.card:hover,
.market-card:hover,
.visual-card:hover,
.gallery-item:hover,
.feature:hover {
    transform:
        translateY(-6px);

    border-color:
        var(--line-strong);

    box-shadow:
        var(--shadow);
}


.card {
    padding:
        26px;

    border-radius:
        var(--radius);
}


.card p {
    margin:
        0;
}


.grid {
    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0,1fr)
        );

    gap:
        18px;
}


.split {
    display:
        grid;

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

    gap:
        18px;
}


/* =========================================================
   CHOICE
   ========================================================= */

.choice-section {
    padding-top:
        52px;
}


.choice-grid {
    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0,1fr)
        );

    gap:
        17px;
}


.choice-card {
    position:
        relative;

    min-height:
        270px;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        space-between;

    color:
        inherit;

    text-decoration:
        none;

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


.choice-card.featured {
    background:
        linear-gradient(
            145deg,
            rgba(237,242,255,.96),
            rgba(255,252,243,.98)
        );

    border-color:
        rgba(65,105,216,.18);
}


.choice-number {
    color:
        #b49b6e;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        11px;

    font-weight:
        800;

    letter-spacing:
        .12em;
}


.choice-card h3 {
    margin-top:
        52px;

    font-size:
        27px;
}


.choice-arrow {
    position:
        absolute;

    right:
        22px;

    top:
        20px;

    width:
        38px;

    height:
        38px;

    display:
        grid;

    place-items:
        center;

    border:
        1px solid
        var(--line);

    border-radius:
        50%;

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

    font-family:
        "Manrope",
        sans-serif;
}


/* =========================================================
   SHOWCASE
   ========================================================= */

.showcase-section {
    padding-top:
        86px;
}


.showcase-grid {
    display:
        grid;

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

    gap:
        17px;
}


.showcase-card {
    overflow:
        hidden;

    border-radius:
        26px;

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


.showcase-wide {
    grid-column:
        span 2;
}


.showcase-media {
    overflow:
        hidden;

    aspect-ratio:
        4 / 3;

    background:
        #eceff4;
}


.showcase-wide
.showcase-media {
    aspect-ratio:
        16 / 9;
}


.showcase-media img {
    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    transition:
        transform .9s var(--ease),
        filter .9s ease;
}


.showcase-card:hover
.showcase-media img {
    transform:
        scale(1.035);

    filter:
        saturate(1.03)
        brightness(1.02);
}


.showcase-copy {
    padding:
        20px 21px 22px;
}


.showcase-copy > span {
    color:
        var(--gold-deep);

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        .15em;
}


.showcase-copy h3 {
    margin:
        7px 0 4px;

    font-size:
        20px;
}


.showcase-copy p {
    margin:
        0;

    font-size:
        12px;
}


/* =========================================================
   BENTO
   ========================================================= */

.bento-grid {
    display:
        grid;

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

    gap:
        17px;
}


.bento-card {
    min-height:
        240px;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        flex-end;

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


.bento-main {
    grid-column:
        span 2;

    background:
        linear-gradient(
            145deg,
            #fffdf8,
            #eef3ff
        );
}


.bento-accent {
    background:
        linear-gradient(
            150deg,
            #f5ead1,
            #fffdf7
        );
}


.bento-wide {
    grid-column:
        1 / -1;

    min-height:
        210px;

    flex-direction:
        row;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        30px;
}


.bento-wide h3 {
    max-width:
        620px;

    margin:
        10px 0 0;

    font-family:
        "Manrope",
        "Anuphan",
        sans-serif;

    font-size:
        clamp(
            28px,
            4vw,
            48px
        );

    font-weight:
        600;

    letter-spacing:
        -.035em;
}


.bento-kicker {
    color:
        var(--gold-deep);

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        .15em;
}


.bento-lines {
    width:
        min(260px, 34%);

    display:
        grid;

    gap:
        13px;
}


.bento-lines span {
    height:
        1px;

    background:
        linear-gradient(
            90deg,
            rgba(186,140,55,.12),
            rgba(65,105,216,.50)
        );
}


.bento-lines span:nth-child(2) {
    width:
        72%;
}


.bento-lines span:nth-child(3) {
    width:
        45%;
}


/* =========================================================
   OLD PAGE COMPONENTS — BRIGHT VERSION
   ========================================================= */

.market-grid {
    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0,1fr)
        );

    gap:
        18px;
}


.market-card {
    overflow:
        hidden;

    border-radius:
        22px;
}


.market-screen {
    position:
        relative;

    aspect-ratio:
        16 / 10;

    display:
        grid;

    place-items:
        center;

    padding:
        24px;

    color:
        #697488;

    text-align:
        center;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        11px;

    font-weight:
        800;

    letter-spacing:
        .08em;

    background:
        radial-gradient(
            circle at 68% 25%,
            rgba(65,105,216,.12),
            transparent 42%
        ),
        linear-gradient(
            145deg,
            #fdfbf6,
            #edf2ff
        );
}


.market-screen::before {
    content:
        "";

    position:
        absolute;

    left:
        17px;

    right:
        17px;

    top:
        16px;

    height:
        7px;

    border-radius:
        999px;

    background:
        linear-gradient(
            90deg,
            #c79a47 0 13%,
            rgba(87,99,117,.08) 13% 100%
        );
}


.market-copy {
    padding:
        18px;
}


.market-copy strong {
    display:
        block;

    margin-bottom:
        5px;

    color:
        var(--heading);
}


.market-copy span {
    color:
        var(--muted);

    font-size:
        12px;
}


.visual-grid {
    display:
        grid;

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

    gap:
        17px;
}


.visual-card {
    overflow:
        hidden;

    border-radius:
        21px;
}


.visual-card img {
    width:
        100%;

    aspect-ratio:
        1 / 1;

    object-fit:
        cover;
}


.visual-caption {
    padding:
        15px 16px 18px;

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


.visual-caption strong {
    display:
        block;

    color:
        var(--heading);

    font-size:
        13px;
}


.visual-caption span {
    display:
        block;

    margin-top:
        5px;

    color:
        var(--muted);

    font-size:
        10px;

    line-height:
        1.6;
}


.gallery-wall {
    columns:
        4;

    column-gap:
        17px;
}


.gallery-item {
    break-inside:
        avoid;

    overflow:
        hidden;

    margin-bottom:
        17px;

    border-radius:
        20px;
}


.gallery-item img {
    width:
        100%;

    height:
        auto;
}


.gallery-copy {
    padding:
        13px 14px 15px;

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


.gallery-copy strong {
    display:
        block;

    color:
        var(--heading);

    font-size:
        13px;
}


.gallery-copy span {
    display:
        block;

    margin-top:
        4px;

    color:
        var(--muted);

    font-size:
        10px;

    line-height:
        1.6;
}


.feature-strip {
    display:
        grid;

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

    gap:
        12px;
}


.feature {
    padding:
        20px;

    text-align:
        center;

    border-radius:
        18px;
}


.feature strong {
    display:
        block;

    color:
        var(--heading);

    font-size:
        16px;
}


.feature span {
    display:
        block;

    margin-top:
        3px;

    color:
        var(--muted);

    font-size:
        11px;
}


.page-hero {
    position:
        relative;

    overflow:
        hidden;

    min-height:
        400px;

    display:
        flex;

    align-items:
        end;

    padding:
        100px 0 64px;

    background-position:
        center;

    background-size:
        cover;

    background-color:
        #f6f2e9;

    background-blend-mode:
        soft-light;
}


.page-hero::before {
    content:
        "";

    position:
        absolute;

    inset:
        0;

    background:
        linear-gradient(
            90deg,
            rgba(251,250,247,.97),
            rgba(251,250,247,.90) 52%,
            rgba(238,243,255,.72)
        );
}


.page-hero .container {
    position:
        relative;

    z-index:
        2;
}


.page-hero h1 {
    max-width:
        900px;

    margin:
        12px 0 15px;

    font-size:
        clamp(
            40px,
            5.5vw,
            70px
        );
}


.page-hero p {
    max-width:
        720px;

    margin:
        0;
}


.ambient-band {
    position:
        relative;

    overflow:
        hidden;

    min-height:
        260px;

    display:
        flex;

    align-items:
        center;

    border:
        1px solid
        var(--line);

    border-radius:
        var(--radius-lg);

    background-position:
        center;

    background-size:
        cover;

    background-color:
        #f3efe5;

    background-blend-mode:
        soft-light;

    box-shadow:
        var(--shadow-soft);
}


.ambient-band::before {
    content:
        "";

    position:
        absolute;

    inset:
        0;

    background:
        linear-gradient(
            90deg,
            rgba(255,253,248,.96),
            rgba(248,248,247,.84)
        );
}


.ambient-band-copy {
    position:
        relative;

    z-index:
        2;

    max-width:
        720px;

    padding:
        clamp(
            30px,
            6vw,
            60px
        );
}


.ambient-triptych {
    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0,1fr)
        );

    gap:
        15px;
}


.ambient-triptych figure {
    position:
        relative;

    overflow:
        hidden;

    margin:
        0;

    min-height:
        280px;

    border:
        1px solid
        var(--line);

    border-radius:
        24px;

    box-shadow:
        var(--shadow-soft);
}


.ambient-triptych img {
    position:
        absolute;

    inset:
        0;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    filter:
        brightness(1.08)
        saturate(.80);
}


.ambient-triptych figure::after {
    content:
        "";

    position:
        absolute;

    inset:
        0;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.06),
            rgba(247,244,238,.26)
        );
}


.brand-panel {
    display:
        grid;

    grid-template-columns:
        260px
        minmax(0,1fr);

    align-items:
        center;

    gap:
        34px;
}


.brand-panel-logo {
    border:
        8px solid
        rgba(255,255,255,.90);

    border-radius:
        28px;

    box-shadow:
        var(--shadow);
}


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

.cta {
    padding:
        clamp(
            32px,
            6vw,
            60px
        );

    border:
        1px solid
        var(--line);

    border-radius:
        var(--radius-lg);

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.95),
            rgba(237,242,255,.92)
        );

    box-shadow:
        var(--shadow);

    transition:
        transform .55s var(--ease);
}


.cta:hover {
    transform:
        translateY(-4px);
}


.bright-cta {
    display:
        flex;

    align-items:
        end;

    justify-content:
        space-between;

    gap:
        40px;

    background:
        radial-gradient(
            circle at 90% 8%,
            rgba(224,232,255,.95),
            transparent 38%
        ),
        linear-gradient(
            135deg,
            #fffdf8,
            #f4efe4
        );
}


.bright-cta > div:first-child {
    max-width:
        720px;
}


.bright-cta
.hero-actions {
    flex:
        0 0 auto;
}


/* =========================================================
   CONTACT
   ========================================================= */

.contact-channels {
    position:
        relative;

    overflow:
        hidden;
}


.contact-channels::before {
    content:
        "";

    position:
        absolute;

    width:
        560px;

    height:
        560px;

    left:
        50%;

    top:
        46%;

    transform:
        translate(
            -50%,
            -50%
        );

    border-radius:
        50%;

    pointer-events:
        none;

    background:
        radial-gradient(
            circle,
            rgba(239,224,187,.56),
            rgba(223,232,255,.36) 45%,
            transparent 72%
        );
}


.contact-channel-head {
    position:
        relative;

    z-index:
        2;

    max-width:
        820px;

    margin:
        0 auto 34px;

    text-align:
        center;
}


.contact-channel-head p {
    max-width:
        670px;

    margin:
        10px auto 0;
}


.contact-channel-grid {
    position:
        relative;

    z-index:
        2;

    display:
        grid;

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

    gap:
        17px;
}


.contact-channel-card {
    position:
        relative;

    min-height:
        270px;

    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    padding:
        28px 20px;

    text-align:
        center;

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


.contact-channel-icon-shell {
    width:
        108px;

    height:
        108px;

    display:
        grid;

    place-items:
        center;

    margin-bottom:
        18px;

    border:
        1px solid
        var(--line);

    border-radius:
        29px;

    background:
        linear-gradient(
            145deg,
            #fff,
            #f3f5fa
        );

    box-shadow:
        0 15px 34px
        rgba(61,68,82,.10);

    transition:
        transform .5s var(--ease),
        box-shadow .5s ease;
}


.contact-channel-card:hover
.contact-channel-icon-shell {
    transform:
        translateY(-5px)
        scale(1.03);

    box-shadow:
        0 22px 46px
        rgba(61,68,82,.14);
}


.contact-channel-icon {
    width:
        70px;

    height:
        70px;

    object-fit:
        contain;
}


.contact-channel-card h3 {
    margin-bottom:
        5px;

    font-family:
        "Manrope",
        "Anuphan",
        sans-serif;
}


.contact-channel-card p {
    max-width:
        230px;

    margin:
        0;

    font-size:
        12px;
}


.contact-channel-note {
    display:
        inline-flex;

    margin-top:
        14px;

    padding:
        4px 9px;

    border:
        1px solid
        var(--line);

    border-radius:
        999px;

    color:
        #8f7443;

    background:
        #fbf7ed;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        .11em;
}


.contact-channel-link {
    color:
        inherit;

    text-decoration:
        none;

    cursor:
        pointer;
}


.contact-channel-link:visited {
    color:
        inherit;
}


.contact-channel-link:focus-visible {
    outline:
        2px solid
        var(--blue);

    outline-offset:
        4px;
}


/* =========================================================
   FOOTER
   ========================================================= */

.site-footer {
    margin-top:
        55px;

    padding:
        48px 0;

    border-top:
        1px solid
        var(--line);

    color:
        var(--muted);

    background:
        rgba(240,235,225,.62);
}


.footer-grid {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        30px;
}


.footer-brand {
    display:
        flex;

    align-items:
        center;

    gap:
        12px;
}


.footer-brand img {
    width:
        42px;

    height:
        42px;

    object-fit:
        cover;

    border-radius:
        14px;
}


.footer-brand strong {
    display:
        block;

    color:
        var(--heading);

    font-family:
        "Manrope",
        sans-serif;
}


.footer-brand span {
    font-size:
        11px;
}


.footer-links {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        15px;
}


.footer-links a {
    color:
        #687383;

    text-decoration:
        none;

    font-size:
        12px;
}


/* =========================================================
   EXISTING PREMIUM EFFECTS
   ========================================================= */

.effects-ready
.reveal-target {
    opacity:
        0;

    transform:
        translate3d(
            0,
            24px,
            0
        );

    transition:
        opacity .65s var(--ease),
        transform .65s var(--ease);
}


.effects-ready
.reveal-target.reveal-visible {
    opacity:
        1;

    transform:
        translate3d(
            0,
            0,
            0
        );
}


.effects-ready
.reveal-delay-1 {
    transition-delay:
        45ms;
}


.effects-ready
.reveal-delay-2 {
    transition-delay:
        90ms;
}


.effects-ready
.reveal-delay-3 {
    transition-delay:
        135ms;
}


.effects-ready
.reveal-delay-4 {
    transition-delay:
        180ms;
}


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

@media (max-width: 1020px) {

    .hero-grid {
        grid-template-columns:
            1fr;

        gap:
            45px;
    }


    .hero-cover-wrap {
        max-width:
            850px;
    }


    .choice-grid {
        grid-template-columns:
            1fr;
    }


    .choice-card {
        min-height:
            220px;
    }


    .showcase-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    .bento-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    .bento-main {
        grid-column:
            span 2;
    }


    .market-grid,
    .grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    .visual-grid {
        grid-template-columns:
            repeat(
                3,
                minmax(0,1fr)
            );
    }


    .gallery-wall {
        columns:
            3;
    }


    .contact-channel-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }

}


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

@media (max-width: 760px) {

    :root {
        --container:
            min(
                calc(100% - 26px),
                1180px
            );
    }


    .nav {
        min-height:
            70px;
    }


    .brand-logo {
        width:
            42px;

        height:
            42px;
    }


    .brand-copy strong {
        font-size:
            14px;
    }


    .brand-copy span {
        font-size:
            6.5px;
    }


    .menu-button {
        display:
            grid;

        place-items:
            center;
    }


    .nav-links {
        position:
            absolute;

        top:
            70px;

        left:
            13px;

        right:
            13px;

        display:
            none;

        flex-direction:
            column;

        align-items:
            stretch;

        gap:
            1px;

        padding:
            13px;

        border:
            1px solid
            var(--line);

        border-radius:
            18px;

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

        box-shadow:
            var(--shadow);
    }


    .nav-links.is-open {
        display:
            flex;
    }


    .nav-links a {
        padding:
            11px 8px;
    }


    .hero {
        padding:
            58px 0 52px;
    }


    h1 {
        font-size:
            clamp(
                40px,
                12vw,
                56px
            );
    }


    h2 {
        font-size:
            clamp(
                30px,
                9vw,
                42px
            );
    }


    section {
        padding:
            54px 0;
    }


    .hero-actions {
        width:
            100%;
    }


    .hero-actions
    .btn {
        flex:
            1 1 100%;
    }


    .hero-floating {
        display:
            none;
    }


    .hero-cover-wrap {
        padding:
            8px;

        border-radius:
            22px;
    }


    .hero-cover {
        border-radius:
            15px;
    }


    .section-head {
        flex-direction:
            column;

        align-items:
            flex-start;
    }


    .centered-head {
        align-items:
            center;
    }


    .choice-card h3 {
        margin-top:
            30px;
    }


    .showcase-grid {
        grid-template-columns:
            1fr;
    }


    .showcase-wide {
        grid-column:
            auto;
    }


    .bento-grid {
        grid-template-columns:
            1fr;
    }


    .bento-main,
    .bento-wide {
        grid-column:
            auto;
    }


    .bento-wide {
        flex-direction:
            column;

        align-items:
            flex-start;
    }


    .bento-lines {
        width:
            100%;
    }


    .market-grid,
    .grid,
    .split {
        grid-template-columns:
            1fr;
    }


    .visual-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );

        gap:
            11px;
    }


    .gallery-wall {
        columns:
            2;

        column-gap:
            11px;
    }


    .gallery-item {
        margin-bottom:
            11px;
    }


    .ambient-triptych {
        grid-template-columns:
            1fr;
    }


    .feature-strip {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    .page-hero {
        min-height:
            350px;

        padding:
            76px 0 48px;
    }


    .brand-panel {
        grid-template-columns:
            1fr;
    }


    .brand-panel-logo {
        width:
            min(
                230px,
                72vw
            );
    }


    .bright-cta {
        flex-direction:
            column;

        align-items:
            stretch;
    }


    .contact-channel-grid {
        grid-template-columns:
            1fr;
    }


    .footer-grid {
        flex-direction:
            column;

        align-items:
            flex-start;
    }


    .card:hover,
    .market-card:hover,
    .visual-card:hover,
    .gallery-item:hover,
    .feature:hover,
    .cta:hover,
    .hero-cover-wrap:hover {
        transform:
            none;
    }

}


@media (max-width: 430px) {

    .visual-grid {
        grid-template-columns:
            1fr;
    }


    .gallery-wall {
        columns:
            1;
    }


    .feature-strip {
        grid-template-columns:
            1fr;
    }

}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

.btn:focus-visible,
.nav-links a:focus-visible,
.brand:focus-visible,
.menu-button:focus-visible,
.choice-card:focus-visible,
.text-link:focus-visible {
    outline:
        2px solid
        var(--blue);

    outline-offset:
        4px;
}


@media (prefers-reduced-motion: reduce) {

    html {
        scroll-behavior:
            auto;
    }


    *,
    *::before,
    *::after {
        animation-duration:
            .001ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            .001ms !important;

        scroll-behavior:
            auto !important;
    }


    .effects-ready
    .reveal-target {
        opacity:
            1 !important;

        transform:
            none !important;
    }

}


/* =========================================================
   BETCRAFT_STUDIO_HOME_V2
   Desktop + Mobile premium studio redesign
   ========================================================= */

.betcraft-home-v2 {
    overflow:
        hidden;

    font-family:
        "Anuphan",
        sans-serif;
}


.betcraft-home-v2 *,
.betcraft-home-v2 *::before,
.betcraft-home-v2 *::after {
    box-sizing:
        border-box;
}


.studio-eyebrow {
    margin-bottom:
        14px;

    color:
        #aa792d;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        10px;

    font-weight:
        800;

    letter-spacing:
        .23em;
}


/* HERO */

.studio-hero {
    position:
        relative;

    padding:
        90px 0 84px;

    background:
        linear-gradient(
            125deg,
            #fffdf9 0%,
            #faf6ee 45%,
            #f5f8fc 100%
        );
}


.studio-hero::after {
    content:
        "";

    position:
        absolute;

    inset:
        auto 0 0;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(167,119,43,.24),
            transparent
        );
}


.studio-hero-glow {
    position:
        absolute;

    pointer-events:
        none;

    border-radius:
        50%;

    filter:
        blur(2px);
}


.glow-one {
    width:
        500px;

    height:
        500px;

    left:
        -260px;

    top:
        -190px;

    background:
        radial-gradient(
            circle,
            rgba(228,195,132,.30),
            transparent 68%
        );
}


.glow-two {
    width:
        620px;

    height:
        620px;

    right:
        -240px;

    top:
        -220px;

    background:
        radial-gradient(
            circle,
            rgba(167,199,236,.31),
            transparent 69%
        );
}


.studio-hero-grid {
    position:
        relative;

    z-index:
        2;

    display:
        grid;

    grid-template-columns:
        minmax(0,.88fr)
        minmax(540px,1.12fr);

    align-items:
        center;

    gap:
        65px;
}


.studio-hero-copy h1 {
    margin:
        0;

    color:
        #122a4e;

    font-size:
        clamp(
            48px,
            5.4vw,
            77px
        );

    font-weight:
        650;

    line-height:
        1.05;

    letter-spacing:
        -.045em;
}


.studio-hero-copy h1 span {
    display:
        block;

    color:
        #122a4e;
}


.studio-hero-copy h1 strong {
    display:
        block;

    margin-top:
        7px;

    color:
        #b48235;

    font-weight:
        600;
}


.studio-hero-lead {
    max-width:
        680px;

    margin:
        24px 0 0;

    color:
        #586779;

    font-size:
        16px;

    line-height:
        1.85;
}


.studio-actions {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        12px;

    margin-top:
        30px;
}


.studio-btn {
    min-height:
        52px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        24px;

    padding:
        12px 24px;

    border-radius:
        999px;

    text-decoration:
        none;

    font-size:
        13px;

    font-weight:
        650;

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}


.studio-btn:hover {
    transform:
        translateY(-3px);
}


.studio-btn-primary {
    color:
        white;

    background:
        linear-gradient(
            135deg,
            #c79a4b,
            #a87327
        );

    box-shadow:
        0 15px 35px
        rgba(167,115,39,.22);
}


.studio-btn-secondary {
    color:
        #183255;

    border:
        1px solid
        rgba(167,119,43,.35);

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


.studio-btn-dark {
    color:
        white;

    background:
        linear-gradient(
            135deg,
            #173252,
            #0e223c
        );

    box-shadow:
        0 16px 34px
        rgba(19,44,75,.18);
}


.studio-mini-trust {
    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0,1fr)
        );

    gap:
        18px;

    margin-top:
        38px;
}


.studio-mini-trust > div {
    display:
        grid;

    grid-template-columns:
        28px 1fr;

    column-gap:
        7px;
}


.mini-icon {
    grid-row:
        span 2;

    color:
        #173b68;

    font-size:
        20px;
}


.studio-mini-trust strong {
    color:
        #203853;

    font-size:
        11px;
}


.studio-mini-trust small {
    color:
        #8490a0;

    font-size:
        9px;
}


/* DEVICE */

.studio-device-stage {
    position:
        relative;

    min-height:
        510px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;
}


.device-orbit {
    position:
        absolute;

    border:
        1px solid
        rgba(199,154,75,.25);

    border-radius:
        50%;
}


.orbit-one {
    width:
        540px;

    height:
        310px;

    transform:
        rotate(-18deg);
}


.orbit-two {
    width:
        610px;

    height:
        360px;

    transform:
        rotate(12deg);
}


.studio-monitor {
    position:
        relative;

    z-index:
        3;

    width:
        min(
            540px,
            85%
        );
}


.monitor-shell {
    padding:
        10px;

    border:
        1px solid
        rgba(54,69,86,.15);

    border-radius:
        24px;

    background:
        linear-gradient(
            145deg,
            #f9fafb,
            #dfe3e8
        );

    box-shadow:
        0 35px 70px
        rgba(44,55,69,.22);
}


.monitor-top {
    height:
        28px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    padding:
        0 5px 8px;
}


.monitor-dots {
    display:
        flex;

    gap:
        5px;
}


.monitor-dots i {
    width:
        6px;

    height:
        6px;

    border-radius:
        50%;

    background:
        #d2b26f;
}


.monitor-dots i:nth-child(2) {
    background:
        #cfd6e0;
}


.monitor-dots i:nth-child(3) {
    background:
        #b9c9df;
}


.monitor-top span {
    color:
        #8e98a4;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        6px;

    font-weight:
        700;

    letter-spacing:
        .15em;
}


.monitor-screen {
    position:
        relative;

    overflow:
        hidden;

    aspect-ratio:
        16 / 9;

    border-radius:
        15px;

    background:
        #e7ebf0;
}


.monitor-screen img {
    width:
        100%;

    height:
        100%;

    object-fit:
        cover;
}


.screen-glass {
    position:
        absolute;

    inset:
        0;

    background:
        linear-gradient(
            115deg,
            rgba(255,255,255,.16),
            transparent 32%
        );

    pointer-events:
        none;
}


.monitor-neck {
    width:
        92px;

    height:
        54px;

    margin:
        0 auto;

    background:
        linear-gradient(
            90deg,
            #cfd4da,
            #f2f4f6,
            #c4cad1
        );
}


.monitor-base {
    width:
        210px;

    height:
        15px;

    margin:
        0 auto;

    border-radius:
        50%;

    background:
        linear-gradient(
            90deg,
            #c4cad0,
            #f7f8f9,
            #bcc2c9
        );

    box-shadow:
        0 10px 18px
        rgba(43,54,66,.14);
}


.studio-phone {
    position:
        absolute;

    z-index:
        6;

    left:
        2%;

    bottom:
        52px;

    width:
        125px;

    padding:
        6px;

    border:
        2px solid
        #1a2633;

    border-radius:
        27px;

    background:
        #111a24;

    box-shadow:
        0 24px 44px
        rgba(27,38,51,.27);

    transform:
        rotate(-3deg);
}


.phone-speaker {
    position:
        absolute;

    z-index:
        2;

    top:
        9px;

    left:
        50%;

    width:
        40px;

    height:
        4px;

    transform:
        translateX(-50%);

    border-radius:
        999px;

    background:
        #10151b;
}


.phone-screen {
    position:
        relative;

    overflow:
        hidden;

    aspect-ratio:
        9 / 18.5;

    border-radius:
        21px;

    background:
        white;
}


.phone-screen img {
    position:
        absolute;

    inset:
        0;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    filter:
        brightness(1.16)
        saturate(.75);
}


.phone-screen::after {
    content:
        "";

    position:
        absolute;

    inset:
        0;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.12),
            rgba(255,255,255,.88)
        );
}


.phone-ui {
    position:
        absolute;

    z-index:
        2;

    inset:
        auto 10px
        17px;

    color:
        #142f52;
}


.phone-ui span {
    display:
        block;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        6px;

    font-weight:
        800;

    letter-spacing:
        .16em;
}


.phone-ui strong {
    display:
        block;

    margin-top:
        5px;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        13px;

    line-height:
        1.1;
}


.phone-ui small {
    display:
        inline-block;

    margin-top:
        8px;

    padding:
        4px 6px;

    border-radius:
        999px;

    color:
        white;

    background:
        #173454;

    font-size:
        6px;
}


.studio-data-card {
    position:
        absolute;

    z-index:
        7;

    right:
        0;

    top:
        72px;

    width:
        150px;

    padding:
        17px;

    border:
        1px solid
        rgba(49,62,79,.10);

    border-radius:
        18px;

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

    box-shadow:
        0 18px 45px
        rgba(41,53,68,.13);

    backdrop-filter:
        blur(14px);
}


.studio-data-card span {
    display:
        block;

    color:
        #a07b3b;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        6px;

    font-weight:
        800;

    letter-spacing:
        .12em;
}


.studio-data-card strong {
    display:
        block;

    margin-top:
        5px;

    color:
        #1c3453;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        12px;
}


.data-bars {
    height:
        55px;

    display:
        flex;

    align-items:
        end;

    gap:
        7px;

    margin-top:
        13px;
}


.data-bars i {
    flex:
        1;

    border-radius:
        4px 4px 0 0;

    background:
        linear-gradient(
            180deg,
            #a9bdd8,
            #d8e2ef
        );
}


.data-bars i:nth-child(1) {
    height:
        25%;
}


.data-bars i:nth-child(2) {
    height:
        43%;
}


.data-bars i:nth-child(3) {
    height:
        58%;
}


.data-bars i:nth-child(4) {
    height:
        78%;
}


.data-bars i:nth-child(5) {
    height:
        100%;
}


.studio-script {
    position:
        absolute;

    z-index:
        7;

    right:
        -14px;

    bottom:
        44px;

    color:
        #b48a49;

    font-family:
        Georgia,
        serif;

    font-size:
        22px;

    font-style:
        italic;

    line-height:
        1.2;

    transform:
        rotate(-8deg);
}


/* GENERAL SECTIONS */

.studio-services,
.studio-works,
.studio-trust {
    padding:
        75px 0;

    background:
        #fff;
}


.studio-feature-strip,
.studio-solutions {
    padding:
        70px 0;

    background:
        linear-gradient(
            180deg,
            #fbfaf7,
            #f6f3eb
        );
}


.studio-section-intro {
    display:
        flex;

    align-items:
        end;

    justify-content:
        space-between;

    gap:
        40px;

    margin-bottom:
        28px;
}


.studio-section-intro h2,
.studio-works-head h2,
.feature-strip-intro h2,
.studio-solution-copy h2,
.trust-copy h2,
.contact-cta-panel h2 {
    margin:
        0;

    color:
        #132d50;

    font-size:
        clamp(
            31px,
            4vw,
            48px
        );

    font-weight:
        650;

    line-height:
        1.15;

    letter-spacing:
        -.035em;
}


.studio-section-intro > p {
    max-width:
        470px;

    margin:
        0;

    color:
        #778292;

    font-size:
        13px;
}


/* SERVICES */

.studio-service-grid {
    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0,1fr)
        );

    gap:
        16px;
}


.studio-service-card {
    position:
        relative;

    overflow:
        hidden;

    min-height:
        225px;

    padding:
        24px;

    border:
        1px solid
        rgba(91,101,113,.10);

    border-radius:
        24px;

    color:
        inherit;

    text-decoration:
        none;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.98),
            rgba(250,248,243,.95)
        );

    box-shadow:
        0 12px 35px
        rgba(48,59,73,.065);

    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}


.studio-service-card:hover {
    transform:
        translateY(-6px);

    border-color:
        rgba(181,133,54,.26);

    box-shadow:
        0 24px 50px
        rgba(48,59,73,.11);
}


.service-icon {
    width:
        46px;

    height:
        46px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        14px;

    color:
        #a7762d;

    background:
        linear-gradient(
            145deg,
            #f7eedc,
            #fff
        );

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        18px;

    font-weight:
        700;
}


.service-copy {
    position:
        relative;

    z-index:
        2;

    max-width:
        72%;

    margin-top:
        27px;
}


.service-copy h3 {
    margin:
        0;

    color:
        #173354;

    font-size:
        18px;

    font-weight:
        650;
}


.service-copy p {
    margin:
        8px 0 12px;

    color:
        #748091;

    font-size:
        11px;

    line-height:
        1.65;
}


.service-copy span {
    color:
        #173354;

    font-size:
        10px;

    font-weight:
        650;
}


.service-mini-device {
    position:
        absolute;

    right:
        -20px;

    top:
        34px;

    width:
        145px;

    transform:
        rotate(-4deg);

    filter:
        drop-shadow(
            0 14px 18px
            rgba(48,58,70,.16)
        );
}


.service-mini-device img {
    width:
        100%;

    aspect-ratio:
        16 / 10;

    object-fit:
        cover;

    border:
        6px solid
        white;

    border-radius:
        10px;
}


/* FEATURES */

.feature-strip-intro {
    max-width:
        630px;

    margin-bottom:
        25px;
}


.studio-feature-grid {
    display:
        grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0,1fr)
        );

    gap:
        12px;
}


.studio-feature-item {
    min-height:
        98px;

    display:
        flex;

    align-items:
        center;

    gap:
        14px;

    padding:
        17px;

    border:
        1px solid
        rgba(86,97,110,.09);

    border-radius:
        18px;

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

    box-shadow:
        0 10px 26px
        rgba(48,59,73,.045);
}


.feature-icon {
    flex:
        0 0 42px;

    width:
        42px;

    height:
        42px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        13px;

    color:
        #ad7a2f;

    background:
        #fbf4e6;

    font-size:
        18px;
}


.studio-feature-item strong {
    display:
        block;

    color:
        #183556;

    font-size:
        12px;
}


.studio-feature-item span {
    display:
        block;

    margin-top:
        3px;

    color:
        #86909e;

    font-size:
        9px;

    line-height:
        1.45;
}


/* WORK */

.studio-works-head {
    display:
        grid;

    grid-template-columns:
        minmax(0,1fr)
        auto;

    align-items:
        end;

    gap:
        40px;

    margin-bottom:
        28px;
}


.studio-works-head p {
    max-width:
        600px;

    margin:
        12px 0 0;

    color:
        #778292;

    font-size:
        13px;
}


.studio-outline-link {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        22px;

    min-height:
        46px;

    padding:
        10px 19px;

    border:
        1px solid
        rgba(171,122,43,.45);

    border-radius:
        999px;

    color:
        #7d5a25;

    text-decoration:
        none;

    font-size:
        11px;

    font-weight:
        650;
}


.studio-work-grid {
    display:
        grid;

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

    gap:
        17px;
}


.studio-work-card {
    overflow:
        hidden;

    border:
        1px solid
        rgba(78,89,103,.10);

    border-radius:
        22px;

    color:
        inherit;

    text-decoration:
        none;

    background:
        #fff;

    box-shadow:
        0 13px 34px
        rgba(50,60,72,.07);

    transition:
        transform .4s ease,
        box-shadow .4s ease;
}


.studio-work-card:hover {
    transform:
        translateY(-6px);

    box-shadow:
        0 25px 52px
        rgba(50,60,72,.12);
}


.work-image {
    overflow:
        hidden;

    aspect-ratio:
        16 / 10;

    background:
        #eef0f2;
}


.work-image img {
    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    transition:
        transform .65s ease;
}


.studio-work-card:hover
.work-image img {
    transform:
        scale(1.04);
}


.work-meta {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        18px;

    padding:
        16px 18px;
}


.work-meta strong {
    display:
        block;

    color:
        #173354;

    font-size:
        13px;
}


.work-meta span {
    display:
        block;

    margin-top:
        2px;

    color:
        #8a94a1;

    font-size:
        9px;
}


.work-meta i {
    width:
        32px;

    height:
        32px;

    display:
        grid;

    place-items:
        center;

    border:
        1px solid
        rgba(174,127,53,.25);

    border-radius:
        50%;

    color:
        #ac7b31;

    font-style:
        normal;
}


/* SOLUTIONS */

.studio-solution-layout {
    display:
        grid;

    grid-template-columns:
        .85fr 1.25fr .42fr;

    align-items:
        stretch;

    gap:
        20px;
}


.studio-solution-copy {
    padding:
        22px 0;
}


.studio-solution-copy p {
    max-width:
        440px;

    margin:
        17px 0 25px;

    color:
        #788393;

    font-size:
        13px;
}


.studio-solution-grid {
    display:
        grid;

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

    gap:
        12px;
}


.solution-card {
    display:
        flex;

    gap:
        15px;

    padding:
        21px;

    border:
        1px solid
        rgba(76,89,104,.09);

    border-radius:
        20px;

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

    box-shadow:
        0 10px 28px
        rgba(50,59,71,.05);
}


.solution-icon {
    flex:
        0 0 44px;

    width:
        44px;

    height:
        44px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        14px;

    color:
        #a9752e;

    background:
        #fbf3e4;

    font-size:
        18px;
}


.solution-card strong {
    color:
        #153151;

    font-size:
        12px;
}


.solution-card p {
    margin:
        4px 0 0;

    color:
        #7d8896;

    font-size:
        9px;

    line-height:
        1.55;
}


.studio-architecture-card {
    position:
        relative;

    overflow:
        hidden;

    min-height:
        310px;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        flex-end;

    padding:
        22px;

    border-radius:
        24px;

    background:
        linear-gradient(
            160deg,
            rgba(219,232,247,.96),
            rgba(250,245,234,.98)
        );
}


.studio-architecture-card::before {
    content:
        "";

    position:
        absolute;

    width:
        260px;

    height:
        260px;

    top:
        -75px;

    right:
        -100px;

    border:
        1px solid
        rgba(170,121,44,.25);

    border-radius:
        50%;
}


.studio-architecture-card div {
    color:
        #ae7e37;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        8px;

    letter-spacing:
        .15em;
}


.studio-architecture-card strong {
    margin-top:
        8px;

    color:
        #173251;

    font-family:
        "Manrope",
        sans-serif;

    font-size:
        18px;

    line-height:
        1.35;
}


/* TRUST */

.studio-trust-grid {
    display:
        grid;

    grid-template-columns:
        1.5fr
        repeat(
            4,
            minmax(0,.7fr)
        );

    align-items:
        center;

    gap:
        20px;
}


.trust-copy p {
    max-width:
        440px;

    margin:
        12px 0 0;

    color:
        #7a8594;

    font-size:
        12px;
}


.trust-point {
    min-height:
        125px;

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    padding:
        17px;

    border-left:
        1px solid
        rgba(76,88,104,.10);
}


.trust-point > span {
    color:
        #b27e30;

    font-size:
        27px;
}


.trust-point strong {
    margin-top:
        8px;

    color:
        #163253;

    font-size:
        12px;
}


.trust-point small {
    margin-top:
        3px;

    color:
        #8993a0;

    font-size:
        8px;
}


/* CONTACT */

.studio-contact-cta {
    position:
        relative;

    overflow:
        hidden;

    padding:
        65px 0;

    background:
        linear-gradient(
            180deg,
            #eef4f7,
            #f9f4e9
        );
}


.contact-landscape {
    position:
        absolute;

    inset:
        0;

    opacity:
        .55;

    background:
        radial-gradient(
            ellipse at 20% 100%,
            #cddbe5,
            transparent 40%
        ),
        radial-gradient(
            ellipse at 70% 120%,
            #e2d7bf,
            transparent 42%
        );
}


.contact-cta-panel {
    position:
        relative;

    z-index:
        2;

    display:
        grid;

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

    align-items:
        center;

    gap:
        30px;

    padding:
        35px;

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

    border-radius:
        28px;

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

    box-shadow:
        0 22px 55px
        rgba(57,67,78,.10);

    backdrop-filter:
        blur(20px);
}


.contact-cta-panel p {
    margin:
        7px 0 0;

    color:
        #7c8796;

    font-size:
        11px;
}


.studio-social-row {
    display:
        grid;

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

    gap:
        8px;
}


.studio-social-row a {
    min-width:
        74px;

    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    gap:
        5px;

    padding:
        11px 8px;

    border:
        1px solid
        rgba(71,83,98,.08);

    border-radius:
        16px;

    color:
        #566577;

    text-decoration:
        none;

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


.studio-social-row img {
    width:
        31px;

    height:
        31px;

    object-fit:
        contain;
}


.studio-social-row span {
    font-family:
        "Manrope",
        sans-serif;

    font-size:
        8px;

    font-weight:
        650;
}


/* TABLET */

@media (max-width: 1080px) {

    .studio-hero-grid {
        grid-template-columns:
            1fr;

        gap:
            25px;
    }


    .studio-device-stage {
        width:
            min(
                760px,
                100%
            );

        margin:
            0 auto;
    }


    .studio-service-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    .studio-feature-grid {
        grid-template-columns:
            repeat(
                3,
                minmax(0,1fr)
            );
    }


    .studio-solution-layout {
        grid-template-columns:
            1fr;
    }


    .studio-architecture-card {
        min-height:
            180px;
    }


    .studio-trust-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    .trust-copy {
        grid-column:
            1 / -1;
    }


    .contact-cta-panel {
        grid-template-columns:
            1fr;

        text-align:
            center;
    }

}


/* MOBILE */

@media (max-width: 700px) {

    .studio-hero {
        padding:
            47px 0 43px;
    }


    .studio-hero-grid {
        gap:
            40px;
    }


    .studio-hero-copy {
        text-align:
            left;
    }


    .studio-hero-copy h1 {
        font-size:
            clamp(
                42px,
                12vw,
                58px
            );
    }


    .studio-hero-lead {
        font-size:
            14px;

        line-height:
            1.75;
    }


    .studio-actions {
        display:
            grid;

        grid-template-columns:
            1fr;
    }


    .studio-btn {
        width:
            100%;
    }


    .studio-mini-trust {
        grid-template-columns:
            repeat(
                3,
                minmax(0,1fr)
            );

        gap:
            7px;
    }


    .studio-mini-trust > div {
        display:
            flex;

        flex-direction:
            column;

        align-items:
            center;

        text-align:
            center;
    }


    .studio-mini-trust small {
        display:
            none;
    }


    .studio-device-stage {
        min-height:
            390px;
    }


    .studio-monitor {
        width:
            90%;

        transform:
            translateX(5%);
    }


    .studio-phone {
        left:
            0;

        bottom:
            43px;

        width:
            94px;
    }


    .studio-data-card {
        right:
            -5px;

        top:
            30px;

        width:
            108px;

        padding:
            11px;
    }


    .studio-data-card strong {
        font-size:
            9px;
    }


    .data-bars {
        height:
            37px;
    }


    .studio-script {
        display:
            none;
    }


    .studio-services,
    .studio-works,
    .studio-trust,
    .studio-feature-strip,
    .studio-solutions {
        padding:
            54px 0;
    }


    .studio-section-intro,
    .studio-works-head {
        display:
            block;
    }


    .studio-section-intro > p {
        margin-top:
            12px;
    }


    .studio-service-grid {
        grid-template-columns:
            1fr;
    }


    .studio-service-card {
        min-height:
            195px;
    }


    .service-copy {
        max-width:
            64%;
    }


    .service-mini-device {
        width:
            130px;

        top:
            48px;
    }


    .studio-feature-grid {
        grid-template-columns:
            1fr;
    }


    .studio-feature-item {
        min-height:
            78px;
    }


    .studio-work-grid {
        display:
            flex;

        overflow-x:
            auto;

        gap:
            13px;

        margin-right:
            -13px;

        padding-right:
            13px;

        scroll-snap-type:
            x mandatory;

        scrollbar-width:
            none;
    }


    .studio-work-grid::-webkit-scrollbar {
        display:
            none;
    }


    .studio-work-card {
        flex:
            0 0 84%;

        scroll-snap-align:
            start;
    }


    .studio-outline-link {
        margin-top:
            19px;
    }


    .studio-solution-grid {
        grid-template-columns:
            1fr;
    }


    .studio-trust-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );

        gap:
            8px;
    }


    .trust-point {
        min-height:
            130px;

        border:
            1px solid
            rgba(77,89,103,.08);

        border-radius:
            17px;

        background:
            #fff;
    }


    .contact-cta-panel {
        padding:
            27px 17px;
    }


    .studio-social-row {
        grid-template-columns:
            repeat(
                4,
                minmax(0,1fr)
            );

        gap:
            5px;
    }


    .studio-social-row a {
        min-width:
            0;

        padding:
            9px 4px;
    }


    .studio-social-row span {
        font-size:
            6.5px;
    }

}


@media (max-width: 400px) {

    .studio-mini-trust {
        gap:
            2px;
    }


    .studio-mini-trust strong {
        font-size:
            9px;
    }


    .studio-device-stage {
        min-height:
            350px;
    }


    .studio-service-card {
        min-height:
            180px;
    }


    .service-copy {
        max-width:
            62%;
    }


    .service-copy h3 {
        font-size:
            16px;
    }


    .service-mini-device {
        width:
            112px;
    }

}


@media (
    prefers-reduced-motion:
    reduce
) {

    .studio-service-card,
    .studio-work-card,
    .studio-btn {
        transition:
            none;
    }

}


/* ==========================================================
   BETCRAFT MOBILE RESPONSIVE FIX V1
   Mobile only. Desktop design remains unchanged.
   ========================================================== */

@media (max-width: 760px) {

    :root {
        --container:
            min(
                calc(100% - 30px),
                1180px
            );
    }


    /*
     * GLOBAL MOBILE TYPOGRAPHY
     */

    body h1 {
        font-size:
            clamp(
                32px,
                9vw,
                42px
            ) !important;

        line-height:
            1.08 !important;

        letter-spacing:
            -0.035em;
    }


    body h2 {
        font-size:
            clamp(
                27px,
                7.5vw,
                35px
            ) !important;

        line-height:
            1.12 !important;

        letter-spacing:
            -0.025em;
    }


    body h3 {
        line-height:
            1.22;
    }


    /*
     * GLOBAL MOBILE SECTION SPACING
     */

    section {
        padding:
            40px 0;
    }


    .page-hero {
        min-height:
            auto;

        padding:
            46px 0 32px;
    }


    /*
     * HEADER
     */

    .nav {
        min-height:
            64px;
    }


    .brand-logo {
        width:
            40px;

        height:
            40px;
    }


    .brand-copy strong {
        font-size:
            14px;
    }


    .brand-copy span {
        font-size:
            6px;

        letter-spacing:
            .16em;
    }


    .menu-button {
        width:
            48px;

        height:
            48px;
    }


    .nav-links {
        top:
            64px;
    }


    /*
     * HOME HERO
     */

    .studio-hero {
        padding:
            32px 0 36px;
    }


    .studio-hero-grid {
        gap:
            24px;
    }


    .studio-hero-copy {
        text-align:
            left;
    }


    .studio-hero-copy h1 {
        max-width:
            12.5ch;

        margin-bottom:
            17px;

        font-size:
            clamp(
                33px,
                9.2vw,
                43px
            ) !important;

        line-height:
            1.06 !important;
    }


    .studio-hero-lead {
        max-width:
            35em;

        font-size:
            14px;

        line-height:
            1.65;
    }


    .studio-actions {
        display:
            flex;

        flex-wrap:
            wrap;

        grid-template-columns:
            none;

        gap:
            9px;
    }


    .studio-btn {
        width:
            auto;

        min-height:
            44px;

        padding:
            11px 17px;
    }


    /*
     * HERO DEVICE MOCKUP
     */

    .studio-device-stage {
        width:
            100%;

        min-height:
            270px;

        margin:
            0 auto;
    }


    .studio-monitor {
        width:
            88%;

        transform:
            translateX(6%);
    }


    .studio-phone {
        left:
            2px;

        bottom:
            25px;

        width:
            74px;
    }


    .studio-data-card {
        right:
            0;

        top:
            21px;

        width:
            94px;

        padding:
            9px;
    }


    .studio-data-card strong {
        font-size:
            8px;
    }


    .data-bars {
        height:
            30px;
    }


    /*
     * SMALL TRUST ROW
     */

    .studio-mini-trust {
        gap:
            5px;
    }


    .studio-mini-trust strong {
        font-size:
            10px;
    }


    /*
     * HOME SECTIONS
     */

    .studio-services,
    .studio-works,
    .studio-trust,
    .studio-feature-strip,
    .studio-solutions {
        padding:
            40px 0;
    }


    .studio-section-intro,
    .studio-works-head {
        margin-bottom:
            22px;
    }


    .studio-section-intro > p {
        margin-top:
            9px;
    }


    /*
     * SERVICE CARDS
     */

    .studio-service-grid {
        gap:
            11px;
    }


    .studio-service-card {
        min-height:
            152px;
    }


    .service-copy {
        max-width:
            67%;
    }


    .service-copy h3 {
        font-size:
            17px;
    }


    .service-mini-device {
        width:
            102px;

        top:
            34px;
    }


    /*
     * FEATURE CARDS
     */

    .studio-feature-grid {
        gap:
            9px;
    }


    .studio-feature-item {
        min-height:
            64px;
    }


    /*
     * HOME WORK / PROJECT CARDS
     *
     * Old mobile CSS used 84% horizontal cards.
     * Replace with compact 2-column layout.
     */

    .studio-work-grid {
        display:
            grid;

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

        overflow:
            visible;

        gap:
            10px;

        margin-right:
            0;

        padding-right:
            0;

        scroll-snap-type:
            none;
    }


    .studio-work-card {
        flex:
            none;

        min-width:
            0;

        width:
            auto;

        scroll-snap-align:
            none;
    }


    .studio-work-card img {
        display:
            block;

        width:
            100%;

        aspect-ratio:
            16 / 10;

        object-fit:
            cover;
    }


    .studio-outline-link {
        margin-top:
            15px;
    }


    /*
     * TRUST
     */

    .studio-trust-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            8px;
    }


    .trust-point {
        min-height:
            100px;
    }


    /*
     * CONTACT CTA ON HOME
     */

    .contact-cta-panel {
        padding:
            20px 14px;
    }


    .studio-social-row {
        gap:
            6px;
    }


    .studio-social-row a {
        padding:
            8px 3px;
    }


    /*
     * CONTACT PAGE
     *
     * Old CSS changed contact cards to 1 column,
     * which made each card excessively large.
     */

    .contact-channel-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            ) !important;

        gap:
            10px;
    }


    .contact-channel-grid > * {
        min-width:
            0;

        min-height:
            0 !important;

        padding:
            15px 10px !important;

        border-radius:
            18px !important;
    }


    .contact-channel-grid img {
        width:
            56px !important;

        height:
            56px !important;

        max-width:
            56px !important;

        object-fit:
            contain;
    }


    .contact-channel-grid :where(h2, h3, h4) {
        margin-top:
            10px;

        margin-bottom:
            5px;

        font-size:
            15px !important;

        line-height:
            1.18 !important;
    }


    .contact-channel-grid p {
        margin-top:
            5px;

        font-size:
            11px;

        line-height:
            1.45;
    }


    .contact-channel-grid :where(a, button) {
        font-size:
            10px;
    }


    /*
     * PORTFOLIO / IMAGE WALL
     *
     * Keep images compact on mobile instead of
     * stacking one enormous image per row.
     */

    .visual-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            ) !important;

        gap:
            8px;
    }


    .gallery-wall {
        columns:
            2 !important;

        column-gap:
            8px;
    }


    .gallery-item {
        margin-bottom:
            8px;
    }


    .gallery-item img,
    .visual-card img {
        display:
            block;

        width:
            100%;

        height:
            auto;
    }


    /*
     * REMOVE MOBILE EXCESSIVE EMPTY SPACE
     */

    .studio-architecture-card {
        min-height:
            auto;
    }


    .choice-card {
        min-height:
            auto;
    }

}


@media (max-width: 430px) {

    :root {
        --container:
            min(
                calc(100% - 24px),
                1180px
            );
    }


    body h1 {
        font-size:
            clamp(
                30px,
                9vw,
                38px
            ) !important;
    }


    body h2 {
        font-size:
            clamp(
                25px,
                7.3vw,
                32px
            ) !important;
    }


    section {
        padding:
            35px 0;
    }


    .studio-hero {
        padding:
            27px 0 31px;
    }


    .studio-hero-copy h1 {
        font-size:
            clamp(
                31px,
                9.3vw,
                38px
            ) !important;
    }


    .studio-hero-grid {
        gap:
            20px;
    }


    .studio-device-stage {
        min-height:
            225px;
    }


    .studio-monitor {
        width:
            94%;

        transform:
            translateX(3%);
    }


    .studio-phone {
        width:
            62px;

        bottom:
            19px;
    }


    .studio-data-card {
        width:
            82px;

        top:
            17px;

        padding:
            7px;
    }


    .studio-service-card {
        min-height:
            142px;
    }


    .service-copy {
        max-width:
            66%;
    }


    .service-copy h3 {
        font-size:
            16px;
    }


    .service-mini-device {
        width:
            88px;

        top:
            30px;
    }


    .studio-work-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            8px;
    }


    .studio-trust-grid {
        gap:
            7px;
    }


    .trust-point {
        min-height:
            92px;
    }


    .contact-channel-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            ) !important;

        gap:
            8px;
    }


    .contact-channel-grid > * {
        padding:
            12px 8px !important;
    }


    .contact-channel-grid img {
        width:
            48px !important;

        height:
            48px !important;

        max-width:
            48px !important;
    }


    .contact-channel-grid :where(h2, h3, h4) {
        font-size:
            14px !important;
    }


    .contact-channel-grid p {
        font-size:
            10px;
    }


    .gallery-wall {
        columns:
            2 !important;
    }


    .visual-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            ) !important;
    }

}

/* END BETCRAFT MOBILE RESPONSIVE FIX V1 */

/* ==========================================================
   BETCRAFT SELECTED PORTFOLIO 17 V1
   Real user-supplied project screenshots, 17/17.
   ========================================================== */

.gallery-wall.betcraft-selected-17 {
    columns: 4;
    column-gap: 18px;
}

.gallery-wall.betcraft-selected-17 .betcraft-project-shot {
    display: inline-block;
    width: 100%;
    margin: 0 0 18px;
    break-inside: avoid;
    overflow: hidden;
    border: 1px solid rgba(19, 43, 73, .10);
    border-radius: 20px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 14px 36px rgba(19, 43, 73, .09);
    vertical-align: top;
}

.gallery-wall.betcraft-selected-17 .betcraft-project-link {
    display: block;
    padding: 8px;
    border-radius: inherit;
    background:
        linear-gradient(145deg, rgba(255,255,255,.98), rgba(247,244,237,.94));
}

.gallery-wall.betcraft-selected-17 img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 14px;
    background: #fff;
    transition: transform .28s ease, box-shadow .28s ease;
}

@media (hover: hover) and (pointer: fine) {
    .gallery-wall.betcraft-selected-17 .betcraft-project-shot:hover img {
        transform: scale(1.012);
    }
}

@media (max-width: 1100px) {
    .gallery-wall.betcraft-selected-17 {
        columns: 3;
        column-gap: 15px;
    }
    .gallery-wall.betcraft-selected-17 .betcraft-project-shot {
        margin-bottom: 15px;
    }
}

@media (max-width: 760px) {
    .gallery-wall.betcraft-selected-17 {
        columns: 2 !important;
        column-gap: 9px;
    }
    .gallery-wall.betcraft-selected-17 .betcraft-project-shot {
        margin-bottom: 9px;
        border-radius: 14px;
        box-shadow: 0 8px 20px rgba(19, 43, 73, .07);
    }
    .gallery-wall.betcraft-selected-17 .betcraft-project-link {
        padding: 4px;
    }
    .gallery-wall.betcraft-selected-17 img {
        border-radius: 10px;
    }
}

@media (max-width: 360px) {
    .gallery-wall.betcraft-selected-17 {
        columns: 1 !important;
    }
}

/* END BETCRAFT SELECTED PORTFOLIO 17 V1 */


/* ==========================================================
   BETCRAFT MOBILE READABILITY V2
   Improve mobile font size, contrast and readability only.
   Desktop remains unchanged.
   ========================================================== */

@media (max-width: 760px) {

    /*
     * BASE MOBILE READABILITY
     */

    body {
        font-size:
            16px;

        line-height:
            1.65;

        color:
            #17283f;
    }


    /*
     * PRIMARY HEADINGS
     */

    body h1 {
        color:
            #112541 !important;

        font-weight:
            800 !important;

        text-wrap:
            balance;
    }


    body h2 {
        color:
            #112541 !important;

        font-weight:
            800 !important;

        text-wrap:
            balance;
    }


    body h3,
    body h4 {
        color:
            #17283f;

        font-weight:
            750;
    }


    /*
     * MAIN COPY
     *
     * Previous mobile CSS made several texts too small
     * and too close in tone to the cream background.
     */

    .studio-hero-lead,
    .studio-section-intro > p,
    .studio-works-head > p,
    .service-copy p,
    .studio-feature-item p,
    .studio-work-card p,
    .studio-solution-card p,
    .trust-point p,
    .trust-copy p,
    .page-hero p,
    .choice-card p,
    .market-card p,
    .card p,
    .visual-card p,
    .contact-cta-panel p {
        color:
            #536173 !important;

        font-size:
            15px !important;

        line-height:
            1.7 !important;
    }


    /*
     * HERO COPY
     */

    .studio-hero-lead {
        font-size:
            16px !important;

        line-height:
            1.72 !important;

        color:
            #526072 !important;
    }


    /*
     * SERVICE CARDS
     */

    .service-copy h3 {
        font-size:
            19px !important;

        line-height:
            1.25 !important;
    }


    .service-copy p {
        font-size:
            14px !important;

        line-height:
            1.62 !important;
    }


    /*
     * FEATURE / TRUST
     */

    .studio-feature-item {
        padding:
            16px 14px;
    }


    .studio-feature-item strong,
    .trust-point strong {
        color:
            #17283f !important;

        font-size:
            15px !important;

        line-height:
            1.3 !important;
    }


    .trust-point p {
        font-size:
            13px !important;
    }


    /*
     * PORTFOLIO / PROJECT CARDS
     */

    .studio-work-card :where(h3, h4, strong),
    .gallery-item :where(h3, h4, strong),
    .visual-card :where(h3, h4, strong) {
        color:
            #17283f !important;

        font-size:
            15px !important;

        line-height:
            1.3 !important;
    }


    /*
     * CONTACT
     *
     * Fix V1 values that were too small.
     */

    .contact-channel-grid :where(h2, h3, h4) {
        color:
            #17283f !important;

        font-size:
            16px !important;

        line-height:
            1.25 !important;

        font-weight:
            750 !important;
    }


    .contact-channel-grid p {
        color:
            #566476 !important;

        font-size:
            13px !important;

        line-height:
            1.55 !important;
    }


    .contact-channel-grid :where(a, button) {
        font-size:
            12px !important;

        line-height:
            1.25 !important;

        font-weight:
            700;
    }


    /*
     * SOCIAL CONTACT ROW
     */

    .studio-social-row span {
        color:
            #33445a !important;

        font-size:
            11px !important;

        line-height:
            1.2 !important;

        font-weight:
            700;
    }


    /*
     * SMALL LABELS / EYEBROWS
     */

    .eyebrow,
    .studio-eyebrow,
    .section-kicker,
    .overline {
        color:
            #9a6b18 !important;

        font-size:
            11px !important;

        line-height:
            1.3 !important;

        letter-spacing:
            .14em;
    }


    /*
     * BUTTONS
     */

    .btn,
    .studio-btn,
    .studio-outline-link {
        font-size:
            14px !important;

        line-height:
            1.2 !important;

        font-weight:
            750 !important;
    }


    /*
     * PREVENT LIGHT GRAY TEXT FROM DISAPPEARING
     * ON LIGHT / CREAM CARDS
     */

    .studio-service-card,
    .studio-feature-item,
    .studio-work-card,
    .trust-point,
    .choice-card,
    .market-card,
    .visual-card,
    .contact-channel-grid > * {
        color:
            #17283f;
    }

}


@media (max-width: 430px) {

    body {
        font-size:
            15.5px;
    }


    .studio-hero-lead {
        font-size:
            15px !important;
    }


    .studio-section-intro > p,
    .studio-works-head > p,
    .service-copy p,
    .studio-feature-item p,
    .studio-work-card p,
    .studio-solution-card p,
    .trust-copy p,
    .page-hero p,
    .choice-card p,
    .market-card p,
    .card p,
    .visual-card p {
        font-size:
            14px !important;
    }


    .contact-channel-grid p {
        font-size:
            12.5px !important;
    }


    .contact-channel-grid :where(a, button) {
        font-size:
            12px !important;
    }


    .studio-social-row span {
        font-size:
            10.5px !important;
    }

}

/* END BETCRAFT MOBILE READABILITY V2 */


/* ==========================================================
   BETCRAFT HOME PRICING V1
   ========================================================== */

.bc-pricing {
    position:
        relative;

    overflow:
        hidden;

    padding:
        92px 0;

    background:
        linear-gradient(
            180deg,
            #fffdf8 0%,
            #f8f5ec 52%,
            #ffffff 100%
        );
}


.bc-pricing::before {
    content:
        "";

    position:
        absolute;

    width:
        520px;

    height:
        520px;

    top:
        -260px;

    right:
        -180px;

    border-radius:
        50%;

    background:
        radial-gradient(
            circle,
            rgba(207,166,78,.20),
            rgba(207,166,78,0) 70%
        );

    pointer-events:
        none;
}


.bc-pricing-head {
    position:
        relative;

    z-index:
        1;

    max-width:
        820px;

    margin:
        0 auto 38px;

    text-align:
        center;
}


.bc-pricing-kicker {
    margin-bottom:
        12px;

    color:
        #a77a26;

    font-size:
        12px;

    font-weight:
        800;

    letter-spacing:
        .18em;
}


.bc-pricing-head h2 {
    margin:
        0;

    color:
        #132945;

    font-size:
        clamp(
            38px,
            5vw,
            64px
        );

    line-height:
        1.08;

    letter-spacing:
        -.035em;
}


.bc-pricing-head h2 span {
    color:
        #b7832c;
}


.bc-pricing-lead {
    max-width:
        700px;

    margin:
        20px auto 0;

    color:
        #5b6878;

    font-size:
        17px;

    line-height:
        1.75;
}


.bc-pricing-start {
    display:
        inline-flex;

    align-items:
        baseline;

    gap:
        12px;

    margin-top:
        25px;

    padding:
        13px 22px;

    border:
        1px solid
        rgba(183,131,44,.20);

    border-radius:
        999px;

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

    box-shadow:
        0 12px 30px
        rgba(31,43,59,.07);
}


.bc-pricing-start span {
    color:
        #536173;

    font-size:
        14px;

    font-weight:
        700;
}


.bc-pricing-start strong {
    color:
        #b7832c;

    font-size:
        30px;

    line-height:
        1;
}


.bc-payment-notice {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        17px;

    max-width:
        840px;

    margin:
        0 auto 38px;

    padding:
        18px 24px;

    border:
        1px solid
        rgba(183,131,44,.24);

    border-radius:
        22px;

    background:
        linear-gradient(
            135deg,
            #142a47,
            #1e3858
        );

    box-shadow:
        0 22px 55px
        rgba(23,39,60,.17);

    color:
        #fff;
}


.bc-payment-icon {
    display:
        grid;

    flex:
        0 0 48px;

    width:
        48px;

    height:
        48px;

    place-items:
        center;

    border-radius:
        15px;

    background:
        linear-gradient(
            135deg,
            #e5c26f,
            #b7832c
        );

    color:
        #112541;

    font-size:
        25px;

    font-weight:
        900;
}


.bc-payment-notice strong {
    display:
        block;

    margin-bottom:
        3px;

    color:
        #f7d889;

    font-size:
        21px;

    line-height:
        1.25;
}


.bc-payment-notice span {
    color:
        rgba(255,255,255,.84);

    font-size:
        14px;

    line-height:
        1.55;
}


.bc-package-grid {
    position:
        relative;

    z-index:
        1;

    display:
        grid;

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

    gap:
        18px;

    align-items:
        stretch;
}


.bc-package-card {
    position:
        relative;

    display:
        flex;

    flex-direction:
        column;

    min-width:
        0;

    padding:
        28px 23px 23px;

    border:
        1px solid
        rgba(28,48,73,.10);

    border-radius:
        25px;

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

    box-shadow:
        0 18px 52px
        rgba(30,43,60,.08);
}


.bc-package-card:hover {
    transform:
        translateY(-5px);

    box-shadow:
        0 26px 70px
        rgba(30,43,60,.13);
}


.bc-package-label {
    display:
        inline-flex;

    margin-bottom:
        14px;

    color:
        #a77a26;

    font-size:
        10px;

    font-weight:
        850;

    letter-spacing:
        .14em;
}


.bc-package-card h3 {
    margin:
        0 0 11px;

    color:
        #172d49;

    font-size:
        25px;

    line-height:
        1.18;
}


.bc-package-top p {
    min-height:
        100px;

    margin:
        0;

    color:
        #647080;

    font-size:
        13.5px;

    line-height:
        1.65;
}


.bc-package-price {
    margin:
        22px 0 19px;

    padding:
        18px 0;

    border-top:
        1px solid
        rgba(28,48,73,.08);

    border-bottom:
        1px solid
        rgba(28,48,73,.08);
}


.bc-package-price small {
    display:
        block;

    margin-bottom:
        5px;

    color:
        #778291;

    font-size:
        11px;

    font-weight:
        700;
}


.bc-package-price strong {
    color:
        #142a47;

    font-size:
        34px;

    line-height:
        1;
}


.bc-package-contact-price strong {
    font-size:
        22px;

    line-height:
        1.2;
}


.bc-package-features {
    display:
        grid;

    gap:
        10px;

    margin:
        0 0 25px;

    padding:
        0;

    list-style:
        none;
}


.bc-package-features li {
    position:
        relative;

    padding-left:
        23px;

    color:
        #475668;

    font-size:
        13px;

    line-height:
        1.52;
}


.bc-package-features li::before {
    content:
        "✓";

    position:
        absolute;

    left:
        0;

    top:
        0;

    color:
        #b7832c;

    font-weight:
        900;
}


.bc-package-btn {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        47px;

    margin-top:
        auto;

    padding:
        11px 15px;

    border:
        1px solid
        rgba(20,42,71,.14);

    border-radius:
        14px;

    background:
        #f7f4ec;

    color:
        #152c49;

    font-size:
        13px;

    font-weight:
        800;

    text-align:
        center;

    text-decoration:
        none;
}


.bc-package-featured {
    border:
        2px solid
        #d2a748;

    background:
        linear-gradient(
            180deg,
            #fffdf7,
            #ffffff
        );

    box-shadow:
        0 28px 75px
        rgba(167,122,38,.18);

    transform:
        translateY(-10px);
}


.bc-best-value {
    position:
        absolute;

    top:
        -22px;

    left:
        50%;

    transform:
        translateX(-50%);

    min-width:
        148px;

    padding:
        10px 20px;

    border-radius:
        999px;

    background:
        linear-gradient(
            135deg,
            #e7c66f,
            #b7832c
        );

    box-shadow:
        0 12px 28px
        rgba(151,105,30,.25);

    color:
        #122945;

    font-size:
        20px;

    font-weight:
        950;

    line-height:
        1;

    text-align:
        center;

    white-space:
        nowrap;
}


.bc-package-featured
.bc-package-price strong {
    color:
        #b27e26;

    font-size:
        40px;
}


.bc-package-btn-featured {
    border-color:
        #17304f;

    background:
        linear-gradient(
            135deg,
            #132a47,
            #1f4268
        );

    color:
        #fff;
}


.bc-package-proof {
    display:
        grid;

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

    gap:
        12px;

    margin-top:
        35px;
}


.bc-proof-item {
    padding:
        20px 17px;

    border:
        1px solid
        rgba(31,49,71,.08);

    border-radius:
        19px;

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

    text-align:
        center;
}


.bc-proof-item strong {
    display:
        block;

    color:
        #b7832c;

    font-size:
        19px;

    line-height:
        1.1;
}


.bc-proof-item span {
    display:
        block;

    margin-top:
        7px;

    color:
        #182e49;

    font-size:
        14px;

    font-weight:
        800;
}


.bc-proof-item small {
    display:
        block;

    margin-top:
        7px;

    color:
        #677383;

    font-size:
        11.5px;

    line-height:
        1.55;
}


.bc-demo-panel {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        30px;

    margin-top:
        24px;

    padding:
        29px 31px;

    border-radius:
        24px;

    background:
        linear-gradient(
            135deg,
            #142a47,
            #203e60
        );

    box-shadow:
        0 24px 58px
        rgba(20,42,71,.16);
}


.bc-demo-copy {
    max-width:
        720px;
}


.bc-demo-copy > span {
    color:
        #e5c46f;

    font-size:
        11px;

    font-weight:
        850;

    letter-spacing:
        .14em;
}


.bc-demo-copy h3 {
    margin:
        8px 0;

    color:
        #fff;

    font-size:
        25px;

    line-height:
        1.25;
}


.bc-demo-copy p {
    margin:
        0;

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

    font-size:
        14px;

    line-height:
        1.65;
}


.bc-demo-btn {
    display:
        inline-flex;

    flex:
        0 0 auto;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        49px;

    padding:
        12px 21px;

    border-radius:
        14px;

    background:
        linear-gradient(
            135deg,
            #e7c66f,
            #b7832c
        );

    color:
        #132945;

    font-size:
        14px;

    font-weight:
        850;

    text-decoration:
        none;
}


/* TABLET */
@media (max-width: 1080px) {

    .bc-package-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    .bc-package-featured {
        transform:
            none;
    }


    .bc-package-proof {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }

}


/* MOBILE */
@media (max-width: 760px) {

    .bc-pricing {
        padding:
            52px 0;
    }


    .bc-pricing-head {
        margin-bottom:
            25px;

        text-align:
            left;
    }


    .bc-pricing-kicker {
        font-size:
            10.5px;
    }


    .bc-pricing-head h2 {
        font-size:
            clamp(
                32px,
                9vw,
                42px
            ) !important;

        line-height:
            1.08 !important;
    }


    .bc-pricing-lead {
        margin-top:
            15px;

        font-size:
            15px !important;

        line-height:
            1.68 !important;
    }


    .bc-pricing-start {
        margin-top:
            18px;

        padding:
            11px 17px;
    }


    .bc-pricing-start strong {
        font-size:
            26px;
    }


    .bc-payment-notice {
        align-items:
            flex-start;

        margin-bottom:
            31px;

        padding:
            17px;

        border-radius:
            18px;
    }


    .bc-payment-icon {
        flex-basis:
            42px;

        width:
            42px;

        height:
            42px;

        border-radius:
            12px;

        font-size:
            21px;
    }


    .bc-payment-notice strong {
        font-size:
            18px;
    }


    .bc-payment-notice span {
        font-size:
            13px;

        line-height:
            1.55;
    }


    /*
     * ONE CARD PER ROW ON MOBILE.
     * Readability is more important than squeezing cards.
     */

    .bc-package-grid {
        grid-template-columns:
            1fr;

        gap:
            18px;
    }


    .bc-package-card {
        padding:
            25px 20px 20px;

        border-radius:
            21px;
    }


    .bc-package-card h3 {
        font-size:
            23px !important;
    }


    .bc-package-top p {
        min-height:
            0;

        font-size:
            14px !important;

        line-height:
            1.65 !important;
    }


    .bc-package-price {
        margin:
            18px 0;
    }


    .bc-package-price strong {
        font-size:
            34px;
    }


    .bc-package-features {
        gap:
            9px;
    }


    .bc-package-features li {
        font-size:
            14px !important;

        line-height:
            1.55 !important;
    }


    .bc-package-btn {
        min-height:
            48px;

        font-size:
            14px !important;
    }


    .bc-package-featured {
        margin-top:
            16px;
    }


    .bc-best-value {
        top:
            -20px;

        min-width:
            150px;

        font-size:
            20px;
    }


    .bc-package-proof {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );

        gap:
            9px;

        margin-top:
            26px;
    }


    .bc-proof-item {
        padding:
            16px 10px;
    }


    .bc-proof-item strong {
        font-size:
            17px;
    }


    .bc-proof-item span {
        font-size:
            13px;
    }


    .bc-proof-item small {
        font-size:
            11px;
    }


    .bc-demo-panel {
        flex-direction:
            column;

        align-items:
            stretch;

        gap:
            19px;

        padding:
            23px 19px;
    }


    .bc-demo-copy h3 {
        font-size:
            22px !important;
    }


    .bc-demo-copy p {
        font-size:
            14px !important;

        line-height:
            1.65 !important;
    }


    .bc-demo-btn {
        width:
            100%;

        font-size:
            14px;
    }

}


@media (max-width: 430px) {

    .bc-package-proof {
        grid-template-columns:
            1fr;
    }


    .bc-proof-item {
        text-align:
            left;
    }

}

/* END BETCRAFT HOME PRICING V1 */


/* ==========================================================
   BETCRAFT MOBILE FLOATING CONTACT V1
   ========================================================== */

.bc-mobile-contact-dock {
    display:
        none;
}


/* MOBILE ONLY */
@media (max-width: 760px) {

    .bc-mobile-contact-dock {
        position:
            fixed;

        top:
            48%;

        right:
            0;

        z-index:
            99990;

        display:
            flex;

        align-items:
            center;

        transform:
            translateY(-50%);

        pointer-events:
            none;
    }


    .bc-mobile-contact-panel {
        position:
            absolute;

        top:
            50%;

        right:
            49px;

        display:
            grid;

        width:
            168px;

        gap:
            6px;

        padding:
            12px;

        border:
            1px solid
            rgba(21,44,73,.12);

        border-radius:
            18px 0 0 18px;

        background:
            rgba(255,253,248,.97);

        box-shadow:
            0 16px 45px
            rgba(18,37,61,.18);

        backdrop-filter:
            blur(12px);

        opacity:
            0;

        transform:
            translate(
                calc(100% + 65px),
                -50%
            );

        transition:
            transform .28s ease,
            opacity .22s ease;

        pointer-events:
            none;
    }


    .bc-mobile-contact-dock.is-open
    .bc-mobile-contact-panel {
        opacity:
            1;

        transform:
            translate(
                0,
                -50%
            );

        pointer-events:
            auto;
    }


    .bc-mobile-contact-title {
        padding:
            1px 4px 7px;

        color:
            #152c49;

        font-size:
            14px;

        font-weight:
            850;

        line-height:
            1.2;
    }


    .bc-mobile-contact-link {
        display:
            flex;

        align-items:
            center;

        gap:
            9px;

        min-height:
            45px;

        padding:
            7px 9px;

        border:
            1px solid
            rgba(22,45,73,.07);

        border-radius:
            13px;

        background:
            #ffffff;

        color:
            #263a52;

        font-size:
            13px;

        font-weight:
            750;

        line-height:
            1.2;

        text-decoration:
            none;

        box-shadow:
            0 5px 14px
            rgba(25,43,65,.05);
    }


    .bc-mobile-contact-link img {
        display:
            block;

        flex:
            0 0 29px;

        width:
            29px !important;

        height:
            29px !important;

        max-width:
            29px !important;

        object-fit:
            contain;
    }


    .bc-mobile-contact-toggle {
        position:
            relative;

        z-index:
            2;

        display:
            flex;

        flex-direction:
            column;

        align-items:
            center;

        justify-content:
            center;

        width:
            49px;

        min-height:
            108px;

        gap:
            6px;

        padding:
            10px 4px;

        border:
            1px solid
            rgba(220,178,79,.44);

        border-right:
            0;

        border-radius:
            18px 0 0 18px;

        background:
            linear-gradient(
                180deg,
                #18324f,
                #112741
            );

        box-shadow:
            -7px 10px 28px
            rgba(20,40,65,.20);

        color:
            #ffffff;

        cursor:
            pointer;

        pointer-events:
            auto;
    }


    .bc-mobile-contact-toggle-icon {
        display:
            grid;

        width:
            29px;

        height:
            29px;

        place-items:
            center;

        border-radius:
            50%;

        background:
            linear-gradient(
                135deg,
                #e6c66e,
                #b7832c
            );

        color:
            #132945;

        font-size:
            16px;

        font-weight:
            900;
    }


    .bc-mobile-contact-toggle-text {
        color:
            #ffffff;

        font-size:
            11px;

        font-weight:
            800;

        letter-spacing:
            .03em;

        writing-mode:
            vertical-rl;

        text-orientation:
            mixed;
    }


    .bc-mobile-contact-dock.is-open
    .bc-mobile-contact-toggle {
        background:
            linear-gradient(
                180deg,
                #b7832c,
                #97671d
            );
    }

}


@media (max-width: 430px) {

    .bc-mobile-contact-panel {
        right:
            45px;

        width:
            158px;

        padding:
            10px;
    }


    .bc-mobile-contact-toggle {
        width:
            45px;

        min-height:
            100px;
    }


    .bc-mobile-contact-link {
        min-height:
            43px;

        font-size:
            12.5px;
    }

}

/* END BETCRAFT MOBILE FLOATING CONTACT V1 */


/* ==========================================================
   BETCRAFT HOME MOBILE COMPOSITION V3

   Scope:
   - Homepage only
   - Mobile only
   - Desktop layout untouched
   ========================================================== */


@media (max-width: 760px) {

    /* ------------------------------------------------------
       GLOBAL MOBILE COMPOSITION
       ------------------------------------------------------ */

    .betcraft-home-v2 {
        overflow:
            hidden;
    }


    .betcraft-home-v2 .container {
        width:
            calc(100% - 32px);

        max-width:
            680px;

        margin-left:
            auto;

        margin-right:
            auto;
    }


    .betcraft-home-v2
    :where(
        .studio-services,
        .studio-feature-strip,
        .studio-works,
        .studio-solutions,
        .studio-trust,
        .studio-contact-cta
    ) {
        padding-top:
            56px;

        padding-bottom:
            56px;
    }


    .betcraft-home-v2
    :where(
        .studio-section-intro,
        .studio-works-head,
        .studio-solution-copy
    ) {
        max-width:
            100%;
    }


    .betcraft-home-v2
    :where(
        .studio-section-intro h2,
        .studio-works-head h2,
        .studio-solution-copy h2,
        .studio-trust h2,
        .studio-contact-cta h2
    ) {
        font-size:
            clamp(
                29px,
                7.5vw,
                38px
            );

        line-height:
            1.12;

        letter-spacing:
            -.025em;
    }


    .betcraft-home-v2
    :where(
        .studio-section-intro p,
        .studio-works-head p,
        .studio-solution-copy p,
        .studio-trust p,
        .studio-contact-cta p
    ) {
        font-size:
            15.5px;

        line-height:
            1.72;
    }


    .betcraft-home-v2
    .studio-eyebrow {
        font-size:
            11.5px;

        line-height:
            1.35;

        letter-spacing:
            .095em;
    }



    /* ------------------------------------------------------
       HERO
       Keep same desktop composition,
       reorganized vertically for mobile
       ------------------------------------------------------ */

    .betcraft-home-v2
    .studio-hero {
        min-height:
            0;

        padding-top:
            38px;

        padding-bottom:
            52px;
    }


    .betcraft-home-v2
    .studio-hero-grid {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            30px;

        align-items:
            start;
    }


    .betcraft-home-v2
    .studio-hero-copy {
        width:
            100%;

        max-width:
            none;

        text-align:
            left;
    }


    .betcraft-home-v2
    .studio-hero-copy h1 {
        max-width:
            12ch;

        margin-left:
            0;

        margin-right:
            0;

        font-size:
            clamp(
                39px,
                10.3vw,
                52px
            );

        line-height:
            1.01;

        letter-spacing:
            -.045em;
    }


    .betcraft-home-v2
    .studio-hero-copy h1
    :where(
        span,
        strong
    ) {
        display:
            block;
    }


    .betcraft-home-v2
    .studio-hero-lead {
        max-width:
            590px;

        margin-left:
            0;

        margin-right:
            0;

        font-size:
            16px;

        line-height:
            1.72;
    }


    .betcraft-home-v2
    .studio-actions {
        display:
            grid;

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

        gap:
            10px;

        width:
            100%;
    }


    .betcraft-home-v2
    .studio-actions
    .studio-btn {
        display:
            flex;

        align-items:
            center;

        justify-content:
            center;

        min-width:
            0;

        min-height:
            50px;

        padding:
            11px 14px;

        font-size:
            14px;

        line-height:
            1.3;

        text-align:
            center;
    }


    .betcraft-home-v2
    .studio-mini-trust {
        display:
            grid;

        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );

        gap:
            9px;

        width:
            100%;
    }


    .betcraft-home-v2
    .studio-mini-trust > div {
        min-width:
            0;

        padding:
            13px 9px;

        border-radius:
            16px;
    }


    .betcraft-home-v2
    .studio-mini-trust strong {
        font-size:
            13px;

        line-height:
            1.3;
    }


    .betcraft-home-v2
    .studio-mini-trust small {
        font-size:
            11.5px;

        line-height:
            1.42;
    }


    .betcraft-home-v2
    .studio-device-stage {
        width:
            100%;

        max-width:
            560px;

        min-height:
            340px;

        margin:
            2px auto 0;
    }



    /* ------------------------------------------------------
       PRICING
       Preserve premium desktop card language
       ------------------------------------------------------ */

    .betcraft-home-v2
    .bc-pricing {
        padding-top:
            54px;

        padding-bottom:
            58px;
    }


    .betcraft-home-v2
    .bc-pricing-head {
        max-width:
            620px;

        margin-left:
            auto;

        margin-right:
            auto;
    }


    .betcraft-home-v2
    .bc-pricing-kicker {
        font-size:
            11.5px;

        letter-spacing:
            .09em;
    }


    .betcraft-home-v2
    .bc-pricing-head h2 {
        font-size:
            clamp(
                30px,
                7.8vw,
                39px
            );

        line-height:
            1.1;
    }


    .betcraft-home-v2
    .bc-pricing-lead {
        font-size:
            15.5px;

        line-height:
            1.7;
    }


    .betcraft-home-v2
    .bc-package-grid {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            16px;
    }


    .betcraft-home-v2
    .bc-package-card {
        width:
            100%;

        min-width:
            0;

        padding:
            22px 20px;

        border-radius:
            22px;
    }


    .betcraft-home-v2
    .bc-package-featured {
        transform:
            none;
    }


    .betcraft-home-v2
    .bc-package-card h3 {
        font-size:
            21px;

        line-height:
            1.2;
    }


    .betcraft-home-v2
    .bc-package-top p {
        font-size:
            14.5px;

        line-height:
            1.62;
    }


    .betcraft-home-v2
    .bc-package-price strong {
        font-size:
            clamp(
                35px,
                9vw,
                43px
            );

        line-height:
            1;
    }


    .betcraft-home-v2
    .bc-package-features li {
        font-size:
            14.5px;

        line-height:
            1.5;
    }


    .betcraft-home-v2
    .bc-package-btn {
        min-height:
            49px;

        font-size:
            14px;
    }


    .betcraft-home-v2
    .bc-package-proof {
        display:
            grid;

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

        gap:
            10px;
    }


    .betcraft-home-v2
    .bc-proof-item {
        min-width:
            0;
    }


    .betcraft-home-v2
    .bc-demo-panel {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            18px;

        padding:
            22px 20px;
    }


    .betcraft-home-v2
    .bc-demo-copy h3 {
        font-size:
            22px;

        line-height:
            1.2;
    }


    .betcraft-home-v2
    .bc-demo-copy p {
        font-size:
            14.5px;

        line-height:
            1.65;
    }


    .betcraft-home-v2
    .bc-demo-btn {
        width:
            100%;

        min-height:
            49px;

        justify-content:
            center;

        font-size:
            14px;
    }



    /* ------------------------------------------------------
       SERVICES
       ------------------------------------------------------ */

    .betcraft-home-v2
    .studio-service-grid {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            14px;
    }


    .betcraft-home-v2
    .studio-service-card {
        min-width:
            0;

        padding:
            20px;

        border-radius:
            20px;
    }


    .betcraft-home-v2
    .studio-service-card
    :where(
        h3,
        h4,
        strong
    ) {
        font-size:
            18px;

        line-height:
            1.25;
    }


    .betcraft-home-v2
    .studio-service-card p {
        font-size:
            14.5px;

        line-height:
            1.65;
    }



    /* ------------------------------------------------------
       FEATURE STRIP
       Desktop-like compact grid
       ------------------------------------------------------ */

    .betcraft-home-v2
    .studio-feature-grid {
        display:
            grid;

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

        gap:
            11px;
    }


    .betcraft-home-v2
    .studio-feature-item {
        min-width:
            0;

        padding:
            17px 14px;

        border-radius:
            18px;
    }


    .betcraft-home-v2
    .studio-feature-item
    :where(
        h3,
        h4,
        strong
    ) {
        font-size:
            15px;

        line-height:
            1.3;
    }


    .betcraft-home-v2
    .studio-feature-item p {
        font-size:
            13.5px;

        line-height:
            1.55;
    }



    /* ------------------------------------------------------
       WORKS / REAL PROJECT VISUALS
       No horizontal carousel:
       2-column desktop-like miniature grid
       ------------------------------------------------------ */

    .betcraft-home-v2
    .studio-works-head {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            12px;
    }


    .betcraft-home-v2
    .studio-work-grid {
        display:
            grid;

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

        gap:
            12px;

        width:
            100%;

        overflow:
            visible;

        padding:
            0;

        scroll-snap-type:
            none;
    }


    .betcraft-home-v2
    .studio-work-card {
        width:
            auto;

        min-width:
            0;

        margin:
            0;

        border-radius:
            18px;

        scroll-snap-align:
            none;
    }


    .betcraft-home-v2
    .studio-work-card img {
        display:
            block;

        width:
            100%;

        height:
            auto;

        aspect-ratio:
            4 / 3;

        object-fit:
            cover;
    }


    .betcraft-home-v2
    .studio-work-card
    :where(
        h3,
        h4,
        strong
    ) {
        font-size:
            15px;

        line-height:
            1.3;
    }


    .betcraft-home-v2
    .studio-work-card p {
        font-size:
            13.5px;

        line-height:
            1.55;
    }



    /* ------------------------------------------------------
       SOLUTIONS / SYSTEM
       ------------------------------------------------------ */

    .betcraft-home-v2
    .studio-solution-layout {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            24px;
    }


    .betcraft-home-v2
    .studio-solution-grid {
        display:
            grid;

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

        gap:
            11px;
    }


    .betcraft-home-v2
    .studio-solution-grid > * {
        min-width:
            0;
    }


    .betcraft-home-v2
    .studio-architecture-card {
        width:
            100%;

        min-width:
            0;

        padding:
            20px;

        border-radius:
            20px;
    }



    /* ------------------------------------------------------
       TRUST
       ------------------------------------------------------ */

    .betcraft-home-v2
    .studio-trust-grid {
        display:
            grid;

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

        gap:
            11px;
    }


    .betcraft-home-v2
    .studio-trust-grid > * {
        min-width:
            0;
    }



    /* ------------------------------------------------------
       CONTACT CTA
       ------------------------------------------------------ */

    .betcraft-home-v2
    .studio-contact-cta {
        text-align:
            left;
    }


    .betcraft-home-v2
    .studio-contact-cta
    .studio-btn {
        min-height:
            50px;

        padding:
            12px 16px;

        font-size:
            14px;
    }


    .betcraft-home-v2
    .studio-social-row {
        display:
            flex;

        flex-wrap:
            wrap;

        gap:
            9px;
    }


    .betcraft-home-v2
    .studio-social-row > * {
        min-width:
            0;
    }

}



/* ==========================================================
   SMALL PHONE REFINEMENT
   ========================================================== */

@media (max-width: 430px) {

    .betcraft-home-v2
    .container {
        width:
            calc(100% - 28px);
    }


    .betcraft-home-v2
    :where(
        .studio-services,
        .studio-feature-strip,
        .studio-works,
        .studio-solutions,
        .studio-trust,
        .studio-contact-cta
    ) {
        padding-top:
            46px;

        padding-bottom:
            46px;
    }



    /* HERO */

    .betcraft-home-v2
    .studio-hero {
        padding-top:
            30px;

        padding-bottom:
            44px;
    }


    .betcraft-home-v2
    .studio-hero-grid {
        gap:
            24px;
    }


    .betcraft-home-v2
    .studio-hero-copy h1 {
        font-size:
            clamp(
                36px,
                10.6vw,
                44px
            );

        max-width:
            11.5ch;
    }


    .betcraft-home-v2
    .studio-hero-lead {
        font-size:
            15.5px;
    }


    .betcraft-home-v2
    .studio-actions {
        grid-template-columns:
            minmax(0, 1fr);
    }


    .betcraft-home-v2
    .studio-actions
    .studio-btn {
        width:
            100%;

        min-height:
            49px;
    }


    .betcraft-home-v2
    .studio-mini-trust {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .betcraft-home-v2
    .studio-mini-trust > div:last-child {
        grid-column:
            1 / -1;
    }


    .betcraft-home-v2
    .studio-device-stage {
        min-height:
            310px;
    }



    /* PRICING */

    .betcraft-home-v2
    .bc-pricing {
        padding-top:
            46px;

        padding-bottom:
            50px;
    }


    .betcraft-home-v2
    .bc-package-card {
        padding:
            20px 18px;
    }


    .betcraft-home-v2
    .bc-package-proof {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }



    /* REAL WORK:
       keep 2 columns like desktop,
       but readable
       */

    .betcraft-home-v2
    .studio-work-grid {
        gap:
            9px;
    }


    .betcraft-home-v2
    .studio-work-card {
        border-radius:
            15px;
    }


    .betcraft-home-v2
    .studio-work-card
    :where(
        h3,
        h4,
        strong
    ) {
        font-size:
            14px;
    }


    .betcraft-home-v2
    .studio-work-card p {
        font-size:
            13px;

        line-height:
            1.5;
    }



    /* FEATURES */

    .betcraft-home-v2
    .studio-feature-grid {
        gap:
            9px;
    }


    .betcraft-home-v2
    .studio-feature-item {
        padding:
            15px 12px;
    }



    /* SOLUTIONS */

    .betcraft-home-v2
    .studio-solution-grid {
        grid-template-columns:
            minmax(0, 1fr);
    }

}



/* ==========================================================
   MEDIUM MOBILE / SMALL TABLET
   ========================================================== */

@media (min-width: 580px) and (max-width: 760px) {

    .betcraft-home-v2
    .bc-package-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .betcraft-home-v2
    .studio-service-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .betcraft-home-v2
    .studio-solution-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


/* END BETCRAFT HOME MOBILE COMPOSITION V3 */


/* BETCRAFT WEBSITES MOBILE COMPOSITION V1 START */


/* ==========================================================
   /websites/
   MOBILE COMPOSITION

   Goal:
   - same visual language as desktop
   - mobile-specific composition
   - no desktop style override
   - scoped to this page only
   ========================================================== */


@media (max-width: 760px) {

    /* ------------------------------------------------------
       PAGE FRAME
       ------------------------------------------------------ */

    .betcraft-websites-page {
        overflow-x:
            hidden;
    }


    .betcraft-websites-page main {
        overflow:
            hidden;
    }


    .betcraft-websites-page
    .container {
        width:
            calc(100% - 32px);

        max-width:
            680px;

        margin-left:
            auto;

        margin-right:
            auto;
    }


    .betcraft-websites-page
    main > section:not(.page-hero) {
        padding-top:
            54px;

        padding-bottom:
            54px;
    }



    /* ------------------------------------------------------
       HERO
       Same desktop mood, mobile proportions
       ------------------------------------------------------ */

    .betcraft-websites-page
    .page-hero {
        min-height:
            0;

        padding-top:
            52px;

        padding-bottom:
            50px;

        background-position:
            center center;

        background-size:
            cover;
    }


    .betcraft-websites-page
    .page-hero
    .container {
        max-width:
            620px;
    }


    .betcraft-websites-page
    .page-hero
    .eyebrow {
        margin-bottom:
            12px;

        font-size:
            11.5px;

        line-height:
            1.35;

        letter-spacing:
            .09em;
    }


    .betcraft-websites-page
    .page-hero h1 {
        max-width:
            12ch;

        margin-left:
            0;

        margin-right:
            0;

        font-size:
            clamp(
                38px,
                9.6vw,
                50px
            );

        line-height:
            1.04;

        letter-spacing:
            -.04em;
    }


    .betcraft-websites-page
    .page-hero p {
        max-width:
            590px;

        font-size:
            15.5px;

        line-height:
            1.72;
    }



    /* ------------------------------------------------------
       SECTION HEADINGS
       ------------------------------------------------------ */

    .betcraft-websites-page
    .section-head {
        max-width:
            620px;

        margin-bottom:
            24px;
    }


    .betcraft-websites-page
    .section-head
    .eyebrow {
        font-size:
            11.5px;

        line-height:
            1.35;

        letter-spacing:
            .085em;
    }


    .betcraft-websites-page
    .section-head h2 {
        max-width:
            15ch;

        font-size:
            clamp(
                28px,
                7.3vw,
                37px
            );

        line-height:
            1.12;

        letter-spacing:
            -.028em;
    }


    .betcraft-websites-page
    .section-head p {
        max-width:
            590px;

        font-size:
            15px;

        line-height:
            1.7;
    }



    /* ------------------------------------------------------
       WEBSITE TYPE CARDS
       Keep them substantial like desktop,
       not oversized on phone
       ------------------------------------------------------ */

    .betcraft-websites-page
    .grid {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            14px;

        width:
            100%;
    }


    .betcraft-websites-page
    .card {
        width:
            100%;

        min-width:
            0;

        margin:
            0;

        padding:
            20px;

        border-radius:
            20px;
    }


    .betcraft-websites-page
    .card
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            18px;

        line-height:
            1.26;
    }


    .betcraft-websites-page
    .card p {
        font-size:
            14.5px;

        line-height:
            1.65;
    }


    .betcraft-websites-page
    .card
    :where(
        a,
        button
    ) {
        min-height:
            46px;

        font-size:
            14px;
    }



    /* ------------------------------------------------------
       MARKET / WEBSITE CATEGORY GRID

       This is the section that should feel closest
       to a miniature desktop portfolio.
       ------------------------------------------------------ */

    .betcraft-websites-page
    .market-grid {
        display:
            grid;

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

        gap:
            11px;

        width:
            100%;
    }


    .betcraft-websites-page
    .market-card {
        display:
            flex;

        flex-direction:
            column;

        width:
            100%;

        min-width:
            0;

        margin:
            0;

        overflow:
            hidden;

        border-radius:
            18px;
    }


    .betcraft-websites-page
    .market-screen {
        width:
            100%;

        min-width:
            0;

        min-height:
            0;

        aspect-ratio:
            4 / 3;

        overflow:
            hidden;
    }


    .betcraft-websites-page
    .market-screen
    :where(
        img,
        picture,
        video,
        canvas
    ) {
        display:
            block;

        width:
            100%;

        height:
            100%;

        object-fit:
            cover;
    }


    .betcraft-websites-page
    .market-copy {
        display:
            flex;

        flex:
            1;

        flex-direction:
            column;

        min-width:
            0;

        padding:
            14px 13px 15px;
    }


    .betcraft-websites-page
    .market-copy
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            15.5px;

        line-height:
            1.3;
    }


    .betcraft-websites-page
    .market-copy p {
        font-size:
            13.5px;

        line-height:
            1.55;
    }


    .betcraft-websites-page
    .market-copy
    :where(
        a,
        button
    ) {
        margin-top:
            auto;

        font-size:
            13.5px;
    }



    /* ------------------------------------------------------
       AMBIENT CTA BAND
       Desktop block retained,
       compressed for mobile
       ------------------------------------------------------ */

    .betcraft-websites-page
    .ambient-band {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            18px;

        width:
            100%;

        min-height:
            0;

        padding:
            24px 21px;

        border-radius:
            24px;
    }


    .betcraft-websites-page
    .ambient-band-copy {
        width:
            100%;

        max-width:
            620px;
    }


    .betcraft-websites-page
    .ambient-band
    .eyebrow {
        font-size:
            11.5px;

        letter-spacing:
            .085em;
    }


    .betcraft-websites-page
    .ambient-band h2 {
        max-width:
            17ch;

        font-size:
            clamp(
                27px,
                7vw,
                36px
            );

        line-height:
            1.14;

        letter-spacing:
            -.025em;
    }


    .betcraft-websites-page
    .ambient-band p {
        max-width:
            570px;

        font-size:
            15px;

        line-height:
            1.68;
    }


    .betcraft-websites-page
    .ambient-band
    :where(
        a,
        button
    ) {
        min-height:
            48px;

        font-size:
            14px;
    }

}



/* ==========================================================
   SMALL PHONE
   ========================================================== */

@media (max-width: 430px) {

    .betcraft-websites-page
    .container {
        width:
            calc(100% - 28px);
    }


    .betcraft-websites-page
    main > section:not(.page-hero) {
        padding-top:
            46px;

        padding-bottom:
            46px;
    }


    .betcraft-websites-page
    .page-hero {
        padding-top:
            42px;

        padding-bottom:
            42px;
    }


    .betcraft-websites-page
    .page-hero h1 {
        max-width:
            11ch;

        font-size:
            clamp(
                35px,
                10.2vw,
                43px
            );
    }


    .betcraft-websites-page
    .page-hero p {
        font-size:
            15px;
    }


    .betcraft-websites-page
    .section-head {
        margin-bottom:
            20px;
    }


    .betcraft-websites-page
    .card {
        padding:
            18px;

        border-radius:
            18px;
    }


    /* Keep market section as a 2-column
       miniature desktop-style showcase */

    .betcraft-websites-page
    .market-grid {
        gap:
            9px;
    }


    .betcraft-websites-page
    .market-card {
        border-radius:
            15px;
    }


    .betcraft-websites-page
    .market-copy {
        padding:
            12px 11px 13px;
    }


    .betcraft-websites-page
    .market-copy
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            14px;
    }


    .betcraft-websites-page
    .market-copy p {
        font-size:
            12.75px;

        line-height:
            1.5;
    }


    .betcraft-websites-page
    .ambient-band {
        padding:
            21px 18px;

        border-radius:
            21px;
    }

}



/* ==========================================================
   LARGE MOBILE / SMALL TABLET
   ========================================================== */

@media (min-width: 580px) and (max-width: 760px) {

    .betcraft-websites-page
    .grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .betcraft-websites-page
    .market-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            14px;
    }

}


/* BETCRAFT WEBSITES MOBILE COMPOSITION V1 END */


/* BETCRAFT SYSTEMS MOBILE COMPOSITION V1 START */


/* ==========================================================
   BETCRAFT /systems/
   Mobile version of desktop composition.

   Scope:
   - /systems/ only
   - <= 760px only
   ========================================================== */


@media (max-width: 760px) {

    /* ======================================================
       PAGE FRAME
       ====================================================== */

    .betcraft-systems-page {
        overflow-x:
            hidden;
    }


    .betcraft-systems-page main {
        overflow:
            hidden;
    }


    .betcraft-systems-page
    .container {
        width:
            calc(100% - 32px);

        max-width:
            680px;

        margin-left:
            auto;

        margin-right:
            auto;
    }


    .betcraft-systems-page
    main > section:not(.page-hero) {
        padding-top:
            54px;

        padding-bottom:
            54px;
    }



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

    .betcraft-systems-page
    .page-hero {
        min-height:
            0;

        padding-top:
            50px;

        padding-bottom:
            50px;

        background-position:
            center center;

        background-size:
            cover;
    }


    .betcraft-systems-page
    .page-hero
    .container {
        max-width:
            640px;
    }


    .betcraft-systems-page
    .page-hero
    .eyebrow {
        margin-bottom:
            12px;

        font-size:
            11.5px;

        line-height:
            1.35;

        letter-spacing:
            .09em;
    }


    .betcraft-systems-page
    .page-hero h1 {
        max-width:
            13ch;

        margin-left:
            0;

        margin-right:
            0;

        font-size:
            clamp(
                37px,
                9.5vw,
                49px
            );

        line-height:
            1.04;

        letter-spacing:
            -.04em;
    }


    .betcraft-systems-page
    .page-hero p {
        max-width:
            610px;

        font-size:
            15.5px;

        line-height:
            1.72;
    }



    /* ======================================================
       SECTION HEAD
       ====================================================== */

    .betcraft-systems-page
    .section-head {
        width:
            100%;

        max-width:
            640px;

        margin-bottom:
            24px;
    }


    .betcraft-systems-page
    .section-head
    .eyebrow {
        font-size:
            11.5px;

        line-height:
            1.35;

        letter-spacing:
            .085em;
    }


    .betcraft-systems-page
    .section-head h2 {
        max-width:
            17ch;

        font-size:
            clamp(
                28px,
                7.3vw,
                37px
            );

        line-height:
            1.12;

        letter-spacing:
            -.028em;
    }


    .betcraft-systems-page
    .section-head p {
        max-width:
            610px;

        font-size:
            15px;

        line-height:
            1.7;
    }



    /* ======================================================
       SYSTEM CARDS
       ====================================================== */

    .betcraft-systems-page
    .grid {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            14px;

        width:
            100%;
    }


    .betcraft-systems-page
    .card {
        width:
            100%;

        min-width:
            0;

        margin:
            0;

        padding:
            20px;

        border-radius:
            20px;
    }


    .betcraft-systems-page
    .card
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            18px;

        line-height:
            1.27;
    }


    .betcraft-systems-page
    .card p {
        font-size:
            14.5px;

        line-height:
            1.65;
    }


    .betcraft-systems-page
    .card
    :where(
        ul,
        ol
    ) {
        padding-left:
            20px;
    }


    .betcraft-systems-page
    .card li {
        font-size:
            14px;

        line-height:
            1.6;
    }


    .betcraft-systems-page
    .card
    :where(
        a,
        button
    ) {
        min-height:
            46px;

        font-size:
            14px;
    }



    /* ======================================================
       REAL SYSTEM VISUALS

       Keep desktop-style gallery feeling.
       Do NOT turn into one huge screenshot per row.
       ====================================================== */

    .betcraft-systems-page
    .visual-grid {
        display:
            grid;

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

        gap:
            11px;

        width:
            100%;

        margin:
            0;
    }


    .betcraft-systems-page
    .visual-card {
        display:
            flex;

        flex-direction:
            column;

        width:
            100%;

        min-width:
            0;

        margin:
            0;

        overflow:
            hidden;

        border-radius:
            18px;
    }


    .betcraft-systems-page
    .visual-card img {
        display:
            block;

        width:
            100%;

        max-width:
            100%;

        height:
            auto;

        margin:
            0;

        object-fit:
            contain;
    }


    .betcraft-systems-page
    .visual-caption {
        flex:
            1;

        padding:
            12px 12px 13px;

        font-size:
            13px;

        line-height:
            1.5;
    }


    .betcraft-systems-page
    .visual-caption
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            14px;

        line-height:
            1.3;
    }


    .betcraft-systems-page
    .visual-caption p {
        font-size:
            12.75px;

        line-height:
            1.5;
    }



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

    .betcraft-systems-page
    .ambient-band {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            18px;

        width:
            100%;

        min-height:
            0;

        padding:
            24px 21px;

        border-radius:
            24px;
    }


    .betcraft-systems-page
    .ambient-band-copy {
        width:
            100%;

        max-width:
            620px;
    }


    .betcraft-systems-page
    .ambient-band
    .eyebrow {
        font-size:
            11.5px;

        line-height:
            1.35;

        letter-spacing:
            .085em;
    }


    .betcraft-systems-page
    .ambient-band h2 {
        max-width:
            18ch;

        font-size:
            clamp(
                27px,
                7vw,
                36px
            );

        line-height:
            1.14;

        letter-spacing:
            -.025em;
    }


    .betcraft-systems-page
    .ambient-band p {
        max-width:
            590px;

        font-size:
            15px;

        line-height:
            1.68;
    }


    .betcraft-systems-page
    .ambient-band
    :where(
        a,
        button
    ) {
        min-height:
            48px;

        font-size:
            14px;
    }

}



/* ==========================================================
   SMALL PHONE
   ========================================================== */

@media (max-width: 430px) {

    .betcraft-systems-page
    .container {
        width:
            calc(100% - 28px);
    }


    .betcraft-systems-page
    main > section:not(.page-hero) {
        padding-top:
            46px;

        padding-bottom:
            46px;
    }


    .betcraft-systems-page
    .page-hero {
        padding-top:
            41px;

        padding-bottom:
            42px;
    }


    .betcraft-systems-page
    .page-hero h1 {
        max-width:
            12ch;

        font-size:
            clamp(
                34px,
                10vw,
                42px
            );
    }


    .betcraft-systems-page
    .page-hero p {
        font-size:
            15px;
    }


    .betcraft-systems-page
    .section-head {
        margin-bottom:
            20px;
    }


    .betcraft-systems-page
    .card {
        padding:
            18px;

        border-radius:
            18px;
    }


    /* Keep the system screenshots in a 2-column
       miniature desktop layout */

    .betcraft-systems-page
    .visual-grid {
        gap:
            9px;
    }


    .betcraft-systems-page
    .visual-card {
        border-radius:
            15px;
    }


    .betcraft-systems-page
    .visual-caption {
        padding:
            10px 10px 11px;

        font-size:
            12.5px;
    }


    .betcraft-systems-page
    .visual-caption
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            13.5px;
    }


    .betcraft-systems-page
    .ambient-band {
        padding:
            21px 18px;

        border-radius:
            21px;
    }

}



/* ==========================================================
   LARGE MOBILE / SMALL TABLET
   ========================================================== */

@media (min-width: 580px) and (max-width: 760px) {

    .betcraft-systems-page
    .grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .betcraft-systems-page
    .visual-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            14px;
    }

}


/* BETCRAFT SYSTEMS MOBILE COMPOSITION V1 END */


/* BETCRAFT CUSTOM DEVELOPMENT MOBILE COMPOSITION V1 START */


/* ==========================================================
   BETCRAFT /custom-development/
   Mobile composition preserving desktop visual language.
   ========================================================== */


@media (max-width: 760px) {

    /* ======================================================
       PAGE FRAME
       ====================================================== */

    .betcraft-custom-development-page {
        overflow-x:
            hidden;
    }


    .betcraft-custom-development-page
    main {
        overflow:
            hidden;
    }


    .betcraft-custom-development-page
    .container {
        width:
            calc(100% - 32px);

        max-width:
            680px;

        margin-left:
            auto;

        margin-right:
            auto;
    }


    .betcraft-custom-development-page
    main > section:not(.page-hero) {
        padding-top:
            54px;

        padding-bottom:
            54px;
    }



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

    .betcraft-custom-development-page
    .page-hero {
        min-height:
            0;

        padding-top:
            50px;

        padding-bottom:
            50px;

        background-position:
            center center;

        background-size:
            cover;
    }


    .betcraft-custom-development-page
    .page-hero
    .container {
        max-width:
            640px;
    }


    .betcraft-custom-development-page
    .page-hero
    .eyebrow {
        margin-bottom:
            12px;

        font-size:
            11.5px;

        line-height:
            1.35;

        letter-spacing:
            .09em;
    }


    .betcraft-custom-development-page
    .page-hero h1 {
        max-width:
            13ch;

        margin-left:
            0;

        margin-right:
            0;

        font-size:
            clamp(
                37px,
                9.4vw,
                49px
            );

        line-height:
            1.04;

        letter-spacing:
            -.04em;
    }


    .betcraft-custom-development-page
    .page-hero p {
        max-width:
            610px;

        font-size:
            15.5px;

        line-height:
            1.72;
    }



    /* ======================================================
       SECTION HEAD
       ====================================================== */

    .betcraft-custom-development-page
    .section-head {
        width:
            100%;

        max-width:
            640px;

        margin-bottom:
            24px;
    }


    .betcraft-custom-development-page
    .section-head
    .eyebrow {
        font-size:
            11.5px;

        line-height:
            1.35;

        letter-spacing:
            .085em;
    }


    .betcraft-custom-development-page
    .section-head h2 {
        max-width:
            17ch;

        font-size:
            clamp(
                28px,
                7.3vw,
                37px
            );

        line-height:
            1.12;

        letter-spacing:
            -.028em;
    }


    .betcraft-custom-development-page
    .section-head p {
        max-width:
            610px;

        font-size:
            15px;

        line-height:
            1.7;
    }



    /* ======================================================
       CUSTOM MODULE CARDS
       ====================================================== */

    .betcraft-custom-development-page
    .grid {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            14px;

        width:
            100%;
    }


    .betcraft-custom-development-page
    .card {
        width:
            100%;

        min-width:
            0;

        margin:
            0;

        padding:
            20px;

        border-radius:
            20px;
    }


    .betcraft-custom-development-page
    .card
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            18px;

        line-height:
            1.27;
    }


    .betcraft-custom-development-page
    .card p {
        font-size:
            14.5px;

        line-height:
            1.65;
    }


    .betcraft-custom-development-page
    .card
    :where(
        ul,
        ol
    ) {
        padding-left:
            20px;
    }


    .betcraft-custom-development-page
    .card li {
        font-size:
            14px;

        line-height:
            1.6;
    }


    .betcraft-custom-development-page
    .card
    :where(
        a,
        button
    ) {
        min-height:
            46px;

        font-size:
            14px;
    }



    /* ======================================================
       CUSTOM DEVELOPMENT VISUALS

       First visual = featured project shot.
       Remaining visuals = compact 2-column layout.
       Screenshots are never cropped.
       ====================================================== */

    .betcraft-custom-development-page
    .visual-grid {
        display:
            grid;

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

        gap:
            11px;

        width:
            100%;

        margin:
            0;
    }


    .betcraft-custom-development-page
    .visual-card {
        display:
            flex;

        flex-direction:
            column;

        width:
            100%;

        min-width:
            0;

        margin:
            0;

        overflow:
            hidden;

        border-radius:
            18px;
    }


    .betcraft-custom-development-page
    .visual-card:first-child {
        grid-column:
            1 / -1;
    }


    .betcraft-custom-development-page
    .visual-card img {
        display:
            block;

        width:
            100%;

        max-width:
            100%;

        height:
            auto;

        margin:
            0;

        object-fit:
            contain;
    }


    .betcraft-custom-development-page
    .visual-card:first-child img {
        max-height:
            420px;
    }


    .betcraft-custom-development-page
    .visual-caption {
        flex:
            1;

        padding:
            12px 12px 13px;

        font-size:
            13px;

        line-height:
            1.5;
    }


    .betcraft-custom-development-page
    .visual-card:first-child
    .visual-caption {
        padding:
            14px 15px 15px;
    }


    .betcraft-custom-development-page
    .visual-caption
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            14px;

        line-height:
            1.3;
    }


    .betcraft-custom-development-page
    .visual-card:first-child
    .visual-caption
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            16px;
    }


    .betcraft-custom-development-page
    .visual-caption p {
        font-size:
            12.75px;

        line-height:
            1.5;
    }



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

    .betcraft-custom-development-page
    .ambient-band {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            18px;

        width:
            100%;

        min-height:
            0;

        padding:
            24px 21px;

        border-radius:
            24px;
    }


    .betcraft-custom-development-page
    .ambient-band-copy {
        width:
            100%;

        max-width:
            620px;
    }


    .betcraft-custom-development-page
    .ambient-band
    .eyebrow {
        font-size:
            11.5px;

        line-height:
            1.35;

        letter-spacing:
            .085em;
    }


    .betcraft-custom-development-page
    .ambient-band h2 {
        max-width:
            18ch;

        font-size:
            clamp(
                27px,
                7vw,
                36px
            );

        line-height:
            1.14;

        letter-spacing:
            -.025em;
    }


    .betcraft-custom-development-page
    .ambient-band p {
        max-width:
            590px;

        font-size:
            15px;

        line-height:
            1.68;
    }


    .betcraft-custom-development-page
    .ambient-band
    :where(
        a,
        button
    ) {
        min-height:
            48px;

        font-size:
            14px;
    }

}



/* ==========================================================
   SMALL PHONE
   ========================================================== */

@media (max-width: 430px) {

    .betcraft-custom-development-page
    .container {
        width:
            calc(100% - 28px);
    }


    .betcraft-custom-development-page
    main > section:not(.page-hero) {
        padding-top:
            46px;

        padding-bottom:
            46px;
    }


    .betcraft-custom-development-page
    .page-hero {
        padding-top:
            41px;

        padding-bottom:
            42px;
    }


    .betcraft-custom-development-page
    .page-hero h1 {
        max-width:
            12ch;

        font-size:
            clamp(
                34px,
                10vw,
                42px
            );
    }


    .betcraft-custom-development-page
    .page-hero p {
        font-size:
            15px;
    }


    .betcraft-custom-development-page
    .section-head {
        margin-bottom:
            20px;
    }


    .betcraft-custom-development-page
    .card {
        padding:
            18px;

        border-radius:
            18px;
    }


    .betcraft-custom-development-page
    .visual-grid {
        gap:
            9px;
    }


    .betcraft-custom-development-page
    .visual-card {
        border-radius:
            15px;
    }


    .betcraft-custom-development-page
    .visual-card:first-child {
        border-radius:
            18px;
    }


    .betcraft-custom-development-page
    .visual-caption {
        padding:
            10px 10px 11px;

        font-size:
            12.5px;
    }


    .betcraft-custom-development-page
    .visual-card:first-child
    .visual-caption {
        padding:
            13px 13px 14px;
    }


    .betcraft-custom-development-page
    .visual-caption
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            13.5px;
    }


    .betcraft-custom-development-page
    .visual-card:first-child
    .visual-caption
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            15px;
    }


    .betcraft-custom-development-page
    .ambient-band {
        padding:
            21px 18px;

        border-radius:
            21px;
    }

}



/* ==========================================================
   LARGE MOBILE / SMALL TABLET
   ========================================================== */

@media (min-width: 580px) and (max-width: 760px) {

    .betcraft-custom-development-page
    .grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .betcraft-custom-development-page
    .visual-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            14px;
    }


    .betcraft-custom-development-page
    .visual-card:first-child {
        grid-column:
            1 / -1;
    }

}


/* BETCRAFT CUSTOM DEVELOPMENT MOBILE COMPOSITION V1 END */


/* BETCRAFT PORTFOLIO PROJECT SHOWCASE V2 START */


/* ==========================================================
   PORTFOLIO PROJECT SHOWCASE
   Desktop + Mobile
   Scoped to /portfolio/ only.
   ========================================================== */

.betcraft-portfolio-page
.portfolio-showcase {
    position:
        relative;

    padding:
        92px 0 104px;

    background:
        linear-gradient(
            180deg,
            #fffdf8 0%,
            #f8f4eb 48%,
            #ffffff 100%
        );
}


.betcraft-portfolio-page
.portfolio-showcase-head {
    max-width:
        820px;

    margin-bottom:
        48px;
}


.betcraft-portfolio-page
.portfolio-showcase-head
.eyebrow {
    margin-bottom:
        12px;
}


.betcraft-portfolio-page
.portfolio-showcase-head h2 {
    max-width:
        16ch;

    margin:
        0;

    color:
        #142b46;

    font-size:
        clamp(
            40px,
            4.4vw,
            64px
        );

    line-height:
        1.03;

    letter-spacing:
        -.04em;
}


.betcraft-portfolio-page
.portfolio-showcase-head h2 span {
    display:
        block;

    color:
        #aa7a28;
}


.betcraft-portfolio-page
.portfolio-showcase-head p {
    max-width:
        760px;

    margin-top:
        20px;

    color:
        #44566c;

    font-size:
        16px;

    line-height:
        1.78;
}


.betcraft-portfolio-page
.portfolio-project-list {
    display:
        grid;

    gap:
        28px;
}


.betcraft-portfolio-page
.portfolio-project {
    display:
        grid;

    grid-template-columns:
        minmax(260px, .72fr)
        minmax(0, 1.45fr);

    gap:
        34px;

    align-items:
        center;

    padding:
        34px;

    overflow:
        hidden;

    border:
        1px solid
        rgba(20, 43, 70, .10);

    border-radius:
        30px;

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

    box-shadow:
        0 24px 70px
        rgba(20,43,70,.09);
}


.betcraft-portfolio-page
.portfolio-project-reverse
.portfolio-project-copy {
    order:
        2;
}


.betcraft-portfolio-page
.portfolio-project-reverse
.portfolio-project-visuals {
    order:
        1;
}


.betcraft-portfolio-page
.portfolio-project-copy {
    min-width:
        0;
}


.betcraft-portfolio-page
.portfolio-project-index {
    margin-bottom:
        12px;

    color:
        #c59a43;

    font-size:
        13px;

    font-weight:
        900;

    letter-spacing:
        .14em;
}


.betcraft-portfolio-page
.portfolio-project-kicker {
    margin-bottom:
        10px;

    color:
        #997024;

    font-size:
        11px;

    font-weight:
        850;

    letter-spacing:
        .11em;
}


.betcraft-portfolio-page
.portfolio-project h3 {
    max-width:
        12ch;

    margin:
        0;

    color:
        #142b46;

    font-size:
        clamp(
            29px,
            3vw,
            43px
        );

    line-height:
        1.07;

    letter-spacing:
        -.035em;
}


.betcraft-portfolio-page
.portfolio-project-copy > p {
    margin:
        17px 0 0;

    color:
        #4c5d70;

    font-size:
        15px;

    line-height:
        1.73;
}


.betcraft-portfolio-page
.portfolio-project-tags {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        7px;

    margin:
        20px 0 0;

    padding:
        0;

    list-style:
        none;
}


.betcraft-portfolio-page
.portfolio-project-tags li {
    padding:
        7px 10px;

    border:
        1px solid
        rgba(173,126,42,.20);

    border-radius:
        999px;

    background:
        #faf5e9;

    color:
        #75531d;

    font-size:
        11px;

    font-weight:
        750;
}


.betcraft-portfolio-page
.portfolio-project-cta {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        9px;

    margin-top:
        22px;

    color:
        #17324f;

    font-size:
        14px;

    font-weight:
        850;

    text-decoration:
        none;
}


.betcraft-portfolio-page
.portfolio-project-cta span {
    color:
        #b3832e;

    font-size:
        18px;
}


.betcraft-portfolio-page
.portfolio-project-visuals {
    display:
        grid;

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

    gap:
        12px;

    min-width:
        0;
}


.betcraft-portfolio-page
.portfolio-shot {
    display:
        block;

    min-width:
        0;

    overflow:
        hidden;

    border:
        1px solid
        rgba(20,43,70,.09);

    border-radius:
        18px;

    background:
        #ffffff;

    box-shadow:
        0 12px 32px
        rgba(20,43,70,.08);
}


.betcraft-portfolio-page
.portfolio-shot-featured {
    grid-column:
        1 / -1;
}


.betcraft-portfolio-page
.portfolio-shot img {
    display:
        block;

    width:
        100%;

    height:
        auto;

    object-fit:
        contain;

    background:
        #ffffff;
}


@media (hover: hover) and (pointer: fine) {

    .betcraft-portfolio-page
    .portfolio-shot img {
        transition:
            transform .28s ease;
    }


    .betcraft-portfolio-page
    .portfolio-shot:hover img {
        transform:
            scale(1.012);
    }

}



/* ==========================================================
   MOBILE
   Keep same project hierarchy as desktop.
   ========================================================== */

@media (max-width: 760px) {

    .betcraft-portfolio-page
    .container {
        width:
            calc(100% - 32px);

        max-width:
            680px;

        margin-left:
            auto;

        margin-right:
            auto;
    }


    .betcraft-portfolio-page
    .page-hero {
        min-height:
            0;

        padding-top:
            50px;

        padding-bottom:
            48px;
    }


    .betcraft-portfolio-page
    .page-hero h1 {
        max-width:
            13ch;

        font-size:
            clamp(
                36px,
                9.6vw,
                48px
            );

        line-height:
            1.04;

        letter-spacing:
            -.04em;
    }


    .betcraft-portfolio-page
    .page-hero p {
        font-size:
            15.5px;

        line-height:
            1.72;
    }


    .betcraft-portfolio-page
    .portfolio-showcase {
        padding:
            54px 0 60px;
    }


    .betcraft-portfolio-page
    .portfolio-showcase-head {
        margin-bottom:
            26px;
    }


    .betcraft-portfolio-page
    .portfolio-showcase-head h2 {
        max-width:
            14ch;

        font-size:
            clamp(
                29px,
                7.6vw,
                38px
            );

        line-height:
            1.1;
    }


    .betcraft-portfolio-page
    .portfolio-showcase-head p {
        margin-top:
            15px;

        font-size:
            15px;

        line-height:
            1.7;
    }


    .betcraft-portfolio-page
    .portfolio-project-list {
        gap:
            18px;
    }


    .betcraft-portfolio-page
    .portfolio-project {
        grid-template-columns:
            minmax(0, 1fr);

        gap:
            22px;

        padding:
            21px;

        border-radius:
            23px;
    }


    .betcraft-portfolio-page
    .portfolio-project-reverse
    .portfolio-project-copy,
    .betcraft-portfolio-page
    .portfolio-project-reverse
    .portfolio-project-visuals {
        order:
            initial;
    }


    .betcraft-portfolio-page
    .portfolio-project h3 {
        max-width:
            15ch;

        font-size:
            clamp(
                25px,
                6.8vw,
                33px
            );

        line-height:
            1.1;
    }


    .betcraft-portfolio-page
    .portfolio-project-copy > p {
        margin-top:
            13px;

        font-size:
            14.5px;

        line-height:
            1.66;
    }


    .betcraft-portfolio-page
    .portfolio-project-tags {
        margin-top:
            16px;

        gap:
            6px;
    }


    .betcraft-portfolio-page
    .portfolio-project-tags li {
        padding:
            6px 9px;

        font-size:
            10.5px;
    }


    .betcraft-portfolio-page
    .portfolio-project-cta {
        margin-top:
            17px;

        font-size:
            13.5px;
    }


    .betcraft-portfolio-page
    .portfolio-project-visuals {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            9px;
    }


    .betcraft-portfolio-page
    .portfolio-shot {
        border-radius:
            14px;
    }


    .betcraft-portfolio-page
    .ambient-band {
        padding:
            23px 20px;

        border-radius:
            22px;
    }

}



@media (max-width: 430px) {

    .betcraft-portfolio-page
    .container {
        width:
            calc(100% - 28px);
    }


    .betcraft-portfolio-page
    .page-hero {
        padding-top:
            41px;

        padding-bottom:
            42px;
    }


    .betcraft-portfolio-page
    .page-hero h1 {
        max-width:
            12ch;

        font-size:
            clamp(
                34px,
                10vw,
                42px
            );
    }


    .betcraft-portfolio-page
    .portfolio-showcase {
        padding:
            46px 0 50px;
    }


    .betcraft-portfolio-page
    .portfolio-project {
        padding:
            18px;

        border-radius:
            20px;
    }


    .betcraft-portfolio-page
    .portfolio-project-visuals {
        gap:
            7px;
    }


    .betcraft-portfolio-page
    .portfolio-shot {
        border-radius:
            12px;
    }

}


/* BETCRAFT PORTFOLIO PROJECT SHOWCASE V2 END */


/* BETCRAFT ABOUT CONTACT MOBILE COMPOSITION V1 START */


/* ==========================================================
   ABOUT
   ========================================================== */

@media (max-width: 760px) {

    .betcraft-about-page {
        overflow-x:
            hidden;
    }


    .betcraft-about-page main {
        overflow:
            hidden;
    }


    .betcraft-about-page
    .container {
        width:
            calc(100% - 32px);

        max-width:
            680px;

        margin-left:
            auto;

        margin-right:
            auto;
    }


    .betcraft-about-page
    main > section:not(.page-hero) {
        padding-top:
            54px;

        padding-bottom:
            54px;
    }


    /* HERO */

    .betcraft-about-page
    .page-hero {
        min-height:
            0;

        padding-top:
            50px;

        padding-bottom:
            48px;

        background-position:
            center center;

        background-size:
            cover;
    }


    .betcraft-about-page
    .page-hero
    .eyebrow {
        margin-bottom:
            12px;

        font-size:
            11.5px;

        line-height:
            1.35;

        letter-spacing:
            .09em;
    }


    .betcraft-about-page
    .page-hero h1 {
        max-width:
            13ch;

        margin-left:
            0;

        margin-right:
            0;

        font-size:
            clamp(
                37px,
                9.5vw,
                49px
            );

        line-height:
            1.04;

        letter-spacing:
            -.04em;
    }


    .betcraft-about-page
    .page-hero p {
        max-width:
            610px;

        font-size:
            15.5px;

        line-height:
            1.72;
    }


    /* BRAND PANEL */

    .betcraft-about-page
    .brand-panel {
        display:
            grid;

        grid-template-columns:
            108px
            minmax(0, 1fr);

        gap:
            20px;

        align-items:
            center;

        width:
            100%;

        padding:
            22px;

        border-radius:
            23px;
    }


    .betcraft-about-page
    .brand-panel-logo {
        width:
            108px;

        max-width:
            100%;

        margin:
            0;
    }


    .betcraft-about-page
    .brand-panel-logo img {
        display:
            block;

        width:
            100%;

        height:
            auto;

        border-radius:
            16px;
    }


    .betcraft-about-page
    .brand-panel
    h2 {
        font-size:
            clamp(
                26px,
                6.8vw,
                35px
            );

        line-height:
            1.13;

        letter-spacing:
            -.025em;
    }


    .betcraft-about-page
    .brand-panel p {
        font-size:
            14.5px;

        line-height:
            1.66;
    }


    /* ABOUT PRINCIPLES */

    .betcraft-about-page
    .grid {
        display:
            grid;

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

        gap:
            11px;

        width:
            100%;
    }


    .betcraft-about-page
    .card {
        min-width:
            0;

        width:
            100%;

        margin:
            0;

        padding:
            17px 15px;

        border-radius:
            18px;
    }


    .betcraft-about-page
    .card
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            15.5px;

        line-height:
            1.3;
    }


    .betcraft-about-page
    .card p {
        font-size:
            13.5px;

        line-height:
            1.58;
    }


    /* FINAL CTA */

    .betcraft-about-page
    .ambient-band {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            17px;

        width:
            100%;

        min-height:
            0;

        padding:
            24px 21px;

        border-radius:
            24px;
    }


    .betcraft-about-page
    .ambient-band-copy {
        width:
            100%;

        max-width:
            620px;
    }


    .betcraft-about-page
    .ambient-band h2 {
        max-width:
            18ch;

        font-size:
            clamp(
                27px,
                7vw,
                36px
            );

        line-height:
            1.14;

        letter-spacing:
            -.025em;
    }


    .betcraft-about-page
    .ambient-band p {
        font-size:
            15px;

        line-height:
            1.68;
    }

}



/* ==========================================================
   CONTACT
   ========================================================== */

@media (max-width: 760px) {

    .betcraft-contact-page {
        overflow-x:
            hidden;
    }


    .betcraft-contact-page main {
        overflow:
            hidden;
    }


    .betcraft-contact-page
    .container {
        width:
            calc(100% - 32px);

        max-width:
            680px;

        margin-left:
            auto;

        margin-right:
            auto;
    }


    .betcraft-contact-page
    main > section:not(.page-hero) {
        padding-top:
            52px;

        padding-bottom:
            52px;
    }


    /* HERO */

    .betcraft-contact-page
    .page-hero {
        min-height:
            0;

        padding-top:
            50px;

        padding-bottom:
            48px;

        background-position:
            center center;

        background-size:
            cover;
    }


    .betcraft-contact-page
    .page-hero
    .eyebrow {
        margin-bottom:
            12px;

        font-size:
            11.5px;

        line-height:
            1.35;

        letter-spacing:
            .09em;
    }


    .betcraft-contact-page
    .page-hero h1 {
        max-width:
            13ch;

        margin-left:
            0;

        margin-right:
            0;

        font-size:
            clamp(
                37px,
                9.5vw,
                49px
            );

        line-height:
            1.04;

        letter-spacing:
            -.04em;
    }


    .betcraft-contact-page
    .page-hero p {
        max-width:
            600px;

        font-size:
            15.5px;

        line-height:
            1.72;
    }


    /* SECTION HEAD */

    .betcraft-contact-page
    .section-head {
        width:
            100%;

        max-width:
            630px;

        margin-bottom:
            23px;
    }


    .betcraft-contact-page
    .section-head h2 {
        max-width:
            17ch;

        font-size:
            clamp(
                28px,
                7.3vw,
                37px
            );

        line-height:
            1.12;

        letter-spacing:
            -.028em;
    }


    .betcraft-contact-page
    .section-head p {
        font-size:
            15px;

        line-height:
            1.7;
    }


    /* QUESTION / PROJECT CARDS */

    .betcraft-contact-page
    .grid {
        display:
            grid;

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

        gap:
            11px;

        width:
            100%;
    }


    .betcraft-contact-page
    .grid > .card:last-child {
        grid-column:
            1 / -1;
    }


    .betcraft-contact-page
    .card {
        width:
            100%;

        min-width:
            0;

        margin:
            0;

        padding:
            18px 16px;

        border-radius:
            18px;
    }


    .betcraft-contact-page
    .card
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            15.5px;

        line-height:
            1.3;
    }


    .betcraft-contact-page
    .card p {
        font-size:
            13.5px;

        line-height:
            1.58;
    }


    .betcraft-contact-page
    .cta {
        min-height:
            47px;

        font-size:
            14px;
    }


    /* INFORMATION / CTA BAND */

    .betcraft-contact-page
    .ambient-band {
        display:
            grid;

        grid-template-columns:
            minmax(0, 1fr);

        gap:
            17px;

        width:
            100%;

        min-height:
            0;

        padding:
            23px 20px;

        border-radius:
            23px;
    }


    .betcraft-contact-page
    .ambient-band-copy {
        width:
            100%;

        max-width:
            620px;
    }


    .betcraft-contact-page
    .ambient-band h2 {
        max-width:
            18ch;

        font-size:
            clamp(
                27px,
                7vw,
                36px
            );

        line-height:
            1.14;

        letter-spacing:
            -.025em;
    }


    .betcraft-contact-page
    .ambient-band p {
        font-size:
            15px;

        line-height:
            1.68;
    }


    /* CONTACT CHANNELS
       4 channels stay 2 x 2 like desktop mini cards */

    .betcraft-contact-page
    .contact-channels {
        padding-top:
            52px;

        padding-bottom:
            58px;
    }


    .betcraft-contact-page
    .contact-channel-head {
        max-width:
            620px;

        margin-bottom:
            23px;
    }


    .betcraft-contact-page
    .contact-channel-head h2 {
        max-width:
            15ch;

        font-size:
            clamp(
                29px,
                7.5vw,
                38px
            );

        line-height:
            1.12;

        letter-spacing:
            -.028em;
    }


    .betcraft-contact-page
    .contact-channel-head p {
        font-size:
            15px;

        line-height:
            1.68;
    }


    .betcraft-contact-page
    .contact-channel-grid {
        display:
            grid;

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

        gap:
            11px;

        width:
            100%;
    }


    .betcraft-contact-page
    .contact-channel-card {
        display:
            flex;

        flex-direction:
            column;

        min-width:
            0;

        width:
            100%;

        min-height:
            0;

        padding:
            16px 13px;

        border-radius:
            18px;
    }


    .betcraft-contact-page
    .contact-channel-icon-shell {
        width:
            46px;

        height:
            46px;

        margin-bottom:
            11px;
    }


    .betcraft-contact-page
    .contact-channel-icon {
        width:
            28px !important;

        height:
            28px !important;

        max-width:
            28px !important;

        object-fit:
            contain;
    }


    .betcraft-contact-page
    .contact-channel-card h3 {
        font-size:
            16px;

        line-height:
            1.25;
    }


    .betcraft-contact-page
    .contact-channel-card p {
        font-size:
            13px;

        line-height:
            1.55;
    }


    .betcraft-contact-page
    .contact-channel-note {
        font-size:
            11.5px;

        line-height:
            1.45;
    }


    .betcraft-contact-page
    .contact-channel-link {
        margin-top:
            auto;

        padding-top:
            11px;

        font-size:
            12.5px;

        line-height:
            1.4;

        overflow-wrap:
            anywhere;
    }

}



/* ==========================================================
   SMALL PHONE
   ========================================================== */

@media (max-width: 430px) {

    .betcraft-about-page
    .container,
    .betcraft-contact-page
    .container {
        width:
            calc(100% - 28px);
    }


    .betcraft-about-page
    main > section:not(.page-hero),
    .betcraft-contact-page
    main > section:not(.page-hero) {
        padding-top:
            45px;

        padding-bottom:
            45px;
    }


    .betcraft-about-page
    .page-hero,
    .betcraft-contact-page
    .page-hero {
        padding-top:
            41px;

        padding-bottom:
            42px;
    }


    .betcraft-about-page
    .page-hero h1,
    .betcraft-contact-page
    .page-hero h1 {
        max-width:
            12ch;

        font-size:
            clamp(
                34px,
                10vw,
                42px
            );
    }


    /* ABOUT */

    .betcraft-about-page
    .brand-panel {
        grid-template-columns:
            88px
            minmax(0, 1fr);

        gap:
            15px;

        padding:
            18px;

        border-radius:
            20px;
    }


    .betcraft-about-page
    .brand-panel-logo {
        width:
            88px;
    }


    .betcraft-about-page
    .grid {
        gap:
            9px;
    }


    .betcraft-about-page
    .card {
        padding:
            14px 12px;

        border-radius:
            16px;
    }


    .betcraft-about-page
    .card
    :where(
        h2,
        h3,
        h4,
        strong
    ) {
        font-size:
            14px;
    }


    .betcraft-about-page
    .card p {
        font-size:
            12.75px;

        line-height:
            1.5;
    }


    /* CONTACT */

    .betcraft-contact-page
    .grid {
        gap:
            9px;
    }


    .betcraft-contact-page
    .card {
        padding:
            15px 13px;

        border-radius:
            16px;
    }


    .betcraft-contact-page
    .contact-channels {
        padding-top:
            45px;

        padding-bottom:
            50px;
    }


    .betcraft-contact-page
    .contact-channel-grid {
        gap:
            9px;
    }


    .betcraft-contact-page
    .contact-channel-card {
        padding:
            14px 11px;

        border-radius:
            16px;
    }


    .betcraft-contact-page
    .contact-channel-icon-shell {
        width:
            42px;

        height:
            42px;
    }


    .betcraft-contact-page
    .contact-channel-icon {
        width:
            26px !important;

        height:
            26px !important;

        max-width:
            26px !important;
    }


    .betcraft-contact-page
    .contact-channel-card h3 {
        font-size:
            15px;
    }


    .betcraft-contact-page
    .contact-channel-card p {
        font-size:
            12.5px;
    }


    .betcraft-contact-page
    .contact-channel-link {
        font-size:
            12px;
    }

}


/* BETCRAFT ABOUT CONTACT MOBILE COMPOSITION V1 END */


/* BETCRAFT REAL WORK DISTRIBUTION V1 START */


/* ==========================================================
   REAL USER-SUPPLIED SCREENSHOTS
   Shared card language
   ========================================================== */

.betcraft-home-v2
.bc-real-shot-card,
.betcraft-websites-page
.bc-real-shot-card,
.betcraft-systems-page
.bc-real-shot-card,
.betcraft-custom-development-page
.bc-real-shot-card {
    min-width:
        0;

    margin:
        0;

    overflow:
        hidden;

    border:
        1px solid
        rgba(20,43,70,.10);

    border-radius:
        20px;

    background:
        #ffffff;

    box-shadow:
        0 14px 38px
        rgba(20,43,70,.08);
}


.betcraft-home-v2
.bc-real-shot-link,
.betcraft-websites-page
.bc-real-shot-link,
.betcraft-systems-page
.bc-real-shot-link,
.betcraft-custom-development-page
.bc-real-shot-link {
    display:
        block;

    width:
        100%;

    overflow:
        hidden;

    background:
        linear-gradient(
            145deg,
            #fffefb,
            #f4f0e7
        );
}


.betcraft-home-v2
.bc-real-shot-card img,
.betcraft-websites-page
.bc-real-shot-card img,
.betcraft-systems-page
.bc-real-shot-card img,
.betcraft-custom-development-page
.bc-real-shot-card img {
    display:
        block;

    width:
        100%;

    max-width:
        100%;

    height:
        auto;

    margin:
        0;

    object-fit:
        contain;

    background:
        #ffffff;
}


.betcraft-home-v2
.bc-real-shot-card figcaption,
.betcraft-websites-page
.bc-real-shot-card figcaption,
.betcraft-systems-page
.bc-real-shot-card figcaption,
.betcraft-custom-development-page
.bc-real-shot-card figcaption {
    display:
        grid;

    gap:
        4px;

    padding:
        13px 14px 14px;
}


.betcraft-home-v2
.bc-real-shot-card figcaption strong,
.betcraft-websites-page
.bc-real-shot-card figcaption strong,
.betcraft-systems-page
.bc-real-shot-card figcaption strong,
.betcraft-custom-development-page
.bc-real-shot-card figcaption strong {
    color:
        #17304d;

    font-size:
        14px;

    line-height:
        1.3;
}


.betcraft-home-v2
.bc-real-shot-card figcaption span,
.betcraft-websites-page
.bc-real-shot-card figcaption span,
.betcraft-systems-page
.bc-real-shot-card figcaption span,
.betcraft-custom-development-page
.bc-real-shot-card figcaption span {
    color:
        #627083;

    font-size:
        12.5px;

    line-height:
        1.5;
}



@media (hover: hover) and (pointer: fine) {

    .betcraft-home-v2
    .bc-real-shot-card img,
    .betcraft-websites-page
    .bc-real-shot-card img,
    .betcraft-systems-page
    .bc-real-shot-card img,
    .betcraft-custom-development-page
    .bc-real-shot-card img {
        transition:
            transform .28s ease;
    }


    .betcraft-home-v2
    .bc-real-shot-card:hover img,
    .betcraft-websites-page
    .bc-real-shot-card:hover img,
    .betcraft-systems-page
    .bc-real-shot-card:hover img,
    .betcraft-custom-development-page
    .bc-real-shot-card:hover img {
        transform:
            scale(1.012);
    }

}



/* ==========================================================
   HOME
   Four standout real examples
   ========================================================== */

.betcraft-home-v2
.bc-real-work-home {
    padding-top:
        88px;

    padding-bottom:
        92px;
}


.betcraft-home-v2
.bc-real-work-head {
    display:
        grid;

    grid-template-columns:
        minmax(0, 1.25fr)
        minmax(260px, .75fr);

    gap:
        34px;

    align-items:
        end;

    margin-bottom:
        30px;
}


.betcraft-home-v2
.bc-real-work-head h2 {
    max-width:
        14ch;

    margin:
        0;

    color:
        #142b46;

    font-size:
        clamp(
            40px,
            4.3vw,
            62px
        );

    line-height:
        1.04;

    letter-spacing:
        -.04em;
}


.betcraft-home-v2
.bc-real-work-head-side p {
    margin:
        0 0 14px;

    color:
        #526276;

    font-size:
        15px;

    line-height:
        1.7;
}


.betcraft-home-v2
.bc-real-work-grid {
    display:
        grid;

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

    gap:
        18px;
}



/* ==========================================================
   WEBSITES
   Eight real Front-end examples
   ========================================================== */

.betcraft-websites-page
.bc-page-real-work {
    padding-top:
        78px;

    padding-bottom:
        82px;

    background:
        linear-gradient(
            180deg,
            #ffffff,
            #faf6ed
        );
}


.betcraft-websites-page
.bc-page-real-grid {
    display:
        grid;

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

    gap:
        15px;
}



/* ==========================================================
   SYSTEMS
   Five system screenshots
   ========================================================== */

.betcraft-systems-page
.bc-systems-real-grid {
    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap:
        15px;
}


.betcraft-systems-page
.bc-systems-real-grid
.bc-real-shot-card:first-child {
    grid-column:
        span 2;
}



/* ==========================================================
   CUSTOM DEVELOPMENT
   Four access / registration screens
   ========================================================== */

.betcraft-custom-development-page
.bc-custom-real-grid {
    display:
        grid;

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

    gap:
        15px;
}



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

@media (max-width: 760px) {

    .betcraft-home-v2
    .bc-real-work-home {
        padding-top:
            54px;

        padding-bottom:
            58px;
    }


    .betcraft-home-v2
    .bc-real-work-head {
        grid-template-columns:
            minmax(0, 1fr);

        gap:
            14px;

        margin-bottom:
            22px;
    }


    .betcraft-home-v2
    .bc-real-work-head h2 {
        max-width:
            15ch;

        font-size:
            clamp(
                29px,
                7.6vw,
                38px
            );

        line-height:
            1.1;
    }


    .betcraft-home-v2
    .bc-real-work-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            10px;
    }


    .betcraft-websites-page
    .bc-page-real-work {
        padding-top:
            52px;

        padding-bottom:
            56px;
    }


    .betcraft-websites-page
    .bc-page-real-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            10px;
    }


    .betcraft-systems-page
    .bc-systems-real-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            10px;
    }


    .betcraft-systems-page
    .bc-systems-real-grid
    .bc-real-shot-card:first-child {
        grid-column:
            1 / -1;
    }


    .betcraft-custom-development-page
    .bc-custom-real-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            10px;
    }


    .betcraft-home-v2
    .bc-real-shot-card,
    .betcraft-websites-page
    .bc-real-shot-card,
    .betcraft-systems-page
    .bc-real-shot-card,
    .betcraft-custom-development-page
    .bc-real-shot-card {
        border-radius:
            15px;
    }


    .betcraft-home-v2
    .bc-real-shot-card figcaption,
    .betcraft-websites-page
    .bc-real-shot-card figcaption,
    .betcraft-systems-page
    .bc-real-shot-card figcaption,
    .betcraft-custom-development-page
    .bc-real-shot-card figcaption {
        padding:
            10px 10px 11px;
    }


    .betcraft-home-v2
    .bc-real-shot-card figcaption strong,
    .betcraft-websites-page
    .bc-real-shot-card figcaption strong,
    .betcraft-systems-page
    .bc-real-shot-card figcaption strong,
    .betcraft-custom-development-page
    .bc-real-shot-card figcaption strong {
        font-size:
            13px;
    }


    .betcraft-home-v2
    .bc-real-shot-card figcaption span,
    .betcraft-websites-page
    .bc-real-shot-card figcaption span,
    .betcraft-systems-page
    .bc-real-shot-card figcaption span,
    .betcraft-custom-development-page
    .bc-real-shot-card figcaption span {
        font-size:
            11.5px;

        line-height:
            1.45;
    }

}



@media (max-width: 430px) {

    .betcraft-home-v2
    .bc-real-work-grid,
    .betcraft-websites-page
    .bc-page-real-grid,
    .betcraft-systems-page
    .bc-systems-real-grid,
    .betcraft-custom-development-page
    .bc-custom-real-grid {
        gap:
            8px;
    }


    .betcraft-home-v2
    .bc-real-shot-card figcaption,
    .betcraft-websites-page
    .bc-real-shot-card figcaption,
    .betcraft-systems-page
    .bc-real-shot-card figcaption,
    .betcraft-custom-development-page
    .bc-real-shot-card figcaption {
        padding:
            9px;
    }


    .betcraft-home-v2
    .bc-real-shot-card figcaption strong,
    .betcraft-websites-page
    .bc-real-shot-card figcaption strong,
    .betcraft-systems-page
    .bc-real-shot-card figcaption strong,
    .betcraft-custom-development-page
    .bc-real-shot-card figcaption strong {
        font-size:
            12.5px;
    }


    .betcraft-home-v2
    .bc-real-shot-card figcaption span,
    .betcraft-websites-page
    .bc-real-shot-card figcaption span,
    .betcraft-systems-page
    .bc-real-shot-card figcaption span,
    .betcraft-custom-development-page
    .bc-real-shot-card figcaption span {
        font-size:
            11px;
    }

}


/* BETCRAFT REAL WORK DISTRIBUTION V1 END */


/* BETCRAFT HOME SALES CONTENT V2 START */


/* ==========================================================
   SALES PROOF
   ========================================================== */

.betcraft-home-v2
.bc-sales-proof-head {
    max-width:
        820px;

    margin-bottom:
        30px;
}


.betcraft-home-v2
.bc-sales-proof-head h2 {
    max-width:
        17ch;

    margin:
        0;

    color:
        #142b46;

    font-size:
        clamp(
            38px,
            4.2vw,
            60px
        );

    line-height:
        1.04;

    letter-spacing:
        -.04em;
}


.betcraft-home-v2
.bc-sales-proof-head p {
    max-width:
        700px;

    margin-top:
        17px;

    color:
        #536478;

    font-size:
        15px;

    line-height:
        1.72;
}


.betcraft-home-v2
.bc-sales-proof-grid {
    align-items:
        stretch;
}


.betcraft-home-v2
.bc-sales-proof-item {
    display:
        flex;

    flex-direction:
        column;

    min-width:
        0;
}


.betcraft-home-v2
.bc-sales-proof-value {
    display:
        inline-flex;

    align-items:
        center;

    width:
        max-content;

    margin-bottom:
        14px;

    color:
        #b1812f;

    font-size:
        clamp(
            24px,
            2.2vw,
            34px
        );

    font-weight:
        900;

    line-height:
        1;

    letter-spacing:
        -.035em;
}


.betcraft-home-v2
.bc-sales-proof-item strong {
    color:
        #17304d;

    font-size:
        17px;

    line-height:
        1.25;
}


.betcraft-home-v2
.bc-sales-proof-item p {
    margin-top:
        8px;

    color:
        #5b6b7d;

    font-size:
        13.5px;

    line-height:
        1.62;
}



/* ==========================================================
   AFTER SALES
   ========================================================== */

.betcraft-home-v2
.bc-after-sales {
    position:
        relative;
}


.betcraft-home-v2
.bc-after-sales-head {
    max-width:
        780px;

    margin-bottom:
        28px;
}


.betcraft-home-v2
.bc-after-sales-head h2 {
    max-width:
        14ch;

    margin:
        0;

    color:
        #142b46;

    font-size:
        clamp(
            38px,
            4.2vw,
            60px
        );

    line-height:
        1.04;

    letter-spacing:
        -.04em;
}


.betcraft-home-v2
.bc-after-sales-head p {
    max-width:
        700px;

    margin-top:
        17px;

    color:
        #536478;

    font-size:
        15px;

    line-height:
        1.72;
}


.betcraft-home-v2
.bc-after-sales-grid {
    display:
        grid;

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

    gap:
        14px;
}


.betcraft-home-v2
.bc-after-sales-card {
    min-width:
        0;

    padding:
        22px 19px;

    border:
        1px solid
        rgba(20,43,70,.09);

    border-radius:
        20px;

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

    box-shadow:
        0 14px 38px
        rgba(20,43,70,.06);
}


.betcraft-home-v2
.bc-after-sales-card > span {
    display:
        block;

    margin-bottom:
        13px;

    color:
        #ba8a36;

    font-size:
        11px;

    font-weight:
        900;

    letter-spacing:
        .13em;
}


.betcraft-home-v2
.bc-after-sales-card strong {
    display:
        block;

    color:
        #17304d;

    font-size:
        16px;

    line-height:
        1.28;
}


.betcraft-home-v2
.bc-after-sales-card p {
    margin:
        9px 0 0;

    color:
        #5b6b7d;

    font-size:
        13.5px;

    line-height:
        1.6;
}



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

@media (max-width: 760px) {

    .betcraft-home-v2
    .bc-sales-proof-head,
    .betcraft-home-v2
    .bc-after-sales-head {
        margin-bottom:
            22px;
    }


    .betcraft-home-v2
    .bc-sales-proof-head h2,
    .betcraft-home-v2
    .bc-after-sales-head h2 {
        max-width:
            15ch;

        font-size:
            clamp(
                29px,
                7.5vw,
                38px
            );

        line-height:
            1.1;
    }


    .betcraft-home-v2
    .bc-sales-proof-head p,
    .betcraft-home-v2
    .bc-after-sales-head p {
        margin-top:
            13px;

        font-size:
            15px;

        line-height:
            1.68;
    }


    .betcraft-home-v2
    .bc-sales-proof-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .betcraft-home-v2
    .bc-sales-proof-value {
        margin-bottom:
            10px;

        font-size:
            25px;
    }


    .betcraft-home-v2
    .bc-sales-proof-item strong {
        font-size:
            15px;
    }


    .betcraft-home-v2
    .bc-sales-proof-item p {
        font-size:
            13px;

        line-height:
            1.55;
    }


    .betcraft-home-v2
    .bc-after-sales-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            10px;
    }


    .betcraft-home-v2
    .bc-after-sales-card {
        padding:
            17px 14px;

        border-radius:
            17px;
    }


    .betcraft-home-v2
    .bc-after-sales-card strong {
        font-size:
            14.5px;
    }


    .betcraft-home-v2
    .bc-after-sales-card p {
        font-size:
            12.75px;

        line-height:
            1.55;
    }

}



@media (max-width: 430px) {

    .betcraft-home-v2
    .bc-sales-proof-grid,
    .betcraft-home-v2
    .bc-after-sales-grid {
        gap:
            9px;
    }


    .betcraft-home-v2
    .bc-sales-proof-item {
        padding:
            15px 12px;
    }


    .betcraft-home-v2
    .bc-sales-proof-value {
        font-size:
            22px;
    }


    .betcraft-home-v2
    .bc-sales-proof-item p {
        font-size:
            12.5px;
    }


    .betcraft-home-v2
    .bc-after-sales-card {
        padding:
            15px 12px;
    }


    .betcraft-home-v2
    .bc-after-sales-card strong {
        font-size:
            14px;
    }


    .betcraft-home-v2
    .bc-after-sales-card p {
        font-size:
            12.5px;
    }

}


/* BETCRAFT HOME SALES CONTENT V2 END */
