
  html,body{margin:0;padding:0;background:#F9F6F1;}
  body{font-family:'Karla',sans-serif;color:#33403A;-webkit-font-smoothing:antialiased;}
  a{color:#1B3A2B;text-decoration:none;}
  a:hover{color:#E0507F;}
  html{scroll-behavior:smooth;}
  input,select{font-family:'Karla',sans-serif;}
  img,image-slot{max-width:100%;}
  /* ---- Tablet ---- */
  @container root (max-width:1100px){
    header{padding:14px 24px !important;gap:16px !important;}
    header nav{display:none !important;}
    .menu-btn{display:flex !important;}
    header + section{padding:0 24px 56px !important;min-height:620px !important;}
    header + section h1{font-size:46px !important;}
    #amenities{padding:64px 24px !important;}
    #amenities > img{display:none !important;}
    #amenities > div:nth-of-type(2){grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
    #villas{padding:64px 24px !important;}
    #villas > div{grid-template-columns:minmax(0,1fr) !important;gap:28px !important;}
    #villas > div:first-child > div:last-child{border-left:none !important;padding-left:0 !important;}
    #pool > div:nth-of-type(1){grid-template-columns:minmax(0,1fr) !important;padding:0 24px !important;gap:24px !important;}
    #pool > img{height:380px !important;}
    #pool > div:nth-of-type(3){padding:28px 24px 0 !important;}
    #courses{grid-template-columns:minmax(0,1fr) !important;padding:64px 24px !important;gap:32px !important;}
    #courses > div:nth-of-type(2){padding-right:0 !important;}
    #about{grid-template-columns:minmax(0,1fr) !important;padding:0 24px !important;gap:0 !important;}
    #about > img{display:none !important;}
    #about > div{padding:56px 0 28px !important;}
    #about image-slot{margin-right:0 !important;height:360px !important;margin-bottom:56px !important;}
    #location{grid-template-columns:minmax(0,1fr) !important;padding:64px 24px !important;gap:32px !important;}
    #gallery{padding:64px 24px 48px !important;}
    #reviews{padding:64px 24px !important;}
    #reviews > img{display:none !important;}
    #reviews > div:nth-of-type(1){grid-template-columns:minmax(0,1fr) !important;gap:32px !important;}
    #hosts{grid-template-columns:minmax(0,1fr) !important;padding:64px 24px !important;gap:32px !important;}
    #book{flex-direction:column !important;align-items:stretch !important;padding:56px 24px !important;gap:32px !important;min-height:0 !important;}
    #book > div:nth-of-type(2){max-width:520px !important;}
    .book-widget{position:relative !important;right:auto !important;top:auto !important;transform:none !important;width:100% !important;max-width:440px !important;}
    footer{padding:48px 24px 0 !important;}
    footer > div:first-child{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:36px !important;}
  }
  /* ---- Phone ---- */
  @container root (max-width:720px){
    header{padding:12px 14px !important;}
    header > div:last-child > a{display:none !important;}
    header > div:last-child{gap:0 !important;}
    header + section{padding:0 18px 44px !important;min-height:540px !important;}
    header + section h1{font-size:34px !important;}
    .hero-badge{display:none !important;}
    body h2{font-size:29px !important;}
    body h3{font-size:23px !important;}
    .cell{height:220px !important;}
    #amenities{padding:52px 18px !important;}
    #amenities > div:nth-of-type(2){grid-template-columns:minmax(0,1fr) !important;gap:16px !important;}
    #amenities > div:nth-of-type(2) > div{margin-top:0 !important;height:220px !important;}
    #villas{padding:52px 18px !important;}
    #villas > div{grid-template-columns:minmax(0,1fr) !important;}
    #villas > div > div:has(> div > img){grid-template-columns:repeat(2,minmax(0,1fr)) !important;grid-template-rows:auto !important;gap:12px !important;align-items:stretch !important;}
    #villas > div > div:has(> div > img) > div{grid-row:auto !important;grid-column:auto !important;height:180px !important;min-width:0 !important;}
    #villas > div > div:has(> div > img) > div:last-child:nth-child(odd){grid-column:1 / -1 !important;height:230px !important;}
    #pool{padding:56px 0 52px !important;}
    #pool > div:nth-of-type(1){padding:0 18px !important;}
    #pool > img{height:250px !important;}
    #pool > div:nth-of-type(2){grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
    #pool > div:nth-of-type(2) > div{border-right:none !important;padding:18px !important;}
    #pool > div:nth-of-type(3){grid-template-columns:minmax(0,1fr) !important;padding:24px 18px 0 !important;}
    #pool > div:nth-of-type(3) > div{height:230px !important;}
    #pool > div:nth-of-type(4){flex-wrap:wrap !important;justify-content:center !important;gap:10px 14px !important;padding:24px 18px 0 !important;text-align:center;}
    #courses{padding:52px 18px !important;}
    #courses > div:nth-of-type(2) > div:first-child{grid-template-columns:minmax(0,1fr) !important;}
    #about image-slot{height:260px !important;margin-bottom:44px !important;}
    #location{padding:52px 18px !important;}
    #gallery{padding:52px 18px 40px !important;}
    #gallery > div > div:nth-of-type(3){height:280px !important;}
    #gallery > div > div:nth-of-type(5){flex-wrap:wrap !important;}
    #gallery > div > div:nth-of-type(5) > button{flex:1 1 22% !important;height:48px !important;}
    #reviews{padding:52px 18px !important;}
    #reviews > div:nth-of-type(1) > div:nth-of-type(2){grid-template-columns:minmax(0,1fr) !important;}
    #hosts{padding:52px 18px !important;}
    #hosts image-slot{height:280px !important;width:100% !important;}
    #about image-slot{width:100% !important;}
    #hosts > div > div:nth-of-type(2){grid-template-columns:minmax(0,1fr) !important;gap:16px !important;}
    #book{padding:48px 18px !important;}
    .book-widget{box-sizing:border-box !important;width:100% !important;max-width:100% !important;padding:20px !important;}
    .book-widget > div{grid-template-columns:minmax(0,1fr) !important;}
    .book-widget input,.book-widget select{box-sizing:border-box !important;width:100% !important;max-width:100% !important;}
    #book > div:nth-of-type(3){flex-wrap:wrap !important;gap:20px !important;justify-content:flex-start !important;}
    footer{padding:40px 18px 0 !important;}
    footer > div:first-child{grid-template-columns:minmax(0,1fr) !important;gap:32px !important;}
    footer > div:last-child{flex-direction:column !important;align-items:flex-start !important;gap:8px !important;padding:16px 0 20px !important;}
    a[aria-label^="Chat"]{width:52px !important;height:52px !important;right:14px !important;bottom:14px !important;}
  }
