/* Ensure full viewport height */
    html, body {
      height: 100%;
      margin: 0;
      padding: 0;
    }

    body {
    background-image: url('../images/bg-landscape.jpg');
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    width: 100vw; /* optional, not needed for full-screen bg */
    }

        /* Default fonts */
    @font-face {
        font-family: 'Roboto-Thin';
        src: url('../fonts/Roboto-Thin.ttf')  format('truetype');
    }
    @font-face {
        font-family: 'Roboto-Medium';
        src: url('../fonts/Roboto-Medium.ttf')  format('truetype');
    }
    @font-face {
        font-family: 'Roboto-Regular';
        src: url('../fonts/Roboto-Regular.ttf')  format('truetype');
    }
    @font-face {
        font-family: 'Roboto-Light';
        src: url('../fonts/Roboto-Light.ttf')  format('truetype');
    }
    @font-face {
        font-family: 'Roboto-Bold';
        src: url('../fonts/Roboto-Bold.ttf')  format('truetype');
    }

    div.menu-row {
      width: 2.0vw;
      height: auto;
      padding-left: 94.0vw;
      padding-right: 4.0vw;
      padding-top: 3.0vw;
      margin: 0vw;
    }

    img.menu-icon {
      width: 2.0vw;
      height: auto;
      margin: 0vw;
    }

    div.logo-row {
      width: 30.0vw;
      height: auto;
      padding-left: 35.0vw;
      padding-right: 35.0vw;
      padding-top: 1.0vw;
      padding-bottom: 2.0vw;
      margin: 0vw;
    }

    img.logo {
      width: 30.0vw;
      height: auto;
      margin: 0vw;
    }

    div.links-row {
      width: 27.0vw;
      height: auto;
      padding-left: 73.0vw;
      padding-right: 0.0vw;
      padding-top: 1.0vw;
      padding-bottom: 2.0vw;
      margin: 0vw;
    }

    p.text {
      font-family: Roboto-Medium;
      font-size: 1.7vw;
      line-height: 2.3vw;
      color: #363636;
    }

    a.links {
      font-family: Roboto-Regular;
      font-size: 2.5vw;
      line-height: 3.5vw;
      color: #545454;
      text-decoration: none;
    }

    /* Optional: Rare case – large portrait monitor (e.g., rotated desktop screen) */
    @media (min-width: 1025px) and (orientation: portrait) {
        
    body {
      background-image: url('../images/bg-pad-portrait.jpg'); 
      /* Reuse 3:4 or use bg-phone.jpg */
    }
        
    div.menu-row {
      width: 3.0vw;
      padding-left: 91.0vw;
      padding-right: 6.0vw;
      padding-top: 4.5vw;
    }

    img.menu-icon {
      width: 3.0vw;
    }
    
    div.logo-row {
      width: 50.0vw;
      padding-left: 25.0vw;
      padding-right: 25.0vw;
      padding-top: 1.5vw;
      padding-bottom: 3.0vw;
    }

    img.logo {
      width: 50.0vw;
    }    

    div.links-row {
      width: 55.0vw;
      padding-left: 45.0vw;
      padding-right: 0.0vw;
      padding-top: 50.0vw;
      padding-bottom: 3.0vw;
    }

    p.text {
      font-size: 2.55vw;
      line-height: 3.45vw;
    }

    a.links {
      font-size: 3.75vw;
      line-height: 5.25vw;
    }   
        
    } 

    /* Tablets in portrait (taller than wide, typical iPad/Android tablet portrait) */
    @media (min-width: 768px) /* and (max-width: 1024px) */ and (orientation: portrait) {
      body {
        background-image: url('../images/bg-pad-portrait.jpg'); /* 3:4 */
      }

    div.menu-row {
      width: 3.0vw;
      padding-left: 91.0vw;
      padding-right: 6.0vw;
      padding-top: 4.5vw;
    }

    img.menu-icon {
      width: 3.0vw;
    }
    
    div.logo-row {
      width: 50.0vw;
      padding-left: 25.0vw;
      padding-right: 25.0vw;
      padding-top: 1.5vw;
      padding-bottom: 3.0vw;
    }

    img.logo {
      width: 50.0vw;
    }

    div.links-row {
      width: 55.0vw;
      padding-left: 45.0vw;
      padding-right: 0.0vw;
      padding-top: 50.0vw;
      padding-bottom: 3.0vw;
    }

    p.text {
      font-size: 2.55vw;
      line-height: 3.45vw;
    }

    a.links {
      font-size: 3.75vw;
      line-height: 5.25vw;
    }        
        
    }

    /* Tablets in landscape (wider than tall) */
    @media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
      body {
        background-image: url('../images/bg-pad-landscape.jpg'); /* 4:3 */
      }
        
    div.menu-row {
      width: 2.4vw;
      padding-left: 92.8vw;
      padding-right: 4.8vw;
      padding-top: 3.6vw;
    }

    img.menu-icon {
      width: 2.4vw;
    }
    
    div.logo-row {
      width: 40.0vw;
      padding-left: 30.0vw;
      padding-right: 30.0vw;
      padding-top: 1.2vw;
      padding-bottom: 2.4vw;
    }

    img.logo {
      width: 40.0vw;
    }

    div.links-row {
      width: 35.0vw;
      padding-left: 65.0vw;
      padding-right: 0.0vw;
      padding-top: 5.0vw;
      padding-bottom: 2.4vw;
    }

    p.text {
      font-size: 2.05vw;
      line-height: 2.75vw;
    }

    a.links {
      font-size: 3.0vw;
      line-height: 4.2vw;
    }
        
    }

    /* Phones in portrait (very tall screens, usually < 768px width) */
    @media (orientation: portrait) and (max-width: 767px) {
      body {
        background-image: url('../images/bg-mobile.jpg'); /* 9:16 */
      }
        

    div.menu-row {
      width: 6.0vw;
      padding-left: 82.0vw;
      padding-right: 12.0vw;
      padding-top: 9.0vw;
    }

    img.menu-icon {
      width: 6.0vw;
    }
    
    div.logo-row {
      width: 70.0vw;
      padding-left: 15.0vw;
      padding-right: 15.0vw;
      padding-top: 3.0vw;
      padding-bottom: 6.0vw;
    }

    img.logo {
      width: 70.0vw;
    }

    div.links-row {
      width: 70.0vw;
      padding-left: 30.0vw;
      padding-right: 0.0vw;
      padding-top: 70.0vw;
      padding-bottom: 6.0vw;
    }

    p.text {
      font-size: 5.10vw;
      line-height: 6.90vw;
    }

    a.links {
      font-size: 7.5vw;
      line-height: 10.5vw;
    }  
        
    }