/* Homepage section 06 — "Guest reviews" (client mockup 1659 x 948, 2026-10-07).
   Art = the mockup with every word, the review text, avatar, arrows and dots removed (LaMa), the torn-paper card and shell kept as part of the picture,
   extended 70 mockup px each side by a smooth stretch so the photo reaches the screen edges, top/bottom dissolve into the paper (alpha baked in the file).
   Layout is in mockup pixels x --k, where the mockup's content span 105 -> 1566 (title edge -> right arrow edge) = hero rail -> hero right rail
   (170px / clamp(80px,8.947vw,170px) at >=901px). Type = the homepage system used by the sections above: Wondar title (PHA Bauer Bodoni name),
   Rollo accent (SP Accent Hand), Frutiger text (CSF News), Univers labels; sizes in --u (= 1px at a 1900px frame), same as the amenities / attractions heads.
   Below 1151px the art is dropped: watercolour wash behind the heading and a paper card (intro-v2/review-paper.webp) for the slider. */
.grv{--rail:170px;--navy:#073b57;--lead:#0b4b69;--sand:#917658;--kick:#2d4a61;position:relative;isolation:isolate;overflow:hidden;margin-top:60px;padding:0 0 30px;background:#faf6ef;color:var(--navy)}
.grv,.grv *,.grv *::before,.grv *::after{box-sizing:border-box}
.grv :where(h2,p,figure,blockquote,ul){margin:0}
.grv__frame{position:relative;max-width:1900px;margin-inline:auto;container-type:inline-size}
.grv__canvas{--k:calc((100cqw - 2 * var(--rail)) / 1461);--u:calc(min(100cqw,1900px) / 1900);position:relative;height:calc(948 * var(--k))}
.grv__art{position:absolute;z-index:0;left:calc(var(--rail) - 175 * var(--k));top:0;width:calc(1799 * var(--k));height:auto;max-width:none;display:block;pointer-events:none;user-select:none}
.grv__stage{position:absolute;z-index:1;inset:0 var(--rail)}

/* ---- heading block ---- */
/* the "What our guests say" label was removed (client); the heading stays where it was: top = old label top + its height + the old 24k gap */
.grv__intro{position:absolute;left:0;top:calc(269 * var(--k) + max(11px,calc(14.258 * var(--u))));width:calc(600 * var(--k))}
.grv__title{margin-top:0;color:var(--navy);font:400 calc(85.819 * var(--u))/calc(84.961 * var(--u)) "PHA Bauer Bodoni",Georgia,serif;letter-spacing:-.01em;white-space:nowrap}
.grv__title em{display:inline-block;color:var(--sand);font:400 1.1026em/.72 "SP Accent Hand",cursive;font-style:normal;letter-spacing:0}
.grv__sub{margin-top:calc(36 * var(--k));color:#52677a;font:400 max(11px,calc(14.258 * var(--u)))/1.2 "Univers Next",Arial,sans-serif;letter-spacing:.37em;text-transform:uppercase;white-space:nowrap}
.grv__rating{display:block;width:max-content;margin-top:calc(44 * var(--k));color:var(--lead);text-decoration:none}
.grv__score{display:flex;align-items:center;gap:calc(22 * var(--k))}
.grv__score b{color:#0a4a5e;font:400 calc(85.819 * var(--u))/1 "PHA Bauer Bodoni",Georgia,serif;letter-spacing:-.045em}
.grv__stars{color:#de8c01;font:400 calc(30 * var(--u))/1 "Univers Next","DejaVu Sans",Arial,sans-serif;letter-spacing:.09em;white-space:nowrap}
.grv__stars i{font-style:normal;color:transparent;background:linear-gradient(90deg,#de8c01 50%,#e6d9c3 50%);-webkit-background-clip:text;background-clip:text}
.grv__count{display:block;margin-top:calc(16 * var(--k));font:500 max(16px,calc(24 * var(--u)))/1.3 "CSF News",Georgia,serif;letter-spacing:-.012em;color:var(--lead)}
.grv__rating:focus-visible,.grv__arrow:focus-visible,.grv__dot:focus-visible,.grv__card:focus-visible{outline:3px solid #0b575b;outline-offset:5px}

/* ---- review card (paper is part of the art on desktop) ---- */
.grv__card{position:absolute;left:calc(607 * var(--k));top:calc(232 * var(--k));width:calc(776 * var(--k));height:calc(503 * var(--k));outline:none}
.grv__vp{position:absolute;left:calc(58 * var(--k));top:calc(68 * var(--k));width:calc(690 * var(--k));height:calc(400 * var(--k));overflow:hidden;touch-action:pan-y}
.grv__track{display:flex;height:100%;transition:transform .55s cubic-bezier(.4,.1,.2,1)}
.grv__slide{display:flex;flex:0 0 100%;flex-direction:column;justify-content:center;min-width:0;padding:0 calc(24 * var(--k)) 0 calc(25 * var(--k))}
.grv__mark{display:block;position:relative;height:calc(44 * var(--k));margin-bottom:calc(4 * var(--k));color:#b4976f;font:400 calc(285 * var(--u))/1 "PHA Bauer Bodoni",Georgia,serif;overflow:visible}
.grv__mark::before{content:"\201C";position:absolute;left:0;top:calc(-6 * var(--k));line-height:1}
.grv__quote p{max-width:calc(650 * var(--k));color:var(--navy);font:400 max(16px,calc(24 * var(--u)))/1.5 "CSF News",Georgia,serif;letter-spacing:-.012em}
.grv__by{display:flex;align-items:center;gap:calc(40 * var(--k));margin-top:calc(26 * var(--k))}
.grv__by img{display:block;flex:none;width:calc(90 * var(--k));height:calc(90 * var(--k));border-radius:50%;object-fit:cover;box-shadow:0 0 0 calc(3 * var(--k)) #fbf6ee,0 3px 10px #66513a30}
.grv__by b{display:block;color:var(--navy);font:500 max(15px,calc(22 * var(--u)))/1.2 "CSF News",Georgia,serif}
.grv__by small{display:block;margin-top:calc(7 * var(--k));color:#66727a;font:400 max(13px,calc(17.5 * var(--u)))/1.3 "CSF News",Georgia,serif}

/* ---- controls: arrows straddle the card edges, dots under it ---- */
.grv__nav{display:contents}
.grv__arrow{position:absolute;top:calc(445.5 * var(--k));width:max(44px,calc(63 * var(--k)));height:max(44px,calc(63 * var(--k)));margin-top:calc((63 * var(--k) - max(44px,calc(63 * var(--k)))) / 2);display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:#fff;color:#0b5154;box-shadow:0 4px 14px #1b50552b;cursor:pointer;transition:transform .2s ease}
.grv__arrow--prev{left:calc(518.5 * var(--k))}
.grv__arrow--next{left:calc(1397.7 * var(--k))}
.grv__arrow:hover{transform:scale(1.06)}
.grv__arrow svg{width:max(18px,calc(27 * var(--k)));height:auto;aspect-ratio:1;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.grv__dots{position:absolute;left:calc(984 * var(--k));top:calc(751 * var(--k));display:flex;align-items:center;gap:calc(17 * var(--k));transform:translateX(-50%)}
.grv__dot{position:relative;width:max(10px,calc(16 * var(--k)));height:max(10px,calc(16 * var(--k)));padding:0;border:0;border-radius:50%;background:#b2cddc;cursor:pointer}
.grv__dot.is-active{background:#0b5154}
.grv__dot::after{content:"";position:absolute;inset:-9px}

@media(min-width:1901px){.grv__art{-webkit-mask:linear-gradient(90deg,transparent,#000 90px,#000 calc(100% - 90px),transparent);mask:linear-gradient(90deg,transparent,#000 90px,#000 calc(100% - 90px),transparent)}}
@media(max-width:1450px){.grv{--rail:clamp(80px,8.947vw,170px)}}

/* ---- phones and tablets: heading, then the paper card; watercolour wash behind ---- */
@media(max-width:1150px){
 .grv{padding:190px 0 80px}
 .grv__canvas{height:auto}
 .grv__canvas::before{content:"";position:absolute;z-index:0;inset:-70px 0 -50px;background:url("../img/guest-reviews-v3/wash-m-700.webp?v=1") left top/cover no-repeat;pointer-events:none}
 .grv__art{display:none}
 .grv__stage{position:relative;inset:auto;padding:0 var(--rail)}
 .grv__intro{position:static;width:auto}
 .grv__title{margin-top:0;font-size:clamp(44px,12.4vw,84px);line-height:.99;white-space:normal}
 .grv__sub{margin-top:18px;font-size:12px;letter-spacing:.2em;white-space:normal;max-width:380px;line-height:1.7}
 .grv__rating{margin-top:26px}
 .grv__score{gap:18px}
 .grv__score b{font-size:clamp(56px,14vw,84px)}
 .grv__stars{font-size:clamp(22px,5.4vw,32px)}
 .grv__count{margin-top:6px;font-size:18px}
 .grv__card{position:relative;left:auto;top:auto;width:auto;height:auto;max-width:640px;margin-top:44px;padding:0;border:solid transparent;border-width:64px 26px 30px 64px;border-image:url("../img/intro-v2/review-paper.webp") 112 fill/64px 26px 30px 64px stretch;filter:drop-shadow(0 12px 12px #66513a26)}
 .grv__vp{position:static;width:auto;height:auto}
 .grv__track{height:auto;align-items:stretch}
 .grv__slide{justify-content:flex-start;padding:14px 4px 6px 0}
 .grv__mark{height:34px;margin:0 0 4px;font-size:110px}
 .grv__mark::before{top:-2px}
 .grv__quote p{max-width:none;font-size:18px;line-height:1.5}
 .grv__by{gap:16px;margin-top:20px}
 .grv__by img{width:60px;height:60px;box-shadow:0 0 0 2px #fbf6ee,0 3px 8px #66513a30}
 .grv__by b{font-size:18px}
 .grv__by small{margin-top:4px;font-size:14.5px}
 .grv__nav{display:flex;align-items:center;justify-content:space-between;max-width:640px;margin-top:22px}
 .grv__arrow{position:static;margin:0;width:48px;height:48px;flex:none}
 .grv__arrow svg{width:22px}
 .grv__dots{position:static;transform:none;gap:12px}
 .grv__dot{width:14px;height:14px}
}
@media(max-width:900px){.grv{--rail:24px}}
@media(prefers-reduced-motion:reduce){.grv__track,.grv__arrow{transition:none}}
