/* Avery interior-page art direction — shared visual language from the approved homepage. */
.avery-site{
  --avery-navy:#101827;
  --avery-navy-2:#0d1729;
  --avery-coral:#ef775d;
  --avery-gold:#ffc66e;
  --avery-teal:#62d5ca;
  --avery-cream:#f5f0e7;
  background:var(--avery-cream);
  overflow-x:hidden;
}

/* Dark navigation shared with the homepage. */
.avery-site .site-header{background:rgba(10,17,31,.88);border-bottom:1px solid rgba(255,255,255,.1);color:#fff}
.avery-site .site-header .brand-copy,.avery-site .site-header .nav a{color:#fff}
.avery-site .site-header .brand-copy small{color:#aeb9ca}
.avery-site .site-header .nav a{opacity:.82}
.avery-site .site-header .nav a:hover,.avery-site .site-header .nav a[aria-current="page"]{opacity:1;color:#fff}
.avery-site .site-header .nav-cta{background:var(--avery-gold);color:var(--avery-navy)!important;opacity:1}
.avery-site .site-header .menu-btn{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.08)}
.avery-site .site-header .menu-btn span,.avery-site .site-header .menu-btn span::before,.avery-site .site-header .menu-btn span::after{background:#fff}

/* Half-time interior loader. JS supplies the motion timing; CSS only owns appearance. */
.avery-site .pixel-loader{position:fixed;inset:0;z-index:9999;overflow:hidden;background:transparent;opacity:1;visibility:visible;pointer-events:none;transition:opacity .138s ease,visibility 0s linear .138s}
.avery-site .pixel-loader.is-fading{opacity:0;visibility:hidden}
.avery-site .page-color-reveal{position:fixed;left:0;right:0;top:82px;bottom:0;z-index:9998;background:#fff;opacity:1;visibility:visible;pointer-events:none;transition:opacity var(--page-reveal-duration,1s) linear,visibility 0s linear var(--page-reveal-duration,1s);will-change:opacity}
.avery-site .page-color-reveal.is-revealed{opacity:0;visibility:hidden}
.avery-site .pixel-loader__stream{position:absolute;inset:0;overflow:hidden}
.avery-site .pixel-drop{position:absolute;left:var(--x);width:var(--s);height:var(--s);background:var(--c);opacity:var(--a);box-shadow:0 8px 20px rgba(16,24,39,.12);transform:translate3d(0,0,0);animation-duration:var(--d);animation-timing-function:linear;animation-delay:var(--delay);animation-iteration-count:1;animation-fill-mode:both;will-change:transform,opacity}
.avery-site .pixel-drop.is-down{top:calc(-1 * var(--s));bottom:auto;animation-name:avery-interior-rain-down}
.avery-site .pixel-drop.is-up{top:auto;bottom:calc(-1 * var(--s));animation-name:avery-interior-rain-up}
@keyframes avery-interior-rain-down{0%{opacity:0;transform:translate3d(0,0,0)}4%{opacity:var(--a)}92%{opacity:var(--a)}100%{opacity:0;transform:translate3d(0,calc(100vh + var(--s) * 2),0)}}
@keyframes avery-interior-rain-up{0%{opacity:0;transform:translate3d(0,0,0)}4%{opacity:var(--a)}92%{opacity:var(--a)}100%{opacity:0;transform:translate3d(0,calc(-100vh - var(--s) * 2),0)}}

/* Interior heroes: dark gallery stage with a page-specific color field. */
.avery-site .page-hero{
  --page-accent:var(--avery-coral);
  --page-accent-2:var(--avery-teal);
  position:relative;
  isolation:isolate;
  padding:78px 0 88px;
  background:var(--avery-navy-2)!important;
  color:#fff;
  border-bottom:0;
  overflow:hidden;
}
.avery-site .page-hero--websites{--page-accent:var(--avery-teal);--page-accent-2:var(--avery-gold)}
.avery-site .page-hero--printing{--page-accent:var(--avery-gold);--page-accent-2:var(--avery-coral)}
.avery-site .page-hero--design{--page-accent:var(--avery-coral);--page-accent-2:var(--avery-teal)}
.avery-site .page-hero--publications{--page-accent:var(--avery-gold);--page-accent-2:var(--avery-teal)}
.avery-site .page-hero--service{--page-accent:var(--avery-coral);--page-accent-2:var(--avery-gold)}
.avery-site .page-hero--portfolio{--page-accent:var(--avery-teal);--page-accent-2:var(--avery-coral)}
.avery-site .page-hero--about{--page-accent:var(--avery-gold);--page-accent-2:var(--avery-teal)}
.avery-site .page-hero--contact{--page-accent:var(--avery-coral);--page-accent-2:var(--avery-gold)}
.avery-site .page-hero::before{content:"";position:absolute;z-index:-2;inset:0;background:radial-gradient(circle at 72% 36%,color-mix(in srgb,var(--page-accent-2) 20%,transparent),transparent 31%),linear-gradient(108deg,rgba(13,23,41,1) 0%,rgba(13,23,41,.98) 47%,rgba(13,23,41,.76) 72%,rgba(13,23,41,.56) 100%);pointer-events:none}
.avery-site .page-hero::after{content:"";position:absolute;z-index:-1;width:clamp(360px,42vw,640px);height:clamp(360px,42vw,640px);right:-13vw;bottom:-23vw;border-radius:0;background:var(--page-accent);opacity:.88;transform:rotate(18deg);pointer-events:none}
.avery-site .page-hero-grid{grid-template-columns:minmax(0,.92fr) minmax(420px,1.08fr);gap:46px;min-height:560px}
.avery-site .page-hero-copy{max-width:700px}
.avery-site .page-hero .h1{font-size:clamp(3.35rem,5.9vw,6.2rem);line-height:.94;letter-spacing:-.057em;font-weight:900}
.avery-site .page-hero .lead{color:#d5deea;max-width:650px;margin-top:27px}
.avery-site .page-hero .eyebrow{color:var(--avery-gold)}
.avery-site .page-hero .breadcrumbs,.avery-site .page-hero .breadcrumbs a{color:#98a6b9}
.avery-site .page-hero .pill{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);color:#e2e8f0;box-shadow:none;backdrop-filter:blur(8px)}
.avery-site .page-hero .btn-primary{background:var(--page-accent);color:var(--avery-navy);box-shadow:0 14px 30px rgba(0,0,0,.22)}

/* Make the existing square collages feel like the homepage's artwork wall. */
.avery-site .hero-collage{min-height:510px}
.avery-site .hero-collage::before{inset:64px 14px 22px 42px;border-radius:0;background:var(--page-accent-2);opacity:.92;transform:rotate(-8deg)}
.avery-site .hero-collage::after{content:"";position:absolute;z-index:-2;width:58%;aspect-ratio:1;left:3%;bottom:4%;background:var(--page-accent);opacity:.94;transform:rotate(11deg)}
.avery-site .hero-collage-plane{filter:none}
.avery-site .hero-tile{border:5px solid #f6f3ed;border-radius:0;box-shadow:0 24px 50px rgba(0,0,0,.35)}
.avery-site .hero-tile img{filter:saturate(1.04) contrast(1.02)}
.avery-site .hero-tile-label{background:rgba(16,24,39,.88);color:#fff;border-radius:0}
.avery-site .hero-collage figcaption{color:#aeb9ca}

/* Typography and section rhythm. */
.avery-site main>.section,.avery-site main>.section-sm{position:relative}
.avery-site main>.section:not(.dark-section):not(.recognition-section),.avery-site main>.section-sm:not(.story-identify):not(.sample-section){background:var(--avery-cream)}
.avery-site main>.section:nth-of-type(odd):not(.page-hero):not(.dark-section):not(.recognition-section),.avery-site main>.section-sm:nth-of-type(odd):not(.story-identify):not(.sample-section){background:#fff}
.avery-site .eyebrow::before{width:10px;height:10px;border-radius:0;background:currentColor}
.avery-site .h2{font-weight:875}
.avery-site .section .h2,.avery-site .section-sm .h2{max-width:900px}

/* Bold Avery color fields on the sections that already act as editorial pivots. */
.avery-site .story-identify{background:var(--avery-coral)!important;color:var(--avery-navy)}
.avery-site .story-identify .eyebrow,.avery-site .story-identify .lead,.avery-site .story-identify p{color:#253040}
.avery-site .sample-section{background:var(--avery-teal)!important;color:var(--avery-navy)}
.avery-site .sample-section .eyebrow,.avery-site .sample-section .lead{color:#264653}
.avery-site .recognition-section{background:var(--avery-gold)!important;color:var(--avery-navy)}
.avery-site .recognition-section .eyebrow,.avery-site .recognition-section .lead{color:#3f4651}
.avery-site .dark-section{background:var(--avery-navy)!important}
.avery-site .dark-section::before{width:430px;height:430px;border-radius:0;background:var(--avery-teal);opacity:.08;right:-135px;top:-180px;transform:rotate(19deg)}

/* Square, editorial cards — color is used in deliberate blocks instead of little accents. */
.avery-site .product-grid,.avery-site .story-signal-grid{gap:0}
.avery-site .product-card,.avery-site .story-signal,.avery-site .advisor-card{border:0;border-radius:0;box-shadow:none}
.avery-site .product-grid>.product-card:nth-child(1){background:var(--avery-navy);color:#fff}
.avery-site .product-grid>.product-card:nth-child(1) p{color:#c5cfdb}
.avery-site .product-grid>.product-card:nth-child(1) .num{background:var(--avery-teal);color:var(--avery-navy)}
.avery-site .product-grid>.product-card:nth-child(2){background:var(--avery-gold);color:var(--avery-navy)}
.avery-site .product-grid>.product-card:nth-child(2) p{color:#414956}
.avery-site .product-grid>.product-card:nth-child(2) .num{background:var(--avery-navy)}
.avery-site .product-grid>.product-card:nth-child(3){background:var(--avery-teal);color:var(--avery-navy)}
.avery-site .product-grid>.product-card:nth-child(3) p{color:#294754}
.avery-site .product-grid>.product-card:nth-child(3) .num{background:var(--avery-navy)}

.avery-site .story-signal-grid>.story-signal:nth-child(1){background:#fff}
.avery-site .story-signal-grid>.story-signal:nth-child(2){background:var(--avery-navy);color:#fff}
.avery-site .story-signal-grid>.story-signal:nth-child(2) p{color:#c3cdda}
.avery-site .story-signal-grid>.story-signal:nth-child(3){background:var(--avery-gold)}
.avery-site .story-signal-grid>.story-signal:nth-child(3) p{color:#414956}
.avery-site .story-signal-grid>.story-signal:nth-child(4){background:var(--avery-teal)}
.avery-site .story-signal-grid>.story-signal:nth-child(4) p{color:#294754}
.avery-site .story-signal::before{color:rgba(16,24,39,.11)}
.avery-site .story-signal-grid>.story-signal:nth-child(2)::before{color:rgba(255,255,255,.10)}

/* Tables become broad graphic bands. */
.avery-site .feature-table{border:0;border-radius:0;box-shadow:0 16px 40px rgba(16,24,39,.08)}
.avery-site .feature-row{border-color:rgba(16,24,39,.12)}
.avery-site .feature-row>div:first-child{background:var(--avery-navy);color:#fff}
.avery-site .feature-row:nth-child(even)>div:first-child{background:#17233b}
.avery-site .feature-row>div:last-child{background:#fff}

/* Portfolio and book/site samples keep the work clean while the surrounding page supplies color. */
.avery-site .portfolio-piece{border-radius:0;border:0;box-shadow:0 16px 36px rgba(16,24,39,.12)}
.avery-site .portfolio-piece figure{border-bottom:0}
.avery-site .piece-copy{border-top:5px solid var(--avery-coral)}
.avery-site .portfolio-piece:nth-child(3n+2) .piece-copy{border-top-color:var(--avery-gold)}
.avery-site .portfolio-piece:nth-child(3n) .piece-copy{border-top-color:var(--avery-teal)}

/* About/recognition, offers and contact get the same strong-block treatment. */
.avery-site .fact{border-radius:0}
.avery-site .award-panel{border-radius:0;box-shadow:none;border:0}
.avery-site .award-panel-national{background:#fff}
.avery-site .award-panel-local{background:var(--avery-navy);color:#fff}
.avery-site .award-panel-local p{color:#c3cdda}
.avery-site .offer{border-radius:0;background:var(--avery-teal)}
.avery-site .offer .lead,.avery-site .offer p{color:#294754}
.avery-site .contact-panel{border-radius:0;background:var(--avery-navy)}
.avery-site .form-card{border-radius:0;border:0;box-shadow:0 18px 44px rgba(16,24,39,.11)}
.avery-site .faq-item{border-radius:0;border:0;border-bottom:1px solid rgba(16,24,39,.13)}
.avery-site .faq-item:first-child{border-top:1px solid rgba(16,24,39,.13)}
.avery-site .faq-q{padding-inline:0}
.avery-site .faq-a>div{padding-left:0;padding-right:0}

/* Quote panels mirror the homepage's dark editorial sections. */
.avery-site .quote{border-radius:0;background:var(--avery-navy);box-shadow:none}
.avery-site .quote::before{content:"";position:absolute;width:180px;height:180px;right:-54px;top:-72px;background:var(--avery-coral);opacity:.9;transform:rotate(16deg)}
.avery-site .quote::after{right:28px;bottom:-108px;opacity:.045}

.avery-site .btn{border-radius:0}
.avery-site .btn-accent{background:var(--avery-gold);color:var(--avery-navy)}
.avery-site .btn-primary{border-radius:0}
.avery-site .site-footer{background:#0c1422}

/* 404 gets the same stage even though it has no normal page hero. */
.avery-site.avery-404 main>.section{min-height:calc(100svh - 82px);display:grid;align-items:center;background:var(--avery-navy-2)!important;color:#fff;overflow:hidden}
.avery-site.avery-404 main>.section::after{content:"";position:absolute;width:430px;height:430px;right:-120px;bottom:-160px;background:var(--avery-coral);transform:rotate(18deg)}
.avery-site.avery-404 main>.section>.narrow{position:relative;z-index:1}
.avery-site.avery-404 .lead{color:#c6d0dc}
.avery-site.avery-404 .eyebrow{color:var(--avery-gold)}

@media(max-width:980px){
  .avery-site .page-hero-grid{grid-template-columns:1fr;gap:32px;min-height:0}
  .avery-site .page-hero-copy{max-width:780px}
  .avery-site .hero-collage{max-width:760px;width:100%;margin-inline:auto}
  .avery-site .nav{background:#0e182a;border-color:rgba(255,255,255,.13)}
  .avery-site .nav a:hover{background:rgba(255,255,255,.07)}
}
@media(max-width:680px){
  .avery-site .page-hero{padding:54px 0 62px}
  .avery-site .page-hero .h1{font-size:clamp(3rem,14vw,4.75rem)}
  .avery-site .page-hero::after{right:-45vw;bottom:-30vw;opacity:.6}
  .avery-site .hero-collage{min-height:350px}
  .avery-site .story-signal-grid,.avery-site .product-grid{gap:0}
  .avery-site .page-color-reveal{top:72px}
  .avery-site .feature-row>div:first-child{padding-bottom:18px}
  .avery-site .feature-row>div:last-child{padding-top:18px}
}