/* @figma-style-guard ns:crd- */
/* =========================================================================
   Cost Rental Development page (An Tobar) — v4
   Structure reuses the theme's property-page classes (.banner.property-banner-inner,
   .cost-rental-intro/.two_column/.column_pic.dot_bg, .property-details, .eligibility-criteria,
   .mang_hm_accordian.faq_accrdian, .btn, .heading_blk, .orange) so the theme's own CSS styles them.
   This file only styles the Figma-specific behaviours the theme has no equivalent for.
   ========================================================================= */

/* Yellow CTA modifier on the theme .btn (Figma #ffcc00) */
.crd-btn-yellow{background-color:#ffcc00 !important;color:#000 !important;text-transform:none !important;}
.crd-btn-yellow:hover,.crd-btn-yellow:focus{background-color:#ffd633 !important;color:#000 !important;}

/* ---- Banner: yellow accent word + 7-icon quick-nav layered on the theme .short-info-list ---- */
.crd-banner .crd-accent{color:#ffcc00;}
/* theme pins .property-banner-inner to height:630px; let ours GROW so the wrapped quick-nav rows
   (3-per-row below 1200) stay inside the cover image instead of spilling past its bottom edge */
.crd-banner{height:auto;min-height:630px;}
.short-info-list.crd-quicknav{display:flex;justify-content:center;align-items:flex-start;gap:0;flex-wrap:wrap;margin-top:30px;}
.crd-quicknav .crd-quicknav__item{flex:1 1 0;min-width:120px;max-width:200px;position:relative;padding:0 10px;margin:0;}
.crd-quicknav .crd-quicknav__item + .crd-quicknav__item::before{content:"";position:absolute;left:0;top:6px;height:56px;width:1px;background:rgba(255,255,255,.5);}
.crd-quicknav .crd-quicknav__item a{display:flex;flex-direction:column;align-items:center;gap:12px;color:#fff;text-decoration:none;text-align:center;transition:transform .2s ease;}
.crd-quicknav .crd-quicknav__item a:hover{transform:translateY(-3px);}
.crd-quicknav .crd-quicknav__icon{width:48px;height:48px;object-fit:contain;}
.crd-quicknav .crd-quicknav__item span{font-size:18px;font-weight:500;line-height:1.2;}
.crd-quicknav .crd-quicknav__item a:hover span{color:#ffcc00;}
.crd-quicknav .crd-quicknav__item a:focus-visible{outline:2px solid #ffcc00;outline-offset:4px;}

/* Intro image uses the theme's native .column_pic.dot_bg treatment (amber #fedead ellipse arc +
   tilted-ellipse photo + dot texture), like /about-us/. The photo sits in a 1:1 box so the
   landscape image centre-crops to fill the circular frame without distortion (img is object-fit:cover). */
.cost-rental-intro .column_pic-inner{aspect-ratio:1/1;}
.cost-rental-intro .column_pic-inner img{object-position:center;}

/* ---- Property table: inline VR expand row (theme styles the table; this is the expandable panel) ---- */
.crd-table .crd-view{cursor:pointer;color:#c42a00;} /* 09/09/2026: the theme's #d82f02 sits at ~4.3:1 on the grey rows (axe serious);
   this shade of the same red clears 4.5:1 on grey and white. Hover stays the theme's black. */
.crd-vr-row td{padding:0 !important;border:0 !important;background:transparent !important;}
.crd-table__vr{position:relative;width:100%;padding:10px 0 20px;}
.crd-vr-frame{position:relative;width:100%;padding-top:40.39%;overflow:hidden;background:#000;border-radius:8px;}
.crd-vr-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.crd-vr-close{position:absolute;top:16px;right:8px;z-index:2;width:40px;height:40px;min-width:0;padding:0;border:0;border-radius:50%;
	background:#ffcc00;color:#000;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.crd-vr-close:hover{background:#ffd633;}

/* ---- Image gallery: slick thumbnail carousel + square clickable thumbs ---- */
.crd-gallery-section .heading_blk{margin-bottom:34px;}
.crd-gallery__tabs{display:flex;justify-content:center;gap:23px;margin-bottom:34px;flex-wrap:wrap;}
.crd-gtab{height:55px;border-radius:100px;border:.5px solid #444;background:transparent;color:#000;font-size:22px;font-weight:400;
	padding:0 40px;cursor:pointer;text-transform:none;transition:background .2s ease,transform .2s ease,box-shadow .2s ease;}
.crd-gtab.is-active{background:#ffcc00;border-color:#ffcc00;}
.crd-gtab:not(.is-active):hover{transform:translateY(-2px);box-shadow:0 6px 14px rgba(0,0,0,.12);}
.crd-gtab:focus-visible{outline:3px solid #ffcc00;outline-offset:2px;}
.crd-gpanel{display:none;}
.crd-gpanel.is-active{display:block;animation:crdFadeIn .28s ease;}
.crd-slide{padding:0 10px;}
/* thumbnails: consistent square box, NO hover animation or yellow bg (it's a <button>, so reset the theme .btn hover) */
.crd-thumb{display:block;width:100%;min-width:0;aspect-ratio:1/1;border:.5px solid #ddd;border-radius:12px;overflow:hidden;background:#fff !important;padding:0;cursor:pointer;transition:none;}
.crd-thumb img{width:100%;height:100%;object-fit:contain;display:block;}
.crd-thumb--photo img{object-fit:cover;}
.crd-thumb:hover,.crd-thumb:focus{background:#fff !important;color:inherit;transform:none;box-shadow:none;}
.crd-thumb:focus-visible{outline:3px solid #ffcc00;outline-offset:2px;}
/* slick arrows (mirror the theme case-studies chevrons) */
.crd-carousel .slick-prev,.crd-carousel .slick-next{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:48px;height:48px;
	border:0;border-radius:50%;background:#000;color:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.crd-carousel .slick-prev{left:-58px;}
.crd-carousel .slick-next{right:-58px;}
.crd-carousel .slick-prev:hover,.crd-carousel .slick-next:hover{background:#d82f02;}
.crd-carousel .slick-prev:focus-visible,.crd-carousel .slick-next:focus-visible{outline:3px solid #ffcc00;outline-offset:2px;}
@media (max-width:1500px){.crd-carousel .slick-prev{left:-8px;}.crd-carousel .slick-next{right:-8px;}}

/* ---- Apply banner (short) -> scroll to eligibility. Solid dark by default; a photo is optional. ---- */
.crd-apply{position:relative;min-height:280px;background-color:#2a2a2a;background-size:cover;background-position:center 90%;padding:88px 0;overflow:hidden;}
.crd-apply__overlay{position:absolute;inset:0;background:rgba(42,42,42,.8);}
.crd-apply__inner{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:60px;}
.crd-apply__text{font-size:40px;font-weight:700;color:#fff;line-height:1.3;max-width:786px;margin:0;}
.crd-apply__text span{color:#ffcc00;}

/* ---- Building standards: open Internal Finishes by default (theme handles toggle) ---- */
.crd-standards .accordion-list > li.active > .answer{display:block;}

/* ---- Amenities: two accordion columns ---- */
.crd-amen__row{display:flex;gap:38px;align-items:flex-start;}
.crd-amen__col{flex:1 1 0;min-width:0;}
.crd-amen .accordion-list .answer .crd-cols{display:flex;gap:40px;flex-wrap:wrap;}
.crd-amen .accordion-list .answer .crd-cols ul{flex:1 1 200px;}

/* Local Amenities: single-<ul> columns. Left column = two-per-row (50% li), right column =
   full-width (100% li). ~12px left/right gutter per item; the theme red check icon is nudged in. */
.crd-amen .crd-amen__col:first-child .answer ul{display:flex;flex-wrap:wrap;}
.crd-amen .crd-amen__col:first-child .answer ul li{width:50%;}
.crd-amen .crd-amen__col:last-child .answer ul li{width:100%;}
.crd-amen .crd-amen__col .answer ul li{box-sizing:border-box;padding-left:47px;padding-right:12px;}
.crd-amen .crd-amen__col .answer ul li:before{left:12px;}

/* Cost Rental accordions: keep the theme's own answer-panel indent so the body lines up
   under its accordion title. The theme moves the trigger and the answer together at every
   breakpoint (82 / 70 / 60px), so overriding padding-left here pulled the list out of line. */
.crd-standards .accordion-list > li .answer,
.crd-amen .accordion-list > li .answer{padding-right:20px;}

/* ---- Eligibility: dark section (Figma) — restore the theme's .white-txt heading colour that
       .new-inner .heading_blk h2 (red, for the light-grey variant) otherwise overrides ---- */
.crd-elig.white-txt .heading_blk h2{color:#fff;}
.crd-elig .crd-elig__terms{margin-top:20px;}
.crd-elig .button-row{margin-top:30px;}

/* ---- Map (Google embed) ---- */
.crd-map{width:100%;}
.crd-map__embed,.crd-map__embed iframe{display:block;width:100%;border:0;}
.crd-map__embed iframe{height:600px;}
.crd-map__img{width:100%;height:600px;background-size:cover;background-position:center;}

/* =========================== MODALS (bespoke) ======================== */
.crd-modal{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:20px;}
.crd-modal[hidden]{display:none;}
.crd-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.6);opacity:0;transition:opacity .22s ease;}
.crd-modal__box{position:relative;background:#fff;border-radius:20px;width:100%;max-width:1420px;max-height:92vh;overflow:auto;
	box-shadow:0 20px 60px rgba(0,0,0,.35);opacity:0;transform:translateY(14px) scale(.985);transition:opacity .24s ease,transform .24s ease;}
.crd-modal.crd-modal--in .crd-modal__backdrop{opacity:1;}
.crd-modal.crd-modal--in .crd-modal__box,.crd-modal.crd-modal--in .crd-eligmodal__box{opacity:1;transform:none;}
body.crd-modal-open{overflow:hidden;}
/* eligibility apply pop-up */
.crd-eligmodal{align-items:flex-start;}
.crd-eligmodal__box{position:relative;background:#d82f02;border-radius:20px;width:679px;max-width:100%;
	margin-top:clamp(100px,calc(55.5vh - 20px),580px);padding:52px 64px;min-height:200px;text-align:center;
	opacity:0;transform:translateY(14px) scale(.985);transition:opacity .24s ease,transform .24s ease;}
.crd-eligmodal__box p{color:#fff;font-size:20px;font-weight:700;line-height:30px;letter-spacing:1px;max-width:550px;margin:0 auto;}
.crd-eligmodal__actions{margin-top:24px;display:flex;gap:16px;justify-content:center;align-items:center;}
.crd-eligmodal__cancel{background:none;border:0;color:#fff;text-decoration:underline;cursor:pointer;font-size:16px;text-transform:none;min-width:0;padding:0;}
/* floor plan modal */
.crd-fpmodal .crd-modal__box{width:1400px;max-width:1400px;overflow:visible;}
.crd-fpmodal__head{position:relative;background:#000;color:#fff;height:112px;display:flex;align-items:center;justify-content:center;border-radius:20px 20px 0 0;}
.crd-fpmodal__head h2{font-size:32px;font-weight:700;color:#fff;margin:0;}
.crd-modal__close{position:absolute;top:0;right:-20px;width:53px;height:53px;min-width:0;padding:0;flex:0 0 auto;display:flex;align-items:center;justify-content:center;
	line-height:1;border-radius:50%;background:#ffcc00;border:0;color:#000;font-size:20px;cursor:pointer;}
.crd-modal__close:hover{background:#ffd633;}
.crd-fpmodal__body{display:flex;align-items:stretch;overflow-y:auto;max-height:calc(92vh - 112px);border-radius:0 0 20px 20px;}
.crd-fpmodal__side{flex:0 0 563px;background:#f7f7f5;padding-top:59px;}
.crd-fptab{display:flex;flex-direction:column;justify-content:center;width:100%;height:123px;text-align:left;padding:0 40px 0 110px;
	background:none;border:0;border-radius:0;text-transform:none;cursor:pointer;position:relative;min-width:0;transition:background .2s ease;}
.crd-fptab:not(.is-active)::after{content:"";position:absolute;left:19px;right:0;bottom:0;height:1px;background:#e5e5e2;}
.crd-fptab:not(.is-active):hover{background:#efefec;}
.crd-fptab.is-active{background:#ffcc00;height:137px;}
.crd-fptab.is-active::after{content:"";position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:0;height:0;border:21px solid transparent;border-left:20px solid #ffcc00;border-right:0;}
.crd-fptab__title{display:block;font-size:24px;font-weight:400;letter-spacing:1.2px;line-height:30px;text-transform:uppercase;color:#000;}
.crd-fptab.is-active .crd-fptab__title{font-weight:700;}
.crd-fptab__size{display:block;font-size:18px;font-weight:400;letter-spacing:.9px;color:#000;margin-top:14px;}
.crd-fpmodal__content{flex:1;padding:80px 96px 100px;}
.crd-fppanel{display:none;}
.crd-fppanel.is-active{display:block;animation:crdFadeIn .28s ease;}
.crd-fppanel__title{font-size:36px;font-weight:700;color:#444;margin:0;}
.crd-fppanel__title span{color:#d82f02;}
.crd-fppanel__desc{font-size:18px;color:#444;line-height:26px;letter-spacing:.9px;margin-top:24px;}
.crd-fppanel__img{position:relative;width:646px;max-width:100%;height:408px;border:1px solid #c7c7c7;margin-top:44px;padding:24px;
	display:flex;align-items:center;justify-content:center;cursor:zoom-in;background:#fff;}
.crd-fppanel__img img{max-height:100%;max-width:100%;width:auto;display:block;margin:0 auto;pointer-events:none;}
.crd-fppanel__zoom{position:absolute;right:8px;bottom:8px;color:#444;font-size:17px;pointer-events:none;}
.crd-fppanel__img:focus-visible{outline:3px solid #ffcc00;outline-offset:2px;}
.crd-fppanel__features{list-style:none;margin:68px 0 0;padding:0;display:flex;flex-direction:column;gap:14px;}
.crd-fppanel__features li{display:flex;gap:12px;align-items:flex-start;font-size:18px;color:#000;line-height:26px;letter-spacing:.9px;}
.crd-fppanel__features i{color:#d82f02;margin-top:5px;font-size:15px;}
.crd-fppanel__note{margin-top:54px;font-size:18px;color:#000;line-height:26px;letter-spacing:.9px;}
.crd-fppanel__note strong{color:#d82f02;}
/* lightbox */
.crd-lightbox{z-index:100000;}
.crd-lightbox__box{background:transparent;box-shadow:none;max-width:1100px;width:auto;overflow:visible;}
.crd-lightbox__box img{max-width:100%;max-height:86vh;display:block;border-radius:8px;}
.crd-lightbox .crd-modal__close{top:-22px;right:-22px;}

/* ===================== DESIGN-TEAM REFINEMENTS ===================== */
/* P11 — standardise headings: #444 base + red accent word (was fully red via .new-inner .heading_blk h2) */
.cost-rental-intro .heading_blk h2,.crd-gallery-section .heading_blk h2,
.crd-standards .heading_blk h2,.crd-amen .heading_blk h2{color:#444;}
.cost-rental-intro .heading_blk h2 .orange,.crd-gallery-section .heading_blk h2 .orange,
.crd-standards .heading_blk h2 .orange,.crd-amen .heading_blk h2 .orange{color:#d82f02;}

/* P1 — banner quick-nav: even spacing + centred separator lines between items */
.short-info-list.crd-quicknav{display:flex;justify-content:center;align-items:flex-start;gap:0;flex-wrap:nowrap;margin-top:30px;max-width:1100px;margin-left:auto;margin-right:auto;}
.crd-quicknav .crd-quicknav__item{flex:1 1 0;min-width:0;max-width:none;position:relative;padding:0 14px;margin:0;}
.crd-quicknav .crd-quicknav__item + .crd-quicknav__item::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);height:52px;width:1px;background:rgba(255,255,255,.45);}

/* Hero icons (desktop row): remove the vertical separator lines between the icons and widen
   the horizontal spacing. Scoped to >900px so the tablet/mobile column layouts are unaffected. */
@media (min-width:901px){
	.short-info-list.crd-quicknav{gap:36px;}
	.crd-quicknav .crd-quicknav__item + .crd-quicknav__item::before{content:none;}
}

/* The other separator source is the theme's own .short-info-list .info-box:after (white 1px line).
   Remove it for the hero icons only (all breakpoints); other pages' .short-info-list keeps its dividers. */
.short-info-list.crd-quicknav .info-box:after{content:none;}

/* P3 — alternate table data rows: every 2nd data row white (the interleaved hidden VR rows broke nth-child) */
.crd-table .crd-trow--white td{background-color:#fff !important;}
/* 09/09/2026: the theme's own `.property-details tbody tr:nth-child(even) td{background:#fff}` still counted the
   hidden VR rows, so a grey data row that landed on an even DOM position went white too (two whites in a row
   as soon as a unit had a Matterport link). Striping is now class-driven only: grey rows are forced back to
   transparent so the wrapper's grey shows through, whatever their DOM position. */
.crd-table .crd-trow:not(.crd-trow--white) td{background-color:transparent !important;}

/* P8 — Building Standards background #F7F7F5 */
.crd-standards.faqs-section{background-color:#f7f7f5;}

/* P6 — no horizontal scrollbar inside pop-ups */
.crd-modal__box{overflow-x:hidden;}
.crd-fpmodal__body{overflow-x:hidden;}
.crd-lightbox__box{overflow:visible;}

/* P10 — eligibility Apply pop-up: close button with a background */
.crd-eligmodal__box{padding-top:60px;}
.crd-eligmodal__close{position:absolute;top:14px;right:14px;width:38px;height:38px;min-width:0;padding:0;transform:none;
	display:flex;align-items:center;justify-content:center;border-radius:50%;background:#ffcc00;border:0;color:#000;font-size:16px;cursor:pointer;line-height:1;}
.crd-eligmodal__close:hover{background:#ffd633;}

/* P7 — gallery tabs -> mobile accordion. Desktop keeps the tab bar; the per-panel accordion header is hidden. */
.crd-gacc-header{display:none;}
.crd-gacc-body{display:block;}
/* P7 — same accordion inside the floor-plan pop-up: the per-unit header is desktop-hidden, shown on mobile. */
.crd-fpacc-header{display:none;}
.crd-fpacc-body{display:block;}

@keyframes crdFadeIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){
	.crd-quicknav .crd-quicknav__item a,.crd-gtab,.crd-thumb,.crd-modal__backdrop,.crd-modal__box,.crd-eligmodal__box{transition:none;}
	.crd-quicknav .crd-quicknav__item a:hover,.crd-gtab:not(.is-active):hover,.crd-thumb:hover{transform:none;}
	.crd-gpanel.is-active,.crd-fppanel.is-active{animation:none;}
	.crd-modal__box,.crd-eligmodal__box{opacity:1;transform:none;}.crd-modal__backdrop{opacity:1;}
}

/* =========================== RESPONSIVE ============================= */
@media (max-width:1200px){
	.crd-apply__text{font-size:32px;}
	.crd-fpmodal .crd-modal__box{width:auto;max-width:96vw;}
	.crd-fpmodal__side{flex-basis:420px;}
	.crd-fptab{padding-left:60px;}
	.crd-fpmodal__content{padding:56px 64px 72px;}
}
@media (max-width:900px){
	/* P7 — gallery becomes an accordion on mobile: hide the tab bar, show every panel with a +/- header */
	.crd-gallery__tabs{display:none;}
	.crd-gpanel{display:block !important;border-bottom:1px solid #e5e5e2;}
	.crd-gacc-header{display:flex;align-items:center;justify-content:space-between;width:100%;min-width:0;padding:18px 6px;
		background:none;border:0;text-transform:none;color:#000;font-size:20px;font-weight:600;cursor:pointer;text-align:left;}
	.crd-gacc-header i{color:#d82f02;font-size:18px;}
	.crd-gacc-body{display:none;padding-bottom:16px;}
	.crd-gpanel.is-active .crd-gacc-body{display:block;}
	.crd-gpanel.is-active .crd-gacc-header{color:#d82f02;}
	.crd-amen__row{flex-direction:column;}
	.crd-amen__col{width:100%;}
	.crd-apply__inner{flex-direction:column;align-items:flex-start;gap:24px;}
	.crd-apply__text{font-size:28px;line-height:1.2;}
	.crd-fpmodal__body{flex-direction:column;}
	/* P7 — floor-plan pop-up becomes an accordion on mobile: drop the tab sidebar, turn each panel into a +/- item */
	.crd-fpmodal__side{display:none;}
	.crd-fpmodal__content{flex:1 1 auto;padding:0 24px 24px;}
	.crd-fppanel{display:block !important;border-bottom:1px solid #e5e5e2;animation:none;}
	.crd-fppanel:last-child{border-bottom:0;}
	.crd-fpacc-header{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-width:0;
		padding:18px 2px;background:none;border:0;text-transform:none;color:#000;font-size:19px;font-weight:600;cursor:pointer;text-align:left;line-height:1.25;}
	.crd-fpacc-header span{display:block;}
	.crd-fpacc-header em{display:block;font-size:15px;font-weight:400;font-style:normal;color:#555;letter-spacing:.6px;margin-top:4px;}
	.crd-fpacc-header i{color:#d82f02;font-size:18px;flex:0 0 auto;}
	.crd-fppanel.is-active .crd-fpacc-header{color:#d82f02;}
	.crd-fpacc-body{display:none;padding-bottom:20px;}
	.crd-fppanel.is-active .crd-fpacc-body{display:block;}
	.crd-fpacc-body .crd-fppanel__title{display:none;} /* the accordion header already names the unit */
	.crd-fpacc-body .crd-fppanel__desc{margin-top:0;}
	.crd-fppanel__img{width:100%;height:auto;min-height:280px;}
	.crd-modal__close{right:0;}
}
@media (max-width:600px){
	.crd-quicknav .crd-quicknav__item span{font-size:15px;}
	.crd-apply__text{font-size:24px;}
}

/* ===================== CLIENT FEEDBACK (round 2) ===================== */
/* #5 — gallery lightbox: prev/next controls (arrow keys wired in JS). Shown only for a multi-image group. */
.crd-lightbox__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:54px;height:54px;min-width:0;padding:0;border:0;border-radius:50%;
	background:rgba(0,0,0,.55);color:#fff;font-size:20px;cursor:pointer;align-items:center;justify-content:center;transition:background .2s ease;}
.crd-lightbox__nav{display:none;}                 /* JS reveals it (flex) when the group has >1 image */
.crd-lightbox__nav:hover{background:#d82f02;}
.crd-lightbox__nav:focus-visible{outline:3px solid #ffcc00;outline-offset:2px;}
.crd-lightbox__prev{left:-74px;}
.crd-lightbox__next{right:-74px;}

/* #6 — specifications table: the theme forces a 1210px-wide table + horizontal scroll at <=1199px.
   Override for OUR table so it fits the viewport; below 768px each row stacks into label:value cards. */
@media (max-width:1199px){
	.crd-table.property-details{overflow:visible;}
	.crd-table table{width:100% !important;}
}
/* Below 900px the 5-column table is cramped (iPad portrait = 768) — stack each row into a labelled card. */
@media (max-width:900px){
	.crd-table.property-details{overflow:visible;padding:0;background:transparent;}
	.crd-table table{width:100% !important;display:block;}
	.crd-table thead{display:none;}
	.crd-table tbody{display:block;border-radius:0;}
	.crd-table tbody tr.crd-trow{display:block;background:rgba(217,217,217,.4);border-radius:16px;margin-bottom:14px;padding:6px 20px;}
	.crd-table tbody tr.crd-trow--white{background:#fff;border:1px solid #ececec;}
	.crd-table tbody tr.crd-trow td{display:flex;justify-content:space-between;align-items:center;gap:16px;text-align:right;
		width:auto !important;padding:12px 0 !important;border-radius:0 !important;border-bottom:1px solid rgba(0,0,0,.08);
		background:transparent !important;font-size:16px;letter-spacing:.4px;}
	.crd-table tbody tr.crd-trow td:last-child{border-bottom:0;}
	.crd-table tbody tr.crd-trow td:before{content:attr(data-label);font-weight:700;color:#444;font-size:14px;letter-spacing:.5px;text-align:left;flex:0 0 auto;}
	.crd-table tbody tr.crd-trow td.crd-td-empty{display:none;}
	/* Virtual Tour cell -> full-width tappable button. The fixed UserWay accessibility widget floats at the
	   right edge (~44px) and was covering the small right-aligned "View" link; a full-width button keeps ~90%
	   of the tap target clear of it. */
	/* 26/08/2026: scoped to cells that actually hold the tour link. Applied to every last cell it
	   also stacked ordinary values (Cost Rent) onto their own line, out of line with the rows above. */
	.crd-table tbody tr.crd-trow td:last-child:has(.crd-view){flex-direction:column;align-items:stretch;gap:10px;}
	.crd-table tbody tr.crd-trow td:last-child:before{text-align:left;}
	.crd-table tbody tr.crd-trow td:last-child .crd-view{display:block;width:100%;text-align:center;padding:13px 12px;
		border:1.5px solid #c42a00;border-radius:8px;color:#c42a00;text-decoration:none;font-weight:700;} /* #c42a00: 4.5:1 on the grey card (09/09/2026) */
	.crd-table tbody tr.crd-trow td:last-child .crd-view:hover,.crd-table tbody tr.crd-trow td:last-child .crd-view:focus{background:#d82f02;color:#fff;}
	/* the expandable Virtual Tour panel spans the full card width — but only once opened (JS clears [hidden]);
	   :not([hidden]) stops the collapsed rows rendering as empty black boxes between cards.
	   width:100% !important overrides the theme's td:first-child{width:30%} that otherwise collapses it to ~108px. */
	.crd-table tbody tr.crd-vr-row:not([hidden]){display:block;width:100%;}
	.crd-table tbody tr.crd-vr-row td{display:block;width:100% !important;padding:0 0 16px !important;background:transparent !important;}
	.crd-table tbody tr.crd-vr-row td:before{content:none;}
	.crd-table tbody tr.crd-vr-row .crd-vr-frame{min-height:220px;}
}
/* mobile: pull the lightbox arrows inside the viewport */
@media (max-width:900px){
	.crd-lightbox__prev{left:8px;background:rgba(0,0,0,.7);}
	.crd-lightbox__next{right:8px;background:rgba(0,0,0,.7);}
}

/* ===================== CLIENT FEEDBACK (round 3 — design build) ===================== */

/* #1 — Apply / STATUS banner: status tag + per-status colour treatment.
   Base .crd-apply (image band + dark overlay) already defined above. */
.crd-apply__msg{max-width:840px;}
.crd-apply__tag{display:inline-block;margin-bottom:16px;padding:7px 20px;border-radius:100px;
	font-size:14px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;background:#ffcc00;color:#000;}
.crd-apply--closing_soon .crd-apply__tag{background:#d82f02;color:#fff;}
.crd-apply--upcoming .crd-apply__tag{background:#ffcc00;color:#000;}
/* White on #8a8a8a is only ~3.4:1, under the 4.5:1 threshold. A light pill on the dark band reads
   clearly and matches how the Launching soon tag is treated. */
.crd-apply--closed .crd-apply__tag{background:#e8e8e8;color:#333;}
.crd-apply--closed .crd-apply__overlay{background:rgba(28,28,28,.88);}
.crd-apply--closed .crd-apply__text,.crd-apply--closed .crd-apply__text span{color:#e8e8e8;}
.crd-apply--upcoming .crd-apply__overlay{background:rgba(42,42,42,.82);}
/* solid-band status colour when no photo is set (crd-apply--photo absent): closed reads muted grey */
.crd-apply--closed:not(.crd-apply--photo){background-color:#565656;}

/* #2 — "What's on offer" summary panel beside the intro (dark card, brand-accent ticks).
   .crd-intro-row--offer only applies when the panel is on; otherwise the theme two_column is untouched. */
.crd-intro-row--offer{gap:56px;align-items:flex-start;}
.crd-intro-row--offer .crd-intro-text{flex:1 1 58%;min-width:0;}
.crd-offer{flex:0 0 358px;max-width:358px;align-self:flex-start;background:#2a2a2a;color:#fff;border-radius:20px;padding:40px 38px;}
.crd-offer__title{font-size:26px;font-weight:700;color:#fff;margin:0 0 22px;line-height:1.25;}
.crd-offer__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px;}
.crd-offer__list li{display:flex;gap:13px;align-items:flex-start;font-size:18px;line-height:1.35;color:#fff;}
.crd-offer__list li i{margin-top:4px;font-size:14px;color:#ffcc00;flex:0 0 auto;}
.crd-offer__note{margin:24px 0 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.16);font-size:14px;color:rgba(255,255,255,.82);line-height:1.45;}

/* #3 — Applicant notices / disclaimers callout (amber-tinted, highly visible) */
.crd-notices{margin-top:34px;background:#fff4d6;border-left:4px solid #ffcc00;border-radius:10px;padding:22px 26px;}
.crd-notices__title{margin:0 0 12px;font-weight:700;font-size:18px;color:#333;display:flex;align-items:center;gap:10px;}
.crd-notices__title i{color:#d82f02;}
.crd-notices__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
.crd-notices__list li{display:flex;gap:12px;align-items:flex-start;font-size:16px;line-height:1.4;color:#333;}
.crd-notices__list li i{margin-top:3px;color:#d82f02;flex:0 0 auto;width:18px;text-align:center;}

/* #4 — Application journey: numbered step strip */
.crd-journey{background:#f7f7f5;}
.crd-journey__steps{list-style:none;margin:52px 0 0;padding:0;display:flex;gap:28px;}
.crd-journey__step{flex:1 1 0;min-width:0;position:relative;background:#fff;border-radius:16px;padding:38px 26px 30px;text-align:center;box-shadow:0 8px 24px rgba(0,0,0,.06);}
.crd-journey__num{position:absolute;top:-20px;left:50%;transform:translateX(-50%);width:44px;height:44px;border-radius:50%;
	background:#d82f02;color:#fff;font-size:20px;font-weight:700;display:flex;align-items:center;justify-content:center;}
.crd-journey__icon{display:inline-flex;align-items:center;justify-content:center;width:66px;height:66px;border-radius:50%;
	background:#fff4d6;color:#d82f02;font-size:25px;margin:16px 0 18px;}
.crd-journey__step-title{font-size:20px;font-weight:700;color:#444;margin:0 0 10px;}
.crd-journey__step-text{font-size:16px;line-height:1.5;color:#555;margin:0;}
.crd-journey__step:not(:last-child):after{content:"";position:absolute;top:64px;right:-28px;width:28px;height:2px;background:#e0ddd6;z-index:1;}

/* ---- round-3 responsive ---- */
@media (max-width:900px){
	.crd-intro-row--offer{flex-direction:column;}
	.crd-intro-row--offer .crd-intro-text{flex-basis:auto;width:100%;}
	.crd-offer{flex-basis:auto;max-width:none;width:100%;}
	/* journey: 2-up on tablet (avoids whitespace-heavy full-width cards), 1-up on phones */
	.crd-journey__steps{flex-wrap:wrap;gap:40px 24px;}
	.crd-journey__step{flex:0 0 calc(50% - 12px);padding:34px 24px 26px;}
	.crd-journey__step:not(:last-child):after{display:none;}
	.crd-apply__text{font-size:26px;}
	.crd-apply__msg{max-width:none;}
}
@media (max-width:600px){
	.crd-journey__steps{flex-direction:column;gap:40px;}
	.crd-journey__step{flex-basis:auto;width:100%;}
	.crd-offer{padding:32px 26px;}
	.crd-apply__tag{font-size:13px;padding:6px 16px;}
}

/* ---- Quick-nav layout (fix): 7 icons in one row on wide desktop; wrap to 3-per-row below 1200 so the
        right-hand icons never clip past the hero image (they overflowed ~950-1200px), 2-per-row on phones. ---- */
@media (max-width:1200px){
	.crd-banner{padding-bottom:28px;}
	.short-info-list.crd-quicknav{flex-wrap:wrap;gap:26px 0;max-width:760px;}
	.crd-quicknav .crd-quicknav__item{flex:0 0 33.333%;max-width:none;}
	.crd-quicknav .crd-quicknav__item + .crd-quicknav__item::before{content:none;}
}
@media (max-width:600px){
	.short-info-list.crd-quicknav{max-width:440px;gap:24px 0;}
	.crd-quicknav .crd-quicknav__item{flex:0 0 50%;}
}

/* =========== FLOOR-PLAN POP-UP: many-unit developments ==============
   An Tobar has 5 plan types; Grange Oaks has 11. Once the unit list is taller than the pop-up the
   whole body scrolled together, so selecting a unit low in the list left you looking at blank space
   beside it. Pin the list to the top of the scrolling body and give it its own scroll instead.
   Desktop only: at <=900px the side list is hidden and each unit becomes a +/- accordion. */
@media (min-width:901px){
	.crd-fpmodal__side{align-self:flex-start;position:sticky;top:0;
		min-height:calc(92vh - 112px);max-height:calc(92vh - 112px);
		overflow-y:auto;overscroll-behavior:contain;}
}

/* The notices callout sits inside the theme's .about_blk, which stamps a red tick ::before on every
   list item. A "Please note" list already carries its own meaning-bearing icon, and a tick reads as a
   positive, so drop the inherited one. */
.crd-notices__list li:before{content:none;display:none;}


/* ==========================================================================
   26/08/2026 - client review fixes (Blessington Demesne / Balmoston)
   ========================================================================== */

/* Eligibility pop-up "Cancel": the theme has a global `button:hover` that paints ANY button
   amber with near-black text, so on the red pop-up this read as a broken box. Give it a
   proper secondary-button appearance in every state, and a focus ring that stays legible. */
.crd-eligmodal__cancel{background:transparent;border:2px solid #fff;color:#fff;border-radius:30px;
	padding:20px 34px;font-size:16px;font-weight:700;line-height:1.2;text-decoration:none;
	min-width:0;text-transform:none;transition:background .2s ease,color .2s ease;}
.crd-eligmodal__cancel:hover,.crd-eligmodal__cancel:focus{background:#fff;color:#d82f02;border-color:#fff;}
.crd-eligmodal__cancel:focus-visible{outline:3px solid #ffcc00;outline-offset:3px;}

/* No dead space under the last accordion item: the theme adds 50px below the accordion
   wrapper (30px on mobile) and the last item keeps its own 15px gap, which together left
   an empty band before the next section. */
.crd-standards .mang_hm_accordian,.crd-amen .mang_hm_accordian{padding-bottom:0;}
.crd-standards .accordion-list > li:last-child,
.crd-amen .accordion-list > li:last-child{margin-bottom:0;}
/* An accordion ends on a card edge, which already carries visual weight, so it needs less
   breathing room beneath it than a block of text. Every section on the page runs 100px top
   and bottom; these two close at 60px so the run into the next section is not a dead band. */
.crd-standards,.crd-amen{padding-bottom:60px;}
@media (max-width:767.98px){.crd-standards,.crd-amen{padding-bottom:40px;}}

/* "How to apply" was missed by the P11 heading pass, so it kept the fully red
   .new-inner heading instead of the #444 base with a red accent word. */
.crd-journey .heading_blk h2{color:#444;}
.crd-journey .heading_blk h2 .orange{color:#d82f02;}

/* Floor plan pop-up, portrait plans (Cornamaddy, 02/09/2026): the image frame was a fixed 408px
   band, so a full-page portrait plan shrank to about 170px wide with a large empty area beneath it.
   Let the frame hug the image and give the image the height the pop-up already has. Landscape plans
   are unaffected: they are still limited by the frame width. */
.crd-fpmodal__content .crd-fppanel__img{height:auto;min-height:0;}
.crd-fpmodal__content .crd-fppanel__img img{max-height:calc(92vh - 470px);width:auto;display:block;margin:0 auto;}
.crd-fpmodal__content{padding-bottom:64px;}

/* ---- "How do I apply" steps: long step text is clamped to 10 lines with a Read more / Read less toggle (14/09/2026).
   The clamp class and the button are added by JS only when the text actually overflows, so short steps and
   no-JS visitors always see the full text. max-height is the fallback for browsers without line-clamp. ---- */
.crd-journey__step-text.is-clamped{display:-webkit-box;-webkit-line-clamp:10;-webkit-box-orient:vertical;overflow:hidden;max-height:15em;}
.crd-journey__more{display:inline-block;margin:12px 0 0;padding:4px 2px;background:transparent;border:0;border-radius:0;box-shadow:none;
	font-family:inherit;font-size:15px;font-weight:700;line-height:1.4;color:#c42a00;cursor:pointer;text-decoration:underline;text-underline-offset:3px;}
.crd-journey__more:hover,.crd-journey__more:focus{background:transparent;color:#222;} /* beats the theme's global button:hover amber fill */
.crd-journey__more:focus-visible{outline:2px solid #d82f02;outline-offset:3px;}
.crd-journey__more i{margin-left:6px;font-size:.85em;}

/* 21/09/2026 (Millers Glen review)
   Amenities list: two bullet columns squeeze each item to about 80px of text on phones ("Swords / Town /
   Centre just / minutes / away"). One column below 600px; from 600px up two columns fit in two lines. */
@media (max-width:599.98px){
	.crd-amen .crd-amen__col:first-child .answer ul li{width:100%;}
}
/* Map band: the Google embed loads lazily, so until it paints (and in full-page screenshots) the band reads
   as 600px of empty white above the footer. Give it the map's own land colour as a placeholder. */
.crd-map__embed{background:#e5e3df;}
