/* Royal Rooms & Banquet design tokens (colour, type, spacing, motion). Fonts are self-hosted in fonts/. */

@font-face {
  font-family: "Prata";
  src: url("fonts/prata-latin-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("fonts/montserrat-latin-var.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Tiro Devanagari Hindi";
  src: url("fonts/tiro-devanagari-hindi-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0900-097F, U+200C-200D, U+25CC;
}
:root {
  --maroon:        #6B1F2B;   
  --maroon-hover:  #832A38;   
  --maroon-deep:   #4E1620;   
  --gold:          #B8893A;   
  --gold-bright:   #D9AE5E;   
  --gold-deep:     #8A6221;   
  --ink:           #1F1915;   
  --text:          #4A423C;   
  --muted:         #675D55;   
  --paper:         #F3EDE1;   
  --paper-deep:    #E9E0D0;   
  --panel:         #FFFDF8;   
  --line:          #E3DACB;   
  --line-strong:   #CFC3AE;
  --charcoal:      #1C1714;   
  --umber:         #3A302A;   
  --on-dark:       #FFFDF8;
  --on-dark-muted: #D6CFC6;   
  --c-bg:           var(--paper);
  --c-surface:      var(--panel);
  --c-frame:        var(--panel);
  --c-heading-1:    var(--maroon);
  --c-heading-2:    var(--ink);
  --c-eyebrow:      var(--maroon);
  --c-body:         var(--text);
  --c-meta:         var(--muted);
  --c-accent:       var(--maroon);
  --c-accent-hover: var(--maroon-hover);
  --c-rule:         var(--line);
  --c-focus:        var(--gold-deep);          
  --c-overlay-hero: rgba(0, 0, 0, .30);        
  --c-overlay-top:  rgba(0, 0, 0, .72);        
  --c-scrim:        rgba(28, 23, 20, .55);     
  --font-display: "Prata", "Georgia", "Times New Roman", serif;
  --font-body:    "Montserrat", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --font-hindi:   "Tiro Devanagari Hindi", "Prata", "Noto Serif Devanagari", serif;
  --fs-h1:       2.9325rem;   
  --lh-h1:       1.2;         
  --fs-h2:       1.87rem;     
  --lh-h2:       1.3;         
  --fs-eyebrow:  1.5rem;      
  --lh-eyebrow:  1.4;         
  --fs-body:     1rem;        
  --lh-body:     1.75;        
  --fs-chip:     .875rem;     
  --ls-chip:     2px;         
  --fs-button:   .875rem;     
  --ls-button:   1px;         
  --fs-nav:      .875rem;     
  --ls-nav:      1px;         
  --fs-utility:  .75rem;      
  --fs-faq-q:    1.25rem;     
  --lh-faq-q:    1.4;         
  --fs-faq-a:    .9375rem;    
  --lh-faq-a:    1.7;         
  --fs-tile:     .9375rem;    
  --lh-tile:     1.6;         
  --fs-small:    .875rem;     
  --fs-footer:   .9rem;       
  --ls-footer:   .5px;        
  --fs-hindi:    1.75rem;     
  --lh-hindi:    1.5;         
  --fs-drawer:   1.5rem;      
  --fw-eyebrow:  300;         
  --fw-body:     400;
  --fw-button:   700;         
  --fw-display:  400;         
  --eyebrow-pb:   30px;
  --eyebrow-mb:   20px;
  --heading-mt:  -24px;
  --heading-mb:   35.2px;
  --p-gap:        20px;       
  --sp-1:   5px;
  --sp-2:  10px;
  --sp-3:  15px;
  --sp-4:  20px;
  --sp-5:  30px;
  --sp-6:  40px;
  --sp-7:  50px;
  --sp-8:  70px;
  --sp-9: 100px;
  --sp-10:120px;
  --section-gap:   40px;      
  --panel-pad:     30px;      
  --intro-pt:     120px;      
  --intro-pb:      70px;      
  --tile-gap:      20px;      
  --frame:         0px;       
  --gutter:       15px;       
  --container:  1280px;       
  --container-l:1480px;       
  --container-s:1180px;       
  --container-xs: 980px;      
  --measure:     910px;       
  --header-h:    150px;       
  --header-h-stuck: 60px;     
  --hero-small-h: 450px;      
  --split-min-h:  650px;      
  --tile-ratio:  413 / 517;   
  --drawer-w:     80%;        
  --tap-min:      48px;       
  --radius-0:  0;             
  --radius-chip: 2px;         
  --bw-button: 2px;           
  --bw-rule:   4px;           
  --shadow-dropdown: 0 5px 12px rgba(0, 0, 0, .15);          
  --shadow-sticky:   0 2px 8px rgba(0, 0, 0, .08);           
  --shadow-sticky-lg:0 4px 24px rgba(0, 0, 0, .12);          
  --shadow-card:     0 14px 25px rgba(0, 0, 0, .16);         
  --ease-reveal: cubic-bezier(.15, .82, .43, 1);   
  --ease-ui:     cubic-bezier(.4, 0, .2, 1);       
  --ease-inout:  ease-in-out;                      
  --dur-hover:   100ms;       
  --dur-arrow:   200ms;       
  --dur-underline: 300ms;     
  --dur-drawer:  300ms;       
  --dur-lightbox:150ms;       
  --dur-reveal:  1200ms;      
  --delay-reveal:300ms;       
  --reveal-shift:10px;        
  --dur-accordion:200ms;      
  --dur-cue:     2500ms;      
  --dur-tile-zoom: 700ms;     
  --z-header:   900;
  --z-bar:      950;          
  --z-frame:   1000;          
  --z-scrim:   1010;
  --z-drawer:  1020;
  --z-lightbox:1100;
  --z-loader:  9999;          
  --texture-paper: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%236B1F2B' stroke-opacity='.05' stroke-width='1'%3E%3Cpath d='M32 8 36 28 56 32 36 36 32 56 28 36 8 32 28 28Z'/%3E%3Cpath d='M0 0 6 6M64 0 58 6M0 64 6 58M64 64 58 58'/%3E%3C/g%3E%3C/svg%3E");
  --texture-dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23D9AE5E' stroke-opacity='.08' stroke-width='1'%3E%3Cpath d='M32 8 36 28 56 32 36 36 32 56 28 36 8 32 28 28Z'/%3E%3Cpath d='M0 0 6 6M64 0 58 6M0 64 6 58M64 64 58 58'/%3E%3C/g%3E%3C/svg%3E");
  --gradient-footer: linear-gradient(-12deg, rgba(74, 52, 38, .55) 0%, rgba(0, 0, 0, 0) 100%);   
  --gradient-hero-top: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, var(--c-overlay-top) 100%); 
  --gradient-tile: linear-gradient(0deg, rgba(20, 12, 10, .78) 0%, rgba(20, 12, 10, .22) 62%, rgba(20, 12, 10, .05) 100%); 
  --brass: linear-gradient(135deg, #F0D391 0%, #C99A45 45%, #7E5A22 100%);
  --icon-arrow: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline fill='none' stroke='%23000' points='10 5 15 9.5 10 14'/%3E%3Cline fill='none' stroke='%23000' x1='4' y1='9.5' x2='15' y2='9.5'/%3E%3C/svg%3E");
}
@media (min-width: 640px) {
  :root {
    --gutter: 30px;                    
    --drawer-w: 350px;                 
  }
}
@media (min-width: 960px) {
  :root {
    --fs-h1: 3.45rem;                  
    --fs-h2: 2.2rem;                   
    --gutter: 40px;                    
    --frame: 20px;                     
    --section-gap: 70px;               
    --panel-pad: 70px;                 
    --tile-gap: 40px;                  
  }
}
@media (min-width: 1200px) {
  :root {
    --header-h: 112px;                 
    --header-h-stuck: 112px;           
  }
}
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-hover: 1ms;
    --dur-arrow: 1ms;
    --dur-underline: 1ms;
    --dur-drawer: 1ms;
    --dur-lightbox: 1ms;
    --dur-reveal: 1ms;
    --delay-reveal: 0ms;
    --reveal-shift: 0px;
    --dur-accordion: 1ms;
    --dur-cue: 1ms;
    --dur-tile-zoom: 1ms;
  }
}