/* ============================================================
   Samora Ceylon: template-footer.css v13.0 (Emerald Crown)
   Prefix: tt-ft- | Every colour, font, radius and shadow comes from
   main.css tokens. Nothing is hardcoded here.

   A layered deep emerald ground with a faint gold lattice, crowned
   by a metallic gold band and a centred diamond. Four equal-height
   columns divided by gold hairlines; headings carry a gold rule that
   draws out on hover; columns rise in as the footer scrolls into
   view (where the browser supports scroll-driven animation). The
   bottom bar sits on emerald night.
   ============================================================ */

:root{
    --tt-ft-bg:
        radial-gradient(ellipse 55% 70% at 8% 0%,rgba(var(--er-gold-bright-rgb),0.10),transparent 60%),
        radial-gradient(ellipse 50% 80% at 100% 100%,rgba(var(--er-emerald-rgb),0.9),transparent 70%),
        linear-gradient(180deg,var(--er-emerald-deep) 0%,var(--er-emerald-night) 100%);
    --tt-ft-lattice:
        repeating-linear-gradient(45deg,rgba(var(--er-gold-bright-rgb),0.035) 0 1px,transparent 1px 28px),
        repeating-linear-gradient(-45deg,rgba(var(--er-gold-bright-rgb),0.035) 0 1px,transparent 1px 28px);
    --tt-ft-line:      rgba(var(--er-gold-bright-rgb), 0.18);
    --tt-ft-text:      var(--er-pearl);
    --tt-ft-dim:       var(--er-emerald-mist);
    --tt-ft-mute:      var(--er-gold-soft);
    --tt-ft-gold:      var(--er-gold-bright);
    --tt-ft-gold-lt:   var(--er-gold-soft);
    --tt-ft-gold-line: rgba(var(--er-gold-bright-rgb), 0.55);
    --tt-ft-ease:      cubic-bezier(0.2, 0.7, 0.2, 1);
}

.tt-footer{position:relative;z-index:var(--z-index-10);isolation:isolate;overflow:hidden;background:var(--tt-ft-bg);font-family:var(--font-primary);color:var(--tt-ft-text);}
/* faint gold lattice */
.tt-footer::after{content:'';position:absolute;inset:0;z-index:-1;background:var(--tt-ft-lattice);pointer-events:none;
    -webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 85%);mask-image:linear-gradient(180deg,#000 0%,transparent 85%);}
/* metallic gold crown band with a travelling shimmer */
.tt-footer::before{content:'';position:absolute;left:0;right:0;top:0;height:3px;
    background:linear-gradient(90deg,var(--er-gold-burnished),var(--er-gold-antique) 25%,var(--er-gold-soft) 50%,var(--er-gold-antique) 75%,var(--er-gold-burnished));
    background-size:200% 100%;animation:tt-ft-shimmer 7s linear infinite;box-shadow:0 0 18px rgba(var(--er-gold-bright-rgb),0.45);}
/* centred diamond on the band */
.tt-ft-grid::before{content:'';position:absolute;left:50%;top:-6px;width:12px;height:12px;margin-left:-6px;transform:rotate(45deg);
    background:var(--gradient-gold-metal);box-shadow:0 0 0 4px var(--er-emerald-deep),0 0 16px rgba(var(--er-gold-bright-rgb),0.7);}
/* resets use :where() so they never outrank the component rules below */
:where(.tt-footer) *{box-sizing:border-box;}
:where(.tt-footer) a{color:inherit;text-decoration:none;}
:where(.tt-footer) ul{list-style:none;margin:0;padding:0;}
:where(.tt-footer) p{margin:0;}
.tt-footer [hidden]{display:none!important;}
.tt-footer :focus-visible{outline:2px solid var(--tt-ft-gold);outline-offset:2px;border-radius:var(--radius-xs);}

.tt-ft-wrap{max-width:var(--container-wide);margin:0 auto;padding-left:24px;padding-right:24px;}

/* four equal-height columns */
.tt-ft-grid{position:relative;display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;align-items:stretch;padding-top:56px;padding-bottom:40px;}
.tt-ft-col{min-width:0;padding:0 32px;}
.tt-ft-col:first-child{padding-left:0;}
.tt-ft-col:last-child{padding-right:0;}
.tt-ft-col + .tt-ft-col{border-left:1px solid;border-image:linear-gradient(180deg,transparent,var(--tt-ft-line) 15%,var(--tt-ft-line) 85%,transparent) 1;}

/* brand column */
.tt-ft-brand-link{display:flex;align-items:center;gap:14px;}
.tt-ft-logo-wrap{position:relative;width:64px;height:64px;display:grid;place-items:center;flex:none;border-radius:50%;isolation:isolate;
    box-shadow:0 0 0 1.5px rgba(var(--er-gold-bright-rgb),0.85),0 0 0 4px rgba(var(--er-gold-bright-rgb),0.12),0 0 16px 2px rgba(var(--er-gold-bright-rgb),0.30);
    animation:tt-ft-logo-glow 3.6s ease-in-out infinite;}
/* v2: same gold rim, travelling shine and breathing glow as the header logo */
.tt-ft-logo-wrap::after{content:'';position:absolute;inset:-4px;border-radius:50%;pointer-events:none;z-index:2;
    background:conic-gradient(from 0deg,transparent 0deg,transparent 200deg,rgba(var(--er-gold-bright-rgb),0.15) 240deg,var(--er-gold-soft) 300deg,#FFFFFF 318deg,var(--er-gold-bright) 334deg,transparent 360deg);
    -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));
    animation:tt-ft-spin 4.2s linear infinite;}
@keyframes tt-ft-logo-glow{0%,100%{box-shadow:0 0 0 1.5px rgba(var(--er-gold-bright-rgb),0.85),0 0 0 4px rgba(var(--er-gold-bright-rgb),0.12),0 0 14px 1px rgba(var(--er-gold-bright-rgb),0.25);}50%{box-shadow:0 0 0 1.5px rgba(var(--er-gold-bright-rgb),1),0 0 0 4px rgba(var(--er-gold-bright-rgb),0.2),0 0 24px 4px rgba(var(--er-gold-bright-rgb),0.45);}}
@media (prefers-reduced-motion:reduce){.tt-ft-logo-wrap,.tt-ft-logo-wrap::after{animation:none;}}
.tt-ft-logo{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;border-radius:50%;}
.tt-ft-brand-name{font-family:var(--font-display);font-size:30px;font-weight:var(--font-weight-semibold);line-height:1;
    background:linear-gradient(100deg,var(--er-pearl) 0%,var(--er-pearl) 40%,var(--er-gold-soft) 50%,var(--er-pearl) 60%,var(--er-pearl) 100%);background-size:250% 100%;
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:tt-ft-shimmer 9s linear infinite;}
.tt-ft-tag{margin-top:14px;font-family:var(--font-label);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;line-height:1.6;color:var(--tt-ft-gold);}
.tt-ft-desc{margin:10px 0 18px;max-width:40ch;font-size:14px;line-height:1.7;color:var(--tt-ft-dim);}

.tt-ft-contact{display:flex;flex-direction:column;gap:9px;font-size:13px;}
.tt-ft-contact li{display:flex;align-items:flex-start;gap:12px;color:var(--tt-ft-dim);min-width:0;transition:transform .3s var(--tt-ft-ease);}
.tt-ft-contact li:hover{transform:translateX(3px);}
.tt-ft-contact li i{width:26px;height:26px;margin-top:-4px;display:grid;place-items:center;border-radius:50%;font-size:11px;color:var(--tt-ft-gold);background:rgba(var(--er-gold-bright-rgb),0.08);border:1px solid rgba(var(--er-gold-bright-rgb),0.28);flex:none;transition:background .3s,color .3s;}
.tt-ft-contact li:hover i{background:var(--tt-ft-gold);color:var(--er-emerald-night);}
.tt-ft-contact a{overflow-wrap:anywhere;transition:color .25s;}
.tt-ft-contact a:hover{color:var(--tt-ft-gold-lt);}
.tt-ft-contact small{display:block;margin-top:2px;font-size:12px;color:var(--tt-ft-mute);}

.tt-ft-social{display:flex;gap:10px;margin-top:18px;}
.tt-ft-social a{width:38px;height:38px;border:1px solid var(--tt-ft-gold-line);border-radius:50%;display:grid;place-items:center;font-size:13px;color:var(--tt-ft-gold);transition:background .3s,color .3s,transform .4s cubic-bezier(0.34,1.56,0.64,1),box-shadow .3s;}
.tt-ft-social a:hover{background:var(--gradient-gold-metal);color:var(--er-emerald-night);transform:translateY(-3px);box-shadow:0 10px 22px -10px rgba(var(--er-gold-bright-rgb),0.8);}

/* link columns */
.tt-ft-h{position:relative;margin:0 0 14px;padding-bottom:12px;font-family:var(--font-display);font-size:21px;font-weight:var(--font-weight-semibold);line-height:1.2;color:var(--tt-ft-text);}
.tt-ft-h::after{content:'';position:absolute;left:0;bottom:0;width:36px;height:2px;border-radius:2px;background:var(--gradient-gold-metal);transition:width .6s var(--tt-ft-ease);}
.tt-ft-h::before{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--tt-ft-line);}
.tt-ft-col:hover .tt-ft-h::after{width:100%;}
.tt-ft-links{display:flex;flex-direction:column;}
.tt-ft-links a{position:relative;display:flex;align-items:center;gap:10px;padding:4px 0;font-size:13.5px;line-height:1.45;color:var(--tt-ft-dim);transition:color .25s,transform .35s var(--tt-ft-ease);}
.tt-ft-links a::before{content:'';width:5px;height:5px;transform:rotate(45deg);border:1px solid var(--tt-ft-gold-line);transition:background .25s,box-shadow .25s,transform .35s var(--tt-ft-ease);flex:none;}
.tt-ft-links a:hover,.tt-ft-links a.is-active{color:var(--tt-ft-gold-lt);transform:translateX(5px);}
.tt-ft-links a:hover::before,.tt-ft-links a.is-active::before{background:var(--tt-ft-gold);box-shadow:0 0 10px rgba(var(--er-gold-bright-rgb),0.9);transform:rotate(225deg);}
.tt-ft-sub{display:block;margin:16px 0 6px;font-family:var(--font-label);font-size:10.5px;font-weight:var(--font-weight-semibold);letter-spacing:.18em;text-transform:uppercase;color:var(--tt-ft-gold);}
.tt-ft-sub--first{margin-top:0;}

/* bottom bar */
.tt-ft-bottom{position:relative;background:rgba(var(--er-scrim-rgb),0.65);border-top:1px solid var(--tt-ft-line);}
.tt-ft-bottom-in{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;padding-top:16px;padding-bottom:16px;padding-right:110px;font-size:12.5px;letter-spacing:.02em;color:var(--tt-ft-mute);}
.tt-ft-bottom a{transition:color .25s;}
.tt-ft-bottom a:hover{color:var(--tt-ft-gold);}
.tt-ft-bottom p,.tt-ft-copy{color:var(--tt-ft-mute);}
.tt-ft-credit b{color:var(--tt-ft-text);letter-spacing:.08em;}

/* columns rise in as the footer enters the viewport */
@supports (animation-timeline: view()){
    .tt-ft-col{animation:tt-ft-rise linear both;animation-timeline:view();animation-range:entry 0% entry 70%;}
    .tt-ft-col:nth-child(2){animation-range:entry 5% entry 75%;}
    .tt-ft-col:nth-child(3){animation-range:entry 10% entry 80%;}
    .tt-ft-col:nth-child(4){animation-range:entry 15% entry 85%;}
}
@keyframes tt-ft-rise{from{opacity:0;transform:translateY(28px);}to{opacity:1;transform:none;}}
@keyframes tt-ft-shimmer{from{background-position:100% 0;}to{background-position:-100% 0;}}
@keyframes tt-ft-spin{to{transform:rotate(360deg);}}

/* responsive */
@media (max-width:1024px){
    .tt-ft-grid{grid-template-columns:1fr 1fr;row-gap:32px;}
    .tt-ft-col:nth-child(2){padding-right:0;}
    .tt-ft-col:nth-child(3){padding-left:0;border-left:0;}
}
@media (max-width:640px){
    .tt-ft-wrap{padding-left:16px;padding-right:16px;}
    .tt-ft-grid{grid-template-columns:1fr;row-gap:28px;padding-top:36px;padding-bottom:28px;}
    .tt-ft-col,.tt-ft-col + .tt-ft-col{padding:0;border-left:0;}
    .tt-ft-bottom-in{padding-right:16px;padding-bottom:96px;}
}
@media (prefers-reduced-motion:reduce){
    .tt-footer,.tt-footer *,.tt-footer::before,.tt-ft-col{transition:none!important;animation:none!important;}
}