/* CashBackBin theme: header, footer, menu and page sections in the giftcardplace.com style.
   Loaded after style.css; only restyles, the page markup and layout widths come from style.css. */

/* ===== Theme colours (same palette as giftcardplace.com) ===== */
:root{--gcp-brand:#1d4f91;--gcp-brand-dark:#163f75;--gcp-link:#1d5fa8;--gcp-cta:#15803d;--gcp-cta-hover:#166534;--gcp-text:#1f2937;--gcp-muted:#4b5563;--gcp-border:#e5e7eb;--gcp-tint:#eaf1fb;--gcp-page:#f3f6fa;--gcp-footer:#0f2a4a}

/* ===== Desktop header (Layouts/Header.jsx): logo + tagline on the left, pill menu below ===== */
@media (max-width:767px){.header.site_header,.site_sticky{display:none!important}}
@media (min-width:768px){
  .site_sticky{position:sticky;top:0;z-index:50;background:#fff;padding-bottom:0;transition:box-shadow .2s}
  .site_sticky.is-compact{box-shadow:0 2px 8px rgba(15,23,42,.1)}
  .header.site_header{display:flex!important;align-items:center;gap:40px;float:none;box-sizing:border-box;width:100%;margin:0;padding:24px 0 14px;position:relative;z-index:20;transition:padding .2s}
  .site_sticky.is-compact .header.site_header{padding-top:8px;padding-bottom:8px}
  .site_header_logo{flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:2px;line-height:0;text-decoration:none}
  .site_header_logo img{display:block;width:213px;height:45px} /* same 45px height as the giftcardplace.com logo */
  .site_header_tagline{display:block;margin-left:6px;font-size:12px;font-weight:600;line-height:16px;color:var(--gcp-muted);transition:opacity .2s}
  .site_sticky.is-compact .site_header_tagline{display:none}

  /* header nav: emoji-free line icon + label links in white pills with a light grey border, between two hairlines */
  .nav_m{box-sizing:border-box;width:100%;height:48px;margin:0;padding:0 4px;background:none;border:0;border-top:1px solid var(--gcp-border);border-bottom:1px solid var(--gcp-border);border-radius:0;overflow:hidden}
  .nav_m.customdivdesktopshow{display:flex!important;align-items:center;justify-content:center;gap:8px}
  .nav_m .navigation{float:none;flex:1;min-width:0;width:auto}
  /* pages with the intro card (home, A-Z, store pages): centre the menu over the 750px content column under it, not the full page */
  body:has(.home_intro):has(.ad_rail,.check-content-iframbox) .nav_m.customdivdesktopshow{justify-content:flex-start;padding:0}
  body:has(.home_intro):has(.ad_rail,.check-content-iframbox) .nav_m .navigation{flex:0 0 750px;margin-left:8px}
  body:has(.home_intro):has(.ad_rail) .nav_m .navigation{flex-basis:782px}
  .navigation ul{display:flex;justify-content:center;align-items:center;gap:6px;margin:0;padding:0;list-style:none;line-height:20px}
  .navigation li,.navigation li:hover,.navigation li.active{display:flex;align-items:center;float:none;width:auto;height:auto;margin:0;border:0;background:none;font-size:13px}
  .navigation li a{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border:1px solid #d1d5db;border-radius:999px;background:#fff;font-family:inherit;font-size:14px;font-weight:600;line-height:20px;color:#003366;white-space:nowrap;text-decoration:none;transition:background .15s,border-color .15s,color .15s}
  .navigation li a:hover,.navigation li.active a{background:var(--gcp-tint);border-color:#003366;color:#002147;text-decoration:none}
  .navigation li a:focus-visible{outline:2px solid var(--gcp-link);outline-offset:2px}
  .navigation li a .nav_icon{display:block;flex:none;box-sizing:content-box;width:16px;height:16px;padding:1px;margin:0;color:currentColor}

  /* page frame: plain white page, no heavy grey double border; content starts clear of the pinned header */
  .pagediv,.pageindiv{border:0;border-radius:0;padding:0;background:#fff;box-shadow:none}
  /* 2px here + the first card's 10px top margin = 12px under the menu, the same gap as between the cards */
  .pagediv{display:block!important;margin:2px 0 20px}
  .pageindiv{display:block!important}
}

/* ===== Phone header: MENU button then logo, pinned, never resizes ===== */
@media (max-width:767px){
  /* white bar (not the page grey): logo.png has a white background */
  header.mob_header{display:flow-root;position:sticky;top:0;z-index:50;margin:0 -15px 15px;padding:0 15px;background:#fff;transition:box-shadow .2s}
  .mob_header.is-compact{box-shadow:0 2px 8px rgba(15,23,42,.12)}
  .mob_header .headerstrip{height:auto;padding:12px 0 0!important}
  .mob_header .headerstrip>.row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0}
  .mob_header .headerstrip>.row:before,.mob_header .headerstrip>.row:after,.mob_header .headerstrip>.row>.clearfix{display:none}
  .mob_header .headerstrip>.row>.col-xs-4{order:1;flex:0 0 auto;width:auto;padding:0}
  .mob_header .headerstrip>.row>.col-xs-8{order:2;flex:1 1 0;min-width:0;width:auto;padding:0}
  .mob_header .logo{float:none;margin:0;text-align:left}
  /* logo + tagline together are 48px tall, the same as the MENU button beside them */
  .mob_header .logo img{display:block;max-width:100%;width:auto;height:32px}
  .mob_header .logo a{display:inline-block;text-decoration:none}
  .mob_header_tagline{display:block;margin:2px 0 0 2px;font-size:11px;font-weight:600;line-height:14px;color:var(--gcp-muted);white-space:nowrap}
  /* menu button: bold three-line icon over a "MENU" label in a tinted brand container (52x48, above the 44px minimum) */
  .mob_header .mobmenu_btn{float:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;box-sizing:border-box;width:52px;height:48px;min-width:44px;min-height:44px;margin:0;padding:0 0 3px;border:1px solid #b9c6d6;border-radius:10px;background:var(--gcp-tint);color:#003366;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
  .mob_header .mobmenu_btn:before,body.open .mob_header .mobmenu_btn:before{content:none}
  .mob_header .mobmenu_btn svg{display:block}
  .mob_header .mobmenu_label{font-size:10px;font-weight:700;line-height:1;letter-spacing:.06em;text-transform:uppercase}
  .mob_header .mobmenu_btn:hover,.mob_header .mobmenu_btn[aria-expanded="true"]{background:#003366;border-color:#003366;color:#fff}
  .mob_header .mobmenu_btn:focus-visible{outline:2px solid #003366;outline-offset:2px}
  .mob_header .linediv{display:block;height:1px;margin:12px -15px 0;background:var(--gcp-border)}
  /* the header's 15px bottom margin is the only gap above the first card (same as the 15px between cards) */
  .pagesection{padding-top:0}

  /* phone slide-out menu: page-coloured panel with the items in a white card, line icon before each item */
  /* the panel is fixed behind the page (as on giftcardplace.com), so it takes no room in the flow; in the flow its padding
     pushed the full-screen .body_container down and cut off the bottom of the page (the footer) */
  .mobmenu{position:fixed;top:0;right:0;z-index:1;width:70%;height:100%;overflow-y:auto;overflow-x:hidden;background:var(--gcp-page);box-sizing:border-box;padding:12px 12px 12px 0}
  .mobmenu .mobmenu_list{margin:0;padding:0;list-style:none;background:#fff;border:1px solid var(--gcp-border);border-radius:12px;box-shadow:0 2px 8px rgba(15,42,74,.08);overflow:hidden;height:auto;position:static;width:auto}
  .mobmenu .mobmenu_list a{display:flex;align-items:center;gap:12px;border-top:0;border-bottom:1px solid #eef2f7;color:var(--gcp-text);padding:0 12px 0 16px;line-height:2.75em;text-decoration:none}
  .mobmenu .mobmenu_list a:active,.mobmenu .mobmenu_list a:hover{background:var(--gcp-tint)}
  .mobmenu .mobmenu_list li:last-child a{border-bottom:0}
  .mobmenu .mobmenu_list .nav_icon{flex:0 0 auto;color:var(--gcp-brand)}
}

/* ===== Store search boxes (Layouts/Searchcom.jsx desktop, Searchcommob.jsx phones): same pill as the giftcardplace.com
   search - white input with a grey rounded border and a dark navy search segment on the right ===== */
.search_pill,.search_form .sform_base{position:relative;display:block}
.search_pill .seach_box_input,.search_form .sform_base .form-control{box-sizing:border-box;display:block;width:100%;height:48px;margin:0;padding:0 66px 0 20px;background:#fff;border:1px solid #8f99a6;border-radius:999px;box-shadow:none;color:#1f2937;font-family:inherit;font-size:15px;font-weight:400;outline:none}
.search_pill .seach_box_input::placeholder,.search_form .sform_base .form-control::placeholder{color:#555;opacity:1}
.search_pill .seach_box_input:hover,.search_form .sform_base .form-control:hover{border-color:#6b7280}
.search_pill .seach_box_input:focus,.search_form .sform_base .form-control:focus{background:#fff;border-color:var(--gcp-footer);box-shadow:0 0 0 3px rgba(15,42,74,.18);outline:none}
.search_form .sform_base:before{content:none;display:none}
.search_pill_btn{position:absolute;top:0;right:0;bottom:0;z-index:2;display:flex;align-items:center;justify-content:center;width:56px;height:48px;margin:0;padding:0 4px 0 0;border:0;border-radius:0 999px 999px 0;background:var(--gcp-footer);color:#fff;cursor:pointer}
.search_pill_btn:hover{background:#163a63}
.search_pill_btn:focus-visible{outline:2px solid #fff;outline-offset:-4px}
h2.search-notes,h3.search-notes,.search_form h2.title,.search_form h3.title,.search-notes,.search_form .title{margin:0 0 8px;padding:0;border:0;background:none;color:var(--gcp-text);font-family:inherit;font-size:13px;font-weight:600;line-height:18px;text-align:left}
/* results drop down under their own box (not the whole panel), as a rounded card */
.search_left,.search_right,.search_full{position:relative}
/* the one remaining search (by URL) spans the whole card */
.search_full{float:none;width:auto}
.search_left .suggestionbox,.search_right .suggestionboxurl,.search_full .suggestionboxurl,.search_form .suggestionbox,.search_form .suggestionboxurl{left:0;right:0;width:auto!important;margin:6px 0 0;border:1px solid var(--gcp-border);border-radius:14px;box-shadow:0 16px 40px rgba(15,42,74,.18);background:#fff;overflow:hidden}
.suggestionbox:not(:has(li)),.suggestionboxurl:not(:has(li)){display:none!important}
.search_form .form-group{margin-bottom:14px}
.search_form .form-group:last-child{margin-bottom:0}
.suggestionbox ul,.suggestionboxurl ul{height:auto;max-height:min(360px,60vh);margin:0;padding:4px 0;border:0;border-radius:0;box-shadow:none}
.suggestionbox ul li,.suggestionboxurl ul li{padding:0;border-bottom:1px solid #eef2f7}
.suggestionbox ul li a,.suggestionboxurl ul li a{display:block;padding:11px 18px;color:var(--gcp-text)!important;font-size:14px;text-decoration:none}
.suggestionbox ul li:hover,.suggestionboxurl ul li:hover{background:var(--gcp-tint)}
.suggestionboxurl ul li.search_nomatch{padding:11px 18px;border-bottom:0;color:var(--gcp-muted);font-size:14px;cursor:default}
.suggestionboxurl ul li.search_nomatch:hover{background:none}
/* search results: up to 10 matches, 6 rows in view (37px rows on desktop, 43px on phones) and a vertical scrollbar for the
   rest; rows alternate white / light gray */
.suggestionboxurl #merchant-list{max-height:222px;overflow-y:auto;overscroll-behavior:contain}
@media (max-width:767px){.suggestionboxurl #merchant-list{max-height:258px}}
.suggestionboxurl #merchant-list::-webkit-scrollbar{width:8px}
.suggestionboxurl #merchant-list::-webkit-scrollbar-track{background:#f3f4f6}
.suggestionboxurl #merchant-list::-webkit-scrollbar-thumb{background:#9ca3af;border-radius:4px}
@supports not selector(::-webkit-scrollbar){.suggestionboxurl #merchant-list{scrollbar-width:thin;scrollbar-color:#9ca3af #f3f4f6}}
/* (#merchant-list: style.css styles the list by id, with floated links that left it 10px tall on desktop, so no 10-row fit) */
.suggestionboxurl #merchant-list li{background:#fff}
.suggestionboxurl #merchant-list li:nth-child(even){background:#f3f4f6}
.suggestionboxurl #merchant-list li:not(.search_nomatch):hover{background:var(--gcp-tint)}
.suggestionboxurl #merchant-list li a,.suggestionboxurl #merchant-list li a:hover{float:none;width:auto;margin:0;padding:11px 18px;border:0;border-radius:0;background:none}
/* the result list hangs below the search card over the content under it, instead of being cut off at the card's edge
   (flow-root keeps the card wrapping its floated A-Z bar, which overflow:hidden did before) */
.home_hero{position:relative;z-index:30;overflow:visible}
.home_hero .balance_ckeck_container{display:flow-root;overflow:visible}
.home_hero .home_section_bar{border-radius:11px 11px 0 0}
/* desktop "Navigate by name" A-Z bar (table.alphabet in Searchcom.jsx): the same 34px letter chips as the phone panels */
.cs_navigation table.alphabet,.cs_navigation table.alphabet tbody{display:block;width:100%;margin:0;padding:0;border:0}
.cs_navigation table.alphabet tr{display:flex;flex-wrap:wrap;gap:6px;padding:4px 0 2px}
.cs_navigation table.alphabet td.td_detail{display:block;width:auto;margin:0;padding:0;border:0;background:none}
.cs_navigation table.alphabet td.td_detail>a{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:34px;height:34px;line-height:1;border:1px solid #c9daf0;border-radius:8px;background:var(--gcp-tint);color:var(--gcp-brand)!important;font-size:14px;font-weight:700;text-decoration:none!important;transition:background .15s,color .15s,border-color .15s}
.cs_navigation table.alphabet td.td_detail>a:hover,.cs_navigation table.alphabet td.td_detail>a:focus-visible{background:var(--gcp-brand);border-color:var(--gcp-brand);color:#fff!important}
.cs_navigation table.alphabet td.td_detail>a:focus-visible{outline:2px solid var(--gcp-brand-dark);outline-offset:2px}
.balance_ckeck_ebay:has(>.cs_navigation){margin:4px 0 0!important}
@media (min-width:768px){
  .search_left,.search_right{width:48.5%}
  .balance_ckeck_section .balance_ckeck.clear_tbpad{padding:14px 16px}
}

/* ===== Site footer (Layouts/Footer.jsx): link columns under headings, then the copyright row ===== */
footer.site_footer{display:block;clear:both;box-sizing:border-box;width:100%;margin:0 0 20px;padding:28px 28px 18px;background:var(--gcp-footer);color:#cbd5e1;border-radius:10px;font-family:Lucida Grande,Lucida Sans,Verdana,Arial,sans-serif;text-align:left}
.site_footer_columns{display:grid;grid-template-columns:1.4fr 1fr 1fr auto;gap:24px}
.site_footer_heading{margin:0 0 12px!important;padding:0!important;background:none!important;border:0!important;font-size:13px!important;line-height:18px!important;font-weight:700!important;letter-spacing:.06em;text-transform:uppercase;color:#fff!important;text-align:left!important}
.site_footer ul{list-style:none!important;margin:0!important;padding:0!important}
.site_footer li{display:block!important;float:none!important;width:auto!important;margin:0!important;padding:0!important;background:none!important;border:0!important}
.site_footer li a{display:inline-block;box-sizing:border-box;min-height:24px;padding:3px 0;line-height:18px;vertical-align:top}
.site_footer a{color:#cbd5e1!important;font-size:13px;font-weight:400;text-decoration:none!important}
.site_footer a:hover,.site_footer a:focus-visible{color:#fff!important;text-decoration:underline!important;text-underline-offset:2px}
.site_footer_social{display:flex;flex-wrap:wrap;align-items:center;gap:10px;--social-glyph:#fff}
.site_footer_social a{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;transition:opacity .2s}
.site_footer_social a:hover{opacity:.85;text-decoration:none!important}
.site_footer_social a:focus-visible{outline:2px solid #fff;outline-offset:2px}
.site_footer_social svg{width:24px;height:24px;display:block;border-radius:50%}
.site_footer_social a.social_facebook{color:#1877f2!important}
.site_footer_social a.social_x{color:#000!important}
.site_footer_social a.social_x svg{box-shadow:0 0 0 1px rgba(255,255,255,.35)}
.site_footer_social a.social_youtube{color:#f00!important}
.site_footer_social a.social_pinterest{color:#e60023!important}
.site_footer_social a.social_facebook svg,.site_footer_social a.social_pinterest svg{background:radial-gradient(circle,#fff 62%,transparent 64%)}
.site_footer_social a.social_linkedin{color:#0a66c2!important}
.site_footer_bottom{margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.15)}
.site_footer_bottom p{margin:0 0 6px!important;font-size:12px;line-height:1.5;color:#cbd5e1;text-align:left!important}
.site_footer_bottom .site_footer_legal{margin:0!important;font-size:11px;color:#94a3b8}
.site_footer_bottom .site_footer_legal a{font-size:11px;color:#cbd5e1!important;text-decoration:underline!important}
@media (max-width:767px){
  footer.site_footer{width:auto;margin:32px -15px 0;padding:24px 20px 18px;border-radius:0}
  .site_footer_columns{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 12px}
  .site_footer_follow{grid-column:1 / -1;display:flex;align-items:center;flex-wrap:wrap;gap:4px 12px}
  .site_footer_follow .site_footer_heading{margin:0!important}
  .site_footer li a{overflow-wrap:anywhere}
  /* 24px icons inside a 32px tap area (WCAG 2.2 target size) */
  .site_footer_social{gap:6px;margin-left:-4px}
  .site_footer_social a{width:32px;height:32px}
}

/* ===== Page sections, desktop: flat brand header bars, 1px borders, rounded corners (no gradients or images) ===== */
@media only screen and (min-width:768px){
  body{background:#fff}
  .balance_ckeck_section .balance_ckeck_ebay a,.content_storeA a,.contentContainer a{color:var(--gcp-link)}
  /* store page: "Shop at X" and "Buy Discount Gift Cards" links close together under the title (style.css gave each 10px/20px padding) */
  .main_content_store .content_storeC{padding:8px 0 0;line-height:20px}
  .main_content_store .content_storeC:last-child{padding-bottom:16px}

  /* bordered content boxes (search, ads, merchant tables): same 1px border and soft shadow as the giftcardplace panels */
  .balance_ckeck_container{border-color:var(--gcp-border);border-radius:10px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}

  /* ads, as on giftcardplace.com: fixed-size 728x90 unit in a grey box; 160x600 units in white cards down the right rail */
  /* horizontal ads: the giftcardplace.com desktop ad box - white card, #cfcfcf border, 7px corners, soft shadow,
     a 728x90 unit centred with 10px padding around it */
  .page_ad{box-sizing:border-box;margin:0 0 20px;padding:10px;text-align:center;background:#fff;border:1px solid #cfcfcf;border-radius:7px;box-shadow:0 2px 5px #ddd}
  .page_ad__slot{margin:0 auto;overflow:hidden;line-height:0;background:transparent}
  .page_ad--wide .page_ad__slot{width:728px;height:90px}
  /* right rail as on giftcardplace.com: on the page's right edge, level with the intro card (10px top margin) */
  .ad_rail.boxright{width:170px;margin-top:10px}
  .ad_rail .check-content-box{box-sizing:border-box;width:170px;min-height:610px;padding:4px;background:#fff;border:1px solid #d1d5db;border-radius:12px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06);overflow:hidden;line-height:0}
  .ad_rail .check-content-box+.check-content-box{margin-top:24px}
  /* pages with the rail (A-Z, store pages): the content column fills the page up to a 10px gap before the rail, as on
     giftcardplace.com (970px page: 8px + 782px column + 10px gap + 170px rail) */
  body:has(.ad_rail) .boxleft{width:790px}
  body:has(.ad_rail) :is(.home_intro,.home_hero,.balance_ckeck_content_main,.home-popular-box-main,.home-popular-box){width:782px}
  body:has(.ad_rail) .main_content_store{box-sizing:border-box;width:778px}
  body:has(.ad_rail) .storecrd_content_fullsize{box-sizing:border-box;width:782px}
  /* an ad AdSense left unfilled takes its box with it, so no empty frame is left (boxes stay until AdSense answers) -
     except the top 728x90 ads and the right-rail 160x600 ads: collapsing those would make what follows jump up (layout shift / CLS) */
  :is(.page_ad:not(.home_top_ad),.check-content-box:not(.ad_rail .check-content-box)):has(ins.adsbygoogle[data-ad-status="unfilled"]){display:none!important}
  /* top ad: space held at the ad's full size before it loads, ad centred in it */
  .page_ad.home_top_ad .page_ad__slot{display:flex;align-items:center;justify-content:center;min-height:90px}
  /* right rail: each box holds the 160x600 ad's full height before it loads, ad centred in it */
  .ad_rail .check-content-box{display:flex;align-items:center;justify-content:center}
  .ad_rail .check-content-box ins.adsbygoogle{min-height:600px}

  /* home: intro card above the search box (same text as the phone heading card) */
  /* even 12px gaps: intro card, search card, top ad, then the first section */
  .home_intro,.home_hero{float:left;clear:left;box-sizing:border-box;width:750px;margin:0 0 12px 8px}
  .home_intro{margin-top:10px}
  .balance_ckeck_content_main:has(.home_top_ad){clear:left;margin-top:0}
  .page_ad.home_top_ad{margin:0 0 12px}
  /* home page (no right ad column): the 750px column is centred under the menu, with a 728x90 ad above the intro card
     and another above the footer */
  /* home page (no right ad column): every section spans the full page width */
  .pagesection.home_page > .boxleft{float:none;width:auto;margin:0}
  .pagesection.home_page :is(.home_intro,.home_hero,.page_ad.home_page_ad,.page_ad.home_top_ad,.balance_ckeck_content_main,.home-popular-box-main,.contant_box_hcms){float:none;clear:both;width:auto;margin-left:0;margin-right:0}
  .pagesection.home_page :is(.home-popular-box-main,.contant_box_hcms){display:flow-root}
  /* full-width Most Popular grid: 5 equal columns with each store card centred in its column (as on giftcardplace.com) */
  .pagesection.home_page .home-popular-content{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));justify-items:center;padding-left:10px;padding-right:10px}
  .pagesection.home_page .home-popular-content .popular_img_main{float:none;margin-left:0;margin-right:0}
  .page_ad.home_page_ad{float:left;clear:left;width:750px;margin:0 0 12px 8px}
  .page_ad.home_page_ad--bottom{margin-top:12px}
  .home-popular-box-main{margin-top:0}
  /* list sections (Most Popular, Merchant Names Starting with ...): same 750px width, left edge and 12px corners as the cards
     above, and the blue header bar runs edge to edge like the Search Cashback Rebates for Stores bar (no box padding) */
  .home-popular-box-main,.home-popular-box{float:left;clear:left;box-sizing:border-box;width:750px;margin-left:8px;border-radius:12px}
  .home-popular-box.balance_ckeck_container{padding:0 0 10px}
  .home-popular-box-main .home-popular-content{padding-top:12px}
  .home_intro{padding:18px 20px}
  /* search card: navy h2 section bar edge to edge (same as Most Popular Cashback Stores), the search boxes and A-Z below */
  .home_hero{padding:0 0 8px}
  .home_hero .balance_ckeck_container{margin:0;padding:4px 20px 0;border:0;border-radius:0;box-shadow:none}
  .home_hero .balance_ckeck.clear_tbpad{padding:12px 0 0}

  /* home: Most Popular Cashback Stores (the header bar runs edge to edge, so no box padding) */
  .home-popular-box-main.balance_ckeck_container{padding:0 0 10px}
  .home-popular-box-main,.home-popular-box{border:1px solid var(--gcp-border);border-radius:10px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06);overflow:hidden;background:#fff}
  .home-popular-box-top,.home-popular-box-right{height:auto;background:var(--gcp-brand);border:0;border-radius:0}
  .home-popular-box-header-home,.home-popular-box-header{margin:0;border:0;background:none;padding:9px 14px;font-family:inherit;font-size:15px;font-weight:600;line-height:21px;color:#fff;text-align:left}
  .popular-card-list p{color:var(--gcp-link)}
  .popular-card-list span{color:var(--gcp-cta);font-weight:600}

  /* home: FAQ / about text box */
  .contant_box_hcms_title{box-sizing:border-box;width:100%;margin:0;border:0;font-family:inherit;padding:9px 14px;background:var(--gcp-brand);color:#fff;font-size:15px;font-weight:600;line-height:21px;border-radius:10px 10px 0 0}
  .contant_box_hcms_text{box-sizing:border-box;width:100%;padding:12px 14px;border:1px solid var(--gcp-border);border-top:0;border-radius:0 0 10px 10px;color:var(--gcp-text);line-height:1.6;background:#fff}
  .contant_box_hcms_text a{color:var(--gcp-link)}

  /* merchant page: Cashback Rewards / Points-Miles Rewards tables */
  div.cap,div.capR{box-sizing:border-box;height:auto;padding:10px 12px;background:var(--gcp-brand);color:#fff;font-size:15px;font-weight:600;line-height:20px;border-radius:10px 10px 0 0}
  .detail_table_cash th,.detail_table_points th,.border_tbody th{background:var(--gcp-tint)!important;color:var(--gcp-text)!important;font-weight:600;border-color:var(--gcp-border)!important}
  .border_tbody,.cardtable{border:1px solid var(--gcp-border)!important}
  .cardtable td{border-color:var(--gcp-border)!important;color:var(--gcp-text)}
  .cardtable td a{color:var(--gcp-link);font-weight:600}
  .no-more-points,.no-store-msg{border:1px solid var(--gcp-border);border-radius:8px;background:var(--gcp-page);color:var(--gcp-muted)}
  .balance_ckeck_border{border-color:var(--gcp-border)}
  .gcpDisclaimer{color:var(--gcp-muted);font-style:normal}

  /* raised boxes (blog, store navigation, merchant panels) */
  div.raised_box,div.raised_box_with_header{border-radius:10px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
  div.raised_box_with_header div.manufacture_box_top_left,div.raised_box_with_header div.box_top_left,.left_bg{background:var(--gcp-brand);border-radius:10px 10px 0 0}
  div.raised_box_with_header div.header,.left_bg h2,.left_bg h1{color:#fff;font-size:15px!important;font-weight:600}
  div.raised_box div.box_middle_right,div.raised_box_with_header div.box_middle_right{background:#fff;border:1px solid var(--gcp-border);border-top:0;border-bottom:0}
  div.raised_box div.box_middle_left,div.raised_box_with_header div.box_middle_left,div.raised_box div.box_bottom_left,div.raised_box_with_header div.box_bottom_left{background:none}
  div.raised_box div.box_bottom_right,div.raised_box_with_header div.box_bottom_right{background:#fff;border:1px solid var(--gcp-border);border-top:0;border-radius:0 0 10px 10px;height:8px}
  div.raised_box div.box_middle_right{border-top:1px solid var(--gcp-border);border-radius:10px 10px 0 0}
  .left_content{border:1px solid var(--gcp-border);border-top:0;background:#fff;border-radius:0 0 10px 10px}
  .left_content a{color:var(--gcp-link)}
  /* blog sidebar and blog post headers */
  .blog_left_bg,.lightgray_gradient{background:var(--gcp-brand)!important;border-radius:10px 10px 0 0}
  .blog_left_bg h4{margin:0;padding:8px 12px;color:#fff;font-size:15px;font-weight:600}
  table.data_list th{background:var(--gcp-tint);color:var(--gcp-text);font-weight:600;border-top:0;border-bottom:1px solid var(--gcp-border)}
  table.data_list td{color:var(--gcp-text);border-bottom:1px solid var(--gcp-border)}
  table.data_list td a:not(.shop-button){color:var(--gcp-link)!important;font-weight:600}
  .shop-button{background:var(--gcp-cta);border:0;color:#fff!important;font-size:13px;font-weight:600;padding:8px 16px;border-radius:8px}
  .shop-button:hover,.shop-button:focus{background:var(--gcp-cta-hover)}
}

/* ===== Page sections, phones: flat brand colours, WCAG AA contrast, larger tap targets ===== */
@media only screen and (max-width:767px){
  body,.body_container{background:var(--gcp-page);color:var(--gcp-text)}
  .body_container a{color:var(--gcp-link)}
  .headingdiv,.listingdiv,.panelbox,.tablediv{border-radius:12px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06);border:1px solid var(--gcp-border)}
  .headingdiv .remove_h1,.headingdiv h2{color:var(--gcp-text)}
  .headingdiv p{margin:8px 0}
  .panelbox.blue h2{background:var(--gcp-brand);color:#fff;font-size:16px;font-weight:600;border-radius:12px 12px 0 0;padding:12px 15px}
  /* "Jump to Merchant" A-Z letters: 34px chips wrapping in rows, 6px apart (same size as the giftcardplace.com phone
     Balance Check page). The list items carry inline float/padding styles, hence the !important */
  .panelbox:has(.navigate-listing){min-height:0}
  .panelbox ul:has(>li.navigate-listing){display:flex!important;flex-wrap:wrap;gap:6px;margin:0!important;padding:4px 0 10px!important;list-style:none!important}
  .panelbox li.navigate-listing{float:none!important;margin:0!important;padding:0!important;border:0!important;background:none!important;list-style:none!important}
  .panelbox li.navigate-listing>a{display:flex!important;align-items:center;justify-content:center;box-sizing:border-box;width:34px!important;height:34px!important;line-height:1!important;border:1px solid #c9daf0;border-radius:8px;background:var(--gcp-tint);color:var(--gcp-brand)!important;font-size:14px;font-weight:700;text-decoration:none!important;transition:background .15s,color .15s,border-color .15s}
  .panelbox li.navigate-listing>a:hover,.panelbox li.navigate-listing>a:active,.panelbox li.navigate-listing>a:focus-visible{background:var(--gcp-brand);border-color:var(--gcp-brand);color:#fff!important}
  .panelbox li.navigate-listing>a:focus-visible{outline:2px solid var(--gcp-brand-dark);outline-offset:2px}
  .search_form .form-control,.headingdiv .form-control{border-color:#cbd5e1;background:#fff}
  .search_form .form-control:focus,.headingdiv .form-control:focus{border-color:var(--gcp-link);box-shadow:0 0 0 3px rgba(29,95,168,.15)}
  .cardbox{background:#fff;border:1px solid var(--gcp-border);border-radius:10px;box-shadow:0 1px 2px rgba(15,23,42,.06);color:var(--gcp-text)}
  .cardbox:hover{background:var(--gcp-tint)}
  .detail_table th{background:var(--gcp-brand);color:#fff;font-size:16px;font-weight:600;padding:12px 10px;text-align:left}
  .detail_table .headingrow td,.detail_table .headingrow th{background:var(--gcp-tint);color:var(--gcp-text);font-weight:600;font-size:14px;padding:8px 6px}
  .detail_table td{color:var(--gcp-text);font-weight:400}
  .detail_table td a{color:var(--gcp-link);font-weight:600}
  .detail_table_cash th,.detail_table_points th{background:var(--gcp-brand)!important;color:#fff!important}
  .detail_table_cash .headingrow td,.detail_table_points .headingrow td{background:var(--gcp-tint);color:var(--gcp-text);font-weight:600}
  .commonbtn{border-radius:8px;font-weight:600}
  .commonbtn.orange{background:var(--gcp-brand);color:#fff!important}
  .commonbtn.orange:hover,.commonbtn.orange:focus{background:var(--gcp-brand-dark)}
  .balance_ckeck_border{border-color:var(--gcp-border)}
  .commonbtn.green,.detail_table .commonbtn.green{background:var(--gcp-cta);color:#fff!important;font-weight:600;border-radius:8px}
  .commonbtn.green:hover,.commonbtn.green:focus{background:var(--gcp-cta-hover);color:#fff!important}
  .gcpDisclaimer{color:var(--gcp-muted);font-style:normal;font-size:12px}
  /* 320x50 ads in white cards, as on the giftcardplace.com phone pages: no side padding so the unit gets the whole width */
  .ads.addiv.horz{padding:10px 0;line-height:0}
  .addiv:has(ins.adsbygoogle[data-ad-status="unfilled"]){display:none!important}
  /* the old green social strip duplicates the footer's Follow Us links */
  .greenstrip{display:none!important}
}

/* phones under 350px: the card is narrower than the 320px ad, so it runs the full screen width and the ad is never clipped */
@media (max-width:349px){
  .ads.addiv.horz{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);border-radius:0}
}

/* ===== Home hero (Page/Home.jsx): the page h1 + intro line and the store search in one card ===== */
.home_hero{display:block;background:#fff;border:1px solid var(--gcp-border);border-radius:12px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
/* intro section: white card with a grey border, like the giftcardplace.com ad and rail boxes */
.home_intro{display:block;text-align:center;background:#fff;border:1px solid #d1d5db;border-radius:12px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
.home_intro .home_intro_title{margin:0 0 6px;padding:0;border:0;background:none;color:var(--gcp-text);font-family:inherit;font-size:22px;font-weight:700;line-height:1.3;text-align:center}
.home_intro p{margin:0;color:var(--gcp-muted);font-size:14px;line-height:1.5;text-align:center;text-wrap:balance}
/* wrapped lines come out even, no single word left alone on the last line */
.home_intro .home_intro_title{text-wrap:balance}
/* the store page renders a phone-only copy of both cards; the display:block above beat style.css's desktop hide for it,
   so it showed again at the bottom of the page on desktop */
@media (min-width:768px){.home_intro.customdivmobileshow,.home_hero.customdivmobileshow{display:none}}
/* search card section bar: navy h2 edge to edge, same look as the Most Popular Cashback Stores bar */

.home_section_bar{margin:0;padding:9px 14px;border:0;border-radius:0;background:var(--gcp-brand);color:#fff;font-family:inherit;font-size:15px;font-weight:600;line-height:21px;text-align:left}
@media (max-width:767px){
  .home_hero{margin:0 0 15px;padding:0 0 16px}
  .home_hero .search_form{padding:14px 15px 0}
  .home_section_bar{padding:12px 15px;font-size:16px}
  .home_intro{margin:0 0 15px;padding:16px 15px}
  .home_intro .home_intro_title{font-size:19px}
}

/* ===== A-Z merchant list on phones (Page/Storenavigation.jsx): store logo (or first-letter tile), name, cashback rate.
   Names use the same font as the section header bar above the list ===== */
@media (max-width:767px){
  .listingdiv .cardbox_panel>.row{margin:0}
  .listingdiv .cardbox_panel ul{margin:0;padding:0;list-style:none}
  .listingdiv .store_row{border-bottom:1px solid #eef2f7}
  .listingdiv .store_row:last-child{border-bottom:0}
  /* same rows as the giftcardplace.com phone category list: blue link text, discount muted after it */
  .listingdiv .store_row{border-bottom-color:var(--gcp-border)}
  .listingdiv .store_row{position:relative;display:flex;align-items:center;gap:10px;min-height:48px;padding:12px 0;box-sizing:border-box}
  .listingdiv .store_row a.store_name:before{content:none;display:none}
  /* the name link covers the whole row, so tapping anywhere on it opens the store */
  .listingdiv .store_row a.store_name:after{content:"";position:absolute;inset:0}
  .listingdiv .store_row a.store_name{position:static;display:block;padding:0;color:var(--gcp-link)!important;font-family:inherit;font-size:14px;font-weight:400;text-decoration:none}
  .listingdiv .store_row a.store_name:hover,.listingdiv .store_row a.store_name:focus-visible{text-decoration:underline;text-underline-offset:2px}
  .listingdiv .store_row:has(a.store_name:focus-visible){outline:2px solid var(--gcp-link);outline-offset:2px;border-radius:6px}
  .store_logo{flex:0 0 56px;box-sizing:border-box;width:56px;height:36px;border:1px solid var(--gcp-border);border-radius:6px;background:#fff;object-fit:contain}
  .store_logo--letter{display:flex;align-items:center;justify-content:center;background:var(--gcp-tint);border-color:#c9daf0;color:var(--gcp-brand);font-size:16px;font-weight:700;line-height:1}
  .store_row_text{flex:1 1 auto;min-width:0;font-size:14px;line-height:1.4;overflow-wrap:anywhere;text-align:left}
  /* "- Earn X Cashback": plain grey text, not part of the link (#4b5563 on white is 7.6:1 contrast) */
  /* two lines: the name link, then "Earn X Cashback" */
  .store_row_earn{display:block;color:var(--gcp-muted);font-size:13px;font-weight:400}
  /* generic storefront icon in a tinted square */
  .store_row .store_logo--icon{display:flex;align-items:center;justify-content:center;flex:0 0 34px;width:34px;height:34px;border:1px solid #c9daf0;border-radius:8px;background:var(--gcp-tint);color:var(--gcp-brand)}
  .store_row .store_logo--icon svg{display:block}
}

/* A-Z merchant list on desktop: three columns of logo + "Name - Earn X cashback", names in the header bar's font */
@media (min-width:768px){
  .store_tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 14px;margin:0;padding:12px 14px 14px;list-style:none}
  .store_tile{margin:0;padding:0;border:0;background:none;list-style:none}
  .store_tile a{display:flex;align-items:center;gap:10px;min-height:44px;padding:4px 6px;border-radius:8px;color:var(--gcp-text)!important;font-family:inherit;font-size:13px;line-height:1.35;text-decoration:none}
  .store_tile a:hover,.store_tile a:focus-visible{background:var(--gcp-tint)}
  .store_tile .store_logo{flex:0 0 56px;box-sizing:border-box;width:56px;height:36px;border:1px solid var(--gcp-border);border-radius:6px;background:#fff;object-fit:contain}
  .store_tile .store_logo--icon{display:flex;align-items:center;justify-content:center;flex:0 0 40px;width:40px;height:40px;border:1px solid #c9daf0;border-radius:8px;background:var(--gcp-tint);color:var(--gcp-brand)}
  .store_tile .store_logo--icon svg{display:block}
  .store_tile_text{min-width:0;overflow-wrap:anywhere;text-align:left}
  /* two lines: the name, then "Earn X cashback" */
  .store_tile .store_name{display:block;color:var(--gcp-link);font-weight:400}
  .store_tile a:hover .store_name,.store_tile a:focus-visible .store_name{text-decoration:underline;text-underline-offset:2px}
  .store_tile_earn{display:block;color:var(--gcp-muted);font-size:12px}
  .store_tile .store_row_rate{color:inherit;font-weight:inherit}
}

/* A-Z merchant list: "Show more" fallback at the end of each loaded batch (the next batch also loads on its own as it scrolls into view) */
.store_list_more{clear:both;padding:12px 14px 4px;text-align:center}
.store_list_more button{min-height:44px;padding:0 18px;border:1px solid #c9daf0;border-radius:999px;background:var(--gcp-tint);color:var(--gcp-brand);font-family:inherit;font-size:14px;font-weight:600;cursor:pointer}
.store_list_more button:hover,.store_list_more button:focus-visible{background:var(--gcp-brand);border-color:var(--gcp-brand);color:#fff}

/* phones: A-Z index inside the search card (Components/app/SearchHero.jsx), under a light divider with
   "or browse alphabetically" centred on it; same 34px letter chips as the giftcardplace.com Balance Check page */
@media (max-width:767px){
  .hero_az{padding:0 15px}
  .az_chips{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
  .az_chips li{margin:0;padding:0;list-style:none}
  .az_chips a{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:34px;height:34px;line-height:1;border:1px solid #c9daf0;border-radius:8px;background:var(--gcp-tint);color:var(--gcp-brand)!important;font-size:14px;font-weight:700;text-decoration:none!important;transition:background .15s,color .15s,border-color .15s}
  .az_chips a:hover,.az_chips a:active,.az_chips a:focus-visible{background:var(--gcp-brand);border-color:var(--gcp-brand);color:#fff!important}
  .az_chips a:focus-visible{outline:2px solid var(--gcp-brand-dark);outline-offset:2px}
}

/* light divider with centred text between the search box and the A-Z letters (desktop and phones) */
.hero_divider{display:flex;align-items:center;gap:10px;margin:16px 0 14px;color:var(--gcp-muted);font-size:12px;line-height:1;text-align:center;white-space:nowrap}
.hero_divider:before,.hero_divider:after{content:"";flex:1 1 0;height:1px;background:var(--gcp-border)}
/* "Or browse alphabetically" link (AzToggle.jsx, desktop and phones) (same blue underlined link as "Shop at <store>") that shows / hides the A-Z
   buttons below it; the arrow turns down while they are open */
.az_toggle_row{margin:12px 0 4px;text-align:center}
.az_toggle{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:4px 12px;border:0;background:none;color:var(--gcp-link);font:inherit;font-size:14px;line-height:20px;text-decoration:none;cursor:pointer}
.az_toggle_label{text-decoration:underline;text-underline-offset:2px}
.az_toggle:hover .az_toggle_label{text-decoration-thickness:2px}
.az_toggle:focus-visible{outline:2px solid rgba(29,95,168,.35);outline-offset:2px;border-radius:6px}
.az_toggle .cta_arrow{font-size:1.1em;line-height:1}
.az_panel[hidden]{display:none!important}
/* desktop: the link centred about 12px under the search bar (the A-Z block's inline 10px top margin and the row's
   12px padding / margin left a 30px gap) */
@media (min-width:768px){
  .home_hero .balance_ckeck.clear_tbpad:has(.az_toggle_row){padding-top:6px}
  .home_hero .balance_ckeck_ebay:has(> .az_toggle_row){margin-top:0!important}
  .home_hero .az_toggle_row{margin-top:0}
}
/* desktop search card: the A-Z block's inline -25px bottom margin (Searchcom.jsx) let the open A-Z buttons spill below the card */
.home_hero .balance_ckeck_ebay:has(> .az_toggle_row){margin-bottom:0!important}
.home_hero .az_panel .cs_navigation{padding-bottom:6px}
@media (max-width:767px){
  .az_toggle_row{margin:12px 0 0}
  .az_toggle{min-height:44px;font-size:16px;line-height:24px}
  .az_panel .az_chips{margin-top:6px}
}

/* ===== Section panel (brand header bar + white body) and the Contact Us page - copied from the giftcardplace.com
   stylesheet (.gcp_section, .contact_*) so the Contact page matches giftcardplace.com/contact-us ===== */
.gcp_section{clear:both;box-sizing:border-box;margin:0 0 16px;border-radius:10px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
.gcp_section .gcp_section__header{padding:9px 14px;background:var(--gcp-brand);border-radius:10px 10px 0 0}
.gcp_section .gcp_section__header h1,.gcp_section .gcp_section__header h2,.gcp_section .gcp_section__header [role="heading"]{float:none;margin:0;padding:0;background:none;border:0;font-size:16px;line-height:22px;font-weight:600;color:#fff;text-align:left}
.gcp_section .gcp_section__header a{color:#fff!important;text-decoration:none}
.gcp_section .gcp_section__header a:hover{text-decoration:underline}
.gcp_section .gcp_section__body{padding:16px 20px 18px;background:#fff;border:1px solid var(--gcp-border);border-top:0;border-radius:0 0 10px 10px;color:var(--gcp-text);font-size:14px;line-height:1.6;text-align:left}
.gcp_section .gcp_section__body h2{float:none;margin:20px 0 10px;padding:0 0 6px;background:none;border:0;border-bottom:2px solid var(--gcp-tint);border-radius:0;font-size:16px;line-height:1.3;font-weight:700;color:var(--gcp-brand);text-align:left}
.gcp_section .gcp_section__body ul{margin:0;padding:0;list-style:none}
.gcp_section .gcp_section__body li{float:none;width:auto;margin:0;padding:0;border:0;background:none;list-style:none}
@media (max-width:767px){
  .gcp_section .gcp_section__header{padding:12px 15px;border-radius:12px 12px 0 0}
  .gcp_section .gcp_section__body{padding:14px 15px 16px;border-radius:0 0 12px 12px}
}
/* Contact Us page: form beside the help links in one .gcp_section panel (stacked on phones), horizontal ad box below */
.contact_page .page_ad{margin:0 0 16px}
.contact_page .contact_body{display:flex;gap:28px;align-items:flex-start}
.contact_form{flex:1;min-width:0}
.contact_page .contact_intro{margin:0 0 14px;font-size:15px;line-height:1.6;color:var(--gcp-text);text-align:left}
.contact_page .contact_success{margin:0 0 14px;padding:10px 14px;border:1px solid #86efac;border-radius:8px;background:#f0fdf4;color:#166534;font-weight:600;text-align:left}
.contact_field{margin:0 0 14px;text-align:left}
.contact_field label{display:block;margin:0 0 5px;font-size:14px;font-weight:600;color:var(--gcp-text)}
.contact_req{color:#dc2626}
.contact_field input,.contact_field textarea{box-sizing:border-box;display:block;width:100%;max-width:520px;padding:10px 12px;font:inherit;font-size:16px;line-height:1.4;color:var(--gcp-text);background:#fff;border:1px solid #cbd5e1;border-radius:8px}
.contact_field textarea{min-height:140px;resize:vertical}
.contact_field input:focus,.contact_field textarea:focus{outline:0;border-color:var(--gcp-link);box-shadow:0 0 0 3px rgba(29,95,168,.15)}
.contact_field.has-error input,.contact_field.has-error textarea{border-color:#dc2626}
.contact_page .contact_error{margin:5px 0 0;font-size:13px;color:#dc2626;text-align:left}
button.contact_submit{display:inline-block;min-width:160px;min-height:44px;padding:10px 22px;border:0;border-radius:8px;background:var(--gcp-cta);color:#fff;font:inherit;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s}
button.contact_submit:hover,button.contact_submit:focus-visible{background:var(--gcp-cta-hover)}
button.contact_submit:focus-visible{outline:2px solid var(--gcp-cta);outline-offset:2px}
button.contact_submit:disabled{opacity:.7;cursor:default}
.contact_help{flex:0 0 280px;box-sizing:border-box;padding:16px;border:1px solid var(--gcp-border);border-radius:10px;background:#f8fafc}
.gcp_section .gcp_section__body .contact_help h2{margin:0 0 10px}
.contact_help h3{margin:0 0 2px;padding:0;font-size:14px;font-weight:700;color:var(--gcp-text)}
.contact_page .contact_help p{margin:0;font-size:14px;line-height:1.5;color:var(--gcp-muted);text-align:left}
.gcp_section .gcp_section__body .contact_help li{margin:0 0 12px}
.gcp_section .gcp_section__body .contact_help li:last-child{margin:0}
.contact_help a{color:var(--gcp-link);font-weight:600;overflow-wrap:anywhere}
/* cashbackbin: the page fills the content column (giftcardplace uses a fixed 942px) */
.contact_page{width:auto;padding-top:14px;padding-bottom:8px}
@media (max-width:767px){
  .contact_page{width:auto;padding-top:12px;padding-bottom:4px}
  .contact_page .contact_body{flex-direction:column;gap:18px}
  .contact_help{flex:none;width:100%}
  button.contact_submit{width:100%}
}
/* Contact form on desktop: label and field on one line (label column on the left), errors, captcha and button under the fields */
@media (min-width:768px){
  .contact_field{display:grid;grid-template-columns:130px minmax(0,1fr);column-gap:14px;align-items:center}
  .contact_field label{grid-column:1;margin:0;text-align:right}
  .contact_field input,.contact_field textarea,.contact_field .contact_error,.contact_field > div{grid-column:2}
  .contact_field:has(textarea){align-items:start}
  .contact_field:has(textarea) label{padding-top:11px}
  .contact_field > div:only-child{grid-column:2}
  button.contact_submit{margin-left:144px}
}

/* ===== Sitemap page (Page/Sitemap.jsx), same as giftcardplace.com/content/sitemap: "Sitemap" in the brand header bar,
   link groups 4 across with line icons (stacked rows on phones), an ad above and below ===== */
.sitemap_page{display:block;box-sizing:border-box;padding:14px 0 12px}
.sitemap_page .page_ad{margin:0 0 14px}
.sitemap_page .sitemap_header{float:none;width:auto;height:auto;padding:9px 14px}
.sitemap_page .sitemap_header h1{float:none;margin:0;padding:0;border:0;background:none;font-size:16px;line-height:22px;font-weight:600;color:#fff;text-align:left}
.sitemap_page .sitemap_body{float:none;width:auto;margin:0 0 14px;padding:16px 18px 18px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
.sitemap_sections{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 24px}
.sitemap_section h2{margin:0 0 6px;padding:0 0 8px;border:0;border-bottom:2px solid var(--gcp-tint);background:none;font-size:15px;font-weight:700;color:var(--gcp-brand);text-align:left}
.sitemap_section ul{margin:0;padding:0;list-style:none}
.sitemap_page .sitemap_section li{float:none;margin:0;padding:0;border:0;background:none;list-style:none;font-size:14px;line-height:30px;text-align:left}
.sitemap_page .sitemap_section li a{display:inline-flex;align-items:flex-start;gap:8px;padding:5px 0;line-height:20px;color:var(--gcp-link);text-decoration:none}
.sitemap_page .sitemap_section li a:hover{text-decoration:underline}
.sitemap_page .sitemap_section li a .nav_icon{flex:none;margin-top:2px;color:var(--gcp-brand)}
@media (max-width:767px){
  .sitemap_page{width:100%;padding:0 0 4px}
  .contant_new:has(> .sitemap_page){float:none;width:auto}
  .sitemap_page .sitemap_header,.sitemap_page .sitemap_body{width:auto!important;float:none!important}
  .sitemap_page .sitemap_header{margin:0;padding:12px 15px;background:var(--gcp-brand);border:1px solid var(--gcp-brand);border-radius:12px 12px 0 0}
  .sitemap_page .sitemap_body{margin:0 0 15px;padding:0 15px 8px;background:#fff;border:1px solid var(--gcp-border);border-top:0;border-radius:0 0 12px 12px}
  .sitemap_sections{grid-template-columns:1fr;gap:0}
  .sitemap_section h2{margin:12px -15px 0;padding:8px 15px;border:0;background:var(--gcp-tint);font-size:14px;font-weight:600;color:var(--gcp-text)}
  .sitemap_page .sitemap_section li{display:block;line-height:normal;border-bottom:1px solid var(--gcp-border)}
  .sitemap_page .sitemap_section li:last-child{border-bottom:0}
  .sitemap_page .sitemap_section li a{display:flex;padding:11px 0;font-size:15px}
}

/* phones: the page wrappers are inline-block (inline style in Layouts/Authenticated.jsx), which shrank short pages such as
   the sitemap to their content width; make them full-width blocks */
@media (max-width:767px){
  .pagediv,.pageindiv{display:block!important;width:auto;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
}

/* ===== FAQ page (Page/Faq.jsx): copied from the giftcardplace.com faq.html stylesheet (.gcp-layout, .gcp-faq) ===== */
.gcp-layout{display:grid!important;grid-template-columns:minmax(0,1fr) 170px;gap:24px;align-items:start;width:100%!important;max-width:100%!important;float:none!important;clear:both;box-sizing:border-box}
.gcp-layout__main{min-width:0;float:none!important;width:auto!important}
.gcp-layout__side{width:170px!important;float:none!important;padding-top:16px}
.gcp-layout__side .gcp-ad{text-align:center;box-sizing:border-box;width:170px;padding:4px 4px 4px;background:#fff;border:1px solid #d1d5db;border-radius:12px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
.gcp-layout__side .gcp-ad__slot{width:160px;min-height:600px;margin:0 auto;overflow:hidden;background:#f4f6f5;line-height:0}
.gcp-layout__side .gcp-ad--rail-extra{margin-top:24px}
.gcp-ad--bottom,.gcp-ad--top{clear:both;box-sizing:border-box;width:100%;margin:24px 0 8px;padding:6px 12px 12px;text-align:center!important;background:#fff;border:1px solid #d1d5db;border-radius:12px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
/* desktop 728x90 above the FAQ box: same box as the bottom one, spaced like the other pages' top ads */
.gcp-ad--top{margin:0 0 16px}
:is(.gcp-ad--bottom,.gcp-ad--top) .gcp-ad__slot{width:728px;height:90px;margin:0 auto;overflow:hidden;line-height:0;background:#f4f6f5}
@media (max-width:767px){.gcp-ad--bottom,.gcp-ad--top{display:none}}
.gcp-layout__side .gcp-ad__ph{color:#7a8592;font:13px "Lucida Grande","Lucida Sans",Verdana,Arial,sans-serif}
@media (max-width:767px){.gcp-layout{grid-template-columns:minmax(0,1fr);padding:0 12px}.gcp-layout__side{display:none}}
.gcp-faq{--ink:#1d2430;--muted:#556170;--brand:#1f5c4a;--brand-soft:#e8f1ed;--line:#d8e0dc;--bg:#fff;
  color:var(--ink);background:var(--bg);width:100%!important;max-width:100%!important;float:none!important;margin:0!important;padding:16px 0 48px;
  font-family:"Lucida Grande","Lucida Sans",Verdana,Arial,sans-serif;line-height:1.6;font-size:1rem;box-sizing:border-box}
.gcp-faq *{box-sizing:border-box}
.gcp-faq div,.gcp-faq nav,.gcp-faq section,.gcp-faq details,.gcp-faq summary,.gcp-faq p,.gcp-faq h1,.gcp-faq h2,.gcp-faq h3{width:auto!important;max-width:none;float:none!important;text-align:left!important;letter-spacing:normal;word-spacing:normal}
.gcp-faq h1,.gcp-faq h2,.gcp-faq h3{font-family:inherit;text-decoration:none!important;text-transform:none;background:none}
.gcp-faq time{display:inline!important;font-size:inherit;margin:0;padding:0}
.gcp-faq__head{margin:0 0 4px}
.gcp-faq h1{font-size:24px;line-height:1.3;margin:0 0 .5rem;font-weight:700}
.gcp-faq__lede{color:var(--muted);margin:0 0 .35rem;max-width:72ch!important}
.gcp-faq__updated{color:#6b7280;font-size:.8rem;margin:12px 0 0}
.gcp-faq__nav{display:flex;flex-wrap:wrap;gap:8px;
  padding:10px 0;margin:0 0 8px;border-bottom:1px solid var(--line)}
.gcp-faq__nav a{flex:0 0 auto;padding:8px 14px;border:1px solid var(--line);border-radius:999px;color:var(--ink);
  text-decoration:none;font-size:.9rem;white-space:nowrap;min-height:40px;display:inline-flex;align-items:center}
.gcp-faq__nav a:hover{border-color:var(--brand);color:var(--brand)}
.gcp-faq__section{padding-top:28px;scroll-margin-top:64px}
.gcp-faq__item{scroll-margin-top:64px}
.gcp-faq h2{font-size:clamp(1.25rem,3.2vw,1.5rem);margin:0 0 10px;padding-left:12px;border-left:4px solid var(--brand)}
.gcp-faq__item{border-bottom:1px solid var(--line)}
.gcp-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 10px 16px 4px;min-height:48px}
.gcp-faq summary::-webkit-details-marker{display:none}
.gcp-faq summary h3{flex:1 1 auto;min-width:0;font-size:1.05rem;font-weight:600;margin:0;line-height:1.4;white-space:normal!important;overflow-wrap:anywhere;word-break:normal;hyphens:auto}
.gcp-faq summary::after{content:"";flex:0 0 12px;width:12px;height:12px;border-right:2px solid var(--brand);border-bottom:2px solid var(--brand);
  transform:rotate(45deg) translateY(-3px);transition:transform .2s ease}
.gcp-faq details[open] summary::after{transform:rotate(-135deg) translateY(-3px)}
.gcp-faq details[open] summary h3{color:var(--brand)}
.gcp-faq summary:focus-visible{outline:3px solid var(--brand);outline-offset:2px;border-radius:4px}
.gcp-faq__answer{padding:0 4px 18px;color:var(--muted);max-width:75ch!important}
.gcp-faq__video{margin-top:12px}
.gcp-faq__video iframe{display:block;max-width:100%;height:auto;aspect-ratio:16/9}
.gcp-faq__answer p,.gcp-faq__lede,.gcp-faq h1,.gcp-faq h2{white-space:normal!important;overflow-wrap:anywhere;word-break:normal;hyphens:auto}
.gcp-faq h2{min-width:0}
@media (max-width:599px){
  .gcp-faq{font-size:15px}
  .gcp-faq summary{gap:12px;padding:14px 6px 14px 2px}
  .gcp-faq summary h3{font-size:1rem}
  .gcp-faq__answer{padding:0 2px 16px;max-width:100%!important}
}
.gcp-faq__answer p{margin:0;font-size:1rem}
.gcp-faq__answer p+p,.gcp-faq__answer p+ul,.gcp-faq__answer ul+p{margin-top:10px}
.gcp-faq__answer ul{list-style:disc!important;margin:0!important;padding:0 0 0 22px!important;font-size:1rem}
.gcp-faq__answer li{display:list-item!important;list-style:disc!important;float:none!important;width:auto!important;margin:0 0 6px!important;padding:0 0 0 2px!important;line-height:1.55;text-align:left!important;background:none!important}
.gcp-faq__answer li::marker{color:var(--muted)}
.gcp-faq__answer li strong{color:var(--ink)}
.gcp-faq__lede{font-size:.95rem}
.gcp-faq__cta{margin-top:36px;padding:20px;background:var(--brand-soft);border-radius:12px}
.gcp-faq__cta p{margin:0}
/* answer links in the site link blue (--brand here is the green from the giftcardplace FAQ) */
.gcp-faq a{color:var(--gcp-link)}
@media (prefers-reduced-motion:reduce){.gcp-faq summary::after{transition:none}}
/* the whole FAQ is one section panel: brand header bar on top of a grey-bordered box around the questions */
.gcp-faq{box-sizing:border-box;padding:0 20px 20px;background:#fff;border:1px solid #d1d5db;border-radius:10px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
.gcp-layout__main{padding-top:15px!important}
.gcp-faq h1.gcp-faq__title{margin:0 -20px 16px;padding:9px 14px;background:var(--gcp-brand,#1d4f91);border-radius:9px 9px 0 0;color:#fff;font-size:16px;line-height:22px;font-weight:600}
/* each topic is a grey-bordered box around its questions, headed by a secondary header bar: light brand tint with dark brand text (high contrast), under the brand-blue page title */
.gcp-faq .gcp-faq__section{margin-top:20px;padding:0 16px 6px;border:1px solid #d1d5db;border-radius:10px;background:#fff}
.gcp-faq .gcp-faq__section h2{margin:0 -16px 6px;padding:9px 16px;border:0;border-left:0;border-bottom:1px solid #d1d5db;border-radius:9px 9px 0 0;background:var(--gcp-tint,#eaf1fb);color:var(--gcp-brand-dark,#163f75);font-size:17px;line-height:1.35;font-weight:700}
@media (max-width:767px){.gcp-faq .gcp-faq__section{padding:0 12px 4px}.gcp-faq .gcp-faq__section h2{margin:0 -12px 6px;padding:9px 12px}.gcp-layout__main{padding-top:0!important}.gcp-faq{padding:0 14px 16px;border-radius:12px}.gcp-faq h1.gcp-faq__title{margin:0 -14px 14px;padding:12px 15px;border-radius:11px 11px 0 0;font-family:Arial,Helvetica,sans-serif}}

/* ===== Terms of Use / Privacy Policy (Page/Cmspage.jsx LegalPage): giftcardplace.com terms_page rules ===== */
.terms_page .page_ad{margin:0 0 16px}
.terms_page .terms_body p{margin:0 0 12px;font-size:15px;line-height:1.65;color:var(--gcp-text);text-align:left}
.terms_page .terms_body p:last-child{margin-bottom:0}
.terms_page .terms_body a{color:var(--gcp-link);font-weight:600}
.terms_page .terms_body .terms_updated{margin-top:20px;padding-top:12px;border-top:1px solid var(--gcp-border);color:var(--gcp-muted);font-size:14px}
.terms_page .terms_body .terms_caps{font-size:13px;line-height:1.6}
.terms_page .terms_body .terms_badges{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.terms_page .terms_body .terms_badges img{display:block}
.gcp_section .gcp_section__body ol.terms_list{margin:0 0 12px;padding:0 0 0 22px;list-style:decimal}
.gcp_section .gcp_section__body ol.terms_list li{margin:0 0 6px;padding:0;list-style:decimal;font-size:15px;line-height:1.6;color:var(--gcp-text)}
.gcp_section .gcp_section__body ul.terms_list--bullets{margin:0 0 12px;padding:0 0 0 22px;list-style:disc}
.gcp_section .gcp_section__body ul.terms_list--bullets li{margin:0 0 6px;padding:0;list-style:disc;font-size:15px;line-height:1.6;color:var(--gcp-text)}
.terms_page{width:auto;padding:14px 0 8px}
@media (max-width:767px){.terms_page{padding:0 0 4px}}
/* the CMS text marks headings as a paragraph holding only bold text (<p><strong><u>Heading</u></strong></p>):
   show them like the giftcardplace section headings, without the underline */
.terms_page .terms_body p:has(> strong:only-child){margin:20px 0 10px;padding:0 0 6px;border-bottom:2px solid var(--gcp-tint);font-size:16px;line-height:1.3;font-weight:700;color:var(--gcp-brand)}
.terms_page .terms_body p:has(> strong:only-child):first-child{margin-top:0}
.terms_page .terms_body p > strong:only-child u{text-decoration:none}
.terms_page .terms_body strong{color:inherit}
.terms_page .terms_body a{overflow-wrap:anywhere}

/* ===== Blog list (Page/Blog.jsx): giftcardplace.com blog rules ===== */
.detail_table.blog_table td{width:auto;text-align:left}
.detail_table.blog_table td a:not(.commonbtn){white-space:normal}
.detail_table.blog_table tr+tr td{border-top:1px solid var(--gcp-border)}
/* blog sidebar (desktop): "Like Us on Facebook" section with the page link and a Facebook-blue link button */
.blog_fb{margin:0 0 10px}
.blog_fb .blog_fb__body{padding:14px 14px 16px}
.blog_fb__page{display:flex;align-items:center;gap:10px;color:var(--gcp-link);font-weight:600;text-decoration:none}
.blog_fb__page img{flex:0 0 auto;border:1px solid var(--gcp-border);border-radius:8px;background:#fff}
.blog_fb__page:hover span{text-decoration:underline}
.blog_fb__like{display:flex;align-items:center;justify-content:center;gap:8px;min-height:36px;margin:12px 0 0;padding:0 12px;border-radius:8px;background:#1877f2;color:#fff!important;font-size:14px;font-weight:600;text-decoration:none}
.blog_fb__like:before{content:"";width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10v12'/%3E%3Cpath d='M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z'/%3E%3C/svg%3E") no-repeat center/contain}
.blog_fb__like:hover{background:#166fe5;text-decoration:none}
.blog_rail_ad{box-sizing:border-box;margin:0 0 10px;padding:8px;text-align:center;background:#fff;border:1px solid #d1d5db;border-radius:12px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
.blog_rail_ad__slot{width:160px;height:600px;margin:0 auto;overflow:hidden;line-height:0;background:#f4f6f5}
/* blog list (desktop): articles inside the "Blogs" section, image beside the text, a divider between articles */
.gcp_section .blog_list li{display:flex;gap:18px;align-items:flex-start;padding:16px 0}
.gcp_section .blog_list li:first-child{padding-top:2px}
.gcp_section .blog_list li:last-child{padding-bottom:0}
.gcp_section .blog_list li+li{border-top:1px solid var(--gcp-border)}
.blog_list .images{float:none;flex:0 0 auto;line-height:0}
.blog_list .blog_right_group{float:none;flex:1 1 auto;width:auto;min-width:0}
.blog_list .blog_right_group h2{margin:0 0 4px;padding:0;border:0;font-size:18px;line-height:1.35;font-weight:700}
.blog_list .blog_right_group h2 a{color:var(--gcp-link);text-decoration:none}
.blog_list .blog_right_group h2 a:hover{text-decoration:underline}
.blog_list p.blog_info{margin:0 0 8px;color:var(--gcp-muted);font-size:13px;line-height:1.4}
.blog_list .blog_excerpt{margin:0 0 8px;font-size:15px;line-height:1.6}
.blog_list .blog_excerpt p{margin:0 0 8px}
.blog_list .blog_right_group > a{color:var(--gcp-link)}
.page_ad.blog_bottom_ad{clear:both;margin:6px 0 16px}
@media (max-width:767px){.blog_fb{margin:0 0 15px}.blog_fb__like{min-height:44px;font-size:15px}}
/* phone blog list table: "Blogs" caption as the brand header bar (giftcardplace.com table caption rule) */
.detail_table caption{caption-side:top;background:var(--gcp-brand);color:#fff;font-size:16px;font-weight:600;padding:12px 10px;text-align:left;border-radius:12px 12px 0 0}

/* ===== About Us (Page/AboutUs.jsx): giftcardplace.com about_page rules ===== */
/* About Us page (resources/js/content/about-us.html): one .gcp_section panel and a horizontal ad box below it */
.about_page{width:auto;padding:14px 0 8px}
.about_page .page_ad{margin:0 0 16px}
.about_page .about_body p{margin:0 0 12px;font-size:15px;line-height:1.65;color:var(--gcp-text);text-align:left}
.about_page .about_body p:last-child{margin-bottom:0}
.about_page .about_body a{color:var(--gcp-link);font-weight:600}
@media (max-width:767px){.about_page{padding:0 0 4px}}
/* About Us: lead paragraph and the four "What You Can Do" cards (2 x 2 on desktop, stacked on phones) */
.about_page .about_body .about_lead{font-size:16px}
.gcp_section .gcp_section__body .about_features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0 0 4px}
.gcp_section .gcp_section__body .about_features li{padding:14px 16px;border:1px solid var(--gcp-border);border-radius:10px;background:#f8fafc}
.about_features h3{margin:0 0 6px;padding:0;font-size:16px;line-height:1.3;font-weight:700}
.about_page .about_features h3 a{color:var(--gcp-link)}
.about_page .about_body .about_features p{margin:0;font-size:14px;line-height:1.6;color:var(--gcp-muted)}
@media (max-width:767px){.gcp_section .gcp_section__body .about_features{grid-template-columns:1fr}}
/* cashbackbin has three feature cards: three across on desktop */
@media (min-width:768px){.gcp_section .gcp_section__body .about_features{grid-template-columns:repeat(3,minmax(0,1fr))}}
.about_page .about_body h2{margin:20px 0 10px;padding:0 0 6px;border:0;border-bottom:2px solid var(--gcp-tint);background:none;font-size:16px;line-height:1.3;font-weight:700;color:var(--gcp-brand);text-align:left}
.about_features{list-style:none;padding:0}.about_features li{list-style:none}
/* About Us: "How CashBackBin Works" / "Why Choose Us?" bullet lists */
.about_page .about_body .about_list{margin:0 0 12px;padding-left:22px;list-style:disc}
.about_page .about_body .about_list li{display:list-item;margin:0 0 6px;font-size:15px;line-height:1.65;color:var(--gcp-text);text-align:left}
.about_page .about_body .about_list li::marker{color:var(--gcp-muted)}

/* "Last Updated: ..." (home) and the store page byline ("Updated Feb 15, 2022 by CashBackBin Team"): small light grey line, also on phones */
.update_date,.update_date:has(time){font-size:12px;line-height:18px;color:#9ca3af}
.update_date:has(time) a{color:var(--gcp-link)}

/* ===== Phones: readable text without zooming - body copy, disclaimers, tags, tables and footer notes at 16px ===== */
@media (max-width:767px){
  .home_intro p,
  .headingdiv p, .headingdiv p a,
  .gcpDisclaimer, .gcpDisclaimer span, .gcpDisclaimer p,
  .content_storeA, .content_storeA strong, .content_storeA a, .content_storeA p,
  .site_footer_col li a, .site_footer_bottom p, .site_footer_bottom .site_footer_legal, .site_footer_bottom .site_footer_legal a{font-size:16px;line-height:1.5}
  /* rewards tables: portal names, rates and bonuses */
  /* 14px: the recommended minimum for text that is read on phones (Google flags anything under 12px), same as the column headings */
  .cardtable th, .cardtable td, .cardtable td a, .cardtable td b, .cardtable .card_secondary_text, .cardtable .portal_link, .cardtable .rate_value, .cardtable .bonus_value{font-size:14px!important}
  /* small labels stay compact but legible */
  .commonbtn{font-size:15px}
  .hero_divider span{font-size:14px}
  .site_footer_heading{font-size:14px!important}
  .mob_header_tagline{font-size:12px}
}

/* ===== Store page summary (Storecarddeatil.jsx): the page h1 + the two store links, first on the page ===== */
.store_summary{box-sizing:border-box;padding:16px 20px 18px;text-align:center;background:#fff;border:1px solid var(--gcp-border);border-radius:12px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
.store_summary .store_summary_title{margin:0 0 14px;padding:0;border:0;background:none;color:var(--gcp-text);font-family:inherit;font-size:24px;font-weight:700;line-height:1.25;text-align:center}
/* second line of the h1: "Earn up to 10%" */
.store_summary .store_summary_rate{display:block;margin-top:2px;font-size:.8em;font-weight:600}
/* the two store links: plain underlined text links, one per line, as before */
.store_summary_ctas{display:flex;flex-direction:column;align-items:center;gap:10px}
.store_summary .store_cta{color:var(--gcp-link);font-size:14px;line-height:20px;text-decoration:underline}
@media (max-width:767px){.store_summary .store_cta{font-size:14px;line-height:20px}}
/* table titles are h3s inside the existing caption bars: keep the bar's look */
.cap_title{display:inline;margin:0;padding:0;font:inherit;color:inherit;letter-spacing:inherit}
@media (min-width:768px){
  /* desktop: in the content column beside the right rail, under the search card and top ad */
  .store_summary{float:left;clear:left;width:782px;margin:0 0 12px 8px}
}
@media (max-width:767px){
  /* phones: full-width card above the intro */
  .store_summary{margin:0 0 15px;padding:14px 15px 16px}
  /* 18px keeps "Walmart Cashback Rebate Rates" (and most store names) on one line on a 360px phone */
  .store_summary .store_summary_title{font-size:18px;margin-bottom:12px}
  .store_summary .store_summary_rate{font-size:16px}
}
/* small phones: tighter intro card so the search box comes up sooner */
@media (max-width:599px){
  .home_intro{padding:12px 14px}
  .home_intro .home_intro_title{font-size:19px;margin-bottom:4px}
}

/* ===== Phones: Cashback / Points-Miles toggle above the rewards tables (Storecarddeatil.jsx): jumps to either table ===== */
@media (max-width:767px){
  /* segmented pill bar: soft grey track, the selected option a teal pill with white text; a dollar coin / plane icon before each label
     (white on #00838F is 4.5:1, the #374151 unselected text on #E5E7EB about 8:1; 48px tall tap targets) */
  /* segmented control (balanced): light slate track with a soft border, the active tab a floating white pill with the darkest
     text, the inactive tab slate text with a light highlight on hover */
  .rewards_toggle{display:flex!important;gap:4px;margin:0 0 12px;padding:4px;background:#F1F5F9;border:1px solid #E2E8F0;border-radius:9999px}
  .rewards_toggle_btn{display:flex;align-items:center;justify-content:center;gap:6px;flex:1 1 0;min-height:48px;margin:0;padding:7px 5px;white-space:nowrap;border:1px solid transparent;border-radius:9999px;background:transparent;color:#475569;font-family:inherit;font-size:14px;font-weight:600;line-height:1.2;cursor:pointer;transition:all .15s ease-in-out}
  /* narrow phones (under 390px): 13px, slightly tighter, so both labels stay on one line */
  @media (max-width:389px){.rewards_toggle_btn{font-size:13px;letter-spacing:-.025em}}
  .rewards_toggle_btn:not(.is-active){border-color:#94A3B8}
  .rewards_toggle_btn:not(.is-active):hover{background:rgba(255,255,255,.5);color:#1E293B}
  .rewards_toggle_btn.is-active{background:#fff;color:#0F172A;box-shadow:0 1px 3px rgba(0,0,0,.1),0 1px 2px rgba(0,0,0,.06)}
  .rewards_toggle_btn:focus-visible{outline:2px solid var(--gcp-link);outline-offset:2px}
  .rewards_toggle_icon{flex:none;display:block}
  /* a jump stops just below the pinned header (75px) instead of under it */
  #cashrewards,#points{scroll-margin-top:90px}
}

/* ===== Store page rewards tables (desktop and phones): portal names as plain links, rates and bonuses in black ===== */
.portal_link{color:var(--gcp-link)!important;font-weight:400!important;text-decoration:none!important;text-underline-offset:2px}
/* no underline in the tables; an underline appears on mouse hover / keyboard focus only */
.portal_link:hover,.portal_link:focus-visible,.cardtable .apply_text:hover,.border_tbody .apply_text:hover{text-decoration:underline!important}
.cardtable .apply_text,.border_tbody .apply_text{text-decoration:none!important}
.rate_value{color:#111827!important;font-weight:400!important;text-decoration:none!important}
.bonus_value{color:#111827!important;font-weight:400!important}
/* desktop: the table data was 13px; 15px reads comfortably (phones already use 16px) */
@media (min-width:768px){.portal_link,.rate_value,.bonus_value{font-size:15px!important}}

/* ===== Rewards tables: (?) after the "Bonus" heading, tip shown on hover, tap or keyboard focus (Storecarddeatil.jsx) ===== */
.col_head_help{position:relative;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.col_help{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:16px;height:16px;margin:0;padding:0;border:1px solid currentColor;border-radius:50%;background:none;color:var(--gcp-link);font:700 11px/1 Arial,sans-serif;cursor:help}
/* invisible padding so the small (?) is still a comfortable tap target */
.col_help:before{content:"";position:absolute;inset:-14px}
.col_help:after{content:attr(data-tip);position:absolute;z-index:30;top:calc(100% + 8px);right:-8px;padding:7px 10px;border-radius:6px;background:#1f2937;color:#fff;font:400 13px/1.35 Arial,sans-serif;white-space:normal;width:max-content;max-width:220px;text-align:left;box-shadow:0 4px 12px rgba(15,23,42,.25);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s}
.col_help:hover:after,.col_help:focus-visible:after,.col_help.is-open:after{opacity:1;visibility:visible}
.col_help:focus-visible{outline:2px solid var(--gcp-link);outline-offset:2px}

/* rewards tables: column headings (Reward Portal, Best Rate, Bonus, Portal, Rate, SignUp) in regular weight, desktop and phones */
.border_tbody th, .cardtable tr.headingrow td{font-weight:400!important}

/* cashback tables: Best Rate and Bonus only as wide as their content (width:1% + no wrapping shrinks them to fit),
   Reward Portal takes the rest. Desktop table: the one that is not .cbm2 (Points/Miles); phones: .detail_table_cash */
table:not(.cbm2) > .border_tbody :is(th.store_rate, th.store_bonus, td.lo, td.bonus_amount),
.detail_table_cash td:nth-child(2), .detail_table_cash td:nth-child(3){width:1%!important;white-space:nowrap}
table:not(.cbm2) > .border_tbody :is(th.store_site, td.no_border),
.detail_table_cash td:nth-child(1){width:auto!important}

/* desktop rewards tables: no vertical lines between cells (row lines and the outer frame stay), Reward Portal column
   left-aligned, Bonus amounts in the same black as the rates */
@media (min-width:768px){
  .border_tbody td, .border_tbody th{border-left:0!important;border-right:0!important}
  .border_tbody td:first-child, .border_tbody th:first-child{text-align:left!important;padding-left:12px!important}
  /* Best Rate, Bonus and Signup columns left-aligned too, heading and data on the same 8px inset */
  .border_tbody tr > :nth-child(n+2){text-align:left!important;padding-left:8px!important}
  .border_tbody .bonus_value{color:#111827!important}
}

/* rewards tables, desktop and phones: alternate white / light grey data rows (first row white; the heading row is row 1) */
.border_tbody tr:nth-child(odd) td, .cardtable tbody tr:nth-child(odd):not(.headingrow) td{background:#f5f7fa!important}
.border_tbody tr:nth-child(even) td, .cardtable tbody tr:nth-child(even):not(.headingrow) td{background:#fff!important}
/* phones: a light line under each row, as on desktop */
@media (max-width:767px){
  .cardtable tbody tr:not(.headingrow) td{border-bottom:1px solid var(--gcp-border)!important}
  .cardtable tbody tr:last-child td{border-bottom:0!important}
}

/* phones, store pages: the search card stays pinned under the header while the page scrolls (only where it has no A-Z
   buttons, so it stays small; the header is 75px tall). Above the page content so its suggestion list overlays it */
@media (max-width:767px){
  .home_hero.customdivmobileshow:not(:has(.hero_az)){position:sticky;top:75px;z-index:40;overflow:visible;box-shadow:0 4px 12px rgba(15,23,42,.12)}
  /* overflow is visible so the suggestion list can hang below the card; round the bar's top corners itself */
  .home_hero.customdivmobileshow:not(:has(.hero_az)) .home_section_bar{border-radius:11px 11px 0 0}
}

/* phones: number columns (Best Rate, Bonus / Signup) right-aligned, headings too, so the values line up for scanning;
   a light dash where a portal has no bonus */
@media (max-width:767px){
  .cardtable tr > td:nth-child(n+2){text-align:right!important}
  .cardtable tr.headingrow td:nth-child(n+2) .col_head_help{justify-content:flex-end}
  .cardtable tr > td:last-child{padding-right:12px!important}
}
.no_value{color:#9ca3af}

/* small phones, store pages only: tighter cards above the rates so the store block and table come up sooner
   (body text stays 16px; only padding, gaps and the intro title size shrink) */
@media (max-width:599px){
  body:has(.store_summary) .home_intro{padding:10px 12px;margin-bottom:10px}
  body:has(.store_summary) .home_intro .home_intro_title{font-size:18px;line-height:1.25;margin-bottom:2px}
  /* the 320x50 ad box: no 90px minimum (style.css), just the ad plus 5px */
  body:has(.store_summary) .addiv.horz{min-height:0;padding:5px;margin-bottom:10px;line-height:0}
  body:has(.store_summary) .home_hero{margin-bottom:10px;padding-bottom:10px}
  body:has(.store_summary) .home_section_bar{padding-top:8px;padding-bottom:8px}
  body:has(.store_summary) .search_form{padding-top:10px}
  body:has(.store_summary) .store_summary{padding:10px 12px 12px;margin-bottom:10px}
  body:has(.store_summary) .store_summary .store_summary_title{margin-bottom:8px}
  body:has(.store_summary) .store_summary_ctas{gap:0}
  body:has(.store_summary) .rewards_toggle{margin-bottom:10px}
}



/* phones, store summary: "Shop at Walmart →" and "Save up to 90% on gift cards →" as plain links in the site link blue,
   no underline (an underline shows when pressed / keyboard-focused). Each is padded to a 36px tall tap area (above the
   24px WCAG 2.2 minimum) without
   changing how it looks. Desktop keeps both as underlined text links (the arrows only show on phones) */
.store_summary .cta_arrow{display:none}
@media (max-width:767px){
  .store_summary_ctas{align-items:center;gap:10px}
  .store_summary .store_cta{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;box-sizing:border-box;padding:6px 16px;color:var(--gcp-link)!important;font-size:14px;font-weight:400;line-height:20px;text-decoration:none!important}
  .store_summary .store_cta:active,.store_summary .store_cta:focus-visible{text-decoration:underline!important;text-underline-offset:3px}
  .store_summary .store_cta:focus-visible{outline:2px solid rgba(29,95,168,.35);outline-offset:2px;border-radius:6px}
  .store_summary .cta_arrow{display:inline;font-size:1.1em;line-height:1}
  /* phones: savings tip under the store name, with an inline underlined gift card link */
  .store_summary_note{margin:4px 0 0;padding:0 8px;color:#333;font-size:14px;line-height:21px;text-align:center}
  .store_summary_note a{color:var(--gcp-link);text-decoration:underline;text-underline-offset:2px}
  /* rewards table title bars ("Cashback Rewards", "Points / Miles Rewards"): the same navy bar as "Search Cashback Rebates for Stores" */
  .detail_table_cash thead th, .detail_table_points thead th{background:var(--gcp-brand)!important;color:#fff!important;font-size:16px!important;font-weight:600!important}
}

/* phones: Best Rate and Bonus values left-aligned among themselves, the group centred under its heading.
   Each value sits in a fixed-width box (a little wider than the longest value seen: "$7.35", "$10", "350 mi.") that
   is centred in the cell, so the values share one left edge */
@media (max-width:767px){
  .detail_table_cash tr > td:nth-child(2), .detail_table_cash tr > td:nth-child(3),
  .detail_table_points tr > td:nth-child(2){text-align:center!important}
  .cardtable tr.headingrow td:nth-child(2) .col_head_help, .cardtable tr.headingrow td:nth-child(3) .col_head_help{justify-content:center}
  .cardtable .rate_value, .cardtable .bonus_value{display:inline-block;text-align:left}
  .detail_table_cash .rate_value{min-width:3em}
  .detail_table_cash .bonus_value{min-width:2.3em}
  .detail_table_points .rate_value{min-width:3.6em}
}

/* rewards tables: 16px portal logo before each portal name (desktop and phones) */
.portal_link{display:inline-flex!important;align-items:center;gap:7px;vertical-align:middle}
.portal_icon{flex:none;display:block;width:16px;height:16px;border-radius:3px;object-fit:contain}
/* desktop Points/Miles table: keep the short headings ("Best Rate", "Signup") on one line */
table.cbm2 > .border_tbody th{white-space:nowrap}

/* Signup column: credit card icon link (desktop and phones); 44px tap area, tip on hover / keyboard focus */
.apply_card{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:36px;margin:-6px 0;color:var(--gcp-link)!important;text-decoration:none!important;vertical-align:middle;border-radius:6px}
.apply_card svg{display:block}
.apply_card:hover{color:#163f75!important;background:var(--gcp-tint)}
.apply_card:focus-visible{outline:2px solid var(--gcp-link);outline-offset:1px}
.apply_card:after{content:attr(data-tip);position:absolute;z-index:30;bottom:calc(100% + 6px);right:0;padding:7px 10px;border-radius:6px;background:#1f2937;color:#fff;font:400 13px/1.3 Arial,sans-serif;white-space:nowrap;box-shadow:0 4px 12px rgba(15,23,42,.25);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s}
.apply_card:focus-visible:after{opacity:1;visibility:visible}
@media (hover:hover){.apply_card:hover:after{opacity:1;visibility:visible}}

/* phones: column headings on one line ("Best Rate" was wrapping in the Points/Miles table) */
@media (max-width:767px){.cardtable tr.headingrow td{white-space:nowrap}}
/* Signup column (Points/Miles, desktop and phones): card icons and the heading centred in the column */
table.cbm2 > .border_tbody tr > :nth-child(3){text-align:center!important;padding-left:0!important;padding-right:0!important}
table.cbm2 > .border_tbody th:nth-child(3) .col_head_help{justify-content:center}
@media (max-width:767px){
  .detail_table_points tr > td:nth-child(3){text-align:center!important;padding-left:0!important;padding-right:0!important}
  .detail_table_points tr.headingrow td:nth-child(3) .col_head_help{justify-content:center}
}

/* "ⓘ We may earn a commission ..." note: small light grey, still readable (13px, #6B7280 on white is 4.8:1 - search
   engines can treat text that is too faint or tiny as hidden) */
.gcpDisclaimer .commission_note{font-size:13px!important;line-height:1.45!important;color:#6B7280!important}

/* Bonus amounts (desktop and phones): a sparkles icon before the amount, amber (#b45309 is 5:1 on white). Only the icon
   carries the "New customer bonus available on first purchase." tip: on hover, or on phones a tap (Storecarddeatil.jsx
   toggles .is-open); the amount is a plain link */
.bonus_tip{display:inline-flex;align-items:center;gap:5px}
.bonus_icon_tip{position:relative;display:inline-flex;flex:none;cursor:help}
.bonus_icon{display:block;width:16px;height:16px;color:#b45309}
.bonus_icon_tip:after{content:attr(data-tip);position:absolute;z-index:30;bottom:calc(100% + 6px);left:-10px;width:max-content;max-width:220px;padding:7px 10px;border-radius:6px;background:#1f2937;color:#fff;font:400 13px/1.35 Arial,sans-serif;text-align:left;white-space:normal;box-shadow:0 4px 12px rgba(15,23,42,.25);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s}
.bonus_icon_tip.is-open:after{opacity:1;visibility:visible}
/* hover only on devices with a mouse (a tapped element keeps :hover on touch screens, which would pin the tip open) */
@media (hover:hover){.bonus_icon_tip:hover:after{opacity:1;visibility:visible}}
/* phones: the tip opens leftwards (the Bonus column is at the right edge of the screen) */
@media (max-width:767px){.bonus_icon_tip:after{left:auto;right:-10px}}
/* text only for screen readers */
.sr_only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* touch screens: the credit card icon's tip shown by a first tap (Storecarddeatil.jsx adds .is-open; a second tap opens the link) */
.apply_card.is-open:after{opacity:1;visibility:visible}
/* phones: the bonus column's fixed-width box includes the icon so the amounts still share one left edge */
@media (max-width:767px){.detail_table_cash .bonus_value{min-width:3.4em}}
/* phones' Cashback / Points-Miles switch: the coloured icon, no background */
.rewards_toggle_badge{display:inline-flex;flex:none;align-items:center;justify-content:center;width:18px;height:18px;background:none}
.rewards_toggle_badge svg{display:block}

/* ===== Breadcrumbs (Components/app/Breadcrumbs.jsx): "Home › Stores Starting with W › Walmart" above subpages ===== */
.breadcrumb-container{clear:both;box-sizing:border-box;width:100%;margin:12px 0;padding:0 8px;font-size:14px;line-height:20px;text-align:left}
.breadcrumb{display:flex;flex-wrap:wrap;margin:0;padding:0;list-style:none}
.breadcrumb-item{display:inline;margin:0;padding:0;background:none;color:var(--gcp-muted)}
.breadcrumb-item + .breadcrumb-item::before{content:"›";padding:0 8px;color:#6b7280}
.breadcrumb-item a{color:var(--gcp-link);text-decoration:none}
.breadcrumb-item a:hover{text-decoration:underline}
.breadcrumb-item.active{color:var(--gcp-text);font-weight:600}
/* phones: one compact line that scrolls sideways instead of wrapping (the current page stays in the markup for crawlers) */
@media (max-width:767px){
  .breadcrumb-container{margin:6px 0;padding:0 12px;font-size:12px;line-height:18px}
  .breadcrumb{flex-wrap:nowrap;overflow-x:auto;white-space:nowrap;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .breadcrumb::-webkit-scrollbar{display:none}
  .breadcrumb-item{flex:none}
  .breadcrumb-item + .breadcrumb-item::before{padding:0 5px}
}

/* store page "Walmart Cashback Tags: ..." box (StoreTags in Storecarddeatil.jsx): plain small light grey text, also on phones */
.content_storeA.store_tags,.content_storeA.store_tags strong{font-size:12px;line-height:18px;color:#9ca3af}
.content_storeA.store_tags strong{font-weight:600}

/* store page: the full-width auto ad under the rates (desktop) keeps its 280px when AdSense leaves it unfilled - drop it then,
   so no blank gap is left above the store description (it is at the bottom of the page, so nothing visible jumps) */
.google-auto-placed:has(ins.adsbygoogle[data-ad-status="unfilled"]){display:none!important}
/* stacked bordered boxes (Relevant Stores, then Cashback Tags): one divider line between them instead of two */
.balance_ckeck_border_main:has(+ .balance_ckeck_border_main) .balance_ckeck_border{border-bottom:0;margin-bottom:0}
/* phones: the store page's "Don't miss out Walmart Cashback ..." paragraph at 14px, left aligned (other box text stays 16px) */
@media (max-width:767px){
  .gcpDisclaimer p.store_promo_text{font-size:14px;line-height:1.5;text-align:left!important}
}

/* store page "Relevant Stores" section (RelevantStores in Storecarddeatil.jsx): a brand header bar like the rates tables, then the
   stores as plain inline text "[ Dell Home · 10.5% ]   [ Apple Store · 4.2% ]" - only the store name is the link */
.relevant-stores{clear:both;box-sizing:border-box;width:100%;margin:12px 0;background:#fff;border:1px solid var(--gcp-border);border-radius:10px;text-align:left}
.relevant-stores__head{padding:10px 12px;background:var(--gcp-brand);color:#fff;font-size:15px;font-weight:600;line-height:20px;border-radius:9px 9px 0 0}
.store-pills{display:flex;flex-wrap:wrap;gap:6px 22px;margin:0;padding:12px;list-style:none;font-size:14px;line-height:22px}
.store-pills li{display:inline;margin:0;padding:0;white-space:nowrap;color:var(--gcp-text)}
.store-pills .br,.store-pills .sep{color:#9ca3af}
.store-pills .br:first-child{margin-right:4px}
.store-pills .br:last-child{margin-left:4px}
.store-pills .sep{margin:0 6px}
.relevant-stores .store-pills a{color:var(--gcp-link);font-weight:600;text-decoration:none}
.relevant-stores .store-pills a:hover{text-decoration:underline}
.store-pills .rate{font-weight:600}
/* phones: the list version (RelevantStores list) as its own card with the header bar of "Search Cashback Rebates for Stores"
   (.home_hero / .home_section_bar on store pages): one store per row, store icon, "Walmart - Earn 10% cashback" */
@media (max-width:767px){
  .relevant-stores{margin:0 0 10px;border-radius:12px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
  .relevant-stores__head{padding:8px 15px;font-size:16px;line-height:21px;border-radius:11px 11px 0 0}
  .relevant-stores--list .store-pills{display:block;padding:4px 15px 8px}
  .relevant-stores--list .store-pills li{display:flex;align-items:center;gap:10px;padding:9px 0;white-space:normal;border-bottom:1px solid var(--gcp-border);font-size:14px;line-height:20px}
  .relevant-stores--list .store-pills li:last-child{border-bottom:0}
  .relevant-stores--list .store_logo{flex:none;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;background:var(--gcp-tint);color:var(--gcp-brand)}
  .relevant-stores--list .store_logo svg{display:block}
  .relevant-stores--list .store-pills a{font-size:14px;line-height:20px}
  .relevant-stores--list .store_line{min-width:0}
  .relevant-stores--list .store-pills .rate{font-weight:400;color:var(--gcp-text);white-space:normal}
}

/* store page (desktop): the boxes under the rates and the right-rail ads (store description, then an ad box) - full width of
   the page below the rail instead of style.css's fixed 755px, left edge in line with the rates column */
.whitediv ~ .balance_ckeck_content_ads.customdivdesktopshow{box-sizing:border-box;width:auto;margin:10px 0 0 8px!important}
/* that ad box's 0x0 slot is never requested (the ad loader skips zero-width slots), so it only showed an empty frame:
   hidden unless AdSense fills it */
.whitediv ~ .balance_ckeck_content_ads.customdivdesktopshow:has(ins.adsbygoogle):not(:has(ins.adsbygoogle[data-ad-status="filled"])){display:none!important}
/* store page "Walmart Cashback Tags:" box: no top / bottom divider lines */
.balance_ckeck_border:has(> .store_tags){border-top:0!important;border-bottom:0!important}
/* store page "About Walmart" box: description text at 14px (desktop and phones; the heading keeps its size) */
.content_storeA.store_about p,.content_storeA.store_about .content_storeA_box_detials,.content_storeA.store_about .content_storeA_box_detials span{font-size:14px!important;line-height:1.55!important}

/* page <h1>s that are the phones' copy (the desktop copy is a role="heading" div): same look as the headings they replaced */
@media (max-width:767px){
  /* A-Z store lists: the blue panel header (was the panel's h2) */
  .panelbox.blue h1{display:block;margin:0 -15px 15px;padding:12px 15px;border:0;border-radius:12px 12px 0 0;background:var(--gcp-brand);color:#fff;font-family:inherit;font-size:16px;font-weight:600;line-height:22px;text-align:left}
  /* blog list: the h1 inside the table's brand caption takes the caption's text style */
  .detail_table caption h1.blog_list_h1{margin:0;padding:0;border:0;background:none;font:inherit;color:inherit;text-align:inherit}
}

/* ===== 404 page (Page/Notfound.jsx): same layout as the giftcardplace.com one - brand header bar, illustration, store search,
   helpful links grid ===== */
.notfound_page{box-sizing:border-box;width:100%;padding:20px 0 24px}
.notfound_header{padding:9px 14px;background:var(--gcp-brand);border:1px solid var(--gcp-brand);border-radius:10px 10px 0 0}
.notfound_header h1{float:none;display:block;margin:0;padding:0;border:0;background:none;font-size:16px;line-height:22px;font-weight:600;color:#fff;text-align:left}
.notfound_body{padding:24px 28px 28px;text-align:center;color:var(--gcp-text);background:#fff;border:1px solid var(--gcp-border);border-top:0;border-radius:0 0 10px 10px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
.notfound_art{display:block;max-width:100%;height:auto;margin:0 auto 12px}
.notfound_lead{max-width:560px;margin:0 auto 20px;font-size:15px;line-height:1.6;text-align:center}
/* store search: the home page's search pill and suggestion list (theme rules for .search_full / .search_pill / .suggestionboxurl);
   the list shows whenever it has results (the home page shows it with jQuery) */
.notfound_searchbox{display:block;box-sizing:border-box;width:100%;max-width:560px;margin:0 auto;text-align:left}
.notfound_searchbox .suggestionboxurl{display:block}
.notfound_links_title{margin:28px 0 12px;padding:0;border:0;background:none;font-size:15px;font-weight:600;line-height:1.4;color:var(--gcp-text);text-align:center}
.notfound_links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;max-width:560px;margin:0 auto;padding:0;list-style:none}
.notfound_links li{margin:0;padding:0}
.notfound_links a{display:flex;align-items:center;gap:10px;padding:12px 14px;font-size:14px;line-height:1.3;color:var(--gcp-link);text-align:left;text-decoration:none;background:var(--gcp-tint);border:1px solid transparent;border-radius:8px}
.notfound_links a:hover{border-color:var(--gcp-link);text-decoration:underline}
.notfound_links .nav_icon{flex:0 0 auto;color:var(--gcp-brand)}
@media (max-width:767px){
  .notfound_page{padding:12px 0 4px}
  .notfound_header{padding:12px 15px;border-radius:12px 12px 0 0}
  .notfound_body{margin:0 0 15px;padding:18px 15px 20px;border-radius:0 0 12px 12px}
  .notfound_art{width:180px}
  .notfound_links{grid-template-columns:1fr}
}
.search_suggest_sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* store page: the "No Cashback Rewards / No Miles/Points Rewards are currently available for this store." boxes - one style
   for both tables, desktop and phones */
.no-store-msg,.no-more-points{margin:10px;padding:8px 10px;border:1px solid var(--gcp-border);border-radius:8px;background:var(--gcp-page);color:var(--gcp-muted);font-size:14px;line-height:1.5;text-align:center}
/* home: Most Popular Cashback Stores - same header bar and rows as the giftcardplace.com phone "Best Discount Gift Card Deals"
   list (navy bar with a yellow pill link; small logo, linked store name, muted "- 10% cashback"); one store per row on phones,
   three columns on desktop */
.home_pop--mob{margin:0 0 15px;padding:0 15px 15px;background:#fff;border:1px solid var(--gcp-border);border-radius:12px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.06)}
.home_pop .home_pop__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin:0 -15px 6px;padding:10px 15px;background:var(--gcp-brand);border-radius:12px 12px 0 0}
.home_pop .home_pop__head h2{flex:1 1 180px;min-width:0;margin:0;padding:4px 0;border:0;border-radius:0;background:none;color:#fff;font-family:inherit;font-size:16px;font-weight:600;line-height:22px;text-align:left}
.home_pop .header-link-pill{position:relative;flex:none;display:inline-flex;align-items:center;margin-left:auto;padding:4px 10px;border-radius:14px;background-color:#FFD166;color:#0f2a4a!important;font-size:13px;font-weight:600;line-height:1.3;white-space:nowrap;text-decoration:none!important;transition:background-color .15s}
.home_pop .header-link-pill:before{content:"";position:absolute;inset:-9px 0}
.home_pop .header-link-pill:hover,.home_pop .header-link-pill:focus-visible{background-color:#FFC53D}
.home_pop .header-link-pill:focus-visible{outline:2px solid #fff;outline-offset:2px}
.home_pop .header-link-pill .panel_head_arrow{margin-left:4px;font-size:18px;line-height:1}
.home_pop ul{display:block;margin:0;padding:0;list-style:none}
.home_pop ul li{display:block;margin:0;padding:0;border-bottom:1px solid var(--gcp-border);list-style:none}
.home_pop ul li:last-child{border-bottom:0}
.home_pop ul li a{display:flex;align-items:center;gap:10px;box-sizing:border-box;min-height:48px;padding:12px 0;color:var(--gcp-link);font-family:inherit;font-size:14px;font-weight:500;line-height:1.4;text-align:left;text-decoration:none}
.home_pop ul li a:hover{color:#174d88}
.home_pop .az_logo{flex:0 0 auto;display:block;width:32px;height:20px;object-fit:contain;border:1px solid var(--gcp-border);border-radius:3px;background:#fff}
.home_pop .az_off{color:var(--gcp-muted);font-size:13px;font-weight:400;text-decoration:none}
/* desktop: the bar runs edge to edge in the white box, rows in three columns; the last row has no bottom line */
.home_pop--desk .home_pop__head{margin:0 0 6px;border-radius:0}
.home_pop--desk+.home_pop--desk{margin-top:12px}
.home_pop--desk ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;padding:0 15px}
.home_pop--desk ul li:last-child{border-bottom:1px solid var(--gcp-border)}
.home_pop--desk ul li:nth-child(3n+1):nth-last-child(-n+3),.home_pop--desk ul li:nth-child(3n+1):nth-last-child(-n+3)~li{border-bottom:0}
/* phones, home: "How Cashback Works?" text at 13px and left aligned (the other phone text boxes stay 16px, centred) */
@media (max-width:767px){.headingdiv.home_how p{font-size:13px;text-align:left}}
/* home: "How Cashback Works" text (Home.jsx HowCashbackWorksText) - h3 sub-headings, numbered steps and vendor bullets, left
   aligned on desktop and phones */
.how_cb{text-align:left}
.how_cb h3{margin:16px 0 6px;padding:0;border:0;background:none;color:var(--gcp-text);font-family:inherit;font-size:16px;font-weight:700;line-height:1.35;text-align:left}
.how_cb ol,.how_cb ul{margin:6px 0 10px;padding-left:22px}
.how_cb ol{list-style:decimal}
.how_cb ul{list-style:disc}
.how_cb li{display:list-item;margin:0 0 6px;padding:0;line-height:1.6;text-align:left}
.how_cb li::marker{color:var(--gcp-muted)}
.how_cb .how_cb__tip{margin:4px 0 0;color:var(--gcp-muted)}
.how_cb a{color:var(--gcp-link)}
@media (max-width:767px){
  .headingdiv.home_how h2{text-align:left}
  .how_cb h3{font-size:15px}
  .how_cb li{font-size:13px}
}