/* PAGE11 design components. Source: unchanged page11.php. */
* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0 !important;
    background: #090a0b !important;
    color: #f3f3f3;
    font-family: Arial, Helvetica, sans-serif;
    overflow-x: hidden;
}

a {
    color: inherit;
}

img,
video {
    max-width: 100%;
}

.amsal-page {
    width: 100%;
    background: #090a0b;
}

.amsal-wrap {
    width: min(82%, 1320px);
    margin: 0 auto;
}


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

.amsal-header {
    position: sticky;
    top: 0;
    z-index: 9999;

    width: 100%;
    height: 78px;

    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;

    padding: 0 5%;

    background: rgba(8,9,10,.97);
    border-bottom: 1px solid #292b2e;
}

.amsal-brand {
    display: flex;
    align-items: center;
    gap: 16px;

    color: #fff !important;
    text-decoration: none !important;
}

.amsal-brand img {
    width: 34px;
    height: 34px;
    object-fit: contain;
}

.amsal-header .amsal-brand strong {
    font-family: "DM Sans", Arial, sans-serif !important;
    font-size: 29px !important;
    font-weight: 800 !important;
    letter-spacing: 3px !important;
    line-height: 1 !important;
    color: #fff !important;
    white-space: nowrap !important;
}

.amsal-nav {
    display: flex;
    gap: 34px;
    align-items: center;
}

.amsal-nav a {
    position: relative;
    color: #d6d6d6 !important;
    text-decoration: none !important;
    font-size: 12px;
}

.amsal-nav a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 100%;
    bottom: -11px;
    height: 1px;
    background: #fff;
    transition: right .25s ease;
}

.amsal-nav a:hover::after {
    right: 0;
}

.amsal-inquire {
    justify-self: end;

    padding: 12px 25px;
    border: 1px solid #73777c;

    color: #fff !important;
    text-decoration: none !important;

    font-size: 12px;
    transition: .2s ease;
}

.amsal-inquire:hover {
    background: #fff;
    color: #090a0b !important;
}


.amsal-label {
    margin: 0;
    color: #e8e8e8;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1.6px;
    text-transform: uppercase;
}

.amsal-text-link {
    display: inline-block;

    padding-bottom: 8px;
    border-bottom: 1px solid #777;

    color: #fff !important;
    text-decoration: none !important;

    font-size: 11px;
    font-weight: 600;
}


.amsal-contact {
    padding: 110px 0 115px;

    background: #090a0b;
    border-top: 1px solid #303235;
    border-bottom: 1px solid #303235;
}

.contact-grid {
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    gap: 120px;
    align-items: center;
}

.contact-left h2 {
    overflow-wrap: anywhere;
    margin: 32px 0 0;

    color: #fff !important;

    font-size: clamp(65px, 7vw, 105px);
    line-height: .92;
    letter-spacing: -5px;
    font-weight: 700;
}

.contact-left h2 span {
    display: block;
    color: #8c8c8c;
}

.contact-right p {
    max-width: 420px;

    color: #c4c6c8 !important;

    font-size: 13px;
    line-height: 1.8;
}

.contact-button {
    display: inline-block;

    margin: 12px 0 15px;
    padding: 14px 25px;

    background: #fff;

    color: #111 !important;
    text-decoration: none !important;

    font-size: 11px;
}

.contact-email {
    display: block;
    color: #fff !important;
    font-size: 11px;
}


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

.amsal-footer {
    padding: 55px 5% 35px;
    background: #090a0b;
}

.footer-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.footer-name {
    margin: 0;

    color: #fff;

    font-size: 58px;
    line-height: 1;
    letter-spacing: 3px;
    font-weight: 700;
}

.footer-worldwide {
    margin-top: 18px;

    color: #aaa;
    font-size: 10px;
}

.footer-social {
    display: flex;
    gap: 25px;
}

.footer-social a {
    color: #fff !important;
    text-decoration: none !important;
    font-size: 11px;
}

.footer-bottom {
    margin-top: 35px;
    padding-top: 20px;

    border-top: 1px solid #303235;

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

    color: #999;
    font-size: 9px;
}


@media (max-width:1000px) { .amsal-wrap { width:90%; } }
@media (max-width:720px) {
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .contact-left h2 {
        font-size: 65px;
        letter-spacing: -3px;
    }

    .footer-top {
        align-items: flex-start;
        flex-direction: column;
        gap: 35px;
    }

    .footer-name {
        font-size: 44px;
    }

    .footer-social {
        flex-wrap: wrap;
    }

}

@media (max-width:760px) {
.amsal-header{
 position:sticky;top:0;z-index:9999;
 width:100%;height:154px;min-height:154px;
 padding:0 6%;display:grid;
 grid-template-columns:1fr auto;grid-template-rows:88px 66px;
 align-items:center;background:#090a0b;
 border-bottom:1px solid #303236;
}
.amsal-brand{
 grid-column:1;grid-row:1;min-width:0;
 display:flex;align-items:center;gap:14px;white-space:nowrap;
}
.amsal-brand img{width:42px;height:42px;flex:0 0 42px;object-fit:contain}
.amsal-brand strong{
 display:block;margin:0;font-family:"Barlow Condensed",Arial,sans-serif;
 font-size:25px;line-height:1;font-weight:600;
 letter-spacing:.10em;white-space:nowrap;
}
.amsal-inquire{
 grid-column:2;grid-row:1;justify-self:end;position:static;
 width:auto;min-width:92px;min-height:52px;margin:0;
 padding:0 17px;display:flex;align-items:center;justify-content:center;
 font-size:15px;line-height:1;
}
.amsal-nav{
 grid-column:1/-1;grid-row:2;position:static;
 width:calc(100% + 12vw);height:66px;margin-left:-6vw;
 padding:0 4%;display:grid;grid-template-columns:repeat(4,1fr);
 gap:0;align-items:center;background:#090a0b;border:0;
}
.amsal-nav a{
 position:relative;display:flex;height:66px;padding:0;
 align-items:center;justify-content:center;color:#bfc1c6;
 font-family:"DM Sans",Arial,sans-serif;font-size:15px;line-height:1;
 white-space:nowrap;text-align:center;
}
.amsal-nav a::after{bottom:10px}

}
.scroll-top-btn {
    position: fixed;
    right: 28px;
    bottom: 28px;
    z-index: 99999;

    width: 52px;
    height: 52px;

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

    border: 1px solid rgba(255,255,255,.65);
    border-radius: 50%;

    background: #fff;
    color: #090a0b;

    font-family: Arial, sans-serif;
    font-size: 28px;
    font-weight: 400;
    line-height: 1;

    cursor: pointer;

    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);

    transition:
        opacity .25s ease,
        transform .25s ease,
        background .2s ease,
        color .2s ease;
}

.scroll-top-btn.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.scroll-top-btn:hover {
    background: #090a0b;
    color: #fff;
}

@media (max-width: 760px) {
    .scroll-top-btn {
        width: 46px;
        height: 46px;

        right: 18px;
        bottom: 20px;

        font-size: 24px;
    }
}


/* Active page uses the master's navigation underline. */
.amsal-nav a.active::after { right:0; }

/* Interior pages: PAGE11 music spacing, wedding heading and artwork grid. */
.interior-main { padding:clamp(60px,6.5vw,105px) 0; background:#090a0b; }
.interior-content { width:min(82%,1320px); margin:0 auto; }
.wedding-intro, .events-intro { margin:0 0 65px; }
.wedding-small-title, .events-small-title,
.wedding-highlights-label, .event-highlights-label {
    margin:0 0 28px; color:#e8e8e8; font-size:10px; font-weight:600;
    letter-spacing:1.6px; text-transform:uppercase;
}
.wedding-intro h1, .events-intro h1 {
    max-width:1000px; margin:0 0 30px; color:#f4f4f4;
    font-family:"DM Sans",Arial,sans-serif; font-size:clamp(35px,4vw,64px);
    font-weight:500; line-height:1.02; letter-spacing:-.04em;
}
.wedding-title-line, .events-title-line, .wedding-highlights-line, .event-highlights-line {
    height:1px; width:100%; background:rgba(255,255,255,.20); margin:0 0 28px;
}
.wedding-intro p, .events-intro p {
    max-width:850px; margin:0; color:#d0d0d0; font-family:"DM Sans",Arial,sans-serif;
    font-size:15px; line-height:1.75;
}
.interior-main p b { color:#f4f4f4; font-weight:600; }
.wedding-intro a, .wedding-faq-item a { color:#fff; text-decoration:none; border-bottom:1px solid #777; }
.wedding-highlights-head, .event-highlights-head {
    display:flex; justify-content:space-between; align-items:start; gap:20px;
    padding-bottom:20px; margin-bottom:0;
}
.wedding-highlights-head > div, .event-highlights-head > div { margin:0; }
.wedding-highlights-note, .event-highlights-note {
    color:#a9a9a9; font-size:10px; letter-spacing:.12em; text-transform:uppercase;
}
.wedding-highlights-intro, .event-highlights-intro {
    display:grid; grid-template-columns:1.25fr .75fr; gap:8%; align-items:start; margin:0 0 42px;
}
.wedding-highlights-intro h2, .event-highlights-intro h2, #wedding-faq > h2 {
    margin:0; color:#f4f4f4; font-family:"DM Sans",Arial,sans-serif;
    font-size:clamp(35px,4vw,64px); font-weight:500; line-height:1.02; letter-spacing:-.04em;
}
.wedding-highlights-intro h2 span, .event-highlights-intro h2 span { color:#969696; font-weight:400; }
.wedding-highlights-intro p, .event-highlights-intro p {
    max-width:390px; margin:5px 0 0; color:#d0d0d0; font-family:"DM Sans",Arial,sans-serif;
    font-size:15px; line-height:1.75;
}
.wedding-video-grid, .event-video-grid {
    display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:38px 24px;
}
.wedding-video-item, .event-video-item { display:block; min-width:0; color:#fff; text-decoration:none !important; }
.wedding-image-box, .event-image-box { position:relative; width:100%; aspect-ratio:16/10; overflow:hidden; background:#111; }
.wedding-image-box img, .event-image-box img { display:block; width:100%; height:100%; object-fit:cover; transition:opacity .18s ease,transform .25s ease; }
.wedding-video-item:hover img, .event-video-item:hover img { opacity:.84; transform:scale(1.015); }
.wedding-play, .event-play { position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; }
.wedding-play span, .event-play span {
    width:48px; height:48px; display:grid; place-items:center; padding-left:3px; border-radius:50%;
    background:rgba(0,0,0,.70); border:1px solid rgba(255,255,255,.65); color:#fff; font-size:15px;
}
.wedding-video-info, .event-video-info {
    display:grid; grid-template-columns:28px minmax(0,1fr) auto; gap:8px; align-items:start;
    margin-top:12px; padding-bottom:14px; border-bottom:1px solid #292d31;
}
.wedding-video-info h3, .event-video-info h3 { margin:0; color:#f2f2f2; font:500 12px/1.45 "DM Sans",Arial,sans-serif; }
.wedding-video-number, .event-video-number { color:#999; font-size:9px; padding-top:2px; }
.wedding-watch, .event-watch { color:#a9a9a9; font-size:9px; letter-spacing:.12em; padding-top:2px; }
.event-cell { margin:0 0 65px; background:#000; }
#eventVideo { display:block; width:100%; height:auto; background:#000; }
@keyframes slideTicker { from { transform:translateX(100%); } to { transform:translateX(-100%); } }
#tickerContent { animation:slideTicker 20s linear infinite; }
#wedding-faq { margin-top:90px; }
#wedding-faq > h2 { margin-bottom:32px; }
.faq-gold-line { display:none; }
.wedding-faq-item { padding:22px 0; border-top:1px solid rgba(255,255,255,.18); }
.wedding-faq-item:last-child { border-bottom:1px solid rgba(255,255,255,.18); }
.wedding-faq-item h3 { margin:0 0 12px; color:#f4f4f4; font:600 18px/1.4 "DM Sans",Arial,sans-serif; }
.wedding-faq-item p { max-width:850px; margin:0; color:#d0d0d0; font:14px/1.75 "DM Sans",Arial,sans-serif; }
.contact-right .amsal-label { margin-bottom:20px; }
.contact-grid > div { min-width:0; }
@media (max-width:1000px) { .interior-content { width:90%; } .wedding-video-grid,.event-video-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) {
    .interior-main { padding:45px 0 65px; }
    .interior-content { width:88%; }
    .wedding-intro,.events-intro { margin-bottom:32px; }
    .wedding-intro h1,.events-intro h1 { font-size:clamp(30px,7vw,46px); }
    .wedding-highlights-intro,.event-highlights-intro { grid-template-columns:1fr; gap:22px; margin-bottom:32px; }
    .wedding-highlights-intro h2,.event-highlights-intro h2 { font-size:clamp(30px,7vw,46px); }
    .wedding-highlights-intro p,.event-highlights-intro p { max-width:none; }
    .wedding-highlights-head,.event-highlights-head { flex-wrap:wrap; }
    .wedding-video-grid,.event-video-grid { grid-template-columns:1fr; gap:28px 16px; }
    .wedding-play span,.event-play span { width:42px; height:42px; }
    #wedding-faq { margin-top:65px; }
    .wedding-faq-item h3 { font-size:17px; }
    .wedding-faq-item p { font-size:15px; }
}
:is(.wedding-player-overlay, .event-player-overlay) {
    position:fixed;
    inset:0;
    z-index:99999;
    display:none;
    align-items:center;
    justify-content:center;
    padding:28px;
    background:rgba(0,0,0,.88);
    backdrop-filter:blur(4px);
}
:is(.wedding-player-overlay, .event-player-overlay).is-open { display:flex; }

:is(.wedding-player-dialog, .event-player-dialog) {
    width:min(900px, 94vw);
    max-height:92vh;
    overflow:auto;
    background:#0c0f12;
    border:1px solid #7d858e;
    box-shadow:0 30px 90px rgba(0,0,0,.72);
    padding:28px 28px 22px;
}
:is(.wedding-player-top, .event-player-top) {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}
:is(.wedding-player-kicker, .event-player-kicker) {
    color:#b7d8f4;
    font-size:11px;
    font-weight:700;
    letter-spacing:.18em;
}
:is(.wedding-player-close, .event-player-close) {
    appearance:none;
    border:1px solid #77808a;
    background:transparent;
    color:#fff;
    padding:12px 17px;
    font:600 12px/1 "DM Sans",Arial,sans-serif;
    cursor:pointer;
}
:is(.wedding-player-close, .event-player-close):hover {
    background:#fff;
    color:#000;
}
:is(.wedding-player-rule, .event-player-rule) {
    height:1px;
    background:#353a40;
    margin:18px 0 20px;
}
:is(.wedding-player-dialog, .event-player-dialog) h2 {
    margin:0 0 22px;
    color:#fff;
    font-family:"DM Sans",Arial,sans-serif;
    font-size:clamp(26px,3vw,38px);
    font-weight:500;
    line-height:1.15;
}
:is(.wedding-player-video-wrap, .event-player-video-wrap) {
    position: relative;
    background:#000;
    padding:14px;
}
:is(.wedding-player-video-wrap, .event-player-video-wrap) video {
    display:block;
    width:100%;
    max-height:58vh;
    background:#000;
}
:is(.wedding-player-bottom, .event-player-bottom) {
    padding-top:15px;
}
:is(.wedding-player-bottom, .event-player-bottom) a {
    display:inline-block;
    color:#fff !important;
    font-size:12px;
    text-decoration:none !important;
    border-bottom:1px solid #8d969e;
    padding-bottom:6px;
}
body:is(.wedding-modal-open, .event-modal-open) { overflow:hidden; }

@media (max-width:760px) {
    :is(.wedding-player-overlay, .event-player-overlay) { padding:12px; }
    :is(.wedding-player-dialog, .event-player-dialog) { width:100%; padding:18px 16px 16px; }
    :is(.wedding-player-close, .event-player-close) { padding:10px 12px; }
    :is(.wedding-player-video-wrap, .event-player-video-wrap) { padding:7px; }
}



@media (max-width:720px) {
    .wedding-highlights-intro h2,.event-highlights-intro h2 { font-size:62px; letter-spacing:-3px; }
}