/* the new homepage (site/mods/home/tpl/home-new.html); colours that change with light/dark are in main.css and dark/main.css */
#hp-new{padding-top:66px;}
.hp-wrap{max-width:1130px;margin:0 auto;padding:0 16px;box-sizing:border-box;}
.hp-hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#0b1233 0%,#16205a 55%,#33205f 100%);color:#fff;padding:34px 0 46px;}
.hp-hero:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(1.5px 1.5px at 8% 20%,#fff,transparent),radial-gradient(1px 1px at 22% 72%,#ffe9a8,transparent),radial-gradient(1.5px 1.5px at 38% 16%,#fff,transparent),radial-gradient(1px 1px at 52% 60%,#fff,transparent),radial-gradient(1.5px 1.5px at 66% 86%,#ffe9a8,transparent),radial-gradient(1px 1px at 92% 40%,#fff,transparent);}
.hp-hero .hp-wrap{position:relative;}
.hp-hero h1{margin:0 0 14px;font:500 15px/20px 'PT Sans',sans-serif;color:#cfd6f0;}
.hp-hero h2{margin:0 0 6px;font:700 38px/44px Georgia,'Times New Roman',serif;color:#fff;}
.hp-hero h2 span{color:#f0cd6e;}
.hp-hero p{margin:0 0 18px;font-size:16px;color:#d9def2;}
.hp-cta{display:inline-block;padding:12px 26px;border-radius:24px;background:linear-gradient(135deg,#ffe08a 0%,#d9a53a 100%);color:#241a00!important;font-size:16px;font-weight:700;text-decoration:none;box-shadow:0 6px 18px rgba(217,165,58,.45);}
.hp-year{position:absolute;right:16px;top:50%;transform:translateY(-50%);font:800 112px/1 Georgia,'Times New Roman',serif;background:linear-gradient(180deg,#fff3c4 0%,#f0cd6e 45%,#b8862c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px rgba(240,205,110,.45));}
/* hero while the sea theme is on */
.hp-sea{background:linear-gradient(180deg,#d9f4fb 0%,#a4e4f0 55%,#5ccdd6 100%);color:#0b3c49;}
.hp-sea:before{display:none;}
.hp-sea h1,.hp-sea h2,.hp-sea p{color:#0b3c49;}
.hp-sea h2 span{color:#0b7f8c;}
.hp-sea .hp-cta{background:linear-gradient(135deg,#ff9a6b 0%,#f0574c 100%);color:#fff!important;box-shadow:0 6px 18px rgba(240,87,76,.4);}
.hp-sea .hp-year{background:none;color:#fff;filter:none;text-shadow:0 3px 14px rgba(12,110,130,.45);}

.hp-paths{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:-22px 0 14px;position:relative;}
.hp-paths a{display:block;padding:14px 12px;border-radius:14px;color:#fff;text-decoration:none;text-align:center;box-shadow:0 8px 20px rgba(0,0,0,.18);transition:transform .15s ease,box-shadow .15s ease;}
.hp-paths a:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(0,0,0,.25);}
.hp-paths i{display:block;font-style:normal;font-size:24px;line-height:30px;}
.hp-paths b{display:block;font-size:16px;color:#fff;}
.hp-paths span{font-size:12px;color:#fff;opacity:.92;}
.p-ny{background:linear-gradient(135deg,#1b2a63,#33205f);}
.p-xm{background:linear-gradient(135deg,#c0392b,#8e1f1f);}
.p-sea{background:linear-gradient(135deg,#2bb6d8,#1477b8);}
.p-spa{background:linear-gradient(135deg,#8e6bd8,#5c3fa8);}
.p-ski{background:linear-gradient(135deg,#5aa0e8,#2f6bb8);}
.p-ex{background:linear-gradient(135deg,#ff9a6b,#f0574c);}
.hp-trust{margin:0 0 26px;font-size:14px;text-align:center;}
.hp-trust a{color:#0b9a9a;font-weight:600;margin-left:10px;}
.hp-row{margin:0 0 26px;}
.hp-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;margin:0 0 12px;}
.hp-head h2{margin:0;font-size:22px;font-weight:600;}
.hp-head span{font-size:14px;}
.hp-head a{margin-left:auto;font-size:14px;font-weight:600;color:#0b9a9a;text-decoration:none;}
.hp-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.hp-cards .box-offer{display:block;width:auto!important;height:auto!important;margin:0!important;}
.hp-cards .offer{width:100%!important;height:auto!important;}
/* fixed like on the list pages where 4 cards fit in a row: the row must not move */
@media (min-width:1001px){.hp-cards .offer{height:345px!important;}.hp-cards .box-offer{height:350px!important;}}
@media (min-width:801px){
.hp-cards{align-items:start;}
.hp-cards .box-offer:hover{position:relative;z-index:5;}
/* the hover bar with the heart and search icons sits under the image, as on the list pages, in the place of the location line */
.hp-cards .offer:hover .day-big-info{margin-top:0;z-index:2;}
}
/* the list pages' hover pushes the text down (.more enters the flow) and grows the title: tuned for their card size, not for these */
.hp-cards .more{display:none!important;}
.hp-cards .offer:hover .offer-padding .h4,.hp-cards .offer .offer-padding .h4{height:60px!important;min-height:0!important;overflow:hidden!important;}
.hp-cards .box-offer:hover .hide-source{display:none!important;}
.hp-blog .bpost{float:none!important;width:auto!important;margin:0!important;padding:0!important;overflow:hidden;border:1px solid transparent;border-radius:10px;box-shadow:0 2px 8px rgba(0,0,0,.08);cursor:pointer;}
.hp-blog .bimage,.hp-blog .bcontent{float:none!important;width:auto!important;margin:0!important;padding:0!important;}
.hp-blog .bimage,.hp-blog .bimage img{display:block;width:100%!important;max-width:none!important;}
.hp-blog .bimage img{height:130px!important;margin:0!important;object-fit:cover;}
.hp-blog .bcontent{padding:10px 12px 12px!important;}
.hp-blog .btitle h2,.hp-blog .btitle h2 a{margin:0;font-size:16px!important;line-height:21px!important;}
.hp-posts{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
@media (max-width:1000px){.hp-paths{grid-template-columns:repeat(3,1fr);}.hp-cards,.hp-posts{grid-template-columns:repeat(2,1fr);}.hp-year{font-size:60px;}}
@media (max-width:800px){
#hp-new{padding-top:52px;}
.hp-hero{padding:20px 0 34px;}
.hp-hero h2{font-size:26px;line-height:31px;}
.hp-year{display:none;}
/* a plain vertical list; rows with a "Виж всички" link show only their first 2 offers, so the page stays short */
.hp-cards{display:block;}
.hp-cards .box-offer{margin:0 0 14px!important;}
.hp-cards:not(.hp-all) .box-offer:nth-child(n+3){display:none;}
.hp-cards .offer{height:auto!important;}
.hp-head a{margin-left:0;}
.hp-posts{grid-template-columns:1fr 1fr;}
}