/* =============================================================================
   Members Club landing page  (/members-club  ->  MembersClub.aspx)

   This file holds ONLY the rules Tailwind utilities cannot express. Everything
   else - layout, spacing, colour, hover/active/focus states - lives as utility
   classes in the markup. Three concerns survive here:

     1. @font-face        Tailwind can reference a family, never declare one.
     2. .mc-hero          Two layered gradients, one of them a positioned
                          radial with 3 stops. v3 gradient utilities cap at
                          from/via/to and cannot layer backgrounds.
     3. .mc-cb:checked    The tick is a data-URI SVG; as an arbitrary utility
                          value its quotes and %23 escapes collide with the
                          class attribute.

   Note: rules below use background-* longhand deliberately. The `background`
   shorthand would reset background-color and clobber the Tailwind bg-* utility
   on the same element (the CDN injects its stylesheet after this file, but
   shorthand-vs-longhand is a cascade hazard regardless of order).
   ========================================================================== */


/* 1. Almoni DL - already shipped with the site under Static/fonts.
      Paths are relative to this file, matching the convention in reports.css. */
@font-face {
    font-family: 'almoni-dl';
    font-weight: 300;
    font-style: normal;
    src: url('../fonts/almoni-dl-aaa-300.eot');
    src: url('../fonts/almoni-dl-aaa-300.eot?#iefix') format('embedded-opentype'),
         url('../fonts/almoni-dl-aaa-300.woff') format('woff'),
         url('../fonts/almoni-dl-aaa-300.ttf') format('truetype');
}
@font-face {
    font-family: 'almoni-dl';
    font-weight: 400;
    font-style: normal;
    src: url('../fonts/almoni-dl-aaa-400.eot');
    src: url('../fonts/almoni-dl-aaa-400.eot?#iefix') format('embedded-opentype'),
         url('../fonts/almoni-dl-aaa-400.woff') format('woff'),
         url('../fonts/almoni-dl-aaa-400.ttf') format('truetype');
}
@font-face {
    font-family: 'almoni-dl';
    font-weight: 700;
    font-style: normal;
    src: url('../fonts/almoni-dl-aaa-700.eot');
    src: url('../fonts/almoni-dl-aaa-700.eot?#iefix') format('embedded-opentype'),
         url('../fonts/almoni-dl-aaa-700.woff') format('woff'),
         url('../fonts/almoni-dl-aaa-700.ttf') format('truetype');
}
@font-face {
    font-family: 'almoni-dl';
    font-weight: 900;
    font-style: normal;
    src: url('../fonts/almoni-dl-aaa-900.eot');
    src: url('../fonts/almoni-dl-aaa-900.eot?#iefix') format('embedded-opentype'),
         url('../fonts/almoni-dl-aaa-900.woff') format('woff'),
         url('../fonts/almoni-dl-aaa-900.ttf') format('truetype');
}


/* 2. Hero backdrop. Three layers, each fitted to sampled comp values:
        a) mint glow anchored at the bottom-left corner,
        b) a softer green wash down the whole left edge (the comp is greener at
           top-left than the glow alone would make it),
        c) base teal that lifts from #02485C at the top to #036A85 at the
           bottom-right.
      Verified against 11 sample points; see members-club-CONTEXT.md §9. */
.mc-hero {
    background-image:
        radial-gradient(60% 115% at 0% 100%,
            #93F2B4 1%,
            #99F2B8 9%,
            #96F1B8 18%,
            #8AEFB5 26%,
            #79EBB0 35%,
            #5CE3AB 44%,
            #06D6A3 53%,
            #00B892 61%,
            #019A7C 70%,
            #00816B 79%,
            rgba(0, 110, 95, 0.55) 88%,
            rgba(0, 90, 90, 0) 100%),
        linear-gradient(to right,
            rgba(0, 150, 112, 0.26) 0%,
            rgba(0, 120, 110, 0.11) 30%,
            rgba(0, 90, 105, 0) 55%),
        linear-gradient(to bottom,
            #02485C 0%,
            #024F64 55%,
            #036A85 100%);
}


/* 3. Checked-state tick for the interest / terms checkboxes. Box dimensions,
      border, radius and fill colours are all Tailwind utilities in the markup;
      only the glyph lives here. */
.mc-cb:checked {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M3 8.5l3.2 3.2L13 4.6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 16px 16px;
}