/*
 * Aperture "Floating" product display for Vintage Camera Deals.
 * Loaded after aperture.css. Product photos are shot on white, so the
 * white is blended away (mix-blend-mode: multiply) and each item floats
 * over the page with a soft contact shadow: no frames, no card lines.
 * Purely visual: no product data is touched. Remove the <link> to undo.
 */

/* ---------- white page so the white photo backgrounds disappear completely ---------- */
:root{--ap-bg:#ffffff}
body,#content{background:#ffffff}
.breadcrumb{border-bottom-color:#e6e8e3}

/* ---------- product grids: frameless, floating ---------- */
.product-layout .product-thumb{background:transparent;border:0;border-radius:0;padding-top:0;overflow:visible;color:var(--ap-ink);box-shadow:none;margin-bottom:28px}
.product-layout .product-thumb::before,.product-thumb .ap-frame-no{display:none}
.ap-sheet .product-thumb .image img{filter:none!important}
.product-thumb .image{position:relative;padding:20px 18px 30px;background:transparent}
.product-thumb .image a{display:block;position:relative;z-index:1;mix-blend-mode:multiply}
.product-thumb .image img{background:transparent!important;border-radius:0;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.product-thumb .image::after{content:"";position:absolute;left:20%;right:20%;bottom:14px;height:16px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(20,24,21,.30),rgba(20,24,21,0));transition:transform .55s cubic-bezier(.2,.7,.2,1),opacity .55s;z-index:0;pointer-events:none}
.product-thumb:hover .image img,.product-thumb:focus-within .image img{transform:translateY(-12px) scale(1.03)}
.product-thumb:hover .image::after,.product-thumb:focus-within .image::after{transform:scale(.78);opacity:.55}

/* a slow, barely-there drift so the shelf feels alive (off for reduced motion) */
@media (prefers-reduced-motion:no-preference){
  .product-thumb .image a{animation:apDrift 6s ease-in-out infinite}
  .product-layout:nth-child(3n+2) .product-thumb .image a{animation-delay:-2s}
  .product-layout:nth-child(3n) .product-thumb .image a{animation-delay:-4s}
  .product-thumb:hover .image a{animation-play-state:paused}
}
@keyframes apDrift{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}

/* caption: quiet type under the item, no box */
.product-thumb .caption{padding:0 10px;min-height:0;text-align:center}
.product-thumb .caption h4{margin:0 0 6px}
.product-thumb .caption h4 a{color:var(--ap-ink);font-family:var(--ap-body);font-weight:500;font-size:15px;line-height:1.35}
.product-thumb .caption h4 a:hover,.product-thumb .caption h4 a:focus{color:var(--ap-accent-dk)}
.product-thumb .caption > p:not(.price){color:var(--ap-muted);font-size:13px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.product-thumb .caption p.price,.product-thumb .price{color:var(--ap-ink);font-family:var(--ap-mono);font-size:16px;margin:6px 0 4px}
.product-thumb .price-new{color:var(--ap-accent-dk)}
.product-thumb .price-old{color:var(--ap-muted);text-decoration:line-through}
.product-thumb .caption .price-tax,.product-thumb .price-tax{display:block;color:var(--ap-muted);font-size:11px}
.product-thumb .rating{display:none}

/* actions: plain text buttons, revealed on hover where a mouse can hover */
.product-thumb .button-group{background:transparent;border:0;display:flex;justify-content:center;gap:4px;overflow:visible}
.product-thumb .button-group button{width:auto;flex:0 0 auto;float:none;background:transparent;border:0!important;color:var(--ap-ink);
  font-family:var(--ap-mono);font-size:12px;text-transform:uppercase;letter-spacing:.06em;padding:8px 10px;min-height:44px;line-height:1}
.product-thumb .button-group button:hover,.product-thumb .button-group button:focus{background:transparent;color:var(--ap-accent-dk)}
.product-thumb .button-group button + button{border-left:0}
@media (hover:hover){
  .product-thumb .button-group{opacity:0;transform:translateY(-6px);transition:opacity .3s,transform .3s}
  .product-thumb:hover .button-group,.product-thumb:focus-within .button-group{opacity:1;transform:none}
}

/* list view keeps the same frameless look */
.product-list .product-thumb .image{float:left;padding:10px 24px 26px 0}
.product-list .product-thumb .caption{text-align:left}
.product-list .product-thumb .button-group{justify-content:flex-start}

/* ---------- product page: the main photo floats too ---------- */
#product-product .thumbnails .img-thumbnail,#product-product .thumbnails a.thumbnail{border:0;background:transparent;box-shadow:none;padding:0}
#product-product .thumbnails>li>a,#product-product .thumbnails .image-additional>a{mix-blend-mode:multiply}
#product-product .thumbnails>li:first-child>a::after{content:"";position:absolute;left:22%;right:22%;bottom:-6px;height:18px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(20,24,21,.28),rgba(20,24,21,0));pointer-events:none}
#product-product .thumbnails .image-additional a{transition:transform .3s}
#product-product .thumbnails .image-additional a:hover{transform:translateY(-4px)}

/* =====================================================================
   SITE-WIDE "Fresh white" layer (v3): every page white, frameless,
   separated by space and soft floating shadows instead of lines.
   ===================================================================== */
:root{--ap-panel:#ffffff;--ap-line:transparent;--ap-soft:#f5f6f3;--ap-float:0 14px 34px -18px rgba(20,24,21,.28),0 2px 6px -2px rgba(20,24,21,.08)}

/* header: white, ink type, no rules */
#top{background:#fff;border:0;padding:6px 0}
#top,#top a,#top .btn-link,#top-links a,#top-links li{color:var(--ap-muted)}
#top a:hover,#top .btn-link:hover{color:var(--ap-accent-dk)}
#top .dropdown-menu{border:0;box-shadow:var(--ap-float)}
header{background:#fff;border:0;padding:18px 0 12px}
#search .form-control{background:var(--ap-soft);border:0;color:var(--ap-ink);box-shadow:none}
#search .form-control::placeholder{color:var(--ap-muted)}
#search .btn-lg{background:var(--ap-soft);border:0;color:var(--ap-ink);box-shadow:none}
#cart>.btn,#cart>.btn:hover{background:var(--ap-soft);border:0;color:var(--ap-ink);border-radius:22px}
#cart .dropdown-menu{border:0;box-shadow:var(--ap-float)}
#menu{background:#fff;border:0;min-height:48px;margin-bottom:6px}
#menu .nav>li>a{color:var(--ap-ink);border-bottom:2px solid transparent}
#menu .nav>li>a:hover,#menu .nav>li.open>a{background:transparent;color:var(--ap-accent-dk);border-bottom-color:var(--ap-accent)}
#menu .dropdown-menu{background:#fff;border:0;border-radius:6px;box-shadow:var(--ap-float)}
#menu .dropdown-inner a{color:var(--ap-ink)}
#menu .dropdown-inner a:hover{background:var(--ap-soft);color:var(--ap-accent-dk)}
#menu .see-all{border:0;background:var(--ap-soft);color:var(--ap-ink)}
#menu #category,#menu .btn-navbar{color:var(--ap-ink)}
#menu .btn-navbar{background:var(--ap-soft);border:0;box-shadow:none;text-shadow:none}
.breadcrumb{border:0!important;padding-left:0;margin-bottom:18px}

/* buttons, forms, tables, tabs: no outlines, soft fills */
.btn-default{background:var(--ap-soft);border-color:transparent;color:var(--ap-ink);box-shadow:none;text-shadow:none}
.btn-default:hover,.btn-default:focus{background:#eaece7;border-color:transparent}
.btn-primary{border-color:transparent;border-radius:22px;padding-left:18px;padding-right:18px}
.btn-primary:hover,.btn-primary:focus{border-color:transparent}
.form-control{background:var(--ap-soft);border-color:transparent;box-shadow:none}
.form-control:focus{background:#fff;border-color:var(--ap-accent);box-shadow:0 0 0 3px rgba(217,102,27,.15)}
.has-error .form-control{border-color:#a94442}
.input-group-addon{background:var(--ap-soft);border-color:transparent}
.table,.table>thead>tr>th,.table>tbody>tr>td,.table>tfoot>tr>td,.table-bordered,.table-bordered>thead>tr>th,.table-bordered>tbody>tr>td,.table-bordered>tfoot>tr>td{border-color:transparent!important}
.table>thead>tr>th,.table>thead>tr>td{font-family:var(--ap-mono);font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--ap-muted);font-weight:500}
.table>tbody>tr:nth-child(odd)>td{background:var(--ap-soft)}
.table>tfoot>tr>td{font-family:var(--ap-mono)}
.table .img-thumbnail{border:0;background:transparent;mix-blend-mode:multiply}
.nav-tabs{border-bottom:0}
.nav-tabs>li>a,.nav-tabs>li>a:hover{border:0!important;border-radius:22px;color:var(--ap-muted);background:transparent}
.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover,.nav-tabs>li.active>a:focus{border:0!important;background:var(--ap-soft);color:var(--ap-ink)}
.tab-content{padding-top:14px}
.pagination>li>a,.pagination>li>span{border:0;background:transparent;color:var(--ap-ink);border-radius:50%!important;margin:0 2px;min-width:38px;text-align:center}
.pagination>.active>a,.pagination>.active>span,.pagination>.active>a:hover{background:var(--ap-ink);color:#fff}
.alert{border:0;border-radius:6px;box-shadow:var(--ap-float)}
hr{border-top-color:transparent;margin:26px 0}
.well{background:#fff;border:0;border-radius:8px;box-shadow:var(--ap-float)}

/* panels (checkout, cart, account): floating sheets, no lines */
.panel,.panel-default{border:0;border-radius:8px;box-shadow:var(--ap-float);background:#fff;margin-bottom:22px}
.panel-default>.panel-heading,#checkout-checkout .panel-default>.panel-heading{background:#fff;border:0;border-radius:8px 8px 0 0;padding:16px 18px 6px}
.panel-default>.panel-heading+.panel-collapse>.panel-body,.panel-body{border-top:0!important}
.panel-title,.panel-title a{font-family:var(--ap-body);font-weight:600;color:var(--ap-ink)}
.panel-footer{background:#fff;border:0}

/* left/right columns and category refine list */
.list-group{box-shadow:none}
.list-group-item,a.list-group-item{border:0;background:transparent;color:var(--ap-ink);padding:8px 0;border-radius:0!important}
a.list-group-item:hover,a.list-group-item:focus{background:transparent;color:var(--ap-accent-dk)}
.list-group-item.active,.list-group-item.active:hover,.list-group-item.active:focus{background:transparent;color:var(--ap-accent-dk);font-weight:600;border:0}
#content>.row .img-thumbnail,#product-category .img-thumbnail{border:0;background:transparent;mix-blend-mode:multiply}
#product-category .form-control,#product-search .form-control{background:var(--ap-soft)}
.product-filter,#content .well-sm{background:transparent;box-shadow:none}

/* home hero panel: no box, text floats beside the canvas */
.ap-hero{background:transparent;border:0;border-radius:0;padding:28px 0}

/* product page: data plate without a frame */
#product-product .col-sm-4>ul.list-unstyled:first-of-type{border:0;background:var(--ap-soft);border-radius:8px;padding:14px 16px}
#product-product #button-cart{border-color:transparent;border-radius:24px}
#product-product #input-quantity{background:var(--ap-soft);border:0}

/* content pages (.vp): white heroes, floating cards */
.vp-hero{background:transparent;color:var(--ap-ink);border-radius:0;padding:40px 0 18px;overflow:visible}
.vp-hero::before,.vp-hero::after{display:none}
.vp-hero h2{color:var(--ap-ink)}.vp-hero h2 em{color:var(--ap-accent-dk)}
.vp-hero p{color:var(--ap-muted)}
.vp-hero .vp-frame-no{top:12px;right:0;color:var(--ap-muted)}
.vp-btn{border-color:transparent;border-radius:24px}
.vp-btn--ghost,.vp .vp-section .vp-btn--ghost{background:var(--ap-soft);color:var(--ap-ink)!important;border-color:transparent}
.vp-btn--ghost:hover,.vp-btn--ghost:focus{background:#eaece7;border-color:transparent}
.vp-steps li{background:#fff;border:0;border-radius:10px;box-shadow:var(--ap-float)}
.vp-card{background:#fff;border:0;border-radius:10px;box-shadow:var(--ap-float);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
a.vp-card:hover,a.vp-card:focus{transform:translateY(-6px);box-shadow:0 22px 40px -18px rgba(20,24,21,.34),0 2px 6px -2px rgba(20,24,21,.08)}
.vp-tool{border:0;border-radius:12px;background:#fff;box-shadow:var(--ap-float)}
.vp-tool input,.vp-tool select,.vp-tool textarea{background:var(--ap-soft);border:1px solid transparent;border-radius:6px}
.vp-tool input:focus,.vp-tool select:focus,.vp-tool textarea:focus{background:#fff;border-color:var(--ap-accent);outline:0}
.vp-out{background:var(--ap-soft);color:var(--ap-ink)}
.vp-faq details{border-bottom:0;padding:14px 0}
.vp-faq details+details{box-shadow:0 -1px 0 rgba(20,24,21,.05)}
.vp-band{background:var(--ap-soft);color:var(--ap-ink);border-radius:12px}
.vp-band p{color:var(--ap-ink)}
.vp-tags li{border:0;background:var(--ap-soft)}

/* footer: soft grey, ink type, no rules */
footer{background:var(--ap-soft);color:var(--ap-ink);margin-top:48px;padding-top:34px}
footer h5{color:var(--ap-accent-dk)}
footer a{color:var(--ap-ink)}
footer a:hover{color:var(--ap-accent-dk)}
footer hr{border-top-color:transparent}
footer p{color:var(--ap-muted)}
.vp-out b{color:var(--ap-accent-dk)}

/* v4 readability: fields need a visible edge on white; darker links in content */
.form-control,#search .form-control,.vp-tool input,.vp-tool select,.vp-tool textarea,#product-product #input-quantity{background:#fff;border:1px solid #cfd3cc}
#search .form-control{border-right:0}
#search .btn-lg{border:1px solid #cfd3cc;border-left:0;background:#fff}
.form-control:focus,.vp-tool input:focus,.vp-tool select:focus,.vp-tool textarea:focus{border-color:var(--ap-accent)}
.vp a:not(.vp-btn):not(.vp-card),#content p a{color:var(--ap-accent-dk);text-decoration:underline}
.vp-eyebrow,.ap-eyebrow{color:#4f554e}

/* v5 large, crisp photos: fill the column, never upscale in the browser beyond the served size */
.product-thumb .image img{width:100%;height:auto;max-width:100%;image-rendering:auto}
#product-product .thumbnails>li:first-child img{width:100%;height:auto}
#product-product .thumbnails .image-additional img{width:100%;height:auto}
.vp a[style*="e7a640"],.vp a:not(.vp-btn):not(.vp-card){color:var(--ap-accent-dk)!important}
.vp-hero .vp-eyebrow,.vp-hero p.vp-eyebrow,.vp .vp-eyebrow{color:#4f554e}

/* v6 speed: no constant drift on large photos (hover lift stays); phone breadcrumb wraps */
.product-thumb .image a{animation:none!important}
.breadcrumb>li{white-space:normal;overflow-wrap:anywhere}
.breadcrumb{max-width:100%;overflow:hidden}