/*
Theme Name: ActivateDigital Demo Shop
Template: twentytwentyfive
Description: The look of the ActivateDigital WooCommerce demo shop.
Version: 1.0.0
Author: ActivateDigital
Text Domain: activatedigital-demo
*/

:root{--ad-c:#0B67D0;--ad-cd:#0757B8;--ad-n:#0A1A30;--ad-mut:#5A6B82;--ad-line:rgba(10,26,48,.1);--ad-wash:#F4F8FD}
body{-webkit-font-smoothing:antialiased;letter-spacing:-.011em}

/* Header */
.ad-bar{background:var(--ad-n);color:#fff;font-size:13px}
.ad-bar a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.ad-head{border-bottom:1px solid var(--ad-line);background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(10px)}
.ad-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ad-n);font-weight:650;font-size:17px;letter-spacing:-.02em}
.ad-brand img{width:30px;height:30px}
.ad-brand span b{color:var(--ad-c);font-weight:650}
.ad-brand small{display:block;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ad-mut)}

/* Hero */
.ad-hero{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 85% 10%,#1B4F95 0%,var(--ad-n) 55%)}
.ad-hero h1{letter-spacing:-.035em}
.ad-hero .ad-eye{font-size:12px;font-weight:650;letter-spacing:.14em;text-transform:uppercase;color:#8FC2FF}
.ad-hero p a{color:#fff;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(255,255,255,.45)}
.ad-hero p a:hover{text-decoration-color:#fff}
.ad-hero .wp-block-image img{border-radius:24px;box-shadow:0 40px 80px -40px rgba(0,0,0,.6)}
.ad-orb{position:absolute;right:-120px;top:-120px;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(59,142,232,.35),transparent 65%);pointer-events:none}

/* Passport strip */
.ad-strip{border:1px solid var(--ad-line);border-radius:20px;background:var(--ad-wash)}
.ad-step{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ad-c)}

/* Category tiles and product cards */
.ad-cats a{text-decoration:none}
.wc-block-product-template .wc-block-product,.wp-block-woocommerce-product-template li,
.wp-block-post-template.wc-block-product-template > li{transition:transform .25s ease}
.wc-block-components-product-image img,.wp-block-woocommerce-product-image img{border-radius:18px;background:var(--ad-wash);
  transition:transform .35s ease,box-shadow .35s ease}
.wc-block-product:hover .wc-block-components-product-image img,
.wp-block-post:hover .wp-block-woocommerce-product-image img{transform:translateY(-4px);box-shadow:0 18px 36px -24px rgba(10,26,48,.45)}
.wp-block-post-title a,.wc-block-components-product-name{text-decoration:none;color:var(--wp--preset--color--contrast)}
.wp-block-post-title a:hover{color:var(--wp--preset--color--accent-1)}

/* Buttons */
.wp-element-button,.wp-block-button__link,.single_add_to_cart_button,.wc-block-components-button{border-radius:12px!important;font-weight:600;transition:background .2s,transform .2s}
.wp-element-button:hover,.wp-block-button__link:hover{transform:translateY(-1px)}

/* The passport link the plugin places under the summary. It is the thing being shown,
   so it reads as its own card rather than a stray line of text. */
.activate-digital-passport{margin:22px 0 6px;padding:0}
.activate-digital-passport a{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid #CFE0F6;
  border-radius:16px;background:var(--ad-wash);color:var(--ad-n);font-weight:650;font-size:16px;text-decoration:none;
  transition:border-color .2s,box-shadow .2s,transform .2s}
.activate-digital-passport a::before{content:"";flex:none;width:38px;height:38px;border-radius:10px;
  background:#fff url("assets/img/mark.svg") center/24px no-repeat;box-shadow:inset 0 0 0 1px var(--ad-line)}
.activate-digital-passport a:hover{border-color:var(--ad-c);box-shadow:0 12px 28px -20px rgba(11,103,208,.8);transform:translateY(-1px)}
.ad-pp-note{margin:6px 0 0;font-size:13px;color:var(--ad-mut)}

/* Product page */
.woocommerce-product-gallery img,.wp-block-woocommerce-product-image-gallery img{border-radius:22px}
.single-product .wp-block-post-title{letter-spacing:-.03em}
.woocommerce-tabs,.wp-block-woocommerce-product-details{border-top:1px solid var(--ad-line);padding-top:12px}

/* Footer */
.ad-foot{background:var(--ad-n);color:#C3CEDC}
.ad-foot a{color:#fff;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.35)}
.ad-foot a:hover{text-decoration-color:#fff}
.ad-foot .ad-fine{font-size:13px;color:#8C9AB0}

/* Motion: things arrive once, gently. Nothing moves for anyone who asked it not to. */
@media (prefers-reduced-motion:no-preference){
  .ad-rise{animation:adRise .7s cubic-bezier(.2,.7,.2,1) both}
  .ad-rise.d2{animation-delay:.08s}.ad-rise.d3{animation-delay:.16s}.ad-rise.d4{animation-delay:.24s}
  .ad-orb{animation:adFloat 14s ease-in-out infinite alternate}
}
@keyframes adRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes adFloat{to{transform:translate(-40px,30px) scale(1.06)}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Phones */
@media (max-width:781px){
  .ad-hero .wp-block-buttons{flex-direction:column;align-items:stretch}
  .ad-hero .wp-block-button,.ad-hero .wp-block-button__link{width:100%;text-align:center}
  .ad-brand small{display:none}
}
