/* Responsive values: one custom property per value the prototype switched on
   its Desktop/Mobile prop (index.html renderVals). Desktop first; the phone
   values apply at 760px and below. Generated once by the port, edited by hand since. */
:root{
  --ncBody:'Manrope','Helvetica Neue',Helvetica,Arial,sans-serif;
  --ncHeading:'Outfit','Helvetica Neue',Helvetica,Arial,sans-serif;
  --heroHeight:min(calc(100vh - 260px), 52vw); /* the 19 Oct export's value, restored (website fixes 3, Jacques, 21 Oct): the hero fills most of the first screen; the doors start below it */
  --heroFocus:50% 35%;
  --heroPad:200px 5% 48px; /* the 19 Oct export's value, restored (website fixes 3) */
  --heroGap:36px;
  --h1Size:clamp(36px, 4.2vw, 56px);
  --heroLeadSize:18px;
  --bojW:150px;
  --doorsPad:8px 5% 0;
  --doorsGap:8px;
  --doorRatio:16/9;
  --doorPad:20px 24px;
  --doorGap:10px;
  --doorLabel:12px;
  --doorTitle:22px;
  --arrowDisplay:block;
  --proteaLeft:min(-3%, calc(50% - 610px));
  --proteaTop:-4%;
  --proteaW:230px;
  --sageRight:min(-3%, calc(50% - 590px));
  --sageBottom:-10%;
  --sageW:210px;
  --introPad:88px 5% 80px;
  --h2Size:40px;
  --splitCols:1fr 1fr;
  --bandRatio:auto;
  --bandMinH:560px;
  --bandPad:72px 8%;
  --leafW:220px;
  --btnW:auto;
  --sectionPad:96px 5%;
  --deskBot:block;
  --splitGap:64px;
  --textOrder:1;
  --amenityCols:1fr 1fr;
  --petalW:340px;
  --roseW:300px;
  --gridHeadGap:32px;
  --venueCols:repeat(3,minmax(0,1fr));
  --pageHeroH:min(68vh, 46vw);
  --heroTitleGap:26px;
  --stayImgOrder:2;
  --peek:72px;
  --galDisplay:grid;
  --galW:auto;
  --menuCols:repeat(6,minmax(0,1fr));
  --enquiryCols:1fr 1.4fr;
  --cardPad:32px;
  --stripPad:96px;
  --confImgOrder:0;
  --imgOrder:1;
  --spaCols:repeat(4,minmax(0,1fr));
  --contactCols:repeat(4,minmax(0,1fr));
  --formCols:1fr 1fr;
  --menuPadTop:80px 5% 40px;
  --bookPad:72px 5% 112px;
  --legalPad:88px 5% 112px;
  --legalBoxPad:28px 32px 12px;
  --legalH2:26px;
  --clauseCols:44px minmax(0,1fr);
  --headPad:16px 5%;
  --markH:30px;
  --wordH:15px;
  --footPad:72px 5% 48px;
  --leafFootW:420px;
  --footCols:1.4fr .6fr .6fr;
  --bookRight:24px;
  --pillBottom:24px;
  --chatRight:124px;
}
@media (max-width: 760px){:root{
  --heroHeight:420px; /* was 480px: the home doors clear the pills on a 390×800 phone (website fixes, 21 Oct) */
  --heroFocus:38% 40%;
  --heroPad:160px 5% 28px;
  --heroGap:22px;
  --h1Size:34px;
  --heroLeadSize:15px;
  --bojW:110px;
  --doorsPad:6px 0 0;
  --doorsGap:4px;
  --doorRatio:3/4;
  --doorPad:10px 8px;
  --doorGap:6px;
  --doorLabel:11px;
  --doorTitle:15px;
  --arrowDisplay:none;
  --proteaLeft:-14%;
  --proteaTop:-40px;
  --proteaW:120px;
  --sageRight:-12%;
  --sageBottom:-40px;
  --sageW:100px;
  --introPad:40px 5% 32px;
  --h2Size:30px;
  --splitCols:minmax(0,1fr);
  --bandRatio:4/3;
  --bandMinH:0;
  --bandPad:32px 5% 40px;
  --leafW:140px;
  --btnW:100%;
  --sectionPad:40px 5%;
  --deskBot:none;
  --splitGap:24px;
  --textOrder:2;
  --amenityCols:1fr;
  --petalW:180px;
  --roseW:160px;
  --gridHeadGap:20px;
  --venueCols:1fr;
  --pageHeroH:420px;
  --heroTitleGap:18px;
  --stayImgOrder:1;
  --peek:0;
  --galDisplay:flex;
  --galW:220px;
  --menuCols:1fr 1fr;
  --enquiryCols:minmax(0,1fr);
  --cardPad:20px;
  --stripPad:40px;
  --confImgOrder:2;
  --imgOrder:2;
  --spaCols:1fr;
  --contactCols:1fr;
  --formCols:1fr;
  --menuPadTop:40px 5% 24px;
  --bookPad:32px 5% 56px;
  --legalPad:40px 5% 56px;
  --legalBoxPad:20px 18px 4px;
  --legalH2:22px;
  --clauseCols:36px minmax(0,1fr);
  --headPad:12px 5%;
  --markH:26px;
  --wordH:10px;
  --footPad:40px 5% 32px;
  --leafFootW:260px;
  --footCols:1fr;
  --bookRight:16px;
  --pillBottom:20px;
  --chatRight:110px;
}}

/* The drawers: a right-hand panel on desktop, a bottom sheet on a phone. */
.nc-drawer{top:0;right:0;bottom:0;width:min(600px,100%)}
@media (max-width: 760px){.nc-drawer{top:auto;left:0;right:0;width:100%;max-height:92vh}}
