/* CSS Document */
@import url("var.css");
@import url("styles.css");
@import url("header.css");
@import url("footer.css");
@import url("misc.css");

/* home-style: title + CTA bound to the box's outer edge, text to the opposite side, box underline below the CTA */
/* the bottom logo box never gets an underline */
.ai-page .textbox:not(.bottom-logo-box)
{
    border-bottom: var(--bottom-line-width) solid white !important;
    padding-bottom: calc(0.5 * var(--margin_1));
}

.ai-page .textbox h1 {border-bottom: none !important;}

#reach-box h1,
#reach-box a,
#time-box h1,
#time-box a
{text-align: left;}

#reach-box p,
#time-box p
{text-align: right;}

#transform-box h1,
#transform-box a,
#international-box h1,
#international-box a
{text-align: right;}

#transform-box p,
#international-box p
{text-align: left;}

.ai-page #reach-box a,
.ai-page #transform-box a,
.ai-page #time-box a,
.ai-page #international-box a
{
    display: block;
    margin-top: var(--margin_1);
    font-size: 3.75vw;
    line-height: var(--line-height-p);
}

/* home-page title/text/CTA rhythm */
.ai-page .textbox p
{margin-bottom: calc(1 * var(--column_size));}

.ai-page .most-top-box
{padding-top: calc(2 * var(--margin_1));}

/* mobile: no extra top offset — the block sits on its space below the header only */
@media only screen and (max-width: 767px){

    .ai-page .most-top-box
    {padding-top: 0;}

}

/* paragraph span never narrower than 230px (logo box excepted) */
.ai-page .textbox:not(.bottom-logo-box)
{min-width: 230px;}

#section-3
{
    height: calc(0.5 * var(--section_height));
    background-size: 100% 200%;
}

/*responsive for Laptop*/
@media only screen and (min-width: 768px){

    .ai-page .textbox p
    {margin-top: 0; margin-bottom: var(--margin_1);}

    .ai-page .textbox:not(.bottom-logo-box)
    {padding-bottom: 0.5vw;}

    .ai-page .most-top-box h1
    {padding: 0 0 var(--margin_1) 0; margin-top: 0;}

    .ai-page #reach-box a,
    .ai-page #transform-box a,
    .ai-page #time-box a,
    .ai-page #international-box a
    {font-size: 0.78vw;}

    #section-3
    {
        margin-top: calc(-1 * var(--section_height) - var(--section_padding));
        height: var(--section_height);
        background: none;
        overflow: hidden;
    }

    .bottom-logo-box {
        margin-top: calc(2 * var(--column_size) + calc(0.5 * var(--section_height)));
    }
}